/** Shopify CDN: Minification failed

Line 498:12 Expected identifier but found whitespace
Line 498:13 Unexpected "\"rhythm-one\""

**/
.header-wrapper {
  background: var(--header-wrapper-background);
}

.header-wrapper .grid__wrapper:not(.megamenu) {
  grid-row-gap: 0;
  align-items: center;
}

.header-wrapper.nav__option-full .nav-container {
    padding-top: 10px;
    padding-bottom: 10px;
}

/* ---- Header group section index ----*/
div#header-group .shopify-section:last-child {
  z-index: 1;
  position: relative;
}

div#header-group .shopify-section:first-child {
  position: relative;
  z-index: 4;
}

div#header-group .shopify-section:nth-child(2) {
  position: relative;
  z-index: 3;
}

div#header-group .shopify-section:nth-child(3) {
  position: relative;
  z-index: 2;
}

/* ---- Logo ----*/
#logo {
  line-height: initial;
  position: relative;
  margin-bottom: 10px;
  margin-top: 10px;
}

#logo a {
  vertical-align: middle;
  font-family:var(--heading-family);
  font-weight: var(--heading-weight);
  font-style: var(--heading-style);
  color: var(--header-link-color);
  text-decoration: none;
  font-size: var(--h1-size);
  display: flex;
}

#logo.a-center a {
  justify-content: center;
}

#logo.a-left a {
  justify-content: start;
}

@media (max-width: 980px) {
  #logo.a-left a {
    justify-content: center;
  }
}


/* ---- Shopping cart links ----*/
ul.shopping__cart-links {
  list-style: none;
  display: flex;
  flex-direction: row;
  grid-gap: 15px;
  justify-content: end;
  align-items: center;
  margin-bottom: 0;
}

.cart-links__link-cart button {
  margin: 0;
  padding: 0;
  gap: 5px;
  color: var(--header-link-color);
}

ul.shopping__cart-links li a,
ul.shopping__cart-links li span,
ul.shopping__cart-links li button {
  margin-bottom: 0;
  padding: 0;
}

ul.shopping__cart-links li {
  display: flex;
  align-items: center;
  line-height: 0;
}

ul.shopping__cart-links li svg {
  height: 18px;
}

.my-cart-link-container > button > svg {
  width: 21px;
}

ul.shopping__cart-links li button {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 980px) {
  ul.shopping__cart-links svg {
    height: 18px;
  }
}

ul.shopping__cart-links li button:focus, 
ul.shopping__cart-links li a:focus {
  outline-offset: 2px !important;
}

.header-section span.js-cart-count {
  background: var(--cart-count-background);
  color: var(--cart-count-text);
  width: .9rem;
  height: .9rem;
  border-radius: 50%;
  font-size: .6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -4px;
  right: -10px;
}

.cart-links__link-cart button {
  position: relative;
}

/* ---- Navigation ---- */
.navigation {
  background: var(--header-wrapper-background);
	list-style: none;
	text-align: center;
	margin-bottom: 0;
	position: relative;
	width: 100%;
	z-index: 10;
}

.navigation--sticky.navigation {
	position: fixed !important;
	top: 0;
	left: 0;
	z-index: 40;
}

.navigation__menu {
	margin-bottom: 0;
}

.navigation__menuitem {
	display: inline-block;
  transition: background .5s ease;
}

.navigation__menuitem:hover {
	background: var(--nav-hover-color);
}

/* ul#main-nav li a */
.navigation__menulink {
	font-family: var(--nav-family);
	font-weight: var(--nav-weight);
  font-style: var(--nav-style);
	font-size: var(--nav-size);
	color: var(--nav-color);
	display: block;
	padding: 0 20px !important;
  position: relative;
  letter-spacing: var(--nav-spacing);
}

.navigation__menulink:visited {
  color: var(--nav-color);
}

.navigation__menulink.is_upcase-true {
  text-transform: uppercase;
}

/* ul#main-nav li a:hover { */
.navigation__menulink:hover {
	color: var(--nav-hover-link-color);
	text-decoration: none;
	border-bottom: none;
}

.navigation__menulink:hover svg .hover-fill {
	fill: var(--nav-hover-link-color);
}

/* ul#main-nav li a:visited { */
.navigation__menulink:visited {
	border-bottom: none;
}

.navigation__menuitem.navigation__menuitem--dropdown > .navigation__menulink svg {
  margin-left: 5px;
}

/* Creating a separate BEM block here to style the dropdown submenus. Calling them dropdowns. Alyssa, thoughts? */

.dropdown {
	display: none;

	position: absolute;
	padding: 10px 10px 10px 20px;
	z-index: 5;

	background: var(--dropdown-background-color);

	border-bottom: 1px solid var(--nav-border-color);
	border-left: 1px solid var(--nav-border-color);
	border-right: 1px solid var(--nav-border-color);
}

.navigation__menuitem--dropdown:hover .dropdown:not(.dropdown--nested),
.navigation__menuitem--active.navigation__menuitem--dropdown .dropdown:not(.dropdown--nested) {
	display: block;
}

/* ul#main-nav li ul.submenu li{ */
  .navigation__menuitem ul li.dropdown__menuitem {
	line-height: 1.8rem;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	background: transparent !important;

	min-width: var(--dropdown-min-width);

	display: block;
	position: relative;

	text-align: left;
}

.dropdown__menuitem:hover {
	background: var(--dropown-hover-background) !important;
}

/* ul#main-nav li ul.submenu li a { */
.dropdown__menulink {
	width: 100%;
	text-align: left;
	text-transform: none !important;
	color: var(--dropdown-link-color) !important;
	font-size: var(--font-size);
	font-family: var(--main-family) !important;
  font-weight: var(--main-weight);
  font-style: var(--main-style);
	display: block;

	/* To stop text from going over the arrow. */
	max-width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ul#main-nav li ul.submenu li a:hover { */
.dropdown__menulink:hover {
	color: var(--dropdown-link-hover-color) !important;
}

.dropdown__menulink:hover svg .hover-fill {
	fill: var(--dropdown-link-hover-color) !important;
}

.dropdown__menuitem--nested.dropdown__menuitem svg {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.dropdown--nested.dropdown {
	display: none;
}

.dropdown__menuitem:hover > .dropdown--nested.dropdown,
.dropdown__menuitem.dropdown__menuitem--active > .dropdown--nested.dropdown {
	position: absolute;
	left: 100%;
	padding: 10px 10px 10px 20px;
	top: -10px;
	background: var(--dropdown-background-color);
	border: 1px solid var(--nav-border-color);
	display: block;
}

.dropdown__menuitem:hover > .dropdown--nested.dropdown--edge.dropdown,
.dropdown__menuitem.dropdown__menuitem--active > .dropdown--nested.dropdown--edge.dropdown {
  --padding: 15px;
	left: initial;
	right: calc(100% + var(--padding));
}

.navigation__menuitem.js-menuitem-with-nested-dropdown > .dropdown--edge {
  --padding: 15px;
  left: initial;
  right: calc(0px + var(--padding));
}

/* Megamenu styles. */

.megamenu.grid__wrapper {
  display: none;
  position: absolute;
  left: 0;
  z-index: 4;
  line-height: initial;
  padding: 10px 25px !important;
  background: var(--dropdown-background-color);
  border: 1px solid var(--nav-border-color);
  width: 95%;
  left: 2.5%;
  max-width: 95%;
  margin: 0;
}

.megamenu__list-container {
    display: flex;
    justify-content: center;
}

.megamenu__wrapper {
    flex-flow: column wrap;
    flex: 1 1 auto;
    columns: 4;
    padding: 20px 0;
    line-height: 1.4rem;
}

li.megamenu__listcontainer {
    break-inside: avoid;
    page-break-inside: avoid;
    padding: 0 10px;
}

ul.megamenu__ulcontainer {
    padding: 0 10px;
}

.mm-image {
    padding: 20px 0;
}

.nav-inner-container.nav_inline_center .navigation__menu {
  position: unset;
}

.nav-inner-container.nav_inline_center .navigation__menu ul.megamenu {
  width: 100%;
}

@media screen and (min-width: 1680px) {
  .nav-inner-container.nav_inline ul.megamenu {
      left: 50%;
      margin-left: -700px;
  }
}

@media screen and (min-width: 1220px) and (max-width: 1679px) {
  .nav-inner-container.nav_inline ul.megamenu {
      left: 50%;
      margin-left: -600px;
  }
}

@media screen and (min-width: 981px) and (max-width: 1219px) {
  .nav-inner-container.nav_inline ul.megamenu {
      left: 50%;
      margin-left: -480px;
  }
}

.navigation__menuitem:hover > .megamenu,
.navigation__menuitem--active.navigation__menuitem > .megamenu {
	display: grid;
}

.megamenu span.grid__wrapper.grid__wrapper-nest {
    padding: 0 3%;
    grid-column-gap: 30px;
}

.megamenu__collection-image {
  width: 100%;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 15px;
  background-color: transparent;
}

.megamenu__collection-image .box-ratio {
  padding-bottom: 50% !important;
}


.megamenu__collection-image .box-ratio img {
  object-fit: cover;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
 }


.megamenu__header {
	padding: 0 0 5px;
  font-family: var(--main-family) !important;
  color: var(--dropdown-link-color);
  margin-bottom: 10px;
  text-align: left;
  font-size: var(--nav-size);
  line-height: 1.4rem;
}

.megamenu__headerlink {
	padding-left: 0;
}

.megamenu__list {
  width: 100%;
	background: var(--dropdown-background-color);
}

.megamenu__listcontainer {
	list-style-type: none;
}

.megamenu__listcontainer:hover {
  background: transparent !important;
}

.megamenu__listitem {
	line-height: unset !important;
  text-align: left !important;
  display: block !important;
  clear: left;
  padding: 0 0 5px;
}

.megamenu__listlink {
  padding: 0 !important;
  font-weight: var(--main-weight);
  color: var(--dropdown-link-color) !important;
  font-size: var(--font-size) !important;
  font-family:var(--main-family) !important;
  font-weight: var(--main-weight);
  font-style: var(--main-style);
  background: transparent !important;
  text-transform: none !important;
}

.megamenu__listlink:hover {
	color: var(--dropdown-link-hover-color) !important;
}

ul.megamenu li.desktop-3:nth-child(5n) {
  clear: left;
}

ul.megamenu__ulcontainer {
    margin-top: 20px;
}

/* ---- Mobile menu button ==== */
.mobile-menu__trigger button {
  width: auto;
}
font-family: "rhythm-one", sans-serif;
font-weight: 400;
font-style: normal;