﻿

:root {
    --urlImg_Logo: url("/Image/Logo.PNG");
    --urlImg_LogoNew: url("/Image/newLogo.png");
    --urlImg_NoImage: url("/Image/nif.jpg");
    --urlImg_NoImage2: url("/Image/noimage.png");
    --urlImg_WebHeader: url("/Image/WebHeader.jpg");
    --urlImg_WebHeaderMobile: url("/Image/WebHeaderMobile.jpg");
    --urlImg_WebBody: url("/Image/WebBody.jpg");
    /*--urlImg_WebBody: url("/Image/newbackground.png");*/
    --urlImg_WebFooter: url("/Image/WebFooter.jpg");
    --urlImg_voucher: url("/Image/voucher.png");
    --urlImg_voucher2: url("/Image/newvoucher.png");
    --urlImg_icon_elite_bar: url("/Image/icon_elite_bar.png");
    --urlImg_CongraPopOut: url("/Image/CongraPopOut.jpg");
    --urlImg_refresh: url("/Image/refresh.png");
    --urlImg_Map: url("/Image/map.png");
    --urlImg_LanUK: url("/Image/lan_UK.png");
    --urlImg_appstore: url("/Image/appstore.png");
    --urlImg_playstore: url("/Image/playstore.png");
    --urlImg_visa: url("/Image/visa.jpg");
    --urlImg_master: url("/Image/master.jpg");
    --urlImg_fpx: url("/Image/fpx.jpg");
    --urlImg_tng: url("/Image/tng.jpg");
    --urlImg_grabpay: url("/Image/grabpay.jpg");
    --urlImg_boost: url("/Image/boost.jpg");
    --urlImg_arrow_back: url("/Image/back.png");
    --urlImg_icon_tick: url("/Image/tick_icon.png");
    --urlImg_icon_home: url("/Image/icon_home.png");
    --urlImg_icon_promotion: url("/Image/icon_promotion.png");
    --urlImg_icon_category: url("/Image/icon_category.png");
    --urlImg_icon_account: url("/Image/icon_account.png");
    --urlImg_catalogue: url("/Image/catalogue.jpg");
    --urlImg_success: url("/Image/success2.png");
    --urlImg_fail: url("/Image/fail.png");
    --urlImg_cancel: url("/Image/cancel.png");
    --urlImg_Billplz: url("/Image/Billplz.png");
    --urlImg_IOUPay: url("/Image/IOUPay.png");
    --urlImg_Pace: url("/Image/Pace.png");
    --urlImg_Payment_Point: url("/Image/icon_payment_pointt.png");
    --urlImgPromotion: url("/Image/promotion.png");
    --urlImgNotUpgrade: url("/Image/NotUpgrade.jpg");
    --urlImgAbout: url("/Image/about.jpg");
    --urlImgSocialIcon_Facebook: url("/Image/facebook.png");
    --urlImgSocialIcon_Whatapps: url("/Image/Whatapps.png");
    --urlImgSocialIcon_Telegram: url("/Image/Telegram.png");
    --urlImgSocialIcon_twitter: url("/Image/twitter.png");
    --urlImg_icon_toreceive: url("/Image/icon_toreceive.png");
    --urlImg_icon_pointhistory: url("/Image/icon_pointhistory.png");
    --urlImg_icon_orderhistory: url("/Image/icon_orderhistory.png");
    --urlImg_icon_membership_commission: url("/Image/icon_membership_commission.png");
    --urlImg_icon_membership_groupsales: url("/Image/icon_membership_groupsales.png");
    --urlImg_icon_membership_downline: url("/Image/icon_membership_downline.png");
    --urlImg_icon_member: url("/Image/icon_member.png");
    --urlImg_icon_membership: url("/Image/icon_membership.png");
    --urlImg_icon_upgrademember: url("/Image/icon_upgrademember.png");
    --urlImg_icon_renewmember: url("/Image/icon_renewmember.png");
    --urlImg_icon_howitwork_checkout: url("/Image/icon_howitwork_checkout.png");
    --urlImg_icon_howitwork_follow: url("/Image/icon_howitwork_follow.png");
    --urlImg_icon_howitwork_complete: url("/Image/icon_howitwork_complete.png");
    --urlImg_icon_pc_howitwork_checkout: url("/Image/icon_pc_howitwork_checkout.png");
    --urlImg_icon_pc_howitwork_follow: url("/Image/icon_pc_howitwork_follow.png");
    --urlImg_icon_pc_howitwork_complete: url("/Image/icon_pc_howitwork_complete.png");
    --urlImg_icon_downline: url("/Image/icon_downline.png");
    --urlImg_icon_commision: url("/Image/icon_commision.png");
    --urlImg_icon_library: url("/Image/icon_library.png");
    --urlImg_icon_birthday: url("/Image/icon_birthday.png");
    --urlImg_icon_catalogue: url("/Image/icon_catalogue.png");
}


:root {
    --themecolorhome: #e12027;
    --themecolorwellness: #80b837;
    --themecolor: #e12027; /*red - #e12027 or #E41E26 ; green - #80b837*/
    --menubuttonactive: #e12027; /*Home - #e12027; Wellness - #80b837*/
    --thememobilecolor: #e12027; /*Home - #e12027; Wellness - white*/
    --thememobilefontcolor: white; /*Home - white; Wellness - black*/
    --themefootercolor: #e12027; /*Home - #e12027; Wellness - lightgray*/
    --themetextcolor: white; /*Home - white; Wellness - black*/
}


.imgIcon_ToReceive {
    content: var(--urlImg_icon_toreceive);
}

.imgIcon_PointHistory {
    content: var(--urlImg_icon_pointhistory);
}

.imgIcon_OrderHistory {
    content: var(--urlImg_icon_orderhistory);
}

.imgIcon_membership_commission {
    content: var(--urlImg_icon_membership_commission);
}

.imgIcon_membership_groupsales {
    content: var(--urlImg_icon_membership_groupsales);
}

.imgIcon_membership_downline {
    content: var(--urlImg_icon_membership_downline);
}

.imgIcon_member {
    content: var(--urlImg_icon_member);
}

.imgIcon_membership {
    content: var(--urlImg_icon_membership);
}

.imgIcon_upgrademember {
    content: var(--urlImg_icon_upgrademember);
}

.imgIcon_renewmember {
    content: var(--urlImg_icon_renewmember);
}

.imgIcon_howitwork_checkout {
    content: var(--urlImg_icon_howitwork_checkout);
}

.imgIcon_howitwork_follow {
    content: var(--urlImg_icon_howitwork_follow);
}

.imgIcon_howitwork_complete {
    content: var(--urlImg_icon_howitwork_complete);
}

.imgIcon_pc_howitwork_checkout {
    content: var(--urlImg_icon_pc_howitwork_checkout);
}

.imgIcon_pc_howitwork_follow {
    content: var(--urlImg_icon_pc_howitwork_follow);
}

.imgIcon_pc_howitwork_complete {
    content: var(--urlImg_icon_pc_howitwork_complete);
}

.imgIcon_downline {
    content: var(--urlImg_icon_downline);
}

.imgIcon_commision {
    content: var(--urlImg_icon_commision);
}

.imgIcon_library {
    content: var(--urlImg_icon_library);
}

.imgIcon_birthday {
    content: var(--urlImg_icon_birthday);
}

.imgIcon_catalogue {
    content: var(--urlImg_icon_catalogue);
}




.imgURLLogo {
    content: var(--urlImg_Logo);
}

.imgURLLogoNew {
    content: var(--urlImg_LogoNew);
}

.imgNoImage {
    content: var(--urlImg_NoImage);
}

.imgNoImage2 {
    content: var(--urlImg_NoImage2);
}


.imgRefresh {
    content: var(--urlImg_refresh);
}

.imgArrowBack {
    content: var(--urlImg_arrow_back);
}

.imgTickIcon {
    content: var(--urlImg_icon_tick);
}

.imgIconHome {
    content: var(--urlImg_icon_home);
}

.imgIconPromotion {
    content: var(--urlImg_icon_promotion);
}

.imgIconCategory {
    content: var(--urlImg_icon_category);
}

.imgIconAccount {
    content: var(--urlImg_icon_account);
}


/*.imgLanUK {
    content: var(--urlImg_LanUK);
}*/



.app-icon-apple {
    content: var(--urlImg_appstore);
}

.app-icon-playstore {
    content: var(--urlImg_playstore);
}

.imgPayment_Visa {
    content: var(--urlImg_visa);
}

.imgPayment_Master {
    content: var(--urlImg_master);
}

.imgPayment_FPX {
    content: var(--urlImg_fpx);
}

.imgPayment_TnG {
    content: var(--urlImg_tng);
}

.imgPayment_grabPay {
    content: var(--urlImg_grabpay);
}

.imgPayment_Boost {
    content: var(--urlImg_boost);
}


.imgSuccess {
    content: var(--urlImg_success);
}

.imgFail {
    content: var(--urlImg_fail);
}

.imgCancel {
    content: var(--urlImg_cancel);
}


.imgCatalogue {
    content: var(--urlImg_catalogue);
}

.imgBillplz {
    content: var(--urlImg_Billplz);
}

.imgIOUPay {
    content: var(--urlImg_IOUPay);
}

.imgPace {
    content: var(--urlImg_Pace);
}

.imgPoint {
    content: var(--urlImg_Payment_Point);
}


.imgPromotion {
    content: var(--urlImgPromotion);
}

.imgNotUpgrade {
    content: var(--urlImgNotUpgrade);
}

.imgAbout {
    content: var(--urlImgAbout);
}


.imgSocialIcon_Facebook {
    content: var(--urlImgSocialIcon_Facebook);
}

.imgSocialIcon_Whatapps {
    content: var(--urlImgSocialIcon_Whatapps);
}

.imgSocialIcon_Telegram {
    content: var(--urlImgSocialIcon_Telegram);
}

.imgSocialIcon_Twitter {
    content: var(--urlImgSocialIcon_twitter);
}


.dvMap {
    background-image: var(--urlImg_Map);
    height: 200px;
    margin-top: -10px;
    margin-bottom: 10PX;
}


/*============================== Quicksand ============================== */
/* vietnamese */
@font-face {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 400;
    /*src: url(https://fonts.gstatic.com/s/quicksand/v24/6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkP8o58m-wi40.woff2) format('woff2');*/
    src: url("6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkP8o58m-wi40.woff2") format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 400;
    /*src: url(https://fonts.gstatic.com/s/quicksand/v24/6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkP8o58i-wi40.woff2) format('woff2');*/
    src: url("6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkP8o58i-wi40.woff2") format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 400;
    /*src: url(https://fonts.gstatic.com/s/quicksand/v24/6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkP8o58a-wg.woff2) format('woff2');*/
    src: url("6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkP8o58a-wg.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}




/*============================== Roboto ============================== */

/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu72xKOzY.woff2") format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu5mxKOzY.woff2") format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu7mxKOzY.woff2") format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu4WxKOzY.woff2") format('woff2');
    unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu7WxKOzY.woff2") format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu7GxKOzY.woff2") format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url("KFOmCnqEu92Fr1Mu4mxK.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/*============================== Montserrat ============================== */


/* cyrillic-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/montserrat/v24/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw0aXpsog.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/montserrat/v24/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw9aXpsog.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/montserrat/v24/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw2aXpsog.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/montserrat/v24/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw3aXpsog.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/montserrat/v24/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw5aXo.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


.textBold {
    font-family: 'Montserrat' !important;
    font-weight: bold !important;
}

.textItalic {
    font-family: 'Montserrat' !important;
    font-style: italic !important;
}


.textTitle {
    font-family: 'Montserrat' !important;
    font-weight: bold;
    text-transform: uppercase;
}

.textOthers {
    font-family: 'Montserrat' !important;
}


.textColoraLightGrey {
    color: #9D9D9C !important;
}

.textColorDarkGrey {
    color: #575756 !important;
}

.textColorBlack {
    color: #1D1D1B !important;
}

.textColorWhite {
    color: white !important;
}




body {
  /*  background-image: var(--urlImg_WebBody);
    background-size: 100% 100%;
    background-position: center center;*/
  background-color: whitesmoke;
}


.indexbody {
    padding: 0px !important;
}

.indexbody2 {
    min-height: calc(100vh - 256px);
}




.sliderTop_Mobile {
    width: 100%;
}


.imgTop {
    width: 100%;
    /*-webkit-filter: drop-shadow(5px 5px 5px #222);
    filter: drop-shadow(5px 5px 5px #222);*/
}


.img2 {
    margin-bottom: 15px;
}

.sliderimg {
    width: 33.33%;
    float: left;
    padding: 5px;
}


.sectiondiv {
    padding-top: 50px;
    padding-bottom: 10px;
}







.backgroup12 {
    background: linear-gradient(180deg, rgba(255,255,255,0) 24%, var(--themecolorhome) 25%, var(--themecolorhome) 70%, rgba(255,255,255,0) 71%);
}


.backgroup12_2 {
    background: linear-gradient(180deg, rgba(255,255,255,0) 4%, var(--themecolorhome) 5%, var(--themecolorhome) 95%, rgba(255,255,255,0) 96%);
}




.fullbackgroup {
    background-color: var(--themecolorhome);
}



.wellness_fullbackgroup {
    background-color: var(--themecolorwellness);
}



.dvTitle {
    float: left;
    width: 70%;
}



.cssSeeMore {
    float: right;
    width: 28%;
    text-align: right;
    padding-top: 10px;
    cursor: pointer;
}


.indexItem {
    cursor: pointer;
    padding: 5px;
    /*height: 390px;*/
    -webkit-filter: drop-shadow(5px 5px 5px #222);
    filter: drop-shadow(5px 5px 5px #222);
}


    .indexItem:hover {
        cursor: pointer;
    }





    .indexItem .card-body {
        color: dimgray;
        padding: 0px 5px !important;
        text-align: left;
        min-height: 130px !important;
        height: auto !important;
    }


    .indexItem .card-img-top {
        opacity: 1;
        transition: all .5s ease-out 0s;
    }

    .indexItem:hover .card-img-top {
        opacity: 0.3;
    }

.productlistbox {
    height: auto !important;
    padding-bottom: 10px;
}


.dvItemBrand {
    overflow: hidden;
    text-overflow: ellipsis;
}

.lblItemBrand {
    font-weight: bold;
    font-size: medium;
    color: #1D1D1B;
}


.lblItemName {
    height: 45px;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.625;
    font-weight: bold;
    font-size: small;
    color: #9D9D9C;
}


.price {
    width: 68%;
    float: left;
    text-align: left;
    color: black;
    font-size: 18px;
    font-weight: 700;
    margin: 0 2px 2px 0;
    display: block;
}


    .price .points {
        font-size: 12px;
        color: #9D9D9C;
        /*float: right;*/
        margin-top: -30px;
        margin-bottom: 0px;
        vertical-align: middle;
        display: inline-block;
    }

    .price .disprice {
        color: #909090;
        font-size: 12px;
        font-weight: 400;
        letter-spacing: 0;
        text-decoration: line-through;
        text-align: left;
        vertical-align: middle;
        display: inline-block;
        margin-top: -20px;
    }


.discount {
    color: black;
}



.points {
    font-size: small;
    margin-top: 3px;
}


.imgaddtocart {
    width: 25px;
}


.addtoCartdiv {
    width: 30%;
    float: right;
    text-align: center;
}

.addtocart {
    border: 1px solid #e5e5e5;
    display: inline-block;
    padding: 10px;
    color: #888;
    font-weight: 600;
    font-size: 12px;
    border-radius: 25px;
    transition: all .3s;
}

    .addtocart:hover {
        border: 1px solid #e5e5e5;
        display: inline-block;
        padding: 10px;
        color: white;
        font-weight: 600;
        font-size: 12px;
        border-radius: 25px;
        transition: all .3s;
        background-color: red;
    }


.soldCart {
    border: 1px solid #e5e5e5;
    display: inline-block;
    padding: 10px;
    color: red;
    font-weight: 600;
    font-size: 12px;
    border-radius: 25px;
    transition: all .3s;
}


.onclickCategory {
    cursor: pointer;
}


.groupCategory {
    padding: 5px !important;
    cursor: pointer;
}


.groupDiv {
    width: 100%;
    text-align: center;
}

.groupName {
    font-size: large;
    color: white;
    margin-top: 15px;
}

.groupTotal {
    font-size: x-small;
    color: gray;
}


.groupCategoryIMG {
    padding: 2rem;
    border-radius: .25rem;
    max-width: 100%;
    height: auto;
}


.groupIMG {
    max-width: 100%;
    height: auto;
    border-radius: 100%;
    -webkit-filter: drop-shadow(1px 1px 5px #222 );
    filter: drop-shadow(1px 1px 5px #222);
}


.brandIMG {
    max-width: 100%;
    height: auto;
}


.groupBrand {
    padding: 5px !important;
}




.iframeVideo {
    cursor: pointer;
    padding: 0px 5px;
}


/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
    width: 100%;
    border-width: 0px;
    border-radius: .25rem;
}



.prmoInfo {
    cursor: pointer;
}

.lblsubtitle {
    /* position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);*/
    font-weight: bold;
    font-size: 1.2rem;
}

.lblsubtitle2 {
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-weight: 800;
    margin: 0;
    font-size: 52px;
}

.flashsale-wrapper-container {
    border-radius: 10px;
    padding: 20px;
    max-width: 1440px;
    margin: 0 auto;
}

.flashsale-wrapper {
    background-color: #D32E25;
    border-radius: 10px;
    padding: 20px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.flashsale-section .container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0;
}

.flashsale-image-col {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 15px;
    height: 100%;
    margin-top: 20px;
}

    .flashsale-image-col .flashsale-img2 {
        max-width: 100%;
        height: auto;
        object-fit: contain;
        margin: 0;
    }

.flashsale-product-col {
    padding: 0 15px;
    flex-direction: column;
    height: 100%;
}

    .flashsale-product-col .flashsale-wrapper {
        flex: 1;
        display: flex;
        flex-direction: column;
        border-radius: 10px;
    }

.row.no-gutters {
    display: flex;
    flex-wrap: nowrap;
    height: 100%;
}


.view-all-btn {
    display: inline-block;
    padding: 10px 20px;
    background-color: #FFFFFF;
    color: #D32E25;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    border: 2px solid #D32E25;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s;
}

    .view-all-btn:hover {
        background-color: #D32E25;
        color: #FFFFFF;
        text-decoration: none;
    }

.view-all-btn2 {
    display: inline-block;
    padding: 10px 20px;
    background-color: #D32E25;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    border: 2px solid #D32E25;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s;
}

    .view-all-btn2:hover {
        background-color: #FFFFFF;
        color: #D32E25;
        text-decoration: none;
    }

#trumpetimg {
    position: absolute;
    top: -90px;
    left: 850px;
    transition: top 0.3s ease, left 0.3s ease;
}

@media (max-width: 767px) {
    #trumpetimg {
        top: -20px;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media (max-width: 575px) {
    #trumpetimg {
        top: -55px;
        left: 68%;
        transform: translateX(-50%);
        width: 80px;
        height: auto;
    }
}

.exclusive-label {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 9;
    font-size: 12px;
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 4px;
    box-shadow: 0 0 5px rgba(0,0,0,0.2);
    color: white;
    background-color: #FFD700;
}

    .exclusive-label.ruby {
        background-color: #9B111E;
    }

    .exclusive-label.gold {
        background-color: #FFD700;
        color: black;
    }


.promo-banners {
    background-color: #F0EFF2;
}

.voucher-section-title {
    text-align: center;
    margin-bottom: 20px;
    color: #D32E25;
    font-weight: 800;
}

.goldtitle {
    color: #f7f2e3;
}

.new-arrivals-section {
    background: none;
    padding: 40px 0;
}

.new-arrivals-wrapper {
    background-color: #FFEFE3;
    border-radius: 10px;
    padding: 20px;
    max-width: 1440px;
    margin: 0 auto;
}

    .new-arrivals-wrapper .container {
        max-width: 1300px;
        margin: 0 auto;
        padding: 0;
    }

.new-arrivals-img {
    width: 50%;
    height: auto;
    display: block;
    margin: 0 auto;
    margin-top: -35px;
}

.dvTopItem {
    margin-bottom: 20px;
}

.flashsale-section {
    padding: 15px 0;
}

.flashsale-img {
    width: 70%;
    display: block;
    margin: 0 auto;
    margin-top: -44px;
}

.row.no-gutters {
    margin-left: 0;
    margin-right: 0;
    display: flex;
    align-items: stretch;
}

    .row.no-gutters > [class*="col-"] {
        padding-left: 0;
        padding-right: 0;
    }

.product-list-container {
    padding: 20px;
}

.myTitle2 {
    position: absolute;
    top: -50%;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    font-size: 52px;
    font-family: Verdana;
    font-weight: 800;
    color: #D32E25;
    text-align: center;
}

/*.myTitle {
    position: absolute;
    top: -45%;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    font-size: 52px;
    font-family: Verdana;
    font-weight: 700;
    color: #FFEFE3;
}*/


.view-all-link2 {
    position: absolute;
    top: 25%;
    left: 83.2%;
    display: inline-block;
    font-size: 19px;
    font-weight: bold;
    color: #ffffff;
    text-decoration: none;
}

.view-all-link {
    position: absolute;
    top: 20%;
    left: 89.2%;
    display: inline-block;
    font-size: 19px;
    font-weight: bold;
    color: #e12027;
    text-decoration: none;
}

    .view-all-link:hover {
        text-decoration: underline;
        color: #c8102e;
    }

.view-all-link2:hover {
    text-decoration: underline;
    color: #FFEFE3;
}

.sales-end-container {
    text-align: center;
    margin: 0;
}

.sales-end-label {
    font-size: 25px;
    font-family: Verdana;
    font-weight: bold;
    color: #fff;
    margin-right: 10px;
}

.countdown-block1 {
    background-color: #fff;
    border-radius: 5px;
    padding: 5px 10px;
    margin: 0 2px;
}

.countdown-unit1 {
    font-size: 23px;
    font-family: Verdana;
    font-weight: bold;
    color: #262D3D;
}

.countdown-separator1 {
    font-size: 18px;
    font-family: Verdana;
    font-weight: bold;
    color: #fff;
    margin: 0 5px;
}

@media (max-width: 768px) {
    .lblsubtitle.textTitle {
        font-size: 15px;
        padding-bottom: 20px;
    }

    .lblsubtitle2 {
        font-size: 1rem;
        padding-bottom: 25px;
    }

    .title-overlay {
        width: 90%;
    }

    .flashsale-wrapper {
        margin-top: -15px;
    }

    .flashsale-img {
        width: 70%;
        display: block;
        margin-top: -33px;
    }

    .new-arrivals-img {
        margin-top: -30px;
    }

    .view-all-link {
        position: absolute;
        left: 85%;
        top: 10px;
        font-size: 0.8rem;
    }

    .view-all-link2 {
        position: absolute;
        left: 75%;
        top: 10px;
        width: 20%;
    }
}


.voucher {
    height: 155px;
    background-image: var(--urlImg_voucher2);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    padding-right: 0px;
    -webkit-filter: drop-shadow(5px 5px 5px #222);
    filter: drop-shadow(5px 5px 5px #222);
    display: flex;
    position: relative;
}

.dvVoucher .slick-slide {
    margin-left: 15px;
}

.voucherLeft {
    position: absolute;
    width: 65%;
    left: 40%;
    transform: translateX(-50%);
    padding: 10px;
    color: #A61814;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.label-new {
    font-size: 8px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-left: -205px;
    margin-top: 8px;
    margin-bottom: -10px;
    background-color: #2286C4;
    color: white;
}

.label-hot {
    font-size: 8px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-left: -205px;
    margin-top: 8px;
    margin-bottom: -10px;
    background-color: red;
    color: white;
}

.label-limited {
    font-size: 8px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 3px;
    margin-left: -190px;
    margin-top: 8px;
    margin-bottom: -10px;
    background-color: #22C468;
    color: white;
}

.voucherTitle {
    margin-top: 15px;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
}

.voucherSubTitle {
    font-size: 15px;
    text-align: center;
    color: #262D3D;
}

.voucherDesc {
    font-size: 11.8px;
    text-align: center;
    color: #262D3D;
}

.voucherTC {
    font-size: 12px;
    color: #333;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-top: 4px;
    padding: 0 10px;
    gap: 25px;
}

.voucherTCLink {
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
    font-size: 12px;
}

.voucherEnd {
    font-size: 12px;
    color: black;
}



.voucherRight {
    position: absolute;
    top: 12%;
    left: 63%;
    width: 30%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
}

.voucherlogo {
    max-width: 100%;
    max-height: 100%;
    height: 115px;
    object-fit: contain;
}



.vouchertooltip {
    margin-top: 5px;
    font-size: 12px;
}

.btnCollectVoucher {
    border-radius: 10px;
    background-color: #C42B22;
    color: white;
    font-size: small;
}

.btnVoucherRANOUT {
    border-radius: 10px;
    background-color: #BABABA;
    color: #646464;
    font-size: small;
}


.tab-buttons {
    text-align: center;
    margin-bottom: 20px;
}

.btnstyle {
    margin: 0 5px;
    padding: 10px 20px;
    font-size: 16px;
    outline: none;
    border-radius: 5px;
}

.btnActive {
    background-color: #d32f2f;
    color: white;
}

.btnNonActive {
    background-color: #f8f9fa;
    color: #333;
}

.btnstyle:hover {
    background-color: #b71c1c;
    color: white;
}

.btnstyle:focus,
.btnstyle:active {
    outline: none !important;
}

.btn-redeem {
    background-color: #d32f2f;
    color: white;
}

.btn-used {
    background-color: #cccccc;
    color: #666;
    border: none;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    cursor: not-allowed;
}

.gridStyle {
    width: 100%;
}
/* ===== Base styles (mobile-first) ===== */
.flashsale-section {
    padding: 15px 0;
}

.flashsale-wrapper-container {
    width: 100%;
}

.flashsale-product-col {
    margin-top: 15px;
}

.dvItemTitle {
    position: relative;
    text-align: center;
}



/*.view-all-link2 {
    display: inline-block;
    margin-top: 10px;
    font-size: 18px;
    text-decoration: none;
    color: white;
    font-weight: bold;
}*/

.sales-end-container {
    text-align: center;
    margin: 10px 0;
}

/*.sales-end-label {
    font-size: 0.95rem;
    font-weight: bold;
}*/

.countdown {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.redeem-item {
    margin-bottom: 30px;
    padding: 20px;
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

    .redeem-item .product-image4 {
        width: 100%;
        height: 150px;
        border-radius: 5px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .redeem-item .placeholder-image {
        width: 100%;
        height: 100%;
        background-color: #e0e0e0;
    }

    .redeem-item .product-content {
        padding-left: 20px;
        display: flex;
        align-items: flex-start;
        width: 100%;
    }

    .redeem-item .content-left {
        flex: 1;
    }

    .redeem-item .content-right {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    .redeem-item .title {
        font-size: 20px;
        margin-bottom: 8px;
        color: #000;
    }

    .redeem-item .subtitle {
        font-size: 16px;
        color: #666;
        margin-bottom: 8px;
    }

    .redeem-item .price {
        display: flex;
        flex-direction: column;
        margin-top: 0;
        color: #000;
    }

    .redeem-item .points-value {
        font-size: 18px;
        color: #000;
    }

    .redeem-item .retail-price {
        margin-top: 0;
    }

    .redeem-item .points {
        font-size: 16px;
        color: #666;
        margin-bottom: 0;
    }

    .redeem-item .redeem-terms {
        width: 100%;
        text-align: left;
    }

    .redeem-item .redeem-before {
        font-size: 14px;
        color: #666;
    }

    .redeem-item .terms-conditions {
        font-size: 14px;
        color: #666;
    }

.pagination-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}

    .pagination-controls .btn {
        margin: 0 5px;
        padding: 5px 10px;
        font-size: 16px;
    }

        .pagination-controls .btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

#pageInfo {
    font-size: 16px;
    color: #333;
}





@media (max-width: 991px) {
    .redeem-item .product-content {
        flex-direction: column;
        align-items: flex-start;
    }

    .redeem-item .content-right {
        align-items: flex-start;
        margin-top: 10px;
    }

    .redeem-item .redeem-terms {
        text-align: left;
    }

    .redeem-item .product-image4 {
        margin-bottom: 15px;
    }
}

@media screen and (min-width: 999px) {
    .imgadjust {
        margin: 0px -30px;
    }
}



@media screen and (max-width: 999px) {

    
    .img2 {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .imgrow {
        display: block;
    }

    .sectiondiv {
        padding-top: 20px;
        padding-bottom: 5px;
    }

    .groupCategoryIMG {
        padding: .25rem;
        border-radius: .25rem;
        max-width: 100%;
        height: auto;
    }
}



@media screen and (max-width: 575px) {

    .sliderimg {
        width: 100%;
        float: left;
        padding: 0px;
    }

    .img2 {
        margin-bottom: 0px;
        padding: 5px;
    }

    .imgrow {
        padding: 0px;
    }


    .indexItem {
        cursor: pointer;
        padding: 5px;
        /*height: 425px;*/
    }

    .groupName {
        font-size: small;
        color: white;
    }


    .voucherCollect {
        padding-top: 1.5em !important;
    }
}

@media screen and (max-width: 475px) {
    #bannerImage {
        margin-top: 60px;
    }

    .voucher {
        height: 140px;
        background-size: 100%;
        filter: drop-shadow(3px 3px 3px #666);
        padding: 5px;
        display: flex;
        align-items: center;
        position: relative;
        gap: 5px;
    }

    .dvVoucher .slick-slide {
        margin-left: 5px;
    }

    .voucherLeft {
        width: 70%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        text-align: center;
        padding: 10px 5px;
    }

    .voucherRight {
        position: absolute;
        top: 0;
        right: 5%;
        width: 50%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .voucherlogo {
        max-width: 100%;
        height: 90%;
        object-fit: contain;
    }

    .label-new, .label-hot, .label-limited {
        position: absolute;
        top: 12px;
        left: -2px;
        font-size: 8px;
        padding: 2px 6px;
        margin: 0;
    }

    .voucherTitle {
        margin-top: 12px;
        font-size: 13px;
        font-weight: bold;
        line-height: 1.2;
    }

    .voucherSubTitle {
        font-size: 11px;
        color: #262D3D;
        line-height: 1.2;
    }

    .voucherDesc {
        font-size: 11px;
        margin-top: 4px;
        padding: 0;
        width: 100%;
        line-height: 1;
    }

    .voucherTC {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 25px;
        margin-bottom: 4px;
        gap: 0;
    }

    .voucherTCLink, .voucherEnd {
        font-size: 10px;
    }

    .btnCollectVoucher, .btnVoucherRANOUT {
        padding: 4px 10px;
        font-size: 11px;
        border-radius: 8px;
    }

    .vouchertooltip {
        font-size: 10px;
        color: black;
        margin-top: 4px;
    }
}

@media screen and (max-width: 475px) {

    .indexItem {
        cursor: pointer;
        padding: 5px;
        /*height: 340px;*/
    }




    .groupName {
        font-size: small;
        color: white;
    }

    .flashsale-wrapper {
        margin-top: 0px;
    }

    .flashsale-img {
        width: 80%;
        display: block;
        margin-top: -30px;
        margin-left: -10px;
    }

    .new-arrivals-img {
        width: 80%;
        margin-top: -25px;
        margin-left: -10px;
    }

    .view-all-link {
        position: absolute;
        left: 82%;
        top: -5px;
        font-size: 0.8rem;
    }

    .view-all-link2 {
        position: absolute;
        left: 75%;
        top: -5px;
        width: 30%;
        font-size: 15px;
    }
}

@media (max-width: 475px) {
    .flashsale-image-col {
        display: none;
    }

    #flashSalesSection .flashsale-product-col {
        width: 100%;
        padding: 0;
        flex: 0 0 100%;
        max-width: 100%;
        margin-right: -10px;
    }

    #flashSalesSection .product-list-container {
        padding: 15px 0;
        min-height: 400px;
        margin: 0;
        width: 100%;
    }

    #flashSalesSection {
        padding: 0;
        margin: 0;
    }

    #dvFlashSalesProductList .respFlashSales {
        margin: 0;
        width: 100%;
    }

        #dvFlashSalesProductList .respFlashSales .indexItem {
            padding: 0 5px;
            width: 48%;
        }
}

@media screen and (max-width: 375px) {

    .indexItem {
        cursor: pointer;
        padding: 5px;
        /*height: 350px;*/
    }

    .groupName {
        font-size: small;
        color: white;
    }

    .voucherCollect {
        padding-top: 0em !important;
    }


    .price {
        font-size: medium;
    }



    .imgaddtocart {
        width: 20px;
    }



    .soldCart {
        border: 1px solid #e5e5e5;
        display: inline-block;
        padding: 10px;
        color: red;
        font-weight: 600;
        font-size: 12px;
        border-radius: 25px;
        transition: all .3s;
        font-size: xx-small;
    }

    .lblsubtitle.textTitle {
        font-size: 15px;
        padding-bottom: 30px;
    }

    .lblsubtitle2 {
        font-size: 1rem;
        padding-bottom: 25px;
    }

    .view-all-link {
        position: absolute;
        left: 75%;
        top: 5px;
        font-size: 0.8rem;
    }
}


@media screen and (max-width: 275px) {

    .indexItem {
        cursor: pointer;
        padding: 5px;
        /*height: 330px;*/
    }

    .groupName {
        font-size: smaller;
        color: white;
    }

    .voucherCollect {
        padding-top: 1.5em !important;
    }
}


.dvBtnFeatured {
    padding: 0px 20%;
}

.btnfeature {
    border-radius: 15px;
    font-size: x-large;
    -webkit-filter: drop-shadow(5px 5px 5px #222 );
    filter: drop-shadow(5px 5px 5px #222);
}




@media screen and (max-width: 575px) {
    .lblsubtitle {
        font-size: large;
    }

    .lblsubtitle2 {
        padding-bottom: 15px;
        font-size: 26px;
        margin-left: -50px;
    }

    .myTitle2 {
        padding-bottom: 15px;
        font-size: 22px;
        margin-left: -50px;
    }

    .dvBtnFeatured {
        padding: 0px 0px;
    }

    .btnfeature {
        font-size: small;
    }

    .sliderTop_Mobile {
        width: 100%;
        height: 100%;
    }
}



.menuicon {
    width: 2.5em;
    height: 2.5em;
}



.bannermember {
    position: relative;
    padding-bottom: 0px !important;
    margin-top: -1px;
}


.btnJoin {
    right: 10%;
    bottom: 45%;
    position: absolute;
    width: 15%;
    max-width: 240px;
    font-weight: bold;
    font-size: large;
    background-color: #E0AF4C;
    border-color: none !important;
}




.paymentimg {
    width: 180px;
}


@media (min-width: 770px) and (max-width: 991px) {

    .paymentimg {
        width: 120px;
    }


    .btnJoin {
        right: 5%;
        bottom: 45%;
        width: 18%;
        font-size: small;
    }
}


@media (min-width: 577px) and (max-width: 699px) {

    .btnJoin {
        right: 5%;
        bottom: 45%;
        width: 18%;
        font-size: x-small;
    }


    .btnAddToCartNew {
        font-size: medium;
    }

    .btnSoldOutNew {
        font-size: medium;
    }
}

@media (max-width: 1000px) {

    .mobile-hide {
        display: none
    }
}
/*Phone Mobile Portrait */
@media (min-width: 361px) and (max-width: 576px) {

    .paymentimg {
        width: 120px;
    }

    .btnJoin {
        right: 2%;
        bottom: 35%;
        width: 22%;
        font-size: 8px;
    }


    .btnAddToCartNew {
        font-size: small;
    }

    .btnSoldOutNew {
        font-size: small;
    }
}


@media (max-width: 360px) {

    .paymentimg {
        width: 100px;
    }


    .btnJoin {
        right: 2%;
        bottom: 35%;
        width: 22%;
        font-size: 8px;
    }

    .btnAddToCartNew {
        font-size: small;
    }

    .btnSoldOutNew {
        font-size: small;
    }
}


.btnAddToCartNew {
    width: 100%;
    height: 38px;
    font-weight: bold;
    border: solid 1px transparent;
    border-radius: 10px;
    background-image: linear-gradient(#E0AF4C, #E0AF4C), linear-gradient(0deg, rgba(173,119,44,1) 0%, rgba(245,160,60,1) 20.85%, rgba(249,193,75,1) 32.96%, rgba(244,234,184,1) 45.23%, rgba(245,160,60,1) 67.78%, rgba(173,119,44,1) 84.88%, rgba(250,195,90,1) 99.63%);
    background-origin: border-box;
    background-clip: content-box, border-box;
    padding: 1px;
}

.btnSoldOutNew {
    width: 100%;
    font-weight: bold;
    color: white;
    background: linear-gradient(27deg, rgba(237,34,36,1) 0%, rgba(137,23,26,1) 100%);
}



.social {
    border-radius: 100%;
    padding: 5px 10px;
    background-color: white;
    color: black;
    margin: 0px 5px;
}


.app-icon {
    width: 180px;
    height: 60px;
}







.modalheader {
    align-items: flex-start;
}



.CongraPopOut {
    background-image: var(--urlImg_CongraPopOut);
    background-size: 100% 100%;
    background-position: center center;
    border-radius: 20px;
    height: 500px;
}


/* ===== Tablet/Desktop styles ===== */
@media screen and (max-width: 320px) {
    .flashsale-product-col {
        margin-top: 0;
    }

    .flashsale-wrapper {
        margin-top: 20px;
    }

    .flashsale-img {
        width: 80%;
        display: block;
        margin-top: -25px;
    }

    .new-arrivals-img {
        width: 80%;
    }

    .lblsubtitle {
        font-size: 0.1rem;
    }

    .lblsubtitle2 {
        font-size: 1rem;
        padding-bottom: 25px;
    }

    .view-all-link2 {
        position: absolute;
        right: 10px;
        top: 10px;
        font-size: 0.5rem;
        color: white;
    }

    .countdown-unit1 {
        font-size: 1.2rem;
    }

    .countdown {
        width: 100%;
    }

    .new-arrivals-img {
        width: 70%;
        display: block;
        margin-top: -25px;
    }

    .view-all-link {
        position: absolute;
        left: 70%;
        top: 10px;
        font-size: 0.5rem;
    }

    .voucherTitle {
        width: 100%;
        margin-top: 10px;
        font-size: 7px;
        font-weight: bold;
        text-align: center;
    }

    .voucherSubTitle {
        font-size: 7px;
        text-align: center;
        color: #262D3D;
        margin-top: -5px;
    }

    .voucherEnd {
        font-size: 7px;
        color: black;
        width: 100%;
        text-align: center;
    }
}
