body {
  background-color: #0E0500;
  color: #fff;
  font-family: study, serif;
  font-weight: 600;
  line-height: 25px;
  font-size: 16px;
  letter-spacing: 1.5px;
  text-wrap: balance; }

header {
  position: fixed;
  z-index: 50;
  width: 100%;
  padding: 3% 5%;
  /* The Overlay (background) */
  /* Position the content inside the overlay */
  /* Position the close button (top right corner) */
  /* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */ }
  header a {
    color: #fff; }
  header .overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */
    height: 0;
    width: 100%;
    position: fixed;
    /* Stay in place */
    z-index: 1;
    /* Sit on top */
    left: 0;
    top: 0;
    background-color: #0E0500;
    opacity: 0.9;
    overflow-x: hidden;
    /* Disable horizontal scroll */
    transition: 0.5s;
    /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
    padding: 0% 5%; }
  header .overlay-content {
    padding: 1% 0;
    position: relative;
    text-align: center; }
    header .overlay-content a {
      color: #fff; }
  header .overlay .close-btn {
    font-size: 35px; }
  @media screen and (max-height: 450px) {
    header .overlay a {
      font-size: 20px; }
    header .overlay .close-btn {
      font-size: 35px; } }

footer {
  padding: 5%;
  background-image: url("../img/section-image-1.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  color: #fff;
  display: flex;
  flex-direction: column; }
  footer img {
    margin-bottom: 75px;
    width: 45%;
    align-self: center; }
  footer a {
    color: #fff; }
  footer ul {
    padding: 5% 0; }
  footer .footer-nav > li {
    padding: 2% 0; }
  footer .footer-legal a {
    text-decoration: underline; }

.royalSlider {
  width: 100%;
  height: 75vh;
  min-height: 400px; }

.rsDefault .rsBullets {
  line-height: 30px;
  background: transparent; }

.active {
  color: #C43429 !important; }

.activenav {
  font-weight: 600; }

.button {
  padding: 1% 2%;
  font-family: "Albert Sans", sans-serif;
  font-weight: 800;
  font-size: 12px;
  text-transform: uppercase;
  border: 1px solid #fff;
  width: fit-content;
  margin: 100px auto 0; }
  .button a {
    color: #fff; }

.section-content {
  text-align: center; }
  .section-content img {
    margin: 50px 0;
    width: 250px; }

.landing {
  height: 100vh;
  min-height: 800px;
  background-attachment: scroll;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 1% 5%; }
  .landing h1 {
    display: none; }

.page-intro {
  padding: 1% 5%;
  height: 100vh;
  min-height: 800px;
  background-image: url("../img/section-image-1.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  display: flex;
  justify-content: center;
  align-items: center; }

.page-body {
  padding: 1% 5%;
  height: 100vh;
  min-height: 800px;
  background-image: url("../img/section-image-2.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  display: flex;
  justify-content: center;
  align-items: center; }

.parallax {
  background-attachment: scroll;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 1% 5%;
  height: 50vh;
  min-height: 400px; }

.slider img {
  height: 100vh;
  min-height: 800px;
  width: 100%; }

#home .landing {
  background-image: url("../img/home-landing.jpg"); }
#home .parallax {
  background-image: url("../img/home-parallax.jpg"); }
#home .page-body {
  background-color: #0E0500; }

#about .landing {
  background-image: url("../img/about-landing.jpg"); }
#about .parallax {
  background-image: url("../img/about-parallax.jpg"); }

#meetings .landing {
  background-image: url("../img/meetings-landing.jpg"); }
#meetings .parallax {
  background-image: url("../img/meetings-parallax.jpg"); }

#menu .landing {
  background-image: url("../img/menu-landing.jpg"); }

#info img {
  width: 250px;
  margin: 0 auto; }
#info .landing {
  padding-top: 20vh;
  background-image: url("../img/section-image-2.jpg"); }
  #info .landing .left-info {
    margin-bottom: 50px; }
    #info .landing .left-info .info-location, #info .landing .left-info .info-opening {
      margin-bottom: 10%; }
    #info .landing .left-info .info-location {
      font-weight: 600; }
    #info .landing .left-info .info-contact a {
      color: #fff; }
  #info .landing .right-info .park, #info .landing .right-info .metro {
    font-weight: 400; }
    #info .landing .right-info .park h3, #info .landing .right-info .metro h3 {
      font-weight: 600; }
#info .parallax {
  background-image: url("../img/info-parralax.jpg"); }

#terms-conditions .landing {
  background-image: url("../img/menu-landing.jpg"); }
#terms-conditions .parallax {
  background-image: url("../img/home-parallax.jpg"); }

@supports (display: grid) {
  header {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: 100px;
    grid-gap: 10px;
    grid-template-areas: "burger . . . . . nav nav "; }
    header span {
      grid-area: burger;
      align-self: center; }
    header .lang-toggler {
      grid-area: nav;
      align-self: center;
      justify-self: flex-end;
      font-size: 12px; }
    header .overlay-content {
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      grid-template-rows: 100px 0.5fr 0.5fr;
      grid-gap: 10px;
      grid-template-areas: "close . . logo logo . lang lang" ". links-menu links-menu links-menu links-menu links-menu links-menu ." ". nav-info nav-info nav-info nav-info nav-info nav-info ."; }
      header .overlay-content .close-btn {
        grid-area: close;
        justify-self: flex-start;
        align-self: center; }
      header .overlay-content .home-btn-overlay {
        grid-area: logo;
        justify-self: center;
        align-self: center; }
      header .overlay-content .lang-toggler {
        grid-area: lang; }
      header .overlay-content .nav-menu {
        grid-area: links-menu;
        padding-bottom: 25px;
        margin-bottom: 25px;
        border-bottom: 2px solid #BFBC96; }
        header .overlay-content .nav-menu ul {
          margin-top: 50px;
          display: flex;
          flex-direction: column;
          font-size: 26px;
          font-weight: 600; }
          header .overlay-content .nav-menu ul li {
            margin: 6%; }
          header .overlay-content .nav-menu ul li > a {
            color: #BFBC96; }
      header .overlay-content .nav-info {
        grid-area: nav-info;
        font-size: 14px; }
        header .overlay-content .nav-info ul {
          margin: 15px 0; }

  #info .landing {
    padding: 5%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    grid-gap: 10px;
    grid-template-areas: ". logo logo ." "left left right right"; }
    #info .landing img {
      grid-area: logo; }
    #info .landing .left-info {
      grid-area: left;
      align-self: flex-start; }
    #info .landing .right-info {
      grid-area: right;
      align-self: flex-start; }

  @media screen and (min-width: 900px) {
    header {
      padding: 1% 5%; }
      header .overlay-content {
        grid-template-areas: "close . . logo logo . lang lang" ". . . links-menu links-menu . . ." ". . . nav-info nav-info . . ."; }
        header .overlay-content .nav-menu ul {
          margin-top: 25px; }

    footer {
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      grid-template-rows: auto;
      grid-gap: 10px;
      grid-template-areas: ". . . logo logo . . ." "opening opening opening . . nav nav ." "location location location . . nav nav ." "contact contact . . . legal legal ."; }
      footer img {
        grid-area: logo;
        justify-self: center; }
      footer .footer-opening {
        grid-area: opening; }
      footer .footer-location {
        grid-area: location; }
      footer .footer-contact {
        grid-area: contact; }
      footer .footer-nav {
        grid-area: nav; }
      footer .footer-legal {
        grid-area: legal;
        align-self: flex-end; }

    .landing {
      background-attachment: fixed; }

    .royalSlider {
      height: 100vh;
      min-height: 800px; }

    .parallax {
      height: 100vh;
      min-height: 800px;
      background-attachment: fixed; }

    .page-intro {
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      grid-template-rows: 1fr;
      grid-gap: 10px; }
      .page-intro .section-content {
        grid-area: 1/3/1/7;
        justify-self: center;
        align-self: center; }

    .page-body {
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      grid-template-rows: 1fr;
      grid-gap: 10px; }
      .page-body .section-content {
        grid-area: 1/3/1/7;
        justify-self: center;
        align-self: center; }

    #info .landing {
      grid-template-columns: repeat(8, 1fr);
      grid-template-areas: ". . . logo logo . . ." ". left left . . right right ."; }
      #info .landing .left-info {
        align-self: center; }
      #info .landing .right-info {
        align-self: center; } } }