@import url("fontawesome-all.min.css");
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic");



.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/loader.gif') 50% 50% no-repeat rgb(249,249,249);
    opacity: .8;
}


#wrapper {
position: relative; 
height: 100%;


}


#map {
height: 95%;
}

html, body {
min-height:100%;
height:100%;
margin: 0;
padding: 0;
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;

}


/* Button used to open the contact form - fixed at the bottom of the page */
.open-button {
background-color: #555;
color: white;
padding: 10px 15px;
border: none;
cursor: pointer;
opacity: 0.8;
position: fixed;
bottom: 23px;
left: 15px;
width: 250px;
}
/* Button used to open the from index page form */
.opengeocoder-button {
background-color: #4CAF50;
color: white;
padding: 10px 15px;
border: none;
cursor: pointer;
opacity: 0.8;
font-size: h2;
}

/* Button used to open the contact form - fixed at the bottom of the page */
.go-button {
background-color: #4CAF50;
color: white;
padding: 5px 5px;
border: none;
cursor: pointer;
opacity: 0.8;
}


#accuracy-alert {
	display:none;
	position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

/* The popup form - hidden by default positsion = absoliute*/
.form-popup {
display: none;
position: relative; 
bottom: 0;
left: 10px;

position: fixed;
bottom: 10px;

border: 3px solid #f1f1f1;
z-index: 1;
 
}
/* Add styles to the form container */
.form-container {
max-width: 300px;
padding: 5px;
background-color: white;
height: 71vh;
overflow: auto;
overflow-y: auto;
 
}
/* Full-width input fields */
.form-container input[type=text] {
width: 85%;
padding: 5px;
margin: 5px 0 5px 0;
border: none;
background: #f1f1f1;
}
/* When the inputs get focus, do something */
.form-container input[type=text]:focus  {
background-color: #ddd;
outline: none;
}
/* Set a style for the submit/login button */
.form-container .btn {
background-color: #4CAF50;
color: white;
padding: 10px 15px;
border: none;
cursor: pointer;
width: 100%;
margin-bottom:5px;
opacity: 0.8;
}
/* Add a red background color to the cancel button */
.form-container .cancel {
background-color: red;
}

.form-container .save {
background-color: blue;
}
/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover, .go-button:hover {
opacity: 1;
}

/* Google Places AutoSuggest Full Width to Row */
.form-container .pac-container, .pac-item {
    width: inherit !important;
}



/*the container must be positioned relative:*/
.AutoCompleteDiv {
  position: relative;
  display: none;
  
}

li.no-bullets {
  list-style-type: none; /* Remove bullets */
  padding: 0; /* Remove padding */
  margin: 0; /* Remove margins */
}

.AutoCompleteDiv-items {
  position: absolute;
  border: 1px solid #d4d4d4;
   border-top: none;
  z-index: 10;
  /*position the autocomplete items to be the same width as the container:*/
  top: 85%;
  left: 0;
  right: 0;
  padding: 5px;
  /*cursor: pointer;*/
  background-color: #fff; 
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  width: inherit !important;
  
  
}

.AutoCompleteDiv-items a {
  padding: 1px;
  cursor: pointer;
  background-color: #fff; 
  font-size: h4;
 
  
}

/*when hovering an item:*/
.AutoCompleteDiv-items a:hover {
  background-color: #e9e9e9; 
}

*when hovering an item:*/
.AutoCompleteDiv-items div:hover {
  background-color: #e9e9e9; 
}

/*when navigating through the items using the arrow keys:*/
.AutoCompleteDiv-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}


.profilewrapperbackground {
background: url(../img/profilebackground.jpg) no-repeat center center fixed;
    background-size: cover;
	height:100%;
	
}


.profilecontent {
	
width: 75%;
padding: 5px;
background-color: white;
height: 71vh;
overflow: auto;
overflow-y: auto;
 margin: auto;
 border: 1px solid #ccc; /* THIS */
  border-radius: 4px; /* THIS */

}