body {
  margin: 0;
  padding: 0;
}

#map { background-color: #89D3CF; position: absolute; top: 42px; bottom: 0px; left: 0px; right: 0px; }
#map .ol-zoom { font-size: 1.2em; }

/** Navbar link style **/
.navbar-default .navbar-nav > li > a {
    color: #80351B;
    font-weight: bold; font-size: 180%; padding-right: 55px; padding-left: 55px;

}

.navbar-default .navbar-nav > li {
  
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #db0000;
    background-color: #ededed;
}

.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: middle;
}

.navbar .navbar-collapse {
  text-align: center;
}


#accordion-container
{
    position:absolute; 
    left: 8px; 
    bottom: 0; 
    margin:0px;
	opacity:0.9;
    z-index:100; 
    width:200px;

    font-family: Arial, sans-serif;
}

.panel-group {
  position:absolute;
  bottom:0px;
}

.panel-group .panel {
   border-radius: 5px 5px 5px 5px;
}

.panel-heading {
   border-radius: 5px 5px 5px 5px;
}

.legend-img-container {
    /*height:35px;*/
}
.legend-img {
  /*filter:         drop-shadow(5px 5px 5px #FFF); 
  -webkit-filter: drop-shadow(0px 0px 2px #000);*/
  width: 20px;
  height: 20px;
}
.legend-text {
  padding: 3px 7px;
  display: inline;
}


#accordion2-container {
    position: absolute;
    max-height: 50%;
    bottom: 16px;
    right: 8px;
    max-width: 20%;
    background: aliceblue;
    overflow-y: scroll;
    border-radius: 5px 5px 5px 5px;
    box-sizing: border-box;
    padding: 0 20px;
    font-family: Arial, sans-serif;

}

.pane-body {
    padding: 0 0px;
    text-align: justify;
    color: black;

}


/* Shrink the lightbox image container to prevent caption from overlaying */
.lg-img-wrap {
  height: calc(100% - 100px) !important;
}

.lg-backdrop.in {
  opacity: 0.1;
}

.ol-zoom {
     left: 2px;
     top: 60px;
  }

.ol-attribution {
  right: 50%;
}

  .vertical-legend .legend-title {
    text-align: left;
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 10pt;
    }
  .vertical-legend .legend-scale ul {
    margin: 0;
    margin-bottom: 5px;
    padding: 0;
    float: left;
    list-style: none;
    }
  .vertical-legend .legend-scale ul li {
    font-size: 100%;
    list-style: none;
    margin-left: 0;
    line-height: 18px;
    margin-bottom: 2px;
    }
  .vertical-legend ul.legend-labels li span {
    display: block;
    float: left;
    height: 16px;
    width: 30px;
    margin-right: 5px;
    margin-left: 0;
    border: 1px solid #999;
    }
  .vertical-legend .legend-source {
    font-size: 70%;
    color: #999;
    clear: both;
    }
  .vertical-legend a {
    color: #777;
    }

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

.tooltip {
  position: relative;
  padding: 3px;
  background: rgba(32, 32, 32, 1);
  color: white;
  opacity: 0.9;
  white-space: nowrap;
  font: 11pt sans-serif;
  text-align: center;
}