/* ---------------------------------------------- */
.footer-wrapper button.button-link.go-to-top:active,
.footer-wrapper button.button-link.go-to-top:focus,
button.button-link.inTheMiddle:active,
button.button-link.inTheMiddle:focus {
    border: none !important;
    outline: none !important;
}

html,
body {
    overflow-x: clip;
}

.ds9__page { 
    --CLARINS-FONT: ClarinsRegular, Clarins, "Microsoft Jhenghei";
    --GOTHAM-EXTRALIGHT: "Gotham_ExtraLight", "Microsoft Jhenghei";
    --GOTHAM-LIGHT: "Gotham_Light", "Microsoft Jhenghei";
    --GOTHAM-BOOK: "Gotham SSm book A", "Gotham SSm book B", "Gotham Book",Helvetica, Arial, "Microsoft Jhenghei", sans-serif;
    --GOTHAM-MEDIUM: "Gotham SSm medium A", "Gotham SSm medium B", "Gotham Medium",Helvetica, Arial, "Microsoft Jhenghei", sans-serif;
}

.button--primary:not(.cba-button-style) {
    font-family: "Gotham SSm medium A","Gotham SSm medium B",Helvetica,Arial,"Microsoft Jhenghei",sans-serif;
}

.ds9__suptitle,
.ds9__title,
.ds9__bloc-text,
.ds9__subtitle,
.ds9__approach-slide-title {
    font-weight: bold !important;
}

.ds9__page .ds9__bloc-faq {
    padding-top: 40px;
}

.display-flex {
    display: flex;
}

i-main-video.main-video-player.hide {
    display: none;
}
 
.ds9__skincare-cta .button--primary:not(.cba-button-style) {
    height: 50px !important;
    border: 2px solid #8c0b26 !important;
}
 
.ds9__skincare-cta .button--primary:not(.cba-button-style):active, 
.ds9__skincare-cta .button--primary:not(.cba-button-style):focus {
    outline: none !important;
    border: 2px solid #63021a !important;
}

.ds9__finding-cta {
    display: flex;
    flex-direction: column;
}

.ds9__faq-item-answer p {
    margin: 10px 0;
}

.ds9__faq-item-answer p:first-child {
    margin-top: 0;
}

@media (min-width: 900px) {
    .isMobile{
       display: none;
    }
 
    .anchorMobile{
       pointer-events: none;
       display: none;
    }
 }

@media (min-width: 768px){
    .ds9__page .ds9__header-content {
        max-width: calc(556 * var(--headerWidth));
    }

    .ds9__page .ds9__expert-text {
        margin-left: 0;
    }

    .ds9__page .ds9__research-content-top {
        width: 85%;
        margin-left: 0;
    }
}

@media (orientation: portrait) {
    .isDesktop {
       display: none;
    }

    .anchorMobile{
        pointer-events: initial;
    }
}

@media only screen
and (min-device-width : 834px)
and (max-device-width : 1112px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) {
    .ds9__page .ds9__research-content {
        max-width: calc(458 * var(--reseachWidth));
    }
}


@media only screen
and (min-device-width : 834px)
and (max-device-width : 1112px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2) {
    .ds9__page .ds9__header-content {
        max-width: calc(476 * var(--headerWidth));
    }

    .ds9__page .ds9__skincare-extra {
        left: calc(61% - calc(220* var(--skincareWidth)));
        bottom: -44px;
    }

    .ds9__page .ds9__skincare-bloc {
        height: 580px;
    }

    .ds9__page .ds9__skincare-content {
        padding-left: calc(20 * var(--skincareWidth));
    }
}

/*iPhone 11, 12, 13, 13 Min, and 13 Pro Max*/
@media (max-width: 480px) {
    .header-contact-us {
        margin-right: 4px;
        margin-top: 10px;
    }

    .ds9__page .ds9__skincare-subtitle {
        padding-top: 10px;
    }

    .ds9__page .ds9__approach-title {
        width: 90%;
        margin: 0 auto 10px;
    }

    .ds9__page .ds9__research-content-bottom {
        width: 87%;
    }
}