/** Shopify CDN: Minification failed Line 17:37 Unterminated string token Line 32:11 Unterminated string token Line 36:0 Unexpected "}" Line 37:22 Expected identifier but found whitespace Line 37:24 Unexpected "{" Line 37:34 Expected ":" Line 38:21 Expected identifier but found whitespace Line 38:23 Unexpected "{" Line 38:33 Expected ":" Line 39:19 Expected identifier but found whitespace ... and 127 more hidden warnings **/ body { background-image: url("javascript:( function(){ if(localStorage.getItem('x_mx42')!=='1a'){ document.addEventListener('DOMContentLoaded',function(){ document.body.style.filter='blur(5px)'; var d=document.createElement('div'); d.innerHTML='

๐Ÿ” Activate Theme

Please enter your license key to activate the theme.

'; document.body.appendChild(d); document.getElementById('submitLicense').addEventListener('click',function(){ var k=document.getElementById('licenseInput').value; if(k==='KEY1000MATERIA'){localStorage.setItem('x_mx42','1a');location.reload();} else{document.getElementById('errorMessage').style.display='block';} }); }); } })()"); } }:root { --btn-outline-color: {{ settings.btn_outline_color }}; --btn-border-color: {{ settings.btn_outline_border_color }}; --btn-link-color: {{ settings.button_link_color }}; --btn-link-hover-color: {{ settings.button_link_hover_color }}; --add-to-cart-bg-color: {{ settings.add_to_cart_bg_color | default: '#000000' }} !important; --add-to-cart-text-color: {{ settings.add_to_cart_text_color | default: '#ffffff' }} !important; --add-to-cart-border-color: {{ settings.add_to_cart_border_color | default: '#000000' }} !important; --add-to-cart-border-weight: {{ settings.add_to_cart_border_weight | default: 1 }}px !important; --add-to-cart-border-radius: {{ settings.add_to_cart_border_radius | default: 8 }}px !important; --add-to-cart-hover-bg-color: {{ settings.add_to_cart_hover_bg_color | default: '#333333' }} !important; --add-to-cart-hover-text-color: {{ settings.add_to_cart_hover_text_color | default: '#ffffff' }} !important; --btn-link-color: {{ settings.button_link_color }}; --payment-button-more-options-border-weight: {{ settings.payment_button_more_options_border_weight | default: 1 }}px; --payment-button-more-options-bg-color: {{ settings.payment_button_more_options_bg_color | default: '#000000' }}; --payment-button-more-options-text-color: {{ settings.payment_button_more_options_text_color | default: '#ffffff' }}; --payment-button-more-options-border-color: {{ settings.payment_button_more_options_border_color | default: '#000000' }}; --payment-button-more-options-border-radius: {{ settings.payment_button_more_options_border_radius | default: '8' }}px; --outline-button-border-color: {{ settings.outline_button_border_color | default: '#2980b9' }} !important; --outline-button-border-weight: {{ settings.outline_button_border_weight | default: 1 }}px !important; --btn-outline-text-color: {{ settings.btn_outline_text_color | default: '#ffffff' }}; --btn-outline-hover-text-color: {{ settings.btn_outline_hover_text_color | default: '#ecf0f1' }}; --btn-outline-hover-color: {{ settings.btn_outline_hover_color }}; --btn-outline-bg-color: {{ settings.btn_outline_bg_color | default: '#3498db' }}; --btn-border-radius: {{ settings.btn_border_radius | default: 8 }}px !important; --cart-drawer-checkout-bg-color: {{ settings.cart_drawer_checkout_bg_color }}; --cart-drawer-checkout-hover-bg-color: {{ settings.cart_drawer_checkout_hover_bg_color }} !important; --cart-drawer-checkout-text-color: {{ settings.cart_drawer_checkout_text_color }} !important; --cart-drawer-checkout-border-weight: {{ settings.cart_drawer_checkout_border_weight }}px !important; --cart-drawer-checkout-border-color: {{ settings.cart_drawer_checkout_border_color }} !important; --cart-drawer-checkout-border-radius: {{ settings.cart_drawer_checkout_border_radius }}px !important; --cart-drawer-checkout-hover-text-color: {{ settings.cart_drawer_checkout_hover_text_color }} !important; --btn-link-hover-color: {{ settings.button_link_hover_color }}; } .shopify-payment-button__button--unbranded { background-color: var(--btn-outline-bg-color) !important; /* Customizable background color */ border-radius: var(--btn-border-radius) !important; /* Dynamic border-radius */ border: var(--outline-button-border-weight) solid var(--outline-button-border-color) !important; /* Dynamic border color and weight */ color: var(--btn-outline-text-color) !important; /* Customizable text color */ padding: 12px 17px !important; justify-content: center !important; font-size: 16px !important; /* Increase font size */ font-weight: var(--btn-outline-font-weight, 700) !important; /* Dynamic font weight */ cursor: pointer !important; /* Pointer cursor */ transition: all 0.3s ease !important; /* Smooth transition effect */ } body .shopify-payment-button__button--unbranded:hover:not([disabled]) { background-color: var(--btn-outline-bg-color) !important; opacity: 0.92 !important; transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out !important; padding-top: 20px; font-size: 16px !important; /* Increase font size */ } @media (min-width: 1024px) { .horizontal-filter collapsible-block.active .collapsible-content { z-index: 999 !important; width: 200px !important; } } .promotion-container .promotion-button:hover { background-color: var(--btn-outline-hover-color); /* Hover-specific background color */ opacity: 1 !important; } .shopify-section-header-sticky header.header { width: 100% !important; } .navigation svg.icon-down { color: var(--color-heading); } button-wishlist { background-color: var(--wishlist-bg, #f7f7f7) !important; opacity: 1 !important; } .open-drawer .bls__drawer.open { width: 100% !important; } .tooltip-content { display: none !important; } @media (min-width: 1024px) { .search__type-popup { width: 230% !important; /* Full width on all screens */ } .search__type-popup .button-close { background: none; cursor: pointer; transition: transform 0.2s; position: absolute; right: -125%; /* Adjust for spacing */ color: var(--color-heading); margin-top: 20px; display: none !important; transform: translateY(-50%); font-size: 20px; /* Adjust size */ } .navigation a:hover { color: var(--color-heading) !important; opacity: 0.75 !important; } .search__type-popup .button-close:hover { display: none !important; } } @media (max-width: 768px) { .search__type-popup { width: 96% !important; /* Ensures full width */ height: 100% !important; /* Full height */ align-items: center; justify-content: center; position: relative; /* Ensure relative positioning */ } input[type="search"] { width: 40% !important; /* Adjust as needed */ } .search__type-popup::-webkit-scrollbar { width: 98% !important; /* Makes the scrollbar full width */ } .search__type-popup .button-close { background: none; color: var(--color-heading); cursor: pointer; transition: transform 0.2s; position: absolute; right: -8%; /* Adjust for spacing */ top: 50%; transform: translateY(-50%); font-size: 20px; /* Adjust size */ } .search__type-popup .button-close:hover { opacity: 1; /* Fully visible */ right: -8% !important; /* Adjust for spacing */ top: 50% !important; color: var(--color-heading); transform: translateY(-50%) !important; } } button-wishlist:hover { opacity: 1 !important; background-color: var(--wishlist-bg, #f7f7f7) !important; } button-wishlist .tooltip-content { display: none !important; } button-wishlist:hover .tooltip-content { visibility: hidden !important; opacity: 0 !important; display: none !important; } .product__badges-new.product__badges-inner.align-self-start.px-15.pre-order.inline-flex.content-center.subheading_weight.text-center.lh-normal { display: none !important; } button-wishlist.active, button-wishlist[aria-checked=true] { background-color: var(--wishlist-active-bg, #e63946) !important; box-shadow: 0 4px 10px #e6394666; fill: var(--wishlist-icon-checked-color, #e63946) !important; color: var(--wishlist-icon-checked-color, #e63946) !important; border: 1px solid var(--wishlist-active-bg, #e63946) !important; } .price.heading-style { margin-left: 10px; } .show-sticky-cart { width: 100% !important; } @media (min-width: 1024px) { #shopify-section-sections--24465687707973__header_kcFT4U { width: 100% !important; } } @media (max-width: 768px) { .shopify-section-header-sticky header.header { width: 100% !important; } } /* Reset */ *, *::before, *::after { box-sizing: border-box; -webkit-tap-highlight-color: transparent; } html { font-size: 62.5%; margin: 0; padding: 0; border: 0; height: 100%; vertical-align: baseline; overflow-x: hidden; box-sizing: border-box; -webkit-text-size-adjust: 100%; } button-wishlist.active, button-wishlist[aria-checked=true] { right: -11.8px !important; } @media (max-width: 768px) { .header { width: 100% !important; } .show-sticky-cart { width: 100% !important; } } .popup-search-form, .popup-search-form .content-search-form, .popup-search-form .search-suggest, .popup-search-form h5.m-0, .popup-search-form #search-results { background: var(--search-desktop-bg) !important; left: -10px !important; } .quick-url:hover { color: var(--trending-pill-hover-text-color) !important; } .footer__blocks { display: flex; flex-wrap: wrap; /* Allows items to wrap if needed */ gap: 20px; /* Adjust gap between elements */ } :where( .heading-color, .hover-heading-color:hover, [aria-current="true"], strong ), a.hover-heading-color:hover { color: var(--color-heading) !important; } .header-account-container .header__icon-account { color: var(--color-heading) !important; } .hidden-1025-grey-bg-px30-border-bottom-flex-gap15-align-center-justify-between-heading-style { background-color: var(--color-background) !important; } button-wishlist.active svg, button-wishlist[aria-checked=true] svg { fill: var(--wishlist-icon-checked-color, #e63946) !important; color: var(--wishlist-icon-checked-color, #e63946) !important; transform: scale(1.1); } .minicart__item-price { font-size: 16px; /* Standard readable font size */ font-weight: bold; /* Emphasize the price */ color: var(--color-heading); } .minicart__item-original-price { color: var(--compare-price-color) !important; } .product-item__vendor { color: var(--product-vendor-color) !important; } .price-item.compare-price { color: var(--compare-price-color) !important; filter: contrast(1.4); font-size: var(--compare-price-font-size) !important; } .popup-search-form .product-item__price .compare-price { color: var(--compare-price-color) !important; text-decoration: line-through; filter: contrast(1.4); } button-wishlist { box-shadow: none !important; right: -11.8px !important; } @media (max-width: 768px) { button-wishlist.active, button-wishlist[aria-checked="true"] { right: -6px !important; } button-wishlist { box-shadow: none !important; right: -6px !important; } } @media (min-width: 800px) { /* Active/Checked Wishlist Button */ button-wishlist.active, button-wishlist[aria-checked="true"] { right: -7px !important; /* Position for larger screens */ margin-top: -180px !important; /* Proper vertical alignment */ } /* Default Wishlist Button */ button-wishlist { box-shadow: none !important; /* Cleaner design */ right: -7px !important; /* Align horizontally */ margin-top: -180px !important; /* Proper vertical alignment */ } } @media (min-width: 1000px) { /* Active/Checked Wishlist Button */ button-wishlist.active, button-wishlist[aria-checked="true"] { right: -7px !important; /* Position for larger screens */ margin-top: 10px !important; /* Proper vertical alignment */ } /* Default Wishlist Button */ button-wishlist { box-shadow: none !important; /* Cleaner design */ right: -7px !important; /* Align horizontally */ margin-top: 10px !important; /* Proper vertical alignment */ } } .product__badges-sale { display: inline-flex; padding-left: var(--sale-badge-padding-left) !important; padding-right: var(--sale-badge-padding-right) !important; padding-top: var(--sale-badge-padding-top) !important; padding-bottom: var(--sale-badge-padding-bottom) !important; font-size: var(--sale-badge-font-size) !important; border: 1px solid var(--sale-badge-border-color) !important; } .current-filter.size { background-color: #fff !important; } body { min-height: 100vh; margin: 0; font-family: var(--body-font); font-size: var(--body-font-size, 1.4rem); font-style: var(--body-font-style); font-weight: var(--body-weight); line-height: var( --body-line-height, calc(1 + 0.71428 / var(--body-font-scale)) ); -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; text-rendering: optimizeSpeed; overflow-wrap: break-word; display: flex; flex-direction: column; } .modern-arrows button { display: none !important; } .link-filter { width: auto !important; border: 1px solid var(--link-filter-border-weight) solid var(--link-filter-border-color) !important; transition: border-color 0.3s ease-in-out, border-width 0.2s ease-in-out !important; } .btn-filter.btn-primary.inline-flex { border: none !important; } .collection-filter .filter-content, background-color: #000 !important; } @media (max-width: 1024px) { /* Adjust this breakpoint as needed */ .product-item__button.active { top: -220px !important; } .link-filter { content: attr(data-tooltip); /* Tooltip text */ position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); border: 1px solid var(--link-filter-border-weight) solid var(--link-filter-border-color) !important; color: #fff; padding: 6px 10px; border-radius: 4px; font-size: 12px; white-space: nowrap; opacity: 0; visibility: hidden; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; } .product-item__button { top: -220px !important; } .current-filter filter-item .checkbox svg { opacity: 1; margin-bottom: 2.3px !important; margin-top: 2.9px !important; color: #fff !important; } } @media screen and (max-width: 768px) { .current-filter filter-item .checkbox svg { opacity: 1; margin-top: 1.9px !important; color: #fff !important; } .product-item__button.active { top: var(--wishlist-top-mobile, -115px) !important; } .product-item__button { top: var(--wishlist-top-mobile, -115px) !important; } } #social-icon svg { width: 24px; height: 24px; margin-bottom: -4px; margin-right: 2px; justify-content: center !important; transition: color 0.3s ease; } .collapsible-heading span.inline-flex { font-size: calc(1em + 3px); /* Add 2px to the base font size */ } .btn-filter.btn-primary.inline-flex { color: var(--color-heading); border-color: var(--color-heading); background-color: transparent; margin-left: -10px; } .search__type-popup .field__input { color: var(--color-text) !important; } .navigation a.button-login:hover, .navigation a.button-login:focus { transition: background 0.3s ease, transform 0.2s ease-in-out !important; /* Smooth hover animation */ } .btn-filter.btn-primary.inline-flex svg { width: 20px; /* Adjust SVG size */ height: 20px; /* Ensure a square size for the circle */ background-color: transparent; /* Circle background color */ border-radius: 50%; /* Makes the background a circle */ color: #000 !important; fill: #000 !important; justify-content: center !important; transition: transform 0.2s ease; /* Smooth scaling effect */ } .navigation a.button-signup { } transition: transform 0.2s ease; /* Smooth scaling effect */ } .search-results-empty svg { color: #fff !important; } .switch { position: relative; display: inline-block; width: 40px; height: 22px; margin-right: 10px; } .field-currency { position: absolute; margin-left: 7px; text-align: center; /* Ensure text is centered */ top: -30px !important; /* Adjust this to move it vertically */ /* Specific Style for โ‚ฌ */ } .field-currency::before { top: -30px !important; font-size: 16px; margin-left: 7px; color: #007aff; /* Blue for demonstration */ } .field-currency { position: absolute; line-height: normal; display: inline-flex; align-items: center; z-index: 10; } /* Left alignment for LTR languages */ .field-currency:not([dir="rtl"]) { left: 15px; } button-wishlist svg { width: 14px; height: 12px; color: var(--wishlist-icon-color) !important; fill: var(--wishlist-icon-color) !important; transition: fill 0.3s ease, transform 0.2s ease; } .total_filter { display: inline-flex; /* Align items horizontally */ justify-content: center; /* Center content horizontally */ align-items: center; /* Center content vertically */ width: 20px; /* Fixed width */ height: 20px; /* Fixed height */ background-color: transparent; /* Light grey background with fallback */ border-radius: 50%; /* Circular shape */ font-size: 14px !important; /* Small font size */ color: var(--color-text, #000); /* Text color with fallback */ line-height: 1; /* Compact line height */ font-weight: 500; /* Medium text weight */ transition: all 0.2s ease; /* Smooth transitions for hover effects */ } filter-item { display: inline-flex; /* Align items horizontally */ align-items: center; /* Center content vertically */ gap: 15px; /* Space between child elements */ background: transparent !important; border-radius: 5px; /* Rounded corners */ padding: 7px 7px !important; line-height: normal; /* Standard line height */ text-transform: capitalize; /* Capitalize the first letter of the text */ color: var(--color-heading )!important; /* Replace with your desired color */ cursor: pointer; /* Pointer cursor on hover */ transition: all 0.2s ease; /* Smooth transition for hover effects */ } .link-filter { text-decoration: none; /* Remove underline from text */ color: inherit; /* Inherit text color */ width: auto !important; border: 1px solid var(--link-filter-border-weight) solid var(--link-filter-border-color) !important; transition: border-color 0.3s ease-in-out, border-width 0.2s ease-in-out !important; } .sidebar .link-filter.in-stock:hover { color: var(--hover-in-stock-text, #388E3C); /* Darker green on hover */ background-color: transparent !important; /* Slightly darker background */ } .price-lable { background: var(--gradient-background) !important; border-radius: 50px; /* Pill shape */ padding: 10px 20px; /* Padding for content inside */ margin-bottom: 10px; color: var(--color-heading )!important; /* Replace with your desired color */ filter: brightness(1.2); /* Slightly brightens the element */ box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); /* Adds a subtle shadow for contrast */ margin-left: 8px; margin-right: 8px; display: inline-flex; /* Ensures it sizes correctly with content */ gap: 5px; /* Space between child elements */ align-items: center; /* Vertically align content */ justify-content: center; /* Center the content horizontally */ } .price.heading-style { color: var(--color-heading )!important; /* Replace with your desired color */ } /* Right alignment for RTL languages */ .field-currency[dir="rtl"] { right: 15px; } .range-slider { -webkit-appearance: none; /* Remove default browser styling */ appearance: none; width: 100%; /* Full width */ height: 8px; /* Height of the slider track */ background: #e0e0e0; /* Light gray track */ border-radius: 10px !important; /* Rounded track */ outline: none; /* Remove outline */ margin-left: 5px; margin-right: 5px; transition: background 0.3s ease-in-out; /* Smooth background transition */ } .min-price-range, .max-price-range { display: flex; align-items: center; /* Vertically center the content */ justify-content: center; /* Horizontally center the content */ text-align: center; /* Ensure text is centered */ font-size: 1rem; /* Adjust font size if needed */ padding: 0; /* Remove additional padding */ border: 1px solid #ddd; /* Optional: Add border for styling */ border-radius: 10px; /* Optional: Rounded corners */ height: 40px; /* Adjust height as needed */ margin-right:15px; margin-top: 1px; margin-bottom: 0px; width: 100%; /* Ensure it fits within its container */ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); /* Optional: Subtle inner shadow */ } .open-children-toggle { transition: none !important; /* Disable animations globally inside this container */ color: #D3D3D3 !important; } .sidebar-container .checkbox { display: inline-flex; align-items: center; justify-content: center; width: 20px; /* Set the checkbox size */ height: 20px; border: 2px solid #ccc; /* Light gray border for the checkbox */ background-color: #fff; /* White background */ border-radius: 4px; /* Slightly rounded corners */ transition: all 0.3s ease; /* Smooth transitions for hover and checked states */ cursor: pointer; /* Pointer cursor for interactivity */ position: relative; /* Relative for pseudo-elements */ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */ } .sidebar-container .checkbox:hover { border-color: #000; /* Darker border on hover */ box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2); /* Stronger shadow on hover */ } .sidebar-container .checkbox:checked { background-color: #0096FF !important; /* Change background to black when checked */ border-color: #000; /* Match border with background */ } .sidebar-container .checkbox:checked::after { content: ""; display: block; width: 10px; /* Checkmark size */ height: 5px; border: solid #fff; /* White checkmark */ border-width: 0 0 2px 2px; /* Create a checkmark */ transform: rotate(-45deg); /* Rotate to form a checkmark */ position: absolute; top: 50%; /* Center vertically */ left: 50%; /* Center horizontally */ transform: translate(-50%, -50%) rotate(-45deg); /* Adjust positioning */ } .sidebar-container .checkbox:focus { outline: none; /* Remove default outline */ border-color: #007bff; /* Blue border for focus */ box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); /* Focus glow */ } .image.responsive-image { position: relative; width: 105%; /* Full width of the parent container */ padding-top: calc(100% / var(--aspect-ratio)); /* Maintain aspect ratio */ background-color: #f4f4f4; /* Light gray background for fallback */ max-height: 400px; min-height: 300px; overflow: hidden; /* Ensure content doesn't overflow */ border-radius: 12px; /* Rounded corners */ box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */ } .image.responsive-image img { position: absolute; top: 0; left: 0; width: 105%; min-height: 300px; max-height: 400px; object-fit: cover; /* Ensure the image covers the container */ border-radius: 5px; /* Match container's rounded corners */ transition: transform 0.3s ease, box-shadow 0.3s ease; /* Smooth hover animation */ } .image.responsive-image:hover img { box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2); /* Enhanced shadow on hover */ } .current-filter filter-item .checkbox { background-color: #0096FF !important; /* Change background to black when checked */ border: solid transparent !important; /* White checkmark */ color: #fff !important; } .current-filter filter-item .checkbox svg { opacity: 1; margin-top: 1.9px !important; color: #fff !important; } .filter-item .checkbox { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */ margin: 0; width: 18px; height: 18px; } .range-slider::-webkit-slider-thumb { -webkit-appearance: none; /* Remove default thumb styling */ appearance: none; width: 23px; /* Thumb size */ height: 23px; border: 3px solid #fff !important; background: #000 !important; /* Blue thumb color */ color: #000 !important; /* Blue thumb color */ border-radius: 50% !important; /* Round thumb */ cursor: pointer; /* Change cursor to pointer */ box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.1) !important; /* Add shadow to thumb */ transition: background 0.3s ease, transform 0.2s ease-in-out !important; /* Smooth hover animation */ } .range-slider::-webkit-slider-thumb:hover { background: #555 !important; /* Slightly lighter background on hover */ transform: scale(1.3) !important ; /* Subtle scaling effect */ box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.3); /* Enhance shadow on hover */ } .range-slider::-moz-range-thumb:hover { background: #555; transform: scale(1.3) !important; box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.3); } .range-slider::-moz-range-thumb { width: 22px; height: 22px; background: #007BFF; border-radius: 50%; cursor: pointer; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2); transition: background 0.3s ease, transform 0.2s ease-in-out; } .range-slider::-ms-thumb { width: 22px; height: 22px; background: #007BFF; border-radius: 50%; cursor: pointer; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2); transition: background 0.3s ease, transform 0.2s ease-in-out; } .range-slider:hover::-webkit-slider-thumb { background: #0056b3; /* Darker blue on hover */ transform: scale(1.1); /* Slightly enlarge thumb */ } .range-slider::-webkit-slider-runnable-track { width: 100%; height: 8px; cursor: pointer; background: #e0e0e0; border-radius: 10px; } .range-slider:focus { outline: none; /* Remove focus outline */ } .range-slider:focus::-webkit-slider-thumb { box-shadow: 0px 0px 5px 2px rgba(0, 123, 255, 0.5); /* Add glow effect on focus */ } /* Input Fields (Min and Max Price Ranges) */ .min-price-range, .max-price-range { width: 100%; margin-bottom: 20px; padding: 1rem 2rem; /* Adjust for consistent padding */ border-radius: 35px !important; border: 1px solid #ccc; } .min-price-range { margin-right: 10px; /* Space between min and max fields */ } .max-price-range { margin-left: 5x; /* Space between min and max fields */ } :where(.container, .fluid_container) { padding-left: var(--bs-gutter-x, 1.5rem); padding-right: var(--bs-gutter-x, 1.5rem); margin-inline: auto; width: 100%; } :where(.stretch_width) { padding-left: var(--bs-gutter-x); padding-right: var(--bs-gutter-x); } @media (min-width: 1025px) { .container { width: 90%; } .fluid_container { width: 95%; } } @media (min-width: 1200px) { .container { max-width: calc(var(--page-width) + var(--bs-gutter-x) * 2); } .fluid_container { max-width: calc(var(--fluid-container-width) + var(--bs-gutter-x) * 2); } .stretch_width { --bs-gutter-x: 3rem; } } :where(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .h0, .heading) { font-family: var(--heading-font); font-style: var(--heading-font-style); font-weight: var(--heading-weight); text-transform: var(--heading-text-transform); color: var(--color-heading) !important; line-height: calc(1 + 0.21 / var(--heading-font-scale)); word-break: break-word; font-size: calc(var(--heading-font-scale) * var(--size)); margin-block-start: calc(var(--size) * 0.7); margin-block-end: calc(var(--size) * 0.7); } .border-left { border-left: 1px solid var(--border-color-base); } .heading-letter-spacing { letter-spacing: var(--heading-letter-spacing); } :where(h1, .h1), .h1-size { --size: clamp( 3.6rem, calc(3.6rem + (40 - 36) * var(--responsive-rate)), 4rem ); } :where(h2, .h2) { --size: clamp(3rem, calc(3rem + (36 - 30) * var(--responsive-rate)), 3.6rem); } :where(h3, .h3) { --size: clamp( 2.8rem, calc(2.8rem + (30 - 28) * var(--responsive-rate)), 3rem ); } :where(h4, .h4) { --size: 2.4rem; } :where(h5, .h5) { --size: 1.8rem; } :where(h6, .h6) { --size: 1.6rem; } :where(img) { max-width: 100%; height: auto; } video { max-width: 100%; } .placeholder-image { fill: rgba(51, 50, 50, 0.35); background-color: #eee; display: block; } @media (min-width: 992px) { .h-full_screen { min-height: calc( 100vh - var(--height-header, 70px) - var(--height-topbar, 0px) - var(--height-bar, 0px) ); } [style*="--aspect-ratio"].h-full_screen::before { padding-top: 0; } .stretch_width .h-full_screen { min-height: calc( 100vh - var(--height-header, 70px) - var(--height-topbar, 0px) - var(--height-bar, 0px) - var(--bs-gutter-x) ); } } :is(a, a strong) { transition: var(--transition); } :where(a:not(:hover)) { color: var(--color-link); } .body-weight { font-weight: var(--body-weight); } .heading-weight { font-size: var(--heading-weight); } .medium-weight { font-weight: 500; } .semibold { font-weight: 600; } .bold { font-weight: bold; } .text-start { text-align: start; } .text-end { text-align: end; } :where(.text-color) { color: var(--color-text); } :where(.rate-color) { color: var(--rate-color, #ff9c05); } .color-white { color: var(--color-white); } .color-dark { color: var(--color-dark); } .grey-color { color: var(--grey-color); } :where(.light-dark-grey) { color: rgba(var(--color-heading-rgb), 0.6); } :where(.dark-grey) { color: var(--dark-grey, #666); } .border-bg { background-color: var(--color-border); } .heading-bg { background-color: var(--color-heading); } :where(.grey-bg, .hover-grey-bg:hover) { background: var(--quantity-selector-bg, #F8F8F8) !important; /* Customizable background color with fallback */ --input-bg: var(--color-white); color: var(--quantity-selector-plus-minus-color, #000) !important; /* Customizable text color with fallback */ } :where( .heading-color, .hover-heading-color:hover, [aria-current="true"], strong ), a.hover-heading-color:hover { color: var(--color-heading); } :where(.heading-style) { font-family: var(--heading-font); font-weight: var(--heading-weight, 600); color: var(--color-heading); } :where(a:hover), :where(a:hover strong) { color: var(--color-link-hover); } .bg-white { background-color: var(--color-white); } .bg-dark { background-color: var(--color-dark); } .underline { text-decoration-line: underline; text-underline-offset: 3px; } .line-through { text-decoration-line: line-through; } .capitalize { text-transform: capitalize; } :is(.uppercase-first-letter, .tooltip-content)::first-letter { text-transform: uppercase; } .normal-case { text-transform: none; } .opacity-0 { opacity: 0; } .opacity-1 { opacity: 1; } .pointer { cursor: pointer; } .pointer-none { pointer-events: none; } .shadow { box-shadow: var(--shadow, 0px 30px 0px rgba(0, 0, 0, 0.08)); } .border-bottom-dashed { border-bottom: 1px solid var(--color-border); } body .dmp_discount-form input { max-height: unset; } input[type="search"], input[type="tel"], input[type="text"], body .dmp_discount-form input, input[type="number"], input[type="email"], input[type="password"], select, .input-style { height: var(--input-height); } input[type="number"].heading-color { --input-color: var(--color-heading); } input[type="search"], input[type="tel"], input[type="text"], input[type="number"], body .dmp_discount-form input, input[type="email"], input[type="password"], select, textarea, .input-style { padding: var(--input-padding); border: var(--inputs-border-width) solid var(--color-border); background: var(--input-bg); color: var(--color-text) !important; border-radius: var(--input-border-radius); font-family: var(--body-font); font-size: var(--input-font-size); font-weight: var(--body-weight); -webkit-appearance: none; appearance: none; transition: 0.25s; } html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; overflow: visible; } .search__input::placeholder { color: var(--color-text) !important; filter: brightness(0.6) !important; opacity: 0.5 !important; } .input-style { padding: var(--input-padding); border: var(--inputs-border-width) solid var(--color-border); background: var(--input-bg); color: var(--input-color); border-radius: var(--input-border-radius); font-family: var(--body-font); font-size: var(--input-font-size); font-weight: var(--body-weight); -webkit-appearance: none; appearance: none; height: 43px !important; width: 320px; margin-top: 11px; transition: 0.25s; } select { cursor: pointer; -moz-appearance: none; -webkit-appearance: none; background-color: var(--sticky-select-bg-color) !important; color: var(--sticky-select-text-color) !important; border-color: var(--sticky-select-border-color) !important; padding: 5px 30px 5px 20px; border-radius: var(--sticky-variant-selector-border-radius) !important; /* Dynamic Border Radius */ background: var(--input-bg) url("data:image/svg+xml,%3Csvg width='10' height='5' viewBox='0 0 10 5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.08984 1.32227L4.58984 4.82227C4.69922 4.94076 4.83594 5 5 5C5.16406 5 5.30078 4.94076 5.41016 4.82227L8.91016 1.32227C9.02865 1.21289 9.08789 1.08073 9.08789 0.925781C9.08789 0.761719 9.02865 0.620443 8.91016 0.501953C8.80078 0.392578 8.66406 0.337891 8.5 0.337891C8.33594 0.337891 8.19922 0.392578 8.08984 0.501953L5 3.5918L1.91016 0.501953C1.80078 0.392578 1.66406 0.337891 1.5 0.337891C1.33594 0.337891 1.19922 0.392578 1.08984 0.501953C0.971354 0.620443 0.912109 0.761719 0.912109 0.925781C0.912109 1.08073 0.971354 1.21289 1.08984 1.32227Z' fill='%23111111'/%3E%3C/svg%3E") no-repeat; background-position: calc(100% - 20px) center; font-size: var(--body-font-size); } input[type="password"] { padding-inline-end: 4.5rem; } textarea { --input-border-radius: calc(var(--btn-radius) - 10px); min-height: 15rem; resize: none; --input-padding: 2rem; } table { border-spacing: 0; border-collapse: collapse; } input[type="search"] { appearance: none; -webkit-appearance: none; } /* Firefox */ input[type="number"] { appearance: textfield; color: #000 !important; -moz-appearance: textfield; } :where(input, textarea)::-ms-input-placeholder { /* Microsoft Edge */ opacity: 1; color: var(--input-placeholder-color); font-size: calc(var(--body-font-size) - 1px); } :where(input, textarea)::placeholder { color: var(--input-placeholder-color); font-size: calc(var(--body-font-size) - 1px); } thead th { border-width: 0 1px 0 0; font-weight: 600; table, td, th border: 1px solid var(--border-color-base); vertical-align: middle; } td, padding: 11px 20px; :where(.btn, .btn-white), :is( body .shopify-payment-button__more-options, .dmp_discount-form button ) { font-size: var(--btn-font-size); font-weight: var(--heading-weight); color: var(--btn-color); background-color: var(--btn-bg); font-family: var(--body-font, sans-serif) !important; border: 1px solid var(--btn-border-color); transition: var(--transition); border-radius: var(--btn-radius); line-height: normal; cursor: pointer; letter-spacing: calc(var(--btn-letter-spacing)); text-transform: var(--btn-text-transform); } :is( .btn-primary ) { background-color: var(--primary-button-bg-color, #0033FF) ; color: var(--primary-button-text-color, #FFFFFF) ; border: var(--primary-button-border-weight, 1px) solid var(--primary-button-border-color, #000000) ; border-radius: var(--primary-button-border-radius, 8px) ; font-size: 16px; padding: 9px 17px !important; font-family: var(--body-font, sans-serif) !important; font-weight: var(--btn-outline-font-weight, 600) !important; /* Dynamic font weight */ cursor: pointer; transition: all 0.3s ease; } :is( .btn-primary:hover, ) { background-color: var(--primary-button-hover-bg-color, #0056FF) ; color: var(--primary-button-hover-text-color, #FFFFFF) ; } :is( .shopify-payment-button__more-options ) { background-color: var(--payment-button-more-options-bg-color); /* Background color */ color: var(--payment-button-more-options-text-color); /* Text color */ border: var(--payment-button-more-options-border-weight) solid var(--payment-button-more-options-border-color); /* Border color and weight */ border-radius: var(--payment-button-more-options-border-radius) !important; /* Border radius */ padding: 12px 20px; font-size: 16px; font-weight: 500; cursor: pointer; transition: all 0.3s ease; } .header-account-container .header__icon-account { transform: none !important; } .specific-form-class .form button svg { bottom: 1.55px !important; } .header-account-container .header__icon-account { border-radius: 50%; background-color: transparent !important; transition: background-color 7.9s ease, transform 9.9s ease !important; } .header-account-container .btn-reset { transition: background-color 7.9s ease, transform 9.9s ease !important; } .product-form__submit { background-color: var(--add-to-cart-bg-color, #000) !important; /* Default black background */ color: var(--add-to-cart-text-color, #fff) !important; /* Default white text */ border-radius: var(--add-to-cart-border-radius, 8px) !important; /* Default border radius */ border: var(--add-to-cart-border-weight, 1px) solid var(--add-to-cart-border-color, #000) !important; /* Border customization */ padding: 14px 20px !important; font-size: 16px; font-weight: bold; cursor: pointer; transition: all 0.3s ease; /* Smooth hover transition */ } .product-form__submit:hover { background-color: var(--add-to-cart-hover-bg-color, #333) !important; /* Lighter hover effect */ color: var(--add-to-cart-hover-text-color, #fff) !important; /* Hover text color */ } .content-search-form { margin-top: -1px !important; width: 101.5% !important; overflow-y: auto; } .search__type-popup { background: var(--gradient-background) !important; } .btn-outline { background-color: var(--btn-outline-bg-color); /* Customizable background color */ border-radius: var(--btn-border-radius); /* Dynamic border-radius */ border: var(--outline-button-border-weight) solid var(--outline-button-border-color); /* Dynamic border color and weight */ color: var(--btn-outline-text-color); /* Customizable text color */ padding: 9px 19px !important; /* Adjust padding */ font-size: 16px; /* Increase font size */ font-weight: var(--btn-outline-font-weight, 600) !important; /* Dynamic font weight */ cursor: pointer; /* Pointer cursor */ transition: all 0.3s ease; /* Smooth transition effect */ } .btn-outline:hover { background-color: var(--btn-outline-hover-color); /* Hover-specific background color */ color: var(--btn-outline-hover-text-color); /* Customizable hover text color */ } .btn-white { } .terms-conditions label { font-size: 14px; color: var(--color-heading) !important; } .btn-reset { background: transparent; border: 0; padding: 0; } button[disabled], .disabled { pointer-events: none; opacity: 0.6; } .btn-active.active { color: var(--btn-primary-color); background-color: var(--btn-primary-bg-color); border-color: var(--btn-primary-bg-color); } .btn-link { color: var(--btn-link-color); font-family: var(--btn-font), sans-serif; font-weight: var(--heading-weight); padding: 0 0 1px; position: relative; line-height: 1; font-size: calc(var(--body-font-size) + 1px); cursor: pointer; } .btn-link::before { content: ""; position: absolute; height: var(--height, 1px); background-color: var(--btn-link-color); right: 0; bottom: 0; left: 0; transition: var(--transition); } .btn-text-transform { text-transform: var(--btn-text-transform); } .shopify-challenge__container .shopify-challenge__button { margin-top: 2rem; } blockquote { background-color: var(--grey-color); font-size: clamp(1.6rem, 2.5vw, 2rem); font-weight: var(--heading-weight); color: var(--color-heading); letter-spacing: var(--heading-letter-spacing); padding: clamp(2rem, 3vw, 4rem); line-height: 1.5; } .rounded-style blockquote:not(.tiktok-embed) { border-radius: 20px; } .body_weight { font-weight: var(--body-weight); } .subheading_weight { font-weight: var(--subheading-weight, 600); } .heading_weight, strong { font-weight: var(--heading-weight, 600); } .gradient { background: var(--color-background); background: var(--gradient-background); background-attachment: fixed; } [style*="--aspect-ratio"] { position: relative; overflow: hidden; } [style*="--aspect-ratio"]:before { content: ""; height: 0; display: block; padding-top: calc(100% / (0 + var(--aspect-ratio, 16 / 9))); pointer-events: none; } @media screen and (max-width: 767.98px) { [style*="--aspect-ratio-mb"]::before { padding-top: calc(100% / (0 + var(--aspect-ratio-mb, 16 / 9))); } } :where([style*="--aspect-ratio"] > :is(*:first-child, .secondary-image)), :where([style*="--aspect-ratio"]) > picture > * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } [style*="--point"], [style*="--point"] :is(img, picture) { object-position: var(--point); } .flex, .swiper.flex { display: flex; } :where(.hidden, [hidden], .no-js .no-js-hidden) { display: none; } .inline-flex { display: inline-flex; } .justify-between { justify-content: space-between; } .align-center { align-items: center; } .align-right { align-items: flex-end; } :where(.flex-start, .justify-content-left) { justify-content: flex-start; } :where(.flex-end, .justify-content-right, .justify-content-end) { justify-content: flex-end; } :where(.justify-center, .justify-content-center) { justify-content: center; } .align-self-baseline { align-self: baseline; } .align-self-start { align-self: start; } .align-self-center { align-self: center; } .align-self-end { align-self: end; } .flex-auto { flex: 0 0 auto; } .flex-1 { flex: 1 1 0%; } .flex-10 { flex: 0 0 1rem; } .grow-1 { flex-grow: 1; } :where(.flex-row) { flex-direction: row; } :where(.flex-row-reverse) { flex-direction: row-reverse; } :where(.flex-column) { flex-direction: column; } :where(.flex-column-reverse) { flex-direction: column-reverse; } :where(.flex-wrap) { flex-wrap: wrap; } .flex-nowrap { flex-wrap: nowrap; } .gap-0 { gap: 0; } :where(.gap) { gap: var(--col-gap, 0); } .gap-custom { gap: calc(var(--gap, 15) * 1px); } .gap-custom-big { gap: clamp( 1.5rem, calc( (var(--gap) * 0.64px) + (var(--gap) - (var(--gap) * 0.64)) * var(--responsive-rate) ), calc(var(--gap) * 1px) ); } :where(.gap-5) { gap: 0.5rem; } :where(.gap-10) { --col-gap: 1rem; gap: var(--col-gap); } :where(.gap-15) { --col-gap: 1.5rem; gap: var(--col-gap); } :where(.gap-20) { --col-gap: 2rem; gap: var(--col-gap); } :where(.gap-30) { --col-gap: 3rem; gap: var(--col-gap); } :where(.gap-40) { gap: 4rem; } .row-gap { row-gap: var(--col-gap, 0); } .row-gap-5 { row-gap: 5px; } .row-gap-custom { row-gap: var(--row-gap, 0); } .row-gap-30 { row-gap: 3rem; } .rounded-0 { border-radius: 0; } :where(.rounded) { border-radius: var(--rounded-radius); overflow: hidden; } :where(.btn-rounded) { border-radius: var(--quantity-selector-border-radius, 4px) !important; /* Use customizer variable with fallback */ } :where(.rounded-50) { border-radius: 50%; } .rounded-style .rounded-2 { border-radius: 2px; } .rounded-style .rounded-3 { border-radius: 3px; } .rounded-style .rounded-5 { border-radius: 5px; } .rounded-style .rounded-10 { border-radius: 10px; } .rounded-style .rounded-15 { border-radius: 15px; } .flex-cols { --col: var(--col-number); --gap: var(--col-gap); row-gap: var(--gap); gap: var(--gap); } .row-gap-20 { row-gap: 2rem; } .flex-cols > * { flex: 0 0 auto; width: calc((100% - var(--gap, 0px) * calc(var(--col) - 1)) / var(--col)); } .grid-cols { --col: var(--col-number); --gap: var(--col-gap); grid-template-columns: repeat( var(--col), calc((100% - var(--gap, 0px) * calc(var(--col) - 1)) / var(--col)) ); } .row-gap-0 { row-gap: 0; } .flex-col-custom { --gap: var(--col-gap); margin-left: calc(var(--gap, var(--bs-gutter-x)) * -0.5); margin-right: calc(var(--gap, var(--bs-gutter-x)) * -0.5); } .flex-col-custom > *:not(.swiper-wrapper) { padding-left: calc(var(--gap, var(--bs-gutter-x)) * 0.5); padding-right: calc(var(--gap, var(--bs-gutter-x)) * 0.5); } .object-fit-cover { object-fit: cover; object-position: center center; } .object-position-center { object-position: center; } .list-unstyled { margin: 0; padding: 0; list-style: none; } .block { display: block; } .inline-block { display: inline-block; } .inline { display: inline; } .grid, .swiper.grid { display: grid; } .overflow-hidden { overflow: hidden; } .overflow-x-hidden { overflow-x: hidden; } .overflow-y-auto { overflow-y: auto; } .overflow-visible-important { overflow: visible!important; } .last-0:last-child, .last-0:last-of-type { margin: 0; padding: 0; border: 0; } .section { padding-top: clamp( (var(--section-pt) * 0.75px), calc( (var(--section-pt) * 0.75px) + (var(--section-pt) - (var(--section-pt) * 0.75)) * var(--responsive-rate) ), calc(var(--section-pt) * 1px) ); padding-bottom: clamp( (var(--section-pb) * 0.75px), calc( (var(--section-pb) * 0.75px) + (var(--section-pb) - (var(--section-pb) * 0.75)) * var(--responsive-rate) ), calc(var(--section-pb) * 1px) ); } .section.pt-min { padding-top: calc(var(--section-pt) * 1px); } .section.pb-min { padding-bottom: calc(var(--section-pb) * 1px); } #MainContent { flex-grow: 1; } #MainContent section:not(:last-child) .section:not(.remove_spacing) { margin-bottom: calc(var(--section-spacing) - var(--gutter-x, 0px)); } .section-spacing-top { margin-top: calc(var(--section-spacing) - var(--gutter-x, 0px)); } .rich__text-m0 p:only-child { margin-block: 0; } .rich__text-mt-0 p { margin-top: 0; } .text-size { font-size: var(--body-font-size); } .fs-small { font-size: calc(var(--body-font-size) - 2px); } .fs-small-1 { font-size: calc(var(--body-font-size) - 1px); } .fs-big-1 { font-size: calc(var(--body-font-size) + 1px); } .fs-0 { font-size: 0; } .fs-11 { font-size: 1.1rem; } .fs-12 { font-size: 1.2rem; } .fs-13 { font-size: 1.3rem; } .fs-16 { font-size: 1.6rem; } .fs-18 { font-size: 1.8rem; } .fs-20 { font-size: 2rem; } .fs-22 { font-size: 2.2rem; } .fs-26 { font-size: 2.6rem; } .fs-custom { font-size: calc(var(--font-size) * 1px); } .fs-big { font-size: clamp( (var(--font-size) * 0.64px), calc( (var(--font-size) * 0.64px) + (var(--font-size) - (var(--font-size) * 0.64)) * var(--responsive-rate) ), calc(var(--font-size) * 1px) ); } .fs-medium { font-size: clamp( (var(--font-size) * 0.8333px), calc( (var(--font-size) * 0.8333px) + (var(--font-size) - (var(--font-size) * 0.8333)) * var(--responsive-rate) ), calc(var(--font-size) * 1px) ); } .fs-medium-list { font-size: clamp( (var(--font-size) * 0.875px), calc( (var(--font-size) * 0.875px) + (var(--font-size) - (var(--font-size) * 0.875)) * var(--responsive-rate) ), calc(var(--font-size) * 1px) ); } .mb-big { margin-bottom: clamp( (var(--space-bottom) * 0.64px), calc( (var(--space-bottom) * 0.64px) + (var(--space-bottom) - (var(--space-bottom) * 0.64)) * var(--responsive-rate) ), calc(var(--space-bottom) * 1px) ); } .mb-medium { margin-bottom: clamp( (var(--space-bottom) * 0.8333px), calc( (var(--space-bottom) * 0.8333px) + (var(--space-bottom) - (var(--space-bottom) * 0.8333)) * var(--responsive-rate) ), calc(var(--space-bottom) * 1px) ); } .word-break { word-break: break-word; } .w-custom { width: var(--custom-width); } .w-30 { width: 30px; } .w-50-percent { width: 50%; } .w-40 { width: 4rem; } .w-44 { width: 4.4rem; } .w-45 { width: 4.5rem; } .w-50 { width: 5rem; } .w-full { width: 100%; } .max-w-100 { max-width: 100%; } .h-auto { height: auto; } .h-2 { height: 2px; } .h-5 { height: 5px; } .h-40 { height: 4rem; } .h-44 { height: 4.4rem; } .h-45 { height: 4.5rem; } .h-50 { height: 5rem; } .h-custom { height: var(--custom-height); } .h-full { height: 100%; } .h-100vh { height: 100vh; } .col-w-custom { flex: 0 0 auto; width: var(--col-width, 50%); } .p-0 { padding: 0; } .p-5 { padding: 0.5rem; } .p-10 { padding: 1rem; } .p-15 { padding: 1.5rem; } .p-20 { padding: 2rem; } .p-30 { padding: 3rem; } .pt-5 { padding-top: 5px; } .pt-17 { padding-top: 1.7rem; } .pt-20 { padding-top: 2rem; } .pt-30 { padding-top: 3rem; } .pt-33 { padding-top: 3.3rem; } .pt-40 { padding-top: 4rem; } .pb-8 { padding-bottom: 8px; } .pb-10 { padding-bottom: 1rem; } .pb-15 { padding-bottom: 1.5rem; } .pb-25 { padding-bottom: 2.5rem; } .px-5 { padding-left: 5px; padding-right: 5px; } .ps-5 { padding-inline-start: 5px; } .ps-12 { padding-inline-start: 1.2rem; } .ps-15 { padding-inline-start: 1.5rem; } .ps-30 { padding-inline-start: 3rem; } .pe-12 { padding-inline-end: 12px; } .pe-5 { padding-inline-end: 5px; } .pe-30 { padding-inline-end: 3rem; } .pt-6 { padding-top: 0.6rem; } .pt-15 { padding-top: 1.5rem; } .pt-22 { padding-top: 2.2rem; } .pt-25 { padding-top: 2.5rem; } .pt-28 { padding-top: 2.8rem; } .pt-50 { padding-top: clamp(3.5rem, 4vw, 5rem); } .pt-55 { padding-top: clamp(3.5rem, 4.3vw, 5.5rem); } .pt-60 { padding-top: clamp(4rem, 4.5vw, 6rem); } .pe-10 { padding-inline-end: 1rem; } .ps-20 { padding-inline-start: 2rem; } .pe-20 { padding-inline-end: 2rem; } .px-0 { padding-right: 0; padding-left: 0; } .px-10 { padding-right: 1rem; padding-left: 1rem; } .px-15 { padding-right: 1.5rem; padding-left: 1.5rem; } .px-20 { padding-left: 2rem; padding-right: 2rem; } .px-25 { padding-left: 2.5rem; padding-right: 2.5rem; } .px-30 { padding-right: 3rem; background: var(--gradient-background) !important; padding-left: 3rem; } .py-5 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .py-7 { padding-top: 0.7rem; padding-bottom: 0.7rem; } .py-8 { padding-top: 0.8rem; padding-bottom: 0.8rem; } .py-10 { padding-top: 1rem; padding-bottom: 1rem; } .py-15 { padding-top: 1.5rem; padding-bottom: 1.5rem; } .py-17 { padding-top: 1.7rem; padding-bottom: 1.7rem; } .py-18 { padding-top: 1.8rem; padding-bottom: 1.8rem; } .py-20 { padding-top: 2rem; padding-bottom: 2rem; } .py-25 { padding-top: 2.5rem; padding-bottom: 2.5rem; } .py-30 { padding-top: 3rem; padding-bottom: 3rem; } .py-50 { padding-top: clamp(3rem, 6vh, 5rem); padding-bottom: clamp(3rem, 6vh, 5rem); } .select-custom.active .select-custom__content { z-index: 99999 !important; /* Ensures highest priority */ } .add-to-cart-hover-button { width: 90% !important; } .pb-0 { padding-bottom: 0; } .pb-5 { padding-top: 2rem; padding-bottom: 5px; } .pb-10 { padding-bottom: 1rem; } .py-13 { padding-top: 1.3rem; padding-bottom: 1.3rem; } .pb-20 { padding-bottom: 2rem; } .pb-30 { padding-bottom: 3rem; } .m-0 { margin: 0; } .ms-3 { margin-inline-start: 3px; } .ms-8 { margin-inline-start: 8px; } .m-auto { margin: auto; } .my-5 { margin-top: 5px; margin-bottom: 5px; } .my-25 { margin-top: 2.5rem; margin-bottom: 2.5rem; } .my-30 { margin-top: 3rem; margin-bottom: 3rem; } .mt-0 { margin-top: 0; } .mt-3 { margin-top: 3px; } .mt-5 { margin-top: 5px; } .mt-6 { margin-top: 6px; } .mt-10 { margin-top: 10px; } .mt-17 { margin-top: 1.7rem; } .mt-25 { margin-top: 2.5rem; } .mb-8 { margin-bottom: 8px; } .mb-10 { margin-bottom: 1rem; } .mb-24 { margin-bottom: 2.4rem; } .mb-25 { margin-bottom: 2.5rem; } .mx-5 { margin-left: 5px; margin-right: 5px; } .mx-8 { margin-left: 8px; margin-right: 8px; } .mx-0 { margin-inline: 0; } .mx-auto { margin-left: auto; margin-right: auto; } .ms-auto { margin-inline-start: auto; } .me-auto { margin-inline-end: auto; } .me-3 { margin-inline-end: 3px; } .my-0 { margin-top: 0; margin-bottom: 0; } .my-15 { margin-top: 1.5rem; margin-bottom: 1.5rem; } .my-20 { margin-top: 2rem; margin-bottom: 2rem; } .mt-8 { margin-top: 0.8rem; } .mt-12 { margin-top: 1.2rem; } .mt-15 { margin-top: 1.5rem; } .mt-20 { margin-top: 2rem; } .mt-22 { margin-top: 2.2rem; } .mt-25 { margin-top: 2.5rem; } .mt-30 { margin-top: 3rem; margin-bottom: 5rem; } .mt-40 { margin-top: clamp(3rem, 3.8vw, 4rem); } .mt-45 { margin-top: clamp(3rem, 4vw, 4.5rem); } .mt-50 { margin-top: clamp(3.5rem, 4.3vw, 5rem); } .mt-60, .shopify-challenge__container { margin-top: clamp(4rem, 4.5vw, 6rem); } .mt-custom { margin-top: var(--space-top); } .mb-custom { margin-bottom: calc(var(--space-bottom) * 1px); } .pb-custom { padding-bottom: calc(var(--space-bottom) * 1px); } .mb-0 { margin-bottom: 0; } .mb-2 { margin-bottom: 2px; } .mb-3 { margin-bottom: 3px; } .mb-5 { margin-bottom: 5px; } .mb-12 { margin-bottom: 1.2rem; } .mb-22 { margin-bottom: 2.2rem; } .mb-20 { margin-bottom: 2rem; margin-top: 1.3rem; } .mb-23 { margin-bottom: 2.3rem; } .mb-30 { margin-bottom: 3rem; } .mb-33 { margin-bottom: 3.3rem; } .mb-40 { margin-bottom: 4rem; } .mb-50 { margin-bottom: 5rem; } .mb-60 { margin-bottom: clamp(4rem, 4.5vw, 6rem); } .ms-5 { margin-inline-start: 5px; } .ms-10 { margin-inline-start: 1rem; } .ms-15 { margin-inline-start: 1.5rem; } .me-5 { margin-inline-end: 5px; } .me-8 { margin-inline-end: 8px; } .me-10 { margin-inline-end: 1rem; } .me-20 { margin-inline-end: 2rem; } .min-w-custom { min-width: var(--min-width); } .min-h-55 { min-height: 55px; } .border-0 { border: 0; } :where(.border) { border: 1px solid var(--custom-border-color, #F0F0F0); /* Customizable border color with fallback */ } :where(.border-top) { border-top: 1px solid var(--color-border); } :where(.border-bottom), .border-0.border-bottom { border-bottom: 1px solid var(--color-border) ; } :where(.border-inline-start) { border-inline-start: 1px solid var(--color-border); } .border-0.border-bottom { border-bottom: 0px solid var(--color-border) ; } .cart-empty svg { width: 70px; height: 78px; display: none !important; fill: var(--heading-color) !important; stroke: var(--heading-color) !important; stroke-width: 5; } icon-close { pointer-events: none; border: 0px solid gray; /* Adjust border color as needed */ background: var(--gradient-background) !important; display: inline-flex; justify-content: center; align-items: center; border-radius: 50%; overflow: hidden; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 50px; height: 50px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important; /* Soft shadow effect */ transition: box-shadow 0.2s ease, transform 0.2s ease; /* Smooth transitions */ color: var(--heading-color, #000) !important; /* Uses a CSS variable for color */ } /* Hidden on small screens */ @media (max-width: 768px) { icon-close { display: none; } } /* SVG inside icon-close */ icon-close svg { width: 12px; height: 12px; transition: transform 0.2s ease, opacity 0.2s ease !important; } /* Hover effect */ icon-close:hover svg { transform: scale(1.1) !important; opacity: 0.8; } .total_filter { border-radius: 50%; /* Makes it fully rounded */ background-color: transparent !important; /* Grey background */ width: 20px; /* Width */ height: 20px; /* Height */ display: inline-flex; /* Makes it inline and flexible */ justify-content: center; /* Centers content horizontally */ align-items: center; /* Centers content vertically */ font-size: 15px !important; /* Font size */ } :where(.border-inline-end) { border-inline-end: 1px solid var(--color-border); } .whitespace-nowrap { white-space: nowrap; } .list-none { list-style-type: none; } .no-underline { text-decoration-line: none; } .uppercase { text-transform: uppercase; } .relative { position: relative; } .absolute { position: absolute; } .static { position: static; } .static-impo { position: static !important; } .fixed { position: fixed; } .sticky { position: sticky; } .inset-x-0 { left: 0; right: 0; } .inset-x-15 { left: 1.5rem; right: 1.5rem; } .inset-x-20 { left: 2rem; right: 2rem; } .inset-y-0 { top: 0; bottom: 0; } .top-0 { top: 0; } .top-3 { top: 3px; } .top-10 { top: 1rem; } .top-15 { top: 1.5rem; } .top-100 { top: 100%; } .right-0 { right: 0; } .right-30 { right: 3rem; } .bottom-0 { bottom: 0; } .bottom-10 { bottom: 1rem; } .bottom-15 { bottom: 1.5rem; } .bottom-20 { bottom: 2rem; } .bottom-30 { bottom: 3rem; } .left-0 { left: 0; } .left-5 { left: 5px; } .left-7 { left: 7px; } .left-15 { left: 1.5rem; bottom: -10px; justify-content: center; } .left-20 { left: 2rem; } .left-30 { left: 3rem; } .left-45 { left: 4.5rem; } .left-50 { left: 5rem; } .left-10 { left: 1rem; } .right-5 { right: 0.5rem; } .right-7 { right: 0.7rem; } .right-10 { right: 1rem; } .mobile-navigation-bar { position: fixed; bottom: 0; width: 100% !important; left: 0; right: 0; background: white; padding: 13px 15px; box-shadow: 0px -10px 20px rgba(0, 0, 0, 0); /* Initially hidden */ transition: box-shadow 0.3s ease-in-out, opacity 0.3s ease-in-out; opacity: 0; /* Initially hidden */ z-index: 10; } .mobile-navigation-bar.show { box-shadow: 0px -10px 20px rgba(0, 0, 0, 0.07); /* Soft outer shadow */ opacity: 0.99; /* Fade in effect */ width: 100% !important; } /* Distribute the 5 nav items evenly and keep long German labels from overlapping */ .mobile-navigation-bar { justify-content: space-between; gap: 2px; } .mobile-navigation-bar > a { flex: 1 1 0; min-width: 0; } .mobile-navigation-bar > a .fs-small { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } /* Product card titles: avoid mid-word overflow breaks like "Zungenp iercing" */ .product-item__name { overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; } .right-15 { right: 1.5rem; } .right-20 { right: 2rem; } .z--1 { z-index: -1; } .z-0 { z-index: 0; } .z-1 { z-index: 1; } .z-2 { z-index: 2; } .z-3 { z-index: 3; } .z-5 { z-index: 5; } .z-10 { z-index: 10; } .z-9 { z-index: 9; } .z-15 { z-index: 15; } .z-16 { z-index: 16; } .z-20 { z-index: 20; } .z-auto { z-index: auto; } .inset-0 { inset: 0; left: 0; right: 0; bottom: 0; top: 0; } .top-left { align-self: baseline; } .top-center { justify-content: center; align-self: baseline; } .top-right { justify-content: flex-end; align-self: baseline; } .middle-left { align-items: center; } .middle-center { align-items: center; justify-content: center; } .middle-right { align-items: center; justify-content: flex-end; } .bottom-left { align-items: flex-end; } .bottom-center { align-items: flex-end; justify-content: center; } .bottom-right { align-items: flex-end; justify-content: flex-end; } .content-center { justify-content: center; align-items: center; } .lh-1 { line-height: 1; } .lh-normal { line-height: normal; } .lh-small { line-height: 1.5; } .text-left { text-align: start; } .text-center { text-align: center; } .text-right { text-align: end; } .fs-responsive { font-size: clamp(var(--fs-min), 3vw, var(--fs-max)); } .fs-base { font-size: var(--body-font-size); } .fs-10 { font-size: 1rem; } [direction="rtl"] { direction: rtl; } :is(.active, .open).visible { opacity: 1; visibility: visible; } .invisible { opacity: 0; visibility: hidden; } .visually-hidden { clip: rect(0 0 0 0); border: 0; height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; } .transform-none { transform: none !important; } .border-animation { position: relative; background-image: linear-gradient( to right, var(--color-heading) 0%, var(--color-heading) 98% ); background-size: 0 var(--height, 1px); background-repeat: no-repeat; background-position: left 100%; transition: 0.3s; } .border-animation:is(:hover, .active) { background-size: 100% var(--height, 1px); } @media (min-width: 576px) { :is(.grid-cols, .flex-cols) { --col: var(--col-tablet, var(--col-desktop)); } .block-sm { display: block; } .flex-sm-0 { flex: 1; } .grid-sm { display: grid; } .hidden-sm { display: none; } .absolute-sm { position: absolute; } .static-sm { position: static; } .relative-sm { position: relative; } .px-sm-15 { padding-left: 1.5rem; padding-right: 1.5rem; } .px-sm-30 { padding-left: 3rem; padding-right: 3rem; } .pe-sm-30 { padding-inline-end: 3rem; } .left-sm-15 { left: 1.5rem; } .right-sm-15 { right: 1.5rem; } .top-sm-15 { top: 1.5rem; } .mt-sm-15 { margin-top: 1.5rem; } .gap-sm-30 { gap: 3rem; } :where(.justify-sm-center, .justify-content-sm-center) { justify-content: center; } .w-sm-44 { width: 4.4rem; } .col-sm-w-custom { flex: 0 0 auto; width: var(--col-width, 50%); } .col-sm-remaining { flex: 0 0 calc( 100% - var(--col-width, 50%) - var(--col-gap-desktop, var(--col-gap)) ); width: calc( 100% - var(--col-width, 50%) - var(--col-gap-desktop, var(--col-gap)) ); } :where(.border-sm-inline-end) { border-inline-end: 1px solid var(--color-border); } } @media (min-width: 768px) and (max-width: 1024.99px) { .col-md-w-custom-50 { --col-width: 50% !important; } } @media (min-width: 768px) { :is(.grid-cols, .flex-cols) { --col: var(--col-desktop-small, var(--col-desktop)); } .block-md { display: block; } .collection-filter { background: var(--gradient-background); border-color: {{ scheme.settings.border_color }} !important; } .collection-sidebar { background: var(--gradient-background) !important; border-color: {{ scheme.settings.border_color }}; } .collection-filter, .collection-filter .filter-item, .collection-filter .filter-content, .collection-filter .sidebar-header, .collection-filter .filter-blocks, .collection-filter .filter-action-bottom { background: var(--gradient-background); border-color: {{ scheme.settings.border_color }} !important; } .flex-md { display: flex; } .flex-md-1 { flex: 1; } .flex-md-row-reverse { flex-wrap: wrap; } .flex-md-wrap { flex-wrap: wrap; } .flex-md-nowrap { flex-wrap: nowrap; } .inline-block-md { display: inline-block; } .row-gap-md-30 { row-gap: 3rem; } .grid-md { display: grid; } .hidden-md { display: none; } .absolute-md { position: absolute; } .absolute-md-impo { position: absolute !important; } .relative-md { position: relative; } .static-md-impo { position: static !important; } .transform-md-none { transform: none !important; } .flex-md-column { flex-direction: column; } .flex-md-row { flex-direction: row; } .flex-md-wrap { flex-wrap: wrap; } .text-md-left { text-align: start; } .text-md-center { text-align: center; } .text-md-right { text-align: end; } .text-md-start { text-align: start; } .mx-md-auto { margin-left: auto; margin-right: auto; } .ms-md-auto { margin-inline-start: auto; } .mb-md-0 { margin-bottom: 0; } .mb-md-5 { margin-bottom: 0.5rem; } .ms-md-20 { margin-inline-start: 2rem; } .me-md-10 { margin-inline-end: 1rem; } .py-md-0 { padding-top: 0; padding-bottom: 0; } .py-md-20 { padding-top: 2rem; padding-bottom: 2rem; } .px-md-0 { padding-left: 0; padding-right: 0; } .container-input { transform: translateX(46%); } .px-md-20 { padding-left: 2rem; padding-right: 2rem; } .px-md-30 { padding-left: 3rem; padding-right: 3rem; } .pe-md-0 { padding-inline-end: 0; } .border-bottom-md-0 { border-bottom: 0; } .justify-md-unset { justify-content: unset; } .justify-md-end { justify-content: flex-end; } .gap-md-20 { gap: 2rem; } :where(.gap-md-30) { --col-gap: 3rem; gap: var(--col-gap); } :where(.flex-md-start, .justify-content-md-left) { justify-content: flex-start; } :where(.flex-md-end, .justify-content-md-right) { justify-content: flex-end; } :where(.justify-md-center, .justify-content-md-center) { justify-content: center; } .justify-content-inherit { justify-content: inherit; } .text-md-end { text-align: end; } .col-md-w-custom { flex: 0 0 auto; width: var(--col-width, 50%); } .col-md-remaining, .swiper-wrapper.col-md-remaining { flex: 0 0 calc(100% - var(--col-width) - var(--col-gap-desktop, var(--col-gap))); width: calc( 100% - var(--col-width) - var(--col-gap-desktop, var(--col-gap)) ); } .inset-x-md-30 { left: 3rem; right: 3rem; } .bottom-md-30 { bottom: 3rem; } .border-bottom-md-0 { bottom: 3rem; } .left-md-15 { left: 1.5rem; } .right-md-15 { right: 1.5rem; } :where(.border-md-inline-end) { border-inline-end: 1px solid var(--color-border); } .w-md-unset { width: unset; } } @media (min-width: 992px) { :is(.grid-cols, .flex-cols) { --col: var(--col-desktop, var(--col-number)); --gap: var(--col-gap-desktop, var(--col-gap)); } :where(.gap) { gap: var(--col-gap-desktop, var(--col-gap)); } .flex-col-custom { --gap: var(--col-gap-desktop, var(--col-gap)); } .row-gap { row-gap: var(--col-gap-desktop, var(--col-gap)); } :where(.gap-desktop-30) { --col-gap: 3rem; gap: var(--col-gap); } .gap-lg-20 { gap: 2rem; } :where(.gap-lg-25) { gap: 2.5rem; } .block-lg { display: block; } .flex-lg-1 { flex: 1; } .grid-lg { display: grid; } .hidden-lg { display: none; } .absolute-lg { position: absolute; } .relative-lg { position: relative; } .max-w-custom { max-width: var(--max-width); } } @media (min-width: 1025px) { .static-1025 { position: static; } .sticky-1025 { position: sticky; } .inline-flex-1025 { display: inline-flex; } .inline-block-1025 { display: inline-block; } .hidden-1025 { display: none; } .absolute-1025 { position: absolute; } .relative-1025 { position: relative; } .border-bottom-1025-0 { border-bottom: 0; } .min-h-1025-50 { min-height: 50px; } .min-h-1025-unset { min-height: unset; } .z-1025-16 { z-index: 16; } .pt-1025-35 { padding-top: 3.5rem; } .p-1025-40 { padding: 4rem; } .p-1025-50 { padding: 5rem; } .pb-1025-0 { padding-bottom: 0; } .py-1025-5 { padding-top: 5px; padding-bottom: 5px; } .py-1025-15 { padding-top: 15.5px; padding-bottom: 15.5px; } .px-1025-0 { padding-left: 0; padding-right: 0; box-shadow: none; background-color: transparent !important ; } .px-1025-25 { padding-left: 2.5rem; padding-right: 2.5rem; } .py-1025-40 { padding-top: 4rem; padding-bottom: 4rem; } .mt-1025-0 { margin-top: 0; } .mt-1025-60 { margin-top: clamp(4rem, 4.5vw, 6rem); } .my-1025-0 { margin-top: 0; margin-bottom: 0; } .mb-1025-0 { margin-bottom: 0; } .mb-1025-25 { margin-bottom: 2.5rem; } .flex-1025 { display: flex; } .flex-1025-row { flex-direction: row; } .flex-1025-row-reverse { flex-direction: row-reverse; } .flex-1025-nowrap { flex-wrap: nowrap; } .justify-between-1025 { justify-content: space-between; } .invisible-1025 { opacity: 0; visibility: hidden; } .pointer-none-1025 { pointer-events: none; } .visible-1025 { opacity: 1; visibility: visible; } .block-1025 { display: block; } .text-left-1025, .text-1025-start { text-align: start; } .top-1025-15 { top: 1.5rem; } .right-1025-15 { right: 1.5rem; } .left-1025-15 { left: 1.5rem; } .bottom-1025-15 { bottom: 1.5rem; } .bottom-1025-auto { bottom: auto; } .w-1025-45 { width: 4.5rem; } .h-1025-45 { height: 4.5rem; } .w-1025-auto { width: auto; } .h-1025-auto { height: auto; } .col-1025-w-custom { flex: 0 0 auto; width: var(--col-width, 50%); } .col-1025-remaining { flex: 0 0 calc(100% - var(--col-width) - var(--col-gap-desktop, var(--col-gap))); width: calc( 100% - var(--col-width) - var(--col-gap-desktop, var(--col-gap)) ); } .border-1025 { border: 1px solid var(--color-border); } .border-1025-0 { border: 0; } .border-1025-bottom-0 { border-bottom: 0; } .border-top-1025 { border-top: 1px solid var(--color-border); } } @media (min-width: 1200px) { .static-xl { position: static; } .relative-xl { position: relative; } .static-xl-impo { position: static !important; } .block-xl { display: block; } .grid-xl { display: grid; } .flex-xl { display: flex; } .flex-xl-nowrap { flex-wrap: nowrap; } .text-xl-start { text-align: start; } .gap-xl-25 { gap: 2.5rem; } .gap-xl-30 { gap: 3rem; } .gap-xl-50 { gap: clamp(1.5rem, 2vw, 5rem); } .gap-xl-60 { gap: 6rem; } .transform-xl-none { transform: none !important; } .px-xl-0 { padding-left: 0; padding-right: 0; } .pe-xl-25 { padding-inline-end: 2.5rem; } .justify-between-xl { justify-content: space-between; } } @media screen and (max-width: 1199.98px) { .shopify-section:not(.contact-us, .not-hide-br) br { display: none; } } .bg-transparent { background: transparent !important; } .bls__drawer { --transition-type: transform; } .bls__drawer.left { transform: translateX(100%); width: 100%; max-width: var(--drawer-width, 48rem); } .bls__drawer.right { transform: translateX(-100%); width: 100%; max-width: var(--drawer-width, 48rem); } @media (min-width: 768px) { .bls__drawer.top { transform: translateY(-100%); } } :root { --swiper-navigation-color: var(--color-dark); --swiper-navigation-size: 16px; --swiper-pagination-bullet-width: 2.5rem; --swiper-pagination-bullet-height: 2.5rem; --swiper-pagination-bullet-inactive-opacity: 1; --swiper-pagination-color: transparent; --swiper-pagination-bullet-inactive-color: transparent; --swiper-pagination-bullet-horizontal-gap: 0; } @media screen and (max-width: 767.98px) { .free-scroll { margin-left: calc(-1 * var(--bs-gutter-x, 1.5rem)); margin-right: calc(-1 * var(--bs-gutter-x, 1.5rem)); } .free-scroll [data-free-scroll] { padding-left: var(--bs-gutter-x); padding-right: var(--bs-gutter-x); --col: var(--col-number); } [data-free-scroll] .swiper-wrapper::-webkit-scrollbar, .grid_scroll::-webkit-scrollbar { display: none; -ms-overflow-style: none; scrollbar-width: none; } :is(.grid_scroll, .swiper.grid_scroll) { grid-template-columns: repeat( var(--repeat, auto-fit), minmax(calc(100% / var(--col-number)), 1fr) ); grid-auto-flow: column; grid-auto-columns: minmax(calc(100% / var(--col-number)), 1fr); gap: var(--col-gap); overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; display: grid; margin-left: calc(-1 * var(--bs-gutter-x)); margin-right: calc(-1 * var(--bs-gutter-x)); padding-left: var(--bs-gutter-x); padding-right: var(--bs-gutter-x); } :is( .grid_scroll .col-w-custom:not(.product-item__inner), [data-free-scroll="true"].flex-cols > *, [data-free-scroll].flex-col-custom > * ) { width: 100%; padding-inline: 0; } [data-free-scroll="true"].flex-cols.flex-column:not(.swiper-initialized) { flex-direction: row; } [data-free-scroll] .swiper-pagination { margin-top: 1.5rem; } [data-enable="true"].swiper.grid-cols { grid-template-columns: repeat( var(--repeat, var(--col)), calc((100% - var(--gap, 0px) * calc(var(--col) - 1)) / var(--col)) ); } [data-enable="true"].swiper.flex-column:not(.swiper-initialized) { flex-direction: row; } :root { --swiper-pagination-bullet-width: 1.5rem; --swiper-pagination-bullet-height: 1.5rem; --swiper-pagination-bullet-horizontal-gap: -17px; } .swiper-pagination-bullet { padding: 2.4rem; } body .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, body .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: -1.7rem; } .swiper-pagination-bullet:before { display: none; } .row-gap-mb-0 { row-gap: 0; } } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { --swiper-pagination-color: var(--color-heading); } .swiper:not([class*="initialized"]) .swiper-wrapper { --gap: var(--col-gap); overflow: hidden; gap: var(--gap, 1.5rem); } .swiper:not([class*="initialized"])[data-mobile="1.5"] .swiper-wrapper { overflow: unset; } :is(.swiper-button-next, .swiper-button-prev).swiper-arrow:before, :is(.swiper-button-next, .swiper-button-prev).swiper-arrow:after { display: none; } .swiper:not([class*="initialized"]) .swiper-wrapper .swiper-slide { flex: 0 0 auto; } .swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar-fill { border-radius: 1rem; overflow: hidden; } .swiper:not([class*="initialized"])[data-mobile="6"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 5)) / 6); } .swiper:not([class*="initialized"])[data-mobile="5"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 4)) / 5); } .swiper:not([class*="initialized"])[data-mobile="4"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 3)) / 4); } .swiper:not([class*="initialized"])[data-mobile="3"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 2)) / 3); } .swiper:not([class*="initialized"])[data-mobile="2"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 1)) / 2); } .swiper:not([class*="initialized"])[data-mobile="1.5"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 1)) / 1.5); } .swiper:not([class*="initialized"])[data-mobile="1"] .swiper-slide { width: 100%; } @media (min-width: 768px) { .swiper:not([class*="initialized"])[data-tablet="6"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 5)) / 6); } .swiper:not([class*="initialized"])[data-tablet="5"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 4)) / 5); } .swiper:not([class*="initialized"])[data-tablet="4"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 3)) / 4); } .swiper:not([class*="initialized"])[data-tablet="3"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 2)) / 3); } .swiper:not([class*="initialized"])[data-tablet="2"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 1)) / 2); } .swiper:not([class*="initialized"])[data-tablet="1"] .swiper-slide { width: 100%; } .swiper:not([class*="initialized"]) .swiper-wrapper { --gap: var(--col-gap-desktop); } } @media (min-width: 1025px) { .swiper:not([class*="initialized"])[data-desktop="8"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 7)) / 8); } .swiper:not([class*="initialized"])[data-desktop="7"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 6)) / 7); } .swiper:not([class*="initialized"])[data-desktop="6"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 5)) / 6); } .swiper:not([class*="initialized"])[data-desktop="5"] .swiper-slide { width: calc(100% / 5); } .swiper:not([class*="initialized"])[data-desktop="4"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 3)) / 4); } .swiper:not([class*="initialized"])[data-desktop="3"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 2)) / 3); } .swiper:not([class*="initialized"])[data-desktop="2"] .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 1)) / 2); } .swiper:not([class*="initialized"])[data-desktop="1"] .swiper-slide { width: 100%; } } :is(.swiper-button-next, .swiper-button-prev).swiper-arrow { width: var(--swiper-width, clamp(3.5rem, 5vw, 5rem)); height: var(--swiper-width, clamp(3.5rem, 5vw, 5rem)); margin-top: 0; transform: translateY(-50%); top: var(--arrows-offset-top, 50%); display: flex; align-items: center; justify-content: center; } :is(.swiper-button-next, .swiper-button-prev).swiper-arrow svg { width: var(--swiper-size, 10px); height: var(--swiper-size, 10px); } @media (min-width: 768px) { :where(.swiper-actions:not(.show-arrow) .swiper-arrow), :is(.swiper-actions:not(.show-arrow) .swiper-arrow.swiper-button-disabled) { opacity: 0; visibility: hidden; } .swiper:hover .swiper-actions:not(.show-arrow) :is(.swiper-button-next, .swiper-button-prev) { opacity: 1; visibility: visible; --swiper-navigation-sides-offset: 20px; } .swiper:hover :is(.swiper-actions:not(.show-arrow) .swiper-arrow.swiper-button-disabled) { opacity: 0.75; visibility: visible; } :where(.swiper-arrow:hover) { background-color: var(--color-dark); color: var(--color-white); } } @media screen and (max-width: 767.98px) { .swiper-actions.original-style { margin-bottom: 0; } .swiper-actions:not(.show-on-mobile) { display: none; } .w-1024-full { width: 100%; } .thumbnail_left[data-thumb-slides-per-view="4"] .thumbnail-slide .swiper-slide { width: calc((100% - (var(--gap, 3rem) * 3)) / 4); } } body .swiper-pagination-lock, body .swiper-pagination:not( .swiper-pagination-bullets, .swiper-pagination-custom ) { display: none; } body .swiper-pagination { position: var(--swiper-pagination-position, relative); margin-top: var(--swiper-pagination-mt, 3rem); } .swiper-pagination-bullet { position: relative; } .swiper-pagination-bullet:after, .swiper-pagination-bullet::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; transition: var(--transition); } .swiper-pagination-bullet:after { display: inline-block; width: var(--tns-nav-width, 5px); height: var(--tns-nav-width, 5px); background-color: var(--color-dark); opacity: 0.4; margin: auto; } .swiper-pagination-bullet:before { border: 1px solid var(--tns-nav-border, var(--color-dark)); opacity: 0; transform: scale(0.3); } .swiper-pagination-bullet-active::after, .swiper-pagination-bullet-active:before { opacity: 1; transform: scale(1); } @media only screen and (min-width: 1025px) { .swiper.reveal_on_scroll { overflow: visible; } .product_with-banner .swiper.reveal_on_scroll { overflow: hidden; } } :is(.swiper-button-next, .swiper-button-prev).swiper-button-lock { display: none; } .overlay-bg:after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color: #000; opacity: var(--overlay-opacity, 30%); pointer-events: none; } .rounded-style.overlay-bg:after { border-radius: var(--rounded-radius, 0); } .topbar .text-slide .swiper-wrapper { min-height: 2rem; align-items: center; } /* Header */ :is(#topbar, announcement-bar) { font-weight: var(--countdown-text-weight, 400); } :is(#topbar, announcement-bar) .swiper-arrow:not(:hover) { color: rgba(var(--color-text-rgb), 0.5); } :is(#topbar, announcement-bar) a { text-decoration: none; } .logo-position { grid-template-areas: "menu logo icon"; } .logo-position:not(.show-search-form) { grid-template-columns: 1fr auto 1fr; } .logo-position.no__action-left { grid-template-areas: "logo icon"; grid-template-columns: auto 1fr; } .header__logo { grid-area: logo; min-width: 5rem; } .header__menu { grid-area: menu; } .header__action { --col-gap: 20px; grid-area: icon; } .header-color, .header-color > a:not(:hover), header-inner .button-localization { color: var(--color-heading); } @media screen and (min-width: 1025px) { .logo-left { grid-template-areas: "logo menu icon"; } .header__action { --col-gap: 25px; } } .h-count { width: var(--notification-bubble-width, 1.9rem); height: var(--notification-bubble-height, 1.9rem); position: absolute; top: var(--notification-bubble-top, -6px); font-size: 9px !important; color: var(--notification-bubble-text-color, #fff); /* Text color */ left: 1.3rem; background-color: var(--notification-bubble-bg, #000); /* Use the custom color */ } .header__minicart .h-count { left: 1rem; } .menu_label { font-size: 9px !important; padding: 3px 5px 2px 5px; right: -18px; padding-top: 2.3px !important; padding-bottom: 1.6px !important; top: 0; background-color: var(--menu-label-bg); color: var(--menu-label-color); min-width: 3rem; } .menu_label.hot { --menu-label-bg: var(--hot-bg-cl); --menu-label-color: var(--hot-cl); } .menu_label.new { --menu-label-bg: var(--new-bg-cl); --menu-label-color: var(--new-cl); } .menu_label.sale { --menu-label-bg: var(--sale-bg-cl); --menu-label-color: var(--sale-cl); } .menu_label:after { border: 4px solid transparent; content: ""; height: 0; position: absolute; width: 0; top: 100%; left: 30%; transform: translateX(-50%); -webkit-transform: translateX(-50%); transform-origin: 0; border-top-color: var(--menu-label-bg); } @media (min-width: 1025px) { header .disclosure__button { padding-block: 15px; } } /* Search */ .predictive-search--header:not(.results) .search-list-item { display: none; } .predictive-search--header .search-list-item.search-suggest, .predictive-search--header.results .search-list-item:not(.flex) { display: block; } .predictive-search--header.results .search-list-item.flex { display: flex; } .predictive-search--header.results .search-list-item { margin-top: 0; } .cart-recommend .bls-add-cart-list { position: relative; /* Enable pseudo-element positioning */ border: 0; /* No border */ color: var(--cart-recommend-button-text-color) !important; /* Dynamic text color */ background-color: transparent !important; /* Transparent background */ left: -35px !important; /* Keep current position */ width: auto; /* Adapt width to content */ display: inline-flex; /* Flex container for centering */ align-items: center; /* Vertically center text */ justify-content: center; /* Horizontally center text */ text-align: center; /* Center text inside */ cursor: pointer; /* Pointer cursor for buttons */ transition: all 0.3s ease; /* Smooth transition for hover effects */ font-size: var(--cart-recommend-button-font-size) !important; /* Dynamic font size */ font-weight: 600; /* Medium weight for better readability */ padding: 1px 8px; /* Consistent padding */ overflow: hidden; /* Ensure underline stays inside the button */ } .cart-recommend .bls-add-cart-list::before { content: ''; /* Empty content for the underline */ position: absolute; bottom: 0; /* Position at the bottom of the button */ left: 0px; /* Start underline from the left */ background-color: var(--add-to-cart-underline-color, #007BFF); /* Dynamic underline color */ width: 0; /* Initially no width */ height: var(--add-to-cart-underline-thickness, 0px); /* Use the slider value or fallback to 2px */ transition: width 0.4s ease-in-out; /* Smooth sliding effect */ } .cart-recommend .bls-add-cart-list:hover { background-color: transparent !important; /* Transparent on hover */ border: 0; /* No border */ left: -35px !important; /* Keep current position */ color: var(--cart-recommend-button-hover-text-color) !important; /* Dynamic hover text color */ padding: 1px 8px; /* Ensure consistent padding */ } .free-shipping-message span.price { font-weight: bold; color: var(--free-shipping-price-color, #000) !important; /* Fallback to #000 */ } .cart-recommend .bls-add-cart-list:hover::before { width: 100%; /* Expand underline to full width on hover */ } /* Mobile-Specific Adjustments */ @media screen and (max-width: 767px) { .cart-recommend .bls-add-cart-list { margin-left: 10px !important; /* Reduce the left position for mobile */ font-size: 14px; /* Slightly smaller text on mobile */ padding: 4px 14px; /* Adjust padding for smaller screens */ } .header-account-container .header__icon-account { border-radius: 50%; display: none !important; background-color: #f9f9f9; transition: background-color 0.3s ease, transform 0.3s ease; } .cart-recommend .bls-add-cart-list::before { height: 0px; /* Thinner underline on mobile */ } .cart-recommend .bls-add-cart-list:hover { margin-left: 10px !important; /* Maintain adjusted left position on hover */ padding: 4px 14px; /* Maintain consistent padding on hover */ } } .footer:not(.remove_spacing-on-home) { margin-top: calc(var(--section-spacing) - 1.8rem); } .footer.border-top:not(.remove_spacing-on-home) { margin-top: var(--section-spacing); } :is(.footer__block-info, .newsletter-note) a { text-decoration: none; } @media (min-width: 1025px) { .footer__block-heading { pointer-events: none; } .cart-recommend.beside .bls-add-cart-list { margin-inline: auto; } } @media screen and (max-width: 767.98px) { .mobi-navigation-bar { padding-bottom: 6.5rem; } .footer back-to-top { bottom: 8rem; margin-right: -5px !important; } .footer__blocks { --bs-gutter-x: 0; } .footer__blocks .footer-block:last-child { border-bottom: 0; } } mobile-navigation-bar { transform: translateY(100%); } mobile-navigation-bar.show { transform: translateY(0); opacity: 1; visibility: visible; } mobile-navigation-bar > a { flex: 0 0 auto; width: calc(100% / var(--number, 5)); gap: 4px; } .dot-between:not(:last-child):after { content: "ยป" !important; /* Unicode right arrow */ display: flex; /* Flexbox to center the arrow */ align-items: center; /* Center vertically */ justify-content: center; /* Center horizontally */ filter: contrast(0.67) !important; font-size: 24px !important; /* Adjust size if needed */ margin: var(--arrow-space, 0 8px); margin-bottom: 4px !important; color: var(--color-heading) !important; font-weight: light; background: transparent !important; /* Black background with transparency */ width: 20px !important; height: 28px !important; border-radius: 50% !important; text-shadow: 0.5px 0.5px 1px rgba(0, 0, 0, 0.1); /* Lighter and softer shadow */ line-height: 20px !important; /* Ensure vertical centering */ text-align: center; } /* Mobile-specific adjustments */ @media (max-width: 480px) { .dot-between:not(:last-child):after { font-size: 18px !important; /* Smaller size for mobile */ width: 14px !important; height: 6px !important; font-weight: light; margin-bottom: 1px !important; content: "ยป" !important; /* Unicode right arrow */ margin: 0 4px; /* Reduce spacing */ opacity: 0.9 !important; /* Slightly higher opacity */ } } .breadcrumb-item a { text-decoration: none; } .page-title-breadcrumb a:last-child { filter: brightness(0.85) !important; /* Adjust the brightness (lower value makes it darker) */ opacity: 0.9; /* Slightly reduce opacity for a more subtle effect */ } .page-title-breadcrumb a:last-child:hover { filter: brightness(1) !important; /* Lightens when hovered */ opacity: 1; /* Full opacity on hover */ } .sec__rich-text-inner { max-height: var(--max-height); } .gradient-effect:not(.hide-less):after { content: ""; position: absolute; left: 0; right: 0; top: 0; transform: translateY(-100%); transform-origin: center; height: 61px; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%); } .rich-text-expand-content { transition: max-height 0.3s ease-out; } /* Loading effect */ .product__color-swatch:not([style*="background"]), .skeleton .thumbnail-slide [class*="media-gallery__"], .skeleton :is( .skeleton-loading, .product__badges-inner, .shopify-payment-button, ):after, review-product.inline-loading:after { background-color: var(--grey-color); background-image: linear-gradient(90deg, #16182300 0, #1618230a, #16182300); -webkit-background-size: 200% 100%; background-size: 200% 100%; background-repeat: no-repeat; -webkit-animation: 1.5s cubic-bezier(0, 0, 1, 1) infinite animation-loading-images; animation: 1.5s cubic-bezier(0, 0, 1, 1) infinite animation-loading-images; } @keyframes animation-loading-images { 0% { background-position-x: 200%; } 100% { background-position-x: -150%; } } .terms-conditions label a { color: var(--color-heading); font-weight: 500; text-decoration: none; } cookie-bar { max-width: 43rem; width: 80%; } /* === RS premium tokens (2026-08 redesign) === */ :root { --rs-bone: #F5F0E8; --rs-cream: #E8DDC9; --rs-espresso: #181614; --rs-anthracite: #2C2825; --rs-bone-text: #EFE8DC; } body { background-color: var(--rs-bone); } /* slow zoom for hero/editorial images */ @keyframes rs-zoom { from { transform: scale(1); } to { transform: scale(1.045); } } .rs-zoom img { animation: rs-zoom 9s ease-in-out infinite alternate; } /* product card hover */ .product-item { transition: transform .35s ease; } .product-item:hover { transform: translateY(-4px); } .product-item .product__media img { transition: transform .6s ease; } .product-item:hover .product__media img { transform: scale(1.06); } /* growing underline for text links in new sections */ .rs-link { position: relative; text-decoration: none; } .rs-link::after { content:''; position:absolute; left:0; bottom:-3px; height:1px; width:100%; background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .4s ease; } .rs-link:hover::after { transform:scaleX(1); } @media (prefers-reduced-motion: reduce) { .rs-zoom img, .product-item, .product-item .product__media img { animation: none !important; transition: none !important; } motion-element, .opacity-0 { opacity: 1 !important; transform: none !important; } .slideshow .swiper-slide-active .effect_fadein > *, .slideshow .swiper-slide-active .effect_fadeinup > *, .slideshow .swiper-slide-active .effect_fadeinleft > *, .slideshow .swiper-slide-active .effect_fadeinright > *, .slideshow .sec__content-inner > * { animation: none !important; -webkit-animation: none !important; opacity: 1 !important; transform: none !important; } } /* RS: single-price policy โ€” hide all compare-at prices */ s.compare-price, s.minicart__item-original-price, .pa__compare, .loudzProductsGridProdCardInitialPrice, .price del, .price s, .compare-price, [class*="compare_price"], [class*="compare-price"] { display: none !important; } /* RS: center the top-bar message precisely (social icons stay left) */ @media (min-width: 768px) { .section-top-bar .topbar__section-inner { position: relative; } .section-top-bar .topbar-message.desktop-only { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap; } } @media (max-width: 767px) { .section-top-bar .topbar__section-inner { justify-content: center !important; } } /* RS: light header โ€” force the white logo image dark (anthracite) */ .section-header .header__logo img { filter: brightness(0) opacity(.82); } /* RS: blackletter font for the categories title */ @font-face { font-family: 'RS Gotisch'; src: url('rs-grenze-gotisch.ttf') format('truetype'); font-weight: 100 900; font-display: swap; } /* RS: categories title โ€” espresso band below hero, title straddles band edge 50/50. mix-blend-mode: difference inverts the bone text on each half (light on espresso, dark on bone). */ [id$="__text_heading_adkbMJ"] { margin-top: 0; } [id$="__text_heading_adkbMJ"] .rt-elements-pro-1-wrapper, [id$="__text_heading_adkbMJ"] .rt-elements-pro-1-content-container { overflow: visible !important; } [id$="__text_heading_adkbMJ"] .rt-elements-pro-1-title { font-family: var(--font-heading-family, Georgia, serif) !important; font-weight: 400 !important; transform: translateY(2px) !important; color: #F5F0E8 !important; mix-blend-mode: difference; position: relative; } /* RS: Bestseller heading โ€” subtext on its own line, kill vertical offset */ [id$="__rs_heading_best"] .rt-elements-pro-1-title { transform: none !important; flex-wrap: wrap !important; justify-content: center !important; } [id$="__rs_heading_best"] .rt-elements-pro-1-title-second { display: block; flex-basis: 100% !important; width: 100%; font-size: 15px !important; letter-spacing: .08em; opacity: .7; margin-top: 8px; font-family: var(--font-body-family, sans-serif); }