/**
 * 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" */

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

.loader__animate___2L3gX {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
        border-radius: 100%;
        margin-right: 10px;
        position: relative;
    }

.loader__animate___2L3gX:last-of-type {
            margin-right: 0;
        }

.loader__animate___2L3gX::before {
            content: "";
            display: block;
            padding-top: 100%;
        }

.loader__first___1u8hZ {
        -webkit-animation: loader__loader10g___2xBvY 3s ease-in-out infinite;
                animation: loader__loader10g___2xBvY 3s ease-in-out infinite;
    }

.loader__second___2kfxQ {
        -webkit-animation: loader__loader10m___3H6QA 3s ease-in-out infinite;
                animation: loader__loader10m___3H6QA 3s ease-in-out infinite;
    }

.loader__third___q_yt2 {
        -webkit-animation: loader__loader10d___BxWf1 3s ease-in-out infinite;
                animation: loader__loader10d___BxWf1 3s ease-in-out infinite;
    }

.loader__blue___2vhop .loader__animate___2L3gX {
        background-color: #3fabe6;
    }

.loader__white___3tLFH .loader__animate___2L3gX {
        background-color: #fff;
    }

.loader__orange___2EtOP .loader__animate___2L3gX {
        background-color: #ff6c00;
    }

@-webkit-keyframes loader__loader10g___2xBvY {
    0% { opacity: .2; }
    25% { opacity: 1; }
    50% { opacity: .2; }
    75% { opacity: .2; }
    100% { opacity: .2; }
}

@keyframes loader__loader10g___2xBvY {
    0% { opacity: .2; }
    25% { opacity: 1; }
    50% { opacity: .2; }
    75% { opacity: .2; }
    100% { opacity: .2; }
}

@-webkit-keyframes loader__loader10m___3H6QA {
    0% { opacity: .2; }
    25% { opacity: .2; }
    50% { opacity: 1; }
    75% { opacity: .2; }
    100% { opacity: .2; }
}

@keyframes loader__loader10m___3H6QA {
    0% { opacity: .2; }
    25% { opacity: .2; }
    50% { opacity: 1; }
    75% { opacity: .2; }
    100% { opacity: .2; }
}

@-webkit-keyframes loader__loader10d___BxWf1 {
    0% { opacity: .2; }
    25% { opacity: .2; }
    50% { opacity: .2; }
    75% { opacity: 1; }
    100% { opacity: .2; }
}

@keyframes loader__loader10d___BxWf1 {
    0% { opacity: .2; }
    25% { opacity: .2; }
    50% { opacity: .2; }
    75% { opacity: 1; }
    100% { opacity: .2; }
}

/**
 * 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" */

.welcomePopup__wrapper___HLniz {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 840px;
        font-family: Roboto, Arial, sans-serif;
        font-weight: 300;
    }

.welcomePopup__leftSide___10D4a {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 50%;
                flex: 1 1 50%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        text-align: left;
        font-size: 24px;
        line-height: 32px;
        color: #3a4850;
        padding-top: 12px;
        padding-left: 12px;
        padding-bottom: 12px;
    }

.welcomePopup__contentWrapper___Rg-3o {
        background-color: #f7f8f9;
        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;
        height: 100%;
        width: 100%;
    }

.welcomePopup__title___1-a6a {
        text-transform: uppercase;
        font-weight: 700;
        font-size: 16px;
        margin-bottom: 10px;
    }

.welcomePopup__logo___3qFu7 {
        display: inline-block;
        width: 170px;
        margin-bottom: 24px;
        text-align: center;
        color: #3a4850;
    }

.welcomePopup__logo___3qFu7::after {
            content: '';
            display: block;
            height: 1px;
            width: 19px;
            margin: 19px auto 0;
            background-color: #3a4850;
        }

.welcomePopup__lfg___1SDdj, .welcomePopup__medigold___33GhY {
        max-width: 150px;
    }

.welcomePopup__benefitsNote___1EUWm {
        color: #3a4850;
    }

.welcomePopup__rightSide___3xo2w {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 50%;
                flex: 1 1 50%;
        text-align: center;
        padding: 28px 22px 12px;
        font-size: 14px;
        line-height: 22px;
        letter-spacing: .29px;
        color: #3a4850;
    }

.welcomePopup__rightSide___3xo2w .welcomePopup__rightSideInner___3NnHe {
            padding: 0 37px 0 40px;
        }

.welcomePopup__rightSide___3xo2w .welcomePopup__benefitsList___16cOs {
            margin: 27px 0 28px;
        }

.welcomePopup__rightSide___3xo2w .welcomePopup__benefitsListItem___1rAhi {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: start;
            margin-bottom: 18px;
        }

.welcomePopup__rightSide___3xo2w .welcomePopup__benefitsListItem___1rAhi .welcomePopup__label___4Hexi {
                display: block;
                font-weight: 700;
            }

.welcomePopup__rightSide___3xo2w .welcomePopup__benefitsListItem___1rAhi .welcomePopup__point___hM5L4 {
                width: 20px;
                height: 20px;
                margin-right: 13px;
                border-radius: 50%;
                padding: 0 5px;
                background-color: #3a4850;
                text-align: center;
                line-height: 20px;
                color: #fff;
                font-weight: 700;
            }

.welcomePopup__rightSide___3xo2w .welcomePopup__greetingsTitle___3s4sH {
            font-size: 24px;
            line-height: 26px;
            font-weight: 700;
            color: #2196f3;
            margin: 0 0 12px;
        }

.welcomePopup__rightSide___3xo2w .welcomePopup__subTitle___3FWdF {
            margin: 0 0 68px;
            font-size: 24px;
            line-height: 32px;
            font-weight: 300;
            color: #3a4850;
        }

.welcomePopup__questionBox___1pX2M {
        margin-top: 31px;
        font-size: 12px;
        line-height: 22px;
        font-family: Roboto, Arial, sans-serif;
        border-top: 2px solid #f1f3f4;
        padding-top: 8px;
    }

.welcomePopup__questionNote___2EWU2 {
        font-weight: 300;
        color: #5b6971;
    }

.welcomePopup__phoneLink___1G8a- {
        font-family: inherit;
        font-size: inherit;
        line-height: inherit;
        font-weight: 400;
        color: #2196f3;
    }

/**
 * 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" */

.scrollUp__wrap___1IwvO {
        width: 42px;
        height: 42px;
        display: none;
        border-radius: 100%;
        position: absolute;
        cursor: pointer;
        padding-top: 0;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-flow: row wrap;
                flex-flow: row wrap;
        background-color: rgb(0, 0, 0, .35);
        -webkit-box-shadow: 0 0 0 0 rgba(50, 197, 255, .5);
                box-shadow: 0 0 0 0 rgba(50, 197, 255, .5);
        -webkit-box-flex: 2;
            -ms-flex-positive: 2;
                flex-grow: 2;
        overflow: hidden;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        right: -34px;
        -webkit-transition: background-color .5s, opacity .5s, -webkit-box-shadow .5s, -webkit-transform .5s;
        transition: background-color .5s, opacity .5s, -webkit-box-shadow .5s, -webkit-transform .5s;
        transition: background-color .5s, opacity .5s, box-shadow .5s, transform .5s;
        transition: background-color .5s, opacity .5s, box-shadow .5s, transform .5s, -webkit-box-shadow .5s, -webkit-transform .5s;
        bottom: 2px;
    }

@media (prefers-reduced-motion: reduce) {

.scrollUp__wrap___1IwvO {
            -webkit-transition: none;
            transition: none
    }
        }

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

.scrollUp__wrap___1IwvO {
            width: 50px;
            height: 50px;
            right: -48px
    }
        }

@media (min-width: 1440px) {

.scrollUp__wrap___1IwvO {
            width: 60px;
            height: 60px;
            right: -62px
    }
        }

@media (max-width: 1050px) {

.scrollUp__wrap___1IwvO {
            right: 0
    }
        }

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

.scrollUp__wrap___1IwvO:hover, .scrollUp__wrap___1IwvO:focus {
            outline: none;
            background-color: #2196f3;
            opacity: 1;
            -webkit-box-shadow: 0 0 0 9px rgba(50, 197, 255, .4), inset 0 0 0 3px rgba(50, 197, 255, .5);
                    box-shadow: 0 0 0 9px rgba(50, 197, 255, .4), inset 0 0 0 3px rgba(50, 197, 255, .5);
        }

.scrollUp__wrap___1IwvO:hover .scrollUp__arrow___3S4DT, .scrollUp__wrap___1IwvO:focus .scrollUp__arrow___3S4DT {
                -webkit-transform: translateY(-45px);
                        transform: translateY(-45px);
            }

.scrollUp__wrap___1IwvO:hover .scrollUp__text___1n-SW, .scrollUp__wrap___1IwvO:focus .scrollUp__text___1n-SW {
                -webkit-transform: translateY(0);
                        transform: translateY(0);
            }

.scrollUp__wrap___1IwvO:active {
            opacity: 0;
            -webkit-transform: scale(.8);
                    transform: scale(.8);
            -webkit-box-shadow: 0 0 0 0 rgba(50, 197, 255, .5), inset 0 0 0 0 rgba(50, 197, 255, .5);
                    box-shadow: 0 0 0 0 rgba(50, 197, 255, .5), inset 0 0 0 0 rgba(50, 197, 255, .5);
        }

.scrollUp__wrap___1IwvO .scrollUp__arrow___3S4DT {
            display: block;
            width: 19px;
            height: 20px;
            margin: 0 auto;
            background: url(https://optimaxweb.glassesusa.com/image/upload/q_auto,fl_sanitize/img/67ed82df8a9b01db94ffa58f4f38a8e8.svg);
            -webkit-transition: -webkit-transform .5s;
            transition: -webkit-transform .5s;
            transition: transform .5s;
            transition: transform .5s, -webkit-transform .5s;
        }

@media (prefers-reduced-motion: reduce) {

.scrollUp__wrap___1IwvO .scrollUp__arrow___3S4DT {
                -webkit-transition: none;
                transition: none
        }
            }

.scrollUp__wrap___1IwvO .scrollUp__text___1n-SW {
            display: block;
            width: 100%;
            position: absolute;
            right: 0;
            font-weight: 700;
            -webkit-transform: translateY(40px);
                    transform: translateY(40px);
            color: #fff;
            font-size: 14px;
            line-height: 7px;
            text-align: center;
            font-family: Roboto, Arial, sans-serif;
            -webkit-transition: -webkit-transform .5s;
            transition: -webkit-transform .5s;
            transition: transform .5s;
            transition: transform .5s, -webkit-transform .5s;
        }

@media (prefers-reduced-motion: reduce) {

.scrollUp__wrap___1IwvO .scrollUp__text___1n-SW {
                -webkit-transition: none;
                transition: none
        }
            }

@media (min-width: 1440px) {

.scrollUp__wrap___1IwvO .scrollUp__text___1n-SW {
                font-size: 18px;
                line-height: 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" */

.container__container___2_n52 {
    position: fixed;
    width: 930px;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 100px;
}

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

.container__container___2_n52 {
        width: 1164px;
        bottom: 130px
}
    }

@media (min-width: 1440px) {

.container__container___2_n52 {
        width: 1300px;
        bottom: 150px
}
    }

/**
 * 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" */

.brandsSlideItem__toolTip___2Lc7H {
        background: #fff;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        height: 80px;
        width: 140px;
        border: 1px solid #f1f1f1;
        border-top: none;
        border-radius: 8px;
        -webkit-box-shadow: 0 1px 2px 0 rgba(58, 72, 80, .07), 0 6px 13px 0 rgba(176, 189, 197, .14);
                box-shadow: 0 1px 2px 0 rgba(58, 72, 80, .07), 0 6px 13px 0 rgba(176, 189, 197, .14);
        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: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

.brandsSlideItem__toolTip___2Lc7H :first-child {
            border-bottom: 1px solid #dedede;
        }

.brandsSlideItem__subcategory___3nGn5 {
        color: #2196f3;
        text-align: center;
        font: 400 16px/19px Roboto, Arial, sans-serif;
        padding: 9px 0;
        width: 100%;
        height: 50%;
    }

.brandsSlideItem__subcategory___3nGn5:hover {
            background-color: #f7f8f9;
        }

.brandsSlideItem__brand___Bx8Zx {
        width: 140px;
        height: 46px;
        padding: 5px 15px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        opacity: 1;
        -webkit-transition: opacity .3s;
        transition: opacity .3s;
        border: 1px solid #dedede;
        border-radius: 75px;
    }

.brandsSlideItem__brand___Bx8Zx.brandsSlideItem__hover___1RdP- {
            background-color: #f7f8f9;
        }

.brandsSlideItem__brand___Bx8Zx svg {
            display: block;
            stroke: none;
        }

.brandsSlideItem__RayBanBrand___2H34d {
        width: 65px;
    }

.brandsSlideItem__PradaBrand___2wgcc {
        width: 92px;
    }

.brandsSlideItem__BurberryBrand___1cc4Q {
        width: 105px;
    }

.brandsSlideItem__BurberryBrand___1cc4Q svg > g {
            fill: #000;
        }

.brandsSlideItem__PersolBrand___1G244 {
        width: 54px;
    }

.brandsSlideItem__ArmaniBrand___zXh8x {
        width: 81px;
    }

.brandsSlideItem__MuseAndHilaryDuffBrand___237r0 {
        width: 103px;
    }

.brandsSlideItem__VersaceBrand___2_Y_L {
        width: 77px;
    }

.brandsSlideItem__GucciBrand___1PKJi {
        width: 85px;
    }

.brandsSlideItem__MichaelKorsBrand___2rGv5 {
        width: 102px;
    }

.brandsSlideItem__MuseSingleBrand___FRPcv {
        width: 38px;
    }

.brandsSlideItem__OakleyBrand___gxB4y {
        width: 69px;
    }

.brandsSlideItem__MiuMiuBrand___1FIbY {
        width: 90px;
    }

.brandsSlideItem__CoachNewBrand___2RQrQ {
        width: 80px;
    }

.brandsSlideItem__CkBrand___2qpbz {
        width: 35px;
    }

.brandsSlideItem__HillaryDuffBrand___29ww7 {
        width: 75px;
    }

.brandsSlideItem__CostaBrand___3ekZW {
        width: 109px;
    }

.brandsSlideItem__Vogue___Dyj8W {
        width: 90px;
    }

.brandsSlideItem__AllBrands___3gh7K {
        width: 73px;
    }

/**
 * 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" */

.brandsSlider__title___2e8xd {
        font: 300 28px/33px Roboto, Arial, sans-serif;
        color: #0f0f0f;
        text-align: center;
        margin: 35px auto 36px;
    }

.brandsSlider__brandsWrap___2gxpA {
        min-height: 200px;
        margin: 0 auto;
    }

@media (min-width: 1440px) {

.brandsSlider__brandsWrap___2gxpA {
            max-width: 1300px
    }
        }

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

.brandsSlider__brandsWrap___2gxpA {
            max-width: 1150px
    }
        }

@media (max-width: 1279.9px) {

.brandsSlider__brandsWrap___2gxpA {
            max-width: 960px
    }
        }

.brandsSlider__btn___34xrP {
        position: absolute;
        outline: none;
        cursor: pointer;
        opacity: 1;
        top: 6px;
    }

.brandsSlider__btn___34xrP:disabled {
            color: #b0bdc5;
        }

.brandsSlider__btn___34xrP.brandsSlider__next___1MbRu {
            background-color: inherit;
            right: 45px;
        }

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

.brandsSlider__btn___34xrP.brandsSlider__next___1MbRu {
                right: 35px
        }
            }

@media (max-width: 1279.9px) {

.brandsSlider__btn___34xrP.brandsSlider__next___1MbRu {
                right: 65px
        }
            }

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

.brandsSlider__btn___34xrP.brandsSlider__prev___2h9gJ {
                right: 10px
        }
            }

@media (max-width: 1279.9px) {

.brandsSlider__btn___34xrP.brandsSlider__prev___2h9gJ {
                left: 30px
        }
            }

.brandsSlider__btn___34xrP.brandsSlider__prev___2h9gJ .brandsSlider__arrow___3aAtV {
                -webkit-transform: rotate(-180deg);
                        transform: rotate(-180deg);
            }

.brandsSlider__btn___34xrP:not(:disabled) .brandsSlider__arrow___3aAtV svg use {
            stroke: #5b6971;
        }

.brandsSlider__arrow___3aAtV {
        position: absolute;
        right: 0;
        left: 0;
        top: 0;
        bottom: 0;
        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: 32px;
        height: 32px;
        border: 1px solid #dedede;
        -webkit-box-shadow: 0 1px 0 0 rgb(58 72 80 / 7%), 0 2px 11px -1px rgb(176 189 197 / 12%);
                box-shadow: 0 1px 0 0 rgb(58 72 80 / 7%), 0 2px 11px -1px rgb(176 189 197 / 12%);
        border-radius: 23px;
    }

.brandsSlider__arrow___3aAtV svg {
            width: 6px;
            height: 10px;
        }

.brandsSlider__arrow___3aAtV svg use {
                stroke-width: 2;
            }

.brandsSlider__slider___2ayNJ {
        height: 150px;
    }

/**
 * 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" */

.planoHomeEyewearForEveryone__wrapper___32uX4 {
        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;
        margin: 0 auto;
        padding: 10px 0 0;
        max-width: 1300px;
    }

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

.planoHomeEyewearForEveryone__wrapper___32uX4 {
            max-width: 1200px
    }
        }

@media (max-width: 1279.9px) {

.planoHomeEyewearForEveryone__wrapper___32uX4 {
            max-width: 930px
    }
        }

.planoHomeEyewearForEveryone__title___2tHi5 {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0;
    }

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

.planoHomeEyewearForEveryone__bannersWrapper___WeFHT {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        width: 100%;
        margin: 0 0 80px;
    }

.planoHomeEyewearForEveryone__banner___3wYmT {
        position: relative;
        overflow: hidden;
        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;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        width: calc((100% - 24px)/2);
        height: 320px;
        padding: 24px;
        border-radius: 4px;
        border: 1px solid #f1f1f1;
        cursor: pointer;
    }

.planoHomeEyewearForEveryone__banner___3wYmT:nth-child(odd) {
            margin-right: 24px;
        }

.planoHomeEyewearForEveryone__banner___3wYmT:first-child {
            margin-bottom: 38px;
        }

@media (max-width: 1279.9px) {

.planoHomeEyewearForEveryone__banner___3wYmT {
            height: 220px
    }
        }

.planoHomeEyewearForEveryone__bannerLink___Au0_a {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

.planoHomeEyewearForEveryone__bannerImage___M1bJR {
        position: absolute;
        left: 0;
        bottom: 0;
        border-radius: 4px;
    }

@media (max-width: 1279.9px) {

.planoHomeEyewearForEveryone__bannerImage___M1bJR {
            height: 125%
    }
        }

.planoHomeEyewearForEveryone__bannerImageCentered___1XsiN {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 4px;
    }

@media (max-width: 1279.9px) {

.planoHomeEyewearForEveryone__bannerImageCentered___1XsiN {
            width: 100%
    }
        }

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

.planoHomeEyewearForEveryone__bannerImageCentered___1XsiN {
            left: 50%;
            -webkit-transform: translateX(-50%);
                    transform: translateX(-50%)
    }
        }

.planoHomeEyewearForEveryone__bannerHeader___2S2ks {
        margin: 0 0 18px;
        font-weight: 700;
        font-family: Roboto, Arial, sans-serif;
        color: #0f0f0f;
        font-size: 24px;
        line-height: 1.17;
        z-index: 10;
        pointer-events: none;
    }

.planoHomeEyewearForEveryone__bannerHeaderWhite___3SHBD {
        color: #fff;
    }

.planoHomeEyewearForEveryone__bannerButton___3YnBo {

        padding-left: 24px;
        padding-right: 24px;
        min-width: 80px;
    }

.planoHomeEyewearForEveryone__bannerButton___3YnBo:first-child:not(:last-child) {
            margin-right: 6px;
        }

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

/**
 * 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" */

.personalizedBanner__wrapper___2zMSm {
        background: #c5e5f1;
        font-family: Roboto, Arial, sans-serif;
    }

.personalizedBanner__container___2DvxG {
        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;
        margin: 0 auto;
        padding: 59px 0;
    }

.personalizedBanner__reorderInfo___3Vz9o {
        color: #0f0f0f;
        font-family: Roboto, Arial, sans-serif;
        font-size: 32px;
        line-height: 47px;
        margin-right: 90px;
        max-width: 520px;
    }

@media (max-width: 1279.9px) {

.personalizedBanner__reorderInfo___3Vz9o {
            max-width: 507px
    }
        }

.personalizedBanner__ctaBlock___3xFMm {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        color: #4d4d4d;
        font-size: 18px;
        font-weight: 300;
        line-height: 21px;
    }

.personalizedBanner__or___2fdQ_ {
        margin-left: 24px;
    }

.personalizedBanner__placeNewOrder___15g4v {
        text-decoration: underline;
        cursor: pointer;
    }

.personalizedBanner__greetings___2lYB0 {
        margin-bottom: 30px;
    }

.personalizedBanner__reorderLabel___2yE1z {
        padding: 0 23px;
    }

.personalizedBanner__productInfo___YMID1 {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        max-width: 356px;
        border: 1px solid #f1f1f1;
        border-radius: 6px;
        background-color: #fff;
        -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.07), 0 8px 12px 0 rgba(0, 0, 0, 0.07);
                box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.07), 0 8px 12px 0 rgba(0, 0, 0, 0.07);
        text-align: center;
    }

.personalizedBanner__productInfo___YMID1 img {
            max-width: 100%;
            margin: 20px 0;
        }

.personalizedBanner__divider___vgpe0 {
        height: 1px;
        background: #e7ebed;
    }

.personalizedBanner__productName___2wLhR {
        margin: 20px 25px;
        color: #0f0f0f;
        font-size: 16px;
        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" */

.carousel__btn___1HuKn {
        z-index: 20;
        position: absolute;
        top: 50%;
        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;
        height: 30px;
        width: 20px;
        border: none;
        -webkit-transition: opacity .3s;
        transition: opacity .3s;
    }

.carousel__btn___1HuKn .carousel__arrow___1U-GH path {
            -webkit-transition: stroke .3s;
            transition: stroke .3s;
            stroke: #89959c;
        }

.carousel__btn___1HuKn:not([disabled]) {
            cursor: pointer;
        }

.carousel__btn___1HuKn:disabled {
            opacity: .45;
        }

.carousel__btn___1HuKn:focus {
            outline: none;
        }

.carousel__btn___1HuKn:not([disabled]):focus .carousel__arrow___1U-GH path, .carousel__btn___1HuKn:not([disabled]):hover .carousel__arrow___1U-GH path {
            stroke: #6b6b6b;
        }

.carousel__prev___2jcJ8 {
        right: 0;
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
    }

.carousel__next___3mjx6 {
        left: 0;
    }

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

.carousel__item___3IiBG {
        margin: 0 5px;
    }

.carousel__dot___21vpl {
        width: 9px;
        height: 9px;
        padding: 0;
        border-radius: 50%;
        background-color: rgba(247, 248, 249, 0.55);
        border: 0;
        outline: none;
        cursor: pointer;
    }

.carousel__dot___21vpl.carousel__active___1N4nC {
            background-color: #f7f8f9;
        }

.carousel__arrow___1U-GH {
        width: 65%;
    }

/**
 * 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" */

.disclaimer__disclaimer___WX4-0 {
        position: absolute;
        bottom: 12px;
        padding: 4px 8px;
        font-size: 14px;
        line-height: 16px;
        border-radius: 4px;
    }

.disclaimer__leftAlignment___ejTz0 {
        left: 28px;
    }

@media (min-width: 1580px) {

.disclaimer__leftAlignment___ejTz0 {
            left: 80px
    }
        }

.disclaimer__rightAlignment___1J2LH {
        right: 28px;
    }

@media (min-width: 1580px) {

.disclaimer__rightAlignment___1J2LH {
            right: 80px
    }
        }

.disclaimer__darkColor___T1V_C {
        color: #0f0f0f;
    }

.disclaimer__lightColor___GK5DY {
        color: #fff;
    }

.disclaimer__darkBackgroundColor___-GwAQ {
        background-color: rgba(0, 0, 0, 0.4);
    }

.disclaimer__lightBackgroundColor___RzHuP {
        background-color: rgba(255, 255, 255, 0.4);
    }

.disclaimer__halfTemplate___3FX6i .disclaimer__rightAlignment___1J2LH {
            right: calc(50% + 28px);
        }

@media (min-width: 1580px) {

.disclaimer__halfTemplate___3FX6i .disclaimer__rightAlignment___1J2LH {
                right: calc(50% + 80px)
        }
            }

/**
 * 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" */

.video__video___WzWGz {
        position: absolute;
        top: 50%;
        left: 50%;
        width: auto;
        height: auto;
        min-width: 100%;
        min-height: 100%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
    }

@supports ((-o-object-fit: cover) or (object-fit: cover)) {
        .video__video___WzWGz {
            width: 100%;
            height: 100%;
            min-width: 0;
            min-height: 0;
            -o-object-fit: cover;
               object-fit: cover;
        }
    }

.video__halfTemplate___1Tu-9 .video__video___WzWGz {
            left: 0;
            width: 50%;
            height: auto;
            min-width: 50%;
            min-height: 100%;
            -webkit-transform: translate(0%, -50%);
                    transform: translate(0%, -50%);
        }

@supports ((-o-object-fit: cover) or (object-fit: cover)) {
            .video__halfTemplate___1Tu-9 .video__video___WzWGz {
                left: 0;
                width: 50%;
                -webkit-transform: translate(0%, -50%);
                        transform: translate(0%, -50%);
            }
        }

/**
 * 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" */

.lines__wrapper___35RyA {
        margin-bottom: 44px;
    }

.lines__text___3XMX6 {
        width: 100%;
        font-family: Roboto, Arial, sans-serif;
        font-weight: 700;
        color: #0f0f0f;
    }

.lines__darkText___2rG6A {
        color: #0f0f0f;
    }

.lines__lightText___3nRm0 {
        color: #fff;
    }

.lines__h1___3cmOa {
        line-height: 1.14;

        font-size: calc(64px + 16*(100vw - 930px)/1070);
    }

@media (max-width: 930px) {

.lines__h1___3cmOa {
        font-size: 64px;
    }
    }

@media (min-width: 2000px) {

.lines__h1___3cmOa {
        font-size: 80px;
    }
    }

@media (max-height: 833px) {

.lines__h1___3cmOa {
        font-size: 64px;
    }
    }

@supports (font-size: clamp(64px, 4vw, 80px)) {

.lines__h1___3cmOa {
        font-size: clamp(64px, 4vw, 80px);
    }

        @media (max-width: 930px) {

.lines__h1___3cmOa {
            font-size: clamp(64px, 4vw, 80px);
    }
        }

        @media (min-width: 2000px) {

.lines__h1___3cmOa {
            font-size: clamp(64px, 4vw, 80px);
    }
        }

        @media (max-height: 833px) {

.lines__h1___3cmOa {
            font-size: 64px;
    }
        }
    }

.lines__h2___CCkjQ {
        line-height: 1.21;

        font-size: calc(44px + 14*(100vw - 930px)/1070);
    }

@media (max-width: 930px) {

.lines__h2___CCkjQ {
        font-size: 44px;
    }
    }

@media (min-width: 2000px) {

.lines__h2___CCkjQ {
        font-size: 58px;
    }
    }

@media (max-height: 833px) {

.lines__h2___CCkjQ {
        font-size: 44px;
    }
    }

@supports (font-size: clamp(44px, 2.9vw, 58px)) {

.lines__h2___CCkjQ {
        font-size: clamp(44px, 2.9vw, 58px);
    }

        @media (max-width: 930px) {

.lines__h2___CCkjQ {
            font-size: clamp(44px, 2.9vw, 58px);
    }
        }

        @media (min-width: 2000px) {

.lines__h2___CCkjQ {
            font-size: clamp(44px, 2.9vw, 58px);
    }
        }

        @media (max-height: 833px) {

.lines__h2___CCkjQ {
            font-size: 44px;
    }
        }
    }

.lines__h3___PMtWi {
        line-height: 1.22;

        font-size: calc(32px + 10*(100vw - 930px)/1070);
    }

@media (max-width: 930px) {

.lines__h3___PMtWi {
        font-size: 32px;
    }
    }

@media (min-width: 2000px) {

.lines__h3___PMtWi {
        font-size: 42px;
    }
    }

@media (max-height: 833px) {

.lines__h3___PMtWi {
        font-size: 32px;
    }
    }

@supports (font-size: clamp(32px, 2.1vw, 42px)) {

.lines__h3___PMtWi {
        font-size: clamp(32px, 2.1vw, 42px);
    }

        @media (max-width: 930px) {

.lines__h3___PMtWi {
            font-size: clamp(32px, 2.1vw, 42px);
    }
        }

        @media (min-width: 2000px) {

.lines__h3___PMtWi {
            font-size: clamp(32px, 2.1vw, 42px);
    }
        }

        @media (max-height: 833px) {

.lines__h3___PMtWi {
            font-size: 32px;
    }
        }
    }

.lines__h4___2r3QH {
        line-height: 1.24;

        font-size: calc(28px + 10*(100vw - 930px)/1070);
    }

@media (max-width: 930px) {

.lines__h4___2r3QH {
        font-size: 28px;
    }
    }

@media (min-width: 2000px) {

.lines__h4___2r3QH {
        font-size: 38px;
    }
    }

@media (max-height: 833px) {

.lines__h4___2r3QH {
        font-size: 28px;
    }
    }

@supports (font-size: clamp(28px, 1.9vw, 38px)) {

.lines__h4___2r3QH {
        font-size: clamp(28px, 1.9vw, 38px);
    }

        @media (max-width: 930px) {

.lines__h4___2r3QH {
            font-size: clamp(28px, 1.9vw, 38px);
    }
        }

        @media (min-width: 2000px) {

.lines__h4___2r3QH {
            font-size: clamp(28px, 1.9vw, 38px);
    }
        }

        @media (max-height: 833px) {

.lines__h4___2r3QH {
            font-size: 28px;
    }
        }
    }

.lines__h5___1oCUH {
        line-height: 1.3;

        font-size: calc(20px + 6*(100vw - 930px)/1070);
    }

@media (max-width: 930px) {

.lines__h5___1oCUH {
        font-size: 20px;
    }
    }

@media (min-width: 2000px) {

.lines__h5___1oCUH {
        font-size: 26px;
    }
    }

@media (max-height: 833px) {

.lines__h5___1oCUH {
        font-size: 20px;
    }
    }

@supports (font-size: clamp(20px, 1.3vw, 26px)) {

.lines__h5___1oCUH {
        font-size: clamp(20px, 1.3vw, 26px);
    }

        @media (max-width: 930px) {

.lines__h5___1oCUH {
            font-size: clamp(20px, 1.3vw, 26px);
    }
        }

        @media (min-width: 2000px) {

.lines__h5___1oCUH {
            font-size: clamp(20px, 1.3vw, 26px);
    }
        }

        @media (max-height: 833px) {

.lines__h5___1oCUH {
            font-size: 20px;
    }
        }
    }

.lines__normal___gpHpL {
        font-weight: 400;
    }

/**
 * 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" */

.button__buttons___2oi2s {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin: -6px;
    }

.button__wrapper___2_Jt8 {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        max-width: 185px;
        width: 100%;
        margin: 6px;
    }

.button__button___UAxHs {
        margin: auto;
    }

.button__fullImageCanterTemplate___2JX_5 {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: 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" */

.promotionItem__canvas___F0Tn_ {
        position: relative;
        width: 100%;
    }

.promotionItem__wrapper___3WdTj {
        width: 100%;
        max-width: 100%;
        margin: auto;
    }

@media (min-width: 1440px) {

.promotionItem__wrapper___3WdTj {
            max-width: 1300px
    }
        }

.promotionItem__box___1abgR {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        height: 100%;
    }

.promotionItem__box___1abgR.promotionItem__fullImageCenter___1IRi2 .promotionItem__data___1_FNR {
                width: 50%;
                margin: auto;
                text-align: center;
            }

.promotionItem__box___1abgR.promotionItem__fullImageRight___2eNWm {
            -webkit-box-pack: end;
                -ms-flex-pack: end;
                    justify-content: flex-end;
        }

.promotionItem__box___1abgR.promotionItem__fullImageRight___2eNWm .promotionItem__data___1_FNR {
                width: 50%;
            }

@media (max-width: 1279.9px) {

.promotionItem__box___1abgR.promotionItem__fullImageRight___2eNWm .promotionItem__data___1_FNR {
                    padding-left: 80px
            }
                }

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

.promotionItem__box___1abgR.promotionItem__fullImageRight___2eNWm .promotionItem__data___1_FNR {
                    padding-left: 120px
            }
                }

.promotionItem__box___1abgR.promotionItem__fullImageLeft___O0PEK {
            -webkit-box-pack: start;
                -ms-flex-pack: start;
                    justify-content: flex-start;
        }

.promotionItem__box___1abgR.promotionItem__fullImageLeft___O0PEK .promotionItem__data___1_FNR {
                padding-left: 120px;
            }

@media (min-width: 1580px) {

.promotionItem__box___1abgR.promotionItem__fullImageLeft___O0PEK .promotionItem__data___1_FNR {
                    padding-left: 0
            }
                }

.promotionItem__box___1abgR.promotionItem__halfImage___1OygL {
            -webkit-box-pack: end;
                -ms-flex-pack: end;
                    justify-content: flex-end;
        }

.promotionItem__box___1abgR.promotionItem__halfImage___1OygL .promotionItem__data___1_FNR {
                width: 50%;
            }

@media (max-width: 1279.9px) {

.promotionItem__box___1abgR.promotionItem__halfImage___1OygL .promotionItem__data___1_FNR {
                    padding-left: 80px
            }
                }

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

.promotionItem__box___1abgR.promotionItem__halfImage___1OygL .promotionItem__data___1_FNR {
                    padding-left: 120px
            }
                }

.promotionItem__box___1abgR.promotionItem__halfImage___1OygL .promotionItem__image___23hyd {
                left: auto;
                right: 50%;
                width: 50%;
            }

.promotionItem__data___1_FNR {
        z-index: 1;
        position: relative;
        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: center;
            -ms-flex-pack: center;
                justify-content: center;
        height: 360px;
    }

@media (min-width: 1024px) {

.promotionItem__data___1_FNR {
            height: 60vh;
            max-height: 500px;
            min-height: 278px
    }
        }

.promotionItem__image___23hyd {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        background-size: cover;
        background-position: 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" */

.promotionsCarousel__carousel___2H5Bl {
        min-height: 278px;
        max-height: 100%;
    }

.promotionsCarousel__leftArrow___3Szzq, .promotionsCarousel__rightArrow___20SHn {
        width: 44px;
        height: 44px;
        background-color: #fff;
        border-radius: 50%;
        opacity: .8;
        -webkit-transform: translate(0, -50%);
                transform: translate(0, -50%);
    }

.promotionsCarousel__leftArrow___3Szzq svg, .promotionsCarousel__rightArrow___20SHn svg {
            width: 11px;
        }

.promotionsCarousel__leftArrow___3Szzq svg path, .promotionsCarousel__rightArrow___20SHn svg path {
                stroke: #5b6971;
            }

.promotionsCarousel__leftArrow___3Szzq:not([disabled]):focus, .promotionsCarousel__leftArrow___3Szzq:not([disabled]):hover, .promotionsCarousel__rightArrow___20SHn:not([disabled]):focus, .promotionsCarousel__rightArrow___20SHn:not([disabled]):hover {
            opacity: 1;
        }

.promotionsCarousel__leftArrow___3Szzq {
        left: 28px;
        -webkit-transform: translate(0, -50%) rotate(180deg);
                transform: translate(0, -50%) rotate(180deg);
    }

@media (min-width: 1580px) {

.promotionsCarousel__leftArrow___3Szzq {
            left: 80px
    }
        }

.promotionsCarousel__rightArrow___20SHn {
        right: 28px;
        left: auto;
    }

@media (min-width: 1580px) {

.promotionsCarousel__rightArrow___20SHn {
            right: 80px
    }
        }

/**
 * 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" */

.promotionsForHP__tombstone___1--mI, .promotionsForHP__wrapper___11VCK {
        max-width: 2000px;
        height: 360px;
        margin: auto;
        overflow: hidden;
        background-color: #d8d8d8;
    }

@media (min-width: 1024px) {

.promotionsForHP__tombstone___1--mI, .promotionsForHP__wrapper___11VCK {
            height: 60vh;
            max-height: 500px;
            min-height: 278px
    }
        }

.cmsBlockByPlaceholder__wrapLoader___j6EQV {
        width: 200px;
        margin: 0 auto;
    }
    .cmsBlockByPlaceholder__loader___13jNy {
        margin: 50px 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" */

#HPHeaderBannerMain {
    position: relative;
}

#HPHeaderBannerMain .video-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}

.heroImage__wrap___1PGSy {
    position: relative;
    margin: 0 auto;
    max-width: 1308px;
    min-width: 930px;
    text-align: center;
}

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

.heroImage__wrap___1PGSy {
        max-width: 1162px
}
    }

@media (max-width: 1279.9px) {

.heroImage__wrap___1PGSy {
        max-width: 930px
}
    }

.heroImage__wrap___1PGSy img {
        max-width: 100%;
        vertical-align: top;
    }

.heroImage__cmsBlock___sAjxo .popupContainer {
        width: auto;
    }

.heroImage__cmsBlock___sAjxo .rc-dialog-body::after, .heroImage__cmsBlock___sAjxo .rc-dialog-body::before {
            content: '';
            display: table;
        }

.heroImage__wrapLoader___1Yl7M {
    width: 300px;
}

.heroImage__loader___1m3vd {
    margin: 50px 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" */

.tinySlider__slide___3poVV {
        height: 114px;
        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;
    }

.tinySlider__slide___3poVV > * {
            max-width: 100%;
            max-height: 100%;
        }

.tinySlider__btn___1gkAN {
        display: block;
        height: 22px;
        width: 22px;
        border-radius: 50%;
        background-color: #f7f3f3;
        border: none;
        cursor: pointer;
        text-align: center;
        outline: none;
    }

.tinySlider__btn___1gkAN.tinySlider__next___1tlpF {
            -webkit-transform: rotateY(180deg);
                    transform: rotateY(180deg);
        }

.tinySlider__btn___1gkAN.tinySlider__disable___2_EzC {
            opacity: .4;
            cursor: auto;
        }

.tinySlider__btn___1gkAN.tinySlider__disable___2_EzC:focus, .tinySlider__btn___1gkAN.tinySlider__disable___2_EzC:active {
                outline: none;
            }

.tinySlider__colors___si3zL .tinySlider__btn___1gkAN {
        background: none;
        width: 8px;
        padding: 0;
    }

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN {
            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: center;
                -ms-flex-pack: center;
                    justify-content: center;
            background: none;
            width: 8px;
            padding: 30px 20px;
            z-index: 20;
            position: relative;
        }

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN::after {
                content: '';
                position: absolute;
                display: block;
                left: 50%;
                top: 50%;
                -webkit-transform: translate(-50%, -50%);
                        transform: translate(-50%, -50%);
                z-index: 20;
            }

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN::before {
                content: '';
                width: 60px;
                height: 100%;
                position: absolute;
                z-index: 10;
                top: 0;
            }

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN.tinySlider__prev___3dnxT::before {
                left: 30px;
                background-image: -webkit-gradient(linear, left top, right top, from(#fff), to(rgba(255, 255, 255, 0)));
                background-image: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
            }

@media (max-width: 1279.9px) {

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN.tinySlider__prev___3dnxT::before {
                    left: 0
            }
                }

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN.tinySlider__next___1tlpF::after {
                    -webkit-transform: translate(-50%, -50%) rotateY(180deg);
                            transform: translate(-50%, -50%) rotateY(180deg);
                }

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN.tinySlider__next___1tlpF::before {
                    right: 30px;
                    background-image: -webkit-gradient(linear, right top, left top, from(#fff), to(rgba(255, 255, 255, 0)));
                    background-image: linear-gradient(to left, #fff, rgba(255, 255, 255, 0));
                }

@media (max-width: 1279.9px) {

.tinySlider__brands___30XZa .tinySlider__btn___1gkAN.tinySlider__next___1tlpF::before {
                        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" */

.homeBrands__homeBrandsWrap___1npfD {
        width: 1308px;
        margin: 0 auto;
        overflow: hidden;
    }

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

.homeBrands__homeBrandsWrap___1npfD {
            width: 1162px
    }
        }

@media (max-width: 1279.9px) {

.homeBrands__homeBrandsWrap___1npfD {
            width: 930px
    }
        }

.homeBrands__brand___doPGV {
        width: 128px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        opacity: .5;
        -webkit-transition: opacity .3s;
        transition: opacity .3s;
    }

.homeBrands__brand___doPGV:hover {
            opacity: 1;
        }

.homeBrands__brand___doPGV svg {
            display: block;
            stroke: none;
        }

.homeBrands__RayBanBrand___1O2Hl {
        width: 65px;
    }

.homeBrands__PradaBrand___aJsI1 {
        width: 92px;
    }

.homeBrands__PersolBrand___1-Az7 {
        width: 54px;
    }

.homeBrands__MuseAndHilaryDuffBrand___16UdX {
        width: 103px;
    }

.homeBrands__VersaceBrand___1_SvI {
        width: 77px;
    }

.homeBrands__GucciBrand___3hXjp {
        width: 85px;
    }

.homeBrands__MichaelKorsBrand___100wH {
        width: 102px;
    }

.homeBrands__MuseSingleBrand___2VIV8 {
        width: 38px;
    }

.homeBrands__OakleyBrand___3srRM {
        width: 69px;
    }

.homeBrands__MiuMiuBrand___3L1gi {
        width: 90px;
    }

.homeBrands__CoachNewBrand___3mcaZ {
        width: 80px;
    }

.homeBrands__CkBrand___1Al2S {
        width: 35px;
    }

.homeBrands__HillaryDuffBrand___tgLdI {
        width: 75px;
    }

.homeBrands__AllBrands___PM4CL {
        width: 73px;
    }

/**
 * 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" */

.homePage__framesWrapper___2Ogrj {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin: 48px 0 0;
        width: 1300px;
        min-height: 272px;
        position: relative;
    }

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

.homePage__framesWrapper___2Ogrj {
            width: 1165px
    }
        }

@media (max-width: 1279.9px) {

.homePage__framesWrapper___2Ogrj {
            width: 930px
    }
        }

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

@media (max-width: 1279.9px) {
                .homePage__framesWrapper___2Ogrj .homePage__row___2YY6G:nth-child(n + 3) {
                    display: none;
                }
            }

.homePage__framesWrapper___2Ogrj .homePage__frame___1EYB5 {
            width: 417px;
            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;
            cursor: pointer;
        }

.homePage__framesWrapper___2Ogrj .homePage__frame___1EYB5:not(:last-child) {
                margin: 0 24px 0 0;
            }

@media (max-width: 1279.9px) {
                .homePage__framesWrapper___2Ogrj .homePage__frame___1EYB5:nth-child(2n) {
                    margin: 0;
                }
            }

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

.homePage__framesWrapper___2Ogrj .homePage__frame___1EYB5 {
                width: 371px
        }

                .homePage__framesWrapper___2Ogrj .homePage__frame___1EYB5:nth-child(3n) {
                    margin: 0;
                }
            }

@media (min-width: 1440px) {
                .homePage__framesWrapper___2Ogrj .homePage__frame___1EYB5:nth-child(3n) {
                    margin: 0;
                }
            }

.homePage__framesWrapper___2Ogrj .homePage__frameImage___3kzbQ {
            width: 100%;
        }

.homePage__framesWrapper___2Ogrj .homePage__name___2V71b {
            color: #0f0f0f;
            font-size: 16px;
            line-height: 1.44;
            font-weight: 700;
            margin: 12px 0 0;
        }

.homePage__framesWrapper___2Ogrj .homePage__price___29bVP {
            color: #89959c;
            font-size: 14px;
            line-height: 1.64;
            font-weight: 400;
            margin: 5px 0 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" */

.homeChooseYourFrame__wrap___169Vk {
        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: 1300px;
    }

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

.homeChooseYourFrame__wrap___169Vk {
            width: 1200px
    }
        }

@media (max-width: 1279.9px) {

.homeChooseYourFrame__wrap___169Vk {
            width: 930px
    }
        }

.homeChooseYourFrame__wrap___169Vk.homeChooseYourFrame__default___3upnD {
            margin: 29px auto 0;
            padding: 86px 0 0;
            border-top: 1px solid #f1f1f1;
        }

.homeChooseYourFrame__wrap___169Vk.homeChooseYourFrame__planoWrapper___32qvz {
            margin: 20px auto 100px;
        }

.homeChooseYourFrame__title___1HC4Z {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
    }

.homeChooseYourFrame__subtitle___1Hz5c {
        color: #3a4850;
        font-size: 16px;
        line-height: 1.63;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 16px 0 0;
    }

.homeChooseYourFrame__ctaButtonsWrapper___1xE_E {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin: 60px 0 0;
    }

.homeChooseYourFrame__ctaButtonsWrapper___1xE_E .homeChooseYourFrame__ctaButton___FWDGY {
            width: 249px;
        }

.homeChooseYourFrame__ctaButtonsWrapper___1xE_E .homeChooseYourFrame__ctaButton___FWDGY:first-child {
                margin: 0 18px 0 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" */

.homeEyewearForEveryone__wrapper___2pkhV {
        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;
        margin: 80px auto 0;
        padding: 80px 0 0;
        max-width: 1300px;
        border-top: 1px solid #f1f1f1;
    }

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

.homeEyewearForEveryone__wrapper___2pkhV {
            max-width: 1200px
    }
        }

@media (max-width: 1279.9px) {

.homeEyewearForEveryone__wrapper___2pkhV {
            max-width: 930px
    }
        }

.homeEyewearForEveryone__title___3aSWR {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0;
    }

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

.homeEyewearForEveryone__bannersWrapper___T7nS0 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        width: 100%;
        margin: 0 0 80px;
    }

.homeEyewearForEveryone__banner___2CoMc {
        position: relative;
        overflow: hidden;
        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;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        width: calc((100% - 24px)/2);
        height: 320px;
        padding: 24px;
        border-radius: 4px;
        border: 1px solid #f1f1f1;
        cursor: pointer;
    }

.homeEyewearForEveryone__banner___2CoMc:nth-child(odd) {
            margin-right: 24px;
        }

.homeEyewearForEveryone__banner___2CoMc:first-child {
            margin-bottom: 38px;
        }

@media (max-width: 1279.9px) {

.homeEyewearForEveryone__banner___2CoMc {
            height: 220px
    }
        }

.homeEyewearForEveryone__bannerLink___3fnXd {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

.homeEyewearForEveryone__bannerImage___3mHxk {
        position: absolute;
        left: 0;
        bottom: 0;
        border-radius: 4px;
    }

@media (max-width: 1279.9px) {

.homeEyewearForEveryone__bannerImage___3mHxk {
            height: 125%
    }
        }

.homeEyewearForEveryone__bannerImageCentered___1wLzv {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 4px;
    }

@media (max-width: 1279.9px) {

.homeEyewearForEveryone__bannerImageCentered___1wLzv {
            width: 100%
    }
        }

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

.homeEyewearForEveryone__bannerImageCentered___1wLzv {
            left: 50%;
            -webkit-transform: translateX(-50%);
                    transform: translateX(-50%)
    }
        }

.homeEyewearForEveryone__bannerHeader___3AsPB {
        margin: 0 0 18px;
        font-weight: 700;
        font-family: Roboto, Arial, sans-serif;
        color: #0f0f0f;
        font-size: 24px;
        line-height: 1.17;
        z-index: 10;
        pointer-events: none;
    }

.homeEyewearForEveryone__bannerHeaderWhite___3k7N6 {
        color: #fff;
    }

.homeEyewearForEveryone__bannerButton___1XL5W {

        padding-left: 24px;
        padding-right: 24px;
        min-width: 80px;
    }

.homeEyewearForEveryone__bannerButton___1XL5W:first-child:not(:last-child) {
            margin-right: 6px;
        }

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

/**
 * 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" */

.homeOurMostPopularBrands__wrapper___1JM3p {
        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;
        max-width: 2000px;
        margin: 0 auto;

        background-color: #eef6fb;
        padding: 78px 0 56px;
    }

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

.homeOurMostPopularBrands__wrapper___1JM3p {
            max-width: 1440px;
    }
        }

@media (max-width: 1279.9px) {

.homeOurMostPopularBrands__wrapper___1JM3p {
            max-width: 1280px;
    }
        }

.homeOurMostPopularBrands__brandsWrapper___148Gi {
        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;
        margin: 80px auto 0;
        padding: 80px 0 0;
        max-width: 1300px;
        border-top: 1px solid #f1f1f1;
    }

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

.homeOurMostPopularBrands__brandsWrapper___148Gi {
            max-width: 1200px
    }
        }

@media (max-width: 1279.9px) {

.homeOurMostPopularBrands__brandsWrapper___148Gi {
            max-width: 930px
    }
        }

.homeOurMostPopularBrands__title___1-KXJ {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0 0 60px;
    }

.homeOurMostPopularBrands__cardsWrapper___eLoFO {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        max-width: 1300px;
        height: 352px;
    }

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

.homeOurMostPopularBrands__cardsWrapper___eLoFO {
            max-width: 1165px;
            height: 312px
    }
        }

@media (max-width: 1279.9px) {

.homeOurMostPopularBrands__cardsWrapper___eLoFO {
            max-width: 930px;
            height: 246px
    }
        }

.homeOurMostPopularBrands__card___1OHnR {
        width: 25%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        border-radius: 12px;
        -webkit-box-shadow: 0 1px 0 0 rgba(58, 72, 80, 0.2), 1px 2px 11px -1px rgba(176, 189, 197, 0.16);
                box-shadow: 0 1px 0 0 rgba(58, 72, 80, 0.2), 1px 2px 11px -1px rgba(176, 189, 197, 0.16);
        border: 1px solid #f1f1f1;
        -webkit-transition: -webkit-box-shadow .3s;
        transition: -webkit-box-shadow .3s;
        transition: box-shadow .3s;
        transition: box-shadow .3s, -webkit-box-shadow .3s;
    }

.homeOurMostPopularBrands__card___1OHnR:not(:last-child) {
            margin-right: 24px;
        }

.homeOurMostPopularBrands__card___1OHnR:hover {
            -webkit-box-shadow: 0 1px 3px 0 rgba(58, 72, 80, 0.07), 0 8px 14px 0 rgba(176, 189, 197, 0.1), 0 2px 8px 1px rgba(137, 149, 156, 0.05);
                    box-shadow: 0 1px 3px 0 rgba(58, 72, 80, 0.07), 0 8px 14px 0 rgba(176, 189, 197, 0.1), 0 2px 8px 1px rgba(137, 149, 156, 0.05);
        }

.homeOurMostPopularBrands__cardImage___3bNlQ {
        width: 100%;
    }

.homeOurMostPopularBrands__logoWrapper___2pRky {
        --transform-scale: scale(1);

        background-color: #fff;
        width: 100%;
        -webkit-box-flex: 1;
            -ms-flex: 1 1;
                flex: 1 1;
        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;
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }

.homeOurMostPopularBrands__logoWrapper___2pRky .homeOurMostPopularBrands__logo___2gz0y {
            -webkit-transform: var(--transform-scale);
                    transform: var(--transform-scale);
            stroke: none;
        }

.homeOurMostPopularBrands__logoWrapper___2pRky .homeOurMostPopularBrands__rayBansLogo___kXLDM {
            width: 70px;
            height: 36px;
        }

.homeOurMostPopularBrands__logoWrapper___2pRky .homeOurMostPopularBrands__oakleyLogo___3E_GJ {
            width: 72px;
            height: 27px;
        }

.homeOurMostPopularBrands__logoWrapper___2pRky .homeOurMostPopularBrands__hilaryDuffLogo___3E3E3 {
            width: 93px;
            height: 25px;
        }

.homeOurMostPopularBrands__logoWrapper___2pRky .homeOurMostPopularBrands__eyeglassesMaleModelLogo___28jA9 {
            width: 36px;
            height: 25px;
        }

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

.homeOurMostPopularBrands__logoWrapper___2pRky {
            --transform-scale: scale(.89)
    }
        }

@media (max-width: 1279.9px) {

.homeOurMostPopularBrands__logoWrapper___2pRky {
            --transform-scale: scale(.7)
    }
        }

.homeOurMostPopularBrands__brandsTitle___3Ss-F {
        color: #0f0f0f;
        font-size: 18px;
        line-height: 1.17;
        font-weight: 700;
        font-family: Roboto, Arial, sans-serif;
        margin: 64px 0 34px;
    }

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

.homeOurMostPopularBrands__brandsRow___2U-ic ~ .homeOurMostPopularBrands__brandsRow___2U-ic {
            margin-top: 12px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 {
        -webkit-box-shadow: 0 1px 2px 0 rgba(58, 72, 80, 0.07), 0 6px 13px 0 rgba(176, 189, 197, 0.14);
                box-shadow: 0 1px 2px 0 rgba(58, 72, 80, 0.07), 0 6px 13px 0 rgba(176, 189, 197, 0.14);
        width: -webkit-min-content;
        width: -moz-min-content;
        width: min-content;
    }

.homeOurMostPopularBrands__brandsButton___21bz0:not(:last-child) {
            margin-right: 8px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__brandIcon___3DG4I {
            fill: #3a4850;
            stroke: none;
            margin: 0 7px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__RayBanBrand___wEjXa {
            width: 52px;
            height: 25px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__OakleyBrand___38aJt {
            width: 48px;
            height: 19px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__PersolBrand___GhZ7J {
            width: 43px;
            height: 26px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__PradaBrand___J_RgP {
            width: 73px;
            height: 12px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__MuseSingleBrand___1XpwU {
            width: 32px;
            height: 21px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__VersaceBrand___1JEFL {
            width: 70px;
            height: 14px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__EmporioArmani___6I9qR {
            width: 126px;
            height: 13px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__GucciBrand___2wYn0 {
            width: 90px;
            height: 14px;
        }

.homeOurMostPopularBrands__brandsButton___21bz0 .homeOurMostPopularBrands__MiuMiuBrand___Q-wFR {
            width: 96px;
            height: 16px;
        }

.homeOurMostPopularBrands__shopAllButton___VYfBV {
        color: #2196f3;
    }

/**
 * 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" */

.homeWeGotYourEyesCovered__wrapper___2DLRI {
        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;
        padding: 80px 0;
    }

.homeWeGotYourEyesCovered__title___18zVE {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0;
    }

.homeWeGotYourEyesCovered__subtitle___30SMp {
        color: #3a4850;
        font-size: 16px;
        line-height: 1.5;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 21px 0 63px;
        text-align: center;
    }

.homeWeGotYourEyesCovered__cardsWrapper___2auWy {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        max-width: 1300px;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

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

.homeWeGotYourEyesCovered__cardsWrapper___2auWy {
            max-width: 1165px
    }
        }

@media (max-width: 1279.9px) {

.homeWeGotYourEyesCovered__cardsWrapper___2auWy {
            max-width: 929px
    }
        }

/**
 * 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" */

.learnMorePopup__container___3S9Wa {
        width: 830px;
    }

.learnMorePopup__header___284gc {
        background-color: #2196f3;
        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;
        padding: 24px 130px;
    }

.learnMorePopup__header___284gc .learnMorePopup__headerTitle___2UNPt {
            color: #fff;
            font-size: 28px;
            line-height: 1.18;
            font-weight: 700;
            font-family: Roboto, Arial, sans-serif;
            margin: 0 0 7px;
            text-align: center;
        }

.learnMorePopup__header___284gc .learnMorePopup__headerSubtitle___3VZu5 {
            color: #fff;
            font-size: 18px;
            line-height: 1.28;
            font-weight: 400;
            font-family: Roboto, Arial, sans-serif;
            margin: 0;
            text-align: center;
        }

.learnMorePopup__content___1X6Q6 {
        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;
        padding: 36px 36px 0;
    }

.learnMorePopup__steps___3KvI3 {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        padding: 0 12px 28px;
        border-bottom: 1px solid #f1f1f1;
    }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy {
            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;
            padding: 0 0 0 12px;
        }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy:first-child {
                margin-right: 44px;
            }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy .learnMorePopup__stepTitleWrapper___3bIN8 {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                    -ms-flex-align: center;
                        align-items: center;
                margin: 0 0 12px;
            }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy .learnMorePopup__stepNumber___2v_7X {
                width: 26px;
                height: 26px;
                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;
                border-radius: 50%;
                background-color: #0f0f0f;
                color: #fff;
                font-size: 16px;
                line-height: 1.19;
                font-weight: 700;
                font-family: Roboto, Arial, sans-serif;
            }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy .learnMorePopup__stepTitle___1uhSq {
                color: #0f0f0f;
                font-size: 18px;
                font-weight: 700;
                font-family: Roboto, Arial, sans-serif;
                margin: 0 0 0 12px;
            }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy .learnMorePopup__stepInfo___2FOfJ {
                color: #3a4850;
                font-size: 14px;
                line-height: 1.43;
                font-weight: 400;
                font-family: Roboto, Arial, sans-serif;
                margin: 0;
            }

.learnMorePopup__steps___3KvI3 .learnMorePopup__step___1-UVy .learnMorePopup__link___36a_F {
                color: #2196f3;
                text-decoration: underline;
                font-size: inherit;
                line-height: inherit;
                font-weight: inherit;
                font-family: inherit;
            }

.learnMorePopup__steps___3KvI3 ~ .learnMorePopup__steps___3KvI3 {
            margin-top: 28px;
        }

.learnMorePopup__learnMore___3idFU {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: 36px auto 34px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        color: #0f0f0f;
        font-size: 16px;
        line-height: 1.19;
        font-weight: 700;
        font-family: Roboto, Arial, sans-serif;
    }

.learnMorePopup__learnMore___3idFU .learnMorePopup__learnMoreTitle___1wGTk {
            margin-right: 20px;
        }

.learnMorePopup__learnMore___3idFU .learnMorePopup__learnMoreButton___22KNs:not(:last-child) {
            margin-right: 8px;
        }

.learnMorePopup__footer___34edN {
        background-color: #f7f8f9;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 40px;
        width: 100%;
        -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;
        font-weight: 400;
        font-family: Roboto, Arial, sans-serif;
    }

.learnMorePopup__footer___34edN .learnMorePopup__footerItem___ZqOKo {
            margin-right: 28px;
        }

.learnMorePopup__footer___34edN .learnMorePopup__footerItem___ZqOKo .learnMorePopup__footerItemImage___3oT0u {
                margin-right: 7px;
            }

.learnMorePopup__closeButton___22D-w {
        position: absolute;
        top: 10px;
        right: 10px;
        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" */

.tryNowPopup__container___3wzDn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 830px;
    }

.tryNowPopup__content___3zl6w {
        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: center;
            -ms-flex-pack: center;
                justify-content: center;
        padding: 50px 60px 44px;
    }

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

.tryNowPopup__divider___1aunh {
        width: 25px;
        height: 1px;
        background-color: #89959c;
    }

.tryNowPopup__info___1EixI {
        color: #3a4850;
        font-size: 16px;
        line-height: 1.44;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 20px 0 36px;
    }

.tryNowPopup__readyToStart___3TRxC {
        color: #4d4d4d;
        font-size: 16px;
        line-height: 1.56;
        font-weight: 400;
        font-family: Roboto, Arial, sans-serif;
        margin: 0 0 12px;
    }

.tryNowPopup__button___3nHCl:last-child {
        margin: 10px 0 0;
    }

.tryNowPopup__closeButton___1YI9t {
        position: absolute;
        top: 11px;
        right: 11px;
        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" */

.card__card___2atro {
        position: relative;
        height: 100%;
        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;
        background-color: #fff;
        border: 1px solid #f1f1f1;
        -webkit-box-shadow: 0 1px 0 0 rgba(58, 72, 80, 0.2), 1px 2px 11px -1px rgba(176, 189, 197, 0.16);
                box-shadow: 0 1px 0 0 rgba(58, 72, 80, 0.2), 1px 2px 11px -1px rgba(176, 189, 197, 0.16);
        border-radius: 12px;
        padding: 0 0 24px;
    }

.card__card___2atro:not(:first-child) {
            margin-left: 25px;
        }

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

.card__card___2atro {

            padding: 0 0 20px
    }
            .card__card___2atro:not(:first-child) {
                margin-left: 23px;
            }
        }

@media (max-width: 1279.9px) {

.card__card___2atro {

            padding: 0 0 19px
    }
            .card__card___2atro:not(:first-child) {
                margin-left: 20px;
            }
        }

.card__card___2atro .card__badgeWrapper___2Za97 {
            position: absolute;
            top: 6px;
            left: 6px;
        }

.card__card___2atro .card__badgeWrapper___2Za97 > span {
                border-top-left-radius: 8px !important;
            }

.card__card___2atro:nth-child(1) .card__cardButton___1hzcC {
            min-width: 112px;
        }

.card__card___2atro:nth-child(2) .card__cardButton___1hzcC {
            min-width: 92px;
        }

.card__card___2atro:nth-child(3) .card__cardButton___1hzcC {
            min-width: 149px;
        }

.card__card2Col___3Wrze {

        width: 50%;
    }

.card__card3Col___3U7hH {

        width: 33.33333%;
    }

.card__cardImage___2KDQl {
        width: 100%;
    }

.card__cardTitle___2gGEY {
        color: #0f0f0f;
        font-size: 20px;
        line-height: 1.2;
        font-weight: 700;
        font-family: Roboto, Arial, sans-serif;
        margin: 24px 0 12px;
    }

.card__cardInfo___3fy4k {
        color: #0f0f0f;
        font-size: 14px;
        line-height: 1.6;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0 0 27px;
        text-align: center;
    }

@media (max-width: 1279.9px) {

.card__cardInfo___3fy4k {
            margin: 0 40px 27px
    }
        }

/**
 * 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" */

.homeWhyGlassesUSA__container___1BlGH {
        max-width: 2000px;
        height: 509px;
        overflow: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin: 0 auto;
        background-image: url(https://optimaxweb.glassesusa.com/image/upload/f_auto,q_auto/img/a66ae9b572624eb2132e6b49be5a4264.jpg);
        background-position: center;
    }

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

.homeWhyGlassesUSA__container___1BlGH {
            background-position-x: calc(50% - 70px);
            background-position-y: center
    }
        }

@media (max-width: 1279.9px) {

.homeWhyGlassesUSA__container___1BlGH {
            background-position-x: calc(50% - 100px);
            background-position-y: center;
            background-size: auto 100%
    }
        }

.homeWhyGlassesUSA__wrapper___demI4 {
        position: absolute;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        width: 1300px;
        margin: 0 auto;
        padding: 28px 0;
    }

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

.homeWhyGlassesUSA__wrapper___demI4 {
            width: 1165px
    }
        }

@media (max-width: 1279.9px) {

.homeWhyGlassesUSA__wrapper___demI4 {
            width: 929px
    }
        }

.homeWhyGlassesUSA__contentWrapper___zEJ6N {
        width: 410px;
        background-color: #fff;
        -webkit-box-shadow: 0 1px 4px 0 rgba(58, 72, 80, .07), 0 10px 15px 0 rgba(176, 189, 197, .16);
                box-shadow: 0 1px 4px 0 rgba(58, 72, 80, .07), 0 10px 15px 0 rgba(176, 189, 197, .16);
        border: 1px solid #f1f1f1;
        border-radius: 12px;
    }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__titleWrapper___1UhaA {
            width: 100%;
            padding: 28px 40px 22px;
            border-bottom: 1px solid #e7ebed;
        }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__title___3jjRR {
            color: #2196f3;
            font-size: 24px;
            line-height: 1.17;
            font-weight: 700;
            font-family: Roboto, Arial, sans-serif;
            margin: 0;
        }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            padding: 36px 40px 28px;
        }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__item___JRBYD {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                margin-bottom: 32px;
            }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__item___JRBYD:last-child {
                    margin-bottom: 36px;
                }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__iconWrapper___t1VBy {
                width: 43px;
                height: 43px;
                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;
                margin-right: 28px;
            }

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

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__itemTitle___3d2_4 {
                color: #0f0f0f;
                font-size: 18px;
                line-height: 1.17;
                font-weight: 400;
                font-family: Roboto, Arial, sans-serif;
                margin: 0 0 6px;
            }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__itemSubtitle___KhsmB {
                color: #5b6971;
                font-size: 14px;
                line-height: 1.14;
                font-weight: 300;
                font-family: Roboto, Arial, sans-serif;
                margin: 0;
            }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__rating___2nLbS {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: justify;
                    -ms-flex-pack: justify;
                        justify-content: space-between;
                -webkit-box-align: end;
                    -ms-flex-align: end;
                        align-items: flex-end;
                padding: 16px 50px 0 46px;
            }

.homeWhyGlassesUSA__contentWrapper___zEJ6N .homeWhyGlassesUSA__content___kEa4e .homeWhyGlassesUSA__ratingText___1eybq {
                color: #5b6971;
                font-size: 14px;
                line-height: 1.14;
                font-weight: 300;
                font-family: 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" */

.homeAsFeaturedIn__wrapper___1hf1F {
        max-width: 1300px;
        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;
        margin: 80px auto 0;
        padding: 0 0 80px;
        border-bottom: 1px solid #f1f1f1;
    }

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

.homeAsFeaturedIn__wrapper___1hf1F {
            max-width: 1164px
    }
        }

@media (max-width: 1279.9px) {

.homeAsFeaturedIn__wrapper___1hf1F {
            max-width: 930px
    }
        }

.homeAsFeaturedIn__title___SoVCh {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0 0 60px;
    }

.homeAsFeaturedIn__list___3yD9m {
        width: 100%;
        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;
        margin: 0;
        padding: 0 10px;
    }

@media (max-width: 1279.9px) {

.homeAsFeaturedIn__list___3yD9m {
            padding: 0 8px
    }

            .homeAsFeaturedIn__list___3yD9m .homeAsFeaturedIn__listItem___2cWZJ:last-child {
                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" */

.homeOurLensesAndCoatings__wrapper___112GW {
        max-width: 1300px;
        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;
        margin: 80px auto 0;
        padding: 0 0 60px;
        border-bottom: 1px solid #f1f1f1;
    }

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

.homeOurLensesAndCoatings__wrapper___112GW {
            max-width: 1164px
    }
        }

@media (max-width: 1279.9px) {

.homeOurLensesAndCoatings__wrapper___112GW {
            max-width: 931px
    }
        }

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

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

.homeOurLensesAndCoatings__cardsWrapper___2fUKa {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 100%;
    }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP {
            width: 50%;
            position: relative;
            overflow: hidden;
            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;
            background-color: #fff;
            border: 1px solid #f1f1f1;
            -webkit-box-shadow: 0 1px 0 0 rgba(58, 72, 80, .2), 1px 2px 11px -1px rgba(176, 189, 197, .16);
                    box-shadow: 0 1px 0 0 rgba(58, 72, 80, .2), 1px 2px 11px -1px rgba(176, 189, 197, .16);
            border-radius: 12px;
            padding: 0 0 24px;
            -webkit-transition: -webkit-box-shadow .3s;
            transition: -webkit-box-shadow .3s;
            transition: box-shadow .3s;
            transition: box-shadow .3s, -webkit-box-shadow .3s;
        }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP:first-child {
                margin-right: 36px;
            }

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

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP:first-child {
                    margin-right: 25px
            }
                }

@media (max-width: 1279.9px) {

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP:first-child {
                    margin-right: 25px
            }
                }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP:hover {
                -webkit-box-shadow: 0 1px 3px 0 rgba(58, 72, 80, 0.07), 0 8px 14px 0 rgba(176, 189, 197, 0.1), 0 2px 8px 1px rgba(137, 149, 156, 0.05);
                        box-shadow: 0 1px 3px 0 rgba(58, 72, 80, 0.07), 0 8px 14px 0 rgba(176, 189, 197, 0.1), 0 2px 8px 1px rgba(137, 149, 156, 0.05);
            }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP .homeOurLensesAndCoatings__cardImage___1FVJN {
                position: absolute;
                top: 0;
                height: 230px;
            }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP .homeOurLensesAndCoatings__cardImageStickyLeft___2JV9l {
                left: 0;
            }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP .homeOurLensesAndCoatings__cardTitle___1VutZ {
                color: #0f0f0f;
                font-size: 20px;
                line-height: 1.2;
                font-weight: 700;
                font-family: Roboto, Arial, sans-serif;
                margin: 254px 0 12px;
            }

.homeOurLensesAndCoatings__cardsWrapper___2fUKa .homeOurLensesAndCoatings__card___1sDlP .homeOurLensesAndCoatings__cardInfo___2Unaj {
                color: #3a4850;
                font-size: 14px;
                line-height: 1.14;
                font-weight: 300;
                font-family: 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" */

.homeDiscoverMore__wrapper___jOXgB {
        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;
        padding: 80px 0;
    }

.homeDiscoverMore__title___H2hvd {
        color: #0f0f0f;
        font-size: 28px;
        line-height: 1.18;
        font-weight: 300;
        font-family: Roboto, Arial, sans-serif;
        margin: 0 0 60px;
    }

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

.homeDiscoverMore__button___341p-:not(:last-child) {
        margin-right: 8px;
    }

.home__wrap___1tiP2 {
        font-size: 100%;
        margin: 0 auto;
        width: 930px;
        padding-top: 25px;
    }
    .home__subMessage___3BGR- {
        border: 1px solid #197b30;
        color: #197b30;
        min-height: 23px;
        margin: 0 0 1em;
        padding: 8px 8px 8px 32px;
        font-size: .95em;
    }


/*# sourceMappingURL=HomeRedesign.658f14cd6cc861c366b7.css.map*/