/* colors */
:root {
  --hoverColor: #97999c;
}

a:hover,
a:focus {
  color: var(--hoverColor);
}

.stayPlayButton {
  background-color: #a39161;
  color: #fff;
}

.h2NoMargTop {
  margin-top: 0px;
}

.mb-2 {
  margin-bottom: 20px;
}

.tp-text {
  font-size: 4.3vw !important;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  white-space: normal !important;
  line-height: normal !important;
  text-align: center;
}

.tp-description {
  font-size: 2vw !important;
  font-weight: 400;
}

.tp-simpleresponsive .button {
  line-height: normal !important;
  font-size: 2.3vw !important;
  height: auto;
  text-transform: uppercase;
  text-shadow: none !important;
}

.slideshow-arrow {
  color: #ffffff;
  font-size: 50px;
  margin-top: -20px;
  margin-right: 67px;
}

@media (min-width: 1200px) {
  .slideshow-arrow {
    font-size: 100px;
    margin-top: -50px;
  }
}

.tp-mobile {
  display: none;
}

@media (max-width: 768px) and (min-width: 576px) {
  .tp-text {
    font-size: 7vw !important;
  }

  .tp-description {
    font-size: 3.7vw !important;
  }

  .tp-simpleresponsive .button {
    font-size: 4vw !important;
  }

  .slideshow-arrow {
    font-size: 75px;
    margin-top: -32px;
    margin-right: 40px;
  }
}

@media (max-width: 576px) {
  .tp-text {
    font-size: 10vw !important;
  }

  .tp-description {
    display: none;
  }

  .tp-simpleresponsive .button {
    font-size: 5vw !important;
  }

  .slideshow-arrow {
    font-size: 50px;
    margin-top: -15px;
    margin-right: 33px;
  }

  .tp-desktop {
    display: none;
  }

  .tp-mobile {
    display: block;
  }
}

.line-thick {
  border-top: 32px solid #4b4e53;
}

/* countdown timer */
.scheduled-countdown {
  margin-top: 40px;
  font-weight: 700;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 575.98px) {
  .scheduled-countdown {
    max-width: 250px;
  }
}

.scheduled-countdown .countdown-box {
  display: inline-block;
  min-width: 104px;
  min-height: 104px;
  margin: 8px;
  text-align: center;
}

.scheduled-countdown .timer-days,
.scheduled-countdown .timer-hours,
.scheduled-countdown .timer-minutes,
.scheduled-countdown .timer-seconds {
  font-size: 64px;
}

/* countdown timer end */
.modal-dialog {
  margin-top: 100px;
  /* adjust as necessary */
}

.ytcontainer {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}

.ytvideo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.local-scroll-cont {
  display: none;
}

@media (min-width: 768px) {
  .local-scroll-cont {
    display: block;
  }
}

/* promotion cards and tabs */
.elsclub-tabs {
  margin-bottom: 3.5rem;
}

.elsclub-tabs.nav-pills>li>a {
  border-radius: 0;
  background-color: transparent;
  color: #000;
}

.elsclub-tabs.nav-pills>li>a:hover,
.elsclub-tabs.nav-pills>li>a:focus {
  border-bottom: 2px solid #a39161;
  background-color: transparent;
  color: #a39161;
}

.elsclub-tabs.nav-pills>li.active>a,
.elsclub-tabs.nav-pills>li.active>a:focus,
.elsclub-tabs.nav-pills>li.active>a:hover {
  border-bottom: 4px solid #a39161;
  background-color: transparent;
  color: #a39161;
}

.elsclub-card {
  box-shadow:
    0 3.6px 1px rgba(0, 0, 0, 0.083),
    0 4.8px 2.8px rgba(0, 0, 0, 0.123),
    0 5.9px 6.6px rgba(0, 0, 0, 0.177),
    0 9px 22px rgba(0, 0, 0, 0.29);
  text-align: center;
  margin-bottom: 2rem;
}

.elsclub-card-text {
  padding: 1.5rem;
}

.elsclub-card-text p,
.elsclub-card-text h2 {
  margin: 1rem 0 1rem 0;
}

#cd-menu-trigger.menu-button {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
}

.menu-button .bebas {
  font-size: 2.4rem;
}

/* remove page top margin since padding exists */
.boxed .sliding-content {
  margin-top: 0;
}

/* homepage slideshow
* 1920x800 images */
.hero-homepage {
  margin-top: 110px;
}

@media (min-width: 992px) {
  .hero-homepage {
    margin-top: 0;
  }
}

.hero-homepage .carousel-inner .item {
  margin: 0;
}

.hero-homepage .item-content {
  position: absolute;
  bottom: 30px;
  width: 100%;
  text-align: center;
}

@media (min-width: 768px) {
  .hero-homepage .item-content {
    bottom: 100px;
  }
}

@media (min-width: 992px) {
  .hero-homepage .item-content {
    bottom: 80px;
  }
}

@media (min-width: 1200px) {
  .hero-homepage .item-content {
    bottom: 140px;
  }
}

@media (min-width: 1600px) {
  .hero-homepage .item-content {
    bottom: 170px;
  }
}