/** Shopify CDN: Minification failed

Line 217:0 "@charset" must be the first rule in the file
Line 225:0 Unexpected "$"
Line 225:20 Unexpected "{"
Line 225:29 Expected ":"
Line 225:42 Unexpected ";"
Line 226:20 Unexpected "{"
Line 226:29 Expected ":"
Line 226:48 Unexpected ";"
Line 227:20 Unexpected "{"
Line 227:29 Expected ":"
... and 180 more hidden warnings

**/
@media screen and (max-width: 749px) {
  product-sticky-bar.product-sticky-bar {
    width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
  }

  product-sticky-bar.product-sticky-bar .buy-buttons {
    width: 50% !important;
    max-width: 50% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: flex !important;
    justify-content: center !important;
  }

  product-sticky-bar.product-sticky-bar .buy-buttons .button {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}
product-sticky-bar.product-sticky-bar .buy-buttons {
    width: 100% ;
    max-width: 100% ;
   
  }
  product-sticky-bar.product-sticky-bar .buy-buttons .button {
    width: 100% ;
    min-width: 0 ;
    max-width: 100%;
  }

p.line-item-property__field {
    padding-top: 10px;
}
@media screen and (max-width: 749px) {
  .jdgm-widget.jdgm-preview-badge,
  .jdgm-preview-badge {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }

  .jdgm-preview-badge .jdgm-prev-badge {
   
  }

  .jdgm-preview-badge .jdgm-prev-badge__stars {

    gap: 2px !important;
  }

  .jdgm-preview-badge .jdgm-star {
    font-size: 18px !important;
    line-height: 1 !important;
  }

  .jdgm-preview-badge .jdgm-prev-badge__text {
    font-size: 15px !important;
    line-height: 1.3 !important;
  }
}

textarea#order-note {
    height: 73px !important;
    min-height: 73px !important;
}

a.tooltip{
      position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}
sale-price.h4.text-on-sale {
  
     color: #FF5C5C !important;         /* Swaps the harsh red for a highly legible, vibrant light red */
    font-size: 18px !important;         /* Restores proper size so it stands out next to the original price */
    font-weight: 700 !important;        /* Makes the price bold so it is easily scannable */
    letter-spacing: 0.05em !important;  /* Adds tiny breathing room between numbers on dark backgrounds */

}

sale-price.h6.text-on-sale {
  
     color: #FF5C5C !important;         /* Swaps the harsh red for a highly legible, vibrant light red */
    font-size: 18px !important;         /* Restores proper size so it stands out next to the original price */
    font-weight: 700 !important;        /* Makes the price bold so it is easily scannable */
    letter-spacing: 0.05em !important;  /* Adds tiny breathing room between numbers on dark backgrounds */

}




.text-on-sale, compare-at-price.h6.text-subdued.line-through {
    letter-spacing: 0.2em;
    font-size: 15px !important;

    color: #BDBDBD;
}
 .text-on-sale {
  
           /* Restores proper size so it stands out next to the original price */
    font-weight: 700 !important;        /* Makes the price bold so it is easily scannable */

}

@media screen and (max-width: 749px) {
  sale-price.h6.text-on-sale {
  
     color: #FF5C5C !important;         /* Swaps the harsh red for a highly legible, vibrant light red */
    font-size: 18px !important;         /* Restores proper size so it stands out next to the original price */
    font-weight: 700 !important;        /* Makes the price bold so it is easily scannable */
    letter-spacing: 0.05em !important;  /* Adds tiny breathing room between numbers on dark backgrounds */

}




.text-on-sale, compare-at-price.h6.text-subdued.line-through {
    letter-spacing: 0.2em;
    font-size: 15px !important;

    color: #BDBDBD;
}

  .product-info__block-item[data-block-type="quantity-selector"] {
    display: inline-block !important;
    width: 45% !important;
    vertical-align: top !important;
    margin-right: 10px !important;
  }

  .product-info__block-item[data-block-type="buy-buttons"] {
    display: inline-block !important;
    width: 50% !important;
    vertical-align: top !important;
    margin-top:-20px;
  }

  .product-info__block-item[data-block-type="quantity-selector"] .quantity-selector,
  .product-info__block-item[data-block-type="buy-buttons"] .button {
    width: 100% !important;
   
  }
.price-list {
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: .5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

h1.product-title.h3 {
    letter-spacing: 0px;
    margin-bottom: 0;
    text-transform: capitalize;
    font-size: 20px;
    margin-bottom: 9px;
    text-align:center !important;
}
div#shopify-block-AYkpuZU1JQzFXNDQ4Y__judge_me_reviews_preview_badge_BGRV8a{text-align:center;}
        .product-info__block-item iframe {
        max-width: 100%;
        width: 85%;
        height: 330px;
        margin-top: 20px;
        margin-bottom: 20px;
    }
.product-info__block-item[data-block-type="buy-buttons"] .button {
margin-top: -20px;
        padding: 15px; }

}
  

.product-info__block-item:is([data-block-type="variant-picker"], [data-block-type="product-variations"], [data-block-type="separator"], [data-block-type="description"], [data-block-type="text"], [data-block-type="liquid"], [data-block-type="share-buttons"]) {
    --product-info-gap: 0.5rem !important;
}
@media screen and (min-width: 749px) {



buy-buttons.buy-buttons {
    width: 30%;
}
}
h1.product-title.h3 {
    letter-spacing: 0px;
    margin-bottom: 0;
    text-transform: capitalize;
    font-size: 20px;
    margin-bottom: 9px;
}

a.product-title.h6 {
    font-size: 16px;
}

@charset "utf-8";

/**
 * All the variables that can be used to extract Shopify global settings
 */

/* Colors */

$background      : {{settings.background}};
$light-background: {{settings.light_background}};
$heading-color   : {{settings.heading_color}};
$text-color      : {{settings.text_color}};
$text-color-light: {{settings.text_light_color}};
$link-color      : {{settings.link_color}};
$border-color    : {{settings.background | color_mix: settings.text_color, 85}};

$button-background: {{settings.button_background}};
$button-text-color: {{settings.button_text_color}};

$header-background       : {{settings.header_background}};
$header-heading-color    : {{settings.header_heading_color}};
$header-light-text-color : {{settings.header_light_color}};
$header-border-color     : {{settings.header_background | color_mix: settings.header_heading_color, 85}};

$footer-background    : {{settings.footer_background}};
$footer-text-color    : {{settings.footer_text_color}};
$footer-heading-color : {{settings.footer_heading_color}};
$footer-border-color  : {{settings.footer_background | color_mix: settings.footer_text_color, 85}};

$navigation-background      : {{settings.navigation_background}};
$navigation-text-color      : {{settings.navigation_text_color}};
$navigation-text-color-light: rgba($navigation-text-color, 0.5);
$navigation-border-color    : rgba($navigation-text-color, 0.25);

$newsletter-popup-background : {{settings.newsletter_popup_background}};
$newsletter-popup-text-color : {{settings.newsletter_popup_text_color}};

$secondary-elements-background       : {{settings.secondary_elements_background}};
$secondary-elements-text-color       : {{settings.secondary_elements_text_color}};
$secondary-elements-text-color-light : rgba($secondary-elements-text-color, 0.5);
$secondary-elements-border-color     : rgba($secondary-elements-text-color, 0.25);

$product-sale-price-color: {{settings.product_on_sale_color}};

/* Typography */

{{ settings.heading_font | font_face: font_display: 'fallback' }}
{{ settings.text_font | font_face: font_display: 'fallback' }}

{%- assign text_font_bold = settings.text_font | font_modify: 'weight', 'bolder' -%}
{%- assign text_font_italic = settings.text_font | font_modify: 'style', 'italic' -%}
{%- assign text_font_bold_italic = text_font_bold | font_modify: 'style', 'italic' -%}

{{ text_font_bold | font_face: font_display: 'fallback' }}
{{ text_font_italic | font_face: font_display: 'fallback' }}
{{ text_font_bold_italic | font_face: font_display: 'fallback' }}

$heading-font-family : {{settings.heading_font.family}}, {{ settings.heading_font.fallback_families }};
$heading-font-weight : {{settings.heading_font.weight}};
$heading-font-style  : {{settings.heading_font.style}};
$heading-font-size   : {{settings.heading_size}};

$text-font-family : {{settings.text_font.family}}, {{ settings.text_font.fallback_families }};
$text-font-weight : {{settings.text_font.weight}};
$text-font-style  : {{settings.text_font.style}};

$uppercase-heading: {% if settings.uppercase_heading %}true{% else %}false{% endif %};

$base-text-font-size   : {{settings.base_text_font_size}}px;
$default-text-font-size: 14px;

/* Products */

$product-info-alignment         : {{settings.product_info_alignment}};
$product-show-price-on-hover    : {{settings.product_show_price_on_hover}};
$product-list-horizontal-spacing: {{settings.product_list_horizontal_spacing}};
$product-list-vertical-spacing  : {{settings.product_list_vertical_spacing}};

$cursor-zoom-in-svg    : "{{ 'cursor-zoom-in.svg' | asset_url }}";
$cursor-zoom-in-2x-svg : "{{ 'cursor-zoom-in-2x.svg' | asset_url }}";

/* Animation */

$drawer-transition-timing: cubic-bezier(0.645, 0.045, 0.355, 1);
$show-page-transition: {% if settings.show_page_transition %}true{% else %}false{% endif %};
$show-button-transition: {% if settings.show_button_transition %}true{% else %}false{% endif %};
$show-image-zooming: {% if settings.show_image_zooming %}true{% else %}false{% endif %};
$show-element-staggering: {% if settings.show_element_staggering %}true{% else %}false{% endif %};

/* Other */

$header-base-height: 80px; /* We use this value for browsers that do not support CSS variables */
$color-swatch-circle: false;

/**
 * ----------------------------------------------------------------------------------------------
 * This is a variation of Normalize.css (http://necolas.github.io/normalize.css/)
 * ----------------------------------------------------------------------------------------------
 */

/**
 * Base
 */



@media only screen and (min-width: 600px) {
  .spr-summary-actions {
    float:right;
  }
  
  .spr-review-content-body{
    margin-top: -5px !important;
  
  }
  .spr-review-header-title{
  margin-top: 2px !important;
  
  }
  .spr-review-header {
  margin-top: -8px !important;
  }
  
  
  
  
  .spr-summary-actions-togglereviews {
  
  top: 10px;
position: relative;
    
  }
  .spr-summary-starrating .spr-icon-star {
    position: relative;
    top: 10px;
}
  .zdzreviews {
  margin-bottom: 0 !important;
    margin-top: 0 !important;
padding-bottom: 0 !important;
  }
  
 
  
}

@media only screen and (max-width: 600px) {
  #shopify-product-reviews .spr-summary-actions-newreview, #shopify-product-reviews .spr-button-primary:not(input) {
    width: auto !important;

}
  
  
  .spr-review-content-body{
    margin-top: -5px !important;
  
  }
  .spr-review-header-title{
  margin-top: 2px !important;
  
  }
  .spr-review-header {
  margin-top: -8px !important;
  }
  
  
  
  
  
  .spr-summary-starrating {
    position: relative;
top: -9px;
  
  }
  
  .ProductForm {
  
    margin: 0 auto;
padding: 0 24px;
  
  }
  .amazon-bullet {
   margin: 0 auto !important;
padding: 0 24px !important;
  }
  .zdzreviews .ProductMeta__Title {
    text-align: center;
    margin-top: 70px !important;
}
  
  
  .ProductMeta__PriceList {
  text-align:center !important;
  
  }
  .ProductForm__QuantitySelector {
    text-align:center !important;
  
 }
  
  .zdzreviews {
  
padding-bottom: 0 !important;
    padding-top: 0 !important;
  }
  .spr-summary-caption {
  bottom: 10px;
position: relative;
  }
  .spr-summary .spr-starrating {
  bottom: 10px;
position: relative;
  }
}



.spr-summary {
border-bottom: 1px solid gray;
padding-bottom: 20px;

}




*,
*:before,
*:after {
  box-sizing: border-box !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

body {
  margin: 0;
}

[hidden] {
  display: none;
}

/**
 * HTML5 display definitions
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Text-level semantic
 */

:active {
  outline: none;
}

a {
  color: inherit;
  background-color: transparent;
  text-decoration: none;

  &:active,
  &:hover {
    outline: 0;
  }
}

b,
strong {
  font-weight: bold;
}

small {
  font-size: 80%;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  font-size: inherit;
  font-weight: inherit;
}
@media (max-width:550px){
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  font-size: 13px;
  font-weight: inherit;
}

}

p:last-child,
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child {
  margin-bottom: 0;
}

/**
 * Embedded content
 */

img {
  max-width: 100%;
  height: auto;
  border-style: none;
  vertical-align: top;
}

svg:not(:root) {
  overflow: hidden;
}

/**
 * Grouping content
 */

ul,
ol {
  margin: 0;
  padding: 0;
  list-style-position: inside;
}

pre {
  overflow: auto;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 16px;
}

/**
 * Forms
 */

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button,
input[type="submit"] {
  padding: 0;
  overflow: visible;
  background: none;
  border: none;
  border-radius: 0;
  -webkit-appearance: none;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
  border-radius: 0;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"] {
  -webkit-appearance: none;
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: inherit;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: inherit;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: inherit;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: inherit;
}

input::placeholder,
textarea::placeholder {
  color: inherit;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 6px 10px 12px;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

/**
 * Tables
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}
/*! Avalanche | MIT License | @colourgarden */

$phone:            "screen and (max-width: 640px)";
$tablet:           "screen and (min-width: 641px) and (max-width: 1007px)";
$tablet-and-up:    "screen and (min-width: 641px)";
$pocket:           "screen and (max-width: 1007px)";
$lap:              "screen and (min-width: 1008px) and (max-width: 1239px)";
$lap-and-up:       "screen and (min-width: 1008px)";
$desk:             "screen and (min-width: 1240px)";
$widescreen:       "screen and (min-width: 1500px)";

@mixin av-mq($alias) {
  @if $alias == "phone" {
    @media #{$phone} {
      @content;
    }
  } @else if $alias == "tablet" {
    @media #{$tablet} {
      @content;
    }
  } @else if $alias == "tablet-and-up" {
    @media #{$tablet-and-up} {
      @content;
    }
  } @else if $alias == "pocket" {
    @media #{$pocket} {
      @content;
    }
  } @else if $alias == "lap" {
    @media #{$lap} {
      @content;
    }
  } @else if $alias == "lap-and-up" {
    @media #{$lap-and-up} {
      @content;
    }
  } @else if $alias == "desk" {
    @media #{$desk} {
      @content;
    }
  } @else if $alias == "widescreen" {
    @media #{$widescreen} {
      @content;
    }
  }
}

/*------------------------------------
 *   Grid LAYOUT
 *------------------------------------*/

.Grid {
  display: block;
  list-style: none;
  padding: 0;
  margin: 0 0 0 -24px;
  font-size: 0;
}

.Grid__Cell {
  box-sizing: border-box;
  display: inline-block;
  width: 100%;
  padding: 0 0 0 24px;
  margin: 0;
  vertical-align: top;
  font-size: 1rem;
}

.Grid--center {
  text-align: center;
}

.Grid--center > .Grid__Cell {
  text-align: left;
}

.Grid__Cell--center {
  display: block;
  margin: 0 auto;
}

.Grid--right {
  text-align: right;
}

.Grid--right > .Grid__Cell {
  text-align: left;
}

.Grid--middle > .Grid__Cell {
  vertical-align: middle;
}

.Grid--bottom > .Grid__Cell {
  vertical-align: bottom;
}

.Grid--m {
  margin-left: -30px;
}

.Grid--m > .Grid__Cell {
  padding-left: 30px;
}

.Grid--l {
  margin-left: -50px;
}

.Grid--l > .Grid__Cell {
  padding-left: 50px;
}

.Grid--xl {
  margin-left: -50px;
}

.Grid--xl > .Grid__Cell {
  padding-left: 50px;
}

@include av-mq('desk') {
  .Grid--m {
    margin-left: -60px;
  }

  .Grid--m > .Grid__Cell {
    padding-left: 60px;
  }

  .Grid--l {
    margin-left: -80px;
  }

  .Grid--l > .Grid__Cell {
    padding-left: 80px;
  }

  .Grid--xl {
    margin-left: -100px;
  }

  .Grid--xl > .Grid__Cell {
    padding-left: 100px;
  }
}

/*------------------------------------*\
    Grid WIDTHS
\*------------------------------------*/

.\31\/2, .\32\/4, .\36\/12 {
  width: 50%;
}

.\31\/3, .\34\/12 {
  width: 33.33333%;
}

.\32\/3, .\38\/12 {
  width: 66.66667%;
}

.\31\/4, .\33\/12 {
  width: 25%;
}

.\33\/4, .\39\/12 {
  width: 75%;
}

.\31\/12 {
  width: 8.33333%;
}

.\32\/12 {
  width: 16.66667%;
}

.\35\/12 {
  width: 41.66667%;
}

.\37\/12 {
  width: 58.33333%;
}

.\31\30\/12 {
  width: 83.33333%;
}

.\31\31\/12 {
  width: 91.66667%;
}

@media #{$phone} {
  .hidden-phone {
    display: none !important;
  }

  .\31\/2--phone, .\32\/4--phone, .\36\/12--phone {
    width: 50%;
  }

  .\31\/3--phone, .\34\/12--phone {
    width: 33.33333%;
  }

  .\32\/3--phone, .\38\/12--phone {
    width: 66.66667%;
  }

  .\31\/4--phone, .\33\/12--phone {
    width: 25%;
  }

  .\33\/4--phone, .\39\/12--phone {
    width: 75%;
  }

  .\31\/12--phone {
    width: 8.33333%;
  }

  .\32\/12--phone {
    width: 16.66667%;
  }

  .\35\/12--phone {
    width: 41.66667%;
  }

  .\37\/12--phone {
    width: 58.33333%;
  }

  .\31\30\/12--phone {
    width: 83.33333%;
  }

  .\31\31\/12--phone {
    width: 91.66667%;
  }
}

@media #{$tablet} {
  .hidden-tablet {
    display: none !important;
  }

  .\31\/2--tablet, .\32\/4--tablet, .\36\/12--tablet {
    width: 50%;
  }

  .\31\/3--tablet, .\34\/12--tablet {
    width: 33.33333%;
  }

  .\32\/3--tablet, .\38\/12--tablet {
    width: 66.66667%;
  }

  .\31\/4--tablet, .\33\/12--tablet {
    width: 25%;
  }

  .\33\/4--tablet, .\39\/12--tablet {
    width: 75%;
  }

  .\31\/12--tablet {
    width: 8.33333%;
  }

  .\32\/12--tablet {
    width: 16.66667%;
  }

  .\35\/12--tablet {
    width: 41.66667%;
  }

  .\37\/12--tablet {
    width: 58.33333%;
  }

  .\31\30\/12--tablet {
    width: 83.33333%;
  }

  .\31\31\/12--tablet {
    width: 91.66667%;
  }
}

@media #{$tablet-and-up} {
  .hidden-tablet-and-up {
    display: none !important;
  }

  .\31\/2--tablet-and-up, .\32\/4--tablet-and-up, .\36\/12--tablet-and-up {
    width: 50%;
  }

  .\31\/3--tablet-and-up, .\34\/12--tablet-and-up {
    width: 33.33333%;
  }

  .\32\/3--tablet-and-up, .\38\/12--tablet-and-up {
    width: 66.66667%;
  }

  .\31\/4--tablet-and-up, .\33\/12--tablet-and-up {
    width: 25%;
  }

  .\33\/4--tablet-and-up, .\39\/12--tablet-and-up {
    width: 75%;
  }

  .\31\/12--tablet-and-up {
    width: 8.33333%;
  }

  .\32\/12--tablet-and-up {
    width: 16.66667%;
  }

  .\35\/12--tablet-and-up {
    width: 41.66667%;
  }

  .\37\/12--tablet-and-up {
    width: 58.33333%;
  }

  .\31\30\/12--tablet-and-up {
    width: 83.33333%;
  }

  .\31\31\/12--tablet-and-up {
    width: 91.66667%;
  }
}

@media #{$pocket} {
  .hidden-pocket {
    display: none !important;
  }

  .\31\/2--pocket, .\32\/4--pocket, .\36\/12--pocket {
    width: 50%;
  }

  .\31\/3--pocket, .\34\/12--pocket {
    width: 33.33333%;
  }

  .\32\/3--pocket, .\38\/12--pocket {
    width: 66.66667%;
  }

  .\31\/4--pocket, .\33\/12--pocket {
    width: 25%;
  }

  .\33\/4--pocket, .\39\/12--pocket {
    width: 75%;
  }

  .\31\/12--pocket {
    width: 8.33333%;
  }

  .\32\/12--pocket {
    width: 16.66667%;
  }

  .\35\/12--pocket {
    width: 41.66667%;
  }

  .\37\/12--pocket {
    width: 58.33333%;
  }

  .\31\30\/12--pocket {
    width: 83.33333%;
  }

  .\31\31\/12--pocket {
    width: 91.66667%;
  }
}

@media #{$lap} {
  .hidden-lap {
    display: none !important;
  }

  .\31\/2--lap, .\32\/4--lap, .\36\/12--lap {
    width: 50%;
  }

  .\31\/3--lap, .\34\/12--lap {
    width: 33.33333%;
  }

  .\32\/3--lap, .\38\/12--lap {
    width: 66.66667%;
  }

  .\31\/4--lap, .\33\/12--lap {
    width: 25%;
  }

  .\33\/4--lap, .\39\/12--lap {
    width: 75%;
  }

  .\31\/12--lap {
    width: 8.33333%;
  }

  .\32\/12--lap {
    width: 16.66667%;
  }

  .\35\/12--lap {
    width: 41.66667%;
  }

  .\37\/12--lap {
    width: 58.33333%;
  }

  .\31\30\/12--lap {
    width: 83.33333%;
  }

  .\31\31\/12--lap {
    width: 91.66667%;
  }
}

@media #{$lap-and-up} {
  .hidden-lap-and-up {
    display: none !important;
  }

  .\31\/2--lap-and-up, .\32\/4--lap-and-up, .\36\/12--lap-and-up {
    width: 50%;
  }

  .\31\/3--lap-and-up, .\34\/12--lap-and-up {
    width: 33.33333%;
  }

  .\32\/3--lap-and-up, .\38\/12--lap-and-up {
    width: 66.66667%;
  }

  .\31\/4--lap-and-up, .\33\/12--lap-and-up {
    width: 25%;
  }

  .\33\/4--lap-and-up, .\39\/12--lap-and-up {
    width: 75%;
  }

  .\31\/12--lap-and-up {
    width: 8.33333%;
  }

  .\32\/12--lap-and-up {
    width: 16.66667%;
  }

  .\35\/12--lap-and-up {
    width: 41.66667%;
  }

  .\37\/12--lap-and-up {
    width: 58.33333%;
  }

  .\31\30\/12--lap-and-up {
    width: 83.33333%;
  }

  .\31\31\/12--lap-and-up {
    width: 91.66667%;
  }
}

@media #{$desk} {
  .hidden-desk {
    display: none !important;
  }

  .\31\/2--desk, .\32\/4--desk, .\36\/12--desk {
    width: 50%;
  }

  .\31\/3--desk, .\34\/12--desk {
    width: 33.33333%;
  }

  .\32\/3--desk, .\38\/12--desk {
    width: 66.66667%;
  }

  .\31\/4--desk, .\33\/12--desk {
    width: 25%;
  }

  .\33\/4--desk, .\39\/12--desk {
    width: 75%;
  }

  .\31\/12--desk {
    width: 8.33333%;
  }

  .\32\/12--desk {
    width: 16.66667%;
  }

  .\35\/12--desk {
    width: 41.66667%;
  }

  .\37\/12--desk {
    width: 58.33333%;
  }

  .\31\30\/12--desk {
    width: 83.33333%;
  }

  .\31\31\/12--desk {
    width: 91.66667%;
  }
}
/* Create each media query */
@media #{$widescreen} {
  .hidden-widescreen {
    display: none !important;
  }

  .\31\/2--widescreen, .\32\/4--widescreen, .\36\/12--widescreen {
    width: 50%;
  }

  .\31\/3--widescreen, .\34\/12--widescreen {
    width: 33.33333%;
  }

  .\32\/3--widescreen, .\38\/12--widescreen {
    width: 66.66667%;
  }

  .\31\/4--widescreen, .\33\/12--widescreen {
    width: 25%;
  }

  .\33\/4--widescreen, .\39\/12--widescreen {
    width: 75%;
  }

  .\31\/12--widescreen {
    width: 8.33333%;
  }

  .\32\/12--widescreen {
    width: 16.66667%;
  }

  .\35\/12--widescreen {
    width: 41.66667%;
  }

  .\37\/12--widescreen {
    width: 58.33333%;
  }

  .\31\30\/12--widescreen {
    width: 83.33333%;
  }

  .\31\31\/12--widescreen {
    width: 91.66667%;
  }
}
/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*
	Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
*/

.pswp {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  touch-action: none;
  z-index: 1500;
  -webkit-text-size-adjust: 100%;
  -webkit-backface-visibility: hidden;
  outline: none;
}

.pswp img {
  max-width: none;
}

.pswp--animate_opacity {
  opacity: 0.001; /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
  will-change: opacity;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp--open {
  display: block;
}

.pswp--zoom-allowed .pswp__img {
  cursor: url($cursor-zoom-in-svg) 18 18, zoom-in;
  cursor: -webkit-image-set(url($cursor-zoom-in-svg) 1x, url($cursor-zoom-in-2x-svg) 2x) 18 18, zoom-in;
}

.pswp--zoomed-in .pswp__img {
  cursor: -webkit-grab;
  cursor: grab;
}

.pswp--dragging .pswp__img {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.pswp__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: $background;
  opacity: 0;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  will-change: opacity;
}

.pswp__scroll-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.pswp__container,
.pswp__zoom-wrap {
  touch-action: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

/* Prevent selection and tap highlights */
.pswp__container,
.pswp__img {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

.pswp__container {
  transition: transform 0.7s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.pswp__zoom-wrap {
  position: absolute;
  width: 100%;
  transform-origin: left top;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp__bg {
  will-change: opacity;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp--animated-in .pswp__bg,
.pswp--animated-in .pswp__zoom-wrap {
  transition: none;
}

.pswp__container,
.pswp__zoom-wrap {
  -webkit-backface-visibility: hidden;
}

.pswp__item {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: hidden;
}

.pswp__img {
  position: absolute;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
}

.pswp__img--placeholder {
  -webkit-backface-visibility: hidden;
}

.pswp__img--placeholder--blank {
  background: $background;
}

.pswp--ie .pswp__img {
  width: 100% !important;
  height: auto !important;
  left: 0;
  top: 0;
}

/**
 * Custom UI
 */

.pswp__ui {
  position: absolute;
  visibility: hidden;
  width: 100%;
  bottom: 50px;
  opacity: 0;
  transform: translateY(35px);
  left: 0;
  text-align: center;
  transition: all 0.15s ease-in-out;
}

.pswp__button[disabled] {
  opacity: 0;
  pointer-events: none;
}

.pswp--animated-in .pswp__ui {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.pswp--animated-in .pswp__ui--hidden {
  visibility: hidden;
  opacity: 0;
}

.pswp__button--close {
  margin: 0 18px;
}

.pswp__button svg {
  pointer-events: none;
}

.pswp__error-msg {
  position: absolute;
  top: 40%;
  margin: 0 15px;
  padding: 8px 15px;
  background: #e6554d;
  color: #ffffff;
  text-align: center;
}

/**
 * In our theme, we express all font sizes in PX. The reason is that our designer is very picky and want each font size to be exactly as on designed files
 * (which is good :p), but as a consequence, sometimes some font sizes scales across devices (smaller on mobile, bigger on desktop), but sometimes it's the
 * same, which make it super hard to use relative units like REM.
 */
@function to-size($size) {
  @return $base-text-font-size - ($default-text-font-size - $size);
}

/*
 * Precomputed linear color channel values, for use in contrast calculations.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 *
 * Algorithm, for c in 0 to 255:
 * f(c) {
 *   c = c / 255;
 *   return c < 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
 * }
 *
 * This lookup table is needed since there is no `pow` in SASS.
 */

$linear-channel-values:
  0
  .0003035269835488375
  .000607053967097675
  .0009105809506465125
  .00121410793419535
  .0015176349177441874
  .001821161901293025
  .0021246888848418626
  .0024282158683907
  .0027317428519395373
  .003035269835488375
  .003346535763899161
  .003676507324047436
  .004024717018496307
  .004391442037410293
  .004776953480693729
  .005181516702338386
  .005605391624202723
  .006048833022857054
  .006512090792594475
  .006995410187265387
  .007499032043226175
  .008023192985384994
  .008568125618069307
  .009134058702220787
  .00972121732023785
  .010329823029626936
  .010960094006488246
  .011612245179743885
  .012286488356915872
  .012983032342173012
  .013702083047289686
  .014443843596092545
  .01520851442291271
  .01599629336550963
  .016807375752887384
  .017641954488384078
  .018500220128379697
  .019382360956935723
  .0202885630566524
  .021219010376003555
  .022173884793387385
  .02315336617811041
  .024157632448504756
  .02518685962736163
  .026241221894849898
  .027320891639074894
  .028426039504420793
  .0295568344378088
  .030713443732993635
  .03189603307301153
  .033104766570885055
  .03433980680868217
  .03560131487502034
  .03688945040110004
  .0382043715953465
  .03954623527673284
  .04091519690685319
  .042311410620809675
  .043735029256973465
  .04518620438567554
  .046665086336880095
  .04817182422688942
  .04970656598412723
  .05126945837404324
  .052860647023180246
  .05448027644244237
  .05612849004960009
  .05780543019106723
  .0595112381629812
  .06124605423161761
  .06301001765316767
  .06480326669290577
  .06662593864377289
  .06847816984440017
  .07036009569659588
  .07227185068231748
  .07421356838014963
  .07618538148130785
  .07818742180518633
  .08021982031446832
  .0822827071298148
  .08437621154414882
  .08650046203654976
  .08865558628577294
  .09084171118340768
  .09305896284668745
  .0953074666309647
  .09758734714186246
  .09989872824711389
  .10224173308810132
  .10461648409110419
  .10702310297826761
  .10946171077829933
  .1119324278369056
  .11443537382697373
  .11697066775851084
  .11953842798834562
  .12213877222960187
  .12477181756095049
  .12743768043564743
  .1301364766903643
  .13286832155381798
  .13563332965520566
  .13843161503245183
  .14126329114027164
  .14412847085805777
  .14702726649759498
  .14995978981060856
  .15292615199615017
  .1559264637078274
  .1589608350608804
  .162029375639111
  .1651321945016676
  .16826940018969075
  .1714411007328226
  .17464740365558504
  .17788841598362912
  .18116424424986022
  .184474994500441
  .18782077230067787
  .19120168274079138
  .1946178304415758
  .19806931955994886
  .20155625379439707
  .20507873639031693
  .20863687014525575
  .21223075741405523
  .21586050011389926
  .2195261997292692
  .2232279573168085
  .22696587351009836
  .23074004852434915
  .23455058216100522
  .238397573812271
  .24228112246555486
  .24620132670783548
  .25015828472995344
  .25415209433082675
  .2581828529215958
  .26225065752969623
  .26635560480286247
  .2704977910130658
  .27467731206038465
  .2788942634768104
  .2831487404299921
  .2874408377269175
  .29177064981753587
  .2961382707983211
  .3005437944157765
  .3049873140698863
  .30946892281750854
  .31398871337571754
  .31854677812509186
  .32314320911295075
  .3277780980565422
  .33245153634617935
  .33716361504833037
  .3419144249086609
  .3467040563550296
  .35153259950043936
  .3564001441459435
  .3613067797835095
  .3662525955988395
  .3712376804741491
  .3762621229909065
  .38132601143253014
  .386429433787049
  .39157247774972326
  .39675523072562685
  .4019777798321958
  .4072402119017367
  .41254261348390375
  .4178850708481375
  .4232676699860717
  .4286904966139066
  .43415363617474895
  .4396571738409188
  .44520119451622786
  .45078578283822346
  .45641102318040466
  .4620769996544071
  .467783796112159
  .47353149614800955
  .4793201831008268
  .4851499400560704
  .4910208498478356
  .4969329950608704
  .5028864580325687
  .5088813208549338
  .5149176653765214
  .5209955732043543
  .5271151257058131
  .5332764040105052
  .5394794890121072
  .5457244613701866
  .5520114015120001
  .5583403896342679
  .5647115057049292
  .5711248294648731
  .5775804404296506
  .5840784178911641
  .5906188409193369
  .5972017883637634
  .6038273388553378
  .6104955708078648
  .6172065624196511
  .6239603916750761
  .6307571363461468
  .6375968739940326
  .6444796819705821
  .6514056374198242
  .6583748172794485
  .665387298282272
  .6724431569576875
  .6795424696330938
  .6866853124353135
  .6938717612919899
  .7011018919329731
  .7083757798916868
  .7156935005064807
  .7230551289219693
  .7304607400903537
  .7379104087727308
  .7454042095403874
  .7529422167760779
  .7605245046752924
  .768151147247507
  .7758222183174236
  .7835377915261935
  .7912979403326302
  .799102738014409
  .8069522576692516
  .8148465722161012
  .8227857543962835
  .8307698767746546
  .83879901174074
  .846873231509858
  .8549926081242338
  .8631572134541023
  .8713671191987972
  .8796223968878317
  .8879231178819663
  .8962693533742664
  .9046611743911496
  .9130986517934192
  .9215818562772946
  .9301108583754237
  .938685728457888
  .9473065367331999
  .9559733532492861
  .9646862478944651
  .9734452903984125
  .9822505503331171
  .9911020971138298
  1;

/**
 * Calculate the luminance for a color.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
@function luminance($color) {
  $red: nth($linear-channel-values, red($color) + 1);
  $green: nth($linear-channel-values, green($color) + 1);
  $blue: nth($linear-channel-values, blue($color) + 1);

  @return .2126 * $red + .7152 * $green + .0722 * $blue;
}

/**
 * Calculate the contrast ratio between two colors.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
@function contrast($back, $front) {
  $back-lum: luminance($back) + .05;
  $fore-lum: luminance($front) + .05;

  @return max($back-lum, $fore-lum) / min($back-lum, $fore-lum);
}
.js .no-js,
.no-js .hide-no-js {
  display: none !important;
}

.no-scroll {
  overflow: hidden;
}

body:not(.is-tabbing) button:focus,
body:not(.is-tabbing) input:focus,
body:not(.is-tabbing) select:focus,
body:not(.is-tabbing) textarea:focus {
  outline: none;
}

[data-scrollable] {
  overflow: auto;
  /*-webkit-overflow-scrolling: touch;*/
}

.Container {
  margin: 0 auto;
  padding: 0 24px;
}

.Container--narrow {
  max-width: 1420px;
}

.Container--extraNarrow {
  max-width: 800px;
}

/*
   This fixes an issue in IE10/11 when using min-height in flex children
   @info: https://github.com/philipwalton/flexbugs#3-min-height-on-a-flex-container-wont-apply-to-its-flex-items
*/

.FlexboxIeFix {
  display: flex;
  flex-direction: row;
}

@include av-mq('tablet-and-up') {
  .Container {
    padding: 0 50px;
  }
}

@include av-mq('desk') {
  .Container {
    padding: 0 80px;
  }
}
/**
 * Very general typographic rules that are applied site wide
 */

html {
  font-size: $base-text-font-size;
}

body {
  font-family: $text-font-family;
  font-weight: $text-font-weight;
  font-style: $text-font-style;
  color: $text-color;
  background: $background;
  line-height: 1.65;
}

.Link {
  transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

.supports-hover .Link--primary:hover,
.Link--primary.is-active {
  color: $text-color;
}

.supports-hover .Link--secondary:hover,
.Link--secondary.is-active {
  color: $text-color-light;
}

.Link--underline {
  position: relative;
  display: inline-block;

  &::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: -1px;
    background: currentColor;
    transform: scale(1, 1);
    transform-origin: left center;
    transition: transform 0.2s ease-in-out;
  }

  @media (-moz-touch-enabled: 0), (hover: hover) {
    &:hover::before {
      transform: scale(0, 1);
    }
  }
}

.Link--underlineShort::before {
  @if $uppercase-heading {
    width: calc(100% - 0.2em);
  } @else {
    width: 100%;
  }
}

.Link--underlineNative {
  text-decoration: underline;
  text-underline-position: under;
}

.Heading {
    font-family: "system_ui", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-weight: 400;
    font-style: normal;
    color: var(--shopify-editor-setting-heading_color);
    transition: color 0.2s ease-in-out;
    letter-spacing: 0.2em;
    text-transform: Uppercase;
}
 


.Text--alignCenter {
  text-align: center !important;
}

.Text--alignRight {
  text-align: right !important;
}

.Icon-Wrapper--clickable {
  position: relative;
  background: transparent;

  /* This is used to increase the clickable area */
  &::before {
    position: absolute;
    content: '';
    top: -8px;
    right: -12px;
    left: -12px;
    bottom: -8px;
    transform: translateZ(0); /* Needed to avoid a glitch on iOS */
  }
}

.Icon {
  display: inline-block;
  height: 1em;
  width: 1em;
  fill: currentColor;
  vertical-align: middle;
  stroke-width: 1px;
  background: none;
  pointer-events: none;
}

.u-visually-hidden {
  position: absolute !important;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}

@if $heading-font-size == 'small' {
  .u-h1 {
    font-size: 28px;
  }

  .u-h2 {
    font-size: 18px;
  }

  .u-h3 {
    font-size: 16px;
  }

  .u-h4 {
    font-size: 15px;
  }

  .u-h5 {
    font-size: 13px;
  }

  .u-h6 {
    font-size: 12px;
  }

  .u-h7 {
    font-size: 11px;
  }

  .u-h8 {
    font-size: 10px;
  }
} @else if $heading-font-size == 'normal' {
  .u-h1 {
    font-size: 22px;
  }

  .u-h2 {
    font-size: 20px;
  }

  .u-h3 {
    font-size: 18px;
  }

  .u-h4 {
    font-size: 16px;
  }

  .u-h5 {
    font-size: 14px;
  }

  .u-h6 {
    font-size: 13px;
  }

  .u-h7 {
    font-size: 12px;
  }

  .u-h8 {
    font-size: 12px;
  }
} @else {
  .u-h1 {
    font-size: 24px;
  }

  .u-h2 {
    font-size: 22px;
  }

  .u-h3 {
    font-size: 20px;
  }

  .u-h4 {
    font-size: 18px;
  }

  .u-h5 {
    font-size: 16px;
  }

  .u-h6 {
    font-size: 15px;
  }

  .u-h7 {
    font-size: 13px;
  }

  .u-h8 {
    font-size: 13px;
  }
}

@include av-mq('tablet-and-up') {
  @if $heading-font-size == 'small' {
    .u-h1 {
      font-size: 20px;
    }

    .u-h2 {
      font-size: 18px;
    }

    .u-h3 {
      font-size: 18px;
    }

    .u-h4 {
      font-size: 16px;
    }

    .u-h5 {
      font-size: 13px;
    }

    .u-h6 {
      font-size: 12px;
    }

    .u-h7 {
      font-size: 11px;
    }

    .u-h8 {
      font-size: 10px;
    }
  } @else if $heading-font-size == 'normal' {
    .u-h1 {
      font-size: 22px;
    }

    .u-h2 {
      font-size: 20px;
    }

    .u-h3 {
      font-size: 20px;
    }

    .u-h4 {
      font-size: 17px;
    }

    .u-h5 {
      font-size: 14px;
    }

    .u-h6 {
      font-size: 13px;
    }

    .u-h7 {
      font-size: 12px;
    }

    .u-h8 {
      font-size: 12px;
    }
  } @else {
    .u-h1 {
      font-size: 24px;
    }

    .u-h2 {
      font-size: 22px;
    }

    .u-h3 {
      font-size: 20px;
    }

    .u-h4 {
      font-size: 19px;
    }

    .u-h5 {
      font-size: 16px;
    }

    .u-h6 {
      font-size: 15px;
    }

    .u-h7 {
      font-size: 13px;
    }

    .u-h8 {
      font-size: 13px;
    }
  }
}

@if $show-page-transition {
  .js .PageTransition {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: $background;
    z-index: 1000;
    opacity: 1;
    visibility: visible;
    pointer-events: none;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Standard button
 * ----------------------------------------------------------------------------
 */

.Button {
    position: relative;
    display: inline-block;
    padding: 14px 14px;
    line-height: normal;
    border: 1px solid transparent;
    border-radius: 40px;
    text-transform: uppercase;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0.13em;
    font-family: "system_ui", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-weight: 400;
    font-style: normal;
    background-color: transparent;
    transition: color 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86), border 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    z-index: 1;
    color:white !important;
    -webkit-tap-highlight-color: initial;
  &::before {
    position: absolute;
    content: '';
    display: block;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    transform: scale(1, 1);
    transform-origin: left center;
    z-index: -1;
  }

  @if $show-button-transition {
    @media (-moz-touch-enabled: 0), (hover: hover) {
      &:not([disabled])::before {
        transition: transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86);
      }

      &:not([disabled]):hover::before {
        transform-origin: right center;
        transform: scale(0, 1);
      }
    }
  }

  &[disabled] {
    cursor: not-allowed;
  }
}

.Button--primary {
  color: $button-text-color;
  border-color: $button-background;
  border:0px;

  &::before {
    background-color: #2F80ED;
    border-radius: 40px;
    background: linear-gradient(to right, #56CCF2 0%, #2F80ED 51%, #56CCF2 100%);
  }

  @if $show-button-transition {
    @media (-moz-touch-enabled: 0), (hover: hover) {
      &:not([disabled]):hover {
        @if ((contrast($button-background, $light-background) > 2.5) or ($button-text-color == $background)) {
          color:#fff;
        } @else {
          color: #fff;
        }

        background-color:#2F80ED;
      }
    }
  }
}

.Button--primaryddd {
  color: $button-text-color;
  border-color: $button-background;

  &::before {
    background-color: #fff;
  }

  @if $show-button-transition {
    @media (-moz-touch-enabled: 0), (hover: hover) {
      &:not([disabled]):hover {
        @if ((contrast($button-background, $light-background) > 2.5) or ($button-text-color == $background)) {
          color: $button-background;
        } @else {
          color: $button-text-color;
        }

        background-color: transparent;
      }
    }
  }
}

.Button--secondary {
  color: $text-color-light;
  border: 1px solid rgba($text-color-light, 0.2);

  &::before {
    background-color: $button-background;
    transform-origin: right center;
    transform: scale(0, 1);
  }

  @if $show-button-transition {
    @media (-moz-touch-enabled: 0), (hover: hover) {
      &:not([disabled]):hover {
        color: $button-text-color;
        border-color: $button-background;
      }

      &:not([disabled]):hover::before {
        transform-origin: left center;
        transform: scale(1, 1);
      }
    }
  }
}

.Button--full {
  width: 100%;
}

.Button--stretched {
  padding-left: 40px;
  padding-right: 40px;
}

.Button--small {
  font-size: to-size(10px);
  padding: 12px 24px;
}

.Button__SeparatorDot {
  display: inline-block;
  margin: 0 18px;
  content: '';
  height: 3px;
  width: 3px;
  border-radius: 100%;
  background: currentColor;
}

.ButtonWrapper {
  text-align: center;
}

/* We allow those buttons to have secondary state. The secondary state is displayed (for instance during loading time) when
   the class "Button--secondaryState" is added */

.Button__PrimaryState,
.Button__SecondaryState {
  display: block;
  transition: transform 0.4s cubic-bezier(0.75, 0, 0.125, 1), opacity 0.4s cubic-bezier(0.75, 0, 0.125, 1);
}

.Button__SecondaryState {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  text-align: center;
  opacity: 0;
  transform: translate(-50%, 100%);
}

.Button--secondaryState {
  .Button__PrimaryState {
    opacity: 0;
    transform: translateY(-100%);
  }

  .Button__SecondaryState {
    opacity: 1;
    transform: translate(-50%, -50%);
  }
}

/**
 * ----------------------------------------------------------------------------
 * Button group
 * ----------------------------------------------------------------------------
 */

.ButtonGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin: -12px;
}

.ButtonGroup__Item {
  margin: 12px;
}

.ButtonGroup__Item--expand {
  flex: 1 1 0;
}

.ButtonGroup--spacingSmall {
  margin: -8px;

  .ButtonGroup__Item {
    margin: 8px;
  }
}

.ButtonGroup--sameSize .ButtonGroup__Item {
  flex: 0 1 auto;
  white-space: nowrap;
  max-width: 245px;

  @supports ((-o-object-fit: cover) or (object-fit: cover)) {
    flex: 1 1 0; /* There is a bug in IE11 so we're forced to use this trick */
  }
}

@include av-mq('tablet-and-up') {
  @supports (display: inline-grid) {
    .ButtonGroup--sameSize {
      display: inline-grid;
      grid-template-columns: 1fr 1fr;
    }

    .ButtonGroup--sameSize .ButtonGroup__Item {
      max-width: none;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Round button
 *
 * Those buttons are not really button like the others, but they are used in
 * lot of different places to hold things like icons
 * ----------------------------------------------------------------------------
 */

.RoundButton {
  position: relative;
  width: 45px;
  height: 45px;
  border: none;
  border-radius: 50%;
  background: $button-text-color;
  color: $button-background;
  cursor: pointer;
  text-align: center;
  z-index: 1;
  box-shadow: 0 2px 10px rgba(#363636, 0.15);
  vertical-align: middle;
  line-height: 0;
  transform: scale(1.001); /* Avoid rounding error during animation in Chrome */
  transition: background 0.15s ease-in-out, opacity 0.15s ease-in-out, transform 0.2s ease-in-out, color 0.2s ease-in-out;
  overflow: hidden;

  &.is-active {
    background: $button-background;
    color: $button-text-color;
    outline: none;
  }

  svg {
    height: 15px;
    width: 15px;
    fill: currentColor;
  }
}

.RoundButton--small {
  width: 35px;
  height: 35px;

  svg {
    height: 14px;
    width: 14px;
  }
}

.RoundButton--medium {
  width: 50px;
  height: 50px;

  svg {
    height: 18px;
    width: 18px;
  }
}

.RoundButton--large {
  width: 55px;
  height: 55px;

  svg {
    height: 15px;
    width: 15px;
  }
}

.RoundButton--flat {
  box-shadow: 0 1px 5px rgba(#363636, 0.15);
  color: rgba($button-background, 0.5);
}

/* We allow those buttons to have secondary state. The secondary state is displayed (for instance during loading time) when
   the class "RoundButton--withSecondaryState" is added */

.RoundButton__PrimaryState,
.RoundButton__SecondaryState {
  display: block;
  transition: transform 0.4s cubic-bezier(0.75, 0, 0.125, 1), opacity 0.4s cubic-bezier(0.75, 0, 0.125, 1);
}

.RoundButton__SecondaryState {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  text-align: center;
  opacity: 0;
  transform: translate(-50%, 100%);
}

.RoundButton--secondaryState {
  .RoundButton__PrimaryState {
    opacity: 0;
    transform: translateY(-100%);
  }

  .RoundButton__SecondaryState {
    opacity: 1;
    transform: translate(-50%, -50%);
  }
}

/* Animation states */

@-webkit-keyframes buttonFromLeftToRight {
  0% {
    transform: translateX(0%);
  }

  25% {
    opacity: 0;
    transform: translateX(100%);
  }

  50% {
    opacity: 0;
    transform: translateX(-100%);
  }

  75% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@keyframes buttonFromLeftToRight {
  0% {
    transform: translateX(0%);
  }

  25% {
    opacity: 0;
    transform: translateX(100%);
  }

  50% {
    opacity: 0;
    transform: translateX(-100%);
  }

  75% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@-webkit-keyframes buttonFromRightToLeft {
  0% {
    transform: translateX(0%);
  }

  25% {
    opacity: 0;
    transform: translateX(-100%);
  }

  50% {
    opacity: 0;
    transform: translateX(100%);
  }

  75% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@keyframes buttonFromRightToLeft {
  0% {
    transform: translateX(0%);
  }

  25% {
    opacity: 0;
    transform: translateX(-100%);
  }

  50% {
    opacity: 0;
    transform: translateX(100%);
  }

  75% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@-webkit-keyframes buttonFromTopToBottom {
  0% {
    transform: translateY(0%);
  }

  25% {
    opacity: 0;
    transform: translateY(100%);
  }

  50% {
    opacity: 0;
    transform: translateY(-100%);
  }

  75% {
    opacity: 1;
    transform: translateY(0%);
  }
}

@keyframes buttonFromTopToBottom {
  0% {
    transform: translateY(0%);
  }

  25% {
    opacity: 0;
    transform: translateY(100%);
  }

  50% {
    opacity: 0;
    transform: translateY(-100%);
  }

  75% {
    opacity: 1;
    transform: translateY(0%);
  }
}

@media (-moz-touch-enabled: 0), (hover: hover) {
  .RoundButton:hover {
    transform: scale(1.1);
  }

  .RoundButton--small:hover {
    transform: scale(1.15);
  }

  .RoundButton:not([aria-expanded="true"]):hover {
    color: $button-background;
  }

  .RoundButton[data-animate-left]:hover svg,
  .flickity-prev-next-button.previous:hover svg {
    -webkit-animation: buttonFromRightToLeft 0.5s ease-in-out forwards;
    animation: buttonFromRightToLeft 0.5s ease-in-out forwards;
  }

  .RoundButton[data-animate-right]:hover svg,
  .flickity-prev-next-button.next:hover svg {
    -webkit-animation: buttonFromLeftToRight 0.5s ease-in-out forwards;
    animation: buttonFromLeftToRight 0.5s ease-in-out forwards;
  }

  .RoundButton[data-animate-bottom]:hover svg {
    -webkit-animation: buttonFromTopToBottom 0.5s ease-in-out forwards;
    animation: buttonFromTopToBottom 0.5s ease-in-out forwards;
  }
}
/**
 * ----------------------------------------------------------------------------------------------
 * Flickity styles
 * ----------------------------------------------------------------------------------------------
 */

.flickity-enabled {
  position: relative;
}

body:not(.is-tabbing) .flickity-enabled:focus {
  outline: none;
}

.flickity-viewport {
  overflow: hidden;
  position: relative;
  height: auto;
}

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* draggable */

.flickity-enabled {
  -webkit-tap-highlight-color: transparent;
}

.flickity-enabled.is-draggable {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: -webkit-grab;
  cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* ---- previous/next buttons ---- */

.flickity-prev-next-button {
  @extend .RoundButton;
  position: absolute;

  &[disabled] {
    opacity: 0;
  }

  svg {
    width: auto;
    height: 18px;
    stroke-width: 1.5px;
    stroke: currentColor;
  }
}

/* ---- page dots ---- */

.flickity-page-dots {
  width: 100%;
  padding: 0;
  margin: 22px 0 0 0;
  list-style: none;
  text-align: center;
  line-height: 1;
}

.flickity-page-dots .dot {
  position: relative;
  display: inline-block;
  width: 9px;
  height: 9px;
  margin: 0 6px;
  border-radius: 50%;
  cursor: pointer;
  background: transparent;
  border: 1px solid $border-color;
  transition: color 0.2s ease-in-out, background 0.2s ease-in-out;

  /* This is used to increase the clickable area */
  &::before {
    position: absolute;
    content: '';
    top: -6px;
    right: -6px;
    left: -6px;
    bottom: -6px;
  }
}

.flickity-page-dots .dot.is-selected {
  background: currentColor;
  border-color: currentColor;
}

@include av-mq('tablet-and-up') {
  .flickity-page-dots .dot {
    width: 10px;
    height: 10px;
    margin: 0 7px;
    border-width: 2px;
  }
}

/**
 * ----------------------------------------------------------------------------------------------
 * Default styling for site-wide carousel
 * ----------------------------------------------------------------------------------------------
 */

.Carousel {
  position: relative;
}

.Carousel--fixed,
.Carousel--fixed .flickity-viewport,
.Carousel--fixed .Carousel__Cell {
  height: 100%;
}

/* This allows to hide cells that are not first one until slider is loaded */
.Carousel:not(.flickity-enabled) .Carousel__Cell:not(.is-selected) {
  display: none;
}

.Carousel__Cell {
  display: block;
  width: 100%;
}

.js .Carousel--fadeIn {
  .flickity-slider {
    transform: none !important;
  }

  .Carousel__Cell {
    left: 0 !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
  }

  .Carousel__Cell.is-selected {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
  }
}

.Carousel--insideDots {
  .flickity-page-dots {
    position: absolute;
    width: auto;
    margin: 0;
    bottom: 24px;
    left: 20px;
  }

  .flickity-page-dots .dot {
    border-color: currentColor;
  }

  .flickity-page-dots .dot.is-selected {
    background: currentColor;
  }

  .flickity-prev-next-button {
    bottom: -25px;
    z-index: 1;
  }

  .flickity-prev-next-button.next {
    right: 25px;
  }

  .flickity-prev-next-button.previous {
    right: 75px;
    margin-right: 15px;
  }
}

@include av-mq('lap-and-up') {
  .Carousel--insideDots {
    .flickity-page-dots {
      bottom: 28px;
      right: 24px;
      left: auto;
    }
  }
}
/**
 * ----------------------------------------------------------------------------
 * Collapsible
 * ----------------------------------------------------------------------------
 */

.Collapsible {
  border-top: 1px solid $border-color;
  border-bottom: 1px solid $border-color;
  overflow: hidden;
}

.Collapsible + .Collapsible {
  border-top: none;
}

.Collapsible--padded {
  padding-left: 24px;
  padding-right: 24px;
}

.Collapsible__Button {
  display: block;
  position: relative;
  width: 100%;
  padding: 20px 0;
  text-align: left;
  cursor: pointer;
}

.Collapsible__Plus {
  position: absolute;
  right: 0;
  top: calc(50% - (11px / 2));
  width: 11px;
  height: 11px;

  &::before,
  &::after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-90deg);
    background-color: currentColor;
    transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
  }

  &::before {
    width: 11px;
    height: 1px;
    opacity: 1;
  }

  &::after {
    width: 1px;
    height: 11px;
  }
}

.Collapsible__Button[aria-expanded="true"] .Collapsible__Plus {
  &::before,
  &::after {
    transform: translate(-50%, -50%) rotate(90deg);
  }

  &::before {
    opacity: 0;
  }
}

.Collapsible .Collapsible {
  margin-left: 16px;
  border: none;
}

.Collapsible .Collapsible .Collapsible__Button {
  padding: 13px 0;
}

.Collapsible__Inner {
  display: block;
  height: 0;
  visibility: hidden;
  transition: height 0.35s ease-in-out, visibility 0s ease-in-out 0.35s;
  overflow: hidden;
}

.Collapsible__Button[aria-expanded="true"] + .Collapsible__Inner {
  visibility: visible;
  transition: height 0.35s ease-in-out;
}

.Collapsible__Content {
  padding-bottom: 18px;
}

.Collapsible .Linklist {
  margin-bottom: 4px;
}

.Collapsible .Linklist--bordered {
  margin-top: 16px;
  margin-bottom: 4px;
}

@include av-mq('tablet-and-up') {
  /* When this class is applied to a collapsible, it will display as a collapsible on mobile but not on larger screen, where it will
     automatically appear is auto-expanded */
  .Collapsible--autoExpand {
    border: none;
    overflow: visible;

    .Collapsible__Button {
      cursor: default;
      padding-top: 0;
      padding-bottom: 0;
      margin-bottom: 16px;
    }

    .Collapsible__Plus {
      display: none;
    }

    .Collapsible__Inner {
      height: auto;
      visibility: visible;
      overflow: visible;
    }

    .Collapsible__Content {
      padding-bottom: 0;
    }

    .Linklist {
      margin-bottom: 0;
    }
  }

  .Collapsible--autoExpand {
    margin-bottom: 32px;
  }
}

@include av-mq('lap-and-up') {
  .Collapsible--padded {
    padding-left: 30px;
    padding-right: 30px;
  }

  .Collapsible--large .Collapsible__Button {
    padding: 34px 0;
  }

  .Collapsible--large .Collapsible__Content {
    padding-bottom: 45px;
  }
}
$drawer-header-height : 50px;

/**
 * ----------------------------------------------------------------------------
 * Base drawer
 * ----------------------------------------------------------------------------
 */

.Drawer {
  position: fixed;
  top: 0;
  left: 0;
  visibility: hidden;
  width: calc(100vw - 65px); /* Interestingly, 100% does not work on iOS 9 and lower */
  height: 100vh;
  max-height: none;
  z-index: 20;
  transition: transform 0.5s $drawer-transition-timing, visibility 0.5s $drawer-transition-timing;
  background: $background;
  box-shadow: none;
  touch-action: manipulation;

  &:focus {
    outline: none;
  }

  /* Animating box-shadow is slow, even on modern browsers, so we instead move it in a pseudo-element and animate opacity */
  &::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    box-shadow: 2px 0 10px rgba(#363636, 0.2), -2px 0 10px rgba(#363636, 0.2);
    opacity: 0;
    transition: opacity 0.5s $drawer-transition-timing;
  }
}

.Drawer--secondary {
  background: $light-background;
}

.Drawer--fromLeft {
  transform: translateX(calc(-100vw + 65px));
}

.Drawer--fromRight {
  right: 0;
  left: auto;
  transform: translateX(calc(100vw - 65px));
}

.Drawer[aria-hidden="false"] {
  visibility: visible;
  transform: translateX(0);

  &::before {
    opacity: 1;
  }
}

.Drawer__Container {
  width: 100%;

  .Drawer--fromLeft & {
    padding-left: 18px;
    padding-right: 24px;
  }

  .Drawer--fromRight & {
    padding-left: 24px;
    padding-right: 18px;
  }
}

.Drawer__Header {
  display: flex;
  align-items: center;
  position: relative;
  height: $drawer-header-height;
  max-height: 60px;
  background: inherit;
  text-align: center;
  z-index: 1;

  @supports (--css: variables) {
    height: var(--header-height);
  }
}

.Drawer__Header--center {
  justify-content: center;
}

.Drawer__Close {
  position: absolute;
  margin-left: 0;
  left: 18px;
  top: calc(50% - 7px);
  line-height: 0;

  svg {
    width: 15px;
    height: 15px;
    stroke-width: 1.25px;
  }
}

.Drawer--fromRight .Drawer__Close {
  right: 18px;
  left: auto;
}

.Drawer__Header--bordered {
  box-shadow: 0 -1px $border-color inset;
}

.Drawer--secondary .Drawer__Header--bordered {
  box-shadow: 0 -1px rgba($border-color, 0.6) inset;
}

.Drawer--secondary .Collapsible {
  border-bottom-color: rgba($border-color, 0.6);
}

.Drawer__Content {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: calc(100% - 60px);
  max-height: calc(100% - #{$drawer-header-height});

  @supports (--css: variables) {
    height: calc(100% - var(--header-height));
    max-height: calc(100% - var(--header-height));
  }

  /* This handles an edge case when the header is much bigger than the maximum size for content, but this only works on Safari as of today */
  @supports (width: calc(max(100%))) {
    height: calc(max(100% - var(--header-height), 100% - 60px));
    max-height: calc(max(100% - var(--header-height), 100% - 60px));
  }
}

.Drawer__Main {
  flex: 1 1 auto;
}

.Drawer__Footer {
  flex: none;
  box-shadow: 0 -1px $border-color;
}

.Drawer--secondary .Drawer__Footer {
  box-shadow: 0 -1px rgba($border-color, 0.6);
}

.Drawer__Footer--padded {
  padding: 24px;
}

@include av-mq('tablet-and-up') {
  .Drawer {
    width: 400px;
    transform: translateX(-100%);
  }

  .Drawer--small {
    width: 340px;
  }

  .Drawer--fromRight {
    transform: translateX(100%);
  }

  .Drawer__Header {
    max-height: 80px;
    min-height: 60px;
  }

  /*.Drawer__Content {
    min-height: calc(100% - 80px);
    max-height: calc(100% - 80px);
  }*/

  .Drawer--fromLeft .Drawer__Container,
  .Drawer--fromRight .Drawer__Container {
    padding-left: 30px;
    padding-right: 30px;
  }

  .Drawer__Close {
    left: 30px;
  }

  .Drawer--fromRight .Drawer__Close {
    right: 30px;
    left: auto;
  }

  .Drawer__Close svg {
    stroke-width: 1.5px;
  }

  .Drawer__Footer--padded {
    padding: 24px 30px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Animation
 * ----------------------------------------------------------------------------
 */

[data-drawer-animated-left],
[data-drawer-animated-right] {
  opacity: 0;
  transition: opacity 0.5s ease 0.25s, transform 0.5s ease 0.25s;

  .Drawer[aria-hidden="false"] & {
    opacity: 1;
    transform: translateX(0);
  }
}

[data-drawer-animated-left] {
  transform: translateX(-65px);
}

[data-drawer-animated-right] {
  transform: translateX(65px);
}

[data-drawer-animated-bottom] {
  opacity: 0;
  transform: translateY(45px);
  transition: opacity 0.35s cubic-bezier(.25, .46, .45, .94), transform 0.35s cubic-bezier(.25, .46, .45, .94);

  .Drawer[aria-hidden="false"] & {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.25s cubic-bezier(.25, .46, .45, .94) 0.45s, transform 0.25s cubic-bezier(.25, .46, .45, .94) 0.45s;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Basic form
 * ----------------------------------------------------------------------------
 */

.Form {
  width: 100%;
}

.Form__Item {
  position: relative;
  margin-bottom: 15px;
}

.Form__Input,
.Form__Textarea {
  -webkit-appearance: none;
  display: block;
  padding: 12px 14px;
  border-radius: 0;
  border: 1px solid $border-color;
  width: 100%;
  line-height: normal;
  resize: none;
  transition: border-color 0.1s ease-in-out;
  background: transparent;

  &:focus {
    border-color: lighten($text-color, 25%);
    outline: none;
  }

  &::-webkit-input-placeholder {
    color: $text-color-light;
  }

  &::-moz-placeholder {
    color: $text-color-light;
  }

  &:-ms-input-placeholder {
    color: $text-color-light;
  }

  &::-ms-input-placeholder {
    color: $text-color-light;
  }

  &::placeholder {
    color: $text-color-light;
  }
}

.Form__FloatingLabel {
  position: absolute;
  bottom: calc(100% - 8px);
  left: 10px;
  padding: 0 5px;
  line-height: normal;
  color: $text-color-light;
  font-size: to-size(12px);
  opacity: 0;
  background: rgba($background, 0);
  pointer-events: none;
  transform: translateY(3px);
  transition: all 0.3s ease-in-out;
}

.Form__Input:not(:placeholder-shown) ~ .Form__FloatingLabel,
.Form__Textarea:not(:placeholder-shown) ~ .Form__FloatingLabel {
  opacity: 1;
  background: $background;
  transform: translateY(0);
}

.Form__Checkbox {
  position: absolute;
  opacity: 0;
}

.Form__Checkbox ~ label::before {
  display: inline-block;
  content: '';
  width: 1em;
  height: 1em;
  margin-right: 10px;
  border: 1px solid $border-color;
  vertical-align: -2px;
}

.Form__Checkbox ~ svg {
  position: absolute;
  top: 5px;
  left: 1px;
  width: 12px;
  height: 12px;
  transform: scale(0);
  transition: transform 0.2s ease-in-out;
  will-change: transform;
}

.Form__Checkbox:checked ~ label::before {
  border-color: $text-color;
}

.Form__Checkbox:checked ~ svg {
  transform: scale(1);
}

.Form__Alert {
  margin-bottom: 20px;
}

.Form__Submit {
  display: block;
  margin-top: 20px;
}

.Form__Label {
  display: block;
  padding-bottom: 8px;
  font-size: to-size(11px);
  text-transform: uppercase;
  font-family: $heading-font-family;
  font-weight: $heading-font-weight;
  font-style: $heading-font-style;
  letter-spacing: 0.2em;
  line-height: normal;
}

.Form--small .Form__Input,
.Form--small .Form__Textarea {
  font-size: to-size(13px);
  padding-top: 10px;
  padding-bottom: 10px;
}

.Form--spacingTight {
  .Form__Item {
    margin-bottom: 15px;
  }

  .Form__Alert {
    margin-bottom: 20px;
  }
}

@include av-mq('tablet-and-up') {
  .Form__Item,
  .Form__Alert {
    margin-bottom: 30px;
  }

  .Form__Group {
    display: flex;
  }

  .Form__Group > .Form__Item {
    flex: 1;
  }

  .Form__Group > :nth-child(2) {
    margin-left: 30px;
  }

  .Form--spacingTight {
    .Form__Group > :nth-child(2) {
      margin-left: 15px;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Form elements
 * ----------------------------------------------------------------------------
 */

.Form__Header {
  margin-bottom: 24px;
  text-align: center;
}

.Form__Hint {
  margin: 24px 0 0 0;
}

.Form__Hint:not(:last-child) {
  margin-bottom: 32px;
}

.Form__Hint--center {
  text-align: center;
}

.Form__ItemHelp {
  position: absolute;
  right: 12px;
  top: 50%;
  font-size: to-size(12px);
  color: $text-color-light;
  transform: translateY(-50%);
}

/**
 * ----------------------------------------------------------------------------
 * Styled select
 * ----------------------------------------------------------------------------
 */

select::-ms-expand {
  display: none;
}

.Select {
  position: relative;
  color: currentColor;
  line-height: 1;
  vertical-align: middle;
}

.Select svg {
  position: absolute;
  line-height: normal;
  pointer-events: none;
  vertical-align: baseline;
  fill: currentColor;
}

.Select select {
  /* Disable built-in styles */
  -webkit-appearance: none;
  -moz-appearance: none;

  display: inline-block;
  color: inherit;
  cursor: pointer;
  border-radius: 0;
  line-height: normal;

  /* Remove the ugly blue background on IE when a value is selected */
  &:focus::-ms-value {
    background: $background;
    color: $text-color;
  }
}

/* Make sure to have something easy to read... */
.Select option {
  background: white;
  color: black;
}

.Select--primary {
  &::after {
    content: '';
    position: absolute;
    right: 1px;
    top: 1px;
    height: calc(100% - 2px);
    width: 55px;
    background: linear-gradient(to right, rgba($background, 0), rgba($background, 0.7) 20%, $background 40%);
    pointer-events: none;
  }

  select {
    width: 100%;
    height: 45px;
    padding-left: 14px;
    padding-right: 28px;
    border: 1px solid $border-color;
    background: $background;

    &:active, &:focus {
      border-color: $text-color;
      outline: none;
    }
  }

  svg {
    top: calc(50% - 5px);
    right: 15px;
    width: 10px;
    height: 10px;
    z-index: 1;
  }
}

.Select--transparent {
  select {
    padding-right: 15px;
    background: transparent;
    border: none;
    font-family: $heading-font-family;
    font-weight: $heading-font-weight;
    font-style: $heading-font-style;
    font-size: inherit;
    text-transform: uppercase;

    @if $uppercase-heading {
      letter-spacing: 0.2em;
    }
  }

  svg {
    top: calc(50% - 3px);
    right: 0;
    height: 6px;
  }
}
.HorizontalList {
  list-style: none;
  margin: -6px -8px;
}

.HorizontalList__Item {
  display: inline-block;
  margin: 6px 8px 6px 8px;
}

.HorizontalList__Item > .Link {
  display: inline-block;
}

.HorizontalList--spacingTight {
  margin-left: -8px;
  margin-right: -8px;
}

.HorizontalList--spacingTight .HorizontalList__Item {
  margin-right: 8px;
  margin-left: 8px;
}

.HorizontalList--spacingLoose {
  margin-left: -14px;
  margin-right: -14px;
}

.HorizontalList--spacingLoose .HorizontalList__Item {
  margin-right: 14px;
  margin-left: 14px;
}

.HorizontalList--spacingExtraLoose {
  margin-left: -17px;
  margin-right: -17px;
}

.HorizontalList--spacingExtraLoose .HorizontalList__Item {
  margin-right: 17px;
  margin-left: 17px;
}

.HorizontalList--spacingFill {
  display: flex;
  justify-content: space-around;
  justify-content: space-evenly;
}

.HorizontalList--spacingFill .HorizontalList__Item {
  margin-left: 0;
  margin-right: 0;
}

@include av-mq('desk') {
  .HorizontalList--spacingExtraLoose {
    margin-left: -21px;
    margin-right: -21px;
  }

  .HorizontalList--spacingExtraLoose .HorizontalList__Item {
    margin-right: 21px;
    margin-left: 21px;
  }
}
/**
 * This file contains various generic bloc to use with images
 */

/**
 * ----------------------------------------------------------------------------
 * Image overlay
 * ----------------------------------------------------------------------------
 */

.Image--contrast {
  position: relative;
}

.Image--contrast::after {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: linear-gradient(to top, rgba(#040404, 0), rgba(#363636, 0));
}

.Image--contrast > * {
  z-index: 1;
}

/**
 * ----------------------------------------------------------------------------
 * Image lazy loader (integrates with lazy sizes)
 * ----------------------------------------------------------------------------
 */

@-webkit-keyframes lazyLoader {
  0%, 100% {
    transform: translateX(-50%);
  }

  50% {
    transform: translateX(100%);
  }
}

@keyframes lazyLoader {
  0%, 100% {
    transform: translateX(-50%);
  }

  50% {
    transform: translateX(100%);
  }
}

.Image--fadeIn {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.Image--lazyLoaded.Image--fadeIn {
  opacity: 1;
}

@if $show-image-zooming {
  .Image--zoomOut {
    transform: scale(1.1);
    opacity: 0;
    transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  .Image--lazyLoaded.Image--zoomOut {
    opacity: 1;
    transform: none;
  }
} @else {
  /* If zoom is disabled we apply the same effect than fadeIn */
  .Image--zoomOut {
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .Image--lazyLoaded.Image--zoomOut {
    opacity: 1;
  }
}

.Image--slideRight,
.Image--slideLeft {
  transform: translateX(25px);
  opacity: 0;
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.Image--slideLeft {
  transform: translateX(-25px);
}

.Image--lazyLoaded.Image--slideRight,
.Image--lazyLoaded.Image--slideLeft {
  opacity: 1;
  transform: translateX(0);
}

.Image__Loader {
  position: absolute;
  display: block;
  height: 2px;
  width: 50px;
  left: 0;
  bottom: 0;
  right: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
  margin: auto;
  pointer-events: none;
  background-color: $border-color;
  z-index: -1;
  transition: all 0.2s ease-in-out;
  overflow: hidden;
}

.Image__Loader::after {
  position: absolute;
  content: '';
  bottom: 0;
  right: 0;
  top: 0;
  height: 100%;
  width: 200%;
  background-color: $heading-color;
}

.Image--lazyLoading + .Image__Loader {
  opacity: 1;
  visibility: visible;
  z-index: 1;

  &::after {
    -webkit-animation: lazyLoader 3s infinite;
    animation: lazyLoader 3s infinite;
    -webkit-animation-timing-function: cubic-bezier(.43, .43, .25, .99);
    animation-timing-function: cubic-bezier(.43, .43, .25, .99);
  }
}

/**
 * ----------------------------------------------------------------------------
 * Aspect ratio
 * ----------------------------------------------------------------------------
 */

.AspectRatio {
  position: relative;
  margin-left: auto;
  margin-right: auto;

  &::before {
    content: '';
    display: block;
  }
}

.AspectRatio > img {
  max-height: 100%;
  max-width: 100%;
}

.AspectRatio--withFallback > img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.no-js .AspectRatio > img {
  display: none !important;
}

@supports (--css: variables) {
  /* For dynamic one, we use CSS variables, which makes it only compatible for newer browsers */

  .AspectRatio--withFallback {
    padding-bottom: 0 !important; /* For older browsers we use the padding-bottom trick, so make sure to remove it here */
  }

  .AspectRatio::before {
    padding-bottom: calc(100% / (var(--aspect-ratio)));
  }

  .AspectRatio > img,
  .no-js .AspectRatio > noscript img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
  }
}

.AspectRatio--square::before {
  padding-bottom: 100%;
}

.AspectRatio--short::before {
  padding-bottom: 75%;
}

.AspectRatio--tall::before {
  padding-bottom: 150%;
}

.AspectRatio--square > img,
.AspectRatio--short > img,
.AspectRatio--tall > img {
  position: absolute;
  width: auto;
  height: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;

  @supports ((-o-object-fit: contain) or (object-fit: contain)) {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
  }
}

.Image--lazyLoad[data-sizes="auto"] {
  width: 100%; /* this is needed to help LazySizes calculate the correct size */
}
/**
 * ----------------------------------------------------------------------------
 * List
 * ----------------------------------------------------------------------------
 */

.Linklist {
  list-style: none;
  padding: 0;
}

@media(max-width:550px){
.Linklist {
  list-style: none;
  padding: 0;
  font-size:13px !important;
}
}

.Linklist__Item {
  position: relative;
  display: block;
  margin-bottom: 12px;
  width: 100%;
  line-height: 1.5;
  text-align: left;
  transition: all 0.2s ease-in-out;

  &:last-child {
    margin-bottom: 0 !important;
  }

  &::before {
    position: absolute;
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    top: calc(50% - 3px);
    left: 0;
    border-radius: 100%;
    background: $text-color;
    opacity: 0;
    transition: opacity 0.1s ease-in-out;
  }
}

.Linklist__Item > .Link {
  display: block;
  width: 100%;
  text-align: inherit;
}

.Linklist--spacingLoose .Linklist__Item {
  margin-bottom: 18px;
}

.Linklist__Item.is-selected {
  padding-left: 18px;

  &::before {
    opacity: 1;
    transition-delay: 0.1s;
  }
}

.Linklist--bordered {
  margin-left: 8px;
  padding: 0 20px 0 25px;
  border-left: 1px solid $border-color;
}

.Linklist--bordered li:first-child .Linklist__Item {
  margin-top: 2px;
}

.Linklist--bordered li:last-child .Linklist__Item {
  margin-bottom: 2px;
}
/**
 * Google map
 */

.FeaturedMap {
  max-width: 1150px;
  margin: 0 auto;
}

.FeaturedMap__MapContainer {
  position: relative;
  height: 240px;
  background-size: cover;
  background-position: center;
}

.FeaturedMap__GMap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.FeaturedMap__Info {
  position: relative;
  margin: 0 auto;
  background: $light-background;
  text-align: left;
  z-index: 1;

  @if $light-background == $background {
    padding: 0 0 40px 0;
  } @else {
    padding: 25px;
  }
}

.FeaturedMap__Store {
  display: block;
  margin-bottom: 1.2em;
  font-family: $heading-font-family;
  font-weight: $heading-font-weight;
  font-style: $heading-font-style;
}

.FeaturedMap__Address {
  margin-bottom: 1.2em;
}

.FeaturedMap__Location {
  margin-top: 2.7em;
}

@include av-mq('tablet-and-up') {
  .FeaturedMap {
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    padding-top: 0;
    height: 550px;
  }

  .FeaturedMap__MapContainer {
    flex: 1 0 auto;
    height: 100%;
  }

  .FeaturedMap__Info {
    flex: none;
    min-width: 370px;
    width: 370px;
    padding: 50px 60px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Anchor
 * ----------------------------------------------------------------------------
 */

.Anchor {
  display: block;
  position: relative;
  top: -75px;
  visibility: hidden;

  @supports (--css: variables) {
    top: calc(-1 * (var(--header-height))); /* + var(--announcement-bar-height)));*/
  }
}

/**
 * ----------------------------------------------------------------------------
 * Loading bar
 * ----------------------------------------------------------------------------
 */

.LoadingBar {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  opacity: 0;
  background: $heading-color;
  transition: width 0.25s ease-in-out;
  z-index: 50;
  pointer-events: none;
}

.LoadingBar.is-visible {
  opacity: 1;
}

@include av-mq('tablet-and-up') {
  .LoadingBar {
    height: 3px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Placeholder (used within the theme editor only)
 * ----------------------------------------------------------------------------
 */

.PlaceholderSvg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}

.PlaceholderSvg--dark {
  background: dimgray;
  fill: #a1a1a1;
}

.PlaceholderBackground {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  overflow: hidden;
  opacity: 0.7;
}

.PlaceholderBackground__Svg {
  height: 100% !important;
  width: auto !important;
  min-width: 100%;
}

/**
 * ----------------------------------------------------------------------------
 * Quantity selector
 * ----------------------------------------------------------------------------
 */

.QuantitySelector {
  display: inline-flex;
  align-items: center;
  border: 1px solid $border-color;
  white-space: nowrap;

  svg {
    width: 10px;
    height: 10px;
    stroke-width: 1.5px;
    vertical-align: -1px;
  }
}

.QuantitySelector__Button {
  display: inline-block;
  padding: 5px 9px; /* this allows to slightly increase the clickable area */
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.QuantitySelector__CurrentQuantity {
  display: inline-block;
  width: 20px;
  padding: 0;
  font-size: to-size(10px);
  text-align: center;
  letter-spacing: normal;
  background: transparent;
  border: none;
}

.QuantitySelector--large {
  .QuantitySelector__CurrentQuantity {
    width: 35px;
    font-size: to-size(14px);
  }

  .QuantitySelector__Button {
    padding: 10px 20px;
  }

  svg {
    width: 11px;
    height: 11px;
  }
}

@include av-mq('tablet-and-up') {
  .QuantitySelector__Button {
    padding: 7px 14px 8px 14px;
  }

  .QuantitySelector__CurrentQuantity {
    font-size: to-size(12px);
  }
}


/**
 * ----------------------------------------------------------------------------
 * Product price
 * ----------------------------------------------------------------------------
 */

.Price {
  display: inline-block;
}

.Price--highlight {
  color: $product-sale-price-color;
}

.Price--compareAt {
  position: relative;
  margin-left: 10px;

  &::before {
    position: absolute;
    content: '';
    top: 50%;
    left: -0.4em;
    width: calc(100% + 0.8em);
    height: 1px;
    background: currentColor;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Color swatch
 * ----------------------------------------------------------------------------
 */

.ColorSwatch {
  position: relative;
  display: inline-block;
  height: 30px;
  width: 30px;
  vertical-align: top;
  cursor: pointer;
  background-size: cover;

  &::after {
    content: '';
    position: absolute;
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    top: -3px;
    left: -3px;
  }

  &:hover::after {
    border: 1px solid $border-color;
  }
}

@if $color-swatch-circle {
  .ColorSwatch,
  .ColorSwatch::after {
    border-radius: 100% !important;
  }
}

.ColorSwatch--small {
  width: 16px;
  height: 16px;
}

.ColorSwatch--large {
  width: 36px;
  height: 36px;
}

.ColorSwatch--white {
  outline: 1px solid $border-color;
  outline-offset: -1px;
}

.ColorSwatch.is-active::after,
.ColorSwatch__Radio:checked + .ColorSwatch::after {
  border: 1px solid currentColor !important;
}

.ColorSwatch__Radio {
  display: none;
}

.Collapsible .ColorSwatchList {
  padding-top: 4px;
  padding-bottom: 10px;
}

.Collapsible--autoExpand .ColorSwatchList {
  padding-top: 8px;
  padding-bottom: 12px;
}

/**
 * ----------------------------------------------------------------------------
 * Size swatch
 * ----------------------------------------------------------------------------
 */

.SizeSwatch {
  display: inline-block;
  text-align: center;
  min-width: 36px;
  padding: 6px 10px;
  border: 1px solid $border-color;
  color: $text-color-light;
  cursor: pointer;
}

.SizeSwatch__Radio {
  display: none;
}

.SizeSwatch.is-active::after,
.SizeSwatch__Radio:checked + .SizeSwatch {
  border-color: $text-color;
  color: $text-color;
}

/**
 * ----------------------------------------------------------------------------
 * Alerts
 * ----------------------------------------------------------------------------
 */

.Alert {
  display: block;
  padding: 10px 20px;
  white-space: normal;
  font-size: 1rem;
  word-break: break-all;
  word-break: break-word;
  text-shadow: none;
}

.Alert--large {
  padding: 18px 20px;
}

.Alert--error {
  background: #e4c4c4;
  color: #cb2b2b;
}

.Alert--success {
  background: #d2e4c4;
  color: #307a07;
}

.Alert__ErrorList {
  list-style: none;
}

@include av-mq('tablet-and-up') {
  .Alert--large {
    padding: 18px 30px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Segment
 * ----------------------------------------------------------------------------
 */

.Segment + .Segment {
  margin-top: 50px;
}

.Segment__Title {
  margin-bottom: 24px;
  padding-bottom: 10px;
  border-bottom: 1px solid $border-color;
  color: $text-color-light;
}

.Segment__Title--flexed {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.Segment__ActionList {
  margin-top: 16px;
}

.Segment__ActionItem {
  line-height: 1.4;
}

.Segment__ActionItem + .Segment__ActionItem {
  margin-left: 20px;
}

.Segment__ButtonWrapper {
  margin-top: 32px;
}

@include av-mq('tablet-and-up') {
  .Segment__Title {
    margin-bottom: 34px;
  }

  .Segment__ActionList {
    margin-top: 24px;
  }
}

@include av-mq('desk') {
  .Segment + .Segment {
    margin-top: 65px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Empty state
 * ----------------------------------------------------------------------------
 */

.EmptyState {
  margin: 140px 0;
  text-align: center;
}

.EmptyState__Action {
  display: inline-block;
  margin-top: 20px;
}

@include av-mq('tablet-and-up') {
  .EmptyState {
    margin: 200px 0;
  }
}

@include av-mq('desk') {
  .EmptyState {
    margin: 250px 0;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Spinner
 * ----------------------------------------------------------------------------
 */

@-webkit-keyframes bouncingSpinnerAnimation {
  0%, 80%, 100% {
    transform: scale(0);
  }

  40% {
    transform: scale(1.0);
  }
}

@keyframes bouncingSpinnerAnimation {
  0%, 80%, 100% {
    transform: scale(0);
  }

  40% {
    transform: scale(1.0);
  }
}

.BouncingSpinner {
  display: block;
  text-align: center;
}

.BouncingSpinner > span {
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: currentColor;
  border-radius: 100%;
  -webkit-animation: bouncingSpinnerAnimation 1.4s infinite ease-in-out both;
  animation: bouncingSpinnerAnimation 1.4s infinite ease-in-out both;
}

.BouncingSpinner > span:first-child {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.BouncingSpinner > span:nth-child(2) {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

/**
 * ----------------------------------------------------------------------------
 * Video
 * ----------------------------------------------------------------------------
 */

.Video__PlayButton {
  display: inline-block;
  transition: transform 0.2s ease-in-out;
  height: 80px;
  width: 80px;
  cursor: pointer;
  -webkit-filter: drop-shadow(0 2px 2px rgba(#000000, 0.2));
  filter: drop-shadow(0 2px 2px rgba(#000000, 0.2));

  @media (-moz-touch-enabled: 0), (hover: hover) {
    &:hover {
      transform: scale(1.1);
    }
  }
}

.Video__PlayButton svg {
  width: 80px;
  height: 80px;
  pointer-events: none;
}

.VideoWrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.VideoWrapper iframe,
.VideoWrapper object,
.VideoWrapper embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/**
 * ----------------------------------------------------------------------------
 * Announcement bar
 * ----------------------------------------------------------------------------
 */

.AnnouncementBar {
  position: relative;
  text-align: center;
  font-size: to-size(10px);
  z-index: 1;
}

.AnnouncementBar__Wrapper {
  padding: 12px 15px;
}

.AnnouncementBar__Content {
  color: inherit;
  margin: 0;
}

@include av-mq('tablet-and-up') {
  .AnnouncementBar {
    font-size: to-size(11px);
  }
}

/**
 * ----------------------------------------------------------------------------
 * Share buttons
 * ----------------------------------------------------------------------------
 */

.ShareButtons {
  display: table;
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
}

.ShareButtons__Item {
  display: table-cell;
  width: 60px;
  height: 45px;
  min-height: 45px;
  color: $text-color-light;
  text-align: center;
  vertical-align: middle;
  background: $background;
  border: 1px solid $border-color;
  outline: 1px solid transparent;
  outline-offset: -1px;
  transition: all 0.2s ease-in-out;

  svg {
    height: 18px;
    width: 18px;
    vertical-align: text-bottom;
  }
}

.ShareButtons__Item--facebook:hover,
.no-supports-hover .ShareButtons__Item--facebook {
  background: #4469af;
  color: #ffffff;
  border-color: #4469af;
  outline: 1.5px solid #4469af;
}

.ShareButtons__Item--pinterest:hover,
.no-supports-hover .ShareButtons__Item--pinterest {
  background: #c8232c;
  color: #ffffff;
  border-color: #c8232c;
  outline: 1.5px solid #c8232c;
}

.ShareButtons__Item--twitter:hover,
.no-supports-hover .ShareButtons__Item--twitter {
  background: #00aced;
  color: #ffffff;
  border-color: #00aced;
  outline: 1.5px solid #00aced;
}

@include av-mq('tablet-and-up') {
  .ShareButtons {
    width: auto;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Featured quote
 * ----------------------------------------------------------------------------
 */

.FeaturedQuote {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 120px 40px;
  background: $secondary-elements-background;
  color: $secondary-elements-text-color;
  font-size: to-size(18px);
}

.FeaturedQuote__Author {
  margin-top: 14px;
  font-size: to-size(14px);
  opacity: 0.5;
}

@include av-mq('lap-and-up') {
  .FeaturedQuote {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Shopify CAPTCHA
 * ----------------------------------------------------------------------------
 */

.shopify-challenge__container {
  margin-top: 80px;
  margin-bottom: 80px;
  text-align: center;
}

.shopify-challenge__container .shopify-challenge__button {
  position: relative;
  display: inline-block;
  padding: 14px 28px;
  line-height: normal;
  border: 1px solid transparent;
  border-radius: 0;
  text-transform: uppercase;
  font-size: to-size(12px);
  text-align: center;
  letter-spacing: 0.2em;
  font-family: $heading-font-family;
  font-weight: $heading-font-weight;
  font-style: $heading-font-style;
  background: $button-background;
  color: $button-text-color;
}


/**
 * ----------------------------------------------------------------------------
 * Newsletter (home page)
 * ----------------------------------------------------------------------------
 */

.ImageHero--newsletter .SectionHeader.SectionHeader {
  margin-bottom: 30px;
}

.Newsletter .Form__Input::-webkit-input-placeholder {
  color: inherit;
}

.Newsletter .Form__Input::-moz-placeholder {
  color: inherit;
}

.Newsletter .Form__Input:-ms-input-placeholder {
  color: inherit;
}

.Newsletter .Form__Input::-ms-input-placeholder {
  color: inherit;
}

.Newsletter .Form__Input::placeholder {
  color: inherit;
}

.Newsletter .Form__Input:focus {
  border-color: currentColor;
}

.Newsletter .Form__Submit {
  width: 100%;
}

@include av-mq('phone') {
  .ImageHero--newsletter {
    min-height: 450px !important;
  }

  .ImageHero--newsletter .ImageHero__ContentOverlay {
    padding-left: 25px;
    padding-right: 25px;
  }
}

@include av-mq('tablet-and-up') {
  .Newsletter__Inner {
    display: flex;
  }

  .Newsletter .Form__Input {
    min-width: 395px;
    width: 395px;
  }

  .Newsletter .Form__Submit {
    margin: 0 0 0 20px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * TOOLTIP
 * ----------------------------------------------------------------------------
 */

@media (-moz-touch-enabled: 0), (hover: hover) {
  [data-tooltip] {
    position: relative;

    &::before {
      position: absolute;
      content: attr(data-tooltip);
      bottom: 70%;
      left: 70%;
      padding: 4px 11px 3px 11px;
      white-space: nowrap;
      border: 1px solid $border-color;
      background: $light-background;
      color: $text-color-light;
      font-size: to-size(13px);
      pointer-events: none;
      visibility: hidden;
      opacity: 0;
      transition: visibility 0.2s ease-in-out, opacity 0.2s ease-in-out;
      z-index: 1;
    }

    &:hover::before {
      opacity: 1;
      visibility: visible;
    }
  }
}
.Modal {
  position: fixed;
  display: flex;
  flex-direction: column;
  visibility: hidden;
  top: 50%;
  left: 50%;
  width: 480px;
  max-width: calc(100vw - 40px);
  max-height: calc(100vh - 40px);
  padding: 15px 20px 20px 20px;
  z-index: 20;
  opacity: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background: $background;
  transform: translate(-50%, -50%);
  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;

  @supports (--css: variables) {
    max-height: calc(var(--window-height) - 40px);
  }
}

.Modal[aria-hidden="false"] {
  visibility: visible;
  opacity: 1;
}

.Modal--dark {
  background: $secondary-elements-background;
  color: $secondary-elements-text-color;

  .Rte h1,
  .Rte h2,
  .Rte h3,
  .Rte h4,
  .Rte h5,
  .Rte h6 {
    color: $secondary-elements-text-color;
  }
}

.Modal--fullScreen {
  max-width: none;
  max-height: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  transform: none;
}

.Modal--pageContent {
  padding: 60px 0 50px 0;
}

.Modal--videoContent {
  justify-content: center;
  background: #000000; /* Full theatre experience ! */
  color: #ffffff;
}

.Modal .Heading:not(.Link) {
  color: inherit;
}

.Modal__Header {
  margin-bottom: 30px;
  text-align: center;
}

.Modal__Close {
  display: block;
  margin: 25px auto 0 auto;
  flex-shrink: 0;
}

.Modal__Close--outside {
  position: absolute;
  margin-top: 0;
  top: 20px;
  right: 20px;
  line-height: 0;
  opacity: 0.5;
  transition: opacity 0.2s ease-in-out;

  &:hover {
    opacity: 1;
  }

  svg {
    height: 16px;
    width: 16px;
    stroke-width: 1.25px;
  }
}

.Modal--fullScreen .Modal__Close--outside {
  right: 40px;
  top: 40px;
}

.Modal__Content iframe {
  display: none;
}

.Modal[aria-hidden="false"] .Modal__Content iframe {
  display: block;
}

/* We override some styles for common elements like table */

.Modal__Content {
  th,
  td {
    border-color: $secondary-elements-border-color !important;
  }

  thead th:empty,
  tbody th {
    background: $secondary-elements-background !important;
  }
}

@include av-mq('tablet-and-up') {
  .Modal:not(.Modal--pageContent) {
    padding: 35px 40px 40px 40px;
  }
}

@include av-mq('lap-and-up') {
  .Modal {
    flex-direction: column;
  }

  .Modal--pageContent {
    padding: 100px 0 80px 0;
  }

  .Modal--pageContent .Modal__Content {
    flex: 1 0 0;
  }

  .Modal__Close:not(.Modal__Close--outside) {
    margin-top: 40px;
    flex-shrink: 0;
  }
}
/**
 * ----------------------------------------------------------------------------
 * A11Y
 * ----------------------------------------------------------------------------
 */

.PageSkipLink:focus {
  clip: auto;
  width: auto;
  height: auto;
  margin: 0;
  color: $text-color;
  background-color: $background;
  padding: 10px;
  z-index: 10000;
  transition: none;
}

/**
 * ----------------------------------------------------------------------------
 * Page overlay
 * ----------------------------------------------------------------------------
 */

.PageOverlay {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  z-index: 10;
  visibility: hidden;
  opacity: 0;
  background: #363636;
  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.PageOverlay.is-visible {
  opacity: 0.5;
  visibility: visible;
}

/**
 * ----------------------------------------------------------------------------
 * Page header
 * ----------------------------------------------------------------------------
 */

.PageHeader {
  position: relative;
  margin: 35px 0;
}

.PageHeader--withBackground {
  display: flex;
  margin: 0;
  width: 100%;
  min-height: 450px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-size: cover;
  color: #ffffff;
  overflow: hidden;
}

.PageHeader--withBackground .Heading,
.PageHeader--withBackground .Rte a:not(.Button) {
  color: #ffffff;
  -webkit-text-decoration-color: #ffffff;
  text-decoration-color: #ffffff;
}

.PageHeader__ImageWrapper {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center center;

  @supports (--css: variables) {
    top: calc(-1 * var(--announcement-bar-height, 0px) - var(--header-height, 0px) * var(--use-unsticky-header, 0));
    height: calc(100% + var(--announcement-bar-height, 0px) + var(--header-height, 0px) * var(--use-unsticky-header, 0));
  }
}

.PageHeader .SectionHeader__Heading,
.PageHeader .SectionHeader__Description {
  margin-top: 0 !important;
}

.PageHeader .Alert {
  margin-top: 22px;
}

.PageHeader__Back {
  display: inline-block;
  margin-bottom: 25px;

  svg {
    height: 9px;
    margin-right: 12px;
    vertical-align: initial;
  }
}

/* Double selector is just to increase specificity and avoid !important */

.PageHeader--withBackground .SectionHeader.SectionHeader {
  position: relative;
  padding: 60px 0 80px 0;

  @supports (--css: variables) {
    margin-top: calc(var(--header-height) * var(--header-is-transparent, 0));
  }
}

@include av-mq('phone') {
  .PageHeader .SectionHeader__Heading {
    margin-bottom: 10px;
  }
}

@include av-mq('tablet-and-up') {
  .PageHeader {
    margin: 50px 0;
  }

  .PageHeader--withBackground {
    min-height: 450px;
    margin-top: 0;
    margin-bottom: 0;

    @supports (--css: variables) {
      min-height: calc(380px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--small.PageHeader--withBackground {
    min-height: 420px;

    @supports (--css: variables) {
      min-height: calc(350px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--large.PageHeader--withBackground {
    min-height: 480px;

    @supports (--css: variables) {
      min-height: calc(410px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--withBackground .SectionHeader.SectionHeader {
    margin-top: 50px;
    padding: 40px 0;

    @supports (--css: variables) {
      margin-top: calc(var(--header-height) * var(--header-is-transparent, 0));
    }
  }
}

@include av-mq('desk') {
  .PageHeader--withBackground {
    min-height: 550px;

    @supports (--css: variables) {
      min-height: calc(450px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--small.PageHeader--withBackground {
    min-height: 500px;

    @supports (--css: variables) {
      min-height: calc(400px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--large.PageHeader--withBackground {
    min-height: 620px;

    @supports (--css: variables) {
      min-height: calc(520px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }
}

@media screen and (min-width: 1800px) {
  .PageHeader--withBackground {
    min-height: 650px;

    @supports (--css: variables) {
      min-height: calc(600px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--small.PageHeader--withBackground {
    min-height: 600px;

    @supports (--css: variables) {
      min-height: calc(550px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }

  .PageHeader--large.PageHeader--withBackground {
    min-height: 700px;

    @supports (--css: variables) {
      min-height: calc(650px + var(--header-height) * var(--header-is-transparent, 0));
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Page layout (to create two columns) and content
 * ----------------------------------------------------------------------------
 */

.PageLayout__Section:first-child {
  margin-bottom: 60px;
}

.PageLayout__Section--sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 75px;
  align-self: flex-start;

  @supports (--css: variables) {
    top: calc(var(--header-height) + 20px);
  }
}

@include av-mq('tablet-and-up') {
  .PageLayout {
    display: flex;
    flex-wrap: nowrap;
  }

  .PageLayout__Section {
    flex: 1 0 0;
  }

  .PageLayout__Section:first-child {
    margin-bottom: 0;
  }

  .PageLayout__Section--secondary {
    flex: 1 1 200px;
    max-width: 200px;
  }

  .PageLayout__Section + .PageLayout__Section {
    margin-left: 50px;
  }
}

@include av-mq('tablet') {
  .PageLayout--breakLap {
    display: block;
  }

  .PageLayout--breakLap .PageLayout__Section:first-child {
    margin-bottom: 60px;
  }

  .PageLayout--breakLap .PageLayout__Section + .PageLayout__Section {
    margin-left: 0;
    width: 100%;
  }
}

@include av-mq('lap-and-up') {
  .PageLayout__Section--secondary {
    flex-basis: 235px;
    max-width: 235px;
  }
}

@include av-mq('desk') {
  .PageLayout__Section + .PageLayout__Section {
    margin-left: 80px;
  }

  .PageLayout__Section--secondary {
    flex-basis: 290px;
    max-width: 290px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Page content
 * ----------------------------------------------------------------------------
 */

.PageContent {
  max-width: 1000px;
  margin: 35px auto;
}

.PageContent--fitScreen {
  display: flex;
  min-height: calc(100vh - 120px);
  align-items: center;

  @supports (--css: variables) {
    min-height: calc(var(--window-height) - var(--header-height) - var(--announcement-bar-height, 0px) - 120px); /* 120px is the margin */
  }
}

.PageContent--narrow {
  max-width: 65%;
}
@media(max-width:550px){
.PageContent--narrow {
  max-width: 680px;
	font-size:13px;
}
}

.PageContent--extraNarrow {
  max-width: 400px;
}

.PageHeader + .PageContent {
  margin-top: 0;
}

@include av-mq('tablet-and-up') {
  .PageContent {
    margin-bottom: 80px;
    margin-top: 80px;
  }

  .PageContent--fitScreen {
    min-height: calc(100vh - 160px);

    @supports (--css: variables) {
      min-height: calc(var(--window-height) - var(--header-height) - var(--announcement-bar-height, 0px) - 160px); /* 160px is the margin */
    }
  }
}
.Pagination {
  margin: 60px 0;
  text-align: center;
  font-family: $heading-font-family;
  font-weight: $heading-font-weight;
  font-style: $heading-font-style;
  font-size: to-size(12px);
  line-height: 1;
}

.Pagination__Nav {
  display: inline-block;
  list-style: none;
}

.Pagination__NavItem {
  display: inline-block;
  padding: 16px 20px;
  border-bottom: 1px solid $border-color;

  svg {
    width: 6px;
    height: 10px;
    vertical-align: -1px;
  }
}

.Pagination__NavItem.is-active {
  color: $text-color;
  border-bottom-color: $text-color;
  box-shadow: 0 -2px $text-color inset;
}

@include av-mq('tablet-and-up') {
  .Pagination {
    margin: 80px 0;
  }

  .Pagination__NavItem {
    padding-left: 28px;
    padding-right: 28px;
  }
}

@include av-mq('desk') {
  .Pagination {
    margin: 120px 0;
  }
}
.Panel {
  position: relative;
  border: 1px solid $border-color;
  padding: 60px 24px;
}

.Panel--withArrows {
  margin: 0 15px;
}

.Panel--flush {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.Panel__Title {
  position: absolute;
  top: 0;
  left: 50%;
  margin: 0;
  padding: 0 14px 0 18px;
  transform: translate(-50%, -50%);
  background: $background;
  white-space: nowrap;
}

.Panel .flickity-prev-next-button {
  top: calc(50% - (45px / 2));
}

.Panel .flickity-prev-next-button.next {
  right: calc(-45px / 2);
}

.Panel .flickity-prev-next-button.previous {
  left: calc(-45px / 2);
}

@include av-mq('tablet-and-up') {
  .Panel {
    padding-left: 50px;
    padding-right: 50px;
  }

  .Panel--withArrows {
    margin-left: 0;
    margin-right: 0;
  }
}
.Popover {
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  background: $light-background;
  z-index: 10;
  box-shadow: 0 -2px 10px rgba(#363636, 0.2);
  touch-action: manipulation;
  transform: translateY(100%);
  visibility: hidden;
  transition: all 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.Popover--secondary {
  background: $background;
}

.Popover[aria-hidden="false"] {
  transform: translateY(0);
  visibility: visible;
}

.Popover__Header {
  position: relative;
  padding: 13px 20px;
  border-bottom: 1px solid rgba($border-color, 0.4);
  text-align: center;
}

.Popover__Close {
  position: absolute;
  left: 20px;
  top: calc(50% - 7px);
  line-height: 0;

  svg {
    stroke-width: 1.1px;
  }
}

.Popover__ValueList {
  list-style: none;
  max-height: 385px;
  padding: 18px 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.Popover__Value {
  display: block;
  padding: 12px 20px;
  width: 100%;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: $text-color-light;
  text-align: center;
  transition: color 0.2s ease-in-out;

  &:focus {
    background: $background;
    outline: none;
  }
}

.Popover__Value.is-selected {
  color: $text-color;
}

.Popover__FooterHelp {
  width: 100%;
  padding: 18px 20px;
  text-align: center;
  border-top: 1px solid rgba($border-color, 0.4);
}

@include av-mq('lap-and-up') {
  .Popover {
    transform: none;
    width: auto;
    bottom: auto;
    left: auto;
    opacity: 0;
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;

    &::before {
      content: '';
      position: absolute;
      right: 40px;
      width: 10px;
      height: 10px;
      border-style: solid;
    }
  }

  .Popover--withMinWidth {
    min-width: 375px;
  }

  .Popover--positionBottom::before {
    bottom: 100%;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent $light-background transparent;
    -webkit-filter: drop-shadow(0 -2px 2px rgba(#363636, 0.2));
    filter: drop-shadow(0 -2px 2px rgba(#363636, 0.2));
  }

  .Popover--positionTop::before {
    top: 100%;
    border-width: 10px 10px 0 10px;
    border-color: $light-background transparent transparent transparent;
    -webkit-filter: drop-shadow(0 2px 2px rgba(#363636, 0.2));
    filter: drop-shadow(0 2px 2px rgba(#363636, 0.2));
  }

  .Popover--positionLeft::before {
    left: 100%;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent $light-background;
    -webkit-filter: drop-shadow(2px 0 2px rgba(#363636, 0.2));
    filter: drop-shadow(2px 0 2px rgba(#363636, 0.2));
  }

  .Popover--positionLeft.Popover--alignCenter::before {
    top: calc(50% - 10px);
  }

  .Popover--positionLeft.Popover--alignBottom::before {
    top: 15px;
  }

  .Popover--positionLeft.Popover--alignTop::before {
    bottom: 10px;
  }

  .Popover[aria-hidden="false"] {
    opacity: 1;
    transform: none;
  }

  .Popover__Header {
    display: none;
  }

  .Popover__Value {
    padding-left: 50px;
    padding-right: 50px;
    text-align: right;
  }

  .Popover--withMinWidth .Popover__Value {
    text-align: center;
  }
}
.Rte {
  word-break: break-word; /* Prevent long words to go outside the container */

  /* Simple, minimum clearfix added to every RTE text to avoid issue with float */
  &::after {
    content: '';
    display: block;
    clear: both;
  }

  iframe {
    max-width: 100%;
  }

  img {
    display: block;
    margin: 0 auto;
  }

  a:not(.Button) {
    color: $link-color;
    text-decoration: underline;
    -webkit-text-decoration-color: rgba($link-color, 0.6);
    text-decoration-color: rgba($link-color, 0.6);
    text-underline-position: under;
    transition: color 0.2s ease-in-out, -webkit-text-decoration-color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out, text-decoration-color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out, text-decoration-color 0.2s ease-in-out, -webkit-text-decoration-color 0.2s ease-in-out;

    &:hover {
      color: $text-color;
      -webkit-text-decoration-color: rgba($text-color, 0.6);
      text-decoration-color: rgba($text-color, 0.6);
    }
  }

  p:not(:last-child),
  ul:not(:last-child),
  ol:not(:last-child) {
    margin-bottom: 1.6em;
  }

  img,
  blockquote,
  .VideoWrapper,
  .Form {
    margin-top: 2.4em;
    margin-bottom: 5px;
  }

  ul, ol {
    margin-left: 30px;
    padding-left: 0;
    list-style-position: outside;
  }

  li {
    padding: 5px 0;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: $heading-font-family;
    font-weight: $heading-font-weight;
    font-style: $heading-font-style;
    color: $heading-color;
    transition: color 0.2s ease-in-out;

    @if $uppercase-heading {
      letter-spacing: 0.2em;
      text-transform: uppercase;
    }
  }

  h1 {
    @extend .u-h1;
    margin: 2.2em 0 0.8em;
  }

  h2 {
    @extend .u-h2;
    margin: 2.2em 0 0.9em;
  }

  h3 {
    @extend .u-h3;
    margin: 2.2em 0 1.2em;
  }

  h4 {
    @extend .u-h4;
    margin: 2.2em 0 1.4em;
  }

  h5 {
    @extend .u-h5;
    margin: 2.2em 0 1.6em;
  }

  h6 {
    @extend .u-h6;
    margin: 2.2em 0 1.8em;
  }

  blockquote {
    margin-left: 0;
    padding: 6px 0 6px 40px;
    font-size: 1.15em;
    line-height: 1.75;
    border-left: 3px solid rgba($border-color, 0.6);
  }

  table {
    @extend .Table;
  }

  p:last-child,
  blockquote:last-child,
  ul:last-child,
  ol:last-child,
  h1:last-child,
  h2:last-child,
  h3:last-child,
  h4:last-child,
  h5:last-child,
  h6:last-child {
    margin-bottom: 0;
  }
}

@include av-mq('lap-and-up') {
  .Rte {
    img,
    .VideoWrapper,
    .Form {
      margin-top: 3em;
      margin-bottom: 5px;
    }

    blockquote {
      margin-left: 40px;
    }
  }
}
.shopify-section--hidden {
  display: none;
}

.shopify-section--bordered + .shopify-section--bordered {
  border-top: 1px solid $border-color;
}

/* When a spacing is applied to a bordered section, as it is isolated, we use padding, otherwise margin */

.Section--spacingNormal {
  margin: 50px 0;
}

.Section--spacingLarge,
.Section--spacingExtraLarge {
  margin: 90px 0;
}

.shopify-section--bordered > .Section--spacingNormal {
  padding: 50px 0;
  margin-top: 0;
  margin-bottom: 0;
}

.shopify-section--bordered > .Section--spacingLarge,
.shopify-section--bordered > .Section--spacingExtraLarge {
  padding: 90px 0;
  margin-top: 0;
  margin-bottom: 0;
}

.SectionHeader:not(:only-child) {
  margin-bottom: 40px;
}

.SectionHeader--center {
  text-align: center;
}

/*
  This is just a hack to slightly increase the selector specificity. What this does is actually taking into account the line height (1.65)
  and removing the remaining amount in both direction (0.65 / 2 => 0.325) to have more easier and consistent alignments
*/

.SectionHeader__Heading.SectionHeader__Heading,
.SectionHeader__SubHeading.SectionHeader__SubHeading {
  margin-top: -0.325em;
  font-size:19px;
}

.SectionHeader__SubHeading + .SectionHeader__Heading,
.SectionHeader__SubHeading + .SectionHeader__TabList,
.SectionHeader__Description {
  margin-top: 16px;
}

.SectionHeader__Description {
  max-width: 100%;
}

.SectionHeader__Description a {
  text-decoration: underline;
  -webkit-text-decoration-color: currentColor;
  text-decoration-color: currentColor;
  text-underline-position: under;
}

.SectionHeader--center .SectionHeader__Description {
  margin-left: auto;
  margin-right: auto;
}

.SectionHeader__ButtonWrapper {
  margin-top: 20px;
}

.SectionHeader__IconHolder {
  margin-top: 30px;
}

/* The SectionFooter is usually use at the end of a given section to redirect somewhere else */
.SectionFooter {
  margin-top: 20px;
  text-align: center;
}

@include av-mq('tablet-and-up') {
  .SectionHeader__Heading--emphasize {
    font-size: to-size(22px);
  }
}

@include av-mq('lap-and-up') {
  .Section--spacingNormal {
    margin: 80px 0;
  }

  .Section--spacingLarge {
    margin: 120px 0;
  }

  .Section--spacingExtraLarge {
    margin: 145px 0;
  }

  .shopify-section--bordered > .Section--spacingNormal {
    padding: 60px 0;
  }

  .shopify-section--bordered > .Section--spacingLarge {
    padding: 120px 0;
  }

  .shopify-section--bordered > .Section--spacingExtraLarge {
    padding: 145px 0;
  }

  .SectionHeader:not(:only-child) {
    margin-bottom: 70px;
  }

  .SectionHeader__Description {
    margin-top: 24px;
  }

  .SectionHeader__ButtonWrapper {
    margin-top: 30px;
  }

  .SectionFooter {
    margin-top: 35px;
  }
}
.TableWrapper {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.Table {
  width: 100%;
  font-size: to-size(12px);
  border-collapse: separate;
  white-space: nowrap;

  th,
  td {
    padding: 18px 10px;
    border-bottom: 1px solid $border-color;
    text-align: left;
  }

  th:first-child,
  td:first-child,
  tfoot td:empty + td {
    padding-left: 0;
  }

  th:last-child,
  td:last-child {
    padding-right: 0;
  }

  th {
    font-family: $heading-font-family;
    font-weight: $heading-font-weight;
    font-style: $heading-font-style;
    text-transform: uppercase;
    letter-spacing: 0.2em;
  }

  thead th:first-child:empty,
  tbody th:first-child {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    min-width: 40px;
    max-width: 100px;
    z-index: 1;
    background: $background;
    white-space: normal;
  }

  tbody th:first-child {
    border-right: 1px solid $border-color;
  }

  tfoot td:empty {
    border-bottom: none;
  }
}

.Table--large td {
  padding-top: 25px;
  padding-bottom: 25px;
}

.Table--noBorder tbody tr:not(:last-child) td {
  border-bottom: none;
}

@include av-mq('phone') {
  .TableWrapper {
    margin-right: -24px;
    margin-left: -24px;
  }

  .TableWrapper > .Table {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@include av-mq('desk') {
  .Table {
    white-space: normal;
  }

  .Table--large td {
    padding-top: 35px;
    padding-bottom: 35px;
  }
}


.TabList {
  white-space: nowrap;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.TabList__Item {
  position: relative;

  &::after {
    position: relative;
    display: block;
    content: '';
    bottom: 1px;
    left: 0;
    height: 1px;
    width: 0;
    background: $heading-color;
    transition: width 0.25s ease-in-out;
  }
}

.TabList__Item + .TabList__Item {
  margin-left: 28px;
}

.TabList__Item.is-active::after {
  @if $uppercase-heading {
    width: calc(100% - 0.2em);
  } @else {
    width: 100%;
  }
}

.TabPanel {
  display: none;
}

.TabPanel[aria-hidden="false"] {
  display: block;
}

@include av-mq('tablet-and-up') {
  .TabList__Item + .TabList__Item {
    margin-left: 45px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Layout override
 * ----------------------------------------------------------------------------
 */

.template-customers {
  .OrderAddresses .Grid__Cell + .Grid__Cell {
    margin-top: 50px;
  }
}
@include av-mq('tablet') {
  .template-customers {
    .OrderAddresses .Grid__Cell + .Grid__Cell {
      margin-top: 0;
    }
  }
}

@include av-mq('desk') {
  .template-customers {
    .OrderAddresses .Grid__Cell + .Grid__Cell {
      margin-top: 65px;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Addresses
 * ----------------------------------------------------------------------------
 */

.AddressList {
  margin-bottom: -40px;

  .Grid__Cell {
    margin-bottom: 40px;
  }
}

.AccountAddress span {
  display: inline-block;
  margin-bottom: 12px;
}

@include av-mq('phone') {
  .Modal--address {
    height: 100%;
    width: 100%;
    max-width: none;
    max-height: none;
  }

  .Modal--address .Modal__Header {
    margin-top: 35px;
  }
}

@include av-mq('tablet') {
  .OrderAddresses {
    width: 100%;
    max-width: none;
  }
}

@include av-mq('tablet-and-up') {
  .AddressList {
    margin-bottom: -60px;

    .Grid__Cell {
      margin-bottom: 60px;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Account table
 * ----------------------------------------------------------------------------
 */

.AccountTable th {
  padding-top: 0;
  padding-bottom: 10px;
  font-size: to-size(11px);
}

.AccountTable tfoot {
  font-size: to-size(14px);
}

.AccountTable tfoot span + span {
  padding-left: 18px;
}

.AccountTable .CartItem__PriceList {
  margin-bottom: 0;
}

@include av-mq('phone') {
  .AccountTable .CartItem__ImageWrapper {
    width: 70px;
    min-width: 70px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Article inner
 * ----------------------------------------------------------------------------
 */

.Article__ImageWrapper {
  overflow: hidden;
  height: 215px;
}

.Article__Image {
  position: relative;
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center;

  @supports (--css: variables) {
    height: calc(100% + var(--announcement-bar-height, 0px));
    top: calc(-1 * var(--announcement-bar-height, 0px));
  }
}

.Article__Wrapper {
  position: relative;
  max-width: 620px;
  margin: 0 auto 90px auto;
  padding: 24px 24px 0 24px;
  background: $background;
}

.Article__Header {
  margin-bottom: 35px;
}

.Article__Meta {
  margin-bottom: 18px;
}

.Article__MetaItem + .Article__MetaItem::before {
  position: relative;
  display: inline-block;
  content: '';
  height: 4px;
  width: 4px;
  border-radius: 100%;
  margin: 0 15px;
  font-size: to-size(10px);
  vertical-align: middle;
  background: currentColor;
}

.Article__Footer {
  margin-top: 45px;
}

.Article__ShareButtons {
  margin-top: 42px;
}

@include av-mq('tablet-and-up') {
  .Article__Wrapper {
    margin-bottom: 120px;
    padding: 40px 50px 0 50px;
  }

  .Article__ImageWrapper {
    height: 335px;
  }

  .Article__ImageWrapper + .Article__Wrapper {
    margin-top: -45px;
  }

  .Article__Header {
    margin-bottom: 45px;
  }

  .Article__Footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 65px;
  }

  .Article__ShareButtons {
    margin-top: 0;
  }
}

@include av-mq('lap-and-up') {
  .Article__Wrapper {
    max-width: 780px;
  }

  .Article__ImageWrapper {
    height: 450px;
  }

  .Article__ImageWrapper + .Article__Wrapper {
    margin-top: -70px;
  }
}

@include av-mq('desk') {
  .Article__ImageWrapper {
    height: 600px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Comments
 * ----------------------------------------------------------------------------
 */

.Article__CommentForm {
  margin-top: 40px;
}

.Article__Comments,
.Article__CommentFormWrapper {
  margin: 80px 0;
}

.Article__Comments .Pagination {
  margin-top: 40px;
}

.ArticleComment {
  margin-top: 35px;
}

.ArticleComment + .ArticleComment {
  padding-top: 35px;
  border-top: 1px solid $border-color;
}

.ArticleComment__Body {
  margin-bottom: 18px;
}

.ArticleComment__Date {
  margin-left: 15px;
}

@include av-mq('tablet-and-up') {
  .Article__Comments,
  .Article__CommentFormWrapper {
    margin: 105px 0;
  }

  .Article__Comments .Pagination {
    margin-top: 80px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Toolbar
 * ----------------------------------------------------------------------------
 */

.ArticleToolbar {
  position: fixed;
  display: flex;
  top: 0;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 15px 30px 16px 30px;
  background: $secondary-elements-background;
  color: $secondary-elements-text-color;
  z-index: 2;
  pointer-events: none;
  transform: translateY(-100%);
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;

  @supports (--css: variables) {
    top: calc(var(--use-sticky-header, 0) * var(--header-height));
  }
}

.ArticleToolbar.is-visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.ArticleToolbar .Link:hover {
  color: $secondary-elements-text-color;
}

.ArticleToolbar .Text--subdued {
  color: $secondary-elements-text-color-light;
}

.ArticleToolbar__ArticleTitle {
  position: relative;
  display: inline-flex;
  max-width: 285px;
  width: 285px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: clip;
  color: $secondary-elements-text-color;

  &::after {
    content: '';
    position: absolute;
    background: linear-gradient(to right, rgba($secondary-elements-background, 0.1), rgba($secondary-elements-background, 1));
    right: 0;
    top: 0;
    height: 100%;
    width: 35px;
  }
}

.ArticleToolbar__ShareList {
  display: inline-block;
}

.ArticleToolbar__ShareList .HorizontalList {
  display: inline-block;
  margin-left: 20px;
}

.ArticleToolbar__Nav {
  display: inline-block;
  margin-left: 50px;

  svg {
    color: $secondary-elements-text-color;
  }
}

.ArticleToolbar__NavItemSeparator {
  display: inline-block;
  position: relative;
  content: '';
  width: 1px;
  height: 12px;
  margin: 0 18px;
  background: rgba($secondary-elements-text-color-light, 0.6);
  vertical-align: middle;
}

.ArticleToolbar__NavItem svg {
  vertical-align: -1px;
}

.ArticleToolbar__NavItem--prev svg {
  margin-right: 6px;
}

.ArticleToolbar__NavItem--next svg {
  margin-left: 6px;
}

@include av-mq('lap-and-up') {
  .ArticleToolbar__ArticleTitle {
    max-width: 400px;
    width: 400px;
  }
}

@include av-mq('desk') {
  .ArticleToolbar {
    padding-left: 50px;
    padding-right: 50px;
  }

  .ArticleToolbar__ArticleTitle {
    max-width: 550px;
    width: 550px;
  }

  .ArticleToolbar__Nav {
    margin-left: 100px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Article navigation
 * ----------------------------------------------------------------------------
 */

.ArticleNav {
  padding: 75px 0;
  background: $secondary-elements-background;
  color: $secondary-elements-text-color;
}

.ArticleNav .Heading {
  color: inherit;
}

.ArticleNav__Item {
  display: block;
}

.ArticleNav__Image {
  height: 350px;
  background-size: cover;
  background-position: center;
}

@include av-mq('phone') {
  .ArticleNav .Grid__Cell + .Grid__Cell {
    margin-top: 50px;
  }
}

@include av-mq('tablet-and-up') {
  .ArticleNav {
    padding: 140px 0;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Article item
 * ----------------------------------------------------------------------------
 */

.ArticleListWrapper {
  max-width: 1260px;
  margin: 0 auto 60px auto;
}

.ArticleList {
  margin-bottom: -60px;
}

.ArticleList .Grid__Cell {
  margin-bottom: 60px;
}

@if $show-element-staggering {
  .js .ArticleItem {
    visibility: hidden;
  }
}

.ArticleItem__ImageWrapper {
  display: block;
  margin-bottom: 22px;
  background-size: cover;
  overflow: hidden;
}

.ArticleItem__Image {
  display: block;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  font-family: 'object-fit: cover; object-position: center;';

  @if $show-image-zooming {
    transform: scale(1);
    transition: opacity 0.3s ease, transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
}

@if $show-image-zooming {
  .ArticleList .ImageHero__ImageWrapper {
    transition: transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }

  @media (-moz-touch-enabled: 0), (hover: hover) {
    .ArticleItem:hover .ArticleItem__Image,
    .ArticleList .ImageHero:hover .ImageHero__ImageWrapper {
      transform: scale(1.2);
    }
  }
}

.ArticleItem__Content {
  margin: 0 8px;
}

.ArticleItem__Category {
  display: block;
  margin-bottom: 16px;
}

.ArticleItem__Excerpt {
  margin-bottom: 20px;
}

@include av-mq('tablet-and-up') {
  .ArticleList--withFeatured .Grid__Cell:first-child {
    margin-bottom: 40px;
  }

  .ArticleItem__Content {
    margin: 0 18px;
  }
}

@include av-mq('lap-and-up') {
  .ArticleListWrapper {
    margin-bottom: 100px;
  }

  .ArticleList {
    margin-bottom: -100px;
  }

  .ArticleList .Grid__Cell {
    margin-bottom: 100px;
  }

  .ArticleList--withFeatured .Grid__Cell:first-child {
    margin-bottom: 60px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Blog
 * ----------------------------------------------------------------------------
 */

.Blog__RssLink {
  margin-left: 14px;
  vertical-align: baseline;

  svg {
    width: 10px;
    height: 10px;
  }
}

.Blog__TagList {
  padding-top: 8px;
}

.Blog__TagList .Link.is-active::after {
  display: block;
  content: '';
  width: calc(100% - 0.15em);
  height: 1px;
  background: currentColor;
}

@include av-mq('phone') {
  .Blog__TagList .HorizontalList__Item {
    margin: 5px 10px;
  }
}

@include av-mq('tablet-and-up') {
  .ArticleList + .Pagination {
    margin-top: 80px;
  }
}

@include av-mq('desk') {
  #shopify-section-blog-template + #shopify-section-shop-now {
    margin-top: 150px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * General
 * ----------------------------------------------------------------------------
 */

@-webkit-keyframes cartEmptyOpening {
  from {
    transform: translate(-50%, calc(-50% + 35px));
    opacity: 0;
  }

  to {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
}

@keyframes cartEmptyOpening {
  from {
    transform: translate(-50%, calc(-50% + 35px));
    opacity: 0;
  }

  to {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
}

.Cart__ShippingNotice {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  margin-bottom: 0;
  padding-top: 9px;
  padding-bottom: 9px;
  font-size: to-size(11px);
  border-bottom: 1px solid $border-color;
  line-height: normal;
  z-index: 1;
  background: $background;
}

.Cart__Empty {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  -webkit-animation: cartEmptyOpening 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  animation: cartEmptyOpening 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@include av-mq('tablet-and-up') {
  .Cart__ShippingNotice {
    font-size: to-size(13px);
  }
}

/**
 * ----------------------------------------------------------------------------
 * Items
 * ----------------------------------------------------------------------------
 */

.CartItemWrapper {
  overflow: hidden;
}

.CartItem {
  display: table;
  table-layout: fixed;
  margin: 30px 0;
  width: 100%;
}

.CartItem__ImageWrapper,
.CartItem__Info {
  display: table-cell;
  vertical-align: middle;
}

.CartItem__ImageWrapper {
  width: 90px;
  min-width: 90px;
  text-align: center;
}

.CartItem__Info {
  padding-left: 25px;
}

.CartItem__Title {
  width: 100%;
  font-size: to-size(11px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.CartItem__Title,
.CartItem__Variant,
.CartItem__PropertyList {
  margin-bottom: 0.45em;
}

.CartItem__Meta,
.CartItem__LinePriceList,
.CartItem__DiscountList {
  font-size: to-size(9px);
}

.CartItem__PropertyList {
  list-style: none;
  font-style: italic;
}

.CartItem__DiscountList {
  list-style: none;
}

.CartItem__Discount {
  display: inline-block;
  margin-top: 6px;
  padding: 4px 8px;
  background: rgba($product-sale-price-color, 0.1);
  color: $product-sale-price-color;

  svg {
    margin-right: 4px;
    vertical-align: text-bottom;
  }
}

.CartItem__Discount + .CartItem__Discount {
  margin-top: 4px;
}

.CartItem__Actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.CartItem__PriceList {
  margin-bottom: 16px;
}

.CartItem__Remove {
  margin: 8px 0;
  font-size: to-size(8px);

  &::before {
    background: lighten($text-color-light, 15%);
  }
}

@include av-mq('tablet-and-up') {
  .CartItem__ImageWrapper {
    width: 120px;
  }

  .CartItem__Title {
    font-size: to-size(12px);
  }

  .CartItem__Meta,
  .CartItem__LinePriceList {
    font-size: to-size(11px);
  }

  .CartItem__Remove {
    font-size: to-size(9px);
  }

  .CartItem__PriceList {
    margin-bottom: 20px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Bottom
 * ----------------------------------------------------------------------------
 */

.Cart .Drawer__Footer,
.Cart__OffscreenNoteContainer {
  padding: 14px 24px 24px 24px;
}

.Cart__Checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
}

.Cart__OffscreenNoteContainer {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 1;
  background: $background;
  border-top: 1px solid $border-color;
  transform: translateY(100%);
  transition: transform 0.25s ease-in-out;
}

.Cart__OffscreenNoteContainer[aria-hidden="false"] {
  transform: translateY(0);
  box-shadow: 1px 0 6px rgba(#363636, 0.2);
}

.Cart__Note {
  margin-top: 10px;
}

.Cart__Taxes {
  margin-bottom: 8px;
}

.Cart__Discount svg {
  margin-right: 8px;
  vertical-align: sub;
}

.has-note-open[aria-hidden="false"] .Drawer__Header,
.has-note-open[aria-hidden="false"] .Drawer__Main {
  opacity: 0.4;
  pointer-events: none;
  transition: opacity 0.5s ease;
}

@include av-mq('tablet-and-up') {
  .Cart .Drawer__Footer,
  .Cart__OffscreenNoteContainer {
    padding: 20px 30px 30px 30px;
  }

  .Cart__NoteButton + .Cart__Taxes {
    margin-top: 4px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Adjustments for dedicated cart page
 * ----------------------------------------------------------------------------
 */

.Cart--expanded {
  .Cart__Footer {
    padding-top: 25px;
    border-top: 1px solid $border-color;
  }

  .Cart__Recap {
    text-align: right;
  }

  .Cart__Recap,
  .Cart__Recap .Cart__Checkout {
    margin-top: 16px;
  }

  .Cart__Checkout {
    margin-left: auto;
  }
}

@include av-mq('phone') {
  .CartItem__Info ~ .CartItem__Actions,
  .CartItem__Info ~ .CartItem__LinePriceList {
    display: none;
  }
}

@include av-mq('tablet-and-up') {
  .Cart--expanded {
    .Cart__ItemList {
      display: table;
      table-layout: auto;
      border-spacing: 0 30px;
      width: 100%;
    }

    .Cart__Head {
      display: table-header-group;
    }

    .Cart__HeadItem {
      display: table-cell;
      padding-bottom: 10px;
      border-bottom: 1px solid $border-color;
    }

    .CartItem {
      display: table-row;
    }

    .CartItem__Info {
      max-width: 300px;
      width: 300px;
    }

    .CartItem__Info > .CartItem__Actions {
      display: none;
    }

    .CartItem__Info ~ .CartItem__Actions,
    .CartItem__Info ~ .CartItem__LinePriceList {
      display: table-cell;
      vertical-align: middle;
    }

    .CartItem__QuantitySelector {
      margin-bottom: 6px;
    }

    .Cart__Footer {
      display: table;
      width: 100%;
      table-layout: fixed;
    }

    .Cart__Recap,
    .Cart__NoteContainer {
      display: table-cell;
    }

    .Cart__NoteContainer {
      width: 340px;
    }

    .Cart__Checkout {
      width: auto;
    }
  }
}

@include av-mq('desk') {
  .Cart--expanded {
    .CartItem__Info {
      max-width: 425px;
      width: 425px;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Shipping estimator
 * ----------------------------------------------------------------------------
 */

.ShippingEstimator__Results {
  height: 0;
  overflow: hidden;
  transition: height 0.25s ease-in-out;
}

.ShippingEstimator__Error,
.ShippingEstimator__ResultsInner {
  margin-top: 32px;
}

.ShippingEstimator__Results p {
  margin-bottom: 0.5em;
}

@include av-mq('phone') {
  .ShippingEstimator__Submit {
    width: 100%;
  }

  .ShippingEstimator__Country,
  .ShippingEstimator__Province,
  .ShippingEstimator__Zip {
    margin-bottom: 20px;
  }
}

@include av-mq('tablet-and-up') {
  .ShippingEstimator__Form {
    display: flex;
  }

  .ShippingEstimator__Form > *:not(:first-child) {
    margin-left: 20px;
  }

  .ShippingEstimator__Country,
  .ShippingEstimator__Province {
    margin-bottom: 0;
  }

  .ShippingEstimator__Zip {
    margin-bottom: 0;
    max-width: 130px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Collection item (for list of collections)
 * ----------------------------------------------------------------------------
 */

.CollectionList::after {
  content: 'flickity';
  display: none;
}

.CollectionItem__Wrapper {
  position: relative;
  height: 500px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}

.CollectionItem__Wrapper--small {
  height: 450px;
}

.CollectionItem__Wrapper--large {
  height: 550px;
}

.CollectionItem__ImageWrapper {
  background-size: cover;
  background-position: center;
  height: 100%;
  width: 100%;

  @if $show-image-zooming {
    transform: scale(1);
    transition: transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
}

.CollectionItem__Image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}

.CollectionItem__Content {
  position: absolute;
  padding: 0 24px;
  margin-bottom: 0 !important;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  text-align: left;
}

.CollectionItem__Content--bottomCenter,
.CollectionItem__Content--middleCenter {
  text-align: center;
}

.CollectionItem__Content--bottomRight,
.CollectionItem__Content--middleRight {
  text-align: right;
}

.CollectionItem__Content--bottomLeft,
.CollectionItem__Content--bottomRight,
.CollectionItem__Content--bottomCenter {
  bottom: 24px;
  top: auto;
  left: 0;
  transform: none;
}

@if $show-image-zooming {
  @media (-moz-touch-enabled: 0), (hover: hover) {
    .CollectionItem:hover .CollectionItem__ImageWrapper {
      transform: scale(1.2);
    }
  }
}

@include av-mq('phone') {
  .CollectionList--grid {
    margin: -12px 12px 12px 12px;
  }

  .CollectionList--grid .CollectionItem {
    padding: 12px;
  }
}

@include av-mq('tablet-and-up') {
  .CollectionList {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0;

    &::after {
      content: ''; /* disable Flickity */
    }
  }

  .CollectionList--spaced {
    margin: 15px;
  }

  .CollectionList--spaced .CollectionItem {
    padding: 15px;
  }

  .CollectionList--grid.CollectionList--spaced {
    margin-top: -15px;
  }

  .CollectionItem {
    display: block !important;
    flex: 0 1 0;
    min-width: 50%;
  }

  .CollectionItem--expand {
    flex-grow: 1;
  }

  .CollectionItem__Content {
    padding: 0 40px;
  }

  .CollectionItem__Content--bottomLeft,
  .CollectionItem__Content--bottomRight,
  .CollectionItem__Content--bottomCenter {
    bottom: 40px;
  }
}

@include av-mq('desk') {
  .CollectionItem {
    min-width: 33.33333%;
  }

  .CollectionItem__Wrapper {
    height: 600px;
  }

  .CollectionItem__Wrapper--small {
    height: 500px;
  }

  .CollectionItem__Wrapper--large {
    height: 700px;
  }

  .CollectionItem__Content {
    padding: 0 50px;
  }

  .CollectionItem__Content--bottomLeft,
  .CollectionItem__Content--bottomRight,
  .CollectionItem__Content--bottomCenter {
    bottom: 50px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Collection toolbar
 * ----------------------------------------------------------------------------
 */

.CollectionToolbar {
  position: -webkit-sticky;
  position: sticky;
  display: flex;
  justify-content: space-between;
  width: 100%;
  background: $background;
  box-shadow: 1px 1px $border-color, -1px -1px $border-color;
  z-index: 2;
}

.CollectionToolbar--top {
  top: $header-base-height;

  @supports (--css: variables) {
    top: calc(var(--header-height) * var(--use-sticky-header, 0));
  }
}

.supports-sticky .CollectionToolbar--bottom {
  bottom: 0; /* as of today the best polyfill I've found does not support polyfilling sticky on bottom. As a consequence on those old
                browsers, the stickiness is always at the top */
}

.CollectionToolbar__Group {
  display: flex;
  flex: 1 0 auto;
}

.CollectionToolbar__Item {
  flex: 1 0 auto;
  padding: 13px 0;
  border-left: 1px solid $border-color;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  transition: background 0.2s ease-in-out;
}

.CollectionToolbar__Item--sort .Icon--select-arrow {
  height: 6px;
  margin-left: 2px;
  pointer-events: none;
}

.CollectionToolbar__Item--layout {
  flex: none;
  width: 95px;
  line-height: 1;
  cursor: initial;
}

.CollectionToolbar__LayoutType {
  margin: 0 6px;
  opacity: 0.2;
  transition: opacity 0.25s ease-in-out;

  svg {
    width: 18px;
    height: 18px;
  }
}

.CollectionToolbar__LayoutType.is-active {
  opacity: 1;
}

@include av-mq('phone') {
  .CollectionToolbar__Item:first-child {
    border-left: none;
  }
}

@include av-mq('tablet-and-up') {
  .CollectionToolbar--reverse,
  .CollectionToolbar__Group {
    flex-direction: row-reverse;
  }

  .CollectionToolbar__Group {
    flex: none;
  }

  .CollectionToolbar__Item {
    padding: 18px 0;
  }

  .CollectionToolbar__Group .CollectionToolbar__Item {
    padding-left: 45px;
    padding-right: 45px;
  }

  .CollectionToolbar__Item--layout {
    border-left: none;
    width: 115px;
    border-right: 1px solid $border-color;
    white-space: nowrap;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Collection filters
 * ----------------------------------------------------------------------------
 */

.CollectionFilters .Collapsible:first-child {
  border-top: none;
}

@include av-mq('tablet-and-up') {
  .CollectionFilters .Drawer__Main {
    padding-top: 35px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product item
 * ----------------------------------------------------------------------------
 */

.ProductItem {
  text-align: center;
  white-space: normal;
}

@if $show-element-staggering {
  .js .ProductList--grid .ProductItem {
    visibility: hidden;
  }
}

.ProductItem__Wrapper {
  position: relative;
}

.ProductItem__ImageWrapper {
  display: block;
}

.ProductItem__Image--alternate {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0 !important;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

.ProductItem__LabelList {
  position: absolute;
  left: 10px;
  top: 6px;
  text-align: left;
}

.ProductItem__Label {
  display: block;
  font-size: to-size(9px);
  margin: 4px 0;
  padding: 2px 6px;
  background: $background;
  max-width: -webkit-max-content;
  max-width: -moz-max-content;
  max-width: max-content;
}

.ProductItem__Info {
  margin-top: 20px;

  @if $uppercase-heading {
    font-size: to-size(11px);
  } @else {
    font-size: to-size(12px);
  }
}

.ProductItem__Info--left {
  text-align: left;
}

.ProductItem__Info--right {
  text-align: right;
}

.ProductItem__Vendor,
.ProductItem__Title {
  display: block;
  margin-bottom: 4px;
}

.ProductItem__ColorSwatchList {
  margin-top: 15px;
}

.ProductItem__ColorSwatchItem {
  display: inline-block;
  margin: 0 5px;
}

.ProductItem__ColorSwatchList + .ProductItem__PriceList {
  margin-top: 12px;
}

@media (-moz-touch-enabled: 0), (hover: hover) {
  @if $product-show-price-on-hover {
    .ProductItem__PriceList--showOnHover {
      opacity: 0;
      transform: translateY(10px);
      transition: all 0.35s ease-in-out;
    }

    .ProductItem:hover .ProductItem__PriceList--showOnHover {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .ProductItem__ImageWrapper--withAlternateImage:hover .ProductItem__Image {
    opacity: 0 !important;
  }

  .ProductItem__ImageWrapper--withAlternateImage:hover .ProductItem__Image--alternate {
    opacity: 1 !important;
  }
}

@media (-moz-touch-enabled: 1), (hover: none) {
  .ProductItem__Image--alternate {
    display: none; /* This prevents the image to be lazy-loaded */
  }
}

@include av-mq('tablet-and-up') {
  .ProductItem__Label {
    font-size: to-size(11px);
  }

  .ProductItem__Info {
    @if $uppercase-heading {
      font-size: to-size(11px);
    } @else {
      font-size: to-size(12px);
    }
  }
}

@include av-mq('lap-and-up') {
  .ProductItem--horizontal {
    display: flex;
    justify-content: space-between;
    align-items: center;

    .ProductItem__Wrapper {
      display: flex;
      align-items: center;
    }

    .ProductItem__ImageWrapper {
      min-width: 100px;
    }

    .ProductItem__Info {
      margin: 0 30px 0 40px;
      text-align: left;
    }

    .ProductItem__ViewButton {
      flex-shrink: 0;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product grid
 * ----------------------------------------------------------------------------
 */

.CollectionInner {
  margin-top: 24px;
}

.ProductList--grid {
  padding: 0 12px;
}

@include av-mq('phone') {
  .ProductList--grid {
    margin-left: -10px;
  }

  .ProductList--removeMargin {
    margin-bottom: -35px !important;
  }

  .ProductList--grid > .Grid__Cell {
    padding-left: 10px;
    margin-bottom: 35px;
  }
}

@include av-mq('tablet-and-up') {
  .CollectionInner {
    margin-top: 50px;
  }

  .ProductList--grid {
    padding: 0 24px;
    margin-left: -24px;
  }

  .ProductList--removeMargin {
    margin-bottom: -50px !important;
  }

  .ProductList--grid > .Grid__Cell {
    padding-left: 24px;
    margin-bottom: 50px;
  }
}

@include av-mq('lap-and-up') {
  .CollectionInner {
    display: flex;
  }

  .CollectionInner__Sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 200px;
    flex: none;
    align-self: flex-start;
    width: 200px;
    margin: 0 16px 0 24px;
    padding-bottom: 50px;

    @supports (--css: variables) {
      top: calc(var(--header-height) + 50px);
    }
  }

  @supports (--css: variables) {
    .CollectionInner__Sidebar--withTopToolbar {
      top: calc(var(--header-height) * var(--use-sticky-header, 0) + 105px);
    }
  }

  .CollectionInner__Products {
    flex: 1 0 0;
  }

  .CollectionInner__Sidebar .Collapsible {
    padding: 0;
  }
}

$horizontal-spacing-four-products-per-row: 0px;
$vertical-spacing-four-products-per-row  : 0px;

$horizontal-spacing-two-products-per-row: 0px;
$vertical-spacing-two-products-per-row  : 0px;

@if ($product-list-horizontal-spacing == 'extra_small') {
  $horizontal-spacing-four-products-per-row: 20px;
  $horizontal-spacing-two-products-per-row : 20px;
} @else if ($product-list-horizontal-spacing == 'small') {
  $horizontal-spacing-four-products-per-row: 40px;
  $horizontal-spacing-two-products-per-row : 40px;
} @else if ($product-list-horizontal-spacing == 'medium') {
  $horizontal-spacing-four-products-per-row: 60px;
  $horizontal-spacing-two-products-per-row : 60px;
} @else if ($product-list-horizontal-spacing == 'large') {
  $horizontal-spacing-four-products-per-row: 80px;
  $horizontal-spacing-two-products-per-row : 80px;
} @else if ($product-list-horizontal-spacing == 'extra_large') {
  $horizontal-spacing-four-products-per-row: 100px;
  $horizontal-spacing-two-products-per-row : 100px;
}

@if ($product-list-vertical-spacing == 'extra_small') {
  $vertical-spacing-four-products-per-row: 40px;
  $vertical-spacing-two-products-per-row : 50px;
} @else if ($product-list-vertical-spacing == 'small') {
  $vertical-spacing-four-products-per-row: 60px;
  $vertical-spacing-two-products-per-row : 75px;
} @else if ($product-list-vertical-spacing == 'medium') {
  $vertical-spacing-four-products-per-row: 80px;
  $vertical-spacing-two-products-per-row : 100px;
} @else if ($product-list-vertical-spacing == 'large') {
  $vertical-spacing-four-products-per-row: 100px;
  $vertical-spacing-two-products-per-row : 125px;
} @else if ($product-list-vertical-spacing == 'extra_large') {
  $vertical-spacing-four-products-per-row: 120px;
  $vertical-spacing-two-products-per-row : 150px;
}

@include av-mq('desk') {
  .CollectionInner__Sidebar {
    margin-right: 10px;
    margin-left: 50px;
  }

  .CollectionInner .Pagination {
    margin-bottom: 80px;
  }

  .ProductList--grid {
    padding: 0 50px;
  }

  .ProductList--grid[data-desktop-count="2"] {
    margin-left: -$horizontal-spacing-two-products-per-row;

    & > .Grid__Cell {
      padding-left: $horizontal-spacing-two-products-per-row;
      margin-bottom: $vertical-spacing-two-products-per-row;
    }
  }

  .ProductList--removeMargin[data-desktop-count="2"] {
    margin-bottom: -$vertical-spacing-two-products-per-row !important;
  }

  .ProductList--grid[data-desktop-count="4"],
  .ProductList--grid[data-desktop-count="3"] {
    margin-left: -$horizontal-spacing-four-products-per-row;

    & > .Grid__Cell {
      padding-left: $horizontal-spacing-four-products-per-row;
      margin-bottom: $vertical-spacing-four-products-per-row;
    }
  }

  .ProductList--removeMargin[data-desktop-count="4"],
  .ProductList--removeMargin[data-desktop-count="3"] {
    margin-bottom: -$vertical-spacing-four-products-per-row !important;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product carousel
 * ----------------------------------------------------------------------------
 */

.ProductList--carousel .Carousel__Cell {
  width: 62%;
  padding: 0 12px;
  vertical-align: top;
}

@include av-mq('phone') {
  .template-search .ProductList--grid,
  .template-collection .ProductList--grid {
    margin-bottom: 20px; /* hack, would require some better code */
  }
}

@include av-mq('pocket') {
  /* On phone and tablet we do not use the carousel but instead use a free scroll, which offers better performance */

  .ProductListWrapper {
    overflow: hidden;
  }

  .ProductList--carousel {
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 30px; /* This is a trick to hide the scrollbar on iOS */
    margin-bottom: -30px;
  }

  .ProductList--carousel .Carousel__Cell {
    display: inline-block !important;

    &:first-child {
      margin-left: 0%; /* This is (100% - 62%) / 2, where 62% is the width of a single cell */
    }

    &:last-child {
      margin-right: 19%; /* This is (100% - 62%) / 2, where 62% is the width of a single cell */
    }
  }
}

@include av-mq('tablet') {
  .ProductList--carousel .Carousel__Cell {
    width: 48%;
    padding: 0 15px;

    &:first-child {
      margin-left:0%; /* This is (100% - 48%) / 2, where 48% is the width of a single cell */
    }

    &:last-child {
      margin-right: 26%; /* This is (100% - 48%) / 2, where 48% is the width of a single cell */
    }
  }
}

@include av-mq('lap-and-up') {
  .ProductList--carousel {
    margin: 0 90px;

    &::after {
      content: 'flickity';
      display: none;
    }

    .Carousel__Cell {
      width: 33.3333%;
      left: 0;
      padding: 0 ($horizontal-spacing-four-products-per-row / 2);
      margin-left: 0;
    }

    .flickity-prev-next-button {
      top: calc(50% - 45px);
      width: 45px;
      height: 45px;
      stroke-width: 1px;
    }

    .flickity-prev-next-button.next {
      right: -50px;
    }

    .flickity-prev-next-button.previous {
      left: -50px;
    }
  }
}

@include av-mq('desk') {
  .ProductList--carousel .Carousel__Cell {
    width: 25%;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product shop now
 * ----------------------------------------------------------------------------
 */

.ProductList--shopNow {
  position: static;
}

.ProductList--shopNow .Carousel__Cell {
  padding: 0 60px;
}

@include av-mq('phone') {
  .ShopNowGrid .FeaturedQuote {
    margin: 50px -24px -90px -24px;
  }
}

@include av-mq('tablet') {
  .ShopNowGrid .FeaturedQuote {
    margin: 60px -50px -90px -50px;
  }
}

@include av-mq('tablet-and-up') {
  .ProductList--shopNow {
    padding: 0 50px;
    overflow: hidden;
  }

  .ProductList--shopNow .flickity-viewport {
    overflow: visible;
  }

  .ProductList--shopNow .Carousel__Cell {
    width: 50%;
    padding: 0 50px;
  }
}

@include av-mq('lap-and-up') {
  .ProductList--shopNow[data-desktop-count="3"] .Carousel__Cell {
    width: 33.333333%;
  }

  .ShopNowGrid {
    display: flex;
  }

  .ShopNowGrid .FeaturedQuote {
    height: 100%;
  }
}
.Faq__Section {
  margin-bottom: 20px;
}

.Faq__Section ~ .Faq__Section {
  margin-top: 34px;
}

.Faq__Item {
  position: relative;
  margin: 14px 0;
}

.Faq__Icon {
  position: absolute;
  top: 0;
  left: 0;
  color: $text-color-light;
  transition: all 0.3s ease-in-out;

  svg {
    width: 8px;
    height: 10px;
    vertical-align: baseline;
  }
}

.Faq__Item[aria-expanded="true"] .Faq__Icon {
  transform: rotateZ(90deg);
  color: $heading-color;
}

.Faq__ItemWrapper {
  padding-left: 26px;
}

.Faq__Question {
  display: block;
  width: 100%;
  margin-bottom: 0;
  text-align: left;
}

.Faq__AnswerWrapper {
  height: 0;
  overflow: hidden;
  visibility: hidden;
  transition: height 0.25s ease-in-out, visibility 0s ease-in-out 0.25s;
}

.Faq__Item[aria-expanded="true"] .Faq__AnswerWrapper {
  visibility: visible;
  transition: height 0.25s ease-in-out;
}

.Faq__Answer {
  padding: 16px 0 22px 0;
}

.Faq__Item--lastOfSection .Faq__Answer {
  padding-bottom: 0;
}

.FaqSummary {
  list-style: none;
  margin: 0;
  padding: 0;
}

.FaqSummary__Item {
  margin-bottom: 12px;
}

.FaqSummary__Item.is-active::after {
  width: 100%;
}

.FaqSummary__Link {
  display: block;
}

.FaqSummary__LinkLabel {
  position: relative;
  display: inline-block;

  &::after {
    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    transform: scale(0, 1);
    transform-origin: left center;
    background: currentColor;
    transition: transform 0.2s linear;
  }
}

.FaqSummary__Item.is-active .FaqSummary__LinkLabel::after {
  transform: scale(1, 1);
}

@include av-mq('tablet-and-up') {
  .Faq__Section {
    margin-bottom: 34px;
  }

  .Faq__Section ~ .Faq__Section {
    margin-top: 60px;
  }
}
/**
 * As of today this section is displayed on the home page only
 */

.FeatureText {
  text-align: center;
}

.FeatureText__ContentWrapper {
  padding-left: 24px;
  padding-right: 24px;
}

.FeatureText__ImageWrapper {
  overflow: hidden;
}

.FeatureText--withImage .FeatureText__ContentWrapper {
  padding-top: 50px;
  padding-bottom: 20px;
}

.FeatureText .SectionHeader__Description {
  margin-top: 25px;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .FeatureText--imageLeft {
    display: flex;
    flex-direction: column-reverse;
  }
}
.product-card__figure {
    position: relative;
    background: #fff;
}
@media screen and (min-width: 768px) {
  .featured-collections-carousel {
    display: grid;
    position: relative;
    padding: 20px 62px 0px 62px;
}
  .FeatureText__Content {
    max-width: 580px;
    margin: 0 auto;
  }

  .FeatureText--withImage {
    display: table;
    width: 100%;
    text-align: left;
    table-layout: fixed;

    .FeatureText__ContentWrapper,
    .FeatureText__ImageWrapper {
      display: table-cell;
      width: 50%;
      vertical-align: middle;
    }

    .FeatureText__ContentWrapper {
      padding: 15px;
    }
  }

  .FeatureText--imageRight {
    .FeatureText__ContentWrapper {
      padding-right: 40px;
    }

    .FeatureText__Content,
    .AspectRatio {
      margin-right: 0;
    }

    .AspectRatio {
      text-align: right;
    }
  }

  .FeatureText--imageLeft {
    .FeatureText__ContentWrapper {
      padding-left: 15px;
    }

    .FeatureText__Content,
    .AspectRatio {
      margin-left: 0;
    }

    .AspectRatio {
      text-align: left;
    }
  }
}

@include av-mq('desk') {
  .FeatureText--imageRight .FeatureText__ContentWrapper {
    padding-right: 100px;
  }

  .FeatureText--imageLeft .FeatureText__ContentWrapper {
    padding-left:15px;
  }
}
.shopify-section--bordered + .shopify-section--footer {
  border-top: 1px solid $footer-border-color;
}

.Footer {
  padding: 34px 0;
  background: $footer-background;
  color: $footer-text-color;
    background: -webkit-linear-gradient(to bottom, #180303, #030303);
    background: linear-gradient(to bottom, #180303, #030303);

  @if $footer-background == $background {
    border-top: 1px solid $border-color;
  }
}

.Footer--withMargin {
  margin-top: 60px;
}

.Footer .Heading,
.Footer .Link--primary:hover {
  color: $footer-heading-color;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::-webkit-input-placeholder {
  color: $footer-text-color;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::-moz-placeholder {
  color: $footer-text-color;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input:-ms-input-placeholder {
  color: $footer-text-color;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::-ms-input-placeholder {
  color: $footer-text-color;
}

.Footer .Link--secondary:hover,
.Footer .Form__Input::placeholder {
  color: $footer-text-color;
}

.Footer__Block {
  margin-top: 48px;

  &:first-child {
    margin-top: 0;
  }
}

.Footer__Title {
  margin-bottom: 20px;
}

.Footer__Social {
  margin-top: 5px;
}

.Footer__Content + .Footer__Newsletter {
  margin-top: 18px;
}

.Footer__Aside {
  text-align: center;
}

.Footer__Inner + .Footer__Aside {
  margin-top: 65px;
}

.Footer__ThemeAuthor {
  margin-top: 4px;
}

.Footer__PaymentList {
  margin: 54px -24px 0 -24px;
  padding-top: 28px;
  border-top: 1px solid $footer-border-color;
}

.Footer__PaymentList svg {
  opacity: 0.8;
  width: 38px;
  height: 24px;
}

@include av-mq('tablet-and-up') {
  .Footer {
    padding: 75px 0 42px 0;
  }

  .Footer--withMargin {
    margin-top: 80px;
  }

  .Footer__Inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: -40px;
    margin-right: -40px;
  }

  .Footer__Block {
    flex: 1 1 50%;
    margin-top: 0;
    margin-bottom: 50px;
    padding-left: 40px;
    padding-right: 40px;
  }

  .Footer__Social {
    margin-top: 14px;
  }

  .Footer__Aside {
    text-align: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .Footer__Inner + .Footer__Aside {
    margin-top: 80px;
  }

  .Footer__StoreName {
    font-size: to-size(11px);
  }

  .Footer__PaymentList {
    padding: 0;
    margin: 0 -8px;
    border: none;
  }
}

@include av-mq('desk') {
  .Footer--withMargin {
    margin-top: 120px;
  }

  .Footer__Inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .Footer--center .Footer__Inner {
    justify-content: center;
  }

  .Footer__Block {
    flex: 0 1 auto;
  }

  .Footer__Block--text,
  .Footer__Block--newsletter{
    flex-basis: 240px;
  }
}

@include av-mq('desk') {
  .Footer__Block--text {
    flex-basis: 460px;
  }

  .Footer__Block--newsletter {
    flex-basis: 375px;
  }
}
.GiftCard {
  text-align: center;
}

.GiftCard__Wrapper {
  position: relative;
  max-width: 400px;
  margin: 0 auto;
}

.GiftCard__Redeem {
  margin-bottom: 30px;
}

.GiftCard__IllustrationWrapper {
  position: relative;
  margin: 40px 0;
}

.GiftCard__CodeHolder {
  position: absolute;
  display: inline-block;
  margin: 0 auto;
  bottom: 20px;
  left: 50%;
  white-space: nowrap;
  padding: 12px 20px;
  background: #ffffff;
  border-radius: 3px;
  transform: translateX(-50%);
}

.GiftCard__QrCode {
  margin: 20px 0;
}

.GiftCard__QrCode img {
  margin: 0 auto;
}
/**
 * ----------------------------------------------------------------------------
 * Main header
 * ----------------------------------------------------------------------------
 */

.shopify-section--header {
  position: relative;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 5;
}

.Header .Heading,
.Header .Link--secondary,
.Header .Link--primary:hover {
  color: $header-heading-color;
}

.Header .Text--subdued,
.Header .Link--primary,
.Header .Link--secondary:hover {
  color: #fff;
}

.Header {
  background: $header-background;
  color: $header-heading-color;
  box-shadow: 0 -1px $header-border-color inset;
  transition: background 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.Header__Wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 18px;
}

.Header__Logo {
  position: relative;
  margin-bottom: 0;
}

.Header__LogoLink,
.Header__LogoImage {
  display: block;
}

.Header__LogoImage {
  margin: 0 auto;
  transition: opacity 0.3s ease-in-out;
}

.Header__LogoImage--transparent {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.Header__Icon {
  display: inline-block;
  line-height: 1;
  transition: color 0.2s ease-in-out;

  span {
    display: block;
  }
}

.Header__Icon + .Header__Icon {
  margin-left: 18px;
}

.supports-sticky .Search[aria-hidden="true"] + .Header--transparent {
  background: transparent;

  .Header__LogoImage--primary:not(:only-child) {
    opacity: 0;
  }

  .Header__LogoImage--transparent {
    opacity: 1;
  }

  .Header__Icon svg {
    -webkit-filter: drop-shadow(0 1px rgba(#000000,0.25));
    filter: drop-shadow(0 1px rgba(#000000,0.25));
  }

  .Header__Icon,
  .Header__CurrencySelector,
  .HorizontalList__Item > .Heading,
  .Header__LogoLink > .Heading,
  .Text--subdued {
    color: currentColor;
  }
}

.Header__Icon .Icon--nav {
  height: 14px;
  width: 20px;
}

.Header__Icon .Icon--cart {
  width: 17px;
  height: 20px;
}

.Header__Icon .Icon--search {
  position: relative;
  top: 1px; /* for pixel perfect */
  width: 18px;
  height: 17px;
}

.Header__FlexItem {
  display: flex;
}

.Header__FlexItem--fill {
  flex: 1 0 0;
  align-items: center;

  &:last-child {
    justify-content: flex-end;
  }
}

.Header__CartDot {
  position: absolute;
  top: 2px;
  right: -6px;
  width: 8px;
  height: 8px;
  border-radius: 100%;
  background-color: $header-heading-color;
  box-shadow: 0 0 0 2px $header-background;
  transform: scale(0);
  transition: all 0.3s ease-in-out;
}

.Header__CartDot.is-visible {
  transform: scale(1);
}

.Search[aria-hidden="true"] + .Header--transparent .Header__CartDot {
  box-shadow: none;
  background-color: currentColor;
}

@include av-mq('tablet-and-up') {
  .Header__Wrapper {
    padding: 18px 30px;
  }

  .Header__LogoImage {
    max-width: 100%;
  }

  .Header__Icon + .Header__Icon {
    margin-left: 25px;
  }

  .Header__Icon .Icon--nav-desktop {
    height: 17px;
    width: 24px;
  }

  .Header__Icon .Icon--cart-desktop {
    height: 23px;
    width: 19px;
  }

  .Header__Icon .Icon--search-desktop {
    position: relative;
    top: 2px; /* for pixel perfect alignment with the cart icon */
    width: 21px;
    height: 21px;
  }

  .Header__Icon .Icon--account {
    position: relative;
    top: 2px; /* for pixel perfect alignment with the cart icon */
    width: 20px;
    height: 20px;
  }

  .Header--withIcons .Header__SecondaryNav {
    position: relative;
    top: 1px; /* for pixel perfect alignment with icons */
    margin-right: 32px;
  }
}

@include av-mq('desk') {
  .js .Header__Wrapper {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
  }

  .Header:not(.Header--sidebar) .Header__Wrapper {
    padding: 4px 50px;
  }

  .Header__CurrencySelector {
    display: inline-block;
  }

  .Header__MainNav {
    margin-right: 45px;
  }

  .Header--inline, .Header--logoLeft {
    .Header__FlexItem:first-child .Header__CurrencySelector {
      display: none;
    }
  }

  .Header--logoLeft {
    .Header__FlexItem--logo {
      order: -1;
      margin-right: 38px;
    }

    .Header__FlexItem--fill:last-child {
      flex: none;
    }
  }

  .Header--center {
    .Header__Wrapper.Header__Wrapper { /* Ugly hack to increase CSS precedence */
      padding-bottom: 24px;
    }

    .Header__MainNav {
      position: absolute;
      bottom: 0;
      left: 0;
      padding-bottom: 18px;
      width: 100%;
      text-align: center;
    }

    /* Ugly hack !! */
    .Header__MainNav .HorizontalList {
      margin-left: 0;
      margin-right: 0;
    }

    .Header__FlexItem {
      margin-bottom: 40px;
    }

    .Header__FlexItem:last-child .Header__CurrencySelector {
      display: none;
    }
  }

  .Header--initialized .Header__Wrapper {
    opacity: 1;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Desktop nav
 * ----------------------------------------------------------------------------
 */

.Header__LinkSpacer {
  position: absolute;
  display: block;
  bottom: 0;
  color: transparent;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  &::after {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transform: scale(0, 1);
    transform-origin: left center;
    border-bottom: 2px solid $header-heading-color;
    transition: transform 0.3s, opacity 0.3s;
  }
}

.Header:not(.Header--transparent) {
  .HorizontalList__Item.is-expanded .Header__LinkSpacer::after,
  .HorizontalList__Item.is-active .Header__LinkSpacer::after {
    opacity: 1;
    transform: scale(1, 1);
  }
}

/**
 * ----------------------------------------------------------------------------
 * Dropdown menu
 * ----------------------------------------------------------------------------
 */

.DropdownMenu {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  top: 100%;
  padding: 25px 0;
  min-width: 200px;
  max-width: 270px;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  text-align: left;
  background: $header-background;
  border: 1px solid $header-border-color;
  border-top: none;
  transition: all 0.3s ease-in-out;

  &::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 0;
    background: $header-heading-color;
    width: 100%;
    height: 2px;
    transform: scale(0, 1);
    transform-origin: left center;
    transition: transform 0.3s;
  }
}

.DropdownMenu[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;

  &::before {
    transform: scale(1, 1);
  }
}

.DropdownMenu[aria-hidden="false"] .DropdownMenu {
  display: block;
}

.DropdownMenu [aria-haspopup] {
  position: relative;
}

.DropdownMenu .Link {
  padding-left: 25px;
  padding-right: 40px;
}

.DropdownMenu svg {
  position: absolute;
  width: 6px;
  top: calc(50% - 4px);
  height: 10px;
  right: 20px;
  transition: transform 0.2s ease-in-out;
}

.DropdownMenu .Linklist__Item:hover {
  svg {
    transform: translateX(4px);
  }

  > .Link--secondary {
    color: $header-light-text-color;
  }
}

.DropdownMenu .DropdownMenu {
  display: none;
  left: 100%;
  top: -26px;
  border-top: 1px solid $header-border-color;

  &::before {
    display: none;
  }
}

.DropdownMenu .DropdownMenu--reversed {
  left: auto;
  right: 100%;
}

/**
 * ----------------------------------------------------------------------------
 * Mega menu
 * ----------------------------------------------------------------------------
 */

.MegaMenu {
  position: absolute;
  padding: 20px 0;
  width: 100%;
  left: 0;
  top: 100%;
  visibility: hidden;
  opacity: 0;
  max-height: 600px;
  overflow: auto;
  -ms-scroll-chaining: none;
  overscroll-behavior: contain;
  text-align: left;
  background: $header-background;
  border-bottom: 1px solid $header-border-color;
  transition: all 0.3s ease-in-out;

  @supports (--css: variables) {
    max-height: calc(100vh - var(--header-height));
  }
}

.MegaMenu[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;
}

.MegaMenu__Inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: nowrap;
  max-width: 1450px;
  margin: 0 auto;
  padding: 0 10px; /* each menu has 40px margin, but header has 50px, so we normalize it here */
}

.MegaMenu--spacingEvenly .MegaMenu__Inner {
  justify-content: space-around;
  justify-content: space-evenly; /* space-evenly is not supported everywhere */
}

.MegaMenu--spacingCenter .MegaMenu__Inner {
  justify-content: center;
}

.MegaMenu--grid .MegaMenu__Inner {
  @supports (display: grid) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }
}

.MegaMenu__Item {
  margin: 20px 40px;
  flex-shrink: 1;
}

.MegaMenu__Item--fit {
  flex-shrink: 0;
}

.MegaMenu__Title {
  display: block;
  margin-bottom: 20px;
}

.MegaMenu__Push {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}

.MegaMenu__Push--shrink {
  width: 50%;
}

.MegaMenu__Push--shrink:first-child {
  padding-right: 15px;
}

.MegaMenu__Push--shrink:last-child {
  padding-left: 15px;
}

.MegaMenu__PushImageWrapper {
  margin: 8px auto 20px auto;
  max-width: 100%;
  overflow: hidden;
}

.MegaMenu__PushHeading {
  margin-bottom: 6px;
}

@media (-moz-touch-enabled: 0), (hover: hover) {
  .MegaMenu__Push img {
    transform: scale(1);
    transition: opacity 0.3s ease, transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }

  .MegaMenu__Push:hover img {
    transform: scale(1.2);
  }
}
/**
 * ----------------------------------------------------------------------------
 * Image with text overlay section
 * ----------------------------------------------------------------------------
 */

.ImageHero {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-size: cover;
  background-position: center;
  min-height: 380px;
  width: 100%;
  overflow: hidden;
}

.ImageHero--small {
  min-height: 300px;
}

.ImageHero--large {
  min-height: 300px;
}

.ImageHero__ImageWrapper,
.ImageHero__Image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}

@include av-mq('lap-and-up') {
  @media (-moz-touch-enabled: 0), (hover: hover) {
    .ImageHero__Image--parallax {
      background-attachment: fixed;
    }
  }
}

.ImageHero__ImageWrapper--hasOverlay::before {
  position: absolute;
  content: '';
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}

.ImageHero__Wrapper {
  z-index: 1;
}

.ImageHero__ContentOverlay {
  position: relative;
  flex-basis: 425px;
  flex-grow: 0;
  padding: 0 15px;
  text-shadow: 0 1px rgba(#000000, 0.5);
}

.ImageHero__TextContent {
  position: absolute;
  padding: 0 24px;
  margin-bottom: 0 !important;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  text-align: center;
}

/* We allow embedding a video within an image hero */

.ImageHero iframe {
  position: absolute;
  height: 100%;
  width: 200%;
  left: -50%;
  pointer-events: none;
}

.ImageHero--large iframe {
  width: 250%;
  left: -75%;
}

.ImageHero iframe[src] {
  pointer-events: auto; /* When data saver is on in Chrome, it will just set the src but prevents autoplay, so we need to make sure that we make it clickable */
}

.ImageHero__Block {
  margin: 40px auto;
  padding: 38px 20px;
  max-width: 250px;
  box-shadow: 0 1px 20px rgba(#363636, 0.3);
}

.ImageHero__Block--small {
  max-width: 165px;
}

.ImageHero__Block--large {
  max-width: 320px;
}

.ImageHero__BlockHeading {
  margin: -0.325em 0 18px 0;
}

.ImageHero__BlockContent + .ImageHero__BlockLink {
  margin-top: 18px;
}

@include av-mq('phone') {
  .ImageHero__Block {
    font-size: to-size(11px);
  }
}

@include av-mq('tablet-and-up') {
  .ImageHero {
    min-height: 450px;
  }

  .ImageHero--small {
    min-height: 400px;
  }

  .ImageHero--large {
    min-height: 500px;
  }

  .ImageHero iframe {
    width: 100%;
    height: 200%;
    left: 0;
  }

  .ImageHero__Block {
    padding: 48px 15px;
    max-width: 380px;
  }

  .ImageHero__Block--small {
    max-width: 240px;
  }

  .ImageHero__Block--large {
    max-width: 520px;
  }

  .ImageHero__TextContent {
    padding: 0 40px;
    bottom: 40px;
    top: auto;
    left: 0;
    transform: none;
    text-align: left;
  }
}

@include av-mq('desk') {
  .ImageHero {
    min-height: 500px;
  }

  .ImageHero--small {
    min-height: 450px;
  }

  .ImageHero--large {
    min-height: 700px;
  }

  .ImageHero__TextContent {
    padding: 0 50px;
    bottom: 50px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Instagram feed
 * ----------------------------------------------------------------------------
 */

.Instafeed {
  height: 250px;
}

.Instafeed__Cell {
  width: 250px;
  margin: 0 5px;
  overflow: hidden;
}

.Instafeed__Image {
  position: relative;
  display: block;
  height: 100%;
  background-size: cover;
  background-position: center center;
}

.Instafeed__Overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 25px;
  background: $heading-color;
  color: $light-background;
  text-align: left;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}

.Instafeed__LikeCount {
  font-size: to-size(13px);

  svg {
    margin-right: 8px;
    width: 17px;
    height: 15px;
    vertical-align: sub;
  }
}

.Instafeed__Caption {
  position: relative;
  height: 6.6em; /* this is four times the default line height */
  margin: 20px 0;
  overflow: hidden;
  word-break: break-word;

  &::after {
    position: absolute;
    content: '';
    right: 0;
    bottom: 0;
    width: 70%;
    height: 1.6em;
    text-align: right;
    background: linear-gradient(to right, rgba($heading-color, 0), $heading-color 50%);
  }
}

.Instafeed__Date {
  position: absolute;
  bottom: 18px;
  color: inherit;
  text-transform: uppercase;
}

@media (-moz-touch-enabled: 0), (hover: hover) {
  .Instafeed__Cell:hover .Instafeed__Overlay {
    opacity: 1;
  }
}

@include av-mq('pocket') {
  .Instafeed .flickity-prev-next-button {
    display: none;
  }
}

@include av-mq('tablet-and-up') {
  .Instafeed {
    height: calc(100vw / 2 - 70px);
  }

  .Instafeed__Cell {
    width: calc(100vw / 2 - 70px);
  }
}

@include av-mq('lap-and-up') {
  .Instafeed {
    height: calc(100vw / 3 - 60px);
  }

  .Instafeed__Cell {
    width: calc(100vw / 3 - 60px);
  }

  .Instafeed .flickity-prev-next-button.previous {
    top: calc(50% - (45px / 2));
    left: 25px;
  }

  .Instafeed .flickity-prev-next-button.next {
    top: calc(50% - (45px / 2));
    right: 25px;
  }
}

@include av-mq('desk') {
  .Instafeed {
    height: calc(100vw / 3 - 180px);
  }

  .Instafeed__Cell {
    width: calc(100vw / 3 - 180px);
  }
}

@include av-mq('widescreen') {
  .Instafeed__Caption {
    height: 9.9em; /* this is six times the default line height */
  }
}
.NewsletterPopup {
  position: fixed;
  bottom: 15px;
  left: 15px;
  width: calc(100% - 30px);
  padding: 24px 30px 30px 30px;
  background: $newsletter-popup-background;
  color: $newsletter-popup-text-color;
  z-index: 50;
  text-align: center;
  box-shadow: 0 1px 4px rgba(#000000, 0.3);
  visibility: hidden;
  transform: translateY(25px);
  opacity: 0;
  transition: all 0.5s $drawer-transition-timing;

  .Heading {
    color: inherit;
  }

  .Form__Input::-webkit-input-placeholder {
    color: rgba($newsletter-popup-text-color, 0.6);
  }

  .Form__Input::-moz-placeholder {
    color: rgba($newsletter-popup-text-color, 0.6);
  }

  .Form__Input:-ms-input-placeholder {
    color: rgba($newsletter-popup-text-color, 0.6);
  }

  .Form__Input::-ms-input-placeholder {
    color: rgba($newsletter-popup-text-color, 0.6);
  }

  .Form__Input::placeholder {
    color: rgba($newsletter-popup-text-color, 0.6);
  }

  .Form__Input {
    border-color: rgba($newsletter-popup-text-color, 0.4);
  }

  .Form__Input:focus {
    border-color: $newsletter-popup-text-color;
  }

  .Button {
    color: $newsletter-popup-background;
    border-color: $newsletter-popup-text-color;

    &::before {
      background-color: $newsletter-popup-text-color;
    }

    @media (-moz-touch-enabled: 0), (hover: hover) {
      &:not([disabled]):hover {
        color: $newsletter-popup-text-color;
        background-color: transparent;
      }
    }
  }
}

.NewsletterPopup[aria-hidden="false"] {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}

.NewsletterPopup__Close {
  position: absolute;
  right: 15px;
  top: 15px;

  svg {
    display: block;
    width: 15px;
    height: 15px;
  }
}

.NewsletterPopup__Content a {
  text-decoration: underline;
  text-underline-position: under;
}

.NewsletterPopup__Form {
  margin-top: 32px;
}

@include av-mq('tablet-and-up') {
  .NewsletterPopup {
    max-width: 385px;
    right: 25px;
    bottom: 25px;
    left: auto;
    padding-top: 35px;
  }

  .NewsletterPopup__Close svg {
    width: 18px;
    height: 18px;
  }
}
.Password {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px;
  width: 100%;
  min-height: 100vh;
  background-size: cover;
  background-position: center;
}

@supports (--css: variables) {
  @include av-mq('pocket') {
    .Password {
      min-height: var(--window-height);
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Header
 * ----------------------------------------------------------------------------
 */

.Password__Header {
  position: relative;
  text-align: center;
}

.Password__Logo {
  display: block;
  line-height: 1;
}

.Password__LogoImage {
  vertical-align: middle;
}

.Password__LockAction {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);

  svg {
    margin-left: 10px;
    width: 20px;
    height: 20px;
    vertical-align: bottom;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Content
 * ----------------------------------------------------------------------------
 */

.Password__Content {
  width: 470px;
  max-width: 100%;
  margin: 35px auto;
}

.Password__Newsletter {
  margin-bottom: 10px;
}

.Password__Card {
  padding: 24px;
  background: $light-background;
  text-align: center;
}

.Password__Message {
  font-size: to-size(13px);
}

.Password__Form {
  margin-top: 28px;
}

.Password__Form .Button {
  flex: none;
  margin-bottom: 0;
  margin-top: 15px;
  width: 100%;
}

.Password__Social {
  padding: 22px 25px 22px 28px;
  background: $background;
  text-align: center;
}

.Password__ShareButtons {
  margin-top: 15px;
}

@include av-mq('tablet-and-up') {
  .Password__Content {
    margin: 80px auto;
  }

  .Password__Card {
    padding: 45px 60px 50px 60px;
  }

  .Password__Form .Button {
    width: auto;
    margin-top: 0;
  }

  .Password__Social {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
  }

  .Password__ShareButtons {
    margin-top: 0;
    margin-left: 15px;
    flex-shrink: 0;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Footer
 * ----------------------------------------------------------------------------
 */

.Password__Footer {
  text-align: center;
}

.Password__AdminLink {
  display: block;
  margin-top: 15px;
}

.Password__Footer svg {
  width: 70px;
  height: 20px;
  vertical-align: bottom;
  margin-left: 2px;
}

@include av-mq('tablet-and-up') {
  .Password__Footer {
    display: flex;
    justify-content: space-between;
    text-align: left;
  }

  .Password__AdminLink {
    margin-top: 0;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Modal
 * ----------------------------------------------------------------------------
 */

.Password__Modal {
  display: flex;
  justify-content: center;
}
/**
 * ----------------------------------------------------------------------------
 * Product (general)
 * ----------------------------------------------------------------------------
 */

.Product {
  position: relative;
  margin: 0 auto 50px auto;
  max-width: 1330px;
}

.Product--fill {
  max-width: none;
}

@include av-mq('tablet-and-up') {
  .Product {
    margin-bottom: 80px;
  }
}

@include av-mq('lap-and-up') {
  .Product__Wrapper {
    max-width: calc(100% - 525px);
    margin-left: 0;
  }
}

@include av-mq('desk') {
  .Product__Wrapper {
    max-width: calc(100% - 750px);
  }

  .Product--small .Product__Slideshow {
    max-width: 400px;
  }

  .Product--medium .Product__Slideshow {
    max-width: 550px;
  }
}

@include av-mq('widescreen') {
  .Product__Wrapper {
    max-width: calc(100% - 750px);
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product gallery
 * ----------------------------------------------------------------------------
 */

.Product__Gallery {
  position: relative;
  margin-bottom: 28px;
}

.Product__Slideshow::after {
  content: 'flickity';
  display: none;
}

.Product__SlideItem {
  position: relative;
}

.Product__SlideItem--video {
  cursor: pointer;

  .Video__PlayButton {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
  }

  .Video__PlayButton svg {
    transition: transform 0.2s ease-in-out;
  }

  &:hover .Video__PlayButton svg {
    transform: scale(1.1);
  }
}

.Product__Video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000;
}

.Product__SlideshowNav {
  display: none;
}

@include av-mq('tablet-and-up') {
  .Product__Gallery {
    margin-bottom: 65px;
  }
}

@include av-mq('lap-and-up') {
  .Product__Slideshow {
    padding-top: 50px;
  }

  .Product__Gallery {
    margin-left:0px;
  }

  .Product__SlideshowNav--dots {
    display: block;
  }

  .Product__SlideItem {
    display: block !important;
  }

  .Product__Slideshow--zoomable .Product__SlideItem--image {
    cursor: url($cursor-zoom-in-svg) 18 18, zoom-in;
    cursor: -webkit-image-set(url($cursor-zoom-in-svg) 1x, url($cursor-zoom-in-2x-svg) 2x), zoom-in;
  }

  /* Dots */

  .Product__SlideshowNav--dots .Product__SlideshowNavScroller {
    position: -webkit-sticky;
    position: sticky;
    top: 50%;
    transform: translateY(-50%);

    @supports (--css: variables) {
      top: calc(50% + (var(--header-height) / 2));
    }
  }

  .Product__SlideshowNavDot {
    display: block;
    height: 10px;
    width: 10px;
    border-radius: 100%;
    border: 2px solid $border-color;
    background: transparent;
    transition: all 0.2s ease-in-out;

    &:not(:last-child) {
      margin-bottom: 12px;
    }
  }

  .Product__SlideshowNavDot.is-selected {
    border-color: $heading-color;
    background: $heading-color;
  }

  /* Thumbnails */

  .Product__SlideshowNavImage {
    display: block;
    border: 1px solid transparent;
    transition: all 0.2s ease-in-out;
    cursor: pointer;

    &:not(:last-child) {
      margin-bottom: 18px;
    }
  }

  .Product__SlideshowNavImage.is-selected {
    border-color: $heading-color;
  }

  .Product__SlideshowNavPlay {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    -webkit-filter: drop-shadow(0 2px 2px rgba(#000000, 0.2));
    filter: drop-shadow(0 2px 2px rgba(#000000, 0.2));

    svg {
      width: 30px;
      height: 30px;
      transition: transform 0.2s ease-in-out;
    }
  }

  .Product__SlideshowNavImage--video:hover svg {
    transform: scale(1.1);
  }

  /* When the gallery is stack we have various adjusments to do */

  .Product__Gallery--stack {
    .Product__SlideshowNav {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      z-index: 1;
    }

    .Product__SlideshowNav--dots {
      left: -30px;
    }

    .Product__Slideshow::after {
      content: ''; /* Disable Flickity */
    }

    /* On desktop we use a different apparition effect than fade in if images are stacked */
    .Product__Slideshow .Image--fadeIn {
      transform: translateY(50px);
      opacity: 0;
      transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    .Product__Slideshow .Image--lazyLoaded.Image--fadeIn {
      transform: translateY(0);
      opacity: 1;
    }

    .Product__SlideItem--video {
      .Video__PlayButton {
        transform: translate(-50%, calc(-50% + 50px));
        opacity: 0;
        transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
      }

      .Image--lazyLoaded ~ .Video__PlayButton {
        transform: translate(-50%, -50%);
        opacity: 1;
      }
    }

    .Product__SlideItem {
      margin-bottom: 30px;

      &:last-child {
        margin-bottom: 0;
      }
    }

    /* Thumbnails */

    .Product__SlideshowNav--thumbnails {
      position: -webkit-sticky;
      position: sticky;
      padding: 50px 0;
      top: $header-base-height;
      margin-bottom: -50px;
      width: 70px;

      @supports (--css: variables) {
        top: var(--header-height);
      }
    }
  }
}

@include av-mq('desk') {
  .Product__Gallery {
    margin-bottom: 80px;
  }

  .Product__Slideshow {
    margin-left: auto;
    margin-right: auto;
  }

  .Product__Gallery--withThumbnails {
    .Product__SlideshowNav--dots {
      display: none;
    }

    .Product__SlideshowNav--thumbnails {
      display: block;
    }
  }

  .Product__Gallery--stack.Product__Gallery--withThumbnails {
    display: flex;

    .Product__Slideshow,
    .Product__SlideshowNav {
      flex: 1 0 auto;
    }

    .Product__SlideshowNav {
      flex-grow: 0;
    }

    .Product__Slideshow {
      padding-left: 50px;
    }
  }

  .Product__Gallery:not(.Product__Gallery--stack).Product__Gallery--withThumbnails {
    .Product__SlideshowNav {
      margin: 10px -10px -10px -10px;
      text-align: center;
    }

    .Product__SlideshowNavImage {
      display: inline-block;
      width: 70px;
      margin: 10px;
      vertical-align: middle;
    }

    .flickity-page-dots {
      display: none;
    }
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product aside and info
 * ----------------------------------------------------------------------------
 */

.Product__Info,
.Product__Aside {
  max-width: 600px;
  margin: 0 auto;
}

.Product__Info--noGallery {
  padding-top: 24px;
}

@include av-mq('tablet-and-up') {
  .Product__Info .Container {
    padding-left: 0;
    padding-right: 0;
  }

  .Product__Aside .Section {
    max-width: 630px;
    margin: 0 auto;
  }
}

@include av-mq('lap-and-up') {
  .Product__InfoWrapper {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
  }

  .Product__Info {
    position: -webkit-sticky;
    position: sticky;
    top: $header-base-height;
    right: 0;
    width: 375px;
    margin: 0 100px -40px 50px;
    padding-top: 15px;
    padding-bottom: 40px;

    @supports (--css: variables) {
      top: var(--header-height);
    }
  }

  .Product__Aside {
    max-width: 820px;
    padding-left: 0px;
  }

  .Product__Aside .SectionHeader {
    margin-bottom: 30px;
  }
}

@include av-mq('desk') {
  .Product__Info {
    width: 600px;
  }
}

@include av-mq('widescreen') {
  .Product__Info {
    margin-right: 50px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Action list
 * ----------------------------------------------------------------------------
 */

@-webkit-keyframes shareItemAnimation {
  0% {
    transform: translateY(0%);
  }

  25% {
    opacity: 0;
    transform: translateY(100%);
  }

  50% {
    opacity: 0;
    transform: translateY(-100%);
  }

  75% {
    opacity: 1;
    transform: translateY(0%);
  }
}

@keyframes shareItemAnimation {
  0% {
    transform: translateY(0%);
  }

  25% {
    opacity: 0;
    transform: translateY(100%);
  }

  50% {
    opacity: 0;
    transform: translateY(-100%);
  }

  75% {
    opacity: 1;
    transform: translateY(0%);
  }
}

.Product__ActionList {
  position: absolute;
  top: 30px;
  right: 25px;
  z-index: 1;
  visibility: visible;
  opacity: 1;
  transition: visibility 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

.Product__ActionList.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.Product__ActionItem {
  display: block;
  position: relative;
}

.Product__ActionItem + .Product__ActionItem {
  margin-top: 15px;
}

.Product__ShareList {
  display: block;
  position: absolute;
  visibility: hidden;
  top: 100%;
  right: 0;
  color: $text-color;
}

.Product__ActionItem .Icon--share {
  margin-left: -1px;
}

.Product__ShareItem {
  display: block;
  margin: 15px 0 15px auto;
  padding: 7px 15px 7px 17px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background: $light-background;
  border-radius: 25px;
  font-size: to-size(13px);
  white-space: nowrap;
  opacity: 0;
  box-shadow: 0 2px 10px rgba(#363636, 0.15);
  transition: all 0.45s cubic-bezier(0.645, 0.045, 0.355, 1) 0.2s;

  &:active,
  &:focus {
    color: $light-background;
    background: $text-color;
    outline: none;
  }

  &:nth-child(2) {
    transition-delay: 0.1s;
  }

  &:nth-child(3) {
    transition-delay: 0s;
  }

  svg {
    margin-right: 12px;
    font-size: to-size(14px);
    vertical-align: sub;
    transform: translateZ(0);
  }

  &:hover svg {
    -webkit-animation: shareItemAnimation 0.5s ease-in-out forwards;
    animation: shareItemAnimation 0.5s ease-in-out forwards;
  }
}

.Product__ShareList[aria-hidden="false"] {
  visibility: visible;

  .Product__ShareItem {
    opacity: 1;
    transition-delay: 0s;

    &:nth-child(2) {
      transition-delay: 0.1s;
    }

    &:nth-child(3) {
      transition-delay: 0.2s;
    }
  }
}

@include av-mq('lap-and-up') {
  .Product__ActionList {
    position: -webkit-sticky;
    position: sticky;
    float: right;
    top: calc(100vh - var(--header-height));
  }

  .no-supports-sticky .Product__ActionList {
    display: none;
  }

  .Product__ShareList {
    top: auto;
    bottom: 100%;
  }

  .Product__ShareItem {
    transition-delay: 0s;

    &:nth-child(3) {
      transition-delay: 0.2s;
    }
  }

  .Product__ShareList[aria-hidden="false"] .Product__ShareItem {
    transition-delay: 0.2s;

    &:nth-child(3) {
      transition-delay: 0s;
    }
  }
}

@include av-mq('widescreen') {
  .Product__ActionList {
    margin-right: -80px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product meta and info
 * ----------------------------------------------------------------------------
 */

.ProductMeta {
  text-align: center;
}

.ProductMeta__ImageWrapper {
  display: block;
  margin-bottom: 32px;
}

.ProductMeta__Vendor {
  margin-bottom: 20px;
}

.ProductMeta__Title {
  margin-bottom: 0;
}

.ProductMeta__PriceList {
  margin-top: 15px;
}

.ProductMeta__Price.Price--compareAt {
  margin-left: 30px;
}

.ProductMeta__Description {
  margin: 24px 0;
  padding-top: 24px;
  border-top: 1px solid $border-color;
  text-align: left;
}

.ProductMeta__ShareButtons {
  display: inline-flex;
  align-items: center;
  margin: 18px 0 10px 0;
}

.ProductMeta__ShareTitle {
  margin-right: 6px;
}


.ProductMeta__ShareList {
  font-size: 0;
}

.ProductMeta__ShareItem {
  display: inline-block;
  margin: 0 7px;
  transition: opacity 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);

  svg {
    display: block;
    width: 12px;
    height: 12px;
    opacity: 0.6;
    transition: opacity 0.2s ease-in-out;
  }

  &:hover svg {
    opacity: 1;
  }
}

.ProductMeta__ShareItem:nth-child(1) {
  transition-delay: 0.3s;
}

.ProductMeta__ShareItem:nth-child(2) {
  transition-delay: 0.15s;
}

.ProductMeta__ShareItem:nth-child(3) {
  transition-delay: 0s;
}

.ProductMeta__ShareButtons:hover {
  .ProductMeta__ShareItem {
    opacity: 1;
    transform: translateY(0);
  }

  .ProductMeta__ShareItem:nth-child(1) {
    transition-delay: 0s;
  }

  .ProductMeta__ShareItem:nth-child(3) {
    transition-delay: 0.3s;
  }
}

/* When the description is set after the product form, layout changes a bit */
.ProductForm ~ .ProductMeta__Description {
  border-top: none;
  padding-top: 0;
  font-size:16px;

  .ProductMeta__ShareButtons {
    margin-bottom: 2px;
  }
}

.Product__QuickNav {
  position: relative;
  margin-top: 40px;
  border-top: 1px solid $border-color;
  border-bottom: 1px solid $border-color;

  a {
    display: block;
    padding: 11px 16px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: rotateX(0deg);
  }

  a:last-child {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transform: rotateX(180deg);
  }

  svg {
    position: absolute;
    right: 18px;
    top: calc(50% - 5px);
    height: 10px;
    width: 8px;
  }
}

.Product__QuickNavWrapper {
  transition: 0.6s;
  transform-style: preserve-3d;
}

.Product__QuickNav.is-flipped .Product__QuickNavWrapper {
  transform: rotateX(180deg);
}

@include av-mq('lap-and-up') {
  .ProductMeta {
    text-align: left;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product form
 * ----------------------------------------------------------------------------
 */

.ProductForm {
  margin-top: 24px;
}

.ProductForm__Variants {
  margin-bottom: 25px;
}

.ProductForm__Option {
  position: relative;
  margin-bottom: 10px;
}

.ProductForm__Option--labelled {
  margin-bottom: 20px;
}

.no-js .ProductForm__Option:not(.no-js) {
  display: none;
}

.ProductForm__Item {
  position: relative;
  width: 100%;
  text-align: left;
  padding: 10px 28px 10px 14px;
  border: 1px solid $border-color;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ProductForm__Item .Icon--select-arrow {
  position: absolute;
  top: calc(50% - 5px);
  right: 15px;
  width: 10px;
  height: 10px;
}

.ProductForm__Label {
  display: block;
  margin-bottom: 8px;
}

.ProductForm__LabelLink {
  float: right;
  text-decoration: underline;
  text-underline-position: under;
}

.ProductForm__SelectedValue {
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 220px;
  vertical-align: top;
}

.ProductForm__OptionCount {
  float: right;
  margin-right: 14px;
}

.ProductForm__Inventory {
  margin-top: 8px;
  font-style: italic;
}

.ProductForm__Error {
  margin-top: 10px;
  text-align: center;
}

.ProductForm__AddToCart {
  display: flex;
  align-items: center;
  justify-content: center;
}

/**
 * ----------------------------------------------------------------------------
 * Featured image
 * ----------------------------------------------------------------------------
 */

.Product__FeatureImageWrapper {
  overflow: hidden;
  background-size: cover;
}

.Product__FeatureImage {
  height: 415px;
  background-size: cover;
  background-position: center;
}

@include av-mq('tablet-and-up') {
  .Product__FeatureImage {
    height: 500px;
  }
}

@include av-mq('desk') {
  .Product__FeatureImage {
    height: 600px;
  }

  .Product__FeatureImage--small {
    height: 500px;
  }

  .Product__FeatureImage--large {
    height: 700px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Product tabs
 * ----------------------------------------------------------------------------
 */

.Product__Tabs {
  margin: 50px 0;
}

@include av-mq('phone') {
  .Product__Tabs .Collapsible__Content {
    padding-top: 6px;
    padding-bottom: 28px;
  }
}

@include av-mq('pocket') {
  .Product__Tabs .Collapsible {
    padding: 0 24px;
  }
}

@include av-mq('lap-and-up') {
  .Product__Tabs {
    margin: 80px 0;
  }

  .Product__Tabs .Collapsible__Content {
    padding-right: 80px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Variant slideshow (for color carousel)
 * ----------------------------------------------------------------------------
 */

@-webkit-keyframes variantSelectorInfoOpeningAnimation {
  0% {
    transform: translateY(10px);
    opacity: 0;
  }

  50% {
    transform: translateY(10px);
    opacity: 0;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes variantSelectorInfoOpeningAnimation {
  0% {
    transform: translateY(10px);
    opacity: 0;
  }

  50% {
    transform: translateY(10px);
    opacity: 0;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes variantSelectorInfoClosingAnimation {
  0% {
    transform: translateY(0);
    opacity: 1;
  }

  100% {
    transform: translateY(-10px);
    opacity: 0;
  }
}

@keyframes variantSelectorInfoClosingAnimation {
  0% {
    transform: translateY(0);
    opacity: 1;
  }

  100% {
    transform: translateY(-10px);
    opacity: 0;
  }
}

.VariantSelector {
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  background: $background;
  padding: 24px 0;
  z-index: 10;
  box-shadow: 0 -2px 10px rgba(#363636, 0.2);
  transform: translateY(100%);
  visibility: hidden;
  transition: transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1), visibility 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.VariantSelector[aria-hidden="false"] {
  transform: translateY(0);
  visibility: visible;
}

.VariantSelector__Item {
  padding: 0 10px;
  width: 60%;
}

.VariantSelector__Info {
  position: relative;
  margin: 48px 24px 0 24px;
}

.VariantSelector__ChoiceList {
  margin-bottom: 34px;
}

.VariantSelector__Choice {
  display: table;
  table-layout: fixed;
  width: 100%;
  -webkit-animation: 0.15s variantSelectorInfoClosingAnimation forwards ease-in-out;
  animation: 0.15s variantSelectorInfoClosingAnimation forwards ease-in-out;
}

.VariantSelector__Choice.is-selected {
  -webkit-animation: 0.3s variantSelectorInfoOpeningAnimation forwards ease-in-out;
  animation: 0.3s variantSelectorInfoOpeningAnimation forwards ease-in-out;
}

.VariantSelector__Choice:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
}

.VariantSelector__ChoiceColor,
.VariantSelector__ChoicePrice {
  display: table-cell;
  width: 50%;
  text-align: center;
  vertical-align: middle;
}

.VariantSelector__ChoiceColor {
  border-right: 1px solid $border-color;
}

.VariantSelector__ColorSwatch {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 15px;
  vertical-align: sub;
  background-size: cover;
}

.VariantSelector__ColorSwatch--white {
  outline: 1px solid $border-color;
}

.VariantSelector__ChoicePrice {
  font-size: to-size(11px);
}

@include av-mq('phone') {
  .VariantSelector .flickity-prev-next-button {
    display: none;
  }
}

@include av-mq('tablet-and-up') {
  /* Starting from tablet, the look and feel of this selector is completely different and look like a modal */
  .VariantSelector {
    top: 50%;
    bottom: auto;
    left: 50%;
    width: 80%;
    padding-bottom: 34px;
    max-height: 100%;
    max-width: 800px;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: all 0.3s ease-in-out;
    overflow: auto;
  }

  .VariantSelector[aria-hidden="false"] {
    transform: translate(-50%, -50%);
    opacity: 1;
  }

  .VariantSelector__Item {
    padding: 0 25px;
    width: 46%;
  }

  .VariantSelector .flickity-prev-next-button.next {
    top: calc(50% - 45px);
    right: 20px;
  }

  .VariantSelector .flickity-prev-next-button.previous {
    top: calc(50% - 45px);
    left: 20px;
  }

  .VariantSelector__Info {
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
  }

  .VariantSelector__ChoicePrice {
    font-size: to-size(13px);
  }
}

@media (min-width: 800px) and (max-height: 950px) {
  .VariantSelector__ImageWrapper {
    max-width: 290px !important;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Featured product (on home page)
 * ----------------------------------------------------------------------------
 */

.FeaturedProduct__Gallery {
  display: block;
  margin-bottom: 20px;
}

.FeaturedProduct__ViewWrapper {
  margin-top: 34px;
  text-align: center;
}

@include av-mq('tablet-and-up') {
  .FeaturedProduct {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    max-width: 980px;
    margin: 0 auto;
  }

  .FeaturedProduct--center {
    align-items: center;
  }

  .FeaturedProduct__Gallery,
  .FeaturedProduct__Info {
    flex: 1 1 50%;
  }

  .FeaturedProduct__Gallery {
    margin: 0;
  }

  .FeaturedProduct__Info {
    margin-left: 50px;
  }

  .FeaturedProduct__Info .ProductMeta,
  .FeaturedProduct__ViewWrapper {
    text-align: left;
  }
}

@include av-mq('lap-and-up') {
  .FeaturedProduct__Info {
    margin-left: 80px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Shopify payment button
 * ----------------------------------------------------------------------------
 */

.shopify-payment-button {
  margin-top: 20px;
  text-align: center;
}

.shopify-payment-button__more-options {
  @extend .Link, .Link--underline;
  width: auto;
  line-height: normal;
display:none !important;
  &[aria-hidden="true"] {
    display: none;
  }
}

.shopify-payment-button__more-options:hover:not([disabled]) {
  text-decoration: none;
  display:none !important; 
}

.shopify-payment-button__button--unbranded {
  @extend .Button, .Button--primary;
}
/**
 * ----------------------------------------------------------------------------
 * Product reviews (integration with Shopify Reviews free app)
 * ----------------------------------------------------------------------------
 */

#shopify-product-reviews {
  margin:0px !important;
  overflow: visible !important;

  .spr-header-title,
  .spr-form-title {
    display: none;
  }

  .spr-container {
    padding: 0;
    border: none;
  }

  .spr-container,
  .spr-content {
    display: flex;
    flex-direction: column;
  }

  .spr-header,
  .spr-form {
    order: 1;
  }

  .spr-content,
  .spr-reviews {
    order: 2;
  }

  .spr-form {
    margin: -4px 0 0 0;
    padding: 0;
    /*display:block !important;*/
  }

  .spr-icon {
    font-size: to-size(10px);
  }

  .spr-form-input .spr-icon {
    font-size: to-size(14px);
  }

  .spr-icon + .spr-icon {
    margin-left: 3px;
  }

  .spr-icon-star-empty {
    opacity: 0.25;
  }

  .spr-icon-star-empty::before {
    content: '\e800';
  }

  .spr-starrating.spr-form-input-error a {
    color: inherit;
  }

  .spr-reviews {
    margin: -6px 0 35px 0;
  }

  .spr-review {
    position: relative;
    padding: 0 0 30px 0;
    border: none;
    margin: 0;
        margin-top: 30px;
  }

  .spr-review + .spr-review {
    margin-top: 26px;
  }

  .spr-review-header {
    position: static;
    margin-bottom: 12px;
  }

  .spr-review-header-starratings {
    margin-bottom: 0;
  }

  .spr-review-header-title {
    font-family: $heading-font-family;
    font-weight: $heading-font-weight;
    font-style: $heading-font-style;
    font-size: to-size(11px);
    text-transform: uppercase;
    letter-spacing: 0.2em;
  }

  .spr-review-header-byline {
    position: absolute;
    top: 15px;
    left: 0;
    margin-bottom: 0;
    font-style: normal;
    opacity: 1;
    color: #939393;

    strong {
      font-weight: normal;
    }
  }

  .spr-review-content {
    margin-bottom: 0;
  }

  .spr-review-reply {
    margin: 18px 0 6px 0;
    padding: 0 0 0 14px;
    background: none;
    border-left: 3px solid $border-color;
    font-style: italic;
  }

  .spr-summary-actions {
    display: block;
  }

  .spr-review-reply-shop {
    float: none;
  }

  .spr-summary-actions-newreview,
  .spr-button-primary:not(input) {
    @extend .Button, .Button--primary;
    width: 100%;
  }

  input.spr-button-primary {
    @extend .Button;
    border-color: $button-background;
    background: $button-background;
    color: $button-text-color;
    width: 100%;
  }

  .spr-pagination-prev,
  .spr-pagination-next {
    display: block;
    position: relative;
    margin-bottom: 20px;
  }

  .spr-pagination-prev > a,
  .spr-pagination-next > a {
    @extend .Button, .Button--primary;
    width: 100%;
  }

  .spr-form-message {
    @extend .Alert, .Form__Alert;
  }

  .spr-form-message-error {
    @extend .Alert--error;
  }

  .spr-form-message-success {
    @extend .Alert--success;
  }

  .spr-form-label {
    @extend .Form__Label;
  }

  .spr-form-input-text,
  .spr-form-input-email,
  .spr-form-input-textarea {
    @extend .Form__Input;
  }

  .new-review-form {
    margin-top: 20px;
  }

  .spr-form-contact-name,
  .spr-form-contact-email,
  .spr-form-contact-location,
  .spr-form-review-title,
  .spr-form-review-rating,
  .spr-form-review-body {
    margin-bottom: 15px;
  }
}

@include av-mq('tablet-and-up') {
  #shopify-product-reviews {
    margin: 8px 40px 28px 0 !important;

    .spr-review-header-title {
      font-size: to-size(12px);
    }

    .spr-review-header-byline,
    .spr-review-content-body {
      font-size: to-size(15px);
    }

    .spr-header {
      align-self: flex-start;
      width: 100%;
    }

    .spr-summary-actions-newreview,
    .spr-button-primary:not(input),
    input.spr-button-primary,
    .spr-pagination-prev > a,
    .spr-pagination-next > a {
      width: auto;
      float: none;
    }

    .spr-form-contact-name,
    .spr-form-contact-email,
    .spr-form-contact-location,
    .spr-form-review-title,
    .spr-form-review-rating,
    .spr-form-review-body {
      margin-bottom: 25px;
    }

    .spr-summary-actions {
      display: flex;
    }

    .spr-pagination-prev,
    .spr-pagination-next {
      margin: 0 20px 0 0;
    }

    .spr-pagination-prev > a,
    .spr-pagination-next > a {
      display: block;
    }
  }
}

@include av-mq('lap-and-up') {
  #shopify-product-reviews {
    margin-bottom: 4px !important;
  }
}

@include av-mq('desk') {
  #shopify-product-reviews {
    margin-right:0px !important;
  }
}
.Search {
  display: block;
  position: absolute;
  top: 100%;
  width: 100%;
  background: $background;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-25px);
  transition: transform 0.15s ease-in-out, opacity 0.15s ease-in-out, visibility 0.15s ease-in-out;
  z-index: -1;
}

.Search[aria-hidden="false"] {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.Search__Inner {
  padding: 14px 18px;
  max-height: calc(100vh - 60px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;

  @supports (--css: variables) {
    max-height: calc(100vh - var(--header-height) - 88px); /* 88px is the height of bottom bar on iOS */
  }
}

.Search__SearchBar {
  display: flex;
  align-items: center;
}

.Search__Form {
  display: flex;
  align-items: center;
  flex: 1 0 auto;

  .Icon--search {
    width: 18px;
    height: 17px;
  }

  .Icon--search-desktop {
    width: 21px;
    height: 21px;
  }
}

.Search__InputIconWrapper {
  position: relative;
  top: -1px; /* For pixel perfect */
  margin-right: 12px;
  color: $text-color-light;
}

.Search__Input {
  background: none;
  width: 100%;
  border: none;
  font-size: to-size(15px);
  vertical-align: middle;

  &::-webkit-input-placeholder {
    color: $text-color-light;
  }

  &::-moz-placeholder {
    color: $text-color-light;
  }

  &:-ms-input-placeholder {
    color: $text-color-light;
  }

  &::-ms-input-placeholder {
    color: $text-color-light;
  }

  &::placeholder {
    color: $text-color-light;
  }

  &::-ms-clear {
    display: none;
  }
}

.Search__Close {
  color: $text-color-light;
  font-size: to-size(15px);
  line-height: 1;
}

.Search__Results {
  display: none;
  margin-top: 30px;
  margin-bottom: 30px;
}

.Search__Results[aria-hidden="false"] {
  display: block;
}

@include av-mq('phone') {
  .Search__Results {
    .ProductItem__Wrapper {
      display: flex;
      align-items: center;
    }

    .Grid__Cell + .Grid__Cell {
      margin-top: 25px;
    }

    .ProductItem__ImageWrapper {
      width: 70px;
      min-width: 70px;
      margin-right: 25px;
    }

    .ProductItem__Info {
      margin-top: 0;
      text-align: left;
    }
  }
}

@include av-mq('tablet-and-up') {
  .Search__Inner {
    padding: 28px 50px;
  }

  .Search__Input {
    font-size: to-size(18px);
  }

  .Search__InputIconWrapper {
    margin-right: 20px;
  }

  .Search__Close {
    font-size: to-size(16px);

    svg {
      stroke-width: 1.25px;
    }
  }

  .Search__Results {
    margin-top: 70px;
    margin-bottom: 48px;
  }
}
@-webkit-keyframes shopTheLookDotKeyframe {
  0% {
    transform: scale(1.0);
  }

  50% {
    transform: scale(1.05);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes shopTheLookDotKeyframe {
  0% {
    transform: scale(1.0);
  }

  50% {
    transform: scale(1.05);
  }

  100% {
    transform: scale(1);
  }
}

.ShopTheLook {
  z-index: 2;
}

.ShopTheLook__Item {
  padding: 0 5px;
  width: calc(100% - 40px);
  transition: opacity 0.3s ease-in-out;
}

.ShopTheLook__Item.is-selected {
  z-index: 1;
}

.ShopTheLook__ImageWrapper {
  position: relative;
  max-width: 100%;
}

.ShopTheLook__Image {
  display: block;
  height: 100%;
  width: 100%;
}

.ShopTheLook__Dot {
  position: absolute;
  display: block;
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
  background: #ffffff;
  border-radius: 100%;
  box-shadow: 0 1px 10px rgba(#000000, 0.25);
  cursor: pointer;
  z-index: 1;
  transform: scale(1);
  transition: transform 0.25s ease-in-out;

  &::after {
    position: absolute;
    content: '';
    width: 40px;
    height: 40px;
    left: -12px; /* This is 40/2 - 16/2 */
    top: -12px; /* This is 40/2 - 16/2 */
    border-radius: 100%;
    background: rgba(#ffffff, 0.4);
    -webkit-animation: 1.4s shopTheLookDotKeyframe ease-in-out infinite;
    animation: 1.4s shopTheLookDotKeyframe ease-in-out infinite;
  }
}

.ShopTheLook__Dot--dark {
  background: #000000;

  &::after {
    background: rgba(#000000, 0.4);
  }
}

.ShopTheLook__Dot.is-active,
.supports-hover .ShopTheLook__Dot:hover {
  transform: scale(1.5);
}

.ShopTheLook__ProductItem .ProductItem__ImageWrapper {
  max-width: 150px;
  margin: 0 auto;
}

.ShopTheLook__DiscoverButtonWrapper {
  margin: 24px 24px 0 24px;
  text-align: center;
}

@include av-mq('phone') {
  .ShopTheLook__ViewButton {
    width: 100%;
  }

  .ShopTheLook__ProductItem--withHiddenInfo .ProductItem__Info {
    display: none;
  }

  .ShopTheLook__ProductItem {
    padding: 15px 0;
  }
}

@include av-mq('pocket') {
  .ShopTheLook > .flickity-viewport {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  }

  .ShopTheLook::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: $background;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease-in-out;
  }

  .ShopTheLook.is-zoomed {
    &::before {
      opacity: 1;
      visibility: visible;
      transition-delay: 0s;
    }

    .ShopTheLook__Item:not(.is-selected) {
      opacity: 0;
    }
  }

  .ShopTheLook__ProductItem {
    padding: 30px 0 40px 0;
  }
}

@include av-mq('tablet-and-up') {
  .ShopTheLook__DiscoverButtonWrapper {
    margin-top: 50px;
  }

  .ShopTheLook__Item {
    width: auto;
    padding: 0 15px;
  }

  .ShopTheLook__ProductItem .ProductItem__Wrapper {
    max-width: 250px;
    margin: 0 auto;
  }
}

@include av-mq('lap-and-up') {
  .ShopTheLook {
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 130px;
  }

  .ShopTheLook__Item {
    width: 100%;
    padding: 0;
  }

  .ShopTheLook__Inner {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 550px;
  }

  .ShopTheLook__ImageWrapper {
    flex: 0 1 auto;
  }

  .ShopTheLook__Image {
    max-height: 100%;
    width: auto;
  }

  .ShopTheLook__ProductList {
    flex: none;
    width: 270px;
    margin: 0 80px;
  }

  .ShopTheLook__ProductItem .ProductItem__Wrapper {
    max-width: none;
  }

  .ShopTheLook__ProductItem .ProductItem__ImageWrapper {
    max-width: 250px;
  }

  .ShopTheLook__ViewButton {
    margin-top: 25px;
  }

  .ShopTheLook .flickity-prev-next-button {
    top: calc(50% - (45px / 2));
  }

  .ShopTheLook .flickity-prev-next-button.next {
    right: 40px;
  }

  .ShopTheLook .flickity-prev-next-button.previous {
    left: 40px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Sidebar
 * ----------------------------------------------------------------------------
 */

.SidebarMenu {
  height: 100%;
  background: $navigation-background;
  color: $navigation-text-color;
}

.SidebarMenu .Heading,
.supports-hover .SidebarMenu .Link--primary:hover {
  color: $navigation-text-color;
}

.SidebarMenu .Text--subdued {
  color: $navigation-text-color;
}

.SidebarMenu .Collapsible,
.SidebarMenu .Linklist {
  border-color: $navigation-border-color;
}

.SidebarMenu__Nav .Collapsible:first-child {
  border-top: none;
}

/* We need to do that to add extra padding for scroll, as Safari on Mac and iOS has some issue with directly adding a padding-bottom */
.SidebarMenu .Drawer__Main::after {
  display: block;
  content: '';
  height: 35px;
}

.SidebarMenu__Nav--secondary {
  margin-top: 28px;
}

.SidebarMenu .Drawer__Footer {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  box-shadow: 0 1px $navigation-border-color inset;
  color: $navigation-text-color-light;
}

.SidebarMenu__CurrencySelector,
.SidebarMenu__Social {
  flex: 1 0 auto;
  margin: 0;
  padding: 6px 0;
}

.SidebarMenu__CurrencySelector {
  width: 120px;
  flex: none;
  text-align: center;
  font-size: to-size(11px);

  .Select {
    display: inline-block;
  }
}

/* All this code is pretty ugly hack just to comply with some Shopify strict rules... */
.SidebarMenu__Social {
  @supports (display: grid) {
    display: grid;
    grid-template-columns: repeat(auto-fit, 34px);
    justify-content: space-evenly;
    text-align: center;
  }
}

.SidebarMenu__CurrencySelector + .SidebarMenu__Social {
  border-left: 1px solid $navigation-border-color;
}

.SidebarMenu .Drawer__Content::before,
.SidebarMenu .Drawer__Footer::before {
  position: absolute;
  content: '';
  width: 100%;
  pointer-events: none;
  z-index: 1;
}

.SidebarMenu .Drawer__Content::before {
  top: 0;
  height: 25px;
  background-image: linear-gradient($navigation-background, rgba($navigation-background, 0.6) 40%, rgba($navigation-background, 0));
}

.SidebarMenu .Drawer__Footer::before {
  bottom: 100%;
  height: 30px;
  background-image: linear-gradient(rgba($navigation-background, 0), rgba($navigation-background, 0.6) 40%, $navigation-background);
}

@include av-mq('lap-and-up') {
  .SidebarMenu .Drawer__Content::before {
    height: 40px;
  }

  .SidebarMenu .Drawer__Main {
    padding-top: 26px;
  }

  .SidebarMenu .Drawer__Main::after {
    height: 60px; /* same here, Safari has some issues with adding padding-bottom :( */
  }

  .SidebarMenu .Drawer__Footer::before {
    height: 70px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * Slideshow
 * ----------------------------------------------------------------------------
 */

.shopify-section--slideshow {
  position: relative;
}

.Slideshow--fullscreen {
  height: 100vh;
}

@supports (--css: variables) {
  .js .Slideshow--fullscreen {
    height: calc(var(--window-height) - (var(--header-height) * var(--header-is-not-transparent, 0)) - var(--announcement-bar-height, 0px));
  }
}

/* Slideshow transition are handled in JavaScript, so while we use Flickity, we need to disable any transition */

.js .Slideshow__Carousel {
  .Slideshow__Slide {
    transition: none;
  }

  .Slideshow__Slide.is-selected {
    visibility: hidden;
  }
}

.Slideshow__ImageContainer {
  height: 100%;
}

.Slideshow--fullscreen .Slideshow__Image {
  display: block;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  font-family: 'object-fit: cover; object-position: center;'; /* polyfill for IE */
}

.Slideshow__Image {
  z-index: 0;
}

@supports ((-o-object-fit: cover) or (object-fit: cover)) {
  .js .Slideshow__Image {
    opacity: 0;
  }
}

.Slideshow__Content {
  position: absolute;
  padding: 0 24px;
  width: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.Slideshow__Content--middleLeft,
.Slideshow__Content--bottomLeft {
  text-align: left;

  .ButtonGroup {
    justify-content: flex-start;
  }
}

.Slideshow__Content--middleRight,
.Slideshow__Content--bottomRight {
  text-align: right;

  .ButtonGroup {
    justify-content: flex-end;
  }
}

.Slideshow__Content--bottomLeft,
.Slideshow__Content--bottomCenter,
.Slideshow__Content--bottomRight {
  top: auto;
  bottom: 70px;
  left: 0;
  transform: none;
}

.js .Slideshow__Content .SectionHeader {
  opacity: 0;
}

.Slideshow__ScrollButton {
  position: absolute;
  left: calc(50% - 25px);
  bottom: -25px;
}

.Slideshow__Carousel--withScrollButton {
  margin-bottom: 25px;
}

.Slideshow--fullscreen {
  .Slideshow__ScrollButton {
    bottom: 10px;
  }

  .Slideshow__Carousel--withScrollButton {
    max-height: calc(100% - 35px);
    margin-bottom: 0;
  }
}

@include av-mq('lap-and-up') {
  .Slideshow__Content {
    padding: 0 70px;
  }
}
/**
 * For now testimonials are only used on home page but may be expanded
 */

@-webkit-keyframes testimonialOpening {
  from {
    visibility: hidden;
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes testimonialOpening {
  from {
    visibility: hidden;
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }
}

@-webkit-keyframes testimonialClosing {
  from {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  to {
    visibility: visible;
    opacity: 0;
    transform: translateY(-15px);
  }
}

@keyframes testimonialClosing {
  from {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  to {
    visibility: visible;
    opacity: 0;
    transform: translateY(-15px);
  }
}

.Testimonial {
  text-align: center;
  font-size: to-size(18px);
}

.Testimonial__Logo {
  margin-top: 54px;
}

.js .TestimonialList {
  opacity: 0;
  transition: opacity 0s linear 0.5s;

  &.flickity-enabled {
    opacity: 1;
  }

  .flickity-viewport {
    overflow: visible;
  }

  .flickity-page-dots {
    position: relative;
    margin-top: 60px;
  }

  .Testimonial {
    opacity: 0;
    visibility: hidden;
    -webkit-animation: testimonialClosing 0.4s cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards;
    animation: testimonialClosing 0.4s cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards;
  }

  .Testimonial.is-selected {
    opacity: 0;
    visibility: hidden;
    -webkit-animation: testimonialOpening 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s forwards;
    animation: testimonialOpening 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s forwards;
  }
}

@include av-mq('phone') {
  .Testimonial__Logo {
    max-width: 110px;
  }
}

@include av-mq('tablet-and-up') {
  .Testimonial {
    font-size: to-size(20px);
  }

  .Testimonial__Content {
    max-width: 550px;
    margin: 0 auto;
  }

  .Testimonial__Logo,
  .TestimonialNav__Item {
    max-width: 150px;
  }
}

@include av-mq('lap-and-up') {
  .TestimonialList--withNav .flickity-page-dots {
    display: none;
  }

  .TestimonialNav {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 70px;
  }

  .TestimonialNav__Item {
    margin: 0 25px;
    cursor: pointer;
    opacity: 0.25;
    transition: opacity 0.2s ease-in-out;
    will-change: opacity;
  }

  .TestimonialNav__Item.is-selected {
    opacity: 1;
  }
}

@include av-mq('desk') {
  .TestimonialNav__Item {
    margin: 0 45px;
  }
}
/**
 * ----------------------------------------------------------------------------
 * For now timeline are only used on home page but may be expanded
 * ----------------------------------------------------------------------------
 */

.Timeline {
  box-shadow: 0 -2px 10px rgba(#363636, 0.2);
}

.Timeline__ListItem {
  position: relative;
  height: 540px;
  text-shadow: 0 1px rgba(#000000, 0.5);
}

.Timeline__Item {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  opacity: 0;
  background: rgba(#363636, 0.2);
  pointer-events: none;
  transition: opacity 0.5s ease-in-out;
}

.Timeline__ImageWrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.Timeline__Image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transform: translateX(-50px) scale(1.1);
  transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.Timeline__Inner {
  position: relative;
  padding: 80px 14px 40px 14px;
  max-height: 100%;
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.Timeline__Header > * {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;
}

.Timeline__Header > .SectionHeader__Description {
  transform: translateY(50px);
}

.Timeline__Item.is-selected {
  opacity: 1;
  pointer-events: auto;

  .Timeline__Image {
    transform: translateX(0) scale(1.1);
  }

  .Timeline__Header > * {
    opacity: 1;
    transition-delay: 0.5s;
    transform: translateY(0);
  }
}

@include av-mq('phone') {
  .shopify-section--timeline {
    border-top: none !important;
  }

  .shopify-section--timeline .Section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .shopify-section--timeline .Container {
    padding-left: 0;
    padding-right: 0;
  }

  .Timeline__Header .Heading,
  .Timeline__Header .Rte a {
    color: inherit;
  }

  .Timeline__Header .SectionHeader__Description {
    margin: 34px 30px 0 30px;
  }
}

@include av-mq('tablet-and-up') {
  .Timeline__ListItem {
    max-width: 1230px;
    margin: 0 auto;
    height: 400px;
    text-shadow: none;
  }

  .Timeline__Item {
    align-items: flex-end;
    background-color: $light-background;
  }

  .Timeline__ImageWrapper,
  .Timeline__Inner {
    flex: none;
    width: 50%;
  }

  .Timeline__ImageWrapper {
    position: relative;
    height: 100%;

    &::after {
      display: none; /* Remove any contrast that may have been added to image */
    }
  }

  .Timeline__Image {
    transform: translateX(-60px) scale(1.1);
  }

  .Timeline__Inner {
    padding: 34px 40px;
    color: $text-color;
  }

  .Timeline__Header {
    text-align: left;
  }
}

@include av-mq('lap-and-up') {
  .Timeline__ListItem {
    height: 515px;
  }

  .Timeline__Inner {
    padding: 54px 60px;
  }
}

/**
 * ----------------------------------------------------------------------------
 * Timeline nav
 * ----------------------------------------------------------------------------
 */

.Timeline__Nav {
  position: relative;
  font-size: to-size(11px);
  font-family: $heading-font-family;
  font-weight: $heading-font-weight;
  font-style: $heading-font-style;
  letter-spacing: 0.2em;
  color: $text-color-light;
  background: $light-background;
}

.Timeline__NavWrapper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  overflow: auto;
}

.Timeline__NavWrapper--center {
  justify-content: center;
}

.Timeline__NavItem {
  position: relative;
  padding: 30px 20px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  letter-spacing: inherit;
  vertical-align: text-bottom;
  transition: all 0.25s ease-in-out;

  &::after {
    position: absolute;
    content: '';
    bottom: 0;
    left: 20px;
    height: 3px;
    width: calc(100% - 40px - 0.2em);
    opacity: 0;
    background: $text-color;
    transform: scale(0, 1);
    transform-origin: left center;
    transition: opacity 0.3s, transform 0.3s;
  }
}

.Timeline__NavItem.is-selected {
  font-size: to-size(18px);
  color: $text-color;

  &::after {
    opacity: 1;
    transform: scale(1, 1);
  }
}

.Timeline__NavLabel {
  display: block;
  line-height: 0;
}

@include av-mq('tablet-and-up') {
  .Timeline {
    box-shadow: none;
  }

  .Timeline__Nav {
    margin-top: 40px;
    background: none;
    font-size: to-size(12px);
  }

  .Timeline__NavWrapper {
    display: block;
    text-align: center;
  }

  .Timeline__NavItem {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

@include av-mq('desk') {
  .Timeline__Nav {
    margin-top: 65px;
  }
}

.Header {background: rgba(10, 1, 0, 0.84);}


.ProductItem__ImageWrapper {
    background: #fff;}
.ProductItem__Title {
    font-size: 16px;
}

#shopify-section-1576019966149 .FeatureText__ImageWrapper{padding: 2px 15px;}
.Header__MainNav .u-h6, .Header__MainNav .Rte h6, .Rte .Header__MainNav h6{font-size: 13px;font-weight: 400;letter-spacing: 2px;}
.FeatureText--withImage .FeatureText__ImageWrapper {
    padding: 20px 50px;
}

@media screen and (max-width: 1240px){   .Header--logoLeft .Header__FlexItem--logo{order: -1;margin-right:8px;}}

@media screen and (max-width: 767px){
.FeatureText--withImage .FeatureText__ImageWrapper {padding: 20px 10px;}
.FeatureText__ContentWrapper {padding-left: 10px;padding-right: 10px;text-align: justify;font-size: 13px;}  
}

@media screen and (max-width: 640px){
    .ImageHero iframe {height:120%;}
   .FeatureText--withImage .FeatureText__ImageWrapper {padding: 20px 10px;}
   .FeatureText__ContentWrapper {padding-left: 10px;padding-right: 10px;text-align: justify;font-size: 13px;}
   .SectionHeader:not(:only-child) {margin-bottom: 20px;}
   .FeatureText--withImage .FeatureText__ContentWrapper {padding-top: 25px;padding-bottom: 20px;}
   .SectionHeader__Heading.SectionHeader__Heading{font-size:17px;letter-spacing: 2px;}
   .FeatureText .SectionHeader__Description {margin-top: 10px;}
   .Button{letter-spacing: 0.1em;}
   .zdzheadingznew {padding-top: 20px !important;}
   .shopify-section--bordered > .Section--spacingNormal {padding: 25px 0;}
   #shopify-section-1576019966149 > section {padding: 0px !important;}
   #shopify-section-1576019966149 .FeatureText .SectionHeader__Description {margin-bottom: 0px !important;}
   .Testimonial {text-align: center;font-size: 14px;}
   .Header--logoLeft .Header__FlexItem--logo{order: -1;margin-right:8px;}
   .Header--logoLeft .Header__FlexItem--logo img{width: 78px;}
   .Header__Wrapper {padding: 7px 14px;}
}



#shopify-section-1576019966149{    background: #0c0100;
background: -webkit-linear-gradient(to bottom, #180303, #030303);
background: linear-gradient(to bottom, #180303, #030303); }
#shopify-section-1576019966149 .SectionHeader__Heading{color:#f9030f;}
#shopify-section-1576019966149 .SectionHeader__Description{color:#fff;}
#shopify-section-1576019966149 > section{    padding:30px 0px;}
#shopify-section-collection-template .SectionHeader__Description  h5 {
    font-size: 13px;
    letter-spacing: 3px;
    color: #6b6b6b;
}
.ProductItem__Label {
    font-size: 10px;
    letter-spacing: 2px;
    background: #bb050e;
    color: #fff;
}
#shopify-section-collection-template .ProductItem__ImageWrapper {
    background: #f9f9f9;
}

#shopify-section-template--18785263845510__image_with_text_qia99q .FeatureText--imageLeft{
background: #f9f9f9;
background: -webkit-linear-gradient(to top, #ffffff, #f9f9f9, #d2d2d2);  
background: linear-gradient(to top, #ffffff, #f9f9f9, #d2d2d2);
border-top: 5px solid #c2c2c2;  
  
}
.ProductItem__Title {
    letter-spacing: 0.05em;
}

#shopify-section-collection-template .SectionHeader__Description h5 {
    letter-spacing: 1px;
    text-transform: initial;}

.create-wholesale-account_title { display:none }
[for="RegisterForm-FirstName"]:after,
[for="RegisterForm-LastName"]:after,
[for="RegisterForm-email"]:after,
[for="RegisterForm-password"]:after {
  content: '*';
  color: #c10000;
}


/*********************************************************************************/

.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 540px;
  background-color: #555;
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 10px 10px;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: 5px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: 5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

#shopify-section-1612470804ef8bf7a5 iframe {max-width: 100%;    margin: 0 auto;    left: 50%;      width: 31%;}
.custom_image_banner img{max-width:100%;}

.shopify-policy__title h1{font-weight: 400; text-transform: uppercase; 
font-size: 19px; letter-spacing: .2em; font-family: Helvetica, Arial, sans-serif;}


.Heading {font-family: Helvetica, Arial, sans-serif;}
.testimonials-text-ss-testimonial-12{font-family: Helvetica, Arial, sans-serif;}
h1,h2,h3,h4,h5,h6,h7{font-family: Helvetica, Arial, sans-serif;}



@media screen and (min-width:1200px){
#shopify-section-1612470804ef8bf7a5 iframe { transform: translateX(-50%); }
}


/* @media screen and (min-width:750px) and (max-width: 1240px){
.Header--logoLeft .Header__FlexItem--logo {order: initial;}
} */




@media screen and (min-width:750px){
.template-index .VideoWrapper iframe {max-width: 100%;    margin: 0 auto;    left: 50%;    transform: translateX(-50%);    width: 31%;}
.VideoWrapper iframe{max-width: 100%;    margin: 0 auto;    left: 50%;    transform: translateX(-50%);    width: 31%;}
.fera-reviews-header, .fera-reviews-body{max-width: 76% !important;}

.Form__Submit.Button{width: 30%; margin:0 auto;}
#footer-newsletter .Form__Submit.Button{width: 50%; margin-top:10px;}
 .ProductForm__AddToCart{margin-bottom: 15px; width: 30%;}
.specify_skin{font-size:12px;}

.testimonials-heading-template--18785263845510__ss_testimonial_12_mkarEi,
.testimonials-heading-ss_testimonial_12_BKnRC8 h2, .jdgm-rev-widg__title,
.testimonials-heading-template--18785264074886__ss_testimonial_12_Ff8TWC,
#shopify-section-template--18785263845510__featured-collections-2 .SectionHeader__Heading,
#shopify-section-template--18785263845510__featured_collections_MtzXpB .SectionHeader__Heading ,
#shopify-section-template--18785264074886__featured_collections_zi3ifP .SectionHeader__Heading ,
.testimonials-heading-ss-testimonial-12 h2{text-transform: uppercase; 
 font-size:34px !important; letter-spacing: 5px;}


}


@media screen and (max-width:749px){
#shopify-section-1612470804ef8bf7a5 .VideoWrapper{height: 100%;}
.template-index .VideoWrapper {height: 100%;}
#shopify-section-1612470804ef8bf7a5 iframe {width: 85%; height: 75%;}
.Product__Info iframe {max-width: 100%; width: 85%; height: 75%;}
.template-index .vidframe{max-width: 100%; margin-left:0 !important;}

.VideoWrapper {height: 75%;}
.VideoWrapper iframe{width: 85%; height: 100%; margin: 0 auto; left: 50%; transform: translateX(-50%); }

  .tooltip{border-bottom: none;}
  .tooltip .tooltiptext{left: 0%; width: 275px;}

 .shopify-policy__title h1{font-size: 17px; letter-spacing: 2px;}
 .ProductForm__Variants, .ProductForm__AddToCart{margin-bottom: 12px;}
 .ProductMeta__PriceList{margin-top: 12px !important;}
 .ProductForm{display: flex;  flex-wrap: wrap; padding:0; justify-content: center; align-items: center; margin-top: 12px !important;}
 .ProductForm__AddToCart {width:45%; margin-left:3%;}
 /* .QuantitySelector {display: block;} */
 .Product__Gallery{margin-bottom: 18px;}
.specify_skin{font-size:11px;}

.testimonials-heading-ss_testimonial_12_BKnRC8 h2, .jdgm-rev-widg__title,
#shopify-section-featured-collections .SectionHeader__Heading,
.testimonials-heading-ss-testimonial-12 h2{text-transform: uppercase; 
 font-size:17px !important; letter-spacing: 2px;}

/* #shopify-section-featured-collections .SectionHeader__Heading{font-size:18px !important;}
 .jdgm-rev-widg__title{letter-spacing: 1px;} */

}
/* Final Alignment for Quantity and Shop Pay Button */
.product-form {
  display: flex !important;
  flex-wrap: nowrap !important; /* Locks them side-by-side */
  align-items: center !important; /* Forces perfect vertical line */
  gap: 25px !important; /* Forces a large gap between them */
}

/* Shrinks the quantity box so it stops eating up mobile space */
.product-form__quantity {
  flex: 0 0 auto !important;
  max-width: 80px !important; /* Constrains the width of the box */
  margin-bottom: 0 !important;
}

/* Fixes button size on desktop and adjusts position */
.shopify-payment-button {
  flex: 1 !important;
  max-width: 250px !important; 
  margin-top: 0 !important;
}

/* Specific aggressive overrides for mobile screens */
@media screen and (max-width: 749px) {
  .product-form {
    gap: 15px !important; /* Hard-coded gap on mobile */
  }
  .product-form__quantity {
    max-width: 70px !important; /* Even smaller for small phones */
  }
  .shopify-payment-button {
    max-width: 100% !important;
    transform: translateY(-4px) !important; /* Nudges it up aggressively to line up */
  }
}

@media screen and (min-width:750px)
{
#myVideo{max-height: 93vh;    object-fit: cover;}
}
.AnnouncementBar {
  padding: 4px 0 !important;
  min-height: 0 !important;
  line-height: 1 !important;
}

.AnnouncementBar__Wrapper {
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
}

.AnnouncementBar__Content {
  font-family: var(--heading-font-family), sans-serif !important;
  font-weight: 500 !important; /* Slightly thinner for mobile */
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  font-size: 10px !important;  /* One size smaller for mobile */
  line-height: 1 !important;
  display: block !important;
  margin: 0 0 -3px 0 !important; /* Forces vertical centering on mobile */
}

@media screen and (min-width: 641px) {
  .AnnouncementBar__Content {
    font-size: 16px !important; /* Keeps your desktop size */
    font-weight: 600 !important; /* Keeps your desktop thickness */
    margin-bottom: 0 !important;
  }
}
/* MOBILE HEADER: Solid Matte Black Fix */
@media screen and (max-width: 640px) {
  .Header {
    background: #111111 !important; /* Rich Matte Black - 100% Solid to kill the brown */
    padding-bottom: 0 !important;
  }
  
  .Header__Wrapper {
    padding-bottom: 0 !important;
  }

  .Header__LogoLink {
    margin-bottom: -15px !important; /* Aggressively sucks the bottom up */
    display: block !important;
  }
}

/* DESKTOP HEADER: Keep solid */
@media screen and (min-width: 641px) {
  .Header {
    background: #111111 !important;
  }
}






/* Popup */
* {box-sizing: border-box; }
html,body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; }
.nuo-upsy-nuo-upsy-upellifyPopupMain {background-color: rgb(0 0 0 / 50%); position: fixed; height: 100%; width: 100%; top: 0; left: 0; bottom: 0; right: 0; overflow: auto; z-index: 100000; padding-top: 8rem; padding-bottom: 8rem;}
.nuo-upsy-upellifyPopup {background: #fff; max-width: 800px; min-height: 320px; margin: auto; position: relative; width: 100%; }
.nuo-upsy-upellifyPopupBody {max-height: 56vh; overflow: auto;margin: 0 4px 0 0;}
.nuo-upsy-upellifyPopupBody::-webkit-scrollbar {width: 7px; }
.nuo-upsy-upellifyPopupBody::-webkit-scrollbar-track {background-color: transparent; }
.nuo-upsy-upellifyPopupBody::-webkit-scrollbar-thumb {background-color: #808080;border-radius: 6px; }

/* Upsellify Popup Header css*/ 
.nuo-upsy-upellifyPopupHeader {padding: 20px 10px; }
.nuo-upsy-upellifyPopupHeader h2 {font-size: 24px; margin: 0; text-align: center; padding: 0; line-height: normal; letter-spacing: 0; display: block;font-weight: normal; }
.nuo-upsy-upellifyPopupHeader h3 {font-size: 18px;text-align: center;margin: 10px 0 0 0;}
/* Upsellify Popup Header css*/

        
/* Upsellify Popup Main product css*/
.nuo-upsy-upellifyMainProduct {background: #f6f6f6; padding: 1rem 2rem; display: flex; align-items: center; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox {width: 3rem; position: relative; margin-right: 1.5rem; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox img {max-width: none; width: 3rem; height: 3rem; object-fit: cover; display: block; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox .greenCircle {background: #50b83c; height: 15px; width: 15px; position: absolute; top: -5px; right: -5px; border-radius: 15px; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox .greenCircle:after {content: ""; border: 2px solid #fff; height: 7px; width: 3px; position: absolute; border-width: 0px 1px 1px 0; left: 6px; top: 3px; transform: rotate(40deg); }
.nuo-upsy-upellifyMainProduct .nuo-upsy-productName {font-size: 14px; font-weight: 600; margin: 0 0 0 0; line-height: normal; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-productPrice {font-size: 14px; line-height: normal; font-weight: 400;letter-spacing: 0; } 
.nuo-upsy-upellifyMainProduct .nuo-upsy-productName .upsell-product-link {color: inherit;text-transform: capitalize;text-decoration: none;letter-spacing: 0;}

/* Upsellify Popup other products css*/
.nuo-upsy-upellifyItem{padding-top: 2rem;position: relative;border-left: 1px solid #e6e6e6;list-style: none;list-style-type: none;margin-left: 1rem;}
.nuo-upsy-upellifyItem:last-child {border: none; }
.nuo-upsy-upellifyItemInner{padding-bottom: 1.5rem;padding-right: 1.5rem;margin: 0;display: flex;justify-content: space-between;align-items: start;}
.nuo-upsy-upellifyItemInner.addedOpacity{opacity: 0.5;}
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc {display: flex; align-items: start; position: relative; padding-right: 4rem; margin: 0; justify-content: flex-start; width: 100%;}
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox {padding: 0 1.5rem; position: relative; cursor: pointer; }
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox .nuo-upsy-imgBoxInner {width: 3rem; min-width: 3rem; height: 3rem; position: relative;display: flex; flex-direction: column; justify-content: center;     border: 1px solid #e6e6e6;}
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox .nuo-upsy-imgBoxInner img {height: 3rem; width: auto; object-fit: cover; }
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox:before {content: ""; position: absolute; background: #e6e6e6; height: 1px; width: 2rem; left: 0; top: 50%; }
.nuo-upsy-upellifyItem:last-child .nuo-upsy-imgBox:before {height: 162%; top: -33px; background: transparent; border: 1px solid #e6e6e6; border-width: 0 0 1px 1px; border-radius: 0 0 0 10px; } 
.nuo-upsy-upellifyOtherProducts ul {margin: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction{display: flex;align-items: center;position: relative;}
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantitySelector {position: relative; margin-right: 1rem; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantitySelector input {width: 5rem; padding: 1.1rem 1rem; color: #515151; font-size: 14px; line-height: 20px; height: 1rem; border: 1px solid #e6e6e6; appearance: none; } 
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantityButtonWrap {position: absolute; width: 2rem; top: 0; right: 0; height: 100%; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantityButtonWrap button {transition: .1s all; border: 1px solid #e6e6e6; width: 100%; height: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button {background: #000; transition-duration: .1s; transition-property: background-color,border-color,color,fill,stroke; width: 100%; text-transform: inherit; display: flex; align-items: center; justify-content: center; color: #fff; padding:0.4rem 1.3rem 0.4rem 1rem; font-size: 14px; line-height: 20px; font-weight: 600; border: 1px solid #000; cursor: pointer;font-family: inherit; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button:hover {opacity: 0.7; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button svg {width: 1.5rem; margin: 0 5px 0 0; } 
.nuo-upsy-upellifyItem .nuo-upsy-infoBox .nuo-upsy-productName {font-size: 14px; font-weight: 600; line-height: normal;letter-spacing: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-infoBox .nuo-upsy-productName .upsell-product-link {color: inherit;text-transform: capitalize;text-decoration: none;}
.nuo-upsy-upellifyItem .nuo-upsy-productPrice {font-size: 14px; line-height: normal; margin: 0; padding: 0; font-family: inherit; font-weight: normal;letter-spacing: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-productPrice .nuo-upsy-compare {color: #7f7f7f; text-decoration: line-through; padding: 0 5px 0 0; }
.nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap {position: relative; margin: 15px 0 0 0; }
.nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap:after {position: absolute; border: 1px solid #000; border-width: 1px 1px 0 0; content: ""; height: 6px; width: 6px; right: 10px; transform: rotate(135deg); top: 12px; }
.nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap select {background:#fff;height: 35px; border: 1px solid #e6e6e6; padding: 0 25px 0 10px; appearance: none; font-size: 14px; width: 100%; position: relative;font-family: inherit;text-indent: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-infoBox {width: 100%; max-width: 250px;}
.nuo-upsy-upellifyPopupClose svg {position: absolute; right: 10px; top: 10px;cursor:pointer; }
.nuo-upsy-upellifyPopupClose svg path {fill: #ccc; }
.nuo-upsy-upellifyPopupClose svg:hover path{fill: #000;}

.nuo-upsy-product-original-price {text-decoration: line-through; }
/* Upsellify Popup other products css*/

.nuo-upsy-upellifyPopupFooter button {display: flex; align-items: center; justify-content: center; width: auto; padding: 8px 20px; font-size: 14px; line-height: 20px; font-family: inherit; background: #000; border: 1px solid #000; color: #fff; text-transform: inherit; font-weight: 600; }
.nuo-upsy-upellifyPopupFooter button:hover{opacity: 0.7;}
.nuo-upsy-upellifyPopupFooter button svg {width: 20px; height: 20px; margin: 0 0 0 3px; }
.nuo-upsy-upellifyPopupFooter {display: flex; align-items: center; justify-content: flex-end; padding: 1rem 2.1rem; border-top: 1px solid #e6e6e6; }
.nuo-upsy-now-no-thanks {color: #989898;font-size: 14px;text-transform: inherit;font-weight: 500;letter-spacing: 0;text-decoration: none;margin: 0 20px 0 0;position: absolute;left: 20px;}
.nuo-upsy-upellifyPopupFooter button.nuo-upsy-checkout {margin: 0 0 0 10px;}


/* Green checkmark */
.nuo-upsy-imgBox svg {width: 15px; height: 15px;stroke: #fff; stroke-width: 5px; position: absolute; right: -7px; top: -5px; border-radius: 50%; display: block; }
.nuo-upsy-imgBox svg circle {stroke: #50b83c; stroke-width: 2px; }
.nuo-upsy-animated-checkmark--finished {box-shadow: inset 0 0 0 30px #50b83c; }
.nuo-upsy-origin-center {-webkit-transform-origin: center; transform-origin: center; }
.nuo-upsy-animated-arrow--finished>circle, .nuo-upsy-animated-arrow--finished>path, .nuo-upsy-animated-checkmark--finished>circle, .nuo-upsy-animated-checkmark--finished>path {stroke-dashoffset: 0; -webkit-transform: translate(0); transform: translate(0); }
.checkmark__check {-webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48; -webkit-animation: animated-stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards; animation: animated-stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards; }
.checkmark__circle {stroke-dasharray: 166; stroke-dashoffset: 166; stroke-miterlimit: 10; fill: none; -webkit-animation: animated-stroke .6s cubic-bezier(.65,0,.45,1); animation: animated-stroke .6s cubic-bezier(.65,0,.45,1); }

/* Badges */
.nuo-upsy-badge-wrap span {
    background: #000;
    color: #fff;
    font-size: 10px;
    font-weight: normal;
    line-height: normal;
    padding: 0px 5px 2px 5px;
    border-radius: 10px;
    border: 1px solid #000;
}

@media only screen and (max-width: 600px) {
  .nuo-upsy-upellifyOtherProducts ul {padding: 0; }
  .nuo-upsy-upellifyItem {margin: 0; border: none;padding: 1rem 0; }
  .nuo-upsy-upellifyMainProduct {padding: 1rem 1rem;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductDesc {width: 100%; padding: 0; } 
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction{width: 100%;padding: 0.5rem 1rem;}
  .nuo-upsy-upellifyItemInner{padding: 0;display: block;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox {padding: 0 1rem;}
  .nuo-upsy-upellifyItem .nuo-upsy-atcButton {width: 100%;margin: 8px 0 0 0; }
  .nuo-upsy-upellifyItem .nuo-upsy-infoBox {width: 100%; max-width: 100%; padding-right: 1rem; }
  .nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox:before{display: none;}
  .nuo-upsy-nuo-upsy-upellifyPopupMain{padding: 0;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantityButtonWrap{display: none;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantitySelector input {padding: 0.9rem 0.4rem;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button {padding: 0.4rem 1.3rem 0.4rem 1rem; font-size: 14px;line-height: 22px;}
  .nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap select {height: 32px; font-size: 12px; }
  .nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap:after{top: 12px;}
  .nuo-upsy-upellifyPopupFooter button {padding: 5px 15px; font-size: 12px;}
  .nuo-upsy-now-no-thanks {font-size: 12px;margin: 0 15px 0 0;left: 10px;}
  .nuo-upsy-upellifyPopupBody {margin: 0;}
  .nuo-upsy-upellifyPopupFooter {padding: 1rem 1.1rem;}
  .nuo-upsy-upellifyPopupHeader h2 {word-break: break-word;}
  .nuo-upsy-upellifyItem .nuo-upsy-infoBox .nuo-upsy-productName .upsell-product-link,
  .nuo-upsy-upellifyMainProduct .nuo-upsy-productName .upsell-product-link{margin: 0 0 5px 0;display: block;}
  .nuo-upsy-upellifyPopupBody::-webkit-scrollbar {width: 7px !important;}
}



/* FBT */
.nuo-upsy-upsellifyFbtContainer {max-width: 1170px; padding: 0 30px 50px; margin: 0 auto; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtHeading h2 {font-size: 24px; margin: 30px 0; line-height: normal; letter-spacing: 0; font-weight: 600; }
.nuo-upsy-upsellifyFbtContainer .text-center{text-align: center;}
.nuo-upsy-upsellifyFbtContainer .text-left{text-align: left;}
.nuo-upsy-upsellifyFbtContainer .text-right{text-align: right;}

/* Two  Products */
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 40%;}
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 45%;}
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtPlusSign {width: 10%;}

/* One product */
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_1 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 20%;}
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_1 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 100%;}

/* Four product */
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_4 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 21%;}

/* Css for image section */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow {display: flex; align-items: center; flex-wrap: wrap; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtProductBgImage {display: block; width: 100%; height: 100%; background-repeat: no-repeat  !important; background-size: contain !important; background-position: center center  !important; padding: 0; max-width: 100%; background: #fff; padding-top: 100%;border: 1px solid #ededed; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtProductBgImage.nuo-upsy-fbtProductBgImageHover {position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: auto; width: 100%; opacity: 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 60%; display: flex; flex-wrap: wrap; align-items: center;} 
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtATCBox {width: 14%; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtPlusSign {width: 5%; margin: 0; font-size: 30px;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 30%;position: relative;cursor: pointer;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtEqualSign {width: 6%; font-size: 30px;padding: 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtAddtocart button {background: #000; color: #fff; padding: 15px 30px; border: none; border-radius: 0; font-size: 16px;text-transform: uppercase; line-height: normal; letter-spacing: 0;width: 100%;cursor:pointer;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtTotalPrice {margin: 0 0 10px 0; font-size: 20px; line-height: normal; padding: 0;font-weight: 600;font-family: inherit; }

/* Css for description section */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow {display: block; margin: 30px 0 0 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox {display: flex; align-items: center; flex-wrap: wrap; position: relative;margin: 0 0 10px 0;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox label {position: absolute; border: 1px solid #000; height: 20px; width: 20px; left: 0; border-radius: 2px; background: #000;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox input#fbtCheckBox:checked~label:before {position: absolute; content: ""; border: 2px solid #fff; height: 10px; width: 5px; border-top: 0; border-left: 0; left: 7px; top: 2px; transform: rotate(37deg); }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox input#fbtCheckBox {margin: 0; height: 20px; width: 20px; opacity: 0; z-index: 1; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle a {font-size: 16px; padding: 0 15px; margin: 0; line-height: normal; font-weight: normal; letter-spacing: 0; font-family: inherit;    color: inherit;text-decoration: none; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductVariantSelector {min-width: 100px; height: 30px; border: 1px solid #e5e5e5; padding: 0 20px 0 5px; font-size: 12px; margin: 0 15px 0 0; appearance: none; -webkit-appearance: none; background: transparent; background-image: none !important; position: relative;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductVariantSelector:after {position: absolute; content: ""; height: 20px; width: 20px; border: 1px solid #000; right: 8px; z-index: 1; top: 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice {font-size: 14px; line-height: normal; font-weight: normal; letter-spacing: 0; padding: 0 15px 0 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle{margin:0;}
.nuo-upsy-product-variant-field:not([disabled]) {
    cursor: pointer;
}

.nuo-upsy-product-variant-field {
    font-size: 1em !important;
    line-height: 1.2 !important;
    margin: 0 10px 0 0 !important;
    min-width: 70px !important;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath fill='%23666' d='M0 0l3.5 4.4C3.7 4.4 7.1 0 7.1 0H0z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-color: rgb(255, 255, 255) !important;
    background-size: initial !important;
    padding: 8px 28px 8px 14px !important;
    border-radius: 0px;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

@media screen and (max-width: 1024px) {
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 74%; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtATCBox {width: 20%;}
}
@media screen and (max-width: 600px) {
  .nuo-upsy-upsellifyFbtContainer {padding: 0 10px 30px;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtPlusSign {width: 5%; margin: 0 5px; font-size: 20px; } 
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 27%;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtEqualSign {width: 5%; font-size: 25px; padding: 0 15px; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtATCBox {width: 100%; margin: 20px 0 0 0; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap,
  .nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 91%;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox label { top: 2px; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle {padding: 0 15px 5px 5px;max-width: 300px;text-align: left !important;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox {margin: 0 0 20px 0;}
  .nuo-upsy-product-variant-field {padding: 8px 28px 8px 10px!important;margin: 0 0 5px 0 !important;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice {padding: 0 15px 5px 0;}
  .nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox{width:43%;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-product-variant-field {padding: 5px 28px 5px 10px!important;margin: 0 10px 5px 0!important;}
  .nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_4 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 19%;}

}

/* Slider Css */

.nuo-upsy-product-slider-container {position: relative;    padding: 14px 0 0 0; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-badge {position: absolute; z-index: 1000; margin: 0; top: 0; right: 5%; font-weight: bold; white-space: nowrap; padding: 4px 12px; font-size: 1em; line-height: 140%; box-shadow: 0px 3px 4px rgb(0 0 0 / 25%); background: linear-gradient(90deg, rgba(68, 54, 229, 1), rgba(68, 54, 229, 0.347) 100%); color: #ffffff; border-radius: 4px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-card {border: 1px solid; border-color: #373854; border-radius: 8px; background: #1E1D30; display: flex; position: relative; flex-direction: row; width: 100%; height: 100%; text-align: left; overflow: hidden; padding: 16px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-img-wrapper {display: flex; align-self: center; overflow: hidden; max-width: 27%; min-width: 48px; border-radius: 8px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-img-wrapper img{width: 100%;height: auto;}
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-content-wrapper {display: flex; flex-direction: column; justify-content: center; align-self: center; width: 100%; padding: 8px 8px 8px 20px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-product-name {display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 4px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-product-name h2 {margin: 0; font-size: 16px; line-height: inherit; color: #ffffff; font-weight: bold; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-product-name h2 a {color: inherit; text-decoration: none; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-variants {width:100%;background: transparent; color: #959595; border: 1px solid #fff; padding: 8px 10px; border-radius: 4px; font-size: 12px; -webkit-apperance: none; appearance: none; margin: 0 0 20px 0; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-atc {font-weight: normal; border-radius: 4px; color: #ffffff; background: linear-gradient(90deg, rgba(68, 54, 229, 1), rgba(68, 54, 229, 0.347) 100%); border: 0px solid #000000; position: relative; cursor: pointer; display: flex; line-height: 100%; letter-spacing: 1px; padding: 10px 16px; font-size: 11px; flex-direction: row; width: max-content; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; outline: none; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-atc-text {margin-right: 10px; } 
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-pricing {border-left: 1px solid #ffffff; padding-left: 10px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-compared-price {text-decoration: line-through; opacity: 0.75; margin-left: 6px; }
.nuo-upsy-product-wrapper {
    position: relative;
}
.nuo-upsy-product-slider-arrow-container {
    background-image: url(https://cdn.shopify.com/s/files/1/0608/8330/4620/t/1/assets/right-arrow-black.png?v=1651386900);
    height: 10px;
    width: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: -27px;
    top: 50%;
  cursor:pointer;
}
.nuo-upsy-product-slider .slick-dots li button:before{display:none;}
.nuo-upsy-product-slider .slick-dots { bottom: -30px;}
.nuo-upsy-product-slider .slick-dots li button {
    background-color: #4937ff;
    border-radius: 100%;
    margin: 0;
    width: 6px;
    height: 6px;
    opacity: 0.5;
    transition: transform 0.2s ease-out, margin 0.2s ease-out, opacity 0.2s ease-out;
  padding:0;
}
.nuo-upsy-product-slider .slick-dots li.slick-active button {
    opacity: 1;
    transform: scale3d(1.3, 1.3, 1);
    margin: 0;
}
.nuo-upsy-product-slider-select-wrapper {
    position: relative;
}
.nuo-upsy-product-slider-select-wrapper:after {
    content: "";
    position: absolute;
    border: 1px solid #fff;
    height: 10px;
    width: 10px;
    top: 8px;
    right: 12px;
    border-width: 0px 1px 1px 0px;
    transform: rotate(45deg);
    border-radius: 2px;
}
.nuo-upsy-product-slider .slick-dots li {
    width: auto;
    height: auto;
}
.nuo-upsy-product-heading h2 {
    font-size: 18px;
    font-weight: 600;
      text-align: center;
    margin: 15px 0 30px 0;
}
.nuo-upsy-product-slider-atc-loader{stroke:#fff;}
.nuo-upsy-product-slider-atc-loader, .nuo-upsy-product-slider-atc-check {
    display: none;
    position: absolute;
    height: 70%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.nuo-upsy-product-slider-atc-check{fill:#fff;}
.nuo-upsy-product-slider-atc-loader svg, .nuo-upsy-product-slider-atc-check svg{
  width: 100%;
    height: 100%;
}

.nuo-upsy-product-slider-toast-container {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  top:-30px;
    margin-bottom: 12px;
    color: #f6f6f6;
    z-index: 1000000000;
}
.nuo-upsy-product-slider-toast--success {
    background: #22663f;
}

.nuo-upsy-product-slider-toast {
    display: flex;
    flex-direction: row;
    align-items: center;
    border-radius: 4px;
    margin-top: 20px;
    animation: toast-fadeinup 0.3s ease-in forwards;
    transform: translateY(25%);
    box-shadow: 0 3px 7px 0 rgb(0 0 0 / 25%);
}
.nuo-upsy-product-slider-toast--disappear {
    transform: translateY(0);
    animation: toast-fadeoutdown 0.3s forwards;
    animation-delay: 0.25s;
}
.nuo-upsy-product-slider-toast-icon {
    font-size: 18px;
    margin-left: 12px;
    opacity: 0;
    animation: toast-fadeinup 0.3s forwards;
    animation-delay: 0.3s;
  display:flex;
}
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-icon, 
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-message {
    animation: toast-fadeoutdown 0.3s forwards;
    opacity: 1;
    transform: translateY(0);
}
.nuo-upsy-product-slider-toast-message {
    font-size: 14px;
    line-height: 160%;
    margin: 0 14px 0 8px;
    padding: 12px 0;
    opacity: 0;
    animation: toast-fadeinup 0.3s forwards;
    animation-delay: 0.25s;
}
.nuo-upsy-product-slider-toast--error {
    background: #78222c;
}
.nuo-upsy-product-slider-toast-icon {
    font-size: 18px;
    margin-left: 12px;
    opacity: 0;
    animation: toast-fadeinup 0.3s forwards;
    animation-delay: 0.3s;
}
.nuo-upsy-product-slider-toast-dismiss {
    display: flex;
    align-self: stretch;
    animation: toast-fadeinleft 0.3s forwards;
    animation-delay: 0.35s;
    opacity: 0;
}
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-dismiss {
    animation: toast-fadeoutright 0.3s forwards;
    opacity: 1;
    transform: translateX(0);
}
.nuo-upsy-product-slider-toast-dismiss__button {
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    padding: 0 4px;
    opacity: 0.35;
    background-color: rgba(0, 0, 0, 0.25);
    transition: opacity 0.2s ease, background-color 0.2s ease;
  border:none;
  cursor:pointer;
}
.nuo-upsy-product-slider-toast-dismiss__button:hover {
    opacity: 0.7;
    background-color: rgba(0, 0, 0, 0.15);
}
.nuo-upsy-product-slider-toast-close__icon {
    font-size: 14px;
}
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-icon,
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-message {
    animation: toast-fadeoutdown 0.3s forwards;
    opacity: 1;
    transform: translateY(0);
}
.nuo-upsy-product-slider-toast-icon svg {
    max-width: 22px;
}
.nuo-upsy-product-slider-toast-dismiss__icon svg {
    max-width: 14px;
}


@keyframes toast-fadeinup {
    from {
        opacity: 0;
        transform: translateY(25%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes toast-fadeoutdown {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(25%);
    }
}

@keyframes toast-fadeinleft {
    from {
        opacity: 0;
        transform: translateX(25%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes toast-fadeoutright {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(25%);
    }
}
/*  Customizable Settings Css  */

/* FBT heading */
.nuo-upsy-upsellifyFbtContainer{font-size: 20px;font-family: inherit;}

/* FBT text */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle a{font-size: 16px;font-family: inherit;}

/* FBT price */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice{font-size: 14px;font-family: inherit;color: #000000;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice span.nuo-upsy-product-price{color: #7f7f7f;}

/*  FBT button */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtAddtocart button{background: #000000;color:#ffffff;font-size: 16px;font-family: inherit;}



/* Popup Heading */
.nuo-upsy-upellifyPopupHeader h2{font-size: 20px;font-family: inherit;}

/* Popp Buttons */
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button{font-size: 14px;font-family: inherit;background: #000000;color:#ffffff; border: 1px solid #000000;}

.nuo-upsy-upellifyPopupFooter button{background: #000000;color:#ffffff; border: 1px solid #000000;}


/* Popup Price */
.nuo-upsy-upellifyItem .nuo-upsy-productPrice{font-size: 14px;font-family: inherit;color: #000000;}
.nuo-upsy-upellifyItem .nuo-upsy-productPrice .nuo-upsy-compare{color: #7f7f7f;}























p.new.h6 {
  color: #f9030f;
}
.announcement-bar.color-scheme.color-scheme--scheme-72a53186-d4be-4f18-bd27-f78ca120b448 {
  padding: 4px 0 !important;
  min-height: 0 !important;
  line-height: 1 !important;
}
@media screen and (min-width: 641px) {
  .AnnouncementBar__Content {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-bottom: 0 !important;
  }
}
.AnnouncementBar__Content {
  font-family: var(--headings-font-family), sans-serif !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  font-size: 10px;
  line-height: 1 !important;
  display: block !important;
  margin: 0 0 -3px;
}
@media screen and (min-width: 700px) {
  .header {
    column-gap: 2.5rem;
    padding: 4px 50px !important;
  }
}
.menu.h6 {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 2px;
}
@media screen and (min-width: 750px) {
  #myVideo {
    max-height: 93vh;
    object-fit: cover;
  }
}



@media screen and (max-width: 600px) {

.header {
    padding: 0px 14px !important;
    height:40px;
}
.header__logo {
    grid-area: logo;
    justify-self: start;
    position: relative;
    top: 15%;
    left: 0px;
}
.image-with-text {
    display: grid;
    overflow: hidden;
    display: flex !important;
    flex-direction: column-reverse;
}
}

/* Mobile header: logo left side of menu icon */
@media screen and (max-width: 699px) {
  x-header.header,
  .header {
    display: grid !important;
    grid-template-columns: auto auto 1fr auto !important;
    align-items: center !important;
    column-gap: 12px !important;
  }

  .header__logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    margin: 0 !important;
  }

  .header__logo img,
  .header__logo-image {
    max-width: 92px !important;
    height: auto !important;
  }

  .header__primary-nav {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: start !important;
  }

  .header__primary-nav > button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .header__secondary-nav {
    grid-column: 4 !important;
    grid-row: 1 !important;
    justify-self: end !important;
  }
}




.Heading {
    font-family: Helvetica, Arial, sans-serif;
}



.button {
    background-color: #2F80ED;
    border-radius: 40px;
    background: linear-gradient(to right, #56ccf2 0%, #2f80ed 51%, #56ccf2 100%) !important;
    border:none !important;
}

*, :before, :after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
  border-color: rgb(var(--border-color));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  scroll-padding-top: var(--sticky-area-height);
  interpolate-size: allow-keywords;
  line-height: 1.5;
}

body {
  background: rgb(var(--page-background));
  font: var(--text-font-style) var(--text-font-weight) var(--text-base) / 1.65 var(--text-font-family);
  letter-spacing: var(--text-letter-spacing);
  margin: 0;
  position: relative;
}

hr {
  border-top-width: 1px;
  justify-self: stretch;
  height: 0;
}

a {
  color: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  font-weight: inherit;
  font-style: inherit;
  line-height: inherit;
  text-transform: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

input[type="submit"] {
  cursor: pointer;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

button, label, summary, [role="button"], [type="checkbox"], [type="radio"] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  cursor: pointer;
}

:-moz-focusring {
  outline: auto;
}

:-moz-ui-invalid {
  box-shadow: none;
}

::-webkit-inner-spin-button {
  height: auto;
}

::-webkit-outer-spin-button {
  height: auto;
}

::-webkit-date-and-time-value {
  text-align: start;
}

[type="date"] {
  min-height: 3rem;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  list-style-type: none;
}

summary::-webkit-details-marker {
  display: none;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ul, ol, menu {
  margin: 0;
  padding: 0;
}

.unstyled-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
  field-sizing: content;
  min-height: 4lh;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: rgb(var(--text-color) / .65);
}

:disabled {
  cursor: default !important;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img {
  color: #0000;
  max-width: 100%;
  height: auto;
}

[role="img"] svg {
  display: initial;
}

picture source {
  display: contents;
}

video {
  max-width: 100%;
  height: auto;
}

:focus:not(:focus-visible) {
  outline: none;
}

[hidden] {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*) {
    animation-duration: 0s;
  }
}

height-observer {
  display: block;
}

.color-scheme {
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  color: rgb(var(--text-color));
  border-color: rgb(var(--border-color));
}

.color-scheme--with-image-overlay {
  --border-color: var(--text-color) / .6;
}

.color-scheme--with-image-overlay .button--outline {
  --border-color: var(--text-color);
}

.accordion {
  box-sizing: content-box;
  display: block;
}

.accordion {
  border-block-width: 1px;
}

.accordion :is(svg) {
  transition: transform .2s;
}

.accordion + .accordion {
  border-block-start-width: 0;
}

.accordion__toggle {
  justify-content: space-between;
  align-items: center;
  column-gap: .625rem;
  padding-block: 1.25rem;
  display: flex;
}

.accordion__content {
  margin-block-start: -.25rem;
  padding-block-end: 1.25rem;
  padding-inline-end: 1.25rem;
}

@media screen and (min-width: 1000px) {
  .accordion__toggle.text-lg {
    padding-block: 1.5rem;
  }

  .accordion--lg .accordion__toggle {
    padding-block: 2rem;
  }

  .accordion--lg .accordion__content {
    margin-block-start: -.5rem;
  }
}

.accordion-group > * + * > .accordion {
  border-block-start-width: 0;
}

.blog-post-card {
  align-content: start;
  gap: 1.25rem;
  display: grid;
}

.blog-post-card__info {
  justify-items: start;
  row-gap: 1rem;
  display: grid;
}

.blog-post-card__meta {
  flex-wrap: wrap;
  align-items: center;
  column-gap: .5rem;
  display: flex;
}

.blog-post-card__meta > * + :before {
  content: "•";
  margin-inline-end: .5rem;
}

.blog-post-list {
  --blog-post-list-items-per-row: 1;
  --blog-post-list-column-gap: 1.875rem;
  --blog-post-list-row-gap: var(--section-stack-gap);
  --blog-post-list-card-width: calc(100% / var(--blog-post-list-items-per-row) - var(--blog-post-list-column-gap) * (var(--blog-post-list-items-per-row) - 1) / var(--blog-post-list-items-per-row));
  grid: auto / repeat(auto-fit, var(--blog-post-list-card-width));
  align-items: start;
  column-gap: var(--blog-post-list-column-gap);
  row-gap: var(--blog-post-list-row-gap);
  display: grid;
}

.featured-blog-post {
  grid-column: 1 / -1;
  display: none;
}

@media screen and (min-width: 700px) {
  .blog-post-list {
    --blog-post-list-items-per-row: 2;
  }
}

@media screen and (max-width: 999px) {
  .blog-post-list--carousel {
    --blog-post-list-card-width: 40vw;
    grid: auto / auto-flow var(--blog-post-list-card-width);
  }
}

@media screen and (max-width: 699px) {
  .blog-post-list--carousel {
    --blog-post-list-card-width: 74vw;
  }
}

@media screen and (min-width: 1000px) {
  .blog-post-list {
    --blog-post-list-items-per-row: 3;
    --blog-post-list-column-gap: 3.75rem;
  }

  .featured-blog-post {
    display: block;
  }

  .featured-blog-post + .blog-post-card {
    display: none;
  }
}

@media screen and (min-width: 1150px) {
  .blog-post-list {
    --blog-post-list-row-gap: 3.75rem;
  }
}

.shopify-challenge__button, .shopify-payment-button__button--unbranded {
  all: revert;
}

.button, .shopify-challenge__button, .shopify-payment-button__button--unbranded {
  --initial-gradient: linear-gradient(rgb(var(--button-background)), rgb(var(--button-background)));
  --hover-gradient: linear-gradient(transparent, transparent);
  --initial-background-position: var(--transform-origin-end);
  --hover-background-position: var(--transform-origin-start);
  -webkit-appearance: none;
  appearance: none;
  text-transform: var(--button-text-transform);
  font: var(--button-font);
  letter-spacing: var(--button-letter-spacing);
  text-shadow: none;
  text-align: center;
  cursor: pointer;
  color: rgb(var(--button-text-color));
  border: 1px solid rgb(var(--button-outline-color, var(--button-background)));
  border-radius: var(--button-border-radius);
  background-color: #0000;
  background-image: var(--initial-gradient), var(--hover-gradient);
  background-size: 101% 101%, 0 101%;
  background-position: var(--initial-background-position);
  background-repeat: no-repeat;
  justify-content: center;
  align-items: center;
  column-gap: 1.125rem;
  padding: .65rem 1.75rem;
  transition: background-size .45s cubic-bezier(.785, .135, .15, .86), background-position .45s step-end, color .45s cubic-bezier(.785, .135, .15, .86), border .45s cubic-bezier(.785, .135, .15, .86);
  display: inline-flex;
  position: relative;
}

.shopify-payment-button__button--unbranded {
  border: 1px solid rgb(var(--button-outline-color, var(--button-background))) !important;
  border-radius: var(--button-border-radius) !important;
  background-color: #0000 !important;
  transition: background-size .45s cubic-bezier(.785, .135, .15, .86), background-position .45s step-end, color .45s cubic-bezier(.785, .135, .15, .86), border .45s cubic-bezier(.785, .135, .15, .86) !important;
}

.shopify-payment-button__button--unbranded:not(:hover) {
  color: rgb(var(--button-text-color)) !important;
}

.button--outline {
  --initial-gradient: linear-gradient(transparent, transparent);
  --hover-gradient: linear-gradient(rgb(var(--button-background)), rgb(var(--button-background)));
  --initial-background-position: var(--transform-origin-start);
  --hover-background-position: var(--transform-origin-end);
  color: rgb(var(--button-background, var(--text-color)));
  border-color: rgb(var(--button-outline-color, var(--border-color)));
}

.button--subdued.button--outline {
  color: rgb(var(--button-background) / .65);
  border-color: rgb(var(--border-color));
}

.button--sm {
  font-size: var(--text-xs);
  padding: .5rem .75rem;
}

@media screen and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .features--button-transition :is(.button, .shopify-challenge__button, .shopify-payment-button__button--unbranded):not([disabled]):hover {
    color: rgb(var(--button-background));
    background-position: var(--hover-background-position);
    border-color: rgb(var(--button-background));
    background-size: 0 101%, 101% 101%;
  }

  .features--button-transition .shopify-payment-button__button--unbranded:not([disabled]):hover {
    background-color: #0000;
  }

  .features--button-transition .button--outline:not([disabled]):hover {
    color: rgb(var(--button-text-color));
  }
}

.button-group {
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  display: flex;
}

.button-group > * {
  margin: 0 !important;
}

.button-group:has(.link):has(.button) {
  column-gap: 1.5rem;
}

@media screen and (min-width: 700px) {
  .button-group {
    gap: 1.25rem;
  }

  .button-group:has(.link):not(:has(.button)) {
    column-gap: 2rem;
  }

  .button-group--same-width {
    grid-auto-columns: minmax(0, 1fr);
    grid-auto-flow: column;
    display: grid;
  }
}

.additional-checkout-buttons {
  width: 100%;
}

.shopify-payment-button__button {
  vertical-align: top;
  width: 100%;
  min-height: calc(1lh + 1.3rem + 2px);
}

shopify-accelerated-checkout, shopify-accelerated-checkout-cart {
  --shopify-accelerated-checkout-button-block-size: 44px;
  --shopify-accelerated-checkout-button-border-radius: var(--button-border-radius);
  --shopify-accelerated-checkout-button-box-shadow: none;
}

@keyframes animateIconInline {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }

  50% {
    opacity: 0;
    transform: translateX(100%);
  }

  51% {
    opacity: 0;
    transform: translateX(-100%);
  }

  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@keyframes animateIconBlock {
  0% {
    opacity: 1;
    transform: translateY(0%);
  }

  50% {
    opacity: 0;
    transform: translateY(100%);
  }

  51% {
    opacity: 0;
    transform: translateY(-100%);
  }

  100% {
    opacity: 1;
    transform: translateY(0%);
  }
}

.circle-button {
  --circle-button-size: 2.75rem;
  width: var(--circle-button-size);
  height: var(--circle-button-size);
  background: rgb(var(--circle-button-background));
  color: rgb(var(--circle-button-text-color));
  border-radius: var(--rounded-full);
  box-shadow: 0 .125rem .625rem rgb(var(--circle-button-text-color) / .15);
  place-items: center;
  display: grid;
}

.circle-button > svg {
  width: .75rem;
}

.circle-button > .icon-zoom {
  width: .875rem;
}

@media screen and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .circle-button.hover\:animate-icon-inline:hover svg {
    animation: .35s ease-in-out forwards animateIconInline;
  }

  .circle-button.hover\:animate-icon-block:hover svg {
    animation: .35s ease-in-out forwards animateIconBlock;
  }
}

.circle-button--sm {
  --circle-button-size: 2.25rem;
}

.circle-button--lg, .circle-button--xl {
  --circle-button-size: 3.125rem;
}

:is(.circle-button--lg, .circle-button--xl) > svg {
  width: 1rem;
}

@media screen and (min-width: 700px) {
  .circle-button--xl {
    --circle-button-size: 3.5rem;
  }
}

.content-over-media {
  --content-over-media-gap: 1.25rem;
  --content-over-media-calculated-row-gap: var(--content-over-media-row-gap, var(--content-over-media-gap));
  --content-over-media-calculated-column-gap: var(--content-over-media-column-gap, var(--content-over-media-gap));
  grid-template: [full-start] 0 [content-start] minmax(0, 1fr) [content-end] 0 [full-end] / [full-start] minmax(0, 1fr) [content-start] minmax(0,
      min(var(--container-max-width), 100% - var(--content-over-media-column-gap, var(--content-over-media-gap, var(--container-gutter))) * 2))
    [content-end] minmax(0, 1fr) [full-end];
  row-gap: var(--content-over-media-calculated-row-gap);
  column-gap: var(--content-over-media-calculated-column-gap);
  min-height: var(--content-over-media-height, auto);
  place-items: center;
  display: grid;
  position: relative;
  overflow: hidden;
}

.content-over-media:before {
  content: "";
  background: var(--content-over-media-gradient-overlay, rgb(var(--content-over-media-overlay)));
  border-radius: inherit;
  z-index: 1;
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.content-over-media > picture, .content-over-media > image-parallax picture {
  display: contents;
}

.content-over-media > :is(img, video, iframe, svg, video-media, figure), .content-over-media > picture img, .content-over-media > image-parallax img {
  height: var(--content-over-media-height, auto);
  overflow-wrap: anywhere;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  grid-area: full-start / full-start / full-end / full-end;
  min-width: 100%;
  min-height: 100%;
  max-height: 100%;
}

.content-over-media > :not(img, video, iframe, svg, video-media, picture, image-parallax, figure) {
  max-width: var(--content-over-media-content-max-width, 48rem);
  z-index: 1;
  text-shadow: 0 1px rgb(var(--content-over-media-text-shadow) / 50%);
  grid-area: content-start / content-start / content-end / content-end;
  position: relative;
}

.content-over-media:has( > .prose):not(:has( > .prose .button:last-child)) {
  row-gap: calc(var(--content-over-media-calculated-row-gap) - .5rem);
}

@supports (row-gap: 1lh) {
  .content-over-media:has( > .prose):not(:has( > .prose .button:last-child)) {
    row-gap: calc(var(--content-over-media-calculated-row-gap) - .5lh);
  }
}

.content-over-media > video-media:not([autoplay]) ~ :not(img, video, iframe, svg, video-media, picture, image-parallax) {
  pointer-events: none;
  transition: opacity .2s ease-in-out, visibility .2s ease-in-out;
}

.content-over-media > video-media:not([autoplay])[loaded] ~ :not(img, video, iframe, svg, video-media, picture, image-parallax) {
  opacity: 0;
  visibility: hidden;
}

.content-over-media:has(video-media:not([autoplay])) .play-button {
  transition: transform .2s ease-in-out;
}

.content-over-media:has(video-media:not([autoplay])):hover .play-button {
  transform: scale(1.1);
}

.shopify-section:first-child [allow-transparent-header] > .content-over-media > :not(img, video, iframe, svg, video-media, picture, image-parallax) {
  padding-block-start: var(--header-height, 0px);
}

.content-over-media--xs {
  --content-over-media-height: clamp(15rem, 65vw, 25rem);
}

.content-over-media--sm {
  --content-over-media-height: clamp(20rem, 85vw, 32rem);
}

.content-over-media--md {
  --content-over-media-height: clamp(25rem, 100vw, 36rem);
}

.content-over-media--lg {
  --content-over-media-height: clamp(30rem, 125vw, 42rem);
}

.content-over-media--fill {
  --content-over-media-height: calc(100vh - var(--sticky-area-height));
}

.shopify-section:first-child .content-over-media--fill {
  --content-over-media-height: calc(100vh - (var(--announcement-bar-height, 0px) + var(--header-height, 0px)));
}

.shopify-section:first-child:has([allow-transparent-header]) .content-over-media--fill {
  --content-over-media-height: calc(100vh - (var(--announcement-bar-height, 0px)));
}

@supports (height: 100svh) {
  .content-over-media--fill {
    --content-over-media-height: calc(100svh - var(--sticky-area-height));
  }

  .shopify-section:first-child .content-over-media--fill {
    --content-over-media-height: calc(100svh - (var(--announcement-bar-height, 0px) + var(--header-height, 0px)));
  }

  .shopify-section:first-child:has([allow-transparent-header]) .content-over-media--fill {
    --content-over-media-height: calc(100svh - (var(--announcement-bar-height, 0px)));
  }
}

@media screen and (min-width: 700px) {
  .content-over-media {
    --content-over-media-gap: 2rem;
  }
}

@media screen and (min-width: 1000px) {
  .content-over-media {
    --content-over-media-gap: 3rem;
  }
}

.page-dots {
  --dot-size: .375rem;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem 1rem;
  display: flex;
}

.page-dots > * {
  width: var(--dot-size);
  height: var(--dot-size);
  border-radius: var(--rounded-full);
  place-content: center;
  display: grid;
}

.page-dots > *:after {
  content: "";
  border-radius: inherit;
  opacity: .4;
  background: currentColor;
  transition: opacity .25s, background .25s;
  position: absolute;
  inset: 0;
}

.page-dots > *[aria-current="true"]:after {
  opacity: 1;
}

.page-dots--narrow {
  column-gap: .5rem;
}

.page-dots--autoplay > [aria-current="false"]:after, .page-dots--autoplay > [aria-current="true"] .circular-progress {
  transition-delay: .15s;
}

.page-dots--autoplay > [aria-current="true"]:after, .page-dots--autoplay > [aria-current="false"] .circular-progress {
  opacity: 0;
}

.page-dots--autoplay > [aria-current="true"] .circular-progress circle:last-child {
  animation: animateCircularProgress var(--slideshow-progress-duration) linear var(--slideshow-progress-play-state) both;
}

.prev-next-button {
  transition: opacity .15s ease-in-out, transform .15s ease-in-out, visibility .15s ease-in-out;
}

.prev-next-button[disabled] {
  opacity: 0;
  visibility: hidden;
}

@media screen and (pointer: fine) {
  .prev-next-button--prev:hover svg {
    animation-direction: reverse !important;
  }
}

@media screen and (pointer: fine) {
  .floating-controls-container {
    padding-inline: 4.625rem;
    display: block;
    position: relative;
  }

  .floating-controls-container:not(:has(.is-scrollable)) .floating-controls-container__control {
    display: none;
  }

  .floating-controls-container--inside {
    --floating-controls-inset-inline: 1.5rem;
    padding-inline: 0;
  }

  .floating-controls-container--on-hover > .floating-controls-container__control {
    opacity: 0;
    transform: translateY(-10px);
  }

  .floating-controls-container--on-hover:hover > .floating-controls-container__control:not(:has([disabled])) {
    opacity: 1;
    transform: translateY(0);
  }

  .floating-controls-container__control {
    z-index: 2;
    transition: opacity .2s, transform .2s;
    display: grid;
    position: absolute;
    inset-block-start: calc(50% - 1.5625rem);
  }

  .floating-controls-container__control:first-child {
    inset-inline-start: var(--floating-controls-inset-inline, 0);
  }

  .floating-controls-container__control:last-child {
    inset-inline-end: var(--floating-controls-inset-inline, 0);
  }
}

@media not screen and (pointer: fine) {
  .floating-controls-container > .floating-controls-container__control {
    display: none;
  }
}

:where(x-drawer, x-modal, x-popover):not(:defined) {
  display: none;
}

:where(.modal, .drawer, .popover, .header-search) {
  z-index: 999;
  display: none;
  position: relative;
}

:where(.modal, .drawer, .popover, .header-search)::part(overlay) {
  background: rgb(var(--page-overlay));
  min-height: 100vh;
  position: fixed;
  inset: 0;
}

:where(.modal, .drawer, .popover, .header-search)::part(close-button) {
  color: currentColor;
  cursor: pointer;
  background: none;
  border: none;
  place-items: center;
  padding: 0;
  display: grid;
}

:where(.modal, .drawer, .popover, .header-search)::part(close-button) > svg {
  display: block;
}

@media screen and (pointer: fine) {
  :where(.modal, .drawer, .popover, .header-search)::part(close-button) {
    opacity: .6;
    transition: all .2s ease-in;
  }

  :where(.modal, .drawer, .popover, .header-search)::part(close-button):hover {
    opacity: 1;
  }
}

:where(.modal, .drawer, .popover, .header-search)::part(tap-area) {
  position: relative;
}

:where(.modal, .drawer, .popover, .header-search)::part(tap-area):before {
  content: "";
  position: absolute;
  inset: -.65rem;
}

.modal {
  --distance-to-bleed: var(--modal-body-padding-inline);
  --modal-header-padding-block: .875rem;
  --modal-header-padding-inline: 1.25rem;
  --modal-body-padding-block: 1.25rem;
  --modal-body-padding-inline: 1.25rem;
  --modal-body-max-width: 30rem;
}

.modal::part(base) {
  place-items: end center;
  width: 100%;
  height: 100%;
  display: grid;
  position: fixed;
  inset: 0;
}

.modal::part(content) {
  width: 100%;
  max-width: var(--modal-body-max-width);
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  max-height: 75vh;
  color: rgb(var(--text-color));
  isolation: isolate;
  overflow: auto;
}

@supports (height: 100dvh) {
  .modal::part(content) {
    max-height: 85dvh;
  }
}

.modal::part(header) {
  background: inherit;
  border-block-end: 1px solid rgb(var(--border-color));
  text-align: center;
  z-index: 2;
  align-items: center;
  padding-block-start: var(--modal-header-padding-block);
  padding-block-end: var(--modal-header-padding-block);
  padding-inline-start: var(--modal-header-padding-inline);
  padding-inline-end: var(--modal-header-padding-inline);
  display: grid;
  position: sticky;
  inset-block-start: 0;
}

.modal::part(close-button) {
  position: absolute;
  inset-inline-end: var(--modal-header-padding-inline);
}

.modal::part(body) {
  padding-block-start: var(--modal-body-padding-block);
  padding-block-end: var(--modal-body-padding-block);
  padding-inline-start: var(--modal-body-padding-inline);
  padding-inline-end: var(--modal-body-padding-inline);
}

@media screen and (min-width: 700px) {
  .modal {
    --modal-header-padding-block: 1.125rem;
    --modal-header-padding-inline: 2rem;
    --modal-body-padding-block: 2rem;
    --modal-body-padding-inline: 2rem;
  }

  .modal::part(base) {
    place-items: center;
  }

  .modal--lg {
    --modal-body-max-width: 45rem;
  }
}

.drawer {
  --distance-to-bleed: var(--drawer-body-padding-inline);
  --drawer-header-padding-block: 1rem;
  --drawer-header-padding-inline: 1.25rem;
  --drawer-body-padding-block: 1.25rem;
  --drawer-body-padding-inline: 1.25rem;
  --drawer-footer-padding-block: 1rem;
  --drawer-footer-padding-inline: 1.25rem;
  --drawer-max-width: min(92vw, 28.125rem);
}

.drawer::part(base) {
  width: 100%;
  height: 100%;
  position: fixed;
  inset: 0;
}

.drawer::part(content) {
  width: 100%;
  height: 100%;
  max-width: var(--drawer-max-width);
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  color: rgb(var(--text-color));
  grid-auto-rows: auto minmax(0, 1fr) auto;
  align-content: start;
  display: grid;
  position: relative;
}

.drawer::part(header) {
  min-height: min(var(--header-height), 5rem);
  border-block-end: 1px solid rgb(var(--border-color));
  box-sizing: border-box;
  justify-content: space-between;
  align-items: center;
  column-gap: 1rem;
  padding-block-start: var(--drawer-header-padding-block);
  padding-block-end: var(--drawer-header-padding-block);
  padding-inline-start: var(--drawer-header-padding-inline);
  padding-inline-end: var(--drawer-header-padding-inline);
  display: flex;
}

.drawer::part(body) {
  overscroll-behavior-y: contain;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  padding-block-start: var(--drawer-body-padding-block);
  padding-block-end: var(--drawer-body-padding-block);
  padding-inline-start: var(--drawer-body-padding-inline);
  padding-inline-end: var(--drawer-body-padding-inline);
  display: grid;
  overflow: hidden auto;
}

.drawer::part(footer) {
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  border-block-start: 1px solid rgb(var(--border-color));
  padding-block-start: var(--drawer-footer-padding-block);
  padding-block-end: var(--drawer-footer-padding-block);
  padding-inline-start: var(--drawer-footer-padding-inline);
  padding-inline-end: var(--drawer-footer-padding-inline);
}

.drawer--sm {
  --drawer-max-width: min(92vw, 25rem);
}

.drawer--center-body::part(body) {
  align-self: center;
}

@media screen and (min-width: 1000px) {
  .drawer {
    --drawer-header-padding-block: 1.125rem;
    --drawer-header-padding-inline: 2rem;
    --drawer-body-padding-block: 2rem;
    --drawer-body-padding-inline: 2rem;
    --drawer-footer-padding-block: 2rem;
    --drawer-footer-padding-inline: 2rem;
  }
}

.popover {
  --distance-to-bleed: var(--popover-body-padding-inline);
  --popover-header-padding-block: .875rem;
  --popover-header-padding-inline: 1.25rem;
  --popover-body-padding-block: 1.25rem;
  --popover-body-padding-inline: 1.25rem;
}

.popover::part(content) {
  background: rgb(var(--background));
  width: 100%;
  max-height: 75vh;
  color: rgb(var(--text-color));
  isolation: isolate;
  overflow: auto;
}

@supports (height: 100dvh) {
  .popover::part(content) {
    max-height: 85dvh;
  }
}

.popover::part(header) {
  background: inherit;
  border-block-end: 1px solid rgb(var(--border-color));
  text-align: center;
  z-index: 2;
  align-items: center;
  padding-block-start: var(--popover-header-padding-block);
  padding-block-end: var(--popover-header-padding-block);
  padding-inline-start: var(--popover-header-padding-inline);
  padding-inline-end: var(--popover-header-padding-inline);
  display: grid;
  position: sticky;
  inset-block-start: 0;
}

.popover::part(close-button) {
  position: absolute;
  inset-inline-end: var(--popover-header-padding-inline);
}

.popover::part(body) {
  padding-block-start: var(--popover-body-padding-block);
  padding-block-end: var(--popover-body-padding-block);
  padding-inline-start: var(--popover-body-padding-inline);
  padding-inline-end: var(--popover-body-padding-inline);
}

.popover__value-list {
  text-align: start;
  justify-items: start;
  gap: .75rem;
  display: grid;
  position: relative;
}

.popover__value-list > * {
  text-align: inherit;
  width: 100%;
  color: rgb(var(--text-color) / .65);
  transition: color .2s ease-in-out;
}

.popover__value-list > *[aria-selected="true"], .popover__value-list > *:hover {
  color: rgb(var(--text-color));
}

.popover__value-list > *:has(:checked) {
  color: rgb(var(--text-color));
}

.popover__value-option {
  text-align: inherit;
  width: 100%;
  color: rgb(var(--text-color) / .65);
  transition: color .2s ease-in-out;
}

.popover__value-option[aria-selected="true"], .popover__value-option:hover {
  color: rgb(var(--text-color));
}

@media screen and (max-width: 999px) {
  .popover::part(base) {
    place-items: end center;
    width: 100%;
    height: 100%;
    display: grid;
    position: fixed;
    inset: 0;
  }
}

@media screen and (min-width: 1000px) {
  .popover {
    --popover-block-offset: .75rem;
    position: absolute;
  }

  .popover::part(content) {
    border: 1px solid rgb(var(--border-color));
    width: max-content;
    max-width: 18.75rem;
    max-height: min(60vh, 25rem);
    box-shadow: 2px 2px 6px rgb(var(--text-color) / .05);
  }

  .popover::part(overlay), .popover::part(header) {
    display: none;
  }

  .popover:has(.popover__value-list)::part(body) {
    padding-inline-end: 2.5rem;
  }

  .popover--top-start {
    inset-block-end: calc(100% + var(--popover-block-offset));
    inset-inline-start: 0;
  }

  .popover--top-end {
    inset-block-end: calc(100% + var(--popover-block-offset));
    inset-inline-end: 0;
  }

  .popover--bottom-start {
    inset-block-start: calc(100% + var(--popover-block-offset));
    inset-inline-start: 0;
  }

  .popover--bottom-end {
    inset-block-start: calc(100% + var(--popover-block-offset));
    inset-inline-end: 0;
  }
}

.pop-in {
  z-index: 10;
  padding: 2rem;
  display: none;
  position: fixed;
  inset-block-end: 1rem;
  inset-inline: 1rem;
}

.pop-in__close-button {
  inset-block-start: 1.25rem;
  inset-inline-end: 1.25rem;
  position: absolute !important;
}

@media screen and (min-width: 700px) {
  .pop-in {
    inset-block-end: 2rem;
    inset-inline: 2rem;
  }
}

.banner {
  font-size: var(--text-base);
  color: rgb(var(--banner-color));
  background: rgb(var(--banner-background));
  text-shadow: none;
  padding: .625rem 1.25rem;
}

.banner:has(.banner__text-with-button) {
  padding-block: 1.25rem;
}

.banner--error {
  --banner-background: var(--error-background);
  --banner-color: var(--error-text);
  --button-background: var(--error-text);
  --button-text-color: var(--error-background);
}

.banner--success {
  --banner-background: var(--success-background);
  --banner-color: var(--success-text);
  --button-background: var(--success-text);
  --button-text-color: var(--success-background);
}

.banner--warning {
  --banner-background: var(--warning-background);
  --banner-color: var(--warning-text);
  --button-background: var(--warning-text);
  --button-text-color: var(--warning-background);
}

.banner__text-with-button {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .8rem 1.5rem;
  display: flex;
}

.form {
  align-content: start;
  row-gap: var(--form-gap);
  display: grid;
}

.form-row {
  gap: var(--fieldset-gap);
  flex-wrap: wrap;
  display: flex;
}

.form-row > .form-control {
  flex: 1 0 var(--fieldset-row-control-width, 14rem);
}

.form-row > button {
  flex-grow: 1;
}

.fieldset {
  gap: var(--fieldset-gap);
  display: grid;
}

.fieldset-row {
  gap: inherit;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  display: grid;
}

.form-control {
  gap: var(--form-control-gap);
  display: grid;
  position: relative;
}

.form-control > label {
  justify-self: start;
}

.form-control__max-characters-count {
  margin-block-start: -.375rem;
}

.checkbox-control {
  align-items: flex-start;
  column-gap: var(--checkbox-control-gap);
  text-align: start;
  display: flex;
  position: relative;
}

.input, .textarea, .select {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  padding: var(--input-padding-block) var(--input-padding-inline);
  border-radius: var(--input-border-radius);
  background: rgb(var(--input-background, transparent));
  color: rgb(var(--input-text-color, var(--text-color)));
  text-align: start;
  border-width: 1px;
  transition: border-color .1s ease-in-out;
}

:is(.input, .textarea, .select)::placeholder {
  color: rgb(var(--input-text-color, var(--text-color)) / .6);
}

:is(.input:focus, .textarea:focus, .select:focus-visible) {
  border-color: currentColor;
  outline: none;
}

.select {
  box-shadow: 0 1px 3px rgb(var(--text-color) / .08);
  padding-inline-end: calc(var(--input-padding-inline) * 2 + 10px);
}

.select:required:invalid {
  color: rgb(var(--input-text-color, var(--text-color)) / .6);
}

.select ~ svg, .select > svg {
  transition: transform .2s;
  position: absolute;
  inset-block-start: calc(50% - 3.5px);
  inset-inline-end: calc(var(--input-padding-inline) + 1px);
}

.select[aria-expanded="true"] > svg {
  transform: rotateZ(180deg);
}

.form-control:has(.select):before {
  content: "";
  width: calc(var(--input-padding-inline) * 2 + 35px);
  background-image: linear-gradient(to var(--transform-origin-start),
      rgb(var(--background)) calc(var(--input-padding-inline) + 20px),
      rgb(var(--background-without-opacity) / 0));
  pointer-events: none;
  height: calc(100% - 2px);
  position: absolute;
  inset-block-start: 1px;
  inset-inline-end: 1px;
}

.form-control:has(.select):not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
  border-top-right-radius: var(--input-border-radius);
  border-bottom-right-radius: var(--input-border-radius);
}

.form-control:has(.select):is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
  border-top-left-radius: var(--input-border-radius);
  border-bottom-left-radius: var(--input-border-radius);
}

.floating-label {
  z-index: 1;
  background: rgb(var(--background));
  color: rgb(var(--input-text-color, var(--text-color)) / .6);
  opacity: 0;
  pointer-events: none;
  padding: 0 .25rem;
  transition: opacity .2s ease-in-out, transform .2s ease-in-out;
  position: absolute;
  inset-block-start: calc(-1 * var(--input-padding-block) + 1px);
  inset-inline-start: calc(var(--input-padding-inline) - .25rem + 1px);
  transform: translateY(3px);
}

:-webkit-autofill ~ .floating-label {
  color: #000;
}

:-webkit-any(:-webkit-any(.input, .textarea):not(:placeholder-shown) ~ .floating-label, :-webkit-any(.input, .textarea, .select):-webkit-autofill ~ .floating-label, .select:valid ~ .floating-label) {
  opacity: 1;
  transform: translateY(0);
}

:is(:is(.input, .textarea):not(:placeholder-shown) ~ .floating-label, :is(.input, .textarea, .select):autofill ~ .floating-label, .select:valid ~ .floating-label) {
  opacity: 1;
  transform: translateY(0);
}

.input-suffix {
  transition: opacity .2s ease-in-out, visibility .2s ease-in-out;
  position: absolute;
  inset-block-start: var(--input-padding-block);
  inset-inline-end: var(--input-padding-inline);
}

.form-control:has(:focus-within) + .input-suffix.hide-on-focus {
  opacity: 0;
  visibility: hidden;
}

.checkbox {
  --checkbox-baseline-distance: calc(1em * 1.6);
  --checkbox-offset: calc((var(--checkbox-baseline-distance) - var(--checkbox-size)) / 2);
  -webkit-appearance: none;
  appearance: none;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  border-width: 1px;
  border-color: rgb(var(--text-color) / .8);
  background: var(--checkmark-svg-url) no-repeat center / 0;
  border-radius: 2px;
  flex-shrink: 0;
  transition: background-color .2s ease-in-out, border-color .2s ease-in-out;
  position: relative;
  inset-block-start: var(--checkbox-offset);
}

@supports (width: 1lh) {
  .checkbox {
    inset-block-start: calc(.5lh - var(--checkbox-size) / 2);
  }
}

.checkbox:checked {
  background-color: rgb(var(--accent));
  border-color: rgb(var(--accent));
  background-size: 10px 8px;
}

.checkbox:checked ~ label {
  opacity: 1;
}

.checkbox:disabled, .checkbox:disabled ~ label {
  opacity: .5;
  cursor: default;
}

.checkbox:not(:disabled, :checked) ~ label {
  opacity: .7;
}

.checkbox ~ label {
  transition: all .2s ease-in-out;
}

.dot-checkbox {
  -webkit-appearance: none;
  appearance: none;
  background: rgb(var(--text-color));
  opacity: 0;
  pointer-events: none;
  border-radius: 100%;
  width: 6px;
  height: 6px;
  transition: opacity .2s;
  display: block;
  position: absolute;
  inset-block-start: calc(.5em + 1.5px);
}

.dot-checkbox ~ label {
  opacity: .65;
  transition: opacity .2s, transform .2s;
  position: relative;
}

.dot-checkbox ~ label:hover {
  opacity: 1;
}

.dot-checkbox:checked {
  opacity: 1;
}

.dot-checkbox:checked ~ label {
  opacity: 1;
  transform: translateX(calc(var(--transform-logical-flip) * 1.125rem));
}

.dot-checkbox:focus-visible ~ label {
  outline: 5px auto highlight;
  outline: 5px auto -webkit-focus-ring-color;
}

.switch {
  --switch-height: 1rem;
  --switch-width: 2.25rem;
  --switch-padding: .1875rem;
  --switch-toggle-size: .625rem;
  -webkit-appearance: none;
  appearance: none;
  height: var(--switch-height);
  width: var(--switch-width);
  padding: var(--switch-padding);
  border-radius: var(--rounded-full);
  background: rgb(var(--text-color) / .2);
  align-self: center;
  transition: background .2s ease-in-out;
  display: grid;
}

.switch:after {
  content: "";
  width: var(--switch-toggle-size);
  height: var(--switch-toggle-size);
  background: rgb(var(--background));
  border-radius: var(--rounded-full);
  transition: transform .2s ease-in-out;
  box-shadow: 0 1px 1px #0003;
}

.switch:checked {
  background: rgb(var(--accent));
}

.switch:checked:after {
  transform: translateX(calc(var(--transform-logical-flip) * (var(--switch-width) - var(--switch-toggle-size) - var(--switch-padding) * 2)));
}

.shopify-section:not(:first-child) .bordered-section {
  border-block-start-width: 1px;
}

.shopify-section:not(:has(.section-spacing)) + .shopify-section {
  border-block-start-width: 0;
}

.container {
  --distance-to-bleed: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
  margin-inline-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
  margin-inline-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
}

.container--xxs {
  --container-max-width: var(--container-xxs-max-width);
}

.container--xs {
  --container-max-width: var(--container-xs-max-width);
}

.container--sm {
  --container-max-width: var(--container-sm-max-width);
}

.container--md {
  --container-max-width: var(--container-md-max-width);
}

.container--lg {
  --container-max-width: var(--container-lg-max-width);
}

.container--xl {
  --container-max-width: var(--container-xl-max-width);
}

.container--align-start {
  margin-inline: var(--container-gutter) auto;
  max-width: var(--container-max-width);
}

.container--align-end {
  margin-inline: auto var(--container-gutter);
  max-width: var(--container-max-width);
}

.section-spacing {
  padding-block-start: calc(var(--section-vertical-spacing-override, var(--section-vertical-spacing)) + var(--section-vertical-spacing-block-start-compensation, 0px));
  padding-block-end: var(--section-vertical-spacing-override, var(--section-vertical-spacing));
}

.shopify-section:has(.section-spacing) {
  scroll-padding-block-start: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-height, 0px));
}

.section-spacing--tight {
  --section-vertical-spacing: var(--section-vertical-spacing-tight);
  --section-stack-gap: var(--section-stack-gap-tight);
}

.shopify-section:empty {
  display: none;
}

.section-stack {
  gap: var(--section-stack-gap);
  grid-auto-columns: minmax(0, 1fr);
  display: grid;
}

.section-header {
  max-width: min(var(--container-xs-max-width), 100%);
  margin-inline-start: var(--container-gutter);
  margin-inline-end: var(--container-gutter);
}

.container .section-header {
  margin-inline: 0;
}

.v-stack {
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  display: grid;
}

.h-stack {
  align-items: center;
  display: flex;
}

.bleed, .full-bleed {
  margin-inline-start: calc(-1 * var(--distance-to-bleed));
  margin-inline-end: calc(-1 * var(--distance-to-bleed));
}

.bleed {
  scroll-padding-inline: var(--distance-to-bleed);
  padding-inline-start: var(--distance-to-bleed);
  padding-inline-end: var(--distance-to-bleed);
}

@media screen and (min-width: 700px) {
  .sm\:unbleed {
    margin-inline: 0;
    padding-inline: 0;
    scroll-padding-inline: 0;
  }
}

@media screen and (min-width: 1000px) {
  .md\:unbleed {
    margin-inline: 0;
    padding-inline: 0;
    scroll-padding-inline: 0;
  }
}

@media screen and (min-width: 1150px) {
  .lg\:unbleed {
    margin-inline: 0;
    padding-inline: 0;
    scroll-padding-inline: 0;
  }
}

.empty-state {
  text-align: center;
  place-content: center;
  padding-block: 6.25rem;
  display: grid;
}

@media screen and (min-width: 1000px) {
  .empty-state {
    padding-block: 12.5rem;
  }
}

@media screen and (min-width: 1400px) {
  .empty-state {
    padding-block: 15.625rem;
  }
}

.shopify-section--announcement-bar, .shopify-section--header {
  transform: translateY(calc(((var(--announcement-bar-height, 0px) + var(--header-height, 0px)) * -1) * var(--hide-header-group, 0)));
  transition: transform .25s ease-in-out;
}

video-media, model-media {
  border-radius: inherit;
  aspect-ratio: var(--aspect-ratio, var(--default-aspect-ratio));
  width: 100%;
  display: block;
  position: relative;
  container: media / inline-size;
}

@supports not (aspect-ratio: 1) {
  :is(video-media, model-media):before {
    content: "";
    padding-block-end: calc(100% / (var(--aspect-ratio, var(--default-aspect-ratio))));
    display: block;
  }

  :is(video-media, model-media) > * {
    height: 100%;
    top: 0;
    left: 0;
    position: absolute !important;
  }
}

@container media (width >= 32rem) {
  :is(video-media, model-media)::part(play-button) {
    width: 4rem;
    height: 4rem;
  }
}

video-media {
  --default-aspect-ratio: 16 / 9;
}

video-media[host] {
  align-items: center;
  display: grid;
}

video-media[show-play-button]:not([loaded]), video-media:not([autoplay]) {
  cursor: pointer;
}

video-media > :is(video, iframe, img) {
  border-radius: inherit;
  width: 100%;
  height: 100%;
  transition: opacity .2s ease-in-out;
}

video-media > video[controls] {
  pointer-events: auto;
}

video-media > :-webkit-any(video:not(:-webkit-full-screen), img) {
  object-fit: cover;
  object-position: center;
  margin: 0 !important;
}

video-media > :is(video:not(:fullscreen), img) {
  object-fit: cover;
  object-position: center;
  margin: 0 !important;
}

video-media > :is(iframe, img) {
  position: absolute;
  inset: 0;
}

video-media:not([loaded]) > :is(video, iframe), video-media[loaded] > img, video-media[loaded]::part(play-button) {
  opacity: 0;
  pointer-events: none;
}

video-media[suspended] ~ * {
  pointer-events: none;
}

video-media::part(play-button) {
  z-index: 1;
  will-change: scale;
  transition: scale .2s ease-in-out, opacity .2s ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}

video-media:hover::part(play-button) {
  scale: 1.1;
}

model-media {
  --default-aspect-ratio: 1;
}

model-media model-viewer, model-media .shopify-model-viewer-ui {
  vertical-align: top;
  width: 100%;
  height: 100%;
}

.media-cover {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.media-background {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
}

@media screen and (max-width: 699px) {
  .order-summary__header, .order-summary__body td:nth-child(n+2), .order-summary__footer td:first-child {
    display: none;
  }

  .order-summary__body td {
    border-width: 0;
  }

  .order-summary__body tr:last-child td {
    border-block-end-width: 1px;
  }

  .order-summary__body tr:first-child td {
    padding-block-start: 0;
  }

  .order-summary__body tr:last-child td {
    padding-block-end: calc(var(--table-cell-padding-block) * 2);
  }
}

@media screen and (min-width: 700px) {
  .order-summary .line-item-info {
    max-width: 500px;
  }
}

.line-item {
  --line-item-media-width: 4.375rem;
  align-items: center;
  column-gap: 1.5rem;
  display: flex;
}

.line-item__media {
  width: var(--line-item-media-width);
  flex-shrink: 0;
}

@media screen and (min-width: 700px) {
  .line-item {
    --line-item-media-width: 7.5rem;
  }
}

.discount-badge {
  background: rgb(var(--on-sale-badge-background));
  color: rgb(var(--on-sale-badge-text));
  align-items: center;
  column-gap: .5rem;
  padding: .125rem .5rem;
  display: flex;
}

.shipping-estimator__form {
  gap: var(--fieldset-gap);
  display: grid;
}

@media screen and (min-width: 700px) {
  .shipping-estimator__form {
    flex-wrap: wrap;
    display: flex;
  }

  .shipping-estimator__form .select {
    max-width: 15rem;
  }
}

.pagination {
  border-block-end-width: 1px;
  grid-auto-rows: minmax(0, 2.8125rem);
  grid-auto-columns: minmax(0, 2.625rem);
  grid-auto-flow: column;
  justify-self: center;
  display: inline-grid;
}

.pagination__link {
  place-content: center;
  display: grid;
  position: relative;
}

.pagination__link[aria-current="page"] {
  box-shadow: 0 1px, inset 0 -2px;
}

@media screen and (min-width: 700px) {
  .pagination {
    grid-auto-columns: minmax(0, 3.75rem);
  }
}

.pswp {
  --pswp-bg: var(--background);
  --pswp-root-z-index: 100000;
  width: 100%;
  height: 100%;
  z-index: var(--pswp-root-z-index);
  touch-action: none;
  opacity: .003;
  contain: layout style size;
  -webkit-tap-highlight-color: #0000;
  outline: 0;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
}

.pswp:focus {
  outline: 0;
}

.pswp--open {
  display: block;
}

.pswp img {
  max-width: none;
}

.pswp, .pswp__bg {
  will-change: opacity;
  transform: translateZ(0);
}

.pswp__bg {
  opacity: .005;
  background: rgb(var(--pswp-bg));
}

.pswp, .pswp__scroll-wrap {
  overflow: hidden;
}

.pswp__scroll-wrap, .pswp__bg, .pswp__container, .pswp__item, .pswp__img, .pswp__zoom-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.pswp__img, .pswp__zoom-wrap {
  width: auto;
  height: auto;
}

.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
  cursor: zoom-in;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
  cursor: grab;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
  cursor: grabbing;
}

.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img, .pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active, .pswp__img {
  cursor: zoom-out;
}

.pswp__container, .pswp__img, .pswp__button, .pswp__counter {
  -webkit-user-select: none;
  user-select: none;
}

.pswp__item {
  z-index: 1;
  overflow: hidden;
}

.pswp__hidden {
  display: none !important;
}

.pswp .pswp__hide-on-close {
  opacity: .005;
  will-change: opacity;
  z-index: 10;
  pointer-events: none;
  transition: opacity .3s cubic-bezier(.4, 0, .22, 1), transform .3s cubic-bezier(.4, 0, .22, 1);
  transform: translateY(15px);
}

.pswp--ui-visible .pswp__hide-on-close {
  opacity: 1;
  pointer-events: auto;
  transition-delay: .3s;
  transform: translateY(0);
}

.pswp__top-bar {
  z-index: 10;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: .75rem;
  width: 100%;
  display: flex;
  position: absolute;
  bottom: 2.5rem;
  left: 0;
  pointer-events: none !important;
}

.pswp__top-bar > .circle-button {
  pointer-events: auto;
  transition: transform .2s ease-in-out;
}

@media screen and (pointer: fine) {
  .pswp__top-bar > .circle-button:hover {
    transform: scale(1.1);
  }
}

.pswp__preloader {
  display: none;
}

@media screen and (min-width: 700px) {
  .pswp__top-bar {
    column-gap: 1.125rem;
  }
}

.range {
  -webkit-appearance: none;
  appearance: none;
  background: none;
  width: 100%;
}

.range::-webkit-slider-thumb {
  -webkit-appearance: none;
}

.range::-webkit-slider-thumb {
  background: rgb(var(--text-color));
  cursor: pointer;
  z-index: 1;
  width: .625rem;
  height: .625rem;
  box-shadow: none;
  border-radius: 100%;
  margin-block-start: -.25rem;
  position: relative;
}

.range::-webkit-slider-runnable-track {
  cursor: pointer;
  background: rgb(var(--text-color) / .12);
  border: none;
  border-radius: 2px;
  width: 100%;
  height: 2px;
}

.range::-moz-range-thumb {
  background: rgb(var(--text-color));
  cursor: pointer;
  border: none;
  border-radius: 100%;
  width: .625rem;
  height: .625rem;
}

.range::-moz-range-progress {
  cursor: pointer;
  border: none;
  border-radius: 2px;
  width: 100%;
  height: 2px;
}

.range::-moz-range-track {
  cursor: pointer;
  border: none;
  border-radius: 2px;
  width: 100%;
  height: 2px;
}

.range::-moz-range-progress {
  background-color: rgba(var(--text-color));
}

.range::-moz-range-track {
  background-color: rgb(var(--border-color));
}

@media not screen and (pointer: fine) {
  .range::-webkit-slider-thumb {
    width: 1rem;
    height: 1rem;
    margin-block-start: -.4375rem;
  }

  .range::-moz-range-thumb {
    width: 1rem;
    height: 1rem;
  }
}

.range-group {
  background: linear-gradient(to var(--transform-origin-end),
    rgb(var(--text-color) / .12) var(--range-min),
    rgb(var(--text-color)) var(--range-min),
    rgb(var(--text-color)) var(--range-max),
    rgb(var(--text-color) / .12) var(--range-max));
  border-radius: 2px;
  height: 2px;
}

.range-group .range {
  pointer-events: none;
  vertical-align: top;
  height: 2px;
}

.range-group .range::-webkit-slider-runnable-track {
  background: none;
}

.range-group .range::-webkit-slider-thumb {
  pointer-events: auto;
}

.range-group .range::-moz-range-progress {
  background: none;
}

.range-group .range::-moz-range-track {
  background: none;
}

.range-group .range::-moz-range-thumb {
  pointer-events: auto;
}

.range-group .range:last-child {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
}

.input-group {
  align-items: center;
  column-gap: .75rem;
  display: flex;
}

.input-prefix {
  border-radius: min(.625rem, var(--button-border-radius));
  border: 1px solid rgb(var(--text-color) / .12);
  flex: 1 0 0;
  justify-content: space-between;
  align-items: center;
  min-width: 0;
  padding: .4375rem;
  display: flex;
}

.input-prefix:focus-within {
  border-color: rgb(var(--text-color));
  box-shadow: inset 0 0 0 1px rgb(var(--text-color));
}

.input-prefix > .field {
  -webkit-appearance: textfield;
  appearance: textfield;
  text-align: end;
  background: none;
  border: none;
  width: 100%;
  min-width: 0;
  margin-inline-start: .625rem;
  padding: 0;
}

.input-prefix > .field:focus {
  outline: none;
}

.input-prefix > .field::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

.input-prefix > .field::-webkit-inner-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

.price-range {
  padding-block-start: .25rem;
  display: block;
}

.price-range > .range-group {
  margin-block-end: 1.125rem;
  position: relative;
}

@media not screen and (pointer: fine) {
  .price-range {
    padding-block-start: .625rem;
  }
}

.product-card {
  scroll-snap-align: start;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 0;
  display: grid;
  position: relative;
}

.product-card__figure {
  position: relative;
}

.product-card__figure > .badge-list {
  z-index: 1;
  position: absolute;
  inset-block-start: .25rem;
  inset-inline-start: .25rem;
}

.product-card__media {
  isolation: isolate;
  display: block;
}

.product-card__image {
  object-fit: contain;
  object-position: center;
  margin-inline: auto;
  transition: opacity .1s ease-in-out;
}

.product-card__image--secondary {
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
}

.product-card__quick-add-button {
  background: rgb(var(--circle-button-background));
  color: rgb(var(--circle-button-text-color));
  z-index: 1;
  padding: .625rem;
  position: absolute;
  inset-block-end: .5rem;
  inset-inline-end: .5rem;
}

@media screen and (pointer: fine) {
  .product-card__quick-add-button {
    opacity: 0;
    transition: opacity .2s ease-in-out, transform .2s ease-in-out;
    transform: translateY(5px);
  }

  .product-card__quick-add-button :is(svg) {
    transition: transform .2s ease-in-out;
  }

  .product-card__quick-add-button:focus svg, .product-card__quick-add-button:hover svg {
    transform: rotateZ(90deg);
  }

  .product-card:focus-within .product-card__quick-add-button, .product-card:hover .product-card__quick-add-button, .product-card__quick-add-button:focus {
    opacity: 1;
    transform: translateY(0);
  }
}

.product-card__info {
  --heading-text-transform: var(--product-card-text-transform);
  text-align: center;
  text-transform: var(--product-card-text-transform);
  align-content: start;
  justify-items: center;
  gap: .75rem;
  padding-block-start: 1.25rem;
  display: grid;
}

.product-card__info :is(.price-list, .rating-badge) {
  justify-content: center;
}

.product-card__info .color-swatch {
  --swatch-size: 1.375rem;
}

@media screen and (pointer: fine) {
  .product-card__image--secondary {
    opacity: 0;
    mix-blend-mode: plus-lighter;
    display: block;
  }

  .product-card__figure:has(.product-card__image--secondary):hover > .product-card__media .product-card__image--primary {
    opacity: 0;
  }

  .product-card__figure:has(.product-card__image--secondary):hover > .product-card__media .product-card__image--secondary {
    opacity: 1;
  }
}

@media screen and (min-width: 700px) {
  .product-card__figure > .badge-list {
    inset-block-start: .5rem;
    inset-inline-start: .5rem;
  }
}

.horizontal-product-card {
  scroll-snap-align: start;
  scroll-snap-stop: always;
  align-items: center;
  column-gap: 1.5rem;
  display: flex;
  position: relative;
  container: horizontal-product-card / inline-size;
}

.horizontal-product-card__figure {
  flex-shrink: 0;
  width: 6.25rem;
}

.horizontal-product-card__info {
  flex-grow: 1;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-columns: auto;
  justify-items: start;
  gap: .625rem;
  display: grid;
}

.\@large\:horizontal-product-card__button {
  display: none;
}

@media screen and (min-width: 700px) {
  .horizontal-product-card {
    column-gap: 2rem;
  }
}

@container horizontal-product-card (width >= 450px) {
  .horizontal-product-card__info {
    grid-auto-flow: column;
    align-items: center;
  }

  .\@narrow\:horizontal-product-card__button {
    display: none;
  }

  .\@large\:horizontal-product-card__button {
    display: block;
  }
}

.product-list {
  --product-list-max-items-per-row-allowed: 2;
  --product-list-calculated-items-per-row: min(var(--product-list-max-items-per-row-allowed), var(--product-list-items-per-row));
  --product-list-default-row-gap: 2.1875rem;
  --product-list-default-column-gap: .625rem;
  --product-list-calculated-row-gap: clamp(var(--section-vertical-spacing) / 4,
    var(--product-list-default-row-gap) * var(--product-list-vertical-spacing-factor, 1),
    var(--section-vertical-spacing) * 2);
  --product-list-calculated-column-gap: clamp(var(--container-gutter) / 4,
    var(--product-list-default-column-gap) * var(--product-list-horizontal-spacing-factor, 1),
    var(--container-gutter) * 2);
  --product-list-card-width: calc(100% / var(--product-list-calculated-items-per-row) - var(--product-list-calculated-column-gap, 0px) * (var(--product-list-calculated-items-per-row) - 1) /
      var(--product-list-calculated-items-per-row));
  grid: auto-flow dense / repeat(auto-fit, var(--product-list-card-width));
  align-items: start;
  column-gap: var(--product-list-calculated-column-gap);
  row-gap: var(--product-list-calculated-row-gap);
  reading-flow: grid-rows;
  display: grid;
}

.product-list.product-list--compact {
  row-gap: var(--product-list-calculated-column-gap);
}

@supports (grid-template-rows: subgrid) {
  .product-list:not([collection-desktop-layout="compact"], .product-list--compact) > * {
    grid-template-rows: subgrid;
    grid-row: span 2;
  }
}

.product-list--carousel {
  --product-list-default-column-gap: 1.25rem;
  grid: auto / auto-flow var(--product-list-card-width);
  justify-content: safe center;
}

@media screen and (max-width: 699px) {
  .product-list:not(.product-list--carousel) {
    margin-inline: -.625rem;
  }

  .product-list--carousel {
    --product-list-card-width: min(300px, 65%);
  }
}

@media screen and (min-width: 700px) {
  .product-list {
    --product-list-max-items-per-row-allowed: 3;
    --product-list-default-row-gap: 3rem;
    --product-list-default-column-gap: 1.5rem;
  }

  .product-list--compact {
    --product-list-max-items-per-row-allowed: 4;
  }
}

@media screen and (min-width: 1000px) {
  .product-list {
    --product-list-max-items-per-row-allowed: 4;
    --product-list-default-row-gap: 4rem;
    --product-list-default-column-gap: 3rem;
  }

  .product-list--compact {
    --product-list-max-items-per-row-allowed: 5;
  }

  .product-list--carousel {
    scroll-snap-type: x mandatory;
  }
}

@media screen and (min-width: 1150px) {
  .product-list {
    --product-list-max-items-per-row-allowed: var(--product-list-items-per-row);
  }
}

@media screen and (min-width: 1400px) {
  .product-list {
    --product-list-default-row-gap: 4rem;
    --product-list-default-column-gap: 3.75rem;
  }
}

.product-list__promo {
  grid-column: 1 / -1;
}

@media screen and (min-width: 700px) {
  .product-list__promo {
    grid-column: span var(--product-list-promo-column-span);
    grid-row: span 1;
    height: 100%;
  }

  .product-list__promo .content-over-media :is(img, video, iframe, svg, video-media) {
    position: absolute;
  }

  .product-list[collection-desktop-layout="compact"] .product-list__promo {
    display: none;
  }

  @supports (grid-template-rows: subgrid) {
    .product-list__promo {
      grid-row: span 2;
      gap: 0;
      display: grid;
    }

    .product-list__promo .content-over-media {
      grid-row: span 1;
    }
  }
}

.quick-buy-modal {
  --modal-body-max-width: 55.625rem;
}

.quick-buy-modal::part(content) {
  position: relative;
}

.quick-buy-modal__content {
  grid-template-columns: minmax(0, 1fr);
  display: grid;
}

.quick-buy-modal__close-button {
  position: absolute;
  inset-block-start: 1.875rem;
  inset-inline-end: 1.875rem;
}

.quick-buy-modal__view-more {
  margin-block-start: 2rem;
  display: inline-block;
}

@media screen and (max-width: 699px) {
  .quick-buy-modal::part(body) {
    padding-inline: 0;
  }

  .quick-buy-modal__gallery-wrapper, .quick-buy-modal__info-wrapper {
    padding-inline-start: var(--modal-body-padding-inline);
    padding-inline-end: var(--modal-body-padding-inline);
  }

  .quick-buy-modal__gallery-wrapper .price-list {
    justify-content: center;
  }

  .quick-buy-modal__gallery-wrapper .price-list .h6 {
    font-size: .6875rem;
  }

  .quick-buy-modal__mobile-info {
    margin-block-start: 1.25rem;
  }

  .quick-buy-modal__info-wrapper {
    border-block-start-width: 1px;
    margin-block-start: 1.25rem;
  }

  .quick-buy-modal__info-wrapper .product-info__block-item:is([data-block-type="vendor"], [data-block-type="title"], [data-block-type="price"], [data-block-type="rating"], [data-block-type="separator"]), .quick-buy-modal__info-wrapper .product-info__block-group[data-group-type="text-with-rating"] {
    display: none;
  }

  .quick-buy-modal__info-wrapper .product-info__block-item[data-block-type="variant-picker"] {
    --product-info-gap: 1.25rem;
  }

  .quick-buy-modal__info-wrapper .product-info__block-item[data-block-type="buy-buttons"] {
    --product-info-gap: 1.5rem;
  }
}

@media screen and (min-width: 700px) {
  .quick-buy-modal {
    --modal-body-padding-inline: 3.125rem;
    --modal-body-padding-block: 3.125rem;
  }

  .quick-buy-modal::part(header) {
    display: none;
  }

  .quick-buy-modal__content {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
    align-items: center;
    column-gap: 2.5rem;
    display: grid;
  }

  .quick-buy-modal__content .product-info {
    top: unset;
    position: relative;
  }
}

.prose {
  overflow-wrap: anywhere;
}

.prose :first-child, .prose .sr-only:first-child + * {
  margin-block-start: 0 !important;
}

.prose :last-child {
  margin-block-end: 0 !important;
}

.prose :where(:not(meta, span) + *) {
  margin-block-start: 1rem;
}

.prose :where(* + span:not(:empty, .metafield-multi_line_text_field)), .prose :is(.link, img) {
  display: inline-block;
}

.prose :is(.link + .link) {
  margin-inline-start: .75rem;
}

.prose :is(.button, .button-group:has(.button)) {
  margin-block-start: 1.5rem;
}

.prose :is(p img:not([style*="float"]):only-child, div img:not([style*="float"]):only-child, figure, video, object, blockquote, table) {
  margin-block: 1.6rem;
}

.prose :is(iframe[src*="youtube"], iframe[src*="youtu.be"], iframe[src*="vimeo"]) {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
}

.prose .play-button {
  margin: 2rem auto;
  display: block;
}

.prose :is(ol, ul) :is(ol, ul) {
  margin-block-start: 0 !important;
}

.prose :is(ol, ul) {
  row-gap: .4em;
  display: grid;
}

.prose br {
  margin-block: 0 !important;
}

.prose figcaption {
  font-style: italic;
  font-size: var(--text-sm);
  color: rgb(var(--text-color) / .65);
  margin-block-start: .5em;
}

.prose blockquote {
  border-inline-start-width: 3px;
  padding: .375rem 0 .375rem 1rem;
  font-size: 1.15rem;
  line-height: 1.75;
}

@media screen and (min-width: 1000px) {
  .prose:not(.prose--tight) :where(:not(meta, span) + *) {
    margin-block-start: 1.25rem;
  }

  .prose:not(.prose--tight) :is(.button, .button-group:has(.button)) {
    margin-block-start: 2rem;
  }

  .prose:not(.prose--tight) .play-button {
    margin-block: 2.5rem;
  }

  .prose:not(.prose--tight) blockquote {
    margin-inline-start: 2rem;
    padding-inline-start: 2rem;
  }
}

.prose-justify-start, .prose-justify-left {
  text-align: start;
}

:where(:is(.prose-justify-start, .prose-justify-left) > *) {
  margin-inline: 0 auto;
}

.prose-justify-center {
  text-align: center;
}

:where(.prose-justify-center > *) {
  margin-inline: auto;
}

.prose-justify-center .button-group {
  justify-content: safe center;
}

.prose-justify-end, .prose-justify-right {
  text-align: end;
}

:where(:is(.prose-justify-end, .prose-justify-right) > *) {
  margin-inline: auto 0;
}

:is(.prose-justify-end, .prose-justify-right) .button-group {
  justify-content: end;
}

.link {
  background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 100% 1px no-repeat;
  text-decoration: none;
  transition: background-size .3s ease-in-out;
}

.prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)) {
  background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 100% 1px no-repeat;
  text-decoration: none;
  transition: background-size .3s ease-in-out;
}

@supports (height: 1lh) {
  .prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)) {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.2lh) / 100% 1px no-repeat;
  }
}

@media screen and (pointer: fine) {
  .prose a:not(.h1, .h2, .h3, .h4, .h5, .h6, .button, .link-faded, .link-faded-reverse, :has(img)):hover {
    background-size: 0 1px;
  }
}

@supports (height: 1lh) {
  .link {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.2lh) / 100% 1px no-repeat;
  }
}

@media screen and (pointer: fine) {
  .link:hover {
    background-size: 0 1px;
  }
}

.link-reverse {
  background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 0 1px no-repeat;
  text-decoration: none;
  transition: background-size .3s ease-in-out;
}

@supports (height: 1lh) {
  .link-reverse {
    background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.2lh) / 0 1px no-repeat;
  }
}

@media screen and (pointer: fine) {
  .link-reverse:hover {
    background-size: 100% 1px;
  }
}

.link-faded {
  color: rgb(var(--text-color) / .65);
  transition: color .2s ease-in-out;
}

@media screen and (pointer: fine) {
  .link-faded:hover {
    color: rgb(var(--text-color));
  }
}

.link-faded-reverse {
  transition: color .2s ease-in-out;
}

@media screen and (pointer: fine) {
  .link-faded-reverse:hover {
    color: rgb(var(--text-color) / .65);
  }
}

table {
  --table-cell-padding-block: .75rem;
  --table-cell-padding-inline: .5rem;
  --table-foot-cell-padding-block: .75rem;
  --table-foot-cell-padding-inline: .5rem;
  width: 100%;
}

table caption {
  text-align: inherit;
  margin-block-end: .5rem;
}

th {
  text-align: start;
}

:where(td, th):not(:empty) {
  border-block-width: 1px;
}

:where(th):not(:empty) {
  border-block-start-width: 0;
}

td:not(:empty) + td {
  border-inline-start-width: 1px;
}

th, td {
  padding: var(--table-cell-padding-block) var(--table-cell-padding-inline);
}

table:not(.table--bordered) :is(th, td):first-child, table:not(.table--bordered) :is(th, td):empty + td {
  padding-inline-start: 0;
}

:is(th, td):last-child {
  padding-inline-end: 0;
}

th {
  opacity: .6;
  line-height: 1.7;
  font-size: var(--text-h6);
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-style: var(--heading-font-style);
  letter-spacing: var(--heading-letter-spacing);
  text-transform: var(--heading-text-transform);
  padding-block: 0 .625rem;
}

tfoot td {
  padding: var(--table-foot-cell-padding-block) var(--table-foot-cell-padding-inline);
}

tr[onclick] {
  cursor: pointer;
  transition: background .2s;
}

tr[onclick]:hover {
  background: rgb(var(--text-color) / .05);
}

@media screen and (min-width: 700px) {
  table {
    --table-cell-padding-block: 1rem;
    --table-cell-padding-inline: .75rem;
    --table-foot-cell-padding-block: 1rem;
    --table-foot-cell-padding-inline: .75rem;
  }
}

.table--bordered {
  --table-cell-padding-inline: .75rem;
}

.table--bordered td {
  border-width: 1px;
}

.table--reduce-border :is(td) + td {
  border-inline-start-width: 0;
}

.table--no-border td {
  border: none;
}

.table--sm {
  --table-cell-padding-block: .35rem;
  --table-cell-padding-inline: .5rem;
}

.table--lg {
  --table-cell-padding-block: 1.5rem;
  --table-cell-padding-inline: .5rem;
}

@media screen and (min-width: 700px) {
  .table--lg {
    --table-cell-padding-block: 2rem;
    --table-cell-padding-inline: .75rem;
  }
}

.social-media--list {
  align-items: center;
  gap: var(--social-media-list-gap, .75rem 2rem);
  flex-wrap: wrap;
  display: flex;
}

.social-media--list .social-media__item {
  opacity: .65;
  transition: opacity .2s, color .2s;
}

.social-media--list svg {
  width: var(--social-media-icon-size, 1.25rem);
}

@media screen and (pointer: fine) {
  .social-media--list .social-media__item:hover {
    opacity: 1;
  }
}

.social-media--block {
  grid-template-columns: repeat(auto-fit, minmax(0, .33fr));
  gap: 1px;
  display: grid;
}

.social-media--block:has(:nth-child(4)) {
  grid-template-columns: repeat(auto-fit, minmax(0, .25fr));
}

.social-media--block .social-media__item {
  outline: 1px solid rgb(var(--border-color));
  z-index: 0;
  width: 100%;
  transition: background .15s, color .15s, outline .15s, z-index .15s;
}

.social-media--block a {
  padding-block: .625rem;
  display: block;
}

.social-media--block svg {
  margin-inline: auto;
}

@media screen and (pointer: fine) {
  .social-media--block .social-media__item:hover {
    background: rgb(var(--branding-background));
    outline-color: rgb(var(--branding-background));
    color: rgb(var(--branding-color));
    z-index: 1;
  }
}

@media not screen and (pointer: fine) {
  .social-media--block .social-media__item {
    background: rgb(var(--branding-background));
    outline-color: rgb(var(--branding-background));
    color: rgb(var(--branding-color));
  }
}

@media screen and (min-width: 700px) {
  .social-media--block {
    grid-template-columns: repeat(auto-fit, minmax(0, 3.75rem));
  }
}

.branding-colors--facebook {
  --branding-background: 24 119 242;
  --branding-color: 255 255 255;
}

.branding-colors--twitter {
  --branding-background: 29 161 242;
  --branding-color: 255 255 255;
}

.branding-colors--instagram {
  --branding-background: 195 42 163;
  --branding-color: 255 255 255;
}

.branding-colors--pinterest {
  --branding-background: 189 8 28;
  --branding-color: 255 255 255;
}

.branding-colors--youtube {
  --branding-background: 255 0 0;
  --branding-color: 255 255 255;
}

.branding-colors--tiktok {
  --branding-background: 1 1 1;
  --branding-color: 255 255 255;
}

.branding-colors--vimeo {
  --branding-background: 26 183 234;
  --branding-color: 255 255 255;
}

.branding-colors--linkedin {
  --branding-background: 10 102 194;
  --branding-color: 255 255 255;
}

.branding-colors--whatsapp {
  --branding-background: 79 206 93;
  --branding-color: 255 255 255;
}

.branding-colors--snapchat {
  --branding-background: 255 252 0;
  --branding-color: 0 0 0;
}

.branding-colors--tumblr {
  --branding-background: 54 70 93;
  --branding-color: 255 255 255;
}

.branding-colors--wechat {
  --branding-background: 9 184 62;
  --branding-color: 255 255 255;
}

.branding-colors--reddit {
  --branding-background: 255 69 0;
  --branding-color: 255 255 255;
}

.branding-colors--line {
  --branding-background: 6 199 85;
  --branding-color: 255 255 255;
}

.branding-colors--spotify {
  --branding-background: 30 215 96;
  --branding-color: 255 255 255;
}

.branding-colors--21buttons {
  --branding-background: 0 0 0;
  --branding-color: 255 255 255;
}

.branding-colors--email {
  --branding-background: var(--text-color);
  --branding-color: var(--background);
}

.color-swatch {
  --swatch-offset: 2px;
  --swatch-size: 2.125rem;
  --swatch-border-size: 1px;
  --swatch-disabled-strike-color: rgb(var(--border-color));
  width: var(--swatch-size);
  height: var(--swatch-size);
  padding: var(--swatch-offset);
  border: var(--swatch-border-size) solid transparent;
  background: content-box var(--swatch-background) no-repeat center/cover;
  place-items: center;
  display: grid;
  position: relative;
}

.color-swatch.is-disabled:before {
  content: "";
  margin: var(--swatch-disabled-margin, var(--swatch-offset));
  background: linear-gradient(to bottom right,
      transparent calc(50% - .5px),
      var(--swatch-disabled-strike-color) calc(50% - .5px) calc(50% + .5px),
      transparent calc(50% + .5px));
  position: absolute;
  inset: 0;
}

:disabled + .color-swatch {
  display: none;
}

:checked + .color-swatch, .color-swatch.is-selected {
  --swatch-disabled-margin: 0;
  --swatch-disabled-strike-color: currentColor;
  border-color: currentColor;
}

:focus-visible + .color-swatch {
  outline-offset: calc(var(--swatch-offset));
}

.color-swatch--underline {
  --swatch-size: 1.75rem;
  --swatch-offset: 0;
  border: none;
}

:is(:checked + .color-swatch--underline, .color-swatch--underline.is-selected):after {
  content: "";
  background-color: currentColor;
  width: 100%;
  height: 1px;
  position: absolute;
  inset-block-end: -5px;
  inset-inline-start: 0;
}

.thumbnail-swatch {
  --swatch-size: 3rem;
  --swatch-disabled-strike-color: rgb(var(--border-color));
  width: var(--swatch-size);
  height: var(--swatch-size);
  border-radius: min(4px, var(--input-border-radius));
  border-width: 1px;
  display: block;
  position: relative;
}

:checked + .thumbnail-swatch, .thumbnail-swatch.is-selected {
  --swatch-disabled-strike-color: currentColor;
  border-color: currentColor;
}

.thumbnail-swatch.is-disabled:before {
  content: "";
  background: linear-gradient(to bottom right,
      transparent calc(50% - .5px),
      var(--swatch-disabled-strike-color) calc(50% - .5px) calc(50% + .5px),
      transparent calc(50% + .5px));
  position: absolute;
  inset: 0;
}

:disabled + .thumbnail-swatch {
  display: none;
}

.thumbnail-swatch > img {
  border-radius: inherit;
  height: 100%;
}

:focus-visible + .thumbnail-swatch {
  outline-offset: 2px;
}

.thumbnail-swatch--underline {
  box-sizing: content-box;
  border-width: 0 0 1px;
  border-color: #0000;
  padding-block-end: .25rem;
}

:checked + .thumbnail-swatch--underline {
  border-color: currentColor;
}

@media screen and (min-width: 700px) {
  .thumbnail-swatch {
    --swatch-size: 4.25rem;
  }
}

.block-swatch {
  --swatch-border-size: 1px;
  --swatch-padding: calc(var(--input-padding-block) - var(--swatch-border-size) * 2) .875rem;
  --swatch-disabled-strike-color: rgb(var(--border-color));
  padding: var(--swatch-padding);
  border-width: var(--swatch-border-size);
  border-radius: var(--input-border-radius);
  min-width: 2.5rem;
  color: rgb(var(--text-color) / .65);
  justify-content: center;
  align-items: center;
  column-gap: .875rem;
  display: flex;
  position: relative;
}

.block-swatch.is-disabled {
  color: rgb(var(--text-color) / .5);
}

:checked + .block-swatch, .block-swatch.is-selected {
  --swatch-disabled-strike-color: currentColor;
  color: var(--text-color);
  border-color: currentColor;
}

.block-swatch.is-disabled:before {
  content: "";
  background: linear-gradient(to bottom right,
      transparent calc(50% - .5px),
      var(--swatch-disabled-strike-color) calc(50% - .5px) calc(50% + .5px),
      transparent calc(50% + .5px));
  position: absolute;
  inset: 0;
}

:disabled + .block-swatch {
  display: none;
}

:focus-visible + .block-swatch {
  outline-offset: 2px;
}

.block-swatch__color {
  background: var(--swatch-background) center / cover;
  width: 1rem;
  height: 1rem;
}

.block-underline {
  position: relative;
}

:is(:checked + .block-underline, .block-underline.is-selected):after {
  content: "";
  background-color: rgb(var(--text-color));
  width: 100%;
  height: 1px;
  position: absolute;
  inset-block-end: 2px;
  inset-inline-start: 0;
}

.block-underline.is-disabled {
  color: rgb(var(--text-color) / .65);
  text-decoration: line-through;
}

.image-filter {
  --image-filter-width: 3rem;
  grid-template-columns: var(--image-filter-width) minmax(0, 1fr);
  align-items: center;
  column-gap: 1.25rem;
  display: grid;
}

.image-filter__image {
  width: var(--image-filter-width);
  height: var(--image-filter-width);
  object-fit: contain;
  object-position: center;
}

.image-filter__label {
  grid-column-start: 2;
}

:checked + .image-filter .image-filter__image {
  outline: 1px solid rgb(var(--text-color));
}

:checked + .image-filter .image-filter__label {
  color: rgb(var(--text-color));
}

.content-tabs::part(tab-list) {
  border-block-end: 1px solid rgb(var(--border-color));
  white-space: nowrap;
  grid-auto-flow: column;
  justify-content: start;
  gap: 2.5rem;
  margin-block-end: 1.5rem;
  display: grid;
}

.content-tabs [role="tab"] {
  box-shadow: 0 1px rgb(var(--text-color));
  padding-block-end: .625rem;
  transition: opacity .2s ease-in, box-shadow .2s ease-in;
}

.content-tabs [role="tab"]:not([aria-selected="true"]) {
  opacity: .6;
  box-shadow: 0 1px #0000;
}

.content-tabs--center::part(tab-list) {
  width: max-content;
  margin-inline: auto;
}

.content-tabs--center::part(tab-panel-list) {
  text-align: center;
  width: min(800px, 100%);
  margin-inline: auto;
  display: block;
}

@media screen and (min-width: 1000px) {
  .content-tabs::part(tab-list) {
    gap: 4.375rem;
    margin-block-end: 2rem;
  }
}

.constrained-image {
  width: var(--image-mobile-max-width, var(--image-max-width));
  max-width: 100%;
}

@media screen and (min-width: 700px) {
  .constrained-image {
    width: var(--image-max-width);
  }
}

.text-with-icon {
  align-items: center;
  gap: .625rem;
  display: flex;
}

.text-with-icon > svg {
  flex-shrink: 0;
}

.icon {
  vertical-align: middle;
  height: auto;
  transition: transform .2s;
  display: block;
}

.group[aria-expanded="true"] .icon.group-expanded\:rotate {
  transform: rotateZ(180deg);
}

[dir="rtl"] .icon--direction-aware {
  scale: -1;
}

.offset-icon {
  --icon-baseline-distance: calc(1em * 1.65 / 2);
  top: var(--icon-baseline-distance);
  position: relative;
  translate: 0 -50%;
}

@supports (top: 1lh) {
  .offset-icon {
    top: .5lh;
  }
}

.price-list {
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: .5rem;
  display: flex;
}

.price-list--product {
  column-gap: 1rem;
}

.localization-selectors {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .75rem 1.75rem;
  display: flex;
}

.localization-selectors__separator {
  background: rgb(var(--border-color));
  width: 1px;
  height: .5rem;
}

.localization-selectors__separator:last-child {
  display: none;
}

.localization-toggle {
  vertical-align: middle;
  align-items: center;
  column-gap: .625rem;
  display: inline-flex;
}

.localization-toggle > svg {
  transition: transform .2s;
}

.localization-toggle[aria-expanded="true"] > svg {
  transform: rotate(180deg);
}

.country-flag {
  width: 20px;
  height: 15px;
}

.payment-methods {
  flex-wrap: wrap;
  gap: 1rem;
  display: flex;
}

.badge {
  width: max-content;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-style: var(--heading-font-style);
  letter-spacing: var(--heading-letter-spacing);
  text-transform: uppercase;
  align-items: center;
  padding: .0625rem .3125rem;
  font-size: .625rem;
  display: flex;
}

.badge--on-sale {
  background: rgb(var(--on-sale-badge-background));
  color: rgb(var(--on-sale-badge-text));
}

.badge--sold-out {
  background: rgb(var(--sold-out-badge-background));
  color: rgb(var(--sold-out-badge-text));
}

.badge--custom {
  background: rgb(var(--custom-badge-background));
  color: rgb(var(--custom-badge-text));
}

@media screen and (min-width: 700px) {
  .badge {
    font-size: .6875rem;
  }
}

.badge-list {
  flex-wrap: wrap;
  gap: .25rem;
  display: flex;
}

.badge-list--vertical {
  flex-direction: column;
}

.feature-badge {
  font-size: var(--text-xs);
  align-items: center;
  column-gap: .5rem;
  padding: .375rem .5rem;
  display: inline-flex;
}

.feature-badge :is(svg, img) {
  flex-shrink: 0;
}

.feature-badge-list {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.rating-badge {
  flex-wrap: wrap;
  align-items: center;
  column-gap: .5rem;
  line-height: normal;
  display: flex;
}

.rating-badge__stars {
  column-gap: .125rem;
  display: flex;
  position: relative;
  top: -.5px;
}

@media (pointer: fine) {
  .is-scrollable[allow-drag] {
    cursor: grab;
  }

  .is-scrollable[allow-drag]:active {
    cursor: grabbing;
    -webkit-user-select: none;
    user-select: none;
    scroll-snap-type: none;
  }
}

.text-with-rating {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .75rem .5rem;
  display: flex;
}

.inventory {
  row-gap: .5rem;
  font-style: italic;
  display: grid;
}

.progress-bar {
  background: rgb(var(--text-color) / .1);
  height: 2px;
  display: block;
  position: relative;
}

.progress-bar:before {
  content: "";
  width: 100%;
  height: 100%;
  transform: scaleX(var(--progress, 0));
  transform-origin: var(--transform-origin-start);
  background: currentColor;
  transition: transform .45s ease-in-out;
  display: block;
}

[data-tooltip] {
  --tooltip-text-color: var(--text-color);
  --tooltip-background: var(--background);
  position: relative;
}

@media screen and (pointer: fine) {
  [data-tooltip]:after {
    content: attr(data-tooltip);
    inset-block-end: calc(100% + var(--tooltip-offset, .5rem));
    border-radius: min(1.5rem, var(--button-border-radius));
    background: rgb(var(--tooltip-text-color));
    width: max-content;
    max-width: 15rem;
    color: rgb(var(--tooltip-background));
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    justify-self: center;
    padding: .125rem .5rem;
    font-size: .6875rem;
    transition: opacity .1s ease-in-out, visibility .1s ease-in-out, scale .1s ease-in-out;
    position: absolute;
    left: 50%;
    translate: -50%;
    scale: .9;
  }

  [data-tooltip]:hover:after {
    visibility: visible;
    opacity: 1;
    scale: 1;
  }
}

.separator-dot {
  --dot-size: .25rem;
  width: var(--dot-size);
  height: var(--dot-size);
  background: currentColor;
  border-radius: 100%;
}

.animated-plus {
  --animated-plus-size: .625rem;
  width: var(--animated-plus-size);
  height: var(--animated-plus-size);
  display: block;
  position: relative;
}

.animated-plus:before, .animated-plus:after {
  content: "";
  background-color: currentColor;
  transition: transform .25s ease-in-out, opacity .25s ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
}

.animated-plus:before {
  width: var(--animated-plus-size);
  opacity: 1;
  height: 1px;
}

.animated-plus:after {
  width: 1px;
  height: var(--animated-plus-size);
}

.group[aria-expanded="true"] .animated-plus.group-expanded\:rotate:before {
  opacity: 0;
}

.group[aria-expanded="true"] .animated-plus.group-expanded\:rotate:before, .group[aria-expanded="true"] .animated-plus.group-expanded\:rotate:after {
  transform: translate(-50%, -50%) rotate(90deg);
}

@media (pointer: fine) {
  .is-scrollable[allow-drag] {
    cursor: grab;
  }

  .is-scrollable[allow-drag]:active {
    cursor: grabbing;
    -webkit-user-select: none;
    user-select: none;
    scroll-snap-type: none;
  }
}

@media screen and (min-width: 700px) {
  .play-button svg {
    width: 5rem;
    height: 5rem;
  }
}

.quantity-selector {
  --quantity-selector-height: 2.4rem;
  --quantity-selector-input-width: 2.5rem;
  --tooltip-offset: calc(-1 * var(--quantity-selector-height) / 2 + 1rem);
  grid-template-columns: var(--quantity-selector-height) auto var(--quantity-selector-height);
  grid-auto-rows: var(--quantity-selector-height);
  border-width: 1px;
  align-items: center;
  display: inline-grid;
}

.quantity-selector:focus-within:has(:focus-visible) {
  border-color: currentColor;
}

.quantity-selector__button {
  place-content: center;
  min-height: 100%;
  display: grid;
}

.quantity-selector__button svg {
  transition: opacity .2s;
}

.quantity-selector__button[disabled] svg, .quantity-selector__button:hover svg {
  opacity: .65;
}

.quantity-selector__input-wrapper {
  place-items: center;
  display: grid;
}

.quantity-selector__input-wrapper > * {
  grid-area: 1 / -1;
}

.quantity-selector__input {
  -webkit-appearance: textfield;
  appearance: textfield;
  min-width: var(--quantity-selector-input-width);
  width: var(--quantity-selector-character-count, 1ch);
  text-align: center;
  background: none;
  transition: opacity .2s ease-in-out .2s;
}

.quantity-selector__input:focus {
  outline: none;
}

.quantity-selector__input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.quantity-selector__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

@media screen and (min-width: 700px) {
  .quantity-selector {
    --quantity-selector-height: 2.7rem;
  }
}

.quantity-selector--sm {
  --quantity-selector-height: 2.2rem;
  --quantity-selector-input-width: 2rem;
}

@keyframes quantitySelectorSpinner {
  0% {
    animation-timing-function: cubic-bezier(.45, 0, .55, 1);
    transform: rotate(0);
  }

  50% {
    animation-timing-function: cubic-bezier(.4, 0, .6, 1);
    transform: rotate(360deg);
  }

  100% {
    animation-timing-function: cubic-bezier(.45, 0, .55, 1);
    transform: rotate(720deg);
  }
}

.quantity-selector__spinner {
  transform-origin: center;
  opacity: 0;
  transition: opacity .2s ease-in-out,
    translate .2s ease-in-out,
    display .2s ease-in-out allow-discrete;
  animation: 2.5s cubic-bezier(.4, 0, .6, 1) infinite quantitySelectorSpinner;
  display: none;
  translate: 0 4px;
}

.quantity-selector__input-wrapper[aria-busy="true"] .quantity-selector__spinner {
  opacity: 1;
  display: block;
  translate: none;
}

@starting-style {
  .quantity-selector__input-wrapper[aria-busy="true"] .quantity-selector__spinner {
    opacity: 0;
    translate: 0 4px;
  }
}

.quantity-selector__input-wrapper[aria-busy="true"] .quantity-selector__input {
  opacity: 0;
  transition-delay: 0s;
}

.breadcrumb {
  display: none;
}

.breadcrumb__list {
  align-items: center;
  column-gap: .5rem;
  line-height: 1;
  display: flex;
}

.breadcrumb__list-item + .breadcrumb__list-item:before {
  content: "/";
  color: rgb(var(--text-color) / .65);
  margin-inline-end: .375rem;
  font-size: .625rem;
  display: inline-block;
}

@media screen and (min-width: 1000px) {
  .breadcrumb {
    display: block;
  }
}

.breadcrumb--floating {
  position: absolute;
  inset-block-start: 1.25rem;
  inset-inline-start: var(--container-gutter);
}

.bordered-box {
  border-width: 1px;
  padding: 2.5rem 1.25rem 1.25rem;
  position: relative;
}

.bordered-box__title {
  inset-block-start: 0;
  text-align: center;
  background: rgb(var(--background));
  width: max-content;
  padding-inline: .5rem;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media screen and (min-width: 1000px) {
  .bordered-box {
    padding: 3rem;
  }
}

.loading-bar {
  z-index: 2000;
  pointer-events: none;
  mix-blend-mode: exclusion;
  width: 100%;
  height: 2px;
  transform-origin: var(--transform-origin-start);
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  transform: scaleX(0);
}

@media screen and (min-width: 700px) {
  .loading-bar {
    height: 3px;
  }
}

@keyframes animateCircularProgress {
  from {
    stroke-dashoffset: var(--stroke-dasharray);
  }

  to {
    stroke-dashoffset: 0;
  }
}

.circular-progress {
  transition: opacity .25s;
  transform: rotate(-90deg);
}

.circular-progress circle:last-child {
  stroke-dasharray: var(--stroke-dasharray);
  stroke-dashoffset: var(--stroke-dasharray);
}

@media (prefers-reduced-motion: no-preference) {
  image-parallax img {
    transform: scale(1.3) translateY(-11.5385%);
  }
}

.scroll-margin-offset {
  scroll-margin-block-start: 20px;
}

.share-buttons {
  align-items: center;
  gap: .875rem;
  display: flex;
}

.share-buttons .social-media {
  --social-media-icon-size: 1rem;
  --social-media-list-gap: .75rem;
}

.share-buttons--native:not([hidden]) + .share-buttons {
  display: none;
}

product-rerender {
  display: contents;
}

.customer-account-box {
  min-height: calc(100vh - var(--section-vertical-spacing) * 2 - var(--announcement-bar-height, 0px) - var(--header-height, 0px));
  text-align: center;
  align-items: center;
  display: grid;
}

.customer-account-category {
  border-block-end-width: 1px;
  padding-block-end: .625rem;
}

.customer-account-overview {
  grid-gap: 2.5rem 3rem;
  display: grid;
}

.customer-account-order-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem;
  display: grid;
}

@media screen and (min-width: 1000px) {
  .customer-account-overview {
    grid-template-columns: minmax(0, 1fr) 14rem;
  }
}

@media screen and (min-width: 1150px) {
  .customer-account-overview {
    grid-template-columns: minmax(0, 1fr) 18rem;
    column-gap: 3.75rem;
  }
}

.customer-address-list {
  --addresses-per-row: 1;
  grid-template-columns: repeat(var(--addresses-per-row), minmax(0, 1fr));
  gap: 3rem 3.75rem;
  display: grid;
}

@media screen and (min-width: 700px) {
  .customer-address-list {
    --addresses-per-row: 2;
  }
}

@media screen and (min-width: 1000px) {
  .customer-address-list {
    --addresses-per-row: 3;
  }
}

.customer-order {
  grid: auto / minmax(0, 1fr);
  gap: 3rem;
  display: grid;
}

.customer-order__details {
  grid-template-columns: minmax(0, 1fr);
  row-gap: 3rem;
  display: grid;
}

.customer-order__address-list {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  align-content: start;
  gap: 2.5rem 3.75rem;
  display: grid;
}

@media screen and (min-width: 1150px) {
  .customer-order {
    grid: auto / auto-flow minmax(0, 1fr) 14rem;
    column-gap: 3.75rem;
  }
}

@media screen and (min-width: 1400px) {
  .customer-order {
    grid-auto-columns: minmax(0, 1fr) 18rem;
  }
}

.announcement-bar {
  --announcement-bar-gutter: .625rem;
  text-align: center;
  font-size: var(--announcement-bar-font-size);
  place-content: center;
  column-gap: .75rem;
  padding-block: 1em;
  padding-inline-start: max(var(--announcement-bar-gutter), 50% - var(--container-max-width) / 2);
  padding-inline-end: max(var(--announcement-bar-gutter), 50% - var(--container-max-width) / 2);
  display: flex;
}

.announcement-bar__carousel {
  flex-grow: 1;
  place-items: center;
  max-width: 35rem;
  display: grid;
}

.announcement-bar__carousel > * {
  grid-area: 1 / -1;
}

.announcement-bar__carousel > :not(.is-selected) {
  visibility: hidden;
}

@media screen and (min-width: 700px) {
  .announcement-bar {
    --announcement-bar-gutter: var(--container-gutter);
    justify-content: center;
    column-gap: 2.5rem;
  }
}

.before-after {
  --before-after-content-inset-inline: 1.25rem;
  --before-after-content-inset-block: 1rem;
  --before-after-cursor-size: 3.125rem;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  display: grid;
  position: relative;
}

.before-after > * {
  grid-area: 1 / -1;
}

.before-after__after-image {
  z-index: 1;
}

.before-after__content-wrapper {
  position: absolute;
}

.before-after__cursor {
  pointer-events: auto;
  filter: drop-shadow(0 1px 1px #0000000d) drop-shadow(0 1px 1px #0000000d);
  z-index: 1;
  display: grid;
  position: relative;
}

.before-after__cursor:before {
  content: "";
  background: rgb(var(--before-after-cursor-background));
  z-index: -1;
  position: absolute;
}

.before-after__cursor svg {
  width: var(--before-after-cursor-size);
  height: var(--before-after-cursor-size);
}

.before-after--horizontal {
  cursor: ew-resize;
}

.before-after--horizontal .before-after__after-image {
  clip-path: inset(0 0 0 var(--before-after-cursor-position, 0%));
}

[dir="rtl"] :is(.before-after--horizontal .before-after__after-image) {
  clip-path: inset(0 var(--before-after-cursor-position, 0%) 0 0);
}

.before-after--horizontal .before-after__before-image .before-after__content-wrapper {
  justify-items: start;
  inset-block-end: var(--before-after-content-inset-block);
  inset-inline-start: var(--before-after-content-inset-inline);
}

.before-after--horizontal .before-after__after-image .before-after__content-wrapper {
  text-align: end;
  justify-items: end;
  inset-block-end: var(--before-after-content-inset-block);
  inset-inline-end: var(--before-after-content-inset-inline);
}

.before-after--horizontal .before-after__cursor {
  justify-self: start;
  place-items: center start;
  inset-inline-start: calc(var(--before-after-cursor-position, 0%) - var(--before-after-cursor-size) / 2);
}

.before-after--horizontal .before-after__cursor:before {
  width: .125rem;
  height: 100%;
  inset-inline-start: calc(var(--before-after-cursor-size) / 2);
}

.before-after--vertical {
  cursor: ns-resize;
}

.before-after--vertical .before-after__after-image {
  clip-path: inset(var(--before-after-cursor-position, 0%) 0 0 0);
}

.before-after--vertical .before-after__before-image .before-after__content-wrapper {
  justify-items: start;
  inset-block-start: var(--before-after-content-inset-block);
  inset-inline-start: var(--before-after-content-inset-inline);
}

.before-after--vertical .before-after__after-image .before-after__content-wrapper {
  justify-items: start;
  inset-block-end: var(--before-after-content-inset-block);
  inset-inline-start: var(--before-after-content-inset-inline);
}

.before-after--vertical .before-after__cursor {
  align-self: start;
  place-items: start center;
  inset-block-start: calc(var(--before-after-cursor-position, 0%) - var(--before-after-cursor-size) / 2);
}

.before-after--vertical .before-after__cursor:before {
  width: 100%;
  height: .125rem;
  inset-block-start: calc(var(--before-after-cursor-size) / 2);
}

@media screen and (max-width: 699px) {
  .before-after {
    --before-after-cursor-size: 2.5rem;
  }

  .before-after .button {
    padding: .45rem 1.5rem;
  }
}

@media screen and (min-width: 700px) {
  .before-after {
    --before-after-content-inset-inline: 2.5rem;
    --before-after-content-inset-block: 2rem;
  }

  .before-after__content-wrapper:has(.button) {
    --before-after-content-inset-block: 2.5rem;
  }
}

.blog-tags {
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem 1.5rem;
  display: flex;
}

.article {
  --article-wrapper-offset: 0px;
  --article-wrapper-padding-inline: 0px;
  padding-block-end: var(--section-vertical-spacing);
}

.article__toolbar {
  visibility: hidden;
  z-index: 1;
  width: 100vw;
  padding-block: 1rem;
  transition: transform .2s, visibility .2s, inset-block-start .15s ease-in-out;
  position: fixed;
  inset-block-start: var(--sticky-area-height);
  transform: translateY(-100%);
}

.article__toolbar.is-visible {
  visibility: visible;
  transform: translateY(0);
}

.article__toolbar .social-media {
  gap: .75rem 1rem;
}

.article__toolbar .social-media svg {
  width: 1rem;
  height: 1rem;
}

.article__image {
  overflow: hidden;
}

.article__image img {
  height: var(--article-image-height);
  object-fit: cover;
}

.article__wrapper {
  padding: 1.5rem var(--article-wrapper-padding-inline) 0;
  background: rgb(var(--background));
  gap: 5rem;
  margin-inline-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2 - var(--article-wrapper-padding-inline));
  margin-inline-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2 - var(--article-wrapper-padding-inline));
  display: grid;
  position: relative;
}

.article__image + .article__wrapper {
  margin-block-start: var(--article-wrapper-offset);
}

.article__comments {
  gap: inherit;
  scroll-margin-block-start: calc(var(--sticky-area-height) + 20px);
  display: grid;
}

.article__author {
  border-block-width: 1px;
  align-items: center;
  column-gap: 1rem;
  padding-block: 1.5rem;
  display: flex;
}

.article__author-image {
  border-radius: 100%;
  flex-shrink: 0;
  align-self: start;
  width: 3.75rem;
}

.article__footer-bottom {
  gap: 2.5rem;
  display: grid;
}

.article__author + .article__footer-bottom {
  margin-block-start: 1.75rem;
}

@media screen and (min-width: 700px) {
  .article {
    --article-wrapper-offset: -2.75rem;
    --article-wrapper-padding-inline: 3.125rem;
  }

  .article__wrapper {
    gap: 6.25rem;
    padding-block-start: 2.5rem;
  }

  .article__footer-bottom {
    grid: auto / auto-flow minmax(0, 1fr);
    align-items: center;
  }
}

@media screen and (min-width: 1000px) {
  .article {
    --article-wrapper-offset: -4.375rem;
  }
}

.comment {
  gap: 1.125rem;
  display: grid;
}

.comment:not(:first-child) {
  padding-block-start: 2rem;
}

.cart-page {
  align-items: start;
  row-gap: max(4rem, var(--section-vertical-spacing-tight));
  display: grid;
}

.cart-footer {
  flex-direction: column;
  gap: 1.5rem;
  display: flex;
}

.cart-recap {
  gap: .5rem;
  display: grid;
}

.cart-recap [type="submit"] {
  margin-block-start: 1rem;
}

@media screen and (min-width: 700px) {
  .cart-footer {
    flex-direction: row;
    gap: 3rem;
  }

  .cart-footer > :not(:only-child) {
    width: min(24rem, 100%);
  }

  .cart-recap {
    text-align: end;
    justify-items: end;
    margin-inline-start: auto;
  }
}

@media screen and (min-width: 1000px) {
  .cart-page {
    row-gap: max(6rem, var(--section-vertical-spacing-tight));
  }
}

.cart-discount-field__loader {
  display: none;
  position: absolute;
  inset-block-start: calc(50% - .375rem);
  inset-inline-end: 1rem;
}

.cart-discount-field[aria-busy="true"] .cart-discount-field__loader {
  animation: 1s linear infinite spin;
  display: block;
}

@keyframes spin {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.cart-drawer::part(body) {
  padding-block: 0;
}

:is(.cart-drawer:has(.cart-drawer__order-note[open])::part(header), .cart-drawer:has(.cart-drawer__order-note[open])::part(body)) {
  opacity: .4;
  pointer-events: none;
  transition: opacity .2s;
}

.cart-drawer:not(:has(.cart-drawer__footer:only-child))::part(footer) {
  padding-block-start: calc(var(--drawer-footer-padding-block) - .5rem);
}

.cart-drawer .free-shipping-bar {
  font-size: var(--text-sm);
  border-block-end-width: 1px;
  margin-inline-start: calc(-1 * var(--drawer-body-padding-inline));
  margin-inline-end: calc(-1 * var(--drawer-body-padding-inline));
  padding-block: .5rem;
  padding-inline-start: var(--drawer-body-padding-inline);
  padding-inline-end: var(--drawer-body-padding-inline);
}

.cart-drawer__items {
  gap: 1.5rem;
  padding-block-start: var(--drawer-body-padding-block);
  padding-block-end: var(--drawer-body-padding-block);
  display: grid;
}

.cart-drawer__complementary-products {
  padding-inline: var(--drawer-body-padding-inline);
  border-block-start-width: 1px;
  padding-block: 1.25rem;
  margin-inline: calc(-1 * var(--drawer-body-padding-inline)) !important;
  row-gap: 1.25rem !important;
}

.cart-drawer__button-price {
  align-items: center;
  display: flex;
}

.cart-drawer__button-price:before {
  content: "";
  background: currentColor;
  border-radius: 100%;
  width: 3px;
  height: 3px;
  margin-inline-end: 1.125rem;
}

.cart-drawer__footer {
  align-items: start;
  gap: 1rem;
  display: grid;
}

.cart-drawer__order-note {
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  width: 100%;
  box-shadow: 1px 0 6px rgb(var(--border-color));
  z-index: 2;
  border-block-start-width: 1px;
  padding-block-start: calc(var(--drawer-footer-padding-block) - .5rem);
  padding-block-end: var(--drawer-footer-padding-block);
  padding-inline-start: var(--drawer-body-padding-inline);
  padding-inline-end: var(--drawer-body-padding-inline);
  display: none;
  position: absolute;
  inset-block-end: 0;
  inset-inline-start: 0;
}

@media screen and (min-width: 700px) {
  .cart-drawer__complementary-products {
    padding-block: 2rem;
    row-gap: 1rem !important;
  }
}

.collection-banner {
  display: block;
  position: relative;
}

.collection-banner .breadcrumb {
  z-index: 2;
}

.collection {
  --collection-gap: 2rem;
  --collection-grid-template: minmax(0, 1fr);
  --collection-sidebar-width: 15rem;
  grid-template-columns: var(--collection-grid-template);
  align-items: start;
  gap: var(--collection-gap);
  margin-block-end: var(--section-vertical-spacing);
  scroll-margin-block-start: calc(var(--collection-toolbar-height, 0px) + 20px);
  display: grid;
}

.collection:only-child {
  margin-block-start: 1.5rem;
}

.collection__main {
  row-gap: var(--section-stack-gap);
  display: grid;
}

.collection .product-list[collection-mobile-layout="medium"] {
  --product-list-items-per-row: var(--collection-items-per-row-medium);
}

.collection .product-list[collection-mobile-layout="large"] {
  --product-list-items-per-row: var(--collection-items-per-row-large);
}

@media screen and (min-width: 700px) {
  .collection:only-child {
    margin-block-start: 3rem;
  }

  .collection .product-list[collection-desktop-layout="compact"] {
    --product-list-items-per-row: var(--collection-items-per-row-compact);
  }

  .collection .product-list[collection-desktop-layout="compact"] .product-card__info {
    display: none;
  }

  .collection .product-list[collection-desktop-layout="medium"] {
    --product-list-items-per-row: var(--collection-items-per-row-medium);
  }

  .collection .product-list[collection-desktop-layout="large"] {
    --product-list-items-per-row: var(--collection-items-per-row-large);
  }
}

@media screen and (min-width: 1150px) {
  .collection {
    --collection-gap: 3.125rem;
  }
}

.collection-toolbar {
  min-height: 3em;
  box-shadow: 0 1px rgb(var(--border-color)),
    0 -1px rgb(var(--border-color));
  background-color: rgb(var(--background));
  reading-flow: flex-visual;
  z-index: 2;
  transition: inset-block-start .15s ease-in-out;
  display: flex;
  position: sticky;
  inset-block-start: var(--sticky-area-height);
  inset-inline-start: 0;
}

.collection-toolbar .popover {
  --popover-block-offset: 0px;
  inset-inline-end: -1px;
}

.collection-toolbar__button-list {
  reading-flow: flex-visual;
  flex-grow: 1;
  display: flex;
}

.collection-toolbar__button {
  padding-block: .75rem;
}

.collection-toolbar__button :is(svg) {
  transition: transform .2s;
}

.collection-toolbar__button[aria-expanded="true"] svg {
  transform: rotateZ(180deg);
}

.collection-toolbar__button-container {
  width: 100%;
  position: relative;
}

.collection-toolbar__button-container + .collection-toolbar__button-container {
  border-inline-start-width: 1px;
}

.collection-toolbar__layout-switch-list {
  border-inline-start-width: 1px;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
  padding-inline: 1.25rem;
  display: flex;
}

.collection-toolbar__button {
  opacity: .5;
  transition: opacity .2s;
}

.collection-toolbar__button:hover, .collection-toolbar__button.is-active {
  opacity: 1;
}

@media screen and (min-width: 700px) {
  .collection-toolbar {
    flex-direction: row-reverse;
    justify-content: space-between;
  }

  .collection-toolbar__button {
    padding-block: 1.125rem;
  }

  .collection-toolbar__button-list {
    flex-direction: row-reverse;
    flex: none;
  }

  .collection-toolbar__button-container {
    border-inline-start-width: 1px;
  }

  .collection-toolbar__button-container > .collection-toolbar__button {
    width: max-content;
    padding-inline: 2.875rem;
  }

  .collection-toolbar__layout-switch-list {
    border-inline-width: 0 1px;
    padding-inline: 1.875rem;
  }

  .collection-toolbar__products-count {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    transform: translate(-50%, -50%);
  }
}

.facets .accordion-list .accordion:first-child {
  border-block-start-width: 0;
}

.facets .accordion-list .accordion:first-child .accordion__toggle {
  padding-block-start: 0;
}

.facets .accordion-list .accordion:last-child {
  border-block-end-width: 0;
}

.facets .accordion-list .accordion:last-child .accordion__content {
  padding-block-end: 0;
}

.active-facets {
  flex-wrap: wrap;
  align-items: center;
  gap: .625rem;
  display: flex;
}

.removable-facet {
  font-size: var(--text-sm);
  border-width: 1px;
  align-items: center;
  column-gap: .375rem;
  padding: .375rem .625rem;
  display: flex;
}

.facets-clear-all {
  margin-inline-start: .625rem;
}

@media screen and (min-width: 700px) {
  .removable-facet {
    font-size: var(--text-base);
    column-gap: .625rem;
    padding: .625rem .875rem;
  }
}

@media screen and (min-width: 1000px) {
  .facets-sidebar {
    top: calc(var(--sticky-area-height) + var(--collection-toolbar-height, 0px) + 20px);
    width: var(--collection-sidebar-width);
    grid-column-end: -2;
    display: block;
    position: sticky;
  }
}

.collection-list {
  gap: var(--collection-list-gap, 0px);
  display: flex;
}

.collection-list .collection-card {
  flex-basis: var(--collection-list-item-size, calc(100% / var(--collection-list-items-per-row) - var(--collection-list-gap, 0px) * (var(--collection-list-items-per-row) - 1) / var(--collection-list-items-per-row)));
}

.collection-list--text-outside {
  row-gap: 3rem;
}

.collection-card {
  align-content: start;
  gap: 1.5rem;
  display: grid;
}

.countdown {
  gap: var(--section-stack-gap);
  display: grid;
}

.countdown__timer {
  text-transform: uppercase;
  text-align: center;
  grid: auto / auto-flow minmax(0, 1fr) auto;
  align-items: center;
  column-gap: .75rem;
  display: grid;
}

.countdown__timer-item {
  display: grid;
}

.countdown__timer-flip {
  --heading-letter-spacing: 0;
  justify-content: center;
  column-gap: 2px;
  display: flex;
}

.countdown__timer-flip::part(digit) {
  color: rgb(var(--countdown-timer-flip-text-color));
}

.countdown__timer-flip--background::part(digit) {
  background: rgb(var(--countdown-timer-flip-background));
  border-radius: .25rem;
  padding: .375rem .5rem;
}

@media screen and (max-width: 699px) {
  .countdown__content {
    text-align: center;
  }

  .countdown__timer {
    justify-content: center;
  }
}

@media screen and (min-width: 700px) {
  .countdown {
    grid-template-columns: minmax(250px, 570px) max-content;
    justify-content: space-between;
    gap: 4rem;
    width: 100%;
  }

  .countdown__timer-item {
    row-gap: .5rem;
  }

  .countdown--reverse {
    grid-template-columns: max-content minmax(250px, 570px);
  }

  .countdown--reverse .countdown__timer {
    order: -1;
  }
}

@media screen and (min-width: 1000px) {
  .countdown__timer {
    column-gap: 1rem;
  }
}

.countdown-condensed {
  column-gap: 2.25rem;
  justify-content: var(--countdown-condensed-justify-content, space-between);
  padding: 1rem var(--container-gutter);
  display: flex;
}

.countdown-condensed__text {
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem 1.5rem;
  display: flex;
}

.countdown-condensed__timer {
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-style: var(--heading-font-style);
  letter-spacing: .2em;
  text-transform: uppercase;
  text-align: center;
  flex-shrink: 0;
  align-items: center;
  column-gap: .25rem;
  display: flex;
}

.countdown-condensed__timer-item {
  display: grid;
}

.countdown-condensed__timer-flip {
  font-size: .625rem;
  font-weight: bolder;
}

.countdown-condensed__timer-unit {
  font-size: .5rem;
}

@media screen and (max-width: 699px) {
  .countdown-condensed .h6 {
    font-size: .625rem;
  }
}

@media screen and (min-width: 700px) {
  .countdown-condensed {
    column-gap: 5rem;
  }

  .countdown-condensed__timer {
    column-gap: .75rem;
  }

  .countdown-condensed__timer-flip {
    font-size: .75rem;
  }

  .countdown-condensed__timer-unit {
    font-size: .625rem;
  }
}

@keyframes cell-parallax {
  from {
    transform: var(--parallax-transform-from);
  }

  to {
    transform: var(--parallax-transform-to);
  }
}

.shopify-section--dynamic-grid:first-child:has([allow-transparent-header]) .dynamic-grid {
  margin-block-start: var(--header-height, 0px);
}

.dynamic-grid {
  --dynamic-grid-column-count: 8;
  --dynamic-grid-cell-size: calc((100vw - var(--container-gutter-context, 0px) * 2) / var(--dynamic-grid-column-count) - var(--dynamic-grid-gap) * (var(--dynamic-grid-column-count) - 1) /
      var(--dynamic-grid-column-count));
  grid-template-columns: repeat(var(--dynamic-grid-column-count), minmax(0, 1fr));
  grid-template-rows: repeat(var(--dynamic-grid-explicit-row-count), var(--dynamic-grid-cell-size))
    max-content;
  gap: var(--dynamic-grid-gap);
  view-timeline: --section;
  display: grid;
  position: relative;
}

.dynamic-grid.editor-is-selected:before {
  content: "";
  background-image: repeating-linear-gradient(#c8c8c833 0,
        #c8c8c833 var(--dynamic-grid-cell-size),
        transparent var(--dynamic-grid-cell-size),
        transparent calc(var(--dynamic-grid-cell-size) + max(1px, var(--dynamic-grid-gap)))),
      repeating-linear-gradient(90deg,
        #c8c8c833 0,
        #c8c8c833 var(--dynamic-grid-cell-size),
        transparent var(--dynamic-grid-cell-size),
        transparent calc(var(--dynamic-grid-cell-size) + max(1px, var(--dynamic-grid-gap))));
  background-size: 100%
      calc(var(--dynamic-grid-cell-size) * var(--dynamic-grid-explicit-row-count) + max(1px, var(--dynamic-grid-gap)) * (var(--dynamic-grid-explicit-row-count) - 1));
  position: absolute;
  inset: 0;
}

.dynamic-grid__cell {
  --offset-amount: calc(var(--parallax-speed, 0) * 5vmin);
  --parallax-transform-from: translateX(calc(-1 * var(--offset-amount)));
  --parallax-transform-to: translateX(var(--offset-amount));
  grid-area: var(--dynamic-grid-grid-area);
  isolation: isolate;
  align-self: start;
  transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  position: relative;
  inset-block-start: var(--dynamic-grid-vertical-adjustment);
  inset-inline-start: var(--dynamic-grid-horizontal-adjustment);
}

@supports (animation-timeline: view()) {
  .dynamic-grid__cell {
    animation: linear forwards cell-parallax;
    animation-timeline: --section;
    animation-range: cover;
  }
}

.dynamic-grid__cell[data-parallax-direction="vertical"] {
  --parallax-transform-from: translateY(calc(-1 * var(--offset-amount)));
  --parallax-transform-to: translateY(var(--offset-amount));
}

.dynamic-grid__cell.editor-is-selected {
  outline-offset: 2px;
  background-color: #0000000d;
  outline: 2px dashed gray;
}

.dynamic-grid__cell:has(.editor-is-selected) {
  outline-offset: 2px;
  background-color: #0000000d;
  outline: 2px dashed gray;
}

.dynamic-grid__cell img, .dynamic-grid__cell video, .dynamic-grid__cell .play-button {
  margin-block-start: 0 !important;
}

.dynamic-grid__cell video-media {
  width: 100%;
}

.dynamic-grid.editor-is-selected .dynamic-grid__cell:not(.editor-is-selected) {
  opacity: .6;
}

@media screen and (min-width: 1000px) {
  .dynamic-grid {
    --dynamic-grid-column-count: 16;
  }
}

.footer {
  background: rgb(var(--background));
  background-image: var(--background-gradient);
  color: rgb(var(--text-color));
  padding-block-start: var(--section-vertical-spacing);
  padding-block-end: min(var(--section-vertical-spacing), 3rem);
}

.footer__inner {
  row-gap: min(var(--section-vertical-spacing), 3rem);
  display: grid;
}

.footer__block-list {
  justify-content: start;
  align-items: start;
  gap: min(var(--section-vertical-spacing), 2.5rem);
  display: grid;
}

.footer__aside {
  text-align: center;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
  display: grid;
}

.footer__aside .payment-methods {
  justify-content: center;
  max-width: 30rem;
}

@media screen and (min-width: 700px) {
  .footer__block-list {
    justify-content: var(--footer-content-justify-items);
    flex-wrap: wrap;
    gap: 3rem;
    display: flex;
  }

  .footer__block {
    flex: auto;
  }

  .footer__block--links, .footer__block--image {
    flex-grow: 0;
    max-width: 14rem;
  }

  .footer__block--newsletter, .footer__block--app {
    flex-basis: 14rem;
    max-width: 18rem;
  }

  .footer__block--text {
    flex-basis: 14rem;
    max-width: 24rem;
  }
}

@media screen and (min-width: 1000px) {
  .footer__aside {
    grid-auto-flow: column;
    justify-content: space-between;
  }

  .footer__aside .payment-methods {
    justify-content: end;
  }
}

@media screen and (min-width: 1150px) {
  .footer__block-list {
    justify-content: var(--footer-content-justify-items);
    column-gap: 3.75rem;
  }
}

@media screen and (min-width: 1400px) {
  .footer__block-list {
    column-gap: 5rem;
  }
}

.gift-card__image {
  max-width: 16.875rem;
  margin-inline: auto;
}

.gift-card__redeem-info {
  padding: 1.5rem;
}

.gift-card__save {
  place-items: center;
  gap: 1.5rem;
  display: grid;
}

.gift-card__qr-code {
  width: 5rem;
  height: 5rem;
}

@media screen and (min-width: 700px) {
  .gift-card__redeem-info {
    padding: 2rem;
  }

  .gift-card__save {
    grid-auto-flow: column;
  }
}

.faq {
  justify-content: center;
  align-items: start;
  column-gap: 3.75rem;
  display: flex;
}

.faq__toc {
  align-content: start;
  justify-items: start;
  gap: .75rem;
  min-width: 150px;
  max-width: 300px;
  transition: inset-block-start .15s ease-in-out;
  display: grid;
  position: sticky;
  inset-block-start: calc(var(--sticky-area-height) + 1.25rem);
}

.faq__toc-item {
  background: linear-gradient(to right, currentColor, currentColor) 0 min(100%, 1.35em) / 0 1px no-repeat;
  text-decoration: none;
  transition: background-size .3s ease-in-out;
}

.faq__toc-item.is-active {
  background-size: 100% 1px;
}

.faq__content {
  flex-basis: 650px;
}

.faq__category {
  flex-wrap: wrap;
  align-items: center;
  column-gap: 1rem;
  scroll-margin-block-start: 1.25rem;
  display: flex;
}

.faq__category + .accordion {
  margin-block-start: 1.25rem;
}

.accordion + .faq__category {
  margin-block-start: 3rem;
}

.featured-collections-navigation {
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  justify-content: safe center;
  column-gap: 1.5rem;
  display: grid;
}

.featured-collections-navigation > button:not(:only-child) {
  padding-block-end: 2px;
  position: relative;
}

.featured-collections-navigation > button:not(:only-child):after {
  content: "";
  width: calc(100% - var(--heading-letter-spacing));
  height: 1px;
  transform-origin: var(--transform-origin-start);
  background: currentColor;
  transition: transform .3s;
  position: absolute;
  inset-block-end: 0;
  inset-inline-start: 0;
  transform: scaleX(0);
}

.featured-collections-navigation > button:not(:only-child)[aria-current="true"]:after {
  transform: scaleX(1);
}

@media screen and (min-width: 700px) {
  .featured-collections-navigation {
    column-gap: 2.5rem;
  }
}

.featured-collections-carousel {
  display: grid;
  position: relative;
}

.featured-collections-carousel > * {
  grid-area: 1 / -1;
}

.featured-collections-carousel__item {
  gap: var(--section-stack-gap);
  grid-template-columns: minmax(0, 1fr);
  display: grid;
}

.featured-collections-carousel__item:not(.is-selected) {
  display: none;
}

.header {
  --header-show-transparent-logo: 0;
  grid: var(--header-grid);
  justify-content: center;
  align-items: center;
  column-gap: 1.25rem;
  row-gap: var(--header-padding-block);
  box-shadow: 0 -1px rgb(var(--header-separation-border-color)) inset;
  reading-flow: grid-columns;
  padding-block-start: var(--header-padding-block);
  padding-block-end: var(--header-padding-block);
  padding-inline-start: var(--container-gutter);
  padding-inline-end: var(--container-gutter);
  transition: background .2s, color .2s, border .2s, box-shadow .2s, transform .15s ease-in-out;
  display: grid;
  position: relative;
}

.header.is-hidden {
  transform: translateY(-100%);
}

.shopify-section--header:has(.header.is-hidden) {
  pointer-events: none;
}

:has(.shopify-section:first-child [allow-transparent-header]):not(:has(.shopify-section--header ~ .shopify-section-group-header-group)) .header {
  margin-block-end: calc(-1 * var(--header-height, 0px));
}

:has(.shopify-section:first-child [allow-transparent-header]):not(:has(.shopify-section--header ~ .shopify-section-group-header-group)) .header:not(:hover, .is-solid, :has(.header__primary-nav [open], .header__secondary-nav [open], .header-search[open])) {
  --header-show-transparent-logo: 1;
  --header-separation-border-color: 0 0 0 / 0;
  --background: 0 0 0 / 0;
  --background-gradient: 0 0 0 / 0;
  --border-color: 0 0 0 / 0;
  --text-color: var(--header-transparent-header-text-color);
}

:has(.shopify-section:first-child [allow-transparent-header]):not(:has(.shopify-section--header ~ .shopify-section-group-header-group)) .header:not(:hover, .is-solid, :has(.header__primary-nav [open], .header__secondary-nav [open], .header-search[open])) .link-faded {
  color: currentColor;
  transition: none;
}

.header__cart-dot {
  width: .5rem;
  height: .5rem;
  box-shadow: 0 0 0 2px rgb(var(--background));
  background-color: currentColor;
  border-radius: 100%;
  transition: transform .2s ease-in-out;
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: -.125rem;
  transform: scale(0);
}

.header__cart-dot.is-visible {
  transform: scale(1);
}

@media screen and (min-width: 700px) {
  .header {
    column-gap: 2.5rem;
  }
}

.header__logo {
  grid-area: logo;
  justify-self: start;
  position: relative;
}

.header__logo-image {
  width: var(--header-logo-width);
  max-width: 100%;
  height: auto;
}

.header__logo-image:where(:not(:only-of-type)) {
  opacity: calc(1 - var(--header-show-transparent-logo));
  transition: opacity .2s;
}

.header__logo-image--transparent {
  opacity: var(--header-show-transparent-logo);
  pointer-events: none;
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
}

.header__logo-text {
  display: block;
}

.header__primary-nav {
  flex-wrap: wrap;
  grid-area: primary-nav;
  align-items: center;
  gap: .625rem 1.25rem;
  display: flex;
}

.header__primary-nav-item [data-title]:before {
  content: attr(data-title);
  width: max-content;
  height: 2px;
  transform-origin: var(--transform-origin-start);
  background: rgb(var(--text-color));
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: #0000;
  pointer-events: none;
  transition: transform .2s ease-in-out;
  position: absolute;
  inset-block-end: 0;
  transform: scaleX(0);
}

.header__primary-nav-item [data-title]:hover:before {
  transform: scaleX(1);
}

.header__primary-nav-item [data-title]:has(.header__dropdown-menu):before {
  display: none;
}

@media screen and (max-width: 699px) {
  .header__nav-icon {
    width: 1.375rem;
  }
}

@media screen and (min-width: 1000px) {
  .header__primary-nav--center {
    justify-content: safe center;
  }
}

@media screen and (min-width: 1150px) {
  .header__primary-nav {
    column-gap: 2.5rem;
  }
}

.header__secondary-nav {
  flex-wrap: wrap;
  grid-area: secondary-nav;
  justify-content: end;
  justify-self: end;
  align-items: center;
  gap: .625rem .9rem;
  display: flex;
}

.header__secondary-nav .localization-selectors:not(:only-child) {
  margin-inline-end: .625rem;
}

@media screen and (min-width: 700px) {
  .header__secondary-nav {
    column-gap: 1.25rem;
  }
}

shopify-account {
  --shopify-account-font-heading: var(--heading-font-family);
  --shopify-account-font-heading-weight: var(--heading-font-weight);
  --shopify-account-font-body: var(--text-font-family);
  --shopify-account-font-body-weight: var(--text-font-weight);
  --shopify-account-radius-button: var(--button-border-radius);
  --shopify-account-radius-input: var(--input-border-radius);
  --shopify-account-radius-dialog: 0;
  --shopify-account-color-background: rgb(var(--modal-scheme-background));
  --shopify-account-color-text: rgb(var(--modal-scheme-text-color));
  --shopify-account-signed-in-avatar-color-background: rgb(var(--text-color));
  --shopify-account-signed-in-avatar-color-text: rgb(from rgb(var(--text-color)) calc(255 - r) calc(255 - g) calc(255 - b));
  --shopify-account-signed-in-avatar-size: 24px;
  --shopify-account-avatar-size: none;
  display: block;
}

shopify-account::part(signed-out-avatar) {
  line-height: 1.7;
}

.header__dropdown-menu {
  background: rgb(var(--background));
  width: max-content;
  min-width: 12.5rem;
  max-width: 17.5rem;
  color: rgb(var(--text-color));
  box-shadow: 2px 2px 6px rgb(var(--text-color) / .05);
  border-width: 0 1px 1px;
  padding-block: 1.125rem;
  position: absolute;
  inset-block-start: calc(100% - 2px);
}

.header__dropdown-menu:not(:has(.header__dropdown-menu)) {
  max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 20px);
  overflow: auto;
}

.header__dropdown-menu:before {
  content: "";
  width: 100%;
  height: 2px;
  transform-origin: var(--transform-origin-start);
  background: rgb(var(--text-color));
  transition: transform .25s ease-in-out 50ms;
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  transform: scaleX(0);
}

[aria-expanded="true"] > .header__dropdown-menu:before {
  transform: scaleX(1);
}

.header__dropdown-menu :is(a, summary) {
  padding: .375rem 1.5625rem;
  display: block;
}

.header__dropdown-menu .header__menu-disclosure {
  position: relative;
}

.header__dropdown-menu--restrictable {
  max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 40px);
  overflow-y: auto;
}

.header__dropdown-menu .header__dropdown-menu {
  border-width: 1px;
  inset-block-start: calc(-1.125rem - 1px);
  inset-inline-start: 100%;
}

.header__dropdown-menu .header__dropdown-menu:before {
  display: none;
}

.header-search {
  z-index: -1;
  width: 100%;
  display: none;
  position: absolute;
  inset-block-start: 100%;
  inset-inline-start: 0;
}

.header-search::part(overlay) {
  min-height: calc(100vh - var(--sticky-area-height));
  inset-block-start: var(--sticky-area-height);
}

.header-search::part(content) {
  max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 1.25rem);
  background: rgb(var(--background));
  color: rgb(var(--text-color));
  overflow: auto;
}

@supports (max-height: 100dvh) {
  .header-search::part(content) {
    max-height: min(var(--header-search-max-height, 100vh), 100dvh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 1.25rem);
  }
}

.header-search__form-control {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: .75rem;
  padding-block: .75rem;
  display: grid;
}

.header-search__input {
  -webkit-appearance: none;
  appearance: none;
  background: none;
}

.header-search__input:focus {
  outline: none;
}

.header-search__input::-webkit-search-decoration {
  display: none;
}

.header-search__input::-webkit-search-cancel-button {
  display: none;
}

.header-search__input::-webkit-search-results-button {
  display: none;
}

.header-search__input::-webkit-search-results-decoration {
  display: none;
}

@media screen and (min-width: 700px) {
  .header-search__form-control {
    column-gap: 1.25rem;
    padding-block: 1.5rem;
  }
}

.predictive-search {
  display: block;
}

.predictive-search__no-results {
  text-align: center;
  padding-block: 2.5rem 4rem;
}

.predictive-search__results {
  grid-template-columns: minmax(0, 1fr);
  gap: 2.5rem;
  padding-block: 1.25rem 2rem;
  display: grid;
}

.predictive-search__suggestions {
  grid-template-columns: minmax(0, 1fr);
  justify-items: start;
  gap: .75rem 1.5rem;
  display: grid;
}

.predictive-search__suggestions mark {
  background: none;
  font-weight: bolder;
}

.predictive-search__tabs::part(tab-list-scrollable) {
  scrollbar-width: none;
  margin-inline-start: calc(-1 * var(--distance-to-bleed));
  margin-inline-end: calc(-1 * var(--distance-to-bleed));
  padding-inline-start: var(--distance-to-bleed);
  padding-inline-end: var(--distance-to-bleed);
  display: flex;
  overflow: auto;
}

.predictive-search__tabs::part(tab-list) {
  width: min-content;
  min-width: 100%;
}

.predictive-search__category {
  border-block-end-width: 1px;
  padding-block-end: .625rem;
}

.predictive-search__products {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 1.25rem;
  display: grid;
}

.predictive-search__blog-posts {
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem 2.5rem;
  display: grid;
}

.predictive-search__blog-posts .blog-post-card__info {
  row-gap: .75rem;
}

.predictive-search__collections {
  align-items: start;
  gap: var(--container-gutter);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  display: grid;
}

@media screen and (max-width: 699px) {
  .predictive-search__suggestions {
    grid: auto / auto-flow max-content;
    row-gap: 1.25rem;
  }

  .predictive-search__products .horizontal-product-card__figure {
    max-width: 4.375rem;
  }

  .predictive-search__blog-posts .blog-post-card {
    grid-template-columns: minmax(0, 160px) minmax(0, 1fr);
    align-items: center;
  }
}

@media screen and (min-width: 700px) {
  .predictive-search__no-results {
    padding-block: 4.75rem 6.25rem;
  }

  .predictive-search__results {
    padding-block: 1.5rem 3rem;
  }

  .predictive-search__blog-posts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .predictive-search__blog-posts .blog-post-card__category {
    font-size: .6875rem;
  }
}

@media screen and (min-width: 1000px) {
  .predictive-search__results--with-suggestions {
    grid-template-columns: 250px minmax(0, 1fr);
  }

  .predictive-search__products {
    grid-template-columns: repeat(var(--product-list-items-per-row, 4), minmax(0, 1fr));
  }

  .predictive-search__blog-posts {
    grid-template-columns: repeat(var(--blog-post-list-items-per-row, 4), minmax(0, 1fr));
  }

  .predictive-search__collections {
    grid-template-columns: repeat(var(--collection-list-items-per-row), minmax(0, 1fr));
  }
}

.mega-menu {
  --mega-menu-gap: 2.5rem;
  --mega-menu-linklist-gap: 2.5rem;
  --mega-menu-promo-gap: 2rem;
  width: 100%;
  max-height: calc(100vh - var(--header-height, 0px) - var(--announcement-bar-height, 0px) - 20px);
  justify-content: safe center;
  align-items: start;
  column-gap: var(--mega-menu-gap);
  background: rgb(var(--background));
  color: rgb(var(--text-color));
  border-block-end-width: 1px;
  padding-block: 2.5rem;
  padding-inline-start: var(--container-gutter);
  padding-inline-end: var(--container-gutter);
  display: flex;
  position: absolute;
  inset-block-start: 100%;
  inset-inline-start: 0;
  overflow-y: auto;
}

.mega-menu--reverse {
  flex-direction: row-reverse;
}

.mega-menu--reverse .mega-menu__promo {
  justify-content: flex-start;
}

.mega-menu__linklist {
  gap: var(--mega-menu-linklist-gap);
  flex-wrap: wrap;
  flex: 0 auto;
  display: flex;
}

.mega-menu__linklist > * {
  max-width: 280px;
}

.mega-menu__promo {
  justify-content: flex-end;
  column-gap: var(--mega-menu-promo-gap);
  flex: 0 auto;
  display: flex;
}

.mega-menu__promo > * {
  flex: 315px;
  min-width: 240px;
  max-width: 315px;
}

@media screen and (min-width: 1400px) {
  .mega-menu {
    --mega-menu-gap: 6.25rem;
    --mega-menu-linklist-gap: 2.5rem 6.25rem;
  }

  .mega-menu:has(.mega-menu__linklist > :nth-child(5)) {
    --mega-menu-linklist-gap: 2.5rem 4rem;
  }
}

.header-sidebar {
  --header-linklist-padding-block: 1rem;
}

.header-sidebar::part(close-button) {
  opacity: 1;
}

.header-sidebar::part(header) {
  border-block-end: none;
}

.header-sidebar::part(content) {
  box-sizing: border-box;
  overflow-x: hidden;
}

.header-sidebar::part(panel-list) {
  position: relative;
}

.header-sidebar__scroller {
  padding-block-end: var(--drawer-body-padding-block);
  padding-inline-start: var(--drawer-body-padding-inline);
  padding-inline-end: var(--drawer-body-padding-inline);
  overflow-y: auto;
}

.header-sidebar__linklist-button {
  text-align: start;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-block-start: calc(var(--header-linklist-padding-block) / 2);
  padding-block-end: calc(var(--header-linklist-padding-block) / 2);
  transition: color .2s;
  display: flex;
}

@media screen and (pointer: fine) {
  .header-sidebar__main-panel li:has([aria-expanded="true"]) ~ li .header-sidebar__linklist-button {
    color: rgb(var(--text-color) / .65);
  }

  .header-sidebar__main-panel li:has( ~ li [aria-expanded="true"]):not(:has([aria-expanded="true"])) .header-sidebar__linklist-button {
    color: rgb(var(--text-color) / .65);
  }
}

.header-sidebar__sub-panel li:has([aria-expanded="true"]) ~ li .header-sidebar__linklist-button {
  color: rgb(var(--text-color) / .65);
}

.header-sidebar__sub-panel li:has( ~ li [aria-expanded="true"]):not(:has([aria-expanded="true"])) .header-sidebar__linklist-button {
  color: rgb(var(--text-color) / .65);
}

.header-sidebar__sub-panel li:has([aria-expanded="true"]) .header-sidebar__linklist-button {
  color: rgb(var(--text-color)) !important;
}

.header-sidebar__back-button {
  width: 100%;
  border-block-end-width: 1px;
  margin-block-end: 1rem;
  padding-block-start: var(--header-linklist-padding-block);
  padding-block-end: 1rem;
}

.header-sidebar__back-button.is-divided {
  margin-block-end: .5rem;
}

.header-sidebar__nested-linklist {
  border-inline-start-width: 1px;
  row-gap: .75rem;
  margin-block: 2px 1.125rem;
  margin-inline-start: .5rem;
  padding-inline-start: 1.5rem;
  display: grid;
}

.header-sidebar__main-panel {
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  grid-template-rows: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  grid-auto-columns: max-content;
  height: 100%;
  display: grid;
}

.header-sidebar__footer {
  position: relative;
}

.header-sidebar__footer:before {
  content: "";
  background: linear-gradient(transparent, rgb(var(--background)));
  width: 100%;
  height: 2.5rem;
  position: absolute;
  inset-block-end: 100%;
  inset-inline-start: 0;
}

.header-sidebar__footer > * {
  padding-block: 1.25rem;
  padding-inline-start: var(--drawer-footer-padding-inline);
  padding-inline-end: var(--drawer-footer-padding-inline);
}

.header-sidebar__footer .localization-selectors {
  border-block-start-width: 1px;
  justify-content: flex-start;
  column-gap: 1.25rem;
}

.header-sidebar__collapsible-panel {
  height: 100%;
  width: var(--drawer-max-width);
  background-color: rgb(var(--background));
  background-image: var(--background-gradient);
  display: none;
  position: absolute;
  inset-block-start: 0;
}

.header-sidebar__promo {
  grid-auto-flow: column;
  gap: 2rem 1.25rem;
  margin-block-start: 1.25rem;
  display: flex;
}

.header-sidebar__promo > * {
  min-width: 12.5rem;
}

.header-sidebar__promo > *:only-child {
  min-width: 100%;
}

.header-sidebar__linklist.divide-y .header-sidebar__linklist-button {
  padding-block-start: var(--header-linklist-padding-block);
  padding-block-end: var(--header-linklist-padding-block);
}

.header-sidebar__linklist.divide-y .header-sidebar__back-button {
  padding-block-end: var(--header-linklist-padding-block);
}

.header-sidebar__linklist.divide-y .header-sidebar__nested-linklist {
  margin-block-end: calc(.5rem + var(--header-linklist-padding-block));
}

.header-sidebar__linklist.divide-y .header-sidebar__promo {
  margin-block-start: .75rem;
}

@media screen and (min-width: 700px) {
  .header-sidebar {
    --header-linklist-padding-block: 1.25rem;
  }
}

@media screen and (min-width: 1000px) {
  .header-sidebar::part(panel-list) {
    position: static;
  }

  .header-sidebar::part(content) {
    overflow-x: visible;
  }

  .header-sidebar:has(.header-sidebar__collapsible-panel[aria-activedescendant])::part(content) {
    border-inline-end: 1px solid rgb(var(--border-color));
  }

  .header-sidebar__main-panel {
    z-index: 1;
    position: relative;
  }

  .header-sidebar__collapsible-panel .header-sidebar__scroller {
    width: 100%;
    inset-block: min(var(--header-height), 5rem) 0;
    position: absolute;
  }

  .header-sidebar__promo {
    flex-direction: column;
  }

  .header-sidebar__promo > * {
    min-width: 100%;
  }
}

.image-with-text {
  display: grid;
  overflow: hidden;
}

.image-with-text > .prose {
  box-sizing: content-box;
  max-width: var(--image-with-text-content-max-width);
  margin-block: 1.5rem;
  padding-inline-start: var(--container-gutter);
  padding-inline-end: var(--container-gutter);
}

.image-with-text > :is(svg, img) {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 699px) {
  .image-with-text > .prose {
    margin-inline: auto;
  }
}

@media screen and (min-width: 700px) {
  .image-with-text {
    --image-with-text-gap: 2.5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
  }

  .image-with-text > .prose {
    padding-inline-start: var(--image-with-text-gap);
  }

  .image-with-text:not(.image-with-text--reverse) picture {
    margin-inline-start: auto;
  }

  .image-with-text--reverse > :is(picture, svg, img) {
    order: 9999;
  }

  .image-with-text--reverse > .prose {
    margin-inline-start: auto;
    padding-inline-end: var(--image-with-text-gap);
  }
}

@media screen and (min-width: 1000px) {
  .image-with-text {
    --image-with-text-gap: 6rem;
  }
}

.image-with-text-block > :not(img, svg, picture) {
  background: rgb(var(--background));
  padding: 2.375rem 1.25rem;
  box-shadow: 0 1px 20px #3636364d;
}

@media screen and (min-width: 700px) {
  .image-with-text-block > :not(img, svg, picture) {
    padding: 3rem 1rem;
  }
}

.image-with-text-block--parallax {
  min-height: var(--content-over-media-height, auto);
  aspect-ratio: var(--image-with-text-block-aspect-ratio);
  transform: unset;
  clip-path: inset(0);
}

@media (prefers-reduced-motion: no-preference) {
  .image-with-text-block--parallax > svg, .image-with-text-block--parallax > picture img {
    pointer-events: none;
    min-height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
  }

  @supports (min-height: 100lvh) {
    .image-with-text-block--parallax > svg, .image-with-text-block--parallax > picture img {
      min-height: 100lvh;
    }
  }
}

.images-with-text-scroll {
  --sticky-area-height: calc(var(--announcement-bar-is-sticky, 0) * var(--announcement-bar-height, 0px) + var(--header-is-sticky, 0) * var(--header-height, 0px));
  align-items: start;
  display: grid;
  position: relative;
}

.images-with-text-scroll:before {
  content: "";
  background: rgb(var(--images-with-text-scroll-overlay));
  z-index: 1;
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.images-with-text-scroll__image-background, .images-with-text-scroll__container {
  grid-area: 1 / -1;
}

.images-with-text-scroll__image-background {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  max-height: 100vh;
  position: sticky;
  inset-block-start: 0;
}

.images-with-text-scroll__container {
  z-index: 1;
  place-items: start center;
  row-gap: 2rem;
  padding-block-start: var(--section-vertical-spacing);
  padding-block-end: var(--section-vertical-spacing);
  display: grid;
}

.images-with-text-scroll__item {
  display: contents;
}

.images-with-text-scroll__item:not(:first-child) > .images-with-text-scroll__image {
  opacity: 0;
}

.images-with-text-scroll__image {
  grid-area: 1 / 1;
  align-self: center;
}

.images-with-text-scroll__text {
  text-align: center;
  grid-area: 2 / 1;
  max-width: 375px;
}

@media screen and (min-width: 700px) {
  .images-with-text-scroll__container {
    row-gap: 3rem;
  }
}

@media screen and (max-width: 999px) {
  .images-with-text-scroll__item:not(.is-selected) {
    visibility: hidden;
  }

  .images-with-text-scroll__image {
    width: min(56vw, 27.5rem);
  }
}

@media screen and (min-width: 1000px) {
  .images-with-text-scroll {
    min-height: calc(100vh - var(--sticky-area-height));
  }

  .images-with-text-scroll__container {
    --image-width: min(50vw - var(--container-gutter), 575px);
    --image-height: min(var(--image-width), var(--image-width) / var(--images-with-text-scroll-master-image-ratio));
    --content-padding: calc((100vh - var(--image-height) - var(--sticky-area-height)) / 2);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(0, 1fr);
    align-items: center;
    padding-block-start: var(--content-padding);
    padding-block-end: var(--content-padding);
  }

  .images-with-text-scroll__image {
    height: var(--image-height);
    object-fit: contain;
    object-position: center;
    position: sticky;
    inset-block-start: calc(var(--content-padding) + var(--sticky-area-height));
  }

  .images-with-text-scroll__text {
    text-align: var(--images-with-text-scroll-text-alignment);
    grid-area: auto / 2;
  }

  .images-with-text-scroll--reverse .images-with-text-scroll__image {
    grid-column: 2;
  }

  .images-with-text-scroll--reverse .images-with-text-scroll__text {
    grid-column: 1;
  }
}

.logo-list {
  grid: var(--logo-list-grid);
  justify-content: safe center;
  gap: var(--logo-list-gap);
  display: grid;
}

.logo-list__item {
  outline: 1px solid rgb(var(--logo-list-item-border-color));
  place-items: center;
  padding: 1.25rem;
  display: grid;
}

@media screen and (min-width: 700px) {
  .logo-list__item {
    padding: 2rem 1.5rem;
  }
}

.media-grid {
  --media-grid-column-count: 2;
  align-items: start;
  gap: var(--media-grid-gap);
  grid: auto-flow dense var(--media-grid-row-height) / repeat(var(--media-grid-column-count), minmax(0, 1fr));
  display: grid;
}

.media-grid__item {
  grid-area: span min(2, var(--media-grid-item-row-span)) / span 2;
  height: 100%;
  container-type: inline-size;
}

.media-grid__item > * {
  height: 100%;
}

@media screen and (min-width: 700px) {
  .media-grid {
    --media-grid-column-count: 12;
  }

  .media-grid__item {
    grid-area: span var(--media-grid-item-row-span) / span var(--media-grid-item-column-span);
  }

  .media-grid__item--padded {
    padding: 32px;
  }
}

.multi-column {
  grid: var(--multi-column-grid);
  column-gap: var(--multi-column-gap);
  row-gap: var(--section-stack-gap);
  justify-content: var(--multi-column-content-alignment);
  display: grid;
}

.multi-column__item {
  align-content: start;
  gap: 2rem;
  display: grid;
}

.multi-column__item--overlap:has(.multi-column__media) {
  gap: 0;
}

.multi-column__item--overlap:has(.multi-column__media) > .prose {
  isolation: isolate;
}

.multi-column__item--overlap:has(.multi-column__media) > .prose > :first-child {
  margin-block-start: -.5lh !important;
}

.multiple-media-with-text {
  --multiple-media-with-text-gap: 2rem;
  grid: var(--multiple-media-with-text-grid);
  gap: var(--multiple-media-with-text-gap);
  display: grid;
}

.multiple-media-with-text__media-wrapper {
  grid-area: media-wrapper;
  grid: var(--multiple-media-with-text-media-grid);
  column-gap: var(--multiple-media-with-text-media-gap);
  display: grid;
}

.multiple-media-with-text__media-wrapper > * {
  grid-row: 1 / -1;
}

.multiple-media-with-text__content-wrapper {
  grid-area: content-wrapper;
}

@media screen and (min-width: 1000px) {
  .multiple-media-with-text {
    --multiple-media-with-text-gap: 2rem 4rem;
  }
}

@media screen and (min-width: 1150px) {
  .multiple-media-with-text {
    --multiple-media-with-text-gap: 2rem 7.5rem;
  }
}

.multiple-media-with-text--overlap .multiple-media-with-text__media-wrapper > :first-child {
  grid-column: 1 / 3;
}

.multiple-media-with-text--overlap .multiple-media-with-text__media-wrapper > :nth-child(2) {
  grid-column: 2 / 4;
}

@media screen and (min-width: 700px) {
  .multiple-media-with-text--overlap.multiple-media-with-text--reverse .multiple-media-with-text__media-wrapper > :first-child {
    grid-column: 2 / 4;
  }

  .multiple-media-with-text--overlap.multiple-media-with-text--reverse .multiple-media-with-text__media-wrapper > :nth-child(2) {
    grid-column: 1 / 3;
  }
}

@media screen and (min-width: 700px) {
  .newsletter .form {
    width: 35rem;
  }
}

@media screen and (min-width: 700px) {
  .newsletter-popup {
    width: 23.75rem;
    inset-inline-start: auto;
  }
}

.password {
  position: relative;
}

.password__inner {
  isolation: isolate;
  align-content: space-between;
  row-gap: 3rem;
  min-height: 100vh;
  padding-block: 1.6rem;
  display: grid;
}

@supports (height: 100dvh) {
  .password__inner {
    min-height: 100dvh;
  }
}

.password__header {
  justify-items: center;
  display: grid;
}

.password__header > * {
  grid-area: 1 / -1;
}

.password__password-button {
  margin-inline-start: auto;
}

.password__block-list {
  justify-self: center;
  row-gap: .625rem;
  width: min(100%, 30rem);
  display: grid;
}

.password__content, .password__social {
  padding: 1.25rem;
}

.password__social {
  display: grid;
}

.password__social .social-media {
  justify-content: center;
}

.password__footer {
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem;
  display: flex;
}

@media screen and (min-width: 700px) {
  .password__content {
    padding: 2.5rem;
  }

  .password__footer {
    justify-content: space-between;
  }
}

.prev-next-blog-posts {
  gap: 3.125rem;
  display: grid;
}

@media screen and (min-width: 700px) {
  .prev-next-blog-posts {
    grid: auto / auto-flow minmax(min-content, 31.25rem);
    justify-content: center;
    gap: 1.875rem;
  }
}

@media screen and (min-width: 1150px) {
  .prev-next-blog-posts {
    gap: 3.75rem;
  }
}

@media screen and (min-width: 700px) {
  .privacy-banner {
    width: 31.25rem;
  }
}

.shopify-section--main-product .section-spacing {
  padding-block-start: 0;
}

.product {
  grid: var(--product-grid, none);
  align-items: start;
  gap: var(--product-gap, 1.875rem);
  display: grid;
}

@media screen and (min-width: 1000px) {
  .shopify-section--main-product .section-spacing[allow-transparent-header] .container {
    --container-max-width: none;
  }

  .shopify-section--main-product .section-spacing[allow-transparent-header] .product {
    --product-gap: 0px;
  }

  .shopify-section--main-product .section-spacing[allow-transparent-header] .product-info {
    width: min(75%, 28.5rem);
    margin-inline: auto;
    padding-block-start: calc(var(--container-gutter) * var(--header-is-visible, 1));
    transition: padding-block-start .15s;
    inset-block-start: calc(var(--sticky-area-height) + 20px - var(--container-gutter) * var(--header-is-visible, 1));
  }

  .shopify-section--main-product .section-spacing[allow-transparent-header] .product-gallery {
    margin-block-start: calc(var(--container-gutter) * -1);
  }

  .shopify-section--main-product .section-spacing {
    padding-block-start: var(--container-gutter);
  }

  .product {
    --product-gap: 3.5rem;
  }
}

@media screen and (min-width: 1150px) {
  .product {
    --product-gap: 5rem;
  }
}

.product-gallery {
  --product-gallery-gap: 1.5rem;
  --product-gallery-thumbnail-list-gap: 1rem .5rem;
  --product-gallery-thumbnail-size: 3.5rem;
  flex-direction: var(--product-gallery-flex-direction, column);
  align-items: start;
  gap: var(--product-gallery-gap) var(--product-gap, 0px);
  grid-area: product-gallery;
  display: flex;
  position: relative;
}

.product-gallery__zoom-button {
  z-index: 1;
  transition: opacity .2s, visibility .2s;
  position: absolute;
  inset-block-start: var(--product-gallery-zoom-button-inset-block-start, 1.25rem);
  inset-inline-end: 0;
}

.product-gallery__zoom-button--hidden {
  opacity: 0;
  visibility: hidden;
}

.product-gallery__image-list {
  row-gap: var(--product-gallery-gap);
  grid-auto-rows: max-content;
  grid-auto-columns: minmax(0, 1fr);
  width: 100%;
  display: grid;
}

.product-gallery__carousel {
  grid: var(--product-gallery-carousel-grid, auto / auto-flow 100%);
  align-items: start;
  gap: var(--product-gallery-carousel-gap, 1.5rem min(1.5rem, var(--container-gutter)));
  scroll-snap-type: var(--product-gallery-carousel-scroll-snap-type, x mandatory);
  display: grid;
  position: relative;
}

.product-gallery[allow-zoom] .product-gallery__media {
  cursor: var(--cursor-zoom-in-svg-url) 18 18,
      zoom-in;
}

.product-gallery__media > * {
  width: 100%;
}

.product-gallery__thumbnail-list {
  flex-shrink: 0;
  max-width: 100%;
  position: relative;
}

.product-gallery__thumbnail-scroller {
  grid-auto-columns: var(--product-gallery-thumbnail-size);
  grid-auto-flow: var(--product-gallery-thumbnail-list-grid-auto-flow, column);
  align-content: start;
  align-items: start;
  gap: var(--product-gallery-thumbnail-list-gap);
  max-height: var(--product-gallery-thumbnail-list-max-height, none);
  scroll-snap-type: both mandatory;
  overscroll-behavior: contain;
  scrollbar-width: none;
  grid-template-columns: none;
  display: grid;
  position: relative;
  overflow: auto;
}

.product-gallery__thumbnail-scroller::-webkit-scrollbar {
  display: none;
}

.product-gallery__thumbnail {
  border: 1px solid #0000;
  padding: 1px;
  transition: border-color .1s;
  position: relative;
}

.product-gallery__thumbnail[aria-current="true"] {
  border-color: currentColor;
}

.product-gallery__media-badge {
  position: absolute;
  inset-block-start: 3px;
  inset-inline-end: 3px;
}

[data-shopify-xr-hidden] {
  display: none;
}

@media screen and (max-width: 999px) {
  .product-gallery__carousel-with-arrows {
    align-items: center;
    display: flex;
  }

  .product-gallery__carousel-with-arrows .product-gallery__media {
    width: 45vw;
    margin-inline: auto;
  }
}

@media screen and (min-width: 1000px) {
  .product-gallery__thumbnail-list {
    position: sticky;
    inset-block-start: calc(var(--sticky-area-height) + 20px);
  }

  .product-gallery__media {
    scroll-margin-block-start: 1.25rem;
  }
}

.product-info {
  --product-info-gap: 1rem;
  z-index: 2;
  grid-area: product-info;
}

.product-info__block-list > :not(:nth-child(1 of :not(:empty))) {
  margin-block-start: var(--product-info-gap);
}

.product-info__block-list > :not(:last-child) {
  margin-block-end: var(--product-info-gap);
}

.product-info__block-item:empty {
  display: none;
}

.product-info__block-item:is([data-block-type="vendor"], [data-block-type="title"], [data-block-type="sku"], [data-block-type="price"]) {
  --product-info-gap: .5rem;
}

.product-info__block-group:has(.product-info__block-item:is([data-block-type="vendor"], [data-block-type="title"], [data-block-type="sku"], [data-block-type="price"])) {
  --product-info-gap: .5rem;
}

.product-info__block-item:is([data-block-type="variant-picker"], [data-block-type="product-variations"], [data-block-type="separator"], [data-block-type="description"], [data-block-type="text"], [data-block-type="liquid"], [data-block-type="share-buttons"]) {
  --product-info-gap: 1.5rem;
}

.product-info__block-group:has(.product-info__block-item:is([data-block-type="variant-picker"], [data-block-type="product-variations"], [data-block-type="separator"], [data-block-type="description"], [data-block-type="text"], [data-block-type="liquid"], [data-block-type="share-buttons"])) {
  --product-info-gap: 1.5rem;
}

.product-info__block-item:is([data-block-type="inventory"], [data-block-type="buy-buttons"], [data-block-type="pickup-availability"], [data-block-type="more-information"], [data-block-type="offers"]) {
  --product-info-gap: 2rem;
}

.product-info__block-group:has(.product-info__block-item:is([data-block-type="inventory"], [data-block-type="buy-buttons"], [data-block-type="pickup-availability"], [data-block-type="more-information"], [data-block-type="offers"])) {
  --product-info-gap: 2rem;
}

.product-info__block-item[data-block-type="complementary-products"] {
  --product-info-gap: 3rem;
}

.product-info__block-group:has(.product-info__block-item[data-block-type="complementary-products"]) {
  --product-info-gap: 3rem;
}

@media screen and (max-width: 699px) {
  .product-info--center :is([data-block-type="vendor"], [data-block-type="title"], [data-block-type="sku"], [data-block-type="price"]) {
    text-align: center;
  }

  .product-info--center :is(.badge-list, .price-list, .rating-badge) {
    justify-content: center;
  }

  .product-info--center .text-with-rating {
    flex-direction: column;
    justify-content: center;
  }
}

@media screen and (min-width: 1000px) {
  .product-info {
    position: sticky;
    inset-block-start: calc(var(--sticky-area-height) + 20px);
  }
}

.product-content-below-gallery {
  grid-area: product-content;
}

.product-content-below-gallery :is(product-recommendations:not(:first-child)) {
  margin-block-start: max(48px, var(--product-gap, 0px));
}

.product-content-below-gallery :is(product-recommendations:not(:last-child)) {
  margin-block-end: max(48px, var(--product-gap, 0px));
}

.product-content-below-gallery__description:not(:last-child) {
  margin-block-end: 1.25rem;
}

.product-info__more-info {
  border-block-width: 1px;
  justify-content: space-between;
  align-items: center;
  padding: .9375rem;
  display: flex;
}

.product-info__more-info > svg {
  transition: transform .2s ease-in-out;
}

@media screen and (pointer: fine) {
  .product-info__more-info:hover > svg {
    transform: translateX(5px);
  }
}

.variant-picker .popover {
  --popover-block-offset: .5rem;
  --popover-body-padding-inline: 1.25rem;
  width: 100%;
}

.variant-picker .popover::part(content) {
  width: 100%;
  max-width: none;
}

@media (scripting: none) {
  .variant-picker__option {
    display: none;
  }
}

.buy-buttons {
  row-gap: 1rem;
  display: grid;
}

.pickup-location {
  align-items: start;
  gap: .25rem;
  display: grid;
}

.pickup-location + .pickup-location {
  padding-block-start: 1rem;
}

.product-offers .page-dots {
  padding-block-end: 1.5rem;
}

.product-offers__item {
  padding: 1.5rem;
}

.product-offers__list--carousel {
  grid: auto / auto-flow 100%;
  display: grid;
}

.complementary-products {
  grid-template-columns: minmax(0, 1fr);
  row-gap: 1.875rem;
  max-width: 40rem;
  margin-inline: auto;
  display: grid;
}

.complementary-products__header {
  text-align: center;
  justify-content: center;
  align-items: center;
  display: flex;
}

.complementary-products__header--align-start {
  text-align: start;
  justify-content: space-between;
}

.complementary-products__product-list {
  gap: 1.25rem;
  display: grid;
  position: relative;
}

.complementary-products__product-list--carousel {
  grid: auto / auto-flow 100%;
}

@media screen and (max-width: 699px) {
  .complementary-products__product-list--carousel .product-card__figure {
    max-width: 11.25rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 700px) {
  .complementary-products {
    row-gap: 1rem;
  }

  .complementary-products__header {
    text-align: start;
    justify-content: space-between;
  }
}

.product-sticky-bar {
  width: 100%;
  padding: var(--container-gutter);
  opacity: 0;
  visibility: hidden;
  z-index: 3;
  transition: opacity .2s, visibility .2s, inset-block .15s ease-in-out;
  display: block;
  position: fixed;
  inset-block-end: 0;
  inset-inline-start: 0;
}

.product-sticky-bar.is-visible {
  opacity: 1;
  visibility: visible;
}

.product-sticky-bar__info img {
  width: 3.75rem;
}

@media screen and (min-width: 700px) {
  .product-sticky-bar {
    inset-block: var(--sticky-area-height) auto;
    background: rgb(var(--background));
    border-block-end-width: 1px;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: center;
    padding-block: 1.125rem;
    display: grid;
  }
}

@media screen and (max-width: 699px) {
  .quick-order-list__table {
    display: block;
  }

  .quick-order-list__table-head th:nth-child(2), .quick-order-list__table-head th:nth-child(3), .quick-order-list__table-body td:nth-child(2), .quick-order-list__table-body td:nth-child(3) {
    display: none;
  }

  .quick-order-list__table-foot {
    --table-foot-cell-padding-inline: 0px;
    display: block;
  }

  .quick-order-list__table-foot tr {
    flex-direction: column-reverse;
    display: flex;
  }

  .quick-order-list__table-foot td:first-child {
    padding-block: .125rem 0;
  }

  .quick-order-list__variant-image {
    align-self: start;
  }
}

@media screen and (min-width: 700px) {
  .quick-order-list__table {
    --table-cell-padding-block: .625rem;
    --table-foot-cell-padding-block: 1.5rem;
  }

  .quick-order-list__table-body tr:first-child {
    --table-cell-padding-block: .75rem;
  }

  .quick-order-list__table-body tr:not(:only-child):last-child td {
    padding-block-end: 1.5rem;
  }

  .quick-order-list__table-body tr:first-child + tr td {
    padding-block-start: 0;
  }

  .quick-order-list__table-body tr ~ tr td:first-child {
    padding-inline-start: 88px;
  }

  .quick-order-list__table-body tr ~ tr td:not(:has(img)):first-child {
    padding-inline-start: 20px;
  }

  .quick-order-list__table-foot {
    background: rgb(var(--background));
    box-shadow: 0 -.5px rgb(var(--border-color));
    position: sticky;
    inset-block-end: 0;
  }

  .quick-order-list__quantity-actions {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    column-gap: .625rem;
    display: grid;
  }

  .quick-order-list__quantity-selector {
    grid-column: 2;
    grid-template-columns: minmax(0, 1fr);
    row-gap: .5rem;
    display: grid;
  }

  .quick-order-list__remove-variant {
    justify-self: start;
    margin-inline-start: .625rem;
  }
}

.quantity-breaks-table {
  list-style: none;
}

.quantity-breaks-table li {
  padding-block: .5rem;
}

.quantity-breaks-table li:last-child {
  padding-block-end: 0;
}

@media screen and (min-width: 1000px) {
  .popover--quantity-breaks {
    inset-block-start: -1rem;
    inset-inline-end: 1.5rem;
  }
}

.scrolling-content {
  text-align: start;
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
  display: block;
  position: relative;
  overflow: hidden;
}

.scrolling-content[direction="right"] {
  text-align: end;
}

.scrolling-content::part(scroller) {
  min-width: max-content;
  display: inline-flex;
  position: relative;
}

.scrolling-content__item {
  flex-shrink: 0;
  align-items: center;
  display: flex;
}

.scrolling-content__item > * {
  margin-inline-start: calc(var(--scrolling-content-content-gap) / 2);
  margin-inline-end: calc(var(--scrolling-content-content-gap) / 2);
}

.scrolling-content__image > img {
  max-width: 1.5em;
}

.main-search-form {
  min-width: 18.75rem;
}

.main-search__linklist {
  text-align: center;
  max-width: 25rem;
  margin-inline: auto;
}

.shop-the-look__carousel {
  z-index: 2;
  grid: auto / auto-flow 100%;
  align-items: start;
  gap: .625rem;
  display: grid;
  position: relative;
  overflow: visible;
}

.shop-the-look__carousel.is-expanded {
  overflow: hidden;
}

.shop-the-look__image-wrapper {
  position: relative;
  overflow: hidden;
}

.shop-the-look__hot-spot-list {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
}

.shop-the-look__hot-spot {
  --hot-spot-size: 1rem;
  top: calc(var(--shop-the-look-hot-spot-top) - (var(--hot-spot-size) / 2));
  left: calc(var(--shop-the-look-hot-spot-left) - (var(--hot-spot-size) / 2));
  width: var(--hot-spot-size);
  height: var(--hot-spot-size);
  border-radius: var(--rounded-full);
  transition: transform .2s ease-in-out;
  position: absolute;
}

.shop-the-look__hot-spot:after {
  --hot-spot-after-size: calc(var(--hot-spot-size) * 2.5);
  content: "";
  top: calc(50% - var(--hot-spot-after-size) / 2);
  left: calc(50% - var(--hot-spot-after-size) / 2);
  width: var(--hot-spot-after-size);
  height: var(--hot-spot-after-size);
  background: radial-gradient(50% 50% at 50% 50%, rgb(var(--background) / 0), rgb(var(--background) / .3));
  border-radius: var(--rounded-full);
  animation: 2s ease-in-out infinite alternate ping;
  position: absolute;
}

.shop-the-look__hot-spot[aria-current="true"] {
  transform: scale(1.3);
}

.shop-the-look__item-carousel {
  grid: auto / auto-flow 100%;
  justify-items: center;
  display: grid;
  position: relative;
}

.shop-the-look__item {
  position: relative;
}

.shop-the-look__popover .product-card__figure {
  width: 100%;
  max-width: 10rem;
  margin-inline: auto;
}

.shop-the-look__popover::part(base) {
  height: auto;
  inset: auto auto 0 0;
}

.shop-the-look__popover::part(overlay) {
  display: none;
}

@media screen and (max-width: 699px) {
  .shopify-section--shop-the-look:before {
    content: "";
    opacity: 0;
    pointer-events: none;
    background: rgb(var(--background));
    z-index: 2;
    width: 100%;
    height: 100%;
    transition: opacity .4s;
    position: fixed;
    inset-block-start: 0;
    inset-inline-start: 0;
  }

  .shopify-section--shop-the-look:has(.shop-the-look__carousel.is-expanded):before {
    opacity: 1;
  }
}

@media screen and (min-width: 1000px) {
  .shop-the-look__carousel {
    grid: none;
    align-items: center;
  }

  .shop-the-look__item {
    max-width: var(--container-sm-max-width);
    grid: auto / min(550px, 60%) minmax(0, 1fr);
    grid-area: 1 / -1;
    align-items: center;
    gap: .3125rem;
    margin-inline: auto;
    display: grid;
  }

  .shop-the-look__item:not(.is-selected) {
    visibility: hidden;
  }

  .shop-the-look__item-product {
    grid-area: 1 / -1;
    max-width: 16.875rem;
  }

  .shop-the-look__item-product:not(.is-selected) {
    visibility: hidden;
  }

  .shop-the-look__item-content {
    opacity: 0;
    justify-items: center;
    gap: 1.5rem;
    display: grid;
  }
}

@media screen and (pointer: fine) {
  .shop-the-look__hot-spot:hover {
    transform: scale(1.3);
  }
}

@media screen and (pointer: fine) {
  .page-dots--shop-the-look-carousel-md {
    display: none;
  }
}

@media not screen and (pointer: fine) {
  .page-dots--shop-the-look-carousel-md {
    margin-block-start: 1rem;
    display: flex;
  }
}

.slideshow {
  --slideshow-controls-spacing: var(--container-gutter);
  background: rgb(var(--slideshow-background));
  display: block;
  position: relative;
}

.slideshow .page-dots {
  z-index: 1;
  position: absolute;
  inset-block-end: var(--slideshow-controls-spacing);
  inset-inline-end: var(--slideshow-controls-spacing);
}

.shopify-section--slideshow:first-child .slideshow[allow-transparent-header] {
  --content-over-media-row-gap: 4rem;
}

.slideshow:has(.page-dots, .slideshow__volume-control) {
  --content-over-media-row-gap: 4rem;
}

.slideshow__slide:not(.is-selected) {
  visibility: hidden;
  position: absolute;
  inset: 0;
}

.slideshow__slide-content--boxed {
  padding: 1.5rem;
}

.slideshow__slide-content--with-border {
  outline: 1px solid rgb(var(--border-color));
}

.slideshow__slide-content--with-border-offset {
  outline-offset: -.75rem;
  padding: 2.25rem;
}

.slideshow__image-split img {
  height: var(--content-over-media-height, auto);
  object-fit: cover;
  min-width: 100%;
  min-height: 100%;
  max-height: 100%;
}

.slideshow__volume-control {
  z-index: 1;
  display: grid;
  position: absolute;
  inset-block-end: var(--slideshow-controls-spacing);
  inset-inline-start: var(--slideshow-controls-spacing);
}

.slideshow__next-section-button {
  z-index: 2;
  position: absolute;
  inset-block-end: calc(-1 * var(--circle-button-size) / 2);
  inset-inline-start: calc(50% - var(--circle-button-size) / 2);
}

.shopify-section:has(.slideshow__next-section-button) + .shopify-section {
  --section-vertical-spacing-block-start-compensation: 1.5625rem;
}

@media screen and (min-width: 700px) {
  .slideshow:has(.page-dots, .slideshow__volume-control) {
    --content-over-media-row-gap: 5rem;
  }

  .slideshow__slide-content--boxed {
    padding: 3.5rem;
  }

  .slideshow__slide-content--with-border-offset {
    outline-offset: -1rem;
  }

  .slideshow__image-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    display: grid;
  }
}

.shopify-section--testimonials {
  --section-vertical-spacing-override: calc(var(--section-vertical-spacing) + 20px);
}

.testimonial-list {
  gap: var(--section-stack-gap);
  justify-items: center;
  display: grid;
}

.testimonial-item {
  max-width: 34rem;
  font-size: var(--testimonials-font-size);
  grid-area: 1 / -1;
  align-content: start;
  justify-items: center;
  gap: 2rem;
  display: grid;
}

.testimonial-item:not(.is-selected) {
  opacity: 0;
  visibility: hidden;
}

.testimonial-carousel {
  display: grid;
}

.testimonial-list__thumbnail-scroller {
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem 5.625rem;
}

.testimonial-list__thumbnail {
  transition: opacity .2s ease-in-out;
}

.testimonial-list__thumbnail[aria-current="false"] {
  opacity: .25;
}

.testimonial-list__thumbnail img {
  max-width: var(--image-max-width);
}

.testimonial-list__thumbnail .placeholder {
  width: var(--image-max-width);
}

.shopify-challenge__container, .shopify-email-marketing-confirmation__container {
  max-width: 56.25rem;
  margin-block-start: var(--section-vertical-spacing);
  margin-block-end: var(--section-vertical-spacing);
}

.shopify-policy__container {
  gap: var(--section-stack-gap);
  max-width: 56.25rem;
  grid-auto-columns: minmax(0, 1fr);
  margin-block-start: var(--section-vertical-spacing-tight);
  margin-block-end: var(--section-vertical-spacing-tight);
  display: grid;
}

.shopify-challenge__container {
  gap: 1rem;
  display: grid;
}

.shopify-challenge__container > form {
  display: contents;
}

.shopify-email-marketing-confirmation__container {
  text-align: center;
}

.shopify-policy__title h1 {
  font: inherit;
}

.text-with-icons {
  --text-with-icons-items-per-row: 2;
  --text-with-icons-column-gap: 1.5rem;
  --text-with-icons-row-gap: 2rem;
  justify-content: center;
  gap: var(--text-with-icons-row-gap) var(--text-with-icons-column-gap);
  flex-wrap: wrap;
  display: flex;
}

.text-with-icons > * {
  flex-basis: min(18.75rem,
      calc(100% / var(--text-with-icons-items-per-row) - var(--text-with-icons-column-gap, 0px) * (var(--text-with-icons-items-per-row) - 1) / var(--text-with-icons-items-per-row)));
}

.text-with-icons > :only-child {
  flex-basis: min(18.75rem, 100%);
}

@media screen and (max-width: 699px) {
  .text-with-icons:not(.text-with-icons--stacked) {
    grid: auto / auto-flow 100%;
    gap: 0;
    display: grid;
  }

  .text-with-icons:not(.text-with-icons--stacked) > * {
    grid-area: 1 / -1;
    padding-inline: 2.5rem;
  }

  .text-with-icons:not(.text-with-icons--stacked) > :not(.is-selected) {
    visibility: hidden;
  }
}

@media screen and (min-width: 700px) {
  .text-with-icons {
    --text-with-icons-items-per-row: 3;
    --text-with-icons-row-gap: 2.5rem;
  }
}

@media screen and (min-width: 1000px) {
  .text-with-icons {
    --text-with-icons-items-per-row: 5;
  }

  .text-with-icons:not(:has( > :nth-child(5))) {
    --text-with-icons-items-per-row: 4;
    --text-with-icons-column-gap: 3.75rem;
  }
}

.timeline__carousel, .timeline__item {
  display: grid;
}

:is(.timeline__carousel, .timeline__item) > * {
  grid-area: 1 / -1;
}

.timeline__item:not(.is-selected) {
  visibility: hidden;
}

.timeline__item-image-wrapper {
  overflow: hidden;
}

.timeline__item-image-wrapper :is(img, svg) {
  scale: 1.05;
}

.timeline__item-content {
  padding: var(--container-gutter);
}

@media screen and (max-width: 699px) {
  .shopify-section--timeline {
    --section-vertical-spacing: 0;
    border-block-start-width: 0;
  }

  .timeline__carousel {
    position: relative;
  }

  .timeline__carousel:after {
    content: "";
    background: #0006;
    position: absolute;
    inset: 0;
  }

  .timeline__item {
    --text-color: var(--timeline-item-mobile-text-color);
    color: rgb(var(--text-color));
  }

  .timeline__item-content {
    text-align: center;
    z-index: 1;
    align-self: center;
    padding-block: 3.75rem;
  }
}

@media screen and (min-width: 700px) {
  .timeline__item {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .timeline__item > * {
    grid-area: unset;
  }

  .timeline__item-content {
    align-self: end;
  }
}

.timeline__nav {
  white-space: nowrap;
  grid-auto-flow: column;
  justify-content: safe center;
  align-items: center;
  column-gap: 2.5rem;
  display: grid;
}

.timeline__nav > button {
  height: var(--text-h4);
  line-height: 1;
  transition: opacity .25s ease-in-out, font-size .25s ease-in-out;
  position: relative;
}

.timeline__nav > button:after {
  content: "";
  width: calc(100% - var(--heading-letter-spacing));
  height: 3px;
  transform-origin: var(--transform-origin-start);
  background: currentColor;
  transition: transform .25s ease-in-out;
  position: absolute;
  inset-block-end: -1.25rem;
  inset-inline-start: 0;
  transform: scaleX(0);
}

.timeline__nav > [aria-current="false"] {
  opacity: .65;
}

.timeline__nav > [aria-current="true"] {
  font-size: var(--text-h4);
}

.timeline__nav > [aria-current="true"]:after {
  transform: scaleX(1);
}

@media screen and (max-width: 699px) {
  .timeline__nav {
    background: rgb(var(--timeline-nav-mobile-background));
    color: rgb(var(--timeline-nav-mobile-text-color));
    padding-block: 1.25rem;
    overflow: auto hidden;
  }
}

@media screen and (min-width: 700px) {
  .timeline__nav {
    margin-block-start: var(--section-stack-gap);
  }

  .timeline__nav > button:after {
    inset-block-end: -.5rem;
  }
}

.sr-only {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

:is(.sr-only[type="checkbox"]:focus-visible + label, .sr-only[type="radio"]:focus-visible + label) {
  outline: 2px solid highlight;
  outline: 2px solid -webkit-focus-ring-color;
}

.skip-to-content:focus-visible {
  z-index: 9999;
  clip: auto;
  color: #fff;
  background: #000;
  width: auto;
  height: auto;
  padding: 6px 12px;
  font-weight: bold;
  overflow: auto;
}

.tap-area {
  position: relative;
}

.tap-area:before {
  content: "";
  position: absolute;
  inset: -.5rem;
}

@media print {
  .print\:hidden {
    display: none;
  }
}

@keyframes ping {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(.8);
  }
}

@media screen and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .features--zoom-image .zoom-image {
    transform-origin: center;
    transition: scale 8s cubic-bezier(.25, .46, .45, .94);
  }

  .features--zoom-image .group:hover .group-hover\:zoom {
    scale: 1.2;
  }
}

@media (prefers-reduced-motion: no-preference) {
  [reveal-on-scroll="true"] {
    opacity: 0;
  }
}

@media (scripting: none) {
  [reveal-on-scroll="true"] {
    opacity: 1;
  }
}

.border {
  border-width: 1px;
  border-color: rgb(var(--border-color));
}

.border-x {
  border-inline-width: 1px;
}

.border-y {
  border-block-width: 1px;
}

.border-t {
  border-block-start-width: 1px;
}

.border-b {
  border-block-end-width: 1px;
}

.divide-x > :not([hidden]) ~ :not([hidden]) {
  border-inline-start-width: 1px;
}

.divide-y > :not([hidden]) ~ :not([hidden]) {
  border-block-start-width: 1px;
}

.rounded-full {
  border-radius: var(--rounded-full);
}

.text-success {
  color: rgb(var(--success-text));
}

.text-warning {
  color: rgb(var(--warning-text));
}

.text-error {
  color: rgb(var(--error-text));
}

.text-subdued {
  color: rgb(var(--text-color) / .65);
}

.text-on-sale {
  color: rgb(var(--on-sale-text));
}

.text-stroke {
  -webkit-text-stroke: 1px currentColor;
  -webkit-text-fill-color: transparent;
}

.text-gradient {
  background-image: var(--gradient);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.text-stroke.text-gradient {
  color: rgb(var(--background));
  -webkit-text-stroke-color: transparent;
  -webkit-text-fill-color: unset;
}

.bg-error, .bg-success, .bg-warning {
  --border-color: var(--text-color) / .15;
}

.bg-error {
  background: rgb(var(--error-background));
}

.bg-success {
  background: rgb(var(--success-background));
}

.bg-warning {
  background: rgb(var(--warning-background));
}

.with-overlay:after {
  content: "";
  background: var(--gradient-overlay, rgb(var(--overlay, 0 0 0 / .3)));
  pointer-events: none;
  border-radius: inherit;
  position: absolute;
  inset: 0;
}

.opacity-0 {
  opacity: 0;
}

.backdrop-blur {
  -webkit-backdrop-filter: blur(var(--backdrop-blur, 0px));
  backdrop-filter: blur(var(--backdrop-blur, 0px));
}

.filter-invert {
  filter: invert();
}

.lock {
  overflow: hidden;
}

.pointer-events-none {
  pointer-events: none;
}

.scroll-area {
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  overflow: auto hidden;
}

.hide-scrollbar {
  scrollbar-width: none;
}

.scroll-area::-webkit-scrollbar {
  display: none;
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.snap-x {
  scroll-snap-type: x mandatory;
}

.snap-y {
  scroll-snap-type: y mandatory;
}

.snap-start {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.snap-center {
  scroll-snap-align: center;
  scroll-snap-stop: always;
}

.hidden, .empty\:hidden:empty {
  display: none;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.grid {
  display: grid;
}

.contents {
  display: contents;
}

@media screen and (min-width: 700px) {
  .sm\:hidden {
    display: none;
  }

  .sm\:block {
    display: block;
  }

  .sm\:grid {
    display: grid;
  }

  .sm\:flex {
    display: flex;
  }

  .sm\:table {
    display: table;
  }

  .sm\:table-cell {
    display: table-cell;
  }
}

@media screen and (min-width: 1000px) {
  .md\:hidden {
    display: none;
  }

  .md\:block {
    display: block;
  }

  .md\:grid {
    display: grid;
  }

  .md\:flex {
    display: flex;
  }

  .md\:table {
    display: table;
  }

  .md\:table-cell {
    display: table-cell;
  }
}

@media screen and (min-width: 1150px) {
  .lg\:hidden {
    display: none;
  }

  .lg\:block {
    display: block;
  }

  .lg\:grid {
    display: grid;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:table {
    display: table;
  }

  .lg\:table-cell {
    display: table-cell;
  }
}

@media screen and (max-width: 699px) {
  .sm-max\:hidden {
    display: none;
  }
}

@media screen and (max-width: 999px) {
  .md-max\:hidden {
    display: none;
  }
}

@media screen and (max-width: 1149px) {
  .lg-max\:hidden {
    display: none;
  }
}

@media screen and (max-width: 1399px) {
  .xl-max\:hidden {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .motion-reduce\:hidden {
    display: none;
  }

  .motion-reduce\:block {
    display: block;
  }
}

.visibility-hidden {
  visibility: hidden;
}

.relative {
  position: relative;
}

.wrap {
  flex-wrap: wrap;
}

.grow {
  flex-grow: 1;
}

.shrink-0 {
  flex-shrink: 0;
}

.text-start {
  text-align: start;
}

.text-center {
  text-align: center;
}

.text-end {
  text-align: end;
}

.justify-start {
  justify-content: start;
}

.justify-center {
  justify-content: safe center;
}

.justify-end {
  justify-content: end;
}

.justify-between {
  justify-content: space-between;
}

.justify-evenly {
  justify-content: space-evenly;
}

.justify-items-start {
  justify-items: start;
}

.justify-items-center {
  justify-items: safe center;
}

.justify-items-end {
  justify-items: end;
}

.justify-self-start {
  justify-self: start;
}

.justify-self-center {
  justify-self: center;
}

.justify-self-end {
  justify-self: end;
}

.align-start {
  align-items: start;
}

.align-center {
  align-items: center;
}

.align-end {
  align-items: end;
}

.align-baseline {
  align-items: baseline;
}

.align-self-start {
  align-self: start;
}

.align-self-center {
  align-self: center;
}

.align-self-end {
  align-self: end;
}

.place-self-start {
  place-self: start;
}

.place-self-start-center {
  place-self: start center;
}

.place-self-start-end {
  place-self: start end;
}

.place-self-center {
  place-self: center;
}

.place-self-center-start {
  place-self: center start;
}

.place-self-center-end {
  place-self: center end;
}

.place-self-end {
  place-self: end;
}

.place-self-end-start {
  place-self: end start;
}

.place-self-end-center {
  place-self: end center;
}

@media screen and (min-width: 700px) {
  .sm\:text-start {
    text-align: start;
  }

  .sm\:text-center {
    text-align: center;
  }

  .sm\:text-end {
    text-align: end;
  }

  .sm\:justify-start {
    justify-content: start;
  }

  .sm\:justify-center {
    justify-content: safe center;
  }

  .sm\:justify-end {
    justify-content: end;
  }

  .sm\:justify-between {
    justify-content: space-between;
  }

  .sm\:justify-evenly {
    justify-content: space-evenly;
  }

  .sm\:justify-items-start {
    justify-items: start;
  }

  .sm\:justify-items-center {
    justify-items: safe center;
  }

  .sm\:justify-items-end {
    justify-items: end;
  }

  .sm\:justify-self-start {
    justify-self: start;
  }

  .sm\:justify-self-center {
    justify-self: center;
  }

  .sm\:justify-self-end {
    justify-self: end;
  }

  .sm\:align-start {
    align-items: start;
  }

  .sm\:align-center {
    align-items: center;
  }

  .sm\:align-end {
    align-items: end;
  }

  .sm\:align-baseline {
    align-items: baseline;
  }

  .sm\:align-self-start {
    align-self: start;
  }

  .sm\:align-self-center {
    align-self: center;
  }

  .sm\:align-self-end {
    align-self: end;
  }

  .sm\:place-self-start {
    place-self: start;
  }

  .sm\:place-self-start-center {
    place-self: start center;
  }

  .sm\:place-self-start-end {
    place-self: start end;
  }

  .sm\:place-self-center {
    place-self: center;
  }

  .sm\:place-self-center-start {
    place-self: center start;
  }

  .sm\:place-self-center-end {
    place-self: center end;
  }

  .sm\:place-self-end {
    place-self: end;
  }

  .sm\:place-self-end-start {
    place-self: end start;
  }

  .sm\:place-self-end-center {
    place-self: end center;
  }
}

.vertical-align-top {
  vertical-align: top;
}

.vertical-align-middle {
  vertical-align: middle;
}

.vertical-align-bottom {
  vertical-align: bottom;
}

.w-full {
  width: 100%;
}

.h-full {
  height: 100%;
}

.w-0 {
  width: 0;
}

.min-w-full {
  min-width: 100%;
}

.min-h-full {
  min-height: 100%;
}

.mx-auto {
  margin-inline: auto;
}

.my-auto {
  margin-block: auto;
}

.aspect-short {
  aspect-ratio: 4 / 3;
}

.aspect-portrait {
  aspect-ratio: 4 / 5;
}

.aspect-tall {
  aspect-ratio: 2 / 3;
}

.aspect-square {
  aspect-ratio: 1;
}

.aspect-video {
  aspect-ratio: 16 / 9;
}

.gap-0\.5 {
  gap: .125rem;
}

.gap-1 {
  gap: .25rem;
}

.gap-1\.5 {
  gap: .375rem;
}

.gap-2 {
  gap: .5rem;
}

.gap-2\.5 {
  gap: .625rem;
}

.gap-3 {
  gap: .75rem;
}

.gap-3\.5 {
  gap: .875rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-4\.5 {
  gap: 1.125rem;
}

.gap-5 {
  gap: 1.25rem;
}

.gap-5\.5 {
  gap: 1.375rem;
}

.gap-6 {
  gap: 1.5rem;
}

.gap-7 {
  gap: 1.75rem;
}

.gap-8 {
  gap: 2rem;
}

.gap-10 {
  gap: 2.5rem;
}

.gap-12 {
  gap: 3rem;
}

.gap-14 {
  gap: 3.5rem;
}

.gap-16 {
  gap: 4rem;
}

@media screen and (min-width: 700px) {
  .sm\:gap-0\.5 {
    gap: .125rem;
  }

  .sm\:gap-1 {
    gap: .25rem;
  }

  .sm\:gap-1\.5 {
    gap: .375rem;
  }

  .sm\:gap-2 {
    gap: .5rem;
  }

  .sm\:gap-2\.5 {
    gap: .625rem;
  }

  .sm\:gap-3 {
    gap: .75rem;
  }

  .sm\:gap-3\.5 {
    gap: .875rem;
  }

  .sm\:gap-4 {
    gap: 1rem;
  }

  .sm\:gap-4\.5 {
    gap: 1.125rem;
  }

  .sm\:gap-5 {
    gap: 1.25rem;
  }

  .sm\:gap-5\.5 {
    gap: 1.375rem;
  }

  .sm\:gap-6 {
    gap: 1.5rem;
  }

  .sm\:gap-7 {
    gap: 1.75rem;
  }

  .sm\:gap-8 {
    gap: 2rem;
  }

  .sm\:gap-10 {
    gap: 2.5rem;
  }

  .sm\:gap-12 {
    gap: 3rem;
  }

  .sm\:gap-14 {
    gap: 3.5rem;
  }

  .sm\:gap-16 {
    gap: 4rem;
  }
}

.object-cover {
  object-fit: cover;
  object-position: center;
}

.object-contain {
  object-fit: contain;
  object-position: center;
}

.image-cover {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.image-background {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-clip {
  overflow: clip;
}

@supports not (overflow: clip) {
  .overflow-clip {
    overflow: hidden;
  }
}

.placeholder {
  background: rgb(var(--background-without-opacity));
  fill: rgb(var(--text-color) / .5);
  color: rgb(var(--text-color) / .5);
  display: block;
}

.placeholder--invert {
  background: rgb(var(--text-color));
  fill: rgb(var(--background-without-opacity));
  color: rgb(var(--background-without-opacity));
}

.bold {
  font-weight: bold;
}

.smallcaps {
  text-transform: uppercase;
  letter-spacing: var(--heading-letter-spacing);
  font-size: .625rem;
}

.text-xxs {
  font-size: .6875rem;
}

.text-xs {
  font-size: var(--text-xs);
}

.text-sm {
  font-size: var(--text-sm);
}

.text-base {
  font-size: var(--text-base);
}

.text-lg {
  font-size: var(--text-lg);
}

.text-xl {
  font-size: var(--text-xl);
}

.heading, .h1, .h2, .h3, .h4, .h5, .h6, .prose :where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  font-style: var(--heading-font-style);
  letter-spacing: var(--heading-letter-spacing);
  text-transform: var(--heading-text-transform);
  overflow-wrap: anywhere;
}

.h1, :where(.prose h1) {
  font-size: var(--text-h1);
  line-height: 1.5;
}

.h2, :where(.prose h2) {
  font-size: var(--text-h2);
  line-height: 1.5;
}

.h3, :where(.prose h3) {
  font-size: var(--text-h3);
  line-height: 1.6;
}

.h4, :where(.prose h4) {
  font-size: var(--text-h4);
  line-height: 1.6;
}

.h5, :where(.prose h5) {
  font-size: var(--text-h5);
  line-height: 1.7;
}

.h6, :where(.prose h6) {
  font-size: var(--text-h6);
  line-height: 1.7;
}

.prose blockquote {
  line-height: 1.75;
}

@media screen and (min-width: 700px) {
  .sm\:text-xs {
    font-size: var(--text-xs);
  }

  .sm\:text-sm {
    font-size: var(--text-sm);
  }

  .sm\:text-base {
    font-size: var(--text-base);
  }

  .sm\:text-lg {
    font-size: var(--text-lg);
  }

  .sm\:h1 {
    font-size: var(--text-h1);
    line-height: 1.5;
  }

  .sm\:h2 {
    font-size: var(--text-h2);
    line-height: 1.5;
  }

  .sm\:h3 {
    font-size: var(--text-h3);
    line-height: 1.6;
  }

  .sm\:h4 {
    font-size: var(--text-h4);
    line-height: 1.6;
  }

  .sm\:h5 {
    font-size: var(--text-h5);
    line-height: 1.7;
  }

  .sm\:h6 {
    font-size: var(--text-h6);
    line-height: 1.7;
  }
}

@media screen and (min-width: 1150px) {
  .h1, :where(.prose h1) {
    line-height: 1.3;
  }

  .h2, :where(.prose h2) {
    line-height: 1.4;
  }

  .h3, :where(.prose h3) {
    line-height: 1.5;
  }
}

ol {
  margin-inline-start: 2ch;
}

ul {
  margin-inline-start: 1em;
}

:where(ol, ul):not(.unstyled-list) li {
  padding-inline-start: .25rem;
  margin-block-start: 0 !important;
}

:where(.text-center, .text-end) :is(ol, ul) {
  margin-inline: 0;
  list-style-position: inside;
}

:where(.text-center, .text-end) :is(ol, ul) li {
  padding-inline-start: 0;
}

.line-through {
  text-decoration: line-through;
}

.break-all {
  word-break: break-all;
}

.hyphenate {
  -webkit-hyphens: auto;
  hyphens: auto;
}

.truncate-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: var(--truncate-text-max-width, 100%);
  overflow: hidden;
}

.line-clamp {
  -webkit-line-clamp: var(--line-clamp-count, 2);
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}




/* Popup */
* {box-sizing: border-box; }
html,body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; }
.nuo-upsy-nuo-upsy-upellifyPopupMain {background-color: rgb(0 0 0 / 50%); position: fixed; height: 100%; width: 100%; top: 0; left: 0; bottom: 0; right: 0; overflow: auto; z-index: 100000; padding-top: 8rem; padding-bottom: 8rem;}
.nuo-upsy-upellifyPopup {background: #fff; max-width: 800px; min-height: 320px; margin: auto; position: relative; width: 100%; }
.nuo-upsy-upellifyPopupBody {max-height: 56vh; overflow: auto;margin: 0 4px 0 0;}
.nuo-upsy-upellifyPopupBody::-webkit-scrollbar {width: 7px; }
.nuo-upsy-upellifyPopupBody::-webkit-scrollbar-track {background-color: transparent; }
.nuo-upsy-upellifyPopupBody::-webkit-scrollbar-thumb {background-color: #808080;border-radius: 6px; }

/* Upsellify Popup Header css*/ 
.nuo-upsy-upellifyPopupHeader {padding: 20px 10px; }
.nuo-upsy-upellifyPopupHeader h2 {font-size: 24px; margin: 0; text-align: center; padding: 0; line-height: normal; letter-spacing: 0; display: block;font-weight: normal; }
.nuo-upsy-upellifyPopupHeader h3 {font-size: 18px;text-align: center;margin: 10px 0 0 0;}
/* Upsellify Popup Header css*/

        
/* Upsellify Popup Main product css*/
.nuo-upsy-upellifyMainProduct {background: #f6f6f6; padding: 1rem 2rem; display: flex; align-items: center; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox {width: 3rem; position: relative; margin-right: 1.5rem; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox img {max-width: none; width: 3rem; height: 3rem; object-fit: cover; display: block; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox .greenCircle {background: #50b83c; height: 15px; width: 15px; position: absolute; top: -5px; right: -5px; border-radius: 15px; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-imgBox .greenCircle:after {content: ""; border: 2px solid #fff; height: 7px; width: 3px; position: absolute; border-width: 0px 1px 1px 0; left: 6px; top: 3px; transform: rotate(40deg); }
.nuo-upsy-upellifyMainProduct .nuo-upsy-productName {font-size: 14px; font-weight: 600; margin: 0 0 0 0; line-height: normal; }
.nuo-upsy-upellifyMainProduct .nuo-upsy-productPrice {font-size: 14px; line-height: normal; font-weight: 400;letter-spacing: 0; } 
.nuo-upsy-upellifyMainProduct .nuo-upsy-productName .upsell-product-link {color: inherit;text-transform: capitalize;text-decoration: none;letter-spacing: 0;}

/* Upsellify Popup other products css*/
.nuo-upsy-upellifyItem{padding-top: 2rem;position: relative;border-left: 1px solid #e6e6e6;list-style: none;list-style-type: none;margin-left: 1rem;}
.nuo-upsy-upellifyItem:last-child {border: none; }
.nuo-upsy-upellifyItemInner{padding-bottom: 1.5rem;padding-right: 1.5rem;margin: 0;display: flex;justify-content: space-between;align-items: start;}
.nuo-upsy-upellifyItemInner.addedOpacity{opacity: 0.5;}
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc {display: flex; align-items: start; position: relative; padding-right: 4rem; margin: 0; justify-content: flex-start; width: 100%;}
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox {padding: 0 1.5rem; position: relative; cursor: pointer; }
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox .nuo-upsy-imgBoxInner {width: 3rem; min-width: 3rem; height: 3rem; position: relative;display: flex; flex-direction: column; justify-content: center;     border: 1px solid #e6e6e6;}
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox .nuo-upsy-imgBoxInner img {height: 3rem; width: auto; object-fit: cover; }
.nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox:before {content: ""; position: absolute; background: #e6e6e6; height: 1px; width: 2rem; left: 0; top: 50%; }
.nuo-upsy-upellifyItem:last-child .nuo-upsy-imgBox:before {height: 162%; top: -33px; background: transparent; border: 1px solid #e6e6e6; border-width: 0 0 1px 1px; border-radius: 0 0 0 10px; } 
.nuo-upsy-upellifyOtherProducts ul {margin: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction{display: flex;align-items: center;position: relative;}
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantitySelector {position: relative; margin-right: 1rem; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantitySelector input {width: 5rem; padding: 1.1rem 1rem; color: #515151; font-size: 14px; line-height: 20px; height: 1rem; border: 1px solid #e6e6e6; appearance: none; } 
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantityButtonWrap {position: absolute; width: 2rem; top: 0; right: 0; height: 100%; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantityButtonWrap button {transition: .1s all; border: 1px solid #e6e6e6; width: 100%; height: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button {background: #000; transition-duration: .1s; transition-property: background-color,border-color,color,fill,stroke; width: 100%; text-transform: inherit; display: flex; align-items: center; justify-content: center; color: #fff; padding:0.4rem 1.3rem 0.4rem 1rem; font-size: 14px; line-height: 20px; font-weight: 600; border: 1px solid #000; cursor: pointer;font-family: inherit; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button:hover {opacity: 0.7; }
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button svg {width: 1.5rem; margin: 0 5px 0 0; } 
.nuo-upsy-upellifyItem .nuo-upsy-infoBox .nuo-upsy-productName {font-size: 14px; font-weight: 600; line-height: normal;letter-spacing: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-infoBox .nuo-upsy-productName .upsell-product-link {color: inherit;text-transform: capitalize;text-decoration: none;}
.nuo-upsy-upellifyItem .nuo-upsy-productPrice {font-size: 14px; line-height: normal; margin: 0; padding: 0; font-family: inherit; font-weight: normal;letter-spacing: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-productPrice .nuo-upsy-compare {color: #7f7f7f; text-decoration: line-through; padding: 0 5px 0 0; }
.nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap {position: relative; margin: 15px 0 0 0; }
.nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap:after {position: absolute; border: 1px solid #000; border-width: 1px 1px 0 0; content: ""; height: 6px; width: 6px; right: 10px; transform: rotate(135deg); top: 12px; }
.nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap select {background:#fff;height: 35px; border: 1px solid #e6e6e6; padding: 0 25px 0 10px; appearance: none; font-size: 14px; width: 100%; position: relative;font-family: inherit;text-indent: 0; }
.nuo-upsy-upellifyItem .nuo-upsy-infoBox {width: 100%; max-width: 250px;}
.nuo-upsy-upellifyPopupClose svg {position: absolute; right: 10px; top: 10px;cursor:pointer; }
.nuo-upsy-upellifyPopupClose svg path {fill: #ccc; }
.nuo-upsy-upellifyPopupClose svg:hover path{fill: #000;}

.nuo-upsy-product-original-price {text-decoration: line-through; }
/* Upsellify Popup other products css*/

.nuo-upsy-upellifyPopupFooter button {display: flex; align-items: center; justify-content: center; width: auto; padding: 8px 20px; font-size: 14px; line-height: 20px; font-family: inherit; background: #000; border: 1px solid #000; color: #fff; text-transform: inherit; font-weight: 600; }
.nuo-upsy-upellifyPopupFooter button:hover{opacity: 0.7;}
.nuo-upsy-upellifyPopupFooter button svg {width: 20px; height: 20px; margin: 0 0 0 3px; }
.nuo-upsy-upellifyPopupFooter {display: flex; align-items: center; justify-content: flex-end; padding: 1rem 2.1rem; border-top: 1px solid #e6e6e6; }
.nuo-upsy-now-no-thanks {color: #989898;font-size: 14px;text-transform: inherit;font-weight: 500;letter-spacing: 0;text-decoration: none;margin: 0 20px 0 0;position: absolute;left: 20px;}
.nuo-upsy-upellifyPopupFooter button.nuo-upsy-checkout {margin: 0 0 0 10px;}


/* Green checkmark */
.nuo-upsy-imgBox svg {width: 15px; height: 15px;stroke: #fff; stroke-width: 5px; position: absolute; right: -7px; top: -5px; border-radius: 50%; display: block; }
.nuo-upsy-imgBox svg circle {stroke: #50b83c; stroke-width: 2px; }
.nuo-upsy-animated-checkmark--finished {box-shadow: inset 0 0 0 30px #50b83c; }
.nuo-upsy-origin-center {-webkit-transform-origin: center; transform-origin: center; }
.nuo-upsy-animated-arrow--finished>circle, .nuo-upsy-animated-arrow--finished>path, .nuo-upsy-animated-checkmark--finished>circle, .nuo-upsy-animated-checkmark--finished>path {stroke-dashoffset: 0; -webkit-transform: translate(0); transform: translate(0); }
.checkmark__check {-webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48; -webkit-animation: animated-stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards; animation: animated-stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards; }
.checkmark__circle {stroke-dasharray: 166; stroke-dashoffset: 166; stroke-miterlimit: 10; fill: none; -webkit-animation: animated-stroke .6s cubic-bezier(.65,0,.45,1); animation: animated-stroke .6s cubic-bezier(.65,0,.45,1); }

/* Badges */
.nuo-upsy-badge-wrap span {
    background: #000;
    color: #fff;
    font-size: 10px;
    font-weight: normal;
    line-height: normal;
    padding: 0px 5px 2px 5px;
    border-radius: 10px;
    border: 1px solid #000;
}

@media only screen and (max-width: 600px) {
  .nuo-upsy-upellifyOtherProducts ul {padding: 0; }
  .nuo-upsy-upellifyItem {margin: 0; border: none;padding: 1rem 0; }
  .nuo-upsy-upellifyMainProduct {padding: 1rem 1rem;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductDesc {width: 100%; padding: 0; } 
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction{width: 100%;padding: 0.5rem 1rem;}
  .nuo-upsy-upellifyItemInner{padding: 0;display: block;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox {padding: 0 1rem;}
  .nuo-upsy-upellifyItem .nuo-upsy-atcButton {width: 100%;margin: 8px 0 0 0; }
  .nuo-upsy-upellifyItem .nuo-upsy-infoBox {width: 100%; max-width: 100%; padding-right: 1rem; }
  .nuo-upsy-upellifyItem .nuo-upsy-prductDesc .nuo-upsy-imgBox:before{display: none;}
  .nuo-upsy-nuo-upsy-upellifyPopupMain{padding: 0;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantityButtonWrap{display: none;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-quantitySelector input {padding: 0.9rem 0.4rem;}
  .nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button {padding: 0.4rem 1.3rem 0.4rem 1rem; font-size: 14px;line-height: 22px;}
  .nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap select {height: 32px; font-size: 12px; }
  .nuo-upsy-upellifyItem .nuo-upsy-variantSelectorWrap:after{top: 12px;}
  .nuo-upsy-upellifyPopupFooter button {padding: 5px 15px; font-size: 12px;}
  .nuo-upsy-now-no-thanks {font-size: 12px;margin: 0 15px 0 0;left: 10px;}
  .nuo-upsy-upellifyPopupBody {margin: 0;}
  .nuo-upsy-upellifyPopupFooter {padding: 1rem 1.1rem;}
  .nuo-upsy-upellifyPopupHeader h2 {word-break: break-word;}
  .nuo-upsy-upellifyItem .nuo-upsy-infoBox .nuo-upsy-productName .upsell-product-link,
  .nuo-upsy-upellifyMainProduct .nuo-upsy-productName .upsell-product-link{margin: 0 0 5px 0;display: block;}
  .nuo-upsy-upellifyPopupBody::-webkit-scrollbar {width: 7px !important;}
}



/* FBT */
.nuo-upsy-upsellifyFbtContainer {max-width: 1170px; padding: 0 30px 50px; margin: 0 auto; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtHeading h2 {font-size: 24px; margin: 30px 0; line-height: normal; letter-spacing: 0; font-weight: 600; }
.nuo-upsy-upsellifyFbtContainer .text-center{text-align: center;}
.nuo-upsy-upsellifyFbtContainer .text-left{text-align: left;}
.nuo-upsy-upsellifyFbtContainer .text-right{text-align: right;}

/* Two  Products */
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 40%;}
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 45%;}
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtPlusSign {width: 10%;}

/* One product */
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_1 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 20%;}
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_1 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 100%;}

/* Four product */
.nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_4 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 21%;}

/* Css for image section */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow {display: flex; align-items: center; flex-wrap: wrap; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtProductBgImage {display: block; width: 100%; height: 100%; background-repeat: no-repeat  !important; background-size: contain !important; background-position: center center  !important; padding: 0; max-width: 100%; background: #fff; padding-top: 100%;border: 1px solid #ededed; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtProductBgImage.nuo-upsy-fbtProductBgImageHover {position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: auto; width: 100%; opacity: 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 60%; display: flex; flex-wrap: wrap; align-items: center;} 
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtATCBox {width: 14%; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtPlusSign {width: 5%; margin: 0; font-size: 30px;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 30%;position: relative;cursor: pointer;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtEqualSign {width: 6%; font-size: 30px;padding: 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtAddtocart button {background: #000; color: #fff; padding: 15px 30px; border: none; border-radius: 0; font-size: 16px;text-transform: uppercase; line-height: normal; letter-spacing: 0;width: 100%;cursor:pointer;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtTotalPrice {margin: 0 0 10px 0; font-size: 20px; line-height: normal; padding: 0;font-weight: 600;font-family: inherit; }

/* Css for description section */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow {display: block; margin: 30px 0 0 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox {display: flex; align-items: center; flex-wrap: wrap; position: relative;margin: 0 0 10px 0;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox label {position: absolute; border: 1px solid #000; height: 20px; width: 20px; left: 0; border-radius: 2px; background: #000;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox input#fbtCheckBox:checked~label:before {position: absolute; content: ""; border: 2px solid #fff; height: 10px; width: 5px; border-top: 0; border-left: 0; left: 7px; top: 2px; transform: rotate(37deg); }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox input#fbtCheckBox {margin: 0; height: 20px; width: 20px; opacity: 0; z-index: 1; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle a {font-size: 16px; padding: 0 15px; margin: 0; line-height: normal; font-weight: normal; letter-spacing: 0; font-family: inherit;    color: inherit;text-decoration: none; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductVariantSelector {min-width: 100px; height: 30px; border: 1px solid #e5e5e5; padding: 0 20px 0 5px; font-size: 12px; margin: 0 15px 0 0; appearance: none; -webkit-appearance: none; background: transparent; background-image: none !important; position: relative;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductVariantSelector:after {position: absolute; content: ""; height: 20px; width: 20px; border: 1px solid #000; right: 8px; z-index: 1; top: 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice {font-size: 14px; line-height: normal; font-weight: normal; letter-spacing: 0; padding: 0 15px 0 0; }
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle{margin:0;}
.nuo-upsy-product-variant-field:not([disabled]) {
    cursor: pointer;
}

.nuo-upsy-product-variant-field {
    font-size: 1em !important;
    line-height: 1.2 !important;
    margin: 0 10px 0 0 !important;
    min-width: 70px !important;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath fill='%23666' d='M0 0l3.5 4.4C3.7 4.4 7.1 0 7.1 0H0z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-color: rgb(255, 255, 255) !important;
    background-size: initial !important;
    padding: 8px 28px 8px 14px !important;
    border-radius: 0px;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

@media screen and (max-width: 1024px) {
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 74%; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtATCBox {width: 20%;}
}
@media screen and (max-width: 600px) {
  .nuo-upsy-upsellifyFbtContainer {padding: 0 10px 30px;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtPlusSign {width: 5%; margin: 0 5px; font-size: 20px; } 
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 27%;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtEqualSign {width: 5%; font-size: 25px; padding: 0 15px; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtATCBox {width: 100%; margin: 20px 0 0 0; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap,
  .nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImagePlusWrap {width: 91%;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox label { top: 2px; }
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle {padding: 0 15px 5px 5px;max-width: 300px;text-align: left !important;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescBox {margin: 0 0 20px 0;}
  .nuo-upsy-product-variant-field {padding: 8px 28px 8px 10px!important;margin: 0 0 5px 0 !important;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice {padding: 0 15px 5px 0;}
  .nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_2 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox{width:43%;}
  .nuo-upsy-upsellifyFbtContainer .nuo-upsy-product-variant-field {padding: 5px 28px 5px 10px!important;margin: 0 10px 5px 0!important;}
  .nuo-upsy-upsellifyFbtContainer.nuo-upsy-bundle-list-item_4 .nuo-upsy-fbtImageRow .nuo-upsy-fbtImageBox {width: 19%;}

}

/* Slider Css */

.nuo-upsy-product-slider-container {position: relative;    padding: 14px 0 0 0; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-badge {position: absolute; z-index: 1000; margin: 0; top: 0; right: 5%; font-weight: bold; white-space: nowrap; padding: 4px 12px; font-size: 1em; line-height: 140%; box-shadow: 0px 3px 4px rgb(0 0 0 / 25%); background: linear-gradient(90deg, rgba(68, 54, 229, 1), rgba(68, 54, 229, 0.347) 100%); color: #ffffff; border-radius: 4px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-card {border: 1px solid; border-color: #373854; border-radius: 8px; background: #1E1D30; display: flex; position: relative; flex-direction: row; width: 100%; height: 100%; text-align: left; overflow: hidden; padding: 16px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-img-wrapper {display: flex; align-self: center; overflow: hidden; max-width: 27%; min-width: 48px; border-radius: 8px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-img-wrapper img{width: 100%;height: auto;}
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-content-wrapper {display: flex; flex-direction: column; justify-content: center; align-self: center; width: 100%; padding: 8px 8px 8px 20px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-product-name {display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 4px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-product-name h2 {margin: 0; font-size: 16px; line-height: inherit; color: #ffffff; font-weight: bold; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-product-name h2 a {color: inherit; text-decoration: none; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-variants {width:100%;background: transparent; color: #959595; border: 1px solid #fff; padding: 8px 10px; border-radius: 4px; font-size: 12px; -webkit-apperance: none; appearance: none; margin: 0 0 20px 0; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-atc {font-weight: normal; border-radius: 4px; color: #ffffff; background: linear-gradient(90deg, rgba(68, 54, 229, 1), rgba(68, 54, 229, 0.347) 100%); border: 0px solid #000000; position: relative; cursor: pointer; display: flex; line-height: 100%; letter-spacing: 1px; padding: 10px 16px; font-size: 11px; flex-direction: row; width: max-content; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; outline: none; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-atc-text {margin-right: 10px; } 
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-pricing {border-left: 1px solid #ffffff; padding-left: 10px; }
.nuo-upsy-product-slider-container .nuo-upsy-product-slider-compared-price {text-decoration: line-through; opacity: 0.75; margin-left: 6px; }
.nuo-upsy-product-wrapper {
    position: relative;
}
.nuo-upsy-product-slider-arrow-container {
    background-image: url(https://cdn.shopify.com/s/files/1/0608/8330/4620/t/1/assets/right-arrow-black.png?v=1651386900);
    height: 10px;
    width: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: -27px;
    top: 50%;
  cursor:pointer;
}
.nuo-upsy-product-slider .slick-dots li button:before{display:none;}
.nuo-upsy-product-slider .slick-dots { bottom: -30px;}
.nuo-upsy-product-slider .slick-dots li button {
    background-color: #4937ff;
    border-radius: 100%;
    margin: 0;
    width: 6px;
    height: 6px;
    opacity: 0.5;
    transition: transform 0.2s ease-out, margin 0.2s ease-out, opacity 0.2s ease-out;
  padding:0;
}
.nuo-upsy-product-slider .slick-dots li.slick-active button {
    opacity: 1;
    transform: scale3d(1.3, 1.3, 1);
    margin: 0;
}
.nuo-upsy-product-slider-select-wrapper {
    position: relative;
}
.nuo-upsy-product-slider-select-wrapper:after {
    content: "";
    position: absolute;
    border: 1px solid #fff;
    height: 10px;
    width: 10px;
    top: 8px;
    right: 12px;
    border-width: 0px 1px 1px 0px;
    transform: rotate(45deg);
    border-radius: 2px;
}
.nuo-upsy-product-slider .slick-dots li {
    width: auto;
    height: auto;
}
.nuo-upsy-product-heading h2 {
    font-size: 18px;
    font-weight: 600;
      text-align: center;
    margin: 15px 0 30px 0;
}
.nuo-upsy-product-slider-atc-loader{stroke:#fff;}
.nuo-upsy-product-slider-atc-loader, .nuo-upsy-product-slider-atc-check {
    display: none;
    position: absolute;
    height: 70%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.nuo-upsy-product-slider-atc-check{fill:#fff;}
.nuo-upsy-product-slider-atc-loader svg, .nuo-upsy-product-slider-atc-check svg{
  width: 100%;
    height: 100%;
}

.nuo-upsy-product-slider-toast-container {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  top:-30px;
    margin-bottom: 12px;
    color: #f6f6f6;
    z-index: 1000000000;
}
.nuo-upsy-product-slider-toast--success {
    background: #22663f;
}

.nuo-upsy-product-slider-toast {
    display: flex;
    flex-direction: row;
    align-items: center;
    border-radius: 4px;
    margin-top: 20px;
    animation: toast-fadeinup 0.3s ease-in forwards;
    transform: translateY(25%);
    box-shadow: 0 3px 7px 0 rgb(0 0 0 / 25%);
}
.nuo-upsy-product-slider-toast--disappear {
    transform: translateY(0);
    animation: toast-fadeoutdown 0.3s forwards;
    animation-delay: 0.25s;
}
.nuo-upsy-product-slider-toast-icon {
    font-size: 18px;
    margin-left: 12px;
    opacity: 0;
    animation: toast-fadeinup 0.3s forwards;
    animation-delay: 0.3s;
  display:flex;
}
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-icon, 
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-message {
    animation: toast-fadeoutdown 0.3s forwards;
    opacity: 1;
    transform: translateY(0);
}
.nuo-upsy-product-slider-toast-message {
    font-size: 14px;
    line-height: 160%;
    margin: 0 14px 0 8px;
    padding: 12px 0;
    opacity: 0;
    animation: toast-fadeinup 0.3s forwards;
    animation-delay: 0.25s;
}
.nuo-upsy-product-slider-toast--error {
    background: #78222c;
}
.nuo-upsy-product-slider-toast-icon {
    font-size: 18px;
    margin-left: 12px;
    opacity: 0;
    animation: toast-fadeinup 0.3s forwards;
    animation-delay: 0.3s;
}
.nuo-upsy-product-slider-toast-dismiss {
    display: flex;
    align-self: stretch;
    animation: toast-fadeinleft 0.3s forwards;
    animation-delay: 0.35s;
    opacity: 0;
}
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-dismiss {
    animation: toast-fadeoutright 0.3s forwards;
    opacity: 1;
    transform: translateX(0);
}
.nuo-upsy-product-slider-toast-dismiss__button {
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    padding: 0 4px;
    opacity: 0.35;
    background-color: rgba(0, 0, 0, 0.25);
    transition: opacity 0.2s ease, background-color 0.2s ease;
  border:none;
  cursor:pointer;
}
.nuo-upsy-product-slider-toast-dismiss__button:hover {
    opacity: 0.7;
    background-color: rgba(0, 0, 0, 0.15);
}
.nuo-upsy-product-slider-toast-close__icon {
    font-size: 14px;
}
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-icon,
.nuo-upsy-product-slider-toast--disappear .nuo-upsy-product-slider-toast-message {
    animation: toast-fadeoutdown 0.3s forwards;
    opacity: 1;
    transform: translateY(0);
}
.nuo-upsy-product-slider-toast-icon svg {
    max-width: 22px;
}
.nuo-upsy-product-slider-toast-dismiss__icon svg {
    max-width: 14px;
}


@keyframes toast-fadeinup {
    from {
        opacity: 0;
        transform: translateY(25%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes toast-fadeoutdown {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(25%);
    }
}

@keyframes toast-fadeinleft {
    from {
        opacity: 0;
        transform: translateX(25%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes toast-fadeoutright {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(25%);
    }
}
/*  Customizable Settings Css  */

/* FBT heading */
.nuo-upsy-upsellifyFbtContainer{font-size: 20px;font-family: inherit;}

/* FBT text */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductTitle a{font-size: 16px;font-family: inherit;}

/* FBT price */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice{font-size: 14px;font-family: inherit;color: #000000;}
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtDescRow .nuo-upsy-fbtProductPrice span.nuo-upsy-product-price{color: #7f7f7f;}

/*  FBT button */
.nuo-upsy-upsellifyFbtContainer .nuo-upsy-fbtImageRow .nuo-upsy-fbtAddtocart button{background: #000000;color:#ffffff;font-size: 16px;font-family: inherit;}



/* Popup Heading */
.nuo-upsy-upellifyPopupHeader h2{font-size: 20px;font-family: inherit;}

/* Popp Buttons */
.nuo-upsy-upellifyItem .nuo-upsy-prductAction .nuo-upsy-atcButton button{font-size: 14px;font-family: inherit;background: #000000;color:#ffffff; border: 1px solid #000000;}

.nuo-upsy-upellifyPopupFooter button{background: #000000;color:#ffffff; border: 1px solid #000000;}


/* Popup Price */
.nuo-upsy-upellifyItem .nuo-upsy-productPrice{font-size: 14px;font-family: inherit;color: #000000;}
.nuo-upsy-upellifyItem .nuo-upsy-productPrice .nuo-upsy-compare{color: #7f7f7f;}