@media only screen and (max-width: 1100px) {
  footer nav {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  td.summary {
    grid-column: span 2;
  }

  td.categories {
    grid-row: span 2;
  }
}

@media only screen and (max-width: 1000px) {
  .bodytext figure {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%!important;
    max-width: 25rem;
    margin-left: auto;
  }

  .tile-collection[data-colums="3"] {
    grid-template-columns: 1fr 1fr;
  }

  .tile-collection[data-colums="4"] {
    grid-template-columns: 1fr 1fr 1fr;
  }
}



@media only screen and (max-width: 800px) {
  .tile-collection[data-colums="2"],
  .tile-collection[data-colums="3"] {
    display: flex;
    flex-direction: column;
  }

  .tile-collection[data-colums="4"] {
    grid-template-columns: 1fr 1fr;
  }

  .map-container {
    position: relative;
    height: 50vh;
  }

  tr.place {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }

  tr.header-row {
    display: none
}

tr.header-row + tr {
  border-top: 1px solid black;
  margin-top: 1rem
}

  .leaflet-popup-content-wrapper {
    max-width: calc(100vw - 4rem);
  }

  section.summary {
    text-align: center;
    font-size: var(--l);
  }

  :root {  
    --xs: 0.85rem;
    --s: 0.85rem;
    --m: 1rem;
    --l: 1.15rem;
    --xl: 1.25rem;
    --xxl: 1.5rem;
  }

  .simple-table ul {
    font-size: var(--m);
  }

  .slide p {
    font-size: var(--s);
}

section.cover {
  max-width: 55rem;
  max-height: 20rem;
}
}


@media only screen and (max-width: 600px) {
  html {
    font-size: 18px;
  }

  header nav {
    width: calc(100vw - 2rem);
    height: 75vh;
  }

  tr.active td.summary {
    height: 20em;
  }

  .slide-info {
    width: 100%;
    right: 0;
    bottom: 0;
    height: auto;
}

.prev-slide, .next-slide {
  height: 50%;
} 

#lightbox.active {
  opacity: 0!important;
  pointer-events: none!important;
  display: none!important;
}
}