/* ============================================================
   FONT IMPORT
   ============================================================ */

@import url("https://use.typekit.net/gxp7uqy.css");

/* ============================================================
   PAGE TRANSITIONS
   ============================================================ */

@keyframes pageFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.page-transition {
  animation: pageFadeIn 0.6s ease-in-out forwards;
}

/* ============================================================
   GLOBAL RESET & BASE
   ============================================================ */

body {
  font-family: "proxima-nova", sans-serif
}

* {
  box-sizing: border-box
}

/* ============================================================
   DESIGN TOKENS (CSS Custom Properties)
   ============================================================ */

:root {
  --primaryColor: #84bd00;
  --secondaryColor: #009cde;
  --onPrimaryColor: #231f20;
  --backgroundColor: #00263a;
  --onBackgroundColor: #fff;
  --titleColor: #3b3c43;
  --actionColor: #fa6600;
  --onActionColor: #fff;
  --header-height: 0;
  font-size: 16px;
  z-index: 0
}

/* ============================================================
   ANIMATION UTILITIES
   ============================================================ */

.fadeInAndOut {
  position: relative;
  transition: all .5s;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -ms-transition: all .5s;
  -o-transition: all .5s;
  width: 100%
}

.fadeInAndOut.fadein {
  max-height: 10000px;
  opacity: 1;
  pointer-events: all
}

.fadeInAndOut.fadeOut {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none
}

/* ============================================================
   PAGE WRAPPER
   ============================================================ */

.page {
  height: 100vh;
  margin: 0 auto;
  max-height: 1080px;
  max-width: 1920px;
  overflow-x: hidden;
  overflow-y: hidden;
  padding-top: 0;
  padding-top: var(--header-height);
  position: relative;
  width: 100%
}

.page.splash {
  background: no-repeat url(/assets/hotel/Glow-Orb-Background.jpg);
  background-position: 50%;
  background-size: cover
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */

.page .page-header {
  background-color: #84bd00;
  color: #fff;
  font-size: 38.343px;
  font-size: 36px;
  font-weight: 700;
  left: 2.5%;
  padding-left: 2.2%;
  padding-right: 4.4%;
  position: absolute;
  top: 0
}

@media(min-width:800px)and (max-width:1080px) {
  .page .page-header {
    font-size: 34px
  }
}

@media(min-width:800px)and (max-width:1080px)and (max-height:500px) {
  .page .page-header {
    font-size: 30px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .page .page-header {
    font-size: 40.44px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:500px) {
  .page .page-header {
    font-size: 38px
  }
}

@media(min-width:1270px)and (max-width:1400px) {
  .page .page-header {
    font-size: 51.124px
  }
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:600px) {
  .page .page-header {
    font-size: 40px
  }
}

@media(min-width:1400px)and (max-width:1750px) {
  .page .page-header {
    font-size: 58px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:700px) {
  .page .page-header {
    font-size: 51px
  }
}

@media(min-width:1750px) {
  .page .page-header {
    font-size: 64px
  }
}

.page .topic-header {
  font-size: 34px;
  font-size: 28px;
  font-weight: 700;
  max-width: 1016px;
  padding-left: 5px;
  pointer-events: none;
  width: 56.4vw
}

@media(min-width:800px) {
  .page .topic-header {
    font-size: 32px
  }
}

@media(min-width:1080px) {
  .page .topic-header {
    font-size: 36px
  }
}

@media(min-width:1270px) {
  .page .topic-header {
    font-size: 45.5px
  }
}

@media(min-width:1400px) {
  .page .topic-header {
    font-size: 53px
  }
}

@media(min-width:1750px) {
  .page .topic-header {
    font-size: 60px
  }
}

.page .std-text {
  font-size: 17px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.2;
  white-space: pre-wrap
}

@media(min-width:800px) {
  .page .std-text {
    font-size: 16.5px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .page .std-text {
    font-size: 18px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:800px) {
  .page .std-text {
    font-size: 16.5px
  }
}

@media(min-width:1270px)and (max-width:1400px) {
  .page .std-text {
    font-size: 22.756px
  }
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:800px) {
  .page .std-text {
    font-size: 18px
  }
}

@media(min-width:1400px)and (max-width:1750px) {
  .page .std-text {
    font-size: 25px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:700px) {
  .page .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px) {
  .page .std-text {
    font-size: 28px
  }
}

@media(min-width:1750px)and (max-height:800px) {
  .page .std-text {
    font-size: 25px
  }
}

.page .tap-prompt {
  color: #84bd00;
  color: var(--primaryColor);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  white-space: pre-wrap
}

@media(min-width:800px) {
  .page .tap-prompt {
    font-size: 13px
  }
}

@media(min-width:1080px) {
  .page .tap-prompt {
    font-size: 14px
  }
}

@media(min-width:1270px) {
  .page .tap-prompt {
    font-size: 17.5px
  }
}

@media(min-width:1400px) {
  .page .tap-prompt {
    font-size: 22px
  }
}

.page .link {
  cursor: pointer
}

.popup .holder {
  padding: 0
}

.popup .holder .location_popup {
  align-items: center;
  background-color: #009cde;
  background-color: var(--secondaryColor);
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  width: 100%
}

.popup .holder .location_popup h5 {
  color: #000;
  font-size: 50px;
  font-style: normal;
  font-weight: 600;
  line-height: 90px;
  margin: 0 42px;
  text-shadow: 0 4px 4px rgba(0, 0, 0, .25)
}

.popup .holder .location_popup .buttons {
  grid-column-gap: 10px;
  column-gap: 10px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  justify-items: center;
  width: 80%
}

.popup .holder .location_popup .buttons .button {
  align-items: center;
  background: #84bd00;
  background: var(--primaryColor);
  border-radius: 31.49px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, .13);
  color: #fff;
  display: flex;
  font-size: 30px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: -.4px;
  line-height: 36px;
  margin: 10px 15px;
  padding: 30px 25px;
  text-align: center;
  transition: all .3s;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -ms-transition: all .3s;
  -o-transition: all .3s;
  width: 100%
}

.popup .holder .location_popup .buttons .button.active {
  background: #001751;
  border: 5px solid #fff;
  color: #fff
}

@media(min-width:1900px) {
  .popup .holder .location_popup .buttons {
    grid-template-columns: repeat(2, 1fr)
  }
}

/* ============================================================
   LANDING PAGE (Home Screen)
   ============================================================ */

.landingPage {
  position: relative
}

.landingPage svg {
  cursor: pointer;
  height: auto;
  pointer-events: visiblePainted;
  width: 100%
}

.landingPage .home-map {
  aspect-ratio: 93.4259/53.67;
  background-image: url(/assets/hotel/Homescreen-clean.png);
  background-repeat: no-repeat;
  background-size: contain;
  bottom: 10%;
  bottom: 0;
  height: 53.67vw;
  max-height: 966.247px;
  max-width: 1682px;
  position: absolute;
  right: -2%;
  width: 93.4259vw;
  width: auto
}

@media(min-aspect-ratio:2) {
  .landingPage .home-map {
    height: 100%
  }
}

@media(min-aspect-ratio:2)and (max-width:1270px) {
  .landingPage .home-map {
    bottom: 0
  }
}

@media(min-width:1400px) {
  .landingPage .home-map {
    bottom: -7%;
    bottom: -10%;
    right: -3.25%
  }
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:830px) {
  .landingPage .home-map {
    bottom: 0
  }
}

@media(min-width:1400px)and (max-width:1750px)and (min-height:800px) {
  .landingPage .home-map {
    bottom: -1%
  }
}

.landingPage .home-map>div {
  animation: buttonAnimationLanding ease infinite
}

.landingPage .home-map>div:first-child {
  animation-delay: 0;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(2) {
  animation-delay: 4s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(3) {
  animation-delay: 8s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(4) {
  animation-delay: 12s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(5) {
  animation-delay: 16s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(6) {
  animation-delay: 20s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(7) {
  animation-delay: 24s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(8) {
  animation-delay: 28s;
  animation-duration: 36s
}

.landingPage .home-map>div:nth-child(9) {
  animation-delay: 32s;
  animation-duration: 36s
}

.landingPage .home-map .engagement {
  left: 18.5%;
  position: absolute;
  top: 16%;
  width: 9.18%
}

.landingPage .home-map .hotel {
  left: 36.5%;
  position: absolute;
  top: 19.5%;
  width: 5.87%
}

.landingPage .home-map .tennis {
  left: 12%;
  position: absolute;
  top: 46%;
  width: 9.425%
}

.landingPage .home-map .conference {
  left: 29%;
  position: absolute;
  top: 49.5%;
  width: 11.9778%
}

.landingPage .home-map .beach {
  left: 48%;
  position: absolute;
  top: 51.5%;
  width: 8.74%
}

.landingPage .home-map .dining {
  left: 59.5%;
  position: absolute;
  top: 26.5%;
  width: 9.817%
}

.landingPage .home-map .golf {
  left: 66.4%;
  position: absolute;
  top: 2.5%;
  width: 8.74%
}

.landingPage .home-map .spa {
  left: 76%;
  position: absolute;
  top: 20%;
  width: 5.13%
}

.landingPage .home-map .continuous {
  bottom: 34%;
  position: absolute;
  right: 4.5%;
  width: 8.588%
}

.landingPage .top-left {
  display: flex;
  flex-direction: column;
  font-weight: 400;
  left: 5%;
  pointer-events: none;
  position: absolute;
  top: 5%
}

.landingPage .top-left .topic-header {
  line-height: 1.125;
  margin-bottom: 4%;
  width: auto
}

.landingPage .top-left .topic-header .sub-topic-header {
  color: var(--primaryColor);
  display: flex;
  font-size: 50%;
  font-size: 16px;
  font-weight: 400;
  white-space: pre-wrap
}

@media(min-width:800px) {
  .landingPage .top-left .topic-header .sub-topic-header {
    font-size: 18px
  }
}

@media(min-width:1080px) {
  .landingPage .top-left .topic-header .sub-topic-header {
    font-size: 20.25px
  }
}

@media(min-width:1270px) {
  .landingPage .top-left .topic-header .sub-topic-header {
    font-size: 25.6px
  }
}

@media(min-width:1400px) {
  .landingPage .top-left .topic-header .sub-topic-header {
    font-size: 29px
  }
}

@media(min-width:1750px) {
  .landingPage .top-left .topic-header .sub-topic-header {
    font-size: 33px
  }
}

@media(min-width:1900px) {
  .landingPage .top-left .topic-header .sub-topic-header {
    font-size: 36px
  }
}

.landingPage .top-left .column {
  display: flex;
  flex-direction: column;
  padding-left: 19px;
  position: relative
}

.landingPage .top-left .column .row {
  display: flex;
  flex-direction: row;
  font-size: 19.2px;
  font-size: 16px;
  white-space: pre-wrap
}

.landingPage .top-left .column .row span {
  color: var(--primaryColor);
  font-weight: 700
}

@media(min-width:800px) {
  .landingPage .top-left .column .row {
    font-size: 18px
  }
}

@media(min-width:1080px) {
  .landingPage .top-left .column .row {
    font-size: 20.25px
  }
}

@media(min-width:1270px) {
  .landingPage .top-left .column .row {
    font-size: 25.6px
  }
}

@media(min-width:1400px) {
  .landingPage .top-left .column .row {
    font-size: 29px
  }
}

@media(min-width:1750px) {
  .landingPage .top-left .column .row {
    font-size: 33px
  }
}

.landingPage .top-left .column .line {
  height: 100%;
  left: 0;
  position: absolute
}

.landingPage .top-left .column .line svg {
  height: 100%;
  width: auto
}

.landingPage .logo {
  max-width: 183px;
  position: absolute;
  right: 1%;
  bottom: 3%;
  width: 10.156vw
}

.landingPage .bottom-left {
  align-items: center;
  bottom: 4%;
  display: flex;
  flex-direction: column;
  gap: 2%;
  left: 4%;
  pointer-events: none;
  position: absolute
}

.landingPage .bottom-left .touch-prompt {
  aspect-ratio: 1/1;
  height: 12.76vw;
  max-height: 230px;
  max-height: 200px
}

@media(min-width:1400px) {
  .landingPage .bottom-left .touch-prompt {
    height: 10vw
  }
}

@media(max-width:1400px) {
  .landingPage .bottom-left .touch-prompt {
    height: auto;
    width: 10vw
  }
}

.landingPage .bottom-left .block {
  font-size: 15px;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  white-space: pre-wrap
}

.landingPage .bottom-left .block span {
  color: var(--secondaryColor);
  font-weight: 700
}

.landingPage .bottom-left .block strong {
  font-size: 19.2px;
  font-size: 16px
}

@media(min-width:800px) {
  .landingPage .bottom-left .block strong {
    font-size: 18px
  }
}

@media(min-width:1080px) {
  .landingPage .bottom-left .block strong {
    font-size: 20.25px
  }
}

@media(min-width:1270px) {
  .landingPage .bottom-left .block strong {
    font-size: 25.6px
  }
}

@media(min-width:800px) {
  .landingPage .bottom-left .block {
    font-size: 14px
  }
}

@media(min-width:1080px) {
  .landingPage .bottom-left .block {
    font-size: 15.75px
  }
}

@media(min-width:1270px) {
  .landingPage .bottom-left .block {
    font-size: 19.9px
  }
}

/* --- Landing page hotspot pulse animation --- */
@keyframes buttonAnimationLanding {

  0%,
  1.04125%,
  2.0825% {
    transform: scale(1)
  }

  .52125%,
  1.5625% {
    transform: scale(.9)
  }
}

/* ============================================================
   SVG FILL UTILITIES
   ============================================================ */

.agilysys-logo-fill1 {
  fill: #009cde
}

.agilysys-logo-fill2 {
  fill: #84bd00
}

/* ============================================================
   FEATURED SOLUTIONS PANEL
   ============================================================ */

#featured-solutions {
  background-color: #fff;
  border-top: 12px solid var(--secondaryColor);
  bottom: 0;
  box-shadow: 0 -6px 21px 0 rgba(0, 156, 222, .5);
  display: flex;
  flex-direction: row;
  height: 23.52vw;
  position: absolute;
  transform: translateY(23.52vw);
  transition: all .3s;
  width: 100%
}

@media(min-width:1400px) {
  #featured-solutions {
    max-height: 267px;
    transform: translateY(100%)
  }
}

@media(min-aspect-ratio:1.5) {
  #featured-solutions {
    max-height: 33%
  }
}

@media(min-width:1920px)and (min-height:1080px) {
  #featured-solutions {
    max-height: 30%
  }
}

#featured-solutions .header-box {
  align-items: center;
  aspect-ratio: 1273/200;
  background-color: var(--secondaryColor);
  color: #fff;
  display: flex;
  font-size: 20.813px;
  font-size: 17.5px;
  font-weight: 700;
  justify-content: center;
  left: 4%;
  left: 2.8%;
  margin-top: -1px;
  position: absolute;
  width: 20.75%
}

@media(min-width:1050px) {
  #featured-solutions .header-box {
    font-size: 20px
  }
}

@media(min-width:1270px) {
  #featured-solutions .header-box {
    font-size: 26.311px
  }
}

@media(min-width:1400px) {
  #featured-solutions .header-box {
    font-size: 29px
  }
}

@media(min-width:1750px) {
  #featured-solutions .header-box {
    font-size: 34.688px
  }
}

#featured-solutions .left-side {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  padding-left: 2.8%;
  padding-top: 2.333%;
  position: relative;
  width: 24.75%
}

@media(min-width:1400px) {
  #featured-solutions .left-side {
    padding-top: 3%
  }
}

@media(min-aspect-ratio:1.5) {
  #featured-solutions .left-side {
    padding-top: 2.95%
  }
}

#featured-solutions .left-side .row {
  align-items: center;
  display: flex;
  flex-direction: row
}

#featured-solutions .left-side .row svg {
  flex-shrink: 0;
  max-width: 74px;
  width: 4.11vw
}

#featured-solutions .left-side .row span {
  flex-shrink: 0;
  font-size: 13.5px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  white-space: pre-wrap
}

@media(min-width:800px)and (max-width:1270px) {
  #featured-solutions .left-side .row span {
    font-size: 13.5px
  }
}

@media(min-width:1270px)and (max-width:1400px) {
  #featured-solutions .left-side .row span {
    font-size: 17.067px
  }
}

@media(min-width:1400px) {
  #featured-solutions .left-side .row span {
    font-size: 22.5px
  }
}

@media(min-width:1400px)and (max-height:730px) {
  #featured-solutions .left-side .row span {
    font-size: 19px
  }
}

#featured-solutions .left-side .f-logo {
  cursor: pointer;
  max-width: 183px;
  width: 10.156vw
}

#featured-solutions .left-side .f-logo svg {
  height: auto;
  width: 100%
}

#featured-solutions .right-side {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  grid-template-columns: var(--featured-columns, repeat(auto-fit, minmax(100px, 1fr)));
  position: relative;
  top: 12px;
  top: var(--top-offset, 12px);
  width: 75.25%
}

#featured-solutions .right-side .featured-item {
  cursor: pointer
}

#featured-solutions .right-side .featured-item .item-head {
  height: 1.8vw;
  height: var(--heightOverride, 1.8vw)
}

#featured-solutions .right-side .featured-item img {
  height: 18vw;
  max-height: 200px;
  object-fit: contain
}

@media(min-aspect-ratio:1.5) {
  #featured-solutions .right-side .featured-item img {
    max-height: 30vh;
    max-height: var(--max-img-height-override, 30vh)
  }
}

#featured-solutions.slide-up {
  transform: translateY(0)
}

/* ============================================================
   ENGAGEMENT PAGE
   ============================================================ */

.engagementPage {
  position: relative
}

.engagementPage>div {
  position: relative;
  z-index: 2
}

.engagementPage .background {
  background: url(/assets/hotel/Engagement.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0
}

.engagementPage .text-blocks {
  display: flex;
  flex-direction: column;
  gap: 0;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 657px;
  max-width: 706px;
  position: absolute;
  top: 18.5%;
  width: 36.458vw;
  width: 38.458vw
}

@media(min-width:800px)and (max-width:1080px) {
  .engagementPage .text-blocks .std-text {
    font-size: 16.5px
  }
}

@media(min-width:800px)and (max-width:1080px)and (max-height:650px) {
  .engagementPage .text-blocks .std-text {
    font-size: 14px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .engagementPage .text-blocks .std-text {
    font-size: 18px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:700px) {
  .engagementPage .text-blocks .std-text {
    font-size: 16.5px
  }
}

@media(min-width:1270px)and (max-width:1750px) {
  .engagementPage .text-blocks .std-text {
    font-size: 22.756px
  }
}

@media(min-width:1270px)and (max-width:1750px)and (max-height:800px) {
  .engagementPage .text-blocks .std-text {
    font-size: 18px
  }
}

@media(min-width:1750px) {
  .engagementPage .text-blocks .std-text {
    font-size: 26px
  }
}

@media(min-width:1750px)and (max-height:900px) {
  .engagementPage .text-blocks .std-text {
    font-size: 26px
  }
}

@media(min-width:1750px)and (max-height:750px) {
  .engagementPage .text-blocks .std-text {
    font-size: 23px
  }
}

.engagementPage .featured-solutions {
  --featured-columns: 18% 18% 18% 25% 20%
}

.engagementPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.engagementPage .featured-solutions .featured-item img {
  max-height: 75%;
  max-width: 100%
}

.engagementPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.engagementPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .engagementPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .engagementPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* ============================================================
   HEADER COMPONENT
   ============================================================ */

.header {
  aspect-ratio: 700/200;
  background-image: url(data:image/png;base64,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);
  background-repeat: no-repeat;
  background-size: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  gap: 15px;
  height: auto;
  justify-content: center;
  max-width: 351px;
  position: fixed;
  position: absolute !important;
  right: 14.5%;
  top: 1.1%;
  width: 19.479vw;
  z-index: 5;
  z-index: 100 !important
}

.header /* ============================================================
   SOLUTION / FEATURED PAGES - SHARED LAYOUT
   ============================================================ */

.page-title {
  color: #000;
  display: none;
  font-family: Open Sans;
  font-size: 60px;
  font-style: normal;
  font-weight: 700;
  padding-right: 160px;
  text-align: center
}

@media(min-width:1900px) {
  .header .page-title {
    display: inline;
    display: initial
  }
}

.header .back {
  width: 84px
}

.header .back svg path {
  stroke: #113c46
}

.header.home {
  background: none;
  justify-content: center
}

.header.home .logo {
  height: 117px;
  width: 319px
}

.header .back-button,
.header .back-button img,
.header .home-button,
.header .home-button img {
  height: 100%;
  width: auto
}

.header .back-button svg path,
.header .home-button svg path {
  fill: var(--secondaryColor)
}

.header .back-button.clickable,
.header .home-button.clickable {
  cursor: pointer
}

.header--home {
  height: 4.5rem;
  padding-left: 798px;
  width: 16.3rem
}

.header--hide {
  visibility: hidden
}

.header .logo {
  height: 117px;
  width: 319px
}

.header--home-button {
  align-items: center;
  display: flex;
  flex-direction: row;
  height: 93px;
  justify-content: center;
  width: 93px
}

/* ============================================================
   HOTEL AREA MAP PAGE
   ============================================================ */

.hotelPage,
.hotelPage>div {
  position: relative
}

.hotelPage>div {
  z-index: 2
}

.hotelPage svg {
  cursor: pointer;
  height: auto;
  pointer-events: visiblePainted;
  width: 100%
}

.hotelPage .text-blocks {
  flex-direction: column;
  left: 8%;
  top: 18%;
  width: 36%
}

.hotelPage .tap,
.hotelPage .text-blocks {
  display: flex;
  left: 5%;
  left: 2.75%;
  position: absolute
}

.hotelPage .tap {
  align-items: flex-end;
  flex-direction: row;
  top: 57.2%
}

.hotelPage .tap img {
  aspect-ratio: 1/1;
  height: 6.4vw;
  max-height: 116px;
  width: auto
}

.hotelPage .logo {
  bottom: 1.2%;
  left: 1.7%;
  max-width: 183px;
  position: absolute;
  width: 10.156vw
}

.hotelPage .hotel-map {
  aspect-ratio: 1172/755;
  background: no-repeat url(/assets/hotel/Hotel.png);
  background-size: contain;
  height: auto;
  max-height: 755px;
  max-width: 1172px;
  object-fit: contain;
  position: absolute;
  right: -7.75%;
  top: 11%;
  width: 79.8474vw;
  z-index: 0
}

@media(min-width:1400px) {
  .hotelPage .hotel-map {
    right: 0
  }
}

@media(min-width:1400px)and (max-width:1650px) {
  .hotelPage .hotel-map {
    width: 70%
  }
}

@media(min-aspect-ratio:1.5) {
  .hotelPage .hotel-map {
    height: 90%;
    right: -6%;
    width: auto
  }
}

.hotelPage .hotel-map>div {
  animation: buttonAnimationHotel ease infinite
}

.hotelPage .hotel-map>div:first-child {
  animation-delay: 0;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(2) {
  animation-delay: 4s;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(3) {
  animation-delay: 8s;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(4) {
  animation-delay: 12s;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(5) {
  animation-delay: 16s;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(6) {
  animation-delay: 18s;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(7) {
  animation-delay: 22s;
  animation-duration: 30s
}

.hotelPage .hotel-map>div:nth-child(8) {
  animation-delay: 26s;
  animation-duration: 30s
}

.hotelPage .hotel-map .pool {
  left: 21.25%;
  position: absolute;
  top: 55%;
  width: 6.41%
}

.hotelPage .hotel-map .shipping {
  left: 30.25%;
  position: absolute;
  top: 32.5%;
  width: 9.887%
}

.hotelPage .hotel-map .market {
  left: 46%;
  position: absolute;
  top: 28.5%;
  width: 9.7546%
}

.hotelPage .hotel-map .lobby {
  left: 52%;
  position: absolute;
  top: 46%;
  width: 7.3535%
}

.hotelPage .hotel-map .valet {
  left: 58.5%;
  position: absolute;
  top: 61.3%;
  width: 6.796%
}

.hotelPage .hotel-map .gift {
  left: 62.25%;
  position: absolute;
  top: 28.75%;
  width: 8.985%
}

.hotelPage .hotel-map .office {
  left: 77.25%;
  position: absolute;
  top: 26.1%;
  width: 7.3535%
}

.hotelPage .hotel-map .guest {
  left: 53%;
  position: absolute;
  top: 2.5%;
  width: 12.04467%
}

@keyframes buttonAnimationHotel {

  0%,
  1.25%,
  2.5% {
    transform: scale(1)
  }

  0.625%,
  1.875% {
    transform: scale(.9)
  }
}

/* ============================================================
   OFFICE SVG FILLS
   ============================================================ */

.office-svg-1 {
  fill: url(#linear-gradient-2)
}

.office-svg-2 {
  opacity: .3
}

.office-svg-2,
.office-svg-3,
.office-svg-4 {
  fill: #fff
}

.office-svg-2,
.office-svg-4 {
  isolation: isolate
}

.office-svg-4 {
  opacity: .6
}

.office-svg-5 {
  fill: url(#linear-gradient)
}

/* --- Guest Rooms SVG fills --- */
.guest-svg-1 {
  fill: url(#linear-gradient-2)
}

.guest-svg-2,
.guest-svg-3,
.guest-svg-4 {
  fill: #fff
}

.guest-svg-3 {
  opacity: .6
}

.guest-svg-3,
.guest-svg-4 {
  isolation: isolate
}

.guest-svg-4 {
  opacity: .3
}

.guest-svg-5 {
  fill: url(#linear-gradient)
}

/* ============================================================
   HOTEL AREA DETAIL PAGES
   ============================================================ */

.lobbyPage {
  background: url(/assets/hotel/Hotel-Lobby.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.lobbyPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.lobbyPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.lobbyPage .text-wrapper .top svg {
  width: 100%
}

.lobbyPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.lobbyPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.lobbyPage .featured-solutions .featured-item img {
  max-width: 100%
}

.lobbyPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.lobbyPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .lobbyPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .lobbyPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.guestPage,
.guestPage>div {
  position: relative
}

.guestPage>div {
  z-index: 2
}

.guestPage .background {
  background: url(/assets/hotel/Hotel-Guest.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0
}

.guestPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.guestPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.guestPage .text-wrapper .top svg {
  width: 100%
}

.guestPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.guestPage .featured-solutions .right-side {
  justify-items: center
}

.guestPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.guestPage .featured-solutions .featured-item img {
  max-width: 69%
}

.guestPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.guestPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .guestPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .guestPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.poolPage {
  background: url(/assets/hotel/Hotel-Pool.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.poolPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.poolPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.poolPage .text-wrapper .top svg {
  width: 100%
}

.poolPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.poolPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.poolPage .featured-solutions .featured-item img {
  max-width: 100%
}

.poolPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.poolPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .poolPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .poolPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.marketPage {
  background: url(/assets/hotel/Hotel-Market.png);
  background-position: 50%;
  background-size: cover;
  position: relative
}

.marketPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.marketPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.marketPage .text-wrapper .top svg {
  width: 100%
}

.marketPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.marketPage .featured-solutions {
  --featured-columns: 50% 40%
}

.marketPage .featured-solutions .right-side {
  --top-offset: 0;
  justify-items: center
}

.marketPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.marketPage .featured-solutions .featured-item img {
  max-width: 100%
}

.marketPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.marketPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .marketPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .marketPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.officePage {
  background: url(/assets/hotel/Hotel-Office.png);
  background-position: 50%;
  background-size: cover;
  position: relative
}

.officePage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.officePage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.officePage .text-wrapper .top svg {
  width: 100%
}

.officePage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.officePage .featured-solutions {
  --featured-columns: 50% 29%
}

.officePage .featured-solutions .right-side {
  justify-items: center
}

.officePage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.officePage .featured-solutions .featured-item img {
  max-width: 70%
}

.officePage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.officePage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .officePage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .officePage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.giftsPage {
  background: url(/assets/hotel/Hotel-Gift-Shop.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.giftsPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.giftsPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.giftsPage .text-wrapper .top svg {
  width: 100%
}

.giftsPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.giftsPage .featured-solutions {
  --top-offset: -12px
}

.giftsPage .featured-solutions .right-side {
  justify-items: center
}

.giftsPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.giftsPage .featured-solutions .featured-item img {
  max-width: 69%
}

.giftsPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.giftsPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .giftsPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .giftsPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.valetPage,
.valetPage>div {
  position: relative
}

.valetPage>div {
  z-index: 2
}

.valetPage .background {
  background: url(/assets/hotel/Hotel-Valet.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0
}

.valetPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.valetPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.valetPage .text-wrapper .top svg {
  width: 100%
}

.valetPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.valetPage .featured-solutions .right-side {
  justify-items: center
}

.valetPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.valetPage .featured-solutions .featured-item img {
  max-width: 100%
}

.valetPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.valetPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .valetPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .valetPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.shippingPage {
  background: url(/assets/hotel/Hotel-Shipping.png);
  background-position: 50%;
  background-size: cover;
  position: relative
}

.shippingPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 1023px;
  position: absolute;
  top: 16.25%;
  width: 56.822%
}

.shippingPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.shippingPage .text-wrapper .top svg {
  width: 100%
}

.shippingPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 69%
}

.shippingPage .featured-solutions .right-side {
  justify-items: center
}

.shippingPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.shippingPage .featured-solutions .featured-item img {
  max-width: 100%
}

.shippingPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.shippingPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .shippingPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .shippingPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* --- Restaurant detail page --- */
.restaurantPage {
  background: url(/assets/hotel/Dining-Restaurant.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.restaurantPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.restaurantPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.restaurantPage .text-wrapper .top svg {
  width: 100%
}

.restaurantPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 64.86%
}

@media(min-width:1270px)and (max-width:1400px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 18.5px
  }
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:800px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 15px
  }
}

@media(min-width:1400px)and (max-width:1750px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 20px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:830px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 18.5px
  }
}

@media(min-width:1750px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 26px
  }
}

@media(min-width:1750px)and (max-height:800px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px)and (max-height:680px) {
  .restaurantPage .text-wrapper .std-text {
    font-size: 19px
  }
}

.restaurantPage .featured-solutions {
  --featured-columns: 21% 14% 15% 17% 15% 18%
}

.restaurantPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.restaurantPage .featured-solutions .featured-item img {
  max-width: 100%
}

.restaurantPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.restaurantPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .restaurantPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .restaurantPage .featured-solutions .featured-item .item-head {
    font-size: 22px
  }
}

@media(min-width:1750px) {
  .restaurantPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* --- Casual Dining detail page --- */
.casualPage {
  background: url(/assets/hotel/Dining-Casual.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.casualPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.casualPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.casualPage .text-wrapper .top svg {
  width: 100%
}

.casualPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 64.86%
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:830px) {
  .casualPage .text-wrapper .std-text {
    font-size: 20px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:830px) {
  .casualPage .text-wrapper .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px)and (max-height:870px) {
  .casualPage .text-wrapper .std-text {
    font-size: 27px
  }
}

.casualPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.casualPage .featured-solutions .featured-item img {
  max-width: 100%
}

.casualPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.casualPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .casualPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .casualPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* --- Kitchen detail page --- */
.kitchenPage {
  background: url(/assets/hotel/Dining-Kitchen.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.kitchenPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.kitchenPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.kitchenPage .text-wrapper .top svg {
  width: 100%
}

.kitchenPage .text-wrapper .std-text {
  white-space: pre-wrap;
  width: 64.86%
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:830px) {
  .kitchenPage .text-wrapper .std-text {
    font-size: 20px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:830px) {
  .kitchenPage .text-wrapper .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px)and (max-height:870px) {
  .kitchenPage .text-wrapper .std-text {
    font-size: 27px
  }
}

.kitchenPage .featured-solutions {
  --featured-columns: 45% 45%;
  --top-offset: 0px
}

.kitchenPage .featured-solutions .right-side {
  justify-items: center
}

.kitchenPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.kitchenPage .featured-solutions .featured-item img {
  max-width: 80%
}

.kitchenPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.kitchenPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .kitchenPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .kitchenPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* ============================================================
   DINING AREA MAP PAGE
   ============================================================ */

.diningPage {
  background-image: url(/assets/hotel/DiningBg.png);
  background-position: 50%;
  background-size: cover;
  position: relative
}

.diningPage svg {
  cursor: pointer;
  height: auto;
  pointer-events: visiblePainted;
  width: 100%
}

.diningPage .text-blocks {
  flex-direction: column;
  gap: 44px;
  left: 8%;
  max-width: 659px;
  top: 19%;
  width: 36.6vw;
  z-index: 5
}

.diningPage .tap,
.diningPage .text-blocks {
  display: flex;
  left: 5%;
  left: 2.75%;
  position: absolute
}

.diningPage .tap {
  align-items: flex-end;
  flex-direction: row;
  top: 57.2%
}

.diningPage .tap img {
  aspect-ratio: 1/1;
  height: 6.4vw;
  max-height: 116px;
  width: auto
}

.diningPage .logo {
  bottom: 1.2%;
  left: 1.7%;
  max-width: 183px;
  position: absolute;
  width: 10.156vw
}

.diningPage .dining-map {
  aspect-ratio: 74.328/49.15;
  background: no-repeat url(/assets/hotel/Dining.png);
  background-size: contain;
  height: 49.15vw;
  max-height: 885px;
  max-width: 1338px;
  position: absolute;
  right: -10.75%;
  top: 14.25%;
  width: 74.328vw;
  width: auto
}

@media(min-aspect-ratio:1.5) {
  .diningPage .dining-map {
    height: 90%;
    right: -15%;
    top: 2%;
    top: 12%
  }
}

.diningPage .dining-map>div {
  animation: buttonAnimation ease infinite
}

.diningPage .dining-map>div:first-child {
  animation-delay: 0;
  animation-duration: 12s
}

.diningPage .dining-map>div:nth-child(2) {
  animation-delay: 4s;
  animation-duration: 12s
}

.diningPage .dining-map>div:nth-child(3) {
  animation-delay: 8s;
  animation-duration: 12s
}

.diningPage .dining-map .restaurant {
  left: 11%;
  position: absolute;
  top: 27%;
  width: 11.99%
}

.diningPage .dining-map .kitchen {
  left: 47%;
  position: absolute;
  top: 11%;
  width: 9.85%
}

.diningPage .dining-map .casual {
  left: 54.75%;
  position: absolute;
  top: 39%;
  width: 9.346%
}

@keyframes buttonAnimation {

  0%,
  4.165%,
  8.33% {
    transform: scale(1)
  }

  2.085%,
  6.25% {
    transform: scale(.9)
  }
}

/* ============================================================
   BEACH PAGE
   ============================================================ */

.beachPage {
  background: url(/assets/hotel/Beach.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.beachPage .text-wrapper {
  left: 9%;
  left: 5%;
  left: 2.75%;
  position: absolute;
  top: 18.5%
}

.beachPage .text-wrapper,
.beachPage .text-wrapper .top {
  display: flex;
  flex-direction: column
}

.beachPage .text-wrapper .std-text {
  max-width: 660px;
  width: 36.667vw
}

.beachPage .featured-solutions {
  --top-offset: 16px;
  --featured-columns: 19% 19% 24% 19% 19%
}

.beachPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.beachPage .featured-solutions .featured-item img {
  max-width: 100%
}

.beachPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.beachPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .beachPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .beachPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.beachPage .featured-solutions .featured-item:nth-child(3) > img {
  max-width: 60%;
  object-fit: contain
}

@media(min-aspect-ratio:1.5) {
  .beachPage .featured-solutions .featured-item:nth-child(3) > img {
    --max-img-height-override: 39vh
  }
}

/* ============================================================
   CONFERENCE PAGE
   ============================================================ */

.conferencePage {
  position: relative
}

.conferencePage>div {
  position: relative;
  z-index: 2
}

.conferencePage .background {
  background: url(/assets/hotel/Conference.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0
}

.conferencePage .text-blocks {
  display: flex;
  flex-direction: column;
  gap: 0;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 657px;
  position: absolute;
  top: 20%;
  width: 36.46vw
}

.conferencePage .featured-solutions .right-side {
  --top-offset: -4%;
  justify-items: center
}

.conferencePage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.conferencePage .featured-solutions .featured-item img {
  height: 90%
}

.conferencePage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.conferencePage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .conferencePage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .conferencePage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* ============================================================
   SPA PAGE
   ============================================================ */

.spaPage {
  background: url(/assets/hotel/Spa.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.spaPage .text-blocks {
  display: flex;
  flex-direction: column;
  gap: 0;
  left: 7.25%;
  left: 5%;
  left: 2.75%;
  position: absolute;
  top: 18%
}

.spaPage .text-blocks .std-text {
  max-width: 787px;
  width: 100%
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:830px) {
  .spaPage .text-blocks .std-text {
    font-size: 20px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:830px) {
  .spaPage .text-blocks .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px)and (max-height:870px) {
  .spaPage .text-blocks .std-text {
    font-size: 27px
  }
}

.spaPage .featured-solutions {
  --featured-columns: 26% 26% 20% 26%
}

.spaPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-end
}

.spaPage .featured-solutions .featured-item img {
  --max-img-height-override: 23vh;
  height: auto;
  object-fit: contain;
  width: 100%
}

@media(min-aspect-ratio:1.5) {
  .spaPage .featured-solutions .featured-item img {
    --max-img-height-override: 26vh
  }
}

.spaPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.spaPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .spaPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .spaPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.spaPage .featured-solutions .featured-item .item-head .book4time {
  height: auto;
  max-width: 60%
}

/* ============================================================
   TENNIS PAGE
   ============================================================ */

.tennisPage>div {
  position: relative;
  z-index: 2
}

.tennisPage .background {
  background: url(/assets/hotel/Tennis.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0
}

.tennisPage .text-blocks {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 650px;
  position: absolute;
  top: 19.5%;
  width: 36.09vw
}

.tennisPage .featured-solutions {
  --top-offset: 16px;
  --featured-columns: 19% 19% 24% 19% 19%
}

.tennisPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.tennisPage .featured-solutions .featured-item img {
  max-width: 100%;
  object-fit: contain
}

.tennisPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.tennisPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .tennisPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .tennisPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

.tennisPage .featured-solutions .featured-item:nth-child(3) img {
  height: 100%;
  object-fit: contain;
  position: relative;
  right: 3%;
  width: 100%
}

@media(min-aspect-ratio:1.5) {
  .tennisPage .featured-solutions .featured-item:nth-child(3) img {
    --max-img-height-override: 35vh
  }
}

.tennisPage .featured-solutions .featured-item:nth-child(4) img {
  width: 100%
}

@media(min-aspect-ratio:1.5) {
  .tennisPage .featured-solutions .featured-item:nth-child(4) img {
    --max-img-height-override: 38vh
  }
}

/* ============================================================
   CONTINUOUS CONNECTION PAGE
   ============================================================ */

.connectionPage>div {
  position: relative;
  z-index: 2
}

.connectionPage .background {
  background: url(/assets/hotel/Continuous-Connection.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 0
}

.connectionPage .text-blocks {
  display: flex;
  flex-direction: column;
  left: 8.5%;
  left: 5%;
  left: 2.75%;
  max-width: 650px;
  position: absolute;
  top: 20%;
  width: 36.1vw
}

.connectionPage .featured-solutions {
  --featured-columns: 19% 19% 19% 23% 20%
}

.connectionPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.connectionPage .featured-solutions .featured-item img {
  max-width: 100%
}

.connectionPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.connectionPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px)and (max-width:1400px) {
  .connectionPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .connectionPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* ============================================================
   GOLF AREA MAP PAGE
   ============================================================ */

.golfPage {
  
  background-position-x: 60%;
  background-position-y: center;
  background-size: cover;
  position: relative
}

.golfPage>div {
  position: relative;
  z-index: 2
}

.golfPage svg {
  cursor: pointer;
  height: auto;
  pointer-events: visiblePainted;
  width: 100%
}

.golfPage .text-blocks {
  flex-direction: column;
  left: 8.5%;
  max-width: 650px;
  top: 19.5%;
  width: 36.09vw
}

.golfPage .tap,
.golfPage .text-blocks {
  display: flex;
  left: 5%;
  left: 2.75%;
  position: absolute
}

.golfPage .tap {
  align-items: flex-end;
  flex-direction: row;
  top: 57.2%
}

.golfPage .tap img {
  aspect-ratio: 1/1;
  height: 6.4vw;
  max-height: 116px;
  width: auto
}

.golfPage .logo {
  bottom: 1.2%;
  left: 1.7%;
  max-width: 183px;
  position: absolute;
  width: 10.156vw
}

.golfPage .golf-map {
  aspect-ratio: 63.99/53.55;
  background: no-repeat url(/assets/hotel/GolfBG.png);
  background-size: contain;
  height: 53.55vw;
  height: auto;
  max-height: 821px;
  max-width: 980px;
  position: absolute;
  right: -7%;
  top: 7.9%;
  width: 63.99vw
}

@media(min-aspect-ratio:1.5) {
  .golfPage .golf-map {
    height: 100%;
    width: auto
  }
}

.golfPage .golf-map>div {
  animation: buttonAnimation ease infinite
}

.golfPage .golf-map>div:first-child {
  animation-delay: 0;
  animation-duration: 16s
}

.golfPage .golf-map>div:nth-child(2) {
  animation-delay: 4s;
  animation-duration: 16s
}

.golfPage .golf-map>div:nth-child(3) {
  animation-delay: 8s;
  animation-duration: 16s
}

.golfPage .golf-map>div:nth-child(4) {
  animation-delay: 12s;
  animation-duration: 16s
}

.golfPage .golf-map .cart {
  left: 12%;
  position: absolute;
  top: 9%;
  width: 15.31%
}

.golfPage .golf-map .hall {
  left: 34%;
  position: absolute;
  top: 19.5%;
  width: 15.31%
}

.golfPage .golf-map .club {
  left: 33%;
  position: absolute;
  top: 51.75%;
  width: 16.65%
}

.golfPage .golf-map .shop {
  left: 15%;
  position: absolute;
  top: 34%;
  width: 14.742%
}

/* --- Lounge detail page --- */
.loungePage {
  background: url(/assets/hotel/Lounge.png) no-repeat;
  background-position-x: center;
  background-size: cover;
  position: relative
}

.loungePage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.loungePage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.loungePage .text-wrapper .top svg {
  width: 100%
}

.loungePage .text-wrapper .std-text {
  width: 73%
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:830px) {
  .loungePage .text-wrapper .std-text {
    font-size: 20px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:830px) {
  .loungePage .text-wrapper .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px)and (max-height:870px) {
  .loungePage .text-wrapper .std-text {
    font-size: 27px
  }
}

.loungePage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.loungePage .featured-solutions .featured-item img {
  max-width: 100%
}

.loungePage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.loungePage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .loungePage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .loungePage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* --- Shop detail page --- */
.shopPage {
  background: url(/assets/hotel/Shop.png) no-repeat;
  background-position-x: center;
  background-size: cover;
  position: relative
}

.shopPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.shopPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.shopPage .text-wrapper .top svg {
  width: 100%
}

.shopPage .text-wrapper .std-text {
  width: 70%
}

.shopPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: column
}

.shopPage .featured-solutions .featured-item img {
  max-width: 100%
}

.shopPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.shopPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .shopPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .shopPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* --- Golf Cart detail page --- */
.cartPage {
  background: url(/assets/hotel/Cart.png) no-repeat;
  background-position-x: 69%;
  background-size: cover;
  position: relative
}

.cartPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.cartPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.cartPage .text-wrapper .top svg {
  width: 100%
}

.cartPage .text-wrapper .std-text {
  width: 65%
}

.cartPage .featured-solutions .right-side {
  justify-items: center
}

.cartPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 40px;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-top: auto
}

.cartPage .featured-solutions .featured-item img {
  max-width: 100%
}

.cartPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.cartPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .cartPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .cartPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* --- Hall detail page --- */
.hallPage {
  background: url(/assets/hotel/Hall.png) no-repeat;
  background-position: 50%;
  background-size: cover;
  position: relative
}

.hallPage .text-wrapper {
  display: flex;
  flex-direction: column;
  left: 9%;
  left: 5%;
  left: 2.75%;
  max-width: 1016px;
  position: absolute;
  top: 18%;
  width: 56.4vw
}

.hallPage .text-wrapper .top {
  display: flex;
  flex-direction: column;
  margin-bottom: 2%;
  width: 100%
}

.hallPage .text-wrapper .top svg {
  width: 100%
}

.hallPage .text-wrapper .std-text {
  width: 72.5%
}

.hallPage .featured-solutions .right-side {
  --top-offset: 0;
  justify-items: center
}

.hallPage .featured-solutions .featured-item {
  align-items: center;
  display: flex;
  flex-direction: row
}

.hallPage .featured-solutions .featured-item img {
  max-width: 69%
}

.hallPage .featured-solutions .featured-item .item-head {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 16px;
  white-space: nowrap
}

.hallPage .featured-solutions .featured-item .item-head svg {
  height: 100%;
  width: auto
}

@media(min-width:1270px) {
  .hallPage .featured-solutions .featured-item .item-head {
    font-size: 20px
  }
}

@media(min-width:1400px) {
  .hallPage .featured-solutions .featured-item .item-head {
    font-size: 24px
  }
}

/* ============================================================
   POPUP / MODAL
   ============================================================ */

.popup {
  background: rgba(32, 33, 36, .7);
  flex-direction: column;
  height: 100%;
  left: 0;
  position: fixed !important;
  top: 0;
  width: 100%;
  z-index: 999
}

.popup,
.popup .close {
  align-items: center;
  display: flex;
  justify-content: center
}

.popup .close {
  cursor: pointer;
  height: 60px;
  margin: 0 0 0 auto;
  position: absolute;
  right: 5px;
  top: 5px;
  width: 60px;
  z-index: 2
}

.popup .close svg {
  height: 60px;
  position: fixed
}

.popup .offclick {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1
}

.popup .holder {
  align-items: flex-start;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  position: relative;
  z-index: 2
}

.popup .holder .txt_btn {
  font-size: 23px
}

.popup .holder p {
  line-height: 1.2
}

.popup .holder video {
  height: 100%;
  object-fit: contain;
  width: 100%
}

.popup .thanks {
  text-align: center
}

.popup .loader {
  margin: auto;
  width: 200px !important
}

.popup h3 {
  color: #141c44;
  font-size: 75px;
  font-style: normal;
  font-weight: 600;
  line-height: 75px;
  margin: 110px 0 95px
}

.popup button,
.popup h3 {
  text-align: center;
  width: 100%
}

.popup button {
  background: #3f57e8;
  border: none;
  color: #fff;
  font-size: 38.8164px;
  font-weight: 700;
  height: 129px;
  line-height: 47px;
  outline: none;
  text-transform: capitalize;
  transition: all .3s
}

.popup .checkmark {
  margin-bottom: 20px
}

.popup .checkmark svg {
  height: 150px
}

.popup .checkmark svg path {
  fill: #3f57e8
}

.popup.full .close {
  right: -115px;
  top: -42px
}

@media only screen and (max-width:1080px) {
  .popup.full .close {
    right: 26px;
    top: -50px
  }
}

.popup.full .holder {
  background: none;
  height: 100%;
  overflow: hidden;
  width: 100%
}

.popup.full .holder video {
  height: 821px;
  padding-left: 100px;
  width: 1457px
}

@media only screen and (max-width:1080px) {
  .popup.full .holder video {
    height: 609px;
    width: 1080px
  }

  .popup.full .holder {
    background: none;
    overflow: hidden;
    padding: 0;
    width: 1080px
  }
}

@media only screen and (min-width:1920px) {
  .vertical-header {
    display: none
  }
}

.page-title {
  align-items: flex-end;
  display: flex;
  flex-direction: row;
  height: 8.11vw;
  left: 6.7%;
  max-height: 125px;
  max-width: 60vw;
  position: absolute;
  top: 5.1%;
  width: auto
}

.page-title img {
  height: 100%;
  width: 100%
}

.page-title span {
  letter-spacing: -3px
}

.text-blocks {
  display: flex;
  flex-direction: column;
  left: 6.7%;
  max-width: 787px;
  position: absolute;
  top: 28%;
  width: 43.75%
}

.text-blocks .std-text {
  font-size: 17px;
  font-size: 14px
}

.text-blocks .std-text + .std-text {
  margin-top: 1em
}

@media(min-width:800px)and (max-width:1080px) {
  .text-blocks .std-text {
    font-size: 16.5px
  }
}

@media(min-width:800px)and (max-width:1080px)and (max-height:450px) {
  .text-blocks .std-text {
    font-size: 14px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .text-blocks .std-text {
    font-size: 18px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:500px) {
  .text-blocks .std-text {
    font-size: 16.5px
  }
}

@media(min-width:1270px)and (max-width:1750px) {
  .text-blocks .std-text {
    font-size: 22.756px
  }
}

@media(min-width:1270px)and (max-width:1750px)and (max-height:600px) {
  .text-blocks .std-text {
    font-size: 18px
  }
}

@media(min-width:1750px) {
  .text-blocks .std-text {
    font-size: 26px
  }
}

@media(min-width:1750px)and (max-height:870px) {
  .text-blocks .std-text {
    font-size: 22px
  }
}

@media(min-width:1750px) {
  .text-blocks .std-text {
    font-size: 30px
  }
}

.play-video {
  align-items: center;
  background-color: var(--primaryColor);
  border-radius: 55px;
  bottom: 10%;
  bottom: 8%;
  color: #fff;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  font-size: 20px;
  font-weight: 500;
  gap: 15px;
  height: 9%;
  justify-content: space-evenly;
  left: 6.7%;
  max-width: 370px;
  padding: 2.5% 4%;
  position: absolute;
  white-space: nowrap
}

@media(min-width:1080px) {
  .play-video {
    font-size: 22px
  }
}

@media(min-width:1270px) {
  .play-video {
    font-size: 27.3px
  }
}

@media(min-width:1400px) {
  .play-video {
    font-size: 36px
  }
}

.play-video svg {
  flex-shrink: 0;
  height: 3.5vh;
  max-height: 37.5px;
  width: auto
}

.page .popup .holder {
  align-items: flex-start;
  aspect-ratio: 1197/720;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  height: auto;
  justify-content: center;
  max-height: 712px;
  max-width: 1184px;
  overflow: hidden;
  padding: 2.9%;
  position: relative;
  width: 75.74vw;
  z-index: 2
}

.page .popup .holder .close {
  height: 7%;
  width: auto
}

.page .popup .holder .close svg {
  height: 100%;
  position: static;
  width: auto
}

/* ============================================================
   FEATURED SOLUTION PAGES
   ============================================================ */

.bookPage .img-1 {
  position: absolute;
  right: 3%;
  top: 20%;
  width: 46.1979%
}

.bookPage .img-2 {
  position: absolute;
  right: 1%;
  top: 42%;
  width: 15.729%
}

.marketingPage .img-1 {
  position: absolute;
  right: 3%;
  top: 19.5%;
  width: 46.1979%
}

.marketingPage .img-2 {
  position: absolute;
  right: 1%;
  top: 42%;
  width: 15.729%
}

@media(min-width:1750px) {
  .marketingPage .text-blocks .std-text {
    font-size: 25px
  }
}

.eatecPage .img-1 {
  position: absolute;
  right: 7.25%;
  top: 12.5%;
  width: 39.948%
}

.eatecPage .img-2 {
  position: absolute;
  right: 1.75%;
  top: 45.5%;
  width: 39.948%
}

@media(min-width:1750px) {
  .eatecPage .text-blocks .std-text {
    font-size: 25px
  }
}

.expressKioskFPage .img-1 {
  max-width: 850px;
  position: absolute;
  right: 0;
  top: 15%;
  width: 50%
}

@media(min-width:1750px) {
  .expressKioskFPage .text-blocks .std-text {
    font-size: 26px
  }
}

.expressMobileFPage .text-blocks {
  top: 23%
}

.expressMobileFPage ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0
}

.expressMobileFPage ul li {
  align-items: center;
  display: flex;
  flex-direction: row
}

.expressMobileFPage ul li .dot {
  aspect-ratio: 1;
  background: #000;
  border-radius: 100%;
  margin: 0 4%;
  width: 1.25%
}

.expressMobileFPage .img-1 {
  max-height: 750px;
  object-fit: contain;
  position: absolute;
  right: 11%;
  top: 15%;
  width: 26.927%
}

.expressMobileFPage .text-blocks .std-text {
  font-size: 12px
}

@media(min-width:800px)and (max-width:1080px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 14.5px
  }
}

@media(min-width:800px)and (max-width:1080px)and (max-height:450px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 12px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 16px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:500px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 14.5px
  }
}

@media(min-width:1270px)and (max-width:1750px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 22px
  }
}

@media(min-width:1270px)and (max-width:1750px)and (max-height:600px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 16px
  }
}

@media(min-width:1750px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 26px
  }
}

@media(min-width:1750px)and (max-height:870px) {
  .expressMobileFPage .text-blocks .std-text {
    font-size: 22px
  }
}

.golfFPage .img-1 {
  position: absolute;
  right: 1.5%;
  top: 21%;
  width: 46.302%
}

@media(min-width:1750px) {
  .golfFPage .text-blocks .std-text {
    font-size: 26.5px
  }
}

.guestAppFPage .img-1 {
  position: absolute;
  right: 21.75%;
  top: 12%;
  width: 24%
}

.guestAppFPage .img-2 {
  position: absolute;
  right: 3.5%;
  top: 19%;
  width: 24%
}

@media(min-width:1750px) {
  .guestAppFPage .text-blocks .std-text {
    font-size: 28px
  }
}

.digitalMenuFPage .img-1 {
  position: absolute;
  right: 2%;
  top: 27%;
  width: 45.3646%
}

.IGFlyFPage .img-1 {
  height: 84.9%;
  position: absolute;
  right: 14.25%;
  top: 13%
}

@media(min-width:1750px) {
  .IGFlyFPage .text-blocks .std-text {
    font-size: 27px
  }
}

.IGKDSFPage .img-1 {
  position: absolute;
  right: 2.25%;
  top: 27%;
  width: 45.052%
}

@media(min-width:1750px) {
  .IGKDSFPage .text-blocks .std-text {
    font-size: 26px
  }
}

.IGKioskFPage .img-1 {
  height: 76.48%;
  position: absolute;
  right: 15.5%;
  top: 10%
}

.IGKioskFPage .img-2 {
  height: 76.48%;
  position: absolute;
  right: 2%;
  top: 23.5%
}

.IGOnDemandFPage .img-1 {
  height: 78.52%;
  position: absolute;
  right: 20.25%;
  top: 12%
}

.IGOnDemandFPage .img-2 {
  height: 78.52%;
  position: absolute;
  right: 2.75%;
  top: 20%
}

.IGQuickPayFPage .img-1 {
  height: 90.37%;
  position: absolute;
  right: 4.5%;
  top: 9%;
  top: 11%
}

.IGSmartMenuFPage .img-1 {
  height: 89%;
  position: absolute;
  right: 11%;
  top: 10.5%
}

.infoGenesisFPage .text-blocks {
  top: 25%
}

.infoGenesisFPage .img-1 {
  position: absolute;
  right: .75%;
  top: 13%;
  width: 44.427%
}

.infoGenesisFPage .img-2 {
  position: absolute;
  right: 15%;
  top: 51%;
  width: 35.1%
}

@media(min-width:1750px) {
  .infoGenesisFPage .text-blocks .std-text {
    font-size: 24px
  }
}

.loyaltyFPage .img-1 {
  position: absolute;
  right: 3%;
  top: 20%;
  width: 46%
}

.loyaltyFPage .img-2 {
  height: 51.02%;
  position: absolute;
  right: 2%;
  top: 43%
}

@media(min-width:1750px) {
  .loyaltyFPage .text-blocks .std-text {
    font-size: 28px
  }
}

.membershipsFPage .img-1 {
  height: 78.24%;
  position: absolute;
  right: 20%;
  top: 12%
}

.membershipsFPage .img-2 {
  height: 78.24%;
  position: absolute;
  right: 1%;
  top: 20%
}

.PMSFPage .img-1 {
  position: absolute;
  right: 1.5%;
  top: 21%;
  width: 46.5625%
}

.reserveFPage .text-blocks {
  top: 22.5%
}

@media(min-aspect-ratio:1.5) {
  .reserveFPage .text-blocks {
    top: 24%
  }
}

.reserveFPage .img-1 {
  height: 79.35%;
  position: absolute;
  right: 20%;
  top: 12%
}

.reserveFPage .img-2 {
  height: 79.35%;
  position: absolute;
  right: 2%;
  top: 19%
}

.reserveFPage .std-text .head {
  font-weight: 700;
  margin-bottom: 2%
}

@media(min-width:1750px) {
  .reserveFPage .text-blocks .std-text {
    font-size: 24px
  }
}

.retailFPage .img-1 {
  position: absolute;
  right: 2%;
  top: 22%;
  width: 45.677%
}

.salesFPage .img-1 {
  position: absolute;
  right: 1%;
  top: 24%;
  width: 50.833%
}

.serviceFPage .img-1 {
  position: absolute;
  right: 3%;
  top: 20%;
  width: 46%
}

.serviceFPage .img-2 {
  height: 50.37%;
  position: absolute;
  right: 10.5%;
  top: 39.5%
}

.serviceFPage .img-3 {
  height: 50.37%;
  position: absolute;
  right: 1.25%;
  top: 43%
}

.serviceFPage .play-video {
  left: 0;
  position: relative;
  top: 0
}

.serviceFPage .video-buttons {
  bottom: 10%;
  display: flex;
  flex-direction: row;
  gap: 1vw;
  left: 6.7%;
  position: absolute
}

@media(min-width:1750px) {
  .serviceFPage .text-blocks .std-text {
    font-size: 26px
  }
}

.spaFPage .img-1 {
  position: absolute;
  right: 1.25%;
  top: 21%;
  width: 40%
}

.spaFPage .text-blocks {
  max-width: 914px;
  top: 24%;
  width: 50.75%
}

@media(min-width:1400px) {
  .spaFPage .text-blocks {
    top: 22%
  }

  .spaFPage .play-video {
    bottom: 6%
  }
}

@media(min-width:1750px) {
  .spaFPage .text-blocks .std-text {
    font-size: 26px
  }
}

/* ============================================================
   ABOUT US PAGE
   ============================================================ */

.aboutUsPage {
  position: relative
}

.aboutUsPage .background {
  background: url(/assets/hotel/aboutAgilysysText3.png) no-repeat;
  background-position-x: center;
  background-position-y: 57%;
  background-size: contain;
  height: 100%;
  position: absolute;
  width: 100%
}

.aboutUsPage .green-text {
  color: #fff;
  display: none;
  font-size: 15.75px;
  font-weight: 400;
  height: 21.1%;
  left: 0;
  line-height: 1.2;
  padding: 1.8% 2.2% 0 5.85%;
  position: absolute;
  top: 39.75%;
  width: 36.48vw;
  width: 45.4%
}

@media(min-width:1270px) {
  .aboutUsPage .green-text {
    font-size: 19.9px
  }
}

@media(min-width:1400px) {
  .aboutUsPage .green-text {
    font-size: 26.25px
  }
}

.aboutUsPage .text-wrapper {
  display: flex;
  flex-direction: column;
  font-size: 18px;
  font-size: 15.5px;
  font-weight: 400;
  left: 6%;
  line-height: 1.2;
  position: absolute;
  text-align: right;
  top: 69%
}

@media(min-width:800px) {
  .aboutUsPage .text-wrapper {
    font-size: 17px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .aboutUsPage .text-wrapper {
    font-size: 19.125px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:600px) {
  .aboutUsPage .text-wrapper {
    font-size: 17px
  }
}

@media(min-width:1270px)and (max-width:1400px) {
  .aboutUsPage .text-wrapper {
    font-size: 24.178px
  }
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:700px) {
  .aboutUsPage .text-wrapper {
    font-size: 20px
  }
}

@media(min-width:1400px)and (max-width:1750px) {
  .aboutUsPage .text-wrapper {
    font-size: 27px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:700px) {
  .aboutUsPage .text-wrapper {
    font-size: 24px
  }
}

@media(min-width:1750px) {
  .aboutUsPage .text-wrapper {
    font-size: 31.875px
  }
}

@media(min-width:1750px)and (max-height:800px) {
  .aboutUsPage .text-wrapper {
    font-size: 27px
  }
}

.aboutUsPage .text-wrapper .head {
  font-size: 25px;
  font-size: 22px
}

@media(min-width:800px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 25px
  }
}

@media(min-width:1080px)and (max-width:1270px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 27px
  }
}

@media(min-width:1080px)and (max-width:1270px)and (max-height:600px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 24px
  }
}

@media(min-width:1270px)and (max-width:1400px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 34.133px
  }
}

@media(min-width:1270px)and (max-width:1400px)and (max-height:700px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 29px
  }
}

@media(min-width:1400px)and (max-width:1750px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 39px
  }
}

@media(min-width:1400px)and (max-width:1750px)and (max-height:700px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 35px
  }
}

@media(min-width:1750px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 45px
  }
}

@media(min-width:1750px)and (max-height:800px) {
  .aboutUsPage .text-wrapper .head {
    font-size: 39px
  }
}

.aboutUsPage .text-wrapper .body {
  line-height: 1.2;
  margin-bottom: 38px;
  white-space: pre-wrap
}

.aboutUsPage .text-wrapper .body span {
  color: var(--primaryColor);
  font-weight: 700
}

.aboutUsPage .text-wrapper .footer {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 13px;
  white-space: nowrap
}

.aboutUsPage .text-wrapper .footer svg {
  max-width: 70.319px;
  width: 3.9vw
}

/* ============================================================
   ORIENTATION / DEVICE GUARD
   ============================================================ */

.no-display {
  align-items: center;
  background: no-repeat url(/assets/hotel/Glow-Orb-Background.jpg);
  background-size: cover;
  display: flex;
  height: 100%;
  justify-content: center;
  padding: 10px;
  position: fixed;
  text-align: center;
  width: 100%;
  z-index: 50
}

@media(orientation:landscape)and (min-width:1024px)and (min-height:590px) {
  .no-display {
    display: none
  }
}

/* ============================================================
   BOOK4TIME PAGE
   ============================================================ */

.book4timePage .page-title {
  height: 15vh;
  max-height: 190px;
  max-width: 43vw
}

@media(min-aspect-ratio:1.5) {
  .book4timePage .page-title {
    height: 10vw
  }
}

.book4timePage .page-title img {
  height: 100%;
  object-fit: contain;
  width: 100%
}

.book4timePage .img-1 {
  position: absolute;
  right: 3%;
  top: 20%;
  width: 46.1979%
}

@media(max-height:700px) {
  .book4timePage .img-1 {
    width: 38%
  }
}

.book4timePage .img-2 {
  position: absolute;
  right: 7%;
  top: 39%;
  width: 15.729%
}

@media(max-height:700px) {
  .book4timePage .img-2 {
    width: 14%
  }
}

.book4timePage .img-3 {
  position: absolute;
  right: -.5%;
  top: 45%;
  width: 15.729%
}

@media(max-height:700px) {
  .book4timePage .img-3 {
    width: 14%
  }
}
.root-home { height: 77px; position: fixed; right: 33px; top: 35.2px; width: auto; cursor: pointer; z-index: 100; }
.root-home svg { height: 100%; width: auto; }
.root-home svg path { fill: var(--primaryColor); }

/* Use Agilysys logo placement instead of the global home icon */
.root-home { display: none; }
.landingPage .logo { top: 3%; bottom: auto; }