html,
body {
  padding-top: 0rem;
  padding-bottom: 1rem;
}
/*@media (max-width: 200px) {
  .nav-navbar {
    background: #edede3;
  }*/
.wrapper {
  display: flex;
  width: 100%;
  align-items: stretch
  
}
.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 60px;
  line-height: 60px;
}
/*  # is id - once only 
    . is class
    < > is DOM elements
*/
/*
.starter-template {
    padding: 1.5rem 1rem;
    text-align: center; 
  }*/
#border {
    width: 100%;
}
#summary{
    width:100%;
}
/*#mapid { height: 180px; }*/

#mapid {
  height: 100%;
  padding: 0;
  margin: 0;
}

.link { color: #edede3; } /* CSS link color */

.legend {
  padding: 10px;
  font-family: Sanchez, serif;
  font-size: 16px;
  font-weight: bold;
  line-height: 18px;
  color: #555;
  background-color: white;
  border-radius: 5px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}

.legend .low {
  color: #ec8a2e;
}

.legend .empty {
  color: #a0353a;
}

.legend .coming-soon {
  color: #f4ba48;
}

.legend .healthy {
  color: #1b904f;
}

.legend .out-of-order {
  color: #007dff;
}