a, .nav-tabs > .active > a, .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus {
  outline: none !important
}
.gm-style-mtc div[role="button"] + div {
  top: -90px !important;
}
#map {
  height: 750px;
  border: 1px solid #ddd;
  border-radius: 4px;
}
#maplegend hr {
  margin: 10px !important;
  border-color: #ddd;
}
.nav-tabs {
  margin-top: 6px;
}
.panel {
  font-family: Verdana, Geneva, sans-serif;
  border-color: #ddd;
}
.panel-heading {
  color: #FFF;
  font-weight: bold;
  border-bottom: 1px #CCC solid;
  padding-left: 8px !important;
}
.panel-body {
  padding: 4px !important;
}
.panel-footer {
  font-size: .80em;
}
.panel-interchanges, .panel-tb, .panel-camera, .panel-truckcamera, .panel-parkride, .panel-roadwork, .panel-incident, .panel-tp, .panel-restarea, .panel-ram, .panel-wta {
  width: 450px;
}
.panel-tollgantry {
  width: 500px;
}
/*interchange layer */
.panel-interchanges .panel-heading {
  background-color: #1F6D09;
}
.panel-tb .panel-heading {
  background-color: #fff;
  color: #1F6D09
}
/*milepost layer */
.panel-mp {
  border-color: #1E900C;
}
.panel-mp .panel-heading {
  background-color: #1E900C;
}
/*camera layer */
.panel-camera .panel-heading {
  background-color: #dbe5ee;
  color: #000;
  text-transform: none
}
.panel-truckcamera .panel-heading{
  background-color: #dccabc;
  color: #000;
  text-transform: none
}
#stillimage, #livevideo {
  min-height: 260px !important;
  margin-top: 10px;
}
#stillimage img {
  min-height:240px;
}
.video-js {
  margin: auto !important
}
/*park and ride layer */
.panel-parkride {
  height: 350px;
}
.panel-parkride .panel-heading {
  background-color: #000;
}
/*roadwork layer */
.panel-roadwork .panel-heading {
  background-color: #C36D02;
  text-transform: uppercase;
  color: #fff;
}
/*incident layer */
.panel-incident .panel-heading {
  background-color: red;
  text-transform: uppercase;
}
/*travel plaza layer */
.panel-tp .panel-heading {
  background-color: #8c4eb8;
}
.panel-tp .panel-body {
  max-height: 350px;
  overflow: auto;
}
/*rest area layer */
.panel-restarea .panel-heading {
  background-color: #828080;
}
/*ram layer */
.panel-ram .panel-heading {
  background-color: #00438d;
}
.panel-ram .panel-body {
  height: 300px;
  overflow: auto;
}
.rammsg {
  padding: 3px;
  background-color: #FFFF99;
  border: 1px solid #CCC;
}
/*wta layer */
.panel-wta .panel-heading {
  background-color: #37689D;
}
/*dms layer*/
.eventboxdms {
  font-family: Verdana, Arial, Helvetica, sans-serif !important;
  margin-top: 8px;
  padding: 6px;
  border: #999 3px solid;
  border-radius: 4px;
  background-color: #252525;
  font-weight: normal !important;
  color: #f39a18;
  width: 275px;
  min-height: 70px;
  text-transform: uppercase;
  text-align: center;
  font-size: 18px !important;
}
.eventboxdms .dmslinebreak {
  height: 5px;
  display: block;
}
.eventboxmilepost {
  font-family: Verdana, Arial, Helvetica, sans-serif !important;
  padding: 4px;
  background-color: #1E900C;
  font-weight: bold !important;
  color: #fff;
  border: #999 1px solid;
  border-radius: 4px;
}
/**************************************/
#satellitemap {
  width: 420px;
  height: 225px;
  margin: 0 10px;
}
#mapview {
  width: 420px;
  height: 211px;
}
#ttcmsgline1, #ttcmsgline2, #cutoffmsgline1 {
  font-size: .90em !important;
}
.navsection {
  margin: 3px 0 0 0;
  padding: 0 3px 0 3px;
}
#ttcmsgline1, #ttcmsgline2, #cutoffmsgline1 {
  font-size: 0.9em !important;
}
/********** Google Maps Travel Plaza columns **************/
#tplist {
  display: none;
  padding: 5px;
  margin: 0 0 10px 15px !important;
  width: 100%;
}
.tplistleftcol {
  float: left;
  width: 45%;
  border-right: #ccc 1px solid;
  padding-left: 2px;
  padding-bottom: 5px;
}
.tplistrightcol {
  float: right;
  width: 49%;
  padding-left: 2px;
}
/************Toll Gantry Legend ***********/
#tolllegend {
  display: none;
  padding-top: 0px;
  float: left;
  padding-left: 0;
  font-size: .70em;
  margin: 10px 0 10px 20px;
}
/********** Google Maps Traffic Conditions Legend **************/
#tclegend {
  display: none;
  margin-left: 20px;
  font-size: .80em;
  margin-bottom: 0px;
}
#tcoff {
  display: none;
  margin-left: 20px;
  font-size: .80em;
  color: #575757;
  margin-bottom: 0px;
}
/* colors for Google Traffic font awesome circle indicator */
.good {
  color: #12b92f;
}
.fair {
  color: #ffb53a;
}
.slow {
  color: #ff0000;
}
.veryslow {
  color: #c00000;
}
/********** Google Maps WTAS **************/
#wtaslegend {
  display: none;
  margin-left: 20px;
  font-size: .80em;
  margin-bottom: 0px;
}
#wtasoff {
  display: none;
  margin-left: 20px;
  font-size: .80em;
  color: #575757;
  margin-bottom: 0px;
}
#wtasoffseason {
  display: none;
  margin-left: 20px;
  font-size: .80em;
  color: #575757;
  margin-bottom: 0px;
}
/* colors for WTAS font awesome circle indicator */
.noreport {
  color: #b2b2b2;
}
.closed {
  color: #000000;
}
.clear {
  color: #55FF00;
}
.wet {
  color: #00C5FF;
}
.snowice {
  color: #FF66CC;
}
.severesnowice {
  color: #F00000;
}
/*misc google map styles*/
#loadingbox {
  border: medium double #036;
  background-color: wheat;
  background-color: #fcf8e3;
  position: absolute;
  text-align: center;
  bottom: 134px;
  right: 40%;
  display: none;
  padding: 10px;
  height: 85px;
  width: 140px;
  z-index: 990;
  font-family: Verdana, Arial, Helvetica, sans-serif !important;
  font-style: normal;
  font-size: smaller;
  text-transform: capitalize;
  color: black;
}
#refreshincidents, #refreshclosures, #refreshroadwork, #refreshdms, #refreshwta {
  visibility: hidden;
}
.vjs-live-display {
  padding-left: 10px !important;
  margin-right: -10px;
}
/* need to reset strong tag because google removed bold */
strong {
  font-weight: bold
}
.small {
  font-family: Verdana, Arial, Helvetica, sans-serif !important;
  font-size: 10px !important
}
.smaller {
  font-family: Verdana, Arial, Helvetica, sans-serif !important;
  font-size: 10px !important
}
/* map legend */
#maplegend {
  position: absolute;
  top: 75px !important;
  left: 20px;
  z-index: 2;
}
#maplegend .dropdown-menu {
  width: 310px;
  padding: 10px;
  min-height: 500px;
  font-size: 12px !important  
}
#navbutton {
    color:#fff !important;
    text-decoration: none !important;
  }
/* overrode sytles for MD devices */
@media only screen and (max-width: 1024px) {
  #maplegend {
    top: 75px !important;
    z-index: 2;
  }
}
/* overrode sytles for SM devices */
@media only screen and (max-width: 980px) {
  #maplegend {
    top: 75px !important;
    z-index: 2;
  }
}
/* overrode sytles for XS devices */
@media only screen and (max-width: 767px) {
  #maplegend {
    top: 110px !important;
    z-index: 2;
  }
  #maplegend .dropdown-menu {
    min-height: 520px;
  }
  #resetmap {
    margin-top: 10px;
    width: 100%;
    text-align: center;
  }
  #navbutton {
    margin-top: 10px;
    float: none !important;
    width: 100%;
    text-align: center;
    color:#fff !important;
    text-decoration: none !important;
  }
  #navdropdown {
    float: none !important;
  }
  .pull-right > .dropdown-menu {
    left: 0;
  }
}
@media only screen and (max-width: 479px) {
  .panel-interchanges, .panel-tb, .panel-camera, .panel-parkride, .panel-roadwork, .panel-incident, .panel-tp, .panel-restarea, .panel-ram, .panel-wta, .eventboxdms, .panel-tollgantry {
    width: 160px;
  }
  #map {
    height: 490px;
  }
  #imgToLoad, .video-js {
    width: 150px !important;
    height: 150px !important;
  }
  #tpimage {
    width: 170px;
    height: 170px;
  }
  #stillimage, #livevideo {
    min-height: 170px !important;
  }
  #satellitemap {
    width: 170px;
    height: 225px;
    margin: 0 10px;
  }
  #mapview {
    width: 170px;
    height: 211px;
  }
}