.shop-by-shade-banner{margin:1.875rem 0}.shop-by-shade-banner .flex{align-items:center;padding:2.5rem 3.125rem}.shop-by-shade-banner .flex .col{width:40%;min-width:40%}.shop-by-shade-banner .flex .button-col{width:60%;display:flex}.shop-by-shade-banner .flex .button-col .group-selectors{display:flex;flex-direction:column;width:6.25rem;min-width:6.25rem;align-items:flex-start;position:relative;z-index:0;gap:.125rem}.shop-by-shade-banner .flex .button-col .group-selectors a{font-family:var(--termina);text-transform:uppercase;font-weight:700;padding:.4375rem .625rem;text-decoration:none;color:#000;line-height:1;font-size:.625rem;letter-spacing:.0625rem;display:inline-block;border-radius:.25rem;position:relative;transition:.2s all}.shop-by-shade-banner .flex .button-col .group-selectors a:before{content:"";position:absolute;top:50%;left:0;width:0;height:.0625rem;background:#000;opacity:0;z-index:-1;transition-delay:0s;transition:0s}.shop-by-shade-banner .flex .button-col .group-selectors a.active{background:#000;color:#fff}.shop-by-shade-banner .flex .button-col .group-selectors a.active:before{opacity:1;width:6.25rem;transition:.3s all;transition-delay:.1s}.shop-by-shade-banner .flex .button-col .swatch-selectors{width:calc(100% - 6.25rem);background:#fff;min-height:6.25rem;border:.0625rem solid #000;border-radius:.25rem;display:flex;gap:.625rem;padding:1.375rem 1.25rem;overflow:scroll;overflow-y:hidden}.shop-by-shade-banner .flex .button-col .swatch-selectors::-webkit-scrollbar{width:6px;height:6px;padding:0}.shop-by-shade-banner .flex .button-col .swatch-selectors::-webkit-scrollbar-track{box-shadow:inset 0 0 1px gray;border-radius:0}.shop-by-shade-banner .flex .button-col .swatch-selectors::-webkit-scrollbar-thumb{background:#c64771;border-radius:100px}.shop-by-shade-banner .flex .button-col .swatch-selectors::-webkit-scrollbar-thumb:hover{background:#c64771}.shop-by-shade-banner .flex .button-col .swatch-selectors .item{width:4.375rem;min-width:4.375rem;text-align:center;display:none;cursor:pointer}.shop-by-shade-banner .flex .button-col .swatch-selectors .item .img{width:100%;padding-top:100%;overflow:hidden;border-radius:.25rem;position:relative}.shop-by-shade-banner .flex .button-col .swatch-selectors .item .img img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.shop-by-shade-banner .flex .button-col .swatch-selectors .item.active .img:after,.shop-by-shade-banner .flex .button-col .swatch-selectors .item.active .img:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:.125rem;border:.125rem solid var(--pink);z-index:2}.shop-by-shade-banner .flex .button-col .swatch-selectors .item.active .img:before{border-color:#fff;top:.125rem;left:.125rem;width:calc(100% - .25rem);height:calc(100% - .25rem)}.shop-by-shade-banner .flex .button-col .swatch-selectors .item p{margin:.375rem 0 0;font-size:.625rem;line-height:1.4}.main-shop-by-shade .product-grid{display:flex;flex-wrap:wrap}.main-shop-by-shade .product-grid .item{width:20%;padding:0 .3125rem 2.5rem}.main-shop-by-shade .product-grid .item.null{display:none}@media screen and (max-width: 990px){.main-shop-by-shade .product-grid .item{width:33.3%}}@media screen and (max-width: 750px){.main-shop-by-shade .product-grid .item{width:50%}}.main-shop-by-shade .product-grid .item.unavailable{order:1000}.main-shop-by-shade .product-grid .item .shade-card{text-align:center;cursor:pointer}.main-shop-by-shade .product-grid .item .shade-card .v_media{width:100%;margin-bottom:.625rem;border-radius:.25rem;overflow:hidden;background:#000;position:relative}.main-shop-by-shade .product-grid .item .shade-card .v_media .lazy-load{background-color:var(--grey-light);display:block;width:100%;aspect-ratio:3/4;transition:opacity .3s ease}.main-shop-by-shade .product-grid .item.unavailable .shade-card .v_media{background:#fff}.main-shop-by-shade .product-grid .item.unavailable .shade-card .v_media img,.main-shop-by-shade .product-grid .item.unavailable .shade-card .p_title,.main-shop-by-shade .product-grid .item.unavailable .shade-card .v_price,.main-shop-by-shade .product-grid .item.unavailable .shade-card .jdgm-preview-badge{opacity:.2}.main-shop-by-shade .product-grid .item:not(.unavailable) .shade-card .v_media:hover img{opacity:.3}.main-shop-by-shade .product-grid .item .shade-card .v_media img{width:100%;height:auto;display:block;transition:.3s opacity}.main-shop-by-shade .product-grid .item .shade-card .v_media .quick-buy-btn,.main-shop-by-shade .product-grid .item .shade-card .v_media .unavailable-btn{background:#fff;color:#000;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:calc(100% - 3.75rem);padding:.625rem;font-family:var(--termina);text-transform:uppercase;font-weight:700;text-decoration:none;line-height:1;latter-spacing:.5px;font-size:.625rem;border-radius:.25rem;opacity:0;transition:.3s opacity}.main-shop-by-shade .product-grid .item .shade-card .v_media .unavailable-btn{padding:0;background:none;opacity:1}.main-shop-by-shade .product-grid .item:not(.unavailable) .shade-card .v_media:hover .quick-buy-btn{opacity:1}.main-shop-by-shade .product-grid .item .shade-card .p_title{margin:.625rem 0;line-height:1.4}.main-shop-by-shade .product-grid .item .shade-card .v_price{margin:0;font-weight:700;font-family:var(--termina);font-size:.75rem}#variant_modal_wrapper{position:fixed;z-index:9999999;top:0;left:0;width:100%;height:100%;background:#0009;display:none}#variant_modal_wrapper .inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;max-width:68.75rem;width:100%;height:40.625rem;max-height:80vh;border-radius:.625rem;display:flex;overflow:hidden}#variant_modal_wrapper .inner .media-col{width:40%;background:#eee;position:relative}#variant_modal_wrapper .inner .media-col:before{content:"";position:absolute;z-index:0;top:50%;left:50%;width:6.25rem;height:6.25rem;background:url(icon-loading.svg) no-repeat center center / contain;transform:translate(-50%,-50%)}#variant_modal_wrapper .inner .media-col .slick-list{z-index:1;height:100%}#variant_modal_wrapper .inner .media-col .slick-track{height:100%}#variant_modal_wrapper .inner .media-col .item{width:100%;height:100%}#variant_modal_wrapper .inner .media-col .item img{width:100%;height:100%;object-fit:cover}#variant_modal_wrapper .inner .media-col .slick-arrow{position:absolute;z-index:2;bottom:1.25rem;right:1.25rem;width:2.5rem;height:2.5rem;background-color:#fff;background-size:1.125rem;background-repeat:no-repeat;background-position:center center;font-size:0;text-indent:-624.938rem;border:none;overflow:hidden;transition:.3s background-color}#variant_modal_wrapper .inner .media-col .slick-arrow.slick-disabled{background-color:#ffffff4d}#variant_modal_wrapper .inner .media-col .slick-arrow.slick-next{background-image:url(icon-arrow-right.svg);border-radius:0 .375rem .375rem 0}#variant_modal_wrapper .inner .media-col .slick-arrow.slick-prev{background-image:url(icon-arrow-left.svg);border-radius:.375rem 0 0 .375rem;right:3.75rem}#variant_modal_wrapper .inner .content-col{width:60%;padding:2.8125rem 2.5rem;position:relative;max-height:100%;overflow:scroll}#variant_modal_wrapper .inner .content-col .icon-close{position:absolute;top:1.875rem;right:1.875rem;width:1.625rem;height:1.625rem;background:url(icon-close.svg) no-repeat center center / contain;display:block}#variant_modal_wrapper .inner .content-col .p_title{text-transform:uppercase;font-weight:700;padding-right:2.5rem}#variant_modal_wrapper .inner .content-col .colour-shade{font-size:.75rem;margin:0 0 .875rem}#variant_modal_wrapper .inner .content-col .review-widget{margin:0 0 .875rem}#variant_modal_wrapper .inner .content-col .usps{margin:0 0 1.875rem}#variant_modal_wrapper .inner .content-col .usps p{margin:0 0 .25rem;padding-left:1.75rem;position:relative;font-size:.875rem}#variant_modal_wrapper .inner .content-col .usps p:before{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%);width:1.125rem;height:1.125rem;border-radius:.25rem;background:url(icon-check-white.svg) no-repeat center center / .75rem var(--pink)}#variant_modal_wrapper .inner .content-col .btn-flex .button.disabled{pointer-events:none}#variant_modal_wrapper .inner .content-col .clearpay{text-align:center;margin:.75rem 0 0}#variant_modal_wrapper .inner .content-col .clearpay p{margin:0 0 .25rem;font-size:.75rem}#variant_modal_wrapper .inner .content-col .clearpay img{max-width:5rem}#variant_modal_wrapper .inner .content-col .product-link{text-align:center;margin:0}#variant_modal_wrapper .inner .content-col .product-link a{font-size:.75rem;color:var(--pink);text-decoration:underline;font-weight:600;letter-spacing:0}#variant_modal_wrapper .inner .content-col .product-data-accordion{border:.0625rem solid var(--grey-mid);border-radius:.5rem;overflow:hidden;margin:1.5rem 0 0}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item:last-child .accordion--title{border-bottom:none}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--title{padding:1.25rem 1.5rem;background:var(--grey-light);text-transform:uppercase;font-weight:700;font-family:var(--termina);font-size:.625rem;line-height:.75rem;margin:0;border-bottom:.0625rem solid var(--grey-mid);position:relative;cursor:pointer}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--title:before,#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--title:after{content:"";position:absolute;top:50%;right:1.25rem;width:1.25rem;height:.0625rem;background:var(--black);transform:translateY(-50%)}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--title:after{transform:translateY(-50%) rotate(90deg);transition:.3s opacity}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--title.active:after{opacity:0}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output{display:none;padding:1rem;border-bottom:.0625rem solid var(--grey-mid)}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item:last-child .accordion--output{border-bottom:none}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output ol,#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output ul{padding:0 0 1rem}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output p,#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output li{font-size:.75rem;line-height:1.3125rem}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output li{list-style:none;position:relative}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output li:before{content:"\2022";color:var(--pink);margin-right:.25rem}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output p:last-child{margin-bottom:0}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output a{text-decoration:underline;font-weight:700;transition:.3s color}#variant_modal_wrapper .inner .content-col .product-data-accordion .accordion--item .accordion--output a:hover{color:var(--pink)}@media screen and (max-width: 990px){.shop-by-shade-banner{margin-top:0}.shop-by-shade-banner .flex .col{width:100%;min-width:100%}.shop-by-shade-banner .flex .button-col{width:100%;flex-wrap:wrap}.shop-by-shade-banner .flex .button-col .group-selectors{flex-direction:row;justify-content:center;width:100%;min-width:100%;margin:0 0 .625rem}.shop-by-shade-banner .flex .button-col .group-selectors a:before{display:none}.shop-by-shade-banner .flex .button-col .swatch-selectors{width:100%}}@media screen and (max-width: 750px){.shop-by-shade-banner .flex{padding:1.25rem}.shop-by-shade-banner .flex .button-col .swatch-selectors{margin:0 -1.875rem;width:calc(100% + 3.75rem);padding:.75rem;border-radius:0;border-left:none;border-right:none}#variant_modal_wrapper .inner{top:.625rem;left:50%;transform:translate(-50%);max-width:calc(100% - 1.25rem);width:100%;height:100%;max-height:calc(100% - 1.25rem);flex-wrap:wrap;overflow:scroll}#variant_modal_wrapper .inner .content-col .icon-close{right:1.25rem;background-size:1.125rem}#variant_modal_wrapper .inner .media-col{width:100%}#variant_modal_wrapper .inner .content-col{width:100%;padding:1.875rem 1.25rem;overflow:unset;max-height:unset}}
/*# sourceMappingURL=/cdn/shop/t/125/assets/main-shop-by-shade.css.map */
