@charset "utf-8";

/* =======================
   Slideshow / Banner
   ======================= */
.slideshow {
  max-width: 980px;
  width: 100%;
  aspect-ratio: 980 / 400;
  /* desktop ratio */
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  border: 0.5rem solid #fff;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
}

.slideshow img {
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  top: 0 !important;
  left: 0 !important;
  object-fit: cover;
  opacity: 0;
}

/* On small screens, force square */
@media (max-width: 500px) {
  .slideshow {
    aspect-ratio: 1 / 1;
    /* square */
    /* remove height, let aspect-ratio control it */
  }
}

#strip {
  display: flex;
  justify-content: center;
  margin: 0 auto 2rem auto;
  margin-top: calc(-1.2rem - 1px);
  /* negative to hide the line below the menu */
}

@media (max-width: 960px) {
  #strip {
    display: flex;
    justify-content: center;
    margin: 0 auto 2rem auto;
    margin-top: 0;
  }
}