/** Shopify CDN: Minification failed

Line 28:2082 Unexpected "}"

**/
@media (max-width: 768px) { /* Applies to screens up to 768px (mobile) */
  .wa-btn-float {
    display: none;
  }
}
@media (max-width: 768px) {
    .header__logo--arabic {
        width: 50%;
       
    }
  .header__action-list--arabic{
    width:30%;
  }
 
    .header__mobile-nav--arabic {
        width: 14%;
        margin-right: 1px!important;

   
}

}
@media (min-width: 768px) { .mobile-nav-bar { display: none; } } /* Hide language selector on desktop and show on mobile */ @media (min-width: 769px) { .header__action-item--locale { display: none; } } /* Ensure that the mobile language selector shows as clickable labels */ .popover__linklist-item { margin: 5px 0; } .popover__link-item { display: block; padding: 10px; text-align: center; background-color: #f0f0f0; border: 1px solid #ddd; border-radius: 4px; width: 100%; cursor: pointer; text-transform: capitalize; } .popover__link-item:hover { background-color: #e0e0e0; } /* Make selected language stand out */ .popover__link-item[aria-current="true"] { background-color: #ddd; } @media only screen and (max-width: 767px) { .mobile-nav-bar { display: flex; justify-content: space-around; align-items: center; background-color: #fff; /* يمكنك تغيير الخلفية حسب التصميم */ padding: 10px; border-top: 1px solid #eaeaea; position: fixed; bottom: 0; width: 100%; z-index: 1000; } .nav-icon { flex: 1; text-align: center; } /* الأيقونات مفرغة بحواف سوداء */ .nav-icon i { font-size: 24px; color: transparent; /* لا يوجد لون تعبئة */ -webkit-text-stroke: 2px #2B4293; /* حدود سوداء */ text-stroke: 2px #2B4293; /* حدود سوداء */ transition: all 0.3s ease; } /* عند تمرير الماوس على الأيقونات، تتغير الحدود إلى الأزرق */ .nav-icon a:hover i { -webkit-text-stroke: 2px #4566DC; /* حدود زرقاء عند التمرير */ text-stroke: 2px #4566DC; } .cart-icon { position: relative; } .cart-count { position: absolute; top: -8px; right: -8px; background-color: #ff5722; color: #fff; border-radius: 50%; padding: 2px 6px; font-size: 12px; } } .hidden-pocket.header__action-item--locale { display: inline-block ; font-size: 12px !important; padding: 5px 10px !important; margin-left: 10px !important; position: relative !important; top: 0 !important; left: auto !important; } .popover--locale { height: auto !important; width: fit-content !important; } } @media screen and (max-width: 767px) { .header__action-item--locale { display:none; font-size: 10px; /* Smaller font size for mobile */ margin-left: 5px; /* Adjust the spacing */ } } /*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */ *, :before, :after { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; box-sizing: border-box !important; } html { -moz-text-size-adjust: 100%; text-size-adjust: 100%; -ms-overflow-style: -ms-autohiding-scrollbar; font-family: sans-serif; } body { margin: 0; } [hidden] { display: none !important; } article, aside, details, figcaption, figure, footer, header, main, nav, section, summary { display: block; } audio, canvas, progress, video { vertical-align: baseline; display: inline-block; } audio:not([controls]) { height: 0; display: none; } :active { outline: none; } a { color: inherit; background-color: #0000; text-decoration: none; } a:active, a:hover { outline: 0; } b, strong { font-weight: bold; } small { font-size: 80%; } p, h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; margin-top: 0; } p:last-child, h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child { margin-bottom: 0; } img { vertical-align: top; border-style: none; max-width: 100%; height: auto; } ul, ol { margin: 0; padding: 0; list-style-position: inside; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace; font-size: 16px; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button, input[type="submit"] { -webkit-appearance: none; background: none; border: none; border-radius: 0; padding: 0; overflow: visible; } button, select { text-transform: none; } .collection__toolbar-item--filter{ font-weight: 900; } .hidden-tablet-and-up{ font-weight: 900; } #desktop-filters-form .card__title--small { font-weight: 900; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } input::-moz-focus-inner { border: 0; padding: 0; } input { -moz-appearance: none; border-radius: 0; line-height: normal; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button { height: auto; } input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: none; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } input::placeholder, textarea::placeholder { color: inherit; } .is-tabbing input[type="radio"]:focus + label { outline: 1px dotted #212121; outline: 5px auto -webkit-focus-ring-color; } fieldset { border: 1px solid silver; margin: 0 2px; padding: 6px 10px 12px; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } .flickity-enabled { position: relative; overflow: visible !important; } .flickity-enabled:focus { outline: none; } .flickity-viewport { width: 100%; height: 100%; position: relative; overflow: hidden; } .flickity-slider { will-change: transform; width: 100%; height: 100%; position: absolute; } .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; -webkit-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: grabbing; } .flickity-page-dots { text-align: center; width: 100%; padding: 0; line-height: 0; list-style: none; position: absolute; bottom: 0; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { background: rgba(var(--text-color-rgb), .8); cursor: pointer; will-change: transform; border-radius: 100%; width: 6px; height: 6px; margin: 0 5px; transition: background .2s ease-in-out, transform .2s ease-in-out; display: inline-block; position: relative; transform: scale(1); } .flickity-page-dots .dot:before { content: ""; position: absolute; top: -4px; bottom: -4px; left: -4px; right: -4px; } .flickity-page-dots .dot.is-selected { background: var(--heading-color); transform: scale(1.35); } .flickity-prev-next-button { visibility: visible; background: var(--flickity-arrow-color); opacity: 0; z-index: 1; border-radius: 100%; justify-content: center; align-items: center; width: 50px; height: 50px; transition: all .2s ease-in-out; display: inline-flex; position: absolute; top: calc(50% - 25px); transform: scale(.7); } .flickity-prev-next-button:hover { background: var(--accent-color); } .flickity-prev-next-button svg { fill: var(--secondary-background); vertical-align: middle; width: 15px; height: 15px; position: relative; } .flickity-prev-next-button[disabled] { opacity: 0; visibility: hidden; } .flickity-prev-next-button.previous { left: -25px; } .flickity-prev-next-button.previous svg { left: 1px; } .flickity-prev-next-button.next { right: -25px; } .flickity-prev-next-button.next svg { left: -1px; } .flickity-enabled:hover .flickity-prev-next-button:not([disabled]) { opacity: 1; transform: scale(1); } .flickity-enabled.is-fade .flickity-slider > * { pointer-events: none; z-index: 0; visibility: hidden; opacity: 0 !important; transition: opacity .3s linear, visibility .3s linear !important; } .flickity-enabled.is-fade .flickity-slider > .is-selected { pointer-events: auto; z-index: 1; visibility: visible; opacity: 1 !important; } .modal[aria-hidden="true"] .flickity-slider > * { pointer-events: none !important; } .product-gallery__carousel.is-fade .flickity-slider > * { transition: opacity .3s linear !important; } @keyframes drift-fadeZoomIn { 0% { opacity: 0; transform: scale(1.2); } 100% { opacity: 1; transform: scale(1); } } @keyframes drift-fadeZoomOut { 0% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(.5); } } @keyframes drift-loader-rotate { 0% { transform: translate(-50%, -50%)rotate(0); } 50% { transform: translate(-50%, -50%)rotate(-180deg); } 100% { transform: translate(-50%, -50%)rotate(-360deg); } } @keyframes drift-loader-before { 0% { transform: scale(1); } 10% { transform: scale(1.2)translateX(6px); } 25% { transform: scale(1.3)translateX(8px); } 40% { transform: scale(1.2)translateX(6px); } 50% { transform: scale(1); } 60% { transform: scale(.8)translateX(6px); } 75% { transform: scale(.7)translateX(8px); } 90% { transform: scale(.8)translateX(6px); } 100% { transform: scale(1); } } @keyframes drift-loader-after { 0% { transform: scale(1); } 10% { transform: scale(1.2)translateX(-6px); } 25% { transform: scale(1.3)translateX(-8px); } 40% { transform: scale(1.2)translateX(-6px); } 50% { transform: scale(1); } 60% { transform: scale(.8)translateX(-6px); } 75% { transform: scale(.7)translateX(-8px); } 90% { transform: scale(.8)translateX(-6px); } 100% { transform: scale(1); } } .drift-zoom-pane { background: var(--secondary-background); z-index: 2; border: 1px solid var(--accent-color); box-shadow: 0 1px 2px rgba(#000, .2); border-radius: 3px; width: 100%; max-width: 520px; height: 520px; position: absolute; top: 0; left: 0; transform: translate3d(0, 0, 0); } .drift-zoom-pane.drift-opening { animation: .18s ease-out drift-fadeZoomIn; } .drift-zoom-pane.drift-closing { animation: .21s ease-in drift-fadeZoomOut; } .drift-zoom-pane.drift-inline { border-radius: 50%; width: 150px; height: 150px; position: absolute; box-shadow: 0 6px 18px #0000004d; } .drift-loading .drift-zoom-pane-loader { width: 66px; height: 20px; animation: 1.8s linear infinite drift-loader-rotate; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .drift-zoom-pane-loader:before, .drift-zoom-pane-loader:after { content: ""; background: rgba(var(--text-color-rgb), .4); border-radius: 20px; width: 20px; height: 20px; margin-top: -10px; display: block; position: absolute; top: 50%; } .drift-zoom-pane-loader:before { animation: 1.8s linear infinite drift-loader-before; left: 0; } .drift-zoom-pane-loader:after { animation: 1.8s linear -900ms infinite drift-loader-after; right: 0; } .drift-bounding-box { background-color: rgba(var(--accent-color-rgb), .05); border: 1px solid var(--accent-color); border-radius: 3px; } @media screen and (min-width: 641px) { .drift-zoom-pane.drift-inline { width: 240px; height: 240px; } } .pswp { touch-action: none; z-index: 1500; -webkit-backface-visibility: hidden; outline: none; width: 100%; height: 100%; display: none; position: absolute; top: 0; left: 0; overflow: hidden; } .pswp img { max-width: none; } .pswp--animate_opacity { opacity: .001; will-change: opacity; transition: opacity .333s cubic-bezier(.4, 0, .22, 1); } .pswp--open { display: block; } .pswp--zoom-allowed .pswp__img { cursor: zoom-in; } .pswp--zoomed-in .pswp__img { cursor: grab; } .pswp--dragging .pswp__img { cursor: grabbing; } .pswp__bg { background: var(--secondary-background); opacity: 0; -webkit-backface-visibility: hidden; will-change: opacity; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transform: translateZ(0); } .pswp__scroll-wrap { width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; } .pswp__container, .pswp__zoom-wrap { touch-action: none; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .pswp__container, .pswp__img { -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .pswp__zoom-wrap { transform-origin: 0 0; width: 100%; transition: transform .333s cubic-bezier(.4, 0, .22, 1); position: absolute; } .pswp__bg { will-change: opacity; transition: opacity .333s cubic-bezier(.4, 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; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; } .pswp__img { width: auto; height: auto; position: absolute; top: 0; left: 0; } .pswp__ui { z-index: 1550; height: 100%; position: relative; } .pswp__button { border: 1px solid var(--border-color); background: var(--secondary-background); border-radius: 100%; justify-content: center; align-items: center; width: 32px; height: 32px; display: flex; } .pswp__button--close { position: absolute; top: 20px; right: 20px; } .pswp__button--close svg { width: 12px; height: 12px; } .pswp__prev-next { justify-content: space-between; width: 100%; padding: 0 20px; display: flex; position: absolute; top: calc(50% - 18px); left: 0; } .pswp__prev-next svg { width: 9px; height: 13px; position: relative; } .pswp__button--arrow--left svg { left: -1px; } .pswp__button--arrow--right svg { right: -1px; } .pswp__pagination { background: var(--secondary-background); border: 1px solid var(--border-color); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); border-radius: 20px; padding: 1px 13px; position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); } html { font-family: var(--text-font-family); font-weight: var(--text-font-weight); font-style: var(--text-font-style); font-size: calc(var(--base-text-font-size) - 1px); color: var(--text-color); background: var(--background); line-height: 1.87; } @media screen and (min-width: 641px) { html { font-size: var(--base-text-font-size); } } .heading { font-family: var(--heading-font-family); font-weight: var(--heading-font-weight); font-style: var(--heading-font-style); color: var(--heading-color); } .h1, .rte h1 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 24px)); margin-bottom: 20px; line-height: 1.45; } .h2, .rte h2 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 22px)); margin-bottom: 20px; line-height: 1.55; } .h3, .rte h3 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 20px)); margin-bottom: 14px; line-height: 1.6; } .h4, .rte h4 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); line-height: 1.75; } .h5, .rte h4 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); text-transform: uppercase; line-height: 1.85; } .h6, .rte h5 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); text-transform: uppercase; line-height: 1.85; } @media screen and (min-width: 641px) { .h1, .rte h1 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 28px)); line-height: 1.43; } .h2, .rte h2 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 25px)); line-height: 1.5; } .h3, .rte h3 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 21px)); line-height: 1.5; } .h4, .rte h4 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); line-height: 1.7; } .h5, .rte h5 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); line-height: 1.75; } .h6, .rte h6 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); line-height: 1.7; } } .text--strong, .highlight { color: var(--heading-color); font-weight: var(--text-font-bolder-weight); } .text--pull { margin-top: -.435em; } .text--small { font-size: .9em; } .link { transition: color .2s ease-in-out; } .link:hover, .link:focus { color: var(--accent-color); } .link--secondary:hover, .link--secondary:focus { color: var(--heading-color); } .link--strong { font-weight: var(--heading-font-weight); } .link--accented { color: var(--accent-color); } .link--accented:hover, .link--underline { text-decoration: underline; } @keyframes spinnerRotation { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } .icon { fill: currentColor; vertical-align: middle; pointer-events: none; background: none; width: 1em; height: 1em; display: inline-block; overflow: visible; } .icon--search-loader { animation: .7s linear infinite spinnerRotation; } @media (-moz-touch-enabled: 1), (hover: none) { .touch-area { background: none; position: relative; } .touch-area:before { content: ""; position: absolute; top: -8px; bottom: -8px; left: -8px; right: -8px; transform: translateZ(0); } } .table-wrapper { -webkit-overflow-scrolling: touch; overflow: auto; } .table, .rte table { text-align: left; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); width: 100%; } .table caption { text-align: inherit; margin-block-end: .5rem; } .table th { font-weight: normal; } .table th, .table td { padding: 16px 20px; } .table th:first-child, .table td:first-child { padding-left: 20px; } .table th:last-child, .table td:last-child { padding-right: 20px; } .table tbody tr { border-top: 1px solid var(--border-color); } .table .table__cell--right { text-align: right; } .table .table__cell--center { text-align: center; } .table--loose tbody td { padding-top: 26px; padding-bottom: 26px; } .table--tight tbody td { padding-top: 12px; padding-bottom: 12px; } .rte table th, .rte table td { padding: 3px 6px; } .rte tbody tr { border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); } @media screen and (max-width: 640px) { .card .table { margin-left: 20px; } .card .table th:first-child, .card .table td:first-child { padding-left: 0; } } @media screen and (min-width: 641px) { .table th, .table td { padding: 15px 30px; } .table th:first-child, .table td:first-child { padding-left: 30px; } .table--tight th, .table--tight td { padding: 12px 15px; } .table--tight th:first-child, .table--tight td:first-child { padding-left: 15px; } .table th:last-child, .table td:last-child { padding-right: 15px; } } @media screen and (min-width: 1000px) { .table-wrapper { white-space: normal; overflow: visible; } } html { overflow-x: hidden; } body:not(.is-tabbing) [tabindex]:focus, body:not(.is-tabbing) label:focus, body:not(.is-tabbing) button:focus, body:not(.is-tabbing) input:focus, body:not(.is-tabbing) select:focus, body:not(.is-tabbing) textarea:focus { outline: none; } .is-locked { overflow-y: hidden; } .visually-hidden { clip: rect(0 0 0 0); border: 0; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; position: absolute !important; } .container { padding: 0 var(--mobile-container-gutter); max-width: 1480px; margin-left: auto; margin-right: auto; } .container--medium { max-width: 1150px; } .container--narrow { max-width: 800px; } .container--extra-narrow { max-width: 630px; } .container--giga-narrow { max-width: 520px; } .anchor { visibility: hidden; display: block; position: relative; top: -75px; } @supports (--css: variables) { .anchor { top: calc(-1 * var(--header-height)); } } .js .no-js { display: none !important; } .js .js\:hidden, .no-js .no-js\:hidden { display: none; } @media screen and (max-width: 640px) { .container--flush { padding: 0; } .container--unflush { padding: 0 var(--mobile-container-gutter); } } @media screen and (min-width: 641px) { .container { padding: 0 var(--desktop-container-gutter); } } .aspect-ratio { margin-left: auto; margin-right: auto; position: relative; } .aspect-ratio img, .aspect-ratio video, .aspect-ratio svg { width: 100%; max-width: 100%; height: 100%; max-height: 100%; position: absolute; top: 0; left: 0; } .aspect-ratio--square { padding-bottom: 100% !important; } .aspect-ratio--short { padding-bottom: 75% !important; } .aspect-ratio--tall { padding-bottom: 150% !important; } .aspect-ratio--square img, .aspect-ratio--short img, .aspect-ratio--tall img { width: auto; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @supports (object-fit: contain) { .aspect-ratio--square img, .aspect-ratio--short img, .aspect-ratio--tall img { object-fit: contain; width: 100%; height: 100%; } } .placeholder-background { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .placeholder-svg { fill: var(--text-color); background-color: rgba(var(--text-color-rgb), .1); width: 100%; max-width: 100%; height: 100%; max-height: 100%; display: block; } .placeholder-svg--inverted { fill: var(--background); background-color: var(--text-color); fill-opacity: .5; } .image-background { object-fit: cover; object-position: center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .grid { flex-wrap: wrap; margin: 0 0 -18px -18px; padding: 0; font-size: 0; list-style: none; display: flex; } .grid__cell { box-sizing: border-box; vertical-align: top; width: 100%; margin: 0; padding: 0 0 18px 18px; font-size: 1rem; display: inline-block; } .grid__cell--top { align-self: flex-start; } .grid__cell--middle { align-self: center; } .grid__cell--bottom { align-self: flex-end; } @media screen and (min-width: 641px) { .grid { margin: 0 0 -30px -30px; } .grid__cell { padding: 0 0 30px 30px; } } .\31 \/1 { width: 100%; } .\31 \/2 { width: 50%; } .\31 \/3 { width: 33.3333%; } .\31 \/4 { width: 25%; } .\31 \/5 { width: 20%; } .\31 \/6 { width: 16.6667%; } @media screen and (max-width: 640px) { .hidden-phone { display: none !important; } .\31 \/1--phone { width: 100%; } .\31 \/2--phone { width: 50%; } .\31 \/3--phone { width: 33.3333%; } .\31 \/4--phone { width: 25%; } .\31 \/5--phone { width: 20%; } .\31 \/6--phone { width: 16.6667%; } } @media screen and (min-width: 641px) and (max-width: 999px) { .hidden-tablet { display: none !important; } .\31 \/1--tablet { width: 100%; } .\31 \/2--tablet { width: 50%; } .\31 \/3--tablet { width: 33.3333%; } .\31 \/4--tablet { width: 25%; } .\31 \/5--tablet { width: 20%; } .\31 \/6--tablet { width: 16.6667%; } } @media screen and (min-width: 641px) { .hidden-tablet-and-up { display: none !important; } .\31 \/1--tablet-and-up { width: 100%; } .\31 \/2--tablet-and-up { width: 50%; } .\31 \/3--tablet-and-up { width: 33.3333%; } .\31 \/4--tablet-and-up { width: 25%; } .\31 \/5--tablet-and-up { width: 20%; } .\31 \/6--tablet-and-up { width: 16.6667%; } } @media screen and (max-width: 999px) { .hidden-pocket { display: none !important; } .\31 \/1--pocket { width: 100%; } .\31 \/2--pocket { width: 50%; } .\31 \/3--pocket { width: 33.3333%; } .\31 \/4--pocket { width: 25%; } .\31 \/5--pocket { width: 20%; } .\31 \/6--pocket { width: 16.6667%; } } @media screen and (min-width: 1000px) and (max-width: 1279px) { .hidden-lap { display: none !important; } .\31 \/1--lap { width: 100%; } .\39 \/12--lap { width: 75%; } .\32 \/3--lap { width: 66.6667%; } .\31 \/2--lap { width: 50%; } .\31 \/3--lap { width: 33.3333%; } .\31 \/4--lap { width: 25%; } .\31 \/5--lap { width: 20%; } .\31 \/6--lap { width: 16.6667%; } } @media screen and (min-width: 1000px) { .hidden-lap-and-up { display: none !important; } .\31 \/1--lap-and-up { width: 100%; } .\39 \/12--lap-and-up { width: 75%; } .\32 \/3--lap-and-up { width: 66.6667%; } .\31 \/2--lap-and-up { width: 50%; } .\31 \/3--lap-and-up { width: 33.3333%; } .\31 \/4--lap-and-up { width: 25%; } .\31 \/5--lap-and-up { width: 20%; } .\31 \/6--lap-and-up { width: 16.6667%; } } @media screen and (min-width: 1280px) { .hidden-desk { display: none !important; } .\31 \/1--desk { width: 100%; } .\39 \/12--desk { width: 75%; } .\32 \/3--desk { width: 66.6667%; } .\31 \/2--desk { width: 50%; } .\31 \/3--desk { width: 33.3333%; } .\31 \/4--desk { width: 25%; } .\31 \/5--desk { width: 20%; } .\31 \/6--desk { width: 16.6667%; } } @media screen and (min-width: 1440px) { .hidden-wide { display: none !important; } .\31 \/1--wide { width: 100%; } .\39 \/12--wide { width: 75%; } .\32 \/3--wide { width: 66.6667%; } .\31 \/2--wide { width: 50%; } .\31 \/3--wide { width: 33.3333%; } .\31 \/4--wide { width: 25%; } .\31 \/5--wide { width: 20%; } .\31 \/6--wide { width: 16.6667%; } } .block-list { flex-flow: column; margin: 0 -7px -20px; display: flex; } .block-list--no-flush.block-list--no-flush { margin-bottom: 0; } .block-list__item { display: flex; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .block-list__item { display: block; } } .block-list__item > :first-child { flex: 1 0; margin: 0 7px 20px; } @media screen and (max-width: 999px) { .scroller .block-list { white-space: nowrap; flex-flow: row; } .scroller .block-list:before { content: ""; flex: 0 0 var(--mobile-container-gutter); } .scroller .block-list:after { content: ""; flex: 0 0 calc(var(--mobile-container-gutter) - 7px); } .scroller .block-list__item { white-space: normal; scroll-snap-align: center; flex: none; } } @media screen and (max-width: 640px) { .scroller .block-list__item { width: 81%; } } @media screen and (min-width: 641px) and (max-width: 999px) { .scroller .block-list__item { width: 56%; } .scroller .block-list:before { flex: 0 0 var(--desktop-container-gutter); } .scroller .block-list:after { flex: 0 0 calc(var(--desktop-container-gutter) - 15px); } } @media screen and (min-width: 641px) { .block-list { flex-flow: wrap; margin: 0 -15px -30px; } .block-list__item > :first-child { margin: 0 15px 30px; } } @media screen and (min-width: 1000px) { .block-list { white-space: normal; } .block-list:before, .block-list:after { display: none; } .block-list__item--grow { flex-grow: 1; } } .block-list--loose { margin-bottom: -45px; } .block-list--loose .block-list__item > :first-child { margin-bottom: 45px; } @media screen and (min-width: 641px) { .block-list--loose { margin-bottom: -60px; } .block-list--loose .block-list__item > :first-child { margin-bottom: 60px; } } .article-item__image-container { border-radius: 3px; margin-bottom: 15px; display: block; overflow: hidden; } .article-item__image-container--placeholder { height: 200px; } .article-item__image { object-fit: cover; object-position: center; font-family: "object-fit: cover; object-position: center"; transition: opacity .2s ease-in-out, transform .95s cubic-bezier(.25, .46, .45, .94); transform: scale(1.01); } @media screen and (any-hover: hover) { .features--animate-zoom .article-item:hover .article-item__image { transform: scale(1.07); } .article-item:hover .article-item__title { color: var(--accent-color); } } .article-item__meta { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); } .article-item__meta-item:not(:last-child):after { content: ""; background: rgba(var(--text-color-rgb), .4); vertical-align: middle; border-radius: 100%; width: 5px; height: 5px; margin: -1px 10px 0; display: inline-block; } .article-item__title { margin-bottom: 4px; } .article-item__excerpt { margin-top: 12px; } @media screen and (max-width: 999px) { .article-item:not(:last-child) { padding-bottom: 20px; } .scroller .article-item:not(:last-child) { padding-bottom: 0; } } @media screen and (min-width: 641px) { .article-item__meta { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); } } @media screen and (min-width: 1000px) { .blog-container--without-sidebar .article-item--featured .aspect-ratio { padding-bottom: 40% !important; } } @media screen and (min-width: 1280px) { .article-item__meta-item + .article-item__meta-item:before { margin: 0 14px; } } .article__image-wrapper { width: calc(100% + (var(--mobile-container-gutter) * 2)); left: calc(-1 * var(--mobile-container-gutter)); z-index: 1; margin-top: 4px; position: relative; } .article__toolbar, .article__toolbar-item { align-items: center; display: flex; } .article__toolbar { justify-content: space-between; } .article__toolbar-item .icon--bi-comment { width: 24px; height: 23px; margin-right: 15px; } .article__share-label { margin-right: 20px; } .article__comments-count { color: var(--heading-color); } .article__inner { max-width: 680px; margin: 40px auto 60px; } .article__content { margin-bottom: 2.8em; } .article__aside { margin-bottom: 50px; } .article__aside-item { flex-wrap: wrap; align-items: center; display: flex; } .article__aside-item + .article__aside-item { margin-top: 20px; } .article__navigation { border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); justify-content: space-between; align-items: center; padding: 40px 0; display: flex; } .article__navigation svg { vertical-align: -1px; width: 8px; height: 12px; } .article__navigation--align-right { justify-content: flex-end; } .article__navigation-item--prev svg { margin-right: 12px; } .article__navigation-item--next svg { margin-left: 12px; } .article__comment-list { margin-top: 50px; } .article__comment-list-heading { margin-bottom: 30px; } .article-comment { align-items: flex-start; margin-bottom: 32px; display: flex; } .article-comment:first-child { margin-top: 30px; } .article-comment:last-child { margin-bottom: 0; } .article-comment__gravatar { border-radius: 100%; max-width: 50px; margin: 5px 22px 0 0; } .article-comment__author { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin-bottom: 0; } .article-comment__date { font-style: italic; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin-bottom: 12px; display: block; } .article__comment-form { margin-top: 50px; } .article__comment-list + .article__comment-form { margin-top: 70px; } .article__comment-form-title { margin-bottom: 12px; } .article__moderated-note { font-style: italic; } .article__comment-form-wrapper { margin-top: 32px; } @media screen and (min-width: 641px) { .article__image-wrapper { border-radius: 3px 3px 0 0; width: 100%; margin: 0 0 -1px; position: relative; left: 0; overflow: hidden; } .article__image-wrapper + .card { border-top-left-radius: 0; border-top-right-radius: 0; } .article__inner { margin-top: 60px; } .article__content { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); } .article-comment { margin-bottom: 42px; } .article-comment__author { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); margin-bottom: 2px; } .article-comment__date { margin-bottom: 12px; } } .blog-post { max-width: 980px; } .blog-post-list-wrapper { flex-grow: 1; } .blog-sidebar__item { margin-bottom: 45px; } .blog-sidebar__item--products, .blog-sidebar__item--newsletter { margin-bottom: 50px; } .blog-sidebar__item:first-child:not(.blog-sidebar__item--newsletter) { margin-top: -.435em; } .blog-sidebar__block-title { margin-bottom: 20px; } @media screen and (min-width: 1000px) { .blog-container { justify-content: center; align-items: flex-start; display: flex; } .blog-post { flex-grow: 1; } .blog-sidebar { flex: none; width: 300px; margin-left: 60px; } } @media screen and (min-width: 641px) and (max-width: 999px) { .blog-sidebar { width: 350px; margin-left: auto; margin-right: auto; } } @media screen and (min-width: 1280px) { .blog-sidebar { width: 350px; margin-left: 70px; } } .blog-sidebar__item--newsletter { text-align: center; border-radius: 3px; padding: 30px 20px; } .blog-sidebar__item--newsletter .heading { color: inherit; } @media screen and (max-width: 640px) { .blog-sidebar__item--newsletter { margin-left: calc(-1 * var(--mobile-container-gutter)); margin-right: calc(-1 * var(--mobile-container-gutter)); border-radius: 0; } } .blog-sidebar__post-list { list-style: none; } .blog-sidebar__post-item { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); align-items: flex-start; display: flex; } .features--animate-zoom .blog-sidebar__post-item:hover .blog-sidebar__post-image { transform: scale(1.1); } .blog-sidebar__post-item:hover .blog-sidebar__post-title { color: var(--accent-color); } .blog-sidebar__post-item + .blog-sidebar__post-item { margin-top: 30px; } .blog-sidebar__post-image-wrapper { flex-shrink: 0; width: 100px; margin-right: 20px; display: block; position: relative; } .blog-sidebar__post-image, .blog-sidebar__post-placeholder { min-height: 80px; transition: transform .65s cubic-bezier(.25, .46, .45, .94); } .blog-sidebar__post-image-overflow { border-radius: 3px; overflow: hidden; } .blog-sidebar__post-title { text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-top: 2px; line-height: 1.55; display: -webkit-box; position: relative; overflow: hidden; } .blog-sidebar__post-meta { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: 4px; } .blog-sidebar__post-meta-item:not(:last-child):after { content: ""; background: rgba(var(--text-color-rgb), .4); vertical-align: middle; border-radius: 100%; width: 5px; height: 5px; margin: 0 10px; display: inline-block; } .blog-sidebar__post-list--ranked { counter-reset: post-ranking 0; } .blog-sidebar__post-list--ranked .blog-sidebar__post-image-wrapper:before { content: counter(post-ranking); border: 2px solid var(--background); text-align: center; background: var(--accent-color); color: var(--secondary-background); line-height: 28px; font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); counter-increment: post-ranking; z-index: 1; border-radius: 100%; width: 32px; height: 32px; position: absolute; top: calc(50% - 16px); left: -16px; } .blog-sidebar__item--products .product-item { width: 100%; } .blog-sidebar__item--products .product-item__image-wrapper { width: 75px !important; } .blog-sidebar__item--products .product-item__price-list > .price { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); } @media screen and (max-width: 640px) { .blog-sidebar__item--products .product-list--horizontal { border: 1px solid var(--border-color); border-radius: 3px; } } .blog-sidebar__linklist { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); list-style: none; } .blog-sidebar__link-item { border-bottom: 1px solid var(--form-border-color); padding: 14px 0; line-height: 1.5; } .blog-sidebar__link-item:first-child { padding-top: 5px; } .blog-sidebar__link-item:last-child { border-bottom: none; padding-bottom: 0; } .blog-sidebar__link-item > a { display: block; } .button { text-align: center; line-height: 48px; font-weight: var(--text-font-bolder-weight); font-size: var(--base-text-font-size); cursor: pointer; border-radius: 2px; padding: 0 30px; transition: background .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out; display: inline-block; position: relative; } .button[disabled] { cursor: not-allowed; } .button--extra-small { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); padding: 0 15px; line-height: 34px; } .button--small { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); line-height: 42px; } .button--large { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); line-height: 55px; } .button--extra-large { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); line-height: 60px; } .button--primary { background: var(--primary-button-background); color: var(--primary-button-text-color); } .button--primary:hover { background: rgba(var(--primary-button-background-rgb), .8); } .button--secondary { background: var(--secondary-button-background); color: var(--secondary-button-text-color); } .button--secondary:hover { background: rgba(var(--secondary-button-background-rgb), .8); } .button--ternary { color: var(--accent-color); box-shadow: 0 0 0 1px var(--border-color) inset; } .button--ternary:hover { background: rgba(var(--border-color-rgb), .5); color: var(--text-color); } .button--transparent { color: var(--text-color); box-shadow: 0 0 0 1px var(--border-color) inset; } .button--transparent:hover { background: var(--primary-button-background); color: var(--primary-button-text-color); box-shadow: 0 0 0 1px var(--primary-button-background) inset; } .button--disabled { background: var(--product-sold-out-color); box-shadow: 0 0 0 1px var(--product-sold-out-color) inset; color: var(--secondary-background); } .button--full { width: 100%; } .button--min-width { min-width: 200px; } .button--floating { transition: box-shadow .2s ease-in-out; } .button--floating:hover { box-shadow: 0 2px 2px 2px #0000000f; } .button-wrapper { text-align: center; } .button-stack { flex-direction: column; display: flex; } .button-stack > .button + .button { margin-top: 10px; } .button-group { flex-flow: wrap; margin: -5px; display: flex; } .button-group > * { margin: 5px; } .button-group--fit > * { flex: 1 0 0; padding-left: 15px; padding-right: 15px; } .button-group--loose { margin: -10px; } .button-group--loose > * { margin: 10px; } .card { background: var(--secondary-background); border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); margin-bottom: 18px; position: relative; } .card__header { padding: 20px 20px 0; position: relative; } .card__header--flex { justify-content: space-between; align-items: center; display: flex; } .card__title { margin-bottom: 0; } .card__subtitle { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); margin-bottom: 14px; } .card__subtitle:first-child { margin-top: -.435em; } .card__title--small { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 20px)); margin-top: -2px; margin-bottom: 10px; } .card__section, .card__collapsible-button { padding: 20px; position: relative; } .card__collapsible-button { text-align: left; cursor: pointer; justify-content: space-between; align-items: center; width: 100%; display: flex; } .card__collapsible-button .plus-button { color: var(--heading-color); margin-left: 10px; } .card__section + .card__section:before { content: ""; width: calc(100% - var(--mobile-container-gutter)); background: var(--border-color); height: 1px; display: block; position: absolute; top: 0; right: 0; } .card__section--no-padding { padding: 0 !important; } .card__collapsible { height: 0; transition: all .3s ease-in-out; overflow: hidden; } .card__collapsible-content { padding: 0 20px 20px; } .card__separator { width: calc(100% + var(--mobile-container-gutter)); border: none; border-top: 1px solid var(--border-color); margin: 20px 0; } .card__navigation { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); justify-content: space-between; margin-top: -3px; margin-bottom: 12px; display: flex; } .card__navigation-breadcrumb svg { vertical-align: -1px; width: 8px; height: 12px; margin-right: 12px; } .card__linklist { list-style: none; } .card__linklist-item { text-align: left; padding: 2px 0; display: block; } @media screen and (max-width: 640px) { .card { border-radius: 0; } .card__section--flex .button { width: 100%; margin-top: 20px; } } @media screen and (max-width: 999px) { .card--collapsed { box-shadow: 0 -1px var(--secondary-background); border-top: none !important; margin-top: -18px !important; } .card--collapsed .card__header, .card--collapsed .card__section { padding-top: 0; } } @media screen and (min-width: 641px) and (max-width: 999px) { .card--collapsed { border-radius: 0 0 3px 3px; margin-top: -30px !important; } } @media screen and (min-width: 641px) { .card { border: 1px solid var(--border-color); border-radius: 3px; margin-bottom: 30px; } .card__header { padding: 30px 30px 0; } .card__section, .card__collapsible-button { padding: 30px; } .card__section + .card__section:before { width: 100%; } .card__section--flex { justify-content: space-between; align-items: center; display: flex; } .card__subtitle { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); } .card__collapsible-content { padding: 0 30px 30px; } .card__separator { width: 100%; margin: 24px 0; } .card__header--tight { padding-top: 20px; } .card__section--tight { padding: 20px 25px; } .card__section--tight .card__separator { margin: 20px 0; } .card__navigation { margin-bottom: 15px; } } @media screen and (min-width: 1000px) { .card--sticky { margin-bottom: 0; position: sticky; top: 0; } @supports (--css: variables) { .card--sticky { top: calc((var(--header-height) + 30px) * var(--header-is-sticky, 0)); } } } .card__section .rte .button:last-child { margin-bottom: 15px; } .mini-cart { background: var(--secondary-background); color: var(--text-color); z-index: 1; visibility: hidden; opacity: 0; will-change: transform; width: 100vw; height: 100vh; max-height: 0; transition: opacity .25s ease-in-out, transform .25s ease-in-out, visibility .25s ease-in-out, max-height 0s linear .25s; position: absolute; top: 100%; left: 0; transform: scale(.9); } .mini-cart[aria-hidden="false"] { visibility: visible; opacity: 1; transition: opacity .4s cubic-bezier(0, 1, .4, 1), transform .4s cubic-bezier(.18, 1.25, .4, 1), visibility .4s linear; transform: scale(1); } .mini-cart .icon--nav-triangle-borderless { z-index: 2; filter: drop-shadow(0 -2px 2px #0000001f); width: 18px; height: 8px; position: absolute; bottom: 100%; right: 6px; } .mini-cart__alert-wrapper { padding-top: 20px; } .mini-cart .alert { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); flex-shrink: 0; margin-bottom: 0; } .mini-cart__content:not(.mini-cart__content--empty) > * { padding-left: 20px; padding-right: 20px; } .mini-cart__content--empty { padding: 20px 25px 25px; } .mini-cart__empty-state { text-align: center; padding: 70px 0 60px; } .mini-cart__empty-state svg { margin-bottom: 10px; } .mini-cart__line-item-list { -webkit-overflow-scrolling: touch; overscroll-behavior: none; overflow: auto; } .mini-cart__line-item { align-items: flex-start; padding: 20px 0; display: flex; } .mini-cart__line-item + .mini-cart__line-item { border-top: 1px solid var(--border-color); } .mini-cart__image-wrapper { width: 80px; min-width: 80px; margin-right: 20px; } .mini-cart__product-info { margin-bottom: 12px; } .mini-cart__product-vendor, .mini-cart__property-list, .mini-cart__plan-allocation { line-height: 1.55; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); margin-bottom: 7px; display: block; } .mini-cart__product-vendor { text-transform: uppercase; } .mini-cart__product-title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin-bottom: 4px; line-height: 1.5; display: block; } .mini-cart__property-list { margin: 6px 0; line-height: 1.5; list-style: none; } .mini-cart__price-list > .price { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); font-weight: var(--text-font-bolder-weight); } .mini-cart__price-info { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: -2px; } .mini-cart__discount-list { margin-top: 2px; list-style: none; } .mini-cart__discount { font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); background: rgba(var(--product-on-sale-accent-rgb), .08); color: var(--product-on-sale-accent); border-radius: 2px; padding: 0 11px; display: inline-block; } .mini-cart__discount svg { vertical-align: text-bottom; margin-right: 6px; } .mini-cart__discount + .mini-cart__discount { margin-top: 5px; } .mini-cart__quantity-remove { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-left: 10px; line-height: 1; display: inline-block; } .mini-cart__recap { border-top: 1px solid var(--border-color); padding: 15px 20px 20px; } .mini-cart__recap-price-line { color: var(--heading-color); font-weight: var(--text-font-bolder-weight); justify-content: space-between; align-items: center; display: flex; } .mini-cart__recap-price-line--highlight { color: var(--product-on-sale-accent); } .mini-cart__recap-price-line + .mini-cart__recap-price-line { margin-top: 4px; } .mini-cart__amount-saved { color: var(--product-on-sale-accent); font-weight: var(--text-font-bolder-weight); } .mini-cart__button-container { margin-top: 16px; } @media screen and (max-width: 640px) { .mini-cart .icon--nav-triangle-borderless { right: 24px; } .mini-cart__content { flex-direction: column; display: flex; } .mini-cart__inner, .mini-cart__content--empty { flex-direction: column; justify-content: space-between; height: 100%; display: flex; } @supports (padding: max(0px)) { .mini-cart__recap, .mini-cart__content--empty { padding-bottom: max(25px, env(safe-area-inset-bottom, 0px) + 25px); } } } @media screen and (min-width: 641px) { .mini-cart { border-radius: 3px; width: 470px; height: auto; max-height: none; top: calc(100% + 14px); left: auto; right: 0; box-shadow: 0 1px 5px 2px #0000001a; } .mini-cart__content > * { padding-left: 25px; padding-right: 25px; } .mini-cart__content--empty { padding-bottom: 25px; } .mini-cart__line-item-list { max-height: 300px; } .mini-cart__item-wrapper { flex-grow: 1; justify-content: space-between; align-items: flex-start; display: flex; } .mini-cart__quantity-remove { width: max-content; margin: 10px auto 0; display: block; } .mini-cart__product-info { margin: 0 20px 0 0; } .mini-cart__recap { padding: 15px 25px 25px; } } @media screen and (min-height: 700px) and (min-width: 641px) { .mini-cart__line-item-list { max-height: 330px; } } @media screen and (min-width: 1280px) { .mini-cart .icon--nav-triangle-borderless { right: 58px; } } .cart-recap__secure-payment-list { max-width: 300px; margin: -4px auto !important; } @media screen and (max-width: 999px) { .cart-wrapper { min-height: 0 !important; } } @media screen and (min-width: 1000px) { .cart-wrapper { max-width: 1480px; margin-left: auto; margin-right: auto; } .cart-wrapper__inner { position: relative; } .cart-wrapper__inner-inner { width: calc(100% - 380px); } .cart-recap { right: var(--desktop-container-gutter); width: 350px; height: 100%; position: absolute; top: 0; } .cart-recap__scroller { position: sticky; top: 0; } @supports (--css: variables) { .cart-recap__scroller { top: calc(var(--header-height) + 30px); } } } @media screen and (min-width: 1280px) { .cart-wrapper__inner-inner { width: calc(100% - 430px); } .cart-recap { width: 400px; } } .gift-wrap { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); padding: 20px 10px 20px 20px; } .gift-wrap__left { align-items: center; margin-bottom: 18px; display: flex; } .gift-wrap__icon svg { width: 24px; height: 24px; margin-top: -4px; margin-right: 25px; display: block; } .gift-wrap__text > span:first-child { margin-right: 10px; } @media screen and (min-width: 641px) { .gift-wrap { justify-content: space-between; align-items: center; padding: 10px 10px 10px 30px; display: flex; } .gift-wrap__left { margin-bottom: 0; } } .estimate-shipping { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } .estimate-shipping__toggle { color: var(--heading-color); font-weight: var(--text-font-bolder-weight); align-items: center; width: 100%; padding: 20px; display: flex; } .estimate-shipping__icon svg { width: 24px; height: 24px; margin-right: 25px; display: block; } .estimate-shipping__arrow { margin-left: auto; } .estimate-shipping__arrow svg { width: 12px; height: 8px; transition: transform .2s ease-in-out; } .estimate-shipping__toggle[aria-expanded="true"] .estimate-shipping__arrow svg { transform: rotateZ(180deg); } .estimate-shipping__collapsible .shipping-estimator { padding: 0 20px 20px; } @media screen and (min-width: 641px) { .estimate-shipping__toggle { padding: 20px 30px; } .estimate-shipping__collapsible .shipping-estimator { padding-left: 30px; padding-right: 30px; } } .cart-recap__price-line { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); font-weight: var(--text-font-bolder-weight); color: var(--heading-color); justify-content: space-between; margin-bottom: 4px; display: flex; } .cart-recap__price-line + .cart-recap__price-line { margin-top: 4px; } .cart-recap__price-line--highlight { color: var(--product-on-sale-accent); } .cart-recap__amount-saved { color: var(--product-on-sale-accent); font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); } .cart-recap__note { border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); margin-top: 14px; } .cart-recap__note-inner { padding-bottom: 20px; } .cart-recap__note-button { justify-content: space-between; align-items: center; width: 100%; padding: 10px 0; display: flex; } .cart-recap__note-button svg { width: 12px; height: 8px; transition: transform .2s ease-in-out; } .cart-recap__note-button[aria-expanded="true"] svg { transform: rotateZ(180deg); } .cart-recap__note-edit { color: var(--accent-color); opacity: 0; margin-right: 14px; transition: opacity .2s ease-in-out; } .cart-recap__note-edit.is-visible { opacity: 1; } .cart-recap__notices { margin: 24px 0; } .cart-recap__secure-payment-title { text-align: center; font-weight: var(--text-font-bolder-weight); margin-bottom: 10px; } .cart-recap__secure-payment-title svg { vertical-align: text-top; margin-right: 8px; } @media screen and (min-width: 641px) { .cart-recap__price-line { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); } .cart-recap__amount-saved { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); } .cart-recap__note { margin-top: 20px; } } .collection__image-wrapper { z-index: 1; height: 180px; margin-bottom: -1px; position: relative; overflow: hidden; } .collection__image-wrapper--small { height: 140px; } .collection__image-wrapper--large { height: 230px; } .collection__image-wrapper--preserve-ratio { height: auto !important; } .collection__image-wrapper + .card { border-top-left-radius: 0; border-top-right-radius: 0; } .collection__image { background-position: center; background-size: cover; height: 100%; } .collection__title { margin-bottom: 5px; } .collection__meta { margin-bottom: 12px; } .collection__description { margin-top: 20px; } .collection__brand-logo-wrapper { border: 1px solid var(--border-color); border-radius: 3px; width: 70px; height: 70px; margin-right: 20px; padding: 10px; } .collection__brand-logo-image { place-content: center; width: 100%; height: 100%; display: grid; } .collection__products-count { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-bottom: 18px; } .collection__toolbar { padding: 0 var(--mobile-container-gutter); box-shadow: 0 1px var(--border-color), 0 -1px var(--border-color); background: #cadffb; z-index: 3; justify-content: space-between; align-items: center; margin-top: 22px; display: flex; position: relative; } .collection__toolbar-item { align-items: center; height: 48px; display: flex; } .collection__toolbar-item--filter svg { width: 19px; height: 20px; margin-right: 12px; } .collection__layout-label { margin-right: 20px; } .collection__layout-button { opacity: .7; transition: all .2s ease-in-out; } .collection__layout-button:last-child { margin-left: 15px; } .collection__layout-button:hover { opacity: 1; } .collection__layout-button.is-selected { opacity: 1; color: var(--heading-color); } .collection__layout-button svg { width: 18px; height: 18px; display: block; } .collection__header .expandable-content--expandable { margin-bottom: -22px; } .collection__header--brand .collection__meta { align-items: center; display: flex; } .collection__header--brand .collection__description { margin-top: 0; } @media screen and (max-width: 999px) { .collection__toolbar { top: calc(var(--header-height) * var(--header-is-sticky, 0)); position: sticky; } } @media screen and (min-width: 641px) { .collection__image-wrapper { border-radius: 3px 3px 0 0; height: 230px; } .collection__image-wrapper--small { height: 200px; } .collection__image-wrapper--large { height: 310px; } .collection__brand-logo-wrapper { width: 90px; height: 90px; margin-right: 30px; } .collection__products-count { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } .collection__toolbar { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); padding: 0 30px; } .collection__toolbar--bordered { box-shadow: 0 1px var(--border-color), 0 -1px var(--border-color); margin-top: 30px; } .card__header--tight + .collection__toolbar--bordered { margin-top: 25px; } .collection__toolbar-item { height: 58px; } .collection__toolbar-item .value-picker-button { margin-left: 4px; } } @media screen and (max-width: 640px) { .collection__toolbar-item--count + .collection__toolbar-item--layout { margin-left: auto; } } @media screen and (min-width: 1000px) { .collection__toolbar:not(.collection__toolbar--bordered) { box-shadow: 0 1px var(--border-color); margin-top: -12px; } .collection__brand-logo-wrapper { flex: none; width: 110px; height: 110px; } .collection__header--brand { align-items: flex-start; display: flex; } .collection__header--brand .collection__meta { display: block; } } @media screen and (min-width: 1280px) { .collection__title { margin-bottom: 12px; } .collection__description { margin-top: 10px; } .collection__showing-count, .collection__toolbar-item--sort { margin-right: 45px; } .collection__toolbar-item--sort { margin-left: auto; } .collection__header--brand .collection__meta { margin-bottom: 0; } } @media screen and (min-width: 1440px) { .collection__showing-count, .collection__toolbar-item--sort { margin-right: 80px; } } .collection__filter-group-list--ordered { flex-direction: column; display: flex; } .collection__filter-group { border-bottom: 1px solid var(--border-color); padding: 13px 20px 14px; } .collection__filter-group-name { text-align: left; justify-content: space-between; align-items: center; width: 100%; display: flex; } .collection__filter-group-name svg { width: 12px; height: 8px; margin-left: 10px; transition: transform .25s ease-in-out; } .collection__filter-group-name[aria-expanded="true"] svg { transform: rotateZ(180deg); } .js .collection__filter-collapsible { visibility: hidden; height: 0; transition: all .2s ease-in-out; overflow: hidden; } .collection__filter-collapsible[aria-hidden="false"] { visibility: visible; } .collection__filter-item-active { color: var(--accent-color); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); white-space: nowrap; text-overflow: ellipsis; max-width: 250px; margin-top: -5px; display: block; overflow: hidden; } .collection__filter-linklist { padding: 4px 0 8px; list-style: none; } .collection__filter-link { text-align: left; width: 100%; padding: 3px 0 4px; display: block; } .collection__filter-link svg { width: 12px; height: 8px; margin-left: 8px; transition: transform .25s ease-in-out; } .collection__filter-link[aria-expanded="true"] svg { transform: rotateZ(180deg); } .collection__filter-link.is-active { font-weight: var(--text-font-bolder-weight); color: var(--accent-color); } .collection__filter-linklist .collection__filter-linklist { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); padding: 0 0 0 10px; } .collection__filter-color-list { padding: 7px 0 5px 6px; } .collection__filter-visual-filter-list { padding: 8px 0; } .collection__filter-checkbox-list { list-style: none; } .collection__filter-collapsible .collection__filter-checkbox-list { padding: 8px 0 7px 10px; } .collection__filter-checkbox { align-items: center; padding: 2px 0 3px; display: flex; } .collection__filter-checkbox .checkbox { margin-right: 0; } .collection__filter-checkbox label { padding-left: 14px; line-height: 1.5; } .collection__filter-icon--active { position: relative; } .collection__filter-icon--active:after { content: ""; background: var(--accent-color); border-radius: 100%; width: 8px; height: 8px; position: absolute; top: 3px; left: 13px; } .collection__active-filters { margin: -5px 0 16px; } .collection__active-filters:empty { display: none; } .collection__active-filter-item { line-height: 1.5; font-weight: var(--text-font-bolder-weight); color: var(--accent-color); cursor: pointer; align-items: center; padding: 4px 0; display: flex; } .collection__active-filter-cross { background: var(--accent-color); color: var(--secondary-background); box-shadow: 0 1px rgba(var(--border-color-rgb), .4); border-radius: 3px; flex-shrink: 0; width: 20px; height: 20px; margin-right: 12px; display: inline-block; position: relative; } .collection__active-filter-cross svg { stroke-width: 2px; stroke: #fff; width: 8px; height: 8px; position: absolute; top: 6px; left: 6px; } .collection__clear-filter { margin: 13px 0 9px; } .collection__filter-group label + .switch-checkbox { margin-left: auto; } @media screen and (min-width: 1000px) { .collection__filter-group { border-bottom: 0; padding: 6px 0; } .collection__filter-group-name { justify-content: flex-start; } .collection__filter-linklist { padding: 0 0 9px; } .collection__filter-linklist .collection__filter-linklist { padding-left: 15px; } .collection__filter-link { padding: 2px 0; } .collection__filter-color-list { padding: 12px 0 10px; } .collection__filter-collapsible .collection__filter-checkbox-list { padding-bottom: 12px; } .collection__filter-group:last-child .collection__filter-checkbox-list { padding-bottom: 0; } .collection__filter-checkbox { padding: 0; } .collection__filter-checkbox .checkbox-wrapper { margin: 8px 0; } } @media screen and (min-width: 1280px) { .collection__sidebar { flex-basis: 290px; } } .collection__mobile-filters-recap { background: var(--background); border-bottom: 1px solid var(--border-color); } .collection__mobile-active-filters { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); margin: -5px; } .collection__mobile-active-filter-item { background: var(--accent-color); box-shadow: 0 1px rgba(var(--accent-color-rgb), .15); color: var(--secondary-background); font-weight: var(--text-font-bolder-weight); border-radius: 3px; padding: 4px 12px; } .collection__mobile-active-filter-item, .collection__mobile-active-clear { margin: 5px; } .collection__mobile-active-filter-cross { margin-right: 7px; } .collection__mobile-active-filter-cross svg { stroke: currentColor; stroke-width: 3px; width: 7px; height: 7px; } .collection__mobile-active-clear { margin-left: 15px; position: relative; } .collection__mobile-active-clear:after { content: ""; background: currentColor; width: 100%; height: 1px; position: absolute; bottom: 3px; left: 0; } .collection__mobile-active-filters-results { margin-top: 25px; margin-bottom: -5px; display: block; } .collection-drawer { flex-direction: column; height: 100%; display: flex; } .collection-drawer__header { border-bottom: 1px solid var(--border-color); z-index: 1; flex: 1 0 auto; justify-content: space-between; align-items: center; max-height: 64px; padding: 15px 15px 15px 25px; display: flex; } .collection-drawer__header > div { align-items: center; display: flex; } .collection-drawer__close { color: var(--heading-color); margin-right: 16px; } .collection-drawer__close svg { width: 19px; height: 19px; margin-top: -1px; display: block; } .collection-drawer__title { margin-bottom: 0; } .collection-drawer__inner { -webkit-overflow-scrolling: touch; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); flex: auto; overflow: auto; } .collection-drawer__section-title { text-transform: uppercase; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); font-weight: var(--text-font-bolder-weight); background: var(--background); border-bottom: 1px solid var(--border-color); margin: 0; padding: 4px 15px; } .collection-drawer__footer { box-shadow: 0 -2px 2px rgba(var(--border-color-rgb), .65); padding: 15px; } .collection-drawer__footer .button { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } @supports (padding: max(0px)) { .collection-drawer__footer { padding-bottom: max(15px, env(safe-area-inset-bottom, 0px) + 15px); } } .product-list { border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); z-index: 1; flex-wrap: wrap; width: 100%; display: flex; position: relative; overflow: hidden; } .product-list .flickity-viewport { border-radius: 3px; } .product-list--scrollable { flex-wrap: nowrap; } .product-list--collection:before { display: none; } .product-item--vertical, .product-item--vertical .product-item__info { flex-direction: column; display: flex; } .product-item--vertical .product-item__info { flex: 1 0 auto; justify-content: space-between; } .product-list__column { width: 100%; } @media screen and (max-width: 640px) { .product-list--scrollable:before, .product-list--scrollable:after { content: ""; flex: 0 0 var(--mobile-container-gutter); } .product-list--scrollable .product-item { width: 62%; } .product-list--collage { border-width: 1px 0; } .product-list--collection .product-item--vertical { width: 50%; } } @media screen and (min-width: 641px) and (max-width: 999px) { .product-list--scrollable:before, .product-list--scrollable:after { content: ""; flex: 0 0 var(--desktop-container-gutter); } .product-list--scrollable .product-item { width: 36%; } } @media screen and (min-width: 641px) { .product-list { background: var(--secondary-background); border: none; border-radius: 3px; } .product-list--collage:before { content: ""; border: 1px solid var(--border-color); z-index: 1; pointer-events: none; border-radius: 3px; width: 100%; height: 100%; position: absolute; } .product-list__column { flex-flow: column; flex: 0 0 33.3333%; display: flex; } .product-list__column > .product-item { flex: 1 0 auto; } .product-list__column--highlight .product-item__title { font-size: 1rem; } @supports (display: grid) { .product-list--collage { grid-template-columns: repeat(auto-fit, minmax(295px, 1fr)); display: grid; } .product-list__column { grid-auto-rows: 1fr; display: grid; } .product-list__column--shrink { grid-template-rows: minmax(50%, min-content); } } } @media screen and (max-width: 999px) { .product-list--scrollable { background: none; border: none; overflow: visible; } .product-list--scrollable .product-item { border: 1px solid var(--border-color); } .product-list--scrollable .product-item + .product-item { border-left: none; } .product-list--scrollable .product-item:first-child { border-radius: 3px 0 0 3px; } .product-list--scrollable .product-item:last-child { border-radius: 0 3px 3px 0; } .product-list--collection { border: none; } } @media screen and (min-width: 1000px) { .product-list:before { content: ""; border: 1px solid var(--border-color); z-index: 1; pointer-events: none; border-radius: 3px; width: 100%; height: 100%; position: absolute; } .product-list--scrollable:after { content: "flickity"; display: none; } .product-list--scrollable .product-item { min-height: 100%; } .product-list--stackable { flex-wrap: wrap; } .product-list__column { flex-basis: 25%; } } @media screen and (min-width: 1440px) { @supports (display: grid) { .product-list--collage { grid-template-columns: repeat(2, 1fr 1.05fr); } } } .featured-collection { background-position: left -15px bottom 0; background-repeat: no-repeat; background-size: 500px; padding-top: 25px; } .featured-collection__header { padding: 0 var(--mobile-container-gutter) 40px var(--mobile-container-gutter); } .featured-collection__title { color: inherit; margin-bottom: 8px; } .featured-collection__cta { margin-top: 8px; } .featured-collection__image-wrapper { margin-top: 25px; } .featured-collection .product-list { border-radius: 2px; margin-bottom: 20px; } .featured-collection .product-item { border: none; border-right: 1px solid var(--border-color); } .featured-collection .product-item:after { display: none; } .featured-collection .product-item:last-child { border-right: 0; } @media screen and (max-width: 640px) { .featured-collection, .featured-collection__header { background-image: none !important; } } @media screen and (min-width: 641px) and (max-width: 999px) { .featured-collection { margin: 0 calc(-1 * var(--desktop-container-gutter)); background-image: none !important; } .featured-collection__header { padding-left: var(--desktop-container-gutter); padding-right: var(--desktop-container-gutter); background-position: right -15px bottom 0; background-repeat: no-repeat; background-size: 430px; } .featured-collection__image-wrapper { max-width: 400px; margin-left: auto; margin-right: auto; } .featured-collection .product-list { margin-bottom: var(--desktop-container-gutter); } } @media screen and (min-width: 1000px) { .featured-collection { table-layout: fixed; border-radius: 3px; width: 100%; padding: 6px 6px 6px 0; display: table; } .featured-collection__header, .featured-collection__content { vertical-align: top; display: table-cell; } .featured-collection__header { width: 455px; padding: 20px 30px; background-image: none !important; } .featured-collection .product-list { margin-bottom: 0; } .featured-collection .product-list:before { display: none; } .featured-collection .flickity-viewport:after { content: ""; background: var(--secondary-background); width: 1px; height: 100%; position: absolute; right: 0; } } .collection-item { vertical-align: top; white-space: normal; width: 36vw; margin: 0 14px; display: inline-block; } .collection-item:first-child { margin-left: var(--mobile-container-gutter); } .collection-item:last-child { margin-right: var(--mobile-container-gutter); } .collection-item__image-wrapper { margin-bottom: 15px; overflow: hidden; } .collection-item__image-wrapper--rounded { z-index: 0; border-radius: 100%; position: relative; overflow: hidden; } .collection-item__image-wrapper img { object-fit: cover; object-position: center; font-family: "object-fit: cover; object-position: center;"; transition: opacity .2s ease-in-out, transform .95s cubic-bezier(.25, .46, .45, .94); transform: scale(1.01); } .collection-item__title { text-align: center; line-height: 1.4; transition: color .2s ease-in-out; display: block; } .collection-item__title svg { display: none; } @media screen and (min-width: 641px) and (max-width: 999px) { .collection-item { width: 190px; } .collection-item:first-child { margin-left: var(--desktop-container-gutter); } .collection-item:last-child { margin-right: var(--desktop-container-gutter); } } @media screen and (min-width: 641px) { .collection-item__title { transition: transform .35s cubic-bezier(.645, .045, .355, 1); transform: translateX(14px); } .collection-item__title svg { vertical-align: -2px; opacity: 0; width: 14px; height: 14px; margin-left: 8px; transition: all .35s cubic-bezier(.645, .045, .355, 1); display: inline-block; position: relative; right: -5px; } } @media screen and (min-width: 1000px) { .collection-list { white-space: nowrap; margin: 30px -14px 0; overflow: hidden; } .collection-list:after { content: "flickity"; display: none; } .collection-item { width: 20%; padding: 0 14px; margin: 0 !important; } .collection-list .flickity-prev-next-button { top: calc(50% - 37px - .5em); } .collection-list .flickity-prev-next-button.previous { left: -10px; } .collection-list .flickity-prev-next-button.next { right: -10px; } } @media screen and (min-width: 1280px) { .collection-item { width: 16.6667%; } } @media screen and (any-hover: hover) { .collection-item:hover .collection-item__title { color: var(--accent-color); } .features--animate-zoom .collection-item:hover img { transform: scale(1.07); } .collection-item:hover .collection-item__title { transform: translateX(0); } .collection-item:hover .collection-item__title svg { opacity: 1; right: 0; } } .collection-list__section { margin-bottom: 40px; } @media screen and (min-width: 641px) { .collection-list__section { margin-bottom: 60px; } } .collection-block-item { border-radius: 3px; display: block; position: relative; overflow: hidden; } .collection-block-item--overlay:before { content: ""; z-index: 1; background: #0003; width: 100%; height: 100%; position: absolute; } .collection-block-item__image { background-position: center; background-size: cover; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: transform 8s linear, opacity .3s ease-in-out !important; } .collection-block-item__title { text-align: center; color: #fff; z-index: 1; text-shadow: 1px 2px 4px #0003; width: 100%; padding: 0 20px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media screen and (any-hover: hover) { .features--animate-zoom .collection-block-item:hover .collection-block-item__image { transform: scale(1.4); } } .custom-content--centered { text-align: center; } .custom-content--right { text-align: right; } .custom-content--product .product-item:after { box-shadow: 1px 0 var(--border-color), -1px 0 var(--border-color), 0 1px var(--border-color), 0 -1px var(--border-color); } ::-webkit-date-and-time-value { text-align: start; } .form__field { border: 1px solid var(--form-border-color); color: var(--heading-color); background: var(--input-background); -webkit-appearance: none; resize: none; box-shadow: 0 1px rgba(var(--border-color-rgb), .25) inset; border-radius: 2px; width: 100%; height: 48px; padding: 12px; font-size: max(1rem, 16px); line-height: normal; transition: border-color .2s ease-in-out, box-shadow .2s ease-in-out, color .2s ease-in-out; display: block; } .form__field::placeholder { color: var(--text-color); } .form__field:focus { border-color: var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color); color: var(--heading-color); outline: none; } .form__field--small { height: 44px; } .form__field--large { height: 60px; padding: 20px 18px; } .form__field--textarea { line-height: inherit; height: auto; min-height: 48px; padding-top: 6px; padding-bottom: 6px; } .form__field--borderless { border: none; } .form__field--borderless:focus { box-shadow: none; } .form__field[aria-invalid]:not(.is-filled) { background: var(--error-background); color: var(--error-color); border-color: var(--error-color); } .form__field[aria-invalid]:not(.is-filled) + .form__floating-label { color: var(--error-color); } .form__label { color: var(--heading-color); font-weight: var(--text-font-bolder-weight); margin-bottom: 6px; display: block; } .form__label--light { color: var(--text-color); } .form__submit { margin-top: 20px; display: block; } .form__submit--tight { margin-top: 12px; } .form__spam-disclaimer { margin-top: 10px; display: block; } @media screen and (min-width: 641px) { .form__submit--centered { margin-left: auto; margin-right: auto; } } .form__input-wrapper { width: 100%; margin-bottom: 12px; position: relative; } .form__floating-label { color: var(--text-color); transform-origin: 0 0; pointer-events: none; font-size: 1rem; line-height: 48px; transition: transform .2s ease-in-out; position: absolute; top: 0; left: 13px; transform: scale(1); } .form__field:focus + .form__floating-label, .form__field.is-filled + .form__floating-label, .select-wrapper.is-filled + .form__floating-label { transform: translateY(-6px)scale(.8); } .form__input-wrapper--labelled .form__field { padding-top: 20px; padding-bottom: 3px; } .form__field--large + .form__floating-label { line-height: 60px; left: 18px; } .form__input-wrapper--labelled .form__field--large { padding-top: 20px; padding-bottom: 3px; } .form__input-row { flex-direction: column; display: flex; } .form__input-row .form__submit { margin-top: 0; } @media screen and (min-width: 641px) { .form__input-row { flex-direction: row; align-items: flex-end; margin: 0 -6px; } .form__input-row:not(:last-child) { margin-bottom: 12px; } .form__input-row > .form__input-wrapper { margin-bottom: 0; } .form__input-row > * { margin-left: 6px; margin-right: 6px; } .form__input-row > .form__submit { flex: 1 0 auto; margin-top: 0; } } .form__connected-item { align-items: center; margin-bottom: 12px; display: flex; } .form__connected-item .form__input-wrapper { margin-bottom: 0; } .form__connected-item .form__field { border-right: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } .form__connected-item .form__field:focus { box-shadow: 0 0 0 1px var(--accent-color) inset; } .form__connected-item .form__connection { border-top-left-radius: 0; border-bottom-left-radius: 0; padding-left: 14px; padding-right: 14px; } .form__connected-item .form__connection svg { width: 23px; height: 23px; } .form--main { text-align: center; max-width: 350px; margin: 60px auto; } .form__header, .form__legend { margin-bottom: 30px; } .form__title { margin-bottom: 15px; } .form__secondary-action { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: 32px; } .form__secondary-action > * { margin-bottom: 0; } @media screen and (min-width: 641px) { .form--main { margin-top: 110px; margin-bottom: 150px; } } select::-ms-expand { display: none; } .select-wrapper { color: currentColor; line-height: inherit; vertical-align: middle; position: relative; } .select-wrapper svg { pointer-events: none; vertical-align: baseline; fill: currentColor; position: absolute; } .select-wrapper select { -webkit-appearance: none; -moz-appearance: none; color: inherit; cursor: pointer; border-radius: 0; display: inline-block; } .select-wrapper select:focus::-ms-value { color: var(--text-color); background: none; } .select-wrapper option { color: #000; background: #fff; } .select-wrapper--transparent select { font-size: inherit; background: none; border: none; padding-right: 22px; } .select-wrapper--transparent svg { width: 12px; height: 8px; top: calc(50% - 4px); right: 4px; } .select-wrapper--primary { background: var(--secondary-background); position: relative; } .select-wrapper--primary select { border: 1px solid var(--form-border-color); box-shadow: 0 -1px 1px rgba(var(--border-color-rgb), .3) inset; background: none; border-radius: 2px; width: 100%; height: 48px; padding: 0 36px 0 12px; font-size: max(1rem, 16px); transition: border-color .2s ease-in-out, box-shadow .2s ease-in-out; } .select-wrapper--primary select:focus { border-color: var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color); outline: none; } .select-wrapper--primary select:valid { color: var(--heading-color); } .select-wrapper--primary svg { opacity: .7; width: 12px; height: 14px; top: calc(50% - 7px); right: 16px; } .select-wrapper--primary.select-wrapper--small select { height: 44px; padding-bottom: 1px; padding-left: 12px; } .form__input-wrapper--labelled .select-wrapper--primary.is-filled select { padding-top: 16px; } .select-button { background: var(--secondary-background); color: currentColor; line-height: inherit; vertical-align: middle; border: 1px solid var(--form-border-color); box-shadow: 0 -1px 1px rgba(var(--border-color-rgb), .3) inset; text-align: left; border-radius: 2px; width: 100%; height: 48px; padding: 0 36px 0 12px; font-size: 1rem; transition: border-color .2s ease-in-out, box-shadow .2s ease-in-out; position: relative; } .select-button:focus { border-color: var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color); outline: none; } .select-button svg { pointer-events: none; opacity: .7; vertical-align: baseline; fill: currentColor; width: 12px; height: 14px; position: absolute; top: calc(50% - 7px); right: 16px; } .select-button--mini { height: 32px; padding: 0 44px 0 10px; font-size: .85rem; } .select-button--mini svg { right: 11px; } select option { background: var(--background); color: var(--text-color); } .checkbox-wrapper { vertical-align: middle; margin: 8px 0; display: inline-block; position: relative; } .checkbox-wrapper svg { color: var(--secondary-background); width: 12px; height: 12px; transition: transform .2s ease-in-out; position: absolute; top: calc(50% - 6px); left: 2px; transform: scale(0); } .checkbox-wrapper ~ label { vertical-align: middle; cursor: pointer; } .checkbox { border: 1px solid var(--form-border-color); background: var(--secondary-background); box-shadow: 0 1px rgba(var(--border-color-rgb), .4); -webkit-appearance: none; border-radius: 2px; width: 16px; height: 16px; margin-right: 10px; transition: border-color .2s ease-in-out, box-shadow .2s ease-in-out, background .2s ease-in-out; display: block; } .checkbox:focus { border-color: var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color); outline: none; } .checkbox:checked { background: var(--accent-color); border-color: var(--accent-color); box-shadow: none; } .checkbox:checked + svg { transform: scale(1); } .checkbox.is-selected ~ label { color: var(--accent-color); font-weight: var(--text-font-bolder-weight); } .checkbox, .checkbox ~ label { vertical-align: middle; cursor: pointer; } @media screen and (min-width: 1000px) { .checkbox-wrapper { margin: 12px 0; } } .input-prefix { border: 1px solid var(--border-color); box-shadow: 0 1px rgba(var(--border-color-rgb), .25) inset; justify-content: space-between; align-items: center; padding: 5px 10px; font-size: 14px; display: flex; } .input-prefix__field { -webkit-appearance: none; appearance: none; -moz-appearance: textfield; text-align: end; border: none; width: 100%; min-width: 0; padding: 0; } .input-prefix__field::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .input-prefix__field::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .input-prefix__field:not(:placeholder-shown) { color: var(--heading-color); } .range { -webkit-appearance: none; appearance: none; background: none; width: 100%; } .range::-webkit-slider-thumb { -webkit-appearance: none; } .range::-webkit-slider-thumb { background: var(--heading-color); cursor: pointer; z-index: 1; box-shadow: 0 0 0 2px var(--secondary-background); border: none; border-radius: 100%; width: 10px; height: 10px; margin-top: -3px; position: relative; } .range::-webkit-slider-runnable-track { cursor: pointer; background: var(--heading-color); border: none; border-radius: 4px; width: 100%; height: 4px; } .range::-moz-range-thumb { background: var(--heading-color); cursor: pointer; box-shadow: 0 0 0 2px var(--secondary-background); border: none; border-radius: 100%; width: 10px; height: 10px; } .range::-moz-range-progress { cursor: pointer; border: none; border-radius: 4px; width: 100%; height: 4px; } .range::-moz-range-track { cursor: pointer; border: none; border-radius: 4px; width: 100%; height: 4px; } .range::-moz-range-progress { background-color: var(--heading-color); } .range::-moz-range-track { background-color: var(--border-color); } @media screen and not (any-hover: hover) { .range::-webkit-slider-thumb { width: 20px; height: 20px; margin-top: -8px; } .range::-moz-range-thumb { width: 20px; height: 20px; } } .range-group { background: linear-gradient(to right, var(--border-color) var(--range-min), var(--heading-color) var(--range-min), var(--heading-color) var(--range-max), var(--border-color) var(--range-max)); border-radius: 4px; height: 4px; } .range-group .range { pointer-events: none; vertical-align: top; height: 4px; } .range-group .range::-webkit-slider-runnable-track { background: none; } .range-group .range::-webkit-slider-thumb { pointer-events: auto; } .range-group .range::-moz-range-progress { background: none; } .range-group .range::-moz-range-track { background: none; } .range-group .range::-moz-range-thumb { pointer-events: auto; } .range-group .range:last-child { position: absolute; top: 0; left: 0; } .switch-checkbox { background: var(--secondary-background); -webkit-appearance: none; appearance: none; cursor: pointer; border: 1px solid var(--border-color); border-radius: 20px; width: 44px; height: 22px; transition: background .1s ease-in; position: relative; } .switch-checkbox:before { content: ""; background: var(--text-color); border-radius: 100%; width: 14px; height: 14px; transition: background .1s ease-in, transform .1s ease-in; display: block; position: absolute; top: 3px; left: 3px; box-shadow: 0 1px 1px #0003; } .switch-checkbox:checked { background: var(--heading-color); } .switch-checkbox:checked:before { background: var(--secondary-background); transform: translateX(calc(100% + 8px)); } .gift-card__inner { padding: 30px 0; } .gift-card__main { text-align: center; max-width: 635px; padding-top: 85px; position: relative; } .gift-card__image { border-radius: 100%; width: 170px; height: 170px; margin: 0 auto -75px; position: relative; top: -105px; overflow: hidden; box-shadow: 0 2px 8px #0003; } .gift-card__title { margin-bottom: 0; } .gift-card__amount { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 22px)); margin-bottom: 18px; } .gift-card__alert { margin-top: 20px; } .gift-card__code-container { max-width: 255px; margin: 0 auto 28px; } .gift-card__code { border: 1px solid var(--border-color); text-transform: uppercase; text-align: center; border-radius: 3px; justify-content: center; align-items: center; width: 100%; margin-bottom: 15px; padding: 6px 15px; display: inline-flex; } .gift-card__expires-on { color: var(--product-in-stock-color); font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); display: block; } .gift-card__expires-on:before { content: ""; vertical-align: baseline; background: currentColor; border-radius: 100%; width: 8px; height: 8px; margin-right: .7em; display: inline-block; } .gift-card__share { padding-top: 15px; padding-bottom: 20px; } .gift-card__wallet { text-align: center; margin-bottom: 30px; display: block; } .gift-card__qr img { margin: 0 auto; } .gift-card__shop { min-width: 300px; margin-top: 15px; } @media screen and (max-width: 640px) { .gift-card__print { width: 100%; } .gift-card__qr img { max-width: 120px; } } @media screen and (min-width: 641px) { .template-gift-card .header { padding-top: 30px; padding-bottom: 30px; } .gift-card__inner { max-width: 920px; margin: 0 auto; padding: 70px 0 90px; display: flex; } .gift-card__main { flex: 1 0 auto; } .gift-card__aside { flex: 0 0 255px; margin-top: 85px; margin-left: 30px; } .gift-card__image { width: 210px; height: 210px; margin-bottom: -80px; top: -135px; } .gift-card__amount { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 24px)); } .gift-card__code-container { justify-content: center; max-width: none; display: flex; } .gift-card__code { max-width: 250px; margin-bottom: 0; margin-right: 15px; } .gift-card__print { flex-basis: 150px; } } @media print { .gift-card__aside { display: none; } } .footer { border-top: var(--footer-border); background-color: var(--footer-background-color); color: var(--footer-body-text-color); padding: 10px 0 30px; } .footer a:hover { color: var(--footer-accent-color); } .footer__block-list { flex-flow: column wrap; display: flex; } .footer__title { text-align: left; color: var(--footer-heading-text-color); width: 100%; margin-bottom: .85em; display: block; position: relative; } .footer__title[disabled] { cursor: text; -webkit-user-select: text; user-select: text; } .footer__linklist { margin-top: -8px; margin-bottom: -5px; line-height: 1.4; } .footer__link-item { padding: 5px 0; display: block; } .footer__newsletter-form { margin-top: 20px; } .footer__aside { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); flex-direction: column; margin-top: 10px; display: flex; } .footer__aside-item { margin-top: 34px; } .footer__aside-item--localization, .footer__aside-item--copyright { margin-top: 45px; } .footer__aside-title { margin-bottom: .8em; } .footer__follow-on-shop { margin-top: .8em; } .footer__localization-form { color: var(--text-color); display: flex; } .footer__localization-form .select-button { width: auto; } .footer__localization-form-item:not(:last-child) { margin-right: 10px; } .footer .button--primary { background-color: var(--footer-accent-color); } .footer .button--primary:hover { background-color: rgba(var(--footer-accent-color-rgb), .8); } .footer .select-button { background: var(--footer-background-color); color: var(--footer-body-text-color); border-color: rgba(var(--footer-body-text-color-rgb), .5); } @media screen and (max-width: 640px) { .footer__block-item { margin-right: calc(-1 * var(--mobile-container-gutter)); padding-right: var(--mobile-container-gutter); border-bottom: 1px solid var(--border-color); } .footer__block-item--newsletter { border-bottom: none; order: 1; } .footer__title { justify-content: space-between; align-items: center; margin-bottom: 0; padding: 19px 0; display: flex; } .footer__collapsible { height: 0; transition: all .3s ease-in-out; overflow: hidden; } .footer__collapsible-content { padding: 0 20px 25px 0; } .footer__block-item .rte { margin-top: -.425em; } } @media screen and (min-width: 641px) { .footer { border-top: none; padding: 0; } .footer__wrapper { border-top: var(--footer-border); padding: 50px 0; } .footer__block-list { flex-direction: row; margin: -20px -35px; } .footer__block-item { flex: 0 0 50%; padding: 20px 35px; } .footer__block-item--newsletter { max-width: 350px; } .footer__block-item .plus-button { display: none; } .footer__localization-form { margin-bottom: 20px; } .footer__linklist { margin-top: -2px; margin-bottom: 0; } .footer__aside { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); flex-flow: wrap; justify-content: space-between; margin-top: 60px; } .footer__aside-item { margin-top: 0; } .footer__aside-item--localization, .footer__aside-item--copyright { width: 100%; } .footer__aside-item--copyright:not(:only-child) { margin-top: 34px; } } @media screen and (min-width: 1000px) { .footer__block-item { flex: 1 0 auto; } .footer__block-item--text { flex-basis: 300px; } .footer__block-item--newsletter { flex-basis: 350px; } .footer__block-item--links { max-width: 300px; } .footer__aside { align-items: flex-start; } .footer__aside-item--copyright { text-align: left; align-self: flex-end; margin-bottom: -8px; margin-top: 0 !important; } .footer__aside-item--localization, .footer__aside-item--copyright { width: auto; } } #shopify-section-header:after { content: ""; clear: both; display: table; } .header { background: var(--header-background); color: var(--header-text-color); padding: 13px 0; transition: margin-bottom .25s ease-in-out; position: relative; } .header__inner { flex-wrap: wrap; align-items: center; display: flex; } .header__inner--centered { justify-content: center; } .header__logo-link { display: block; } .header__logo { vertical-align: middle; margin-bottom: 0; display: inline-block; } .header__logo-image { vertical-align: middle; max-height: 130px; display: block; } .header__mobile-nav { margin-right: 20px; display: inline-block; } .header__desktop-nav { margin-right: 22px; position: relative; } .header__mobile-nav-toggle { top: -1px; } .header__desktop-nav-toggle { border: 1px solid var(--header-border-color); font-weight: var(--text-font-bolder-weight); border-radius: 3px; height: 44px; padding: 0 15px; } .header__desktop-nav-toggle > span { align-items: center; display: flex; } .header__desktop-nav-text { position: relative; top: 1px; } .header__search-bar-wrapper { flex: 1 0 auto; } .header .icon--account, .header .icon--hamburger, .header .icon--hamburger-mobile, .header .icon--search, .header .icon--cart, .header .icon--close { display: block; } .header .icon--account { width: 20px; height: 22px; } .header .icon--hamburger { width: 20px; height: 14px; } .header .icon--hamburger-mobile { width: 20px; height: 16px; } .header .icon--cart { width: 27px; height: 24px; } .header .icon--search { width: 22px; height: 22px; margin: 0 auto; } .header .icon--close { width: 19px; height: 19px; } @media screen and (max-width: 640px) { .header { align-items: center; min-height: 64px; display: flex; } .header > .container { width: 100%; } .header--search-expanded { margin-bottom: 59px; } } @media screen and (min-width: 641px) { .header { padding: 20px 0; } .header__inner { flex-wrap: nowrap; } .header__logo { margin-right: 35px; } } @media screen and (min-width: 1000px) { .icon--hamburger { margin-right: 15px; } } @media screen and (min-width: 1280px) { .header__logo { margin-right: 40px; } .header__desktop-nav { margin-right: 30px; } .header__desktop-nav-toggle { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); } } .header__action-list { align-items: center; display: flex; margin-left: auto; /* Default for non-Arabic languages */ } .header__action-list.ar { margin-left: 0; margin-right: auto; /* For Arabic */ } .header__action-item { padding: 0 9px; } .header__action-item:last-child { padding-right: 4px; } .header__action-item-link { font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); display: block; } .header__action-item-link--small { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); font-weight: normal; } .header__action-item-title { color: var(--header-light-text-color); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin-bottom: -6px; font-weight: normal; display: block; } .header__action-item--currency, .header__action-item--locale { margin-right: 25px; padding: 0 24px; } .header__currency-selector { font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); } .header__action-item .icon--arrow-bottom { width: 12px; height: 8px; margin-left: 4px; } .header__action-item .icon--lock-2 { width: 12px; height: 15px; } .header__action-item .icon--lock-2 + span { margin-left: 14px; } .header__cart-icon { margin-left: -2px; } .header__cart-count { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); font-weight: var(--text-font-bolder-weight); text-align: center; background: var(--header-accent-color); color: var(--secondary-background); will-change: transform; z-index: 1; border-radius: 1.75em; justify-content: center; align-items: center; min-width: 20px; height: 20px; padding: 4px; transition: transform .35s ease-in-out; display: inline-flex; position: absolute; top: -7px; right: -14px; transform: scale(1.01); } .header__cart-toggle[aria-expanded="true"] .header__cart-count, .header__cart-toggle:hover .header__cart-count { transform: scale(1.2); } @media screen and (max-width: 640px) { .header__cart-icon .icon-state__secondary.icon-state__secondary { left: 8px; } .header__action-item .icon--lock-2 { display: block; } .header__search-bar-wrapper { visibility: hidden; background: var(--header-background); z-index: -1; width: 100%; padding: 0 20px; transition: visibility .25s ease-in-out, margin-bottom .25s ease-in-out; position: absolute; bottom: 0; left: 0; } .header__search-bar-wrapper.is-visible { visibility: visible; margin-bottom: -59px; } .header__search-bar-wrapper.is-fixed { z-index: 10; height: 100vh; position: fixed; top: 0; left: 0; } } @media screen and (min-width: 641px) { .header__action-list { padding-left: 28px; } .header__action-item, .header__action-item-content { position: relative; } .header__action-item-content { max-width: max-content; } .header__action-item .icon--lock-2 { vertical-align: text-top; } } @media screen and (min-width: 1000px) { .header__action-list { padding-left: 5px; } .header__action-item:not(:last-child):after { content: ""; background: var(--header-border-color); width: 1px; height: 34px; position: absolute; top: calc(50% - 17px); right: 0; } .header__action-item--currency { margin-right: 20px; } } @media screen and (min-width: 1000px) and (max-width: 1279px) { .header__action-item:not(.header__action-item--currency):not(.header__action-item--locale):after { display: none; } .header__action-item--currency + .header__action-item--locale { padding-left: 9px; } .header__action-item.hidden-tablet-and-up:first-child + .header__action-item { padding-left: 35px; } } @media screen and (min-width: 1280px) { .header__action-item { padding: 0 35px; } .header__action-item:last-child { padding-right: 0; } .header__action-item--currency, .header__action-item--locale { margin-right: 0; } .header__cart-icon { margin-right: 22px; display: inline-block; top: -1px; } } .search-bar { z-index: 1; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); min-width: 100%; padding-bottom: 15px; position: relative; } .search-bar__top { background: var(--secondary-background); color: var(--text-color); z-index: 1; border-radius: 3px; align-items: center; height: 44px; display: flex; position: relative; } .search-bar__input-wrapper { flex: 1 0 auto; height: 100%; position: relative; } .search-bar__input { color: var(--heading-color); -webkit-appearance: none; background: none; border: none; width: 100%; height: 100%; padding: 0 15px 1px; line-height: normal; } .search-bar__input::placeholder { color: var(--text-color); opacity: 1; } .search-bar__input::-ms-clear { display: none; } .search-bar__input:focus { outline: none; } .search-bar__input-clear { opacity: .5; display: none; position: absolute; top: calc(50% - 9px); right: 15px; } .search-bar__input-clear svg { width: 17px; height: 17px; display: block; } .search-bar__input.is-filled + .search-bar__input-clear { display: block; } .search-bar__filter { border-left: 1px solid var(--header-border-color); display: none; } .search-bar__filter-label { height: 44px; padding: 0 30px 0 25px; line-height: 43px; display: block; } .search-bar__filter-label svg { width: 12px; height: 8px; margin-left: 11px; } .search-bar__submit { color: var(--secondary-background); background: var(--header-accent-color); border-radius: 0 3px 3px 0; flex: none; width: 50px; height: 100%; } .search-bar__submit svg { position: relative; } .search-bar__submit .icon--search { width: 21px; height: 21px; } .search-bar__submit .icon--search-loader { width: 24px; height: 24px; margin: 0 auto; display: none; } .search-bar__inner { color: var(--text-color); background: none; width: 100vw; display: none; position: absolute; top: calc(100% + 8px); left: -20px; overflow: hidden; } .search-bar__results, .search-bar__menu-wrapper { background: var(--secondary-background); width: 100%; display: none; position: relative; top: 0; left: 0; box-shadow: 0 1px 5px 2px #0000001a; } .search-bar__results[aria-hidden="false"], .search-bar__menu-wrapper[aria-hidden="false"], .search-bar.is-expanded .search-bar__inner { display: block; } .search-bar__empty-state { text-align: center; padding: 50px 0; } .search-bar__result-products ~ .search-bar__empty-state { display: none; } .search-bar__menu-title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); margin-bottom: 4px; } .search-bar__menu-wrapper { overscroll-behavior: none; height: 100%; padding: 18px 0 12px; overflow: auto; } .search-bar__menu-title, .search-bar__menu-link { padding-left: 20px; padding-right: 20px; } .search-bar__menu-link { padding-top: 6px; padding-bottom: 6px; transition: color .15s ease-in-out, background .15s ease-in-out; display: block; } .search-bar__menu-link:hover, .search-bar__menu-link:focus { background: var(--accent-background); color: var(--accent-color); outline: none; } .search-bar__results .skeleton-container { display: none; } .search-bar__results { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); overscroll-behavior: none; height: 100%; overflow: auto; } .search-bar__result-category { text-transform: uppercase; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); font-weight: var(--text-font-bolder-weight); background: var(--background); box-shadow: 0 1px var(--border-color), 0 -1px var(--border-color); margin: 0; padding: 4px 20px; } .search-bar__result-item { align-items: center; padding: 15px 20px; transition: background .2s ease-in-out; display: flex; } .search-bar__result-item:not(.search-bar__result-item--skeleton):hover, .search-bar__result-item:not(.search-bar__result-item--skeleton):focus { background: var(--accent-background); outline: none; } .search-bar__result-item--skeleton { max-width: 300px; } .search-bar__image-container { flex: none; width: 60px; margin-right: 20px; } .search-bar__image-container img { color: #0000; } .search-bar__item-info { flex: 1 0 0; } .search-bar__item-title { margin-bottom: 0; line-height: 1.4; } .search-bar__item-price { color: var(--accent-color); } .search-bar__result-link { padding: 5px 20px; transition: color .2s ease-in-out, background .2s ease-in-out; display: block; } .search-bar__result-link:hover, .search-bar__result-link:focus { color: var(--accent-color); background: var(--accent-background); outline: none; } .search-bar__view-all { text-align: center; font-weight: var(--text-font-bolder-weight); color: var(--accent-color); width: 100%; padding: 10px; transition: background .2s ease-in-out; display: block; } .search-bar__view-all:hover, .search-bar__view-all:focus { background: var(--accent-background); outline: none; } .search-bar__view-all svg { width: 6px; height: 10px; margin-left: 12px; } .search-bar__view-all path { stroke-width: 2.5px; } .search-bar.is-loading .search-bar__results-inner, .search-bar.is-loading .search-bar__submit .icon--search { display: none; } .search-bar.is-loading .skeleton-container, .search-bar.is-loading .search-bar__submit .icon--search-loader { display: block; } @media screen and (max-width: 640px) { .search-bar { opacity: 0; transition: opacity .2s ease-in-out; } .search-bar__inner { height: calc(100vh - 26px); max-height: 0; top: 100%; } .search-bar__top-wrapper { justify-content: space-between; align-items: center; display: flex; } .search-bar__top { flex-grow: 1; } .search-bar__close-button { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); opacity: 0; width: 0; height: 0; transition: width .25s ease-in-out, opacity .25s ease-in-out; overflow: hidden; } .search-bar__close-text { padding-left: 22px; } .header__search-bar-wrapper.is-visible .search-bar { opacity: 1; transition-delay: .15s; } .header__search-bar-wrapper.is-fixed .search-bar { padding: 9px 0; } .header__search-bar-wrapper.is-fixed .search-bar__inner { visibility: visible; max-height: none; } .header__search-bar-wrapper.is-fixed .search-bar__inner-animation { transition: none; } .header__search-bar-wrapper.is-fixed .search-bar__close-button { opacity: 1; white-space: nowrap; height: auto; } @supports (padding: max(0px)) { .search-bar__view-all { padding-bottom: max(10px, env(safe-area-inset-bottom, 0px) + 10px); } } } @media screen and (min-width: 641px) { .search-bar { min-width: 0; margin-top: 0; padding-bottom: 0; } .search-bar__inner { width: calc(100% - 40px); top: 100%; left: -5px; } @supports (--css: variables) { .search-bar__inner { height: calc(100vh - var(--header-height) - 40px); } } .search-bar__submit .icon--search { top: 1px; } .search-bar__result-category { padding-left: 15px; } .search-bar__results { height: auto; max-height: 310px; } @supports (--css: variables) { .search-bar__results { max-height: calc(100vh - var(--header-height) - 40px); } } .search-bar__menu-wrapper { height: auto; max-height: 310px; } .search-bar__results, .search-bar__menu-wrapper { border-radius: 0 0 3px 3px; width: calc(100% - 10px); left: 5px; } .search-bar__menu-title, .search-bar__menu-link { padding-left: 25px; padding-right: 25px; } .search-bar.is-expanded .search-bar__top { border-bottom-left-radius: 0; } } @media screen and (min-width: 1280px) { .search-bar__filter { height: 100%; display: block; position: relative; } .search-bar__filter select { opacity: 0; -webkit-appearance: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } } .map { background: var(--secondary-background); border: 1px solid var(--border-color); border-radius: 3px; padding: 0 20px; } .map__store-item:not(:last-child) { border-bottom: 1px solid var(--border-color); } .map__store-name { justify-content: space-between; align-items: center; width: 100%; padding: 15px 0; display: flex; } .map__store-name svg { width: 12px; height: 8px; } .map__icon-container { transition: transform .2s ease-in-out; transform: rotateZ(0); } .map__store-name[aria-expanded="true"] .map__icon-container { transform: rotateZ(180deg); } .map__store-collapsible { height: 0; transition: height .25s ease-in-out; display: block; overflow: hidden; } .map__store-inner { margin-top: -.425em; } .map__store-address { margin-bottom: 15px; } .map__store-address > p { margin-bottom: 0 !important; } .map__store-hours { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-bottom: 22px; } .map__direction-link, .map__map-container { margin-bottom: 30px; } .map__map-container { background-position: center; background-size: cover; height: 160px; position: relative; overflow: hidden; } .map__gmap { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } @media screen and (min-width: 641px) { .map__map-container { height: 300px; } } @media screen and (min-width: 1000px) { .map { height: 405px; padding: 0; display: flex; } .map__store-list { border-right: 1px solid var(--border-color); width: 50%; max-width: 580px; } .map__map-container { flex: 1 0 auto; height: 100%; margin: 0; } .map__store-list { padding: 0 40px 0 30px; overflow: auto; } .map__store-name { padding: 20px 0; } .map__store-address { margin-bottom: 22px; } } .plyr.plyr--full-ui.plyr--video { color: var(--text-color); background-color: #0000; } .plyr.plyr--full-ui.plyr--video .plyr__video-wrapper { background-color: #0000; } .plyr.plyr--full-ui.plyr--video:-webkit-full-screen .plyr__video-wrapper .plyr.plyr--full-ui.plyr--video:-webkit-full-screen .plyr__poster { background-color: #000; } .plyr.plyr--full-ui.plyr--video:fullscreen .plyr__video-wrapper .plyr.plyr--full-ui.plyr--video:fullscreen .plyr__poster { background-color: #000; } :is(.plyr.plyr--full-ui.plyr--video:fullscreen .plyr__video-wrapper, .plyr.plyr--full-ui.plyr--video:fullscreen .plyr__poster), .plyr.plyr--full-ui.plyr--video .plyr--fullscreen-fallback .plyr__video-wrapper, .plyr.plyr--full-ui.plyr--video .plyr--fullscreen-fallback .plyr__poster { background-color: #000; } :is(.plyr.plyr--full-ui.plyr--video:fullscreen .plyr__video-wrapper, .plyr.plyr--full-ui.plyr--video:fullscreen .plyr__poster), .plyr.plyr--full-ui.plyr--video .plyr--fullscreen-fallback .plyr__video-wrapper, .plyr.plyr--full-ui.plyr--video .plyr--fullscreen-fallback .plyr__poster { background-color: #000; } .plyr.plyr--full-ui.plyr--video .plyr__controls, .plyr.plyr--full-ui.plyr--video .plyr__control.plyr__control--overlaid { background-color: var(--secondary-background); border-color: rgba(var(--text-color-rgb), .05); } .plyr.plyr--full-ui.plyr--video .plyr__control.plyr__control--overlaid.plyr__tab-focus, .plyr.plyr--full-ui.plyr--video .plyr__control.plyr__control--overlaid:hover { color: rgba(var(--text-color-rgb) .55); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]::-moz-range-thumb { box-shadow: 2px 0 0 0 var(--secondary-background); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]::-ms-thumb { box-shadow: 2px 0 0 0 var(--secondary-background); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]::-webkit-slider-thumb { box-shadow: 2px 0 0 0 var(--secondary-background); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]::-webkit-slider-runnable-track { background-image: linear-gradient(to right, currentColor var(--value, 0), rgba(var(--text-color-rgb) .6)); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]::-moz-range-track { background-color: rgba(var(--text-color-rgb) .6); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]::-ms-fill-upper { background-color: rgba(var(--text-color-rgb) .6); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"].plyr__tab-focus::-webkit-slider-runnable-track { box-shadow: 0 0 0 4px rgba(var(--text-color-rgb) .25); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"].plyr__tab-focus::-moz-range-track { box-shadow: 0 0 0 4px rgba(var(--text-color-rgb) .25); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"].plyr__tab-focus::-ms-track { box-shadow: 0 0 0 4px rgba(var(--text-color-rgb) .25); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]:active::-moz-range-thumb { box-shadow: 0 0 0 3px rgba(var(--text-color-rgb) .25); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]:active::-ms-thumb { box-shadow: 0 0 0 3px rgba(var(--text-color-rgb) .25); } .plyr.plyr--full-ui.plyr--video .plyr__progress input[type="range"]:active::-webkit-slider-thumb { box-shadow: 0 0 0 3px rgba(var(--text-color-rgb) .25); } .plyr.plyr--full-ui.plyr--video .plyr__progress .plyr__tooltip { background-color: var(--text-color); color: var(--secondary-background); } .plyr.plyr--full-ui.plyr--video .plyr__progress .plyr__tooltip:before { border-top-color: var(--text-color); } .plyr.plyr--full-ui.plyr--video.plyr--loading .plyr__progress__buffer { background-image: linear-gradient(-45deg, rgba(var(--text-color-rgb) .6) 25%, transparent 25%, transparent 50%, rgba(var(--text-color-rgb) .6) 50%, rgba(var(--text-color-rgb) .6) 75%, transparent 75%, transparent); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"] { color: var(--secondary-background); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]::-moz-range-thumb { box-shadow: 2px 0 0 0 var(--text-color); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]::-ms-thumb { box-shadow: 2px 0 0 0 var(--text-color); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]::-webkit-slider-thumb { box-shadow: 2px 0 0 0 var(--text-color); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]::-webkit-slider-runnable-track { background-image: linear-gradient(to right, currentColor var(--value, 0), rgba(var(--secondary-background-rgb), .6) var(--value, 0)); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]::-moz-range-track { background-color: rgba(var(--secondary-background-rgb), .6); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]::-ms-fill-upper { background-color: rgba(var(--secondary-background-rgb), .6); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"].plyr__tab-focus::-webkit-slider-runnable-track { box-shadow: 0 0 0 4px rgba(var(--secondary-background-rgb), .25); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"].plyr__tab-focus::-moz-range-track { box-shadow: 0 0 0 4px rgba(var(--secondary-background-rgb), .25); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"].plyr__tab-focus::-ms-track { box-shadow: 0 0 0 4px rgba(var(--secondary-background-rgb), .25); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]:active::-moz-range-thumb { box-shadow: 0 0 0 3px rgba(var(--secondary-background-rgb), .25); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]:active::-ms-thumb { box-shadow: 0 0 0 3px rgba(var(--secondary-background-rgb), .25); } .plyr.plyr--full-ui.plyr--video .plyr__volume input[type="range"]:active::-webkit-slider-thumb { box-shadow: 0 0 0 3px rgba(var(--secondary-background-rgb), .25); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__controls-area { background: var(--secondary-background); border-color: rgba(var(--text-color-rgb) .05); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button { color: var(--text-color); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--control:hover { color: rgba(var(--text-color-rgb) .55); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--control:active, .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--control.focus-visible:focus { color: rgba(var(--text-color-rgb) .55); background: rgba(var(--text-color-rgb) .05); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--control:not(:last-child):after { border-color: rgba(var(--text-color-rgb) .05); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--poster { background: var(--secondary-background); border-color: rgba(var(--text-color-rgb) .05); } .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--poster:hover, .shopify-model-viewer-ui.shopify-model-viewer-ui .shopify-model-viewer-ui__button--poster:focus { color: rgba(var(--text-color-rgb) .55); } .video-wrapper { cursor: pointer; position: relative; } .video-wrapper:after { content: ""; padding-bottom: 56.25%; display: block; } .video-wrapper iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .video-wrapper iframe:not([src]) { pointer-events: none; } .video-wrapper--native:after { display: none; } .video-wrapper--native .plyr, .video-wrapper--native video { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .video-wrapper--native .plyr__video-wrapper, .video-wrapper--native video { height: 100%; } .video-wrapper__image-wrapper { opacity: 1; visibility: visible; transition: opacity .2s ease-in-out, visibility .2s ease-in-out; } .video-wrapper__image-wrapper, .video-wrapper__image { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .video-wrapper__image { object-fit: cover; object-position: center; font-family: "object-fit: cover; object-position: center"; } .icon--play { filter: drop-shadow(0 2px 2px #0006); } .video-wrapper .icon--play { opacity: 1; width: 80px; height: 80px; transition: transform .2s ease-in-out, opacity .2s ease-in-out; position: absolute; top: calc(50% - 40px); left: calc(50% - 40px); } @media screen and (any-hover: hover) { .video-wrapper:hover .icon--play { transform: scale(1.15); } } .video-item { max-width: 855px; margin: 20px auto; } .video-item--stretch { max-width: none; } .video-item[aria-hidden="true"] { display: none; } .video-item .video-wrapper iframe { visibility: hidden; width: 0; height: 0; } .video-item.is-playing .video-wrapper__image-wrapper { visibility: hidden; opacity: 0; } .video-item.is-playing iframe { visibility: visible; width: 100%; height: 100%; } .model-wrapper { padding-bottom: 100%; position: relative; } .model-wrapper .shopify-model-viewer-ui, .model-wrapper model-viewer { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .mosaic { margin: 0 -10px -20px; } .mosaic__item { padding: 0 10px 20px; } .mosaic__item > :first-child { min-height: 240px; } .mosaic--large .mosaic__item > :first-child { min-height: 280px; } @media screen and (max-width: 999px) { .mosaic--two-columns .mosaic__column:first-child .mosaic__item > :first-child, .mosaic--three-columns .mosaic__column:nth-child(2) .mosaic__item > :first-child { min-height: 340px; } } @media screen and (min-width: 641px) { .mosaic { margin: 0 -15px -30px; } .mosaic__item { padding: 0 15px 30px; } } @media screen and (min-width: 1000px) { .mosaic { display: flex; } .mosaic__column { flex-direction: column; flex: 1 0; display: flex; } .mosaic__item { flex-direction: column; flex: 1 0 auto; display: flex; } .mosaic__item > :first-child { flex: 1 0 auto; height: 100%; min-height: 260px; } .mosaic--small .mosaic__item > :first-child { min-height: 225px; } .mosaic--large .mosaic__item > :first-child { min-height: 300px; } .mosaic--two-columns .mosaic__column:first-child, .mosaic--three-columns .mosaic__column:nth-child(2) { flex-grow: 1.38; } } .nav-dropdown { background: var(--secondary-background); color: var(--text-color); border: 1px solid var(--border-color); white-space: nowrap; visibility: hidden; opacity: 0; z-index: 1; border-radius: 0 0 3px 3px; padding: 16px 0; list-style: none; transition: opacity .2s ease-in-out, visibility .2s ease-in-out; position: absolute; top: 100%; } .nav-dropdown:not(.nav-dropdown--floating) { } .nav-dropdown--floating { border: none; border-radius: 3px; margin-top: 7px; } .nav-dropdown--floating:before { content: ""; z-index: -1; width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-shadow: 0 5px 5px -2px #0000001a, 5px 0 5px -2px #0000001a, 0 -5px 5px -2px #0000001a; } .mini-cart .icon--nav-triangle-borderless { display : none ; } .nav-dropdown--glued:not(.nav-dropdown--inverse) { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; } .nav-dropdown--glued.nav-dropdown--inverse { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; } .nav-dropdown--fixed { min-height: 420px; } .nav-dropdown--restrict { max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 40px); overscroll-behavior: contain; overflow: auto; } @supports (--css: variables) { .nav-bar .nav-dropdown .nav-dropdown { max-height: calc(100vh - var(--distance-to-top, 0px) - 40px); overscroll-behavior: contain; overflow: auto; } } .nav-dropdown[aria-hidden="false"] { visibility: visible; opacity: 1; } .nav-dropdown .icon--nav-triangle-borderless { z-index: 1; width: 20px; height: 9px; position: absolute; bottom: 100%; left: 16px; } .nav-dropdown .icon--nav-triangle-left { z-index: 1; width: 9px; height: 20px; position: absolute; top: 23px; right: 100%; } .nav-dropdown__item:not(.has-mega-menu) { position: relative; } .nav-dropdown__link { cursor: pointer; justify-content: space-between; align-items: center; padding: 2px 60px 2px 20px; display: flex; } .nav-dropdown__link svg { width: 8px; height: 12px; margin: 0 -40px 0 65px; position: relative; top: 1px; } .nav-dropdown__link[aria-expanded="true"] { color: var(--accent-color); } .nav-dropdown .nav-dropdown { border-radius: 0 3px 3px 0; min-width: 0; margin-top: 0; top: -17px; left: 100%; } .nav-dropdown--inverse .nav-dropdown { border-radius: 3px 0 0 3px; left: auto; right: 100%; } .nav-dropdown--inverse .nav-dropdown .icon--nav-triangle-left { left: 100%; right: auto; transform: rotateZ(180deg); } .nav-dropdown .nav-dropdown--floating { border-left: 1px solid var(--border-color); top: -16px; } .mega-menu { background: var(--secondary-background); border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); visibility: hidden; opacity: 0; border-radius: 0 0 3px 3px; width: 100vw; transition: opacity .2s ease-in-out, visibility .2s ease-in-out; position: absolute; top: 100%; left: 0; } .mega-menu--floating { max-width: 0; } .mega-menu[aria-hidden="false"] { visibility: visible; opacity: 1; } .mega-menu__inner { justify-content: space-between; align-items: flex-start; min-height: 100%; max-height: 100%; padding: 25px 0 0; display: flex; overflow: auto; } .mega-menu__inner--center { justify-content: center; } .mega-menu__promo { white-space: normal; text-align: center; flex: 0 230px; width: 230px; min-width: 200px; margin: 0 0 30px 50px; display: block; } .mega-menu__promo + .mega-menu__promo { margin-left: 20px; } .mega-menu__column-list { flex-wrap: wrap; flex: auto; min-width: 0; margin: 0 -40px; display: flex; } @supports (display: grid) { .mega-menu__column-list { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); display: grid; } } .mega-menu__column { flex: 0 auto; margin: 0 30px 30px; display: block; } .mega-menu:not(.mega-menu--floating) .mega-menu__column:first-child { margin-left: 0 !important; } .mega-menu:not(.mega-menu--floating) .mega-menu__column:last-child { margin-right: 0 !important; } .mega-menu__title { margin-bottom: 10px; display: block; } .mega-menu__linklist { list-style: none; } .mega-menu__link { padding: 5px 0 6px; line-height: 1.4; display: block; } .mega-menu__image-wrapper { border-radius: 3px; margin: 5px 0 22px; overflow: hidden; } .mega-menu__promo .aspect-ratio { transition: transform .6s ease-in-out; transform: scale(1.01); } .features--animate-zoom .mega-menu__promo:hover .aspect-ratio { transform: scale(1.06); } .mega-menu__promo:hover .mega-menu__image-heading { color: var(--accent-color); } .mega-menu__image-heading { margin-bottom: 7px; transition: color .2s ease-in-out; display: block; } .mega-menu__image-text { line-height: 1.5; } .nav-bar .mega-menu { max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 40px); overscroll-behavior: contain; overflow: auto; } @media screen and (min-width: 1280px) { .mega-menu__column { margin-left: 40px; margin-right: 40px; } .mega-menu__inner--large .mega-menu__column { margin-left: 50px; margin-right: 50px; } .mega-menu__promo { flex-basis: 290px; width: 290px; } } @media screen and (min-width: 1440px) { .mega-menu__inner--center .mega-menu__column { margin-left: 45px; margin-right: 45px; } .mega-menu__inner--large .mega-menu__column { margin-left: 60px; margin-right: 60px; } .mega-menu__promo { min-width: 240px; } } .mega-menu--floating { border: none; border-left: 1px solid var(--border-color); border-radius: 0 3px 3px 0; width: 100vw; height: 100%; top: 0; left: 100%; } .mega-menu--floating:before { content: ""; z-index: -1; width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-shadow: 0 5px 5px -2px #0000001a, 5px 0 5px -2px #0000001a, 0 -5px 5px -2px #0000001a; } .mega-menu--floating .mega-menu__inner { margin: 0; padding-left: 25px; padding-right: 30px; } .mega-menu--floating .mega-menu__title { margin-bottom: 5px; } .mega-menu--floating .mega-menu__column { white-space: normal; flex: 0 0 170px; margin-left: 30px; margin-right: 30px; display: block; } .mega-menu--floating .mega-menu__column-list { margin: 0 -30px; } .nav-bar { display: none; } @media screen and (min-width: 1000px) { .nav-bar { border-bottom: 1px solid var(--border-color); background: var(--secondary-background); width: 100%; display: block; position: relative; left: 0; } .nav-bar:after { content: ""; background: linear-gradient(to right, rgba(var(--secondary-background-rgb), .1), rgba(var(--secondary-background-rgb), .6) 35%, var(--secondary-background)); width: 40px; height: 100%; position: absolute; top: 0; right: 0; } .nav-bar__item { margin-right: 35px; padding: 17px 0; display: inline-block; position: relative; } .nav-bar__item--static { position: static; } .nav-bar__item > .nav-dropdown { min-width: calc(100% + 20px); } .nav-bar__link { cursor: pointer; display: block; } .nav-bar__link .icon--arrow-bottom { width: 12px; height: 8px; margin-left: 10px; } .nav-bar__link .icon--nav-triangle { opacity: 0; z-index: 2; width: 20px; height: 9px; margin-left: -16px; transition: all .2s ease-in-out; position: absolute; bottom: -1px; } .nav-bar__link[aria-expanded="true"] { color: var(--accent-color); } .nav-bar__link[aria-expanded="true"] .icon--nav-triangle { opacity: 1; } } .mobile-menu { visibility: hidden; z-index: 1; opacity: 0; color: var(--text-color); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); will-change: transform; width: 100vw; height: 100vh; max-height: 0; transition: opacity .25s ease-in-out, transform .25s ease-in-out, visibility .25s ease-in-out, max-height 0s linear .25s; position: absolute; top: 100%; left: 0; transform: scale(.9); } .mobile-menu .icon--arrow-right, .mobile-menu .icon--arrow-left { width: 8px; height: 12px; } .mobile-menu[aria-hidden="false"] { opacity: 1; visibility: visible; transition: opacity .4s cubic-bezier(0, 1, .4, 1), transform .4s cubic-bezier(.18, 1.25, .4, 1), visibility .4s linear; transform: scale(1); } .mobile-menu__inner { max-width: 100vw; height: 100%; position: relative; overflow: hidden; } .mobile-menu .icon--nav-triangle-borderless { z-index: 1; width: 18px; height: 8px; position: absolute; bottom: 100%; left: 20px; } .mobile-menu__panel { background: var(--secondary-background); overscroll-behavior: none; -webkit-overflow-scrolling: touch; height: 100%; transition: transform .5s cubic-bezier(.23, 1, .32, 1), visibility .5s cubic-bezier(.23, 1, .32, 1); position: relative; overflow: hidden auto; } .mobile-menu__panel.is-nested { visibility: hidden; z-index: 1; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transform: translateX(100%); } .mobile-menu__section { padding: 16px 20px; } .mobile-menu__section--loose { padding-top: 18px; padding-bottom: 18px; } .mobile-menu__section:not(:last-child) { border-bottom: 1px solid var(--border-color); } .mobile-menu__section.is-sticky { background: var(--secondary-background); z-index: 1; position: sticky; top: 0; } .mobile-menu__nav { list-style: none; } .mobile-menu__nav-link { justify-content: space-between; align-items: center; width: 100%; padding: 8px 0 7px; display: flex; } .mobile-menu__back-button { text-align: left; width: 100%; display: block; } .mobile-menu__back-button svg { vertical-align: -1px; margin-right: 8px; } .mobile-menu__nav-list { margin-top: 2px; } .mobile-menu__nav-list-toggle { text-align: left; width: 100%; padding: 4px 0; } .mobile-menu__nav-list-toggle svg { width: 12px; height: 8px; margin-left: 12px; transition: transform .3s ease-in-out; } .mobile-menu__nav-list-toggle[aria-expanded="true"] svg { transform: rotateZ(180deg); } .mobile-menu__nav-list-item { margin-bottom: 22px; } .mobile-menu__nav-collapsible { height: 0; transition: all .3s ease-in-out; overflow: hidden; } .mobile-menu__nav-collapsible-content { margin-top: 4px; } .mobile-menu__promo { text-align: center; padding: 20px 0 25px; display: block; } .mobile-menu__image-wrapper { border-radius: 3px; margin-bottom: 22px; overflow: hidden; } .mobile-menu__image-heading { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); margin-bottom: 0; display: block; } .mobile-menu__image-text { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); } .mobile-menu__promo-list { flex-flow: row; margin-left: -10px; margin-right: -10px; display: flex; } .mobile-menu__promo-list .mobile-menu__promo-item { white-space: normal; scroll-snap-align: center; flex: none; width: 81%; } .mobile-menu__promo-list .mobile-menu__promo { margin-left: 10px; margin-right: 10px; } .scroller .mobile-menu__promo-list:before { content: ""; flex: 0 0 20px; } .scroller .mobile-menu__promo-list:after { content: ""; flex: 0 0 13px; } @supports (padding: max(0px)) { .mobile-menu__section:last-child { padding-bottom: max(16px, env(safe-area-inset-bottom, 0px) + 16px); } } @media screen and (min-width: 641px) { .mobile-menu .icon--nav-triangle-borderless { left: 40px; } } .mobile-menu[aria-hidden="false"] .mobile-menu__panel.is-open { visibility: visible; transform: translateX(0); } .mobile-menu__help-wrapper { align-items: center; display: flex; } .mobile-menu__help-wrapper .icon--bi-phone { width: 24px; height: 24px; margin-right: 16px; } .mobile-menu__help-wrapper .icon--bi-email { width: 22px; height: 22px; margin-right: 18px; } .mobile-menu__help-wrapper + .mobile-menu__help-wrapper { margin-top: 18px; } .line-item__product-info-wrapper { align-items: flex-start; display: flex; } .line-item__image-wrapper { width: 60px; min-width: 60px; margin-right: 20px; } .line-item__meta { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } .line-item__vendor, .line-item__plan-allocation, .line-item__property-list { line-height: 1.55; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); margin-bottom: 7px; display: block; } .line-item__vendor { text-transform: uppercase; } .line-item__title { margin-bottom: 4px; line-height: 1.5; display: block; } .line-item__property-list { margin: 6px 0; line-height: 1.5; list-style: none; } .line-item__price { font-weight: var(--text-font-bolder-weight); color: var(--accent-color); display: inline-block; } .line-item__price--compare { color: var(--text-color); } .line-item__price--highlight { color: var(--product-on-sale-accent); } .line-item__price--compare { margin-left: 20px; position: relative; } .line-item__price--compare:before { content: ""; background: rgba(var(--text-color-rgb), .7); width: calc(100% + 10px); height: 1px; position: absolute; top: 50%; left: -5px; } .line-item__price-info { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: -2px; } .line-item__discount-list { margin-top: 2px; list-style: none; } .line-item__discount { font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); background: rgba(var(--product-on-sale-accent-rgb), .08); color: var(--product-on-sale-accent); border-radius: 2px; padding: 0 11px; display: inline-block; } .line-item__discount svg { vertical-align: text-bottom; margin-right: 6px; } .line-item__quantity-remove { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-left: 10px; line-height: 1; display: inline-block; } @media screen and (max-width: 640px) { .line-item-table, .line-item-table tbody { width: auto; display: block; } .line-item--stack { white-space: normal; display: block; } .line-item--stack:first-child { border-top: none !important; } .line-item--stack .line-item__image-wrapper { width: 80px; min-width: 80px; } .line-item--stack .line-item__product-info { padding-top: 20px; padding-bottom: 20px; display: block; } .line-item--stack .line-item__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } .line-item--stack .line-item__price { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); } .line-item--stack .line-item__quantity { margin-top: 12px; } } @media screen and (min-width: 641px) { .line-item__product-info-wrapper { align-items: center; } .line-item__title { white-space: normal; } .line-item__image-wrapper { width: 90px; min-width: 90px; } .line-item__quantity-remove { width: max-content; margin: 10px auto 0; display: block; } } .fulfillment-item { border-top: none !important; } .fulfillment-item td { padding-top: 0 !important; } .order-foot { border-top: 1px solid var(--border-color); } .order-foot__item { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); justify-content: space-between; align-items: center; padding: 16px 20px 16px 0; display: flex; } .order-foot__item + .order-foot__item { border-top: 1px solid var(--border-color); } .order-foot__item--highlight, .order-foot__item--strong { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); font-weight: var(--text-font-bolder-weight); } .order-foot__item--highlight { color: var(--product-on-sale-accent); } .order-foot__item--strong { color: var(--heading-color); } @media screen and (max-width: 640px) { .card .order-foot { margin-left: 20px; } } @media screen and (min-width: 641px) { .order-foot__inner { max-width: 470px; margin-left: auto; } .order-foot__item { padding-left: 20px; padding-right: 30px; } } .order-summary__alert { margin: 21px 0 5px; } @media screen and (min-width: 641px) { .order-summary__alert { margin: 24px 0 12px; } } .address-list, .address-list__item + .address-list__item { border-top: 1px solid var(--border-color); } .address-list__item { padding: 24px 20px; } .address-list__action-list { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: 14px; } .address-list__action-list > :last-child { margin-left: 18px; } @media screen and (max-width: 640px) { .address-list, .address-list__item + .address-list__item { border-top: none; display: block; position: relative; } .address-list:before, .address-list__item + .address-list__item:before { content: ""; background: var(--border-color); width: calc(100% - 20px); height: 1px; position: absolute; top: 0; left: 20px; } } @media screen and (min-width: 641px) { .template-addresses .card__section--tight { padding-right: 20px; } .address-list { flex-wrap: wrap; display: flex; } .address-list__item { box-shadow: 0 1px var(--border-color), 1px 0 var(--border-color); flex-direction: column; flex: 0 0 50%; justify-content: space-between; padding-left: 30px; padding-right: 30px; display: flex; border-top: none !important; } } @media screen and (min-width: 1280px) { .address-list__item { flex-basis: 33.3333%; } } .page__header { justify-content: space-between; align-items: flex-end; margin: 28px 0; display: flex; } .page__header--stack { flex-direction: column; align-items: flex-start; } .page__header--centered { text-align: center; justify-content: center; } .page__header--stack.page__header--centered { align-items: center; } .page__header--image { text-shadow: 1px 2px 4px #0003; background-position: center; background-size: cover; border-radius: 3px; justify-content: center; min-height: 250px; padding: 25px; position: relative; overflow: hidden; } .page__header--image.page__header--overlay:before { content: ""; background: linear-gradient(#0000, #0000004d); width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .shopify-section:first-child .page__header--image { border-radius: 0; margin-top: 0 !important; } .page__header-image { object-position: center; object-fit: cover; z-index: -1; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .page__header-image--placeholder { fill: #696969; background: #a9a9a9; } .page__header-content { z-index: 1; } .page__title { margin-bottom: 0; } .page__sub-header { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin: 23px 0; display: none; } .page__description { margin: 10px 0 0; } .page__button-action { margin-top: 20px; } .page__tag-list { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin: 12px -20px -10px; list-style: none; } .page__tag-item { margin: 0 20px 10px; display: inline-block; position: relative; } .page__tag-item.is-selected { color: var(--accent-color); } .page__tag-item.is-selected:after { content: ""; background: currentColor; width: 100%; height: 1px; position: absolute; bottom: 0; left: 0; } .page__meta { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); margin-top: 8px; } .page__meta-item:not(:last-child):after { content: ""; background: rgba(var(--text-color-rgb), .4); vertical-align: middle; border-radius: 100%; width: 5px; height: 5px; margin: 0 10px; display: inline-block; } .page__navigation-item svg { width: 6px; height: 9px; } .page__navigation-item svg path { stroke-width: 1.5px; } .page__navigation-item--prev svg { margin-right: 9px; } .page__navigation-item--next svg { margin-left: 9px; } .page__navigation-item--prev + .page__navigation-item--next:before { content: ""; background: var(--text-color); vertical-align: -2px; width: 1px; height: 12px; margin: 0 15px; display: inline-block; } .page__content { margin-bottom: 40px; } @media screen and (min-width: 641px) { .page__header { margin: 35px 0; } .page__header--image { min-height: 430px; } .page__sub-header { justify-content: space-between; align-items: center; display: flex; } .page__sub-header + .page__header { margin-top: 20px; } .page__meta { margin-top: 10px; font-size: 1rem; } .page__meta-item:not(:last-child):after { margin: 0 16px; } .page__content { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); margin-bottom: 90px; } } @media screen and (min-width: 1000px) { .page__header { flex-direction: column; align-items: flex-start; } .page__header--centered { align-items: center; } } .popover { background: var(--secondary-background); color: var(--text-color); z-index: 1; visibility: hidden; opacity: 0; will-change: transform; width: 100vw; transition: opacity .25s ease-in-out, transform .25s ease-in-out, visibility .25s ease-in-out; position: absolute; top: 100%; left: 0; transform: scale(.9); } .popover .icon--nav-triangle-borderless { right: 67px; } .popover--large { text-align: center; } .popover[aria-hidden="false"] { visibility: visible; opacity: 1; transition: opacity .4s cubic-bezier(0, 1, .4, 1), transform .4s cubic-bezier(.18, 1.25, .4, 1), visibility .4s linear; transform: scale(1.001); } .popover__inner { padding: 15px 20px 20px; } .popover__inner--no-padding { padding-left: 0 !important; padding-right: 0 !important; } .popover .icon--nav-triangle-borderless { z-index: 2; filter: drop-shadow(0 -2px 2px #0000001f); width: 18px; height: 8px; position: absolute; bottom: 100%; } .popover__header { padding: 12px 0 30px; } .popover__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 20px)); margin-bottom: 4px; } .popover__legend { margin-bottom: 16px; } .popover__secondary-action { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: 16px; } .popover__secondary-action > p { margin-bottom: 0; } @media screen and (max-width: 640px) { .popover__panel-list, .popover__panel { height: 100% !important; } .popover__inner { -webkit-overflow-scrolling: touch; flex-direction: column; justify-content: space-between; height: 100%; display: flex; overflow: auto; } } @media screen and (min-width: 641px) { .popover { border-radius: 3px; width: auto; min-width: 160px; top: calc(100% + 15px); left: auto; right: -2px; box-shadow: 0 1px 5px 2px #0000001a; } .popover .icon--nav-triangle-borderless { right: 27px; } .popover--large { min-width: 320px; } .popover__inner { padding: 15px 25px; } .popover__inner--restrict { max-height: 340px; overflow: auto; } .popover__header { padding-bottom: 15px; } .popover__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); margin-bottom: 8px; } } @media screen and (min-width: 1280px) { .popover { top: calc(100% + 4px); } } .popover__linklist { white-space: nowrap; list-style: none; } .popover__link-item { cursor: pointer; width: 100%; padding: 2px 25px; transition: color .15s ease-in-out, background .15s ease-in-out; display: block; } .popover__link-item:hover { background: var(--accent-background); color: var(--accent-color); } .popover__panel-list { transition: height .2s ease-in-out; position: relative; overflow: hidden; } .popover__panel { visibility: hidden; width: 100%; transition: transform .5s cubic-bezier(.23, 1, .32, 1), visibility .5s cubic-bezier(.23, 1, .32, 1); } .popover__panel--default { transform: translateX(-100%); } .popover__panel--sliding { position: absolute; top: 0; left: 0; transform: translateX(100%); } .popover[aria-hidden="false"] .popover__panel.is-selected { visibility: visible; } .popover__panel.is-selected { transform: translateX(0); } .popover--password .icon--nav-triangle-borderless { right: 21px; } .popover--currency, .popover--locale { min-width: 0; } @media screen and (min-width: 641px) { .popover--password .popover__inner { padding-bottom: 25px; } .popover--password .icon--nav-triangle-borderless { right: calc(50% - 13px); } .popover--currency { top: calc(100% + 3px); right: -27px; } .popover--currency .icon--nav-triangle-borderless { right: 23px; } .popover--locale { top: calc(100% + 3px); right: -26px; } .popover--locale .icon--nav-triangle-borderless { right: 23px; } .popover--logged { right: -47px; } .popover--logged .icon--nav-triangle-borderless { right: 50px; } .popover--unlogged { right: -5px; } .popover--unlogged .icon--nav-triangle-borderless { right: 6px; } } @media screen and (min-width: 1280px) { .popover--password { top: calc(100% + 15px); right: -2px; } .popover--logged { right: -32px; } .popover--logged .icon--nav-triangle-borderless { right: 29px; } .popover--unlogged { right: 0; transform: scale(.9)translateX(calc(50% - 7px)); } .popover--unlogged .icon--nav-triangle-borderless { left: calc(50% - 8px); } .popover--unlogged[aria-hidden="false"] { transform: scale(1)translateX(calc(50% - 7px)); } } .product-gallery { margin-bottom: 12px; position: relative; } .product-gallery__carousel-wrapper { margin-bottom: 25px; position: relative; } .product-gallery__carousel .flickity-viewport { transition: height .2s ease-in-out; } .product-gallery__carousel:not(.flickity-enabled) .product-gallery__carousel-item:not(.is-selected) { display: none; } .product-gallery .flickity-slider { will-change: unset; } .product-gallery__carousel-item { width: 100%; padding: 0 20px; } .product-gallery__carousel-item--hidden, .product-gallery__carousel-item[aria-hidden="true"] .plyr__control { visibility: hidden; } .product-gallery__carousel-item.is-filtered { display: none; } .product-gallery__size-limiter { margin: 0 auto; } .product-gallery__view-in-space { background: rgba(var(--text-color-rgb), .08); border-top-left-radius: 0; border-top-right-radius: 0; } .product-gallery__view-in-space[data-shopify-xr-hidden] { visibility: hidden; } @media screen and (min-width: 1000px) { .product-gallery__view-in-space[data-shopify-xr-hidden] { display: none; } } .product-gallery__view-in-space svg { vertical-align: middle; width: 16px; height: 16px; margin: -1px 8px 0 0; } .product-gallery__zoom-notice { display: none; } .product-gallery__zoom-notice svg { vertical-align: baseline; width: 10px; height: 10px; margin-right: 10px; } .product-gallery__carousel--zoomable ~ .product-gallery__zoom-notice { text-align: center; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); width: 100%; margin: 12px 0 6px; display: block; } @media screen and (max-width: 640px) { .product-gallery__carousel { margin-left: calc(-1 * var(--mobile-container-gutter)); margin-right: calc(-1 * var(--mobile-container-gutter)); } } @media screen and (min-width: 1000px) { .product-gallery__carousel { margin: -4px; } .product-gallery__carousel-item { padding: 4px; } .product-gallery--with-thumbnails { flex-direction: row-reverse; align-items: flex-start; width: 100%; display: flex; } .product-gallery--with-thumbnails .product-gallery__carousel-wrapper { flex: 1 0 auto; margin: 10px 5px 0 42px; } } @media screen and (min-width: 1000px) and (any-hover: hover) { .product-gallery__carousel--zoomable ~ .product-gallery__zoom-notice { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin-top: 26px; } .product-gallery__zoom-notice svg { margin-right: 14px; } } @media screen and (min-width: 1000px) { .product-gallery { margin-bottom: 0; } } @media screen and (hover: none) { .product-gallery__zoom-notice { display: none !important; } } .product-gallery__thumbnail { cursor: pointer; border: 2px solid #0000; border-radius: 3px; width: 60px; margin: 0 4px; padding: 2px; transition: border .2s ease-in-out; display: block; position: relative; } .product-gallery__thumbnail.is-nav-selected { border-color: var(--accent-color); } .product-gallery__thumbnail.is-filtered { display: none; } .product-gallery__thumbnail-badge { z-index: 1; width: 20px; height: 20px; position: absolute; top: 3px; right: 3px; } @media screen and (max-width: 999px) { .product-gallery__thumbnail-list:after, .product-gallery__thumbnail-list:before { content: ""; vertical-align: middle; width: calc(var(--mobile-container-gutter) - 4px); display: inline-block; } .product-gallery__thumbnail { vertical-align: top; display: inline-block; } } @media screen and (min-width: 641px) and (max-width: 999px) { .product-gallery .scroller { margin: 0 -15px; } } @media screen and (min-width: 641px) { .product-gallery__thumbnail { width: 72px; } } @media screen and (min-width: 1000px) { .product-gallery__thumbnail-list { z-index: 1; -ms-overflow-style: none; scrollbar-width: none; overscroll-behavior: contain; width: 96px; max-height: 450px; margin: -2px 0 -2px -3px; position: relative; overflow: auto; } .product-gallery__thumbnail-list::-webkit-scrollbar { -webkit-appearance: none; } .product-gallery__thumbnail { margin: 8px 4px; } } .product-meta { margin: -11px 0 5px; position: relative; } .product-meta__title { margin-bottom: 14px; } .modal .product-meta__title { margin-right: 45px; } .product-meta__label-list { margin-bottom: 17px; font-size: 0; } .product-meta__label-list .product-label + .product-label { margin-left: 5px; } .product-meta__reference { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-bottom: 3px; } .product-meta__reviews-badge { display: block; } .product-meta__vendor { text-transform: uppercase; } .product-meta__vendor + .product-meta__sku:before { content: ""; background: var(--border-color); vertical-align: middle; width: 1px; height: 13px; margin: 0 14px; display: inline-block; position: relative; top: -1px; } .product-meta__share-buttons { justify-content: space-between; align-items: center; margin-top: 40px; display: flex; position: relative; } .product-meta__share-buttons .social-media__item svg { opacity: .35; } .card__separator + .product-meta__share-buttons { margin-top: 0; } .product-meta__button, .product-meta__description, .product-meta__text { margin-bottom: 25px; } .product-meta__reviews-badge .rating__caption { margin-left: 12px; } .product-form__payment-container + .product-meta__description, .product-form__payment-container + .product-meta__text { margin-top: 25px; margin-bottom: 0; } @media screen and (min-width: 641px) { .product-meta__share-buttons { margin-top: 0; } .product-meta__label-list + .product-meta__share-buttons { margin-top: 22px; } .product-meta__reference, .product-meta__reviews-badge { margin-bottom: -2px; } .product-meta__reviews-badge { width: -moz-fit-content; width: fit-content; margin-top: -4px; } .product-meta__reference ~ .product-meta__share-buttons, .product-meta__reviews-badge ~ .product-meta__share-buttons { position: absolute; bottom: 0; right: 0; } .product-meta__reference + .product-meta__reviews-badge { margin-top: 5px; } .product-meta__reviews-badge .rating__caption { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } } .product-form__variants { margin-bottom: 24px; } .product-form__option { margin-bottom: 23px; } .no-js .product-form__option:not(.no-js) { display: none; } .product-form__option-name { margin-bottom: 2px; display: block; } .product-form__selected-value { color: var(--text-color); padding-left: 2px; } .product-form__info-list { border-spacing: 0 22px; width: 100%; margin: -22px 0 6px; display: table; } .product-form__info-item { display: table-row; } .product-form__info-title { vertical-align: baseline; white-space: nowrap; padding-right: 12px; display: table-cell; } .product-form__info-item--quantity > * { vertical-align: middle; padding-top: 6px; } .product-form__info-content { width: 100%; display: table-cell; } .product-form__price-info { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); margin-top: 5px; } .product-form__price-info + .product-form__price-info { margin-top: 0; } .product-form__quantity-with-rules { flex-wrap: wrap; align-items: center; gap: 5px 10px; display: flex; } shopify-payment-terms { margin-top: 8px; display: block; } .product-form .select-wrapper { vertical-align: middle; display: inline-block; } .product-form__quantity { vertical-align: middle; width: 65px; display: inline-block; } .product-form__inventory.inventory:before { margin-right: 14px; } .product-form__payment-container { flex-direction: column; display: flex; } .product-form__status-message { height: 0; margin-top: 18px; transition: height .25s ease-in-out; overflow: hidden; } .product-form .price--compare { top: -2px; } @media screen and (max-width: 640px) { .product-form__payment-container .shopify-payment-button { margin-top: 16px; } } @media screen and (min-width: 641px) { .product-form { margin-top: -8px; } .product-form__option-name { margin-bottom: 7px; } .product-form__variants { margin-bottom: 26px; } .product-form__payment-container { flex-flow: wrap; align-items: flex-start; margin: -9px; } .product-form__payment-container > * { flex: none; width: calc(50% - 18px); margin: 9px; } } .shopify-payment-button__button--unbranded { text-align: center; cursor: pointer; transition: background .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out; display: inline-block; position: relative; background: var(--secondary-button-background) !important; color: var(--secondary-button-text-color) !important; line-height: 48px !important; font-weight: var(--text-font-bolder-weight) !important; font-size: var(--base-text-font-size) !important; border-radius: 2px !important; padding: 0 30px !important; } .shopify-payment-button__button--unbranded:hover { background: rgba(var(--secondary-button-background-rgb), .8) !important; } shopify-accelerated-checkout, shopify-accelerated-checkout-cart { --shopify-accelerated-checkout-button-block-size: 48px; --shopify-accelerated-checkout-button-border-radius: 2px; --shopify-accelerated-checkout-button-box-shadow: none; } .product-block-list__item:empty { display: none; } .product-block-list__item--trust .icon--lock { color: var(--heading-color); width: 18px; height: 24px; } .product-block-list__item--shipping .shipping-estimator { margin-top: -.435em; margin-bottom: 10px; } .product-block-list__item--shipping .shipping-estimator__results { margin-top: 26px; margin-bottom: -10px; } .product__refund-policy-link { justify-content: space-between; align-items: center; width: 100%; display: flex; } .product__refund-policy-link svg { width: 8px; height: 12px; } @media screen and (max-width: 640px) { .product-block-list__item:first-child .card { border-top: none; } } @media screen and (max-width: 999px) { .product-block-list__wrapper { min-height: 0 !important; } .product-block-list__item--info > .card { top: 0 !important; } } @media screen and (min-width: 1000px) { .product-block-list { position: relative; } .product-block-list__wrapper { width: calc(50% - 15px); margin-left: 0; } .product-block-list__item--info { width: calc(50% - 15px); height: 100%; position: absolute; top: 0; right: 0; } } @media screen and (min-width: 1280px) { .product-block-list--medium .product-block-list__wrapper { width: calc(55% - 15px); } .product-block-list--medium .product-block-list__item--info { width: calc(45% - 15px); } .product-block-list--large .product-block-list__wrapper { width: calc(60% - 15px); } .product-block-list--large .product-block-list__item--info { width: calc(40% - 15px); } } .product-info__block-item:empty { display: none !important; } .product-info__block-item--volume-pricing { margin-block-start: 1rem; } .product-info__block-item--volume-pricing .table { margin-inline-start: 0; } .modal .featured-product .card { border: none; } .modal .featured-product .card:first-child { border-right: 1px solid var(--border-color); } @media screen and (min-width: 1000px) { .featured-product { table-layout: fixed; width: 100%; display: table; } .featured-product > * { vertical-align: top; width: 50%; display: table-cell; } .featured-product > :first-child { border-radius: 3px 0 0 3px; } .featured-product > :last-child { border-left: none; border-radius: 0 3px 3px 0; } } .product-label { color: #fff; font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); vertical-align: top; border-radius: 3px; width: max-content; padding: 4px 10px; line-height: 1; display: inline-block; } .product-label--on-sale { background: var(--product-on-sale-accent); color: var(--product-on-sale-color); } .product-label--custom1 { background: var(--product-custom-label-1-background); color: var(--product-custom-label-1-color); } .product-label--custom2 { background: var(--product-custom-label-2-background); color: var(--product-custom-label-2-color); } .price-list { align-items: baseline; line-height: 1; display: inline-flex; } .price { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 24px)); color: var(--accent-color); } .price--highlight { color: var(--product-on-sale-accent); margin-right: .7em; } .price--compare { color: var(--text-color); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); text-decoration: line-through; -webkit-text-decoration-color: rgba(var(--text-color-rgb), .7); text-decoration-color: rgba(var(--text-color-rgb), .7); position: relative; } .inventory { font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); padding-left: 1.4em; line-height: 1.2; display: block; position: relative; } .inventory:before { content: ""; background: currentColor; border-radius: 100%; width: 8px; height: 8px; display: inline-block; position: absolute; top: .45em; left: 0; } .inventory--high { color: var(--product-in-stock-color); } .inventory--low { color: var(--product-low-stock-color); } .inventory-bar { background: var(--border-color); border-radius: 3px; width: 100%; height: 4px; margin: 16px 0 10px; display: block; position: relative; overflow: hidden; } .inventory-bar--hidden { display: none; } .inventory-bar__progress { width: 0; height: 100%; transition: width 1.15s ease-in-out; display: block; position: absolute; top: 0; left: 0; } .inventory--high + .inventory-bar > .inventory-bar__progress { background: var(--product-in-stock-color); } .inventory--low + .inventory-bar > .inventory-bar__progress { background: var(--product-low-stock-color); } @media screen and (min-width: 641px) { .inventory { font-size: 1rem; } .inventory-bar { margin-top: 23px; } } .color-swatch-list { margin: -2px -6px 0; padding-left: 4px; } .color-swatch { vertical-align: middle; margin: 6px; display: inline-block; position: relative; } .color-swatch__radio { opacity: 0; width: 0; height: 0; position: absolute; } .color-swatch__item { cursor: pointer; background-size: cover; width: 18px; height: 18px; display: block; position: relative; } .color-swatch__item svg { display: none; } .color-swatch__item-link { background-color: var(--secondary-background); box-shadow: 0 0 0 1px var(--form-border-color) inset; border-radius: 10px; width: auto; height: 18px; padding-left: 8px; padding-right: 8px; font-size: 12px; line-height: 18px; display: none; position: relative; } .color-swatch__button { vertical-align: middle; } .color-swatch__button--labelled { justify-content: flex-start; align-items: center; display: flex; } .color-swatch__label { vertical-align: middle; margin-left: 14px; display: inline-block; } .color-swatch__radio:checked + .color-swatch__item:after, .color-swatch__button.is-selected .color-swatch__item:after, .color-swatch__item.is-selected:after { content: ""; border: 2px solid var(--accent-color); border-radius: 3px; width: calc(100% + 8px); height: calc(100% + 8px); position: absolute; top: -4px; left: -4px; } .color-swatch__button.is-selected .color-swatch__label { font-weight: var(--text-font-bolder-weight); color: var(--accent-color); } .color-swatch--white .color-swatch__item { box-shadow: 0 0 0 1px var(--form-border-color) inset; } .color-swatch--view-more ~ .color-swatch, .color-swatch--view-more .color-swatch__item { display: none; } .color-swatch--view-more .color-swatch__item-link { display: block; } .color-swatch-list--large { margin: -4px -8px 0; } .color-swatch-list--large .color-swatch { margin: 8px; } .color-swatch-list--large .color-swatch__item { width: 36px; height: 36px; } .color-swatch-list--stack { margin: -3px -7px 0; } .color-swatch-list--stack .color-swatch__item { width: 16px; height: 16px; } .color-swatch-list--stack .color-swatch { margin: 7px; display: block; } .color-swatch--disabled .color-swatch__item:before { content: ""; background: rgba(var(--secondary-background-rgb), .5); width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .color-swatch--disabled svg { z-index: 1; color: #4a4a4a; width: 14px; height: 14px; display: block; position: absolute; top: calc(50% - 7px); left: calc(50% - 7px); } .block-swatch-list { margin: -3px -4px 0; padding-left: 2px; } .block-swatch { margin: 4px; display: inline-block; } .block-swatch__radio { opacity: 0; width: 0; height: 0; position: absolute; } .block-swatch__item { text-align: center; border: 1px solid var(--form-border-color); vertical-align: middle; cursor: pointer; box-shadow: 0 1px 1px rgba(var(--border-color-rgb), .25); border-radius: 3px; padding: 6px 16px 7px; display: block; } .block-swatch__radio:checked + .block-swatch__item, .block-swatch__item.is-selected { box-shadow: 0 0 0 1px var(--accent-color); border-color: var(--accent-color); background: rgba(var(--accent-color-rgb), .06); color: var(--accent-color); } .block-swatch--disabled .block-swatch__item-text { opacity: .5; position: relative; } .block-swatch--disabled .block-swatch__item-text:after { content: ""; background: currentColor; width: calc(100% + 6px); height: 1px; position: absolute; top: calc(50% + 1px); left: -3px; } .variant-swatch-list { margin: -5px -5px -2px -4px; } .variant-swatch { vertical-align: middle; margin: 5px; display: inline-block; } .variant-swatch__radio { opacity: 0; width: 0; height: 0; position: absolute; } .variant-swatch__item { cursor: pointer; border: 2px solid #0000; width: 64px; padding: 2px; display: block; position: relative; overflow: hidden; } .variant-swatch__item svg { display: none; } .variant-swatch__radio:checked + .variant-swatch__item, .variant-swatch__item.is-selected { border-color: var(--accent-color); border-radius: 3px; } .variant-swatch--disabled img { opacity: .5; } .variant-swatch--disabled svg { z-index: 1; color: #4a4a4a; width: 14px; height: 14px; display: block; position: absolute; top: calc(50% - 7px); left: calc(50% - 7px); } .visual-filter-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; display: grid; } .visual-filter { position: relative; } .visual-filter__radio { opacity: 0; width: 0; height: 0; position: absolute; } .visual-filter__item { text-align: center; cursor: pointer; border: 1px solid var(--form-border-color); box-shadow: 0 1px 1px rgba(var(--border-color-rgb), .25); border-radius: 3px; flex-direction: column; align-items: center; row-gap: 12px; padding: 12px 12px 8px; font-size: .9em; line-height: 1.4; display: flex; position: relative; } .visual-filter__item img { width: 32px; } .visual-filter__radio:checked + .visual-filter__item, .visual-filter.is-selected { box-shadow: 0 0 0 1px var(--accent-color); border-color: var(--accent-color); background: rgba(var(--accent-color-rgb), .06); color: var(--accent-color); } .product-item { background: var(--secondary-background); white-space: normal; flex-shrink: 0; min-width: 0; padding: 20px; position: relative; } .product-item:after { content: ""; box-shadow: 1px 0 var(--border-color), 0 1px var(--border-color); z-index: 2; pointer-events: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .product-item__image-wrapper { margin-bottom: 20px; display: block; } .product-item__image-wrapper .placeholder-svg { height: auto; } .product-item__secondary-image { display: none; } .product-item__label-list { z-index: 2; font-size: 0; position: absolute; top: 11px; left: -1px; } .product-item__label-list > .product-label { border-radius: 0 3px 3px 0; margin-bottom: 5px; display: block; } .product-item__info { min-width: 0; } .product-item__price-list:first-child { margin-bottom: 10px; } .product-item__price-list { margin-top: -5px; margin-bottom: -5px; } .product-item__price-list .price { margin-top: 5px; margin-bottom: 5px; display: inline-block; } .product-item__vendor { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); text-transform: uppercase; margin-bottom: 6px; display: block; } .product-item__vendor, .product-item__title { line-height: 1.55; display: block; } .product-item__title { margin-bottom: 12px; } .product-item__title + .product-item__vendor { margin-top: -4px; margin-bottom: 12px; } .product-item__swatch-list { white-space: nowrap; margin: -2px 0 12px; overflow: hidden; } .product-item__price-info { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: 10px; line-height: 1; } .product-item .price { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); } .product-item .price--compare { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } .product-item__reviews-badge { margin-top: 8px; display: block; } .product-item__inventory { margin-top: 10px; } .product-item__inventory:before { top: .3em; } .product-item__inventory { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); } @media screen and (any-hover: hover) { .product-item__image-wrapper--with-secondary .product-item__primary-image, .product-item__image-wrapper--with-secondary .product-item__secondary-image { transition: opacity .2s ease-in-out, visibility .2s ease-in-out; } .product-item__image-wrapper--with-secondary .product-item__secondary-image { object-fit: contain; object-position: center; visibility: hidden; opacity: 0; display: block; } .product-item__image-wrapper--with-secondary:hover .product-item__primary-image { opacity: 0; visibility: hidden; } .product-item__image-wrapper--with-secondary:hover .product-item__secondary-image { visibility: visible; opacity: 1; } } @media screen and (min-width: 641px) { .product-item__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } .product-item--vertical .price:not(.price--compare), .product-item--list .price:not(.price--compare) { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 20px)); } } @media screen and (min-width: 1000px) { .product-item__label-list { left: 0; } } .product-item--vertical .product-item__action-list, .product-item--horizontal .product-item__action-list { margin: 20px 0 5px; } .product-item--vertical .product-item__action-button, .product-item--horizontal .product-item__action-button { padding-left: 10px; padding-right: 10px; } .product-item--vertical .product-item__action-list--list-view-only, .product-item--vertical .product-item__action-button--list-view-only, .product-item--horizontal .product-item__action-list--list-view-only, .product-item--horizontal .product-item__action-button--list-view-only { display: none; } .product-item--vertical .product-item__action-button--list-view-only + .product-item__action-button, .product-item--horizontal .product-item__action-button--list-view-only + .product-item__action-button { margin-top: 0; } @media screen and (min-width: 1000px) { .product-item--vertical .product-item__action-list { margin: 15px -5px -5px; } .product-item--vertical .product-item__action-button { flex: 1 0 auto; margin: 5px !important; } } .product-item--horizontal, .product-item--list { display: flex; } .product-item--horizontal .product-item__info, .product-item--list .product-item__info { flex: 1 0 0; padding: 4px 0; } .product-item--horizontal .product-item__image-wrapper, .product-item--list .product-item__image-wrapper { flex: none; width: 120px; margin: 0 20px 0 0; } .product-item--horizontal .product-item__action-list, .product-item--list .product-item__action-list { align-self: center; } .product-item--horizontal .spr-starrating.spr-starrating { height: 11px; } .product-item--horizontal .spr-starrating .spr-icon.spr-icon { width: 11px; height: 11px; } @media screen and (max-width: 640px) { .product-item--horizontal, .product-item--list { width: 100% !important; } .product-list--collection .product-item__label-list, .product-list--stackable .product-item__label-list { left: 0; } .product-list--collection .rating__star, .product-list--stackable .rating__star { width: 11px; height: 11px; } } @media screen and (min-width: 641px) { .product-item--horizontal .product-item__image-wrapper { width: 110px; margin-right: 20px; } .product-item--horizontal .product-item__info { flex: 1 0 0; } } @media screen and (max-width: 640px) { .product-item__action-list { margin-top: 20px; } } @media screen and (min-width: 641px) { .product-item--list { align-items: center; padding-right: 25px; width: 100% !important; } .product-item--list .product-item__title { font-size: 1rem; } .product-item--list .product-item__image-wrapper { width: 180px; margin-right: 30px; } .product-item--list .product-item__info { flex: 1 0 0; justify-content: space-between; margin: 15px 0; display: flex; } .product-item--list .product-item__action-list { min-width: 180px; margin-left: 30px; display: flex; } } .product-item--compact .product-item__info { padding-top: 0; } .product-item--compact .product-item__price-list:first-child { margin-bottom: 8px; } .product-item--compact .product-item__reviews-badge { margin: 15px 0; } .complementary-product-list { scroll-snap-type: x mandatory; scrollbar-width: none; grid-auto-columns: min(74vw, 400px); grid-auto-flow: column; align-items: start; column-gap: 40px; margin-inline-start: -20px; margin-inline-end: -20px; padding-inline-start: 20px; padding-inline-end: 20px; scroll-padding-inline: 20px; display: grid; overflow: auto; } .complementary-product-list:after { content: ""; } .complementary-product-list::-webkit-scrollbar { display: none; } .product-item--complementary { scroll-snap-align: start; scroll-snap-stop: always; flex-wrap: wrap; padding: 0; } .product-item--complementary:after { display: none; } .product-item--complementary .product-item__image-wrapper { width: 80px; } .product-item--complementary > .product-item__action-list { width: 100%; margin-bottom: 0; } @media screen and (min-width: 641px) { .complementary-product-list { border: 1px solid var(--border-color); grid: none; margin-inline-start: 0; margin-inline-end: 0; padding-inline-start: 0; padding-inline-end: 0; scroll-padding-inline: 0; } .complementary-product-list::-webkit-scrollbar { display: none; } .complementary-product-list:after { content: "flickity"; display: none; } .product-item--complementary { width: 50%; padding: 20px; } } .promo-block { border-radius: 3px; min-height: 240px; padding: 20px 24px; display: flex; position: relative; overflow: hidden; } .promo-block--small { min-height: 220px; } .promo-block--large { min-height: 260px; } .promo-block--top-left, .promo-block--top-center, .promo-block--top-right { align-items: flex-start; } .promo-block--middle-left, .promo-block--middle-center, .promo-block--middle-right { align-items: center; } .promo-block--bottom-left, .promo-block--bottom-center, .promo-block--bottom-right { align-items: flex-end; } .promo-block--top-right, .promo-block--middle-right, .promo-block--bottom-right { text-align: right; justify-content: flex-end; } .promo-block--top-center, .promo-block--middle-center, .promo-block--bottom-center { text-align: center; justify-content: center; } .promo-block--top-left, .promo-block--middle-left, .promo-block--bottom-left { text-align: left; justify-content: flex-start; } .promo-block__image-clip, .promo-block__image-wrapper { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .promo-block__image-clip { overflow: hidden; } .promo-block__image-wrapper { background-position: right calc(100% + 15px); background-repeat: no-repeat; background-size: auto 185px; transition: opacity .2s ease-in-out, background-position .35s ease-in-out; } .promo-block__image-wrapper--cover { transition: opacity .2s ease-in-out, transform 1.2s ease-in-out; transform: scale(1.01); background-position: center !important; background-size: cover !important; } .promo-block__inner { z-index: 1; position: relative; } .promo-block__content { margin-bottom: 1em; } .promo-block__heading { color: inherit; margin-bottom: 3px; } .promo-block__cta { margin-top: 3px; } .promo-block--small .promo-block__image-wrapper { background-size: auto 155px; } .promo-block--overlay:before { content: ""; z-index: 1; background: linear-gradient(to top, #0000 15%, #00000080); width: 100%; height: 100%; position: absolute; top: 0; left: 0; } @media screen and (any-hover: hover) { .promo-block__image-wrapper { background-position: right calc(100% + 35px); } .promo-block:hover .promo-block__image-wrapper { background-position: right calc(100% + 15px); } .features--animate-zoom .promo-block:hover .promo-block__image-wrapper--cover { transform: scale(1.07); } } @media screen and (min-width: 641px) { .promo-block { min-height: 270px; padding: 26px 30px; } .promo-block--small { min-height: 240px; } .promo-block--large { min-height: 300px; } } @media screen and (min-width: 1000px) { .promo-block { min-height: 310px; } .promo-block--small { min-height: 280px; } .promo-block--large { min-height: 360px; } .promo-block__image-wrapper { background-size: auto 260px; } .promo-block--small .promo-block__image-wrapper { background-size: auto 220px; } .promo-block__heading { margin-bottom: 8px; } .promo-block__cta { margin-top: 8px; } } .rte { word-break: break-word; } .rte:after { content: ""; clear: both; display: block; } .rte h1, .rte h2, .rte h3, .rte h4, .rte h5, .rte h6 { font-family: var(--heading-font-family); font-weight: var(--heading-font-weight); font-style: var(--heading-font-style); color: var(--heading-color); margin: 1em 0; } .rte h1:first-child, .rte h2:first-child, .rte h3:first-child, .rte h4:first-child, .rte h5:first-child, .rte h6:first-child { margin-top: 0; } .rte h1 { margin: 1.4em 0 .7em; } .rte h2 { margin: 1.55em 0 .6em; } .rte h3 { margin: 1.8em 0 .8em; } .rte h4 { margin: 1.9em 0 .6em; } .rte h5 { margin: 2.2em 0 .7em; } .rte h6 { margin: 2.5em 0 .6em; } .rte p:not(:last-child), .rte ul:not(:last-child), .rte ol:not(:last-child) { margin-bottom: .7em; } .rte a:not(.button) { color: var(--link-color); -webkit-text-decoration: var(--text-link-decoration); text-decoration: var(--text-link-decoration); text-underline-position: under; transition: color .2s ease-in-out; } .rte a:not(.button):hover { color: var(--link-color-hover); } .rte p + .button { margin-top: 1em; } .rte ul, .rte ol { margin-left: 18px; } .rte ul li, .rte ol li { position: relative; } .rte ul li:not(:last-child), .rte ol li:not(:last-child) { margin-bottom: 5px; } .rte ul { list-style: none; } .rte ul li:before { content: ""; background: rgba(var(--text-color-rgb), .4); border-radius: 100%; width: 5px; height: 5px; position: absolute; top: .8em; left: -18px; } .rte ol { list-style-position: outside; } .rte img { margin: 1em 0; } .rte .video-wrapper { margin: 2.7em 0; } .rte blockquote { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); border-left: 5px solid rgba(var(--text-color-rgb), .4); margin: 3em 0 3em 10px; padding-left: 20px; } .rte table { margin-top: 2em; } @media screen and (min-width: 641px) { .rte blockquote { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); padding-left: 30px; } .rte .video-wrapper { margin: 3em 0; } } .section { margin: 50px 0; } .section--tight { margin: 30px 0; } .section--isolated { padding: 50px 0; margin: 0 !important; } .section--isolated.section--tight { padding: 40px 0; } .section--text-centered { text-align: center; } .section__header { justify-content: space-between; align-items: baseline; margin-bottom: 15px; display: flex; overflow: hidden; } .section__title { margin-bottom: 0; } .section__action-link { font-weight: var(--text-font-bolder-weight); color: var(--accent-color); flex-shrink: 0; margin-left: 20px; } .section__action-link svg { display: none; } .section__header-stack { flex-direction: column; display: flex; } .section--isolated .heading { color: inherit; } @media screen and (max-width: 640px) { .section__header-stack > .section__title + * { margin-top: 10px; } } @media screen and (min-width: 641px) { .section { margin: 60px 0; } .section--tight { margin: 40px 0; } .section--isolated { padding: 60px 0; } .section__header { margin-bottom: 20px; overflow: visible; } .section__header--tight { margin-bottom: 14px; } .section__header-stack { flex-direction: row; align-items: center; } .section__action-link { transition: transform .35s cubic-bezier(.645, .045, .355, 1); transform: translateX(26px); } .section__action-link svg { vertical-align: -2px; opacity: 0; width: 14px; height: 14px; margin-left: 8px; transition: all .35s cubic-bezier(.645, .045, .355, 1); display: inline-block; position: relative; right: -5px; } .section__header-stack > .section__title { margin: 0 16px 0 0; } } @media screen and (any-hover: hover) { .section__action-link:hover { transform: translateX(0); } .section__action-link:hover svg { opacity: 1; right: 0; } } .slideshow { height: 400px; overflow: hidden; } .slideshow--small { height: 350px; } .slideshow--large { height: 450px; } .slideshow__slide { width: 100%; height: 100%; display: block; position: relative; } .slideshow__slide-inner { text-align: center; background-position: center; background-size: cover; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 100%; display: flex; position: absolute; top: 0; left: 0; } .slideshow:not(.flickity-enabled) .slideshow__slide:not(.is-selected) { display: none; } .slideshow__placeholder { z-index: -1; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .slideshow__image { width: 100%; } .slideshow__image-placeholder { fill: #696969; background: #a9a9a9; height: 100%; } .slideshow__title { color: inherit; margin-bottom: 7px; } .slideshow__content-wrapper { z-index: 1; width: 100%; padding-top: 40px; padding-bottom: 25px; position: relative; } .slideshow__content { max-width: 650px; margin: 0 auto 22px; } .slideshow .flickity-page-dots { bottom: 30px; } .slideshow .flickity-page-dots .dot { background: #fff; border: 3px solid #fff; width: 12px; height: 12px; margin: 0 8px; transition: background .25s ease-in-out; transform: none !important; } .slideshow .flickity-page-dots .dot:before { top: -10px; bottom: -10px; left: -10px; right: -10px; } .slideshow .flickity-page-dots .dot.is-selected { background: none; } .slideshow__slide--overlay:before { content: ""; z-index: 1; background: linear-gradient(#0000, #0000004d); width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .slideshow--preserve-ratio { height: auto !important; } .slideshow--preserve-ratio .slideshow__slide { height: auto; } .slideshow--preserve-ratio .slideshow__slide-inner { width: auto; height: auto; display: block; position: relative; } .slideshow--preserve-ratio .slideshow__content-wrapper { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media screen and (min-width: 641px) { .slideshow:not(.slideshow--edge2edge) { margin: var(--desktop-container-gutter) 0; } .slideshow:not(.slideshow--edge2edge) .flickity-viewport { border-radius: 3px; } .slideshow__image-placeholder { width: 100%; height: auto; } .slideshow__slide-inner--top-left, .slideshow__slide-inner--top-center, .slideshow__slide-inner--top-right { justify-content: flex-start; } .slideshow__slide-inner--bottom-left, .slideshow__slide-inner--bottom-center, .slideshow__slide-inner--bottom-right { justify-content: flex-end; } .slideshow__slide-inner--bottom-left .slideshow__content-wrapper, .slideshow__slide-inner--bottom-center .slideshow__content-wrapper, .slideshow__slide-inner--bottom-right .slideshow__content-wrapper { padding-top: 25px; padding-bottom: 75px; } .slideshow__slide-inner--top-left, .slideshow__slide-inner--middle-left, .slideshow__slide-inner--bottom-left { text-align: left; } .slideshow__slide-inner--top-left .slideshow__content, .slideshow__slide-inner--middle-left .slideshow__content, .slideshow__slide-inner--bottom-left .slideshow__content { margin-left: 0; } .slideshow__slide-inner--top-right, .slideshow__slide-inner--middle-right, .slideshow__slide-inner--bottom-right { text-align: right; } .slideshow__slide-inner--top-right .slideshow__content, .slideshow__slide-inner--middle-right .slideshow__content, .slideshow__slide-inner--bottom-right .slideshow__content { margin-right: 0; } .slideshow--preserve-ratio .slideshow__slide-inner--top-left .slideshow__content-wrapper, .slideshow--preserve-ratio .slideshow__slide-inner--top-center .slideshow__content-wrapper, .slideshow--preserve-ratio .slideshow__slide-inner--top-right .slideshow__content-wrapper { top: 0; transform: translateX(-50%); } .slideshow--preserve-ratio .slideshow__slide-inner--bottom-left .slideshow__content-wrapper, .slideshow--preserve-ratio .slideshow__slide-inner--bottom-center .slideshow__content-wrapper, .slideshow--preserve-ratio .slideshow__slide-inner--bottom-right .slideshow__content-wrapper { top: auto; bottom: 0; transform: translateX(-50%); } } @media screen and (min-width: 1000px) { .slideshow { height: 430px; } .slideshow--small { height: 380px; } .slideshow--large { height: 520px; } } .store-availability-container { margin-top: 26px; } .store-availability-information { align-items: baseline; display: flex; } .icon--store-availability-in-stock, .icon--store-availability-out-of-stock { width: 18px; height: 14px; position: relative; } .store-availability-information .icon--store-availability-in-stock { top: 2px; } .store-availability-information .icon--store-availability-out-of-stock { top: 3px; } .store-availability-information-container { margin-left: 10px; } .store-availability-information__title, .store-availability-list__location { margin-bottom: -2px; } .store-availability-information__stock { margin-bottom: 4px; } .store-availability-information__stock, .store-availability-list__item-info { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); } .store-availability-list__item + .store-availability-list__item { border-top: 1px solid var(--border-color); margin-top: 22px; padding-top: 20px; } .store-availability-list__stock { margin-bottom: 2px; } .store-availability-list__stock svg { margin-right: 3px; } .store-availability-list__contact { line-height: 1.45; } .store-availability-list__stock .icon--store-availability-in-stock { top: -1px; } .store-availability-list__contact p { margin-bottom: 0; } .team { text-align: center; margin-top: 45px; margin-bottom: 62px; } .team__block-list { margin-bottom: 45px; } .team__block-item { margin-bottom: 20px; } @media screen and (min-width: 641px) { .team { margin-top: 62px; margin-bottom: 80px; } .team__block-list { flex-wrap: wrap; justify-content: center; margin: -15px -15px 47px; display: flex; } .team__block-item { flex: none; width: calc(50% - 30px); margin: 15px; } } @media screen and (min-width: 1000px) { .team__block-item { width: calc(33.3333% - 30px); } } @media screen and (min-width: 1280px) { .team__block-item { width: calc(25% - 30px); } } .team__section-title { margin-bottom: 25px; } @media screen and (min-width: 641px) { .team__section-title { margin-bottom: 40px; } } .team__member { border: 1px solid var(--border-color); background: var(--secondary-background); border-radius: 3px; padding: 30px 20px 20px; } .team__member-pic { border: 1px solid var(--border-color); background: var(--background); width: 144px; margin-bottom: 20px; padding: 8px; } .team__member-pic--rounded { border-radius: 50%; } .team__member-title, .team__member-subheading { margin-bottom: 0; line-height: 1.4; } .team__member-title { margin-bottom: 6px; } .team__member-link { margin-top: 6px; display: inline-block; } .team__promotion { border-radius: 3px; flex-direction: column; justify-content: center; align-items: center; padding: 30px; display: flex; } .team__promotion .heading { color: inherit; margin-bottom: 8px; } .team__promotion .button { min-width: 105px; margin-top: 22px; } .text-with-icons__item { width: 100%; line-height: 1.6; } .text-with-icons__title { margin-bottom: 4px; } .text-with-icons__icon-wrapper { margin-bottom: 15px; } .text-with-icons__icon-wrapper svg { vertical-align: middle; width: 30px; height: 30px; } .text-with-icons__icon-wrapper img { max-width: 30px; } .text-with-icons__content > p { margin-bottom: 0; } @media screen and (max-width: 640px) { .text-with-icons { text-align: center; padding-bottom: 28px; } .text-with-icons:after { content: "flickity"; display: none; } .text-with-icons--stacked { padding-bottom: 0; } .text-with-icons--stacked .text-with-icons__item:not(:last-child) { margin-bottom: 34px; } .text-with-icons--stacked:after { content: ""; } } @media screen and (min-width: 641px) { .text-with-icons { flex-wrap: wrap; margin: 0 -40px -45px; display: flex; } .page__header + .text-with-icons { margin-top: -5px; } .text-with-icons__item { flex-basis: calc(50% - 90px); margin: 0 40px 45px; display: flex; } .text-with-icons__icon-wrapper { margin: .5em 18px 0 0; } } @media screen and (min-width: 1000px) { .text-with-icons { justify-content: center; padding: 0 100px; } .text-with-icons__item { flex-basis: calc(50% - 140px); display: flex; } } @media screen and (min-width: 1280px) { .text-with-icons { flex-wrap: nowrap; justify-content: space-around; margin: 0 -35px; padding: 0; } .text-with-icons__item { flex-basis: calc(25% - 70px); margin: 0 35px; } } .text-with-icons--boxed { text-align: center; border: 1px solid var(--border-color); border-radius: 3px; padding-bottom: 0; display: block; } .text-with-icons--boxed .text-with-icons__item { text-align: center; padding: 28px 35px; display: block; } .text-with-icons--boxed .text-with-icons__item:not(:first-child) { border-top: 1px solid var(--border-color); } .text-with-icons--boxed .text-with-icons__icon-wrapper { margin: 0 0 1em; } @media screen and (min-width: 641px) { .text-with-icons--boxed { flex-wrap: nowrap; margin: 0; padding: 0; display: flex; } .text-with-icons--boxed .text-with-icons__item { flex: 1 0 0; margin: 0; } .text-with-icons--boxed .text-with-icons__item:not(:first-child) { border-top: none; border-left: 1px solid var(--border-color); } } .clearfix:before, .clearfix:after { content: ""; display: table; } .text-center { text-align: center; } .skip-to-content:focus { clip: auto; color: var(--text-color); background-color: var(--secondary-background); opacity: 1; z-index: 10000; width: auto; height: auto; margin: 0; padding: 10px; transition: none; } .list--unstyled { list-style: none; } .collapsible { height: 0; transition: height .2s ease-in-out; overflow: hidden; } .social-media__item-list { flex-wrap: wrap; margin: -5px; display: flex; } .social-media__item { margin: 5px; display: inline-block; } .social-media__item > a { display: block; } .social-media__item svg { opacity: .4; will-change: opacity; width: 28px; height: 28px; transition: color .25s ease-in-out, opacity .25s ease-in-out; } .social-media__item-list--stack { margin: -10px 0; display: block; } .social-media__item-list--stack .social-media__item { margin: 0; padding: 7px 0; display: block; } .social-media__item-list--stack svg { vertical-align: top; margin-right: 12px; } @media screen and (any-hover: hover) { .social-media__item:hover svg { opacity: 1; } .social-media__item--facebook:hover svg { color: #3b5998; } .social-media__item--twitter:hover svg { color: #1da1f2; } .social-media__item--pinterest:hover svg { color: #bd081c; } .social-media__item--instagram:hover svg { color: #d83776; } .social-media__item--youtube:hover svg { color: red; } .social-media__item--tiktok:hover svg { color: #fd355a; } .social-media__item--vimeo:hover svg { color: #1ab7ea; } .social-media__item--linkedin:hover svg { color: #0077b5; } .social-media__item--snapchat:hover svg { color: #f5dc30; } .social-media__item--tumblr:hover svg { color: #35465c; } .social-media__item--fancy:hover svg { color: #494e58; } .social-media__item--rss:hover svg { color: #f26522; } } .alert { white-space: normal; word-break: break-all; word-break: break-word; background: var(--background); color: var(--heading-color); text-align: left; border-radius: 2px; margin-bottom: 20px; padding: 12px 20px; font-size: 1rem; display: block; } .alert:last-child { margin-bottom: 0; } .alert--block { display: block; } .alert--center { text-align: center; } .alert--tight { padding: 6px 14px; } .alert--error { background: var(--error-background); color: var(--error-color); } .alert--success { background: var(--success-background); color: var(--success-color); } .alert__ribbon { align-self: center; margin-left: 5px; margin-right: 25px; } .alert__ribbon svg { width: 24px; height: 24px; display: block; } .alert__error-list { list-style: none; } .alert a { text-decoration: underline; transition: color .2s ease-in-out; } .pagination { color: var(--heading-color); font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); border-top: 1px solid var(--border-color); padding: 40px 0; } .pagination__inner { position: relative; } .pagination__prev, .pagination__next { align-items: center; height: 100%; display: flex; position: absolute; top: 0; } .pagination__prev svg, .pagination__next svg { width: 8px; height: 12px; position: relative; } .pagination__prev { left: 0; } .pagination__prev svg { margin-right: 14px; } .pagination__next { right: 0; } .pagination__next svg { margin-left: 14px; } .pagination__nav, .pagination__page-count { text-align: center; display: block; } .pagination__nav { display: none; } .pagination__nav-item { margin: 0 2px; padding: 8px 11px; line-height: 1; display: inline-block; } .pagination__nav-item.is-active { background: var(--primary-button-background); color: var(--primary-button-text-color); border-radius: 3px; } .card .pagination { padding: 20px; } @media screen and (min-width: 641px) { .pagination__nav { display: block; } .pagination__page-count { display: none; } .card .pagination { padding: 20px 30px; } } @media screen and (max-width: 999px) { .scroller { margin: 0 calc(-1 * var(--mobile-container-gutter)); overflow: hidden; } .scroller--flush { margin: 0 !important; } .scroller__inner { -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; white-space: nowrap; margin-bottom: -20px; padding-bottom: 20px; overflow: auto hidden; } } @media screen and (min-width: 641px) and (max-width: 999px) { .scroller { margin: 0 calc(-1 * var(--desktop-container-gutter)); } .scroller__inner { scroll-padding-left: var(--desktop-container-gutter); } .scroller--mobile-only { margin: 0; overflow: visible; } .scroller--mobile-only > .scroller__inner { margin-bottom: 0; padding-bottom: 0; overflow: visible; } } @keyframes skeletonShimmerAnimation { 0% { opacity: .45; } 100% { opacity: .9; } } .skeleton-container { will-change: opacity; animation: 1s linear infinite alternate skeletonShimmerAnimation; } .skeleton-text { background: var(--border-color); width: 100%; height: 10px; } .skeleton-image { background: var(--border-color); width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .skeleton-paragraph .skeleton-text { margin-bottom: 8px; } .skeleton-paragraph .skeleton-text:last-child { width: 38%; margin-bottom: 0; } .plus-button { width: 10px; height: 10px; display: block; position: relative; top: calc(50% - 5px); right: 0; } .plus-button:before, .plus-button:after { content: ""; background-color: currentColor; transition: transform .35s ease-in-out, opacity .35s ease-in-out; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)rotate(-90deg); } .plus-button:before { opacity: 1; width: 10px; height: 2px; } .plus-button:after { width: 2px; height: 10px; } [aria-expanded="true"] .plus-button:before, [aria-expanded="true"] .plus-button:after { transform: translate(-50%, -50%)rotate(90deg); } [aria-expanded="true"] .plus-button:before { opacity: 0; } @media screen and (min-width: 641px) { .plus-button--large { width: 14px; height: 14px; } .plus-button--large:before { width: 14px; } .plus-button--large:after { height: 14px; } } .shopify-challenge__container { text-align: center; margin-top: 50px; margin-bottom: 50px; } .shopify-challenge__button.shopify-challenge__button { border-color: var(--primary-button-background); text-align: center; line-height: normal; font-weight: var(--text-font-bolder-weight); font-size: var(--base-text-font-size); cursor: pointer; background: var(--primary-button-background); color: var(--primary-button-text-color); border-radius: 2px; min-height: 48px; padding: 9px 30px; transition: background .25s ease-in-out, color .25s ease-in-out, border .25s ease-in-out; display: inline-block; position: relative; } .shopify-challenge__button.shopify-challenge__button:hover { background: rgba(var(--primary-button-background-rgb), .8); } @media screen and (min-width: 641px) { .shopify-challenge__container { margin-top: 100px; margin-bottom: 100px; } } .shopify-policy__container { max-width: 800px; } .shopify-policy__title { margin: 30px 0; } .shopify-policy__title h1 { font-family: var(--heading-font-family); font-weight: var(--heading-font-weight); font-style: var(--heading-font-style); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 24px)); color: var(--heading-color); margin-bottom: 0; line-height: 1.45; } @media screen and (min-width: 641px) { .shopify-policy__title { margin: 30px 0; } .shopify-policy__title h1 { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 28px)); line-height: 1.45; } } .announcement-bar { font-weight: var(--text-font-bolder-weight); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); border-bottom: 1px solid var(--header-border-color); display: block; position: relative; } .announcement-bar__content { margin-bottom: 0; padding: 4px 0; display: block; } .announcement-bar__content--center { text-align: center; } @media screen and (max-width: 640px) { .announcement-bar__inner { text-align: center; } } @media screen and (min-width: 641px) { .announcement-bar { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); text-align: left; } .announcement-bar__inner { align-items: center; display: flex; } .announcement-bar__content { margin-right: auto; padding: 7px 0; } .announcement-bar__content--center { padding-left: var(--announcement-bar-button-width, 0px); margin-left: auto; } .announcement-bar__button { background: var(--header-accent-color); color: var(--secondary-background); box-shadow: 0 1px var(--header-accent-color); padding: 7px 18px 7px 15px; } .announcement-bar__button svg { vertical-align: text-bottom; width: 20px; height: 17px; margin-right: 12px; display: inline-block; } .announcement-bar__close-container { position: relative; } .announcement-bar__close { color: var(--heading-color); transition: color .2s ease-in-out; position: absolute; top: 25px; right: 0; } .announcement-bar__close:hover { color: var(--accent-color); } .announcement-bar__close svg { width: 19px; height: 19px; } .announcement-bar__newsletter { visibility: hidden; text-align: center; height: 0; transition: height .5s cubic-bezier(.77, 0, .175, 1), visibility .5s cubic-bezier(.77, 0, .175, 1); overflow: hidden; } .announcement-bar__newsletter[aria-hidden="false"] { visibility: visible; } .announcement-bar__newsletter-inner { margin: 50px 0; } } .offer-item { background: var(--secondary-background); border: 1px solid var(--border-color); border-radius: 3px; padding: 20px; } .offer-item__image-wrapper { min-width: 70px; max-width: 70px; margin-bottom: 14px; } .offer-item__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 17px)); margin-bottom: 6px; } .offer-item__content { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 14px)); } @media screen and (min-width: 641px) { .offer-item { padding: 28px 30px; } .offer-item__image-wrapper { min-width: 110px; max-width: 110px; } } @media screen and (min-width: 1280px) { .offer-item--inline { align-items: center; display: flex; } .offer-item--inline .offer-item__image-wrapper { margin: 0 30px 0 0; } } .image-with-text { flex-direction: column; display: flex; } .image-with-text__image-container { margin-bottom: 25px; } @media screen and (max-width: 999px) { .image-with-text__image-container { order: -1; width: 100% !important; } } @media screen and (min-width: 1000px) { .image-with-text { flex-direction: row; justify-content: center; align-items: center; } .image-with-text__image-container { min-width: 30%; max-width: 50%; } .image-with-text__image-container, .image-with-text__text-container { width: 50%; margin: 0; } .image-with-text__text-container:last-child { padding-left: 60px; } .image-with-text__text-container:first-child { text-align: right; padding-right: 60px; } .image-with-text__text-container:first-child .image-with-text__text-aligner { text-align: left; display: inline-block; } } @media screen and (min-width: 1000px) { .image-with-text__image-container { min-width: 0; max-width: none; } } @media screen and (min-width: 1280px) { .image-with-text__text-container:last-child { padding-left: 75px; } .image-with-text__text-container:first-child { padding-right: 75px; } } .newsletter { margin-top: 30px; } .newsletter__form { padding-bottom: 10px; } .newsletter__text { margin-top: 16px; } .newsletter--compact .newsletter__form { padding-bottom: 0; } .newsletter--compact .newsletter__text { margin-top: 16px; } .quick-links { text-align: center; background: var(--secondary-background); border: 1px solid var(--border-color); font-size: calc(var(--default-text-font-size) + 1px); border-radius: 3px; flex-wrap: wrap; list-style: none; display: flex; } .quick-links__link { box-shadow: 1px 0 var(--border-color), 0 1px var(--border-color); word-break: break-all; word-break: break-word; -webkit-hyphens: auto; hyphens: auto; text-transform: none; flex: none; justify-content: center; align-items: center; width: 50%; padding: 20px 10px; transition: color .2s ease-in-out; display: flex; } .quick-links__link:hover { color: var(--accent-color); } .quick-links__link--grow { flex-grow: 1; } .quick-links__image-container { flex: auto; margin: 0 auto; font-size: 0; display: block; } .quick-links__image-ie-fix { margin: 0 auto; transition: transform .3s ease-in-out; } @media screen and (any-hover: hover) { .features--animate-zoom .quick-links__link:hover .quick-links__image-ie-fix { transform: scale(1.05); } } @media screen and (min-width: 641px) { .quick-links__link { width: 33.3333%; padding: 24px; } } @media screen and (min-width: 1000px) { .quick-links__link { width: 16.6667%; } } .breadcrumb__list { align-items: center; list-style: none; display: flex; } .breadcrumb__list svg { vertical-align: inherit; width: 6px; height: 8px; margin: 0 7px; } .loading-bar { opacity: 0; background: var(--accent-color); transform-origin: 0; z-index: 50; pointer-events: none; width: 100%; height: 3px; transition: transform .25s ease-in-out; position: fixed; top: 0; left: 0; transform: scaleX(0); } .loading-bar.is-visible { opacity: 1; } .empty-state { text-align: center; margin: 100px 0; } .empty-state--extra-tight { margin: 30px 0; } .empty-state--tight { margin: 40px 0; } .empty-state__heading { margin-bottom: 15px; } .empty-state__text { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); margin-bottom: 32px; } .empty-state__quick-form { max-width: 410px; margin: 40px auto 25px; } .empty-state__button-container { margin-top: 16px; } .empty-state__button { min-width: 230px; } .empty-state__icon { margin-bottom: 6px; display: inline-block; position: relative; } .empty-state__icon .icon--package { width: 46px; height: 46px; } .empty-state__icon .icon--address { width: 46px; height: 45px; } .empty-state__icon-description { margin-bottom: 30px; } .empty-state__count { line-height: 20px; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); font-weight: var(--text-font-bolder-weight); text-align: center; background: var(--accent-color); color: var(--header-text-color); border-radius: 100%; width: 20px; height: 20px; position: absolute; top: 2px; right: -9px; } @media screen and (min-width: 641px) { .empty-state { margin: 170px 0; } .empty-state--extra-tight { margin: 40px 0; } .empty-state--tight { margin: 105px 0; } } .payment-list { flex-wrap: wrap; margin: -4px; display: flex; } .payment-list__item { width: 38px; height: 24px; margin: 4px; } .payment-list__notice { margin-top: 18px; } .payment-list--centered { justify-content: center; } .layout { margin-bottom: 70px; } .layout .layout { margin-top: 18px; margin-bottom: 0; } .layout__section { margin-bottom: 18px; } .layout .card:last-child { margin-bottom: 0; } @media screen and (max-width: 999px) { .layout--reverse { flex-direction: column-reverse; display: flex; } } @media screen and (min-width: 641px) { .layout { margin-bottom: 100px; } .layout .layout { margin-top: 30px; } } @media screen and (min-width: 1000px) { .layout { margin-left: -15px; margin-right: -15px; display: flex; } .layout--pad { padding-top: 25px; } .layout__section { flex: 1 0 0; margin: 0 15px; } .layout__section:only-child { max-width: 680px; margin-left: auto; margin-right: auto; } .layout__section--secondary { flex: none; width: 260px; } .layout__section--large-secondary { flex: none; width: 320px; } } @media screen and (min-width: 1280px) { .layout__section--secondary { width: 288px; } .layout__section--large-secondary { width: 365px; } } .modal { z-index: 10; visibility: hidden; pointer-events: none; opacity: 0; transition: opacity .2s ease-in-out, visibility .2s ease-in-out, overlay 1s allow-discrete; background: none; border: none; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0 auto; padding: 0; position: fixed; top: 0; left: 0; } .modal:before { content: ""; pointer-events: none; background: #00000059; width: 100%; height: 100%; position: fixed; top: 0; left: 0; } .modal[aria-hidden="false"] { visibility: visible; opacity: 1; pointer-events: auto; } .modal[aria-hidden="false"] .modal__dialog { transition: transform .4s cubic-bezier(.18, 1.25, .4, 1), visibility .4s linear; transform: scale(1); } .modal__dialog { background: var(--secondary-background); -webkit-overflow-scrolling: touch; width: 100%; height: 100%; max-height: 100vh; transition: transform .25s ease-in-out, visibility .25s ease-in-out; position: absolute; overflow: auto; transform: scale(.9); box-shadow: 0 1px 2px #0000004d; } .modal__loader { text-align: center; padding: 60px 0; display: none; } .modal__loader .icon--search-loader { color: var(--accent-color); width: 35px; height: 35px; } .modal__header { border-bottom: 1px solid var(--border-color); background: var(--secondary-background); z-index: 1; justify-content: space-between; align-items: center; display: flex; position: sticky; top: 0; } .modal__header, .modal__content { padding: 20px; } .modal__header + .modal__content { padding-top: 30px; } .modal__title { text-align: center; margin-bottom: 0; } .modal__description { text-align: center; margin-bottom: 30px; display: block; } .modal__close { color: var(--heading-color); z-index: 1; } .modal__close svg { width: 20px; height: 20px; display: block; } .modal .card { background: none; } .modal.is-loading .modal__loader { display: block; } .modal.is-loading .modal__inner { display: none; } @media screen and (max-width: 640px) { .modal__content--ios-push { padding-bottom: 45px; } } @media screen and (min-width: 641px) { .modal { justify-content: center; align-items: center; display: flex; } .modal__dialog { border-radius: 3px; width: 580px; height: auto; max-height: calc(100% - 80px); } .modal__dialog--stretch { width: calc(100% - 80px); max-width: 1200px; margin-left: auto; margin-right: auto; } .modal__header, .modal__content { padding: 30px; } .modal__header:not(.modal__header--bordered) { text-align: center; border-bottom: none; padding-bottom: 0; display: block; position: relative; } .modal__header--bordered { padding-top: 20px; padding-bottom: 20px; } .modal__close { position: absolute; top: 28px; right: 28px; } .modal__description { margin-top: -18px; } } .icon-state { vertical-align: middle; position: relative; } .icon-state .icon-state__primary, .icon-state .icon-state__secondary { transition: opacity .35s ease-in-out, transform .35s ease-in-out; display: block; } .icon-state .icon-state__secondary { opacity: 0; position: absolute; top: 50%; left: 0; transform: translateY(-50%)scale(.3); } .icon-state[aria-expanded="true"] .icon-state__primary { opacity: 0; transform: scale(.3); } .icon-state[aria-expanded="true"] .icon-state__secondary { opacity: 1; transform: translateY(-50%)scale(1); } @media (-moz-touch-enabled: 0), (hover: hover) { [data-tooltip] { position: relative; } [data-tooltip]:before { content: attr(data-tooltip); white-space: nowrap; background: var(--accent-color); color: var(--secondary-background); font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); pointer-events: none; visibility: hidden; opacity: 0; z-index: 1; border-radius: 3px; padding: 2px 11px; transition: visibility .2s ease-in-out, opacity .2s ease-in-out; position: absolute; bottom: calc(100% + 3px); left: 50%; transform: translateX(-50%); box-shadow: 0 1px #0001; } [data-tooltip]:after { content: ""; border-style: solid; border-width: 6px; border-color: transparent transparent var(--accent-color) var(--accent-color); visibility: hidden; z-index: 1; opacity: 0; width: 0; height: 0; transition: visibility .2s ease-in-out, opacity .2s ease-in-out; position: absolute; bottom: calc(100% - 2px); left: calc(50% - 7px); transform: rotate(-45deg); box-shadow: -1px 1px 1px #0000001a; } [data-tooltip]:hover:before, [data-tooltip]:hover:after { opacity: 1; visibility: visible; } [data-tooltip-position="bottom-left"]:before { top: calc(100% + 4px); bottom: auto; left: auto; right: -6px; transform: none; } [data-tooltip-position="bottom-left"]:after { top: calc(100% - 1px); left: calc(50% - 6px); transform: rotate(135deg); } } .quantity-selector { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); border: 1px solid var(--border-color); box-shadow: 0 1px 1px rgba(var(--border-color-rgb), .2); vertical-align: middle; border-radius: 3px; align-items: center; height: 38px; display: inline-flex; } .quantity-selector svg:hover { opacity: 1; } .quantity-selector .icon--minus { width: 10px; height: 2px; } .quantity-selector .icon--plus { width: 10px; height: 10px; } .quantity-selector__button { color: rgba(var(--text-color-rgb), .6); touch-action: manipulation; align-items: center; height: 100%; padding: 0 12px; transition: color .2s ease-in-out; display: flex; } .quantity-selector__button:not([disabled]):hover { color: var(--heading-color); } .quantity-selector__value { -webkit-appearance: none; appearance: none; text-align: center; background: none; border: none; width: 32px; min-width: 32px; padding: 0 5px; } .quantity-selector__value::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .quantity-selector__value::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .quantity-selector__value:focus { outline: none; } .quantity-selector--product { height: 44px; } .quantity-selector--product .quantity-selector__button { padding: 0 16px; } .quantity-selector--product .quantity-selector__value { border-left: 1px solid var(--border-color); border-right: 1px solid var(--border-color); box-shadow: 0 1px rgba(var(--border-color-rgb), .4) inset; color: var(--heading-color); width: 64px; min-width: 64px; height: 100%; } .shipping-estimator__results { margin: 24px 0 2px; font-size: 1rem; } .shipping-estimator__results p { margin-bottom: 6px; } .shipping-estimator__results ul { color: var(--heading-color); font-weight: var(--text-font-bolder-weight); } .cookie-bar { visibility: hidden; opacity: 0; z-index: 3; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 11px)); width: 100%; transition: transform .35s ease-in-out, opacity .35s ease-in-out, visibility .35s ease-in-out; position: fixed; bottom: 20px; left: 0; transform: translateY(100%); } .cookie-bar[aria-hidden="false"] { visibility: visible; opacity: 1; transform: translateY(0); } .cookie-bar__inner { z-index: 4; background: var(--secondary-background); color: var(--text-color); border-radius: 3px; max-width: 960px; margin: 0 auto; padding: 15px; box-shadow: 0 1px 4px 1px #0000001a; } .cookie-bar__text { line-height: 1.45; } .cookie-bar__button { line-height: 30px; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 12px)); margin-top: 12px; padding: 0 16px; } .cookie-bar__choice-container { margin-top: 5px; } @supports (padding: max(0px)) { .cookie-bar { bottom: max(25px, env(safe-area-inset-bottom, 0px) + 25px); } } @media screen and (min-width: 641px) { .cookie-bar { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); bottom: 25px; } .cookie-bar__inner { justify-content: space-between; align-items: center; padding: 20px 30px 20px 25px; display: flex; } .cookie-bar__text { line-height: 1.25; } .cookie-bar__button { line-height: 36px; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-top: 0; padding: 0 18px; } .cookie-bar__choice-container { min-width: -moz-fit-content; min-width: fit-content; margin-top: 5px; margin-left: 25px; } } .contact { margin-bottom: 40px; } .contact__store-info { margin-top: 50px; } .contact__store-heading, .contact__store-image { margin-bottom: 30px; } @media screen and (min-width: 641px) { .contact { margin-bottom: 90px; } } @media screen and (min-width: 1000px) { .contact__store-info { margin-top: 0; margin-left: 25px; } } .password { flex-direction: column; justify-content: center; align-items: center; height: 100vh; padding: 20px 0; display: flex; } @supports (--css: variables) { .password { height: calc(100vh - var(--header-height, 0px)); } } .password__content { text-align: center; flex: 1 0 auto; align-items: center; display: flex; } .password__footer { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); text-align: center; } .password__footer-social { justify-content: center; margin-top: 15px; display: flex; } .password__social-text { margin-right: 20px; } .password__powered-by a { vertical-align: bottom; margin-left: 4px; display: inline-block; } .password__powered-by svg { width: 98px; height: 28px; } .password__admin-link { margin-left: 18px; display: block; } @media screen and (min-width: 1000px) { .template-password .header { padding-top: 30px; padding-bottom: 30px; } .password { padding: 40px 0; } .password__footer { text-align: left; } .password__footer--with-social { justify-content: space-between; width: 100%; display: flex; } .password__admin-link { display: inline-block; } .password__footer-social { margin-top: 0; } } .faq { margin: 40px 0 70px; } .faq__title { text-align: center; margin-bottom: 20px; } .faq__item { background: var(--secondary-background); border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); padding: 20px; } .faq__item + .faq__item { border-top: none; } .faq__question { text-align: left; justify-content: space-between; align-items: center; width: 100%; display: flex; } .faq__question .plus-button { margin-left: 40px; } .faq__answer-wrapper { height: 0; transition: height .2s ease-in-out; overflow: hidden; } .faq__answer { margin: 10px 30px 0 0; } .faq__group { margin-bottom: 30px; } .faq__group-title { text-align: center; } .faq__contact-info { margin-top: 50px; } @media screen and (min-width: 641px) { .faq { margin: 70px 0 115px; } .faq__title { margin-bottom: 25px; margin-left: 0; } .faq__item { border: 1px solid var(--border-color); border-radius: 3px 3px 0 0; padding: 20px 30px; } .faq__item + .faq__item { border-radius: 0; } .faq__item:last-child { border-radius: 0 0 3px 3px; } } @media screen and (min-width: 1000px) { .faq__group { margin-bottom: 0; } .faq__group + .faq__group { margin-top: 50px; } } .modal--newsletter { height: auto; top: auto; bottom: 0; } .modal--newsletter .modal__dialog { height: auto; padding: 48px 20px 20px; position: relative; } .popup-newsletter__title { text-align: center; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 20px)); margin-bottom: 10px; } .popup-newsletter__close { color: var(--heading-color); position: absolute; top: 16px; right: 20px; } .popup-newsletter__close svg { width: 15px; height: 15px; } .popup-newsletter__content { text-align: center; } .popup-newsletter__form { margin-top: 20px; } @supports (padding: max(0px)) { .modal--newsletter .modal__dialog { padding-bottom: max(20px, env(safe-area-inset-bottom, 0px) + 20px); } } @media screen and (min-width: 641px) { .modal--newsletter { height: 100%; } .modal--newsletter .modal__dialog { max-width: 540px; padding: 64px 80px 80px; } .popup-newsletter__close { position: absolute; top: 24px; right: 30px; } .popup-newsletter__close svg { width: 20px; height: 20px; } .popup-newsletter__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 28px)); } .popup-newsletter__form { margin-top: 30px; } } .modal--exit-popup { height: auto; top: auto; bottom: 0; } .modal--exit-popup .modal__dialog { height: auto; padding: 48px 20px 20px; position: relative; } .exit-popup__title { text-align: center; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 28px)); margin-bottom: 8px; line-height: 1.2; } .exit-popup__subheading { text-align: center; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 18px)); } .exit-popup__close { color: var(--heading-color); position: absolute; top: 16px; right: 20px; } .exit-popup__close svg { width: 15px; height: 15px; } .exit-popup__form { margin-top: 20px; } .exit-popup__pay-more { text-align: center; margin-top: 20px; margin-left: auto; margin-right: auto; display: block; } @media screen and (min-width: 641px) { .modal--exit-popup { height: 100%; } .modal--exit-popup .modal__dialog { max-width: 540px; padding: 95px 80px 30px; } .exit-popup__close { position: absolute; top: 24px; right: 30px; } .exit-popup__close svg { width: 20px; height: 20px; } .exit-popup__title { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 48px)); } .exit-popup__form { margin-top: 30px; } .exit-popup__pay-more { margin-top: 75px; } } .drawer { z-index: 5; visibility: hidden; width: 100vw; height: 100vh; transition: visibility .35s linear; position: fixed; top: 0; right: 0; } .drawer:before { content: ""; opacity: 0; background: #000; width: 100%; height: 100%; transition: opacity .35s ease-in-out; position: absolute; top: 0; left: 0; } .drawer__inner { background: var(--secondary-background); width: 100%; max-width: 345px; height: 100%; margin-left: auto; transition: transform .35s cubic-bezier(.645, .045, .355, 1); position: absolute; top: 0; right: 0; transform: translateX(100%); } .drawer[aria-hidden="false"] { visibility: visible; } .drawer[aria-hidden="false"]:before { opacity: .4; } .drawer[aria-hidden="false"] .drawer__inner { transform: translateX(0); } .link-search-results:not(:only-child) { margin-top: 40px; } .link-search-results__list { list-style: none; } .link-search-results__link { padding: 8px 20px; transition: color .15s ease-in-out, background .15s ease-in-out; display: block; } .link-search-results__link:hover, .link-search-results__link:focus { background: var(--accent-background); color: var(--accent-color); outline: none; } @media screen and (min-width: 641px) { .link-search-results:not(:only-child) { margin-top: 60px; } } .expandable-content[aria-expanded] { max-height: 320px; transition: all .2s ease-in-out; position: relative; overflow: hidden; } .expandable-content__toggle { visibility: hidden; opacity: 0; color: var(--accent-color); text-align: left; font-weight: var(--text-font-bolder-weight); background: var(--secondary-background); z-index: 1; align-items: center; width: 100%; padding: 16px 20px; transition: opacity .1s ease-in-out, visibility .1s ease-in-out; display: flex; position: absolute; bottom: 0; left: 0; } .expandable-content__toggle:before { content: ""; pointer-events: none; background: linear-gradient(rgba(var(--secondary-background-rgb), 0), rgba(var(--secondary-background-rgb), .4) 15%, var(--secondary-background)); width: 100%; height: 50px; position: absolute; bottom: 100%; left: 0; } .expandable-content__toggle-icon { width: 10px; height: 10px; margin-right: 15px; transition: transform .2s ease-in-out; position: relative; } .expandable-content__toggle-icon:before, .expandable-content__toggle-icon:after { content: ""; background: currentColor; transition: transform .2s ease-in-out; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .expandable-content__toggle-icon:before { width: 2px; height: 10px; } .expandable-content__toggle-icon:after { width: 10px; height: 2px; } .expandable-content--expandable[aria-expanded="true"] .expandable-content__toggle-icon { transform: rotateZ(90deg); } .expandable-content--expandable[aria-expanded="true"] .expandable-content__toggle-icon:after { display: none; } .expandable-content--expandable .expandable-content__toggle { visibility: visible; opacity: 1; } .expandable-content--expandable[aria-expanded="true"] .expandable-content__toggle:before { height: 0; } @media screen and (any-hover: hover) { .expandable-content[aria-expanded="false"] .expandable-content__toggle:hover .expandable-content__toggle-icon { transform: rotateZ(45deg); } } @media screen and (min-width: 641px) { .expandable-content__toggle { padding-left: 30px; padding-right: 30px; } } .menu-item__title { margin-bottom: .75em; } .menu-item__linklist { list-style: none; } .menu-item__link-item { padding: 5px 0; } .price-range { padding: 20px 0; display: block; } .price-range__input-group { align-items: center; display: flex; } .price-range__input { flex: 1 0 0; min-width: 0; } .price-range__delimiter { margin: 0 12px; } .price-range__range-group { margin-bottom: 18px; position: relative; } .rating { vertical-align: bottom; line-height: inherit; align-items: center; display: flex; } .rating__stars { grid-auto-flow: column; column-gap: 2px; display: grid; } .rating__star { color: var(--product-review-star-color); width: 14px; height: 14px; } .rating__star--empty { color: rgba(var(--text-color-rgb), .4); } .rating__caption { font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px)); margin-left: 7px; position: relative; top: 1px; } product-rerender { display: contents; } .value-picker-button svg { width: 9px; height: 7px; margin-left: 10px; transition: transform .2s ease-in-out; } .value-picker-button svg path { stroke-width: 2.5px; } .value-picker-button--pill { text-align: left; border-bottom: 1px solid var(--border-color); background: var(--secondary-background); justify-content: space-between; align-items: center; width: 100%; padding: 14px 20px; display: flex; position: relative; } .value-picker-button--pill svg { width: 12px; height: 8px; transition: transform .2s ease-in-out; } .value-picker-button--pill path { stroke-width: 2px; } .value-picker-button[aria-expanded="true"] svg { transform: rotateZ(180deg); } .value-picker { z-index: 5; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 16px)); visibility: hidden; width: 100vw; height: 100vh; transition: visibility .35s ease-in-out; position: fixed; bottom: 0; left: 0; } .value-picker:before { content: ""; opacity: 0; background: #000; width: 100vw; height: 100vh; transition: opacity .35s ease-in-out; position: fixed; top: 0; left: 0; } .value-picker[aria-hidden="false"] { visibility: visible; } .value-picker[aria-hidden="false"]:before { opacity: .4; } .value-picker[aria-hidden="false"] .value-picker__inner { transform: translateY(0); } .value-picker .icon--nav-triangle-borderless { display: none; } .value-picker__inner { background: var(--secondary-background); width: 100%; transition: visibility .2s ease-in-out, transform .2s ease-in-out; position: absolute; bottom: 0; left: 0; transform: translateY(100%); } .value-picker__header { border-bottom: 1px solid var(--border-color); justify-content: space-between; align-items: center; padding: 17px 20px 16px; display: flex; } .value-picker__header .icon--close { color: var(--heading-color); width: 17px; height: 17px; } .value-picker__title { margin: 0; } .value-picker__close svg { display: block; } .value-picker__choice-list { overscroll-behavior: none; max-height: 430px; padding: 15px 0; list-style: none; overflow: auto; } .value-picker__choice-item { text-align: left; width: 100%; padding: 8px 50px 7px 20px; display: block; position: relative; } .value-picker__choice-item svg { width: 13px; height: 11px; transition: transform .2s ease-in-out; position: absolute; top: 17px; right: 20px; transform: scale(0); } .value-picker__choice-item.is-selected { color: var(--accent-color); font-weight: var(--text-font-bolder-weight); } .value-picker__choice-item.is-selected svg { transform: scale(1); } @supports (padding: max(0px)) { .value-picker__choice-list { max-height: calc(430px + env(safe-area-inset-bottom, 0px) + 15px); padding-bottom: max(15px, env(safe-area-inset-bottom, 0px) + 15px); } } @media screen and (min-width: 641px) { .value-picker-wrapper { position: relative; } .value-picker { visibility: hidden; opacity: 0; background: var(--secondary-background); color: var(--text-color); z-index: 4; cursor: auto; will-change: transform; border-radius: 3px; width: auto; min-width: 160px; height: auto; transition: opacity .25s ease-in-out, transform .25s ease-in-out, visibility .25s ease-in-out; position: absolute; top: calc(100% + 10px); bottom: auto; left: auto; right: -25px; transform: scale(.9); box-shadow: 0 1px 5px 2px #0000001a; } .value-picker:before { display: none; } .value-picker[data-picker-position="top"] { top: auto; bottom: calc(100% + 10px); } .value-picker--align-left { left: 0; right: auto !important; } .value-picker[aria-hidden="false"] { visibility: visible; opacity: 1; transition: opacity .4s cubic-bezier(0, 1, .4, 1), transform .4s cubic-bezier(.18, 1.25, .4, 1), visibility .4s linear; transform: scale(1.001); } .value-picker .icon--nav-triangle-borderless { z-index: 2; filter: drop-shadow(0 -2px 2px #0000001f); width: 18px; height: 8px; display: block; position: absolute; bottom: 100%; right: 20px; } .value-picker--align-left .icon--nav-triangle-borderless { left: 20px; right: auto; } .value-picker[data-picker-position="top"] .icon--nav-triangle-borderless { top: 100%; bottom: auto; transform: rotateZ(180deg); } .value-picker__inner { border-radius: 3px; width: auto; transition: none; position: relative; transform: none !important; } .value-picker__inner--restrict { max-height: 300px; overflow: auto; } .value-picker__header { display: none; } .value-picker__choice-list { white-space: nowrap; font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 15px)); max-height: none; padding: 15px 0; } .value-picker__choice-item { cursor: pointer; padding: 2px 25px; transition: color .15s ease-in-out, background .15s ease-in-out; display: block; } .value-picker__choice-item.is-selected, .value-picker__choice-item:hover { background: var(--accent-background); color: var(--accent-color); font-weight: normal; } .value-picker__choice-item.is-selected svg, .value-picker__choice-item:hover svg { display: none; } .value-picker--small { min-width: 105px; right: -2px; } .value-picker--small .value-picker__choice-list { padding: 10px 0; font-size: .85rem; } .value-picker--small .value-picker__choice-item { padding: 2px 18px; } .value-picker--small .icon--nav-triangle-borderless { right: 11px; } .value-picker--small.value-picker--align-left .icon--nav-triangle-borderless { left: 11px; } .value-picker--auto { min-width: 0; } }