html {
   --navbar-height: 5rem;
   --navbar-sm-height: 3.5rem;
}
.navbar-inner {
   transition: height 250ms;
}
.navbar-compact .navbar-inner {
   height: 3.5rem;
}
@media (prefers-reduced-motion: reduce) {
   .navbar-inner {
     transition: none;
   }
}


.page-intro {
   background-repeat: no-repeat;
   background-position: center 1.5rem;
   background-size: 100% auto;
   background-attachment: fixed;
}

/* change background position and size according to window size */
@media (max-width: 1800px) {
   .page-intro {
      background-size: auto 480px;
   }
}
@media (max-width: 1199.98px) {
   .page-intro {
      background-size: auto 420px;
   }
}
@media (max-width: 700px) {
   .page-intro {
      background-position: -50vw 1rem;
   }
}
@media (max-width: 450px) {
   .page-intro {
      background-position: -100vw 1rem;
   }
}


.footer {
   background: url('assets/image/landing/travel-footer.jpg') no-repeat center;
   background-size: auto;
   background-attachment: fixed;
   background-position: bottom;
}
@media (max-width: 1000px) {
   .footer {
      background-size: auto 80%;
   }
}
@media (max-width: 450px) {
   .footer {
      background-position: 60% 60%;
      background-size: auto 100%;
   }
}



/**
 See @page-script.js 
*/
#scroll-down {
   top: 40vh;
}