@media screen and (max-width: 1280px) {
    #container #pages .pages_content.redeem .body .lists {
        width: 95%;
    }

    #container #pages .pages_content.redeem .body .lists .item {
        width: 29%;
        margin: 2.15%;
    }

}

@media screen and (max-width: 1024px) {
    ::-webkit-input-placeholder {
        /* WebKit, Blink, Edge */
        color: #000;
    }

    :-moz-placeholder {
        /* Mozilla Firefox 4 to 18 */
        color: #000;
        opacity: 1;
    }

    ::-moz-placeholder {
        /* Mozilla Firefox 19+ */
        color: #000;
        opacity: 1;
    }

    :-ms-input-placeholder {
        /* Internet Explorer 10-11 */
        color: #000;
    }

    ::-ms-input-placeholder {
        /* Microsoft Edge */
        color: #000;
    }

    #container.member_info #left-nav.inactive .load-section.show {
        opacity: 0;
        height: 0;
        padding-top: 0;
    }

    #mobileWhiteBg {
        background-color: rgba(255, 255, 255, 0.8);
        width: 100%;
        height: 100%;
        position: absolute;
        top: 70px;
        -webkit-transition: all .5s ease-out;
        -moz-transition: all .5s ease-out;
        -o-transition: all .5s ease-out;
        transition: all .5s ease-out;
    }

    #container.member_login #left-nav.inactive .load-section {
        height: 0;
        padding-top: 0;
    }

    #container.member_info #left-nav.inactive,
    #container.member_info #left-nav.inactive #mobileWhiteBg,
    #container.subpage #left-nav.inactive,
    #container.subpage #left-nav.inactive #mobileWhiteBg {
        /* width: 100%; */
        height: 0;
    }

    #left-nav.login-open #mobileWhiteBg {
        width: 50%;
    }

    #container #left-nav .left-nav-footer .lang-bar,
    #container #left-nav .left-nav-footer .social-media {
        margin-left: 0;
    }

    #container #main #header .site-logo {
        opacity: 0;
    }

    #container #left-nav .top .site-logo {
        width: 30%;
        max-width: 100px;
        min-width: 100px;
        left: 0;
        right: 0;
        margin: 0 auto;
        margin-left: ;
    }

    #container #left-nav .nav-bar {
        /* float: left; */
        /* left: 0; */
        /* opacity: 0; */
        /* position: absolute; */
        /* visibility: hidden; */
        /* z-index: 1; */
        /* -webkit-transition: all .25s ease; */
        /* -moz-transition: all .25s ease; */
        /* -ms-transition: all .25s ease; */
        /* -o-transition: all .25s ease; */
        /* transition: all .25s ease; */
    }

    #container #left-nav .nav-bar.open {
        opacity: 1;
        top: 50px;
        visibility: visible;
    }

    #container #left-nav .top {
        width: 100%;
        padding-bottom: 10px;
        padding-top: 10px;
        padding-left: 0;
    }

    #container #main .content-box #status {
        width: 50%;
        /* height: 100%; */
        /* z-index: 99; */
        left: -50%;
    }

    #mobile-left-nav-groupLogo {
        width: 140px;
    }

    #container #left-nav .join-our-club .table-desc .wrapper .btn-navLogin {
        visibility: visible;
        opacity: 1;
    }

    #container #main #header .site-logo {
        max-width: 176px;
        top: 26px;
        /* transition-delay: .5s; */
        width: 45%;
        margin-right: 10px;
    }

    #container.member_info #main .content-box #status {
        width: 100%;
        left: 0;
        height: 50px;
        z-index: 99999;
    }

    #container.member_info #mNav,
    #container.subpage #mNav {
        display: block;
        width: 30px;
        height: 20px;
        position: absolute;
        top: 0;
        left: 15px;
        bottom: 0;
        margin: auto 0;
        cursor: pointer;
    }

    #mNav > span {
        width: 30px;
        height: 2px;
        display: block;
        background: #000;
        position: absolute;
        left: 0;
        top: 10px;
        margin-bottom: 10px;
        transition: all 0.3s;
        transform: rotate(0deg);
    }

    #left-nav.inactive #mNav > span.mNavtop {
        transform: translateY(-9px);
        -ms-transform: translateY(-9px);
        -webkit-transform: translateY(-9px);
        -moz-opacity: translateY(-9px);
    }

    #left-nav.inactive #mNav > span.mNavmiddle {
        background-color: #000;
    }

    #left-nav.inactive #mNav > span.mNavbottom {
        transform: translateY(9px);
        -ms-transform: translateY(9px);
        -webkit-transform: translateY(9px);
        -moz-opacity: translateY(9px);
        margin-bottom: 0;
    }

    #left-nav #mNav > span.mNavtop {
        transform: rotate(-45deg) translateY(0px);
        -ms-transform: rotate(-45deg) translateY(0px);
        -webkit-transform: rotate(-45deg) translateY(0px);
        -moz-opacity: rotate(-45deg) translateY(0px);
    }

    #left-nav #mNav > span.mNavbottom {
        transform: rotate(45deg) translateY(0px);
        -ms-transform: rotate(45deg) translateY(0px);
        -webkit-transform: rotate(45deg) translateY(0px);
        -moz-opacity: rotate(45deg) translateY(0px);
    }

    #left-nav #mNav > span.mNavmiddle {
        background: rgba(255, 255, 255, 0);
    }

    .mobile-group-logo {
        visibility: visible;
        opacity: 1;
        right: 10px;
        position: relative;
        max-width: 176px;
        top: 26px;
        transition-delay: .5s;
        width: 100px;
        left: 0;
    }

    #container.member_info #left-nav .left-nav-footer .mobile-group-logo {
        left: 24px;
    }

    #container #main {
        width: 100%;
        margin-left: 0;
    }

    #container #main.signup-open {
        width: 100%;
        margin-left: 0;
        opacity: 0.5;
    }

    #container #main .content-box #pages {
        width: 100%;
        margin-left: 0;
        position: relative;
        height: auto;
    }

    body.show[data-page='contact_us'] #container #main .content-box #pages {
        height: 100vh;
        /* height: -webkit-fill-available;*/
    }

    #container.mNavOpen #left-nav {
        background-color: rgba(255, 255, 255, 0.6);
    }

    #container #left-nav {
        width: 100%;
        background-color: rgba(255, 255, 255, 0.9);
        /* background-color: transparent; */
    }

    #container #left-nav.signup-open {
        width: 100%;
    }

    #container #left-nav.login-open {
        width: 100%;
    }

    #container #left-nav.login-open .join-our-club .table-desc .wrapper .btn-signup {
        margin-bottom: 17px;
    }

    #container #left-nav.login-open .join-our-club .table-desc .wrapper .btn-navLogin {
        display: none;
    }

    #container #main.login-open .content-box #status {
        left: 50%;
        width: 50%;
        z-index: 99999;
        background-color: rgba(0, 0, 0, 0.8);
    }

    #container #status .member-login {
        /* margin: 90px 15px 0; */
    }

    #main.login-open #memberLoginCloseBtn {
        display: block;
    }

    #container #left-nav .join-our-club .table-desc .wrapper .btn-signup,
    #container #left-nav .join-our-club .table-desc .wrapper .btn-navLogin {
        display: block;
    }

    #container #left-nav .join-our-club .title {
        text-align: left;
    }

    #container #left-nav .join-our-club .table-desc .wrapper .sub-title {
        text-align: left;
    }

    #container #left-nav .join-our-club .table-desc .wrapper {
        margin: 0;
        /* min-height: 300px; */
        width: 90%;
    }

    #container #left-nav .join-our-club {
        margin-left: 7%;
        width: 93%;
        -webkit-transition: all .5s ease-out;
        -moz-transition: all .5s ease-out;
        -o-transition: all .5s ease-out;
        transition: all .5s ease-out;
    }

    #container #left-nav .signup .form-box .input-group.selectionbox {
        width: 200px;
    }

    #container #left-nav .signup .form-box .agreement .txt {
        width: calc(100% - 34px);
    }

    #container #left-nav.login-open .join-our-club {
        width: 42%;
    }

    #status.info #pullDown {
        position: absolute;
        width: 20px;
        height: 20px;
        /* background-color: yellow; */
        right: 10px;
        top: 14px;
        cursor: pointer;
        background-image: url(./../img/arrow.png);
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transition: all .5s ease-out;
        -ms-transition: all .5s ease-out;
        -moz-transition: all .5s ease-out;
        -o-transition: all .5s ease-out;
        transition: all .5s ease-out;
        transform-origin: 50% 50%;
        -ms-transform-origin: 50% 50%;
        -webkit-transform-origin: 50% 50%;
        -moz-transform-origin: 50% 50%;
        background-size: 100%;
    }

    #status.info.fullinfo #pullDown {
        transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        transform-origin: 50% 50%;
        -ms-transform-origin: 50% 50%;
        -webkit-transform-origin: 50% 50%;
        -moz-transform-origin: 50% 50%;
    }

    #container #status.info #helloTxt,
    #container #status.info #nameTxt {
        display: inline-block;
        margin-bottom: 0px;
        line-height: 30px;
        /* float: left; */
    }

    #status.info .otherInfo {
        display: none;
    }

    #container #status .member-info {
        margin: 10px;
        height: 30px;
        text-align: left;
    }

    #container #status.info #helloTxt {
        margin-right: 15px;
    }

    #container #status .member-info .title,
    #container #status .member-info .name {
        display: inline-block;
        margin-bottom: 0;
    }

    #container #main .content-box #status.fullinfo {
        height: 100%;
    }

    #container #main .content-box #status.fullinfo .otherInfo {
        display: block;
        text-align: center;
        padding-top: 30px;
    }

    /* Redeem */
    #container #pages .pages_content.redeem {
        padding-top: 60px;
    }

    #container #pages .pages_content.redeem .body > .title {
        padding-left: 0;
        text-align: center;
    }

    #container #pages .pages_content.redeem .body .nav {
        width: 100%;
        min-width: initial;
        margin: 0;
    }

    #container #pages .pages_content.redeem .body .lists {
        width: 75%;
    }

    #lightbox {
        width: 100%;
        left: 0;
    }
}

@media screen and (min-width: 1234px) {
    #container #pages .pages_content.redeem .body .lists {
        /* max-width: 840px; */
    }
}

@media screen and (max-width: 1280px) {
    .shopTag {
        font-size: 1.1vw;
        margin-top: 6px;
    }

    .shopNo {
        font-size: 1.5vw;
    }

    #pageName {
        font-size: 35px;
    }

    #homeSlider {
        /* width: 60%; */
    }

    .bannerTag {
        font-size: 1.6vw;
        margin-bottom: 2%;
    }

    .bannerTitle {
        margin-bottom: 2.5%;
    }

    .bannerContent {
        font-size: 1.3vw;
        line-height: 1.5em;
    }

    .bannerBtn {
        padding: 0.8% 7%;
        font-size: 1.5vw;
    }
}

@media screen and (max-width: 1024px) {
    #container {
        /*        overflow: scroll;*/
    }

    .my_account .rightSection {
        position: fixed;
        /*        position: fixed;*/
        display: block;
        top: 0;
        width: 100%;
        height: 100vh;
        /*        min-height: 100%;*/
        /*        min-height: 100vh;*/
        background-position: bottom center;
        background-repeat: no-repeat;
        background-color: #1f1a14;
        background-size: 120vh;
    }

    .my_account .leftSection {
        background-color: transparent;
        /* padding: 0; */
        z-index: 99;
        padding: 0 2% 80px 2%;
        height: auto;
        position: relative;
        width: 100%;
    }

    .my_account_tab_wrapper .tab_list .tab-list-item {
        color: #FFF;
        font-size: 18px;
        background-color: #484742;
    }

    .my_account_tab_wrapper .tab_list .tab-list-item:after {
        background-color: #FFF;
    }

    .my_account .leftSection .myAccDetails,
    .my_account .leftSection .myValidVoucher,
    .my_account .leftSection .myUsedOffer {
        width: 100%;
        background-color: rgba(255, 255, 255, 0.8);
        padding: 9% 6% 6%;
        padding: 20px;
        height: auto;
        text-align: center;
    }


    #memberCard {
        position: relative;
        width: 100%;
        display: inline-block;
        text-align: center;
        max-width: 600px;
        float: initial;
        margin-bottom: 30px;
    }

    #memberDetailsWrapper {
        float: initial;
        width: 100%;
        display: block;
        text-align: left;
        max-width: 600px;
        color: #4A4643;
        left: 0;
        right: 0;
        margin: 0 auto;
    }

    #memberDetailsWrapper label.detailsLabel {
        font-size: 15px;
    }

    #memberDetailsWrapper .detailsData {
        font-size: 20px;
    }

    body[data-page='my_account'] #pageNameWrapper {
        /* padding-top: 0; */
        position: relative;
    }

    body[data-page='my_account'] #pageName {
        font-size: 7vw;
        padding: 1em 0;
        height: auto;
        line-height: 8vw;
        color: #FFF;
    }

    #howtoJoinWrapper {
        color: #484742;
        max-width: 100%;
    }

    .voucher-card .voucher-details .title,
    .voucher-card .voucher-details .date,
    .voucher-card .btn-tenant-redeem-reject,
    .voucher-list-wrapper .lbl_empty_voucher {
        color: #484742;
    }

    .voucher-card .voucher-details .date,
    .voucher-card .btn-tenant-redeem-reject {
        opacity: 1;
    }

    .voucher-details .btn-tenant-redeem-approved {
        border: 1px solid #484742;
        color: #484742;
    }

    .voucher-details .btn-tenant-redeem-pending {
        border-color: #484742;
        color: #484742;
    }
}

@media screen and (max-width: 1000px) {
    .shopNo {
        font-size: 2vw;
        line-height: 1.5vw;
    }

    .shopTag {
        font-size: 1.6vw;
        margin-top: 2px;
    }
}

@media screen and (max-width: 968px) {
    .footertable-desc {
        width: 24%;
        margin-left: 38%;
    }

    .footertable-desc2 {
        width: 37%;
    }

    #footer {
        padding: 3% 2%;
    }

    #footer .site-main__nav a {
        font-size: 3vw;
    }

    #footer .grid__wrapper {
        padding-left: 38%;
    }

    #eventDetails .active.btn,
    #btnEventBack.btn {
        /*        display: block;*/
        margin-right: 0;
        margin-left: 10px;
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 840px) {
    #container .signup .form-box .input-group .col-1 {
        width: 100%;
        margin-bottom: 14px;
    }

    #container .signup .form-box .input-group .col-1 .col-1,
    #container .signup .form-box .input-group .col-1 .col-2 {
        width: 48%;
        margin-bottom: 0;
    }

    #container .signup .form-box .input-group .col-2 {
        width: 100%;
    }

    #container .signup .form-box .input-group .col-2 .col2 {}

    #container .signup .form-box .input-group .col-2 .col-2 {
        width: 48%;
    }

    #container .signup .form-box .input-group .col-2 .col-1 {
        width: 48%;
    }

    .input-group {
        margin-right: 0;
        width: 98%;
    }
}


@media screen and (max-width: 800px) {
    #container #pages .pages_content.redeem .body .lists {
        width: 95%;
    }
}

@media screen and (max-width: 768px) {

    body[data-page='happenings'],
    body[data-page='happenings_details'] {
        /*overflow: hidden;*/
        /*height: 100%;*/
    }



    .nav-overlay__container {
        height: 100vh;
        background-color: #FFF;
    }

    .site-menu__icon {
        right: 0;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        z-index: 9999;
    }

    #tncWrapper,
    #picsWrapper {
        padding: 0;
    }

    #container .signup .header {
        padding: 0;
    }

    #container .signup .form-box .form-input-box {
        padding: 0;
    }

    #lightbox.show:not(.happenings) {
        height: 100vh;
    }

    #lightbox.signup.show .load-content {
        height: 100%;
    }

    #lightbox.show.happenings {
        align-items: normal;
    }

    #lightbox .signup {
        padding: 32px 20px;
        height: auto;
        position: relative;
        top: 0;
        left: 0;
        transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        width: 100%;
    }

    #mobileBanner1 {
        height: 50vh;
    }

    .item.homeMobileSection {
        height: 25vh;
        overflow: hidden;
        background-position: center center;
        background-size: cover;
        position: relative;
        color: #484742;
    }

    .item.homeMobileSection:before {
        content: '';
        background-color: rgba(255, 255, 255, 0.3);
        width: 100%;
        height: 100%;
        position: absolute;
    }

    #mobileBanner1.item.homeMobileSection:before {
        content: '';
        background-color: transparent;
        width: 100%;
        height: 100%;
        position: absolute;
    }

    #mobileBanner1 .mobilebannerDetails {
        color: #484742;
    }

    .item.homeMobileSection .bannerImg {
        width: 100%;
        opacity: 0;
    }

    .mobilebannerTag {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        font-size: 6vw;
    }

    .bottomIfcWhiteLogo {
        display: none;
    }

    #homeimgSequence {
        width: 100%;
        margin: 0;
        padding: 0;
        display: block;
    }

    .homeMobileSection {
        display: block;
    }

    #homeSlider {
        display: none;
    }

    .leftSection {
        padding: 0;
    }

    img#whiteLogo {
        display: none;
    }

    img#greyLogo {
        display: block;
    }

    body[data-page='home'] img#whiteLogo {
        display: block;
    }

    body.mobile.signup.show[data-page='home'] img#greyLogo {
        display: block;
        width: 100%;
    }

    body[data-page='home'] img#greyLogo {
        display: none;
        position: absolute;
        padding-top: 10px;
    }

    body.has-nav-open[data-page='home'] img#whiteLogo {
        display: none;
    }

    body.has-nav-open[data-page='home'] img#greyLogo {
        display: block;
        width: 100%;
    }

    body[data-page='home'] .site-menu__icon span {
        background: #FFFFFF;
    }

    .site-menu__caption {
        display: none;
    }

    body.has-nav-open[data-page='home'] .site-menu__icon span,
    .site-menu__icon span {
        background: #484742;
    }

    body.mobile.signup.show[data-page='home'] .site-menu__icon span,
    body.mobile.signup.show[data-page='home'] .site-menu__icon span {
        background: #484742;
    }

    #container {
        overflow: initial;
    }

    body.has-nav-open #container {
        min-height: 100vh;
        overflow: hidden;
        height: auto;
    }

    #container #main .content-box {
        height: auto;
    }

    #container #main .content-box #pages .load-section {
        position: relative;
        height: 100%;
        min-height: auto;
        /*        height: 100vh;*/
        /*        min-height: 100vh;*/
    }

    #container #pages .my_account .content .list_box .acc_list {
        width: 100%;
        margin-right: 0;
        margin-bottom: 50px;
    }

    #container #pages .my_account .content .list_box {
        height: auto;
    }

    #container #pages .my_account .content .list_box .acc_list .none .none-box {
        position: relative;
        top: 0;
        left: 0;
        transform: auto;
        transform: initial;
        width: 100%;
    }

    #container #status .member-info .title {
        font-size: 13px;
    }

    #container #status .member-info .name {
        font-size: 17px;
    }

    #container #pages .pages_content {
        padding: 188px 22px 22px;
    }

    #container #pages .pages_content .body {
        padding: 22px;
    }

    #privilegeWrapper #pageNameWrapper {
        background-color: #EDEDED;
        /* margin-top: 80px; */
        position: relative;
        /* padding-top: 0; */
    }

    .nameWrapper {
        display: none;
    }

    #pageName {
        font-size: 7vw;
        padding: 1em 0;
        height: auto;
        line-height: 8vw;
    }

    #container #happeningsWrapper #pageName {
        /*		color: #FFF;*/
    }

    #privilegeWrapper .leftSection {
        background-color: #FFF;
        padding: 0;
        height: auto;
    }

    #privilegeWrapper .leftgradientBG {
        width: 100%;
    }

    .leftSection {
        width: 100%;
    }

    body.mobile .leftSection {
        height: auto;
        /*        padding-bottom: 0;*/
    }

    .rightSection {
        display: none;
    }

    #contactUsWrapper .rightSection,
    #welcomeGiftWrapper .rightSection {
        position: absolute;
        display: block;
        top: 0;
        width: 100%;
        height: 100%;
    }

    #contactUsWrapper .leftSection,
    #welcomeGiftWrapper .leftSection {
        background-color: transparent;
        /* padding: 0; */
        z-index: 99;
        padding: 0 2% 80px 2%;
        height: auto;
        position: relative;
    }

    #welcomeGiftWrapper .leftSection {
        min-height: 100vh;
    }

    #contactUsWrapper .leftSection .group.submit {
        display: inline-block;
        /* left: 0; */
        0 */
        /* right: 0; */
        margin: 0 auto;
        /* margin-bottom: 15px; */
        width: 100%;
        text-align: center;
    }

    .welcome_gift .leftSection #giftFromWrapper {
        width: 100%;
        background-color: rgba(255, 255, 255, 0.8);
        margin-top: 40%;
        padding: 7% 5%;
    }

    #container #pages #contactUsWrapper .body.contact-us .lists .group .btnSubmit {
        width: 70%;
        max-width: 300px;
    }

    #pageNameWrapper {
        padding-top: 60px;
        position: relative;
    }

    #contactUsWrapper .leftSection .contact-us {
        width: 100%;
        background-color: rgba(55, 79, 63, 0.8);
        padding: 0 3%;
        height: auto;
    }

    #welcomeGiftWrapper .sectionTitle {
        font-size: 4.5vw;
        line-height: 1em;
    }

    .welcome_gift_remarks {
        margin-bottom: 50px;
    }

    #welcomeGiftUpper {
        width: 100%;
        max-width: 500px;
    }

    #welcome_gift_shopName {
        font-size: 16px;
    }

    #welcome_gift_shopNum {
        font-size: 14px;
    }

    #privilegeWrapper #selectionWrapper {
        padding-top: 10px;
    }

    .shopName {
        font-size: 6vw;
        line-height: 9vw;
    }

    .shopNo {
        font-size: 3vw;
        line-height: 3.5vw;
    }

    .showDesc {
        font-size: 3.5vw;
    }

    .shopTag {
        font-size: 2.2vw;
    }

    img.shopLogo {
        display: none;
    }

    li.selectListItem,
    li.catListItem,
    #shopListWrapper {
        margin-left: 30px;
        margin-right: 0;
    }

    #alphabetOrderList li.catListItem {
        margin-right: 0;
        margin-left: 20px;
        line-height: 1.8em;
    }

    body.mobile #shopListWrapper {
        height: initial !important;
    }

    #container #main {
        /* padding-top: 60px; */
    }

    #container #main #header {
        /* height: 60px; */
        background: rgba(255, 255, 255, 0.9);
        color: #484742;
        padding-right: 5%;
        line-height: 60px;
    }

    body[data-page='home'] #container #main #header {
        background: transparent
    }

    body.has-nav-open[data-page='home'] #container #main #header {
        background: #FFF
    }

    .btn-navLogin,
    #logoutTxt,
    .btnLogout {
        color: #484742;
    }

    .btnLogout {
        width: 70px;
    }

    body[data-page='home'] .btn-navLogin,
    body[data-page='home'] #logoutTxt,
    body[data-page='home'] .btnLogout {
        color: #FFF;
    }

    body.mobile.signup.show[data-page='home'] .btn-navLogin,
    body.mobile.signup.show[data-page='home'] #logoutTxt,
    body.has-nav-open[data-page='home'] .btn-navLogin,
    body[data-page='home'] #logoutTxt {
        color: #484742;
    }

    #headerR .lang-bar {
        display: none;
    }

    #headerR {
        position: absolute;
        top: 0;
        right: 23%;
        display: inline-block;
        width: 50px;
        z-index: 99;
        padding-left: 0;
    }

    #headerL {
        width: 100%;
    }

    #homeHeadLogoWrapper {
        /*        padding-top: 15px;*/
        padding: 0;
        vertical-align: middle;
    }

    a#siteIcon {
        /* padding-top: 12px; */
        width: 100%;
    }

    .site-menu {
        width: 36px;
    }

    .shopDetailsLeft,
    .shopNameWrapper .downArrow {
        display: inline-block;
        vertical-align: top;
    }

    .shopDetailsLeft,
    .shopDescWrapper {
        width: calc(100% - 8%);
    }

    #clubName {
        display: none;
    }

    #howToJoinTxt {
        margin-bottom: 20px;
        text-align: left;
    }

    #mobileBanner1 .mobilebannerTag {
        position: relative;
        left: 0;
        top: 0;
        transform: initial;
        -webkit-transform: initial;
        -ms-transform: initial;
        -o-transform: initial;
        margin-bottom: 20px;
    }

    #mobileBanner1 .mobilebannerTitle {
        left: initial;
        left: auto;
        top: initial;
        top: auto;
        transform: initial;
        position: relative;
    }

    #mobileBanner1 .mobilebannerDetails {
        position: absolute;
        top: 50%;
        left: 0;
        padding: 5%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
    }

    #header #status {
        position: absolute;
        right: 5%;
    }

    #btnSignupClose {
        right: 15px;
        z-index: 9;
        top: 15px;
    }

    i.icon-lg-cross {
        background: url(../img/big-cross.png) no-repeat 0 0;
    }

    .footertable-desc,
    .footertable-desc2 {
        width: 100%;
        margin-left: 0;
        margin-bottom: 5%;
    }

    #footer {
        padding: 6% 5%;
    }

    #footer .site-main__nav a {
        font-size: 4vw;
    }

    li.site-second_footeritem a {
        font-size: 2.5vw;
    }

    #footermobileMenuLang {
        display: block;
        margin-bottom: 11%;
        width: 100%;
    }

    #footer .grid__wrapper {
        padding-left: 0;
    }

    ul.lang-bar li.item a {
        color: #484742;
    }

    .link-change_pwd {
        color: #484742;
        border-color: #484742;
        ;
    }

    #footermobileMenuLang ul.lang-bar li.item {
        margin-right: 30px;
    }

    .nav-overlay__footer.menu-anim {
        padding-top: 0;
        height: calc(32vh - 10px);
        background-color: #FFF;
        padding-left: 5%;
        height: auto;
        bottom: initial;
        height: calc(100vh - 65vh - 50px);
        padding-bottom: 30px;
        display: block;
    }

    #footer .bottomIFCLogo {
        display: block;
        width: 100%;
        position: relative;
        margin-bottom: 2%;
    }

    #footer .grid__container {
        display: block;
    }

    #footer .bottomIfcGreyLogo {
        position: relative;
    }

    .nav-overlay__bg.nav-overlay__bg--primary,
    body.has-nav-open .nav-overlay__bg--secondary {
        display: none;
    }

    .nav-bar .table-desc {
        background-color: #FFF;
        height: auto;
        padding-left: 5%;
        padding-top: calc(8vh + 70px);
        margin-top: 0;
        width: 100%;
        display: block;
        /* margin-bottom: 50px; */
        min-height: 50vh;
    }

    #navleftGrid,
    #navleftGrid2 {
        display: none;
    }

    .site-main__nav {
        width: 100%;
        height: auto;
    }

    .has-nav-open .site-footer__copyright {
        display: none;
    }

    ul#menu-main_menu {
        width: 100%;
        padding-left: 0;
    }

    .site-main__nav a {
        font-size: 5vw;
    }

    .table-desc2 {
        background-color: #FFF;
        color: #484742;
        padding-left: 5%;
        height: 20vh;
        width: 100%;
        display: block;
        height: auto;
        margin-bottom: 50px;
        min-height: 15vh;
    }

    .grid__item.grid__item__third {
        width: 100%;
        bottom: initial;
        position: relative;
    }

    ul#menu-second_menu a {
        color: #484742;
    }

    body.has-nav-open #mobileMenuLang {
        width: 100%;
        /* margin-bottom: 15vh; */
        display: block;
        height: 100%;
    }

    body.has-nav-open .grid__wrapper {
        margin-left: 0;
        width: 100%;
        height: 100%;
    }

    .grid__container {
        display: block;
        height: 100%;
    }

    .bottomIFCLogo {
        margin-bottom: 3vh;
    }

    #registrationformWrapper {
        height: 100%;
        height: auto;
        min-height: initial;
        position: relative;
    }

    #container .signup .form-box {
        height: auto;
    }

    .load-content {
        width: 100%;
        height: 100%;

        max-height: 75%;
        width: 95%;
        overflow: hidden;
    }

    #lightbox.signup.show {
        min-height: 100vh;
    }

    #lightbox.signup.show {
        position: relative;
        height: auto;
        top: 0;
        /*        top: 60px;*/
    }

    body.signup.show #pages {
        display: none;
    }

    #lightbox.signup.show #lbContentWrapper {
        height: auto;
        overflow: initial;
    }

    body.signup.show .load-content {
        transform: translate(0, 0);
        left: 0;
        top: 0;
    }

    body.mobile.signup.show {
        overflow: initial;
    }

    #thankyouWrapper .regards {
        position: relative;
        padding-left: 0;
    }

    .shopDesc ul {
        margin-left: 20px;
    }

    .rightSection {
        position: absolute;
        display: block;
        top: 0;
        width: 100%;
        min-height: 100vh;
        height: auto;
        display: none;
    }

    .leftSection.scroll {
        padding-top: 0;
    }

    #happeningsWrapper .leftSection {
        background-color: transparent;
        /* padding: 0; */
        z-index: 99;
        padding: 0 2%;
        /*        padding: 0 2% 80px 2%;*/
        height: auto;
        height: calc(100% - 170px);
        /*        height: 100%;*/
        height: auto;
        position: relative;
        width: 100%;
        /*        padding-bottom: 0;*/
    }



    #happeningscatOrderList {
        /*        padding: 0 6%;*/
        padding: 0 calc(30px - 2%);
        margin-bottom: 30px;
    }

    li.catListItem,
    li.happeningscatListItem {
        margin-right: 23px;
    }

    #happeningsListWrapper {
        width: 100%;
        background-color: rgba(255, 255, 255, 0.8);
        /*        padding: 9% 6% 6%;*/
        padding: 9% calc(30px - 2%) calc(30px - 2%);
        /* height: calc(100vh - 8vw); */
        padding-top: 0;
        padding-bottom: 0;
        border-top: solid 30px rgba(255, 255, 255, 0);
        border-bottom: solid 30px rgba(255, 255, 255, 0);
    }

    #happeningsWrapper .leftSection.scroll {
        overflow: initial;
    }

    li.happeningsListItem {
        width: 100%;
        margin-bottom: 40px;
    }

    li.happeningsListItem:nth-child(2n+1),
    li.happeningsListItem:nth-child(2n) {
        margin-right: 0;
        margin-left: 0;
    }

    #eventGradientBottom {
        display: none;
    }

    #happeningsWrapper {
        height: 100%;
        /*height: -webkit-fill-available;*/
    }

    #happeningsWrapper #eventDetailsWrapper {
        width: 100%;
        background-color: rgba(255, 255, 255, 0.8);
        padding: 0 6% 80px 6%;

        /* height: calc(100vh - 8vw); */
        /*
        padding-top: 0;
        padding-bottom: 0;
*/
        /*        border-top: solid 50px rgba(255, 255, 255, 0);*/
        /*        border-bottom: solid 50px rgba(255, 255, 255, 0);*/
    }

    #eventDetails {
        padding-bottom: 0;
    }

    #eventTitle {
        font-size: 25px;
    }

    #lightbox .happenings_redemption {
        /*        max-height: 80%;*/
        padding: 20px;
    }

    #lightbox .happenings_redemption #frm-happenings_redemption_passcode {
        text-align: center;
    }


    #lightbox .happenings_redemption .inner-wrapper {
        flex-direction: column;
        height: auto;
    }

    #lightbox .happenings_redemption .form-details {
        order: 2;
        padding-right: 0;
        width: 100%;
        text-align: left;
    }

    #lightbox .happenings_redemption .happenings-details {
        order: 1;
        margin-bottom: 40px;
        width: 100%;
        height: auto;
        text-align: left;
    }


    #lightbox .happenings_redemption .btnSubmit {
        position: relative;
        display: inline-block;
        margin: 30px auto;
    }

    .voucher-card {
        flex: 0 0 47.5%;
    }

    .voucher-card:nth-child(3n) {
        margin-right: 5%;
    }

    .voucher-card:nth-child(2n) {
        margin-right: 0;
    }

    .my_account_tab_wrapper .tab_list {
        margin-bottom: 0;
    }

    .my_account .leftSection {
        padding: 0 10px 80px 10px;
    }

    /*
    .voucher-details .btn-tenant-redeem-approved {
        border: 1px solid #484742;
        color: #484742;
    }

    .voucher-details .btn-tenant-redeem-pending {
        border-color: #484742;
        color: #484742;
    }
*/
}

@media screen and (max-width: 640px) {
    #container #left-nav .join-our-club .table-desc .wrapper .desc {
        margin-bottom: 30px;
    }

    #container #left-nav .join-our-club .table-desc .wrapper .btn-signup {
        margin-bottom: 10px;
    }

    #container #left-nav .left-nav-footer .social-media {
        margin-bottom: 0;
    }

    #container #left-nav .join-our-club .table-desc .wrapper .nav .item:last-child {
        margin-bottom: 0;
    }

    #container #left-nav .join-our-club .table-desc .wrapper .sub-title {
        margin-bottom: 15px;
    }

    #container #left-nav .join-our-club .table-desc {
        height: auto;
        margin-bottom: 20px;
    }

    #container #left-nav .join-our-club .table-desc .wrapper {
        min-height: 250px;
    }

    a.mobile-group-logo {
        top: 10px;
        /* width: 80px; */
    }

    #mobile-left-nav-groupLogo {
        width: 95%;
    }

    #container.member_login #left-nav .load-section {
        padding-top: 20px;
    }

    #container #left-nav .load-section {
        height: calc(100% - 15px);
    }

    #container #left-nav .join-our-club {
        margin-left: 5%;
    }

    #container #pages .pages_content.redeem .body .nav .item {
        padding: 10px 20px;
        font-size: 15px;
    }

    #container #pages .pages_content.redeem .body .lists {
        padding-top: 30px;
    }

    #container #pages .pages_content.redeem .body .lists .item {
        width: 45%;
        margin: 2.5%;
    }

    #container #pages .pages_content .body.faqs .lists .group .item .answer {
        padding-right: 0;
        font-size: 13px;
    }

    #container #pages .pages_content .body.faqs .open-answer,
    #container #pages .pages_content .body.faqs .lists .group.show .item {
        width: 95%;
        display: block;
    }

    #lightbox .redemption.alert-box {
        padding: 22px 14px;
        width: 80%;
    }

    #lightbox .redemption.alert-box .body,
    #lightbox .contact_us.alert-box .body,
    #lightbox .change_password.alert-box .body {
        margin: 20px 0;
        font-size: 14px;
    }

    #container.member_info #left-nav .nav-bar .table-desc {
        margin-bottom: 50px;
    }

    #eventDetails .active.btn,
    #btnEventBack.btn {
        width: 110px;
    }

    #btnEventBack.btn {
        margin-left: 0;
    }


    #lightbox .happenings_redemption #frm-happenings_redemption .group_fileupload#paymentslip_fileupload {
        margin-right: 10px;
    }

    #lightbox .happenings_redemption #frm-happenings_redemption_passcode .group {
        flex-direction: column;
    }

    #lightbox .happenings_redemption #frm-happenings_redemption_passcode .group .title {
        width: 100%;
        display: block;
        margin-right: 0;
        margin-bottom: 7px;
    }

    #lightbox .happenings_redemption #frm-happenings_redemption_passcode .group .input-wrapper {
        width: 100%;
        display: block;
    }
}

@media screen and (max-width: 580px) {
    #container #left-nav .top .site-logo {
        min-width: 80px;
        width: 19%;
    }


    #mobileWhiteBg {
        top: 60px;
    }

    #container #pages .pages_content .body.faqs .icon_msg {
        margin-right: 10px;
        width: 28px;
    }

    #container #pages .pages_content .body.faqs .title {
        width: calc(100% - 48px);
        font-size: 15px;
    }

    #container #pages .pages_content .body.faqs .lists .group .title {
        font-size: 13px;
    }

    #lightbox .redemption .body .img {
        /* margin-bottom: 34px; */
        width: 150px;
        height: 150px;
        margin: 0 auto;
        margin-bottom: 34px;
    }

    #lightbox .redemption .body .col-2 {
        width: 100%;
    }

    #lightbox .redemption .body .col-2 .wrapper {
        left: 0;
        right: 0;
        margin: 0 auto;
        margin-bottom: 20px;
    }

    .shopDescWrapper.active .shopDesc {
        font-size: 15px;
    }

    .voucher-card {
        flex: 0 0 100%;
        margin-right: 0;
    }

    .voucher-card:nth-child(3n) {
        margin-right: 0%;
    }

    .voucher-card:nth-child(2n) {
        margin-right: 0;
    }

    .my_account_tab_wrapper .tab_list .tab-list-item {
        font-size: 13px;
        padding: 4px 10px;
        flex: 0 0 calc((100% - 40px) / 3);
        text-align: center;
    }

    .my_account_tab_wrapper .tab_list .tab-list-item:not(:last-child) {
        margin-right: 20px;
    }

    .my_account_tab_wrapper {
        margin-bottom: 40px;
    }

    #header #status {
        position: fixed;
        right: 0%;
        left: 0%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 480px) {
    #container #pages .pages_content .body.contact-us .lists .group .col-2.name {
        margin-bottom: 30px;
    }

    #container #pages .pages_content .body.contact-us .lists .group .col-2 {
        width: 90%;
    }

    #container #pages .pages_content.redeem .body .nav .item {
        padding: 10px 7px;
        /* font-size: 15px; */
    }

    #container #pages .pages_content {
        padding: 188px 12px 12px;
    }

    #container #pages .pages_content .body {
        padding: 22px 22px;
    }

    #container #pages .pages_content.redeem .body .lists .item {
        width: 200px;
        margin: 2.5%;
    }

    #container #pages .pages_content.redeem .body .lists {
        text-align: center;
    }

    #lightbox .forget_password,
    #lightbox .change_password {
        padding: 30px 20px;
    }

    #lightbox .forget_password > .title .icon,
    #lightbox .change_password > .title .icon {
        width: 31px;
        height: 26px;
    }

    #lightbox .forget_password > .title,
    #lightbox .change_password > .title {
        font-size: 16px;
        padding-left: 38px;
    }

    .shopTag {
        font-size: 3.3vw;
    }

    .shopNo {
        font-size: 4vw;
    }
}

@media screen and (max-width: 400px) {
    #container #pages .pages_content.redeem .body .nav .item {
        font-size: 13px;
    }
}
