/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.pdpBanner__container___ELYD- {
        background: #f1f1f1;
        max-width: 416px;
        margin: 0 auto;
        padding: 5px;
        min-height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
    }

.pdpBanner__inner___1QQqp {
        cursor: pointer;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.advantageWithCheck__moneyBack___ZeV06 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        color: #00b16a;
        font-size: 14px;
        line-height: 16px;
        height: 16px;
        margin-bottom: 15px;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        font-weight: 700;
        font-family: var(--font-family-helvetica);
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.advantageWithCheck__moneyBack___ZeV06:last-of-type {
            margin-bottom: 24px;
        }

.advantageWithCheck__icon___2wMKt {
        width: 14px;
        margin-right: 9px;
        display: block;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.itemSlider__sliderContainer___6LIGa {
        width: 690px;
        height: 352px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding-top: 20px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.itemSlider__sliderContainer___6LIGa {
            width: 620px
    }
        }

@media (max-width: 1279.9px) {

.itemSlider__sliderContainer___6LIGa {
            width: 480px;
            height: 252px
    }
        }

.itemSlider__listContainer___cTipL {
        position: absolute;
        bottom: -50px;
    }

.itemSlider__list___3JM1W {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.itemSlider__listItem___OvqN1 {
        width: 16px;
        height: 5px;
        background-color: #dedede;
        outline: none;
        border-radius: 2px;
        cursor: pointer;
    }

.itemSlider__dot___1rPul {
        margin-right: 5px;
    }

.itemSlider__active___28W-t {
        background-color: #3a4850;
    }

.itemSlider__btn___1ug-- {
        position: absolute;
        outline: none;
        cursor: pointer;
        opacity: 0;
    }

.itemSlider__btn___1ug--:disabled {
            display: none;
        }

.itemSlider__next___DiPoM {
        background-color: inherit;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.itemSlider__next___DiPoM {
            right: 25px
    }
        }

@media (max-width: 1279.9px) {

.itemSlider__next___DiPoM {
            right: 30px
    }
        }

.itemSlider__prev___2QC8u {
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
    }

@media (max-width: 1279.9px) {

.itemSlider__prev___2QC8u {
            left: 30px
    }
        }

.itemSlider__arrow___2iUyW {
        position: absolute;
        width: 41px;
        height: 41px;
        right: 0;
        left: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        border: 1px solid #f1f1f1;
        border-radius: 50%;
        -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.07);
                box-shadow: 0 0 8px rgba(0, 0, 0, 0.07);
    }

.itemSlider__arrowIcon___3aJIy {
        position: absolute;
        top: 50%;
        left: 0;
        right: -3px;
        margin: auto;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
        width: 11px;
        height: 17px;
    }

.itemSlider__slider___1ddZf:hover .itemSlider__btn___1ug-- {
                opacity: 1;
            }

.itemSlider__slideImageSSR___2aBjU {
        display: none;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.prescriptionButton__wrapper___2nQGT {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-family: Roboto, Arial, sans-serif;
        cursor: pointer;
        padding: 8px;
        width: 100%;
        height: 88px;
        background-color: #fff;
        border: 1px solid #e7ebed;
        border-radius: 8px;
        -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        z-index: 0;
    }

.prescriptionButton__wrapper___2nQGT:last-child {
            margin-bottom: 0;
        }

.prescriptionButton__wrapper___2nQGT:hover .prescriptionButton__container___NUeOp {
                background-color: #f8f8f8;
            }

.prescriptionButton__container___NUeOp {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        padding: 0 14px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 100%;
        height: 100%;
        min-height: 70px;
        background-color: transparent;
        border-radius: 8px;
    }

.prescriptionButton__title___4tC9f {
        font-size: 18px;
        line-height: 21px;
        font-weight: 400;
        color: #0f0f0f;
    }

.prescriptionButton__iconContainer___40tnf {
        width: 40px;
        height: 30px;
    }

.prescriptionButton__icon___3o2GG {
        stroke: none;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.prescriptionButtonsContainer__wrapper___2gP6S {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.prescriptionButtonsContainer__title___1ae3X {
        font-size: 20px;
        line-height: 24px;
        font-weight: 700;
        color: #0f0f0f;
        margin-bottom: 51px;
    }

.prescriptionButtonsContainer__sendLater___1sYWB {
        margin-top: 40px;
        text-decoration: underline;
        font-size: 18px;
        line-height: 22px;
        color: #5b6971;
        cursor: pointer;
        font-weight: 700;
        font-family: Roboto, Arial, sans-serif;
        padding: 7px 8px;
        border: 1px solid transparent;
        outline: none;
    }

.prescriptionButtonsContainer__sendLater___1sYWB:focus {
            outline: none;
            padding: 7px 8px;
            background: #ddf3ff;
            border: 1px solid #0086e1;
            border-radius: 4px;
        }

.prescriptionButtonsContainer__uploadContainer___UJQ1n {
        position: relative;
        width: 100%;
        margin-bottom: 14px;
        cursor: pointer;
    }

.prescriptionButtonsContainer__btnText___2HQit:focus {
            outline: none;
        }

.prescriptionButtonsContainer__active___2qrIf {
        outline: auto;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.step__wrapper___2ytMD {
        padding: 40px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.progressHeader__progress___1dtvk {
        height: inherit;
        -webkit-transition: width .3s;
        transition: width .3s;
        border-radius: 0 5px 5px 0;
        background: linear-gradient(290.47deg, #3797fa 0%, #45c9ff 100%);
    }

.progressHeader__progressContainer___10keu {
        width: 100%;
        background: #d8d8d8;
        height: 7px;
    }

.progressHeader__title___3cOhm {
        color: #2196f3;
        font-family: Roboto, Arial, sans-serif;
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        text-align: center;
    }

.progressHeader__container___2wnvk {
        background: #fff;
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

.progressHeader__head___3CLf4 {
        position: relative;
        padding: 21px 0 14px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.progressHeader__cross___1Gi9n {
        position: absolute;
        display: block;
        height: 40px;
        width: 40px;
        right: -7px;
        top: -8px;
        outline: none;
    }

.progressHeader__cross___1Gi9n::before, .progressHeader__cross___1Gi9n::after {
            content: '';
            position: absolute;
            right: 0;
            margin: auto;
            left: 0;
            top: 50%;
            background: #89959c;
            height: 2px;
            width: 15px;
            border-radius: 5px;
        }

.progressHeader__cross___1Gi9n::after {
            -webkit-transform: rotate(-45deg);
                    transform: rotate(-45deg);
        }

.progressHeader__cross___1Gi9n::before {
            -webkit-transform: rotate(45deg);
                    transform: rotate(45deg);
        }

.progressHeader__back___2tDSd {
        position: absolute;
        top: -15px;
        color: #89959c;
        font-family: Roboto, Arial, sans-serif;
        font-size: 16px;
        line-height: 19px;
        cursor: pointer;
        margin-top: -7px;
        padding: 7px 8px;
        border: 1px solid transparent;
        outline: none;
        width: 69px;
        height: 35px;
    }

.progressHeader__back___2tDSd:focus {
            outline: none;
            padding: 7px 8px;
            background: #ddf3ff;
            border: 1px solid #0086e1;
            border-radius: 4px;
        }

.progressHeader__btn___3KM99 {
        position: absolute;
        right: 18px;
        top: 17px;
        width: 30px;
        height: 28px;
        padding: 7px 8px;
        cursor: pointer;
        border: 1px solid transparent;
        outline: none;
    }

.progressHeader__btn___3KM99:focus {
            outline: none;
            padding: 7px 8px;
            background: #ddf3ff;
            border: 1px solid #0086e1;
            border-radius: 4px;
        }

.progressHeader__btnText___1_Rf0 {
        position: absolute;
        width: 95px;
        height: 50px;
        left: -5px;
        top: -9px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.progressHeader__btnText___1_Rf0:focus {
            outline: none;
        }

.progressHeader__icon___37xGR {
        height: 12px;
        width: 8px;
        margin-right: 8px;
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
        position: absolute;
        left: 10px;
        top: 10px;
    }

.progressHeader__leftSide___1Df13 {
        position: absolute;
        left: 19px;
        min-width: 52px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.sendLater__wrapper___3uayW {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        color: #0f0f0f;
    }

.sendLater__title___3ipgA {
        font-size: 20px;
        line-height: 24px;
        font-weight: 700;
        margin-bottom: 80px;
    }

.sendLater__iconContainer___2sHY3 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 88px;
        height: 88px;
        background-color: #fff;
        border-radius: 50%;
        padding: 32px 20px 20px;
        margin-bottom: 40px;
    }

.sendLater__strongText___1VSZ3 {
        font-size: 18px;
        line-height: 28px;
        margin-bottom: 12px;
    }

.sendLater__text___1tF5t {
        text-align: center;
        margin-bottom: 77px;
        font-size: 16px;
        font-weight: 300;
    }

.sendLater__ctaButtonContainer___1PGwl {
        width: 282px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.successPrescription__wrapper___3pn0d {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-family: Roboto, Arial, sans-serif;
    }

.successPrescription__titleContainer___1x2pW {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 20px;
    }

.successPrescription__iconContainer___3lTT4 {
        width: 28px;
        padding: 6px;
        height: 28px;
        margin-right: 10px;
        border-radius: 50%;
        background-color: #00b16a;
    }

.successPrescription__icon___1VXfV {
        color: #fff;
    }

.successPrescription__textIcon___2IPqu {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
    }

.successPrescription__textIconContainer___dqW1S {
        position: relative;
        width: 60px;
        height: 70px;
        margin-bottom: 16px;
    }

.successPrescription__documentIcon___Km2Rj {
        width: 100%;
    }

.successPrescription__title___1MdS7 {
        font-size: 20px;
        line-height: 37px;
        margin: 0;
        font-weight: 700;
        color: #00b16a;
    }

.successPrescription__successTitle___35unF {
        font-size: 16px;
        line-height: 24px;
        font-weight: 400;
        color: #3a4850;
        text-align: center;
        margin-bottom: 34px;
    }

.successPrescription__image___FPpJm {
        max-height: 173px;
        max-width: 320px;
        margin-bottom: 16px;
        border: 1px solid #89959c;
        border-radius: 3px;
    }

.successPrescription__fileName___qCSDF {
        font-size: 16px;
        line-height: 24px;
        font-weight: 400;
        color: #3a4850;
        margin-bottom: 78px;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 310px;
        white-space: nowrap;
        text-align: center;
    }

.successPrescription__ctaButtonContainer___2U7fX {
        width: 282px;
        margin-bottom: 15px;
    }

.successPrescription__uploadTextErrorContainer___2-4Nj {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 16px;
    }

.successPrescription__wrongImageTitle___s17Gc {
        font-weight: 300;
        line-height: 19px;
    }

.successPrescription__uploadButton___1Fmi4 {
        text-decoration: underline;
        color: #ff6c00;
        font-weight: 400;
        margin-left: 4px;
        cursor: pointer;
    }

.successPrescription__uploadWrapper___-0H5b {
        position: relative;
        cursor: pointer;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.errorPrescription__wrapper___2vj1k {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-family: Roboto, Arial, sans-serif;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

.errorPrescription__title___Tez08 {
        font-weight: 700;
        color: #0f0f0f;
        font-size: 20px;
        line-height: 37px;
        margin-bottom: 20px;
    }

.errorPrescription__alertMessage___1Syb5 {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        color: #d2431e;
        margin-bottom: 91px;
        width: 280px;
        text-align: center;
    }

.errorPrescription__uploadButton___3hAIO {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        cursor: pointer;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        border-radius: 24px;
        width: 290px;
        height: 50px;
        padding: 14px 37px;
        background-color: #2196f3;
        -webkit-box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.1);
                box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.1);
    }

.errorPrescription__uploadContainer___1pmX0 {
        position: relative;
        margin-bottom: 28px;
        width: 290px;
        height: 50px;
    }

.errorPrescription__buttonText___39xBY {
        font-size: 18px;
        color: #fff;
        font-weight: 700;
        line-height: 22px;
        margin-right: 19px;
    }

.errorPrescription__iconContainer___3Dm1P {
        width: 35px;
        height: 25px;
    }

.errorPrescription__icon___1W0db {
        stroke-width: 2;
    }

.errorPrescription__icon___1W0db path {
            stroke: #fff;
            fill: none;
        }

.errorPrescription__icon___1W0db path:nth-of-type(3) {
                display: none;
            }

.errorPrescription__skip___35aj5 {
        font-size: 16px;
        line-height: 19px;
        color: #5b6971;
        font-weight: 300;
        text-decoration: underline;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.colors__wrapper___2yFeE {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        font-family: Roboto, Arial, sans-serif;
        position: relative;
    }

.colors__title___1a313 {
        font-size: 20px;
        font-weight: 700;
        line-height: 24px;
        color: #0f0f0f;
        margin-bottom: 79px;
        text-align: center;
    }

.colors__inValidColor___3e1p- {
        margin-bottom: 16px;
    }

.colors__subtitle___1Oslv {
        font-size: 16px;
        line-height: 25px;
        color: #d2431e;
        margin-bottom: 38px;
        text-align: center;
    }

.colors__dropdownContainer___CYD7A {
        background-color: #fff;
        padding: 16px 19px;
        border-radius: 8px;
        margin-bottom: 245px;
        -webkit-box-shadow: 0 0 10px -4px rgba(0, 0, 0, 0.4);
                box-shadow: 0 0 10px -4px rgba(0, 0, 0, 0.4);
    }

.colors__ctaButton___1tfqB {
        width: 282px;
        -ms-flex-item-align: center;
            align-self: center;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.customizeQuantity__dropdown___3GxM3 {
        background: #fff;
        margin-bottom: 20px;
        border-radius: 4px;
    }

.customizeQuantity__row___1wC2z {
        padding: 0 28px 24px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.cardBox__wrapper___h-VJG {
        padding: 6px;
    }

.cardBox__wrapper___h-VJG:hover .cardBox__container___1gaTc {
                background-color: #f8f8f8;
                border-radius: 6px;
            }

.cardBox__bottom___1EvB6, .cardBox__top___2ZCaa {
        border-top: 1px solid #e7ebed;
    }

.cardBox__bottom___1EvB6 {
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }

.cardBox__top___2ZCaa {
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

.cardBox__title___2Cx2b {
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 16px;
        line-height: 19px;
        font-weight: 400;
        margin: 0 0 0 21px;
    }

.cardBox__description___3l5uR {
        color: #3a4850;
        font-family: Roboto, Arial, sans-serif;
        font-size: 16px;
        line-height: 19px;
        position: relative;
        font-weight: 300;
    }

.cardBox__description___3l5uR::before {
            content: "";
            position: absolute;
            height: 2px;
            width: 14px;
            background-color: #e7ebed;
            top: 10px;
            left: -33px;
        }

.cardBox__row____AEOJ {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 18px 45px 18px 27px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        cursor: pointer;
    }

.cardBox__titleSide___1WOpf {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.containerCustomizeQuantity__title___3XVBz {
        font-family: Roboto, Arial, sans-serif;
        color: #0f0f0f;
        font-size: 20px;
        font-weight: 700;
        line-height: 24px;
        text-align: center;
        margin-bottom: 67px;
    }

.containerCustomizeQuantity__titleLessMargin___1WYSQ {
        margin-bottom: 32px;
    }

.containerCustomizeQuantity__bottom___ChMPX {
        max-width: 282px;
        margin: 215px auto 0;
    }

.containerCustomizeQuantity__lessMargin___lMuzk {
        margin: 41px auto 0;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.addCoCart__cta___33cmt {
        width: 282px;
    }

.addCoCart__text___3UP01 {
        color: #ff6c00;
        text-decoration: underline;
        font-weight: 300;
    }

.addCoCart__btn___2Dopg {
        font-size: 16px;
        line-height: 19px;
        cursor: pointer;
        margin-top: 17px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.priceContainer__priceContainer___3vThj {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        margin-bottom: 42px;
        padding-bottom: 26px;
        border-bottom: 1px solid #dedede;
        font-size: 16px;
        line-height: 19px;
    }

.priceContainer__pricePerBoxContainer___Mw6rc {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        color: #3a4850;
        margin-bottom: 13px;
    }

.priceContainer__totalPriceContainer___2cT4q {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        color: #89959c;
    }

.priceContainer__loader___T4rGU {
        margin: 5px 0 10px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.moneyBackAndFreeShipping__container___3IcQr {
        width: 400px;
        padding: 21px 16px 21px 28px;
    }

.moneyBackAndFreeShipping__item___23TjQ {
        color: #0f0f0f;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 23px;
    }

.moneyBackAndFreeShipping__item___23TjQ:last-child {
            margin-bottom: 0;
        }

.moneyBackAndFreeShipping__icon___2OG58 {
        width: 66px;
        margin-right: 28px;
    }

.moneyBackAndFreeShipping__content___tQFwI {
        width: 380px;
    }

.moneyBackAndFreeShipping__title___12FrZ {
        color: #0f0f0f;
        font: 700 16px/19px Roboto, Arial, sans-serif;
        margin-bottom: 5px;
    }

.moneyBackAndFreeShipping__text___1XtLt {
        color: #3a4850;
        font: 300 14px/18px Roboto, Arial, sans-serif;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.FSAPopup__container___23D1G {
        width: 678px;
        padding: 36px;
        color: #2d2d2d;
    }

.FSAPopup__header___1YMeo {
        margin: 0;
        padding: 0;
        font-weight: 700;
        line-height: 20px;
    }

.FSAPopup__header___1YMeo.FSAPopup__large___3zZhX {
        font-size: 27px;
        margin-bottom: 32px;
    }

.FSAPopup__header___1YMeo.FSAPopup__small___2Bx61 {
        font-size: 19px;
        margin-bottom: 12px;
    }

.FSAPopup__paragraph___3Tq3B, .FSAPopup__listItem___2JBUD {
        margin-bottom: 15px;
        font-size: 14px;
        color: #2d2d2d;
        line-height: 21px;
    }

.FSAPopup__paragraph___3Tq3B:last-child {
        margin-bottom: 0;
    }

.FSAPopup__numberedList___13QS8 {
        list-style-type: none;
    }

.FSAPopup__numberedList___13QS8 .FSAPopup__listItem___2JBUD {
            counter-increment: item;
        }

.FSAPopup__numberedList___13QS8 .FSAPopup__listItem___2JBUD::before {
                content: counter(item) ". ";
                font-weight: 700;
            }

.FSAPopup__imagesSequence___3Btxm {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 9px;
    }

.FSAPopup__link___1pPkO {
        color: #000;
        padding: 0 .35em;
        text-decoration: underline;
        cursor: pointer;
    }

.FSAPopup__link___1pPkO.FSAPopup__blue___1q_7P {
            color: #23aae2;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.MBGPopup__popup___1BHym, .MBGPopup__placeholder___20LGO {
        width: 500px;
        min-height: 294px;
    }

.MBGPopup__placeholder___20LGO {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.MBGPopup__popup___1BHym {
        padding: 36px 40px;
    }

.MBGPopup__popup___1BHym .MBGPopup__title___JzJfz {
            padding-bottom: 20px;
            margin-bottom: 20px;
            border-bottom: 1px solid #c8c8c8;
            font-size: 28px;
            font-weight: 700;
            color: #2d2d2d;
        }

.MBGPopup__popup___1BHym .MBGPopup__content___2cNEm {
            color: #4d4d4d;
            font-size: 14px;
            line-height: 22px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.freeShippingPopup__popup___HoJEw, .freeShippingPopup__placeholder___2gSNU {
        width: 500px;
    }

.freeShippingPopup__placeholder___2gSNU {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.freeShippingPopup__popup___HoJEw {
        padding: 36px 40px;
    }

.freeShippingPopup__popup___HoJEw .freeShippingPopup__title___2aIX1 {
            padding-bottom: 20px;
            margin-bottom: 20px;
            border-bottom: 1px solid #c8c8c8;
            font-size: 28px;
            line-height: 24px;
            color: #2d2d2d;
        }

.freeShippingPopup__popup___HoJEw .freeShippingPopup__content___3tLAj {
            color: #4d4d4d;
            font-size: 14px;
            line-height: 22px;
        }

.freeShippingPopup__link___3L2VE {
        font-size: 13px;
        letter-spacing: .51px;
        text-decoration: underline;
        color: #9b9b9b;
    }

.freeShippingPopup__link___3L2VE:hover {
            color: #5ecfea;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.advantages__advantages___1_iIk {
        margin-top: 24px;
        font-family: Roboto, Arial, sans-serif;
    }

.advantages__advantages___1_iIk .advantages__item___2xB30 {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            color: #00b16a;
            font-size: 14px;
            line-height: 16px;
            margin-bottom: 5px;
        }

.advantages__advantages___1_iIk .advantages__icon___x1Nsd {
            margin-right: 6px;
            -webkit-transform: translateY(2px);
                    transform: translateY(2px);
        }

.advantages__advantages___1_iIk .advantages__link___1T1HU {
            color: inherit;
            cursor: pointer;
            font-weight: 700;
        }

.advantages__advantages___1_iIk .advantages__link___1T1HU:hover {
                text-decoration: underline;
            }

.advantages__advantages___1_iIk .advantages__text___19WN7 {
            display: inline-block;
            margin: 0 5px;
        }

.advantages__advantages___1_iIk .advantages__questionMark___1_1pw {
            cursor: pointer;
            display: inline-block;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.quickCheckout__container___3l6t0 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 582px;
        height: 448px;
    }

.quickCheckout__container___3l6t0 .quickCheckout__buyOneButton___3NSkz {
            margin: 16px 0 0;
        }

.quickCheckout__container___3l6t0 .quickCheckout__buyAllButton___o88RG .quickCheckout__buttonWrap___3oUrD {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
            }

.quickCheckout__content___3u-m3 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 430px;
        padding: 31px 0;
    }

.quickCheckout__title___K59I- {
        color: #0f0f0f;
        font-size: 20px;
        letter-spacing: 0;
        line-height: 30px;
        font-weight: 700;
    }

.quickCheckout__excessWarning___1KsDq {
        color: #3a4850;
        font-size: 16px;
        letter-spacing: 0;
        line-height: 23px;
        margin: 11px 0 39px;
    }

.quickCheckout__addToCart___RpJ1z {
        font-size: 16px;
        letter-spacing: .25px;
        line-height: 19px;
        color: #ff6c00;
        text-decoration: underline;
        margin: 44px 0 0;
        cursor: pointer;
        font-weight: 700;
    }

.quickCheckout__totalPrice___mJx7d {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 70px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.bottomQuickCheckout__container___N4J2n {
        margin-top: 12px;
    }

.bottomQuickCheckout__containerSmall___1Zus_ {
        margin-top: 8px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.bottomQuickCheckoutCL__cta___2eXum {
        width: 282px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.counting__wrapper___3TfTG {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-family: Roboto, Arial, sans-serif;
    }

.counting__titleWrapper___1cORR {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 42px;
    }

.counting__title___3nzoR {
        font-size: 20px;
        line-height: 24px;
        font-weight: 300;
        color: #0f0f0f;
        margin-left: 20px;
        margin-bottom: 0;
    }

.counting__iconWrapper___3Ayl8 {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background-color: #2196f3;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 7px;
    }

.counting__icon___37ESP {
        color: #fff;
    }

.counting__keepInformationContainer___2rtPq {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        background-color: #fff;
        border-radius: 12px;
        padding: 20px;
        width: 100%;
        margin-bottom: 26px;
        cursor: pointer;
    }

.counting__keepInformationWrapper___30kyc {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 14px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.counting__keepInformationWrapper___30kyc:last-child {
            margin-bottom: 0;
        }

.counting__keepInformationTitle___ZAGEn {
        font-size: 16px;
        line-height: 19px;
        font-weight: 700;
        color: #3a4850;
        margin-left: 20px;
    }

.counting__content___1obv2 {
        font-size: 14px;
        font-weight: 300;
        line-height: 23px;
        color: #5b6971;
    }

.counting__rxIconWrapper___3AgOd {
        width: 38px;
        height: 37px;
        margin-left: 27px;
    }

.counting__rxIcon___1HGV1 {
        color: #2196f3;
    }

.counting__advantagesContainer___3q9la {
        margin-bottom: 42px;
    }

.counting__cta___3AvAj {
        width: 282px;
    }

.counting__advantage___1_J_7 {
        margin-bottom: 10px;
    }

.counting__advantage___1_J_7:last-child {
            margin-bottom: 0;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.readPrescriptionModal__container___9A9Rk {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        width: 698px;
        height: 642px;
        padding: 30px;
        font-family: Roboto, Arial, sans-serif;
        overflow: hidden;
    }

.readPrescriptionModal__modalTopSectionItem___wC0DM:last-child {
            margin-top: -25px;
            padding: 25px;
            background-color: #f7f8f9;
            border-radius: 4px;
        }

.readPrescriptionModal__title___3VMva {
        font-size: 18px;
        line-height: 21px;
        font-weight: 700;
        color: #2d2d2d;
        margin-bottom: 25px;
    }

.readPrescriptionModal__topModalSubtitle___hzeiu {
        font-size: 16px;
        line-height: 19px;
        font-weight: 400;
        color: #2a2727;
        margin-bottom: 16px;
    }

.readPrescriptionModal__prescriptionSourcesList___2hhrR {
        margin-left: 5px;
    }

.readPrescriptionModal__sourceListItem___3bW_5 {
        position: relative;
        font-weight: 300;
        font-size: 14px;
        line-height: 24px;
    }

.readPrescriptionModal__sourceListItem___3bW_5::before {
            content: '';
            position: absolute;
            top: 50%;
            -webkit-transform: translateY(-50%);
                    transform: translateY(-50%);
            left: -7px;
            width: 3px;
            height: 3px;
            background-color: #2a2727;
            border-radius: 50%;
        }

.readPrescriptionModal__radioButtonTitle___3-xbP {
        margin-left: 8px;
        font-weight: 300;
    }

.readPrescriptionModal__tableContainer___2MRiK {
        margin-top: 39px;
        min-height: 140px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.readPrescriptionModal__tableItem___ogdsr {
        font-size: 12px;
        color: #2a2727;
    }

.readPrescriptionModal__tableTitle___3I52i {
        font-size: 14px;
        color: #2d2d2d;
        font-weight: 700;
    }

.readPrescriptionModal__itemsWrapper___3hPsa {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.readPrescriptionModal__item___3IAqY {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        width: 50%;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
    }

.readPrescriptionModal__buttonRow___3K8z8 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 16px;
    }

.readPrescriptionModal__buttonRow___3K8z8:last-child {
            margin-bottom: 0;
        }

.readPrescriptionModal__tableWrapper___7SdGu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 639px;
        height: 133px;
    }

.readPrescriptionModal__tableColumn___2mph9 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        border-bottom: .6px solid #979797;
        position: relative;
    }

.readPrescriptionModal__tableColumn___2mph9:last-child {
            border-right: 1px solid #979797;
        }

.readPrescriptionModal__tableNumber___2Y0Lp {
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
        width: 19px;
        height: 19px;
        border-radius: 50%;
        background-color: #2196f3;
        text-align: center;
        top: -11px;
        font-size: 14px;
        line-height: 20px;
        color: #fff;
    }

.readPrescriptionModal__tableCellContainer___krRjc {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.readPrescriptionModal__tableCellWrapper___1n_IX {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
    }

.readPrescriptionModal__boxValueWrapper___1g4R0 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        margin-right: 14px;
    }

.readPrescriptionModal__boxValueWrapper___1g4R0:last-child {
            margin-right: 0;
        }

.readPrescriptionModal__tableCell___3VQ8F {
        padding: 7px 20px 5px;
        text-align: center;
        border: 1px solid #979797;
        border-bottom: none;
        border-right: none;
        min-height: 37px;
    }

.readPrescriptionModal__listContainer___2BC-t {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        margin-top: 19px;
        overflow-y: scroll;
        padding: 17px;
        background-color: #f7f8f9;
        max-height: 269px;
        border-radius: 4px;
        margin-left: -16px;
    }

.readPrescriptionModal__itemTitleWrap___1hG9N {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 16px;
    }

.readPrescriptionModal__descriptionNumber___1h2-J {
        width: 18px;
        height: 18px;
        background-color: #2196f3;
        color: #fff;
        font-size: 14px;
        line-height: 17px;
        text-align: center;
        border-radius: 50%;
        padding-top: 1px;
    }

.readPrescriptionModal__descriptionTitle___2hzyu {
        font-size: 16px;
        line-height: 26px;
        font-weight: 700;
        color: #2d2d2d;
        margin-left: 8px;
    }

.readPrescriptionModal__descriptionText___1yClc {
        font-size: 16px;
        line-height: 26px;
        font-weight: 300;
        color: #2d2d2d;
    }

.readPrescriptionModal__underlinedText___1MSj3 {
        font-size: 16px;
        line-height: 19px;
        color: #2a2727;
        text-decoration: underline;
        margin-top: 25px;
    }

.readPrescriptionModal__prescriptionItem___2-VuL {
        margin-bottom: 22px;
        padding: 0 20px;
    }

.readPrescriptionModal__boxContactsContainer___NyogB {
        width: 485px;
        height: 95px;
        border: 1px solid #b0bdc5;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    }

.readPrescriptionModal__boxContactsContainer___NyogB::before {
            content: '';
            position: absolute;
            height: 10px;
            top: -10px;
            right: -3px;
            background-color: #f6f6f6;
            border: 1px solid #b0bdc5;
            border-bottom: none;
            -webkit-transform: skewX(-45deg);
                    transform: skewX(-45deg);
            width: 100%;
        }

.readPrescriptionModal__boxContactsContainer___NyogB::after {
            content: '';
            position: absolute;
            height: 16px;
            width: 16px;
            top: -18px;
            right: -8px;
            background-color: #fff;
            border-bottom: 1px solid #b0bdc5;
            -webkit-transform: rotate(43deg);
                    transform: rotate(43deg);
        }

.readPrescriptionModal__checkboxValueWrapper___uYPPF {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.readPrescriptionModal__boxNumber___2LCB6 {
        background-color: #2196f3;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        padding-top: 1px;
        font-size: 14px;
        line-height: 17px;
        text-align: center;
        color: #fff;
        margin-bottom: 8px;
    }

.readPrescriptionModal__boxSection___1er06 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
        margin-left: 33px;
    }

.readPrescriptionModal__boxSection___1er06:first-child {
            margin-left: 0;
        }

.readPrescriptionModal__boxColumn___2Rd3W {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

.readPrescriptionModal__boxRow___2H1Z8 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.readPrescriptionModal__checkbox___1SNpt {
        width: 17px;
        height: 17px;
        border-radius: 1px;
        border: 1px solid #2a2727;
    }

.readPrescriptionModal__checkboxPrescriptionText___1kl7M {
        font-size: 14px;
        line-height: 19px;
        font-weight: 700;
        color: #2a2727;
    }

.readPrescriptionModal__side___1RibL {
        margin-left: 4px;
        font-size: 14px;
        line-height: 19px;
        color: #2a2727;
    }

.readPrescriptionModal__boxTitleRow___1Cb_8 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end;
    }

.readPrescriptionModal__boxTitle___3ULX5 {
        font-size: 18px;
        font-weight: 700;
        line-height: 17px;
        color: #2d2d2d;
    }

.readPrescriptionModal__boxSubtitle___29RDH {
        font-size: 12px;
        line-height: 14px;
        color: #2d2d2d;
        margin-left: 4px;
    }

.readPrescriptionModal__boxValue___1uH5b {
        font-size: 14px;
        line-height: 16px;
        color: #2d2d2d;
        font-weight: 400;
        margin-top: 4px;
    }

.readPrescriptionModal__checkboxWrapper___2TRbM {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 77px;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.howToReadMyPrescription__btn___vK6Oy {
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 14px;
        font-weight: 300;
        line-height: 16px;
        margin-left: auto;
        text-decoration: underline;
        display: block;
        cursor: pointer;
        padding: 7px 8px;
        margin-top: -7px;
        border: 1px solid transparent;
        outline: none;
    }

.howToReadMyPrescription__btn___vK6Oy:focus {
            outline: none;
            padding: 7px 8px;
            background: #ddf3ff;
            border: 1px solid #0086e1;
            border-radius: 4px;
        }

.howToReadMyPrescription__btnText___w7H28:focus {
            outline: none;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.row__eyeTitle___1ezZr {
        color: #323c47;
        font-family: var(--font-family-helvetica);
        font-size: 18px;
        font-weight: 700;
        line-height: 24px;
        margin-bottom: 22px;
    }

.row__side___3P3e_ {
        font-weight: 300;
    }

.row__fields___bbYvw > div {
            -webkit-box-flex: 1;
                -ms-flex: 1 1;
                    flex: 1 1;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;
        }

.row__fields___bbYvw > div > div {
            -webkit-box-flex: 1;
                -ms-flex: 1 1 33%;
                    flex: 1 1 33%;
            background: #fff;
            margin-bottom: 16px;
            border-radius: 4px;
        }

.row__fields___bbYvw.row__evenCount___Ox8H6 > div > div {
            -webkit-box-flex: 1;
                -ms-flex: 1 1 50%;
                    flex: 1 1 50%;
            background: #fff;
            margin-bottom: 16px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.fillItOnlineContent__ctaButtonWrapper___I2VS4 {
        margin-top: 104px;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.fillItOnlineContent__ctaButton___2ovp3 {
        width: 282px;
    }

.fillItOnlineContent__checkbox___3IY_e {
        background: #fff;
        padding: 10px;
        margin-top: 30px;
        border-radius: 4px;
    }

.fillItOnlineContent__text___1Aov4 {
        margin-left: 14px;
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 14px;
        font-weight: 300;
        line-height: 16px;
    }

.fillItOnlineContent__title___35gW- {
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 20px;
        font-weight: 700;
        line-height: 24px;
        text-align: center;
        margin-bottom: 80px;
    }

.fillItOnlineContent__errorTitle___1nPQ- {
        margin-bottom: 16px;
    }

.fillItOnlineContent__error___3NDsZ {
        color: #d2431e;
        text-align: center;
        margin-bottom: 39px;
        font-family: Roboto, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
    }

.fillItOnlineContent__thin___P3iEt {
        font-weight: 300;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.steps__wrapper___1HH37 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        height: 100%;
        width: 100%;
    }

.steps__wrapper___1HH37.steps__animate___2DVPa .steps__imageContainer___1CXBO {
                opacity: 1;
                -webkit-transform: scale(1);
                        transform: scale(1);
                -webkit-transition: opacity .3s linear .4s, -webkit-transform .4s linear .3s;
                transition: opacity .3s linear .4s, -webkit-transform .4s linear .3s;
                transition: opacity .3s linear .4s, transform .4s linear .3s;
                transition: opacity .3s linear .4s, transform .4s linear .3s, -webkit-transform .4s linear .3s;
            }

.steps__wrapper___1HH37.steps__animate___2DVPa .steps__stepsContainer___1hT7V {
                opacity: 1;
                -webkit-transform: translateX(0);
                        transform: translateX(0);
                -webkit-transition: opacity .6s ease-in-out, -webkit-transform .3s ease-out;
                transition: opacity .6s ease-in-out, -webkit-transform .3s ease-out;
                transition: transform .3s ease-out, opacity .6s ease-in-out;
                transition: transform .3s ease-out, opacity .6s ease-in-out, -webkit-transform .3s ease-out;
                -webkit-transition-delay: .4s;
                        transition-delay: .4s;
            }

.steps__imageContainer___1CXBO {
        font-family: Roboto, Arial, sans-serif;
        opacity: 0;
        -webkit-transform: scale(.95);
                transform: scale(.95);
        -webkit-transition: opacity .5s linear, -webkit-transform .5s linear;
        transition: opacity .5s linear, -webkit-transform .5s linear;
        transition: opacity .5s linear, transform .5s linear;
        transition: opacity .5s linear, transform .5s linear, -webkit-transform .5s linear;
    }

.steps__itemWrapper___UqtfV {
        width: 614px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

@media (max-width: 1279.9px) {

.steps__itemWrapper___UqtfV {
            width: 335px
    }
        }

.steps__image___3Q2Ex {
        width: 100%;
        -webkit-transform: scale(1.12);
                transform: scale(1.12);
        z-index: 20;
        -webkit-transition: .5s;
        transition: .5s;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.steps__image___3Q2Ex {
            -webkit-transform: scale(1.01);
                    transform: scale(1.01)
    }
        }

@media (max-width: 1279.9px) {

.steps__image___3Q2Ex {
            -webkit-transform: scale(1);
                    transform: scale(1)
    }
        }

.steps__itemName___1cAUO {
        font-size: 20px;
        line-height: 24px;
        font-weight: 400;
        color: #3a4850;
        margin-top: 45px;
    }

.steps__itemType___2OC9t {
        font-size: 16px;
        line-height: 19px;
        font-weight: 400;
        color: #89959c;
        margin-top: 12px;
    }

.steps__stepsContainer___1hT7V {
        width: 500px;
        min-height: 654px;
        border: 1px solid #dedede;
        background-color: #f2f3f5;
        -webkit-box-shadow: 0 0 12px 4px rgba(102, 102, 102, 0.06);
                box-shadow: 0 0 12px 4px rgba(102, 102, 102, 0.06);
        border-radius: 12px;
        -webkit-transform: translateX(12vw);
                transform: translateX(12vw);
        opacity: 0;
        -webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
        transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
        transition: transform .3s ease-out, opacity .3s ease-out;
        transition: transform .3s ease-out, opacity .3s ease-out, -webkit-transform .3s ease-out;
        z-index: 30;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.wizardContainer__container___1rmT7 {
        position: fixed;
        background: transparent;
        -webkit-transition: background .3s linear .3s;
        transition: background .3s linear .3s;
        height: 100vh;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 100;
    }

.wizardContainer__container___1rmT7.wizardContainer__animate___vsfI4 {
            background: #fff;
            -webkit-transition: background .3s linear;
            transition: background .3s linear;
        }

.wizardContainer__container___1rmT7.wizardContainer__animate___vsfI4 .wizardContainer__header___3elsK {
                opacity: 1;
                -webkit-transition: opacity .3s linear 1s;
                transition: opacity .3s linear 1s;
            }

.wizardContainer__wrapper___9T60u {
        border-bottom: 1px solid #f1f3f4;
        width: 100%;
    }

.wizardContainer__header___3elsK {
        padding: 15px 0;
        max-width: 1440px;
        margin: 0 auto;
        opacity: 0;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.wizardContainer__header___3elsK {
            max-width: 1280px
    }
        }

.wizardContainer__logo___nJaRP {
        height: 34px;
        width: 102px;
        margin-left: 92px;
    }

@media (max-width: 1279.9px) {

.wizardContainer__logo___nJaRP {
            margin-left: 48px
    }
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.wizardContainer__logo___nJaRP {
            margin-left: 61px
    }
        }

.wizardContainer__content___i9fzF {
        margin: auto;
        position: absolute;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
        top: 50%;
        left: 0;
        right: 0;
        width: 1166px;
    }

@media (max-width: 1279.9px) {

.wizardContainer__content___i9fzF {
            width: 875px
    }
        }

.wizardContainer__body___3pMMo {
        overflow-y: scroll;
    }

.wizardContainer__html___EJUyl {
        position: fixed;
        width: 100%;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.topSection__container___1pZgE {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 0 40px 120px;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        background-color: #fff;
        z-index: 10;
        margin-top: 38px;
        min-height: 502px;
    }

.topSection__container___1pZgE.topSection__animate___QdsKh {
            min-height: 100vh;
            -webkit-transition: min-height .5s linear;
            transition: min-height .5s linear;
        }

.topSection__productInfoContainer___1ZBmK {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        margin-left: 80px;
        width: 416px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.topSection__productInfoContainer___1ZBmK {
            margin-left: 45px
    }
        }

@media (max-width: 1279.9px) {

.topSection__productInfoContainer___1ZBmK {
            margin-left: 24px
    }
        }

.topSection__title___3U34r {
        margin-bottom: 24px;
        font-weight: 700;
        color: #0f0f0f;
        line-height: 33px;
        font-size: 28px;
    }

.topSection__subtitle___2RIpq {
        margin-bottom: 12px;
        font-weight: 400;
        color: #89959c;
        line-height: 19px;
        font-size: 16px;
    }

.topSection__line___2huer {
        height: 1px;
        width: 100%;
        background: -webkit-gradient(linear, right top, left top, from(rgba(245, 247, 247, 0)), to(#f2f3f5));
        background: linear-gradient(270deg, rgba(245, 247, 247, 0) 0%, #f2f3f5 100%);
        margin-bottom: 12px;
    }

.topSection__priceBlock___26BgV {
        margin-bottom: 20px;
        font-size: 18px;
        color: #0f0f0f;
    }

.topSection__banner___3mHyT {
        margin-bottom: 24px;
        width: inherit;
        background: transparent;
    }

.topSection__appliedCoupon___2jzXf {
        color: #89959c;
        font-size: 16px;
        line-height: 19px;
        width: 100%;
        margin-top: 5px;
    }

.topSection__commonViewFont___1qmIp {
        font-size: 18px;
        line-height: 26px;
    }

.topSection__coupon___3HLlk {
        text-transform: uppercase;
        font-weight: 400;
    }

.topSection__uhcDiscountPrice___1phfn {
        margin-left: 3px;
        color: #0f0f0f;
        font-size: 16px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.productDetails__wrapper___2_iul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: 76px;
        padding: 0 20px;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 970px;
        font-family: Roboto, Arial, sans-serif;
    }

@media (min-width: 1280px) and (max-width: 1439.9px), (max-width: 1279.9px) {

.productDetails__wrapper___2_iul {
            width: 912px
    }
        }

.productDetails__descriptionWrapper___3d6jp {
        width: 50%;
    }

.productDetails__description___3Cbm5 {
        font-size: 18px;
        color: #0f0f0f;
        line-height: 33px;
    }

.productDetails__detailsWrapper___xL2Gn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        width: 343px;
    }

.productDetails__detailsItem___my40Z {
        margin-top: 24px;
        position: relative;
        line-height: 19px;
        color: #0f0f0f;
        font-weight: 300;
    }

.productDetails__detailsItem___my40Z:first-child {
            margin-top: 0;
        }

.productDetails__detailsItem___my40Z::before {
            content: '';
            font-size: 30px;
            background-color: #b0bdc5;
            border-radius: 50%;
            position: absolute;
            top: 0;
            width: 10px;
            height: 10px;
            bottom: 0;
            margin: auto;
            left: -22px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.shippingAndRetunrs__wrapper___1LXXu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: 76px;
        padding: 0 20px;
    }

.shippingAndRetunrs__itemContainer___1cL7K {
        width: 50%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        margin-right: 47px;
        max-width: 315px;
    }

.shippingAndRetunrs__itemContainer___1cL7K:last-child {
            margin-right: 0;
        }

.shippingAndRetunrs__containerTitle___2iC-P {
        font-size: 18px;
        margin-bottom: 16px;
        color: #3a4850;
        font-weight: 400;
        line-height: 18px;
    }

.shippingAndRetunrs__shippingContainer___R4szn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        font-family: Roboto, Arial, sans-serif;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        border-radius: 4px;
        border: 1px solid #dedede;
        width: 100%;
    }

.shippingAndRetunrs__shippingItem___2t2pr {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        padding: 15px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        border-bottom: 1px solid #dedede;
    }

.shippingAndRetunrs__shippingItem___2t2pr:last-child {
            border-bottom: none;
        }

.shippingAndRetunrs__shippingTitle___2aAhN {
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
    }

.shippingAndRetunrs__shippingTitle___2aAhN.shippingAndRetunrs__standard___U3aSK {
            color: #0f0f0f;
        }

.shippingAndRetunrs__shippingTitle___2aAhN.shippingAndRetunrs__expedited___27T2S {
            color: #2196f3;
            display: inline-block;
            background-color: rgba(33, 150, 243, 0.1);
            border-radius: 4px;
            padding: 2px 5px;
        }

.shippingAndRetunrs__shippingTitle___2aAhN.shippingAndRetunrs__express___2GLnx {
            color: #00b16a;
            display: inline-block;
            background-color: rgba(0, 177, 106, 0.1);
            border-radius: 4px;
            padding: 2px 5px;
        }

.shippingAndRetunrs__itemDescription___1iQ_Y {
        font-size: 14px;
        line-height: 20px;
        color: #0f0f0f;
        font-weight: 300;
    }

.shippingAndRetunrs__freePrice___2T2Vo {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 14px;
        line-height: 28px;
        font-weight: 700;
        color: #0f0f0f;
    }

.shippingAndRetunrs__price___1r-Ic {
        font-size: 13px;
        font-weight: 300;
        color: #3a4850;
        line-height: 28px;
    }

.shippingAndRetunrs__note___Sq1IC {
        font-size: 14px;
        line-height: 16px;
        color: #0f0f0f;
        font-weight: 700;
        margin-bottom: 16px;
    }

.shippingAndRetunrs__noteDescription___1-5RX {
        margin-bottom: 10px;
        font-size: 13px;
        line-height: 16px;
        font-weight: 300;
        color: #3a4850;
    }

.shippingAndRetunrs__noteDescription___1-5RX:last-child {
            margin-bottom: 0;
        }

.shippingAndRetunrs__returnsWrapper___1jkHk {
        font-size: 14px;
        font-family: Roboto, Arial, sans-serif;
    }

.shippingAndRetunrs__returnDescription___AQTD3 {
        font-size: 14px;
        font-weight: 300;
        line-height: 24px;
        color: #3a4850;
    }

.shippingAndRetunrs__returnDescription___AQTD3:last-child {
            margin-bottom: 0;
        }

.shippingAndRetunrs__returnDescriptionBold___1boPh {
        display: block;
        margin-bottom: 20px;
        font-size: 14px;
        line-height: 24px;
        color: #3a4850;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.customerReviews__wrapper___104p0 {
        width: 1000px;
        margin: 76px 0 0 -90px;
        font-family: Roboto, Arial, sans-serif;
        height: 220px;
    }

@media (max-width: 1279.9px) {

.customerReviews__wrapper___104p0 {
            width: 750px;
            margin: 76px 0 0
    }
        }

.customerReviews__title___trmVM {
        font-size: 20px;
        line-height: 24px;
        color: #3a4850;
        font-weight: 400;
        margin-bottom: 20px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.contactTabs__wrapper___13feg {
        padding: 0 30px;
        -webkit-transform: translateY(0);
                transform: translateY(0);
    }

.contactTabs__wrapper___13feg.contactTabs__animate___350Gv {
            -webkit-transform: translateY(20%);
                    transform: translateY(20%);
            -webkit-transition: -webkit-transform .1s;
            transition: -webkit-transform .1s;
            transition: transform .1s;
            transition: transform .1s, -webkit-transform .1s;
        }

@media (max-width: 1279.9px) {

.contactTabs__wrapper___13feg {
            padding-left: 0
    }
        }

.contactTabs__tabContainer___3jWhw {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.contactTabs__tabTitle___1uAa5 {
        margin-right: 5px;
        line-height: 19px;
    }

.contactTabs__tab___zuTM5 {
        line-height: 19px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.contactTabs__tab___zuTM5:focus {
            position: relative;
            -webkit-box-shadow: none;
                    box-shadow: none;
        }

.contactTabs__tab___zuTM5:focus::before {
                content: '';
                position: absolute;
                bottom: -3px;
                height: 4px;
                width: 100%;
                background-color: #3a4850;
                border-radius: 2px;
            }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.contacts__wrapper___2Kpbw {
        width: 1300px;
        margin: 0 auto;
        padding-top: 20px;
        position: relative;
        min-height: 598px;
        background-color: #fff;
        z-index: 20;
        -webkit-transition: .5s;
        transition: .5s;
    }

.contacts__wrapper___2Kpbw.contacts__animate___nqg24 {
            min-height: 100vh;
            -webkit-transition: min-height .5s linear;
            transition: min-height .5s linear;
        }

.contacts__wrapper___2Kpbw::before {
            content: '';
            position: absolute;
            z-index: -10;
            opacity: .6;
            height: 110px;
            width: 530px;
            background: radial-gradient(circle, #3a4850 0%, rgb(247, 248, 249));
            bottom: 1px;
            border-radius: 251px;
            -webkit-box-shadow: 0 11px 30px -18px #3a4850;
                    box-shadow: 0 11px 30px -18px #3a4850;
            left: 50%;
            -webkit-transform: translateX(-50%);
                    transform: translateX(-50%);
        }

@media (min-width: 1440px) {

.contacts__wrapper___2Kpbw {
            width: 1280px
    }
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.contacts__wrapper___2Kpbw {
            width: 1170px
    }
        }

@media (max-width: 1279.9px) {

.contacts__wrapper___2Kpbw {
            width: 930px
    }
        }

.contacts__bottomSection___3WY_- {
        width: 100%;
        padding: 80px 0;
        background-color: #f2f3f5;
        min-height: 676px;
    }

.contacts__tabsWrapper___1piEF {
        width: 900px;
        margin: 0 auto;
    }

.contacts__loader___1_Hp8 {
        margin: 50px auto;
    }

.contacts__wizardContainer___3qYS9 {
        z-index: 100;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.rotationThumbs__rotateBtn___3OqI5 {
        width: 51px;
        height: 35px;
        border: none;
        cursor: pointer;
        background: none;
        padding: 10px;
    }

.rotationThumbs__rotateBtn___3OqI5:focus {
            outline: none;
        }

.rotationThumbs__rotateBtn___3OqI5 svg {
            fill: #3fabe6;
            max-width: 100%;
            pointer-events: none;
        }

.rotationThumbs__rotateBtn___3OqI5:nth-child(2) {
            margin-top: 5px;
        }

.rotationThumbs__rotateBtn___3OqI5:hover svg, .rotationThumbs__rotateBtn___3OqI5.rotationThumbs__active___hHB9P svg {
                fill: #202f62;
            }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.rotationThumbs__rotateBtn___3OqI5 {
            width: 61px;
            height: 40px
    }
        }

@media (min-width: 1440px) {

.rotationThumbs__rotateBtn___3OqI5 {
            width: 65px;
            height: 42px
    }
        }

.rotationThumbs__rotateCon___1azlY {
        position: absolute;
        border: none;
        right: -50px;
        bottom: -3px;
        z-index: 10;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.rotationThumbs__rotateCon___1azlY {
            right: -57px;
            bottom: -5px
    }
        }

@media (min-width: 1440px) {

.rotationThumbs__rotateCon___1azlY {
            right: -62px;
            bottom: -5px
    }
        }

.rotationThumbs__expRotateBtn___2hdEK {
        width: 48px;
        height: 48px;
        cursor: pointer;
        background: none;
        padding: 15px 7px;
        border-radius: 4px;
        margin-right: 8px;
        -webkit-transition: -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        transition: -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        transition: transform 300ms linear, box-shadow 300ms linear;
        transition: transform 300ms linear, box-shadow 300ms linear, -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        border: 1px solid #dedede;
    }

.rotationThumbs__expRotateBtn___2hdEK:focus {
            outline: none;
        }

.rotationThumbs__expRotateBtn___2hdEK svg {
            fill: #000;
            max-width: 100%;
            pointer-events: none;
        }

.rotationThumbs__expRotateBtn___2hdEK:nth-child(2) {
            margin-top: 5px;
        }

.rotationThumbs__expRotateBtn___2hdEK:hover {
            border: 1px solid #b0bdc5;
        }

.rotationThumbs__expActiveBtn___3kJe0 {
        border: 1px solid #0f0f0f;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.thumbnails__expContainer___2Jhg6 {
        margin-top: 26px;
        margin-right: 60px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: space-evenly;
            -ms-flex-pack: space-evenly;
                justify-content: space-evenly;
        min-height: 48px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__expContainer___2Jhg6 {
            margin-top: 32px;
            margin-right: 68px
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__expContainer___2Jhg6 {
            margin-top: 22px;
            margin-right: 38px
    }
        }

.thumbnails__expMain___1ATeP {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }

.thumbnails__hideCarousel___1pKi4 {
        display: none;
    }

.thumbnails__expBtn___UrhxT {
        width: 48px;
        height: 48px;
        display: block;
        overflow: hidden;
        background-size: contain;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-color: transparent;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #dedede;
        -webkit-transition: -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        transition: -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        transition: transform 300ms linear, box-shadow 300ms linear;
        transition: transform 300ms linear, box-shadow 300ms linear, -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        margin-right: 12px;
    }

.thumbnails__expBtn___UrhxT:last-child {
            margin-bottom: 0;
        }

.thumbnails__expBtn___UrhxT:focus {
            outline: none;
        }

@media (max-width: 1279.9px) {

.thumbnails__expBtn___UrhxT {
            margin-right: 8px
    }
        }

.thumbnails__hover___3jOYh {
        border: 1px solid #b0bdc5;

        /* Part of hackfix for buttons flickering in Safary */
        -webkit-transform-style: preserve-3d;
                transform-style: preserve-3d;
        -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
    }

.thumbnails__active___IqMrX {
        border: 1px solid #0f0f0f;
    }

.thumbnails__tryonBtn___1GX2k {
        width: 124px;
        background-color: #fff;
        height: 100%;
        margin-bottom: 0;
        color: #2196f3;
        font-size: 14px;
        line-height: 26px;
        font-family: Roboto, Arial, sans-serif;
        font-weight: 700;
        -webkit-box-shadow: none;
                box-shadow: none;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
        margin-left: 20px;
        border: 1px solid #2196f3;
        border-radius: 4px;
        cursor: pointer;
    }

.thumbnails__tryonBtn___1GX2k:hover {
            background-color: #2196f3;
            color: #fff;
        }

.thumbnails__tryonBtn___1GX2k:hover svg {
                fill: #fff;
            }

.thumbnails__tryonBtn___1GX2k:hover svg path:first-child {
                stroke: #2196f3;
                fill: #fff;
            }

.thumbnails__tryonBtn___1GX2k:hover svg path:last-child {
                stroke: #2196f3;
            }

@media (max-width: 1279.9px) {

.thumbnails__tryonBtn___1GX2k {
            margin-left: 12px
    }
        }

.thumbnails__video___qztpY {
        position: relative;
        background-size: cover;
    }

.thumbnails__video___qztpY::after {
            content: '';
            height: 14px;
            width: 14px;
            background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/6e3b77d72b3f45547e120f3836e2fa50.svg) no-repeat 50%;
            background-size: cover;
            position: absolute;
            top: 32px;
            right: 30px;
        }

.thumbnails__tryonIcon___jG1Zd {
        vertical-align: middle;
        width: 25px;
        height: 18px;
        margin-top: -4px;
        margin-right: 7px;
    }

.thumbnails__out___3eAIn {
        position: absolute;
        bottom: 81px;
        right: 55px;
        height: 63px;
        width: 105px;
        background-size: 75px;
        background-position: 50% 0;
        -webkit-transition: none;
        transition: none;
        -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 2px 7px;
                box-shadow: rgba(0, 0, 0, 0.3) 0 2px 7px;
        border: 2px solid #fff;
        border-radius: 4px;
    }

.thumbnails__out___3eAIn:hover {
            -webkit-transform: none;
                    transform: none;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__out___3eAIn {
            width: 95px;
            height: 60px;
            bottom: 90px;
            right: 65px;
            background-size: 63px
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__out___3eAIn {
            width: 95px;
            height: 60px;
            bottom: 102px;
            right: 40px;
            background-size: 56px
    }
        }

.thumbnails__out___3eAIn::after {
            content: '';
            display: block;
            position: absolute;
            width: 100%;
            bottom: 0;
            left: 0;
            background-color: #89959c;
            color: #fff;
            font-size: 12px;
            line-height: 18px;
            font-weight: 700;
        }

@media (max-width: 1279.9px) {

.thumbnails__out___3eAIn::after {
                font-size: 11px;
                line-height: 12px
        }
            }

.thumbnails__out___3eAIn.thumbnails__men___3U3F1::after {
            content: 'Male Model';
        }

.thumbnails__out___3eAIn.thumbnails__women___3koSD::after {
            content: 'Female Model';
        }

.thumbnails__hide___1K7j7 {
        display: none;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.thumbnails__container___9nm6E {
        padding-right: 11px;
        position: relative;
        min-height: 370px;
        z-index: 20;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__container___9nm6E {
            min-height: 333px
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__container___9nm6E {
            min-height: 281px
    }
        }

.thumbnails__main___2zsBC {
        min-height: 309px;

        /* Part of hackfix for buttons flickering in Safary */
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__main___2zsBC {
            min-height: 278px;
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__main___2zsBC {
            min-height: 235px;
    }
        }

.thumbnails__tryon___2DWxK {
        min-height: 55px;
        font-family: Roboto, Arial, sans-serif;
    }

.thumbnails__tryon___2DWxK .thumbnails__btn___2o0Gs {
            min-height: 55px;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__tryon___2DWxK {
            min-height: 50px
    }

            .thumbnails__tryon___2DWxK .thumbnails__btn___2o0Gs {
                min-height: 50px;
            }
        }

@media (max-width: 1279.9px) {

.thumbnails__tryon___2DWxK {
            min-height: 39px
    }

            .thumbnails__tryon___2DWxK .thumbnails__btn___2o0Gs {
                min-height: 39px;
            }
        }

.thumbnails__btn___2o0Gs {
        display: block;
        overflow: hidden;
        min-height: 54px;
        width: 100%;
        background-size: contain;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-color: transparent;
        cursor: pointer;
        border: none;
        border-radius: 4px;
        -webkit-box-shadow: inset #eae9e5 0 0 0 1px;
                box-shadow: inset #eae9e5 0 0 0 1px;
        -webkit-transition: -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        transition: -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        transition: transform 300ms linear, box-shadow 300ms linear;
        transition: transform 300ms linear, box-shadow 300ms linear, -webkit-transform 300ms linear, -webkit-box-shadow 300ms linear;
        margin-bottom: 8px;
    }

.thumbnails__btn___2o0Gs:last-child {
            margin-bottom: 0;
        }

.thumbnails__btn___2o0Gs:hover {
            -webkit-transform: scale(1.05);
                    transform: scale(1.05);

            /* Part of hackfix for buttons flickering in Safary */
            -webkit-transform-style: preserve-3d;
                    transform-style: preserve-3d;
            -webkit-backface-visibility: hidden;
                    backface-visibility: hidden;
        }

.thumbnails__btn___2o0Gs:focus {
            outline: none;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__btn___2o0Gs {
            min-height: 48px
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__btn___2o0Gs {
            min-height: 39px
    }
        }

.thumbnails__repeat___21V5B {
        background-repeat: repeat-x;
    }

.thumbnails__tryonBtn___1hE9Q {
        background-color: #2196f3;
        height: 100%;
        margin-bottom: 0;
        color: #fff;
        font-size: 13px;
        line-height: 26px;
        font-weight: 700;
        -webkit-box-shadow: none;
                box-shadow: none;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
    }

.thumbnails__tryonBtn___1hE9Q:focus {
            outline: none;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__tryonBtn___1hE9Q {
            font-size: 15px
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__tryonBtn___1hE9Q {
            font-size: 14px
    }
        }

.thumbnails__tryonIcon___qknvw {
        vertical-align: middle;
        margin-top: -2px;
    }

@media (max-width: 1279.9px) {

.thumbnails__tryonIcon___qknvw {
            display: none
    }
        }

@media (min-width: 1440px) {

.thumbnails__tryonIcon___qknvw {
            width: 25px;
            height: 18px;
            margin-top: -4px
    }
        }

.thumbnails__active___2Eblx {
        -webkit-box-shadow: inset #a2abb3 0 0 0 2px;
                box-shadow: inset #a2abb3 0 0 0 2px;
    }

.thumbnails__video___f6Cg5 {
        position: relative;
        background-size: cover;
    }

.thumbnails__video___f6Cg5::after {
            content: '';
            height: 20px;
            width: 20px;
            background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/dc5165e8953959996d3c2d7a4ddf4459.svg) no-repeat 50%;
            background-size: cover;
            position: absolute;
            bottom: calc(50% - 10px);
            right: 9px;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__video___f6Cg5::after {
                height: 16px;
                width: 16px
        }
            }

@media (max-width: 1279.9px) {

.thumbnails__video___f6Cg5::after {
                height: 12px;
                width: 12px
        }
            }

.thumbnails__out___Ah3Ah {
        position: absolute;
        bottom: -50px;
        right: -750px;
        width: 105px;
        background-size: 75px;
        background-position: 50% 0;
        -webkit-transition: none;
        transition: none;
        -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 2px 7px;
                box-shadow: rgba(0, 0, 0, 0.3) 0 2px 7px;
    }

.thumbnails__out___Ah3Ah:hover {
            -webkit-transform: none;
                    transform: none;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.thumbnails__out___Ah3Ah {
            width: 95px;
            height: 43px;
            bottom: -48px;
            right: -680px;
            background-size: 63px
    }
        }

@media (max-width: 1279.9px) {

.thumbnails__out___Ah3Ah {
            width: 81px;
            height: 40px;
            bottom: -42px;
            right: -573px;
            background-size: 56px
    }
        }

.thumbnails__out___Ah3Ah::after {
            content: '';
            display: block;
            position: absolute;
            width: 100%;
            bottom: 0;
            left: 0;
            background-color: #23aae2;
            color: #fff;
            font-size: 12px;
            line-height: 18px;
            font-weight: 700;
        }

@media (max-width: 1279.9px) {

.thumbnails__out___Ah3Ah::after {
                font-size: 11px;
                line-height: 12px
        }
            }

.thumbnails__out___Ah3Ah.thumbnails__men___3gw9q::after {
            content: 'Male Model';
        }

.thumbnails__out___Ah3Ah.thumbnails__women___2C7Zx::after {
            content: 'Female Model';
        }

.thumbnails__hide___aspbw {
        display: none;
    }

@media (max-width: 1279.9px) {
    .thumbnails__container___9nm6E {
        width: 82px;
    }

    .thumbnails__tryonBtn___1hE9Q {
        background-size: 100px;
        background-position: 50% 1px;
    }
}

@media (min-width: 1280px) and (max-width: 1439.9px) {
    .thumbnails__container___9nm6E {
        width: 121px;
    }
}

@media (min-width: 1440px) {
    .thumbnails__container___9nm6E {
        width: 132px;
    }
}

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.controls__expLeftArrow___3gTQC, .controls__expLeftArrowHovered___29qJ5, .controls__expRightArrow___3Yt4N, .controls__expRightArrowHovered___X_Xm9 {
    position: absolute;
    top: 40.5%;
    height: 36px;
    width: 36px;
    z-index: 10;
    cursor: pointer;
    border: 1px solid #f1f1f1;
    border-radius: 100%;
    background-color: #fff;
    -webkit-transition: -webkit-transform .15s;
    transition: -webkit-transform .15s;
    transition: transform .15s;
    transition: transform .15s, -webkit-transform .15s;
    opacity: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.controls__expLeftArrow___3gTQC:hover, .controls__expLeftArrowHovered___29qJ5:hover, .controls__expRightArrow___3Yt4N:hover, .controls__expRightArrowHovered___X_Xm9:hover {
        border-color: #dedede;
    }

.controls__arrow___bxqCI {
        width: 7px;
        height: 12px;
        margin-left: 1.5px;
    }

.controls__expLeftArrow___3gTQC {

        left: -112px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.controls__expLeftArrow___3gTQC {
            top: 42.5%;
            left: -85px
    }
        }

@media (max-width: 1279.9px) {

.controls__expLeftArrow___3gTQC {
            top: 47.5%;
            left: -86px
    }
        }

.controls__expLeftArrow___3gTQC .controls__arrow___bxqCI {
            -webkit-transform: rotate(180deg);
                    transform: rotate(180deg);
            margin-left: 0;
        }

.controls__expLeftArrowHovered___29qJ5 {

        opacity: 1;
        -webkit-transform: translateX(36px);
                transform: translateX(36px);
    }

.controls__expRightArrow___3Yt4N {

        right: -53px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.controls__expRightArrow___3Yt4N {
            top: 42.5%;
            right: -16px
    }
        }

@media (max-width: 1279.9px) {

.controls__expRightArrow___3Yt4N {
            top: 47.5%;
            right: -44px
    }
        }

.controls__expRightArrowHovered___X_Xm9 {

        opacity: 1;
        -webkit-transform: translateX(-36px);
                transform: translateX(-36px);
    }

.controls__closeTryOnBtn___GmrTX {
        position: absolute;
        top: 20px;
        height: 14px;
        width: 14px;
        z-index: 10;
        cursor: pointer;
        right: 20px;
    }

.controls__closeTryOnBtn___GmrTX:hover svg path {
                stroke: #0f0f0f;
            }

@media (min-width: 1440px) {

.controls__closeTryOnBtn___GmrTX {
            top: 30px;
            right: 62px
    }
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.controls__closeTryOnBtn___GmrTX {
            top: 66px;
            right: 82px
    }
        }

@media (max-width: 1279.9px) {

.controls__closeTryOnBtn___GmrTX {
            top: 56px;
            right: 51px
    }
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.controls__arrowLeft___29Ltv, .controls__arrowRight___24lF9 {
    display: block;
    width: 10px;
    height: 36px;
    background: transparent;
    position: absolute;
    border: none;
    z-index: 10;
    top: 50%;
    padding: 10px;
    margin-top: -18px;
    cursor: pointer;
}

.controls__arrowLeft___29Ltv:focus, .controls__arrowRight___24lF9:focus {
        outline: none;
    }

.controls__arrowLeft___29Ltv::before, .controls__arrowLeft___29Ltv::after, .controls__arrowRight___24lF9::before, .controls__arrowRight___24lF9::after {
        position: absolute;
        display: block;
        background: #b1b1b1;
        content: "";
        height: 19px;
        width: 1px;
        -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, 0.35);
                box-shadow: 0 0 7px rgba(0, 0, 0, 0.35);
    }

.controls__arrowLeft___29Ltv::before, .controls__arrowRight___24lF9::before {
        top: 0;
        left: 5px;
        -webkit-transform: rotate(26deg);
                transform: rotate(26deg);
    }

.controls__arrowLeft___29Ltv::after, .controls__arrowRight___24lF9::after {
        bottom: 0;
        left: 5px;
        -webkit-transform: rotate(-26deg);
                transform: rotate(-26deg);
    }

.controls__arrowLeft___29Ltv {

        left: 10px;
    }

.controls__arrowRight___24lF9 {

        right: 10px;
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.productMedia__container___1mdLX {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.productMedia__expContainer___1Ju9C {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.productMedia__image___2HHnT {
        position: relative;
    }

.productMedia__zoom___1xOf9 {
        position: absolute;
        border: 0;
        padding: 0;
        bottom: 5px;
        right: 5px;
        width: 19px;
        height: 19px;
        background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/615ec242609ff82415109aa6f4c94330.svg);
        background-size: contain;
        cursor: pointer;
    }

.productMedia__zoom___1xOf9:focus {
            outline: none;
        }

.productMedia__expZoom___3Vmfe {
        position: absolute;
        border: 0;
        padding: 0;
        bottom: 1px;
        right: -19px;
        width: 44px;
        height: 44px;
        background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/cc5986dd3ded519b7a48139e665f0621.svg) no-repeat 20px;
        background-position-x: center;
        background-position-y: center;
        cursor: pointer;
        border-radius: 100%;
    }

.productMedia__expZoom___3Vmfe:hover {
            background-color: #f1f3f4;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productMedia__expZoom___3Vmfe {
            right: 22px;
            bottom: 3px
    }
        }

@media (max-width: 1279.9px) {

.productMedia__expZoom___3Vmfe {
            right: -8px
    }
        }

.productMedia__myPicksIconCon___23y0h {
        position: absolute;
        right: 5px;
        z-index: 30;
        width: 22px;
        height: 22px;
        top: 4px;
    }

.productMedia__myPicksIconCon___23y0h.productMedia__rayBan___3bomz {
            height: 39px;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productMedia__myPicksIconCon___23y0h {
            width: 18px;
            height: 18px;
            top: 6px
    }
        }

@media (max-width: 1279.9px) {

.productMedia__myPicksIconCon___23y0h {
            width: 15px;
            height: 15px;
            top: 7px
    }
        }

.productMedia__expMyPicksIconCon___1C5wk {
        position: absolute;
        right: -13px;
        top: -22px;
        z-index: 30;
        width: 44px;
        height: 44px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productMedia__expMyPicksIconCon___1C5wk {
            right: 23px;
            top: -17px
    }
        }

@media (max-width: 1279.9px) {

.productMedia__expMyPicksIconCon___1C5wk {
            right: -7px;
            top: -19px
    }
        }

.productMedia__expMyPicksIconCon___1C5wk.productMedia__rayBan___3bomz {
            right: -13px;
            height: 44px;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productMedia__expMyPicksIconCon___1C5wk.productMedia__rayBan___3bomz {
                right: 21px
        }
            }

@media (max-width: 1279.9px) {

.productMedia__expMyPicksIconCon___1C5wk.productMedia__rayBan___3bomz {
                right: -6px;
                top: -18px
        }
            }

.productMedia__myPicksIconClass___3g2II {
        display: block;
    }

@media (max-width: 1279.9px) {
        .productMedia__slide___yIbBP {
            height: 282px;
            width: 599px;
            top: -5px;
        }
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {
        .productMedia__slide___yIbBP {
            height: 333px;
            width: 713px;
        }

        .productMedia__zoom___1xOf9 {
            width: 25px;
            height: 25px;
        }
    }

@media (min-width: 1440px) {
        .productMedia__slide___yIbBP {
            height: 370px;
            width: 790px;
        }

        .productMedia__zoom___1xOf9 {
            width: 28px;
            height: 28px;
        }
    }

@media (min-width: 1440px) {

.productMedia__expSlide___PvN50 {
            height: 353px;
            width: 704px;
            margin-top: 33px;
            margin-right: 60px
    }
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productMedia__expSlide___PvN50 {
            height: 345px;
            width: 672px;
            margin-top: 39px;
            margin-right: 68px
    }
        }

@media (max-width: 1279.9px) {

.productMedia__expSlide___PvN50 {
            height: 287px;
            width: 516px;
            margin-top: 40px;
            margin-right: 38px
    }
        }

.productMedia__expSlideTryOn___jfso5 {
        padding-right: 40px;
    }

@media (min-width: 1440px) {

.productMedia__expSlideTryOn___jfso5 {
            margin-top: 16px
    }
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productMedia__expSlideTryOn___jfso5 {
            padding-right: 68px;
            margin-top: 51px
    }
        }

@media (max-width: 1279.9px) {

.productMedia__expSlideTryOn___jfso5 {
            margin-top: 45px;
            padding-right: 42px
    }
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.thumbnails__container___1nLNa {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

.thumbnails__container___1nLNa.thumbnails__centered___Uflz0 {
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }

.thumbnails__btn___3lQJh {
        width: 100px;
        height: 60px;
        border-top: 2px solid #e9e7e3;
        border-bottom: 2px solid #e9e7e3;
        border-left: none;
        border-right: none;
        -webkit-transition: all 400ms;
        transition: all 400ms;
        background-color: transparent;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-size: contain;
        vertical-align: top;
    }

.thumbnails__btn___3lQJh:hover, .thumbnails__btn___3lQJh.thumbnails__active___3VvJA {
            border-color: #23aae2;
        }

.thumbnails__rotate___1KFfh {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/db39a7c0aa90f1e89c6ed800c27bb670.png) !important;
        background-size: 51px 28px !important;
    }

.thumbnails__rotate180___3piW1 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/dbaf502be776b3c3971ebc0d3c711666.png) !important;
        background-size: 51px 28px !important;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.productMediaPopup__container___4bN6P {
        padding: 20px;
        text-align: center;
        position: relative;
    }

.productMediaPopup__container___4bN6P img {
            max-width: 100%;
            max-height: 800px;
        }

.productMediaPopup__name___1hrCG {
        font: normal 26px/51px Roboto, Arial, sans-serif;
        color: #2d2d2d;
        letter-spacing: .06em;
        white-space: nowrap;
        overflow: hidden;
        margin: 0 0 10px;
        position: absolute;
        top: 20px;
        left: 40px;
        z-index: 20;
    }

.productMediaPopup__thumbs___BZOjL {
        display: inline-block;
        padding: 30px 0 20px;
    }

.productMediaPopup__placeholder___1ENVl {
        height: 1px;
        overflow: hidden;
    }

.productMediaPopup__placeholder___1ENVl img {
            visibility: hidden;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.stockBadge__leftInStock___3VpKF {
        font-size: 16px;
        margin-bottom: 20px;
        display: inline-block;
        color: #3a4850;
    }

@media (max-width: 1279.9px) {

.stockBadge__leftInStock___3VpKF {
            font-size: 14px
    }
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.baseInfo__container___3myuV {
        padding-left: 20px;
    }

.baseInfo__name___2-UGV {
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 24px;
        font-weight: 700;
        line-height: 28px;
        margin: 24px 0 8px;
    }

.baseInfo__property___KJRPw {
        font-size: 16px;
        line-height: 1.2;
        color: #595959;
        vertical-align: middle;
    }

.baseInfo__colors___3J_XI {
        padding: 11px 0 32px;
    }

.baseInfo__colors___3J_XI.baseInfo__specialPriceColors___2X34- {
            padding-top: 8px;
            padding-bottom: 0;
        }

.baseInfo__colors___3J_XI.baseInfo__planoSwitcher___u-Fx7 {
            padding-top: 0;
        }

.baseInfo__divider___kHDxz {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        height: 1px;
        width: 95%;
        border: 1px solid #f1f1f1;
        margin: 20px 0 10px;
    }

.baseInfo__divider___kHDxz.baseInfo__specialPriceDividerColor___1dsUC {
            border-color: #e7ebed;
        }

.baseInfo__divider___kHDxz.baseInfo__specialPriceDivider___1mINM {
            margin-top: 10px;
        }

.baseInfo__divider___kHDxz.baseInfo__planoDivider___rTHZE {
            width: 100%;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {
        .baseInfo__colors___3J_XI {
            padding: 8px 0 10px;
        }

        .baseInfo__divider___kHDxz {
            margin-bottom: 20px;
        }
    }

@media (max-width: 1279.9px) {
        .baseInfo__container___3myuV {
            padding-left: 14px;
        }

        .baseInfo__name___2-UGV {
            font-size: 18px;
            margin-bottom: 12px;
            letter-spacing: .19px;
            line-height: 21px;
        }

        .baseInfo__property___KJRPw {
            font-size: 14px;
        }

        .baseInfo__colors___3J_XI {
            padding: 9px 0 6px;
        }

        .baseInfo__divider___kHDxz {
            margin-bottom: 20px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.readersPopup__popup___4xEim {
        width: 525px;
    }

.readersPopup__popup___4xEim div:first-child {
            padding: 32px 87px 22px;
            color: #0f0f0f;
            font-size: 16px;
            line-height: 20px;
            letter-spacing: .21px;
            text-align: center;
        }

.readersPopup__popup___4xEim div:nth-child(2) {
            text-align: center;
            padding: 22px 87px 40px;
        }

.readersPopup__popup___4xEim div:nth-child(2) a {
                color: #3fabe6;
                font-size: 18px;
                font-weight: 700;
                text-decoration: underline;
                text-transform: capitalize;
                cursor: pointer;
            }

.readersPopup__popup___4xEim div:nth-child(2) a:hover {
                    opacity: .6;
                }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.chooseReadersPower__error___1zIm3 {
        margin-top: 2px;
        line-height: 17px;
        font-size: 13px;
        color: #d2431d;
        width: 100%;
        text-align: left;
    }

.chooseReadersPower__title___1xjrX {
        margin-right: 14px;
        display: inline-block;
        vertical-align: middle;
    }

.chooseReadersPower__popup___UxOo_ {
        width: 525px;
    }

.chooseReadersPower__popup___UxOo_ div:first-child {
            padding: 32px 87px 22px;
            color: #0f0f0f;
            font-size: 16px;
            line-height: 20px;
            letter-spacing: .21px;
            text-align: center;
        }

.chooseReadersPower__popup___UxOo_ div:nth-child(2) {
            text-align: center;
            padding: 22px 87px 40px;
        }

.chooseReadersPower__popup___UxOo_ div:nth-child(2) a {
                color: #3fabe6;
                font-size: 18px;
                font-weight: 700;
                text-decoration: underline;
                text-transform: capitalize;
                cursor: pointer;
            }

.chooseReadersPower__popup___UxOo_ div:nth-child(2) a:hover {
                    opacity: .6;
                }

.chooseReadersPower__powersWrapper___ImTIW {
        margin-top: 9px;
    }

.chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__power___2PztO {
            width: 58px;
            line-height: 28px;
            padding-top: 2px;
            border-radius: 4px;
            border: 1px solid #d8d8d8;
            color: #6b6b6b;
            font-size: 13px;
            text-align: center;
            margin: 0 8px 8px 0;
            display: inline-block;
            cursor: pointer;
        }

.chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__power___2PztO.chooseReadersPower__selected___lkCFV, .chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__power___2PztO:hover {
                border-color: #4d4d4d;
                color: #0f0f0f;
            }

@media (min-width: 1440px) {
                .chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__power___2PztO:nth-child(5n) {
                    margin-right: 0;
                }
            }

@media (max-width: 1279.9px) {

.chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__power___2PztO {
                width: 50px;
                margin-right: 7px
        }

                .chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__power___2PztO:nth-child(4n) {
                    margin-right: 0;
                }
            }

.chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__changeButton___UHZLC {
            margin-left: 9px;
            vertical-align: middle;
            border-bottom: 1px solid;
            line-height: 15px;
            font-size: 13px;
            font-weight: 700;
            color: #0f0f0f;
            display: inline-block;
            cursor: pointer;
        }

.chooseReadersPower__powersWrapper___ImTIW .chooseReadersPower__changeButton___UHZLC:hover {
                opacity: .8;
            }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.circleButton__btn___dg2ae {
        display: inline-block;
        height: 30px;
        width: 30px;
        line-height: 30px;
        background-position: center;
        background-repeat: no-repeat;
        background-color: #fff;
        color: #4e4e5d;
        background-size: cover;
        border-radius: 50%;
        -webkit-box-shadow: #c8c8c8 0 0 0 1px;
                box-shadow: #c8c8c8 0 0 0 1px;
        border: none;
        cursor: pointer;
        position: relative;
    }

@media (min-width: 1440px) {

.circleButton__btn___dg2ae {
            height: 32px;
            width: 32px
    }
        }

.circleButton__btn___dg2ae:hover, .circleButton__btn___dg2ae.circleButton__active___2OWEI {
            -webkit-box-shadow:
                inset #fff 0 0 0 3px,
                #2d2d2d 0 0 0 2px;
                    box-shadow:
                inset #fff 0 0 0 3px,
                #2d2d2d 0 0 0 2px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.container__wrapper___1R66N {
        position: relative;
        padding-bottom: 10px;
    }

.container__wrapper___1R66N.container__active___Wy4EY {
            padding-bottom: 20px;
        }

.container__link___1JOJ0 {
        display: inline-block;
        height: 28px;
        width: 28px;
        color: #3a4850;
        border-radius: 50%;
        border: 2px solid #3a4850;
        cursor: pointer;
        position: relative;
        font-size: 20px;
        margin-right: 10px;
        margin-bottom: 10px;
        outline: none;
        font-weight: 700;
        background: none;
        line-height: 1;
    }

.container__link___1JOJ0.container__active___Wy4EY span {
                display: inline-block;
                -webkit-transform: rotate(45deg);
                        transform: rotate(45deg);
            }

@media (max-width: 1279.9px) {

.container__link___1JOJ0 {
            font-size: 18px;
            margin-right: 7px;
            margin-bottom: 9px
    }
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.colorSwitcher__btnWrapper___321vk {
        display: inline-block;
        vertical-align: top;
        margin-right: 10px;
        margin-bottom: 10px;
    }

@media (max-width: 1279.9px) {

.colorSwitcher__btnWrapper___321vk {
            margin-right: 9px;
            margin-bottom: 9px
    }
        }

.colorSwitcher__btn___qu5pC {
        outline: none;
        width: 28px;
        height: 28px;
    }

.colorSwitcher__btnActive___gqKwJ {
        -webkit-box-shadow: inset #fff 0 0 0 3px, #2d2d2d 0 0 0 2px;
                box-shadow: inset #fff 0 0 0 3px, #2d2d2d 0 0 0 2px;
    }

.colorSwitcher__btnActive___gqKwJ::after {
            content: '';
            display: block;
            width: 100%;
            height: 100%;
            background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/48e9f198b1a9c8bc5c1f8abab800a7eb.svg) no-repeat 50%;
            background-size: 32px;
        }

.colorSwitcher__container___3Li9w {
        padding-top: 10px;
        max-width: 100%;
    }

.colorSwitcher__container___3Li9w.colorSwitcher__planoContainer___2xx6D {
            padding-top: 8px;
        }

.colorSwitcher__tooltipContent___117S9 {
        padding: 10px;
        width: auto;
        text-align: center;
    }

.colorSwitcher__title___2lStu {
        color: #8d8d8d;
        font-size: 12px;
        margin-bottom: 5px;
        font-style: italic;
    }

.colorSwitcher__color___2twoY {
        color: #000;
        font-size: 12px;
        font-weight: 700;
    }

.colorSwitcher__toolTipContainer___3pK8v {
        padding: 0 0 1px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.reviewLinkBlock__reviews___29aFJ {
        cursor: pointer;
        border: 0;
        background: transparent;
        outline: none;
        padding: 0;
        font-family: Roboto, Arial, sans-serif;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.reviewLinkBlock__reviews___29aFJ:focus {
            outline: none;
        }

.reviewLinkBlock__stars___2EdpF {
        display: inline-block;
        vertical-align: middle;
        margin-right: 7px;
    }

.reviewLinkBlock__count___25w05 {
        font-family: Roboto, Arial, sans-serif;
        color: #89959c;
        font-size: 14px;
        line-height: 16px;
        letter-spacing: .38px;
        vertical-align: bottom;
        display: inline-block;
    }

@media (max-width: 1279.9px) {
        .reviewLinkBlock__count___25w05 {
            font-size: 14px;
            letter-spacing: .38px;
            line-height: 16px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.sizeSwitcher__container___3d3AD {
        display: inline-block;
        padding-right: 10px;
    }

.sizeSwitcher__btn___2SarK {
        margin-right: 9px;
        outline: none;
        display: inline-block;
        padding: 1px 5px;
        border: 1px solid #f6f6f6;
        border-radius: 2px;
        background-color: #f6f6f6;
        color: #89959c;
        size: 16px;
        cursor: pointer;
    }

.sizeSwitcher__btnActive___3SdGN {
        border: 1px solid #3a4850;
        color: #3a4850;
        cursor: auto;
    }

.sizeSwitcher__switcherTooltip___2jqlW {
        margin-top: 12px;
        padding: 5px 0 1px;
    }

.sizeSwitcher__switcherTooltip___2jqlW .rc-tooltip-inner {
                color: #424345;
                font: italic 14px Roboto, Arial, sans-serif;
                max-width: 150px;
                padding: 7px 20px;
            }

@media (max-width: 1279.9px) {
        .sizeSwitcher__btn___2SarK {
            font-size: 14px;
            margin-right: 5px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.sizeGlasses__popup___1Vo26 {
        width: 550px;
        height: 615px;
    }

.sizeGlasses__innerWrap___2Em8n {
        padding: 29px;
    }

.sizeGlasses__title___1L346 {
        font-size: 20px;
        text-transform: uppercase;
        text-align: left;
        border-bottom: 1px solid #efefef;
        padding-bottom: 15px;
        margin-top: -5px;
        color: #000;
    }

.sizeGlasses__hint___3DoWx {
        color: #8d8d8d;
        line-height: 24px;
        margin-top: 25px;
        font-size: 16px;
    }

.sizeGlasses__glassesPainting___2Rjjy {
        width: 361px;
        height: 150px;
        background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/30a02247640c93a853d8ac95385a5348.png) no-repeat;
        margin: 40px auto;
        position: relative;
    }

.sizeGlasses__lensWidth___3aq1u, .sizeGlasses__bridgeWidth___1hZ6I, .sizeGlasses__templeWidth___4vKE8 {
        position: absolute;
        top: 43px;
        font-size: 18px;
    }

.sizeGlasses__lensWidth___3aq1u {
        left: 148px;
    }

.sizeGlasses__bridgeWidth___1hZ6I {
        left: 196px;
    }

.sizeGlasses__templeWidth___4vKE8 {
        left: 228px;
    }

.sizeGlasses__sizesList___CT8Zm {
        width: 100%;
        border-top: 1px solid #23aae2;
        border-left: 1px solid #23aae2;
        border-spacing: 0;
        border-collapse: collapse;
        font-size: 13px;
    }

.sizeGlasses__sizesList___CT8Zm td, .sizeGlasses__sizesList___CT8Zm th {
            border-right: 1px solid #23aae2;
            border-bottom: 1px solid #23aae2;
            text-align: center;
            font-weight: 400;
        }

.sizeGlasses__sizesList___CT8Zm th {
            color: #fff;
            background-color: #23aae2;
            padding: 5px 0;
            font-size: 12px;
        }

.sizeGlasses__sizesList___CT8Zm td {
            vertical-align: top;
            padding: 10px 0;
        }

.sizeGlasses__sizesList___CT8Zm td.sizeGlasses__name___3of13 {
            color: #3fabe6;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.sizes__container___wBm7J {
        padding-left: 20px;
    }

.sizes__name___36OJ6 {
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 24px;
        font-weight: 700;
        line-height: 28px;
        margin: 10px 0 0;
    }

.sizes__value___2ToMt {
        color: #3a4850;
        margin-left: 10px;
    }

.sizes__value___2ToMt.sizes__specialOfferValue___1ygR1 {
            margin-left: 5px;
            color: #89959c;
        }

.sizes__property___rSXgi {
        font-size: 16px;
        color: #595959;
    }

.sizes__colors___Un6TL {
        padding: 24px 0 10px;
    }

.sizes__sizes___9jway {
        padding-top: 32px;
        color: #89959c;
        font-size: 16px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.sizes__sizes___9jway.sizes__specialOfferSizeSwitcher___373lN {
            padding-top: 24px;
        }

.sizes__helpBtn___quLxH {
        display: inline-block;
        cursor: pointer;
        border: none;
        background: transparent;
        outline: none;
        padding-bottom: 2px;
    }

.sizes__kidsSizeContainer___8s-sz {
        font-size: 13px;
        margin-top: 10px;
        width: 100%;
    }

@media (max-width: 1279.9px) {
        .sizes__container___wBm7J {
            padding-left: 14px;
        }

        .sizes__name___36OJ6 {
            font-size: 18px;
            margin-bottom: 7px;
            letter-spacing: .19px;
            line-height: 21px;
        }

        .sizes__sizes___9jway {
            padding-top: 25px;
            color: #89959c;
            font-size: 14px;
        }

            .sizes__sizes___9jway .sizes__value___2ToMt {
                margin-right: 1px;
            }

        .sizes__property___rSXgi {
            font-size: 14px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.productPlanoSelector__modeBox___1VKE6 {
        padding-top: 12px;
    }

.productPlanoSelector__btnBox___If42E {
        background: #fff;
        border: 1px solid #f1f1f1;
        color: #0f0f0f;
        cursor: pointer;
        max-height: 48px;
    }

.productPlanoSelector__btnBox___If42E > label {
            padding: 14px;
        }

.productPlanoSelector__btnBox___If42E.productPlanoSelector__topBtn___2hSUc {
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
            border-bottom: none;
        }

.productPlanoSelector__btnBox___If42E.productPlanoSelector__bottomBtn___3W9UZ {
            border-bottom-left-radius: 4px;
            border-bottom-right-radius: 4px;
            color: #3a4850;
            border-top: none;
        }

.productPlanoSelector__btnBox___If42E.productPlanoSelector__checked___2zSPU {
            background: #f7f8f9;
        }

.productPlanoSelector__btnBox___If42E:hover:not(.productPlanoSelector__checked___2zSPU) {
            background: #f1f1f1;
        }

.productPlanoSelector__btnBox___If42E:hover:not(.productPlanoSelector__checked___2zSPU) span[role="presentation"] {
                border-color: #6b6b6b;
                background: #fff;
            }

.productPlanoSelector__ctaModeBtn___3-HBQ {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.productPlanoSelector__ctaModeBtnTxt___2MYZP {
        font-size: 14px;
        line-height: 16px;
        padding-left: 12px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.moneyBackGuarantee__container___8PpRV {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        width: 500px;
        padding: 36px 40px;
        color: #2a2727;
    }

.moneyBackGuarantee__title___LMAeA {
        padding-bottom: 20px;
        margin-bottom: 20px;
        font-size: 28px;
        line-height: 24px;
        border-bottom: #dbdbd7 1px solid;
    }

.moneyBackGuarantee__content___2cdyV {
        font-size: 14px;
        line-height: 22px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.advantages__advantages___FUr3x {
        position: relative;
        font-family: Roboto, Arial, sans-serif;
        display: block;
        margin: 11px 0 4px;
        font-size: 14px;
        line-height: 15px;
    }

.advantages__greenColored___2VTIL {
        color: #00b16a;
    }

.advantages__notColored___2OVCv {
        color: #3a4850;
    }

.advantages__item___2hKaX {
        position: relative;
        margin-bottom: 5px;
        min-height: 17px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }

.advantages__item___2hKaX[role=button] {
            cursor: pointer;
        }

.advantages__item___2hKaX:last-child {
            margin-bottom: 0;
        }

.advantages__content___106_l {
        line-height: 22px;
    }

.advantages__iconWrapper___SBLlb {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.advantages__icon___13Mmt {
        width: 18px;
        height: 19px;
        margin-left: 7px;
        margin-right: 7px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.advantages__checkAssurance___32LLi {
        width: 12px;
    }

.advantages__shippingTruck____hC_n {
        width: 22px;
    }

@media (max-width: 1279.9px), (min-width: 1280px) and (max-width: 1439.9px) {
        .advantages__advantages___FUr3x {
            margin: 12px 0 5px;
            font-size: 13px;
        }

        .advantages__content___106_l {
            line-height: 18px;
        }

        .advantages__item___2hKaX {
            background-position: 0 3px;
            margin-bottom: 5px;
        }

        .advantages__icon___13Mmt {
            height: 18px;
            margin-right: 9px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.ctaBlockBase__cta___2HIap {
        background-color: #fff;
        text-transform: none;
        font-size: 20px;
        padding-top: 16px;
    }

.ctaBlockBase__ctaBtn___1aih7 {
        padding: 15px 5px 15px 0;
        width: 100%;
        height: 64px;
        font-family: Roboto, Arial, sans-serif;
        text-transform: none;
        font-size: 20px;
        letter-spacing: 0;
    }

.ctaBlockBase__disabled___j54_p {
        cursor: not-allowed;
        color: #c8c8c8;
        background: #d8d8d8;
        border-color: #d8d8d8;
    }

.ctaBlockBase__disabled___j54_p:hover {
            background: #d8d8d8;
            color: #c8c8c8;
        }

@media (max-width: 1279.9px) {
        .ctaBlockBase__ctaBtn___1aih7 {
            max-width: 100%;
            padding: 11px 5px;
            font-size: 18px;
            letter-spacing: 0;
        }
    }

.sticky-outer-wrapper.active .ctaBlockBase__cta___2HIap {
    -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 8px 10px -7px;
            box-shadow: rgba(0, 0, 0, 0.3) 0 8px 10px -7px;
    padding-bottom: 11px;
}

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.addToFavorites__title___1M-UU {
        display: block;
    }

.addToFavorites__button___1tzSr {
        margin-top: .7rem;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.ctaBlockSunglasses__addToCart___3uLEi {
        max-width: 100%;
        margin-top: 11px;
    }

.ctaBlockSunglasses__cta___2zcKa {
        background-color: #fff;
    }

.ctaBlockSunglasses__cta___2zcKa button {
            height: 64px;
        }

.ctaBlockSunglasses__ctaBtnRxSmall___1Lbgo {
        font-size: 20px;
        letter-spacing: .33px;
        font-weight: normal;
        margin-top: 3px;
    }

@media (max-width: 1279.9px) {
        .ctaBlockSunglasses__cta___2zcKa, .ctaBlockSunglasses__ctaBtnRxSmall___1Lbgo {
            font-size: 18px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.ctaBlock__note___1VV0d {
        font-family: Roboto, Arial, sans-serif;
        color: #89959c;
        font-size: 14px;
        line-height: 19px;
        margin-top: 4px;
        text-align: center;
        display: block;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.htoRadioButtons__wrapSwitcher___8OOXx {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        border: 1px solid #f1f1f1;
        border-radius: 12px;
        padding: 4px;
        cursor: pointer;
    }

.htoRadioButtons__reverseOrder___2lPB1 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.TbybAndBuyNowButtons__homeTryOnLogo___2gJEd {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.TbybAndBuyNowButtons__homeTryOnLogo___2gJEd svg {
            color: #00b16a;
        }

.TbybAndBuyNowButtons__popupContainer___24G5w {
        margin: 0 -290px !important;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.TbybAndBuyNowButtons__popupContainer___24G5w {
            margin: 0 -250px !important
    }
        }

@media (max-width: 1279.9px) {

.TbybAndBuyNowButtons__popupContainer___24G5w {
            margin: 0 -30px !important
    }
        }

.TbybAndBuyNowButtons__card___109va {
        padding: 14px 0;
        border-radius: 4px;
    }

.TbybAndBuyNowButtons__buyNow___3Y8uu {
        font-size: 18px;
        line-height: 20px;
    }

.TbybAndBuyNowButtons__bg___2aVa2 {
        background: #f7f8f9;
    }

.TbybAndBuyNowButtons__bg___2aVa2:hover {
            background: #f1f3f4;
        }

.TbybAndBuyNowButtons__tryOn___20G57 {
        width: 117px;
        height: 18px;
        margin-right: 8px;
        position: relative;
        top: 2px;
    }

.TbybAndBuyNowButtons__free___xSHTH {
        width: 44px;
        height: 20px;
    }

.TbybAndBuyNowButtons__advantages___1llOg {
        padding: 0 12px;
    }

.TbybAndBuyNowButtons__circle___5wUIr {
        height: 20px;
        min-width: 20px;
        border: 1px solid #b1b1b1;
        background-color: #fff;
        border-radius: 100%;
        margin-right: 11px;
    }

.TbybAndBuyNowButtons__orangeCircle___j71a9 {
        height: 11px;
        width: 11px;
        background-color: #ff6c00;
        border-radius: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
    }

.TbybAndBuyNowButtons__shortView___3kT_G {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        padding: 2px 14px;
    }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__labelWrapper___1b0_R {
            width: 100%;
        }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__note___1iYpg {
            font-family: Roboto, Arial, sans-serif;
            color: #3a4850;
            font-size: 14px;
            letter-spacing: -.11px;
            line-height: 20px;
            margin-top: 6px;
        }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- {
            color: #3a4850;
            font-size: 18px;
            line-height: 20px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            font-family: Roboto, Arial, sans-serif;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- .TbybAndBuyNowButtons__tooltip___14Caz {
                display: block;
                padding-top: 4px;
            }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- .TbybAndBuyNowButtons__test___3H11_ {
                width: 100px;
            }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- .TbybAndBuyNowButtons__learnMore___2wUQw {
                font-size: 14px;
                line-height: 21px;
                margin-top: 0;
            }

.TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- .TbybAndBuyNowButtons__learnMore___2wUQw svg {
                    width: 18px;
                    height: 18px;
                }

.TbybAndBuyNowButtons__learnMore___2wUQw {
        display: inline-block;
        font-size: 14px;
        line-height: 16px;
        margin-top: 8px;
        cursor: pointer;
        color: #4d4d4d;
        text-decoration: underline;
        white-space: nowrap;
        outline: 0;
        position: relative;
        top: -6px;
        left: 5px;
    }

.TbybAndBuyNowButtons__learnMore___2wUQw:hover, .TbybAndBuyNowButtons__learnMore___2wUQw:focus {
            text-decoration: none;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.TbybAndBuyNowButtons__learnMore___2wUQw {
            margin-left: 3px
    }
        }

@media (max-width: 1279.9px) {

.TbybAndBuyNowButtons__learnMore___2wUQw {
            margin: 12px 0 0 23px
    }
        }

@media (max-width: 1279.9px) {
                .TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- .TbybAndBuyNowButtons__learnMore___2wUQw {
                    margin-left: 3px;
                }

                    .TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__label___3Twh- .TbybAndBuyNowButtons__learnMore___2wUQw svg {
                        width: 14px;
                        height: 14px;
                    }

            .TbybAndBuyNowButtons__shortView___3kT_G .TbybAndBuyNowButtons__note___1iYpg {
                font-size: 13px;
            }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.htoCheckbox__card___33L9u {
        border: 1px solid #e7ebed;
        border-radius: 4px;
        cursor: pointer;
    }

.htoCheckbox__shortView___IUSHE {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        padding: 16px;
    }

.htoCheckbox__labelWrapper___2AhAt {
        margin-left: 12px;
        width: 100%;
    }

.htoCheckbox__label___2NuE3 {
        color: #3a4850;
        font-size: 18px;
        line-height: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        font-family: Roboto, Arial, sans-serif;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.htoCheckbox__tryOn___jL2sG {
        width: 117px;
        height: 18px;
        margin-right: 8px;
        position: relative;
        top: 2px;
        color: #00b16a;
    }

.htoCheckbox__free___eWXHo {
        width: 44px;
        height: 20px;
    }

.htoCheckbox__learnMore___3kYX0 {
        display: inline-block;
        font-size: 14px;
        line-height: 16px;
        margin-top: 8px;
        cursor: default;
        color: #4d4d4d;
        text-decoration: underline;
        white-space: nowrap;
        outline: 0;
        position: relative;
        top: -6px;
        left: 5px;
    }

.htoCheckbox__learnMore___3kYX0:hover, .htoCheckbox__learnMore___3kYX0:focus {
            text-decoration: none;
        }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.htoCheckbox__learnMore___3kYX0 {
            margin-left: 3px
    }
        }

@media (max-width: 1279.9px) {

.htoCheckbox__learnMore___3kYX0 {
            margin: 12px 0 0 23px
    }
        }

.htoCheckbox__advantages___1eMQ7 {
        background: #f8f8f8;
        color: #3a4850;
        padding: 16px;
        font-size: 14px;
        line-height: 22px;
    }

.htoCheckbox__advantages___1eMQ7 .htoCheckbox__learnMore___3kYX0 {
            top: 0;
            left: 0;
            margin: 0;
        }

.htoCheckbox__htoSelected___B6EEi {
        background: #f1f3f4;
        color: #0f0f0f;
    }

.htoCheckbox__popupContainer___DeutT {
        margin: 0 -290px !important;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.htoCheckbox__popupContainer___DeutT {
            margin: 0 -250px !important
    }
        }

@media (max-width: 1279.9px) {

.htoCheckbox__popupContainer___DeutT {
            margin: 0 -30px !important
    }
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.productHtoModeSwitcher__note___1Iuu0 {
        width: 100%;
        padding: 12px;
        border: 1px solid #f1f1f1;
        border-radius: 8px;
        -webkit-box-shadow: 0 1px 0 0 rgba(58, 72, 80, 0.14), 1px 2px 11px -1px rgba(137, 149, 156, 0.14);
                box-shadow: 0 1px 0 0 rgba(58, 72, 80, 0.14), 1px 2px 11px -1px rgba(137, 149, 156, 0.14);
        color: #6b6b6b;
        font-size: 14px;
        line-height: 21px;
        margin-top: 12px;
    }

.productHtoModeSwitcher__note___1Iuu0 .productHtoModeSwitcher__title___vBXoS {
            font-weight: 700;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.advantages__advantages___2zVDb {
        position: relative;
        font-family: Roboto, Arial, sans-serif;
        margin-top: 24px;
        margin-bottom: 20px;
        font-size: 13px;
        line-height: 1.15;
        color: #898989;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 0 21px;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

.advantages__advantages___2zVDb.advantages__planoWrapper___1jlur {
            margin-top: 31px;
            margin-bottom: 28px;
        }

.advantages__iconBox___13U8X {
        margin-right: 16px;
    }

.advantages__item___3MJIL {
        position: relative;
        min-height: 17px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        color: #0f0f0f;
    }

.advantages__item___3MJIL[role=button] {
            cursor: pointer;
        }

.advantages__item___3MJIL:last-child {
            margin-bottom: 0;
        }

.advantages__content___9rWE5 {
        font-size: 13px;
        line-height: 1.4;
        letter-spacing: .2px;
        font-weight: 300;
        color: #0f0f0f;
    }

.advantages__shippingTruck___1n9mW * {
        stroke-width: 1.3;
    }

.advantages__money___pXStH * {
        stroke-width: 1.2;
    }

@media (max-width: 1279.9px) {
        .advantages__advantages___2zVDb {
            padding: 0;
        }
    }

@media (max-width: 1279.9px), (min-width: 1280px) and (max-width: 1439.9px) {
        .advantages__advantages___2zVDb {
            margin: 12px 0 10px;
        }

        .advantages__iconBox___13U8X {
            margin-right: 8px;
        }
    }

.productFlowBlock__wrapper___2khoZ {
        width: 100%;
        max-width: 342px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.bestPriceBadge__container___3Iz_a {
        position: relative;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 86px;
        height: 24px;
        margin-left: 10px;
        border-radius: 0 1px 1px 0;
        background-color: #ffd021;
        cursor: default;
    }

.bestPriceBadge__container___3Iz_a::before {
            content: '';
            position: absolute;
            top: 0;
            left: -10px;
            display: inline-block;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 12px 10px 12px 0;
            border-color: transparent #ffd021 transparent transparent;
        }

.bestPriceBadge__signIconWrapper___2we57 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 11px;
        height: 10px;
        color: #4d4d4d;
    }

.bestPriceBadge__label___3DLt2 {
        margin: 0 5px;
        font-size: 12px;
        color: #4d4d4d;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.react-tiny-popover-container {
    -webkit-transition-delay: 100ms !important;
            transition-delay: 100ms !important;
}

.bestPricePopover__container___2ACQf {
        padding: 10px 20px;
        background: #fff;
        -webkit-box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.08);
                box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.08);
        border-radius: 2px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }

.bestPricePopover__container___2ACQf .bestPricePopover__header___TIhhz {
            font-size: 14px;
            letter-spacing: .55px;
            color: #2c2c2c;
        }

.bestPricePopover__container___2ACQf .bestPricePopover__content___3VbVQ {
            color: #9b9b9b;
            font-size: 13px;
            line-height: 21px;
            letter-spacing: .51px;
        }

.bestPricePopover__container___2ACQf .bestPricePopover__link___3hPFM {
            color: #9b9b9b;
            font-size: 13px;
            text-decoration: underline;
            letter-spacing: .51px;
            font-style: italic;
        }

.bestPrice__container___2CKZQ {
        display: inline-block;
        margin-left: 10px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.monthlyPaymentsPopup__monthlyPayments___1jN9E {
    width: 730px;
    height: auto;
}

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__header___3F9Xm {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        height: 50px;
        background: #23aae2;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__headerCaption___3zZwH {
        margin: 0;
        font: normal 16px/50px Roboto, Arial, sans-serif;
        color: #fff;
        text-align: center;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__body___vZv00 {
        padding: 30px;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyCaption___2v7cp {
        margin-bottom: 20px;
        font: bold 36px/41px Roboto, Arial, sans-serif;
        letter-spacing: -.02em;
        margin-top: 0;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyDescription___geaoB {
        font: italic 18px/18px Roboto, Arial, sans-serif;
        letter-spacing: -.02em;
        color: #6d6d6d;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyQuestion___8IpHp {
        margin: 20px 0 5px;
        color: #23aae2;
        font: italic 19px/28px Georgia;
        letter-spacing: -.02em;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyQuestionDescription____xt2- {
        list-style: decimal;
        padding-left: 15px;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyQuestionDescriptionItem___iYm9o {
        font: normal 15px/24px Roboto, Arial, sans-serif;
        color: #000;
        letter-spacing: -.02em;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyQuestion2___OpLDa {
        margin: 25px 0 10px;
        color: #23aae2;
        font: italic 15px/15px Georgia;
        letter-spacing: -.02em;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyQuestion2Description___lqtJU {
        margin-bottom: 20px;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyQuestion2DescriptionItem___PxTd3 {
        font: normal 15px/24px Roboto, Arial, sans-serif;
        color: #000;
        letter-spacing: -.02em;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyTable___1819m {
        width: 630px;
        border-collapse: collapse;
        border-spacing: 0;
    }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyTable___1819m th {
            background-color: #5ecfea;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            padding-left: 30px;
            height: 30px;
            font: normal 15px/17px Roboto, Arial, sans-serif;
            color: #2d2d2d;
            letter-spacing: -.02em;
            text-align: left;
            vertical-align: middle;
        }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyTable___1819m td {
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            padding-left: 30px;
            height: 30px;
            font: normal 15px/17px Roboto, Arial, sans-serif;
            color: #2d2d2d;
            letter-spacing: -.02em;
            text-align: left;
            vertical-align: middle;
            background-color: #f1f1f1;
        }

.monthlyPaymentsPopup__monthlyPayments___1jN9E .monthlyPaymentsPopup__bodyAnswer___1i-Ap {
        margin-top: 25px;
        font: 15px/24px Roboto, Arial, sans-serif;
        color: #2d2d2d;
        letter-spacing: -.02em;
        text-transform: uppercase;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.splitIt__container___1Rb1B {
        margin-top: 3px;
    }

.splitIt__text___14CoU {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        font-size: 14px;
        line-height: 16px;
        color: #2a2727;
    }

.splitIt__item___3czxH {
        margin-right: 5px;
    }

.splitIt__btn___3NBHF {
        display: inline-block;
        margin-left: 3px;
        background: none;
        border: none;
        cursor: pointer;
        color: #3a4850;
        font-size: 14px;
        font-family: Roboto, Arial, sans-serif;
        text-decoration: underline;
        outline: none;
    }

.splitIt__btn___3NBHF:hover {
            text-decoration: none;
        }

.splitIt__details___2fhJg {
        font-size: 14px;
        line-height: 16px;
        text-decoration: underline;
        margin: 0 11px 0 2px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.price__priceWrapper___1D3pd {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: baseline;
            -ms-flex-align: baseline;
                align-items: baseline;
        margin-top: 32px;
    }

.price__price___234lh {
        font-size: 18px;
        color: #2a2727;
    }

.price__price___234lh.price__old___2lG9U {
            font-size: 16px;
            text-decoration: line-through;
            color: #2a2727;
            margin-right: 15px;
        }

.price__price___234lh.price__old___2lG9U.price__revert___3_V9e {
                margin-right: 8px;
            }

.price__offPercent___1w2D_ {
        color: #f22a42;
        font-family: Roboto, Arial, sans-serif;
        font-size: 18px;
        font-weight: 700;
        letter-spacing: -.1px;
        line-height: 21px;
    }

.price__specPrice___2TjhJ {
        font-size: 18px;
        color: #f22a42;
        margin-right: 8px;
    }

.price__specPrice___2TjhJ.price__revert___3_V9e {
            margin-right: 13px;
        }

.price__note___3IRcx {
        font-family: Roboto, Arial, sans-serif;
        color: #89959c;
        font-size: 14px;
        letter-spacing: .43px;
        line-height: 19px;
        display: inline-block;
        margin-top: 4px;
    }

@media (max-width: 1279.9px) {
        .price__price___234lh {
            font-size: 18px;
        }

            .price__price___234lh.price__old___2lG9U {
                font-size: 14px;
            }

        .price__specPrice___2TjhJ, .price__offPercent___1w2D_ {
            font-size: 16px;
        }

        .price__note___3IRcx, .price__includingLenses___1Z-bT {
            font-size: 14px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.specialBrandsPrice__wrapper___3GsOd {
        margin: 28px 0 -12px;
    }

.specialBrandsPrice__price___1EoGo {
        font-size: 18px;
        line-height: 21px;
        color: #0f0f0f;
    }

.specialBrandsPrice__couponOffer___5U4gf {
        padding-top: 4px;
        font-size: 14px;
        line-height: 1.5;
        color: #3a4850;
    }

.specialBrandsPrice__discountValue___1xoti {
        color: #f22a42;
    }

.specialBrandsPrice__couponNote___1BJ-1 {
        color: #2196f3;
        text-decoration: underline;
        cursor: pointer;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.reviewsListItem__ratingAndVerified___1Uhvp {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 10px;
    }

.reviewsListItem__verified___3vHkM {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        position: relative;
        font-size: 13px;
        height: 20px;
    }

.reviewsListItem__verified___3vHkM::before {
            content: '';
            width: 7px;
            height: 4px;
            border-left: 2px solid #fff;
            border-bottom: 2px solid #fff;
            -webkit-transform: rotate(-45deg);
                    transform: rotate(-45deg);
            position: absolute;
            right: 4px;
            top: 5px;
            -webkit-box-sizing: content-box;
                    box-sizing: content-box;
        }

.reviewsListItem__verified___3vHkM::after {
            content: '';
            background: #69d969;
            width: 17px;
            height: 17px;
            margin-left: 3px;
            border-radius: 2px;
        }

.reviewsListItem__title___2_YXI {
        font-size: 18px;
        font-weight: 700;
        color: #4d4d4d;
        margin-bottom: 3px;
    }

@media (max-width: 1279.9px) {

.reviewsListItem__title___2_YXI {
            font-size: 16px;
            margin-bottom: 1px;
            margin-top: 11px
    }
        }

.reviewsListItem__author___33Lyq {
        margin-bottom: 15px;
        color: #c8c8c8;
        font-weight: 400;
        font-size: 12px;
    }

.reviewsListItem__author___33Lyq .reviewsListItem__authorName___3QVlM {
            margin: 0 3px;
            font-weight: 700;
        }

.reviewsListItem__author___33Lyq .reviewsListItem__creatingDate___1iTLd {
            margin-left: 3px;
        }

@media (max-width: 1279.9px) {

.reviewsListItem__author___33Lyq {
            font-size: 11px
    }
        }

.reviewsListItem__photos___3oOxO {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin-bottom: 10px;
    }

.reviewsListItem__photo___kWt8V {
        border: none;
        background: none;
    }

.reviewsListItem__description___1mGBV {
        max-height: 95px;
        margin-bottom: 21px;
        position: relative;
        overflow: hidden;
        color: #747d83;
        font-size: 16px;
        line-height: 23px;
        font-weight: 400;
    }

.reviewsListItem__description_open___TQz8P {
            max-height: 100%;
        }

@media (max-width: 1279.9px) {

.reviewsListItem__description___1mGBV {
            margin-bottom: 17px;
            font-size: 13px;
            line-height: 20px
    }

            .reviewsListItem__description___1mGBV:empty {
                margin-bottom: 0;
            }
        }

.reviewsListItem__cropper___MGuhf {
        background-color: #fff;
        position: absolute;
        bottom: -1px;
        right: 0;
        -webkit-box-shadow: -5px 0 10px 0 #fff;
                box-shadow: -5px 0 10px 0 #fff;
        padding-left: 5px;
    }

.reviewsListItem__cropper___MGuhf .reviewsListItem__cropperButton___CgRdu {
            font-weight: 400;
            background-color: transparent;
            margin-left: 3px;
            border: none;
            position: relative;
            color: #00b0a5;
            font-size: 14px;
            cursor: pointer;
        }

@media (max-width: 1279.9px) {

.reviewsListItem__cropper___MGuhf .reviewsListItem__cropperButton___CgRdu {
                font-size: 11px
        }
            }

.reviewsListItem__cropper___MGuhf .reviewsListItem__cropperButton___CgRdu::after {
            display: block;
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1px;
            background-color: #00b0a5;
        }

.reviewsListItem__additional___1OIGU {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        margin-bottom: 36px;
    }

.reviewsListItem__additional__item___1tgk- {
            -webkit-box-flex: 1;
                -ms-flex-positive: 1;
                    flex-grow: 1;
        }

.reviewsListItem__additional__title___2tNf1 {
            font-size: 12px;
            line-height: 15px;
            text-align: center;
            color: #b1b1b1;
        }

@media (max-width: 1279.9px) {

.reviewsListItem__additional__title___2tNf1 {
                font-size: 11px
        }
            }

.reviewsListItem__additional__value___2WCqY {
            font-size: 13px;
            color: #4d4d4d;
            font-weight: 700;
            text-align: center;
        }

@media (max-width: 1279.9px) {

.reviewsListItem__additional__value___2WCqY {
                font-size: 12px;
                line-height: 17px
        }
            }

.reviewsListItem__additional___1OIGU .reviewsListItem__divider___2oBvF {
            width: 1px;
            height: 22px;
            background-color: #f1f1f1;
        }

@media (max-width: 1279.9px) {

.reviewsListItem__additional___1OIGU {
            margin-bottom: 38px
    }
        }

.reviewsListItem__share___2ociS {
        color: #a2abb3;
        font-size: 14px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.reviewsListItem__shareTitle___katOi {
        margin-right: 9px;
    }

.reviewsListItem__shareIcons___LF8_u {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 22px;
        margin-top: -1px;
    }

.reviewsListItem__shareIcon___Kp2aA {
        height: 22px;
        width: 22px;
        background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/043250dc09a8d6ac9369c7ced11fd800.png) no-repeat center;
        margin-right: 8px;
        display: block;
        cursor: pointer;
    }

.reviewsListItem__shareIcon_twitter___WYQ3N {
            background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/4bf59960235e2a6135eb49675a842aa0.png);
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.reviewsList__wrapper___3Ysye {
        background-color: #fff;
    }

.reviewsList__item___HOhsm {
        border-bottom: 1px solid #e9e7e3;
        padding: 27px 0;
    }

@media (max-width: 1279.9px) {

.reviewsList__item___HOhsm {
            padding-bottom: 20px
    }
        }

.reviewsList__item___HOhsm:last-child {
            border-bottom-color: transparent;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.reviewMedia__wrapper___3Fbs0 {
        padding: 45px 100px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }

.reviewMedia__title___V66xa {
        color: #2d2d2d;
        font-size: 26px;
        font-weight: 400;
        letter-spacing: .06em;
        text-transform: uppercase;
        margin-bottom: 17px;
    }

.reviewMedia__productName___3BD8a {
        color: #2d2d2d;
        text-transform: uppercase;
    }

.reviewMedia__productInfo___nfaLL {
        font-size: 15px;
        font-family: Roboto, Arial, sans-serif;
        color: #4d4d4d;
        margin-bottom: 17px;
    }

.reviewMedia__productColor___8779D {
        font-style: italic;
        font-family: Georgia;
    }

.reviewMedia__photo___3BMFv {
        width: 420px;
        height: 380px;
        position: relative;
        -webkit-transition: background-image .5s linear;
        transition: background-image .5s linear;
    }

.reviewMedia__thumbnails___OtDPa {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin-top: 30px;
    }

.reviewMedia__thumbnailsItem___2D9aD {
        margin: 0 10px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        background: none;
        border: transparent;
        border-top: 2px solid transparent;
        border-bottom: 2px solid transparent;
        line-height: 0;
    }

.reviewMedia__thumbnailsItemActive___2cYh2 {
        border-top: 2px solid #3fabe6;
        border-bottom: 2px solid #3fabe6;
    }

.reviewMedia__arrow___2_bDY {
        background-color: transparent;
        position: absolute;
        top: 50%;
        margin-top: -13px;
        cursor: pointer;
        border: none;
    }

.reviewMedia__arrow___2_bDY::before {
            border: solid #8d8d8d;
            border-width: 0 2px 2px 0;
            display: inline-block;
            padding: 12px;
            content: "";
        }

.reviewMedia__arrow___2_bDY:hover::before {
                border: solid #3fabe6;
                border-width: 0 2px 2px 0;
            }

.reviewMedia__arrowPrev___2xbig {
        left: -50px;
    }

.reviewMedia__arrowPrev___2xbig::before {
            -webkit-transform: rotate(135deg);
                    transform: rotate(135deg);
        }

.reviewMedia__arrowNext___2wSKz {
        right: -50px;
    }

.reviewMedia__arrowNext___2wSKz::before {
            -webkit-transform: rotate(-45deg);
                    transform: rotate(-45deg);
        }

.reviewMedia__content___3mDzd {
        position: relative;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.reviews__reviewsPhotosBlock___1jnFF {
        margin-top: 20px;
    }

.reviews__reviewsPhotos___1xq4M, .reviews__reviewsPhotosSlider___3cVax {
        padding-bottom: 44px;
        border-bottom: 1px solid #e9e7e3;
    }

.reviews__reviewsPhotos___1xq4M img, .reviews__reviewsPhotosSlider___3cVax img {
            cursor: pointer;
        }

.reviews__reviewsPhotos___1xq4M {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        overflow: hidden;
    }

.reviews__reviewPhoto___2TycK {
        border: none;
        background: none;
        line-height: 0;
        width: 100%;
        max-width: 170px;
        height: 206px;
        overflow: hidden;
    }

.reviews__reviewPhoto___2TycK img {
            height: 100%;
            position: relative;
            left: 50%;
            -webkit-transform: translateX(-50%);
                    transform: translateX(-50%);
        }

.reviews__writeReview___1h9mO {
        margin-bottom: 15px;
        font-size: 14px;
        line-height: 16px;
        color: #2d2d2d;
        position: relative;
        display: inline-block;
    }

.reviews__writeReview___1h9mO::after {
            display: block;
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1px;
            background-color: #2d2d2d;
        }

.reviews__footer___1wK94 {
        padding-bottom: 5px;
        text-align: center;
    }

.reviews__moreReview___2lA7U {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-pack: center !important;
            -ms-flex-pack: center !important;
                justify-content: center !important;
        background-color: #f1f1f1;
        color: #6d6d6d;
        font: 700 15px Roboto, Arial, sans-serif;
        height: 50px;
        border-radius: 2px;
    }

.reviews__loader___xUQf0 {
        background-color: #fff !important;
    }

.reviews__loader___xUQf0::before, .reviews__loader___xUQf0::after {
            background-color: #fff !important;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.collapse__header___e4g08 {
        background: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        padding: 10px 0 6px;
        cursor: pointer;
        color: #3a4850;
    }

.collapse__header___e4g08 .collapse__title___3x3M9 {
            font-size: 14px;
            font-weight: 700;
            line-height: 18px;
            pointer-events: none; /* for analytics click hack */
            width: 90%;
            margin: 0 0 7px;
        }

.collapse__collapsed___1gBWY {
        color: #2196f3;
    }

.collapse__collapsed___1gBWY .collapse__title___3x3M9 {
            color: #2196f3;
        }

.collapse__content___17d5b {
        background: #fff;
        padding: 10px 0 6px;
        color: #6d6d6d;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {
        .collapse__header___e4g08 {
            padding: 13px 0 6px;
        }

            .collapse__header___e4g08 .collapse__title___3x3M9 {
                font-size: 16px;
            }

            .collapse__header___e4g08 .collapse__icon___3FlQI {
                -webkit-transform: scale(1);
                        transform: scale(1);
            }

        .collapse__content___17d5b {
            padding: 13px 0 6px;
        }
    }

@media (min-width: 1440px) {
        .collapse__header___e4g08 {
            padding: 13px 0 6px;
        }

            .collapse__header___e4g08 .collapse__content___17d5b {
                padding: 13px 0 6px;
            }

            .collapse__header___e4g08 .collapse__title___3x3M9 {
                font-size: 16px;
            }

            .collapse__header___e4g08 .collapse__icon___3FlQI {
                -webkit-transform: scale(1);
                        transform: scale(1);
            }

        .collapse__content___17d5b {
            padding: 13px 0 6px;
        }
    }

@media (max-width: 1279.9px) {
        .collapse__header___e4g08 {
            padding: 6px 0;
        }

        .collapse__content___17d5b {
            padding: 6px 0;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.frameDetailsAndMeasurements__description___2AKp1 {
        font-size: 14px;
        line-height: 23px;
        margin-top: 8px;
    }

.frameDetailsAndMeasurements__title___b1Qoa {
        font-size: 16px;
        font-weight: 700;
        width: 60%;
    }

.frameDetailsAndMeasurements__header___1A5rN {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        margin: 18px 0 6px;
    }

.frameDetailsAndMeasurements__calc___1E9_1 {
        width: 18%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }

.frameDetailsAndMeasurements__calc___1E9_1 button {
            border: none;
            background: #fff;
            cursor: pointer;
            color: #3fabe6;
            text-decoration: underline;
            display: inline-block;
            font-weight: 700;
        }

.frameDetailsAndMeasurements__calc___1E9_1 button:first-child {
                margin-right: 10px;
            }

.frameDetailsAndMeasurements__calc___1E9_1 button.frameDetailsAndMeasurements__active___hTJ8c {
                cursor: default;
                border: none;
                color: #747d83;
                text-decoration: none;
                font-weight: 400;
            }

.frameDetailsAndMeasurements__data___kcRlA {
        font-size: 14px;
        line-height: 21px;
    }

.frameDetailsAndMeasurements__measurments___2dvu9 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        margin-top: 30px;
    }

.frameDetailsAndMeasurements__measurmentsItem___7OmVN {
        width: 100%;
        text-align: left;
        margin-bottom: 29px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.frameDetailsAndMeasurements__measurmentsItem___7OmVN:last-child {
            margin-bottom: 20px;
        }

.frameDetailsAndMeasurements__measurmentsItem___7OmVN .frameDetailsAndMeasurements__img___3pzje {
            width: 100px;
        }

.frameDetailsAndMeasurements__measurmentsItem___7OmVN .frameDetailsAndMeasurements__img___3pzje img {
                max-width: 100%;
            }

.frameDetailsAndMeasurements__measurmentsItem___7OmVN span {
            text-align: center;
            font-size: 15px;
            display: inline-block;
        }

@media screen and (max-width: 1279px) {
        .frameDetailsAndMeasurements__description___2AKp1 {
            font-size: 12px;
            line-height: 17px;
        }

        .frameDetailsAndMeasurements__header___1A5rN {
            margin: 18px 0 2px;
        }
            .frameDetailsAndMeasurements__calc___1E9_1 button {
                font-size: 12px;
            }

        .frameDetailsAndMeasurements__title___b1Qoa {
            font-size: 13px;
            font-weight: 700;
            width: 53%;
        }

        .frameDetailsAndMeasurements__data___kcRlA {
            font-size: 11px;
            line-height: 17px;
        }

        .frameDetailsAndMeasurements__measurments___2dvu9 {
            margin-top: 20px;
        }

        .frameDetailsAndMeasurements__measurmentsItem___7OmVN {
            margin-bottom: 15px;
        }

            .frameDetailsAndMeasurements__measurmentsItem___7OmVN span {
                font-size: 12px;
            }

            .frameDetailsAndMeasurements__measurmentsItem___7OmVN .frameDetailsAndMeasurements__img___3pzje {
                width: 65px;
                margin-right: 11px;
            }
    }

@media screen and (min-width: 1280px) {
        .frameDetailsAndMeasurements__description___2AKp1 {
            font-size: 15px;
            line-height: 22px;
        }

        .frameDetailsAndMeasurements__header___1A5rN {
            margin: 20px 0 3px;
        }
            .frameDetailsAndMeasurements__calc___1E9_1 button {
                font-size: 16px;
            }

        .frameDetailsAndMeasurements__title___b1Qoa {
            font-size: 16px;
            font-weight: 700;
            width: 70%;
        }

        .frameDetailsAndMeasurements__data___kcRlA {
            font-size: 15px;
            line-height: 22px;
        }

        .frameDetailsAndMeasurements__measurments___2dvu9 {
            margin-top: 28px;
        }

        .frameDetailsAndMeasurements__measurmentsItem___7OmVN {
            margin-bottom: 24px;
        }

            .frameDetailsAndMeasurements__measurmentsItem___7OmVN span {
                font-size: 15px;
            }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.shippingAndReturns__container___xaFK8 {
        color: #747d83;
        font-size: 12px;
    }

.shippingAndReturns__container___xaFK8 p {
            font-size: 12px;
        }

.shippingAndReturns__header___2W_PC {
        margin-bottom: 13px;
        font-size: 13px;
        font-weight: 700;
        color: #2d2d2d;
    }

.shippingAndReturns__rates___3O6t2 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        margin-bottom: 6px;
        font-size: 12px;
    }

.shippingAndReturns__rates___3O6t2 .shippingAndReturns__description___1tCbL {
            width: 85%;
            line-height: 19px;
        }

.shippingAndReturns__rates___3O6t2 .shippingAndReturns__price___2wOmG {
            width: 15%;
            text-align: right;
            font-weight: 700;
        }

.shippingAndReturns__pleaseNoteCon___LSxsB {
        border: 1px solid #2d2d2d;
        padding: 12px;
        position: relative;
        margin: 18px 0 21px;
    }

.shippingAndReturns__pleaseNoteCon___LSxsB .shippingAndReturns__pleaseNoteHeader___nYI2Y {
            position: absolute;
            top: -14px;
            left: 16px;
            font-style: italic;
            background: #fff;
            padding: 3px 6px;
            color: #747d83;
            font-size: 11px;
            line-height: 20px;
        }

.shippingAndReturns__pleaseNoteCon___LSxsB .shippingAndReturns__pleaseNoteText___UeIUc {
            color: #747d83;
            font-size: 10px;
            line-height: 14px;
        }

.shippingAndReturns__mbg___1xalN {
        margin-bottom: 0;
        font-weight: 700;
        font-size: 12px;
    }

.shippingAndReturns__mbgDesc___3_tZZ {
        margin-bottom: 5px;
        font-size: 12px;
        line-height: 17px;
    }

.shippingAndReturns__mbgDesc2___kfrDb {
        margin-bottom: 0;
        font-weight: 700;
        font-size: 11px;
        line-height: 17px;
    }

.shippingAndReturns__black___3BIWZ {
        color: #000;
    }

.shippingAndReturns__smallNote___3mV6A {
        font-size: 9px;
        margin-bottom: 20px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {
        .shippingAndReturns__container___xaFK8 {
            font-size: 15px;
        }

            .shippingAndReturns__container___xaFK8 p {
                font-size: 15px;
            }

        .shippingAndReturns__header___2W_PC {
            margin-bottom: 20px;
            font-size: 16px;
        }

        .shippingAndReturns__rates___3O6t2 {
            margin-bottom: 12px;
            font-size: 14px;
        }

            .shippingAndReturns__rates___3O6t2 .shippingAndReturns__description___1tCbL {
                line-height: 23px;
            }

        .shippingAndReturns__pleaseNoteCon___LSxsB {
            margin: 34px 0 21px;
        }

            .shippingAndReturns__pleaseNoteCon___LSxsB .shippingAndReturns__pleaseNoteHeader___nYI2Y {
                left: 22px;
                font-size: 13px;
                line-height: 22px;
            }

            .shippingAndReturns__pleaseNoteCon___LSxsB .shippingAndReturns__pleaseNoteText___UeIUc {
                font-size: 13px;
                line-height: 20px;
            }

        .shippingAndReturns__mbg___1xalN {
            margin-bottom: 5px;
            font-weight: 700;
            font-size: 15px;
        }

        .shippingAndReturns__mbgDesc___3_tZZ {
            margin-bottom: 14px;
            font-size: 14px;
            line-height: 20px;
        }

        .shippingAndReturns__mbgDesc2___kfrDb {
            margin-bottom: 7px;
            font-weight: 700;
            font-size: 14px;
            line-height: 20px;
        }

        .shippingAndReturns__smallNote___3mV6A {
            font-size: 12px;
        }
    }

@media (min-width: 1440px) {
        .shippingAndReturns__container___xaFK8 {
            font-size: 15px;
        }

            .shippingAndReturns__container___xaFK8 p {
                font-size: 15px;
            }

        .shippingAndReturns__header___2W_PC {
            margin-bottom: 20px;
            font-size: 16px;
        }

        .shippingAndReturns__rates___3O6t2 {
            margin-bottom: 12px;
            font-size: 14px;
        }

            .shippingAndReturns__rates___3O6t2 .shippingAndReturns__description___1tCbL {
                line-height: 23px;
            }

        .shippingAndReturns__pleaseNoteCon___LSxsB {
            margin: 34px 0 21px;
        }

            .shippingAndReturns__pleaseNoteCon___LSxsB .shippingAndReturns__pleaseNoteHeader___nYI2Y {
                left: 22px;
                font-size: 13px;
            }

            .shippingAndReturns__pleaseNoteCon___LSxsB .shippingAndReturns__pleaseNoteText___UeIUc {
                font-size: 13px;
                line-height: 20px;
            }

        .shippingAndReturns__mbg___1xalN {
            margin-bottom: 5px;
            font-weight: 700;
            font-size: 15px;
        }

        .shippingAndReturns__mbgDesc___3_tZZ {
            margin-bottom: 14px;
            font-size: 14px;
            line-height: 20px;
        }

        .shippingAndReturns__mbgDesc2___kfrDb {
            margin-bottom: 7px;
            font-weight: 700;
            font-size: 14px;
            line-height: 20px;
        }

        .shippingAndReturns__smallNote___3mV6A {
            font-size: 12px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.rightSideBar__sideBarTitle___11z8g {
        color: #a2abb3;
        font-size: 20px;
        line-height: 50px;
        font-weight: 400;
        margin: 0 0 8px;
        font-family: Roboto, Arial, sans-serif;
    }

.rightSideBar__item___1gM3t {
        margin: 12px 0 8px 20px;
    }

.rightSideBar__item___1gM3t:first-child {
            margin-top: 0;
        }

.rightSideBar__item___1gM3t:last-child {
            margin-bottom: 0;
        }

@media (max-width: 1279.9px) {
        .rightSideBar__sideBar___1EX3Q {
            width: 245px;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
        }

        .rightSideBar__sideBarTitle___11z8g {
            font-size: 15px;
            line-height: 38px;
        }

        .rightSideBar__item___1gM3t {
            margin: 7px 0 7px 14px;
        }
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.backToResults__item___1RN9v {
        display: inline-block;
    }

.backToResults__item___1RN9v::after {
            padding: 0 5px;
            content: '|';
            color: #747d83;
        }

.backToResults__itemTitle___2Hb_m {
        color: #3fabe6;
        font-style: italic;
    }

.backToResults__arrowLeft___2NZC9 {
        color: #3fabe6;
        padding-right: 4px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.backToResults__item___16xyj {
        display: inline-block;
        font: 12px/12px Roboto, Arial, sans-serif;
    }

.backToResults__item___16xyj:first-child::before {
                display: inline-block;
                content: '\221F';
                color: #5b6971;
                -webkit-transform: rotate(45deg) scale(.9);
                        transform: rotate(45deg) scale(.9);
                margin-right: 6px;
            }

.backToResults__item___16xyj::after {
            padding: 0 6px;
            content: '\002F';
            color: #747d83;
        }

.backToResults__itemTitle___3hDaK {
        color: #5b6971;
    }

.backToResults__itemTitle___3hDaK:hover {
            text-decoration: underline;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.pdpBanner__container___2t5GD {
        background: #f1f1f1;
        max-width: 1300px;
        min-width: 932px;
        margin: 0 auto;
        min-height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.pdpBanner__container___2t5GD {
            max-width: 1166px
    }
        }

@media (max-width: 1279.9px) {

.pdpBanner__container___2t5GD {
            max-width: 930px
    }
        }

.pdpBanner__bottom___1Efgj {
        margin: 35px auto 20px;
    }

.pdpBanner__inner___3IAgA {
        cursor: pointer;
        width: 930px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.pdpBanner__inner___3IAgA {
            width: 837px
    }
        }

@media (max-width: 1279.9px) {

.pdpBanner__inner___3IAgA {
            width: 653px
    }
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

 {
}

.productPage__itemsWrapper___Rkkef {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

.productPage__wrapper___36uvH {
        width: 95%;
        min-height: 200px;
        position: relative;
    }

.productPage__link___MTtYi {
        text-align: center;
        width: 210px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productPage__link___MTtYi {
            width: 190px
    }
        }

@media (max-width: 1279.9px) {

.productPage__link___MTtYi {
            width: 190px
    }
        }

.productPage__titleText___1Sliz {
        font-size: 27px;
        color: #4d4d4d;
    }

.productPage__img___2Q_W7 {
        width: 100%;
        height: 106px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productPage__img___2Q_W7 {
            height: 95px
    }
        }

@media (max-width: 1279.9px) {

.productPage__img___2Q_W7 {
            height: 95px
    }
        }

.productPage__name___10vbI {
        width: 100%;
        height: 20px;
        margin: auto;
        padding: 0 10px;
        font-size: 16px;
        font-weight: 700;
        color: #4d4d4d;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.productPage__priceHolder___3X0y1 {
        text-align: center;
    }

.productPage__price___CXdmq {
        margin-top: 5px;
        font-size: 13px;
        color: #89959c;
    }

.productPage__discount___3P9tv {
        color: #f22a42;
    }

.productPage__outdated___1qPjI {
        margin-right: 5px;
        text-decoration: line-through;
        font-size: 13px;
    }

.productPage__tombstoneWrapper___QwZiZ {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        margin-top: 50px;
    }

.productPage__tombstoneItem___2ImaR {
        width: 25%;
        height: 172px;
        margin: auto;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productPage__tombstoneItem___2ImaR {
            width: 25%
    }
        }

@media (max-width: 1279.9px) {

.productPage__tombstoneItem___2ImaR {
            width: 33%
    }
        }

.productPage__tombstoneImage___2Yp6q {
        width: 210px;
        height: 102px;
        margin: auto;
        border-radius: 2px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productPage__tombstoneImage___2Yp6q {
            width: 190px;
            height: 90px
    }
        }

@media (max-width: 1279.9px) {

.productPage__tombstoneImage___2Yp6q {
            width: 206px;
            height: 90px
    }
        }

.productPage__tombstoneSpecs___1XV8H {
        margin: 2px auto 0;
    }

.productPage__tombstoneTitle___3NxEX {
        width: 210px;
        height: 25px;
        border-radius: 2px;
        margin: auto;
    }

@media (min-width: 1280px) and (max-width: 1439.9px) {

.productPage__tombstoneTitle___3NxEX {
            width: 190px
    }
        }

@media (max-width: 1279.9px) {

.productPage__tombstoneTitle___3NxEX {
            width: 206px
    }
        }

.productPage__tombstonePrice___3D2qt {
        width: 125px;
        height: 15px;
        margin: 2px auto 0;
        border-radius: 2px;
    }

.productPage__tombstoneExcess___2rUpm {
        display: none;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.usageNoticeDisable__notice___1aIlS {
        position: relative;
        margin-top: 18px;
        padding: 11px 15px;
        width: 100%;
        height: 58px;
        font: italic 13px/18px Georgia;
        color: #6d6d6d;
        background: #d8d8d8;
        letter-spacing: .03em;
    }

.usageNoticeDisable__notice___1aIlS::before {
            content: "";
            position: absolute;
            top: -20px;
            right: 70px;
            border: 14px solid transparent;
            border-right-color: #d8d8d8;
            border-left-width: 0;
            -webkit-transform: rotate(90deg);
                    transform: rotate(90deg);
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.usageListTooltip__hint___3U96O {
        position: absolute;
        right: 5px;
        top: 5px;
        cursor: pointer;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
    }

.usageListTooltip__questionMark___85DSc {
        width: 18px;
        height: 18px;
    }

.usageListTooltip__overlay___1vSIA {
        position: relative;
        width: 295px;
        text-align: left;
        -webkit-box-shadow: 0 0 40px #c8c8c8;
                box-shadow: 0 0 40px #c8c8c8;
        padding: 0 15px 15px;
        font: 400 13px/18px Roboto, Arial, sans-serif;
        color: #4d4d4d;
        letter-spacing: .02em;
        background: #fff;
    }

.usageListTooltip__overlay___1vSIA img {
            width: 100%;
        }

.usageListTooltip__header___lNqjQ {
        position: relative;
        display: block;
        padding: 15px 0 10px;
        background: #fff;
        letter-spacing: .05em;
    }

.usageListTooltip__title___1GsCZ {
        font: 700 16px/18px Roboto, Arial, sans-serif;
        color: #4d4d4d;
    }

.usageListTooltip__subtitle___P5xFG {
        font: italic 700 16px/18px Georgia;
        color: #23aae2;
    }

.usageListTooltip__text___9MiDy {
        margin-bottom: 15px !important;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

 {
}

.components__badgeWrapper___1yqbf {
        position: absolute;
        color: #f02f41;
        background-color: #feeef0;
        font-size: 13px;
        margin: 4px;
        padding-left: 5px;
        padding-right: 5px;
        border-radius: 2px;
    }

.components__priceWithoutDiscount___1R4kV {
        margin-left: 5px;
        font-size: 13px;
        text-decoration: line-through;
    }

.components__bannerWrapper___32SXs {
        height: 36px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-left: 6px;
        margin-right: 6px;
        background-color: #f3546a;
        color: #fff;
    }

.components__bannerFullWidthWrapper___2qdg6 {
        width: 100%;
    }

.components__bannerThinTitle___q4dSR {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 20px;
        font-weight: 300;
        letter-spacing: .2px;
    }

.components__bannerThinText___3CCVe {
        font-size: 20px;
    }

.components__bannerDiscountTitle___15Or2 {
        font-weight: 700;
        font-size: 24px;
        margin: 0 5px;
    }

.components__bannerCoupon___3bJAp {
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
    }

.components__bannerDivider___P9mN7 {
        margin: 0 6px;
    }

.components__priceWrapper___35eVM {
        padding: 20px;
        background-color: #898989;
        text-align: center;
    }

.components__price___3VSUa {
        padding: 10px;
        text-align: center;
        font-size: 18px;
        color: #fff;
        font-weight: 700;
    }

.components__firstStepWrapper___3OSB5 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

.components__increaseHeight___bQsWt {
        height: 62px;
    }

.components__firstStepPrices___38kW9 {
        font-size: 15px;
        font-weight: 700;
    }

.components__firstStepCompareText___3k8qB {
        font-size: 12px;
        line-height: 14px;
        text-align: center;
        text-transform: initial;
        font-weight: initial;
    }

.components__marginAuto___1emkp {
        margin: auto;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.usageItem__item___10GEG {
        position: relative;
        cursor: pointer;
        background-color: #fff;
        min-height: 130px;
    }

.usageItem__item___10GEG:hover:not(.usageItem__active___15MWP) {
            background-color: #d8d8d8;
        }

.usageItem__itemWrap___w_hNN {
        position: relative;
        margin: 0 6px 30px;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 170px;
                flex: 0 0 170px;
        text-align: center;
    }

.usageItem__itemWrap___w_hNN.usageItem__multifocalItem___3F-rW {
            -webkit-box-flex: 1;
                -ms-flex: 1 1 auto;
                    flex: 1 1 auto;
        }

.usageItem__triangle___pTOH3 {
        display: none;
    }

.usageItem__active___15MWP .usageItem__triangle___pTOH3 {
            position: absolute;
            z-index: 20;
            display: inline-block;
            top: 74px;
        }

.usageItem__active___15MWP .usageItem__triangle___pTOH3::before {
                content: '';
                position: absolute;
                top: 47px;
                right: -7px;
                border: 14px solid transparent;
                border-right-color: #3fabe6;
                border-left-width: 0;
                -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
            }

.usageItem__active___15MWP .usageItem__triangle___pTOH3::after {
                content: '';
                position: absolute;
                top: 45px;
                right: -7px;
                border: 14px solid transparent;
                border-right-color: #898989;
                border-left-width: 0;
                -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
            }

.usageItem__active___15MWP::after {
            content: '';
            -webkit-box-shadow: inset 0 0 0 2px #3fabe6;
                    box-shadow: inset 0 0 0 2px #3fabe6;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

.usageItem__disable___JT7lg {
        cursor: default;
        opacity: .3;
    }

.usageItem__disable___JT7lg:hover:not(.usageItem__active___15MWP) {
            background-color: #fff;
        }

.usageItem__title___3S85r {
        color: #0f0f0f;
        font-weight: 700;
        font-size: 14px;
        line-height: 18px;
        padding: 35px 10px 8px;
        margin: 0;
        text-transform: uppercase;
        white-space: nowrap;
        overflow: hidden;
        letter-spacing: .01em;
    }

.usageItem__description___n6PX_ {
        position: relative;
        font-size: 14px;
        line-height: 20px;
        font-style: italic;
        font-family: Georgia;
        color: #4d4d4d;
    }

.usageItem__price___1tk8x {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        text-transform: uppercase;
        background: #898989;
        font-size: 15px;
        line-height: 36px;
        color: #fff;
    }

.usageItem__expTriangle___BaM-_ {
        display: none;
    }

.usageItem__active___15MWP .usageItem__expTriangle___BaM-_ {
            position: absolute;
            z-index: 20;
            display: inline-block;
            top: 74px;
        }

.usageItem__active___15MWP .usageItem__expTriangle___BaM-_::before {
                content: '';
                position: absolute;
                top: 72px;
                right: -7px;
                border: 14px solid transparent;
                border-right-color: #3fabe6;
                border-left-width: 0;
                -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
            }

.usageItem__active___15MWP .usageItem__expTriangle___BaM-_::after {
                content: '';
                position: absolute;
                top: 69px;
                right: -7px;
                border: 14px solid transparent;
                border-right-color: #898989;
                border-left-width: 0;
                -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
            }

.usageItem__active___15MWP::after {
            content: '';
            -webkit-box-shadow: inset 0 0 0 2px #3fabe6;
                    box-shadow: inset 0 0 0 2px #3fabe6;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.usages__removeFromMultifocal___1YJ7- {
        font-size: 14px;
        color: #8d8d8d;
        margin: 0 6px;
    }

.usages__action___2cH2w {
        text-decoration: underline;
        cursor: pointer;
    }

.usages__items___2KtYV {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.usages__expProgItem___FzZTK {
        height: 154px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensGuaranteePopup__title___17cg9 {
        font-size: 16px;
        color: #fff;
        text-decoration: none;
    }

.lensGuaranteePopup__name___3-Adv {
        position: relative;
        font-size: 14px;
        vertical-align: bottom;
    }

.lensGuaranteePopup__name___3-Adv:not(:last-child) {
            margin-right: 10px;
        }

.lensGuaranteePopup__name___3-Adv::before {
            content: '';
            display: inline-block;
            width: 27px;
            height: 22px;
            background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/df8b995275751f8b3914daaf9e87c5c6.png) no-repeat;
            position: absolute;
            left: -35px;
            top: -4px;
        }

.lensGuaranteePopup__link___jp70v {
        font-size: 12px;
        font-family: Georgia;
        font-style: italic;
        text-decoration: underline;
        cursor: pointer;
    }

.lensGuaranteePopup__popup___3QBEU {
        width: 600px;
        padding: 30px 40px;
        background: #fff;
    }

.lensGuaranteePopup__header___26suK {
        margin: 20px 0;
        font-size: 29px;
        font-weight: 700;
    }

.lensGuaranteePopup__header___26suK::before {
            content: '';
            width: 80px;
            height: 55px;
            display: inline-block;
            background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/895a1beb52a97775ac25c52dd04179f7.jpg) no-repeat;
            vertical-align: middle;
        }

.lensGuaranteePopup__line___WjOJX {
        margin: 20px 0;
        font-size: 13px;
        line-height: 20px;
    }

.lensGuaranteePopup__firstLine___32r0f {
        font-size: 17px;
        font-weight: 700;
    }

.lensGuaranteePopup__exception___3COOf {
        font-size: 13px;
        font-family: Georgia;
        font-style: italic;
        letter-spacing: .02em;
        line-height: 18px;
    }

.lensGuaranteePopup__note___3ZHcq {
        font-style: italic;
        font-family: Georgia;
        line-height: 18px;
        letter-spacing: .02em;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.eyeglassesPackages__items___JSTvi {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end;
    }

.eyeglassesPackages__wrap___M40ws {
        margin: 0 6px 10px;
    }

.eyeglassesPackages__item___2XmcB {
        position: relative;
        display: block;
        width: 215px;
        cursor: pointer;
        z-index: 0;
    }

.eyeglassesPackages__item___2XmcB:hover:not(.eyeglassesPackages__active___JCsA7)::before {
                content: '';
                position: absolute;
                width: 100%;
                height: 100%;
                background: rgba(44, 44, 44, 0.21);
                z-index: 10;
            }

.eyeglassesPackages__active___JCsA7::after {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            border: 2px solid #23aae2;
            background: 0 0;
        }

.eyeglassesPackages__disable___2ym8Y::after {
            content: '';
            position: absolute;
            display: block;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(248, 248, 248, .68);
        }

.eyeglassesPackages__header___vB3c_ {
        position: relative;
        background: #c5e5f1;
        padding: 15px 10px 15px 15px;
        min-height: 93.2px;
    }

.eyeglassesPackages__title___2Rati {
        margin: 0;
        font: 700 18px/18px Roboto, Arial, sans-serif;
        color: #2d2d2d;
        letter-spacing: .01em;
        text-transform: uppercase;
    }

.eyeglassesPackages__subtitle___2i2I7 {
        display: block;
        margin: 12px 0 0;
        font-size: 12px;
        line-height: 16px;
        font-family: Georgia;
        font-style: italic;
        font-weight: 400;
        color: #2d2d2d;
        text-transform: none;
    }

.eyeglassesPackages__content___2n_Gx {
        padding: 20px 10px;
        height: 400px;
        background: #fff;
    }

.eyeglassesPackages__content___2n_Gx .eyeglassesPackages__icon___1wrIs {
            width: 60px;
            height: 45px;
            margin: 0 auto 15px;
        }

.eyeglassesPackages__content___2n_Gx .eyeglassesPackages__icon___1wrIs svg {
                stroke: none;
            }

.eyeglassesPackages__content___2n_Gx .eyeglassesPackages__text___3pYDl {
            position: relative;
            margin-bottom: 12px;
            padding: 0 5px 0 20px;
            font-size: 14px;
            line-height: 18px;
            color: #6d6d6d;
            letter-spacing: .08em;
        }

.eyeglassesPackages__content___2n_Gx .eyeglassesPackages__text___3pYDl:first-of-type {
                font-size: 13px;
                font-weight: 700;
            }

/* Wait, that's illegal. Just copied it here, this is not mine */

.eyeglassesPackages__content___2n_Gx .eyeglassesPackages__text___3pYDl svg {
                position: absolute;
                width: 17px;
                height: 13px;
                left: -3px;
                top: 4px;
            }

.eyeglassesPackages__content___2n_Gx .eyeglassesPackages__note___Wat8- {
            display: block;
            font: normal 12px/18px Roboto, Arial, sans-serif;
            color: #9a9a9a;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.footer__footer___d35Af {
        padding: 10px;
        background: #8d8d8d;
    }

.footer__priceValue___3Cw84 {
        font-size: 22px;
        line-height: 26px;
        color: #fff;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

.footer__priceTitle___lkLbJ {
        font-size: 14px;
        line-height: 28px;
        color: #fff;
        letter-spacing: .04em;
        text-transform: uppercase;
        vertical-align: top;
    }

.footer__priceInfo___2LCmT {
        font-size: 12px;
        line-height: 18px;
        font-family: Georgia;
        font-style: italic;
        color: #fff;
        letter-spacing: .04em;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.notice__notice___2PiSh {
        display: none;
        position: relative;
        width: 100%;
        padding: 12px 0;
        text-align: center;
        margin: 10px 0;
        font-size: 13px;
        line-height: 18px;
        font-family: Roboto, Arial, sans-serif;
        color: #2c2c2c;
        letter-spacing: .01em;
    }

.notice__grey___2UZqn {
        background: #d8d8d8;
    }

.notice__green___4L-k- {
        background: #95f8c1 url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/5c0e02fca928461444a0c2f5469ba551.png) 10px 8px no-repeat;
        padding: 6px 15px 6px 35px;
        text-align: left;
    }

.notice__visible___1T02j {
        display: block;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensesPackageTooltip__questionMark___2vPtB {
        width: 18px;
        height: 18px;
    }

.lensesPackageTooltip__hint___lk7Kn {
        position: absolute;
        top: 7px;
        right: 10px;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        z-index: 10;
    }

.lensesPackageTooltip__overlay___2ji6l {
        width: 340px;
        padding: 20px 30px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        font-size: 12px;
        line-height: 17px;
        color: #6d6d6d;
        letter-spacing: .06em;
        background: #fff;
        -webkit-box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.13);
                box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.13);
    }

.lensesPackageTooltip__name___1_A0H {
        display: block;
        margin-bottom: 10px;
        font-size: 16px;
        line-height: 23px;
        color: #2186c0;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

.lensesPackageTooltip__description___35TRn {
        font-size: 12px;
        line-height: 17px;
        color: #6d6d6d;
        letter-spacing: .06em;
    }

.lensesPackageTooltip__subItem___27VQS {
        margin: 20px 0;
    }

.lensesPackageTooltip__subName___3Xdes {
        display: block;
        margin-bottom: 10px;
        font-size: 12px;
        line-height: 17px;
        color: #2186c0;
        letter-spacing: .06em;
    }

.lensesPackageTooltip__subDesc___2Q6jw {
        font-size: 12px;
        line-height: 17px;
        color: #6d6d6d;
        letter-spacing: .06em;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.sunglassesPackages__items___1vz3M {
        margin-bottom: 10px;
        margin-top: 15px;
    }

.sunglassesPackages__radiobutton___2BLxM {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 20px;
        cursor: pointer;
    }

.sunglassesPackages__label___UE_87 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 465px;
        margin-left: 10px;
        margin-top: -5px;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

.sunglassesPackages__disable___2fOpV {
        opacity: .3;
        cursor: default;
    }

.sunglassesPackages__title___m1bSj {
        font-size: 13px;
        line-height: 14px;
        text-transform: none;
        color: #2c2c2c;
    }

.sunglassesPackages__price___grE6c {
        font-size: 14px;
        line-height: 15px;
        color: #2c2c2c;
        width: 80px;
        text-align: center;
    }

.sunglassesPackages__description___1EmWp {
        font-family: Georgia;
        font-style: italic;
        font-size: 12px;
        line-height: 19px;
        color: #6b6b6b;
    }

.sunglassesPackages__additional___J0lG1 {
        font-weight: 700;
        color: #f22a41;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.bottomCtaHto__learnMore___3Iy3r {
        color: #2196f3;
        font-size: 14px;
        text-decoration: underline;
        cursor: pointer;
        outline: 0;
    }

.bottomCtaHto__learnMore___3Iy3r:hover, .bottomCtaHto__learnMore___3Iy3r:focus {
            text-decoration: none;
        }

.bottomCtaHto__button___3BSZk {
        max-width: 560px;
        margin: 14px auto 24px;
    }

.bottomCtaHto__button___3BSZk svg {
            width: 195px;
            height: 24px;
        }

.bottomCtaHto__advantages___8NBRz {
        margin: 24px 0;
        font-family: Roboto, Arial, sans-serif;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.bottomCtaHto__advantages___8NBRz .bottomCtaHto__item___26gzx {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            color: #00b16a;
            font-size: 14px;
            line-height: 16px;
            margin-bottom: 5px;
        }

.bottomCtaHto__advantages___8NBRz .bottomCtaHto__icon___2A1Eh {
            margin-right: 6px;
            -webkit-transform: translateY(2px);
                    transform: translateY(2px);
        }

.bottomCtaHto__advantages___8NBRz button {
            color: inherit;
        }

.bottomCtaHto__advantages___8NBRz li:first-child::after {
            border-left: 1px solid #c8c8c8;
            content: '';
            height: 17px;
            width: 2px;
            margin-left: 30px;
            margin-right: 30px;
        }

.bottomCtaHto__change___1OTwQ {
        font-family: Roboto, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        color: #3a4850;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.bottomCtaHto__change___1OTwQ .bottomCtaHto__link___31NHC {
            color: #2196f3;
            cursor: pointer;
            margin-left: 4px;
        }

.bottomCtaHto__change___1OTwQ .bottomCtaHto__link___31NHC > span {
                text-decoration: underline;
            }

.bottomCtaHto__description___3T7b2 {
        text-align: center;
        color: #3a4850;
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 24px;
    }

.bottomCtaHto__priceRow___2eEsn {
        font-size: 16px;
        line-height: 16px;
        letter-spacing: .24px;
        margin-bottom: 8px;
        font-family: Roboto, Arial, sans-serif;
    }

.bottomCtaHto__finalPrice___4-ILV {
        display: inline-block;
        margin-left: 5px;
        color: #f22a42;
    }

.bottomCtaHto__price___dbt-D {
        margin-left: 13px;
        display: inline-block;
    }

.bottomCtaHto__price___dbt-D.bottomCtaHto__oldPrice___cftxN {
            text-decoration: line-through;
            margin-left: 5px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.productPrice__container___1npPs {
        position: relative;
    }

.productPrice__loadingCover___24jNd {
        position: absolute;
        z-index: 20;
        width: 100%;
        height: 100%;
        background: #f7f8f9;
        opacity: .7;
    }

.productPrice__priceRow___2vNmJ {
        font-size: 16px;
        line-height: 16px;
        letter-spacing: .24px;
        margin-bottom: 8px;
        font-family: Roboto, Arial, sans-serif;
        color: #3a4850;
    }

.productPrice__finalPrice___1DcMj {
        display: inline-block;
        color: #f22a41;
        margin-left: 13px;
    }

.productPrice__finalPrice___1DcMj.productPrice__revert___oB8FY {
            margin-left: 5px;
        }

.productPrice__price___1gb8_ {
        margin-left: 13px;
        display: inline-block;
        color: #89959c;
    }

.productPrice__price___1gb8_.productPrice__oldPrice___2lDRF {
            text-decoration: line-through;
            margin-left: 5px;
        }

.productPrice__price___1gb8_.productPrice__oldPriceRevert___n3TSS {
            text-decoration: line-through;
            margin-left: 13px;
        }

.productPrice__couponRow___3R4xI {
        color: #1c86da;
        font-family: Roboto, Arial, sans-serif;
        font-size: 14px;
        line-height: 16px;
        letter-spacing: .24px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.index__container___2BeZR {
        position: relative;
    }

.index__couponInfo___nxvsv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 14px;
        color: #f22a42;
    }

.index__finalPrice___3D4eS {
        color: #f22a42;
        margin-left: 6px;
    }

.index__initialPrice___1bVjO {
        text-decoration: line-through;
        color: #4d4d4d;
        margin-left: 8px;
    }

.index__price___3iW93 {
        font-weight: 700;
    }

.index__priceRow___1I13E {
        color: black;
        font-size: 15px;
        margin-top: 36px;
    }

.index__loadingCover___3hZRC {
        position: absolute;
        z-index: 20;
        width: 100%;
        height: 100%;
        background: #f7f8f9;
        opacity: .7;
    }

.index__icon___2mtmG {
        height: 32px;
        width: 32px;
        margin-bottom: 7px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.bottomCta__container___1w3dP {
        text-align: center;
    }

.bottomCta__splitIt___1N3se {
        display: inline-block;
        margin-bottom: 18px;
    }

.bottomCta__button___3Ta6O {
        max-width: 560px;
        margin: 25px auto 24px;
    }

/* IE10+ */

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
        .bottomCta__buttonWrapper___1KDAa span:first-child {
            width: 100%;
        }
    }

.bottomCta__tryAtHome___N3F3V {
        font-size: 14px;
        line-height: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        color: #3a4850;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.bottomCta__tryAtHome___N3F3V .bottomCta__link___24uVO {
            color: #2196f3;
            cursor: pointer;
            margin-left: 4px;
        }

.bottomCta__tryAtHome___N3F3V .bottomCta__link___24uVO > span {
                text-decoration: underline;
            }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.glassesUpsellItem__recentlyItem___31qRz {
        position: relative;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 186px;
                flex: 0 0 186px;
        text-align: center;
    }

.glassesUpsellItem__recentlyItem___31qRz:hover .glassesUpsellItem__myPicks___2IOKn {
            visibility: visible;
        }

.glassesUpsellItem__wishList___34NSe {
        position: relative;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        z-index: 10;
    }

.glassesUpsellItem__myPicksIcon___2S2bG {
        width: 16px;
        height: 16px;
    }

@media (min-width: 1280px) and (max-width: 1439.9px), (min-width: 1440px) {

.glassesUpsellItem__myPicksIcon___2S2bG {
            width: 18px;
            height: 18px
    }
        }

.glassesUpsellItem__myPicks___2IOKn {
        visibility: hidden;
    }

.glassesUpsellItem__myPicks___2IOKn svg {
            height: inherit;
        }

.glassesUpsellItem__myPicks___2IOKn.glassesUpsellItem__active___30cas {
            visibility: visible;
        }

.glassesUpsellItem__imageContainer___13OSa {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin: 0;
    }

.glassesUpsellItem__image___SgYbD {
        display: inline-block;
        width: 160px;
        height: 80px;
    }

.glassesUpsellItem__quickLook___1ic9i {
        cursor: pointer;
        display: inline-block;
        width: 130px;
        border: 1px solid rgba(0, 0, 0, 0);
        font-size: 12px;
        line-height: 19px;
        background: #f1f1f1;
        color: #4d4d4d;
        text-align: center;
        margin-bottom: 5px;
    }

.glassesUpsellItem__quickLook___1ic9i:hover {
            border-color: #898989;
        }

.glassesUpsellItem__productName___1BO5- {
        width: 160px;
        height: 32px;
        font-size: 13px;
        line-height: 16px;
        text-transform: capitalize;
        margin: 0 auto;
        text-align: center;
        color: #000;
        overflow: hidden;
    }

.glassesUpsellItem__price___lkcZA {
        vertical-align: middle;
        font-size: 16px;
        line-height: 23px;
        color: #000;
    }

.glassesUpsellItem__price___lkcZA.glassesUpsellItem__old___2d5Sh {
            font-size: 14px;
            color: #898989;
            text-decoration: line-through;
        }

.glassesUpsellItem__price___lkcZA.glassesUpsellItem__special___17IrD {
            margin: 0 5px;
            color: #ff6c00;
        }

.glassesUpsellItem__lensType___11BJD {
        font: italic 12px/20px Georgia;
        color: #aaa;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.recentlyViewed__header___3Zda9 {
        text-align: center;
        margin: 25px 0 40px;
        border-bottom: 2px solid #d8d8d8;
    }

.recentlyViewed__titleWrapper___1KkxX {
        position: relative;
        bottom: -16px;
        display: inline-block;
        padding: 0 13px;
        background: #fff;
    }

.recentlyViewed__title____MG_N {
        position: relative;
        height: 30px;
        margin: 0;
        padding: 0 22px;
        border: 1px solid #d8d8d8;
        font: italic normal 17px/30px Georgia;
        color: #898989;
    }

.recentlyViewed__title____MG_N::after, .recentlyViewed__title____MG_N::before {
            content: '';
            position: absolute;
            left: 46%;
            bottom: -20px;
            border: 10px solid rgba(0, 0, 0, 0);
            border-top-color: #d8d8d8;
        }

.recentlyViewed__title____MG_N::after {
            border-top: 10px solid #fff;
            bottom: -18px;
        }

.recentlyViewed__list___33SlY {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        border-bottom: 2px solid #d8d8d8;
        height: 230px;
        margin-bottom: 35px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.checkButton__container___2XG_6 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        min-width: 86px;
        font-size: 15px;
        color: #fff;
        border: 1px solid #2196f3;
        border-radius: 30px;
        background-color: #2196f3;
        outline: none;
        -webkit-transition: background 200ms;
        transition: background 200ms;
        cursor: pointer;
        position: relative;
        text-align: center;
        font-weight: 700;
        height: 32px;
    }

.checkButton__container___2XG_6.checkButton__active___1NOXC {
            color: #2196f3;
            background-color: transparent;
        }

.checkButton__container___2XG_6 .checkButton__icon___1GbjW {
            color: #2196f3;
            margin-right: 5px;
            width: 10px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.insurancePopup__mainContainer___2S6jU {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 830px;
        max-height: 420px;
    }

.insurancePopup__img___233SH {
        -webkit-box-flex: 1;
            -ms-flex: 1 0 50%;
                flex: 1 0 50%;
        line-height: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        min-height: 331px;
    }

.insurancePopup__infoBlock___cAmy9 {
        padding: 41px 40px 0 34px;
        background: white;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 100%;
    }

/* IE10+ */

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

.insurancePopup__infoBlock___cAmy9 {
            max-width: 43%
    }
        }

.insurancePopup__subTitle___gBkul, .insurancePopup__title___3QcEe {
        margin: 0;
        color: #0f0f0f;
        font: 700 20px/30px Roboto, Arial, sans-serif;
    }

.insurancePopup__price___2Qiwi {
        font-weight: 300;
        padding-left: 5px;
        display: inline-block;
        font-size: 18px;
    }

.insurancePopup__title___3QcEe {
        color: #3fabe6;
    }

.insurancePopup__divider___267vF {
        width: 25px;
        height: 1px;
        background: #89959c;
        margin: 20px 0;
    }

.insurancePopup__description___1Zq-G {
        color: #3a4850;
        font: 300 15px/23px Roboto, Arial, sans-serif;
    }

.insurancePopup__cta___PqtNv {
        -webkit-box-flex: 2;
            -ms-flex-positive: 2;
                flex-grow: 2;
        margin-top: 30px;
    }

.insurancePopup__singleCta___1imTe {
        margin-top: 51px;
    }

.insurancePopup__buttonWrapper___1qLej {
        margin-bottom: 8px;
    }

.insurancePopup__buttonWrapper___1qLej.insurancePopup__bottom___10jtC {
            max-width: 433px;
        }

.insurancePopup__buttonWrapper___1qLej.insurancePopup__top___2Tl7N {
            max-width: 286px;
        }

.insurancePopup__back___YEOW5 {
        display: block;
        margin: 12px auto 0;
        color: #89959c;
        text-align: center;
        font: 400 16px/19px Roboto, Arial, sans-serif;
        text-decoration: underline;
        cursor: pointer;
    }

.insurancePopup__back___YEOW5:hover {
            text-decoration: none;
        }

.insurancePopup__benefits___6br-7 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        width: 470px;
        color: #2196f3;
        padding: 17px 0 0 14px;
    }

.insurancePopup__container___1y_94 {
        margin-top: 36px;
        border-top: 1px solid #f1f1f1;
        margin-bottom: 28px;
        padding: 0 62px;
        color: #3a4850;
        width: 830px;
    }

.insurancePopup__titleExplonation___3A6-M {
        font: 700 18px/30px Roboto, Arial, sans-serif;
        text-align: left;
        margin-bottom: 37px;
        padding-top: 36px;
    }

.insurancePopup__featureContainer___2EunU {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        margin-bottom: 39px;
    }

.insurancePopup__featureItem___UbQak {
        width: 42%;
        margin-bottom: 32px;
        max-width: 293px;
    }

.insurancePopup__featureItem___UbQak:nth-child(2) {
            margin-left: 86px;
        }

.insurancePopup__featureItem___UbQak:nth-child(3) {
            width: 48%;
            max-width: 334px;
            margin-bottom: 0;
        }

.insurancePopup__featureItem___UbQak:nth-child(3) .insurancePopup__featureIcon___3-gGe {
                margin-bottom: 23px;
            }

.insurancePopup__featureItem___UbQak:nth-child(4) {
            margin-left: 45px;
            margin-bottom: 0;
        }

.insurancePopup__featureItem___UbQak:nth-child(4) .insurancePopup__featureIcon___3-gGe {
                margin-bottom: 12px;
            }

.insurancePopup__icon___t9MGV {
        color: #3a4850;
        margin-bottom: 23px;
    }

.insurancePopup__featureIcon___3-gGe {
        color: #89959c;
        margin-bottom: 16px;
    }

.insurancePopup__featureTitle___gsr7H {
        font: 700 14px/16px Roboto, Arial, sans-serif;
        margin-bottom: 12px;
        color: #3a4850;
    }

.insurancePopup__featureDescription___MyDxQ {
        font: 300 13px/18px Roboto, Arial, sans-serif;
        color: #3a4850;
    }

.insurancePopup__ctaBottom___1GoFb {
        width: 433px;
        margin: 0 auto 36px;
    }

.insurancePopup__back___YEOW5 {
        display: block;
        margin: 12px auto 0;
        color: #89959c;
        text-align: center;
        font: 400 16px/19px Roboto, Arial, sans-serif;
        text-decoration: underline;
        cursor: pointer;
    }

.insurancePopup__back___YEOW5:hover {
            text-decoration: none;
        }

.insurancePopup__notification___20M26 {
        color: #0f0f0f;
        font: 300 12px/19px Roboto, Arial, sans-serif;
        text-align: center;
    }

.insurancePopup__glasses___3MptT {
        height: 39px;
        width: 53px;
    }

.insurancePopup__rx___21uly {
        height: 36px;
        width: 37px;
    }

.insurancePopup__mail___3gXJU {
        height: 28px;
        width: 41px;
    }

.insurancePopup__mailApprove___C4Tfb {
        height: 40px;
        width: 45px;
    }

.insurancePopup__mailApproveDescription___19pQS {
        max-width: 200px;
    }

.insurancePopup__wearTear___1UlRT {
        width: 61px;
        height: 49px;
    }

.insurancePopup__rxChange___3_Iq- {
        width: 46px;
        height: 45px;
    }

.insurancePopup__exclamationMark___1WolX {
        width: 51px;
        height: 50px;
    }

.insurancePopup__coverage___2bMOI {
        width: 54px;
        height: 52px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.packageBenefits__container___98DNr {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        height: 161px;
        width: 218px;
        border-radius: 4px;
        background-color: #f7f8f9;
        padding: 15px;
        margin: 5px;
    }

.packageBenefits__icon___3c1qj {
        margin-bottom: 20px;
    }

.packageBenefits__icon___3c1qj svg {
            stroke: none;
        }

.packageBenefits__title___tVpie {
        color: #0f0f0f;
        font: 400 14px/16px Roboto, Arial, sans-serif;
        text-align: center;
        margin-bottom: 10px;
        max-width: 100%;
    }

.packageBenefits__description___28DXx {
        max-width: 100%;
        color: #0f0f0f;
        font: 300 13px/18px Roboto, Arial, sans-serif;
        text-align: center;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.insurancePopupWrapper__more___e83TT {
        text-decoration: underline;
        font: italic 14px/14px Roboto, Arial, sans-serif;
        color: #3fabe6;
        cursor: pointer;
        margin-left: 5px;
    }

.insurancePopupWrapper__price___3hlOH {
        font-weight: 300;
        margin-left: 5px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.insuranceList__container___2F9bP {
        padding-bottom: 22px;
        background: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        color: #2d2d2d;
        cursor: pointer;
        border-bottom: 1px solid #dedede;
    }

.insuranceList__container___2F9bP:last-child {
            border-bottom: none;
            padding: 22px 0 0;
        }

.insuranceList__container___2F9bP:hover .insuranceList__checkButton___7qRSR {
                opacity: .7;
            }

.insuranceList__container___2F9bP:focus {
            outline: none;
        }

.insuranceList__icon___EAPsu {
        display: inline-block;
        vertical-align: top;
        margin-right: 47px;
        width: 64px;
        height: 64px;
    }

.insuranceList__content___ONGro {
        -webkit-box-flex: 10;
            -ms-flex: 10 1;
                flex: 10 1;
    }

.insuranceList__title___1ZTAA {
        font: 18px/17px Roboto, Arial, sans-serif;
        font-weight: 700;
        margin-bottom: 8px;
        color: #0f0f0f;
    }

.insuranceList__description___F23kc {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        font: 16px/19px Roboto, Arial, sans-serif;
        margin-bottom: 14px;
        color: #4d4d4d;
    }

.insuranceList__checkbox___3Ihxa {
        height: 34px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.insuranceList__label___3bG_- {
        font-size: 16px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        line-height: 0;
        cursor: pointer;
        color: #0f0f0f;
    }

.insuranceList__label___3bG_-.insuranceList__selected___1mP4q {
            color: #3fabe6;
        }

.insuranceList__label___3bG_-:hover {
            color: #3fabe6;
        }

.insuranceList__insurance___3hKYu {
        background: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 24px 22px 24px 30px;
    }

.insuranceList__insurance___3hKYu:not(:last-child) {
            margin-bottom: 15px;
        }

.insuranceList__benefit___xqGSq {
        border-radius: 2px;
        background-color: #f1f3f4;
        margin-right: 8px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        font-size: 14px;
        line-height: 16px;
        font-family: Roboto, Arial, sans-serif;
        padding: 8px 10px 9px 9px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.insuranceList__benefits___24GV0 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 30px;
        height: 28px;
    }

.insuranceList__checkAssurance___20jNI {
        height: 11px;
        width: 13px;
        color: #00b16a;
        margin-right: 7px;
    }

.insuranceList__secondPrice___2uh01 {
        color: #898989;
    }

.insuranceList__redPrice___Zj878 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
        color: #f22a42;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 65px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.colorButton__button___37VTT {
        outline: none;
    }

.colorButton__button___37VTT:focus, .colorButton__button___37VTT:hover {
            -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2d2d2d;
                    box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2d2d2d;
        }

.colorButton__active___1cfxq {
        position: relative;
        -webkit-box-shadow: inset #fff 0 0 0 3px, #2d2d2d 0 0 0 2px;
                box-shadow: inset #fff 0 0 0 3px, #2d2d2d 0 0 0 2px;
    }

.colorButton__active___1cfxq::after {
            position: absolute;
            width: 26px;
            height: 26px;
            background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/c0e345401e8962ebc7ff887b7902c345.svg) no-repeat;
            background-size: 26px 26px;
            -webkit-transform: translate(-50%, -50%);
                    transform: translate(-50%, -50%);
            left: 50%;
            top: 50%;
        }

.colorButton__active___1cfxq.colorButton__active___1cfxq {
            -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2d2d2d;
                    box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2d2d2d;
        }

.colorButton__withChecked___i1CxG::after {
        content: "";
    }

.colorButton__small___3Oyus {
        padding: 0;
        width: 17px;
        height: 17px;
    }

.colorButton__medium___3xf9q {
        padding: 0;
        height: 21px;
        width: 21px;
    }

.colorButton__large___GLQ-J {
        padding: 0;
    }

.colorButton__large___GLQ-J:hover {
            -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2c2c2c;
                    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2c2c2c;
        }

.colorButton__large___GLQ-J::after {
            width: 30px;
            height: 30px;
            background-size: 30px 30px;
        }

.colorButton__selectedColor___1SLIp {
        -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2c2c2c;
                box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2c2c2c;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.digitalBlockPopup__tip___R1MrX {
        position: absolute;
        background: transparent;
        top: 8px;
        right: 9px;
        width: 18px;
        height: 18px;
    }

.digitalBlockPopup__container___1qUTd {
        width: 780px;
        padding: 40px 30px 35px 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.digitalBlockPopup__header___2lUrx {
        width: 100%;
        margin-bottom: 30px;
        font-size: 25px;
        line-height: 20px;
        font-weight: 700;
    }

.digitalBlockPopup__description___1xPP- {
        width: 310px;
        margin-right: 25px;
    }

.digitalBlockPopup__description___1xPP- p {
            margin-bottom: 20px;
            font-size: 16px;
            line-height: 23px;
        }

.digitalBlockPopup__link___2ocws {
        margin-left: 27px;
        color: #3fabe6;
        font-size: 14px;
        line-height: 20px;
        text-decoration: underline;
        font-style: italic;
        font-family: Georgia;
        cursor: pointer;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.photochromicGroupTooltip__tip___NFIHT {
        position: absolute;
        background: transparent;
        top: 8px;
        right: 9px;
        width: 18px;
        height: 18px;
    }

.photochromicGroupTooltip__tooltip___3hyj8 {
        width: 325px;
        padding: 15px;
        background: #fff;
        margin: 0 3px 3px;
        -webkit-box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.1);
                box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.1);
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        font-size: 13px;
        line-height: 18px;
        color: #4d4d4d;
        letter-spacing: .02em;
    }

.photochromicGroupTooltip__tooltipTitle___J5Jad {
        margin: 0 0 10px;
        font-size: 16px;
        line-height: 18px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.hydrophobicPopup__container___KPxyb {
        width: 800px;
        padding: 40px 30px 35px 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.hydrophobicPopup__header___2XtUT {
        width: 100%;
        margin-bottom: 30px;
        font-size: 25px;
        font-weight: 700;
    }

.hydrophobicPopup__description___3wu3a {
        width: 55%;
    }

.hydrophobicPopup__description___3wu3a p {
            margin-bottom: 20px;
            font-size: 16px;
            line-height: 23px;
        }

.hydrophobicPopup__description___3wu3a .hydrophobicPopup__button___2hmoZ {
            font-size: 14px;
            white-space: nowrap;
        }

.hydrophobicPopup__link___2Q-9b {
        margin-left: 27px;
        color: #3fabe6;
        font-size: 14px;
        line-height: 20px;
        text-decoration: underline;
        font-style: italic;
        font-family: Georgia;
        cursor: pointer;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.baseWizardPopup__container___2xEjS {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 830px;
        max-height: 420px;
    }

.baseWizardPopup__img___2G9XL {
        -webkit-box-flex: 1;
            -ms-flex: 1 0 50%;
                flex: 1 0 50%;
        line-height: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        min-height: 400px;
    }

.baseWizardPopup__infoBlock___1YLHy {
        padding: 25px;
        background: white;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 100%;
    }

/* IE10+ */

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

.baseWizardPopup__infoBlock___1YLHy {
            max-width: 43%
    }
        }

.baseWizardPopup__subTitle___1Tskz, .baseWizardPopup__title___3ZLX_ {
        margin: 0;
        color: #0f0f0f;
        font: 700 20px/30px Roboto, Arial, sans-serif;
    }

.baseWizardPopup__price___1p65U {
        font-weight: 300;
        padding-left: 5px;
        display: inline-block;
        font-size: 18px;
    }

.baseWizardPopup__title___3ZLX_ {
        color: #3fabe6;
    }

.baseWizardPopup__divider___1AijO {
        width: 25px;
        height: 1px;
        background: #89959c;
        margin: 20px 0;
    }

.baseWizardPopup__description___2VkLT {
        color: #3a4850;
        font: 300 15px/23px Roboto, Arial, sans-serif;
        -webkit-box-flex: 2;
            -ms-flex-positive: 2;
                flex-grow: 2;
    }

.baseWizardPopup__cta___hhwr2 {
        margin-top: 20px;
    }

.baseWizardPopup__back___36ZFc {
        display: block;
        margin: 12px auto 0;
        color: #89959c;
        text-align: center;
        font: 400 16px/19px Roboto, Arial, sans-serif;
        text-decoration: underline;
        cursor: pointer;
    }

.baseWizardPopup__back___36ZFc:hover {
            text-decoration: none;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.common__infoBlock___3qAQu {
        padding: 70px 50px 50px;
        background: white;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 100%;
    }

.common__description___1KgRJ {
        color: #3a4850;
        font: 400 15px/23px Roboto, Arial, sans-serif;
        -webkit-box-flex: 2;
            -ms-flex-positive: 2;
                flex-grow: 2;
        margin-top: 5px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.antiFogCoating__wrap___ct3Mu {
        padding: 27px 50px 50px;
    }

.antiFogCoating__link___1Z-ci {
        margin-left: 27px;
        color: #3fabe6;
        font-size: 14px;
        line-height: 20px;
        text-decoration: underline;
        font-style: italic;
        font-family: Georgia;
        cursor: pointer;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.photochromicTooltip__title___1sH-b {
        margin-bottom: 6px;
        font-size: 18px;
        font-weight: 700;
    }

.photochromicTooltip__popoverContainer___yn63c {
        padding: 15px;
        background-color: #fff;
        margin: 5px;
        -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
                box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
        position: relative;
        z-index: 10;
    }

.photochromicTooltip__container___3T9zZ {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        border: 1px solid #9b9b9b;
    }

.photochromicTooltip__column___3yk2G {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-line-pack: start;
            align-content: flex-start;
        color: #2c2c2c;
        font-size: 16px;
        -webkit-box-flex: 1;
            -ms-flex: 1 0 auto;
                flex: 1 0 auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        position: relative;
    }

.photochromicTooltip__column___3yk2G.photochromicTooltip__selected___2qkPi::after {
            content: '';
            width: calc(100% + 2px);
            height: calc(100% + 2px);
            position: absolute;
            left: -1px;
            top: -1px;
            border: 3px solid #3fabe6;
        }

.photochromicTooltip__column___3yk2G:first-child {
            font-family: Georgia;
            font-size: 14px;
            font-style: italic;
        }

.photochromicTooltip__header___2z97l {
        background: #c3e8f8;
        font-weight: 700;
    }

.photochromicTooltip__row___1JozX:nth-child(2n) {
        background: #f6f6f6;
    }

.photochromicTooltip__footer___1lt1n {
        background: #aaa;
        color: #fff;
    }

.photochromicTooltip__header___2z97l, .photochromicTooltip__footer___1lt1n {
        font-weight: 700;
    }

.photochromicTooltip__row___1JozX, .photochromicTooltip__header___2z97l, .photochromicTooltip__footer___1lt1n {
        min-height: 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 0 15px;
        white-space: nowrap;
    }

.photochromicTooltip__column___3yk2G:not(:last-child) {
        border-right: 1px solid #9b9b9b;
    }

.photochromicTooltip__header___2z97l, .photochromicTooltip__row___1JozX:not(:last-child) {
        border-bottom: 1px solid #9b9b9b;
    }

.photochromicTooltip__transition___1EkF- {
        width: 99px;
        height: 20px;
        background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/bf63663b828165767eaf4d3d136579b3.png) left center / contain no-repeat;
        display: block;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.photochromicTooltipRedesign__popoverContainer___2WBTX {
        padding: 20px;
        background-color: #fff;
        border-radius: 12px;
        -webkit-box-shadow: 0 1px 5px rgba(58, 72, 80, 0.07), 0 12px 16px rgba(176, 189, 197, 0.17);
                box-shadow: 0 1px 5px rgba(58, 72, 80, 0.07), 0 12px 16px rgba(176, 189, 197, 0.17);
        position: relative;
        z-index: 10;
        font-size: 14px;
        line-height: 20px;
        color: #000;
    }

.photochromicTooltipRedesign__container___esQ4n {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        border: 1px solid #dedede;
        border-radius: 8px;
    }

.photochromicTooltipRedesign__content___29dn7 {
        color: #2d2d2d;
        white-space: pre-wrap;
        margin-bottom: 16px;
    }

.photochromicTooltipRedesign__closeIcon___1Tsid {
        position: absolute;
        top: 20px;
        right: 20px;
        cursor: pointer;
    }

.photochromicTooltipRedesign__cell___1ywyn {
        min-height: 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 0 15px;
        white-space: nowrap;
    }

.photochromicTooltipRedesign__cell___1ywyn:first-child {
            color: #0f0f0f;
            background-color: #f7f8f9;
        }

.photochromicTooltipRedesign__cell___1ywyn:not(:last-child) {
            border-bottom: 1px solid #dedede;
        }

.photochromicTooltipRedesign__cell___1ywyn [class*=transition] {
            background-position-x: center;
        }

.photochromicTooltipRedesign__column___qYeZB {
        min-width: 140px;
        position: relative;
    }

.photochromicTooltipRedesign__column___qYeZB:first-child {
            min-width: 190px;
            background-color: #f7f8f9;
            border-top-left-radius: 8px;
            border-bottom-left-radius: 8px;
            font-weight: 700;
            color: #3a4850;
        }

.photochromicTooltipRedesign__column___qYeZB:first-child .photochromicTooltipRedesign__cell___1ywyn:first-child {
                border-top-left-radius: 8px;
            }

.photochromicTooltipRedesign__column___qYeZB:first-child .photochromicTooltipRedesign__cell___1ywyn:last-child {
                border-bottom-left-radius: 8px;
            }

.photochromicTooltipRedesign__column___qYeZB:first-child .photochromicTooltipRedesign__cell___1ywyn {
                -webkit-box-pack: start;
                    -ms-flex-pack: start;
                        justify-content: flex-start;
            }

.photochromicTooltipRedesign__column___qYeZB:last-child .photochromicTooltipRedesign__cell___1ywyn:first-child {
                border-top-right-radius: 8px;
            }

.photochromicTooltipRedesign__column___qYeZB:last-child .photochromicTooltipRedesign__cell___1ywyn:last-child {
                border-bottom-right-radius: 8px;
            }

.photochromicTooltipRedesign__column___qYeZB:not(:last-child) {
            border-right: 1px solid #dedede;
        }

.photochromicTooltipRedesign__column___qYeZB.photochromicTooltipRedesign__selected___BXSse::after {
                content: '';
                width: calc(100% + 2px);
                height: calc(100% + 2px);
                position: absolute;
                left: -1px;
                top: -1px;
                border: 3px solid #3fabe6;
            }

.photochromicTooltipRedesign__column___qYeZB.photochromicTooltipRedesign__selected___BXSse:last-child::after {
                border-top-right-radius: 8px;
                border-bottom-right-radius: 8px;
            }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.eyeglassesColorsTooltip__tip___2rWq9 {
        background: #fff;
        width: 16px;
        height: 16px;
    }

.eyeglassesColorsTooltip__tooltip___wcSKe {
        width: 325px;
        padding: 15px;
        background: #fff;
        margin: 0 3px 3px;
        -webkit-box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.1);
                box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.1);
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        color: #4d4d4d;
        letter-spacing: .02em;
        margin-bottom: 6px;
        position: relative;
        z-index: 20;
    }

.eyeglassesColorsTooltip__title___1oaZl {
        margin-bottom: 6px;
        font-size: 18px;
        font-weight: 700;
    }

.eyeglassesColorsTooltip__description___3TczL {
        font-size: 16px;
        line-height: 25px;
    }

.eyeglassesColorsTooltip__image___10mjU {
        display: block;
        margin: 0 auto;
    }

.eyeglassesColorsTooltip__colors___1lQCw {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin: 10px 0;
    }

.eyeglassesColorsTooltip__color___i4zse {
        margin-right: 10px;
        text-align: center;
    }

.eyeglassesColorsTooltip__colorName___1lfDW {
        margin-top: 5px;
        font-size: 10px;
        color: #9b9b9b;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.transitionLabel__iconContainer___NYhSy {
        max-width: 66px;
        height: 19px;
        display: block;
    }

.transitionLabel__iconContainer___NYhSy svg {
            stroke: none;
        }

.transitionLabel__labelText___Zw3-_ {
        font-size: 14px;
        font-family: Roboto, Arial, sans-serif;
        line-height: 16px;
        font-weight: 400;
        color: #00177e;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.transitionsPastelsTooltip__popoverContainer___3v5sf {
        background-color: #fff;
        border-radius: 12px;
        -webkit-box-shadow: 0 1px 5px rgba(58, 72, 80, 0.07), 0 12px 16px rgba(176, 189, 197, 0.17);
                box-shadow: 0 1px 5px rgba(58, 72, 80, 0.07), 0 12px 16px rgba(176, 189, 197, 0.17);
        position: relative;
        z-index: 10;
        font-size: 14px;
        line-height: 20px;
        color: #000;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 20px 24px 20px 28px;
    }

.transitionsPastelsTooltip__closeIcon___151d9 {
        position: absolute;
        top: 20px;
        right: 20px;
        cursor: pointer;
    }

.transitionsPastelsTooltip__leftSection___3iREq {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        padding: 8px 20px 16px 0;
        border-right: 1px solid #e7ebed;
        white-space: pre-wrap;
    }

.transitionsPastelsTooltip__header___34Lm3 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.transitionsPastelsTooltip__transitionsIcon___1W-5s {
        max-width: 111px;
        display: block;
    }

.transitionsPastelsTooltip__transitionsIcon___1W-5s svg {
            stroke: none;
        }

.transitionsPastelsTooltip__transitionsLabel___2fV2g {
        font-size: 22px;
        font-family: Roboto, Arial, sans-serif;
        line-height: 25px;
        font-weight: 400;
        color: #00177e;
        margin-bottom: 4px;
    }

.transitionsPastelsTooltip__description___OpSLb {
        font-size: 14px;
        font-family: Roboto, Arial, sans-serif;
        line-height: 21px;
        font-weight: 400;
        color: #2d2d2d;
        margin: 4px 0 40px;
    }

.transitionsPastelsTooltip__info___3FDA8 {
        font-size: 14px;
        font-family: Roboto, Arial, sans-serif;
        line-height: 21px;
        font-weight: 400;
        color: #3a4850;
        margin: 0;
    }

.transitionsPastelsTooltip__infoBold___3BoRp {
            font-weight: 700;
            line-height: 25px;
        }

.transitionsPastelsTooltip__info___3FDA8:last-child {
            margin-top: 22px;
        }

.transitionsPastelsTooltip__rightSection___3rEO6 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding-left: 24px;
    }

.transitionsPastelsTooltip__indoor___30Uak {
        width: 306px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.footer__priceBlock___1yNdz {
        position: absolute;
        bottom: -2px;
        left: -2px;
        right: -2px;
        text-transform: uppercase;
        background: #898989;
        font-size: 19px;
        line-height: 40px;
        font-weight: 700;
        color: #fff;
        border: 2px solid #898989;
        border-top: none;
        height: 38px;
        letter-spacing: .05em;
    }

.footer__priceBlock___1yNdz.footer__included___aHq_Z {
            font-size: 16px;
        }

.footer__legacyPrice___1QfyM {
        margin-right: 5px;
        font-size: 14px;
        text-decoration: line-through;
        vertical-align: top;
        font-weight: 400;
    }

.footer__pricePrefix___2qRLn {
        font-size: 14px;
        font-weight: 400;
        text-transform: uppercase;
        vertical-align: top;
    }

.footer__isActive___XbzE7 {
        border-color: #3fabe6;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.upsellTab__wrapper___1u6Hk {
        position: relative;
    }

.upsellTab__option___2PDXM {
        position: relative;
        width: 210px;
        height: 165px;
        padding: 20px 8px;
        cursor: pointer;
        background-color: #fff;
        border: 2px solid rgba(0, 0, 0, 0);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        outline: none;
    }

.upsellTab__option___2PDXM:not(:last-child) {
            margin-right: 20px;
        }

.upsellTab__option___2PDXM:hover:not(.upsellTab__active___1GGFf):not(.upsellTab__disabled___yiOf4) {
            background: rgba(77, 77, 77, 0.15);
        }

.upsellTab__option___2PDXM:hover:not(.upsellTab__active___1GGFf):not(.upsellTab__disabled___yiOf4) .upsellTab__priceBlock___n3Hrn {
                color: rgba(255, 255, 255, 0.79);
            }

.upsellTab__option___2PDXM.upsellTab__active___1GGFf {
            border-color: #3fabe6;
            background: #fff;
        }

.upsellTab__option___2PDXM.upsellTab__active___1GGFf.upsellTab__triangle___3adsm::before, .upsellTab__option___2PDXM.upsellTab__active___1GGFf.upsellTab__triangle___3adsm::after {
                    content: '';
                    position: absolute;
                    width: 0;
                    height: 0;
                    border-style: solid;
                }

.upsellTab__option___2PDXM.upsellTab__active___1GGFf.upsellTab__triangle___3adsm::before {
                    bottom: -34px;
                    border-color: #3fabe6 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
                    border-width: 17px;
                    left: calc(50% - 15px);
                }

.upsellTab__option___2PDXM.upsellTab__active___1GGFf.upsellTab__triangle___3adsm::after {
                    bottom: -28px;
                    border-color: #898989 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
                    border-width: 14px;
                    left: calc(50% - 12px);
                }

.upsellTab__option___2PDXM.upsellTab__disabled___yiOf4 {
            margin-bottom: 60px;
            cursor: default;
            -webkit-user-select: none;
               -moz-user-select: none;
                -ms-user-select: none;
                    user-select: none;
            position: relative;
        }

.upsellTab__option___2PDXM.upsellTab__disabled___yiOf4::after {
                content: '';
                position: absolute;
                top: -2px;
                left: -2px;
                width: calc(100% + 4px);
                height: calc(100% + 4px);
                background: rgba(246, 246, 246, 0.68);
                cursor: default;
                display: block;
                z-index: 20;
            }

.upsellTab__title___1fZnL {
        color: #0f0f0f;
        font-weight: 700;
        line-height: 18px;
        margin: 0;
        font-size: 18px;
        text-transform: uppercase;
        letter-spacing: .01em;
    }

.upsellTab__icon___22jej {
        margin-top: 3px;
        height: 27px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

.upsellTab__icon___22jej svg {
            stroke: none;
            fill: none;
        }

.upsellTab__description___2KrU9 {
        position: relative;
        font-size: 15px;
        line-height: 20px;
        font-style: italic;
        font-family: Georgia;
        color: #4d4d4d;
        max-width: 185px;
    }

.upsellTab__digitalBlock___YX9t5 {
        color: #3fabe6;
        font-size: 12px;
        line-height: 12px;
        font-weight: 700;
        text-transform: uppercase;
        width: 100%;
        display: inline-block;
        margin-bottom: 10px;
    }

.upsellTab__transitionIcon___QFjh1 {
        display: inline-block;
        width: 100%;
        height: 15px;
        margin-top: 5px;
    }

.upsellTab__selectedIcon___2R0KA {
        width: 18px;
        height: 18px;
        margin: 3px auto 5px;
    }

.upsellTab__tintTitle___1Zmdg {
        margin-right: 10px;
        font-size: 15px;
        color: #4d4d4d;
        font-family: Georgia;
        font-style: italic;
        font-weight: 300;
    }

.upsellTab__color___3pKf5 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.upsellTab__digital_protection___1xmml {
        height: 11px;
        mix-blend-mode: multiply;
    }

.upsellTab__light_adjusting___1DVHt {
        height: 21px;
    }

.upsellTab__disablingNotification___3-8ol {
        position: absolute;
        left: -2px;
        top: calc(100% + 20px);
        width: calc(100% + 4px);
        height: 40px;
        background: rgba(200, 200, 200, 0.7);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        color: #6b6b6b;
        font-size: 13px;
        font-family: Georgia;
        font-style: italic;
    }

.upsellTab__disablingNotification___3-8ol::before {
            content: '';
            position: absolute;
            top: -30px;
            left: calc(50% - 10px);
            border: 15px solid transparent;
            border-bottom-color: rgba(200, 200, 200, 0.7);
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.multipleSelectionUpsells__container___2ODlg {
        background-color: #fff;
        padding: 20px;
        border: 2px solid transparent;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        cursor: pointer;
        margin-bottom: 15px;
    }

.multipleSelectionUpsells__container___2ODlg.multipleSelectionUpsells__selected___3XrA5 {
            border-color: #3fabe6;
        }

.multipleSelectionUpsells__container___2ODlg:hover button {
                opacity: .7;
            }

.multipleSelectionUpsells__container___2ODlg:last-child {
            margin-bottom: 0;
        }

.multipleSelectionUpsells__icon___1tnE- {
        display: inline-block;
        width: 65px;
        height: 65px;
        margin-right: 25px;
    }

.multipleSelectionUpsells__wrapper___cyLmW {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
    }

.multipleSelectionUpsells__wrapper___cyLmW .multipleSelectionUpsells__title___V5e3P {
            margin-left: 27px;
            color: #2d2d2d;
            font-size: 18px;
            line-height: 20px;
            font-weight: 700;
        }

.multipleSelectionUpsells__wrapper___cyLmW .multipleSelectionUpsells__controls___bD7VL {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.multipleSelectionUpsells__wrapper___cyLmW .multipleSelectionUpsells__controls___bD7VL .multipleSelectionUpsells__checkbox___XwOnl {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                    -ms-flex-align: center;
                        align-items: center;
                margin: 5px 0;
            }

.multipleSelectionUpsells__wrapper___cyLmW .multipleSelectionUpsells__controls___bD7VL .multipleSelectionUpsells__label___1J4Op {
                font-size: 15px;
                line-height: 20px;
                color: #4d4d4d;
                cursor: pointer;
            }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.singleSelectionUpsell__option___BT3Ie {
        position: relative;
        height: 43px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        background: #fff;
        color: #4d4d4d;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        cursor: pointer;
        outline: none;
    }

.singleSelectionUpsell__option___BT3Ie:not(:last-child) {
            margin-bottom: 13px;
        }

.singleSelectionUpsell__option___BT3Ie:hover:not(.singleSelectionUpsell__selected___3pxhh)::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background: rgba(44, 44, 44, 0.21);
            z-index: 10;
            pointer-events: none;
            top: 0;
        }

.singleSelectionUpsell__option___BT3Ie:focus {
            -webkit-box-shadow: 0 0 0 2px #3fabe6;
                    box-shadow: 0 0 0 2px #3fabe6;
        }

.singleSelectionUpsell__meta___3OHz3 {
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        -webkit-box-flex: 1;
            -ms-flex: 1 0 auto;
                flex: 1 0 auto;
    }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__header___U2EBt {
            width: 190px;
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            background: #b7deed;
            padding: 0 12px 0 15px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__header___U2EBt .singleSelectionUpsell__checkbox___K2WAL {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                    -ms-flex-align: center;
                        align-items: center;
            }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__header___U2EBt .singleSelectionUpsell__checkbox___K2WAL > [class*=checkbox] {
                    margin-right: 8px;
                }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__header___U2EBt .singleSelectionUpsell__label___1Lmkx {
                margin-top: 2px;
                font-size: 15px;
                font-weight: 700;
                cursor: pointer;
            }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__description___3WGZ0 {
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            min-width: 310px;
            padding: 0 20px;
            font-size: 15px;
            line-height: 43px;
        }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__descriptionWidth___3NrQp {
            min-width: 340px;
        }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__type___2VKvi {
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            text-transform: uppercase;
            font-size: 14px;
            line-height: 43px;
        }

.singleSelectionUpsell__meta___3OHz3 .singleSelectionUpsell__colors___12MQx {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: start;
                -ms-flex-pack: start;
                    justify-content: flex-start;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -ms-flex-wrap: nowrap;
                flex-wrap: nowrap;
            margin-left: 20px;
        }

.singleSelectionUpsell__selected___3pxhh {
        -webkit-box-shadow: 0 0 0 2px #3fabe6;
                box-shadow: 0 0 0 2px #3fabe6;
    }

.singleSelectionUpsell__selected___3pxhh .singleSelectionUpsell__type___2VKvi {
            color: #3fabe6;
        }

.singleSelectionUpsell__price___2mzlQ {
        height: 100%;
        background-color: #898989;
        color: #fff;
        font-size: 20px;
        line-height: 45px;
        padding: 0 15px;
        min-width: 103px;
        text-align: center;
    }

.singleSelectionUpsell__icon___3qHDr {
        max-width: 99px;
        height: 21px;
        display: block;
    }

.singleSelectionUpsell__iconContainer___18Vuo {
        max-width: 66px;
        height: 19px;
        display: block;
    }

.singleSelectionUpsell__iconContainer___18Vuo svg {
            stroke: none;
        }

.singleSelectionUpsell__whiteBg___3Z5z5 {
        background-color: #fff;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.eyeglassesColors__colorName___2r69U {
        margin-left: 16px;
        font-size: 16px;
        font-family: Georgia;
        color: #000;
        font-style: italic;
        text-transform: capitalize;
    }

.eyeglassesColors__color___2KGP0:not(:last-child) {
        margin-right: 7px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.singleSelectionUpsells__colorName___3-7MX {
        margin-left: 16px;
        font-size: 16px;
        font-family: Georgia;
        color: #000;
        font-style: italic;
        text-transform: capitalize;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.transitionColors__colorName___3uKCw {
        margin-left: 16px;
        font-size: 16px;
        font-family: Georgia;
        color: #000;
        font-style: italic;
        text-transform: capitalize;
    }

.transitionColors__color___1Bzzb:not(:last-child) {
        margin-right: 7px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.upsellTabs__options___28dlB {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 30px;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

.upsellTabs__header___Ludo4 {
        margin-top: 5px;
        margin-bottom: 0;
        color: #2d2d2d;
        font-size: 18px;
        line-height: 35px;
        font-weight: 700;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensColorsSlider__color___23AuC {
        padding-top: 4px;
        height: 60px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

.lensColorsSlider__circle___3PcSw {
        padding: 0;
        margin: 1px 0 5px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        outline: none;
    }

.lensColorsSlider__circle___3PcSw:hover {
            -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2c2c2c;
                    box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2c2c2c;
        }

.lensColorsSlider__image___37p68 {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        position: relative;
        background-size: 30px;
        background-position: center;
        opacity: .85;
    }

.lensColorsSlider__label___1CPFk {
        font-size: 12px;
        color: #4d4d4d;
    }

.lensColorsSlider__arrow___Roh66 {
        background: none;
        position: relative;
    }

.lensColorsSlider__arrow___Roh66.lensColorsSlider__left___2-1ru, .lensColorsSlider__arrow___Roh66.lensColorsSlider__right___3rdbN {
            opacity: 1;
        }

.lensColorsSlider__arrow___Roh66.lensColorsSlider__left___2-1ru::before, .lensColorsSlider__arrow___Roh66.lensColorsSlider__right___3rdbN::before {
                opacity: .7;
            }

.lensColorsSlider__arrow___Roh66.lensColorsSlider__left___2-1ru:hover::before, .lensColorsSlider__arrow___Roh66.lensColorsSlider__right___3rdbN:hover::before {
                opacity: .9;
            }

.lensColorsSlider__arrow___Roh66.lensColorsSlider__left___2-1ru::before {
            margin-left: 10px;
            opacity: .7;
        }

.lensColorsSlider__arrow___Roh66.lensColorsSlider__right___3rdbN::before {
            margin-right: 10px;
            opacity: .7;
            position: relative;
            z-index: 20;
        }

.lensColorsSlider__arrow___Roh66.lensColorsSlider__right___3rdbN::after {
            content: ' ';
            display: block;
            height: 68px;
            width: 45px;
            position: absolute;
            top: 0;
            left: -30px;
            background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.001)), color-stop(50%, #f1f1f1));
            background: linear-gradient(90deg, rgba(255, 255, 255, 0.001), #f1f1f1 50%);
            z-index: 10;
        }

.lensColorsSlider__selected___TdCgL {
        -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2c2c2c;
                box-shadow: 0 0 0 2px #fff, 0 0 0 3px #2c2c2c;
    }

.lensColorsSlider__selected___TdCgL .lensColorsSlider__image___37p68::before, .lensColorsSlider__selected___TdCgL .lensColorsSlider__image___37p68::after {
                content: '';
                height: 2px;
                position: absolute;
                background: #fff;
            }

.lensColorsSlider__selected___TdCgL .lensColorsSlider__image___37p68::before {
                width: 9px;
                left: 6px;
                top: 16px;
                -webkit-transform: rotate(45deg);
                        transform: rotate(45deg);
            }

.lensColorsSlider__selected___TdCgL .lensColorsSlider__image___37p68::after {
                width: 14px;
                left: 11px;
                top: 14px;
                -webkit-transform: rotate(-45deg);
                        transform: rotate(-45deg);
            }

.lensColorsSlider__mirror-tint-blue___wmp_r {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/1bdbcb79a7ac4e7926f5de9e48f0acd2.svg);
    }

.lensColorsSlider__mirror-tint-gold___271J2 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/61c1f812b4a4c992eab167ab290b1994.svg);
    }

.lensColorsSlider__mirror-tint-green___3Yclf {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/febcab0fcfbf8f06bb1e6d4634119625.svg);
    }

.lensColorsSlider__mirror-tint-red___1SNPY {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/fb850256c669e39e79bfeb575b3f794a.svg);
    }

.lensColorsSlider__mirror-tint-silver___rzIIB {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/a7b88e824779e6016354c9013490e297.svg);
    }

.lensColorsSlider__tint-blue___3Ql_d {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/47f5f594ec4e2b5d86512618de8b3fb1.svg);
    }

.lensColorsSlider__tint-brown___2hcw3 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/ef47d9bf7505d78ffffee2d47ea8b952.svg);
    }

.lensColorsSlider__tint-gray___pH0s4 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/e2d5dc7ba79023c5958dbe7d7aadb4ea.svg);
    }

.lensColorsSlider__tint-green___3xugS {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/1b8bb26eaebee603ba88587de4fdd4fa.svg);
    }

.lensColorsSlider__tint-orange___34Nhq {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/a8f63d5638f384e5ea305125c87531e2.svg);
    }

.lensColorsSlider__tint-pink___1ns52 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/d56511ed20249735cfd8ba5d9473b61b.svg);
    }

.lensColorsSlider__tint-polar___1XLBq {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/03e4e0611a66e64c0a9d68de7e7912d6.svg);
    }

.lensColorsSlider__tint-polar-brown___2AEVM {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/c7c50727ca751a92ec07905f260eaa23.svg);
    }

.lensColorsSlider__tint-polar-green___1BOBe {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/d36e6903bcf7973b7598cb2c0ea645ca.svg);
    }

.lensColorsSlider__tint-purple___1v5_X {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/5d098f01d070bd3684d5ffd1d18e220d.svg);
    }

.lensColorsSlider__tint-red___2smyi {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/0449b63cccc6428743a69829ab834a84.svg);
    }

.lensColorsSlider__tint-yellow___R6yxC {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/dee1f0afedd420afb6330e5bd52d4c1a.svg);
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensColorsRow__row___2YWDI {
        height: 130px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        position: relative;
    }

.lensColorsRow__row___2YWDI:not(:last-child) {
            border-bottom: 1px solid #e9e7e3;
        }

.lensColorsRow__blockOverlay___3QlsY {
        width: calc(100% + 10px);
        height: 100%;
        position: absolute;
        left: -10px;
        top: 0;
        z-index: 20;
        background: #f1f1f1;
        opacity: .7;
    }

.lensColorsRow__title___1bX8m {
        min-width: 120px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    }

.lensColorsRow__title___1bX8m .lensColorsRow__content___d_uPr {
            font-size: 15px;
            color: #4d4d4d;
            font-weight: 700;
        }

.lensColorsRow__title___1bX8m .lensColorsRow__question___3IRTi {
            margin-left: 10px;
            cursor: pointer;
        }

.lensColorsRow__tooltip___2wDKw {
        width: 238px;
        margin: 1px 1px 0;
        padding: 15px;
        background: #fff;
        -webkit-box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
                box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
        font-size: 12px;
        line-height: 18px;
        color: #000;
    }

.lensColorsRow__tooltip___2wDKw .lensColorsRow__header___3a8ft {
            margin-bottom: 8px;
            font-weight: 700;
            font-size: 15px;
        }

.lensColorsRow__price___3A-1j {
        min-width: 60px;
        text-align: right;
        color: #a8a6a4;
        font-size: 13px;
    }

.lensColorsRow__price___3A-1j.lensColorsRow__selectedPrice___2YVuE {
            color: #8d8d8d;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensColorsBasicCustomization__checkbox___37ebZ {
        padding: 20px 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.lensColorsBasicCustomization__checkbox___37ebZ:not(:last-child) {
            border-bottom: 1px solid #f1f1f1;
        }

.lensColorsBasicCustomization__label___1jxYh {
        padding-left: 10px;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        color: #4d4d4d;
    }

.lensColorsBasicCustomization__label___1jxYh .lensColorsBasicCustomization__line___1Xzl7 {
            height: 16px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.lensColorsBasicCustomization__label___1jxYh .lensColorsBasicCustomization__title___2lHlO {
            font-size: 13px;
            line-height: 16px;
            font-weight: 400;
        }

.lensColorsBasicCustomization__label___1jxYh .lensColorsBasicCustomization__price___bsKlF {
            font-size: 11px;
            color: #a8a6a4;
        }

.lensColorsBasicCustomization__label___1jxYh .lensColorsBasicCustomization__description___35Rc6 {
            font-size: 11px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensColorsGradientCustomization__checkbox___1b-Bv {
        padding: 20px 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.lensColorsGradientCustomization__checkbox___1b-Bv:not(:last-child) {
            border-bottom: 1px solid #f1f1f1;
        }

.lensColorsGradientCustomization__label___GGxus {
        padding-left: 10px;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        color: #4d4d4d;
    }

.lensColorsGradientCustomization__label___GGxus .lensColorsGradientCustomization__line___1jC4S {
            height: 16px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.lensColorsGradientCustomization__label___GGxus .lensColorsGradientCustomization__title___3lve5 {
            font-size: 13px;
            line-height: 16px;
            font-weight: 400;
        }

.lensColorsGradientCustomization__label___GGxus .lensColorsGradientCustomization__price___38lWY {
            font-size: 11px;
            color: #a8a6a4;
        }

.lensColorsGradientCustomization__label___GGxus .lensColorsGradientCustomization__description___3Gi6x {
            font-size: 11px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.customizationInputRange__ranges___2joUj {
        -ms-flex-negative: 0;
            flex-shrink: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        margin-top: 5px;
    }

.customizationInputRange__range___207fM {
        color: #9b9b9b;
        font-size: 10px;
        cursor: pointer;
    }

.customizationInputRange__range___207fM.customizationInputRange__selected___VTB5w {
            color: #4d4d4d;
        }

.customizationInputRange__inputRange___3sn1K {
        height: 20px;
        width: 100%;
        margin-top: 15px;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.customizationInputRange__track___3NkEO {
        position: relative;
        display: block;
        height: 8px;
        width: calc(100% - 15px);
        margin: 0 auto;
        border-radius: 2px;
        cursor: pointer;
        border: 1px solid #d8d8d8;
        -webkit-transition: left 50ms ease-out, width 50ms ease-out;
        transition: left 50ms ease-out, width 50ms ease-out;
    }

.customizationInputRange__activeTrack___32A8y {
        display: none;
    }

.customizationInputRange__slider___2OSzM {
        position: absolute;
        width: 20px;
        height: 20px;
        top: -7px;
        left: -10px;
        background: #f1f1f1;
        border-radius: 2px;
        border: 1px solid #d8d8d8;
        -webkit-transition: -webkit-transform 50ms ease-out, -webkit-box-shadow 50ms ease-out;
        transition: -webkit-transform 50ms ease-out, -webkit-box-shadow 50ms ease-out;
        transition: transform 50ms ease-out, box-shadow 50ms ease-out;
        transition: transform 50ms ease-out, box-shadow 50ms ease-out, -webkit-transform 50ms ease-out, -webkit-box-shadow 50ms ease-out;
        outline: none;
        cursor: pointer;
        -webkit-appearance: none;
           -moz-appearance: none;
                appearance: none;
    }

.customizationInputRange__maxLabel___10zDx, .customizationInputRange__minLabel___1CR7p {
        display: none;
    }

.customizationInputRange__sliderContainer___1BBJT {
        -webkit-transition: left 50ms ease-out;
        transition: left 50ms ease-out;
    }

.customizationInputRange__valueLabel___1ev7Y {
        display: none;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensColorsPersonalizedCustomization__checkbox___10OD3 {
        padding: 20px 0 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.lensColorsPersonalizedCustomization__input____wcPx {
        max-width: 196px;
        margin-left: auto;
        padding-bottom: 20px;
    }

.lensColorsPersonalizedCustomization__label___24pUT {
        padding-left: 10px;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        color: #4d4d4d;
    }

.lensColorsPersonalizedCustomization__label___24pUT .lensColorsPersonalizedCustomization__line___2tMX6 {
            height: 16px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.lensColorsPersonalizedCustomization__label___24pUT .lensColorsPersonalizedCustomization__title___20tTW {
            font-size: 13px;
            line-height: 16px;
            font-weight: 400;
        }

.lensColorsPersonalizedCustomization__label___24pUT .lensColorsPersonalizedCustomization__price___1GMwE {
            font-size: 11px;
            color: #a8a6a4;
        }

.lensColorsPersonalizedCustomization__label___24pUT .lensColorsPersonalizedCustomization__description___2Gjvo {
            font-size: 11px;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensColorsCustomization__container___3zJ1G {
        width: 240px;
        background: #fff;
        padding: 10px 15px;
        border-radius: 16px;
        -webkit-box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
                box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
        cursor: default;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
    }

@media (max-width: 1279.9px) {

.lensColorsCustomization__container___3zJ1G {
            opacity: .92
    }
        }

.lensColorsCustomization__header___3rBp_ {
        font-size: 16px;
        color: #4d4d4d;
        font-weight: 400;
        white-space: nowrap;
        line-height: 25px;
    }

.lensColorsCustomization__header___3rBp_ .lensColorsCustomization__bold___1EPTp {
            font-weight: 700;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.lensFlare__container___dN8MO {
        min-height: 410px;
        padding: 10px 5px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    }

.lensFlare__rows___3TfuC {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 495px;
                flex: 0 0 495px;
    }

.lensFlare__preview___27j54 {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 385px;
                flex: 0 0 385px;
        background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/2ece712cc7774eeec3a8e3632b04d3be.png) no-repeat center 95%;
        background-size: 335px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -ms-flex-line-pack: justify;
            align-content: space-between;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        position: relative;
    }

.lensFlare__gradientShelf___2Po5L {
        width: 100%;
        height: 100%;
        background: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/8b6b60edea45e2887e08d559e28c40c8.png) no-repeat center 95%;
        background-size: 337px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -ms-flex-line-pack: justify;
            align-content: space-between;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        position: absolute;
        left: -1px;
        top: -28px;
        z-index: 10;
    }

.lensFlare__image___2QnKO {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 258px;
                flex: 0 0 258px;
        height: 214px;
        margin-top: 35px;
        background-size: cover;
        background-position: center;
        -webkit-transition: opacity .3s;
        transition: opacity .3s;
    }

.lensFlare__description___2ClnH {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        padding: 0 50px;
        z-index: 10;
    }

.lensFlare__description___2ClnH .lensFlare__title___j_RY8 {
            margin-bottom: 9px;
            font-size: 14px;
            line-height: 16px;
            color: #8d8d8d;
        }

.lensFlare__description___2ClnH .lensFlare__name___QtUFf {
            font-size: 20px;
            line-height: 28px;
            color: #4d4d4d;
        }

.lensFlare__tint-gray___2uJ1Y {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/ed983861942b8e36617ea466f51a9b7c.png);
    }

.lensFlare__tint-brown___2s0xh {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/b1a4fb3f7e9dd0dd4e008b19d27f025b.png);
    }

.lensFlare__tint-green___1gNRA {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/291a8c14d65286bad5cb1c3a486885d9.png);
    }

.lensFlare__tint-blue___1wTAJ {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/364a5a5a4bc1bbb10edd279da81ba208.png);
    }

.lensFlare__tint-yellow___1BduL {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/740c5270b3ed5a71432679330964db2a.png);
    }

.lensFlare__tint-red___2LT8j {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/8a2b1e8ed4f7ebc05bf1bca83af470f9.png);
    }

.lensFlare__tint-pink___1_36t {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/cf2905fb94dfae761969b51dafc1ba96.png);
    }

.lensFlare__tint-orange___2daBZ {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/56a7f3e717113467fda5f3b88822037f.png);
    }

.lensFlare__tint-purple___2Zh4a {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/32a123297501956f8054e7b105cde27d.png);
    }

.lensFlare__tint-polar___1X0p6 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/e34308bb4026e78efa821cbdd36d1b37.png);
    }

.lensFlare__tint-polar-green___3I27F {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/ddd24476672872c6d6c76815babcb975.png);
    }

.lensFlare__tint-polar-brown___3pi85 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/a2de74a4769e978ff7da6112be172880.png);
    }

.lensFlare__mirror-tint-red___1wSqb {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/cf1352e49ba25030893e05afd1dce774.png);
    }

.lensFlare__mirror-tint-blue___B_tQ3 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/a03115862f38db7f86dc6797e777a032.png);
    }

.lensFlare__mirror-tint-gold___3nMRM {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/39d91137fd9a2ce65c98b81ddaee05b0.png);
    }

.lensFlare__mirror-tint-green___34jj9 {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/fe42023e06d1d2ba577ba05856213f20.png);
    }

.lensFlare__mirror-tint-silver___1yy0Q {
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/8e5362a6b2a3190c41bc3ab654bc62b9.png);
    }

.sunglassesColors__container___3swfj {
        min-height: 410px;
        padding: 10px 5px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    }
    .sunglassesColors__rows___375xZ {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 495px;
                flex: 0 0 495px;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.independentOption__container___20vCT {
        background-color: #fff;
        padding: 20px;
        border: 2px solid transparent;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        cursor: pointer;
        outline: none;
    }

.independentOption__container___20vCT.independentOption__selected___9of-v, .independentOption__container___20vCT:focus {
            border-color: #3fabe6;
        }

.independentOption__container___20vCT:hover button {
                opacity: .7;
            }

.independentOption__container___20vCT:not(:last-child) {
            margin-bottom: 15px;
        }

.independentOption__icon___NxsJL {
        display: inline-block;
        vertical-align: top;
        margin-right: 25px;
        width: 55px;
        height: 55px;
    }

.independentOption__checkbox___3hTXY {
        height: 35px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.independentOption__label___2LjEh {
        font-size: 16px;
        line-height: 0;
        cursor: pointer;
    }

.independentOption__label___2LjEh.independentOption__selected___9of-v {
            color: #3fabe6;
        }

.independentOption__label___2LjEh:hover {
            color: #3fabe6;
        }

.independentOption__wrapper___fLPAG {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        padding-left: 10px;
    }

.independentOption__wrapper___fLPAG .independentOption__title___AfPGs {
            margin-left: 27px;
            color: #2d2d2d;
            font-size: 18px;
            line-height: 20px;
            font-weight: 700;
        }

.independentOption__wrapper___fLPAG .independentOption__controls___3X8Aa {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.independentOption__wrapper___fLPAG .independentOption__controls___3X8Aa .independentOption__checkbox___3hTXY {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                    -ms-flex-align: center;
                        align-items: center;
            }

.independentOption__wrapper___fLPAG .independentOption__controls___3X8Aa .independentOption__label___2LjEh {
                font-size: 15px;
                line-height: 20px;
                color: #4d4d4d;
                cursor: pointer;
            }

.independentOption__wrapper___fLPAG .independentOption__link___272MQ {
            margin-left: 27px;
            color: #3fabe6;
            font-size: 14px;
            line-height: 20px;
            text-decoration: underline;
            font-style: italic;
            font-family: Georgia;
            cursor: pointer;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.wizardContainer__wizard___2CcvS {
        margin: 70px auto 10px;
        width: 930px;
        counter-reset: wizardContentTitle;
    }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.glasses__productWrapper___36h8S {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        margin: 0 auto 17px;
        font-family: Roboto, Arial, sans-serif;
    }

.glasses__productWrapper___36h8S .sticky-inner-wrapper {
            -webkit-box-flex: 0;
                -ms-flex-positive: 0;
                    flex-grow: 0;
            -ms-flex-negative: 0;
                flex-shrink: 0;
        }

.glasses__recommendations___2xXad {
        min-height: 250px;
    }

.glasses__frameWrapper___1VsH5 {
        display: block;
        position: relative;
        z-index: 30;
    }

.glasses__frame___1VHuq {
        position: relative;
        margin-bottom: 40px;
    }

.glasses__sidebar___14aGY {
        width: 365px;
        -webkit-box-flex: 0;
            -ms-flex-positive: 0;
                flex-grow: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
        -ms-touch-action: none;
            touch-action: none;
    }

.glasses__left___1PwuW {
        width: calc(100% - 365px);
    }

.glasses__productRemainder___2L6yJ {
        -webkit-transform-origin: 20% 100%;
                transform-origin: 20% 100%;
        -webkit-animation: glasses__remainderAnimation___2-Hsh .2s linear 2s 1 forwards;
                animation: glasses__remainderAnimation___2-Hsh .2s linear 2s 1 forwards;
        -webkit-transform: rotate(0deg) scale(.85);
                transform: rotate(0deg) scale(.85);
    }

@-webkit-keyframes glasses__remainderAnimation___2-Hsh {
    0% { -webkit-transform: rotate(0deg) scale(.85); transform: rotate(0deg) scale(.85); }
    100% { -webkit-transform: rotate(-20deg) scale(.85); transform: rotate(-20deg) scale(.85); }
}

@keyframes glasses__remainderAnimation___2-Hsh {
    0% { -webkit-transform: rotate(0deg) scale(.85); transform: rotate(0deg) scale(.85); }
    100% { -webkit-transform: rotate(-20deg) scale(.85); transform: rotate(-20deg) scale(.85); }
}

@media screen and (max-width: 1279px) {
        .glasses__productWrapper___36h8S {
            width: 930px;
        }

        .glasses__sidebar___14aGY {
            width: 261px;
        }

        .glasses__left___1PwuW {
            width: calc(100% - 261px);
        }
}

@media screen and (min-width: 1280px) and (max-width: 1439px) {
        .glasses__productWrapper___36h8S {
            width: 1166px;
        }

        .glasses__sidebar___14aGY {
            width: 312px;
        }

        .glasses__left___1PwuW {
            width: calc(100% - 312px);
        }
}

@media screen and (min-width: 1440px) {
        .glasses__productWrapper___36h8S {
            width: 1300px;
        }
}

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.support__container___2A2mN {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-flow: row wrap;
                flex-flow: row wrap;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 100%;
        height: 135px;
        background: #f7f3f3;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }

.support__description___qc02d {
        margin-right: 35px;
        font-family: Roboto, Arial, sans-serif, sans-serif;
        font-size: 18px;
        color: #4d4d4d;
    }

.support__description___qc02d:last-child {
            margin-right: 0;
        }

.support__methods___mnR-X {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.support__method___IR00O {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.support__method___IR00O:hover .support__content___3apbE {
                text-decoration: underline;
            }

.support__icon___3K9U5 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 22px;
        margin-right: 8px;
        color: #4d4d4d;
    }

.support__content___3apbE {
        color: #4d4d4d;
        font-family: Roboto, Arial, sans-serif, sans-serif;
        font-size: 15px;
    }

.support__link___2bWYH {
        text-decoration: none;
    }

.support__button___1FzAx {
        border: none;
        background: none;
        cursor: pointer;
    }

.support__link___2bWYH, .support__button___1FzAx {
        margin-left: 35px;
    }

.support__link___2bWYH:first-child, .support__button___1FzAx:first-child {
            margin-left: 0;
        }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.noRoute__wrapper___24WHA {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-flow: column wrap;
                flex-flow: column wrap;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin: 40px auto;
        width: 930px;
        min-height: 440px;
    }

.noRoute__header___TwxY1 {
        margin: 0;
        color: #3fabe6;
        font-family: Roboto, Arial, sans-serif, sans-serif;
        font-size: 25px;
        font-weight: 700;
    }

.noRoute__image___16iOD {
        width: 436px;
        height: 257px;
        margin-top: 48px;
    }

.noRoute__callToAction___3Iy_J {
        margin-top: 32px;
    }

.noRoute__callToAction___3Iy_J ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-flow: row nowrap;
                    flex-flow: row nowrap;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
        }

.noRoute__callToAction___3Iy_J li {
            margin-right: 35px;
        }

.noRoute__callToAction___3Iy_J li:last-child {
                margin-right: 0;
            }

/**
 * z-index
 *
 * Please, if you add or change something in this list,
 * add or change the same:
 * GlassesUSA-Desktop/css/cssVariables.scss
 *
 */

/**
 * COLORS
 *
 * How to get color name:
 * use this service http://chir.ag/projects/name-that-color/
 *
 * How to create variable:
 * --color-[your color name] like these: --color-white, --color-black etc...
 */

:root {
    /* Fonts family */

    /* Font weights */

    /* Common colors */

    /* Primary colors */

    /**
    colors that are not in the dsm
     */

    /* Marketing colors */

    /* Logo colors */

    /* Deprecated colors */

    /* Images path */

    /* UHC colors */

    /* Status colors */
}

/* If you want edit this variables don't forget about variables for JS "./modules/constants/mediaQueries.js" */

.product__loader___1y_-j {
        margin: 50px auto;
    }


/*# sourceMappingURL=Product.033eb1d56d197ace5d1f.css.map*/