/*
Theme Name: Twenty Nineteen Child
Description: A child theme of twentynineteen Theme
Template: twentynineteen
*/
@import url("../twentynineteen/style.css");
@import url("https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed:300,300i|Barlow:400,400i,500,600,600i");
@import url("//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css");
@import url("https://fonts.googleapis.com/css?family=Poppins:400,400i,700,700i");
@import url("https://fonts.googleapis.com/css?family=Inter:400,400i,500,500i,600,600i,700,700i");

:root {
  --font-display: "Poppins", sans-serif;
  --font-body: "Inter", sans-serif;
  --font-alt: "Barlow", "Barlow Semi Condensed", sans-serif;

  --color-text: #242424;
  --color-heading: #242424;
  --color-muted: #969696;
  --color-link: #242424;
  --color-primary: #005ffa;
  --color-primary-strong: #003296;
  --color-highlight: #007dff;
  --color-accent: #ff6cbd;
  --color-accent-light: #feedba;
  --color-info: #30a4f2;
  --color-danger: #e00b00;
  --color-black: #000;
  --color-white: #fff;
  --color-off-white: #fafafa;
  --color-border: #dcdcdc;
  --color-border-light: #e6e6e6;
  --color-border-strong: #c8c8c8;
  --color-gray-100: #f0f0f0;
  --color-indigo: #2d368f;
  --color-magenta: #c72cee;
  --color-gray-200: #b6b6b6;

  --layout-max-width: 1920px;
  --container-max: 1128px;
  --container-article: 776px;
  --gutter: 16px;
  --header-height: 80px;
  --header-height-mobile: 60px;

  --radius-base: 8px;
  --radius-pill: 999px;
  --shadow-card: 0px 12px 24px rgba(0, 0, 0, 0.08);
  --transition-base: 0.2s ease-in-out;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  color: var(--color-text);
  background-color: var(--color-off-white);
  max-width: var(--layout-max-width);
  margin: 0 auto;
}

/*
Body max width          = 1920px
Container width         = 1140px (+16px padding each side, 1128px + 32px = 1160px)
Article container width = 720px (+16px padding each side, 720px + 32px = 752px)
Header container width  = 1200px (+16px padding each side, 1200px + 32px = 1232px)
*/

h1 {
  font-family: var(--font-display);
  color: var(--color-heading);
  font-size: 64px;
  line-height: 80px;
  font-weight: 700;
  letter-spacing: -3px;
  margin: 0 !important;
}

h1:not(.site-title)::before,
h2::before {
  content: none !important;
}

h2 {
  font-family: var(--font-display);
  color: var(--color-heading);
  font-size: 48px;
  line-height: 56px;
  letter-spacing: -1px;
  margin: 0 !important;
}

h3,
h4,
h5,
h6,
p,
button,
li,
label,
input,
th,
tr,
td,
textarea,
option {
  font-family: var(--font-body);
  color: var(--color-text);
  letter-spacing: 0;
  margin: 0;
}

a {
  font-family: var(--font-body);
  letter-spacing: 0;
  color: var(--color-link);
  transition: color var(--transition-base);
}

a.webLink {
  color: var(--color-primary) !important;
}

a:hover,
a:visited {
  color: var(--color-link);
}

b,
strong {
  font-weight: bolder !important;
}

input:focus {
  outline: none !important;
  border-color: var(--color-border-strong) !important;
  outline-offset: unset !important;
}

.bold {
  font-weight: 700;
}

.underline {
  text-decoration: underline;
}

.blueText {
  color: var(--color-highlight) !important;
}

.redText {
  color: var(--color-danger);
}

.text-accent {
  color: var(--color-accent) !important;
}

.text-muted {
  color: var(--color-muted) !important;
}

.bg-white {
  background-color: var(--color-white) !important;
}

.bg-offwhite {
  background-color: var(--color-off-white) !important;
}

.shadow-card {
  box-shadow: var(--shadow-card);
}

a:focus {
  outline: none;
  text-decoration: none !important;
}

.container {
  max-width: var(--container-max) !important;
  width: 100%;
  padding: 0 var(--gutter) !important;
  margin: 0 auto;
}

.container.articleContainer {
  max-width: var(--container-article) !important;
}

.mobileShow {
  display: none !important;
}

.tabletShow {
  display: none;
}

#wpadminbar a.ab-item {
  font-size: 13px;
  font-weight: 400;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  line-height: 32px;
}

header#top {
  background-color: var(--color-white);
  position: fixed;
  width: 100%;
  z-index: 9999;
  max-width: var(--layout-max-width);
}

header#top .container {
  max-width: 1232px !important;
  padding: 0 16px !important;
  width: 100%;
}

header#top .row {
  margin: 0;
  position: relative;
  width: 100%;
  height: var(--header-height);
}

.site-content-contain {
  padding-top: var(--header-height);
}

/* hamburger icon */
/* #hamburgerMenuIcon {

} */

/* hamburger menu */
.hamburgerMenu {
  position: fixed;
  width: 100%;
  height: calc(100% - var(--header-height-mobile));
  right: 0;
  z-index: -1;
  overflow: hidden;
  transition: all 1s;
  top: var(--header-height-mobile);
}

.hamburgerWrapper {
  background-color: var(--color-white);
  max-width: 768px;
  padding-bottom: 64px;
  width: 100%;
  right: -768px;
  height: 100%;
  position: absolute;
  transition: all 0.5s;
  z-index: 9;
  overflow: scroll;
}

.hamburgerWrapper a {
  display: block;
  font-size: 14px !important;
  color: var(--color-text);
  line-height: 24px !important;
  font-weight: 500;
  letter-spacing: -0.25px !important;
  padding: 8px 0px;
}

.colorLineLong {
  border: 1px solid var(--color-border-light);
  margin: 72px 16px 32px 16px;
}

.copyrightMobileContent {
  padding: 0 16px 32px 16px;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: -0.25px;
}

.copyrightMobileContent a {
  padding: 0;
}

.copyrightMobileAddress {
  color: var(--color-muted);
}

.copyrightMobileAddress .contactNum {
  display: inline-block;
}

.footerMoreGridWrapper {
  margin-top: 80px;
  padding: 0px 16px;
  width: 100%;
  display: table;
  table-layout: fixed;
}

.footerMoreRow {
  display: 100%;
  display: table-row;
}

.footerMoreCell {
  width: 50%;
  display: table-cell;
}

.footerMoreHeader h5 {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.footerMoreHeader .pinkLine {
  background-color: var(--color-accent);
  margin: 8px 0;
}

.footerMoreCell .emptyBox {
  height: 32px;
}

.hamburgerMenu .overlay {
  width: 100%;
  height: 100%;
  background: var(--color-black);
  transition: all 1s;
  opacity: 0;
}

.hamburgerMenu.active {
  z-index: 999;
}

.hamburgerMenu.active .hamburgerWrapper {
  right: 0;
}

.hamburgerMenu.active .overlay {
  opacity: 0.75;
}

.hamburgerMenu.active .hamburgerWrapper.pushed .hamburgerListContainer {
  margin-top: 60px;
}

.singleMallPromotionPostContentWrapper {
  padding: 32px 0;
}

.promotionContent a,
.singleMallPromotionPostContentWrapper a,
.singleHappeningPostWrapper a,
.singleStorePostContentWrapper a,
.accordionItemContent .answer a {
  color: var(--color-primary);
  word-wrap: break-word;
}

p.memberAccWelcomeBtn {
  font-size: 16px;
  line-height: 28px;
  text-transform: uppercase;
}

/* Tab style */
.tabBtnWrapper {
  padding: 40px 0px;
}

.tabBtnWrapper .blackLine {
  margin: 0px !important;
}

.tabBtn.active:not(a):after,
.selectedHappeningCat:after,
.selectedPromotionPageTypeCat:after,
.selectedTimeSection:after,
.selectedEarningRewardsType:after,
.selectedSignUpType:after,
.selectedVoucherDetails:after,
.selectedRewardsCatalogueCat:after {
  content: "";
  height: 3px;
  display: block;
  background-color: var(--color-accent);
  margin-top: 6px;
}

.tabBtn {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  display: inline-block;
  cursor: pointer;
  padding: 0 40px 0 0;
  color: var(--color-text) !important;
}

.tabBtn:hover {
  color: var(--color-accent) !important;
}

.tabBtn.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.tabBtn.active:not(a) {
  color: var(--color-accent) !important;
}

/*404 page*/
.error-404.not-found p.page-content,
.noMatchesDesc {
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  padding: 0;
  margin: 0;
}

.error-404.not-found h1.page-title,
.noMatchesTitle {
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  color: var(--color-text) !important;
  padding-bottom: 16px;
  margin: 0;
}

.backToHomeBtnWrapper {
  text-align: center;
}

.backToHomeBtnWrapper .pinkBorderButton {
  color: var(--color-accent) !important;
  border: 2px solid var(--color-accent);
  border-radius: 6px;
  font-size: 14px;
  letter-spacing: 0.75px;
  line-height: 17px;
  font-weight: 400;
  padding: 20px 24px;
  text-transform: uppercase;
  display: inline-block;
}

.pinkBorderButton:hover {
  background-color: var(--color-accent);
  color: var(--color-white) !important;
}

.error-404.not-found .page-header {
  padding-bottom: 0;
  margin: 0;
  border-bottom: 0;
}

.error-404.not-found .page-content,
#no-matches .page-content {
  margin: 0;
  padding-top: 48px;
  padding-bottom: 120px;
}

.error-404.not-found .page-content {
  max-width: 744px;
  margin: 0 auto;
}

body.error404 main#main {
  position: relative;
  height: auto;
}

.error-404.not-found {
  width: min(100%, 1240px);
  margin: 0 auto;
  padding: 56px 24px 96px;
  position: static;
  transform: none;
}

#no-matches {
  max-width: 744px;
  margin: auto;
}

.error-404.not-found .page-header {
  max-width: 744px;
  margin: 0 auto;
  text-align: center;
}

div.error-404 .page-content .popularCardContainer {
  display: flex;
  margin: 16px 0;
}

div.error-404 .page-content .popularCardContainer:hover {
  cursor: pointer;
}

div.error-404 .page-content .popularCardContainer .selectedShopDine .popularImg {
  width: 240px;
  margin-right: 16px;
}

div.error-404 .page-content .popularCardContainer .selectedShopDine .popularTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 0;
  position: relative;
  bottom: 23px;
  left: 15px;
}

.error-404.not-found .popularCardGrid,
#no-matches .popularCardGrid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 32px 0 0 0;
}

.error-404.not-found .popularCardTile,
#no-matches .popularCardTile {
  position: relative;
  display: block;
  text-decoration: none;
  border-radius: 12px;
  overflow: hidden;
  width: calc((100% - 24px) / 3);
  max-width: calc((100% - 24px) / 3);
  flex: 1 1 calc((100% - 24px) / 3);
  height: 119px;
  color: inherit;
}

.error-404.not-found .popularCardTile picture,
.error-404.not-found .popularCardTile img,
#no-matches .popularCardTile picture,
#no-matches .popularCardTile img {
  width: 100%;
  height: 100%;
  display: block;
}

.error-404.not-found .popularCardTile img,
#no-matches .popularCardTile img {
  object-fit: cover;
  object-position: center center;
  transition: filter 0.25s ease-in-out;
}

.error-404.not-found .popularCardTile .overlay,
#no-matches .popularCardTile .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.75) 100%);
  transition: background-color 0.25s ease-in-out;
}

.error-404.not-found .popularCardTile .popularTitle,
#no-matches .popularCardTile .popularTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.5px;
  position: absolute;
  left: 12px;
  bottom: 12px;
  margin: 0;
}

@media (hover: hover) and (pointer: fine) {

  .error-404.not-found .popularCardTile:hover .overlay,
  #no-matches .popularCardTile:hover .overlay {
    background: var(--color-accent);
    opacity: 0.7;
    border-radius: 12px;
  }

  .error-404.not-found .popularCardTile:hover img,
  #no-matches .popularCardTile:hover img {
    filter: grayscale();
  }
}

/*End 404 page*/

/*Background color*/
.ascend {
  background-color: var(--color-white) !important;
}

/*Header Logo*/
.headerLogo {
  height: 56px !important;
  width: auto;
  margin: 12px 0 !important;
  display: inline-block;
  vertical-align: middle;
}

/*Header Menu*/
.admin-bar #header-outer,
#header-outer {
  padding: 0 !important;
}

.logoWrapper {
  float: left;
  width: fit-content;
  padding: 0;
}

.logoWrapper.roller-dice {
  display: flex;
  justify-content: center;
  float: none;
}

#top .row .menu {
  position: absolute;
  display: table;
  right: 0;
  height: 100%;
  width: fit-content;
  padding: 0;
}

.searchIcon {
  vertical-align: middle;
}

.searchIcon img {
  height: 24px;
  width: 24px;
  object-fit: contain;
}

.searchIconPage img {
  height: 24px;
  width: 24px;
  object-fit: contain;
  position: absolute;
  margin-top: 10px;
  margin-left: 14px;
  z-index: 1;
}

.ais-Hits.ais-Hits--empty {
  font-size: 20px;
  line-height: 32px;
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  text-align: center;
  color: var(--color-text);
}

#top .row .searchMobileImg {
  width: 24px;
  height: 24px;
  object-fit: contain;
  box-sizing: content-box;
  float: right;
  padding-top: 16px;
}

#top .row .menu a,
#top .row .menu .searchIcon {
  padding-right: 32px;
  font-size: 14px;
  vertical-align: middle;
  letter-spacing: 1px;
  line-height: 24px;
  color: var(--color-text);
  display: table-cell;
  transition: all 0.5s;
  font-family: var(--font-body);
  font-weight: 600;
}

#top .row .menu .loginBtn,
#top .row .menu .loginMenuSelection {
  display: table-cell;
  vertical-align: middle;
  padding-left: 24px;
  cursor: pointer;
  padding-bottom: 0;
}

#top .row .menu .loginBtn p,
#top .row .menu .loginMenuSelection button {
  width: auto;
  height: auto;
  border: solid 1px var(--color-border);
  vertical-align: middle;
  display: table-cell;
  font-size: 14px;
  line-height: 17px;
  border-radius: 4px;
  text-align: center;
  font-family: "Barlow", sans-serif;
  font-weight: 500;
  padding: 8px 12px;
}

#top .row .menu .loginBtn p:hover,
#top .row .menu .loginMenuSelection button:hover {
  background-color: var(--color-accent);
  color: var(--color-white) !important;
  border: 1px solid var(--color-accent);
  transition: all 0.25s;
}

#top .row .menu .loginMenuSelection button {
  width: auto;
}

.btn.btn-default.dropdown-toggle.selectLoginMenuBtn.active,
.btn.btn-default.dropdown-toggle.selectLoginMenuBtn:active,
.open>.btn.btn-default.dropdown-toggle.selectLoginMenuBtn {
  color: var(--color-text);
  background-color: transparent;
  background-image: none;
  border-color: var(--color-border);
}

#top .row .menu .loginMenuSelection button {
  background-color: transparent;
}

#top .row .menu .loginMenuSelection .selectionDropdown {
  width: auto;
  border-radius: 4px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  background-color: var(--color-white);
  border: none;
  margin-top: -23px;
  margin-left: 24px;
  padding: 0;
}

#top .row .menu .loginMenuSelection .selectionDropdown li,
#top .row .menu .loginMenuSelection .selectionDropdown a {
  font-size: 14px;
  font-weight: 500;
  line-height: 17px;
  font-family: "Barlow", sans-serif;
  padding-bottom: 8px;
  padding-left: 12px;
  padding-top: 8px;
}

#top .row .menu .loginMenuSelection .selectionDropdown li:hover {
  background-color: var(--color-accent);
  color: var(--color-white);
}

#top .row .menu .loginMenuSelection .selectionDropdown li:hover>a,
#top .row .menu .loginMenuSelection .selectionDropdown a.current:hover {
  color: var(--color-white) !important;
  transition: none;
}

span.selectedGender {
  font-family: "Barlow", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
}

#top .row .menu .loginMenuSelection .selectionDropdown a {
  padding: 0;
  transition: none;
}

#top .row .menu .loginBtn p i,
#top .row .menu .loginMenuSelection i {
  font-size: 10px;
  padding-left: 13px;
  vertical-align: top;
  line-height: 18px;
}

.menu.desktopShow a.current {
  color: var(--color-accent) !important;
}

.menu.desktopShow a.current div {
  border-bottom: 3px solid var(--color-accent);
  border-top: 3px solid transparent;
  height: 100%;
  align-content: center;
}

.menu a:hover {
  color: var(--color-accent) !important;
}

a.searchIcon {
  padding-right: 0 !important;
}

.searchModalContent i.fas.fa-search {
  position: absolute;
  z-index: 99;
  padding-left: 26px;
  color: var(--color-text);
}

i.fas.fa-search {
  font-weight: 900;
  font-size: 20px;
  vertical-align: top;
  color: var(--color-gray-200);
  -webkit-text-stroke: 1px var(--color-white);
  padding-top: 30px;
  z-index: 1;
}

#content {
  width: 100%;
  position: relative;
}

/* Login Modal and newsletter modal */
.loginModalWrapper,
.newsletterModalWrapper,
.pdfModalWrapper,
.participatingStoreModalWrapper,
.editProfileSuccessWrapper,
.newsletterSuccessWrapper,
.enquirySuccessWrapper,
.feedbackSuccessWrapper,
.searchModalWrapper,
.featurePopupDialogWrapper {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  top: 0;
  z-index: 10000;
  max-width: 1920px;
}

.loginModalWrapper .overlay,
.newsletterModalWrapper .overlay,
.pdfModalWrapper .overlay,
.participatingStoreModalWrapper .overlay,
.editProfileSuccessWrapper .overlay,
.newsletterSuccessWrapper .overlay,
.enquirySuccessWrapper .overlay,
.feedbackSuccessWrapper .overlay,
.searchModalWrapper .overlay,
.featurePopupDialogWrapper .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  top: 0;
  z-index: -1;
}

.participatingStoreModalWrapper .overlay {
  z-index: 0;
}

.loginModalContainer,
.newsletterModalContainer,
.pdfModalContainer,
.participatingStoreModalContainer,
.editProfileSuccessContainer,
.newsletterSuccessContainer,
.enquirySuccessContainer,
.feedbackSuccessContainer,
.searchModalContainer,
.featurePopupDialogContainer {
  display: table-cell;
  vertical-align: middle;
}

i.fas.fa-times.loginModalCloseIcon,
.newsletterModalContainer i.fas.fa-times.newsletterModalCloseIcon {
  color: var(--color-white) !important;
  font-size: 24px !important;
  -webkit-text-stroke: 2px #3f3f3c;
  position: fixed;
  z-index: 999;
  width: 480px !important;
  margin-left: 50px;
  text-align: right;
  cursor: pointer;
}

.loginModal,
.newsletterModal {
  width: 480px;
  background-color: var(--color-white);
  margin: auto;
  overflow: auto;
  max-height: 90vh;
  border-radius: 6px;
}

.forgotPasswordBtn {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.newsletterModalContent {
  padding: 40px 48px;
}

/*.newsletterModal {
padding: 40px 48px;
max-height: 90vh;
overflow: auto;
position: relative;
}*/

.editProfileSuccess,
.newsletterSuccess,
.enquirySuccess,
.feedbackSuccess {
  width: 90%;
  max-width: 480px;
  margin: auto;
  background-color: var(--color-white);
  padding: 40px 48px;
}

.editProfileSuccess h1,
.newsletterSuccess h1,
.enquirySuccess h1,
.feedbackSuccess h1 {
  font-size: 28px;
  line-height: 33px;
  padding-bottom: 24px;
  letter-spacing: -1px;
}

.editProfileSuccessWrapper,
.newsletterSuccessWrapper,
.enquirySuccessWrapper,
.feedbackSuccessWrapper {
  display: table;
}

.editProfileSuccess .content,
.newsletterSuccess .content,
.enquirySuccess .content,
.feedbackSuccess .content {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 32px;
}

.closeEditProfileSuccessBtn,
.newsletterSuccess .closeNewsletterModalSuccessBtn,
.enquirySuccess .closeEnquiryModalSuccessBtn,
.feedbackSuccess .closeFeedbackModalSuccessBtn {
  font-size: 14px;
  line-height: 17px;
  padding: 16px;
  text-align: center;
  border-radius: 6px;
  background-color: var(--color-accent);
  color: var(--color-white);
  cursor: pointer;
}

.loginModalHeader {
  height: 160px;
  width: 100%;
  padding: 100px 48px 24px;
  display: table-cell;
  vertical-align: bottom;
  background-size: 150%;
}

.loginModalHeader h1 {
  color: var(--color-white);
  line-height: 28px;
  padding-bottom: 8px;
  font-size: 24px;
  font-weight: 500;
  display: inline-block;
}

.loginModalHeader p {
  font-size: 16px;
  line-height: 24px;
  color: var(--color-white);
  font-weight: 300;
}

#footer .loginModal .announcement {
  padding: 16px;
  background-color: #fff6e1;
  margin-bottom: 26px;
}

#footer .loginModal .announcement h3 {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: var(--color-text);
  padding-bottom: 8px;
}

#footer .loginModal .announcement p,
#footer .loginModal .announcement p a {
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 24px;
  color: var(--color-text);
  margin: 0;
}

#footer .loginModal .announcement p span {
  font-weight: 400;
}

#footer .loginModal .announcement p a {
  color: var(--color-info) !important;
  display: inline;
  vertical-align: bottom;
}

.loginModalFooter {
  width: 100%;
  padding: 0 48px 32px;
  display: table;
}

img.loginModalRewardIcon {
  width: 72px;
  display: inline-block;
  vertical-align: middle;
  border-radius: 14px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

.loginModalFooter p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
  margin-bottom: 16px;
}

.downloadBtnWrapperLoginModal {
  display: inline-block;
  margin-left: 24px;
  width: calc(100% - 96px);
  vertical-align: middle;
}

.downloadBtnWrapperLoginModal a.IosBtn img {
  width: auto;
  display: inline-block;
  height: 40px;
}

.downloadBtnWrapperLoginModal a.AndroidBtn img {
  width: auto;
  /* margin-left: 16px; */
  float: right;
  /* display: inline-block; */
  vertical-align: top;
  height: 40px;
}

.newsletterModal h1 {
  font-size: 28px;
  line-height: 33px;
  padding-bottom: 32px;
}

.loginModalContent {
  padding: 40px 48px 31px;
}

.loginModalContent label,
.newsletterModalContent label {
  display: block;
  font-weight: 500;
  font-size: 16px;
  padding-bottom: 12px;
  margin: 0;
}

.newsletterModalContent .checkboxLabel {
  font-size: 16px;
  line-height: 24px;
  padding-bottom: 30px;
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: italic;
  width: calc(100% - 30px);
  display: inline-block;
  vertical-align: top;
  margin: 0;
  padding-left: 8px;
}

/*.newsletterModalContent input[type="checkbox"] {
width: auto;
vertical-align: top;
}*/

.loginModalContent input,
.newsletterModalContent input {
  font-size: 16px;
  line-height: 28px;
  width: 100%;
  border-radius: 6px;
  padding: 10px 11px;
  border: solid 1px var(--color-border-strong);
  margin-bottom: 32px;
}

.newsletterModalContent .newsletterSubmitBtn {
  margin-bottom: 0;
  background-color: var(--color-accent) !important;
  border: none;
  font-size: 14px;
  line-height: 17px;
  letter-spacing: 0.75px;
  font-weight: 400;
  padding: 16px;
  opacity: 0.5;
  pointer-events: none;
}

.newsletterModalContent .birthdateField .monthSelection {
  width: 40%;
}

.newsletterModalContent .birthdateField .dateSelection,
.newsletterModalContent .birthdateField .yearSelection {
  width: 30%;
}

#footer .newsletterModalContent button.dropdown-toggle i {
  font-size: 10px;
  float: right;
  line-height: 28px;
  color: var(--color-text);
  width: auto;
  margin-right: 0;
}

.newsletterModalContent .birthdateField {
  padding-bottom: 32px;
}

.loginModalContent .submitBtnRow {
  height: 48px;
  margin-top: 8px;
  position: relative;
  margin-bottom: 32px;
}

.loginModalContent .forgotPasswordBtn:hover {
  cursor: pointer;
}

.forgetPassword p {
  font-size: 14px;
  line-height: 21px;
  margin: 0;
  letter-spacing: 0.75px;
  text-transform: uppercase;
}

.forgetPassword p:first-child {
  margin-top: 32px;
  color: var(--color-accent);
}

.forgetPassword p:last-child {
  margin-bottom: 32px;
}

.loginModalContent .forgotPasswordBtn {
  font-weight: 400;
  line-height: 17px;
  font-size: 14px;
  margin: 16px 0 0;
  float: left;
  color: var(--color-text) !important;
  border-bottom: none;
  position: relative;
}

.loginModalContent .loginSubmitBtn {
  font-weight: 400;
  font-size: 14px;
  line-height: 48px;
  background-color: var(--color-accent) !important;
  color: var(--color-white);
  border-radius: 6px;
  padding: 0;
  border: none;
  margin: 0;
  width: 92px;
  float: right;
  text-align: left;
  padding-left: 16px;
}

.loginModalContent .loginSubmitBtnChevron {
  position: absolute;
  right: 0;
  color: var(--color-white) !important;
  font-size: 10px !important;
  margin: 18px 13px 0 0 !important;
  width: auto !important;
}

.errorMsg {
  font-weight: 400;
  font-size: 12px;
  color: red;
  padding-top: 16px;
  margin: 0;
}

.loginModalWrapper .errorMsg {
  padding: 0 0 8px 0;
}

.loginModalWrapper .notMemberMsg.loginErr {
  font-size: 16px;
  background-color: rgba(212, 3, 141, 0.2);
  padding: 16px;
  margin-bottom: 24px;
  border: solid 1px var(--color-accent);
}

/* Header Image */

.headerImage,
.singlePostImg {
  background-size: cover;
  width: 100%;
  position: relative;
  height: calc(1024px/2);
  background-position: center;
  background-repeat: no-repeat;
}

.headerImage.withTab,
.headerImage.vrHeaderImage,
.headerImage.singleStore {
  height: calc(1280px / 1.9);
}

.headerImage.searchHeader {
  padding-top: calc(100% / 5);
  height: auto;
  max-height: 320px;
}

.downloadFooterTermsConditions {
  font-size: 14px;
  font-family: "Thienhardt", sans-serif;
  font-weight: 500;
  line-height: 14px;
  font-style: normal;
  color: var(--color-primary-strong);
  position: relative;
  top: -8px;
}

.headerImage.vrHeaderImage {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1773732411/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-vivorewards-v32x.png");
}

.headerImage.whats_on_mall_happenings,
.singlePostImg.mall_promo {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229786/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_12x.jpg");
  background-position: top;
}

.headerImage.whats_on_store_highlights,
.singlePostImg.store_highlights {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229780/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_22x.jpg");
  background-position: top;
}

.headerImage.whats_on_new_stores,
.singlePostImg.new_stores {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229782/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_32x.jpg");
}

.headerImage.whats_on_events {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229778/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_42x.jpg");
  background-position: top;
}

.headerImage.kids_club {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1772524245/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-kids_club2x.jpg");
  background-position: top;
}

.headerImage.fun_n_learning {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1772524245/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-kids_club2x.jpg");
  background-position: top;
}

.headerImage.aboutUs {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229795/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-about2x.jpg");
  background-position: top;
}

.headerImage.tourists {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229792/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-tourist2x.jpg");
  background-position: 50% 20%;
}

.headerImage.directory_main {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229791/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory2x.jpg");
  background-position: top;
}

.headerImage.directory_dining {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229785/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-dining2x.jpg");
}

.headerImage.directory_fashion {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229779/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-fashion2x.jpg");
}

.headerImage.directory_health {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229788/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-health2x.jpg");
}

.headerImage.directory_lifestyle {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229784/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-lifestyle2x.jpg");
}

.headerImage.directory_kids {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229789/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-kids2x.jpg");
}

.headerImage.directory_services {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229778/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-services2x.jpg");
}

.headerImage.privacy_policy {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1766485248/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_hero-privacy_policy3x.jpg");
}

.headerImage.press_room {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1771229796/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-press_room2x.jpg");
  background-position: top;
}

.headerImage.leasing_enquiry {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_2560/v1683688494/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_hero_leasing.jpg");
}

.rewardsGuideHeaderContainer.rewardsRedemption {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_1920/v1680246307/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_banner_rewards-redemption_1.jpg");
}

.rewardsGuideHeaderContainer.rewardsUsage {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_1920/v1680246312/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_banner_rewards-usage_1.jpg");
}

.headerImage.homepage {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  position: relative;
  height: calc(100vw / 3);
  z-index: 1;
}

.headerScrim {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.5) 100%);
  height: 50%;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
  z-index: 2;
}

h1.headerTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 64px;
  font-weight: bold;
  letter-spacing: -3px;
  line-height: 80px;
  padding-bottom: 40px;
}

.headerImage .headerCarouselContainer {
  position: absolute;
  height: 100%;
  top: 0;
  width: 100%;
}

.headerCarouselImg {
  height: 100%;
  background-size: cover;
  background-position: center;
}

.headerCarouselContainer .swiper-button-next,
.headerCarouselContainer .swiper-button-prev {
  height: 24px;
}

.headerTitleContainer,
.singlePostContainer,
.guidePostWrapper {
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 9;
  display: block !important;
  display: block !important;
}

.headerTitleContainer h1,
.singlePostContainer h1,
.guidePostWrapper h1 {
  color: var(--color-white);
  line-height: 64px;
  padding-bottom: 24px;
  text-transform: capitalize;
}

.headerTitleContainer .directoryHeaderTitle,
.searchHeader .headerTitleContainer .headerTitle {
  padding-bottom: 40px;
}

.headerTitleContainer a,
.singlePostContainer a {
  display: flex;
  color: var(--color-white);
  line-height: 24px;
  font-size: 14px;
  position: relative;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
  padding-bottom: 16px;
}

.headerTitleContainer img,
.singlePostContainer img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  vertical-align: middle;
}

.headerTitleContainer a i,
.singlePostContainer a i {
  font-size: 12px;
  position: absolute;
  line-height: 19px;
  bottom: 12px;
  left: 0;
  top: 0px;
}

.headerTitleContainer span.selectedShopDineCat {
  text-transform: capitalize;
  font-size: 56px;
  line-height: 66px;
  font-weight: 300;
  padding-right: 30px;
}


.singlePostImg:after,
.guide_headerImage:after {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.8) 100%);
  height: 144px;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.headerImage:after {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.8) 100%);
  height: 144px;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.headerImage.withTab:after,
.headerImage.vrHeaderImage:after {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.8) 100%);
  height: 212px;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.headerImage.singleStore:after {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.8) 100%);
  height: 300px;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.homepageHeader:after {
  display: none;
}

.headerWrapper,
#public-library .infoContainer {
  max-width: 968px !important;
  padding: 0 16px;
  margin: auto;
}

.headerWrapperRevamp {
  padding: 0 16px;
  margin: auto;
}

.headerWrapperRevamp {
  padding: 0 16px;
  margin: auto;
}

.smallHeaderWrapper,
.pressRoomWrapper,
.mallDetailsContainer,
#about_us_page .descCol,
#about-vivocity .descCol,
#about_us_page .transportationWrapper,
#about_us_page .parkingRateWrapper,
#about_us_page .seasonParkingWrapper,
.aboutMapleTreeContainer {
  max-width: 776px !important;
  padding: 0 16px;
  margin: auto;
}

/*What's New*/
.what_new {
  font-size: 0;
  padding-top: 24px !important;
}

.what_new>div {
  display: inline-block;
  vertical-align: middle;
}

.what_new_desc {
  width: 41.6666667%;
  padding-right: 25px;
}

.what_new h1 {
  max-width: 165px;
  padding-bottom: 16px;
}

.what_new h2 {
  max-width: 100%;
  padding-bottom: 0;
  line-height: 32px;
}

.what_new .featuredWhatsNew {
  width: 100%;
  padding-top: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.featuredWhatsNew::after,
.whatsNew::after {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.8) 100%);
  height: 80%;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.smallGalleryImg::after,
.bigGalleryImg::after {
  display: block;
  background-image: linear-gradient(180deg,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.4) 100%);
  height: 80%;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.what_new .whatsNew {
  display: inline-block;
  width: calc(50% - 8px);
  padding-top: calc(50% - 8px);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.whatsNewWrapperMain {
  position: relative;
  width: 58.3333333%;
}

.whatsNewWrapperMain>div {
  display: inline-block;
  vertical-align: top;
  width: 50%;
}

.leftWhatsNewWrapper {
  padding-right: 8px;
}

.rightWhatsNewWrapper {
  padding-left: 8px;
}

.leftWhatsNewWrapper>a>div {
  margin-bottom: 16px;
}

.leftWhatsNewWrapperRow>a:first-child,
.rightWhatsNewWrapperRow>a:first-child {
  margin-right: 16px;
}

.rightWhatsNewWrapper>div {
  margin-bottom: 16px;
}

p.featuredWhatsNewTitle {
  display: -webkit-box;
  max-width: 90%;
  max-height: 24px;
  -webkit-line-clamp: 1;
  transform: translateY(-204%) !important;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.whatsNewWrapperMain p {
  color: var(--color-white);
  font-size: 17px;
  line-height: 24px;
  position: absolute;
  transform: translateY(-100%);
  padding: 0 0 10px 16px;
  z-index: 1;
}

.whatsNewWrapperMain .homePageNewStoreBox {
  position: absolute;
  right: 0;
  font-size: 12px;
  line-height: 14px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  color: var(--color-white);
  background-color: var(--color-accent);
  letter-spacing: 0.64px;
  padding: 5px;
  text-transform: uppercase;
  display: inline-block;
}

/*----WhatsNew*----/

/*Shopping Guide */
.getShoppingGuideImg:after {
  display: block;
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.8) 100%);
  height: 50%;
  width: 100%;
  content: "";
  bottom: 0;
  position: absolute;
}

.getShoppingGuideImg.shoppingCat {
  background-size: cover;
  background-position: top;
  width: 100%;
  position: relative;
  padding-top: calc(100% / 3);
}

.getShoppingGuideImg.diningCat {
  background-size: cover;
  background-position: center;
  width: 100%;
  position: relative;
  padding-top: calc(100% / 3);
}

.shoppingGuide {
  padding-top: 48px;
}

.shoppingGuideWrapper {
  margin-bottom: 32px;
}

.shoppingGuideWrapper h1 {
  width: 242px;
  display: inline-block;
  margin-right: 78px !important;
  vertical-align: bottom;
}

.shoppingGuideWrapper .tabBtn {
  display: inline-block;
  margin-right: 100px;
  transition: color 0.25s ease-in;
  font-size: 22px;
  line-height: 27px;
  position: relative;
  margin: 0;
  padding-right: 42px;
  cursor: pointer;
}

.homepageShoppingGuide .guideNavBtnWrapper {
  display: inline-block;
}

.shoppingGuideWrapper .tabBtn.active {
  background-color: transparent;
  height: auto;
}

.headerImage .swiper-container {
  overflow: unset !important;
}

.featurePopupDialogWrapper .swiper-container {
  width: 552px;
  max-height: 800px;
  border-radius: 16px;
  background-color: white;
  transition: all 0.5s ease-in-out;
}

.featurePopupDialogWrapper .swiper-container.advertisement {
  width: 342px;
  background-color: black;
}

.dropdownShopDine.dropdown i.fa.fa-caret-down {
  font-size: 46px;
  line-height: 29px;
}

.shoppingGuideImg {
  width: 100%;
  height: 420px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  border-radius: 8px 8px 0px 0px;
}

.bigImgShoppingGuide {
  display: inline-block;
  vertical-align: top;
  width: calc(60% - 24px);
}

.bigImgShoppingGuide:hover,
.smallImgShoppingGuide:hover,
.halfImgShoppingGuide:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  transition: 0.25s all;
}

.smallImgShoppingGuide:first-child {
  margin-bottom: 24px;
}

.smallShoppingGuideImg {
  display: inline-block;
  width: 100%;
  height: 210px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
  border-radius: 8px 8px 0px 0px;
}

.smallShoppingGuideContentWrapper {
  padding: 24px;
  background-color: var(--color-white);
  border-radius: 0px 0px 8px 8px;
  width: 100%;
  height: 212px;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  border: 1px solid var(--color-border);
  box-sizing: border-box;
}

.smallImgShoppingGuide .shoppingGuideContentWrapper a {
  padding: 20px;
}

.smallShoppingGuideContentWrapper a {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
  color: var(--color-text);
}

.halfShoppingGuideImg {
  width: 100%;
  height: calc(100vw / 5);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
  border-radius: 8px 8px 0px 0px;
}

.halfImgShoppingGuide:first-child {
  margin-right: 24px;
}

.halfImgShoppingGuide {
  display: inline-block;
  vertical-align: top;
  width: calc(50% - 12px);
}

.halfShoppingGuideContentWrapper {
  padding: 32px;
  background-color: var(--color-white);
  border-radius: 0px 0px 8px 8px;
  height: 244px;
  border: 1px solid var(--color-border);
  /*height: calc(100vw / 8);*/
}

.halfShoppingGuideDesc {
  padding-top: 8px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  font-family: "Rubik", sans-serif;
  color: var(--color-text);
}

.shoppingGuideContentWrapper {
  padding: 40px;
  background-color: var(--color-white);
  border-radius: 0px 0px 8px 8px;
  height: 366px;
  border: 1px solid var(--color-border);
  /*height: calc(100vw / 5);*/
}

.shoppingGuideContentWrapper a,
.halfShoppingGuideContentWrapper a {
  font-size: 40px;
  line-height: 64px;
  font-weight: 300;
  color: var(--color-text);
}

.shoppingGuideDesc {
  padding-top: 8px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  font-family: "Rubik", sans-serif;
  color: var(--color-text);
}

.firstRowShoppingGuideWrapper,
.secondRowShoppingGuideWrapper {
  font-size: 0;
  padding-bottom: 24px;
}

.rightWrapper {
  display: inline-block;
  vertical-align: top;
  width: 40%;
  margin-left: 24px;
}

.leftWrapper {
  display: inline-block;
  vertical-align: top;
  width: 40%;
  margin-right: 24px;
}

.shoppingGuideBtnWrapper .blackLine {
  height: 1px;
  background-color: var(--color-border);
  margin: 0 !important;
}

.featurePopupDialogWrapper {
  display: table;
}

.featurePopupDialog::-webkit-scrollbar {
  width: 0;
}

.featurePopupDialog {
  width: 90vw;
  height: auto;
  max-width: 550px !important;
  max-height: 800px;
  margin: auto;
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  background-color: white;
}

.featurePopupDialog.advertisement {
  width: 90vw;
  height: auto;
  max-width: 342px !important;
  max-height: 800px;
  margin: auto;
  position: relative;
  overflow: hidden;
}

.featurePopupSlide.swiper-slide {
  max-height: 800px;
  width: 100% !important;
  overflow-x: hidden;
  overflow-y: scroll;
  border-radius: 16px;
}

.featurePopupSlide.swiper-slide.advertisement {
  max-height: 800px;
  width: 100% !important;
  overflow-x: hidden;
  overflow-y: hidden;
}

.featurePopupImage {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  aspect-ratio: 1;
  background-color: white;
}

.featurePopupDetails {
  padding: 24px;
  /* max-width: 517px; */
  background-color: var(--color-white);
  overflow: hidden;
}

.featurePopupTitle {
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  color: var(--color-text) !important;
}

.featurePopupDesc {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  padding-bottom: 40px;
  padding-top: 8px;
  max-width: 100%;
}

.featurePopupDesc {
  padding-bottom: 100px;
}


.featurePopupDesc>p {
  padding-bottom: 28px;
}

.featurePopupDesc--divi {
  padding-top: 16px;
}

.featurePopupDesc--divi .et_pb_section {
  padding: 0;
  background: transparent !important;
}

.featurePopupDesc--divi .et_pb_row {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.featurePopupDesc--divi .et_pb_module:last-child {
  margin-bottom: 0;
}

/* .featurePopupDesc p {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
} */

.featurePopupDialogDontShowWrapper {
  text-align: left;
  display: flex;
  align-items: center;
  gap: 16px;
  position: absolute;
  bottom: 0;
  background-color: white;
  z-index: 2;
  width: 100%;
  padding: 24px;
  height: 80px;
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
}

.featurePopupDialogDontShowWrapper p {
  flex: 1;
  width: auto !important;
}

.featured-popup-swiper-button-prev,
.featured-popup-swiper-button-next {
  opacity: 1;
  position: absolute;
  z-index: 5;
  top: 48%;
}

.featured-popup-swiper-button-prev {
  left: 0px;
}

.featured-popup-swiper-button-next {
  right: 20px;
}

.featured-popup-swiper-button-next.advertisement {
  right: 5px;
}

/* Homepage custom carousel */
div#fbGuideGallery>.customSwiperContainer {
  width: 600%;
  position: relative;
  height: calc(100vw / 3);
}

.customSwiperWrapper {
  position: absolute;
  left: -33.33%;
}

/*Auto Scroll Animation*/
/* .swiper-wrapper{
transition: .5s ease !important;
} */

.bigGalleryImg,
.bigGalleryImgScroll {
  width: 100%;
  height: calc(100vw / 3);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.smallGalleryImg {
  display: inline-block;
  width: 50%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  vertical-align: top;
}

.smallGalleryImg p,
.bigGalleryImg p {
  position: relative;
  top: 100%;
  transform: translateY(-100%);
  z-index: 1;
  text-align: center;
  font-size: 22px;
  line-height: 27px;
  padding: 0 8px 32px;
  color: var(--color-white);
}

.smallGalleryImgScroll {
  height: calc(100vw / 6);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.smallGalleryImgScroll p {
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  color: var(--color-white);
  position: relative;
  top: 100%;
  transform: translateY(-100%);
  z-index: 1;
  text-align: center;
}

.bigGalleryImgScroll p {
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  color: var(--color-white);
  position: relative;
  top: 100%;
  transform: translateY(-100%);
  z-index: 1;
  text-align: center;
}

.headerImage a.big.swiper-slide {
  width: 720px !important;
}

.headerImage a.swiper-slide {
  width: 360px !important;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
  outline: none;
  outline-offset: 0px;
}

.shoppingGuideBtnWrapper {
  padding: 32px 0px 46px 0px;
}

.shoppingGuideDescBG {
  background-color: var(--color-white);
  padding: 40px 0px;
}

p.getShoppingGuideDesc.container {
  font-size: 20px;
  line-height: 28px;
  font-weight: 300;
}

.shoppingGuideDescWrapper.container {
  margin-bottom: 39px;
}

#shopDineGallery,
#fbGuideGallery {
  font-size: 0;
}

.shoppingGuide .leftGalleryWrapper,
.shoppingGuide .rightGalleryWrapper {
  display: inline-block;
  vertical-align: top;
  width: 50%;
}

.shoppingGuide #fbGuideGallery .leftGalleryWrapper,
.shoppingGuide #fbGuideGallery .rightGalleryWrapper {
  width: 50vw;
}

div#fbGuideGallery>div {
  display: inline-block;
  vertical-align: top;
  width: 50%;
  margin-right: -5px;
}

.rightGalleryWrapper {
  height: calc(100vw / 3);
}

.rightGalleryWrapperRow {
  height: 50%;
}

/*/Shopping Guide */

/*Promotions*/
.no-matches {
  font-size: 16px;
  line-height: 28px;
  padding-top: 40px;
  font-weight: 300;
  text-align: center;
}

.promotionsContent h1 {
  letter-spacing: -1px;
  padding-bottom: 32px;
}

.promotionsContent {
  padding-bottom: 60px !important;
}

.promotionsContent .blackLine {
  margin-bottom: 40px;
}

.promotions .blackLine {
  margin-bottom: 0px;
}

.verticalLine {
  border-left: 1px solid var(--color-border-strong);
  height: 48px;
  vertical-align: bottom;
  margin-left: 70px;
  margin-bottom: 20px;
}

.promotions .promotionsTopBar {
  padding-top: 64px;
}

.promotionPageImg {
  background-size: cover;
  width: 100%;
}

.promotions .promotionsTabContainer {
  padding-bottom: 49px;
  padding-top: 40px;
}

.promotionTabBtnWrapper>* {
  display: inline-block;
  font-size: 22px;
  font-weight: 300;
  line-height: 27px;
  padding: 0 40px 14px 0;
  position: relative;
  transition: 0.25s all;
  cursor: pointer;
}

.promotionTabBtnWrapper .promoTabBtn.active {
  color: var(--color-accent);
}

.promotionTabBtnWrapper .promoTabBtn.active:after {
  content: "";
  position: absolute;
  width: calc(100% - 40px);
  height: 3px;
  background-color: var(--color-accent);
  bottom: 0;
  left: 0;
}

.promotionsTabContainer {
  padding-bottom: 49px;
}

.promotionsTabContainer .promotionContainer {
  font-size: 0;
}

.promotionsTabContainer .promotionContainer .promotionPost {
  width: calc(25% - 12px);
  display: inline-block;
  margin-right: 16px;
  position: relative;
  padding-top: calc(50% - 24px);
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 0;
}

.promotionsPage div#store_promotions .promotionPost,
.mainTouristPrivilegesContainer .promotionPost {
  width: calc(25% - 16px);
  display: inline-block;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 300px;
}

div#store_promotions .promotionPageTypeTabContent {
  padding-bottom: 52px;
  padding-top: 56px;
}

.promotionsTabContainer .promotionContainer .promotionPost:last-child,
.promotionPageTypeTabContent .promotionContainer .promotionPost:last-child {
  margin-right: 0;
}

.promotionsTabContainer .promotionContainer .promotionPost:hover,
.promotionPageTypeTabContent .promotionPost .promotionContent:hover,
div.whatsOnContainer .promotionPost:hover,
div#store_promotions .happeningBox:hover,
div#new_stores .happeningPostWrapper:hover,
div#homepageWhatsOn .happeningPostWrapper:hover,
div#atrium_events .happeningPostWrapper:hover,
.searchedPostContent:hover,
div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:hover,
div#mall_promotions .happeningBox:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  transition: all 0.25s;
}

.promotionsTabContainer .promotionContainer .promotionContent,
.promotionPageTypeTabContent .promotionContent {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.promotionsTabContainer .promotionDetailsContainer {
  position: relative;
  width: 100%;
  padding-top: 100%;
}

.promotionsTabContainer .promotionContainer .promotionImg {
  box-shadow: none;
  margin: 0;
}

.promotionsTabContainer .promotionContainer .promotionDetailsBox {
  height: auto;
  background-color: var(--color-white);
  padding: 24px 16px;
  position: absolute;
  top: 0;
}

.promotionsTabContainer .promotionContainer .promotionTitle {
  font-size: 22px;
  font-weight: 400;
  padding-bottom: 8px;
  font-style: unset;
  font-family: "Rubik", sans-serif;
  color: var(--color-text);
  display: -webkit-box;
  max-width: 100%;
  height: 24px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.promotionsTabContainer .promotionContainer .promotionPeriod,
.promotionPageTypeTabContent .promotionDetailsContainer .promotionPeriod {
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}

.promotionsTabContainer .promotionContainer .promotionLine,
.promotionPageTypeTabContent .promotionDetailsContainer .colorLine,
.happeningPostContentWrapper .colorLine {
  width: 40px;
  height: 3px;
  background-color: var(--color-border);
  margin: 16px 0;
  transition: 0.25s all;
}

.promotionsTabContainer .promotionContainer .promotionPost:hover .promotionLine {
  background-color: var(--color-accent);
}

.promotionPageTypeTabContent .promotionPost:hover .promotionDetailsContainer .colorLine {
  background-color: var(--color-accent);
}

.promotions .promotionsTabContainer .promotionContainer .promotionDesc {
  font-size: 16px;
  line-height: 28px;
  display: -webkit-box;
  max-width: 100%;
  height: 56px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blackLine {
  border-top: 1px solid var(--color-border);
}

.viewAllStoreBtnWrapper {
  text-align: center;
}

.startTheDayBtnWrapper {
  padding-top: 24px;
}

.funLearningBtnWrapper {
  padding-top: 40px;
}

.funLearningBtnBtn {
  background-color: var(--color-accent) !important;
  color: var(--color-white) !important;
  border-radius: 28px;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 700;
  padding: 13px 24px;
}

.funLearningBtnBtn:hover {
  opacity: 0.5;
}

.startTheDayBtnWrapper .pinkBorderButton,
.pinkBorderButton,
.viewAllStoreBtnWrapper .pinkBorderButton {
  color: var(--color-accent) !important;
  border: 2px solid var(--color-accent);
  border-radius: 6px;
  font-size: 14px;
  letter-spacing: 0.75px;
  line-height: 17px;
  font-weight: 400;
  padding: 20px 24px;
  text-transform: uppercase;
  display: inline-block;
}

.pinkBorderButton.retailSpaceBtnBtn,
.pinkBorderButton.eventSpaceBtnBtn,
.pinkBorderButton.mediaPanelBtnBtn {
  text-transform: none;
}

.pinkBorderButton.retailSpaceBtnBtn:hover,
.pinkBorderButton.eventSpaceBtnBtn:hover,
.pinkBorderButton.mediaPanelBtnBtn:hover {
  opacity: 0.5;
}

.retailSpaceBtnWrapper,
.eventSpaceBtnWrapper,
.mediaPanelBtnWrapper {
  padding: 40px 0;
}

.retailSpaceBtnWrapper .retailSpaceBtnBtn,
.eventSpaceBtnWrapper .eventSpaceBtnBtn,
.mediaPanelBtnWrapper .mediaPanelBtnBtn {
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent));
  color: var(--color-white) !important;
  border-radius: 28px;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 700;
  padding: 13px 24px;
}

.promotions .promotionsRow {
  margin: 0 -8px 54px -8px;
  position: relative;
}

.promotionLoadingBg {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5);
  display: none;
}

.promotions .promotionColumn {
  display: inline-block;
  width: 25%;
  vertical-align: top;
  padding: 0 8px;
}

.promotionImg {
  width: 100%;
  display: block;
  box-shadow: 0px 24px 20px -16px rgba(0, 0, 0, 0.4);
  margin-bottom: 28px;
  background-size: cover;
  background-position: center;
}

.promotions .promotionColumn h2 {
  font-size: 24px;
  line-height: 29px;
  font-style: italic;
  padding-bottom: 8px;
  margin-bottom: 0px;
}

.promotions .promotionColumn h3 {
  color: #727272;
  font-size: 17px;
  line-height: 24px;
  font-weight: 400;
  font-style: italic;
  padding-bottom: 16px;
  margin-bottom: 0;
  margin-top: 0;
}

.redLine {
  width: 40px;
  border: 0;
  border-top: 3px solid #ea4335;
  margin: 0;
  padding-bottom: 14px;
}

.promotions .promotionColumn p {
  font-weight: 400;
  margin-top: 0;
  font-size: 17px;
  line-height: 28px;
}

.categoriesMenu p {
  font-size: 14px;
  letter-spacing: 0.5px;
  line-height: 17px;
  font-weight: 400;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background-color: var(--color-white);
  padding: 9px 16px;
  text-transform: uppercase;
  display: inline-block;
  cursor: pointer;
  transition: all 0.25s;
  margin: 0 9px 0 0;
}

.categoriesMenu .selectedCat {
  background-color: #ea4335;
  border: 1px solid #ea4335;
  color: var(--color-white);
}

.categoriesMenu {
  padding-bottom: 30px;
}

/*Calendar*/
div#promotion .range-calendar .calendar {
  padding: 0px 0px !important;
}

#promotions_calendar .monthDropdown button {
  padding: 10px 16px;
  border: solid 1px var(--color-border);
  font-weight: 300;
  font-size: 16px;
  line-height: 28px;
  background-color: var(--color-off-white);
}

.open>.monthBtn.btn-default.dropdown-toggle {
  background-color: var(--color-white) !important;
}

#promotions_calendar .monthDropdown .months {
  left: unset !important;
  width: auto;
  min-width: 133px;
  font-size: 16px;
  line-height: 28px;
  padding: 0;
  margin-left: 0;
}

.monthDropdown button i {
  padding-left: 24px;
  font-size: 16px;
  -webkit-text-stroke: 1px var(--color-white);
}

#promotions_calendar .monthDropdown .months option {
  position: unset;
  display: block;
  float: unset;
  width: auto;
  text-align: left;
  cursor: pointer;
  color: var(--color-text);
  padding: 5px 16px;
  font-weight: 300;
}

.range-calendar .months .cell.selected {
  background-color: unset !important;
}

#promotions_calendar .monthDropdown .months option:hover {
  background-color: var(--color-accent) !important;
  color: var(--color-white) !important;
  transition: all 0.25s;
}

option.month-cell.cell.selected {
  color: var(--color-accent) !important;
}

li a.subMenu.storeSubMenu,
li a.subMenu.selectable,
li.selectedPromotionPageSubCat a {
  color: black;
}

li.selectedPromotionPageSubCat .selectable {
  padding-left: 53px;
}

.wrapper.hidden-dropdown {
  display: none;
}

div#promotions_calendar:not(.hidden-dropdown) {
  display: inline-block !important;
}

.wrapper:not(.hidden-dropdown) {
  display: inline-block;
  margin-right: 66px;
  vertical-align: top;
  margin-bottom: 0;
}

div#promotions_calendar .wrapper:nth-child(3) {
  vertical-align: middle;
  width: 420px;
  float: none;
  overflow: hidden;
  margin: 0 auto;
}

.cell-content:hover {
  color: var(--color-accent);
  cursor: pointer;
}

#promotions_calendar span.previous {
  position: absolute;
  float: left;
  color: var(--color-muted);
  margin: 26px 0 0 -39px;
  line-height: 0 !important;
  cursor: pointer;
  -webkit-text-stroke: 1px var(--color-white);
}

#promotions_calendar span.nextcall {
  position: absolute;
  float: right;
  right: 0px;
  color: var(--color-muted);
  cursor: pointer;
  -webkit-text-stroke: 1px var(--color-white);
  line-height: 0 !important;
  margin: 26px -39px 0 0;
}

#promotions_calendar span.nextcall:hover,
#promotions_calendar span.previous:hover {
  color: var(--color-accent);
}

.previous.disabled,
.nextcall.disabled {
  pointer-events: none;
  opacity: 0.3;
}

#promotions_calendar span.previous i.fa.fa-arrow-left {
  font-size: 16px;
  top: 0px;
  width: 16px;
  line-height: 16px;
  height: 16px;
}

#promotions_calendar span.nextcall i.fa.fa-arrow-right {
  font-size: 16px;
  top: 0px;
  width: 16px;
  line-height: 16px;
  height: 16px;
}

.customCalendar select {
  margin-top: 7px;
  background-color: var(--color-white);
  cursor: pointer;
  width: 147px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  border: 1px solid var(--color-border) !important;
  border-radius: 6px !important;
  -webkit-appearance: none;
  padding: 16px 0 15px 16px !important;
  text-transform: uppercase;
  box-shadow: none !important;
  position: unset !important;
}

label {
  position: relative;
}

.monthLable label::after {
  content: "\f0d7";
  font-family: "FontAwesome";
  font-size: 20px;
  color: var(--color-text);
  right: 19px;
  margin: 0;
  top: -13px;
  position: absolute;
  pointer-events: none;
  -webkit-text-stroke: 0.5px var(--color-white);
}

/*/Calendar*/
/*End Promotion*/

/*Store Page Promotion*/
.promotionsPage .dropdownPromoPage.dropdown {
  /* padding-left: 46px; */
  vertical-align: bottom;
  margin-bottom: 5px;
}

.dropdownStorePromo button.btn.btn-default.dropdown-toggle {
  text-align: left;
}

.dropdownStorePromo.dropdown button.btn.btn-default.dropdown-toggle::after {
  content: "\f0d7";
  font-family: "FontAwesome";
  font-size: 20px;
  color: var(--color-text);
  right: 12px;
  margin: 0;
  top: 12px;
  position: absolute;
  pointer-events: none;
  -webkit-text-stroke: 0.5px var(--color-white);
}

.dropdownStorePromo span.selectedShopDineCat {
  padding: 10px 211px 10px 16px;
  font-size: 16px;
  line-height: 28px;
  color: var(--color-text);
}

.promotionsTabContainer .blackLine {
  padding-bottom: 56px;
}

div#store_promotions {
  padding-top: 32px;
}

.promotionsTabContainer div#store_promotions {
  padding-top: 0;
  margin: 0;
}

.promotionsPageTopBar>* {
  display: inline-block;
}

.dropDownPromoWrapper {
  width: calc(100% - 730px);
  min-width: 160px;
}

.promotionsPage .dropdownPromoPage.dropdown {
  width: 100%;
}

.dropDownPromoWrapper button.promotionPageBtn.btn-primary.dropdown-toggle {
  text-transform: capitalize;
  width: 100%;
  text-align: left;
  padding: 10px 0px 10px 16px;
  font-size: 16px;
  line-height: 28px;
  background-color: var(--color-off-white);
  border-radius: 4px;
  border: solid 1px var(--color-border);
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  color: var(--color-text);
  cursor: pointer;
}

.open>.promotionPageBtn.btn-primary.dropdown-toggle.focus,
.open>.promotionPageBtn.btn-primary.dropdown-toggle:focus,
.open>.promotionPageBtn.btn-primary.dropdown-toggle:hover {
  background-color: var(--color-white);
}

button.promotionPageBtn.btn-primary.dropdown-toggle::after {
  content: "\f0d7";
  font-family: "FontAwesome";
  font-size: 20px;
  color: var(--color-text);
  right: 12px;
  margin: 0;
  top: 12px;
  position: absolute;
  pointer-events: none;
  -webkit-text-stroke: 0.5px var(--color-white);
}

#guide_bg ul.dropdown-menu.promotionPageCatSelect {
  margin-left: 46px;
  margin-top: -1px;
  width: calc(100% - 45px);
  background-color: var(--color-white);
  font-size: 16px;
  line-height: 28px;
  padding: 0px;
}

/* li.selectedPromotionPageSubCat {
padding: 5px 0 5px 16px;
font-weight: 300;
} */
/*End Store Page Promotion*/

/*Kid's Club Offer*/
p.kidsClubOfferDesc {
  font-size: 16px;
  line-height: 28px;
  padding: 40px 0 40px 0;
  font-weight: 300;
}

.kidsClubOfferWrapper,
.kidsClubBirthdayOfferWrapper {
  width: 100%;
  min-height: 500px;
  font-size: 0;
  position: relative;
  padding-bottom: 25px;
}

.kidsClubCategoriesMenu,
.kidsClubBirthdayCategoriesMenu {
  display: unset;
  position: absolute;
  min-width: 0;
  padding: 0;
  margin: 0;
  line-height: 24px;
  width: 280px !important;
}

.promotionsPage div#kids_club_offers .promotionPageTypeTabContent,
.promotionsPage div#kids_club_birthday_offers .promotionPageTypeTabContent {
  vertical-align: top;
  margin-left: 285px;
}

p.tabKidsClubBtn,
p.tabKidsClubBirthdayBtn {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 32px;
  cursor: pointer;
}

p.tabKidsClubBtn:hover,
p.tabKidsClubBirthdayBtn:hover {
  color: var(--color-accent);
}

.selectedtabKidsClubBtn,
.selectedtabKidsClubBirthdayBtn {
  color: var(--color-accent);
}

.promotionContainer p {
  font-size: 16px;
  line-height: 28px;
}

.promotionsPage div#kids_club_offers .promotionPost,
.promotionsPage div#kids_club_birthday_offers .promotionPost {
  width: calc(33.33% - 12px);
  display: inline-block;
  margin: 0;
  position: relative;
  transition: all 0.25s;
  background-color: var(--color-white);
  overflow: hidden;
  height: 0;
}

/*End Kid Club*/

/*Tourist Privilege*/
.promotionsPage .touristPrivilegesCatWrapper .promotionPost {
  width: calc(33.33% - 10px);
  display: inline-block;
  margin: 0 5px 16px 5px;
  position: relative;
  padding-top: calc(100% - 33.33% - 24px);
  transition: all 0.25s;
  background-color: var(--color-white);
  overflow: hidden;
  height: 0;
}

.touristPrivilegesDescWrapper {
  padding-top: 40px;
  width: 100%;
  padding-bottom: 70px;
}

.touristPrivilegesContainer {
  padding-right: 40px;
}

.touristPrivilegesContainer,
.touristPrivilegesImageContainer {
  width: calc(50% - 3px);
  display: inline-block;
  vertical-align: middle;
}

h1.touristPrivilegesTitle {
  padding-bottom: 16px;
  font-size: 40px;
  line-height: 60px;
}

p.touristPrivilegesDesc {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 40px;
  font-weight: 300;
}

.touristPrivilegesCatWrapper {
  width: 100%;
  min-height: 500px;
  font-size: 0;
  padding-bottom: 40px;
}

.touristPrivilegesCatWrapper .touristPrivilegesCatMenuTabContent {
  vertical-align: top;
  margin-left: 300px;
}

.mainTouristPrivilegesContainer .blackLine {
  margin: 64px 0 40px 0;
}

button.touristPrivilegesBtn.dropdown-toggle {
  text-transform: capitalize;
  width: 0;
  text-align: left;
  padding: 0;
  font-size: 22px;
  line-height: 27px;
  background-color: unset;
  border-radius: 0;
  border: 0;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  color: var(--color-text);
  cursor: pointer;
}

.touristPrivilegesType.dropdown .dropdown-menu {
  margin-top: -1px;
  padding-top: 18px;
  padding-left: 19px;
  width: 200px !important;
  background-color: unset !important;
}

a.touristPrivilegesType.selectedTouristPrivilegesParentBtn {
  color: var(--color-accent) !important;
}

.pressReleaseWrapper .dropdown-menu {
  display: unset;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  float: left;
  margin-left: 0 !important;
  min-width: 0;
  padding: 0;
  margin: 0;
  font-size: 16px;
  line-height: 24px;
  text-align: left;
  list-style: none;
  background-color: unset;
  background-clip: padding-box;
  border: 0px;
  border: 0px;
  border-radius: 0px;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  background-color: unset !important;
}

.touristPrivilegesCatMenu .dropdown,
.dropup,
.rewardsCatMenu .dropdown,
.dropup {
  display: unset;
}

ul.dropdown-menu.submenucat {
  padding-top: 10px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
  font-family: "Rubik", sans-serif;
  font-style: italic;
  padding-bottom: 32px;
}

.dropdownSpace {
  height: 32px;
}

a.touristPrivilegesType {
  font-size: 22px !important;
  line-height: 27px !important;
  font-weight: 400 !important;
  font-family: "Rubik", sans-serif !important;
}

a.touristPrivilegesType:hover {
  background-color: unset !important;
}

li.touristPrivilegesBtn.selectedTouristPrivilegesBtn,
a.rewardsBtn.selectedrewardsBtn,
a.rewardsBtn:hover,
.touristPrivilegesCatMenu ul.dropdown-menu.submenucat>li:hover {
  color: var(--color-accent) !important;
}

ul.dropdown-menu.touristPrivilegesMenu ul.dropdown-menu.submenucat>li:not(.selectedTouristPrivilegesBtn) {
  padding-left: 19px !important;
}

li.touristPrivilegesBtn.selectedTouristPrivilegesBtn {
  padding-left: 0 !important;
  color: var(--color-accent);
}

ul.dropdown-menu.submenucat.touristPrivilegesSub.open {
  margin-left: 0 !important;
  padding-bottom: 32px !important;
  padding-top: 10px !important;
}

.touristPrivilegesCatMenu ul.dropdown-menu.submenucat>li {
  padding-top: 8px;
  cursor: pointer;
  font-style: italic;
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 24px;
}

li.touristPrivilegesBtn.selectedTouristPrivilegesBtn:before,
li.rewardsType.selectedAboutType:before {
  content: " • ";
  padding-left: 9px;
}

div#about-vivocity .rowContent.aboutUsPage {
  padding-top: 0 !important;
}

div#tourist_page div#about-vivocity .rowContent:first-child {
  padding-top: 32px;
}

div#about_us_page .rowContent.customerService .descCol {
  vertical-align: top;
}

div#tourist_page div#about-vivocity .rowContent {
  padding-top: 0px;
}

/*End Tourist Privilege*/

/*Footer Style*/
a.termsOfUse,
a.privacyPolicy {
  display: inline-block;
  cursor: pointer;
}

a.middleLine {
  display: inline-block;
  padding: 0 3px;
}

.footerBG {
  background-color: var(--color-text);
  background-size: cover;
  position: relative;
}

h4.footertitle {
  margin-top: 0;
  margin-bottom: 0 !important;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 1px;
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--color-white);
}

p.footerColumnContent {
  font-weight: 300;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-white);
  line-height: 24px;
  margin: 0;
  padding-bottom: 8px;
}

p.footerColumnContent:hover {
  color: var(--color-accent);
}

.footerRow {
  padding: 56px 0 16px 0;
  width: 100%;
}

.footerColumn {
  width: calc(25% - 5px);
  display: inline-block;
  vertical-align: top;
}

.pinkLine {
  width: 40px;
  border: 0;
  border-top: 3px solid var(--color-accent);
  margin: 16px 0;
}

.whiteLine {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 0;
  border-left: 0;
  margin-bottom: 0px;
}

/*copyright*/
.copyrightRow {
  width: 100%;
  padding-top: 27px;
  padding-bottom: 54px;
}

.copyrightColumn {
  width: calc(50% - 5px);
  display: inline-block;
  vertical-align: top;
}

.copyrightColumn.right {
  text-align: right;
}

.copyrightColumn p {
  font-weight: 500;
  font-size: 14px;
  color: var(--color-muted);
  line-height: 24px;
  padding-bottom: 4px;
  font-family: var(--font-body);
  margin: 0 !important;
}

.whiteBorderButton.tenantLoginBtn {
  color: var(--color-white) !important;
  border: 1px solid var(--color-white);
  border-radius: 28px;
  font-size: 16px !important;
  letter-spacing: -0.25px;
  line-height: 28px !important;
  font-weight: 700 !important;
  padding: 10px 24px;
  vertical-align: top;
  display: inline-block;
}

.tenantLoginBtnWrapper i.fas.fa-arrow-right {
  font-size: 12px !important;
  line-height: 12px !important;
  color: var(--color-border-strong) !important;
  display: inline-block;
  text-align: right;
  margin-right: 0 !important;
}

.tenantLoginBtnWrapper {
  padding-top: 19px;
}

.tenantLoginBtnWrapper .whiteBorderButton:hover i.fas.fa-arrow-right {
  color: var(--color-white) !important;
}

.tenantLoginBtnWrapper .whiteBorderButton:hover {
  background-color: var(--color-accent);
  color: var(--color-white) !important;
  border: 1px solid var(--color-accent);
  transition: all 0.25s;
}

p.termsOfUseFooter:hover,
p.privacyPolicyFooter:hover,
a.contactNum:hover {
  color: var(--color-accent) !important;
}

a.contactNum {
  font-weight: 500 !important;
  font-size: 14px !important;
  color: var(--color-muted) !important;
  line-height: 24px;
  padding-bottom: 8px;
  margin: 0 !important;
}

/*/copyright*/

/*Cookie*/
.cookieBanner {
  max-width: 1920px;
  display: none;
  width: 100%;
  position: fixed;
  z-index: 30;
  bottom: 0;
  background-image: linear-gradient(to right, #9b3cb7, #ff396f);
}

.cookieBannerTextWrapper {
  padding: 24px 64px;
}

.cookieBanner p {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  color: white;
}

.cookieBanner a {
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  line-height: 24px !important;
  color: white !important;
  text-decoration: underline;
}

.cookieBanner img {
  position: absolute;
  object-fit: cover;
  width: 24px;
  height: 24px;
  right: 24px;
  top: 0;
  bottom: 0;
  margin: auto;
  cursor: pointer;
}

/*Cookie End*/

/*Social Media*/
#footer .socialMedia {
  background-image: linear-gradient(to right, #9b3cb7, #ff396f);
  width: 100%;
  height: calc(100% / 3);
  z-index: 3;
  position: relative;
}

#footer .socialMediaIcon {
  display: flex;
  width: 100%;
  padding-left: 16px;
  align-items: center;
  justify-content: center;
}

#footer .socialMediaIcon p,
#footer .socialMediaIcon a {
  display: flex;
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  line-height: 30px !important;
  font-weight: 700 !important;
  color: var(--color-white) !important;
  padding-right: 64px;
  align-items: center;
}

#footer .socialMediaIcon img {
  width: 40px;
  height: 40px;
  margin-right: 12px;
}

#footer .socialMediaWrapper {
  height: 100%;
  width: 100%;
  background-image: url(https://d3nse58ioth0yc.cloudfront.net/wp/img_swirl.png);
  background-repeat: no-repeat;
  background-position: right bottom;
  padding: 70px 0 !important;
}

.socialMediaIcon>a:first-child {
  padding-right: 50px;
}

.socialMediaWrapper>* {
  display: inline-block;
}

div#newsletterWrapper {
  padding-left: 24px;
}

#newsletterWrapper p:first-child {
  padding-bottom: 0;
  margin-bottom: 11px;
}

p.newsletterInputField:hover {
  color: var(--color-accent) !important;
  border-radius: 6px;
  letter-spacing: 0.75px;
  font-weight: 400;
  padding: 16px;
  text-transform: uppercase;
  display: inline-block;
  background-color: var(--color-white);
  cursor: pointer;
  transition: all 0.25s;
}

#newsletterWrapper p {
  color: var(--color-white);
  font-size: 14px;
  line-height: 17px;
  text-transform: uppercase;
}

p.newsletterInputField {
  border: 2px solid var(--color-white);
  border-radius: 6px;
  letter-spacing: 0.75px;
  font-weight: 400;
  padding: 16px;
  text-transform: uppercase;
  display: inline-block;
  cursor: pointer;
}

#footer a {
  color: var(--color-white);
  font-size: 20px;
  font-family: var(--font-body);
  /* vertical-align: top; */
}

.newsletterCheckbox a {
  color: var(--color-info) !important;
  font-size: 16px !important;
  line-height: 24px;
  /* padding-bottom: 32px; */
  font-family: "Barlow", sans-serif !important;
  font-weight: 400 !important;
  font-style: italic;
  margin: 0;
  padding-left: 0;
}

.footerColumn a {
  display: table;
}

#footer i {
  font-size: 40px;
  margin-right: 16px;
  width: 35px;
  color: var(--color-white);
}

.newsletterInputField input#email {
  width: 430px;
  border-radius: 6px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 17px;
  color: var(--color-border-strong);
  line-height: 28px;
  padding: 6px 0 6px 16px;
}

#newsletterForm .errorField,
#newsletterForm .newsletterCheckbox .errorField,
#loginForm .errorField,
#enquiryForm .errorField,
.enquiryRecaptchaError,
#feedbackForm .errorField,
.feedbackRecaptchaError {
  color: red;
  font-size: 14px;
  margin: 0;
  padding-bottom: 24px;
  margin-top: -26px;
}

#enquiryForm .errorField,
.enquiryRecaptchaError,
#feedbackForm .errorField,
.feedbackRecaptchaError {
  margin-top: 0;
}

.newsletterCheckbox .errorField {
  padding-left: 35px;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.enquiryFormSubmitButton,
.feedbackFormSubmitButton {
  pointer-events: none;
}

.enquiryFormSubmitButton:hover,
.feedbackFormSubmitButton:hover {
  opacity: 0.5;
}

/*Download*/
#footer .download {
  width: 100%;
  min-height: 500px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 0;
  position: relative;
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1727149831/Vivocity/Website%202024/Images/VR2024_Web_TopBtm_Banners_R3_FA-02.jpg");
  padding: 70px 0 120px 0;
}

#footer .downlaodWrapper .container {
  position: relative;
  height: 100%;
  width: 50%;
  margin: 0 0 0 auto;
}

#footer .downloadContentWrapper {
  /* padding-left: 48px; */

}

#footer .downlaodWrapper h1 {
  font-family: "Thienhardt-Medium", sans-serif;
  font-weight: 700;
  font-size: 32px;
  font-style: normal;
  font-weight: normal;
  line-height: 33px;
  /* 125% */
  color: var(--color-primary-strong);
  letter-spacing: -1px;
  margin-bottom: 0;
  padding: 0 0;
}

#footer .downlaodWrapper p {
  font-size: 14px;
  line-height: 24px;
  font-family: var(--font-body);
  font-weight: 500;
  color: var(--color-text);
  max-width: 600px;
  margin: 0;
  padding-bottom: 21px;
}

#footer .downloadFooterTermsConditions {
  /* padding-bottom: 20px; */
}

#footer .downlaodWrapper p.bold {
  font-weight: 600;
}

#footer img.vivorewardsicon {
  /* width: 202px; */
  /* height: 70px; */
  /* margin-bottom: 15px; */
}

#footer img.handImg {
  width: auto;
  height: calc(100vw / 3 + 21px);
  /* bottom: -50%; */
  bottom: 0;
  position: absolute;
  right: 0;
  max-height: 700px;
}

#footer .downloadBtnWrapper .downloadDescWrapper {
  padding-right: 12px;
  font-size: 0;
  padding-bottom: 12px;
  padding-top: 12px;
  display: flex;
  align-items: center;
}

#footer .downloadBtnWrapper .downloadDescWrapper>* {
  display: inline-block;
  vertical-align: bottom;
}

#footer .downloadBtnWrapper .downloadDescWrapper img {
  vertical-align: top;
  height: 80px;
  margin: 0;
}

#footer .downloadBtnWrapper .downloadDescWrapper p {
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 14px;
  padding-left: 8px;
  padding-bottom: 0;
  font-family: "Thienhardt", sans-serif;
  color: var(--color-primary-strong);
  position: relative;
  top: -4px;
}

/*Download Btn*/
#footer .downloadBtnWrapper img {
  height: 40px;
  width: auto;
  display: inline-block;
  margin-right: 13px;
}

/*---------Finish Home Page CSS----------*/

/*directory page*/
/*directory store*/
div#store_guide_bg {
  background-color: var(--color-white);
  margin-bottom: -21px;
}

div#guide_bg {
  background-color: var(--color-off-white);
}

div#white_bg {
  background-color: var(--color-white);
}

div#white_bg_FunLearningPage,
div#white_bg_about_us,
div#white_bg_mallPromotions {
  background-color: var(--color-white);
  margin-bottom: -21px;
}

div#store_guide_bg .infoContainer {
  background-color: var(--color-off-white);
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: auto;
}

div#store_guide_bg .infoContainer .infoContainerRow {
  width: 100%;
  max-width: 776px !important;
  padding: 0 16px;
  margin: auto;
  font-size: 0 !important;
}

div#store_guide_bg .infoContainerRow {
  display: flex;
}

div#store_guide_bg .infoContainer .infoBox {
  vertical-align: top;
  margin: 32px 0;
  position: relative;
  width: 100%;
  position: relative;
  border-left: 1px solid var(--color-border-light);
}

div#store_guide_bg .infoContainer .infoBox .infoTitle {
  border-left: 4px solid var(--color-accent);
  padding-left: 20px;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  text-align: left;
  color: var(--color-text);
  margin: 0;
}

div#store_guide_bg .infoContainer .infoBox .infoContent {
  padding-left: 23px;
  margin: 0;
}

#white_bg_FunLearningPage.kcEventsTab {
  background-color: var(--color-off-white);
}

.guideList {
  display: flex;
  flex-wrap: wrap;
}

.happeningStoreContainer {
  margin: 0 -5px;
  padding-bottom: 40px;
}

#algolia_store_tags_list .ais-Hits-item .guideListWrapper {
  width: 100%;
  margin: 0;
}

#algolia_store_tags_list .ais-Hits-list {
  margin-top: 0;
  margin-left: 0;
  display: block;
}

#algolia_store_tags_list .ais-Hits-list.customSearch {
  display: flex;
}

.ais-SearchBox .button:hover,
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
  background: transparent;
  cursor: pointer;
}

#algolia_store_tags_list .guideListWrapper:hover {
  transition: all 0.25s;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

.ais-Hits .guideListWrapper:hover,
.ais-Hits .participatingWrapper:hover {
  transition: none;
  box-shadow: none;
}

a[data-val=""] {
  display: none !important;
}

.guideListWrapper:nth-child(n),
.participatingWrapper {
  display: block;
  width: 100%;
  margin: 0;
  background-color: var(--color-white);
  vertical-align: top;
  overflow: hidden;
  height: 546px;
}

.guideBG {
  background-color: var(--color-off-white);
}

.guideListWrapper:hover {
  transition: all 0.25s;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

.participatingWrapper:hover {
  transition: all 0.25s;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  cursor: pointer;
}

.guideListWrapper:hover .guideListThumbnail,
.participatingWrapper:hover .participatingThumbnailWrapper {
  filter: unset;
  transition: all 0.25s;
}

img.featureImage,
img.participatingFeatureImage {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  max-width: 270px;
  width: 100%;
  border-radius: 8px 8px 0 0;
  max-height: -webkit-fill-available;
}

.guideListThumbnail,
.participatingThumbnailWrapper {
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
  max-height: 270px;
  filter: grayscale(100%);
  transition: all 0.25s;
  position: relative;
  border-bottom: 1px solid var(--color-border);
}

#tags-list .guideListThumbnail,
#tags-list .participatingThumbnailWrapper {
  filter: none;
}

.guideListContentWrapper,
.participatingContentWrapper {
  position: relative;
  width: 100%;
  height: 45%;
  max-height: 276px;
  top: -20px;
}

.guideListContent {
  padding: 24px 16px 0 16px;
  position: absolute;
  top: 0;
  width: 100%;
}

.participatingContent {
  padding: 15px 16px;
  position: absolute;
  top: 0;
}

.guideListContent h2 {
  font-size: 24px;
  line-height: 29px;
  padding-bottom: 8px;
}

.guideListContent .guideLotNum,
.participatingContent .participatingLotNum {
  font-family: "Barlow", sans-serif;
  font-size: 16px !important;
  line-height: 24px !important;
  /* font-style: italic !important; */
}

.guideListContent .storeName {
  height: 60px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}

.participatingContent .participatingStoreName {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 8px;
  font-style: normal;
  font-weight: 400;
  text-transform: capitalize;
}

p.participatingStoreDesc {
  display: -webkit-box;
  max-width: 100%;
  height: 56px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.participatingContent p {
  color: var(--color-text);
  font-size: 17px;
  line-height: 28px;
  font-weight: 300;
}

a.guideContactNum,
a.websiteULWrapper {
  font-style: normal !important;
  font-size: 16px !important;
  line-height: 28px !important;
  font-weight: 300 !important;
  display: block;
}

.guideListContent .guideCat,
.participatingContent .participatingCat {
  font-family: "Barlow", sans-serif;
  line-height: 24px;
  font-size: 16px;
  /* font-style: italic; */
}

.guideListContent a,
.participatingContent a {
  font-size: 17px;
  line-height: 28px;
  color: var(--color-text);
}

.guideListContent p {
  color: var(--color-text);
  font-size: 17px;
  line-height: 28px;
  /* font-style: italic; */
}

.storeTagWrapper[data-store-tag="0"] {
  display: none !important;
}

.guideListContent .tooltip,
.singleStorePostContentWrapper .tooltip {
  position: relative;
  display: inline-block;
  opacity: 1;
  z-index: 3;
}

.tagSection {
  position: relative;
  display: flex;
  opacity: 1;
  z-index: 3;
  align-items: center;
  top: -40px;
}

.guideListContent .tooltip .tooltipText,
.singleStorePostContentWrapper .tooltip .tooltipText {
  visibility: hidden;
  width: max-content;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 24px;
  background-color: var(--color-accent);
  border: 1px solid #f0e6cd;
  color: var(--color-white);
  padding: 4px 12px;
  border-radius: 4px;
  position: absolute;
  z-index: 1;
  top: -42px;
  left: 0;
  margin-bottom: 8px;
  margin-left: -40px;
}

.guideListThumbnail .tagSection .tooltipText {
  visibility: hidden;
  width: max-content;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 24px;
  background-color: var(--color-accent);
  border: 1px solid #f0e6cd;
  color: var(--color-white);
  padding: 4px 12px;
  border-radius: 4px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  margin-bottom: 8px;
  margin-left: -20px;
}

.kidsClubStoreTagWrapper,
.halalStoreTagWrapper,
.dbsStoreTagWrapper,
.touristStoreTagWrapper {
  max-height: 24px;
  display: flex;
}

.guideListWrapper .tooltipText,
.kidsClubStoreTagWrapper .tooltipText,
.hasBirthdayTagWrapper .tooltipText,
.halalStoreTagWrapper .tooltipText,
.dbsStoreTagWrapper .tooltipText,
.hasPromotionTagWrapper .tooltipText,
.touristStoreTagWrapper .tooltipText {
  visibility: hidden;
  width: max-content;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 24px;
  background-color: var(--color-accent);
  border: 1px solid #f0e6cd;
  color: var(--color-white);
  padding: 4px 12px;
  border-radius: 4px;
  position: absolute;
  z-index: 1;
  top: 40px;
  margin-bottom: 8px;
  margin-left: -18px;
}

.newStoreCornerWrapper {
  position: absolute;
  z-index: 3;
}

.guideListContent .tooltip:hover .tooltipText,
.singleStorePostContentWrapper .tooltip:hover .tooltipText,
.guideListThumbnail .tagSection .kidsClubStoreTagWrapper:hover .tooltipText,
.guideListThumbnail .tagSection .hasPromotionTagWrapper:hover .tooltipText,
.newStoreCornerWrapper:hover .tooltipText,
.kidsClubStoreTagWrapper:hover .tooltipText,
.dbsStoreTagWrapper:hover .tooltipText,
.halalStoreTagWrapper:hover .tooltipText,
.dbsStoreTagWrapper:hover .tooltipText,
.hasPromotionTagWrapper:hover .tooltipText,
.touristStoreTagWrapper:hover .tooltipText {
  visibility: visible;
}

.guideListContent .kidsClubStoreTag,
.guideListContent .touristPrivilegesTag {
  display: inline-block;
  margin-right: 24px;
  font-size: 12px;
  font-style: normal;
  color: var(--color-white);
  line-height: 14px;
  text-transform: uppercase;
  height: 48px;
  cursor: pointer;
}

.singleStorePostContentWrapper .kidsClubStoreTag,
.singleStorePostContentWrapper .touristPrivilegesTag {
  display: inline-block;
  margin-right: 24px;
  font-size: 12px;
  font-style: normal;
  color: var(--color-white);
  line-height: 14px;
  text-transform: uppercase;
  height: 32px;
  cursor: pointer;
}

.colorLine {
  width: 40px;
  height: 3px;
  margin: 16px 0;
  background-color: var(--color-border-strong);
}

.guideListWrapper:hover .colorLine,
.participatingWrapper:hover .colorLine,
.mediaKitLinkWrapper:hover .colorLine {
  background-color: var(--color-accent);
}

.icon-phone:before {
  content: "\f095";
  font-size: 17px;
  color: var(--color-muted);
  padding-right: 12px;
}

.icon-globe:before {
  content: "\f0ac";
  font-size: 17px;
  color: var(--color-muted);
  padding-right: 8px;
}

.alphabetFilter {
  list-style-type: none;
  padding: 0 0 32px 0;
  cursor: pointer;
  width: 100%;
  font-size: 0;
}

.letterBtn {
  font-size: 17px;
  line-height: 28px;
  color: var(--color-muted);
  margin-right: 6.6px;
  display: inline-block;
  text-align: center;
  width: 34px;
  position: relative;
}

.letterBtn:first-child {
  width: 42px;
}

.letterBtn:last-child {
  margin-right: 0px;
}

.letterBtn.selectedAlphabet {
  color: var(--color-accent);
}

.letterBtn.selectedAlphabet:after {
  content: "";
  width: 100%;
  height: 3px;
  display: block;
  background-color: var(--color-accent);
  position: absolute;
  bottom: -6px;
}

.box {
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  padding: 10px;
  height: 100px;
  width: calc(25% - 10px);
  float: left;
  margin: 5px;
  text-align: center;
  border-radius: 3px;
  color: var(--color-white);
}

.spacer {
  clear: both;
  height: 20px;
}

p.letterBtn.disabled {
  opacity: 0.3;
  pointer-events: none;
}

.alphabetFilter table td,
table th {
  padding: 0;
  border: 1px solid #767676;
  word-break: break-all;
}

.btn btn-default dropdown-toggle {
  background-color: #4caf50;
  color: var(--color-white);
  padding: 16px;
  font-size: 16px;
  border: none;
}

/*Single Post */
.singleDirectory {
  width: 100%;
  max-width: 776px;
  padding: 0px 16px;
  margin: auto;
}

.singleStorePostWrapper {
  width: 100%;
  padding-bottom: 40px;
}

a.singlePostImage {
  display: inline-block;
  /* width: calc(9% - 5px); */
  width: 64px;
  height: 64px;
  vertical-align: top;
  padding-top: 10px;
}

.singleStorePostImageWrapper.desktopShow {
  background-repeat: no-repeat;
  padding-top: 100%;
  width: 100%;
  transition: all 0.25s;
  position: relative;
  background-position: center;
  background-color: var(--color-white);
}

.singleStorePostImage {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  max-height: 100%;
  max-width: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.singleStorePostHeaderContentWrapper {
  display: inline-block;
  vertical-align: middle;
  padding-left: 20px;
  width: calc(91% - 5px);
  position: relative;
  bottom: 0;
}

.singleStorePostTitle {
  font-size: 64px;
  line-height: 80px;
  letter-spacing: -3px;
  color: var(--color-white);
  font-family: var(--font-display);
  font-weight: 700;
  height: 160px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
}

.singlePostCategoriesWrapper {
  line-height: 100%;
}

.singleStorePostCategories,
p.singleStoreLotNum {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  color: var(--color-white);
  font-size: 22px;
  line-height: 27px;
  display: inline-block;
}

.singleStorePostHeaderContentWrapper .vl {
  border-left: 1px solid var(--color-white);
  height: 23px;
  display: inline-block;
  vertical-align: middle;
  margin: 0 5px 4px 5px;
  margin-bottom: 4px;
  margin-left: 13px;
  margin-right: 13px;
}

.guide_headerTitle {
  max-width: 1200px;
  width: 100%;
  padding: 0 0 0 225px;
  margin: auto;
}

.singlePostStorePromotionWrapper h1 {
  font-size: 28px;
  line-height: 40px;
  font-weight: 700;
  letter-spacing: -0.5px;
  padding-bottom: 24px;
}

.directoryBackBtn a {
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 24px;
  z-index: 2;
  /* margin-right: 5px; */
}

.directoryBackBtn a img {
  display: inline-block;
  width: 18px;
  height: 18px;
  object-fit: contain;
  vertical-align: middle;
  z-index: 2;
  margin-right: 4px;
  margin-top: auto;
  margin-bottom: auto;
}

.directoryBackInnerBtn {
  display: flex;
}

.guidePostWrapper a i {
  font-size: 12px;
  position: absolute;
  bottom: 12px;
  left: 0;
}

.map-container {
  border-top: 1px solid var(--color-border-light);
  width: 100%;
  padding-bottom: 20px;
}

.map-container iframe {
  width: 100%;
  height: 800px;
  display: block;
  pointer-events: none;
  position: relative;
}

.map-container iframe.clicked {
  pointer-events: auto;
}

.singleStorePostContentWrapper .storeTagWrapper {
  font-size: 0;
  padding-top: 32px;
}

.aboutStoreContainer {
  padding: 40px 0 24px 0;
}

.aboutStoreContainer h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.5px;
}

/* .singleStorePostContent {
padding-top: 32px;
} */

.singleStorePostContentWrapper .blackLine {
  margin: 64px 0;
}

.singleStorePostContent p {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding: 0 0 40px 0;
}

.singleStorePostContent p:empty {
  padding-bottom: 0;
}

.singleStorePostPaymentWrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: 64px;
}

.singleStorePostPayment,
.singleStorePostPoints {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  flex-direction: column;
}

.singleStorePostPayment .typeWrapper,
.singleStorePostPoints .typeWrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.singleStorePostPoints {
  margin-right: 82px;
}

.singleStorePostPayment .paymentTitle,
.singleStorePostPoints .pointTitle {
  font-family: 'Poppins', sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
  /* 140% */
  letter-spacing: -0.25px;
}

.singleStorePostPayment .typeWrapper .firstType,
.singleStorePostPayment .typeWrapper .secondType,
.singleStorePostPoints .typeWrapper .firstType,
.singleStorePostPoints .typeWrapper .secondType {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  padding-right: 24px;
  padding-top: 12px;
}

.singleStorePostPayment .typeWrapper .firstType .typeIcon,
.singleStorePostPayment .typeWrapper .secondType .typeIcon,
.singleStorePostPoints .typeWrapper .firstType .typeIcon,
.singleStorePostPoints .typeWrapper .secondType .typeIcon {
  width: 24px;
  height: 24px;
  margin-right: 12px;
}



/* .singleStorePostContactInfoWrapper {
padding: 13px 0 40px 0;
} */

a.singleStorePostContact,
a.singleStorePostURL {
  display: inline-block;
  font-size: 14px;
  line-height: 24px;
  color: var(--color-primary);
  margin-left: 0 !important;
  padding-bottom: 5px;
}

a.singleStorePostContact img,
a.singleStorePostURL img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  padding-right: 8px;
  box-sizing: content-box;
}

.singleMallPromotionPostContent {
  padding: 40px 0;
}

.singleMallPromotionPostContent p {
  padding-bottom: 40px;
  font-size: 16px;
  line-height: 28px;
  font-family: var(--font-body);
  font-weight: 300;
}

.slidertext23 {
  padding-bottom: 40px;
  font-size: 16px;
  line-height: 28px;
  font-family: "Rubik", sans-serif;
  font-weight: 300;
}

.campaignTitleContent h1 {
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  color: var(--color-text) !important;
}

.campaignTitleContent h2,
.campaignTitleContent h3,
.campaignTitleContent h4,
.campaignTitleContent h5,
.campaignTitleContent h6 {
  font-family: var(--font-body);
  font-size: unset;
  line-height: unset;
  letter-spacing: unset;
  font-weight: unset;
  color: unset;
}

.campaignTitleContent img {
  width: 100%;
}

.campaignTitleContent p,
.campaignTitleContent ul,
.campaignTitleContent ol,
.campaignTitleContent li {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.singleMallPromotionPostContent h1,
.singleMallPromotionPostContent h2,
.singleMallPromotionPostContent h4,
.singleMallPromotionPostContent h5 {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 8px;
  font-weight: 400;
  text-transform: capitalize;
}

.singleMallPromotionPostContent h3 {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 40px;
  font-weight: 400;
  text-transform: capitalize;
}

.singleMallPromotionPostContent>p>img {
  width: 100%;
}

.singleMallPromotionPostContent h6 {
  font-size: 16px;
  line-height: 24px;
  padding-bottom: 24px;
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.singleParticipating.container>h1 {
  font-size: 40px;
  line-height: 64px;
  text-align: center;
  font-weight: 300;
  padding: 56px 0 40px 0;
}

.happeningPdfWrapper {
  width: 550px !important;
  margin-bottom: 64px;
  cursor: pointer;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

.participatingStoreWrapper {
  width: 800px;
  height: 360px;
  margin: auto;
  overflow: hidden;
}

.participatingStoreWrapper .swiper-container {
  width: 720px;
  background-color: var(--color-white);
}

.participatingStoreSlide {
  background-color: var(--color-white);
}

.participatingStoreWrapper .storeWrapper {
  font-size: 0;
}

.participatingStoreWrapper .storeWrapper>* {
  display: inline-block;
  width: 50%;
  vertical-align: middle;
  max-height: 360px;
  overflow: auto;
}

.participatingStoreWrapper .storeWrapper .storeDetails {
  padding: 40px 40px 40px 16px;
}

.participatingStoreWrapper .storeImageWrapper {
  width: 360px;
  height: 360px;
  padding: 16px;
  box-sizing: border-box;
  border-right: solid 1px var(--color-border);
}

.participatingStoreWrapper .storeImage {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding-top: 100%;
}

.participatingStoreWrapper .storeTitle {
  font-size: 22px;
  font-weight: 400;
  padding-bottom: 8px;
  line-height: 27px;
}

.participatingStoreWrapper .storeCategories,
.participatingStoreWrapper .storeLotNumber {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  padding-bottom: 8px;
  font-style: italic;
  font-family: "Barlow", sans-serif;
}

.participatingStoreWrapper .storeCategories {
  padding-bottom: 8px;
}

.participatingStoreWrapper .promoDesc {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  font-family: "Rubik", sans-serif;
  color: var(--color-text);
}

.participatingStoreWrapper .swiper-button-next,
.participatingStoreWrapper .swiper-button-prev {
  right: -32px;
  height: 24px;
  width: 24px;
}

.participatingStoreWrapper .swiper-button-next {
  right: -32px;
}

.participatingStoreWrapper .swiper-button-prev {
  left: -32px;
}

.pdfModalWrapper,
.participatingStoreModalWrapper {
  display: table;
  visibility: hidden;
}

#flowpaper-logo-bottom {
  display: none !important;
}

.pdfModalContainer {
  text-align: center;
}

.pdfModalContainer iframe {
  max-width: 1140px;
  width: 100%;
  padding: 0 24px;
  height: 90vh;
}

.promotionOffersContainer {
  width: 100%;
  font-size: 0 !important;
}

.promotionImageWrapper {
  width: 37.5%;
  display: inline-block;
  vertical-align: top;
}

.promotionBgImg {
  width: 100%;
  padding-top: 100%;
  background-size: cover;
  background-position: center;
}

.promotionContentWrapper {
  display: inline-block;
  width: 62.5%;
  vertical-align: top;
  padding-left: 24px;
  padding-top: 40px;
}

.promotionTitle {
  font-size: 20px;
  line-height: 28px;
  font-family: var(--font-display);
  font-weight: 700;
  padding-bottom: 4px;
  color: var(--color-text) !important;

}

div#homepageWhatsOn .promotionTitle {
  padding-bottom: 0;
}

div#homepageWhatsOn div#promoSection .promotionTitle {
  text-overflow: ellipsis;
  height: 60px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: -webkit-box;
}

.promotionContentWrapper .promotionContent h5,
.promotionContentWrapper .promotionContent h2,
.promotionContentWrapper .promotionContent h4 {
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
}

.promotionDate {
  font-size: 14px;
  line-height: 24px;
  font-family: var(--font-body);
  font-weight: 500;
  color: var(--color-muted);
  padding-bottom: 16px;
}

.promotionContent,
.promotionPageTypeTabContent .promotionContent {
  font-family: var(--font-body) !important;
  font-size: 14px;
  line-height: 24px;
  color: var(--color-text);
  overflow: hidden;
  border-radius: 16px;
}

div#store_guide_bg .promotionContent {
  border-radius: 0;
}

.promotionContent>p:not(:last-child) {
  padding-bottom: 28px;
}

.singlePostStorePromotionWrapper .blackLine {
  margin: 64px 0;
}

.singlePostStorePromotionWrapper .blackLine:last-child {
  visibility: hidden;
  margin: 0 0 120px;
}

.promotionType {
  font-size: 10px;
  line-height: 10px;
  font-family: var(--font-body);
  font-weight: 700;
  color: var(--color-accent);
  border: 2px solid var(--color-accent);
  letter-spacing: 0.75px;
  padding: 7px 8px;
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: 20px;
  border-radius: 4px;
}

.kidsClub {
  background-color: #00badc !important;
  color: white;
  border: none;
}

.promotionOffersContainer:hover .colorLine {
  background-color: var(--color-accent);
  transition: 0.25s all;
}

/*Shop and Dine*/
.preNexImageBGtWrapper.desktopShow,
.preNexImageBGtWrapper.mobileShow {
  background-color: var(--color-white);
  width: 100%;
  margin-top: 24px;
  margin-bottom: -21px;
}

.prevCatBtn i.fa.fa-arrow-left {
  padding-right: 23px;
  font-size: 16px;
  -webkit-text-stroke: 0.5px var(--color-white);
  color: #727272;
}

.nextCatBtn i.fa.fa-arrow-right {
  padding-left: 23px;
  font-size: 16px;
  -webkit-text-stroke: 0.5px var(--color-white);
  color: #727272;
}

p.prevBackBtn.desktopShow:hover i.fa.fa-arrow-right,
p.prevBackBtn.desktopShow:hover i.fa.fa-arrow-left,
.prevBackBtn.mobileShow:hover i.fa.fa-arrow-right,
.prevBackBtn.mobileShow:hover i.fa.fa-arrow-left {
  color: var(--color-accent);
}

p.prevBackBtn.desktopShow:hover,
p.prevBackBtn.mobileShow:hover {
  color: var(--color-accent);
}

a.prevBackBtn.desktopShow {
  color: var(--color-text);
  font-size: 20px;
  line-height: 28px;
  font-weight: 300;
}

.preNexImageBGtWrapper.mobileShow .prevCatBtn {
  width: calc(50% - 5px);
  display: inline-block;
  padding: 42px 0;
  margin-bottom: 21px;
}

.prevCatBtn {
  width: calc(50% - 5px);
  display: inline-block;
  padding: 55px 0;
}

p.prevBackBtn.mobileShow {
  display: inline;
  cursor: pointer;
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  text-transform: capitalize;
}

p.prevBackBtn.desktopShow {
  display: inline;
  cursor: pointer;
  font-weight: 300;
  font-size: 20px;
  line-height: 28px;
  text-transform: capitalize;
}

.preNexImageBGtWrapper.mobileShow .nextCatBtn {
  width: calc(50% - 5px);
  display: inline-block;
  text-align: right;
  padding: 42px 0;
  margin-bottom: 21px;
  vertical-align: top;
}

.nextCatBtn {
  width: calc(50% - 5px);
  display: inline-block;
  text-align: right;
  padding: 55px 0;
}

p.noPostMessage {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
  text-align: center;
  padding: 80px 0;
}

ul.dropdown-menu.guideFilter {
  width: 300px;
  padding: 0;
}

li.selectedShopDine:hover {
  background-color: var(--color-accent);
  color: var(--color-white);
}

li.selectedShopDine:first-child {
  padding-top: 8px;
}

li.selectedShopDine.selectedShopDineStore:hover {
  color: var(--color-white);
}

li.selectedShopDine {
  text-transform: capitalize;
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  cursor: pointer;
  padding: 4px 16px 4px 16px;
}

li.selectedShopDine.selectedShopDineStore {
  color: var(--color-accent);
}

.storeCat.container.contentContainer {
  padding: 0 !important;
}

.storeCat.container.directory {
  padding: 64px 0 0 0 !important;
}

.storeCat .blackLine {
  height: 1px;
  background-color: var(--color-border);
  margin: 16px 0;
}

.dropdownStoreCat.dropdown,
.dropdownStoreCat {
  width: 273px;
  /* width: calc(100% - 754px); */
  /* min-width: 340px; */
  /* padding-left: 46px; */
  display: inline-block;
}

.dropdown button.directorybtn.btn-default.dropdown-toggle,
.dropdownStoreCat button.directorybtn.btn-default.dropdown-toggle {
  text-transform: capitalize;
  width: 100%;
  text-align: left;
  padding: 9px 30px 9px 16px;
  font-size: 16px;
  line-height: 28px;
  background-color: var(--color-off-white);
  border-radius: 4px;
  border: solid 1px var(--color-border);
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  color: var(--color-text);
}

.open>.directorybtn.btn-default.dropdown-toggle.focus,
.open>.directorybtn.btn-default.dropdown-toggle:focus,
.open>.directorybtn.btn-default.dropdown-toggle:hover {
  background-color: var(--color-white);
}

.dropdown button.directorybtn.btn-default.dropdown-toggle::after,
.dropdown button.searchCatFilterBtn::after,
.dropdownStoreCat button.directorybtn.btn-default.dropdown-toggle::after {
  content: "\f0d7";
  font-family: "FontAwesome";
  font-size: 20px;
  color: var(--color-text);
  right: 12px;
  margin: 0;
  top: 12px;
  position: absolute;
  pointer-events: none;
  -webkit-text-stroke: 0.5px var(--color-white);
}

/* .directorybtn .notAllCatogeries, .rewardsCatalogueBtn .notAllCatogeries { */
.notAllCatogeries {
  display: inline-block;
  font-size: 14px;
  border-radius: 2px;
  border: solid 1px var(--color-border-strong);
  background-color: var(--color-border-light);
  padding: 0 38px 0 12px;
  position: relative;
  text-transform: uppercase;
  font-weight: 400;
}

/* .directorybtn .notAllCatogeries .cancelCategory, .rewardsCatalogueBtn .notAllCatogeries .cancelRewardsCatalogueType { */
.notAllCatogeries .cancelCategory,
.notAllCatogeries .cancelRewardsCatalogueType,
.notAllCatogeries .cancelRewardsCatalogueCat {
  font-size: 10px;
  padding: 0 16px;
  position: absolute;
  right: 0;
  top: calc(50% - 5px);
}

.dropdown,
.dropup {
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.dropdownShopDine.dropdown {
  display: block;
}

.dropdownShopDine.dropdown button.btn.btn-default.dropdown-toggle {
  color: var(--color-white);
  background-color: transparent;
  border-color: transparent;
  padding: 0px;
  padding-bottom: 0px 0px 16px 0px;
  width: 300px;
  text-align: left;
}

#guide_bg .dropdown-menu {
  margin-top: -1px;
  width: 100%;
  background-color: var(--color-white);
  font-size: 16px;
  line-height: 28px;
  padding: 0px;
  z-index: 15;
}

.dropdownStoreCat.dropdown ul.dropdown-menu.submenulist {
  margin-left: 0 !important;
}

ul.dropdown-menu.storeDropdownMenu {
  padding: 0;
}

#guide_bg .dropdown-menu ul {
  margin-top: -1px;
  width: 100%;
}

ul.dropdown-menu.storeDropdownMenu>li a:hover,
ul.dropdown-menu.promotionPageCatSelect>li a:hover,
ul.homepage-whats-on-menu.promotionPageCatSelect>li a:hover {
  background-color: var(--color-accent) !important;
  color: var(--color-white) !important;
}

ul.dropdown-menu.storeDropdownMenu>li a:hover #iconDropdown,
ul.dropdown-menu.promotionPageCatSelect>li a:hover #iconDropdown,
ul.homepage-whats-on-menu.promotionPageCatSelect>li a:hover #iconDropdown {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1678420169/Vivocity/Website%20Revamp%202023/Assets/Icons/xhdpi/icon_caret_down_light.png") !important;
}

ul.dropdown-menu.touristPrivilegesMenu>li a:hover {
  color: var(--color-accent) !important;
}

a.selectable.selectedStoreCat:hover {
  background-color: var(--color-accent);
  color: var(--color-white) !important;
}

a.selectable.selectedStoreCat {
  color: var(--color-accent) !important;
}

#guide_bg .dropdown-menu li a {
  color: var(--color-text);
  padding: 5px 16px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

#guide_bg .dropdown-submenu .dropdown-menu li a {
  padding-left: 28px;
}

a.subMenu.storeSubMenu:hover,
#guide_bg .dropdown-submenu .dropdown-menu li a:hover {
  cursor: pointer;
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
  background-color: transparent;
}

.dropdown a:focus {
  outline: none;
}

.dropdown-submenu {
  position: relative;
  width: 100px;
  right: 0;
}

.yearSubMenu {
  position: absolute !important;
}

button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn,
button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn,
button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn {
  border-radius: 6px;
  border: solid 1px var(--color-border);
}

button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn:focus,
button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn:focus,
button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn:focus {
  border: 1px solid var(--color-accent) !important;
}

button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn:after,
button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn:after,
button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn:after {
  content: "\f0d7";
  font-family: "Font Awesome 5 Free";
  font-size: 20px;
  color: var(--color-text);
  right: 23px;
  margin: 0;
  top: 10px;
  transform: rotate(0deg);
  position: absolute;
  pointer-events: none;
  -webkit-text-stroke: 0.5px var(--color-white);
  font-weight: bold;
  border: none;
  transition: transform 0.25s ease;
}

.dropdown.enquiryTypeSelection.is-open>button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn:after,
.dropdown.enquiryTypeSelection.open>button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn:after,
.dropdown.enquiryTypeSelection.show>button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn:after,
.dropdown.enquiryTypeSelection>button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn[aria-expanded="true"]:after,
.dropdown.categoryTypeSelection.is-open>button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn:after,
.dropdown.categoryTypeSelection.open>button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn:after,
.dropdown.categoryTypeSelection.show>button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn:after,
.dropdown.categoryTypeSelection>button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn[aria-expanded="true"]:after,
.dropdown.mobileCountryTypeSelection.is-open>button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn:after,
.dropdown.mobileCountryTypeSelection.open>button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn:after,
.dropdown.mobileCountryTypeSelection.show>button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn:after,
.dropdown.mobileCountryTypeSelection>button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn[aria-expanded="true"]:after {
  transform: rotate(180deg);
}

.dropdown-submenu .dropdown-menu {
  position: relative;
  box-shadow: none;
  background-color: transparent !important;
  border: none;
}

.dropdown-submenu .dropdown-menu li:first-child {
  border-top: 1px solid var(--color-border-light);
}

.dropdown-submenu .dropdown-menu li a {
  padding: 14px 48px;
  width: 100%;
  display: flex;
}

.storeCat.container.contentContainer .storeMenuContainerRow {
  display: flex;
}

.storeCat.container.contentContainer .storeKcTPType .checkboxContainer,
.mobileFilterContainer .storeKcTPType .checkboxContainer {
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 20px;
  width: 20px;
  cursor: pointer;
  border-radius: 4px;
  border: 1px solid var(--color-border-strong);
  padding: 0;
  margin-right: 10px;
}

.storeCat.container.contentContainer .storeKcTPType .checkboxContainer input,
.mobileFilterContainer .storeKcTPType .checkboxContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.storeCat.container.contentContainer .storeKcTPType .checkboxContainer .checkmark,
.mobileFilterContainer .storeKcTPType .checkboxContainer .checkmark {
  position: absolute;
  top: -1px;
  left: -1px;
  font-size: 14px;
  background-color: transparent;
  color: white;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  padding: 3px 0 0 6px;
  margin-right: -1px;
  border-radius: 4px;
  transition: 0.15s all;
}

.storeCat.container.contentContainer .storeKcTPType .checkboxContainer .checkmark i,
.mobileFilterContainer .storeKcTPType .checkboxContainer .checkmark i {
  position: absolute;
  top: 3px;
  left: 3px;
}

.storeCat.container.contentContainer .storeKcTPType .checkboxContainer input:checked~.checkmark,
.mobileFilterContainer .storeKcTPType .checkboxContainer input:checked~.checkmark {
  background-color: var(--color-accent);
}

.storeCat.container.contentContainer .storeKcTPType,
.mobileFilterContainer .storeKcTPType {
  font-size: 0;
  padding: 9px 16px;
  border: solid 1px var(--color-border);
  border-radius: 6px;
  margin-right: 16px;
}

.storeCat.container.contentContainer .storeKcTPType>*,
.mobileFilterContainer .storeKcTPType>* {
  display: inline-block;
  vertical-align: middle;
}

.storeCat.container.contentContainer .storeKcTPType p,
.mobileFilterContainer .storeKcTPType p {
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 28px;
}

.storeCat.container.contentContainer .searchBar {
  position: relative;
  color: var(--color-gray-200);
  font-size: 24px;
  display: flex;
  height: auto;
  padding: 0;
  flex-grow: 1;
}

.storeCat.container.contentContainer .searchBar .cancelSearch {
  position: absolute;
  top: 30%;
  right: 5px;
  z-index: 1;
  padding-right: 10px;
}

.storeCat.container.contentContainer .searchBar .ais-SearchBox-submitIcon {
  width: 24px;
  height: 24px;
}

div#algolia_store_searchbox {
  display: inline-block;
  width: calc(100% - 16px);
}

.cancelSearch {
  font-size: 20px;
  color: var(--color-text);
  visibility: hidden;
  cursor: pointer;
}

.storeCat.container.contentContainer .searchBar input {
  width: 100%;
  height: 32px;
  background: var(--color-off-white);
  border: 0px solid #aaa;
  border-radius: 5px;
  padding: 0;
  padding-left: 50px;
  padding-right: 30px;
  outline: none;
  vertical-align: text-top;
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.storeCat.container.contentContainer.searchBarCont .searchBar input {
  width: 100%;
}

.storeCat.container.contentContainer .filterWrapper>.desktopShow {
  display: flex;
}

#algolia_store_searchbox input.ais-SearchBox-input::placeholder,
#searchbox input.ais-SearchBox-input::placeholder {
  color: var(--color-muted);
}

.searchBar .fa-search {
  position: absolute;
  font-size: 20px;
  top: -15px;
}

#guide_bg .mobileFilterContainer {
  display: none;
  position: fixed;
  width: 100%;
  bottom: 0;
  height: 100%;
  z-index: 9999;
  background-color: transparent;
}

#guide_bg .mobileFilterContainer .mobileFilterOverlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

#guide_bg .mobileFilterContainer .mobileFilterWrapper {
  background-color: white;
  position: absolute;
  width: 100%;
  bottom: 0;
}

#guide_bg .mobileFilterContainer .mobileFilterHeader,
#guide_bg .mobileFilterContainer .mobileStoreCategoryFilterHeader {
  position: relative;
  border-bottom: solid 1px var(--color-border);
  padding: 16px;
}

#guide_bg .mobileFilterContainer .mobileStoreCategoryFilterHeader {
  margin-bottom: 16px;
}

#guide_bg .mobileFilterContainer .mobileFilterHeaderTitle,
#guide_bg .mobileFilterContainer .mobileStoreCategoryFilterTitle {
  font-size: 17px;
  line-height: 24px;
  text-align: center;
}

#guide_bg .mobileFilterContainer .mobileFilterDoneBtn {
  font-size: 14px;
  line-height: 17px;
  letter-spacing: 0.75px;
  color: var(--color-accent);
  position: absolute;
  right: 16px;
  top: calc(50% - 8.5px);
  cursor: pointer;
}

#guide_bg .mobileFilterContainer .mobileStoreCategoryFilterBackBtn {
  font-size: 20px;
  line-height: 20px;
  color: var(--color-text);
  position: absolute;
  left: 16px;
  top: calc(50% - 10px);
  cursor: pointer;
  -webkit-text-stroke: 1px var(--color-white);
}

#guide_bg .mobileFilterContainer .mobileFilterContent {
  padding: 16px 16px 40px;
}

#guide_bg .mobileFilterContainer .categoryFilter {
  padding-bottom: 24px;
  border-bottom: solid 1px var(--color-border);
  margin-bottom: 24px;
}

#guide_bg .mobileFilterContainer .categoryFilter .title,
#guide_bg .mobileFilterContainer .typeFilter .title {
  font-size: 17px;
  line-height: 24px;
  padding-bottom: 16px;
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat {
  width: 100%;
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat button {
  position: relative;
  background-color: var(--color-white);
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat .mobileStoreCategoryFilterWrapper {
  display: none;
  top: 0;
  left: 0;
  height: 100%;
  position: absolute;
  width: 100%;
  background-color: var(--color-white);
  z-index: 9;
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat .mobileStoreCategoryFilterWrapper.open {
  display: block;
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat .mobileStoreCategoryFilterWrapper .storeDropdownMenu {
  display: block;
  top: 75px;
  border: none;
  box-shadow: none;
  height: calc(100% - 75px);
  overflow-y: scroll;
  border-radius: 0;
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat .storeDropdownMenu li a {
  padding: 10px 16px;
}

#guide_bg .mobileFilterContainer .categoryFilter .dropdownStoreCat .storeDropdownMenu .submenulist li a {
  padding-left: 32px;
}

.mobileFilterContainer .storeKcTPType {
  border: 0;
  border-radius: 0;
  padding: 10px 0;
}

/*Happening Page*/
/* div#mall_promotions, div#atrium_events, div#whats_new {
margin: 0 -8px;
} */

div#mall_promotions,
div#new_stores,
div#whats_new,
div#atrium_events,
div#kids_club_offers {
  margin-bottom: 40px;
}

.happeningBox {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  color: var(--color-text);
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div#atrium_events .happeningPostWrapper {
  width: calc(25% - 16px);
  display: inline-block;
  margin: 0;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 167px;
}

.smallHappeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.happeningPostWrapper {
  width: 25%;
  display: inline-block;
  margin-right: 16px;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 642px;
}

#atrium_events .happeningPostContainer {
  position: relative;
  width: 100%;
  padding: 24px 16px;
}

.happeningPostDate,
.promotionPeriod {
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  padding-top: 8px;
}

.happeningPostCategories {
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  padding-top: 8px;
  display: -webkit-box;
  width: 100%;
  max-height: 30px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.happeningPostLocation {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.selectedHappeningCat,
.selectedPressRoomType,
.selectedFunLearningType,
.selectedLeasingEnquiryType,
.selectedPromotionPageTypeCat,
.selectedRewardsType,
.selectedEarningRewardsType,
.selectedSignUpType,
.selectedVoucherDetails,
.selectedAboutUsInfo,
.selectedTouristInfo {
  color: var(--color-white) !important;
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
}

/* Rewards DBS */
#rewards-dbs-exclusive .blackLine {
  margin: 40px 0;
}

#rewards-dbs-exclusive .largerBlackLine {
  margin: 64px 0 40px 0;
}

#rewards-dbs-exclusive h4,
#rewards-points-calculator h4,
#rewards-points-calculator-phase-2 h4 {
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.5px;
  font-family: var(--font-display);
  padding-bottom: 32px;
}

#rewards-dbs-exclusive h5,
#rewards-points-calculator h5,
#rewards-points-calculator-phase-2 h5 {
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-family: var(--font-display);
  padding-bottom: 24px;
}

#rewards-dbs-exclusive p {
  padding-bottom: 40px;
}

#rewards-dbs-exclusive p,
#rewards-points-calculator p,
#rewards-points-calculator-phase-2 p {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-family: var(--font-body);
}

.dbsRewardsCaptions {
  padding-top: 40px;
}

.dbsRewardsCardImageContainer {
  max-width: 430px;
}

.dbsRewardsVideoCaptions {
  /* padding-bottom: ; */
}

.dbsTnCLink {
  text-align: center;
  padding-top: 40px;
}

.dbsTnCLink a {
  color: var(--color-primary);
}

.dbsRewardsCaptions p,
.dbsRewardsVideoCaptions p {
  color: var(--color-muted);
  font-size: 14px !important;
  line-height: 24px !important;
  padding-bottom: 4px !important;
}

.dbsLinkingStepCell {
  background-color: white;
}

.dbsLinkingStepDesc {
  padding: 0 24px 32px 24px;
}

.dbsLinkingStepDesc a {
  color: var(--color-primary);
}

.dbsLinkingStepDesc ul {
  margin-bottom: 0 !important;
}

.dbsLinkingStepDesc ul li {
  list-style-position: outside;
  font-size: 14px;
  line-height: 24px;
}

.dbsExcludeDesc {
  padding-top: 24px;
  text-align: center;
}

.dbsExcludeDesc p {
  padding-bottom: 0 !important;
  color: var(--color-muted);
  font-size: 14px !important;
  line-height: 24px !important;
}

.dbsLinkVideoGuideContainer {
  margin-top: 32px;
  margin-bottom: 64px;
  border-radius: 16px;
  border: 1px solid var(--color-border-light);
  background-color: white;
}

.dbsLinkVideoGuideTitle {
  padding-top: 24px;
  padding-bottom: 32px;
}

/* End Rewards DBS */

/* Points calculator */
#rewards-points-calculator .blackLine,
#rewards-points-calculator-phase-2 .blackLine {
  margin: 32px 0 64px 0;
}

.rewardsCalculatorInputContainer {
  margin-bottom: 64px;
}

.rewardsCalculatorTableContainer .pointsEntitlementGuideTable {
  margin-bottom: 64px;
}

.rewardsCalculatorInputFlexContainer {
  display: flex;
  width: 100%;
}

.rewardsCalculatorInputLabel {
  font-weight: 500;
  font-size: 14px !important;
  line-height: 24px !important;
  border-left: 1px solid var(--color-border-light);
  padding-left: 23px;
  padding-right: 24px;
  padding-bottom: 8px;
}

.rewardsCalculatorInputHeader {
  font-weight: 700;
  border-left: 4px solid var(--color-accent);
  padding-left: 20px;
  padding-right: 24px;
  padding-bottom: 12px;
}

.rewardsCalculatorInputField,
.rewardsCalculatorCheckboxField {
  padding-left: 23px;
  padding-right: 24px;
  border-left: 1px solid var(--color-border-light);
}

.rewardsCalculatorCheckboxField {
  padding-bottom: 6px;
}

.rewardsCalculatorInputInnerField {
  display: flex;
  align-items: center;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background-color: var(--color-white);
}

.rewardsCalculatorCheckboxInnerField,
.rewardsCalculatorCheckbox {
  display: flex;
  align-items: center;
}

.rewardsCalculatorCheckbox {
  padding-right: 24px;
  white-space: nowrap;
}

.rewardsCalculatorCheckbox:last-child {
  padding-right: 0;
}

.rewardsCalculatorCheckbox input[type="checkbox"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  appearance: none;

  width: 24px;
  height: 24px;
  border: 1px solid var(--color-border);
  border-radius: 4px;

  font: inherit;
  transform: translateY(-0.075em);

  background-color: white;
  display: grid;
  place-content: center;
}

.rewardsCalculatorCheckbox input[type="checkbox"]:disabled {
  background-color: var(--color-border-light);
}

.rewardsCalculatorCheckbox input[type="checkbox"]:disabled+* {
  color: var(--color-muted);
}

.rewardsCalculatorCheckbox input[type="checkbox"]::before {
  content: "";
  display: block;
  font: inherit;
  width: 12px;
  height: 12px;
  transform: scale(0);

  box-shadow: inset 12px 12px white;

  transform-origin: bottom left;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.rewardsCalculatorCheckbox input[type="checkbox"]:checked::before {
  transform: scale(1);
}

.rewardsCalculatorCheckbox input[type="checkbox"]:checked {
  background-color: var(--color-accent) !important;
  border: 1px solid var(--color-accent) !important;
}

.rewardsCalculatorCheckbox label {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 400 !important;
  padding-left: 12px;
}

.rewardsCalculatorInputInnerField p {
  padding: 0 6px 0 12px;
}

.rewardsCalculatorInputInnerField input {
  border: none;
  border-radius: 8px;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 700;
  padding: 8px 0;
  max-width: 186px;
}

.rewardsCalculatorInputInnerField input::placeholder {
  font-weight: 400;
  color: var(--color-muted);
}

.rewardsCalculatorNotesContainer {
  padding-bottom: 120px;
}

.rewardsCalculatorNotesContainer p,
.privilegesSummaryNotesContainer p {
  padding-bottom: 16px;
  color: var(--color-muted);
}

.rewardsCalculatorNotesContainer li,
.privilegesSummaryNotesContainer li {
  font-size: 14px;
  line-height: 24px;
  color: var(--color-muted);
}

/* End Points calculator */

/* accordion */

.vrFaqSearchContainer {
  display: flex;
  align-items: center;
  background-color: var(--color-white);
  padding: 20px 24px;
  border-radius: 48px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.1);
}

.vrFaqSearchInput {
  width: 100%;
  border: none !important;
  padding: 0 !important;
  padding-left: 12px !important;
  font-size: 16px !important;
  line-height: 28px !important;
  letter-spacing: -0.25px !important;
  color: var(--color-text) !important;
}

.accordionNoResult {
  text-align: center;
  display: none;
}

.faqsContent {
  padding-top: 80px;
}

.faqsContent .blackLine {
  margin: 16px 0;
}

.faqsContent .answerBlackLine {
  margin: 24px 0;
  border-top: 1px solid var(--color-border);
}

.accordionItem {
  display: block;
  width: 100%;
  position: relative;
}

.accordionItem:nth-child(2):after,
.accordionItem.openAccordion:nth-child(2):after {
  top: 0px;
}

.accordionItem:nth-child(1):after,
.accordionItem.openAccordion:nth-child(1):after {
  top: -10px;
}

/* .accordionItemContent {
padding: 14px 0 8px 0;
} */

.accordionItemHeading {
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  position: relative;
}

.accordionItemHeading span {
  width: calc(100% - 64px);
  display: block;
}

.closeAccordion>.answerContainer {
  display: none;
}

.openAccordion>.answerContainer {
  display: block;
}

.accordionItemWrapper {
  padding-bottom: 72px;
}

.accordionItemContent .questionContainer {
  font-size: 0;
  display: flex;
}

.questionContainer {
  cursor: pointer;
}

.accordionButtonWrapper .accordionButton i {
  font-size: 12px;
  line-height: 24px;
}

.accordionItemContent .questionNumberContainer,
.accordionItemContent .question {
  display: inline-block;
  vertical-align: top;
}

.accordionItemContent .questionNumber {
  background-color: var(--color-accent);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.accordionItemContent .questionNumber p {
  color: white;
  font-size: 12px;
  line-height: 20px;
  font-weight: 700;
}

.accordionItemContent .question {
  width: 100%;
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  padding-left: 12px;
}

.accordionItemContent .answerContainer {
  padding-top: 24px;
}

.vrFaqTableWrapper {
  padding-left: 36px;
}

.vrReceiptImage {
  width: 100%;
  max-width: 500px;
}

table.expiryDateRewards {
  table-layout: fixed;
  width: 100%;
  border: none;
}

.expiryDateRewards tr {
  display: table-row;
  margin: auto;
  border: none;
}

.expiryDateRewards th,
.expiryDateRewards td {
  text-align: center;
  width: 50%;
  display: table-cell;
  padding: 18px 16px;
  border: 4px solid white;
  word-break: break-word;
}

.expiryDateRewards th {
  background-color: var(--color-accent);
  color: white;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.5px;
  word-break: break-word;
}

.expiryDateRewards td {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

.accordionItemContent .answer,
.accordionItemContent .step,
.accordionItemContent ul,
.accordionItemContent ol,
.accordionItemContent p {
  font-size: 16px;
  line-height: 28px;
}

.accordionItemContent .answer,
.accordionItemContent .step,
.accordionItemContent .unorderList,
.orderList,
.vrFaqImageWrapper {
  padding-left: 36px;
  padding-right: 36px;
  padding-bottom: 16px;
}

.accordionItemContent .answer .answerNote,
.answerNote {
  color: var(--color-muted);
  font-style: italic;
  font-size: 14px;
  line-height: 24px;
}

.privacyPolicyNote {
  font-size: 14px;
  line-height: 24px;
  padding-bottom: 0;
  color: var(--color-muted);
}

.vrFaqImage {
  object-fit: cover;
  max-width: 150px;
  width: 100%;
}

.accordionItemContent .unorderList,
.orderList {
  margin-left: 16px;
}

.accordionItemContent .unorderList li,
.orderList li {
  list-style-position: outside;
}

.accordionItemContent .step {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  padding-bottom: 16px;
  text-decoration: underline;
}

#faq .backToTopBtn {
  position: fixed;
  bottom: 36px;
  right: 36px;
  z-index: 9;
  cursor: pointer;
  /* display: none; */
}

#faq .backToTopBtn .backToTopBtnCaret {
  height: 50px;
  width: 50px;
  background: linear-gradient(180deg, #f477d6 0%, #e542ac 100%);
  border-radius: 50%;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 0 6px 0 rgba(172, 172, 172, 0.5);
}

#faq .backToTopBtn .backToTopBtnCaret i {
  color: var(--color-white);
  font-size: 16px;
  line-height: 48px;
}

#faq .backToTopBtn p {
  font-size: 14px;
  line-height: 28px;
  font-weight: 500;
  color: #e542ac;
  padding-top: 6px;
  text-shadow: 0 0 6px 0 rgba(172, 172, 172, 0.5);
}

.faqPageTermsCondition {
  max-width: 600px;
  margin: auto;
  padding-bottom: 96px;
}

.faqPageTermsCondition>p {
  font-size: 16px;
  line-height: 28px;
  color: var(--color-text);
  text-align: center;
  padding-bottom: 0 !important;
}

.faqPageTermsCondition .needMoreInfo {
  padding-bottom: 24px !important;
}

.faqPageTermsCondition a {
  color: var(--color-primary);
}

/* accordion end */

/*.happeningPostContentWrapper .colorLine {
width: 40px;
border: 0;
border-top: 3px solid var(--color-border);
margin: 16px 0;
}*/

.happeningPostContentWrapper {
  position: relative;
  width: 100%;
}

div#atrium_events .happeningPostContentWrapper {
  position: relative;
  width: 100%;
}

div#atrium_events .happeningPostTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
  height: 56px;
  margin-bottom: 0;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
}

.happeningPostContainer {
  padding: 24px 16px 0 16px;
}

.promotionPageTypeTabContent .promotionDetailsWrapper,
div.whatsOnContainer .promotionPost .promotionDetailsWrapper {
  position: relative;
  width: 100%;
  height: 276px;
}

.promotionPageTypeTabContent .promotionDetailsContainer,
div.whatsOnContainer .promotionPost .promotionDetailsContainer {
  padding: 24px 16px 0 16px;
  position: absolute;
  top: 0;
  box-sizing: border-box;
  width: 100%;
  height: 50%;
}

.happeningPostImage,
.promotionPageTypeTabContent .promotionPageImg {
  background-size: cover;
  width: 100%;
  height: 360px;
  background-color: var(--color-white);
  background-repeat: no-repeat;
}

.promotionPageTypeTabContent a.promotionTitle {
  color: var(--color-text) !important;
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  max-width: 100%;
  padding-bottom: 0;
  margin-bottom: 8px;
  height: 80px;
  display: block;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: -webkit-box;
}

div#kids_club_offers .promotionPageTypeTabContent a.promotionTitle {
  height: 80px;
  display: block;

}

div#kids_club_offers .promotionPageTypeTabContent .promotionDetailsContainer {
  top: -20px;
}

a.happeningPostTitle,
p.happeningPostTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  height: 80px;
  display: -webkit-box;
  width: 100%;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-bottom: 0;
}

h1.happeningPostTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
}

p.readmore {
  font-size: 14px;
  line-height: 17px;
  letter-spacing: 0.75px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  transform: translateY(-100%);
  padding: 16px;
  text-transform: uppercase;
  color: var(--color-accent);
}

.happeningStoreContainer p.readmore {
  transform: translateY(0%);
}

.readmore i.fas.fa-arrow-right {
  font-size: 15px;
  line-height: 8px;
  padding-left: 6px;
  -webkit-text-stroke: 1px var(--color-white);
}

.readmore a {
  color: var(--color-accent);
}

.promotionPageTypeTabContent .promotionDesc * {
  font-weight: 300;
  font-size: 16px;
  font-size: 16px;
  line-height: 28px;
  font-family: "Rubik", sans-serif;
  font-weight: 300;
}

/*.promotionDesc h2::after {
content: " ...";
}*/

.happeningPostContent,
.pressRoomPostContent,
.promotionPageTypeTabContent .promotionDesc,
.touristPrivilegesCatMenuTabContent .promotionDesc {
  display: -webkit-box;
  max-width: 100%;
  height: 50px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
}

.whatsNewDiv .happeningPostContent {
  display: -webkit-box;
  max-width: 100%;
  height: 60px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
}

.touristPrivilegesCatMenuTabContent .promotionDesc p {
  display: -webkit-box;
  max-width: 100%;
  height: 28px;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
}

.smallHappeningBox:hover .happeningPostContentWrapper .colorLine,
.searchedPostContent:hover .searchedPostDetailsWrapper .colorLine {
  background-color: var(--color-accent);
}

.happeningBox:hover .happeningPostContentWrapper .colorLine,
.promotionPost:hover .promotionDetailsWrapper .colorLine {
  background-color: var(--color-accent);
}

/*Happening Page*/
.singleHappeningPostWrapper {
  width: 100%;
  font-size: 0;
  margin: 40px 0px 133px 0px;
}

.singleHappeningPostImageWrapper {
  vertical-align: top;
  width: calc(26% - 20px);
  display: inline-block;
  margin-right: 40px;
}

.singleHappeningPostImage {
  position: relative;
  padding-top: 100%;
  background-size: cover;
  background-position: center;
}

.singleHappeningPostContentWrapper {
  display: inline-block;
  vertical-align: top;
  width: calc(74% - 20px);
}

.singleHappeningPostTitle {
  padding-bottom: 16px;
  font-family: var(--font-display);
  color: var(--color-text);
  font-size: 28px;
  line-height: 40px;
  font-weight: 700;
  letter-spacing: -0.5px;
  text-transform: capitalize;
}

.singleHappeningPostContent h5,
.singleHappeningPostContent h2 {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.singleMallPromotionPostContentWrapper>b,
strong {
  font-weight: 400;
}

.singleHappeningPostContent * {
  font-family: var(--font-body);
  color: var(--color-text);
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.happeningSinglePostCategories .blackLine {
  margin-bottom: 16px;
}

/*div#white_bg_FunLearningPage .blackLine {
display: none;
}*/

.happeningSinglePostCategories {
  font-size: 14px;
  line-height: 17px;
  color: var(--color-text);
  letter-spacing: 0.75px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  padding-top: 40px;
}

p.happeningCategories {
  background-color: var(--color-border-light);
  padding: 8px 12px;
  display: inline-block;
  margin-right: 16px;
  margin-bottom: 16px;
}

.singleMallPromotionPostContentWrapper table {
  font-family: "Rubik", sans-serif;
  color: var(--color-text);
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.singleMallPromotionPostContent ul,
.singleMallPromotionPostContent ol,
.singleMallPromotionPostContent li {
  font-family: "Rubik", sans-serif;
  color: var(--color-text);
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  margin: 0;
  padding-bottom: 40px;
}

/* The Close Button */
.happening_close {
  color: var(--color-white);
  position: absolute;
  top: 24px;
  right: 0px;
  line-height: 24px;
  font-size: 35px;
  padding: 24px;
}

.happening_close:hover,
.happening_close:focus {
  color: var(--color-black);
  text-decoration: none;
  cursor: pointer;
}

.happening_modal_body {
  padding-left: 15px;
  display: inline-block;
  vertical-align: middle;
}

/*End Happening Single Post*/

/* Edit Profile Start */
.button:focus,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus {
  background: unset;
  outline: none;
  outline-offset: 0;
}

#editProfileForm {
  font-size: 0;
  padding: 8px 0 85px;
}

p.editProfileText {
  font-size: 16px;
  line-height: 28px;
  color: var(--color-text);
  font-weight: 300;
  margin: 0 0 48px;
}

.memberInfoWrapper {
  display: inline-block;
  width: calc(50% - 20px);
  vertical-align: top;
}

.basicInfo {
  margin-right: 40px;
}

.container.editProfileContainer {
  margin-top: 32px;
}

.container.editProfileContainer h3 {
  font-size: 40px;
  font-weight: 300;
  line-height: 64px;
}

.container.editProfileContainer .titleGreyLine {
  height: 1px;
  background-color: var(--color-border);
  margin: 16px 0 24px 0;
}

.enquirySwitchPosition {
  display: unset;
}

.memberInfoWrapper .formSingleField,
#enquiryForm .formSingleField,
#feedbackForm .formSingleField {
  padding-bottom: 40px;
}

.editProfileNotifications .formSingleField {
  padding-bottom: 16px;
}

.memberInfoWrapper .twoColField,
#enquiryForm .twoColField,
#feedbackForm .twoColField {
  display: inline-block;
  width: 50%;
  vertical-align: top;
}

.memberInfoWrapper .twoColField.leftField {
  padding-right: 12px;
}

.memberInfoWrapper .twoColField.rightField {
  padding-left: 12px;
}

.memberInfoWrapper label {
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  padding-bottom: 12px;
  display: block;
}

#enquiryForm label,
#feedbackForm label {
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  padding-bottom: 8px;
  display: block;
}

.memberInfoWrapper span.selectedGender {
  font-family: "Rubik", sans-serif;
  font-size: 16px;
  line-height: 28px;
}

.editProfileNotificationsWrapper input[type="submit"] {
  background-color: var(--color-accent);
  font-size: 14px;
  line-height: 17px;
  font-weight: 400;
  border-radius: 6px;
  border: 0;
  padding: 20px 16px;
  width: 145px;
}

.memberInfoWrapper input,
#enquiryForm input,
#enquiryForm textarea,
#feedbackForm input,
#feedbackForm textarea {
  font-size: 16px;
  line-height: 28px;
  padding: 10px 16px;
  border-radius: 6px;
  width: 100%;
  border: solid 1px var(--color-border);
  font-weight: bold;
}

#enquiryForm input:active,
#enquiryForm input:focus,
#enquiryForm textarea:active,
#enquiryForm textarea:focus,
#feedbackForm input:active,
#feedbackForm input:focus,
#feedbackForm textarea:active,
#feedbackForm textarea:focus {
  border: solid 1px var(--color-accent) !important;
  color: var(--color-text) !important;
}

.mobileNumberField {
  width: calc(70% - 6px) !important;
  margin-left: 6px;
}

.memberInfoWrapper input::placeholder,
#enquiryForm input::placeholder,
#enquiryForm textarea::placeholder,
#feedbackForm input::placeholder,
#feedbackForm textarea::placeholder {
  color: var(--color-muted) !important;
  font-weight: normal;
}

.memberInfoWrapper input[disabled] {
  border-color: var(--color-gray-100);
  background-color: var(--color-gray-100);
  pointer-events: none;
}

.memberInfoWrapper .birthdateField .dropdown button {
  pointer-events: none;
  border-color: var(--color-gray-100);
  background-color: var(--color-gray-100) !important;
}

.memberInfoWrapper .birthdateField,
.newsletterModalContent .birthdateField {
  width: 100%;
  font-size: 0;
}

.memberInfoWrapper .birthdateField>div,
.newsletterModalContent .birthdateField>div {
  display: inline-block;
  position: relative;
}

.memberInfoWrapper .birthdateField .dateSelection,
.yearSelection {
  width: 25%;
}

.memberInfoWrapper .birthdateField .monthSelection {
  width: 50%;
}

.memberInfoWrapper .birthdateField,
.newsletterModalContent .birthdateField {
  width: 100%;
  font-size: 0;
}

.memberInfoWrapper .birthdateField>div,
.newsletterModalContent .birthdateField>div {
  display: inline-block;
  position: relative;
}

.memberInfoWrapper .birthdateField .dateSelection,
.yearSelection {
  width: 25%;
}

.memberInfoWrapper .birthdateField .monthSelection {
  width: 50%;
}

.memberInfoWrapper .birthdateField .dateSelection,
.newsletterModalContent .birthdateField .dateSelection {
  padding-right: 16px;
}

.memberInfoWrapper .birthdateField .yearSelection,
.newsletterModalContent .birthdateField .yearSelection {
  padding-left: 16px;
}

.memberInfoWrapper .vivoDropdownBtn,
#enquiryForm button.dropdown-toggle,
.newsletterModalContent button.dropdown-toggle {
  width: 100%;
  text-align: left;
  font-size: 16px;
  line-height: 28px;
  padding: 10px 16px;
  background-color: var(--color-white) !important;
  font-weight: bold;
}

.memberInfoWrapper .vivoDropdownBtn i,
#enquiryForm button.dropdown-toggle i {
  font-size: 10px;
  float: right;
  line-height: 28px;
}

#enquiryForm .selectionDropdown {
  min-width: 100%;
  margin: 0;
  font-size: 14px;
  padding: 0;
  width: 100%;
  max-height: 400px;
  overflow: auto;
  margin-top: 8px;
  float: none;
  left: auto;
  top: calc(100% + 8px);
  position: absolute;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  z-index: 20;
}

.newsletterModalContent .selectionDropdown {
  min-width: unset;
  margin: 0;
  font-size: 16px;
  padding: 10px 16px;
  width: 100%;
  max-height: 400px;
  overflow: scroll;
}

.memberInfoWrapper .selectionDropdown {
  min-width: unset;
  margin: 0;
  font-size: 16px;
  padding: 0;
  width: 100%;
  max-height: 400px;
  overflow: scroll;
}

.memberInfoWrapper .birthdateField .dateSelection .selectionDropdown,
.newsletterModalContent .birthdateField .dateSelection .selectionDropdown {
  width: calc(100% - 16px);
}

.memberInfoWrapper .birthdateField .yearSelection .selectionDropdown,
.newsletterModalContent .birthdateField .yearSelection .selectionDropdown {
  width: calc(100% - 16px);
  margin-left: 16px;
}

.newsletterModalContent .selectionDropdown li {
  padding-bottom: 4px;
}

#enquiryForm .selectionDropdown li {
  padding: 14px 16px;
  margin: 0;
  cursor: pointer;
  color: var(--color-text);
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  letter-spacing: -0.25px;
}

#enquiryForm .selectionDropdown li:not(:last-child) {
  border-bottom: 1px solid var(--color-border-light);
}

#enquiryForm .selectionDropdown li.selected {
  color: var(--color-accent);
}

.memberInfoWrapper .selectionDropdown li {
  padding: 5px 16px 5px 16px;
  font-weight: 300;
}

.memberInfoWrapper .selectionDropdown li:first-child {
  padding-top: 10px;
  font-weight: 300;
}

.memberInfoWrapper .selectionDropdown li:last-child {
  padding-bottom: 10px;
  font-weight: 300;
}

#enquiryForm .selectionDropdown li:hover {
  background-color: transparent;
  margin: 0;
  padding-left: 16px;
  color: var(--color-text);
}

input.newsletterSubmitBtn:hover {
  background-color: var(--color-accent);
}

.memberInfoWrapper .selectionDropdown li:hover {
  background-color: var(--color-accent);
  color: var(--color-white);
}

.memberInfoWrapper .genderSelection {
  width: 100%;
}

.memberInfoWrapper .mobileField input {
  display: inline-block;
}

.memberInfoWrapper .mobileField .countryCodeSelection {
  width: calc(25% - 16px);
  margin-right: 16px;
}

.memberInfoWrapper .mobileField input[name="member_country_id"] {
  display: none;
}

.dropdown.countryCodeSelection ul {
  width: 300px;
}

.dropdown.countryCodeSelection li span {
  display: inline-block;
  vertical-align: top;
}

.dropdown.countryCodeSelection li .countryCode {
  width: 60px;
}

.dropdown.countryCodeSelection li .countryName {
  width: calc(100% - 65px);
}

.memberInfoWrapper .mobileField input[name="member_mobile_no"] {
  width: calc(100% - 25%);
}

.mobileField i {
  position: unset;
  font-size: 10px;
  margin-left: -41px;
  line-height: 50px;
}

#editProfileForm .errorField {
  color: red;
  font-size: 14px;
  margin: 0;
  padding-top: 8px;
}

/* The container */
.editProfileNotificationsWrapper .checkboxContainer,
#enquiryForm .checkboxContainer,
#feedbackForm .checkboxContainer,
.newsletterModalContent .checkboxContainer {
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 24px;
  width: 24px;
  cursor: pointer;
  border-radius: 4px;
  border: 1px solid var(--color-border-strong);
  padding: 0;
}

.notificationCheckbox {
  padding-bottom: 24px;
}

/* Hide the browser's default checkbox */
.editProfileNotificationsWrapper .checkboxContainer input,
#enquiryForm .formSingleField.checkboxField input,
#feedbackForm .formSingleField.checkboxField input,
.newsletterModalContent input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
  margin: 0;
  appearance: none;
}

.editProfileNotificationsWrapper .notificationCheckbox p {
  margin: 0;
  display: inline-block;
  font-size: 16px;
  color: var(--color-text);
  line-height: 28px;
  vertical-align: top;
  padding-left: 16px;
  width: calc(100% - 24px);
  font-weight: 300;
}

.featurePopupDialogDontShowWrapper p {
  margin: 0;
  display: inline-flex;
  align-items: center;
  padding-left: 0;
  width: auto;
  flex: 1;
  color: var(--color-muted);
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 16px;
}

.checkboxContainer .checkmark i {
  opacity: 0;
  transform: scale(0.6);
  display: block;
  color: var(--color-white);
  transition: var(--transition-base);
}

/* Create a custom checkbox */
.editProfileNotificationsWrapper .checkmark {
  position: absolute;
  top: -1px;
  left: -1px;
  font-size: 12px;
  background-color: transparent;
  color: white;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  padding: 3px 0 0 6px;
  margin-right: -1px;
  border-radius: 4px;
  transition: 0.15s all;
}

#enquiryForm .checkmark,
#feedbackForm .checkmark,
.featurePopupDialogDontShowWrapper .checkmark {
  position: absolute;
  top: -1px;
  left: -1px;
  font-size: 14px;
  background-color: transparent;
  color: white;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  padding: 1px 0 0 5px;
  margin-right: -1px;
  border-radius: 4px;
  transition: 0.15s all;
}

#enquiryForm .consentField .checkboxContainer .checkmark {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

#enquiryForm .consentField .checkboxContainer .checkmark i {
  line-height: 1;
}

.newsletterModalContent .checkmark {
  position: absolute;
  top: -1px;
  left: -1px;
  font-size: 14px;
  background-color: transparent;
  color: white;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  padding: 0px 0 0 6px;
  margin-right: -1px;
  border-radius: 4px;
  transition: 0.15s all;
}

/* When the checkbox is checked, add a blue background */
.editProfileNotificationsWrapper .checkboxContainer input:checked~.checkmark,
#enquiryForm .checkboxContainer input:checked~.checkmark,
#feedbackForm .checkboxContainer input:checked~.checkmark,
.featurePopupDialogDontShowWrapper .checkboxContainer input:checked~.checkmark,
.newsletterModalContent .checkboxContainer input:checked~.checkmark,
.checkBoxFilter {
  background-color: var(--color-accent);
}

.checkboxContainer input:checked~.checkmark i {
  opacity: 1;
  transform: scale(1);
}

.featurePopupDialogDontShowWrapper .checkboxContainer {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border-radius: 8px;
  border: 1px solid var(--color-border);
  position: relative;
  overflow: hidden;
  background: transparent;
}

.featurePopupDialogDontShowWrapper .checkboxContainer input {
  appearance: none;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}

.featurePopupDialogDontShowWrapper .checkmark {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
  background: transparent;
  pointer-events: none;
  transition: background-color var(--transition-base);
}

.featurePopupDialogDontShowWrapper .checkmark i {
  font-size: 16px;
}

.featurePopupDialogDontShowWrapper .checkboxContainer input:checked~.checkmark {
  background-color: var(--color-accent);
  border: 1px solid var(--color-accent);
}

.newsletterModalContent i.fas.fa-check {
  font-weight: 900;
  font-size: unset !important;
  margin-right: unset !important;
  width: unset !important;
  color: var(--color-white) !important;
}

/* Edit Profile End */

/* My Account */
.myAccountContainer {
  font-size: 0;
  padding: 32px 16px 85px !important;
}

.myAccountContainer .halfContainer {
  display: inline-block;
  width: calc(50% - 20px);
  vertical-align: top;
}

.myAccountContainer .halfContainer:first-child {
  margin-right: 40px;
}

.detailsContainer {
  /* padding-bottom: 24px; */
  width: 100%;
}

.detailsContainer.kcDetailsContainer p.title {
  padding-bottom: 8px;
}

.vehicleWrapper {
  padding-top: 28px;
}

.userVehicleContainer {
  width: 50%;
  display: inline-block;
}

.vehicleContainer p.desc {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.vehicleContainer p.title {
  padding-bottom: 16px !important;
}

p.title.kidsClubCard {
  padding-bottom: 20px !important;
}

.myAccountContainer .halfContainer .title {
  font-size: 20px;
  line-height: 32px;
  font-weight: 300;
  padding-bottom: 5px;
}

.vehicleWrapper p.vehicleTitle {
  font-size: 16px;
  line-height: 19px;
  font-weight: 500;
  display: inline-block;
}

.vehicleWrapper p.value {
  color: var(--color-text) !important;
  font-size: 16px !important;
  line-height: 28px !important;
  display: inline-block;
  padding-left: 24px;
}

.detailsContainer.kcDetailsContainer p.value {
  color: var(--color-info) !important;
  font-size: 40px;
  line-height: 47px;
}

.detailsContainer.kcDetailsContainer p.accumulatedSince {
  font-size: 12px;
  line-height: 14px;
  padding-bottom: 32px;
  font-weight: 300;
}

.halfContainer.rewardContainer p.value {
  color: var(--color-accent);
}

.myAccountContainer .halfContainer .value {
  font-size: 40px;
  line-height: 64px;
  font-weight: 300;
  padding-bottom: 8px;
}

.myAccountContainer .halfContainer .description {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.myAccountContainer .membershipContainer .blackLine {
  margin: 24px 0;
}

.myAccountContainer .halfContainer h2 {
  font-size: 40px;
  line-height: 64px;
  font-weight: 300;
  padding-bottom: 16px;
}

.myAccountContainer .tabBtnWrapper {
  padding: 24px 0px;
}

.myAccountContainer .rewardHistoryInfoContainer,
.myAccountContainer .parkingRewardHistoryInfoContainer {
  display: none;
}

.myAccountContainer .swiper-container {
  width: 100%;
  height: 100%;
}

.myAccountContainer .swiper-slide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.myAccountContainer .rewardHistoryButton p,
.myAccountContainer .parkingRewardHistoryButton p {
  font-size: 14px;
  line-height: 17px;
  border: solid 1px var(--color-border-strong);
  display: inline-block;
  border-radius: 25px;
  vertical-align: middle;
  padding: 11px 16px;
  margin-right: 16px;
  transition: all 0.25s;
  cursor: pointer;
  width: auto;
}

.myAccountContainer .rewardHistoryButton p:hover,
.myAccountContainer .parkingRewardHistoryButton p:hover {
  color: white;
  background-color: var(--color-accent);
  border-color: var(--color-accent);
  transition: all 0.25s;
}

.myAccountContainer .rewardHistoryButton p.selected,
.myAccountContainer .parkingRewardHistoryButton p.selected {
  color: white;
  background-color: var(--color-accent);
  border-color: var(--color-accent);
}

.myAccountContainer .rewardHistoryButton,
.myAccountContainer .parkingRewardHistoryButton {
  padding: 24px 0;
}

.myAccountContainer .rewardHistoryDateFilter>*,
.myAccountContainer .parkingRewardHistoryDateFilter>* {
  display: inline-block;
  vertical-align: middle;
}

.myAccountContainer .rewardHistoryDateFilter>p,
.myAccountContainer .parkingRewardHistoryDateFilter>p {
  font-size: 16px;
  line-height: 48px;
  padding-right: 22px;
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection {
  width: calc(100% - 137px);
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection button,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection button {
  line-height: 48px;
  width: 100%;
  padding: 0 16px;
  text-align: left;
  font-size: 16px;
  font-weight: 300;
  border: 1px solid var(--color-border);
  background-color: var(--color-off-white);
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection button i,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection button i {
  float: right;
  padding-top: 17px;
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection .selectionDropdown,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection .selectionDropdown {
  width: 100%;
  margin-top: -1px;
  padding: 0;
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection .selectionDropdown li,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection .selectionDropdown li {
  padding-bottom: 6px;
  cursor: pointer;
  font-weight: 300;
  font-size: 16px;
  line-height: 28px;
  padding-left: 16px;
  padding-top: 5px;
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection .selectionDropdown li:hover,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection .selectionDropdown li:hover {
  background-color: var(--color-accent);
  color: var(--color-white);
  transition: all 0.25s;
}

.myAccountContainer .rewardHistoryDateFilter,
.myAccountContainer .parkingRewardHistoryDateFilter {
  padding-bottom: 40px;
}

.memberAccLoadingBG {
  margin: 40px auto;
  border: 5px solid #f3f3f3;
  animation: spin 1s linear infinite;
  border-top: 5px solid #555;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: none;
}

.transactiondetailsWrapper {
  max-height: 880px;
  overflow: auto;
}

.myAccountContainer .transactionDetail {
  padding: 20px 0 16px 0;
}

#used .transactiondetailsWrapper .transactionDetail:first-child {
  padding-top: 0;
}

.myAccountContainer .transactionDetail table {
  margin: 0;
}

.myAccountContainer .transactionDetail tr:first-child td {
  padding-bottom: 12px;
}

.myAccountContainer .transactionDetail tr:nth-child(2) td {
  font-style: italic;
  font-family: "Barlow", sans-serif;
  line-height: 24px;
}

.myAccountContainer .transactionDetail td,
.transactionDetail tr {
  border: none;
}

.myAccountContainer .transactionDetail td {
  font-size: 16px;
  padding: 0;
}

.myAccountContainer .transactionDetail .shopName {
  font-weight: 500;
}

.myAccountContainer .transactionDetail .type p {
  display: inline-block;
}

.myAccountContainer .transactionDetail tr td:nth-child(2) {
  float: right;
}

.myAccountContainer #credited .rewardType img {
  height: 24px;
}

.myAccountContainer #credited .rewardType {
  font-size: 14px;
  padding: 4px 0 4px 16px;
  border-radius: 4px;
}

.myAccountContainer #credited .point {
  color: #27ae60;
}

.myAccountContainer #declined .point,
.myAccountContainer #used .point {
  color: #ee201c;
}

.myAccountContainer .declinedReason {
  text-align: left;
}

.myAccountContainer .declinedReason td {
  color: #ee201c;
  font-weight: 300;
  padding-top: 12px;
}

.memberInfoWrapper .selectDateBtn:focus,
.memberInfoWrapper .selectDateBtn:hover {
  color: var(--color-text);
  background-color: var(--color-white);
  background-image: none;
  border-color: var(--color-border);
}

.myAccountContainer .rewardHistoryDateFilter .dateSelection button:hover,
.myAccountContainer .parkingRewardHistoryDateFilter .dateSelection button:hover {
  background-color: var(--color-off-white);
  border: 1px solid var(--color-border);
}

.myAccountContainer .progressBarWrapper {
  padding-top: 8px;
  /* padding-bottom: 24px; */
  position: relative;
}

.myAccountContainer .progressBarBase {
  position: absolute;
  width: 100%;
  height: 5px;
  background-color: var(--color-border);
}

.myAccountContainer .progressBarProgress {
  position: absolute;
  height: 4px;
  background-color: #00acd4;
  max-width: 100%;
}

.kidClubMembershipLogo {
  background-image: url("https://d3nse58ioth0yc.cloudfront.net/wp/logo_kidsclub%402x.png");
  margin-bottom: 17px;
  width: 88px;
  height: 23px;
  background-size: contain;
  background-repeat: no-repeat;
}

.kidMembership p {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 400;
  color: var(--color-white);
}

p.kidMembershipName {
  font-size: 20px;
  line-height: 24px;
  font-weight: 500;
  text-transform: uppercase;
}

.kidMembershipBirthDateCard {
  width: 100%;
  font-size: 12px;
  line-height: 14px;
  padding-bottom: 12px;
}

p.kidMembershipBirthDateTitle {
  display: inline-block;
  font-weight: 500;
  padding-right: 4px;
}

p.kidMembershipBirthDate {
  display: inline-block;
  font-weight: 400;
}

.kidMembershipMemberNoCard,
.kidMembershipGraduationDateCard {
  width: 50%;
  font-size: 14px;
  line-height: 17px;
  display: inline-block;
  vertical-align: top;
}

.barcode1 {
  margin-top: 12px;
  padding-right: 12px;
  height: 22px;
  width: 100%;
}

p.kidMembershipMemberNoTitle,
p.kidMembershipGraduationDateTitle {
  text-transform: uppercase;
  font-weight: 500;
  padding-bottom: 4px;
}

p.kidMembershipMemberNo,
p.kidMembershipGraduationDate {
  font-weight: 700;
}

.kidMembership {
  padding: 24px;
  margin-bottom: 24px;
  border-radius: 12px;
  width: 100%;
  max-height: 215px;
  max-width: 343px;
}

.kidMembership[data-kidscard="F"] {
  background-color: #ff82cc;
}

.kidMembership[data-kidscard="M"] {
  background-color: #f9b000;
}

.kidMembership.priviMembership {
  background-image: url("https://d3nse58ioth0yc.cloudfront.net/wp/bg_superbuddy%402x.png");
  width: 100%;
  max-width: 295px;
  transition: all 0.25s;
}

.priviMembership .kidClubMembershipLogo {
  background-image: url("https://d3nse58ioth0yc.cloudfront.net/wp/logo_superbuddy%402x.png");
  margin-bottom: 8px;
  height: 34px;
}

.myAccountContainer .viewRewardCatalogue {
  text-transform: uppercase;
  font-size: 14px;
  line-height: 17px;
  letter-spacing: 0.75px;
  color: var(--color-accent);
  border: solid 2px var(--color-accent);
  border-radius: 6px;
  padding: 16px;
  cursor: pointer;
  display: inline-block;
  margin-top: 24px;
}

/* My Account End */

/*Press Room*/
.pressRoomPostsWrapper,
.funLearningPostsWrapper,
.promotionPageTabBtnWrapper,
.aboutUsTabWrapper,
.touristTabWrapper,
.rewardsPostsWrapper,
.leasingEnquiryPostsWrapper {
  padding-bottom: 40px;
}

.emptyBoxHeader {
  height: 40px;
}

p.tabPressRoomBtn,
p.tabFunLearningBtn,
p.promoPageTabBtn,
p.aboutUsTabBtn,
p.touristTabBtn,
p.tabLeasingEnquiryBtn,
p.tabrewardsBtn,
p.rewardsGuideBtn {
  font-size: 14px;
  line-height: 28px;
  font-weight: 500;
  display: inline-block;
  cursor: pointer;
  color: white !important;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 8px 22px;
  border-radius: 24px;
  transition: 0.3s;
  margin-right: 8px;
}

p.tabPressRoomBtn:hover,
p.tabFunLearningBtn:hover,
p.promoPageTabBtn:hover,
.shoppingGuideWrapper .tabBtn:hover,
p.promoTabBtn:hover,
.letterBtn:hover,
p.aboutUsTabBtn:hover,
p.touristTabBtn:hover,
p.tabLeasingEnquiryBtn:hover,
p.tabrewardsBtn:hover,
p.rewardsGuideBtn:hover {
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
  color: var(--color-white) !important;
  transition: 0.3s;
}

.pressRoomBox {
  width: 100%;
  border-radius: 16px;
  font-size: 0;
  background-color: var(--color-white);
  position: relative;
  overflow: hidden;
}

.pressRoomEnterButton,
.pressKitEnterButton {
  display: none;
  height: 40px;
  width: 40px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
  border-radius: 50%;

  position: absolute;
  right: 24px;
  bottom: 24px;
}

.pressRoomEnterButton img,
.pressKitEnterButton img {
  object-fit: cover;
}

.pressRoomBox:hover {
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.1);
}

.pressRoomBox:hover .colorLine {
  background-color: var(--color-accent);
}

.pressRoomBox>* {
  vertical-align: middle !important;
}

.pressRoomPostImage {
  width: 33.33%;
  display: inline-block;
  padding-top: 33.33%;
  background-size: cover;
  border-radius: 16px 0 0 16px;
}

.pressRoomPostContentWrapper {
  width: calc(66.66% - 24px);
  display: inline-block;
  vertical-align: top;
  padding-left: 24px;
  padding-right: 24px;
}

.pressRoomPostContentWrapper .colorLine,
.guideListContent .colorLine {
  width: 40px !important;
}

p.pressRoomPostDate {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  color: var(--color-text);
  font-weight: 300;
  text-transform: uppercase;
}

p.pressRoomPostTitle {
  color: var(--color-text) !important;
  font-size: 28px;
  line-height: 40px;
  font-family: var(--font-display);
  font-weight: 700;
}

div#press-releases .invisibleLine {
  padding: 32px 0px;
}

div#press-releases .invisibleLine:last-child {
  visibility: hidden;
  padding: 0 0 32px 0;
}

.selectedPressRoomYear {
  border-left: 3px solid var(--color-accent);
  padding-left: 13px !important;
  color: var(--color-accent);
}

.yearBtnWrapper {
  padding-bottom: 16px;
  border-left: 1px solid var(--color-border);
}

.yearBtnWrapper:last-child {
  padding-bottom: 0px;
}

p.yearBtn {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding-left: 16px;

  cursor: pointer;
  /* border-left: 1px solid var(--color-border); */
}

div#press-releases {
  padding: 64px 0 24px 0;
}

h1.attachementTitle {
  font-size: 24px;
  line-height: 28px;
  padding-top: 31px;
  padding-bottom: 30px;
}

/*End Press Room*/

/*Press News Content*/
.pressNewsHeaderContainer {
  max-width: 776px !important;
  width: 100%;
  margin: auto;
  padding: 0 16px !important;
  margin-bottom: 80px;
}

.pressNewsBackButton {
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--color-text) !important;
}

.pressNewsBackButton img {
  width: 24px;
}

.pressNewsBackButton:hover {
  color: var(--color-accent) !important;
}

.pressNewsContentContainer {
  max-width: 968px !important;
  width: 100%;
  margin: auto;
  padding: 80px 16px 120px 16px;
}

.pressNewsContent p,
.pressNewsContent li,
.pressNewsContent table {
  max-width: 776px !important;
  width: 100%;
  margin: auto;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

.pressNewsContent table {
  border-collapse: collapse;
}

.pressNewsContent td,
.pressNewsContent th {
  border: 1px solid var(--color-border-light);
  border-left: 0;
  border-right: 0;
  padding: 16px;
}

.pressNewsContent tr:first-child th,
.pressNewsContent tr:first-child td {
  border-top: 0;
}

.pressNewsContent tr:last-child td {
  border-bottom: 0;
}

.pressNewsContent img {
  border-radius: 16px;
}

.pressNewsContent a {
  color: var(--color-highlight);
}

.pressNewsContent h5 {
  max-width: 776px !important;
  width: 100%;
  margin: auto;
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding: 0 16px 24px 16px;
}

.pressNewsContent p,
.pressNewsContent li {
  padding: 0 16px 40px 16px;
}

.pressNewsContent p:last-child,
.pressNewsContent li:last-child {
  padding: 0 16px;
}

.pressNewsContent .pressImageContainer {
  padding-bottom: 64px;
}

.pressImage {
  max-width: 968px !important;
  padding: 0 16px;
}

.pressImage img {
  border-radius: 16px;
  object-fit: contain;
}

.pressCaption {
  padding: 24px 16px 0 16px !important;
  font-size: 14px;
  line-height: 24px;
  color: var(--color-muted);
}

/*End Press News Content*/

/*Media Kit*/
i.far.fa-file-pdf {
  display: inline-block;
  font-size: 56px;
  color: var(--color-accent);
  border-right: solid 1px var(--color-border);
  height: 100%;
  padding: 42px 52px;
  vertical-align: middle;
}

.pdfDesc {
  display: inline-block;
  padding-left: 18px;
  vertical-align: middle;
  max-width: calc(100% - 130px);
}

.mediaKitWrapper {
  width: 100%;
  font-size: 0;
}

p.happeningPdfFileSize {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 0;
}

p.singlePDF {
  display: inline-block;
  font-size: 22px;
  font-weight: 400;
  line-height: 27px;
  vertical-align: unset;
  padding-left: 0;
  padding-bottom: 8px;
}

p.pressRoom_singlePDF {
  font-family: var(--font-display);
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  vertical-align: unset;
  letter-spacing: -0.25px;
}

p.pressRoom_pdfFileSize {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding-bottom: 0;
  font-weight: 300;
}

.pressRoom_iconWrapper {
  display: inline-block;
  vertical-align: middle;
}

.pressRoom_pdfWrapper {
  display: inline-block;
  padding-left: 25px;
  vertical-align: middle;
}

a.mediaKitLinkWrapper {
  /* width: calc(50% - 20px); */
  width: 100%;
  display: inline-block;
  background-color: var(--color-white);
  border-radius: 16px;
  position: relative;
  overflow: hidden;
}

a.mediaKitLinkWrapper:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
}

a.mediaKitLinkWrapper {
  margin-bottom: 40px;
}

a.mediaKitLinkWrapper:last-child {
  margin-bottom: 0;
}

div#media-kit {
  padding-top: 64px;
  padding-bottom: 120px;
}

/*End Media Kit*/

/*Fun & Learning*/

.funLearning {
  max-width: 968px !important;
  padding: 0 16px;
  margin: auto;
}

.funLearningImageWrapper {
  box-sizing: content-box;
  width: 40%;
  border-radius: 16px;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

.funLearningContentWrapper {
  width: 60%;
}

.funLearningImageWrapper,
.funLearningContentWrapper {
  display: inline-block;
  vertical-align: middle;
}

.funLearningImg,
.priviligeCardImage {
  background-size: contain;
  padding-top: 100%;
  background-repeat: no-repeat;
  width: 100%;
  background-position: center;
}

.kidsClubWrapper,
.playWrapper,
.publicLibraryWrapper {
  padding-top: 64px;
  padding-bottom: 120px;
}

.kidsClubWrapper .blackLine,
.playWrapper .blackLine {
  margin-top: 64px;
  margin-bottom: 64px;
}

.funLearningSignupRow {
  display: table;
  border-collapse: separate;
  border-spacing: 8px;
}

.funLearningSignupHeader h1 {
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.5px;
  padding-bottom: 32px;
}

.funLearningSignupImageWrapper,
.funLearningSignupImageMobileWrapper {
  font-size: 0;
}

.funLearningSignupImageWrapper,
.funLearningSignupImageMobileWrapper {
  display: table-row;
  table-layout: fixed;
}

.funLearningSignupContainer {
  vertical-align: top;
  display: table-cell;
  width: calc(100% / 3);
  text-align: center;
  padding: 0 8px;

  border: 1px solid var(--color-border-light);
  border-radius: 16px;
}

.funLearningSignupInnerContainer {
  padding: 8px 16px 24px 16px !important;
}

.funLearningSignupImage {
  background-size: contain;
  padding-top: 100%;
  background-repeat: no-repeat;
  width: 100%;
  background-position: center;
}

.funLearningSignupContainer p {
  font-size: 16px;
}

.funLearningSignupCircleIcon {
  height: 32px;
  width: 32px;
  background-color: #285ac8;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.funLearningSignupCircleIcon p {
  font-family: var(--font-display);
  color: var(--color-white);
  font-size: 16px;
  font-weight: 700;
  line-height: 22.4px;
  letter-spacing: -0.4px;
}

.funLearningSignupDesc {
  padding-top: 8px;
}

.funLearningLeftImageRow,
.funLearningRightImageRow {
  font-size: 0 !important;
}

.funLearningLeftImageRow .funLearningContentWrapper {
  padding-left: 24px;
}

.funLearningRightImageRow .funLearningContentWrapper {
  padding-right: 24px;
}

.funLearningContentWrapper h1 {
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.5px;
  font-weight: 700;
  padding-bottom: 24px;
}

.funLearningDesc,
.funLearningDesc>p {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 28px;
  color: var(--color-text);
  letter-spacing: -0.25px;
  /* white-space: pre-wrap; */
}

.kidsClubTermsCondition {
  font-size: 16px;
  line-height: 24px;
  color: var(--color-text);
}

.noticetag {
  color: var(--color-danger);
  font-weight: 500;
  font-size: 17px;
  line-height: 28px;
  padding-bottom: 16px;
}

.kidsClubTermsCondition ul {
  padding: 24px 0;
}

.kidsClubTermsCondition li {
  list-style-position: inside;
}

.kidsClubTermsCondition h3 {
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-family: var(--font-display);
  font-weight: 700;
  padding-bottom: 16px;
}

.kidsClubTermsCondition>p {
  font-size: 16px;
  line-height: 24px;
  color: var(--color-text);
  padding: 0 !important;
}

.kidsClubTermsCondition>p:first-child {
  padding-bottom: 16px !important;
}

.singleMallPromotionTermsCondition>p {
  font-style: italic;
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: var(--color-text);
  text-align: center;
  padding: 24px 0 19px 0;
}

.promotionPageTermsCondition p {
  font-style: italic;
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 24px;
  height: 100%;
  color: var(--color-text);
  text-align: center;
  padding: 24px 0 19px 0;
}

.storePromotionPageTermsCondition>p {
  font-style: italic;
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: var(--color-text);
  text-align: center;
  font-weight: 400;
  padding: 24px 0 19px 0;
}

.kidsClubTermsCondition a,
.singleMallPromotionTermsCondition a,
.promotionPageTermsCondition a,
.rewardsPageTermsCondition a,
.storePromotionPageTermsCondition a {
  color: var(--color-primary);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

.funLearningDesc.seperate {
  padding-bottom: 16px;
}

.funLearningDesc.seperate:last-child {
  padding-bottom: 0;
}

.funLearningDesc.seperate a {
  color: var(--color-primary);
}

.funLearningDesc.fontItalic {
  font-style: italic;
  line-height: 24px;
}

.infoColumn.contact>p>a {
  color: var(--color-primary);
}

.infoColumn.address>p,
.infoColumn.openingHours>p,
.infoColumn.contact>p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.infoWrapper {
  font-size: 0;
  background-color: rgba(220, 220, 220, 0.3);
  width: 100vw;
  position: relative;
  margin-left: -50vw;
  left: 50%;
}

.infoContainer {
  display: flex;
}

.infoColumn {
  width: 100%;
  vertical-align: top;
  margin: 40px 0;
  border-left: 1px solid var(--color-border-light);
}

#kids_club_events {
  padding-top: 40px;
  padding-bottom: 64px;
}

/*End Fun & Learning*/

/* Tourist Page */

#tourist_page {
  max-width: 968px !important;
  padding: 0 16px;
  margin: auto;
}

#tourist_page .dropdownBtnText i {
  padding-left: 12px;
}

#tourist_page .dropdownTabBtn .dropdownBtnText,
.touristTabWrapper a {
  color: var(--color-text);
  box-shadow: none;
  background: none;
  border: none;
  font-size: 22px;
  line-height: 27px;
  font-weight: 300;
  padding: 0;
  vertical-align: top;
}

.touristTabWrapper a {
  padding-right: 40px;
}

#tourist_page .dropdownTabBtn.active .dropdownBtnText {
  color: var(--color-accent) !important;
}

li.touristAboutVcSelection.selectedTouristTab {
  color: var(--color-accent);
}

li.touristAboutVcSelection:first-child {
  padding-bottom: 8px;
}

.wifiConnectDesc p {
  padding-bottom: 0px;
}

#tourist_page .servicesSection .blackLine,
#tourist_page .aboutVivocitySection .blackLine {
  margin-top: 64px;
}

#tourist_page .touristAboutVcDropdown {
  max-height: 0;
  transition: max-height 0.25s;
  overflow: hidden;
  position: absolute;
  z-index: 99;
  background-color: var(--color-white);
  margin-top: 16px;
  border-radius: 4px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

#tourist_page .dropdownTabBtn:hover .touristAboutVcDropdown {
  max-height: 200px;
}

#tourist_page .touristAboutVcDropdown ul {
  list-style-type: none;
  padding: 0;
  font-size: 16px;
  font-weight: 300;
  margin: 0;
}

li.touristAboutVcSelection {
  padding: 16px;
}

#tourist_page .touristAboutVcDropdown li:hover {
  background-color: var(--color-accent);
  color: var(--color-white);
}

.rowContent {
  font-size: 0;
  padding-bottom: 64px;
}

.rowContent:last-child {
  padding-bottom: 0;
}

.rowContent>div {
  width: 100%;
}

.rowContent>div:first-child {
  margin-right: 40px;
}

.imageColMapletree {
  position: relative;
  padding-top: 280px;
  width: 100%;
  max-width: 240px;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center;
  display: inline-block;
}

.textColMapleTree {
  width: calc(100% - 240px - 40px) !important;
  padding: 40px 16px !important;
  display: inline-block;
}

#services .imageCol {
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}

#services .descCol {
  vertical-align: middle;
}

#getting-to-sentosa .imageCol {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

#getting-to-sentosa .descCol {
  vertical-align: middle;
}

.imageCol.retailMeetsArchitectureImg {
  background-size: cover;
}

.imageCol {
  border-radius: 16px;
  position: relative;
  padding-top: calc(50% - 20px);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.retailMeetsArchitectureText {
  padding: 0px 16px 64px 16px !important;
}

.aboutMapleTreeContainer {
  padding-bottom: 0 !important;
}

.descCol .descTitle {
  font-size: 28px;
  line-height: 40px;
  font-weight: 700;
  padding-bottom: 24px;
  font-family: var(--font-display);
}

.intArtTextCol .descTitle {
  padding-bottom: 16px;
}

p.aboutMapleTreeDesc {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  color: var(--color-text);
  font-weight: 700;
  padding-bottom: 16px;
}

.descCol .descContent {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  color: var(--color-text);
  /* white-space: pre-wrap; */
  /* white-space: pre-line; */
}

.descCol .descContent a {
  color: var(--color-highlight);
}

.descCol .desingerName {
  font-size: 16px;
  line-height: 24px;
  padding-bottom: 16px;
  color: var(--color-muted);
}

.designConcept {
  padding: 32px 0;
}

.designConcept img {
  display: inline-block;
  width: 200px;
  padding-right: 40px;
  box-sizing: content-box;
}

.designConceptDesc {
  display: inline-block;
  width: calc(100% - 240px);
  vertical-align: top;
}

.designConceptDesc p {
  font-size: 14px;
  line-height: 24px;
  padding-bottom: 32px;
  font-weight: 500;
  color: var(--color-muted) !important;
}

.touristAboutInfoContainer .rowContent>div {
  vertical-align: middle;
}

.wifiContent p {
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  /* padding-bottom: 16px; */
}

.wifiContent p span {
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
}

.wifiContent .freeWifiTouristDesc h4 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding-bottom: 16px;
}

.freeWifiTouristDesc p {
  padding-bottom: 24px;
}

.freeWifiTouristDesc p span {
  font-weight: 700;
}

.freeWifiTouristDesc p:last-child {
  padding-bottom: 0;
}

.freeWifiStepContainer {
  padding-top: 32px;
  padding-bottom: 40px;
}

.freeWifiStepContent {
  display: flex;
  align-items: flex-start;
}

.freeWifiStepCircleWrapper,
.freeWifiStepWrapper p {
  display: inline-block;
}

.freeWifiStepWrapper {
  position: relative;
  padding-bottom: 40px;
}

.freeWifiStepWrapper:last-child {
  padding-bottom: 0;
}

.freeWifiStepCircleWrapper {
  padding-right: 32px;
}

.dottedLineWrapper {
  width: 40px;
  position: absolute;
  top: 40px;
  bottom: 0;
  left: 0;
}

.dottedLineWrapper .dottedLine {
  width: 1.5px;
  height: 100%;
  background-image: linear-gradient(180deg,
      transparent,
      transparent 50%,
      var(--color-white) 50%,
      var(--color-white) 100%),
    linear-gradient(180deg, var(--color-indigo), var(--color-indigo), var(--color-indigo), var(--color-indigo), var(--color-indigo));
  background-size: 6px 6px, 6px 6px;

  border: none;

  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: auto;
  margin-right: auto;
}

.freeWifiStepCircle {
  height: 40px;
  width: 40px;
  background-color: var(--color-accent);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.freeWifiStepCircle span {
  font-family: var(--font-display);
  color: var(--color-white);
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: -0.5px;
}

.serviceLocationWrapper {
  padding-bottom: 32px;
}

.serviceLocationWrapper:last-child {
  padding-bottom: 0;
}

.serviceLocationCricleWrapper,
.serviceLocationTextWrapper,
.playLocationCricleWrapper,
.playLocationTextWrapper {
  display: inline-block;
  vertical-align: middle;
}

.serviceLocationTextWrapper,
.playLocationTextWrapper {
  padding-left: 16px;
}

.serviceLocationCricleWrapper img,
.playLocationCricleWrapper img {
  width: 40px;
  height: 40px;
  object-fit: cover;
}

.wifiContent p a {
  color: var(--color-primary);
}

.descCol .wifiContent {
  white-space: unset;
}

/* Tourist Page End */

/* About Us Page */

.arrowIndicator,
.aboutUsAwardMobileArrow {
  display: none;
}

.bcaWrapper {
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
}

.gettingHereTitle {
  font-weight: 700;
}

img.typeGettingHere {
  background-color: #9dd6b3;
}

img.typeServices {
  background-color: #a9d2fe;
}

img.bcaImg {
  width: 160px;
  padding-left: 40px;
  padding-right: 40px;
  display: inline-block;
  vertical-align: middle;
}

.bcaText {
  padding: 44px 24px;
  border-left: 1px solid var(--color-border-light);
  width: calc(100% - 160px);
  display: inline-block;
  vertical-align: middle;
  color: var(--color-text);
  font-size: 14px;
  line-height: 24px;
}

.bcaText>span {
  font-weight: 700;
}

.aboutUsAward {
  background-color: var(--color-off-white);
  position: relative;
}

#about_us_page div {
  font-family: var(--font-body);
}

.descCol.aboutMapleTree,
.imageColMapletree.aboutMapleTree {
  /* vertical-align: middle; */
  vertical-align: top;
}

div#enquiry h2 {
  padding-bottom: 16px;
}

#about_us_page h2 {
  font-size: 40px;
  line-height: 64px;
  font-weight: 300;
  padding-bottom: 24px;
}

div#about-vivocity h2.awardsSectionTitle {
  font-size: 56px !important;
  line-height: 66px !important;
  font-weight: 300 !important;
  padding-bottom: 16px !important;
  padding-top: 40px !important;
}

p.awardsSectionSubtitle {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
  padding-bottom: 67px;
}

#about_us_page .tabBtnWrapper {
  padding: 40px 16px !important;
}

#about_us_page .mallDetailsWrapper {
  background-color: var(--color-gray-100);
  display: table;
  width: 100%;
  padding: 40px 0;
}

p.enquiryDesc {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding-bottom: 40px;
}

p.enquiryDesc.bold {
  font-weight: bold;
}

p.enquiryDesc.stars {
  text-align: center;
}

#about_us_page .transportationWrapper,
#about_us_page .aboutUsInfoContainer {
  font-size: 0;
}

#about_us_page .visibilityHidden {
  height: 0;
  visibility: hidden;
  padding: 0 !important;
  margin: 0;
  content-visibility: hidden;
}

#about_us_page .mallDetails {
  width: 100%;
  border-left: 1px solid var(--color-border-light);
}

.mallDetailsContainer {
  display: flex;
}

#about_us_page .mallDetails,
#public-library .infoColumn {
  position: relative;
}

.aboutVivoCityContainer {
  padding: 64px 16px !important;
}

#about_us_page .mallDetailsTitle,
#public-library .infoColumn h1 {
  border-left: 3px solid var(--color-accent);
  padding-left: 24px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  letter-spacing: -0.25px;
}

#about_us_page .mallDetailsVal,
#public-library .infoColumn p {
  padding-left: 27px;
  padding-right: 28px;
  font-size: 14px;
  line-height: 24px;
}

#about_us_page .serviceCol,
#about-vivocity .leisureCol,
#about-vivocity .intArtCol,
.touristAboutWrapper {
  max-width: 968px !important;
  padding: 0 16px;
  margin: auto;
}

#getting-to-sentosa .sentosaCol ol li {
  padding-bottom: 32px;
}

#getting-to-sentosa .sentosaCol ol li:last-child {
  padding-bottom: 32px;
}

#about_us_page .servicesSection .blackLine {
  margin-top: 64px;
}

.serviceTextCol,
.serviceImgCol,
.serviceHalfCol,
.leisureTextCol,
.leisureImgCol,
.intArtTextCol,
.intArtImgCol,
.sentosaTextCol,
.sentosaImageCol {
  display: inline-block;
}

.seasonParkingWrapper .blackLine {
  margin: 32px 0;
}

.seasonParkingWrapper .blackLine:last-child {
  margin: 32px 0 0 0;
}

.serviceTextColLeft,
.leisureTextColLeft,
.intArtTextColLeft {
  padding-right: 24px;
}

.serviceTextColRight,
.leisureTextColRight,
.intArtTextColRight {
  padding-left: 24px;
}

.serviceHalfCol {
  vertical-align: top;
  width: 50%;
}

.serviceHalfCol:first-child {
  padding-right: 12px;
}

.serviceHalfCol:last-child {
  padding-left: 12px;
}

.serviceTextCol,
.leisureTextCol,
.intArtTextCol,
.sentosaTextCol {
  vertical-align: middle;
  width: 60%;
}

.serviceImgCol,
.leisureImgCol,
.intArtImgCol,
.sentosaImageCol {
  width: 40%;
  border-radius: 16px;
  position: relative;
  padding-top: 40%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

#about_us_page .vcMap {
  padding-bottom: 80px;
}

#about_us_page .vcMap .wpgmza_map {
  border-radius: 16px;
}

#about_us_page .vcMap>* {
  float: unset !important;
}

#about_us_page .transportationWrapper {
  padding-bottom: 120px;
}

#about_us_page .parkingRateWrapper {
  padding-bottom: 120px;
}

#about_us_page .transportHeader,
#about_us_page .parkingRateHeader,
#about_us_page .parkingRateText,
#about_us_page .seasonParkingHeader {
  padding-bottom: 32px;
}

#about_us_page .parkingRateApplyText {
  padding-top: 24px;
}

#about_us_page .parkingRateText p,
#about_us_page .parkingRateApplyText p {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

#about_us_page .transportHeaderTitle,
#about_us_page .parkingRateHeaderTitle,
#about_us_page .seasonParkingHeaderTitle,
#about_us_page .valetParkingWrapper h3 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.25px;
}

#about_us_page .transportDesc .transportTextContainer {
  padding-bottom: 80px;
}

#about_us_page .transportDesc:last-child .transportTextContainer {
  padding-bottom: 0;
}

#about_us_page .transportDesc {
  display: table;
  table-layout: fixed;
  width: 100%;
}

#about_us_page .transportTypeContainer {
  display: table-row;
}

.transportIconContainer,
.transportTextHeaderContainer,
.transportLineContainer,
.transportTextContainer {
  display: table-cell;
}

.transportIconContainer {
  width: 40px !important;
  padding-right: 32px;
  box-sizing: content-box;
}

.transportIconContainer img {
  width: 40px;
  height: 40px;
  object-fit: cover;
}

#about_us_page .transportIconContainer,
#about_us_page .transportTextHeaderContainer {
  vertical-align: middle;
}

#about_us_page .transportLineContainer {
  vertical-align: top;
  position: relative;
}

#about_us_page .transportLineContainer .dottedLine {
  box-sizing: border-box;
  width: 2px;
  background-image: linear-gradient(1800deg,
      transparent,
      transparent 50%,
      var(--color-white) 50%,
      var(--color-white) 100%),
    linear-gradient(180deg, var(--color-indigo), var(--color-indigo), var(--color-indigo), var(--color-indigo), var(--color-indigo));
  background-size: 3px 3px, 3px 3px;

  border: none;
  margin: 0 19px !important;
  position: absolute;
  top: 0px;
  bottom: 0px;
}

#about_us_page .transportTextHeaderTitle {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

#about_us_page .transportTitle {
  padding-bottom: 16px;
}

#about_us_page .transportTitle>* {
  display: inline-block;
  vertical-align: middle;
}

#about_us_page .transportTitle img {
  height: 40px;
}

#about_us_page .transportTitle h3 {
  font-weight: 400;
  font-size: 22px;
  padding-left: 16px;
  line-height: 27px;
}

#about_us_page .transportDesc .tabBtnWrapper {
  padding: 32px 0 !important;
}

#about_us_page .aboutUsByCarInfoContainer>div,
.parkingRateWrapper .descContent,
.transportTextContainer .descContent {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

.parkingRateWrapper .descContent {
  padding-bottom: 32px;
}

#about_us_page .aboutUsByCarInfoContainer .byCarDesc {
  white-space: pre-line;
}

#about_us_page .parkingTypeTabWrapper {
  padding: 0 0 32px 0 !important;
}

#about_us_page .parkingTypeInfoContainer table {
  margin: 0 !important;
}

#about_us_page .parkingTypeInfoContainer th {
  border: none;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 700;
  padding-bottom: 12px;
  vertical-align: top;
  text-align: left;
}

#about_us_page .parkingTypeInfoContainer th:first-child,
.parkingTypeInfoContainer td:first-child {
  width: 20%;
}

#about_us_page .parkingTypeInfoContainer th:last-child,
.parkingTypeInfoContainer td:last-child {
  width: 50%;
}

#about_us_page .parkingTypeInfoContainer td {
  border: none;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding: 16px 24px 16px 0;
  vertical-align: top;
  word-break: break-word;
}

#about_us_page .parkingTypeInfoContainer tr {
  border-bottom: solid 1px var(--color-border);
}

#about_us_page .parkingTypeInfoContainer tr:last-child {
  border: none;
}

#about_us_page .transportationWrapper .descContent {
  padding-top: 16px;
}

.valetParkingWrapper {
  padding-top: 120px;
}

#about_us_page .seasonParkingContainer h3 {
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
  padding-bottom: 16px;
  letter-spacing: -0.25px;
}

#about_us_page .seasonParkingContainer p,
#about_us_page .valetParkingWrapper p {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

p.seasonParkingCaption {
  font-size: 12px !important;
  line-height: 20px !important;
  color: var(--color-muted);
  padding-top: 24px;
}

#about_us_page .seasonParkingContainer p a {
  color: var(--color-primary);
}

#about_us_page .seasonParkingContainer:last-child {
  padding-bottom: 56px;
}

#about_us_page .giftVoucherDesc {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 700;
  padding-bottom: 16px;
}

#about_us_page .giftVouvherParticipatingLink {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
  padding-top: 24px;
}

#about_us_page #join-us p {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 32px;
}

/* #about_us_page #join-us .JobDesc {
padding-bottom: 16px;
} */

.JobLift>p {
  color: var(--color-info);
}

.touristInfoContainer,
.rewardsCatWrapper {
  margin-bottom: -21px;
}

div#enquiry,
div#services,
.touristInfoContainer#about-vivocity,
div#getting-to-sentosa,
div#getting-here {
  padding: 64px 0 120px 0 !important;
}

div#join-us {
  padding: 64px 0 104px 0 !important;
}

.JobLift ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#about_us_page .JobLift li a {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  color: var(--color-highlight);
}

#aboutUsTimelineWrapper {
  position: relative;
  padding-top: 120px;
}

.aboutUsTimeline {
  position: relative;
  width: 6000px;
}

.aboutUsTimeline .oneYear {
  display: inline-block;
  position: relative;
}

.active .aboutUsTimelineYearName {
  color: var(--color-text);
}

.aboutUsTimelineYearName {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 48px;
  line-height: 48px;
  letter-spacing: -1px;
  right: -120px;
  position: absolute;
  width: 250px;
  z-index: 3;
  text-align: center;
  color: var(--color-border-strong);
  cursor: pointer;
}

.aboutUsTimelineYearLine {
  padding-top: 68px;
}

.aboutUsTimelineYearLine>* {
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

.aboutUsTimelineYearLine .line {
  background-color: var(--color-accent);
  height: 12px;
  width: 285px;
}

.oneYear:last-child .aboutUsTimelineYearLine .line {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.aboutUsTimelineYearLine .dot {
  width: 8px;
  height: 8px;
  background-color: var(--color-white);
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  right: 1.8px;
  bottom: 1.8px;
  z-index: 10;
}

.active .aboutUsTimelineYearLine .dot {
  width: 24px;
  height: 24px;
  background-color: var(--color-white);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  right: -6px;
  bottom: -6px;
  z-index: 10;
}

.active .aboutUsTimelineYearLine .dot .dotInner {
  width: 12px;
  height: 12px;
  border: 2px solid var(--color-accent);
  border-radius: 50%;

  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
}

.awardDetailsWrapper .yearAwards {
  padding: 64px 0 120px 0;
  box-sizing: border-box;
  display: none;
}

.awardDetailsWrapper .awardDetails {
  max-width: 776px !important;
  margin: auto;
}

.awardDetailsWrapper .awardName {
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: 700;
}

.awardDetailsWrapper .awardDesc {
  font-size: 16px;
  line-height: 28px;
}

.awardDetailsWrapper .awardDetails:not(:last-child) .separateLine {
  margin: 32px 0;
  border: 1px solid var(--color-border);
}

.awardDetailsWrapper .colorLine {
  background-color: var(--color-accent);
  width: 40px;
}

.awardDetails .blackLine {
  margin: 50px auto;
}

.awardDetails:last-child .blackLine {
  display: none;
}

#enquiryForm .twoColField.leftField,
#feedbackForm .twoColField.leftField {
  padding-right: 12px;
}

#enquiryForm .twoColField.rightField,
#feedbackForm .twoColField.rightField {
  padding-right: 12px;
  padding-left: 0;
}

#enquiryForm .enquiryTypeSelection,
#enquiryForm .categoryTypeSelection {
  width: 100%;
}

#enquiryForm .mobileCountryTypeSelection {
  width: calc(30% - 6px);
  margin-right: 6px;
}

#enquiryForm .postCodeField,
#feedbackForm .postCodeField,
#feedbackForm .datetimeVisitField {
  max-width: 225px;
}

#enquiryForm textarea,
#feedbackForm textarea {
  min-height: 144px;
}

#enquiryForm .enquiriesCommentField {
  padding: 0;
}

#enquiryForm .blackLine,
#feedbackForm .blackLine {
  margin: 64px 0;
}

#enquiryForm .pdpaDesc,
#feedbackForm .pdpaDesc {
  padding-bottom: 32px;
}

#enquiryForm .pdpaDesc p,
#feedbackForm .pdpaDesc p {
  padding-bottom: 32px;
}

#enquiryForm .pdpaDesc p:last-child,
#feedbackForm .pdpaDesc p:last-child {
  padding-bottom: 0px;
}

#enquiryForm .privacyDescContainer *,
#feedbackForm .privacyDescContainer * {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
  margin: 0;
}

a.linkEnquiry,
a.contactNumEnquiry,
a.linkFeedback,
a.contactNumFeedback {
  color: var(--color-primary);
}

#enquiryForm .privacyDescContainer h3,
#feedbackForm .privacyDescContainer h3 {
  padding-bottom: 16px;
  font-weight: 600;
}

#enquiryForm .privacyDesc p,
#feedbackForm .privacyDesc p {
  padding-bottom: 32px;
}

#enquiryForm .formSingleField.checkboxField,
#feedbackForm .formSingleField.checkboxField {
  padding-bottom: 32px;
}

#enquiryForm .formSingleField.checkboxField p,
#feedbackForm .formSingleField.checkboxField p {
  margin: 0;
  display: inline-block;
  font-size: 16px;
  color: var(--color-text);
  line-height: 28px;
  vertical-align: top;
  padding-left: 24px;
  width: calc(100% - 24px);
  font-weight: 300;
}

#enquiryForm .formSingleField.checkboxField a,
#feedbackForm .formSingleField.checkboxField a {
  color: var(--color-primary);
}

.recaptchaWrapper {
  padding-bottom: 64px;
}

#enquiryForm input[type="submit"] {
  border-radius: 28px;
  width: auto;
  padding: 10px 24px;
  border: none;
  background-color: var(--color-black);
  opacity: 0.5;
  color: white !important;
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
}

/*Leasing Enquiry*/
.retailSpaceWrapper,
.eventSpaceWrapper,
.mediaPanelsWrapper,
.pushCartWrapper {
  border-radius: 16px;
  vertical-align: middle;
  position: relative;
}

div#retail-space,
div#event-space,
div#media-panels,
div#pushcarts {
  padding: 64px 0;
}

div#retail-space .swiper-container.retail-space_swiper {
  width: 100%;
  overflow: hidden !important;
}

div#retail-space .swiper-slide {
  text-align: center;
  font-size: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

/* div#retail-space .swiper-pagination.retail-space_swiper_pagination {
position: unset!important;
-webkit-transition: .3s opacity;
-o-transition: .3s opacity;
transition: .3s opacity;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
z-index: 10;
} */

div#retail-space .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: var(--color-border) !important;
  opacity: unset !important;
}

div#retail-space .swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--color-accent) !important;
}

.leasingEnquirySwipperImg,
.mediaPanelImage,
.pushCartImage {
  width: 100%;
  height: 526px;
  border-radius: 16px;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  background-position: center;
}

div#retail-space .swiper-pagination.retail-space_swiper_pagination.swiper-pagination-clickable.swiper-pagination-bullets>span.swiper-pagination-bullet:not(:last-of-type) {
  margin-right: 16px;
}

div#retail-space .swiper-pagination.retail-space_swiper_pagination.swiper-pagination-clickable.swiper-pagination-bullets>span.swiper-pagination-bullet:focus {
  outline: 0px !important;
}

div#retail-space .swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

div#event-space .swiper-container {
  width: 100%;
  overflow: hidden !important;
}

div#event-space .swiper-slide {
  text-align: center;
  font-size: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

div#event-space .swiper-pagination {
  position: absolute !important;
  left: 0;
  right: 0;
  bottom: 24px !important;
  -webkit-transition: 0.3s opacity;
  -o-transition: 0.3s opacity;
  transition: 0.3s opacity;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

div#event-space .swiper-pagination-bullet {
  width: 80px;
  height: 6px;
  display: inline-block;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.25) !important;
  opacity: unset !important;
}

div#event-space .swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--color-accent) !important;
}

.retailSpaceWrapper .swiper-button-prev.swiper-button-disabled i.fas.fa-arrow-left,
.retailSpaceWrapper .swiper-button-next.swiper-button-disabled i.fas.fa-arrow-right,
.eventSpaceWrapper .swiper-button-prev.swiper-button-disabled i.fas.fa-arrow-left,
.eventSpaceWrapper .swiper-button-next.swiper-button-disabled i.fas.fa-arrow-right,
.headerImage.homepageHeader .swiper-button-prev.swiper-button-disabled i.fas.fa-arrow-left,
.headerImage.homepageHeader .swiper-button-next.swiper-button-disabled i.fas.fa-arrow-right {
  display: block;
  -webkit-text-stroke: 1px var(--color-white);
}

.retailSpaceWrapper i.fas.fa-arrow-left,
.retailSpaceWrapper i.fas.fa-arrow-right,
.eventSpaceWrapper i.fas.fa-arrow-left,
.eventSpaceWrapper i.fas.fa-arrow-right,
.headerImage.homepageHeader i.fas.fa-arrow-left,
.headerImage.homepageHeader i.fas.fa-arrow-right {
  display: block;
}

.retailSpaceWrapper i.fas.fa-arrow-left:hover,
.retailSpaceWrapper i.fas.fa-arrow-right:hover,
.eventSpaceWrapper i.fas.fa-arrow-left:hover,
.eventSpaceWrapper i.fas.fa-arrow-right:hover,
.headerImage.homepageHeader i.fas.fa-arrow-left:hover,
.headerImage.homepageHeader i.fas.fa-arrow-right:hover {
  display: block;
}

.retailSpaceWrapper:hover .swiper-button-next.swiper-button-white-leasingEnquiryPage.desktopShow,
.retailSpaceWrapper:hover .swiper-button-prev.swiper-button-white-leasingEnquiryPage.desktopShow,
.eventSpaceWrapper:hover .swiper-button-next.swiper-button-white-leasingEnquiryPage.desktopShow,
.eventSpaceWrapper:hover .swiper-button-prev.swiper-button-white-leasingEnquiryPage.desktopShow,
.headerImage.homepageHeader:hover .swiper-button-next.swiper-button-white-homepage,
.headerImage.homepageHeader:hover .swiper-button-prev.swiper-button-white-homepage {
  /* top: 45%; */
  top: 50%;
  background-image: none;
  background-color: var(--color-white);
  color: var(--color-muted);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  line-height: 109px;
  vertical-align: top;
  padding: 10px;
  outline: 0px !important;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.24);
  opacity: 100;
  transition: all 0.25s;
  cursor: pointer;
}

.featured-popup-swiper-button-next:hover,
.featured-popup-swiper-button-prev:hover {
  opacity: 0.5;
}

.retailSpaceWrapper:hover .swiper-button-next.swiper-button-white-leasingEnquiryPage.desktopShow:hover,
.retailSpaceWrapper:hover .swiper-button-prev.swiper-button-white-leasingEnquiryPage.desktopShow:hover,
.eventSpaceWrapper:hover .swiper-button-next.swiper-button-white-leasingEnquiryPage.desktopShow:hover,
.eventSpaceWrapper:hover .swiper-button-prev.swiper-button-white-leasingEnquiryPage.desktopShow:hover,
.headerImage.homepageHeader:hover .swiper-button-next.swiper-button-white-homepage:hover,
.headerImage.homepageHeader:hover .swiper-button-prev.swiper-button-white-homepage:hover {
  /* top: 45%; */
  top: 50%;
  background-image: none;
  background-color: var(--color-accent);
  color: white;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  line-height: 109px;
  vertical-align: top;
  padding: 10px;
  outline: 0px !important;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.24);
  opacity: 100;
  transition: all 0.25s;
  cursor: pointer;
}

.swiper-button-next.swiper-button-white-leasingEnquiryPage.desktopShow,
.swiper-button-prev.swiper-button-white-leasingEnquiryPage.desktopShow,
.swiper-button-prev.swiper-button-white-homepage,
.swiper-button-next.swiper-button-white-homepage {
  top: 50%;
  background-image: none;
  background-color: var(--color-white);
  color: var(--color-muted);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  line-height: 109px;
  vertical-align: top;
  padding: 10px;
  outline: 0px !important;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.24);
  opacity: 0;
  transition: all 0.25s;
}

i.fas.fa-times.featuredPopupModalCloseIcon {
  color: var(--color-white) !important;
  font-size: 15px !important;
  position: fixed;
  z-index: 999;
  width: 460px;
  margin-left: 60px;
  margin-top: 20px;
  text-align: right;
  height: 0;
}

i.fas.fa-times.featuredPopupModalCloseIcon.advertisement {
  color: var(--color-white) !important;
  font-size: 15px !important;
  position: fixed;
  z-index: 999;
  width: 380px;
  margin-top: 20px;
  margin-left: -55px;
  text-align: right;
  height: 0;
}

.fa-times.featuredPopupModalCloseIcon:before {
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 6px 8px;
}

i.fas.fa-times.featuredPopupModalCloseIcon:hover {
  cursor: pointer;
}

div#event-space.swiper-pagination .swiper-pagination-clickable.swiper-pagination-bullets {
  font-size: 8px;
  line-height: 8px;
  padding-top: 32px;
}

div#event-space .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets>span.swiper-pagination-bullet:not(:last-of-type) {
  margin-right: 16px;
}

div#event-space .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets>span.swiper-pagination-bullet:focus {
  outline: 0px !important;
}

div#event-space .swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.leasingEnquiryPageContainer,
.aboutVivoCityContainer,
.gettingHereContainer,
.rewardsPageContainer {
  max-width: 968px !important;
  padding: 0 16px;
  margin: auto;
}

.retailContent,
.eventSpaceContent,
.mediaPanelsContent,
.leasingEnquiryPageContainer {
  max-width: 744px;
  margin: auto;
}

.retailContent h1,
.eventSpaceContent h1,
.mediaPanelsContent h1,
.pushCartContent h1 {
  font-weight: 700;
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.5px;
  padding-bottom: 24px;
}

.retailContent p,
.eventSpaceContent p,
.mediaPanelsContent p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  letter-spacing: -0.25px;
  padding-bottom: 24px;
}

.retailSpaceBtnWrapper,
.eventSpaceBtnWrapper,
.mediaPanelBtnWrapper {
  padding: 40px 0 64px 0;
}

.retailContent a,
.eventSpaceContent a,
.mediaPanelsContent a {
  color: var(--color-primary);
}

.retailLastPara,
.eventLastPara,
.mediaPanelLastPara {
  padding-bottom: 0px !important;
}

.leasingEnquiry a {
  color: #4baff3;
}

.emailMediaPanelsWrapper>p,
.emailPushCartWrapper>p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  padding: 0;
}

.dropdown.enquiryTypeSelection button.btn.btn-default.dropdown-toggle.selectEnquiryTypeBtn:after {
  display: none;
}

/* About Us Page End */

/*Vivo Rewards*/
.contentContainer.rewards {
  min-height: 500px;
}

.rewardsCatWrapper,
.pressReleaseWrapper {
  width: 100%;
  font-size: 0;
  position: relative;
}

.pressReleaseWrapper {
  min-height: 150px;
}

.rewardsCatMenuCatTitle {
  font-size: 16px;
  line-height: 19px;
  color: var(--color-text);
  font-weight: 500;
  padding-bottom: 8px;
}

a.rewardsBtn {
  font-size: 22px !important;
  line-height: 27px !important;
  font-weight: 400 !important;
}

ul.dropdown-menu.submenucat.aboutReward.desktopShow {
  margin-left: 0 !important;
  padding: 5px 16px 16px 16px !important;
}

ul.dropdown-menu.rewardMenu {
  margin-left: 0 !important;
}

ul.dropdown-menu.submenucat.aboutReward>li:not(.selectedAboutType) {
  padding-left: 19px !important;
}

li.rewardsType.selectedAboutType {
  color: var(--color-accent);
}

.aboutVivoRewardsImg {
  background-size: cover;
  padding-top: calc(100% / 2);
  width: 100%;
  background-position: center;
  margin-bottom: 40px;
}

.rewardsCatMenuTabContent {
  vertical-align: top;
}

.pressRoomTabContent {
  vertical-align: top;
  /* margin-left: 100px; */
}

div#sign_up {
  padding-top: 32px;
}

div#sign_up .blackLine {
  padding-bottom: 27px !important;
}

.signUpWrapper.tabBtnWrapper {
  padding: 0;
}

#guide_bg #about .rewardsBtn.mobileShow {
  display: none;
}

div#introduction h1,
div#using_rewards h1,
div#earning_rewards h1 {
  font-size: 40px;
  line-height: 64px;
  padding-bottom: 40px;
  font-weight: 500;
  color: var(--color-indigo);
  text-transform: uppercase;
}

#earning_rewards>p,
#using_rewards>p {
  font-size: 22px;
  line-height: 29px;
  padding-bottom: 32px;
  font-weight: 400;
}

#earning_rewards .redeemRewardStepContainer,
#using_rewards .redeemRewardStepContainer {
  padding-bottom: 32px;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep,
#using_rewards .redeemRewardStepContainer .redeemRewardStep {
  /* max-width: max-content; */
  margin: auto;
  width: 100%;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep>*,
#using_rewards .redeemRewardStepContainer .redeemRewardStep>* {
  display: inline-block;
  vertical-align: middle;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer {
  padding: 36px 70px 36px 0;
  position: relative;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer img.stepImg,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer img.stepImg {
  width: 120px;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .dashedLine,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .dashedLine {
  position: absolute;
  height: 100%;
  width: 2px;
  right: 0;
  top: 0;
  border-right: 2px dashed var(--color-indigo);
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep.firstStep .imgContainer .stepHeader,
#using_rewards .redeemRewardStepContainer .redeemRewardStep.firstStep .imgContainer .stepHeader {
  position: absolute;
  right: -107px;
  width: 120px;
  top: -11px;
  z-index: 9;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep.lastStep .imgContainer .dashedLine,
#using_rewards .redeemRewardStepContainer .redeemRewardStep.lastStep .imgContainer .dashedLine {
  position: absolute;
  height: 50%;
  width: 2px;
  right: 0;
  top: 0;
  border-right: 2px dashed var(--color-indigo);
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .stepNum,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .stepNum {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 23px;
  font-weight: 500;
  color: var(--color-white);
  text-align: center;
  background: linear-gradient(180deg, #5966c2 0%, var(--color-indigo) 100%);
  padding: 6px;
  width: 39px;
  height: 39px;
  border-radius: 50%;
  position: absolute;
  right: -18.5px;
  top: calc(50% - 18.5px);
}

#using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .stepNum {
  background: linear-gradient(180deg, #f472c4 0%, #e53e92 100%);
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer {
  padding-left: 64px;
  position: relative;
  width: calc(100% - 190px);
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer .stepImg,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer .stepImg {
  display: none;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p {
  width: 380px;
  font-size: 22px;
  line-height: 29px;
  font-weight: 300;
}

#earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p .bold,
#using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p .bold {
  font-weight: 600;
}

#earning_rewards .guideContainer,
#using_rewards .guideContainer {
  padding-top: 42px;
}

#earning_rewards .guideContainer p,
#using_rewards .guideContainer p {
  font-size: 22px;
  line-height: 29px;
  padding-bottom: 18px;
  font-weight: 400;
}

#earning_rewards video:not(.played)::-webkit-media-controls,
#using_rewards video:not(.played)::-webkit-media-controls {
  display: none;
}

div#about_instant_rewards h1 {
  font-size: 40px;
  line-height: 64px;
  padding-bottom: 24px;
  font-weight: 300;
}

div#sign_up h1 {
  font-size: 40px;
  line-height: 64px;
  padding-bottom: 0;
  font-weight: 300;
}

div #about_vivorewards,
div #rewards-dbs-exclusive,
div #rewards-points-calculator,
div #rewards-points-calculator-phase-2 {
  padding-top: 64px;
}

div #faq {
  padding-top: 40px;
}

div#about_vivorewards h1 {
  text-transform: unset;
}

div#about_vivorewards p,
div#about-phase-2 p {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 32px;
}

div#about_vivorewards p {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 32px;
}

.captionDescMembershipPriv {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}

.captionTermsCondition {
  font-size: 12px;
  font-weight: normal;
  letter-spacing: 0;
  line-height: 24px;
}

div#about_vivorewards .aboutVivoRewardsDesc {
  padding-bottom: 64px;
}

div#about_vivorewards .aboutVivoRewardsDesc p {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 28px;
  letter-spacing: -0.25px;
}

div#about_vivorewards .aboutVivoRewardsDesc p:last-child {
  padding-bottom: 0px;
}

div#about_vivorewards .aboutVivoRewardsDesc p.color {
  color: var(--color-accent);
}

div#about_vivorewards .aboutVivoRewardsGetStartedContainer {
  padding-bottom: 64px;
}

h4.aboutVivoRewardsGetStartedHeader {
  font-family: var(--font-display);
  font-size: 28px;
  line-height: 40px;
  letter-spacing: -0.5px;
  font-weight: 700;
  padding-bottom: 32px;
}

.aboutVivoRewardsGetStartedTable {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 24px;
}

.aboutVivoRewardsGetStartedTableRow {
  display: flex;
  flex-direction: row;
  gap: 24px;
}

.aboutVivoRewardsGetStartedTableCell {
  flex: 1;
  display: flex;
  align-items: stretch;
}

.vrGetStartedContent {
  border: 1px solid var(--color-border-light);
  border-radius: 16px;
  background-color: white;
  display: flex;
  align-items: start;
  width: 100%;
}

.aboutVivoRewardsGetStartedTableFirstRow {
  height: auto;
}

.aboutVivoRewardsGetStartedTableFirstRow .firstCell,
.aboutVivoRewardsGetStartedTableCell.lastCell {
  align-items: start;
}

.aboutVivoRewardsGetStartedTableCell .cellImage {
  padding: 72px 32px;
}

.aboutVivoRewardsGetStartedTableCell .cellImage.smallIcon {
  padding: 94px 32px;
}

.aboutVivoRewardsGetStartedTableCell .cellImage img,
.aboutVivoRewardsGetStartedTableCell .cellLongImage img {
  max-width: 96px;
}

.aboutVivoRewardsGetStartedTableCell .cellLongImage {
  padding: 24px 32px;
}

.aboutVivoRewardsGetStartedTableCell .cellImage {
  border-right: 1px solid var(--color-border-light);
}

.aboutVivoRewardsGetStartedTableCell .cellLongImage,
.aboutVivoRewardsGetStartedTableCell .cellLongText {
  align-self: start;
  height: 100%;
}

.aboutVivoRewardsGetStartedTableCell .cellText {
  padding: 24px;
}

.aboutVivoRewardsGetStartedTableCell .cellLongText {
  border-left: 1px solid var(--color-border-light);
}

.aboutVivoRewardsGetStartedTableCell .cellTextExpand {
  display: none;
}

.aboutVivoRewardsGetStartedTableCell .cellText h5 {
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.5px;
  font-weight: 700;
  padding-bottom: 16px;
}

.aboutVivoRewardsGetStartedTableCell .cellText p,
.aboutVivoRewardsGetStartedTableCell .cellText li {
  font-family: var(--font-body);
  font-size: 14px !important;
  line-height: 24px !important;
  padding-bottom: 0 !important;
}

.cellTextExpand {
  padding-top: 24px;
}

.viewMoreHidden {
  display: none;
}

.viewMoreExpandButton {
  color: var(--color-primary);
  cursor: pointer;
}

.shopBeRewardClickHere {
  border: 1px solid var(--color-border-light);
  border-radius: 6px;
  background-color: var(--color-off-white);
  padding: 8px;
  margin-bottom: 24px;
}

.shopBeRewardClickHere a {
  color: var(--color-primary);
}

.shopBeRewardOrderedList {
  padding-top: 24px;
}

.perksContainer {
  padding-bottom: 64px;
}

.rewardsGuideContainer {
  padding-bottom: 120px;
}

.perksHeaderContainer,
.perksHeaderContainer {
  /* background-color: var(--color-border-light); */
  border-radius: 16px 16px 0 0;
}

.perksHeaderContainerDesktop {
  height: 320px;
  /*Temp*/
  background: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1727781631/Vivocity/Website%202024/Images/VR2024_Web_Perks_Banners_FAP_Desktop-min.jpg");
  background-size: cover;
}

.perksHeaderContainerMobile {
  display: none;
  overflow: hidden;
  height: 254px;
  background-color: var(--color-border-light);
}

.perksContentContainerMobile {
  display: block;
  height: 100%;
  background: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1727781630/Vivocity/Website%202024/Images/VR2024_Web_Perks_Banners_FAP_Mobile-min.jpg");
  background-size: cover;
  background-position-x: center;
  background-position-y: 25%;
  background-repeat: no-repeat;
}

.rewardsGuideHeaderContainer {
  height: 420px;
  position: relative;
  background-size: cover !important;
}

.rewardsGuideInnerHeader {
  position: absolute;
  bottom: 0;
  padding-left: 40px;
}

.rewardsGuideInnerHeader h3 {
  padding-bottom: 24px;
  font-size: 48px;
  line-height: 48px;
  letter-spacing: -1px;
  font-weight: 700;
  color: white;
  text-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
  font-family: var(--font-display);
}

.perksBodyContainer,
.rewardsGuideBodyContainer {
  background-color: var(--color-white);
  border-radius: 0 0 16px 16px;
  border: 1px solid var(--color-border-light);
}

.perksMinimizeContainer {
  padding-top: 16px;
  padding-bottom: 24px;
}

.perksMinimizeButtonContainer {
  position: relative;
}

.perksMinimizeButton {
  display: none;
  cursor: pointer;
  position: absolute;
  right: 32px;
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.25);
  border-radius: 50%;
  width: 40px;
  height: 40px;
}

.perksMinimizeButton img {
  object-fit: cover;
}

.privillegeTable {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-spacing: 32px;
}

.privillegeRow {
  display: table-row;
  margin: auto;
}

.privillegeRowMobile {
  display: none;
}

.privillegeCell {
  display: table-cell;
  width: 25%;
  background-color: var(--color-off-white);
  border: 1px solid var(--color-border-light);
  border-radius: 16px;
  text-align: center;
}

.privillegeContent {
  padding: 32px 16px;
}

.privillegeCell h5,
.pointsEntitlementCell h5,
.vrPointsCalculationCell h5,
.vrPointsCalculationCell p,
.pointsEntitlementCell p,
.dbsMoreRewardText h5,
.dbsGetVrPointsText h5,
.privilegeSummaryContainer h5,
.privilegeSummaryContainer p,
.rewardsGuideInnerContainer h5,
.rewardsVideoGuideContainer h5,
.dbsLinkVideoGuideContainer h5 {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding-top: 0 !;
  padding-bottom: 0 !important;
  word-break: break-word;
}

.dbsGetVrPointsText a {
  color: #00badc !important;
}

.rewardsGuideInnerContainer h5 {
  padding-bottom: 8px;
}

#rewardsUsage {
  display: none;
}

.privillegeCell h5,
.pointsEntitlementCell h5,
.vrPointsCalculationCell h5,
.dbsMoreRewardText h5,
.dbsGetVrPointsText h5,
.privilegeSummaryContainer h5,
.rewardsGuideInnerContainer h5,
.rewardsVideoGuideContainer h5,
.dbsLinkVideoGuideContainer h5 {
  font-family: var(--font-display);
  font-weight: 700;
}

.privillegeCell img {
  width: 96px;
  object-fit: cover;
  padding-bottom: 32px;
}

.earnVrPointsContainer {
  margin: 32px;
  padding: 40px 16px;
  background-color: var(--color-off-white);
  border: 1px solid var(--color-border-light);
  border-radius: 16px;
  text-align: center;
}

p.earnSpendRewards {
  padding-bottom: 0 !important;
  text-align: left;
  padding-left: 32px;
  padding-right: 32px;
}

.earnSpendRewards a {
  color: var(--color-primary);
}

p.calculateLink {
  padding-bottom: 0 !important;
  text-align: center;
  padding-left: 32px;
  padding-right: 32px;
}

.calculateLink a {
  color: var(--color-primary);
}

.earnVrPointsImageContainer {
  display: flex;
  justify-content: center;
}

.earnVrPointsImageContainer img {
  margin: 0 auto;
  max-width: 590px;
  width: 100%;
}

.earnVrPointViewAllButton {
  margin-bottom: 64px;
}

.earnVrPointViewAllButton p {
  cursor: pointer;
  margin: 0 auto;
  width: fit-content;
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent));
  color: white;
  font-weight: 700;
  border-radius: 28px;
  font-size: 16px;
  line-height: 28px;
  padding: 10px 24px !important;
}

.earnVrPointViewAllButton p:hover {
  opacity: 0.5;
}

.dbCessationContainer {
  background-color: #E7CEE6;
  padding: 40px 53px;
  border-radius: 16px;
  margin-bottom: 60px;
}

.dbCessationContainer a {
  color: var(--color-primary);
}

.enjoyInstantRewardsContainer a {
  color: var(--color-primary);
}

.earnVrPointsCaptionContainer,
.earnVrPointShowMoreContainer {
  margin: 0 32px 64px 32px;
}

.earnVrPointsCaptionContainer.smallCards {
  margin: 0;
}

.earnVrPointShowMoreContainer {
  display: none;
}

.earnVrPointsCaptionContainer p,
.dbsMoreRewardCaption,
.dbsGetVrPointsCaption,
.privilegeSummaryNoteCaption li {
  font-size: 14px !important;
  line-height: 24px !important;
  padding-bottom: 0 !important;
}

.earnVrPointsCaptionContainer p,
.dbsMoreRewardCaption,
.privilegeSummaryNoteCaption li {
  color: var(--color-muted);
}

.privilegeSummaryNoteCaption,
.faqFootnote {
  color: var(--color-muted);
  font-size: 14px !important;
  line-height: 24px !important;
  padding-bottom: 0 !important;
}

.pointsEntitlementTable,
.pointsEntitlementGuideTable,
.privilegeSummaryTable {
  table-layout: fixed;
  width: 100%;
  border: 1px solid white;
  border: none;
  margin-bottom: 32px;
}

.pointsEntitlementTable {
  margin-bottom: 64px;
}

.privilegeSummaryTable {
  margin-top: 16px;
  margin-bottom: 32px;
}

.privilegeSummaryNote p {
  padding-bottom: 16px !important;
  color: var(--color-muted);
}

.pointsEntitlementRow,
.privilegeSummaryRow {
  display: table-row;
  margin: auto;
  border: none;
}

.pointsEntitlementCell {
  display: table-cell;
  width: 50%;
  padding: 18px 16px;
  background-color: var(--color-gray-100);
  border: 4px solid white;
  text-align: center;
}

.privilegeSummaryCell {
  display: table-cell;
  width: 100%;
  padding: 18px 24px;
  background-color: var(--color-gray-100);
  border: 4px solid white;
  text-align: center;
}

.privilegeSummaryTopCell {
  vertical-align: middle;
}

.privilegeSummaryCell p {
  font-size: 16px;
}

.privilegeSummaryCell img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.vrPointsCalculationCell {
  display: table-cell;
  width: 50%;
  padding: 18px 16px;
  background-color: var(--color-gray-100);
  border: 4px solid var(--color-off-white);
  text-align: center;
}

.pointsEntitlementRow th p {
  font-weight: 700 !important;
}

.cellTextLeft {
  text-align: left;
}

.privilegeSummaryCellNotAvail {
  background-image: linear-gradient(135deg,
      var(--color-off-white) 33.33%,
      var(--color-border) 33.33%,
      var(--color-border) 50%,
      var(--color-off-white) 50%,
      var(--color-off-white) 83.33%,
      var(--color-border) 83.33%,
      var(--color-border) 100%);
  background-size: 6px 6px;
}

.pointsEntitlementCell .bold {
  font-weight: 700 !important;
}

.pointsEntitlementHeaderCell,
.privilegeSummaryHeaderCell {
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent));
}

.privilegeSummaryMainHeaderCell {
  width: 100% !important;
}

.pointsEntitlementHeaderCell h5,
.privilegeSummaryHeaderCell h5 {
  color: white;
}

.privilegeSummaryHeaderCell h5 .golddbscaption {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}

.dbsMoreRewardContainer {
  display: flex;
  flex-direction: column;
  padding: 0 32px;
  margin-bottom: 72px;
  align-items: center;
}

.dbsExclusiveContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.dbsMoreRewardImage {
  max-width: 424px;
  margin-bottom: 16px;
  flex-shrink: 0;
}

.dbsExclusiveImage {
  max-width: 424px;
}

.dbsMoreRewardImage img,
.dbsExclusiveImage img {
  width: 100%;
  object-fit: cover;
}

/* .dbsMoreRewardText, */
.dbsGetVrPointsText {
  padding-left: 56px;
}

.dbsMoreRewardText h5,
.dbsGetVrPointsText h5 {
  padding-bottom: 16px !important;
}

.dbsGetVrPointsContainer {
  background-color: var(--color-primary-strong);
  display: flex;
  margin-bottom: 32px;
  padding: 32px;
  border-radius: 16px;
}

.dbsGetVrPointsText h5,
.dbsGetVrPointsText p {
  color: white;
}

.privilegeSummaryContainer {
  margin-top: 64px;
  margin-bottom: 64px;
}

.privilegeSummaryTableOverflowArrowIndicator {
  display: none;
}

.rewardsGuideInnerContainer {
  overflow: hidden;
}

.rewardsGuideInnerContainer,
.rewardsVideoGuideContainer,
.dbsLinkVideoGuideContainer {
  padding: 32px 40px;
}

.dbsLinkVideoGuideContainer .pointsEntitlementGuideTable {
  margin-top: 32px;
}

.rewardsGuideInnerIntroText {
  padding-bottom: 16px !important;
}

.rewardsGuideInnerIntroNotes {
  color: var(--color-muted);
  font-size: 14px !important;
  line-height: 24px !important;
}

.rewardsVideoGuideContainer h5 {
  padding-bottom: 32px !important;
}

.rewardsRedemptionTable .swiper-slide {
  max-width: 280px;
  width: 100%;
  height: auto;
}

.rewardsRedemptionTable .swiper-pagination {
  bottom: -30px !important;
}

.rewardsUsageSwiperPaginationDesktop .swiper-pagination-bullet,
.rewardsUsageSwiperPaginationPhase2Desktop .swiper-pagination-bullet {
  width: 80px !important;
  height: 6px !important;
  border-radius: 3px;
}

.rewardsRedemptionSwiperPaginationContainer,
.rewardsUsageSwiperPaginationContainer,
.dbsLinkingStepSwiperPaginationContainer,
.transportSwiperPaginationContainer {
  position: relative !important;
}

.rewardsRedemptionTable,
.dbsLinkingStepTable {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: separate;
  border-spacing: 16px;
  position: relative;
}

.rewardsRedemptionMobileTable,
.dbsLinkingStepMobileTable {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: separate;
  border-spacing: 8px;
  position: relative;
}

.rewardsRedemptionRow,
.dbsLinkingStepRow {
  display: table-row;
}

.rewardsRedemptionCell {
  text-align: center;
}

.rewardsRedemptionCell,
.dbsLinkingStepCell {
  vertical-align: top;
  display: table-cell;
  padding: 0 8px;
  border: 1px solid var(--color-border-light);
  border-radius: 16px;
}

.rewardsRedemptionImageWrapper,
.dbsLinkingStepImageWrapper {
  padding: 24px 36px;
}

.rewardsRedemptionImage,
.dbsLinkingStepImage {
  background-size: contain;
  padding-top: 100%;
  background-repeat: no-repeat;
  width: 100%;
  max-width: 192px;
  background-position: center;
  margin: 0 auto;
}

.rewardsRedemptionCircleIcon,
.dbsLinkingStepCircleIcon {
  height: 32px;
  width: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.rewardsRedemptionCircleIcon {
  background-color: #285ac8;
}

.dbsLinkingStepCircleIcon {
  background-color: var(--color-accent);
}

.rewardsRedemptionCircleIcon p,
.dbsLinkingStepCircleIcon p {
  font-family: var(--font-display);
  color: var(--color-white);
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22.4px !important;
  letter-spacing: -0.4px !important;
  padding-bottom: 0 !important;
}

.rewardsRedemptionDesc,
.dbsLinkingStepDesc {
  padding-top: 8px;
}

.rewardsRedemptionDesc p {
  font-size: 16px !important;
}

.rewardsTnCLink {
  padding-top: 32px;
  text-align: center;
}

.rewardsTnCLink a {
  color: var(--color-primary);
}

.rewardsPostsWrapper p {
  padding-bottom: 8px !important;
}

div#about_instant_rewards {
  padding-top: 40px;
  padding-bottom: 40px;
}

div#using_rewards h3,
div#sign_up_vivo_rewards h3 {
  font-size: 22px;
  line-height: 33px;
  padding-bottom: 24px;
  font-weight: 400;
}

.rewardsMemberEnjoyDesc ol {
  list-style: decimal;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
  padding: 0;
  font-weight: 300;
}

.rewardsMemberEnjoyDesc li {
  list-style-position: inside;
  padding: 0;
}

.rewardsMemberEnjoyDesc li::before {
  content: "";
  width: 8px;
  display: inline-block;
}

.rewardsPageTermsCondition>p {
  text-align: center;
  padding-bottom: 0 !important;
  font-style: italic;
  font-family: "Barlow", sans-serif;
  color: var(--color-text);
  font-size: 16px;
  line-height: 24px;
}

div#introduction .rewardsMemberEnjoyDesc>p,
div#about_instant_rewards p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
  padding-bottom: 0;
}

div#sign_up_vivo_rewards p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  padding-bottom: 24px;
}

.conditionDesc>p {
  padding-bottom: 40px !important;
}

div#about_vivorewards .blackLine,
#getting_started .blackLine {
  padding-bottom: 32px !important;
}

.rewardsPageTermsCondition .blackLine {
  padding: 8px 0 40px 0;
}

/*video.embed-responsive-item {
display: block;
width: 100%;
height: auto;
padding: 0 91px;
}*/

.rewardsVideoContainer {
  position: relative;
  width: 100%;
  /* height: 0; */
  /* padding-bottom: 64px; */
}

.rewardsVideoContainer video {
  width: 100%;
}

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

.rewardsVideoContainer .playBtn img {
  position: absolute;
  left: calc(50% - 42px);
  top: calc(50% - 42px);
  cursor: pointer;
  width: 84px;
}

div#about_vivorewards iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div#introduction .rewardsMemberEnjoyDesc {
  padding-bottom: 40px;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText {
  margin-bottom: 40px;
  padding: 14px 0;
}

#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText.greyBox {
  padding: 27px 0;
  background-color: var(--color-indigo);
  border-radius: 30px;
}

#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText.greyBox p {
  color: var(--color-white) !important;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText>*,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText>* {
  display: inline-block;
  vertical-align: top;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .imgContainer,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .imgContainer {
  width: 212px;
  margin-right: 15px;
  text-align: center;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .imgContainer img,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .imgContainer img {
  width: 142px;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer {
  width: calc(100% - 212px - 15px);
  padding-right: 35px;
  padding-top: 10px;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer h4,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer h4 {
  font-size: 22px;
  line-height: 27px;
  font-weight: 600;
  padding-bottom: 8px;
  color: var(--color-indigo);
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer p,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer p {
  font-size: 22px;
  line-height: 29px;
  font-weight: 300;
  padding-bottom: 9px;
  color: var(--color-text);
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer p .bold,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer p .bold {
  font-weight: 600;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer .caption,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer .caption {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  color: var(--color-text);
  padding-bottom: 0;
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ol,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ol {
  font-size: 22px;
  line-height: 29px;
  font-weight: 300;
  color: var(--color-text);
}

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ul,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ul {
  font-size: 16px;
  line-height: 26px;
  font-weight: 300;
  color: var(--color-text);
  padding-left: 0;
  list-style-type: none;
}

/* #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ul li, #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ul li {
padding-left: 8px;
} */

#about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ul li:before,
#getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ul li:before {
  content: "•";
  padding-right: 16px;
}

#vrpoints p {
  font-size: 22px;
  line-height: 29px;
  font-weight: 300;
  color: var(--color-text);
  padding-bottom: 30px;
}

#vrpoints img {
  display: block;
  margin: 0 auto 40px;
  max-width: 388px;
  width: 100%;
}

#vrpoints .caption p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
  color: var(--color-text);
  padding-bottom: 0;
}

/*Earning Rewards*/
div#about .dropdown-menu li a:hover {
  background-color: transparent;
  cursor: pointer;
}

.earningRewardsTabWrapper.tabBtnWrapper {
  padding: 0;
}

.earningRewardsImg {
  width: calc(100% - 6px);
  padding-top: calc(100% - 12px);
  background-size: contain;
  background-position: center;
  display: inline-block;
  vertical-align: top;
  background-repeat: no-repeat;
}

.earningStepsImgWrapper {
  width: 28%;
  display: inline-block;
  vertical-align: middle;
  padding: 31px;
}

.earningRewardDesc h3 {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
}

div#sign_up_vivo_rewards .stepsDescWrapper h3 {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
  padding-bottom: 0px;
}

p.signUpBtn.tabBtn {
  font-size: 22px;
  line-height: 27px;
  font-weight: 300;
}

div#sign_up_vivo_rewards {
  padding: 40px 0 3px 0;
}

div#using_rewards {
  padding-bottom: 3px;
}

.stepsRegisterContainer {
  margin: 0 -5px;
  padding-bottom: 32px;
}

.stepsRegisterWrapper:hover {
  transition: all 0.25s;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

.stepsRegisterContainer .stepsRegisterWrapper:hover .stepsDescWrapper .colorLine {
  background-color: var(--color-accent);
}

.stepsRegisterWrapper {
  display: inline-block;
  width: calc(33.33% - 10px);
  margin: 0 5px 16px 5px;
  margin-bottom: 16px;
  background-color: var(--color-white);
  vertical-align: top;
  overflow: hidden;
}

.stepsDescWrapper {
  padding: 24px 16px;
  position: absolute;
  top: 0;
}

.stepsImgWrapper {
  background-repeat: no-repeat;
  padding-top: 100%;
  width: 100%;
  transition: all 0.25s;
  position: relative;
  border-bottom: 1px solid var(--color-border);
}

.stepsImgWrapper .aboutVivoRewardsImg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  max-height: calc(100% - 80px);
  max-width: calc(100% - 32px);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.stepsRegisterContainer .stepsDescWrapper p {
  font-size: 16px !important;
  line-height: 28px !important;
  font-weight: 300 !important;
  padding-bottom: 0 !important;
}

.stepsRegisterDescContainer {
  position: relative;
  width: 100%;
  padding-top: 100%;
}

.instantRewardsBankImg {
  height: 28px;
  width: 165px;
  background-size: cover;
  background-position: center;
}

div#sign_up_instant_rewards h3 {
  font-size: 20px;
  line-height: 28px;
  padding-bottom: 40px;
  padding-top: 16px;
  font-weight: 300;
}

div#sign_up_instant_rewards p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
}

.instantRewardsBigImg {
  background-size: cover;
  padding-top: calc(100% / 4);
  width: 100%;
  background-position: center;
  margin-bottom: 40px;
}

.vivoRewardsKioskWrapper .earningRewardsImg {
  width: 20%;
  padding-top: 70%;
  margin: 0 48px 0 0;
  vertical-align: middle;
}

.vivoRewardsKioskWrapper,
div#sign_up_instant_rewards {
  padding: 40px 0;
}

.vivoRewardsExchangeWrapper {
  padding: 40px 0;
  width: 100%;
}

.exchangeContainer {
  width: 50%;
  display: inline-block;
}

p.exchangeTitle {
  font-size: 22px;
  line-height: 27px;
  font-weight: 500;
}

.exchangeColumn {
  padding: 16px 0;
  text-align: center;
  width: 50%;
  display: inline-block;
}

.exchangeContainer {
  width: 100%;
}

p.exchangeAmount,
p.exchangeIssued {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
}

.exchangeRow {
  width: 100%;
  border-bottom: solid 1px var(--color-border);
}

.exchangeRow:nth-child(16) {
  width: 100%;
  border-bottom: 0;
}

div#vivo_rewards .rewardsPageTermsCondition {
  padding-top: 0;
}

.rewardsPageTermsCondition {
  padding-top: 64px;
}

.rewardsPageTermsCondition .rewardsPageTermsCondition .blackLine {
  padding-top: 40px;
}

.rewardsCatWrapper .rewardsPageTermsCondition {
  padding-bottom: 40px;
}

.rewardsCatWrapper .rewardsPageTermsCondition p {
  max-width: 500px;
  margin: auto;
}

div#vivo_rewards .rewardsPageTermsCondition>p,
.earningDesc.earningRewardContainer .rewardsPageTermsCondition,
div#rewards_exchange .rewardsPageTermsCondition {
  font-size: 16px;
  line-height: 24px;
}

.earningDesc.earningRewardContainer p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
}

.instantRewardsWrapper.earningRewardContainer {
  width: 100%;
  padding-bottom: 40px;
  padding-top: 40px;
}

p.exchangeTitle.exchangeColumn {
  width: 49%;
}

i.fas.fa-angle-right {
  font-size: 24px;
  line-height: 24px;
}

.vivoRewardsKiosk.earningRewardsContainer>h1 {
  padding-bottom: 24px;
}

.vivoRewardsKiosk.earningRewardsContainer h3 {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
  padding-bottom: 16px;
}

.vivoRewardsKiosk.earningRewardsContainer>p:not(.levelList) {
  font-size: 16px;
  line-height: 27px;
  font-weight: 300;
  padding-bottom: 24px;
  padding-top: 16px;
}

p.levelList {
  font-size: 16px;
  line-height: 27px;
  font-weight: 300;
}

.earningRewardsContainer,
.instantRewardsDescWrapper {
  width: calc(72% - 65px);
  display: inline-block;
  vertical-align: middle;
  padding-left: 16px;
}

.instantRewardsWrapper .earningRewardsImgWrapper {
  width: 28%;
  background-size: cover;
  background-position: center;
  display: inline-block;
  vertical-align: middle;
  margin: 31px;
}

.earningRewardDesc p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.vivoRewardsRow {
  margin-bottom: 17px;
}

div#vivo_rewards .vivoRewardsRow:hover .earningRewardDesc.earningRewardsContainer .colorLine {
  background-color: var(--color-accent);
}

p.vivoRewardsDesc {
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
  padding-bottom: 16px;
  padding-top: 23px;
}

.instructionsColumn .earningRewardsImg {
  margin: 0;
  padding-top: 100%;
  width: 100%;
}

.vivoRewardsList ul {
  list-style: disc;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
  padding: 0;
  font-weight: 300;
}

.vivoRewardsList li {
  list-style-position: inside;
  padding: 0;
}

.vivoRewardsList li::before {
  content: "";
  width: 8px;
  display: inline-block;
}

.vivoRewardsList {
  padding-bottom: 40px;
}

.instructionsColumn {
  width: 100%;
  padding-bottom: 16px;
}

.instructionsColumn:last-child {
  padding-bottom: 0;
}

.instructionsColumn h3 {
  font-size: 22px;
  line-height: 27px;
  font-weight: 400;
}

.instructionsColumn p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.instructionsColumn .earningRewardsImg {
  width: calc(100% - 6px);
  padding-top: calc(100% - 12px);
  background-size: contain;
  background-position: center;
  display: inline-block;
  vertical-align: top;
  background-repeat: no-repeat;
}

div#vivo_rewards {
  padding-top: 40px;
}

/*End Earning Rewards*/

/* Rewards Catalogue */
.hiddenContent {
  display: none;
}

.rewardsCatalogueDesc {
  padding-bottom: 40px;
  max-width: 855px;
}

.rewardsCatalogueDesc p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.rewardsCatalogueDesc p:first-child {
  padding-bottom: 28px;
}

.rewardsCatalogueSearchContainer .filterGroup {
  display: flex;
  padding-bottom: 16px;
}

.rewardsCatalogueSearchContainer .searchBar {
  flex-grow: 1;
  color: var(--color-gray-200);
  font-size: 24px;
  height: 48px;
  padding: 8px 8px 8px 0;
}

.rewardsCatalogueSearchContainer .searchBar #algolia_reward_searchbox {
  /* flex-grow: 1;
  color: var(--color-gray-200);
  font-size: 24px;
  height: 48px;
  padding: 8px 0; */
  display: inline-block;
  width: calc(100% - 16px);
  vertical-align: top;
}

.rewardsCatalogueSearchContainer .searchBar .cancelSearch {
  /* visibility: visible; */
  display: inline-block;
  vertical-align: top;
  line-height: 32px;
}

.rewardsCatalogueSearchContainer .searchBar input {
  border: none;
  background-color: transparent;
  padding: 0 46px;
  font-size: 20px;
  line-height: 32px;
}

.rewardsCatalogueSearchContainer .searchBar input::placeholder {
  color: var(--color-text);
  font-size: 20px;
  line-height: 32px;
  font-weight: 300;
}

.rewardsCatalogueSearchContainer .searchBar .ais-SearchBox-form {
  font-size: 0;
}

.dropdownRewardsCatalogueType {
  width: 350px;
}

.rewardsCatalogueBtn,
.rewardsCatalogueTypeBtn,
.rewardsCatalogueSortByBtn {
  text-transform: capitalize;
  width: 100%;
  text-align: left;
  padding: 9px 30px 9px 16px;
  font-size: 16px;
  line-height: 28px;
  background-color: var(--color-off-white) !important;
  border-radius: 6px;
  border: solid 1px var(--color-border);
  font-family: "Rubik", sans-serif;
  font-weight: 300;
  color: var(--color-text);
}

.selectedSortBy {
  display: -webkit-box;
  max-height: 28px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rewardsCatalogueBtn::after,
.rewardsCatalogueTypeBtn::after,
.rewardsCatalogueSortByBtn::after,
.rewardsCatalogueSidemenuBtn::after {
  content: "\f0d7";
  font-family: "FontAwesome";
  font-size: 20px;
  color: var(--color-text);
  right: 12px;
  margin: 0;
  top: 12px;
  position: absolute;
  pointer-events: none;
  -webkit-text-stroke: 0.5px var(--color-white);
}

.rewardsCatalogueTypeDropdownMenu.open,
.rewardsCatalogueSortByDropdownMenu.open {
  display: block;
}

.rewardsCatalogueTypeDropdownMenu,
.rewardsCatalogueDropdownSidemenu,
.rewardsCatalogueSortByDropdownMenu,
.rewardsCatalogueDropdownSidemenu {
  margin: 0 !important;
  width: 100% !important;
}

.rewardsCatalogueTypeDropdownMenu li,
.rewardsCatalogueDropdownSidemenu li,
.rewardsCatalogueSortByDropdownMenu li,
.rewardsCatalogueDropdownSidemenu li {
  cursor: pointer;
}

.rewardsCatalogueTypeDropdownMenu li a.selectedRewardsCatalogueType,
.rewardsCatalogueDropdownSidemenu li.selectedRewardsCatalogueCat a,
.rewardsCatalogueSortByDropdownMenu li a.selectedRewardsCatalogueType,
.rewardsCatalogueDropdownSidemenu li.selectedRewardsCatalogueCat a {
  color: var(--color-accent) !important;
}

.rewardsCatalogueTypeDropdownMenu li a:hover,
.rewardsCatalogueDropdownSidemenu li a:hover,
.rewardsCatalogueSortByDropdownMenu li a:hover,
.rewardsCatalogueDropdownSidemenu li a:hover {
  background-color: var(--color-accent);
  color: var(--color-white) !important;
}

.rewardsCatalogueContentWrapper {
  position: relative;
  min-height: 300px;
  padding: 40px 0;
}

.rewardsCatalogueSidemenuMobile {
  display: none;
}

.rewardsCatalogueContent {
  vertical-align: top;
  /* margin-left: 290px; */
}

.rewardsCatalogueSidemenu {
  position: absolute;
  width: 290px;
  padding-right: 16px;
}

.rewardsCatContentWrapper {
  font-size: 0;
  display: none;
}

.rewardsCatContentWrapper.active {
  display: block;
}

.ais-Hits-list {
  display: block;
  margin: 0 !important;
}

.rewardsCatContentWrapper .ais-Hits-item {
  margin-top: 0;
  margin-left: 0;
}

.rewardsCatContent:not(.algoliaItem),
.ais-Hits-item:nth-child(n) {
  display: block;
  width: 25%;
  padding: 8px 8px;
  margin: 0;
  height: 100%;
  cursor: pointer;
  transition: all 0.25s;
  vertical-align: top;
}

#tags-list .ais-Hits .ais-Hits-list .ais-Hits-item:nth-child(n) {
  display: inline-block;
}

.rewardsCatContentWrapper .emptyReward {
  padding-top: 24px;
  text-align: center;
}

.rewardsCatContentWrapper .emptyReward p {
  font-size: 20px;
  line-height: 28px;
  font-weight: 300;
  color: var(--color-gray-200);
  font-family: "Rubik", sans-serif;
}

.rewardsCatContentWrapper .emptyReward p .changeFilter {
  color: var(--color-accent);
  cursor: pointer;
}

.rewardsCatContent:not(.algoliaItem):hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
}

/* .rewardsCatContent:not(.algoliaItem):nth-child(3n+2), .ais-Hits-item:nth-child(3n+2) {
margin: 0 16px;
} */

.rewardsCatContent .rewardImage {
  padding-top: 100%;
  background-position: center;
  background-size: cover;
  background-color: #d8d8d8;
  position: relative;
}

.rewardsCatContent .rewardImage p,
.rewardCatalogueDialog .rewardImage p {
  font-family: "Barlow Condensed", sans-serif;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 1px;
  font-weight: 500;
  color: var(--color-white);
  padding: 6px 8px;
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: 0;
}

#featured .rewardsCatContent .rewardImage p,
.featured-dialog.rewardCatalogueDialog .rewardImage p,
#algolia_reward_tags_list.featured .rewardsCatContent .rewardImage p {
  background-color: #00acd4;
}

#flash-deals .rewardsCatContent .rewardImage p,
.flash-deals-dialog.rewardCatalogueDialog .rewardImage p,
#algolia_reward_tags_list.flash-deals .rewardsCatContent .rewardImage p {
  background-color: #ec1169;
}

.rewardsCatContent .rewardDetailsDescWrapper {
  padding-top: 100%;
  background-color: var(--color-white);
  position: relative;
}

.rewardsCatContent .rewardDetailsDesc {
  position: absolute;
  top: 0;
  padding: 24px 16px;
}

.rewardsCatContent .rewardShopName {
  font-size: 16px;
  font-weight: 300;
  line-height: 19px;
  padding-bottom: 8px;
}

.rewardsCatContent .rewardTitle {
  font-size: 16px;
  line-height: 27px;
  padding-bottom: 8px;
  word-break: break-word;
}

.rewardsCatContent .rewardPoints {
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: 1px;
  padding-bottom: 16px;
  color: var(--color-accent);
  font-weight: 500;
}

.rewardsCatContent .rewardOldPoints {
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 1px;
  padding-bottom: 4px;
  color: var(--color-gray-200);
  font-weight: 500;
  text-decoration: line-through;
}

.rewardsCatContent .rewardSeparator {
  width: 40px;
  height: 3px;
  background-color: var(--color-border);
  transition: all 0.25s;
}

.rewardsCatContent:not(.algoliaItem):hover .rewardSeparator,
.ais-Hits-item:hover .rewardSeparator {
  background-color: var(--color-accent);
}

.rewardsCatalogueSidemenu p {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 18px;
}

.rewardsCatalogueSidemenu ul {
  list-style: none;
  padding: 0;
}

.rewardsCatalogueSidemenu ul li {
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-style: italic;
  padding-bottom: 8px;
  transition: all 0.25s;
  cursor: pointer;
}

.rewardsCatalogueSidemenu ul li span {
  padding-right: 11px;
  font-style: normal;
  opacity: 0;
  transition: all 0.25s;
  color: var(--color-accent);
}

.selectedRewardsCatalogueCat {
  color: var(--color-accent) !important;
}

.selectedRewardsCatalogueCat span {
  opacity: 1 !important;
}

.rewardCatalogueDialogWrapper {
  display: table;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9999;
  display: none;
}

.rewardCatalogueDialogWrapper .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: -1;
}

.rewardCatalogueDialogContainer {
  display: table-cell;
  vertical-align: middle;
}

.rewardCatalogueDialog {
  background-color: var(--color-white);
  max-width: 570px;
  margin: auto;
  height: calc(100vh - 160px);
  overflow-y: auto;
  padding: 40px;
  display: none;
}

.rewardCatalogueDialog .voucherDetails>div {
  border-bottom: solid 1px var(--color-border-light);
}

.rewardCatalogueDialog .rewardImage {
  width: 100%;
  padding-top: 100%;
  background-size: cover;
  background-position: center;
  margin-bottom: 32px;
  border: solid 1px var(--color-border-light);
  position: relative;
}

.rewardCatalogueDialog .rewardShopName {
  font-family: "Barlow Condensed", sans-serif;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 1px;
  padding-bottom: 8px;
  text-align: center;
  color: #727272;
}

.rewardCatalogueDialog .rewardTitle {
  font-size: 22px;
  line-height: 27px;
  padding-bottom: 8px;
  text-align: center;
}

.rewardCatalogueDialog .rewardOldPoints {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 1px;
  padding-bottom: 4px;
  text-align: center;
  color: var(--color-gray-200);
  text-decoration: line-through;
}

.rewardCatalogueDialog .rewardPoints {
  /* font-family: 'Barlow Condensed', sans-serif; */
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  /* letter-spacing: 1px; */
  padding-bottom: 32px;
  text-align: center;
  color: var(--color-accent);
}

.rewardCatalogueDialog h5 {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  padding-bottom: 8px;
}

.rewardCatalogueDialog .expiryContainer {
  padding: 16px 0;
  font-size: 0;
}

.rewardCatalogueDialog .expiryContainer>div {
  display: inline-block;
  width: 50%;
}

.rewardCatalogueDialog .expiryContainer p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.rewardCatalogueDialog .rewardStores {
  padding: 24px 0;
  display: none;
}

.rewardCatalogueDialog .rewardStores .store {
  display: flex;
}

.rewardCatalogueDialog .rewardStores .store span {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  width: max-content;
}

.rewardCatalogueDialog .rewardStores .store span:first-child {
  flex-grow: 1;
}

.rewardCatalogueDialog .rewardStores .store span:last-child {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.rewardCatalogueDialog .rewardStores .showMoreStores {
  font-size: 14px;
  line-height: 17px;
  letter-spacing: 0.75px;
  color: var(--color-accent);
  cursor: pointer;
  padding-top: 8px;
}

.voucherDetailsTabWrapper {
  padding: 32px 0 16px;
}

.rewardCatalogueDialog .moreDetails {
  padding-bottom: 32px;
}

.rewardCatalogueDialog .downloadApp {
  padding: 32px 16px 0;
  display: flex;
}

.rewardCatalogueDialog .downloadApp img {
  height: 72px;
}

.rewardCatalogueDialog .downloadApp>div {
  flex-grow: 1;
  padding-left: 40px;
}

.rewardCatalogueDialog .downloadApp>div>p {
  font-size: 16px;
  line-height: 24px;
  padding-bottom: 24px;
  font-weight: 300;
}

.rewardCatalogueDialog .downloadApp>div>p>span {
  font-weight: 500;
}

.rewardCatalogueDialog .downloadApp>div>a {
  display: inline-block;
}

.rewardCatalogueDialog .downloadApp>div>a.IosBtn {
  padding-right: 24px;
}

.rewardCatalogueDialog .downloadApp>div>a>img {
  height: 40px;
}

.closeRewardCatalogueDialogWrapper {
  max-width: 650px;
  text-align: right;
  margin: auto;
  display: block;
  margin-bottom: -39px;
}

.closeRewardCatalogueDialog {
  font-size: 24px;
  color: var(--color-white);
  vertical-align: top;
  cursor: pointer;
}

.voucherDetailsContentWrapper .details,
.voucherDetailsContentWrapper .termConditions {
  font-family: "Rubik", sans-serif;
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
}

.rewardsCatalogueFilterContainer {
  font-size: 0;
  /* padding-bottom: 40px; */
}

.rewardsCatalogueFilterContainer .rewardsCatalogueCatBtn {
  width: max-content;
}

.rewardsCatalogueFilterContainer .rewardsCatalogueCatSwiperContainer {
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 40px;
}

.rewardsCatalogueCatContainer {
  padding-top: 24px;
  padding-bottom: 0;
}

.dropdownRewardsCatalogueType,
.dropdownRewardsCatalogueSortBy {
  width: calc(50% - 50px);
}

.rewardsCatalogueTypeBtn,
.rewardsCatalogueSortByBtn {
  background-color: var(--color-white) !important;
}

.dropdownRewardsCatalogueType {
  margin-right: 100px;
}

/* End Rewards Catalogue */
/* End Vivo Rewards*/

/*Privacy Policy*/
.privacyHeaderContainer {
  max-width: 776px !important;
  width: 100%;
  margin: auto;
  padding: 0 16px !important;
  margin-bottom: 40px;
}

.privacyPolicyPageContent,
.termsOfUsePageContent {
  font-size: 16px;
  line-height: 28px;
  padding-top: 64px;
  padding-bottom: 120px;
  max-width: 744px !important;
  width: 100%;
}

.privacyPolicyPageContent>p {
  padding-bottom: 28px;
}

.privacyPolicyPageContent>p>a {
  color: var(--color-accent);
}

.termsOfUsePageContent a {
  color: var(--color-info) !important;
}

.termsOfUsePageContent>p {
  padding-bottom: 28px;
}

.termsOfUseRow {
  font-size: 0;
}

.termsOfUseNumbering,
.termsOfUseText {
  display: inline-block;
  vertical-align: top;
}

.termsOfUseNumbering h2,
.termsOfUseText h2 {
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.25px;
  padding-bottom: 32px;
}

.termsOfUseNumbering p,
.termsOfUseText p {
  padding-bottom: 32px;
}

.termsOfUseNumbering p,
.termsOfUseText p,
.termsOfUseText li {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 28px;
  letter-spacing: -0.25px;
}

.termsOfUseText ul {
  margin-left: -8px;
}

.termsOfUseText li {
  list-style-position: outside;
  padding-left: 16px;
  padding-bottom: 16px;
}

.termsOfUseListBelow {
  padding-bottom: 16px !important;
}

.termsOfUseLastSubSection {
  padding-bottom: 64px !important;
}

.termsOfUseRow:last-child .termsOfUseLastSubSection {
  padding-bottom: 0 !important;
}

.termsOfUseNumbering p {
  font-weight: 700;
}

.termsOfUseText p {
  font-weight: 400;
}

.termsOfUseNumbering {
  width: 48px;
}

.termsOfUseText {
  width: calc(100% - 48px);
}

/*End Privacy Policy*/

/* Search */
.searchModalContent {
  width: 100%;
  max-width: 720px;
  margin: auto;
  position: relative;
}

.searchModalContent input {
  position: relative;
  width: 100%;
  height: 80px;
  border-radius: 6px;
  padding: 24px 26px 24px 72px;
  font-size: 28px;
  color: var(--color-text);
  line-height: 33px;
  border: none;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  font-weight: 300;
}

/* .searchHeader {
min-height: 320px;
padding-top: calc(35% / 3);
width: 100%;
background: linear-gradient(133.33deg, #9b3cb7 0%, #ff396f 100%);
}

.searchHeader h1 {
color: var(--color-white);
font-family: var(--font-display);
font-size: 48px;
font-weight: bold;
letter-spacing: -1px;
line-height: 48px;
}

.searchHeader .searchBreadcrumb {
color: var(--color-white);
font-family: var(--font-body);
font-size: 14px;
font-weight: 600;
letter-spacing: 1px;
line-height: 24px;
position: relative;
}

.searchHeader .searchBreadcrumb img {
display: inline-block;
width: 24px;
height: 24px;
object-fit: contain;
vertical-align: middle;
z-index: 2;
} */

.searchContainer {
  padding-top: 40px !important;
  padding-bottom: 64px !important;
}

.searchTopBar {
  position: relative;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 64px;
}

aside#searchbox {
  width: 100%;
  padding-right: 0;
  display: inline-block;
}

.searchCatFilterBtn {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  padding: 9px 16px;
  width: 100%;
  text-align: left;
  background-color: var(--color-off-white) !important;
}

.searchCatFilter {
  margin-top: -1px;
  width: 100%;
  font-size: 16px;
  line-height: 28px;
  padding: 10px 16px;
  cursor: pointer;
}

.searchCatFilter li {
  color: var(--color-text);
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  padding: 5px 0;
}

.searchCatFilter li.selectedCat {
  color: var(--color-accent);
}

.searchFilterWrapper {
  width: 352px;
  display: inline-block;
}

#searchbox input {
  padding: 0px 0px 0px 42px;
  font-size: 20px;
  line-height: 32px;
  color: var(--color-text);
  font-weight: 300;
  border: none;
  background: transparent;
  width: -webkit-fill-available;
}

.dropdownSearchCat {
  width: 100%;
}

.ais-SearchBox-reset {
  display: none;
}

#stats {
  padding-bottom: 24px;
}

#stats .ais-Stats-text {
  font-size: 16px;
  line-height: 28px;
  font-weight: 300;
  color: var(--color-text);
  font-family: "Rubik", sans-serif;
}

.searchedPostContent {
  background-color: var(--color-white);
  border-radius: 16px;
}

.ais-Hits-item {
  padding: 0;
  border: none;
  box-shadow: none;
}

.searchedPostImg {
  width: 100%;
  height: 273px;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 16px 16px 0 0;
  border-bottom: 1px solid var(--color-border);
}

.searchedPostTitle {
  color: #323232;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 22px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  margin-bottom: 8px;
}

.searchedPostHappeningType,
.searchedPostPromotionType,
.searchedPostStoreCat,
.searchedPostPress {
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.searchedPost .readmore {
  position: absolute;
}

.searchedPostPeriod,
.searchedPostDesc {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}

.searchedPostDesc {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.searchedPost {
  width: 100%;
  background-color: transparent;
  border-radius: 16px;
}

.searchedPostPress,
.searchedPostPeriod {
  display: none;
}

.searchedPost[data-post-type="post"] .searchedPostPress,
.searchedPost[data-post-type="post"] .searchedPostPeriod {
  display: block;
}

.searchedPost[data-post-type="post"] .searchedPostDesc {
  display: none;
}

.searchedPostDetailsWrapper {
  width: 100%;
  height: 273px;
  position: relative;
  overflow: hidden;
}

.searchedPostDetailsContainer {
  padding: 24px 16px 0 16px;
  position: absolute;
  width: 100%;
}

/* EndSearch */

/* Feedback */
#feedback_page {
  background-color: var(--color-white);
}

#feedback_page h2 {
  font-size: 40px;
  line-height: 64px;
  font-weight: 300;
  padding-bottom: 24px;
}

.feedbackContainer {
  padding-top: 32px !important;
  font-size: 0;
}

.feedbackContainer .feedbackDesc {
  padding-bottom: 12px;
}

.feedbackContainer .feedbackDesc p {
  font-size: 16px;
  line-height: 28px;
  padding-bottom: 28px;
  font-weight: 300;
}

.attachmentField>div>* {
  display: inline-block;
  vertical-align: top;
}

.attachmentField>div>p {
  font-size: 14px;
  line-height: 17px;
  padding: 16px;
  border: 1px solid var(--color-border-strong);
  border-radius: 6px;
  margin: 0;
  cursor: pointer;
}

.attachmentField>div>.attachmentNameContainer {
  width: calc(100% - 110px - 16px) !important;
  margin-right: 16px;
  padding: 8px 16px;
  border: 1px solid var(--color-border-strong);
  border-radius: 6px;
  min-height: 51px;
}

.attachmentField>input {
  display: none;
}

.attachmentNameContainer p {
  font-size: 14px;
  line-height: 17px;
  margin: 0;
  padding: 8px 12px;
  background-color: var(--color-border-light);
  border: 1px solid var(--color-border-strong);
  text-transform: uppercase;
  border-radius: 2px;
  display: inline-block;
  margin-right: 8px;
  margin-bottom: 8px;
  position: relative;
  padding-right: 40px;
}

.attachmentNameContainer i {
  /* margin-left: 16px; */
  -webkit-text-stroke: 0.5px var(--color-border-light);
  cursor: pointer;
  position: absolute;
  right: 12px;
  top: calc(50% - 7px);
}

.feedbackFormSubmitButton {
  width: auto;
  padding: 16px;
  border: none;
  background-color: var(--color-accent);
  font-size: 14px;
  line-height: 17px;
  font-weight: 400;
  color: var(--color-white);
  display: inline-block;
  border-radius: 6px;
  cursor: pointer;
}

.flatpickr-calendar {
  font-family: "Rubik", sans-serif;
}

.flatpickr-calendar .flatpickr-weekdays {
  height: auto;
  padding: 8px 0;
}

.flatpickr-calendar .flatpickr-weekdaycontainer {
  padding: 12px 0;
  border-top: 1px solid #f3f3f3;
  border-bottom: 1px solid #f3f3f3;
}

.flatpickr-calendar .flatpickr-weekday {
  font-weight: 400;
}

.flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-calendar .numInput.cur-year {
  font-size: 14px;
  font-weight: 500;
}

.flatpickr-calendar .flatpickr-day,
.flatpickr-calendar .flatpickr-time * {
  columns: var(--color-text);
}

.flatpickr-calendar .flatpickr-time input.flatpickr-hour {
  font-weight: 400;
}

#feedbackForm .datetimeVisitField {
  position: relative;
}

.datetimeVisitField i {
  font-size: 18px;
  color: var(--color-text);
  -webkit-text-stroke: 0.2px var(--color-white);
  position: absolute;
  right: 16px;
  top: 46px;
  cursor: pointer;
}

/* End Feedback */

.homepageSecondTitleSection {
  margin-top: 120px;
}

.homepageSecondTitle {
  width: 70%;
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 64px;
  font-weight: bold;
  letter-spacing: -3px;
  line-height: 80px;
}

.whatsOnTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 48px;
  font-weight: bold;
  letter-spacing: -1px;
  line-height: 48px;
  text-align: center;
  padding-top: 32px;
}

.homepageBtnRow {
  margin-top: 40px;
  margin-bottom: 64px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.homepageBtnRowMobile {
  display: none;
}

.btnWhatsOnSelected,
.btnWhatsOn.btnWhatsOnSelected {
  border-radius: 24px;
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent));
  padding: 8px 20px;
  margin-right: 8px;
  opacity: 1;
}

.btnWhatsOnSelected:hover,
.btnWhatsOn.btnWhatsOnSelected:hover {
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
}

.btnWhatsOnLabel {
  color: var(--color-white);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.btnWhatsOn {
  opacity: 0.5;
  border-radius: 24px;
  background-color: var(--color-black);
  padding: 8px 20px;
  margin-right: 8px;
}

.btnWhatsOn:hover,
.btnWhatsOn:active,
.btnWhatsOn:focus {
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
  opacity: 1;
}

.lastCatSection {
  margin-top: 64px;
  margin-bottom: 0;
  padding-bottom: 120px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.lastCatSection .homepageCatBtn {
  margin-bottom: 0;
}

.homepageCatBtn {
  box-sizing: border-box;
  border: 2px solid var(--color-accent);
  background: transparent;
  border-radius: 28px;
  padding: 10px 24px;
}

.homepageCatBtn:hover {
  background-color: var(--color-accent);
  border: 2px solid var(--color-accent);
  transition: all 0.25s;
}

.homepageCatBtn:hover .homepageCatBtnText {
  color: var(--color-white) !important;
}

.homepageCatBtnText {
  color: var(--color-accent);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.lastCardRow {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
}

.cardText {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  position: absolute;
  bottom: 40px;
  left: 32px;
  z-index: 12;
}

div.diningThumbImg .cardText {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  position: absolute;
  bottom: 40px;
  left: 32px;
  z-index: 10;
}

div.kidsThumbImg .cardText {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  position: absolute;
  bottom: 40px;
  left: 80px;
  z-index: 10;
}

.happeningPostWrapper,
.promotionPost {
  border-radius: 16px;
}

div#store_promotions .promotionPageTypeTabContent {
  padding-top: 0;
}

div#store_promotions {
  padding-top: 0;
}

.promotionsPage div#kids_club_offers .promotionPageTypeTabContent,
.promotionsPage div#kids_club_birthday_offers .promotionPageTypeTabContent {
  margin-left: 0;
}

.promotionsPage div#kids_club_offers .promotionPost,
.promotionsPage div#kids_club_birthday_offers .promotionPost {
  width: calc(25% - 16px);
}

.exploreNewSection {
  /* max-height: 1924px; */
  display: block;
}

.exploreNewSectionMobile {
  display: none;
}

.homepageMainTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 80px;
  font-weight: bold;
  letter-spacing: -3px;
  line-height: 80px;
  max-width: 60%;
  width: calc(100% - 16px);
  margin-top: 64px;
  float: right;
  position: relative;
  z-index: 2;
}

.cardSection {
  margin-bottom: 80px;
}

div#happeningSection .divider,
div#promoSection .divider,
div#kidsSection .divider,
div#newStoreSection .divider {
  background-color: var(--color-border-light);
  height: 1px;
  margin-top: 26px;
  margin-bottom: 40px;
}

div#happeningSection .iconDropdown,
div#happeningSection .iconClearable,
div#promoSection .iconDropdown,
div#kidsSection .iconDropdown,
div#newStoreSection .iconDropdown,
.whatsOnCatHomeBtn .iconDropdown {
  float: right;
  margin-left: auto;
  position: relative;
  top: 1px;
  font-size: 20px;
}

div#happeningSection .iconFilter,
div#promoSection .iconFilter,
div#kidsSection .iconFilter,
div#directoryRevamp .iconFilter {
  float: right;
  margin: auto;
  position: relative;
  top: 1px;
  transition: transform 0.25s ease;
  font-size: 20px;
}

div#directoryRevamp .iconFilter i,
div#directoryRevamp .iconDropdown i,
div#whatsOnRevamp .whatsOnCatBtn[aria-expanded="true"] .iconDropdown i,
div#whatsOnRevamp .whatsOnFilterBtn[aria-expanded="true"] .iconFilter i {
  transition: transform 0.25s ease;
}

div#directoryRevamp .dropdown.show .iconFilter i,
div#directoryRevamp .dropdown.show .iconDropdown i,
div#directoryRevamp .whatsOnFilterBtn[aria-expanded="true"] .iconFilter i,
div#directoryRevamp .categoryFilterBtn[aria-expanded="true"] .iconDropdown i,
div#whatsOnRevamp .whatsOnCatBtn[aria-expanded="true"] .iconDropdown i,
div#whatsOnRevamp .whatsOnFilterBtn[aria-expanded="true"] .iconFilter i {
  transform: rotate(180deg);
}

div#directoryRevamp .iconFilter i.rotated,
div#directoryRevamp .iconDropdown i.rotated {
  transform: rotate(180deg);
}

div#whatsOnRevamp .dropdown {
  position: relative;
  display: inline-block;
  /* background: white; */
  border-radius: 25px;
}

.selectedDate {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
  text-align: left;
}

.whatsOnBtnRow {
  margin-top: 8px;
  margin-bottom: 40px;
  display: block;
}

.whatsOnBtnRowMobile {
  display: none;
}

.btnWhatsOnSelected {
  border-radius: 24px;
  background-color: var(--color-accent);
  padding: 8px 20px;
  margin-right: 8px;
}

.btnWhatsOnLabel {
  color: var(--color-white);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.btnWhatsOn {
  opacity: 0.5;
  border-radius: 24px;
  background-color: var(--color-black);
  padding: 8px 20px;
  margin-right: 8px;
}

div#whatsOnRevamp .happeningDiv .happeningPostWrapper {
  display: inline-block;
  margin: 0;
  padding: 8px;
  position: relative;
  transition: 0.25s all;
  background-color: transparent;
  overflow: visible;
  height: 720px;
  vertical-align: top;
}

/* div#whatsOnRevamp .happeningDiv .happeningPostWrapper:nth-child(1) {
width: 66.7%;
}

div#whatsOnRevamp .happeningDiv .happeningPostWrapper:nth-child(2),
div#whatsOnRevamp .happeningDiv .happeningPostWrapper:nth-child(n + 3) {
width: 33.3%;
} */

div#whatsOnRevamp .happeningDiv .happeningPostWrapper:nth-child(n) {
  width: 33.3%;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(1) .happeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  background-color: var(--color-white);
  overflow: hidden;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(2) .happeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  background-color: var(--color-white);
  overflow: hidden;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n + 3) .happeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  background-color: var(--color-white);
  overflow: hidden;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningBox .happeningPostImage {
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 360px;
  background-color: var(--color-white);
  background-repeat: no-repeat;
  border-radius: 16px 16px 0 0;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(1) .happeningPostContentWrapper {
  position: relative;
  width: 100%;
  height: 50%;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(2) .happeningPostContentWrapper {
  position: relative;
  width: 100%;
  height: 50%;
}

div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n + 3) .happeningPostContentWrapper {
  position: relative;
  width: 100%;
  height: 50%;
}

div#whatsOnRevamp .whatsNewDiv .happeningPostWrapper {
  width: 33.3%;
  display: inline-block;
  margin: 0;
  padding: 8px;
  position: relative;
  transition: 0.25s all;
  background-color: transparent;
  overflow: visible;
  height: 682px;
  padding: 8px;
}

div#whatsOnRevamp .whatsNewDiv .happeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  position: relative;
  background-color: var(--color-white);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  overflow: hidden;
}

div#whatsOnRevamp .whatsNewDiv .happeningPostImage {
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 360px;
  background-color: var(--color-white);
  background-repeat: no-repeat;
  border-radius: 16px 16px 0 0;
}

div#whatsOnRevamp .whatsNewDiv .happeningPostContentWrapper {
  position: relative;
  width: 100%;
  height: 40%;
}

div#atrium_events {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: minmax(100px,
      auto);
  /* set the minimum and maximum row height */
  grid-gap: 16px;
  /* add gap between grid items */
}

div#whatsOnRevamp .eventsDiv .happeningPostWrapper {
  width: 100%;
  height: auto;
}

div#whatsOnRevamp .eventsDiv .happeningPostImage {
  background-size: cover;
  background-position: center;
  width: 100%;
  background-color: var(--color-white);
  background-repeat: no-repeat;
}

div#whatsOnRevamp .eventsDiv .smallHappeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div#whatsOnRevamp .newStoreDiv .happeningPostWrapper {
  width: 270px;
  margin-right: 16px;
  display: inline-block;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
  border-radius: 16px;
}

div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(4n) {
  width: 270px;
  margin-right: 0;
  display: inline-block;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
  border-radius: 16px;
}

div#whatsOnRevamp .newStoreDiv .happeningBox {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div#whatsOnRevamp .newStoreDiv .happeningPostImage {
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 270px;
  background-color: var(--color-white);
  background-repeat: no-repeat;
}

div#whatsOnRevamp .newStoreDiv .happeningPostContentWrapper {
  position: relative;
  width: 100%;
  height: 50%;
}

div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent {
  padding-bottom: 0;
  padding-top: 0;
}

div#whatsOnRevamp div#promoSection .promotionsPage div#store_promotions .promotionPost {
  /* width: 50%; */
  width: 33.3%;
  margin: 0;
  display: inline-block;
  position: relative;
  transition: 0.25s all;
  background-color: transparent;
  overflow: visible;
  height: 682px;
  padding: 8px;
}

/* div#whatsOnRevamp
div#promoSection
.promotionsPage
div#store_promotions
.promotionPost:not(:nth-child(2n)) {
padding: 8px 8px 8px 0;
}

div#whatsOnRevamp
div#promoSection
.promotionsPage
div#store_promotions
.promotionPost:nth-child(2n) {
padding: 8px 0 8px 8px;
} */

div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent .promotionContent {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-white);
  border-radius: 16px;
  overflow: hidden;
}

div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent .promotionPageImg {
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 360px;
  background-color: var(--color-white);
  background-repeat: no-repeat;
  border-radius: 16px 16px 0 0;
  border-bottom: solid 1px var(--color-border);
}

div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent .promotionDetailsWrapper {
  position: relative;
  width: 100%;
  height: 40%;
  top: -30px;
}

.sectionTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
  margin-top: 40px;
  margin-bottom: 24px;
}

div#store_promotions .sectionTitle {
  padding-bottom: 24px;
}

.whatsOnCatBtn {
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background-color: var(--color-white);
  padding: 8px 16px;
  max-height: 44px;
  max-width: 288px;
  text-align: left;
}

.whatsOnCatBtn.newStoreSection {
  display: flex;
}

.whatsOnCatBtn.storehighlightsSection,
.whatsOnCatBtn.newStoreSection,
.whatsOnCatBtn.kidsClubSection {
  min-width: 288px;
}

.whatsOnCatBtn.whatsOnCatBtnSH,
.whatsOnCatBtn.mallhappeningSection {
  min-width: 280px;
}

.whatsOnCatBtn:focus,
.whatsOnCatBtn:active,
.whatsOnCatHomeBtn:focus,
.whatsOnCatHomeBtn:active,
#homepageDropDownMobile.homepage-whats-on-dropdown.is-open .whatsOnCatHomeBtn {
  background: var(--color-white) !important;
  border-color: var(--color-border);
}

.whatsOnCatBtnText {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 27px;
}

.whatsOnFilterBtn {
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background-color: var(--color-white);
  padding: 8px 16px;
  max-height: 44px;
  max-width: 200px;
  min-width: 200px;
  text-align: left;
  margin: auto;
}

#filterBtnStoreHighlight .whatsOnFilterBtn {
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background-color: var(--color-white);
  padding: 8px 16px;
  max-height: 44px;
  max-width: 210px;
  min-width: 210px;
  text-align: left;
  margin: auto;
}

.categoryFilterBtn {
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background-color: var(--color-white);
  padding: 8px 16px;
  max-height: 44px;
  min-width: -webkit-fill-available;
  display: flex;
  text-align: left;
  position: relative;
  margin-left: 8px;
}

.whatsOnFilterBtnText {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 27px;
}

.filter-indicator-desktop {
  visibility: hidden;
  right: 44px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  position: absolute;
  background-color: var(--color-accent);
  color: white;
  width: 24px;
  height: 24px;
  text-align: center;
  border-radius: 50%;
  font-size: 14px;
  line-height: 24px;
  font-weight: 700;
}

.filter-indicatorSH-desktop {
  visibility: hidden;
  right: 50px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  position: absolute;
  background-color: var(--color-accent);
  color: white;
  width: 24px;
  height: 24px;
  text-align: center;
  border-radius: 50%;
  font-size: 14px;
  line-height: 24px;
  font-weight: 700;
}

.container.show {
  z-index: 99999;
}

.catSection {
  margin-top: 40px;
  margin-bottom: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.showAllBtn {
  border-radius: 24px;
  background: linear-gradient(to right, var(--color-magenta), var(--color-accent));
  padding: 8px 20px;
  margin-right: 8px;
}

.showAllBtn:hover {
  background-color: var(--color-accent);
  opacity: 0.5;
}

.showAllBtnLabel {
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
}

div#whatsOnRevamp #eventSection {
  margin-top: 40px;
}

li.selectedDate.selectedDateDropdownBtn a,
li.selectedDate:hover {
  background-color: unset !important;
  color: var(--color-accent) !important;
  font-weight: 400;
}

li.selectedDate {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
  cursor: pointer;
}

div#kidsSection .promotionsPage div#kids_club_offers .promotionPageTypeTabContent,
.promotionsPage div#kids_club_birthday_offers .promotionPageTypeTabContent {
  margin-left: 0;
}

div#kidsSection .promotionsPage div#kids_club_offers .promotionPost,
.promotionsPage div#kids_club_birthday_offers .promotionPost {
  width: 270px;
  display: inline-block;
  margin-right: 16px;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: visible;
  height: 546px;
}

div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(4n) {
  width: 270px;
  display: inline-block;
  margin-right: 0;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
}

div.whatsOnContainer .promotionPost:nth-child(n) {
  width: 270px;
  display: inline-block;
  margin-right: 10px;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
}

div.whatsOnContainer .promotionPost:nth-child(4) {
  width: 270px;
  display: inline-block;
  margin-right: 0;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
}

div#kidsSection div#kids_club_offers .promotionPageTypeTabContent .promotionPageImg,
div.whatsOnContainer .promotionPost .promotionImg {
  box-shadow: none;
  margin-bottom: 0;
  height: 270px;
}

div#kidsSection div#kids_club_offers .promotionPageTypeTabContent .promotionDetailsWrapper .promotionDetailsContainer .promotionDesc {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}

#datepickerSH {
  border: 1px solid var(--color-border-light);
  border-radius: 24px;
  background-color: var(--color-gray-100);
  max-height: 44px;
  max-width: 280px;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
  padding: 8px 0 7px 16px;
  min-width: 280px;
}

/* .whatsOnRevamp {
max-width: 1160px !important;
} */

.storeMenuContainerRow {
  border-radius: 48px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 10px 10px;
}

.storeCat.container.contentContainer .searchBar input {
  background: var(--color-white);
}

div#directoryRevamp .dropdown button.directorybtn.btn-default.dropdown-toggle,
.dropdownStoreCat button.directorybtn.btn-default.dropdown-toggle {
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background-color: var(--color-white);
}

.selectedCat {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
}

#findAStoreSection .selectedCat,
.whatsOnCatBtnText.catBtnNS {
  display: -webkit-inline-box;
  width: -webkit-fill-available;
  height: 28px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.postCounter {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
}

.postCounter.guidePage {
  margin-top: 43px;
  margin-bottom: 27px;
}

.hitsCounter .ais-Stats {
  margin-top: 67px;
  margin-bottom: 27px;
  word-break: break-word;
}

.hitsCounter .ais-Stats-text {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 40px;
}

.guideListWrapper,
.ais-Hits-item {
  border-radius: 16px;
  background-color: transparent;
}

div#algolia_store_tags_list .ais-Hits {
  margin-top: 0;
}

.popularSectionTitle {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 24px;
}

.popularTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 28px;
  position: absolute;
  bottom: 10px;
  left: 10px;
}

.popularImg {
  border-radius: 12px;
  height: 119px;
  width: 100%;
  object-fit: cover;
}

.popularDirectorySection {
  display: flex;
}

.directoryRevamp.container {
  padding: 0 !important;
  max-width: 1128px !important;
}

div#happeningSection .dropDownPromoWrapper {
  margin-top: 50px;
  display: flex;
  justify-content: left;
  align-items: center;
}

.whatsOnCatHomeBtn .dropdown-menu {
  min-width: 250px;
  border-radius: 8px;
  margin-top: 8px;
}

.calendarBtnContainer {
  margin-left: 22px;
  position: relative;
}

.calendarBtn,
.filterBtn {
  max-height: 44px;
  max-width: 44px;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background-color: var(--color-white);
  text-align: center;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.calendarBtn.active,
.calendarBtn:hover {
  background-color: var(--color-accent);
  border: 1px solid white;
}

.calendarBtn.active .calendarIcon,
.calendarBtn:hover .calendarIcon {
  color: white;
}

.whatsOnTopBar {
  margin-top: 40px;
  display: flex;
  justify-content: left;
}

div#kidsSection .whatsOnTopBar {
  justify-content: right;
}

div#newStoreSection .postCounterSection {
  width: 75%;
}

div#newStoreSection .categorySection {
  width: 25%;
}

.filterSection {
  margin-left: 8px;
}

div#store_promotions .filterSection {
  margin-left: 23%;
}

.filterSection .dropdownPromoPage .dropdown,
.categorySection.dropdownPromoPage.dropdown {
  padding-left: 0;
  background: white;
}

div#findAStoreSection .dropdown button.directorybtn.btn-default.dropdown-toggle::after,
.dropdown button.searchCatFilterBtn::after,
.dropdownStoreCat button.directorybtn.btn-default.dropdown-toggle::after {
  content: "";
}

div#findAStoreSection .dropdown-submenu {
  width: 100%;
}

div#findAStoreSection .dropdown-submenu:not(:last-child) {
  border-bottom: 1px solid var(--color-border-light);
}

div#findAStoreSection .dropdown-submenu a {
  width: 100%;
  display: flex;
  padding: 14px 16px;
  justify-content: space-between;
  color: black;
}

div#findAStoreSection .iconDropdown {
  float: right;
  position: relative;
  top: 1px;
  font-size: 20px;
}

.dropdown-menu>li>a {
  width: -webkit-fill-available;
  cursor: pointer;
}

div#findAStoreSection .dropdown button.directorybtn.btn-default.dropdown-toggle,
.dropdownStoreCat button.directorybtn.btn-default.dropdown-toggle {
  padding: 8px 16px;
}

.promoEnterButton,
.promoEnterButtonSH,
.promoEnterButtonWN,
.promoEnterButtonKC,
.promoEnterButtonMH,
.promoEnterButtonNS {
  display: none;
  height: 40px;
  width: 40px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
  border-radius: 50%;

  position: absolute;
  right: 24px;
  bottom: 24px;
}

div.happeningPostWrapper .promoEnterButton,
div.guideListWrapper .promoEnterButton,
div.promotionPost .promoEnterButtonSH,
div.happeningPostWrapper .promoEnterButtonWN,
div.promotionPost .promoEnterButtonKC,
div.happeningPostWrapper .promoEnterButtonMH,
div.happeningPostWrapper .promoEnterButtonNS,
div.searchedPost .promoEnterButton,
div.pressRoomBox .pressRoomEnterButton,
a.mediaKitLinkWrapper .pressKitEnterButton {
  display: block;
  opacity: 0;
  visibility: hidden;
  bottom: -80px;
  transition: all 0.4s ease;
  will-change: bottom;
}

.promoEnterButton img,
.promoEnterButtonSH img,
.promoEnterButtonWN img,
.promoEnterButtonKC img,
.promoEnterButtonMH img,
.promoEnterButtonNS img {
  object-fit: cover;
}

div.happeningPostWrapper:hover .promoEnterButton,
div.promotionPost:hover .promoEnterButton,
div.guideListWrapper:hover .promoEnterButton,
div.promotionPost:hover .promoEnterButtonSH,
div.happeningPostWrapper:hover .promoEnterButtonWN,
div.promotionPost:hover .promoEnterButtonKC,
div.happeningPostWrapper:hover .promoEnterButtonMH,
div.happeningPostWrapper:hover .promoEnterButtonNS,
div.pressRoomBox:hover .pressRoomEnterButton,
div.searchedPostContent:hover .promoEnterButton,
a.mediaKitLinkWrapper:hover .pressKitEnterButton {
  display: block;
  transition: all 0.4s ease;
  visibility: visible;
  opacity: 1;
  will-change: top;
}

div.guideListWrapper:hover .promoEnterButton,
div.searchedPost:hover .promoEnterButton {
  bottom: 0px;
}

div#whatsOnRevamp div#store_promotions div.promotionPost:hover .promoEnterButtonSH,
div.happeningPostWrapper:hover .promoEnterButtonWN {
  bottom: -10px;
}

div#kidsSection div.promotionPost:hover .promoEnterButtonKC,
div#whatsOnRevamp div#mall_promotions div.happeningPostWrapper:hover .promoEnterButton {
  bottom: 45px;
}

div.promotionPost:hover .promoEnterButtonSH {
  bottom: 50px;
}

div.promotionPost:hover .promoEnterButtonKC,
div.promotionPost:hover .promoEnterButtonSH,
div.happeningPostWrapper:hover .promoEnterButton,
div.happeningPostWrapper:hover .promoEnterButtonMH,
div.happeningPostWrapper:hover .promoEnterButtonNS,
div.searchedPostContent:hover .promoEnterButton,
div.pressRoomBox:hover .pressRoomEnterButton,
a.mediaKitLinkWrapper:hover .pressKitEnterButton,
div#homepageWhatsOn div#kidsSection div.promotionPost:hover .promoEnterButtonKC {
  bottom: 24px;
}

.hasPromotionTagWrapper {
  box-sizing: border-box;
  border-radius: 4px;
  padding: 7px 8px;
  background-color: var(--color-accent);
}

.promoTagText {
  color: white;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.75px;
  line-height: 10px;
}

.headerHomeText {
  padding-left: 9px;
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 24px;
  margin-left: 9px;
}

.headerHomeIcon {
  font-size: 20px !important;
}

.headerHomeIcon2 {
  font-size: 20px !important;
  left: unset !important;
}

.mainCalendar {
  visibility: hidden;
  position: absolute;
  top: 0;
  width: 100%;
}


div#store_promotions.swiper.whatsOnContainer {
  overflow: unset;
}

.homepageCallToActionButton {
  margin-top: 40px;
  margin-bottom: 72px;
}

/* Divi related */
.et_pb_image_wrap img {
  object-fit: cover;
}

/*this sets the height of the image module*/
.pa-full-height-image-column {
  height: 100% !important;
}

/*this sets the height of the image container*/
.pa-full-height-image-column .et_pb_image_wrap {
  height: 100% !important;
}

/*this sets the height and fit of the actual image*/
.pa-full-height-image-column img {
  object-fit: cover;
  height: 100% !important;
}

.filterIcon {
  height: 24px;
  width: 24px;
  margin-right: 12px;
}

.ais-SearchBox-submit {
  top: 55% !important;
  left: 14px;
}

.popularButton {
  height: 40px;
  width: 40px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
  border-radius: 50%;

  position: absolute;
}

.popularButton img {
  object-fit: cover;
}

#datepicker {
  border: 1px solid var(--color-border-light);
  border-radius: 24px;
  background-color: var(--color-gray-100);
  max-height: 44px;
  max-width: 280px;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
  padding: 8px 0 7px 16px;
  min-width: 280px;
}

.storeCat.container.contentContainer.searchPage {
  padding: 64px 0 0 0 !important;
}

.guideListWrapper,
.ais-Hits-item {
  border-radius: 16px;
  background-color: transparent;
}

.ais-Hits {
  margin-top: 64px;
}

#tags-list .ais-Hits {
  margin-top: 0;
  margin-bottom: 80px;
}

.popularSectionTitle {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 24px;
}

.popularTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.5px;
  line-height: 28px;
  position: absolute;
  bottom: 10px;
  left: 10px;
}

.popularImg {
  border-radius: 12px;
  height: 119px;
  width: 100%;
  object-fit: cover;
}

.popularDirectorySection {
  display: flex;
}

.directoryRevamp {
  max-width: 1128px !important;
}

.dropdown-menu {
  font-size: 16px;
}

div#happeningSection .dropDownPromoWrapper {
  margin-top: 50px;
  display: flex;
  justify-content: left;
  align-items: center;
}

div#filterBtnDirectory .dropdown-menu {
  margin-top: 8px;
  width: 300px;
  float: none;
  left: auto;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 0;
  z-index: 11;
  overflow: hidden;
}

@media (min-width: 769px) {

  div#directoryRevamp.storeMenuContainer,
  div#directoryRevamp .storeMenuContainerRow,
  div#directoryRevamp .filterWrapper,
  div#directoryRevamp #filterBtnDirectory,
  div#directoryRevamp #findAStoreSection {
    overflow: visible;
  }

  div#directoryRevamp .storeMenuContainerRow {
    align-items: flex-start;
  }

  div#directoryRevamp .searchBar {
    flex: 1 1 auto;
    min-width: 0;
  }

  div#directoryRevamp .filterWrapper {
    flex: 0 0 auto;
  }

  div#directoryRevamp #filterBtnDirectory {
    position: relative;
  }

  div#directoryRevamp #findAStoreSection {
    position: relative;
  }

  div#filterBtnDirectory .whatsOnFilterBtn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: 200px;
    padding: 8px 52px 8px 16px;
    position: relative;
  }

  div#filterBtnDirectory .filterIcon {
    margin-right: 0;
    flex: 0 0 24px;
  }

  div#filterBtnDirectory .whatsOnFilterBtnText {
    line-height: 24px;
  }

  div#filterBtnDirectory .filter-indicator-desktop {
    right: 40px;
  }

  div#directoryRevamp .iconFilter {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
  }

  div#filterBtnDirectory .dropdown-menu {
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    margin-top: 0;
  }

  div#directoryRevamp #directoryDesktopFilters>li.dropdown-submenu,
  div#directoryRevamp #desktopGuideCategories>li.dropdown-submenu {
    width: 100%;
    right: auto;
  }

  div#directoryRevamp #directoryDesktopFilters>li.dropdown-submenu>a,
  div#directoryRevamp #desktopGuideCategories>li.dropdown-submenu>a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  div#directoryRevamp #directoryDesktopFilters>li.dropdown-submenu>a>.checkboxContainer,
  div#directoryRevamp #directoryDesktopFilters .dropdown-menu.submenulist>li>a>.checkboxContainer {
    flex: 0 0 24px;
  }

  div#directoryRevamp #directoryDesktopFilters>li.dropdown-submenu>a>span:last-child,
  div#directoryRevamp #desktopGuideCategories>li.dropdown-submenu>a>span:last-child {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
  }

  div#directoryRevamp #directoryDesktopFilters .dropdown-menu.submenulist,
  div#directoryRevamp #desktopGuideCategories .dropdown-menu.submenulist {
    display: none;
    position: relative;
    top: auto;
    left: 0;
    width: 100%;
  }

  div#directoryRevamp #directoryDesktopFilters .dropdown-menu.submenulist>li,
  div#directoryRevamp #desktopGuideCategories .dropdown-menu.submenulist>li {
    width: 100%;
  }

  div#directoryRevamp #directoryDesktopFilters .dropdown-menu.submenulist>li>a,
  div#directoryRevamp #desktopGuideCategories .dropdown-menu.submenulist>li>a {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 12px;
  }

  div#directoryRevamp #findAStoreSection .dropdown-menu {
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    margin-top: 0;
    min-width: 100%;
  }

  div#filterBtnStoreHighlight .whatsOnFilterBtn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: 210px;
    padding: 8px 52px 8px 16px;
    position: relative;
  }

  div#filterBtnStoreHighlight .filterIcon {
    margin-right: 0;
    flex: 0 0 24px;
  }

  div#filterBtnStoreHighlight .whatsOnFilterBtnText {
    line-height: 24px;
  }

  div#filterBtnStoreHighlight .filter-indicatorSH-desktop {
    right: 40px;
  }

  div#filterBtnStoreHighlight .iconFilter {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
  }
}

div#filterBtnStoreHighlight .dropdown-menu {
  margin-top: 0;
  width: max-content;
  max-width: 256px;
  float: none;
  left: 20px;
  top: calc(100% + 8px);
  position: absolute;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 0;
  z-index: 11;
  overflow: hidden;
  display: none;
}

div#happeningDateDropDown .dropdown-menu {
  margin-top: 0;
  width: 100%;
  max-width: 280px;
  float: none;
  left: auto;
  top: calc(100% + 8px);
  position: absolute;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 0;
  overflow: hidden;
  z-index: 20;
  display: none;
}

div#happeningDateDropDown.dropdown {
  position: relative;
  z-index: 12;
}

div#happeningDateDropDown .dropdown-menu.show,
div#happeningDateDropDown.open>.dropdown-menu {
  display: block;
}

div#storeHighlightDateDropDown .dropdown-menu {
  margin-top: 0;
  top: calc(100% + 8px);
  position: absolute;
  display: none;
  z-index: 20;
}

div#storeHighlightSection .dropdown-menu,
div#kidsCategoryDropDown .dropdown-menu,
div#newStoreSection .categorySection.dropdown .dropdown-menu {
  margin-top: 0;
  top: calc(100% + 8px);
  position: absolute;
  display: none;
  z-index: 20;
}

div#storeHighlightDateDropDown.dropdown,
div#filterBtnStoreHighlight.dropdown,
div#storeHighlightSection.dropdown,
div#kidsCategoryDropDown.dropdown,
div#newStoreSection .categorySection.dropdown {
  position: relative;
  z-index: 12;
}

div#filterBtnStoreHighlight .dropdown-menu.show,
div#filterBtnStoreHighlight.open>.dropdown-menu,
div#storeHighlightDateDropDown .dropdown-menu.show,
div#storeHighlightDateDropDown.open>.dropdown-menu,
div#storeHighlightSection .dropdown-menu.show,
div#storeHighlightSection.open>.dropdown-menu,
div#kidsCategoryDropDown .dropdown-menu.show,
div#kidsCategoryDropDown.open>.dropdown-menu,
div#newStoreSection .categorySection.dropdown .dropdown-menu.show,
div#newStoreSection .categorySection.dropdown.open>.dropdown-menu {
  display: block;
}

div#kidsSection .dropdown-menu,
div#storeHighlightSection .dropdown-menu,
div#storeHighlightDateDropDown .dropdown-menu {
  margin-top: 8px;
  width: 100%;
  max-width: 288px;
  float: none;
  left: auto;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 0;
  overflow: hidden;
}

div#findAStoreSection .dropdown-menu {
  margin-top: 8px;
  width: 100%;
  min-width: 290px;
  float: none;
  left: -15px;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 0;
  height: 261px;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 11;
}

div#findAStoreSection .dropdown-menu.submenulist {
  margin-top: 0;
  height: fit-content;
}

ul.dropdown-menu.submenulist {
  border-radius: 0 !important;
  background-color: transparent !important;
  left: 0 !important;
  box-shadow: none !important;
}

div#newStoreSection .dropdown-menu {
  margin-top: 0;
  width: 100%;
  max-width: 288px;
  float: none;
  left: 0;
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
  padding: 0;
  height: 261px;
  overflow-y: auto;
  z-index: 11;
}

li.selectedPromotionPageSubCat a,
li.selectedDate a {
  padding: 14px 16px;
}

li.selectedPromotionPageSubCat:not(:last-child),
li.selectedDate:not(:last-child) {
  border-bottom: 1px solid var(--color-border-light);
}

li.selectedPromotionPageSubCat,
li.selectedDate {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

div#directoryRevamp .ais-SearchBox-input {
  font-family: var(--font-body);
  font-size: 16px;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.iconNextMobile {
  display: none;
}

.storeContentSection,
.storeContentSectionSecond {
  display: flex;
  padding-top: 8px;
}

.storeLotIcon,
.storeCatIcon {
  margin-top: 3px;
  height: 16px;
  width: 16px;
  object-fit: contain;
}

.halalIcon {
  height: 16px;
  width: 16px;
  object-fit: contain;
}

div.guideListWrapper:hover .storeLotIcon {
  content: url(https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677556459/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_location_selected.png);
}

div.guideListWrapper:hover .storeCatIcon {
  content: url(https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677556459/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_tag_selected.png);
}

div.guideListWrapper:hover .halalIcon {
  content: url(https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677556459/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_halal_selected.png);
}

.storeTextContent {
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  padding-left: 12px;
}

.storePromoText {
  color: var(--color-accent);
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.75px;
  line-height: 10px;
}

img.newStoreTag {
  height: 64px;
  width: 64px;
  border-top-left-radius: 16px;
}

img.kidsClubStoreTag,
img.dbsStoreTag,
img.halalStoreTag,
img.touristStoreTag {
  height: 24px;
}

.tagSection div:not(:first-child) img.kidsClubStoreTag,
.tagSection div:not(:first-child) img.dbsStoreTag,
.tagSection div:not(:first-child) img.halalStoreTag,
.tagSection div:not(:first-child) img.touristStoreTag {
  padding-left: 12px;
}

.tagSection {
  margin-left: 16px;
  max-height: 24px;
  min-height: 24px;
}

div#kids_content .tagSection {
  display: block;
  width: fit-content;
}

.tagSectionMobile {
  display: none;
}

.birthdayTagText {
  color: white;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.75px;
  line-height: 10px;
}

.hasBirthdayTagWrapper {
  color: white;
  box-sizing: border-box;
  border: none;
  border-radius: 4px;
  padding: 7px 8px;
  background-color: #53b7d8;
}

.daterangepicker {
  border-radius: 16px !important;
  background-color: var(--color-white) !important;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1) !important;
  min-width: 378px !important;
  border: none !important;
  z-index: 29 !important;
}

.daterangepicker:before {
  border-right: none !important;
  border-left: none !important;
  border-bottom: none !important;
}

/* .daterangepicker .calendar-table table{
border-collapse: separate!important;
} */

.daterangepicker thead {
  position: relative;
  top: 0;
}

.daterangepicker .drp-calendar.left .calendar-table tbody {
  border-top: 2px solid var(--color-gray-100) !important;
}

.daterangepicker .drp-calendar.left .drp-buttons {
  border-top: 2px solid var(--color-gray-100) !important;
}

.daterangepicker .drp-calendar.left .calendar-table {
  padding: 0 !important;
}

.daterangepicker .drp-calendar.right {
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
}

.daterangepicker .drp-calendar.right tbody {
  display: none !important;
}

.daterangepicker .drp-calendar.right thead>tr:nth-child(2) {
  display: none !important;
}

.daterangepicker .drp-calendar.right th.month {
  display: none !important;
}

.daterangepicker .drp-calendar.right .calendar-table {
  background: transparent !important;
}

.daterangepicker .daterangepicker.ltr .ranges,
.daterangepicker.ltr .drp-calendar {
  float: none !important;
}

.daterangepicker .drp-calendar.right .daterangepicker_input {
  position: absolute !important;
}

.daterangepicker .drp-calendar.left {
  min-width: 378px !important;
  padding: 16px 0 11px 0 !important;
}

.daterangepicker .drp-calendar.right {
  padding: 16px 0 0 0 !important;
}

.daterangepicker .calendar-table th.month {
  color: var(--color-text) !important;
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  font-weight: bold !important;
  letter-spacing: -0.25px !important;
  line-height: 28px !important;
}

.daterangepicker .calendar-table th {
  color: var(--color-muted) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  line-height: 24px !important;
  text-align: center !important;
}

.daterangepicker .drp-calendar.right .calendar-table th {
  min-width: 53px !important;
  height: 39px !important;
}

.daterangepicker .calendar-table tr {
  height: 20px !important;
  min-width: 20px !important;
  width: 20px !important;
}

.daterangepicker .calendar-table .prev span,
.daterangepicker .calendar-table .next span {
  border: none !important;
  transform: none !important;
  -webkit-transform: none !important;
}

.daterangepicker .calendar-table .prev span::before {
  font-size: 20px !important;
  content: "\f0d9" !important;
  font-family: "Font Awesome 5 Free" !important;
  font-weight: 900 !important;
  color: black !important;
}

.daterangepicker .calendar-table .next span::before {
  font-size: 20px !important;
  content: "\f0da" !important;
  font-family: "Font Awesome 5 Free" !important;
  font-weight: 900 !important;
  color: black !important;
}

.daterangepicker .calendar-table td {
  font-family: var(--font-body) !important;
  font-size: 16px !important;
  font-weight: bold !important;
  letter-spacing: -0.25px !important;
  line-height: 20px !important;
  text-align: center !important;
  padding: 16px !important;
  height: inherit !important;
  min-width: 0 !important;
  width: 0 !important;
  border: 0px !important;
  border-radius: 0px !important;
  position: relative !important;

}

.daterangepicker td.in-range {
  background-color: rgba(0, 0, 0, 0.05) !important;
}

.daterangepicker .drp-selected {
  display: none !important;
}

.daterangepicker .btn {
  border: none !important;
}

.daterangepicker .btn-default,
.daterangepicker .btn-primary {
  border: none !important;
  background: none !important;
}

.daterangepicker .btn-default {
  color: var(--color-muted);
}

.daterangepicker .btn-primary {
  color: var(--color-accent);
}

.daterangepicker .drp-buttons .btn {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  line-height: 24px !important;
  text-transform: uppercase !important;
}


.daterangepicker td.active.selectedDate,
.daterangepicker td.active.selectedDate:hover {
  background-color: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
  background-color: var(--color-accent) !important;
  /* padding: 16px!important; */
  border-radius: 100% !important;
}

.daterangepicker td.active.selectedDate span,
.daterangepicker td.active.selectedDate span:hover {
  background-color: var(--color-accent) !important;
  padding: 16px !important;
  border-radius: 100%;
  display: block;
}

.daterangepicker td.active.start-date.selectedDate:not(:hover) {
  background: linear-gradient(to left, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0)) !important;
}

.daterangepicker td.active.end-date.selectedDate:not(:hover) {
  background: linear-gradient(to right, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0)) !important;
}

.daterangepicker td.active.start-date.end-date.selectedDate {
  background: none !important;
}

#filterBtnDirectory ul li.selectedPromotionPageSubCat.dropdown-submenu,
#filterBtnDirectory ul li.selectedPromotionPageSubCat.dropdown-submenu ul.dropdown-menu.submenulist {
  margin-top: 0 !important;
  width: 100%;
}

.daterangepicker th.available:hover {
  border-radius: 50%;
}

/* .daterangepicker td.start-date {
border-radius: 100% !important;
}

.daterangepicker td.end-date {
border-radius: 100% !important;
} */

/* .daterangepicker .drp-calendar.left .calendar-table th:last-child,
.daterangepicker .drp-calendar.right .calendar-table th:first-child {
display: none;
} */

.mainCalendar {
  visibility: hidden;
  position: absolute;
  top: 0;
  width: 100%;
}

div#homepageWhatsOn a.happeningPostTitle,
div#homepageWhatsOn p.happeningPostTitle,
div#homepageWhatsOn a.newPostTitle,
div#homepageWhatsOn p.newPostTitle {
  color: #323232;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 30px;
  text-overflow: ellipsis;
  height: 60px;
  display: block;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

div#homepageWhatsOn a.newPostTitle,
div#homepageWhatsOn p.newPostTitle {
  color: #323232;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 30px;
}

div#homepageWhatsOn .happeningPostContent,
div#homepageWhatsOn .pressRoomPostContent,
div#homepageWhatsOn .promotionPageTypeTabContent .promotionDesc,
div#homepageWhatsOn .touristPrivilegesCatMenuTabContent .promotionDesc,
div.whatsOnContainer .promotionPost .promotionDetailsWrapper .promotionDesc {
  display: -webkit-box;
  max-width: 100%;
  height: 50px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}

div#homepageWhatsOn .happeningPostWrapper:nth-child(n) {
  width: 270px;
  display: inline-block;
  margin-right: 10px;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
}

div#homepageWhatsOn .whatsOnContainer.desktopShow .happeningPostWrapper,
div#homepageWhatsOn .whatsOnContainer.desktopShow .promotionPost {
  text-align: left;
}

div#homepageWhatsOn .happeningPostWrapper:nth-child(4) {
  width: 270px;
  display: inline-block;
  margin-right: 0;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 546px;
}

div#homepageWhatsOn .happeningTabEventContent {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: minmax(100px,
      auto);
  /* set the minimum and maximum row height */
  grid-gap: 16px;
  /* add gap between grid items */
}

div#homepageWhatsOn .happeningPostWrapper.events:nth-child(n) {
  width: 100%;
  height: auto;
  /* width: 270px;
  display: inline-block;
  margin-right: 10px;
  position: relative;
  transition: 0.25s all;
  background-color: var(--color-white);
  overflow: hidden;
  height: 270px; */
}

div#homepageWhatsOn .happeningPostWrapper.events:nth-child(n) .happeningPostContainer {
  padding: 24px 16px;
}

/* div#homepageWhatsOn .happeningPostWrapper.events:nth-child(4) {
width: 270px;
display: inline-block;
margin-right: 0;
position: relative;
transition: 0.25s all;
background-color: var(--color-white);
overflow: hidden;
height: 270px;
} */

div#homepageWhatsOn .happeningPostWrapper .happeningBox {
  font-size: 16px;
  line-height: 28px;
  font-family: var(--font-body);
  font-weight: 300;
  color: var(--color-text);
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div#homepageWhatsOn .happeningPostWrapper .happeningPostImage {
  height: 270px;
}

div#homepageWhatsOn .happeningPostWrapper .smallHappeningBox {
  font-size: 16px;
  line-height: 28px;
  font-family: var(--font-body);
  font-weight: 300;
  color: var(--color-text);
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div#homepageWhatsOn .happeningPostContentWrapper {
  position: relative;
  width: 100%;
  height: 50%;
}

.guideListContent a {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
  display: block;
}

/* Divi related */
.et_pb_image_wrap img {
  object-fit: cover;
}

/*this sets the height of the image module*/
.pa-full-height-image-column {
  height: 100% !important;
}

/*this sets the height of the image container*/
.pa-full-height-image-column .et_pb_image_wrap {
  height: 100% !important;
}

/*this sets the height and fit of the actual image*/
.pa-full-height-image-column img {
  object-fit: cover;
  height: 100% !important;
}

.maskEdgeEnd {
  margin-top: 12px;
  margin-bottom: 40px;
  -webkit-mask-image: linear-gradient(90deg,
      var(--color-off-white) 90%,
      rgba(250, 250, 250, 0) 100%);
  mask-image: linear-gradient(90deg, var(--color-off-white) 90%, rgba(250, 250, 250, 0) 100%);
}

.maskEdgeBegin {
  margin-top: 12px;
  margin-bottom: 40px;
  -webkit-mask-image: linear-gradient(270deg,
      var(--color-off-white) 90%,
      rgba(250, 250, 250, 0) 100%);
  mask-image: linear-gradient(270deg, var(--color-off-white) 90%, rgba(250, 250, 250, 0) 100%);
}

.maskEdgeDouble {
  margin-top: 12px;
  margin-bottom: 40px;
  -webkit-mask-image: linear-gradient(to right,
      transparent 0%,
      black 10% 90%,
      transparent 100%);
  mask-image: linear-gradient(to right,
      transparent 0%,
      black 10% 90%,
      transparent 100%);
}

.maskEdgeEndReward {
  -webkit-mask-image: linear-gradient(90deg,
      var(--color-off-white) 90%,
      rgba(250, 250, 250, 0) 100%);
  mask-image: linear-gradient(90deg, var(--color-off-white) 90%, rgba(250, 250, 250, 0) 100%);
}

.maskEdgeBeginReward {
  -webkit-mask-image: linear-gradient(270deg,
      var(--color-off-white) 90%,
      rgba(250, 250, 250, 0) 100%);
  mask-image: linear-gradient(270deg, var(--color-off-white) 90%, rgba(250, 250, 250, 0) 100%);
}

.maskEdgeDoubleReward {
  -webkit-mask-image: linear-gradient(to right,
      transparent 0%,
      black 10% 90%,
      transparent 100%);
  mask-image: linear-gradient(to right,
      transparent 0%,
      black 10% 90%,
      transparent 100%);
}

.popularCardContainer {
  margin-top: 12px;
  margin-bottom: 40px;
}

.whatsOnBtnContainer {
  margin-top: 0;
  margin-bottom: 40px;
  overflow: visible;
  padding-right: 56px;
}

.searchBtnRowContainer {
  margin-top: 32px;
  margin-bottom: 64px;
}

.popularCardContainer.active,
.whatsOnBtnContainer.active,
.searchBtnRowContainer.active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
  transform: scale(1);
}

div.popularCardContainer .swiper-slide,
div.whatsOnBtnContainer .swiper-slide {
  cursor: pointer;
}

div.popularCardContainer .swiper-slide .overlay::before {
  transition: background-color 0.25s ease-in-out;
  display: block;
  content: "";
  background-color: rgba(0, 0, 0, 0);
}

div.popularCardContainer .swiper-slide:hover .overlay,
div.popularCardContainer .swiper-slide.selectedPopImg .overlay {
  position: absolute;
  top: 0;
  background: var(--color-accent);
  opacity: 0.7;
  width: 100%;
  height: inherit;
  border-radius: 12px;
  transition: background-color 0.25s ease-in-out;
  max-height: 119px;
}

div.popularCardContainer .swiper-slide:hover .popularImg,
div.popularCardContainer .swiper-slide.selectedPopImg .popularImg {
  filter: grayscale();
}

#nextCardBtn.swiper-button-next,
div.headerCarouselContainer .swiper-button-next,
div.searchBtnRowContainer .swiper-button-next,
.rewardsRedemptionTable .swiper-button-next,
.swiper-button-next-rewards-usage-desktop.swiper-button-next,
.swiper-button-next-rewards-redemption-desktop.swiper-button-next,
.featured-popup-swiper-button-next {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1729231286/Vivocity/Website%202024/Images/VivoCity%20New%20Pink%20-%20Oct%202024/icon_big_right.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
}

div.headerCarouselContainer .swiper-button-prev,
.rewardsRedemptionTable .swiper-button-prev,
.featured-popup-swiper-button-prev {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677470973/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_big_left.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
}

#nextCardBtn.swiper-button-next,
div.headerCarouselContainer .swiper,
div.whatsOnBtnContainer .swiper,
.rewardsRedemptionTable .swiper,
.swiper-button-next-rewards-usage-desktop.swiper-button-next,
.swiper-button-next-rewards-redemption-desktop.swiper-button-next,
.featured-popup-swiper-button-prev,
.featured-popup-swiper-button-next {
  --swiper-navigation-size: 40px;
}

#nextCardBtn.swiper-button-next::after,
div.headerCarouselContainer .swiper-button-next::after,
div.headerCarouselContainer .swiper-button-prev::after,
div.searchBtnRowContainer .swiper-button-next::after,
div.whatsOnBtnContainer .swiper-button-next::after,
.rewardsRedemptionTable .swiper-button-next::after,
.rewardsRedemptionTable .swiper-button-prev::after,
.swiper-button-next-rewards-usage-desktop::after,
.swiper-button-next-rewards-redemption-desktop::after,
.featured-popup-swiper-button-prev::after,
.featured-popup-swiper-button-next::after {
  display: none;
}

#nextCardBtn[class^="swiper-button-"],
.headerCarouselContainer [class^="swiper-button-"],
.whatsOnBtnContainer [class^="swiper-button-"],
.rewardsRedemptionTable [class^="swiper-button-"],
.searchBtnRowContainer [class^="swiper-button-"],
.swiper-button-next-rewards-usage-desktop[class^="swiper-button-"],
.swiper-button-next-rewards-redemption-desktop[class^="swiper-button-"],
.featured-popup-swiper-button-prev,
.featured-popup-swiper-button-next {
  width: 40px;
  height: 40px;
}

div.whatsOnBtnContainer .swiper-button-next {
  right: 8px;
}

#nextCardBtn[class^="swiper-button-"],
.swiper-button-next-rewards-usage-desktop[class^="swiper-button-"],
.swiper-button-next-rewards-redemption-desktop[class^="swiper-button-"] {
  top: 45%;
}

div.popularCard.container.searchBarCont #nextCardBtn[class^="swiper-button-"] {
  top: 25%;
}

.containerCardBtn {
  position: relative;
  padding: 0 0 0 16px !important;
}

.popularCardSwiperShell {
  position: relative;
}

.filterBtnMobile {
  display: none;
}

div#kidsSection .storeKcTPType .checkboxContainer,
.selectedPromotionPageSubCat .checkboxContainer,
.filterTypeCheckbox .checkboxContainer {
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 24px;
  width: 24px;
  cursor: pointer;
  margin-right: 12px;
}

div#kidsSection.storeKcTPType .checkboxContainer input,
.selectedPromotionPageSubCat .checkboxContainer input,
.filterTypeCheckbox .checkboxContainer input {
  position: relative;
  opacity: 0;
  cursor: pointer;
}

div#kidsSection .storeKcTPType input[type="checkbox"] {
  display: none;
}

div#kidsSection .storeKcTPType .checkboxContainer .checkmark {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 14px;
  background-color: transparent;
  color: white;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  transition: 0.15s all;
  border: 1px solid var(--color-border);
}

.selectedPromotionPageSubCat .checkboxContainer .checkmark {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 14px;
  background-color: transparent;
  border: 1px solid var(--color-border);
  color: transparent;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  transition: 0.15s all;
}

.filterTypeCheckbox .checkboxContainer .checkmark {
  position: absolute;
  left: 0px;
  top: 6px;
  font-size: 14px;
  background-color: transparent;
  border: 1px solid var(--color-border);
  color: white;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  transition: 0.15s all;
}

div#kidsSection .storeKcTPType .checkboxContainer .checkmark i,
.selectedPromotionPageSubCat .checkboxContainer .checkmark i,
.filterTypeCheckbox .checkboxContainer .checkmark i {
  position: absolute;
  top: 5px;
  left: 5px;
}

div#kidsSection .storeKcTPType .checkboxContainer input:checked~.checkmark,
.selectedPromotionPageSubCat .checkboxContainer input:checked~.checkmark,
.filterTypeCheckbox .checkboxContainer input:checked~.checkmark {
  background-color: var(--color-accent);
  color: white;
  border: none;
}

div#kidsSection .storeKcTPType {
  font-size: 0;
  padding: 8px 16px;
  min-width: 200px;
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background-color: var(--color-white);
  margin-right: 16px;
}

div#kidsSection .storeKcTPType>* {
  display: inline-block;
  vertical-align: middle;
}

div#kidsSection .storeKcTPType p {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
  cursor: pointer;
}

.cardSection .blackLine {
  margin-top: 48px;
  margin-bottom: 40px;
}

.parallax {
  margin-top: 64px;
  perspective: 1px;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  animation: slideInUp;
  /* referring directly to the animation's @keyframe declaration */
  animation-duration: 3.5s !important;
  /* don't forget to set a duration! */
}

.parallax__layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.parallax__layer--base {
  transform: translateZ(0);
}

.parallax__layer--back {
  transform: translateZ(-1px);
}

.parallax__group {
  position: relative;
  height: 100vh;
  transform-style: preserve-3d;
}

.swiper-pagination-bullet-active {
  background-color: var(--color-accent) !important;
  opacity: 1 !important;
}

.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 8px !important;
  width: 8px;
  height: 8px;
}

.searchBarTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 48px;
  font-weight: bold;
  letter-spacing: -1px;
  line-height: 48px;
  padding-bottom: 40px;
}

.storeCat.container.contentContainer.searchBarCont {
  padding-top: calc(30% / 3) !important;
}

.popularCard.container.searchBarCont {
  padding-bottom: 120px !important;
}

.storeCat.container.contentContainer.searchBarCont .storeMenuContainer {
  padding-bottom: 40px !important;
}

.searchBtnRow {
  margin-top: 32px;
  margin-bottom: 64px;
  display: flex;
  justify-content: left;
  align-items: center;
}

.scrollDownIndicator {
  position: fixed;
  z-index: 31;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24px;
}

.scrollDownIndicator img {
  width: 40px;
  height: 40px;
  object-fit: cover;
}

.homepageCategoryGrid {
  width: 100%;
  text-align: center;
  margin: auto;
  padding-bottom: 120px;
  max-width: 1128px;
}

.homepageCategoryGrid .categoryGridRow {
  width: 100%;
  max-width: 1200px;
  display: inline-flex;
  flex-direction: row;
}

.center {
  width: 100%;
  text-align: -webkit-center;
}

.homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridPrimary {
  display: inline-block;
  width: 30%;
}

.homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridSecondary {
  display: inline-block;
  width: 70%;
}

.homepageCategoryGrid .categoryGridRow:nth-child(2) .categoryGridPrimary {
  display: inline-block;
  width: 55%;
  height: fit-content;
}

.homepageCategoryGrid .categoryGridRow:nth-child(2) .categoryGridSecondary {
  display: inline-block;
  width: 45%;
}

.homepageCategoryGrid .categoryGridRow:nth-child(3) .categoryGridPrimary {
  display: inline-block;
  width: 48%;
}

.homepageCategoryGrid .categoryGridRow:nth-child(3) .categoryGridSecondary {
  display: inline-block;
  width: 52%;
}

.two-mini-card {
  display: flex;
}

.img {
  position: relative;
  z-index: 10;
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
}

.img::before {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  transition: background-color 0.25s ease-in-out;
  display: block;
  content: "";
  background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.22) 32%, rgba(0, 0, 0, 0) 62%);
}

.image:hover .img::before {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.62) 0%, rgba(0, 0, 0, 0.28) 34%, rgba(0, 0, 0, 0) 64%);
}

.image.active .img::before {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.22) 32%, rgba(0, 0, 0, 0) 62%);
}

.img-vert::before,
.img-hor::before,
.img-square::before {
  height: 100%;
  min-height: -webkit-fill-available;
  min-height: -moz-available;
}

.inner {
  position: absolute;
  top: -8%;
  left: 0;
  width: 100%;
  height: 116%;
  background-size: cover;
  background-position: center;
  z-index: -1;
  will-change: transform;
}

.image {
  position: relative;
  visibility: visible;
  transition: visibility 0.5s ease-in-out;
}

.image:hover {
  cursor: pointer;
}

.videoParallaxFrame {
  position: relative;
  overflow: hidden;
}

.videoParallaxFrame::before {
  display: block;
}

.videoParallaxMedia {
  position: relative;
  margin-top: -8%;
  z-index: 1;
  display: block;
  width: 100%;
  height: 110%;
  object-fit: cover;
  transform: translate3d(0, 0, 0) scale(1);
  transition: filter 0.25s ease-in-out;
  will-change: transform, filter;
}

.kidsThumbImg .videoParallaxMedia {
  margin-top: 0;
  height: auto;
}

.homepageCategoryGrid.desktopShow .diningThumbImg:hover .videoParallaxMedia,
.homepageCategoryGrid.desktopShow .kidsThumbImg:hover .videoParallaxMedia {
  filter: brightness(0.8);
}

.image.close {
  visibility: hidden;
}

.diningThumbImg {
  width: 100%;
  padding-right: 24px;
  margin-top: 0;
}

.diningThumbImg .img {
  height: 640px;
  max-width: 360px;
}

.fashionThumbImg {
  width: 100%;
  margin-top: 64px;
}

.fashionThumbImg .img {
  height: 364px;
  max-width: 648px;
}

.newStoreThumbImg {
  margin-top: 24px;
  padding-right: 24px;
  width: 45%;
}

.newStoreThumbImg .img {
  height: 360px;
  max-width: 360px;
}

.findStoreThumbImg {
  width: 50%;
  margin-top: 103px;
}

.findStoreThumbImg .img {
  height: 202px;
  max-width: 360px;
}

.kidsThumbImg {
  width: 100%;
  margin-top: 12px;
  padding-left: 10%;
  padding-right: 24px;
}

.kidsThumbImg .img {
  height: fit-content;
  max-width: 552px;
  max-height: 300px;
}

.healthBeautyThumbImg {
  width: 100%;
  margin-top: 179px;
}

.healthBeautyThumbImg .img {
  height: 256px;
  max-width: 456px;
}

.homeThumbImg {
  width: 100%;
  margin-top: -15%;
  padding-right: 24px;
}

.homeThumbImg .img {
  height: 310px;
  max-width: 552px;
}

.servicesThumbImg {
  width: 100%;
  margin-top: 24px;
}

.servicesThumbImg .img {
  height: 360px;
  max-width: 360px;
}

.fashionThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771215053/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-fashion3x.jpg");
}

.newStoreThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771215050/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-new_stores3x.jpg");
}

.findStoreThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771215045/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-find_a_store3x.jpg");
}

/*not being used, replaced with video */
/* .diningThumbImg .inner {
background-image: url("https://cloudinary.alphapod.com/alphapod/video/upload/v1766115542/Vivocity/Vivocity%20Revamp%202026/homepage_thumbnail/homepage_thumbnail_dining_sample.mp4");
}

/* .kidsThumbImg .inner {
background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1683693164/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_16_9_kids.jpg");
} */

.healthBeautyThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771215052/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-health3x.jpg");
}

.homeThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771215047/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-lifestyle3x.jpg");
}

.servicesThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771215049/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-services3x.jpg");
}

div.whatsOnBtnContainer .swiper-slide,
div.searchBtnRowContainer .swiper-slide {
  width: fit-content !important;
}

.cardSection.container,
.whatOnSection.whatOnSectionInner,
.searchContainer.container {
  padding: 0 !important;
  max-width: 1128px !important;
  margin: auto;
}

.whatOnOuterContainer {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1683530309/Vivocity/Website%20Revamp%202023/Assets/Images/xxhdpi/img_bg_waves.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom center;
  margin: auto;
  padding-bottom: 0;
}

.home #footer .download {
  margin-top: -30px !important;
  background-position: top center !important;
}

#algolia_store_tags_list.container,
.allStoreContainer.container {
  padding: 0 0 80px 0 !important;
}

.hitsCounter.guidePage.container {
  padding: 0 !important;
}

.desktopDisplayShow {
  display: flex !important;
}

.desktopRoller {
  display: block !important;
  height: 100vh;
}

.mobileDisplayShow,
.mobileRoller {
  display: none !important;
}

.directoryBadge {
  border: 1px solid var(--color-border-light);
  border-radius: 24px;
  background-color: var(--color-gray-100);
  width: fit-content;
  padding: 8px 16px;
  display: flex;
  align-items: center;
}

/* .directoryBadge:first-child{
margin-right: 5px;
} */

.directoryTextBadge {
  color: var(--color-text);
  font-family: Inter;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 28px;
}

.directoryClearIcon {
  padding-left: 8px;
  font-size: 20px;
  color: var(--color-muted);
}

.searchBtnRow.container {
  padding: 0 !important;
}

#iconDropdown {
  float: right;
  margin-left: auto;
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677556458/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_caret_down.png");
  background-repeat: no-repeat;
  background-size: 24px 24px;
  background-position: center;
  height: 24px;
  width: 24px;
}

#iconClearable {
  float: right;
  margin-left: auto;
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677556459/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_close_round.png");
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: center;
  height: 24px;
  width: 24px;
}

#mainSelect {
  display: none;
  background-color: var(--color-gray-100);
  cursor: pointer;
}

.btnClearable {
  background-color: transparent;
  padding: 0;
  margin: 0;
  line-height: normal;
  vertical-align: top;
  float: right;
  margin-left: auto;
  position: relative;
}

#selectedDateBtnMH,
#selectedDateBtnSH {
  vertical-align: top;
}

ul.dropdown-menu.storeDropdownMenu>li a:hover span i {
  filter: brightness(0) invert(1);
}

#new_stores .happeningPostWrapper .happeningPostContentWrapper .happeningPostContainer a.happeningPostTitle {
  color: #323232;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 22px;
  height: 44px;
}

#new_stores .happeningPostWrapper .happeningPostContentWrapper .happeningPostContainer .happeningPostContent {
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
}

.iconStyle {
  font-size: 20px;
  vertical-align: text-bottom;
  padding-left: 4px;
}

.popularCard.container,
.rewardsCard.container {
  padding: 0 !important;
  position: relative;
}

.headerImage .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.headerImage .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet,
.rewardsTypeUsageDesktopPagination.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  height: 6px;
  width: 80px;
  border-radius: 3px;
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 8px) !important;
}

.headerImage .swiper-horizontal>.swiper-pagination-bullets,
.headerImage .swiper-pagination-bullets.swiper-pagination-horizontal,
.headerImage .swiper-pagination-custom,
.headerImage .swiper-pagination-fraction {
  bottom: var(--swiper-pagination-bottom, 24px);
}

/* .headerImage .swiper-horizontal > .swiper-pagination-bullets {
z-index: 3;
} */

.headerImage .swiper-pagination-bullet {
  background-color: white;
  opacity: 0.5;
}

.whatsOnRevamp.container,
.sectionButtonContainer.container {
  padding: 0 !important;
}

.popularCardWrapper404 {
  display: block;
}

.containerSpinner {
  margin: 40px auto 80px;
  width: 100%;
  max-width: 40px;
  justify-content: space-around;
  align-items: center;
  display: none;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.spinner {
  --spinner-color: #e98ec7;

  aspect-ratio: 1/1;
  border-radius: 50%;

  animation-name: spin;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.spinner--quarter {
  width: 48px;
  border: 5px solid var(--spinner-color);
  border-top-color: transparent;

  animation-duration: 1s;
}

.search-form {
  width: -webkit-fill-available;
}

.algoliaSearchIcon {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677739900/Vivocity/Website%20Revamp%202023/Assets/Icons/xhdpi/icon_search.png");
  background-size: contain;
}

.ais-SearchBox-submitIcon path {
  fill: none;
}

.rewardsGuideInnerIntroContainer h5 {
  padding-bottom: 5px !important;
}

div#storePromoTabContentMobile,
div#whats_new_mobile {
  margin-bottom: 60px;
}

.singleStorePostImageWrapper {
  border-radius: 50px;
  height: 64px;
  width: 64px;
}

.singleStorePostImage {
  border-radius: 50px;
  height: 64px;
  width: 64px;
}

.infoContainer {
  margin-top: 32px;
  display: flex;
}

.infoBox {
  width: 30%;

}

.lineDivider {
  border-left: 4px solid var(--color-accent);
}

.infoTitle {
  /* font-family: Inter; */
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;

  margin-left: 23px;

}

.infoContent {
  color: var(--color-text);
  /* font-family: Inter; */
  font-size: 14px;
  letter-spacing: 0;
  line-height: 24px;
  margin-left: 23px;
}

.singleStorePostContact,
.singleStorePostURL {
  margin-left: 32px;
}

.dropdown-backdrop {
  z-index: -1;
}

.singleStoreBreadCrumb {
  vertical-align: middle;
  position: relative;
}

h1.postTitle {
  font-family: var(--font-display);
  padding-bottom: 16px;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 40px;

}

a[name="blankPhone"],
a[name="blankUrl"] {
  text-decoration: none;
  color: var(--color-black);
  cursor: default;
}


.featurePopupDialogSwiperContainer .swiper-wrapper.disabled {
  transform: none !important;
}

.noticeNursing {
  font-weight: 700;
  color: red;
}

/* The Modal (background) */
.modal {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Stay in place */
  z-index: 9999999;
  /* Sit on top */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  overflow: auto;
  /* Enable scroll if needed */
  background-color: rgb(0, 0, 0);
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.4);
  /* Black w/ opacity */
}

.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 99998;
  opacity: 0;
  transition: opacity 0.1s ease;
  pointer-events: none;
}

.modal-backdrop.fade {
  transition: opacity 0.1s ease;
}

.modal-backdrop.in,
.modal-backdrop.show {
  opacity: 1;
  pointer-events: auto;
}

/* Modal Content */
.modal-content {
  background-color: white;
  margin: auto;
  border-radius: 16px;
  position: relative;
  border: 0;
  width: auto;
}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  position: absolute;
  top: 0;
  right: 0;
}

.close:hover,
.close:focus {
  color: var(--color-black);
  text-decoration: none;
  cursor: pointer;
}

.nav-btn {
  cursor: pointer;
  margin: 10px;
  position: absolute;
  top: 50%;
  z-index: 99999;
  height: 40px;
  width: 40px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
  will-change: filter;
  filter: drop-shadow(#404040 0 4px 4px) brightness(1);
  -webkit-filter: drop-shadow(#404040 0 4px 4px) brightness(1);
}

.nav-btn.left:hover,
.nav-btn.right:hover {
  filter: brightness(0.8);
  -webkit-filter: brightness(0.8);
}

.nav-btn.left {
  left: 0;
  background-image: url(https://cloudinary.alphapod.com/alphapod/image/upload/v1729231286/Vivocity/Website%202024/Images/VivoCity%20New%20Pink%20-%20Oct%202024/icon_big_left.png);

}

.nav-btn.right {
  right: 0;
  background-image: url(https://cloudinary.alphapod.com/alphapod/image/upload/v1729231286/Vivocity/Website%202024/Images/VivoCity%20New%20Pink%20-%20Oct%202024/icon_big_right.png);
}

/* Hide all slides initially */
.featurePopupSlide {
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  border-radius: 14px;
  width: 552px;
  height: 800px;
}

.featurePopupSlide.advertisement {
  display: none;
  width: 405px;
  overflow-x: hidden;
  overflow-y: hidden;
  border-radius: 0;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
}

/* Show only the active slide */
.featurePopupSlide.active {
  display: block;
}

.featurePopupImage.advertisement {
  aspect-ratio: auto;
  height: 100%;
  width: 100%;
  max-height: 720px;
}

.featurePopupVideo {
  height: 100%;
  width: 100%;
  max-height: 720px;
  object-fit: cover;
  aspect-ratio: auto;
}

.animatedWrapper {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100px;
}

.animatedTitle {
  background: linear-gradient(to right,
      var(--color-magenta) 0%,
      var(--color-magenta) 5%,
      var(--color-accent) 55%,
      var(--color-accent) 100%) !important;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block;
  top: 0;
  left: 0;
  width: max-content;
  max-width: 100%;
  padding-bottom: 10px;
  padding-right: 5px;
  position: absolute;
  z-index: 1;
  overflow: visible;
  cursor: default;
}

.animatedTitle::before {
  content: "";
  position: absolute;
  top: -20%;
  left: -80px;
  width: 150px;
  height: 150px;
  pointer-events: none;
  opacity: 0;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2780%27%20height%3D%27120%27%20viewBox%3D%270%200%2080%20120%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27glow%27%20x1%3D%270%25%27%20y1%3D%270%25%27%20x2%3D%27100%25%27%20y2%3D%27100%25%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23FFFAF0%27%20stop-opacity%3D%270%27/%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23FFFAF0%27%20stop-opacity%3D%270.85%27/%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23FFFAF0%27%20stop-opacity%3D%270%27/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect%20x%3D%2710%27%20y%3D%27-10%27%20width%3D%2720%27%20height%3D%27140%27%20rx%3D%2710%27%20ry%3D%2710%27%20fill%3D%27url%28%23glow%29%27%20transform%3D%27rotate%2815%2020%2060%29%27/%3E%3Crect%20x%3D%2740%27%20y%3D%27-10%27%20width%3D%2720%27%20height%3D%27140%27%20rx%3D%2710%27%20ry%3D%2710%27%20fill%3D%27url%28%23glow%29%27%20transform%3D%27rotate%2815%2050%2060%29%27/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: cover;
  transform: rotate(18deg) scale(0.8);
  filter: drop-shadow(0 8px 16px rgba(255, 255, 255, 0.4));
  z-index: 2;
}

.animatedTitle.animate::before {
  animation: shimmerCycle 10s infinite ease-in-out;
}

@keyframes shimmerCycle {
  0% {
    opacity: 0;
    transform: translateX(-140%) rotate(18deg) scale(0.8);
  }

  8% {
    opacity: 0.9;
  }

  16% {
    opacity: 1;
  }

  22% {
    opacity: 0;
    transform: translateX(300%) rotate(18deg) scale(0.8);
  }

  100% {
    opacity: 0;
    transform: translateX(300%) rotate(18deg) scale(0.8);
  }
}

.animatedTitle.animate:nth-of-type(2) {
  animation-delay: 2s;
}

.animatedTitle.animate:nth-of-type(3) {
  animation-delay: 4s;
}

.animatedTitle.animate:nth-of-type(4) {
  animation-delay: 6s;
}

.animatedTitle.animate:nth-of-type(5) {
  animation-delay: 8s;
}

.animatedTitle.animate:nth-of-type(2)::before {
  animation-delay: 2s;
}

.animatedTitle.animate:nth-of-type(3)::before {
  animation-delay: 4s;
}

.animatedTitle.animate:nth-of-type(4)::before {
  animation-delay: 6s;
}

.animatedTitle.animate:nth-of-type(5)::before {
  animation-delay: 8s;
}

.animatedTitle.animate {
  animation: rotate 10s infinite;
  transition-timing-function: cubic-bezier(0.2, 0.5, 0.3, 1);
  animation-fill-mode: both;
}

@keyframes rotate {
  0% {
    transform: translate3d(0, 100px, 0);
  }

  5% {
    transform: translate3d(0, -2px, 0);
  }

  8% {
    transform: translate3d(0, 2px, 0);
  }

  10% {
    transform: translate3d(0, 0, 0);
  }

  20% {
    transform: translate3d(0, 0, 0);
  }

  25% {
    transform: translate3d(0, -100px, 0);
  }

  99.9999% {
    transform: translate3d(0, -100px, 0);
  }

  100% {
    transform: translate3d(0, 100px, 0);
  }
}

/* Responsive Breakpoints */
@media (max-width: 1280px) {
  .featurePopupSlide.swiper-slide.advertisement {
    max-height: 700px;
  }

}

.close-btn {
  color: var(--color-white) !important;
  font-size: 12px !important;
  position: absolute;
  z-index: 99999;
  text-align: right;
  top: 10px;
  right: 12px;
  border-radius: 50%;
  text-align: center;
  padding: 5px 0;
  opacity: 1;
}

.close-btn img {
  height: 24px;
  width: 24px;
  pointer-events: none;
  /* Standard property */
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.faqStepImageWrapper {
  display: flex;
  padding: 32px;
  justify-content: space-evenly;
}

.faqSubsectionTitle {
  padding: 25px 0;
  text-decoration: underline;
}

#dice-box,
#dice-box canvas {
  /* position: absolute; */
  pointer-events: none;
  z-index: 100;
  width: 100vw;
  /* 80% of the viewport width */
  height: 100%;
  margin: auto;
}

.mainDiceContainer {
  display: flex;
  position: relative;
  width: 100vw;
  height: calc(100vh - 220px);
  padding: 16px 0;
  flex-grow: 1;
  /* Standard property */
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.rollDiceSection {
  /* margin-top: 40px; */
  margin-bottom: 50px;
  display: flex;
  flex-direction: column;
  padding: 0 16px;
}

.rollDiceSection.insideModal {
  flex-direction: column;
  width: 100%;
  padding: 0 16px;
  margin-bottom: 0;
  margin-top: 0;
}

.rollDiceBtn {
  background-color: var(--color-accent);
  padding: 8px 20px;
  width: 100%;
  opacity: 1;
  border-radius: 0;
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.rollDiceBtn:disabled,
.rollDiceBtn:hover {
  background-color: var(--color-accent);
  opacity: 0.5;
}

.rollDiceBtnLabel {
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 24px;
}

.rollDiceResultCard {
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: hidden;
  /* border-radius: 14px; */
  width: min(calc(100vw - 32px), 400px);
  height: calc(100vh - 92px);
  background-color: white;
}

@supports (height: 100dvh) {
  .rollDiceResultCard {
    height: calc(100dvh - 92px);
  }

  .mainDiceContainer {
    height: calc(100dvh - 250px);
  }
}

.rollDiceResultCard .imageWrapper {
  position: relative;
  height: auto;
  width: 100%;
  flex: 0 0 50%;
}

.rollDiceResultCard .contentWrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  height: auto;
  width: 100%;
  padding: 16px;
  flex-grow: 1;
  overflow-y: auto;
}

.rollDiceResultCard .contentWrapper #monopolyCardTitle {
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
  margin-bottom: 12px;
}

.rollDiceResultCard .contentWrapper #monopolyCardContent {
  display: block;
  max-width: 100%;
  height: auto;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  overflow-y: auto;
  /* Use auto for smoother behavior */
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}

.rollDiceResultImage {
  height: 100%;
  width: 100%;
  max-width: 720px;
  object-fit: cover;
  pointer-events: none;
  /* Standard property */
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.rollDiceResultLink {
  padding: 12px 0 16px;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.25px;
  line-height: 24px;
}

.mainRollerContainer {
  margin: auto;
  height: 50vw;
  width: 50vw;
  text-align: center;
  padding-top: calc(40vh - 80px);
}

.rollDiceTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: bold;
  letter-spacing: -0.75px;
  line-height: 32px;
  margin-top: 32px;
  text-align: center;
  padding: 0 16px;
}

#rollResultModal.modal {
  top: 60px;
  justify-content: center;
}

.rollDiceCopyright {
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 8px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 16px;
  text-align: right;
}

.rollDiceSecondaryTitle {
  color: var(--color-white);
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: normal;
  letter-spacing: -0.75px;
  line-height: 24px;
  text-align: center;
  padding: 0 16px 8px;
}

span i#iconDropdown {
  transition: transform .25s ease;
}

span i#iconDropdown.rotated {
  transform: rotate(180deg);
}

@media (max-width: 1440px) {

  .headerImage.withTab,
  .headerImage.vrHeaderImage,
  .headerImage.singleStore {
    height: calc(1280px / 2);
  }

}

@media (max-width: 1280px) {
  .featurePopupSlide.swiper-slide.advertisement {
    max-height: 700px;
  }

}

@media (max-width: 1200px) {
  .popularCard.container {
    padding: 0 16px !important;
    position: relative;
  }

  .whatsOnRevamp.container,
  .sectionButtonContainer.container,
  .homepageCategoryGrid {
    padding: 0 16px !important;
  }

  .whatOnOuterContainer {
    background-image: url('https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1687925197/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_bg_waves_mobile.jpg');
    margin: auto;
    margin-top: 64px;
  }

  .cardSection.container,
  .whatOnSection.whatOnSectionInner,
  .searchContainer.container,
  #algolia_store_tags_list.container,
  .allStoreContainer.container,
  .hitsCounter.guidePage.container {
    padding: 0 16px !important;
  }

  .storeCat.container.contentContainer {
    padding: 24px 16px 24px 0 !important;
  }

  .storeCat.container.directory {
    padding: 24px 16px 0 16px !important;
  }

  .storeCat.container.contentContainer.directory {
    padding: 0 16px !important;
  }

  div#whatsOnRevamp .happeningDiv .happeningPostWrapper:nth-child(n) {
    width: 50%;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningBox {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 16px;
    letter-spacing: -0.25px;
    line-height: 28px;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningBox .happeningPostImage {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 360px;
    background-color: var(--color-white);
    background-repeat: no-repeat;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningPostContentWrapper {
    position: relative;
    width: 100%;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(n) {
    width: 32%;
    margin-right: 16px;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(3n) {
    margin-right: 0;
  }

  .cardSection .blackLine {
    margin-top: 32px;
    margin-bottom: 32px;
  }

  .sectionTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    margin-top: 40px;
    margin-bottom: 24px;
  }

  /* div#whatsOnRevamp .eventsDiv .happeningPostWrapper:nth-child(n) {
  width: 48%;
  } */

  div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(n) {
    width: 32%;
    margin-right: 16px;
  }

  div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(3n) {
    margin-right: 0;
  }

  div#promoSection .iconFilter,
  div#promoSection .iconDropdown,
  div#newStoreSection .iconDropdown {
    margin-left: 20%;
  }

  .whatsOnCatBtn.storehighlightsSection,
  .whatsOnCatBtn.newStoreSection,
  .whatsOnCatBtn.kidsClubSection {
    min-width: 250px;
  }

  div#homepageWhatsOn .happeningPostWrapper:nth-child(n),
  div.whatsOnContainer .promotionPost:nth-child(n) {
    width: 240px;
  }

  div#directoryRevamp .storeCat.container.contentContainer .storeMenuContainerRow {
    display: flex;
  }

  div#directoryRevamp .storeCat.container.contentContainer .storeMenuContainerRow .searchBar {
    width: 50%;
  }

  .filterSection {
    margin-left: 5px;
  }

  div#directoryRevamp .dropdown-menu {
    max-width: 300px;
  }

  .participatingWrapper:nth-child(n) {
    width: 31%;
  }

  .ais-Hits-item:nth-child(n) {
    width: 33.3%;
  }

  img.featureImage,
  img.participatingFeatureImage {
    max-width: 100%;
  }

  .homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridPrimary {
    display: inline-block;
    width: 40%;
  }

  .homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridSecondary {
    display: inline-block;
    width: 60%;
  }

  .diningThumbImg .img,
  .fashionThumbImg .img,
  .servicesThumbImg .img {
    max-width: -webkit-fill-available;
  }

  .newStoreThumbImg {
    padding-right: 24px;
    width: 50%;
  }

  .servicesThumbImg,
  .kidsThumbImg {
    padding-right: 24px;
  }

  .kidsThumbImg .img {
    height: auto;
  }

  div.kidsThumbImg .cardText {
    left: 100px;
  }

  .findStoreThumbImg {
    margin: auto;
  }

  .headerImage.homepage {
    height: calc(100vw/3);
    padding-top: 0;
  }

  .headerImage.withTab,
  .headerImage.vrHeaderImage,
  .headerImage.singleStore {
    height: auto;
    padding-top: calc(100%/2);
  }

  .headerImage {
    height: auto;
    padding-top: calc(100%/2.5);
  }

}

@media(min-width:1200px) {
  #footer .download {
    padding: 120px 0 150px 0;
  }
}

@media (max-width: 1170px) {
  #top .row .menu a {
    font-size: 12px;
    padding-right: 16px;
  }

  span.selectedGender,
  #top .row .menu .loginMenuSelection .selectionDropdown li,
  #top .row .menu .loginMenuSelection .selectionDropdown a,
  #top .row .menu .loginBtn p,
  #top .row .menu .loginMenuSelection button {
    font-size: 12px;
  }

  .letterBtn {
    width: 28px;
  }

  .alphabetFilter {
    text-align: center;
  }

  button.promotionPageBtn.btn-primary.dropdown-toggle,
  .btn-primary.active.focus,
  .btn-primary.active:focus,
  .btn-primary.active:hover,
  .btn-primary:active.focus,
  .btn-primary:active:focus,
  .btn-primary:active:hover,
  .open>.dropdown-toggle.btn-primary.focus,
  .open>.dropdown-toggle.btn-primary:focus,
  .open>.dropdown-toggle.btn-primary:hover {
    width: 200px;
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 35%;
    margin-bottom: 64px;
  }

  .happeningPostContent,
  .pressRoomPostContent,
  .promotionPageTypeTabContent p.promotionDesc {
    display: -webkit-box;
    max-width: 100%;
    height: 56px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

@media (max-width: 1125px) {
  #guide_bg ul.dropdown-menu.promotionPageCatSelect {
    width: 200px;
  }

  .wrapper:not(.hidden-dropdown) {
    margin-right: 66px;
  }

  #guide_bg ul.dropdown-menu.promotionPageCatSelect {
    margin-left: 10px;
    margin-top: -1px;
    padding: 0;
    min-width: 150px;
    width: calc(100% - 10px);
  }

  button.promotionPageBtn.btn-primary.dropdown-toggle,
  .btn-primary.active.focus,
  .btn-primary.active:focus,
  .btn-primary.active:hover,
  .btn-primary:active.focus,
  .btn-primary:active:focus,
  .btn-primary:active:hover,
  .open>.dropdown-toggle.btn-primary.focus,
  .open>.dropdown-toggle.btn-primary:focus,
  .open>.dropdown-toggle.btn-primary:hover {
    width: 200px;
  }

  div#store_promotions .filterSection {
    margin-left: auto;
  }
}

@media (max-width: 1090px) {
  div#directoryRevamp .storeCat.container.contentContainer .storeMenuContainerRow {
    display: flex;
  }

  div#directoryRevamp .storeCat.container.contentContainer .storeMenuContainerRow .searchBar {
    width: 50%;
  }

  .storeCat.container.contentContainer .storeKcTPType {
    flex-grow: 1;
  }

  .storeCat.container.contentContainer .dropdownStoreCat {
    flex-grow: 2;
  }
}

@media (max-width: 1080px) {

  .promotionsPage div#kids_club_offers .promotionPost,
  .promotionsPage div#kids_club_birthday_offers .promotionPost,
  .promotionsPage .touristPrivilegesCatWrapper .promotionPost {
    width: calc(50% - 12px);
  }

  .promotionsPage div#store_promotions .promotionPost {
    width: calc(50% - 16px);
  }

  .pressRoomPostContent,
  .promotionPageTypeTabContent .promotionDesc {
    height: 112px;
    -webkit-line-clamp: 4;
  }

  div#whatsOnRevamp div#store_promotions .promotionPageTypeTabContent .promotionDesc {
    height: 60px;
    -webkit-line-clamp: 3;
  }

  .rewardsCatContent:not(.algoliaItem) {
    width: calc(33.33% - 11px);
  }

  /* .rewardsCatContent:not(.algoliaItem):nth-child(3n+2), .ais-Hits-item:nth-child(3n+2) {
  margin: 0;
  } */

  .rewardsCatContent:not(.algoliaItem):nth-child(4n) {
    margin-right: 16px;
  }

  .rewardsCatContent:not(.algoliaItem):nth-child(3n) {
    margin-right: 0;
  }

  /* .rewardsCatContent:not(.algoliaItem):nth-child(2n+1), .ais-Hits-item:nth-child(2n+1) {
  margin-right: 16px;
  } */
}

@media (max-width: 1024px) {

  .memberInfoWrapper .vivoDropdownBtn,
  #enquiryForm button.dropdown-toggle {
    padding: 10px 16px;
  }

  .letterBtn {
    width: 19px;
  }

  .searchBar {
    font-size: 24px;
    padding: 8px 0;
  }

  /*
  .searchBar .fa-search {
  font-size: 17px;
  top: 16px;
  } */

  /* .directorybtn .notAllCatogeries, .rewardsCatalogueBtn .notAllCatogeries { */
  .notAllCatogeries {
    padding: 0 25px 0 12px;
    max-width: calc(100% - 40px);
  }

  /* .directorybtn .notAllCatogeries .cancelCategory, .rewardsCatalogueBtn .notAllCatogeries .cancelRewardsCatalogueType { */
  .notAllCatogeries .cancelCategory,
  .notAllCatogeries .cancelRewardsCatalogueType,
  .notAllCatogeries .cancelRewardsCatalogueCat {
    font-size: 10px;
    padding: 0 8px 0 8px;
  }

  /*.dropdown button.directorybtn.btn-default.dropdown-toggle {
  font-size: 12px;
  line-height: 24px;
  width: 270px;
  }*/

  .site-content-contain {
    padding-top: var(--header-height-mobile);
  }

  .membershipTabBtn {
    padding: 0 24px 0 0;
  }
}

@media (max-width: 1000px) {
  html #wpadminbar {
    min-width: 300px;
    position: fixed;
  }

  .headerLogo {
    height: 36px !important;
  }

  .tabletShow {
    display: block !important;
  }

  div#logoutHeaderButton>p {
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
    float: right;
    padding-top: 20px;
    margin-right: 24px;
  }

  #top .row #hamburgerMenuIcon,
  #top .row .searchIconMobile {
    display: inline !important;
  }

  .hamburgerMenu {
    display: block !important;
  }

  #footer i {
    font-size: 40px;
    margin-right: 10px;
  }

  .rewardsCatMenu {
    width: 20%;
  }

  a.rewardsBtn {
    font-size: 16px;
  }

  .rewardsCatMenu ul.dropdown-menu.submenucat {
    font-size: 14px;
  }

  p.earningBtn.tabBtn:last-of-type {
    padding: 0;
  }

  div#sign_up_vivo_rewards .stepsDescWrapper h3 {
    font-size: 20px;
    line-height: 24px;
  }

  .stepsRegisterContainer .stepsDescWrapper p {
    font-size: 14px !important;
    line-height: 22px !important;
  }

  .dropdown.loginMenuSelection,
  .dropdown.loginMenuSelection li.myAccBtn,
  .dropdown.loginMenuSelection li.editProfileBtn,
  li#logoutButton,
  li#logoutButtonSideMenu {
    display: block;
    font-size: 16px;
    color: var(--color-text);
    line-height: 28px;
    padding: 16px 24px;
    text-transform: uppercase;
  }

  .loginBtn {
    display: block;
    font-size: 16px;
    color: var(--color-text);
    line-height: 28px;
    padding: 16px 24px;
    border-top: solid 1px var(--color-border);
    text-transform: uppercase;
  }

  .dropdown.loginMenuSelection:after {
    content: "\f0d7";
    font-family: "FontAwesome";
    font-size: 20px;
    color: var(--color-text);
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
    right: 20px;
    margin: 0;
    top: 18px;
  }

  .dropdown.loginMenuSelection.open:after {
    transform: rotate(180deg);
    transition: all 0.25s;
  }

  button.btn.btn-default.dropdown-toggle.selectLoginMenuBtn:after {
    display: none;
  }

  .open>.btn.btn-default.dropdown-toggle.selectLoginMenuBtn:focus,
  .open>.btn.btn-default.dropdown-toggle.selectLoginMenuBtn:hover,
  .btn.btn-default.dropdown-toggle.selectLoginMenuBtn:hover,
  .btn.btn-default.dropdown-toggle.selectLoginMenuBtn:active,
  .open>.btn.btn-default.dropdown-toggle.selectLoginMenuBtn,
  .btn.btn-default.dropdown-toggle.selectLoginMenuBtn.active {
    background-color: var(--color-white) !important;
    color: var(--color-text);
    white-space: unset;
    box-shadow: none;
  }

  button.btn.btn-default.dropdown-toggle.selectLoginMenuBtn {
    border: none;
    padding: 0;
    width: 100%;
    text-align: left;
    background-color: transparent !important;
  }

  span.selectedGender {
    font-size: 16px;
    color: var(--color-text);
    line-height: 28px;
    font-weight: 400;
  }

  .hamburgerWrapper ul.dropdown-menu.selectionDropdown {
    width: 124%;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 16px 0 16px -24px;
    border-bottom: 1px solid var(--color-border);
    position: relative;
  }

  .dropdown.loginMenuSelection li.myAccBtn>a,
  .dropdown.loginMenuSelection li.editProfileBtn>a {
    border: none;
    padding: 0;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 28px;
    color: var(--color-text);
    font-weight: 400;
  }

  /* .storeCat.container.contentContainer .searchBar {
  width: 400px;
  } */

  .storeCat.container.contentContainer .searchBar input {
    font-size: 19px;
  }

  /* .dropdownStoreCat.dropdown {
  width: calc(100% - 410px);
  } */

  .smallShoppingGuideContentWrapper .shoppingGuideDesc {
    display: -webkit-box;
    max-width: 100%;
    height: 88px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .promotionsTabContainer .promotionContainer .promotionPost {
    width: calc(50% - 20px);
    margin-bottom: 16px;
    padding-top: calc(100% - 40px);
  }

  div#store_promotions .promotionPageTypeTabContent {
    padding-top: 56px;
    margin: 0 -8px;
  }

  .promotionsPage div#store_promotions .promotionPost {
    width: calc(50% - 16px);
  }

  .happeningPostContent,
  .pressRoomPostContent {
    height: 112px;
    -webkit-line-clamp: 4;
  }

  .happeningPostWrapper {
    width: calc(50% - 16px);
  }

  /* p.happeningPostTitle {
  display: -webkit-box;
  max-width: 100%;
  height: 31px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  } */

  .promotions .promotionsTabContainer .promotionContainer .promotionDesc {
    display: unset;
    height: unset;
    -webkit-line-clamp: unset;
  }

  .promotionsPage div#store_promotions .promotionPost,
  .mainTouristPrivilegesContainer .promotionPost {
    width: calc(50% - 16px);
  }

  .mainTouristPrivilegesContainer .promotionPageTypeTabContent p.promotionDesc {
    height: 112px;
    -webkit-line-clamp: 4;
  }

  .pressRoomPostContent,
  .promotionPageTypeTabContent .promotionDesc {
    height: 86px;
    -webkit-line-clamp: 3;
  }

  .healthBeautyThumbImg {
    margin-top: 10%;
  }

  .servicesThumbImg {
    margin-top: 0;
  }

  .findStoreThumbImg {
    width: 50%;
  }

  .findStoreThumbImg .img {
    max-height: 150px;
  }

}

@media (max-width: 950px) {
  div#promotions_calendar .wrapper:nth-child(3) {
    width: 240px;
  }

  .dropDownPromoWrapper {
    width: calc(100% - 728px + 180px);
    min-width: 160px;
  }
}

@media (max-width: 900px) {
  div#kids_fashion .promotionDesc {
    height: 56px;
    -webkit-line-clamp: 2;
  }

  /*.promotionsTabContainer .promotionContainer .promotionPeriod, .promotionPageTypeTabContent .promotionDetailsContainer .promotionPeriod {
  width: 136px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  }*/

  .touristPrivilegesCatMenuTabContent .promotionDesc {
    height: 86px;
    -webkit-line-clamp: 3;
  }

  .promotionsTabContainer .promotionContainer .promotionTitle {
    display: -webkit-box;
    max-width: 100%;
    height: 22px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p {
    width: 100%;
  }

  .homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridPrimary {
    display: inline-block;
    width: 50%;
  }

  .homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridSecondary {
    display: inline-block;
    width: 50%;
  }

  div#whatsOnRevamp .whatsNewDiv .happeningPostWrapper,
  div#whatsOnRevamp div#promoSection .promotionsPage div#store_promotions .promotionPost {
    width: 50%;
  }
}

@media (max-width: 850px) {
  .promotions .promotionsTabContainer .promotionContainer .promotionDesc {
    display: -webkit-box;
    height: 86px;
    -webkit-line-clamp: 3;
  }

  .promotionsPage div#kids_club_offers .promotionPost,
  .promotionsPage .touristPrivilegesCatWrapper .promotionPost {
    width: 100%;
  }

  .promotionsPage div#kids_club_offers .promotionDesc,
  .touristPrivilegesCatMenuTabContent .promotionDesc {
    height: 140px;
    -webkit-line-clamp: 5;
  }

  .promotionsPage div#kids_club_offers.promotionDesc>h2,
  div#kids_fashion .promotionDesc h2 {
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .touristPrivilegesCatMenuTabContent .promotionDesc p {
    display: -webkit-box;
    max-width: 100%;
    height: 28px;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
  }

  #guide_bg ul.dropdown-menu.promotionPageCatSelect {
    width: calc(100% - 10px);
  }

  p.aboutUsByCarTabBtn.tabBtn {
    padding: 0 35px 0 0;
  }

  p.aboutUsByCarTabBtn.tabBtn:last-of-type {
    padding: 0;
  }

  p.earningBtn.tabBtn {
    padding-right: 18px;
  }

  .participatingStoreWrapper {
    width: 780px;
    height: 360px;
  }

  .participatingStoreWrapper .swiper-container {
    width: 660px;
  }

  .participatingStoreSlide.swiper-slide.swiper-slide-prev {
    width: 660px;
    margin-right: 60px;
  }

  .participatingStoreWrapper .storeWrapper>* {
    vertical-align: middle;
    width: 50%;
  }

  .participatingStoreSlide.swiper-slide.swiper-slide-active {
    width: 660px;
    margin-right: 60px;
  }

  div#sign_up_vivo_rewards .stepsDescWrapper h3 {
    font-size: 16px;
    line-height: 24px;
  }

  .stepsRegisterContainer .stepsDescWrapper p {
    font-size: 12px !important;
    line-height: 19px !important;
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 40%;
  }

  /* .storeCat.container.contentContainer .searchBar {
  width: 350px;
  } */

  .storeCat.container.contentContainer .searchBar input {
    font-size: 16px;
  }

  .dropdownStoreCat.dropdown {
    width: calc(100% - 360px);
  }

  .myAccountContainer .halfContainer:first-child {
    margin-bottom: 64px;
  }

  .myAccountContainer .halfContainer {
    width: 100%;
  }

  .rewardsCatContent:not(.algoliaItem),
  .ais-Hits-item {
    width: calc(50% - 8px);
  }

  .rewardsCatContent:not(.algoliaItem):nth-child(3n) {
    margin-right: 16px;
  }

  .rewardsCatContent:not(.algoliaItem):nth-child(2n) {
    margin-right: 0;
  }
}

@media (max-width: 800px) {

  .whatsOnCatBtn.storehighlightsSection,
  .whatsOnFilterBtn,
  .whatsOnCatBtn.newStoreSection,
  .whatsOnCatBtn.kidsClubSection {
    min-width: 150px;
  }

  div#store_promotions .filterSection {
    margin-left: 10%;
  }

  .filterSection {
    margin-left: 5%;
  }

  div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(n) {
    width: 48%;
    margin-right: 16px;
  }

  div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(2n) {
    margin-right: 0;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(n) {
    width: 48%;
    margin-right: 16px;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(2n) {
    margin-right: 0;
  }

  .homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridPrimary {
    display: inline-block;
    width: 50%;
  }

  .homepageCategoryGrid .categoryGridRow:nth-child(1) .categoryGridSecondary {
    display: inline-block;
    width: 50%;
  }

  .homepageMainTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 40px;
    font-weight: bold;
    letter-spacing: -1.5px;
    line-height: 40px;
    max-width: 80vw;
    margin: 32px 40px;
    float: left;
  }

  .homepageCatBtnText {
    color: var(--color-accent);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: bold;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .whatsOnCatHomeBtn {
    border: 1px solid var(--color-border);
    border-radius: 22px;
    background-color: var(--color-white);
    padding: 8px 16px;
    max-height: 44px;
    min-width: 92vw;
    text-align: left;
  }

  .homepageBtnRowMobile {
    margin-top: 24px;
    margin-bottom: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .homepageSecondTitleSection {
    margin-top: 64px;
  }

  .homepageSecondTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 32px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 32px;
    margin-left: 40px;
  }

  .homepageSecondBanner {
    height: 200px;
    margin-top: 0;
  }

  .homepageCallToActionButton {
    margin-top: 24px;
    margin-bottom: 48px;
    margin-left: 40px;
  }

  .happeningPostImage {
    height: 175px;
  }

  .happeningPostContentWrapper {
    height: 210px;
  }

  div#whatsOnRevamp .eventsDiv .happeningPostWrapper:nth-child(n) {
    width: 100%;
  }

  div.whatsOnBtnContainer .swiper-button-next {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1729231286/Vivocity/Website%202024/Images/VivoCity%20New%20Pink%20-%20Oct%202024/icon_big_right.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;
  }

  div#homepageWhatsOn .happeningPostWrapper:nth-child(n),
  div.whatsOnContainer .promotionPost:nth-child(n) {
    width: 230px;
    margin-right: 16px;
  }

  div#homepageWhatsOn .happeningPostWrapper:nth-child(3),
  div.whatsOnContainer .promotionPost:nth-child(3) {
    width: 230px;
    margin-right: 0;
  }

  .participatingWrapper:nth-child(n) {
    width: 44%;
  }

  .ais-Hits-item:nth-child(n) {
    width: 50%;
  }

  .guideListThumbnail,
  .participatingThumbnailWrapper {
    height: 100%;
    width: 100%;
    border-bottom: 1px solid var(--color-border);
  }
}



@media(min-width:768px) {
  .daterangepicker td.available:not(.active):not(.start-date):not(.end-date):hover {
    background-color: transparent !important;
    background-image: url('https://cloudinary.alphapod.com/alphapod/image/upload/e_bgremoval,c_scale,w_100/v1697180991/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/black-ring-circle.png');
    background-size: contain;
    background-repeat: no-repeat;
    color: inherit !important;
  }

  .daterangepicker td.in-range:not(.available):not(.active):not(.start-date):not(.end-date):hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
  }
}

@media (max-width: 768px) {

  .btnWhatsOn:active,
  .btnWhatsOn:focus {
    background: var(--color-black) !important;
    background-image: none !important;
    opacity: 0.5 !important;
  }

  .btnWhatsOn:hover {
    background: var(--color-black) !important;
    background-image: none !important;
    opacity: 0.5 !important;
  }

  .btnWhatsOnSelected:active,
  .btnWhatsOnSelected:focus {
    background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
    opacity: 1 !important;
  }

  .btnWhatsOnSelected:hover {
    background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
    opacity: 1 !important;
  }

  .sectionButtonContainer .whatsOnBtnContainer {
    overflow: visible !important;
    padding-right: 64px;
  }

  .sectionButtonContainer .whatsOnBtnContainer .swiper-button-next {
    right: 16px !important;
    z-index: 3;
  }

  .animatedTitle::before {
    height: 100px;
    width: 100px;
  }

  .daterangepicker td.active.selectedDate span,
  .daterangepicker td.active.selectedDate span:hover {
    padding: 14px 0 !important;
  }

  .featurePopupDialogWrapper .swiper-container {
    max-height: 700px;
  }

  .featurePopupSlide.swiper-slide.advertisement {
    max-height: 70vh;
    max-width: 350px;
  }

  /*Press News Content*/

  .pressNewsHeaderContainer {
    margin-bottom: 32px;
  }

  .pressNewsContentContainer {
    padding: 56px 0px 64px 0px !important;
  }

  .pressNewsHeaderContainer h1 {
    font-size: 32px;
    line-height: 32px;
    letter-spacing: -1px;
  }

  .pressNewsBackButton {
    font-size: 12px;
    line-height: 20px;
    font-weight: 500;
    padding-bottom: 6px;
  }

  .pressNewsContent table {
    width: auto !important;
    box-sizing: border-box;
    margin: 0 16px !important;
  }

  .pressNewsContent p,
  .pressNewsContent li,
  .pressNewsContent table {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
  }

  /*End Press News Content*/

  header#top {
    border-bottom: 1px solid var(--color-border-light);
  }

  /* i.fas.fa-times.featuredPopupModalCloseIcon,
  i.fas.fa-times.loginModalCloseIcon,
  .newsletterModalContainer i.fas.fa-times.newsletterModalCloseIcon {
  width: auto;
  margin-left: 0;
  margin-top: -36px;
  right: 16px;
  } */

  /* Search*/
  .searchModalContent i.fas.fa-search {
    padding-left: 24px;
  }

  i.fas.fa-search {
    font-weight: 900;
    font-size: 18px;
    padding-top: 16px;
  }

  .searchModalContent input {
    height: 50px;
    padding: 16px 26px 16px 58px;
    font-size: 16px;
    color: var(--color-text);
    line-height: 19px;
  }

  /* form.search-form {
  margin: 0 24px;
  } */

  /* .searchHeader h1 {
  font-size: 28px;
  line-height: 33px;
  font-weight: 300;
  text-align: center;
  } */

  /* .searchHeader {
  padding: 60px 0;
  } */

  aside#searchbox {
    padding-bottom: 0;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 24px;
  }

  .searchContainer {
    padding: 0 16px !important;
    padding-top: 46px !important;
    padding-bottom: 64px !important;
  }

  #searchbox input {
    padding: 0 0 0 30px;
    font-size: 20px;
    line-height: 20px;
    font-weight: 300;
    vertical-align: top;
  }

  .ais-SearchBox-submitIcon {
    width: 20px;
    height: 20px;
  }

  .ais-Hits-item,
  .ais-InfiniteHits-item,
  .ais-InfiniteResults-item,
  .ais-Results-item {
    width: calc(50% - 1rem);
  }

  #stats {
    position: unset;
    top: 0;
    right: 0;
    text-align: center;
  }

  /* .ais-Stats {
  padding-bottom: 64px;
  } */
  /*End Search*/

  body.error404 main#main {
    position: relative;
    height: auto;
  }

  .error-404.not-found {
    width: 100%;
    padding: 32px 16px 64px !important;
  }

  .error-404.not-found .page-header {
    text-align: left;
  }

  .error-404.not-found h1.page-title {
    font-size: 24px;
    font-weight: bold;
    letter-spacing: -0.75px;
    line-height: 32px;
    padding-bottom: 24px;
    padding-top: 32px;
  }

  .noMatchesTitle {
    font-size: 24px;
    font-weight: bold;
    letter-spacing: -0.75px;
    line-height: 32px;
    padding-bottom: 24px;
  }

  .error-404.not-found p.page-content,
  .noMatchesDesc {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  div.error-404 .page-content .popularCardContainer .selectedShopDine .popularTitle {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 16px;
  }

  .error-404.not-found p.page-title {
    font-size: 16px;
    line-height: 28px;
    text-align: left;
  }

  .error-404.not-found .page-content,
  #no-matches .page-content {
    padding-top: 40px;
    padding-bottom: 64px;
  }

  .backToHomeBtnWrapper {
    text-align: left;
  }

  .headerTitleContainer h1,
  .singlePostContainer h1,
  .guidePostWrapper h1 {
    text-align: left;
    position: relative;
    font-size: 32px;
    line-height: 32px;
    letter-spacing: -1px;
    padding-bottom: 32px;
  }

  .singleStorePostTitle {
    text-align: left;
    position: relative;
    font-size: 18px;
    line-height: 18px;
    letter-spacing: -1px;
    padding-bottom: 32px;
    height: auto;
  }

  .selectedShopDineCatTitle {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -300%);
    padding-bottom: 0;
    position: relative;
    font-size: 28px;
    line-height: 33px;
    text-align: center;
  }

  .headerWrapper {
    padding: 0;
  }

  .headerWrapper h1 {
    padding: 0 16px 16px 16px;
  }

  .headerWrapper.container {
    position: relative;
  }

  .headerImage:after {
    height: 30%;
    /* background-image: unset; */
  }

  .singlePostImg:after,
  .guide_headerImage:after {
    height: 30%;
  }

  .site-content-contain {
    padding-top: var(--header-height-mobile);
    padding-bottom: 60px;
  }

  header#top .row {
    height: var(--header-height-mobile);
    justify-content: space-between;
  }

  .searchWrapper {
    width: auto;
    padding: 0;
  }

  .desktopShow {
    display: none !important;
  }

  .mobileShow {
    display: block !important;
  }

  .editProfileContainer {
    padding: 0 24px !important;
    margin-top: -16px;
    position: relative;
  }

  .memberInfoWrapper {
    width: 100%;
  }

  .basicInfo {
    margin-right: 0;
  }

  #editProfileForm {
    padding-top: 0;
  }

  .vivoRewardsInfo {
    background-color: var(--color-white);
    padding: 0 16px 16px;
  }

  .basicInfo {
    background-color: var(--color-white);
    padding: 16px 16px 0;
  }

  .container.editProfileContainer h3 {
    font-size: 22px;
    font-weight: 400;
    line-height: 27px;
  }

  .memberInfoWrapper .mobileField .countryCodeSelection {
    width: calc(33% - 35px);
    margin-right: 35px;
  }

  .memberInfoWrapper .mobileField .countryCodeSelection .selectCountryCodeBtn::after {
    display: none;
  }

  .memberInfoWrapper .mobileField input[name="member_mobile_no"] {
    width: calc(100% - 33%);
  }

  p.editProfileText {
    margin: 0 0 24px;
  }

  /*.vivoRewardsInfo {
  margin-top: 40px;
  }*/

  .promotionsContent h1 {
    font-size: 40px;
    line-height: 64px;
    letter-spacing: unset;
    padding-bottom: 8px;
    text-align: center;
  }

  .promotions .promotionsTopBar {
    padding-top: 48px;
  }

  .promotionsTabContainer .promotionContainer .promotionTitle {
    line-height: 27px;
  }

  .promotions .promotionsTabContainer {
    padding-bottom: unset;
    padding-top: unset;
  }

  .promotions .promotionsTabContainer .promotionContainer {
    font-size: 0;
  }

  .promotionsTabContainer .promotionContainer .promotionPost {
    width: calc(50% - 16px);
    padding-top: calc(100% - 32px);
    display: inline-block;
    margin: 0 8px;
    margin-bottom: 15px;
    position: relative;
    transition: 0.25s all;
    background-color: var(--color-white);
    overflow: hidden;
    height: 0;
  }

  .promotionsTabContainer .promotionContainer .promotionDetailsBox {
    padding: 24px 16px;
    height: auto;
    background-color: var(--color-white);
  }

  .promotionsTabContainer .promotionContainer .promotionContent {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin-top: -200%;
  }

  button.promotionBtn.btn-primary.dropdown-toggle {
    text-transform: capitalize;
    width: 100%;
    text-align: left;
    padding: 10px 0px 10px 16px;
    font-size: 16px;
    line-height: 28px;
    background-color: var(--color-off-white);
    border-radius: 4px;
    border: solid 1px var(--color-border);
    font-family: "Rubik", sans-serif;
    font-weight: 300;
    color: var(--color-text);
    cursor: pointer;
  }

  button.rewardsCatDropDownBtn.btn-primary.dropdown-toggle.mobileShow {
    width: 100%;
    text-align: left;
    padding: 10px 0px 10px 16px;
    font-size: 16px;
    line-height: 28px;
    background-color: var(--color-off-white);
    border-radius: 4px;
    border: solid 1px var(--color-border);
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-text);
    cursor: pointer;
    text-transform: capitalize;
  }

  .open>.rewardsCatDropDownBtn.btn-primary.dropdown-toggle.mobileShow:hover {
    background-color: var(--color-white) !important;
  }

  button.kidsClubOfferBtn.btn-primary.dropdown-toggle,
  button.kidsClubBirthdayOfferBtn.btn-primary.dropdown-toggle {
    width: 100%;
    text-align: left;
    padding: 10px 0px 10px 16px;
    font-size: 14px;
    line-height: 17px;
    background-color: var(--color-off-white);
    border-radius: 4px;
    border: solid 1px var(--color-border);
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-text);
    cursor: pointer;
    text-transform: uppercase;
  }

  button.touristPrivilegesCatDropDownBtn.btn-primary.dropdown-toggle,
  .touristPrivilegesCatMenu .open>.dropdown-toggle.btn-primary:hover {
    width: 100%;
    text-align: left;
    padding: 10px 0px 10px 16px;
    font-size: 14px;
    line-height: 17px;
    background-color: var(--color-off-white);
    border-radius: 4px;
    border: solid 1px var(--color-border);
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-text);
    cursor: pointer;
    text-transform: uppercase;
  }

  button.promotionBtn.btn-primary.dropdown-toggle::after,
  button.touristPrivilegesCatDropDownBtn.btn-primary.dropdown-toggle:after,
  button.rewardsCatDropDownBtn.btn-primary.dropdown-toggle.mobileShow:after {
    content: "\f0d7";
    font-family: "FontAwesome";
    font-size: 20px;
    color: var(--color-text);
    right: 12px;
    margin: 0;
    top: 12px;
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
  }

  .touristPrivilegesCatMenu .dropdown,
  .dropup,
  .rewardsCatMenu .dropdown {
    display: block;
  }

  .promotions ul.dropdown-menu.promotionCatSelect {
    margin-top: -1px;
    width: 100%;
    background-color: var(--color-white);
    padding: 0;
  }

  li.selectedPromotion {
    color: var(--color-text);
    padding: 3px 16px;
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
  }

  li.selectedPromotion:hover {
    background-color: var(--color-white);
  }

  a.touristPrivilegesType {
    font-size: 14px !important;
    line-height: 17px !important;
    text-transform: uppercase;
  }

  div#about a.rewardsBtn {
    font-size: 16px !important;
    line-height: 28px !important;
    text-transform: capitalize;
    padding: 8px 16px !important;
  }

  .promotionsTabContainer {
    padding-bottom: 0px;
  }

  .viewAllStoreBtnWrapper {
    padding-bottom: 56px;
  }

  .kidsClubOfferDropDownBtnWrapper.mobileShow {
    text-align: center;
    padding-bottom: 40px;
  }

  .promotionDropDownBtnWrapper.mobileShow {
    text-align: center;
    padding: 0 8px 40px 8px;
  }

  .promotionDropDownBtnWrapper.mobileShow .dropdown,
  .dropup {
    position: relative;
    display: block;
  }

  .promotionsContent {
    padding-bottom: 40px !important;
  }

  ul.dropdown-menu.submenucat>li {
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
  }

  li.touristPrivilegesBtn.selectedTouristPrivilegesBtn:before,
  li.rewardsType.selectedAboutType:before {
    content: unset;
    padding-left: 9px;
  }

  li.touristPrivilegesBtn.selectedTouristPrivilegesBtn.clicked {
    padding-left: 19px;
  }

  ul.dropdown-menu.submenucat>li {
    padding: 10px 0 5px 0;
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    font-style: normal;
  }

  li.touristPrivilegesBtn.selectedTouristPrivilegesBtn,
  li.rewardsType.selectedAboutType {
    padding-left: 19px !important;
    font-size: 14px !important;
    line-height: 17px !important;
  }

  .dropdownSpace {
    height: 10px;
  }

  li.selectedPromotion.selectedPromotionCat {
    color: var(--color-accent);
    background-color: unset;
  }

  .tenantLoginBtnWrapper {
    padding: 0 16px;
    width: fit-content;
  }

  .pinkBorderButton {
    border-radius: 28px;
  }

  .tenantLoginBtn {
    padding: 10px 24px !important;
    text-transform: none;
    font-weight: 700 !important;
  }

  #footer .downlaodWrapper {
    position: unset;
    top: unset;
    width: unset;
    height: unset;
  }

  #footer .download {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1727149831/Vivocity/Website%202024/Images/VR2024_Web_TopBtm_Banners_R3_FA-02.jpg");
    margin-top: 0;
    min-height: 220px;
  }

  #footer .downlaodWrapper .container {
    padding: 0px 16px 0 0 !important;
    position: unset;
    height: unset;
  }

  #footer .downloadBtnWrapper .downloadDescWrapper {
    padding-bottom: 16px;
    padding-top: 0;
  }

  #footer .downloadBtnWrapper .downloadDescWrapper p {
    padding-left: 0;
    font-size: 12px;
    line-height: 11px;
    max-width: 150px;
    padding-top: 0;
  }

  #footer .downloadBtnWrapper .downloadFooterTermsConditions {
    font-size: 8px;
    padding: 10px 0;
  }

  #footer img.handImg {
    padding-right: 26px;
    max-height: 220px;
  }

  #footer .socialMediaIcon {
    width: 100%;
    padding: 40px 0;
    text-align: center;
    padding-left: 0;
  }

  #footer i {
    margin-right: 8px;
    vertical-align: middle;
  }

  .socialMediaIcon>a:first-child {
    padding-right: 24px;
  }

  #footer .socialMedia {
    height: 100%;
  }

  #footer .socialMediaWrapper {
    height: unset;
    width: unset;
    padding: 0px 24px !important;
    background-image: url(https://d3nse58ioth0yc.cloudfront.net/wp/img_swirl.png);
    background-repeat: no-repeat;
    background-position: left bottom;
  }

  #footer .socialMediaWrapper .socialMediaIcon img {
    width: 24px;
    height: 24px;
  }

  #footer .socialMediaIcon p,
  #footer .socialMediaIcon a {
    font-size: 14px !important;
    line-height: 21px !important;
    padding-right: 32px;
  }

  #footer .socialMediaIcon p,
  #footer .socialMediaIcon a:last-child {
    padding-right: 0;
  }

  .scrollDownIndicator {
    bottom: 96px !important;
  }

  .cookieBanner {
    margin-bottom: 56px;
    height: auto;
  }

  .cookieBannerTextWrapper {
    padding: 16px 24px !important;
  }

  .cookieBannerTextInnerWrapper {
    overflow: hidden;
  }

  .cookieBanner p {
    width: calc(90%);
    display: -webkit-box;
    -webkit-line-clamp: unset;
    -webkit-box-orient: unset;
    overflow: auto;
  }

  .cookieBanner p,
  .cookieBanner a {
    font-size: 12px !important;
  }

  .cookieBanner img {
    position: absolute;
    object-fit: cover;
    width: 24px;
    height: 24px;
    right: 24px;
    top: 16px;
    bottom: auto;
    /* margin: auto; */
    cursor: pointer;
  }

  #footer .footerMobile {
    height: 60px;
    border-top: 1px solid var(--color-border-light);
    background-color: var(--color-white);
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 999999;
  }

  #footer .footerMobile .footerMobileTabList {
    margin: auto;
    padding: 0 12px;
    width: 100%;
    font-size: 0;
    text-align: center;
  }

  #footer .footerMobile .footerMobileTabList .tabIcon {
    display: inline-block;
    width: 18%;
    color: black;
  }

  #footer .footerMobile .footerMobileTabList .tabIcon img {
    width: 20px;
    height: 20px;
    object-fit: contain;
  }

  #footer .footerMobile .footerMobileTabList .tabIcon p {
    font-size: 10px;
    line-height: 11px;
    color: var(--color-border-strong);
    min-width: max-content;
  }

  div#newsletterWrapper {
    width: 100%;
    padding: 40px 0px 57px 0px;
  }

  .newsletterInputField input#email {
    width: 100%;
  }

  .footerRow {
    padding: 24px 8px 0px 8px;
  }

  .footerColumn {
    width: calc(50% - 5px);
    padding-bottom: 24px;
  }

  p.footerColumnContent:last-child {
    padding-bottom: 8px;
  }

  .copyrightRow {
    padding-top: 32px;
    padding-bottom: 0px;
  }

  .copyrightColumn {
    width: 100%;
    padding-bottom: 40px;
  }

  .copyrightColumn.right {
    text-align: unset;
  }

  .headerImage.homepageHeader {
    height: auto;
    padding-top: calc(100% / 1.25);
  }

  .headerImage {
    padding-top: calc(100% / 1.56);
    background-position: center;
  }

  .headerImage.vrHeaderImage,
  .headerImage.withTab {
    padding-top: calc(100% / 1.25);
    background-position: center;
  }

  .what_new {
    padding-top: 32px !important;
  }

  .what_new>div {
    display: block;
  }

  .what_new_desc {
    width: 100%;
    padding: 0 0 32px 0;
    text-align: center;
  }

  .what_new h1 {
    max-width: unset;
    padding-bottom: 8px;
    font-size: 40px;
    line-height: 64px;
  }

  .what_new h2 {
    line-height: 30px;
  }

  .whatsNewWrapperMainMobile {
    position: relative;
    width: unset;
  }

  .whatsNewWrapperMainMobile>div {
    display: unset;
    vertical-align: unset;
    width: 100%;
  }

  .leftWhatsNewWrapperMobile {
    padding-right: 0;
  }

  .rightWhatsNewWrapperMobile {
    padding-left: 0;
  }

  .leftWhatsNewWrapperMobile>a>div {
    margin-bottom: 16px;
  }

  .leftWhatsNewWrapperRowMobile>a:first-child,
  .rightWhatsNewWrapperRowMobile>a:first-child {
    margin-right: 14px;
  }

  .leftWhatsNewWrapperRowMobile>div {
    margin-bottom: 16px;
  }

  .whatsNewWrapperMainMobile p {
    color: var(--color-white);
    font-size: 17px;
    line-height: 24px;
    position: absolute;
    transform: translateY(-100%);
    padding: 0 0 24px 16px;
    z-index: 1;
  }

  .whatsNewWrapperMainMobile .homePageNewStoreBox {
    position: absolute;
    right: 0;
    font-size: 12px;
    line-height: 14px;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-white);
    background-color: var(--color-accent);
    letter-spacing: 0.64px;
    padding: 5px;
    text-transform: uppercase;
    display: inline-block;
  }

  .what_new .featuredWhatsNewMobileFirst {
    width: 100%;
    padding-top: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    margin-bottom: 16px;
  }

  .what_new .featuredWhatsNewMobileSecond {
    width: 100%;
    padding-top: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    margin-bottom: 44px;
  }

  .featuredWhatsNewMobileFirst::after,
  .featuredWhatsNewMobileSecond::after,
  .whatsNewMobile::after {
    display: block;
    background-image: linear-gradient(to bottom,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0.7) 100%);
    height: 50%;
    width: 100%;
    content: "";
    bottom: 0;
    position: absolute;
  }

  .what_new .whatsNewMobile {
    display: inline-block;
    width: calc(50% - 8px);
    padding-top: calc(50% - 8px);
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  }

  .shoppingGuideWrapper h1 {
    width: 100%;
    display: inline-block;
    margin-right: 0 !important;
    vertical-align: unset;
    text-align: center;
    padding-bottom: 16px;
    font-size: 40px;
    line-height: 64px;
  }

  .homepageShoppingGuide .guideNavBtnWrapper {
    width: 100%;
    text-align: center;
  }

  .homepageShoppingGuide .shoppingGuideWrapper .tabBtn:first-child {
    padding-right: 25px;
    padding-left: 0 !important;
  }

  .homepageShoppingGuide .shoppingGuideWrapper .tabBtn {
    margin: 0;
    padding: 0px;
    border-bottom: unset;
    padding-left: 25px !important;
  }

  .shoppingGuideWrapper .tabBtn {
    padding-bottom: 12px;
  }

  .smallGalleryImg::after,
  .bigGalleryImg::after,
  .smallGalleryImgMobile::after,
  .bigGalleryImgMobile::after {
    display: block;
    background-image: linear-gradient(to bottom,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0.6) 100%);
    height: 100%;
    width: 100%;
    content: "";
    bottom: 0;
    position: absolute;
  }

  .shoppingGuideWrapper .tabBtn.active:after {
    content: "";
    display: block;
    width: 0;
  }

  .shoppingGuideWrapper {
    padding-bottom: 12px !important;
    margin-bottom: 0;
  }

  .smallGalleryImgMobile,
  .smallGalleryImg {
    display: inline-block;
    width: 50%;
    height: calc(100vw / 3);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    vertical-align: top;
  }

  .bigGalleryImgMobile p,
  .bigGalleryImg p {
    position: relative;
    top: unset;
    transform: none;
    z-index: 1;
    text-align: left;
    font-size: 22px;
    line-height: 24px;
    padding-left: 16px;
    padding-bottom: 20px;
    color: var(--color-white);
    font-weight: 300;
  }

  .bigGalleryImgMobile,
  .bigGalleryImg {
    padding-top: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: unset;
    position: relative;
  }

  .smallGalleryImgMobile p,
  .smallGalleryImg p {
    position: relative;
    top: 100%;
    transform: translateY(-100%);
    z-index: 1;
    text-align: left;
    font-size: 22px;
    line-height: 24px;
    padding-left: 16px;
    padding-bottom: 20px;
    color: var(--color-white);
    font-weight: 300;
  }

  div#fbGuideGallery>div {
    width: 100%;
  }

  .shoppingGuide .leftGalleryWrapper,
  .shoppingGuide .rightGalleryWrapper {
    width: 100%;
  }

  .rightGalleryWrapper {
    height: unset;
  }

  /*Leasing Enquiry Mobile View*/

  .leasingEnquiryPageContainer {
    padding: 0;
  }

  .leasingEnquirySwipperImg,
  .mediaPanelImage,
  .pushCartImage {
    height: 333px;
    border-radius: 0;
  }

  .retailContent .blackLine,
  .eventSpaceContent .blackLine,
  .mediaPanelsContent .blackLine,
  .leasingEnquiryPageContainer .blackLine {
    margin: 40px 16px;
  }

  div#event-space .swiper-container {
    height: unset;
  }

  div#retail-space .swiper-container.retail-space_swiper {
    height: unset;
  }

  .guideNavBtnWrapper p.tabBtn span {
    padding: 0 0 12px 0 !important;
  }

  p.tabBtn:nth-last-child(2),
  p.tabHappeningBtn.tabBtn:nth-last-child(2),
  p.tabFunLearningBtn:nth-last-child(2),
  .touristTabBtn.tabBtn.dropdownTabBtn:nth-last-child(2),
  a.touristTabBtn.tabBtn:nth-last-child(2),
  p.tabPressRoomBtn:nth-last-child(2),
  p.promoPageTabBtn:nth-last-child(2) {
    border-bottom: none;
  }

  p.tabBtn span,
  p.tabFunLearningBtn span,
  a.touristTabBtn.tabBtn span,
  .touristTabBtn.tabBtn.dropdownTabBtn span,
  .tabPressRoomBtn span,
  .promoPageTabBtn span {
    position: relative;
    display: inline-block;
  }

  .tabBtn.active:after,
  .selectedTouristAboutInfo:after,
  .touristTabBtn.tabBtn.dropdownTabBtn:after,
  .tabBtn.active:not(a):after,
  .selectedHappeningCat:after,
  .selectedPressRoomType:after,
  .selectedFunLearningType:after,
  .selectedPromotionPageTypeCat:after,
  .selectedTimeSection:after,
  .selectedRewardsType:after,
  .selectedEarningRewardsType:after,
  .selectedSignUpType:after,
  .selectedVoucherDetails:after {
    content: "";
    height: 3px;
    display: block;
    background-color: var(--color-accent);
    margin-top: 12px;
    display: none;
  }

  .shoppingGuideBtnWrapper,
  .happeningPostsWrapper.tabBtnWrapper,
  .funLearningPostsWrapper,
  .touristTabWrapper,
  .rewardsPostsWrapper,
  .pressRoomPostsWrapper,
  .promotionPageTabBtnWrapper,
  .rewardsPostsWrapper.tabBtnWrapper,
  .membershipTabWrapper.tabBtnWrapper,
  .aboutUsTabWrapper,
  .leasingEnquiryPostsWrapper {
    padding-bottom: 24px;
    padding-left: 16px;
  }

  p.tabPressRoomBtn,
  p.tabFunLearningBtn,
  p.promoPageTabBtn,
  p.aboutUsTabBtn,
  p.touristTabBtn,
  p.tabLeasingEnquiryBtn,
  p.tabrewardsBtn {
    padding: 8px 16px;
    line-height: 24px;
    letter-spacing: -0.25px;
    background-color: rgba(0, 0, 0, 0.6);
  }

  .shoppingGuideBtnWrapper .blackLine,
  .happeningPostsWrapper.tabBtnWrapper .blackLine,
  .funLearningPostsWrapper .blackLine,
  .touristTabWrapper.tabBtnWrapper .blackLine,
  .pressRoomPostsWrapper .blackLine,
  .promotionPageTabBtnWrapper .blackLine,
  .rewardsPostsWrapper.tabBtnWrapper .blackLine,
  .membershipTabWrapper.tabBtnWrapper .blackLine {
    display: none;
  }

  .aboutUsTabWrapper.tabBtnWrapper.container {
    background-color: var(--color-white);
    padding-top: 0;
    margin: -17px 24px auto 24px;
    box-shadow: 0 18px 20px -20px rgba(0, 0, 0, 0.4);
    display: block;
  }

  #about_us_page .tabBtnWrapper {
    padding: 0 !important;
    width: auto;
    position: relative;
    z-index: 1;
  }

  .retailContent,
  .eventSpaceContent,
  .mediaPanelsContent,
  .pushCartContent {
    width: 100%;
    vertical-align: top;
    padding: 0px 16px;
  }

  div#retail-space {
    padding: 32px 0px 0px 0px;
  }

  div#event-space,
  div#media-panels,
  div#pushcarts {
    padding: 0;
  }

  div#event-space .swiper-pagination {
    bottom: 0px !important;
  }

  div#event-space .swiper-pagination-bullet {
    width: 40px;
    height: 3px;
  }

  div#event-space .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets>span.swiper-pagination-bullet:not(:last-of-type) {
    margin-right: 8px;
  }

  .retailContent p,
  .eventSpaceContent p,
  .mediaPanelsContent p,
  .pushCartContent p,
  .wifiContent p,
  .descCol .descContent {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .retailLastPara {
    white-space: normal;
  }

  .retailContent h1,
  .eventSpaceContent h1,
  .mediaPanelsContent h1,
  .pushCartContent h1 {
    font-size: 18px;
    line-height: 27px;
    letter-spacing: normal;
    padding-bottom: 16px;
  }

  .retailSpaceWrapper,
  .eventSpaceWrapper,
  .mediaPanelsWrapper,
  .pushCartWrapper {
    vertical-align: top;
    width: 100%;
  }

  .headerTitleContainer,
  .singlePostContainer,
  .guidePostWrapper {
    padding-top: 44px;
    padding-bottom: 0px;
  }

  /*Directoy Mobile View*/
  /* .guideListWrapper,
  .participatingWrapper,
  #algolia_store_tags_list .ais-Hits-item {
  padding: 0;
  display: block;
  width: 100%;
  margin: 0;
  margin-bottom: 0;
  background-color: var(--color-white);
  border-bottom: solid 1px var(--color-border);
  overflow: visible;
  } */

  /* #algolia_store_tags_list .ais-Hits-item {
  border-bottom: none;
  padding: 0;
  } */

  .guideListContentWrapper .colorLine,
  .guideListContent .guideCat,
  .websiteULWrapper,
  p.guideContactNum {
    display: none;
  }

  .happeningStoreContainer {
    margin: 0;
    padding: 0 8px 32px 8px;
  }

  .guideListThumbnail,
  .participatingThumbnailWrapper,
  .storeBtn {
    background-repeat: no-repeat;
    height: 60px;
    width: 60px;
    filter: unset;
    transition: all 0.25s;
    position: relative;
    border-bottom: none;
    display: inline-block;
    vertical-align: top;
    padding-top: 0;
  }

  .guideListContentWrapper,
  .participatingContentWrapper {
    position: relative;
    width: 100%;
    height: 100%;
    padding-top: 0;
    display: inline-block;
    vertical-align: top;
  }

  #algolia_store_tags_list .ais-Hits-item .guideListWrapper .guideListContentWrapper {
    width: 100%;
    height: 100%;
  }

  .guideListContent .guideLotNum,
  .participatingContent .participatingLotNum {
    font-size: 16px !important;
    line-height: 24px !important;
    font-style: italic !important;
    /* font-family: 'Barlow', sans-serif; */
  }

  #algolia_store_tags_list .ais-Hits-item .guideListWrapper:first-child {
    border-top: none;
  }

  /*End Directoy Mobile View*/

  /*Shopping Guide*/
  ul.dropdown-menu.guideFilter {
    border: 1px solid var(--color-border) !important;
    border-radius: 4px !important;
    padding: 0 !important;
  }

  li.selectedShopDine.selectedShopDineStore {
    color: var(--color-accent);
  }

  .shoppingGuideBtnWrapper {
    padding: 0;
  }

  div#shoppingShoppingGuideGallery,
  div#diningShoppingGuideGallery {
    padding: 48px 8px 0 8px;
  }

  .bigImgShoppingGuide {
    display: block;
    width: 100%;
  }

  .bigImgShoppingGuide,
  .halfImgShoppingGuide {
    display: block;
    width: 100%;
    border-radius: 0px 0px 8px 8px;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  }

  .smallImgShoppingGuide {
    border-radius: 0px 0px 8px 8px;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
  }

  .shoppingGuideImg {
    height: 221px;
  }

  .shoppingGuideContentWrapper,
  .smallShoppingGuideContentWrapper,
  .halfShoppingGuideContentWrapper {
    height: 162px;
    padding: 24px 16px 0 16px;
    margin-bottom: 24px;
    width: 100%;
    box-sizing: border-box;
  }

  .smallShoppingGuideImg {
    display: block;
    width: 100%;
    height: 218px;
  }

  .shoppingGuideContentWrapper a,
  .halfShoppingGuideContentWrapper a {
    font-size: 22px;
    line-height: 27px;
    font-weight: 400;
  }

  .rightWrapper {
    display: block;
    width: 100%;
    margin-left: 0;
  }

  .halfImgShoppingGuide:first-child {
    margin-right: 0;
  }

  .firstRowShoppingGuideWrapper,
  .secondRowShoppingGuideWrapper,
  .secondRowShoppingGuideWrapper {
    font-size: 0;
    padding-bottom: 0;
  }

  .halfShoppingGuideImg {
    height: 218px;
  }

  .leftWrapper {
    display: block;
    width: 100%;
    margin-right: 0;
  }

  .halfShoppingGuideDesc,
  .shoppingGuideDesc {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    max-height: 94px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }

  .shoppingGuideDescBG {
    padding: 32px 16px 40px 16px;
  }

  p.getShoppingGuideDesc.container {
    font-size: 16px;
    line-height: 28px;
    padding-top: 32px !important;
  }

  .headerTitleContainer span.selectedShopDineCat {
    text-transform: capitalize;
    font-size: 28px;
    line-height: 33px;
    text-align: center;
    color: var(--color-white);
    font-weight: 300;
    font-family: "Rubik", sans-serif;
    padding-right: 0;
  }

  .dropdownShopDine.btn-group.dropdown span.selectedShopDineCat {
    font-size: 14px;
    line-height: 17px;
  }

  .dropdownShopDine.dropdown button.btn.btn-default.dropdown-toggle {
    text-transform: capitalize;
    width: 100%;
    text-align: left;
    padding: 10px 16px;
    font-size: 16px;
    line-height: 28px;
    background-color: var(--color-off-white);
    border-radius: 4px;
    border: solid 1px var(--color-border);
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-text);
    box-shadow: none;
    cursor: pointer;
  }

  .open>.dropdown-toggle.btn-default:hover {
    background-color: var(--color-white) !important;
  }

  .dropdownShopDine.btn-group.dropdown {
    display: block;
    position: relative;
    display: inline-block;
    width: 100%;
  }

  .dropdownContainer {
    padding: 0 8px;
  }

  .down {
    transform: rotate(45deg);
    border: solid black;
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 2px;
    margin-bottom: 3px;
  }

  #guide_bg .dropdown-menu {
    width: 100%;
    margin-left: 0;
  }

  /*End Shopping Guide*/

  /*Happening Page*/
  /* .tabBtnWrapper {
  padding: 0px;
  } */

  div#whats_new,
  div#atrium_events {
    margin: 0;
    padding-top: 48px;
    padding-bottom: 78px;
  }

  div#atrium_events .happeningPostWrapper {
    width: calc(50% - 16px);
  }

  .happeningPostWrapper {
    width: calc(50% - 16px);
    height: 390px;
  }

  .singleHappeningPostTitle {
    padding-bottom: 16px;
    font-size: 28px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
  }

  .singleHappeningPostContent * {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  /* End Happening Page*/

  /*Single Post */
  .participatingStoreWrapper .swiper-button-prev,
  .participatingStoreWrapper .swiper-button-next {
    display: none;
  }

  .singlePostImg {
    height: auto;
    padding-top: calc(100% / 1.56);
    background-position: center;
  }

  .singleStoreTitle {
    position: relative;
    z-index: 2;
  }

  /* .singlePostImg.mobileShow:after {
  content: unset;
  } */

  .singleHappeningPostWrapper {
    width: 100%;
    margin: 0 0 32px 0;
    padding: 32px 0;
  }

  .singleHappeningPostContentWrapper {
    padding: 0;
    width: 100%;
  }

  /*Mall Promotion Single Post*/
  .singleMallPromotionPostContent {
    padding: 40px 8px 40px 8px;
  }

  h1.postTitle {
    font-family: var(--font-display);
    padding-bottom: 16px;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
  }


  .singleParticipating.container>h1 {
    padding: 32px 0 40px 0;
  }

  p.termConditionWrapper {
    padding: 24px 8px 64px 8px;
  }

  .happeningPdfWrapper {
    box-shadow: none;
    margin-bottom: 40px;
    max-width: 100%;
  }

  .participatingStoreWrapper .swiper-container {
    width: 327px;
  }

  .participatingStoreSlide.swiper-slide.swiper-slide-active {
    width: 327px;
    margin-right: 24px;
  }

  .participatingStoreWrapper {
    width: 327px;
    height: unset;
    max-height: 90%;
    margin: auto;
    overflow: hidden;
    margin-top: 45px;
  }

  .participatingStoreWrapper .storeImageWrapper {
    padding: 0;
    box-sizing: border-box;
    height: unset;
  }

  .participatingStoreWrapper .storeWrapper>* {
    display: block;
    width: 100%;
    text-align: center;
    border-right: none;
    overflow: auto;
    max-height: 327px;
  }

  .participatingStoreWrapper .storeWrapper .storeDetails {
    padding: 40px 0px;
  }

  .storeDetails .colorLine {
    width: 40px;
    height: 3px;
    margin: 16px auto 16px auto;
    background-color: var(--color-border-strong);
  }

  .promoDesc {
    padding: 8px 24px;
    text-align: left;
  }

  .participatingStoreWrapper .storeCategories {
    padding: 0 24px 8px 24px;
  }

  /* End Mall Prormotion SIngle Post*/
  /*End Single Post*/

  /*Fun and Leaning*/
  .kidsClubWrapper {
    padding: 32px 0px 0px 0px;
  }

  .playWrapper,
  .publicLibraryWrapper {
    padding: 32px 0px 64px 0px;
  }

  .funLearningContentWrapper h1 {
    padding-top: 24px;
    padding-bottom: 16px;
    font-size: 18px;
    line-height: 27px;
  }

  .kidsClubTermsCondition {
    padding-bottom: 64px;
  }

  .kidsClubTermsCondition ul {
    margin-left: 16px;
    padding: 0 0 16px 0;
  }

  .kidsClubTermsCondition li {
    list-style-position: outside;
    padding-left: 16px;
  }

  .kidsClubTermsCondition>p,
  .kidsClubTermsCondition a {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .funLearningDesc,
  .funLearningDesc>p {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .funLearningBtnBtn {
    border-radius: 28px;
    font-size: 12px;
    line-height: 24px;
    font-weight: 500;
  }

  .funLearningSignupHeader h1 {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.75px;
    padding-bottom: 24px;
  }

  .funLearningSignupContainer {
    padding: 0;
  }

  .funLearningLeftImageRow .funLearningContentWrapper {
    padding-left: 0px;
  }

  .funLearningRightImageRow .funLearningContentWrapper {
    padding-right: 0px;
  }

  .funLearningImageWrapper,
  .funLearningContentWrapper {
    width: 100%;
    display: block;
  }

  .funLearningImageWrapper {
    max-width: 75%;
    margin: 0 auto;
  }

  .funLearningLeftImageRow {
    width: 100%;
    padding: 0;
  }

  .funLearningRightImageRow {
    margin: 64px 0;
    width: 100%;
    padding: 0;
    display: flex;
    flex-direction: column-reverse;
  }

  .infoColumn.address>h1,
  .infoColumn.openingHours>h1,
  .infoColumn.contact>h1 {
    font-size: 20px;
    line-height: 32px;
    font-weight: 300;
    padding-bottom: 12px;
  }

  .infoContainer.container {
    padding: 0 24px !important;
  }

  .infoWrapper {
    background-color: var(--color-off-white);
  }

  .funLearningSignupMobileRow {
    overflow: visible !important;
  }

  .kidsClubWrapper .swiper-slide {
    width: 100%;
    max-width: 300px;
    height: auto;
  }

  .funLearningSwiperPaginationContainer {
    position: relative !important;
  }

  .kidsClubWrapper .swiper-pagination {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: -45px !important;
    -webkit-transition: 0.3s opacity;
    -o-transition: 0.3s opacity;
    transition: 0.3s opacity;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10;
  }

  .kidsClubWrapper .swiper-pagination-bullet {
    width: 40px;
    height: 3px;
    margin-right: 8px;
    display: inline-block;
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.25) !important;
    opacity: unset !important;
  }

  .kidsClubWrapper .swiper-pagination-bullet:last-child {
    margin-right: 0;
  }

  .kidsClubWrapper .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--color-accent) !important;
  }

  .funLearningSwiperBlackLine {
    margin-top: 91px !important;
  }

  .infoColumn {
    width: 100%;
    display: block;
    padding: 0;
  }

  .infoColumn:first-child {
    padding: 24px 0 0 0;
  }

  .infoColumn:last-child {
    padding: 0 0 24px 0;
  }

  #public-library .pinkLine {
    margin: 24px 16px;
  }

  #public-library .infoContainer {
    display: unset;
  }

  #public-library .infoColumn {
    display: block;
    width: 100%;
    margin: 0;
  }

  #public-library .infoColumn h1,
  #public-library .infoColumn p {
    border-left: none;
    padding-left: 16px;
    padding-right: 16px;
  }

  #public-library .infoColumn h1 {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: normal;
  }

  #public-library .infoColumn p {
    font-weight: 500;
    letter-spacing: -0.25px;
  }

  /*End Fun and Learning*/

  /*Tourist Inforrmation*/
  div#about-vivocity.touristInfoContainer .rowContent>div:first-child {
    margin-right: 0;
    margin-bottom: 40px;
  }

  .imageCol.wifiImage {
    margin-top: 48px;
  }

  .rowContent>div {
    display: block;
    width: 100%;
  }

  .designConcept {
    padding: 32px 0 64px 0;
  }

  .designConcept img {
    margin: auto;
    display: block;
    padding-right: 0px;
  }

  .designConceptDesc {
    display: block;
    width: 100%;
    padding-top: 16px;
  }

  .designConceptDesc p {
    letter-spacing: -0.25px;
    color: var(--color-text) !important;
  }

  img.bcaImg {
    padding-top: 24px;
    margin: auto;
    box-sizing: content-box;
    width: 120px;
    object-fit: contain;
  }

  .bcaText {
    width: 100%;
    padding: 32px 16px 24px 16px;
  }

  img.bcaImg,
  .bcaText {
    display: block;
  }

  .rowContent>div:first-child {
    margin: auto;
  }

  .touristAboutWrapper {
    border-bottom: 1px solid var(--color-gray-100);
    padding: 0;
    margin: 0px 16px;
  }

  p.touristAboutBtn.tabBtn {
    display: inline-block;
    border-bottom: unset;
    vertical-align: bottom;
    padding: 0 0 10px 0;
    margin: 0 32px 0 0;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
  }

  .selectedTouristAboutInfo {
    padding-bottom: 7px !important;
    border-bottom: 3px solid var(--color-accent) !important;
  }

  p.touristAboutBtn.tabBtn:nth-child(2) {
    margin-right: 0;
  }

  p.signUpBtn.tabBtn {
    display: inline-block;
    width: calc(50% - 3px);
    border-bottom: unset;
    vertical-align: bottom;
    padding: 0;
  }

  div#design_section div#park_leisure {
    padding-top: 40px;
  }

  div#design_section div#park_leisure .rowContent:first-child {
    padding-top: 0;
  }

  div#services .rowContent:nth-child(odd) .serviceCol,
  div#about-vivocity.touristInfoContainer .rowContent:nth-child(odd) .leisureCol,
  .rowContent:nth-child(odd) .intArtCol,
  #getting-to-sentosa .descCol {
    display: flex;
    flex-direction: column-reverse;
  }

  div#services .rowContent:nth-child(even) .serviceCol,
  div#about-vivocity.touristInfoContainer .rowContent:nth-child(even) .leisureCol,
  .rowContent:nth-child(even) .intArtCol,
  #getting-to-sentosa .descCol {
    display: flex;
    flex-direction: column;
  }

  div#services .customerService .serviceCol {
    display: flex;
    flex-direction: column !important;
  }

  .serviceHalfCol {
    width: 100%;
  }

  .customerServiceInnerBlackLine {
    margin: 32px 0 !important;
  }

  .serviceHalfCol:first-child,
  .serviceHalfCol:last-child {
    padding-left: 0;
    padding-right: 0;
  }

  div#about-vivocity.touristInfoContainer .rowContent .descCol:first-child,
  .imageCol.singleImage {
    margin-bottom: 0;
  }

  div#about_us_page div#services .rowContent:last-child {
    padding-top: 0;
  }

  /* div#about_us_page div#services .rowContent:last-child >.descCol .descTitle{
  font-size: 28px;
  line-height: 33px;
  } */

  div#about_us_page .descCol .descContent,
  #about_us_page .giftVouvherParticipatingLink {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
    vertical-align: top;
  }

  .imageCol.retailMeetsArchitectureImg {
    padding-top: 100%;
  }

  .rowContent {
    background-color: var(--color-white) !important;
  }

  .imageColMapletree {
    margin: auto;
    padding-top: 200px;
  }

  p.aboutMapleTreeDesc {
    font-size: 18px;
    line-height: 20px;
    font-weight: 700;
    font-family: var(--font-display);
  }

  .rowContent {
    padding-bottom: 96px;
  }

  .leisureRow,
  .intArtRow {
    padding-bottom: 32px;
  }

  .imageCol {
    border-radius: 0;
  }

  div#about_us_page div#services .wifiContent p {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  div#services .rowContent {
    padding-top: 32px;
    padding-bottom: 0;
  }

  div#services .rowContent:first-child {
    padding-top: 0px;
  }

  #aboutUsTimelineWrapper {
    padding-top: 64px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    touch-action: pan-x;
  }

  #aboutUsTimelineWrapper::-webkit-scrollbar {
    display: none;
  }

  .aboutUsTimeline {
    width: max-content;
    min-width: 100%;
    white-space: nowrap;
    box-sizing: border-box;
    padding-left: calc(50vw - 12px);
    padding-right: calc(50vw - 12px);
  }

  .aboutUsTimeline .oneYear {
    width: 285px;
  }

  .aboutUsTimelineYearName {
    right: auto;
    left: 100%;
    transform: translateX(-50%);
  }

  .aboutUsTimeline .oneYear:first-child .aboutUsTimelineYearName {
    left: 0;
  }

  .aboutUsTimeline .oneYear:first-child .aboutUsTimelineYearLine .dot {
    left: -4px;
    right: auto;
  }

  .aboutUsTimeline .oneYear:first-child.active .aboutUsTimelineYearLine .dot {
    left: -6px;
    right: auto;
  }

  .aboutUsAwardMobileArrow {
    display: block;
    position: absolute;
    left: 15px;
    top: 122px;
    z-index: 11;

    box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.25);
    border-radius: 50%;
  }

  .aboutUsAwardMobileArrow img {
    object-fit: contain;
    width: 32px;
    height: 32px;
  }

  .awardDetailsWrapper .yearAwards {
    padding: 36px 0 64px 0;
  }

  .awardName {
    font-family: var(--font-display);
    font-size: 14px;
    line-height: 20px;
  }

  .awardDesc {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .touristPrivilegesCatWrapper .dropdown-menu {
    display: none;
    float: left;
    background-color: var(--color-white) !important;
    border: 0;
    border-radius: 4px;
    width: 100% !important;
    padding: 10px 16px;
    border: 1px solid rgba(0, 0, 0, 0.15);
  }

  ul.dropdown-menu.submenucat.open {
    padding: 5px 16px 12px 0px;
    width: 250px !important;
    border: 0;
  }

  ul.dropdown-menu.submenucat {
    width: 250px !important;
    border: 0;
  }

  .open>.dropdown-menu {
    display: block !important;
  }

  .customerServiceBlackLine {
    margin: 32px 16px 64px 16px !important;
  }

  /* End Tourist Inforrmation*/

  /* About Us*/
  .aboutUsTabWrapper,
  .leasingEnquiryPostsWrapper,
  .touristTabWrapper,
  .rewardsPostsWrapper {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -ms-overflow-style: none;
    /* Internet Explorer 10+ */
    scrollbar-width: none;
  }

  .aboutUsTabWrapper::-webkit-scrollbar,
  .leasingEnquiryPostsWrapper::-webkit-scrollbar,
  .touristTabWrapper::-webkit-scrollbar,
  .rewardsPostsWrapper::-webkit-scrollbar {
    display: none;
  }

  .arrowIndicator {
    display: block;
    position: absolute;
    bottom: 24px;
    right: 16px;
  }

  .arrowIndicator img {
    object-fit: contain;
    width: 40px;
    height: 40px;
  }

  div#about_us_page div#about-vivocity .rowContent:nth-child(2) {
    padding-bottom: 64px;
  }

  .textColMapleTree {
    width: 100% !important;
  }

  #about_us_page .vcMap {
    padding: 0;
  }

  #about_us_page .vcMap .wpgmza_map {
    border-radius: 8px;
  }

  .parkingRateMobileWrapper.mobileShow,
  .seasonParkingWrapper {
    margin: 0 16px;
  }

  .mallDetailsContainer {
    display: unset;
  }

  #about_us_page .mallDetails:not(:last-child):after {
    display: none;
  }

  #about_us_page .mallDetails {
    display: block;
    width: 100%;
  }

  #about_us_page .mallDetails:last-child {
    padding-bottom: 0;
  }

  div#about-vivocity .container {
    padding: 0 32px !important;
  }

  div#tourist_page,
  div#about_us_page {
    background-color: var(--color-white);
    padding: 0;
  }

  .touristInfoContainer,
  .rewardsCatWrapper {
    margin-bottom: 0px;
  }

  div#enquiry,
  div#services,
  div#getting-here,
  .touristInfoContainer#about-vivocity {
    padding: 32px 0 64px 0 !important;
  }

  div#getting-to-sentosa {
    padding: 32px 16px 64px 16px !important;
  }

  .designConceptDesc p:last-child {
    padding-bottom: 0;
  }

  .aboutUsPage {
    padding-bottom: 64px;
  }

  #about_us_page .mallDetailsWrapper {
    padding: 24px 0;
  }

  #about_us_page .pinkLine {
    margin: 24px 16px;
  }

  #about_us_page .mallDetailsTitle,
  #about_us_page .mallDetailsVal {
    padding-left: 16px;
    border-left: none;
  }

  .aboutVivoCityContainer {
    padding: 32px 0px !important;
  }

  #about_us_page .mallDetailsTitle {
    font-family: var(--font-display);
    font-size: 14px;
    line-height: 20px;
  }

  .serviceLocationCricleWrapper img {
    width: 32px;
    height: 32px;
    object-fit: cover;
  }

  .descCol .descTitle {
    font-size: 18px;
    line-height: 20px;
    padding-bottom: 12px;
  }

  #about_us_page .giftVoucherDesc {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 700;
  }

  .descCol .desingerName {
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
    padding-bottom: 12px;
  }

  #about_us_page .mallDetailsVal {
    font-weight: 500;
    letter-spacing: -0.25px;
  }

  div#join-us {
    padding: 32px 0 64px 0 !important;
  }

  #about_us_page #join-us p,
  #about_us_page .JobLift li a,
  p.enquiryDesc {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  p.enquiryDesc {
    padding-bottom: 32px;
  }

  #about_us_page .JobLift li {
    padding-bottom: 16px;
  }

  #about_us_page .JobLift li:last-child {
    padding-bottom: 0;
  }

  #about_us_page .designConceptDesc>p:last-child {
    padding-bottom: 0;
  }

  #enquiryForm .genderSelection {
    width: 100%;
  }

  .memberInfoWrapper .formSingleField,
  #enquiryForm .formSingleField,
  #feedbackForm .formSingleField {
    padding-bottom: 32px;
  }

  #enquiryForm .consentField {
    padding-bottom: 24px !important;
  }

  .enquiriesCommentField {
    padding-bottom: 64px !important;
  }

  #enquiryForm .recaptchaWrapper {
    padding-left: 40px;
    padding-bottom: 32px;
  }

  .memberInfoWrapper input,
  #enquiryForm input,
  #enquiryForm textarea,
  #feedbackForm input,
  #feedbackForm textarea,
  .memberInfoWrapper .vivoDropdownBtn,
  #enquiryForm button.dropdown-toggle,
  .newsletterModalContent button.dropdown-toggle {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 400;
  }

  button.enquiryTypeSelectionbtn.btn-default.dropdown-toggle.selectEnquiryTypeBtn,
  button.categoryTypeSelectionbtn.btn-default.dropdown-toggle.selectCategoryTypeBtn,
  button.mobileCountryTypeSelectionbtn.btn-default.dropdown-toggle.selectCountryTypeBtn,
  .memberInfoWrapper input,
  #enquiryForm input,
  #enquiryForm textarea,
  #feedbackForm input,
  #feedbackForm textarea {
    border-radius: 8px;
  }

  #enquiryForm .privacyDescContainer h3,
  #feedbackForm .privacyDescContainer h3 {
    padding-bottom: 8px;
    font-weight: 700;
  }

  #enquiryForm .privacyDescContainer *,
  #feedbackForm .privacyDescContainer *,
  #enquiryForm .formSingleField.checkboxField p,
  #feedbackForm .formSingleField.checkboxField p {
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  #enquiryForm .formSingleField.checkboxField p,
  #feedbackForm .formSingleField.checkboxField p {
    padding-left: 16px;
  }

  #enquiryForm .pdpaDesc,
  #feedbackForm .pdpaDesc {
    padding-bottom: 64px;
  }

  #enquiryForm .mobileCountryTypeSelection {
    margin-right: 4px;
  }

  #enquiryForm .mobileNumberField {
    margin-left: 4px;
  }

  #enquiryForm input:focus,
  #enquiryForm textarea:focus,
  #feedbackForm input:focus,
  #feedbackForm textarea:focus {
    border: 2px solid var(--color-accent) !important;
  }

  .transportSwiperContainer {
    overflow: visible !important;
  }

  .transportSwiperContainer {
    margin-bottom: 64px !important;
  }

  div#getting-here .swiper-pagination {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 0px !important;
    -webkit-transition: 0.3s opacity;
    -o-transition: 0.3s opacity;
    transition: 0.3s opacity;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 0;
  }

  div#getting-here .swiper-pagination-bullet {
    width: 40px;
    height: 4px;
    margin-right: 8px;
    display: inline-block;
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.25) !important;
    opacity: unset !important;
  }

  div#getting-here .swiper-pagination-bullet-active {
    opacity: 1 !important;
    background: var(--color-accent) !important;
  }

  div#getting-here .swiper-pagination-bullet:last-child {
    margin-right: 0;
  }

  #about_us_page div#getting-here .transportDesc,
  #about_us_page div#getting-here .seasonParkingWrapper,
  .parkingRateMobileWrapper.mobileShow,
  .parkingRateMobileWrapper.mobileShow .transportDesc {
    position: relative;
    display: block;
  }

  #about_us_page div#getting-here .seasonParkingWrapper {
    padding-top: 64px;
  }

  #about_us_page .seasonParkingHeader,
  #about_us_page .valetParkingWrapper h3 {
    padding-bottom: 24px;
  }

  .transportTypeContainer,
  .transportIconContainer,
  .transportTextHeaderContainer,
  .transportLineContainer,
  .transportTextContainer {
    display: block;
  }

  #about_us_page .transportTypeContainer {
    display: block;
    padding-bottom: 44px;
  }

  .parkingTypeInfoMobileContainer {
    padding-top: 32px;
  }

  .transportIconContainer {
    width: 60px !important;
    margin: auto;
    padding-right: 0;
    padding-bottom: 16px;
  }

  .transportIconContainer img {
    width: 60px;
    height: 60px;
  }

  #about_us_page div#getting-here .transportDesc .transportTypeContainer .transportLineContainer {
    display: none;
  }

  #about_us_page div#getting-here .transportDesc .transportTypeContainer .transportTextContainer {
    padding-bottom: 0;
    width: 100%;
  }

  #about_us_page .transportTextHeaderContainer {
    text-align: center;
  }

  #about_us_page .transportTextHeaderTitle {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: normal;
  }

  #about_us_page div#getting-here .transportationWrapper .transportDesc .blackLine {
    margin-left: -17px;
    margin-right: -17px;
  }

  #about_us_page h2 {
    font-size: 18px;
    line-height: 27px;
    font-weight: 700;
    letter-spacing: normal;
    padding-bottom: 24px;
  }

  #about_us_page .seasonParkingHeaderTitle,
  #about_us_page .valetParkingWrapper h3 {
    font-size: 18px;
    line-height: 27px;
    font-weight: 700;
    letter-spacing: normal;
  }

  #about_us_page .seasonParkingContainer h3 {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 700;
    padding-bottom: 8px;
  }

  p.seasonParkingCaption {
    padding-top: 16px;
  }

  #about_us_page .seasonParkingContainer p,
  #about_us_page .transportDesc p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
  }

  #about_us_page .transportDesc .parkingRateText {
    padding-bottom: 24px;
  }

  #enquiryForm .enquiryTypeSelection {
    width: 100%;
  }

  .memberInfoWrapper .twoColField,
  #enquiryForm .twoColField,
  #feedbackForm .twoColField {
    display: inline-block;
    width: 100%;
  }

  #feedbackForm .attachmentField .attachmentNameContainer,
  #feedbackForm .attachmentField .chooseFileBtn {
    width: 100% !important;
    margin-right: 0;
    vertical-align: top;
  }

  #feedbackForm .attachmentField .attachmentNameContainer {
    margin-bottom: 16px;
  }

  #feedbackForm .attachmentField .chooseFileBtn {
    text-align: center;
  }

  #enquiryForm .formSingleField.checkboxField,
  #feedbackForm .formSingleField.checkboxField {
    width: 100%;
  }

  #enquiryForm .twoColField.leftField,
  #feedbackForm .twoColField.leftField {
    padding-right: 0;
  }

  #enquiryForm .postCodeField,
  #feedbackForm .postCodeField,
  #feedbackForm .datetimeVisitField {
    max-width: unset;
  }

  #enquiryForm .twoColField.rightField,
  #feedbackForm .twoColField.rightField {
    padding-left: 0;
    padding-right: 0;
  }

  .enquirySwitchPosition {
    display: flex;
    flex-direction: column-reverse;
  }

  #enquiryForm .selectionDropdown li:hover {
    background-color: unset;
  }

  #about_us_page .serviceCol,
  #services .serviceCol {
    padding: 0 16px;
  }

  .serviceTextCol,
  .leisureTextCol,
  .intArtTextCol,
  .sentosaTextCol {
    width: 100%;
  }

  .serviceTextColLeft,
  .leisureTextColLeft,
  .intArtTextColLeft,
  .serviceTextColRight,
  .leisureTextColRight,
  .intArtTextColRight {
    padding-left: 0;
    padding-right: 0;
    padding-top: 24px;
    padding-bottom: 0;
  }

  .serviceImgCol,
  .leisureImgCol,
  .intArtImgCol,
  .sentosaImageCol {
    width: 100%;
    padding-top: 100%;
    max-width: 75%;
    margin: 0 auto;
  }

  .freeWifiStepCircleWrapper {
    padding-right: 16px;
  }

  .freeWifiStepContainer {
    padding-top: 40px;
    padding-bottom: 32px;
    max-width: 250px;
    margin: auto;
  }

  .freeWifiStepWrapper {
    padding-bottom: 32px;
  }

  .freeWifiStepWrapper:last-child {
    padding-bottom: 0;
  }

  .freeWifiStepCircle {
    height: 32px;
    width: 32px;
  }

  .freeWifiStepCircle span {
    font-size: 14px;
    line-height: 16px;
    letter-spacing: normal;
  }

  .dottedLineWrapper {
    width: 32px;
    top: 32px;
  }

  .wifiContent .freeWifiTouristDesc h4 {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: normal;
    padding-bottom: 8px;
  }

  #about_us_page .transportHeader {
    padding-top: 54px;
    padding-bottom: 16px;
    text-align: center;
    margin: auto;
  }

  .aboutUsByCarInfoMobileContainer {
    padding-top: 32px;
  }

  #about_us_page .aboutUsByCarInfoMobileContainer>div,
  .parkingRateWrapper .descContent,
  .transportTextContainer .descContent {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
  }

  /* End About Us*/

  /*Getting Here*/
  /* .aboutUsByCarTabDropDownBtnWrapper.mobileShow, .parkingRateDropDownBtnWrapper.mobileShow {
  padding-bottom: 16px;
  } */

  .dropDownaboutUsByCarTabCat.dropdown,
  .dropDownParkingRateCat.dropdown {
    position: relative;
    display: block;
  }

  .dropDownaboutUsByCarTabCat.dropdown .dropdown-menu.show,
  .dropDownaboutUsByCarTabCat.dropdown.open>.dropdown-menu,
  .dropDownParkingRateCat.dropdown .dropdown-menu.show,
  .dropDownParkingRateCat.dropdown.open>.dropdown-menu {
    display: block;
  }

  button.aboutUsByCarBtn.btn-primary.dropdown-toggle,
  div#getting-here .open>.dropdown-toggle.btn-primary:hover,
  button.parkingRateBtn.btn-primary.dropdown-toggle {
    text-transform: capitalize;
    width: 100%;
    text-align: left;
    padding: 10px 16px;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
    border-radius: 28px;
    background-color: transparent;
    border: 0;
    font-family: var(--font-body);
    color: var(--color-accent);
    cursor: pointer;
    border: solid 1px var(--color-border);
  }

  button.aboutUsByCarBtn.btn-primary.dropdown-toggle:after,
  button.parkingRateBtn.btn-primary.dropdown-toggle:after {
    content: "\f0d7";
    font-family: "FontAwesome";
    font-size: 20px;
    color: var(--color-text);
    right: 16px;
    margin: 0;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
    border: none;
    transition: transform 0.25s ease;
  }

  .dropDownaboutUsByCarTabCat.dropdown.is-open>button.aboutUsByCarBtn.btn-primary.dropdown-toggle:after,
  .dropDownaboutUsByCarTabCat.dropdown.open>button.aboutUsByCarBtn.btn-primary.dropdown-toggle:after,
  .dropDownaboutUsByCarTabCat.dropdown.show>button.aboutUsByCarBtn.btn-primary.dropdown-toggle:after,
  .dropDownaboutUsByCarTabCat.dropdown>button.aboutUsByCarBtn.btn-primary.dropdown-toggle[aria-expanded="true"]:after,
  .dropDownParkingRateCat.dropdown.is-open>button.parkingRateBtn.btn-primary.dropdown-toggle:after,
  .dropDownParkingRateCat.dropdown.open>button.parkingRateBtn.btn-primary.dropdown-toggle:after,
  .dropDownParkingRateCat.dropdown.show>button.parkingRateBtn.btn-primary.dropdown-toggle:after,
  .dropDownParkingRateCat.dropdown>button.parkingRateBtn.btn-primary.dropdown-toggle[aria-expanded="true"]:after {
    transform: translateY(-50%) rotate(180deg);
  }

  ul.dropdown-menu.aboutUsByCaratSelect,
  ul.dropdown-menu.parkingRateCatSelect {
    margin-top: 0;
    width: 100%;
    min-width: 100%;
    max-width: none;
    float: none;
    left: auto;
    top: calc(100% + 8px);
    position: absolute;
    border-radius: 8px;
    background-color: var(--color-white);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
    padding: 0;
    overflow: hidden;
    display: none;
  }

  ul.dropdown-menu.parkingRateCatSelect {
    margin-top: 8px;
    z-index: 20;
    background-color: var(--color-white);
  }

  ul.dropdown-menu.aboutUsByCaratSelect {
    box-sizing: border-box;
  }

  li.aboutUsByCarDropdownBtn.selectedAboutUsByCarInfo.active,
  li.selectedParkingRate.selectedMobileParkingInfo {
    color: var(--color-accent);
  }

  li.aboutUsByCarDropdownBtn,
  li.selectedParkingRate {
    color: var(--color-text);
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: -0.25px;
    padding: 14px 16px;
  }

  .dropDownaboutUsByCarTabCat.dropdown li:not(:last-child),
  .dropDownParkingRateCat.dropdown li:not(:last-child),
  .dropDownPressReleaseYear.dropdown li:not(:last-child) {
    border-bottom: 1px solid var(--color-border-light);
  }

  .dropDownShadow {
    position: absolute;
    top: 65px;
    left: 0;
    width: 100%;
    height: 249px;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
    z-index: 0;
    margin-top: 1px;
    display: none;
    background-color: var(--color-white);
  }

  .dropDownShadowParking {
    position: absolute;
    top: 63px;
    margin-left: -7px;
    width: 102.5%;
    left: 0;
    margin-top: 1px;
    height: 163px;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.15);
    z-index: 0;
    display: none;
    background-color: var(--color-white);
  }

  .dropDownShadowDirectory {
    position: absolute;
    top: -700px;
    left: -53px;
    width: 200%;
    height: 10000px;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
    display: none;
  }

  .dropDownShadowALphabetFilter {
    position: absolute;
    top: -700px;
    left: -53px;
    width: 200%;
    height: 10000px;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
    display: none;
  }

  #about_us_page .transportDesc.twoCol {
    display: inline-block;
    width: 100%;
    vertical-align: top;
    padding-bottom: 0;
  }

  #about_us_page .transportationWrapper {
    padding-bottom: 0;
  }

  div#getting-here .seasonParkingWrapper .blackLine.mobileShow {
    padding-bottom: 24px;
    margin: 0 -17px;
  }

  #about_us_page .parkingRateMobileWrapper.mobileShow .transportDesc .blackLine {
    margin: 0 -24px;
  }

  .timeContainer h1,
  .motorCycleTimeContainer h1 {
    font-size: 20px;
    line-height: 32px;
    font-weight: 300;
  }

  .mon-FriDesc,
  .weekendDesc,
  .motorCycleTimeContainer .mon-FriDesc,
  .motorCycleTimeContainer .weekendDesc {
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
    padding-bottom: 39px;
  }

  .timeTabBtn {
    position: relative;
    display: inline-block;
    width: fit-content;
    box-sizing: content-box;
    margin-right: 32px;
  }

  p.timeShow {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
  }

  .motorCycleTimeContainer {
    padding-top: 24px;
  }

  div#mobile_motorcar .timeTabBtn:first-child>p {
    padding-left: 0;
    margin-bottom: 4px;
  }

  div#mobile_motorcycle .timeTabBtn:first-child>p {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 4px;
  }

  .timeTabBtn:first-child span {
    padding: 0 0 3px 0;
    position: relative;
    display: inline-block;
  }

  .timeTabBtn span {
    padding: 0 0 7px 0;
    position: relative;
    display: inline-block;
  }

  .timeTabBtn.selectedTimeSection::after,
  div#mobile_motorcycle div#defaultTimeOpen::after {
    content: "";
    height: 3px;
    display: block;
    background-color: var(--color-accent);
    width: 100%;
    left: 0;
    position: absolute;
    bottom: 0;
  }

  .open>.parkingRateBtn.btn-primary.dropdown-toggle:focus,
  .open>.parkingRateBtn.btn-primary.dropdown-toggle:hover,
  .open>.aboutUsByCarBtn.btn-primary.dropdown-toggle:focus,
  .open>.aboutUsByCarBtn.btn-primary.dropdown-toggle:hover {
    background-color: var(--color-white);
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border);
  }

  #about_us_page .transportTitle img {
    height: 32px;
  }

  div#mobile_motorcar .timeTabBtn.selectedTimeSection>p,
  div#mobile_motorcycle .timeTabBtn.selectedTimeSection>p,
  div#mobile_motorcycle div#defaultTimeOpen>p {
    color: var(--color-accent);
  }

  img.gettingHereImg {
    margin-bottom: 16px;
  }

  #about_us_page .parkingTypeInfoMobileContainer .timeTabBtnWrapper .blackLine {
    padding-bottom: 0;
    margin: 0 !important;
  }

  .timeContainer,
  .motorCycleTimeContainer {
    padding-top: 24px;
  }

  .timeContainer table,
  .motorCycleTimeContainer table {
    margin-bottom: 0;
  }

  .timeContainer tr:first-child th,
  .timeContainer tr:first-child td,
  .motorCycleTimeContainer tr:first-child th,
  .motorCycleTimeContainer tr:first-child td {
    padding: 0 0 16px 0;
  }

  .timeContainer th,
  .timeContainer td,
  .motorCycleTimeContainer th,
  .motorCycleTimeContainer td {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    padding: 16px 0;
    width: 50%;
    text-align: left;
  }

  .timeContainer tr:last-child th,
  .timeContainer tr:last-child td,
  .motorCycleTimeContainer tr:last-child th,
  .motorCycleTimeContainer tr:last-child td {
    padding: 16px 0 0 0;
  }

  .timeContainer tr:not(:last-child),
  .motorCycleTimeContainer tr:not(:last-child) {
    border-bottom: solid 1px var(--color-border);
  }

  .timeContainer th,
  .motorCycleTimeContainer th {
    border: none;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 700;
    vertical-align: middle;
    word-break: break-word;
  }

  .timeContainer td,
  .motorCycleTimeContainer td {
    vertical-align: middle;
    font-weight: 500;
    border: none;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    padding: 0;
    word-break: break-word;
  }

  p.timeShow:not(:first-child) {
    padding-left: 13px;
  }

  /*End Getting Here*/

  /*Single Store*/

  .singleStorePostWrapper {
    display: flex;
    padding-bottom: 22px;
  }

  .singleStorePostHeaderContentWrapper {
    order: 2;
    height: fit-content;
    align-self: center;
    position: relative;
    bottom: 0;
  }

  a.singlePostImage {
    width: fit-content;
    height: fit-content;
  }

  /* .singlePostImage {
  order: 1;
  } */

  .singleStorePostTitle {
    font-size: 16px;
    line-height: 28px;
    letter-spacing: -0.25px;
    line-height: 24px;
    text-align: left;
    padding-bottom: 0;
  }

  .singleStorePostRoundImage.mobileShow {
    height: 48px;
    width: 48px;
    margin: auto 16px auto 0;
    background-size: contain;
    background-color: var(--color-white);
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    -moz-border-radius: 99em;
    border-radius: 99em;
    border: 3px solid var(--color-white);
    background-position: center;
  }

  .singleStorePostHeaderContentWrapper {
    display: block;
    padding-left: 0;
    width: 100%;
  }

  .singlePostCategoriesWrapperMobile.mobileShow {
    padding-top: 68px;
    text-align: center;
  }

  .singleStorePostCategoriesMobile,
  p.singleStoreLotNumMobile {
    display: inline-block;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 27px;
    color: var(--color-text);
  }

  .singlePostCategoriesWrapperMobile.mobileShow .vl {
    color: var(--color-text);
    border-left: 2px solid var(--color-text);
    height: 23px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 5px 4px 5px;
    margin-bottom: 4px;
    margin-left: 6px;
    margin-right: 6px;
  }

  .singleStorePostContent p {
    padding: 24px 0 40px 0;
  }

  div#store_guide_bg .infoContainer .infoBox:first-child {
    border-left: 0;
  }

  div#store_guide_bg .infoContainer .infoBox .infoContent {
    padding-left: 13px;
    padding-right: 4px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;

  }

  div#store_guide_bg .infoContainer .infoBox:nth-child(2) .infoContent::before,
  div#store_guide_bg .infoContainer .infoBox:nth-child(3) .infoContent::before {
    content: '';
    border-left: 3px solid var(--color-accent);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 20px;
  }

  div#store_guide_bg .infoContainer .infoBox:first-child .infoContent {
    padding-left: 0;
  }

  .singleStorePostContactInfoWrapper {
    background-color: transparent;
    text-align: center;
    width: 100%;
    margin: auto;
    border: 0;
    padding: 0;
    display: block;
  }



  a.singleStorePostContact {
    text-align: left;
    display: block;
  }

  a.singleStorePostURL {
    text-align: left;
    display: block;
  }

  .singlePostStorePromotionWrapper h1 {
    padding-top: 40px;
  }

  .singleDirectory.container {
    padding: 0 24px !important;
  }

  .promotionImageWrapper {
    width: 100%;
    display: block;
  }

  .map-container {
    padding-top: 24px;
  }

  .map-container iframe {
    height: 600px;
  }

  .promotionContentWrapper {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-top: 18px;
  }

  .promotionOffersContainer {
    width: 100%;
    padding-bottom: 56px;
  }

  /*End Single Store*/

  /*Press Room*/
  .pressReleaseWrapper .dropdown-menu {
    display: none;
  }

  .pressReleaseWrapper .dropdown.show .dropdown-menu,
  .pressReleaseWrapper .dropdown.open>.dropdown-menu,
  .dropDownPressReleaseYear.dropdown .dropdown-menu.show,
  .dropDownPressReleaseYear.dropdown.open>.dropdown-menu {
    display: block;
  }

  div#press-releases {
    padding: 32px 0;
  }

  div#press-releases .invisibleLine {
    padding: 8px 0px;
  }

  ul.dropdown-menu.yearSelect {
    padding: 11px 0 6px 0 !important;
  }

  .pressReleaseYear {
    width: 100%;
    display: block;
    margin: 0;
  }

  .pressRoomBox {
    position: relative;
  }

  .pressRoomPostContentWrapper {
    border-radius: 0 0 16px 16px;
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 80px 16px 24px 16px;
    position: absolute;
    bottom: 0;
    z-index: 2;
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.74) 50%,
        rgba(0, 0, 0, 1) 100%);
  }

  .pressRoomPostContentWrapper .pinkLine {
    margin: 8px 0;
  }

  p.pressRoomPostTitle {
    color: var(--color-white) !important;
    font-size: 18px;
    line-height: 27px;
  }

  p.pressRoomPostDate {
    color: var(--color-muted);
  }

  .pressRoomPostImage {
    display: block;
    width: 100%;
    padding-top: 100%;
    border-radius: 16px;
  }

  a.mediaKitLinkWrapper {
    width: 100%;
    display: block;
    margin-left: 0 !important;
    margin-bottom: 16px;
    box-shadow: none;
    height: auto;
  }

  a.mediaKitLinkWrapper:hover {
    box-shadow: unset;
  }

  i.far.fa-file-pdf {
    padding: 39px;
    height: auto;
    border-right: solid 1px var(--color-border);
  }

  p.pressRoom_singlePDF {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: normal;
  }

  p.pressRoom_pdfFileSize {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .pressRoom_pdfWrapper .colorLine {
    width: 40px;
    margin: 12px 0;
  }

  p.singlePDF {
    line-height: 30px;
  }

  .pdfDesc {
    max-width: calc(100% - 50px);
  }

  div#media-kit {
    padding: 40px 0 64px 0;
  }

  /* .mediaKitWrapper {
  padding: 0 8px;
  } */

  h1.mediaKitTitle.mobileShow {
    padding-bottom: 16px;
    font-size: 40px;
    line-height: 64px;
  }

  button.touristPrivilegesBtn.btn-primary.dropdown-toggle.mobileShow {
    text-transform: capitalize;
    width: 327px;
    text-align: left;
    padding: 10px 0px 10px 16px;
    font-size: 14px !important;
    line-height: 17px !important;
    background-color: var(--color-off-white);
    border-radius: 4px;
    border: solid 1px var(--color-border);
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-text);
    cursor: pointer;
  }

  button.pressReleaseYearBtn.btn-primary.dropdown-toggle {
    text-transform: capitalize;
    width: 100%;
    text-align: left;
    padding: 10px 16px;
    font-size: 14px !important;
    line-height: 24px !important;
    letter-spacing: -0.25px;
    background-color: transparent;
    border-radius: 28px;
    border: solid 1px var(--color-border);
    font-family: var(--font-body);
    font-weight: 500;
    cursor: pointer;
  }

  .open>.pressReleaseYearBtn.btn-primary.dropdown-toggle:hover {
    background-color: var(--color-white);
    color: var(--color-text);
    border: solid 1px var(--color-border);
  }

  .dropDownPressReleaseYear.dropdown {
    position: relative;
    display: block;
  }

  .dropDownPressReleaseYear.dropdown .dropdown-menu.show,
  .dropDownPressReleaseYear.dropdown.open>.dropdown-menu {
    display: block;
  }

  ul.dropdown-menu.yearSelect {
    margin-top: 0;
    width: 100%;
    min-width: 100%;
    max-width: none;
    float: none;
    left: auto;
    top: calc(100% + 8px);
    position: absolute;
    border-radius: 8px !important;
    background-color: var(--color-white) !important;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
    padding: 0;
    overflow: hidden;
    display: none;
  }

  button.promotionPageBtn.btn-primary.dropdown-toggle,
  .btn-primary.active.focus,
  .btn-primary.active:focus,
  .btn-primary.active:hover,
  .btn-primary:active.focus,
  .btn-primary:active:focus,
  .btn-primary:active:hover,
  .open>.dropdown-toggle.btn-primary.focus,
  .open>.dropdown-toggle.btn-primary:focus,
  .open>.dropdown-toggle.btn-primary:hover {
    width: 100%;
  }

  button.pressReleaseYearBtn.btn-primary.dropdown-toggle:after {
    content: "\f0d7";
    font-family: "FontAwesome";
    font-size: 20px;
    color: var(--color-text);
    right: 16px;
    margin: 0;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
    border: none;
    transition: transform 0.25s ease;
  }

  .dropDownPressReleaseYear.dropdown.is-open>button.pressReleaseYearBtn.btn-primary.dropdown-toggle:after,
  .dropDownPressReleaseYear.dropdown.open>button.pressReleaseYearBtn.btn-primary.dropdown-toggle:after,
  .dropDownPressReleaseYear.dropdown.show>button.pressReleaseYearBtn.btn-primary.dropdown-toggle:after,
  .dropDownPressReleaseYear.dropdown>button.pressReleaseYearBtn.btn-primary.dropdown-toggle[aria-expanded="true"]:after {
    transform: translateY(-50%) rotate(180deg);
  }

  .selectedPressReleaseYearCat {
    color: var(--color-accent);
    font-size: 14px;
    line-height: 17px;
  }

  li.yearBtnMobile {
    padding: 14px 16px;
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: -0.25px;
    color: var(--color-text);
  }

  .promotionsPage ul.dropdown-menu.promotionCatSelect {
    padding: 5px 0 0 0;
    margin-top: -1px;
    width: 352px;
    background-color: var(--color-off-white);
  }

  .pressReleaseYearMobileDropdown.mobileShow {
    text-align: center;
    padding-bottom: 40px;
  }

  /*End Press Room*/

  /*Promotion Page*/
  option.month-cell.cell.selected {
    color: var(--color-white) !important;
  }

  .range-calendar .months .cell.selected,
  #promotions_calendar .monthDropdown .months option:hover {
    color: var(--color-accent) !important;
    background-color: var(--color-white) !important;
  }

  li.selectedPromotionPageSubCat.selectedPromotionDropdownBtn a {
    background-color: var(--color-accent);
    color: var(--color-white);
  }

  .promotionsPageTopBar .blackLine.mobileShow {
    margin: 0 -200px 0 -200px;
  }

  #promotions_calendar span.nextcall {
    left: calc(50% + 210px) !important;
    z-index: 1;
    margin-top: 26px;
    right: unset;
    margin-top: 20px;
  }

  #promotions_calendar span.previous {
    right: calc(50% + 210px) !important;
    z-index: 1;
    margin-top: 26px;
  }

  .promotionsPageTopBar>* {
    display: unset;
  }

  div#promotions_calendar:not(.hidden-dropdown) {
    display: block !important;
  }

  .wrapper:not(.hidden-dropdown) {
    display: block;
    width: 100%;
    text-align: center;
    padding-top: 40px;
  }

  .dropDownPromoWrapper {
    width: 100%;
    display: block;
    padding: 40px 0;
  }

  span.selectedPromotionPageCat {
    text-align: left;
    font-weight: 400;
  }

  div#promotions_calendar .wrapper:nth-child(3) {
    width: 420px;
  }

  #promotions_calendar .monthDropdown button {
    padding: 10px 0 10px 16px;
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    width: 100%;
    text-align: left;
    font-weight: 400;
  }

  .promotionsPageTopBar .dropdown,
  .dropup {
    position: relative;
    display: block;
  }

  button.promotionPageBtn.btn-primary.dropdown-toggle {
    font-size: 14px !important;
    line-height: 17px !important;
    background-color: var(--color-white);
  }

  .open>button.promotionBtn.btn-primary.dropdown-toggle:hover {
    background-color: var(--color-white);
    color: var(--color-text);
    border: 1px solid var(--color-border);
  }

  .open>.dropdown-toggle.btn-primary:hover {
    background-color: var(--color-white);
  }

  .kidsClubOfferDropDownBtnWrapper.mobileShow .open>.dropdown-toggle.btn-primary:hover,
  .kidsClubBirthdayOfferDropDownBtnWrapper.mobileShow .open>.dropdown-toggle.btn-primary:hover {
    background-color: var(--color-white);
    text-transform: uppercase;
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    width: 100%;
    border: 1px solid var(--color-border);
    color: var(--color-text);
  }

  .dropDownPromoWrapper .open>.promotionPageBtn.btn-primary.dropdown-toggle:hover {
    background-color: var(--color-white);
  }

  .dropDownPromoWrapper button.promotionPageBtn.btn-primary.dropdown-toggle {
    background-color: var(--color-off-white);
    text-transform: uppercase;
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    width: 100%;
    font-weight: 400 !important;
  }

  div#store_promotions .promotionPageTypeTabContent {
    padding-top: 0;
  }

  button.promotionPageBtn.btn-primary.dropdown-toggle {
    background-color: var(--color-off-white);
  }

  #guide_bg ul.dropdown-menu.promotionPageCatSelect {
    background-color: var(--color-white) !important;
  }

  #guide_bg ul.dropdown-menu.promotionPageCatSelect {
    margin-left: 0px;
    margin-top: -1px;
    padding: 0;
    width: 100%;
    background-color: var(--color-off-white);
    text-transform: uppercase;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.15);
  }

  ul.dropdown-menu.kidsClubOfferCatSelect,
  ul.dropdown-menu.kidsClubBirthdayOfferCatSelect {
    margin-left: 0px;
    margin-top: 0;
    padding: 5px 0 5px 0;
    width: 100%;
    background-color: var(--color-white) !important;
    text-transform: uppercase;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.15);
  }

  li.selectedPromotionPageSubCat.selectedPromotionDropdownBtn a,
  li.selectedPromotionPageSubCat:hover {
    background-color: unset !important;
    color: var(--color-accent) !important;
    font-weight: 400;
  }

  li.selectedPromotionPageSubCat {
    /* padding: 14px 16px; */
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
  }

  button.monthBtn.btn-default.dropdown-toggle:after,
  button.promotionPageBtn.btn-primary.dropdown-toggle:after,
  button.kidsClubOfferBtn.btn-primary.dropdown-toggle:after,
  button.touristPrivilegesBtn.btn-primary.dropdown-toggle.mobileShow:after,
  button.btn.btn-default.dropdown-toggle:after,
  button.kidsClubBirthdayOfferBtn.btn-primary.dropdown-toggle:after {
    content: "\f0d7";
    font-family: "FontAwesome";
    font-size: 20px;
    color: var(--color-text);
    right: 12px;
    margin: 0;
    top: 10px;
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
    border: none;
  }

  .memberInfoWrapper button.selectDateBtn:after {
    content: none;
    font-family: "FontAwesome";
    font-size: 10px;
    color: var(--color-text);
    right: 12px;
    margin: 0;
    top: 10px;
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
  }

  .dropdownPromoPage.dropdown,
  .promotionsPage .dropdownPromoPage.dropdown {
    padding-left: 0;
    padding-bottom: 0;
    display: block;
  }

  /*Kids Club Offers*/
  .kidsClubOfferDropDownBtnWrapper.mobileShow,
  .kidsClubBirthdayOfferDropDownBtnWrapper.mobileShow {
    padding: 40px 0;
  }

  div#kids_club_offers .dropdown,
  .dropup,
  div#kids_club_birthday_offers .dropdown,
  .dropup {
    position: relative;
    display: block;
  }

  p.kidsClubOfferDesc {
    padding: 0 0 40px 0;
  }

  div#kids_club_offers .promotionPageTermsCondition p {
    padding-bottom: 40px;
  }

  li.selectedkidsClubOffer,
  li.selectedkidsClubBirthdayOffer {
    color: var(--color-text);
    padding: 10px 16px 5px 16px;
    font-size: 14px;
    line-height: 17px;
  }

  li.selectedkidsClubOffer:nth-child(3),
  li.selectedkidsClubBirthdayOffer:nth-child(3) {
    padding-bottom: 10px;
  }

  .promotionsPage div#kids_club_offers .promotionPageTypeTabContent,
  .promotionsPage div#kids_club_birthday_offers .promotionPageTypeTabContent {
    width: 100%;
    padding-bottom: 64px;
    margin: 0;
  }

  .happeningPostContent,
  .pressRoomPostContent,
  .promotionPageTypeTabContent .promotionDesc,
  .promotionsPage div#kids_club_offers .promotionDesc {
    height: 84px;
    -webkit-line-clamp: 3;
  }

  .promotionsPage div#kids_club_offers .promotionPost,
  .promotionsPage .touristPrivilegesCatWrapper .promotionPost {
    width: 50%;
  }

  .promotionsPage div#store_promotions .promotionPost {
    width: 50%;
  }

  a.touristPrivilegesType.selectedTouristPrivilegesParentBtn {
    font-size: 14px;
    line-height: 17px;
  }

  .touristPrivilegesDescWrapper {
    padding: 40px 8px 0 8px;
  }

  .mainTouristPrivilegesContainer .blackLine {
    margin: 28px 8px 40px 8px;
  }

  .touristPrivilegesCatMenu {
    width: 100%;
    display: block;
    min-height: 0;
  }

  .dropdown.touristPrivilegesDropdown {
    position: relative;
    display: inline-block;
  }

  ul.dropdown-menu.touristPrivilegesDropdownMenu {
    display: unset;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
    width: 327px !important;
    padding: 16px;
  }

  .touristPrivilegesCatWrapper .touristPrivilegesCatMenuTabContent {
    padding-top: 40px;
    width: 100%;
    margin-left: 0;
  }

  .touristPrivilegesCatWrapper {
    padding: 0 8px 64px 8px;
  }

  #promotions_calendar .monthDropdown .months {
    font-size: 14px;
    width: 100%;
    line-height: 17px;
    z-index: 100000;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.15);
  }

  #promotions_calendar .monthDropdown .months option {
    line-height: 17px;
    text-transform: uppercase;
    padding: 10px 16px 5px 16px;
    font-weight: 400;
  }

  #promotions_calendar .monthDropdown .months option:last-child {
    padding-bottom: 10px;
  }

  .promotionsPage div#store_promotions {
    padding-top: 0px;
  }

  li.selectedkidsClubOffer.selectedtabKidsClubBtn,
  li.selectedkidsClubBirthdayOffer.selectedtabKidsClubBirthdayBtn {
    color: var(--color-accent);
  }

  /*Endd Promotion Page*/

  .loginModalContainer,
  .newsletterModalContainer {
    padding: 16px;
  }

  .downloadBtnWrapperLoginModal a.AndroidBtn img {
    margin-left: 0;
  }

  .loginModal,
  .newsletterModal {
    width: 100%;
    max-width: 400px;
  }

  .loginModalContent {
    padding: 24px 32px 32px;
  }

  .downloadBtnWrapperLoginModal a.IosBtn img {
    margin-bottom: 16px;
  }

  /*Vivo Rewards 768*/

  .rewardsPageContainer {
    padding: 0;
  }

  .aboutVivoRewardsDesc,
  .aboutVivoRewardsGetStartedContainer,
  .perksContainer {
    padding: 0 16px;
  }

  .perksContainer {
    padding-bottom: 64px;
  }

  div #about_vivorewards,
  div #rewards-dbs-exclusive,
  div #rewards-points-calculator {
    padding-top: 32px;
  }

  div#about_vivorewards p,
  #rewards-dbs-exclusive p,
  #rewards-points-calculator p,
  #rewards-points-calculator-phase-2 p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
    padding-bottom: 16px;
  }

  h4.aboutVivoRewardsGetStartedHeader {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.75px;
    padding-bottom: 24px;
  }

  .aboutVivoRewardsGetStartedTable {
    display: block;
    table-layout: unset;
  }

  .aboutVivoRewardsGetStartedTableRow {
    display: block;
    margin-bottom: 16px;
  }

  .aboutVivoRewardsGetStartedTableRow:last-child {
    margin-bottom: 0;
  }

  .aboutVivoRewardsGetStartedTableCell {
    display: block;
    width: 100%;
    margin-bottom: 16px;
  }

  .aboutVivoRewardsGetStartedTableCell:last-child {
    margin-bottom: 0;
  }

  .aboutVivoRewardsGetStartedTableCell .cellImage,
  .aboutVivoRewardsGetStartedTableCell .cellLongImage {
    padding: 60px 24px;
  }

  .aboutVivoRewardsGetStartedTableCell .cellImage.longText {
    padding: 125px 24px;
  }

  .aboutVivoRewardsGetStartedTableCell .cellImage.smallIcon {
    padding: 142px 24px;
  }

  .aboutVivoRewardsGetStartedTableCell .cellImage img,
  .aboutVivoRewardsGetStartedTableCell .cellLongImage img,
  .aboutVivoRewardsGetStartedTableCell .cellImage.smallIcon img {
    max-width: 72px;
  }

  .privillegeTable {
    border-spacing: 16px;
  }

  .privillegeRowDesktop {
    display: none;
  }

  .privillegeRowMobile {
    display: table-row;
    margin: auto;
  }

  p.earnSpendRewards {
    padding-left: 24px;
    padding-right: 24px;
    text-align: left;
  }

  .privillegeCell {
    width: 50%;
  }

  .rewardsGuideBodyContainer {
    border: none;
    border-radius: 0;
  }

  .rewardsGuideHeaderContainer {
    background-position: center !important;
  }

  .earnVrPointsContainer {
    margin: 24px 16px;
    padding: 32px 12px;
  }

  .earnVrPointViewAllButton {
    padding-bottom: 32px;
    margin-bottom: 0;
  }

  .earnVrPointsCaptionContainer {
    margin: 0 16px 32px 16px;
  }

  .earnVrPointShowMoreContainer {
    margin: 64px 0 32px 0;
  }

  .pointsEntitlementTableWrapper,
  .dbsMoreRewardContainer,
  .privilegeSummaryContainer {
    margin: 0 16px;
  }

  .pointsEntitlementTable,
  .pointsEntitlementGuideTable {
    width: 600px;
    margin-bottom: 16px;
  }

  .rewardsCalculatorTableContainer .pointsEntitlementGuideTable {
    margin-bottom: 16px;
  }

  .privilegeSummaryContainer {
    margin-top: 64px;
  }

  .dbsMoreRewardContainer {
    display: block;
    padding: 0;
    margin-bottom: 64px;
    margin-top: 32px;
  }

  .dbsExclusiveContainer {
    display: block;
    padding: 0;
  }

  .dbsMoreRewardImage {
    margin: 0 auto;
    margin-bottom: 32px;
    flex-shrink: unset;
  }

  .dbsMoreRewardText,
  .dbsGetVrPointsText {
    padding-left: 0;
  }

  .dbsGetVrPointsContainer {
    border-radius: 0;
    display: block;
    padding: 16px;
  }

  .dbsGetVrPointsImage {
    text-align: center;
  }

  .dbsGetVrPointsImage img {
    max-width: 168px;
    width: 100%;
  }

  .dbsGetVrPointsText {
    padding-top: 32px;
    padding-bottom: 16px;
  }

  .perksHeaderContainerDesktop {
    display: none;
  }

  .perksHeaderContainerMobile {
    display: block;
  }

  .perksMinimizeContainer {
    padding-top: 16px;
    padding-bottom: 48px;
  }

  .perksMinimizeButton {
    right: 16px;
  }

  .privilegeSummaryContainer h5 {
    font-family: var(--font-display) !important;
    font-size: 14px;
    line-height: 24px;
  }

  .privilegeSummaryTableOverflow {
    overflow-x: auto;
    position: relative;
  }

  .privilegeSummaryTableOverflow.mobileShow {
    margin-bottom: 64px;
  }

  .privilegeSummaryTableOverflowArrowIndicator {
    display: block;
    width: fit-content;
    height: fit-content;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
  }

  .privilegeSummaryTableOverflowArrowIndicator img {
    object-fit: contain;
    width: 40px;
    height: 40px;
  }

  .privilegeSummaryTable {
    width: 768px;
    margin-bottom: 16px;
  }

  .rewardsGuideInnerHeader {
    padding-left: 0;
  }

  .rewardsGuideInnerHeader h3 {
    font-size: 32px;
    line-height: 32px;
    letter-spacing: -1px;
    padding-left: 16px;
    padding-bottom: 16px;
  }

  .rewardsGuideInnerContainer {
    padding: 0;
  }

  .rewardsGuideInnerIntroContainer {
    padding: 24px 16px 32px 16px;
  }

  .rewardsGuideInnerIntroContainer p:last-child {
    padding-bottom: 0 !important;
  }

  .dbsLinkVideoGuideContainer {
    padding: 24px 16px;
    margin-top: 56px;
    margin-bottom: 32px;
    margin-left: 16px;
    margin-right: 16px;
  }

  .rewardsVideoGuideContainer {
    padding: 0px 16px 32px 16px;
  }

  .rewardsRedemptionMobileTable .swiper-slide,
  .dbsLinkingStepMobileTable .swiper-slide {
    width: 100%;
    max-width: 300px;
    height: auto;
  }

  .rewardsGuideInnerContainer {
    overflow: visible;
  }

  .rewardsRedemptionMobileTable .swiper-pagination,
  .dbsLinkingStepMobileTable .swiper-pagination {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: -45px !important;
    -webkit-transition: 0.3s opacity;
    -o-transition: 0.3s opacity;
    transition: 0.3s opacity;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10;
  }

  .rewardsRedemptionSwiperPagination .swiper-pagination-bullet,
  .rewardsUsageSwiperPagination .swiper-pagination-bullet,
  .rewardsRedemptionSwiperPaginationPhase2 .swiper-pagination-bullet,
  .rewardsUsageSwiperPaginationPhase2 .swiper-pagination-bullet,
  .dbsLinkingStepMobileTable .swiper-pagination-bullet {
    width: 40px !important;
    height: 3px !important;
    border-radius: 3px;
  }

  .rewardsUsageSwiperPagination .swiper-pagination-bullet {
    width: 35px !important;
    height: 3px !important;
    border-radius: 3px;
  }

  .rewardsRedemptionSwiperPagination .swiper-pagination-bullet-active,
  .rewardsUsageSwiperPagination .swiper-pagination-bullet-active,
  .rewardsRedemptionSwiperPaginationPhase2 .swiper-pagination-bullet-active,
  .rewardsUsageSwiperPaginationPhase2 .swiper-pagination-bullet-active,
  .dbsLinkingStepMobileTable .swiper-pagination-bullet-active {
    background: var(--color-accent) !important;
  }

  .rewardsRedemptionMobileTable,
  .dbsLinkingStepMobileTable {
    overflow: visible !important;
  }

  .rewardsGuideBodyContainer .blackline {
    margin: 91px 16px 32px 16px;
    border-top: 1px solid var(--color-border);
  }

  .rewardsTnCLink {
    padding-bottom: 32px !important;
  }

  #rewards-dbs-exclusive h4,
  #rewards-points-calculator h4,
  #rewards-points-calculator-phase-2 h4 {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.75px;
  }

  #rewards-dbs-exclusive h5,
  #rewards-points-calculator h5,
  #rewards-points-calculator-phase-2 h5 {
    font-size: 18px;
    line-height: 20px;
    letter-spacing: normal;
    padding-bottom: 16px;
  }

  .enjoyInstantRewardsContainer {
    padding-left: 16px;
    padding-right: 16px;
  }

  #rewards-dbs-exclusive p {
    padding-bottom: 32px;
  }

  .dbsRewardsCaptions {
    padding-top: 32px;
  }

  .dbsRewardsCaptions p,
  .dbsRewardsVideoCaptions p {
    font-size: 12px !important;
    line-height: 20px !important;
  }

  #rewards-dbs-exclusive .blackLine {
    margin: 64px 16px 40px 16px;
  }

  .dbsLinkingRewardsTextContainer {
    padding: 0 16px;
  }

  .dbsLinkVideoGuideTitle h5 {
    font-size: 14px !important;
    line-height: 20px !important;
  }

  .pointsEntitlementGuideTable {
    margin-bottom: 16px;
  }

  .pointsEarnedTableBody {
    display: table;
    width: 100%;
  }

  .dbsTnCLink {
    padding-top: 32px;
  }

  .faqPageTermsCondition {
    padding-bottom: 80px;
  }

  div #faq,
  div #rewards-points-calculator,
  div #rewards-points-calculator-phase-2 {
    padding-top: 32px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .rewardsCalculatorIntroContainer h4 {
    padding-bottom: 8px !important;
  }

  .rewardsCalculatorIntroContainer p {
    padding-bottom: 0 !important;
  }

  #rewards-points-calculator .blackLine,
  #rewards-points-calculator-phase-2 .blackLine {
    margin: 32px 0;
  }

  .rewardsCalculatorInputHeader,
  .rewardsCalculatorInputLabel,
  .rewardsCalculatorInputField,
  .rewardsCalculatorCheckboxField {
    border-left: none;
    padding-left: 0;
    padding-right: 0;
  }

  .rewardsCalculatorInputColumn:first-child {
    padding-right: 8px;
  }

  .rewardsCalculatorInputColumn:nth-child(2) {
    padding-left: 8px;
  }

  .rewardsCalculatorInputFlexContainer {
    flex-wrap: wrap;
  }

  .rewardsCalculatorAmountColumn {
    width: 50%;
  }

  .rewardsCalculatorCheckboxColumn {
    width: 100%;
    margin-top: 32px;
  }

  .rewardsCalculatorInputHeader {
    font-weight: 700 !important;
    padding-bottom: 12px !important;
  }

  .rewardsCalculatorInputLabel {
    padding-bottom: 8px !important;
    font-size: 12px !important;
    line-height: 20px !important;
  }

  .rewardsCalculatorCheckbox label {
    font-weight: 500 !important;
  }

  .rewardsCalculatorInputInnerField p {
    padding-bottom: 0 !important;
  }

  .rewardsCalculatorInputInnerField input {
    font-size: 14px;
    line-height: 24px;
    width: 100%;
  }

  .rewardsCalculatorCheckboxField {
    padding-bottom: 0;
  }

  .rewardsCalculatorCheckbox label {
    font-size: 14px;
    line-height: 24px;
  }

  .rewardsCalculatorNotesContainer {
    padding-top: 32px;
    padding-bottom: 80px;
  }

  .dbsRewardsVideoCaptions,
  .privilegeSummaryNote {
    padding-top: 32px;
  }

  .rewardsCalculatorNotesContainer li {
    font-size: 12px;
    line-height: 20px;
  }

  .vrFaqSearchContainer {
    padding: 12px 16px;
  }

  .accordionItemHeading {
    font-size: 18px;
    line-height: 20px;
  }

  .faqsContent .blackLine {
    margin: 16px 0 40px 0;
  }

  .accordionItemContent .question {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .accordionItemContent .answer,
  .accordionItemContent .step,
  .accordionItemContent ul,
  .accordionItemContent ol,
  .accordionItemContent p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
    font-weight: 500;
    padding-bottom: 8px;
  }

  .questionNumber p {
    padding-bottom: 0 !important;
  }

  .expiryDateRewards th,
  .expiryDateRewards td {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .expiryDateRewards th {
    font-weight: 700;
  }

  .expiryDateRewards td {
    font-weight: 500;
  }

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer h4,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer h4 {
    font-size: 18px;
    line-height: 22px;
  }

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer p,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer p {
    font-size: 18px;
    line-height: 25px;
  }

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ol,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer ol {
    font-size: 18px;
    line-height: 25px;
  }

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer .caption,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer .caption {
    font-size: 14px;
    line-height: 28px;
  }

  /* #earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p, #using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p {
  font-size: 18px;
  line-height: 22px;
  } */

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer {
    padding: 24px 70px 24px 0;
  }

  #earning_rewards .guideContainer p,
  #using_rewards .guideContainer p {
    font-size: 18px;
    line-height: 22px;
  }

  .pressRoomAllPostsWrapper {
    display: none;
  }

  .pressRoomAllPostsWrapper.active {
    display: block;
  }

  .rewardsCatMenuTabContent,
  .pressRoomTabContent {
    width: 100%;
    margin: 0;
  }

  .aboutVivoRewardsImg {
    margin-bottom: 24px;
  }

  div#sign_up_vivo_rewards h3 {
    line-height: 27px;
  }

  div#sign_up_vivo_rewards p {
    padding-bottom: 0;
  }

  div#using_rewards h1 {
    line-height: 64px;
  }

  div#using_rewards h3 {
    line-height: 27px;
  }

  p.earningBtn.tabBtn:nth-child(1) {
    margin-right: 40px;
  }

  p.earningBtn.tabBtn {
    display: inline-block;
    border-bottom: unset;
    vertical-align: bottom;
    margin: 0;
    padding: 0;
  }

  .earningRewardsImg {
    width: 100%;
    padding-top: 100%;
    background-size: contain;
    background-position: center;
    display: block;
    background-repeat: no-repeat;
  }

  .earningRewardsImg {
    padding-top: 60%;
  }

  .instructionsColumn .earningRewardsImg {
    width: 100%;
    padding-top: 60%;
  }

  .earningStepsImgWrapper {
    width: 60%;
    display: block;
    margin: auto;
  }

  .earningRewardsContainer {
    width: 100%;
    vertical-align: unset;
    padding-left: 0;
    padding-top: 24px;
  }

  .vivoRewardsRow {
    margin-bottom: 0;
    padding-bottom: 40px;
  }

  .vivoRewardsKioskWrapper .earningRewardsImg {
    margin: auto;
    width: 100%;
    padding-top: 100%;
  }

  .vivoRewardsKiosk.earningRewardsContainer {
    padding-top: 40px;
    padding-left: 0;
  }

  .vivoRewardsKiosk.earningRewardsContainer>p:last-of-type {
    padding-bottom: 0;
  }

  div#vivo_rewards .rewardsPageTermsCondition {
    padding-bottom: 64px;
  }

  .instructionsColumn {
    padding-bottom: 40px;
  }

  .instantRewardsWrapper .earningRewardsImgWrapper {
    width: 100%;
    background-size: cover;
    background-position: center;
    display: block;
    margin: 0;
  }

  .instantRewardsDescWrapper {
    padding-top: 24px;
    width: 100%;
    display: block;
    padding-left: 0;
  }

  .earningDesc.earningRewardContainer .rewardsPageTermsCondition {
    padding-bottom: 40px;
  }

  #guide_bg .dropdown-menu ul {
    margin-top: -1px;
  }

  p.exchangeAmount,
  p.exchangeIssued {
    font-size: 14px;
    line-height: 17px;
  }

  p.exchangeTitle {
    font-size: 16px;
    line-height: 19px;
    font-weight: 500;
  }

  p.exchangeTitle.exchangeColumn {
    width: 47%;
  }

  div#rewards_exchange .vivoRewardsExchangeWrapper {
    padding: 0;
  }

  p.downloadDesc {
    margin-bottom: 32px;
  }

  .faqsContent {
    padding: 40px 8px 0 8px;
  }

  .purchaseAmountWrapper.exchangeContainer {
    padding-top: 40px;
  }

  .stepsImgWrapper .aboutVivoRewardsImg {
    max-height: calc(100% - 32px);
    max-width: calc(100% - 32px);
  }

  .stepsRegisterContainer {
    margin: 0;
    padding-bottom: 24px;
  }

  .stepsRegisterWrapper {
    margin: 0;
    display: block;
    background-color: var(--color-white);
    margin-bottom: 16px;
    width: 100vw;
    position: relative;
    margin-left: -50vw;
    left: 50%;
  }

  .stepsImgWrapper {
    width: 50%;
    vertical-align: middle;
    border-bottom: 0;
    display: inline-block;
    background-repeat: no-repeat;
    padding-top: 40%;
  }

  .stepsRegisterDescContainer {
    position: relative;
    width: 50%;
    padding-top: 40%;
    display: inline-block;
    vertical-align: middle;
  }

  .stepsDescWrapper {
    top: 40%;
    left: 40%;
    transform: translate(-40%, -40%);
    display: inline-block;
    width: 100%;
    padding: 24px 24px 24px 0;
  }

  .rewardsCatalogueContent {
    margin-left: 0;
  }

  .rewardsCatalogueDesc {
    padding-top: 40px;
  }

  .rewardsCatalogueSidemenu {
    display: none;
  }

  .rewardsCatalogueSearchContainer .filterGroup {
    background-color: white;
    /* box-shadow: 0 18px 20px -20px rgba(0,0,0,0.4); */
    display: block;
    position: relative;
    padding-bottom: 0;
  }

  .rewardsCatalogueSearchContainer .searchBar {
    width: 100%;
    padding: 16px;
    height: 64px;
  }

  .rewardsCatalogueSearchContainer .dropdownRewardsCatalogueType,
  .rewardsCatalogueSearchContainer .rewardsCatalogueSidemenuMobile {
    display: block;
    border-bottom: solid 1px var(--color-border);
    padding: 0 16px;
    background-color: var(--color-white);
    width: 100%;
  }

  .rewardsCatalogueSearchContainer .dropdownRewardsCatalogueType button,
  .rewardsCatalogueSearchContainer .rewardsCatalogueSidemenuMobile button {
    width: 100%;
    border: 0;
    background-color: var(--color-white) !important;
    font-size: 16px;
    line-height: 28px;
    padding: 16px 0;
    font-weight: 300;
    text-align: left;
  }

  .rewardCatalogueDialog {
    height: calc(100vh - 56px);
    padding: 0;
    max-width: unset;
  }

  .rewardCatalogueDialog>div {
    padding: 0 16px;
  }

  .closeRewardCatalogueDialogWrapper {
    background-color: var(--color-white);
    padding: 16px;
    text-align: right;
    height: 56px;
    max-width: unset;
    margin-bottom: 0;
  }

  .closeRewardCatalogueDialog {
    font-size: 24px;
    color: var(--color-muted);
    vertical-align: top;
  }

  p.voucherDetailsBtn {
    display: inline-block;
    border-bottom: none;
    padding-left: 0;
    padding-right: 24px;
  }

  .voucherDetailsTabWrapper {
    padding-bottom: 16px;
  }

  .dropdownRewardsCatalogueType,
  .dropdownRewardsCatalogueSortBy {
    width: calc(50% - 6px);
  }

  .dropdownRewardsCatalogueType {
    margin-right: 12px;
  }

  .rewardsCatalogueFilterContainer .rewardsCatalogueCatSwiperContainer {
    margin-bottom: 24px;
  }

  .rewardsCatalogueCatContainer {
    padding-top: 24px;
    /* padding-bottom: 40px; */
  }

  .rewardsCatalogueCatContainer .rewardsCatalogueCatBtn {
    display: inline-block;
    border-bottom: none;
    padding: 0 40px 0 0;
  }

  .rewardsCatalogueCatContainer .rewardsCatalogueCatBtn span {
    padding: 0;
  }

  /*End Vivo Rewards 768*/

  /*Directory Page*/
  /* .searchBar {
  display: block;
  border-bottom: solid 1px var(--color-border);
  padding: 16px 16px 48px 16px;
  } */

  .storeCat.container.contentContainer .filterWrapper {
    display: block;
    position: relative;
  }

  .storeCat.container.contentContainer .filterWrapper .mobileShow {
    border-bottom: solid 1px var(--color-border);
    padding: 0 16px 18px;
    cursor: pointer;
  }

  .storeCat.container.contentContainer .filterWrapper .mobileShow>* {
    display: inline-block;
    vertical-align: middle;
  }

  .storeCat.container.contentContainer .filterWrapper .mobileShow img {
    height: 24px;
    padding-right: 8px;
  }

  .storeCat.container.contentContainer .filterWrapper .mobileShow p {
    font-family: "Rubik", sans-serif;
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
  }

  .storeCat.container.contentContainer .filterWrapper .mobileShow .selectedFilterNumber {
    position: absolute;
    top: 7px;
    height: 24px;
    width: 24px;
    background-color: var(--color-accent);
    border-radius: 50%;
    right: 16px;
    display: none;
  }

  .storeCat.container.contentContainer .filterWrapper .mobileShow .selectedFilterNumber p {
    color: var(--color-white);
    text-align: center;
    line-height: 14px;
    font-size: 14px;
    padding-top: 6px;
    font-weight: 400;
  }

  .searchBar .fa-search {
    font-size: 24px;
    top: 0;
    -webkit-text-stroke: 1px var(--color-white);
  }

  div#algolia_store_searchbox .ais-SearchBox-submit {
    left: 0;
    top: 16px;
  }

  .searchBar input {
    width: 100%;
    padding-left: 35px;
    font-size: 20px;
    line-height: 32px;
    font-weight: 300;
    background-color: unset;
    color: var(--color-text);
  }

  /* .storeCat.container.contentContainer .dropdownStoreCat.dropdown,
  .dropup {
  display: block;
  border-bottom: solid 1px var(--color-border);
  padding: 0 16px;
  position: relative;
  background-color: var(--color-white);
  width: 100%;
  min-width: unset;
  }

  .storeCat.container.contentContainer .searchBar {
  width: 100%;
  padding: 16px 0 8px 16px;
  height: unset;
  } */

  .dropdownAlphabetFilter.dropdown {
    display: block;
    border-bottom: none;
    padding: 16px 16px 0 16px;
  }

  .open>.alphabetFilterBtn.btn-primary.dropdown-toggle:hover {
    background-color: var(--color-white);
    border: none;
    padding: 0;
    font-weight: 300;
  }

  .open>.promotionBtn.btn-primary.dropdown-toggle:focus,
  .open>.promotionBtn.btn-primary.dropdown-toggle:hover,
  .open>.kidsClubOfferBtn.btn-primary.dropdown-toggle:focus,
  .open>.kidsClubOfferBtn.btn-primary.dropdown-toggle:hover,
  .open>.touristPrivilegesCatDropDownBtn.btn-primary.dropdown-toggle:focus,
  .open>.touristPrivilegesCatDropDownBtn.btn-primary.dropdown-toggle:hover,
  .open>.pressReleaseYearBtn.btn-primary.dropdown-toggle:focus,
  .open>.pressReleaseYearBtn.btn-primary.dropdown-toggle:hover,
  .open>.kidsClubBirthdayOfferBtn.btn-primary.dropdown-toggle:hover,
  .open>.kidsClubBirthdayOfferBtn.btn-primary.dropdown-toggle:focus9061 {
    background-color: var(--color-white);
    color: var(--color-text);
    border: 1px solid var(--color-border) !important;
  }

  .open>.alphabetFilterBtn.btn-primary.dropdown-toggle:focus,
  .open>.alphabetFilterBtn.btn-primary.dropdown-toggle:hover {
    background-color: var(--color-white);
    color: var(--color-text);
  }

  ul.dropdown-menu.alphabetFilterSelect {
    margin-top: 0 !important;
    width: 100% !important;
    margin-left: 0px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: var(--color-white) !important;
    max-height: 340px;
    padding: 0 0 16px 0 !important;
    overflow: auto;
  }

  ul.dropdown-menu.alphabetFilterSelect::-webkit-scrollbar-track {
    background-color: #d8d8d8;
  }

  ul.dropdown-menu.alphabetFilterSelect::-webkit-scrollbar {
    width: 8px;
    background-color: #f5f5f5;
  }

  ul.dropdown-menu.alphabetFilterSelect::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #959595;
  }

  p.letterBtn,
  a.letterBtn.selectedAlphabetDropDown {
    font-size: 16px;
    line-height: 28px;
    padding: 8px 16px 8px 16px !important;
  }

  .letterBtn.selectedAlphabet,
  a.letterBtn.selectedAlphabet.selectedAlphabetDropDown {
    color: var(--color-accent) !important;
    background-color: unset;
  }

  .storeMenuContainer .iconMobileShow.mobileShow {
    color: var(--color-text);
    text-align: right;
    margin-right: 16px;
    float: right;
  }

  .letterBtn:first-child {
    width: 100%;
    text-align: left;
  }

  .storeCat.container.contentContainer .searchBar input {
    font-size: 20px;
    background-color: var(--color-white);
  }

  .dropdown button.directorybtn.btn-default.dropdown-toggle {
    width: 100%;
    border: 0;
    background-color: var(--color-white);
    font-size: 16px;
    line-height: 28px;
    padding: 16px 0;
    font-weight: 300;
  }

  .dropdown button.directorybtn.btn-default.dropdown-toggle::after {
    right: 34px;
    margin: 0;
    top: calc(50% - 14px);
  }

  .alphabetFilter {
    padding: 0;
  }

  /* .storeMenuContainer {
  background-color: var(--color-white);
  margin: -45px 8px 48px 8px;
  box-shadow: 0 18px 20px -20px rgba(0, 0, 0, 0.4);
  display: block;
  position: relative;
  } */

  .alphabetFilter {
    padding: 0;
    display: block;
    border-bottom: solid 1px var(--color-border);
    background-color: var(--color-white);
    position: relative;
  }

  button.alphabetFilterBtn.btn-primary.dropdown-toggle {
    text-transform: capitalize;
    width: 100%;
    text-align: left;
    padding: 0;
    font-size: 16px;
    line-height: 28px;
    background-color: var(--color-white);
    border-radius: 4px;
    border: none;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    color: var(--color-text);
    cursor: pointer;
    font-weight: 300;
  }

  .storeMenuContainer i.fas.fa-angle-down {
    -webkit-text-stroke: 1px var(--color-white);
  }

  .iconMobileShow.mobileShow {
    display: inline-block !important;
    width: 0;
    margin-right: 16px;
  }

  ul.dropdown-menu.submenulist {
    background-color: var(--color-off-white) !important;
    width: 100% !important;
  }

  button.alphabetFilterBtn.btn-primary.dropdown-toggle:after {
    content: "\f0d7";
    font-family: "FontAwesome";
    font-size: 20px;
    color: var(--color-text);
    right: 32px;
    margin: 0;
    top: 18px;
    position: absolute;
    pointer-events: none;
    -webkit-text-stroke: 0.5px var(--color-white);
  }

  .storeMenuContainer .dropdown-menu {
    width: 100%;
    border: 0;
    border-radius: 0;
    background-color: var(--color-white);
    margin-top: 0;
    box-shadow: none;
    font-size: 16px;
    line-height: 28px;
    padding: 0 0 16px 0;
  }

  .dropdownAlphabetFilter.dropdown .blackLine {
    margin-bottom: 0;
    opacity: 0;
  }

  .dropdownAlphabetFilter.dropdown.open .blackLine {
    opacity: 100;
  }

  .dropdownStoreCat.dropdown .blackLine.mobileShow {
    margin: 0;
    opacity: 0;
  }

  .dropdownStoreCat.dropdown.open .blackLine.mobileShow {
    margin: 0;
    opacity: 100;
  }

  ul.dropdown-menu.storeDropdownMenu {
    overflow: auto;
    max-height: 290px;
  }

  .storeMenuContainer .dropdown-menu li a {
    padding: 8px 16px 8px 16px !important;
    font-weight: 300;
  }

  .storeMenuContainer .dropdown-menu li a:hover,
  ul.dropdown-menu.storeDropdownMenu>li a:hover {
    color: var(--color-accent) !important;
    background-color: unset;
  }

  ul.dropdown-menu.storeDropdownMenu::-webkit-scrollbar-track {
    background-color: #d8d8d8;
  }

  ul.dropdown-menu.storeDropdownMenu::-webkit-scrollbar {
    width: 8px;
    background-color: #f5f5f5;
  }

  ul.dropdown-menu.storeDropdownMenu::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #959595;
  }

  a.selectable.selectedStoreCat {
    color: var(--color-accent) !important;
  }

  /* .directorybtn .notAllCatogeries .cancelCategory, .rewardsCatalogueBtn .notAllCatogeries  .cancelCategory { */
  .notAllCatogeries .cancelCategory,
  .notAllCatogeries .cancelRewardsCatalogueType,
  .notAllCatogeries .cancelRewardsCatalogueCat {
    padding: 0 8px 0 11px;
    font-size: 9px;
    right: 0;
    top: calc(50% - 4.5px);
    line-height: 100%;
    height: auto;
  }

  .letterBtn.selectedAlphabet:after {
    content: "";
    width: 100%;
    height: 3px;
    display: block;
    background-color: var(--color-accent);
    position: absolute;
    bottom: -6px;
    display: none !important;
  }

  /*End Directory Page*/

  /*Privacy Policy Page*/
  .privacyHeaderContainer {
    margin-bottom: 0;
  }

  .privacyPolicyPageContent,
  .termsOfUsePageContent {
    padding: 32px 0px 58px 0px;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.25px;
  }

  .termsOfUseLastSubSection {
    padding-bottom: 40px;
  }

  .termsOfUseNumbering h2,
  .termsOfUseText h2 {
    padding-bottom: 16px;
  }

  .termsOfUseNumbering p {
    font-weight: 700;
  }

  .termsOfUseText p,
  .termsOfUseText li,
  .privacyPolicyPageContent p {
    font-weight: 500;
  }

  .termsOfUseNumbering p {
    padding-bottom: 8px;
  }

  .termsOfUseText p {
    padding-bottom: 24px;
  }

  .termsOfUseRow .mobileBlock {
    display: block;
    width: 100% !important;
  }

  /*End Privacy Policy Page*/

  /*FAQ*/
  /* .accordionItemHeading {
  max-width: 271px;
  } */

  .accordionItem:nth-child(2):after,
  .accordionItem.openAccordion:nth-child(2):after {
    top: 18px;
  }

  .accordionItem:nth-child(1):after,
  .accordionItem.openAccordion:nth-child(1):after {
    top: -10px;
  }

  /*End FAQ*/

  /*Member Edit Profile*/
  .memberInfoWrapper h3 {
    font-size: 22px;
    font-weight: 400;
    line-height: 27px;
  }

  .container.editProfileContainer .titleGreyLine {
    margin: 16px -16px 24px -16px;
  }

  .memberInfoWrapper label {
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
    padding-bottom: 8px;
    text-transform: uppercase;
  }

  .memberInfoWrapper .formSingleField {
    padding-bottom: 24px;
  }

  .memberInfoWrapper input[disabled] {
    background-color: transparent;
    pointer-events: none;
    color: #9e9e9e;
  }

  .memberInfoWrapper input {
    font-size: 16px;
    font-weight: 300;
    line-height: 28px;
    padding: 0 0 8px 0;
    border-radius: 0;
    width: 100%;
    border: none;
    border-bottom: 1px solid var(--color-border);
  }

  .memberInfoWrapper .vivoDropdownBtn {
    width: 100%;
    text-align: left;
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
    border-radius: unset;
    padding: 0 0 8px 0 !important;
    border: none;
    border-bottom: 1px solid var(--color-border);
    background-color: var(--color-white) !important;
    white-space: unset;
    box-shadow: none;
  }

  .memberInfoWrapper .birthdateField .dropdown button {
    background-color: var(--color-white) !important;
    color: #9e9e9e;
  }

  .memberInfoWrapper .selectDateBtn:focus,
  .memberInfoWrapper .selectDateBtn:hover {
    color: var(--color-text);
    background-color: transparent;
    border-color: var(--color-border);
  }

  .memberInfoWrapper .birthdateField .dateSelection {
    padding-right: 24px;
  }

  .memberInfoWrapper .birthdateField .dateSelection,
  .memberInfoWrapper .birthdateField .monthSelection,
  .yearSelection {
    width: 33.33%;
  }

  .memberInfoWrapper .birthdateField .yearSelection {
    padding-left: 24px;
  }

  .memberInfoWrapper .selectionDropdown li:hover {
    color: var(--color-accent);
    background-color: var(--color-white);
  }

  form#editProfileForm ul.dropdown-menu.selectionDropdown {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  }

  form#editProfileForm .memberInfoWrapper .selectionDropdown li {
    padding: 5px 10px;
  }

  .memberInfoWrapper .birthdateField .yearSelection .selectionDropdown {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  .memberInfoWrapper .birthdateField .dateSelection .selectionDropdown {
    width: calc(100% - 24px);
  }

  form#editProfileForm span.selectedGender {
    font-weight: 300;
  }

  form#editProfileForm button.selectGenderBtn:after {
    display: none;
  }

  .basicInfo.memberInfoWrapper.memberInfoWrapper .twoColField.leftField,
  .memberInfoWrapper.memberInfoWrapper .twoColField.leftField {
    padding-right: 12.5px;
    width: 50%;
    display: inline-block;
  }

  .basicInfo.memberInfoWrapper.memberInfoWrapper .twoColField.rightField,
  .memberInfoWrapper.memberInfoWrapper .twoColField.rightField {
    padding-left: 12.5px;
    width: 50%;
  }

  .basicInfo.memberInfoWrapper.memberInfoWrapper .mobileField .countryCodeSelection {
    width: calc(33.33% - 24px);
    margin-right: 24px;
  }

  .basicInfo.memberInfoWrapper.memberInfoWrapper .mobileField input[name="member_mobile_no"] {
    width: calc(100% - 33.33%);
  }

  form#editProfileForm .mobileField i {
    line-height: 30px;
    margin-left: -45px;
  }

  .editProfileNotifications {
    background-color: var(--color-white);
    padding: 16px 16px 0 16px;
  }

  .editProfileNotifications {
    margin: 40px 0;
  }

  .notificationCheckbox:last-child {
    padding-bottom: 0;
  }

  .editProfileNotifications .formSingleField {
    padding-bottom: 40px;
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 25%;
    border: 2px solid var(--color-accent);
    border-radius: 6px;
    font-weight: 400;
    padding: 16px;
    display: inline-block;
    cursor: pointer;
    color: var(--color-accent);
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    background-color: transparent;
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"]:hover {
    border: 2px solid var(--color-accent);
    color: var(--color-white);
    background-color: var(--color-accent);
  }

  /*End Member Edit Profile*/

  /*My Account */
  .halfContainer.rewardContainer {
    padding: 0 24px;
  }

  .halfContainer.rewardContainer h2 {
    display: none;
  }

  .myAccountContainer .halfContainer:first-child {
    margin-right: 0;
    margin-bottom: 0;
  }

  .myAccountContainer .halfContainer {
    width: 100%;
  }

  .detailsContainer.kcDetailsContainer p.title {
    padding-bottom: 0;
  }

  div#vckidsclub .detailsContainer:nth-child(2) {
    /* margin-bottom: 24px; */
    border-bottom: none;
  }

  .detailsContainer.kcDetailsContainer {
    margin-bottom: -14px;
    padding: 16px 16px 0;
  }

  .detailsContainer.kcDetailsContainer .progressBarWrapper {
    height: 5px;
    box-sizing: content-box;
    padding-bottom: 24px;
  }

  .detailsContainer {
    padding: 16px;
    background-color: var(--color-white);
    /* margin-bottom: 24px; */
    position: relative;
  }

  .vivoRewardsVehicleContainer.mobileShow {
    padding: 16px 16px 0;
    background-color: var(--color-white);
    margin-bottom: 24px;
  }

  .userVehicleContainer {
    width: 100%;
  }

  .detailsContainer:nth-child(2) {
    margin-bottom: 0;
    border-bottom: 1px solid var(--color-border);
  }

  .vehicleWrapper p.vehicleTitle {
    width: 30%;
    display: inline-block;
  }

  .vehicleNumContainer {
    padding-bottom: 8px;
  }

  .vehicleWrapper p.value {
    text-align: right;
    width: 70%;
    padding-bottom: 0 !important;
  }

  .uiNumContainer {
    padding-bottom: 16px;
  }

  .myAccountContainer .halfContainer .title:last-child {
    font-size: 16px;
    line-height: 28px;
    color: var(--color-info);
  }

  .myAccountContainer .halfContainer .value {
    padding-bottom: 4px;
  }

  .vivoRewardsVehicleContainer.mobileShow .blackLine.mobileShow {
    margin: 0 0 20px !important;
  }

  .halfContainer.rewardContainer .blackLine.mobileShow {
    margin: 0 -16px 14px -16px;
  }

  .halfContainer.rewardHistoryContainer {
    background-color: var(--color-white);
    padding: 24px 16px 0;
    margin-top: 56px;
  }

  .halfContainer.rewardHistoryContainer .blackLine {
    margin: 0 -16px;
  }

  .myAccountContainer {
    margin-top: -16px;
    padding: 0 0 40px 0 !important;
  }

  .myAccountContainer .halfContainer .description {
    padding-bottom: 0px;
  }

  .myAccountContainer .halfContainer h2 {
    font-size: 22px;
    line-height: 27px;
    font-weight: 400;
    padding-bottom: 20px;
  }

  p.rewardHistoryTabBtn.tabBtn {
    display: inline-block;
    border-bottom: none;
    padding: 0 40px 0 0;
  }

  p.rewardHistoryTabBtn.tabBtn span {
    padding: 16px 0;
  }

  .myAccountContainer .tabBtnWrapper {
    padding: 0;
  }

  .myAccountContainer .membershipContainer {
    padding-top: 48px;
  }

  .myAccountContainer .rewardHistoryButton p,
  .myAccountContainer .parkingRewardHistoryButton p {
    padding: 12px 16px;
    margin-right: 9px;
    margin-bottom: 16px;
    vertical-align: top;
  }

  .myAccountContainer .rewardHistoryButton p:last-child,
  .myAccountContainer .parkingRewardHistoryButton p:last-child {
    margin-bottom: 0;
  }

  .myAccountContainer .rewardHistoryButton,
  .myAccountContainer .parkingRewardHistoryButton {
    padding-top: 16px;
    padding-bottom: 0;
  }

  .myAccountContainer .rewardHistoryDateFilter .dateSelection button i,
  .myAccountContainer .parkingRewardHistoryDateFilter .dateSelection button i {
    padding-top: 5px;
  }

  .myAccountContainer .rewardHistoryDateFilter .dateSelection button,
  .myAccountContainer .parkingRewardHistoryDateFilter .dateSelection button {
    line-height: 28px;
    padding: 16px 0;
    border-radius: 0;
  }

  .myAccountContainer .rewardHistoryDateFilter .dateSelection,
  .myAccountContainer .parkingRewardHistoryDateFilter .dateSelection {
    width: 100%;
  }

  .open>.btn.btn-default.dropdown-toggle.selectDateBtn.memberAcc:focus,
  .open>.btn.btn-default.dropdown-toggle.selectDateBtn.memberAcc:hover {
    color: var(--color-text);
    background-color: transparent;
    border-color: transparent;
  }

  button.btn.btn-default.dropdown-toggle.selectDateBtn.memberAcc {
    box-shadow: none;
    white-space: unset;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid var(--color-border);
  }

  .myAccountContainer .rewardHistoryDateFilter .dateSelection .selectionDropdown li:hover,
  .myAccountContainer .parkingRewardHistoryDateFilter .dateSelection .selectionDropdown li:hover {
    color: var(--color-accent);
    background-color: var(--color-white);
  }

  .myAccountContainer .rewardHistoryDateFilter,
  .myAccountContainer .parkingRewardHistoryDateFilter {
    padding-bottom: 0;
  }

  .transactiondetailsWrapper .blackLine {
    margin: 0 !important;
  }

  .memberAccTitleWrapper.mobileShow>h1:first-child {
    font-size: 16px;
    line-height: 19px;
    text-transform: uppercase;
    font-weight: 400;
  }

  .memberAccTitleWrapper.mobileShow>h1:nth-child(2) {
    font-size: 28px;
    line-height: 33px;
    text-transform: none;
    font-weight: 300;
  }

  .memberAccTitleWrapper.mobileShow {
    transform: translate(-50%, -200%);
  }

  .headerTitleContainer .memberAccTitleWrapper.mobileShow h1 {
    transform: none;
  }

  .kidMembership {
    display: none;
    width: 100%;
    max-width: 295px;
    max-height: 185px;
    transition: all 0.25s;
  }

  .kidClubMembershipLogo {
    margin-bottom: 8px;
  }

  .barcode1 {
    margin-top: 11px;
    padding-right: 10px;
    height: 18px;
    width: 100%;
  }

  p.kidMembershipName {
    font-size: 17px;
    line-height: 28px;
  }

  .kidMembershipBirthDateCard {
    font-size: 10px;
    line-height: 12px;
  }

  .kidMembershipMemberNoCard,
  .kidMembershipGraduationDateCard {
    font-size: 12px;
    line-height: 14px;
  }

  .kidsClubMemberCount p.title {
    width: 95%;
  }

  i.fas.fa-plus.mobileShow {
    font-size: 10px;
    color: var(--color-text);
  }

  p.closeIcon {
    display: inline-block;
    width: 5%;
    text-align: right;
  }

  .kidsClubMemberCount p.title {
    display: inline-block;
    color: var(--color-info);
    padding-bottom: 0 !important;
    cursor: pointer;
  }

  .halfContainer.rewardContainer .detailsContainer:nth-child(3) {
    padding-bottom: 0;
  }

  .myAccountContainer .transactionDetail .shopName {
    width: 50%;
  }

  .no-matches {
    padding-bottom: 40px;
  }

  .kidMembershipWrapper {
    width: calc(50% - 16px);
    display: inline-block;
    margin: 0 8px;
  }

  .kidsClubCardWrapper {
    margin: 0 -8px;
    padding-top: 16px;
  }

  .myAccountContainer .viewRewardCatalogue {
    display: block;
    border: none;
    border-top: 1px solid var(--color-border);
    border-radius: 0;
    margin-top: 0;
    padding: 24px 16px;
    background-color: var(--color-white);
  }

  .myAccountContainer .viewRewardCatalogue::after {
    content: "\f061";
    font-family: "FontAwesome";
    font-size: 18px;
    -webkit-text-stroke: 2px var(--color-white);
    padding-left: 12px;
  }

  /*End My Account */

  .exploreNewSection {
    display: none;
  }

  .exploreNewSectionMobile {
    display: block;
  }

  .lastCatSection {
    margin-top: 32px;
    margin-bottom: 0;
    padding-bottom: 60px;
  }

  .lastCatSection .homepageCatBtn {
    margin-bottom: 0;
  }

  .homepageCatBtnText {
    color: var(--color-accent);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: bold;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .whatsOnCatHomeBtn {
    border: 1px solid var(--color-border);
    border-radius: 22px;
    background-color: var(--color-white);
    padding: 8px 16px;
    max-height: 44px;
    min-width: 100%;
    text-align: left;
  }

  div.whatsOnContainer .promotionPost,
  div#homepageWhatsOn .happeningPostWrapper:nth-child(n),
  div.whatsOnContainer .promotionPost:nth-child(n) {
    width: 200px;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    transition: 0.25s all;
    background-color: var(--color-white);
    overflow: hidden;
    height: 471px;
  }

  div#homepageWhatsOn .happeningPostWrapper.events:nth-child(n) {
    width: 200px;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    transition: 0.25s all;
    background-color: var(--color-white);
    overflow: hidden;
    height: 200px;
  }

  div#homepageWhatsOn .happeningPostWrapper:nth-child(4),
  div.whatsOnContainer .promotionPost:nth-child(4) {
    width: 200px;
    display: inline-block;
    margin-right: 0;
    position: relative;
    transition: 0.25s all;
    background-color: var(--color-white);
    overflow: hidden;
    height: 471px;
  }

  div#homepageWhatsOn a.happeningPostTitle,
  div#homepageWhatsOn p.happeningPostTitle,
  div#homepageWhatsOn a.newPostTitle,
  div#homepageWhatsOn p.newPostTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    height: 54px;
    display: block;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
  }

  .happeningPostDate {
    color: var(--color-muted);
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .happeningPostContent {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .homepageCallToActionButton {
    margin-top: 24px;
    margin-bottom: 5px;
    margin-left: 40px;
  }

  .homepageSecondTitleSection {
    margin-top: 64px;
  }

  .homepageSecondTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 32px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 32px;
    margin-left: 40px;
  }

  .homepageSecondBanner {
    height: 200px;
    margin-top: 0;
  }

  .homepageBtnRow {
    display: none;
  }

  .homepageBtnRowMobile {
    margin-top: 24px;
    margin-bottom: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .whatsOnTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: bold;
    letter-spacing: -0.75px;
    line-height: 32px;
    margin-top: 0;
    padding-top: 32px;
  }

  .dropdown-menu {
    min-width: 80vw;
  }

  .homepageMainTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 40px;
    font-weight: bold;
    letter-spacing: -1.5px;
    line-height: 40px;
    max-width: 80vw;
    margin: 32px 40px;
  }

  .popularSectionTitle {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 24px;
  }

  .popularTitle {
    color: var(--color-white);
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 21px;
    position: absolute;
    bottom: 9px;
    left: 12px;
  }

  .popularImg {
    border-radius: 12px;
    height: 80px;
    width: 100%;
    object-fit: cover;
  }

  .popularCardContainer {
    margin-top: 10px;
    margin-bottom: 0;
  }

  div#directoryRevamp .storeMenuContainerRow {
    border-radius: 8px;
    padding: 12px 16px;
  }

  div#directoryRevamp .storeMenuContainerRow {
    padding: 12px 16px;
    height: unset;
  }

  .storeMenuContainerRow {
    padding: 12px 16px;
    height: 48px;
  }

  div#directoryRevamp.storeMenuContainer {
    background-color: var(--color-white);
    margin: 0px 0px 32px 0px;
    box-shadow: 0 18px 20px -20px rgba(0, 0, 0, 0.4);
    display: block;
    position: relative;
    border-radius: 16px;
  }

  .guideList {
    padding: 0;
  }

  .guideListWrapper:nth-child(n) {
    border-radius: 0;
    padding: 21px 12px 21px 16px;
    height: 86px;
    width: 100vw;
    margin-bottom: 0;
    display: inline-flex;
  }

  #tags-list .ais-Hits .ais-Hits-list .ais-Hits-item:nth-child(n) {
    padding: 4px;
  }

  #tags-list .ais-Hits {
    margin-top: 0;
    margin-bottom: 40px;
  }

  #tags-list .tagsListLink {
    display: flex;
    position: relative;
  }

  #tags-list .guideListWrapper:nth-child(n) {
    border-radius: 8px;
    padding: 0;
    height: 390px;
    width: 100%;
    margin-bottom: 0;
    display: block;
  }

  #tags-list img.newStoreTag {
    border-top-left-radius: 8px;
    top: -2px;
  }

  #tags-list .guideListThumbnail {
    height: 175px;
    width: 100%;
    border-bottom: 1px solid var(--color-border);
  }

  #tags-list .guideListContentWrapper .colorLine {
    display: block;
  }

  #tags-list .guideListContentWrapper {
    width: 100%;
    height: 215px;
    position: relative;
    overflow: hidden;
    top: 0;
  }

  #tags-list .guideListContent {
    padding: 12px 8px 0 8px;
  }

  #tags-list .tagSection {
    display: flex;
    top: 140px;
    margin-left: 8px;
    position: absolute;
  }

  #tags-list .storeLotIcon,
  #tags-list .storeCatIcon {
    display: block;
  }

  #tags-list .storeContentSection {
    padding-top: 13px;
  }

  #tags-list .storeLotIcon {
    height: auto;
    width: 14px;
    margin-right: 10px;
    object-fit: fill;
  }

  #tags-list .storeCatIcon {
    height: 14px;
    width: 14px;
    margin-right: 10px;
    object-fit: fill;
  }

  .searchedPost {
    border-radius: 8px;
  }

  .searchedPostImg {
    border-radius: 8px 8px 0 0;
  }

  .searchedPostDetailsContainer {
    padding: 12px 8px 0 8px;
  }

  div#directoryStorelist .guideList .guideListWrapper:nth-child(n),
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper:nth-child(n) {
    border-top: 1px solid var(--color-gray-100);
  }

  .guide.container.allStoreContainer {
    padding: 0 !important;
  }

  .guideListContent .storeName,
  .participatingContent .participatingStoreName {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
    padding-bottom: 0;
    vertical-align: unset;
    height: auto;
  }

  .guideListContent .storeName {
    height: 24px;
    -webkit-line-clamp: 1;
  }

  .guideListContent.hasPromo {
    padding: 0 40px 0 16px;
  }

  .storeTextContent {
    padding-left: 0;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .storeContentSection {
    padding-top: 0;
  }

  .storeContentSectionSecond {
    display: none;
  }

  .tagSection {
    display: none;
  }

  div#kids_content .tagSection {
    display: block;
    width: fit-content;
    max-height: 2px;
    min-height: 2px;
  }

  .tagSectionMobile {
    margin-top: 4px;
    position: relative;
    display: flex;
    opacity: 1;
    z-index: 9;
    align-items: center;
    height: 19px;
  }

  .tagSectionMobile:empty {
    display: none;
  }

  img.kidsClubStoreTag,
  img.dbsTag,
  img.halalStoreTagWrapper,
  img.touristStoreTagWrapper {
    padding-left: 0;
  }

  .kidsClubStoreTagWrapper img,
  .halalStoreTagWrapper img,
  .dbsStoreTagWrapper img,
  .touristStoreTagWrapper img {
    max-height: 19px;
    max-width: 100%;
  }

  .guideListContent p {
    color: var(--color-accent);
    font-family: var(--font-body);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.67px;
    line-height: 13.33px;
  }

  .newStoreCornerWrapper {
    display: block;
    left: 0;
  }

  .iconNextMobile {
    font-size: 15px;
    display: flex;
    position: absolute;
    right: 0;
    bottom: 0;
    align-items: center;
  }

  .hasPromotionTagWrapper {
    padding: 7px 5px;
    margin-right: 0;
    border-radius: 2px;
  }

  .mobileArrowDirectory {
    margin-left: 12px;
    color: var(--color-muted);
  }

  div.happeningPostWrapper:hover .promoEnterButton,
  div.promotionPost:hover .promoEnterButton,
  div.guideListWrapper:hover .promoEnterButton,
  div.promotionPost:hover .promoEnterButtonSH,
  div.happeningPostWrapper:hover .promoEnterButtonMH,
  div.happeningPostWrapper:hover .promoEnterButtonNS,
  div.happeningPostWrapper:hover .promoEnterButtonWN,
  div.promotionPost:hover .promoEnterButtonKC,
  div.pressRoomBox:hover .pressRoomEnterButton,
  a.mediaKitLinkWrapper:hover .pressKitEnterButton {
    display: none;
  }

  div#homepageWhatsOn.container,
  div#whatsOnRevamp.container,
  div#algolia_store_tags_list.container {
    padding: 0px !important;
  }

  .whatsOnBtnRow {
    display: none;
  }

  .whatsOnBtnRowMobile {
    display: block;
  }

  div#whatsOnRevamp .happeningDiv .happeningPostWrapper:nth-child(n) {
    width: 100%;
    margin-top: 24px;
    padding: 0;
    height: 539px;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningBox {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 16px;
    letter-spacing: -0.25px;
    line-height: 28px;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningBox .happeningPostImage {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 358px;
    background-color: var(--color-white);
    background-repeat: no-repeat;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningPostContentWrapper {
    position: relative;
    width: 100%;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningPostContentWrapper .happeningPostContent {
    height: 60px;
    -webkit-line-clamp: 3;
  }

  div#whatsOnRevamp #happeningSection .happeningPostWrapper:nth-child(n) .happeningPostContentWrapper .happeningPostContainer {
    padding: 16px 16px 0 16px;
  }

  div.whatsOnContainer .happeningPostContainer {
    padding: 16px;
  }

  .btnWhatsOnLabel {
    color: var(--color-white);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .whatsOnBtnContainer {
    margin-top: 0;
    margin-bottom: 24px;
  }

  div.whatsOnBtnContainer .swiper-slide {
    max-width: max-content;
  }

  div#happeningSection .divider,
  div#promoSection .divider,
  div#kidsSection .divider,
  div#newStoreSection .divider {
    display: none;
  }

  .calendarBtnContainer {
    margin-left: 12px;
  }

  #filterBtnSH {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1678420183/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_filter.png");
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: center;
    background-color: var(--color-white);
    height: 44px;
    width: 44px;
  }

  #filterBtnSH:active {
    background-color: var(--color-accent);
  }

  #birthdayBtn {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1680144606/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_cake.png");
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: center;
    height: 44px;
    width: 44px;
    margin-left: 12px;
  }

  #birthdayBtn.filterBtn {
    background-color: var(--color-white);
  }

  #birthdayBtn.filterBtn.active {
    background-color: var(--color-accent);
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1680144606/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_cake_active.png");
  }

  #birthdayBtn.filterBtn.active img {
    filter: brightness(0) invert(1);
  }

  div#kidsSection .whatsOnTopBar.mobileDisplayShow {
    display: flex !important;
    justify-content: space-between;
    margin-bottom: 40px;
  }

  div#kidsSection .whatsOnCatBtn {
    max-width: none;
    width: 100%;
  }

  .whatsOnCatBtnText {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .whatsOnCatBtn.whatsOnCatBtnSH {
    width: 100%;
    min-width: 50vw;
  }

  div#whatsOnRevamp .whatsNewDiv .happeningPostWrapper {
    width: 50%;
    margin-right: 8px;
    height: 390px;
  }

  .happeningPostImage {
    height: 175px;
  }

  div#whatsOnRevamp div#promoSection .promotionsPage div#store_promotions .promotionPost:nth-child(n) {
    width: 50%;
    height: 390px;
    padding: 0;
  }

  div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent .promotionContent {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
  }

  div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent .promotionPageImg {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 200px;
    background-color: var(--color-white);
    background-repeat: no-repeat;
  }

  div#whatsOnRevamp div#promoSection .promotionPageTypeTabContent .promotionDetailsWrapper {
    position: relative;
    width: 100%;
    height: 40%;
    top: -25px;
  }

  .promotionPageTypeTabContent a.promotionTitle {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    max-width: 100%;
    -webkit-line-clamp: 1;
    padding-bottom: 0;
    margin-bottom: 8px;
    height: 40px;
  }

  div#kids_club_offers .promotionPageTypeTabContent a.promotionTitle {
    height: auto;
  }

  div#kids_club_offers .promotionPageTypeTabContent .promotionDetailsContainer {
    top: 0px;
  }

  div.whatsOnContainer .promotionTitle {
    font-size: 18px;
  }

  a.happeningPostTitle,
  p.happeningPostTitle {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    display: -webkit-box;
    width: 100%;
    padding-bottom: 0;
    height: 20px;
  }

  .cardSection .blackLine {
    margin-top: 32px;
    margin-bottom: 32px;
  }

  .sectionTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    margin-top: 40px;
    margin-bottom: 24px;
  }

  .whatsOnTopBar {
    margin-top: 16px;
    justify-content: space-between;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(n) {
    width: 48.5%;
    height: 390px;
    margin-right: 8px;
    border-radius: 8px;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostWrapper:nth-child(2n) {
    margin-right: 0;
  }

  div#whatsOnRevamp .newStoreDiv .happeningBox {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostCategories {
    color: var(--color-muted);
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
    padding-top: 8px;
    display: block;
    width: 100%;
    max-height: max-content;
    -webkit-line-clamp: unset;
    -webkit-box-orient: unset;
    overflow: auto;
    text-overflow: unset;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostContent {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostImage {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 175px;
    background-color: var(--color-white);
    background-repeat: no-repeat;
  }

  div#whatsOnRevamp .newStoreDiv .happeningPostContentWrapper {
    position: relative;
    width: 100%;
  }

  div#happeningSection .whatsOnTopBar {
    margin-bottom: 16px;
  }

  div#newStoreSection .whatsOnTopBar {
    display: flex;
    flex-direction: column-reverse;
  }

  div#newStoreSection .postCounterSection {
    width: 100%;
  }

  div#newStoreSection .postCounterSection .postCounter {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    padding-top: 40px;
    padding-bottom: 24px;
  }

  .postCounter,
  .hitsCounter .ais-Stats-text {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
  }

  div#newStoreSection .categorySection {
    width: 100%;
  }

  div#newStoreSection .whatsOnCatBtn {
    min-width: 100%;
  }

  div#whatsOnRevamp #eventSection {
    margin-top: 32px;
  }

  div#atrium_events {
    padding-top: 0;
    display: block;
  }

  div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(n) {
    width: 48.5%;
    margin-right: 8px;
    margin-bottom: 16px;
    height: 390px;
    border-radius: 8px;
  }

  div#kidsSection .promotionsPage div#kids_club_offers .promotionPost:nth-child(2n) {
    width: 48.5%;
    margin-right: 0;
    height: 390px;
    border-radius: 8px;
  }

  div#kidsSection div#kids_club_offers .promotionPageTypeTabContent .promotionPageImg,
  div.whatsOnContainer .promotionPost .promotionImg {
    box-shadow: none;
    margin-bottom: 0;
    height: 175px;
  }

  .promotionPageTypeTabContent .promotionDetailsWrapper {
    position: relative;
    width: 100%;
    height: 215px;
  }

  div#kids_club_offers .promotionDesc {
    height: 80px;
  }

  .parallax {
    margin-top: 32px;
    animation-duration: 2s !important;
  }

  #filter-popup.modal,
  #filter-popup2.modal {
    inset: 0;
    display: none;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: calc(60px + max(env(safe-area-inset-bottom), 0px));
    z-index: 99999;
    height: 100vh;
    height: 100dvh;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
    background: transparent;
  }

  #filter-popup.modal::before,
  #filter-popup2.modal::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    transition: opacity 0.22s ease;
    pointer-events: none;
  }

  #filter-popup.modal.show,
  #filter-popup2.modal.show {
    display: flex !important;
    opacity: 1;
    pointer-events: auto;
  }

  #filter-popup.modal.show::before,
  #filter-popup2.modal.show::before {
    opacity: 1;
  }

  #filter-popup.modal .modal-dialog,
  #filter-popup2.modal .modal-dialog {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 100%;
    margin: 0;
    min-height: 0 !important;
    height: auto !important;
    transform: translateY(28px);
    transition: transform 0.22s ease;
  }

  #filter-popup.modal .modal-dialog.modal-dialog-centered,
  #filter-popup2.modal .modal-dialog.modal-dialog-centered,
  #filter-popup.modal .modal-dialog.modal-dialog-scrollable,
  #filter-popup2.modal .modal-dialog.modal-dialog-scrollable {
    display: block !important;
    min-height: 0 !important;
    max-height: none !important;
    align-items: flex-end !important;
  }

  #filter-popup.modal .modal-content,
  #filter-popup2.modal .modal-content {
    width: 100%;
    margin: 0;
    background: var(--color-white);
    background-color: var(--color-white);
    border-radius: 16px 16px 0 0;
    max-height: 60vh;
    overflow: hidden;
  }

  #filter-popup2.modal .modal-content {
    display: flex;
    flex-direction: column;
    max-height: calc(100dvh - 24px - max(env(safe-area-inset-bottom), 0px));
  }

  #filter-popup.modal.show .modal-dialog,
  #filter-popup2.modal.show .modal-dialog {
    transform: translateY(0);
  }

  #filter-popup.modal.is-closing,
  #filter-popup2.modal.is-closing {
    display: flex !important;
    opacity: 0;
    pointer-events: none;
  }

  #filter-popup.modal.is-closing::before,
  #filter-popup2.modal.is-closing::before {
    opacity: 0;
  }

  #filter-popup.modal.is-closing .modal-dialog,
  #filter-popup2.modal.is-closing .modal-dialog {
    transform: translateY(28px);
  }

  #filter-popup.modal.fade,
  #filter-popup2.modal.fade {
    min-width: 100vw;
    z-index: 1041;
  }

  .modal-open .modal {
    overflow-y: hidden;
  }

  .modal.fade .filter-modal-body {
    bottom: 0;
    opacity: 1;
  }

  .filter-modal-body {
    position: relative;
    opacity: 0;
    min-height: 0;
    max-height: calc(60vh - 90px);
    overflow-y: auto;
  }

  #filter-popup2 .filter-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  #filter-popup2.modal,
  #filter-popup2.modal .modal-dialog,
  #filter-popup2.modal .modal-content,
  #filter-popup2 .modalHeader,
  #filter-popup2 .modalContent,
  #filter-popup2 .modalContent2 {
    overflow-x: hidden;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
  }

  #filter-popup2 .catFilterBtn {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  #filter-popup2 .dropdown,
  #filter-popup2 #categorySection .dropdown {
    min-width: 100%;
    width: 100%;
    max-width: 100%;
    left: 0;
    box-sizing: border-box;
  }

  #filter-popup.modalCalendar .modal-content {
    max-height: 80vh;
    max-height: 80dvh;
  }

  #filter-popup.modalCalendar .filter-modal-body {
    opacity: 1;
    min-height: 0;
    max-height: calc(80vh - 90px);
    max-height: calc(80dvh - 90px);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  #filter-popup.modalCalendar .modalContent {
    min-height: 0;
    padding: 0;
  }

  #filter-popup .modalHeader,
  #filter-popup2 .modalHeader {
    display: flex;
    padding: 16px 16px 0;
  }

  #filter-popup .filterTitle,
  #filter-popup2 .filterTitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
  }

  #filter-popup .filterApply,
  #filter-popup2 .filterApply {
    color: var(--color-accent);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 27px;
    margin-left: auto;
    order: 2;
    cursor: pointer;
  }

  #filter-popup .blackLine,
  #filter-popup2 .blackLine {
    margin-top: 16px;
    margin-bottom: 39px;
  }

  #filter-popup .blackLine2,
  #filter-popup2 .blackLine2 {
    margin-top: 16px;
    border-top: 1px solid var(--color-border);
  }

  #filter-popup .modalContent,
  #filter-popup2 .modalContent {
    padding: 0 16px;
  }

  #filter-popup .modalContent2,
  #filter-popup2 .modalContent2 {
    padding: 0;
  }

  #filter-popup .contentSubtitle,
  #filter-popup2 .contentSubtitle {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 13px;
  }

  #filter-popup .contentSubtitle2,
  #filter-popup2 .contentSubtitle2 {
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    margin-top: 39px;
    margin-bottom: 13px;
  }

  #filter-popup .filterWrapper,
  #filter-popup2 .filterWrapper {
    display: flex;
  }

  #filter-popup .filterWrapper.fullWidth,
  #filter-popup2 .filterWrapper.fullWidth {
    display: flex;
    flex-direction: column;
  }

  #filter-popup .filterTypeCheckbox,
  #filter-popup2 .filterTypeCheckbox {
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background-color: var(--color-white);
    width: 50%;
    padding: 20px 12px;
    margin-right: 8px;
    margin-bottom: 8px;
    line-height: normal;
    display: flex;
    align-items: center;
    height: 56px;
  }

  #filter-popup .filterTypeCheckbox.subMenu,
  #filter-popup2 .filterTypeCheckbox.subMenu {
    padding: 20px 48px;
    display: none;
    transition: all 0.2s ease;
  }

  #filter-popup .filterTypeCheckbox.single,
  #filter-popup2 .filterTypeCheckbox.single {
    width: 49%;
  }

  #filter-popup .filterTypeCheckbox.fullWidth,
  #filter-popup2 .filterTypeCheckbox.fullWidth {
    width: 100%;
  }

  #filter-popup .filterTypeCheckbox.rightSide,
  #filter-popup2 .filterTypeCheckbox.rightSide {
    margin-right: 0;
  }

  #filter-popup .filterTypeCheckbox.thirdBtn,
  #filter-popup2 .filterTypeCheckbox.thirdBtn {
    width: 49%;
  }

  #filter-popup .filterTypeCheckbox.active,
  #filter-popup2 .filterTypeCheckbox.active {
    background-color: var(--color-accent);
  }

  #filter-popup .typeChckBxText,
  #filter-popup2 .typeChckBxText {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
  }

  #filter-popup .filterTypeCheckbox.active .typeChckBxText,
  #filter-popup2 .filterTypeCheckbox.active .typeChckBxText {
    color: white;
  }

  #filter-popup .catFilterBtn,
  #filter-popup2 .catFilterBtn {
    border: 1px solid var(--color-border);
    border-radius: 22px;
    background-color: var(--color-white);
    padding: 8px 16px;
    max-height: 44px;
    min-width: 92vw;
    text-align: left;
    margin-bottom: 66px;
  }

  .catFilterBtnText {
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .iconDropdown {
    float: right;
    margin-left: auto;
  }

  div.storeMenuContainerRow .iconDropdown {
    margin-right: 5px;
  }

  div#filter-popup .dropdown,
  div#filter-popup2 .dropdown {
    position: absolute;
    display: block;
    float: left;
    min-width: 160px;
    margin: 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: var(--color-white);
    background-clip: padding-box;
    cursor: pointer;
    min-width: 100vw;
    padding: 0;
  }

  #filter-popup #categorySection .dropdown,
  #filter-popup2 #categorySection .dropdown {
    position: static;
    min-width: 100%;
  }

  div#filter-popup .dropdown li.selectedPromotionPageSubCat:not(:last-child),
  div#filter-popup2 .dropdown li.selectedPromotionPageSubCat:not(:last-child) {
    border-bottom: 1px solid var(--color-border-light);
  }

  div#filter-popup .dropdown li.selectedPromotionPageSubCat,
  div#filter-popup2 .dropdown li.selectedPromotionPageSubCat {
    padding: 16px;
  }

  div#filter-popup .dropdown li.selectedPromotionPageSubCat:last-child,
  div#filter-popup2 .dropdown li.selectedPromotionPageSubCat:last-child {
    padding: 16px;
    margin-bottom: 80px;
  }

  li.selectedPromotionPageSubCat a {
    padding: 14px 16px;
  }

  div#filter-popup #backArrow,
  div#filter-popup2 #backArrow {
    margin-right: 24px;
    margin-top: 3px;
    cursor: pointer;
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1680850106/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_next.png");
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: center;
    height: 24px;
    width: 24px;
  }

  .storeCat.container.contentContainer .searchBar {
    width: 100%;
    padding: 0;
    height: unset;
    margin-bottom: 0;
    border-bottom: 0;
  }

  .catFilterBtn {
    background-color: var(--color-white);
    padding: 11px 0 0 0;
    height: 48px;
    min-width: 100%;
    text-align: left;
  }

  .blackLineCatFilter {
    height: 1px;
    background-color: var(--color-border-light);
    width: 100%;
    padding: 0;
  }

  .postCounter.guidePage {
    margin-top: 0px;
    margin-bottom: 16px;
    margin-left: 16px;
  }

  .hitsCounter .ais-Stats {
    margin-top: 0px;
    margin-bottom: 16px;
    margin-left: 16px;
    padding-bottom: 0;
  }

  aside#searchbox {
    margin-bottom: 0;
    width: 100%;
    border-bottom: 0;
  }

  .storeCat.container.contentContainer.searchPage {
    padding: 32px 0 12px 0 !important;
  }

  .searchHeader {
    min-height: 96px;
    padding: 32px 0;
  }

  .ais-Hits {
    margin-top: 24px;
  }

  .ais-Hits-list {
    display: flex;
  }

  .ais-Hits-item {
    width: calc(50% - 16px);
  }

  .promotionPageTypeTabContent .promotionDetailsContainer {
    padding: 12px 8px 0 8px;
  }

  div#whatsOnRevamp .eventsDiv .happeningPostWrapper:nth-child(n) {
    width: 100%;
    height: 100%;
    border-radius: 8px;
  }

  .happeningPostContent,
  .pressRoomPostContent,
  .promotionPageTypeTabContent .promotionDesc,
  .touristPrivilegesCatMenuTabContent .promotionDesc {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .desktopDisplayShow,
  .desktopRoller {
    display: none !important;
  }

  .mobileDisplayShow {
    display: flex !important;
  }

  .mobileRoller {
    display: flex !important;
    flex-direction: column;
  }

  .cardText {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 16px;
    text-align: left;
  }

  div.diningThumbImg .cardText,
  div.kidsThumbImg .cardText {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    position: absolute;
    bottom: 0;
    left: 0;
  }

  div#categorySection.modalContent2 .dropdown .dropdown-submenu {
    width: 100%;
    padding: 0;
    border-bottom: 1px solid var(--color-border-light);
  }

  div#categorySection.modalContent2 .dropdown li.dropdown-submenu:last-child {
    /* margin-bottom: 60px; */
    border-bottom: none;
  }

  div#categorySection.modalContent2 ul.dropdown-menu.submenulist {
    background-color: var(--color-off-white) !important;
  }

  div#categorySection.modalContent2 ul,
  div#categorySection.modalContent2 li {
    list-style: none !important;
  }

  div#categorySection.modalContent2 .dropdown .dropdown-submenu .dropdown-menu li a {
    color: black;
  }

  .dropdown-submenu .dropdown-menu li a {
    padding: 12px 18px;
  }

  .storeLotIcon,
  .storeCatIcon {
    display: none;
  }

  div#directoryRevamp.storeMenuContainer .storeMenuContainerRow {
    display: block;
  }

  div#directoryRevamp.storeMenuContainer .storeMenuContainerRow .searchBar {
    width: 100%;
  }

  .guideListThumbnail,
  .participatingThumbnailWrapper {
    height: 60px;
    width: 60px;
    border-bottom: none;
  }

  img.newStoreTag {
    height: 39px;
    width: 39px;
    border-top-left-radius: 0;
    top: -23px;
  }

  .guideList .ais-Hits-item:nth-child(n),
  #algolia_store_tags_list .ais-Hits-item:nth-child(n) {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    border-radius: 0;
  }

  #algolia_store_tags_list .ais-Hits-list {
    padding: 0;
    display: block;
  }

  img.featureImage {
    margin: 0;
  }

  .guideListContent {
    line-height: normal;
    padding: 0 16px;
  }

  div#homepageWhatsOn .happeningPostWrapper .happeningPostImage {
    height: 200px;
  }

  .directoryBadge {
    padding: 6px 12px;
    margin-top: 14px;
  }

  .directoryTextBadge {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .directoryClearIcon {
    padding-left: 10px;
    font-size: 20px;
  }

  .filterDirBtnMobile {
    max-height: 24px;
    max-width: 24px;
    border: none;
    background-color: var(--color-white);
    text-align: center;
    font-size: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #filterBtnDir {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1678420183/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_filter.png");
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: top right;
    height: 24px;
    width: 24px;
  }

  h1.headerTitle {
    font-size: 32px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 32px;
    padding-bottom: 16px;
  }

  .emptyCatSectionMobile {
    height: 48px;
  }

  .hitsCounter.guidePage.container {
    padding: 0;
  }

  #filter-popup2 .daterangepicker,
  #filter-popup .daterangepicker {
    position: static !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    border-radius: 0px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: block !important;
    margin-top: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  .daterangepicker:after,
  .daterangepicker:before {
    display: none !important;
  }

  .daterangepicker .calendar-table {
    border-radius: 0px !important;
    border: none !important;
  }

  #filter-popup .daterangepicker .drp-calendar.left,
  #filter-popup2 .daterangepicker .drp-calendar.left {
    min-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #filter-popup .daterangepicker .drp-calendar.right,
  #filter-popup2 .daterangepicker .drp-calendar.right {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 44px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #filter-popup .daterangepicker .calendar-table,
  #filter-popup2 .daterangepicker .calendar-table {
    width: 100% !important;
    table-layout: fixed !important;
  }

  .daterangepicker .drp-buttons {
    display: none !important;
  }

  img.featureImage,
  img.participatingFeatureImage {
    /* max-height: unset; */
    max-width: 100%;
    margin: auto;
  }

  div#directoryStorelist .guideList .guideListWrapper img.featureImage,
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper img.featureImage {
    max-height: unset;
    max-width: 100%;
    margin: 0;
  }

  .storeCat.container.contentContainer.searchBarCont {
    padding-top: calc(80% / 3) !important;
  }

  .popularCard.container.searchBarCont {
    padding-bottom: 120px !important;
  }

  .searchBarTitle {
    font-size: 32px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 32px;
    padding-bottom: 24px;
  }

  i.fas.fa-search {
    font-weight: 900;
    font-size: 20px;
    padding-top: 3px;
  }

  .search-form {
    height: 24px;
  }

  .storeCat.container.contentContainer.directory .searchBar input {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
    padding-left: 46px;
    height: unset;
  }

  .storeCat.container.contentContainer .searchBar input {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
    padding-left: 30px;
    padding-right: 10px;
    height: 24px;
  }

  .searchedPostImg {
    height: 175px;
  }

  .searchedPostDetailsWrapper {
    height: 215px;
  }

  .searchedPostTitle {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
  }

  #tags-list .guideListContent .storeName {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    height: 45px;
  }

  .searchedPostHappeningType,
  .searchedPostPromotionType,
  .searchedPostStoreCat,
  .searchedPostPress {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .searchedPostDesc {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .searchHeader h1 {
    color: var(--color-white);
    font-family: Poppins;
    font-size: 32px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 32px;
  }

  .birthdayTagText {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 18px;
  }

  .hasBirthdayTagWrapper {
    border-radius: 4px;
    padding: 6px 8px;
  }

  div#directoryStorelist .guideList .guideListWrapper .guideListContentWrapper,
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper .guideListContentWrapper {
    top: -17px;
  }

  div#directoryStorelist .guideList .guideListWrapper .guideListContentWrapper:not(:has(.guideListContent .tagSectionMobile)),
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper .guideListContentWrapper:not(:has(.guideListContent .tagSectionMobile)) {
    top: 0;
  }

  div#directoryStorelist .guideList .guideListWrapper .guideListContentWrapper:has(.guideListContent .tagSectionMobile) .iconNextMobile,
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper .guideListContentWrapper:has(.guideListContent .tagSectionMobile) .iconNextMobile {
    bottom: -2px;
  }

  div#directoryStorelist .guideList .guideListWrapper .guideListContentWrapper:not(:has(.guideListContent .tagSectionMobile)) .iconNextMobile,
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper .guideListContentWrapper:not(:has(.guideListContent .tagSectionMobile)) .iconNextMobile {
    bottom: 15px;
  }

  div#directoryStorelist .guideList .guideListWrapper .guideListContentWrapper:not(:has(.guideListContent .tagSectionMobile)) .iconNextMobile:has(.hasPromotionTagWrapper),
  #algolia_store_tags_list .ais-Hits-item .guideListWrapper .guideListContentWrapper:not(:has(.guideListContent .tagSectionMobile)) .iconNextMobile:has(.hasPromotionTagWrapper) {
    bottom: 10px;
  }


  .icon-badge {
    background-color: var(--color-accent);
    color: var(--color-white);
    font-family: var(--font-body);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 15px;
    text-align: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    position: absolute;
    top: -6px;
    right: -6px;
    display: none;
  }

  .icon-badge.active {
    display: block;
  }

  .storeCat.container.contentContainer .searchBar .cancelSearch {
    top: 20%;
    right: 0;
  }

  .storeCat.container.contentContainer #directoryRevamp .searchBar .cancelSearch {
    right: 40px;
  }

  .cancelSearch {
    font-size: 16px;
  }

  .filterBtnMobile {
    display: inline-flex;
    position: relative;
    margin-left: 12px;
    flex: 0 0 24px;
    align-items: flex-start;
    justify-content: center;
  }

  .error-404.not-found .popularCardGrid,
  #no-matches .popularCardGrid {
    gap: 6px;
    margin: 16px 0 0 0;
  }

  .error-404.not-found .popularCardTile,
  #no-matches .popularCardTile {
    height: 80px;
    max-height: 80px;
    max-width: 100%;
    width: 100%;
    min-width: 100%;
    flex-basis: 100%;
    flex-grow: 0;
    flex-shrink: 0;
  }

  .error-404.not-found .popularCardTile {
    width: calc((100% - 6px) / 2);
    min-width: calc((100% - 6px) / 2);
    max-width: calc((100% - 6px) / 2);
    flex-basis: calc((100% - 6px) / 2);
  }

  .error-404.not-found .popularCardTile img,
  #no-matches .popularCardTile img {
    object-position: center 42%;
  }

  .error-404.not-found .popularCardTile .popularTitle,
  #no-matches .popularCardTile .popularTitle {
    font-size: 14px;
    line-height: 20px;
    bottom: 6px;
    left: 6px;
  }

  a.selectable.selectedStoreCat:hover {
    background-color: transparent;
    color: var(--color-accent) !important;
  }

  div#filter-popup2 #categorySection .dropdown.promotionPageCatSelect .dropdown-submenu a.subMenu.storeSubMenu,
  div#filter-popup2 #categorySection .dropdown.promotionPageCatSelect .dropdown-submenu.standalone {
    display: block;
    padding: 16px;
  }

  .guideListContent .kidsClubStoreTag,
  .guideListContent .dbsStoreTag,
  .guideListContent .halalStoreTag,
  .guideListContent .touristPrivilegesTag,
  .singleStorePostContentWrapper .kidsClubStoreTag,
  .singleStorePostContentWrapper .touristPrivilegesTag {
    margin-right: 8px;
  }

  p.noPostMessage {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    padding: 50px 0;
  }

  div#directoryStorelist p.noPostMessage,
  div#algolia_store_tags_list p.noPostMessage {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
    padding: 50px 16px;
  }

  div#homepageDropDownMobile .homepage-whats-on-menu {
    margin-top: 8px;
    width: 100%;
    float: none;
    left: auto;
    top: calc(100% + 8px);
    position: absolute;
    border-radius: 8px;
    background-color: var(--color-white);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
    padding: 0;
    z-index: 20;
  }

  div#homepageDropDownMobile.homepage-whats-on-dropdown {
    position: relative;
    z-index: 12;
  }

  div#homepageDropDownMobile .homepage-whats-on-menu>li {
    list-style: none;
  }

  div#homepageDropDownMobile .homepage-whats-on-menu>li>a {
    display: block;
    width: 100%;
    cursor: pointer;
    padding: 12px 16px;
  }

  .whatsOnCatBtn.mallhappeningSection {
    width: 100%;
    min-width: auto;
    max-width: none;
  }

  #new_stores .happeningPostWrapper .happeningPostContentWrapper .happeningPostContainer a.happeningPostTitle {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    height: 20px;
  }

  #new_stores .happeningPostWrapper .happeningPostContentWrapper .happeningPostContainer .happeningPostContent {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  #atrium_events .happeningPostContainer {
    padding: 16px;
  }

  div#atrium_events .happeningPostTitle {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 20px;
    height: 40px;
  }

  .happeningPostLocation {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  div#promoSection .iconFilter,
  div#promoSection .iconDropdown,
  div#newStoreSection .iconDropdown {
    margin-left: auto;
    top: 0;

  }

  div#happeningSection .iconDropdown,
  div#promoSection .iconDropdown,
  div#kidsSection .iconDropdown,
  div#newStoreSection .iconDropdown,
  .whatsOnCatHomeBtn .iconDropdown,
  .storeMenuContainerRow .iconDropdown {
    top: 0;
    font-size: 18px;
  }

  .daterangepicker .calendar-table td {
    padding: 14px 0 !important;
    font-size: 14px !important;
    font-weight: bold !important;
    letter-spacing: -0.25px !important;
    line-height: 24px !important;
  }

  .daterangepicker .drp-calendar.right .calendar-table th {
    min-width: 66px !important;
  }

  #filter-popup .daterangepicker .drp-calendar.right .calendar-table th,
  #filter-popup2 .daterangepicker .drp-calendar.right .calendar-table th,
  #filter-popup .daterangepicker .calendar-table th,
  #filter-popup2 .daterangepicker .calendar-table th {
    min-width: 0 !important;
    width: 14.2857% !important;
  }

  #filter-popup .daterangepicker .calendar-table thead tr:first-child th,
  #filter-popup2 .daterangepicker .calendar-table thead tr:first-child th {
    width: auto !important;
    min-width: 0 !important;
  }

  #filter-popup .daterangepicker .calendar-table thead tr:first-child,
  #filter-popup2 .daterangepicker .calendar-table thead tr:first-child {
    display: table-row !important;
  }

  #filter-popup .daterangepicker .calendar-table thead tr:first-child th.month,
  #filter-popup2 .daterangepicker .calendar-table thead tr:first-child th.month {
    display: table-cell !important;
    text-align: center !important;
  }

  #filter-popup .daterangepicker .calendar-table thead tr:first-child th.prev,
  #filter-popup .daterangepicker .calendar-table thead tr:first-child th.next,
  #filter-popup2 .daterangepicker .calendar-table thead tr:first-child th.prev,
  #filter-popup2 .daterangepicker .calendar-table thead tr:first-child th.next {
    width: 44px !important;
  }

  #filter-popup .daterangepicker .drp-calendar.left .calendar-table thead tr:first-child th.next,
  #filter-popup2 .daterangepicker .drp-calendar.left .calendar-table thead tr:first-child th.next {
    visibility: hidden !important;
    display: table-cell !important;
    text-align: center !important;
  }

  #filter-popup .daterangepicker .drp-calendar.right .calendar-table thead tr:first-child th.prev,
  #filter-popup2 .daterangepicker .drp-calendar.right .calendar-table thead tr:first-child th.prev {
    display: none !important;
  }

  #filter-popup .daterangepicker .drp-calendar.right .calendar-table thead tr:first-child th.month,
  #filter-popup2 .daterangepicker .drp-calendar.right .calendar-table thead tr:first-child th.month,
  #filter-popup .daterangepicker .drp-calendar.right .calendar-table thead tr:nth-child(2),
  #filter-popup2 .daterangepicker .drp-calendar.right .calendar-table thead tr:nth-child(2),
  #filter-popup .daterangepicker .drp-calendar.right .calendar-table tbody,
  #filter-popup2 .daterangepicker .drp-calendar.right .calendar-table tbody {
    display: none !important;
  }

  #filter-popup .daterangepicker .drp-calendar.right .calendar-table thead tr:first-child th.next,
  #filter-popup2 .daterangepicker .drp-calendar.right .calendar-table thead tr:first-child th.next {
    width: 44px !important;
    min-width: 44px !important;
    display: table-cell !important;
    visibility: visible !important;
    text-align: center !important;
  }

  div#whatsOnRevamp .dropdown {
    width: 100%;
  }

  .happeningPostWrapper,
  .promotionPost {
    border-radius: 8px;
  }

  div#kidsSection div#kids_club_offers .promotionPageTypeTabContent .promotionDetailsWrapper .promotionDetailsContainer .promotionDesc {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 20px;
  }

  .filterTypeCheckbox .checkboxContainer .checkmark {
    top: 0;
  }

  .halalIcon {
    content: url(https://cloudinary.alphapod.com/alphapod/image/upload/v1677556459/Vivocity/Website%20Revamp%202023/Assets/Icons/xxhdpi/icon_halal_selected.png);
  }

  .sectionButtonContainer.container {
    padding: 0 !important;
  }

  div.sectionButtonContainer .swiper-slide,
  div.containerCardBtn.container .swiper-slide {
    transform: translateX(16px);
  }

  .dropdown-submenu .dropdown-menu li:first-child {
    border-top: none;
  }

  .dropdown-menu,
  li.selectedDate {
    font-size: 14px;
  }

  .popularCard.container {
    padding: 0 0 0 16px !important;
  }

  .headerImage .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
  .headerImage .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet,
  .rewardsTypeUsageDesktopPagination.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    width: 64px;
  }

  .headerImage .swiper-horizontal>.swiper-pagination-bullets,
  .headerImage .swiper-pagination-bullets.swiper-pagination-horizontal,
  .headerImage .swiper-pagination-custom,
  .headerImage .swiper-pagination-fraction {
    bottom: var(--swiper-pagination-bottom, 16px);
  }

  .headerImage.vrHeaderImage {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1773732408/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-vivorewards-mobile-v32x.png");
  }

  .headerImage.whats_on_mall_happenings,
  .singlePostImg.mall_promo {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473750/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_1-mobile2x.jpg");
  }

  .headerImage.whats_on_store_highlights,
  .singlePostImg.store_highlights {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473751/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_2-mobile2x.jpg");
    background-position: 50% 35%;
  }

  .headerImage.whats_on_new_stores,
  .singlePostImg.new_stores {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473753/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_3-mobile2x.jpg");
  }

  .headerImage.whats_on_events {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473750/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-whats_on_4-mobile2x.jpg");
    background-position: top;
  }

  .headerImage.kids_club {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1772524244/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-kids_club-mobile2x.jpg");
    background-position: 50% 20%;
  }

  .headerImage.fun_n_learning {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1772524244/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-kids_club-mobile2x.jpg");
    background-position: 50% 20%;
  }

  .headerImage.aboutUs {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473741/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-about-mobile2x.jpg");
    background-position: top;
  }

  .headerImage.tourists {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473749/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-tourist-mobile2x.jpg");
    background-position: top;
  }

  .headerImage.directory_main {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473745/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-mobile2x.jpg");
    background-position: 50% 10%;
  }

  .headerImage.directory_dining {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473744/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-dining-mobile2x.jpg");
  }

  .headerImage.directory_fashion {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473743/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-fashion-mobile2x.jpg");
  }

  .headerImage.directory_health {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473741/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-health-mobile2x.jpg");
  }

  .headerImage.directory_lifestyle {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473740/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-lifestyle-mobile2x.jpg");
  }

  .headerImage.directory_kids {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473740/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-kids-mobile2x.jpg");
  }

  .headerImage.directory_services {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473746/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-directory-services-mobile2x.jpg");
  }

  .headerImage.privacy_policy {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473747/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-privacy_policy-mobile2x.jpg");
  }

  .headerImage.press_room {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771473747/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_hero-press_room-mobile2x.jpg");
    background-position: top;
  }

  .headerImage.leasing_enquiry {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/c_scale,q_auto:good,w_1920/v1683688494/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_hero_leasing.jpg");
  }

  .headerWrapperRevamp {
    padding: 0;
  }

  .directoryRevamp.container {
    padding: 0 16px !important;
  }

  div#store_guide_bg .infoContainer .infoContainerRow {
    display: flex;
    align-items: stretch;
  }

  div#store_guide_bg .infoContainer .infoBox {
    margin: 16px 0;
    padding: 0;
    width: 100%;
  }

  div#store_guide_bg .infoContainer .infoBox:nth-child(2) {
    width: 70%;
  }

  div#store_guide_bg .infoContainer .infoBox .infoContent {
    flex-grow: 1;
  }

  .singleStorePostURL .mobileShow {
    display: inline-block !important;
  }

  a.singleStorePostContact img,
  a.singleStorePostURL img {
    height: 20px;
    width: 20px;
    padding-right: 4px;
    position: relative;
    top: -1px;
  }

  a.singleStorePostContact,
  a.singleStorePostURL {
    font-size: 12px;
  }

  div.singleStorePostContentWrapper .kidsClubStoreTagWrapper img {
    max-height: 48px;
    max-width: 100%;
  }

  .singleStorePostContentWrapper .storeTagWrapper {
    padding-top: 32px;
  }

  .singleStorePostContent p {
    padding: 0 0 40px 0;
  }

  .aboutStoreContainer {
    padding: 32px 0 16px 0;
  }

  .diningThumbImg {
    padding-right: 16px;
    margin-top: 0;
    width: 100%;
  }

  .diningThumbImg .img {
    height: 240px;
  }

  .fashionThumbImg {
    padding-right: 0;
    margin-top: 32px;
    width: 100%;
  }

  .fashionThumbImg .img {
    margin-top: 32px;
    height: 240px;
  }

  .newStoreThumbImg {
    padding-right: 16px;
    margin-top: 16px;
    width: 100%;
  }

  .newStoreThumbImg .img {
    height: 171px;
  }

  .findStoreThumbImg {
    margin-top: 16px;
    padding-right: 0;
    width: 100%;
  }

  .findStoreThumbImg .img {
    height: 171px;
    max-height: none;
  }

  .kidsThumbImg {
    width: 100%;
    margin-top: 16px;
    padding-right: 16px;
    padding-left: 0;
    height: 240px;
  }

  .kidsThumbImg .img {
    height: 240px;
  }

  .kidsThumbImg .videoParallaxMedia {
    height: 110%;
  }

  .healthBeautyThumbImg {
    width: 100%;
    margin-top: 16px;
    padding-right: 0;
  }

  .healthBeautyThumbImg .img {
    height: 171px;
  }

  .servicesThumbImg {
    margin-top: 16px;
    width: 100%;
    padding-right: 16px;
  }

  .servicesThumbImg .img {
    height: 240px;
  }

  .homeThumbImg {
    margin-top: 16px;
    padding-right: 0;
    width: 100%;
  }

  .homeThumbImg .img {
    height: 171px;
  }


  .fashionThumbImg .inner {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771228822/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-fashion-mobile3x.jpg");
    background-position: 70%;
  }

  .newStoreThumbImg .inner {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771228829/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-new_stores-mobile3x.jpg");
  }

  .findStoreThumbImg .inner {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771228824/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-find_a_store-mobile3x.jpg");
    background-position: right;
  }

  /*not being used, replaced with video */
  /* .diningThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/video/upload/v1766115542/Vivocity/Vivocity%20Revamp%202026/homepage_thumbnail/homepage_thumbnail_dining_sample.mp4");
  }

  /* .kidsThumbImg .inner {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1683693164/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_16_9_kids.jpg");
  } */

  .healthBeautyThumbImg .inner {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771228825/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-health-mobile3x.jpg");
  }

  .homeThumbImg .inner {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771228827/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-lifestyle-mobile3x.jpg");
  }

  .servicesThumbImg .inner {
    background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771228830/Vivocity/Vivocity%20Revamp%202026/Images/3x/img_home_thumb-services-mobile3x.jpg");
  }

  .promotionPageTypeTabContent .promotionDetailsContainer,
  div.whatsOnContainer .promotionPost .promotionDetailsContainer {
    padding: 16px;
    position: absolute;
    top: 0;
    box-sizing: border-box;
    width: 100%;
    height: 50%;
  }

  .searchBtnRowContainer {
    margin: 24px 0;
  }

  .promotionPageTypeTabContent .promotionContent {
    border-radius: 8px;
  }

  .storeCat.container.contentContainer.searchBarCont .searchBar input {
    width: 100%;
    vertical-align: top;
  }

  .btnWhatsOn:hover {
    background-color: var(--color-black) !important;
    opacity: 0.5;
  }

  div#storePromoTabContentMobile .tagSection {
    display: flex;
  }

  div#storePromoTabContentMobile img.newStoreTag {
    top: 0;
  }

  .swiper.promotionPageTypeTabContent.mobileShow.swiperPromo,
  .swiper.swiperWhatsNew.mobileShow {
    padding-bottom: 0;
    overflow: visible;
    margin-bottom: 40px;
  }

  .swiper.promotionPageTypeTabContent.mobileShow.swiperPromo>.swiper-pagination,
  .swiper.swiperWhatsNew.mobileShow>.swiper-pagination {
    position: absolute;
    bottom: -32px !important;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: 0;
    line-height: 1;
    text-align: center;
    transform: none;
  }

  .swiper.promotionPageTypeTabContent.mobileShow.swiperPromo>.swiper-pagination .swiper-pagination-bullets,
  .swiper.swiperWhatsNew.mobileShow>.swiper-pagination .swiper-pagination-bullets,
  .swiper.promotionPageTypeTabContent.mobileShow.swiperPromo>.swiper-pagination.swiper-pagination-bullets,
  .swiper.swiperWhatsNew.mobileShow>.swiper-pagination.swiper-pagination-bullets {
    width: 100%;
    left: 0;
    transform: none;
    text-align: center;
  }

  #nextCardBtn[class^="swiper-button-"],
  .searchBtnRowContainer [class^="swiper-button-"] {
    top: 55%;
  }

  .retailSpaceBtnWrapper,
  .eventSpaceBtnWrapper,
  .mediaPanelBtnWrapper {
    padding: 24px 0 32px 0;
  }

  .retailSpaceBtnWrapper .retailSpaceBtnBtn,
  .eventSpaceBtnWrapper .eventSpaceBtnBtn,
  .mediaPanelBtnWrapper .mediaPanelBtnBtn {
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: normal;
    text-transform: none;
  }

  .searchHeader .headerTitleContainer .headerTitle {
    padding-bottom: 32px;
  }

  div#homepageWhatsOn .happeningPostContent,
  div#homepageWhatsOn .pressRoomPostContent,
  div#homepageWhatsOn .promotionPageTypeTabContent .promotionDesc,
  div#homepageWhatsOn .touristPrivilegesCatMenuTabContent .promotionDesc {
    height: 100px;
    -webkit-line-clamp: 4;
  }

  div#directoryRevamp .ais-SearchBox-input {
    vertical-align: top;
  }

  div#store_promotions .sectionTitle {
    padding-top: 12px;
    padding-bottom: 12px;
  }


  .menu.desktopShow {
    display: none !important;
  }

  .singleHappeningPostImageWrapper {
    width: 100%;
    padding-bottom: 24px;
  }

  .whatsOnCatBtnText.catBtnNS {
    width: auto;
  }

  .featurePopupDialogDontShowWrapper {
    position: absolute;
    bottom: 0;
  }

  .guide_headerTitle {
    max-width: 767px;
    padding: 0 16px;
  }

  .valetParkingWrapper {
    padding-top: 64px;
  }

  .featurePopupDialog,
  .featurePopupDialog.advertisement {
    max-height: 80vh;
  }

  .guideListContent .tooltip:hover .tooltipText,
  .singleStorePostContentWrapper .tooltip:hover .tooltipText,
  .guideListThumbnail .tagSection .kidsClubStoreTagWrapper:hover .tooltipText,
  .guideListThumbnail .tagSection .hasPromotionTagWrapper:hover .tooltipText,
  .newStoreCornerWrapper:hover .tooltipText,
  .kidsClubStoreTagWrapper:hover .tooltipText,
  .dbsStoreTagWrapper:hover .tooltipText,
  .halalStoreTagWrapper:hover .tooltipText,
  .dbsStoreTagWrapper:hover .tooltipText,
  .hasPromotionTagWrapper:hover .tooltipText,
  .touristStoreTagWrapper:hover .tooltipText {
    visibility: none;
    display: none;
  }

  #footer .downloadContentWrapper {
    width: 100%;
  }

  #footer .downlaodWrapper .container {
    width: 50%;
  }

  .singleStorePostPayment,
  .singleStorePostPoints {
    padding-bottom: 32px;
  }

  .rollerMainBg {
    background-image: url('https://cloudinary.alphapod.com/alphapod/image/upload/v1734402822/Vivocity/Website%202024/Images/CNY_2025_Game_App_Background_V1.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    position: fixed;
    height: 100%;
  }

  .modal-content {
    height: min-content;
  }

  .modal-content.roller-dice {
    margin: 16px;
    background-color: transparent;
  }

}

@media (hover: none) {

  .btnWhatsOn:hover,
  .btnWhatsOn:active,
  .btnWhatsOn:focus {
    background: var(--color-black) !important;
    background-image: none !important;
    opacity: 0.5 !important;
  }

  .btnWhatsOnSelected:hover,
  .btnWhatsOnSelected:active,
  .btnWhatsOnSelected:focus {
    background: linear-gradient(to right, var(--color-magenta), var(--color-accent)) !important;
    opacity: 1 !important;
  }
}

@media (max-width: 650px) {
  .promotionsPage div#kids_club_offers .promotionDesc {
    height: 56px;
    -webkit-line-clamp: 2;
  }

  #footer .download {
    padding: 28px 0;
  }

  #footer img.vivorewardsicon {
    width: auto;
    height: 42px;
  }

  #footer .downlaodWrapper h1 {
    font-size: 16px;
    line-height: 20px;
  }

  #footer .downloadBtnWrapper {
    font-size: 0;
  }

  #footer .downloadContentWrapper {
    padding-left: 0;
  }

  #footer .downloadBtnWrapper .downloadDescWrapper img {
    height: 26px;
  }

  #footer .downloadBtnWrapper img {
    height: 32px;
    display: block;
  }

  #footer .downloadIconWrapper img {
    display: inline-block;
    vertical-align: top;
    margin-right: 8px;
  }

  .searchIconPage img {
    margin-top: 0;
    margin-left: 0;
  }

  .ais-SearchBox-submit {
    top: 30% !important;
    left: 0;
  }

  i.fas.fa-times.featuredPopupModalCloseIcon,
  i.fas.fa-times.featuredPopupModalCloseIcon.advertisement {
    margin-top: 20px;
    margin-left: 20px;
    width: 517px;
  }

  .featured-popup-swiper-button-next {
    right: 15px;
  }

  .featured-popup-swiper-button-next.advertisement {
    right: 15px;
  }
}

@media (max-width: 600px) {

  i.fas.fa-times.featuredPopupModalCloseIcon,
  i.fas.fa-times.featuredPopupModalCloseIcon.advertisement {
    margin-top: 20px;
    margin-left: 50px;
    width: 240px;
  }

  .dropDownShadow {
    width: 100%;
  }

  .dropDownShadowParking {
    margin-left: -7px;
    width: 103%;
  }

  .selectedShopDineCatTitle {
    transform: translate(-50%, -200%);
  }

  .memberAccTitleWrapper.mobileShow {
    transform: translate(-50%, -140%);
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 30%;
  }

  .kidMembershipWrapper {
    width: 100%;
    display: unset;
    margin: 0;
  }

  .kidsClubCardWrapper {
    margin: 0;
  }

  .halfContainer.rewardContainer .detailsContainer:nth-child(3) {
    padding-bottom: 24px;
  }

  .featurePopupDialog {
    max-width: 410px !important;
    background-color: transparent;
  }

  .featurePopupDialog.advertisement {
    max-width: 310px !important;
  }

  .featurePopupTitle,
  .campaignTitleContent h1 {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 27px;
  }

  .featurePopupDesc,
  .campaignTitleContent p,
  .campaignTitleContent ul,
  .campaignTitleContent ol,
  .campaignTitleContent li {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.25px;
    line-height: 24px;
  }

  .featurePopupDialogWrapper .swiper-container {
    overflow: hidden;
  }

  .featurePopupSlide.swiper-slide {
    max-height: 80vh;
    overflow: hidden;
  }

  .featurePopupSlide.swiper-slide.advertisement {
    width: 100%;
    max-height: 80vh;
    overflow: hidden;
  }

  .featurePopupDetails {
    max-width: 100%;
    overflow: visible;
  }

  .featurePopupDialogDontShowWrapper p {
    width: auto !important;
    flex: 1;
  }

  .touristPrivilegesDescWrapper {
    display: flex;
    flex-direction: column-reverse;
  }

  .touristPrivilegesContainer,
  .touristPrivilegesImageContainer {
    width: 100%;
  }

  .priviligeCardImage {
    margin-bottom: 24px;
  }

  .touristPrivilegesContainer {
    padding-right: 0;
  }

  .happeningPostContent,
  .pressRoomPostContent,
  .promotionPageTypeTabContent .promotionDesc {
    height: 56px;
    -webkit-line-clamp: 2;
  }

  .promotions .promotionsTabContainer .promotionContainer .promotionDesc {
    display: -webkit-box;
    height: 56px;
    -webkit-line-clamp: 2;
  }

  .mainTouristPrivilegesContainer .promotionPageTypeTabContent p.promotionDesc {
    height: 56px;
    -webkit-line-clamp: 2;
  }

  i.fas.fa-times.featuredPopupModalCloseIcon,
  i.fas.fa-times.featuredPopupModalCloseIcon.advertisement {
    margin-top: 20px;
    margin-left: 150px;
    width: 240px;
  }

  .featurePopupWrapper {
    line-height: normal;
  }

  .privillegeCell h5 {
    font-size: 18px;
    line-height: 20px;
  }

  .earnVrPointsImageContainer img {
    max-width: 100vw;
    height: 100%;
  }

  #featuredPopupModal.modal {
    align-items: center;
  }

  .nav-btn {
    top: 40%;
  }

  .modal-content {
    width: 100%;
    height: min-content;
    overflow: visible;
    margin: auto auto 25%;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: inherit;
  }

  .modal-content.advertisement {
    width: min(80vw, calc(((80vh - 80px)/ 16*9)));
  }

  .featurePopupDialogDontShowWrapper {
    bottom: -80px;
  }

  .featurePopupSlide {
    width: 80vw;
    height: 100%;
    max-height: 70vh;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  .adsWrapper {
    padding-top: 177.65%;
    position: relative;
  }

  .featurePopupSlide.advertisement {
    width: min(80vw, calc(((80vh - 80px)/ 16*9)));
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    max-height: none;
  }

  .featurePopupVideo {
    top: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    max-height: none;
    border-radius: 14px 14px 0px 0px;
  }

  .featurePopupImage.advertisement {
    top: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    aspect-ratio: auto !important;
    max-height: none;
    border-radius: 14px 14px 0px 0px;
  }

  .featurePopupImage {
    border-radius: 14px 14px 0px 0px;
  }

  .aboutVivoRewardsGetStartedTableCell .cellText {
    padding: 50px 16px;
  }

  .singleStorePostPayment,
  .singleStorePostPoints {
    margin-right: 0;
    width: 100%;
  }

  .singleStorePostPayment .typeWrapper,
  .singleStorePostPoints .typeWrapper {
    justify-content: flex-start;
  }

}

@media (max-width: 550px) {

  .promotionsPage div#store_promotions .promotionPost,
  .promotionsPage div#kids_club_offers .promotionPost,
  .promotionsPage .touristPrivilegesCatWrapper .promotionPost {
    width: 100%;
    margin: 0;
  }

  .promotionPageTypeTabContent .promotionDesc,
  .promotionsPage div#kids_club_offers .promotionDesc {
    height: 86px;
    -webkit-line-clamp: 3;
  }

  div#store_promotions .promotionPageTypeTabContent {
    margin: 0;
  }

  .promotionsPage .touristPrivilegesCatWrapper .promotionPost {
    margin-bottom: 12px;
    width: 100%;
    padding-top: 200%;
    margin: 0 0 12px 0;
  }

  .promotionsPage div#kids_club_offers .promotionPost,
  .promotionsPage div#kids_club_birthday_offers .promotionPost {
    width: 100%;
    margin: 0 0 15px 0;
  }

  .rewardsCatContent:not(.algoliaItem),
  .ais-Hits-item {
    width: 100%;
  }

  .rewardsCatContent:not(.algoliaItem):nth-child(2n + 1),
  .ais-Hits-item:nth-child(2n + 1) {
    margin-right: 0;
  }

  /* .rewardsCatContent:not(.algoliaItem):nth-child(3n+2), .ais-Hits-item:nth-child(3n+2) {
  margin: 0;
  } */

  .rewardsCatContent:not(.algoliaItem):nth-child(4n) {
    margin-right: 0;
  }

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText {
    padding: 0;
  }

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText>*,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText>* {
    display: block;
    width: 100% !important;
  }

  /* #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .imgContainer, #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .imgContainer {
  padding-bottom: 22px;
  } */

  #about_vivorewards .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer,
  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText .textContainer {
    padding-top: 22px;
    padding-right: 0;
  }

  #getting_started .aboutVivoRewardsImgTextContainer .aboutVivoRewardsImgText.greyBox {
    padding: 25px 15px;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer img.stepImg,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer img.stepImg {
    display: none;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep.firstStep .imgContainer .stepHeader,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep.firstStep .imgContainer .stepHeader {
    width: 120px;
    max-width: unset;
    top: -48px;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer {
    padding-left: 56px;
    width: 100%;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer .stepImg,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer .stepImg {
    display: block;
    margin: auto;
    height: 180px;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .textContainer p {
    padding-top: 24px;
    text-align: center;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer {
    position: absolute;
    height: 100%;
    padding-right: 24px;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep {
    position: relative;
    padding-bottom: 40px;
  }

  #earning_rewards .redeemRewardStepContainer,
  #using_rewards .redeemRewardStepContainer {
    padding-top: 48px;
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .stepNum,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep .imgContainer .stepNum {
    top: calc(90px - 18.5px);
  }

  #earning_rewards .redeemRewardStepContainer .redeemRewardStep.lastStep .imgContainer .dashedLine,
  #using_rewards .redeemRewardStepContainer .redeemRewardStep.lastStep .imgContainer .dashedLine {
    height: 90px;
  }
}

@media (max-width: 520px) {
  #promotions_calendar span.previous {
    right: calc(50% + 180px) !important;
  }

  div#promotions_calendar .wrapper:nth-child(3) {
    vertical-align: middle;
    width: 360px;
    float: none;
    overflow: hidden;
    margin: 0 auto;
  }

  #promotions_calendar span.nextcall {
    left: calc(50% + 180px) !important;
    z-index: 1;
    margin-top: 26px;
    right: unset;
  }

  .dropDownShadowParking {
    width: 106%;
  }

  /* #footer .downlaodWrapper p {
  max-width: 300px;
  } */

  .dbCessationContainer {
    margin: 20px 16px 40px 16px;
    padding: 20px;
  }
}

@media (max-width: 500px) {

  /*Search*/
  .ais-Hits-item,
  .ais-InfiniteHits-item,
  .ais-InfiniteResults-item,
  .ais-Results-item {
    width: 100%;
  }

  /*End Search*/
  .happeningPostWrapper,
  .mainTouristPrivilegesContainer .promotionPost {
    width: 100%;
    margin-right: 16px;
  }

  .mainTouristPrivilegesContainer .blackLine {
    margin: 28px 0 40px 0;
  }

  .promotionsPage div#tourist_privileges {
    padding: 40px 8px 16px 8px;
  }

  .promotions .promotionsContent {
    padding-bottom: 0 !important;
  }

  .touristPrivilegesDescWrapper,
  .touristPrivilegesCatWrapper {
    padding: 0;
  }

  .touristPrivilegesCatWrapper .touristPrivilegesCatMenuTabContent {
    margin: 0 0 64px 0;
  }

  div#store_promotions .promotionPageTypeTabContent {
    padding-top: 0;
    margin: 0;
  }

  .smallHappeningBox {
    font-size: 16px;
    line-height: 28px;
    font-family: "Rubik", sans-serif;
    font-weight: 300;
    color: var(--color-text);
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin-top: 0px;
  }

  div#mall_promotions,
  div#whats_new,
  div#new_stores {
    margin-left: 0;
    padding-top: 0;
    padding-bottom: 0;
  }

  div#atrium_events {
    padding-bottom: 78px;
  }

  #atrium_events .happeningPostContentWrapper {
    padding: 0;
    background-color: var(--color-white);
    height: 100%;
  }

  /*Home Promotion*/
  .promotions .promotionsTabContainer {
    padding-bottom: unset;
    padding-top: unset;
  }

  .promotionsTabContainer .promotionContainer {
    font-size: 0;
    padding: 0 8px;
  }

  .promotionsTabContainer .promotionContainer .promotionPost {
    margin: 0;
    margin-bottom: 24px;
  }

  .promotionsTabContainer .promotionContainer .promotionPost {
    width: 100%;
    padding-top: 100%;
    height: auto;
  }

  .promotionsTabContainer .promotionContainer .promotionContent {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin-top: -100%;
  }

  .promotionContainer .promotionDetailsContainer {
    position: relative;
    width: 100%;
    padding-top: 0;
  }

  .promotionsTabContainer .promotionContainer .promotionDetailsBox {
    padding: 24px 16px 40px;
    position: unset;
  }

  li.selectedkidsClubOffer,
  li.selectedkidsClubBirthdayOffer {
    font-size: 14px;
    line-height: 17px;
    padding: 10px 16px 5px 16px;
  }

  p.earningBtn.tabBtn:nth-child(2) {
    max-width: 103px;
    padding-right: 0;
    margin-right: 0;
  }

  p.earningBtn.tabBtn {
    display: inline-block;
    width: unset;
    border-bottom: unset;
    vertical-align: bottom;
    margin-right: 40px;
    max-width: unset;
    padding: 0;
  }

  p.earningBtn.tabBtn:last-of-type {
    padding: 0 40px 0 0;
  }

  p.signUpBtn.tabBtn:last-of-type {
    margin-right: -10px;
  }

  p.signUpBtn.tabBtn {
    margin-right: 10px;
  }

  .loginModalContent {
    padding: 16px 16px 24px;
  }

  .loginModalFooter {
    padding: 0 16px 32px;
  }

  .loginModalContent label {
    padding-bottom: 8px;
  }

  .loginModalContent input {
    line-height: 20px;
    margin-bottom: 24px;
  }

  .earningStepsImgWrapper {
    padding: 0;
  }

  .stepsImgWrapper {
    padding-top: 50%;
  }

  .stepsRegisterDescContainer {
    padding-top: 50%;
  }

  .newsletterModalContent {
    padding: 40px 24px;
  }

  .newsletterModalContent button.dropdown-toggle {
    padding: 10px 10px;
  }

  .selectedShopDineCatTitle {
    transform: translate(-50%, -200%);
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 35%;
  }

  .happeningPostContent,
  .pressRoomPostContent,
  .promotionPageTypeTabContent .promotionDesc,
  .promotionsPage div#kids_club_offers .promotionDesc,
  .promotionsPage div#tourist_privileges .promotionDesc {
    height: 60px;
    -webkit-line-clamp: 3;
  }

  .promotions p.readmore {
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.75px;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    transform: translateY(0%);
    padding: 16px;
    text-transform: uppercase;
  }

  .guideListContent .tooltip:hover .tooltipText,
  .singleStorePostContentWrapper .tooltip:hover .tooltipText,
  .guideListThumbnail .tagSection .kidsClubStoreTagWrapper:hover .tooltipText,
  .guideListThumbnail .tagSection .hasPromotionTagWrapper:hover .tooltipText,
  .newStoreCornerWrapper:hover .tooltipText,
  .kidsClubStoreTagWrapper:hover .tooltipText,
  .dbsStoreTagWrapper:hover .tooltipText,
  .halalStoreTagWrapper:hover .tooltipText,
  .dbsStoreTagWrapper:hover .tooltipText,
  .hasPromotionTagWrapper:hover .tooltipText,
  .touristStoreTagWrapper:hover .tooltipText {
    visibility: none;
    display: none;
  }


}

@media (max-width: 460px) {

  .featurePopupDialog {
    max-width: 310px !important;
    max-height: 90vh;
  }

  .featurePopupDialogWrapper .swiper-container {
    width: 300px !important;
  }

  /*
  .featurePopupDetails {
  overflow: auto;
  max-height: 100px;
  } */

  div#promotions_calendar .wrapper:nth-child(3) {
    width: 300px;
  }

  #promotions_calendar span.previous {
    right: calc(50% + 150px) !important;
  }

  #promotions_calendar span.nextcall {
    left: calc(50% + 150px) !important;
  }

  .editProfileSuccess,
  .newsletterSuccess,
  .enquirySuccess,
  .feedbackSuccess {
    padding: 40px 24px;
  }

  .featurePopupImage {
    height: 100%;
  }

  i.fas.fa-times.featuredPopupModalCloseIcon,
  i.fas.fa-times.featuredPopupModalCloseIcon.advertisement {
    margin-top: 20px;
    margin-left: 50px;
    width: 240px;
  }

  #featuredPopupModal.modal {
    overflow: hidden;
  }
}

@media (max-width: 425px) {
  .selectedShopDineCatTitle {
    transform: translate(-50%, -180%);
  }

  .stepsDescWrapper .colorLine {
    width: 40px;
    height: 3px;
    margin: 12px 0;
    background-color: var(--color-border-strong);
  }

  .stepsRegisterContainer .stepsDescWrapper p {
    font-size: 13px !important;
    line-height: 18px !important;
  }

  div#sign_up_vivo_rewards .stepsDescWrapper h3 {
    font-size: 16px;
    line-height: 20px;
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 45%;
  }

  .loginModalFooter p {
    width: unset;
    margin-left: 0;
    padding-top: 20px;
  }

  .downloadBtnWrapperLoginModal a.AndroidBtn img {
    margin-left: 0;
  }

  .loginModalFooter {
    background-size: cover;
  }

  /* #footer .downlaodWrapper p {
  max-width: 220px;
  } */
}

@media (max-width: 400px) {
  div#promotions_calendar .wrapper:nth-child(3) {
    width: 240px;
  }

  #promotions_calendar span.previous {
    right: calc(50% + 120px) !important;
  }

  #promotions_calendar span.nextcall {
    left: calc(50% + 120px) !important;
  }

  .selectedShopDineCatTitle {
    transform: translate(-50%, -100%);
  }

  .nextCatBtn p.prevBackBtn.mobileShow {
    display: flex !important;
    flex-direction: column-reverse;
  }

  .prevCatBtn i.fa.fa-arrow-left {
    padding-bottom: 8px;
  }

  .nextCatBtn i.fa.fa-arrow-right {
    display: block;
    padding-bottom: 8px;
  }

  .loginModalContent .forgotPasswordBtn {
    max-width: 150px;
  }

  p.prevBackBtn.mobileShow span {
    display: block;
  }

  .memberAccTitleWrapper.mobileShow {
    transform: translate(-50%, -100%);
  }

  /*.tooltip-bottom {
  left: 38%;
  top: 140%;
  }

  .tooltip-bottom::after {
  left: 22%;
  border-width: 7px;
  }*/
}

/*@media (max-width: 380px) {
h3.gettingHereTitle {
padding-left: 0 !important;
}
}*/

@media (max-width: 376px) {
  p.signUpBtn.tabBtn:last-of-type {
    margin-right: -10px;
    max-width: 160px;
  }

  p.signUpBtn.tabBtn:last-of-type span:after {
    width: 65%;
  }

  .participatingStoreWrapper {
    width: calc(100vw - 48px);
  }

  .participatingStoreWrapper .swiper-container {
    width: 100%;
  }

  .participatingStoreWrapper .storeDetailsWrapper {
    overflow: auto;
    max-height: 210px;
  }

  .memberInfoWrapper.memberInfoWrapper input[type="submit"] {
    width: 50%;
  }

  .memberAccTitleWrapper.mobileShow {
    transform: translate(-50%, -100%);
  }

  p.exchangeTitle.exchangeColumn {
    max-width: 130px;
  }

  .exchangeRow {
    text-align: center;
  }

  .newsletterModalContent .birthdateField .dateSelection {
    padding-right: 14px;
  }

  .newsletterModalContent .birthdateField .yearSelection {
    padding-left: 14px;
  }

  .newsletterModalContent {
    padding: 40px 16px;
  }
}

@media (max-width: 350px) {
  .promotionPageTypeTabContent .promotionDesc {
    height: 56px;
    -webkit-line-clamp: 2;
  }

  .perksHeaderContainerMobile {
    height: 200px;
  }
}

@media (max-width: 320px) {
  span.notAllCatogeries {
    font-size: 11px;
    line-height: 24px;
  }

  .memberAccTitleWrapper.mobileShow {
    transform: translate(-50%, -80%);
  }
}

@media screen and (max-width: 375px) {

  .featurePopupImage {
    height: 50vh;
  }

  .privillegeCell h5 {
    font-size: 14px;
    line-height: 16px;
  }

  .aboutVivoRewardsGetStartedTableCell .cellImage.smallIcon {
    padding: 169px 24px;
  }

  .aboutVivoRewardsGetStartedTableCell .cellText {
    padding: 30px 16px;
  }
}


@media screen and (max-width: 320px) {
  .privillegeCell h5 {
    font-size: 12px;
    line-height: 14px;
  }
}

.close-btn {
  color: #ffffff !important;
  font-size: 12px !important;
  position: absolute;
  z-index: 99999;
  text-align: right;
  top: 10px;
  right: 12px;
  border-radius: 50%;
  text-align: center;
  padding: 5px 0;
  opacity: 1;
}

.close-btn img {
  height: 24px;
  width: 24px;
  pointer-events: none;
  /* Standard property */
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.faqStepImageWrapper {
  display: flex;
  padding: 32px;
  justify-content: space-evenly;
}

.faqSubsectionTitle {
  padding: 25px 0;
  text-decoration: underline;
}

#dice-box,
#dice-box canvas {
  /* position: absolute; */
  pointer-events: none;
  z-index: 100;
  width: 100vw;
  /* 80% of the viewport width */
  height: 100%;
  margin: auto;
}

.mainDiceContainer {
  display: flex;
  position: relative;
  width: 100vw;
  height: calc(100vh - 220px);
  padding: 16px 0;
  flex-grow: 1;
  /* Standard property */
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.rollDiceSection {
  /* margin-top: 40px; */
  margin-bottom: 50px;
  display: flex;
  flex-direction: column;
  padding: 0 16px;
}

.rollDiceSection.insideModal {
  flex-direction: column;
  width: 100%;
  padding: 0 16px;
  margin-bottom: 0;
  margin-top: 0;
}

.rollDiceBtn {
  background-color: #FF6CBD;
  padding: 8px 20px;
  width: 100%;
  opacity: 1;
  border-radius: 0;
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.rollDiceBtn:disabled,
.rollDiceBtn:hover {
  background-color: #FF6CBD;
  opacity: 0.5;
}

.rollDiceBtnLabel {
  color: #ffffff;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 24px;
}

.rollDiceResultCard {
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: hidden;
  /* border-radius: 14px; */
  width: min(calc(100vw - 32px), 400px);
  height: calc(100vh - 92px);
  background-color: white;
}

@supports (height: 100dvh) {
  .rollDiceResultCard {
    height: calc(100dvh - 92px);
  }

  .mainDiceContainer {
    height: calc(100dvh - 250px);
  }
}

.rollDiceResultCard .imageWrapper {
  position: relative;
  height: auto;
  width: 100%;
  flex: 0 0 50%;
}

.rollDiceResultCard .contentWrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  height: auto;
  width: 100%;
  padding: 16px;
  flex-grow: 1;
  overflow-y: auto;
}

.rollDiceResultCard .contentWrapper #monopolyCardTitle {
  color: #242424;
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: -0.25px;
  line-height: 28px;
  margin-bottom: 12px;
}

.rollDiceResultCard .contentWrapper #monopolyCardContent {
  display: block;
  max-width: 100%;
  height: auto;
  color: #242424;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 24px;
  overflow-y: auto;
  /* Use auto for smoother behavior */
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}

.rollDiceResultImage {
  height: 100%;
  width: 100%;
  max-width: 720px;
  object-fit: cover;
  pointer-events: none;
  /* Standard property */
  user-select: none;
  /* Safari/Chrome */
  -webkit-user-select: none;
  /* Internet Explorer/Edge */
  -ms-user-select: none;
}

.rollDiceResultLink {
  padding: 12px 0 16px;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.25px;
  line-height: 24px;
}

.mainRollerContainer {
  margin: auto;
  height: 50vw;
  width: 50vw;
  text-align: center;
  padding-top: calc(40vh - 80px);
}

.rollDiceTitle {
  color: #fff;
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: -0.75px;
  line-height: 32px;
  margin-top: 32px;
  text-align: center;
  padding: 0 16px;
}

@media (max-width: 768px) {
  .rollerMainBg {
    background-image: url('https://cloudinary.alphapod.com/alphapod/image/upload/v1734402822/Vivocity/Website%202024/Images/CNY_2025_Game_App_Background_V1.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    position: fixed;
    height: 100%;
  }

  .modal-content {
    height: min-content;
    width: 80vw;
  }

  .modal-content.roller-dice {
    margin: 16px;
    background-color: transparent;
  }
}

#rollResultModal.modal {
  top: 60px;
  justify-content: center;
}

.rollDiceCopyright {
  color: #fff;
  font-family: "Inter", sans-serif;
  font-size: 8px;
  font-weight: 500;
  letter-spacing: -0.25px;
  line-height: 16px;
  text-align: right;
}

.rollDiceSecondaryTitle {
  color: #fff;
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: normal;
  letter-spacing: -0.75px;
  line-height: 24px;
  text-align: center;
  padding: 0 16px 8px;
}

span i#iconDropdown {
  transition: transform .25s ease;
}

span i#iconDropdown.rotated {
  transform: rotate(180deg);
}

/* Tourist page background images */
.tourist-bg-services-wifi {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677650148/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_services_wifi.jpg");
}

.tourist-bg-services-charger {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1706849443/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_services_charger.jpg");
}

.tourist-bg-services-coach {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771236941/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_thumb-tourist-coach_drop_off2x.png");
}

.tourist-bg-services-money {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771236943/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_thumb-tourist-money_changing2x.png");
}

.tourist-bg-about-retail {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1679300792/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_about_carousels_1.jpg");
}

.tourist-bg-leisure-promenade {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739386/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-5.jpg");
}

.tourist-bg-leisure-skypark {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739386/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-6.jpg");
}

.tourist-bg-leisure-amphitheatre {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739386/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-7.jpg");
}

.tourist-bg-art-aphrodite {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739387/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-13.jpg");
}

.tourist-bg-art-flower-tree {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739389/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-8.jpg");
}

.tourist-bg-art-gogo {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739386/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-9.jpg");
}

.tourist-bg-art-snowman {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739386/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-10.jpg");
}

.tourist-bg-art-snowflakes {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739387/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-11.jpg");
}

.tourist-bg-art-mirror {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1694598990/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-15.jpg");
}

.tourist-bg-art-tun-sheep {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739387/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-12.jpg");
}

.tourist-bg-sentosa {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good,b_rgb:FAFAFA/v1677739387/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_tourists-14.jpg");
}

/* About us page services images */
.about-bg-retail-carousel {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1679300792/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_about_carousels_1.jpg");
}

.about-bg-mapletree {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1677650146/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_mapletree.png");
}

.about-bg-services-wifi {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1677650148/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_services_wifi.jpg");
}

.about-bg-services-charger {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1706849443/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_services_charger.jpg");
}

.about-bg-services-voucher {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1681975001/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_services_voucher.jpg");
}

.about-bg-services-nursing {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1771236940/Vivocity/Vivocity%20Revamp%202026/Images/2x/img_thumb-about-nursing_rooms2x.png");
}

.about-bg-services-wheelchair {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/q_auto:good/v1681973740/Vivocity/Website%20Revamp%202023/Assets/Images/xhdpi/img_thumb_services_wheelchair.jpg");
}

.about-bg-services-pet-policy {
  background-image: url("https://cloudinary.alphapod.com/alphapod/image/upload/v1770605596/Vivocity/Vivocity%20Revamp%202026/Images/2x/VC_Pet_Policy_Thumbnail.png");
}

/* Homepage GSAP transition banner */
.homepage-transition-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  width: 100vw;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background-color: #FFFAF0;
  will-change: clip-path;
}

.homepage-transition-modal,
.homepage-transition-modal .gsap-transition--banner {
  background-image: var(--waves-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #FFFAF0;
}

@media (max-width: 767px) {

  .homepage-transition-modal,
  .homepage-transition-modal .gsap-transition--banner {
    background-image: var(--waves-bg-mobile, var(--waves-bg));
  }
}

body.homepage-transition-modal-open {
  overflow: hidden;
}

@media (max-width: 1000px) {
  body.homepage-transition-modal-open #footer .footerMobile {
    display: none !important;
  }
}

.logoGroup {
  display: flex;
  align-items: center;
  gap: 12px;
}

.headerLogoDivider {
  width: 1px;
  height: 40px;
  background: rgba(15, 36, 53, 0.22);
}

.headerTransitionLogo {
  height: 56px;
  width: auto;
  border: 0;
  background: transparent;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.headerTransitionLogoImage {
  display: block;
  width: auto;
  height: 100%;
  object-fit: contain;
}

.gsap-years-counter {
  display: inline-flex;
  min-width: 1.86ch;
  padding: 0;
  overflow: hidden;
  line-height: 1;
  vertical-align: middle;
  align-items: center;
  justify-content: center;
  position: relative;
  top: -0.02em;
  gap: 0;
}

.gsap-years-digit {
  display: inline-flex;
  width: 0.9ch;
  min-width: 0.9ch;
  height: 1em;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  line-height: 1;
  flex: 0 0 0.9ch;
  will-change: transform, opacity;
}

.gsap-years-digit-layer {
  position: absolute;
  inset: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  pointer-events: none;
  transform: translate3d(0, 0, 0);
  line-height: 1;
  background-repeat: no-repeat;
  background-size: 200% 100%;
  -webkit-background-clip: text !important;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

.gsap-years-digit[data-year-tens] .gsap-years-digit-layer {
  background-image: linear-gradient(to right,
      var(--color-magenta) 0%,
      var(--color-magenta) 5%,
      var(--color-accent) 55%,
      var(--color-accent) 100%) !important;
  background-position: 0% 0;
}

.gsap-years-digit[data-year-ones] .gsap-years-digit-layer {
  background-image: linear-gradient(to right,
      var(--color-magenta) 0%,
      var(--color-magenta) 5%,
      var(--color-accent) 55%,
      var(--color-accent) 100%) !important;
  background-position: 100% 0;
}

.gsap-years-digit-reel {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  will-change: transform;
}

.gsap-years-digit-reel .gsap-years-digit-layer {
  position: relative;
  inset: auto;
  height: 1em;
  min-height: 1em;
  flex: 0 0 1em;
}

.gsap-transition--banner .gsap-transition--text.text-wrapper {
  top: 50%;
  bottom: auto;
  transform: translate(-50%, -50%);
  overflow: hidden;
  isolation: isolate;
  padding-bottom: 0.28em;
}

.gsap-transition--banner .gsap-transition--text.text-wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0;
  background: transparent;
  pointer-events: none;
  z-index: 3;
}

.gsap-transition--banner .gsap-transition--text.text-wrapper>* {
  position: relative;
  z-index: 2;
}

.gsap-memory-collage {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

.gsap-memory-collage__item {
  position: absolute;
  width: clamp(160px, 17vw, 240px);
  height: auto;
  object-fit: cover;
  opacity: 0;
  visibility: hidden;
  box-shadow: 0 10px 22px rgba(15, 36, 53, 0.15);
}

.gsap-memory-collage__item--1 {
  top: 13%;
  left: 7%;
  width: clamp(130px, 11.5vw, 220px);
}

.gsap-memory-collage__item--2 {
  top: 2%;
  left: 28%;
  width: clamp(180px, 16.5vw, 300px);
}

.gsap-memory-collage__item--3 {
  top: 9%;
  right: 23%;
  width: clamp(180px, 16.5vw, 290px);
}

.gsap-memory-collage__item--4 {
  top: 3%;
  right: 4%;
  width: clamp(150px, 12.5vw, 250px);
}

.gsap-memory-collage__item--5 {
  top: 27%;
  right: -0.5%;
  width: clamp(120px, 10.5vw, 180px);
}

.gsap-memory-collage__item--6 {
  top: 53%;
  left: 0%;
  bottom: auto;
  width: clamp(160px, 14vw, 230px);
}

.gsap-memory-collage__item--7 {
  bottom: 2%;
  left: 19%;
  width: clamp(200px, 20vw, 360px);
}

.gsap-memory-collage__item--8 {
  bottom: 5%;
  left: 58%;
  width: clamp(150px, 15vw, 240px);
}

.gsap-memory-collage__item--9 {
  bottom: 17%;
  right: 2.5%;
  width: clamp(160px, 16vw, 270px);
}


.animatedWrapper.words-hidden {
  display: none;
}

.animatedWrapper.words-locked .animatedTitle {
  opacity: 0;
  transform: translate3d(0, 0, 0) !important;
  animation: none !important;
}

.animatedWrapper.words-locked .animatedTitle:first-child {
  opacity: 1;
}

.animatedWrapper.words-locked .animatedTitle::before {
  animation: none !important;
  opacity: 0 !important;
}

.animatedWrapper.words-intro-hold .animatedTitle {
  opacity: 0;
  transform: translate3d(0, 0, 0) !important;
  animation: none !important;
}

.animatedWrapper.words-intro-hold .animatedTitle:first-child {
  opacity: 1;
}

.animatedWrapper.words-intro-hold .animatedTitle::before {
  animation: none !important;
  opacity: 0 !important;
}

.animatedWrapper.words-intro-sparkle .animatedTitle {
  opacity: 0;
  transform: translate3d(0, 0, 0) !important;
  animation: none !important;
}

.animatedWrapper.words-intro-sparkle .animatedTitle:first-child {
  opacity: 1;
}

.animatedWrapper.words-intro-sparkle .animatedTitle::before {
  animation: none !important;
  opacity: 0 !important;
}

.animatedWrapper.words-intro-sparkle .animatedTitle:first-child::before {
  animation: shimmerCycle 1.15s ease-in-out 1 !important;
}

/* Use a 4-word cycle (Excitement, Joy, Rewards, Indulgence) without blank gap. */
.animatedWrapper[data-year-words] .animatedTitle.animate {
  animation-duration: 8s !important;
}

.animatedWrapper[data-year-words] .animatedTitle.animate::before {
  animation-duration: 8s !important;
}

.animatedWrapper[data-year-words] .animatedTitle.animate {
  animation-delay: var(--word-rotate-delay, var(--word-delay, 0s)) !important;
}

.animatedWrapper[data-year-words] .animatedTitle.animate::before {
  animation-delay: var(--word-sparkle-delay, var(--word-delay, 0s)) !important;
}

.transitionSkipBtn {
  position: absolute;
  left: 50%;
  bottom: 6vh;
  transform: translateX(-50%);
  border: 0;
  background: transparent;
  color: #FF6CBD;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 10px;
  cursor: pointer;
  z-index: 10;
}

.transitionSkipBtnLabel {
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0.06em;
  font-weight: 700;
}

.transitionSkipBtnIcon {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  color: #FF6CBD;
}

.transitionSkipBtnIconImage {
  display: block;
  width: 24px;
  height: auto;
}

#homepageTransitionModal .transitionSkipBtn {
  gap: 12px;
}

#homepageTransitionModal .transitionSkipBtnIconImage {
  animation: transitionChevronFloat 2.4s cubic-bezier(0.42, 0, 0.58, 1) infinite;
  will-change: transform;
}

#homepageTransitionModal .animatedWrapper[data-year-words] .animatedTitle {
  overflow: hidden;
}

@keyframes transitionChevronFloat {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(4px);
  }
}

.transitionSkipBtn:disabled {
  opacity: 0.45;
  cursor: default;
}

@media (prefers-reduced-motion: reduce) {
  #homepageTransitionModal .transitionSkipBtnIconImage {
    animation: none;
  }
}

@media (max-width: 1000px) {
  .headerTransitionLogo {
    height: 36px;
    width: auto;
  }

  .logoGroup {
    gap: 8px;
  }

  .headerLogoDivider {
    height: 28px;
  }

  .transitionSkipBtn {
    bottom: calc(5vh + env(safe-area-inset-bottom, 0px));
  }

  .transitionSkipBtnLabel {
    font-size: 14px;
  }

  .transitionSkipBtnIcon {
    font-size: inherit;
  }

  .transitionSkipBtnIconImage {
    width: 24px;
  }
}

@media (max-width: 768px) {
  #homepageTransitionModal .transitionSkipBtnLabel {
    font-size: 12px;
  }

  #homepageTransitionModal .transitionSkipBtnIconImage {
    width: 18px;
  }

  .gsap-memory-collage__item {
    width: clamp(112px, 30vw, 170px);
  }

  .gsap-memory-collage__item--5 {
    width: clamp(92px, 25vw, 116px);
  }

  .gsap-memory-collage__item--2 {
    top: -1%;
    left: 20%;
  }

  .gsap-memory-collage__item--3 {
    top: 8%;
    right: 18%;
  }

  .gsap-memory-collage__item--4 {
    top: 1%;
    right: -1%;
  }
}

@media (max-width: 480px) {
  .gsap-memory-collage__item {
    width: clamp(84px, 30vw, 135px);
  }

  .gsap-memory-collage__item--1 {
    top: 2%;
    left: 23%;
    width: clamp(70px, 30vw, 90px);
  }

  .gsap-memory-collage__item--2 {
    top: 17%;
    left: 50%;
  }

  .gsap-memory-collage__item--3 {
    top: 20%;
    right: 72%;
  }

  .gsap-memory-collage__item--4 {
    top: 5%;
    right: -8%;
  }

  .gsap-memory-collage__item--5 {
    top: 70%;
    right: -4%;
    width: 90px;
  }

  .gsap-memory-collage__item--6 {
    top: 64%;
    left: -14%;
  }

  .gsap-memory-collage__item--7 {
    bottom: 15%;
    left: 15%;
    width: clamp(100px, 30vw, 135px);
  }

  .gsap-memory-collage__item--8 {
    bottom: 20%;
    left: 50%;
    width: clamp(80px, 30vw, 102px);
  }

  .gsap-memory-collage__item--9 {
    bottom: 16%;
    right: 2%;
    width: 135px;
    display: none;
  }


  .transitionSkipBtn {
    bottom: calc(32px + env(safe-area-inset-bottom, 0px));
  }

  #homepageTransitionModal .gsap-transition--banner .text-wrapper {
    padding: 24px 20px;
  }

  .gsap-transition--banner .gsap-transition__headline .gsap-headline-line {
    display: block;
  }

  .gsap-transition--banner .gsap-transition__headline .gsap-headline-line--years {
    white-space: nowrap;
  }

  .gsap-transition--banner .gsap-transition__headline br {
    display: none;
  }

  #homepageTransitionModal .gsap-transition--banner .gsap-transition__headline {
    font-size: 34px;
    line-height: 41px;
    letter-spacing: -1px;
  }

  .gsap-transition--banner .animatedWrapper[data-year-words] {
    height: 48px;
    margin-top: 0;
  }

  .animatedWrapper {
    height: 50px;
  }
}