.gbf_navbar{
  background-color: rgb(151, 194, 34);
}
#mapid,
#txtid {
  height: calc(100vh - 100px);
}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) {
  #mapid,
  #txtid {
    max-height: 80vh;
  }
}
.legend {
  text-align: left;
  line-height: 18px;
  color: #555;
}
.legend i {
  width: 18px;
  height: 18px;
  float: left;
  margin-right: 8px;
  opacity: 0.7;
}
.legend img {
  width: 18px;
  height: 18px;
  margin: 3px 8px 0px 0px;
}

.update {
  font-size: 12px;
}
.asc_certifified {
  width: 35px;
  height: auto;
  margin: 0px 0px 3px 5px;
}
.asc_logo {
  width: 35px;
  height: auto;
  margin: 0px 0px 3px 5px;
}
.sa_logo {
  width: 20px;
  height: auto;
  margin: 0px 0px 3px 5px;
}
.info_img {
  width: 20px;
  height: auto;
  margin: 0px 5px 3px 0px;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
.tab-pane {
  border-bottom: 1px solid #dee2e6;
  padding-bottom: 3em;
}
#slider .ui-slider-range {
  background: #0d6efd;
}

#slider .ui-slider-handle {
  border-color: #0d6efd;
}
.refresh.clicked {
  color: inherit; /* use the same color as the parent */
  cursor: default; /* use the default cursor to indicate it's not clickable */
  text-decoration: none; /* remove any remaining link styles */
}
.wellIcon svg {
  fill: blue;
}

.thermIcon svg {
  fill: red;
}
.hydroIcon svg {
  fill: green;
}
       
.workIcon svg {
  fill: black;
}

.slaughterIcon svg {
  fill: orange;
}
.mortIcon svg {
  fill: rgb(242, 0, 255);
}


.otherIcon svg {
  fill: gray;
}
.boat-legend {
  padding: 6px 8px;
  font: 14px Arial, Helvetica, sans-serif;
  background: white;
  background: rgba(255, 255, 255, 0.8);
  /*border-radius: 5px;*/
  line-height: 24px;
  color: #555;
}
.boat-legend h4 {
  text-align: center;
  font-size: 16px;
  margin: 2px 12px 8px;
  color: #777;
}

.boat-legend span {
  position: relative;
  bottom: 3px;
}

.boat-legend i {
  width: 18px;
  height: 18px;
  float: left;
  margin: 0 8px 0 0;
  opacity: 0.7;
}

.boat-legend i.icon {
  background-size: 18px;
  background-color: rgba(255, 255, 255, 1);
}
@media (min-width: 500px) {
  .site_list { column-count: 2; }
}
@media (min-width: 600px) {
  .site_list { column-count: 3; }
}
@media (min-width: 800px) {
  .site_list { column-count: 4; }
}
@media (min-width: 1000px) {
  .site_list { column-count: 5; }
}
@media (min-width: 1200px) {
  .site_list { column-count: 6; }
}
.greybox{
  position: relative;
  padding: 1rem;
  margin: 0 -1.5rem 1rem;
  border: solid var(--bs-border-color);
  border-width: 1px;
  background-color: #f8f9fa;
}
    .pie-marker canvas {
      width: 40px !important;
      height: 40px !important;
    }
    #slider {
        margin-bottom: 20px;
    }