html,
body {
  padding: 00px;
  margin: 0px;
  width: 100%;
  height: 100%;
  background: url(../images/london_skyview.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.mainHeader {
  color: white;
  font-weight: bold;
  font-size: 3em;
}


/*------------------------------------------------Map Section*/

.mapText {
  color: white;
  font-weight: 400;
}

.and-link {
  color: #E95420;
}

#map {
  width: 80%;
  height: 500px;
  margin-left: 20px;
}

#listing {
  width: 200px;
  height: 500px;
  overflow: auto;
  cursor: pointer;
  overflow-x: hidden;
}

#locationField {
  margin-top: 30px;
  margin-left: 20px;
  margin-bottom: 10px;
}

#autocomplete {
  width: 100%;
  text-align: center;
}

#resultsTable {
  border-collapse: collapse;
  width: 400px;
}

#rating {
  font-size: 13px;
  font-family: Arial;
}

.iw_table_row {
  height: 18px;
}

.iw_attribute_name {
  font-weight: bold;
  text-align: right;
}

.iw_table_icon {
  text-align: right;
}

.reset-button {
  text-align: center;
  margin-top: 15px;
}

/*------------------------------------------------Info Section*/
#infoSection{
  
}

.infoText {
  margin-top: 40px;
  margin-bottom: 40px;
  color: white;
  background-color: #b2b2b2;
  background-color: rgba(0, 0, 0, .4);
}

.instructions {
  margin-top: 50px;
}

.instructions li {
  margin-bottom: 20px;
}

/*------------------------------------------------MediaQueries*/

@media only screen and (max-width: 425px) {
  .mainHeader {
    color: white;
    font-weight: lighter;
    font-size: 2.5em;
  }
}

@media only screen and (max-width: 1200px) {
  #map {
    width: 70%;
  }
}

@media only screen and (max-width: 900px) {
  #locationField {
    width: 92%;
    margin-left: 15px;
  }

  #map {
    width: 92%;
    margin-left: 15px;
  }

  #listing {
    display: none;
  }
}

/* medium+ screen sizes*/
@media (min-width:992px) {
    #infoSection {
        display:block !important;
    }
    
}
 
/* so that on small screen sizes infoSection is hidden*/
@media (max-width: 766px) {
    #infoSection {
        display:block !important;
    }
 
    #infoSection {
        display:none !important;
    }
}


/*-------------------------------------------------------Extras*/

hr {
  background-color: #E95420;
  height: 5px;
}

.fa-male {
   color: #E95420;
   font-size: 2em;
   padding: 5px;
}

.alertBox{
		margin: 10px;
	}