.overlay-div {
  width: inherit;
  height: 100%;
  position: absolute;
  top: 0;
  outline: black;
  outline-style: solid;

  .explanation {
    float: right;
    text-transform: uppercase;
    padding: 5px;
    font-family: Lato, Helvetica, Arial, sans-serif;
    p {
      line-height: initial;
      margin: initial;
      color: white !important;
    }
  }
}

.overlay-div-low {
  background-color: rgba(255,0,0,0.5);
  .explanation {
    background-color: red;
  }
}

.overlay-div-medium {
  background-color: rgba(255,255,0,0.5);
  .explanation {
    background-color: yellow;
    p {
      color: black !important;
    }
  }
}

.overlay-div-high {
  background-color: rgba(0,255,0,0.5);
  z-index: 1000;
  .explanation {
    background-color: green;
  }
}

.overlay-div-no-data {
  background-color: rgba(0,0,0,0.5);
  .explanation {
    background-color: black;
  }
}