/** Shopify CDN: Minification failed

Line 655:16 Unexpected ","
Line 960:20 Expected identifier but found "var("
Line 1410:2 Unexpected "}"
Line 3966:37 Expected "{" but found "html"
Line 3977:37 Expected "{" but found "html"
Line 4250:0 Unexpected "}"
Line 4802:0 Unexpected "}"
Line 4989:30 Expected identifier but found "!"

**/
/*:root {
  --alpha-button-background: 1;
  --alpha-button-border: 1;
  --alpha-link: 0.85;
  --alpha-badge-border: 0.1;
} */

.product-card-wrapper .card,
.contains-card--product {
  --border-radius: var(--product-card-corner-radius);
  --border-width: var(--product-card-border-width);
  --border-opacity: var(--product-card-border-opacity);
  --shadow-horizontal-offset: var(--product-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--product-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--product-card-shadow-blur-radius);
  --shadow-opacity: var(--product-card-shadow-opacity);
  --shadow-visible: var(--product-card-shadow-visible);
  --image-padding: 0 (--collection-card-image-padding);
  --left-padding: 0;
  --text-alignment: var(--product-card-text-alignment);
}

.collection-card-wrapper .card,
.contains-card--collection {
  --border-radius: var(--collection-card-corner-radius);
  --border-width: var(--collection-card-border-width);
  --border-opacity: var(--collection-card-border-opacity);
  --shadow-horizontal-offset: var(--collection-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--collection-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--collection-card-shadow-blur-radius);
  --shadow-opacity: var(--collection-card-shadow-opacity);
  --shadow-visible: var(--collection-card-shadow-visible);
  --image-padding: 0 (--collection-card-image-padding);
  --left-padding: 0;
  --text-alignment: var(--collection-card-text-alignment);
}

.article-card-wrapper .card,
.contains-card--article {
  --border-radius: var(--blog-card-corner-radius);
  --border-width: var(--blog-card-border-width);
  --border-opacity: var(--blog-card-border-opacity);
  --shadow-horizontal-offset: var(--blog-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--blog-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--blog-card-shadow-blur-radius);
  --shadow-opacity: var(--blog-card-shadow-opacity);
  --shadow-visible: var(--blog-card-shadow-visible);
  --image-padding: 0 (--collection-card-image-padding);
  --left-padding: 0;
  --text-alignment: var(--blog-card-text-alignment);
}

.contains-content-container,
.content-container {
  --border-radius: var(--text-boxes-radius);
  --border-width: var(--text-boxes-border-width);
  --border-opacity: var(--text-boxes-border-opacity);
  --shadow-horizontal-offset: var(--text-boxes-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--text-boxes-shadow-vertical-offset);
  --shadow-blur-radius: var(--text-boxes-shadow-blur-radius);
  --shadow-opacity: var(--text-boxes-shadow-opacity);
  --shadow-visible: var(--text-boxes-shadow-visible);
}

.contains-media,
.global-media-settings {
  --border-radius: var(--media-radius);
  --border-width: var(--media-border-width);
  --border-opacity: var(--media-border-opacity);
  --shadow-horizontal-offset: var(--media-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--media-shadow-vertical-offset);
  --shadow-blur-radius: var(--media-shadow-blur-radius);
  --shadow-opacity: var(--media-shadow-opacity);
  --shadow-visible: var(--media-shadow-visible);
}

/* base */

.no-js:not(html) {
  display: none !important;
}

html.no-js .no-js:not(html) {
  display: block !important;
}

.no-js-inline {
  display: none !important;
}

html.no-js .no-js-inline {
  display: inline-block !important;
}

html.no-js .no-js-hidden {
  display: none !important;
}

.page-width {
  max-width: var(--page-width);
  margin-left: 0rem;
  margin-right: 0rem;
}

body:has(.section-header .drawer-menu) .announcement-bar-section .page-width {
  max-width: 100%;
}

.page-width.drawer-menu {
  max-width: 100%;
}

.page-width-desktop {
  padding: 0rem;
  margin: 0rem;
}

.utility-bar__grid.page-width {
  padding-left: 0rem;
  padding-right: 0rem;
}

@media screen and (min-width: 750px) {
  .page-width {
    padding: 0rem;
  }

  .header.page-width,
  .utility-bar__grid.page-width {
    margin-left: 0rem; /* adjusted from 1rem to 0rem 9 May */
    margin-right: 1rem;
  }

  .page-width--narrow {
    padding: 0rem;
  }

  .page-width-desktop {
    padding: 0rem;
  }

  .page-width-tablet {
    padding: 0rem;
  }
}

@media screen and (min-width: 990px) {
  .header:not(.drawer-menu).page-width {
    width: 100%;
    padding-left: 0rem;
    padding-right: 0rem;
  }

  .page-width--narrow {
    width: 100%;
    padding: 0;
  }

  .page-width-desktop {
    width: 100% (--page-width);
    padding: 0 0rem;
  }
}

.isolate {
  position: relative;
  z-index: 0;
}

.section + .section {
  margin-top: var(--spacing-sections-mobile);
}

/* begin blog margins */

@media screen and (min-width: 750px) {
  .section + .section {
    margin-top: var(--spacing-sections-desktop);
    margin-left: 1rem;
    margin-right: 1rem;
  }
}

@media screen and (max-width: 749px) {
  .section + .section {
    margin-top: var(--spacing-sections-desktop);
    margin-left: 1rem;
    margin-right: 1rem;
  }
}

/* end blog margins */

.element-margin-top {
  margin-top: 0rem;
}

@media screen and (min-width: 750px) {
  .element-margin {
    margin-top: calc(5rem + var(--page-width-margin));
  }
}

.background-secondary {
  background-color: rgba(var(--color-foreground), 0.04);
}

.grid-auto-flow {
  display: grid;
  grid-auto-flow: column;
}

.page-margin,
.shopify-challenge__container {
  margin: 0rem auto;
  padding-top: 10rem;
}

.rte-width {
  max-width: 82rem;
  margin: 0 auto 0rem;
}

.list-unstyled {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hidden {
  display: none !important;
}

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

.visually-hidden--inline {
  margin: 0;
  height: 1em;
}

.overflow-hidden {
  overflow: hidden;
}

.skip-to-content-link:focus {
  z-index: 9999;
  position: inherit;
  overflow: auto;
  width: auto;
  height: auto;
  clip: auto;
}

.full-width-link {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
}

::selection {
  background-color: rgba(170, 200, 255, 0.99); /* light blue */
  color: inherit; /* keep your text readable */
}

.text-body {
  font-size: 1rem;
  letter-spacing: 0rem;
  line-height: calc(1 + 0.8 / var(--font-body-scale));
  font-family: "Sneaky Times" (--font-body-style);
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
}

h1,
h2,
h3,
h4,
h5,
.h0,
.h1,
.h2,
.h3,
.h4,
.h5 {
  font-family: "Sneaky Times" (--font-body-style);
  font-style: var(--font-heading-style);
  font-weight: var(--font-heading-weight);
  letter-spacing: calc(var(--font-heading-scale) * 0rem);
  color: rgb(var(--color-foreground));
  line-height: calc(1 + 0.3 / max(1, var(--font-heading-scale)));
  word-break: break-word;
}

.hxl {
  font-size: calc(var(--font-heading-scale) * 1rem);
}

@media only screen and (min-width: 750px) {
  .hxl {
    font-size: calc(var(--font-heading-scale) * 1rem);
  }
}

.h0 {
  font-size: calc(var(--font-heading-scale) * 1rem);
}

@media only screen and (min-width: 750px) {
  .h0 {
    font-size: calc(var(--font-heading-scale) * 1rem);
  }
}

h1,
.h1 {
  font-size: calc(var(--font-heading-scale) * 1rem);
}

@media only screen and (min-width: 750px) {
  h1,
  .h1 {
    font-size: calc(var(--font-heading-scale) * 1rem);
  }
}

h2,
.h2 {
  font-size: 1rem;
  letter-spacing: 0rem;
  text-transform: uppercase;
}

@media only screen and (min-width: 750px) {
  h2,
  .h2 {
    font-size: 1rem;
    letter-spacing: 0rem;
    text-transform: uppercase;
  }
}

h3,
.h3 {
  font-size: calc(var(--font-heading-scale) * 1rem);
}

@media only screen and (min-width: 750px) {
  h3,
  .h3 {
    font-size: calc(var(--font-heading-scale) * 1rem);
  }
}

h4,
.h4 {
  font-family: var(--font-heading-family);
  font-style: var(--font-heading-style);
  font-size: calc(var(--font-heading-scale) * 1rem);
}

h5,
.h5 {
  font-size: calc(var(--font-heading-scale) * 1rem);
}

@media only screen and (min-width: 750px) {
  h5,
  .h5 {
    font-size: calc(var(--font-heading-scale) * 1rem);
  }
}

h6,
.h6 {
  color: rgba(var(--color-foreground), 0.75);
  margin-block-start: 1.67em;
  margin-block-end: 1.67em;
}

blockquote {
  font-style: italic;
  color: rgba(var(--color-foreground), 0.75);
  border-left: 0.2rem solid rgba(var(--color-foreground), 0.2);
  padding-left: 0rem;
}

@media screen and (min-width: 750px) {
  blockquote {
    padding-left: 0rem;
  }
}

.caption {
  font-size: 0.9rem;
  letter-spacing: 0.01rem;
  line-height: calc(1 + 0.7 / var(--font-body-scale));
}

@media screen and (min-width: 750px) {
  .caption {
    font-size: 0.9rem;
    letter-spacing: 0.01rem;
  }
}

.caption-with-letter-spacing {
  font-size: 1rem;
  letter-spacing: 0rem;
  line-height: calc(1 + 0.2 / var(--font-body-scale));
  /* margin-left: 0.5rem;
    margin-right: 0.5rem; */
}

.caption-with-letter-spacing--medium {
  font-size: 1.2rem;
  /* letter-spacing: 0.16rem; */
}

.caption-with-letter-spacing--large {
  font-size: 1.4rem;
  letter-spacing: 0.18rem;
}

.caption-large,
.customer .field input,
.customer select,
.field__input,
.form__label,
.select__select {
  font-size: 0.9rem;
  line-height: calc(1 + 0.5 / var(--font-body-scale));
  /* letter-spacing: 0.04rem; */
  font-family: var(--font-body-style);
    font-style: var(--font-body-style);
}

.color-foreground {
  color: rgb(var(--color-foreground));
}

table:not([class]) {
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 1rem;
  border-style: hidden;
  box-shadow: 0 0 0 0.1rem rgba(var(--color-foreground), 0.2);
  /* draws the table border  */
}

table:not([class]) td,
table:not([class]) th {
  padding: 1em;
  border: 0.1rem solid rgba(var(--color-foreground), 0.2);
}

@media screen and (max-width: 749px) {
  .small-hide {
    display: none !important;
  }
}

@media screen and (min-width: 750px) and (max-width: 989px) {
  .medium-hide {
    display: none !important;
  }
}

@media screen and (min-width: 990px) {
  .large-up-hide {
    display: none !important;
  }
}

.left {
  text-align: left;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.uppercase {
  text-transform: uppercase;
}

.light {
  opacity: 0.7;
}

a:empty,
ul:empty,
dl:empty,
div:empty,
section:empty,
article:empty,
p:empty,
h1:empty,
h2:empty,
h3:empty,
h4:empty,
h5:empty,
h6:empty {
  display: none;
}

.link,
.customer a {
  cursor: pointer;
  display: inline-block;
  border: none;
  box-shadow: none;
  text-decoration: none;
  /*text-underline-offset: 0.3rem; */
  color: rgb(var(--color-link));
  background-color: transparent;
  font-size: 1rem;
  font-family: "Sneaky Times";
}

.link--text {
  color: rgb(var(--color-foreground));
}

.link--text:hover {
  color: #ff0030;
}

.link-with-icon {
  display: inline-flex;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.1rem;
  text-decoration: none;
  margin-bottom: 4.5rem;
  white-space: nowrap;
}

.link-with-icon .icon {
  width: 1rem;
  margin-left: 1rem;
}

.link-with-icon .icon:hover {
  color: #ff0030;
}

a:not([href]) {
  cursor: not-allowed;
}

.circle-divider::after {
  content: "\2022";
  margin: 0 1.3rem 0 1.5rem;
}

.circle-divider:last-of-type::after {
  display: none;
}

hr {
  border: none;
  height: 0.1rem;
  background-color: rgba(var(--color-foreground), 0.2);
  display: block;
  margin: 1rem 0;
}

@media screen and (min-width: 750px) {
  hr {
    margin: 7rem 0;
  }
}

/* homepage collection photos layered titles */
/* product grid titles */
.full-unstyled-link {
  text-decoration: none;
  color: currentColor;
  font-size: 0.9rem;
}

.full-unstyled-link:hover {
  color: #ff0030;
}

.placeholder {
  background-color: rgba(var(--color-foreground), 0.04);
  color: rgba(var(--color-foreground), 0.55);
  fill: rgba(var(--color-foreground), 0.55);
}

details > * {
  box-sizing: border-box;
}

.break {
  word-break: break-word;
}

.visibility-hidden {
  visibility: hidden;
}

@media (prefers-reduced-motion) {
  .motion-reduce {
    transition: none !important;
    animation: none !important;
  }
}

:root {
  --duration-short: 100ms;
  --duration-default: 200ms;
  --duration-announcement-bar: 250ms;
  --duration-medium: 300ms;
  --duration-long: 500ms;
  --duration-extra-long: 600ms;
  --duration-extended: 3s;
  --ease-out-slow: cubic-bezier(0, 0, 0.3, 1);
  --animation-slide-in: slideIn var(--duration-extra-long) var(--ease-out-slow)
    forwards;
  --animation-fade-in: fadeIn var(--duration-extra-long) var(--ease-out-slow);
}

.underlined-link,
/*.customer a */,
.inline-richtext a {
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.1rem;
  transition: text-decoration-thickness ease 100ms;
}

.underlined-link,
.customer a {
  color: black;
}

.inline-richtext a,
.rte.inline-richtext a {
  color: currentColor;
}

.underlined-link:hover,
.customer a:hover,
.inline-richtext a:hover {
  text-decoration-thickness: 0.2rem;
  color: #ff0030;
}

.icon-arrow {
  width: 1.5rem;
}

h3 .icon-arrow,
.h3 .icon-arrow {
  width: calc(var(--font-heading-scale) * 1.5rem);
}

/*custom font*/

/* arrow animation */
.animate-arrow .icon-arrow path {
  transform: translateX(-0.25rem);
  transition: transform var(--duration-short) ease;
}

.animate-arrow:hover .icon-arrow path {
  transform: translateX(-0.05rem);
}

/* base-details-summary */
summary {
  cursor: pointer;
  list-style: none;
  position: relative;
}

summary .icon-caret {
  position: absolute;
  height: 0.6rem !important;
  right: 1.5rem;
  top: calc(40% - 0.2rem);
}

summary::-webkit-details-marker {
  display: none;
}

.disclosure-has-popup {
  position: relative;
}

.disclosure-has-popup[open] > summary::before {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: block;
  cursor: default;
  content: " ";
  background: transparent;
}

.disclosure-has-popup > summary::before {
  display: none;
}

.disclosure-has-popup[open] > summary + * {
  z-index: 100;
}

@media screen and (min-width: 750px) {
  .disclosure-has-popup[open] > summary + * {
    z-index: 4;
  }

  .facets .disclosure-has-popup[open] > summary + * {
    z-index: 2;
  }
}

/* base-focus */
/*
  Focus ring - default (with offset)
*/

*:focus {
  outline: 0;
  box-shadow: none;
}

*:focus-visible {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 0.3rem;
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
    0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
}

/* Fallback - for browsers that don't support :focus-visible, a fallback is set for :focus */
.focused,
.no-js *:focus {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 0.3rem;
  box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
    0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
}

/* Negate the fallback side-effect for browsers that support :focus-visible */
.no-js *:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none;
}

/*
  Focus ring - inset
*/

.focus-inset:focus-visible {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: -0.2rem;
  box-shadow: 0 0 0.2rem 0 rgba(var(--color-foreground), 0.3);
}

.focused.focus-inset,
.no-js .focus-inset:focus {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: -0.2rem;
  box-shadow: 0 0 0.2rem 0 rgba(var(--color-foreground), 0.3);
}

.no-js .focus-inset:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none;
}

/*
  Focus ring - none
*/

/* Dangerous for a11y - Use with care */
.focus-none {
  box-shadow: none !important;
  outline: 0 !important;
}

.focus-offset:focus-visible {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 1rem;
  box-shadow: 0 0 0 1rem rgb(var(--color-background)),
    0 0 0.2rem 1.2rem rgba(var(--color-foreground), 0.3);
}

.focus-offset.focused,
.no-js .focus-offset:focus {
  outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
  outline-offset: 1rem;
  box-shadow: 0 0 0 1rem rgb(var(--color-background)),
    0 0 0.2rem 1.2rem rgba(var(--color-foreground), 0.3);
}

.no-js .focus-offset:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none;
}

/* component-title */
.title,
.title-wrapper-with-link {
  margin: 0rem 0 0rem;
}

.title-wrapper-with-link .title {
  margin: 0;
}

.title .link {
  font-size: inherit;
}

.title-wrapper {
  margin-bottom: 0rem;
}

.title-wrapper-with-link {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 3rem;
  flex-wrap: wrap;
  /* margin-left: 0.5rem; */
  margin-right: 0.5rem;
}

/* EDIT 4 DEC 2024

.title--primary {
  margin-left: 1rem;
}
*/


.title-wrapper--self-padded-tablet-down,
.title-wrapper--self-padded-mobile {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media screen and (min-width: 750px) {
  .title-wrapper--self-padded-mobile {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 990px) {
  .title,
  .title-wrapper-with-link {
    margin: 5rem 0 3rem;
  }

  .title--primary {
    margin: 2rem 0;
  }

  .title-wrapper-with-link {
    align-items: center;
  }

  .title-wrapper-with-link .title {
    margin-bottom: 0;
  }

  .title-wrapper--self-padded-tablet-down {
    padding-left: 0;
    padding-right: 0;
  }
}

.title-wrapper-with-link .link-with-icon {
  margin: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.title-wrapper-with-link .link-with-icon svg {
  width: 1.5rem;
}

.title-wrapper-with-link a {
  margin-top: 0;
  flex-shrink: 0;
  /*padding-right: 1rem; */
}

.title-wrapper--no-top-margin {
  margin-top: 0;

}

.title-wrapper--no-top-margin > .title {
  margin-top: 0;
}

.subtitle {
  font-size: 1rem;
  line-height: calc(1 + 0.8 / var(--font-body-scale));
  letter-spacing: 0.06rem;
  color: rgba(var(--color-foreground), 0.7);
}

.subtitle--small {
  font-size: 1rem;
  letter-spacing: 0.1rem;
}

.subtitle--medium {
  font-size: 1rem;
  letter-spacing: 0.08rem;
}

/* component-grid */
.grid {
  display: flex;
  margin-bottom: 0rem;
  padding: 0;
  list-style: none;
  column-gap: 1rem; var(--grid-mobile-horizontal-spacing);
  row-gap: var(--grid-mobile-vertical-spacing);
  flex-wrap: wrap;
  flex-direction: row;
  align-items: stretch; /* changed from flex-end to stretch to make product grid line up 9 May 15:27 */
}

@media screen and (min-width: 750px) {
  .grid {
    column-gap: var(--grid-desktop-horizontal-spacing);
    row-gap: var(--grid-desktop-vertical-spacing);
  }
}

.grid:last-child {
  margin-bottom: 0;
}

.grid__item {
  width: calc(25% - var(--grid-mobile-horizontal-spacing) * 3 / 4);
  max-width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
  flex-grow: 1;
  flex-shrink: 0;
}

@media screen and (min-width: 750px) {
  .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
    max-width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }
}

.grid--gapless.grid {
  column-gap: 0;
  row-gap: 0;
}

@media screen and (max-width: 749px) {
  .grid__item.slider__slide--full-width {
    width: 100%;
    max-width: none;
  }
}

.grid--1-col .grid__item {
  max-width: 100%;
  width: 100%;
}

.grid--3-col .grid__item {
  width: calc(33.33% - var(--grid-mobile-horizontal-spacing) * 2 / 3);
}

@media screen and (min-width: 750px) {
  .grid--3-col .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
  }
}

.grid--2-col .grid__item {
  width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
}

@media screen and (min-width: 750px) {
  .grid--2-col .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .grid--4-col-tablet .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
  }

  .grid--3-col-tablet .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
  }

  .grid--2-col-tablet .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }
}

@media screen and (max-width: 989px) {
  .grid--1-col-tablet-down .grid__item {
    width: 100%;
    max-width: 100%;
  }

  .slider--tablet.grid--peek {
    margin: 0;
    width: 100%;
  }

  .slider--tablet.grid--peek .grid__item {
    box-sizing: content-box;
    margin: 0;
  }

  .slider.slider--tablet .scroll-trigger.animate--slide-in,
  .slider.slider--mobile .scroll-trigger.animate--slide-in {
    animation: none;
    opacity: 1;
    transform: inherit;
  }

  .scroll-trigger:not(.scroll-trigger--offscreen) .slider--tablet {
    animation: var(--animation-slide-in);
  }
}

@media screen and (min-width: 990px) {
  .grid--6-col-desktop .grid__item {
    width: calc(16.66% - var(--grid-desktop-horizontal-spacing) * 5 / 6);
    max-width: calc(16.66% - var(--grid-desktop-horizontal-spacing) * 5 / 6);
  }

  .grid--5-col-desktop .grid__item {
    width: calc(20% - var(--grid-desktop-horizontal-spacing) * 4 / 5);
    max-width: calc(20% - var(--grid-desktop-horizontal-spacing) * 4 / 5);
  }

  .grid--4-col-desktop .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
    max-width: calc(25% - var(--grid-desktop-horizontal-spacing) * 3 / 4);
  }

  .grid--3-col-desktop .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
    max-width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
  }

  .grid--2-col-desktop .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
    max-width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .slider.slider--desktop .scroll-trigger.animate--slide-in {
    animation: none;
    opacity: 1;
    transform: inherit;
  }

  .scroll-trigger:not(.scroll-trigger--offscreen) .slider--desktop {
    animation: var(--animation-slide-in);
  }
}

@media screen and (min-width: 990px) {
  .grid--1-col-desktop {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .grid--1-col-desktop .grid__item {
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 749px) {
  .grid--peek.slider--mobile {
    margin: 0;
    width: 100%;
  }

  .grid--peek.slider--mobile .grid__item {
    box-sizing: content-box;
    margin: 0;
  }

  .grid--peek .grid__item {
    min-width: 35%;
  }

  .grid--peek.slider .grid__item:first-of-type {
    margin-left: 1.5rem;
  }

  /* Fix to show some space at the end of our sliders in all browsers */
  .grid--peek.slider:after {
    margin-left: calc(-1 * var(--grid-mobile-horizontal-spacing));
  }

  .grid--2-col-tablet-down .grid__item {
    width: calc(33.33% - var(--grid-mobile-horizontal-spacing) / 2); /* changed from 50% to 33.33% to make two columns on mobile view for product grid 9 May 16:03 */
  }

  .slider--tablet.grid--peek.grid--2-col-tablet-down .grid__item,
  .grid--peek .grid__item {
    width: calc(50% - var(--grid-mobile-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek.grid--1-col-tablet-down .grid__item,
  .slider--mobile.grid--peek.grid--1-col-tablet-down .grid__item {
    width: calc(100% - var(--grid-mobile-horizontal-spacing) - 3rem);
  }
}

@media screen and (min-width: 750px) and (max-width: 989px) {
  .slider--tablet.grid--peek .grid__item {
    width: calc(25% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek.grid--3-col-tablet .grid__item {
    width: calc(33.33% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek.grid--2-col-tablet .grid__item,
  .slider--tablet.grid--peek.grid--2-col-tablet-down .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }

  .slider--tablet.grid--peek .grid__item:first-of-type {
    margin-left: 1.5rem;
  }

  .grid--2-col-tablet-down .grid__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  .grid--1-col-tablet-down.grid--peek .grid__item {
    width: calc(100% - var(--grid-desktop-horizontal-spacing) - 3rem);
  }
}




  /* component-media */
  .media {
    display: block;
    background-color: rgba(var(--color-foreground), 0.1);
    position: relative;
    overflow: hidden;
  }

  .media--transparent {
    background-color: transparent;
  }

  .media > *:not(.zoom):not(.deferred-media__poster-button),
  .media model-viewer {
    display: block;
    max-width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
  }

  .media > img {
    object-fit: cover;
    object-position: center center;
    transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }

  .media--square {
    padding-bottom: 100%; /*******/
  }

  .media--portrait {
    padding-bottom: 125%; /*******/
  }

  .media--landscape {
    padding-bottom: 66.6%;
  }

  .media--cropped {
    padding-bottom: 56%;
  }

  .media--16-9 {
    padding-bottom: 56.25%;
  }

  .media--circle {
    padding-bottom: 100%;
    border-radius: 50%;
  }

  .media.media--hover-effect > img + img {
    opacity: 0;
  }

  @media screen and (min-width: 990px) {
    .media--cropped {
      padding-bottom: 63%;
    }
  }

  deferred-media {
    display: block;
  }

  /* component-button */
  /* Button - default */

  .button--secondary,
  .button--tertiary {
    --color-button: var(--color-secondary-button);
    --color-button-text: var(--color-secondary-button-text);
  }

  .button--tertiary {
    --alpha-button-background: 0;
    --alpha-button-border: 0.2;
  }

  .button,
  .shopify-challenge__button,
  .customer button,
  button.shopify-payment-button__button--unbranded,
  .shopify-payment-button [role="button"],
  .cart__dynamic-checkout-buttons [role="button"],
  .cart__dynamic-checkout-buttons iframe {
    --shadow-horizontal-offset: var(--buttons-shadow-horizontal-offset);
    --shadow-vertical-offset: var(--buttons-shadow-vertical-offset);
    --shadow-blur-radius: var(--buttons-shadow-blur-radius);
    --shadow-opacity: var(--buttons-shadow-opacity);
    --shadow-visible: var(--buttons-shadow-visible);
    --border-offset: var(
      --buttons-border-offset
    ); /* reduce radius edge artifacts */
    --border-opacity: calc(1 - var(--buttons-border-opacity));
    border-radius: var(--buttons-radius-outset);
    position: relative;
  }

  .button,
  .shopify-challenge__button,
  .customer button,
  button.shopify-payment-button__button--unbranded {
    min-width: calc(12rem + var(--buttons-border-width) * 2);
    min-height: calc(4.5rem + var(--buttons-border-width) * 2);
  }

  .shopify-payment-button__button--branded {
    z-index: auto;
  }

  .cart__dynamic-checkout-buttons iframe {
    box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset)
      var(--shadow-blur-radius) rgba(var(--color-shadow), var(--shadow-opacity));
  }

  .button,
  .shopify-challenge__button,
  .customer button {
 display: inline-block;
    justify-content: left;
    background:rgb(237 237 237);
    color: black;
    Font: inherit;
    align-items: center;
    line-height: 1.1em;
    border-color: #000000;
    text-transform: uppercase;
    padding: 12px 18px;
    cursor: pointer;
    text-decoration: none;
    border: 0px solid #000;
  }

  .button:hover,
  .shopify-challenge__button:hover,
  .customer button:hover {
    background: #454343;
    color: red;
  }

  .button:before,
  .shopify-challenge__button:before,
  .customer button:before,
  .shopify-payment-button__button--unbranded:before,
  .shopify-payment-button [role="button"]:before,
  .cart__dynamic-checkout-buttons [role="button"]:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    border-radius: var(--buttons-radius-outset);
    box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset)
      var(--shadow-blur-radius) rgba(var(--color-shadow), var(--shadow-opacity));
  }

  .button:after,
  .shopify-challenge__button:after,
  .customer button:after,
  .shopify-payment-button__button--unbranded:after {
    content: "";
    position: absolute;
    top: var(--buttons-border-width);
    right: var(--buttons-border-width);
    bottom: var(--buttons-border-width);
    left: var(--buttons-border-width);
    z-index: 1;
    border-radius: var(--buttons-radius);
    box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset))
        rgba(var(--color-button-text), var(--border-opacity)),
      0 0 0 var(--buttons-border-width)
        rgba(var(--color-button), var(--alpha-button-background));
    transition: box-shadow var(--duration-short) ease;
  }

  .button:not([disabled]):hover::after,
  .shopify-challenge__button:hover::after,
  .customer button:hover::after,
  .shopify-payment-button__button--unbranded:hover::after {
    --border-offset: 1.3px;
    box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset))
        rgba(var(--color-button-text), var(--border-opacity)),
      0 0 0 calc(var(--buttons-border-width) + 1px)
        rgba(var(--color-button), var(--alpha-button-background));
  }

  .button--secondary:after {
    --border-opacity: var(--buttons-border-opacity);
  }

  .button:focus-visible,
  .button:focus,
  .button.focused,
  .shopify-payment-button__button--unbranded:focus-visible,
  .shopify-payment-button [role="button"]:focus-visible,
  .shopify-payment-button__button--unbranded:focus,
  .shopify-payment-button [role="button"]:focus {
    outline: 0;
    box-shadow: 0 0 0 0.3rem rgb(var(--color-background)),
      0 0 0 0.5rem rgba(var(--color-foreground), 0.5),
      0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
  }

  .button:focus:not(:focus-visible):not(.focused),
  .shopify-payment-button__button--unbranded:focus:not(:focus-visible):not(
      .focused
    ),
  .shopify-payment-button
    [role="button"]:focus:not(:focus-visible):not(.focused) {
    box-shadow: inherit;
  }

  .button::selection,
  .shopify-challenge__button::selection,
  .customer button::selection {
    background-color: rgba(var(--color-button-text), 0.3);
  }
  }

  .button,
  .button-label,
  .shopify-challenge__button,
  .customer button {
    font-size: .9rem;
    line-height: calc(1 + 0.2 / var(--font-body-scale));
  }

  .button--tertiary {
    font-size: 1rem;
    /* padding: 1rem 1.5rem;
  min-width: calc(9rem + var(--buttons-border-width) * 2);
  min-height: calc(3.5rem + var(--buttons-border-width) * 2); */
  }

  .button--small {
    padding: 1.2rem 2.6rem;
  }

  /* Button - other */

  .button:disabled,
  .button[aria-disabled="true"],
  .button.disabled,
  .customer button:disabled,
  .customer button[aria-disabled="true"],
  .customer button.disabled,
  .quantity__button.disabled {
    cursor: not-allowed;
    opacity: 0.5;
  }

  .button--full-width {
    display: flex;
  }

  .button.loading {
    color: transparent;
    position: relative;
  }

  @media screen and (forced-colors: active) {
    .button.loading {
      color: rgb(var(--color-foreground));
    }
  }

  .button.loading > .loading-overlay__spinner {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    height: 100%;
    display: flex;
    align-items: center;
  }

  .button.loading > .loading-overlay__spinner .spinner {
    width: fit-content;
  }

  .button.loading > .loading-overlay__spinner .path {
    stroke: rgb(var(--color-button-text));
  }

  /* Button - social share */

  .share-button {
    display: block;
    position: relative;
  }

  .share-button details {
    width: fit-content;
  }

  .share-button__button {
    font: inherit;
    font-size: 0.8rem;
    text-decoration: none;
    display: flex;
    align-items: center;
    color: rgb(var(--color-link));
    margin-left: 0;
    padding-left: 0;
    /*min-height: 2rem; */
  }

  details[open] > .share-button__fallback {
    animation: animateMenuOpen var(--duration-default) ease;
  }

  .share-button__button:hover {
    text-decoration: underline;
    text-underline-offset: 0.3rem;
  }

  .share-button__button,
  .share-button__fallback button {
    cursor: pointer;
    background-color: transparent;
    border: none;
  }

  .share-button__button .icon-share {
    height: 0.8rem;
    margin-right: 1rem;
    min-width: 1.3rem;
  }

  .share-button__fallback {
    display: flex;
    align-items: center;
    position: absolute;
    top: 3rem;
    left: 0.1rem;
    z-index: 3;
    width: 100%;
    min-width: max-content;
    border-radius: var(--inputs-radius);
    border: 0;
  }

  .share-button__fallback:after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: var(--inputs-border-width);
    right: var(--inputs-border-width);
    bottom: var(--inputs-border-width);
    left: var(--inputs-border-width);
    border: 0.1rem solid transparent;
    border-radius: var(--inputs-radius);
    box-shadow: 0 0 0 var(--inputs-border-width)
      rgba(var(--color-foreground), var(--inputs-border-opacity));
    transition: box-shadow var(--duration-short) ease;
    z-index: 1;
  }

  .share-button__fallback:before {
    background: rgb(var(--color-background));
    pointer-events: none;
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: var(--inputs-radius-outset);
    box-shadow: var(--inputs-shadow-horizontal-offset)
      var(--inputs-shadow-vertical-offset) var(--inputs-shadow-blur-radius)
      rgba(var(--color-shadow), var(--inputs-shadow-opacity));
    z-index: -1;
  }

  .share-button__fallback button {
    width: 4.4rem;
    height: 4.4rem;
    padding: 0;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    right: var(--inputs-border-width);
  }

  .share-button__fallback button:hover {
    color: rgba(var(--color-foreground), 0.75);
  }

  .share-button__fallback button:hover svg {
    transform: scale(1.07);
  }

  .share-button__close:not(.hidden) + .share-button__copy {
    display: none;
  }

  .share-button__close,
  .share-button__copy {
    background-color: transparent;
    color: rgb(var(--color-foreground));
  }

  .share-button__copy:focus-visible,
  .share-button__close:focus-visible {
    background-color: rgb(var(--color-background));
    z-index: 2;
  }

  .share-button__copy:focus,
  .share-button__close:focus {
    background-color: rgb(var(--color-background));
    z-index: 2;
  }

  .field:not(:focus-visible):not(.focused)
    + .share-button__copy:not(:focus-visible):not(.focused),
  .field:not(:focus-visible):not(.focused)
    + .share-button__close:not(:focus-visible):not(.focused) {
    background-color: inherit;
  }

  .share-button__fallback .field:after,
  .share-button__fallback .field:before {
    content: none;
  }

  .share-button__fallback .field {
    border-radius: 0;
    min-width: auto;
    min-height: auto;
    transition: none;
  }

  .share-button__fallback .field__input:focus,
  .share-button__fallback .field__input:-webkit-autofill {
    outline: 0.2rem solid rgba(var(--color-foreground), 0.5);
    outline-offset: 0.1rem;
    box-shadow: 0 0 0 0.1rem rgb(var(--color-background)),
      0 0 0.5rem 0.4rem rgba(var(--color-foreground), 0.3);
  }

  .share-button__fallback .field__input {
    box-shadow: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    filter: none;
    min-width: auto;
    min-height: auto;
  }

  .share-button__fallback .field__input:hover {
    box-shadow: none;
  }

  .share-button__fallback .icon {
    width: 1.5rem;
    height: 1.5rem;
  }

  .share-button__message:not(:empty) {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    margin-top: 0;
    padding: 0.8rem 0 0.8rem 1.5rem;
    margin: var(--inputs-border-width);
  }

  .share-button__message:not(:empty):not(.hidden) ~ * {
    display: none;
  }

  /* component-form */
  .field__input,
  .select__select,
  .customer .field input,
  .customer select {
    -webkit-appearance: none;
    appearance: none;
    color: rgb(var(--color-foreground));
    font-size: 0.8rem;
    width: 70%;
    box-sizing: border-box;
    transition: box-shadow var(--duration-short) ease;
    border-radius: 10px;
    webkit-border-radius: 10px;
    /* height: 0.9rem; */
    min-height: calc(var(--inputs-border-width) * 2);
    min-width: calc(7rem + (var(--inputs-border-width) * 2));
    position: relative;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: rgb(0, 0, 0);
    border-right-color: rgb(0, 0, 0);
    border-bottom-color: rgb(0, 0, 0);
    border-left-color: rgb(0, 0, 0);
    webkit-border-start-width: 1px;
    webkit-border-radius: 10px;
    background-color: #c0c0c040;
    z-index: 1;
  }

  .select__select:hover {
    background-color: #c0c0c040;
    -webkit-backdrop-filter: blur(5px) brightness(1.5) contrast(0.6) saturate(1);
    -moz-backdrop-filter: blur(5px) brightness(1.3) contrast(0.6) saturate(1);
    backdrop-filter: blur(5px) brightness(1.3) contrast(0.9) saturate(1);
  }

  .customer .field input,
  .customer select .field:before,
  .select:before,
  .customer .field:before,
  .customer select:before,
  .localization-form__select:before {
    /* pointer-events: none; */
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: var(--inputs-radius-outset);
    box-shadow: var(--inputs-shadow-horizontal-offset)
      var(--inputs-shadow-vertical-offset) var(--inputs-shadow-blur-radius)
      rgba(var(--color-shadow), var(--inputs-shadow-opacity));
    z-index: 1;
  }

  .field:after,
  .select:after,
  .customer .field:after,
  .customer select:after,
  .localization-form__select:after {
    /*  pointer-events: none; */
    content: "";
    position: absolute;
    /*top: var(--inputs-border-width);
    right: var(--inputs-border-width);
    bottom: var(--inputs-border-width);
    left: var(--inputs-border-width); */
    /* border: 0.1rem solid transparent; */
    border-radius: var(--inputs-radius);
    box-shadow: 0 0 0 var(--inputs-border-width)
      rgba(var(--color-foreground), var(--inputs-border-opacity));
    transition: box-shadow var(--duration-short) ease;
    z-index: 80000000;
  }

  .select__select {
    font-family: var(--font-body-family);
    font-style: var(--font-body-style);
    font-weight: var(--font-body-weight);
    font-size: 0.8rem;
    text-transform: uppercase;
    color: rgba(var(--color-foreground), 0.75);
  }

  .field:hover.field:after,
  .select:hover.select:after,
  .select__select:hover.select__select:after,
  .customer .field:hover.field:after,
  .customer select:hover.select:after,
  .localization-form__select:hover.localization-form__select:after {
    box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width))
      rgba(var(--color-foreground), var(--inputs-border-opacity));
    outline: 0;
    border-radius: var(--inputs-radius);
  }

  .field__input:focus-visible,
  .select__select:focus-visible,
  .customer .field input:focus-visible,
  .customer select:focus-visible,
  .localization-form__select:focus-visible.localization-form__select:after {
    box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width))
      rgba(var(--color-foreground));
    outline: 0;
    border-radius: var(--inputs-radius);
  }

  .field__input:focus,
  .select__select:focus,
  .customer .field input:focus,
  .customer select:focus,
  .localization-form__select:focus.localization-form__select:after {
    box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width))
      rgba(var(--color-foreground));
    outline: 0;
    border-radius: 10px;
  }

  .localization-form__select:focus {
    outline: 0;
    box-shadow: none;
    border-radius: 10px;
  }

  .text-area,
  .select {
    display: flex;
    position: relative;
    width: 100%;
  }

  /* Select */

  .select .icon-caret,
  .customer select + svg {
    height: 0.6rem;
    pointer-events: none;
    position: absolute;
    top: calc(50% - 0.2rem);
    left: 3px;
  }

 /* .select__select,
  .customer select {
    cursor: pointer;
    line-height: calc(1 + 0.6 / var(--font-body-scale));
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 19px;
    margin: var(--inputs-border-width);
    min-height: calc(var(--inputs-border-width) * 2);
  }
*/

.select__select,
  .customer select {
    display: block;
    position: relative;
    line-height: calc(1 + 0.6 / var(--font-body-scale));
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 19px;
    margin: var(--inputs-border-width);
    min-height: 2rem;
    z-index: 800; 
  }

  /* Field */

  .field {
    position: relative;
    max-width: 100%;
    margin: auto;
    display: flex;
    transition: box-shadow var(--duration-short) ease;
  }

  .customer .field {
    display: flex;
  }

  .field--with-error {
    flex-wrap: wrap;
  }

  .field__input,
  .customer .field input {
    flex-grow: 1;
    text-align: left;
    font-size: 0.9rem;
    display: block;
    position: relative;
  /*  background-color: #fff; */
    padding: 0.5rem;
    margin: var(--inputs-border-width);
    transition: box-shadow var(--duration-short) ease;
  }

  .field__label,
  .customer .field label {
    font-size: 0.9rem;
   /* left: calc(var(--inputs-border-width) + 0.5rem); */
    left: 0.2rem;
    top: calc(var(--inputs-border-width) + 0.5rem);
    pointer-events: none;
    position: absolute;
    transition: top var(--duration-short) ease,
      font-size var(--duration-short) ease;
    color: rgba(var(--color-foreground), 0.75);
    letter-spacing: 0rem;
    line-height: 5rem;

    margin-top: 0rem;
  }

  .field__input:focus ~ .field__label,
  .field__input:not(:placeholder-shown) ~ .field__label,
  .field__input:-webkit-autofill ~ .field__label,
  .customer .field input:focus ~ label,
  .customer .field input:not(:placeholder-shown) ~ label,
  .customer .field input:-webkit-autofill ~ label {
    font-size: 0.9rem;
    top: calc(var(--inputs-border-width) + 0.5rem);
   /* left: calc(var(--inputs-border-width) + 0.5rem); */
    left: 0.2rem;
    letter-spacing: 0rem;
  }

  .field__input:focus,
  .field__input:not(:placeholder-shown),
  .field__input:-webkit-autofill,
  .customer .field input:focus,
  .customer .field input:not(:placeholder-shown),
  .customer .field input:-webkit-autofill {
    margin: var(--inputs-border-width);
  }

  .field__input::-webkit-search-cancel-button,
  .customer .field input::-webkit-search-cancel-button {
    display: none;
  }

  .field__input::placeholder,
  .customer .field input::placeholder {
    opacity: 0;
  }

  .field__button {
    align-items: center;
    background-color: transparent;
    border: 0;
    color: currentColor;
    cursor: pointer;
    display: flex;
    height: 4.4rem;
    justify-content: center;
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 4.4rem;
  
  }

  .field__button > svg {
    height: 2.5rem;
    width: 2.5rem;
  }

  .field__input:-webkit-autofill ~ .field__button,
  .field__input:-webkit-autofill ~ .field__label,
  .customer .field input:-webkit-autofill ~ label {
    color: rgb(0, 0, 0);
  }

  /* Text area */

  .text-area {
    font-family: var(--font-body-family);
    font-style: var(--font-body-style);
    font-weight: var(--font-body-weight);
    min-height: 10rem;
    resize: none;
    z-index: 1;
  }

  input[type="checkbox"] {
    display: inline-block;
    width: auto;
    margin-right: 0.5rem;
  }

  /* Form global */

  .form__label {
    display: block;
    margin-bottom: 0.6rem;
  }

  .form__message {
    align-items: center;
    display: flex;
    font-size: 1rem;
    line-height: 1;
    margin-top: 1rem;
  }

  .form__message--large {
    font-size: 1rem;
  }

  .customer .field .form__message {
    font-size: 1rem;
    text-align: left;
  }

  .form__message .icon,
  .customer .form__message svg {
    flex-shrink: 0;
    height: 1.3rem;
    margin-right: 0.5rem;
    width: 1.3rem;
  }

  .form__message--large .icon,
  .customer .form__message svg {
    height: 1.5rem;
    width: 1.5rem;
    margin-right: 1rem;
  }

  .customer .field .form__message svg {
    align-self: start;
  }

  .form-status {
    margin: 0;
    font-size: 1rem;
  }

  .form-status-list {
    padding: 0;
    margin: 2rem 0 4rem;
  }

  .form-status-list li {
    list-style-position: inside;
  }

  .form-status-list .link::first-letter {
    text-transform: capitalize;
  }

  /* component-quantity */
  .quantity {
    color: rgba(var(--color-foreground));
    position: relative;
    width: calc(
      14rem / var(--font-body-scale) + var(--inputs-border-width) * 2
    );
    display: flex;
    border-radius: var(--inputs-radius);
    min-height: calc((var(--inputs-border-width) * 2) + 4.5rem);
  }

  .quantity:after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: var(--inputs-border-width);
    right: var(--inputs-border-width);
    bottom: var(--inputs-border-width);
    left: var(--inputs-border-width);
    border: 0.1rem solid transparent;
    border-radius: var(--inputs-radius);
    box-shadow: 0 0 0 var(--inputs-border-width)
      rgba(var(--color-foreground), var(--inputs-border-opacity));
    transition: box-shadow var(--duration-short) ease;
    z-index: 1;
  }

  .quantity:before {
    background: rgb(var(--color-background));
    pointer-events: none;
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: var(--inputs-radius-outset);
    box-shadow: var(--inputs-shadow-horizontal-offset)
      var(--inputs-shadow-vertical-offset) var(--inputs-shadow-blur-radius)
      rgba(var(--color-shadow), var(--inputs-shadow-opacity));
    z-index: -1;
  }

  .quantity__input {
    color: currentColor;
    font-size: 1rem;
    font-weight: 500;
    opacity: 0.85;
    text-align: center;
    background-color: transparent;
    border: 0;
    padding: 0 0.5rem;
    width: 100%;
    flex-grow: 1;
    -webkit-appearance: none;
    appearance: none;
  }

  .quantity__button {
    width: calc(4.5rem / var(--font-body-scale));
    flex-shrink: 0;
    font-size: 1rem;
    border: 0;
    background-color: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(var(--color-foreground));
    padding: 0;
  }

  .quantity__button:first-child {
    margin-left: calc(var(--inputs-border-width));
  }

  .quantity__button:last-child {
    margin-right: calc(var(--inputs-border-width));
  }

  .quantity__button svg {
    width: 1rem;
    pointer-events: none;
  }

  .quantity__button:focus-visible,
  .quantity__input:focus-visible {
    background-color: rgb(var(--color-background));
    z-index: 2;
  }

  .quantity__button:focus,
  .quantity__input:focus {
    background-color: rgb(var(--color-background));
    z-index: 2;
  }

  .quantity__button:not(:focus-visible):not(.focused),
  .quantity__input:not(:focus-visible):not(.focused) {
    box-shadow: inherit;
    background-color: inherit;
  }

  .quantity__input:-webkit-autofill,
  .quantity__input:-webkit-autofill:hover,
  .quantity__input:-webkit-autofill:active {
    box-shadow: 0 0 0 10rem rgb(var(--color-background)) inset !important;
    -webkit-box-shadow: 0 0 0 10rem rgb(var(--color-background)) inset !important;
  }

  .quantity__input::-webkit-outer-spin-button,
  .quantity__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .quantity__input[type="number"] {
    -moz-appearance: textfield;
  }

  .quantity__rules {
    margin-top: 1.2rem;
    position: relative;
    font-size: 1rem;
  }

  .quantity__rules .caption {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
  }

  .quantity__rules .divider + .divider::before {
    content: "\2022";
    margin: 0 0.5rem;
  }

  .quantity__rules-cart {
    position: relative;
  }

  product-info .loading-overlay:not(.hidden) ~ *,
  .quantity__rules-cart .loading-overlay:not(.hidden) ~ * {
    visibility: hidden;
  }

  /* component-modal */
  .modal__toggle {
    list-style-type: none;
  }

  .no-js details[open] .modal__toggle {
    position: absolute;
    z-index: 5;
  }

  .modal__toggle-close {
    display: none;
  }

  .no-js details[open] svg.modal__toggle-close {
    display: flex;
    z-index: 1;
    height: 1.7rem;
    width: 1.7rem;
  }

  .modal__toggle-open {
    display: flex;
  }

  .no-js details[open] .modal__toggle-open {
    display: none;
  }

  .no-js .modal__close-button.link {
    display: none;
  }

  .modal__close-button.link {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0rem;
    height: 4.4rem;
    width: 4.4rem;
    background-color: transparent;
  }

  .modal__close-button .icon {
    width: 1.7rem;
    height: 1.7rem;
  }

  .modal__content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(var(--color-background));
    z-index: 4;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .media-modal {
    cursor: zoom-out;
  }

  .media-modal .deferred-media {
    cursor: initial;
  }

  /* component-cart-count-bubble */
  .cart-count-bubble:empty {
    display: none;
  }

  .cart-count-bubble {
    background-color: rgb(var(--color-button));
    color: rgb(var(--color-button-text));
    height: 1.7rem;
    width: 1.2rem;
    border-radius: 100%;
    display: inline;
    align-items: center;
    bottom: 0.8rem;
    left: 2.2rem;
    line-height: calc(1 + 0.1 / var(--font-body-scale));
  }

  /* utility-bar */
  .utility-bar {
    height: 100%;
  }

  .utility-bar--bottom-border {
    border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
  }

  @media screen and (min-width: 990px) {
    .utility-bar--bottom-border-social-only {
      border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
    }
  }

  .utility-bar__grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "announcements";
  }

  .utility-bar__grid .list-social {
    justify-content: flex-start;
    align-content: center;
    margin-left: 0rem;
    grid-area: social-icons;
  }

  @media screen and (max-width: 989px) {
    .utility-bar .utility-bar__grid .list-social {
      display: none;
    }
  }

  .utility-bar .list-social__item .icon {
    scale: 0.9;
  }

  @media screen and (min-width: 990px) {
    .utility-bar__grid--3-col {
      grid-template-columns: 3fr 4fr 3fr;
      grid-template-areas: "social-icons announcements language-currency";
    }

    .utility-bar__grid--2-col {
      grid-template-columns: 1fr 1fr;
      grid-template-areas: "social-icons language-currency";
    }

    .announcement-bar.announcement-bar--one-announcement,
    .announcement-bar--one-announcement .announcement-bar__link {
      width: fit-content;
      margin: auto;
    }
  }

  .announcement-bar,
  .announcement-bar__announcement {
    color: rgb(var(--color-foreground));
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-content: center;
    grid-area: announcements;
  }

  .announcement-bar .slider--everywhere {
    margin-bottom: 0;
    scroll-behavior: auto;
  }

  .utility-bar__grid .announcement-bar-slider {
    width: 100%;
  }

  .utility-bar__grid .announcement-bar-slider {
    width: 100%;
  }

  .announcement-bar-slider,
  .announcement-bar-slider .slider {
    width: 100%;
  }

  .announcement-bar .slider-button--next {
    margin-right: -1.5rem;
    min-width: 44px;
  }

  .announcement-bar .slider-button--prev {
    margin-left: -1.5rem;
    min-width: 44px;
  }

  .announcement-bar .slider-button--next:focus-visible,
  .announcement-bar .slider-button--prev:focus-visible,
  .utility-bar .list-social__link:focus-visible {
    outline-offset: -0.3rem;
    box-shadow: 0 0 0 -0.2rem rgb(var(--color-foreground));
  }

  .localization-wrapper {
    grid-area: language-currency;
    align-self: center;
    display: flex;
    justify-content: flex-end;
  }

  .localization-wrapper .localization-selector + .disclosure__list-wrapper {
    animation: animateMenuOpen var(--duration-default) ease;
  }

  .utility-bar .localization-wrapper .disclosure .localization-form__select,
  .utility-bar .localization-wrapper .disclosure__link {
    font-size: calc(var(--font-heading-scale) * 1rem);
  }

  @media screen and (min-width: 990px) {
    body:has(.section-header .header:not(.drawer-menu))
      .utility-bar
      .page-width {
      padding-left: 0rem;
      padding-right: 0rem;
    }

    .announcement-bar-slider {
      width: 60%;
    }

    .announcement-bar .slider-button {
      height: 3.8rem;
    }
  }

  .announcement-bar__link {
    display: flex;
    width: 100%;
    text-decoration: none;
    height: 100%;
    justify-content: center;
    align-items: center;
  }

  .announcement-bar__link:hover {
    text-decoration: underline;
  }

  .announcement-bar__link .icon-arrow {
    display: inline-block;
    pointer-events: none;
    margin-left: 0.8rem;
    vertical-align: middle;
    margin-bottom: 0.2rem;
  }

  .announcement-bar__message {
    text-align: center;
    padding: 1rem 0;
    margin: 0;
    letter-spacing: 0.1rem;
    min-height: 3.8rem;
  }

  .announcement-bar-slider--fade-in-next .announcement-bar__message,
  .announcement-bar-slider--fade-in-previous .announcement-bar__message,
  .announcement-bar-slider--fade-out-next .announcement-bar__message,
  .announcement-bar-slider--fade-out-previous .announcement-bar__message {
    animation-duration: var(--duration-announcement-bar);
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
  }

  .announcement-bar-slider--fade-in-next .announcement-bar__message {
    --announcement-translate-from: -1.5rem;
    /* Prevent flicker */
    opacity: 0;
    animation-name: translateAnnouncementSlideIn;
    animation-delay: var(--duration-announcement-bar);
  }

  .announcement-bar-slider--fade-in-previous .announcement-bar__message {
    --announcement-translate-from: 1.5rem;
    /* Prevent flicker */
    opacity: 0;
    animation-name: translateAnnouncementSlideIn;
    animation-delay: var(--duration-announcement-bar);
  }

  .announcement-bar-slider--fade-out-next .announcement-bar__message {
    --announcement-translate-to: 1.5rem;
    animation-name: translateAnnouncementSlideOut;
  }

  .announcement-bar-slider--fade-out-previous .announcement-bar__message {
    --announcement-translate-to: -1.5rem;
    animation-name: translateAnnouncementSlideOut;
  }

  @keyframes translateAnnouncementSlideIn {
    0% {
      opacity: 0;
      transform: translateX(var(--announcement-translate-from));
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @keyframes translateAnnouncementSlideOut {
    0% {
      opacity: 1;
      transform: translateX(0);
    }
    100% {
      opacity: 0;
      transform: translateX(var(--announcement-translate-to));
    }
  }

  /* section-header */
  .section-header.shopify-section-group-header-group {
    z-index: 1000;
  }

  .shopify-section-header-sticky {
    position: grid;
    top: 0;
  }

  .shopify-section-header-hidden {
    top: calc(-1 * var(--header-height));
  }

  .shopify-section-header-hidden.menu-open {
    top: 0;
  }

  .shopify-section-group-header-group {
    z-index: 1000;
  }

  .section-header ~ .shopify-section-group-header-group {
    z-index: 1000;
  }

  /* Main Header Layout */
  .header-wrapper {
    display: grid;
    width: 100%;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    margin-top: 0rem;
    position: fixed;
    background-color: rgb(var(--color-background));
  }

  .header-wrapper--border-bottom {
    border-bottom: 0rem solid rgba(var(--color-foreground), 0);
  }

  .header {
    display: grid;
    width: 100%;
    padding-left: 0rem;
    grid-template-areas: "left-icons heading icons";
    grid-template-columns: 1fr auto 1fr;
    align-items: end;
    justify-content: center;
    margin-top: 1.5rem;
  }

  @media screen and (max-width: 749px) {
    .header--has-app {
      grid-template-columns: auto;
      width: 100%;
      padding-left: 0rem;
      grid-template-columns: 1fr auto 1fr;
      justify-content: center;
      align-items: end;
    }
  }

  @media screen and (min-width: 750px) {
    .header--has-app {
      display: grid;
      width: 100%;
      padding-left: 0rem;
      grid-template-areas: "left-icons heading icons";
      grid-template-columns: 1fr auto 1fr;
      align-items: center; /* adjusted from end to center 9 May */
      justify-content: center;
      margin-top: 1.5rem;

      /* grid-template-columns: auto; 
      width: 100%;
      padding-left: 0rem;
      grid-template-columns: auto 1fr auto;
      justify-content: center;
      align-items: end; */
    }
  }

  @media screen and (min-width: 990px) {
    .header {
      display: grid;
      width: 100%;
      padding-left: 0rem;
      grid-template-areas: "left-icons heading icons";
      grid-template-columns: 1fr auto 1fr;
      align-items: center; /* adjusted from nothing which was defaulting to end to statement of center 9 May */
      justify-content: center;
      margin-top: 1.5rem;

      /* grid-template-columns: auto; 
      width: 100%;
      grid-template-columns: 1fr auto 1fr;
      align-items: end;
      justify-content: center; */
    }

    .header--top-left,
    .header--middle-left:not(.header--has-menu) {
      grid-template-areas:
        "heading icons"
        "navigation navigation";
      grid-template-columns: 1fr auto;
      padding-left: 0rem;
    }

    .header--top-left.drawer-menu,
    .header--middle-left.drawer-menu {
      grid-template-areas: "navigation heading icons";
      grid-template-columns: auto 1fr auto;
      /****/
      column-gap: 0rem;
      text-align: left;
      padding-left: 0rem; /****/
      column-gap: 1rem;
    }

    .header--middle-left {
      grid-template-areas: "heading navigation icons";
      /* grid-template-columns: 1fr auto 1fr;
    column-gap: 0rem;
    padding-left: 0rem; */
      grid-template-columns: auto auto 1fr;
      column-gap: 2rem;
    }

    .header--middle-center:not(.drawer-menu) {
      grid-template-areas: "navigation heading icons";
      grid-template-columns: 1fr auto 1fr;
      column-gap: 0rem;
      align-content: center;
      padding-left: 0rem;
      /* column-gap: 2rem; */
    margin-top: 1rem;
    }

    .header--middle-center a.header__heading-link {
      text-align: center;
      align-content: center;
    }

    .header--top-center {
      grid-template-areas:
        "left-icons heading icons"
        "navigation navigation navigation";
      align-content: center;
    }

    .header--top-center.drawer-menu {
      grid-template-areas: "left-icons heading icons";
      grid-template-columns: 1fr auto 1fr;
    }

    .header:not(.header--middle-left, .header--middle-center)
      .header__inline-menu {
      margin-top: 0rem;
    }
  }

  .header *[tabindex="-1"]:focus {
    outline: none;
  }

  .header__heading {
    margin: 0;
    line-height: 0;
  }

  .header > .header__heading-link {
    line-height: 0;
  }

  .header__heading,
  .header__heading-link {
    grid-area: heading;
    justify-self: center;
    
  }

  .header__heading-link {
    display: inline-block;
    align-content: center;
    padding: 0rem;
    text-decoration: none;
    word-break: break-word;
  }

  .header__heading-link:hover .h2 {
    color: rgb(var(--color-foreground));
  }

  .header__heading-link .h2 {
    line-height: 1;
    color: rgba(var(--color-foreground), 0.75);
  }

  .header__heading-logo {
    height: auto;
    max-width: 100%;
  }

  .header__heading-logo-wrapper {
    width: 100%;
    display: inline-block;
    align-content: center;
    transition: width 0.3s cubic-bezier(0.52, 0, 0.61, 0.99);
  }

  @media screen and (max-width: 989px) {
    .header__heading,
    .header__heading-link {
      text-align: center;
      justify-content: center;
      align-content: center;
    }

    .header--mobile-left .header__heading,
    .header--mobile-left .header__heading-link {
      text-align: left;
      justify-self: start;
    }

    .header--mobile-left {
      /*grid-template-columns: auto auto auto;*/
      grid-template-columns: auto 2fr 1fr;
    }
  }

  @media screen and (min-width: 990px) {
    .header--middle-left .header__heading-link,
    .header--top-left .header__heading-link {
      margin-left: -0.75rem;
    }

    .header__heading,
    .header__heading-link {
      justify-self: start;
      align-content: center;
    }

    .header--middle-center .header__heading-link,
    .header--middle-center .header__heading {
      justify-self: center;
      text-align: center;
    }

    .header--top-center .header__heading-link,
    .header--top-center .header__heading {
      justify-self: center;
      text-align: center;
    }
  }

  /* Header icons */
  .header__icons {
    display: flex;
    grid-area: icons;
    justify-self: end;
    padding-right: 0.5rem;
    /* margin-top: 1rem; */
    /* padding-top: 0rem; */
    align-items: stretch;
    align-content: space-around;
  }

  .header__icons .shopify-app-block {
    max-width: 1.9rem;
    max-height: 3rem;
    overflow: hidden;
  }

  .header__icon:not(.header__icon--summary),
  .header__icon span {
    display: flex;
    /* left-padding: 0rem; */
    align-items: center;
    justify-content: center;
    
  }

  .header__icon {
    color: rgb(var(--color-foreground));
  }

  .header__icon span {
    height: 100%;
  }

  .header__icon::after {
    content: none;
  }

  .header__icon:hover .icon,
  .modal__close-button:hover .icon {
    transform: scale(1.07);
    color: #ff0030;
  }

  .header__icon .icon {
    height: 0.7rem;
    width: 2rem;
    fill: none;
    vertical-align: middle;
    padding-top: 0rem;
  }

  .header__icon,
  .header__icon--cart .icon {
    height: 1rem;
    width: 3rem;
  }

  .header__icon--cart:hover {
    color: #ff0030;
  }

  .header__icon--cart {
    position: relative;
  }

  .header__icon--menu[aria-expanded="true"]::before {
    content: "";
    top: 100%;
    left: 0;
    height: calc(
      var(--viewport-height, 100vh) - (var(--header-bottom-position, 100%))
    );
    width: 100%;
    display: block;
    position: absolute;
    background: rgba(var(--color-foreground), 0.5);
  }

  /* Search */
  menu-drawer + .header__search {
    display: none;
  }

  .header > .header__search {
    grid-area: left-icons;
    justify-self: start;
  }

  .header--top-center.drawer-menu > .header__search {
    margin-left: 1.2rem;
  }

  .header--top-center header-drawer {
    grid-area: left-icons;
  }

  .header:not(.header--has-menu) * > .header__search {
    display: none;
  }

  .header__search {
    display: inline-flex;
    line-height: 0;
  }

  .header--top-center > .header__search {
    display: none;
  }

  .header--top-center * > .header__search {
    display: inline-flex;
  }

  @media screen and (min-width: 990px) {
    .header:not(.header--top-center) * > .header__search,
    .header--top-center > .header__search {
      display: inline-flex;
    }

    .header:not(.header--top-center) > .header__search,
    .header--top-center * > .header__search {
      display: none;
    }
  }

  .no-js .predictive-search {
    display: none;
  }

  details[open] > .search-modal {
    opacity: 1;
    animation: animateMenuOpen var(--duration-default) ease;
  }

  details[open] .modal-overlay {
    display: block;
  }

  details[open] .modal-overlay::after {
    position: absolute;
    content: "";
    background-color: rgb(var(--color-foreground), 0.5);
    top: 100%;
    left: 0;
    right: 0;
    height: 100vh;
  }

  .no-js details[open] > .header__icon--search {
    top: 1rem;
    right: 0.5rem;
  }

  .search-modal {
    opacity: 0;
    border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.08);
    min-height: calc(
      100% + var(--inputs-margin-offset) + (2 * var(--inputs-border-width))
    );
    height: 100%;
  }

  .search-modal__content {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0 5rem 0 1rem;
    line-height: calc(1 + 0.8 / var(--font-body-scale));
    position: relative;
  }

  .search-modal__content-bottom {
    bottom: calc((var(--inputs-margin-offset) / 2));
  }

  .search-modal__content-top {
    top: calc((var(--inputs-margin-offset) / 2));
  }

  .search-modal__form {
    width: 100%;
  }

  .search-modal__close-button {
    position: absolute;
    right: 0.3rem;
  }

  @media screen and (min-width: 750px) {
    .search-modal__close-button {
      right: 1rem;
    }

    .search-modal__content {
      padding: 0 6rem;
    }
  }

  @media screen and (min-width: 990px) {
    .search-modal__form {
      max-width: 74.2rem;
    }

    .search-modal__close-button {
      position: initial;
      margin-left: 0.5rem;
    }
  }

  /* Header menu drawer */
  .header__icon--menu .icon {
    display: block;
    position: fixed;
    opacity: 100;
    transform: scale(1);
    transition: transform 150ms ease, opacity 150ms ease;
  }

  details:not([open]) > .header__icon--menu .icon-close,
  details[open] > .header__icon--menu .icon-hamburger {
    visibility: hidden;
    opacity: 0;
    transform: scale(0.8);
  }

  .js details[open]:not(.menu-opening) > .header__icon--menu .icon-close {
    visibility: hidden;
  }

  .js details[open]:not(.menu-opening) > .header__icon--menu .icon-hamburger {
    visibility: visible;
    opacity: 1;
    transform: scale(1.07);
  }

  .js details > .header__submenu {
    opacity: 1;
    transform: translateY(-1.5rem);
  }

  details[open] > .header__submenu {
    animation: animateMenuOpen var(--duration-default) ease;
    animation-fill-mode: forwards;
    z-index: 1;
  }

  @media (prefers-reduced-motion) {
    details[open] > .header__submenu {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* Header menu */
  .header__inline-menu {
    margin-left: 0rem;
    grid-area: navigation;
    display: none;
    align-content: center;
  }

  .header--top-center .header__inline-menu,
  .header--top-center .header__heading-link {
    margin-left: 0rem;
  }

  @media screen and (min-width: 990px) {
    .header__inline-menu {
      display: block;
      /*  padding-left: 0.rem */
    }

    .header--top-center .header__inline-menu {
      justify-self: center;
      align-content: center;
    }

    .header--top-center .header__inline-menu > .list-menu--inline {
      justify-content: center;
    }

    .header--middle-left .header__inline-menu {
      margin-left: 0;
    }
  }

  .header__menu {
    padding: 0 0rem;
  }

  .header__menu-item {
    padding: 0.5rem;
    text-decoration: none;
    color: rgba(var(--color-foreground), 0.75);
  }

  .header__menu-item:hover {
    color: #ff0030;
  }

  .header__menu-item span {
    transition: text-decoration var(--duration-short) ease;
  }

  .header__menu-item:hover span {
    text-decoration: underline;
    text-underline-offset: 0.3rem;
  }

  details[open] > .header__menu-item {
    text-decoration: underline;
  }

  details[open]:hover > .header__menu-item {
    text-decoration-thickness: 0.1rem;
  }

  details[open] > .header__menu-item .icon-caret {
    transform: rotate(180deg);
  }

  .header__active-menu-item {
    transition: text-decoration-thickness var(--duration-short) ease;
    color: rgb(var(--color-foreground));
    text-decoration: underline;
    text-underline-offset: 0.3rem;
  }

  .header__menu-item:hover .header__active-menu-item {
    text-decoration-thickness: 0.1rem;
  }

  .header__submenu {
    transition: opacity var(--duration-default) ease,
      transform var(--duration-default) ease;
  }

  .global-settings-popup,
  .header__submenu.global-settings-popup {
    border-radius: var(--popup-corner-radius);
    border-color: rgba(var(--color-foreground), var(--popup-border-opacity));
    /* border-style: solid; */
    border-width: var(--popup-border-width);
    box-shadow: var(--popup-shadow-horizontal-offset)
      var(--popup-shadow-vertical-offset) var(--popup-shadow-blur-radius)
      rgba(var(--color-shadow), var(--popup-shadow-opacity));
    z-index: -1;
  }

  .header__submenu.list-menu {
    padding: 0;
  }

  .header__submenu .header__submenu {
    background-color: rgba(var(--color-foreground), 0.03);
    padding: 0rem 0;
    margin: 0rem 0;
  }

  .header__submenu .header__menu-item:after {
    right: 0rem;
  }

  .header__submenu .header__menu-item {
    justify-content: space-between;
    /*padding: 0.8rem 2rem;*/
    align-content: left;
  }

  .header__submenu .header__menu-item:hover {
    text-decoration-line: underline;
  }

  .header__menu-item .icon-caret {
    right: 0.8rem;
  }

  .header__submenu .icon-caret {
    flex-shrink: 0;
    margin-left: 1rem;
    position: static;
  }

  .header__search {
    display: none !important;
  }

  header-menu > details,
  details-disclosure > details {
    position: relative;
  }

  @keyframes animateMenuOpen {
    0% {
      opacity: 0;
      transform: translateY(-1.5rem);
    }

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

  .overflow-hidden-mobile,
  .overflow-hidden-tablet,
  .overflow-hidden-desktop {
    overflow: hidden;
  }

  @media screen and (min-width: 750px) {
    .overflow-hidden-mobile {
      overflow: auto;
    }
  }

  @media screen and (min-width: 990px) {
    .overflow-hidden-tablet {
      overflow: auto;
    }
  }

  .badge {
    /* border: 1px solid transparent; 
  border-radius: var(--badge-corner-radius); */
    display: inline-block;
    font-size: 1rem;
    /* letter-spacing: 0.1rem; */
    /* line-height: 1; */
   /* padding-left: 1rem; removed 9 May 15:22 */
    text-align: center;
    background-color: rgb(var(--color-badge-background));
    border-color: rgba(var(--color-badge-border), var(--alpha-badge-border));
    color: rgb(var(--color-badge-foreground));
    word-break: break-word;
  }

  .gradient {
    background: rgb(var(--color-background));
    background: var(--gradient-background);
    background-attachment: fixed;
  }

  @media screen and (forced-colors: active) {
    .icon {
      color: CanvasText;
      fill: CanvasText !important;
    }

    .icon-close-small path {
      stroke: CanvasText;
    }
  }

  .ratio {
    display: flex;
    position: relative;
    align-items: stretch;
  }

  .ratio::before {
    content: "";
    width: 0;
    height: 0;
    padding-bottom: var(--ratio-percent);
  }

  .content-container {
    border-radius: var(--text-boxes-radius);
    border: var(--text-boxes-border-width) solid
      rgba(var(--color-foreground), var(--text-boxes-border-opacity));
    position: relative;
  }

  .content-container:after {
    content: "";
    position: absolute;
    top: calc(var(--text-boxes-border-width) * -1);
    right: calc(var(--text-boxes-border-width) * -1);
    bottom: calc(var(--text-boxes-border-width) * -1);
    left: calc(var(--text-boxes-border-width) * -1);
    border-radius: var(--text-boxes-radius);
    box-shadow: var(--text-boxes-shadow-horizontal-offset)
      var(--text-boxes-shadow-vertical-offset)
      var(--text-boxes-shadow-blur-radius)
      rgba(var(--color-shadow), var(--text-boxes-shadow-opacity));
    z-index: -1;
  }

  .content-container--full-width:after {
    left: 0;
    right: 0;
    border-radius: 0;
  }

  @media screen and (max-width: 749px) {
    .content-container--full-width-mobile {
      border-left: none;
      border-right: none;
      border-radius: 0;
    }
    .content-container--full-width-mobile:after {
      display: none;
    }
  }

  .global-media-settings {
    position: relative;
    border: var(--media-border-width) solid
      rgba(var(--color-foreground), var(--media-border-opacity));
    border-radius: var(--media-radius);
    overflow: visible !important;
    background-color: rgb(var(--color-background));
  }

  .global-media-settings:after {
    content: "";
    position: absolute;
    top: calc(var(--media-border-width) * -1);
    right: calc(var(--media-border-width) * -1);
    bottom: calc(var(--media-border-width) * -1);
    left: calc(var(--media-border-width) * -1);
    border-radius: var(--media-radius);
    box-shadow: var(--media-shadow-horizontal-offset)
      var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius)
      rgba(var(--color-shadow), var(--media-shadow-opacity));
    z-index: -1;
    pointer-events: none;
  }

  .global-media-settings--no-shadow {
    overflow: hidden !important;
  }

  .global-media-settings--no-shadow:after {
    content: none;
  }

  .global-media-settings img,
  .global-media-settings iframe,
  .global-media-settings model-viewer,
  .global-media-settings video,
  .global-media-settings .placeholder-svg {
    border-radius: calc(var(--media-radius) - var(--media-border-width));
  }

  .content-container--full-width,
  .global-media-settings--full-width,
  .global-media-settings--full-width img,
  .global-media-settings--full-width video,
  .global-media-settings--full-width iframe,
  .global-media-settings--full-width .placeholder-svg {
    border-radius: 0;
    border-left: none;
    border-right: none;
  }

  /* check for flexbox gap in older Safari versions */
  @supports not (inset: 10px) {
    .grid {
      margin-left: calc(-1 * var(--grid-mobile-horizontal-spacing));
    }

    .grid__item {
      padding-left: var(--grid-mobile-horizontal-spacing);
      padding-bottom: var(--grid-mobile-vertical-spacing);
    }

    @media screen and (min-width: 750px) {
      .grid {
        margin-left: calc(0 * var(--grid-desktop-horizontal-spacing));
      }

      .grid__item {
        padding-left: var(--grid-desktop-horizontal-spacing);
        padding-bottom: var(--grid-desktop-vertical-spacing);
      }
    }

    .grid--gapless .grid__item {
      padding-left: 0;
      padding-bottom: 0;
    }

    @media screen and (min-width: 749px) {
      .grid--peek .grid__item {
        padding-left: var(--grid-mobile-horizontal-spacing);
      }
    }

    .product-grid .grid__item {
      padding-bottom: var(--grid-mobile-vertical-spacing);
    }

    @media screen and (min-width: 750px) {
      .product-grid .grid__item {
        padding-bottom: var(--grid-desktop-vertical-spacing);
      }
    }
  }

  .font-body-bold {
    font-weight: var(--font-body-weight-bold);
  }

  /* outline and border styling for Windows High Contrast Mode */
  @media (forced-colors: active) {
    .button,
    .shopify-challenge__button,
    .customer button {
      border: transparent solid 1px;
    }

    .button:focus-visible,
    .button:focus,
    .button.focused,
    .shopify-payment-button__button--unbranded:focus-visible,
    .shopify-payment-button [role="button"]:focus-visible,
    .shopify-payment-button__button--unbranded:focus,
    .shopify-payment-button [role="button"]:focus {
      outline: solid transparent 1px;
    }

    .field__input:focus,
    .select__select:focus,
    .customer .field input:focus,
    .customer select:focus,
    .localization-form__select:focus.localization-form__select:after {
      outline: transparent solid 1px;
    }

    .localization-form__select:focus {
      outline: transparent solid 1px;
    }
  }

  .rte:after {
    clear: both;
    content: "";
    display: block;
    margin-right: 0.5rem;
  }

  .rte > *:first-child {
    margin-top: 0;
    padding-left: 0rem;
  }

  .rte > *:last-child {
    margin-bottom: 0;
    margin-left: 0rem;
    margin-right: 0rem;
  }

  .rte table {
    max-width: none;
    overflow-wrap: break-word;
  }

  @media screen and (min-width: 750px) {
    .rte table td {
      padding-left: 1.2rem;
      padding-right: 1.2rem;
    }
  }

  .rte img {
    height: auto;
    max-width: 100%;
    border: var(--media-border-width) solid
      rgba(var(--color-foreground), var(--media-border-opacity));
    border-radius: var(--media-radius);
    box-shadow: var(--media-shadow-horizontal-offset)
      var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius)
      rgba(var(--color-shadow), var(--media-shadow-opacity));
    margin-bottom: var(--media-shadow-vertical-offset);
  }

  .rte ul,
  .rte ol {
    list-style-position: inside;
    padding-left: 0rem;
  }

  .rte li {
    list-style: inherit;
  }

  .rte li:last-child {
    margin-bottom: 0;
  }

  .rte a {
    color: rgba(var(--color-link), var(--alpha-link));
    text-underline-offset: 0.3rem;
    text-decoration-thickness: 0.03rem;
    transition: text-decoration-thickness var(--duration-short) ease;
  }

  .rte a:hover {
    color: red;
    text-decoration-thickness: 0.1rem;
  }

  .rte blockquote {
    display: inline-flex;
  }

  .rte blockquote > * {
    margin: -0.5rem 0 -0.5rem 0;
  }

  /* Image mask global styles */

  .shape--mask {
    display: block;
    height: 0;
    width: 0;
  }

  .shape--arch {
    clip-path: url("#Shape-Arch");
  }

  .shape--blob {
    clip-path: polygon(var(--shape--blob-1));
  }

  .shape--chevronleft {
    clip-path: polygon(100% 0%, 85% 50%, 100% 100%, 15% 100%, 0% 50%, 15% 0%);
  }

  .shape--chevronright {
    clip-path: polygon(85% 0%, 100% 50%, 85% 100%, 0% 100%, 15% 50%, 0% 0%);
  }

  .shape--circle {
    clip-path: circle(closest-side);
  }

  .shape--diamond {
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  }

  .shape--parallelogram {
    clip-path: polygon(15% 0, 100% 0%, 85% 100%, 0% 100%);
  }

  .shape--round {
    clip-path: ellipse(45% 45% at 50% 50%);
  }

  /* Fixed background */
  .animate--fixed {
    clip-path: inset(0);
  }

  .animate--fixed > img:not(.zoom):not(.deferred-media__poster-button),
  .animate--fixed > svg:not(.zoom):not(.deferred-media__poster-button) {
    position: fixed;
    height: 100vh;
  }

  /* Zoom in image on scroll */
  .animate--zoom-in {
    --zoom-in-ratio: 1;
  }

  .animate--zoom-in > img,
  .animate--zoom-in > svg {
    transition: scale var(--duration-short) linear;
    scale: var(--zoom-in-ratio);
  }

  /* Animations */

  @media (prefers-reduced-motion: no-preference) {
    .animate--ambient > img,
    .animate--ambient > svg {
      animation: animateAmbient 30s linear infinite;
    }

    @keyframes animateAmbient {
      0% {
        transform: rotate(0deg) translateX(1em) rotate(0deg) scale(1.2);
      }
      100% {
        transform: rotate(360deg) translateX(1em) rotate(-360deg) scale(1.2);
      }
    }

    .scroll-trigger.animate--fade-in,
    .scroll-trigger.animate--slide-in {
      opacity: 0.01;
    }

    .scroll-trigger.animate--slide-in {
      transform: translateY(2rem);
    }

    .scroll-trigger:not(.scroll-trigger--offscreen).animate--fade-in {
      opacity: 1;
      animation: var(--animation-fade-in);
    }

    .scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-in {
      animation: var(--animation-slide-in);
      animation-delay: calc(var(--animation-order) * 75ms);
    }

    .scroll-trigger.scroll-trigger--design-mode.animate--fade-in,
    .scroll-trigger.scroll-trigger--design-mode.animate--slide-in,
    .scroll-trigger.scroll-trigger--design-mode .slider,
    .scroll-trigger:not(.scroll-trigger--offscreen).scroll-trigger--cancel {
      opacity: 1;
      animation: none;
      transition: none;
    }

    .scroll-trigger.scroll-trigger--design-mode.animate--slide-in {
      transform: translateY(0);
    }

    @keyframes slideIn {
      from {
        transform: translateY(2rem);
        opacity: 0.01;
      }
      to {
        transform: translateY(0);
        opacity: 1;
      }
    }

    @keyframes fadeIn {
      from {
        opacity: 0.01;
      }
      to {
        opacity: 1;
      }
    }
  }

  /* Element Hovers: Vertical Lift, 3d Lift */

  @media (prefers-reduced-motion: no-preference) and (hover: hover) {
    .animate--hover-3d-lift .card-wrapper .card--card,
    .animate--hover-3d-lift .card-wrapper .card--standard .card__inner,
    .animate--hover-3d-lift .button:not(.button--tertiary),
    .animate--hover-3d-lift .shopify-challenge__button,
    .animate--hover-3d-lift .customer button,
    .animate--hover-3d-lift .shopify-payment-button__button,
    .animate--hover-3d-lift .deferred-media .deferred-media__poster-button {
      transition: transform var(--duration-long) ease,
        box-shadow var(--duration-long) ease;
      transform-origin: center;
    }

    .animate--hover-3d-lift .card-wrapper:hover .card--card,
    .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__inner,
    .animate--hover-3d-lift
      .button:not(.button--tertiary):not([disabled]):hover,
    .animate--hover-3d-lift .shopify-challenge__button:not([disabled]):hover,
    .animate--hover-3d-lift .customer button:not([disabled]):hover,
    .animate--hover-3d-lift .shopify-payment-button__button:hover,
    .animate--hover-3d-lift
      .deferred-media:hover
      .deferred-media__poster-button {
      transition: transform var(--duration-extended) ease,
        box-shadow var(--duration-long) ease; /* Slow the card transition speed while hover is active. */
      transform: rotate(1deg);
      box-shadow: -1rem -1rem 1rem -1rem rgba(0, 0, 0, 0.05),
        1rem 1rem 1rem -1rem rgba(0, 0, 0, 0.05),
        0 0 0.5rem 0 rgba(255, 255, 255, 0),
        0 2rem 3.5rem -2rem rgba(0, 0, 0, 0.5);
    }

    .animate--hover-3d-lift
      .deferred-media:hover
      .deferred-media__poster-button {
      transform: translate(-50%, -50%) scale(1.05); /* Apply a specialized transform to the video play button. */
    }

    .animate--hover-3d-lift .collage__item .card-wrapper:hover .card--card,
    .animate--hover-3d-lift
      .collage__item
      .card-wrapper:hover
      .card--standard
      .card__inner {
      transform: rotate(0.5deg); /* Less intense rotation for collage items. */
    }

    .animate--hover-3d-lift .product-grid .grid__item:hover,
    .animate--hover-3d-lift .collection-list .grid__item:hover,
    .animate--hover-3d-lift .collage__item:hover,
    .animate--hover-3d-lift .blog-articles .article:hover,
    .animate--hover-3d-lift .complementary-slide li:hover {
      z-index: 2; /* Make sure the hovered card is the topmost card. */
    }

    .animate--hover-3d-lift .product-grid {
      isolation: isolate; /* Ensure z-index changes here don't negatively effect other UI stacking. */
    }

    .animate--hover-3d-lift
      .card-wrapper
      .card--shape.card--standard:not(.card--text)
      .card__inner {
      box-shadow: none;
      transition: transform var(--duration-long) ease,
        filter var(--duration-long) ease;
    }

    .animate--hover-3d-lift
      .card-wrapper:hover
      .card--shape.card--standard:not(.card--text)
      .card__inner {
      transition: transform calc(2 * var(--duration-extended)) ease,
        filter var(--duration-long) ease; /* Slow the card transition speed while hover is active. */
      filter: drop-shadow(0rem 2rem 2rem rgba(0, 0, 0, 0.15))
        drop-shadow(0rem 1rem 1rem rgba(0, 0, 0, 0.15));
    }

    .animate--hover-3d-lift .card-wrapper:hover .card--card:after,
    .animate--hover-3d-lift
      .card-wrapper:hover
      .card--standard
      .card__inner:after,
    .animate--hover-3d-lift
      .card-wrapper:hover
      .card--shape.card--standard:not(.card--text)
      .card__inner
      .card__media:before {
      background-image: var(--easter-egg);
      background-size: 250px 250px;
      mix-blend-mode: color-dodge;
      pointer-events: none;
      z-index: 2;
    }

    .animate--hover-3d-lift
      .card-wrapper:hover
      .card--shape.card--standard:not(.card--text)
      .card__inner
      .card__media:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
    }

    .animate--hover-3d-lift .card-wrapper .card--card:before,
    .animate--hover-3d-lift .card-wrapper .card--standard .card__media:after {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      opacity: 0;
      pointer-events: none;
      transition: background-position calc(2 * var(--duration-extended)) ease,
        opacity var(--duration-default) ease;
      mix-blend-mode: overlay;
      background-size: 400% 100%;
      background-position: 90% 0;
      background-repeat: no-repeat;
      background-image: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0) 45%,
        rgba(255, 255, 255, 1) 50%,
        rgba(255, 255, 255, 0) 55%
      );
    }

    .animate--hover-3d-lift .card-wrapper:hover .card--card:before,
    .animate--hover-3d-lift
      .card-wrapper:hover
      .card--standard
      .card__media:after {
      opacity: 0.2;
      transition: background-position 6s ease, opacity var(--duration-long) ease;
      background-position: left;
      z-index: 2;
    }

    .animate--hover-vertical-lift .button:not(.button--tertiary),
    .animate--hover-vertical-lift .shopify-challenge__button,
    .animate--hover-vertical-lift .customer button,
    .animate--hover-vertical-lift .shopify-payment-button__button {
      transition: transform var(--duration-default) var(--ease-out-slow);
    }

    .animate--hover-vertical-lift .card-wrapper .card--card,
    .animate--hover-vertical-lift .card-wrapper .card--standard .card__inner {
      transition: transform var(--duration-medium) var(--ease-out-slow);
    }

    .animate--hover-vertical-lift .card-wrapper:hover .card--card,
    .animate--hover-vertical-lift
      .card-wrapper:hover
      .card--standard
      .card__inner {
      transform: translateY(-0.75rem);
    }

    .animate--hover-vertical-lift .card-wrapper:active .card--card,
    .animate--hover-vertical-lift
      .card-wrapper:active
      .card--standard
      .card__inner {
      transform: translateY(-0.5rem);
    }

    .animate--hover-vertical-lift
      .button:not(.button--tertiary):not([disabled]):hover,
    .animate--hover-vertical-lift
      .shopify-challenge__button:not([disabled]):hover,
    .animate--hover-vertical-lift .customer button:not([disabled]):hover,
    .animate--hover-vertical-lift .shopify-payment-button__button:hover {
      transform: translateY(-0.25rem);
    }

    .animate--hover-vertical-lift
      .button:not(.button--tertiary):not([disabled]):active,
    .animate--hover-vertical-lift
      .shopify-challenge__button:not([disabled]):active,
    .animate--hover-vertical-lift .customer button:not([disabled]):active,
    .animate--hover-vertical-lift .shopify-payment-button__button:active {
      transform: translateY(0);
    }

    .animate--hover-vertical-lift .button:not([disabled]):hover:after,
    .animate--hover-vertical-lift .customer button:not([disabled]):hover:after,
    .animate--hover-vertical-lift
      .shopify-payment-button__button:not([disabled]):hover:after {
      --border-offset: 0.3px; /* Default is 1.3px as defined above in this file. This removes 1px to prevent the border from growing on buttons when this effect is on.  */
      box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset))
          rgba(var(--color-button-text), var(--border-opacity)),
        0 0 0 var(--buttons-border-width)
          rgba(var(--color-button), var(--alpha-button-background));
    }

    .animate--hover-vertical-lift
      .button:not([disabled]).button--secondary:hover:after {
      --border-offset: 0px; /* Prevent the border from growing on buttons when this effect is on. */
    }
  }

  /* Assuming the collection list has a class named '.collection-list' */
  .collection-list {
    padding-left: 0rem; /* Override any existing padding */
  }

  :root {
    --page-width: 100% !important;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  .h0,
  .h1,
  .h2,
  .h3,
  .h4,
  .h5,
  caption {
    font-family: "Sneaky Times" !important;
  }

  .list-menu__item--link {
    text-decoration: none;
    /* padding-bottom: 0.5rem !important; */
    padding-top: 0rem;
    line-height: calc(1 + 0.8 / var(--font-body-scale));
  }

  .list-menu__item--link:hover {
    text-decoration: underline;
    text-underline-offset: 0.3rem;
  }

  /*labels on home page collection photos */
  [id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3"]
    > div
    > div {
    .card__content {
      position: absolute;
      bottom: 30dvh;
      text-align: center;
      text-decoration: none;
    }

    /* series 1 home page collection buttom on photo styling */
    [id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-1"]
      > div
      > div
      > div.card__content
      > div
      > h3
      > a {
      display: inline-block;
      background: #00000042;
      color: #fff;
      font-size: 0.9rem;
      line-height: 1.1em;
      padding: 10px 9px 9px;
      cursor: pointer;
      text-transform: uppercase;
    }

    [id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-1"]
      > div
      > div
      > div.card__content
      > div
      > h3
      > a:hover {
      color: #ff0030;
    }
  }
  /* artisinal home page collection buttom on photo styling */

  [id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-2"]
    > div
    > div
    > div.card__content
    > div
    > h3
    > a {
    display: inline-block;
    background: #00000042;
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.1em;
    padding: 10px 9px 9px;
    cursor: pointer;
    text-transform: uppercase;
  }

  [id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-2"]
    > div
    > div
    > div.card__content
    > div
    > h3
    > a:hover {
    color: #ff0030;
  }

  /* masha popova home page collection buttom on photo styling */
  [id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-3"]
    > div
    > div
    > div.card__content
    > div
    > h3
    > a {
    display: inline-block;
    background: #00000042;
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.1em;
    padding: 10px 9px 9px;
    cursor: pointer;
    text-transform: uppercase;
  }

  [id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-3"]
    > div
    > div
    > div.card__content
    > div
    > h3
    > a:hover {
    color: #ff0030;
  }

  /* add space above footer */

  .section-sections--20009826320724__footer-padding {
    padding-top: 1rem !important;
  }

  [id$="__cart-items"] > cart-items {
    margin-right: 1rem;
    margin-left: 1rem;
    margin-top: 5rem;
    justify-content: center;
  }

  #main-cart-footer > div {
    margin-right: 1rem;
    margin-left: 1rem;
    justify-content: center;
  }

  #main-cart-footer > div > div > div > div.js-contents > p {
    padding-top: 1rem;
    justify-content: center;
  }

  /* hide collection header titles 
  #shopify-section-template--20009825829204__main-collection-banner
    > div
    > div
    > div
    > h1 {
    display: none;
  } 
} edited out 9 May 2024 21:03*/ 

@media screen and (min-width: 750px) html {
  overflow: hidden;
  height: 100%;
  overscroll-behavior: none;
}
body {
  overflow: auto;
  height: 100%;
  overscroll-behavior: none;
}

@media screen and (max-width: 749px) html {
  overflow: hidden;
  height: 100%;
  overscroll-behavior: none;
}
body {
  overflow: auto;
  height: 100%;
  overscroll-behavior: none;
}

#shopify-section-sections--20009826320724__footer > footer {
  padding-top: 0.9rem;
}

/* The space under the header, site-wide. 4rem on every template except the
   homepage, which is a full-bleed entry page and starts flush. Added
   17 Sep 2026: it replaces the per-template padding that used to live in
   rules keyed to live-theme section IDs, which stopped applying in theme
   copies (see CSS-NOTES.md). Sections that want to start flush can set their
   own padding to 0 in the theme editor. */
body:not(.template-index) #MainContent {
  padding-top: 4rem;
}

/* Pages sit 1rem lower than that, which lines their first line of text up
   with the collection and blog pages, where a title block adds the same.
   17 Sep 2026 */
body[data-template^="page"] #MainContent > .shopify-section > .page-width {
  padding-top: 2rem;
}

/* begin: makes footer at bottom of screen and page */

#MainContent {
  min-height: 76vh;
}

@media screen and (min-width: 503px) {
  #MainContent {
    min-height: 95vh;
  }
}

@media screen and (min-width: 899px) {
  #MainContent {
    min-height: 95vh;
  }
}

/* end: makes footer at bottom of screen and page */

/* makes first image on home screen full screen height and doesnt effect cards below/on other pages*/
/*[id^="Slide-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3-1"] > div > div > div.card__inner.ratio{
  height: 100vh !important;
}*/

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009826058580__main > div {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}


/*removed to make search bar centered on page 9 May 15:13 */
/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
/* #shopify-section-template--20009826058580__main > div > div > div {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
} */ 

#HeaderDrawer-index-commissions {
  padding-bottom: 1rem;
}

#shopify-section-sections--20009826320724__footer
  > footer
  > div.footer__content-top.page-width
  > div.footer__blocks-wrapper.grid.grid--1-col.grid--2-col.grid--4-col-tablet
  > div
  > ul {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  margin-right: 1.5rem;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009826058580__main > div {
  margin-top: 3rem;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  margin-bottom: 1rem !important;
}

#main-cart-footer > div > div {
  padding-top: 0.5rem;
}

#main-cart-footer > div > div > div > div.js-contents > div.totals {
  align-items: right !important;
}

#form-container-ref
  > section._inline_whyqz_45
  > section
  > div._gridItem_whyqz_169._gridItemContent_whyqz_254
  > section
  > h2 {
  font-size: 1rem !important;
}

[id^="Slider-"][id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3"] {
  row-gap: 0 !important;
}


#CartItem > td.cart-item__details > a {
  text-decoration-thickness: auto;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825730900__main {
  margin-left: 1rem !important;
  margin-right: 1rem !important;
  padding-bottom: 5rem !important;
}

/* removed when banner added 

#shopify-section-template--20009825763668__newsletter_zYJfVj > div > div {
  margin-left: 1rem !important;
} */

[id$="__video_xVnrMG"] > div > div {
  height: 100vh !important;
}

[id$="__video_xVnrMG"]
  > div
  > div
  > deferred-media {
  height: 100vh !important;
}

[id$="__971fdac1-7dfb-4ef7-a3fd-226ed5d765f3"] {
  margin-left: 0rem !important;
  margin-right: 0rem !important;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825763668__main > div{
  padding-bottom: 5rem;
}


/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825960276__main > div > div > div:nth-child(7) > div{
  min-width: 250px !important;
left: 0 !important;
}


#MainContent > div > div.shopify-policy__title{
  margin-top: 5rem;
}

#MainContent > div > div.shopify-policy__body{
  padding-bottom: 8rem;
}

/*:focus {
  outline: none !important;
}

.shopify-pc__banner__dialog button:focus{
  box-shadow: none !important;
  webkit-box-shadow: none;
}

.shopify-pc__banner__dialog{
  box-shadow: none !important;
  webkit-box-shadow: none;
}
}*/

.rich-text::after {box-shadow: none !important;}
.rich-text {border: none !important;}

#shopify-pc__banner__btn-manage-prefs > span{
  outline: none;
}

#shopify-pc__prefs__dialog > div > div.shopify-pc__prefs__intro {
  font-size: 0.8rem;
  text-transform: uppercase;
}

#shopify-pc__prefs__dialog > div > div.shopify-pc__prefs__options{
font-size: 0.8rem;
  text-transform: uppercase;
}

#shopify-pc__prefs__header-title {
font-size: 0.8rem;
  
}

#shopify-pc__prefs__dialog > header > div{
font-size: 0.8rem;
  text-transform: uppercase;
  
}


#shopify-pc__prefs__preferences > label > span > svg:nth-child(2){
  display: none !important;

}

#shopify-pc__prefs__marketing > label > span > svg:nth-child(2){
  display: none !important;
}

#shopify-pc__prefs__analytics > label > span > svg:nth-child(2){
  display: none !important;
}

#menu-drawer > div > div > div > div > localization-form {
  font-size: 1rem !important;
  
}

body[data-template^="collection"] [id$="__main-collection-product-grid"]{
  padding-bottom: 5rem;
}

/*
#ProductSubmitButton-template--20009826025812__main{
    color: black;
    font: inherit;
    font-style: italic;
  font-size: .9rem;
  
}
*/

.header__icon--search {

display: none;

}

body > pickup-availability-drawer > div > button > span {
  font-family: serif;
  
}

/* removed when announcement banner added

#shopify-section-template--24415116198228__newsletter_zYJfVj > div > div {
  padding-left: 1rem;

  */

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--24415116198228__main > div > h1 {

  margin-left: 0rem !important;
}
  
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--24438083453268__main > article {
  margin-left: 1rem !important;
  margin-right: 1rem !important;
  padding-bottom: 5rem !important;
}

[id$="__video_xVnrMG"] {
      margin-left: 0;
    margin-right: 0;
}

[id^="Banner-"][id$="__image_banner_ynUDMF"] > div.banner__media.media{
  height: 100vh;
}

[id$="__page_W6TKnK"] > div > div {
  padding-left: 0px;
  padding-top: 0px;
  padding-bottom: 5rem;
}

[id$="__multirow_F3eRrP"] > div {
  padding-bottom: 5rem;
  
}



/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825960276__main > div > div{
  padding-bottom: 10rem;

}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825960276__main > div > div > p:nth-child(4) > iframe {
  height: 67vh;
}

body[data-template^="collection"] [id$="__main-collection-banner"] > div > div > div > div > p:nth-child(4) > iframe{
  height: 45vh;
}

[id^="Banner-"][id$="__image_banner_ynUDMF"] > div.banner__media.media > img{
    object-position: top;
  
}

[id$="__rich_text_EwKTU7"] > div > div > div > div > div > a{
      width: 100vw;
    height: 70vh;
    background: none;
    color: transparent;
}


.template-collection,
/* The /collections index, which now uses the same editorial layout. 17 Sep 2026 */
.template-list-collections {
    background: black;
  color: white;
}

#main-collection-filters > div > menu-drawer{
  color: black;
}

#main-collection-filters > div > menu-drawer > details > summary > span.mobile-facets__open{
  color: white;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#ProductInfo-template--24470585672020__main > div:nth-child(7) > product-form {
  padding-top: 2rem;
  
}

.template-product {
    background: black;
  color: white;
}

#ProductGridContainer {padding-bottom: 3rem;}

#MainContent > p{
      margin-top: 5rem;
    text-align-last: center;
    margin-left: 1rem;
    margin-right: 1rem;
}

#customer_login > div.errors{
  display: flex
}

[id$="__rich_text_EwKTU7"] > div > div > div > div > div > a{
  border: none
}

/* Override heart icon size in wishlist header */
.wishlist-hero-header-icon .wlh-svg-icon-heart-empty {
    width: 0.5em !important;
}

/* Alternative selector if the above doesn't work */
.site-header__icon .wlh-svg-Icon.wlh-svg-icon-heart-empty {
    width: 0.5em !important;
}


body > div.MuiDialog-root > div.MuiDialog-container.MuiDialog-scrollPaper > div{
     /* height: 80%; */
    width: 90%;
}

#wishlisthero-product-page-button-container > button{
  padding: 0px !important;
  font-size: small;
}

/* #__next{
  padding-top: 5rem;
} */

#wishlist-hero-shared-list-view > h1{
  padding-left: 0.5rem;
}

#wishlist-hero-shared-list-view{
  padding-bottom: 5rem;
}


#wishlist-hero-price-update{
text-align: left !important;
}

/* Vertically center the header drawer text */

/* Option 1: Using flexbox (recommended) */
.header__icon--menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.header__icon--menu span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.icon-hamburger,
.icon-close {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
}

body > div.MuiDialog-root > div.MuiDialog-container.MuiDialog-scrollPaper > div > div.MuiDialogContent-root.wishlist-hero-share-content.wishlist-hero-dyna-translate.MuiDialogContent-dividers > h6.MuiTypography-root.wishlist-hero-share-txt-link.MuiTypography-h6{
  margin-block-start: 2.33em !important;
}

#shopify-section-sections--20009826353492__header > div > header > div > a.header__icon.header__icon--account.link.focus-inset.small-hide{
width: 0.7rem;
}

#responsive-dialog-title > button{
  top: 0.2em !important;
}

#wishlist-hero-shared-list-view > div.wishlist-hero-page-actions-bar{
  /*padding-left: 1rem; */
  padding-bottom: 1.5rem !important;
}

#wishlist-hero-shared-list-view > div.wishlist-hero-page-actions-bar > span:nth-child(2) > button > span.MuiButton-label > svg{
  height: 0.7rem;
}

#wishlist-hero-shared-list-view > div.wishlist-hero-page-actions-bar > span:nth-child(1) > button > span.MuiButton-label > svg{

    height: 0.7rem;
    /* width: 0.7rem; */

}

#MainContent > section > header > h1{
  padding-left: 1rem;
}


#wishlist-hero-price-update-51937857634644 > span
{
  padding-right: 1rem !important;
}

#wishlist-hero-shared-list-view [id^="wishlist-hero-price-update-"] > span
  {
  padding-right: 1rem !important;
}

#MainContent > section > div.title-wrapper-with-link{
      padding-left: 1rem;
    padding-right: 1rem;
}

#MainContent > section > header{
  padding-top: 5rem;
  margin-top: 0rem;
  margin-bottom: 1rem;
}

#back-link{
  padding-right:1rem;
  color: black;
  font-size: 0.9rem;
}

#back-link:hover{
  color: #ff0030 !important;
}


#wishlist-hero-shared-list-view > div.jss21{
  padding: 0rem;
}

/* Scope to wishlist view, affect every delete button's label */
#wishlist-hero-shared-list-view .wishlist-hero-list-card-footer-delete .MuiIconButton-label,
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-list-card-footer-delete .MuiIconButton-label {
  font-style: italic;
  font-weight: 100;
}

/* Wishlist: set padding on BOTH buttons (Add-to-Cart + Remove) */
#wishlist-hero-shared-list-view .wishlist-hero-list-card-footer .MuiButton-root,
#wishlist-hero-shared-list-view .wishlist-hero-list-card-footer .MuiIconButton-root,
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-list-card-footer .MuiButton-root,
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-list-card-footer .MuiIconButton-root {
  padding: 1rem !important;
}

/* If they’re inside a ButtonGroup, ensure grouped variant doesn’t undo it */
#wishlist-hero-shared-list-card-view .wishlist-hero-list-card-footer button.MuiButtonGroup-grouped,
#wishlist-hero-shared-list-view .wishlist-hero-list-card-footer button.MuiButtonGroup-grouped,
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-list-card-footer button.MuiButtonGroup-grouped {
  padding: 1rem !important;
}

/* Last-resort specificity: target the exact footer path without the dynamic ID */
#wishlist-hero-shared-list-view .MuiCard-root > .MuiCardActions-root.wishlist-hero-list-card-footer > div > div > button,
[data-testid="wishlist-hero-shared-list-view"]
  .MuiCard-root > .MuiCardActions-root.wishlist-hero-list-card-footer > div > div > button {
      /* padding: 0rem !important; */
    padding-top: 0rem !important;
    padding-left: 0rem !important;
    padding-bottom: 1rem !important;
    padding-right: 0rem !important;
}

#\36 8ac3d508ab0d556479125be > div.MuiCardActions-root.wishlist-hero-list-card-footer > div > div{
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

#wishlist-hero-shared-list-view .MuiCardActions-root.wishlist-hero-list-card-footer > :is(div, .MuiStack-root) > div,
[data-testid="wishlist-hero-shared-list-view"] .MuiCardActions-root.wishlist-hero-list-card-footer > :is(div, .MuiStack-root) > div {
  padding-inline: 1rem !important; /* same as left/right */
}

#wishlist-hero-shared-list-view > div.jss21 > div > div.wishlist-hero-list-footer > button.MuiButtonBase-root.MuiButton-root.MuiButton-text.wishlist-hero-list-card-footer-delete-all.wishlist-hero-dyna-translate{
  margin-right: 0rem;
}

#wishlist-hero-shared-list-view > div.wishlist-hero-page-actions-bar > button > span.MuiButton-label:hover{
color: #ff0030 !important;
}

/* All buttons in the Wishlist actions bar turn red on hover */
#wishlist-hero-shared-list-view .wishlist-hero-page-actions-bar button:is(:hover, :focus-visible),
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-page-actions-bar button:is(:hover, :focus-visible) {
  color:  #ff0030 !important;
}

/* Smoothen it */
#wishlist-hero-shared-list-view .wishlist-hero-page-actions-bar button,
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-page-actions-bar button {
  transition: color .15s ease, color .15s ease, border-color .15s ease;
}

/* Wishlist: "Add all to cart" button → red on hover/focus */
#wishlist-hero-shared-list-view .wishlist-hero-list-card-footer-add-all-to-cart-dialog:is(:hover, :focus-visible),
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-list-card-footer-add-all-to-cart-dialog:is(:hover, :focus-visible) {
 color:  #ff0030 !important;
}

/* Smooth transition */
#wishlist-hero-shared-list-view .wishlist-hero-list-card-footer-add-all-to-cart-dialog,
[data-testid="wishlist-hero-shared-list-view"] .wishlist-hero-list-card-footer-add-all-to-cart-dialog {
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

#wishlist-hero-shared-list-view > div.jss21 > div > div.wishlist-hero-list-footer > button.MuiButtonBase-root.MuiButton-root.MuiButton-text.wishlist-hero-list-card-footer-delete-all.wishlist-hero-dyna-translate > span.MuiButton-label:hover{
 color:  #ff0030 !important;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009826091348__main > div{
  padding-top: 0rem;
}


#locksmith-passcode-form{
  padding-top:20rem;
}

[id$="__custom_liquid_XrqBfV"] > div > div > div > a > h2{
  font-size: 0.8rem;
  color: white;
}

[id$="__custom_liquid_XrqBfV"] > div > div > div > a > h2:hover{
  font-size: 0.8rem;
  color: #ff0030 !important;
  text-decoration: underline;
}

[id$="__custom_liquid_XrqBfV"] > div > div > div > h2 > a{
   font-size: 0.8rem;
  color: white;
  text-decoration: none;
}

[id$="__custom_liquid_XrqBfV"] > div > div > div > h2 > a:hover{
  font-size: 0.8rem;
  color: #ff0030 !important;
  text-decoration: underline;
}

[id$="__page_PGUcmy"] > div > div{
  padding-left: 0rem;
}

[id$="__page_PGUcmy"] > div > div > h2{
  padding-top: 1rem !important;
}

[id$="__page_PGUcmy"] > div > div > h2{
content-visibility: hidden;
}

body[data-template="collection.showroom"] [id$="__main-collection-banner"] > div > div > div > div{
  margin-bottom: 0rem !important;
}

body[data-template="collection.showroom"] [id$="__main-collection-banner"] > div > div{
      padding-left: 0rem;
    padding-top: 1rem;
}

[id$="__page_LHDEBK"] > div > div{

      padding-left: 1rem;
    padding-right: 1rem;
}

.cart__terms,
.cart-terms,
.cart__agree,
#CartAgree,
#agree {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}
.cart__terms input[type="checkbox"],
.cart-terms input[type="checkbox"],
#agree {
  display: inline-block !important;
}

.mailto-link {
  color: rgba(var(--color-link), var(--alpha-link));
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.03rem;
  transition: text-decoration-thickness var(--duration-short) ease;
}

.mailto-link:hover {
  color: red; /* or your brand accent */
  text-decoration-thickness: 0.1rem;
}


/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009826091348__main > div > div:nth-child(2) > div:nth-child(2){
  padding-bottom: 10rem;
}

:root { --marquee-speed: 30s; } /* slow it down as you like */

/* Container 
.rkb-marquee { 
  background: transparent;
  overflow: hidden;
  position: relative;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
  width: 100vh;
} */

.rkb-marquee {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw); /* full-bleed without shifting vertically */
  margin-right: calc(50% - 50vw);
  padding: .5rem 0;
}

/* The moving track */
.rkb-marquee__inner {
  display: inline-flex;          /* lets spans sit in a row */
  gap: 3rem;                     /* space between repeats */
  white-space: nowrap;
  will-change: transform;
  animation: rkbMarquee var(--marquee-speed) linear infinite;
}

/* Text (keep simple until stable) */
.rkb-marquee__inner span {
  color: currentColor;
}

/* Move from fully right to fully left without any padding tricks */
@keyframes rkbMarquee {
  0%   { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .rkb-marquee__inner { animation: none; transform: none; }
}

@media (max-width: 749px) {
  .rkb-marquee__inner {
    animation-duration: 36s;   /* slower on small screens */
    animation-delay: -10s;     /* skip the initial wait */
  }
}

.rkb-marquee__inner { 
  width: max-content;             /* measure instantly */
  -webkit-font-smoothing: antialiased;
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }


/* Homepage only: glow all text in this custom liquid block */

.template-index #shopify-section-sections--20009826353492__header > div > header {
  text-shadow: rgb(201 201 201) 0px 0px 5px, rgb(201 201 201) 0px 0px 8px, rgb(201 201 201) 0px 0px 10px, rgb(201 201 201) 0px 0px 15px, rgb(201 201 201) 0px 0px 20px, rgb(201 201 201) 0px 0px 25px, rgb(201 201 201) 0px 0px 30px;}

.template-index #link-shop > div > button {
 text-shadow: rgb(201 201 201) 0px 0px 5px, rgb(201 201 201) 0px 0px 8px, rgb(201 201 201) 0px 0px 10px, rgb(201 201 201) 0px 0px 15px, rgb(201 201 201) 0px 0px 20px, rgb(201 201 201) 0px 0px 25px, rgb(201 201 201) 0px 0px 30px;}

.template-index #shopify-section-sections--20009826320724__footer > footer > div.footer__content-top.page-width > div > div > ul {
  text-shadow: rgb(201 201 201) 0px 0px 5px, rgb(201 201 201) 0px 0px 8px, rgb(201 201 201) 0px 0px 10px, rgb(201 201 201) 0px 0px 15px, rgb(201 201 201) 0px 0px 20px, rgb(201 201 201) 0px 0px 25px, rgb(201 201 201) 0px 0px 30px;}

.template-index [id$="__custom_liquid_BhKN8A"] > div > div > div > div {
 text-shadow: rgb(201 201 201) 0px 0px 5px, rgb(201 201 201) 0px 0px 8px, rgb(201 201 201) 0px 0px 10px, rgb(201 201 201) 0px 0px 15px, rgb(201 201 201) 0px 0px 20px, rgb(201 201 201) 0px 0px 25px, rgb(201 201 201) 0px 0px 30px;}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825960276__main {
  margin-left: 0rem;
  margin-right: 0rem;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--24438083453268__main > article > header {
  margin-left: 1rem;
  margin-right: 1rem;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--24438083453268__main > article > div.article-template__content.page-width.page-width--narrow.rte{
    margin-left: 1rem;
  margin-right: 1rem;
}

/* Every collection template gets the same space above the title: 4rem on the
   banner section, nothing on the inner div (see the rule further down), and
   flush left/right, since the inner div carries the 1rem text gutter.
   Widened from the Editions template to all collections 17 Sep 2026. */
body[data-template^="collection"] [id$="__main-collection-banner"]{
    /* Top space now comes from #MainContent above, so it isn't doubled. */
    padding-left: 0;
    padding-top: 0;
    padding-right: 0;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--21581024231764__main{
      padding-top: 7rem;
}

[id$="__5cc0c640-ed54-487f-b242-06b50f0254a4"] > div{
  /* Commission request form intro. Was 7rem, from before #MainContent carried
     the site-wide 4rem under the header. 17 Sep 2026 */
  padding-top: 1rem;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825960276__main > div > h1{
  padding-top: 7rem;
}

[id$="__newsletter_zYJfVj"]{
  /* The 7rem here used to provide this page's top spacing. #MainContent now
     carries that site-wide, so this only keeps the left gutter. 17 Sep 2026 */
  padding-top: 0;
  padding-left: 1rem;
}

/* RKB: duplicate of the rule above (same declarations, other theme-template ID). Merged 17 Sep 2026.
#shopify-section-template--24415116198228__newsletter_zYJfVj{
  padding-top: 7rem;
  padding-left: 1rem;
} */

body[data-template^="collection"] [id$="__main-collection-banner"] > div{
    /* No top padding here: the space above the title comes from the banner
       section itself (below), so the two don't stack. Changed 17 Sep 2026. */
    padding-top: 0;
    padding-left: 1rem;
    padding-right: 1rem;

}

/* RKB: same declarations as the collection-banner rule above, which now covers every collection template. Merged 17 Sep 2026.
#shopify-section-template--20009825829204__main-collection-banner > div{
    padding-top: 7rem;
    padding-left: 1rem;
    padding-right: 1rem;*/

}

body[data-template="product.ws126"] [id$="__related-products"] 
  .card__information .caption-with-letter-spacing.light{
    font-size: 0.9rem;
  padding-bottom: 0.5rem;
}

[id$="__page_C6PCNB"] > div > div{
  padding-left: 0rem;
}

[id$="__video_8GkDPp"] .video-section__media {
  background-color: #000 !important;
}

#FacetSortDrawerForm > div > div > div > svg{
  padding-left: 7rem;
}

/*
#main-collection-filters > div{
  display: flow;
}*/

/*
#main-collection-filters > div > div.rkb-filters{
  display:none;
} */

[id$="__custom_liquid_jGFT3d"]{
      margin-left: 1rem;
    margin-right: 1rem;
}

[id$="__page_PGUcmy"] > div > div > div{
  padding-left: 1rem;
}

#product-grid{
  padding-top: 8rem;
}


/* Make sure the custom filters sit on top */
.rkb-filters,
.rkb-mobile-controls,
.rkb-desktop-controls {
  position: relative;
  z-index: 60; /* higher than header/drawers in Dawn */
}

/* When any control is focused, lift it even more */
.rkb-filters:focus-within {
  z-index: 9999;
}

/* Raise the interactive elements themselves */
#rkb-category-select,
#rkb-subcategory-select,
.rkb-cat,
.rkb-sub {
  position: relative;
  z-index: 61;
}

/* Ensure nothing around the filters clips the dropdown */
.facets-container,
#FacetFiltersForm,
.rkb-filters {
  overflow: visible !important;
}

.rkb-filters::before,
.rkb-filters::after {
  pointer-events: none;
}

.header-wrapper,
.shopify-section-header-sticky {
  z-index: 50; /* keep below our 60+ filters */
}

#rkb-category-select:focus,
#rkb-subcategory-select:focus {
  position: relative;
  z-index: 10000;
}

@media (min-width: 750px) {
  .rkb-desktop-controls {
    display: flex;
    flex-direction: column;     /* stack category row over subcategory row */
    align-items: center;        /* center horizontally */
    gap: 0.75rem;               /* space between the two rows */
    width: 100%;
  }

  .rkb-desktop-controls .category-wrapper,
  .rkb-desktop-controls .subcategory-wrapper {
    display: flex !important; 
    justify-content: center;    /* center buttons within each row */
    flex-wrap: wrap;            /* allow wrapping on smaller desktops */
    gap: 0.5rem;                /* space between buttons */
    width: 100%;
    margin-top: 0.75rem; 
  }

  /* Optional: keep buttons tidy if they get wide */
  .rkb-cat, .rkb-sub {
    white-space: nowrap;
  }
}

.rkb-filters,
.rkb-filters * {
  font-family: inherit !important;
  font-size: inherit;
  line-height: inherit;
}


body[data-template="product.ws126"] [id^="product-form-"][id$="__main"] > div.product-form__buttons{
  display: block !important;
}


#locksmith-passcode-form{
    padding-top: 10rem;
    padding-bottom: 8rem;
}


#locksmith-content > div > p{
     padding-top: 10rem;
    padding-bottom: 8rem;

}




[id$="__video_8GkDPp"] > div{
    padding-top: 10rem;
    padding-bottom: 15rem
}
[id$="__custom_liquid_aFFMRn"]{
  padding-top: 5rem;
    padding-bottom: 5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

@media (max-width: 749px) {
  .shopify-section-footer,
  .footer,
  footer.site-footer {
    display: none !important;
  }
}

#menu-drawer > div > div > nav > div > ul > li:nth-child(1) > a{
  display:none;
}

.mobile-extra-links .menu-drawer__menu,
.mobile-extra-links .menu-drawer__menu li {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Make links look exactly like the rest of the drawer items */
.mobile-extra-links .menu-drawer__menu-item {
  font: inherit;
  line-height: inherit;
  color: rgb(var(--color-foreground));           /* same color as other drawer text */
  text-decoration: none;
}

.mobile-extra-links .menu-drawer__menu-item:visited {
  color: rgb(var(--color-foreground));
}

.mobile-extra-links .menu-drawer__menu-item:hover,
.mobile-extra-links .menu-drawer__menu-item:focus-visible {
  color: rgba(var(--color-foreground), var(--alpha-link)); /* same hover tone Dawn uses */
  text-decoration: underline; !important;
  text-underline-offset: 0.2rem;
}

/* Pick your red */
:root { --menu-hover: #ff0030; } /* change to your exact red if needed */

/* Desktop header: top-level + dropdown items */
.header .list-menu__item .link:hover,
.header .list-menu__item .link:focus-visible,
.header .header__menu-item:hover,
.header .header__menu-item:focus-visible,
.header summary.list-menu__item:hover,
.header summary.list-menu__item:focus-visible,
.mega-menu__link:hover,
.mega-menu__link:focus-visible {
  color: var(--menu-hover) !important;
}

/* Mobile drawer: main, child, grandchild items */
.menu-drawer__menu-item:hover,
.menu-drawer__menu-item:focus-visible {
  color: var(--menu-hover) !important;
}

/* Mobile drawer: underline on hover/focus for links AND parent summaries */
.menu-drawer__menu-item:hover,
.menu-drawer__menu-item:focus-visible,
.menu-drawer__submenu .menu-drawer__menu-item:hover,
.menu-drawer__submenu .menu-drawer__menu-item:focus-visible,
.menu-drawer__menu .menu-drawer__menu-item:hover,
.menu-drawer__menu .menu-drawer__menu-item:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.2rem;        /* nice offset */
  text-decoration-thickness: 0.08rem;   /* a hair thicker for visibility */
}

/* If your parent items are <summary>, they already have .menu-drawer__menu-item.
   This ensures underline still shows when the submenu is open. */
details[open] > summary.menu-drawer__menu-item:hover,
details[open] > summary.menu-drawer__menu-item:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
  text-decoration-thickness: 0.08rem;
}


@media (max-width: 749px) {
  #main-collection-filters .rkb-filters .rkb-mobile-controls {
    display: grid !important;
    /*grid-auto-flow: column; */
    gap: 0.75rem;
    place-content: center;  /* centers both axes */
    width: 100%;
  }
}

@media screen and (max-width: 749px) {
  .rkb-mobile-controls {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    justify-items: center; /* optional centering */
  }
  .rkb-mobile-controls select {
    width: 100%;
    max-width: 420px; /* optional */
  }
}


@media screen and (max-width: 749px) {

#product-grid {
        column-gap: 2rem !important;
        row-gap: 6rem !important;
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
        padding-bottom: 8rem !important;
}}

/* Base: make the selects look consistent */
.rkb-mobile-controls select,
#rkb-category-select,
#rkb-subcategory-select {
  -webkit-appearance: none !important; /* iOS */
  appearance: none !important;
  font: inherit;                 /* match site font */
  color: inherit;                /* match text color */
  background: transparent;       /* or a color if you prefer */
  border: 1px solid currentColor;
  border-radius: 0;              /* match theme */
  padding: 0.6rem 2.25rem 0.6rem 0.75rem; /* room for arrow on the right */
  line-height: 1.2;
  height: 2.5rem;                /* consistent height */
  box-shadow: none;
}

/* iOS zoom-on-focus fix: keep font-size >= 16px */
.rkb-mobile-controls select {
  font-size: 16px;
}

/* Position wrappers so we can draw our own arrow */
.rkb-mobile-controls .category-wrapper,
.rkb-mobile-controls .subcategory-wrapper {
  position: relative;
  width: 100%;
  max-width: 420px;
}

/* Custom arrow (visible in iOS and Chrome) */
.rkb-mobile-controls .category-wrapper::after,
.rkb-mobile-controls .subcategory-wrapper::after {
  content: "";
  position: absolute;
  right: 0.75rem;
  top: 50%;
  width: 0.6rem;
  height: 0.6rem;
  transform: translateY(-50%) rotate(45deg);
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  pointer-events: none;
  opacity: 0.8;
}

/* Focus/hover states */
.rkb-mobile-controls select:focus {
  outline: none;
  border-color: #ff0030;           /* your red */
  box-shadow: 0 0 0 2px rgba(255,0,48,0.15);
}
.rkb-mobile-controls select:hover {
  border-color: currentColor;
}

/* Ensure consistent layout on iPhone */
@media screen and (max-width: 749px) {
  .rkb-mobile-controls {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    justify-items: center;
  }
  .rkb-mobile-controls > * {
    grid-column: 1 / -1;
    width: 100%;
  }
}

/* Optional: target iOS only tweaks */
@supports (-webkit-touch-callout: none) {
  .rkb-mobile-controls select {
    background-color: transparent;   /* avoid iOS inner gray */
    -webkit-tap-highlight-color: rgba(0,0,0,0);
  }
}

/* Dark backgrounds? Make arrow visible */
.color-scheme-dark .rkb-mobile-controls .category-wrapper::after,
.color-scheme-dark .rkb-mobile-controls .subcategory-wrapper::after {
  opacity: 1;
}

@media screen and (max-width: 749px) {


#main-collection-filters > div.facets-container.facets-container-drawer > div.rkb-filters{

  padding-left: 1rem;
}



#rkb-bespoke-info{


padding-left: 1rem;


}
}

#main-collection-filters > div.product-count.light{
  padding-top: 2rem;
}
#main-collection-filters > div.product-count.light > h2{
  text-align: center;
}

#__next{
      padding-top: 5rem;
}

.wishlist-shell .title-wrapper-with-link a {
  color: rgba(var(--color-link), var(--alpha-link));
  text-decoration: underline;
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.03rem;
  text-decoration-color: currentColor;
  transition: color var(--duration-short) ease,
              text-decoration-thickness var(--duration-short) ease;
}

/* Optional: also style the small "Your account" link under the title */
.wishlist-shell .rkb-wishlist-sub a {
  color: rgba(var(--color-link), var(--alpha-link));
  text-decoration: underline;
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.03rem;
  text-decoration-color: currentColor;
  transition: color var(--duration-short) ease,
              text-decoration-thickness var(--duration-short) ease;
}

/* Hover/focus states */
.wishlist-shell .title-wrapper-with-link a:hover,
.wishlist-shell .title-wrapper-with-link a:focus-visible,
.wishlist-shell .rkb-wishlist-sub a:hover,
.wishlist-shell .rkb-wishlist-sub a:focus-visible {
  color: #ff0030;                 /* your red */
  text-decoration-thickness: 0.1rem;
}

[id$="__custom_liquid_cr7JAq"] > div > div > p{

      padding-top: 2rem;
    padding-bottom: 2rem;
}

#main-collection-filters



#main-collection-filters > div.facets-container.facets-container-drawer{
  display: none !important;
}

#main-collection-filters > div.facets-container.facets-container-drawer > div.rkb-filters{
  display: none;
}

#main-collection-filters{
  display: none;
}

[id$="__rich_text_Bwn634"] > div{
  display: none;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825730900__main > article > header > div{
  display:none;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#shopify-section-template--20009825730900__main > article > div.article-template__back.element-margin-top.center{
  display:none;
}

[id$="__featured_blog_fiHbin"] > div{    padding-left: 1rem;
    padding-right: 1rem;}


.rkb-caption-link,
.rkb-caption-link:visited,
.rkb-caption-link:active {
  color: inherit;
  text-decoration-line: underline;
  text-decoration-thickness: 0.03rem;
  text-underline-offset: 0.3rem;
  text-decoration-skip-ink: auto;
  transition: text-decoration-thickness var(--duration-short) ease;
}

.rkb-caption-link:hover,
.rkb-caption-link:focus {
  color: var(--menu-hover);
  text-decoration-line: underline;
  text-decoration-thickness: 0.1rem;;
  text-underline-offset: 0.3rem;
  text-decoration-skip-ink: auto;
}

.rkb-caption-link i {
  font-style: italic;
}

.rkb-caption-link:hover,
.rkb-caption-link:focus {
  color: #ff0030;
}

.rkb-arrow {
  font-size: 0.8em;
  margin-left: 0.12em;
}




[id^="SectionHeading-"][id$="__featured_blog_fiHbin"] {
    text-transform: capitalize;
}


[id^="Slider-"][id$="__featured_blog_fiHbin"] .caption-with-letter-spacing.h5 {
  font-size: smaller;
}

[id^="Slider-"][id$="__featured_blog_fiHbin"] .article-card__excerpt {
  font-size: smaller;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#ProductInfo-template--20009826025812__main > p:nth-child(7){
  font-size: 0.7rem; 
}




/*
    .product__media-wrapper {
  position: relative !important;
  z-index: 1000 !important;
}*/

.product__info-wrapper,
.product__info-container,
.product-form,
.product-form__input,
.select,
.select__select {
  position: relative !important;
  z-index: 10 !important;
}


#shopify-section-sections--20009826353492__header > div > header > div > a.header__icon.header__icon--account.link.focus-inset.small-hide{
  display: none;
}

/* RKB-TODO: still points at a live-theme section ID, so it does not apply in theme copies. See CSS-NOTES.md. */
#ProductModal-template--20009826025812__main{
  padding-top: 3rem;
}

@media screen and (max-width: 749px) {
  details:not([open]) > #menu-drawer,
  details:not([open]) #menu-drawer {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  details[open] > #menu-drawer,
  details[open] #menu-drawer {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}
/* Account icon: removed from header.liquid and header-drawer.liquid 17 Sep 2026.
   This is the belt-and-braces rule, in case a copy is rendered by an app
   block or a cached section. Delete it along with the `{% if false %}` in
   those two files if the account link is ever wanted back. */
.header__icon--account,
.menu-drawer__account,
.icon-account {
  display: none !important;
}

/* Blog pages (the commissions archive and the rest) sit flush left otherwise.
   Padding the title and its caption rather than all of #MainContent, so the
   article grid below keeps its own alignment. 17 Sep 2026 */
/* Blog gutters, per template.

   The caption is a richtext metafield, so its text sits in a nested <p>;
   padding the caption box carries that with it. The .main-blog wrapper is
   deliberately NOT padded — that also insets the article grid.

   Commissions Archive keeps the title indented with its caption; the other
   blog templates (Notes and the rest) have a flush title. 17 Sep 2026 */
body[data-template^="blog"] .main-blog-caption {
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Commissions Archive is padded as a whole — title, caption, enquiry link and
   the article grid all on the same 1rem gutter — so its wrapper carries it and
   the caption's own gutter is cancelled to avoid 2rem. */
body[data-template="blog.custom-archive"] .main-blog {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

body[data-template="blog.custom-archive"] .main-blog-caption {
  padding-left: 0;
  padding-right: 0;
}

/* ---------- Newsletter form ----------
   The email box was several times taller than its text. Two causes, both
   inherited: `.field__label` carries `line-height: 5rem`, which sets the
   field's height from the inside, and the input keeps Dawn's tall min-height.
   Scoped to .newsletter-form so the contact and commission forms are
   untouched. 17 Sep 2026 */

.newsletter-form .field {
  max-width: 32rem;
  min-height: 0;
  /* `.field` is `margin: auto`, which centres the box. Left-align it instead,
     so it sits under the text above. 17 Sep 2026 */
  margin-left: 0;
}

.newsletter-form .field__input,
.newsletter-form__field-wrapper .field__input {
  height: auto;
  min-height: 0;
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  line-height: 1.4;
}

.newsletter-form .field__label {
  top: 0.75rem;
  left: 1rem;
  line-height: 1.4;
}

/* The floating label lifts out of the way on focus / once typed in. */
.newsletter-form .field__input:focus ~ .field__label,
.newsletter-form .field__input:not(:placeholder-shown) ~ .field__label {
  top: 0.2rem;
  font-size: 0.7rem;
}