/*
 * Layout fixes for large viewports (4K), loaded after the original stylesheets.
 * The original design (2017) is kept unchanged below 2560px; above, it scales with the viewport width.
 */

/* Background images of the grids: natural size like 2017, cover the area only if the image is too small.
   min-width: wider than the images (2550px); min-height: section (100vh - 110px) higher than the lowest image (1404px). */
.fullBackgroundImage {
  background-size: auto;
}

@media (min-width: 2551px), (min-height: 1515px) {

  .fullBackgroundImage {
    background-size: cover;
  }

}

/* Images with natural size (outside the content columns) */
.navbar img {
  width: 13.7rem;
}

.footer img {
  width: 13rem;
}

/* Content images with a fixed width attribute inside shrink-to-fit containers (max-width: 100% still applies) */
.main img[src$="/logo_mitte.png"] {
  width: 72.2rem;
}

.main img[src$="/rotary.png"],
.main img[src$="/acpress.png"] {
  width: 35rem;
}

/* Large viewports: scale the whole design with the viewport width (1920px design = 10px root) */
@media (min-width: 2560px) {

  html {
    font-size: calc(100vw / 192);
  }

}