/* Site-specific overrides layered on top of the Colorlib template (style.css) */

/* Keep white hero text readable over light photos */
.hero-wrap .overlay { opacity: .3; }
.slider-text h1, .slider-text p { text-shadow: 0 1px 12px rgba(0, 0, 0, .45); }
.slider-text p { color: #fff; }

/* Event poster hero: show the whole poster instead of a cropped strip */
.hero-wrap.hero-poster {
  height: auto;
  min-height: 0;
  aspect-ratio: 2162 / 1200;
  max-height: 80vh;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #fff;
}

/* Keyless Google Maps embed on the contact page */
#map iframe { border: 0; width: 100%; height: 100%; }

@media (max-width: 767.98px) {
  /* Shorter hero so phone visitors reach the content without a full screen of photo */
  .hero-wrap:not(.hero-poster), .hero-wrap .slider-text { height: 440px; min-height: 0; }
  /* The parallax offset is sized for the 700px desktop hero and leaves a gap at 440px */
  .hero-wrap:not(.hero-poster) { background-position: center center !important; }
  .slider-text h1 { font-size: 32px; }
  .slider-text p { font-size: 17px; }

  /* Donation cards fill the column instead of shrinking to their text */
  .staff { width: 100%; }

  /* Contact map sits below the form on phones */
  #map { margin-top: 30px; }
}

/* On the poster page the transparent desktop navbar would sit on top of the poster */
@media (min-width: 992px) {
  .poster-page #ftco-navbar:not(.scrolled) { position: relative; background: #000 !important; }
}