/*
 * Product listing (category.aspx) styles.
 * Extracted verbatim from inline <style> blocks for browser caching.
 * Order preserved: head styles, then FAQ section, then cart/.Added styles.
 * NOTE: the PriceDropPlaceHolder (Visible="false") <style> is intentionally
 * left inline since it renders conditionally with its markup.
 * See docs/product-listing-page-asset-extraction-plan.md
 */

h2, h3 {
    margin: 0;
}

.SubSectionName {
    text-transform: uppercase;
}

.CategoryProductReward {
    cursor: pointer;
}

.RewardPop {
    display: none;
    width: 624px;
    height: 145px;
    padding: 45px 88px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 10002;
    background: #fff;
    position: fixed;
    text-align: left;
}

.HorizontalMenu {
    top: 217px;
    transition: top 0.3s;
    position: sticky;
}

.PremadeFanBannerCopyContainer {
    position: absolute;
    transform: translate(-50%,-50%);
    top: 48%;
    left: 67.7%;
    color: #fff;
    width: 19.153%;
}

.SubHeader {
    font-size: 0.5208vw;
    line-height: 2.4em;
    letter-spacing: 0.127em;
    font-family: "Lato Bold";
    text-align: left;
}

.PremadeFanBannerCopyContainer h3 {
    font-family: "Times Sans Serif";
    font-size: 1.5625vw;
    line-height: 1.1333em;
    letter-spacing: normal;
    color: #fff;
    text-align: left;
}

.PremadeFanBannerBodyCopy {
    font-size: 0.73vw;
    line-height: 1.357em;
    letter-spacing: 0.0357em;
    text-align: left;
}

.PremadeFanBannerButtonContainer {
    font-size: 0.5208vw;
    padding-top: 2.5em;
    text-align: left;
}

.PremadeFanBannerButton {
    font-size: 0.625vw;
    letter-spacing: 0.08333em;
    width: 17.917em;
    height: 2.5em;
    background-color: #fff;
    color: #000;
    cursor: pointer;
    border-radius: 50px !important;
    border: none;
    font-family: "Lato Bold";
}

.LashBannerHeader {
    letter-spacing: 0.018em;
}

    .LashBannerHeader sup {
        font-size: 22%;
        position: relative;
        top: -0.7em;
    }

.GridBlock .BlockCopy {
    min-height: 13em;
}

.LashBannerLink {
    font-family: "Lato Bold";
}

.OverlayImage {
    position: absolute;
    top: 0;
    left: 0;
}

.CategoryProductImage .OOOTag {
    width: unset;
}

.Previous {
    transform: rotate(180deg)
}

.Previous, .Next {
    width: 12px;
    padding: 5px;
    background: #fff !important;
    border-radius: 5px;
}

.slick-prev {
    top: calc(50% - 10px);
    z-index: 1;
    left: 0
}

.slick-next {
    right: 0
}

.slick-dotted.slick-slider {
    margin-bottom: 25px;
}

.slick-dots li {
    margin: 0 3.5px !important;
    width: 10px;
    height: 20px;
}

    .slick-dots li button::before {
        font-size: 8px;
    }

.CategoryProductPrice {
    font-size: 14px;
    letter-spacing: 0.0714em;
}

@media (min-width: 1920px) {
    .SubHeader {
        font-size: 10px;
    }

    .PremadeFanBannerCopyContainer h3 {
        font-size: 30px;
    }

    .PremadeFanBannerBodyCopy {
        font-size: 14px;
    }

    .PremadeFanBannerButtonContainer {
        padding-top: 25px;
    }

    .PremadeFanBannerButton {
        font-size: 12px;
    }
}

@media (max-width: 1024px) {
    .HorizontalMenu {
        top: 121px;
    }

        .HorizontalMenu.retailsite {
            top: 65px;
        }
}

.PurpleDotDiv {
    display: flex;
    font-size: 10px;
    margin-bottom: 10px;
    align-items: center;
}

.PurpleDot {
    height: 18px;
    width: 18px;
    background-color: #733BDE;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
}

.activeSection {
    background-color: yellow;
}

@media (max-width: 768px) {
    .RewardPop {
        width: 250px;
        height: 287px;
        height: fit-content;
        height: -moz-fit-content;
        padding: 30px 25px;
    }

    .LashBannerHeader {
        letter-spacing: 0.5px;
        margin-left: -4px;
    }

    .GridBlock .BlockCopy {
        min-height: unset;
    }

    .HeaderLinksHorizontalMenu {
        display: none;
    }

    .CategoryProductPrice {
        font-size: 11px;
    }

    .PremadeFanBannerCopyContainer {
        position: relative;
        top: unset;
        left: unset;
        transform: none;
        color: #000;
        width: unset;
        padding: 30px 10px;
    }

    .SubHeader {
        font-size: 10px;
    }

    .PremadeFanBannerCopyContainer h3 {
        font-size: 30px;
        color: #000;
    }

    .PremadeFanBannerBodyCopy {
        font-size: 14px;
    }

    .PremadeFanBannerButtonContainer {
        padding-top: 20px;
    }

    .PremadeFanBannerButton {
        font-size: 12px;
        background-color: #000;
        color: #fff;
    }

    .PurpleDotDiv {
        font-size: 8px;
        margin-bottom: 5px;
    }

    .PurpleDot {
        height: 10px;
        width: 10px;
    }
}

/*Without Header Anchor Links*/
/*@media (max-width: 768px) {
            a:target {
                top: -158px !important;
            }
        }*/

/*With Header Anchor Links*/
a:target {
    top: -222px !important;
}

@media(max-width: 768px) {
    a:target {
        top: -105px !important;
    }

    .DesktopHomeOnly {
        display: none !important
    }
}
/*.HorizontalMenu {
            top: 172px;
        }

        @media(max-width: 1024px) {
            .HorizontalMenu {
                top: 107px;
            }
        }*/

@media(min-width:769px) {
    .mobileHomeOnly {
        display: none !important
    }
}

/* --- FAQ section (was inline in body) --- */
.AdditionalInfoBar {
    font-family: 'Lato Bold', Arial;
    text-transform: uppercase;
    font-size: 20px;
    line-height: 23px;
    letter-spacing: 3px;
    cursor: pointer;
    padding: 22px 35px 17px 0;
    position: relative;
}

.AboutProductText, .DropDownText {
    font-size: 15px;
    line-height: 30px;
    letter-spacing: .02px;
    text-align: justify;
    padding-bottom: 33px;
}

.DropDownText {
    font-size: 18px;
    display: none;
}

    .DropDownText ul li {
        margin-left: 30px;
    }

.InfoPlus {
    width: 19px;
    display: block;
    position: absolute;
    right: 20px;
    top: calc(50% - 8px);
}

.InfoMinus {
    width: 19px;
    padding-top: 8px;
    position: absolute;
    right: 20px;
    top: calc(50% - 8px);
    display: none;
}

@media(max-width:768px) {
    .AdditionalInfoBar, .DropDownText, .AdditionalInfoBar h3 {
        font-size: 14px;
    }

    .AdditionalInfoBar {
        line-height: 16px;
        letter-spacing: 2px;
        padding: 17px 20px 12px 15px;
    }

    .InfoPlus {
        width: 10px;
        top: calc(50% - 2px);
        right: 10px;
    }

    .InfoMinus {
        width: 10px;
        top: calc(50% - 6px);
        right: 10px;
    }

    .AboutProductText, .DropDownText {
        letter-spacing: .01px;
        text-align: left;
    }
}

/* --- .Added / cart styles (was inline in body) --- */
.Added {
    font-family: Lato;
    text-transform: none;
    letter-spacing: normal;
    padding-bottom: 17px !important
}

    .Added hr {
        border: 1px solid #979797
    }

.closeX {
    top: 0;
    right: 0;
    font-size: 30px;
    line-height: 0;
    padding: 17px 10px;
    cursor: pointer;
    text-align: right;
    position: initial;
}

.XtremeRewardsTitle {
    font-family: "Times Sans Serif";
    font-size: 25px;
    line-height: 28px;
    letter-spacing: .7px;
    padding-top: 20px;
    padding-bottom: 10px;
    text-transform: uppercase
}

.XtremeRewardsTable {
    max-width: 950px;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 30px;
    border-spacing: 0
}

    .XtremeRewardsTable td {
        border-bottom: 1px solid #d8d8d8;
        border-right: 1px solid #d8d8d8;
        padding: 5px 5px;
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 1px
    }

    .XtremeRewardsTable tr td:first-child {
        border-left: 1px solid #d8d8d8
    }

    .XtremeRewardsTable tr.altRow td {
        background-color: #f6f6f6
    }

    .XtremeRewardsTable td div {
        max-width: 220px;
        margin: 0 auto
    }

    .XtremeRewardsTable .XtremeRewardsTableRow td:first-child {
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 1.8px;
        text-align: center;
        background-color: #cde2e6;
        border: 1px solid #cde2e6;
        border-right: 1px solid #b3d1d7
    }

    .XtremeRewardsTable .XtremeRewardsTableRow td:last-child {
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 1.8px;
        text-align: center;
        background-color: #b3d1d7;
        border: 1px solid #b3d1d7
    }

    .XtremeRewardsTable .AddlBen {
        font-family: "Lato Bold"
    }

    .XtremeRewardsTable .XtremeRewardsTableRow td:first-child {
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 1.8px;
        text-align: center;
        background-color: #cde2e6;
        border: 1px solid #cde2e6;
        border-right: 1px solid #b3d1d7
    }

    .XtremeRewardsTable .XtremeRewardsTableRow td:last-child {
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 1.8px;
        text-align: center;
        background-color: #b3d1d7;
        border: 1px solid #b3d1d7
    }

    .XtremeRewardsTable .AddlBen {
        font-family: "Lato Bold"
    }

.XtremeRewardsTitle {
    font-family: "Times Sans Serif";
    font-size: 25px;
    line-height: 28px;
    letter-spacing: .7px;
    padding-top: 20px;
    padding-bottom: 10px;
    text-transform: uppercase
}

.XtremeRewardsText {
    max-width: 845px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
    line-height: 24px;
    font-size: 16px;
    letter-spacing: .9px
}

    .XtremeRewardsText span, .XtremeRewardsText a {
        font-family: "Lato Bold";
        color: #e2748f
    }

.LoyaltyTable tr.altRow td {
    background-color: #f6f6f6
}

.YourPriceXRNotLoggedInProCatPop {
    display: none;
    height: 90vh;
    max-height: 575px;
    max-width: 800px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    overflow: auto;
    background-color: #fff;
    z-index: 10002
}

    .YourPriceXRNotLoggedInProCatPop::-webkit-scrollbar {
        width: 12px !important;
        -webkit-overflow-scrolling: Auto
    }

    .YourPriceXRNotLoggedInProCatPop::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3) !important
    }

    .YourPriceXRNotLoggedInProCatPop::-webkit-scrollbar-thumb {
        background: #a4a4a4 !important
    }

        .YourPriceXRNotLoggedInProCatPop::-webkit-scrollbar-thumb:window-inactive {
            background: #a4a4a4 !important
        }

.YourPriceXRNotLoggedInAfterCareCatPop {
    display: none;
    height: 90vh;
    max-height: 300px;
    max-width: 500px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    overflow: auto;
    background-color: #fff;
    z-index: 10002
}

    .YourPriceXRNotLoggedInAfterCareCatPop::-webkit-scrollbar {
        width: 12px !important;
        -webkit-overflow-scrolling: Auto
    }

    .YourPriceXRNotLoggedInAfterCareCatPop::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3) !important
    }

    .YourPriceXRNotLoggedInAfterCareCatPop::-webkit-scrollbar-thumb {
        background: #a4a4a4 !important
    }

        .YourPriceXRNotLoggedInAfterCareCatPop::-webkit-scrollbar-thumb:window-inactive {
            background: #a4a4a4 !important
        }

.LashistaPricePop {
    display: none;
    height: 90vh;
    max-height: 770px;
    max-width: 1300px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    overflow: auto;
    background-color: #fff;
    z-index: 10002;
    height: max-content;
}

    .LashistaPricePop::-webkit-scrollbar {
        width: 12px !important;
        -webkit-overflow-scrolling: Auto
    }

    .LashistaPricePop::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3) !important
    }

    .LashistaPricePop::-webkit-scrollbar-thumb {
        background: #a4a4a4 !important
    }

        .LashistaPricePop::-webkit-scrollbar-thumb:window-inactive {
            background: #a4a4a4 !important
        }

.LoyaltyTitle {
    font-family: "Times Sans Serif";
    font-size: 25px;
    line-height: 28px;
    letter-spacing: .7px;
    padding-top: 20px;
    padding-bottom: 10px;
    text-transform: uppercase
}

.LoyaltyText {
    max-width: 845px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
    line-height: 24px;
    font-size: 16px;
    letter-spacing: .9px
}

    .LoyaltyText span, .LoyaltyText a {
        font-family: "Lato Bold";
        color: #e2748f
    }

.popup_close {
    width: 210px;
    height: 26px;
    background-color: #fff;
    color: #000;
    font-family: 'Lato Bold',Arial;
    font-size: 10px;
    letter-spacing: 2.14px;
    text-align: center;
    border: 1px solid #000;
    cursor: pointer;
    display: inline-block;
}

    .popup_close.inverse {
        background-color: #000 !important;
        color: #fff !important;
    }

.inverse {
    background-color: #fff !important;
    color: #000 !important;
    border: 1px solid #000;
    margin-top: 15px;
}

@media(max-width:767px) {
    .YourPriceXRNotLoggedInProCatPop {
        height: fit-content;
    }

    .YourPriceXRNotLoggedInAfterCareCatPop {
        height: fit-content;
    }
}