/* campus map style */
#hscoverlay {
  z-index: -1;
}
a{ color:#00778b}
.fa{color: #253746;}
div.main-category {
  text-transform: capitalize;
  font-size: 12pt;
}
#home {
  font-size: 1.25em;
}
/* Optional: Makes the sample page fill the window. */
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
h1.headerwlogo {text-align: center;margin-top:0px;}
.btn-hsc { color: #fff; background-color: #253746;}
#pac-input {
  font-family: Roboto;
  font-size: 15px;
  font-weight: 300;
  padding: 8px;
  text-overflow: ellipsis;
}
#pac-input:focus {
  border-color: #4d90fe;
}
#topheader {
  padding: 0px;
  position: absolute;
  background-color: #f5f5f5;
  z-index: 100;
  text-align: right;
  width: 100%;
  height: 10%;
}
button#mobileNav {
  border: none;
  background-color: #f5f5f5;
  margin: 10px 15px 10px 15px;
}
#topheader img.hsclogo {
  float: left;
}

#infoPanel:active,
#infoPanel:hover,
#infoPanel:focus {
    display: flex;
    outline: none;
}

#infoPanel {
  background-color: #f5f5f5;
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  top: 70px;
  z-index: 200;
  display:none;
}

#infoPanel form {
  margin-bottom: 15px;
  width: 100%;
  padding: 15px;
}
.input-group {
  width:100%;
}
#infoPanel a {
  width: 100%;
}

img.hsclogo {
  width: 70%;
  padding: 15px;
}

img.desktopLogo {
  width: 85%;
  padding: 15px;
}

div#infoPanelContent {
  font-size: 14pt;
  padding: 15px;
}
#Road{display:none;}
#Service{display:none;}
/*.ParkingOffice {display: none;}*/
#infoPanelContent .reference {
  padding: 5px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
}

.Academic-Administration,
.StudentLife,
.BusStop,
.AroundCampus,
.Dining,
.OnCampus,
.Employee,
.Student,
.Parking,
.Reserved,
.Patient,
.ParkingMeters,
.EmergencyPhoneLocation,
.ParkingAttendantBooth,
.BicycleRacks,
.BikeShareRentalStation {
  white-space: nowrap;
}

#map .gm-style .gmnoprint .gm-style-mtc {
  /*display: none;*/
}

#searchResult {
  background-color: #f5f5f5;
  z-index: 100;
  border: 1px solid black;
  clear: both;
  display: flex;
  flex-direction: column;
  margin: 15px;
}

.highlightQuery {
  background-color: yellow;
}

#searchResult ul {
  background-color: #f5f5f5;
  list-style-type: none;
  margin: 0;
  padding: 5px;
}

#searchResult ul li {
  border: 1px solid #7D7D7D;
  padding: 5px;
  cursor: pointer;
}

#searchResult ul li:hover {
  background-color: #e4e4e4;
}

li:nth-child(odd) {
  background-color: #f5f5f5;
}

li:nth-child(even) {
  background-color: #fff;
}

#resultClose {
  cursor: pointer;
  float: right;
  padding: 5px;
}

#resultClose:hover {
  background-color: #e4e4e4;
}

#infoPanelContent input[type=checkbox] {
  height: 1em;
  width: 1em;
  margin: 0px 7px 0px 0px;
  /*vertical-align: top;*/
  position: relative;
  top: 2px;
}

#infoPanelContent div.main-category.highlight {
  color: #fff;
  background-color: #253746;
}

.default-highlight {
  background-color: #e4e4e4;
}

#reference {
  font-size: 12pt;
  color: #64a0c8;
  margin-top: 15px;
}

.hsc_float {
  float: right;
  cursor: pointer;
}

#infoPanel div.main-category {
  padding: 3px;
  cursor: pointer;
}

#infoPanelContent div>div.main-category:hover {
  color: #fff;
  background-color: #253746;
}

#infoPanelContent div.main-category {
  margin: 5px 0px 0px 0px;
  cursor: pointer;
  padding: 5px 7px 8px 5px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  line-height: 1.25em;
  font-weight: 400;
}

label {
  font-size: 12pt;
  font-weight: normal;
  cursor: pointer;
  white-space: normal;
  margin-top: -3px;
  line-height: 1.25em;
}

div#infoPanelContent div>div>div:hover {
  background-color: #e4e4e4;
  cursor: pointer;
}

#searchReset {
  padding: 5px;
  cursor: pointer;
  float: left;
}

#searchReset:hover {
  background-color: #e4e4e4;
}

div[id^='reference'] {
  cursor: pointer;
  margin-bottom: 15px;
}

div[id$='Con'] {
  display: none;
}

.reference:hover {
  background-color: #00778b;
  color: #fff;
}

.gm-style-iw {
   max-width:350px;
   max-height:800px;
}
.text360, #panorama {
  right: 5%;
  top: 5%;
  position: absolute;
  z-index: 100;
}
.text360 span{ z-index: 105; }
.image360 {padding: 10px;}


.infodiv .infotitle {
  font-size: 13pt;
  line-height: 1.25em;
  display: block;
  border-radius: 2px 2px 0 0;
}

.infodiv div.infodetail {
  font-size: 11pt;
  line-height: 1.25em;

}
.infoClass {
  color: red!important;
}
/*
div [title="Click to recenter the map"] > div,
#map .gm-style div:nth-of-type(7) {
    left: 10px !important;
    top: 110px !important;
    width: 28px;
    height: 28px;
}

#map .gm-style div:nth-of-type(7) div {
  padding-right: 0px !important;
}

#map .gm-style div:nth-of-type(7) div div {
    padding: 0px !important;
    line-height: unset !important;
}

#map .gm-style div:nth-of-type(7) div div i#home {
    padding: 5px 0px 3px 0px;
}
*/

@media screen and (min-width: 767px) {
  #topheader {
    display: none;
  }
  #topheader img.hsclogo {
    display: none;
  }
  #infoPanel {
    height: 100%;
    width: 33%;
    max-width: 350px;
    min-width: 300px;
    float: left;
    position: relative;
    top:0px;
    display: flex !important;
    flex-direction: column;
    box-shadow: 0 -4px 3px 3px lightgray;
  }
  #menu-reset {display: none;}
  #menu-result {display: none;}
  #map {
    height: 100%;
    overflow: hidden;
  }
  #mapfooter {
  align-self: flex-end;
  }
}
/*If the browser window is 767px or smaller*/
@media screen and (max-width: 767px) {
  #infoPanel a img.hsclogo {
    display: none;
  }
  #map {
    height: 90%;
    position: absolute;
    top: 10%;
    right: 0px;
    bottom: 0px;
    left: 0px;
    overflow: hidden;
  }
  #map .gm-style .gmnoprint .gm-style-mtc {
    /*display: none;*/
  }
  #mapfooter {
    position: relative;
    bottom: 0px;
  }
}

/* footer */
#mapfooter {
  text-align: center;
  background-color: #fff;
  padding: 15px;
  width: 100%;
  line-height: 1.25em;
  margin: auto auto 0px auto;
}

.sideIcon {width:22px;height:22px;float: right;margin-right: 5px;}

#infoPanelContentCleryMap input[type=checkbox] {
  height: 1em;
  width: 1em;
  margin: 0px 7px 0px 0px;
  vertical-align: top;
  position: relative;
  top: 2px;
}
.clery {
  margin: 10px;
  padding: 5px;
}
.clery:hover{
  color: #fff;
  background-color: #253746;
}
.note{padding:20px;}

.btn.focus, .btn:focus, .btn:hover { color: white;}

#infoPanel a {color:#253746;}

#infoPanel a:hover {color:white; text-decoration:none;}

.headerMargin {margin:15px;}