/** Shopify CDN: Minification failed

Line 1486:2 "text-tranform" is not a known CSS property
Line 1600:2 "margin-bototm" is not a known CSS property
Line 1744:1 Unexpected "/"
Line 1777:2 "max-widht" is not a known CSS property
Line 2080:0 Expected "}" to go with "{"

**/
@font-face {
font-family: "ABCO";
src: url("/cdn/shop/files/SuisseIntl-Light.woff?v=1695618453") format("woff"), url("/cdn/shop/files/SuisseIntl-Light.woff2?v=1695618453") format("woff2");
}

@font-face {
font-family: "ABCObold";
src: url("/cdn/shop/files/SuisseIntl-SemiBold.woff?v=1695618525") format("woff"), url("/cdn/shop/files/SuisseIntl-SemiBold.woff2?v=1695618525") format("woff2");
}

/* Body copy weight. The store's Files only hold two Suisse Intl cuts, Light
   and SemiBold, so "medium" is served by the SemiBold file. Kept as its own
   family rather than pointing the body at "ABCObold" so that dropping a real
   SuisseIntl-Medium into Files is a one-line swap here, with nothing else to
   touch. */
@font-face {
font-family: "ABCOmedium";
src: url("/cdn/shop/files/SuisseIntl-SemiBold.woff?v=1695618525") format("woff"), url("/cdn/shop/files/SuisseIntl-SemiBold.woff2?v=1695618525") format("woff2");
}

* {
  font-family: "ABCOmedium", sans-serif !important;
  font-size: 15px !important;
  letter-spacing: .1px !important;
    line-height: 1.15em !important;
}

/* ==========================================================================
   Scrollbars hidden, scrolling untouched.

   The theme pins `overflow-y: scroll` on body, so on Windows and Linux a
   track sat down the side of every page whether or not it was needed. Hiding
   it is presentation only: the wheel, trackpad, keyboard, touch and
   scrollIntoView all behave exactly as before, and the page still scrolls.

   The webkit rule is deliberately unscoped, so it also covers the panels that
   scroll inside the page — the mega menu, the cart drawer, the mobile
   navigation. Those lose their visible track too, which is the intent, but it
   is the one place where a scrollbar was doing a job: it showed there was
   more below. Scope the rule to `html, body` if that reads as a loss.
   ========================================================================== */

html,
body {
  scrollbar-width: none;      /* Firefox */
  -ms-overflow-style: none;   /* legacy Edge / IE */
}

::-webkit-scrollbar {
  display: none;              /* Chrome, Safari, Edge */
}

/* ==========================================================================
   Chroma (Source Type) webfonts — added 2026-09-07
   Files live in assets/ and are served from the theme, so they travel with
   a theme push (no admin Files upload needed).
   ========================================================================== */

@font-face {
  font-family: "ChromaMono";
  src: url("https://vvoo.ch/cdn/shop/t/10/assets/ChromaMonoST_Regular.woff2?v=70622775044387728251788774865") format("woff2"),
       url("https://vvoo.ch/cdn/shop/t/10/assets/ChromaMonoST_Regular.woff?v=118629621968871815211788774865") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ChromaBlack";
  src: url("https://vvoo.ch/cdn/shop/t/10/assets/ChromaST_Black.woff2?v=85019190416356493641788774865") format("woff2"),
       url("https://vvoo.ch/cdn/shop/t/10/assets/ChromaST_Black.woff?v=9146364392171270521788774865") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* --------------------------------------------------------------------------
   Buttons: Chroma Mono ST, 15px, uppercase, 0 letter-spacing.
   Descendant selectors (`.btn *` etc.) are required because Symmetry wraps
   button labels in <span class="btn__text">, and the global
   `* { font-family: "ABCO" !important }` rule at the top of this file matches
   those spans directly — inheritance from the button alone would lose to it.
   -------------------------------------------------------------------------- */

.button,
a.button,
.btn,
a.btn,
button,
input[type=submit],
input[type=reset],
input[type=button],
#cartform .checkout-col .button,
.cc-btn,
.button *,
a.button *,
.btn *,
a.btn *,
button *,
#cartform .checkout-col .button *,
.cc-btn * {
  font-family: "ChromaMono", monospace !important;
  font-size: 15px !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
}



.container {
  max-width: 100% !important;
}

html {
    scroll-behavior: smooth;
}



b, strong  {
    font-family: "ABCObold", sans-serif !important;
  font-weight: 400;
}

span, div {
  font-weight: 400 !important;
}


.majortitle, .shopify-policy__title h1, .product-detail .detail .title, .overlay-text .overlay-text__title , .quickbuy-container .product-detail .title, .quickbuy-container .product-detail .title a, .quickbuy-container .product-detail h1.majortitle, .quickbuy-container .product-detail h2, .quickbuy-container .product-detail h3, .quickbuy-container .product-detail h4, .quickbuy-container .product-detail h5, .quickbuy-container .product-detail h6{
  font-size: 50px !important;
  line-height: 1.1 !important; 
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Section titles: Chroma ST Black, 90px, 85% line-height, 0 letter-spacing.
   Must sit AFTER the 50px rule above: `.majortitle` there is also (0,1,0)
   with !important, so order decides. `.overlay-text .overlay-text__title` is
   repeated at (0,2,0) to outrank the same compound selector in that rule.
   Deliberately NOT included:
     - `.cc-popup-container .majortitle` (cart drawer) stays 15px — it is
       (0,2,0) and so still outranks this rule.
     - `.product-detail .detail .title` (product page H1) and the quickbuy
       popup headings keep 50px; they are page/product titles, not sections.
   -------------------------------------------------------------------------- */

.majortitle,
.overlay-text__title,
.overlay-text .overlay-text__title {
  font-family: "ChromaBlack", sans-serif !important;
  font-size: min(75px, 9.8vw) !important;
  line-height: 0.85 !important;
  letter-spacing: 0 !important;
  /* Last-resort net: only ever kicks in for a single word too long for its
     line (nothing else is affected), so a stray very long word can never
     push the page into horizontal scroll. */
  overflow-wrap: break-word;
}

/* Titles inside Symmetry's flexible-layout columns get only a fraction of the
   row. They stay at the same 75px as every other title and shrink only when a
   column is genuinely too narrow to hold one — below about 535px, where a long
   single word would otherwise burst the column and push the page into
   horizontal scroll.

   This used 10cqw, which shrank every column narrower than 750px: that is
   most half-width columns, so image-with-text and custom-row titles came out
   at 58-70px while the rest of the site was at 75. 14cqw keeps the same
   burst guard but only triggers where it is needed. */

.flexible-layout > .column > *:has(> .majortitle),
.flexible-layout > .column > *:has(> .overlay-text__title) {
  container-type: inline-size;
}

.flexible-layout > .column .majortitle,
.flexible-layout > .column .overlay-text__title {
  font-size: min(75px, 9.8vw, 14cqw) !important;
}

/* --------------------------------------------------------------------------
   Section titles on every page follow the homepage: one size everywhere, and
   left-aligned with the title-left / text-right layout wherever a section
   is set to Left.

   Rich-text sections follow their own "Text alignment" setting in the theme
   editor, so that setting is the switch. Left gives the homepage layout:
   title in the left half, intro, lists and buttons stacked in the right half.
   Centre keeps a centred stack, title over text. The class schedule and the
   liability disclaimer are set to Centre; every other rich-text section with
   a title is set to Left. (An earlier version forced every rich-text section
   left regardless of the setting, which left no way to centre one.)

   Scope is section-level titles only — rich-text headings, image-with-text
   and multi-column titles, the FAQ header. Card captions (teacher names,
   event names) and sub-headings inside running text keep their own sizes.

   The per-section Custom CSS in the page templates used to set these titles
   to 42, 50, 80 and 90px and centre them with `text-align: center` and
   `padding: 0 20%`. Those rules render at ID level with !important, so
   nothing here could beat them; they have been taken out of the templates.
   -------------------------------------------------------------------------- */

/* One size, whatever the alignment. */
.section-rich-text .majortitle,
.section-image-with-text .majortitle,
.section-multi-column .hometitle,
.section-faq-header h1,
.section-faq-header h2 {
  font-size: min(75px, 9.8vw) !important;
}

/* Left everywhere these sections have no alignment setting of their own. */
.section-rich-text .spaced-column.align-left .majortitle,
.section-image-with-text .majortitle,
.section-multi-column .hometitle,
.section-faq-header h1,
.section-faq-header h2 {
  text-align: left !important;
}

.section-rich-text .spaced-column.align-left .button-row {
  justify-content: flex-start !important;
}

/* A Left rich-text section that opens with a title becomes the Living Room
   curation layout: that title in the left half, everything after it stacked in
   the right half. The title spans all the rows the right-hand content needs,
   so a long text never pushes the next section into it. Only the first title
   takes the left column: a section holding a second title (the rental page
   has two) keeps that one in the right-hand run of text, rather than stacking
   both on top of each other on the left.

   These sections are taken to full width with the homepage's side gutter,
   since several were squeezed to 60-65% in their Custom CSS; that width rule
   has no !important, so this wins without editing each one. Centre sections
   keep their own narrower measure, which suits centred text. */

@media only screen and (min-width: 768px) {
  /* Every Left rich-text section with a title shares one left edge, 30px in,
     the same as "Yoga and more" on the homepage — whether it splits or stands
     alone. Only the inner container is padded: padding the reading wrapper
     around it as well doubled it and put these titles at 60px. */
  .section-rich-text:has(.spaced-column.align-left > .majortitle) .article {
    width: auto !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .section-rich-text:has(.spaced-column.align-left > .majortitle) .container {
    width: auto !important;
    max-width: none !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .section-rich-text .spaced-column.align-left:has(> .majortitle:first-child + *) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 40px;
    align-items: start;
  }

  .section-rich-text .spaced-column.align-left:has(> .majortitle:first-child + *) > .majortitle:first-child {
    grid-column: 1;
    grid-row: 1 / span 30;
    margin-top: 0;
    padding-right: 20px;
  }

  .section-rich-text .spaced-column.align-left:has(> .majortitle:first-child + *) > :not(:first-child) {
    grid-column: 2;
  }

  .section-rich-text .spaced-column.align-left:has(> .majortitle:first-child + *) > .rte:first-of-type > :first-child {
    margin-top: 0;
  }
}



.cc-popup-container .majortitle {
  font-size: 15px !important;
}

.pageheader a,.mobile-nav-title, .store-availability-container .store-availability-information .store-availability-information__title strong, .mobile-navigation-drawer .navigation__tier-2>.navigation__item>.navigation__link, .hometitle, .cart-link__count,.mobile-navigation-drawer .navigation__tier-1>.navigation__item>.navigation__link, .show-search-link__text, .cart-link__label, .filters__heading-text, .studio a, .navigation .navigation__tier-2 .navigation__link, .navigation .navigation__item--with-small-menu>.navigation__tier-2-container .navigation__tier-2 .navigation__link {
font-family: "ABCObold", sans-serif !important;
  font-weight: 400;
}

/* --------------------------------------------------------------------------
   Every heading on the site shares the title face and casing, not just the
   ones using Symmetry's `.majortitle`. Headings also arrive as
   `.text-column__title`, `.hometitle`, `.h1-style`, and as raw <h1>-<h6>
   typed into rich-text fields — those were still rendering in ABCO or Suisse,
   in sentence case (e.g. the rich-text "VVOO Yoga Class Schedule" on
   /pages/yoga at ABCO 90px).

   Deliberately typeface and casing only: sizes here run from 15px card
   headings to 90px section titles, and forcing one size would wreck the
   small ones. Section-title sizing stays with the rules above.
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6,
.hometitle,
.text-column__title,
.h1-style, .h2-style, .h3-style, .h4-style,
.rte h1, .rte h2, .rte h3, .rte h4, .rte h5, .rte h6 {
  font-family: "ChromaBlack", sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  line-height: 0.85 !important;
}

/* --------------------------------------------------------------------------
   Navigation: Chroma ST Black, 18px, uppercase.
   The selectors above this rule set the nav to ABCObold at up to (0,5,0)
   specificity with !important, so the compound ones are repeated verbatim
   here and placed afterwards to win on order. Plain `.navigation__link`
   covers the top-level header links, which only pick up the file's global
   `*` rule.
   -------------------------------------------------------------------------- */

.navigation__link,
.navigation .navigation__link,
.mobile-navigation-drawer .navigation__tier-1 > .navigation__item > .navigation__link,
.mobile-navigation-drawer .navigation__tier-2 > .navigation__item > .navigation__link,
.navigation .navigation__tier-2 .navigation__link,
.navigation .navigation__item--with-small-menu > .navigation__tier-2-container .navigation__tier-2 .navigation__link {
  font-family: "ChromaBlack", sans-serif !important;
  font-size: 18px !important;
  text-transform: uppercase !important;
}

/* 18px puts the menu on its own row below the logo on most screens, and that
   is expected. Symmetry's inline-menu-center header keeps the menu beside the
   Search / Account / Cart links only while it fits the inline slot, which is
   (viewport - 478)px: 942px at a 1440 viewport. The four labels measure 950px
   of text alone at Chroma Black 18px, so they cannot fit at 1440 whatever the
   link padding — the row splits below roughly 1490px wide. Dropping to 15px
   (888px including padding) is what would bring it back onto the logo row. */

/* 16px a side = 32px between items. Restricted to the top row: as a plain
   `.navigation .navigation__link` this also padded every link inside the open
   menu panels, costing each of them 32px of the width its label had to fit
   into, which is a large share of a panel. */

.navigation .navigation__tier-1 > .navigation__item > .navigation__link {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* The header's Search / Account / Cart links, deliberately left at 13px while
   the menu is 18px: this block is doubled and subtracted from the menu's
   inline slot (avail = inner - max(right, logo) * 2 - 40), so every pixel it
   grows costs the menu two.

   Each selector carries the `.pageheader` prefix because the ABCObold rule
   further up this file leads with `.pageheader a`, at (0,1,1) — a bare
   `.show-search-link` at (0,1,0) loses to it and the links keep the old
   face. */

.pageheader a.header-account-link,
.pageheader .header-account-link__text,
.pageheader a.show-search-link,
.pageheader .show-search-link__text,
.pageheader a.cart-link,
.pageheader .cart-link__label,
.pageheader .cart-link__count {
  font-family: "ChromaBlack", sans-serif !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
}

/* --------------------------------------------------------------------------
   Search / Account / Cart as icons, so the menu keeps the whole inline slot.
   The header's `icon_strategy` setting is now "icons_only": the theme marks
   each label `visually-hidden` (still read aloud) and shows the icon it has
   always rendered. Three rules in this file hid those icons for the old
   text-only header and have been removed.

   This is what buys the single row: the slot is
   (inner - max(right, logo) * 2 - 40), so the block being 219px of text was
   costing the menu 438px. As icons it measures well under the 145px logo,
   which means the logo governs instead and the slot sits at its ceiling —
   1090px at a 1440 viewport, against a 1078px menu.
   -------------------------------------------------------------------------- */

.pageheader .logo-area__right__inner {
  gap: 22px;
}

/* Symmetry also puts a 20px right margin on each of these links, which with a
   gap would space them twice over — and this block's width is the thing being
   kept small, so the spacing is set in one place. */

.pageheader .logo-area__right__inner > a {
  margin-right: 0 !important;
}

/* The centred menu slot. Symmetry hard-codes it to `100vw - 600px` — a flat
   300px allowance either side for the logo and the utilities — which at a
   1440 viewport is 840px and was the real reason the 18px menu would not sit
   inline, not the arithmetic in inlineNavigationCheck().

   The width here is deliberately loose, so that the real limit is the
   max-width the header's own script sets on every load and resize:
   inner - max(icons, logo) * 2 - 40. That figure is measured, so it follows
   the actual logo and icon widths — which is the point. This used to be a
   fixed `100vw - 350px`, worked out for the 145px wordmark; swapping in the
   45px icon made that number wrong overnight, and a fixed figure would go
   stale again with the next logo change. The script's value is also what
   keeps the centred menu clear of the logo and the icons, so nothing here
   needs to.

   With the 45px icon the icon row (112px) is the wider block and governs,
   which lowers the width at which the menu fits beside the logo from about
   1427px to about 1361px. */

@media only screen and (min-width: 768px) {
  .pageheader.pageheader--layout-inline-menu-center .logo-area__left__inner {
    width: calc(100vw - 40px);
  }
}

.pageheader .header-account-link svg,
.pageheader .show-search-link svg,
.pageheader .cart-link__icon svg {
  display: block !important;
  width: 20px !important;
  height: auto !important;
}

/* No optical nudge here any more. The -3px this rule used to carry lined up a
   row of 13px text with the menu; the icons are a different height and already
   centre on the menu's line by themselves (65.55 against 65.66 measured), so
   the same offset would push them 3px high. `position: relative` stays only
   because the cart count hangs off this subtree. */

.pageheader .logo-area__right__inner {
  position: relative;
}

/* Anchor targets dropped in through Custom Liquid — #bookclass,
   #meet-the-teachers — are empty divs, so a link to one lands them flush
   against the top of the viewport, behind the sticky header. This stops them
   short of it, the same 90px the sections with their own anchor use. */

.custom-html > div[id]:empty {
  scroll-margin-top: 90px;
}

/* --------------------------------------------------------------------------
   Footer link columns in Chroma Mono, uppercase, like the buttons.

   Scoped to the menu blocks, so it catches the link columns and nothing else.
   The body copy — the Daoism line, the newsletter invitation, the copyright —
   stays in Suisse Medium.

   Deliberately not included, though they are also links: "Santa Helena
   Agency", "Powered by Shopify" and the language options. Each sits inside a
   sentence, where a mono uppercase word mid-line reads as a mistake rather
   than as a menu item.
   -------------------------------------------------------------------------- */

#shopify-section-footer .section-footer__menu-block__menu a {
  font-family: "ChromaMono", monospace !important;
  text-transform: uppercase !important;
}

/* The newsletter field matches the Sign up button beside it: same face, same
   casing. The placeholder needs naming separately for the face — it does not
   inherit that from the input — but takes the casing from it.

   The uppercase is display only. text-transform does not touch the input's
   value, so an address typed in lower case is still submitted exactly as
   typed; it just reads back in caps while the visitor is in the field. */

#shopify-section-footer .signup-form__email {
  font-family: "ChromaMono", monospace !important;
  text-transform: uppercase !important;
}

#shopify-section-footer .signup-form__email::placeholder {
  font-family: "ChromaMono", monospace !important;
}

/* The newsletter invitation goes with its form rather than with the footer's
   other body copy, so the whole block reads as one piece. Scoped to the
   newsletter block: the Daoism line and the copyright sit in `.brand` and
   stay in Suisse Medium.

   The paragraph inside is named as well as the wrapper — the global `*` rule
   is !important, so inheritance alone would not reach it. */

#shopify-section-footer .section-footer__newsletter-block .section-footer__text,
#shopify-section-footer .section-footer__newsletter-block .section-footer__text * {
  font-family: "ChromaMono", monospace !important;
  text-transform: uppercase !important;
}

/* The cookie bar is an app's widget, not the theme's. Symmetry's own
   `button:hover` (black fill) reaches into it and turns the close icon into a
   black square, so the close button keeps its own look on hover. */
.CookiesBar-Pop__Close:hover,
.CookiesBar-Pop__Close:focus {
  background: transparent !important;
  border-color: transparent !important;
}

/* The newsletter section (Community, and the newsletter page) speaks the
   footer's voice: title, invitation and field all in Chroma Mono, uppercase.
   The Sign up button already is. The field's placeholder is named on its own
   because it does not inherit the face from the input. */
.section-signup .hometitle,
.section-signup .rte,
.section-signup .rte *,
.section-signup .signup-form__email {
  font-family: "ChromaMono", monospace !important;
  text-transform: uppercase !important;
}
.section-signup .signup-form__email::placeholder {
  font-family: "ChromaMono", monospace !important;
}

/* --------------------------------------------------------------------------
   Policy pages (privacy, refund, terms, shipping, …) share one Shopify
   layout. Symmetry gives it a centred 800px column with a centred 50px
   title; here it follows the rest of the site instead — title in the left
   half at the section-title size, text starting at the middle of the page.

   The column split is a 50/50 grid with no gap, and the container's side
   padding is symmetric, so the second column starts exactly at mid-page;
   the title keeps clear of the text with padding of its own. Phones get one
   column, everything left-aligned, on the 10px edge the sections use.
   -------------------------------------------------------------------------- */
.container .shopify-policy__container {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 20px !important;
}
.shopify-policy__title h1 {
  font-family: "ChromaBlack", sans-serif !important;
  font-size: min(75px, 9.8vw) !important;
  line-height: 0.85 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  margin-top: 0;
  overflow-wrap: break-word;
}
.shopify-policy__body,
.shopify-policy__body * {
  text-align: left !important;
}
@media only screen and (min-width: 768px) {
  .container .shopify-policy__container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
  }
  .shopify-policy__title { grid-column: 1; padding-right: 30px; }
  .shopify-policy__body { grid-column: 2; }
}
@media only screen and (max-width: 767px) {
  .container .shopify-policy__container { padding: 0 !important; }
}

/* The footer's "Find the VVOO Studio" link reads as a menu item, so it takes
   the menu's face, size and casing. `.studio a` matches the (0,1,1) of the
   ABCObold rule further up the file, so this has to sit after it to win. */

.studio a {
  font-family: "ChromaBlack", sans-serif !important;
  font-size: 18px !important;
  text-transform: uppercase !important;
}

 a.button, .btn, a.btn,  input[type=submit], input[type=reset], input[type=button], #cartform .checkout-col .button, btn.btn--secondary {
  border-radius: 50px !important;
  border: 1px solid black !important;
}

/* --------------------------------------------------------------------------
   Button padding: 10px top/bottom, 20px left/right.
   `.notabutton` is Symmetry's own marker for icon-only buttons (mobile nav
   toggle, search open/close) — they carry their own sizing and must keep it,
   so they are excluded here. Bare <button> is deliberately NOT targeted
   either: on this site those are carousel arrows, the language disclosure
   toggle and close-X icons, none of which are CTAs.
   -------------------------------------------------------------------------- */

.button:not(.notabutton),
a.button:not(.notabutton),
.btn:not(.notabutton),
a.btn:not(.notabutton),
input[type=submit]:not(.notabutton),
input[type=reset]:not(.notabutton),
input[type=button]:not(.notabutton),
#cartform .checkout-col .button:not(.notabutton) {
  padding: 10px 20px !important;
}

/* --------------------------------------------------------------------------
   Button hover: fill black, text white. Same selector set as the padding
   above, so icon-only `.notabutton` controls are left alone. !important is
   needed to beat the theme's own :hover colours and the `.btn--secondary`
   hover further down this file.
   The Wellness Essentials band overrides this with its own colours; that
   rule lives in sections/vvoo-essentials.liquid, scoped to the section.
   -------------------------------------------------------------------------- */

.button:not(.notabutton):hover,
a.button:not(.notabutton):hover,
.btn:not(.notabutton):hover,
a.btn:not(.notabutton):hover,
button:not(.notabutton).btn:hover,
input[type=submit]:not(.notabutton):hover,
input[type=reset]:not(.notabutton):hover,
input[type=button]:not(.notabutton):hover,
#cartform .checkout-col .button:not(.notabutton):hover,
.button:not(.notabutton):hover .btn__text,
a.button:not(.notabutton):hover .btn__text,
.btn:not(.notabutton):hover .btn__text,
a.btn:not(.notabutton):hover .btn__text {
  background: #000000 !important;
  border-color: #000000 !important;
  color: #ffffff !important;
}

/* The hero button is a solid cream pill. Its fill and border used to be set
   with !important in the section's own Custom CSS, but that section is at
   Shopify's 500-character cap, so the rule lives here. It has to out-rank two
   things in this file: 'border: 1px solid black !important' and
   '.button.altcolour { background: transparent !important }', hence the long
   selector. Scoped to .section-background-video so the community band, which
   uses the same overlay markup but wants a transparent fill and white border,
   is untouched. :not(:hover) leaves the black hover state alone. */

.section-background-video .overlay-text__button-row .button:not(:hover) {
  background: #ffffff !important;
  border-color: #ffffff !important;
}

/* Mobile: the stacked overlay buttons were running past the screen edge.
   Symmetry gives the row -7.5px side margins and each button +7.5px, so a
   button at width:100% of the row measured 370px + 15px of margin inside a
   375px screen. Zeroing both on mobile lines the buttons up with the text
   column above them. The width:100% itself is set in the sections' own
   Custom CSS, which is at Shopify's 500-character cap, so this lives here. */

@media only screen and (max-width: 767px) {
  .overlay-text__button-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .overlay-text__button-row .button {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

p a:hover {
  opacity: 0.7;
}

.product-description {
text-align: justify;
}

.majortitle{
text-transform:uppercase;
}


.product-form .quantity-submit-row .quantity-submit-row__submit button[type=submit], .product-block .image-cont .btn.quickbuy-toggle {
  border: 1px solid #212121 !important;
  color: #212121 !important;
  background: none !important;
  border-radius: 50px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.quickbuy-container .close-detail .feather {
  stroke: #212121;
}

.button--sold-out {
  background: none !important;
}


.product-block .block-inner .vendor {
  font-size: 12px;
  color: grey;
}

/*
.navigation .navigation__columns li:first-child  a{
  margin-bottom: 30px;
  text-transform: uppercase;
  text-decoration: underline;
}*/

/* LAYOUT */

.container {
  padding-left: 10px;
  padding-right: 10px;
}


.image-overlap {
  max-width: 100% !important;
}

.strongly-spaced-row, .fully-spaced-row--medium {
  margin-top: 40px;
  margin-bottom: 40px;
}


/* HEADER */


#NavigationTier2-3 {
  left: 0 !important;
}

.logo-area {
  border-bottom: none;
}

.logo .logo__image-transparent  {
  width: 100vw !important;
    position: fixed;
  top: 100%;
  transform: translate(0,-100%);
  left: 0;
  transition: 0.5s ease all;
  height: auto;
  pointer-events: none;
}

.section-header {
    --transparent-header-text-color: #ffffff;
}


.navigation {
  border-bottom: none;
}



.cart-link__icon {
  margin-left: 0;
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
.pageheader--layout-inline-permitted .logo-area__left {
    min-height: auto;
}

}



.pageheader .logo {
  padding: 10px 0;
}

  .logo-area__right .logo {
    margin-left: 30px;
  }

  .navigation--left .navigation__tier-1-container .navigation__tier-1>.navigation__item>.navigation__link {
    padding-top: 24px;
    padding-bottom: 22px;
  }


.navigation .navigation__wide-promotion .flexible-layout {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  margin-bottom: 0;
}


.navigation .navigation__wide-promotion .flexible-layout .column--half, .navigation .navigation__wide-promotion .rimage-outer-wrapper {
  width: 100% !important;
}

/*
.navigation .navigation__wide-promotion img {
  object-fit: contain !important;
}
*/
.navigation .navigation__wide-promotion {
  position: absolute !important;
  bottom: 63px !important;
  padding: 0;
  width: 100%;
}

.cart-drawer__empty-content svg {
  display: none;
}

a.remove {
    color: #8080808c;
    text-decoration: underline;
}

.cart-item-list-heading {
    display: none;
}

.cart-item__column.cart-item__description .variant:before {
    content: "Size ";
}



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

  .cart-link {
    margin-right: 10px;
  }

  .pageheader .logo {
    margin-top: 5px;
  }

  .cart-link__label {
display: inline-block !important;
}

#shopify-section-cart-drawer .use-alt-bg {
  display: none;
}
  
}

.buttoned-input {
  border: none;
}

.navigation .navigation__tier-1>.navigation__item>.navigation__link:before {
  display: none;
}



.pageheader--transparent .cart-link__count {
  color: white;
}

.cart-link__count {
  position: relative;
  background: none;
  color: #212121;
  right: 0;
  padding: 0;
}

.cart-link__count:before {
  content:"(";
 display: inline-block;
}
.cart-link__count:after {
  content:")";
 display: inline-block;
}

.header-account-link {
  order: 2;
}

.show-search-link {
  order: 1;
}

.cart-link {
  order: 3;
}

/* MEGA MENU */

/* 600px so no item wraps. The longest label, "Ritual - Smudging -
   Protection", is what sets this: measured item by item, the last one stops
   wrapping at 560px once the top-row link padding above is no longer applied
   in here, so 600 leaves ~40px for a label growing a word longer. At 400px it
   broke over two lines, along with five others. */

.pageheader--sticky+#main-nav .navigation .navigation__tier-2-container {
    min-height: calc(100vh - var(--theme-header-height)) !important;
  max-height: calc(100vh - var(--theme-header-height)) !important;
    overflow-y: auto !important;
    width: 600px !important;
  background: #CECCE6;
}

.navigation a:hover {
opacity: 0.6;
  text-decoration: underline;
}



#NavigationTier2-2, #NavigationTier2-5, #NavigationTier2-4 {
  left: 0 !important;
}

.mobile-navigation-drawer .navigation__mobile-header {
    border-bottom: 1px solid #212121 !important;
}

.mobile-navigation-drawer, .navigation .navigation__tier-1 {
  background: #ffffff;
}

/* Open-menu panel colours, one per top-level item. Numbered by position, so
   they follow the menu order rather than its labels: 1 Yoga + Team,
   2 Wellness Essentials Shop, 3 Community Events + Studio. Reordering the menu
   in the admin reassigns the colours — check them after any reorder.

   Each colour is set on the header panel and the mobile drawer panel
   together. The rule for 2 used to read `#NavigationTier2-2
   #NavigationTier2-2-mobMobileNav`, a descendant selector with the comma
   missing, so it matched nothing and that panel fell through to the #CECCE6
   default further up. Hence the purple. */

#NavigationTier2-1, #NavigationTier2-1-mobMobileNav {
  background: #3570A5 !important;
}

/* White links on the blue and the pink. Against dark #171717 the blue reads
   3.1:1 and the pink 3.9:1; white gives 5.2:1 and 4.2:1. The yellow keeps its
   dark links — 15.5:1, and white would be unreadable on it. The ID outranks
   the theme's own `.navigation__link` colouring. */

#NavigationTier2-1 .navigation__link,
#NavigationTier2-1-mobMobileNav .navigation__link,
#NavigationTier2-3 .navigation__link,
#NavigationTier2-3-mobMobileNav .navigation__link {
  color: #ffffff !important;
}

/* The wordmark at the foot of each panel is one shared asset,
   VVOO_LogoBlack_2_Traced.svg — black, with no white version in Files. It is
   a solid mark on transparency, so brightness(0) flattens every visible pixel
   to black and invert(1) turns that white: a clean white wordmark from the
   same file, and it keeps following the logo if the file is ever replaced.

   Blue and pink only. The yellow panel keeps the black mark, which reads
   there and matches its dark links. */

#NavigationTier2-1 .navigation__wide-promotion img,
#NavigationTier2-1-mobMobileNav .navigation__wide-promotion img,
#NavigationTier2-3 .navigation__wide-promotion img,
#NavigationTier2-3-mobMobileNav .navigation__wide-promotion img {
  filter: brightness(0) invert(1);
}

#NavigationTier2-2, #NavigationTier2-2-mobMobileNav {
  background: #FAFFC8 !important;
}

#NavigationTier2-3, #NavigationTier2-3-mobMobileNav {
  background: #B9626B !important;
}

/* Panels 4 and 5 were left over from a longer menu — the current one has
   three dropdowns. Their colours (#0277E6, #CECCE6) belonged to neither this
   palette nor those items, and would have been inherited by whatever landed
   in those positions next, so they are gone. */

.navigation .navigation__columns:not(.navigation__columns--5-cols):not(.navigation__columns--over-5-cols) {
  justify-content: start;
}

.navigation .navigation__columns {
  margin-top: 40px !important;
}



.navigation .navigation__columns .navigation__column:not(.navigation__column--promotion) .navigation__tier-3 {
  margin-left: 20px;
  margin-bottom: 20px;
}

@media only screen and (min-width: 767px) {

  .navigation .navigation__tier-2 .navigation__link, .navigation .navigation__item--with-small-menu>.navigation__tier-2-container .navigation__tier-2 .navigation__link {
    padding-bottom: 10px !important;
  }
  
.navigation .navigation__columns .navigation__column:not(.navigation__column--promotion) .navigation__column-title {
  text-transform: inherit;
  letter-spacing: 0;
  margin-bottom: 0px;
  margin-top: 20px;
}

  .navigation .navigation__columns .navigation__column:not(.navigation__column--promotion) .navigation__tier-3 .navigation__link {
    padding: 2px 0;
}
}

.navigation__column-title a {
  color: black;
}

.navigation .navigation__columns {
  padding-top: 0;
  flex-direction: column;
  margin: 0;
  margin-left: -10px;
}



.mobile-navigation-drawer .navigation__mobile-header {
  border: none;
}

.store-messages-mobile {
  background: #EDE8DA;
}

@media only screen and (min-width: 767px) {
.navigation .navigation__column {
    flex: 1 0 20%;
    max-width: 70%;
  padding: 0 10px;
}

  .navigation .navigation__tier-2 .navigation__link, .navigation .navigation__item--with-small-menu>.navigation__tier-2-container .navigation__tier-2 .navigation__link {
    padding: 2px;
  }
}



.navigation .navigation__item--with-small-menu>.navigation__tier-2-container .container {
  padding: 0;
}

.navigation .navigation__item--with-small-menu>.navigation__tier-2-container .container {
  margin-left: 15px;
}

.navigation .navigation__item--with-small-menu>.navigation__tier-2-container {
  border: 0;
}

.navigation .navigation__item--with-small-menu>.navigation__tier-2-container .navigation__link {
  color: #212121;
}

.js .section-header:not(.section-header--nav-hover):not(.section-header--nav-open) .pageheader--transparent + #main-nav .navigation .navigation__tier-1 {
  background: transparent !important;
}

/* MENU MOBILE */

.mobile-navigation-drawer .navigation__tier-2>.navigation__item>.navigation__link {
  padding-left: 10px;
}
.mobile-navigation-drawer .navigation__tier-2-container>.container {
  padding-left: 20px;
padding-right: 20px;
}

.mobile-nav-back {
  padding: 12px 10px;
}

.mobile-navigation-drawer {
  z-index: 99999999 !important
}



/* HOMEPAGE */

.feature-text-paired {
  margin-left: 0;
}

.flexible-layout.valign-middle>.column, .fixed-layout.valign-middle>.column {
  align-self: start;
}






@media only screen and (max-width: 767px) {
   #section-id-template--21006160363809__da74d939-5339-46ca-aa60-969cac1d2c03 .flexible-layout, #section-id-template--21006160363809__77fd577d-f3d0-48df-b0a8-4fa06b5a97cf .flexible-layout {
    flex-direction: row !important;
  }
  #block-id-template--21006160363809__da74d939-5339-46ca-aa60-969cac1d2c03-image-1, #block-id-a30ba6c1-908c-4537-86c8-e8c33971d60c {
    width: 50% !important;
    padding: 0px !important;
  }

#block-id-6f88a3a4-2d85-40f2-b101-67815a8083d9 {
  width: 60% !important;
  padding: 0 !important;
  padding-right: 10px !important;
}

 #block-id-35444cc4-8e4c-44ea-9fa7-58ab78bc26fa {
    width: 40% !important;
      padding: 0 !important;
  }
  
  #block-id-template--21006160363809__da74d939-5339-46ca-aa60-969cac1d2c03-text-1, #block-id-ebb22126-d279-4428-b646-7f74880cf0b8 {
    width: 100% !important;
  }

  #block-id-template--21006160363809__da74d939-5339-46ca-aa60-969cac1d2c03-image-1 {
    padding-right: 5px !important;
  }

  #block-id-a30ba6c1-908c-4537-86c8-e8c33971d60c {
    padding-left: 5px !important;
  }
  
#block-id-6f88a3a4-2d85-40f2-b101-67815a8083d9 {
  margin-bottom: 0 !important;
}

  #section-id-template--21006160363809__da74d939-5339-46ca-aa60-969cac1d2c03 {
  padding: 40px 10px !important;
}

  #shopify-section-template--21006160363809__d375cb65-6f1a-4ed6-9979-5196fd0427b1 .flexible-layout .column {
    margin: 0 !important;
  }
  
}


/* TREATMENTS */

#shopify-section-template--21333271675169__6de9897a-2bd0-4c04-8549-4a2870348122 .flexible-layout .column--quarter {
  width: 20% !important;
}

#shopify-section-template--21333271675169__6de9897a-2bd0-4c04-8549-4a2870348122 img {
  height: 600px;
}

@media only screen and (max-width: 767px) {
  #section-id-template--21333271675169__6de9897a-2bd0-4c04-8549-4a2870348122 .flexible-layout {
    flex-direction: row;
  }

#shopify-section-template--21333271675169__53551f51-5ba7-4aa5-9b21-cce1e73acda4 .flexible-layout,  #shopify-section-template--21333271675169__1c5d0810-5295-42ac-bc7e-504a6719b97c .flexible-layout, #section-id-template--21333271675169__59aae876-6fae-4fc3-a348-f1cb4049c068 .flexible-layout,#shopify-section-template--21333271675169__8a10ad38-20f1-4670-841d-3e8492c4bdbb .flexible-layout,#shopify-section-template--21333271675169__5ab4da66-1e1f-4eae-9261-b5510d117e72 .flexible-layout, #shopify-section-template--21333271675169__a7a43837-ae42-4f54-9cd9-ffc5a72d0ae4 .flexible-layout {
  flex-direction: column-reverse !important;
}

#section-id-template--21333271675169__f86eda2d-8b11-412f-8ec4-a3d205c6c0d6 {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

  #shopify-section-template--21333271675169__53551f51-5ba7-4aa5-9b21-cce1e73acda4 .btn.btn--secondary, #shopify-section-template--21333271675169__6e3ad79d-9dd6-4d3b-9102-361c03c485ea .btn.btn--secondary, #shopify-section-template--21333271675169__6bb07b2f-b2b8-4aef-b6fe-36948972a44e .btn.btn--secondary {
  margin-bottom: 30px;
}

 .template-suffix-treatments  .flexible-layout .column:last-child {
   margin-bottom: 30px;
 }


  .template-suffix-treatments .flexible-layout {
    padding: 0 !important;
  }
  
#block-id-6bbbd754-f1fb-4d2b-84f9-351e8cecc969 h2 {
  font-size: 30px !important;
}
  
}



  /* YOGA */



  @media only screen and (min-width: 1023px) {
    #shopify-section-template--21233458381089__ad519dcb-5253-467f-af19-38bb2236bb78 .lightish-spaced-row-above {
      margin-left: 10px;
    }

#block-id-ab4b0a42-b98e-423f-9669-dd6981b18e8a, #block-id-731f889e-d9a9-4fdb-9f2b-c1aca11aca08 {
  padding-left: 10px;
}
    
  }

  @media only screen and (max-width: 767px) {
#section-id-template--21233458381089__ad519dcb-5253-467f-af19-38bb2236bb78 .flexible-layout {
  flex-direction: row !important;
}

    #block-id-399b5063-b331-4024-9f81-fa8db12d3aa8 {
      width: 100% !important;
    }

    #block-id-ab4b0a42-b98e-423f-9669-dd6981b18e8a, #block-id-731f889e-d9a9-4fdb-9f2b-c1aca11aca08{
      width: 50% !important
    }

    
  }

  #block-id-ab4b0a42-b98e-423f-9669-dd6981b18e8a {
  align-self: end;  
  }


/* PRODUCT collection */



.product-block .product-info {
  text-align: center;
  line-height: 1.1em !important;
}

.product-price {
  justify-content: center;
}

.link-dropdown__button-icon, .toggle-btn .toggle-btn__chevron{
  
display: none !important;
}

.button-icon {
  display: none;
}

.link-dropdown__options {
  box-shadow: none;
}

.link-dropdown .link-dropdown__button {
  padding: 0 !important;
}

.filter-toggle__options {
  background: none;
}

.cc-price-range__input-container {
  border: none;
  border-bottom: 1px solid #212121;
}

.cc-price-range__bar-active {
    top: -4px;
    right: 0;
    height: 1px;
    background: #222222;
    border-radius: 0px;
}

.cc-price-range__control:after {
    width: 12px;
    height: 12px;
    background: #ffffff;
    border: 1px solid #222222;
}

.cc-price-range__bar-inactive {
  display: none;
}

.collection-listing .product-block {
  padding-left: 10px;
}

.collection-listing .product-list {
  margin-left: -10px;
}

/*
.image-cont--with-secondary-image .image-page-button, .product-block__image-dots {
  display: none;
}*/

.collection-listing .product-block {
  margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
#shopify-section-template--21006160593185__recommendations .container {
  margin-top: 50px !important;
}
  
}


.thumbnails .thumbnail:after {
  height: 1px;
}

.owl-carousel .owl-stage {
  display: flex;
  flex-direction: row;
}

.thumbnails.owl-carousel {
  width: 90%;
}

.product-block .block-inner .vendor {
    margin: 0em 0 0.4em;
}
/* FOOTER */


#pagefooter {
  margin-top: 100px;
}


.footeranna {
  color: #171717;
  display: flex;
  flex-direction: row;
  justify-content: start;
  margin-bottom: 50px;
  width: 100%;
  border-bottom: .5px solid #171717;
  padding-bottom: 50px;
}

.brand {
  width: 67%;
}

.studio {
  width: 28%;
}

@media only screen and (max-width: 767px) {
  .footeranna {
    flex-direction: column;
    padding-left: 10px;
    padding-right: 10px;
    gap: 40px;
  }

  .studio, .brand {
    width: 100%;
  }
}

.footerannacopyright {
    color: #171717;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 50px;
  padding-top: 50px;
  border-top: .5px solid #171717;
  margin-bottom: 10px;
  width: 100%;
}

.footerannacopyright img:hover {
  transform: rotate(180deg);
  transition: 5s ese all;
}

.footerannacopyright p {
  opacity: 0.7;
}

.footeranna .brand p {
  max-width: 600px;
}

@media only screen and (min-width: 767px) {


  #pagefooter {
      padding: 10px;
  }

  .section-footer__newsletter-block {
    flex: 0 1 33%;
}
}

.section-footer__row__col {
  padding: 0;
}

.section-footer__row-lower {
  flex-wrap: wrap;
}

.section-footer__row--blocks {
  padding: 0;
}

.section-footer__row-lower {
  padding: 0;
  margin-top: 10px;
}

.section-footer__row-container {
  border: none;
}

.section-footer__localization {
  display: none;
}

input[type=text], input[type=number], input[type=email], input[type=password], input[type=address], input[type=tel], textarea {
  border: 0;
}

::placeholder {
 color: #8c8c8c !important; 
}

button.btn.btn--primary.signup-form__button {
color: #8c8c8c;
}

.signup-form input[type=email] {
  width: 100%;
  padding: 0 !important; 
  padding-bottom: 10px !important;
  border-bottom: 1px solid #8c8c8c !important;
}

.signup-form p {
  margin-bottom: 0; 
  width: 100%;
}

.isotipo img {
  width: 70%;
  float: right; 
  margin-right: -10px;
}

.signup-form .button, .signup-form a.button, .signup-form .btn,.signup-form  a.btn,.signup-form  button,.signup-form .signup-form input[type=submit], .signup-form input[type=reset],.signup-form input[type=button] {
  padding: 0 !important;
  width: 20% !important;
}

#shopify-section-footer button, #shopify-section-footer .btn {
  margin-right: 0px !important;
}

#shopify-section-footer button span {
  text-tranform: lowercase !important;
}

#footer_newsletter_signup {
  display: flex !important;
  width: 100%;
justify-content: space-between;
  flex-wrap: nowrap !important;
}


#footer_newsletter_signup {
  margin-top: -20px; 
}

.copyright {
  display: none;
}

/*
.section-footer__row--blocks .section-footer__row__col:nth-child(3) {
  width: 18% !important;
}

.section-footer__row--blocks .section-footer__row__col:nth-child(2) {
  margin-right: -30px;
}



*/



selector[data-type=lsn-switchers] .lsn-switcher {
  padding: 0 !important;
  background: none !important;
}

.lsn-select__arrow {
  display: none !important;
  border-color: transparent !important;
}

@media only screen and (max-width: 767px) {
  .shfooter {
  padding-bottom: 10px;
}
}

/* HOMEPAGE */

@media only screen and (min-width: 767px) {
#shopify-section-template--17514396909832__98fb5713-cec2-41ea-805f-cde8d01d5aaf .overlay-text {
  border-left: 10px solid #F6F4ED;
  border-bottom: 10px solid #F6F4ED;
  border-right: 10px solid #F6F4ED;
      box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

  


#shopify-section-template--17514396909832__ecc3be47-84af-462f-9d21-5da8d8085c07 .rimage-wrapper {
  padding-top: 100% !important;
}

#shopify-section-template--17514396909832__ecc3be47-84af-462f-9d21-5da8d8085c07  .rimage-wrapper .rimage__image.cover {
    object-fit: contain !important;
  }

  #shopify-section-template--17514396909832__183033cc-28fd-4675-b5ea-ef07b53e7e3e .rimage-wrapper {
  padding-top: 100% !important;
}

#shopify-section-template--17514396909832__183033cc-28fd-4675-b5ea-ef07b53e7e3e  .rimage-wrapper .rimage__image.cover {
    object-fit: contain !important;
  }
  
}

.collection-slider-row {
  overflow: visible;
}

@media only screen and (max-width: 767px) {
.collection-slider-row.for-collections .collection-listing .product-list .product-block {
    width: 100%;
}

  #section-id-template--17514396909832__7a5aaacb-0492-4b15-9bca-f4b4a5d81d2b {
    display: none;
  }
}

#shopify-section-template--17514396909832__7f423f07-f565-4c1c-b0a5-16852f11de95 {
  padding-top: 50px;
}


#shopify-section-template--17514396909832__34273f37-f146-4cda-a4d0-f75755699d88 .collection-listing .product-list {
  flex-direction: row-reverse;
}

#shopify-section-template--17514396909832__c44e1fa3-2fd5-416d-987d-d152ac96f918 .flexible-layout.valign-middle>.column, #shopify-section-template--17514396909832__c44e1fa3-2fd5-416d-987d-d152ac96f918 .fixed-layout.valign-middle>.column {
  align-self: start !important;
}


@media only screen and (min-width: 767px) {
#shopify-section-template--17514396909832__34273f37-f146-4cda-a4d0-f75755699d88 {
  margin-top: -585px;
  margin-bototm: 100px;
}

#shopify-section-template--17514396909832__c44e1fa3-2fd5-416d-987d-d152ac96f918 p {
  padding-left: 25px;
}

  #shopify-section-template--17514396909832__183033cc-28fd-4675-b5ea-ef07b53e7e3e {
    margin-top: 200px;
  }
  
}


/* PRODUCT LANDING */

/*
#shopify-section-template--21006160593185__main {
  background: #8A7C6D;
    margin: 0;
  padding: 50px 0;
}*/



.product-detail .gallery-size-small {
  background: #F2EFE8;
}

.product-detail .gallery-size-small+.product-column-right {
  background: #8A7D6D;
  padding: 10px;
  padding-bottom: 50px;
}

@media only screen and (max-width: 767px) {
  .product-detail .gallery-size-small+.product-column-right {
    padding-top: 40px;
  }

  .thumbnails {
    margin-bottom: 0;
  }
}

.product-detail .gallery .main-image {
  margin: 0;
}

.kl {
  margin-bottom: -10px;
}

@media only screen and (min-width: 1023px) {

.product-detail .gallery-size-small+.product-column-right {
  width: 50%;
  max-width: 50%;
  background: #8A7D6D;
  padding: 50px;
  margin: 0;
}

.product-detail .gallery-size-small {
  width: 50%;
}

}

.price-container {
  flex-direction: column;
}

#shopify-section-template--21006160593185__main .container {
 padding: 0 !important; 
}

#shopify-section-template--21006160593185__main {
  margin-top: 0;
}

.product-detail .cc-accordion-item__title {
  font-weight: 400 !important;
}

.cc-accordion, .cc-accordion-item {
  border: none;
}

.cc-accordion-item__title {
  padding: 0px 30px 0px 0px;
}

.cc-accordion-item__content {
  padding-top: 10px;
  padding-bottom: 10px;
}

.option-selector--empty {
    color: black;
}

.product-form .quantity-submit-row.has-spb .button {
  border-color: grey;
  color: black;
}

.product-form .quantity-submit-row.has-spb .button:hover {
  color: black;
  border-color: black;
}



.slick-product-prev:after, .slick-product-next:after {
  background: none;
}






/*
.template-product .container {
  max-width: 100%;
}

/*
.template-product .rimage-wrapper .rimage__image {
  max-height: 100vh;
  object-fit: cover;
}*/





.template-product .rimage-outer-wrapper {
  margin: 0;
  width: 100%;
  max-width: 100%;
}

*/

.template-product .page-section-spacing {
  margin-top: 0;
}



.opt-label {
  border: none;
  min-height: 0;
  background: none;
  min-width: 0;
  padding: 0;
  margin-right: 20px;
}


.product-form .label {
  font-weight: 400;
}

.opt-btn.is-unavailable+.opt-label {
  background: none;
  opacity: 0.3;
}

.opt-btn:checked+.opt-label {
  padding: 5px;
  box-shadow: none;
}

.rimage-wrapper {
  max-widht: 80%;
  margin: auto;
}

 .size-chart-link__icon{
   display: none;
 }


@media only screen and (min-width: 767px) {
#section-id-template--17514397139208__79ed8e5d-29b0-49f6-9c4c-8fd28e6c075f .flexible-layout, #section-id-template--17855615959304__79ed8e5d-29b0-49f6-9c4c-8fd28e6c075f .flexible-layout{
  flex-wrap: nowrap;
}


  #section-id-template--17514397139208__79ed8e5d-29b0-49f6-9c4c-8fd28e6c075f .flexible-layout--variable-columns .column,   #section-id-template--17855615959304__79ed8e5d-29b0-49f6-9c4c-8fd28e6c075f .flexible-layout--variable-columns .column {
  width: 20%;
}

  /*
  .product-detail .gallery-size-small {
    margin-left: 90px;
  }
}


.template-product .flexible-layout--variable-columns .column p, .template-product .flexible-layout--variable-columns .column .text-column__title {
  padding-right: 15%;
}

.template-product .flexible-layout--variable-columns .column .text-column__title {
  text-decoration: underline;
}

*/
.product-form .label {
  text-transform: capitalize;
}

#block-id-template--17514397139208__5439b9d9-8f4f-42d6-8f92-8a8458291dd4-1676470920ed778cb2-0 {
  margin-left: -20px;
}


@media only screen and (max-width: 767px) {
  #section-id-template--17514397139208__79ed8e5d-29b0-49f6-9c4c-8fd28e6c075f, #section-id-template--17855615959304__79ed8e5d-29b0-49f6-9c4c-8fd28e6c075f {
    display: none;
  }
}

@media only screen and (min-width: 767px) {
  #shopify-section-template--17514397139208__5343ce1c-bf48-4e98-8132-cc708c552e34, #shopify-section-template--17855615959304__5343ce1c-bf48-4e98-8132-cc708c552e34 {
    display: none;
  }
}

.price-area .h4-style {
  text-align: center;
}


.product-form .quantity-submit-row .quantity-submit-row__submit button[type=submit] {
  border: 1px solid #8c8c8c;
  transition: 0.4s ease;
}

.product-form .quantity-submit-row .quantity-submit-row__submit button[type=submit]:hover {
  border: 1px solid black;
}


@media only screen and (max-width: 767px) {
.flexible-layout .column {
  margin-bottom: 10px !important;
}
#shopify-section-template--17514396909832__f2cb8210-af75-4c58-b7c4-8daa46450d66 .collection-listing .product-list .product-block:last-child {
  display: none !important;
}
  
}

#naiz-sizeform-opener {
  padding: 0 !important; 
  border: 0 !important;
  width: 100%;
/*  text-align:right;*/
  text-decoration: underline;
}

.naiz-shim .naiz-modal {
  box-shadow: none !important;
}

.naiz-shim .cancel:before, .naiz-shim .cancel:after {
  height: 1px !important;
}

.naiz-modal #naiz-application-recommend-step-form .area.area-form .select select {
  font-weight: 400 !important;
}

.naiz-shim .naiz-modal .area.area-form .select .select-select select {
  border-radius: 0 !important;
}


.naiz-shim .naiz-modal .area-main .area-application-selection .switcher .switcher-primary, .naiz-shim .naiz-modal .area-main .area-application-selection .switcher .switcher-secondary {
  font-sieze: 12.5px !important
}

#naiz-sizeform-opener {
  text-align: right;
  position: absolute;
  bottom: 110px;
}

@media only screen and (max-width: 767px) {
   #naiz-sizeform-opener { 
     bottom: 87px;
  }
}

  .thumbnails .thumbnail::after {
    height: 1px;
  }




/* ABOUT US */
  
@media only screen and (max-width: 767px) {
#shopify-section-template--21332040614177__d8591883-5707-48c4-b7f6-df93038baaeb .inline-width-container {
  position: relative;
}

}

  @media only screen and (min-width: 1023px) {
    #shopify-section-template--21332040614177__d8591883-5707-48c4-b7f6-df93038baaeb p {
      max-width: 70%;
      margin: auto;
    }
  }

/* CART */

  

#shopify-section-template--17514396844296__main h1 {
  display: none;
}

.cart-item-list-heading--total, .cart-item__total {
  width: auto;
}



#shopify-section-template--17514396844296__main {
  max-width: 700px !important;
  margin: auto;
}

#cartform .checkout-col .button {
  border: 1px solid black;
}

.buttoned-input {
  border: none;
}

.cart-item .remove svg {
  display: none !important;
}

.cart-summary-overlay {
  background: #EBE8DE;
}

.button.altcolour, .btn.btn--secondary, button.altcolour, input[type=submit].altcolour, input[type=reset].altcolour, input[type=button].altcolour, .product-form .quantity-submit-row.has-spb .button {
  background: transparent !important;
}

.button.altcolour:hover, .btn.btn--secondary:hover, button.altcolour:hover, input[type=submit].altcolour:hover, input[type=reset].altcolour:hover, input[type=button].altcolour:hover {
  color: black;
}

  @media only screen and (min-width: 768px) {
    .cart-item__image {
      width: 230px !important;
    }
.cart-drawer .rimage-outer-wrapper {
  max-width: 100% !important;

}

.cart-drawer    .rimage-wrapper .rimage__image {
  object-fit: cover !important;
}
    
    
  }

  #shopify-section-cart-drawer .rimage-wrapper {
    padding-top: 100% !important;
  }

  .owl-stage > div {
    width: 180px !important;
  }

/* BLOG */

blockquote::before {
  display: none !important;
}

.article .container{
    max-width: 650px;
}

.article .meta .time {
    display: none;
}

.template-article .majortitle {
    text-transform: uppercase;
}

/* size-guide */

@media only screen and (min-width: 767px) {
.shopify-section-template--17690615972104__main img{width:100% !important}
}

/* cookies */

.cc-btn {
  border-radius: 0 !important;
  border: 1px solid black !important;
}

.cc-btn, .cc-settings-dialog label {
  font-weight: 400 !important;
}


.cc-color-override-28801235.cc-window {
background-color: #F6F4ED !important;
}

.cc-settings-dialog .cc-consent-verification a {
  text-shadow: none !important;
  color: black !important;
  font-weight: 400 !important;
}

  .Avada-CookiesBar__OuterWrapper .Avada-CookiesFloat_Bar {
    border-radius: 0!important;
    padding: 10px;
  }

#shopify-section-template--17514396909832__7f423f07-f565-4c1c-b0a5-16852f11de95 {
  padding-top: 0;
} 


@media only screen and (min-width: 1023px) {
  #shopify-section-template--21333271675169__6de9897a-2bd0-4c04-8549-4a2870348122{
    margin-bottom: 100px !important;
  }

  #section-id-template--21333271675169__162c4fbf-8fce-41f2-8006-9006b49d2dbb {
  margin-top: 80px !important;
  }
}

.store-availability-container .store-availability-information .store-availability-icon {
  display: none;
}


.needsclick .klaviyo-form .klaviyo-form-version-cid_1 .go3279073480 .kl-private-reset-css-Xuajs1, .needsclick  .kl-private-reset-css-Xuajs1 {
    padding: 0 !important;
  }

  #email_01JZ01FAQWPKFKS3M1K9DFDJ7N, .go300628013 {
    border-radius: 0px !important;
    background: none !important;
  }

  #email_01JZ01FAQWPKFKS3M1K9DFDJ7N, .go300628013 {
    padding: 10px !important;
  }
  .needsclick .go300628013 .kl-private-reset-css-Xuajs1 {
    background: none !important;
    border-bottom: 1px solid black !important;
  }

  ::placeholder {
    color: black !important;
  }