@media screen and (orientation:portrait) {
  .grid {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

}


@media only screen and (max-width: 600px) {

    html {
    font-size: 18px;
  }

  .map-container .legend {
    position: relative;
    font-size: 0.85rem;
  }

  .legend-item.select,
  .legend-item select {
    width: 100%;
  }

  header nav {
    display: none;
  }
}