/** Shopify CDN: Minification failed Line 2184:21 Expected "=" but found "." Line 2751:21 Expected "=" but found "." Line 5889:20 Expected "]" to go with "[" Line 5889:29 Unexpected "]" Line 5897:20 Expected "]" to go with "[" Line 5897:29 Unexpected "]" Line 5907:22 Expected "]" to go with "[" Line 5907:31 Unexpected "]" Line 5916:20 Expected "]" to go with "[" Line 5916:29 Unexpected "]" ... and 9 more hidden warnings **/ /*!*********************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/flickity/dist/flickity.min.css ***! \*********************************************************************************************************************************************************************/ /*! Flickity v3.0.0 https://flickity.metafizzy.co ---------------------------------------------- */ .flickity-enabled{position:relative} .flickity-enabled:focus{outline:0} .flickity-viewport{overflow:hidden;position:relative;height:100%;touch-action:pan-y} .flickity-slider{position:absolute;width:100%;height:100%;left:0} .flickity-rtl .flickity-slider{left:auto;left:initial;right:0} .flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none} .flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:grab} .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:grabbing} .flickity-cell{position:absolute;left:0} .flickity-rtl .flickity-cell{left:auto;left:initial;right:0} .flickity-button{position:absolute;background:hsla(0, 0%, 100%, 0.75);border:none;color:#333} .flickity-button:hover{background:#fff;cursor:pointer} .flickity-button:focus{outline:0;box-shadow:0 0 0 5px #19f} .flickity-button:active{opacity:.6} .flickity-button:disabled{opacity:.3;cursor:auto;pointer-events:none} .flickity-button-icon{fill:currentColor} .flickity-prev-next-button{top:50%;width:44px;height:44px;border-radius:50%;transform:translateY(-50%)} .flickity-prev-next-button.previous{left:10px} .flickity-prev-next-button.next{right:10px} .flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px} .flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px} .flickity-prev-next-button .flickity-button-icon{position:absolute;left:20%;top:20%;width:60%;height:60%} .flickity-page-dots{position:absolute;width:100%;bottom:-25px;text-align:center;display:flex;justify-content:center;flex-wrap:wrap} .flickity-rtl .flickity-page-dots{direction:rtl} .flickity-page-dot{display:block;width:10px;height:10px;padding:0;margin:0 8px;background:hsla(0, 0%, 20%, 0.25);border-radius:50%;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;text-indent:-9999px;overflow:hidden} .flickity-rtl .flickity-page-dot{text-indent:9999px} .flickity-page-dot:focus{outline:0;box-shadow:0 0 0 5px #19f} .flickity-page-dot.is-selected{background:hsla(0, 0%, 20%, 1)} /*!**********************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./node_modules/postcss-loader/dist/cjs.js!./src/components/styles/theme.scss ***! \**********************************************************************************************************************************************************/ /** * Main theme stylesheet * Imports all component stylesheets and Tailwind CSS layers */ /** * Typography styles * Defines font families, sizes, weights, and text styling utilities */ /** * Layout and structural styles * Defines body, page, and section-level layout behaviors */ /** * Utility classes and global helpers * Provides touch handling, focus states, and other cross-browser utility styles */ /** * CSS custom properties and variables * Defines theme colors, grid settings, spacing, and other design tokens */ :root { --grid-columns: 4; --grid-main: repeat(var(--grid-columns), 1fr); --padding-margin: 1rem; --padding-gutter: 0.5rem; --colour-primary: #333333; --colour-secondary: #ffffff; --colour-tertiary: #7a4594; --colour-accent: #ff543b; --height-header: 45px; --height-header-adapt: 45px; --height-view: 100vh; --height-screen: calc(var(--height-view) - var(--height-header)); --height-screen-headerless: calc(var(--height-screen) - var(--height-header)); --height-screen-adapt: calc(var(--height-view) - var(--height-header-adapt)); --height-topbar: 28px; --text-2xl: 1.875rem; --text-xl: 1.5rem; --text-l: 1.125rem; --text-m: 1rem; --text-s: 0.875rem; --text-xs: 0.813rem; --text-2xs: 0.688rem; --z-index: 0; --thumb-size: 1.25rem; } @media (min-width: 375px) { :root { --grid-columns: 6 } } @media (min-width: 768px) { :root { --grid-columns: 8 } } @media (min-width: 1024px) { :root { --grid-columns: 12; --padding-margin: 1.5rem; --height-header: 60px; --height-header-adapt: 60px; --text-2xl: 2.25rem; --text-xl: 1.75rem; --text-l: 1.25rem; --thumb-size: 0.625rem } } @media (min-width: 1440px) { } @media (min-width: 1828px) { :root { --grid-columns: 16 } } @supports (height: 100dvh) { :root { --height-view: 100dvh } } /** * Third-party library styling overrides * Custom styles for Flickity carousel and other external libraries */ /* Flickity Styling */ .flickity-viewport { width: 100%; overflow: visible; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .flickity-viewport .flickity-slider { will-change: transform; } .flickity-viewport .flickity-slider .flickity-cell { position: absolute !important; } .flickity-viewport .flickity-slider .flickity-cell { min-height: -moz-fit-content; min-height: fit-content; flex-shrink: 0; transition: opacity 0.3s ease-in-out; } .flickity-button { background-color: transparent !important; outline: 2px solid transparent !important; outline-offset: 2px !important; } .flickity-button { pointer-events: auto; cursor: not-allowed; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .flickity-button:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; --tw-ring-offset-width: 0px !important; } .flickity-button.focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .flickity-button.focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .flickity-button.focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .flickity-button:focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .flickity-button:disabled { opacity: 0.5; } .flickity-button.flickity-prev-next-button { display: flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 0px; color: var(--button-colour); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .flickity-button.flickity-prev-next-button:hover { opacity: 0.5; } } .flickity-button.flickity-prev-next-button.next { right: 0; cursor: e-resize; } .flickity-button.flickity-prev-next-button.previous { left: 0; cursor: w-resize; } .flickity-button.flickity-prev-next-button .flickity-button-icon { position: static; height: 12px; width: auto; } @media (min-width: 768px) { .flickity-button.flickity-prev-next-button .flickity-button-icon { height: 16px; } } .flickity-container-full .flickity-container { margin-left: calc(var(--padding-left) * -1); width: calc(100% + var(--padding-left) + var(--padding-right)); } @media (max-width: 767px) { .flickity-container-full .flickity-container { margin-left: calc(var(--padding-left-mb) * -1); width: calc(100% + var(--padding-left-mb) + var(--padding-right-mb)); } } .flickity-container-full .flickity-container .flickity-button.flickity-prev-next-button.next { right: var(--padding-right); } @media (max-width: 767px) { .flickity-container-full .flickity-container .flickity-button.flickity-prev-next-button.next { right: var(--padding-right-mb); } } .flickity-container-full .flickity-container .flickity-button.flickity-prev-next-button.previous { left: var(--padding-left); } @media (max-width: 767px) { .flickity-container-full .flickity-container .flickity-button.flickity-prev-next-button.previous { left: var(--padding-left-mb); } } .flickity-container-full .flickity-container .flickity-page-dots { left: 50%; width: calc(100% - var(--padding-left) - var(--padding-right)); --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @media (max-width: 767px) { .flickity-container-full .flickity-container .flickity-page-dots { width: calc(100% - var(--padding-left-mb) - var(--padding-right-mb)); } } /* Klaviyo Styling */ .klaviyo-form-inline h1, .klaviyo-form-inline h2, .klaviyo-form-inline h3, .klaviyo-form-inline h4, .klaviyo-form-inline h5, .klaviyo-form-inline h6 { letter-spacing: 0.2px; } .klaviyo-form-inline h1 strong, .klaviyo-form-inline h2 strong, .klaviyo-form-inline h3 strong, .klaviyo-form-inline h4 strong, .klaviyo-form-inline h5 strong, .klaviyo-form-inline h6 strong { font-weight: 700; } .klaviyo-form-inline h1, .klaviyo-form-inline h2, .klaviyo-form-inline h3, .klaviyo-form-inline h4, .klaviyo-form-inline h5, .klaviyo-form-inline h6 { letter-spacing: 0.2px; } .klaviyo-form-inline h1 strong, .klaviyo-form-inline h2 strong, .klaviyo-form-inline h3 strong, .klaviyo-form-inline h4 strong, .klaviyo-form-inline h5 strong, .klaviyo-form-inline h6 strong { font-weight: 700; } .klaviyo-form-inline h1, .klaviyo-form-inline h2, .klaviyo-form-inline h3, .klaviyo-form-inline h4, .klaviyo-form-inline h5, .klaviyo-form-inline h6 { font-family: Calibre, Arial, sans-serif !important; font-size: 1rem !important; font-size: var(--text-m) !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .klaviyo-form-inline h1 span, .klaviyo-form-inline h2 span, .klaviyo-form-inline h3 span, .klaviyo-form-inline h4 span, .klaviyo-form-inline h5 span, .klaviyo-form-inline h6 span { letter-spacing: 0.2px; } .klaviyo-form-inline h1 span strong, .klaviyo-form-inline h2 span strong, .klaviyo-form-inline h3 span strong, .klaviyo-form-inline h4 span strong, .klaviyo-form-inline h5 span strong, .klaviyo-form-inline h6 span strong { font-weight: 700; } .klaviyo-form-inline h1 span, .klaviyo-form-inline h2 span, .klaviyo-form-inline h3 span, .klaviyo-form-inline h4 span, .klaviyo-form-inline h5 span, .klaviyo-form-inline h6 span { letter-spacing: 0.2px; } .klaviyo-form-inline h1 span strong, .klaviyo-form-inline h2 span strong, .klaviyo-form-inline h3 span strong, .klaviyo-form-inline h4 span strong, .klaviyo-form-inline h5 span strong, .klaviyo-form-inline h6 span strong { font-weight: 700; } .klaviyo-form-inline h1 span, .klaviyo-form-inline h2 span, .klaviyo-form-inline h3 span, .klaviyo-form-inline h4 span, .klaviyo-form-inline h5 span, .klaviyo-form-inline h6 span { font-family: Calibre, Arial, sans-serif !important; font-size: 1rem !important; font-size: var(--text-m) !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .klaviyo-form-inline p { letter-spacing: 0.2px; } .klaviyo-form-inline p strong { font-weight: 700; } .klaviyo-form-inline p { letter-spacing: 0.2px; } .klaviyo-form-inline p strong { font-weight: 700; } .klaviyo-form-inline p { font-family: Calibre, Arial, sans-serif !important; font-size: 0.875rem !important; font-size: var(--text-s) !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .klaviyo-form-inline p span { letter-spacing: 0.2px; } .klaviyo-form-inline p span strong { font-weight: 700; } .klaviyo-form-inline p span { letter-spacing: 0.2px; } .klaviyo-form-inline p span strong { font-weight: 700; } .klaviyo-form-inline p span { font-family: Calibre, Arial, sans-serif !important; font-size: 0.875rem !important; font-size: var(--text-s) !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .klaviyo-form-inline input { letter-spacing: 0.2px; } .klaviyo-form-inline input strong { font-weight: 700; } .klaviyo-form-inline input { letter-spacing: 0.2px; } .klaviyo-form-inline input strong { font-weight: 700; } .klaviyo-form-inline input { margin-right: 1rem !important; height: 44px !important; border-left-width: 0px !important; border-right-width: 0px !important; border-top-width: 0px !important; border-bottom-width: 1px !important; border-style: solid !important; border-color: var(--text-colour) !important; background-color: transparent !important; padding: 0 !important; font-family: Calibre, Arial, sans-serif !important; font-size: 0.875rem !important; font-size: var(--text-s) !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: var(--text-colour) !important; outline: 2px solid transparent !important; outline-offset: 2px !important; } .klaviyo-form-inline input::-moz-placeholder { letter-spacing: 0.2px; } .klaviyo-form-inline input::placeholder { letter-spacing: 0.2px; } .klaviyo-form-inline input strong::-moz-placeholder { font-weight: 700; } .klaviyo-form-inline input strong::placeholder { font-weight: 700; } .klaviyo-form-inline input::-moz-placeholder { letter-spacing: 0.2px; } .klaviyo-form-inline input::placeholder { letter-spacing: 0.2px; } .klaviyo-form-inline input strong::-moz-placeholder { font-weight: 700; } .klaviyo-form-inline input strong::placeholder { font-weight: 700; } .klaviyo-form-inline input::-moz-placeholder { font-family: Calibre, Arial, sans-serif !important; font-size: 0.875rem !important; font-size: var(--text-s) !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: var(--text-colour) !important; } .klaviyo-form-inline input::placeholder { font-family: Calibre, Arial, sans-serif !important; font-size: 0.875rem !important; font-size: var(--text-s) !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: var(--text-colour) !important; } .klaviyo-form-inline input:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; --tw-ring-offset-width: 0px !important; } .klaviyo-form-inline button { letter-spacing: 0.2px; } .klaviyo-form-inline button strong { font-weight: 700; } .klaviyo-form-inline button { letter-spacing: 0.2px; } .klaviyo-form-inline button strong { font-weight: 700; } .klaviyo-form-inline button { display: flex !important; min-height: 44px !important; cursor: pointer !important; align-items: center !important; justify-content: center !important; -moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important; border-radius: 0px !important; border-width: 1px !important; background-color: #ff543b !important; background-color: var(--colour-accent) !important; padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 1.5rem !important; padding-right: 1.5rem !important; text-align: center !important; font-family: Calibre, Arial, sans-serif !important; font-size: 0.875rem !important; font-size: var(--text-s) !important; font-weight: 400 !important; text-transform: uppercase !important; line-height: 1 !important; letter-spacing: 0.2px !important; color: #ffffff !important; color: var(--colour-secondary) !important; transition-property: all !important; transition-timing-function: ease !important; transition-duration: 0.3s !important; } .klaviyo-form-inline button.focus-visible { outline-width: 0px !important; } .klaviyo-form-inline button:focus-visible { outline-width: 0px !important; } .klaviyo-form-inline button:disabled { cursor: not-allowed !important; --tw-border-opacity: 1 !important; border-color: rgba(239, 239, 239, 1) !important; border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)) !important; --tw-bg-opacity: 1 !important; background-color: rgba(239, 239, 239, 1) !important; background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)) !important; --tw-text-opacity: 1 !important; color: rgba(188, 185, 182, 1) !important; color: rgba(188, 185, 182, var(--tw-text-opacity, 1)) !important; } .klaviyo-form-inline button:hover, .klaviyo-form-inline button.active { opacity: 0.5 !important; } /* SWYM Styling */ .atw-button { background: none !important; width: -moz-fit-content !important; width: fit-content !important; height: -moz-fit-content !important; height: fit-content !important; padding: 0.625rem !important; transition-property: all !important; transition-timing-function: ease !important; transition-duration: 0.3s !important; } @media (hover: hover) and (pointer: fine) { .atw-button:hover { opacity: 0.5; } } .atw-button .atw-button-text { display: none; } .swym-ui-components *, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-heading, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-content { letter-spacing: 0.2px; } .swym-ui-components * strong, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-heading strong, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-content strong { font-weight: 700; } .swym-ui-components *, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-heading, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-content { letter-spacing: 0.2px; } .swym-ui-components * strong, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-heading strong, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-content strong { font-weight: 700; } .swym-ui-components *, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-heading, .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-content { font-family: Calibre, Arial, sans-serif !important; font-weight: 400 !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .swym-ui-components .swym-ui-component .swym-save-wishlist-modal .swym-save-wishlist-modal-dialog .swym-text-heading { text-transform: uppercase !important; } #swym-wishlist-render-container { margin: 0 !important; padding: 0 !important; } #swym-wishlist-render-container * { letter-spacing: 0.2px; } #swym-wishlist-render-container * strong { font-weight: 700; } #swym-wishlist-render-container * { letter-spacing: 0.2px; } #swym-wishlist-render-container * strong { font-weight: 700; } #swym-wishlist-render-container * { font-family: Calibre, Arial, sans-serif !important; font-weight: 400 !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .swym-htc-tabs { display: none !important; } .swym-ui-component .swym-wishlist-detail-separator, .swym-ui-component .swym-add-wishlist-modal .swym-modal-content .swym-product-title:after { --tw-bg-opacity: 1 !important; background-color: rgba(239, 239, 239, 1) !important; background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)) !important; } .swym-ui-component.swym-wishlist-page .swym-wishlist-container-title-bar { --tw-border-opacity: 1 !important; border-color: rgba(239, 239, 239, 1) !important; border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)) !important; padding-top: 0 !important; } .swym-ui-component.swym-wishlist-page .swym-wishlist-container-title-bar, .swym-ui-component .swym-add-wishlist-modal .swym-modal-content .swym-wishlist-item, .swym-ui-component .swym-add-wishlist-modal .swym-modal-content .swym-new-wishlist-item, .swym-ui-component .swym-htc-tabs, .swym-ui-component.swym-wishlist-page .swym-sfl-tab-container .swym-sfl-list-view .swym-sfl-detail-separator, .swym-ui-component .swym-simple-wishlist-container .swym-sfl-tab-container .swym-sfl-list-view .swym-sfl-detail-separator { --tw-border-opacity: 1 !important; border-color: rgba(239, 239, 239, 1) !important; border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)) !important; } .swym-ui-component.swym-wishlist-page { margin: auto !important; max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; } .swym-ui-component .swym-empty-wishlist-container { align-items: flex-start !important; padding: 0 !important; } .swym-ui-component.swym-wishlist-page .swym-wishlist-container-title-bar { padding-left: 0 !important; padding-right: 0 !important; } .swym-ui-component .swym-wishlist-main-title.swym-heading.swym-heading-1, .swym-ui-component .swym-empty-wishlist-container .swym-empty-wishlist-title, .swym-storefront-layout-title, a.swym-storefront-layout-grid-item-title, .swym-storefront-layout-login-heading, .swym-login-btn { margin-top: 0 !important; margin-left: 0 !important; font-weight: 400 !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .swym-ui-component.swym-wishlist-page .swym-wishlist-container-title-bar .swym-user-login-status, .swym-ui-component .swym-product-price .swym-product-final-price { letter-spacing: 0.2px !important; } .swym-ui-component .swym-wishlist-grid { max-width: none !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-image-wrapper { height: auto !important; max-height: 36rem !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item .swym-title { font-weight: 400 !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #333333 !important; color: var(--colour-primary) !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item .swym-variant-title { font-size: 0.875rem !important; font-size: var(--text-s) !important; line-height: 130% !important; letter-spacing: 0.2px !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item .swym-add-to-cart-btn, .swym-login-btn { min-height: 44px !important; border-radius: 0px !important; background-color: #ff543b !important; background-color: var(--colour-accent) !important; padding-left: 1.25rem !important; padding-right: 1.25rem !important; padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; font-weight: 400 !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #ffffff !important; color: var(--colour-secondary) !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item .swym-add-to-cart-btn, .swym-login-btn { transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item { border-width: 1px !important; --tw-border-opacity: 1 !important; border-color: rgba(239, 239, 239, 1) !important; border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)) !important; } @media only screen and (max-width: 900px) { .swym-ui-component .swym-wishlist-detail-separator { display: none !important; } .swym-ui-component .swym-wishlist-grid { padding: 0 !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-image-wrapper { max-height: 18rem !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item .swym-add-to-cart-btn { padding: 0.625rem !important; } .swym-ui-component.swym-wishlist-page { padding-left: 0 !important; padding-right: 0 !important; } .swym-ui-component.swym-wishlist-page .swym-wishlist-container-title-bar { border-width: 0px !important; } .swym-ui-component .swym-share-btn { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; } } .swym-ui-component .swym-product-price .swym-product-final-price { font-size: 1rem !important; font-size: var(--text-m) !important; font-weight: 400 !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #333333 !important; color: var(--colour-primary) !important; } .swym-ui-component .swym-empty-wishlist-container .swym-empty-wishlist-continue-btn { min-height: 44px !important; width: -moz-fit-content !important; width: fit-content !important; max-width: none !important; border-radius: 0px !important; background-color: #ff543b !important; background-color: var(--colour-accent) !important; padding-left: 1.25rem !important; padding-right: 1.25rem !important; padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; text-align: center !important; font-weight: 400 !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #ffffff !important; color: var(--colour-secondary) !important; } .swym-ui-component .swym-empty-wishlist-container .swym-empty-wishlist-continue-btn { transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .swym-ui-component .swym-empty-wishlist-container .swym-empty-wishlist-text, p.swym-empty-wishlist-text.swym-text.swym-text-1 { font-size: 0.875rem !important; font-size: var(--text-s) !important; font-weight: 400 !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #333333 !important; color: var(--colour-primary) !important; } .swym-storefront-layout-login-user-container, .swym-storefront-layout-header { background-color: #ffffff !important; background-color: var(--colour-secondary) !important; } .swym-storefront-layout-header { height: -moz-fit-content !important; height: fit-content !important; } .swym-storefront-layout-grid-item-add-to-cart-button, swym-storefront-layout-login-user .swym-storefront-layout-login-button { min-height: 44px !important; width: -moz-fit-content !important; width: fit-content !important; border-radius: 0px !important; background-color: #ff543b !important; background-color: var(--colour-accent) !important; padding-left: 1.25rem !important; padding-right: 1.25rem !important; padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; text-align: center !important; font-weight: 400 !important; text-transform: uppercase !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #ffffff !important; color: var(--colour-secondary) !important; } .swym-storefront-layout-grid-item-add-to-cart-button, swym-storefront-layout-login-user .swym-storefront-layout-login-button { transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .swym-storefront-layout-tab-button.swym-storefront-layout-tab-button-active, .swym-storefront-layout-empty-sfl-view-cart-button, .swym-save-list-btn { color: #ff543b !important; color: var(--colour-accent) !important; } .swym-storefront-layout-empty-sfl-view-cart-button, .swym-save-list-btn { background: none !important; text-decoration: underline !important; border: none !important; } .swym-ui-component .swym-empty-wishlist-container .swym-empty-wishlist-text { max-width: none !important; } .swym-storefront-layout-empty-sfl-content { padding-top: 10rem !important; } .swym-storefront-layout-empty-sfl-content { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width=%2735%27 height=%2739%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cg clip-path=%27url%28%23a%29%27 fill=%27%23FF543B%27%3E%3Cpath d=%27M34.86 20.14c-.05 4.53-1.69 9.12-5.09 13.04-2.22 2.57-4.95 4.43-8.25 5.25-5.47 1.36-10.46.29-14.79-3.41-2.71-2.32-4.54-5.24-5.66-8.62-1.02-3.12-1.3-6.31-.89-9.56.53-4.24 2.16-8 5.03-11.18C7.46 3.17 10.2 1.44 13.46.55c1.56-.42 3.15-.61 4.75-.53 3.8.18 7.14 1.56 10 4.07 2.67 2.35 4.46 5.27 5.57 8.63.73 2.21 1.08 4.47 1.09 7.43l-.01-.01Zm-1.31-.57c.01-1.16-.11-2.31-.29-3.46-.1-.62-.24-1.24-.41-1.85-.94-3.46-2.61-6.49-5.2-9-2.29-2.22-5-3.65-8.15-4.19-1.85-.32-3.69-.2-5.52.24-3.08.75-5.63 2.38-7.72 4.72-2.59 2.89-4.09 6.3-4.7 10.13-.41 2.6-.32 5.18.23 7.74.44 2.04 1.16 4 2.24 5.8 2.6 4.29 6.16 7.26 11.22 8.18 2.18.39 4.32.25 6.42-.4 3.34-1.04 5.99-3.06 8.03-5.87 2.6-3.59 3.78-7.64 3.85-12.05v.01Z%27/%3E%3Cpath d=%27M21.48 20.84c0 .46.27.82.39 1.22.06.2.24.47.03.57-.21.1-.28-.23-.37-.39-.17-.29-.31-.6-.46-.9-.13-.26-.27-.24-.46-.06-.22.21-.38.52-.81.59.36-.6.99-.82 1.36-1.3-.16-.1-.27-.02-.39.04-.35.16-.71.33-1.06.48-.1.04-.22.08-.31 0-.1-.09-.02-.2.03-.29.23-.43.47-.86.67-1.32-.33.11-.5.41-.73.62-.19.17-.36.55-.61.44-.3-.13-.07-.48-.05-.73.03-.35.07-.69.11-1.03-.17-.03-.2.08-.24.18-.17.39-.34.79-.52 1.18-.04.08-.08.22-.23.19-.13-.03-.15-.14-.17-.25-.05-.33-.1-.66-.16-1-.03-.18-.02-.38-.24-.56-.07.44-.13.84-.2 1.25-.02.11-.02.22-.04.32-.02.11-.06.23-.18.24-.12.01-.14-.11-.18-.19-.2-.47-.38-.94-.6-1.48-.13.25-.07.44-.03.62.08.32.1.64.12.96 0 .09.04.2-.06.26-.13.07-.19-.05-.27-.12-.31-.28-.51-.65-.93-.98l.55 1.07c.05.1.16.22.05.32-.08.08-.2.02-.3-.04-.09-.05-.19-.11-.32-.05.01.03.02.07.04.1.12.16.49.17.41.42-.06.18-.36.06-.56.1-.23.04-.46.03-.7.08.32.21.68.1 1.01.18.11.03.27-.04.31.12.04.15-.09.21-.19.28-.21.16-.42.31-.62.49.28 0 .51-.15.75-.25.09-.04.21-.12.3-.04.11.1.03.23-.02.33l-.48.93c-.06.12-.14.23-.06.41.33-.23.54-.56.8-.83.17-.18.35-.5.6-.4.26.11.11.45.1.7-.01.27-.07.53-.09.8-.01.15-.09.38.06.44.19.08.24-.17.32-.29.19-.29.35-.6.54-.9.1-.15.17-.39.4-.32.21.06.15.29.17.46.04.52-.05 1.05.17 1.57.22-.08.32-.25.43-.41.22-.34.44-.68.67-1.01.09-.12.19-.29.39-.22.17.06.17.22.18.37.03.44.06.89.11 1.33.02.15-.03.36.16.42.16.05.26-.11.36-.21.31-.31.62-.64.94-.94.1-.1.22-.26.38-.18.19.09.16.31.13.47-.08.44-.18.87-.27 1.3-.02.12-.08.25.03.34.13.11.26 0 .37-.05.38-.19.76-.4 1.14-.6.12-.06.25-.18.35-.02.08.13-.02.26-.11.36-.29.31-.59.62-.89.93-.08.09-.21.18-.17.3.05.16.22.12.35.12h1.29c.13 0 .31-.03.35.12.03.15-.13.21-.26.26-.4.15-.8.3-1.2.46-.12.05-.3.08-.28.24.02.12.17.15.29.18.36.1.72.21 1.08.31.16.04.29.11.41.22-.11.18-.27.13-.41.14H22.7c-.09 0-.21-.02-.25.09-.04.12.07.16.15.21.36.25.73.5 1.09.76.09.06.25.12.18.27-.07.17-.22.05-.32.03-.41-.12-.82-.26-1.23-.39-.11-.04-.22-.1-.38-.02.2.43.56.74.81 1.13.1.15.38.32.19.5-.15.15-.36-.08-.52-.18-.29-.19-.57-.4-.86-.6-.08-.05-.17-.19-.28-.09-.1.09 0 .21.03.3.12.34.25.68.38 1.02.03.09.07.18.08.27.02.1.06.23-.07.28-.1.04-.18-.05-.24-.12-.29-.34-.57-.68-.86-1.02-.07-.09-.15-.23-.29-.18-.14.06-.08.21-.08.32.01.44.15.88.13 1.32 0 .11.04.27-.11.32-.17.05-.24-.11-.3-.21-.18-.31-.34-.64-.52-.95-.1-.17-.16-.37-.38-.48-.19.42-.19.85-.23 1.27-.02.25-.02.64-.23.67-.32.03-.29-.38-.38-.61-.12-.3-.2-.61-.3-.92-.03-.11-.06-.22-.2-.22-.13 0-.19.09-.23.19-.16.35-.31.71-.47 1.07-.05.11-.1.22-.16.32s-.14.22-.28.18c-.13-.04-.17-.15-.2-.28-.08-.49-.15-.98-.26-1.47-.09-.4-.2-.42-.48-.11-.3.33-.56.69-.85 1.02-.11.13-.22.32-.43.23-.19-.08-.11-.28-.12-.44-.02-.42.14-.82.15-1.24 0-.17.09-.38-.1-.48-.17-.09-.33.06-.48.14-.35.2-.69.42-1.04.62-.15.09-.34.18-.49.04-.15-.14-.04-.33.04-.48.2-.4.42-.78.61-1.18.18-.37.11-.48-.31-.47-.51.02-1 .22-1.52.17-.12-.01-.26.03-.32-.11-.06-.17.09-.25.2-.31.27-.14.56-.26.84-.39.3-.15.39-.35.16-.64-.21-.26-.43-.52-.61-.8-.09-.13-.32-.29-.13-.44.14-.11.28.1.38.21.25.26.48.55.72.81.09.1.16.22.34.25-.05-.66-.6-1.16-.58-1.87.21.03.27.15.34.28.13.28.27.56.41.83.26.52.3.53.79.18.12-.09.24-.17.36-.25.1-.07.22-.11.29 0 .06.08-.01.18-.08.25-.25.24-.51.48-.77.71-.13.12-.26.23-.39.35-.06.06-.12.14-.08.21.05.08.14.05.22.02.38-.12.76-.26 1.16-.36.19-.05.44-.2.6 0 .15.19-.07.37-.15.55-.19.43-.51.79-.64 1.28.2.03.31-.08.43-.17.28-.23.56-.47.85-.69.13-.1.26-.3.45-.2.17.1.09.32.08.49-.02.38-.08.75-.12 1.12-.01.11-.07.27.08.32.15.05.2-.12.25-.21.22-.37.42-.75.63-1.12.06-.11.14-.22.28-.2.15.03.2.16.23.3l.3 1.34c.02.08 0 .21.15.19.12-.02.13-.12.15-.21.09-.44.17-.87.26-1.3.02-.11.02-.26.18-.28.18-.02.22.14.27.26.15.33.27.68.43 1 .07.14.07.42.3.36.14-.04.04-.28.03-.44-.04-.39-.07-.78-.09-1.17 0-.1-.02-.24.1-.28.11-.04.21.04.28.12.36.38.72.76 1.13 1.21-.03-.43-.29-.65-.4-.93-.11-.27-.51-.56-.29-.8.18-.2.52.14.79.23.23.08.43.26.76.3-.36-.34-.75-.49-1.08-.74-.1-.08-.28-.13-.23-.29.05-.15.22-.15.35-.16.39-.03.77-.04 1.16-.1-.31-.19-.66-.1-.98-.18-.1-.02-.21-.02-.32-.03-.08-.01-.18 0-.2-.1-.03-.11.05-.17.14-.23.21-.13.43-.26.73-.45-.37.02-.59.15-.82.24-.08.03-.16.07-.22 0-.07-.07 0-.16.04-.22.2-.39.41-.77.62-1.16-.03-.02-.06-.05-.09-.07-.26.26-.53.53-.8.79-.14.13-.28.36-.5.24-.21-.11-.14-.37-.11-.56.06-.38.08-.75.07-1.13 0-.1.06-.24-.09-.27-.09-.02-.15.09-.2.18-.21.38-.42.75-.64 1.12-.08.13-.16.34-.34.3-.17-.04-.18-.26-.19-.41-.04-.4-.05-.81-.09-1.21-.05-.48-.18-.54-.58-.29-.39.24-.68.6-1.04.9-.25.21-.48.55-.86.4-.35-.14-.39-.52-.42-.86-.04-.39-.09-.78-.15-1.16-.08-.51-.24-.66-.75-.63-.5.03-.99.11-1.48.18-.27.04-.53.03-.69-.2-.15-.23.01-.44.16-.62.33-.39.69-.76 1-1.15.37-.46.32-.56-.24-.71-.36-.09-.73-.2-1.09-.3-.12-.03-.27-.07-.25-.22.02-.13.17-.09.27-.09.3 0 .59.02.89.02.21 0 .42.05.69-.05-.3-.34-.7-.48-1.02-.73-.16-.13-.52-.23-.43-.4.12-.24.4 0 .61.05.35.08.66.29 1.11.32-.38-.38-.7-.7-1.1-1.08.44.07.66.4 1.09.5-.26-.32-.46-.56-.66-.8-.06-.07-.16-.14-.1-.24.06-.1.17-.06.26-.05.29.03.59.08.88.12.14.02.29.06.47-.01-.21-.5-.68-.57-1.11-.69-.31-.09-.63-.14-.92-.28-.63-.3-.86-.96-.57-1.59.15-.32.39-.58.59-.87.29-.4.56-.81.34-1.33-.25-.58-.8-.71-1.34-.83-.17-.04-.26.03-.25.21.05.79-.38 1.34-.9 1.86-.36.36-.75.69-.94 1.2-.35.95-.06 1.74.61 2.43.37.39.83.71 1.04 1.22.4.98.25 2.02-.67 2.86-.16.14-.32.29-.46.45-.35.42-.68.84-.5 1.44.02.08.06.22-.08.23-.12.01-.12-.12-.13-.21-.01-.11 0-.21.02-.32.05-.33.05-.33-.28-.37-.09-.01-.14-.08-.17-.16-.2-.5-.54-.9-.93-1.26a2.7 2.7 0 0 1-.07-3.87c.19-.19.37-.39.55-.59.92-1.09.89-2.41-.08-3.46-.36-.38-.76-.74-.99-1.22-.53-1.1-.29-2.3.64-3.25.36-.37.66-.77.88-1.24.2-.44.23-.88.07-1.33-.06-.17-.14-.36.09-.45.23-.1.36.08.43.25.12.33.21.67.3 1 .02.08 0 .15-.05.22-.58.71-.53 1.31.2 1.99.05-.48 0-.91-.03-1.34-.01-.16-.1-.35.21-.22.18.07.26-.1.3-.24.11-.33.2-.67.3-1.01.02-.06.02-.14.05-.2.11-.2.15-.54.46-.47.32.08.21.39.16.61-.24 1.14.31 1.42 1.44 1.64.45.09.87.21 1.11.64.26.45.21.91-.07 1.34-.18.28-.39.55-.58.82-.6.87-.29 1.71.74 1.97.35.09.71.17 1.04.3.72.28.99 1.02.61 1.69-.21.37-.47.72-.71 1.08-.14.22-.27.44-.25.71 0 .07-.03.18.06.21s.15-.04.19-.11c.21-.3.42-.6.64-.88.28-.37.42-.35.58.1.13.34.24.68.36 1.03.03.11.06.21.22.25.09-.35.04-.71.08-1.05.03-.24-.07-.61.22-.66.15-.02.19.39.24.62.06.32.12.63.21 1.05.27-.41.26-.83.39-1.19.04-.12-.01-.33.17-.31.17.01.12.22.14.34.04.24.04.48.07.72 0 .09.02.21.14.21.11 0 .09-.11.12-.18.13-.32.28-.64.39-.97.1-.3.22-.25.38-.05.27.35.55.69.85 1.07.18-.3.08-.55-.05-.77-.2-.33-.43-.65-.65-.97-.63-.92-.31-1.79.77-2.08.34-.09.68-.17 1.01-.29.76-.28 1-.96.59-1.66-.17-.29-.39-.55-.58-.82-.72-1.02-.33-1.95.9-2.15.24-.04.48-.09.7-.17.71-.25.88-.62.7-1.42-.05-.22-.27-.53.05-.64.31-.11.38.27.47.49.17.38.3.78.48 1.15.07.15.14.4.44.18.17-.12.14.12.14.2-.03.45-.07.9-.1 1.37.66-.29.92-1.41.31-1.9-.05-.04-.15-.04-.13-.12.11-.45.15-.93.44-1.33.07-.1.18-.11.29-.08.13.04.13.15.13.26 0 .05 0 .11-.02.16-.38 1.04.18 1.79.82 2.48.6.64 1.04 1.33 1.03 2.24 0 .86-.4 1.51-.99 2.09-.38.37-.72.76-.89 1.28-.28.88-.12 1.67.46 2.38.23.28.5.53.73.8.95 1.11.91 2.59-.1 3.65-.41.43-.82.85-1.05 1.42-.05.13-.09.21-.2.04-.06-.09-.14-.06-.21 0-.11.1-.17.07-.23-.06-.2-.46-.54-.8-.9-1.13-1.18-1.09-1.2-2.54-.07-3.69.24-.24.48-.47.7-.72.67-.77.72-2.15-.38-3.09-.53-.45-.97-.96-1.11-1.68-.13-.68-.14-.68-.8-.47-.83.27-1.1.97-.64 1.71.14.23.31.44.47.65.8 1.06.47 1.96-.83 2.26-.42.09-.85.17-1.2.44-.13.1-.3.2-.26.38.05.19.25.1.39.1.47 0 .94-.01 1.41 0 .35 0 .41.11.22.41-.23.36-.49.71-.73 1.06-.07.11-.22.23-.12.35.09.11.26.03.38 0 .4-.11.8-.24 1.2-.35.11-.03.27-.08.29.09.02.14-.14.13-.24.16-.21.05-.42.1-.63.14-.41.09-.48.23-.27.58.19.32.4.64.6.96.07.12.15.29.03.37-.13.09-.24-.07-.32-.17-.25-.3-.49-.61-.73-.91-.07-.09-.13-.21-.3-.21l.07-.06Z%27/%3E%3Cpath d=%27M9 24.01c.19.31.06.54-.18.82-.04-.33-.01-.58.18-.82ZM25.41 24.76c-.14-.15-.09-.28-.07-.41.02-.1-.02-.29.17-.23.14.04.14.18.08.31-.05.11-.12.21-.19.33h.01ZM25.86 23.9c.1.31.1.52.02.74-.18-.21-.17-.43-.02-.74Z%27/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%27a%27%3E%3Cpath fill=%27%23fff%27 d=%27M0 0h34.86v39H0z%27/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: top center; background-size: 10rem; } .swym-storefront-layout-empty-sfl-content > svg { display: none !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-item .swym-product-price { font-size: 1rem !important; font-size: var(--text-m) !important; font-weight: 400 !important; line-height: 130% !important; letter-spacing: 0.2px !important; color: #333333 !important; color: var(--colour-primary) !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-image-wrapper { aspect-ratio: 1/1 !important; } .swym-ui-component .swym-wishlist-grid .swym-wishlist-image-wrapper img { width: 100% !important; height: 100% !important; -o-object-fit: cover !important; object-fit: cover !important; } #swym-storefront-layout-section-container.swym-storefront-layout-layout .swym-storefront-layout-body { width: 100% !important; max-width: none !important; max-width: initial !important; padding-left: 1rem !important; padding-left: var(--padding-margin) !important; padding-right: 1rem !important; padding-right: var(--padding-margin) !important; } .swym-storefront-layout-grid-item-image-container, #swym-storefront-layout-section-container img.swym-storefront-layout-grid-item-image, .swym-storefront-layout-as-modal img.swym-storefront-layout-grid-item-image { border-radius: 0px !important; } .swym-storefront-layout-tab-button { text-transform: uppercase !important; } .swym-storefront-layout-tab-indicator:empty { bottom: 0.375rem !important; display: none !important; height: 0.125rem !important; border-radius: 0px !important; } .swym-storefront-layout-login-user-container, .swym-storefront-layout-tabs { border-bottom-width: 1px !important; --tw-border-opacity: 1 !important; border-color: rgba(239, 239, 239, 1) !important; border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)) !important; } .swym-storefront-layout-tabs, .swym-storefront-layout-header, .swym-storefront-layout-login-user-container { padding-left: 1rem !important; padding-left: var(--padding-margin) !important; padding-right: 1rem !important; padding-right: var(--padding-margin) !important; } .swym-storefront-layout-header, .swym-storefront-layout-login-user-container { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .swym-storefront-layout-items-container { gap: 1rem !important; } @media (min-width: 768px) { .swym-storefront-layout-items-container { gap: 1.5rem !important; } } swym-storefront-layout-notification { border-radius: 0px !important; border-style: none !important; } .swym-aw-nudge-dismiss-btn, swym-storefront-layout-notification img, swym-storefront-layout-notification-action, swym-storefront-layout-notification .swym-storefront-layout-notification-progress-bar { border-radius: 0px !important; } /* App Blocks */ .shopify-app-block { width: 100% !important; } /** * Form field styling * Defines consistent styles for inputs, selects, and form controls */ *, ::before, ::after { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59, 130, 246, 0.5); --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0); --tw-ring-shadow: 0 0 rgba(0,0,0,0); --tw-shadow: 0 0 rgba(0,0,0,0); --tw-shadow-colored: 0 0 rgba(0,0,0,0); --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; } ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59, 130, 246, 0.5); --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0); --tw-ring-shadow: 0 0 rgba(0,0,0,0); --tw-shadow: 0 0 rgba(0,0,0,0); --tw-shadow-colored: 0 0 rgba(0,0,0,0); --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; } /*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */ /* 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */ *, ::before, ::after { box-sizing: border-box; /* 1 */ border-width: 0; /* 2 */ border-style: solid; /* 2 */ border-color: #e5e7eb; /* 2 */ } ::before, ::after { --tw-content: ''; } /* 1. Use a consistent sensible line-height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. 5. Use the user's configured `sans` font-feature-settings by default. 6. Use the user's configured `sans` font-variation-settings by default. 7. Disable tap highlights on iOS */ html, :host { line-height: 1.5; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -moz-tab-size: 4; /* 3 */ -o-tab-size: 4; tab-size: 4; /* 3 */ font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */ font-feature-settings: normal; /* 5 */ font-variation-settings: normal; /* 6 */ -webkit-tap-highlight-color: transparent; /* 7 */ } /* 1. Remove the margin in all browsers. 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. */ body { margin: 0; /* 1 */ line-height: inherit; /* 2 */ } /* 1. Add the correct height in Firefox. 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 3. Ensure horizontal rules are visible by default. */ hr { height: 0; /* 1 */ color: inherit; /* 2 */ border-top-width: 1px; /* 3 */ } /* Add the correct text decoration in Chrome, Edge, and Safari. */ abbr:where([title]) { text-decoration: underline; -webkit-text-decoration: underline dotted currentColor; text-decoration: underline dotted currentColor; } /* Remove the default font size and weight for headings. */ h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } /* Reset links to optimize for opt-in styling instead of opt-out. */ a { color: inherit; text-decoration: inherit; } /* Add the correct font weight in Edge and Safari. */ b, strong { font-weight: bolder; } /* 1. Use the user's configured `mono` font-family by default. 2. Use the user's configured `mono` font-feature-settings by default. 3. Use the user's configured `mono` font-variation-settings by default. 4. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */ font-feature-settings: normal; /* 2 */ font-variation-settings: normal; /* 3 */ font-size: 1em; /* 4 */ } /* Add the correct font size in all browsers. */ small { font-size: 80%; } /* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) 3. Remove gaps between table borders by default. */ table { text-indent: 0; /* 1 */ border-color: inherit; /* 2 */ border-collapse: collapse; /* 3 */ } /* 1. Change the font styles in all browsers. 2. Remove the margin in Firefox and Safari. 3. Remove default padding in all browsers. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-feature-settings: inherit; /* 1 */ font-variation-settings: inherit; /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; /* 1 */ line-height: inherit; /* 1 */ letter-spacing: inherit; /* 1 */ color: inherit; /* 1 */ margin: 0; /* 2 */ padding: 0; /* 3 */ } /* Remove the inheritance of text transform in Edge and Firefox. */ button, select { text-transform: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Remove default button styles. */ button, input:where([type='button']), input:where([type='reset']), input:where([type='submit']) { -webkit-appearance: button; /* 1 */ background-color: transparent; /* 2 */ background-image: none; /* 2 */ } /* Use the modern Firefox focus style for all focusable elements. */ :-moz-focusring { outline: auto; } /* Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) */ :-moz-ui-invalid { box-shadow: none; } /* Add the correct vertical alignment in Chrome and Firefox. */ progress { vertical-align: baseline; } /* Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /* 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */ [type='search'] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /* Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Add the correct display in Chrome and Safari. */ summary { display: list-item; } /* Removes the default spacing and border for appropriate elements. */ blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } /* Reset default styling for dialogs. */ dialog { padding: 0; } /* Prevent resizing textareas horizontally by default. */ textarea { resize: vertical; } /* 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 2. Set the default placeholder color to the user's configured gray 400 color. */ input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::placeholder, textarea::placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } /* Set the default cursor for buttons. */ button, [role="button"] { cursor: pointer; } /* Make sure disabled buttons don't get the pointer cursor. */ :disabled { cursor: default; } /* 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) This can trigger a poorly considered lint error in some tools but is included by design. */ img, svg, video, canvas, audio, iframe, embed, object { display: block; /* 1 */ vertical-align: middle; /* 2 */ } /* Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) */ img, video { max-width: 100%; height: auto; } /* Make elements with the HTML hidden attribute stay hidden by default */ [hidden]:where(:not([hidden="until-found"])) { display: none; } body.overflow-hidden #shopify-section-topbar { z-index: 10; } body > svg { display: none; } @media print { header, footer, [data-id="topbar"] { display: none !important; } } .additional-checkout-buttons--horizontal, .additional-checkout-buttons--vertical { --shopify-accelerated-checkout-button-block-size: 44px; --shopify-accelerated-checkout-button-inline-size: 44px; --shopify-accelerated-checkout-skeleton-background-colour: transparent; --shopify-accelerated-checkout-button-border-radius: 0px; --shopify-accelerated-checkout-skeleton-animation-duration: 0.3s; } body.additional-checkout-buttons--horizontal.is-collapsed #shopify-section-topbar { z-index: 10; } .additional-checkout-buttons--horizontal.is-collapsed { padding-bottom: 0 !important; } .additional-checkout-buttons--horizontal.is-collapsed { pointer-events: none; height: 0; overflow: hidden; opacity: 0; } bodybody[\:has\(\[data-body-lock\]\[data-ui\%3D\%22visible\%22\]\)] #shopify-section-topbar { z-index: 10; } bodybody:has([data-body-lock][data-ui="visible"]) #shopify-section-topbar { z-index: 10; } body[\:has\(\[data-body-lock\]\[data-ui\%3D\%22visible\%22\]\)] { overflow: hidden; } body:has([data-body-lock][data-ui="visible"]) { overflow: hidden; } .grid-main { display: grid; grid-auto-rows: min-content; grid-template-columns: repeat(4, 1fr); grid-template-columns: var(--grid-main); -moz-column-gap: 0.5rem; column-gap: 0.5rem; grid-column-gap: 0.5rem; grid-column-gap: var(--padding-gutter); -moz-column-gap: var(--padding-gutter); column-gap: var(--padding-gutter); } html { font-size: 16px; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; scroll-behavior: smooth; letter-spacing: 0.2px; } html strong { font-weight: 700; } html { letter-spacing: 0.2px; } html strong { font-weight: 700; } html { font-family: Calibre, Arial, sans-serif; font-weight: 400; --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } :root { touch-action: pan-x pan-y; } html, body { touch-action: manipulation; } [type='text'],input:where(:not([type])),[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: #fff; border-color: #6b7280; border-width: 1px; border-radius: 0px; padding-top: 0.5rem; padding-right: 0.75rem; padding-bottom: 0.5rem; padding-left: 0.75rem; font-size: 1rem; line-height: 1.5rem; --tw-shadow: 0 0 rgba(0,0,0,0); } [type='text']:focus, input:where(:not([type])):focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: #2563eb; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); border-color: #2563eb; } input::-moz-placeholder, textarea::-moz-placeholder { color: #6b7280; opacity: 1; } input::placeholder,textarea::placeholder { color: #6b7280; opacity: 1; } ::-webkit-datetime-edit-fields-wrapper { padding: 0; } ::-webkit-date-and-time-value { min-height: 1.5em; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field { padding-top: 0; padding-bottom: 0; } select { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3E%3Cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3E%3C/svg%3E"); background-position: right 0.5rem center; background-repeat: no-repeat; background-size: 1.5em 1.5em; padding-right: 2.5rem; -webkit-print-color-adjust: exact; print-color-adjust: exact; } [multiple],[size]:where(select:not([size="1"])) { background-image: none; background-image: initial; background-position: 0 0; background-position: initial; background-repeat: repeat; background-repeat: initial; background-size: auto auto; background-size: initial; padding-right: 0.75rem; -webkit-print-color-adjust: inherit; print-color-adjust: inherit; } [type='checkbox'],[type='radio'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 0; -webkit-print-color-adjust: exact; print-color-adjust: exact; display: inline-block; vertical-align: middle; background-origin: border-box; -webkit-user-select: none; -moz-user-select: none; user-select: none; flex-shrink: 0; height: 1rem; width: 1rem; color: #2563eb; background-color: #fff; border-color: #6b7280; border-width: 1px; --tw-shadow: 0 0 rgba(0,0,0,0); } [type='checkbox'] { border-radius: 0px; } [type='radio'] { border-radius: 100%; } [type='checkbox']:focus,[type='radio']:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/); --tw-ring-offset-width: 2px; --tw-ring-offset-color: #fff; --tw-ring-color: #2563eb; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } [type='checkbox']:checked,[type='radio']:checked { border-color: transparent; background-color: currentColor; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; } [type='checkbox']:checked { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox=%270 0 16 16%27 fill=%27%23fff%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z%27/%3E%3C/svg%3E"); } @media (forced-colors: active) { [type='checkbox']:checked { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; } } [type='radio']:checked { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox=%270 0 16 16%27 fill=%27%23fff%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Ccircle cx=%278%27 cy=%278%27 r=%273%27/%3E%3C/svg%3E"); } @media (forced-colors: active) { [type='radio']:checked { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; } } [type='checkbox']:checked:hover,[type='checkbox']:checked:focus,[type='radio']:checked:hover,[type='radio']:checked:focus { border-color: transparent; background-color: currentColor; } [type='checkbox']:indeterminate { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 16 16%27%3E%3Cpath stroke=%27%23fff%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%272%27 d=%27M4 8h8%27/%3E%3C/svg%3E"); border-color: transparent; background-color: currentColor; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; } @media (forced-colors: active) { [type='checkbox']:indeterminate { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; } } [type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus { border-color: transparent; background-color: currentColor; } [type='file'] { background: transparent none repeat 0 0 / auto auto padding-box border-box scroll; background: initial; border-color: inherit; border-width: 0; border-radius: 0; padding: 0; font-size: inherit; line-height: inherit; } [type='file']:focus { outline: 1px solid ButtonText; outline: 1px auto -webkit-focus-ring-color; } :root { --tw-rotate-x: 0; --tw-rotate-y: 0; --tw-translate-z: 0; --tw-scale-z: 1; --tw-rotate-3d: 0,0,0,0deg; } html { font-size: 16px; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; scroll-behavior: smooth; letter-spacing: 0.2px; } html strong { font-weight: 700; } html { letter-spacing: 0.2px; } html strong { font-weight: 700; } html { font-family: Calibre, Arial, sans-serif; font-weight: 400; --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } body.overflow-hidden #shopify-section-topbar { z-index: 10; } body > svg { display: none; } @media print { header, footer, [data-id="topbar"] { display: none !important; } } /* Layout classes for the checkout buttons for the mini cart */ .additional-checkout-buttons--horizontal, .additional-checkout-buttons--vertical { --shopify-accelerated-checkout-button-block-size: 44px; --shopify-accelerated-checkout-button-inline-size: 44px; --shopify-accelerated-checkout-skeleton-background-colour: transparent; --shopify-accelerated-checkout-button-border-radius: 0px; --shopify-accelerated-checkout-skeleton-animation-duration: 0.3s; } body.additional-checkout-buttons--horizontal.is-collapsed #shopify-section-topbar { z-index: 10; } .additional-checkout-buttons--horizontal.is-collapsed { padding-bottom: 0 !important; } .additional-checkout-buttons--horizontal.is-collapsed { pointer-events: none; height: 0; overflow: hidden; opacity: 0; } /* Body lock class added to visibility components to lock scroll on body while open*/ bodybody[\:has\(\[data-body-lock\]\[data-ui\%3D\%22visible\%22\]\)] #shopify-section-topbar { z-index: 10; } bodybody:has([data-body-lock][data-ui="visible"]) #shopify-section-topbar { z-index: 10; } body[\:has\(\[data-body-lock\]\[data-ui\%3D\%22visible\%22\]\)] { overflow: hidden; } body:has([data-body-lock][data-ui="visible"]) { overflow: hidden; } /* Main grid class for various content areas */ .grid-main { display: grid; grid-auto-rows: min-content; grid-template-columns: repeat(4, 1fr); grid-template-columns: var(--grid-main); -moz-column-gap: 0.5rem; column-gap: 0.5rem; grid-column-gap: 0.5rem; grid-column-gap: var(--padding-gutter); -moz-column-gap: var(--padding-gutter); column-gap: var(--padding-gutter); } :root { touch-action: pan-x pan-y; } html, body { touch-action: manipulation; } .\!container { width: 100% !important; } .container { width: 100%; } @media (min-width: 375px) { .\!container { max-width: 375px !important; } .container { max-width: 375px; } } @media (min-width: 768px) { .\!container { max-width: 768px !important; } .container { max-width: 768px; } } @media (min-width: 1024px) { .\!container { max-width: 1024px !important; } .container { max-width: 1024px; } } @media (min-width: 1440px) { .\!container { max-width: 1440px !important; } .container { max-width: 1440px; } } @media (min-width: 1828px) { .\!container { max-width: 1828px !important; } .container { max-width: 1828px; } } @media (min-width: 2560px) { .\!container { max-width: 2560px !important; } .container { max-width: 2560px; } } .field-l { height: 56px; } .field-m { height: 44px; } .field-container { position: relative; display: flex; width: 100%; background-color: transparent; color: #333333; color: var(--colour-primary); } .field-container_lined { border-bottom-width: 1px; --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); padding-bottom: 0.5rem; } .field-icon { pointer-events: none; position: absolute; top: 50%; right: 0; display: flex; --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .field-input { height: 100%; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-style: none; background-color: transparent; background-image: none; padding: 0; color: #333333; color: var(--colour-primary); outline: 2px solid transparent; outline-offset: 2px; } .field-input::-moz-placeholder { letter-spacing: 0.2px; } .field-input::placeholder { letter-spacing: 0.2px; } .field-input strong::-moz-placeholder { font-weight: 700; } .field-input strong::placeholder { font-weight: 700; } .field-input::-moz-placeholder { letter-spacing: 0.2px; } .field-input::placeholder { letter-spacing: 0.2px; } .field-input strong::-moz-placeholder { font-weight: 700; } .field-input strong::placeholder { font-weight: 700; } .field-input::-moz-placeholder { font-family: Calibre, Arial, sans-serif; text-transform: uppercase; --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .field-input::placeholder { font-family: Calibre, Arial, sans-serif; text-transform: uppercase; --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .field-input:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)); --tw-ring-offset-width: 0px; } .field-input[\:has\(~.field-icon\)] { padding-right: 1.5rem; } .field-input:has(~.field-icon) { padding-right: 1.5rem; } select.field-input { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { select.field-input:hover { opacity: 0.5; } } select.field-input { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { select.field-input:hover { opacity: 0.5; } } input.field-input { cursor: text; } textarea.field-input { cursor: text; resize: none; } .field-radio { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; outline-width: 1px !important; outline-offset: 0px !important; outline-color: #333333 !important; outline-color: var(--colour-primary) !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; --tw-ring-offset-width: 0px !important; } .field-radio { outline-style: solid; width: 0.938rem; height: 0.938rem; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 9999px; border-width: 2px; border-color: #ffffff; border-color: var(--colour-secondary); background-color: transparent; color: #333333; color: var(--colour-primary); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .field-radio:checked { border-color: #ffffff !important; border-color: var(--colour-secondary) !important; background-color: #333333 !important; background-color: var(--colour-primary) !important; background-image: none !important; } @media (hover: hover) and (pointer: fine) { .field-radio:hover { border-color: #333333; border-color: var(--colour-primary); background-color: #333333; background-color: var(--colour-primary); } } .field-checkbox { border-width: 1px !important; border-color: #333333 !important; border-color: var(--colour-primary) !important; --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; outline-width: 0px !important; outline-offset: 0px !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; --tw-ring-offset-width: 0px !important; } .field-checkbox { outline-style: solid; width: 0.938rem; height: 0.938rem; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; color: #333333; color: var(--colour-primary); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .field-checkbox:checked { border-color: #333333 !important; border-color: var(--colour-primary) !important; background-color: #333333 !important; background-color: var(--colour-primary) !important; } @media (hover: hover) and (pointer: fine) { .field-checkbox:hover { border-color: #333333; border-color: var(--colour-primary); background-color: #333333; background-color: var(--colour-primary); } } .field-label { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .field-label { line-height: 130%; } } .field-label { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .field-label { line-height: 130%; } } .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .peer:-moz-placeholder-shown ~ .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .peer:placeholder-shown ~ .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .peer:focus ~ .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .paragraph-2xl { font-size: 1.875rem; font-size: var(--text-2xl); line-height: 150%; } .paragraph-xl { font-size: 1.5rem; font-size: var(--text-xl); line-height: 150%; } .paragraph-l { font-size: 1.125rem; font-size: var(--text-l); line-height: 150%; } .paragraph-m { font-size: 1rem; font-size: var(--text-m); line-height: 130%; } .paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .paragraph-s { line-height: 130%; } } .paragraph-xs { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; } .paragraph-2xs { font-size: 0.688rem; font-size: var(--text-2xs); line-height: 130%; } .\!font-base { letter-spacing: 0.2px; } .font-base { letter-spacing: 0.2px; } .\!font-base strong { font-weight: 700; } .font-base strong { font-weight: 700; } .richtext a { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .richtext a:hover { opacity: 0.5; } } .richtext a { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .richtext a:hover { opacity: 0.5; } } .richtext>*:not(:last-child) { margin-bottom: 1em; } .richtext ul { margin-left: 2rem; } .richtext ul li { list-style-position: outside; list-style-type: disc; } .richtext ol { margin-left: 2rem; } .richtext ol li { list-style-position: outside; list-style-type: decimal; } .richtext * { max-width: 100%; } .text-line { text-decoration-line: underline; text-decoration-style: solid; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none; } /* Paragraph Styles */ .paragraph-2xl { font-size: 1.875rem; font-size: var(--text-2xl); line-height: 150%; } .paragraph-xl { font-size: 1.5rem; font-size: var(--text-xl); line-height: 150%; } .paragraph-l { font-size: 1.125rem; font-size: var(--text-l); line-height: 150%; } .paragraph-m { font-size: 1rem; font-size: var(--text-m); line-height: 130%; } .paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .paragraph-s { line-height: 130%; } } .paragraph-xs { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; } .paragraph-2xs { font-size: 0.688rem; font-size: var(--text-2xs); line-height: 130%; } /* Text Styles */ .\!font-base { letter-spacing: 0.2px; } .font-base { letter-spacing: 0.2px; } .\!font-base strong { font-weight: 700; } .font-base strong { font-weight: 700; } .richtext a { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .richtext a:hover { opacity: 0.5; } } .richtext a { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .richtext a:hover { opacity: 0.5; } } .richtext>*:not(:last-child) { margin-bottom: 1em; } .richtext ul { margin-left: 2rem; } .richtext ul li { list-style-position: outside; list-style-type: disc; } .richtext ol { margin-left: 2rem; } .richtext ol li { list-style-position: outside; list-style-type: decimal; } .richtext * { max-width: 100%; } .text-line { text-decoration-line: underline; text-decoration-style: solid; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none; } .field-l { height: 56px; } .field-m { height: 44px; } .field-container { position: relative; display: flex; width: 100%; background-color: transparent; color: #333333; color: var(--colour-primary); } .field-container_lined { border-bottom-width: 1px; --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); padding-bottom: 0.5rem; } .field-icon { pointer-events: none; position: absolute; top: 50%; right: 0; display: flex; --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .field-input { height: 100%; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-style: none; background-color: transparent; background-image: none; padding: 0; color: #333333; color: var(--colour-primary); outline: 2px solid transparent; outline-offset: 2px; } .field-input::-moz-placeholder { letter-spacing: 0.2px; } .field-input::placeholder { letter-spacing: 0.2px; } .field-input strong::-moz-placeholder { font-weight: 700; } .field-input strong::placeholder { font-weight: 700; } .field-input::-moz-placeholder { letter-spacing: 0.2px; } .field-input::placeholder { letter-spacing: 0.2px; } .field-input strong::-moz-placeholder { font-weight: 700; } .field-input strong::placeholder { font-weight: 700; } .field-input::-moz-placeholder { font-family: Calibre, Arial, sans-serif; text-transform: uppercase; --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .field-input::placeholder { font-family: Calibre, Arial, sans-serif; text-transform: uppercase; --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .field-input:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)); --tw-ring-offset-width: 0px; } .field-input[\:has\(~.field-icon\)] { padding-right: 1.5rem; } .field-input:has(~.field-icon) { padding-right: 1.5rem; } select.field-input { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { select.field-input:hover { opacity: 0.5; } } select.field-input { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { select.field-input:hover { opacity: 0.5; } } input.field-input { cursor: text; } textarea.field-input { cursor: text; resize: none; } .field-radio { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; outline-width: 1px !important; outline-offset: 0px !important; outline-color: #333333 !important; outline-color: var(--colour-primary) !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; --tw-ring-offset-width: 0px !important; } .field-radio { outline-style: solid; width: 0.938rem; height: 0.938rem; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 9999px; border-width: 2px; border-color: #ffffff; border-color: var(--colour-secondary); background-color: transparent; color: #333333; color: var(--colour-primary); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .field-radio:checked { border-color: #ffffff !important; border-color: var(--colour-secondary) !important; background-color: #333333 !important; background-color: var(--colour-primary) !important; background-image: none !important; } @media (hover: hover) and (pointer: fine) { .field-radio:hover { border-color: #333333; border-color: var(--colour-primary); background-color: #333333; background-color: var(--colour-primary); } } .field-checkbox { border-width: 1px !important; border-color: #333333 !important; border-color: var(--colour-primary) !important; --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; outline-width: 0px !important; outline-offset: 0px !important; --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; --tw-ring-offset-width: 0px !important; } .field-checkbox { outline-style: solid; width: 0.938rem; height: 0.938rem; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; color: #333333; color: var(--colour-primary); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .field-checkbox:checked { border-color: #333333 !important; border-color: var(--colour-primary) !important; background-color: #333333 !important; background-color: var(--colour-primary) !important; } @media (hover: hover) and (pointer: fine) { .field-checkbox:hover { border-color: #333333; border-color: var(--colour-primary); background-color: #333333; background-color: var(--colour-primary); } } .field-label { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .field-label { line-height: 130%; } } .field-label { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .field-label { line-height: 130%; } } .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .peer:-moz-placeholder-shown ~ .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .peer:placeholder-shown ~ .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .peer:focus ~ .field-label { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } .pointer-events-none { pointer-events: none; } .pointer-events-auto { pointer-events: auto; } .\!visible { visibility: visible !important; } .visible { visibility: visible; } .invisible { visibility: hidden; } .collapse { visibility: collapse; } .static { position: static; } .fixed { position: fixed; } .\!absolute { position: absolute !important; } .absolute { position: absolute; } .relative { position: relative; } .sticky { position: sticky; } .inset-0 { top: 0; right: 0; bottom: 0; left: 0; } .inset-1\.5 { top: 1.5rem; right: 1.5rem; bottom: 1.5rem; left: 1.5rem; } .\!bottom-0\.375 { bottom: 0.375rem !important; } .\!right-margin { right: 1rem !important; right: var(--padding-margin) !important; } .-left-0\.625 { left: -0.625rem; } .-right-0\.25 { right: -0.25rem; } .-right-0\.625 { right: -0.625rem; } .-top-0\.625 { top: -0.625rem; } .bottom-0 { bottom: 0; } .bottom-1 { bottom: 1rem; } .bottom-1\/2 { bottom: 50%; } .bottom-20 { bottom: 5rem; } .bottom-margin { bottom: 1rem; bottom: var(--padding-margin); } .left-0 { left: 0; } .left-1\/2 { left: 50%; } .left-\[--padding-left\] { left: var(--padding-left); } .left-margin { left: 1rem; left: var(--padding-margin); } .right-0 { right: 0; } .right-\[--padding-right\] { right: var(--padding-right); } .right-margin { right: 1rem; right: var(--padding-margin); } .top-0 { top: 0; } .top-0\.25 { top: 0.25rem; } .top-1\/2 { top: 50%; } .top-\[50\%\] { top: 50%; } .top-\[var\(--sticky-offset\)\] { top: var(--sticky-offset); } .top-header { top: 45px; top: var(--height-header); } .top-header-adapt { top: 45px; top: var(--height-header-adapt); } .top-margin { top: 1rem; top: var(--padding-margin); } .top-unset { top: auto; top: initial; } .-z-1 { z-index: -1; } .-z-2 { z-index: -2; } .z-0 { z-index: 0; } .z-1 { z-index: 1; } .z-10 { z-index: 10; } .z-110 { z-index: 110; } .z-2 { z-index: 2; } .z-20 { z-index: 20; } .z-3 { z-index: 3; } .z-30 { z-index: 30; } .z-40 { z-index: 40; } .z-50 { z-index: 50; } .z-60 { z-index: 60; } .z-70 { z-index: 70; } .z-80 { z-index: 80; } .z-\[110\] { z-index: 110; } .z-\[4\] { z-index: 4; } .z-\[71\] { z-index: 71; } .z-index { z-index: 0; z-index: var(--z-index); } .col-\[--column-span\] { grid-column: var(--column-span); } .col-span-full { grid-column: 1 / -1; } .mx-\[calc\(var\(--thumb-size\)_\/_-2\)\] { margin-left: calc(1.25rem / -2); margin-left: calc(var(--thumb-size) / -2); margin-right: calc(1.25rem / -2); margin-right: calc(var(--thumb-size) / -2); } .mx-auto { margin-left: auto; margin-right: auto; } .\!mr-1 { margin-right: 1rem !important; } .\!mt-0 { margin-top: 0 !important; } .-mb-px { margin-bottom: -1px; } .-ml-\[--padding-left\] { margin-left: calc(var(--padding-left) * -1); } .-ml-margin { margin-left: calc(1rem * -1); margin-left: calc(var(--padding-margin) * -1); } .-mr-0\.25 { margin-right: -0.25rem; } .-mt-0\.25 { margin-top: -0.25rem; } .-mt-header { margin-top: calc(45px * -1); margin-top: calc(var(--height-header) * -1); } .mb-2\.5 { margin-bottom: 2.5rem; } .mb-\[1em\] { margin-bottom: 1em; } .mr-0\.5 { margin-right: 0.5rem; } .mr-\[--carousel-gap-mb\] { margin-right: var(--carousel-gap-mb); } .mt-0\.25 { margin-top: 0.25rem; } .mt-0\.5 { margin-top: 0.5rem; } .mt-0\.75 { margin-top: 0.75rem; } .mt-1 { margin-top: 1rem; } .mt-2 { margin-top: 2rem; } .mt-2\.5 { margin-top: 2.5rem; } .\!block { display: block !important; } .block { display: block; } .inline { display: inline; } .\!flex { display: flex !important; } .flex { display: flex; } .inline-flex { display: inline-flex; } .table { display: table; } .\!grid { display: grid !important; } .grid { display: grid; } .contents { display: contents; } .\!hidden { display: none !important; } .hidden { display: none; } .aspect-1\/1 { aspect-ratio: 1/1; } .aspect-1\/2 { aspect-ratio: 1/2; } .aspect-10\/9 { aspect-ratio: 10/9; } .aspect-16\/9 { aspect-ratio: 16/9; } .aspect-2\/1 { aspect-ratio: 2/1; } .aspect-2\/3 { aspect-ratio: 2/3; } .aspect-21\/9 { aspect-ratio: 21/9; } .aspect-3\/2 { aspect-ratio: 3/2; } .aspect-3\/4 { aspect-ratio: 3/4; } .aspect-4\/3 { aspect-ratio: 4/3; } .aspect-4\/5 { aspect-ratio: 4/5; } .aspect-5\/4 { aspect-ratio: 5/4; } .aspect-9\/10 { aspect-ratio: 9/10; } .aspect-9\/16 { aspect-ratio: 9/16; } .aspect-9\/21 { aspect-ratio: 9/21; } .aspect-\[--bg-ratio\] { aspect-ratio: var(--bg-ratio); } .\!size-0 { width: 0 !important; height: 0 !important; } .\!size-fit { width: -moz-fit-content !important; width: fit-content !important; height: -moz-fit-content !important; height: fit-content !important; } .\!size-full { width: 100% !important; height: 100% !important; } .size-0\.75 { width: 0.75rem; height: 0.75rem; } .size-0\.938 { width: 0.938rem; height: 0.938rem; } .size-\[10px\] { width: 10px; height: 10px; } .size-\[12px\] { width: 12px; height: 12px; } .size-\[14px\] { width: 14px; height: 14px; } .size-\[15px\] { width: 15px; height: 15px; } .size-\[16px\] { width: 16px; height: 16px; } .size-\[17px\] { width: 17px; height: 17px; } .size-\[18px\] { width: 18px; height: 18px; } .size-\[20px\] { width: 20px; height: 20px; } .size-\[24px\] { width: 24px; height: 24px; } .size-\[28px\] { width: 28px; height: 28px; } .size-\[40px\] { width: 40px; height: 40px; } .size-\[44px\] { width: 44px; height: 44px; } .size-\[9px\] { width: 9px; height: 9px; } .size-fit { width: -moz-fit-content; width: fit-content; height: -moz-fit-content; height: fit-content; } .size-full { width: 100%; height: 100%; } .\!h-0\.125 { height: 0.125rem !important; } .\!h-\[32px\] { height: 32px !important; } .\!h-\[44px\] { height: 44px !important; } .\!h-auto { height: auto !important; } .h-0 { height: 0; } .h-0\.125 { height: 0.125rem; } .h-1\.125 { height: 1.125rem; } .h-1\.25 { height: 1.25rem; } .h-6 { height: 6rem; } .h-\[--custom-height-pc\] { height: var(--custom-height-pc); } .h-\[--custom-height-px\] { height: var(--custom-height-px); } .h-\[--icon-height\] { height: var(--icon-height); } .h-\[--override-height\] { height: var(--override-height); } .h-\[--thumb-size\] { height: 1.25rem; height: var(--thumb-size); } .h-\[10px\] { height: 10px; } .h-\[12px\] { height: 12px; } .h-\[17px\] { height: 17px; } .h-\[18px\] { height: 18px; } .h-\[20px\] { height: 20px; } .h-\[23px\] { height: 23px; } .h-\[25px\] { height: 25px; } .h-\[36px\] { height: 36px; } .h-\[40px\] { height: 40px; } .h-\[44px\] { height: 44px; } .h-\[4px\] { height: 4px; } .h-\[56px\] { height: 56px; } .h-\[60px\] { height: 60px; } .h-\[70dvh\] { height: 70dvh; } .h-auto { height: auto; } .h-fit { height: -moz-fit-content; height: fit-content; } .h-full { height: 100%; } .h-header { height: 45px; height: var(--height-header); } .h-inherit { height: inherit; } .h-px { height: 1px; } .h-screen-adapt { height: calc(100vh - 45px); height: var(--height-screen-adapt); } .h-screen-height { height: calc(100vh - 45px); height: var(--height-screen); } .h-view { height: 100vh; height: var(--height-view); } .\!max-h-\[18rem\] { max-height: 18rem !important; } .\!max-h-\[36rem\] { max-height: 36rem !important; } .max-h-0 { max-height: 0; } .max-h-\[--custom-height-px\] { max-height: var(--custom-height-px); } .max-h-\[18px\] { max-height: 18px; } .max-h-\[89vh\] { max-height: 89vh; } .max-h-view { max-height: 100vh; max-height: var(--height-view); } .\!min-h-\[44px\] { min-height: 44px !important; } .min-h-\[1\.25em\] { min-height: 1.25em; } .min-h-\[180px\] { min-height: 180px; } .min-h-\[56px\] { min-height: 56px; } .min-h-\[68px\] { min-height: 68px; } .min-h-screen-height { min-height: calc(100vh - 45px); min-height: var(--height-screen); } .min-h-view { min-height: 100vh; min-height: var(--height-view); } .\!w-fit { width: -moz-fit-content !important; width: fit-content !important; } .\!w-full { width: 100% !important; } .w-1\/2 { width: 50%; } .w-1\/4 { width: 25%; } .w-2 { width: 2rem; } .w-6 { width: 6rem; } .w-\[--carousel-columns-mb\] { width: var(--carousel-columns-mb); } .w-\[--icon-width\] { width: var(--icon-width); } .w-\[--override-width\] { width: var(--override-width); } .w-\[--thumb-size\] { width: 1.25rem; width: var(--thumb-size); } .w-\[100px\] { width: 100px; } .w-\[120px\] { width: 120px; } .w-\[14px\] { width: 14px; } .w-\[15px\] { width: 15px; } .w-\[16px\] { width: 16px; } .w-\[18px\] { width: 18px; } .w-\[19px\] { width: 19px; } .w-\[27px\] { width: 27px; } .w-\[44px\] { width: 44px; } .w-\[6px\] { width: 6px; } .w-\[87vw\] { width: 87vw; } .w-\[calc\(100\%\+var\(--padding-left\)\+var\(--padding-right\)\)\] { width: calc(100% + var(--padding-left) + var(--padding-right)); } .w-\[calc\(100\%-var\(--padding-left\)-var\(--padding-right\)\)\] { width: calc(100% - var(--padding-left) - var(--padding-right)); } .w-\[calc\(100\%_\+_var\(--thumb-size\)\)\] { width: calc(100% + 1.25rem); width: calc(100% + var(--thumb-size)); } .w-auto { width: auto; } .w-fit { width: -moz-fit-content; width: fit-content; } .w-full { width: 100%; } .w-full-margin { width: calc(100% + (1rem * 2)); width: calc(100% + (var(--padding-margin) * 2)); } .w-full-marginless { width: calc(100% - (1rem * 2)); width: calc(100% - (var(--padding-margin) * 2)); } .w-shipping-bar-width { width: var(--shipping-bar-width); } .min-w-0 { min-width: 0; } .min-w-gap-1\/3 { min-width: calc((100% / 3) - 0.5px); } .\!max-w-none { max-width: none !important; } .\!max-w-unset { max-width: none !important; max-width: initial !important; } .max-w-\[--custom-width-pc\] { max-width: var(--custom-width-pc); } .max-w-\[--custom-width-px\] { max-width: var(--custom-width-px); } .max-w-\[250px\] { max-width: 250px; } .max-w-\[360px\] { max-width: 360px; } .max-w-\[400px\] { max-width: 400px; } .max-w-\[480px\] { max-width: 480px; } .max-w-\[500px\] { max-width: 500px; } .max-w-\[89vw\] { max-width: 89vw; } .max-w-fit { max-width: -moz-fit-content; max-width: fit-content; } .max-w-full { max-width: 100%; } .max-w-gap-1\/2 { max-width: calc((100% / 2) - 0.5px); } .max-w-gap-1\/5 { max-width: calc((100% / 5) - 0.5px); } .max-w-gap-2\/5 { max-width: calc((100% / 5) * 2 - 0.5px); } .max-w-gap-3\/5 { max-width: calc((100% / 5) * 3 - 0.5px); } .max-w-gap-4\/5 { max-width: calc((100% / 5) * 4 - 0.5px); } .flex-1 { flex: 1 1 0%; } .flex-shrink-0 { flex-shrink: 0; } .shrink-0 { flex-shrink: 0; } .flex-grow { flex-grow: 1; } .grow { flex-grow: 1; } .grow-0 { flex-grow: 0; } .basis-\[--carousel-columns-mb\] { flex-basis: var(--carousel-columns-mb); } .basis-full { flex-basis: 100%; } .basis-gap-7\/8 { flex-basis: calc((100% / 8) - 0.5px); } .basis-info-sidebar { flex-basis: 33%; } .table-fixed { table-layout: fixed; } .border-collapse { border-collapse: collapse; } .-translate-x-1\/2 { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-translate-x-full { --tw-translate-x: -100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-translate-x-full-margin { --tw-translate-x: calc(calc(100% + (var(--padding-margin) * 2)) * -1); transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-translate-y-1\/2 { --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-translate-y-full { --tw-translate-y: -100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .translate-x-full { --tw-translate-x: 100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .scale-\[0\.8\] { --tw-scale-x: 0.8; --tw-scale-y: 0.8; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @keyframes pulse { 50% { opacity: .5; } } .animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } .\!cursor-e-resize { cursor: e-resize !important; } .\!cursor-pointer { cursor: pointer !important; } .\!cursor-w-resize { cursor: w-resize !important; } .cursor-e-resize { cursor: e-resize; } .cursor-n-resize { cursor: n-resize; } .cursor-pointer { cursor: pointer; } .cursor-s-resize { cursor: s-resize; } .cursor-text { cursor: text; } .cursor-w-resize { cursor: w-resize; } .cursor-zoom-in { cursor: zoom-in; } .resize { resize: both; } .snap-x { scroll-snap-type: x var(--tw-scroll-snap-strictness); } .snap-mandatory { --tw-scroll-snap-strictness: mandatory; } .snap-center { scroll-snap-align: center; } .scroll-mt-32 { scroll-margin-top: 8rem; } .list-decimal { list-style-type: decimal; } .list-disc { list-style-type: disc; } .list-none { list-style-type: none; } .appearance-none { -webkit-appearance: none; -moz-appearance: none; appearance: none; } .grid-flow-col { grid-auto-flow: column; } .auto-rows-min { grid-auto-rows: min-content; } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-\[--grid-columns\] { grid-template-columns: 4; grid-template-columns: var(--grid-columns); } .grid-cols-\[--nav-menus-grid\] { grid-template-columns: var(--nav-menus-grid); } .grid-cols-full-max-full { grid-template-columns: 1fr max-content 1fr; } .grid-cols-main { grid-template-columns: repeat(4, 1fr); grid-template-columns: var(--grid-main); } .\!grid-rows-\[0fr\] { grid-template-rows: 0fr !important; } .\!grid-rows-\[1fr\] { grid-template-rows: 1fr !important; } .grid-rows-auto-col { grid-template-rows: repeat(var(--grid-rows), auto); } .flex-row { flex-direction: row; } .flex-row-reverse { flex-direction: row-reverse; } .flex-col { flex-direction: column; } .flex-col-reverse { flex-direction: column-reverse; } .flex-wrap { flex-wrap: wrap; } .flex-wrap-reverse { flex-wrap: wrap-reverse; } .flex-nowrap { flex-wrap: nowrap; } .\!items-start { align-items: flex-start !important; } .items-start { align-items: flex-start; } .items-end { align-items: flex-end; } .\!items-center { align-items: center !important; } .items-center { align-items: center; } .items-stretch { align-items: stretch; } .\!justify-start { justify-content: flex-start !important; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .\!justify-center { justify-content: center !important; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .justify-around { justify-content: space-around; } .\!gap-1 { gap: 1rem !important; } .gap-0\.25 { gap: 0.25rem; } .gap-0\.75 { gap: 0.75rem; } .gap-1 { gap: 1rem; } .gap-1\.25 { gap: 1.25rem; } .gap-1\.5 { gap: 1.5rem; } .gap-2 { gap: 2rem; } .gap-gutter { gap: 0.5rem; gap: var(--padding-gutter); } .gap-px { gap: 1px; } .\!gap-x-0 { -moz-column-gap: 0 !important; column-gap: 0 !important; } .\!gap-x-0\.5 { -moz-column-gap: 0.5rem !important; column-gap: 0.5rem !important; } .gap-x-0\.25 { -moz-column-gap: 0.25rem; column-gap: 0.25rem; } .gap-x-0\.375 { -moz-column-gap: 0.375rem; column-gap: 0.375rem; } .gap-x-0\.5 { -moz-column-gap: 0.5rem; column-gap: 0.5rem; } .gap-x-0\.625 { -moz-column-gap: 0.625rem; column-gap: 0.625rem; } .gap-x-0\.75 { -moz-column-gap: 0.75rem; column-gap: 0.75rem; } .gap-x-1 { -moz-column-gap: 1rem; column-gap: 1rem; } .gap-x-1\.5 { -moz-column-gap: 1.5rem; column-gap: 1.5rem; } .gap-x-2\.5 { -moz-column-gap: 2.5rem; column-gap: 2.5rem; } .gap-x-\[--carousel-gap-mb\] { -moz-column-gap: var(--carousel-gap-mb); column-gap: var(--carousel-gap-mb); } .gap-x-\[--display-gap-inline\] { -moz-column-gap: var(--display-gap-inline); column-gap: var(--display-gap-inline); } .gap-x-\[0\.25em\] { -moz-column-gap: 0.25em; column-gap: 0.25em; } .gap-x-gutter { -moz-column-gap: 0.5rem; column-gap: 0.5rem; -moz-column-gap: var(--padding-gutter); column-gap: var(--padding-gutter); } .gap-y-0\.125 { row-gap: 0.125rem; } .gap-y-0\.25 { row-gap: 0.25rem; } .gap-y-0\.5 { row-gap: 0.5rem; } .gap-y-0\.625 { row-gap: 0.625rem; } .gap-y-0\.75 { row-gap: 0.75rem; } .gap-y-1 { row-gap: 1rem; } .gap-y-1\.25 { row-gap: 1.25rem; } .gap-y-1\.5 { row-gap: 1.5rem; } .gap-y-2 { row-gap: 2rem; } .gap-y-2\.5 { row-gap: 2.5rem; } .gap-y-\[--carousel-gap-mb\] { row-gap: var(--carousel-gap-mb); } .gap-y-\[--display-gap-block\] { row-gap: var(--display-gap-block); } .overflow-hidden { overflow: hidden; } .overflow-visible { overflow: visible; } .overflow-x-auto { overflow-x: auto; } .overflow-y-auto { overflow-y: auto; } .overflow-x-hidden { overflow-x: hidden; } .overflow-y-hidden { overflow-y: hidden; } .overflow-x-scroll { overflow-x: scroll; } .overflow-y-scroll { overflow-y: scroll; } .overscroll-none { overscroll-behavior: none; } .overscroll-y-none { overscroll-behavior-y: none; } .overscroll-x-none { overscroll-behavior-x: none; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .text-ellipsis { text-overflow: ellipsis; } .whitespace-normal { white-space: normal; } .whitespace-nowrap { white-space: nowrap; } .\!rounded-none { border-radius: 0px !important; } .rounded-\[--border-radius\] { border-radius: var(--border-radius); } .rounded-full { border-radius: 9999px; } .rounded-none { border-radius: 0px; } .\!border { border-width: 1px !important; } .\!border-0 { border-width: 0px !important; } .border { border-width: 1px; } .border-0 { border-width: 0px; } .border-2 { border-width: 2px; } .\!border-x-0 { border-left-width: 0px !important; border-right-width: 0px !important; } .border-x { border-left-width: 1px; border-right-width: 1px; } .border-y { border-top-width: 1px; border-bottom-width: 1px; } .\!border-b { border-bottom-width: 1px !important; } .\!border-t-0 { border-top-width: 0px !important; } .border-b { border-bottom-width: 1px; } .border-l { border-left-width: 1px; } .border-r { border-right-width: 1px; } .border-t { border-top-width: 1px; } .\!border-solid { border-style: solid !important; } .border-none { border-style: none; } .\!border-\[--text-colour\] { border-color: var(--text-colour) !important; } .\!border-primary { border-color: #333333 !important; border-color: var(--colour-primary) !important; } .border-\[--border-colour\] { border-color: var(--border-colour); } .border-\[--button-colour-bg\] { border-color: var(--button-colour-bg); } .border-\[--button-colour\] { border-color: var(--button-colour); } .border-\[--text-colour\] { border-color: var(--text-colour); } .border-borders-default { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); } .border-secondary { border-color: #ffffff; border-color: var(--colour-secondary); } .border-tertiary { border-color: #7a4594; border-color: var(--colour-tertiary); } .border-t-borders-default { --tw-border-opacity: 1; border-top-color: rgba(239, 239, 239, 1); border-top-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); } .\!bg-accent { background-color: #ff543b !important; background-color: var(--colour-accent) !important; } .\!bg-transparent { background-color: transparent !important; } .bg-\[--bg-colour\] { background-color: var(--bg-colour); } .bg-\[--button-colour-bg\] { background-color: var(--button-colour-bg); } .bg-\[--section-bg-colour\2c theme\(colors\.brand\.white\)\] { background-color: #ffffff; background-color: var(--section-bg-colour,#ffffff); } .bg-\[--section-bg-colour\] { background-color: var(--section-bg-colour); } .bg-accent { background-color: #ff543b; background-color: var(--colour-accent); } .bg-brand-black { --tw-bg-opacity: 1; background-color: rgba(51, 51, 51, 1); background-color: rgba(51, 51, 51, var(--tw-bg-opacity, 1)); } .bg-brand-black\/60 { background-color: rgba(51, 51, 51, 0.6); } .bg-brand-purple { --tw-bg-opacity: 1; background-color: rgba(122, 69, 148, 1); background-color: rgba(122, 69, 148, var(--tw-bg-opacity, 1)); } .bg-brand-white { --tw-bg-opacity: 1; background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); } .bg-button-disabled { --tw-bg-opacity: 1; background-color: rgba(233, 229, 220, 1); background-color: rgba(233, 229, 220, var(--tw-bg-opacity, 1)); } .bg-inherit { background-color: inherit; } .bg-page-secondary { --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); } .bg-page-warning { --tw-bg-opacity: 1; background-color: rgba(254, 252, 234, 1); background-color: rgba(254, 252, 234, var(--tw-bg-opacity, 1)); } .bg-secondary { background-color: #ffffff; background-color: var(--colour-secondary); } .bg-transparent { background-color: transparent; } .bg-type-black-primary\/60 { background-color: rgba(51, 51, 51, 0.6); } .bg-white { --tw-bg-opacity: 1; background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); } .bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); } .bg-none { background-image: none; } .from-\[\#f0f0f0\] { --tw-gradient-from: #f0f0f0 var(--tw-gradient-from-position); --tw-gradient-to: rgba(240, 240, 240, 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .to-\[\#9b9b9b\] { --tw-gradient-to: #9b9b9b var(--tw-gradient-to-position); } .object-contain { -o-object-fit: contain; object-fit: contain; } .object-cover { -o-object-fit: cover; object-fit: cover; } .object-fill { -o-object-fit: fill; object-fit: fill; } .object-none { -o-object-fit: none; object-fit: none; } .object-scale-down { -o-object-fit: scale-down; object-fit: scale-down; } .\!p-0 { padding: 0 !important; } .\!p-0\.625 { padding: 0.625rem !important; } .p-0 { padding: 0; } .p-0\.313 { padding: 0.313rem; } .p-0\.625 { padding: 0.625rem; } .p-0\.75 { padding: 0.75rem; } .p-1 { padding: 1rem; } .p-2\.5 { padding: 2.5rem; } .p-margin { padding: 1rem; padding: var(--padding-margin); } .\!px-0 { padding-left: 0 !important; padding-right: 0 !important; } .\!px-1 { padding-left: 1rem !important; padding-right: 1rem !important; } .\!px-1\.25 { padding-left: 1.25rem !important; padding-right: 1.25rem !important; } .\!px-1\.5 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; } .\!py-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .\!py-0\.25 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; } .\!py-0\.375 { padding-top: 0.375rem !important; padding-bottom: 0.375rem !important; } .\!py-1 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .px-0\.375 { padding-left: 0.375rem; padding-right: 0.375rem; } .px-0\.5 { padding-left: 0.5rem; padding-right: 0.5rem; } .px-1 { padding-left: 1rem; padding-right: 1rem; } .px-1\.25 { padding-left: 1.25rem; padding-right: 1.25rem; } .px-1\.5 { padding-left: 1.5rem; padding-right: 1.5rem; } .px-margin { padding-left: 1rem; padding-left: var(--padding-margin); padding-right: 1rem; padding-right: var(--padding-margin); } .px-margin-double { padding-left: calc(1rem * 2); padding-left: calc(var(--padding-margin) * 2); padding-right: calc(1rem * 2); padding-right: calc(var(--padding-margin) * 2); } .py-0\.188 { padding-top: 0.188rem; padding-bottom: 0.188rem; } .py-0\.25 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .py-0\.5 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .py-0\.625 { padding-top: 0.625rem; padding-bottom: 0.625rem; } .py-0\.75 { padding-top: 0.75rem; padding-bottom: 0.75rem; } .py-0\.813 { padding-top: 0.813rem; padding-bottom: 0.813rem; } .py-0\.875 { padding-top: 0.875rem; padding-bottom: 0.875rem; } .py-1 { padding-top: 1rem; padding-bottom: 1rem; } .py-1\.25 { padding-top: 1.25rem; padding-bottom: 1.25rem; } .py-1\.5 { padding-top: 1.5rem; padding-bottom: 1.5rem; } .py-3 { padding-top: 3rem; padding-bottom: 3rem; } .py-3\.5 { padding-top: 3.5rem; padding-bottom: 3.5rem; } .py-6\.25 { padding-top: 6.25rem; padding-bottom: 6.25rem; } .\!pl-margin { padding-left: 1rem !important; padding-left: var(--padding-margin) !important; } .\!pr-3 { padding-right: 3rem !important; } .\!pt-0 { padding-top: 0 !important; } .pb-0\.25 { padding-bottom: 0.25rem; } .pb-0\.5 { padding-bottom: 0.5rem; } .pb-0\.75 { padding-bottom: 0.75rem; } .pb-1 { padding-bottom: 1rem; } .pb-1\.5 { padding-bottom: 1.5rem; } .pb-1\.875 { padding-bottom: 1.875rem; } .pb-\[--padding-bottom\] { padding-bottom: var(--padding-bottom); } .pb-margin { padding-bottom: 1rem; padding-bottom: var(--padding-margin); } .pb-px { padding-bottom: 1px; } .pl-0\.875 { padding-left: 0.875rem; } .pl-\[--padding-left\] { padding-left: var(--padding-left); } .pl-margin { padding-left: 1rem; padding-left: var(--padding-margin); } .pl-margin-double { padding-left: calc(1rem * 2); padding-left: calc(var(--padding-margin) * 2); } .pr-0\.625 { padding-right: 0.625rem; } .pr-1 { padding-right: 1rem; } .pr-2 { padding-right: 2rem; } .pr-\[--padding-right\] { padding-right: var(--padding-right); } .pr-margin { padding-right: 1rem; padding-right: var(--padding-margin); } .pr-margin-rem { padding-right: calc(1rem - 1rem); padding-right: calc(var(--padding-margin) - 1rem); } .pt-0\.25 { padding-top: 0.25rem; } .pt-0\.75 { padding-top: 0.75rem; } .pt-1 { padding-top: 1rem; } .pt-2\.5 { padding-top: 2.5rem; } .pt-\[--padding-top\] { padding-top: var(--padding-top); } .pt-margin { padding-top: 1rem; padding-top: var(--padding-margin); } .\!text-left { text-align: left !important; } .text-left { text-align: left; } .\!text-center { text-align: center !important; } .text-center { text-align: center; } .text-right { text-align: right; } .\!font-base { font-family: Calibre, Arial, sans-serif !important; } .font-base { font-family: Calibre, Arial, sans-serif; } .\!text-m { font-size: 1rem !important; font-size: var(--text-m) !important; } .\!text-s { font-size: 0.875rem !important; font-size: var(--text-s) !important; } .text-2xl { font-size: 1.875rem; font-size: var(--text-2xl); } .text-2xs { font-size: 0.688rem; font-size: var(--text-2xs); } .text-l { font-size: 1.125rem; font-size: var(--text-l); } .text-m { font-size: 1rem; font-size: var(--text-m); } .text-s { font-size: 0.875rem; font-size: var(--text-s); } .text-xl { font-size: 1.5rem; font-size: var(--text-xl); } .text-xs { font-size: 0.813rem; font-size: var(--text-xs); } .\!font-normal { font-weight: 400 !important; } .font-bold { font-weight: 700; } .font-medium { font-weight: 500; } .font-normal { font-weight: 400; } .\!uppercase { text-transform: uppercase !important; } .uppercase { text-transform: uppercase; } .capitalize { text-transform: capitalize; } .italic { font-style: italic; } .\!leading-130 { line-height: 130% !important; } .\!leading-none { line-height: 1 !important; } .leading-150 { line-height: 150%; } .leading-none { line-height: 1; } .\!tracking-0\.2 { letter-spacing: 0.2px !important; } .tracking-0\.8 { letter-spacing: 0.8px; } .tracking-wide { letter-spacing: 0.025em; } .\!text-\[--text-colour\] { color: var(--text-colour) !important; } .\!text-secondary { color: #ffffff !important; color: var(--colour-secondary) !important; } .text-\[--button-colour\] { color: var(--button-colour); } .text-\[--button-text-colour\] { color: var(--button-text-colour); } .text-\[--card-text-colour\] { color: var(--card-text-colour); } .text-\[--text-colour\] { color: var(--text-colour); } .text-accent { color: #ff543b; color: var(--colour-accent); } .text-brand-black { --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .text-brand-orange { --tw-text-opacity: 1; color: rgba(255, 84, 59, 1); color: rgba(255, 84, 59, var(--tw-text-opacity, 1)); } .text-brand-white { --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .text-primary { color: #333333; color: var(--colour-primary); } .text-secondary { color: #ffffff; color: var(--colour-secondary); } .text-tertiary { color: #7a4594; color: var(--colour-tertiary); } .text-type-black-primary { --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .text-type-black-secondary { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .text-type-error { --tw-text-opacity: 1; color: rgba(201, 33, 27, 1); color: rgba(201, 33, 27, var(--tw-text-opacity, 1)); } .text-type-success { --tw-text-opacity: 1; color: rgba(59, 133, 132, 1); color: rgba(59, 133, 132, var(--tw-text-opacity, 1)); } .text-type-warning { --tw-text-opacity: 1; color: rgba(193, 139, 0, 1); color: rgba(193, 139, 0, var(--tw-text-opacity, 1)); } .text-white { --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .underline { text-decoration-line: underline; } .line-through { text-decoration-line: line-through; } .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .opacity-0 { opacity: 0; } .opacity-100 { opacity: 1; } .opacity-45 { opacity: 0.45; } .opacity-50 { opacity: 0.5; } .\!shadow-none { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .shadow-minicart-sidebar { --tw-shadow: -5px 0px 20px -4px rgba(0, 0, 0, 0.1); --tw-shadow-colored: -5px 0px 20px -4px var(--tw-shadow-color); box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow); } .\!outline-none { outline: 2px solid transparent !important; outline-offset: 2px !important; } .outline-none { outline: 2px solid transparent; outline-offset: 2px; } .\!outline-0 { outline-width: 0px !important; } .\!outline-1 { outline-width: 1px !important; } .\!outline-offset-0 { outline-offset: 0px !important; } .\!outline-primary { outline-color: #333333 !important; outline-color: var(--colour-primary) !important; } .\!ring-0 { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; } .\!ring-offset-0 { --tw-ring-offset-width: 0px !important; } .blur { --tw-blur: blur(8px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .grayscale { --tw-grayscale: grayscale(100%); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .\!transition-all { transition-property: all !important; transition-timing-function: ease !important; transition-duration: 0.3s !important; } .transition { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-timing-function: ease; transition-duration: 0.3s; } .transition-\[height\] { transition-property: height; transition-timing-function: ease; transition-duration: 0.3s; } .transition-\[top\2c height\] { transition-property: top,height; transition-timing-function: ease; transition-duration: 0.3s; } .transition-all { transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .transition-background { transition-property: background-color, background-image, background-position, background-size, background-repeat; transition-timing-function: ease; transition-duration: 0.3s; } .duration-300 { transition-duration: 300ms; } .content-blank { --tw-content: ""; content: var(--tw-content); } .btn { display: flex; cursor: pointer; align-items: center; justify-content: center; -moz-column-gap: 0.5rem; column-gap: 0.5rem; text-align: center; text-transform: uppercase; line-height: 1; letter-spacing: 0.8px; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .btn.focus-visible { outline-width: 0px !important; } .btn:focus-visible { outline-width: 0px !important; } .btn:disabled { cursor: not-allowed; } .btn:not(.btn-text) { border-width: 1px; } .btn.btn-fill:disabled { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .btn.btn-border:disabled { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .btn.btn-transparent:hover, .btn.btn-transparent.active, .btn.btn-text:not(.link-line):hover, .btn.btn-text:not(.link-line).active { opacity: 0.5; } .btn .btn-loading-overlay { position: absolute; z-index: 2; display: none; width: 100%; height: 100%; align-items: center; justify-content: center; background-color: inherit; top: 0; left: 0; } .btn .btn-loading-overlay[data-ui~="visible"] { display: flex; } .btn .btn-loading-overlay >div { width: 18px; height: 18px; } .btn .btn-loading-overlay >div > * { pointer-events: none; width: 100%; height: 100%; animation: spinner 1.4s linear infinite; } .btn-primary { --tw-border-opacity: 1; border-color: rgba(51, 51, 51, 1); border-color: rgba(51, 51, 51, var(--tw-border-opacity, 1)); } .btn-primary.btn-fill { --tw-bg-opacity: 1; background-color: rgba(51, 51, 51, 1); background-color: rgba(51, 51, 51, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .btn-primary.btn-fill:hover, .btn-primary.btn-fill.active { border-color: #ff543b; border-color: var(--colour-accent); background-color: #ff543b; background-color: var(--colour-accent); } .btn-primary.btn-border { --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-primary.btn-border:hover, .btn-primary.btn-border.active { --tw-border-opacity: 1; border-color: rgba(51, 51, 51, 1); border-color: rgba(51, 51, 51, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(51, 51, 51, 1); background-color: rgba(51, 51, 51, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .btn-primary.btn-transparent, .btn-primary.btn-text { --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-secondary { --tw-border-opacity: 1; border-color: rgba(255, 255, 255, 1); border-color: rgba(255, 255, 255, var(--tw-border-opacity, 1)); } .btn-secondary.btn-fill { --tw-bg-opacity: 1; background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-secondary.btn-fill:hover, .btn-secondary.btn-fill.active { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); } .btn-secondary.btn-border { --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .btn-secondary.btn-border:hover, .btn-secondary.btn-border.active { --tw-border-opacity: 1; border-color: rgba(255, 255, 255, 1); border-color: rgba(255, 255, 255, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-secondary.btn-transparent, .btn-secondary.btn-text { color: #ffffff; color: var(--colour-secondary); } .btn-tertiary { border-color: #7a4594; border-color: var(--colour-tertiary); } @media (hover: hover) and (pointer: fine) { .btn-tertiary:hover { opacity: 0.5; } } .btn-tertiary.btn-fill { background-color: #7a4594; background-color: var(--colour-tertiary); color: #ffffff; color: var(--colour-secondary); } .btn-tertiary.btn-border { color: #7a4594; color: var(--colour-tertiary); } .btn-tertiary.btn-transparent, .btn-tertiary.btn-text { color: #7a4594; color: var(--colour-tertiary); } .btn-accent { border-color: #ff543b; border-color: var(--colour-accent); } .btn-accent.btn-fill { background-color: #ff543b; background-color: var(--colour-accent); color: #ffffff; color: var(--colour-secondary); } .btn-accent.btn-fill:hover, .btn-accent.btn-fill.active { opacity: 0.5; } .btn-accent.btn-border { color: #ff543b; color: var(--colour-accent); } .btn-accent.btn-border:hover, .btn-accent.btn-border.active { background-color: #ff543b; background-color: var(--colour-accent); --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-accent.btn-transparent, .btn-accent.btn-text { color: #ff543b; color: var(--colour-accent); } .btn-custom { border-color: var(--button-colour-bg); } @media (hover: hover) and (pointer: fine) { .btn-custom:hover { opacity: 0.5; } } .btn-custom.btn-fill { background-color: var(--button-colour-bg); color: var(--button-colour); } .btn-custom.btn-border { border-color: var(--button-colour); color: var(--button-colour); } .btn-custom.btn-transparent, .btn-custom.btn-text { color: var(--button-colour); } .btn-transparent { border-color: transparent; } .btn-text { padding-left: 0 !important; padding-right: 0 !important; } .btn-text { background-color: transparent; } .btn-l { font-size: 1rem; font-size: var(--text-m); line-height: 130%; padding-left: 1.5rem; padding-right: 1.5rem; } .btn-l:not(.btn-text) { height: 56px; } .btn-l.btn-text { height: 44px; } .btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .btn-m { line-height: 130%; } } .btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .btn-m { line-height: 130%; } } .btn-m { height: 44px; padding-left: 1.5rem; padding-right: 1.5rem; } .btn-s { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; height: 36px; padding-left: 1rem; padding-right: 1rem; } .btn-square { padding: 0 !important; } .btn-square { aspect-ratio: 1/1; align-items: center; justify-content: center; text-align: center; } .link-fade { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .link-fade:hover { opacity: 0.5; } } .link-line span { position: relative; white-space: nowrap; padding-bottom: 0.25rem; } @media (max-width: 767px) { .link-line span { max-width: 28rem; } } .link-line span:after { background-color: currentColor; transition: max-width 0.4s cubic-bezier(0.42, 0, 1, 1); position: absolute; bottom: 0; left: 0; height: 1px; width: 100%; max-width: 0; --tw-content: ""; content: var(--tw-content); } .link-line:hover span:after, .link-line.active span:after, .link-line.lined span:after { max-width: 28rem; } .range::-ms-track { appearance: none; background: transparent; border: transparent; } .range::-moz-range-track { -moz-appearance: none; appearance: none; background: transparent; border: transparent; } .range:focus::-webkit-slider-runnable-track { -webkit-appearance: none; appearance: none; background: transparent; border: transparent; } .range::-ms-thumb { appearance: none; pointer-events: all; width: 1.25rem; width: var(--thumb-size); height: 1.25rem; height: var(--thumb-size); border-radius: 0px; border: 0 none; cursor: grab; background-color: red; } .range::-ms-thumb:active { cursor: grabbing; } .range::-moz-range-thumb { -moz-appearance: none; appearance: none; pointer-events: all; width: 1.25rem; width: var(--thumb-size); height: 1.25rem; height: var(--thumb-size); border-radius: 0px; border: 0 none; cursor: grab; background-color: red; } .range::-moz-range-thumb:active { cursor: grabbing; } .range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; pointer-events: all; width: 1.25rem; width: var(--thumb-size); height: 1.25rem; height: var(--thumb-size); border-radius: 0px; border: 0 none; cursor: grab; background-color: red; } .range::-webkit-slider-thumb:active { cursor: grabbing; } .result-card[\:has\(.tile-s\)] { grid-column: span 1 / span 1; } .result-card:has(.tile-s) { grid-column: span 1 / span 1; } .result-card[\:has\(.tile-m\)] { grid-column: 1 / -1; } .result-card:has(.tile-m) { grid-column: 1 / -1; } @media (min-width: 768px) { .result-card[\:has\(.tile-m\)] { grid-column: span 2 / span 2; } .result-card:has(.tile-m) { grid-column: span 2 / span 2; } } .result-card[\:has\(.tile-l\)] { grid-column: 1 / -1; } .result-card:has(.tile-l) { grid-column: 1 / -1; } .bg-linear-bg-rtl { background: linear-gradient(-90deg, var(--bg-colour) 0%, transparent 100%); } .bg-linear-bg-ltr { background: linear-gradient(90deg, var(--bg-colour) 0%, transparent 100%); } .container-full { margin-left: calc(1rem * -1); margin-left: calc(var(--padding-margin) * -1); width: calc(100% + (1rem * 2)); width: calc(100% + (var(--padding-margin) * 2)); padding-left: 1rem; padding-left: var(--padding-margin); padding-right: 1rem; padding-right: var(--padding-margin); } .inset-tr { top: 0; right: 0; } .inset-tl { top: 0; left: 0; } .inset-bl { bottom: 0; left: 0; } .inset-br { bottom: 0; right: 0; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration, input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; } input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { margin: 0; } input[type="number"] { -moz-appearance: textfield; } input[type="number"]:hover, input[type="number"]:focus { -moz-appearance: number-input; } [data-visibility-open] { cursor: pointer; } .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar { display: none; } details { -webkit-appearance: none; -moz-appearance: none; appearance: none; } details summary { list-style-type: none; } details summary::marker, details summary::-webkit-details-marker { display: none; } .dropdown-modal .dropdown-content { grid-template-rows: 0fr !important; } .dropdown-modal .dropdown-content { display: grid; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .dropdown-modal[data-ui="visible"] .dropdown-content { grid-template-rows: 1fr !important; } .mob-alt>*:first-child { display: none; } @media (min-width: 768px) { .mob-alt>*:first-child { display: block; } .mob-alt>*:nth-child(2) { display: none; } } .mob-alt_lg>*:first-child { display: none; } @media (min-width: 1024px) { .mob-alt_lg>*:first-child { display: block; } .mob-alt_lg>*:nth-child(2) { display: none; } } header[\:has\(sticky-header\:not\(\[data-visible\%3D\%22visible\%22\]\)\)] { pointer-events: none; } header:has(sticky-header:not([data-visible="visible"])) { pointer-events: none; } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] { --header-primary: var(--colour-secondary); --header-secondary: var(--colour-primary); } .page-content:has(main > *:first-child > div.transparent.theme_light) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) { --header-primary: var(--colour-secondary); --header-secondary: var(--colour-primary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] { --header-primary: var(--colour-primary); --header-secondary: var(--colour-secondary); } .page-content:has(main > *:first-child > div.transparent.theme_dark) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) { --header-primary: var(--colour-primary); --header-secondary: var(--colour-secondary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] { color: var(--header-primary); background-color: transparent; } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) { color: var(--header-primary); background-color: transparent; } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .wkh-icon { --icon-stroke: var(--header-primary); } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .wkh-icon { --icon-stroke: var(--header-primary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .header__account-logged-in, .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .wk-selected .wkh-icon, .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .wkh-selected .wkh-icon { --icon-fill: var(--header-primary); } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .header__account-logged-in, .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .wk-selected .wkh-icon, .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .wkh-selected .wkh-icon { --icon-fill: var(--header-primary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .cart-count { color: var(--header-secondary); background-color: var(--header-primary); } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .cart-count { color: var(--header-secondary); background-color: var(--header-primary); } .header-svg-link { transition: opacity .25s cubic-bezier(0.075, 0.82, 0.165, 1), transform .25s cubic-bezier(0.075, 0.82, 0.165, 1); } .transform { transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), 0) rotateX(0) rotateY(0) rotateZ(var(--tw-rotate)) rotate3d(0,0,0,0deg) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scale3d(var(--tw-scale-x),var(--tw-scale-y),1) !important; transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), var(--tw-translate-z)) rotateX(var(--tw-rotate-x)) rotateY(var(--tw-rotate-y)) rotateZ(var(--tw-rotate)) rotate3d(var(--tw-rotate-3d)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scale3d(var(--tw-scale-x),var(--tw-scale-y),var(--tw-scale-z)) !important; } /* Button Styles */ /* Button Base */ .btn { display: flex; cursor: pointer; align-items: center; justify-content: center; -moz-column-gap: 0.5rem; column-gap: 0.5rem; text-align: center; text-transform: uppercase; line-height: 1; letter-spacing: 0.8px; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .btn.focus-visible { outline-width: 0px !important; } .btn:focus-visible { outline-width: 0px !important; } .btn:disabled { cursor: not-allowed; } .btn:not(.btn-text) { border-width: 1px; } .btn.btn-fill:disabled { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .btn.btn-border:disabled { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .btn.btn-transparent:hover, .btn.btn-transparent.active, .btn.btn-text:not(.link-line):hover, .btn.btn-text:not(.link-line).active { opacity: 0.5; } .btn .btn-loading-overlay { position: absolute; z-index: 2; display: none; width: 100%; height: 100%; align-items: center; justify-content: center; background-color: inherit; top: 0; left: 0; } .btn .btn-loading-overlay[data-ui~="visible"] { display: flex; } .btn .btn-loading-overlay >div { width: 18px; height: 18px; } .btn .btn-loading-overlay >div > * { pointer-events: none; width: 100%; height: 100%; animation: spinner 1.4s linear infinite; } /* Button Colours */ .btn-primary { --tw-border-opacity: 1; border-color: rgba(51, 51, 51, 1); border-color: rgba(51, 51, 51, var(--tw-border-opacity, 1)); } .btn-primary.btn-fill { --tw-bg-opacity: 1; background-color: rgba(51, 51, 51, 1); background-color: rgba(51, 51, 51, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .btn-primary.btn-fill:hover, .btn-primary.btn-fill.active { border-color: #ff543b; border-color: var(--colour-accent); background-color: #ff543b; background-color: var(--colour-accent); } .btn-primary.btn-border { --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-primary.btn-border:hover, .btn-primary.btn-border.active { --tw-border-opacity: 1; border-color: rgba(51, 51, 51, 1); border-color: rgba(51, 51, 51, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(51, 51, 51, 1); background-color: rgba(51, 51, 51, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .btn-primary.btn-transparent, .btn-primary.btn-text { --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-secondary { --tw-border-opacity: 1; border-color: rgba(255, 255, 255, 1); border-color: rgba(255, 255, 255, var(--tw-border-opacity, 1)); } .btn-secondary.btn-fill { --tw-bg-opacity: 1; background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-secondary.btn-fill:hover, .btn-secondary.btn-fill.active { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); } .btn-secondary.btn-border { --tw-text-opacity: 1; color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); } .btn-secondary.btn-border:hover, .btn-secondary.btn-border.active { --tw-border-opacity: 1; border-color: rgba(255, 255, 255, 1); border-color: rgba(255, 255, 255, var(--tw-border-opacity, 1)); --tw-bg-opacity: 1; background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-secondary.btn-transparent, .btn-secondary.btn-text { color: #ffffff; color: var(--colour-secondary); } .btn-tertiary { border-color: #7a4594; border-color: var(--colour-tertiary); } @media (hover: hover) and (pointer: fine) { .btn-tertiary:hover { opacity: 0.5; } } .btn-tertiary.btn-fill { background-color: #7a4594; background-color: var(--colour-tertiary); color: #ffffff; color: var(--colour-secondary); } .btn-tertiary.btn-border { color: #7a4594; color: var(--colour-tertiary); } .btn-tertiary.btn-transparent, .btn-tertiary.btn-text { color: #7a4594; color: var(--colour-tertiary); } .btn-accent { border-color: #ff543b; border-color: var(--colour-accent); } .btn-accent.btn-fill { background-color: #ff543b; background-color: var(--colour-accent); color: #ffffff; color: var(--colour-secondary); } .btn-accent.btn-fill:hover, .btn-accent.btn-fill.active { opacity: 0.5; } .btn-accent.btn-border { color: #ff543b; color: var(--colour-accent); } .btn-accent.btn-border:hover, .btn-accent.btn-border.active { background-color: #ff543b; background-color: var(--colour-accent); --tw-text-opacity: 1; color: rgba(51, 51, 51, 1); color: rgba(51, 51, 51, var(--tw-text-opacity, 1)); } .btn-accent.btn-transparent, .btn-accent.btn-text { color: #ff543b; color: var(--colour-accent); } .btn-custom { border-color: var(--button-colour-bg); } @media (hover: hover) and (pointer: fine) { .btn-custom:hover { opacity: 0.5; } } .btn-custom.btn-fill { background-color: var(--button-colour-bg); color: var(--button-colour); } .btn-custom.btn-border { border-color: var(--button-colour); color: var(--button-colour); } .btn-custom.btn-transparent, .btn-custom.btn-text { color: var(--button-colour); } .btn-transparent { border-color: transparent; } .btn-text { padding-left: 0 !important; padding-right: 0 !important; } .btn-text { background-color: transparent; } /* Button Sizes */ .btn-l { font-size: 1rem; font-size: var(--text-m); line-height: 130%; padding-left: 1.5rem; padding-right: 1.5rem; } .btn-l:not(.btn-text) { height: 56px; } .btn-l.btn-text { height: 44px; } .btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .btn-m { line-height: 130%; } } .btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .btn-m { line-height: 130%; } } .btn-m { height: 44px; padding-left: 1.5rem; padding-right: 1.5rem; } .btn-s { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; height: 36px; padding-left: 1rem; padding-right: 1rem; } .btn-square { padding: 0 !important; } .btn-square { aspect-ratio: 1/1; align-items: center; justify-content: center; text-align: center; } /* Link Styles */ .link-fade { cursor: pointer; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } @media (hover: hover) and (pointer: fine) { .link-fade:hover { opacity: 0.5; } } .link-line span { position: relative; white-space: nowrap; padding-bottom: 0.25rem; } @media (max-width: 767px) { .link-line span { max-width: 28rem; } } .link-line span:after { background-color: currentColor; transition: max-width 0.4s cubic-bezier(0.42, 0, 1, 1); position: absolute; bottom: 0; left: 0; height: 1px; width: 100%; max-width: 0; --tw-content: ""; content: var(--tw-content); } .link-line:hover span:after, .link-line.active span:after, .link-line.lined span:after { max-width: 28rem; } /* Range Slider */ .range::-ms-track { appearance: none; background: transparent; border: transparent; } .range::-moz-range-track { -moz-appearance: none; appearance: none; background: transparent; border: transparent; } .range:focus::-webkit-slider-runnable-track { -webkit-appearance: none; appearance: none; background: transparent; border: transparent; } .range::-ms-thumb { appearance: none; pointer-events: all; width: 1.25rem; width: var(--thumb-size); height: 1.25rem; height: var(--thumb-size); border-radius: 0px; border: 0 none; cursor: grab; background-color: red; } .range::-ms-thumb:active { cursor: grabbing; } .range::-moz-range-thumb { -moz-appearance: none; appearance: none; pointer-events: all; width: 1.25rem; width: var(--thumb-size); height: 1.25rem; height: var(--thumb-size); border-radius: 0px; border: 0 none; cursor: grab; background-color: red; } .range::-moz-range-thumb:active { cursor: grabbing; } .range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; pointer-events: all; width: 1.25rem; width: var(--thumb-size); height: 1.25rem; height: var(--thumb-size); border-radius: 0px; border: 0 none; cursor: grab; background-color: red; } .range::-webkit-slider-thumb:active { cursor: grabbing; } /* Disruptor Tile */ .result-card[\:has\(.tile-s\)] { grid-column: span 1 / span 1; } .result-card:has(.tile-s) { grid-column: span 1 / span 1; } .result-card[\:has\(.tile-m\)] { grid-column: 1 / -1; } .result-card:has(.tile-m) { grid-column: 1 / -1; } @media (min-width: 768px) { .result-card[\:has\(.tile-m\)] { grid-column: span 2 / span 2; } .result-card:has(.tile-m) { grid-column: span 2 / span 2; } } .result-card[\:has\(.tile-l\)] { grid-column: 1 / -1; } .result-card:has(.tile-l) { grid-column: 1 / -1; } /* Linear Background */ .bg-linear-bg-rtl { background: linear-gradient(-90deg, var(--bg-colour) 0%, transparent 100%); } .bg-linear-bg-ltr { background: linear-gradient(90deg, var(--bg-colour) 0%, transparent 100%); } /* Spacing Settings */ .container-full { margin-left: calc(1rem * -1); margin-left: calc(var(--padding-margin) * -1); width: calc(100% + (1rem * 2)); width: calc(100% + (var(--padding-margin) * 2)); padding-left: 1rem; padding-left: var(--padding-margin); padding-right: 1rem; padding-right: var(--padding-margin); } .inset-tr { top: 0; right: 0; } .inset-tl { top: 0; left: 0; } .inset-bl { bottom: 0; left: 0; } .inset-br { bottom: 0; right: 0; } /* Input Settings */ input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration, input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; } input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { margin: 0; } input[type="number"] { -moz-appearance: textfield; } input[type="number"]:hover, input[type="number"]:focus { -moz-appearance: number-input; } [data-visibility-open] { cursor: pointer; } /* Scrollbar Settings */ .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar { display: none; } /* Details + Summary Default Styling */ details { -webkit-appearance: none; -moz-appearance: none; appearance: none; } details summary { list-style-type: none; } details summary::marker, details summary::-webkit-details-marker { display: none; } .dropdown-modal .dropdown-content { grid-template-rows: 0fr !important; } .dropdown-modal .dropdown-content { display: grid; transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .dropdown-modal[data-ui="visible"] .dropdown-content { grid-template-rows: 1fr !important; } /* Mobile Alternate Content */ .mob-alt>*:first-child { display: none; } @media (min-width: 768px) { .mob-alt>*:first-child { display: block; } .mob-alt>*:nth-child(2) { display: none; } } .mob-alt_lg>*:first-child { display: none; } @media (min-width: 1024px) { .mob-alt_lg>*:first-child { display: block; } .mob-alt_lg>*:nth-child(2) { display: none; } } /* Header */ header[\:has\(sticky-header\:not\(\[data-visible\%3D\%22visible\%22\]\)\)] { pointer-events: none; } header:has(sticky-header:not([data-visible="visible"])) { pointer-events: none; } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] { --header-primary: var(--colour-secondary); --header-secondary: var(--colour-primary); } .page-content:has(main > *:first-child > div.transparent.theme_light) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) { --header-primary: var(--colour-secondary); --header-secondary: var(--colour-primary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] { --header-primary: var(--colour-primary); --header-secondary: var(--colour-secondary); } .page-content:has(main > *:first-child > div.transparent.theme_dark) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) { --header-primary: var(--colour-primary); --header-secondary: var(--colour-secondary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] { color: var(--header-primary); background-color: transparent; } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) { color: var(--header-primary); background-color: transparent; } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .wkh-icon { --icon-stroke: var(--header-primary); } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .wkh-icon { --icon-stroke: var(--header-primary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .header__account-logged-in, .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .wk-selected .wkh-icon, .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .wkh-selected .wkh-icon { --icon-fill: var(--header-primary); } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .header__account-logged-in, .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .wk-selected .wkh-icon, .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .wkh-selected .wkh-icon { --icon-fill: var(--header-primary); } .page-content[*|\:has\(main\%20\%3E\%20] sticky-header:not([data-scrolled="true"]) #header:not(:hover)[*|\:not-has\(] .cart-count { color: var(--header-secondary); background-color: var(--header-primary); } .page-content:has(main > *:first-child > div.transparent) sticky-header:not([data-scrolled="true"]) #header:not(:hover):not(:has(*[data-ui="visible"])) .cart-count { color: var(--header-secondary); background-color: var(--header-primary); } .header-svg-link { transition: opacity .25s cubic-bezier(0.075, 0.82, 0.165, 1), transform .25s cubic-bezier(0.075, 0.82, 0.165, 1); } .\[grid-auto-flow\:row_dense\] { grid-auto-flow: row dense; } @media (min-width: 768px) { .md\:grid-main { display: grid; grid-auto-rows: min-content; grid-template-columns: repeat(4, 1fr); grid-template-columns: var(--grid-main); -moz-column-gap: 0.5rem; column-gap: 0.5rem; grid-column-gap: 0.5rem; grid-column-gap: var(--padding-gutter); -moz-column-gap: var(--padding-gutter); column-gap: var(--padding-gutter); } } .placeholder\:\!font-base::-moz-placeholder { letter-spacing: 0.2px; } .placeholder\:\!font-base::placeholder { letter-spacing: 0.2px; } .placeholder\:font-base::-moz-placeholder { letter-spacing: 0.2px; } .placeholder\:font-base::placeholder { letter-spacing: 0.2px; } .placeholder\:\!font-base strong::-moz-placeholder { font-weight: 700; } .placeholder\:\!font-base strong::placeholder { font-weight: 700; } .placeholder\:font-base strong::-moz-placeholder { font-weight: 700; } .placeholder\:font-base strong::placeholder { font-weight: 700; } .placeholder\:\!font-base::-moz-placeholder { letter-spacing: 0.2px; } .placeholder\:\!font-base::placeholder { letter-spacing: 0.2px; } .placeholder\:font-base::-moz-placeholder { letter-spacing: 0.2px; } .placeholder\:font-base::placeholder { letter-spacing: 0.2px; } .placeholder\:\!font-base strong::-moz-placeholder { font-weight: 700; } .placeholder\:\!font-base strong::placeholder { font-weight: 700; } .placeholder\:font-base strong::-moz-placeholder { font-weight: 700; } .placeholder\:font-base strong::placeholder { font-weight: 700; } @media (min-width: 768px) { .md\:paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md\:paragraph-s { line-height: 130%; } } .md\:paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md\:paragraph-s { line-height: 130%; } } } @media (min-width: 1024px) { .lg\:paragraph-m { font-size: 1rem; font-size: var(--text-m); line-height: 130%; } .lg\:paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .lg\:paragraph-s { line-height: 130%; } } .lg\:paragraph-m { font-size: 1rem; font-size: var(--text-m); line-height: 130%; } .lg\:paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .lg\:paragraph-s { line-height: 130%; } } } @media (max-width: 767px) { .md-max\:paragraph-2xl { font-size: 1.875rem; font-size: var(--text-2xl); line-height: 150%; } .md-max\:paragraph-xl { font-size: 1.5rem; font-size: var(--text-xl); line-height: 150%; } .md-max\:paragraph-l { font-size: 1.125rem; font-size: var(--text-l); line-height: 150%; } .md-max\:paragraph-m { font-size: 1rem; font-size: var(--text-m); line-height: 130%; } .md-max\:paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md-max\:paragraph-s { line-height: 130%; } } .md-max\:paragraph-xs { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; } .md-max\:paragraph-2xs { font-size: 0.688rem; font-size: var(--text-2xs); line-height: 130%; } .md-max\:paragraph-2xl { font-size: 1.875rem; font-size: var(--text-2xl); line-height: 150%; } .md-max\:paragraph-xl { font-size: 1.5rem; font-size: var(--text-xl); line-height: 150%; } .md-max\:paragraph-l { font-size: 1.125rem; font-size: var(--text-l); line-height: 150%; } .md-max\:paragraph-m { font-size: 1rem; font-size: var(--text-m); line-height: 130%; } .md-max\:paragraph-s { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md-max\:paragraph-s { line-height: 130%; } } .md-max\:paragraph-xs { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; } .md-max\:paragraph-2xs { font-size: 0.688rem; font-size: var(--text-2xs); line-height: 130%; } } .placeholder\:\!font-base::-moz-placeholder { font-family: Calibre, Arial, sans-serif !important; } .placeholder\:\!font-base::placeholder { font-family: Calibre, Arial, sans-serif !important; } .placeholder\:font-base::-moz-placeholder { font-family: Calibre, Arial, sans-serif; } .placeholder\:font-base::placeholder { font-family: Calibre, Arial, sans-serif; } .placeholder\:\!text-s::-moz-placeholder { font-size: 0.875rem !important; font-size: var(--text-s) !important; } .placeholder\:\!text-s::placeholder { font-size: 0.875rem !important; font-size: var(--text-s) !important; } .placeholder\:\!uppercase::-moz-placeholder { text-transform: uppercase !important; } .placeholder\:\!uppercase::placeholder { text-transform: uppercase !important; } .placeholder\:uppercase::-moz-placeholder { text-transform: uppercase; } .placeholder\:uppercase::placeholder { text-transform: uppercase; } .placeholder\:\!leading-130::-moz-placeholder { line-height: 130% !important; } .placeholder\:\!leading-130::placeholder { line-height: 130% !important; } .placeholder\:\!tracking-0\.2::-moz-placeholder { letter-spacing: 0.2px !important; } .placeholder\:\!tracking-0\.2::placeholder { letter-spacing: 0.2px !important; } .placeholder\:\!text-\[--text-colour\]::-moz-placeholder { color: var(--text-colour) !important; } .placeholder\:\!text-\[--text-colour\]::placeholder { color: var(--text-colour) !important; } .placeholder\:text-type-black-secondary::-moz-placeholder { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .placeholder\:text-type-black-secondary::placeholder { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .before\:absolute::before { content: var(--tw-content); position: absolute; } .before\:-inset-0\.125::before { content: var(--tw-content); top: -0.125rem; right: -0.125rem; bottom: -0.125rem; left: -0.125rem; } .before\:z-2::before { content: var(--tw-content); z-index: 2; } .before\:size-\[calc\(100\%\+0\.25rem\)\]::before { content: var(--tw-content); width: calc(100% + 0.25rem); height: calc(100% + 0.25rem); } .before\:border::before { content: var(--tw-content); border-width: 1px; } .before\:border-primary::before { content: var(--tw-content); border-color: #333333; border-color: var(--colour-primary); } .before\:opacity-0::before { content: var(--tw-content); opacity: 0; } .before\:transition-all::before { content: var(--tw-content); transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .before\:content-\[var\(--price-compare\)\]::before { --tw-content: var(--price-compare); content: var(--tw-content); } .before\:content-\[var\(--price-current\)\]::before { --tw-content: var(--price-current); content: var(--tw-content); } .before\:content-blank::before { --tw-content: ""; content: var(--tw-content); } .before\:\[content\:\"\(\"\]::before { content: "("; } .after\:\[content\:\"\)\"\]::after { content: ")"; } .last\:border-b:last-child { border-bottom-width: 1px; } .last\:border-b-0:last-child { border-bottom-width: 0px; } .last\:border-r-0:last-child { border-right-width: 0px; } .last\:pb-0:last-child { padding-bottom: 0; } .even\:bg-page-secondary:nth-child(even) { --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); } .first-of-type\:border-t:first-of-type { border-top-width: 1px; } .checked\:\!border-primary:checked { border-color: #333333 !important; border-color: var(--colour-primary) !important; } .checked\:\!border-secondary:checked { border-color: #ffffff !important; border-color: var(--colour-secondary) !important; } .checked\:\!bg-primary:checked { background-color: #333333 !important; background-color: var(--colour-primary) !important; } .checked\:\!bg-none:checked { background-image: none !important; } .empty\:hidden:empty { display: none; } @media (hover: hover) and (pointer: fine) { .hover\:\!-translate-x-full:hover { --tw-translate-x: -100% !important; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; } .hover\:border-brand-black:hover { --tw-border-opacity: 1; border-color: rgba(51, 51, 51, 1); border-color: rgba(51, 51, 51, var(--tw-border-opacity, 1)); } .hover\:border-primary:hover { border-color: #333333; border-color: var(--colour-primary); } .hover\:bg-primary:hover { background-color: #333333; background-color: var(--colour-primary); } .hover\:opacity-50:hover { opacity: 0.5; } } .focus\:\!outline-none:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; } .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; } .focus\:\!ring-0:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important; --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0) !important; box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)) !important; } .focus\:ring-0:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0)); } .focus\:\!ring-offset-0:focus { --tw-ring-offset-width: 0px !important; } .focus\:ring-offset-0:focus { --tw-ring-offset-width: 0px; } .focus-visible\:\!shadow-none.focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .focus-visible\:\!shadow-none.focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .focus-visible\:\!shadow-none.focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .focus-visible\:\!shadow-none:focus-visible { --tw-shadow: 0 0 rgba(0,0,0,0) !important; --tw-shadow-colored: 0 0 rgba(0,0,0,0) !important; box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow) !important; box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow) !important; } .focus-visible\:\!outline-0.focus-visible { outline-width: 0px !important; } .focus-visible\:\!outline-0:focus-visible { outline-width: 0px !important; } .disabled\:pointer-events-none:disabled { pointer-events: none; } .disabled\:\!cursor-not-allowed:disabled { cursor: not-allowed !important; } .disabled\:cursor-not-allowed:disabled { cursor: not-allowed; } .disabled\:\!border-borders-default:disabled { --tw-border-opacity: 1 !important; border-color: rgba(239, 239, 239, 1) !important; border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)) !important; } .disabled\:\!bg-page-secondary:disabled { --tw-bg-opacity: 1 !important; background-color: rgba(239, 239, 239, 1) !important; background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)) !important; } .disabled\:bg-page-secondary:disabled { --tw-bg-opacity: 1; background-color: rgba(239, 239, 239, 1); background-color: rgba(239, 239, 239, var(--tw-bg-opacity, 1)); } .disabled\:\!text-type-disabled:disabled { --tw-text-opacity: 1 !important; color: rgba(188, 185, 182, 1) !important; color: rgba(188, 185, 182, var(--tw-text-opacity, 1)) !important; } .disabled\:text-type-black-secondary:disabled { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .disabled\:\!opacity-50:disabled { opacity: 0.5 !important; } .disabled\:opacity-50:disabled { opacity: 0.5; } @media (hover: hover) and (pointer: fine) { .group\/blog-card:hover .group-hover\/blog-card\:scale-\[1\.025\] { --tw-scale-x: 1.025; --tw-scale-y: 1.025; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/filter-item:hover .group-hover\/filter-item\:border-primary { border-color: #333333; border-color: var(--colour-primary); } .group\/filter-item:hover .group-hover\/filter-item\:bg-primary { background-color: #333333; background-color: var(--colour-primary); } .group\/blog-card:hover .group-hover\/blog-card\:opacity-50 { opacity: 0.5; } .group\/card:hover .group-hover\/card\:opacity-0 { opacity: 0; } .group\/menu-card:hover .group-hover\/menu-card\:opacity-50 { opacity: 0.5; } .group\/swatch:hover .group-hover\/swatch\:opacity-100 { opacity: 1; } .group\/swatch:hover .group-hover\/swatch\:before\:opacity-100::before { content: var(--tw-content); opacity: 1; } } .peer:-moz-placeholder-shown ~ .peer-placeholder-shown\:text-type-black-secondary { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .peer:placeholder-shown ~ .peer-placeholder-shown\:text-type-black-secondary { --tw-text-opacity: 1; color: rgba(89, 89, 89, 1); color: rgba(89, 89, 89, var(--tw-text-opacity, 1)); } .peer:disabled ~ .peer-disabled\:pointer-events-none { pointer-events: none; } .peer:disabled ~ .peer-disabled\:cursor-not-allowed { cursor: not-allowed; } .peer:disabled ~ .peer-disabled\:opacity-50 { opacity: 0.5; } .has-\[\[data-filter-section-count\]\:empty\]\:hidden[\:has\(\[data-filter-section-count\]\:empty\)] { display: none; } .has-\[\[data-filter-section-count\]\:empty\]\:hidden:has([data-filter-section-count]:empty) { display: none; } .has-\[data-ui\=\"visible\"\]\:overflow-y-hidden[\:has\(data-ui\%3D\%22visible\%22\)] { overflow-y: hidden; } .has-\[data-ui\=\"visible\"\]\:overflow-y-hidden:has(data-ui="visible") { overflow-y: hidden; } .aria-selected\:text-accent[aria-selected="true"] { color: #ff543b; color: var(--colour-accent); } .data-visible\:block[data-ui~="visible"] { display: block; } .data-visible\:flex[data-ui~="visible"] { display: flex; } .data-visible\:max-h-5[data-ui~="visible"] { max-height: 5rem; } .data-visible\:min-h-topbar[data-ui~="visible"] { min-height: 28px; min-height: var(--height-topbar); } .data-visible\:pb-1\.5[data-ui~="visible"] { padding-bottom: 1.5rem; } .data-\[active\=true\]\:border-primary[data-active="true"] { border-color: #333333; border-color: var(--colour-primary); } .data-\[item-count\=\'0\'\]\:opacity-0[data-item-count='0'] { opacity: 0; } .group\/drawer[data-ui~="visible"] .group-data-visible\/drawer\:pointer-events-auto { pointer-events: auto; } .group\/filters[data-ui~="visible"] .group-data-visible\/filters\:pointer-events-auto { pointer-events: auto; } .group\/lightbox[data-ui~="visible"] .group-data-visible\/lightbox\:pointer-events-auto { pointer-events: auto; } .group\/localization[data-ui~="visible"] .group-data-visible\/localization\:pointer-events-auto { pointer-events: auto; } .group\/mini-cart[data-ui~="visible"] .group-data-visible\/mini-cart\:pointer-events-auto { pointer-events: auto; } .group\/modal-localization[data-ui~="visible"] .group-data-visible\/modal-localization\:pointer-events-auto { pointer-events: auto; } .group\/product-enquiry-modal[data-ui~="visible"] .group-data-visible\/product-enquiry-modal\:pointer-events-auto { pointer-events: auto; } .group\/quick-search[data-ui~="visible"] .group-data-visible\/quick-search\:pointer-events-auto { pointer-events: auto; } .group\/size-modal[data-ui~="visible"] .group-data-visible\/size-modal\:pointer-events-auto { pointer-events: auto; } .group\/submenu[data-ui~="visible"] .group-data-visible\/submenu\:pointer-events-auto { pointer-events: auto; } .group\/drawer[data-ui~="visible"] .group-data-visible\/drawer\:visible { visibility: visible; } .group\/modal-localization[data-ui~="visible"] .group-data-visible\/modal-localization\:visible { visibility: visible; } .group\/product-gallery-desktop[data-ui~="visible"] .group-data-visible\/product-gallery-desktop\:block { display: block; } .group\/form[data-ui~="visible"] .group-data-visible\/form\:\!flex { display: flex !important; } .group\/form[data-ui~="visible"] .group-data-visible\/form\:\!hidden { display: none !important; } .group\/product-gallery-desktop[data-ui~="visible"] .group-data-visible\/product-gallery-desktop\:hidden { display: none; } .group\/drawer[data-ui~="visible"] .group-data-visible\/drawer\:-translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/filters[data-ui~="visible"] .group-data-visible\/filters\:translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/mini-cart[data-ui~="visible"] .group-data-visible\/mini-cart\:-translate-x-half { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/mini-cart[data-ui~="visible"] .group-data-visible\/mini-cart\:translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/quick-search[data-ui~="visible"] .group-data-visible\/quick-search\:translate-y-0 { --tw-translate-y: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/submenu[data-ui~="visible"] .group-data-visible\/submenu\:-translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/filter[data-ui~="visible"] .group-data-visible\/filter\:-rotate-180 { --tw-rotate: -180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group[data-ui~="visible"] .group-data-visible\:-rotate-180 { --tw-rotate: -180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/drawer[data-ui~="visible"] .group-data-visible\/drawer\:opacity-100 { opacity: 1; } .group\/filters[data-ui~="visible"] .group-data-visible\/filters\:opacity-100 { opacity: 1; } .group\/lightbox[data-ui~="visible"] .group-data-visible\/lightbox\:opacity-100 { opacity: 1; } .group\/localization[data-ui~="visible"] .group-data-visible\/localization\:opacity-100 { opacity: 1; } .group\/mini-cart[data-ui~="visible"] .group-data-visible\/mini-cart\:opacity-100 { opacity: 1; } .group\/modal-localization[data-ui~="visible"] .group-data-visible\/modal-localization\:opacity-100 { opacity: 1; } .group\/product-enquiry-modal[data-ui~="visible"] .group-data-visible\/product-enquiry-modal\:opacity-100 { opacity: 1; } .group\/quick-search[data-ui~="visible"] .group-data-visible\/quick-search\:opacity-100 { opacity: 1; } .group\/size-modal[data-ui~="visible"] .group-data-visible\/size-modal\:opacity-100 { opacity: 1; } .group\/form[data-ui~="disabled"] .group-data-disabled\/form\:\!flex { display: flex !important; } .group\/form[data-ui~="disabled"] .group-data-disabled\/form\:\!hidden { display: none !important; } .group\/menu-item[data-submenu-open="true"] .group-data-\[submenu-open\=true\]\/menu-item\:pointer-events-auto { pointer-events: auto; } .group\/menu-item[data-submenu-open="true"] .group-data-\[submenu-open\=true\]\/menu-item\:visible { visibility: visible; } .group\/price[data-sale="true"] .group-data-\[sale\=true\]\/price\:block { display: block; } .group\/menu-item[data-submenu-open="true"] .group-data-\[submenu-open\=true\]\/menu-item\:scale-\[1\] { --tw-scale-x: 1; --tw-scale-y: 1; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/price[data-sale="true"] .group-data-\[sale\=true\]\/price\:text-brand-orange { --tw-text-opacity: 1; color: rgba(255, 84, 59, 1); color: rgba(255, 84, 59, var(--tw-text-opacity, 1)); } .group\/menu-item[data-submenu-open="true"] .group-data-\[submenu-open\=true\]\/menu-item\:opacity-100 { opacity: 1; } .group\/menu-item[data-submenu-open="true"] .after\:group-data-\[submenu-open\=true\]\/menu-item\:max-w-md::after { content: var(--tw-content); max-width: 28rem; } .children\:col-\[1\/2\] > * { grid-column: 1/2; } .children\:row-\[1\] > * { grid-row: 1; } .children\:size-\[12px\] > * { width: 12px; height: 12px; } .children\:size-full > * { width: 100%; height: 100%; } .children\:h-auto > * { height: auto; } .children\:h-full > * { height: 100%; } .children\:min-h-fit > * { min-height: -moz-fit-content; min-height: fit-content; } .children\:\!w-full > * { width: 100% !important; } .children\:w-auto > * { width: auto; } .children\:w-full > * { width: 100%; } .children\:\!max-w-none > * { max-width: none !important; } .children\:shrink-0 > * { flex-shrink: 0; } .children\:transform > * { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .children\:animate-spinner > * { animation: spinner 1.4s linear infinite; } .children\:border-b > * { border-bottom-width: 1px; } .children\:border-brand-white > * { --tw-border-opacity: 1; border-color: rgba(255, 255, 255, 1); border-color: rgba(255, 255, 255, var(--tw-border-opacity, 1)); } .children\:bg-\[var\(--bg-colour\)\] > * { background-color: var(--bg-colour); } .children\:object-cover > * { -o-object-fit: cover; object-fit: cover; } .children\:px-margin > * { padding-left: 1rem; padding-left: var(--padding-margin); padding-right: 1rem; padding-right: var(--padding-margin); } .children\:py-1\.5 > * { padding-top: 1.5rem; padding-bottom: 1.5rem; } .children\:transition-all > * { transition-property: all; transition-timing-function: ease; transition-duration: 0.3s; } .children\:transform > * { transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), 0) rotateX(0) rotateY(0) rotateZ(var(--tw-rotate)) rotate3d(0,0,0,0deg) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scale3d(var(--tw-scale-x),var(--tw-scale-y),1) !important; transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), var(--tw-translate-z)) rotateX(var(--tw-rotate-x)) rotateY(var(--tw-rotate-y)) rotateZ(var(--tw-rotate)) rotate3d(var(--tw-rotate-3d)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scale3d(var(--tw-scale-x),var(--tw-scale-y),var(--tw-scale-z)) !important; } .children\:last\:border-b-0:last-child > * { border-bottom-width: 0px; } @media (hover: hover) and (pointer: fine) { .group\/blog-card:hover .children\:group-hover\/blog-card\:scale-\[1\.025\] > * { --tw-scale-x: 1.025; --tw-scale-y: 1.025; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/menu-card:hover .children\:group-hover\/menu-card\:scale-\[1\.025\] > * { --tw-scale-x: 1.025; --tw-scale-y: 1.025; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } } @media (prefers-reduced-motion: reduce) { .motion-reduce\:animate-none { animation: none; } } @media (min-width: 375px) { .sm\:aspect-1\/1 { aspect-ratio: 1/1; } .sm\:aspect-1\/2 { aspect-ratio: 1/2; } .sm\:aspect-10\/9 { aspect-ratio: 10/9; } .sm\:aspect-16\/9 { aspect-ratio: 16/9; } .sm\:aspect-2\/1 { aspect-ratio: 2/1; } .sm\:aspect-2\/3 { aspect-ratio: 2/3; } .sm\:aspect-21\/9 { aspect-ratio: 21/9; } .sm\:aspect-3\/2 { aspect-ratio: 3/2; } .sm\:aspect-3\/4 { aspect-ratio: 3/4; } .sm\:aspect-4\/3 { aspect-ratio: 4/3; } .sm\:aspect-4\/5 { aspect-ratio: 4/5; } .sm\:aspect-5\/4 { aspect-ratio: 5/4; } .sm\:aspect-9\/10 { aspect-ratio: 9/10; } .sm\:aspect-9\/16 { aspect-ratio: 9/16; } .sm\:aspect-9\/21 { aspect-ratio: 9/21; } } @media (min-width: 768px) { .md\:sticky { position: sticky; } .md\:top-header-adapt { top: 45px; top: var(--height-header-adapt); } .md\:col-\[-1\/-4\] { grid-column: -1/-4; } .md\:col-\[1\/-4\] { grid-column: 1/-4; } .md\:m-auto { margin: auto; } .md\:-mr-0\.75 { margin-right: -0.75rem; } .md\:-mt-0\.75 { margin-top: -0.75rem; } .md\:-mt-header { margin-top: calc(45px * -1); margin-top: calc(var(--height-header) * -1); } .md\:mr-\[--carousel-gap\] { margin-right: var(--carousel-gap); } .md\:block { display: block; } .md\:\!flex { display: flex !important; } .md\:flex { display: flex; } .md\:grid { display: grid; } .md\:\!hidden { display: none !important; } .md\:hidden { display: none; } .md\:aspect-1\/1 { aspect-ratio: 1/1; } .md\:aspect-1\/2 { aspect-ratio: 1/2; } .md\:aspect-10\/9 { aspect-ratio: 10/9; } .md\:aspect-16\/9 { aspect-ratio: 16/9; } .md\:aspect-2\/1 { aspect-ratio: 2/1; } .md\:aspect-2\/3 { aspect-ratio: 2/3; } .md\:aspect-21\/9 { aspect-ratio: 21/9; } .md\:aspect-3\/2 { aspect-ratio: 3/2; } .md\:aspect-3\/4 { aspect-ratio: 3/4; } .md\:aspect-4\/3 { aspect-ratio: 4/3; } .md\:aspect-4\/5 { aspect-ratio: 4/5; } .md\:aspect-5\/4 { aspect-ratio: 5/4; } .md\:aspect-9\/10 { aspect-ratio: 9/10; } .md\:aspect-9\/16 { aspect-ratio: 9/16; } .md\:aspect-9\/21 { aspect-ratio: 9/21; } .md\:\!h-\[44px\] { height: 44px !important; } .md\:h-\[16px\] { height: 16px; } .md\:h-fit { height: -moz-fit-content; height: fit-content; } .md\:h-full { height: 100%; } .md\:h-view { height: 100vh; height: var(--height-view); } .md\:w-\[--carousel-columns\] { width: var(--carousel-columns); } .md\:w-\[150px\] { width: 150px; } .md\:w-\[36px\] { width: 36px; } .md\:w-fit { width: -moz-fit-content; width: fit-content; } .md\:max-w-\[450px\] { max-width: 450px; } .md\:max-w-\[500px\] { max-width: 500px; } .md\:basis-1\/2 { flex-basis: 50%; } .md\:basis-\[--carousel-columns\] { flex-basis: var(--carousel-columns); } .md\:basis-full { flex-basis: 100%; } .md\:basis-gap-1\/2 { flex-basis: calc((100% / 2) - 0.5px); } .md\:translate-x-full { --tw-translate-x: 100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .md\:cursor-e-resize { cursor: e-resize; } .md\:columns-2 { -moz-columns: 2; columns: 2; } .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .md\:grid-cols-min-full { grid-template-columns: min-content 1fr; } .md\:flex-row { flex-direction: row; } .md\:flex-wrap { flex-wrap: wrap; } .md\:items-end { align-items: flex-end; } .md\:items-stretch { align-items: stretch; } .md\:justify-end { justify-content: flex-end; } .md\:\!gap-1 { gap: 1rem !important; } .md\:gap-x-1 { -moz-column-gap: 1rem; column-gap: 1rem; } .md\:gap-x-\[--carousel-gap\] { -moz-column-gap: var(--carousel-gap); column-gap: var(--carousel-gap); } .md\:gap-y-1\.5 { row-gap: 1.5rem; } .md\:gap-y-\[--carousel-gap\] { row-gap: var(--carousel-gap); } .md\:border-r { border-right-width: 1px; } .md\:border-borders-default { --tw-border-opacity: 1; border-color: rgba(239, 239, 239, 1); border-color: rgba(239, 239, 239, var(--tw-border-opacity, 1)); } .md\:px-margin { padding-left: 1rem; padding-left: var(--padding-margin); padding-right: 1rem; padding-right: var(--padding-margin); } .md\:py-6\.25 { padding-top: 6.25rem; padding-bottom: 6.25rem; } .md\:pt-1 { padding-top: 1rem; } .md\:text-right { text-align: right; } .md\:inset-tr { top: 0; right: 0; } .group\/localization[data-ui~="visible"] .md\:group-data-visible\/localization\:translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/product-enquiry-modal[data-ui~="visible"] .md\:group-data-visible\/product-enquiry-modal\:translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/size-modal[data-ui~="visible"] .md\:group-data-visible\/size-modal\:translate-x-0 { --tw-translate-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } } @media (min-width: 1024px) { .lg\:left-1\.5 { left: 1.5rem; } .lg\:right-1\.5 { right: 1.5rem; } .lg\:col-\[-1\/-4\] { grid-column: -1/-4; } .lg\:col-\[-1\/-6\] { grid-column: -1/-6; } .lg\:col-\[-4\/-6\] { grid-column: -4/-6; } .lg\:col-\[1\/-6\] { grid-column: 1/-6; } .lg\:col-\[1\/7\] { grid-column: 1/7; } .lg\:block { display: block; } .lg\:flex { display: flex; } .lg\:grid { display: grid; } .lg\:hidden { display: none; } .lg\:aspect-1\/1 { aspect-ratio: 1/1; } .lg\:aspect-1\/2 { aspect-ratio: 1/2; } .lg\:aspect-10\/9 { aspect-ratio: 10/9; } .lg\:aspect-16\/9 { aspect-ratio: 16/9; } .lg\:aspect-2\/1 { aspect-ratio: 2/1; } .lg\:aspect-2\/3 { aspect-ratio: 2/3; } .lg\:aspect-21\/9 { aspect-ratio: 21/9; } .lg\:aspect-3\/2 { aspect-ratio: 3/2; } .lg\:aspect-3\/4 { aspect-ratio: 3/4; } .lg\:aspect-4\/3 { aspect-ratio: 4/3; } .lg\:aspect-4\/5 { aspect-ratio: 4/5; } .lg\:aspect-5\/4 { aspect-ratio: 5/4; } .lg\:aspect-9\/10 { aspect-ratio: 9/10; } .lg\:aspect-9\/16 { aspect-ratio: 9/16; } .lg\:aspect-9\/21 { aspect-ratio: 9/21; } .lg\:h-full { height: 100%; } .lg\:w-\[250px\] { width: 250px; } .lg\:w-fit { width: -moz-fit-content; width: fit-content; } .lg\:max-w-\[460px\] { max-width: 460px; } .lg\:max-w-gap-1\/4 { max-width: calc((100% / 4) - 0.5px); } .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .lg\:grid-cols-min-full-min { grid-template-columns: min-content 1fr min-content; } .lg\:flex-wrap { flex-wrap: wrap; } .lg\:items-center { align-items: center; } .lg\:justify-center { justify-content: center; } .lg\:gap-gutter { gap: 0.5rem; gap: var(--padding-gutter); } .lg\:gap-x-1 { -moz-column-gap: 1rem; column-gap: 1rem; } .lg\:gap-x-1\.875 { -moz-column-gap: 1.875rem; column-gap: 1.875rem; } .lg\:gap-y-0\.875 { row-gap: 0.875rem; } .lg\:gap-y-4 { row-gap: 4rem; } .lg\:p-margin { padding: 1rem; padding: var(--padding-margin); } .lg\:px-0\.625 { padding-left: 0.625rem; padding-right: 0.625rem; } .lg\:py-3\.125 { padding-top: 3.125rem; padding-bottom: 3.125rem; } .lg\:pl-margin { padding-left: 1rem; padding-left: var(--padding-margin); } .lg\:pr-0\.625 { padding-right: 0.625rem; } } @media (min-width: 1440px) { .xl\:col-\[-1\/-5\] { grid-column: -1/-5; } .xl\:col-\[1\/-5\] { grid-column: 1/-5; } .xl\:aspect-1\/1 { aspect-ratio: 1/1; } .xl\:aspect-1\/2 { aspect-ratio: 1/2; } .xl\:aspect-10\/9 { aspect-ratio: 10/9; } .xl\:aspect-16\/9 { aspect-ratio: 16/9; } .xl\:aspect-2\/1 { aspect-ratio: 2/1; } .xl\:aspect-2\/3 { aspect-ratio: 2/3; } .xl\:aspect-21\/9 { aspect-ratio: 21/9; } .xl\:aspect-3\/2 { aspect-ratio: 3/2; } .xl\:aspect-3\/4 { aspect-ratio: 3/4; } .xl\:aspect-4\/3 { aspect-ratio: 4/3; } .xl\:aspect-4\/5 { aspect-ratio: 4/5; } .xl\:aspect-5\/4 { aspect-ratio: 5/4; } .xl\:aspect-9\/10 { aspect-ratio: 9/10; } .xl\:aspect-9\/16 { aspect-ratio: 9/16; } .xl\:aspect-9\/21 { aspect-ratio: 9/21; } .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .xl\:gap-x-3 { -moz-column-gap: 3rem; column-gap: 3rem; } } @media (min-width: 1828px) { .xxl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media (min-width: 2560px) { .xxxl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } } @media (max-width: 374px) { .sm-max\:pb-\[--padding-bottom-mb\] { padding-bottom: var(--padding-bottom-mb); } .sm-max\:pl-\[--padding-left-mb\] { padding-left: var(--padding-left-mb); } .sm-max\:pr-\[--padding-right-mb\] { padding-right: var(--padding-right-mb); } .sm-max\:pt-\[--padding-top-mb\] { padding-top: var(--padding-top-mb); } } @media (max-width: 767px) { .md-max\:relative { position: relative; } .md-max\:sticky { position: sticky; } .md-max\:left-\[--padding-left-mb\] { left: var(--padding-left-mb); } .md-max\:right-\[--padding-right-mb\] { right: var(--padding-right-mb); } .md-max\:top-\[var\(--sticky-offset-mb\)\] { top: var(--sticky-offset-mb); } .md-max\:top-unset { top: auto; top: initial; } .md-max\:col-\[--column-span-mb\] { grid-column: var(--column-span-mb); } .md-max\:-ml-\[--padding-left-mb\] { margin-left: calc(var(--padding-left-mb) * -1); } .md-max\:flex { display: flex; } .md-max\:grid { display: grid; } .md-max\:\!hidden { display: none !important; } .md-max\:hidden { display: none; } .md-max\:aspect-1\/1 { aspect-ratio: 1/1; } .md-max\:aspect-1\/2 { aspect-ratio: 1/2; } .md-max\:aspect-16\/9 { aspect-ratio: 16/9; } .md-max\:aspect-2\/1 { aspect-ratio: 2/1; } .md-max\:aspect-2\/3 { aspect-ratio: 2/3; } .md-max\:aspect-21\/9 { aspect-ratio: 21/9; } .md-max\:aspect-3\/2 { aspect-ratio: 3/2; } .md-max\:aspect-3\/4 { aspect-ratio: 3/4; } .md-max\:aspect-4\/3 { aspect-ratio: 4/3; } .md-max\:aspect-4\/5 { aspect-ratio: 4/5; } .md-max\:aspect-5\/4 { aspect-ratio: 5/4; } .md-max\:aspect-9\/16 { aspect-ratio: 9/16; } .md-max\:aspect-9\/21 { aspect-ratio: 9/21; } .md-max\:aspect-\[--bg-ratio-mb\] { aspect-ratio: var(--bg-ratio-mb); } .md-max\:h-\[--custom-height-pc-mb\] { height: var(--custom-height-pc-mb); } .md-max\:h-\[--custom-height-px-mb\] { height: var(--custom-height-px-mb); } .md-max\:h-\[--override-height-mb\] { height: var(--override-height-mb); } .md-max\:h-auto { height: auto; } .md-max\:h-fit { height: -moz-fit-content; height: fit-content; } .md-max\:h-full { height: 100%; } .md-max\:h-screen-adapt { height: calc(100vh - 45px); height: var(--height-screen-adapt); } .md-max\:h-screen-height { height: calc(100vh - 45px); height: var(--height-screen); } .md-max\:h-view { height: 100vh; height: var(--height-view); } .md-max\:w-\[calc\(100\%\+var\(--padding-left-mb\)\+var\(--padding-right-mb\)\)\] { width: calc(100% + var(--padding-left-mb) + var(--padding-right-mb)); } .md-max\:w-\[calc\(100\%-var\(--padding-left-mb\)-var\(--padding-right-mb\)\)\] { width: calc(100% - var(--padding-left-mb) - var(--padding-right-mb)); } .md-max\:w-auto { width: auto; } .md-max\:w-fit { width: -moz-fit-content; width: fit-content; } .md-max\:w-full { width: 100%; } .md-max\:max-w-\[--custom-width-pc-mb\] { max-width: var(--custom-width-pc-mb); } .md-max\:max-w-\[--custom-width-px-mb\] { max-width: var(--custom-width-px-mb); } .md-max\:max-w-fit { max-width: -moz-fit-content; max-width: fit-content; } .md-max\:max-w-full { max-width: 100%; } .md-max\:max-w-md { max-width: 28rem; } .md-max\:grow { flex-grow: 1; } .md-max\:translate-y-full { --tw-translate-y: 100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .md-max\:grid-cols-\[--grid-columns-mb\] { grid-template-columns: var(--grid-columns-mb); } .md-max\:flex-row { flex-direction: row; } .md-max\:flex-row-reverse { flex-direction: row-reverse; } .md-max\:flex-col { flex-direction: column; } .md-max\:flex-col-reverse { flex-direction: column-reverse; } .md-max\:flex-wrap { flex-wrap: wrap; } .md-max\:items-start { align-items: flex-start; } .md-max\:items-end { align-items: flex-end; } .md-max\:items-center { align-items: center; } .md-max\:items-stretch { align-items: stretch; } .md-max\:justify-start { justify-content: flex-start; } .md-max\:justify-end { justify-content: flex-end; } .md-max\:justify-center { justify-content: center; } .md-max\:justify-between { justify-content: space-between; } .md-max\:justify-around { justify-content: space-around; } .md-max\:gap-x-\[--display-gap-inline-mb\] { -moz-column-gap: var(--display-gap-inline-mb); column-gap: var(--display-gap-inline-mb); } .md-max\:gap-y-\[--display-gap-block-mb\] { row-gap: var(--display-gap-block-mb); } .md-max\:overflow-x-scroll { overflow-x: scroll; } .md-max\:whitespace-normal { white-space: normal; } .md-max\:whitespace-nowrap { white-space: nowrap; } .md-max\:rounded-\[--border-radius-mb\] { border-radius: var(--border-radius-mb); } .md-max\:border { border-width: 1px; } .md-max\:border-0 { border-width: 0px; } .md-max\:border-x { border-left-width: 1px; border-right-width: 1px; } .md-max\:border-y { border-top-width: 1px; border-bottom-width: 1px; } .md-max\:border-b { border-bottom-width: 1px; } .md-max\:border-l { border-left-width: 1px; } .md-max\:border-r { border-right-width: 1px; } .md-max\:border-t { border-top-width: 1px; } .md-max\:object-contain { -o-object-fit: contain; object-fit: contain; } .md-max\:object-cover { -o-object-fit: cover; object-fit: cover; } .md-max\:object-fill { -o-object-fit: fill; object-fit: fill; } .md-max\:object-none { -o-object-fit: none; object-fit: none; } .md-max\:object-scale-down { -o-object-fit: scale-down; object-fit: scale-down; } .md-max\:pb-\[--padding-bottom-mb\] { padding-bottom: var(--padding-bottom-mb); } .md-max\:pl-\[--padding-left-mb\] { padding-left: var(--padding-left-mb); } .md-max\:pr-\[--padding-right-mb\] { padding-right: var(--padding-right-mb); } .md-max\:pt-\[--padding-top-mb\] { padding-top: var(--padding-top-mb); } .md-max\:text-left { text-align: left; } .md-max\:text-center { text-align: center; } .md-max\:text-right { text-align: right; } .md-max\:transition-\[top\] { transition-property: top; transition-timing-function: ease; transition-duration: 0.3s; } .md-max\:duration-300 { transition-duration: 300ms; } .md-max\:btn-l { font-size: 1rem; font-size: var(--text-m); line-height: 130%; padding-left: 1.5rem; padding-right: 1.5rem; } .md-max\:btn-l:not(.btn-text) { height: 56px; } .md-max\:btn-l.btn-text { height: 44px; } .md-max\:btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md-max\:btn-m { line-height: 130%; } } .md-max\:btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md-max\:btn-m { line-height: 130%; } } .md-max\:btn-m { height: 44px; padding-left: 1.5rem; padding-right: 1.5rem; } .md-max\:btn-s { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; height: 36px; padding-left: 1rem; padding-right: 1rem; } .md-max\:btn-square { padding: 0 !important; } .md-max\:btn-square { aspect-ratio: 1/1; align-items: center; justify-content: center; text-align: center; } .md-max\:inset-bl { bottom: 0; left: 0; } .md-max\:btn-l { font-size: 1rem; font-size: var(--text-m); line-height: 130%; padding-left: 1.5rem; padding-right: 1.5rem; } .md-max\:btn-l:not(.btn-text) { height: 56px; } .md-max\:btn-l.btn-text { height: 44px; } .md-max\:btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md-max\:btn-m { line-height: 130%; } } .md-max\:btn-m { font-size: 0.875rem; font-size: var(--text-s); line-height: 150%; } @media (min-width: 768px) { .md-max\:btn-m { line-height: 130%; } } .md-max\:btn-m { height: 44px; padding-left: 1.5rem; padding-right: 1.5rem; } .md-max\:btn-s { font-size: 0.813rem; font-size: var(--text-xs); line-height: 130%; height: 36px; padding-left: 1rem; padding-right: 1rem; } .md-max\:btn-square { padding: 0 !important; } .md-max\:btn-square { aspect-ratio: 1/1; align-items: center; justify-content: center; text-align: center; } .md-max\:inset-bl { bottom: 0; left: 0; } .group\/localization[data-ui~="visible"] .md-max\:group-data-visible\/localization\:translate-y-0 { --tw-translate-y: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/product-enquiry-modal[data-ui~="visible"] .md-max\:group-data-visible\/product-enquiry-modal\:translate-y-0 { --tw-translate-y: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group\/size-modal[data-ui~="visible"] .md-max\:group-data-visible\/size-modal\:translate-y-0 { --tw-translate-y: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } } @media (max-width: 1023px) { .lg-max\:z-60 { z-index: 60; } .lg-max\:col-\[1\/2\] { grid-column: 1/2; } .lg-max\:col-\[2\/3\] { grid-column: 2/3; } .lg-max\:hidden { display: none; } .lg-max\:aspect-1\/1 { aspect-ratio: 1/1; } .lg-max\:aspect-2\/3 { aspect-ratio: 2/3; } .lg-max\:aspect-4\/5 { aspect-ratio: 4/5; } .lg-max\:w-full { width: 100%; } .lg-max\:justify-between { justify-content: space-between; } .lg-max\:border-b { border-bottom-width: 1px; } .lg-max\:border-t-0 { border-top-width: 0px; } .lg-max\:px-margin { padding-left: 1rem; padding-left: var(--padding-margin); padding-right: 1rem; padding-right: var(--padding-margin); } .lg-max\:py-1 { padding-top: 1rem; padding-bottom: 1rem; } .lg-max\:pb-\[--padding-bottom-mb\] { padding-bottom: var(--padding-bottom-mb); } .lg-max\:pl-\[--padding-left-mb\] { padding-left: var(--padding-left-mb); } .lg-max\:pr-\[--padding-right-mb\] { padding-right: var(--padding-right-mb); } .lg-max\:pt-0 { padding-top: 0; } .lg-max\:pt-1 { padding-top: 1rem; } .lg-max\:pt-\[--padding-top-mb\] { padding-top: var(--padding-top-mb); } .lg-max\:text-primary { color: #333333; color: var(--colour-primary); } .has-\[\[data-ui\=visible\]\]\:lg-max\:z-60[\:has\(\[data-ui\%3Dvisible\]\)] { z-index: 60; } .has-\[\[data-ui\=visible\]\]\:lg-max\:z-60:has([data-ui=visible]) { z-index: 60; } } @media (max-width: 1439px) { .xl-max\:pb-\[--padding-bottom-mb\] { padding-bottom: var(--padding-bottom-mb); } .xl-max\:pl-\[--padding-left-mb\] { padding-left: var(--padding-left-mb); } .xl-max\:pr-\[--padding-right-mb\] { padding-right: var(--padding-right-mb); } .xl-max\:pt-\[--padding-top-mb\] { padding-top: var(--padding-top-mb); } } .\[\&\:hover\:not\(\:has\(\[data-layout\]\:hover\)\)_\.container-hover\]\:visible:hover[\:not-has\(\[data-layout\]\:hover\)] .container-hover { visibility: visible; } .\[\&\:hover\:not\(\:has\(\[data-layout\]\:hover\)\)_\.container-hover\]\:visible:hover:not(:has([data-layout]:hover)) .container-hover { visibility: visible; } .\[\&\:hover\:not\(\:has\(\[data-layout\]\:hover\)\)_\.container-hover\]\:opacity-100:hover[\:not-has\(\[data-layout\]\:hover\)] .container-hover { opacity: 1; } .\[\&\:hover\:not\(\:has\(\[data-layout\]\:hover\)\)_\.container-hover\]\:opacity-100:hover:not(:has([data-layout]:hover)) .container-hover { opacity: 1; } .\[\&_\.flickity-cell\]\:mr-\[--carousel-gap-mb\] .flickity-cell { margin-right: var(--carousel-gap-mb); } .\[\&_\.flickity-cell\]\:\!h-full .flickity-cell { height: 100% !important; } .\[\&_\.flickity-cell\]\:w-\[--carousel-columns-mb\] .flickity-cell { width: var(--carousel-columns-mb); } @media (min-width: 768px) { .\[\&_\.flickity-cell\]\:md\:mr-\[--carousel-gap\] .flickity-cell { margin-right: var(--carousel-gap); } .\[\&_\.flickity-cell\]\:md\:w-\[--carousel-columns\] .flickity-cell { width: var(--carousel-columns); } } .\[\&_\.flickity-slider\]\:flex .flickity-slider { display: flex; } .\[\&_\.flickity-slider\]\:items-center .flickity-slider { align-items: center; } .\[\&_\>\*\:not\(style\)\:not\(\[class\*\=\'flickity-\'\]\)\:not\(\[data-role\=\'carousel-counter\'\]\)\]\:mr-\[--carousel-gap-mb\] >*:not(style):not([class*='flickity-']):not([data-role='carousel-counter']) { margin-right: var(--carousel-gap-mb); } .\[\&_\>\*\:not\(style\)\:not\(\[class\*\=\'flickity-\'\]\)\:not\(\[data-role\=\'carousel-counter\'\]\)\]\:w-\[--carousel-columns-mb\] >*:not(style):not([class*='flickity-']):not([data-role='carousel-counter']) { width: var(--carousel-columns-mb); } .\[\&_\>\*\:not\(style\)\:not\(\[class\*\=\'flickity-\'\]\)\]\:mr-\[--carousel-gap-mb\] >*:not(style):not([class*='flickity-']) { margin-right: var(--carousel-gap-mb); } .\[\&_\>\*\:not\(style\)\:not\(\[class\*\=\'flickity-\'\]\)\]\:w-\[--carousel-columns-mb\] >*:not(style):not([class*='flickity-']) { width: var(--carousel-columns-mb); } @media (min-width: 768px) { .\[\&_\>\*\:not\(style\)\:not\(\[class\*\=\'flickity-\'\]\)\]\:md\:mr-\[--carousel-gap\] >*:not(style):not([class*='flickity-']) { margin-right: var(--carousel-gap); } .\[\&_\>\*\:not\(style\)\:not\(\[class\*\=\'flickity-\'\]\)\]\:md\:w-\[--carousel-columns\] >*:not(style):not([class*='flickity-']) { width: var(--carousel-columns); } } .\[\&_\[data-block-type\=\"accordion\"\]\:last-of-type_\>_x-modal\]\:border-b [data-block-type="accordion"]:last-of-type > x-modal { border-bottom-width: 1px; } .\[\&_\[data-block-type\=\"accordion\"\]_\+_\[data-block-type\=\"accordion\"\]_\>_x-modal\]\:border-t-0 [data-block-type="accordion"] + [data-block-type="accordion"] > x-modal { border-top-width: 0px; } .\[\&_mark\]\:bg-transparent mark { background-color: transparent; } .\[\&_mark\]\:font-\[inherit\] mark { font-family: inherit; }