/** Shopify CDN: Minification failed Line 8930:96 Expected identifier but found whitespace Line 8946:96 Expected identifier but found whitespace Line 26372:4 Expected ":" **/ @charset "UTF-8"; /*============================================================================ Palo Alto | Built with Skate - You cannot use native CSS/Sass @imports in this file without a build script ==============================================================================*/ /*================ VARIABLES ================*/ /* ============================================================================ #Colors --STATIC vars are uppercased --dynamic vars are lowercased A static var is set in theme settings and doesn't change in any context A dynamic var is context dependent and can be overwritten by its wrapper This file is primarily concerned with setting the values of dynamic color variables depending on which container the text or background is inside. ============================================================================== */ :root { --bg: var(--COLOR-BG); --bg-alpha-25: var(--COLOR-BG-ALPHA-25); --bg-alpha-35: var(--COLOR-BG-ALPHA-35); --bg-alpha-60: var(--COLOR-BG-ALPHA-60); --bg-darken: var(--COLOR-BG-DARKEN); --bg-lighten-darken: var(--COLOR-BG-LIGHTEN-DARKEN); --bg-lighten-darken-contrast: var(--COLOR-BG-LIGHTEN-DARKEN-CONTRAST); --bg-overlay: var(--COLOR-BG-OVERLAY); --bg-secondary: var(--COLOR-BG-SECONDARY); --bg-secondary-lighten-darken: var(--COLOR-BG-SECONDARY-LIGHTEN-DARKEN); --bg-secondary-lighten-darken-contrast: var(--COLOR-BG-SECONDARY-LIGHTEN-DARKEN-CONTRAST); --bg-accent: var(--COLOR-BG-ACCENT); --bg-accent-lighten: var(--COLOR-BG-ACCENT-LIGHTEN); --text: var(--COLOR-TEXT); --text-darken: var(--COLOR-TEXT-DARKEN); --text-lighten: var(--COLOR-TEXT-LIGHTEN); --text-alpha-5: var(--COLOR-TEXT-ALPHA-5); --text-alpha-8: var(--COLOR-TEXT-ALPHA-8); --text-alpha-10: var(--COLOR-TEXT-ALPHA-10); --text-alpha-15: var(--COLOR-TEXT-ALPHA-15); --text-alpha-25: var(--COLOR-TEXT-ALPHA-25); --text-alpha-50: var(--COLOR-TEXT-ALPHA-50); --text-alpha-60: var(--COLOR-TEXT-ALPHA-60); --text-alpha-85: var(--COLOR-TEXT-ALPHA-85); --heading: var(--COLOR-HEADING); --accent: var(--COLOR-ACCENT); --accent-text: var(--COLOR-ACCENT-TEXT); --sale-bg: var(--COLOR-SALE-BG); --sale-text: var(--COLOR-SALE-TEXT); --custom-bg: var(--COLOR-CUSTOM-BG); --custom-text: var(--COLOR-CUSTOM-TEXT); --sold-bg: var(--COLOR-SOLD-BG); --sold-text: var(--COLOR-SOLD-TEXT); --saving-bg: var(--COLOR-SAVING-BG); --saving-text: var(--COLOR-SAVING-TEXT); --input-bg: var(--COLOR-INPUT-BG); --border: var(--COLOR-BORDER); --border-alpha-15: var(--COLOR-BORDER-ALPHA-15); --border-alpha-30: var(--COLOR-BORDER-ALPHA-30); --border-alpha-50: var(--COLOR-BORDER-ALPHA-50); --border-alpha-65: var(--COLOR-BORDER-ALPHA-65); --border-lighten-darken: var(--COLOR-BORDER-LIGHTEN-DARKEN); --hairline: var(--COLOR-BORDER-HAIRLINE); --error: var(--COLOR-ERROR); --error-bg: var(--COLOR-ERROR-BG); --success: var(--COLOR-SUCCESS); --success-bg: var(--COLOR-SUCCESS-BG); --disabled-grey: var(--COLOR-DISABLED-GREY); --disabled-grey-darken: var(--COLOR-DISABLED-GREY-DARKEN); --white: var(--COLOR-WHITE); --white-darken: var(--COLOR-WHITE-DARKEN); --white-alpha-10: var(--COLOR-WHITE-ALPHA-10); --white-alpha-25: var(--COLOR-WHITE-ALPHA-25); --white-alpha-50: var(--COLOR-WHITE-ALPHA-50); --white-alpha-60: var(--COLOR-WHITE-ALPHA-60); --black: var(--COLOR-BLACK); --black-lighten: var(--COLOR-BLACK-LIGHTEN); --black-alpha-10: var(--COLOR-BLACK-ALPHA-10); --black-alpha-20: var(--COLOR-BLACK-ALPHA-20); --black-alpha-25: var(--COLOR-BLACK-ALPHA-25); --black-alpha-50: var(--COLOR-BLACK-ALPHA-50); --black-alpha-60: var(--COLOR-BLACK-ALPHA-60); } /*============================================================================ #Breakpoint and Grid Variables ==============================================================================*/ /*================ TOOLS ================*/ /*================ Media Query Mixin ================*/ /*============================================================================ Prefixer mixin for generating vendor prefixes: - Based on https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/addons/_prefixer.scss - Usage: // Input: .element { @include prefixer(transform, scale(1), ms webkit spec); } // Output: .element { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); } ==============================================================================*/ /*============================================================================ Layer promotion mixin for creating smoother animations with higher FPS. ==============================================================================*/ /*============================================================================ Text truncate ==============================================================================*/ /*================ Chevron ================*/ /*================ Miscellaneous ================*/ /*================ GLOBAL ================*/ /*================ Typography ================*/ :root { --adjust-body: var(--FONT-ADJUST-BODY); --adjust-heading: var(--FONT-ADJUST-HEADING); --adjust-button: var(--FONT-ADJUST-BUTTON); --adjust-nav: var(--FONT-ADJUST-NAV); } a { text-decoration: none; } html, body { font-size: 1rem; } body { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); line-height: 1.5625; color: var(--text); -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; } input, textarea, select, button { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); font-size: calc(1rem * var(--adjust-body)); line-height: 26px; border-radius: var(--RADIUS); } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { display: block; color: var(--heading); font-family: var(--FONT-STACK-HEADING); font-weight: var(--FONT-WEIGHT-HEADING); font-style: var(--FONT-STYLE-HEADING); margin: 0 0 0.5em; line-height: 1.25; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { text-decoration: none; font-weight: inherit; color: inherit; } h1 .strong, h1.strong, h1 strong, h2 .strong, h2.strong, h2 strong, h3 .strong, h3.strong, h3 strong, h4 .strong, h4.strong, h4 strong, h5 .strong, h5.strong, h5 strong, h6 .strong, h6.strong, h6 strong, .h1 .strong, .h1.strong, .h1 strong, .h2 .strong, .h2.strong, .h2 strong, .h3 .strong, .h3.strong, .h3 strong, .h4 .strong, .h4.strong, .h4 strong, .h5 .strong, .h5.strong, .h5 strong, .h6 .strong, .h6.strong, .h6 strong { font-weight: var(--FONT-WEIGHT-HEADING-BOLD); } h1, .h1 { font-size: calc(3rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h1, .h1 { font-size: calc(2.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h1, .h1 { font-size: calc(2.25rem * var(--adjust-heading)); } } h2, .h2 { font-size: calc(2.5rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h2, .h2 { font-size: calc(2.1rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h2, .h2 { font-size: calc(1.75rem * var(--adjust-heading)); } } h3, .h3 { font-size: calc(1.75rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h3, .h3 { font-size: calc(1.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h3, .h3 { font-size: calc(1.25rem * var(--adjust-heading)); } } h4, .h4 { font-size: calc(1.3125rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h4, .h4 { font-size: calc(1.28rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h4, .h4 { font-size: calc(1.25rem * var(--adjust-heading)); } } h5, .h5 { font-size: calc(1.1rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { h5, .h5 { font-size: calc(1rem * var(--adjust-heading)); } } h6, .h6 { font-size: calc(1rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { h6, .h6 { font-size: calc(0.875rem * var(--adjust-heading)); } } .h1-body { font-size: calc(3rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .h1-body { font-size: calc(2rem * var(--adjust-body)); } } .h2-body { font-size: calc(3rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .h2-body { font-size: calc(2rem * var(--adjust-body)); } } .h3-body { font-size: calc(2rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .h3-body { font-size: calc(1.5rem * var(--adjust-body)); } } .h4-body { font-size: calc(1.3125rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .h4-body { font-size: calc(1.25rem * var(--adjust-body)); } } .h5-body { font-size: calc(1.1rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .h5-body { font-size: calc(1rem * var(--adjust-body)); } } .h6-body { font-size: calc(1rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .h6-body { font-size: calc(0.875rem * var(--adjust-body)); } } p, .p { font-size: calc(1rem * var(--adjust-body)); } .h1 p, .h2 p, .h3 p, .h4 p, .h5 p, .h6 p, .h1 .p, .h2 .p, .h3 .p, .h4 .p, .h5 .p, .h6 .p { font-size: inherit; } p img { margin: 0; } p a { color: inherit; text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } em { font-style: var(--FONT-STYLE-BODY-ITALIC); } b, strong { font-weight: var(--FONT-WEIGHT-BODY-BOLD); } small { font-size: calc(0.75rem * var(--adjust-body)); } sup, sub { position: relative; font-size: 60%; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.5em; } .main-heading { font-size: calc(3rem * var(--adjust-heading)); line-height: 1.2; } @media only screen and (max-width: 1439px) { .main-heading { font-size: calc(2.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .main-heading { font-size: calc(2.25rem * var(--adjust-heading)); } } .main-text { font-size: calc(1.3125rem * var(--adjust-body)); font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); } @media only screen and (max-width: 767px) { .main-text { font-size: calc(1.25rem * var(--adjust-body)); } } .section-header__subheading, .subheading-text { font-family: var(--FONT-STACK-SUBHEADING); font-weight: var(--FONT-WEIGHT-SUBHEADING); font-size: calc(0.875rem * var(--FONT-ADJUST-SUBHEADING)); text-transform: var(--SUBHEADING-TEXT-CAPS); letter-spacing: var(--LETTER-SPACING-SUBHEADING); color: inherit; } .text-discounts { opacity: 0.7; font-size: calc(0.875rem * var(--adjust-body)); } .text-discounts .price { color: inherit; } /*================ Normalize ================*/ *, input, :before, :after { box-sizing: border-box; } html, body { padding: 0; margin: 0; } input { background: none; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } details, header, main { overflow: hidden; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto; margin: 0; -webkit-appearance: none; } input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none; } [hidden], template { display: none !important; } /*================ Blockquotes ================*/ blockquote { font-size: calc(0.9375rem * var(--adjust-body)); line-height: 1.45; font-style: var(--FONT-STYLE-BODY-ITALIC); margin: 0 0 var(--gutter); padding: calc(var(--gutter) / 2) var(--gutter); } blockquote p { margin-bottom: 0; } blockquote p+cite { margin-top: calc(var(--gutter) / 2); } blockquote cite { display: block; font-size: calc(0.6875rem * var(--adjust-body)); } blockquote cite:before { content: "— "; } /*================ Code ================*/ code, pre { background-color: #FAF7F5; font-family: Consolas, monospace; font-size: calc(0.875rem * var(--adjust-body)); border: 0 none; padding: 0 2px; color: #51AB62; } pre { overflow: auto; padding: calc(var(--gutter) / 2); margin: 0 0 var(--gutter); } /*================ Horizontal Rules ================*/ hr { clear: both; border-top: solid var(--accent); border-width: var(--BORDER-WIDTH) 0 0; margin: var(--gutter) 0; height: 0; } /*================ Lists ================*/ ul, ol { margin: 0 0 calc(var(--gutter) / 2) 20px; padding: 0; } ol { list-style: decimal; } ul ul, ul ol, ol ol, ol ul { margin: 4px 0 5px 20px; } li { margin-bottom: 0.25em; } ul.square { list-style: square outside; } ul.disc { list-style: disc outside; } ol.alpha { list-style: lower-alpha outside; } .no-bullets { list-style: none outside; margin-left: 0; } .inline-list { margin-left: 0; } .inline-list li { display: inline-block; margin-bottom: 0; } /*================ Tables ================*/ table { width: 100%; border-collapse: collapse; border-spacing: 0; border: var(--BORDER-WIDTH) solid var(--border); } .table-wrap { max-width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; } @media only screen and (max-width: 767px) { .table-wrap { margin-bottom: 20px; } } th, td { text-align: left; padding: 20px; font-weight: inherit; border: var(--BORDER-WIDTH) solid var(--border); } @media only screen and (max-width: 767px) { th, td { padding: 15px; } } @media only screen and (max-width: 479px) { th, td { padding: 10px; } } /*================ Images and iframes ================*/ img { border: 0 none; } svg:not(:root) { overflow: hidden; } img, iframe { max-width: 100%; } /*================ Forms ================*/ form { margin-bottom: 0; } /*================ Prevent zoom on touch devices in active inputs ================*/ input, textarea, button, select { color: var(--text); padding: 0; margin: 0; line-height: 26px; -webkit-user-select: text; user-select: text; } button { background: none; border: none; cursor: pointer; } button, input, textarea { -webkit-appearance: none; -moz-appearance: none; } button { background: none; border: none; display: inline-block; cursor: pointer; font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); } input[type=image] { padding-left: 0; padding-right: 0; } fieldset { padding: calc(var(--gutter) / 2); } legend { border: 0; padding: 0; } button, input[type=submit] { cursor: pointer; } input, textarea, select { font-size: var(--FONT-SIZE-INPUT); border: var(--BORDER-WIDTH) solid var(--border); background: var(--input-bg); max-width: 100%; padding: 13px 20px; } input[disabled], input.disabled, textarea[disabled], textarea.disabled, select[disabled], select.disabled { cursor: default; background-color: var(--disabled-grey); border-color: var(--disabled-grey-darken); } /*================ Input element overrides ================*/ input[type=checkbox], input[type=radio] { display: inline-block; padding: 0; width: auto; } input[type=checkbox] { -webkit-appearance: checkbox; -moz-appearance: checkbox; } input[type=radio] { -webkit-appearance: radio; -moz-appearance: radio; } input[type=image] { padding-left: 0; padding-right: 0; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; text-overflow: ""; cursor: pointer; } ::-webkit-input-placeholder { color: var(--text); } ::-moz-placeholder { color: var(--text); } :-ms-input-placeholder { color: var(--text); } :-moz-placeholder { color: var(--text); } optgroup { font-weight: var(--FONT-WEIGHT-BODY-BOLD); } option { color: var(--black); background-color: var(--white); } select::-ms-expand { display: none; } /* * Responsive tables, defined with .table--responsive on table element. * Only defined for IE9+ */ @media only screen and (max-width: 767px) { .table--responsive h2, .table--responsive h3 { text-align: center; } .table--responsive thead { display: none; } .table--responsive tr { display: block; position: relative; } .table--responsive th { padding: 10px 10px 0px 10px; } .table--responsive tr, .table--responsive td { float: left; clear: both; width: 100%; } .table--responsive th, .table--responsive td { display: block; padding: 15px 15px 15px 0; } } @media only screen and (max-width: 479px) { .table--small-hide { display: none !important; } } /* ================ Heights ================ */ :root { --full-height: 100vh; --three-quarters: 75vh; --two-thirds: 66vh; --one-half: 50vh; --one-third: 33vh; --one-fifth: 20vh; /* stylelint-disable-next-line length-zero-no-unit */ --announcement-height: 0px; --content-full: calc(100vh - var(--header-height, 0px) - var(--announcement-height, 0px)); } .original-height { min-height: 240px; } .full-height { min-height: var(--full-height); } .three-quarters-height { min-height: var(--three-quarters); } .two-thirds-height { min-height: var(--two-thirds); } .one-half-height { min-height: var(--one-half); } .one-third-height { min-height: var(--one-third); } .one-fifth-height { min-height: var(--one-fifth); } .seven-fifty-height { min-height: 750px; } .six-fifty-height { min-height: 650px; } .five-fifty-height { min-height: 550px; } .four-fifty-height { min-height: 450px; } .three-fifty-height { min-height: 350px; } .two-fifty-height { min-height: 250px; } .two-hundred-height { min-height: 200px; } .one-fifty-height { min-height: 150px; } .one-hundred-height { min-height: 100px; } /* Mobile height */ @media only screen and (max-width: 767px) { .original-height-mobile { min-height: auto; } .full-height-mobile { min-height: var(--full-height); } .three-quarters-height-mobile { min-height: var(--three-quarters); } .two-thirds-height-mobile { min-height: var(--two-thirds); } .one-half-height-mobile { min-height: var(--one-half); } .one-third-height-mobile { min-height: var(--one-third); } .one-fifth-height-mobile { min-height: var(--one-fifth); } .seven-fifty-height-mobile { min-height: 750px; } .six-fifty-height-mobile { min-height: 650px; } .five-fifty-height-mobile { min-height: 550px; } .four-fifty-height-mobile { min-height: 450px; } } body:not(.no-outline) .skip-link:focus { clip: auto; width: auto; height: auto; margin: 0; color: var(--text); background-color: var(--bg); padding: 10px; opacity: 1; z-index: 10000; transition: none; } body:not(.no-outline) model-viewer:focus, body:not(.no-outline) model-viewer.focus-visible, body:not(.no-outline) .product-single__media-slide:focus, body:not(.no-outline) .product-single__media-slide.focus-visible, body:not(.no-outline) .product__media:focus, body:not(.no-outline) .product__media.focus-visible, body:not(.no-outline) .btn--quick:focus, body:not(.no-outline) .btn--quick.focus-visible, body:not(.no-outline) .deferred-media__poster:focus .deferred-media__poster-button, body:not(.no-outline) .product__accordion__title:focus, body:not(.no-outline) .product__accordion__title.focus-visible, body:not(.no-outline) .filter__input:focus~label, body:not(.no-outline) .collection__sort__input:focus~label, body:not(.no-outline) .radio__button:focus-within input+.radio__label, body:not(.no-outline) .radio__input:focus+.radio__label, body:not(.no-outline) .radio__input.focus-visible+.radio__label, body:not(.no-outline) .swatch__button .swatch__input:focus+.swatch__label, body:not(.no-outline) .swatch__button .swatch__input.focus-visible+.swatch__label, body:not(.no-outline) .menu__item:focus>.navlink, body:not(.no-outline) .mosaic__item:focus-within, body:not(.no-outline) .image-accordion:focus-within, body:not(.no-outline) .overlapping-images__image:focus-within, body:not(.no-outline) .subcollection:focus-within { outline: -webkit-focus-ring-color auto 5px; } body:not(.no-outline) .image-accordion:focus-within, body:not(.no-outline) .mosaic--no-spacing .mosaic__item:focus-within, body:not(.no-outline) .overlapping-images__image:focus-within, body:not(.no-outline) .subcollection:focus-within { z-index: 100; padding: 2px; } body:not(.no-outline) .slider:focus, body:not(.no-outline) .item:focus-within, body:not(.no-outline) .slide__link:focus { outline: -webkit-focus-ring-color auto 5px; outline-offset: 1px; margin: 2px; z-index: 1; } body:not(.no-outline) .blog--photo .blog__post-item:focus-within, body:not(.no-outline) .blog__post-image-link:focus .blog__post-image { outline: -webkit-focus-ring-color auto 5px; } body:not(.no-outline) .featured-collection--slider .flickity-button:focus, body:not(.no-outline) .featured-collection--slider .flickity-button.focus-visible, body:not(.no-outline) .product-single__media-slider .flickity-button:focus, body:not(.no-outline) .product-single__media-slider .flickity-button.focus-visible { opacity: 1; } body:not(.no-outline) .blog-item:focus-within .blog-item__article__tag, body:not(.no-outline) .blog-item:focus-within .blog-item__article__tag::after { opacity: 1; visibility: visible; transition-delay: 0s; } body:not(.no-outline) .flickity-button:focus { box-shadow: 0 0 0 5px #19F; } body:not(.no-outline) .product-grid-item .btn:focus, body:not(.no-outline) .product-grid-item .shopify-payment-button__button--unbranded:focus, body:not(.no-outline) .product-grid-item .btn.focus-visible, body:not(.no-outline) .product-grid-item .focus-visible.shopify-payment-button__button--unbranded { opacity: 1; transform: translateY(0); transition: none; } body:not(.no-outline) .btn:focus, body:not(.no-outline) .shopify-payment-button__button--unbranded:focus { outline: -webkit-focus-ring-color auto 5px; } body:not(.no-outline) [data-collapsible-trigger]:focus, body:not(.no-outline) .blog-item__article__link:focus { outline-offset: -2px; } body:not(.no-outline) .mobile-menu__item:focus-within { overflow: initial; } body:not(.no-outline) .deferred-media__poster, body:not(.no-outline) .deferred-media__poster:focus, body:not(.no-outline) .deferred-media__poster:focus-visible, body:not(.no-outline) .deferred-media__poster.focus-visible { outline: none; } body:not(.no-outline) .blog-item__product:focus, body:not(.no-outline) .product__media__holder:focus .product__media, body:not(.no-outline) .promotion-row__item__link:focus~.promotion-row__item__content, body:not(.no-outline) .product-single__media-link:focus { outline: auto; outline: -webkit-focus-ring-color auto 5px; outline-offset: -6px; } body:not(.no-outline) .product__media__hover { display: none; } body:not(.no-outline) .product-grid-item__image:hover .product__media__image--hover-slide-in { -webkit-clip-path: unset; clip-path: unset; } body:not(.no-outline) .flickity-prev-next-button { opacity: 1; visibility: visible; transform: none; } .no-js body.no-outline :focus, .no-js body.no-outline .filter__input:focus~label, .no-js body.no-outline .collection__sort__input:focus~label { outline: auto; outline: -webkit-focus-ring-color auto 5px; } .no-js body.no-outline .promotion-row__item__link:focus~.promotion-row__item__content { outline: -webkit-focus-ring-color auto 5px; outline-offset: -6px; } /* * Links and Buttons */ a { color: var(--text); background: transparent; } button[disabled], input[disabled] { cursor: default; } .btn, .shopify-payment-button__button--unbranded, #esc-oos-form .NBIS-Modal__btn { --top-bottom-padding: 15px; --left-right-padding: 22px; --btn-inner-top-bottom: calc(var(--top-bottom-padding) * var(--adjust-button)); --btn-inner-left-right: calc(var(--left-right-padding) * var(--adjust-button)); position: relative; display: inline-block; overflow: hidden; padding: var(--btn-inner-top-bottom) var(--btn-inner-left-right); line-height: 1.53; border-radius: var(--RADIUS); border: var(--BORDER-WIDTH) solid var(--btn-border); background: var(--btn-bg); color: var(--btn-text); text-transform: var(--BUTTON-TEXT-CAPS); text-decoration: none; box-shadow: none; font-family: var(--FONT-STACK-BUTTON); font-weight: var(--FONT-WEIGHT-BUTTON); font-style: var(--FONT-STYLE-BUTTON); font-size: calc(1rem * var(--adjust-button)); text-align: center; letter-spacing: var(--LETTER-SPACING-BUTTON); will-change: color, border, background; transition: color 0.3s ease, border 0.3s ease, background 0s linear 0s; z-index: 1; -webkit-tap-highlight-color: initial; } .btn:before, .shopify-payment-button__button--unbranded:before { content: ""; position: absolute; display: flex; left: calc(var(--BORDER-WIDTH) * -1); top: calc(var(--BORDER-WIDTH) * -1); right: calc(var(--BORDER-WIDTH) * -1); bottom: calc(var(--BORDER-WIDTH) * -1); transform: scale(1, 0); transform-origin: top center; will-change: transform; z-index: -1; opacity: 0.3; transition: transform 0.3s ease; background: var(--btn-bg-hover); } .btn[disabled], [disabled].shopify-payment-button__button--unbranded, .btn:disabled, .shopify-payment-button__button--unbranded:disabled, .btn.disabled, .disabled.shopify-payment-button__button--unbranded { cursor: default; opacity: 0.65; } .btn[disabled]:before, [disabled].shopify-payment-button__button--unbranded:before, .btn:disabled:before, .shopify-payment-button__button--unbranded:disabled:before, .btn.disabled:before, .disabled.shopify-payment-button__button--unbranded:before { content: none; transform: scaleY(0); } .btn:hover, .shopify-payment-button__button--unbranded:hover { transition: color 0.3s ease, border 0.3s ease, background 0s linear 0.3s; } .btn:hover:before, .shopify-payment-button__button--unbranded:hover:before { transform-origin: bottom center; transform: none; } @media only screen and (min-width: 480px) { .btn, .shopify-payment-button__button--unbranded { min-width: 120px; } } @media only screen and (min-width: 1440px) { .btn, .shopify-payment-button__button--unbranded { min-width: 180px; } } @media only screen and (max-width: 479px) { .btn, .shopify-payment-button__button--unbranded { width: 100%; } } .btn, .shopify-payment-button__button--unbranded { --btn-border: var(--text); --btn-bg: var(--text); --btn-text: var(--bg); --btn-bg-hover: var(--bg-lighten-darken); } /*=== Button Primary ===*/ .btn--primary, .btn--primary .shopify-payment-button__button--unbranded, input.btn .shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .shopify-payment-button__button--unbranded, input.btn, input.shopify-payment-button__button--unbranded { --btn-border: var(--PRIMARY-BUTTONS-COLOR-BORDER); --btn-bg: var(--PRIMARY-BUTTONS-COLOR-BG); --btn-text: var(--PRIMARY-BUTTONS-COLOR-TEXT); --btn-bg-hover: var(--COLOR-PRIMARY-OPPOSITE-ALPHA-20); } .btn--primary-outline, .btn--primary.btn--outline .shopify-payment-button__button--unbranded, input.btn--outline.btn .shopify-payment-button__button--unbranded, input.btn--outline.shopify-payment-button__button--unbranded .shopify-payment-button__button--unbranded, .btn--outline input.shopify-payment-button__button--unbranded .shopify-payment-button__button--unbranded, .btn--primary.btn--outline, .btn--outline .btn--primary.shopify-payment-button__button--unbranded, .btn--primary .btn--outline.shopify-payment-button__button--unbranded, .btn--primary .btn--outline .shopify-payment-button__button--unbranded, .btn--outline .btn--primary .shopify-payment-button__button--unbranded, input.btn .btn--outline.shopify-payment-button__button--unbranded, input.btn .btn--outline .shopify-payment-button__button--unbranded, .btn--outline input.btn .shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .btn--outline.shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .btn--outline .shopify-payment-button__button--unbranded, input.btn--outline.btn, input.btn--outline.shopify-payment-button__button--unbranded, .btn--outline input.shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-BUTTONS-PRIMARY-BORDER); --btn-bg: var(--OUTLINE-BUTTONS-PRIMARY-BG); --btn-text: var(--OUTLINE-BUTTONS-PRIMARY-TEXT); --btn-bg-hover: var(--OUTLINE-BUTTONS-PRIMARY-BG-HOVER); } .btn--primary-solid-border, .btn--primary.btn--solid-border .shopify-payment-button__button--unbranded, input.btn--solid-border.btn .shopify-payment-button__button--unbranded, input.btn--solid-border.shopify-payment-button__button--unbranded .shopify-payment-button__button--unbranded, .btn--solid-border input.shopify-payment-button__button--unbranded .shopify-payment-button__button--unbranded, .btn--primary.btn--solid-border, .btn--solid-border .btn--primary.shopify-payment-button__button--unbranded, .btn--primary .btn--solid-border.shopify-payment-button__button--unbranded, .btn--primary .btn--solid-border .shopify-payment-button__button--unbranded, .btn--solid-border .btn--primary .shopify-payment-button__button--unbranded, input.btn .btn--solid-border.shopify-payment-button__button--unbranded, input.btn .btn--solid-border .shopify-payment-button__button--unbranded, .btn--solid-border input.btn .shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .btn--solid-border.shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .btn--solid-border .shopify-payment-button__button--unbranded, input.btn--solid-border.btn, input.btn--solid-border.shopify-payment-button__button--unbranded, .btn--solid-border input.shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-SOLID-BUTTONS-PRIMARY-BORDER); --btn-bg: var(--OUTLINE-SOLID-BUTTONS-PRIMARY-BG); --btn-text: var(--OUTLINE-SOLID-BUTTONS-PRIMARY-TEXT); --btn-bg-hover: var(--OUTLINE-SOLID-BUTTONS-PRIMARY-BG-HOVER); } .btn--primary.btn--text, .btn--primary .btn--text.shopify-payment-button__button--unbranded, input.btn .btn--text.shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .btn--text.shopify-payment-button__button--unbranded, input.btn--text.btn, input.btn--text.shopify-payment-button__button--unbranded { --btn-text: var(--PRIMARY-BUTTONS-COLOR-BG); } /*=== Button Secondary ===*/ .btn--secondary, .btn--secondary .shopify-payment-button__button--unbranded { --btn-border: var(--SECONDARY-BUTTONS-COLOR-BORDER); --btn-bg: var(--SECONDARY-BUTTONS-COLOR-BG); --btn-text: var(--SECONDARY-BUTTONS-COLOR-TEXT); --btn-bg-hover: var(--COLOR-SECONDARY-OPPOSITE-ALPHA-20); } .btn--secondary-outline, .btn--secondary.btn--outline .shopify-payment-button__button--unbranded, .btn--secondary.btn--outline, .btn--outline .btn--secondary.shopify-payment-button__button--unbranded, .btn--secondary .btn--outline.shopify-payment-button__button--unbranded, .btn--secondary .btn--outline .shopify-payment-button__button--unbranded, .btn--outline .btn--secondary .shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-BUTTONS-SECONDARY-BORDER); --btn-bg: var(--OUTLINE-BUTTONS-SECONDARY-BG); --btn-text: var(--OUTLINE-BUTTONS-SECONDARY-TEXT); --btn-bg-hover: var(--OUTLINE-BUTTONS-SECONDARY-BG-HOVER); } .btn--secondary-solid-border, .btn--secondary.btn--solid-border .shopify-payment-button__button--unbranded, .btn--secondary.btn--solid-border, .btn--solid-border .btn--secondary.shopify-payment-button__button--unbranded, .btn--secondary .btn--solid-border.shopify-payment-button__button--unbranded, .btn--secondary .btn--solid-border .shopify-payment-button__button--unbranded, .btn--solid-border .btn--secondary .shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-SOLID-BUTTONS-SECONDARY-BORDER); --btn-bg: var(--OUTLINE-SOLID-BUTTONS-SECONDARY-BG); --btn-text: var(--OUTLINE-SOLID-BUTTONS-SECONDARY-TEXT); --btn-bg-hover: var(--OUTLINE-SOLID-BUTTONS-SECONDARY-BG-HOVER); } .btn--secondary.btn--text, .btn--secondary .btn--text.shopify-payment-button__button--unbranded { --btn-text: var(--SECONDARY-BUTTONS-COLOR-BG); } /*=== Button White ====*/ .btn--white, .btn--white .shopify-payment-button__button--unbranded { --btn-border: var(--white); --btn-bg: var(--white); --btn-text: var(--black); --btn-bg-hover: var(--black-alpha-25); } .btn--white-outline, .btn--white.btn--outline .shopify-payment-button__button--unbranded, .btn--white.btn--outline, .btn--outline .btn--white.shopify-payment-button__button--unbranded, .btn--white .btn--outline.shopify-payment-button__button--unbranded, .btn--white .btn--outline .shopify-payment-button__button--unbranded, .btn--outline .btn--white .shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-BUTTONS-WHITE-BORDER); --btn-bg: var(--OUTLINE-BUTTONS-WHITE-BG); --btn-text: var(--OUTLINE-BUTTONS-WHITE-TEXT); } .btn--white-solid-border, .btn--white.btn--solid-border .shopify-payment-button__button--unbranded, .btn--white.btn--solid-border, .btn--solid-border .btn--white.shopify-payment-button__button--unbranded, .btn--white .btn--solid-border.shopify-payment-button__button--unbranded, .btn--white .btn--solid-border .shopify-payment-button__button--unbranded, .btn--solid-border .btn--white .shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-SOLID-BUTTONS-WHITE-BORDER); --btn-bg: var(--OUTLINE-SOLID-BUTTONS-WHITE-BG); --btn-text: var(--OUTLINE-SOLID-BUTTONS-WHITE-TEXT); } .btn--white.btn--text, .btn--white .btn--text.shopify-payment-button__button--unbranded { --btn-text: var(--white); } /*=== Button Black ====*/ .btn--black, .btn--black .shopify-payment-button__button--unbranded { --btn-border: var(--black); --btn-bg: var(--black); --btn-text: var(--white); --btn-bg-hover: var(--white-alpha-50); } .btn--black-outline, .btn--black.btn--outline .shopify-payment-button__button--unbranded, .btn--black.btn--outline, .btn--outline .btn--black.shopify-payment-button__button--unbranded, .btn--black .btn--outline.shopify-payment-button__button--unbranded, .btn--black .btn--outline .shopify-payment-button__button--unbranded, .btn--outline .btn--black .shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-BUTTONS-BLACK-BORDER); --btn-bg: var(--OUTLINE-BUTTONS-BLACK-BG); --btn-text: var(--OUTLINE-BUTTONS-BLACK-TEXT); } .btn--black-solid-border, .btn--black.btn--solid-border .shopify-payment-button__button--unbranded, .btn--black.btn--solid-border, .btn--solid-border .btn--black.shopify-payment-button__button--unbranded, .btn--black .btn--solid-border.shopify-payment-button__button--unbranded, .btn--black .btn--solid-border .shopify-payment-button__button--unbranded, .btn--solid-border .btn--black .shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-SOLID-BUTTONS-BLACK-BORDER); --btn-bg: var(--OUTLINE-SOLID-BUTTONS-BLACK-BG); --btn-text: var(--OUTLINE-SOLID-BUTTONS-BLACK-TEXT); } .btn--black.btn--text, .btn--black .btn--text.shopify-payment-button__button--unbranded { --btn-text: var(--black); } .btn--ar:before { content: none; } .btn--small { --top-bottom-padding: 10px; --left-right-padding: 18px; min-width: 0; } .btn--medium { --top-bottom-padding: 12px; --left-right-padding: 20px; } @media only screen and (min-width: 480px) { .btn--medium { min-width: 100px; } } @media only screen and (min-width: 1440px) { .btn--medium { min-width: 150px; } } @media only screen and (max-width: 479px) { .btn--medium { width: 100%; } } .btn--solid { border-width: 0; } .btn--solid.btn--large, .btn--solid.btn--medium, .btn--solid.btn--small { --btn-inner-top-bottom: calc(var(--top-bottom-padding) * var(--adjust-button) + var(--BORDER-WIDTH)); --btn-inner-left-right: calc(var(--left-right-padding) * var(--adjust-button) + var(--BORDER-WIDTH)); } .btn--text { position: relative; display: inline-block; text-decoration: none !important; --btn-text: var(--text); font-weight: var(--FONT-WEIGHT-BUTTON-BOLD); line-height: 1.25; padding: 0; border: 0; border-radius: 0; background: none; min-width: 0; width: auto; overflow: initial; transition: none; } .btn--text:before, .btn--text:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .btn--text:before { transform: scaleX(0); transform-origin: left; } .btn--text:after { transform-origin: right; } .no-touch .btn--text:hover { background: transparent; border: 0; } .no-touch .btn--text:hover:before, .no-touch .btn--text:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .btn--text:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .btn--text:before { top: auto; bottom: -0.1rem; left: 0; right: 0; opacity: 1; transform-origin: left; } .btn--text:hover { transition: none; } .btn--text:hover:before { transform-origin: left; } .no-touch .btn--text[disabled]:after, .no-touch .btn--text:disabled:after, .no-touch .btn--text.disabled:after { transform: none; } input.btn, input.shopify-payment-button__button--unbranded { transition: none; } input.btn:hover, input.shopify-payment-button__button--unbranded:hover { color: var(--btn-text); background: var(--btn-bg); transition: none; } input.btn:before, input.shopify-payment-button__button--unbranded:before { content: none; } /*=== Smart Button styles ===*/ .additional-checkout-buttons { overflow: hidden; } .additional-checkout-buttons .dynamic-checkout__content .shopify-cleanslate>div>div { margin: 0 !important; } .additional-checkout-buttons .dynamic-checkout__content .shopify-cleanslate>div>div>div { height: auto !important; min-width: 100% !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } .additional-checkout-buttons .dynamic-checkout__content .shopify-cleanslate div[role=button], .additional-checkout-buttons .dynamic-checkout__content .shopify-cleanslate iframe, .additional-checkout-buttons .dynamic-checkout__content .shopify-cleanslate form { border-radius: var(--RADIUS) !important; overflow: hidden !important; } .shopify-payment-button { position: relative; display: inline-block; padding-bottom: 0 !important; max-width: 100%; } .shopify-payment-button .shopify-payment-button__button { min-width: 100%; border-radius: var(--RADIUS); } .cart__checkout { width: 100%; max-width: 300px; } .shopify-payment-button__button button[type=submit] { border-radius: var(--RADIUS) !important; height: 51px !important; } .shopify-payment-button__button--branded { height: 51px; border-radius: var(--RADIUS); overflow: hidden; } .shopify-payment-button__button--unbranded { padding: var(--btn-inner-top-bottom) var(--btn-inner-left-right) !important; border-radius: var(--RADIUS) !important; border: var(--BORDER-WIDTH) solid var(--btn-border) !important; background: var(--btn-bg) !important; color: var(--btn-text) !important; font-family: var(--FONT-STACK-BUTTON) !important; font-style: var(--FONT-STYLE-BUTTON) !important; font-weight: var(--FONT-WEIGHT-BUTTON) !important; font-size: calc(1rem * var(--adjust-button)) !important; letter-spacing: var(--LETTER-SPACING-BUTTON); line-height: 1.53 !important; transition: color 0.3s ease, border 0.3s ease, background 0s linear 0s !important; } .shopify-payment-button__button--unbranded:hover { border-color: var(--btn-border) !important; background: var(--btn-bg) !important; color: var(--btn-text) !important; transition: color 0.3s ease, border 0.3s ease, background 0s linear 0.3s !important; } .btn--quick { --btn-size: 37px; font-family: var(--FONT-STACK-BUTTON); font-weight: var(--FONT-WEIGHT-BUTTON); font-style: var(--FONT-STYLE-BUTTON); font-size: calc(1rem * var(--adjust-button)); text-align: center; text-transform: var(--BUTTON-TEXT-CAPS); letter-spacing: var(--LETTER-SPACING-BUTTON); display: grid; position: absolute; right: 15px; bottom: 15px; padding: 0; margin: 0; border: none; } .btn--quick.cart__toggle--has-items .cart-indicator { visibility: hidden; } .btn--quick .icon-toggle-plus { width: 15px; height: 15px; display: block; color: var(--SECONDARY-BUTTONS-COLOR-TEXT); } .btn--quick .btn__inner { /* width: var(--btn-size); min-height: var(--btn-size); display: flex; align-items: center; justify-content: center; justify-self: end; border-radius: var(--RADIUS); padding: 6px 0; cursor: pointer; background: var(--white); color: var(--black); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.07); transition: width 0.3s ease; */ } .btn--quick .icon { stroke-width: calc(var(--STROKE-WIDTH) - 4px); width: 24px; overflow: hidden; flex: 0 0 20px; margin: 0 3px; transition: transform 0.3s ease, opacity 0.3s ease; height: auto; min-width: 25px; } .btn--quick .btn__text { display: block; white-space: nowrap; overflow: hidden; opacity: 0; transition: opacity 0.3s ease, padding 0.3s ease; font-size: calc(0.9rem * var(--adjust-button)) !important; } @media only screen and (max-width: 1023px) { .btn--quick .btn__text { display: none; } } .btn--quick:hover .btn__inner { width: 100%; transition: width 0.3s ease; } @media only screen and (max-width: 1023px) { .btn--quick:hover .btn__inner { width: var(--btn-size); } } .btn--quick:hover .icon { transform: none; } .btn--quick:hover .btn__text { opacity: 1; padding-right: 12px; } .btn--quick .btn__loader { position: absolute; top: 12px; left: 12px; width: var(--btn-size); height: var(--btn-size); content-visibility: hidden; opacity: 0; transition: opacity 0.1s ease-in; } .btn--quick .svg-loader circle { stroke: var(--black); } .btn--quick .svg-loader circle:first-child { opacity: 0.1; } .btn--quick.is-loading { pointer-events: none; } .btn--quick.is-loading .icon { opacity: 0; } .btn--quick.is-loading .btn__inner { /* width: var(--btn-size);*/ } .btn--quick.is-loading .btn__text { opacity: 0; padding: 0; } .btn--quick.is-loading .btn__loader { content-visibility: visible; opacity: 1; transition: opacity 0.3s ease; } .btn--quick.is-loading .btn__loader circle~circle { animation-play-state: running; } .share-link { display: flex; align-items: center; justify-content: center; font-size: calc(0.9rem * var(--adjust-body)); } .no-touch .share-link:after { opacity: 0; } .no-touch .share-link:hover:after { opacity: 1; } .progress-bar+.quick__form .btn--quick, .progress-bar+.btn--quick { bottom: 25px; } .btn--continue-shopping { width: 100%; } /*=== Scroll to top button ==*/ .btn--scroll-top { position: fixed; right: 0; bottom: 0; margin: calc(var(--gutter) / 2); z-index: 200; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); opacity: 0; visibility: hidden; transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s linear 0.3s; min-width: 0; width: 60px; height: 60px; padding: 0; } .btn--scroll-top .icon { transform: rotate(270deg); } .btn--scroll-top.is-visible { opacity: 1; visibility: visible; } /*! * animate.css -http://daneden.me/animate * Version - 3.5.1 * Licensed under the MIT license - http://opensource.org/licenses/MIT * * Copyright (c) 2016 Daniel Eden */ .animated { animation-duration: 1s; animation-fill-mode: both; } .animated.infinite { animation-iteration-count: infinite; } @keyframes fadeInOut { 0% { opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes menuFadeIn { 0% { opacity: 0; transform: scale(0.975); } 100% { opacity: 1; transform: scale(1); } } @keyframes fadeInOutError { 0% { opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { opacity: 0; } } @keyframes move { 0% { left: -100%; } 100% { left: 100%; } } @keyframes blink { 0% { opacity: 0.2; } 20% { opacity: 1; } 100% { opacity: 0.2; } } @keyframes showCompactHeader { 0% { transform: translateY(-100%); } 100% { transform: translateY(0); } } @keyframes hideCompactHeader { 0% { transform: translateY(0); } 100% { transform: translateY(-100%); } } @keyframes pulse { 0% { opacity: 0.1; } 50% { opacity: 1; } 100% { opacity: 0.1; } } @keyframes pulseOut { 0% { transform: scale(0); opacity: 0; } 69% { transform: scale(0); opacity: 0; } 70% { transform: scale(1); opacity: 0.2; } 100% { transform: scale(4); opacity: 0; } } @keyframes pulseOutFast { 0% { transform: scale(0); opacity: 0; } 1% { transform: scale(1); opacity: 0.4; } 65% { transform: scale(1.9); opacity: 0; } 100% { transform: scale(1.9); opacity: 0; } } @keyframes pulseInOutSubtle { 0% { transform: scale(1); opacity: 0; } 50% { transform: scale(1.125); opacity: 0.4; } 100% { transform: scale(1); opacity: 0; } } @keyframes progressBar { 0% { width: 0; } 100% { width: 100%; } } @keyframes ticker { 0% { transform: translate3d(0, 0, 0); } 100% { transform: translate3d(-100%, 0, 0); } } @keyframes rotate { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } @keyframes fadeInUp { 0% { transform: translateY(15px); opacity: 0; } 50% { opacity: 1; } 100% { transform: translateZ(0); opacity: 1; } } @keyframes pressFadeInUp { 0% { transform: translateY(70%); opacity: 0; } 100% { transform: translateZ(0); opacity: 1; } } @keyframes pressFadeOutDown { 0% { transform: translateZ(0); opacity: 1; } 100% { transform: translateY(40%); opacity: 0; } } @keyframes cartItemRemoved { 0% { transform: translateZ(0); max-height: 300px; } 100% { transform: translate3d(100%, 0, 0); opacity: 0; max-height: 0; padding: 0; } } @keyframes clipPathFromLeft { 0% { -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); } 100% { -webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); } } @keyframes clipPathFromRight { 0% { -webkit-clip-path: polygon(100% 0, 100% 0%, 100% 100%, 100% 100%); clip-path: polygon(100% 0, 100% 0%, 100% 100%, 100% 100%); } 100% { -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } } @keyframes sliderRightToLeft { 0% { transform: translateX(-40%); } 100% { transform: translateX(-50%); } } @keyframes sliderRightToLeftOneSlide { 0% { transform: translateX(10%); } 100% { transform: translateX(0); } } @keyframes zoomOut { 0% { transform: scale(1.05); } 100% { transform: scale(1); } } /*================ SVG Loader ================*/ @keyframes animate-svg { 0% { stroke-dashoffset: 88; } 100% { stroke-dashoffset: 0; } } .svg-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .svg-loader circle { stroke-width: 1; stroke: var(--PRIMARY-BUTTONS-COLOR-ALPHA-50); fill: none; } .svg-loader circle~circle { stroke: var(--PRIMARY-BUTTONS-COLOR-TEXT); stroke-dashoffset: 88; animation: animate-svg 1s linear infinite; animation-play-state: paused; } [data-animations=true] [data-bgset], [data-animations=true] [data-srcset] { opacity: 0; transition: opacity 0.5s ease; } [data-animations=true] [data-bgset].lazyloaded, [data-animations=true] [data-srcset].lazyloaded { opacity: 1; } /*================ Text Highlight Decorations and Animations ================*/ /* Text highlight */ .text-highlight { position: relative; z-index: -1; display: inline-block; } .text-highlight__icon { position: absolute; z-index: -1; top: 50%; left: 50%; width: 100%; height: 100%; background-image: var(--icon-url); transform: translate(-50%, -50%); color: var(--icon-color); } .text-highlight__icon svg { position: absolute; top: 50%; left: 50%; width: 100%; height: auto; transform: translate(-50%, -50%); pointer-events: none; z-index: -1; } .text-highlight__break { display: block; } /* Text Highlight Wrapper */ .text-highlight-wrapper { --height-multiplier: 0.06; --heading-margin: var(--inner); --heading-size: calc(3rem * var(--adjust-heading)); --decoration-height: calc(var(--heading-size) * var(--height-multiplier)); position: relative; } @media only screen and (max-width: 1439px) { .text-highlight-wrapper { --heading-size: calc(2.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .text-highlight-wrapper { --heading-size: calc(2.25rem * var(--adjust-heading)); } } h2.text-highlight-wrapper, .h2.text-highlight-wrapper { --heading-size: calc(2.5rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h2.text-highlight-wrapper, .h2.text-highlight-wrapper { --heading-size: calc(2.1rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h2.text-highlight-wrapper, .h2.text-highlight-wrapper { --heading-size: calc(1.75rem * var(--adjust-heading)); } } h3.text-highlight-wrapper, .h3.text-highlight-wrapper { --heading-size: calc(1.75rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h3.text-highlight-wrapper, .h3.text-highlight-wrapper { --heading-size: calc(1.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h3.text-highlight-wrapper, .h3.text-highlight-wrapper { --heading-size: calc(1.25rem * var(--adjust-heading)); } } h4.text-highlight-wrapper, .h4.text-highlight-wrapper { --heading-size: calc(1.3125rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { h4.text-highlight-wrapper, .h4.text-highlight-wrapper { --heading-size: calc(1.28rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { h4.text-highlight-wrapper, .h4.text-highlight-wrapper { --heading-size: calc(1.25rem * var(--adjust-heading)); } } h5.text-highlight-wrapper, .h5.text-highlight-wrapper { --heading-size: calc(1.1rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { h5.text-highlight-wrapper, .h5.text-highlight-wrapper { --heading-size: calc(1rem * var(--adjust-heading)); } } h6.text-highlight-wrapper, .h6.text-highlight-wrapper { --heading-size: calc(1rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { h6.text-highlight-wrapper, .h6.text-highlight-wrapper { --heading-size: calc(0.875rem * var(--adjust-heading)); } } .text-highlight-wrapper [data-has-highlight] { display: inline-block; text-decoration: none; } .aos-initialized .text-highlight-wrapper .text-reveal__cropper { overflow: visible; } /* Circle */ .text-highlight-wrapper.text-highlight-wrapper--circle { margin-bottom: var(--heading-margin); } .text-highlight-wrapper--circle .text-highlight__icon { width: 125%; height: 125%; transform: translate(-50%, -50%) scale(-1); } .text-highlight-wrapper--circle .text-highlight__icon svg { width: 85%; transform: translate(-50%, -50%) scaleY(0.8); } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--single-word svg { width: 100%; transform: translate(-50%, -50%); } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--single-word svg path { stroke-width: 4px; } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--short svg { transform: translate(-50%, -50%) scaleY(1.5); } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--l1 svg { width: 220%; transform: translate(-50%, -50%) scaleY(1.8); } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--l2 svg { width: 160%; } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--l3 svg { width: 130%; } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--long svg { width: 85%; transform: translate(-50%, -50%) scaleY(0.8); } .text-highlight-wrapper--circle .text-highlight__icon.text-highlight__icon--long svg path { stroke-width: 2px; } .text-highlight-wrapper--circle.promotion-row__item__heading--haspercentoff .text-highlight__icon svg { width: 110%; transform: translate(-50%, -50%) scaleY(1.3); } .text-highlight-wrapper--circle.promotion-row__item__heading--haspercentoff .text-highlight__icon path { stroke-width: 4px; } @media (hover: hover) { .text-highlight-wrapper--circle a:hover .text-highlight { stroke-dasharray: 506; stroke-dashoffset: 0; animation-name: draw-circle; animation-iteration-count: 1; animation-duration: 0.8s; animation-direction: reverse; animation-fill-mode: both; } } @keyframes draw-circle { to { stroke-dashoffset: 506; } } /* Squiggle */ .text-highlight-wrapper--squiggle { --height-multiplier: 0.13; } @media only screen and (max-width: 767px) { .text-highlight-wrapper--squiggle { --height-multiplier: 0.15; } } .text-highlight-wrapper.text-highlight-wrapper--squiggle { margin-bottom: var(--heading-margin); } .text-highlight-wrapper--squiggle svg { display: none; } .text-highlight-wrapper--squiggle .text-highlight__icon { background: currentcolor; top: auto; left: 0; bottom: 0; height: var(--decoration-height); margin-bottom: calc(-1px * var(--adjust-heading)); transform: none; mask: var(--icon-url) repeat-x center; -webkit-mask: var(--icon-url) repeat-x center; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: -webkit-mask-position 0.8s; transition: mask-position 0.8s; transition: mask-position 0.8s, -webkit-mask-position 0.8s; } @media (hover: hover) { .text-highlight-wrapper--squiggle a:hover .text-highlight__icon { -webkit-mask-position: right; mask-position: right; } } /* Stroke */ .text-highlight-wrapper--stroke { --height-multiplier: 0.03; } .text-highlight-wrapper--stroke .text-highlight, .text-highlight-wrapper--stroke sup { text-stroke: var(--decoration-height) var(--highlight-color); -webkit-text-stroke: var(--decoration-height) var(--highlight-color); -webkit-text-fill-color: transparent; -webkit-background-clip: text; background-clip: text; background-repeat: no-repeat; background-image: linear-gradient(135deg, var(--highlight-color) 0%, var(--highlight-color) 55%, transparent 50.1%); background-size: 0 100%; transition: background-size 0.3s cubic-bezier(0.67, 0.01, 0.15, 0.98); } @media (hover: hover) { .text-highlight-wrapper--stroke a:hover .text-highlight, .text-highlight-wrapper--stroke a:hover sup { background-size: 220% 100%; } } /* Highlight */ .text-highlight-wrapper--highlight .text-highlight { background: linear-gradient(0deg, var(--highlight-color, transparent), var(--highlight-color, transparent)) no-repeat right bottom/100% 100%; transition: background-size 350ms; } .text-highlight-wrapper--highlight a:hover .text-highlight { background-size: 100% 10%; } /* Highlight Text Color */ .text-highlight-wrapper--highlight-color .text-highlight, .text-highlight-wrapper--highlight-color sup { background: var(--highlight-color); background-image: linear-gradient(-75deg, transparent 0, transparent 10%, var(--text) 10%, var(--text) 20%, transparent 20%, transparent 100%); background-size: 200% 100%; -webkit-text-fill-color: transparent; -webkit-background-clip: text; transition: background 1s; } .text-highlight-wrapper--highlight-color a:hover .text-highlight, .text-highlight-wrapper--highlight-color a:hover .text-highlight sup { background-position: -200% 0; } /* Underline */ .text-highlight-wrapper--underline { --btn-text: var(--highlight-color); --BORDER-WIDTH: 3px; } .text-highlight-wrapper--underline .text-highlight__break>.text-highlight:before { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: 3px; display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .text-highlight-wrapper--underline a { position: relative; display: inline-block; text-decoration: none !important; } .text-highlight-wrapper--underline a:before, .text-highlight-wrapper--underline a:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .text-highlight-wrapper--underline a:before { transform: scaleX(0); transform-origin: left; } .text-highlight-wrapper--underline a:after { transform-origin: right; } .no-touch .text-highlight-wrapper--underline a:hover { background: transparent; border: 0; } .no-touch .text-highlight-wrapper--underline a:hover:before, .no-touch .text-highlight-wrapper--underline a:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .text-highlight-wrapper--underline a:hover:before { transform: scaleX(1); transition-delay: 0.25s; } /* Photoswipe overwrites */ .pswp.pswp--animate_opacity { transition: opacity 0.4s cubic-bezier(0.4, 0, 0.22, 1); } .pswp .pswp__zoom-wrap { transition: transform 0.4s cubic-bezier(0.75, 0, 0.175, 1); } .pswp .pswp__bg { transition: opacity 0.4s cubic-bezier(0.4, 0, 0.22, 1); } /* Loading */ .loader--line { position: relative; height: 4px; display: block; background-color: var(--PRIMARY-BUTTONS-COLOR-ALPHA-05); border-radius: 2px; overflow: hidden; width: 100%; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s linear 0.3s; } .loader-indeterminate { background-color: var(--PRIMARY-BUTTONS-COLOR-BG); } .loader-indeterminate:before { content: ""; position: absolute; background-color: inherit; top: 0; left: -35%; width: 100%; bottom: 0; will-change: transform; animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; } .loader-indeterminate:after { content: ""; position: absolute; background-color: inherit; top: 0; left: -200%; width: 100%; bottom: 0; will-change: transform; animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; animation-delay: 1.15s; } .loadMore .loader, .is-loading .loader { visibility: visible; opacity: 1; transition-delay: 0s; } .lazyloaded .loader { opacity: 0; visibility: hidden; } @keyframes indeterminate { 0% { transform: translateX(0) scale(0.35, 1); } 60% { transform: translateX(50%) scale(0.9, 1); } 100% { transform: translateX(100%) scale(0.9, 1); } } @keyframes indeterminate-short { 0% { transform: translateX(0) scale(2, 1); } 60% { transform: translateX(460px) scale(0.01, 1); } 100% { transform: translateX(460px) scale(0.01, 1); } } @keyframes pulse-loading { 0% { opacity: 1; } 50% { opacity: 0.25; } 100% { opacity: 1; } } /* Search popdown animations */ details[open=false]:not([open=true]) predictive-search[results] .predictive-search, .predictive-search, .popular-searches { visibility: hidden; transform-origin: center top; transform: scaleY(0); transition: transform 0.2s ease, visibility 0s 0.2s; } .search-popdown--page:focus-within search-form .popular-searches, details[open=true] search-form .popular-searches { visibility: visible; transform: scaleY(1); transition: transform 0.2s ease 0.2s, visibility 0s; } .search-popdown--page:focus-within predictive-search:not([open]):not([results]).is-searched .popular-searches, details[open=true] predictive-search:not([open]):not([results]).is-searched .popular-searches { transition: none; } .search-popdown--page:focus-within predictive-search:not([open]):not([results]) .popular-searches, details[open=true] predictive-search:not([open]):not([results]) .popular-searches { visibility: visible; transform: scaleY(1); transition: transform 0.2s ease 0.2s, visibility 0s; } .search-popdown--page:focus-within predictive-search:not([open]):not([results]) .predictive-search, details[open=true] predictive-search:not([open]):not([results]) .predictive-search { transition-delay: 0.1s; } .search-popdown--page:focus-within .search-popdown__body--has-popular-searches predictive-search:not([open]):not([results]) .predictive-search, .search-popdown--page:focus-within .search-popdown__body--has-popular-searches search-form, details[open=true] .search-popdown__body--has-popular-searches predictive-search:not([open]):not([results]) .predictive-search, details[open=true] .search-popdown__body--has-popular-searches search-form { transition-delay: 0s; } predictive-search[open=true][results=true] .predictive-search { transition: none; } predictive-search[open=true][results=true].is-searched .predictive-search { visibility: visible; transform: scaleY(1); transition: transform 0.2s ease 0.2s, visibility 0s; } predictive-search[open=true][results=true] .popular-searches { transition: none; } .predictive-search__heading span, .predictive-search__list { opacity: 0; transform: translateY(-5px); transition: transform 0.2s, opacity 0.1s; } .search-popdown--page:focus-within search-form .predictive-search__heading span, .search-popdown--page:focus-within predictive-search:not([open]):not([results]) .predictive-search__heading span, details[open=true] search-form .predictive-search__heading span, details[open=true] predictive-search:not([open]):not([results]) .predictive-search__heading span, .search-popdown--page:focus-within .search-popdown__body--has-popular-searches predictive-search.reset .predictive-search__heading span, .search-popdown--page:focus-within .search-popdown__body--has-popular-searches predictive-search.reset:not([open]):not([results]) .predictive-search__heading span, details[open=true] .search-popdown__body--has-popular-searches predictive-search.reset .predictive-search__heading span, details[open=true] .search-popdown__body--has-popular-searches predictive-search.reset:not([open]):not([results]) .predictive-search__heading span, predictive-search[open=true][results=true] .predictive-search__heading span, .search-popdown--page:focus-within search-form .predictive-search__list, .search-popdown--page:focus-within predictive-search:not([open]):not([results]) .predictive-search__list, details[open=true] search-form .predictive-search__list, details[open=true] predictive-search:not([open]):not([results]) .predictive-search__list, .search-popdown--page:focus-within .search-popdown__body--has-popular-searches predictive-search.reset .predictive-search__list, .search-popdown--page:focus-within .search-popdown__body--has-popular-searches predictive-search.reset:not([open]):not([results]) .predictive-search__list, details[open=true] .search-popdown__body--has-popular-searches predictive-search.reset .predictive-search__list, details[open=true] .search-popdown__body--has-popular-searches predictive-search.reset:not([open]):not([results]) .predictive-search__list, predictive-search[open=true][results=true] .predictive-search__list { transform: translateY(0); opacity: 1; transition: transform 0.2s 0.4s, opacity 0.2s 0.4s; } .search-popdown--page:focus-within predictive-search.reset .predictive-search__heading span, .search-popdown--page:focus-within predictive-search.reset:not([open]):not([results]) .predictive-search__heading span, details[open=true] predictive-search.reset .predictive-search__heading span, details[open=true] predictive-search.reset:not([open]):not([results]) .predictive-search__heading span, details[open=false]:not([open=true]) predictive-search[results] .predictive-search__heading span, .search-popdown--page:focus-within predictive-search.reset .predictive-search__list, .search-popdown--page:focus-within predictive-search.reset:not([open]):not([results]) .predictive-search__list, details[open=true] predictive-search.reset .predictive-search__list, details[open=true] predictive-search.reset:not([open]):not([results]) .predictive-search__list, details[open=false]:not([open=true]) predictive-search[results] .predictive-search__list { opacity: 0; transform: translateY(-5px); transition: transform 0.1s, opacity 0.1s; } .search-popdown__body--fixed .search-form__inner { transform-origin: center top; transform: scaleY(0); visibility: hidden; transition: transform 0.2s ease 0.1s, visibility 0s 0.3s; } details:not([open=true]) .search-popdown__body--fixed .search-form__inner { transition: transform 0.2s ease 0.4s, visibility 0s 0.6s; } .no-js details[open] .search-popdown__body--fixed .search-form__inner, details[open=true] .search-popdown__body--fixed .search-form__inner { visibility: visible; transform: scaleY(1); transition: transform 0.2s ease, visibility 0s; } .search-popdown__body--fixed .search-form__input-holder { opacity: 0; transform: translateY(-10px); transition: transform 0.2s, opacity 0.1s; } details:not([open=true]) .search-popdown__body--fixed .search-form__input-holder { transition: transform 0.2s 0.2s, opacity 0.1s 0.2s; } .no-js details[open] .search-popdown__body--fixed .search-form__input-holder, details[open=true] .search-popdown__body--fixed .search-form__input-holder { transform: translateY(0); opacity: 1; transition: transform 0.1s 0.2s, opacity 0.1s 0.2s; } .main-content:before { content: ""; position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 100vh; z-index: 130; opacity: 0; visibility: hidden; transition: visibility 0.4s linear, opacity 0.4s ease-in-out; background: var(--overlay); } .search-opened .main-content:before { opacity: 0.2; visibility: visible; transition: visibility 0s, opacity 0.4s ease-in-out; } .predictive-search__loader { margin: auto; } .search-popdown--page:focus-within predictive-search:not([loading]) .predictive-search__loading-state, .search-popdown--page:focus-within search-form:not([loading]) .predictive-search__loading-state, predictive-search:not([loading]) .predictive-search__loading-state, search-form:not([loading]) .predictive-search__loading-state { display: none; } .search-popdown--page:focus-within predictive-search[loading] .predictive-search__group, .search-popdown--page:focus-within predictive-search[loading] .predictive-search__actions, .search-popdown--page:focus-within search-form[loading] .predictive-search__group, .search-popdown--page:focus-within search-form[loading] .predictive-search__actions, predictive-search[loading] .predictive-search__group, predictive-search[loading] .predictive-search__actions, search-form[loading] .predictive-search__group, search-form[loading] .predictive-search__actions { display: none; } .search-popdown--page:focus-within predictive-search[loading] .predictive-search__loader, .search-popdown--page:focus-within search-form[loading] .predictive-search__loader, predictive-search[loading] .predictive-search__loader, search-form[loading] .predictive-search__loader { opacity: 1; visibility: visible; } .no-js details[open] .search-popdown__close { display: none; } .no-js details[open] .search-popdown__toggle .icon-search { display: none; } .no-js details[open] .search-popdown__toggle .icon-close { display: block; } .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .predictive-search, .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .popular-searches { transform: scaleY(0); transition: none; } .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .predictive-search__heading span, .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .predictive-search__list { opacity: 0; transform: translateY(-5px); transition: transform 0.2s, opacity 0.1s; } .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .search-popdown__body--fixed .search-form__inner { opacity: 0; transition: opacity 0.3s; } .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .search-popdown__body--fixed .search-form__input-holder { opacity: 0; transform: translateY(-10px); transition: none; } .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .search-popdown__toggle .icon-search { display: block; } .nav:has(search-popdown details[open]) .menu__items:hover+.menu__item .search-popdown__toggle .icon-close { display: none; } @supports not (selector(:has(*))) { .menu__items:hover+.menu__item .predictive-search, .menu__items:hover+.menu__item .popular-searches, .menu__items:hover+.menu__item details[open=true] search-form .popular-searches, .menu__items:hover+.menu__item details[open=true] predictive-search:not([open]):not([results]) .popular-searches, .menu__items:hover+.menu__item predictive-search[open=true][results=true].is-searched .predictive-search { transform: scaleY(0); transition: none; } .menu__items:hover+.menu__item .predictive-search__heading span, .menu__items:hover+.menu__item .predictive-search__list, .menu__items:hover+.menu__item details[open=true] search-form .predictive-search__heading span, .menu__items:hover+.menu__item details[open=true] predictive-search:not([open]):not([results]) .predictive-search__heading span, .menu__items:hover+.menu__item predictive-search[open=true][results=true] .predictive-search__heading span, .menu__items:hover+.menu__item details[open=true] search-form .predictive-search__list, .menu__items:hover+.menu__item details[open=true] predictive-search:not([open]):not([results]) .predictive-search__list, .menu__items:hover+.menu__item predictive-search[open=true][results=true] .predictive-search__list { opacity: 0; transform: translateY(-5px); transition: transform 0.2s, opacity 0.1s; } .menu__items:hover+.menu__item .search-popdown__body--fixed .search-form__inner { opacity: 0; transition: opacity 0.3s; } .menu__items:hover+.menu__item .search-popdown__body--fixed .search-form__input-holder { opacity: 0; transform: translateY(-10px); transition: none; } .menu__items:hover+.menu__item .search-popdown__toggle .icon-search { display: block; } .menu__items:hover+.menu__item .search-popdown__toggle .icon-close { display: none; } } @keyframes shimmer { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } } /*============================================================================ #Helper Classes ==============================================================================*/ .text-light { --text: var(--white); --text-alpha-50: rgb(255 255 255 / 50%); --heading: var(--white); --overlay: var(--black); color: var(--text); } .text-dark { --text: var(--black); --text-alpha-50: rgb(0 0 0 / 50%); --heading: var(--black); --overlay: var(--white); color: var(--text); } .text-dark .backdrop--radial:before { background: radial-gradient(rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 65%); } .text-left { text-align: left; } .text-center { text-align: center; } .text-right { text-align: right; } .backdrop--radial { position: relative; } .backdrop--radial:before { content: ""; position: absolute; top: -100px; bottom: -100px; left: -200px; right: -200px; z-index: -1; border-radius: 50%; background: radial-gradient(rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 65%); } .type-stack-nav { font-family: var(--FONT-STACK-NAV); font-style: var(--FONT-STYLE-NAV); font-size: calc(1rem * var(--adjust-nav)); } .type-stack-nav--normal { font-weight: var(--FONT-WEIGHT-NAV); } .type-stack-nav--bold { font-weight: var(--FONT-WEIGHT-NAV-BOLD); } .caps { text-transform: uppercase; } .placeholder-svg, .placeholder-svg-filled { position: relative; display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; fill: var(--bg-lighten-darken-contrast); content-visibility: auto; } .placeholder-svg-filled { background-color: var(--bg-lighten-darken); } .placeholder-svg--overlayed { position: relative; content-visibility: auto; } .placeholder-svg--overlayed:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--black); opacity: 0.1; } .placeholder-bg { background-size: contain !important; background-position: center center !important; } .placeholder-noblocks { position: relative; width: 100%; padding: calc(var(--gutter) / 2); text-align: center; } .no-image-placeholder { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; content-visibility: auto; } .cv-v { content-visibility: visible; } .cv-h { content-visibility: hidden; } .cv-a { content-visibility: auto; } .label-hidden { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .no-placeholder .label-hidden { position: inherit !important; overflow: auto; clip: auto; width: auto; height: auto; margin: 0; } .visually-shown { position: inherit !important; overflow: auto; clip: auto; width: auto; height: auto; margin: 0; } .highlight { color: var(--accent); } .hidden { display: none; } @media only screen and (max-width: 767px) { .hidden-sm { display: none !important; } } .visually-hidden, .fallback-text { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .clearfix:after { content: ""; display: table; clear: both; } .is-transitioning { display: block !important; visibility: visible !important; } .table-wrapper { overflow: auto; } .bg-pos-center-top { background-position: center top !important; } .bg-pos-center-center { background-position: center center !important; } .bg-pos-center-bottom { background-position: center bottom !important; } .bg-pos-left-center { background-position: left center !important; } .bg-pos-right-center { background-position: right center !important; } .img-pos-center-top { object-position: top; } .img-pos-center-center { object-position: center; } .img-pos-center-bottom { object-position: bottom; } .img-pos-left-center { object-position: left; } .img-pos-right-center { object-position: right; } .align--top-left { align-items: flex-start; justify-content: flex-start; text-align: left; } .align--top-center { align-items: flex-start; justify-content: center; text-align: center; } .align--top-right { align-items: flex-start; justify-content: flex-end; text-align: left; } @media only screen and (min-width: 768px) { .align--top-right { text-align: right; } } .align--middle-left { align-items: center; justify-content: flex-start; text-align: left; } .align--middle-center, .align--middle-split { align-items: center; justify-content: center; text-align: center; } .align--middle-right { align-items: center; justify-content: flex-end; text-align: left; } .product-single__wrapper .product-single__gallery .flickity-page-dots { display: none; } @media only screen and (min-width: 768px) { .align--middle-right { text-align: right; } .disable_dots_onmobile .flickity-page-dots { display: none; } } .align--bottom-left { align-items: flex-end; justify-content: flex-start; text-align: left; } .align--bottom-center { align-items: flex-end; justify-content: center; text-align: center; } .align--bottom-right { align-items: flex-end; justify-content: flex-end; text-align: left; } @media only screen and (min-width: 768px) { .align--bottom-right { text-align: right; } } .align--top-right .wrapper, .align--top-right .wrapper--narrow, .align--middle-right .wrapper, .align--middle-right .wrapper--narrow, .align--bottom-right .wrapper, .align--bottom-right .wrapper--narrow { margin-right: 0; } .align--top-left .wrapper, .align--top-left .wrapper--narrow, .align--middle-left .wrapper, .align--middle-left .wrapper--narrow, .align--bottom-left .wrapper, .align--bottom-left .wrapper--narrow { margin-left: 0; } /* [data-scroll-locked] .has-scrolled .site-header { padding-right: var(--scrollbar-width); } [data-scroll-locked] .banner, [data-scroll-locked] .collection__inner:after { width: 100vw; } [data-scroll-locked] .btn--scroll-top { right: var(--scrollbar-width); } @media (pointer: fine) { [data-scroll-locked] .banner-inner, [data-scroll-locked] .collection__header, [data-scroll-locked] .search-opened .shopify-section-header, [data-scroll-locked] .search-opened .site-header, [data-scroll-locked] .search-opened .search-popdown__body--fixed, [data-scroll-locked] .search-opened predictive-search, [data-scroll-locked] .search-opened search-form, [data-scroll-locked] .search-opened .announcement-bar-static, [data-scroll-locked] .search-opened .top-bar { width: 100vw; padding-right: var(--scrollbar-width); } } @media (pointer: fine) { [data-scroll-locked] .search-opened .search-form__inner { width: 100vw; padding-right: calc(var(--scrollbar-width) + var(--gutter)); } } @media only screen and (pointer: fine) and (max-width: 767px) { [data-scroll-locked] .search-opened .search-form__inner { padding-right: calc(var(--scrollbar-width) + var(--gutter-mobile)); } } @media only screen and (pointer: fine) and (max-width: 767px) { [data-scroll-locked] .search-opened .search-popdown__results { padding-right: var(--scrollbar-width); } } */ /** * The variable --wrapper-width needs to be in px or vw because blog posts use it to set items height * If percentage is used, blog items height will break */ :root { --site-width: var(--SITE-WIDTH); --site-width-narrow: var(--SITE-WIDTH-NARROW); --wrapper-width: calc(100vw - var(--scrollbar-width) - var(--gutter-mobile) * 2); } @media only screen and (min-width: 1440px) { :root { --site-width: calc(var(--SITE-WIDTH) - var(--scrollbar-width)); --wrapper-width: calc(var(--site-width) - var(--gutter) * 2); } } @media only screen and (min-width: 1024px) and (max-width: 1439px) { :root { --wrapper-width: calc(100vw - var(--scrollbar-width) - var(--gutter) * 2); } } .wrapper--full-padded { --wrapper-width: calc(100vw - var(--scrollbar-width) - var(--gutter-mobile) * 2); } @media only screen and (min-width: 1024px) { .wrapper--full-padded { --wrapper-width: calc(100vw - var(--scrollbar-width) - var(--gutter) * 2); } } .wrapper--full { --wrapper-width: calc(100vw - var(--scrollbar-width)); } @media only screen and (min-width: 1024px) { .wrapper--full { --wrapper-width: calc(100vw - var(--scrollbar-width)); } } @media only screen and (min-width: 1024px) { .wrapper--narrow { --wrapper-width: calc(var(--site-width-narrow) - var(--gutter) * 2); } } /** * Grid items * These will be used on Featured Collection, List collections, Related products */ @media only screen and (min-width: 1024px) { .grid { grid-template-columns: var(--grid); } } @media only screen and (min-width: 768px) { .grid { justify-content: center; } .grid .grid__item { width: 100%; } } .grid, .grid--center { display: grid; gap: var(--grid-gutter); } @media only screen and (max-width: 1023px) { .grid, .grid--center { grid-template-columns: var(--grid-tablet); } } @media only screen and (max-width: 767px) { .grid, .grid--center { gap: var(--grid-gutter-mobile) var(--grid-gutter); } } @media only screen and (max-width: 479px) { .grid, .grid--center { grid-template-columns: var(--grid-mobile); } .grid .mobile--one-whole, .grid--center .mobile--one-whole { grid-column: span 2; } } .grid--center { display: flex; flex-flow: row wrap; justify-content: center; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .grid--center .grid__item { width: 100%; } } @media only screen and (max-width: 767px) { .grid__container { overflow: hidden; margin: 0 calc(var(--gutter-mobile) * -1); } } /** * Carousel items * These will be used on Featured Collection, List collections, Related products */ .wrapper--full-padded .carousel__container { margin: 0 calc(var(--gutter-mobile) * -1); } @media only screen and (min-width: 1024px) { .wrapper--full-padded .carousel__container { margin: 0 calc(var(--gutter) * -1); } .wrapper--full-padded .carousel { padding: 0 var(--gutter); } .wrapper--full-padded .carousel .flickity-prev-next-button.next { right: calc(var(--gutter) * 1.5); } .wrapper--full-padded .carousel .flickity-prev-next-button.previous { left: calc(var(--gutter) * 1.5); } } @media only screen and (max-width: 1023px) { .carousel__container { margin: 0 calc(var(--gutter-mobile) * -1); } } .carousel { --flickity-btn-position: calc((var(--gutter) - var(--flickity-btn-size)) / 2); } .carousel .flickity-viewport { overflow: visible; } .carousel .flickity-prev-next-button.next { right: var(--flickity-btn-position); } .carousel .flickity-prev-next-button.previous { left: var(--flickity-btn-position); } @media only screen and (min-width: 768px) and (max-width: 1023px) { .carousel { padding: 0 var(--gutter-mobile); } } @media only screen and (min-width: 768px) { .carousel:not(.flickity-enabled), .carousel--inactive { display: flex; text-align: center; justify-content: center; } .carousel:not(.flickity-enabled) .carousel__item, .carousel--inactive .carousel__item { margin-right: var(--grid-gutter); } .carousel:not(.flickity-enabled) .carousel__item:last-child:not(:only-child), .carousel--inactive .carousel__item:last-child:not(:only-child) { margin-right: 0; } } .carousel:not(.flickity-enabled) { justify-content: flex-start; } @media only screen and (max-width: 767px) { .carousel--mobile { --item-width-mobile: calc(var(--wrapper-width) - var(--grid-gutter)); display: flex; flex-flow: row nowrap; justify-content: flex-start; gap: normal; margin: 0; overflow-x: scroll; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scroll-padding: var(--gutter-mobile); padding-left: var(--gutter-mobile); scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .carousel--mobile::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .carousel--mobile .grid__item, .carousel--mobile .carousel__item { display: block; float: none; flex: 0 0 auto; scroll-snap-align: start; margin-right: var(--grid-gutter); padding-bottom: 0; width: var(--item-width-mobile); } .carousel--mobile .grid__item:last-child, .carousel--mobile .carousel__item:last-child { margin-right: 0; } .carousel--mobile:after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } .carousel__item { width: calc(var(--wrapper-width) - var(--grid-gutter)); display: block; white-space: normal; flex: 0 0 auto; } @media only screen and (min-width: 768px) { .carousel__item { margin-right: var(--grid-gutter); } } @media only screen and (max-width: 767px) { .grid--mobile { gap: var(--grid-gutter); display: grid; grid-template-columns: var(--grid-tablet); padding-left: var(--gutter-mobile); padding-right: var(--gutter-mobile); } } @media only screen and (max-width: 479px) { .grid--mobile { grid-template-columns: var(--grid-mobile); } } @media only screen and (min-width: 1440px) { .one-whole { width: var(--wrapper-width); } .one-half { width: calc((var(--wrapper-width) - var(--grid-gutter)) / 2); } .one-third { width: calc((var(--wrapper-width) - var(--grid-gutter) * 2) / 3); } .one-quarter { width: calc((var(--wrapper-width) - var(--grid-gutter) * 3) / 4); } .one-fifth { width: calc((var(--wrapper-width) - var(--grid-gutter) * 4) / 5); } .one-sixth { width: calc((var(--wrapper-width) - var(--grid-gutter) * 5) / 6); } .one-seventh { width: calc((var(--wrapper-width) - var(--grid-gutter) * 6) / 7); } .one-eighth { width: calc((var(--wrapper-width) - var(--grid-gutter) * 7) / 8); } } @media only screen and (min-width: 1024px) and (max-width: 1439px) { .one-whole { width: calc(var(--wrapper-width) - var(--grid-gutter)); } .one-half { width: calc((var(--wrapper-width) - var(--grid-gutter)) / 2); } .one-third { width: calc((var(--wrapper-width) - var(--grid-gutter) * 2) / 3); } .one-quarter { width: calc((var(--wrapper-width) - var(--grid-gutter) * 3) / 4); } .one-fifth { width: calc((var(--wrapper-width) - var(--grid-gutter) * 4) / 5); } .one-sixth { width: calc((var(--wrapper-width) - var(--grid-gutter) * 5) / 6); } .one-seventh { width: calc((var(--wrapper-width) - var(--grid-gutter) * 6) / 7); } .one-eighth { width: calc((var(--wrapper-width) - var(--grid-gutter) * 7) / 8); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .one-whole { width: calc(var(--wrapper-width) * 0.9 - var(--grid-gutter)); } .one-half, .one-third, .one-quarter { width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); } .one-fifth, .one-sixth, .one-seventh, .one-eighth { width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 4); } } @media only screen and (max-width: 767px) { .one-whole { width: calc(var(--wrapper-width) * 0.9 - var(--grid-gutter)); } .one-half, .one-third, .one-quarter, .one-fifth, .one-sixth, .one-seventh, .one-eighth { width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); } .grid--mobile .one-half, .grid--mobile .one-third, .grid--mobile .one-quarter, .grid--mobile .one-fifth, .grid--mobile .one-sixth, .grid--mobile .one-seventh, .grid--mobile .one-eighth { width: 100%; } .grid__item:only-child, .carousel__item:only-child { margin: 0 auto; } } @media only screen and (max-width: 479px) { .mobile--one-whole { width: calc(var(--wrapper-width) * 0.9 - var(--grid-gutter)); } .mobile--one-half { width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); } .grid__item:only-child, .carousel__item:only-child { width: 100%; } } /** * Secondary Background */ .bg-secondary { --bg: var(--bg-secondary); --bg-lighten-darken: var(--bg-secondary-lighten-darken); --bg-lighten-darken-contrast: var(--bg-secondary-lighten-darken-contrast); } /** * Conflicting buttons styles */ .btn-primary-border .btn--primary.btn--solid, .btn-primary-border input.btn--solid.btn, .btn-primary-border input.btn--solid.shopify-payment-button__button--unbranded, .btn-primary-border .btn--primary .btn--solid.shopify-payment-button__button--unbranded, .btn--primary .btn-primary-border .btn--solid.shopify-payment-button__button--unbranded, .btn-primary-border input.btn .btn--solid.shopify-payment-button__button--unbranded, input.btn .btn-primary-border .btn--solid.shopify-payment-button__button--unbranded, .btn-primary-border input.shopify-payment-button__button--unbranded .btn--solid.shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .btn-primary-border .btn--solid.shopify-payment-button__button--unbranded, .btn-secondary-border .btn--secondary.btn--solid, .btn-secondary-border .btn--secondary .btn--solid.shopify-payment-button__button--unbranded, .btn--secondary .btn-secondary-border .btn--solid.shopify-payment-button__button--unbranded { --btn-inner-top-bottom: calc(var(--top-bottom-padding) * var(--adjust-button)); --btn-inner-left-right: calc(var(--left-right-padding) * var(--adjust-button)); --btn-border: var(--OUTLINE-SOLID-BUTTONS-PRIMARY-BORDER); border-width: var(--BORDER-WIDTH); } .btn-secondary-border .btn--secondary.btn--solid, .btn-secondary-border .btn--secondary .btn--solid.shopify-payment-button__button--unbranded, .btn--secondary .btn-secondary-border .btn--solid.shopify-payment-button__button--unbranded { --btn-border: var(--OUTLINE-SOLID-BUTTONS-SECONDARY-BORDER); } /** * No JS */ .no-js select { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; } .no-js .loading, .no-js .popup, .no-js .drawer, .no-js .lazy-image.is-loading:after, .no-js .lazyload, .no-js .will-lazyload, .no-js .quantity__btn, .no-js .article-preview-image.lazyload, .no-js .featured-image-section.lazyload, .no-js .product__media__slide:not(:first-child), .no-js .product__selectors, .no-js .selector-wrapper, .no-js .collection__sort-bar, .no-js .collection__sort__label .icon, .no-js .collection__filter__title .icon, .no-js .pagination--infinite, .no-js .product__accordion__title .icon, .no-js .cart__item__quantity-plus, .no-js .cart__item__quantity-minus, .no-js .cart__widget__title:before, .no-js .cart__widget__title:after { display: none !important; } .no-js img[loading].is-loading, .no-js .slider--zoom-out .item, .no-js .slider--fade .item { opacity: 1; z-index: auto; } .no-js .slide-background { height: 100%; } .no-js .site-header--loading { opacity: 1; overflow: visible; } .no-js .product__form__select { display: inline-block; margin-right: 5px; } .no-js body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .site-header--transparent[data-text-color=white]:hover { --text: var(--black); } .no-js body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .site-header--transparent:hover .logo__image-link--other { opacity: 1; } .no-js body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .site-header--transparent:hover .logo__image-link--home:not(.logo__image-link--single) { opacity: 0; } @supports not (selector(:has(*))) { .no-js .is-first-section-transparent .site-header--transparent[data-text-color=white]:hover { --text: var(--black); } .no-js .is-first-section-transparent .site-header--transparent:hover .logo__image-link--other { opacity: 1; } .no-js .is-first-section-transparent .site-header--transparent:hover .logo__image-link--home:not(.logo__image-link--single) { opacity: 0; } } .no-js .product__subs__plans.hidden, .no-js .collection__sort { display: block; } .no-js .header__dropdown { background: var(--bg); transform: scaleY(0); transform-origin: center top; transition: transform 0.4s ease-out, visibility 0s 0.5s; } .no-js .menu__item.parent:focus-within .header__dropdown, .no-js .menu__item.grandparent:focus-within .header__dropdown, .no-js .menu__item.parent:hover .header__dropdown, .no-js .menu__item.grandparent:hover .header__dropdown { visibility: visible; transform: scaleY(1); transition: transform 0.4s ease 0.1s, visibility 0s; pointer-events: all; } .no-js .menu__item.parent:focus-within .header__dropdown__wrapper, .no-js .menu__item.grandparent:focus-within .header__dropdown__wrapper, .no-js .menu__item.parent:hover .header__dropdown__wrapper, .no-js .menu__item.grandparent:hover .header__dropdown__wrapper { transform: translateY(0); opacity: 1; transition-delay: 0.3s; } .no-js .menu__item.parent:focus-within .navlink>.navtext:after, .no-js .menu__item.grandparent:focus-within .navlink>.navtext:after, .no-js .menu__item.parent:hover .navlink>.navtext:after, .no-js .menu__item.grandparent:hover .navlink>.navtext:after { opacity: 1; } .no-js .navlink--toplevel:focus+.header__dropdown { visibility: visible; transform: scaleY(1); transition: transform 0.4s 0.1s, visibility 0s; pointer-events: all; } .no-js .header__dropdown__image { opacity: 1; } .no-js .products-list__item__content { position: relative; opacity: 1; } .no-js .aos-initialized [data-aos][data-aos] { opacity: 1; transform: none; } .no-js .cart__update { display: flex; justify-content: center; width: auto; margin: var(--inner) 0 0 auto; } .no-js .cart__checkout--no-js { display: none; } .no-js .slider { height: auto; } .no-js .slider .item { opacity: 1 !important; } .no-js .cart__acceptance__input~.cart__buttons .cart__checkout { display: none; } .no-js .cart__acceptance__input~.cart__buttons .cart__checkout--no-js { display: block; } .no-js .cart__acceptance__input:checked~.cart__buttons .cart__checkout { display: block; } .no-js .cart__acceptance__input:checked~.cart__buttons .cart__checkout--no-js { display: none; } .no-js .product__accordion__inner { top: 0; } .no-js [data-collapsible-content] { transform: none; } .no-js [data-collapsible-container] { visibility: initial; opacity: initial; height: auto; } .no-js .menu__item--has-items:hover>.dropdown, .no-js .menu__item--has-items:hover>.megamenu, .no-js .menu__item--has-items:focus-within>.dropdown, .no-js .menu__item--has-items:focus-within>.megamenu, .no-js .dropdown__item--has-items:focus-within>.dropdown, .no-js .dropdown__item--has-items:hover>.dropdown { opacity: 1; visibility: visible; pointer-events: auto; z-index: auto; } .no-js .megamenu__links { opacity: 1; } .no-js .mobile-nav [data-collapsible-content], .no-js .nav [data-collapsible-content] { transform: none; } .no-js .tab { visibility: visible; position: static; opacity: 1; display: inherit; } .no-js .tab:empty { display: none; } .no-js .tab:not(.current), .no-js .tab:not(.current) * { pointer-events: auto !important; } @media only screen and (max-width: 767px) { .no-js .list-collections-section--carousel .carousel--mobile { display: flex; justify-content: flex-start; gap: unset; } } @media only screen and (max-width: 767px) { .no-js .list-collections-section--carousel .grid--mobile { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: unset; } } .no-js .list-collections__item__image-bg { opacity: 1; display: block !important; } .no-js .cart__item__image img { max-width: 100px; max-height: 100px; } .no-js .carousel { display: flex; flex-flow: row wrap; text-align: center; } @media only screen and (max-width: 767px) { .no-js .carousel { flex-flow: row nowrap; margin: 0; overflow-x: scroll; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .no-js .carousel::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } } .no-js .carousel .carousel__item { margin-right: var(--grid-gutter); } .no-js .carousel .carousel__item.one-half:nth-child(2n+2), .no-js .carousel .carousel__item.one-third:nth-child(3n+3), .no-js .carousel .carousel__item.one-quarter:nth-child(4n+4), .no-js .carousel .carousel__item.one-fifth:nth-child(5n+5), .no-js .carousel .carousel__item.one-sixth:nth-child(6n+6), .no-js .carousel .carousel__item.one-seventh:nth-child(7n+7), .no-js .carousel .carousel__item.one-eighth:nth-child(8n+8), .no-js .carousel .carousel__item:last-child { margin-right: 0; } @media only screen and (max-width: 1023px) { .no-js .carousel .carousel__item:nth-child(n) { margin-right: var(--grid-gutter) !important; } .no-js .carousel .carousel__item:nth-child(even) { margin-right: 0 !important; } } @media only screen and (max-width: 767px) { .no-js .carousel .carousel__item:nth-child(n) { margin-right: 0 !important; margin-bottom: var(--grid-gutter); } } .no-js .product-grid-item--featured { height: auto; } .no-js.ie11 .lazyload, .no-js.ie11 .blog__post-image.lazyload, .no-js.ie11 .cart__checkout, .no-js.ie11 .site-header--transparent:not(.is-megamenu-open) .logo__image-link--home { display: block !important; } .no-js.ie11 .product__selectors, .no-js.ie11 .logo .logo__image-link.logo__image-link--home { display: none !important; } .no-js.ie11 .selector-wrapper, .no-js.ie11 .quantity__btn { display: none; } .no-js.ie11 ul li:hover .dropdown { opacity: 1; visibility: visible; pointer-events: auto; } .no-js .top-bar__scale.ticker--unloaded { opacity: 1; position: static; width: auto; } .no-js .image-accordions { display: block; } @media only screen and (max-width: 767px) { .no-js .image-accordions { display: flex; } } .no-js .brick__collection { display: grid; gap: var(--grid-gutter); } @media only screen and (min-width: 1024px) and (max-width: 1439px) { .no-js .brick__collection { max-width: 40vw; } } @media only screen and (min-width: 1024px) { .no-js .brick__collection { grid-template-columns: var(--grid-tablet); } } @media only screen and (max-width: 1023px) { .no-js .brick__collection { grid-template-columns: var(--grid-mobile); padding: 0 var(--grid-gutter); max-width: 100%; margin: 0; } } .no-js .brick__collection:not(.flickity-enabled) .product-grid-item:not(:first-of-type) { display: block; } .no-js .brick__collection:not(.flickity-enabled) .product-grid-item { display: block; } @media only screen and (max-width: 1023px) { .no-js .brick__collection:not(.flickity-enabled) .product-grid-item { width: 100%; margin-right: 0; } } .no-js .image-accordion:not(.is-expanded) .slide__text__wrapper { opacity: 1; } .no-js .image-accordion__image__container { width: 100% !important; } .no-js .image-accordions { height: auto; } .no-js .image-accordion { margin-bottom: var(--grid-gutter); } .no-js .image-accordions.full-height .image-accordion { height: var(--full-height); } .no-js .image-accordions.three-quarters-height .image-accordion { height: var(--three-quarters); } .no-js .image-accordions.two-thirds-height .image-accordion { height: var(--two-thirds); } .no-js .image-accordions.one-half-height .image-accordion { height: var(--one-half); } .no-js .image-accordions.one-third-height .image-accordion { height: var(--one-third); } .no-js .image-accordions.one-fifth-height .image-accordion { height: var(--one-fifth); } .no-js .image-accordions.seven-fifty-height .image-accordion { height: 750px; } .no-js .image-accordions.six-fifty-height .image-accordion { height: 650px; } .no-js .image-accordions.five-fifty-height .image-accordion { height: 550px; } .no-js .image-accordions.four-fifty-height .image-accordion { height: 450px; } .no-js .location__image { position: relative; margin-bottom: var(--grid-gutter); } .no-js .products-list__container { padding-right: 0; } .no-js .products-list__item__aside { width: 100%; display: grid; grid-template-columns: var(--grid); gap: var(--grid-gutter); } @media only screen and (max-width: 1023px) { .no-js .products-list__item__aside { grid-template-columns: var(--grid-mobile); } } .no-js .products-list__item__image--small { position: relative; top: 0; left: 0; transform: none; width: 75%; } .no-js .press__item { position: relative; opacity: 1 !important; } .no-js .press__item__inner { opacity: 1; } .no-js .blog-item { margin: 0; width: 100%; } @media only screen and (max-width: 767px) { .no-js .blog-item { padding: 0; } } .no-js .shoppable-blog__slider:not(.flickity-enabled) { display: grid; gap: var(--grid-gutter); grid-template-columns: repeat(3, minmax(0, 1fr)); } @media only screen and (max-width: 1023px) { .no-js .shoppable-blog__slider:not(.flickity-enabled) { grid-template-columns: var(--grid-mobile); } } @media only screen and (max-width: 767px) { .no-js .shoppable-blog__slider:not(.flickity-enabled) { grid-template-columns: 1fr; } } .no-js .column__item__image img { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; object-fit: cover; } .no-js .one-whole, .no-js .one-half, .no-js .one-third, .no-js .one-quarter, .no-js .one-fifth, .no-js .one-sixth, .no-js .one-seventh, .no-js .one-eighth { --wrapper-width: 100%; } .no-js .subcollection__outer>a { display: none; } .no-js .look__column__drawer { display: flex !important; } .icon { fill: none; stroke: currentColor; stroke-width: var(--STROKE-WIDTH); display: inline-block; width: 100%; height: 100%; } .icon-stroke .icon { stroke-width: 3px; } @supports (-webkit-hyphens: none) { .icon-stroke .icon { transform: translateZ(0); } } .icon-select, .icon-toggle-plus, .icon-toggle-minus { width: 15px; height: 15px; } .icon-close { display: block; width: 100%; height: 100%; transition: transform 0.3s ease; } .icon-shopping-bag { vertical-align: middle; pointer-events: none; } .icon-filter { fill: currentColor; width: 20px; height: 13px; stroke: none; } .icon-hamburger { display: block; width: 28px; height: 28px; pointer-events: none; } .icon-css-arrow { pointer-events: none; } .icon-play { width: 30px; height: 30px; border-radius: 50%; box-shadow: inset 0 0 0 var(--BORDER-WIDTH) currentColor; fill: currentColor; stroke: none; } .icon-share { width: 20px; height: calc(19px * var(--adjust-body)); margin-right: 10px; } .icon-check { stroke: none; } /* Product media icons */ .icon-media-model, .icon-media-video { fill: var(--bg); stroke: none; } .icon-media-model-outline, .icon-media-video-outline { stroke: var(--text-alpha-5); } .icon-media-model-element, .icon-media-video-element { fill: var(--text); } /* Icon check */ .icon-check { background: var(--icon-check-swatch) no-repeat center center/contain; } /* ============================================================================ #Images ============================================================================== */ .background-size-cover, .video-background { position: absolute; top: 0; left: 0; overflow: hidden; width: 100%; height: 100%; display: block; background-size: cover; background-position: center center; background-color: var(--bg); background-repeat: no-repeat; } .img-object-cover { display: block; object-fit: cover; width: 100%; height: 100%; min-height: 100%; } .img-object-contain { display: block; object-fit: contain; width: 100%; height: 100%; min-height: 100%; } /* === image load animations === */ .fade-in-image .background-size-cover, .fade-in-image .video-background { opacity: 0; transition: opacity 0.5s ease-in; } .fade-in-image-zoom .background-size-cover, .fade-in-image-zoom .video-background { opacity: 0; transform: scale(1.06); transition: opacity 0.65s ease, transform 2s ease; } .fade-in-image .placeholder-svg--overlayed, .fade-in-image .background-size-cover.lazyloaded, .fade-in-image .lazyloaded.video-background, .no-js .fade-in-image .background-size-cover, .no-js .fade-in-image .video-background { opacity: 1; } .fade-in-image-zoom .background-size-cover.lazyloaded, .fade-in-image-zoom .lazyloaded.video-background, .no-js .fade-in-image-zoom .background-size-cover, .no-js .fade-in-image-zoom .video-background { opacity: 1; transform: scale(1); } .image-fill { position: relative; overflow: hidden; } .image-fill .placeholder-svg--overlayed, .no-js-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* === image shimmer effect === */ figure.lazy-image { margin: 0; overflow: hidden; } figure.lazy-image:after { content: none; display: none; } figure.lazy-image.is-loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--bg-accent); z-index: 1; } figure.lazy-image.is-loading:after { content: ""; display: block; position: absolute; top: -10%; left: -10%; right: -10%; bottom: -10%; z-index: -1; animation-duration: 1.6s; animation-fill-mode: forwards; animation-iteration-count: infinite; animation-name: shimmer; animation-timing-function: linear; background: linear-gradient(98deg, var(--bg-accent) 16%, var(--bg-accent-lighten) 32%, var(--bg-accent) 48%); transform: translateX(-100%); } img[loading] { -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: opacity 1s ease; } img[loading].is-loading { opacity: 0; } /*================ Forms ================*/ .hidden-label { position: absolute; height: 0; width: 0; margin-bottom: 0; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); } .form-vertical-wrapper { max-width: 480px; margin: 0 auto; text-align: center; } .form-vertical-wrapper p a { position: relative; display: inline-block; text-decoration: none !important; } .form-vertical-wrapper p a:before, .form-vertical-wrapper p a:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .form-vertical-wrapper p a:before { transform: scaleX(0); transform-origin: left; } .form-vertical-wrapper p a:after { transform-origin: right; } .no-touch .form-vertical-wrapper p a:hover { background: transparent; border: 0; } .no-touch .form-vertical-wrapper p a:hover:before, .no-touch .form-vertical-wrapper p a:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .form-vertical-wrapper p a:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .form-vertical-wrapper button { width: 100%; } .form-vertical { margin-bottom: calc(var(--gutter) / 2); } .form-vertical input, .form-vertical select, .form-vertical button, .form-vertical textarea { display: block; margin-bottom: 10px; } .form-vertical input[type=radio], .form-vertical input[type=checkbox] { display: inline-block; } .form__heading { text-align: center; margin-bottom: 20px; } .form__item { padding: 0; border: 0; margin: 0 0 20px; } .form__item .selector-wrapper { display: block; position: relative; margin: 0; padding: 0; width: 100%; } .form__item .selector-wrapper .icon-select { position: absolute; top: 0; right: 0; width: 54px; padding: 0 20px; height: 100%; pointer-events: none; transform: rotate(90deg); } .form__item select { margin: 0; width: 100%; } .form__item--radio, .form__item--checkbox { margin: 20px 0; } .form__item--radio label, .form__item--checkbox label { clear: both; display: block; } .form__item--radio span, .form__item--checkbox span { display: block; } .form__item--checkbox+.form__item--checkbox { margin-top: -20px; } .form__item--submit { margin: 30px 0 0; } .form__label { display: block; margin: 0 0 10px; } .input--full { width: 100%; } .input--checkbox, .input--radio { margin: 5px 8px 10px 0; float: left; } /*================ Error styles ================*/ input.error, select.error, textarea.error { border-color: var(--error); background-color: var(--input-bg); color: var(--error); } label.error { color: var(--error); } /*================ Input group ================*/ .input-group { --form-margin: 20px; --input-height: 54px; display: flex; flex-direction: column; margin: calc(var(--form-margin) / -2); } @media only screen and (min-width: 768px) { .input-group { flex-flow: row wrap; } } .text-left .input-group, .item--left .input-group, .item--bottom-left .input-group, .item--top-left .input-group, .align--top-left .input-group, .align--middle-left .input-group, .align--middle-split .input-group, .align--bottom-left .input-group { justify-content: flex-start; } .text-center .input-group, .item--center .input-group, .item--bottom-center .input-group, .item--top-center .input-group, .align--top-center .input-group, .align--middle-center .input-group, .align--middle-split .input-group, .align--bottom-center .input-group { justify-content: center; } @media only screen and (min-width: 768px) { .text-right .input-group, .item--right .input-group, .item--bottom-right .input-group, .item--top-right .input-group, .align--top-right .input-group, .align--middle-right .input-group, .align--middle-split .input-group, .align--bottom-right .input-group { justify-content: flex-end; } } @media only screen and (max-width: 479px) { .input-group { --form-margin: 15px; } } .input-group--inline { margin: 0; position: relative; max-width: 340px; flex-wrap: nowrap; flex-direction: row; } .align--middle-center .input-group--inline { margin: 0 auto; } @media only screen and (min-width: 768px) { .text-right .input-group--inline, .item--right .input-group--inline, .item--bottom-right .input-group--inline, .item--top-right .input-group--inline, .align--top-right .input-group--inline, .align--middle-right .input-group--inline, .align--bottom-right .input-group--inline { margin-left: auto; } } .input-group--inline input::-moz-focus-inner { border: 0; padding: 0; margin-top: -1px; margin-bottom: -1px; } .input-group--inline .input-group__item { flex: 1 1 auto; padding: 0; } .input-group--inline .input-group__item--btn { flex-grow: 0; flex-basis: 54px; max-width: 54px; } .input-group--inline .input-group__field { width: 100%; border-right: 0; border-radius: var(--RADIUS) 0 0 var(--RADIUS); } .input-group--inline .input-group__btn--icon { display: flex; align-items: center; justify-content: center; border-left: 0; border-radius: 0 var(--RADIUS) var(--RADIUS) 0; } .input-group--inline .input-group__field, .input-group--inline .input-group__btn--icon { height: var(--input-height); } .input-group--inline .input-group__field--text { margin: 10px 0; } .input-group__item { position: relative; padding: calc(var(--form-margin) / 2); flex-basis: 100%; flex-grow: 2; } @media only screen and (min-width: 1024px) { .input-group__item { max-width: 280px; } } @media only screen and (min-width: 768px) { .input-group__item { flex-basis: 50%; } } @media only screen and (min-width: 1440px) { .input-group__item { flex-basis: 25%; } .align--middle-split .input-group__item { flex-basis: 50%; } } .input-group__item--btn { flex-grow: 0; } .input-group__item--text { flex-basis: 100%; } .input-group__field { color: var(--text); background: var(--input-bg); } .input-group__btn { width: 100%; height: var(--input-height); min-width: 54px; } .input-group__error { display: none; position: absolute; left: 0; right: 0; bottom: var(--inner); padding: 0 calc(0.5 * var(--inner) + 20px); color: var(--error); font-size: calc(0.75rem * var(--adjust-body)); line-height: 1.05; transform: translateY(50%); } .has-error .input-group__error { display: block; } input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset; } input { -webkit-appearance: none; } .product__form input, .product__form textarea, .product__form select, #collection-sorting input, #collection-sorting textarea, #collection-sorting select { border: var(--BORDER-WIDTH) solid var(--border); } /*============================================================================ #Notes and Form Feedback ==============================================================================*/ .note, .errors { border-radius: var(--RADIUS); padding: 8px 12px; margin-bottom: var(--inner); border: var(--BORDER-WIDTH) solid transparent; font-size: calc(0.75rem * var(--adjust-body)); text-align: center; } .note ul, .note ol, .errors ul, .errors ol { margin: 0; list-style: none outside; } .note li:last-child, .errors li:last-child { margin-bottom: 0; } .note p, .errors p { margin-bottom: 0; font-size: inherit; } .errors { background-color: var(--error-bg); } .errors .input-group__field { color: var(--error); border-color: var(--error); } .form-success { color: var(--success); border-color: var(--success); } .form-success a { color: inherit; text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .form-success a:hover { text-decoration: none; } .form-error, .errors { color: var(--error); border-color: var(--error); clear: both; } .form-error a, .errors a { color: var(--error); text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .form-error a:hover, .errors a:hover { text-decoration: none; } /*============================================================================ #Checkbox ==============================================================================*/ .checkbox>input { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .checkbox>label { position: relative; display: block; padding-left: 22px; font-size: calc(0.875rem * var(--adjust-body)); line-height: 1.43; text-align: left; cursor: pointer; } .checkbox>label:before { content: ""; position: absolute; left: 0; top: 0; width: 16px; height: 16px; margin-top: 2px; color: var(--white); border-radius: var(--RADIUS-CHECKBOX); border: 1px solid var(--text); } .checkbox>input:checked~label:before { background: var(--text) var(--icon-check) no-repeat center center; background-size: 14px auto; } /* * Pagination */ .pagination { margin: var(--gutter) 0; text-align: center; } .pagination .prev, .pagination .page, .pagination .next { display: inline-block; line-height: 1.2; } .pagination a:not(.btn):not(.shopify-payment-button__button--unbranded) { display: block; } .pagination a:not(.btn):not(.shopify-payment-button__button--unbranded), .pagination .page.current { padding: 8px; } .pagination .page.current { border-bottom: var(--BORDER-WIDTH) solid var(--text); } .pagination__loading { padding-top: 40px; display: inline-block; background-image: var(--loader-image); background-position: top center; background-repeat: no-repeat; background-size: var(--loader-image-size); width: 150px; height: 150px; animation: pulse-loading 2s infinite ease-in-out; } .pagination__button--previous { transform: rotate(180deg); } .dots--animated span { animation-name: blink; animation-duration: 1.4s; animation-iteration-count: infinite; animation-fill-mode: both; } .dots--animated span:nth-child(2) { animation-delay: 0.2s; } .dots--animated span:nth-child(3) { animation-delay: 0.4s; } /*================ Responsive Image ================*/ .responsive-image { position: relative; height: 0; min-height: 1px; } .responsive-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } /* * Rich Text Editor */ .rte { margin-bottom: calc(var(--gutter) / 2); font-size: calc(1rem * var(--adjust-body)); } .rte a:not(.btn):not(.shopify-payment-button__button--unbranded) { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .rte p { font-size: inherit; } .rte h1, .rte h2, .rte h3, .rte h4, .rte h5, .rte h6 { margin: 1em 0; } .rte li { margin-bottom: 0.4em; } .rte *:last-child { margin-bottom: 0; } .text-center .rte ul, .text-center .rte ol { display: flex; flex-direction: column; align-items: center; } .rte--header { margin-bottom: 0; } /*================ Basic Styles ================*/ html { scroll-behavior: smooth; --scroll-behavior: smooth; } html body { color: var(--text); background-color: var(--bg); } html body * { -webkit-font-smoothing: antialiased; } html, body { background-color: var(--bg); min-height: 100%; min-width: 320px; } body.no-outline *:focus { outline: 0; } [tabindex="-1"]:focus { outline: none; } .skip-link { position: absolute !important; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } hr { width: 75px; margin: 15px auto; border-width: var(--BORDER-WIDTH) 0 0; border-color: var(--border); } .item--left hr, .item--top-left hr, .item--bottom-left hr, .text-left hr { margin-left: 0; } .text-right hr { margin-right: 0; } @media only screen and (max-width: 767px) { .item--right hr, .item--top-right hr, .item--bottom-right hr { margin-left: 0; } } @media only screen and (min-width: 768px) { .item--right hr, .item--top-right hr, .item--bottom-right hr { margin-right: 0; } } hr.hr--clear { border-top-color: transparent; } hr.hr--full { width: 100%; } .form__item .hr--full, .divider-section .hr--full { margin: 0; } .wrapper--full { width: 100%; margin: 0 auto; padding: 0; max-width: 100%; } .wrapper--full:after { content: ""; display: table; clear: both; } .wrapper--full-padded { width: 100%; max-width: 100%; margin: 0 auto; padding: 0 var(--gutter-mobile); } .wrapper--full-padded:after { content: ""; display: table; clear: both; } @media only screen and (min-width: 1024px) { .wrapper--full-padded { padding: 0 var(--gutter); } } .wrapper { width: var(--site-width); max-width: 100%; margin: 0 auto; padding: 0 var(--gutter-mobile); } .wrapper:after { content: ""; display: table; clear: both; } @media only screen and (min-width: 1024px) { .wrapper { padding: 0 var(--gutter); } } .wrapper--narrow { width: var(--site-width-narrow); max-width: 100%; margin: 0 auto; padding: 0 var(--gutter-mobile); } .wrapper--narrow:after { content: ""; display: table; clear: both; } @media only screen and (min-width: 1024px) { .wrapper--narrow { padding: 0 var(--gutter); } } .section-default { background-color: var(--bg); } .section-padding { --padding-top: var(--PT); --padding-bottom: var(--PB); padding-top: var(--padding-top); padding-bottom: var(--padding-bottom); } @media only screen and (min-width: 768px) and (max-width: 1023px) { .section-padding { --padding-top: calc(var(--PT) * 0.8); --padding-bottom: calc(var(--PB) * 0.8); } } @media only screen and (max-width: 767px) { .section-padding { --padding-top: calc(var(--PT) * 0.6); --padding-bottom: calc(var(--PB) * 0.6); } } .main-content { display: block; overflow: initial; min-height: var(--content-min); } .main-content>.shopify-section:first-child { --full-height: var(--content-full); } .main-content>.shopify-section:first-child .collection__filters { --full-height: 100vh; } .section__header { --heading-margin: 20px; margin-bottom: calc(var(--gutter) / 2); } .section__heading { margin-bottom: var(--heading-margin); text-align: center; } .text-left .section__heading { text-align: left; } .text-right .section__heading { text-align: right; } .section__heading-line { --padding: 15px; margin-top: calc(var(--padding) - var(--heading-margin) - var(--BORDER-WIDTH) / 2); margin-bottom: calc(var(--padding) - var(--BORDER-WIDTH) / 2); } .section__heading-line:last-child { margin-bottom: 0; } .section__text { font-size: calc(1rem * var(--adjust-body)); margin-bottom: calc(var(--gutter) / 2); } .section__text:last-child { margin-bottom: 0; } .section__text p:first-child { margin-top: 0; } .section__text p:last-child { margin-bottom: 0; } .section__text p { font-size: inherit; } .main-heading { margin-bottom: 0; color: var(--heading); } .main-heading a, .slide__heading a { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .main-subheading { margin-bottom: 10px; } .main-text { display: block; margin-bottom: 10px; color: var(--text); } .main-buttons { margin: 4px -8px 0; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; } .text-left .main-buttons, .item--left .main-buttons, .item--bottom-left .main-buttons, .item--top-left .main-buttons, .align--top-left .main-buttons, .align--middle-left .main-buttons, .align--bottom-left .main-buttons { justify-content: flex-start; } @media only screen and (min-width: 768px) { .text-right .main-buttons, .item--right .main-buttons, .item--bottom-right .main-buttons, .item--top-right .main-buttons, .align--top-right .main-buttons, .align--middle-right .main-buttons, .align--bottom-right .main-buttons { justify-content: flex-end; } } @media only screen and (max-width: 479px) { .main-buttons { flex-flow: column; align-items: normal; } } .main-buttons--video { margin-top: 0; } .main-buttons--video .main-buttons__item { margin-top: 0; margin-bottom: 16px; } .main-buttons__item { display: flex; align-items: center; margin: 16px 8px 0; } .text-center .main-buttons__item, .item--center .main-buttons__item, .item--bottom-center .main-buttons__item, .item--top-center .main-buttons__item, .align--top-center .main-buttons__item, .align--middle-center .main-buttons__item, .align--bottom-center .main-buttons__item { justify-content: center; } .item { width: 100%; position: relative; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .item--center { text-align: center; } .item--center .image-accordion__text, .item--left .image-accordion__text, .item--right .image-accordion__text { justify-content: center; } .item--center .image-accordion__text, .item--center .banner-image__text-container, .item--center .slide__text__container, .item--left .image-accordion__text, .item--left .banner-image__text-container, .item--left .slide__text__container, .item--right .image-accordion__text, .item--right .banner-image__text-container, .item--right .slide__text__container { align-items: center; } .item--center .image-accordion__text, .item--center .banner-image__text-container, .item--center .slide__text__container { justify-content: center; } .item--left, .item--bottom-left, .item--top-left { text-align: left; } .item--left .image-accordion__text, .item--left .banner-image__text-container, .item--left .slide__text__container, .item--bottom-left .image-accordion__text, .item--bottom-left .banner-image__text-container, .item--bottom-left .slide__text__container, .item--top-left .image-accordion__text, .item--top-left .banner-image__text-container, .item--top-left .slide__text__container { justify-content: flex-start; } @media only screen and (min-width: 768px) { .item--right, .item--bottom-right, .item--top-right { text-align: right; } } @media only screen and (min-width: 768px) { .item--right .image-accordion__text, .item--right .banner-image__text-container, .item--right .slide__text__container, .item--bottom-right .image-accordion__text, .item--bottom-right .banner-image__text-container, .item--bottom-right .slide__text__container, .item--top-right .image-accordion__text, .item--top-right .banner-image__text-container, .item--top-right .slide__text__container { justify-content: flex-end; } } .item--bottom-left .image-accordion__text, .item--bottom-left .banner-image__text-container, .item--bottom-left .slide__text__container, .item--bottom-right .image-accordion__text, .item--bottom-right .banner-image__text-container, .item--bottom-right .slide__text__container { align-items: flex-end; } .item--top-left .image-accordion__text, .item--top-left .banner-image__text-container, .item--top-left .slide__text__container, .item--top-right .image-accordion__text, .item--top-right .banner-image__text-container, .item--top-right .slide__text__container { align-items: flex-start; } .body--rounded-corners { --radius: 8px; --radius-medium: 5px; --radius-small: 4px; } .body--rounded-corners #shopify-product-reviews .spr-container, .body--rounded-corners .image-with-text__items, .body--rounded-corners .image-with-text__items--overlay-left .image-with-text__content, .body--rounded-corners .image-with-text__items--overlay-right .image-with-text__content, .body--rounded-corners .products-list__item__image__frame, .body--rounded-corners .overlapping-images__image .placeholder-svg--overlayed, .body--rounded-corners .location__image, .body--rounded-corners .overlapping-images__image, .body--rounded-corners .blog-item__article__image, .body--rounded-corners .blog-item .overlay, .body--rounded-corners .blog-item__products, .body--rounded-corners .blog-item__article__time, .body--rounded-corners .blog__post-overlay, .body--rounded-corners .product-grid-item__image, .body--rounded-corners .product__media__container, .body--rounded-corners .product__media__slider:not(.flickity-enabled) .product-single__media, .body--rounded-corners .product-single__media-slider .product-single__media, .body--rounded-corners .featured-image__pane, .body--rounded-corners .brick__block, .body--rounded-corners .brick__block .product-grid-item, .body--rounded-corners .text__image, .body--rounded-corners .text__image--placeholder, .body--rounded-corners .accordion__item, .body--rounded-corners .rich-text__top-image, .body--rounded-corners .image-with-text__top-image, .body--rounded-corners .column__item__image, .body--rounded-corners .cart__widget, .body--rounded-corners .collection-promo, .body--rounded-corners .collection-promo__link, .body--rounded-corners .blog--photo .blog__post-item, .body--rounded-corners .blog__post-item .background-size-cover, .body--rounded-corners .blog__post-item .video-background, .body--rounded-corners .blog__post-image-link, .body--rounded-corners .collection__sort__option-wrapper, .body--rounded-corners .subcollection, .body--rounded-corners .deferred-media__poster, .body--rounded-corners .cart__item__image, .body--rounded-corners .article__image, .body--rounded-corners .blog__post-image, .body--rounded-corners .product-single__media-slider .flickity-viewport, .body--rounded-corners .upsell__products__slider .flickity-viewport, .body--rounded-corners .tab-collections__featured-item, .body--rounded-corners .mosaic--spacing .mosaic__wrapper .mosaic__item__inner, .body--rounded-corners .mosaic--single-block .wrapper--no-full .mosaic__item__inner, .body--rounded-corners .look__column--image, .body--rounded-corners .image-accordions--spacing, .body--rounded-corners .image-accordions--spacing .image-accordion__inner, .body--rounded-corners .product-upsell__image__thumb, .body--rounded-corners .product-upsell__image__link, .body--rounded-corners .promotion-row__item, .body--rounded-corners .navlink--image .image-fill, .body--rounded-corners .header__dropdown__image .image-fill, .body--rounded-corners .popup--bar .popup__image__img, .body--rounded-corners .cart .cart__message, .body--rounded-corners .icons-row__item--box, .body--rounded-corners .icons-row__image, .body--rounded-corners .icons-row__item .responsive-image, .body--rounded-corners .parent>.header__dropdown, .body--rounded-corners .product-upsell__holder--onboarding, .body--rounded-corners .section-image__image, .body--rounded-corners .upsell__products__slider:not(.flickity-enabled) .product-upsell__holder, .body--rounded-corners .product__feature, .body--rounded-corners .top-bar__image, .body--rounded-corners #shopify-product-reviews .spr-form-input, .body--rounded-corners #shopify-product-reviews .spr-form-message-error { border-radius: var(--radius); overflow: hidden; } .body--rounded-corners .accordion__item { overflow: visible; } .body--rounded-corners .product-single__thumbnail-link, .body--rounded-corners .product__icon__img, .body--rounded-corners .icons-row-block__img, .body--rounded-corners .result__image-img, .body--rounded-corners .result__image-link, .body--rounded-corners .search-result-page, .body--rounded-corners .pointer__image__bg { border-radius: var(--radius-medium); overflow: hidden; } .body--rounded-corners .testimonial__item__inner, .body--rounded-corners .popup__wrapper--center-center .popup__body, .body--rounded-corners .popup-quick-view .product-single__media img, .body--rounded-corners .popup-quick-view__nav-media:before, .body--rounded-corners .popup-quick-view__nav-media .product-single__thumbnail-img, .body--rounded-corners .popup-quick-view__nav-media .placeholder-svg, .body--rounded-corners .popup-quick-view__nav-media .placeholder-svg-filled, .body--rounded-corners .popup-quick-view__nav-media .no-image-placeholder, .body--rounded-corners .list-collections__item--rectangle .list-collections__item__image, .body--rounded-corners .list-collections__item--square .list-collections__item__image { border-radius: var(--radius); } .body--rounded-corners .popup-quick-view__form--large .flickity-viewport, .body--rounded-corners .wrapper--full .brick__blocks__flex--stuck .brick__block, .body--rounded-corners .wrapper--full .brick__blocks__flex--stuck .featured-image__pane, .body--rounded-corners .wrapper--full .collection-promo, .body--rounded-corners .wrapper--full .image-with-text__items, .body--rounded-corners .wrapper--full .image-with-text__items--inline-left .image-with-text__image-bg, .body--rounded-corners .wrapper--full .image-with-text__items--inline-right .image-with-text__image-bg, .body--rounded-corners .section-image--stretch .wrapper--full .section-image__image { border-radius: 0; } .body--rounded-corners .brick__block .product-grid-item__image, .body--rounded-corners .brick__block .product__media__container { border-radius: var(--radius) var(--radius) 0 0; } .body--rounded-corners .product__badge__item { border-radius: var(--radius-small); } .body--rounded-corners .custom-scrollbar { --radius-scrollbar: 3px; } @media only screen and (min-width: 768px) { .body--rounded-corners .wrapper--no-full>.mosaic__grid, .body--rounded-corners .image-with-text__image-bg { border-radius: var(--radius); overflow: hidden; } .body--rounded-corners .image-accordions--spacing .image-accordion__inner { border-radius: 0; } .body--rounded-corners .popup__wrapper--bottom-left .popup__body { border-top-right-radius: var(--radius); } .body--rounded-corners .popup__wrapper--bottom-right .popup__body { border-top-left-radius: var(--radius); } .body--rounded-corners .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child), .body--rounded-corners .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child) .featured-image__pane, .body--rounded-corners .section-image--right .wrapper--full .section-image__image { border-top-right-radius: 0; border-bottom-right-radius: 0; } .body--rounded-corners .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child), .body--rounded-corners .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child) .featured-image__pane, .body--rounded-corners .section-image--left .wrapper--full .section-image__image { border-top-left-radius: 0; border-bottom-left-radius: 0; } .body--rounded-corners .wrapper--full .image-with-text__items--overlay-right .image-with-text__image-bg, .body--rounded-corners .wrapper--full .image-with-text__items--overlay-left .image-with-text__content { border-top-right-radius: 0; border-bottom-right-radius: 0; } .body--rounded-corners .wrapper--full .image-with-text__items--overlay-left .image-with-text__image-bg, .body--rounded-corners .wrapper--full .image-with-text__items--overlay-right .image-with-text__content { border-top-left-radius: 0; border-bottom-left-radius: 0; } } @media only screen and (max-width: 767px) { .body--rounded-corners .mosaic--mobile-slider .mosaic__item__inner, .body--rounded-corners .mosaic--no-spacing.mosaic--mobile-grid.mosaic--single-block .wrapper--no-full .mosaic__item__inner { border-radius: var(--radius); } .body--rounded-corners .mosaic--no-spacing.mosaic--mobile-slider.mosaic--single-block .wrapper--full .mosaic__item__inner, .body--rounded-corners .mosaic--spacing.mosaic--mobile-grid .wrapper--full .mosaic__item__inner, .body--rounded-corners .mosaic--no-spacing.mosaic--mobile-grid .wrapper--full .mosaic__item__inner, .body--rounded-corners .wrapper--full .section-image__image { border-radius: 0; } .body--rounded-corners .mosaic--no-spacing.mosaic--mobile-grid.mosaic--multiple-blocks .wrapper--no-full .mosaic__item--1 .mosaic__item__inner { border-top-left-radius: var(--radius); border-top-right-radius: var(--radius); } .body--rounded-corners .mosaic--no-spacing.mosaic--mobile-grid.mosaic--multiple-blocks .wrapper--no-full .mosaic__item:last-child .mosaic__item__inner { border-bottom-left-radius: var(--radius); border-bottom-right-radius: var(--radius); } .body--rounded-corners .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child), .body--rounded-corners .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child) .featured-image__pane { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .body--rounded-corners .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child), .body--rounded-corners .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child) .featured-image__pane { border-top-left-radius: 0; border-top-right-radius: 0; } .body--rounded-corners .image-accordions--spacing { border-radius: 0; } .body--rounded-corners .wrapper--full-padded .image-with-text__items--inline-left .image-with-text__image-bg, .body--rounded-corners .wrapper--full-padded .image-with-text__items--inline-right .image-with-text__image-bg, .body--rounded-corners .wrapper .image-with-text__items--inline-left .image-with-text__image-bg, .body--rounded-corners .wrapper .image-with-text__items--inline-right .image-with-text__image-bg { border-radius: var(--radius); } } @media only screen and (min-width: 768px) { .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child), .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child) .featured-image__pane { border-bottom-right-radius: 0; border-top-right-radius: 0; } } @media only screen and (max-width: 767px) { .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child), .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:first-child:not(:only-child) .featured-image__pane { border-radius: var(--radius) var(--radius) 0 0; } } @media only screen and (min-width: 768px) { .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child), .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child) .featured-image__pane { border-bottom-left-radius: 0; border-top-left-radius: 0; } } @media only screen and (max-width: 767px) { .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child), .body--rounded-corners .brick__section .brick__section__wrapper:not(.wrapper--full) .brick__blocks__flex--stuck .brick__block:last-child:not(:only-child) .featured-image__pane { border-radius: 0 0 var(--radius) var(--radius); } } /*================ Section Headers ================*/ .section-header { padding-top: var(--gutter); padding-bottom: var(--gutter); text-align: center; } @media only screen and (max-width: 767px) { .section-header { padding-top: calc(var(--gutter) / 2); padding-bottom: calc(var(--gutter) / 2); } } .table { display: table; table-layout: fixed; width: 100%; margin-left: auto; margin-right: auto; } .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; background: var(--overlay); opacity: var(--overlay-opacity); } #shopify-product-reviews { font-size: calc(0.9rem * var(--adjust-body)); font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); } #shopify-product-reviews .spr-summary-starrating .spr-icon { color: var(--accent); } #shopify-product-reviews .spr-review-header-starratings [class^=spr-icon-]:before, #shopify-product-reviews .spr-review-header-starratings [class*=" spr-icon-"]:before { font-size: 100%; } #shopify-product-reviews .spr-icon-star:before { content: "\e800"; } #shopify-product-reviews .spr-icon-star-empty:before { content: "\e801"; } #shopify-product-reviews .spr-icon-star-hover:before { content: "\e800"; } #shopify-product-reviews .spr-icon-star:hover:before, #shopify-product-reviews .spr-icon-star:hover:after, #shopify-product-reviews .spr-icon-star:before, #shopify-product-reviews .spr-icon-star:after { position: static; height: auto; width: auto; bottom: auto; left: auto; display: inline; background: none; transition: none; } #shopify-product-reviews .spr-container { border: var(--BORDER-WIDTH) solid var(--COLOR-BLACK-WHITE); } #shopify-product-reviews .spr-form-input { border-radius: 0; margin-top: 2px; } #shopify-product-reviews .spr-review-reportreview, #shopify-product-reviews .spr-pagination-page a { transition: opacity 0.3s; } #shopify-product-reviews .spr-review-reportreview:hover, #shopify-product-reviews .spr-pagination-page a:hover { opacity: 0.65; } #shopify-product-reviews .spr-review-reportreview { font-size: calc(0.75rem * var(--adjust-body)); } #shopify-product-reviews .spr-review-reportreview:before, #shopify-product-reviews .spr-review-reportreview:after { display: none; } #shopify-product-reviews .spr-form, #shopify-product-reviews .spr-review { border-color: var(--COLOR-BORDER); border-width: var(--BORDER-WIDTH); } #shopify-product-reviews .spr-form-title { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); font-size: calc(1.1rem * var(--adjust-body)); padding-bottom: 10px; } #shopify-product-reviews .spr-review-footer { margin-bottom: 0; } #shopify-product-reviews .spr-header-title { font-size: calc(1.75rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { #shopify-product-reviews .spr-header-title { font-size: calc(1.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { #shopify-product-reviews .spr-header-title { font-size: calc(1.25rem * var(--adjust-heading)); } } #shopify-product-reviews .spr-review-header-title { font-size: calc(1rem * var(--adjust-body)); font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); } #shopify-product-reviews .spr-review-header-byline { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); font-size: calc(0.8rem * var(--adjust-body)); } #shopify-product-reviews .spr-review-header-byline strong { font-weight: var(--FONT-WEIGHT-BODY); font-size: calc(0.8rem * var(--adjust-body)); } #shopify-product-reviews .spr-summary a { position: relative; display: inline-block; text-decoration: none !important; } #shopify-product-reviews .spr-summary a:before, #shopify-product-reviews .spr-summary a:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } #shopify-product-reviews .spr-summary a:before { transform: scaleX(0); transform-origin: left; } #shopify-product-reviews .spr-summary a:after { transform-origin: right; } .no-touch #shopify-product-reviews .spr-summary a:hover { background: transparent; border: 0; } .no-touch #shopify-product-reviews .spr-summary a:hover:before, .no-touch #shopify-product-reviews .spr-summary a:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch #shopify-product-reviews .spr-summary a:hover:before { transform: scaleX(1); transition-delay: 0.25s; } #shopify-product-reviews .spr-summary, #shopify-product-reviews .spr-starratings, #shopify-product-reviews .spr-summary-actions-newreview, #shopify-product-reviews .spr-summary-caption, #shopify-product-reviews .spr-review-content-body { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); font-size: inherit; line-height: 1.5625; } #shopify-product-reviews .spr-reviews { margin-top: 1rem; } #shopify-product-reviews .spr-summary { margin-bottom: 0; } #shopify-product-reviews .spr-review-content { margin: 0; } #shopify-product-reviews .spr-review .spr-summary-actions-newreview:before, #shopify-product-reviews .spr-review .spr-summary-actions-newreview:after { display: none; } #shopify-product-reviews .spr-icon, #shopify-product-reviews .spr-form-label { font-size: inherit; } #shopify-product-reviews .spr-pagination-page a, #shopify-product-reviews .spr-pagination-page.is-active, #shopify-product-reviews .spr-pagination-deco, #shopify-product-reviews .spr-pagination-next a, #shopify-product-reviews .spr-pagination-prev a { padding: 8px; display: inline-block; line-height: 1.2; } #shopify-product-reviews .spr-pagination-page a:before, #shopify-product-reviews .spr-pagination-page a:after, #shopify-product-reviews .spr-pagination-page.is-active:before, #shopify-product-reviews .spr-pagination-page.is-active:after, #shopify-product-reviews .spr-pagination-deco:before, #shopify-product-reviews .spr-pagination-deco:after, #shopify-product-reviews .spr-pagination-next a:before, #shopify-product-reviews .spr-pagination-next a:after, #shopify-product-reviews .spr-pagination-prev a:before, #shopify-product-reviews .spr-pagination-prev a:after { display: none; } #shopify-product-reviews .spr-pagination-page.is-active { border-bottom: var(--BORDER-WIDTH) solid var(--text); font-weight: var(--FONT-WEIGHT-BODY); } #shopify-product-reviews .spr-pagination-prev, #shopify-product-reviews .spr-pagination-next { position: static; } #shopify-product-reviews .spr-form-message-error { background: var(--error); } #shopify-product-reviews .spr-form-input-error, #shopify-product-reviews input.spr-form-input-error[type=text], #shopify-product-reviews input.spr-form-input-error[type=email] { border-color: var(--error); } #shopify-product-reviews .spr-form-input-error .spr-icon { color: var(--error); } [data-collapsible-container] { position: relative; width: 100%; height: 0; opacity: 0; overflow: hidden; visibility: hidden; will-change: height; transition: opacity 0.3s ease, height 0.3s ease, visibility 0s 0.3s; -webkit-backface-visibility: hidden; backface-visibility: hidden; } [data-collapsible-container].is-expanded { opacity: 1; overflow: unset; visibility: visible; transition: opacity 1s ease, height 0.5s ease, visibility 0s; } [data-collapsible-content] { overflow: hidden; will-change: transform; transform: translateY(25px); transition: transform 0.5s ease; } .is-expanded>[data-collapsible-content] { transform: translateY(0); } [data-collapsible-trigger], [data-collapsible-trigger-mobile] { position: relative; display: flex; align-items: center; justify-content: center; color: inherit; cursor: pointer; min-width: 22px; } [data-collapsible-trigger] .icon, [data-collapsible-trigger-mobile] .icon { position: absolute; color: inherit; display: flex; align-items: center; justify-content: center; } [data-collapsible-trigger] .icon-toggle-plus, [data-collapsible-trigger] .icon-toggle-minus, [data-collapsible-trigger-mobile] .icon-toggle-plus, [data-collapsible-trigger-mobile] .icon-toggle-minus { width: 16px; height: 16px; } [data-collapsible-trigger] .icon-toggle-plus, [data-collapsible-trigger] .icon-toggle-minus, [data-collapsible-trigger-mobile] .icon-toggle-plus, [data-collapsible-trigger-mobile] .icon-toggle-minus { transition: opacity 0.3s ease, transform 0.3s ease; } [data-collapsible-trigger] .icon-toggle-minus, [data-collapsible-trigger-mobile] .icon-toggle-minus { opacity: 0; } [data-collapsible-trigger].is-expanded>.icon-toggle-plus, [data-collapsible-trigger-mobile].is-expanded>.icon-toggle-plus { opacity: 0; transform: rotate(180deg); } [data-collapsible-trigger].is-expanded>.icon-toggle-minus, [data-collapsible-trigger-mobile].is-expanded>.icon-toggle-minus { opacity: 1; transform: rotate(180deg); } @media only screen and (max-width: 767px) { [data-collapsible-container-mobile] { position: relative; width: 100%; height: 0; opacity: 0; overflow: hidden; visibility: hidden; will-change: height; transition: opacity 0.3s ease, height 0.3s ease, visibility 0s 0.3s; -webkit-backface-visibility: hidden; backface-visibility: hidden; } [data-collapsible-container-mobile].is-expanded { opacity: 1; overflow: unset; visibility: visible; transition: opacity 1s ease, height 0.5s ease, visibility 0s; } [data-collapsible-content-mobile] { transform: translateY(25px); transition: transform 0.5s ease; } .is-expanded>[data-collapsible-content-mobile] { transform: translateY(0); } } /* * Social sharing */ .share-button { position: relative; } .share-button .tooltip-default { top: 100%; z-index: 1; } /* Tooltip Default */ .tooltip-default { position: absolute; z-index: 10001; top: 0; left: 0; pointer-events: none; transform: translate3d(0, 0, 0); } .tooltip-default__inner { position: relative; display: inline-block; max-width: 100%; opacity: 0; transform: translateY(8px); transition: opacity 0.2s ease-out, transform 0.2s ease-out; } .tooltip-default__arrow { position: absolute; top: 4px; left: 50%; z-index: 1; width: 10px; height: 10px; margin-left: -5px; background: var(--bg); border: var(--BORDER-WIDTH) solid var(--border); border-width: 0 0 var(--BORDER-WIDTH) var(--BORDER-WIDTH); transform: rotate(135deg); } .tooltip-default__text { position: relative; margin-top: 10px; background: var(--bg); color: var(--text-dark); padding: 2px 8px; border-radius: 0; box-shadow: 0 0 0 var(--BORDER-WIDTH) var(--border); font-size: calc(0.785rem * var(--adjust-body)); text-align: center; } @keyframes tooltip { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } } /*=== Modifiers ===*/ .aos-initialized .tooltip-default.is-animating { opacity: 0; } .tooltip-default.is-hiding .tooltip-default__inner { opacity: 1; transform: translateY(0); } .tooltip-default.is-visible .tooltip-default__inner { transition: none; animation: tooltip 0.2s ease-out; animation-fill-mode: forwards; } .custom-scrollbar { --thumb-scale: 0; --thumb-position: 0px; --track-width: 100%; --radius-scrollbar: 0px; position: relative; min-width: var(--track-width); width: 100%; height: 5px; padding: 0; margin-top: 10px; background: var(--text-alpha-5); border-radius: var(--radius-scrollbar); overflow: hidden; } .custom-scrollbar__thumb { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: translateX(var(--thumb-position)); transform-origin: left; transition: transform 0.3s ease-in-out; will-change: transform; } .custom-scrollbar__thumb::before { content: ""; display: block; width: 100%; height: 100%; background: var(--accent); transform: scaleX(var(--thumb-scale)); transform-origin: left; transition: transform 0.3s ease-in-out; will-change: transform; } /*================ VENDOR ================*/ .aos-initialized [data-aos][data-aos][data-aos-duration="50"], .aos-initialized[data-aos-duration="50"] [data-aos] { transition-duration: 50ms; } .aos-initialized [data-aos][data-aos][data-aos-delay="50"], .aos-initialized[data-aos-delay="50"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="50"].aos-animate, .aos-initialized[data-aos-delay="50"] [data-aos].aos-animate { transition-delay: 50ms; } .aos-initialized [data-aos][data-aos][data-aos-duration="100"], .aos-initialized[data-aos-duration="100"] [data-aos] { transition-duration: 0.1s; } .aos-initialized [data-aos][data-aos][data-aos-delay="100"], .aos-initialized[data-aos-delay="100"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="100"].aos-animate, .aos-initialized[data-aos-delay="100"] [data-aos].aos-animate { transition-delay: 0.1s; } .aos-initialized [data-aos][data-aos][data-aos-duration="150"], .aos-initialized[data-aos-duration="150"] [data-aos] { transition-duration: 0.15s; } .aos-initialized [data-aos][data-aos][data-aos-delay="150"], .aos-initialized[data-aos-delay="150"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="150"].aos-animate, .aos-initialized[data-aos-delay="150"] [data-aos].aos-animate { transition-delay: 0.15s; } .aos-initialized [data-aos][data-aos][data-aos-duration="200"], .aos-initialized[data-aos-duration="200"] [data-aos] { transition-duration: 0.2s; } .aos-initialized [data-aos][data-aos][data-aos-delay="200"], .aos-initialized[data-aos-delay="200"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="200"].aos-animate, .aos-initialized[data-aos-delay="200"] [data-aos].aos-animate { transition-delay: 0.2s; } .aos-initialized [data-aos][data-aos][data-aos-duration="250"], .aos-initialized[data-aos-duration="250"] [data-aos] { transition-duration: 0.25s; } .aos-initialized [data-aos][data-aos][data-aos-delay="250"], .aos-initialized[data-aos-delay="250"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="250"].aos-animate, .aos-initialized[data-aos-delay="250"] [data-aos].aos-animate { transition-delay: 0.25s; } .aos-initialized [data-aos][data-aos][data-aos-duration="300"], .aos-initialized[data-aos-duration="300"] [data-aos] { transition-duration: 0.3s; } .aos-initialized [data-aos][data-aos][data-aos-delay="300"], .aos-initialized[data-aos-delay="300"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="300"].aos-animate, .aos-initialized[data-aos-delay="300"] [data-aos].aos-animate { transition-delay: 0.3s; } .aos-initialized [data-aos][data-aos][data-aos-duration="350"], .aos-initialized[data-aos-duration="350"] [data-aos] { transition-duration: 0.35s; } .aos-initialized [data-aos][data-aos][data-aos-delay="350"], .aos-initialized[data-aos-delay="350"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="350"].aos-animate, .aos-initialized[data-aos-delay="350"] [data-aos].aos-animate { transition-delay: 0.35s; } .aos-initialized [data-aos][data-aos][data-aos-duration="400"], .aos-initialized[data-aos-duration="400"] [data-aos] { transition-duration: 0.4s; } .aos-initialized [data-aos][data-aos][data-aos-delay="400"], .aos-initialized[data-aos-delay="400"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="400"].aos-animate, .aos-initialized[data-aos-delay="400"] [data-aos].aos-animate { transition-delay: 0.4s; } .aos-initialized [data-aos][data-aos][data-aos-duration="450"], .aos-initialized[data-aos-duration="450"] [data-aos] { transition-duration: 0.45s; } .aos-initialized [data-aos][data-aos][data-aos-delay="450"], .aos-initialized[data-aos-delay="450"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="450"].aos-animate, .aos-initialized[data-aos-delay="450"] [data-aos].aos-animate { transition-delay: 0.45s; } .aos-initialized [data-aos][data-aos][data-aos-duration="500"], .aos-initialized[data-aos-duration="500"] [data-aos] { transition-duration: 0.5s; } .aos-initialized [data-aos][data-aos][data-aos-delay="500"], .aos-initialized[data-aos-delay="500"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="500"].aos-animate, .aos-initialized[data-aos-delay="500"] [data-aos].aos-animate { transition-delay: 0.5s; } .aos-initialized [data-aos][data-aos][data-aos-duration="550"], .aos-initialized[data-aos-duration="550"] [data-aos] { transition-duration: 0.55s; } .aos-initialized [data-aos][data-aos][data-aos-delay="550"], .aos-initialized[data-aos-delay="550"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="550"].aos-animate, .aos-initialized[data-aos-delay="550"] [data-aos].aos-animate { transition-delay: 0.55s; } .aos-initialized [data-aos][data-aos][data-aos-duration="600"], .aos-initialized[data-aos-duration="600"] [data-aos] { transition-duration: 0.6s; } .aos-initialized [data-aos][data-aos][data-aos-delay="600"], .aos-initialized[data-aos-delay="600"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="600"].aos-animate, .aos-initialized[data-aos-delay="600"] [data-aos].aos-animate { transition-delay: 0.6s; } .aos-initialized [data-aos][data-aos][data-aos-duration="650"], .aos-initialized[data-aos-duration="650"] [data-aos] { transition-duration: 0.65s; } .aos-initialized [data-aos][data-aos][data-aos-delay="650"], .aos-initialized[data-aos-delay="650"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="650"].aos-animate, .aos-initialized[data-aos-delay="650"] [data-aos].aos-animate { transition-delay: 0.65s; } .aos-initialized [data-aos][data-aos][data-aos-duration="700"], .aos-initialized[data-aos-duration="700"] [data-aos] { transition-duration: 0.7s; } .aos-initialized [data-aos][data-aos][data-aos-delay="700"], .aos-initialized[data-aos-delay="700"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="700"].aos-animate, .aos-initialized[data-aos-delay="700"] [data-aos].aos-animate { transition-delay: 0.7s; } .aos-initialized [data-aos][data-aos][data-aos-duration="750"], .aos-initialized[data-aos-duration="750"] [data-aos] { transition-duration: 0.75s; } .aos-initialized [data-aos][data-aos][data-aos-delay="750"], .aos-initialized[data-aos-delay="750"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="750"].aos-animate, .aos-initialized[data-aos-delay="750"] [data-aos].aos-animate { transition-delay: 0.75s; } .aos-initialized [data-aos][data-aos][data-aos-duration="800"], .aos-initialized[data-aos-duration="800"] [data-aos] { transition-duration: 0.8s; } .aos-initialized [data-aos][data-aos][data-aos-delay="800"], .aos-initialized[data-aos-delay="800"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="800"].aos-animate, .aos-initialized[data-aos-delay="800"] [data-aos].aos-animate { transition-delay: 0.8s; } .aos-initialized [data-aos][data-aos][data-aos-duration="850"], .aos-initialized[data-aos-duration="850"] [data-aos] { transition-duration: 0.85s; } .aos-initialized [data-aos][data-aos][data-aos-delay="850"], .aos-initialized[data-aos-delay="850"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="850"].aos-animate, .aos-initialized[data-aos-delay="850"] [data-aos].aos-animate { transition-delay: 0.85s; } .aos-initialized [data-aos][data-aos][data-aos-duration="900"], .aos-initialized[data-aos-duration="900"] [data-aos] { transition-duration: 0.9s; } .aos-initialized [data-aos][data-aos][data-aos-delay="900"], .aos-initialized[data-aos-delay="900"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="900"].aos-animate, .aos-initialized[data-aos-delay="900"] [data-aos].aos-animate { transition-delay: 0.9s; } .aos-initialized [data-aos][data-aos][data-aos-duration="950"], .aos-initialized[data-aos-duration="950"] [data-aos] { transition-duration: 0.95s; } .aos-initialized [data-aos][data-aos][data-aos-delay="950"], .aos-initialized[data-aos-delay="950"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="950"].aos-animate, .aos-initialized[data-aos-delay="950"] [data-aos].aos-animate { transition-delay: 0.95s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1000"], .aos-initialized[data-aos-duration="1000"] [data-aos] { transition-duration: 1s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1000"], .aos-initialized[data-aos-delay="1000"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1000"].aos-animate, .aos-initialized[data-aos-delay="1000"] [data-aos].aos-animate { transition-delay: 1s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1050"], .aos-initialized[data-aos-duration="1050"] [data-aos] { transition-duration: 1.05s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1050"], .aos-initialized[data-aos-delay="1050"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1050"].aos-animate, .aos-initialized[data-aos-delay="1050"] [data-aos].aos-animate { transition-delay: 1.05s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1100"], .aos-initialized[data-aos-duration="1100"] [data-aos] { transition-duration: 1.1s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1100"], .aos-initialized[data-aos-delay="1100"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1100"].aos-animate, .aos-initialized[data-aos-delay="1100"] [data-aos].aos-animate { transition-delay: 1.1s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1150"], .aos-initialized[data-aos-duration="1150"] [data-aos] { transition-duration: 1.15s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1150"], .aos-initialized[data-aos-delay="1150"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1150"].aos-animate, .aos-initialized[data-aos-delay="1150"] [data-aos].aos-animate { transition-delay: 1.15s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1200"], .aos-initialized[data-aos-duration="1200"] [data-aos] { transition-duration: 1.2s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1200"], .aos-initialized[data-aos-delay="1200"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1200"].aos-animate, .aos-initialized[data-aos-delay="1200"] [data-aos].aos-animate { transition-delay: 1.2s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1250"], .aos-initialized[data-aos-duration="1250"] [data-aos] { transition-duration: 1.25s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1250"], .aos-initialized[data-aos-delay="1250"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1250"].aos-animate, .aos-initialized[data-aos-delay="1250"] [data-aos].aos-animate { transition-delay: 1.25s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1300"], .aos-initialized[data-aos-duration="1300"] [data-aos] { transition-duration: 1.3s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1300"], .aos-initialized[data-aos-delay="1300"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1300"].aos-animate, .aos-initialized[data-aos-delay="1300"] [data-aos].aos-animate { transition-delay: 1.3s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1350"], .aos-initialized[data-aos-duration="1350"] [data-aos] { transition-duration: 1.35s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1350"], .aos-initialized[data-aos-delay="1350"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1350"].aos-animate, .aos-initialized[data-aos-delay="1350"] [data-aos].aos-animate { transition-delay: 1.35s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1400"], .aos-initialized[data-aos-duration="1400"] [data-aos] { transition-duration: 1.4s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1400"], .aos-initialized[data-aos-delay="1400"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1400"].aos-animate, .aos-initialized[data-aos-delay="1400"] [data-aos].aos-animate { transition-delay: 1.4s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1450"], .aos-initialized[data-aos-duration="1450"] [data-aos] { transition-duration: 1.45s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1450"], .aos-initialized[data-aos-delay="1450"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1450"].aos-animate, .aos-initialized[data-aos-delay="1450"] [data-aos].aos-animate { transition-delay: 1.45s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1500"], .aos-initialized[data-aos-duration="1500"] [data-aos] { transition-duration: 1.5s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1500"], .aos-initialized[data-aos-delay="1500"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1500"].aos-animate, .aos-initialized[data-aos-delay="1500"] [data-aos].aos-animate { transition-delay: 1.5s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1550"], .aos-initialized[data-aos-duration="1550"] [data-aos] { transition-duration: 1.55s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1550"], .aos-initialized[data-aos-delay="1550"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1550"].aos-animate, .aos-initialized[data-aos-delay="1550"] [data-aos].aos-animate { transition-delay: 1.55s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1600"], .aos-initialized[data-aos-duration="1600"] [data-aos] { transition-duration: 1.6s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1600"], .aos-initialized[data-aos-delay="1600"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1600"].aos-animate, .aos-initialized[data-aos-delay="1600"] [data-aos].aos-animate { transition-delay: 1.6s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1650"], .aos-initialized[data-aos-duration="1650"] [data-aos] { transition-duration: 1.65s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1650"], .aos-initialized[data-aos-delay="1650"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1650"].aos-animate, .aos-initialized[data-aos-delay="1650"] [data-aos].aos-animate { transition-delay: 1.65s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1700"], .aos-initialized[data-aos-duration="1700"] [data-aos] { transition-duration: 1.7s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1700"], .aos-initialized[data-aos-delay="1700"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1700"].aos-animate, .aos-initialized[data-aos-delay="1700"] [data-aos].aos-animate { transition-delay: 1.7s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1750"], .aos-initialized[data-aos-duration="1750"] [data-aos] { transition-duration: 1.75s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1750"], .aos-initialized[data-aos-delay="1750"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1750"].aos-animate, .aos-initialized[data-aos-delay="1750"] [data-aos].aos-animate { transition-delay: 1.75s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1800"], .aos-initialized[data-aos-duration="1800"] [data-aos] { transition-duration: 1.8s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1800"], .aos-initialized[data-aos-delay="1800"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1800"].aos-animate, .aos-initialized[data-aos-delay="1800"] [data-aos].aos-animate { transition-delay: 1.8s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1850"], .aos-initialized[data-aos-duration="1850"] [data-aos] { transition-duration: 1.85s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1850"], .aos-initialized[data-aos-delay="1850"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1850"].aos-animate, .aos-initialized[data-aos-delay="1850"] [data-aos].aos-animate { transition-delay: 1.85s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1900"], .aos-initialized[data-aos-duration="1900"] [data-aos] { transition-duration: 1.9s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1900"], .aos-initialized[data-aos-delay="1900"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1900"].aos-animate, .aos-initialized[data-aos-delay="1900"] [data-aos].aos-animate { transition-delay: 1.9s; } .aos-initialized [data-aos][data-aos][data-aos-duration="1950"], .aos-initialized[data-aos-duration="1950"] [data-aos] { transition-duration: 1.95s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1950"], .aos-initialized[data-aos-delay="1950"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="1950"].aos-animate, .aos-initialized[data-aos-delay="1950"] [data-aos].aos-animate { transition-delay: 1.95s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2000"], .aos-initialized[data-aos-duration="2000"] [data-aos] { transition-duration: 2s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2000"], .aos-initialized[data-aos-delay="2000"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2000"].aos-animate, .aos-initialized[data-aos-delay="2000"] [data-aos].aos-animate { transition-delay: 2s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2050"], .aos-initialized[data-aos-duration="2050"] [data-aos] { transition-duration: 2.05s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2050"], .aos-initialized[data-aos-delay="2050"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2050"].aos-animate, .aos-initialized[data-aos-delay="2050"] [data-aos].aos-animate { transition-delay: 2.05s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2100"], .aos-initialized[data-aos-duration="2100"] [data-aos] { transition-duration: 2.1s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2100"], .aos-initialized[data-aos-delay="2100"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2100"].aos-animate, .aos-initialized[data-aos-delay="2100"] [data-aos].aos-animate { transition-delay: 2.1s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2150"], .aos-initialized[data-aos-duration="2150"] [data-aos] { transition-duration: 2.15s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2150"], .aos-initialized[data-aos-delay="2150"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2150"].aos-animate, .aos-initialized[data-aos-delay="2150"] [data-aos].aos-animate { transition-delay: 2.15s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2200"], .aos-initialized[data-aos-duration="2200"] [data-aos] { transition-duration: 2.2s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2200"], .aos-initialized[data-aos-delay="2200"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2200"].aos-animate, .aos-initialized[data-aos-delay="2200"] [data-aos].aos-animate { transition-delay: 2.2s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2250"], .aos-initialized[data-aos-duration="2250"] [data-aos] { transition-duration: 2.25s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2250"], .aos-initialized[data-aos-delay="2250"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2250"].aos-animate, .aos-initialized[data-aos-delay="2250"] [data-aos].aos-animate { transition-delay: 2.25s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2300"], .aos-initialized[data-aos-duration="2300"] [data-aos] { transition-duration: 2.3s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2300"], .aos-initialized[data-aos-delay="2300"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2300"].aos-animate, .aos-initialized[data-aos-delay="2300"] [data-aos].aos-animate { transition-delay: 2.3s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2350"], .aos-initialized[data-aos-duration="2350"] [data-aos] { transition-duration: 2.35s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2350"], .aos-initialized[data-aos-delay="2350"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2350"].aos-animate, .aos-initialized[data-aos-delay="2350"] [data-aos].aos-animate { transition-delay: 2.35s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2400"], .aos-initialized[data-aos-duration="2400"] [data-aos] { transition-duration: 2.4s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2400"], .aos-initialized[data-aos-delay="2400"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2400"].aos-animate, .aos-initialized[data-aos-delay="2400"] [data-aos].aos-animate { transition-delay: 2.4s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2450"], .aos-initialized[data-aos-duration="2450"] [data-aos] { transition-duration: 2.45s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2450"], .aos-initialized[data-aos-delay="2450"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2450"].aos-animate, .aos-initialized[data-aos-delay="2450"] [data-aos].aos-animate { transition-delay: 2.45s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2500"], .aos-initialized[data-aos-duration="2500"] [data-aos] { transition-duration: 2.5s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2500"], .aos-initialized[data-aos-delay="2500"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2500"].aos-animate, .aos-initialized[data-aos-delay="2500"] [data-aos].aos-animate { transition-delay: 2.5s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2550"], .aos-initialized[data-aos-duration="2550"] [data-aos] { transition-duration: 2.55s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2550"], .aos-initialized[data-aos-delay="2550"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2550"].aos-animate, .aos-initialized[data-aos-delay="2550"] [data-aos].aos-animate { transition-delay: 2.55s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2600"], .aos-initialized[data-aos-duration="2600"] [data-aos] { transition-duration: 2.6s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2600"], .aos-initialized[data-aos-delay="2600"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2600"].aos-animate, .aos-initialized[data-aos-delay="2600"] [data-aos].aos-animate { transition-delay: 2.6s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2650"], .aos-initialized[data-aos-duration="2650"] [data-aos] { transition-duration: 2.65s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2650"], .aos-initialized[data-aos-delay="2650"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2650"].aos-animate, .aos-initialized[data-aos-delay="2650"] [data-aos].aos-animate { transition-delay: 2.65s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2700"], .aos-initialized[data-aos-duration="2700"] [data-aos] { transition-duration: 2.7s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2700"], .aos-initialized[data-aos-delay="2700"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2700"].aos-animate, .aos-initialized[data-aos-delay="2700"] [data-aos].aos-animate { transition-delay: 2.7s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2750"], .aos-initialized[data-aos-duration="2750"] [data-aos] { transition-duration: 2.75s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2750"], .aos-initialized[data-aos-delay="2750"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2750"].aos-animate, .aos-initialized[data-aos-delay="2750"] [data-aos].aos-animate { transition-delay: 2.75s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2800"], .aos-initialized[data-aos-duration="2800"] [data-aos] { transition-duration: 2.8s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2800"], .aos-initialized[data-aos-delay="2800"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2800"].aos-animate, .aos-initialized[data-aos-delay="2800"] [data-aos].aos-animate { transition-delay: 2.8s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2850"], .aos-initialized[data-aos-duration="2850"] [data-aos] { transition-duration: 2.85s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2850"], .aos-initialized[data-aos-delay="2850"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2850"].aos-animate, .aos-initialized[data-aos-delay="2850"] [data-aos].aos-animate { transition-delay: 2.85s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2900"], .aos-initialized[data-aos-duration="2900"] [data-aos] { transition-duration: 2.9s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2900"], .aos-initialized[data-aos-delay="2900"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2900"].aos-animate, .aos-initialized[data-aos-delay="2900"] [data-aos].aos-animate { transition-delay: 2.9s; } .aos-initialized [data-aos][data-aos][data-aos-duration="2950"], .aos-initialized[data-aos-duration="2950"] [data-aos] { transition-duration: 2.95s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2950"], .aos-initialized[data-aos-delay="2950"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="2950"].aos-animate, .aos-initialized[data-aos-delay="2950"] [data-aos].aos-animate { transition-delay: 2.95s; } .aos-initialized [data-aos][data-aos][data-aos-duration="3000"], .aos-initialized[data-aos-duration="3000"] [data-aos] { transition-duration: 3s; } .aos-initialized [data-aos][data-aos][data-aos-delay="3000"], .aos-initialized[data-aos-delay="3000"] [data-aos] { transition-delay: 0s; } .aos-initialized [data-aos][data-aos][data-aos-delay="3000"].aos-animate, .aos-initialized[data-aos-delay="3000"] [data-aos].aos-animate { transition-delay: 3s; } .aos-initialized [data-aos][data-aos][data-aos-easing=linear], .aos-initialized[data-aos-easing=linear] [data-aos] { transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease], .aos-initialized[data-aos-easing=ease] [data-aos] { transition-timing-function: ease; } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in], .aos-initialized[data-aos-easing=ease-in] [data-aos] { transition-timing-function: ease-in; } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-out], .aos-initialized[data-aos-easing=ease-out] [data-aos] { transition-timing-function: ease-out; } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-out], .aos-initialized[data-aos-easing=ease-in-out] [data-aos] { transition-timing-function: ease-in-out; } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-back], .aos-initialized[data-aos-easing=ease-in-back] [data-aos] { transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-out-back], .aos-initialized[data-aos-easing=ease-out-back] [data-aos] { transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-out-back], .aos-initialized[data-aos-easing=ease-in-out-back] [data-aos] { transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-sine], .aos-initialized[data-aos-easing=ease-in-sine] [data-aos] { transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-out-sine], .aos-initialized[data-aos-easing=ease-out-sine] [data-aos] { transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-out-sine], .aos-initialized[data-aos-easing=ease-in-out-sine] [data-aos] { transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-quad], .aos-initialized[data-aos-easing=ease-in-quad] [data-aos] { transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-out-quad], .aos-initialized[data-aos-easing=ease-out-quad] [data-aos] { transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-out-quad], .aos-initialized[data-aos-easing=ease-in-out-quad] [data-aos] { transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-cubic], .aos-initialized[data-aos-easing=ease-in-cubic] [data-aos] { transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-out-cubic], .aos-initialized[data-aos-easing=ease-out-cubic] [data-aos] { transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-out-cubic], .aos-initialized[data-aos-easing=ease-in-out-cubic] [data-aos] { transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-quart], .aos-initialized[data-aos-easing=ease-in-quart] [data-aos] { transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-out-quart], .aos-initialized[data-aos-easing=ease-out-quart] [data-aos] { transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .aos-initialized [data-aos][data-aos][data-aos-easing=ease-in-out-quart], .aos-initialized[data-aos-easing=ease-in-out-quart] [data-aos] { transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); } .aos-initialized [data-aos^=fade][data-aos^=fade] { opacity: 0; transition-property: opacity, transform; } .aos-initialized [data-aos^=fade][data-aos^=fade].aos-animate { opacity: 1; transform: translateZ(0); } .aos-initialized [data-aos=fade-up] { transform: translateY(var(--move-offset)); } .aos-initialized [data-aos=fade-down] { transform: translateY(calc(var(--move-offset) * -1)); } .aos-initialized [data-aos=fade-right] { transform: translate(calc(var(--move-offset) * -1)); } .aos-initialized [data-aos=fade-left] { transform: translate(var(--move-offset)); } .aos-initialized [data-aos=fade-up-right] { transform: translate(calc(var(--move-offset) * -1), var(--move-offset)); } .aos-initialized [data-aos=fade-up-left] { transform: translate(var(--move-offset), var(--move-offset)); } .aos-initialized [data-aos=fade-down-right] { transform: translate(calc(var(--move-offset) * -1), calc(var(--move-offset) * -1)); } .aos-initialized [data-aos=fade-down-left] { transform: translate(var(--move-offset), calc(var(--move-offset) * -1)); } .aos-initialized [data-aos^=zoom][data-aos^=zoom] { opacity: 0; transition-property: opacity, transform; } .aos-initialized [data-aos^=zoom][data-aos^=zoom].aos-animate { opacity: 1; transform: translateZ(0) scale(1); } .aos-initialized [data-aos=zoom-in] { transform: scale(0.6); } .aos-initialized [data-aos=zoom-in-up] { transform: translateY(var(--move-offset)) scale(0.6); } .aos-initialized [data-aos=zoom-in-down] { transform: translateY(calc(var(--move-offset) * -1)) scale(0.6); } .aos-initialized [data-aos=zoom-in-right] { transform: translate(calc(var(--move-offset) * -1)) scale(0.6); } .aos-initialized [data-aos=zoom-in-left] { transform: translate(var(--move-offset)) scale(0.6); } .aos-initialized [data-aos=zoom-out] { transform: scale(1.2); } .aos-initialized [data-aos=zoom-out-up] { transform: translateY(var(--move-offset)) scale(1.2); } .aos-initialized [data-aos=zoom-out-down] { transform: translateY(calc(var(--move-offset) * -1)) scale(1.2); } .aos-initialized [data-aos=zoom-out-right] { transform: translate(calc(var(--move-offset) * -1)) scale(1.2); } .aos-initialized [data-aos=zoom-out-left] { transform: translate(var(--move-offset)) scale(1.2); } .aos-initialized [data-aos^=slide][data-aos^=slide] { transition-property: transform; } .aos-initialized [data-aos^=slide][data-aos^=slide].aos-animate { transform: translateZ(0); } .aos-initialized [data-aos=slide-up] { transform: translateY(100%); } .aos-initialized [data-aos=slide-down] { transform: translateY(-100%); } .aos-initialized [data-aos=slide-right] { transform: translateX(-100%); } .aos-initialized [data-aos=slide-left] { transform: translateX(100%); } .aos-initialized [data-aos^=flip][data-aos^=flip] { -webkit-backface-visibility: hidden; backface-visibility: hidden; transition-property: transform; } .aos-initialized [data-aos=flip-left] { transform: perspective(2500px) rotateY(-100deg); } .aos-initialized [data-aos=flip-left].aos-animate { transform: perspective(2500px) rotateY(0); } .aos-initialized [data-aos=flip-right] { transform: perspective(2500px) rotateY(100deg); } .aos-initialized [data-aos=flip-right].aos-animate { transform: perspective(2500px) rotateY(0); } .aos-initialized [data-aos=flip-up] { transform: perspective(2500px) rotateX(-100deg); } .aos-initialized [data-aos=flip-up].aos-animate { transform: perspective(2500px) rotateX(0); } .aos-initialized [data-aos=flip-down] { transform: perspective(2500px) rotateX(100deg); } .aos-initialized [data-aos=flip-down].aos-animate { transform: perspective(2500px) rotateX(0); } .aos-initialized [data-aos=come-up] { transform: translateY(100%); opacity: 0; transition-property: opacity, transform; } .aos-initialized [data-aos=come-up].aos-animate { transform: translateZ(0); opacity: 1; } .aos-initialized .slider.flickity-enabled .item [data-aos=fade].aos-animate { opacity: 0; } .aos-initialized .slider.flickity-enabled .item [data-aos=fade-up].aos-init { opacity: 0; transform: translateY(var(--move-offset)); } .aos-initialized .slider.flickity-enabled .item [data-aos=come-up].aos-init { opacity: 0; transform: translateY(100%); } .aos-initialized .slider.flickity-enabled .item:not(.is-selected) [data-aos=fade].aos-init, .aos-initialized .slider.flickity-enabled .item:not(.is-selected) [data-aos=fade-up].aos-init, .aos-initialized .slider.flickity-enabled .item:not(.is-selected) [data-aos=come-up].aos-init { transition: opacity 0.2s 0s, transform 0s 0.5s !important; } .aos-initialized .slider.flickity-enabled .item.is-selected [data-aos=fade].aos-animate { opacity: 1; } .aos-initialized .slider.flickity-enabled .item.is-selected [data-aos=fade-up].aos-animate, .aos-initialized .slider.flickity-enabled .item.is-selected [data-aos=come-up].aos-animate { transform: translateZ(0); opacity: 1; } @media only screen and (min-width: 768px) { .aos-initialized .image-accordion [data-aos=fade].aos-animate { opacity: 0; } .aos-initialized .image-accordion [data-aos=fade-up].aos-init { opacity: 0; transform: translateY(var(--move-offset)); } .aos-initialized .image-accordion [data-aos=come-up].aos-init { opacity: 0; transform: translateY(100%); } .aos-initialized .image-accordion:not(.is-expanded) [data-aos=fade].aos-init, .aos-initialized .image-accordion:not(.is-expanded) [data-aos=fade-up].aos-init, .aos-initialized .image-accordion:not(.is-expanded) [data-aos=come-up].aos-init { transition-delay: 0.2s !important; } } @media only screen and (min-width: 768px) { .aos-initialized .image-accordion.is-expanded [data-aos=fade].aos-animate { opacity: 1; } .aos-initialized .image-accordion.is-expanded [data-aos=fade-up].aos-animate, .aos-initialized .image-accordion.is-expanded [data-aos=come-up].aos-animate { transform: translateZ(0); opacity: 1; } } .aos-initialized .products-list__item [data-aos][data-aos].aos-animate { opacity: 0; } .aos-initialized .products-list__item--active [data-aos][data-aos].aos-animate { opacity: 1; } .aos-initialized .products-list__item [data-aos][data-aos].aos-init, .aos-initialized .tab-collections [data-aos][data-aos].aos-init { transition-duration: 0s; } .aos-initialized .products-list__item [data-aos][data-aos].aos-animate, .aos-initialized .tab-collections [data-aos][data-aos].aos-animate { transition-duration: 1s; } .aos-initialized .product__media__holder { will-change: transform; } .aos-initialized .text-reveal__cropper { display: block; overflow: hidden; } .aos-initialized .text-reveal__cropper, .aos-initialized .text-reveal__cropper>span { display: block; } @media only screen and (max-width: 767px) { html.iframe [data-aos]:not([data-aos=hero]) { opacity: 1 !important; transform: none !important; } } /*! Flickity v2.2.2 https://flickity.metafizzy.co ---------------------------------------------- */ .flickity-enabled { position: relative; } .flickity-viewport { overflow: hidden; position: relative; } .flickity-slider { position: absolute; width: 100%; height: 100%; } .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; -webkit-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: grabbing; } .flickity-button { position: absolute; background: hsla(0, 0%, 100%, 0.75); border: none; color: #333; } .flickity-button:hover { background: white; cursor: pointer; } .flickity-button:focus { outline: none; box-shadow: 0 0 0 5px #19F; } .flickity-button:active { opacity: 0.6; } .flickity-button:disabled { opacity: 0.3; cursor: auto; pointer-events: none; } .flickity-button-icon { fill: currentColor; } .flickity-prev-next-button { top: 50%; width: 44px; height: 44px; border-radius: 50%; transform: translateY(-50%); } .flickity-prev-next-button.previous { left: 10px; } .flickity-prev-next-button.next { right: 10px; } .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 10px; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px; } .flickity-page-dots { position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25; cursor: pointer; } .flickity-page-dots .dot.is-selected { opacity: 1; } /* flickity-fade */ .flickity-enabled.is-fade .flickity-slider>* { pointer-events: none; z-index: 0; } .flickity-enabled.is-fade .flickity-slider>.is-selected { pointer-events: auto; z-index: 1; } :root { --flickity-btn-size: 40px; --flickity-btn-position: 10px; } @media only screen and (min-width: 1024px) { :root { --flickity-btn-position: calc(var(--flickity-btn-size) / -2); } } .flickity-viewport { transition: height 0.2s ease; } .flickity-button { background-color: transparent; } .flickity-button:disabled { opacity: 0; } .flickity-page-dots { pointer-events: none; } .flickity-page-dots .dot { border: var(--BORDER-WIDTH) solid var(--text); background-color: transparent; transition: border 0.5s ease, width 0.5s ease, opacity 0.5s ease; border-radius: 5px; pointer-events: auto; } .flickity-page-dots .dot.is-selected { width: 25px; } .flickity-page-dots .dot:only-child { visibility: hidden; } .flickity-button-icon { display: none; } .flickity-prev-next-button, .pswp__button--arrow--left, .pswp__button--arrow--right { width: var(--flickity-btn-size); height: var(--flickity-btn-size); color: var(--text); background: var(--bg); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08), 0 1px 5px rgba(0, 0, 0, 0.06); transform: translateY(-50%); transform-origin: top; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; border-radius: 50%; will-change: opacity, transform; transform-origin: top; transition: opacity 0.2s ease, transform 0.25s ease-out, visibility 0s linear 0.2s; } .flickity-prev-next-button:hover, .pswp__button--arrow--left:hover, .pswp__button--arrow--right:hover { background: var(--bg); transform: scale(1.12) translateY(-50%); } .pswp__button--arrow--left { left: var(--flickity-btn-position); } .pswp__button--arrow--right { right: var(--flickity-btn-position); } .flickity-prev-next-button.previous { left: var(--flickity-btn-position); } .flickity-prev-next-button.next { right: var(--flickity-btn-position); } .flickity-prev-next-button { --icon-size: 18px; opacity: 0; transform: scale(0) translateY(-50%); visibility: hidden; } .pswp__button { --icon-size: 18px; opacity: 1; visibility: visible; } .flickity-prev-next-button:before, .pswp__button:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: var(--icon-size); height: var(--icon-size); background: var(--text); -webkit-mask-size: var(--icon-size); mask-size: var(--icon-size); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center center; mask-position: center center; max-width: 100%; max-height: 100%; } .pswp__button--close:before { content: none; } .flickity-prev-next-button.previous:before, .pswp__button--arrow--left:before { -webkit-mask-image: var(--ICON-ARROW-RIGHT); mask-image: var(--ICON-ARROW-RIGHT); transform: rotate(180deg); } .flickity-prev-next-button.next:before, .pswp__button--arrow--right:before { -webkit-mask-image: var(--ICON-ARROW-RIGHT); mask-image: var(--ICON-ARROW-RIGHT); } .supports-touch .flickity-prev-next-button:not(:disabled), .flickity-enabled:hover>.flickity-prev-next-button:not(:disabled), section:hover .flickity-enabled>.flickity-prev-next-button:not(:disabled) { opacity: 1; visibility: visible; transform: scale(1) translateY(-50%); transition-delay: 0s; } .supports-touch .flickity-prev-next-button:not(:disabled):hover, .flickity-enabled:hover>.flickity-prev-next-button:not(:disabled):hover, section:hover .flickity-enabled>.flickity-prev-next-button:not(:disabled):hover { transform: scale(1.12) translateY(-50%); } /* Shopify Model Viewer UI */ .shopify-model-viewer-ui { position: relative; display: inline-block; cursor: pointer; } .shopify-model-viewer-ui model-viewer { transform: translateZ(0); z-index: 1; } .shopify-model-viewer-ui model-viewer.shopify-model-viewer-ui__disabled { pointer-events: none; } .shopify-model-viewer-ui.shopify-model-viewer-ui--fullscreen model-viewer { position: relative; width: 100vw; height: 100vh; } .shopify-model-viewer-ui.shopify-model-viewer-ui--fullscreen .shopify-model-viewer-ui__control-icon--exit-fullscreen { display: block; } .shopify-model-viewer-ui.shopify-model-viewer-ui--fullscreen .shopify-model-viewer-ui__control-icon--enter-fullscreen { display: none; } .shopify-model-viewer-ui.shopify-model-viewer-ui--desktop:hover .shopify-model-viewer-ui__controls-area, .shopify-model-viewer-ui.shopify-model-viewer-ui--desktop.shopify-model-viewer-ui--child-focused .shopify-model-viewer-ui__controls-area { opacity: 1; } .shopify-model-viewer-ui:not(.shopify-model-viewer-ui--desktop) .shopify-model-viewer-ui__controls-area { display: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__controls-overlay { position: absolute; width: 100%; height: 100%; top: 0; } .shopify-model-viewer-ui .shopify-model-viewer-ui__controls-area { display: flex; flex-direction: column; background: var(--bg); opacity: 0; border: var(--BORDER-WIDTH) solid var(--text-alpha-5); position: absolute; bottom: 10px; right: 10px; z-index: 1; transition: opacity 0.1s linear; } .shopify-model-viewer-ui .shopify-model-viewer-ui__controls-area:not(.shopify-model-viewer-ui__controls-area--playing) { display: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__button { color: var(--text); border-radius: 0; border: none; margin: 0px; cursor: pointer; } .shopify-model-viewer-ui .shopify-model-viewer-ui__button:not(.focus-visible) { outline: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__button--control { padding: 0px; height: 44px; width: 44px; background: transparent; position: relative; } .shopify-model-viewer-ui .shopify-model-viewer-ui__button--control:hover { color: var(--text-alpha-50); } .shopify-model-viewer-ui .shopify-model-viewer-ui__button--control:active, .shopify-model-viewer-ui .shopify-model-viewer-ui__button--control.focus-visible:focus { color: var(--text-alpha-50); background: var(--text-alpha-5); } .shopify-model-viewer-ui .shopify-model-viewer-ui__button--control:not(:last-child):after { position: absolute; content: ""; border-bottom: var(--BORDER-WIDTH) solid var(--text-alpha-5); width: 28px; bottom: 0px; right: 8px; } .shopify-model-viewer-ui .shopify-model-viewer-ui__control-icon { width: 44px; height: 44px; fill: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__button--poster { background: var(--bg); position: absolute; border: 1px solid var(--text-alpha-5); top: 50%; left: 50%; padding: 0; transform: translate3d(-50%, -50%, 0); height: 62px; width: 62px; z-index: 1; } .shopify-model-viewer-ui .shopify-model-viewer-ui__button--poster:hover, .shopify-model-viewer-ui .shopify-model-viewer-ui__button--poster:focus { color: var(--text-alpha-50); } .shopify-model-viewer-ui .shopify-model-viewer-ui__poster-control-icon { width: 60px; height: 60px; z-index: 1; fill: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__control-icon--exit-fullscreen { display: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__control-icon--enter-fullscreen { display: block; } .shopify-model-viewer-ui .shopify-model-viewer-ui__spritesheet { display: none; } .shopify-model-viewer-ui .shopify-model-viewer-ui__sr-only { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; } /** * Product Rating */ .product__rating { display: inline-flex; align-items: center; justify-content: flex-end; cursor: pointer; } .product__rating__count { margin-left: 5px; } .rating__star { position: relative; display: block; margin: 0 0 2px; } .rating__star .icon { display: block; width: 12px; height: 12px; } .rating__star__empty, .rating__star__full { display: flex; } .rating__star__empty .icon, .rating__star__full .icon { margin-right: 2px; } .rating__star__empty .icon:last-child, .rating__star__full .icon:last-child { margin-right: 0; } .rating__star__full { position: absolute; top: 0; left: 0; clip-path: inset(0 var(--percent) 0 0); -webkit-clip-path: inset(0 var(--percent) 0 0); } .rating__star .icon-star { stroke: currentColor; stroke-width: 1px; fill: currentColor; } .rating__star .icon-star--empty { fill: transparent; } /*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */ /* Styles for basic PhotoSwipe functionality (sliding area, open/close transitions) */ /* pswp = photoswipe */ .pswp { display: none; position: absolute; width: 100%; height: 100vh; left: 0; top: 0; overflow: hidden; touch-action: none; z-index: 1500; -webkit-text-size-adjust: 100%; /* create separate layer, to avoid paint on window.onscroll in webkit/blink */ -webkit-backface-visibility: hidden; outline: none; } .pswp * { box-sizing: border-box; } .pswp img { max-width: none; } .pswp__custom-native video { width: 100%; height: auto; } /* style is added when JS option showHideOpacity is set to true */ .pswp--animate_opacity { /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */ opacity: 0.001; will-change: opacity; /* for open/close transition */ transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--open { display: block; } .pswp--zoom-allowed .pswp__img { /* autoprefixer: off */ cursor: zoom-in; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; cursor: var(--icon-zoom-in), zoom-in; } .pswp--zoomed-in .pswp__img { /* autoprefixer: off */ cursor: zoom-out; cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: var(--icon-zoom-out), zoom-out; } .pswp--dragging .pswp__img { /* autoprefixer: off */ cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; } /* Background is added as a separate element. As animating opacity is much faster than animating rgba() background-color. */ .pswp__bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0; transform: translateZ(0); -webkit-backface-visibility: hidden; will-change: opacity; } .pswp__scroll-wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; } .pswp__container, .pswp__zoom-wrap { touch-action: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; } /* Prevent selection and tap highlights */ .pswp__container, .pswp__img { -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .pswp__zoom-wrap { position: absolute; width: 100%; transform-origin: left top; /* for open/close transition */ transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp__bg { will-change: opacity; /* for open/close transition */ transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--animated-in .pswp__bg, .pswp--animated-in .pswp__zoom-wrap { transition: none; } .pswp__container, .pswp__zoom-wrap { -webkit-backface-visibility: hidden; } .pswp__item { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; } .pswp__img { position: absolute; width: auto; height: auto; top: 0; left: 0; } /* stretched thumbnail or div placeholder element (see below) style is added to avoid flickering in webkit/blink when layers overlap */ .pswp__img--placeholder { -webkit-backface-visibility: hidden; } /* div element that matches size of large image large image loads on top of it */ .pswp__img--placeholder--blank { background: #222; } .pswp--ie .pswp__img { width: 100% !important; height: auto !important; left: 0; top: 0; } /* Error message appears when image is not loaded (JS option errorMsg controls markup) */ .pswp__error-msg { position: absolute; left: 0; top: 50%; width: 100%; text-align: center; font-size: calc(0.875rem * var(--FONT-ADJUST-BODY)); line-height: 16px; margin-top: -8px; color: #CCC; } .pswp__error-msg a { color: #CCC; text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } /*================ MODULES ================*/ /*================ Announcement Bar ================*/ .announcement-bar-static { position: relative; z-index: 135; } .has-scrolled .announcement-bar-static { display: none; } .top-bar { position: relative; width: 100%; min-width: 32px; text-align: center; color: var(--text); background: var(--bg) no-repeat center center/cover; overflow: hidden; font-size: calc(0.75rem * var(--adjust-body)); line-height: 1.5; white-space: nowrap; } .top-bar a { display: inline-block; color: inherit; } .top-bar p { font-size: inherit; } .top-bar .cart__message__success, .top-bar .cart__message__default { padding: 0; } .announcement-bar-static .top-bar { z-index: 100; } .top-bar__slide { width: 100%; padding: var(--padding) 0; } @media only screen and (max-width: 767px) { .top-bar__slide.desktop { display: none; } } @media only screen and (min-width: 768px) { .top-bar__slide.mobile { display: none; } } .top-bar__icon { display: inline-block; vertical-align: middle; color: var(--text); margin-right: calc(var(--adjust-body) * 10px); background: no-repeat center center/contain; } .top-bar__icon .icon { display: block; } .top-bar__image { height: auto; vertical-align: top; } .top-bar__text--placeholder .top-bar__image { position: relative; padding-top: 100%; } .top-bar__text--placeholder .top-bar__image .placeholder-svg-filled { position: absolute; top: 0; left: 0; } .top-bar__text { display: inline-block; width: max-content; white-space: nowrap; } .top-bar__text p { margin: 0; display: inline-block; vertical-align: middle; color: var(--text); } .top-bar__text .cart__message { padding: 0; margin: 0; width: 100%; font-size: calc(0.75rem * var(--adjust-body)); } .top-bar__text .cart__message.is-hidden { visibility: visible; max-height: none; opacity: 1; padding: 0; } .top-bar__text .cart__message .cart__message__default { padding-bottom: 0; } .top-bar__text .cart__message .cart__message__default.is-hidden { display: none; } .top-bar__ticker { display: inline-flex; vertical-align: middle; align-items: center; } @media only screen and (max-width: 767px) { .top-bar__ticker.desktop { display: none; } } @media only screen and (min-width: 768px) { .top-bar__ticker.mobile { display: none; } } .top-bar__divider { margin: 0 calc(var(--adjust-body) * 10px) 0 calc(var(--adjust-body) * 7px); width: 0; border-left: 1px solid currentcolor; height: calc(var(--adjust-body) * 15px); align-self: center; } .top-bar__message { overflow: hidden; } .top-bar__scale { display: inline-flex; align-items: center; transition: opacity 0.5s linear; } .top-bar__scale.ticker--unloaded { opacity: 0; position: absolute; width: max-content; } .ticker--animated { animation-iteration-count: infinite; animation-timing-function: linear; animation-name: ticker; animation-duration: var(--animation-time); animation-play-state: paused; display: inline-block; width: max-content; will-change: transform, padding, width; } .ticker--animated:hover { animation-play-state: paused; } .ticker-rtl { animation-direction: normal; } .ticker-ltr { animation-direction: reverse; } .top-bar__slider { position: relative; } .top-bar__slider .flickity-slider { display: flex; align-items: center; } .top-bar__slider>.top-bar__slide [data-stop] .ticker--animated { animation-play-state: paused; } .top-bar__slider>.top-bar__slide .ticker--animated, .is-selected .ticker--animated { animation-play-state: running; } .ticker__comparitor { position: absolute; transform: translateY(-5000px); visibility: hidden; } .ie11-error-message { font-weight: var(--FONT-WEIGHT-BODY-BOLD); font-size: calc(1.25rem * var(--adjust-body)); text-align: center; display: none; } .ie11 .ie11-error-message { display: block; } .js .top-bar__slider:not(.flickity-enabled) .top-bar__slide:not(:first-child) { position: absolute; top: 0; left: 0; visibility: hidden; } /*================ Site Header ================*/ .shopify-section-header { position: relative; width: 100%; z-index: 9000; } .site-header { --highlight: var(--text); position: relative; z-index: 5; width: 100%; min-width: 320px; background-color: var(--bg); color: var(--text); overflow: initial; -webkit-overflow-scrolling: touch; transition: color 0.2s ease, background 0.3s ease; } .no-js .site-header>.wrapper[data-aos], .site-header>.wrapper:not(.aos-initialized) { transform: translateZ(0); } .site-header>.wrapper { --header-sticky-height: 60px; position: relative; display: flex; align-items: center; width: 100%; min-height: var(--header-sticky-height); height: inherit; } .site-header a { text-decoration: none; } .site-header__background { position: absolute; top: 0; left: 0; width: 100%; height: 0; transition: height 0.4s ease; pointer-events: none; background: inherit; } .site-header--transparent .site-header__background { background-color: var(--bg); } @media (pointer: fine) { .site-header:focus-within .site-header__background { height: var(--header-height); } .site-header.site-header--menu-opened:focus-within .site-header__background, .site-header.site-header--menu-opened .site-header__background { height: var(--header-background-height); } } @media (hover: hover) { .site-header:hover .site-header__background { height: var(--header-background-height); } } .site-header--loading { overflow: hidden; opacity: 0; } .site-header--has-border { --border-color: currentcolor; box-shadow: 0 var(--BORDER-WIDTH) var(--border-color); transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .logo { position: relative; z-index: 1; text-align: left; margin: 15px 0; padding-right: var(--inner); max-width: calc(100% - 120px); display: flex; align-items: center; font-size: calc(1.125rem * var(--adjust-heading)); line-height: 1.3; color: inherit; word-break: break-word; } @media (pointer: coarse) { .logo { position: relative; padding-right: 0; } } @media only screen and (max-width: 479px) { .logo { max-width: calc(100% - 124px); } } @media (pointer: fine) { .site-header--nav-left .logo:not(.logo--compress) { padding-left: var(--inner); margin-left: auto; margin-right: auto; } } .logo__image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; object-position: left; } .logo__image-link { position: relative; color: var(--text); max-width: 100%; } .logo__image-link--home:not(.logo__image-link--single) { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 0.4s ease; } .site-header--nav-left .logo:not(.logo--compress) .logo__image-link--home:not(.logo__image-link--single) { left: var(--inner); } @media (pointer: coarse) { .site-header--nav-left .logo:not(.logo--compress) .logo__image-link--home:not(.logo__image-link--single) { left: 0; } } .logo__image-link--other, .logo__image-link--single { display: block; } .logo__text-link { color: var(--text); transition: color 0.2s ease; } .logo__image-push { display: block; height: 0; } @media only screen and (max-width: 479px) { .logo__text-link--has-image { display: none; } } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.shopify-section.supports-transparent-header:first-child { --full-height: var(--content-full); --content-full: calc(100vh - var(--announcement-height)); } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .shopify-section-header { height: auto; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .site-header { position: absolute; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.supports-transparent-header:first-child .banner-content, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.supports-transparent-header:first-child .banners__content, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.supports-transparent-header:first-child .banner-image__text-wrapper, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.supports-transparent-header:first-child .slide__text__wrapper, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.supports-transparent-header:first-child .split-images__content, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .main-content>.supports-transparent-header:first-child .video-text-wrapper { padding-top: calc(var(--header-height) + var(--gutter)); } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .site-header--has-border { --border-color: var(--text); } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent { background: transparent; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent .logo__image-link--other { opacity: 0; transition: opacity 0.4s ease; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent .logo__image-link--home:not(.logo__image-link--single), body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent .logo__image-link--single, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--menu-opened .logo__image-link--other { opacity: 1; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent[data-text-color=black] { --text: var(--black); --header-gradient: var(--white-alpha-10); } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent[data-text-color=white] { --text: var(--white); --header-gradient: var(--black-alpha-10); } .no-js body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--has-gradient:before, .is-loaded body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--has-gradient:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, var(--header-gradient) 30%, rgba(0, 0, 0, 0) 100%); } @media (pointer: fine) { body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header: first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent:focus-within .logo__image-link--other { opacity: 1; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent:focus-within .logo__image-link--home:not(.logo__image-link--single), body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--menu-opened .logo__image-link--home:not(.logo__image-link--single) { opacity: 0; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent:focus-within, body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--menu-opened[data-text-color=white] { --text: var(--black); } } @media (hover: hover) { body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header: first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--hovered:hover .logo__image-link--other { opacity: 1; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--hovered:hover .logo__image-link--home:not(.logo__image-link--single) { opacity: 0; } body:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])):not(.search-opened) .site-header--transparent.site-header--hovered[data-text-color=white]:hover { --text: var(--black); } } @supports not (selector(:has(*))) { .is-first-section-transparent:not(.search-opened) .site-header--transparent { background: transparent; } .is-first-section-transparent:not(.search-opened) .site-header--transparent .logo__image-link--other { opacity: 0; transition: opacity 0.4s ease; } .is-first-section-transparent:not(.search-opened) .site-header--transparent .logo__image-link--home:not(.logo__image-link--single), .is-first-section-transparent:not(.search-opened) .site-header--transparent .logo__image-link--single, .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--menu-opened .logo__image-link--other { opacity: 1; } .is-first-section-transparent:not(.search-opened) .site-header--transparent[data-text-color=black] { --text: var(--black); --header-gradient: var(--white-alpha-10); } .is-first-section-transparent:not(.search-opened) .site-header--transparent[data-text-color=white] { --text: var(--white); --header-gradient: var(--black-alpha-10); } .is-loaded .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--has-gradient:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, var(--header-gradient) 30%, rgba(0, 0, 0, 0) 100%); } @media (pointer: fine) { .is-first-section-transparent:not(.search-opened) .site-header--transparent:focus-within .logo__image-link--other { opacity: 1; } .is-first-section-transparent:not(.search-opened) .site-header--transparent:focus-within .logo__image-link--home:not(.logo__image-link--single), .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--menu-opened .logo__image-link--home:not(.logo__image-link--single) { opacity: 0; } .is-first-section-transparent:not(.search-opened) .site-header--transparent:focus-within, .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--menu-opened[data-text-color=white] { --text: var(--black); } } @media (hover: hover) { .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--hovered:hover .logo__image-link--other { opacity: 1; } .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--hovered:hover .logo__image-link--home:not(.logo__image-link--single) { opacity: 0; } .is-first-section-transparent:not(.search-opened) .site-header--transparent.site-header--hovered[data-text-color=white]:hover { --text: var(--black); } } .is-first-section-transparent .site-header--has-border { --border-color: var(--text); } } .has-scrolled .shopify-section-header { height: var(--header-height); } .has-scrolled .site-header { position: fixed; top: 0; left: 0; width: 100%; height: max-content !important; } .has-scrolled .site-header--has-border { box-shadow: none; } .has-scrolled .site-header--fixed { height: var(--header-sticky-height); animation: showCompactHeader 0.3s ease; } .has-scrolled.hide-header .site-header--fixed { animation: hideCompactHeader 0.3s; animation-fill-mode: forwards; } .has-scrolled:has(.site-header[data-transparent=true]):has(.main-content > .supports-transparent-header:first-child):not(:has(.main-content > .supports-transparent-header:first-child [data-prevent-transparent-header])) .site-header { position: fixed; height: var(--header-sticky-height); } @supports not (selector(:has(*))) { .has-scrolled.is-first-section-transparent .site-header { position: fixed; height: var(--header-sticky-height); } } .has-scrolled .site-header:not(.site-header--menu-opened):focus-within .site-header__background, .has-scrolled .site-header:not(.site-header--menu-opened) .site-header__background { --header-background-height: var(--header-sticky-height); } @media (pointer: fine) { .has-scrolled.search-opened .site-header .site-header__background, .has-scrolled .site-header:focus-within .site-header__background { height: var(--header-sticky-height); } .has-scrolled .site-header.site-header--menu-opened:focus-within .site-header__background, .has-scrolled .site-header.site-header--menu-opened .site-header__background { height: var(--header-background-height); } } @media (hover: hover) { .has-scrolled .site-header:not(.site-header--menu-opened):hover .site-header__background { --header-background-height: var(--header-sticky-height); } } .has-scrolled .logo { margin-top: 10px; margin-bottom: 10px; } .has-scrolled .site-header--has-logo .logo { height: 40px; } /* ============================================================================ #Site Nav and Dropdowns ============================================================================== */ .nav { --icon-size: 26px; --inner: 15px; font-family: var(--FONT-STACK-NAV); font-style: var(--FONT-STYLE-NAV); font-size: calc(1rem * var(--adjust-nav)); cursor: default; list-style: none; display: flex; align-items: stretch; position: absolute; top: 0; left: 0; right: 0; height: 100%; width: 100%; z-index: 0; } @media only screen and (min-width: 1024px) { .nav { padding-right: var(--gutter); padding-left: var(--gutter); } } .nav p { font-size: inherit; } .nav--weight-normal .navlink { font-weight: var(--FONT-WEIGHT-NAV); } .nav--weight-bold .navlink { font-weight: var(--FONT-WEIGHT-NAV-BOLD); } .nav--weight-bold .navlink--grandchild { font-weight: var(--FONT-WEIGHT-NAV); } @media (pointer: coarse) { .site-header:not(.js__header__clone) .nav--default { display: none; } } .site-header--nav-left .nav--default { justify-content: flex-start; padding-left: calc(var(--gutter) - var(--inner)); } .site-header--nav-right .nav--default { justify-content: flex-end; } .site-header--nav-center .nav--default { justify-content: center; } .nav--compress { justify-content: flex-end; } .nav--compress .menu__item { display: none; } .nav--compress .menu__item--compress, .nav--compress .menu__item--mobile-search { display: flex; margin-left: auto; } .nav--compress .menu__item--compress { margin-right: -12px; } @media only screen and (max-width: 1023px) { .nav--compress .menu__item--compress { margin-right: calc(var(--gutter-mobile) - 12px); } } .nav [data-collapsible-content], .mobile-nav [data-collapsible-content] { transform: translateX(calc(var(--inner) * -1)); } .nav .is-expanded>[data-collapsible-content], .mobile-nav .is-expanded>[data-collapsible-content] { transform: translateX(0); } .cart-indicator { fill: var(--accent); stroke: none; visibility: hidden; } .cart__toggle--has-items .cart-indicator { visibility: visible; } .cart__toggle--animation .cart-indicator { animation: pulse 1.7s infinite; } .navlink { position: relative; display: block; padding: 3px 0; text-decoration: none; z-index: 10; } .navlink[href="#"] { cursor: default; } .menu__item>.navlink { min-height: 100%; } .navlink--toplevel { display: flex; align-items: center; padding: var(--inner); transition: color 0.2s ease; } .navlink--toplevel>.navtext, .grandparent .navlink--child>.navtext { position: relative; display: inline-block; text-decoration: none !important; } .navlink--toplevel>.navtext:before, .navlink--toplevel>.navtext:after, .grandparent .navlink--child>.navtext:before, .grandparent .navlink--child>.navtext:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .navlink--toplevel>.navtext:before, .grandparent .navlink--child>.navtext:before { transform: scaleX(0); transform-origin: left; } .navlink--toplevel>.navtext:after, .grandparent .navlink--child>.navtext:after { transform-origin: right; } .no-touch .navlink--toplevel>.navtext:hover, .no-touch .grandparent .navlink--child>.navtext:hover { background: transparent; border: 0; } .no-touch .navlink--toplevel>.navtext:hover:before, .no-touch .navlink--toplevel>.navtext:hover:after, .no-touch .grandparent .navlink--child>.navtext:hover:before, .no-touch .grandparent .navlink--child>.navtext:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .navlink--toplevel>.navtext:hover:before, .no-touch .grandparent .navlink--child>.navtext:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .navlink--toplevel>.navtext:after, .grandparent .navlink--child>.navtext:after { opacity: 0; } .menu__item:hover>.navlink:not(.navlink--icon)>.navtext:before, .menu__item:hover>.navlink:not(.navlink--icon)>.navtext:after, .menu__item.is-visible>.navlink:not(.navlink--icon)>.navtext:before, .menu__item.is-visible>.navlink:not(.navlink--icon)>.navtext:after, .grandparent .navlink--child:hover>.navtext:before, .grandparent .navlink--child:hover>.navtext:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); } .menu__item:hover>.navlink:not(.navlink--icon)>.navtext:before, .menu__item.is-visible>.navlink:not(.navlink--icon)>.navtext:before, .grandparent .navlink--child:hover>.navtext:before { transform: scaleX(1); transition-delay: 0.25s; } .menu__item:hover>.navlink:not(.navlink--icon)>.navtext:after, .menu__item.is-visible>.navlink:not(.navlink--icon)>.navtext:after, .grandparent .navlink--child:hover>.navtext:after { transform: scaleX(0); opacity: 1; } .navlink--highlight { color: var(--highlight); padding: 5px var(--inner); --inner: 8px; min-height: auto !important; } .navlink--highlight .navtext:after, .navlink--highlight .navtext:before { background: var(--highlight) !important; } .navlink--child, .navlink--grandchild { transition: color 0.25s ease; } .navlink--icon { padding: 8px; display: flex; align-items: center; margin-right: 10px; transition: color 0.2s ease; } .navlink--icon:last-child { margin-right: 0; } .navlink--icon .icon { width: var(--icon-size); height: var(--icon-size); pointer-events: none; stroke-width: calc(var(--STROKE-WIDTH) - 4px); } .navtext { position: relative; display: block; } .menu__items { display: flex; align-items: stretch; justify-content: center; } .menu__item { display: flex; align-items: center; margin: 0; } .menu__item--mobile-search { display: none; } .menu__item--has-items { position: relative; padding-bottom: 15px; margin-bottom: -15px; } .menu__item--has-items:hover { z-index: 3; } .menu__item--icon { margin-right: 10px; } .menu__item--icon:last-child { margin-right: 0; } /* Fake nav */ .js__header__clone { position: absolute; min-width: 1400px; transform: translateY(-5000px); visibility: hidden; } /* Nav icons */ .menu__item--icons { display: flex; align-items: center; margin: 0 -10px 0 20px; } @media only screen and (max-width: 1023px) { .menu__item--icons { margin-right: 10px; } } .site-header--nav-left .menu__item--icons, .site-header--nav-center .menu__item--icons { position: absolute; top: 0; right: var(--gutter); height: 100%; display: flex; align-items: center; justify-content: flex-end; margin-right: -10px; } @media only screen and (max-width: 1023px) { .site-header--nav-left .menu__item--icons, .site-header--nav-center .menu__item--icons { right: var(--gutter-mobile); } } /* Compressed nav */ .menu__item--compress { display: none; align-items: center; justify-content: flex-end; } .header__dropdown { --text: var(--COLOR-TEXT); position: absolute; top: 100%; background: transparent; line-height: 22px; margin: 0; text-align: left; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: visibility 0.5s; overflow: hidden; pointer-events: none; } .menu__item.is-visible .header__dropdown { visibility: visible; pointer-events: all; z-index: 5; } .site-header--has-border .menu__item.is-visible .header__dropdown:before { opacity: 1; } .header__dropdown__wrapper { overflow-y: auto; max-height: calc(100vh - var(--header-height)); transform: translateY(-10px); opacity: 0; transition: transform 0.2s, opacity 0.2s; } .menu__item.is-visible .header__dropdown__wrapper { transform: translateY(0); opacity: 1; transition-delay: 0.3s; } .dropdown__family { display: flex; flex-direction: column; padding: 10px 0; font-size: calc(1rem * var(--adjust-nav)); } .header__dropdown__image { position: relative; opacity: 0; transition: opacity 0.75s ease; } .header__dropdown__image .hero__title { color: var(--white); font-size: calc(1.5rem * var(--adjust-heading)); margin: 0; } .header__dropdown__image .hero__description { margin: 0; color: var(--white); } .header__dropdown__image .hero__content { padding: 30px; margin: 0; max-width: none; } .hero__content__wrapper { display: flex; position: absolute; top: 0; right: 0; z-index: 200; width: 100%; height: 100%; overflow: hidden; } .link-over-image { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 20; } /* ============================================================================ #Basic Dropdown ============================================================================== */ .parent .header__dropdown { top: calc(50% + 20px); min-width: 180px; max-width: 320px; background: var(--bg); font-size: calc(0.9375rem * var(--adjust-nav)); transform-origin: center top; transform: scaleY(0); transition: transform 0.2s ease 0.1s, visibility 0s 0.3s; } .parent .header__dropdown__wrapper { transition: transform 0.2s, opacity 0.1s; } .parent .header__dropdown__inner { display: flex; flex-direction: column; padding: 10px 0; } .parent .navlink--toplevel:after { content: none; } .parent .navlink--child { display: block; padding: 0; } .parent .navlink--child>span { display: block; padding: 6px var(--inner); transition: background 0.25s ease; } .parent .navlink--child:hover>span { background: var(--text-alpha-5); } .parent.is-visible .header__dropdown { z-index: 12; transform: scaleY(1); transition: transform 0.2s ease, visibility 0s; } .parent.is-visible .header__dropdown__wrapper { transition: transform 0.1s 0.2s, opacity 0.1s 0.2s; } /* ============================================================================ #Image Meganav ============================================================================== */ .header__dropdown__image .background-size-cover, .header__dropdown__image .video-background { transform: scale(1.06); transform-origin: bottom center; transition: transform 0.75s ease; will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .is-visible .header__dropdown__image { opacity: 1; } .is-visible .header__dropdown__image .background-size-cover, .is-visible .header__dropdown__image .video-background { transform: scale(1); transition: transform 1.5s ease; } /* ============================================================================ #Large Meganav ============================================================================== */ .grandparent .header__dropdown { width: 100%; max-width: 100vw; left: 0; z-index: -1; margin-top: calc(var(--header-height) * -1); } .site-header--has-border .grandparent .header__dropdown:before { content: ""; position: absolute; top: var(--header-height); left: 0; width: 100%; height: var(--BORDER-WIDTH); background: var(--border-color); opacity: 0; transition: opacity 0.2s ease; } .grandparent .header__dropdown__wrapper { max-height: 100vh; padding: calc(var(--header-height) + 50px) 0 50px; } .grandparent .header__dropdown__inner { display: flex; justify-content: space-between; margin: 0 auto; } .grandparent .header__grandparent__links { flex: 3; display: grid; align-content: start; row-gap: 1.5em; margin-left: calc(var(--gutter) / 2); } .grandparent .menu__block--narrow, .grandparent .menu__block--wide, .grandparent .dropdown__family { margin-right: calc(var(--gutter) / 2); } .grandparent .menu__block--narrow { flex: 1; } .grandparent .menu__block--wide { flex: 3; } .grandparent .navlink--child, .grandparent .navlink--grandchild { display: inline-block; will-change: transform; margin-right: auto; padding-right: 5px; } .grandparent .navlink--child>.navtext { display: inline-block; position: relative; font-size: calc(1.25rem * var(--adjust-nav)); } .grandparent .navlink--grandchild>.navtext { transition: opacity 0.3s ease; } .grandparent .navlink--grandchild:hover>.navtext { opacity: 0.65; } .grandparent .navlink--child { margin-bottom: 5px; } .grandparent .navlink--image { display: block; width: 100%; } .grandparent .navlink--image .image-fill { margin: -15px 0 20px; } .grandparent--all-images .header__dropdown__wrapper { padding-left: calc(var(--gutter) / 2); } .grandparent.no-images .header__dropdown__links { padding-bottom: var(--inner); } .grandparent.no-images .header__dropdown__inner { width: calc(var(--wrapper-width) + var(--gutter) / 2); } @media only screen and (min-width: 1024px) { .grandparent.no-images.kids-1 .header__dropdown__inner { width: calc(28.75vw - var(--scrollbar-width) - var(--gutter)); } } @media only screen and (min-width: 1024px) { .grandparent.no-images.kids-2 .header__dropdown__inner { width: calc(50vw - var(--scrollbar-width) - var(--gutter)); } } @media only screen and (min-width: 1024px) { .grandparent.no-images.kids-3 .header__dropdown__inner { width: calc(75vw - var(--scrollbar-width) - var(--gutter)); } } @media only screen and (min-width: 1024px) { .grandparent.no-images.kids-4 .header__dropdown__inner { width: calc(100vw - var(--scrollbar-width) - var(--gutter)); } } .grandparent.kids-1 .header__grandparent__links { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grandparent.kids-2 .header__grandparent__links { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grandparent.kids-3 .header__grandparent__links { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grandparent.kids-4 .header__grandparent__links { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grandparent.kids-5 .header__grandparent__links { grid-template-columns: repeat(5, minmax(0, 1fr)); } .grandparent.kids-6 .header__grandparent__links, .grandparent.kids-7 .header__grandparent__links, .grandparent.kids-8 .header__grandparent__links, .grandparent.kids-9 .header__grandparent__links, .grandparent.kids-10 .header__grandparent__links, .grandparent.kids-11 .header__grandparent__links, .grandparent.kids-12 .header__grandparent__links, .grandparent.kids-13 .header__grandparent__links, .grandparent.kids-14 .header__grandparent__links, .grandparent.kids-15 .header__grandparent__links, .grandparent.kids-16 .header__grandparent__links, .grandparent.kids-17 .header__grandparent__links, .grandparent.kids-18 .header__grandparent__links, .grandparent.kids-19 .header__grandparent__links, .grandparent.kids-20 .header__grandparent__links { grid-template-columns: repeat(5, minmax(0, 1fr)); } [class*=images-].grandparent.kids-4 .header__grandparent__links, [class*=images-].grandparent.kids-5 .header__grandparent__links, [class*=images-].grandparent.kids-6 .header__grandparent__links, [class*=images-].grandparent.kids-7 .header__grandparent__links, [class*=images-].grandparent.kids-8 .header__grandparent__links, [class*=images-].grandparent.kids-9 .header__grandparent__links, [class*=images-].grandparent.kids-10 .header__grandparent__links, [class*=images-].grandparent.kids-11 .header__grandparent__links, [class*=images-].grandparent.kids-12 .header__grandparent__links, [class*=images-].grandparent.kids-13 .header__grandparent__links, [class*=images-].grandparent.kids-14 .header__grandparent__links, [class*=images-].grandparent.kids-15 .header__grandparent__links, [class*=images-].grandparent.kids-16 .header__grandparent__links, [class*=images-].grandparent.kids-17 .header__grandparent__links, [class*=images-].grandparent.kids-18 .header__grandparent__links, [class*=images-].grandparent.kids-19 .header__grandparent__links, [class*=images-].grandparent.kids-20 .header__grandparent__links { grid-template-columns: repeat(2, minmax(0, 1fr)); } [class*=images-].grandparent .dropdown__family { max-width: calc(var(--wrapper-width) / 5 * 2); } .grandparent.kids-2.images-1 .header__grandparent__links { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grandparent.kids-3.images-1 .header__grandparent__links, .grandparent.kids-4.images-1 .header__grandparent__links, .grandparent.kids-5.images-1 .header__grandparent__links, .grandparent.kids-6.images-1 .header__grandparent__links, .grandparent.kids-7.images-1 .header__grandparent__links, .grandparent.kids-8.images-1 .header__grandparent__links, .grandparent.kids-9.images-1 .header__grandparent__links, .grandparent.kids-10.images-1 .header__grandparent__links, .grandparent.kids-11.images-1 .header__grandparent__links, .grandparent.kids-12.images-1 .header__grandparent__links, .grandparent.kids-13.images-1 .header__grandparent__links, .grandparent.kids-14.images-1 .header__grandparent__links, .grandparent.kids-15.images-1 .header__grandparent__links, .grandparent.kids-16.images-1 .header__grandparent__links, .grandparent.kids-17.images-1 .header__grandparent__links, .grandparent.kids-18.images-1 .header__grandparent__links, .grandparent.kids-19.images-1 .header__grandparent__links, .grandparent.kids-20.images-1 .header__grandparent__links { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grandparent.images-2 .header__grandparent__links, .grandparent.images-2 .menu__block--wide { flex: 2; } .grandparent.grandparent--all-images .header__grandparent__links { flex: 0; } .grandparent.grandparent--all-images.images-1 .menu__block--narrow { flex-grow: 0; flex-basis: 50%; } /* Compressed menu */ .mobile-menu { position: absolute; top: 0; right: 0; bottom: 0; display: none; align-items: center; justify-content: flex-end; color: var(--text); touch-action: manipulation; padding-right: calc(var(--gutter) - 12px); } @media (pointer: coarse) { .mobile-menu { display: flex; } } @media only screen and (max-width: 1023px) { .mobile-menu { padding-right: 8px; } } .mobile-menu__button { position: relative; z-index: 5; display: flex; align-items: center; justify-content: center; color: var(--text); touch-action: manipulation; width: 44px; height: 44px; padding: 8px; margin-right: 5px; } .mobile-menu__button:last-child { margin-right: 0; } .mobile-menu__button .icon { stroke-width: calc(var(--STROKE-WIDTH) - 4px); } .mobile-menu__button .icon-search { transform: translateX(2px); } .cart__toggle { position: relative; font-size: calc(0.875rem * var(--adjust-body)); white-space: nowrap; } /* * Mobile Nav * List of items inside the mobile drawer */ .mobile-nav { --sublist-padding: 8px; --line-height: 1.4; line-height: var(--line-height); font-family: var(--FONT-STACK-NAV); font-style: var(--FONT-STYLE-NAV); margin: 10px 0 0; } .mobile-nav--weight-normal { font-weight: var(--FONT-WEIGHT-NAV); padding: 12px; } .mobile-nav--weight-bold { font-weight: var(--FONT-WEIGHT-NAV-BOLD); } .mobile-nav--weight-bold .mobile-navlink--level-3 { font-weight: var(--FONT-WEIGHT-NAV); } .mobile-nav--bottom { margin-top: 0; } .mobile-nav--bottom .mobile-menu__item { background: #f2dace; } .mobile-nav--bottom .mobile-menu__item .mobile-navlink { padding: 10px 10px !important; font-size: 14px; display: flex; align-items: center; } .mobile-nav--bottom .mobile-menu__item .mobile-navlink svg { width: 20px; margin-right: 5px; } .mobile-nav--bottom .mobile-menu__item:not(:first-child) { margin-top: 5px; } .mobile-nav__sublist { margin: 0; padding: 5px 0; } .mobile-nav__sub-sublist { position: relative; padding: 0; margin: 0; overflow: hidden; } .mobile-nav__sub-sublist:before { content: ""; position: absolute; top: var(--sublist-padding); bottom: var(--sublist-padding); left: 45px; width: var(--BORDER-WIDTH); background: currentcolor; } .mobile-menu__item { position: relative; overflow: hidden; margin: 0; list-style: none; } .mobile-menu__item--level-1>.mobile-dropdown { margin-top: -15px; } .mobile-menu__item--has-items { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; } .mobile-menu__item--has-items>.mobile-navlink { width: calc(100% - 100px); } .mobile-navlink { display: block; width: 100%; } .mobile-navlink--highlight { color: var(--highlight); } .mobile-navlink--level-1 { font-size: calc(1.5rem * var(--adjust-nav)); padding: 15px var(--inner); } .mobile-navlink--level-2 { font-size: calc(1rem * var(--adjust-nav)); padding: 12px 5px 12px var(--inner); } .mobile-navlink--level-3 { font-size: calc(1rem * var(--adjust-nav)); padding: 7px 5px 7px 65px; } .mobile-navlink--small { font-size: calc(1rem * var(--adjust-nav)); padding: 5px 5px 5px var(--inner); } .mobile-navlink--image { display: flex; align-items: center; } /* .mobile-nav__trigger { width: 52px; margin: 0 0 0 auto; } */ .mobile-nav__trigger { width: auto; margin: 0 0 0 auto; height: auto !important; position: unset; display: contents; } .mobile-nav__trigger--level-1 { height: calc(1.5rem * var(--adjust-nav) * var(--line-height) + 30px); } .mobile-nav__trigger--level-2 { align-self: center; height: calc(1rem * var(--adjust-nav) * var(--line-height) + 20px); } .mobile-navlink__image { flex: 0 0 74px; border-radius: var(--radius); margin-right: 0; overflow: hidden; perspective: 1px; height: 70px; width: 100%; max-width: 96px; } .mobile_menu_new img { width: 100%; height: 100%; object-fit: cover; object-position: top; } /*================ Drawers ================*/ .drawer { /* -webkit-transform: translateZ(0); // translateZ hack */ will-change: transform; position: fixed; width: var(--drawer-width); overflow-y: auto; overflow-x: hidden; top: 0; bottom: 0; z-index: 9999; color: var(--text); background-color: var(--bg); transition: var(--drawer-transition), visibility 0s linear 0.4s; visibility: hidden; } .drawer input { border: none; } .drawer textarea { border-color: var(--border); } .drawer .btn, .drawer .shopify-payment-button__button--unbranded { min-width: 0; } .drawer.is-open { content-visibility: visible; visibility: visible; transform: translateX(calc(-1 * var(--drawer-width))); transition: var(--drawer-transition), visibility 0s linear 0s; } .drawer--left { right: 100vw; } .drawer--left.is-open { transform: translateX(var(--drawer-width)); } .drawer--right { left: 100vw; } .drawer--bottom { transform: translateY(100vh); } .drawer--bottom.is-open { transform: none; } .drawer--nav { padding-bottom: var(--inner); } .drawer__header { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; padding: var(--inner); position: relative; } .drawer__close-button { position: absolute; top: 8px; right: 0; width: 54px; height: 54px; padding: 18px; color: inherit; text-decoration: none; z-index: 1; } .drawer__close-button svg { display: block; width: 100%; height: 100%; transition: transform 0.3s ease; pointer-events: none; } .drawer__close-button:hover svg { transform: rotate(90deg); } .drawer__secondary-close-button { display: block; margin: calc(var(--gutter-mobile) + 25px) auto; width: 100%; } .drawer__title { margin: 0; max-width: calc(100% - 70px); font-weight: var(--FONT-WEIGHT-HEADING-BOLD); } .drawer__logo { display: block; position: relative; max-width: 100%; margin: 0; } .drawer__logo-image { display: block; max-height: 60px; max-width: 100%; object-fit: contain; object-position: left; } .cart-drawer__spacer-line { clear: both; display: block; width: 100%; margin-bottom: var(--inner); border-bottom: var(--BORDER-WIDTH) solid var(--accent); } .drawer__overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: var(--black); opacity: 0; visibility: hidden; content: ""; z-index: 9998; transition: visibility 0.4s ease-in-out, opacity 0.4s ease-in-out; } .modal--is-visible .drawer__overlay, .js-drawer-open-cart .drawer__overlay, .js-drawer-open .drawer__overlay { opacity: 0.2; visibility: visible; will-change: opacity; } /*====== Cart Drawer ======*/ @media only screen and (max-width: 479px) { :root { --drawer-width: 100vw; } } .cart-drawer { /* -webkit-transform: translateZ(0); // translateZ hack */ will-change: transform; overflow-y: auto; overflow-x: hidden; position: fixed; top: 0; bottom: 0; max-width: 95%; z-index: 9999; display: flex; flex-direction: column; height: 100%; width: var(--drawer-width); --drawer-width: 475px; left: 100vw; background-color: var(--bg); visibility: hidden; opacity: 0; transition: transform 0.4s ease-in-out, visibility 0s linear 0.4s, opacity 1s; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .cart-drawer::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } @media only screen and (max-width: 479px) { .cart-drawer { max-width: 100%; --drawer-width: 100%; } body .cart-product-slider .carousel-cell { width: 100%; } .cart__checkout { max-width: 100%; } } .cart-drawer .cart__item__price del { display: block; } .cart-drawer .cart__item__price ins { margin-right: 0; } .cart-drawer .cart__discounts { margin-bottom: var(--inner); } .cart-drawer .cart__total__money:before { content: "•"; margin: 0 5px; } .cart-drawer .cart__message { justify-content: flex-start; padding-top: calc(var(--inner) / 4); padding-bottom: calc(var(--inner) / 4); } .cart-drawer .cart__message__success, .cart-drawer .cart__message__default { font-size: calc(0.815rem * var(--adjust-body)); padding-bottom: 2px; } .cart-drawer .cart__message--custom { justify-content: center; padding-top: calc(var(--inner) / 2); padding-bottom: calc(var(--inner) / 2); } .cart-drawer .cart__message--custom p { font-size: inherit; } .cart-drawer .loader--line { position: absolute; top: 0; } .js-drawer-open-cart .cart-drawer { content-visibility: visible; visibility: visible; opacity: 1; /* transform: translateX(calc(-1 * var(--drawer-width))); */ transform: translateX(-100%); transition: transform 0.4s cubic-bezier(0.75, 0, 0.175, 1), visibility 0s linear, opacity 0.4s; } .cart-drawer__head { position: relative; display: block; width: 100%; padding: var(--inner) var(--inner) calc(var(--inner) / 2); } .cart-drawer__head h3 { font-weight: var(--FONT-WEIGHT-HEADING-BOLD); font-size: calc(1.375rem * var(--adjust-heading)); margin: 0 30px 0 0; display: grid; grid-template-columns: min-content auto; gap: 5px; align-items: center; } .cart-drawer__item-qty { display: inline-block; vertical-align: middle; font-size: calc(0.815rem * var(--adjust-heading)); } .cart-drawer__item-qty:before { content: " ("; } .cart-drawer__item-qty:after { content: ")"; } .cart-drawer__close { position: absolute; top: 8px; right: 0; width: 54px; height: 54px; padding: 18px; color: inherit; text-decoration: none; top: 6px; } .cart-drawer__close svg { display: block; width: 100%; height: 100%; transition: transform 0.3s ease; pointer-events: none; } .cart-drawer__close:hover svg { transform: rotate(90deg); } .cart-drawer__body { flex: 1; width: 100%; min-height: 250px; overflow-x: hidden; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .cart-drawer__body::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .aos-initialized .is-updated+.cart-drawer__empty-message:not(.hidden)[data-aos^=fade][data-aos^=fade].aos-animate { animation: cartDrawerItemsFadeInUp 0.6s; } .aos-initialized .is-updated+.cart-drawer__empty-message:not(.hidden)[data-aos^=fade][data-aos^=fade].aos-animate [data-aos^=fade][data-aos^=fade].aos-animate { transition-delay: 0s; } .aos-initialized .is-updated+.cart-drawer__empty-message:not(.hidden)[data-aos^=fade][data-aos^=fade].aos-animate .cart-empty-buttons [data-aos^=fade][data-aos^=fade].aos-animate { transform: none; opacity: 0; } .aos-initialized .is-updated+.cart-drawer__empty-message:not(.hidden)[data-aos^=fade][data-aos^=fade].aos-animate .cart-empty-buttons [data-aos^=fade][data-aos^=fade].aos-animate:nth-child(1) { animation: fadeIn 0.7s 0.1s; animation-fill-mode: forwards; } .aos-initialized .is-updated+.cart-drawer__empty-message:not(.hidden)[data-aos^=fade][data-aos^=fade].aos-animate .cart-empty-buttons [data-aos^=fade][data-aos^=fade].aos-animate:nth-child(2) { animation: fadeIn 0.8s 0.2s; animation-fill-mode: forwards; } .aos-initialized .is-updated+.cart-drawer__empty-message:not(.hidden)[data-aos^=fade][data-aos^=fade].aos-animate .cart-empty-buttons [data-aos^=fade][data-aos^=fade].aos-animate:nth-child(3) { animation: fadeIn 0.9s 0.3s; animation-fill-mode: forwards; } @keyframes cartDrawerItemsFadeInUp { 0% { transform: translateY(var(--move-offset)); opacity: 0; } 100% { transform: translate(0); opacity: 1; } } .cart-drawer__foot { position: relative; width: 100%; margin-top: auto; padding: var(--inner); } .cart-drawer__foot .cart__foot-inner { padding: 0; } .cart-drawer__empty-message { padding: var(--inner); text-align: center; } .cart-drawer__empty-message.visually-hidden, .cart-drawer__empty-message.fallback-text { padding: 0; margin: 0; } .cart-drawer__empty-message .cart-empty-buttons { margin-top: calc(var(--inner) * 2); } .cart-drawer__empty-message .btn, .cart-drawer__empty-message .shopify-payment-button__button--unbranded { width: 100%; } .cart-empty-buttons { display: grid; gap: calc(var(--inner) / 2); grid-template-columns: minmax(0, 1fr); } .cart-empty-buttons .btn, .cart-empty-buttons .shopify-payment-button__button--unbranded { justify-self: center; min-width: 180px; } .cart__checkout { max-width: calc(var(--drawer-width) - var(--inner)); padding-top: 12px; padding-bottom: 12px; } /*====== Cart Item ======*/ .cart__item { position: relative; display: flex; justify-content: flex-start; align-items: flex-start; flex-flow: row wrap; padding: var(--inner); overflow: hidden; will-change: transition, opacity; } .cart__item--no-border { border-bottom: none; } .cart__item.is-removed { transition: none !important; animation: cartItemRemoved 0.5s ease; animation-fill-mode: forwards; } .cart__item__image { font-size: 0; margin-right: var(--inner); } .cart__item__image img { width: 100%; height: 100%; object-fit: cover; filter: brightness(var(--filter-bg)); } .cart-drawer .cart__item__image img { object-fit: contain; } .cart__item__image a { display: flex; flex-flow: row wrap; justify-content: center; align-items: center; text-decoration: none; transition: opacity 0.3s; width: 100px; height: 100px; border-radius: inherit; transform: translateZ(0); overflow: hidden; } .cart__item__content { width: calc(100% - 100px - var(--inner)); } .cart__item__content-inner { display: flex; flex-flow: row nowrap; } .cart__item__price { margin: 0 0 0 auto; font-size: calc(0.815rem * var(--adjust-body)); line-height: 1.25; text-align: right; } .cart__item__price ins { background: none; margin-right: 5px; color: var(--text-darken); text-decoration: none; } .cart__item__price del { display: inline-block; color: var(--text-lighten); } .cart__item__price .line__price { display: block; margin-top: 4px; } .cart__item__info { max-width: 150px; } .cart__item__title { font-size: calc(0.815rem * var(--adjust-body)); font-weight: var(--FONT-WEIGHT-BODY-MEDIUM); line-height: 1.3; margin: 0; } .cart__item__title a { text-decoration: none; } .cart__item__meta { margin: 8px 0 0; } .cart__item__meta:empty { display: none; } .cart__item__selling-plan { font-size: calc(0.815rem * var(--adjust-body)); font-style: var(--FONT-STYLE-BODY-ITALIC); } .cart__item__selling-plan span { display: block; margin: 5px 0; } .cart__item__selected-options, .cart__item__property { margin: 2px 0 0; font-size: calc(0.75rem * var(--adjust-body)); } .cart__item__bottom { display: flex; flex-flow: row wrap; align-items: center; margin-top: 10px; } .cart__item__remove { font-size: calc(0.75rem * var(--adjust-body)); color: inherit; opacity: 0.6; text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); transition: opacity 0.3s; padding: 0 calc(var(--inner) / 2); } .cart__item__remove:hover { opacity: 1; text-decoration: none; } /* .product__selectors { display: grid; grid-template-columns: repeat(2, minmax(0, 50%)); row-gap: 20px; margin-right: calc(var(--form-left) * -1); z-index: 110; } */ .product__selectors { display: grid; row-gap: 20px; margin-right: calc(var(--form-left) * -1); z-index: 110; width: 80%; } @media only screen and (max-width: 767px) { .product__selectors { row-gap: var(--form-margin-mobile); } } @media only screen and (max-width: 767px) { .product__selectors { --swatch-size: var(--swatch-size-mobile); } } @media only screen and (max-width: 479px) { .product__selectors { grid-template-columns: minmax(0, 100%); margin-right: 0; } } .product__selectors .selector-wrapper { margin-right: var(--form-left); } @media only screen and (max-width: 479px) { .product__selectors .selector-wrapper { margin-right: 0; } } .product__selectors .selector-wrapper .select-popout { margin-bottom: 0; } .product__selectors .selector-wrapper .select-popout--small { max-width: none; } .product__selectors .selector-wrapper--boxes, .product__selectors .selector-wrapper--swatches { grid-column: 1/-1; } .product__selectors .selector-wrapper--swatches { order: -1; margin-bottom: 0; } .selector-wrapper--swatches { position: relative; } .selector-wrapper--swatches .radio__legend { z-index: auto; } .selector-wrapper--swatches .radio__legend__label { display: block; } .selector-wrapper--swatches .radio__fieldset { padding-top: calc((var(--BORDER-WIDTH) + 5px) / 2); padding-left: calc((var(--BORDER-WIDTH) + 5px) / 2); margin-top: calc(-1 * (var(--BORDER-WIDTH) + 5px) / 2); margin-left: calc(-1 * (var(--BORDER-WIDTH) + 5px) / 2); } .selector-wrapper--swatches .radio__fieldset--circle { padding-top: 1px; padding-left: 1px; margin-top: 1px; margin-left: 1px; } .selector-wrapper--large .radio__fieldset { overflow: hidden; transition: max-height 0.5s ease; max-height: calc(0.875rem * var(--adjust-body) * 1.5625 + var(--form-margin) / 4 + var(--swatch-height) * 2 + 12px + 12px - 1px); } @media only screen and (max-width: 767px) { .selector-wrapper--large .radio__fieldset { max-height: calc(0.8rem * var(--adjust-body) * 1.1 + 12px + var(--swatch-height) * 2 + var(--form-margin-mobile) * 2); } } .selector-wrapper--large .radio__fieldset--circle { max-height: calc(0.875rem * var(--adjust-body) * 1.5625 + var(--form-margin) / 4 + var(--swatch-size) * 2 + 12px + 12px); } @media only screen and (max-width: 767px) { .selector-wrapper--large .radio__fieldset--circle { max-height: calc(0.8rem * var(--adjust-body) * 1.1 + var(--form-margin-mobile) + var(--swatch-size) * 2 + var(--form-margin-mobile) * 2); } } body:not(.no-outline) .selector-wrapper--swatches .radio__fieldset:focus-within, .selector-wrapper--visible .radio__fieldset { max-height: var(--swatches-max-height, 500px); } /* = both radio and swatch = */ .radio__legend { display: block; margin: 0; width: 100%; z-index: 1; margin-bottom: calc(var(--form-margin) / 4); } @media only screen and (max-width: 767px) { .radio__legend { margin-bottom: var(--form-margin-mobile); } } .radio__legend.is-hidden { display: none; padding: 0; margin: 0; } .radio__legend--flex { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; } .radio__legend__dot, .select__label__dot { display: inline-block; vertical-align: middle; width: 4px; height: 4px; border-radius: 50%; margin: 0 8px; background-color: var(--text); } .radio__legend__label { font-size: calc(0.875rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .radio__legend__label { display: block; font-size: calc(0.8rem * var(--adjust-body)); line-height: 1.1; } } .radio__label { transition: color 0.3s ease, background 0.3s ease, border 0.3s ease; } .swatch__label:hover, .radio__label:hover { cursor: pointer; } /* = radio button specific = */ .radio__button { position: relative; display: inline-block; margin: 0 12px 12px 0; border-color: transparent; font-size: calc(0.875rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .radio__button { margin: 0 var(--form-margin-mobile) var(--form-margin-mobile) 0; } } .radio__button.sold-out input:checked~.radio__label, .radio__button.unavailable input:checked~.radio__label { background-color: var(--text); } .radio__button.sold-out .radio__label, .radio__button.unavailable .radio__label { background-color: rgba(0, 0, 0, 0.1); text-decoration: line-through; } .radio__fieldset { display: flex; flex-wrap: wrap; margin: 0 -12px -12px 0; border: 0; padding: 0; } @media only screen and (max-width: 767px) { .radio__fieldset { margin: 0 -8px -8px 0; } } .radio__fieldset .radio__label { display: block; font-size: inherit; line-height: 1.3; position: relative; margin: 0; padding: var(--form-top) var(--form-left); color: var(--text); background-color: var(--bg); border: var(--BORDER-WIDTH) solid var(--border); border-radius: var(--RADIUS); } @media only screen and (max-width: 767px) { .radio__fieldset .radio__label { font-size: calc(0.75rem * var(--adjust-body)); line-height: 1.1; padding: 10px 12px; min-width: 37px; text-align: center; } } .radio__fieldset .radio__label:hover, .radio__fieldset .radio__label:active, .radio__fieldset .radio__label:focus, .radio__fieldset .radio__input:checked~.radio__label { color: var(--bg); background-color: var(--text); border-color: var(--text); } .radio__fieldset .radio__fieldset-arrow { position: absolute; bottom: 50%; display: block; width: 26px; height: 26px; max-height: none; margin-bottom: -26px; border-radius: 0; box-shadow: none; } .radio__fieldset .radio__fieldset-arrow--prev { left: 5px; transform: scale(-1, 1); } .radio__fieldset .radio__fieldset-arrow--next { right: 5px; } .radio__fieldset .radio__fieldset-arrow:before:before, .radio__fieldset .radio__fieldset-arrow:before:after { content: ""; position: absolute; width: 10px; height: 2px; border-radius: calc(2px/ 2); background-color: currentColor; right: calc(50% - 10px); } .radio__fieldset .radio__fieldset-arrow:before:before { top: calc(50% - 2px/ 2); transform: rotate(calc(180deg - 45deg)) translate(50%, 50%); } .radio__fieldset .radio__fieldset-arrow:before:after { bottom: calc(50% - 2px/ 2); transform: rotate(calc(180deg + 45deg)) translate(50%, -50%); } .radio__fieldset .swatch__button { margin: 0 12px 12px 0; } @media only screen and (max-width: 767px) { .radio__fieldset .swatch__button { margin: 0 var(--form-margin-mobile) var(--form-margin-mobile) 0; } } @media only screen and (max-width: 767px) { .radio__fieldset--rectangle { margin-bottom: -4px; } .radio__fieldset--rectangle .radio__legend { margin-bottom: 12px; } } .selector-wrapper--grid { display: inline-flex; } .selector-wrapper--grid .radio__fieldset { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(75px, 100%), 1fr)); width: calc(100% + 12px); } @media only screen and (max-width: 767px) { .selector-wrapper--grid .radio__fieldset { display: flex; flex-wrap: wrap; } } .selector-wrapper--grid .radio__label { height: 100%; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; text-align: center; } @media only screen and (max-width: 767px) { .selector-wrapper--grid .radio__label { min-width: 27px; } } .selector-wrapper.hidden { display: none; } /* = swatch button specific = */ .swatch__button { --swatch: #CCC; display: inline-block; vertical-align: top; position: relative; pointer-events: initial; } .swatch__input, .radio__input { position: absolute; top: 0; left: 0; opacity: 0; width: 0; height: 0; margin: 0; overflow: hidden; pointer-events: none; display: block; } .radio__input.sold-out~label, .radio__input.unavailable~label { text-decoration: line-through; } .selector-wrapper fieldset label { margin-top: unset; } .swatch__button .swatch__label { --inner-offset: calc(var(--BORDER-WIDTH) + 5px); --inner-size: calc(var(--swatch-size) - var(--inner-offset)); display: flex; justify-content: center; align-items: center; position: relative; width: var(--swatch-size); height: var(--swatch-size); margin: 0; border-radius: 100%; color: var(--black); background: var(--swatch) no-repeat center center/cover; } @media only screen and (max-width: 767px) { .swatch__button .swatch__label { --inner-offset: calc(var(--BORDER-WIDTH) + 3px); } } .swatch__button .swatch__label:before { content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; width: var(--inner-size); height: var(--inner-size); border-radius: 50%; border: var(--BORDER-WIDTH) solid var(--bg); opacity: 0; visibility: hidden; } .swatch__button .swatch__label:after { content: ""; display: block; position: absolute; top: 50%; left: 50%; z-index: 1; width: var(--swatch-size); height: var(--BORDER-WIDTH); background-color: var(--text); transform: translate(-50%, -50%) rotate(135deg); opacity: 0; visibility: hidden; } .swatch__button--rectangle .swatch__label { border-radius: 0; width: var(--swatch-width); height: var(--swatch-height); color: var(--swatch); } .swatch__button--rectangle .swatch__label:before { border-radius: 0; width: calc(var(--swatch-width) + var(--BORDER-WIDTH) + 5px); height: calc(var(--swatch-height) + var(--BORDER-WIDTH) + 5px); border-color: currentcolor; } .swatch__button--rectangle .swatch__label:after { width: calc(var(--swatch-width) + var(--BORDER-WIDTH) + 1px); height: var(--BORDER-WIDTH); transform: translate(-50%, -50%) rotate(156deg); } .swatch__button.sold-out .swatch__label:after, .swatch__button.unavailable .swatch__label:after { opacity: 1; visibility: visible; } .swatch__button .icon-check { display: block; width: 16px; margin-right: 2px; opacity: 0; visibility: hidden; transition: opacity 0.2s ease, visibility 0s linear 0.2s; fill: var(--white); } @media only screen and (max-width: 767px) { .product__selectors .swatch__button .swatch__label .icon { width: 14px; margin-right: 1px; } } .swatch__button .swatch__input:checked~.swatch__label:before { opacity: 1; visibility: visible; } .swatch__button--circle.sold-out .swatch__input:checked~.swatch__label:after, .swatch__button--circle.unavailable .swatch__input:checked~.swatch__label:after { width: var(--inner-size); } .swatch__button:not(.sold-out, .unavailable) .swatch__input:checked~.swatch__label .icon { visibility: visible; opacity: 1; transition-delay: 0s; } .swatch__more { display: none; font-weight: var(--FONT-WEIGHT-BUTTON); font-size: calc(0.75rem * var(--adjust-body)); } .swatch__more span { animation: fadeIn 1s ease; pointer-events: none; } .swatch__more span:nth-child(1) { display: inline-block; } .swatch__more span:nth-child(2) { display: none; } .selector-wrapper--large .swatch__more { display: inline-block; margin-top: 10px; } .selector-wrapper--visible .swatch__more span:nth-child(1), body:not(.no-outline) .radio__fieldset:focus-within+.swatch__more span:nth-child(1) { display: none; } .selector-wrapper--visible .swatch__more span:nth-child(2), body:not(.no-outline) .radio__fieldset:focus-within+.swatch__more span:nth-child(2) { display: inline-block; } .product__form .btn.swatch__more, .product__form .swatch__more.shopify-payment-button__button--unbranded { width: auto; } .select__fieldset .select-popout { margin: 0; display: flex; } .select__fieldset .radio__legend__label, .select__fieldset .select__label { display: block; padding-right: 0; margin-right: 0; margin-bottom: 8px; font-size: calc(0.875rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .select__fieldset .radio__legend__label, .select__fieldset .select__label { font-size: calc(0.75rem * var(--adjust-body)); line-height: 1.1; } } .select__fieldset .radio__legend__label.is-hidden, .select__fieldset .select__label.is-hidden { display: none; margin: 0; padding: 0; } .select__fieldset .radio__legend__label { display: block; padding-right: 0; margin-right: 0; } .select__fieldset .radio__legend__dot { margin: 0 10px; } .select__fieldset--small .radio__legend__label { display: inline; margin-bottom: 0; text-transform: uppercase; letter-spacing: 0.1em; } .variant__labels--hide .radio__legend { margin: 0; } .variant__labels--hide .radio__legend__label, .variant__labels--hide .select__label { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .variant__labels--hide .selector-wrapper--boxes { margin-bottom: calc(var(--form-margin) / 2); } .selector-wrapper--qty { grid-column-start: 1; } /* = handle white swatch = */ .palette--light .swatch__button .swatch__label[data-swatch=white i] { border: var(--BORDER-WIDTH) solid var(--COLOR-BLACK); } .palette--light .swatch__button--rectangle .swatch__label[data-swatch=white i]:before { border-color: inherit; } .palette--light .swatch__button--circle .swatch__label[data-swatch=white i]:before { border-color: inherit; width: calc(var(--inner-size) - var(--BORDER-WIDTH)); height: calc(var(--inner-size) - var(--BORDER-WIDTH)); } .palette--light .swatch__button--circle.sold-out .swatch__input:checked~.swatch__label[data-swatch=white i]:after { width: calc(var(--inner-size) - var(--BORDER-WIDTH)); } .swatch__button.sold-out .swatch__label[data-swatch=white i]:after { background-color: var(--COLOR-BLACK); } /* = handle black swatch = */ .palette--dark .swatch__button .swatch__label[data-swatch=black i] { border: var(--BORDER-WIDTH) solid var(--COLOR-WHITE); } .palette--dark .swatch__button--rectangle .swatch__label[data-swatch=black i]:before { border-color: inherit; } .palette--dark .swatch__button--circle .swatch__label[data-swatch=black i]:before { border-color: inherit; width: calc(var(--inner-size) - var(--BORDER-WIDTH)); height: calc(var(--inner-size) - var(--BORDER-WIDTH)); } .palette--dark .swatch__button--circle.sold-out .swatch__input:checked~.swatch__label[data-swatch=black i]:after { width: calc(var(--inner-size) - var(--BORDER-WIDTH)); } .swatch__button.sold-out .swatch__label[data-swatch=black i]:after { background-color: var(--COLOR-WHITE); } .swatch__button .swatch__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-size: 0; font-style: normal; line-height: 0; text-indent: -100%; overflow: hidden; } .is-focused .swatch__button .swatch__input:focus~.swatch__label:before { position: absolute; content: ""; left: -3px; bottom: -10px; height: 2px; width: calc(100% + 6px); background: var(--SECONDARY-BUTTONS-COLOR-BG); } .is-focused .radio__button input:focus~.swatch__label:before { position: absolute; content: ""; left: 0; bottom: -10px; height: 2px; width: 100%; background: var(--SECONDARY-BUTTONS-COLOR-BG); } /* * Low quantity remaining */ .variant__countdown { --line-height: 1; --dot-size: 8px; font-size: calc(0.9rem * var(--adjust-body)); line-height: var(--line-height); padding: 0; margin: 0; } @media only screen and (max-width: 767px) { .variant__countdown { font-size: calc(0.75rem * var(--adjust-body)); } } .variant__countdown--in { --dot-color: var(--COLOR-SUCCESS); } .variant__countdown--low { --dot-color: var(--COLOR-WARN); } .variant__countdown--out { --dot-color: var(--COLOR-ERROR); } .variant__countdown--unavailable { --dot-color: var(--text-alpha-50); } .count-is-in .variant__countdown--in, .count-is-low .variant__countdown--low, .count-is-out .variant__countdown--out, .count-is-unavailable .variant__countdown--unavailable { display: block; } .variant__countdown--in, .variant__countdown--low, .variant__countdown--out, .variant__countdown--unavailable { display: none; padding-left: 16px; position: relative; } .variant__countdown--in:after, .variant__countdown--in:before, .variant__countdown--low:after, .variant__countdown--low:before, .variant__countdown--out:after, .variant__countdown--out:before, .variant__countdown--unavailable:after, .variant__countdown--unavailable:before { content: ""; display: block; position: absolute; top: calc((0.9375rem * var(--adjust-body) * var(--line-height) - var(--dot-size)) / 2); left: 0; width: var(--dot-size); height: var(--dot-size); background-color: var(--dot-color); border-radius: 50%; } .variant__countdown--unavailable:after, .variant__countdown--unavailable:before { background-color: #d01345; } @media only screen and (max-width: 767px) { .variant__countdown--in:after, .variant__countdown--in:before, .variant__countdown--low:after, .variant__countdown--low:before, .variant__countdown--out:after, .variant__countdown--out:before, .variant__countdown--unavailable:after, .variant__countdown--unavailable:before { top: calc((0.7375rem * var(--adjust-body) * var(--line-height) - var(--dot-size)) / 2); } } .variant__countdown--in:after, .variant__countdown--low:after, .variant__countdown--out:after, .variant__countdown--unavailable:after { opacity: 1; } .variant__countdown--in:before, .variant__countdown--low:before, .variant__countdown--out:before, .variant__countdown--unavailable:before { opacity: 0.2; animation: pulseOut 2.5s linear; animation-iteration-count: infinite; } @media only screen and (max-width: 767px) { .product__form .variant__countdown .variant__countdown--in:after, .product__form .variant__countdown .variant__countdown--in:before, .product__form .variant__countdown .variant__countdown--low:after, .product__form .variant__countdown .variant__countdown--low:before, .product__form .variant__countdown .variant__countdown--out:after, .product__form .variant__countdown .variant__countdown--out:before, .product__form .variant__countdown .variant__countdown--unavailable:after, .product__form .variant__countdown .variant__countdown--unavailable:before { top: calc((0.7375rem * var(--adjust-body) * var(--line-height) - var(--dot-size)) / 2); } } /*================ Footer ================*/ .site-footer { position: relative; background: var(--bg); color: var(--text); padding-top: var(--gutter); padding-bottom: var(--gutter); } @media only screen and (max-width: 767px) { .site-footer { padding-bottom: var(--gutter-mobile); } } .footer-blocks { --gutter: 40px; --offset: calc(var(--gutter) * -1); display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--gutter); } @media only screen and (min-width: 1024px) { .footer-blocks { display: flex; margin: 0 calc(var(--offset) / 2); gap: 0; } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .footer-blocks { --gutter: 60px; grid-template-columns: repeat(2, minmax(0, 1fr)); } } .footer-block { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--gutter-mobile); align-content: start; } @media only screen and (min-width: 1024px) { .footer-block { padding: 0 calc(var(--gutter) / 2); flex: 1 1 calc(100% / var(--items-count)); } } @media only screen and (min-width: 1024px) { .footer-block--newsletter, .footer-block--text { flex-basis: 40%; } } .footer-block .rte, .footer-title, .footer-title p, .footer-title__button { margin: 0; } .footer-block .rte p:first-child { margin-top: 0; } .footer-block .rte p:last-child { margin-bottom: 0; } .footer-block__logo__image { display: block; max-width: 100%; } .footer-block__shop-name { color: var(--text); font-size: calc(1.125rem * var(--adjust-heading)); margin-bottom: 0; } .footer-title { color: var(--text); } .footer-title__button { text-align: left; -webkit-appearance: none; } @media only screen and (min-width: 768px) { .footer-title__button { display: block; cursor: text; } .footer-title__button .icon { display: none; } } @media only screen and (max-width: 767px) { .footer-title__button { position: relative; display: block; width: 100%; padding: 5px 32px 5px 0; margin-bottom: calc(var(--gutter-mobile) * -1); transition: margin 0.3s ease; } .footer-title__button.is-expanded { margin-bottom: 0; } .footer-title__button .icon { top: 0; right: 0; width: 14px; height: 100%; } } .footer-link:hover, .footer-copyright a:hover { color: var(--text-alpha-85); } .footer-link { transition: color 0.25s; } .footer-links { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; list-style: none; margin: 0; font-size: calc(1rem * var(--adjust-body)); } @media only screen and (min-width: 768px) { .footer-links { transform: none; } } .footer-links li { margin-bottom: 0.5em; } .footer-links li:last-child { margin-bottom: 0; } @media only screen and (min-width: 768px) { .footer-links__wrapper { height: auto; opacity: 1; visibility: initial; } } .footer-articles-list { margin: 0; list-style: none; font-size: calc(1rem * var(--adjust-body)); line-height: 1.29; } .footer-articles-list li { margin: 0 0 10px; } .footer-tags-list { list-style: none; margin: 0; display: flex; flex-wrap: wrap; word-break: break-word; } .footer-tags-list li { margin: 0 8px 8px 0; } .footer-link--tags { color: var(--text); border: var(--BORDER-WIDTH) solid var(--border); background: var(--bg); border-radius: var(--RADIUS-SMALL); font-size: calc(0.75rem * var(--adjust-body)); text-transform: uppercase; letter-spacing: 0.02em; display: inline-block; padding: 5px 10px; transition: color 0.2s ease, border 0.2s ease; } .footer-link--tags:hover { border-color: var(--border-alpha-60); color: var(--text-alpha-50); } .footer-bottom { display: grid; grid-template-columns: minmax(0, 100%); grid-auto-columns: min-content; align-content: start; gap: var(--gutter-mobile); color: inherit; margin-top: var(--gutter); position: relative; } @media only screen and (min-width: 768px) { .footer-bottom { margin-top: 32px; align-items: center; text-align: center; } } .footer-bottom>* { width: 100%; } .social-sharing-wrapper { display: flex; flex-wrap: wrap; align-items: center; /* justify-content: center; */ line-height: 0; } @media only screen and (max-width: 767px) { .social-sharing-wrapper { justify-content: flex-start; } } .social-sharing-icon { display: inline-block; position: relative; opacity: 1; transition: opacity 0.25s; color: inherit; border-radius: 50%; margin-right: 16px; } .social-sharing-icon:last-child { margin-right: 0; } @media only screen and (max-width: 767px) { .social-sharing-icon { margin: 0 16px 10px 0; } } .social-sharing-icon:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 50%; background: var(--bg); border: 1px solid var(--text); opacity: 0; z-index: -1; will-change: transform, opacity; } .social-sharing-icon .icon { width: 30px; height: 30px; stroke: none; fill: currentcolor; } .social-sharing-icon .icon-rss-feed { padding: 3px 0; } .footer-copyright { font-size: calc(0.75rem * var(--adjust-body)); } .footer-copyright a { color: inherit; } .footer-copyright__powered { margin-right: 10px; } .footer-copyright__link { margin-right: 10px; } .footer-copyright__link:last-child { margin-right: 0; } .payment-icon-list { display: flex; flex-wrap: wrap; list-style: none; margin: 0; } @media only screen and (min-width: 768px) { .payment-icon-list { /* justify-content: center; */ } } .payment-icon-list>li { font-size: calc(1.375rem * var(--adjust-body)); display: block; margin-right: 10px; margin-bottom: 0; } .payment-icon-list>li:last-child { margin-right: 10px; } @media only screen and (max-width: 767px) { .payment-icon-list>li { margin-bottom: 10px; } } .payment-icon { display: block; } .site-footer--wavy { margin-top: 60px; z-index: 105; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .site-footer--wavy { padding-top: 0; } } @media only screen and (max-width: 767px) { .site-footer--wavy { margin-top: 30px; } } .footer__svg { --wave-height: 100px; position: absolute; width: 100%; top: calc(var(--wave-height) * -1 + 1px); display: flex; } .footer__svg svg { height: var(--wave-height); } .footer__svg #footer__svg--big-wave { fill: var(--bg); } .footer__svg #footer__svg--little-wave { fill: var(--bg); } @media only screen and (max-width: 767px) { .footer__svg { --wave-height: 50px; } } /*================ Accordions ================*/ .accordions-section { --icon-space: 53px; background: var(--bg); } .accordion__header { text-align: center; } .accordion__header .wrapper:after { content: none; } .accordion__list { list-style: none; margin: 0 auto; } .accordion__item { position: relative; display: block; margin-bottom: 0; margin-bottom: var(--MB); background: var(--bg); } .accordion__item:last-child { margin-bottom: 0; } .accordion__item:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: var(--BORDER-WIDTH); background: var(--text); opacity: var(--border-opacity); pointer-events: none; } .accordion__item [data-collapsible-container].is-expanded { overflow: hidden; } .accordion__item--padded .accordion__item__title { padding-left: var(--inner); padding-right: calc(var(--inner) + var(--icon-space)); } .accordion__item--padded .accordion__item__title .icon { margin-right: var(--inner); } .accordion__item--padded .accordion__item__text { padding-left: var(--inner); padding-right: var(--inner); padding-top: var(--inner); } .accordion__item--padded .accordion__item__text-wrapper:before { content: ""; height: var(--BORDER-WIDTH); background: var(--bg-padded-line); width: 100%; position: absolute; } .accordion__item__title { display: block; position: relative; width: 100%; padding: 10px var(--icon-space) 10px 0; margin: 0; border: 0; background: none; text-align: left; } @media only screen and (min-width: 768px) { .accordion__item__title { padding: 15px var(--icon-space) 15px 0; } } .accordion__item__title:disabled { cursor: pointer; } .accordion__item__title .icon { top: 0; right: 0; height: 100%; max-height: 51px; width: 14px; } .accordion__item__title__text { position: relative; display: inline-block; font-size: calc(1rem * var(--adjust-body)); } .accordion__item__text-wrapper { padding-right: var(--icon-space); } .accordion__item__text { margin: 0; padding: 0 0 var(--inner); overflow: hidden; } .accordion__item__text p { margin: 0 0 15px; } .accordion__columns { display: flex; justify-content: space-between; flex-wrap: wrap; } .accordion__column { width: 100%; margin-bottom: var(--MB); } @media only screen and (min-width: 768px) { .accordion__column { width: calc(50% - var(--grid-gutter)); margin-bottom: 0; } } @media only screen and (max-width: 767px) { .aos-initialized .accordion__item[data-aos][data-aos-delay].aos-animate { transition-delay: var(--AD); } } .accordion__column:last-child { margin-bottom: 0; } /*================ Account ================*/ #customer_login>p { float: left; } .return a { color: var(--text-lighten); } .no-padding { padding: 0px; } .section-header--address { text-align: left; } @media only screen and (min-width: 768px) { .section-header--address { display: flex; justify-content: space-between; } } .address-return { display: block; } .address-title { display: block; } .template-customers-account table, .template-customers-account th, .template-customers-account td { border-width: var(--BORDER-WIDTH); padding: 20px 15px 20px 15px; color: var(--text); } .template-customers-account .table-wrap { margin-top: 10px; } .address { padding-bottom: 25px; position: relative; } .addresses-wrapper { display: flex; flex-direction: column; } .address__edit { padding-top: 25px; } .address__form__name, .address__form__bottom, .address__edit__name, .address__edit__bottom { display: grid; grid-template-columns: minmax(0, 1fr); } @media only screen and (min-width: 480px) { .address__form__name, .address__form__bottom, .address__edit__name, .address__edit__bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gutter); } } .order__item { display: grid; grid-template-columns: minmax(0, 1fr); } @media only screen and (min-width: 768px) { .order__item { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); column-gap: var(--gutter-mobile); } } @media only screen and (min-width: 1024px) { .order__item { column-gap: var(--gutter); } } .order__item td a { position: relative; display: inline-block; text-decoration: none !important; } .order__item td a:before, .order__item td a:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .order__item td a:before { transform: scaleX(0); transform-origin: left; } .order__item td a:after { transform-origin: right; } .no-touch .order__item td a:hover { background: transparent; border: 0; } .no-touch .order__item td a:hover:before, .no-touch .order__item td a:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .order__item td a:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .order__item .order__item__property { margin: 2px 0 0; font-size: calc(0.85rem * var(--adjust-body)); } .template-customers-order th, .template-customers-order td { border: var(--BORDER-WIDTH) solid var(--border); padding: 20px 15px 20px 15px; } .template-customers-order .note { padding: 0px; color: var(--text-lighten); text-align: inherit; opacity: 0.7; } .template-customers-order table { overflow: scroll; } .responsive-order th { display: none; } .account__heading { display: inline-block; margin-right: 20px; } .account__heading--small { font-size: calc(2.5rem * var(--adjust-heading)); } .account__subheading { margin: 0 0 var(--gutter-mobile); } @media only screen and (min-width: 768px) { .account__subheading { margin: 0 0 var(--gutter); } } .template-customers-order ::-webkit-scrollbar, .template-customers-account ::-webkit-scrollbar { -webkit-appearance: none; width: 2px; } .template-customers-order ::-webkit-scrollbar-thumb, .template-customers-account ::-webkit-scrollbar-thumb { border-radius: 0px; background-color: rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5); } .address-selector-wrapper { position: relative; display: block; padding-right: 0; z-index: 99; } .address-selector-wrapper .icon-select { position: absolute; top: 0px; right: 0px; height: 100%; width: 54px; padding: 0 20px; pointer-events: none; transform: rotate(90deg); } .template-customers-addresses label { display: block; margin-bottom: 5px; } .template-customers-addresses label.inline { display: inline-block; margin: 0 0 0 4px; } @media only screen and (max-width: 1023px) { .responsive-order { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .responsive-order th, .responsive-order td { width: 100%; display: block; } .template-customers-account table, .template-customers-account tbody { border: none; } .template-customers-account table, .template-customers-account th, .template-customers-account td { border-width: 1px; } .template-customers-account th, .template-customers-account td { background: none; padding: 10px; vertical-align: top; } .template-customers-account .table-wrap { margin-left: 0px; margin-top: 0px; } .template-customers-account .responsive-order th { border-left: var(--BORDER-WIDTH) solid var(--border); border-top: none; border-right: none; } .template-customers-account .responsive-order td { border-right: var(--BORDER-WIDTH) solid var(--border); border-top: none; } .template-customers-account .responsive-order th:first-of-type, .template-customers-account td:first-of-type { border-width: 0px 0px var(--BORDER-WIDTH) 0px; padding: 20px 15px 10px 0px; } .template-customers-account .responsive-order td:last-of-type { border-width: var(--BORDER-WIDTH); } .template-customers-account .responsive-order th:last-of-type { border-width: var(--BORDER-WIDTH); } .address-return { display: block; margin-bottom: 10px; } .template-customers-order .order-title { font-size: calc(1.125rem * var(--adjust-body)); } .template-customers-order table { border-collapse: separate; } .template-customers-order th, .template-customers-order td { display: block; width: 100%; background: none; border-top: 0; border-bottom: var(--BORDER-WIDTH) solid var(--border); border-left: 0; } .template-customers-order td:not(:first-child) { border-right: 0; } .template-customers-order th:first-of-type, .template-customers-order td:first-of-type { border-top-width: 2px; } .template-customers-order tfoot tr:last-of-type td, .template-customers-order tfoot tr:last-of-type th { border-bottom: 0; } .desktop-order { display: none !important; } .toggle-wrapper { position: relative; text-align: center; right: 0px; margin-bottom: 25px; } .btn--checkout { margin-bottom: 10px; } .account__heading { padding-left: 0px; } .password-input, .signup-input { margin-bottom: 10px; } } .order__item__subscription { font-size: calc(0.75rem * var(--adjust-body)); margin-top: 10px; margin-bottom: 0; } .order__discounts p { margin: 0; } .account__table { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--gutter-mobile); } @media only screen and (min-width: 768px) { .account__table { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); } } @media only screen and (min-width: 1024px) { .account__table { gap: var(--gutter); } } .reset-password { display: flex; justify-content: center; } .reset-password__form { width: 100%; } @media only screen and (min-width: 768px) { .reset-password__form { width: 33%; } } /*================ Article ================*/ .section-article { background-color: var(--bg); } .article-page .share-button { z-index: 1; } .article-tags a::after { content: ","; } .article-tags a:last-child::after { content: none; } .section-header--article { padding-top: 0px; } .section-header--article .article__meta { margin-bottom: 0; } .article__image__wrapper { position: relative; text-align: center; margin-bottom: 30px; } .article__nav-arrows { display: flex; justify-content: space-between; } .article__nav-arrows a { text-decoration: none; } #Comments .form-vertical, #Comments .post-comment { margin-bottom: 0; } #comment_form { padding-top: 20px; padding-bottom: 20px; } #CommentBody { height: 118px; } .post-comment { margin-top: 10px; } .comment .rte { margin-top: -10px; } .comment__wrapper { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--grid-gutter); } @media only screen and (min-width: 768px) { .comment__wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .article__meta>*:not(:last-child):after { content: "•"; padding: 0 7px; } .section-banner-with-text-columns { display: flex; position: relative; } .banners { display: flex; align-items: flex-end; --inner-gutter: 16px; } .banners .banner { position: static; padding: 60px var(--inner-gutter); } @media only screen and (min-width: 768px) { .banners .banner { opacity: 0.5; transition: opacity 0.3s ease; } } @media only screen and (max-width: 767px) { .banners .banner { display: flex; align-items: center; padding: 60px var(--gutter-mobile); min-width: 100%; } } @media only screen and (min-width: 768px) { .banners .banner:only-child, .banners .banner.is-selected { opacity: 1; } } .banners__media { position: absolute; width: 100%; left: 0; top: var(--PT); bottom: var(--PB); z-index: 0; pointer-events: none; overflow: hidden; } .banners__media .flickity-viewport { position: absolute; width: 100%; top: 0; bottom: 0; left: 0; } .banner__image, .banners__image { width: 100%; position: absolute; top: 0; bottom: 0; left: 0; } .banner__image:after, .banners__image:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); } .banners__image .svg-placeholder, .banners__image svg, .banners__image img { width: 100%; height: 100%; object-fit: cover; } .banners__image-inner { position: absolute; width: 100%; height: 100%; top: 0; left: 0; transition: transform 1s ease-out; transform: scale(1.05); } .banners__media.aos-animate .is-selected .banners__image-inner, .banners__media.aos-animate .banners__image:only-child .banners__image-inner { transform: scale(1); } .banners__media:not(.aos-init) .is-selected .banners__image-inner, .banners__media:not(.aos-init) .banners__image:only-child .banners__image-inner { transform: scale(1); } .banners__content { z-index: 1; width: calc(100% + var(--grid-gutter) * 2); margin: 0 calc(var(--grid-gutter) * -1); } @media only screen and (max-width: 767px) { .banners__content { width: calc(100% + var(--gutter-mobile) * 2); margin: 0 calc(var(--gutter-mobile) * -1); } } @media only screen and (min-width: 768px) { .banners__content .flickity-viewport .flickity-slider, .banners__content:not(.flickity-enabled) .flickity-slider { transform: translateX(0%) !important; } } @media only screen and (min-width: 768px) { .banners__content .flickity-viewport .banner, .banners__content:not(.flickity-enabled) .banner { width: calc(100% / var(--item-count, 1)); } } .banner__content { position: relative; z-index: 1; } .banner__entry p, .banner__entry, .banner__subheading, .banner__heading { color: inherit; } .banner__entry p, .banner__entry, .banner__btn.btn--text, .banner__subheading, .banner__heading { margin: 0 0 calc(var(--inner-gutter) / 2); } .banner__entry p:last-child, .banner__entry:last-child, .banner__btn.btn--text:last-child, .banner__subheading:last-child, .banner__heading:last-child { margin-bottom: 0; } .no-touch .banner .btn--text:before, .no-touch .banner .btn--text:after { background: currentColor; } .banner__subheading, .banner__entry { line-height: 1.25; } .banner__entry p { font-size: calc(0.875rem * var(--adjust-body)); } .banner__btn { line-height: 1.25; text-transform: var(--BUTTON-TEXT-CAPS); } .banners .flickity-page-dots { position: absolute; bottom: 20px; left: 0; right: 0; z-index: 2; } @media only screen and (min-width: 768px) { .banners .flickity-page-dots { display: none; } } .banners .dot { border-color: currentColor; transition: border 0.5s ease, width 0.5s ease, opacity 0.5s ease; position: relative; } .banners .dot:after { content: ""; position: absolute; left: -2px; right: -2px; top: -2px; bottom: -2px; } .banners .dot:hover { opacity: 1; } @media only screen and (max-width: 767px) { .no-js .banners { height: auto; } } .no-js .banners__content { display: flex; } @media only screen and (max-width: 767px) { .no-js .banners__content { white-space: nowrap; overflow-x: auto; } } @media only screen and (max-width: 767px) { .no-js .banners__content .banner { width: 100vw; white-space: initial; display: inline-flex; align-content: center; } } @media only screen and (max-width: 767px) { .no-js .banners__media { display: none; } } .no-js .banners__image~.banners__image { display: none; } .no-js .banner { opacity: 1; } @media only screen and (max-width: 767px) { .no-js .banner { position: relative; } } .no-js .banner__image { position: absolute; z-index: 0; } @media only screen and (min-width: 768px) { .no-js .banner__image { opacity: 0; transition: opacity 0.5s ease; } } .no-js .banner__image .svg-placeholder, .no-js .banner__image svg, .no-js .banner__image img { width: 100%; height: 100%; object-fit: cover; } /*================ Banner image ================*/ .banner-image { --text-gap: 16px; --scale: 1; position: relative; } .banner-image__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); overflow: hidden; } .banner-image .overlay, .banner-image__image-container, .banner-image__text-container { grid-row-start: 1; grid-column-start: 1; min-height: 100%; } @media only screen and (max-width: 767px) and (orientation: landscape) { .banner-image .overlay, .banner-image__image-container, .banner-image__text-container { min-height: auto; } } .banner-image__text-container { display: flex; position: relative; z-index: 100; } .banner-image__link~.banner-image__text-container { pointer-events: none; } .banner-image__link~.banner-image__text-container a { pointer-events: auto; } .banner-image__link { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 100; } .banner-image__text-wrapper { padding: var(--gutter) var(--gutter-mobile); } @media only screen and (min-width: 1024px) { .banner-image__text-wrapper { padding: var(--gutter); } .banner-image__text-wrapper--narrow { width: calc(33.33% + var(--gutter) * 2); } .banner-image__text-wrapper--normal { width: calc(50% + var(--gutter) * 2); } .banner-image__text-wrapper--wide { width: calc(70% + var(--gutter) * 2); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .banner-image__text-wrapper--narrow { width: calc(50% + var(--gutter) * 2); } .banner-image__text-wrapper--normal { width: calc(75% + var(--gutter) * 2); } .banner-image__text-wrapper--wide { width: 100%; } } .banner-image__image { will-change: transform; transform: scale(var(--scale)); } @media only screen and (min-width: 768px) { .banner-image__image-container--mobile { display: none; } } @media only screen and (max-width: 767px) { .banner-image__image-container--mobile~.banner-image__image-container--desktop { display: none; } } .banner-image__image-svg { position: relative; left: 50%; width: 0; min-height: 100%; padding-right: 264%; transform: translateX(-50%); } .banner-image__image-svg .placeholder-svg-filled { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .banner-image__heading { line-height: 1; } .banner-image__buttons, .banner-image__button-video { margin-top: 0; } @media only screen and (min-width: 768px) { .banner-image__buttons .main-buttons__item { margin-top: 0; } } @media only screen and (max-width: 767px) { .banner-image__buttons .main-buttons__item:first-child { margin-top: 0; } } .banner-image__button-video .main-buttons__item, .banner-image__text-wrapper>div:last-child { margin-bottom: 0; } .banner-image__text-wrapper>*:not(.banner-image__subheading) { margin-bottom: var(--text-gap); } .banner-image__text-wrapper>*:not(.banner-image__subheading):last-child { margin-bottom: 0; } /*================ Blog ================*/ .blog { --image-height: 70%; background-color: var(--bg); } .blog h2 { line-height: 1.2; margin-bottom: 5px; } .blog .pagination { margin-bottom: 0; } @media only screen and (max-width: 1023px) { .blog hr { display: none; } } .blog .rte, .featured-blog .rte { margin-bottom: 10px; } .icon-rss { font-size: calc(1.375rem * var(--adjust-heading)); margin: -4px 0 -4px 9px; width: 28px; height: 28px; } .blog__tags { margin-bottom: 30px; } .blog__tags-title { padding-bottom: 16px; } .blog__tags-list { margin: 0; display: flex; flex-wrap: wrap; list-style: none; } .blog__tags--center { text-align: center; } .blog__tags--center .blog__tags-list { justify-content: center; } .blog__tag { margin: 0 4px 8px; padding: 0; } .blog__tag .btn, .blog__tag .shopify-payment-button__button--unbranded { --btn-border: var(--border); --btn-bg: var(--bg); --btn-text: var(--text); --btn-bg-hover: var(--text); transition: color 0.3s ease, background 0.3s ease, border 0.3s ease; } .blog__tag .btn:before, .blog__tag .shopify-payment-button__button--unbranded:before { display: none; } .blog__tag .btn:hover, .blog__tag .shopify-payment-button__button--unbranded:hover { --btn-border: var(--text); --btn-bg: var(--text); --btn-text: var(--bg); transition: color 0.3s ease, background 0.3s ease, border 0.3s ease; } .blog__tag .blog__tag-current a, .blog__tag .blog__tag-reset-button { --btn-bg: var(--text); --btn-text: var(--bg); } .blog__tag-current, .blog__tag-item { display: block; } .blog__tag-item a, .blog__tag-current a, .blog__tag-reset-button { min-width: 0; padding: 8px 16px; font-size: calc(0.75rem * var(--adjust-body)); border-radius: var(--RADIUS-SMALL); word-break: break-word; cursor: pointer; } .blog__tag-current a, .blog__tag-reset-button { border-width: 0; padding: 9px 42px 9px 16px; } .blog__x { position: absolute; top: 0; right: 0; padding: 9px 16px; font-weight: var(--FONT-WEIGHT-BODY-BOLD); } .blog__post { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--grid-gutter); } @media only screen and (min-width: 768px) { .blog__post--two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media only screen and (min-width: 768px) { .blog__post--three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media only screen and (min-width: 768px) { .blog__post--four-col { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media only screen and (min-width: 1024px) { .blog__post--four-col { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .blog__post-item { word-break: break-word; } .blog--standard .blog__post-image-link { margin-bottom: 16px; } .blog__post-image-link { position: relative; display: block; } .blog__post-image { padding-top: var(--image-height); } .blog__post-excerpt-link { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .blog__post-comments { margin-bottom: 0; } .blog__comments-link { color: var(--text); } .blog__post-image--accent { background-color: var(--accent); } .blog__post-image--default { background-color: var(--text-alpha-25); } .blog__post-tags a:after { content: ","; } .blog__post-tags a:last-child:after { content: none; } .blog__post-overlay { display: none; } .blog__post-tags { margin-bottom: 16px; line-height: 1.25; } @media (hover: hover) { .blog__post-tags-link:hover, .blog__comments-link:hover { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } } .blog__post-title, .blog__post-meta { margin: 0 0 8px; } @media only screen and (max-width: 479px) { .blog--photo .blog__post-meta>* { display: block; } } .blog__post-meta>*:not(:last-child):after { content: "•"; padding: 0 7px; } @media only screen and (max-width: 479px) { .blog--photo .blog__post-meta>*:not(:last-child):after { display: none; } } .blog__post-meta { line-height: 1.25; } .blog--photo .blog__post-title { margin-bottom: 12px; } .blog--photo .blog__post-item { position: relative; overflow: hidden; } .blog--photo .blog__post-excerpt-link { display: none; } .blog--photo .blog__post-content { position: absolute; padding: calc(var(--gutter) / 3); bottom: 0; left: 0; right: 0; pointer-events: none; } .blog--photo .blog__post-content a { pointer-events: auto; } .blog--photo .blog__post-overlay { display: block; position: absolute; width: 100%; height: 100%; top: 0%; left: 0%; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%); } .blog--photo .blog__post-image, .blog--photo .blog__post-meta { margin-bottom: 0; } .blog--photo .blog__post-content, .blog--photo .blog__post-title-link, .blog--photo .blog__post-tags-link, .blog--photo .blog__post-comments a { color: var(--white); } @media only screen and (min-width: 480px) and (max-width: 1280px) { .blog--photo .collection__products .one-third .blog__post-title, .blog--photo .collection__products .one-quarter .blog__post-title { margin-bottom: 10px; font-size: calc(1.16rem * var(--adjust-heading)); } .blog--photo .collection__products .one-third .blog__post-tags, .blog--photo .collection__products .one-quarter .blog__post-tags { margin-bottom: 10px; font-size: calc(0.75rem * var(--adjust-body)); } .blog--photo .collection__products .one-third .blog__post-meta, .blog--photo .collection__products .one-quarter .blog__post-meta { font-size: calc(0.75rem * var(--adjust-body)); } .blog--photo .collection__products .one-third .blog__post-meta>*, .blog--photo .collection__products .one-quarter .blog__post-meta>* { display: block; } .blog--photo .collection__products .one-third .blog__post-meta>*:not(:last-child):after, .blog--photo .collection__products .one-quarter .blog__post-meta>*:not(:last-child):after { display: none; } .blog--photo .collection__products .one-third .blog__post-content, .blog--photo .collection__products .one-quarter .blog__post-content { padding: calc(var(--gutter) / 4); } } @media only screen and (max-width: 479px) { .blog--photo .collection__products .mobile--one-half .blog__post-title { margin-bottom: 10px; font-size: calc(1.16rem * var(--adjust-heading)); } .blog--photo .collection__products .mobile--one-half .blog__post-tags { margin-bottom: 10px; font-size: calc(0.75rem * var(--adjust-body)); } .blog--photo .collection__products .mobile--one-half .blog__post-meta { font-size: calc(0.75rem * var(--adjust-body)); } .blog--photo .collection__products .mobile--one-half .blog__post-meta>* { display: block; } .blog--photo .collection__products .mobile--one-half .blog__post-meta>*:not(:last-child):after { display: none; } .blog--photo .collection__products .mobile--one-half .blog__post-content { padding: calc(var(--gutter) / 4); } } /* Featured blog */ .featured-blog { --image-height: 70%; background: var(--bg); } .featured-blog.section-padding { padding-bottom: max(var(--grid-gutter), var(--padding-bottom)); } @media only screen and (max-width: 767px) { .featured-blog__container { margin: 0 calc(var(--gutter-mobile) * -1); } } .featured-blog__button { margin: var(--gutter) 0 0; text-align: center; } /*================ Breadcrumbs ================*/ .breadcrumbs { display: flex; flex-wrap: wrap; font-size: calc(0.875rem * var(--adjust-body)); } .breadcrumbs__link, .breadcrumbs__sep { margin-right: 7px; } /*================ Cart Template ================*/ .template-cart h3 { margin-bottom: 0; } .template-cart .qty__input { border: none !important; text-align: center; padding: 0 25px; } .cart { position: relative; margin: 0 auto; overflow: visible; display: block; text-align: left; background: var(--bg); } @media only screen and (max-width: 767px) { .cart { margin: 40px 0; } } .cart .cart__message { padding: 0 0 var(--inner); margin: 0; } .cart .cart__message--custom { padding: 16px var(--inner); margin-bottom: var(--inner); } .cart .cart__total__money { font-size: calc(1.5rem * var(--adjust-body)); } .cart__message p { font-size: inherit; } .cart__empty { text-align: center; } .cart__empty p { margin: 15px; } .cart__empty:not(.hidden)+.cart__inner { display: none; } .cart__inner { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-start; } @media only screen and (max-width: 767px) { .cart__inner { display: block; } } .cart__content { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; width: calc(100% - 390px); overflow: hidden; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .cart__content { width: calc(100% - 300px); } } @media only screen and (max-width: 767px) { .cart__content { width: 100%; margin-bottom: 25px; } } .cart__content>.btn, .cart__content>.shopify-payment-button__button--unbranded { margin-bottom: var(--inner); } .cart__title { margin-bottom: var(--inner); } .cart__items__wrapper { width: 100%; position: relative; } .cart__items__wrapper .loader--line { top: 0; } .cart__items { width: 100%; border-top: var(--BORDER-WIDTH) solid var(--border); } .cart__items .cart__item { padding: 15px 0; border-top: var(--BORDER-WIDTH) solid var(--border); align-items: stretch; flex-flow: row wrap; } .cart__items .cart__item:last-child { border-bottom: var(--BORDER-WIDTH) solid var(--border); } @media only screen and (max-width: 767px) { .cart__items .cart__item { padding-bottom: 40px; align-items: flex-start; } } .cart__items .cart__item__content { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; padding-right: 0; width: calc(100% - 120px); } @media only screen and (max-width: 767px) { .cart__items .cart__item__content { display: block; } } .cart__items .cart__item__content-inner { width: calc(100% - 95px); display: flex; flex-flow: row wrap; align-items: center; } @media only screen and (max-width: 767px) { .cart__items .cart__item__content-inner { width: 100%; } } .cart__items .cart__item__info { max-width: none; width: 40%; } @media only screen and (max-width: 767px) { .cart__items .cart__item__info { width: 100%; } } .cart__items .cart__item__title { max-width: none; font-size: calc(1rem * var(--adjust-body)); } .cart__items .cart__item__selected-options, .cart__items .cart__item__property { font-size: calc(0.815rem * var(--adjust-body)); } .cart__items .cart__item__price { width: 60%; padding: 0 10px; margin: 0; text-align: center; font-size: calc(0.9375rem * var(--adjust-body)); } .cart__items .cart__item__price ins { text-decoration: none; } .cart__items .cart__item__price ins, .cart__items .cart__item__price del, .cart__items .cart__item__price small { display: inline-block; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .cart__items .cart__item__price ins, .cart__items .cart__item__price del, .cart__items .cart__item__price small { display: block; margin: 0; } } @media only screen and (max-width: 767px) { .cart__items .cart__item__price { width: 100%; padding: 0; margin: 10px 0; text-align: left; } } .cart__items .cart__item__bottom { margin-top: 35px; } .cart__items .cart__item__bottom, .cart__items .cart__item__quantity { width: 95px; } .cart__items .cart__item__remove { padding: calc(var(--inner) / 2) 0; margin: 0 auto; } .cart__items .cart__discount { margin: 10px 0 0 110px; width: auto; } .cart__aside { position: sticky; top: var(--inner); width: 350px; transition: top 0.3s; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .cart__aside { width: 280px; } } @media only screen and (max-width: 767px) { .cart__aside { width: 100%; padding-top: 0; } } .has-scrolled .cart__aside { top: calc(var(--inner) + var(--header-sticky-height)); } .hide-header .cart__aside { top: var(--inner); } .cart__widget { overflow: hidden; font-size: calc(0.815rem * var(--adjust-body)); line-height: 1.16; font-weight: var(--FONT-WEIGHT-BODY-BOLD); padding: calc(var(--inner) / 2) 0; } .cart__widget .cart__field { display: block; width: 100%; font-size: calc(0.815rem * var(--adjust-body)); line-height: 1.4; } .cart__widget .cart__field--textarea { height: 90px; resize: none; border-radius: var(--RADIUS-TEXTAREA); } .cart__widget label { display: block; margin-bottom: 5px; } .cart__widget__wrapper div:last-of-type { margin-bottom: calc(var(--inner) / 2); } .cart__widget__title { display: block; position: relative; width: calc(100% + var(--inner)); padding: 12px calc(var(--inner) / 2); margin: -12px calc(var(--inner) / -2); font-size: calc(0.815rem * var(--adjust-body)); line-height: 1.16; color: var(--text); text-align: left; } .cart__widget__title .icon { top: 0; right: calc(var(--inner) / 2); height: 100%; width: 12px; } .cart__widget__content-inner { overflow-x: auto; position: relative; display: flex; flex-flow: row nowrap; margin-bottom: -38px; } .cart__widget__content-inner>* { flex: 0 0 auto; width: 100%; margin-bottom: 22px; } .cart__widget__content-inner .product-upsell__btn { position: relative; display: flex; right: auto; bottom: auto; } .cart__widget__content { overflow: hidden; position: relative; margin-top: var(--inner); } .cart__widget__content textarea { padding: 5px; } .cart__text { display: block; text-align: center; margin: calc(var(--inner) / 2) 0 0; font-size: calc(0.815rem * var(--adjust-body)); line-height: 1.36; } @media only screen and (max-width: 767px) { .cart__text { margin-top: 7px; } } .cart__total { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; padding-top: calc(var(--inner) / 2); margin-bottom: calc(var(--inner) / 2); font-size: calc(0.75rem * var(--adjust-body)); line-height: 1.33; font-weight: var(--FONT-WEIGHT-BODY-BOLD); } .cart__total span:first-child { text-transform: uppercase; letter-spacing: 0.14em; } .cart__total.hidden { display: none; } .cart__update { display: none; width: 100%; margin-bottom: 10px; } /*====== Cart Quantity ======*/ .cart__item__quantity { position: relative; width: 80px; transition: opacity 0.4s; } .cart__item__quantity.read-only { opacity: 0.5; pointer-events: none; } .cart__item__quantity button { position: absolute; top: 50%; display: flex; align-items: center; justify-content: center; width: 20px; height: 100%; font-size: 0; line-height: 1; border-radius: 0; transform: translateY(-50%); transition: color 0.3s; color: var(--text-alpha-50); } .cart__item__quantity button.is-disabled { pointer-events: none; opacity: 0.5; } .cart__item__quantity button:hover { color: var(--text); } .cart__item__quantity .icon { width: 8px; height: 8px; } .cart__item__quantity input[type=number] { -moz-appearance: textfield; } .cart__item__quantity input[type=number]::-webkit-outer-spin-button, .cart__item__quantity input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; } .cart__item__quantity-minus { left: 0; box-shadow: var(--BORDER-WIDTH) 0 var(--COLOR-BORDER-ALPHA-50); } .cart__item__quantity-plus { right: 0; box-shadow: calc(var(--BORDER-WIDTH) * -1) 0 var(--COLOR-BORDER-ALPHA-50); } .cart__item__quantity-field { display: flex; width: 100%; padding: 6px 20px; border: var(--BORDER-WIDTH) solid var(--COLOR-BORDER-ALPHA-50); border-radius: 1px; margin: 0; font-size: calc(0.75rem * var(--adjust-body)); line-height: normal; color: inherit; text-align: center; } /*====== Cart Quantity ======*/ .cart__discount { width: 100%; padding: 5px 15px; border-radius: 3px; margin: var(--inner) 0 0; background-color: var(--PRIMARY-BUTTONS-COLOR-ALPHA-50); font-size: calc(0.75rem * var(--adjust-body)); color: var(--PRIMARY-BUTTONS-COLOR-TEXT); } .cart__discount .icon-tags { display: inline-block; vertical-align: middle; width: 12px; height: 12px; margin-right: 4px; stroke: currentcolor; stroke-width: 1px; } /*====== Cart Errors ======*/ .cart__errors { position: relative; width: 100%; visibility: hidden; max-height: 0; opacity: 0; overflow: hidden; transition: opacity 0.5s ease, max-height 0.5s cubic-bezier(0, 1, 0.5, 1), visibility 0.5s; } .cart__errors.is-expanded { opacity: 1; visibility: visible; max-height: 300px; transition-timing-function: cubic-bezier(0, 0, 1, 0); } .cart__errors__inner { position: relative; padding: calc(var(--inner) * 0.75) calc(var(--inner) * 2) calc(var(--inner) * 0.75) var(--inner); border: var(--BORDER-WIDTH) solid var(--error); border-radius: var(--RADIUS-CHECKBOX); margin: 0 auto calc(var(--inner) * 0.75); background-color: var(--error-bg); } @media only screen and (max-width: 767px) { .cart__errors__inner { padding: calc(var(--inner) / 2) calc(var(--inner) * 2) calc(var(--inner) / 2) var(--gutter-mobile); } } .cart__errors__close, .errors__button-close { position: absolute; top: 50%; right: 10px; width: 32px; height: 32px; padding: 8px; transform: translateY(-50%); } .cart__errors__close .icon, .errors__button-close .icon { display: block; width: 100%; height: 100%; transition: transform 0.3s ease; } .cart__errors__close:hover .icon, .errors__button-close:hover .icon { transform: rotate(90deg); } .cart__errors__heading { margin: 0; font-size: calc(0.75rem * var(--adjust-body)); color: var(--error); } .cart__errors__content { width: 100%; margin: 0; font-size: calc(0.75rem * var(--adjust-body)); color: var(--error); } .cart-drawer__errors { position: sticky; top: 0; z-index: 9; } .cart-drawer__errors .cart__errors__inner { padding: 10px 40px 10px 20px; margin: 0; border-left: none; border-right: none; } /*====== Cart Loader ======*/ .is-loading .cart__item__quantity, .is-disabled .cart__item__quantity { pointer-events: none; opacity: 0.6; } /*====== Cart Message ======*/ .cart__message { display: flex; flex-flow: row nowrap; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0; padding: var(--inner); font-size: calc(0.815rem * var(--adjust-body)); transition: max-height 0.3s, padding 0.3s, border 0.3s, opacity 0.3s, visibility 0.3s; } .cart__message__success, .cart__message__default { padding-bottom: 6px; } .cart__message__success { display: none; } .is-success .cart__message__success { display: inline; } .is-success .cart__message__success~.cart__message__default { display: none; } .cart__message.is-hidden, .cart__message__default.is-hidden { overflow: hidden; visibility: hidden; max-height: 0; padding: 0 15px; border: none; opacity: 0; } /*====== Cart terms ======*/ .cart__buttons-wrapper { display: flex; flex-flow: row wrap; width: 100%; } .cart__acceptance__input { display: block; width: 13px; height: 13px; margin: calc(4px * var(--adjust-body)) 7px 5px 0; float: none; } .cart__acceptance__label { display: block; cursor: pointer; width: calc(100% - 25px); font-size: calc(0.815rem * var(--adjust-body)); } .cart__acceptance__label p { margin: 0; font-size: inherit; } .cart__buttons__fieldset { padding: 0; margin: 0; border: none; } .cart__buttons { width: 100%; } .cart__buttons--disabled { position: relative; } .cart__buttons--disabled:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; cursor: default; background: var(--bg-alpha-35); z-index: 1; cursor: default; transition: opacity 0.3s ease, visibility 0s linear 0s; } .cart__acceptance__input~.cart__buttons { margin-top: var(--inner); } .cart__acceptance__input:checked~.cart__buttons--disabled:after { opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s linear 0.3s; } .cart__terms { width: 100%; margin: 0; font-size: calc(0.75rem * var(--adjust-body)); color: var(--error); visibility: hidden; max-height: 0; opacity: 0; overflow: hidden; transition: opacity 0.5s ease, margin 0.5s ease, max-height 0.5s cubic-bezier(0, 1, 0.5, 1), visibility 0.5s; } .cart__terms.is-expanded { opacity: 1; visibility: visible; max-height: 300px; margin-top: var(--inner); transition: opacity 0.5s ease, margin 0.5s ease, max-height 0.5s cubic-bezier(0, 0, 1, 0), visibility 0.5s; } .cart__message__progress__holder { display: block; width: 100%; } .cart__message__progress { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; width: 100%; height: 7px; border-radius: 6px; background-color: var(--text-alpha-10); color: var(--PRIMARY-BUTTONS-COLOR-BG); } .cart__message__progress:nth-child(2) { display: none; } /* WEBKIT BROWSERS - CHROME, OPERA AND SAFARI */ .cart__message__progress::-webkit-progress-bar { background-color: transparent; border-radius: 6px; } .cart__message__progress::-webkit-progress-value { /* background-color: var(--PRIMARY-BUTTONS-COLOR-BG); */ border-radius: 6px; } .aos-initialized .cart__message__progress::-webkit-progress-value { width: 0 !important; -webkit-transition: width 1s ease 0s; transition: width 1s ease 0s; } .aos-initialized .cart .cart__message__progress::-webkit-progress-value, .aos-initialized .cart-drawer__message.aos-animate .cart__message__progress::-webkit-progress-value { width: min(var(--progress-width, 100%), 100%) !important; transition-delay: 0.5s; } /* MOZILLA FIREFOX */ .cart__message__progress::-moz-progress-bar { /* background-color: var(--PRIMARY-BUTTONS-COLOR-BG); */ border-radius: 6px; } @-moz-document url-prefix() { .aos-initialized .cart__message__progress:first-child:not(:last-child) { display: none; } .aos-initialized .cart__message__progress:nth-child(2) { display: block; } .aos-initialized .cart__message__progress:indeterminate::-moz-progress-bar { width: 0 !important; -moz-transition: width 1s ease-in-out 0s; transition: width 1s ease-in-out 0s; } .aos-initialized .cart .cart__message__progress:indeterminate::-moz-progress-bar, .aos-initialized .cart-drawer__message.aos-animate .cart__message__progress:indeterminate::-moz-progress-bar { width: min(var(--progress-width, 100%), 100%) !important; transition-delay: 0.5s; } } /*====== Cart Message Custom ======*/ .cart__message--custom { text-align: center; /* background: var(--accent); */ } .cart__message--custom p { margin: 0 auto; } /*====== Pair Product ======*/ .cart__pair { border-top: var(--BORDER-WIDTH) solid var(--text); margin-bottom: 30px; transition: opacity 0.3s; } .cart__pair.fade-out { opacity: 0; } .cart__pair .flickity-page-dots { position: static; margin: 9px 0 -25px; } .cart__pair:empty { display: none; } #dynamic-checkout-cart:empty { min-height: 0 !important; } /*================ Circle Text ================*/ .circle-text__content { width: var(--circle-size); } @media only screen and (max-width: 767px) { .circle-text__content { max-width: 125px; max-height: 125px; } } .circle-text__content img { display: block; max-width: var(--circle-size); height: auto; margin: 0 auto; } @media only screen and (max-width: 767px) { .circle-text__content img { width: auto; max-width: 125px; max-height: 125px; } } .circle-text__content svg { font-family: var(--FONT-STACK-HEADING); font-weight: var(--FONT-WEIGHT-HEADING); font-style: var(--FONT-STYLE-HEADING); display: block; width: var(--circle-size); height: var(--circle-size); color: var(--circle-color); word-spacing: var(--circle-word-spacing); } @media only screen and (max-width: 767px) { .circle-text__content svg { max-width: 125px; max-height: 125px; } } .circle-text.is-rotating { animation: rotate 20s infinite linear; animation-direction: reverse; } .circle-text.is-static-text { transform: rotate(75deg); } /*=============== Section Columns ===============*/ .section-columns { display: flex; justify-content: center; overflow: hidden; color: var(--text); background-color: var(--bg); } .section-columns__wrapper, .section-columns__slider .flickity-viewport { overflow: initial; } .section-columns__slider .flickity-button { background: var(--bg); } .column__item:first-child:last-child { display: block; } @media only screen and (min-width: 768px) { .column__item:first-child:last-child { width: calc(var(--wrapper-width) / 2); margin: 0 auto; } } @media only screen and (max-width: 767px) { .column__item:first-child:last-child { width: var(--wrapper-width); margin: 0; } } .text-left .column__item__content { text-align: left; } .column__item__image-wrapper { margin-bottom: calc(var(--gutter) / 2); position: relative; overflow: hidden; min-width: 102px; } .column__item__image { display: block; height: 0; position: relative; overflow: hidden; } .column__item__image__bg { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; object-fit: cover; } .column__item__image__bg:not(.placeholder-svg-filled) { background-color: var(--bg); } .column__item__video-link .play-button { position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 1; display: flex; align-items: center; justify-content: center; } .column__item__content p { margin: 0; } .column__item__content h3 { margin-bottom: 0.25em; } /*================ Collection ================*/ :root { --product-media-padding-top: var(--PRODUCT-MEDIA-PADDING-TOP); } .collection-section { --swatch-size: 30px; position: relative; } @media only screen and (min-width: 768px) { .collection-section { --swatch-size: 24px; } } .collection-section .swatch__button .icon-check { width: 14px; margin-right: 0; } .collection-section .pagination { margin-bottom: 0; } .collection__wrapper { position: relative; transition: height 0.3s ease; min-height: var(--content-min); } .collection__header { position: relative; overflow: initial; z-index: 10; } .collection__title { font-size: calc(3rem * var(--adjust-heading)); line-height: 1.2; margin-bottom: 10px; } @media only screen and (max-width: 1439px) { .collection__title { font-size: calc(2.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .collection__title { font-size: calc(2.25rem * var(--adjust-heading)); } } .collection__description { margin: 20px auto 0; display: block; color: inherit; /* font-size: calc(1.1rem * var(--adjust-body)); */ font-size: calc(1.1rem * var(--adjust-heading)); } /* @media only screen and (max-width: 767px) { .collection__description { font-size: calc(1rem * var(--adjust-body)); } } */ .collection__description p { font-size: inherit; margin-top: 0; } .collection__inner { width: var(--wrapper-width); } .collection__inner .breadcrumbs { margin: 20px 0; flex-basis: 100%; width: 100%; font-size: calc(0.75rem * var(--adjust-body)); display:none; } @media only screen and (min-width: 768px) { .collection__inner .breadcrumbs { flex-basis: 240px; } } @media only screen and (min-width: 1024px) { .collection__inner .breadcrumbs { margin-right: calc(var(--gutter) / 2); } } @media only screen and (min-width: 1440px) { .collection__inner .breadcrumbs { flex-basis: 300px; } } .collection__inner:after { content: ""; position: fixed; top: 0; left: 0; right: 0; height: 100%; z-index: 5; opacity: 0; visibility: hidden; background: var(--bg-alpha-60) var(--loader-image) no-repeat center center; background-size: var(--loader-image-size); transition: opacity 0.3s ease, visibility 0s linear 0.3s; } .collection--filters-disabled .collection__inner .breadcrumbs { grid-column: 1/3; } @media only screen and (min-width: 768px) { .collection--filters-disabled .collection__inner .breadcrumbs { margin-bottom: 0; } } .collection__products-count { justify-self: flex-end; flex-grow: 1; text-align: left; font-size: calc(0.75rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .collection__products-count { display: none; } } .collection.is-loading .collection__inner:after { opacity: 1; visibility: visible; transition-delay: 0s; } .collection__products { overflow: hidden; } .collection__products .no-matches { font-size: calc(1rem * var(--adjust-body)); } .collection__products .product-grid-item { width: 100%; } @media only screen and (min-width: 1440px) { .collection__products .collection--no-results { padding-right: 320px; } } .collection--no-results { width: 100%; text-align: center; } .product-grid-item { position: relative; text-align: center; white-space: normal; } .product-grid-item shopify-payment-terms, .product-grid-item .shopify-installments { display: none; } .product-grid-item .errors { position: absolute; left: 0; bottom: 0; width: 100%; padding: 10px 40px; border-radius: 0; text-align: center; cursor: default; opacity: 0; margin: 0; z-index: 1; } .product-grid-item .placeholder-svg, .product-grid-item .placeholder-svg-filled { position: absolute; top: 0; left: 0; } .product-grid-item h3, .product-grid-item .h3 { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); } /*=== Animations ===*/ @media only screen and (max-width: 1023px) { .aos-initialized .collection .product-grid-item .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .product-grid-item__info[data-aos][data-aos-delay].aos-animate { transition-delay: 0s; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .product-grid-item .product__badge[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .product-grid-item.grid-item--even .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .product-grid-item.grid-item--even .product-grid-item__info[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .product-grid-item.grid-item--even .product__badge[data-aos][data-aos-delay].aos-animate { transition-delay: 0.3s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-items--3 .product-grid-item .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--3 .product-grid-item .product-grid-item__info[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item .product-grid-item__info[data-aos][data-aos-delay].aos-animate { transition-delay: 0s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-items--3 .product-grid-item .product__badge[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item .product__badge[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-items--3 .product-grid-item.grid-item--second-tablet .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--3 .product-grid-item.grid-item--second-tablet .product-grid-item__info[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item.grid-item--second-tablet .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item.grid-item--second-tablet .product-grid-item__info[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-items--3 .product-grid-item.grid-item--second-tablet .product__badge[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item.grid-item--second-tablet .product__badge[data-aos][data-aos-delay].aos-animate { transition-delay: 0.3s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-items--3 .product-grid-item.grid-item--third-tablet .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--3 .product-grid-item.grid-item--third-tablet .product-grid-item__info[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item.grid-item--third-tablet .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item.grid-item--third-tablet .product-grid-item__info[data-aos][data-aos-delay].aos-animate { transition-delay: 0.3s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-items--3 .product-grid-item.grid-item--third-tablet .product__badge[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--4 .product-grid-item.grid-item--third-tablet .product__badge[data-aos][data-aos-delay].aos-animate { transition-delay: 0.45s; } } @media only screen and (max-width: 479px) { .aos-initialized .collection .collection-items--mobile--one-whole .product-grid-item.grid-item--even .product__media__holder[data-aos][data-aos-delay].aos-animate, .aos-initialized .collection .collection-items--mobile--one-whole .product-grid-item.grid-item--even .product-grid-item__info[data-aos][data-aos-delay].aos-animate { transition-delay: 0s; } } @media only screen and (max-width: 479px) { .aos-initialized .collection .collection-items--mobile--one-whole .product-grid-item.grid-item--even .product__badge[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } .no-touch .product__media__hover { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; background-color: var(--bg); visibility: hidden; } .no-touch .product__media__hover--fade-in { opacity: 0; transition: opacity 0.25s ease-out, visibility 0s 0.25s; } .no-touch .product__media__hover--slide-in { transition: visibility 0s 0.25s; } .no-touch .product__media__image--hover-slide-in { will-change: transform; transition: -webkit-clip-path 0.25s ease-out; transition: clip-path 0.25s ease-out; transition: clip-path 0.25s ease-out, -webkit-clip-path 0.25s ease-out; -webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); } .no-touch .product__media__image--hover-fade-in { transition: opacity 0.25s ease-in, visibility 0s linear 0s; } .no-touch .product-grid-item__image--hovered .product__media__hover--slide-in, .no-touch .product-grid-item__image:hover .product__media__hover--slide-in { visibility: visible; transition-delay: 0s; } .no-touch .product-grid-item__image--hovered .product__media__image--hover-slide-in, .no-touch .product-grid-item__image:hover .product__media__image--hover-slide-in { -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transition-duration: 0.25s; transition-timing-function: ease-out; } .no-touch .product-grid-item__image--hovered .product__media__image--hover-fade-in, .no-touch .product-grid-item__image:hover .product__media__image--hover-fade-in { opacity: 0; } .no-touch .product-grid-item__image--hovered .product__media__hover--fade-in, .no-touch .product-grid-item__image:hover .product__media__hover--fade-in { opacity: 1; visibility: visible; transition-delay: 0s; transition-duration: 0.25s; transition-timing-function: ease-out; } .product-grid-item__info { display: grid; grid-template-columns: minmax(0, 100%); gap: 9px; align-content: start; font-size: calc(0.8rem * var(--adjust-body)); } .collection__products .product-grid-item__info {gap:inherit;} .collection__products .product-grid-item__title { font-family: Karla; font-weight: 500; font-size: 12px!important; margin-bottom: 0!important; letter-spacing: 0; line-height: 14px; color: #000; } @media only screen and (max-width: 479px) { .product-grid-item__info { font-size: calc(0.95rem * var(--adjust-body)); } } .product-grid-item__info--inline .product-grid-item__title, .product-grid-item__info--inline .product-grid-item__price { display: inline; vertical-align: middle; } .product-grid-item__title, .product-grid-item__price { font-size: calc(0.9rem * var(--adjust-body)); line-height: 1; } .collection__products .product-grid-item__price.price { margin: 5px 0; margin-top: 10px !important; line-height: inherit; margin-bottom: 10px !important; color: #000000; font-weight: 600; } .collection__products .product-grid-item__price .product-grid-item__price__new { color: #ee0101; } .collection__products .product-grid-item__price.price s { text-decoration: line-through; color: #ccc; } .collection__products .grid, .grid--center { gap: 12px; row-gap: 26px; } @media only screen and (max-width: 479px) { .product-grid-item__title, .product-grid-item__price { font-size: calc(1.1rem * var(--adjust-body)); } } .product-grid-item__info-separator { display: inline-block; vertical-align: middle; width: 20px; height: var(--BORDER-WIDTH); margin: 0 8px; background: var(--text); border-radius: 4px; } .product-grid-item__info--inline, .product-grid-item__info--left { text-align: left; } .product-grid-item__info--inline .product-grid-item__swatch, .product-grid-item__info--left .product-grid-item__swatch { justify-content: flex-start; } .product-grid-item__title { display: block; text-decoration: none; font-weight: var(--FONT-WEIGHT-BODY-BOLD); } .product-grid-item__price { display: block; font-size: inherit; text-decoration: none; margin: 0; } .product-grid-item__price .product__unit-price { line-height: inherit; } @media only screen and (max-width: 479px) { .product-grid-item__price .product__unit-price { font-size: calc(0.9rem * var(--adjust-body)); } } .product-grid-item__price__new { margin-right: 5px; } .product-grid-item__price__new:last-child { margin-right: 0; } .product-cutline { margin: -2px 0 3px 0; font-size: calc(0.8rem * var(--adjust-body)); line-height: 1; } @media only screen and (max-width: 479px) { .product-grid-item__info .product-cutline { font-size: calc(0.95rem * var(--adjust-body)); } } .product-grid-item__rating .rating__star .icon { width: 13px; height: 13px; } .product-grid-item__rating { margin-top: -3px; } .collection__products .product-grid-item__rating{ display:none; } .product-grid-item__swatch { position: relative; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; margin: 0 0 -6px; min-height: 12px; } @-moz-document url-prefix() { .product-grid-item__swatch { padding-bottom: 1px; } } @media (pointer: fine) { .product-grid-item__swatch:before { content: ""; position: absolute; top: -6px; left: 0; right: 0; bottom: 0; } .product-grid-item__swatch:hover .swatch__button.is-hidden { display: inline-block; animation: fadeIn 1s ease; } .product-grid-item__swatch:hover .swatch__text-more { display: none; } } .product-grid-item__swatch.is-visible .swatch__button.is-hidden, body:not(.no-outline) .product-grid-item__swatch:focus-within .swatch__button.is-hidden { display: inline-block; animation: fadeIn 1s ease; } .product-grid-item__swatch.is-visible .swatch__text-more, body:not(.no-outline) .product-grid-item__swatch:focus-within .swatch__text-more { display: none; } .product-grid-item__swatch .swatch__button { margin: 0 6px 6px 0; padding: 0; } .product-grid-item__swatch .swatch__button:last-child { margin-right: 0; } .product-grid-item__swatch .swatch__button.is-hidden { display: none; } .product-grid-item__swatch .swatch__label { width: 12px; height: 12px; } @media only screen and (max-width: 479px) { .product-grid-item__swatch .swatch__label { width: 15px; height: 15px; } } .product-grid__swatch--rectangle .swatch__label { border-radius: 0; width: 20px; height: 10px; } @media only screen and (max-width: 479px) { .product-grid__swatch--rectangle .swatch__label { width: 24px; height: 12px; } } .swatch__link--no-image { cursor: default; } .swatch__text-more { margin: 0 0 6px; font-size: calc(0.75rem * var(--adjust-body)); line-height: 12px; animation: fadeIn 1s ease; } .product-grid__swatch--rectangle .swatch__text-more { line-height: 10px; } @media only screen and (max-width: 479px) { .swatch__text-more { font-size: calc(0.9rem * var(--adjust-body)); } } .soldout .quick__form { display: none; } .product-media-outer, .product-grid-item__image { position: relative; overflow: hidden; padding-top: var(--product-media-padding-top); --product-media-padding-top: 140%; width: 100%; height: 0; display: flex; align-items: center; justify-content: center; } .product__media__holder { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } .product__media__container { --aspect-ratio: 1; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden; margin: auto; width: 100%; height: 100%; } .product__media__container--portrait { width: 0; height: 100%; padding-right: calc(var(--aspect-ratio) * var(--product-media-padding-top)); } .product__media__container--landscape { width: 100%; height: 0; padding-top: calc(100% / var(--aspect-ratio)); } .product__media--featured-secondary { z-index: 2; } .product__media--featured-visible { z-index: 3; } .product__media--featured-secondary[data-bgset].lazyloaded, .product__media--featured-secondary[data-bgset] { opacity: 1; transition: none; } .product__media--featured-secondary[data-bgset].product__media--featured-visible { animation-name: fadeIn; animation-duration: 0.25s; animation-fill-mode: forwards; animation-iteration-count: 1; animation-timing-function: ease-in; } .product__media__image--hover-slide-in .product__media--featured-secondary[data-bgset].product__media--featured-visible { animation-name: clipPathFromLeft; animation-timing-function: ease-out; } [data-animations=false] .product__media--featured-secondary[data-bgset].product__media--featured-visible { animation-duration: 0s; animation-delay: 0s; } .product__media__image { position: absolute; z-index: 2; top: 0; left: 0; right: 0; bottom: 0; } .product__media__holder { filter: brightness(var(--filter-bg)); } .product__media__slider { display: block; height: 100%; } .product__media__slider .flickity-viewport { width: 100%; height: 100% !important; } .supports-touch .product__media__slider { display: none; } .product__media__slide { width: 100%; height: 100%; background-color: var(--bg); } .product__media__hover-img { z-index: 0; } .product__media__hover-img--visible { z-index: 1; } .product-grid-item__image { margin-bottom: 10px; transform: translate(0); } .product-grid-item__image .btn--quick { opacity: 0; transform: translate(calc(15px + var(--btn-size) / 2), calc(15px + var(--btn-size) / 2)) scale(0); transition: transform 0.3s ease, opacity 0.15s ease; transform-origin: right bottom; z-index: 2; } .product-grid-item__image .btn--quick { transform: none !important; transition-duration: 0.3s; opacity: 0.8 !important; overflow: hidden; width: 43px; padding: 8px; height: 43px; background: var(--white); color: var(--black); border-radius: 50%; } .btn__inner { box-shadow: 0 0 0 transparent; width: 100%; display: flex; align-items: center; justify-content: center; min-height: auto; } .btn__inner svg { width: 100%; height: 100%; margin-right: -5px; } .product-grid-item__image .btn--quick .btn__text { display: none; } /* .findify-add-to-wishlist { top: inherit; right: inherit; bottom: 15px; left: 8px; width: 43px; height: 43px; background: #fff; border-radius: 90px; 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; z-index: 2; opacity: .8; font-family: FontAwesome!important; font-size: 20px; position: absolute; cursor: pointer; } */ /* .findify-add-to-wishlist:before { content: "\f08a"; } .findify-add-to-wishlist:before { font-size: 23px; margin-top: 4px; } */ /* .findify-add-to-wishlist svg.icon { width: 30px; height: auto; margin-bottom:-1px; } .findify-add-to-wishlist svg.icon path { stroke-width: 40px; } */ .smart-add-to-wishlist { top: inherit; right: inherit; bottom: 15px; left: 8px; width: 43px; height: 43px; background: #fff; border-radius: 90px; 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; z-index: 2; opacity: 0.8; font-family: FontAwesome !important; font-size: 20px; position: absolute; } .smart-add-to-wishlist .smartwishlist .fa-heart-o:before { font-size: 23px; color: var(--text); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .search-popdown__results .findify-add-to-wishlist { display: none; } .search-page .search-page__head .search-page__title { padding-top: 0; } .search-page .search-page__head .search-page__title { padding-top: 0; } .search-page { padding-top: 61px; } .product__badge__item--saving>span { font-size: 12px; font-weight: 600; } @media only screen and (max-width: 1023px) { .product-grid-item__image .btn--quick { opacity: 1; transform: translate(0); } } .product-grid-item__image--hovered .btn--quick, .product-grid-item__image:hover .btn--quick, .product-grid-item__image:focus-within .btn--quick { opacity: 1; transform: translate(0); transition-duration: 0.3s; } .product-grid-item__image--error .btn--quick, .product-grid-item__image--error:hover .btn--quick, .product-grid-item__image--error:focus-within .btn--quick { opacity: 0; transform: translate(calc(15px + var(--btn-size) / 2), calc(15px + var(--btn-size) / 2)) scale(0); } .product-grid-item__image--error .errors { animation: fadeInOutError 6s ease; } .product-grid-item__quick-buy { position: absolute; right: 0; bottom: 0; width: 100%; z-index: 2; } .product__badge { position: absolute; z-index: 1; top: 0; left: 0; max-width: 100%; margin: 5px; display: grid; grid-template-columns: minmax(0, 100%); gap: 5px; justify-items: start; transition: transform 0.2s ease; pointer-events: none; } .product__badge__item { background-color: var(--sale-bg); color: var(--sale-text); text-align: left; text-transform: var(--BUTTON-TEXT-CAPS); font-size: calc(0.6875rem * var(--adjust-body)); letter-spacing: var(--BUTTON-TEXT-CAPS); line-height: 1.2; transition: opacity 0.15s ease; padding: 6px 9.5px; height: auto; } @media only screen and (max-width: 479px) { .product__badge__item { font-size: calc(0.825rem * var(--adjust-body)); } } .product__badge__item>span { display: block; } .product__badge__item--sold { background-color: var(--sold-bg); color: var(--sold-text); } .product__badge__item--custom { background-color: var(--custom-bg); color: var(--custom-text); } .product__badge__item--saving { background-color: var(--saving-bg); color: var(--saving-text); } .progress-bar { position: absolute; bottom: 0; left: 0; right: 0; margin: 4px 8px; height: 8px; border-radius: 4px; z-index: 1; pointer-events: none; } .progress-bar__inner { position: absolute; top: 0; left: 0; height: 4px; border-radius: 2px; width: 0%; background-color: var(--white); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06); animation: none; animation-fill-mode: forwards; } .progress-bar__inner.fill { animation: progressBar var(--autoplay-speed) linear; } /*================ Collection Filters ================*/ .collection__sticky-bar { position: relative; top: 0; z-index: 5; display: flex; align-items: center; background: var(--bg); justify-content: space-between; width: calc(100% - 282px); margin-left: auto; } @media only screen and (min-width: 768px) { .collection__sticky-bar { z-index: 3; margin-top: 0; min-height: var(--collection-sticky-bar-height); padding-bottom: 25px; } } @media only screen and (max-width: 767px) { .collection__sticky-bar { justify-content: space-between; } } @media only screen and (min-width: 768px) { .collection--filters-disabled .collection__sticky-bar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } } .collection--sorting-disabled .collection__sticky-bar, .collection--filters-sorting-disabled .collection__sticky-bar { justify-content: space-between; } .collection--breadcrumbs-disabled .collection__sticky-bar { justify-content: flex-end; } @media only screen and (min-width: 768px) { .collection--breadcrumbs-disabled.collection--sorting-disabled .collection__sticky-bar { height: var(--gutter); } } .collection__filters { position: fixed; top: 0; left: 0; right: 0; z-index: 2; background: var(--bg); max-height: var(--full-height); overflow: hidden; } @media only screen and (min-width: 768px) { .collection__filters { --full-height: calc(100vh - var(--collection-sticky-bar-height)); position: sticky; top: calc(var(--collection-sticky-bar-height) - 1px); width: 273px; float: left; } } @media only screen and (min-width: 1024px) { .collection__filters { /* margin-right: calc(var(--gutter) / 2);*/ } } @media only screen and (min-width: 1440px) { .collection__filters { width: 282px; } } @media only screen and (max-width: 767px) { .collection__filters { /* height: var(--full-height);*/ z-index: -1; visibility: hidden; transform: translateX(100%); transition: var(--drawer-transition), visibility 0s linear 0.4s, z-index 0s linear 0.4s; } .collection__filters:not(.collection__filters--visible) [data-collapsible-container].is-expanded { visibility: hidden; opacity: 0; display: none; } } @media only screen and (min-width: 768px) { .collection--breadcrumbs-disabled .collection__filters { /* --full-height: 100vh;*/ top: 0; margin-top: calc(-1 * var(--collection-sticky-bar-height)); z-index: 3; } } @media only screen and (max-width: 767px) { .collection__filters--visible { z-index: 9001; visibility: visible; transform: translateX(0); transition: var(--drawer-transition), visibility 0s linear 0s, z-index 0s linear 0s; } .collection__filters:not(.collection__filters--visible) { display: none !important; } } @media only screen and (min-width: 768px) { .collection--filters-disabled .collection__filters { display: none; } } .collection__filters-wrapper { position: relative; background: var(--bg); display: flex; flex-direction: column; max-height: calc(var(--full-height)); } @media only screen and (max-width: 1023px) { .collection__filters-wrapper { padding-right: 0; } } @media only screen and (max-width: 479px) { .collection__filters-wrapper { padding-right: 0; } } .collection__filter { position: relative; display: block; width: 100%; overflow: hidden; backface-visibility: hidden; -webkit-backface-visibility: hidden; } @media only screen and (min-width: 768px) { .collection__filter:last-of-type { padding-bottom: var(--inner); } } .collection__sort .icon, .collection__filter__count .icon { position: absolute; top: 0; right: 17px; width: 15px; height: 35px; margin: 0 3px; } .collection__filters__title { font-size: calc(1rem * var(--adjust-heading)); } .collection__sort__label, .collection__filter__title { font-size: calc(0.875rem * var(--adjust-heading)); } .collection__filter__title, .collection__filters__title, .collection__sort__label { font-family: var(--FONT-STACK-HEADING); font-weight: var(--FONT-WEIGHT-HEADING-BOLD); } .collection__filters__title--body, .collection__sort__label--body, .collection__filter__title--body { font-family: var(--FONT-STACK-BODY); font-size: calc(0.875rem * var(--adjust-body)); } .collection__filters__title--body { font-size: calc(1rem * var(--adjust-body)); } .collection--filters-disabled .collection__sort__label { padding-top: 2px; } .collection__filter__title { width: 100%; text-align: left; display: flex; cursor: pointer; padding: 10px 20px; background: #f2dacf; transition: background-color .1s ease-in; border: none; outline: none; margin: 0; font-family: Karla, sans-serif; margin-top: 7px; } .collection__filter__title>span:first-child { font-family: Arial; font-style: normal; font-weight: 500; font-size: 14px; line-height: 16px; text-transform: capitalize; color: #121212; -webkit-box-flex: 1; flex: 1 1 0%; display: block; padding: 0; margin: 0; padding-right: 10px; } .is-expanded .collection__filter__count .icon-toggle-plus { opacity: 0; transform: rotate(180deg); } .is-expanded .collection__filter__count .icon-toggle-minus { opacity: 1; transform: rotate(180deg); } .is-expanded .collection__filter__count:after { opacity: 0; } .collection__filters-list { display: flex; justify-content: flex-start; flex-direction: column; align-items: flex-start; width: 100%; height: var(--full-height); overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; --double-scrollbar-width: calc(1.8 * var(--scrollbar-width)); mask-image: linear-gradient(to top, transparent, black), linear-gradient(to left, transparent var(--double-scrollbar-width), black var(--double-scrollbar-width)); mask-size: 100% 20000px; mask-position: left bottom; -webkit-mask-image: linear-gradient(to top, transparent, black), linear-gradient(to left, transparent var(--double-scrollbar-width), black var(--double-scrollbar-width)); -webkit-mask-size: 100% 20000px; -webkit-mask-position: left bottom; transition: mask-position 0.3s, -webkit-mask-position 0.3s; } /* color filter css */ ul.collection__filter-tags.collection__filter-tags--swatches li label.swatch__label:after, ul.collection__filter-tags.collection__filter-tags--swatches li label.swatch__label:before { content: none; } .collection__filter-tags-wrapper {} ul.collection__filter-tags.collection__filter-tags--swatches { display: grid; grid-template-columns: 40px 40px 40px; justify-content: space-between; -webkit-box-pack: justify; margin-top: -20px; background: transparent; overflow: hidden; } ul.collection__filter-tags.collection__filter-tags--swatches li { padding-bottom: 0; padding-top: 20px; height: 100%; margin-left: 0; padding-left: 0; } ul.collection__filter-tags.collection__filter-tags--swatches li label.swatch__label { display: inline-block; width: 40px; height: 40px; border-radius: 50%; background-size: cover !important; position: relative; border: 1px solid #000 !important; margin-bottom: 20px; } ul.collection__filter-tags.collection__filter-tags--swatches li label.swatch__label span { width: auto; height: auto; position: absolute; bottom: 0; white-space: pre-wrap; font-family: Karla; font-style: normal; font-weight: 400; font-size: 14px; line-height: 16px; letter-spacing: 0; color: #121212; clip: unset; left: 0; right: 0; text-align: center; bottom: -20px; } @media only screen and (max-width: 1023px) { .collection__filters-list { --double-scrollbar-width: 0; } } .collection__filters-list:hover { -webkit-mask-position: left top; } @media only screen and (max-width: 767px) { .collection__filters-list { width: 100vw; } } @media only screen and (min-width: 768px) { .collection__filters-list { padding: 0; } } .no-js .collection__filters-list form { padding-bottom: var(--inner); } .collection__filters-list__inner { position: relative; width: 100%; padding: 0 var(--gutter-mobile); z-index: 1; flex: 1; height: var(--full-height); min-height: 250px; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; } @media only screen and (min-width: 768px) { .collection__filters-list__inner { width: calc(235px + 2 * var(--gutter-mobile)); margin: 0 calc(-1 * var(--gutter-mobile)); } } @media only screen and (min-width: 1440px) { .collection__filters-list__inner { width: calc(242px + 2 * var(--gutter-mobile)); } } @media only screen and (max-width: 767px) { .collection__filters-list__inner { overflow-x: hidden; overflow-y: auto; padding: 0; } } .collection__filters-bottom { display: none; position: relative; z-index: 5; width: 100%; padding: 0 var(--gutter-mobile) var(--gutter-mobile); margin-top: auto; text-align: center; } .collection__filters-bottom:before { content: ""; position: absolute; right: 0; bottom: 100%; left: 0; height: 25px; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--bg) 100%); pointer-events: none; } @media only screen and (max-width: 767px) { .collection__filters-bottom.is-visible { display: block; } } .collection__filters__close-bottom { width: 100%; text-transform: var(--BUTTON-TEXT-CAPS); } .collection__filter-tags { list-style: none; background: var(--bg); display: grid; grid-template-columns: minmax(0, 100%); gap: 4px; align-content: start; margin: 0; } .collection__filters-list::-webkit-scrollbar { width: 0px; background: transparent; } .collection__filter-tags label, .collection__filter-tags span, .collection__filter-tags input, .collection__filter-tags .collection__filter-tag--swatch span { font-size: calc(0.8rem * var(--adjust-body)); } .is-expanded .collection__filter-tags { visibility: visible; pointer-events: auto; } .collection__filter-actions .collection__filter-tags { padding-top: 0; } .collection__sort-bar .collection__filter-tags { padding: 0; gap: 0; } .collection__filter-tags--swatches { display: grid; gap: normal; grid-template-columns: repeat(5, minmax(0, 1fr)); } .collection__filter-tag--default .filter__button { display: block; font-family: Arial; font-weight: 400; font-size: 14px; line-height: 16px; color: #121212; padding-left: 31px; position: relative; text-align: left; } .collection__filter-tag--default .filter__button:before { content: ""; position: absolute; left: 0; top: 0; width: 17px; height: 17px; margin-top: 1px; color: var(--white); border-radius: var(--RADIUS-CHECKBOX); border: 1px solid #ccc; top: 50%; transform: translateY(-50%); } .collection__filter-tags-wrapper { padding: 0 20px; } .collection__filter-tags-wrapper.is-expanded { margin-top: 12px; } li.collection__filter-tag { width: 100%; border: 0; background: transparent; outline: 0; font-size: 12px; border-radius: 0; text-align: left; height: auto; cursor: pointer; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; -webkit-box-align: center; align-items: center; padding-bottom: 17px; padding-top: 0; margin-bottom: 0; justify-content: space-between; } .findify-components-search--mobile-row { display: flex; align-items: center; justify-content: space-between; } span.search--mobile-actions__query { display: block; text-align: center; } .collection__sort_mobile { display: flex; align-items: center; line-height: 1; } .collection__sort_mobile button { line-height: 1; } .collection-mobile-sticky-bar { display: none; } @media only screen and (max-width: 767px) { .collection__filter-tag--default .filter__button:before { top: 3px; } } .collection__filter-tag--default .filter__input:checked~.filter__button:before, .collection__filter-tag--default.is-active .filter__button:before { background: #000; background-size: 14px auto; border: none; } .collection__filter-tag--default .filter__input:disabled~.filter__button, .collection__filter-tag--default.link--disable .filter__button { cursor: default; color: var(--disabled-grey-darken); } .collection__filter-tag--default .filter__input:disabled~.filter__button:before, .collection__filter-tag--default.link--disable .filter__button:before { background: var(--text-alpha-15); border: 0; } @media only screen and (max-width: 479px) { .collection__filter-tag--default { padding-right: 0; } } .collection__filter-tag.is-hidden { display: none; } .collection__filter-actions { width: 100%; padding-bottom: 0; margin: 0; grid-column: 1/-1; } .no-js .collection__filter-actions { margin-bottom: 0; padding-bottom: 0; } li.collection__filter-actions button { padding-bottom: 20px; padding-top: 0; margin-top: 20px; } .collection__filters-more { margin: 0 auto; font-weight: var(--FONT-WEIGHT-BUTTON); } .collection__filters-more { margin-left: auto; font-weight: var(--FONT-WEIGHT-BUTTON); } .collection__filters-more>* { pointer-events: none; } .collection__filters-more span:nth-child(1) { display: inline-block; } .collection__filters-more span:nth-child(2) { display: none; } .collection__filters-more span { font-size: calc(0.9rem * var(--adjust-button)); text-transform: none !important; font-family: Karla; font-weight: 700; letter-spacing: 0; font-size: 14px; line-height: 16px; color: #121212; text-decoration: none; } .collection__filters-more:before, .collection__filters-more:after { content: none; } .no-js .collection__filters-more { display: none; } .collection__filters-more.is-expanded span:nth-child(1) { display: none; } .collection__filters-more.is-expanded span:nth-child(2) { display: inline-block; } .collection__filter-tag--swatch { display: flex; text-align: left; line-height: 1.2; margin-bottom: 8px; padding: 0 2px; word-break: break-word; } @media only screen and (max-width: 479px) { .collection__filter-tag--swatch { margin-bottom: 16px; } } .collection__filter-tag--swatch .swatch__button { display: flex; justify-content: flex-start; margin-bottom: 4px; padding: 0; } .collection__filter-tag--swatch .filter__input:checked~.swatch__button--circle .swatch__label .icon, .collection__filter-tag--swatch.is-active .swatch__button--circle .swatch__label .icon { opacity: 0.6; visibility: visible; transition-delay: 0s; } .collection__filter-tag--swatch .filter__input:checked~.filter__button .swatch__label:before, .collection__filter-tag--swatch.is-active .swatch__label:before { opacity: 1; visibility: visible; } .collection__filter-tag--swatch .filter__input:disabled~.filter__button, .collection__filter-tag--swatch.link--disable .filter__button { cursor: default; opacity: 0.5; } .collection__filter-tag--swatch .filter__input:disabled~.swatch__label:after, .collection__filter-tag--swatch.link--disable .swatch__label:after { position: absolute; top: 50%; left: 50%; opacity: 1; visibility: visible; border-color: transparent; background: var(--bg-alpha-60); content: ""; } .collection__filter-tag--swatch .filter__input:disabled~.swatch__label[data-swatch=white i]:after, .collection__filter-tag--swatch.link--disable .swatch__label[data-swatch=white i]:after { background-color: var(--COLOR-BLACK); } .collection__filter-tag--swatch .filter__input:disabled~.swatch__label[data-swatch=black i]:after, .collection__filter-tag--swatch.link--disable .swatch__label[data-swatch=black i]:after { background-color: var(--COLOR-WHITE); } .collection__filter-tags--swatches-rectangle .collection__filter-tag--swatch { margin-left: 2px; font-size: 0; } .collection__filters__reset { display: none; text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .collection__filters__reset.is-visible { display: block; margin-left: 8px; } .collection--no-results .collection__filters__reset { display: inline-block; width: auto; } .filter__button { font-size: calc(0.875rem * var(--adjust-body)); line-height: 20px; color: inherit; cursor: pointer; } @media only screen and (max-width: 767px) { .filter__button { line-height: 26px; } } .collection__sort { overflow: hidden; } @media only screen and (min-width: 768px) { .collection__sort { display: none; } } .no-js .collection__sort__options { margin-bottom: var(--inner); } .collection__sort-bar { position: relative; } .collection-items .wrapper { max-width: 1220px; width: 100%; margin: 0 auto; padding: 0 40px; } @media only screen and (max-width: 767px) { .collection__sort-bar { display: none; } .collection-items .wrapper { max-width: 100%; padding: 0 15px; } } .collection__sort-bar .collection__sort__label { white-space: nowrap; padding: 0; font-family: Karla; font-weight: 700; font-size: 14px; line-height: 16px; text-transform: uppercase; color: #121212; display: flex; align-items: center; padding: 0 15px 0 26px; width: 100%; } .collection__sort-bar .collection__sort__label span { width: 180px; position: relative; min-width: 170px; text-align: left; color: #747474; font-family: Karla; font-weight: 500; font-size: 14px; line-height: 16px; text-transform: capitalize; } .collection__sort-bar .collection__sort__label .icon { padding: 0 4px; width: 22px; rotate: 90deg; position: absolute; top: 50%; right: 16px; margin-top: -8px; } .collection__sort-bar .collection__filter-tag { opacity: 0; transform: translateY(-10px); transition: transform 0.2s 0s, opacity 0.1s 0s; } .collection__sort-bar .collection__filter-tag:last-child { margin-bottom: 0; } .collection__sort-bar .collection__sort__option-wrapper--visible .collection__filter-tag { opacity: 1; transform: translateY(0); transition: transform 0.2s 0.2s, opacity 0.2s 0.2s; } @media only screen and (min-width: 768px) { .collection--breadcrumbs-disabled .collection__sort-bar { margin-left: 240px; } } @media only screen and (min-width: 1024px) { .collection--breadcrumbs-disabled .collection__sort-bar { margin-left: calc(240px + var(--gutter) / 2); } } @media only screen and (min-width: 1440px) { .collection--breadcrumbs-disabled .collection__sort-bar { margin-left: calc(300px + var(--gutter) / 2); } } .collection--breadcrumbs-disabled.collection--filters-disabled .collection__sort-bar { margin-left: 0; } .collection__sort__button { display: block; font-size: calc(1rem * var(--adjust-body)); line-height: 26px; position: relative; padding-left: 18px; cursor: pointer; } /* .collection__sort__button:before { content: ""; position: absolute; top: 0; left: 0; width: 11px; height: 11px; border-radius: 50%; border: 1px solid var(--text); margin: 7px 0; } .collection__sort__button:after { content: ""; position: absolute; top: 0; left: 0; width: 5px; height: 5px; border-radius: 50%; background: transparent; margin: 10px 3px; } */ .collection__sort-bar .collection__sort__button { width: 100%; line-height: 24px; padding: 8px 20px; } .collection__sort__input { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .collection__sort__input:checked~.collection__sort__button:before { background: var(--text); } .collection__sort__input:checked~.collection__sort__button:after { background: var(--bg); } .collection__sort-bar .collection__sort__option-wrapper { position: absolute; margin: 1px 0 0; padding: 12px 0 10px; border: none; box-shadow: 0 1px 2px rgba(0, 0, 0, .1); border-radius: 1px; position: absolute; top: calc(100% - 1px); width: 100%; background: #fff; z-index: 9999; opacity: 0; visibility: hidden; overflow: hidden; top: calc(50% + 16px); min-width: 240px; max-width: 340px; transform-origin: center top; transform: scaleY(0); transition: transform 0.2s 0.1s, opacity 0.2s 0.2s, visibility 0s 0.3s; right: 0; } .collection__sort-bar ul.collection__filter-tags li { padding: 0; } .collection__sort-bar ul.collection__filter-tags li:hover { background: #f3f3f3; } .collection__sort-bar ul.collection__filter-tags li input[type="radio"]:checked+label { background: #f3f3f3; } .collection__sort-bar .collection__sort__option-wrapper--visible { opacity: 1; visibility: visible; transform: scaleY(1); transition: transform 0.2s, opacity 0.1s 0s, visibility 0s 0s; } .collection__filters__empty { margin: 0; padding: 10px 0; } .collection__filters__buttons { padding-bottom: 15px; } .collection__sort-bar { width: auto; text-align: right; display: flex; justify-content: end; align-items: center; width: 300px; position: relative; min-width: 300px; } .collection__sort__title { white-space: nowrap; padding: 0; font-family: Karla; font-weight: 700; font-size: 14px; line-height: 16px; text-transform: uppercase; color: #121212; } .collection__filter-tags-wrapper>.collection__filter-tags { /* max-height: 260px; overflow: auto; */ } button.collection__filters-more { margin: 20px auto; } @media only screen and (min-width: 768px) { .collection__filters__buttons { width: 220px; } } @media only screen and (min-width: 1440px) { .collection__filters__buttons { width: 270px; } } @media only screen and (max-width: 767px) { .collection__filters__buttons { max-width: calc(100vw - var(--scrollbar-width)); padding: 15px var(--gutter-mobile); } } .collection__filters__buttons .btn, .collection__filters__buttons .shopify-payment-button__button--unbranded { margin-top: 15px; width: 100%; } @media only screen and (min-width: 768px) { .collection__filters__buttons .collection__filters__reset.btn--secondary, .collection__filters__buttons .btn--secondary .collection__filters__reset.shopify-payment-button__button--unbranded, .btn--secondary .collection__filters__buttons .collection__filters__reset.shopify-payment-button__button--unbranded { display: none; } } @media only screen and (max-width: 767px) { .collection__filters__buttons .collection__filters__reset.btn--primary, .collection__filters__buttons input.collection__filters__reset.btn, .collection__filters__buttons input.collection__filters__reset.shopify-payment-button__button--unbranded, .collection__filters__buttons .btn--primary .collection__filters__reset.shopify-payment-button__button--unbranded, .btn--primary .collection__filters__buttons .collection__filters__reset.shopify-payment-button__button--unbranded, .collection__filters__buttons input.btn .collection__filters__reset.shopify-payment-button__button--unbranded, input.btn .collection__filters__buttons .collection__filters__reset.shopify-payment-button__button--unbranded, .collection__filters__buttons input.shopify-payment-button__button--unbranded .collection__filters__reset.shopify-payment-button__button--unbranded, input.shopify-payment-button__button--unbranded .collection__filters__buttons .collection__filters__reset.shopify-payment-button__button--unbranded { display: none; } } .collection__filters-header { display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; width: 100%; min-height: var(--collection-sticky-bar-height); padding-top: calc(var(--inner) / 2); position: relative; } @media only screen and (min-width: 768px) { .collection__filters-header { display: none; } } @media only screen and (min-width: 768px) { .collection--breadcrumbs-disabled .collection__filters-list__inner { padding-top: 10px; } } .collection__filters__top { margin-bottom: 5px; padding: 10px 0; width: 100%; min-height: var(--collection-sticky-bar-height); display: flex; align-items: center; justify-content: space-between; font-size: calc(0.875rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .collection__filters__top { padding-top: 0; } } .collection__filters__close { display: flex; align-items: center; justify-content: center; height: 16px; width: 16px; margin-bottom: 15px; cursor: pointer; } .collection__filters__close:hover .icon { transform: rotate(90deg); } .collection__filters__close .icon { width: 100%; height: 100%; transition: transform 0.3s ease; } @media only screen and (min-width: 768px) { .collection__filters__close { display: none; } } .collection__filters__toggle { display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; margin-right: -17px; } @media only screen and (min-width: 768px) { .collection__filters__toggle { display: none; } } .collection--filters-disabled .collection__filters__toggle { justify-self: end; } .collection__filters__clear { display: flex; flex-wrap: wrap; margin-bottom: 15px; } .collection__filters__clear:empty { margin-bottom: 0; } .collection__filters__line { border-width: var(--BORDER-WIDTH) 0 0; margin-top: 0; } .filter__active__remove { position: relative; min-width: 0; width: auto; margin: 0 10px 10px 0; padding: 6px 32px 6px 10px; font-size: calc(0.8rem * var(--adjust-body)); text-align: left; background: var(--COLOR-BG-ACCENT); border-radius: var(--RADIUS); } .filter__active__remove .filter__x { position: absolute; top: 0; right: 0; padding: 6px 10px 8px 12px; font-weight: var(--FONT-WEIGHT-BODY-BOLD); } .filter__input { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .filter__price__fields { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; max-width: 100%; margin: 0; } .filter__price__fields label { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } .filter__price__field { display: flex; align-items: center; flex: 1; max-width: calc(50% - 10px); border: var(--BORDER-WIDTH) solid var(--border); background: var(--input-bg); padding: 5px 15px; border-radius: var(--RADIUS); } .filter__price__field span { margin-right: 5px; } .filter__price__input { flex: 1; display: block; min-width: 0; max-width: 100%; width: auto; padding: 0 3px; border: var(--BORDER-WIDTH) solid transparent; border-radius: 0; margin: 0; font-size: inherit; text-align: right; } .no-js .filter__price__range { display: none; } .range { position: relative; display: block; height: 36px; margin: 0 -6px 6px; -webkit-user-select: none; user-select: none; opacity: 0; } .range.is-initialized { opacity: 1; } .range__dot { position: absolute; z-index: 2; display: block; top: 3px; width: 30px; height: 30px; padding: 7px; } .range__dot:before { content: ""; position: absolute; left: -3px; top: -3px; width: 36px; height: 36px; } .range__dot span { display: block; width: 100%; height: 100%; background: var(--white); border: 2px solid var(--black); border-radius: 50%; font-size: 0; cursor: pointer; } .range__line { position: absolute; top: 16px; left: 8px; z-index: 0; overflow: hidden; width: calc(100% - 16px); height: 4px; border-radius: 6px; background-color: var(--COLOR-BORDER-ALPHA-50); } .range__line span { display: block; height: 100%; width: 0%; background-color: var(--accent); font-size: 0; } @media only screen and (max-width: 767px) { .no-js .collection__filters__close, .no-js .collection__sticky-bar { display: none; } } @media only screen and (min-width: 768px) { .no-js .collection__filters { margin-top: 0; } } @media only screen and (max-width: 767px) { .no-js .collection__filters { position: static; transform: none; height: auto; max-height: none; padding-bottom: var(--gutter); opacity: 1; visibility: visible; } } @media only screen and (max-width: 767px) { .no-js .collection__filters-list { height: auto; } } @media only screen and (max-width: 767px) { .no-js .collection__filters-list__inner { height: auto; padding-left: 0; } } @media only screen and (max-width: 767px) { .no-js .collection__filters-wrapper { max-height: none; } } /*================ Banner ================*/ .banner { --overlay-opacity: 0; position: relative; overflow: hidden; } @media only screen and (max-width: 767px) { .banner .collection__header hr { margin-top: 25px; margin-bottom: 25px; } } .banner .collection__title, .banner .collection__description { color: inherit; } .banner .collection__description { width: auto; } .banner--collection { background-color: var(--bg); } .banner-inner { display: flex; position: relative; } .banner-inner:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--overlay); opacity: var(--overlay-opacity); } .banner-content { width: 100%; padding-top: var(--gutter); padding-bottom: var(--gutter); } .original-height .banner-content { position: absolute; } .original-height .banner-img { position: relative; width: 100%; min-height: inherit; } .no-js .original-height { display: block; } .no-js .original-height .banner-img .img-object-cover { position: absolute; top: 0; left: 0; } .no-js .original-height .banner-content { top: 50%; left: 0; width: 100%; transform: translateY(-50%); } /*================ Collection promo ================*/ .collection-promo { display: grid; grid-template-columns: 1fr; position: relative; grid-column: 1/-1; line-height: 1.5; overflow: hidden; background: var(--bg) no-repeat center center/cover; } .collection-promo__inner { display: grid; grid-template-columns: minmax(0, 1fr); position: relative; line-height: 1.5; background: var(--bg) no-repeat center center/cover; overflow: hidden; } .collection-promo__bg { position: relative; z-index: 2; width: 100%; min-height: 100%; grid-row-start: 1; grid-column-start: 1; padding-top: var(--promo-height); } @media only screen and (max-width: 767px) and (orientation: landscape) { .collection-promo__bg { min-height: auto; } } .collection-promo__bg .placeholder-svg-filled { position: absolute; top: 50%; left: 0; width: 100%; height: 200%; max-height: 200%; transform: translateY(-50%); } .collection-promo__image { top: 50%; left: 50%; transform: translate(-50%, -50%); } .collection-promo__link { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 5; } .collection-promo__heading { color: var(--text); } .collection-promo__heading sup { top: -1.1em; font-size: calc(0.65rem * var(--adjust-heading)); line-height: 1; margin-left: 5px; } @media only screen and (max-width: 1439px) { .collection-promo__heading sup { top: -1em; font-size: calc(0.6rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .collection-promo__heading sup { font-size: calc(0.5rem * var(--adjust-heading)); } } .collection-promo__heading small { font-size: calc(0.65rem * var(--adjust-heading)); margin-left: calc(-0.85rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { .collection-promo__heading small { font-size: calc(0.6rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .collection-promo__heading small { font-size: calc(0.5rem * var(--adjust-heading)); margin-left: calc(-0.75rem * var(--adjust-heading)); } } .collection-promo__text { font-size: calc(0.815rem * var(--adjust-body)); } @media only screen and (min-width: 768px) { .collection-promo__text { font-size: calc(1rem * var(--adjust-body)); } } .collection-promo__buttons { display: flex; flex-flow: row wrap; justify-content: inherit; align-items: flex-start; } @media only screen and (min-width: 480px) { .collection-promo__buttons { margin: 0 calc(var(--inner) / -2); } } @media only screen and (max-width: 479px) { .collection-promo__buttons { width: 100%; } } .collection-promo__button { display: flex; justify-content: center; } @media only screen and (max-width: 479px) { .collection-promo__button { margin-left: 0; margin-right: 0; } } .collection-promo__heading, .collection-promo__text, .collection-promo__button { margin: calc(var(--inner) / 2) 0; max-width: 100%; overflow-wrap: break-word; } @media only screen and (max-width: 479px) { .collection-promo__heading, .collection-promo__text, .collection-promo__button { width: 100%; } } .collection-promo__content { display: flex; justify-content: center; position: relative; z-index: 5; flex-flow: column wrap; grid-row-start: 1; grid-column-start: 1; padding: var(--inner); } .collection-promo__link~.collection-promo__content { pointer-events: none; } .collection-promo__link~.collection-promo__content a { pointer-events: auto; } .collection-promo__body { width: 100%; display: flex; flex-flow: column wrap; justify-content: center; } /*=== Animations ===*/ @media only screen and (max-width: 1023px) { .aos-initialized .collection .collection-promo[data-aos][data-aos-delay].aos-animate { transition-delay: 0s; } .main-content>.shopify-section .collection__filters { display: none; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .collection-promo.collection-promo--grid-even[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-promo.collection-promo--grid-second[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (min-width: 480px) and (max-width: 1023px) { .aos-initialized .collection .collection-promo.collection-promo--grid-third[data-aos][data-aos-delay].aos-animate { transition-delay: 0.3s; } } @media only screen and (max-width: 479px) { .aos-initialized .collection .collection-items--mobile--one-whole .collection-promo.collection-promo--grid-even[data-aos][data-aos-delay].aos-animate { transition-delay: 0s; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .collection-promo .collection-promo__heading[data-aos][data-aos-delay].aos-animate { transition-delay: 0.3s; } } @media only screen and (max-width: 479px) { .aos-initialized .collection .collection-promo .collection-promo__heading[data-aos][data-aos-delay].aos-animate { transition-delay: 0.15s; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .collection-promo .collection-promo__text[data-aos][data-aos-delay].aos-animate { transition-delay: 0.45s; } } @media only screen and (max-width: 479px) { .aos-initialized .collection .collection-promo .collection-promo__text[data-aos][data-aos-delay].aos-animate { transition-delay: 0.3s; } } @media only screen and (max-width: 1023px) { .aos-initialized .collection .collection-promo .collection-promo__button[data-aos][data-aos-delay].aos-animate { transition-delay: 0.6s; } } @media only screen and (max-width: 479px) { .aos-initialized .collection .collection-promo .collection-promo__button[data-aos][data-aos-delay].aos-animate { transition-delay: 0.45s; } } /*=== Modifiers ===*/ .collection-promo--two-columns { grid-column: span 2; } @media only screen and (max-width: 479px) { .collection-promo--two-columns { grid-column: 1/-1; } } .collection-promo--one-column { grid-column: span 1; } @media only screen and (max-width: 1023px) { .collection-items--2 .collection-promo--full.collection-promo--tablet-full, .collection-promo--two-columns.collection-promo--tablet-full { grid-column: span 2; } } @media only screen and (max-width: 1023px) { .collection-promo--full.collection-promo--tablet-full { grid-column: span 3; } } @media only screen and (max-width: 1023px) { .collection-promo--two-columns.collection-promo--grid-second, .collection-promo--full.collection-promo--grid-second { grid-column: span 2; } } @media only screen and (max-width: 1023px) { .collection-promo--two-columns.collection-promo--grid-third, .collection-promo--full.collection-promo--grid-third { grid-column: span 1; } } @media only screen and (max-width: 479px) { .collection-promo--two-columns.collection-promo, .collection-promo--full.collection-promo { grid-column: span 2; } } @media only screen and (max-width: 479px) { .collection-promo--two-columns.collection-promo--grid-even, .collection-promo--full.collection-promo--grid-even { grid-column: span 1; } } @media only screen and (max-width: 479px) { .collection-items--mobile--one-whole .collection-promo--one-column, .collection-items--mobile--one-whole .collection-promo--two-columns, .collection-items--mobile--one-whole .collection-promo--full { grid-column: 1/-1; } } .collection-items--2 .collection-promo:not(.collection-promo--one-column) .collection-promo__bg, .collection-items--3 .collection-promo--two-columns .collection-promo__bg, .collection-items--4 .collection-promo--two-columns .collection-promo__bg { padding-top: calc(var(--promo-height) / 2); } .collection-items--3 .collection-promo--full .collection-promo__bg { padding-top: calc(var(--promo-height) / 3); } @media only screen and (max-width: 1023px) { .collection-items--3 .collection-promo--full .collection-promo__bg { padding-top: calc(var(--promo-height) / 2); } } .collection-items--4 .collection-promo--full .collection-promo__bg { padding-top: calc(var(--promo-height) / 4); } @media only screen and (max-width: 1023px) { .collection-items--4 .collection-promo--full .collection-promo__bg { padding-top: calc(var(--promo-height) / 2); } } @media only screen and (max-width: 479px) { .collection-items--3 .collection-promo--two-columns.collection-promo--grid-even .collection-promo__bg, .collection-items--4 .collection-promo--two-columns.collection-promo--grid-even .collection-promo__bg { padding-top: var(--promo-height); } } @media only screen and (max-width: 479px) { .collection__products.collection-items--mobile--one-whole .collection-promo .collection-promo__bg { padding-top: var(--promo-height); } } @media only screen and (min-width: 1024px) { .collection-promo--full .collection-promo__content--inline .collection-promo__heading, .collection-promo--full .collection-promo__content--inline .collection-promo__text, .collection-promo--full .collection-promo__content--inline .collection-promo__button { margin: calc(var(--inner) / 2); } } @media only screen and (min-width: 1024px) { .collection-promo--full .collection-promo__content--inline { padding: 0; } } @media only screen and (min-width: 1024px) { .collection-promo--full .collection-promo__content--inline .collection-promo__body { flex-flow: row wrap; justify-content: center; align-items: center; padding: var(--inner); } } @media only screen and (min-width: 1024px) { .collection-promo--full .collection-promo__content--inline .collection-promo__buttons { margin: 0; } } @media only screen and (min-width: 1024px) { .collection-promo--full .collection-promo__content--inline .collection-promo__button { display: flex; justify-content: center; z-index: 2; } } @media only screen and (min-width: 1024px) { .collection-promo--full .collection-promo__content--inline .collection-promo__button .btn--caps { margin-bottom: -2px; } } .item--top-left .collection-promo__link, .item--top-right .collection-promo__link, .item--top-left .collection-promo__button, .item--top-right .collection-promo__button { align-items: flex-start; } .item--right .collection-promo__content, .item--bottom-right .collection-promo__link, .item--bottom-right .collection-promo__button, .item--bottom-right .collection-promo__content, .item--top-right .collection-promo__content, .item--bottom-right .collection-promo__content--inline .collection-promo__body, .item--bottom-left .collection-promo__link, .item--bottom-left .collection-promo__button, .item--bottom-left .collection-promo__content--inline .collection-promo__body { align-items: flex-end; } .item--bottom-left .collection-promo__content, .item--bottom-right .collection-promo__content, .item--right .collection-promo__link, .item--right .collection-promo__button, .item--right .collection-promo__buttons, .item--right .collection-promo__content--inline .collection-promo__body, .item--top-right .collection-promo__link, .item--top-right .collection-promo__button, .item--top-right .collection-promo__buttons, .item--top-right .collection-promo__content--inline, .item--top-right .collection-promo__content--inline .collection-promo__body, .item--bottom-right .collection-promo__link, .item--bottom-right .collection-promo__button, .item--bottom-right .collection-promo__buttons, .item--bottom-right .collection-promo__content--inline, .item--bottom-right .collection-promo__content--inline .collection-promo__body { justify-content: flex-end; } .item--top-left .collection-promo__link, .item--top-left .collection-promo__button, .item--top-left .collection-promo__buttons, .item--top-left .collection-promo__content, .item--top-left .collection-promo__content--inline .collection-promo__body, .item--top-right .collection-promo__content, .item--left .collection-promo__link, .item--left .collection-promo__button, .item--left .collection-promo__buttons, .item--left .collection-promo__content--inline .collection-promo__body, .item--bottom-left .collection-promo__link, .item--bottom-left .collection-promo__button, .item--bottom-left .collection-promo__buttons, .item--bottom-left .collection-promo__content--inline .collection-promo__body { justify-content: flex-start; } .item--right .collection-promo__content, .item--top-right .collection-promo__content, .item--bottom-right .collection-promo__content { text-align: right; } /*================ Contact form section ================*/ .contact-form__message { position: fixed; width: 100%; bottom: 0; left: 0; z-index: 8995; background: var(--bg); box-shadow: 0 -5px 5px 0 rgba(0, 0, 0, 0.05); opacity: 1; transition: transform 0.45s ease, visibility 0s; max-height: 50vh; overflow-x: hidden; overflow-y: auto; } .contact-form__message.hide-down { transform: translateY(100%); visibility: hidden; transition-delay: 0s, 0.45s; } .contact-form__message .errors, .contact-form__message .note { margin: 0; border: 0; padding: var(--inner); font-size: calc(1rem * var(--adjust-body)); background: none; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .contact-form__message .errors, .contact-form__message .note { padding-top: var(--inner-tablet); padding-bottom: var(--inner-tablet); } } @media only screen and (max-width: 767px) { .contact-form__message .errors, .contact-form__message .note { padding-top: var(--inner-mobile); padding-bottom: var(--inner-mobile); } } .contact-form__message__close { position: absolute; top: 8px; right: 0; width: 54px; height: 54px; padding: 18px; color: inherit; text-decoration: none; top: 50%; transform: translateY(-50%); } .contact-form__message__close svg { display: block; width: 100%; height: 100%; transition: transform 0.3s ease; pointer-events: none; } .contact-form__message__close:hover svg { transform: rotate(90deg); } .brick__section { --inner: 30px; background: var(--bg); position: relative; } .brick__section .featured-image__heading, .brick__section .featured-image__caption { color: var(--text); } @media only screen and (max-width: 767px) { .brick__section { height: auto; min-height: 0 !important; } } .brick__section__wrapper { height: 100%; } .fullwidth .featured-image__pane { border-radius: 0; } .brick__blocks__flex { display: flex; flex-direction: column; } @media only screen and (min-width: 768px) { .brick__blocks__flex { flex-direction: row; height: 100%; } } .wrapper--full .brick__blocks__flex--gap { padding: 0 var(--grid-gutter); } @media only screen and (min-width: 1024px) { .brick__blocks__flex--gap .brick__block { flex-basis: calc(50% - var(--grid-gutter)); } .brick__blocks__flex--gap .brick__block+.brick__block { margin-left: var(--grid-gutter); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .brick__blocks__flex--gap { margin: 0 calc(var(--gutter-mobile) / -2); } .brick__blocks__flex--gap .brick__block { margin: 0 calc(var(--gutter-mobile) / 2); flex-basis: calc(50% - var(--gutter-mobile)); } } @media only screen and (max-width: 767px) { .brick__blocks__flex--gap .brick__block:not(:last-child) { margin-bottom: var(--gutter-mobile); } } .brick__block { position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column; overflow: hidden; } @media only screen and (min-width: 768px) { .brick__block { flex: 1 0 50%; } } .brick__block .video-text-wrapper { width: 100%; max-width: var(--site-width-narrow); padding: var(--inner); } .brick__block .product-grid-item { background: var(--COLOR-BG); box-shadow: inset 0 0 1px var(--border-lighten-darken); } .brick__block .product-grid-item__image { margin: 0; } .brick__block .product-grid-item__info { padding: 20px; } @media only screen and (min-width: 768px) { .brick__block--collection .flickity-enabled .product-grid-item { overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .brick__block--collection .flickity-enabled .product-grid-item::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .brick__block--collection .flickity-enabled .product-grid-item:hover { height: 100%; } } .brick__block__content, .brick__block__inner { width: 100%; height: 100%; } .brick__block__inner { text-align: center; padding: var(--inner); display: flex; flex-direction: column; justify-content: center; } .brick__block--image, .brick__block--video { padding: 0; } .brick__block--image .brick__block__inner, .brick__block--video .brick__block__inner { padding: 0; } .brick__block__content, .brick__block__inner, .brick__block .video-wrapper, .brick__block .video__container, .brick__block .video-background, .brick__block .featured-image__bg, .brick__block video { border-radius: var(--RADIUS); overflow: inherit; transform: translateZ(0); } .brick__subheading { font-size: calc(0.75rem * var(--FONT-ADJUST-BODY)); font-weight: var(--FONT-WEIGHT-BODY); text-transform: uppercase; letter-spacing: 0.15em; margin: 0; margin-bottom: 20px; } .brick__block__text { height: 100%; display: flex; align-items: center; } .brick__product { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; max-width: 100%; margin: 0 auto; } @media only screen and (min-width: 1024px) { .brick__product { max-width: 25vw; } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .brick__product { max-width: 33vw; } } @media only screen and (max-width: 767px) { .brick__product .product-grid-item { margin: 0; width: 100%; } } .brick__collection { margin: 0 auto; width: 100%; } @media only screen and (min-width: 1024px) { .brick__collection { max-width: 25vw; } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .brick__collection { max-width: 33vw; } } @media only screen and (max-width: 767px) { .brick__collection { display: flex; flex-flow: row nowrap; margin: 0 calc(var(--inner) * -1); padding: 0 0 0 var(--grid-gutter); width: auto; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .brick__collection::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .brick__collection .product-grid-item { margin-right: var(--grid-gutter); } } @media only screen and (min-width: 768px) { .brick__block .product-grid-item { width: 100%; margin: 0; } } @media only screen and (min-width: 768px) { .brick__collection:not(.flickity-enabled) .product-grid-item:not(:first-of-type) { display: none; } } .brick__testimonial { width: 100%; max-width: 600px; margin: auto; } .brick__testimonial .testimonial__item { width: 100%; } .brick__testimonial .testimonial__item__inner { padding: calc(var(--inner) * 1.5); } .text-left .testimonial__stars { justify-content: flex-start; } .text-left .testimonial__user { align-items: flex-start; } .brick__newsletter .newsletter-form .form-success, .brick__newsletter .input-group { margin: 0 auto; justify-content: center; } .brick__image { display: flex; height: 100%; } .brick__video { display: flex; flex-direction: column; height: 100%; } /*================ Featured Collection ================*/ .featured-collection { position: relative; text-align: center; overflow: hidden; background: var(--bg); } .featured-collection--empty { display: flex; } .featured-collection--split-left, .featured-collection--split-right { overflow: visible; } .featured-collection__top { position: relative; display: flex; flex-direction: column; justify-content: center; margin-bottom: calc(var(--gutter) / 2); z-index: 5; } .featured-collection__top .section__heading { font-family: Futura-Medium; font-style: normal; font-weight: 500; font-size: 21px; line-height: 19px; text-transform: uppercase; text-align: center; color: #000; } @media only screen and (max-width: 767px) { .featured-collection__top { display: block; } } .featured-collection .section__heading { line-height: 1; pointer-events: none; margin-bottom:0; } .featured-collection__top.text-center { align-items: center; } @media only screen and (min-width: 768px) { .featured-collection__top.text-left { flex-direction: row; justify-content: space-between; } } .featured-collection__top__wrapper { max-width: var(--site-width-narrow); margin-bottom: 0; } .featured-collection__top__button { flex: 0 0 auto; margin-top: 0.5rem; } @media only screen and (min-width: 768px) { .featured-collection__top__button { margin-left: var(--gutter); } } @media only screen and (min-width: 768px) { .featured-collection__inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--grid-gutter) * 2); grid-template-areas: "column-left column-right"; } } @media only screen and (min-width: 768px) { .featured-collection__inner .featured-collection__container { grid-area: column-right; } } .featured-collection__inner .featured-collection__top__wrapper { max-width: 100%; } .featured-collection__inner .featured-collection__top { display: block; } @media only screen and (min-width: 768px) { .featured-collection__inner .featured-collection__top { grid-area: column-left; } } @media only screen and (min-width: 768px) { .featured-collection__inner--splitright .featured-collection__top { grid-area: column-right; } } @media only screen and (min-width: 768px) { .featured-collection__inner--splitright .featured-collection__container { grid-area: column-left; } } .featured-collection__top .featured-collection__top__button { flex: none; margin-top: calc(var(--gutter) / 2); } @media only screen and (min-width: 768px) { .featured-collection__top .featured-collection__top__button { margin-left: 0; margin-top: 0; } } .featured-collection__top-inner { position: sticky; top: 0; } @media only screen and (min-width: 768px) { .featured-collection__top-inner { padding-top: var(--grid-gutter); margin-top: calc(var(--grid-gutter) * -1); } } .has-scrolled .featured-collection__top-inner { top: var(--header-sticky-height); } .featured-collection__inner .featured-collection__top__button { margin-top: calc(var(--gutter) / 2); } .featured-collection__bottom { display: flex; justify-content: center; margin-top: calc(var(--gutter) / 2); } .featured-collection--no-results { width: 100%; } @media only screen and (max-width: 767px) { .featured-collection .grid--mobile { gap: var(--grid-gutter-mobile) var(--grid-gutter); } } .featured-collection .flickity-button { background: var(--bg); } @media only screen and (max-width: 767px) { .featured-collection .carousel--mobile .collection-promo { display: grid; } } @media only screen and (min-width: 768px) { .featured-collection--carousel .flickity-enabled .carousel__item { overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .featured-collection--carousel .flickity-enabled .carousel__item::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .featured-collection--carousel .flickity-enabled .carousel__item:hover { height: 100%; } } /*=== Modifiers ===*/ .featured-collection--carousel .collection-promo { min-height: 100%; } @media only screen and (min-width: 1024px) { .featured-collection--carousel .collection-promo--two-columns.one-half { width: calc(var(--wrapper-width) - var(--grid-gutter)); } } @media only screen and (min-width: 1024px) { .featured-collection--carousel .collection-promo--two-columns.one-third { width: calc((var(--wrapper-width) - var(--grid-gutter) * 2) / 3 * 2); } } @media only screen and (min-width: 1024px) { .featured-collection--carousel .collection-promo--two-columns.one-quarter { width: calc((var(--wrapper-width) - var(--grid-gutter) * 3) / 2); } } @media only screen and (min-width: 1024px) { .featured-collection--carousel .collection-promo--full.one-half, .featured-collection--carousel .collection-promo--full.one-third, .featured-collection--carousel .collection-promo--full.one-quarter { width: calc(var(--wrapper-width) - var(--grid-gutter)); } } @media only screen and (max-width: 767px) { .featured-collection--mobile-two-columns .grid--mobile { grid-template-columns: var(--grid-mobile); } } @media only screen and (max-width: 767px) { .featured-collection .grid--mobile .collection-promo, .featured-collection .grid--mobile .product-grid-item { grid-column: span 2; } } @media only screen and (max-width: 767px) { .featured-collection--mobile-two-columns .grid--mobile .collection-promo, .featured-collection--mobile-two-columns .grid--mobile .product-grid-item { grid-column: span 1; } } @media only screen and (max-width: 767px) { .featured-collection .carousel--mobile .collection-promo, .featured-collection .carousel--mobile .product-grid-item { grid-column: span 1; } } @media only screen and (max-width: 767px) { .featured-collection--mobile-two-columns .collection-promo__content { padding: var(--inner-mobile); } } @media only screen and (min-width: 1024px) { .featured-collection--split-left.collection-items--4 .collection-promo .collection-promo__bg, .featured-collection--split-right.collection-items--4 .collection-promo .collection-promo__bg { padding-top: calc(var(--promo-height) / 2); } } @media only screen and (max-width: 767px) { .featured-collection--mobile-two-columns .grid--mobile .collection-promo--tablet-full { grid-column: span 2; } } @media only screen and (max-width: 767px) { .featured-collection--mobile-two-columns .grid--mobile .collection-promo--tablet-full .collection-promo__bg { padding-top: calc(var(--promo-height) / 2); } } @media only screen and (max-width: 767px) { .featured-collection--mobile-single-column .grid--mobile .collection-promo .collection-promo__bg { padding-top: var(--promo-height); } } /*================ Featured Image ================*/ .featured-image__bg .placeholder-svg-filled { position: absolute; top: 50%; left: 0; height: 200%; max-height: 200%; transform: translateY(-50%); } .featured-image__pane { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .featured-image__scale { position: relative; display: block; width: 100%; height: 100%; } .featured-image__content { position: relative; z-index: 5; } .featured-image__content-inner { max-width: 740px; margin: 0; padding: var(--inner); } .featured-image__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*================ Featured Product ================*/ .featured-product { background-color: var(--bg); } .featured-product .share-button__holder { margin-bottom: 0; } @media only screen and (min-width: 1024px) { .featured-product .featured-product__onboarding { display: grid; grid-template-columns: 50% 50%; } } .featured-product__gallery { position: relative; } /*================ Featured Video ================*/ .featured-video-section { position: relative; display: flex; flex-direction: column; } .video-wrapper { position: relative; height: 100%; overflow: hidden; border-radius: inherit; flex: 1; transform: translateZ(0); display: flex; flex-direction: column; } .video-wrapper:not(.is-paused) .main-buttons--video-bg { display: none; } .video__container { overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .is-paused .video__container { z-index: 0; } .video-background .placeholder-svg-filled { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); } .is-paused .video-background--image { z-index: 1; } .video__player { position: absolute; top: 50%; left: 50%; min-height: 100%; min-width: 100%; width: 100%; height: 100%; transform: translate(-50%, -50%); overflow: hidden; transition: opacity 0.5s ease 0.5s; } .video__player video { min-width: 100%; min-height: 100%; object-fit: cover; } .video__player video::-webkit-media-controls { display: none; } .video__player.is-loading { opacity: 0; } .video__iframe { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 200%; max-width: none; pointer-events: none; opacity: 0; transform: translate(-50%, -50%); transition: opacity 0.2s ease; } .loaded .video__iframe { opacity: 1; } .video__overlay { z-index: auto; } .is-paused .video__overlay { z-index: 2; } .text-inside { display: flex; width: 100%; height: 100%; flex: 1; } .video-text-wrapper { position: relative; padding-top: var(--gutter); padding-bottom: var(--gutter); } .video-text-wrapper .btn, .video-text-wrapper .shopify-payment-button__button--unbranded { margin-right: 0; } .video-text-wrapper .video-text-link .icon-play { width: 60px; height: 60px; margin-right: 0; } .video-text-wrapper .main-buttons { flex-flow: row wrap; } @media only screen and (max-width: 479px) { .video-text-wrapper .main-buttons__item { width: 100%; } } @media only screen and (max-width: 767px) { .video-text-wrapper .align--top-right, .video-text-wrapper .align--middle-right, .video-text-wrapper .align--bottom-right { justify-content: flex-start; } } /* ============================================================================ #Search popdown ============================================================================== */ search-popdown { --width: 600px; --icon-size: 26px; --search-popdown-height: 68px; display: flex; } search-popdown summary.navlink--icon { transition: none; } search-popdown details>summary:first-of-type { list-style-type: none; } .search-popdown--page { width: 100%; } .search-page__head .search-popdown--page { display: none; } .search-popdown--page .search-popdown__body { width: 100%; } .search-popdown--page .predictive-search, .search-popdown--page .popular-searches { border: var(--BORDER-WIDTH) solid var(--border); border-top: 0; max-width: calc(var(--width) - 2px); max-height: calc(100vh - var(--search-popdown-height)); } @media only screen and (max-width: 767px) { .search-popdown--page .predictive-search, .search-popdown--page .popular-searches { display: none; } } @media (pointer: coarse) { .search-popdown--page .predictive-search, .search-popdown--page .popular-searches { display: none; } } .search-popdown--page .search-popdown__close { opacity: 0; visibility: hidden; transition: opacity 0.2s, visibility 0s 0.2s; } @media only screen and (max-width: 767px) { .search-popdown--page .search-popdown__close { display: none; } } @media (pointer: coarse) { .search-popdown--page .search-popdown__close { display: none; } } [data-search-performed=false] .search-popdown--page .predictive-search, [data-search-performed=false] .search-popdown--page .popular-searches, [data-search-performed=false] .search-popdown--page .search-popdown__close { display: none; } .no-js .search-popdown--page .popular-searches, .no-js .search-popdown--page .search-popdown__close { display: none; } .search-popdown--page:focus-within .search-popdown__close { opacity: 1; visibility: visible; } .menu__item--compress search-popdown { min-height: 100%; } .menu__item--compress search-popdown details>summary:first-of-type { height: 100%; } .menu__item:not(.menu__item--compress) search-popdown>details>summary:first-of-type { margin: 0; } .search-popdown__body--fixed { position: fixed; z-index: 4; top: 100%; left: 0; width: 100%; } @media only screen and (max-width: 767px) { .search-popdown__body--fixed { width: 100vw; } } .site-header--has-border .search-popdown__body--fixed { border-top: var(--BORDER-WIDTH) solid var(--border-color); } .search-popdown__results { position: absolute; z-index: 4; top: 100%; left: 0; right: 0; width: 100%; height: 100vh; max-height: calc(100vh - var(--header-height) - var(--search-popdown-height)); pointer-events: none; } @media only screen and (max-width: 767px) { .search-popdown__results { width: 100vw; } } @media only screen and (max-width: 767px) { .search-page .search-popdown__results { max-width: 100%; } } .search-popdown__results>* { pointer-events: all; } .search-popdown__toggle { display: flex; justify-content: center; align-items: center; cursor: pointer; } .search-popdown__toggle::-webkit-details-marker { display: none; } .search-popdown__toggle .icon-close { display: none; } .search-popdown__close { width: 50px; height: 100%; display: flex; align-items: center; justify-content: center; cursor: pointer; color: inherit; text-decoration: none; outline: none; position: relative; top: -3px; } .site-header .search-form__input::placeholder { font-size: 16px; line-height: 20px; position: relative; top: 2px; left: -2px; } @media only screen and (max-width: 767px) { .search-popdown__close { right: 0; width: 40px; } } .search-popdown__close .icon { width: 22px; height: auto; /* stroke-width: calc(var(--STROKE-WIDTH) - 4px); transition: transform 0.3s ease; */ pointer-events: none; } .search-popdown__close:hover .icon { transform: rotate(90deg); } /*================ Icons row ================*/ .icons-row { --item-width: 100%; overflow: hidden; color: var(--text); background-color: var(--bg); } @media only screen and (max-width: 767px) { .icons-row { --item-width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); } } .icons-row p { font-size: inherit; } .icons-row__headings { margin-bottom: calc(var(--gutter-mobile) * 1.5); } @media only screen and (min-width: 768px) { .icons-row__headings { margin-bottom: calc(var(--gutter) / 1.5); } } @media only screen and (max-width: 767px) { .icons-row__headings { padding: 0 var(--gutter-mobile); } } .icons-row__heading { text-align: inherit; margin-bottom: 0; color: var(--text); } @media only screen and (min-width: 768px) { .icons-row__slider { display: grid; gap: var(--gutter); } } @media only screen and (max-width: 767px) { .icons-row__slider:after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } @media only screen and (min-width: 768px) { .icons-row__slider.items--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media only screen and (min-width: 768px) { .icons-row__slider.items--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media only screen and (min-width: 768px) { .icons-row__slider.items--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media only screen and (min-width: 768px) { .icons-row__slider--flex { display: flex; gap: 0; margin: 0 calc(var(--gutter) / -2); } } @media only screen and (min-width: 768px) { .icons-row__slider--flex .icons-row__item { margin: 0 calc(var(--gutter) / 2); } } @media only screen and (min-width: 768px) { .icons-row__slider--flex.items--2 { --item-width: calc((100% - var(--gutter)) / 2); } } @media only screen and (min-width: 768px) { .icons-row__slider--flex.items--3 { --item-width: calc((100% - var(--gutter) * 2) / 3); } } @media only screen and (min-width: 768px) { .icons-row__slider--flex.items--4 { --item-width: calc((100% - var(--gutter) * 3) / 4); } } .icons-row__wrapper { position: relative; } @media only screen and (max-width: 767px) { .icons-row__wrapper { margin: 0 calc(var(--gutter-mobile) * -1); } } .icons-row__wrapper.text-inline-center { text-align: center; } @media only screen and (min-width: 768px) { .icons-row__slider.text-center, .icons-row__slider.text-inline-center { justify-content: center; } } @media only screen and (max-width: 767px) { .icons-row__slider.text-center, .icons-row__slider.text-inline-center { justify-content: flex-start; } } .text-inline-center .icons-row__item { justify-content: center; } .icons-row__wrapper--single-block-center .icons-row__slider, .icons-row__wrapper--single-block-center .icons-row__slider .icons-row__item { justify-content: center; } .text-inline-center .icons-row__item, .text-inline-left .icons-row__item { display: flex; text-align: initial; } .text-inline-center .icons-row__icon, .text-inline-left .icons-row__icon { flex: 0 0 auto; margin-bottom: 0; margin-right: 14px; } @media only screen and (max-width: 767px) { .text-inline-center .icons-row__slider.grid--mobile .icons-row__icon, .text-inline-left .icons-row__slider.grid--mobile .icons-row__icon { margin-right: 0; } } .icons-row__item--center { align-items: center; } @media only screen and (min-width: 768px) { .icons-row__item { width: var(--item-width); } } @media only screen and (max-width: 767px) { .icons-row__item { display: inline-block; min-width: var(--item-width); margin-right: var(--grid-gutter); scroll-snap-align: start; } } @media only screen and (max-width: 767px) { .icons-row__slider.grid--mobile { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; text-align: center; } } @media only screen and (max-width: 767px) { .icons-row__slider.grid--mobile .icons-row__item.grid__item { min-width: 0; width: calc(50% - var(--grid-gutter) / 2); } } @media only screen and (max-width: 767px) { .icons-row__slider.grid--mobile .icons-row__item.grid__item:only-child { margin: 0; } } @media only screen and (max-width: 767px) { .icons-row__slider.grid--mobile .icons-row__item.grid__item:nth-child(n+3) { margin-top: var(--grid-gutter); } } @media only screen and (max-width: 767px) { .icons-row__slider.grid--mobile .icons-row__item.grid__item:nth-child(even), .icons-row__slider.grid--mobile .icons-row__item.grid__item:last-child { margin-right: 0; } } @media only screen and (max-width: 767px) { .text-inline-center .icons-row__slider.grid--mobile .icons-row__item, .text-inline-left .icons-row__slider.grid--mobile .icons-row__item { display: block; text-align: center; } } @media only screen and (max-width: 767px) { .icons-row__slider.carousel--mobile .icons-row__item.carousel__item { width: 60%; min-width: var(--item-width); margin-right: calc(var(--gutter-mobile)); } } @media only screen and (max-width: 767px) { .icons-row__slider.carousel--mobile .icons-row__item.carousel__item:last-child, .icons-row__slider.carousel--mobile .icons-row__item.carousel__item:only-of-type { margin-right: 0; } } @media only screen and (max-width: 767px) { .icons-row__item:last-child { margin-right: 0; } } @media only screen and (max-width: 767px) { .icons-row__item:only-child { --item-width: var(--wrapper-width); } } .icons-row__item--box { background: var(--bg); padding: calc(var(--gutter) / 2); } @media only screen and (max-width: 767px) { .icons-row__item--box { padding: var(--gutter-mobile); } } @media only screen and (max-width: 767px) { .carousel--mobile .icons-row__item--box { padding: var(--gutter-mobile); } } .icons-row__icon { position: relative; display: inline-block; margin-bottom: 14px; width: min(var(--icon-size), var(--icon-max-size)); } @media only screen and (max-width: 767px) { .icons-row__icon { margin-bottom: 0; } } .icons-row__icon .icon { display: block; width: 100%; height: min(var(--icon-size), var(--icon-max-size)); } .icons-row__image { width: 100%; } .icons-row__title { margin-bottom: 0; color: var(--text); font-size: calc(1.333rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .icons-row__title { font-size: calc(1.064rem * var(--adjust-body)); } } .icons-row__subheading p { margin: 0.25em 0; } .icons-row__subheading p:last-child { margin-bottom: 0; } .icons-row__text { color: var(--text-lighten); font-size: calc(1rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .icons-row__text { font-size: calc(0.8rem * var(--adjust-body)); } } .icons-row__text p { margin-top: 6px; } @media only screen and (max-width: 767px) { .icons-row__text p:first-child { margin-top: 0; } } .icons-row__text p:last-child { margin-bottom: 0; } .icons-row__actions { margin-top: calc(var(--gutter-mobile) * 1.5); } @media only screen and (min-width: 768px) { .icons-row__actions { margin-top: calc(var(--gutter) / 1.5); } } @media only screen and (max-width: 767px) { .icons-row__actions { padding: 0 var(--gutter-mobile); } } .icons-row-block__item { --offset-top: calc(var(--icon-size) + var(--inner) * 1); position: relative; padding-top: var(--offset-top); min-height: calc(1rem * var(--adjust-body) * var(--line-height)); display: flex; flex-direction: column; flex-basis: var(--icon-size); flex-shrink: 0; align-items: center; justify-content: center; align-self: start; color: var(--icon-color); } @media only screen and (max-width: 767px) { .icons-row-block__item { min-width: calc(50% - var(--grid-gutter) / 2); margin-right: var(--grid-gutter); text-align: center; } } @media only screen and (max-width: 767px) and (max-width: 767px) { .icons-row-block__item:nth-child(n+3) { margin-top: var(--grid-gutter); } } @media only screen and (max-width: 767px) and (max-width: 767px) { .icons-row-block__item:nth-child(even), .icons-row-block__item:last-child { margin-right: 0; } } .icons-row-block__item .icon { display: block; width: var(--icon-size); height: var(--icon-size); } @supports (-webkit-hyphens: none) { .icons-row-block__item .icon { width: calc(var(--icon-size) + 2px); height: calc(var(--icon-size) + 2px); padding: 1px; margin: -1px; } } .icons-row-block__item--center { align-self: center; } .icons-row-block__holder { display: block; position: relative; width: 100%; height: 0; padding-top: var(--aspect-ratio); } .icons-row-block__icon { width: var(--icon-size); color: var(--icon-color); align-self: center; overflow: hidden; position: absolute; top: calc(var(--offset-top) / 2); max-height: var(--icon-size); } @supports (-webkit-hyphens: none) { .icons-row-block__icon { width: calc(var(--icon-size) + 2px); max-height: calc(var(--icon-size) + 2px); padding: 1px; margin: -1px; } } .text-left .icons-row-block__icon { transform: translate(0, -50%); } @media only screen and (min-width: 768px) { .text-left .icons-row-block__icon { left: 0; } } .text-center .icons-row-block__icon { left: 50%; transform: translate(-50%, -50%); } .text-right .icons-row-block__icon { transform: translate(0, -50%); } @media only screen and (min-width: 768px) { .text-right .icons-row-block__icon { right: 0; } } .icons-row-block__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; } .icons-row-block__text { width: 100%; } .image-accordions { display: flex; position: relative; overflow: hidden; } @media only screen and (max-width: 767px) { .image-accordions { flex-flow: row nowrap; justify-content: flex-start; overflow-x: auto !important; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .image-accordions::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } } .image-accordion__text { position: absolute; z-index: 100; top: 0; left: 0; bottom: 0; right: 0; display: flex; } @media only screen and (max-width: 767px) { .image-accordions--spacing { margin: 0 calc(var(--gutter-mobile) * -1); max-height: var(--full-height); } .image-accordions--spacing::after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } .image-accordion__image__container { position: absolute; top: 0; width: 100%; min-height: 100%; left: 0; } @media only screen and (min-width: 768px) { .image-accordion__image__container { left: 50%; transform: translateX(-50%); } } @media only screen and (min-width: 768px) { .image-accordions--spacing.image-accordions--1 .image-accordion__image__container { width: calc(2px + (var(--wrapper-width))); } .image-accordions--spacing.image-accordions--2 .image-accordion__image__container { width: calc(2px + (var(--wrapper-width)) * 5 / 6); } .image-accordions--spacing.image-accordions--3 .image-accordion__image__container { width: calc(2px + (var(--wrapper-width)) * 5 / 7); } .image-accordions--spacing.image-accordions--4 .image-accordion__image__container { width: calc(2px + (var(--wrapper-width)) * 5 / 8); } .image-accordions--1 .image-accordion__image__container { width: 100vw; } .image-accordions--2 .image-accordion__image__container { width: calc(83.3333333333vw + 2px); } .image-accordions--3 .image-accordion__image__container { width: calc(71.4285714286vw + 2px); } .image-accordions--4 .image-accordion__image__container { width: calc(62.5vw + 2px); } } @media only screen and (min-width: 768px) { .image-accordion__image__container--mobile { display: none; } } @media only screen and (max-width: 767px) { .image-accordion__image__container--mobile+.image-accordion__image__container--desktop { display: none; } } .image-accordion__image__wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .image-accordion { position: relative; width: calc(var(--wrapper-width) - var(--grid-gutter)); z-index: 1; white-space: normal; flex: 0 0 auto; } .image-accordion.is-expanded { flex: 0 0 auto; } @media only screen and (min-width: 768px) { .image-accordion { display: flex; flex: 1; width: 100%; transition: flex 0.75s cubic-bezier(0.29, 0, 0.2, 1); } .image-accordion.is-expanded { flex: 5; } } @media only screen and (max-width: 767px) { .image-accordion { scroll-snap-align: start; } .image-accordions--spacing .image-accordion { padding-left: var(--gutter-mobile); } } .image-accordion__inner { position: relative; width: 100%; height: 100%; overflow: hidden; } .image-accordion__image__svg { position: relative; left: 50%; min-width: 100%; min-height: 100%; max-height: none; padding-right: 263%; transform: translateX(-50%); } .image-accordion__image__svg .placeholder-svg-filled { position: absolute; } .image-accordion:nth-child(1) .placeholder-svg-filled { fill: var(--COLOR-BG-LIGHTEN-DARKEN-CONTRAST); background: var(--COLOR-BG-LIGHTEN-DARKEN); } .image-accordion:nth-child(2) .placeholder-svg-filled { fill: var(--COLOR-BG-LIGHTEN-DARKEN-CONTRAST-2); background: var(--COLOR-BG-LIGHTEN-DARKEN-2); } .image-accordion:nth-child(3) .placeholder-svg-filled { fill: var(--COLOR-BG-LIGHTEN-DARKEN-CONTRAST-3); background: var(--COLOR-BG-LIGHTEN-DARKEN-3); } .image-accordion:nth-child(4) .placeholder-svg-filled { fill: var(--COLOR-BG-LIGHTEN-DARKEN-CONTRAST-4); background: var(--COLOR-BG-LIGHTEN-DARKEN-4); } @media only screen and (min-width: 768px) { .image-accordion:not(.is-expanded) .slide__text__wrapper { opacity: 0; transition: opacity 0.2s ease 0s; } } @media only screen and (min-width: 768px) { .image-accordions--1 .slide__text__wrapper--narrow { min-width: calc(0.6 * (var(--wrapper-width))); } .image-accordions--1 .slide__text__wrapper--normal { min-width: calc(0.8 * (var(--wrapper-width))); } .image-accordions--1 .slide__text__wrapper--wide { min-width: calc((var(--wrapper-width))); } .image-accordions--2 .slide__text__wrapper--narrow { min-width: calc(0.6 * (var(--wrapper-width)) * 5 / 6); } .image-accordions--2 .slide__text__wrapper--normal { min-width: calc(0.8 * (var(--wrapper-width)) * 5 / 6); } .image-accordions--2 .slide__text__wrapper--wide { min-width: calc((var(--wrapper-width)) * 5 / 6); } .image-accordions--3 .slide__text__wrapper--narrow { min-width: calc(0.6 * (var(--wrapper-width)) * 5 / 7); } .image-accordions--3 .slide__text__wrapper--normal { min-width: calc(0.8 * (var(--wrapper-width)) * 5 / 7); } .image-accordions--3 .slide__text__wrapper--wide { min-width: calc((var(--wrapper-width)) * 5 / 7); } .image-accordions--4 .slide__text__wrapper--narrow { min-width: calc(0.6 * (var(--wrapper-width)) * 5 / 8); } .image-accordions--4 .slide__text__wrapper--normal { min-width: calc(0.8 * (var(--wrapper-width)) * 5 / 8); } .image-accordions--4 .slide__text__wrapper--wide { min-width: calc((var(--wrapper-width)) * 5 / 8); } } @media only screen and (max-width: 1023px) { .image-accordions--1 .image-accordion { width: calc(var(--wrapper-width) + var(--gutter-mobile)); } } .image-accordion__text__wrapper { padding: var(--gutter) var(--gutter-mobile); word-break: break-word; } @media only screen and (min-width: 768px) { .image-accordion--no-animation .slide__text__wrapper { opacity: 0; transition: opacity 0.4s ease 0.6s; } } @media only screen and (min-width: 768px) { .image-accordion--no-animation.is-expanded .slide__text__wrapper { opacity: 1; } } @media only screen and (min-width: 1024px) { .image-accordion__text__wrapper { padding: var(--gutter); } } .image-accordion__text__content { overflow: hidden; } .image-accordion__text__heading>span, .image-accordion__text__content>span { display: block; overflow: hidden; } .image-accordion__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .section-image { background-color: var(--bg); } .section-image__container { position: relative; display: flex; align-items: center; } .section-image__image { object-fit: cover; width: auto; } @media only screen and (max-width: 767px) { .section-image__image { width: 100%; } } .section-image--stretch .section-image__image { width: 100%; } .section-image--right .section-image__container { justify-content: flex-end; } .section-image--center .section-image__container { justify-content: center; } .section-image--left .section-image__container { justify-content: flex-start; } .section-image .original-height { min-height: auto; } .full-height .section-image__image { height: var(--full-height); } .three-quarters-height .section-image__image { height: var(--three-quarters); } .two-thirds-height .section-image__image { height: var(--two-thirds); } .one-half-height .section-image__image { height: var(--one-half); } .one-third-height .section-image__image { height: var(--one-third); } .one-fifth-height .section-image__image { height: var(--one-fifth); } .seven-fifty-height .section-image__image { height: 750px; } .six-fifty-height .section-image__image { height: 650px; } .five-fifty-height .section-image__image { height: 550px; } .four-fifty-height .section-image__image { height: 450px; } .three-fifty-height .section-image__image { height: 350px; } .two-fifty-height .section-image__image { height: 250px; } .two-hundred-height .section-image__image { height: 200px; } .one-fifty-height .section-image__image { height: 150px; } .one-hundred-height .section-image__image { height: 100px; } @media only screen and (min-width: 768px) { .section-image--stretch .original-height .section-image__image { height: auto; } } /* Mobile height */ @media only screen and (max-width: 767px) { .original-height .section-image__image { height: 100%; } .original-height-mobile .section-image__image { height: auto; } .full-height-mobile .section-image__image { height: var(--full-height); } .three-quarters-height-mobile .section-image__image { height: var(--three-quarters); } .two-thirds-height-mobile .section-image__image { height: var(--two-thirds); } .one-half-height-mobile .section-image__image { height: var(--one-half); } .one-third-height-mobile .section-image__image { height: var(--one-third); } .one-fifth-height-mobile .section-image__image { height: var(--one-fifth); } .seven-fifty-height-mobile .section-image__image { height: 750px; } .six-fifty-height-mobile .section-image__image { height: 650px; } .five-fifty-height-mobile .section-image__image { height: 550px; } .four-fifty-height-mobile .section-image__image { height: 450px; } } .image-with-text { position: relative; display: flex; width: 100%; align-items: stretch; justify-content: center; overflow: hidden; background: var(--bg); } @media only screen and (max-width: 767px) { .image-with-text.full-height, .image-with-text.seven-fifty-height, .image-with-text.six-fifty-height, .image-with-text.five-fifty-height, .image-with-text.four-fifty-height, .image-with-text.three-fifty-height, .image-with-text.three-hundred-height, .image-with-text.two-fifty-height, .image-with-text.two-hundred-height, .image-with-text.one-fifty-height, .image-with-text.one-hundred-height { min-height: auto; } } @media only screen and (min-width: 768px) { .image-with-text--image-thirty .image-with-text__image { flex-basis: 30%; } } @media only screen and (min-width: 768px) { .image-with-text--image-thirty .image-with-text__content { flex-basis: 70%; } } @media only screen and (min-width: 768px) { .image-with-text--image-forty .image-with-text__image { flex-basis: 40%; } } @media only screen and (min-width: 768px) { .image-with-text--image-forty .image-with-text__content { flex-basis: 60%; } } @media only screen and (min-width: 768px) { .image-with-text--image-fifty .image-with-text__image, .image-with-text--image-fifty .image-with-text__content { flex-basis: 50%; } } @media only screen and (min-width: 768px) { .image-with-text--image-sixty .image-with-text__image { flex-basis: 60%; } } @media only screen and (min-width: 768px) { .image-with-text--image-sixty .image-with-text__content { flex-basis: 40%; } } @media only screen and (min-width: 768px) { .image-with-text--image-seventy .image-with-text__image { flex-basis: 70%; } } @media only screen and (min-width: 768px) { .image-with-text--image-seventy .image-with-text__content { flex-basis: 30%; } } .image-with-text__wrapper { display: flex; width: 100%; } .image-with-text__wrapper .wrapper, .image-with-text__wrapper .wrapper--full, .image-with-text__wrapper .wrapper--full-padded { position: relative; } .image-with-text__heading { margin-bottom: 12px; } .image-with-text__heading p { margin: 0; } .image-with-text__heading sup { top: -1.1em; font-size: calc(0.93rem * var(--adjust-heading)); line-height: 1; margin-left: 5px; } @media only screen and (max-width: 1439px) { .image-with-text__heading sup { top: -1em; font-size: calc(0.84rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .image-with-text__heading sup { font-size: calc(0.7rem * var(--adjust-heading)); } } .image-with-text__heading small { font-size: calc(0.93rem * var(--adjust-heading)); margin-left: calc(-1.3rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { .image-with-text__heading small { font-size: calc(0.84rem * var(--adjust-heading)); margin-left: calc(-1.2rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .image-with-text__heading small { font-size: calc(0.7rem * var(--adjust-heading)); margin-left: calc(-1rem * var(--adjust-heading)); } } .image-with-text__heading a, .image-with-text__buttons a { pointer-events: auto; } .image-with-text__top-image { position: relative; overflow: hidden; display: inline-block; margin-bottom: 10px; } .image-with-text__top-image-img { display: block; max-width: 100%; height: auto; margin: auto; } .image-with-text__text p:last-child { margin-bottom: 0; } .image-with-text__video-link { position: absolute; display: flex; top: 0; bottom: 0; margin: 0; align-items: center; justify-content: center; flex-direction: column; } @media only screen and (max-width: 1439px) { .image-with-text__video-link { width: calc(50vw - var(--gutter)); } } @media only screen and (max-width: 1023px) { .image-with-text__video-link { width: calc(40% + 20px); } } @media only screen and (max-width: 767px) { .image-with-text__video-link { width: 100%; margin: 0 0 125px; } } .image-with-text__video-link .play-button { width: 60px; height: 60px; } .image-with-text__image { height: 100%; width: 100%; overflow: hidden; } @media only screen and (max-width: 767px) { .image-with-text__image { flex-basis: 100%; width: 100%; margin: 0 0 -125px; padding-top: 100%; right: 0; height: auto; } } .image-with-text__image-bg { position: relative; width: 100%; height: 100%; overflow: hidden; background-position: center center; background-repeat: no-repeat; background-size: cover; } @media only screen and (max-width: 767px) { .image-with-text__image-bg { position: absolute; top: 0; left: 0; } } .image-with-text__image-bg .placeholder-svg, .image-with-text__image-bg .placeholder-svg-filled { position: absolute; top: 0; left: 0; right: 0; bottom: 0; max-width: none; width: 100%; } .image-with-text__content { position: relative; padding: calc(0.6666666667 * var(--gutter)); background: var(--bg); color: var(--text); border: var(--BORDER-WIDTH) solid var(--COLOR-BLACK-WHITE); overflow-wrap: break-word; pointer-events: none; } @media only screen and (max-width: 767px) { .image-with-text__content { width: 100%; margin: 0 var(--gutter-mobile); padding: var(--gutter-mobile); } } .image-with-text__content-items { position: relative; z-index: 3; } .image-with-text__content-items .subheading-text { position: relative; z-index: 1; } .image-with-text__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .image-with-text__items { display: flex; flex-flow: row wrap; align-items: center; height: 100%; } @media only screen and (max-width: 767px) { .image-with-text__items { margin: 0 calc(var(--gutter-mobile) * -1); padding: 0; min-height: 0; } } @media only screen and (min-width: 768px) { .image-with-text__items--overlay-left, .image-with-text__items--inline-right { flex-direction: row-reverse; } } .image-with-text__items--inline-right, .image-with-text__items--inline-left { position: relative; } @media only screen and (max-width: 767px) { .image-with-text__items--inline-right, .image-with-text__items--inline-left { margin: 0; } } @media only screen and (max-width: 767px) { .wrapper--full .image-with-text__items--overlay-left, .wrapper--full .image-with-text__items--overlay-right { margin: 0; } } @media only screen and (max-width: 767px) { .body--rounded-corners .image-with-text__items { border-radius: 0; overflow: unset; } } .image-with-text__items--overlay-right .image-with-text__image { right: var(--gutter); } @media only screen and (max-width: 767px) { .image-with-text__items--overlay-right .image-with-text__image { right: 0; } } .image-with-text__items--overlay-left .image-with-text__image { left: var(--gutter); } @media only screen and (max-width: 767px) { .image-with-text__items--overlay-left .image-with-text__image { left: 0; } } .image-with-text__items--inline-left .image-with-text__image, .image-with-text__items--inline-right .image-with-text__image { position: relative; } @media only screen and (max-width: 767px) { .image-with-text__items--inline-left .image-with-text__image, .image-with-text__items--inline-right .image-with-text__image { margin: 0; } } .image-with-text__items--overlay-left .image-with-text__image, .image-with-text__items--overlay-right .image-with-text__image { position: absolute; top: 0; bottom: 0; width: 85%; } @media only screen and (max-width: 767px) { .image-with-text__items--overlay-left .image-with-text__image, .image-with-text__items--overlay-right .image-with-text__image { position: relative; width: 100%; } } @media only screen and (min-width: 768px) { .image-with-text__items--overlay-right .image-with-text__image-bg { margin-left: 0; margin-right: -50%; } } @media only screen and (max-width: 767px) { .image-with-text__items--overlay-right .image-with-text__image-bg { margin-right: 0; } } .image-with-text__items--no-content.image-with-text__items--overlay-right .image-with-text__image, .image-with-text__items--no-content.image-with-text__items--overlay-left .image-with-text__image { width: calc(100% - 2 * var(--gutter)); } @media only screen and (max-width: 767px) { .image-with-text__items--no-content.image-with-text__items--overlay-right .image-with-text__image, .image-with-text__items--no-content.image-with-text__items--overlay-left .image-with-text__image { width: 100%; } } .wrapper--full .image-with-text__items--overlay-right .image-with-text__image { right: 0; } .wrapper--full .image-with-text__items--overlay-left .image-with-text__image { left: 0; } .image-with-text__items--no-content .image-with-text__video-link { position: absolute; top: 0; left: 0; width: 100%; } @media only screen and (min-width: 768px) { .image-with-text__items--overlay-left .image-with-text__video-link, .image-with-text__items--overlay-right .image-with-text__video-link { width: calc(var(--wrapper-width) / 2); } } .image-with-text__items--inline-right .image-with-text__video-link, .image-with-text__items--overlay-right .image-with-text__video-link { right: 0; } .image-with-text__items--inline-left .image-with-text__video-link, .image-with-text__items--overlay-left .image-with-text__video-link { left: 0; } .image-with-text__items--inline-left .image-with-text__video-link, .image-with-text__items--inline-right .image-with-text__video-link { width: 100%; margin: 0; } @media only screen and (min-width: 768px) { .wrapper--full .image-with-text__items--overlay-left .image-with-text__video-link, .wrapper--full .image-with-text__items--overlay-right .image-with-text__video-link { width: 50%; } } .image-with-text__items--inline-left .image-with-text__content, .image-with-text__items--inline-right .image-with-text__content { border: none; } @media only screen and (min-width: 768px) { .image-with-text__items--inline-left .image-with-text__content, .image-with-text__items--inline-right .image-with-text__content { height: 100%; display: inline-flex; flex-direction: column; justify-content: center; word-break: break-word; } } @media only screen and (max-width: 767px) { .image-with-text__items--inline-left .image-with-text__content, .image-with-text__items--inline-right .image-with-text__content { margin: 0; } .wrapper--full-padded .image-with-text__items--inline-left .image-with-text__content, .wrapper .image-with-text__items--inline-left .image-with-text__content, .wrapper--full-padded .image-with-text__items--inline-right .image-with-text__content, .wrapper .image-with-text__items--inline-right .image-with-text__content { padding: var(--gutter-mobile) 0 0; } } .wrapper .image-with-text__items--overlay-left .image-with-text__content, .wrapper .image-with-text__items--overlay-right .image-with-text__content { flex-basis: 50%; } @media only screen and (max-width: 767px) { .wrapper .image-with-text__items--overlay-left .image-with-text__content, .wrapper .image-with-text__items--overlay-right .image-with-text__content { flex-basis: auto; } } .wrapper--full-padded .image-with-text__items--overlay-left .image-with-text__content, .wrapper--full-padded .image-with-text__items--overlay-right .image-with-text__content, .wrapper--full .image-with-text__items--overlay-left .image-with-text__content, .wrapper--full .image-with-text__items--overlay-right .image-with-text__content { flex-basis: 33.333%; } @media only screen and (max-width: 1023px) { .wrapper--full-padded .image-with-text__items--overlay-left .image-with-text__content, .wrapper--full-padded .image-with-text__items--overlay-right .image-with-text__content, .wrapper--full .image-with-text__items--overlay-left .image-with-text__content, .wrapper--full .image-with-text__items--overlay-right .image-with-text__content { flex-basis: 50%; } } @media only screen and (max-width: 767px) { .wrapper--full-padded .image-with-text__items--overlay-left .image-with-text__content, .wrapper--full-padded .image-with-text__items--overlay-right .image-with-text__content, .wrapper--full .image-with-text__items--overlay-left .image-with-text__content, .wrapper--full .image-with-text__items--overlay-right .image-with-text__content { flex-basis: auto; } } /*================ Collection list ================*/ .list-collections-section { background-color: var(--bg); overflow: hidden; } .list-collections-section .grid { display: flex; flex-flow: row wrap; justify-content: flex-start; gap: 0; row-gap: calc(var(--grid-gutter) * 2); } @media only screen and (max-width: 767px) { .list-collections-section .grid--mobile { display: flex; flex-flow: row wrap; justify-content: flex-start; gap: 0; row-gap: var(--grid-gutter); } } .list-collections-section .carousel, .list-collections-section .grid { margin: 0 calc(-1 * var(--grid-gutter) / 2); } @media only screen and (max-width: 767px) { .list-collections-section .carousel--mobile { flex-wrap: nowrap; } } .list-collections-section .list-collections__item { position: relative; width: auto; padding: 0 calc(var(--grid-gutter) / 2); margin: 0; } .list-collections-section .section__header { margin-bottom: calc(var(--heading-margin) * 3 + var(--inner) / 2); } .list-collections-section--center .grid, .list-collections-section--center .grid--mobile, .list-collections-section--center .carousel--inactive { justify-content: center; } @media only screen and (max-width: 767px) { .list-collections-section--center .carousel--mobile { justify-content: flex-start; } } .list-collections__item__outer { position: relative; display: block; width: var(--image-width-mobile); } @media only screen and (min-width: 768px) { .list-collections__item__outer { width: var(--image-width); margin: 0 auto; } } .list-collections__item__image { display: block; position: relative; height: 0; padding-top: var(--height-mobile); -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; } .list-collections__item--square .list-collections__item__image { height: auto; aspect-ratio: 54/81; width: 100%; } @media only screen and (min-width: 768px) { .list-collections__item__image { padding-top: var(--height); } } .list-collections__item__image-bg { pointer-events: none; will-change: transform; } .list-collections__item__image__empty { display: block; width: 100%; height: 100%; object-fit: cover; } .list-collections__item__content { display: block; padding-top: var(--inner); text-align: center; } .list-collections__item__content--overlayed { position: absolute; z-index: 2; top: 0; right: 0; bottom: 0; left: 0; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 25px; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .list-collections__item__title { font-size: calc(1rem * var(--adjust-heading)); margin: 0; color: inherit; word-break: break-word; } .list-collections__item__overlayed { position: absolute; top: 0; left: 50%; width: 100%; transform: translateX(-50%); height: 100%; overflow: hidden; display: flex; align-items: center; } @media only screen and (max-width: 479px) { .list-collections__item__overlayed { margin-left: calc(var(--grid-gutter) / 2); width: calc(100% - var(--grid-gutter)); } } .list-collections__item .list-collections__item__image-bg:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--overlay); opacity: var(--overlay-opacity); z-index: 1; } .list-collections__item--circle .list-collections__item__image, .list-collections__item--circle .list-collections__item__image-bg { border-radius: 50%; } .no-touch .list-collections__item__image-bg { transition: transform 2s; } .no-touch .list-collections__item:hover .list-collections__item__image-bg { transform: scale(1.1); } @media only screen and (max-width: 767px) { .list-collections-section--grid .list-collections-section__container { overflow: initial; } } @media only screen and (max-width: 767px) { .list-collections-section .carousel--mobile { margin-top: -15px; margin-bottom: -15px; padding-top: 15px; padding-bottom: 15px; } } @media only screen and (max-width: 767px) { .list-collections-section--carousel-mobile .list-collections-section__container { position: relative; } .list-collections-section--carousel-mobile .list-collections-section__container:before { content: ""; position: absolute; top: 0; bottom: 0; right: 0; z-index: 5; width: var(--gutter-mobile); } } @media only screen and (max-width: 767px) { .list-collections-section--carousel-mobile .list-collections-section__container.is-last-slide-visible:before { right: auto; left: 0; } } /* Carousel */ .list-collections-section--carousel .wrapper--full .list-collections-section__container { margin: 0; } .list-collections-section--carousel .flickity-viewport:before, .list-collections-section--carousel .flickity-viewport:after { content: ""; position: absolute; top: 0; z-index: 2; width: 50vw; height: 100%; } .list-collections-section--carousel .flickity-viewport:before { right: 100%; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .list-collections-section--carousel .flickity-viewport:before { display: none; right: auto; left: calc(var(--gutter-mobile) * -1); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .list-collections-section--carousel .is-last-slide-visible .flickity-viewport:before { display: block; } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .list-collections-section--carousel .is-last-slide-visible .flickity-viewport:after { display: none; } } .list-collections-section--carousel .flickity-viewport:after { left: 100%; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .list-collections-section--carousel .flickity-viewport:after { right: calc(var(--gutter-mobile) * -1); left: auto; } } .list-collections-section--carousel .flickity-button { z-index: 5; background: var(--bg); } /* NO JS */ @media only screen and (min-width: 768px) { .no-js .list-collections-section .carousel { margin-bottom: calc(var(--grid-gutter) * -1); } } @media only screen and (min-width: 768px) { .no-js .list-collections-section .carousel .list-collections__item { margin-bottom: var(--grid-gutter); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .no-js .list-collections-section .carousel .list-collections__item { width: calc(50% - var(--grid-gutter) / 2); } } @media only screen and (max-width: 767px) { .no-js .list-collections-section .carousel--mobile .list-collections__item { margin-right: var(--grid-gutter) !important; margin-bottom: 0; } } @media only screen and (max-width: 767px) { .no-js .list-collections-section .carousel--mobile .list-collections__item:last-child { margin-right: 0 !important; } } @media only screen and (max-width: 767px) { .no-js .list-collections-section .grid--mobile { display: grid; gap: var(--grid-gutter); } } @media only screen and (max-width: 767px) { .no-js .list-collections-section .grid--mobile .carousel__item { margin-bottom: 0; } } .locations { background-color: var(--bg); } .locations .flickity-button { position: relative; margin-bottom: calc(var(--gutter) / 2); } @media only screen and (min-width: 768px) { .locations .flickity-button { margin-top: 50px; margin-bottom: 0; } } .locations .flickity-prev-next-button { transform: none; transform-origin: center; opacity: 1; visibility: visible; } .locations .flickity-prev-next-button.previous { left: auto; margin-right: var(--grid-gutter); } .locations .flickity-prev-next-button.next { right: auto; } .locations .flickity-enabled:hover>.flickity-prev-next-button:not(:disabled) { transform: none; } .locations .flickity-enabled:hover>.flickity-prev-next-button:not(:disabled):hover { transform: scale(1.12); } .locations .flickity-slider .location__image { width: 100%; } .locations .flickity-slider .location__store { width: 100%; opacity: 0 !important; } .locations .flickity-slider .location__store.is-selected { opacity: 1 !important; } .locations .flickity-slider .location__store { transition: opacity 0.5s, z-index 0.5s, transform 0s 0.5s; } .locations .flickity-slider .location__store.is-selected { transition: opacity 1s, z-index 1s, transform 1s; } @media only screen and (min-width: 768px) { .locations__wrapper { display: grid; align-items: center; grid-template-columns: repeat(2, minmax(0, 1fr)); } } .locations__info { padding-right: 60px; } .locations__info .section__header { margin: 0 0 30px; } .locations__info-heading:last-child { margin: 0; padding-bottom: 10px; } .locations__info-subheading { margin: 0 0 16px; } .location__store { width: 100%; } @media only screen and (max-width: 1023px) { .location__store { padding-bottom: calc(var(--gutter) / 2); } } .location__store p { margin: 0; } .locations__gallery { position: relative; } .location__image { width: 100%; position: absolute; top: 0; overflow: hidden; } .location__image:first-child { position: relative; } .location__image-bg { display: block; position: relative; width: 100%; height: 0; padding-top: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; } .location__image-bg.placeholder-svg--overlayed { padding-top: 0; height: 100%; } .no-js .location__image-bg .img-object-cover { position: absolute; top: 0; left: 0; } /*================ Shop the look ================*/ .look { --hotspot: var(--white); display: flex; flex: 1; align-items: stretch; background-color: var(--bg); } @media only screen and (max-width: 767px) { .look { min-height: 0; height: auto; flex-wrap: wrap; } } .look .flickity-viewport, .look .product-grid-item { width: 100%; } .look .flickity-prev-next-button { background-color: var(--bg); } @media only screen and (max-width: 767px) { .look .flickity-prev-next-button { display: none; } } @media only screen and (min-width: 768px) { .look .flickity-page-dots { position: relative; padding-top: 25px; display: flex; justify-content: center; bottom: 0; } } @media only screen and (min-width: 768px) { .look .drawer__close-button, .look .drawer__secondary-close-button { display: none; } } .aos-initialized .look .aos-animate.pointer { opacity: 0.8; } .look__wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gutter-mobile); position: relative; } @media only screen and (min-width: 1024px) { .look__wrapper { gap: var(--gutter); } } @media only screen and (max-width: 767px) { .look__wrapper { grid-template-columns: minmax(0, 1fr); } } .look__column.aos-animate .look__image { transition: transform 0.8s ease; transform: scale(1.05); } .look__column__drawer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; display: flex; flex-direction: column; opacity: 0; visibility: hidden; } @media only screen and (min-width: 768px) { .look__column__drawer { position: initial; overflow: initial; transform: none; justify-content: center; opacity: 1; visibility: visible; height: auto; } } @media only screen and (max-width: 767px) { .look__column__drawer { margin-left: calc(-1 * var(--gutter-mobile)); } } @media only screen and (max-width: 767px) { .look__column__drawer__inner { padding: var(--gutter-mobile); position: relative; overflow-x: hidden; overflow-y: auto; } } .look__slider .look__column__drawer__inner { overflow: initial; } .look__column__drawer__products { margin: 60px auto 20px; } @media only screen and (min-width: 768px) { .look__column__drawer__products { height: 100%; margin: 0; } } .look__column--image { padding-top: 100%; overflow: hidden; } @media only screen and (min-width: 768px) { .look__column--image { position: relative; height: 0; padding-top: var(--aspect-ratio); } } @media only screen and (max-width: 767px) { .look__column--image { position: relative; } } @media only screen and (max-width: 767px) { .look__column--slider { grid-row: 1; width: 100%; min-height: 0; border: none; } } .look__content { display: flex; flex-flow: row wrap; } .look__heading { margin-bottom: 0; } .look__text { width: 100%; color: var(--text); } .look__text p { margin-top: 0; } @media only screen and (min-width: 768px) { .look__text { padding: 0 0 calc(var(--gutter) / 2); } } .look__image { align-self: flex-start; } .look__image .placeholder-svg-filled { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media only screen and (max-width: 767px) { .look__image { height: 0; padding-bottom: 100%; } .no-js .look__image { height: 100%; padding: 0; } } .look__column__button { width: 100%; } @media only screen and (min-width: 768px) { .look__column__button { display: none; } } .look__slide { width: 50%; } .flickity-enabled .look__slide { width: calc(50% - var(--gutter-mobile) / 2); margin-right: var(--gutter-mobile); } @media only screen and (min-width: 768px) { .flickity-enabled .look__slide { overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .flickity-enabled .look__slide::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .flickity-enabled .look__slide:hover { height: 100%; } } @media only screen and (min-width: 1024px) { .flickity-enabled .look__slide { width: calc(50% - var(--gutter) / 2); margin-right: var(--gutter); } } @media only screen and (max-width: 767px) { .look__slider .look__slide { width: 100%; } } @media only screen and (min-width: 768px) { .look__slider:not(.flickity-enabled) { height: auto; display: flex; justify-content: center; gap: var(--gutter-mobile); } } @media only screen and (min-width: 1024px) { .look__slider:not(.flickity-enabled) { gap: var(--gutter); } } @media only screen and (min-width: 768px) { .text-left .look__slider:not(.flickity-enabled) { justify-content: flex-start; } } /*================ Pointer ================*/ .pointer { /* stylelint-disable-next-line */ --look-animation: pulseInOutSubtle 2.5s ease infinite; position: absolute; z-index: 0; width: 32px; height: 32px; border: var(--BORDER-WIDTH) solid var(--hotspot); border-radius: 50%; transform: translate(-50%, -50%); } .pointer:after { content: ""; pointer-events: none; position: absolute; top: -3px; left: -3px; right: -3px; bottom: -3px; border-radius: 50%; background: var(--hotspot); opacity: 0; z-index: -1; will-change: transform, opacity; animation: var(--look-animation); } .aos-initialized .look .aos-animate.pointer:hover, .aos-initialized .look .aos-animate.pointer:focus-within, .aos-initialized .look .aos-animate.pointer--selected { transform: scale(1.25); } .pointer--selected:after { animation: none; } .pointer.is-loading { pointer-events: none; } .pointer__inner { display: block; pointer-events: none; width: 10px; height: 10px; margin: auto; border-radius: 50%; background-color: var(--hotspot); transition: transform 0.3s ease-in-out; } .pointer--selected .pointer__inner, .pointer:hover .pointer__inner, .pointer:focus-within .pointer__inner { transform: scale(0.9); } /*================ Quick View ================*/ .look__quick-view-items { position: relative; } .look__quick-view-item { position: absolute; top: 0; left: 0; z-index: -1; width: 100%; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 0s, visibility 0s linear 0.4s; } .look__quick-view-item.is-active { position: relative; top: auto; left: auto; z-index: unset; pointer-events: auto; transition: opacity 0.4s, visibility 0s; opacity: 1; visibility: visible; } .modal { transform: translateY(-20px); background-color: var(--bg); bottom: 0; color: var(--text); display: none; left: 0; opacity: 0; overflow: hidden; position: fixed; right: 0; top: 0; } .modal--is-active { transform: translateY(0); display: block; opacity: 1; overflow: hidden; } .modal__inner { transform-style: preserve-3d; height: 100%; } .modal__centered { transform: translateY(-50%); position: relative; top: 50%; } .modal__close { border: 0; padding: 55px; position: fixed; top: 0; right: 0; z-index: 2; } .modal__close .icon { font-size: calc(20 / (1rem * var(--adjust-body)) * 1em); } .mosaic { --inner-gap: 10px; background: var(--bg); position: relative; } .mosaic__grid { display: flex; flex-wrap: wrap; justify-content: center; overflow: hidden; } .mosaic__item__heading { position: relative; color: inherit; margin: 0 0 var(--inner-gap); line-height: 1; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .mosaic__item__heading { font-size: calc(1.75rem * var(--adjust-heading)); } } .mosaic__item__subheading { margin: 0 0 var(--inner-gap); } .mosaic__item__text, .mosaic__item__price { margin-bottom: var(--inner-gap); } .mosaic__item__buttons { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; margin-right: calc(var(--inner-gap) * -1); } .mosaic__item__content--bottom-left .mosaic__item__buttons, .mosaic__item__content--top-left .mosaic__item__buttons, .mosaic__item__content--left .mosaic__item__buttons { justify-content: flex-start; } .mosaic__item__content--right .mosaic__item__buttons, .mosaic__item__content--bottom-right .mosaic__item__buttons, .mosaic__item__content--top-right .mosaic__item__buttons { justify-content: flex-end; } .mosaic__item__btn { display: inline-flex; align-items: center; justify-content: center; margin: var(--inner-gap) var(--inner-gap) 0 0; } .mosaic__item { --bg: transparent; display: flex; width: var(--block-width); height: auto; overflow: hidden; padding: calc(var(--grid-gutter) / 2); } @media only screen and (max-width: 767px) { .mosaic__item { padding: calc(var(--grid-gutter) / 2) 0; } } .mosaic__item.original-height { align-self: center; } .mosaic__item__inner { position: relative; flex: 1; display: flex; height: auto; overflow: hidden; background: var(--bg); transform: translateZ(0); } .original-height .mosaic__item__inner { display: grid; grid-template-columns: minmax(0, 1fr); } .original-height .mosaic__item__inner:before { content: ""; padding-top: var(--image-ratio); width: 100%; height: 100%; grid-row-start: 1; grid-column-start: 1; border-radius: inherit; background-color: var(--bg-darken); transition: opacity 0.3s ease; opacity: 0.2; } .mosaic__item__image { position: absolute; top: 0; left: 0; bottom: 0; right: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; } .mosaic__item__image .svg-placeholder { display: block; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); } .mosaic__item__image .svg-placeholder--image { width: 180%; height: 180%; } .mosaic__item__image:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--overlay); opacity: var(--overlay-opacity); } .mosaic__item__image__link { display: flex; min-width: 100%; min-height: 100%; } .mosaic__item__content { position: relative; flex: 1; padding: calc(var(--inner) * 1.5); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; line-height: 1.5; overflow: hidden; grid-row-start: 1; grid-column-start: 1; } @media only screen and (min-width: 768px) { .mosaic__item__content { padding: calc(var(--inner) * 2); } } @media only screen and (min-width: 1024px) { .mosaic__item__content { padding: calc(var(--inner) * 3); } } .mosaic__item__link, .mosaic__item__content--nolink { position: relative; } /* Mosaic item content modifiers */ .mosaic__item__content--center { align-items: center; text-align: center; } .mosaic__item__content--right, .mosaic__item__content--bottom-right, .mosaic__item__content--top-right { align-items: flex-end; text-align: right; } .mosaic__item__content--top-right, .mosaic__item__content--top-left { justify-content: flex-start; } .mosaic__item__content--bottom-left, .mosaic__item__content--bottom-right { justify-content: flex-end; } @media only screen and (min-width: 1024px) { .mosaic--multiple-blocks .mosaic__item__content { padding: calc(var(--inner) * 1.5); } } @media only screen and (max-width: 767px) { .mosaic--single-block .wrapper--no-full .mosaic__item { width: calc(100vw - var(--scrollbar-width) - var(--gutter-mobile)); } } /* Mobile Slider */ @media only screen and (max-width: 767px) { .mosaic--mobile-slider .mosaic__grid { --item-width: calc(var(--wrapper-width) - var(--gutter-mobile)); margin: 0 calc(var(--gutter-mobile) * -1); display: flex; flex-flow: row nowrap; justify-content: flex-start; gap: 0; overflow-x: scroll; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scroll-padding: var(--gutter-mobile); padding-left: var(--gutter-mobile); scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .mosaic--mobile-slider .mosaic__grid::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .mosaic--mobile-slider .mosaic__grid:after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } @media only screen and (max-width: 767px) { .mosaic--mobile-slider .mosaic__item { padding: 0; width: var(--item-width); flex: 0 0 auto; scroll-snap-align: start; margin-right: var(--gutter-mobile); } .mosaic--mobile-slider .mosaic__item:last-child { margin-right: 0; } } @media only screen and (max-width: 767px) { .mosaic--mobile-slider .mosaic__wrapper { --wrapper-width: calc(100vw - var(--scrollbar-width) - var(--gutter-mobile) * 2); } } @media only screen and (max-width: 767px) { .mosaic--mobile-slider .wrapper--full { padding: 0 var(--gutter-mobile); } } @media only screen and (max-width: 767px) { .mosaic--mobile-slider .wrapper--no-full .mosaic__grid:after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } /* Mobile Grid */ @media only screen and (max-width: 767px) { .mosaic--mobile-grid .mosaic__item { flex: 0 1 100%; min-width: 0; height: auto; } } /* No spacing */ @media only screen and (max-width: 767px) { .mosaic--no-spacing .mosaic__item { padding: 0; } } @media only screen and (max-width: 767px) { .mosaic--no-spacing .wrapper--full, .mosaic--no-spacing .mosaic__grid { gap: 0; } } /* No spacing + Single block */ @media only screen and (max-width: 767px) { .mosaic--no-spacing.mosaic--single-block .mosaic__grid { padding: 0 var(--gutter-mobile); overflow: hidden; } } /* No spacing + Mobile grid + Single block */ @media only screen and (max-width: 767px) { .mosaic--no-spacing.mosaic--mobile-grid.mosaic--single-block .mosaic__grid { padding: 0; } } /* No spacing + Mobile slider */ @media only screen and (max-width: 767px) { .mosaic--no-spacing.mosaic--mobile-slider .mosaic__item { --grid-gutter: 0; } } @media only screen and (max-width: 767px) { .mosaic--no-spacing.mosaic--mobile-slider .wrapper--full { --grid-gutter: var(--gutter-mobile); } } /* No spacing + Mobile slider + Single block */ @media only screen and (max-width: 767px) { .mosaic--no-spacing.mosaic--mobile-slider.mosaic--single-block .mosaic__item { padding: 0; width: calc(100vw - var(--scrollbar-width) - var(--gutter-mobile) * 2); } } /* Add spacing */ @media only screen and (min-width: 768px) { .mosaic--spacing .wrapper--full .mosaic__grid { margin: 0 var(--grid-gutter); } } /* Add spacing + Single block */ .mosaic--spacing.mosaic--single-block .wrapper--full .mosaic__grid { margin: 0 var(--grid-gutter); } @media only screen and (max-width: 767px) { .mosaic--spacing.mosaic--single-block .wrapper--full .mosaic__grid { margin: 0; padding: 0; overflow: visible; } } /* Add spacing + Mobile slider + Single block */ @media only screen and (max-width: 767px) { .mosaic--spacing.mosaic--mobile-slider.mosaic--single-block .mosaic__item { width: calc(100vw - var(--scrollbar-width) - 2 * var(--grid-gutter)); } } /* Add spacing + Mobile slider + Multiple blocks */ @media only screen and (max-width: 767px) { .mosaic--spacing.mosaic--mobile-slider.mosaic--multiple-blocks .wrapper--full>.mosaic__grid:after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } @media only screen and (max-width: 767px) { .mosaic--spacing.mosaic--mobile-slider.mosaic--multiple-blocks .wrapper--full .mosaic__item { width: calc(100vw - var(--scrollbar-width) - 3 * var(--grid-gutter)); } } /* Add spacing + Mobile grid + Multiple blocks */ @media only screen and (max-width: 767px) { .mosaic--spacing.mosaic--mobile-grid.mosaic--multiple-blocks .wrapper--full .mosaic__item { padding: calc(var(--gutter-mobile) / 2) 0; } } /*================ Newsletter ================*/ .newsletter { width: 100%; } /*=== Newsletter section ===*/ .newsletter-section { position: relative; } .newsletter-section .wrapper, .newsletter-section .wrapper--full-padded, .newsletter-section .wrapper--narrow { height: 100%; position: relative; z-index: 10; } .newsletter-section .shopify-block { width: 100%; } .newsletter-section__bg { background-color: var(--bg); } .newsletter-section__content__wrapper { display: flex; flex-flow: row wrap; height: 100%; } .newsletter-section__content { flex-basis: 100%; } .newsletter-section__entry h2 { color: inherit; } /*=== Newsletter form ===*/ .newsletter-form .form-success, .newsletter-form .errors { display: none; } .newsletter-form .input-group__field, .newsletter-form .input-group__btn--icon { background: transparent; } .newsletter-form.has-error .errors { display: inline-block; } .newsletter-form.has-success .form-success { display: inline-block; } .newsletter-form.has-success .input-group__item:not(.input-group__item--text) { display: none; } .search-result-view { display: flex; align-items: center; flex-wrap: wrap; } .search-result-view .components-search--query { margin-right: 6px; } .search-result-view .findify-query-bold { font-weight: 900; text-transform: uppercase; } .search-result-view span { font-size: 14px; } .search-result-view button { display: flex; align-items: center; margin-right: 60px; position: relative; display: none; } .search-result-view button:after { content: " "; position: absolute; right: -30px; top: 0; bottom: 0; width: 1px; background: #e2e2e2; } .search-result-view button span { font-family: Karla; font-weight: 700; font-size: 14px; line-height: normal; text-transform: uppercase; color: #121212; } .search-result-view button svg { margin-right: 6px; width: 16px; height: 16px; } .newsletter-form .errors, .newsletter-form .form-success { margin: var(--form-margin) 0; text-align: left; } @media only screen and (max-width: 479px) { .newsletter-form .errors, .newsletter-form .form-success { width: 100%; flex-basis: 100%; text-align: center; } } @media only screen and (min-width: 768px) { .newsletter-form .input-group--inline~.form-success { margin: 0; } } .input-group__fields { display: flex; flex: 1 1 auto; padding: 0; flex-flow: row wrap; } @media only screen and (min-width: 1024px) { .input-group__fields { max-width: 280px; } } @media only screen and (min-width: 768px) { .input-group__fields { flex-basis: 50%; } } @media only screen and (min-width: 1440px) { .input-group__fields { flex-basis: 25%; } } .input-group__fields--name { flex-basis: 100%; } @media only screen and (min-width: 1024px) { .input-group__fields--name { max-width: 560px; } } .input-group__fields--name .errors, .input-group__fields--first-last-name .errors, .input-group__fields--name .form-success, .input-group__fields--first-last-name .form-success { margin: calc(var(--form-margin) / 2); } .input-group__fields--first-last-name { flex-basis: 100%; } @media only screen and (min-width: 1024px) { .input-group__fields--first-last-name { max-width: 840px; } } .input-group__btn--icon { height: 100%; width: 54px; max-width: 54px; color: var(--text); background: transparent; border: var(--BORDER-WIDTH) solid var(--text); } .input-group__btn--icon .icon-select { transition: transform 0.3s ease; } .input-group__btn--icon::before { content: none; } .input-group__btn--icon:hover { background: transparent; } .input-group__btn--icon:hover .icon-select { transform: translate(5px); } .input-group__field { display: block; width: 100%; border: var(--BORDER-WIDTH) solid var(--text); border-radius: var(--RADIUS); padding: 12px 0 12px 20px; } .input-group__field::-webkit-input-placeholder { color: var(--text); } .input-group__field::-moz-placeholder { color: var(--text); } .input-group__field:-ms-input-placeholder { color: var(--text); } .input-group__field:-moz-placeholder { color: var(--text); } .mailer-response { display: none; } /*=== Newsletter Layouts ===*/ .align--middle-split { align-items: flex-start; /* Newsletter section */ /* Newsletter form */ } .align--middle-split .newsletter { width: auto; flex-basis: 50%; } .align--middle-split .newsletter-section__entry { text-align: left; flex: 1; padding-right: var(--gutter); } @media only screen and (max-width: 767px) { .align--middle-split .newsletter-section__entry { padding: 0 0 var(--gutter-mobile); max-width: 100%; } } @media only screen and (min-width: 768px) { .align--middle-split .newsletter-section__content { display: flex; flex-flow: row wrap; justify-content: center; } } .align--middle-split .newsletter-form { text-align: center; } .align--middle-split .newsletter-form .input-group { justify-content: flex-start; } .align--middle-split .input-group--inline { margin: auto; } @media only screen and (min-width: 768px) { .align--middle-split .input-group__fields, .align--middle-split .input-group__item { max-width: 100%; } } @media only screen and (min-width: 768px) { .align--middle-split .input-group__item--btn-width { flex-basis: 100%; max-width: 100%; } } .align--middle-split .input-group--inline .input-group__item--btn { flex-basis: 54px; max-width: 54px; } @media only screen and (min-width: 768px) { .align--middle-right .form-success { justify-content: flex-end; } } /*================ Overlapping images ================*/ .overlapping-images { --image-offset: 50px; --image-offset-negative: calc(var(--image-offset) * -1); overflow: hidden; background: var(--bg); } .overlapping-images__block { margin: 0 auto; } @media only screen and (min-width: 768px) { .overlapping-images__block { display: grid; align-items: center; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gutter); } } @media only screen and (min-width: 1440px) { .overlapping-images__block { gap: calc(var(--gutter) * 2); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .overlapping-images__block { gap: calc(var(--gutter) / 2); } } @media only screen and (min-width: 768px) { .overlapping-images__block--reverse .overlapping-images__images { order: 1; } } @media only screen and (min-width: 1440px) { .overlapping-images__block--reverse .overlapping-images__content { margin: 0 0 0 auto; } .overlapping-images__block--reverse .overlapping-images__images { margin: 0 auto 0 0; } } .overlapping-images__text { font-size: calc(1.1rem * var(--adjust-body)); margin: 0; } .overlapping-images__images { position: relative; width: 100%; margin: 0 auto; padding: 0; } @media only screen and (min-width: 1440px) { .overlapping-images__images { margin: 0 0 0 auto; } } .overlapping-images__image { position: relative; flex: 1 0 50%; overflow: hidden; max-height: 560px; background-color: var(--bg); } .overlapping-images__image .placeholder-svg--overlayed { border: var(--BORDER-WIDTH) solid var(--bg); } .overlapping-images__images-inner { width: calc(100% + var(--image-offset)); display: flex; flex-flow: row wrap; align-items: flex-start; margin: 0 calc(var(--image-offset-negative) / 2); } @media only screen and (max-width: 767px) { .overlapping-images__images-inner { width: calc(100% + var(--gutter-mobile) * 2); margin-left: calc(-1 * var(--gutter-mobile)); margin-right: calc(-1 * var(--gutter-mobile)); } } .overlapping-images__images-inner--single { width: 100%; margin: 0; } .overlapping-images__image--primary { z-index: 1; margin-top: var(--image-offset); left: calc(var(--image-offset) / 2); } .overlapping-images__image--secondary { left: calc(var(--image-offset-negative) / 2); } .overlapping-images__images--single-mobile { padding-bottom: 0; } @media only screen and (max-width: 767px) { .overlapping-images__images--single-mobile .overlapping-images__images-inner { width: 100%; margin-left: 0; } .overlapping-images__images--single-mobile .overlapping-images__image--primary { left: auto; margin: 0; } .overlapping-images__images--single-mobile .overlapping-images__image--secondary { display: none; } } .overlapping-images__image-bg { position: relative; max-height: inherit; } .overlapping-images__image-bg .placeholder-svg-filled { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .overlapping-images__content { max-width: 600px; margin: 0 auto; } @media only screen and (min-width: 1440px) { .overlapping-images__content { margin: 0 auto 0 0; } } @media only screen and (max-width: 767px) { .overlapping-images__content { padding-top: 30px; margin-bottom: -15px; } } .overlapping-images__heading { line-height: 1; } /*================ Page template ================*/ .page-title { padding-bottom: 25px; } .page-template { padding: 0 0 var(--gutter); } .page-customer { padding: var(--gutter) 0; } .shopify-challenge__container { padding: var(--gutter) var(--gutter-mobile); } @media only screen and (min-width: 480px) { .shopify-challenge__container { padding: var(--gutter) 0; } } .shopify-challenge__container input.shopify-challenge__button { margin-top: 20px; } .page-customer .is-hidden { display: none; } .no-js .page-customer .is-hidden { display: block; } /*================ 404 ================*/ #four-oh-four { padding: 50px 0; } #four-oh-four h1 { font-size: calc(4.5rem * var(--adjust-heading)); text-align: center; } #four-oh-four p { font-size: calc(1.5rem * var(--adjust-body)); } /*================ Password ================*/ .password-page__container { height: var(--full-height); width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; } .password-page__wrapper { display: flex; align-items: center; justify-content: center; height: var(--full-height); width: 100%; margin: 0 auto; padding-top: var(--gutter); text-align: center; background-color: rgba(0, 0, 0, 0.5); } .password-page__wrapper h1, .password-page__wrapper h3, .password-page__wrapper p, .password-page__wrapper small, .password-page__wrapper i, .password-page__wrapper a { color: var(--white); } .password-page__wrapper h1 { margin-bottom: 0; } @media only screen and (min-width: 768px) { .password-page__signup-form__item { width: 50%; } } .toggle-wrapper { position: absolute; top: 20px; right: 20px; padding-bottom: 50px; } #CustomerSignup, #AdminLogin { padding-bottom: 20px; } .customer-signup-button, .password-login-button { vertical-align: top; line-height: 26px; padding: 13px 20px; } .signup-input, .password-input { background-color: var(--input-bg); border: none; padding: 14px 20px; margin: 0 2px; } .signup-input:hover, .password-input:hover { border: none; } @media only screen and (max-width: 479px) { .signup-input, .password-input { margin: 10px auto; width: 100%; } } .template-password .btn, .template-password .shopify-payment-button__button--unbranded { display: inline-block; } .password-page__socials .social-sharing-wrapper { margin: calc(var(--gutter) / 2) -8px; justify-content: center; } .password-page__socials .social-sharing-wrapper a { margin-left: 8px; margin-right: 8px; } .password-page__powered-by-text { margin: calc(var(--gutter) / 2) 0 0; } .storefront-password-form { display: none; } .password-page__logo { height: auto; } noscript .password-page__logo { display: none; } .password-page__background.no-js-image { z-index: -1; } /*================ Popup ================*/ .popup { --inner: 40px; position: fixed; top: 0; bottom: 0; left: 0; width: calc(100vw - var(--scrollbar-width)); z-index: 9000; color: var(--text); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.5s ease, visibility 0s linear 0.5s; } body.notification-visible .popup.popup--visible { opacity: 0; visibility: hidden; } @media only screen and (max-width: 479px) { .popup { --inner: 20px; } } .popup .input-group--inline { margin-bottom: var(--form-margin); } @media only screen and (min-width: 1440px) { .popup .input-group__item { flex-basis: 280px; } } @media only screen and (min-width: 1440px) { .popup .input-group--inline .input-group__item--btn { flex-basis: 54px; } } .popup .input-group__btn, .popup .input-group__field { width: 100%; max-width: 100%; height: 47px; font-size: calc(0.875rem * var(--adjust-body)); font-weight: var(--FONT-WEIGHT-BODY); line-height: 1.3575; padding-top: 12px; padding-bottom: 12px; } .popup .disclaimer { font-size: calc(0.75rem * var(--adjust-body)); color: var(--text-alpha-50); flex-basis: 100%; max-width: 100%; align-self: center; margin: 0; } .popup .disclaimer p { font-size: inherit; margin: 0; } .popup .disclaimer a:hover { color: var(--text); } .popup .disclaimer--inline { margin: 0; } @media only screen and (min-width: 1024px) { .popup .disclaimer--inline { flex-basis: 50%; } } .popup--visible { opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; } .popup--visible .popup__body { transform: translateY(0); } .popup--visible .popup__underlay, .popup--bar.popup--expanded .popup__underlay { opacity: 0.2; visibility: visible; transition-delay: 0s; pointer-events: auto; } .popup__close { display: flex; align-items: center; justify-content: center; position: absolute; top: 8px; right: 8px; width: 40px; height: 40px; z-index: 20; padding: 12px; cursor: pointer; } .popup__close:hover .icon { transform: rotate(90deg); } .popup__close .icon { width: 100%; height: 100%; transition: transform 0.3s ease; } @media only screen and (min-width: 768px) { .popup__close { top: 12px; right: 12px; } } .popup__underlay { position: fixed; top: 0; left: 0; bottom: 0; width: calc(100vw - var(--scrollbar-width)); z-index: 1; background: var(--black); opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s linear 0.3s; pointer-events: none; } .popup__wrapper { display: flex; height: 100%; max-height: 100vh; justify-content: center; flex-direction: column; } @media only screen and (max-width: 767px) { .popup__wrapper { justify-content: flex-end; } } .popup__body { position: relative; overflow-y: auto; width: calc(100% - var(--gutter-mobile)); max-width: 480px; max-height: 90vh; background: var(--bg); z-index: 5; margin-left: auto; margin-right: auto; transform: translateY(50px); transition: transform 0.5s ease; } @media only screen and (min-width: 768px) { .popup__body { max-width: 740px; } } .popup__form { max-width: 100%; } @media only screen and (min-width: 768px) { .popup__form { max-width: 430px; margin-left: auto; margin-right: auto; } } .popup__toggle { position: relative; display: flex; flex-flow: row wrap; align-items: center; padding: 10px 32px 10px 0; min-height: 50px; line-height: 20px; border-radius: 0; color: var(--text); font-size: var(--adjust-body); text-align: left; max-width: calc(100% - 60px); } .popup__toggle strong { font-size: calc(1.2rem * var(--adjust-body)); font-weight: var(--FONT-WEIGHT-BODY); line-height: 30px; padding-right: var(--inner); } @media only screen and (max-width: 767px) { .popup__toggle { font-size: calc(0.815rem * var(--adjust-body)); } .popup__toggle strong { padding-right: 0; display: block; } } .popup__toggle__icon { position: absolute; top: 0; right: 0; width: 14px; height: 14px; margin: 18px; border-radius: 50%; } .popup__toggle__icon .icon { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: opacity 0.3s ease, transform 0.3s ease; } .popup .icon-toggle-minus { opacity: 0; } .popup__toggle:hover .icon-toggle-plus { transform: rotate(90deg); } .popup--expanded .icon-toggle-plus { opacity: 0; transform: rotate(180deg); } .popup--expanded .icon-toggle-minus { opacity: 1; transform: rotate(180deg); } .popup__toggle__text { display: inline-flex; align-items: center; flex-wrap: wrap; padding-right: 15px; } .popup__container { height: 100%; } @media only screen and (min-width: 768px) { .popup__container { display: flex; flex-wrap: wrap; } } @media only screen and (min-width: 768px) { .popup__image, .popup__content { display: flex; align-items: center; justify-content: center; flex: 1 0 50%; } } .popup__content { flex-direction: column; } .popup__inner { margin: 0 auto; padding: var(--inner) var(--gutter-mobile); } @media only screen and (min-width: 1024px) { .popup__inner { padding: var(--inner); } } .popup__title { color: var(--text); } .popup__description { font-size: calc(0.9375rem * var(--adjust-body)); } .popup__description p { margin-top: 0; } .popup__image { overflow: hidden; position: relative; } .popup__image__img { display: block; width: 100%; height: 100%; background: no-repeat center center/cover; } .popup--no-image { text-align: center; } .popup--no-image .popup__inner { max-width: 600px; } .popup--no-image .popup__body { max-width: 650px; } .popup--no-image .input-group__item { flex-basis: 100%; } @media only screen and (max-width: 479px) { .popup--has-image { text-align: center; } } .popup--has-image .popup__image__img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } /*================ Popup Bottom Left ================*/ .popup__wrapper--bottom-left { align-items: flex-start; } @media only screen and (max-width: 767px) { .popup__wrapper--bottom-left { align-items: center; } } .popup__wrapper--bottom-left .popup__body { margin-left: 0; } @media only screen and (max-width: 767px) { .popup__wrapper--bottom-left .popup__body { margin-right: 0; } } /*================ Popup Bottom Right ================*/ .popup__wrapper--bottom-right { align-items: flex-end; } @media only screen and (max-width: 767px) { .popup__wrapper--bottom-right { align-items: center; } } .popup__wrapper--bottom-right .popup__body { margin-right: 0; } @media only screen and (max-width: 767px) { .popup__wrapper--bottom-right .popup__body { margin-left: 0; } } /*================ Popup Large ================*/ .popup--large { padding: calc(var(--gutter) / 2); } @media only screen and (max-width: 1023px) { .popup--large { padding: calc(var(--gutter-mobile) / 2); } } @media only screen and (max-width: 767px) { .popup--large .popup__body { width: 100%; } } .popup--no-image .input-group { margin-left: auto; margin-right: auto; justify-content: center; } .popup--no-image .input-group__fields { justify-content: center; } .popup--large .input-group--inline .input-group__item--btn { flex-basis: 54px; } .popup--large .input-group__fields, .popup--large .input-group__item { flex-basis: 100%; } .collection__inner { width: 100%; } @media only screen and (max-width: 767px) { .popup--large .popup__title { padding: 0 20px; } .collection__products .grid, .grid--center { gap: 5px; --grid-tablet: repeat(2, minmax(0, 1fr)); row-gap: 26px; } .product-grid-item__price.price { font-size: 14px; } } .popup__wrapper--bottom-right, .popup__wrapper--bottom-left { justify-content: flex-end; } .popup--large .errors, .popup--large .form-success { margin-left: auto; margin-right: auto; justify-content: center; } /*================ Popup Bar ================*/ .popup--bar { --gutter-right: calc(var(--gutter-mobile) + var(--scrollbar-width)); color: var(--text-alpha-50); top: auto; } @media only screen and (min-width: 1024px) { .popup--bar { --gutter-right: calc(var(--gutter) + var(--scrollbar-width)); } } .popup--bar .popup__container { display: flex; flex-wrap: nowrap; max-height: 0; overflow: hidden; transition: max-height 0.45s cubic-bezier(0, 1, 0.5, 1); } @media only screen and (max-width: 479px) { .popup--bar .popup__container { display: block; } } .popup--bar .popup__wrapper { justify-content: flex-end; } .popup--bar .popup__underlay { opacity: 0; visibility: hidden; pointer-events: none; transition-delay: 0s, 0.3s; } .popup--bar .popup__body { width: 100%; max-width: 100%; max-height: none; overflow: hidden; padding: 0 var(--gutter-mobile); } @media only screen and (min-width: 1024px) { .popup--bar .popup__body { padding: 0 var(--gutter); } } .popup--bar .popup__close { top: 5px; right: calc(var(--gutter-mobile) - 12px); } @media only screen and (min-width: 1024px) { .popup--bar .popup__close { right: calc(var(--gutter) - 12px); } } .popup--bar .popup__form { flex-basis: 100%; max-width: 100%; margin: calc(var(--inner) / 2) 0; } @media only screen and (max-width: 767px) { .popup--bar .popup__form { flex-basis: 50%; } } .popup--bar .popup__image { flex: 1 0 33.33%; align-self: flex-start; margin: calc(var(--inner) / 2) var(--inner) var(--inner) 0; } @media only screen and (min-width: 1024px) { .popup--bar .popup__image { max-width: 33.3333333333%; } } @media only screen and (min-width: 1440px) { .popup--bar .popup__image { flex-basis: 360px; } } @media only screen and (max-width: 767px) { .popup--bar .popup__image { flex-basis: 50%; margin-right: calc(var(--inner) / 2); } } @media only screen and (max-width: 479px) { .popup--bar .popup__image { flex-basis: 100%; margin-right: 0; } } .popup--bar .popup__image__img { height: 0; min-height: 1px; padding-top: var(--image-aspect-ratio); } .popup--bar .popup__image__mobile { width: 100%; } @media only screen and (min-width: 768px) { .popup--bar .popup__image__mobile { display: none; } } .popup--bar .errors, .popup--bar .form-success { max-width: 100%; } @media only screen and (max-width: 767px) { .popup--bar .errors, .popup--bar .form-success { width: 100%; } } .popup--bar .note, .popup--bar .errors { margin-bottom: calc(var(--inner) / 2); } .popup--bar .newsletter-form.has-error .errors, .popup--bar .newsletter-form.has-success .form-success { display: inline-block; } .popup--bar--no-image .popup__form { flex-basis: 100%; } .popup--bar--no-image .input-group { flex-flow: row wrap; } .popup--bar--no-image .input-group--inline { flex-flow: row nowrap; } .popup--bar--no-image .input-group__item { flex-basis: 50%; } @media only screen and (min-width: 768px) { .popup--bar--no-image .input-group__item { max-width: 280px; } } @media only screen and (min-width: 1440px) { .popup--bar--no-image .input-group__item { flex-basis: 280px; } } @media only screen and (min-width: 1024px) and (max-width: 1439px) { .popup--bar--no-image .input-group__item { flex-basis: 25%; } } @media only screen and (max-width: 479px) { .popup--bar--no-image .input-group__item { flex-basis: 100%; } } .popup--bar--no-image .input-group--inline .input-group__item--btn { flex-basis: 54px; } .popup--bar--no-image .input-group__item--text { flex-basis: 100%; max-width: none; } .popup--bar.popup--expanded { top: 0; } .popup--bar.popup--expanded .popup__container { max-height: 500px; margin-bottom: 0; transition: max-height 0.45s ease; } /*================ Popup Cookies ================*/ .popup--cookies { top: auto; font-size: calc(0.75rem * var(--adjust-body)); letter-spacing: 0.025em; color: var(--text); background: var(--bg); } .cookies__container { display: flex; flex-flow: row wrap; align-items: center; padding: 7px 0; } .cookies__container p { font-size: inherit; } @media only screen and (max-width: 479px) { .cookies__container { display: block; padding: 10px 0; } } .cookies__title { font-weight: 900; } .cookies__content p { margin: 0; } .cookies__buttons { margin-left: auto; } @media only screen and (min-width: 768px) { .cookies__buttons { display: flex; white-space: nowrap; } } @media only screen and (max-width: 479px) { .cookies__buttons { margin-top: 10px; } } .cookies__buttons .btn, .cookies__buttons .shopify-payment-button__button--unbranded, .cookies__close { font-size: calc(0.75rem * var(--adjust-button)); letter-spacing: var(--LETTER-SPACING-BUTTON); } .cookies__buttons .btn, .cookies__buttons .shopify-payment-button__button--unbranded { padding: 2px 0; min-width: 50px; margin-right: 10px; } @media only screen and (max-width: 479px) { .cookies__buttons .btn, .cookies__buttons .shopify-payment-button__button--unbranded { width: auto; } } .cookies__close { transition: opacity 0.3s ease; } .cookies__close:hover { opacity: 0.7; } /*================ Popup z-index ================*/ [data-popup]:focus-within>* { z-index: 9999; } .has-block-selected>.popup:not(.selected) { visibility: hidden; } predictive-search, search-form { width: 100%; display: block; } @media only screen and (max-width: 767px) { predictive-search, search-form { max-width: none; } } predictive-search p, search-form p { margin: 0; } predictive-search mark, search-form mark { background-color: var(--bg-accent); color: var(--text); } .predictive-search, .popular-searches { --image-size: 30px; --gap-lg: 24px; --gap-sm: 16px; --left-right: var(--gap-lg); --top-bottom: var(--gap-sm); --item-top-bottom: calc(var(--top-bottom) / 2); position: absolute; z-index: 4; top: 0; right: 0; left: 0; margin: -11px auto 0; width: 100%; max-width: var(--width); max-height: calc(100vh - var(--header-height, 0px) - var(--search-popdown-height)); background: var(--bg); overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: smooth; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .predictive-search::-webkit-scrollbar, .popular-searches::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } @media only screen and (max-width: 767px) { .predictive-search, .popular-searches { margin-top: -8px; border-left: 0; border-right: 0; max-width: none; } } .has-scrolled .predictive-search, .has-scrolled .popular-searches { max-height: calc(100vh - var(--header-sticky-height) - var(--search-popdown-height)); } .popular-searches .predictive-search__list { padding: var(--item-top-bottom) var(--left-right); display: flex; flex-flow: row wrap; padding-top: 0; } .popular-searches .predictive-search__list:last-child { padding-bottom: 0; } .popular-searches .predictive-search__group:last-child { padding-bottom: var(--gap-lg); } .popular-searches .predictive-search__item { padding: 0 var(--left-right) calc(var(--item-top-bottom) * 1.75) 0; } .predictive-search__actions { border-top: var(--BORDER-WIDTH) solid var(--border); margin-top: var(--gap-lg); padding: var(--top-bottom) var(--left-right); width: 100%; display: flex; align-items: center; justify-content: space-between; } .caps .predictive-search__actions { text-transform: none; } .predictive-search__actions .predictive-search__link { position: relative; display: inline-block; text-decoration: none !important; font-size: calc(1rem * var(--adjust-body)); } .predictive-search__actions .predictive-search__link:before, .predictive-search__actions .predictive-search__link:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .predictive-search__actions .predictive-search__link:before { transform: scaleX(0); transform-origin: left; } .predictive-search__actions .predictive-search__link:after { transform-origin: right; } .no-touch .predictive-search__actions .predictive-search__link:hover { background: transparent; border: 0; } .no-touch .predictive-search__actions .predictive-search__link:hover:before, .no-touch .predictive-search__actions .predictive-search__link:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .predictive-search__actions .predictive-search__link:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .predictive-search__actions .predictive-search__link:after { opacity: 0; } .predictive-search__actions .predictive-search__link:hover { opacity: 1; } .predictive-search__actions .predictive-search__link:hover:before, .predictive-search__actions .predictive-search__link:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); } .predictive-search__actions .predictive-search__link:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .predictive-search__actions .predictive-search__link:hover:after { transform: scaleX(0); opacity: 1; } .predictive-search__quick-tip { font-size: calc(0.75rem * var(--adjust-body)); } .predictive-search__heading { margin-bottom: calc(var(--gap-lg) - var(--item-top-bottom)); /* padding: var(--gap-lg) var(--left-right) calc(var(--gap-sm) / 4); */ border-bottom: var(--BORDER-WIDTH) solid var(--border); font-family: var(--FONT-STACK-NAV); font-weight: var(--FONT-WEIGHT-NAV-BOLD); font-style: var(--FONT-STYLE-NAV); font-size: calc(1rem * var(--adjust-nav)); } .nav .predictive-search__heading { font-size: calc(1rem * var(--adjust-nav)); } .predictive-search__heading span { display: inline-block; } .predictive-search__item { font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); font-size: calc(1rem * var(--adjust-body)); line-height: 1.2; padding: var(--item-top-bottom) var(--left-right); } .predictive-search__item:last-child { padding-bottom: 0; } .caps .predictive-search__item { text-transform: none; } .nav .predictive-search__item { font-size: calc(1rem * var(--adjust-body)); } .predictive-search__link { display: inline-block; color: currentcolor; transition: opacity 0.3s ease; } .predictive-search__link:hover { opacity: 0.65; } .predictive-search__link>* { pointer-events: none; } .predictive-search__product { display: flex; align-items: center; width: 100%; } .predictive-search__product-image { position: relative; max-width: var(--image-size); flex: 0 0 var(--image-size); height: var(--image-size); } .predictive-search__product-title { padding-left: calc(var(--gap-sm) - 4px); } .predictive-search__loading-state { margin: 0 var(--left-right); min-height: var(--search-popdown-height); display: flex; align-items: center; } .predictive-search__item[aria-selected=true] a, .predictive-search__product[aria-selected=true] a, .predictive-search__link[aria-selected=true] { outline: 5px auto var(--PRIMARY-BUTTONS-COLOR-BG); } /*================ Press section ================*/ .press { text-align: center; background-color: var(--bg); } .press h1 a, .press h2 a, .press h3 a, .press h4 a, .press h5 a, .press h6 a, .press ol li a, .press ul li a { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .press ul, .press ol { margin-bottom: 0; display: inline-grid; text-align: left; } .press--no-blockquotes .press__logos-slide { opacity: 1; } .press--no-links.press--no-blockquotes .press__logos-slide { cursor: default; } .press__heading { margin-bottom: 0; } .press__items { position: relative; overflow: hidden; } .press__item { position: absolute; padding: var(--inner) 0; width: 100%; font-size: calc(2rem * var(--adjust-body)); line-height: 1.2; opacity: 0 !important; transition: opacity 0.2s ease; } .press__item p { font-size: inherit; margin: 0; } .press__item a { color: inherit; } .press__item.is-selected { opacity: 1 !important; } .press__item:empty { padding: 0; } @media only screen and (max-width: 767px) { .press__item { font-size: calc(1.5rem * var(--adjust-body)); } } .press__item__content>* { margin-bottom: 0; } .press__item__inner { opacity: 0; transition: opacity 0.2s ease; } .is-selected .press__item__inner { transition: none; opacity: 1; animation: pressFadeInUp 0.4s ease; animation-delay: 0.2s; animation-fill-mode: backwards; } .press__item:not(.is-selected) .press__item__inner { opacity: 0; animation: pressFadeOutDown 0.6s ease-in; animation-fill-mode: forwards; } .press__item__read-more { display: block; padding-top: var(--inner); font-size: calc(1rem * var(--adjust-body)); } .press__item__read-more .icon { display: inline-block; width: 10px; height: 10px; margin-left: 4px; vertical-align: middle; } .press__logos { margin: calc(var(--inner) * 1.5) auto 0; position: relative; } @media only screen and (max-width: 767px) { .press__logos { margin-top: var(--inner); max-width: 100%; } } .press__logos--no-text { margin: 0; } .press__logos-slider:not(.flickity-enabled) { margin: 0 auto; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; } .press__logos-slider .flickity-slider { display: flex; flex-flow: row wrap; align-items: center; } .press__logos-slide { cursor: pointer; } .no-touch .press__logos-slide:hover { opacity: 1; } .press__logo { display: flex; align-items: center; justify-content: center; width: 275px; padding: 0 10px 10px; overflow: hidden; position: relative; } .press__logo:after { content: ""; position: absolute; bottom: 0; left: 50%; width: 0; height: 100%; border-bottom: 2px solid var(--text); pointer-events: none; transform: translateX(-50%); transition: width 0.3s; } .press__logos--2 .press__logo { max-width: 100%; } .is-selected.has-text .press__logo:after { width: calc(var(--image-width, var(--onboarding-logo-size)) / 2); } .press__items--onboarding~.press__logos { --onboarding-logo-size: 100px; } .press__logo-image { display: block; max-width: 100%; width: var(--image-width, var(--onboarding-logo-size)); height: var(--image-height, var(--onboarding-logo-size)); object-fit: contain; margin: auto; } .press__logo-image--placeholder { position: relative; max-height: calc(var(--image-height, var(--onboarding-logo-size)) * 0.6); overflow: hidden; } .press__logo-image--placeholder .placeholder-svg, .press__logo-image--placeholder .placeholder-svg-filled { transform: scale(3); fill: var(--text); } .press__logos--rounded-corners .press__logo-image, .press__logos--rounded-corners .press__logo-image--placeholder { border-radius: var(--radius, 8px); } .press__item--quotes { --font-size-adjust: calc(20rem * var(--adjust-body)); /* quote watermark positioning according to rich text formatting elements */ } .press__item--quotes .press__item__inner { padding-top: calc(0.15 * var(--font-size-adjust)); } .press__item--quotes .press__quote { position: relative; } .press__item--quotes .press__quote:before { content: "“"; position: absolute; width: calc(0.4 * var(--font-size-adjust)); height: calc(0.4 * var(--font-size-adjust)); top: calc(0.15 * var(--font-size-adjust)); left: calc(-0.1 * var(--font-size-adjust)); font-size: var(--font-size-adjust); line-height: calc(0.2 * var(--font-size-adjust)); opacity: 0.1; text-align: left; } @media only screen and (max-width: 1023px) { .press__item--quotes { --font-size-adjust: calc(15rem * var(--adjust-body)); } } .press__item--quotes .press__item__content { display: inline-block; } .press__item--quotes .press__item__content>* { display: inline; } .press__item--quotes .press__item__content>.press__item__read-more { display: block; } .press__item--quotes .press__item__content ul, .press__item--quotes .press__item__content ol { display: inline-grid; } .press__item--quotes .press__item__content>a:not([class])>* { display: inherit; } .press__item--quotes .press__item__content>a:not([class])>ul, .press__item--quotes .press__item__content>a:not([class])>ol { display: inline-grid; } /*================ Product ================*/ @media only screen and (min-width: 768px) { .product-single__wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gutter); } } .aos-initialized .product-single__wrapper [data-aos][data-aos].aos-animate { transform: none; } @media only screen and (min-width: 768px) { .product-single .form__wrapper.is-sticky { position: sticky; top: var(--sticky-top, 0); } } @media only screen and (min-width: 768px) { .product-single__wrapper--large { grid-template-columns: calc(60% - var(--gutter) / 2) calc(40% - var(--gutter) / 2); } } @media only screen and (min-width: 768px) { .product-single__wrapper--standard { grid-template-columns: calc(50% - var(--gutter) / 2) calc(50% - var(--gutter) / 2); } } @media only screen and (min-width: 1024px) { .product-single__wrapper--grid .product-single__media-slider { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } } @media only screen and (max-width: 767px) { .product-single__wrapper .product__submit__holder { padding-top: calc(var(--form-margin-mobile) * 2); } } .featured-product--onboarding .product-single__wrapper--grid .product-single__media-slider { grid-template-columns: minmax(0, 1fr); } @media only screen and (min-width: 768px) { .product-single__wrapper--stacked .product-single__media-slider { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; } } .product-single__details { width: 100%; } @media only screen and (min-width: 768px) { .product-single__details { margin-right: auto; } } .product__block { padding-bottom: var(--PBB, 0); } @media only screen and (max-width: 767px) { .product__block { /* padding-bottom: max(var(--PBB, 0) * 0.75, 8px); */ } } @media only screen and (min-width: 480px) { .product__block--half { display: inline-block; width: 50%; } } .product__block hr { margin: 0; } .product__description a, .product__subheading a, .product__feature__content a, .product__accordion__inner a, .product__popup__link span { position: relative; display: inline-block; text-decoration: none !important; } .product__description a:before, .product__description a:after, .product__subheading a:before, .product__subheading a:after, .product__feature__content a:before, .product__feature__content a:after, .product__accordion__inner a:before, .product__accordion__inner a:after, .product__popup__link span:before, .product__popup__link span:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .product__description a:before, .product__subheading a:before, .product__feature__content a:before, .product__accordion__inner a:before, .product__popup__link span:before { transform: scaleX(0); transform-origin: left; } .product__description a:after, .product__subheading a:after, .product__feature__content a:after, .product__accordion__inner a:after, .product__popup__link span:after { transform-origin: right; } .no-touch .product__description a:hover, .no-touch .product__subheading a:hover, .no-touch .product__feature__content a:hover, .no-touch .product__accordion__inner a:hover, .no-touch .product__popup__link span:hover { background: transparent; border: 0; } .no-touch .product__description a:hover:before, .no-touch .product__description a:hover:after, .no-touch .product__subheading a:hover:before, .no-touch .product__subheading a:hover:after, .no-touch .product__feature__content a:hover:before, .no-touch .product__feature__content a:hover:after, .no-touch .product__accordion__inner a:hover:before, .no-touch .product__accordion__inner a:hover:after, .no-touch .product__popup__link span:hover:before, .no-touch .product__popup__link span:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .product__description a:hover:before, .no-touch .product__subheading a:hover:before, .no-touch .product__feature__content a:hover:before, .no-touch .product__accordion__inner a:hover:before, .no-touch .product__popup__link span:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .product__title-and-price { display: grid; grid-template-columns: minmax(0, 100%); grid-template-rows: min-content; align-content: start; gap: var(--form-margin); margin-bottom: calc(var(--form-margin) / 2); } @media only screen and (max-width: 767px) { .product__title-and-price { margin-bottom: var(--form-margin-mobile); } } .product__title { font-size: calc(2rem * var(--adjust-heading)); margin-bottom: 0; } .product__subheading p { font-size: calc(1rem * var(--adjust-body)); margin: 0; } .product__price-and-badge { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; margin-bottom: -8px; } .product__price-and-badge .product__price { padding-right: 10px; margin: 0 auto 0 0; } .product__price-and-badge .product__unit-price { margin-right: 12px; } .product__price-and-badge .product__rating { align-self: flex-start; font-size: calc(0.9rem * var(--adjust-body)); } .product__price-and-badge .rating__star { margin: 0 4px 2px 0; } .product__price-and-badge .rating__star__full { position: relative; } .product__price-and-rating { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; } .product__price { display: flex; flex-flow: row wrap; align-items: flex-start; margin: 0; font-size: calc(1.1rem * var(--adjust-body)); transition: opacity 0.3s ease; } @media only screen and (max-width: 767px) { .product__price { font-size: calc(1rem * var(--adjust-body)); } } .product__price--hidden { opacity: 0; } .product__price--regular { margin: 0 6px 8px 0; } .product__price--compare { text-decoration: line-through; opacity: 0.5; margin: 0 12px 8px 0; } .product__price--off { flex-shrink: 0; padding: 3px 9px; margin: 0 0 8px; border-radius: var(--RADIUS-BADGE); background-color: var(--saving-bg); color: var(--saving-text); font-size: calc(0.75rem * var(--adjust-body)); } .product__price--off em { font-style: normal; opacity: 0.5; padding: 0 4px; } .product__unit-price { font-size: calc(0.75rem * var(--adjust-body)); line-height: calc(1.71875rem * var(--adjust-body)); opacity: 0.5; } .product__description.rte { color: var(--text); margin-bottom: 0; font-size: calc(0.9rem * var(--adjust-body)); } .product__description.rte p { line-height: inherit; margin-block-start: 0; } @media only screen and (max-width: 1023px) { .product__description.rte { width: 100%; } } .product-single__gallery { position: relative; } @media only screen and (max-width: 767px) { .product-single__gallery { margin-bottom: var(--gutter-mobile); margin-left: -20px; margin-right: -20px; } .popup-quick-view__gallery .product-single__gallery { margin: 0; } .product-single__media-slider .flickity-prev-next-button { display: none; } body .popup-quick-view .product-single__media { padding-top: 0; } body .popup-quick-view .product-single__media--image-height { display: block; } body .popup-quick-view__body .select-popout__option { padding-top: 5px; padding-bottom: 5px; } body .popup-quick-view .select-popout__list__scroll { max-height: 280px; } } .product-single__media-slider { margin: 0 auto; } @media only screen and (max-width: 479px) { .product-single__media-slider { max-width: 100%; } } @media only screen and (max-width: 479px) { .product-single__media-slider .flickity-prev-next-button { display: none; } } .product-single__media-slider .flickity-button { z-index: 1; background: var(--bg); } .product-single__media-slider:not(.has-media-active) .flickity-button { transition-delay: 0.15s !important; } .no-outline .product-single__media-slider.has-media-active .flickity-prev-next-button, .no-outline .product-single__media-slider.has-media-active .flickity-prev-next-button:not(:disabled) { opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s linear 0.3s; } .no-outline .product-single__media-slider.has-media-active .flickity-prev-next-button:before, .no-outline .product-single__media-slider.has-media-active .flickity-prev-next-button:after, .no-outline .product-single__media-slider.has-media-active .flickity-prev-next-button:not(:disabled):before, .no-outline .product-single__media-slider.has-media-active .flickity-prev-next-button:not(:disabled):after { transition: none; } .js .product-single__wrapper--carousel .product-single__media-slider:not(.flickity-enabled) .product-single__media-slide:not(:first-child) { display: none; position: absolute; top: 0; left: 0; visibility: hidden; } .product-single__media-slider--single { margin: 0; } @media only screen and (max-width: 1023px) { .product-single__media-slider--single .product__badge { left: 0 !important; } } .product-single__media-slide--placeholder { display: block; width: 100%; height: 0; } .product-single__media-slide { width: 100%; position: relative; overflow: hidden; } .product-single__media-slide .product-single__media-slide-placeholder { display: block; width: 100%; height: 0; } .product-single__wrapper--carousel .product-single__media-slide.media--hidden:not(.is-selected) button, .product-single__wrapper--carousel .product-single__media-slide.media--hidden:not(.is-selected) input, .product-single__wrapper--carousel .product-single__media-slide.media--hidden:not(.is-selected) iframe, .product-single__wrapper--carousel .product-single__media-slide.media--hidden:not(.is-selected) .shopify-model-viewer-ui__button, .product-single__wrapper--carousel .product-single__media-slide.media--hidden:not(.is-selected) .shopify-model-viewer-ui__controls-area { visibility: hidden; transition: visibility 0s linear 0.75s; } .product-single__media-slider--single .product-single__media-slide.media--hidden:not(.is-selected) button, .product-single__media-slider--single .product-single__media-slide.media--hidden:not(.is-selected) input, .product-single__media-slider--single .product-single__media-slide.media--hidden:not(.is-selected) iframe, .product-single__media-slider--single .product-single__media-slide.media--hidden:not(.is-selected) .shopify-model-viewer-ui__button, .product-single__media-slider--single .product-single__media-slide.media--hidden:not(.is-selected) .shopify-model-viewer-ui__controls-area { visibility: visible; } .product-single__media-slide.is-loading model-viewer { background-image: var(--loading-svg); background-size: 320px auto; background-repeat: no-repeat; background-position: center center; } .product-single__media { position: relative; width: 100%; height: 0; min-height: 1px; overflow: hidden; } .product-single__media img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; margin: 0; object-fit: contain; } .product-single__media iframe, .product-single__media model-viewer, .product-single__media .shopify-model-viewer-ui, .product-single__media img, .product-single__media>video, .product-single__media .media-item { position: absolute; top: 0; left: 0; width: 100%; max-width: 100%; min-width: 100%; } .product-single__media iframe, .product-single__media model-viewer, .product-single__media .shopify-model-viewer-ui, .product-single__media .media-item { height: 100%; } .product-single__media--video video { height: 100%; object-fit: cover; } .product-single__media-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @media only screen and (min-width: 768px) { .product-single__media-link { cursor: zoom-in; cursor: var(--icon-zoom-in), zoom-in; } } .deferred-media { display: block; } .deferred-media:not([loaded]) { background: var(--loading-svg) no-repeat center center; background-size: 320px auto; } .deferred-media:not([loaded]) template { z-index: -1; } .deferred-media[loaded]>.deferred-media__poster { display: none; } .deferred-media__poster { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: default; } .deferred-media__poster-button { position: absolute; top: 50%; left: 50%; margin: -30px 0 0 -30px; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; padding: 8px; background-color: var(--bg); border: var(--BORDER-WIDTH) solid var(--text-alpha-5); z-index: 1; cursor: pointer; } .deferred-media__poster-button .icon-media-video-outline, .deferred-media__poster-button .icon-media-model-outline { stroke: none; } .deferred-media__poster-button .icon { width: 100%; height: 100%; } .deferred-media__poster img { object-fit: cover; } .product-single__media--image { height: auto; background-color: var(--bg); filter: brightness(var(--product-filter-bg)); } .product-single__media--onboarding { padding-top: 66%; background-color: var(--bg); filter: brightness(var(--product-filter-bg)); } .product-single__media--onboarding .placeholder-svg, .product-single__media--onboarding .placeholder-svg-filled { position: absolute; top: 50%; left: 50%; width: 150%; height: 150%; max-width: 150%; max-height: 150%; transform: translate(-50%, -50%); } .product-single__media--onboarding.featured-product--two-columns { padding-top: 66%; } .product-single__view-in-space { width: 100%; position: relative; border-color: transparent; color: var(--text); background: var(--text-alpha-8); margin-top: 10px; } .product-single__view-in-space:hover { color: var(--text); background: var(--text-alpha-15); } .product-single__view-in-space:active, .product-single__view-in-space:focus { color: var(--text); background: var(--text-alpha-8); } .product-single__view-in-space .icon { display: inline-block; vertical-align: middle; width: 22px; height: 22px; line-height: 22px; margin-right: 4px; fill: transparent; } .product-single__view-in-space .icon .icon-media-model-outline { stroke: none; } .product-single__view-in-space .icon .icon-media-model-element { fill: var(--text); opacity: 1; } .product-single__view-in-space[data-shopify-xr-hidden] { visibility: hidden; position: absolute; width: 0; height: 0; overflow: hidden; } @media only screen and (min-width: 768px) { .product-single__view-in-space[data-shopify-xr-hidden] { display: none; } } .product-single__view-in-space-text { display: inline-block; vertical-align: middle; line-height: 22px; } .product-single__thumbnails { margin: 5px 0; } @media only screen and (max-width: 1023px) { .product-single__thumbnails { margin: 5px calc(var(--gutter-mobile) * -1); } } .product-single__thumbnails:not(.flickity-enabled) { display: flex; flex-flow: row nowrap; align-items: center; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .product-single__thumbnails:not(.flickity-enabled)::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .product-single__thumbnails:not(.flickity-enabled) .product-single__thumbnail { min-width: 110px; } .product-single__thumbnails.flickity-enabled.is-draggable .flickity-viewport { cursor: default; } @media only screen and (min-width: 768px) { .product-single__wrapper--stacked .product-single__thumbnails, .product-single__wrapper--grid .product-single__thumbnails { display: none; } } [data-payment-button=false] { display: none; } .popup-quick-view [data-quickview-payment-button=true] { display: block; } .product-single__thumbnail { position: relative; display: block; padding: 5px; cursor: pointer; } .product-single__thumbnail .icon { position: absolute; top: 2px; right: 2px; margin: 5px; height: 22px; width: 22px; vertical-align: baseline; } .product-single__thumbnail:first-child { padding-left: var(--gutter-mobile); } .product-single__thumbnail:last-child { padding-right: var(--gutter-mobile); } @media only screen and (min-width: 768px) { .product-single__thumbnail:first-child { padding-left: 0; } .product-single__thumbnail:last-child { padding-right: 0; } } .product-single__thumbnail-link { cursor: pointer; display: block; position: relative; overflow: hidden; width: 90px; height: 90px; border: var(--BORDER-WIDTH) solid var(--bg); filter: brightness(var(--product-filter-bg)); background-color: var(--bg); } .is-nav-selected .product-single__thumbnail-link { border-color: var(--border); } .product-single__thumbnail-img { display: block; width: 100%; height: 100%; object-fit: cover; } /* * Accordion */ .product__accordion { text-align: left; overflow: hidden; } .product__accordion__inner { margin-bottom: 0; padding-bottom: 5px; position: relative; font-size: calc(0.9rem * var(--adjust-body)); } .product__accordion__inner p { margin-top: 0; } .product__accordion__title { font-size: calc(0.9rem * var(--adjust-body)); display: block; position: relative; width: 100%; padding-right: 53px; text-align: left; color: var(--text); background: transparent; border: 0; } .product__accordion__title .icon { top: 0; right: 0; width: 16px; height: 100%; } /* * Modal */ .product__popup__link { display: inline-flex; font-size: calc(0.875rem * var(--adjust-body)); align-items: center; } .product__popup__link .icon { margin-right: 5px; width: 16px; height: 16px; pointer-events: none; } .product__popup__link span { pointer-events: none; } .product__popup__link:hover span:before, .product__popup__link:hover span:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); } .product__popup__link:hover span:before { transform: scaleX(1); transition-delay: 0.25s; } .product__popup__link:hover span:after { transform: scaleX(0); } .no-touch .product__popup__link span:after { opacity: 0; } .no-touch .product__popup__link:hover span:after { opacity: 1; } .product__popup { overflow: hidden; display: flex; flex-direction: column; } @media only screen and (min-width: 1024px) { .product__popup { --drawer-width: calc(50vw - var(--gutter) / 2); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .product__popup { --drawer-width: 600px; } } @media only screen and (max-width: 767px) { .product__popup { --drawer-width: 100%; } } .product__popup__inner { position: relative; height: auto; overflow-x: hidden; overflow-y: auto; padding: 0 var(--inner); } .product__popup__content { overflow: hidden; position: relative; max-width: 600px; width: 100%; background-color: var(--bg); padding: var(--inner); margin: 60px auto 20px; } .product__popup__content .product__accordions { overflow-x: hidden; overflow-y: auto; max-height: calc(100vh - 140px); margin-top: 20px; } /* * Complementary products */ .product__complementary .product-upsell__holder, .complementary-products__title { margin: 0 0 var(--form-margin); } @media only screen and (max-width: 767px) { .product__complementary .product-upsell__holder, .complementary-products__title { margin: 0 0 var(--form-margin-mobile); } } /* * Icon block */ .product__icon__row { --icon-size: 25px; --line-height: 1.5625; background-color: var(--bg); display: flex; align-items: center; border-radius: var(--radius); font-size: calc(1rem * var(--adjust-body)); line-height: var(--line-height); align-self: start; } .product__icon__row--center { justify-content: center; text-align: center; } .product__icon { min-height: calc(1rem * var(--adjust-body) * var(--line-height)); display: flex; flex-basis: var(--icon-size); flex-shrink: 0; align-items: center; justify-content: center; align-self: center; position: relative; color: var(--icon-color); } .product__icon .icon { display: block; width: var(--icon-size); height: var(--icon-size); } .product__icon__holder { display: block; position: relative; width: 100%; height: 0; padding-top: var(--aspect-ratio); } .product__icon__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; } .product__icon__text:not(:only-child) { margin-left: 10px; } /* * Icon Row block */ .product__icon__row--multiple { display: grid; column-gap: calc(var(--grid-gutter) * 2); } @media only screen and (min-width: 768px) { .product__icon__row--multiple { grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); } } @media only screen and (max-width: 767px) { .product__icon__row--multiple { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; } } /* * Modifiers */ @media only screen and (min-width: 768px) { .product-single__gallery--equal .product-single__media-slide { display: flex; } } @media only screen and (min-width: 768px) { .product-single__gallery--equal .product-single__media img { object-fit: cover; } } /* * Size Chart */ .popup-chart { --drawer-width: 590px; display: block; background: var(--bg); box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); margin-left: auto; overflow: hidden; } @media only screen and (max-width: 1023px) { .popup-chart { --drawer-width: calc(100vw - 400px); } } @media only screen and (max-width: 767px) { .popup-chart { --drawer-width: 100%; } } .popup-chart .drawer__close-button { right: var(--inner); } @media only screen and (max-width: 1023px) { .popup-chart .drawer__close-button { right: 0; } } .popup-chart__inner { position: relative; height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .popup-chart__inner::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .popup-chart__content { overflow: hidden; position: relative; max-width: 600px; width: 100%; background-color: var(--bg); padding: calc(var(--inner) * 2); padding-right: calc(var(--inner) * 2); margin: var(--inner) 0 var(--inner) auto; } @media only screen and (max-width: 1023px) { .popup-chart__content { padding: var(--inner); } } .popup-chart__content .rte { font-size: calc(0.875rem * var(--adjust-body)); } .popup-chart__content .tab { padding-top: 5px; } .popup-chart__content h1 { font-size: calc(2.5rem * var(--adjust-heading)); margin: 35px 0 5px; } @media only screen and (max-width: 1439px) { .popup-chart__content h1 { font-size: calc(2.1rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .popup-chart__content h1 { font-size: calc(1.75rem * var(--adjust-heading)); } } .popup-chart__content .table-wrapper { border-top: var(--BORDER-WIDTH) solid var(--text); border-bottom: var(--BORDER-WIDTH) solid var(--text); padding: var(--inner) 0 calc(var(--inner) * 2); margin-bottom: calc(var(--inner) * 2); overflow-x: auto; } .popup-chart__content table { border: 0; } @media only screen and (max-width: 1023px) { .popup-chart__content table { min-width: 400px; } } .popup-chart__content tr:nth-child(even) { background: var(--text-alpha-5); } .popup-chart__content th, .popup-chart__content td { border: 0; padding: 10px; } .popup-chart__content tbody tr:not(:first-child) th, .popup-chart__content tbody tr:not(:first-child) td { padding-left: 20px; } .popup-chart__content .tabs__head { margin-bottom: 10px; } .popup-chart__content .tabs-scrollbar { text-align: left; } .popup-chart__content .tabs__nav { align-items: flex-start; } .popup-chart__content .tabs__link { margin-bottom: 0; } .popup-chart--quickview { position: absolute; left: 100%; z-index: 5; } @media only screen and (max-width: 767px) { .popup-chart--quickview { top: 100%; left: 0; z-index: 15; border-radius: 20px 20px 0 0; --drawer-transition: top 0.4s cubic-bezier(0.46, 0.01, 0.32, 1); } } .popup-chart--quickview.is-open { transform: translateX(calc(-1 * (var(--drawer-width) + 400px))); transition: var(--drawer-transition), visibility 0.1s linear 0s; } @media only screen and (max-width: 767px) { .popup-chart--quickview.is-open { top: 0; transform: none; } } @media only screen and (max-width: 767px) { .popup-chart--quickview .drawer__close-button svg { transform: rotate(90deg); } } .popup-chart--quickview .drawer__close-button:hover svg { transform: translateX(5px); } @media only screen and (max-width: 767px) { .popup-chart--quickview .drawer__close-button:hover svg { transform: rotate(90deg) translateY(5px); } } /* * Feature Block */ .product__feature { width: 100%; color: var(--text); background-color: var(--bg); margin-right: var(--inner); } .product__feature__icon__container { display: flex; align-items: center; justify-content: center; } .product__feature__icon__container .product__icon { margin-right: 10px; } .product__feature__content { display: grid; gap: 5px; justify-content: center; text-align: center; } .product__feature__content p { font-size: calc(0.9rem * var(--adjust-body)); margin: 0; } .product__feature__heading h5 { font-family: var(--FONT-STACK-HEADING); font-weight: var(--FONT-WEIGHT-HEADING); font-style: var(--FONT-STYLE-HEADING); margin: 0; } .product__features.flickity-enabled { --max-bottom-padding: max(54px, var(--padding-bottom)); padding-bottom: var(--max-bottom-padding); } .product__features.flickity-enabled .flickity-page-dots { bottom: calc(var(--max-bottom-padding) - 28px); } /* * Product form */ :root { --form-top: 14px; --form-left: 20px; --form-margin: 25px; --form-padding-mobile: 6px; --form-margin-mobile: 8px; } /* * Notification form for Sold out */ .product__notification { position: relative; background: var(--bg); padding: var(--gutter); max-width: 500px; width: 100%; text-align: center; margin: auto; } .product__notification .contact-form { text-align: left; } .product__notification label { display: block; font-size: calc(0.875rem * var(--adjust-body)); margin-bottom: 15px; } .product__notification .input-group { max-width: 100%; flex-direction: column; } .product__notification .input-group__item { max-width: 100%; } .product__notification .input-group__field { border: var(--BORDER-WIDTH) solid var(--border); border-radius: var(--RADIUS); } .product__notification .input-group__item--btn { margin-top: var(--form-top); flex: 1; max-width: 100%; width: 100%; } .product__notification button[type=submit] { width: 100%; } @media only screen and (max-width: 767px) { .product__notification { padding: var(--gutter-mobile); } } .product__notification .contact-form { margin-top: 16px; } .product__notification__title { font-size: calc(2rem * var(--adjust-heading)); margin-bottom: 0; } @media only screen and (max-width: 767px) { .product__notification__title { padding: 0 var(--inner-mobile); } } .product__notification__subtitle { font-size: calc(1rem * var(--adjust-body)); margin: 5px 0 0; } .product__notification__close { position: absolute; top: 20px; right: 20px; width: 30px; height: 30px; padding: 5px; opacity: 1; text-indent: 0; color: inherit; background: none; } .product__notification__close:hover .icon-close { transform: rotate(90deg); } @media only screen and (max-width: 767px) { .product__notification__close { top: 10px; right: 10px; width: 25px; height: 25px; } } .product__notification__message { display: none; margin: var(--gutter) 0; text-align: center; } .template-product .pswp--success .product__notification__form { display: none; } .template-product .pswp--success .product__notification__message { display: block; } /* * Quantity */ .quantity__selector { display: block; width: 100%; padding: var(--form-top) 32px; font-size: calc(0.875rem * var(--adjust-body)); text-align: center; letter-spacing: 0.02em; line-height: 1.3; } .quantity__selector input[type=number]::-webkit-outer-spin-button, .quantity__selector input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .quantity__selector input[type=number] { -moz-appearance: textfield; } .quantity__btn { height: 50%; width: 44px; color: inherit; } .quantity__btn--decrease, .quantity__btn--increase { position: absolute; top: 0; height: 100%; display: flex; align-items: center; justify-content: center; } .quantity__btn--decrease { left: 0; } .quantity__btn--increase { right: 0; } .product__form { --form-top: 10px; --form-margin: 13px; display: grid; grid-template-columns: minmax(0, 100%); gap: var(--form-margin); position: relative; } @media only screen and (max-width: 767px) { .product__form { gap: var(--form-margin-mobile); } } .product__form .btn--submit { position: relative; width: 100%; transition: color 0.3s ease, border 0.3s ease, background 0.3s linear; } .product__form .btn--submit span { transition: opacity 0.3s ease; } .product__form .btn--submit.is-loading { opacity: 0.6; cursor: default; background: transparent; } .product__form .btn--submit.is-loading span { opacity: 0; transition: opacity 0s; } .product__form .btn--submit.is-loading::before { content: none; } .product__form .btn--submit .loader--line { transition: opacity 0.3s ease, visibility 0s linear 0s; } .product__form .btn--submit .loader--line { transition: opacity 0.3s ease, visibility 0s linear 0s; } .product__form .btn, .product__form .shopify-payment-button__button--unbranded, .product__form .shopify-payment-button { width: 100%; } .product__form .errors { margin-bottom: 0; } .product__form__select { display: none; } .shop-pay-terms { font-size: calc(0.875rem * var(--adjust-body)); } .shop-pay-terms:empty { display: none; } /* * Submit buttons */ .product__submit__holder--spb .shopify-payment-button__button--unbranded { border: var(--BORDER-WIDTH) solid transparent; padding: var(--form-top) var(--form-left); } .shopify-payment-button__more-options { font-size: calc(0.85rem * var(--adjust-body)) !important; margin-top: 5px !important; } .product__submit__buttons { display: flex; flex-flow: row wrap; align-items: flex-start; margin-right: calc(var(--form-left) * -1); } @media only screen and (max-width: 479px) { .product__submit__buttons { display: grid; grid-template-columns: minmax(0, 100%); gap: var(--form-margin-mobile); width: 100%; } } .product__submit__buttons .shopify-payment-button__button--hidden { display: none; } .product__submit__item { min-width: calc(50% - var(--form-left)); margin-right: var(--form-left); flex: 1; } @media only screen and (max-width: 479px) { .product__submit__item { min-width: 0; max-width: 400px; width: 100%; } .product__submit__item:last-child { margin-bottom: 0; } } .product__submit__item .loader--line { position: absolute; top: 0; bottom: 0; width: 80%; margin: auto; } /* * Form errors */ .product__form__errors { overflow: hidden; position: relative; text-align: left; max-height: 0; visibility: hidden; opacity: 0; transition: max-height 0.3s, visibility 0.3s, opacity 0.3s, margin 0.3s; } .product__form__errors.is-visible { max-height: 500px; visibility: visible; opacity: 1; transition: max-height 0.3s 0.3s, visibility 0.3s 0.3s, opacity 0.3s 0.3s, margin 0.3s 0.3s; } @media only screen and (max-width: 479px) { .product__form__errors { max-width: 390px; } } .product__form__errors .errors { max-width: 100%; margin: var(--form-margin) 0; padding: 15px 40px 15px 15px; position: relative; } @media only screen and (max-width: 767px) { .product__form__errors .errors { --form-margin: var(--form-margin-mobile); } } .product__form__errors .errors__close { position: absolute; top: 0; right: 0; width: 32px; height: 32px; padding: 5px; z-index: 20; cursor: pointer; } .product__form__errors .errors__close .icon-close { width: 100%; height: 100%; } .product__form__errors .errors__close:hover .icon-close { transform: rotate(90deg); } /* * Form success */ .product__add__success { display: flex; align-items: stretch; background: var(--bg); border-left: var(--BORDER-WIDTH) solid var(--border); border-bottom: var(--BORDER-WIDTH) solid var(--border); } @media only screen and (max-width: 767px) { .product__add__success { border-left: none; } } .product__add__success__image { width: 50%; } @media only screen and (max-width: 767px) { .product__add__success__image { display: none; } } .product__add__success__image-bg { height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; } .product__add__success__content { width: 50%; padding: 50px; } @media only screen and (max-width: 767px) { .product__add__success__content { width: 100%; padding: 15px 20px; } } .product__add__success--hide { display: none; } /* * Variant States */ .variant--soldout .quantity-selector label, .variant--soldout .quantity-selector input, .variant--soldout .quantity-selector button, .variant--soldout .shopify-payment-button label, .variant--soldout .shopify-payment-button input, .variant--soldout .shopify-payment-button button, .variant--soldout .product__price label, .variant--soldout .product__price input, .variant--soldout .product__price button, .variant--unavailabe .quantity-selector label, .variant--unavailabe .quantity-selector input, .variant--unavailabe .quantity-selector button, .variant--unavailabe .shopify-payment-button label, .variant--unavailabe .shopify-payment-button input, .variant--unavailabe .shopify-payment-button button, .variant--unavailabe .product__price label, .variant--unavailabe .product__price input, .variant--unavailabe .product__price button { cursor: default; } .variant--soldout .product__submit__add, .variant--soldout .product__submit__add:hover, .variant--unavailabe .product__submit__add, .variant--unavailabe .product__submit__add:hover { border-color: transparent; background-color: var(--text-alpha-10); color: var(--text-alpha-50); cursor: not-allowed; } .variant--soldout .product__submit__add>*, .variant--soldout .product__submit__add:hover>*, .variant--unavailabe .product__submit__add>*, .variant--unavailabe .product__submit__add:hover>* { pointer-events: none; } @media only screen and (max-width: 767px) { .variant--soldout .product__submit__add, .variant--soldout .product__submit__add:hover, .variant--unavailabe .product__submit__add, .variant--unavailabe .product__submit__add:hover { transform: none; pointer-events: none; } } .variant--soldout .product__submit__add::before, .variant--unavailabe .product__submit__add::before { background-color: var(--text-alpha-25); } .variant--soldout .shopify-payment-button, .variant--unavailabe .shopify-payment-button { position: relative; pointer-events: none; } .variant--soldout .shopify-payment-button::after, .variant--unavailabe .shopify-payment-button::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0); z-index: 2; } .variant--soldout .product__submit__holder--notification .product__submit__add, .variant--soldout .product__submit__holder--notification .product__submit__add:hover { cursor: pointer; pointer-events: auto; } .variant--unavailabe .product__price { opacity: 0; } /*================ Product Upsell ================*/ .body--rounded-corners .upsell__products { overflow: initial; } .upsell__products .flickity-page-dots { bottom: -28px; } @media only screen and (min-width: 1440px) { .upsell__products .product-upsell__holder:only-child, .upsell__products .upsell__products__slider { max-width: 630px; } } .upsell__products--slider { padding-bottom: max(54px, var(--padding-bottom)); } .product-upsell__holder { background-color: var(--bg-accent); width: 100%; padding: 12px; transition: opacity 0.3s; } .product-upsell__holder.fade-out { opacity: 0; } .product-upsell__holder__title { font-weight: var(--FONT-WEIGHT-HEADING); font-size: calc(1rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { .product-upsell__holder__title { font-size: calc(0.875rem * var(--adjust-heading)); } } .product-upsell { position: relative; display: flex; justify-content: flex-start; } .product-upsell__content { flex: 1 1 auto; padding: 5px 10px; font-size: calc(1rem * var(--adjust-body)); } .product-upsell__image { flex-basis: 150px; margin: 0 0 0 auto; } .product-upsell__image__link { position: relative; display: block; min-height: 100%; padding-top: 100%; overflow: hidden; background-color: var(--bg); filter: brightness(var(--product-filter-bg)); } .product-upsell__image__thumb { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .product-upsell__image__thumb--placeholder { padding-top: 0; } .product-upsell__title { font-family: var(--FONT-STACK-HEADING); font-weight: var(--FONT-WEIGHT-HEADING); font-style: var(--FONT-STYLE-HEADING); font-size: calc(1.1rem * var(--adjust-heading)); margin-bottom: 5px; } .product-upsell__subtitle { margin: 0 0 10px; font-size: calc(0.75rem * var(--adjust-body)); } .product-upsell__variant-title { color: var(--text-lighten); font-size: calc(0.8rem * var(--adjust-body)); margin: 0; } .product-upsell__variant-title span { display: inline-block; width: 2px; height: 2px; border-radius: 50%; margin: 0 4px; background-color: currentcolor; vertical-align: middle; opacity: 0.8; } .product-upsell__price { margin: 0 0 10px; } .product-upsell__btn { padding: 6px var(--inner); font-size: calc(0.875rem * var(--adjust-button)); line-height: 1.28; text-align: center; min-width: 0; margin-top: 10px; } @media only screen and (max-width: 479px) { .product-upsell__btn { width: auto; } } .product-upsell__btn-hidden { visibility: hidden; position: absolute; top: 0; left: 0; font-size: 80%; opacity: 0; white-space: nowrap; } .product-upsell__btn-progress { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content-visibility: hidden; opacity: 0; transition: opacity 0.3s ease; } .product-upsell__btn-check { position: absolute; top: 50%; left: 50%; width: 14px; height: 8px; border-left: var(--BORDER-WIDTH) solid var(--white); border-bottom: var(--BORDER-WIDTH) solid var(--white); margin-top: -2px; transform: translate(-50%, -50%) rotate(-45deg); opacity: 0; } .product-upsell__btn.is-success, .product-upsell__btn.is-success:disabled, .product-upsell__btn.is-success:disabled:hover { --btn-text: var(--SECONDARY-BUTTONS-COLOR-BG); --btn-bg: var(--SECONDARY-BUTTONS-COLOR-TEXT); --btn-border: var(--SECONDARY-BUTTONS-COLOR-TEXT); } .product-upsell__btn.is-loading .svg-loader circle { stroke: var(--SECONDARY-BUTTONS-COLOR-ALPHA-50); } .product-upsell__btn.is-loading .svg-loader circle~circle { stroke: var(--SECONDARY-BUTTONS-COLOR-TEXT); } .product-upsell__btn.is-loading, .product-upsell__btn.is-loading:disabled, .product-upsell__btn.is-loading:disabled:hover, .product-upsell__btn.btn--secondary.is-loading:hover { --btn-text: var(--SECONDARY-BUTTONS-COLOR-TEXT); --btn-bg: var(--SECONDARY-BUTTONS-COLOR-BG); } .product-upsell__btn.btn--secondary.is-loading:hover, .btn--secondary .product-upsell__btn.is-loading.shopify-payment-button__button--unbranded:hover { transition: none; } .product-upsell__btn.btn--secondary.is-loading:hover:before, .btn--secondary .product-upsell__btn.is-loading.shopify-payment-button__button--unbranded:hover:before { transform-origin: unset; transform: scaleY(0); } .product-upsell__btn.is-success>.product-upsell__btn-text, .product-upsell__btn.is-success>.product-upsell__btn-price { opacity: 0; } .product-upsell__btn.is-success>.product-upsell__btn-check { opacity: 1; border-left-color: currentcolor; border-bottom-color: currentcolor; } .product-upsell__btn.is-loading { pointer-events: none; } .product-upsell__btn.is-loading>.product-upsell__btn-text, .product-upsell__btn.is-loading>.product-upsell__btn-price, .product-upsell__btn.is-loading>.product-upsell__btn-check { opacity: 0; } .product-upsell__btn.is-loading>.product-upsell__btn-progress { opacity: 1; content-visibility: visible; } .product-upsell__btn.is-loading>.product-upsell__btn-progress circle~circle { animation-play-state: running; } .product-upsell__out-of-stock { display: none; color: var(--disabled-grey-darken); margin: 8px 0 0; font-size: inherit; } .product-upsell__btn.is-hidden { display: none; } .product-upsell__btn.is-hidden~.product-upsell__out-of-stock { display: block; } .product-upsell__unavailable { margin: 0; font-size: calc(0.875rem * var(--adjust-body)); opacity: 0.65; } .product-upsell__errors { overflow: hidden; visibility: hidden; position: relative; max-height: 0; border: var(--BORDER-WIDTH) solid var(--error); border-radius: var(--RADIUS-CHECKBOX); background-color: var(--error-bg); color: var(--error); opacity: 0; transition: all 0.3s; } .product-upsell__errors.is-visible { visibility: visible; max-height: 100vh; margin: 10px 0; opacity: 1; } .product-upsell__errors .errors { padding: 10px 40px 10px 10px; margin: 0; border: none; text-align: left; } .product-upsell__errors .errors__close { position: absolute; top: 4px; right: 12px; width: 20px; height: 20px; padding: 5px; z-index: 20; cursor: pointer; } .product-upsell__errors .icon { width: 100%; height: 100%; } /* Cart */ .product-upsell__holder--cart .product-upsell, .product-upsell__holder--cart .product-upsell__errors.is-visible { margin-bottom: 0; } .product-upsell__holder--cart .product-upsell__title { font-size: calc(0.815rem * var(--adjust-body)); } .product-upsell__holder--cart .product-upsell__image { flex-basis: 100px; } .product-upsell__holder--cart .product-upsell__btn, .product-upsell__holder--cart .product-upsell__variant-title { font-size: calc(0.6875rem * var(--adjust-body)); } /*================ Siblings - PDP ================*/ .siblings { --swatch: var(--text); --swatch-size: 44px; --inner-offset: calc(var(--BORDER-WIDTH) + 2px); --swatches-gap: 12px; border: 0; margin: 0 0 calc(-1 * var(--swatches-gap)); padding: 0; display: flex; width: 100%; flex-wrap: wrap; justify-content: flex-start; align-items: center; } .siblings__legend { flex: 0 0 100%; } .siblings__button { position: relative; width: var(--swatch-size); height: var(--swatch-size); min-width: var(--swatch-size); display: block; } .siblings__button img { object-fit: cover; } .siblings__swatch { margin: 0 var(--swatches-gap) var(--swatches-gap) 0; overflow: hidden; } .siblings__swatch:last-child { margin-right: 0; } .siblings__swatch[aria-current=true] { cursor: default; } .siblings__swatch[aria-current=true] .siblings__button:after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: var(--swatch-size); height: var(--swatch-size); min-width: var(--swatch-size); border: var(--BORDER-WIDTH) solid var(--swatch); z-index: 10; } .siblings__swatch[aria-current=true] .siblings__button { border: var(--inner-offset) solid var(--bg); } .siblings__swatch--sold-out img { opacity: 0.8; } .siblings__swatch--sold-out .siblings__button:before { content: ""; position: absolute; top: 50%; left: 50%; z-index: 2; width: var(--BORDER-WIDTH); height: 100%; border-radius: 0; background: var(--text); transform: translate(-50%, -50%) rotate(45deg); } .siblings__swatch--sold-out[aria-current=true] .siblings__button:before { height: calc(100% + 2 * var(--inner-offset)); } .siblings__swatch--circle img, .siblings__swatch--circle svg { border-radius: 50%; overflow: hidden; } .siblings__swatch--circle .siblings__button, .siblings__swatch--circle .siblings__button:after { border-radius: 50%; } .siblings__swatch--colors { --swatch: #CCC; } .siblings__swatch--colors .icon-check { position: absolute; top: 50%; left: 50%; width: 22px; transform: translate(-50%, -50%); } .siblings__swatch--colors .siblings__button { background: var(--swatch) no-repeat center center/cover; } .siblings__swatch--rectangle { --swatch-size: 56px; --rectangle-ratio: calc(var(--swatch-size) / 1.6); } .siblings__swatch--rectangle svg, .siblings__swatch--rectangle .siblings__button, .siblings__swatch--rectangle[aria-current=true] .siblings__button:after { height: var(--rectangle-ratio); } .siblings__swatch--rectangle[aria-current=true] svg { height: calc(var(--rectangle-ratio) - var(--inner-offset) * 2); } .siblings__swatch--rectangle.siblings__swatch--sold-out .siblings__button:before { --offset-diagonals: calc(var(--inner-offset) * 1.4); height: calc(var(--swatch-size) + var(--offset-diagonals) * 2); transform: translate(-50%, -50%) rotate(59deg); } .palette--light .siblings__swatch--colors .siblings__button[data-swatch=white i] { border: var(--BORDER-WIDTH) solid var(--COLOR-BORDER); } .palette--light .siblings__swatch--colors[aria-current=true] .siblings__button[data-swatch=white i] { border: var(--inner-offset) solid var(--COLOR-BLACK-ALPHA-10); } .palette--light .siblings__swatch--colors[aria-current=true] .siblings__button[data-swatch=white i]:after { border-color: var(--COLOR-BLACK); } .palette--light .siblings__swatch--colors.siblings__swatch--sold-out .siblings__button[data-swatch=black i]:before { background: var(--COLOR-WHITE); } .palette--light .siblings__swatch--image[aria-current=true] .siblings__button[data-swatch=white i]:after { border-color: var(--text); } .palette--dark .siblings__swatch--colors .siblings__button[data-swatch=black i] { border: var(--BORDER-WIDTH) solid var(--COLOR-BORDER); } .palette--dark .siblings__swatch--colors[aria-current=true] .siblings__button[data-swatch=black i] { border: var(--inner-offset) solid var(--COLOR-WHITE-ALPHA-50); } .palette--dark .siblings__swatch--colors[aria-current=true] .siblings__button[data-swatch=black i]:after { border-color: var(--COLOR-WHITE); } .palette--dark .siblings__swatch--colors.siblings__swatch--sold-out .siblings__button[data-swatch=white i]:before { background: var(--COLOR-BLACK); } .palette--dark .siblings__swatch--image[aria-current=true] .siblings__button[data-swatch=black i]:after { border-color: var(--text); } .products-list-section { background-color: var(--bg); } .products-list__heading { margin-bottom: 15px; text-align: left; } .products-list__tabs { padding: 0 50px 0 0; width: 50%; } @media only screen and (max-width: 1023px) { .products-list__tabs { width: 100%; padding: 0; } } @media only screen and (max-width: 767px) { .products-list__nav__wrapper { overflow: hidden; margin-left: calc(var(--gutter-mobile) * -1); margin-right: calc(var(--gutter-mobile) * -1); } } .products-list__nav { margin-left: 0; margin-bottom: 30px; } @media only screen and (max-width: 767px) { .products-list__nav { display: flex; overflow-x: scroll; overflow-y: hidden; padding: 0 var(--gutter-mobile); scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .products-list__nav::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } } .products-list__nav__button { --underline-thickness: var(--BORDER-WIDTH); margin-bottom: 9px; text-align: left; -webkit-appearance: none; -moz-appearance: none; appearance: none; position: relative; word-break: break-word; } .products-list__nav__button span { opacity: 0.5; transition: opacity 0.3s ease, background-size 0.3s ease; background: linear-gradient(to bottom, currentColor, currentColor); background-size: 100% 0em; background-position: 0 100%; background-repeat: no-repeat; } @media only screen and (max-width: 767px) { .products-list__nav__button { font-size: calc(1.4375rem * var(--adjust-heading)); font-weight: var(--FONT-WEIGHT-BODY-MEDIUM); margin-right: var(--grid-gutter); margin-bottom: 0; white-space: nowrap; } .products-list__nav__button:last-child { margin: 0; } } .products-list__nav__button:hover span, .products-list__nav__button--active span { opacity: 1; } .products-list__nav__button--active span { background-size: 100% var(--underline-thickness); } .products-list__nav__button--active:only-child span { background-size: 100% 0em; } .products-list__nav__button--active:only-child:hover span { background-size: 100% var(--underline-thickness); } .products-list__container { position: relative; } @media only screen and (min-width: 768px) { .products-list__container { padding-right: calc((100% + var(--gutter)) / 2); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .products-list__container { padding-right: calc((100% + var(--gutter-mobile)) / 2); } } .products-list__item { display: none; height: 0; visibility: hidden; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .products-list__item .flickity-slider .products-list__item__image, .products-list__item .flickity-slider .products-list__item__content { width: 100%; opacity: 0 !important; transition: opacity 0.5s, z-index 1s; } .products-list__item .flickity-slider .products-list__item__image.is-selected, .products-list__item .flickity-slider .products-list__item__content.is-selected { opacity: 1 !important; } .no-js .products-list__item { opacity: 1; visibility: visible; height: 100%; display: block; } .products-list__item:not(.products-list__item--active) .flickity-prev-next-button { display: none; } .products-list__item video { pointer-events: none; } .products-list__item--active { height: auto; overflow: initial; opacity: 1; visibility: visible; display: block; } .products-list__item__contents { position: relative; } .products-list__item__content { position: absolute; top: 0; opacity: 0; padding-top: 18px; } .products-list__item__content:first-child { position: relative; opacity: 1; } @media only screen and (min-width: 768px) { .products-list__item__content { width: 66.6666666667%; } } .products-list__item__content .btn, .products-list__item__content .shopify-payment-button__button--unbranded { margin-top: 50px; } .products-list__item__title { margin: 0; } .products-list__item__title-text { margin-right: 14px; } .products-list__item__description { margin: 0; font-size: calc(1.1rem * var(--adjust-body)); } .products-list__item__description p { margin-bottom: 0; } .products-list__item__aside { position: relative; margin-bottom: 30px; } @media only screen and (min-width: 768px) { .products-list__item__aside { position: absolute; right: 0; top: 0; width: calc((100% - var(--gutter)) / 2); margin-bottom: 0; } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .products-list__item__aside { width: calc((100% - var(--gutter-mobile)) / 2); } } .products-list__item__aside .placeholder-svg, .products-list__item__aside .placeholder-svg-filled { position: absolute; top: 50%; left: 50%; width: 100%; height: 200%; max-height: 200%; transform: translate(-50%, -50%); } .products-list__item__aside .product-single__media img { object-fit: cover; } .no-js .products-list__item__aside { position: initial; } .products-list__item__images--overlap .products-list__item__image--main { width: 75%; } .products-list__item__image { position: relative; filter: brightness(var(--filter-bg)); } .products-list__item__image-bg { display: block; width: 100%; height: 0; padding-top: calc(var(--aspect-ratio) * 100%); background-position: left center; background-repeat: no-repeat; background-size: cover; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; filter: brightness(var(--filter-bg)); } @media only screen and (min-width: 768px) { .products-list__item__image-bg { background-position: center center; } } .products-list__item__image--main { display: block; } .products-list__item__image--small { position: absolute; top: 50%; right: 0; width: 40%; transform: translateY(-50%); } .products-list__item__image--small .products-list__item__image__frame { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); } .products-list__price { margin-right: 12px; } .products-list__price:last-child { margin-right: 0; } .product-list__circle-text { position: absolute; top: 0; left: 0; z-index: 5; transform: translate(-50%, -50%); } @media only screen and (max-width: 767px) { .product-list__circle-text { top: calc(var(--gutter-mobile) * -1); left: calc(var(--gutter-mobile) * -1); transform: none; } } /*================ Promotion Row ================*/ .promotion-row { background: var(--bg); } @media only screen and (max-width: 767px) { .promotion-row__inner { overflow: hidden; margin: 0 calc(var(--gutter-mobile) * -1); } } .promotion-row__grid { grid-template-columns: minmax(0, 1fr); } @media only screen and (min-width: 768px) { .promotion-row__grid { display: grid; gap: var(--grid-gutter); grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media only screen and (max-width: 767px) { .promotion-row__grid.grid--mobile { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; } } .promotion-row__item { width: 100%; min-height: var(--min-height); position: relative; display: flex; align-items: center; justify-content: center; background: var(--bg); color: var(--text); margin-right: 0; overflow: hidden; } @media only screen and (min-width: 768px) and (max-width: 1023px) { .promotion-row__item:not(:last-child) { margin-top: 0; } } @media only screen and (max-width: 767px) { .promotion-row__item { min-height: 0; } } @media only screen and (max-width: 767px) { .carousel--mobile .promotion-row__item.carousel__item { width: var(--item-width-mobile); display: flex; } } .promotion-row__item__link { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 5; } .promotion-row__item__image-bg { display: flex; align-items: center; justify-content: center; } .promotion-row__item__content { width: 100%; padding: var(--inner); position: relative; z-index: 5; } @media only screen and (max-width: 767px) { .promotion-row__item__content { padding: calc(var(--inner) * 1.5); } } .promotion-row__item__link~.promotion-row__item__content { pointer-events: none; } .promotion-row__item__link~.promotion-row__item__content a { pointer-events: auto; } .promotion-row__item--1 { grid-area: column1; } .promotion-row__item--2 { grid-area: column2; } .promotion-row__item--3 { grid-area: column3; } .promotion-row__item--4 { grid-area: column4; } @media only screen and (max-width: 767px) { .promotion-row__inner--1 { margin: 0; } } .promotion-row__inner--1 .promotion-row__grid { display: block; } @media only screen and (max-width: 767px) { .promotion-row__inner--1 .promotion-row__grid { padding: 0; } } @media only screen and (max-width: 767px) { .promotion-row__inner--1 .carousel--mobile { padding: 0; overflow: visible; gap: 0; } } .promotion-row__inner--1 .promotion-row__item.carousel__item, .promotion-row__inner--1 .promotion-row__item { width: 100%; } .promotion-row__inner--2 .promotion-row__grid { grid-template-areas: "column1""column2"; } @media only screen and (min-width: 768px) { .promotion-row__inner--2 .promotion-row__grid { grid-template-areas: "column1 column1 column2 column2"; } } .promotion-row__inner--3 .promotion-row__grid { grid-template-areas: "column1""column2""column3"; } @media only screen and (min-width: 768px) { .promotion-row__inner--3 .promotion-row__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-areas: "column1 column1 column1 column1 column2 column2 column2 column2 column3 column3 column3 column3"; } } .promotion-row__inner--4 .promotion-row__grid { grid-template-areas: "column1""column2""column3""column4"; } @media only screen and (min-width: 768px) { .promotion-row__inner--4 .promotion-row__grid { grid-template-areas: "column1 column2 column3 column4"; } } @media only screen and (min-width: 1024px) { .promotion-row__inner--2 .promotion-row__grid--enlarge-1 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "column1 column1 column2"; } } @media only screen and (min-width: 1024px) { .promotion-row__inner--2 .promotion-row__grid--enlarge-2 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "column1 column2 column2"; } } @media only screen and (min-width: 1024px) { .promotion-row__inner--3 .promotion-row__grid--enlarge-1 { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-areas: "column1 column1 column2 column3"; } } @media only screen and (min-width: 1024px) { .promotion-row__inner--3 .promotion-row__grid--enlarge-2 { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-areas: "column1 column2 column2 column3"; } } @media only screen and (min-width: 1024px) { .promotion-row__inner--3 .promotion-row__grid--enlarge-3 { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-areas: "column1 column2 column3 column3"; } } @media only screen and (min-width: 768px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-1 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "column1 column1 column1""column2 column3 column4"; } } @media only screen and (min-width: 768px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-2 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "column2 column2 column2""column1 column3 column4"; } } @media only screen and (min-width: 768px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "column1 column2 column4""column3 column3 column3"; } } @media only screen and (min-width: 768px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-4 { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "column1 column2 column3""column4 column4 column4"; } } .promotion-row__item__content p { margin: 0 0 calc(var(--inner) / 2); } .promotion-row__item__heading { color: var(--text); margin-bottom: calc(var(--inner) / 2); line-height: 1.2; } @media only screen and (max-width: 1439px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none .promotion-row__item__heading { font-size: calc(1.4rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none .promotion-row__item__heading { font-size: calc(1.25rem * var(--adjust-heading)); } } @media only screen and (max-width: 1439px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none .promotion-row__item__heading sup { font-size: calc(0.6rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none .promotion-row__item__heading sup { font-size: calc(0.5rem * var(--adjust-heading)); } } @media only screen and (max-width: 1439px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none .promotion-row__item__heading small { font-size: calc(0.6rem * var(--adjust-heading)); margin-left: calc(-0.8rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none .promotion-row__item__heading small { font-size: calc(0.5rem * var(--adjust-heading)); margin-left: calc(-0.75rem * var(--adjust-heading)); } } @media only screen and (max-width: 1023px) { .promotion-row__inner--4 .carousel--mobile { --item-width-mobile: calc((var(--wrapper-width) - var(--grid-gutter)) / 2.2); display: flex; flex-flow: row nowrap; justify-content: flex-start; gap: normal; margin: 0; overflow-x: scroll; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scroll-padding: var(--gutter-mobile); padding-left: var(--gutter-mobile); scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .promotion-row__inner--4 .carousel--mobile::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .promotion-row__inner--4 .carousel--mobile .grid__item, .promotion-row__inner--4 .carousel--mobile .carousel__item { float: none; flex: 0 0 auto; scroll-snap-align: start; margin-right: var(--grid-gutter); padding-bottom: 0; width: var(--item-width-mobile); } .promotion-row__inner--4 .carousel--mobile .grid__item:last-child, .promotion-row__inner--4 .carousel--mobile .carousel__item:last-child { margin-right: 0; } .promotion-row__inner--4 .carousel--mobile::after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } @media only screen and (max-width: 767px) { .promotion-row__inner--4 .carousel--mobile { --item-width-mobile: calc(var(--wrapper-width) - var(--grid-gutter)); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .promotion-row__inner--4 .promotion-row__grid--enlarge-none.grid--mobile { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "column1 column2""column3 column4"; } } .promotion-row__item__heading.text-highlight-wrapper--squiggle .text-highlight__icon { bottom: -5px; } .promotion-row__item__heading.text-highlight-wrapper--squiggle { margin-bottom: calc(var(--heading-margin) + 5px); } .promotion-row__item__heading--haspercentoff .text-highlight { white-space: nowrap; } .promotion-row__item__heading sup { top: -1.1em; font-size: calc(0.65rem * var(--adjust-heading)); line-height: 1; margin-left: 5px; } @media only screen and (max-width: 1439px) { .promotion-row__item__heading sup { top: -1em; font-size: calc(0.6rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .promotion-row__item__heading sup { font-size: calc(0.5rem * var(--adjust-heading)); } } .promotion-row__item__heading small { font-size: calc(0.65rem * var(--adjust-heading)); margin-left: calc(-0.85rem * var(--adjust-heading)); } @media only screen and (max-width: 1439px) { .promotion-row__item__heading small { font-size: calc(0.6rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .promotion-row__item__heading small { font-size: calc(0.5rem * var(--adjust-heading)); margin-left: calc(-0.75rem * var(--adjust-heading)); } } .promotion-row__item-description { margin-bottom: var(--inner); } .promotion-row__item__button { margin-left: 0; margin-right: 0; } .promotion-row__item__button:not(:last-child) { margin-bottom: calc(var(--inner) / 2); } .promotion-row__item__content> :last-child { margin-bottom: 0; } .pswp { z-index: 10000; } .pswp .pswp__bg { background: var(--black-alpha-60); } .pswp .pswp__zoom-wrap { display: flex; flex-direction: column; justify-content: center; } .pswp .pswp__custom-inner { max-width: 920px; width: 100%; padding: 0 10px; margin: 0 auto; font-size: 0; text-align: center; } .pswp .pswp__custom-inner:before { display: inline-block; width: 0; height: 100%; vertical-align: middle; content: ""; } .pswp .pswp__custom-content { display: inline-block; width: 100%; vertical-align: middle; } .pswp .pswp__custom-iframe-outer { overflow: hidden; position: relative; width: 100%; height: 0; padding-top: 56.25%; } .pswp .pswp__custom-iframe-outer>video, .pswp .pswp__custom-iframe-outer iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .pswp .pswp__button { display: none; padding: 0; line-height: 1; font-size: 100%; } .pswp .pswp__custom-close { display: block; position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; padding: 12px; z-index: 4; border: 0; background-color: var(--bg); color: var(--text); text-align: center; } .pswp .pswp__custom-close:hover .icon-close { transform: rotate(90deg); } .pswp .pswp__counter { display: none; position: absolute; bottom: 0; right: 0; white-space: nowrap; font-size: calc(0.875rem * var(--adjust-body)); line-height: 24px; padding: 10px 20px; color: var(--text); background: var(--text-alpha-5); } .pswp .pswp__loader { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; transition: opacity 0.4s, visibility 0.4s; } .pswp .pswp__loader .loader__image { visibility: initial; } .pswp--not-close-btn .pswp__custom-close { display: none; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] { position: fixed; display: block; opacity: 1 !important; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__img--placeholder { display: none; } .pswp-zoom-gallery .pswp__loader { opacity: 0; visibility: hidden; transition-delay: 0.8s; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__loader, .pswp-zoom-gallery .pswp__loader { z-index: 5; display: block; background: var(--bg); } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__bg, .pswp-zoom-gallery .pswp__bg { background: var(--bg); } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__container, .pswp-zoom-gallery .pswp__container { transition: transform 0.7s cubic-bezier(0.645, 0.045, 0.355, 1); } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__zoom-wrap, .pswp-zoom-gallery .pswp__zoom-wrap { display: block; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__item, .pswp-zoom-gallery .pswp__item { overflow: visible; } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__item, .pswp-zoom-gallery .pswp__item { overflow: hidden; } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__button--arrow--right, .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__button--arrow--left, .pswp-zoom-gallery .pswp__button--arrow--right, .pswp-zoom-gallery .pswp__button--arrow--left { display: block; position: absolute; top: 50%; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__button--arrow--left, .pswp-zoom-gallery .pswp__button--arrow--left { left: 10px; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__button--arrow--right, .pswp-zoom-gallery .pswp__button--arrow--right { right: 10px; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumbs, .pswp-zoom-gallery .pswp__thumbs { position: absolute; bottom: -146px; left: 0; z-index: 2; overflow-x: auto; width: 100%; padding: 10px 10px 16px; font-size: 0; text-align: center; white-space: nowrap; -webkit-overflow-scrolling: touch; display: none; } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumbs, .pswp-zoom-gallery .pswp__thumbs { bottom: 0; padding: 10px 0; } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumb, .pswp-zoom-gallery .pswp__thumb { display: inline-block; width: 80px; height: 80px; border-radius: 50%; border: var(--BORDER-WIDTH) solid transparent; margin: 10px; background: var(--bg) no-repeat center center/105%; color: inherit; vertical-align: top; transition: border 0.2s, transform 0.2s; transition: all 0.2s ease-in-out; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumb:hover, .pswp-zoom-gallery .pswp__thumb:hover { transform: scale(1.1); } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumb, .pswp-zoom-gallery .pswp__thumb { width: 42px; height: 42px; } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumb.is-current, .pswp-zoom-gallery .pswp__thumb.is-current { border-color: var(--bg); } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumb.is-current, .pswp-zoom-gallery .pswp__thumb.is-current { transform: scale(1.4); } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption, .pswp-zoom-gallery .pswp__caption { display: none; position: absolute; z-index: 1; top: 30px; left: 30px; max-width: 50vw; padding: 10px 20px 10px 50px; background: var(--bg); } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption, .pswp-zoom-gallery .pswp__caption { top: 50px; left: 10px; max-width: 250px; max-width: calc(100% - 80px); padding: 7px 14px 7px 7px; } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption .pswp__caption__center *:not(.product__title), .pswp-zoom-gallery .pswp__caption .pswp__caption__center *:not(.product__title) { display: none; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption .product__link-holder, .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption .product__badge, .pswp-zoom-gallery .pswp__caption .product__link-holder, .pswp-zoom-gallery .pswp__caption .product__badge { display: none; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption h1, .pswp-zoom-gallery .pswp__caption h1 { margin: 0 0 5px; font-size: calc(1.375rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption h1, .pswp-zoom-gallery .pswp__caption h1 { font-size: calc(1rem * var(--adjust-heading)); } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption h1:last-child, .pswp-zoom-gallery .pswp__caption h1:last-child { margin-bottom: 0; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption div, .pswp-zoom-gallery .pswp__caption div { margin-top: 0; font-size: calc(1rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption div, .pswp-zoom-gallery .pswp__caption div { font-size: calc(0.875rem * var(--adjust-body)); } } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption div:last-child, .pswp-zoom-gallery .pswp__caption div:last-child { margin-bottom: 0; } .pswp[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__caption--fake, .pswp-zoom-gallery .pswp__caption--fake { display: none; } .pswp-zoom-gallery--single[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__button--arrow--right, .pswp-zoom-gallery--single[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__button--arrow--left, .pswp-zoom-gallery--single[data-pswp-option-classes*=pswp-zoom-gallery] .pswp__thumbs, .pswp-zoom-gallery--single .pswp__button--arrow--right, .pswp-zoom-gallery--single .pswp__button--arrow--left, .pswp-zoom-gallery--single .pswp__thumbs { display: none; } .pswp--notification { transition: opacity 0.3s ease; } .pswp--notification .pswp__container { -webkit-user-select: auto; user-select: auto; } .pswp--notification .pswp__zoom-wrap { transition: none; } .pswp--notification .pswp__scroll-wrap { width: 100vw; } /* * Quick view */ .popup-quick-view { --inner: 25px; position: fixed; bottom: 0; min-width: 320px; height: auto; overflow: visible; pointer-events: none; } .popup-quick-view .pswp__bg { left: -100vw; width: 200vw; background: rgba(0, 0, 0, 0.2); } @media only screen and (max-width: 767px) { .popup-quick-view .pswp__bg { top: -100vh; left: 0; width: 100vw; height: 200vh; } } .popup-quick-view .pswp__container { -webkit-user-select: auto; user-select: auto; } @media only screen and (max-width: 767px) { .popup-quick-view .pswp__zoom-wrap { justify-content: flex-end; } } @media only screen and (max-width: 767px) { .popup-quick-view .product-single__gallery { margin-bottom: 0; } } .popup-quick-view .flickity-slider { display: flex; align-items: center; } .popup-quick-view .product-single__media-slide { margin-right: 10px; } .popup-quick-view .product-single__media { padding-top: 100%; } .popup-quick-view .product-single__media img { object-fit: cover; } .popup-quick-view .product-single__media--image-height { display: none; } .popup-quick-view .product__price { align-items: center; font-size: calc(1rem * var(--adjust-body)); line-height: 1.25; } @media only screen and (max-width: 767px) { .popup-quick-view .product__price { font-size: calc(0.875rem * var(--adjust-body)); } } .popup-quick-view .product__price--off { padding: 4px 9px; } .popup-quick-view .product__rating { line-height: 1.25; cursor: default; } @media only screen and (max-width: 767px) { .popup-quick-view .product__rating { font-size: calc(0.8rem * var(--adjust-body)); } } @media only screen and (max-width: 767px) { .popup-quick-view .rating__star .icon { width: 10px; height: 10px; } } .popup-quick-view .product__unit-price { margin-bottom: 8px; line-height: inherit; } @media only screen and (max-width: 767px) { .popup-quick-view .product__unit-price { margin-top: 0; } } .popup-quick-view .product__notification { width: 100%; } .popup-quick-view .product__notification .contact-form { margin-bottom: var(--form-margin); } .popup-quick-view .product__notification .contact-form:last-child { margin-bottom: 0; } .popup-quick-view .input-group--inline, .popup-quick-view .input-group__item { max-width: none; } .popup-quick-view .select-popout__list__scroll { max-height: 150px; } .popup-quick-view .product__submit__buttons { flex-direction: column; align-items: stretch; margin-right: 0; } @media only screen and (max-width: 767px) { .popup-quick-view .product__submit__buttons { display: flex; gap: 0; } } .popup-quick-view .product__submit__item { max-width: 100%; margin: 0 0 calc(var(--inner) / 2); } @media only screen and (max-width: 767px) { .popup-quick-view .product__submit__item { margin-bottom: var(--form-margin-mobile); } } .popup-quick-view .product__submit__item:last-child { margin-bottom: 0; } .popup-quick-view .product__submit__add, .popup-quick-view .shopify-payment-button { width: 100%; } .popup-quick-view .variant--soldout .product__submit__add { pointer-events: none; } .popup-quick-view .product-cutline { margin: 12px 0 0; line-height: 1.25; } @media only screen and (max-width: 767px) { .popup-quick-view .product-cutline { margin-top: 10px; font-size: calc(0.8rem * var(--adjust-body)); } } @media only screen and (max-width: 767px) { .popup-quick-view .variant__countdown { font-size: calc(0.75rem * var(--adjust-body)); } } .popup-quick-view__inner { width: var(--drawer-width); max-width: 100%; display: block; margin-left: auto; position: relative; } @media only screen and (max-width: 767px) { .popup-quick-view__inner { width: 100%; } } .popup-quick-view__form { display: block; background: var(--bg); box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); gap: 0; overflow: hidden; z-index: 10; } @media only screen and (max-width: 767px) { .popup-quick-view__form { border-radius: 20px 20px 0 0; } } .palette--light .popup-quick-view__form--onboarding .swatch__button .swatch__label[data-swatch=white i] { --swatch: #FFF; } .palette--light .popup-quick-view__form--onboarding .swatch__button .swatch__label[data-swatch=grey i] { --swatch: #808080; } .palette--light .popup-quick-view__form--onboarding .swatch__button .swatch__label[data-swatch=black i] { --swatch: #000; } .popup-quick-view__wrapper { display: flex; flex-direction: column; width: 100%; height: 100vh; max-width: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .popup-quick-view__wrapper::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } @media only screen and (max-width: 767px) { .popup-quick-view__wrapper { height: auto; max-height: 80vh; } } .popup-quick-view__body { position: relative; z-index: 1; flex: 1; padding: var(--inner); width: 100%; min-height: 250px; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; for Internet Explorer, Edge */ */ } .popup-quick-view__body::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } @media only screen and (max-width: 767px) { .popup-quick-view__body { padding: var(--inner) var(--inner) calc(var(--form-margin-mobile) * 3); } } @media only screen and (max-width: 767px) and (orientation: landscape) { .popup-quick-view__body { min-height: 200px; } } .popup-quick-view__body__inner { display: grid; } .popup-quick-view__foot { position: relative; z-index: 5; width: 100%; padding: calc(var(--inner) / 2) var(--inner) var(--inner); margin-top: auto; text-align: center; } @media only screen and (max-width: 767px) { .popup-quick-view__foot { padding-top: 0; } } .popup-quick-view__foot:before { content: ""; position: absolute; right: 0; bottom: 100%; left: 0; height: 25px; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--bg) 100%); pointer-events: none; } @media only screen and (max-width: 767px) { .popup-quick-view__foot:before { height: 24px; } } .popup-quick-view__foot__inner { position: relative; } .popup-quick-view__title { margin-bottom: 10px; font-size: calc(1.5rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { .popup-quick-view__title { margin-bottom: var(--form-margin-mobile); } } .popup-quick-view__close { position: absolute; top: 8px; right: 0; width: 54px; height: 54px; padding: 18px; color: inherit; text-decoration: none; top: 0; } .popup-quick-view__close svg { display: block; width: 100%; height: 100%; transition: transform 0.3s ease; pointer-events: none; } .popup-quick-view__close:hover svg { transform: rotate(90deg); } .popup-quick-view__nav { margin-bottom: calc(var(--inner) / 1.5); border-bottom: var(--BORDER-WIDTH) solid var(--COLOR-BORDER); padding: 0 calc(var(--inner) / 2) calc(var(--inner) / 1.5) 0; } .popup-quick-view__nav-thumbs { max-width: 70%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); } .popup-quick-view__nav-thumb { display: block; padding-right: calc(var(--inner) / 1.5); } .popup-quick-view__nav-media { position: relative; } .popup-quick-view__nav-media::before { content: ""; position: absolute; top: -4px; left: -4px; border: var(--BORDER-WIDTH) solid var(--COLOR-BORDER); width: calc(100% + 8px); height: calc(100% + 8px); opacity: 0; visibility: hidden; } .popup-quick-view__nav-media .product-single__thumbnail, .popup-quick-view__nav-media .popup-quick-view__thumbnail { overflow: hidden; padding: 100% 0 0; background-color: var(--COLOR-BG); filter: brightness(var(--product-filter-bg)); } .popup-quick-view__nav-media .product-single__thumbnail-img, .popup-quick-view__nav-media .placeholder-svg, .popup-quick-view__nav-media .placeholder-svg-filled, .popup-quick-view__nav-media .no-image-placeholder { position: absolute; top: 0; left: 0; } .popup-quick-view__nav-media .icon { margin: 2px; width: 16px; height: 16px; } .popup-quick-view__nav-thumbs--first-active { margin-left: 4px; } .popup-quick-view__nav-thumb.is-loading { pointer-events: none; } .popup-quick-view__nav-thumb.is-active .popup-quick-view__nav-media::before { opacity: 1; visibility: visible; } .popup-quick-view__view-button { display: inline-block; margin-top: 10px; background-color: var(--bg); text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); font-size: calc(0.9rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .popup-quick-view__view-button { margin-top: 25px; font-size: calc(0.75rem * var(--adjust-body)); } } .popup-quick-view__view-button:hover { text-decoration: none; } @media only screen and (max-width: 767px) { .popup-quick-view__view-button--desktop { display: none; } } .popup-quick-view__foot__inner { opacity: 0; } @media only screen and (max-width: 767px) { .popup-quick-view__foot__inner { opacity: 1; } } /* Layout Image Small */ .popup-quick-view__form--small .popup-quick-view__title { font-size: calc(1rem * var(--adjust-heading)); } @media only screen and (max-width: 767px) { .popup-quick-view__form--small .popup-quick-view__title { padding-right: calc(var(--inner) / 2); } } .popup-quick-view__form--small .popup-quick-view__body__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--inner); margin-bottom: var(--form-margin); } @media only screen and (max-width: 767px) { .popup-quick-view__form--small .popup-quick-view__body__inner { margin-bottom: var(--form-margin-mobile); } } .popup-quick-view__form--small .popup-quick-view__content { order: 2; } .popup-quick-view__form--small .flickity-button { display: none; } .popup-quick-view__form--small .popup-quick-view__content { padding: 8px 0; } @media only screen and (max-width: 767px) { .popup-quick-view__form--small .popup-quick-view__content { padding: 0; } } .popup-quick-view__form--small .product__price { flex-direction: column; margin-right: 0; align-items: flex-start; } .popup-quick-view__form--small .product__price--sale, .popup-quick-view__form--small .product__price--compare { margin-right: 0; } .popup-quick-view__form--small .product__price--sale { margin-bottom: 2px; } .popup-quick-view__form--small .product__price--compare { margin-bottom: 10px; } @media only screen and (max-width: 767px) { .popup-quick-view__form--small .product__price--compare { margin-bottom: var(--form-margin-mobile); } } .popup-quick-view__form--small .product__price--compare+.product__unit-price { margin-top: -6px; margin-bottom: 10px; } .popup-quick-view__form--small .product__unit-price { margin-top: 0; } @media only screen and (max-width: 767px) { .popup-quick-view__form--small .select-popout__list { top: auto; bottom: 100%; margin: 0 0 5px; } } @media only screen and (min-width: 768px) { .popup-quick-view__form--small .product-cutline { margin-top: 10px; } } /* Layout Image Large */ .popup-quick-view__form--large .popup-quick-view__body__inner { margin-bottom: var(--form-margin); } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .popup-quick-view__body__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--inner); } } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .flickity-button { display: none; } } .popup-quick-view__form--large .product-single__media-slider { margin-right: calc(var(--inner) * -1); } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product-single__media-slider { margin-right: 0; } } .popup-quick-view__form--large .product-single__media-slider .flickity-prev-next-button.next { right: calc(var(--inner) + var(--flickity-btn-position)); } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product-single__media-slider .flickity-prev-next-button.next { right: 0; } } .popup-quick-view__form--large .product-single__media-slide { width: 84%; } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product-single__media-slide { width: 100%; } } .popup-quick-view__form--large .product-single__media-slide:only-child { width: 100%; padding-right: var(--inner); } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product-single__media-slide:only-child { padding-right: 0; } } .popup-quick-view__form--large .product-single__media-slide:not(.is-selected) .deferred-media:not([loaded]) { background: none; } .popup-quick-view__form--large .popup-quick-view__content { margin-bottom: var(--form-margin); } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .popup-quick-view__content { order: 2; margin-bottom: 0; } } .popup-quick-view__form--large .popup-quick-view__title { padding-right: var(--inner); } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .popup-quick-view__title { padding-right: calc(var(--inner) / 2); font-size: calc(1rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product__price { margin-right: 0; flex-direction: column; align-items: flex-start; } } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product__price--sale, .popup-quick-view__form--large .product__price--compare { margin-right: 0; } } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product__price--compare { margin-bottom: 10px; } } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product__price--compare+.product__unit-price { margin-top: -6px; margin-bottom: 10px; } } @media only screen and (max-width: 767px) { .popup-quick-view__form--large .product__price--sale { margin-bottom: 2px; } } .popup-quick-view__form--large .select-popout__list { top: auto; bottom: 100%; margin: 0 0 5px; } /* Animation Related */ .popup-quick-view .pswp__bg { transition: opacity 0.4s ease-in-out; } .popup-quick-view--animate-in { animation: quickViewAnimateInLeft 0.4s; animation-fill-mode: both; } @media only screen and (max-width: 767px) { .popup-quick-view--animate-in { animation: quickViewAnimateInUp 0.4s ease-in-out; } } @media only screen and (max-width: 767px) { .popup-quick-view--shop-the-look.popup-quick-view--animate-in { pointer-events: none; animation: quickViewAnimateInUp 0.3s ease-in; } } .popup-quick-view--animate-in .popup-quick-view__foot__inner { animation: quickViewAnimateInUp 0.4s; animation-delay: 0.2s; } @media only screen and (max-width: 767px) { .popup-quick-view--animate-in .popup-quick-view__foot__inner { animation: none; } } .popup-quick-view--animated { pointer-events: all; } .popup-quick-view--animated .popup-quick-view__foot__inner { opacity: 1; } .popup-quick-view--animate-out { animation: quickViewAnimateOutRight 0.4s ease-in-out; animation-fill-mode: both; } @media only screen and (max-width: 767px) { .popup-quick-view--animate-out { pointer-events: none; animation: quickViewAnimateOutDown 0.4s ease-in-out; } } @media only screen and (max-width: 767px) { .popup-quick-view--shop-the-look.popup-quick-view--animate-out { animation: quickViewAnimateOutDown 0.3s linear; } } .popup-quick-view--animate-out .pswp__bg { opacity: 0 !important; } @keyframes quickViewAnimateInLeft { from { opacity: 0 !important; transform: translateX(var(--drawer-width)); } to { opacity: 1 !important; transform: translateZ(0); } } @keyframes quickViewAnimateInUp { from { opacity: 0; transform: translateY(100%); } to { opacity: 1; transform: translateZ(0); } } @keyframes quickViewAnimateOutRight { from { transform: translateZ(0); } to { transform: translateX(var(--drawer-width)); } } @keyframes quickViewAnimateOutDown { from { opacity: 1; transform: translateZ(0); } to { opacity: 0; transform: translateY(100%); } } /*================ Recommended posts ================*/ .recommended-posts .section__heading { margin-bottom: var(--grid-gutter); } .recommended-posts .blog__post--two-col { grid-template-columns: repeat(4, minmax(0, 1fr)); } @media only screen and (max-width: 479px) { .recommended-posts .blog__post--two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .recommended-posts .blog__post-item { grid-column: span 2; } .recommended-posts .blog__post-item:only-of-type { grid-column-start: 2; grid-column-end: 4; } @media only screen and (max-width: 479px) { .recommended-posts .blog__post-item:only-of-type { grid-column-start: 1; grid-column-end: 3; } } .recommended-posts .rte { margin-bottom: 10px; } /*================ Related products ================*/ .related-products { text-align: center; overflow: hidden; } /*================ Rich text ================*/ .rich-text { width: 100%; position: relative; } .rich-text__top-image { position: relative; overflow: hidden; display: inline-block; margin-bottom: 10px; } .rich-text__top-image-img { display: block; max-width: 100%; height: auto; margin: auto; } .rich-text__heading { margin-bottom: 12px; } .rich-text__heading p { margin: 0; } .rich-text__text p:last-child { margin-bottom: 0; } /*================ Search Form ================*/ .search-form { position: relative; display: block; } .search-form__inner { display: flex; padding: 11px var(--gutter); min-height: var(--header-sticky-height); width: 100%; background: var(--bg); } @media only screen and (max-width: 767px) { .search-form__inner { padding: 8px var(--gutter-mobile); } } .search-form__input-holder { position: relative; margin: 0 auto; max-width: var(--width); width: 100%; background: var(--input-bg); } .search-form__input { --input-bg: var(--bg-accent); width: 100%; border: 0; margin: 0; padding: 9px 66px; color: var(--text); text-align: left; } @supports (-webkit-touch-callout: none) { .search-form__input { font-size: max(1rem * var(--FONT-ADJUST-BODY), 16px); } } @media only screen and (max-width: 767px) { .search-form__input { padding-left: 46px; padding-right: 35px; } } .search-form__input::placeholder { color: var(--text); } .search-form__input:focus, .search-form__input:active { box-shadow: none; } .search-form__label { position: absolute; top: 48%; left: 0; transform: translateY(-50%); padding: 0; line-height: normal; } @media only screen and (max-width: 767px) { .search-form__label { left: 0; } } .search-form__label .icon { width: var(--icon-size, 26px); height: var(--icon-size, 26px); stroke-width: calc(var(--STROKE-WIDTH) - 4px); } /*================ Search page ================*/ .search-page { --swatch-size: 30px; background-color: var(--bg); } .search-page .swatch__button .icon-check { width: 15px; } .search-page .blog__post-item { width: 100%; } .search-page .collection__wrapper { min-height: 0; } .search-page [data-tab=resultsProducts], .search-page [data-all-types-container] { padding-top: 8px; } @media only screen and (min-width: 768px) { .search-page [data-tab=resultsProducts], .search-page [data-all-types-container] { padding-top: calc(var(--gutter) / 2); } } @media only screen and (min-width: 1440px) { .search-page [data-tab=resultsProducts], .search-page [data-all-types-container] { padding-top: 40px; } } .search-page [data-tab=resultsArticles] { padding-top: 38px; } @media only screen and (min-width: 1440px) { .search-page [data-tab=resultsArticles] { padding-top: 55px; } } .search-page [data-tab=resultsPages] { padding-top: 24px; } @media only screen and (min-width: 1440px) { .search-page [data-tab=resultsPages] { padding-top: 33px; } } .search-page .tab:not(.current) { padding-top: 0; } .search-page .tab:not(.current) * { height: 0; overflow: hidden; visibility: hidden; } .search-page .grid--center { gap: calc(var(--grid-gutter) / 2); } @media only screen and (max-width: 767px) { .search-page .collection__sticky-bar { /* justify-content: flex-end;*/ } } @media only screen and (min-width: 768px) { .collection__filters { --full-height: 97vh; top: 0; margin-top: calc(-1 * var(--collection-sticky-bar-height)); z-index: 3; } } @media only screen and (min-width: 768px) { .search-page .collection__filters-header { display: none; } } @media only screen and (min-width: 768px) { .collection__filters-list__inner { padding-top: 20px; } } .search-page--products-disabled .collection__sticky-bar, .search-page--products-disabled .collection__filters { display: none; } .search-page.blog--standard .collection__wrapper .blog__post-image-link { overflow: hidden; } .search-page.blog--photo .collection__wrapper .blog__post-image, .search-page.blog--photo .collection__wrapper .blog__post-image-link { height: 100%; } .search-page.blog--photo .collection__wrapper .blog__post-image { padding-top: var(--PRODUCT-MEDIA-PADDING-TOP); } @media only screen and (min-width: 768px) { .search-page:not(.search-page--filters-disabled) .collection__sort-bar { /* margin-left: 240px;*/ } } @media only screen and (min-width: 1024px) { .search-page:not(.search-page--filters-disabled) .collection__sort-bar { /* margin-left: calc(240px + var(--gutter) / 2);*/ } } @media only screen and (min-width: 1440px) { .search-page:not(.search-page--filters-disabled) .collection__sort-bar { /* margin-left: calc(300px + var(--gutter) / 2);*/ } } @media only screen and (min-width: 768px) { .search-page--sorting-disabled .collection__filters { top: 0; margin-top: 0; } } @media only screen and (min-width: 768px) { .search-page--sorting-disabled .collection__sticky-bar { display: none; } } @media only screen and (min-width: 768px) { .search-page--filters-disabled .collection__filters { display: none; } } [data-tab=resultsPages] .search-page__note { padding-top: 14px; } @media only screen and (min-width: 1440px) { [data-tab=resultsPages] .search-page__note { padding-top: 22px; } } .search-page__note p { margin: 0; } .search-page__title { padding: 20px var(--gutter); text-align: center; } .search-page__head { position: relative; z-index: 6; } .search-page__head .h2 { margin: calc(var(--inner) / 1.5) 0 0; } .search-page__nav { padding-top: calc(var(--inner) / 2); display: none; } @media only screen and (max-width: 1439px) { .search-page__nav { padding-top: calc(var(--inner) / 3); } } @media only screen and (max-width: 767px) { .search-page__nav { padding-top: 0; } } .search-page__nav .tabs__link { font-size: inherit; font-weight: inherit; } .search-page__nav .type-stack-nav { font-size: calc(0.9rem * var(--adjust-nav)); } .search-page__nav .tabs-scrollbar { text-align: center; } .search-page__nav .custom-scrollbar { margin-top: 5px; } .search-page__nav .custom-scrollbar__thumb { height: 6px; } .no-js .collection__sticky-bar { display: none; } @media only screen and (min-width: 768px) { .no-js .search-page .collection__filters { margin-top: 0; } } .no-js .search-page__nav .tabs__link { position: relative; } .no-js .search-page__nav .tabs__link>span { display: none; } .no-js .search-page__nav .current:before { content: ""; position: absolute; top: calc(100% + 8px); left: 0; display: block; width: 100%; height: 6px; background: var(--accent); } /*================ Search Result - Page ================*/ .search-result-page { position: relative; padding: calc(var(--inner) / 3); width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; text-decoration: none; } @media only screen and (min-width: 480px) { .search-result-page { padding: calc(var(--gutter) / 4); } } .search-result-page--all-types { padding: 0; } @media only screen and (min-width: 480px) { .search-result-page--all-types { display: grid; grid-template-columns: minmax(0, 1fr); } } @media only screen and (min-width: 480px) { .search-result-page--all-types:before { content: ""; padding-top: var(--PRODUCT-MEDIA-PADDING-TOP); width: 100%; height: 100%; grid-row-start: 1; grid-column-start: 1; border-radius: inherit; background-color: var(--bg-darken); transition: opacity 0.3s ease; opacity: 0.2; } } @media only screen and (min-width: 480px) { .search-result-page--all-types .search-result-page__title { font-size: calc(1.3125rem * var(--adjust-heading)); padding: calc(var(--gutter) / 3); grid-row-start: 1; grid-column-start: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; } } @media only screen and (min-width: 480px) and (max-width: 1439px) { .search-result-page--all-types .search-result-page__title { font-size: calc(1.28rem * var(--adjust-heading)); } } @media only screen and (min-width: 480px) and (max-width: 767px) { .search-result-page--all-types .search-result-page__title { font-size: calc(1.25rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .search-result-page--all-types .search-result-page__title { margin-bottom: 0; font-size: calc(1.4rem * var(--adjust-heading)); } } .search-result-page--results-pages { pointer-events: none; } .search-result-page--results-pages .search-result-page__title { pointer-events: all; margin-bottom: 0; } @media only screen and (min-width: 1440px) { .search-result-page--results-pages .search-result-page__title { font-size: calc(2rem * var(--adjust-heading)); } } @media only screen and (max-width: 767px) { .search-result-page--results-pages .search-result-page__title { font-size: calc(1.4rem * var(--adjust-heading)); } } .select-popout { --form-left: 15px; --arrow-size: 46px; position: relative; margin-bottom: 10px; text-align: left; } .select-popout.sold-out .select-popout__toggle, .select-popout.unavailable .select-popout__toggle { background-color: rgba(0, 0, 0, 0.1); text-decoration: line-through; } .select_size__cover.unavailable .select-popout__toggle, .select-popout.sold-out.select_size__cover .select-popout__toggle { background-color: transparent; text-decoration: none; } [select-data-add-to-cart] { display: none; } .select_size__btn [data-add-to-cart] { display: none; } .select_size__btn [select-data-add-to-cart] { display: block; } button.select-popout__toggle.red__color { border: solid 2px #d01345; } .select-popout>.quantity-selector { display: none; } .select-popout.select-popout--alt>*:not(.quantity-selector) { display: none; } .select-popout.select-popout--alt>.quantity-selector { display: block; } @media only screen and (min-width: 768px) { .select-popout { --form-left: 20px; --arrow-size: 54px; } } .select-popout__toggle { position: relative; overflow: hidden; display: block; width: 100%; padding: var(--form-top) var(--arrow-size) var(--form-top) var(--form-left); border: var(--BORDER-WIDTH) solid var(--text); border-radius: var(--RADIUS); line-height: 1.3; text-align: inherit; white-space: nowrap; text-overflow: ellipsis; letter-spacing: 0.02em; color: var(--text); background: var(--input-bg); font-size: calc(0.875rem * var(--adjust-body)); font-family: var(--FONT-STACK-BODY); } @media only screen and (max-width: 767px) { .select-popout__toggle { font-size: calc(0.75rem * var(--adjust-body)); padding: 10px var(--arrow-size) 10px var(--form-left); } } .select-popout__toggle .icon-select { position: absolute; top: 0; right: 0; width: var(--arrow-size); padding: 0 var(--form-left); height: 100%; transition: transform 0.4s; transform: rotate(90deg); } .select-popout__toggle[aria-expanded=true] .icon-select { transform: rotate(270deg); } .select-popout__list { position: absolute; top: 100%; left: 0; min-width: 100%; overflow: hidden; border: var(--BORDER-WIDTH) solid var(--text); border-radius: var(--RADIUS); margin: 5px 0 0; background: var(--input-bg); opacity: 0; visibility: hidden; z-index: -1; pointer-events: none; transition: opacity 0.15s ease, z-index 0.15s, visibility 0s linear 0.15s; } .select-popout__list .sold-out { background-color: rgba(0, 0, 0, 0.1); } .select-popout__list .unavailable { text-decoration: line-through; background-color: rgba(0, 0, 0, 0.1); } .select-popout__list .please-select-Size.unavailable { text-decoration: none; background-color: transparent; } .please-select-Size.unavailable:hover { color: var(--bg); background-color: #2e2e2e; } .select-popout__list--visible { opacity: 1; visibility: visible; z-index: 110; pointer-events: auto; transition: opacity 0.3s ease, z-index 0s, visibility 0s linear 0s; } .select-popout__list__scroll { overflow-x: hidden; overflow-y: auto !important; max-height: 350px; margin: 0; list-style: none; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; z-index: 99999; position: relative; } .select-popout__item { display: block; margin-bottom: 0; min-width: 100px; color: var(--text); transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out; } .select-popout__item:hover, .select-popout__item.sold-out:hover, .select-popout__item.unavailable:hover { color: var(--bg); background-color: var(--text); } .select-popout__item .select-popout__option span:last-child { /* display: none;*/ /* margin-left: 5px; */ } .site-footer .select-popout__item .select-popout__option span:last-child { display: block; } .select-popout__item.sold-out .select-popout__option span:last-child { display: inline-block !important; margin-left: 5px; } .select-popout__option { display: block; /* padding: 5px var(--form-left);*/ padding: 5px 20px ; color: inherit; font-size: calc(0.875rem * var(--adjust-body)); } @media only screen and (max-width: 767px) { .select-popout__option { font-size: calc(0.75rem * var(--adjust-body)); } } .select-popout--small { max-width: 7.5rem; } .footer__select-popout { display: flex; /* justify-content: center; */ flex-wrap: wrap; /* margin: calc(var(--form-top) * -1) 0; */ } .footer__select-popout .select-popout { margin-bottom: 0; } @media only screen and (max-width: 767px) { .footer__select-popout { --form-left: 15px; justify-content: flex-start; /* margin-left: calc(-1 * var(--form-left));*/ } } .footer__select-popout .select-popout { /* margin-right: 5px; margin-left: 5px; */ margin-bottom: 0; } @media only screen and (max-width: 767px) { .footer__select-popout .select-popout { --form-left: inherit; margin-left: 0; margin-right: 10px; } } .footer__select-popout .select-popout__toggle { color: var(--text); /* background-color: var(--bg); */ background: #F4F4F4; border: none; margin: 0; min-width: 140px; } .footer__select-popout .select-popout__toggle .icon-select { width: var(--arrow-size); padding: 0 var(--form-left); } .footer__select-popout .select-popout__list { top: auto; bottom: 100%; margin: 0 0 5px; background-color: var(--bg); border-radius: var(--RADIUS-SMALL); } .footer__select-popout .select-popout__item--current .select-popout__option span { border-bottom: var(--BORDER-WIDTH) solid var(--border); } /*================ Featured Blog ================*/ .shoppable-blog { overflow: hidden; background-color: var(--bg); } .shoppable-blog a { color: inherit; } .shoppable-blog__heading { text-align: center; } @media only screen and (max-width: 767px) { .shoppable-blog__slider__container { overflow: hidden; margin-left: calc(-1 * var(--gutter-mobile)); margin-right: calc(-1 * var(--gutter-mobile)); } } .shoppable-blog__slider { --flickity-btn-position: calc((var(--gutter) - var(--flickity-btn-size)) / 2); } .shoppable-blog__slider .flickity-viewport { overflow: initial; } @media only screen and (min-width: 768px) { .shoppable-blog__slider:not(.flickity-enabled) { display: flex; flex-flow: row nowrap; text-align: center; overflow-x: scroll; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .shoppable-blog__slider:not(.flickity-enabled)::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .shoppable-blog__slider .flickity-viewport { overflow: initial; } } @media only screen and (max-width: 767px) { .shoppable-blog__slider { display: flex; flex-flow: row nowrap; overflow-x: scroll; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .shoppable-blog__slider::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .shoppable-blog__slider::after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } .shoppable-blog__slider .flickity-button { background: var(--bg); } .wrapper--full-padded .shoppable-blog__slider>.flickity-viewport { overflow: initial; } .blog-item { --item-width: calc(var(--wrapper-width) * 0.9 - var(--grid-gutter)); --item-width-horizontal: calc(var(--item-width) * 2 + var(--grid-gutter)); --item-outer: 40px; position: relative; display: block; width: var(--item-width); flex: 0 0 auto; color: var(--white); text-align: left; line-height: 1.5625; overflow: hidden; } @media only screen and (min-width: 768px) { .blog-item { margin-right: var(--grid-gutter); } .blog-item:last-child { margin-right: 0; } } .blog-item:only-child { margin: 0 auto; } @media only screen and (min-width: 1024px) { .blog-item { --item-width: calc((var(--wrapper-width) - var(--grid-gutter) * 2) / 3); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .blog-item { --item-width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); --item-outer: 25px; } } @media only screen and (max-width: 767px) { .blog-item { --item-width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); --item-outer: 25px; scroll-snap-align: start; padding-left: var(--gutter-mobile); } } @media only screen and (max-width: 479px) { .blog-item { --item-width: calc(var(--wrapper-width) * 0.9 - var(--grid-gutter)); } .blog-item:only-child { --item-width: var(--wrapper-width); } } .blog-item .overlay { z-index: auto; opacity: var(--overlay-opacity); transition: opacity 0.3s ease; } .blog-item:hover .btn--quick, .blog-item:focus-within .btn--quick { opacity: 1; transform: translate(0); } @media only screen and (min-width: 768px) { .blog-item--active .overlay { opacity: 0.5; } } .blog-item--active .blog-item__button__show::after, .blog-item--active .blog-item__button__show:hover::after { animation: none; } .blog-item--no-image { color: var(--text); } .blog-item--no-image .overlay { opacity: 0.03; } .blog-item--no-image .blog-item__article__time { color: var(--bg); background: var(--text); } @media only screen and (min-width: 1024px) { .blog-item--horizontal { width: var(--item-width-horizontal); } .blog-item--horizontal .blog-item__article__content { right: 50%; } } @media only screen and (min-width: 1440px) { .blog-item--horizontal .blog-item__article__content { right: 50%; } } @media only screen and (min-width: 1024px) { .blog-item--horizontal .blog-item__products { max-width: calc(50% - 40px); left: auto; } } .blog-item__article { position: relative; height: calc(var(--item-width) * 1.5); } .blog-item__article:hover .blog-item__article__tag, .blog-item__article:hover .blog-item__article__tag::after { opacity: 1; visibility: visible; transition-delay: 0s; } .blog-item__article:hover .blog-item__article__title { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .blog-item__article__link { position: relative; display: block; height: 100%; overflow: hidden; } .blog-item__article__content { padding: 55px var(--item-outer); position: absolute; top: 0; bottom: 0; left: 0; right: 0; pointer-events: none; } @media only screen and (max-width: 1023px) { .blog-item__article__content { padding: var(--item-outer); } } .blog-item__article__title { color: inherit; margin-bottom: 20px; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } .blog-item__article__tags { margin: 0; list-style: none; display: flex; flex-flow: row wrap; color: inherit; text-transform: uppercase; font-size: calc(0.875rem * var(--adjust-body)); } .blog-item__article__tags a { pointer-events: auto; } .blog-item__article__tag { display: inline-flex; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s linear 0.3s; } .blog-item__article__tag::after { content: "|"; padding: 0 10px; transition: opacity 0.3s ease, visibility 0s linear 0.3s; } .blog-item__article__tag:first-child { opacity: 1; visibility: visible; transition-delay: 0s; } .blog-item__article__tag:first-child::after { opacity: 0; visibility: hidden; } .blog-item__article__tag:last-child::after { content: none; } .blog-item__article__time { font-size: calc(0.875rem * var(--adjust-body)); font-weight: var(--FONT-WEIGHT-BODY-BOLD); position: absolute; bottom: var(--item-outer); left: var(--item-outer); color: var(--bg); background: var(--text); border: none; padding: 2px 8px; text-align: center; text-decoration: none; display: inline-block; border-radius: var(--RADIUS-TINY); } @media only screen and (max-width: 1023px) { .blog-item__article__time { left: var(--item-outer); bottom: var(--item-outer); } } .blog-item__products { position: absolute; right: var(--item-outer); left: var(--item-outer); bottom: var(--item-outer); width: calc(var(--item-width) - var(--item-outer) * 2); opacity: 0; visibility: hidden; transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s linear 0.3s; text-align: center; color: var(--text); background: var(--bg); will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; transform: translate3d(calc(100% + var(--item-outer)), 0, 0); pointer-events: auto; display: none; } @media only screen and (min-width: 768px) { .blog-item__products { display: block; } } .blog-item__products .flickity-prev-next-button { top: calc((var(--item-width) - var(--item-outer) * 2) / 2); background: transparent; box-shadow: none; } @media only screen and (min-width: 1024px) { .blog-item__products .flickity-prev-next-button { top: calc(((var(--wrapper-width) - var(--grid-gutter) * 2) / 3 - var(--item-outer) * 2) / 2); } } .blog-item__products .flickity-prev-next-button.previous { left: 0; } .blog-item__products .flickity-prev-next-button.next { right: 0; } .blog-item__products--visible { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0); transition-delay: 0s; } .blog-item__products--visible .flickity-prev-next-button { opacity: 1; visibility: initial; } .blog-item__products__slider { position: relative; text-align: center; margin: 0 auto; } .blog-item__product { display: block; width: 100%; text-decoration: none; } .blog-item__product__image { z-index: -1; width: 100%; margin-bottom: 20px; filter: brightness(var(--filter-bg)); } .blog-item__product__image .placeholder-svg-filled { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .blog-item__product__details { padding: 0 40px 20px; } @media only screen and (max-width: 767px) { .blog-item__product__details { padding: 0 20px 20px; } } .blog-item__product__title { margin-bottom: 3px; color: inherit; font-size: calc(1.1rem * var(--adjust-body)); font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); display: -webkit-box; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .blog-item__product__price { word-break: break-all; margin: 0; font-size: calc(0.9rem * var(--adjust-body)); } .blog-item__button-wrapper { display: none; position: absolute; right: var(--item-outer); bottom: var(--item-outer); min-width: 40px; height: 40px; } @media only screen and (min-width: 768px) { .blog-item__button-wrapper { display: block; } } .blog-item__button-wrapper .btn--quick { bottom: 0; right: 0; } .blog-item__button__hide { position: absolute; top: 0; right: 0; padding: 11px; cursor: pointer; z-index: 1; width: 40px; height: 40px; color: var(--text); } @media only screen and (max-width: 1023px) { .blog-item__button__hide { margin: 0; } } .blog-item__button__hide:hover .icon-close { transform: rotate(90deg); } .blog-item__button__hide .icon-close { width: 100%; height: 100%; pointer-events: none; transition: transform 0.3s ease; } /*================ Slideshow ================*/ .slider { --flickity-btn-position: calc((var(--gutter) - var(--flickity-btn-size)) / 2); --scale: 1; position: relative; overflow: hidden; } .slider .flickity-slider { will-change: transform; } .slider .flickity-prev-next-button { z-index: 1; } @media only screen and (max-width: 1023px) { .slider .flickity-prev-next-button { display: none; } } .slider .flickity-page-dots { bottom: 10px; padding: 0 var(--gutter-mobile); margin-bottom: 15px; z-index: 10; } @media only screen and (min-width: 1024px) { .slider .flickity-page-dots { padding: 0 var(--gutter); } } .slider .dot:first-child { margin-left: 0; } .slider .dot:last-child { margin-right: 0; } .slider .overlay { pointer-events: none; } .slider .item { opacity: 0 !important; transition: opacity 0s 0.5s; } .slider .item.is-selected { opacity: 1 !important; transition: opacity 0s; } [data-current-style=text-dark] .slider__scroll-down { color: var(--text); } [data-current-style=text-dark] .flickity-page-dots .dot { border-color: var(--text); } [data-current-style=text-light] .slider__scroll-down { color: var(--white); } [data-current-style=text-light] .flickity-page-dots .dot { border-color: var(--white); } .slider .item, .slide__link { display: grid; grid-template-columns: minmax(0, 1fr); } .slider .overlay, .slide__image__container, .slide__text__container { grid-row-start: 1; grid-column-start: 1; min-height: 100%; } @media only screen and (max-width: 767px) and (orientation: landscape) { .slider .overlay, .slide__image__container, .slide__text__container { min-height: auto; } } /* Prevent CLS on page load Images are stacked until flickity is initialized which causes CLS Position absolute makes them stay unchanged (if only JS is enabled) */ .js .slider:not(.flickity-enabled) .item:not(:first-of-type) { position: absolute; top: 0; left: 0; visibility: hidden; } .slider--zoom-out .item { transition: opacity 0s 0.3s; } .slider--zoom-out .item.is-selected { transition: opacity 0.3s; } .slider--zoom-out .slide__image__inner { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .slider--zoom-out .is-selected .slide__image__inner { opacity: 1; animation: zoomOut 0.7s cubic-bezier(0, 0.5, 0.6, 1); } .slider--fade .item, .slider--fade .item.is-selected { transition: opacity 0.8s; } .slider--wipe .item { animation-duration: 0.5s; animation-timing-function: cubic-bezier(0.75, 0, 1, 0); } .slider--wipe .item.is-selected { animation-name: clipPathFromRight; } .slider--slide .item { transition: opacity 0s 0.4s; } .slider--slide .item.is-selected { transition: opacity 0.25s; animation: sliderRightToLeft 0.4s; } .slider--slide .item.is-selected:only-of-type { animation: sliderRightToLeftOneSlide 0.4s; } .slider__scroll-down { position: absolute; display: inline-block; left: 50%; bottom: 0; width: 44px; height: 44px; margin-left: -22px; z-index: 100; } .slider__scroll-down .icon-arrow-right { display: block; width: 100%; height: 100%; transform: rotate(90deg); } .slide__image { will-change: transform; transform: scale(var(--scale)); } .slide__image__svg { position: relative; left: 50%; width: 0; min-height: 100%; padding-right: 264%; transform: translateX(-50%); } .slide__image__svg .placeholder-svg-filled { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .slide__text__container { display: flex; z-index: 100; } @media only screen and (min-width: 768px) { .slide__image__container--mobile { display: none; } } @media only screen and (max-width: 767px) { .slide__image__container--mobile~.slide__image__container--desktop { display: none; } } .slide__text__wrapper { padding: var(--gutter) var(--gutter-mobile); } @media only screen and (min-width: 1024px) { .slide__text__wrapper { padding: var(--gutter); } .slide__text__wrapper--narrow { width: calc(33.33% + var(--gutter) * 2); } .slide__text__wrapper--normal { width: calc(70% + var(--gutter) * 2); } .slide__text__wrapper--wide { width: calc(90% + var(--gutter) * 2); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .slide__text__wrapper--narrow { width: calc(50% + var(--gutter) * 2); } .slide__text__wrapper--normal { width: calc(75% + var(--gutter) * 2); } .slide__text__wrapper--wide { width: 100%; } } .slider--has-arrow .slide__text__wrapper, .slider--has-dots .slide__text__wrapper { margin-top: 30px; margin-bottom: 30px; } .slider--has-arrow .item--top-left .slide__text__wrapper, .slider--has-arrow .item--top-right .slide__text__wrapper, .slider--has-dots .item--top-left .slide__text__wrapper, .slider--has-dots .item--top-right .slide__text__wrapper { margin-top: 0; } .slider--has-arrow .flickity-page-dots { margin-bottom: 35px; } .slide__heading>span, .slide__text>span { display: block; overflow: hidden; } .slide__text { overflow: hidden; } @media only screen and (max-width: 479px) { .slide__btn { display: block; max-width: 210px; } } .video-text-link { font-size: calc(0.875rem * var(--adjust-body)); display: inline-flex; align-items: center; line-height: 30px; letter-spacing: 2px; position: relative; text-transform: uppercase; color: var(--text); font-family: var(--FONT-STACK-BODY); font-weight: var(--FONT-WEIGHT-BODY); font-style: var(--FONT-STYLE-BODY); transition: opacity 0.2s; } .video-text-link:hover, .video-text-link:focus, .video-text-link:active { opacity: 0.7; } .video-text-link span { display: inline-block; vertical-align: middle; margin-left: 10px; } .video-text-link .icon-play { width: 60px; height: 60px; display: inline-block; vertical-align: middle; } .slide-images__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*=== Modifiers ===*/ .slider--no-animation .slide__image { transform: none; } /*================ Split Images ================*/ .split-images-section { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); min-height: 450px; overflow: hidden; } .split-images-section .backdrop--radial:before { pointer-events: none; } @media only screen and (max-width: 767px) { .split-images-section noscript~noscript .split-images__bg--desktop { display: none; } } .split-images__heading a, .main-buttons__item { pointer-events: auto; } .split-images__pane { display: flex; } @media only screen and (max-width: 767px) { .split-images__pane--split { flex-direction: column; } .split-images__pane--first-block .split-images__scale--2, .split-images__pane--second-block .split-images__scale--1 { display: none; } } .split-images__scale { position: relative; display: block; width: 100%; height: 100%; } .split-images__bg .placeholder-svg-filled { position: absolute; top: 50%; left: 0; height: 200%; max-height: 200%; transform: translateY(-50%); } @media only screen and (min-width: 768px) { .split-images__bg--mobile { display: none; } } @media only screen and (max-width: 767px) { .split-images__bg--mobile~.split-images__bg--desktop, .split-images__bg--mobile~.split-images__bg--placeholder { display: none; } } .split-images__content { padding: var(--gutter) 0; display: flex; z-index: 5; overflow: hidden; min-height: 100%; } .split-images__pane, .split-images__content { grid-row-start: 1; grid-column-start: 1; } @media only screen and (max-width: 767px) and (orientation: landscape) { .split-images__pane, .split-images__content { min-height: auto; } } .split-images__content-inner { display: flex; flex-direction: column; z-index: 1; pointer-events: none; } .split-images__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .store-availability-container .icon { --icon-size: calc(12px * var(--adjust-body)); width: var(--icon-size); height: var(--icon-size); flex-basis: var(--icon-size); flex-shrink: 0; margin: calc(4px * var(--adjust-body)) 4px 0 0; } .store-availability-container .icon-in-stock { fill: var(--success); } .store-availability-container .icon-out-of-stock { fill: var(--error); } .store-availability-container .store-availability-list__stock .icon { margin: 0 2px 3px 0; } .store-availability-container .icon-close { width: 18px; height: 18px; margin: 0; } .store-availability-container .store-availabilities-modal { display: none; } .icon-in-stock, .icon-out-of-stock { stroke: none; } .product-single__store-availability-container:empty { display: none; } .store-availability-small-text { margin: 0; font-size: calc(0.9rem * var(--adjust-body)); } .store-availability-information { display: flex; margin-left: 0; } .store-availability-information-container { line-height: 1.5; margin-left: 5px; } .store-availability-information__title { margin: 0; } .store-availability-information__stock { margin: 0; } .store-availability-information__stores { margin: 8px 0 0; } .store-availability-information__link { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); cursor: pointer; } .store-availability-information__link:hover, .store-availability-information__link:focus { opacity: 0.6; } .store-availabilities-modal { /* -webkit-transform: translateZ(0); // translateZ hack */ will-change: transform; overflow: hidden; position: fixed; top: 0; bottom: 0; left: 100vw; right: auto; z-index: 9999; width: var(--drawer-width); max-width: 100%; max-height: 100vh; color: var(--text); background-color: var(--bg); transition: var(--drawer-transition); opacity: 1; display: flex; flex-direction: column; overflow: hidden; box-sizing: border-box; transform: translateY(0); padding: var(--inner); } .store-availabilities-modal .icon-in-stock, .store-availabilities-modal .icon-out-of-stock { width: 12px; height: 12px; vertical-align: middle; } .store-availabilities-modal .icon-in-stock { fill: var(--success); margin: 5px 0 0 0; } .store-availabilities-modal .icon-out-of-stock { fill: var(--error); margin: 5px 0 0 0; } .store-availabilities-modal .store-availability-list__stock .icon-in-stock { margin: 0 0 2px 0; } .store-availabilities-modal .store-availability-list__stock .icon-out-of-stock { margin: 0 0 2px 0; } .store-availabilities-modal--active { transform: translateX(calc(-1 * var(--drawer-width))); } .store-availabilities-modal__header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; width: 100%; position: relative; } .store-availabilities-modal__close { z-index: 1; } .store-availabilities-modal__product-information { position: relative; width: calc(100% - 30px); } .store-availabilities-modal__product__title { text-transform: none; margin: 0 0 15px; padding: 0; color: var(--text); font-size: calc(1.375rem * var(--adjust-heading)); font-weight: var(--FONT-WEIGHT-HEADING-BOLD); } .store-availabilities-list { border-top: var(--BORDER-WIDTH) solid var(--text); overflow: auto; list-style: none; margin: var(--inner) 0 0; } .store-availability-list__item { margin: 0; padding: var(--inner) 0; } .store-availability-list__item p { font-size: calc(0.8125rem * var(--adjust-body)); margin-bottom: 0; } .store-availability-list__phone a { text-decoration: none; } .store-availability-list__location { display: flex; justify-content: space-between; } .store-availability-list__stock { margin-top: 8px; margin-bottom: 16px; } .store-availability-list__address { font-size: 90%; font-style: var(--FONT-STYLE-BODY); } .store-availability-list__address p { margin: 0; font-size: inherit; } .store-availability-list-header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; } .store-availability-list-header__location { font-weight: var(--FONT-WEIGHT-BODY-BOLD); padding-right: 5px; } .store-availability-list-header__location, .store-availability-list-header__distance { margin-bottom: 0; font-size: calc(1rem * var(--adjust-body)); color: var(--text); } /*================ Sub-collections ================*/ .subcollections { overflow: hidden; } .subcollection { transform: translateZ(0); } .subcollection__outer { position: relative; } .subcollection__outer::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--overlay); opacity: var(--overlay-opacity); pointer-events: none; } .subcollection__image { display: block; position: relative; padding-top: var(--collection-image-padding-top); background-repeat: no-repeat; background-position: center center; background-size: cover; overflow: hidden; } .subcollection__image .placeholder-svg--overlayed { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .subcollection__title { position: absolute; left: 0; bottom: 0; z-index: 1; max-width: 100%; padding: 20px; margin: 0; word-break: break-word; text-align: left; color: var(--text); } .subcollection__title span { display: block; position: relative; } .subcollection__title span::after { content: ""; position: absolute; top: 100%; left: 0; width: 0; height: var(--BORDER-WIDTH); background: var(--text); transition: width 0.25s ease-in; } .supports-touch .subcollection__title span::after { content: none; } .subcollection__image:hover .subcollection__title span::after { width: 100%; transition: width 0.5s ease-out; } .product__subs { padding: 0; border: 0; margin: 0; } .product__subs__group { display: block; border: var(--BORDER-WIDTH) solid var(--border); } .product__subs__group+.product__subs__group { border-top: none; } .product__subs__plans { margin-left: 1.5rem; } .product__subs__plans .product__subs__option { padding-top: 0; } .product__subs__option { display: flex; width: 100%; padding: var(--form-top) var(--form-left); align-items: center; cursor: pointer; line-height: 1.3; font-size: calc(0.875rem * var(--adjust-body)); font-family: var(--FONT-STACK-BODY); } @media only screen and (max-width: 767px) { .product__subs__option { font-size: calc(0.75rem * var(--adjust-body)); line-height: 1.1; padding: 10px 12px; } } .product__subs__option input[type=radio] { background-color: transparent; color: var(--text-darken); width: 1rem; height: 1rem; flex-shrink: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; position: relative; padding: 0; border: 0; margin: 0 0.5rem 0 0; cursor: pointer; } @media only screen and (max-width: 767px) { .product__subs__option input[type=radio] { width: 0.75rem; height: 0.75rem; } } .product__subs__option input[type=radio]::before { content: ""; position: absolute; width: 100%; height: 100%; border-radius: 50%; border: var(--BORDER-WIDTH) solid var(--text-darken); box-sizing: border-box; } .product__subs__option input[type=radio]:checked::before { background-image: radial-gradient(var(--PRIMARY-BUTTONS-COLOR-BG) 50%, var(--bg) 51%); } .product__subs__description { color: var(--text-lighten); font-size: calc(0.875rem * var(--adjust-body)); background: var(--hairline); margin: 0; padding: 10px 20px; font-style: var(--FONT-STYLE-BODY-ITALIC); } .product__subs__description:empty { display: none; } [data-subscription-watch-price] { display: none; } /*================ Tab collections ================*/ .tab-collections { position: relative; text-align: center; overflow: hidden; background-color: var(--bg); } .tab-collections .btn--view-all { margin-top: var(--gutter); } .tab-collections>.flickity-prev-next-button.next { right: calc(var(--gutter) / 2); } .tab-collections>.flickity-prev-next-button.previous { left: calc(var(--gutter) / 2); } .tab-collections-wrapper { margin-top: -10px; } .tab-collections__featured-item { display: flex; flex-direction: column; justify-content: flex-end; flex: 0 0 100%; max-width: 100%; height: 100%; text-align: left; padding: 40px; position: relative; } .tab-collections__featured-item .overlay { pointer-events: none; } .product-grid-item--featured { align-self: stretch; } @media only screen and (min-width: 768px) { .product-grid-item--featured { height: 100%; } .carousel--inactive .product-grid-item--featured { height: auto; } } @media only screen and (min-width: 768px) { .tab-collections .flickity-enabled .product-grid-item { overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .tab-collections .flickity-enabled .product-grid-item::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .tab-collections .flickity-enabled .product-grid-item:hover { height: 100%; } } .tab-collections__featured-item__content { position: relative; z-index: 5; height: 100%; display: flex; flex-direction: column; } .tab-collections__heading { flex: 1 0 auto; display: flex; align-items: flex-end; margin: 0; } .tab-collections__heading p { line-height: 1; } .tab-collections__heading p { margin: 0.5em 0; } .tab-collections__btn-wrapper { display: flex; width: 100%; margin-top: auto; } .tab-collections__container .flickity-slider { position: relative !important; display: flex; left: 0 !important; width: auto; } .tab-collections__head { --btn-max-width: 150px; --btn-space: calc(var(--inner) + var(--btn-max-width)); width: 100%; display: flex; justify-content: space-between; align-items: center; } .tab-collections__head.text-center { justify-content: center; } @media only screen and (min-width: 768px) { .tab-collections__head--has-button.tabs__head { overflow: visible; } } @media only screen and (min-width: 768px) { .tab-collections__head--has-button .tabs-scrollbar { max-width: calc(100% - var(--btn-space)); } } @media only screen and (min-width: 768px) { .tab-collections__head--has-button .tabs-scrollbar__holder { margin: 0; max-width: 100%; padding: 0; } } @media only screen and (min-width: 768px) { .tab-collections__head--has-button.text-center .tabs-scrollbar { max-width: calc(100% - 2 * var(--btn-space)); margin: auto; } } .tab-collections__text { margin-top: calc(var(--gutter) / -2.5); margin-bottom: calc(var(--gutter) / 2); font-size: calc(1.1rem * var(--adjust-body)); } .tab-collections__button { margin-top: -5px; max-width: var(--btn-max-width); display: none; } @media only screen and (min-width: 768px) { .tab-collections__button.current { display: inline-block; } } .tab-collections__button--center { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } /*================ Tabs ================*/ .tabs { position: relative; } .tabs__head { position: relative; z-index: 2; overflow: hidden; } @media only screen and (max-width: 1023px) { .tabs__head { overflow: visible; } } .tabs__arrow { position: absolute; top: 50%; display: block; width: 24px; height: 24px; max-height: none; margin-top: -12px; border-radius: 0; background-color: var(--bg); box-shadow: none; } .tabs__arrow--prev { left: 0; transform: rotate(90deg); } .tabs__arrow--next { right: 0; transform: rotate(-90deg); } .tabs__contents { position: relative; } .tabs__nav { display: flex; flex-wrap: nowrap; overflow-x: auto; margin: 0; padding: 0; list-style: none; position: relative; white-space: nowrap; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .tabs__nav::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } @media only screen and (min-width: 768px) { .tabs__nav { text-align: center; } } .tabs__link { margin-right: 30px; margin-bottom: 0; flex: 0 0 auto; background: none; color: var(--text-lighten); font-weight: var(--FONT-WEIGHT-BODY); font-size: calc(1rem * var(--adjust-body)); cursor: pointer; vertical-align: bottom; border-bottom: 3px solid transparent; white-space: normal; } .tabs__link:last-child { margin-right: 0; } .tab { position: absolute; top: 0; width: 100%; padding-top: 15px; opacity: 0; visibility: hidden; } .tab .flickity-button { display: none; } .tab.current { position: static; opacity: 1; visibility: visible; display: inherit; transition: opacity 0.3s ease, visibility 0s linear 0s; } .tab.current .flickity-button { display: block; background: var(--bg); } /*================ Tabs Wrapper ================*/ .tabs-wrapper { overflow: hidden; position: relative; padding-top: 30px; } /*================ Tabs scrollbar ================*/ .tabs-scrollbar { width: 100%; } .tabs-scrollbar__holder { display: inline-block; overflow-x: auto; max-width: 100%; text-align: center; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .tabs-scrollbar__holder::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } @media only screen and (max-width: 1023px) { .tabs-scrollbar__holder { max-width: calc(100% + var(--gutter-mobile) * 2); padding: 0 var(--gutter-mobile); margin: 0 calc(var(--gutter-mobile) * -1); } } .tabs-scrollbar__holder .tabs__nav { overflow: visible; } /*================ Testimonials ================*/ .testimonials-section { --inner: 30px; --item-width: calc(90% - var(--gutter)); overflow: hidden; } @media only screen and (min-width: 1440px) { .testimonials-section { --item-width: calc((100% - var(--gutter) * 2) / 6); } } @media only screen and (min-width: 1024px) and (max-width: 1439px) { .testimonials-section { --item-width: calc((100% - var(--gutter) * 2) / 4); } } @media only screen and (min-width: 768px) and (max-width: 1023px) { .testimonials-section { --item-width: calc((100% - var(--gutter)) / 2); } } @media only screen and (max-width: 767px) { .testimonials-section { --item-width: calc((var(--wrapper-width) * 0.9 - var(--grid-gutter)) / 2); } } @media only screen and (max-width: 479px) { .testimonials-section { --item-width: calc(90% - var(--grid-gutter)); } } .testimonials-section .flickity-page-dots .dot { background: var(--text); width: 30px; height: 3px; border: 3px; border-radius: 0px; } .testimonials-section p { margin: 0; line-height: 1.25; } .testimonials-section .flickity-viewport { overflow: initial; } @media only screen and (min-width: 1024px) and (max-width: 1439px) { .testimonials-section .testimonials__slider--blocks-5:not(.flickity-enabled) { --item-width: calc((100% - var(--gutter) * 2) / 5); } } @media only screen and (max-width: 1023px) { .testimonials__wrapper { display: block; } } @media only screen and (max-width: 767px) { .testimonials__wrapper { margin-left: calc(-1 * var(--gutter-mobile)); margin-right: calc(-1 * var(--gutter-mobile)); } } @media only screen and (min-width: 768px) { .testimonials__slider:not(.flickity-enabled) { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(var(--item-width), 100%), 1fr)); column-gap: calc(var(--gutter) / 2); align-items: stretch; justify-items: center; } } @media only screen and (min-width: 768px) { .testimonials__slider:not(.flickity-enabled) .testimonial__item { width: 100%; margin-right: 0; } } .testimonials__slider { position: relative; } @media only screen and (max-width: 767px) { .testimonials__slider { display: flex; flex-flow: row nowrap; justify-content: flex-start; overflow-x: scroll; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; scroll-padding: var(--gutter-mobile); padding: 10px 0 10px var(--gutter-mobile); margin: -10px 0; scrollbar-width: none; -ms-overflow-style: none; /* for Internet Explorer, Edge */ } .testimonials__slider::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */ } .testimonials__slider::after { content: ""; display: block; position: relative; padding-right: var(--gutter-mobile); } } .testimonials__slider .flickity-page-dots { position: absolute; top: 100%; bottom: auto; margin-top: 45px; } @media only screen and (max-width: 767px) { .testimonials__slider .flickity-page-dots { margin-top: 0; } } @media only screen and (min-width: 768px) { .testimonials__slider[data-slider-dots=true].flickity-enabled { margin-bottom: 46px; } } .testimonials__slider--text-left .flickity-page-dots, .testimonials__slider--text-left .testimonial__text { text-align: left; } .testimonials__slider--text-left .testimonial__user { align-items: flex-start; } .testimonials__slider--text-left .testimonial__stars { justify-content: flex-start; } .testimonials__slider--text-left.testimonials__slider--blocks-1 { justify-items: start; } .testimonials__slider--text-center { text-align: center; } .testimonials__slider .flickity-slider { position: relative; height: 100%; } .testimonial__item { --inner: 20px; position: relative; display: flex; min-height: 100%; width: var(--item-width); margin-right: calc(var(--gutter) / 2); line-height: 1; word-wrap: break-word; } @media only screen and (max-width: 479px) { .testimonial__item { flex: 0 0 auto; margin-right: var(--gutter-mobile); scroll-snap-align: start; } } .testimonial__item p { font-size: inherit; } .testimonial__item:last-child { margin-right: 0; } @media only screen and (max-width: 479px) { .testimonials__slider--blocks-1 { padding-right: var(--gutter-mobile); overflow-x: hidden; } } .testimonials__slider--blocks-1 .testimonial__item { width: 100%; } @media only screen and (min-width: 768px) { .testimonials__slider--blocks-1 .testimonial__item { max-width: 50%; } } .testimonial__item__inner { width: 100%; display: inline-flex; flex-direction: column; vertical-align: top; border: var(--BORDER-WIDTH) solid var(--COLOR-BLACK-WHITE); padding: calc(var(--inner) * 2); } @media only screen and (max-width: 479px) { .testimonial__item__inner { padding: calc(var(--inner) * 1.5); } } .testimonial__item--slide__text .testimonial__item__content { background: transparent; } .testimonial__item--slide__text .testimonial__text { font-weight: var(--FONT-WEIGHT-BODY-BOLD); margin-bottom: var(--inner); } .testimonial__item--slide__text.text-center { text-align: center; } .testimonial__item--slide__text.text-center .testimonial__text { text-align: center; } .testimonial__item--slide__text.text-center .testimonial__stars { justify-content: center; } .testimonial__item--slide__text.text-left .testimonial__stars { justify-content: flex-start; } .testimonial__user { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: var(--inner); border: none; font-size: calc(0.8rem * var(--adjust-body)); } .testimonial__user__image { margin-bottom: var(--inner); } .testimonial__user__image__img { object-fit: cover; border-radius: 50%; } .testimonial__user__name { display: inline-block; } .testimonial__stars { display: flex; justify-content: center; margin-bottom: var(--inner); } .testimonial__stars .rating__star { margin: 0; } .testimonial__stars .rating__star__empty .icon, .testimonial__stars .rating__star__full .icon { margin-right: 10px; } .testimonial__stars .rating__star__empty .icon:last-child, .testimonial__stars .rating__star__full .icon:last-child { margin-right: 0; } .testimonial__text { position: relative; font-size: calc(1rem * var(--adjust-body)); line-height: 1.25; } @media only screen and (max-width: 1023px) { .testimonial__text { width: auto; } } .testimonial__subheading { color: var(--text-alpha-50); font-size: calc(0.8rem * var(--adjust-body)); } .testimonial__subheading p { font-size: inherit; } .text-section { --text-gap: 16px; position: relative; background: var(--bg); } .text-section p { font-size: inherit; } .text>* { margin-bottom: var(--text-gap); } .text>*:last-child { margin-bottom: 0; } .text__content, .text__split-left, .text__split-right { font-size: calc(1rem * var(--adjust-body)); } .text__subheading { font-size: calc(0.875rem * var(--adjust-body)); } .text__subheading p, .text__heading p, .text__content p, .text__split p { margin: 0; } .text hr { margin-top: 0; } .text__content a, .text__split a, .text__heading a { text-decoration: underline; text-decoration-thickness: var(--BORDER-WIDTH); } .text__heading:not(.text-highlight-wrapper) a, .main-heading:not(.text-highlight-wrapper) a, .image-with-text__heading:not(.text-highlight-wrapper) a, .split-images__heading:not(.text-highlight-wrapper) a, .promotion-row__item__heading:not(.text-highlight-wrapper) a, .collection-promo__heading:not(.text-highlight-wrapper) a { position: relative; display: inline-block; text-decoration: none !important; } .text__heading:not(.text-highlight-wrapper) a:before, .text__heading:not(.text-highlight-wrapper) a:after, .main-heading:not(.text-highlight-wrapper) a:before, .main-heading:not(.text-highlight-wrapper) a:after, .image-with-text__heading:not(.text-highlight-wrapper) a:before, .image-with-text__heading:not(.text-highlight-wrapper) a:after, .split-images__heading:not(.text-highlight-wrapper) a:before, .split-images__heading:not(.text-highlight-wrapper) a:after, .promotion-row__item__heading:not(.text-highlight-wrapper) a:before, .promotion-row__item__heading:not(.text-highlight-wrapper) a:after, .collection-promo__heading:not(.text-highlight-wrapper) a:before, .collection-promo__heading:not(.text-highlight-wrapper) a:after { content: ""; position: absolute; left: 0; bottom: -0.1rem; width: 100%; height: var(--BORDER-WIDTH); display: block; background: var(--btn-text, var(--text)); transition: none; pointer-events: none; } .text__heading:not(.text-highlight-wrapper) a:before, .main-heading:not(.text-highlight-wrapper) a:before, .image-with-text__heading:not(.text-highlight-wrapper) a:before, .split-images__heading:not(.text-highlight-wrapper) a:before, .promotion-row__item__heading:not(.text-highlight-wrapper) a:before, .collection-promo__heading:not(.text-highlight-wrapper) a:before { transform: scaleX(0); transform-origin: left; } .text__heading:not(.text-highlight-wrapper) a:after, .main-heading:not(.text-highlight-wrapper) a:after, .image-with-text__heading:not(.text-highlight-wrapper) a:after, .split-images__heading:not(.text-highlight-wrapper) a:after, .promotion-row__item__heading:not(.text-highlight-wrapper) a:after, .collection-promo__heading:not(.text-highlight-wrapper) a:after { transform-origin: right; } .no-touch .text__heading:not(.text-highlight-wrapper) a:hover, .no-touch .main-heading:not(.text-highlight-wrapper) a:hover, .no-touch .image-with-text__heading:not(.text-highlight-wrapper) a:hover, .no-touch .split-images__heading:not(.text-highlight-wrapper) a:hover, .no-touch .promotion-row__item__heading:not(.text-highlight-wrapper) a:hover, .no-touch .collection-promo__heading:not(.text-highlight-wrapper) a:hover { background: transparent; border: 0; } .no-touch .text__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .text__heading:not(.text-highlight-wrapper) a:hover:after, .no-touch .main-heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .main-heading:not(.text-highlight-wrapper) a:hover:after, .no-touch .image-with-text__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .image-with-text__heading:not(.text-highlight-wrapper) a:hover:after, .no-touch .split-images__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .split-images__heading:not(.text-highlight-wrapper) a:hover:after, .no-touch .promotion-row__item__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .promotion-row__item__heading:not(.text-highlight-wrapper) a:hover:after, .no-touch .collection-promo__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .collection-promo__heading:not(.text-highlight-wrapper) a:hover:after { transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1); transform: scaleX(0); } .no-touch .text__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .main-heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .image-with-text__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .split-images__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .promotion-row__item__heading:not(.text-highlight-wrapper) a:hover:before, .no-touch .collection-promo__heading:not(.text-highlight-wrapper) a:hover:before { transform: scaleX(1); transition-delay: 0.25s; } .text__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:before, .text__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:after, .main-heading:not(.text-highlight-wrapper) .text-reveal__cropper a:before, .main-heading:not(.text-highlight-wrapper) .text-reveal__cropper a:after, .image-with-text__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:before, .image-with-text__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:after, .split-images__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:before, .split-images__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:after, .promotion-row__item__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:before, .promotion-row__item__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:after, .collection-promo__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:before, .collection-promo__heading:not(.text-highlight-wrapper) .text-reveal__cropper a:after { bottom: 0; } .text__split { display: grid; min-height: 75px; gap: var(--text-gap); grid-template-columns: minmax(0, 1fr); grid-template-areas: "text-left""text-right"; } @media only screen and (min-width: 480px) { .text__split { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "text-left text-right"; } } .text__split-left { grid-area: text-left; } .text__split-right { grid-area: text-right; } .text__button, .text__image-wrapper { display: flex; justify-content: center; align-items: center; } @media only screen and (max-width: 479px) { .text__button { width: 100%; } } .text__button:first-of-type { margin-right: var(--text-gap); } @media only screen and (max-width: 479px) { .text__button:first-of-type { margin-right: 0; } } @media only screen and (max-width: 479px) { .text__button:last-of-type { margin-top: var(--text-gap); } } .text__buttons-wrapper { display: flex; justify-content: center; } @media only screen and (max-width: 479px) { .text__buttons-wrapper { flex-direction: column; } } .text__image { height: auto; } .text__icon-wrapper { width: var(--icon-size); min-height: calc(1rem * var(--adjust-body) * var(--line-height)); display: flex; align-items: center; justify-content: center; align-self: start; position: relative; color: var(--text); } .text__icon-wrapper .icon { display: block; width: var(--icon-size); height: var(--icon-size); } .text__icons-row-block { --icon-size: 25px; --line-height: 1.5625; display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); column-gap: calc(var(--grid-gutter) * 2); align-items: center; background-color: var(--bg); border-radius: var(--radius); font-size: calc(1rem * var(--adjust-body)); line-height: var(--line-height); } @media only screen and (max-width: 767px) { .text__icons-row-block { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; } } .text-left .text__buttons-wrapper, .text-left .text__button, .text-left .text__image-wrapper, .text-left .text__icon-wrapper { justify-content: flex-start; } .text-right .text__buttons-wrapper, .text-right .text__button, .text-right .text__image-wrapper, .text-right .text__icon-wrapper { justify-content: flex-end; } .recipient-form .form__label { margin: 10px 0; } @media only screen and (max-width: 767px) { .recipient-form .form__label { margin: var(--form-margin-mobile) 0; } } .recipient-form .recipient-fields__message { margin-top: 0; } .recipient-form input[type=checkbox]:checked~.recipient-fields { display: block; } [data-animations=true] .recipient-form input[type=checkbox]:checked~.recipient-fields .recipient-fields__field:nth-child(1) { animation: fadeInUp 0.2s; } [data-animations=true] .recipient-form input[type=checkbox]:checked~.recipient-fields .recipient-fields__field:nth-child(2) { animation: fadeInUp 0.4s; } [data-animations=true] .recipient-form input[type=checkbox]:checked~.recipient-fields .recipient-fields__field:nth-child(3) { animation: fadeInUp 0.6s; } [data-animations=true] .recipient-form input[type=checkbox]:checked~.recipient-fields .recipient-fields__field:nth-child(4) { animation: fadeInUp 0.8s; } .recipient-fields { display: none; } .recipient-fields__field { margin: var(--inner) 0 0; } @media only screen and (max-width: 767px) { .recipient-fields__field { margin: var(--form-margin-mobile) 0 0; } } @media only screen and (min-width: 768px) { .popup-quick-view__item .recipient-fields__field { margin-top: calc(var(--inner) / 2); } } .recipient-fields__message { font-size: calc(0.875rem * var(--adjust-body)); text-align: right; } .no-js .recipient-form .recipient-fields__field:first-child { margin-top: 0; } .no-js .recipient-form input[type=checkbox], .no-js .recipient-form input[type=checkbox]+label { display: none; } .no-js .recipient-fields { display: block; } .no-js .recipient-fields .errors { margin-top: calc(var(--form-margin) / 2); } /* New css start */ .product__form .fit_sizes_main p { margin: 0; --adjust-body: calc(var(--FONT-ADJUST-BODY) * 0.9); font-size: calc(1rem * var(--adjust-body)); } .complementary-products__title { margin-bottom: 10px; } .split-payments .wording a { text-decoration: underline; font-size: calc(1.05rem * var(--adjust-heading)); } [data-has-preorder="true"] .trustblox-1-timer-wrap { display: none !important; } .trustblox-1-timer-textual { background: #f2f2f2; padding: 10px 20px; margin-top: 25px; } .split-payments .row { display: flex; align-items: center; background: #f5f5f5; padding: 10px 20px; } .split-payments .row .wording p { margin: 0; line-height: normal; /* --adjust-body: calc(var(--FONT-ADJUST-BODY) * 0.9); font-size: calc(1rem * var(--adjust-body)); */ font-size: calc(1.1rem * var(--adjust-heading)); } .split-payments .badge { max-width: 65px; width: 100%; margin-right: 15px; display: flex; align-items: center; } .swatch-color { margin-bottom: 15px; } .ProductSwatchSlider { display: flex; flex-wrap: wrap; margin: 0; /* column-gap: 5px; */ row-gap: 5px; /* margin-right: -5px; */ margin-left: -5px; } .swatch-color .variant__color-swatch { display: block; list-style: none; width: calc((100% / 7) - 5px); height: 100%; margin: 0; line-height: normal; font-size: 0; border: 1px solid transparent; margin-left: 5px; } .swatch-color .variant__color-swatch.active { border: 1px solid #000; } .swatch-color .variant__color-swatch img { width: 100%; height: 100%; object-fit: cover; object-position: top; } .swatch-color .variant__color-swatch a { display: inline-block; } .swatch-color .variant-name { margin-bottom: 10px; --adjust-body: calc(var(--FONT-ADJUST-BODY) * 0.9); font-size: calc(1rem * var(--adjust-body)); font-weight: 700; } .swatch-color .variant-name span.selected-color-name { font-weight: 400; } .product__block.product__complementary { margin-top: 20px; } .swatch-color .variant_name_main { display: flex; justify-content: space-between; } .swatch-color .variant_name_main .all_colours a { text-decoration: underline; --adjust-body: calc(var(--FONT-ADJUST-BODY) * 0.9); font-size: calc(1rem * var(--adjust-body)); white-space:nowrap; } .Details_Fit { padding-bottom: 10px; } .collection_new__header { margin-bottom: 0; padding: 0; } .collection-new-header { padding: 40px 70px 40px; } .collection-new-header details .rte_title_line { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .collection-new-header details summary { display: flex; align-items: center; } .collection-new-header details[open] summary { opacity: 0; } .down_up__arrow { display: inline-block; margin-top: 10px; } .rte_title_line p, .rte_title_line span { font-size: 16px; letter-spacing: 0.1em; } .collection-new-header details[open] .rte p { margin-top: 0; } .rte_title_line p span, .rte_title_line p { margin: 0; } .down-arrow svg, .down-arrow { color: #000; height: 20px; width: 20px; } .collection_new__header { margin-bottom: 0; } #shopify-section-hader-collection-badges { margin-top: 40px; } .collection-new-header details[open] .rte p, .collection-new-header details[open] .rte span { font-size: 16px; letter-spacing: 0.1em; } #shopify-section-product-template { margin-top: 40px; } .collection-new-header details[open] .down-arrow { margin: -20PX 0 0 0; float: right; } .collection-new-header details[open] .down-arrow svg { transform: rotate(180deg); } .collection_new__header a { border-bottom: none !important; } .product-single__title { font-size: 20px !important; line-height: 40px; font-weight: 500; letter-spacing: 5px; } .product__price, .product__price-savings { font-size: 20px; font-weight: 500; } .trustblox-1-timer-textual.trustblox-1-style-text-only { --adjust-body: calc(var(--FONT-ADJUST-BODY) * .9); font-size: calc(1rem * var(--adjust-body)) !important; } .wishlist-ico { font-size: 22px; } .wlist { padding-left: 10px; width: 80px; } div#bookmarkit.swpbutton3 #wishlist_icon { font-size: 32px !important; margin: 0 auto; vertical-align: middle; } div#bookmarkit.swpbutton3 #sw_wishlist_label { display: none; } div#bookmarkit.swpbutton3 { width: 100% !important; border-radius: 0 !important; color: #2E2E2E !important; } div#bookmarkit.swpbutton3 { background-color: #ffff !important; } div#smartwishlist { padding-right: 0; margin: 5px !important; } #smartwishlist_desktop_link { position: relative; } #smartwishlist_desktop_link .topbadge { padding: 0 !important; width: 15px; height: 15px; line-height: 15px; font-size: 11px; display: flex; justify-content: center; align-items: center; position: absolute; right: -5px; top: 20px; text-align: center; letter-spacing: 0; } .nav--compress .wishlist-ico.desktop_show { display: none; } .site-header .cart__toggle, .site-header .mobile-menu .search-popdown { width: 38px; } a#smartwishlist_desktop_link { position: relative; white-space: nowrap; font-size: 20px; width: auto; } .yotpo-icon { color: #2E2E2E !important; } .yotpo { color: #2E2E2E !important; } .yotpo .yotpo-nav ul .yotpo-nav-tab span { color: #2E2E2E !important; } .yotpo .font-color-gray-darker { color: #2E2E2E !important; } .yotpo .text-m { color: #2E2E2E !important; } .product-related-fields-item .yotpo-rating-bars .yotpo-product-related-field-score-bar.yotpo-rating-bar-full { background: #2E2E2E !important; } .yotpo div, .yotpo span, .yotpo p, .yotpo a, .yotpo img, .yotpo i, .yotpo strong, .yotpo sup, .yotpo ul, .yotpo li, .yotpo form, .yotpo label { color: #2E2E2E !important; } .yotpo .yotpo-nav ul .yotpo-nav-tab.yotpo-active .yotpo-nav-wrapper { border-color: #2E2E2E !important; ; } .yotpo .write-question-review-buttons-container .write-question-review-button .write-question-review-button-icon { color: #2E2E2E !important; } .main-widget .write-question-review-buttons-container .yotpo-icon { color: #2E2E2E !important; } .yotpo .yotpo-pager a { color: #2E2E2E !important; } .yotpo .primary-color-btn, .yotpo input[type="button"].primary-color-btn { background-color: #2E2E2E !important; } .yotpo .yotpo-rating-bars .yotpo-product-related-field-score-bar.yotpo-rating-bar-full, .yotpo .yotpo-size-bars .yotpo-product-related-field-score-bar.yotpo-rating-bar-full { background-color: #2E2E2E !important; background-color: #e8927c; } .yotpo .yotpo-drop-down-layout .yotpo-dropdown .list-category .selected-item { color: #2E2E2E !important; } .yotpo .yotpo-drop-down-layout .yotpo-dropdown .list-category a.non-selected-item { color: #2E2E2E !important; } .yotpo .sort-drop-down .selected-bold { color: #2E2E2E !important; } .yotpo .y-label, .yotpo span.y-label { color: #2E2E2E !important; } .yotpo-display-wrapper a:hover { color: #2E2E2E !important; } .yotpo .text-m { margin-left: 10px; } .yotpo .yotpo-first-review .yotpo-default-button { background: #2E2E2E !important; } .yotpo .primary-color-btn:hover, .yotpo input[type="button"].primary-color-btn:hover { background: #ba7563 !important; } .yotpo-empty-search-results .empty-search-results-clear-all-btn { color: #ba7563 !important; } .yotpo .yotpo-review .yotpo-header .yotpo-icon-profile, .yotpo .yotpo-comment .yotpo-header .yotpo-icon-profile, .yotpo .yotpo-question .yotpo-header .yotpo-icon-profile, .yotpo .yotpo-onsite-upload .yotpo-header .yotpo-icon-profile { background: #e7dbd1 !important; } .standalone-bottomline .text-m:hover { color: #2E2E2E !important; } .popup-chart__content .tab img { max-width: 100%; } @media screen and (max-width: 1440px) { .swatch-color .variant__color-swatch { width: calc((100% / 6) - 5px); } } @media screen and (max-width: 1024px) { .swatch-color .variant__color-swatch { width: calc((100% / 5) - 5px); } } @media screen and (min-width: 768px) and (max-width: 991px) { .swatch-color .variant__color-swatch { width: calc((100% / 4) - 5px); } } @media screen and (max-width:767px) { .rte_title_line p { font-size: 14px; letter-spacing: 1px; } #esc-oos-form-app-modal { display: inline; } #shopify-section-hader-collection-badges { margin-top: 0px; } #shopify-section-product-template { margin-top: 0px; } .collection-new-header { padding: 25px 15px; } .swatch-color .variant__color-swatch { width: calc((100% / 7) - 5px); } .inventory_block { margin-top: 0px; } .collection__header .wrapper--narrow { padding: 0 30px !important; } } @media screen and (max-width: 500px) { .swatch-color .variant__color-swatch { width: calc(22% - 5px); } .logo__image-link { max-width: 70%; } .navlink--icon { padding: 6px; margin-right: 4px; } } .collection__description { margin: 0px auto 0; display: block; font-size: calc(1.1rem * var(--adjust-heading)); color: var(--11lcxa5); color: inherit; height: 24px; overflow: hidden; padding-right: 25px; position: relative; } .show { height: unset; overflow: visible; white-space: unset; } .collection__header .wrapper--narrow { padding: 0 var(--gutter); position: relative; } .collection__header .js_down_up_arrow1 { position: absolute; top: -2px; right: 3px; transform: rotate(90deg); cursor: pointer; } .collection__header .collection__description.show .js_down_up_arrow1 { top: 0; transform: rotate(-90deg); right: -3px; } .collection__header .collection__description p:first-child { margin-top: 0; } .NBIS-Modal__btn { width: 100%; margin-top: 10px; } .product__form .NBIS-Modal__popup__header_subtitle, .product__form .NBIS-Modal__popup__header_title { text-align: center; } .product__form .NBIS-Modal__popup__header_subtitle { height: inherit; } .NBIS-Modal__ProductTitle { display: none; } .product__submit__buttons .btn { font-size: 17px !important; letter-spacing: 0.1em; text-transform: uppercase; font-weight: bold; } .slider .slide__btn { position: unset !important; } .slider .slide__btn:after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; } .slider .main-buttons__item { transform: inherit !important; } .product-single__details .product__block.icon_block { padding-bottom: 0; } .site-header--nav-bottom .mobile-menu { display: none; } .site-header--nav-bottom.site-header .nav--default { display: flex; } .popup-chart__content .tab p { overflow: auto; } .mobile_menu_new { display: flex; justify-content: space-between; position: relative; width: 100%; align-items: center; } .mobile_menu_new .mobile-navlink { padding-left: 0 !important; max-width: 70%; text-transform: uppercase; } .mobile-menu__item.mobile-menu__item--level-1 { align-items: center; margin-bottom: 5px; padding: 0 10px; } .mobile-nav__trigger:after { position: absolute; content: ""; top: 0; left: 0; right: 0; bottom: 0; z-index: 999999; } .cart-product-title { padding: 7px 0; text-align: center; border-top: 0.5px solid #e3e3e3; border-bottom: 0.5px solid #e3e3e3; } .cart-product-title h6 { margin-bottom: 0; font-size: 14px; line-height: 20px; text-transform: uppercase; } .cart-product { display: flex; padding: 6px; } .cart-product__img { width: 130px; height: 166px; object-fit: cover; } .cart-product__content { display: flex; flex-direction: column; padding: 6px 10px; justify-content: space-between; } .cart-product__header { display: flex; justify-content: space-between; flex-flow: wrap; } .cart-product__header-left { width: 100%; margin-bottom: 10px; } .cart-product__price { margin: 0; font-size: 14px; line-height: normal; } .cart-product__header-left h6 { margin: 0; } .cart-product__footer { margin-top: 10px; } .cart-product__footer .select select { border: none; border-bottom: 1px solid #000; font-size: 14px; padding: initial; padding-bottom: 5px; padding-left: 10px; cursor: pointer; -webkit-appearance: none; -webkit-border-radius: 0; background: none; color: #000 !important; } .cart-product__footer .select { display: flex; position: relative; flex-direction: column; } .cart-product__footer .select:before { content: ""; width: 6px; height: 6px; position: absolute; top: auto; left: 0; background-color: #000; border-radius: 100%; bottom: 14px; } .btn-outline-primary.cart-product__btn { width: 100%; color: #000; border: 0.6px solid #000; background-color: transparent; margin: 12px 0; padding: 8px 30px; font-size: 14px; line-height: normal; font-weight: 500; margin-bottom: 0; } .cart-product__footer .select:after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 5px; width: 12px; height: 11px; background-image: url('chevron-down-solid.svg'); background-repeat: no-repeat; background-size: contain; pointer-events: none; } .cart-product-slider { border-bottom: 0.5px solid #e3e3e3; } .cart-product-slider .carousel-cell { width: 420px; transition: all 0.4s; } .cart-product-slider button.flickity-button { display: none; } .cart-product-slider .flickity-page-dots { display: none; } .site-header .search-popdown__body--fixed .search-form__input-holder { --width: 100%; display: flex; align-items: center; background: transparent; } .site-header .search-popdown__body--fixed .search-form__inner { padding: 11px var(--gutter); --gutter: 0; } .site-header details[open=true] .search-popdown__body--fixed .search-form__inner { padding: 0; } .site-header .search-popdown__body--fixed { right: 0; --input-bg: var(--bg-accent); width: 100vw !important; background: #fff; height: auto; min-height: calc(100vh - var(--header-height) - var(--search-popdown-height)); max-height: 100vh; z-index: 999999999; position: fixed; top: -51px; left: 0; bottom: 0; transform: none !important; } .has-scrolled .site-header .search-popdown__body--fixed { top: 0; } .site-header .search-form__input { --input-bg: #ffffff; width: 100%; border-bottom: 1px solid #f2dace !important; margin: 0; color: var(--text); text-align: left; padding: 0; padding: 5px 20px 12px; outline: none !important; font-size: 16px; } .site-header .popular-searches, .site-header .predictive-search { width: 100%; --width: 100%; } .site-header .nav .predictive-search__item { padding: 5px 15px 6px !important; margin: 0 12px 12px 0 !important; background: #f2dace; border-radius: 50px; display: inline-block; } .site-header .nav .predictive-search__group.search__group-1 .predictive-search__item { padding: 4px 15px 8px !important; } .site-header .nav .predictive-search__item a { font-style: normal; letter-spacing: 0; font-family: Karla; font-weight: 500; font-size: 14px; line-height: 16px; text-transform: capitalize !important; color: #5d5e5e; } .search-opened .site-header--nav-bottom .logo { display: none; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__item { background: transparent; } .nav .search-popdown__results .predictive-search__heading { border: 0; padding-left: 0; margin: 0 0 22px !important; color: #1c1d1d; font-size: 15px; line-height: 18px; font-weight: 700; text-transform: uppercase; font-family: Karla; letter-spacing: 0; padding-bottom: 0; } .nav .search-popdown__results .predictive-search__group.search__group-2 .predictive-search__heading { margin-top: 0 !important; } .site-header .nav div#popularSearches-desktop { padding: 0 20px; } .site-header .nav .predictive-search { padding: 0 20px; } .site-header .popular-searches .predictive-search__list { padding-left: 0; padding-right: 0; } .nav .search-popdown__results .predictive-search__group.search__group-2 .predictive-search__heading { padding-top: 0; padding-bottom: 0; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__item a { flex-direction: column; height: 100%; text-align: center; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__item .predictive-search__product-image { width: 100%; position: relative; overflow: hidden; display: block !important; height: 100%; max-width: 100%; flex: auto; aspect-ratio: 195 / 273; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__item .predictive-search__product-image img { width: 100%; height: auto; -o-object-fit: cover; object-fit: cover; margin: auto; min-height: 334px; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__item { background: transparent; max-width: 20% !important; padding-left: 60px !important; margin: 0 !important; display: block; padding-right: 0 !important; width: 20%; padding-top: 0 !important; margin-bottom: 15px !important; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__list { display: flex; flex-wrap: wrap; margin-top: 10px; margin-left: -60px !important; } .site-header .nav .predictive-search__group.search__group-2 .predictive-search__product-title { height: auto; margin-top: 10px !important; font-family: Karla; font-weight: 500; font-size: 12px !important; margin-bottom: 0 !important; letter-spacing: 0; line-height: 14px; color: #000; padding-left: 0; } .predictive-search__group.search__group-1 .predictive-search__link>* mark { background: transparent; } .site-header .nav.caps .predictive-search__actions { color: #111; padding-left: 0; padding-right: 0; } .site-header .nav.caps .predictive-search__actions .predictive-search__link { color: #000; font-size: 15px; line-height: 20px; font-weight: 700; text-transform: uppercase; } .site-header .nav.caps .predictive-search__actions .predictive-search__quick-tip { color: #000; font-size: 15px; line-height: 20px; font-weight: 700; text-transform: uppercase; } .search-form_cover_inner { display: flex; align-items: center; padding-left: 20px; position: relative; z-index: 9; background-color: #fff; } .search-logo { width: 170px; transform-origin: center top; transform: scaleY(0); visibility: hidden; transition: transform 0.2s ease 0.1s, visibility 0s 0.3s; } details[open=true] .search-logo { visibility: visible; transform: scaleY(1); transition: transform 0.2s ease, visibility 0s; } .search-logo img { object-fit: cover; width: 100%; height: 100%; display: block; } .search-form__label .icon { width: 16px; } .search-form_cover_inner .search-form__inner { position: relative; margin-left: 20px; margin-right: 2px; } .search-popdown__main { padding-top: 18px; } .predictive-search__group.search__group-2 { padding-top: 4px; } .predictive-search__product-price { margin-top: 16px !important; line-height: inherit; margin-bottom: 0 !important; } .predictive-search__product-price span { display: inline-block; } .predictive-search__product-price {} .predictive-search__product-price .predictive-search-special-price { color: #ee0101; padding-right: 8px; font-weight: 600; } .predictive-search__product-price .predictive-search-special-compare { text-decoration: line-through; color: #ccc; } /* 12-10-2023 css */ .trending_suggestion_main .grid, .trending_suggestion_main .grid--center { grid-template-columns: repeat(5, 1fr); --grid-gutter: 60px; gap: var(--grid-gutter); } .trending_suggestion_main .grid .product-grid-item { text-align: center; } .trending_suggestion_main .grid .product-grid-item .product-grid-item__title { font-family: Karla; font-weight: 500; font-size: 12px !important; margin-bottom: 0 !important; letter-spacing: 0; line-height: 14px; color: #000; text-transform: math-auto; margin-top: 0 !important; margin-bottom: 6px !important; } .trending_suggestion_main .grid .product-grid-item .product-grid-item__info.product-grid-item__info--left { text-align: center; } .trending_suggestion_main .grid .product-grid-item .product-grid-item__price.price { padding-right: 8px; font-weight: 600; text-transform: math-auto; } .trending_suggestion_main .grid .product-grid-item .product-grid-item__price.price s { color: #ccc; font-weight: 600; font-family: Karla; font-style: normal; font-size: 14px; line-height: 16px; } .trending_suggestion_main { padding-bottom: 20px; } .no-touch .trending_suggestion_main .product-grid-item__image:hover .product__media__image--hover-slide-in { clip-path: none; } .no-touch .trending_suggestion_main .product-grid-item__image .product-grid-item__quick-buy { display: none; } .search-popdown__results .trending_suggestion_main .predictive-search__heading { padding-top: 4px; padding-bottom: 0; margin-top: 0 !important; } .trending_suggestion_main .product-grid-item__image { --product-media-padding-top: 140%; margin-bottom: 10px; } .nav .search-popdown__results #popularSearchesCollectionLinks-desktop, .nav .search-popdown__results #predictiveSearchSuggestions { margin: 0 0 22px !important; padding-top: 0; } .search-popdown__main .predictive-search__results { padding-top: 41px; } .site-header .nav div#popularSearches-desktop { padding-top: 44px; } .collection__filters-more span svg { left: -20px; width: 15px !important; height: 17px !important; opacity: 1 !important; } .findify-components-search--desktop-facets__header { display: flex; align-items: center; margin-bottom: 22px; margin-top: -15px; } .findify-components-search--desktop-facets__header svg.findify-components--icon { margin-right: 6px; width: 16px; height: 16px; } .findify-components-search--desktop-facets__header button { display: flex; align-items: flex-end; line-height: 1; margin-left: auto; cursor: pointer; } .findify-components-search--desktop-facets__header button * { transition: all 0.4s; } .findify-components-search--desktop-facets__header button:hover * { color: #121212; fill: #121212; } .findify-components-search--desktop-facets__header span { font-family: Karla; font-weight: 700; font-size: 14px; line-height: normal; text-transform: uppercase; color: #121212; } .findify-components-search--desktop-facets__header button span { font-family: Karla; font-weight: 700; font-size: 14px; margin-right: 10px; line-height: 16px; text-transform: uppercase; color: #a9a9a9; } .collection__inner.close-components-sidebar .collection__filters { display: none; } .collection__inner.close-components-sidebar .collection__sticky-bar { width: 100%; } .collection__inner.close-components-sidebar .collection__sticky-bar .search-result-view button { display: inherit; } .collection__inner.close-components-sidebar .collection__products .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .site-header .search-popdown .search-popdown__body--fixed { min-height: auto !important; } @media only screen and (min-width: 1200px) { .popup-chart__content .tab img { width: 100%; } /* .search-popdown__body.search-popdown__body--fixed.header_search__bar { opacity: 0; height: 0; } .search-opened .main-content:before { opacity: 0; } */ } @media only screen and (min-width: 1200px) { .site-header--nav-bottom .menu__item.menu__item--icons, .site-header--nav-bottom .menu__item--icons .menu__item { justify-content: flex-end; order: 1; display: flex; } .site-header--nav-bottom nav.nav { flex-wrap: wrap; position: unset; padding: 0; justify-content: space-between; margin: 15px 0 5px; } .site-header--nav-bottom .menu__items { width: 100%; order: 2; margin-top: 5px; } .site-header--nav-bottom .nav--compress .menu__item.menu__item--compress { margin: 0; } .site-header--nav-bottom .nav--compress .menu__item--compress { display: none; } .site-header--nav-bottom .nav--compress .wishlist-ico.desktop_show { display: flex; order: 1; } .site-header--nav-bottom .logo { position: absolute; left: 0; right: 0; top: 18px; margin-left: auto; margin-right: auto; width: auto; max-width: 300px; justify-content: center; padding: 0; margin-top: 0; margin-bottom: 0; } .site-header--nav-bottom .nav--compress .menu__items .menu__item { display: flex; } .site-header--nav-bottom .grandparent.no-images .header__dropdown__inner { width: 100%; } .site-header--nav-bottom .grandparent .header__dropdown { top: 110px; } .hamburger_icon { display: none; } .site-header--nav-bottom .parent .header__dropdown { top: calc(100% - 10px); } .site-header--nav-bottom .menu__item--icons { margin: 0; } .site-header--nav-bottom .grandparent .header__dropdown__wrapper { max-height: calc(100vh - 90px); } } @media only screen and (max-width: 1199px) { .menu__item.my_account_icon { display: none; } .site-header--nav-bottom .menu__item.menu__item--icons { margin: 0; } .site-header--nav-bottom .mobile-menu { position: unset; padding: 0; min-width: 85px; } .site-header--nav-bottom.site-header>.wrapper { justify-content: center; } .site-header--nav-bottom .mobile-menu-left { margin-right: auto; } .site-header--nav-bottom .mobile-menu-right { margin-left: auto; } .site-header--nav-bottom .logo { max-width: calc(100% - 140px); justify-content: center; padding: 0; } .site-header--nav-bottom .mobile-menu__button { margin: 0; } .site-header--nav-bottom.site-header .mobile-menu .search-popdown { width: 41px; } .site-header--nav-bottom .mobile-menu__button .icon-search { transform: translate(0); } .site-header--nav-bottom .mobile-menu { display: flex; } .site-header--nav-bottom.site-header .nav--default { display: none; } .site-header--nav-bottom .navlink--icon { padding: 8px; } .search-popdown__body--fixed { top: -51px; } .findify-container.findify-autocomplete { pointer-events: none; padding-top: 10px; } html[data-scroll-locked] .findify-container.findify-autocomplete { pointer-events: auto; } .search-popdown__body--fixed .search-form__inner { padding-left: 15px; padding-right: 15px; } .search-logo { display: none; } .search-form_cover_inner { padding: 0; } .search-popdown__main { padding-top: 0; } .search-form_cover_inner .search-form__inner { width: 100%; border: 0; margin: 8px 15px !important; background: #fdf7f0; } .search-form__input-holder { background: #fdf7f0; } .site-header .search-form__input { background: transparent; border: 0 !important; padding: 5px 11px 5px; width: 100%; border-bottom: none !important; } .site-header .search-popdown__body--fixed .search-form__input-holder { padding-left: 9px; padding-right: 3px; } .site-header--nav-bottom.site-header>.wrapper { --header-sticky-height: 44px; } .site-header--nav-bottom .mobile-menu__button .icon-search { width: 26px; } .search-form__label { position: relative; transform: unset; top: 2px; } .mobile-menu__button { z-index: auto; } .predictive-search__group.search__group-1 .predictive-search__heading { margin: 11px 0 22px !important; } .predictive-search__heading { /* margin: 11px 0 22px !important; */ margin: 15px 0 15px !important; color: #1c1d1d; font-size: 15px; line-height: 18px; font-weight: 700; text-transform: uppercase; font-family: Karla; letter-spacing: 0; padding: 0 !important; border-bottom: 0; } .caps .predictive-search__item { padding: 5px 15px 6px !important; background: #f2dace; border-radius: 50px; display: inline-block; margin: 0 12px 12px 0 !important; } .caps .predictive-search__item a.predictive-search__link { text-transform: lowercase; color: #1c1d1d; font-style: normal; letter-spacing: 0; font-family: Karla; font-weight: 500; font-size: 14px; line-height: 16px; } .site-header--nav-bottom.site-header .mobile-menu .search-popdown {} div#searchResults-mobile .popular-searches { padding: 0 15px; } .site-header .popular-searches .predictive-search__list { padding-top: 0 !important; } div#searchResults-mobile .predictive-search { padding: 0 15px; } .predictive-search__group.search__group-2 { padding-top: 0; } .predictive-search__group.search__group-2 .predictive-search__heading { margin-top: 3px !important; } .predictive-search__group.search__group-2 { padding-top: 0; } .predictive-search__group.search__group-2 .predictive-search__heading { margin-top: 3px !important; } .caps .predictive-search__group.search__group-2 .predictive-search__item { background: transparent; margin: 0 !important; padding: 0 !important; margin-bottom: 28px !important; } .caps .predictive-search__group.search__group-2 .predictive-search__item .predictive-search__product-image { max-width: 100%; height: auto; flex: auto; margin-right: 10px; } .caps .predictive-search__group.search__group-2 .img-object-cover { max-width: 134px; } .caps .predictive-search__group.search__group-2 .predictive-search__product { align-items: unset; } .caps .predictive-search__group.search__group-2 .predictive-search__product-title { margin-top: 10px !important; font-family: Karla; font-weight: 500; font-size: 12px !important; margin-bottom: 0 !important; letter-spacing: 0; line-height: 14px; color: #000; padding-left: 0; } .predictive-search__product-cover { width: calc(100% - 130px); padding-left: 16px; } .predictive-search__actions .predictive-search__link { color: #000; font-size: 15px; line-height: 20px; font-weight: 700; text-transform: uppercase; } .predictive-search__product-price span { display: inline-block; font-size: 14px; } .caps .predictive-search__actions { padding: 16px 0; } .caps .predictive-search__group.search__group-2 .predictive-search__item { margin-right: 20px !important; display: block; width: 100%; } .caps .predictive-search__group.search__group-2 .predictive-search__item .predictive-search__product-image { margin-right: 0; width: 130px; } .trending_suggestion_main .grid, .trending_suggestion_main .grid--center { grid-template-columns: repeat(1, 1fr) !important; --grid-gutter: 18px; } .trending_suggestion_main .grid .product-grid-item { display: flex; text-align: -webkit-auto; } .product__badge__item>span { font-size: 12px; } .trending_suggestion_main .grid .product-grid-item .product-grid-item__info.product-grid-item__info--left { text-align: -webkit-auto; padding-left: 16px; margin-top: 10px !important; width: calc(100% - 130px); } .trending_suggestion_main .product-grid-item__image { width: 130px; min-height: 173px; --product-media-padding-top: auto; } .search-popdown__results .trending_suggestion_main .predictive-search__heading {} .trending_suggestion_main { padding-top: 3px; } /* .popular-searches__wrapper .predictive-search__group + .trending_suggestion_main { padding-top: 0; } */ .popular-searches__wrapper .trending_suggestion_main { padding-top: 14px; } .trending_suggestion_main .grid .product-grid-item .product-grid-item__price.price { font-size: 14px; line-height: normal; } .trending_suggestion_main .product-grid-item__quick-buy { display: none; } .search-form__input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ display: none; opacity: 0; } .search-form__input::-moz-placeholder { /* Firefox 19+ */ display: none; opacity: 0; } .search-form__input:-ms-input-placeholder { /* IE 10+ */ display: none; opacity: 0; } .search-form__input:-moz-placeholder { /* Firefox 18- */ display: none; opacity: 0; } .search-popdown__close { top: 0; } .collection__sort-bar .collection__sort__label span { width: auto; position: relative; min-width: 50px; text-align: left; color: #121212; font-family: Karla; font-weight: 500; font-size: 14px; line-height: 16px; text-transform: capitalize; } .collection__sort-bar .collection__sort__label span { width: auto; min-width: auto; } /* .collection__sort-bar .collection__sort__label { padding: 0; } */ } .search-result-view.mobile-search-result-view { display: none; } #CollectionFilter--product-rating-count ul.collection__filter-tags { display: flex; flex-direction: column-reverse; } #CollectionFilter--product-rating-count ul.collection__filter-tags .rating__star__empty { color: #c6c6c6; } #CollectionFilter--product-rating-count ul.collection__filter-tags .rating__star__empty .icon-star--empty { fill: #c6c6c6; } #CollectionFilter--product-rating-count ul.collection__filter-tags .icon-star--full { color: #e9be57; } @media only screen and (max-width: 1023px) { .trending_suggestion_main .grid, .trending_suggestion_main .grid--center { grid-template-columns: repeat(4, 1fr); } .collection__filters-header { display: flex; align-items: center; justify-content: center; text-align: center; height: 94px; background: #f2dacf; padding-top: 0; margin-bottom: 20px; } .collection__filters-header .collection__filters__line { display: none; } .collection__filters-header .collection__filters__close { position: absolute; right: 20px; width: 20px; height: auto; margin: 0; display: block; } .collection__filters-header .collection__filters__top { justify-content: center; padding-bottom: 0; margin: 0; padding: 0; } .collection__filters__title--body { text-transform: uppercase; color: #121212; font-size: 16px; font-family: Karla; font-style: normal; font-weight: 400; line-height: 15px; } .main-content>.shopify-section:first-child .collection__filters { z-index: 9999999999; position: fixed; top: 0; left: 0; right: 0; height: 100%; background: #fff; overflow: auto; max-width: 90%; margin-left: auto; margin-right: 0; } .collection__filters .findify-components-search--desktop-facets__header { display: none; } .collection__sticky-bar { width: 100%; justify-content: space-between; flex-direction: row-reverse; margin-bottom: 18px; position: relative; } .search-result-view { display: none; } button.collection__filters__toggle { height: auto; width: auto; display: block; } .collection__filters--visible { display: block !important; } .collection__filters { position: fixed; top: 0; left: 0; right: 0; height: 100%; background: #fff; overflow: auto; transform: none; width: 100%; margin: auto; z-index: 99999; } .collection__filters-list__inner { width: 100%; padding: 0; margin: 0; overflow-x: hidden; overflow-y: auto; } li.collection__filter-tag { position: relative; } .collection__filter__title { margin-top: 0; background: none; padding: 18px 20px; /* border-top: 1px solid #eee; */ } .collection__filter { border-bottom: 1px solid #eee; } .collection__filter__count svg { height: auto; } .collection__sort .icon, .collection__filter__count .icon { height: auto; top: 50%; transform: translateY(-50%); right: 17px; width: 15px; } .is-expanded .collection__filter__count .icon-toggle-minus { transform: rotate(180deg); top: 37%; } .collection__filter-tag--default .filter__button { position: relative; top: 10px; } .collection__filter-tag--default .filter__button:before { top: 8px; } .collection__filters-list .collection__sort { display: none; } button.collection__filters__toggle span { font-family: Karla; font-weight: 500; font-size: 14px; line-height: 16px; text-transform: capitalize; color: #121212; } button.collection__filters__toggle svg { width: 20px; padding-right: 6px; height: 11px; vertical-align: -2px; cursor: pointer; } mobile-actions-facet-count { padding-left: 3px; } .search-result-view.mobile-search-result-view { display: block; } .search-result-view.mobile-search-result-view { display: block; margin-bottom: 30px; text-align: center; } .search-result-view.mobile-search-result-view span { display: inline-block; font-size: 11px; text-transform: uppercase; font-weight: 400; color: #111; line-height: 17px; margin-right: 0; } .search-result-view.mobile-search-result-view .findify-query-bold { font-weight: 700 !important; } .collection__inner.close-components-sidebar .collection__products .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .collection__filters-bottom { display: block; padding: 0; } .collection__filters-list { justify-content: space-between; height: 100vh; max-width: 100%; } .collection__filters__close-bottom { background: #000; height: 50px; padding: 0; font-family: Karla; font-weight: 500; color: #fff; text-transform: uppercase; letter-spacing: 0; font-size: 14px; line-height: 16px; text-align: center; } .collection__filters-list__inner { margin-bottom: 20px; } .search-page .collection__filters-header { display: flex; align-items: center; padding: 0; } .collection__products-count { display: none; } .collection__sort__title { display: none; } .collection__sort-bar { width: auto; min-width: auto; } .collection__sort-bar .collection__sort__label { padding: 0; } .collection__sort-bar .collection__sort__label .icon { position: relative; top: 0; right: 0; padding-left: 3px; vertical-align: 0; margin-top: -3px; padding-right: 0; margin-left: 8px; width: 15px; } button.collection__filters__toggle span.mobile-actions-facet-count { padding-left: 3px; } } @media only screen and (max-width: 767px) { .ProductSwatchSlider { display: inline-block; width: auto; white-space: nowrap; padding-right: 20px; overflow: auto; padding-right: 0; } .swatch-color { overflow: hidden; } .ProductSwatchSlider li.variant__color-swatch { display: inherit; } .swatch-color .swatch-color { margin: 0; } /* Hide scrollbar for Chrome, Safari and Opera */ .ProductSwatchSlider::-webkit-scrollbar { display: none; } /* Hide scrollbar for IE, Edge and Firefox */ .ProductSwatchSlider { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ } body .locale-selectors__selector { width: 100% !important; } .product-single__thumbnails { display: none; } .disable_dots_onmobile .flickity-page-dots { display: block !important; bottom: 20px; } .disable_dots_onmobile .flickity-page-dots .dot { border: 2px solid #e6e6e6; background: #e6e6e6; opacity: .5; width: 8px; height: 8px; } .disable_dots_onmobile .flickity-page-dots .dot.is-selected { width: 8px; opacity: 1; background: #fff } body #esc-oos-form .NBIS-Modal__popup { width: 70% !important; } .mobile-navlink { padding-left: 0 !important; } .mobile-menu__item--level-2 .mobile-navlink { padding: 7px 5px 7px 20px !important; } .mobile-menu__item--level-3 .mobile-navlink { padding: 7px 5px 7px 65px !important; } } @media only screen and (min-width: 500px) and (max-width: 767px) { .trending_suggestion_main .grid, .trending_suggestion_main .grid--center { grid-template-columns: repeat(2, 1fr); } } @media only screen and (max-width: 499px) { .trending_suggestion_main .grid, .trending_suggestion_main .grid--center { grid-template-columns: repeat(1, 1fr); } } /* .trending_suggestion_main .grid { display: flex !important; gap: 20px; } */ /* ------- */ .refund_text_left strong { line-height: 1.5; } .refund_text_left h3.p2 { line-height: 1.5; } .refund_text_left { word-break: break-word; } .layoutArea .column a { word-break: break-all; } .refund_text_right .faq_topics_item ul li:last-child a { padding: 12px 0 10px 0; } .collection__description { margin: 0px auto 0; display: block; font-size: calc(1.1rem * var(--adjust-heading)); color: var(--11lcxa5); color: inherit; height: 24px; overflow: hidden; padding-right: 25px; position: relative; } .show { height: unset; overflow: visible; white-space: unset; } .collection__header .wrapper--narrow { padding: 0 var(--gutter); position: relative; } .collection__header .js_down_up_arrow1 { position: absolute; top: -2px; right: 3px; transform: rotate(90deg); cursor: pointer; } .collection__header .collection__description.show .js_down_up_arrow1 { top: 0; transform: rotate(-90deg); right: -3px; } .collection__header .collection__description p:first-child { margin-top: 0; } .collection__header .collection__title:last-child { margin-bottom: 0; } .collection__header .collection__title:not(:last-child) { margin-bottom: 10px; } .NBIS-Modal__btn { width: 100%; margin-top: 10px; } .product__form .NBIS-Modal__popup__header_subtitle, .product__form .NBIS-Modal__popup__header_title { text-align: center; } .product__form .NBIS-Modal__popup__header_subtitle { height: inherit; } .NBIS-Modal__ProductTitle { display: none; } .product__submit__buttons .btn { font-size: 17px !important; letter-spacing: 0.1em; text-transform: uppercase; font-weight: bold; } .slider .slide__btn { position: unset !important; } .slider .slide__btn:after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; } .slider .main-buttons__item { transform: inherit !important; } .product-single__details .product__block.icon_block { padding-bottom: 0; } .site-header--nav-bottom .mobile-menu { display: none; } .site-header--nav-bottom.site-header .nav--default { display: flex; } .popup-chart__content .tab p { overflow: auto; } .mobile_menu_new { display: flex; justify-content: space-between; position: relative; width: 100%; align-items: center; } .mobile_menu_new .mobile-navlink { padding-left: 0 !important; max-width: 70%; text-transform: uppercase; } .mobile-menu__item.mobile-menu__item--level-1 { align-items: center; margin-bottom: 5px; } .mobile_menu_new { padding: 0 10px } .mobile-nav__trigger:after { position: absolute; content: ""; top: 0; left: 0; right: 0; bottom: 0; z-index: 999999; } .mobile-nav__trigger.mobile-nav__trigger--level-2.is-expanded::after { bottom: auto; height: 30px; } .countdown_main { display: flex; align-items: center; justify-content: center; gap: 20px; } .countdown_main p#countdown { margin: 0; display: flex; align-items: center; padding: 0 10px; border-radius: 5px; line-height: 1.3; } .countdown_main p#countdown div { font-size: 24px; font-weight: 700; display: flex; align-items: center; gap: 5px; } .countdown_main p#countdown span { font-size: 18px; font-weight: 400; margin-right: 6px; } .countdown_title.h4 { margin: 0; font-weight: 600; } .cart-product-title { padding: 7px 0; text-align: center; border-top: 0.5px solid #e3e3e3; border-bottom: 0.5px solid #e3e3e3; } .cart-product-title h6 { margin-bottom: 0; font-size: 14px; line-height: 20px; text-transform: uppercase; } .cart-product { display: flex; padding: 6px; } .cart-product__img { width: 130px; height: 166px; object-fit: cover; } .cart-product__content { display: flex; flex-direction: column; padding: 6px 10px; justify-content: space-between; } .cart-product__header { display: flex; justify-content: space-between; flex-flow: wrap; } .cart-product__header-left { width: 100%; margin-bottom: 10px; } .cart-product__price { margin: 0; font-size: 14px; line-height: normal; } .cart-product__header-left h6 { margin: 0; } .cart-product__footer { margin-top: 10px; } .cart-product__footer .select select { border: none; border-bottom: 1px solid #000; font-size: 14px; padding: initial; padding-bottom: 5px; padding-left: 10px; cursor: pointer; -webkit-appearance: none; -webkit-border-radius: 0; background: none; color: #000 !important; } .cart-product__footer .select { display: flex; position: relative; flex-direction: column; } .cart-product__footer .select:before { content: ""; width: 6px; height: 6px; position: absolute; top: auto; left: 0; background-color: #000; border-radius: 100%; bottom: 14px; } .btn-outline-primary.cart-product__btn { width: 100%; color: #000; border: 0.6px solid #000; background-color: transparent; margin: 12px 0; padding: 8px 30px; font-size: 14px; line-height: normal; font-weight: 500; margin-bottom: 0; } .cart-product__footer .select:after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 5px; width: 12px; height: 11px; background-image: url('chevron-down-solid.svg'); background-repeat: no-repeat; background-size: contain; pointer-events: none; } .cart-product-slider { border-bottom: 0.5px solid #e3e3e3; } .cart-product-slider .carousel-cell { width: 420px; transition: all 0.4s; } .cart-product-slider button.flickity-button { display: none; } .cart-product-slider .flickity-page-dots { display: none; } .countdown_sticky { transition: 0s all; position: relative; top: -100px; transform: translateY(100px); } .has-scrolled .countdown_sticky { position: fixed; top: calc(-1px + var(--header-height)); left: 0; width: 100%; height: max-content !important; z-index: 999; /* height: var(--header-sticky-height); */ transform: translateY(0); transition: 0.4s all; } .announcement_sticky { transition: 0s all; position: relative; } .has-scrolled .announcement_sticky { position: fixed; top: 0; left: 0; width: 100%; height: max-content !important; transition: 0.4s all; } .has-scrolled .site-header { position: fixed; top: -1px; left: 0; width: 100%; height: max-content !important; z-index: 999; } .countdown_main p#countdown { line-height: 1; } .only_title_view .list-collections__item__content { padding: 10px 10px; width: 100%; display: flex; align-items: center; justify-content: center; } .list-collections-section .section__header:has(+ .grid__container .only_title_view) { margin-bottom: calc(var(--heading-margin) * 1 + var(--inner) / 2); } .list-collections-section .list-collections__item .list-collections__item__outer.only_title_view { height: 100%; display: flex; align-items: center; justify-content: center; } .list-collections-section .list-collections__item .list-collections__item__outer.only_title_view { height: 100%; display: flex; align-items: center; justify-content: center; } @media only screen and (max-width: 1199px) { .menu__item.my_account_icon { display: none; } .site-header--nav-bottom .menu__item.menu__item--icons { margin: 0; } .site-header--nav-bottom .mobile-menu { position: unset; padding: 0; min-width: 85px; } .site-header--nav-bottom.site-header>.wrapper { justify-content: center; } .site-header--nav-bottom .mobile-menu-left { margin-right: auto; } .site-header--nav-bottom .mobile-menu-right { margin-left: auto; } .site-header--nav-bottom .logo { max-width: calc(100% - 140px); justify-content: center; padding: 0; } .site-header--nav-bottom .mobile-menu__button { margin: 0; } .site-header--nav-bottom.site-header .mobile-menu .search-popdown { width: 41px; } .site-header--nav-bottom .mobile-menu__button .icon-search { transform: translate(0); } .site-header--nav-bottom .mobile-menu { display: flex; } .site-header--nav-bottom.site-header .nav--default { display: none; } .site-header--nav-bottom .navlink--icon { padding: 8px; } .search-popdown__body--fixed { top: -51px; } .findify-container.findify-autocomplete { pointer-events: none; padding-top: 10px; } html[data-scroll-locked] .findify-container.findify-autocomplete { pointer-events: auto; } .search-popdown__body--fixed .search-form__inner { padding-left: 15px; padding-right: 15px; } .has-scrolled .countdown_sticky { position: fixed; top: calc(-1px + var(--header-sticky-height)); left: 0; width: 100%; height: max-content !important; z-index: 999; } .wishlist-ico svg.icon { width: 22px; height: auto; } a#smartwishlist_desktop_link { margin: 0; } .mobile-menu__item.mobile-menu__item--level-1 { padding:0; } } @media only screen and (max-width: 767px) { .ProductSwatchSlider { display: inline-block; width: auto; white-space: nowrap; padding-right: 20px; overflow: auto; padding-right: 0; } .swatch-color { overflow: hidden; } .ProductSwatchSlider li.variant__color-swatch { display: inherit; } .swatch-color .swatch-color { margin: 0; } /* Hide scrollbar for Chrome, Safari and Opera */ .ProductSwatchSlider::-webkit-scrollbar { display: none; } /* Hide scrollbar for IE, Edge and Firefox */ .ProductSwatchSlider { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ } body .locale-selectors__selector { width: 100% !important; } .product-single__thumbnails { display: none; } .disable_dots_onmobile .flickity-page-dots { display: block !important; bottom: 20px; } .disable_dots_onmobile .flickity-page-dots .dot { border: 2px solid #e6e6e6; background: #e6e6e6; opacity: .5; width: 8px; height: 8px; } .disable_dots_onmobile .flickity-page-dots .dot.is-selected { width: 8px; opacity: 1; background: #fff } body #esc-oos-form .NBIS-Modal__popup { width: 70% !important; } .mobile-navlink { padding-left: 0 !important; } .mobile-menu__item--level-2 .mobile-navlink { padding: 7px 5px 7px 20px !important; } .mobile-menu__item--level-3 .mobile-navlink { padding: 7px 5px 7px 65px !important; } body .findify-autocomplete { height: calc(100vh - 49px) !important; top: 49px !important; position: fixed !important; overflow: hidden !important; } .findify-container.findify-autocomplete:empty { display: none; } .findify-autocomplete>div { height: 100%; overflow: hidden; } .findify-layouts--autocomplete--dropdown__fullscreen .findify-layouts--autocomplete--dropdown, .findify-layouts--autocomplete--dropdown__wrapper { height: 100%; overflow: hidden !important; } body .findify-layouts--autocomplete--dropdown { position: unset; height: 100%; overflow: hidden; } .findify-layouts--autocomplete--dropdown .findify-components-common--grid { height: 100%; overflow: hidden; } body .findify-components-autocomplete--layout__column { height: 100%; overflow: auto; } .site-header>.wrapper { transform: none !important; position: unset; } search-popdown.search-popdown.mobile-menu__button.caps { position: unset; } .search-popdown__body--fixed { top: 0; } .mobile-menu.mobile-menu-left { position: relative; z-index: 9; } .collection__filters { left: 100% !important; transition: all 0.5s; display: inline-block !important; } .collection__filters.collection__filters--visible { left: 0 !important; } } .cart__checkout { font-size: 16px; font-weight: 600; } .dynamic-checkout__content .shopify-cleanslate ul li:nth-child(2n) { display: none; } .cart__message strong { font-size: 16px; } .item--bottom-center .slide__text__container { justify-content: center; align-items: flex-end; text-align: center; } .findify-components--swiper__next { right: 0 !important; } .collection-Without-CTA .popup-quick-view__inner .product__submit__holder, .product-Without-CTA .product__form .product__submit__holder { display: none; } .findify-element+section.featured-collection { display: none; } .list-collections-section--grid .wrapper--full { padding: 0 var(--gutter-mobile); } .list-collections-section:not(.title-img-visible) .carousel .list-collections__item__outer .list-collections__item__content { padding: 5px 20px; border-bottom: 1px solid; } .list-collections-section:not(.title-img-visible) .only_title_view .list-collections__item__content { padding: 5px 20px; border-bottom: 1px solid; } .list-collections-section:not(.title-img-visible) .carousel .list-collections__item__outer { width: auto; } .list-collections-section:not(.title-img-visible) .carousel .list-collections__item { width: auto; margin: 0; } .list-collections-section:not(.title-img-visible) .carousel .list-collections__item__outer .list-collections__item__content:hover { background: #ffd2d5; } @media only screen and (min-width: 750px) and (max-width: 1023px) { .slideshow .slide__text__wrapper { padding: 0; } } @media only screen and (max-width: 749px) { .slider .slide__btn { position: relative !important; } .countdown_main { flex-wrap: wrap; } .countdown_main p#countdown div { font-size: 20px; } .countdown_main p#countdown span { font-size: 16px; font-weight: 400; margin-right: 6px; } } @media only screen and (max-width: 500px) { .countdown_main p#countdown { margin-top: 7px; width: 100%; text-align: center; justify-content: center; } .countdown_main { gap: 0; } .cart-product__img { width: 100px; height: auto; } .list-collections-section .list-collections__item { width: 50%; } .list-collections-section .list-collections__item .list-collections__item__outer { width: 100%; } } @media only screen and (max-width: 359px) { .countdown_main p#countdown div { font-size: 15px; } } .cart-drawer__options { padding: var(--inner); .cart-drawer__options-control { display: flex; flex-direction: row; align-items: center; gap: 10px; justify-content: flex-start; } } .add_on_sell_option .sell_option { display: flex; align-items: center; font-size: calc(var(--typeBaseSize)*.85); justify-content: start; flex-direction: row-reverse; } .sell_option .toggleSwitch { display: flex; align-items: center; justify-content: end; flex-direction: row-reverse; cursor: pointer; } .toggleSwitch input[type=checkbox] { -webkit-appearance: none; appearance: none; margin: 0 !important; border: none !important; } .toogle_button_design { width: 35px; height: 16px; text-align: left; white-space: nowrap; position: relative; margin-left: 10px; } .toogle_button_design:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; background-color: #a7a7a7; border: 1px solid #a7a7a7; border-radius: 30px; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; transition: all .2s ease-out; } .toggleSwitch input:checked+.toogle_button_design span:first-child { opacity: 0; } .toggleSwitch input:checked+.toogle_button_design span { opacity: 1; color: #fff; } .toogle_button_design span:first-child { color: #ccc; opacity: 1; left: 54%; } .toogle_button_design span { position: absolute; z-index: 5; display: block; width: 50%; text-align: left; font-size: .9em; width: auto; left: 15%; top: 3px; opacity: 0; line-height: normal; display: flex; aspect-ratio: 1; align-items: center; } .toogle_button_design span svg { line-height: normal; } .toggleSwitch input:checked+.toogle_button_design span svg { margin-top: -2px; } .toogle_button_circle { position: absolute; right: 50%; z-index: 4; display: block; height: 12px; padding: 0; width: 12px; background-color: #e1e1e1; border: 1px solid #CCC; border-radius: 100%; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; transition: all .2s ease-out; box-shadow: 0 1px 2px #0000000d; border-color: #fff; left: 0; top: 2px; margin-left: 3px; } .toggleSwitch input:checked+.toogle_button_design .toogle_button_circle { left: 100%; margin-left: -15px; } .sell_option_icon { display: flex; align-items: center; font-size: 14px; line-height: 20px; font-weight: 900; } .add_on_sell_option img { width: 25px; height: auto; margin-right: 5px; } .cart-drawer__options:has(> .add_on_sell_option) { padding-left: 0; padding-right: 0; } fieldset.cart__buttons__fieldset button.cart__checkout.btn { max-width: 100%; } .toggleSwitch input:checked+.toogle_button_design::before { background-color: #000; border: 1px solid #000; } .highlight-submenu-design.mobile-menu__item { padding: 0; } .highlight-submenu-design.mobile-menu__item .mobile_menu_new { padding: 0 10px; } .highlight-submenu-design .mobile-dropdown { background: transparent !important; margin-top: 0; } .highlight-submenu { color: var(--highlight-submenu); } .menu__item .navlink--highlight .navtext { /* padding: 5px var(--inner); */ } body ._carouselContainer_1y5mc_1 { width: 100%; } /* ------- */ .popular-searches__wrapper .collection__products { margin-top: 25px; } .search-form_cover_inner .search-logo { min-width: 150px; } .list-collections__item--square .list-collections__item__image { height: auto; aspect-ratio: 54/81; width: 100%; } .product-swiper-container, .collection-swiper-container { /* max-width: 1200px; */ margin: 0 auto !important; overflow: hidden; position: relative; } .collection-swiper-container .swiper-container { padding: 0; } .product-swiper-container .swiper-button-next, .product-swiper-container .swiper-button-prev, .collection-swiper-container .swiper-button-next, .collection-swiper-container .swiper-button-prev { color: var(--text); } .product-swiper-container .swiper-button-next:after, .product-swiper-container .swiper-button-prev:after, .collection-swiper-container .swiper-button-next:after, .collection-swiper-container .swiper-button-prev:after { --swiper-navigation-size: 30px !important; } .related-products .product-grid-item__title, .collection-swiper-container .product-grid-item__title { font-family: Karla; font-weight: 500; font-size: 12px !important; margin-bottom: 0 !important; letter-spacing: 0; line-height: 14px; } .product-swiper-container .product-grid-item { width: 100%; } .product-swiper-container .product-grid-item__price .product-grid-item__price__new, .collection-swiper-container .product-grid-item__price .product-grid-item__price__new { color: #ee0101; } .product-swiper-container .product-grid-item__price.price s, .collection-swiper-container .product-grid-item__price.price s { text-decoration: line-through; color: #878787; } .mosaic--spacing .wrapper--full .mosaic__grid { width: 100%; margin: 0; } .mosaic__item { width: calc(var(--block-width) - 12px); margin: 0 6px; padding: 0; } .footer-title__button, .footer-title { font-size: 16px; font-weight: 900; line-height: 24px; } .locale-selectors__container { display: none; } .footer-block .rte { font-size: 16px; font-weight: 400; line-height: 24px; } .footer-links li { line-height: normal; } .site-footer { padding-bottom: 32px; } .footer-copyright { padding-top: 30px; border-top: 1px solid rgb(0 0 0 / 20%); font-size: 14px; font-weight: 400; line-height: 21px; } .footer-bottom::after { content: none; } .payment-icon-list { row-gap: 10px; } .footer-link { font-size: 14px; font-weight: 400; line-height: 21px; } .findify-container { width: 100%; max-width: 100%; margin: 0 auto; padding: 0 var(--gutter-mobile); } body ._arrowButtonContainer_1y5mc_272:first-child { margin-left: -36px; } body ._arrowButtonContainer_1y5mc_272:last-child { margin-right: -36px; } body #home-findify-rec-2 { margin: 0; } .flickity-prev-next-button, .pswp__button--arrow--left, .pswp__button--arrow--right { background: transparent !important; box-shadow: none !important; } .flickity-prev-next-button.next:before, .pswp__button--arrow--right:before, .flickity-prev-next-button.previous:before, .pswp__button--arrow--left:before { mask-size: 30px; } .flickity-prev-next-button { opacity: 1; transform: scale(1) translateY(-50%); visibility: visible; } .flickity-prev-next-button:hover, .pswp__button--arrow--left:hover, .pswp__button--arrow--right:hover { transform: scale(1) translateY(-50%) !important; } .carousel .flickity-viewport { overflow: hidden; } .product-grid-item__title { font-family: Karla; font-weight: 500; font-size: 12px !important; margin-bottom: 0 !important; letter-spacing: 0; line-height: 14px; } .swatch__button input:checked + label.swatch__label:before { content: "" !important; background: url(tick.svg); position: absolute; height: 20px; width: 20px; transform: translate(-50%, -50%); z-index: 1; background-size: 15px; left: 50%; top: 50%; background-position: center; background-repeat: no-repeat; } .filter__active__remove { background: transparent; border: 1px solid #000; padding: 2px 32px 2px 10px; } .filter__active__remove:hover { text-decoration: line-through; } .filter__active__remove .filter__x { font-size: 12px; font-weight: bold; padding: 5px 8px 0 7px; } .collection__filters__reset.is-visible { font-size: 14px; color: #a9a9a9; text-transform: uppercase; text-decoration: none; } @media only screen and (min-width: 1024px) { .findify-container { padding: 0 var(--gutter); } .wrapper--full-padded .carousel .flickity-prev-next-button.next { right: calc(var(--gutter) * 1); } .wrapper--full-padded .carousel .flickity-prev-next-button.previous { left: calc(var(--gutter) * 1); } } @media only screen and (min-width: 1024px) { .section-columns .column__item { width: auto; } .section-columns .column__item__image { min-height: 102px; } .section-columns .carousel:not(.flickity-enabled) { justify-content: space-between; } .menu__item:not(.menu__item--compress) search-popdown>details>summary:first-of-type { margin-left: -7px; } } @media only screen and (min-width: 990px) { .product-swiper-container .swiper-wrapper .swiper-slide, .collection-swiper-container .swiper-wrapper .swiper-slide { width: calc(100% / 4 - 12px); margin: 0 6px; } } @media only screen and (max-width: 1199px) { .search-popdown__main .predictive-search__results { padding-top: 0; } .site-header--nav-bottom .mobile-menu.mobile-menu-left { margin-left: -12px; } } @media only screen and (max-width: 1100px) { .collection__products .grid, .grid--center { gap: 5px; row-gap: 28px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .trending_suggestion_main .grid, .trending_suggestion_main .grid--center { grid-template-columns: repeat(2, 1fr) !important; } } @media only screen and (min-width: 768px) and (max-width: 1020px) { .search-form .collection__products .grid { display: flex; flex-wrap: wrap; row-gap: 0; } .search-form .trending_suggestion_main .grid .product-grid-item { width: calc(50% - 3px); } } @media only screen and (max-width: 1023px) { /* 05-06-2024 css */ .collection__filters-header { padding: 10px 20px 0; height:auto; min-height:94px; } .collection__filters-list__inner .collection__filters__line { display: none; } .collection__filters { left:100% !important; /* display:inline-block !important; */ transition: all 0.5s; } .collection__filters.collection__filters--visible { max-width: 90%; margin-left: auto; margin-right: 0;left:0 !important; } .collection__filters__title--body { font-size: 18px; text-transform: capitalize; font-weight: 700; color: #2E2E2E; } .collection__filter__title>span:first-child { font-size: 15px; line-height: 26px; color: #2e2e2e; text-transform: uppercase; } .collection__filter__title { padding: 10px 40px 10px 20px; } .collection__sort .icon, .collection__filter__count .icon { height: auto; top: 50%; transform: translateY(-50%); right: 14px; width: 14px; stroke-width: 16px; fill: #2e2e2e; } .filter__active__remove { color: #2e2e2e; } button.collection__filters-more.btn.btn--text { margin-left: 20px; margin-right: auto; } button.collection__filters__toggle svg { padding-right:0; } .product-grid-item_more-colours { font-weight: 600; font-size: 13px; text-decoration: underline; } /* .collection__filter-tags-wrapper.is-expanded { margin-top: 12px; border-bottom: 1px solid #c7c7c7; padding-bottom: 10px; } */ .collection__filter-tags-wrapper { margin: 0 20px; width: calc(100% - 40px); padding: 0; } } @media only screen and (max-width: 989px) { .product-swiper-container .swiper-wrapper .swiper-slide, .collection-swiper-container .swiper-wrapper .swiper-slide { width: calc(100% / 3 - 12px); margin: 0 6px; } .site-header--nav-bottom .mobile-menu.mobile-menu-left { margin-left: -5px; } body ._arrowButtonContainer_1y5mc_272:first-child { margin-left: -25px; margin-right: -10px; } body ._arrowButtonContainer_1y5mc_272:last-child { margin-right: -25px; margin-left: -10px; } .caps .predictive-search__actions { margin: 0; } } @media only screen and (max-width: 767px) { .search-page { padding-top: 36px; } .search-popdown__body--fixed { top: 0 !important; } .popular-searches { max-height: calc(100svh - var(--header-height) + 20px); } .caps .predictive-search__actions { margin-top: 0; } .product-grid-item__price__new { margin-right: 0; } .collection__products .product-grid-item__price.price { margin-bottom: 4px !important; } .product-swiper-container .swiper-wrapper .swiper-slide, .collection-swiper-container .swiper-wrapper .swiper-slide { width: calc(100% / 2 - 10px); margin: 0 5px; } .swiper-button-next, .swiper-button-prev { position: absolute; top: var(--swiper-navigation-top-offset, 40%) !important; } .mosaic__item { margin: 0; } .site-header--nav-bottom .mobile-menu.mobile-menu-left { margin-left: 0; } .site-header--nav-bottom.site-header>.wrapper { padding: 0 23px; } .mosaic__grid .mosaic__item { padding: calc(var(--gutter-mobile) / 2) 0; } body ._arrowButtonContainer_1y5mc_272:has([style="display: none;"]) { display: none; } .product-swiper-container .swiper-button-next, .product-swiper-container .swiper-button-prev { top: 28% !important; background: #fff; width: 25px; height: 25px; border-radius: 50%; } .product-swiper-container .swiper-button-next:after, .product-swiper-container .swiper-button-prev:after { --swiper-navigation-size: 14px !important; } .product-grid-item__price { font-weight: 700; margin-top: 12px; } .swatch-color .variant_name_main { flex-direction: column; } .swatch-color .variant_name_main .all_colours { margin-bottom: 10px; } } .findify-more-colours { font-family: Karla; margin-top: 4px; min-height: 22px; text-transform: capitalize; font-size: 13px; text-decoration: underline; font-weight: 600; color: #000; } /* ------- */ ul.collection__filter-tags.collection__filter-tags--swatches:has(+.is-expanded) { /* overflow-y: auto; margin-top: 0; */ } ul.collection__filter-tags.collection__filter-tags--swatches li label.swatch__label span { position: unset; margin-top: 65px; display: inline-block; min-width: 50px; } ul.collection__filter-tags.collection__filter-tags--swatches li label.swatch__label { display: flex; align-items: center; justify-content: center; } ul.collection__filter-tags.collection__filter-tags--swatches { grid-template-columns: 50px 50px 50px; margin-top: 0; column-gap: 12px; /* max-height: 230px; */ } ul.collection__filter-tags.collection__filter-tags--swatches li:nth-child(-n+3) { padding: 0; } .collection__filter-tags--swatches-rectangle .collection__filter-tag--swatch { justify-content: center; } .collection-list .list-collections-section:not(.title-img-visible) .grid { row-gap: calc(var(--grid-gutter) * 1); } .list-collections-section:not(.title-img-visible) .only_title_view{ width: auto; } .list-collections-section:not(.title-img-visible) .only_title_view .list-collections__item__content { padding-left: 5px !important; padding-right: 5px !important; } @media only screen and (max-width: 767px) { .collection-list .list-collections-section:not(.title-img-visible) .grid { flex-wrap: wrap; margin: 0; padding-left: 20px; padding-right: 20px; justify-content: center; row-gap: 10px; } .list-collections-section:not(.title-img-visible) .list-collections__item { width: auto; } ul.collection__filter-tags.collection__filter-tags--swatches { grid-template-columns: 50px 50px 50px 50px; } ul.collection__filter-tags.collection__filter-tags--swatches li:nth-child(-n+4) { padding: 0; } ul.collection__filter-tags.collection__filter-tags--swatches { overflow: auto; } } /* ul.collection__filter-tags.collection__filter-tags--swatches::-webkit-scrollbar { position:absolute; right:0; } */ @media only screen and (min-width: 1200px) { .grandparent .header__dropdown { margin: 0; top: 100% !important; max-width: 500px; width: 500px; left: 50%; transform: translateX(-50%); background: #fff; } .site-header__background { display: none; } .menu__item { position: relative; } .grandparent .header__dropdown__wrapper { padding: 0; } .grandparent .header__grandparent__links { display: flex; flex-wrap: nowrap; justify-content: space-between; } } .predictive-search__product-price .predictive-search-special-price:not(:has(+s, +span)) { color: #000; } .collection-list .flickity-viewport { max-width: 95%; margin: 0 auto; } .collection-list .flickity-button { top: 50%; transform: translateY(-50%); } .resell_section_cover { border: 1px solid #cbcbcb; padding: 20px 20px 0; margin-bottom: 30px; } .resell_section_cover a { font-weight: 800; } .product__badge.product__badge_custom { right: 0; left: auto; justify-items: end; } /* Start custom popup css 19-09-2024 */ .custom-popup { position: fixed; left: 0; top: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.75); pointer-events: none; transform: scale(.85); visibility: hidden; opacity: 0; transition: .5s all; } .custom-popup.show { transform: scale(1); opacity: 1; visibility: visible; pointer-events: all; z-index: 9999999999; } .popup-content { display: flex; flex: 0 0 100%; flex-wrap: wrap; align-items: center; justify-content: center; height: 100%; text-align: center; padding: 0 15px; } .popup-content-inr { width: 100%; max-width: 610px; position: relative; background: #fff; padding: 43px 16px 20px; border: 2px solid; border-color: rgb(0 0 0); box-shadow: 0 4px 6px rgba(0, 0, 0, .25); } .closepopup { height: 22px; transition: .5s all; text-decoration: none; color: #000; cursor: pointer; position: absolute; right: 30px; top: 16px; } .closepopup:before, .closepopup:after { height: 100%; width: 3px; background: #000; content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 10px; margin-left: auto; transform: rotate(45deg); transition: .5s all; } .closepopup:after { transform: rotate(-45deg); } .plp-description-inr p { margin: 0; font-size: 22px; font-weight: 400; line-height: 36px; text-transform: uppercase; letter-spacing: 0.8px; } .plp-button-cover { display: flex; justify-content: center; flex-wrap: wrap; column-gap: 12px; margin: 30px 0; } .plp-button-cover .btn { width: calc(100% / 2 - 6px); display: inline-block; font-size: 22px; line-height: 28px; text-transform: capitalize; font-weight: 500; --top-bottom-padding: 10px; letter-spacing: normal; cursor: pointer; } .plp-button-cover .btn.btn--black-outline { border-width: 2px; } /* End custom popup css 19-09-2024 */ @media only screen and (max-width: 767px) { .resell_section_cover h3 { font-size: 18px; } .resell_section_cover p { font-size: 14px; } .plp-button-cover .btn { width: 100%; font-size: 20px; } .plp-button-cover { row-gap: 10px; margin: 20px 0; } .popup-content-inr { padding: 50px 15px 20px; } .plp-description-inr p { font-size: 18px; font-weight: 400; line-height: 30px; } .plp-description-inr p br { display: none; } .closepopup { right: 22px; top: 10px; } } @media screen and (min-width: 1200px) { .has-scrolled .return_main { margin-top: 120px; } } @media screen and (max-width: 749px) { .has-scrolled .return_main { margin-top: 80px; } } .rev_bar { display: flex; align-items: center; gap: 5px; background: #F5EFEB; justify-content: center; margin: 0 0 5px 0; } .rev_bar .star_img { display: flex; align-items: center; gap: 3px; } .rev_bar .star_txt > * { margin: 0; } @media screen and (min-width: 1055px) { .left_bar { position: absolute; top: 50%; transform: translateY(-50%); left: var(--gutter); background: #F5EFEB; right: auto; z-index: 99; width: auto; overflow: hidden; } .rev_bar { justify-content: flex-start; margin: 0; } .announcement-bar-static .top-bar .top-bar__slider { width: 100%; margin: 0 auto; } } .wishlist-only-mobile { display:none; } .yotpo-base-layout { margin: 0 auto; width: 100% !important; } @media only screen and (max-width:1023px) { .wishlist-only-desktop { display:none; } .wishlist-only-mobile { display:flex; } .smart-add-to-wishlist { right: 0; left: auto; position: relative; top: 0; height: auto; background: transparent; bottom: auto; width: 18px; margin-top: -6px; margin-right: 15px; } .smart-add-to-wishlist .fa-heart-o:before { font-size: 18px; } .product-grid-item__price { justify-content: space-between; display: flex; flex-wrap: wrap; } .product-grid-item__image .btn--quick { right: 5px; bottom: 5px; width: 34px; height: 34px; } .product-grid-item__image .btn--quick .btn__inner { width: 22px !important; left: -3px; position: relative; } .product-grid-item__title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .product-grid-item__price.price .product_main_wishlist { display: inline-block; width: calc(100% - 41px); } }