/* Evening: page layout (shared styles live in styles.css) */

/* Inline text styles */
.fs-1-25rem { font-size: 1.25rem; }
.fw-200 { font-weight: 200; }
.fw-500 { font-weight: 500; }

/* Section 1: background video */
.s1 { min-height: 100vh; }
.video-bg.s1-video { background-image: url("../images/island-west-bay-rooftop-pool-video-cover.f6049fb02b93.jpg"); }
.s1-row { grid-template-columns: minmax(0, 24fr); column-gap: 30px; }
.s1-c1 { padding: 13.089vh 6.9444vw 0.0232vh 7.4518vw; justify-content: flex-end; }

/* Section 2: background photo */
.s2 { min-height: 489.4px; display: none; }
.s2-row { grid-template-columns: ; column-gap: 30px; }
.bg.s2-bg { background-image: url("../images/island-west-bay-rooftop-pool-video-cover.f6049fb02b93.jpg"); background-position: 50% 50%; }

/* Section 3: Evening */
.s3 { min-height: 152.03px; background-color: rgb(227, 222, 209); }
.s3-row { grid-template-columns: minmax(0, 24fr); column-gap: 30px; }
.s3-c1 { padding: 30.3516px 0 0 0; justify-content: center; text-align: center; --ha: center; }
.s3-c1-g1 { margin-bottom: 0.0273px; }
.s3-c1-h1 { font-size: 3.5rem; font-weight: 200; line-height: 0; letter-spacing: 1em; color: rgb(0, 0, 0); margin-bottom: 0.55em; text-align: center; }

/* Section 4: Rooftop Sunset Soirées */
.s4 { min-height: 847.89px; background-color: rgb(255, 255, 255); }
.bg.s4-bg { background-image: url("../images/istock-1817310659.71740beddf58.jpg"); background-position: 50% 0%; }
.s4-row { grid-template-columns: minmax(0, 12fr) minmax(0, 12fr); column-gap: 30px; }
.s4-c1 { padding: 0 0 0 3.4722vw; justify-content: flex-end; }
.s4-c2 { padding: 0 6.9444vw 0 6.9364vw; justify-content: center; background-color: rgba(34, 49, 30, 0.75); }
.s4-c2-h1 { font-size: 4.5rem; font-weight: 100; line-height: 1em; letter-spacing: 0.2em; color: rgb(255, 255, 255); margin-bottom: 0.55em; text-align: center; }
.s4-c2-p { font-size: 1.125rem; font-weight: 300; line-height: 2em; color: rgb(255, 255, 255); margin-bottom: 0.55em; text-align: center; }

/* Section 5: Lounge And Game In Style */
.s5 { min-height: 886.55px; background-color: rgb(227, 222, 209); padding: 50px; }
.s5-row { grid-template-columns: minmax(0, 11fr) minmax(0, 13fr); column-gap: 0; }
.s5-c1 { padding: 0 6.663vw 0 3.8867vw; justify-content: center; }
.s5-c1-g1 { margin-bottom: 25.9639px; }
.s5-c1-h3 { font-size: 3.75rem; font-weight: 100; line-height: 1em; letter-spacing: 0.2em; color: rgb(0, 0, 0); margin-bottom: 0.55em; text-align: center; }
.s5-c1-p { font-size: 1.125rem; font-weight: 200; line-height: 2em; color: rgb(0, 0, 0); margin-bottom: 0.875em; text-align: center; }
.s5-c2 { padding: 0 6.9444vw 0 0; justify-content: center; text-align: center; --ha: center; }
.bg.s5-c2-bg { background-image: url("../images/iwb-pg-gaming-lounge-050224-min.e503c16857fb.jpg"); background-position: 50% 50%; }

/* Section 6: Chic Entertaining */
.s6 { min-height: 481.21px; background-color: rgb(34, 49, 30); padding: 50px 132px; }
.s6-row { grid-template-columns: minmax(0, 24fr); column-gap: 0; }
.s6-c1 { padding: 0; justify-content: center; }
.s6-c1-h3 { font-size: 3.75rem; font-weight: 200; line-height: 1em; letter-spacing: 0.2em; color: rgb(255, 255, 255); margin-bottom: 0.55em; text-align: center; }
.s6-c1-p { font-size: 1.125rem; font-weight: 300; line-height: 2em; color: rgb(255, 255, 255); margin-bottom: 0; text-align: center; }
.bg.s6-bg { background-image: url("../images/pexels-photo-1072179-min.bac9adc8e091.jpg"); background-position: 50% 50%; }

/* Section 7: background video */
.s7 { min-height: 807.66px; }
.video-bg.s7-video { background-image: url("https://i.ytimg.com/vi/2SeCQn-NXHI/sddefault.jpg"); }
.s7-row { grid-template-columns: ; column-gap: 30px; }

/* Section 8: Let's Start Planning The Other 364 Days */
.s8 { min-height: 243.89px; background-color: rgb(227, 222, 209); }
.s8-row { grid-template-columns: minmax(0, 24fr); column-gap: 30px; }
.s8-c1 { padding: 50px 0 0 0; justify-content: center; text-align: center; --ha: center; }
.s8-c1-h1 { font-size: 3.5rem; font-weight: 300; line-height: 1.2em; letter-spacing: 0.4em; color: rgb(0, 0, 0); margin-bottom: 0.55em; text-align: center; }

/* Section 9: Exploring Nature Days */
.s9 { min-height: 287.79px; background-color: rgb(227, 222, 209); }
.s9-row { grid-template-columns: minmax(0, 8fr) minmax(0, 8fr) minmax(0, 8fr); column-gap: 30px; }
.s9-c1 { padding: 0; text-align: center; --ha: center; }
.s9-c1-img { margin: 0 0 16px 0; }
.s9-c1-h4 { font-size: 1.25rem; font-weight: 300; line-height: 1.3em; color: rgb(0, 0, 0); margin-bottom: 0.55em; }
.s9-c2 { padding: 0; text-align: center; --ha: center; }
.s9-c2-img { margin: 0 0 16px 0; }
.s9-c2-h4 { font-size: 1.25rem; font-weight: 300; line-height: 1.3em; color: rgb(0, 0, 0); margin-bottom: 0.55em; }
.s9-c3 { padding: 0; text-align: center; --ha: center; }
.s9-c3-img { margin: 0 0 16px 0; }
.s9-c3-h4 { font-size: 1.25rem; font-weight: 300; line-height: 1.3em; color: rgb(0, 0, 0); margin-bottom: 0.55em; }

/* Section 10: Sports Days */
.s10 { min-height: 319.69px; background-color: rgb(227, 222, 209); }
.s10-row { grid-template-columns: minmax(0, 8fr) minmax(0, 8fr) minmax(0, 8fr); column-gap: 30px; }
.s10-c1 { padding: 0; text-align: center; --ha: center; }
.s10-c1-img { margin: 0 0 16px 0; }
.s10-c1-h4 { font-size: 1.25rem; font-weight: 300; line-height: 1.3em; color: rgb(0, 0, 0); margin-bottom: 0.55em; }
.s10-c2 { padding: 0; text-align: center; --ha: center; }
.s10-c2-img { margin: 0 0 16px 0; }
.s10-c2-h4 { font-size: 1.25rem; font-weight: 300; line-height: 1.3em; color: rgb(0, 0, 0); margin-bottom: 0.55em; }
.s10-c3 { padding: 0; text-align: center; --ha: center; }
.s10-c3-img { margin: 0 0 16px 0; }
.s10-c3-h4 { font-size: 1.25rem; font-weight: 300; line-height: 1.3em; color: rgb(0, 0, 0); margin-bottom: 0.55em; }

/* Section 11: background photo */
.s11 { min-height: 162.71px; background-color: rgb(0, 0, 0); }
.s11-row { grid-template-columns: minmax(0, 5fr) minmax(0, 14fr) minmax(0, 5fr); column-gap: 0; }
.s11-c1 { padding: 48.7461px 25px 0 25px; }
.s11-c1-img { margin: 0 0 16px 0; width: 188px; }
.s11-c2 { padding: 45.2461px 25px 25px 25px; }
.s11-c2-p { font-size: 1rem; font-weight: 300; line-height: 1.5em; color: rgb(255, 255, 255); margin-bottom: 0.55em; text-align: center; }
.s11-c2-p-2 { font-size: 0.875rem; font-weight: 300; line-height: 1.5em; color: rgb(255, 255, 255); margin-bottom: 0.55em; text-align: center; }
.s11-c3 { padding: 50.0312px 25px 0 25px; }
.s11-c3-img { margin: 0 0 16px 0; width: 188px; }
.bg.s11-bg { background-image: url("../images/omid-armin-fnzke3owm1o-unsplash-min.858aba037a1b.jpg"); background-position: 50% 50%; --ov: rgba(0, 0, 0, 0.3); }


@media (max-width: 999px) {
  /* Section 1: background video */
  .s1 { min-height: 430.82px; display: none; }
  .s1-c1 { padding: 6.5445vh 39.0625vw 6.5445vh 6.5vw; }

  /* Section 2: background photo */
  .s2 { display: flex; }

  /* Section 3: Evening */
  .s3-c1 { padding: 50px 6.5vw 25px 6.5vw; }
  .s3-c1-h1 { font-size: 3.125rem; }

  /* Section 4: Rooftop Sunset Soirées */
  .s4 { min-height: 555.87px; }
  .s4-c1 { padding: 0 6.5vw; }
  .s4-c2 { padding: 50px 6.5104vw 50px 6.5vw; }
  .s4-c2-h1 { font-size: 3.75rem; }
  .s4-c2-p { text-align: left; }

  /* Section 5: Lounge And Game In Style */
  .s5 { padding: 30px; }
  .s5-c1 { padding: 50px 0 3.7936vh 0; order: 2; }
  .s5-c1-h3 { font-size: 3.5rem; }
  .s5-c2 { padding: 450px 6.5vw 0 6.5vw; order: 1; }

  /* Section 6: Chic Entertaining */
  .s6 { padding: 30px 79.2px; }
  .s6-c1 { padding: 50px 0 0 0; }
  .s6-c1-h3 { font-size: 3.5rem; }

  /* Section 7: background video */
  .s7 { min-height: 429.72px; }

  /* Section 8: Let's Start Planning The Other 364 Days */
  .s8-c1 { padding: 50px 6.5vw 0 6.5vw; }
  .s8-c1-h1 { font-size: 3.125rem; }

  /* Section 9: Exploring Nature Days */
  .s9-c1 { padding: 50px 6.5vw; }
  .s9-c1-img { margin: 0 0 3.0625em 0; }
  .s9-c2 { padding: 0 6.5vw; }
  .s9-c2-img { margin: 0 0 3.125em 0; }
  .s9-c3 { padding: 50px 6.5vw 0 6.5vw; }
  .s9-c3-img { margin: 0 0 3.125em 0; }

  /* Section 10: Sports Days */
  .s10-c1 { padding: 50px 6.5vw; }
  .s10-c1-img { margin: 0 0 3.0625em 0; }
  .s10-c2 { padding: 0 6.5vw; }
  .s10-c2-img { margin: 0 0 3.125em 0; }
  .s10-c3 { padding: 50px 6.5vw; }
  .s10-c3-img { margin: 0 0 3.125em 0; }

  /* Section 11: background photo */
  .s11-c1 { padding: 50px 3.7257vw 0 39.0625vw; }
  .s11-c1-img { width: 167px; }
  .s11-c2 { padding: 50px 6.5vw; }
  .s11-c3 { padding: 0 6.5vw 50px 39.0625vw; }
}


@media (max-width: 749px) {
  /* Section 1: background video */
  .s1 { min-height: 210.85px; }
  .s1-c1 { padding: 3.2723vh 6.667vw; }

  /* Section 2: background photo */
  .s2 { min-height: 238.5px; }

  /* Section 3: Evening */
  .s3 { min-height: 24.36px; }
  .s3-c1 { padding: 25px 6.667vw 15px 6.667vw; }
  .s3-c1-h1 { font-size: 1.875rem; line-height: 1em; letter-spacing: 0.7em; }

  /* Section 4: Rooftop Sunset Soirées */
  .s4-c1 { padding: 0 6.667vw; }
  .s4-c2 { padding: 3.1686vh 6.667vw 3.2723vh 6.667vw; }
  .s4-c2-h1 { font-size: 2.5rem; }
  .s4-c2-p { font-size: 1.0625rem; line-height: 1.7em; }

  /* Section 5: Lounge And Game In Style */
  .s5 { padding: 15px; }
  .s5-c1 { padding: 1.8968vh 0; }
  .s5-c1-h3 { font-size: 2.1875rem; }
  .s5-c1-p { font-size: 1.0625rem; line-height: 1.7em; }
  .s5-c2 { padding: 250px 6.667vw 0 6.667vw; }

  /* Section 6: Chic Entertaining */
  .s6 { padding: 15px 39.6px; }
  .s6-c1 { padding: 0; }
  .s6-c1-h3 { font-size: 2.1875rem; letter-spacing: 0.1em; }
  .s6-c1-p { font-size: 1.0625rem; line-height: 1.7em; }

  /* Section 7: background video */
  .s7 { min-height: 209.9px; }

  /* Section 8: Let's Start Planning The Other 364 Days */
  .s8 { min-height: 147.56px; }
  .s8-c1 { padding: 25px 6.667vw 0 6.667vw; }
  .s8-c1-h1 { font-size: 1.875rem; }

  /* Section 9: Exploring Nature Days */
  .s9-c1 { padding: 25px 6.667vw; }
  .s9-c1-img { margin: 0 0 1.5em 0; }
  .s9-c1-h4 { font-size: 1.0625rem; }
  .s9-c2 { padding: 0 6.667vw 25px 6.667vw; }
  .s9-c2-img { margin: 0 0 1.5em 0; }
  .s9-c2-h4 { font-size: 1.0625rem; }
  .s9-c3 { padding: 0 6.667vw; }
  .s9-c3-img { margin: 0 0 24px 0; }
  .s9-c3-h4 { font-size: 1.0625rem; }

  /* Section 10: Sports Days */
  .s10-c1 { padding: 25px 6.667vw; }
  .s10-c1-img { margin: 0 0 1.5em 0; }
  .s10-c1-h4 { font-size: 1.0625rem; }
  .s10-c2 { padding: 0 6.667vw 25px 6.667vw; }
  .s10-c2-img { margin: 0 0 1.5em 0; }
  .s10-c2-h4 { font-size: 1.0625rem; }
  .s10-c3 { padding: 0 6.667vw 25px 6.667vw; }
  .s10-c3-img { margin: 0 0 24px 0; }
  .s10-c3-h4 { font-size: 1.0625rem; }

  /* Section 11: background photo */
  .s11-c1 { padding: 25px 24px 0 26.7198vw; }
  .s11-c2 { padding: 25px 24px; }
  .s11-c3 { padding: 0 24px 25px 26.6667vw; }
}
