/*
Theme Name: Cookie Child Theme
Theme URI:
Description: Child theme of Cookie
Author: snart cookie
Author URI:
Template: cookie
Description: A webshop full of interior decoration
Version: 1.2.2
License:         	GNU General Public License v2 or later
License URI:     	http://www.gnu.org/licenses/gpl-2.0.html
*/

/* --------------------------------

File#: _1_smooth-scrolling
Title: Smooth Scrolling
Descr: Replace the default browser behaviour (jump) with a smooth scrolling transition
Usage: codyhouse.co/license

-------------------------------- */
html {
  scroll-behavior: smooth;
}

/* COUNTDOWN */
/* --------------------------------

File#: _1_countdown
Title: CountDown
Descr: Widget to display a timer
Usage: codyhouse.co/license

-------------------------------- */
.countdown {
  display: flex;
  align-items: baseline;
}

.countdown__timer {
  display: inline-block;
}

.countdown__item {
  display: inline-block;
}
.countdown__item:nth-of-type(2)::after, .countdown__item:nth-of-type(3)::after {
  content: ":";
}

.countdown__value {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.countdown--has-labels .countdown__item {
  margin-right: var(--space-xs);
}
.countdown--has-labels .countdown__item:last-child {
  margin-right: 0;
}
.countdown--has-labels .countdown__item::after {
  content: "";
}
.countdown--has-labels .countdown__label {
  font-size: 0.45em;
}

.countdown--grid .countdown__timer {
  --timer-gap: var(--space-xxxs);
  display: flex;
  margin-left: calc(-1 * var(--timer-gap));
}
.countdown--grid .countdown__item {
  width: 1.6em;
  text-align: center;
  padding: var(--space-xxxxs) 0;
  margin-left: var(--timer-gap);
}
.countdown--grid .countdown__item::after {
  content: "";
}
.countdown--grid .countdown__label {
  display: block;
  text-transform: uppercase;
  font-size: 0.2em;
  letter-spacing: 0.1em;
  color: var(--color-contrast-medium);
}

.countdown__fallback {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
		  clip-path: inset(50%);
}

/* PREHEADER */
/* --------------------------------

File#: _1_pre-header
Title: Pre-header
Descr: Pre-header (top) banner
Usage: codyhouse.co/license

-------------------------------- */
.pre-header {
  display: block;
  background-color: var(--color-contrast-higher);
  color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.pre-header--is-hidden {
  display: none;
}

.pre-header__close-btn {
  position: absolute;
  right: 0;
  top: calc(50% - 0.5em);
  will-change: transform;
  transition: 0.3s var(--ease-out-back);
}
.pre-header__close-btn:hover {
  transform: scale(1.1);
}
.pre-header__close-btn .icon {
  display: block;
}

a.pre-header {
  text-decoration: none;
  transition: background-color 0.2s;
}
a.pre-header:hover {
  text-decoration: underline;
  background-color: var(--color-contrast-high);
}

/* END COUNTDOWN */
/* if sale */
.bflink:hover {color:#ffffc0;}
b.bg-black  {padding: 4px;}
	.summary h1.entry-title {margin-top: 10px;}


	.content-area .summary .onsale {
	color: black !important;
	background: #f4e98c !important;
	padding: 6px !important;
}

	.content-area .summary .onsale {
	color: black !important;
	background: #f4e98c !important;
	padding: 6px !important;
}

.summary h1.entry-title {margin-top: 10px;}
.woocommerce-variation-price .price .amount {font-size:22px;}
tr.woocommerce-cart-form__cart-item .product-name {font-size: 1.1rem !important;}
/* Menu blokken op homepage */


.webwinkelkeur-rich-snippet {display: none;}
/* #wwkSidebarMobile {bottom:-250px !important;} */
.tekstfunq a,
body.error404 .text-component a:not(.btn) {
	font-size: 1rem !important;
	margin-top: 0 !important;
	font-weight: normal !important;
	padding: auto !important;
	}

.tekstfunq a:before,
.tekstfunq a:after,
body.error404 .text-component a:not(.btn):before,
body.error404 ..text-component a:not(.btn):after {border-bottom: 2px solid #222 !important;}

 ul.checkout-bar {z-index: 1 !important;}
.woocommerce-cart ul.checkout-bar li.active,
.woocommerce-checkout ul.checkout-bar li.active {z-index:1 !important;}

body.home section.padding-y-xl {padding-top:0 !important;}
.woocommerce-account .edit-account .button,
.woocommerce-Button {margin-top:20px;}

.card-v9__btn::after,
.cgkit-fsn-amount,
a.button.wc-forward:hover,
.woocommerce div.product form.cart .button,
.bottomFixedlist-item:hover {
	background: rgb(244, 233, 140) !important;
	border: 0px;
	color: #111 !important;

}
.wc-block-components-price-slider__range-input {z-index: 2 !important;}
.woocommerce div.product form.cart .button {font-weight:700; text-transform: uppercase; font-size:14px;}
#cgkit-mobile-commercekit-sticky-atc { background: #222; border-top:#555 1px solid;}

ul.products li.product .button:before,
.woocommerce div.product form.cart .button:before,
.commercekit-atc-stuck #cgkit-tab-commercekit-sticky-atc-title button:before,
.site #cgkit-mobile-commercekit-sticky-atc button:before  {
/* ::before and ::after both require content */
	content: " ";
	background: url('/wp-content/themes/cookie-child/img/cart-button.svg') no-repeat;
	width: 16px;
	height: 16px;
	display: inline-block;
	margin-right: 0.5em;
	top: 1px;
	position: relative;
}
.woocommerce-ordering:before {
	content: " ";
	background: url('/wp-content/themes/cookie-child/img/sort-tool.svg') no-repeat;
	width: 16px;
	height: 16px;
	display: inline-block;
	margin-right: 0.5em;
	top: 1px;
	position: relative;
}


.woocommerce-error a, .woocommerce-info a, .woocommerce-message a, .woocommerce-noreviews a, p.no-comments a {color: #222; text-decoration: underline;}
.woocommerce-error a:hover, .woocommerce-info a:hover, .woocommerce-message a:hover, .woocommerce-noreviews a:hover, p.no-comments a:hover  {color: #222;}

.coupon .button:hover,
.call-back-feature a:hover,
.woocommerce div.product form.cart .button:hover {
	background: #ffce00 !important;
	color: #111!important;
}
.ckit-fsn-bar-active .cgkit-fsn-title:before { background: #222 !important;}
button.woocommerce-button.button.woocommerce-form-login__submit {
	background: #ffce00;
	color: #111;
	border-radius: 5px;
	border: 2px solid #ffce00;
	font-size: 18px;
}

button.woocommerce-Button.woocommerce-button.button.woocommerce-form-register__submit {
	background: rgb(244, 233, 140);
	color: #111;
	border-radius: 5px;
	border: 2px solid #ffce00;
	font-size: 18px;
}


 .btn--primary,
 .single-product #review_form input#submit {
	 background: rgb(244, 233, 140) !important;
	 color:#111 !important;
 }
 button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed:hover {
	  color: #fff!important
  }
.container {
	width: calc(100% - 2 * var(--component-padding));
	margin-left: auto;
	margin-right: auto;
}

.flex,.grid,.inline-flex,[class*=" flex@"],[class*=" inline-flex@"],[class^=flex\@],[class^=inline-flex\@] {
	--gap: 0px;
	--gap-x: var(--gap);
	--gap-y: var(--gap);
	gap: var(--gap-y) var(--gap-x)
}

.flex>*,.grid>*,.inline-flex>*,[class*=" flex@"]>*,[class*=" inline-flex@"]>*,[class^=flex\@]>*,[class^=inline-flex\@]>* {
	--sub-gap: 0px;
	--sub-gap-x: var(--sub-gap);
	--sub-gap-y: var(--sub-gap)
}

.grid {
	--grid-columns: 12;
	display: flex;
	flex-wrap: wrap
}

.grid>* {
	flex-basis: 100%;
	max-width: 100%;
	min-width: 0
}

@media not all and (min-resolution: 0.001dpcm) {
	@supports not (translate:none) {
		.flex[class*=gap-],.grid,.inline-flex[class*=gap-] {
			gap:0;
			margin-bottom: calc(-1 * var(--gap-y));
			margin-left: calc(-1 * var(--gap-x))
		}

		.flex[class*=gap-]>*,.grid>*,.inline-flex[class*=gap-]>* {
			margin-bottom: var(--sub-gap-y)
		}

		.grid {
			--offset: var(--gap-x);
			--gap-modifier: 0;
			--offset-modifier: 1
		}

		.grid>* {
			margin-left: var(--offset)
		}

		.flex[class*=gap-]>*,.inline-flex[class*=gap-]>* {
			margin-left: var(--sub-gap-x)
		}
	}
}

.gap-xxxxs {
	--gap-x: var(--space-xxxxs);
	--gap-y: var(--space-xxxxs)
}

.gap-xxxxs>* {
	--sub-gap-x: var(--space-xxxxs);
	--sub-gap-y: var(--space-xxxxs)
}

.gap-xxxs {
	--gap-x: var(--space-xxxs);
	--gap-y: var(--space-xxxs)
}

.gap-xxxs>* {
	--sub-gap-x: var(--space-xxxs);
	--sub-gap-y: var(--space-xxxs)
}

.gap-xxs {
	--gap-x: var(--space-xxs);
	--gap-y: var(--space-xxs)
}

.gap-xxs>* {
	--sub-gap-x: var(--space-xxs);
	--sub-gap-y: var(--space-xxs)
}

.gap-xs {
	--gap-x: var(--space-xs);
	--gap-y: var(--space-xs)
}

.gap-xs>* {
	--sub-gap-x: var(--space-xs);
	--sub-gap-y: var(--space-xs)
}

.gap-sm {
	--gap-x: var(--space-sm);
	--gap-y: var(--space-sm)
}

.gap-sm>* {
	--sub-gap-x: var(--space-sm);
	--sub-gap-y: var(--space-sm)
}

.gap-md {
	--gap-x: var(--space-md);
	--gap-y: var(--space-md)
}

.gap-md>* {
	--sub-gap-x: var(--space-md);
	--sub-gap-y: var(--space-md)
}

.gap-lg {
	--gap-x: var(--space-lg);
	--gap-y: var(--space-lg)
}

.gap-lg>* {
	--sub-gap-x: var(--space-lg);
	--sub-gap-y: var(--space-lg)
}

.gap-xl {
	--gap-x: var(--space-xl);
	--gap-y: var(--space-xl)
}

.gap-xl>* {
	--sub-gap-x: var(--space-xl);
	--sub-gap-y: var(--space-xl)
}

.gap-xxl {
	--gap-x: var(--space-xxl);
	--gap-y: var(--space-xxl)
}

.gap-xxl>* {
	--sub-gap-x: var(--space-xxl);
	--sub-gap-y: var(--space-xxl)
}

.gap-xxxl {
	--gap-x: var(--space-xxxl);
	--gap-y: var(--space-xxxl)
}

.gap-xxxl>* {
	--sub-gap-x: var(--space-xxxl);
	--sub-gap-y: var(--space-xxxl)
}

.gap-xxxxl {
	--gap-x: var(--space-xxxxl);
	--gap-y: var(--space-xxxxl)
}

.gap-xxxxl>* {
	--sub-gap-x: var(--space-xxxxl);
	--sub-gap-y: var(--space-xxxxl)
}

.gap-0 {
	--gap-x: 0px;
	--gap-y: 0px
}

.gap-0>* {
	--sub-gap-x: 0px;
	--sub-gap-y: 0px
}

.gap-x-xxxxs {
	--gap-x: var(--space-xxxxs)
}

.gap-x-xxxxs>* {
	--sub-gap-x: var(--space-xxxxs)
}

.gap-x-xxxs {
	--gap-x: var(--space-xxxs)
}

.gap-x-xxxs>* {
	--sub-gap-x: var(--space-xxxs)
}

.gap-x-xxs {
	--gap-x: var(--space-xxs)
}

.gap-x-xxs>* {
	--sub-gap-x: var(--space-xxs)
}

.gap-x-xs {
	--gap-x: var(--space-xs)
}

.gap-x-xs>* {
	--sub-gap-x: var(--space-xs)
}

.gap-x-sm {
	--gap-x: var(--space-sm)
}

.gap-x-sm>* {
	--sub-gap-x: var(--space-sm)
}

.gap-x-md {
	--gap-x: var(--space-md)
}

.gap-x-md>* {
	--sub-gap-x: var(--space-md)
}

.gap-x-lg {
	--gap-x: var(--space-lg)
}

.gap-x-lg>* {
	--sub-gap-x: var(--space-lg)
}

.gap-x-xl {
	--gap-x: var(--space-xl)
}

.gap-x-xl>* {
	--sub-gap-x: var(--space-xl)
}

.gap-x-xxl {
	--gap-x: var(--space-xxl)
}

.gap-x-xxl>* {
	--sub-gap-x: var(--space-xxl)
}

.gap-x-xxxl {
	--gap-x: var(--space-xxxl)
}

.gap-x-xxxl>* {
	--sub-gap-x: var(--space-xxxl)
}

.gap-x-xxxxl {
	--gap-x: var(--space-xxxxl)
}

.gap-x-xxxxl>* {
	--sub-gap-x: var(--space-xxxxl)
}

.gap-x-0 {
	--gap-x: 0px
}

.gap-x-0>* {
	--sub-gap-x: 0px
}

.gap-y-xxxxs {
	--gap-y: var(--space-xxxxs)
}

.gap-y-xxxxs>* {
	--sub-gap-y: var(--space-xxxxs)
}

.gap-y-xxxs {
	--gap-y: var(--space-xxxs)
}

.gap-y-xxxs>* {
	--sub-gap-y: var(--space-xxxs)
}

.gap-y-xxs {
	--gap-y: var(--space-xxs)
}

.gap-y-xxs>* {
	--sub-gap-y: var(--space-xxs)
}

.gap-y-xs {
	--gap-y: var(--space-xs)
}

.gap-y-xs>* {
	--sub-gap-y: var(--space-xs)
}

.gap-y-sm {
	--gap-y: var(--space-sm)
}

.gap-y-sm>* {
	--sub-gap-y: var(--space-sm)
}

.gap-y-md {
	--gap-y: var(--space-md)
}

.gap-y-md>* {
	--sub-gap-y: var(--space-md)
}

.gap-y-lg {
	--gap-y: var(--space-lg)
}

.gap-y-lg>* {
	--sub-gap-y: var(--space-lg)
}

.gap-y-xl {
	--gap-y: var(--space-xl)
}

.gap-y-xl>* {
	--sub-gap-y: var(--space-xl)
}

.gap-y-xxl {
	--gap-y: var(--space-xxl)
}

.gap-y-xxl>* {
	--sub-gap-y: var(--space-xxl)
}

.gap-y-xxxl {
	--gap-y: var(--space-xxxl)
}

.gap-y-xxxl>* {
	--sub-gap-y: var(--space-xxxl)
}

.gap-y-xxxxl {
	--gap-y: var(--space-xxxxl)
}

.gap-y-xxxxl>* {
	--sub-gap-y: var(--space-xxxxl)
}

.gap-y-0 {
	--gap-y: 0px
}

.gap-y-0>* {
	--sub-gap-y: 0px
}

.grid-col-1 {
	--grid-columns: 1
}

.col-1 {
	--span: 1
}

.grid-col-2 {
	--grid-columns: 2
}

.col-2 {
	--span: 2
}

.grid-col-3 {
	--grid-columns: 3
}

.col-3 {
	--span: 3
}

.grid-col-4 {
	--grid-columns: 4
}

.col-4 {
	--span: 4
}

.grid-col-5 {
	--grid-columns: 5
}

.col-5 {
	--span: 5
}

.grid-col-6 {
	--grid-columns: 6
}

.col-6 {
	--span: 6
}

.grid-col-7 {
	--grid-columns: 7
}

.col-7 {
	--span: 7
}

.grid-col-8 {
	--grid-columns: 8
}

.col-8 {
	--span: 8
}

.grid-col-9 {
	--grid-columns: 9
}

.col-9 {
	--span: 9
}

.grid-col-10 {
	--grid-columns: 10
}

.col-10 {
	--span: 10
}

.grid-col-11 {
	--grid-columns: 11
}

.col-11 {
	--span: 11
}

.grid-col-12 {
	--grid-columns: 12
}

.col-12 {
	--span: 12
}

.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9 {
	flex-basis: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x));
	max-width: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x))
}

.col {
	flex-grow: 1;
	flex-basis: 0;
	max-width: 100%
}

.col-content {
	flex-grow: 0;
	flex-basis: initial;
	max-width: initial
}

.offset-1 {
	--offset: 1
}

.offset-2 {
	--offset: 2
}

.offset-3 {
	--offset: 3
}

.offset-4 {
	--offset: 4
}

.offset-5 {
	--offset: 5
}

.offset-6 {
	--offset: 6
}

.offset-7 {
	--offset: 7
}

.offset-8 {
	--offset: 8
}

.offset-9 {
	--offset: 9
}

.offset-10 {
	--offset: 10
}

.offset-11 {
	--offset: 11
}

.offset-1,.offset-10,.offset-11,.offset-2,.offset-3,.offset-4,.offset-5,.offset-6,.offset-7,.offset-8,.offset-9 {
	margin-left: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--offset)/ var(--grid-columns) + (var(--offset) + var(--offset-modifier,0)) * var(--sub-gap-x))
}

@media (min-width: 32rem) {
	.gap-xxxxs\@xs {
		--gap-x:var(--space-xxxxs);
		--gap-y: var(--space-xxxxs)
	}

	.gap-xxxxs\@xs>* {
		--sub-gap-x: var(--space-xxxxs);
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-xxxs\@xs {
		--gap-x: var(--space-xxxs);
		--gap-y: var(--space-xxxs)
	}

	.gap-xxxs\@xs>* {
		--sub-gap-x: var(--space-xxxs);
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-xxs\@xs {
		--gap-x: var(--space-xxs);
		--gap-y: var(--space-xxs)
	}

	.gap-xxs\@xs>* {
		--sub-gap-x: var(--space-xxs);
		--sub-gap-y: var(--space-xxs)
	}

	.gap-xs\@xs {
		--gap-x: var(--space-xs);
		--gap-y: var(--space-xs)
	}

	.gap-xs\@xs>* {
		--sub-gap-x: var(--space-xs);
		--sub-gap-y: var(--space-xs)
	}

	.gap-sm\@xs {
		--gap-x: var(--space-sm);
		--gap-y: var(--space-sm)
	}

	.gap-sm\@xs>* {
		--sub-gap-x: var(--space-sm);
		--sub-gap-y: var(--space-sm)
	}

	.gap-md\@xs {
		--gap-x: var(--space-md);
		--gap-y: var(--space-md)
	}

	.gap-md\@xs>* {
		--sub-gap-x: var(--space-md);
		--sub-gap-y: var(--space-md)
	}

	.gap-lg\@xs {
		--gap-x: var(--space-lg);
		--gap-y: var(--space-lg)
	}

	.gap-lg\@xs>* {
		--sub-gap-x: var(--space-lg);
		--sub-gap-y: var(--space-lg)
	}

	.gap-xl\@xs {
		--gap-x: var(--space-xl);
		--gap-y: var(--space-xl)
	}

	.gap-xl\@xs>* {
		--sub-gap-x: var(--space-xl);
		--sub-gap-y: var(--space-xl)
	}

	.gap-xxl\@xs {
		--gap-x: var(--space-xxl);
		--gap-y: var(--space-xxl)
	}

	.gap-xxl\@xs>* {
		--sub-gap-x: var(--space-xxl);
		--sub-gap-y: var(--space-xxl)
	}

	.gap-xxxl\@xs {
		--gap-x: var(--space-xxxl);
		--gap-y: var(--space-xxxl)
	}

	.gap-xxxl\@xs>* {
		--sub-gap-x: var(--space-xxxl);
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-xxxxl\@xs {
		--gap-x: var(--space-xxxxl);
		--gap-y: var(--space-xxxxl)
	}

	.gap-xxxxl\@xs>* {
		--sub-gap-x: var(--space-xxxxl);
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-0\@xs {
		--gap-x: 0px;
		--gap-y: 0px
	}

	.gap-0\@xs>* {
		--sub-gap-x: 0px;
		--sub-gap-y: 0px
	}

	.gap-x-xxxxs\@xs {
		--gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxxs\@xs>* {
		--sub-gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxs\@xs {
		--gap-x: var(--space-xxxs)
	}

	.gap-x-xxxs\@xs>* {
		--sub-gap-x: var(--space-xxxs)
	}

	.gap-x-xxs\@xs {
		--gap-x: var(--space-xxs)
	}

	.gap-x-xxs\@xs>* {
		--sub-gap-x: var(--space-xxs)
	}

	.gap-x-xs\@xs {
		--gap-x: var(--space-xs)
	}

	.gap-x-xs\@xs>* {
		--sub-gap-x: var(--space-xs)
	}

	.gap-x-sm\@xs {
		--gap-x: var(--space-sm)
	}

	.gap-x-sm\@xs>* {
		--sub-gap-x: var(--space-sm)
	}

	.gap-x-md\@xs {
		--gap-x: var(--space-md)
	}

	.gap-x-md\@xs>* {
		--sub-gap-x: var(--space-md)
	}

	.gap-x-lg\@xs {
		--gap-x: var(--space-lg)
	}

	.gap-x-lg\@xs>* {
		--sub-gap-x: var(--space-lg)
	}

	.gap-x-xl\@xs {
		--gap-x: var(--space-xl)
	}

	.gap-x-xl\@xs>* {
		--sub-gap-x: var(--space-xl)
	}

	.gap-x-xxl\@xs {
		--gap-x: var(--space-xxl)
	}

	.gap-x-xxl\@xs>* {
		--sub-gap-x: var(--space-xxl)
	}

	.gap-x-xxxl\@xs {
		--gap-x: var(--space-xxxl)
	}

	.gap-x-xxxl\@xs>* {
		--sub-gap-x: var(--space-xxxl)
	}

	.gap-x-xxxxl\@xs {
		--gap-x: var(--space-xxxxl)
	}

	.gap-x-xxxxl\@xs>* {
		--sub-gap-x: var(--space-xxxxl)
	}

	.gap-x-0\@xs {
		--gap-x: 0px
	}

	.gap-x-0\@xs>* {
		--sub-gap-x: 0px
	}

	.gap-y-xxxxs\@xs {
		--gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxxs\@xs>* {
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxs\@xs {
		--gap-y: var(--space-xxxs)
	}

	.gap-y-xxxs\@xs>* {
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-y-xxs\@xs {
		--gap-y: var(--space-xxs)
	}

	.gap-y-xxs\@xs>* {
		--sub-gap-y: var(--space-xxs)
	}

	.gap-y-xs\@xs {
		--gap-y: var(--space-xs)
	}

	.gap-y-xs\@xs>* {
		--sub-gap-y: var(--space-xs)
	}

	.gap-y-sm\@xs {
		--gap-y: var(--space-sm)
	}

	.gap-y-sm\@xs>* {
		--sub-gap-y: var(--space-sm)
	}

	.gap-y-md\@xs {
		--gap-y: var(--space-md)
	}

	.gap-y-md\@xs>* {
		--sub-gap-y: var(--space-md)
	}

	.gap-y-lg\@xs {
		--gap-y: var(--space-lg)
	}

	.gap-y-lg\@xs>* {
		--sub-gap-y: var(--space-lg)
	}

	.gap-y-xl\@xs {
		--gap-y: var(--space-xl)
	}

	.gap-y-xl\@xs>* {
		--sub-gap-y: var(--space-xl)
	}

	.gap-y-xxl\@xs {
		--gap-y: var(--space-xxl)
	}

	.gap-y-xxl\@xs>* {
		--sub-gap-y: var(--space-xxl)
	}

	.gap-y-xxxl\@xs {
		--gap-y: var(--space-xxxl)
	}

	.gap-y-xxxl\@xs>* {
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-y-xxxxl\@xs {
		--gap-y: var(--space-xxxxl)
	}

	.gap-y-xxxxl\@xs>* {
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-y-0\@xs {
		--gap-y: 0px
	}

	.gap-y-0\@xs>* {
		--sub-gap-y: 0px
	}

	.grid-col-1\@xs {
		--grid-columns: 1
	}

	.col-1\@xs {
		--span: 1
	}

	.grid-col-2\@xs {
		--grid-columns: 2
	}

	.col-2\@xs {
		--span: 2
	}

	.grid-col-3\@xs {
		--grid-columns: 3
	}

	.col-3\@xs {
		--span: 3
	}

	.grid-col-4\@xs {
		--grid-columns: 4
	}

	.col-4\@xs {
		--span: 4
	}

	.grid-col-5\@xs {
		--grid-columns: 5
	}

	.col-5\@xs {
		--span: 5
	}

	.grid-col-6\@xs {
		--grid-columns: 6
	}

	.col-6\@xs {
		--span: 6
	}

	.grid-col-7\@xs {
		--grid-columns: 7
	}

	.col-7\@xs {
		--span: 7
	}

	.grid-col-8\@xs {
		--grid-columns: 8
	}

	.col-8\@xs {
		--span: 8
	}

	.grid-col-9\@xs {
		--grid-columns: 9
	}

	.col-9\@xs {
		--span: 9
	}

	.grid-col-10\@xs {
		--grid-columns: 10
	}

	.col-10\@xs {
		--span: 10
	}

	.grid-col-11\@xs {
		--grid-columns: 11
	}

	.col-11\@xs {
		--span: 11
	}

	.grid-col-12\@xs {
		--grid-columns: 12
	}

	.col-12\@xs {
		--span: 12
	}

	.col-10\@xs,.col-11\@xs,.col-12\@xs,.col-1\@xs,.col-2\@xs,.col-3\@xs,.col-4\@xs,.col-5\@xs,.col-6\@xs,.col-7\@xs,.col-8\@xs,.col-9\@xs {
		flex-basis: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x));
		max-width: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x))
	}

	.col\@xs {
		flex-grow: 1;
		flex-basis: 0;
		max-width: 100%
	}

	.col-content\@xs {
		flex-grow: 0;
		flex-basis: initial;
		max-width: initial
	}

	.offset-1\@xs {
		--offset: 1
	}

	.offset-2\@xs {
		--offset: 2
	}

	.offset-3\@xs {
		--offset: 3
	}

	.offset-4\@xs {
		--offset: 4
	}

	.offset-5\@xs {
		--offset: 5
	}

	.offset-6\@xs {
		--offset: 6
	}

	.offset-7\@xs {
		--offset: 7
	}

	.offset-8\@xs {
		--offset: 8
	}

	.offset-9\@xs {
		--offset: 9
	}

	.offset-10\@xs {
		--offset: 10
	}

	.offset-11\@xs {
		--offset: 11
	}

	.offset-10\@xs,.offset-11\@xs,.offset-1\@xs,.offset-2\@xs,.offset-3\@xs,.offset-4\@xs,.offset-5\@xs,.offset-6\@xs,.offset-7\@xs,.offset-8\@xs,.offset-9\@xs {
		margin-left: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--offset)/ var(--grid-columns) + (var(--offset) + var(--offset-modifier,0)) * var(--sub-gap-x))
	}

	.offset-0\@xs {
		margin-left: 0
	}

	@media not all and (min-resolution: 0.001dpcm) {
		@supports not (translate:none) {
			.offset-0\@xs {
				margin-left:var(--gap-x)
			}
		}
	}
}

@media (min-width: 48rem) {
	.gap-xxxxs\@sm {
		--gap-x:var(--space-xxxxs);
		--gap-y: var(--space-xxxxs)
	}

	.gap-xxxxs\@sm>* {
		--sub-gap-x: var(--space-xxxxs);
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-xxxs\@sm {
		--gap-x: var(--space-xxxs);
		--gap-y: var(--space-xxxs)
	}

	.gap-xxxs\@sm>* {
		--sub-gap-x: var(--space-xxxs);
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-xxs\@sm {
		--gap-x: var(--space-xxs);
		--gap-y: var(--space-xxs)
	}

	.gap-xxs\@sm>* {
		--sub-gap-x: var(--space-xxs);
		--sub-gap-y: var(--space-xxs)
	}

	.gap-xs\@sm {
		--gap-x: var(--space-xs);
		--gap-y: var(--space-xs)
	}

	.gap-xs\@sm>* {
		--sub-gap-x: var(--space-xs);
		--sub-gap-y: var(--space-xs)
	}

	.gap-sm\@sm {
		--gap-x: var(--space-sm);
		--gap-y: var(--space-sm)
	}

	.gap-sm\@sm>* {
		--sub-gap-x: var(--space-sm);
		--sub-gap-y: var(--space-sm)
	}

	.gap-md\@sm {
		--gap-x: var(--space-md);
		--gap-y: var(--space-md)
	}

	.gap-md\@sm>* {
		--sub-gap-x: var(--space-md);
		--sub-gap-y: var(--space-md)
	}

	.gap-lg\@sm {
		--gap-x: var(--space-lg);
		--gap-y: var(--space-lg)
	}

	.gap-lg\@sm>* {
		--sub-gap-x: var(--space-lg);
		--sub-gap-y: var(--space-lg)
	}

	.gap-xl\@sm {
		--gap-x: var(--space-xl);
		--gap-y: var(--space-xl)
	}

	.gap-xl\@sm>* {
		--sub-gap-x: var(--space-xl);
		--sub-gap-y: var(--space-xl)
	}

	.gap-xxl\@sm {
		--gap-x: var(--space-xxl);
		--gap-y: var(--space-xxl)
	}

	.gap-xxl\@sm>* {
		--sub-gap-x: var(--space-xxl);
		--sub-gap-y: var(--space-xxl)
	}

	.gap-xxxl\@sm {
		--gap-x: var(--space-xxxl);
		--gap-y: var(--space-xxxl)
	}

	.gap-xxxl\@sm>* {
		--sub-gap-x: var(--space-xxxl);
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-xxxxl\@sm {
		--gap-x: var(--space-xxxxl);
		--gap-y: var(--space-xxxxl)
	}

	.gap-xxxxl\@sm>* {
		--sub-gap-x: var(--space-xxxxl);
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-0\@sm {
		--gap-x: 0px;
		--gap-y: 0px
	}

	.gap-0\@sm>* {
		--sub-gap-x: 0px;
		--sub-gap-y: 0px
	}

	.gap-x-xxxxs\@sm {
		--gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxxs\@sm>* {
		--sub-gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxs\@sm {
		--gap-x: var(--space-xxxs)
	}

	.gap-x-xxxs\@sm>* {
		--sub-gap-x: var(--space-xxxs)
	}

	.gap-x-xxs\@sm {
		--gap-x: var(--space-xxs)
	}

	.gap-x-xxs\@sm>* {
		--sub-gap-x: var(--space-xxs)
	}

	.gap-x-xs\@sm {
		--gap-x: var(--space-xs)
	}

	.gap-x-xs\@sm>* {
		--sub-gap-x: var(--space-xs)
	}

	.gap-x-sm\@sm {
		--gap-x: var(--space-sm)
	}

	.gap-x-sm\@sm>* {
		--sub-gap-x: var(--space-sm)
	}

	.gap-x-md\@sm {
		--gap-x: var(--space-md)
	}

	.gap-x-md\@sm>* {
		--sub-gap-x: var(--space-md)
	}

	.gap-x-lg\@sm {
		--gap-x: var(--space-lg)
	}

	.gap-x-lg\@sm>* {
		--sub-gap-x: var(--space-lg)
	}

	.gap-x-xl\@sm {
		--gap-x: var(--space-xl)
	}

	.gap-x-xl\@sm>* {
		--sub-gap-x: var(--space-xl)
	}

	.gap-x-xxl\@sm {
		--gap-x: var(--space-xxl)
	}

	.gap-x-xxl\@sm>* {
		--sub-gap-x: var(--space-xxl)
	}

	.gap-x-xxxl\@sm {
		--gap-x: var(--space-xxxl)
	}

	.gap-x-xxxl\@sm>* {
		--sub-gap-x: var(--space-xxxl)
	}

	.gap-x-xxxxl\@sm {
		--gap-x: var(--space-xxxxl)
	}

	.gap-x-xxxxl\@sm>* {
		--sub-gap-x: var(--space-xxxxl)
	}

	.gap-x-0\@sm {
		--gap-x: 0px
	}

	.gap-x-0\@sm>* {
		--sub-gap-x: 0px
	}

	.gap-y-xxxxs\@sm {
		--gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxxs\@sm>* {
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxs\@sm {
		--gap-y: var(--space-xxxs)
	}

	.gap-y-xxxs\@sm>* {
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-y-xxs\@sm {
		--gap-y: var(--space-xxs)
	}

	.gap-y-xxs\@sm>* {
		--sub-gap-y: var(--space-xxs)
	}

	.gap-y-xs\@sm {
		--gap-y: var(--space-xs)
	}

	.gap-y-xs\@sm>* {
		--sub-gap-y: var(--space-xs)
	}

	.gap-y-sm\@sm {
		--gap-y: var(--space-sm)
	}

	.gap-y-sm\@sm>* {
		--sub-gap-y: var(--space-sm)
	}

	.gap-y-md\@sm {
		--gap-y: var(--space-md)
	}

	.gap-y-md\@sm>* {
		--sub-gap-y: var(--space-md)
	}

	.gap-y-lg\@sm {
		--gap-y: var(--space-lg)
	}

	.gap-y-lg\@sm>* {
		--sub-gap-y: var(--space-lg)
	}

	.gap-y-xl\@sm {
		--gap-y: var(--space-xl)
	}

	.gap-y-xl\@sm>* {
		--sub-gap-y: var(--space-xl)
	}

	.gap-y-xxl\@sm {
		--gap-y: var(--space-xxl)
	}

	.gap-y-xxl\@sm>* {
		--sub-gap-y: var(--space-xxl)
	}

	.gap-y-xxxl\@sm {
		--gap-y: var(--space-xxxl)
	}

	.gap-y-xxxl\@sm>* {
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-y-xxxxl\@sm {
		--gap-y: var(--space-xxxxl)
	}

	.gap-y-xxxxl\@sm>* {
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-y-0\@sm {
		--gap-y: 0px
	}

	.gap-y-0\@sm>* {
		--sub-gap-y: 0px
	}

	.grid-col-1\@sm {
		--grid-columns: 1
	}

	.col-1\@sm {
		--span: 1
	}

	.grid-col-2\@sm {
		--grid-columns: 2
	}

	.col-2\@sm {
		--span: 2
	}

	.grid-col-3\@sm {
		--grid-columns: 3
	}

	.col-3\@sm {
		--span: 3
	}

	.grid-col-4\@sm {
		--grid-columns: 4
	}

	.col-4\@sm {
		--span: 4
	}

	.grid-col-5\@sm {
		--grid-columns: 5
	}

	.col-5\@sm {
		--span: 5
	}

	.grid-col-6\@sm {
		--grid-columns: 6
	}

	.col-6\@sm {
		--span: 6
	}

	.grid-col-7\@sm {
		--grid-columns: 7
	}

	.col-7\@sm {
		--span: 7
	}

	.grid-col-8\@sm {
		--grid-columns: 8
	}

	.col-8\@sm {
		--span: 8
	}

	.grid-col-9\@sm {
		--grid-columns: 9
	}

	.col-9\@sm {
		--span: 9
	}

	.grid-col-10\@sm {
		--grid-columns: 10
	}

	.col-10\@sm {
		--span: 10
	}

	.grid-col-11\@sm {
		--grid-columns: 11
	}

	.col-11\@sm {
		--span: 11
	}

	.grid-col-12\@sm {
		--grid-columns: 12
	}

	.col-12\@sm {
		--span: 12
	}

	.col-10\@sm,.col-11\@sm,.col-12\@sm,.col-1\@sm,.col-2\@sm,.col-3\@sm,.col-4\@sm,.col-5\@sm,.col-6\@sm,.col-7\@sm,.col-8\@sm,.col-9\@sm {
		flex-basis: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x));
		max-width: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x))
	}

	.col\@sm {
		flex-grow: 1;
		flex-basis: 0;
		max-width: 100%
	}

	.col-content\@sm {
		flex-grow: 0;
		flex-basis: initial;
		max-width: initial
	}

	.offset-1\@sm {
		--offset: 1
	}

	.offset-2\@sm {
		--offset: 2
	}

	.offset-3\@sm {
		--offset: 3
	}

	.offset-4\@sm {
		--offset: 4
	}

	.offset-5\@sm {
		--offset: 5
	}

	.offset-6\@sm {
		--offset: 6
	}

	.offset-7\@sm {
		--offset: 7
	}

	.offset-8\@sm {
		--offset: 8
	}

	.offset-9\@sm {
		--offset: 9
	}

	.offset-10\@sm {
		--offset: 10
	}

	.offset-11\@sm {
		--offset: 11
	}

	.offset-10\@sm,.offset-11\@sm,.offset-1\@sm,.offset-2\@sm,.offset-3\@sm,.offset-4\@sm,.offset-5\@sm,.offset-6\@sm,.offset-7\@sm,.offset-8\@sm,.offset-9\@sm {
		margin-left: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--offset)/ var(--grid-columns) + (var(--offset) + var(--offset-modifier,0)) * var(--sub-gap-x))
	}

	.offset-0\@sm {
		margin-left: 0
	}

	@media not all and (min-resolution: 0.001dpcm) {
		@supports not (translate:none) {
			.offset-0\@sm {
				margin-left:var(--gap-x)
			}
		}
	}
}

@media (min-width: 64rem) {
	.gap-xxxxs\@md {
		--gap-x:var(--space-xxxxs);
		--gap-y: var(--space-xxxxs)
	}

	.gap-xxxxs\@md>* {
		--sub-gap-x: var(--space-xxxxs);
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-xxxs\@md {
		--gap-x: var(--space-xxxs);
		--gap-y: var(--space-xxxs)
	}

	.gap-xxxs\@md>* {
		--sub-gap-x: var(--space-xxxs);
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-xxs\@md {
		--gap-x: var(--space-xxs);
		--gap-y: var(--space-xxs)
	}

	.gap-xxs\@md>* {
		--sub-gap-x: var(--space-xxs);
		--sub-gap-y: var(--space-xxs)
	}

	.gap-xs\@md {
		--gap-x: var(--space-xs);
		--gap-y: var(--space-xs)
	}

	.gap-xs\@md>* {
		--sub-gap-x: var(--space-xs);
		--sub-gap-y: var(--space-xs)
	}

	.gap-sm\@md {
		--gap-x: var(--space-sm);
		--gap-y: var(--space-sm)
	}

	.gap-sm\@md>* {
		--sub-gap-x: var(--space-sm);
		--sub-gap-y: var(--space-sm)
	}

	.gap-md\@md {
		--gap-x: var(--space-md);
		--gap-y: var(--space-md)
	}

	.gap-md\@md>* {
		--sub-gap-x: var(--space-md);
		--sub-gap-y: var(--space-md)
	}

	.gap-lg\@md {
		--gap-x: var(--space-lg);
		--gap-y: var(--space-lg)
	}

	.gap-lg\@md>* {
		--sub-gap-x: var(--space-lg);
		--sub-gap-y: var(--space-lg)
	}

	.gap-xl\@md {
		--gap-x: var(--space-xl);
		--gap-y: var(--space-xl)
	}

	.gap-xl\@md>* {
		--sub-gap-x: var(--space-xl);
		--sub-gap-y: var(--space-xl)
	}

	.gap-xxl\@md {
		--gap-x: var(--space-xxl);
		--gap-y: var(--space-xxl)
	}

	.gap-xxl\@md>* {
		--sub-gap-x: var(--space-xxl);
		--sub-gap-y: var(--space-xxl)
	}

	.gap-xxxl\@md {
		--gap-x: var(--space-xxxl);
		--gap-y: var(--space-xxxl)
	}

	.gap-xxxl\@md>* {
		--sub-gap-x: var(--space-xxxl);
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-xxxxl\@md {
		--gap-x: var(--space-xxxxl);
		--gap-y: var(--space-xxxxl)
	}

	.gap-xxxxl\@md>* {
		--sub-gap-x: var(--space-xxxxl);
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-0\@md {
		--gap-x: 0px;
		--gap-y: 0px
	}

	.gap-0\@md>* {
		--sub-gap-x: 0px;
		--sub-gap-y: 0px
	}

	.gap-x-xxxxs\@md {
		--gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxxs\@md>* {
		--sub-gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxs\@md {
		--gap-x: var(--space-xxxs)
	}

	.gap-x-xxxs\@md>* {
		--sub-gap-x: var(--space-xxxs)
	}

	.gap-x-xxs\@md {
		--gap-x: var(--space-xxs)
	}

	.gap-x-xxs\@md>* {
		--sub-gap-x: var(--space-xxs)
	}

	.gap-x-xs\@md {
		--gap-x: var(--space-xs)
	}

	.gap-x-xs\@md>* {
		--sub-gap-x: var(--space-xs)
	}

	.gap-x-sm\@md {
		--gap-x: var(--space-sm)
	}

	.gap-x-sm\@md>* {
		--sub-gap-x: var(--space-sm)
	}

	.gap-x-md\@md {
		--gap-x: var(--space-md)
	}

	.gap-x-md\@md>* {
		--sub-gap-x: var(--space-md)
	}

	.gap-x-lg\@md {
		--gap-x: var(--space-lg)
	}

	.gap-x-lg\@md>* {
		--sub-gap-x: var(--space-lg)
	}

	.gap-x-xl\@md {
		--gap-x: var(--space-xl)
	}

	.gap-x-xl\@md>* {
		--sub-gap-x: var(--space-xl)
	}

	.gap-x-xxl\@md {
		--gap-x: var(--space-xxl)
	}

	.gap-x-xxl\@md>* {
		--sub-gap-x: var(--space-xxl)
	}

	.gap-x-xxxl\@md {
		--gap-x: var(--space-xxxl)
	}

	.gap-x-xxxl\@md>* {
		--sub-gap-x: var(--space-xxxl)
	}

	.gap-x-xxxxl\@md {
		--gap-x: var(--space-xxxxl)
	}

	.gap-x-xxxxl\@md>* {
		--sub-gap-x: var(--space-xxxxl)
	}

	.gap-x-0\@md {
		--gap-x: 0px
	}

	.gap-x-0\@md>* {
		--sub-gap-x: 0px
	}

	.gap-y-xxxxs\@md {
		--gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxxs\@md>* {
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxs\@md {
		--gap-y: var(--space-xxxs)
	}

	.gap-y-xxxs\@md>* {
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-y-xxs\@md {
		--gap-y: var(--space-xxs)
	}

	.gap-y-xxs\@md>* {
		--sub-gap-y: var(--space-xxs)
	}

	.gap-y-xs\@md {
		--gap-y: var(--space-xs)
	}

	.gap-y-xs\@md>* {
		--sub-gap-y: var(--space-xs)
	}

	.gap-y-sm\@md {
		--gap-y: var(--space-sm)
	}

	.gap-y-sm\@md>* {
		--sub-gap-y: var(--space-sm)
	}

	.gap-y-md\@md {
		--gap-y: var(--space-md)
	}

	.gap-y-md\@md>* {
		--sub-gap-y: var(--space-md)
	}

	.gap-y-lg\@md {
		--gap-y: var(--space-lg)
	}

	.gap-y-lg\@md>* {
		--sub-gap-y: var(--space-lg)
	}

	.gap-y-xl\@md {
		--gap-y: var(--space-xl)
	}

	.gap-y-xl\@md>* {
		--sub-gap-y: var(--space-xl)
	}

	.gap-y-xxl\@md {
		--gap-y: var(--space-xxl)
	}

	.gap-y-xxl\@md>* {
		--sub-gap-y: var(--space-xxl)
	}

	.gap-y-xxxl\@md {
		--gap-y: var(--space-xxxl)
	}

	.gap-y-xxxl\@md>* {
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-y-xxxxl\@md {
		--gap-y: var(--space-xxxxl)
	}

	.gap-y-xxxxl\@md>* {
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-y-0\@md {
		--gap-y: 0px
	}

	.gap-y-0\@md>* {
		--sub-gap-y: 0px
	}

	.grid-col-1\@md {
		--grid-columns: 1
	}

	.col-1\@md {
		--span: 1
	}

	.grid-col-2\@md {
		--grid-columns: 2
	}

	.col-2\@md {
		--span: 2
	}

	.grid-col-3\@md {
		--grid-columns: 3
	}

	.col-3\@md {
		--span: 3
	}

	.grid-col-4\@md {
		--grid-columns: 4
	}

	.col-4\@md {
		--span: 4
	}

	.grid-col-5\@md {
		--grid-columns: 5
	}

	.col-5\@md {
		--span: 5
	}

	.grid-col-6\@md {
		--grid-columns: 6
	}

	.col-6\@md {
		--span: 6
	}

	.grid-col-7\@md {
		--grid-columns: 7
	}

	.col-7\@md {
		--span: 7
	}

	.grid-col-8\@md {
		--grid-columns: 8
	}

	.col-8\@md {
		--span: 8
	}

	.grid-col-9\@md {
		--grid-columns: 9
	}

	.col-9\@md {
		--span: 9
	}

	.grid-col-10\@md {
		--grid-columns: 10
	}

	.col-10\@md {
		--span: 10
	}

	.grid-col-11\@md {
		--grid-columns: 11
	}

	.col-11\@md {
		--span: 11
	}

	.grid-col-12\@md {
		--grid-columns: 12
	}

	.col-12\@md {
		--span: 12
	}

	.col-10\@md,.col-11\@md,.col-12\@md,.col-1\@md,.col-2\@md,.col-3\@md,.col-4\@md,.col-5\@md,.col-6\@md,.col-7\@md,.col-8\@md,.col-9\@md {
		flex-basis: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x));
		max-width: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x))
	}

	.col\@md {
		flex-grow: 1;
		flex-basis: 0;
		max-width: 100%
	}

	.col-content\@md {
		flex-grow: 0;
		flex-basis: initial;
		max-width: initial
	}

	.offset-1\@md {
		--offset: 1
	}

	.offset-2\@md {
		--offset: 2
	}

	.offset-3\@md {
		--offset: 3
	}

	.offset-4\@md {
		--offset: 4
	}

	.offset-5\@md {
		--offset: 5
	}

	.offset-6\@md {
		--offset: 6
	}

	.offset-7\@md {
		--offset: 7
	}

	.offset-8\@md {
		--offset: 8
	}

	.offset-9\@md {
		--offset: 9
	}

	.offset-10\@md {
		--offset: 10
	}

	.offset-11\@md {
		--offset: 11
	}

	.offset-10\@md,.offset-11\@md,.offset-1\@md,.offset-2\@md,.offset-3\@md,.offset-4\@md,.offset-5\@md,.offset-6\@md,.offset-7\@md,.offset-8\@md,.offset-9\@md {
		margin-left: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--offset)/ var(--grid-columns) + (var(--offset) + var(--offset-modifier,0)) * var(--sub-gap-x))
	}

	.offset-0\@md {
		margin-left: 0
	}

	@media not all and (min-resolution: 0.001dpcm) {
		@supports not (translate:none) {
			.offset-0\@md {
				margin-left:var(--gap-x)
			}
		}
	}
}

@media (min-width: 80rem) {
	.gap-xxxxs\@lg {
		--gap-x:var(--space-xxxxs);
		--gap-y: var(--space-xxxxs)
	}

	.gap-xxxxs\@lg>* {
		--sub-gap-x: var(--space-xxxxs);
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-xxxs\@lg {
		--gap-x: var(--space-xxxs);
		--gap-y: var(--space-xxxs)
	}

	.gap-xxxs\@lg>* {
		--sub-gap-x: var(--space-xxxs);
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-xxs\@lg {
		--gap-x: var(--space-xxs);
		--gap-y: var(--space-xxs)
	}

	.gap-xxs\@lg>* {
		--sub-gap-x: var(--space-xxs);
		--sub-gap-y: var(--space-xxs)
	}

	.gap-xs\@lg {
		--gap-x: var(--space-xs);
		--gap-y: var(--space-xs)
	}

	.gap-xs\@lg>* {
		--sub-gap-x: var(--space-xs);
		--sub-gap-y: var(--space-xs)
	}

	.gap-sm\@lg {
		--gap-x: var(--space-sm);
		--gap-y: var(--space-sm)
	}

	.gap-sm\@lg>* {
		--sub-gap-x: var(--space-sm);
		--sub-gap-y: var(--space-sm)
	}

	.gap-md\@lg {
		--gap-x: var(--space-md);
		--gap-y: var(--space-md)
	}

	.gap-md\@lg>* {
		--sub-gap-x: var(--space-md);
		--sub-gap-y: var(--space-md)
	}

	.gap-lg\@lg {
		--gap-x: var(--space-lg);
		--gap-y: var(--space-lg)
	}

	.gap-lg\@lg>* {
		--sub-gap-x: var(--space-lg);
		--sub-gap-y: var(--space-lg)
	}

	.gap-xl\@lg {
		--gap-x: var(--space-xl);
		--gap-y: var(--space-xl)
	}

	.gap-xl\@lg>* {
		--sub-gap-x: var(--space-xl);
		--sub-gap-y: var(--space-xl)
	}

	.gap-xxl\@lg {
		--gap-x: var(--space-xxl);
		--gap-y: var(--space-xxl)
	}

	.gap-xxl\@lg>* {
		--sub-gap-x: var(--space-xxl);
		--sub-gap-y: var(--space-xxl)
	}

	.gap-xxxl\@lg {
		--gap-x: var(--space-xxxl);
		--gap-y: var(--space-xxxl)
	}

	.gap-xxxl\@lg>* {
		--sub-gap-x: var(--space-xxxl);
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-xxxxl\@lg {
		--gap-x: var(--space-xxxxl);
		--gap-y: var(--space-xxxxl)
	}

	.gap-xxxxl\@lg>* {
		--sub-gap-x: var(--space-xxxxl);
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-0\@lg {
		--gap-x: 0px;
		--gap-y: 0px
	}

	.gap-0\@lg>* {
		--sub-gap-x: 0px;
		--sub-gap-y: 0px
	}

	.gap-x-xxxxs\@lg {
		--gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxxs\@lg>* {
		--sub-gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxs\@lg {
		--gap-x: var(--space-xxxs)
	}

	.gap-x-xxxs\@lg>* {
		--sub-gap-x: var(--space-xxxs)
	}

	.gap-x-xxs\@lg {
		--gap-x: var(--space-xxs)
	}

	.gap-x-xxs\@lg>* {
		--sub-gap-x: var(--space-xxs)
	}

	.gap-x-xs\@lg {
		--gap-x: var(--space-xs)
	}

	.gap-x-xs\@lg>* {
		--sub-gap-x: var(--space-xs)
	}

	.gap-x-sm\@lg {
		--gap-x: var(--space-sm)
	}

	.gap-x-sm\@lg>* {
		--sub-gap-x: var(--space-sm)
	}

	.gap-x-md\@lg {
		--gap-x: var(--space-md)
	}

	.gap-x-md\@lg>* {
		--sub-gap-x: var(--space-md)
	}

	.gap-x-lg\@lg {
		--gap-x: var(--space-lg)
	}

	.gap-x-lg\@lg>* {
		--sub-gap-x: var(--space-lg)
	}

	.gap-x-xl\@lg {
		--gap-x: var(--space-xl)
	}

	.gap-x-xl\@lg>* {
		--sub-gap-x: var(--space-xl)
	}

	.gap-x-xxl\@lg {
		--gap-x: var(--space-xxl)
	}

	.gap-x-xxl\@lg>* {
		--sub-gap-x: var(--space-xxl)
	}

	.gap-x-xxxl\@lg {
		--gap-x: var(--space-xxxl)
	}

	.gap-x-xxxl\@lg>* {
		--sub-gap-x: var(--space-xxxl)
	}

	.gap-x-xxxxl\@lg {
		--gap-x: var(--space-xxxxl)
	}

	.gap-x-xxxxl\@lg>* {
		--sub-gap-x: var(--space-xxxxl)
	}

	.gap-x-0\@lg {
		--gap-x: 0px
	}

	.gap-x-0\@lg>* {
		--sub-gap-x: 0px
	}

	.gap-y-xxxxs\@lg {
		--gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxxs\@lg>* {
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxs\@lg {
		--gap-y: var(--space-xxxs)
	}

	.gap-y-xxxs\@lg>* {
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-y-xxs\@lg {
		--gap-y: var(--space-xxs)
	}

	.gap-y-xxs\@lg>* {
		--sub-gap-y: var(--space-xxs)
	}

	.gap-y-xs\@lg {
		--gap-y: var(--space-xs)
	}

	.gap-y-xs\@lg>* {
		--sub-gap-y: var(--space-xs)
	}

	.gap-y-sm\@lg {
		--gap-y: var(--space-sm)
	}

	.gap-y-sm\@lg>* {
		--sub-gap-y: var(--space-sm)
	}

	.gap-y-md\@lg {
		--gap-y: var(--space-md)
	}

	.gap-y-md\@lg>* {
		--sub-gap-y: var(--space-md)
	}

	.gap-y-lg\@lg {
		--gap-y: var(--space-lg)
	}

	.gap-y-lg\@lg>* {
		--sub-gap-y: var(--space-lg)
	}

	.gap-y-xl\@lg {
		--gap-y: var(--space-xl)
	}

	.gap-y-xl\@lg>* {
		--sub-gap-y: var(--space-xl)
	}

	.gap-y-xxl\@lg {
		--gap-y: var(--space-xxl)
	}

	.gap-y-xxl\@lg>* {
		--sub-gap-y: var(--space-xxl)
	}

	.gap-y-xxxl\@lg {
		--gap-y: var(--space-xxxl)
	}

	.gap-y-xxxl\@lg>* {
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-y-xxxxl\@lg {
		--gap-y: var(--space-xxxxl)
	}

	.gap-y-xxxxl\@lg>* {
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-y-0\@lg {
		--gap-y: 0px
	}

	.gap-y-0\@lg>* {
		--sub-gap-y: 0px
	}

	.grid-col-1\@lg {
		--grid-columns: 1
	}

	.col-1\@lg {
		--span: 1
	}

	.grid-col-2\@lg {
		--grid-columns: 2
	}

	.col-2\@lg {
		--span: 2
	}

	.grid-col-3\@lg {
		--grid-columns: 3
	}

	.col-3\@lg {
		--span: 3
	}

	.grid-col-4\@lg {
		--grid-columns: 4
	}

	.col-4\@lg {
		--span: 4
	}

	.grid-col-5\@lg {
		--grid-columns: 5
	}

	.col-5\@lg {
		--span: 5
	}

	.grid-col-6\@lg {
		--grid-columns: 6
	}

	.col-6\@lg {
		--span: 6
	}

	.grid-col-7\@lg {
		--grid-columns: 7
	}

	.col-7\@lg {
		--span: 7
	}

	.grid-col-8\@lg {
		--grid-columns: 8
	}

	.col-8\@lg {
		--span: 8
	}

	.grid-col-9\@lg {
		--grid-columns: 9
	}

	.col-9\@lg {
		--span: 9
	}

	.grid-col-10\@lg {
		--grid-columns: 10
	}

	.col-10\@lg {
		--span: 10
	}

	.grid-col-11\@lg {
		--grid-columns: 11
	}

	.col-11\@lg {
		--span: 11
	}

	.grid-col-12\@lg {
		--grid-columns: 12
	}

	.col-12\@lg {
		--span: 12
	}

	.col-10\@lg,.col-11\@lg,.col-12\@lg,.col-1\@lg,.col-2\@lg,.col-3\@lg,.col-4\@lg,.col-5\@lg,.col-6\@lg,.col-7\@lg,.col-8\@lg,.col-9\@lg {
		flex-basis: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x));
		max-width: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x))
	}

	.col\@lg {
		flex-grow: 1;
		flex-basis: 0;
		max-width: 100%
	}

	.col-content\@lg {
		flex-grow: 0;
		flex-basis: initial;
		max-width: initial
	}

	.offset-1\@lg {
		--offset: 1
	}

	.offset-2\@lg {
		--offset: 2
	}

	.offset-3\@lg {
		--offset: 3
	}

	.offset-4\@lg {
		--offset: 4
	}

	.offset-5\@lg {
		--offset: 5
	}

	.offset-6\@lg {
		--offset: 6
	}

	.offset-7\@lg {
		--offset: 7
	}

	.offset-8\@lg {
		--offset: 8
	}

	.offset-9\@lg {
		--offset: 9
	}

	.offset-10\@lg {
		--offset: 10
	}

	.offset-11\@lg {
		--offset: 11
	}

	.offset-10\@lg,.offset-11\@lg,.offset-1\@lg,.offset-2\@lg,.offset-3\@lg,.offset-4\@lg,.offset-5\@lg,.offset-6\@lg,.offset-7\@lg,.offset-8\@lg,.offset-9\@lg {
		margin-left: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--offset)/ var(--grid-columns) + (var(--offset) + var(--offset-modifier,0)) * var(--sub-gap-x))
	}

	.offset-0\@lg {
		margin-left: 0
	}

	@media not all and (min-resolution: 0.001dpcm) {
		@supports not (translate:none) {
			.offset-0\@lg {
				margin-left:var(--gap-x)
			}
		}
	}
}

@media (min-width: 90rem) {
	.gap-xxxxs\@xl {
		--gap-x:var(--space-xxxxs);
		--gap-y: var(--space-xxxxs)
	}

	.gap-xxxxs\@xl>* {
		--sub-gap-x: var(--space-xxxxs);
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-xxxs\@xl {
		--gap-x: var(--space-xxxs);
		--gap-y: var(--space-xxxs)
	}

	.gap-xxxs\@xl>* {
		--sub-gap-x: var(--space-xxxs);
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-xxs\@xl {
		--gap-x: var(--space-xxs);
		--gap-y: var(--space-xxs)
	}

	.gap-xxs\@xl>* {
		--sub-gap-x: var(--space-xxs);
		--sub-gap-y: var(--space-xxs)
	}

	.gap-xs\@xl {
		--gap-x: var(--space-xs);
		--gap-y: var(--space-xs)
	}

	.gap-xs\@xl>* {
		--sub-gap-x: var(--space-xs);
		--sub-gap-y: var(--space-xs)
	}

	.gap-sm\@xl {
		--gap-x: var(--space-sm);
		--gap-y: var(--space-sm)
	}

	.gap-sm\@xl>* {
		--sub-gap-x: var(--space-sm);
		--sub-gap-y: var(--space-sm)
	}

	.gap-md\@xl {
		--gap-x: var(--space-md);
		--gap-y: var(--space-md)
	}

	.gap-md\@xl>* {
		--sub-gap-x: var(--space-md);
		--sub-gap-y: var(--space-md)
	}

	.gap-lg\@xl {
		--gap-x: var(--space-lg);
		--gap-y: var(--space-lg)
	}

	.gap-lg\@xl>* {
		--sub-gap-x: var(--space-lg);
		--sub-gap-y: var(--space-lg)
	}

	.gap-xl\@xl {
		--gap-x: var(--space-xl);
		--gap-y: var(--space-xl)
	}

	.gap-xl\@xl>* {
		--sub-gap-x: var(--space-xl);
		--sub-gap-y: var(--space-xl)
	}

	.gap-xxl\@xl {
		--gap-x: var(--space-xxl);
		--gap-y: var(--space-xxl)
	}

	.gap-xxl\@xl>* {
		--sub-gap-x: var(--space-xxl);
		--sub-gap-y: var(--space-xxl)
	}

	.gap-xxxl\@xl {
		--gap-x: var(--space-xxxl);
		--gap-y: var(--space-xxxl)
	}

	.gap-xxxl\@xl>* {
		--sub-gap-x: var(--space-xxxl);
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-xxxxl\@xl {
		--gap-x: var(--space-xxxxl);
		--gap-y: var(--space-xxxxl)
	}

	.gap-xxxxl\@xl>* {
		--sub-gap-x: var(--space-xxxxl);
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-0\@xl {
		--gap-x: 0px;
		--gap-y: 0px
	}

	.gap-0\@xl>* {
		--sub-gap-x: 0px;
		--sub-gap-y: 0px
	}

	.gap-x-xxxxs\@xl {
		--gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxxs\@xl>* {
		--sub-gap-x: var(--space-xxxxs)
	}

	.gap-x-xxxs\@xl {
		--gap-x: var(--space-xxxs)
	}

	.gap-x-xxxs\@xl>* {
		--sub-gap-x: var(--space-xxxs)
	}

	.gap-x-xxs\@xl {
		--gap-x: var(--space-xxs)
	}

	.gap-x-xxs\@xl>* {
		--sub-gap-x: var(--space-xxs)
	}

	.gap-x-xs\@xl {
		--gap-x: var(--space-xs)
	}

	.gap-x-xs\@xl>* {
		--sub-gap-x: var(--space-xs)
	}

	.gap-x-sm\@xl {
		--gap-x: var(--space-sm)
	}

	.gap-x-sm\@xl>* {
		--sub-gap-x: var(--space-sm)
	}

	.gap-x-md\@xl {
		--gap-x: var(--space-md)
	}

	.gap-x-md\@xl>* {
		--sub-gap-x: var(--space-md)
	}

	.gap-x-lg\@xl {
		--gap-x: var(--space-lg)
	}

	.gap-x-lg\@xl>* {
		--sub-gap-x: var(--space-lg)
	}

	.gap-x-xl\@xl {
		--gap-x: var(--space-xl)
	}

	.gap-x-xl\@xl>* {
		--sub-gap-x: var(--space-xl)
	}

	.gap-x-xxl\@xl {
		--gap-x: var(--space-xxl)
	}

	.gap-x-xxl\@xl>* {
		--sub-gap-x: var(--space-xxl)
	}

	.gap-x-xxxl\@xl {
		--gap-x: var(--space-xxxl)
	}

	.gap-x-xxxl\@xl>* {
		--sub-gap-x: var(--space-xxxl)
	}

	.gap-x-xxxxl\@xl {
		--gap-x: var(--space-xxxxl)
	}

	.gap-x-xxxxl\@xl>* {
		--sub-gap-x: var(--space-xxxxl)
	}

	.gap-x-0\@xl {
		--gap-x: 0px
	}

	.gap-x-0\@xl>* {
		--sub-gap-x: 0px
	}

	.gap-y-xxxxs\@xl {
		--gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxxs\@xl>* {
		--sub-gap-y: var(--space-xxxxs)
	}

	.gap-y-xxxs\@xl {
		--gap-y: var(--space-xxxs)
	}

	.gap-y-xxxs\@xl>* {
		--sub-gap-y: var(--space-xxxs)
	}

	.gap-y-xxs\@xl {
		--gap-y: var(--space-xxs)
	}

	.gap-y-xxs\@xl>* {
		--sub-gap-y: var(--space-xxs)
	}

	.gap-y-xs\@xl {
		--gap-y: var(--space-xs)
	}

	.gap-y-xs\@xl>* {
		--sub-gap-y: var(--space-xs)
	}

	.gap-y-sm\@xl {
		--gap-y: var(--space-sm)
	}

	.gap-y-sm\@xl>* {
		--sub-gap-y: var(--space-sm)
	}

	.gap-y-md\@xl {
		--gap-y: var(--space-md)
	}

	.gap-y-md\@xl>* {
		--sub-gap-y: var(--space-md)
	}

	.gap-y-lg\@xl {
		--gap-y: var(--space-lg)
	}

	.gap-y-lg\@xl>* {
		--sub-gap-y: var(--space-lg)
	}

	.gap-y-xl\@xl {
		--gap-y: var(--space-xl)
	}

	.gap-y-xl\@xl>* {
		--sub-gap-y: var(--space-xl)
	}

	.gap-y-xxl\@xl {
		--gap-y: var(--space-xxl)
	}

	.gap-y-xxl\@xl>* {
		--sub-gap-y: var(--space-xxl)
	}

	.gap-y-xxxl\@xl {
		--gap-y: var(--space-xxxl)
	}

	.gap-y-xxxl\@xl>* {
		--sub-gap-y: var(--space-xxxl)
	}

	.gap-y-xxxxl\@xl {
		--gap-y: var(--space-xxxxl)
	}

	.gap-y-xxxxl\@xl>* {
		--sub-gap-y: var(--space-xxxxl)
	}

	.gap-y-0\@xl {
		--gap-y: 0px
	}

	.gap-y-0\@xl>* {
		--sub-gap-y: 0px
	}

	.grid-col-1\@xl {
		--grid-columns: 1
	}

	.col-1\@xl {
		--span: 1
	}

	.grid-col-2\@xl {
		--grid-columns: 2
	}

	.col-2\@xl {
		--span: 2
	}

	.grid-col-3\@xl {
		--grid-columns: 3
	}

	.col-3\@xl {
		--span: 3
	}

	.grid-col-4\@xl {
		--grid-columns: 4
	}

	.col-4\@xl {
		--span: 4
	}

	.grid-col-5\@xl {
		--grid-columns: 5
	}

	.col-5\@xl {
		--span: 5
	}

	.grid-col-6\@xl {
		--grid-columns: 6
	}

	.col-6\@xl {
		--span: 6
	}

	.grid-col-7\@xl {
		--grid-columns: 7
	}

	.col-7\@xl {
		--span: 7
	}

	.grid-col-8\@xl {
		--grid-columns: 8
	}

	.col-8\@xl {
		--span: 8
	}

	.grid-col-9\@xl {
		--grid-columns: 9
	}

	.col-9\@xl {
		--span: 9
	}

	.grid-col-10\@xl {
		--grid-columns: 10
	}

	.col-10\@xl {
		--span: 10
	}

	.grid-col-11\@xl {
		--grid-columns: 11
	}

	.col-11\@xl {
		--span: 11
	}

	.grid-col-12\@xl {
		--grid-columns: 12
	}

	.col-12\@xl {
		--span: 12
	}

	.col-10\@xl,.col-11\@xl,.col-12\@xl,.col-1\@xl,.col-2\@xl,.col-3\@xl,.col-4\@xl,.col-5\@xl,.col-6\@xl,.col-7\@xl,.col-8\@xl,.col-9\@xl {
		flex-basis: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x));
		max-width: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--span)/ var(--grid-columns) + (var(--span) - 1) * var(--sub-gap-x))
	}

	.col\@xl {
		flex-grow: 1;
		flex-basis: 0;
		max-width: 100%
	}

	.col-content\@xl {
		flex-grow: 0;
		flex-basis: initial;
		max-width: initial
	}

	.offset-1\@xl {
		--offset: 1
	}

	.offset-2\@xl {
		--offset: 2
	}

	.offset-3\@xl {
		--offset: 3
	}

	.offset-4\@xl {
		--offset: 4
	}

	.offset-5\@xl {
		--offset: 5
	}

	.offset-6\@xl {
		--offset: 6
	}

	.offset-7\@xl {
		--offset: 7
	}

	.offset-8\@xl {
		--offset: 8
	}

	.offset-9\@xl {
		--offset: 9
	}

	.offset-10\@xl {
		--offset: 10
	}

	.offset-11\@xl {
		--offset: 11
	}

	.offset-10\@xl,.offset-11\@xl,.offset-1\@xl,.offset-2\@xl,.offset-3\@xl,.offset-4\@xl,.offset-5\@xl,.offset-6\@xl,.offset-7\@xl,.offset-8\@xl,.offset-9\@xl {
		margin-left: calc((100% - (var(--grid-columns) - var(--gap-modifier,1)) * var(--sub-gap-x)) * var(--offset)/ var(--grid-columns) + (var(--offset) + var(--offset-modifier,0)) * var(--sub-gap-x))
	}

	.offset-0\@xl {
		margin-left: 0
	}

	@media not all and (min-resolution: 0.001dpcm) {
		@supports not (translate:none) {
			.offset-0\@xl {
				margin-left:var(--gap-x)
			}
		}
	}
}

*,::after,::before {
	box-sizing: inherit
}

* {
	font: inherit
}

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
	margin: 0;
	padding: 0;
	border: 0
}

html {
	box-sizing: border-box
}

body {
	background-color: var(--color-bg,#fff)
}

article,aside,details,figcaption,figure,footer,form legend,header,hgroup,main,menu,nav,section {
	display: block
}

menu,ul {
	list-style: none
}

blockquote,q {
	quotes: none
}

button,input,select,textarea {
	margin: 0
}

.btn,.form-control,.link,.reset {
	background-color: transparent;
	padding: 0;
	border: 0;
	border-radius: 0;
	color: inherit;
	line-height: inherit;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none
}

select.form-control::-ms-expand {
	display: none
}

textarea {
	resize: vertical;
	overflow: auto;
	vertical-align: top
}

input::-ms-clear {
	display: none
}

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

img,svg,video {
	max-width: 100%;
	height: auto;
}

[data-theme] {
	background-color: var(--color-bg,hsl(0deg,0%,100%));
	color: var(--color-contrast-high,hsl(210deg,7%,21%))
}

:root {
	--space-unit: 1rem
}

*,:root {
	--space-xxxxs: calc(0.125 * var(--space-unit));
	--space-xxxs: calc(0.25 * var(--space-unit));
	--space-xxs: calc(0.375 * var(--space-unit));
	--space-xs: calc(0.5 * var(--space-unit));
	--space-sm: calc(0.75 * var(--space-unit));
	--space-md: calc(1.25 * var(--space-unit));
	--space-lg: calc(2 * var(--space-unit));
	--space-xl: calc(3.25 * var(--space-unit));
	--space-xxl: calc(5.25 * var(--space-unit));
	--space-xxxl: calc(8.5 * var(--space-unit));
	--space-xxxxl: calc(13.75 * var(--space-unit));
	--component-padding: var(--space-md)
}

:root {
	--radius-sm: calc(var(--radius, 0.375em)/2);
	--radius-md: var(--radius, 0.375em);
	--radius-lg: calc(var(--radius, 0.375em)*2);
	--shadow-ring: 0 0 0 1px hsla(0, 0%, 0%, 0.05);
	--shadow-xs: 0 0 0 1px hsla(0, 0%, 0%, 0.02),0 1px 3px -1px hsla(0, 0%, 0%, 0.2);
	--shadow-sm: 0 0.3px 0.4px hsla(0, 0%, 0%, 0.02),0 0.9px 1.5px hsla(0, 0%, 0%, 0.045),0 3.5px 6px hsla(0, 0%, 0%, 0.09);
	--shadow-md: 0 0.9px 1.25px hsla(0, 0%, 0%, 0.025),0 3px 5px hsla(0, 0%, 0%, 0.05),0 12px 20px hsla(0, 0%, 0%, 0.09);
	--shadow-lg: 0 1.2px 1.9px -1px hsla(0, 0%, 0%, 0.01),0 3px 5px -1px hsla(0, 0%, 0%, 0.015),0 8px 15px -1px hsla(0, 0%, 0%, 0.05),0 28px 40px -1px hsla(0, 0%, 0%, 0.1);
	--shadow-xl: 0 1.5px 2.1px -6px hsla(0, 0%, 0%, 0.009),0 3.6px 5.2px -6px hsla(0, 0%, 0%, 0.0115),0 7.3px 10.6px -6px hsla(0, 0%, 0%, 0.0125),0 16.2px 21.9px -6px hsla(0, 0%, 0%, 0.025),0 46px 60px -6px hsla(0, 0%, 0%, 0.15);
	--inner-glow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, 0.075);
	--inner-glow-top: inset 0 1px 0.5px hsla(0, 0%, 100%, 0.075);
	--ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
	--ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
	--ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
	--ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1)
}

:root {
	--heading-line-height: 1.2;
	--body-line-height: 1.4
}



h1 {
	font-size: var(--text-xxl,2rem)
}

h2 {
	font-size: var(--text-xl,1.75rem)
}

h3 {
	font-size: var(--text-lg,1.375rem)
}

h4 {
	font-size: var(--text-md,1.125rem)
}

small {
	font-size: var(--text-sm,.75rem)
}

.link,a {
	color: var(--color-primary,hsl(250deg,84%,54%));

}

strong {
	font-weight: 700
}

s {
	text-decoration: line-through
}

u {
	text-decoration: underline
}

.text-component h1,.text-component h2,.text-component h3,.text-component h4 {
	line-height: calc(var(--heading-line-height) * var(--line-height-multiplier,1));
	margin-bottom: calc(var(--space-unit) * .3125 * var(--text-space-y-multiplier,1))
}

.text-component h2,.text-component h3,.text-component h4 {
	margin-top: calc(var(--space-unit) * .9375 * var(--text-space-y-multiplier,1))
}

.text-component blockquote,.text-component ol li,.text-component p,.text-component ul li {
	line-height: calc(var(--body-line-height) * var(--line-height-multiplier,1))
}

.text-component .text-component__block,.text-component blockquote,.text-component ol,.text-component p,.text-component ul {
	margin-bottom: calc(var(--space-unit) * .9375 * var(--text-space-y-multiplier,1))
}

.text-component ol,.text-component ul {
	list-style-position: inside
}

.text-component ol ol,.text-component ol ul,.text-component ul ol,.text-component ul ul {
	padding-left: 1em;
	margin-bottom: 0
}

.text-component ul {
	list-style-type: disc
}

.text-component ol {
	list-style-type: decimal
}

.text-component img {
	display: block;
	margin: 0 auto
}

.text-component figcaption {
	text-align: center;
	margin-top: calc(var(--space-unit) * .5)
}

.text-component em {
	font-style: italic
}

.text-component hr {
	margin-top: calc(var(--space-unit) * 1.875 * var(--text-space-y-multiplier,1));
	margin-bottom: calc(var(--space-unit) * 1.875 * var(--text-space-y-multiplier,1));
	margin-left: auto;
	margin-right: auto
}

.text-component>:first-child {
	margin-top: 0
}

.text-component>:last-child {
	margin-bottom: 0
}

.text-component__block--full-width {
	width: 100vw;
	margin-left: calc(50% - 50vw)
}

@media (min-width: 48rem) {
	.text-component__block--left,.text-component__block--right {
		width:45%
	}

	.text-component__block--left img,.text-component__block--right img {
		width: 100%
	}

	.text-component__block--left {
		float: left;
		margin-right: calc(var(--space-unit) * .9375 * var(--text-space-y-multiplier,1))
	}

	.text-component__block--right {
		float: right;
		margin-left: calc(var(--space-unit) * .9375 * var(--text-space-y-multiplier,1))
	}
}

@media (min-width: 90rem) {
	.text-component__block--outset {
		width:calc(100% + 10.5 * var(--space-unit))
	}

	.text-component__block--outset img {
		width: 100%
	}

	.text-component__block--outset:not(.text-component__block--right) {
		margin-left: calc(-5.25 * var(--space-unit))
	}

	.text-component__block--left,.text-component__block--right {
		width: 50%
	}

	.text-component__block--right.text-component__block--outset {
		margin-right: calc(-5.25 * var(--space-unit))
	}
}

:root {
	--icon-xxxs: 8px;
	--icon-xxs: 12px;
	--icon-xs: 16px;
	--icon-sm: 24px;
	--icon-md: 32px;
	--icon-lg: 48px;
	--icon-xl: 64px;
	--icon-xxl: 96px;
	--icon-xxxl: 128px
}
/*--------------------------------

funqy icon font

-------------------------------- */


@font-face {
  font-family: 'funqy';
  src: url('/wp-content/themes/cookie-child/fonts/funqy.eot');
  src: url('/wp-content/themes/cookie-child/fonts/funqy.eot') format('embedded-opentype'),
	   url('/wp-content/themes/cookie-child/fonts/funqy.woff2') format('woff2'),
	   url('/wp-content/themes/cookie-child/fonts/funqy.woff') format('woff'),
	   url('/wp-content/themes/cookie-child/fonts/funqy.ttf') format('truetype'),
	   url('/wp-content/themes/cookie-child/fonts/funqy.svg') format('svg');
}
/* base class */
.icon-f {
  display: inline-block;
  font: normal normal normal 1em/1 'funqy';
  color: inherit;
  flex-shrink: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-right:8px;
}


/* size examples - relative units */
.icon-sm {
  font-size: 0.8em;
}

.icon-lg {
  font-size: 1.2em;
}

/* size examples - absolute units */
.icon-16 {
  font-size: 16px;
}

.icon-32 {
  font-size: 32px;
}

/* rotate the icon infinitely */
.icon-is-spinning {
  animation: icon-spin 1s infinite linear;
}

@keyframes icon-spin {
  0% {
	transform: rotate(0deg);
  }
  100% {
	transform: rotate(360deg);
  }
}

/* transform */
.icon-rotate-90 {
  transform: rotate(90deg);
}

.icon-rotate-180 {
  transform: rotate(180deg);
}

.icon-rotate-270 {
  transform: rotate(270deg);
}

.icon-flip-y {
  transform: scaleY(-1);
}

.icon-flip-x {
  transform: scaleX(-1);
}


/* icons */
.icon-image-location::before {
  content: "\ea02";
}

.icon-delivery-fast::before {
  content: "\ea03";
}

.icon-tag-check::before {
  content: "\ea04";
}

.icon-drill::before {
  content: "\ea05";
}

.icon-ai-generated-img::before {
  content: "\ea06";
}

.icon-bear-2::before {
  content: "\ea07";
}

.icon-credit-locked::before {
  content: "\ea08";
}

.icon-delivery-fast-1::before {
  content: "\ea09";
}

.icon-delivery-fast-2::before {
  content: "\ea0a";
}

.icon-lock-landscape::before {
  content: "\ea0b";
}

.icon-satisfied::before {
  content: "\ea0c";
}

.icon-customer-support::before {
  content: "\ea0d";
}

.icon-customer-support-1::before {
  content: "\ea0e";
}

.icon-satisfied-1::before {
  content: "\ea0f";
}

.icon-lock::before {
  content: "\ea10";
}

.icon-sparks::before {
  content: "\ea11";
}

.icon-hair-woman::before {
  content: "\ea12";
}

.icon-metrics::before {
  content: "\ea13";
}

.icon-delivery-fast-3::before {
  content: "\ea14";
}

.icon-pot::before {
  content: "\ea15";
}

.icon-armchair::before {
  content: "\ea16";
}

.icon-photo-frame::before {
  content: "\ea17";
}

.icon-crying-baby::before {
  content: "\ea18";
}

.icon-fence::before {
  content: "\ea19";
}

.icon-double-bed::before {
  content: "\ea1a";
}

.icon-happy-baby::before {
  content: "\ea1b";
}

.icon-shop::before {
  content: "\ea1c";
}

.icon-frame-effect::before {
  content: "\ea1d";
}

.icon-home::before {
  content: "\ea1e";
}

.icon-windmill-2::before {
  content: "\ea20";
}

.icon-n-check::before {
  content: " ";
  background: url('/wp-content/themes/cookie-child/img/n-check.svg') no-repeat;
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-right: 0.5em;

  top: 1px;
  position: relative;
}

.icon-search::before {
  content: "\ea21";
}

.icon-user-dots::before {
  content: "\ea22";
}

.icon-cart-shopping::before {
  content: "\ea23";
}
.bottomFixedlist-item {border-top:2px solid rgb(244, 233, 140);}
.site-search.bottomSearch {
position: absolute;
bottom: 59px;
z-index: 100;
width: 100%;
padding: 7px;
background: #fff !important;
height: 340px;
}
.woocommerce-pagination .page-numbers li .page-numbers {
	width: 40px;
height: 40px;
margin: 0;
padding: 0;
border: 1px solid #dfdede;
border-radius: 3px;
box-shadow: 0 4px 12px -2px rgba(0,0,0,.06);
line-height: 38px;
text-align: center;}

.woocommerce-pagination .page-numbers li .page-numbers.current {
	background: #222;
	color: #fff !important;
	border-color:#222;
}


/* --------------------------------

File#: _1_expandable-side-navigation
Title: Expandable Side Navigation
Descr: A side navigation with expandable sub-lists and popular links
Usage: codyhouse.co/license

-------------------------------- */
/* reset */
*, *::after, *::before {
  box-sizing: border-box;
}

* {
  font: inherit;
  margin: 0;
  padding: 0;
  border: 0;
}

body {
  background-color: hsl(0, 0%, 100%);
  font-family: system-ui, sans-serif;
  color: hsl(230, 7%, 23%);
  font-size: 1rem;
}

h1, h2, h3, h4 {
  line-height: 1.2;
  color: hsl(230, 13%, 9%);
  font-weight: 700;
}

h1 {
  font-size: 2.0736rem;
}

h2 {
  font-size: 1.728rem;
}

h3 {
  font-size: 1.25rem;
}

h4 {
  font-size: 1.2rem;
}

ol, ul, menu {
  list-style: none;
}

button, input, textarea, select {
  background-color: transparent;
  border-radius: 0;
  color: inherit;
  line-height: inherit;
  appearance: none;
}

textarea {
  resize: vertical;
  overflow: auto;
  vertical-align: top;
}

a {
  color: hsl(250, 84%, 54%);
}

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

img, video, svg {
  display: block;
  max-width: 100%;
}

@media (min-width: 64rem) {
  body {
	font-size: 1.25rem;
  }

  h1 {
	font-size: 3.051rem;
  }

	h2 {
	font-size: 2.44rem;
  }

	h3 {
	font-size: 1.75rem;
  }

	h4 {
	font-size: 1.5625rem;
  }
}

/* variables */
:root {
  /* colors */
  --ey9-color-primary-hsl: 250, 84%, 54%;
  --ey9-color-bg-hsl: 0, 0%, 100%;
  --ey9-color-contrast-high-hsl: 230, 7%, 23%;
  --ey9-color-contrast-higher-hsl: 230, 13%, 9%;
  --ey9-color-contrast-lower-hsl: 240, 4%, 85%;
  --ey9-color-contrast-low-hsl: 240, 4%, 65%;

  /* spacing */
  --ey9-space-4xs: 0.125rem;
  --ey9-space-3xs: 0.25rem;
  --ey9-space-2xs: 0.375rem;
  --ey9-space-xs: 0.5rem;
  --ey9-space-md: 1.25rem;

  /* typography */
  --ey9-text-sm: 0.833rem;
  --ey9-text-xs: 0.694rem;
}

@media(min-width: 64rem){
  :root {
	/* spacing */
	--ey9-space-4xs: 0.1875rem;
	--ey9-space-3xs: 0.375rem;
	--ey9-space-2xs: 0.5625rem;
	--ey9-space-xs: 0.75rem;
	--ey9-space-md: 2rem;

	/* typography */
	--ey9-text-sm: 1rem;
	--ey9-text-xs: 0.8rem;
  }
}

/* icons */
.ey9-icon {
  height: var(--ey9-size, 1em);
  width: var(--ey9-size, 1em);
  display: inline-block;
  color: inherit;
  fill: currentColor;
  line-height: 1;
  flex-shrink: 0;
  max-width: initial;
}

/* component */
.exsidenav__pop-nav {
  margin-bottom: var(--ey9-space-md);
}

.exsidenav__pop-link,
.exsidenav__link,
.exsidenav__control {
  display: flex;
  align-items: center;
  width: 100%;
  color: hsl(var(--ey9-color-contrast-high-hsl));
  text-decoration: none;
  line-height: 1;
  padding: var(--ey9-space-2xs);
  cursor: pointer;
  transition: 0.2s;
}
.exsidenav__pop-link:hover,
.exsidenav__link:hover,
.exsidenav__control:hover {
  color: hsl(var(--ey9-color-primary-hsl));
}

/* popular links */
.exsidenav__pop-link .exsidenav__icon {
  --ey9-size: 16px;
  margin-right: var(--ey9-space-2xs);
  opacity: 0.5;
  transition: opacity 0.2s;
}
.exsidenav__pop-link:hover .exsidenav__icon {
  opacity: 1;
}
.exsidenav__pop-link[aria-current=page] {
  color: hsl(var(--ey9-color-primary-hsl));
  background-color: hsla(var(--ey9-color-primary-hsl), 0.15);
  border-radius: 0.25em;
}
.exsidenav__pop-link[aria-current=page] .exsidenav__icon {
  opacity: 1;
}

/* main links */
.exsidenav__link {
  position: relative;
}
.exsidenav__list .exsidenav__list .exsidenav__link::before {
  /* left mark */
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  height: 100%;
  width: 1px;
}
.exsidenav__link[aria-current=page] {
  color: hsl(var(--ey9-color-primary-hsl));
}
.exsidenav__link[aria-current=page]::before {
  background-color: hsl(var(--ey9-color-primary-hsl));
}

/* list label */
.exsidenav__label-wrapper {
  margin: var(--ey9-space-md) 0 var(--ey9-space-2xs) var(--ey9-space-2xs);
}
.exsidenav__list .exsidenav__list .exsidenav__label-wrapper {
  margin: var(--ey9-space-xs) 0 var(--ey9-space-3xs) var(--ey9-space-2xs);
}

.exsidenav__label {
  color: hsl(var(--ey9-color-contrast-low-hsl));
  font-size: var(--ey9-text-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* button controlling sub navigations */
.exsidenav__control {
  font-weight: 600;
}
.exsidenav__control .exsidenav__icon {
  --ey9-size: 16px;
  display: block;
  margin-left: auto;
}
.exsidenav__control .icon__group {
  will-change: transform;
  -webkit-transform-origin: 8px 8px;
		  transform-origin: 8px 8px;
  transition: -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.exsidenav__control .icon__group > * {
  -webkit-transform-origin: 8px 8px;
		  transform-origin: 8px 8px;
  stroke-dasharray: 17;
  -webkit-transform: translateY(3px);
		  transform: translateY(3px);
  transition: stroke-dashoffset 0.3s, -webkit-transform 0.3s;
  transition: transform 0.3s, stroke-dashoffset 0.3s;
  transition: transform 0.3s, stroke-dashoffset 0.3s, -webkit-transform 0.3s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.exsidenav__control .icon__group > *:first-child {
  stroke-dashoffset: 10;
}
.exsidenav__control .icon__group > *:last-child {
  stroke-dashoffset: 10;
}
.exsidenav__control[aria-expanded=true] + .exsidenav__list {
  display: block;
  /* show the subnavigation */
}
.exsidenav__control[aria-expanded=true] + .exsidenav__list > * {
  -webkit-animation: exsidenav-entry-animation 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
		  animation: exsidenav-entry-animation 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  /* animate list items */
}
.exsidenav__control[aria-expanded=true] .icon__group {
  -webkit-transform: rotate(-90deg);
		  transform: rotate(-90deg);
}
.exsidenav__control[aria-expanded=true] .icon__group > *:first-child, .exsidenav__control[aria-expanded=true] .icon__group *:last-child {
  stroke-dashoffset: 0;
  -webkit-transform: translateY(0px);
		  transform: translateY(0px);
}

.exsidenav__list .exsidenav__list {
  display: none;
  border-left: 1px solid hsl(var(--ey9-color-contrast-lower-hsl));
  margin: var(--ey9-space-4xs) 0 0 var(--ey9-space-2xs);
}

@-webkit-keyframes exsidenav-entry-animation {
  from {
	opacity: 0;
	-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
  }
  to {
	opacity: 1;
	-webkit-transform: translateY(0px);
			transform: translateY(0px);
  }
}

@keyframes exsidenav-entry-animation {
  from {
	opacity: 0;
	-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
  }
  to {
	opacity: 1;
	-webkit-transform: translateY(0px);
			transform: translateY(0px);
  }
}
@media (min-width: 64rem) {
  .exsidenav__pop-link,
.exsidenav__link,
.exsidenav__control {
	font-size: var(--ey9-text-sm);
  }
}


/* <select> styles */
select {
  /* Reset */
  -webkit-appearance: none;
	 -moz-appearance: none;
		  appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
 }
  /* Personalize */
 form.woocommerce-ordering select.orderby{
  width: auto;
  padding: .6rem .6rem;
  background:  url(https://upload.wikimedia.org/wikipedia/commons/9/9d/Caret_down_font_awesome_blackvariation.svg) no-repeat right 0.8em center/1.4em, linear-gradient(to left, rgba(255, 255, 255, 0.3) 3em, rgba(255, 255, 255, 0.2) 3em);
  color: #333;
  border-radius: 0.25em;
  border:1px solid rgba(0,0,0,0.25);

  box-shadow: 0 0 .5em 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
  /* Remove IE arrow */
  /* Remove focus outline */
  /* <option> colors */
}
form.woocommerce-ordering select.orderby::-ms-expand {
  display: none;
}
form.woocommerce-ordering select.orderby:focus {
  outline: none;
}
form.woocommerce-ordering select.orderby option {
  color: inherit;
  background-color: white;;
}



.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] {background-color:#222 !important;}
.icon {
	--size: 1em;
	font-size: var(--size);
	height: 1em;
	width: 1em;
	display: inline-block;
	color: inherit;
	fill: currentColor;
	line-height: 1;
	flex-shrink: 0;
	max-width: initial
}

.icon--xxxs {
	--size: var(--icon-xxxs)
}

.icon--xxs {
	--size: var(--icon-xxs)
}

.icon--xs {
	--size: var(--icon-xs)
}

.icon--sm {
	--size: var(--icon-sm)
}

.icon--md {
	--size: var(--icon-md)
}

.icon--lg {
	--size: var(--icon-lg)
}

.icon--xl {
	--size: var(--icon-xl)
}

.icon--xxl {
	--size: var(--icon-xxl)
}

.icon--xxxl {
	--size: var(--icon-xxxl)
}

.icon--is-spinning {
	animation: icon-spin 1s infinite linear
}

@keyframes icon-spin {
	0% {
		transform: rotate(0)
	}

	100% {
		transform: rotate(360deg)
	}
}

.icon use {
	color: inherit;
	fill: currentColor
}

.btn {
	position: relative;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	white-space: nowrap;
	text-decoration: none;
	font-size: var(--btn-font-size,1em);
	padding-top: var(--btn-padding-y,.5em);
	padding-bottom: var(--btn-padding-y,.5em);
	padding-left: var(--btn-padding-x,.75em);
	padding-right: var(--btn-padding-x,.75em);
	border-radius: 4px;
}

.btn--sm {
	font-size: var(--btn-font-size-sm,.8em)
}

.btn--md {
	font-size: var(--btn-font-size-md,1.2em)
}

.btn--lg {
	font-size: var(--btn-font-size-lg,1.4em)
}

.btn--icon {
	padding: var(--btn-padding-y,.5em)
}

.form-control {
	font-size: var(--form-control-font-size,1em);
	padding-top: var(--form-control-padding-y,.5em);
	padding-bottom: var(--form-control-padding-y,.5em);
	padding-left: var(--form-control-padding-x,.75em);
	padding-right: var(--form-control-padding-x,.75em);
	border-radius: var(--form-control-radius,.25em)
}

.form-legend {
	color: var(--color-contrast-higher,hsl(204deg,28%,7%));
	line-height: var(--heading-line-height,1.2);
	font-weight: var(--heading-font-weight,700);
	font-size: var(--text-md,1.125rem);
	margin-bottom: var(--space-md)
}

.form-label {
	display: inline-block;
	font-size: var(--text-sm,.75rem)
}

:root {
	--z-index-header: 3;
	--z-index-popover: 5;
	--z-index-fixed-element: 10;
	--z-index-overlay: 15
}

:root {
	--display: block
}

.is-visible {
	display: var(--display)!important
}

.is-hidden {
	display: none!important
}

html:not(.js) .no-js\:is-hidden {
	display: none!important
}

@media print {
	.print\:is-hidden {
		display: none!important
	}

	.print\:shadow-none {
		box-shadow: none
	}
}



/* CSS */
.fastmenu li a {

  padding: 13px 20px 13px;
  outline: 0;
  cursor: pointer;
  position: relative;
  background-color: rgba(0, 0, 0, 0);
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

@media(max-width: 64rem){
.fastmenu i.icon-f {display: block;}
}
.fastmenu li a:after {
  content: "";
  background-color: rgb(244, 233, 140);
  width: 100%;
  z-index: -1;
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  transition: 0.2s;
  border-radius: 8px;
}
#chatra.chatra--side-bottom {bottom:60px !important;}
.fastmenu li a:hover:after {
top: 7px;
  left: 7px;
}
}
@media (min-width: 768px)
  .fastmenu li a {
	padding: 13px 50px 13px;
  }
}



/* --------------------------------

File#: _1_modal-window
Title: Modal Window
Descr: A modal dialog used to display critical information
Usage: codyhouse.co/license

-------------------------------- */
/* reset */
*, *::after, *::before {
  box-sizing: border-box;
}

* {
  font: inherit;
  margin: 0;
  padding: 0;
  border: 0;
}

/* body {
  background-color: hsl(0, 0%, 100%);
  font-family: system-ui, sans-serif;
  color: hsl(230, 7%, 23%);
  font-size: 1rem;
}

h1, h2, h3, h4 {
  line-height: 1.2;
  color: hsl(230, 13%, 9%);
  font-weight: 700;
}

h1 {
  font-size: 2.0736rem;
}

h2 {
  font-size: 1.728rem;
}

h3 {
  font-size: 1.25rem;
}

h4 {
  font-size: 1.2rem;
} */

ol, ul, menu {
  list-style: none;
}

button, input, textarea, select {
  background-color: transparent;
  border-radius: 0;
  color: inherit;
  line-height: inherit;
  appearance: none;
}

textarea {
  resize: vertical;
  overflow: auto;
  vertical-align: top;
}

a {
  color: hsl(250, 84%, 54%);
}

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

img, video, svg {
  display: block;
  max-width: 100%;
}

@media (min-width: 64rem) {
  body {
	font-size: 1.15rem;
  }

  h1 {
	font-size: 3.051rem;
  }

	h2 {
	font-size: 2.44rem;
  }

	h3 {
	font-size: 1.75rem;
  }

	h4 {
	font-size: 1.5625rem;
  }
}

/* Homepage products */

/* --------------------------------

File#: _2_product-card-v2
Title: Product Card v2
Descr: A selection of product information used as a teaser for further content
Usage: codyhouse.co/license

-------------------------------- */
.prod-card-v2 {
  --rating-icon-size: 28px;
  position: relative;
}

.prod-card-v2__img-link {
  display: block;
  position: relative;
  overflow: hidden;
}
.prod-card-v2__img-link img {
  display: block;
  width: 100%;
  transition: 0.3s;
}
.prod-card-v2__img-link img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
	 object-fit: cover;
  opacity: 0;
}
.prod-card-v2__img-link:hover img:nth-child(1) {
  opacity: 0.85;
}
.prod-card-v2__img-link:hover img:nth-child(2) {
  opacity: 1;
}

.prod-card-v2__badge {
  position: absolute;
  z-index: 1;
  top: var(--space-sm);
  right: var(--space-sm);
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.9);
  padding: var(--space-xxs) var(--space-sm);
  border-radius: var(--radius-md);
  pointer-events: none;
  font-size: var(--text-sm);
  color: var(--color-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.product-card-v2__title {
  color: var(--color-contrast-higher);
  text-decoration: none;
  font-weight: bold;
}
.product-card-v2__title:hover {
  text-decoration: underline;
}

.prod-card-v2__price {
  text-decoration: none;
}

.prod-card-v2__old-price {
  color: var(--color-contrast-medium);
  text-decoration: line-through;
}
.prod-card-v2__old-price::before {
  content: "original price";
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
		  clip-path: inset(50%);
}


/* --------------------------------

File#: _3_products-gallery-v2
Title: Products Gallery v2
Descr: A gallery of product cards
Usage: codyhouse.co/license

-------------------------------- */
/* --------------------------------

File#: _1_feature-v10
Title: Feature v10
Descr: A feature section containing two adjacent content blocks
Usage: codyhouse.co/license

-------------------------------- */
.feature-v10 {
  position: relative;
  z-index: 1;
}

.feature-v10__img-link {
  transition: 0.3s;
}
.feature-v10__img-link:hover {
  opacity: 0.8;
}

.feature-v10__media {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
	 object-fit: cover;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.feature-v10__content {
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

.feature-v10__link {
  position: relative;
  text-decoration: none;
  color: inherit;
  display: inline-block;
  will-change: transform;
  transition: 0.3s var(--ease-out);
  transform-origin: left bottom;
}
.feature-v10__link i { /* label */
  position: relative;
  z-index: 2;
  display: inline-block;
  will-change: transform;
  transition: transform 0.3s var(--ease-out), color 0.3s;
}
.feature-v10__link::after { /* animated border */
  content: "";
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.2);
  height: 2px;
  width: 100%;
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  -webkit-clip-path: inset(0% round var(--radius-sm));
		  clip-path: inset(0% round var(--radius-sm));
  transition: height 0.3s var(--ease-out), background-color 0.3s;
}
.feature-v10__link:hover {
  transform: scale(1.3);
}
.feature-v10__link:hover i {
  color: var(--color-bg);
  transform: scale(0.7); /* reverse parent transformation */
}
.feature-v10__link:hover::after {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 1);
  height: 100%;
}

@media (min-width: 64rem) {
  .feature-v10__item:first-child .feature-v10__media {
	border-radius: var(--radius-lg) 0 0 0;
  }
  .feature-v10__item:first-child .feature-v10__content {
	border-radius: 0 var(--radius-lg) 0 0;
  }
  .feature-v10__item:last-child .feature-v10__media {
	border-radius: 0 0 var(--radius-lg) 0;
  }
  .feature-v10__item:last-child .feature-v10__content {
	border-radius: 0 0 0 var(--radius-lg);
  }
}

/* --------------------------------

File#: _1_feature
Title: Feature
Descr: Content group containing text + media (img, video, iframe, inline SVG)
Usage: codyhouse.co/license

-------------------------------- */

/* --------------------------------

File#: _1_feature
Title: Feature
Descr: Content group containing text + media (img, video, iframe, inline SVG)
Usage: codyhouse.co/license

-------------------------------- */

/* END HOMEPAGE */
/* variables */
:root {
  /* colors */
  --mc4-color-primary-hsl: 250, 84%, 54%;
  --mc4-color-bg-hsl: 0, 0%, 100%;
  --mc4-color-contrast-high-hsl: 230, 7%, 23%;
  --mc4-color-contrast-higher-hsl: 230, 13%, 9%;
  --mc4-color-contrast-lower-hsl: 240, 4%, 85%;
  --mc4-color-bg-light-hsl: 0, 0%, 100%;
  --mc4-color-bg-lighter-hsl: 0, 0%, 100%;
  --mc4-color-black-hsl: 230, 13%, 9%;
  --mc4-color-white-hsl: 0, 0%, 100%;
  --mc4-color-bg-dark-hsl: 240, 4%, 95%;
  --mc4-color-primary-darker-hsl: 250, 84%, 38%;
  --mc4-color-primary-light-hsl: 250, 84%, 60%;
  --mc4-color-accent-hsl: 342, 89%, 48%;

  /* spacing */
  --mc4-space-xs: 0.5rem;
  --mc4-space-sm: 0.75rem;
  --mc4-space-md: 1.25rem;
  --mc4-space-2xs: 0.375rem;

  /* typography */
  --mc4-text-lg: 1.25rem;
  --mc4-text-md: 1.2rem;
  --mc4-text-sm: 0.833rem;
}

@media(min-width: 64rem){
  :root {
	/* spacing */
	--mc4-space-xs: 0.75rem;
	--mc4-space-sm: 1.125rem;
	--mc4-space-md: 2rem;
	--mc4-space-2xs: 0.5625rem;

	/* typography */
	--mc4-text-lg: 1.75rem;
	--mc4-text-md: 1.5625rem;
	--mc4-text-sm: 1rem;
  }
}

/* buttons */
.mc4-btn {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 1em;
  white-space: nowrap;
  text-decoration: none;
  background: hsl(var(--mc4-color-bg-dark-hsl));
  color: hsl(var(--mc4-color-contrast-higher-hsl));
  cursor: pointer;
  text-decoration: none;
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: all 0.2s ease;
  will-change: transform;
  padding: var(--mc4-space-2xs) var(--mc4-space-sm);
  border-radius: 0.25em;
}

.mc4-btn:focus-visible {
  box-shadow: 0px 0px 0px 2px hsl(var(--mc4-color-bg-hsl)), 0px 0px 0px 4px hsla(var(--mc4-color-contrast-higher-hsl), 0.15);
  outline: none;
}

.mc4-btn:active {
  transform: translateY(2px);
}

.mc4-btn--primary {
  background: hsl(var(--mc4-color-primary-hsl));
  color: hsl(var(--mc4-color-white-hsl));
  box-shadow: inset 0px 1px 0px hsla(var(--mc4-color-white-hsl), 0.15), 0px 1px 3px hsla(var(--mc4-color-primary-darker-hsl), 0.25), 0px 2px 6px hsla(var(--mc4-color-primary-darker-hsl), 0.1), 0px 6px 10px -2px hsla(var(--mc4-color-primary-darker-hsl), 0.25);
}

.mc4-btn--primary:hover {
  background: hsl(var(--mc4-color-primary-light-hsl));
  box-shadow: inset 0px 1px 0px hsla(var(--mc4-color-white-hsl), 0.15), 0px 1px 2px hsla(var(--mc4-color-primary-darker-hsl), 0.25), 0px 1px 4px hsla(var(--mc4-color-primary-darker-hsl), 0.1), 0px 3px 6px -2px hsla(var(--mc4-color-primary-darker-hsl), 0.25);
}

.mc4-btn--primary:focus {
  box-shadow: inset 0px 1px 0px hsla(var(--mc4-color-white-hsl), 0.15), 0px 1px 2px hsla(var(--mc4-color-primary-darker-hsl), 0.25), 0px 1px 4px hsla(var(--mc4-color-primary-darker-hsl), 0.1), 0px 3px 6px -2px hsla(var(--mc4-color-primary-darker-hsl), 0.25), 0px 0px 0px 2px hsl(var(--mc4-color-bg-hsl)), 0px 0px 0px 4px hsl(var(--mc4-color-primary-hsl));
}

.mc4-btn--subtle {
  background: hsl(var(--mc4-color-bg-lighter-hsl));
  color: hsl(var(--mc4-color-contrast-higher-hsl));
  box-shadow: inset 0px 1px 0px hsla(var(--mc4-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--mc4-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--mc4-color-black-hsl), 0.2), 0 0.3px 0.4px rgba(0, 0, 0, 0.025),0 0.9px 1.5px rgba(0, 0, 0, 0.05), 0 3.5px 6px rgba(0, 0, 0, 0.1);
}

.mc4-btn--subtle:hover {
  background: hsl(var(--mc4-color-bg-light-hsl));
  box-shadow: inset 0px 1px 0px hsla(var(--mc4-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--mc4-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--mc4-color-black-hsl), 0.2), 0 0.1px 0.3px rgba(0, 0, 0, 0.06),0 1px 2px rgba(0, 0, 0, 0.12);
}

.mc4-btn--subtle:focus {
  box-shadow: inset 0px 1px 0px hsla(var(--mc4-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--mc4-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--mc4-color-black-hsl), 0.2), 0 0.1px 0.3px rgba(0, 0, 0, 0.06),0 1px 2px rgba(0, 0, 0, 0.12), 0px 0px 0px 2px hsl(var(--mc4-color-bg-hsl)), 0px 0px 0px 4px hsl(var(--mc4-color-contrast-high-hsl));
}

/* icons */
.mc4-icon {
  height: var(--mc4-size, 1em);
  width: var(--mc4-size, 1em);
  display: inline-block;
  color: inherit;
  fill: currentColor;
  line-height: 1;
  flex-shrink: 0;
  max-width: initial;
}

.mc4-icon--xs {
  --mc4-size: 16px;
}

.mc4-icon--sm {
  --mc4-size: 24px;
}

/* component */
.modal {
  position: fixed;
  z-index: 15;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
}
.modal:not(.modal--is-visible) {
  pointer-events: none;
  background-color: transparent;
}

.modal a:not[.btn] {text-decoration: underline !important; color:#222;}
.modal--is-visible {
  opacity: 1;
  visibility: visible;
}

/* close button */
.modal__close-btn {
  display: flex;
  flex-shrink: 0;
  border-radius: 50%;
  transition: 0.2s;
}
.modal__close-btn svg {
  display: block;
  margin: auto;
}

.modal__close-btn--outer {
  /* close button - outside the modal__content */
  width: 48px;
  height: 48px;
  position: fixed;
  top: var(--mc4-space-sm);
  right: var(--mc4-space-sm);
  z-index: 10;
  background-color: hsla(var(--mc4-color-black-hsl), 0.9);
  transition: 0.2s;
}
.modal__close-btn--outer svg {
  color: hsl(var(--mc4-color-white-hsl));
  /* icon color */
  transition: -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), -webkit-transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.modal__close-btn--outer:hover {
  background-color: hsla(var(--mc4-color-black-hsl), 1);
}
.modal__close-btn--outer:hover svg {
  -webkit-transform: scale(1.1);
		  transform: scale(1.1);
}

.modal__close-btn--inner {
  /* close button - inside the modal__content */
  --mc4-size: 32px;
  width: var(--mc4-size);
  height: var(--mc4-size);
  background-color: hsl(var(--mc4-color-bg-light-hsl));
  box-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, 0.075), 0 0.3px 0.4px rgba(0, 0, 0, 0.025),0 0.9px 1.5px rgba(0, 0, 0, 0.05), 0 3.5px 6px rgba(0, 0, 0, 0.1);
  transition: 0.2s;
}
.modal__close-btn--inner svg {
  color: inherit;
  /* icon color */
}
.modal__close-btn--inner:hover {
  background-color: hsl(var(--mc4-color-bg-lighter-hsl));
  box-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, 0.075), 0 0.9px 1.5px rgba(0, 0, 0, 0.03),0 3.1px 5.5px rgba(0, 0, 0, 0.08),0 14px 25px rgba(0, 0, 0, 0.12);
}

/* animations */
:root {
  --modal-transition-duration: 0.2s;
  /* fallback (i.e., unless specified differently in the variations 👇) */
}

@media (prefers-reduced-motion: no-preference) {
  .modal--animate-fade {
	--modal-transition-duration: 0.2s;
	transition: opacity var(--modal-transition-duration), background-color var(--modal-transition-duration), visibility 0s var(--modal-transition-duration);
  }
  .modal--animate-fade.modal--is-visible {
	transition: opacity var(--modal-transition-duration), background-color var(--modal-transition-duration), visibility 0s;
  }

  .modal--animate-scale,
.modal--animate-translate-up,
.modal--animate-translate-down,
.modal--animate-translate-right,
.modal--animate-translate-left {
	--modal-transition-duration: 0.2s;
	transition: opacity var(--modal-transition-duration), background-color var(--modal-transition-duration), visibility 0s var(--modal-transition-duration);
  }
  .modal--animate-scale .modal__content,
.modal--animate-translate-up .modal__content,
.modal--animate-translate-down .modal__content,
.modal--animate-translate-right .modal__content,
.modal--animate-translate-left .modal__content {
	will-change: transform;
	transition: -webkit-transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .modal--animate-scale.modal--is-visible,
.modal--animate-translate-up.modal--is-visible,
.modal--animate-translate-down.modal--is-visible,
.modal--animate-translate-right.modal--is-visible,
.modal--animate-translate-left.modal--is-visible {
	transition: opacity var(--modal-transition-duration), background-color var(--modal-transition-duration), visibility 0s;
  }
  .modal--animate-scale.modal--is-visible .modal__content,
.modal--animate-translate-up.modal--is-visible .modal__content,
.modal--animate-translate-down.modal--is-visible .modal__content,
.modal--animate-translate-right.modal--is-visible .modal__content,
.modal--animate-translate-left.modal--is-visible .modal__content {
	-webkit-transform: scale(1);
			transform: scale(1);
	/* reset all transformations */
  }

  .modal--animate-slide-up,
.modal--animate-slide-down,
.modal--animate-slide-right,
.modal--animate-slide-left {
	--modal-transition-duration: 0.3s;
	transition: opacity 0s var(--modal-transition-duration), background-color var(--modal-transition-duration), visibility 0s var(--modal-transition-duration);
  }
  .modal--animate-slide-up .modal__content,
.modal--animate-slide-down .modal__content,
.modal--animate-slide-right .modal__content,
.modal--animate-slide-left .modal__content {
	will-change: transform;
	transition: -webkit-transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform var(--modal-transition-duration) cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .modal--animate-slide-up.modal--is-visible,
.modal--animate-slide-down.modal--is-visible,
.modal--animate-slide-right.modal--is-visible,
.modal--animate-slide-left.modal--is-visible {
	transition: background-color var(--modal-transition-duration), visibility 0s;
  }
  .modal--animate-slide-up.modal--is-visible .modal__content,
.modal--animate-slide-down.modal--is-visible .modal__content,
.modal--animate-slide-right.modal--is-visible .modal__content,
.modal--animate-slide-left.modal--is-visible .modal__content {
	-webkit-transform: scale(1);
			transform: scale(1);
	/* reset all transformations */
  }

  /* scale */
  .modal--animate-scale .modal__content {
	-webkit-transform: scale(0.95);
			transform: scale(0.95);
  }

  /* translate */
  .modal--animate-translate-up .modal__content {
	-webkit-transform: translateY(40px);
			transform: translateY(40px);
  }

  .modal--animate-translate-down .modal__content {
	-webkit-transform: translateY(-40px);
			transform: translateY(-40px);
  }

  .modal--animate-translate-right .modal__content {
	-webkit-transform: translateX(-40px);
			transform: translateX(-40px);
  }

  .modal--animate-translate-left .modal__content {
	-webkit-transform: translateX(40px);
			transform: translateX(40px);
  }

  /* slide */
  .modal--animate-slide-up .modal__content {
	-webkit-transform: translateY(100%);
			transform: translateY(100%);
  }

  .modal--animate-slide-down .modal__content {
	-webkit-transform: translateY(-100%);
			transform: translateY(-100%);
  }

  .modal--animate-slide-right .modal__content {
	-webkit-transform: translateX(-100%);
			transform: translateX(-100%);
  }

  .modal--animate-slide-left .modal__content {
	-webkit-transform: translateX(100%);
			transform: translateX(100%);
  }
}
/* load content - optional */
.modal--is-loading .modal__content {
  visibility: hidden;
}
.modal--is-loading .modal__loader {
  display: flex;
}

.modal__loader {
  /* loader icon */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: none;
  pointer-events: none;
}

/* --image */
.modal-img-btn {
  position: relative;
  cursor: pointer;
}
.modal-img-btn::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: hsla(var(--mc4-color-black-hsl), 0);
  transition: background 0.2s;
}
.modal-img-btn:hover::after {
  background-color: hsla(var(--mc4-color-black-hsl), 0.7);
}
.modal-img-btn:hover .modal-img-btn__icon-wrapper {
  opacity: 1;
}

.modal-img-btn__icon-wrapper {
  position: absolute;
  z-index: 2;
  top: calc(50% - 24px);
  left: calc(50% - 24px);
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: hsla(var(--mc4-color-black-hsl), 0.7);
  opacity: 0;
  transition: opacity 0.2s;
}
.modal-img-btn__icon-wrapper .mc4-icon {
  color: hsl(var(--mc4-color-white-hsl));
}

/* utility classes */
.mc4-max-width-100\% {
  max-width: 150rem;
}

.mc4-max-height-100\% {
  max-height: 100%;
}

.mc4-shadow-md {
  box-shadow:0 0.9px 1.5px rgba(0, 0, 0, 0.03),0 3.1px 5.5px rgba(0, 0, 0, 0.08),0 14px 25px rgba(0, 0, 0, 0.12);
}

.mc4-radius-md {
  border-radius: 0.25em;
}

.mc4-block {
  display: block;
}

.mc4-pointer-events-none {
  pointer-events: none;
}

.mc4-flex-center {
  justify-content: center;
  align-items: center;
}

.mc4-flex {
  display: flex;
}

.mc4-height-100\% {
  height: 100%;
}

.mc4-width-100\% {
  width: 100%;
}

.mc4-padding-md {
  padding: var(--mc4-space-md);
}

.mc4-bg-black {
  --mc4-bg-o: 1;
  background-color: hsla(var(--mc4-color-black-hsl), var(--mc4-bg-o, 1));
}

.mc4-width-3xl {
  width: 8rem;
}

.mc4-overflow-hidden {
  overflow: hidden;
}

.mc4-text-lg {
  font-size: var(--mc4-text-lg);
}

.mc4-text-component :where(h1, h2, h3, h4) {
  line-height: var(--mc4-heading-line-height, 1.2);
  margin-top: calc(var(--mc4-space-md) * var(--mc4-space-multiplier, 1));
  margin-bottom: calc(var(--mc4-space-sm) * var(--mc4-space-multiplier, 1));
}

.mc4-text-component :where(p, blockquote, ul li, ol li) {
  line-height: var(--mc4-body-line-height, 1.4);
}

.mc4-text-component :where(ul, ol, p, blockquote, .mc4-text-component__block) {
  margin-bottom: calc(var(--mc4-space-sm) * var(--mc4-space-multiplier, 1));
}

.mc4-text-component :where(ul, ol) {
  padding-left: 1.25em;
}

.mc4-text-component ul :where(ul, ol), .mc4-text-component ol :where(ul, ol) {
  padding-left: 1em;
  margin-bottom: 0;
}

.mc4-text-component ul {
  list-style-type: disc;
}

.mc4-text-component ol {
  list-style-type: decimal;
}

.mc4-text-component img {
  display: block;
  margin: 0 auto;
}

.mc4-text-component figcaption {
  margin-top: calc(var(--mc4-space-xs) * var(--mc4-space-multiplier, 1));
  font-size: var(--mc4-text-sm);
  text-align: center;}

.mc4-text-component em {
  font-style: italic;
}

.mc4-text-component strong {
  font-weight: bold;
}

.mc4-text-component s {
  text-decoration: line-through;
}

.mc4-text-component u {
  text-decoration: underline;
}

.mc4-text-component mark {
  background-color: hsla(var(--mc4-color-accent-hsl), 0.2);
  color: inherit;
}

.mc4-text-component blockquote {
  padding-left: 1em;
  border-left: 4px solid hsl(var(--mc4-color-contrast-lower-hsl));
  font-style: italic;
}

.mc4-text-component hr {
  margin: calc(var(--mc4-space-md) * var(--mc4-space-multiplier, 1)) auto;
  background: hsl(var(--mc4-color-contrast-lower-hsl));
  height: 1px;
}

.mc4-text-component > *:first-child {
  margin-top: 0;
}

.mc4-text-component > *:last-child {
  margin-bottom: 0;
}

.mc4-text-component.mc4-line-height-xs {
  --mc4-heading-line-height: 1;
  --mc4-body-line-height: 1.1;
}

.mc4-text-component.mc4-line-height-sm {
  --mc4-heading-line-height: 1.1;
  --mc4-body-line-height: 1.2;
}

.mc4-text-component.mc4-line-height-md {
  --mc4-heading-line-height: 1.15;
  --mc4-body-line-height: 1.4;
}

.mc4-text-component.mc4-line-height-lg {
  --mc4-heading-line-height: 1.22;
  --mc4-body-line-height: 1.58;
}

.mc4-text-component.mc4-line-height-xl {
  --mc4-heading-line-height: 1.3;
  --mc4-body-line-height: 1.72;
}

.mc4-top-0 {
  top: 0;
}

.mc4-position-sticky {
  position: sticky;
}

.mc4-float-right {
  float: right;
}

:where(.mc4-inner-glow) {
  position: relative;
}

.mc4-inner-glow::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, 0.075);
}

.mc4-bg {
  --mc4-bg-o: 1;
  background-color: hsla(var(--mc4-color-bg-hsl), var(--mc4-bg-o, 1));
}

.mc4-overflow-auto {
  overflow: auto;
}

.mc4-max-width-sm {
  max-width: 48rem;
}

@media not all and (min-width: 64rem) {
  .mc4-display\@md {
	display:none !important;
  }
}

.mc4-gap-xs {
  gap: var(--mc4-space-xs);
}

.mc4-justify-end {
  justify-content: flex-end;
}

.mc4-padding-x-md {
  padding-left: var(--mc4-space-md);
  padding-right: var(--mc4-space-md);
}

.mc4-padding-y-sm {
  padding-top: var(--mc4-space-sm);
  padding-bottom: var(--mc4-space-sm);
}

.mc4-text-md {
  font-size: var(--mc4-text-md);
}

.mc4-text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mc4-justify-between {
  justify-content: space-between;
}

.mc4-items-center {
  align-items: center;
}

.mc4-bg-contrast-lower {
  --mc4-bg-o: 1;
  background-color: hsla(var(--mc4-color-contrast-lower-hsl), var(--mc4-bg-o, 1));
}

.mc4-max-width-xs {
  max-width: 38rem;
}

.mc4-flex-shrink-0 {
  flex-shrink: 0;
}

:where(.mc4-inner-glow-top) {
  position: relative;
}

.mc4-inner-glow-top::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: var(inset 0 1px 0.5px hsla(0, 0%, 100%, 0.075));
}

.mc4-momentum-scrolling {
  -webkit-overflow-scrolling: touch;
}

.mc4-flex-grow {
  flex-grow: 1;
}

.mc4-flex-column {
  flex-direction: column;
}

.mc4-bg-opacity-90\% {
  --mc4-bg-o: 0.9;
}

.mc4-bg-opacity-50\% {
  --mc4-bg-o: 0.5;
}

@media(min-width: 64rem){
  .mc4-hide\@md {
	display: none !important;
  }
}

/* Mobile menu sticky bottom */


.menu-overlay {display: none !important;}
.bottomFixednavbar {

  background-color: var(--color-contrast-higher);

  display: flex;
  justify-content: space-between;
  width: 100%;

  position:absolute;
  bottom:0px;
  box-shadow: rgba(0, 0, 0, 0.6) 0px 1px 15px 0px;
  margin: auto;
  z-index: 9999999999 !important;
  overflow: hidden;
}
body.woocommerce-cart .bottomFixednavbar,
body.woocommerce-checkout .bottomFixednavbar {display: none !important;}


@media only screen and (min-width: 771px) {
  #shoptimizer-modals-wrapper  {
	top: -59px;
	right: -20px;
	position: absolute;
  }
}


.bottomFixedlist-item {
  list-style-type: none;
  flex-basis: 100%;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  color: var(--color-white);
  /* transform: translateY(0);
  transition: transform 0.5s ease, opacity 0.2s ease; */
  cursor: pointer;
}

.bottomFixedlist-item-name {
  font-size: 10px;
  font-weight: 300;
  position: absolute;
  bottom:6px;
  text-transform: uppercase;
  color: var(--color-white);
  /* transform: translate(0, 50px);
  transition: transform 0.5s ease, opacity 0.2s ease;
  opacity: 0; */
}

.bottomFixednavbar .icon-f {font-size: 16px; padding-right: 0; padding-bottom: 14px; color:#fff;}
.bottomFixedlist-item:hover,
.bottomFixedlist-item:hover .icon-f,
.bottomFixedlist-item:hover .bottomFixedlist-item-name{color: var(--color-black);}






/* --------------------------------

File#: _2_image-interest-points
Title: Points Of Interest
Descr: Highlight the points of interest of an image and provide additional details for each one.
Usage: codyhouse.co/license

-------------------------------- */
.imgclk img,
.imgclk source {
object-fit: cover;
width: 100%;

}
.imgclk picture {
/* height:  90vh; */
}

.poi {
  pointer-events: none;
}

.poi__item {
  position: absolute;
  pointer-events: auto;
}

.poi__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  --size: 32px;
  height: var(--size);
  width: var(--size);
  border-radius: 50%;
  background-color: rgb(244, 233, 140);
  box-shadow: var(--inner-glow-top), var(--shadow-sm);
  cursor: pointer;
  transition: 0.2s;
}
.poi__btn::after {
  /* pulse ring */
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 1px 1px rgb(244, 233, 140);
  -webkit-animation: poi-pulse 2s infinite;
		  animation: poi-pulse 2s infinite;
}
.poi__btn .icon {
  color: var(--color-black);
  /* icon color */
  --size: 12px;
  transition: -webkit-transform 0.3s var(--ease-out-back);
  transition: transform 0.3s var(--ease-out-back);
  transition: transform 0.3s var(--ease-out-back), -webkit-transform 0.3s var(--ease-out-back);
}
.poi__btn:hover .icon {
  -webkit-transform: scale(1.1);
		  transform: scale(1.1);
}

.poi__item--visited button {

  /* style of clicked button */
  color: var(--color-white);
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.95);
  -webkit-backdrop-filter: blur(10px);
		  backdrop-filter: blur(10px);
}
.poi__item--visited button::after {
  display: none;
}
.poi__item--visited .poi__btn .icon {color:#fff;}
@-webkit-keyframes poi-pulse {
  0% {
	-webkit-transform: scale(1);
			transform: scale(1);
	opacity: 1;
  }
  50% {
	opacity: 1;
  }
  100% {
	-webkit-transform: scale(1.6);
			transform: scale(1.6);
	opacity: 0;
  }
}

@keyframes poi-pulse {
  0% {
	-webkit-transform: scale(1);
			transform: scale(1);
	opacity: 1;
  }
  50% {
	opacity: 1;
  }
  100% {
	-webkit-transform: scale(1.6);
			transform: scale(1.6);
	opacity: 0;
  }
}


.checkstyle {
	position: relative;
	  left: calc(-50vw + 50%);
	  width: 100vw;

	  text-align: center;

}

.checkstyle li {background:rgb(244, 233, 140, 0.15); }
.sr-only,.sr-only-focusable:not(:focus):not(:focus-within) {
	position: absolute;
	clip: rect(1px,1px,1px,1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	overflow: hidden;
	padding: 0;
	border: 0;
	white-space: nowrap
}

.flex {
	display: flex
}

.inline-flex {
	display: inline-flex
}

.flex-wrap {
	flex-wrap: wrap
}

.flex-nowrap {
	flex-wrap: nowrap
}

.flex-column {
	flex-direction: column
}

.flex-column-reverse {
	flex-direction: column-reverse
}

.flex-row {
	flex-direction: row
}

.flex-row-reverse {
	flex-direction: row-reverse
}

.flex-center {
	justify-content: center;
	align-items: center
}

.flex-grow {
	flex-grow: 1
}

.flex-grow-0 {
	flex-grow: 0
}

.flex-shrink {
	flex-shrink: 1
}

.flex-shrink-0 {
	flex-shrink: 0
}

.flex-basis-0 {
	flex-basis: 0
}

.justify-start {
	justify-content: flex-start
}

.justify-end {
	justify-content: flex-end
}

.justify-center {
	justify-content: center
}

.justify-between {
	justify-content: space-between
}

.items-center {
	align-items: center
}

.items-start {
	align-items: flex-start
}

.items-end {
	align-items: flex-end
}

.items-baseline {
	align-items: baseline
}

.items-stretch {
	align-items: stretch
}

.content-start {
	align-content: start
}

.content-end {
	align-content: end
}

.content-center {
	align-content: center
}

.content-between {
	align-content: space-between
}

.order-1 {
	order: 1
}

.order-2 {
	order: 2
}

.order-3 {
	order: 3
}

[class*=" aspect-ratio"],[class^=aspect-ratio] {
	--aspect-ratio: calc(16/9);
	position: relative;
	height: 0;
	padding-bottom: calc(100% / (var(--aspect-ratio)))
}

[class*=" aspect-ratio"]>*,[class^=aspect-ratio]>* {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

[class*=" aspect-ratio"]>:not(iframe),[class^=aspect-ratio]>:not(iframe) {
	-o-object-fit: cover;
	object-fit: cover
}

.aspect-ratio-16\:9 {
	--aspect-ratio: calc(16/9)
}

.aspect-ratio-3\:2 {
	--aspect-ratio: calc(3/2)
}

.aspect-ratio-4\:3 {
	--aspect-ratio: calc(4/3)
}

.aspect-ratio-5\:4 {
	--aspect-ratio: calc(5/4)
}

.aspect-ratio-1\:1 {
	--aspect-ratio: calc(1/1)
}

.aspect-ratio-4\:5 {
	--aspect-ratio: calc(4/5)
}

.aspect-ratio-3\:4 {
	--aspect-ratio: calc(3/4)
}

.aspect-ratio-2\:3 {
	--aspect-ratio: calc(2/3)
}

.aspect-ratio-9\:16 {
	--aspect-ratio: calc(9/16)
}

.ratio-16\:9 {
	aspect-ratio: 16/9
}

.ratio-3\:2 {
	aspect-ratio: 3/2
}

.ratio-4\:3 {
	aspect-ratio: 4/3
}

.ratio-5\:4 {
	aspect-ratio: 5/4
}

.ratio-1\:1 {
	aspect-ratio: 1/1
}

.ratio-4\:5 {
	aspect-ratio: 4/5
}

.ratio-3\:4 {
	aspect-ratio: 3/4
}

.ratio-2\:3 {
	aspect-ratio: 2/3
}

.ratio-9\:16 {
	aspect-ratio: 9/16
}

.block {
	display: block
}

.inline-block {
	display: inline-block
}

.inline {
	display: inline
}

.contents {
	display: contents
}

.hide {
	display: none
}

.css-grid {
	display: grid
}

.css-inline-grid {
	display: inline-grid
}

.space-unit-rem {
	--space-unit: 1rem
}

.space-unit-em {
	--space-unit: 1em
}

.space-unit-px {
	--space-unit: 16px
}

.margin-xxxxs {
	margin: var(--space-xxxxs)
}

.margin-xxxs {
	margin: var(--space-xxxs)
}

.margin-xxs {
	margin: var(--space-xxs)
}

.margin-xs {
	margin: var(--space-xs)
}

.margin-sm {
	margin: var(--space-sm)
}

.margin-md {
	margin: var(--space-md)
}

.margin-lg {
	margin: var(--space-lg)
}

.margin-xl {
	margin: var(--space-xl)
}

.margin-xxl {
	margin: var(--space-xxl)
}

.margin-xxxl {
	margin: var(--space-xxxl)
}

.margin-xxxxl {
	margin: var(--space-xxxxl)
}

.margin-auto {
	margin: auto
}

.margin-0 {
	margin: 0
}

.margin-top-xxxxs {
	margin-top: var(--space-xxxxs)
}

.margin-top-xxxs {
	margin-top: var(--space-xxxs)
}

.margin-top-xxs {
	margin-top: var(--space-xxs)
}

.margin-top-xs {
	margin-top: var(--space-xs)
}

.margin-top-sm {
	margin-top: var(--space-sm)
}

.margin-top-md {
	margin-top: var(--space-md)
}

.margin-top-lg {
	margin-top: var(--space-lg)
}

.margin-top-xl {
	margin-top: var(--space-xl)
}

.margin-top-xxl {
	margin-top: var(--space-xxl)
}

.margin-top-xxxl {
	margin-top: var(--space-xxxl)
}

.margin-top-xxxxl {
	margin-top: var(--space-xxxxl)
}

.margin-top-auto {
	margin-top: auto
}

.margin-top-0 {
	margin-top: 0
}

.margin-bottom-xxxxs {
	margin-bottom: var(--space-xxxxs)
}

.margin-bottom-xxxs {
	margin-bottom: var(--space-xxxs)
}

.margin-bottom-xxs {
	margin-bottom: var(--space-xxs)
}

.margin-bottom-xs {
	margin-bottom: var(--space-xs)
}

.margin-bottom-sm {
	margin-bottom: var(--space-sm)
}

.margin-bottom-md {
	margin-bottom: var(--space-md)
}

.margin-bottom-lg {
	margin-bottom: var(--space-lg)
}

.margin-bottom-xl {
	margin-bottom: var(--space-xl)
}

.margin-bottom-xxl {
	margin-bottom: var(--space-xxl)
}

.margin-bottom-xxxl {
	margin-bottom: var(--space-xxxl)
}

.margin-bottom-xxxxl {
	margin-bottom: var(--space-xxxxl)
}

.margin-bottom-auto {
	margin-bottom: auto
}

.margin-bottom-0 {
	margin-bottom: 0
}

.margin-right-xxxxs {
	margin-right: var(--space-xxxxs)
}

.margin-right-xxxs {
	margin-right: var(--space-xxxs)
}

.margin-right-xxs {
	margin-right: var(--space-xxs)
}

.margin-right-xs {
	margin-right: var(--space-xs)
}

.margin-right-sm {
	margin-right: var(--space-sm)
}

.margin-right-md {
	margin-right: var(--space-md)
}

.margin-right-lg {
	margin-right: var(--space-lg)
}

.margin-right-xl {
	margin-right: var(--space-xl)
}

.margin-right-xxl {
	margin-right: var(--space-xxl)
}

.margin-right-xxxl {
	margin-right: var(--space-xxxl)
}

.margin-right-xxxxl {
	margin-right: var(--space-xxxxl)
}

.margin-right-auto {
	margin-right: auto
}

.margin-right-0 {
	margin-right: 0
}

.margin-left-xxxxs {
	margin-left: var(--space-xxxxs)
}

.margin-left-xxxs {
	margin-left: var(--space-xxxs)
}

.margin-left-xxs {
	margin-left: var(--space-xxs)
}

.margin-left-xs {
	margin-left: var(--space-xs)
}

.margin-left-sm {
	margin-left: var(--space-sm)
}

.margin-left-md {
	margin-left: var(--space-md)
}

.margin-left-lg {
	margin-left: var(--space-lg)
}

.margin-left-xl {
	margin-left: var(--space-xl)
}

.margin-left-xxl {
	margin-left: var(--space-xxl)
}

.margin-left-xxxl {
	margin-left: var(--space-xxxl)
}

.margin-left-xxxxl {
	margin-left: var(--space-xxxxl)
}

.margin-left-auto {
	margin-left: auto
}

.margin-left-0 {
	margin-left: 0
}

.margin-x-xxxxs {
	margin-left: var(--space-xxxxs);
	margin-right: var(--space-xxxxs)
}

.margin-x-xxxs {
	margin-left: var(--space-xxxs);
	margin-right: var(--space-xxxs)
}

.margin-x-xxs {
	margin-left: var(--space-xxs);
	margin-right: var(--space-xxs)
}

.margin-x-xs {
	margin-left: var(--space-xs);
	margin-right: var(--space-xs)
}

.margin-x-sm {
	margin-left: var(--space-sm);
	margin-right: var(--space-sm)
}

.margin-x-md {
	margin-left: var(--space-md);
	margin-right: var(--space-md)
}

.margin-x-lg {
	margin-left: var(--space-lg);
	margin-right: var(--space-lg)
}

.margin-x-xl {
	margin-left: var(--space-xl);
	margin-right: var(--space-xl)
}

.margin-x-xxl {
	margin-left: var(--space-xxl);
	margin-right: var(--space-xxl)
}

.margin-x-xxxl {
	margin-left: var(--space-xxxl);
	margin-right: var(--space-xxxl)
}

.margin-x-xxxxl {
	margin-left: var(--space-xxxxl);
	margin-right: var(--space-xxxxl)
}

.margin-x-auto {
	margin-left: auto;
	margin-right: auto
}

.margin-x-0 {
	margin-left: 0;
	margin-right: 0
}

.margin-y-xxxxs {
	margin-top: var(--space-xxxxs);
	margin-bottom: var(--space-xxxxs)
}

.margin-y-xxxs {
	margin-top: var(--space-xxxs);
	margin-bottom: var(--space-xxxs)
}

.margin-y-xxs {
	margin-top: var(--space-xxs);
	margin-bottom: var(--space-xxs)
}

.margin-y-xs {
	margin-top: var(--space-xs);
	margin-bottom: var(--space-xs)
}

.margin-y-sm {
	margin-top: var(--space-sm);
	margin-bottom: var(--space-sm)
}

.margin-y-md {
	margin-top: var(--space-md);
	margin-bottom: var(--space-md)
}

.margin-y-lg {
	margin-top: var(--space-lg);
	margin-bottom: var(--space-lg)
}

.margin-y-xl {
	margin-top: var(--space-xl);
	margin-bottom: var(--space-xl)
}

.margin-y-xxl {
	margin-top: var(--space-xxl);
	margin-bottom: var(--space-xxl)
}

.margin-y-xxxl {
	margin-top: var(--space-xxxl);
	margin-bottom: var(--space-xxxl)
}

.margin-y-xxxxl {
	margin-top: var(--space-xxxxl);
	margin-bottom: var(--space-xxxxl)
}

.margin-y-auto {
	margin-top: auto;
	margin-bottom: auto
}

.margin-y-0 {
	margin-top: 0;
	margin-bottom: 0
}

.padding-xxxxs {
	padding: var(--space-xxxxs)
}

.padding-xxxs {
	padding: var(--space-xxxs)
}

.padding-xxs {
	padding: var(--space-xxs)
}

.padding-xs {
	padding: var(--space-xs)
}

.padding-sm {
	padding: var(--space-sm)
}

.padding-md {
	padding: var(--space-md)
}

.padding-lg {
	padding: var(--space-lg)
}

.padding-xl {
	padding: var(--space-xl)
}

.padding-xxl {
	padding: var(--space-xxl)
}

.padding-xxxl {
	padding: var(--space-xxxl)
}

.padding-xxxxl {
	padding: var(--space-xxxxl)
}

.padding-0 {
	padding: 0
}

.padding-component {
	padding: var(--component-padding)
}

.padding-top-xxxxs {
	padding-top: var(--space-xxxxs)
}

.padding-top-xxxs {
	padding-top: var(--space-xxxs)
}

.padding-top-xxs {
	padding-top: var(--space-xxs)
}

.padding-top-xs {
	padding-top: var(--space-xs)
}

.padding-top-sm {
	padding-top: var(--space-sm)
}

.padding-top-md {
	padding-top: var(--space-md)
}

.padding-top-lg {
	padding-top: var(--space-lg)
}

.padding-top-xl {
	padding-top: var(--space-xl)
}

.padding-top-xxl {
	padding-top: var(--space-xxl)
}

.padding-top-xxxl {
	padding-top: var(--space-xxxl)
}

.padding-top-xxxxl {
	padding-top: var(--space-xxxxl)
}

.padding-top-0 {
	padding-top: 0
}

.padding-top-component {
	padding-top: var(--component-padding)
}

.padding-bottom-xxxxs {
	padding-bottom: var(--space-xxxxs)
}

.padding-bottom-xxxs {
	padding-bottom: var(--space-xxxs)
}

.padding-bottom-xxs {
	padding-bottom: var(--space-xxs)
}

.padding-bottom-xs {
	padding-bottom: var(--space-xs)
}

.padding-bottom-sm {
	padding-bottom: var(--space-sm)
}

.padding-bottom-md {
	padding-bottom: var(--space-md)
}

.padding-bottom-lg {
	padding-bottom: var(--space-lg)
}

.padding-bottom-xl {
	padding-bottom: var(--space-xl)
}

.padding-bottom-xxl {
	padding-bottom: var(--space-xxl)
}

.padding-bottom-xxxl {
	padding-bottom: var(--space-xxxl)
}

.padding-bottom-xxxxl {
	padding-bottom: var(--space-xxxxl)
}

.padding-bottom-0 {
	padding-bottom: 0
}

.padding-bottom-component {
	padding-bottom: var(--component-padding)
}

.padding-right-xxxxs {
	padding-right: var(--space-xxxxs)
}

.padding-right-xxxs {
	padding-right: var(--space-xxxs)
}

.padding-right-xxs {
	padding-right: var(--space-xxs)
}

.padding-right-xs {
	padding-right: var(--space-xs)
}

.padding-right-sm {
	padding-right: var(--space-sm)
}

.padding-right-md {
	padding-right: var(--space-md)
}

.padding-right-lg {
	padding-right: var(--space-lg)
}

.padding-right-xl {
	padding-right: var(--space-xl)
}

.padding-right-xxl {
	padding-right: var(--space-xxl)
}

.padding-right-xxxl {
	padding-right: var(--space-xxxl)
}

.padding-right-xxxxl {
	padding-right: var(--space-xxxxl)
}

.padding-right-0 {
	padding-right: 0
}

.padding-right-component {
	padding-right: var(--component-padding)
}

.padding-left-xxxxs {
	padding-left: var(--space-xxxxs)
}

.padding-left-xxxs {
	padding-left: var(--space-xxxs)
}

.padding-left-xxs {
	padding-left: var(--space-xxs)
}

.padding-left-xs {
	padding-left: var(--space-xs)
}

.padding-left-sm {
	padding-left: var(--space-sm)
}

.padding-left-md {
	padding-left: var(--space-md)
}

.padding-left-lg {
	padding-left: var(--space-lg)
}

.padding-left-xl {
	padding-left: var(--space-xl)
}

.padding-left-xxl {
	padding-left: var(--space-xxl)
}

.padding-left-xxxl {
	padding-left: var(--space-xxxl)
}

.padding-left-xxxxl {
	padding-left: var(--space-xxxxl)
}

.padding-left-0 {
	padding-left: 0
}

.padding-left-component {
	padding-left: var(--component-padding)
}

.padding-x-xxxxs {
	padding-left: var(--space-xxxxs);
	padding-right: var(--space-xxxxs)
}

.padding-x-xxxs {
	padding-left: var(--space-xxxs);
	padding-right: var(--space-xxxs)
}

.padding-x-xxs {
	padding-left: var(--space-xxs);
	padding-right: var(--space-xxs)
}

.padding-x-xs {
	padding-left: var(--space-xs);
	padding-right: var(--space-xs)
}

.padding-x-sm {
	padding-left: var(--space-sm);
	padding-right: var(--space-sm)
}

.padding-x-md {
	padding-left: var(--space-md);
	padding-right: var(--space-md)
}

.padding-x-lg {
	padding-left: var(--space-lg);
	padding-right: var(--space-lg)
}

.padding-x-xl {
	padding-left: var(--space-xl);
	padding-right: var(--space-xl)
}

.padding-x-xxl {
	padding-left: var(--space-xxl);
	padding-right: var(--space-xxl)
}

.padding-x-xxxl {
	padding-left: var(--space-xxxl);
	padding-right: var(--space-xxxl)
}

.padding-x-xxxxl {
	padding-left: var(--space-xxxxl);
	padding-right: var(--space-xxxxl)
}

.padding-x-0 {
	padding-left: 0;
	padding-right: 0
}

.padding-x-component {
	padding-left: var(--component-padding);
	padding-right: var(--component-padding)
}

.padding-y-xxxxs {
	padding-top: var(--space-xxxxs);
	padding-bottom: var(--space-xxxxs)
}

.padding-y-xxxs {
	padding-top: var(--space-xxxs);
	padding-bottom: var(--space-xxxs)
}

.padding-y-xxs {
	padding-top: var(--space-xxs);
	padding-bottom: var(--space-xxs)
}

.padding-y-xs {
	padding-top: var(--space-xs);
	padding-bottom: var(--space-xs)
}

.padding-y-sm {
	padding-top: var(--space-sm);
	padding-bottom: var(--space-sm)
}

.padding-y-md {
	padding-top: var(--space-md);
	padding-bottom: var(--space-md)
}

.padding-y-lg {
	padding-top: var(--space-lg);
	padding-bottom: var(--space-lg)
}

.padding-y-xl {
	padding-top: var(--space-xl);
	padding-bottom: var(--space-xl)
}

.padding-y-xxl {
	padding-top: var(--space-xxl);
	padding-bottom: var(--space-xxl)
}

.padding-y-xxxl {
	padding-top: var(--space-xxxl);
	padding-bottom: var(--space-xxxl)
}

.padding-y-xxxxl {
	padding-top: var(--space-xxxxl);
	padding-bottom: var(--space-xxxxl)
}

.padding-y-0 {
	padding-top: 0;
	padding-bottom: 0
}

.padding-y-component {
	padding-top: var(--component-padding);
	padding-bottom: var(--component-padding)
}

.align-baseline {
	vertical-align: baseline
}

.align-sub {
	vertical-align: sub
}

.align-super {
	vertical-align: super
}

.align-text-top {
	vertical-align: text-top
}

.align-text-bottom {
	vertical-align: text-bottom
}

.align-top {
	vertical-align: top
}

.align-middle {
	vertical-align: middle
}

.align-bottom {
	vertical-align: bottom
}

.text-truncate,.truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.text-replace {
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap
}

.break-word {
	overflow-wrap: break-word;
	min-width: 0
}

.text-unit-em,.text-unit-px,.text-unit-rem {
	font-size: var(--text-unit)
}

.text-unit-rem {
	--text-unit: 1rem
}

.text-unit-em {
	--text-unit: 1em
}

.text-unit-px {
	--text-unit: 16px
}

.text-xs {
	font-size: var(--text-xs,.6875rem)
}

.text-sm {
	font-size: var(--text-sm,.75rem)
}

.text-base {
	font-size: var(--text-unit,1rem)
}

.text-md {
	font-size: var(--text-md,1.125rem)
}

.text-lg {
	font-size: var(--text-lg,1.375rem)
}

.text-xl {
	font-size: var(--text-xl,1.75rem)
}

.text-xxl {
	font-size: var(--text-xxl,2rem)
}

.text-xxxl {
	font-size: var(--text-xxxl,2.5rem)
}

.text-xxxxl {
	font-size: var(--text-xxxxl,3rem)
}

.text-uppercase {
	text-transform: uppercase
}

.text-capitalize {
	text-transform: capitalize
}

.letter-spacing-xs {
	letter-spacing: -.1em
}

.letter-spacing-sm {
	letter-spacing: -.05em
}

.letter-spacing-md {
	letter-spacing: .05em
}

.letter-spacing-lg {
	letter-spacing: .1em
}

.letter-spacing-xl {
	letter-spacing: .2em
}

.font-thin {
	font-weight: 100
}

.font-extralight {
	font-weight: 200
}

.font-light {
	font-weight: 300
}

.font-normal {
	font-weight: 400
}

.font-medium {
	font-weight: 500
}

.font-semibold {
	font-weight: 600
}

.font-bold,.text-bold {
	font-weight: 700
}

.font-extrabold {
	font-weight: 800
}

.font-black {
	font-weight: 900
}

.font-italic {
	font-style: italic
}

.font-smooth {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.font-primary {
	font-family: var(--font-primary)
}

.text-center {
	text-align: center
}

.text-left {
	text-align: left
}

.text-right {
	text-align: right
}

.text-justify {
	text-align: justify
}

.text-line-through {
	text-decoration: line-through
}

.text-underline {
	text-decoration: underline
}

.text-decoration-none {
	text-decoration: none
}

.text-shadow-xs {
	text-shadow: 0 1px 1px rgba(0,0,0,.15)
}

.text-shadow-sm {
	text-shadow: 0 1px 2px rgba(0,0,0,.25)
}

.text-shadow-md {
	text-shadow: 0 1px 2px rgba(0,0,0,.1),0 2px 4px rgba(0,0,0,.2)
}

.text-shadow-lg {
	text-shadow: 0 1px 4px rgba(0,0,0,.1),0 2px 8px rgba(0,0,0,.15),0 4px 16px rgba(0,0,0,.2)
}

.text-shadow-xl {
	text-shadow: 0 1px 4px rgba(0,0,0,.1),0 2px 8px rgba(0,0,0,.15),0 4px 16px rgba(0,0,0,.2),0 6px 24px rgba(0,0,0,.25)
}

.text-shadow-none {
	text-shadow: none
}

.text-space-y-xxs {
	--text-space-y-multiplier: 0.25!important
}

.text-space-y-xs {
	--text-space-y-multiplier: 0.5!important
}

.text-space-y-sm {
	--text-space-y-multiplier: 0.75!important
}

.text-space-y-md {
	--text-space-y-multiplier: 1.25!important
}

.text-space-y-lg {
	--text-space-y-multiplier: 1.5!important
}

.text-space-y-xl {
	--text-space-y-multiplier: 1.75!important
}

.text-space-y-xxl {
	--text-space-y-multiplier: 2!important
}

.line-height-xs {
	--heading-line-height: 1;
	--body-line-height: 1.1
}

.line-height-xs:not(.text-component) {
	line-height: 1.1
}

.line-height-sm {
	--heading-line-height: 1.1;
	--body-line-height: 1.2
}

.line-height-sm:not(.text-component) {
	line-height: 1.2
}

.line-height-md {
	--heading-line-height: 1.15;
	--body-line-height: 1.4
}

.line-height-md:not(.text-component) {
	line-height: 1.4
}

.line-height-lg {
	--heading-line-height: 1.22;
	--body-line-height: 1.58
}

.line-height-lg:not(.text-component) {
	line-height: 1.58
}

.line-height-xl {
	--heading-line-height: 1.3;
	--body-line-height: 1.72
}

.line-height-xl:not(.text-component) {
	line-height: 1.72
}

.line-height-body {
	line-height: var(--body-line-height)
}

.line-height-heading {
	line-height: var(--heading-line-height)
}

.line-height-normal {
	line-height: normal!important
}

.line-height-1 {
	line-height: 1!important
}

.column-count-1 {
	-moz-column-count: 1;
	column-count: 1
}

.column-count-2 {
	-moz-column-count: 2;
	column-count: 2
}

.column-count-3 {
	-moz-column-count: 3;
	column-count: 3
}

.column-count-4 {
	-moz-column-count: 4;
	column-count: 4
}

.text-nowrap,.ws-nowrap {
	white-space: nowrap
}

.cursor-pointer {
	cursor: pointer
}

.cursor-default {
	cursor: default
}

.pointer-events-auto {
	pointer-events: auto
}

.pointer-events-none {
	pointer-events: none
}

.user-select-none {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none
}

.user-select-all {
	-webkit-user-select: all;
	-moz-user-select: all;
	user-select: all
}

[class*=" color-"],[class^=color-] {
	--color-o: 1
}

.color-inherit {
	color: inherit
}

.color-bg-darker {
	color: hsla(var(--color-bg-darker-h),var(--color-bg-darker-s),var(--color-bg-darker-l),var(--color-o,1))
}

.color-bg-dark {
	color: hsla(var(--color-bg-dark-h),var(--color-bg-dark-s),var(--color-bg-dark-l),var(--color-o,1))
}

.color-bg {
	color: hsla(var(--color-bg-h),var(--color-bg-s),var(--color-bg-l),var(--color-o,1))
}

.color-bg-light {
	color: hsla(var(--color-bg-light-h),var(--color-bg-light-s),var(--color-bg-light-l),var(--color-o,1))
}

.color-bg-lighter {
	color: hsla(var(--color-bg-lighter-h),var(--color-bg-lighter-s),var(--color-bg-lighter-l),var(--color-o,1))
}

.color-contrast-lower {
	color: hsla(var(--color-contrast-lower-h),var(--color-contrast-lower-s),var(--color-contrast-lower-l),var(--color-o,1))
}

.color-contrast-low {
	color: hsla(var(--color-contrast-low-h),var(--color-contrast-low-s),var(--color-contrast-low-l),var(--color-o,1))
}

.color-contrast-medium {
	color: hsla(var(--color-contrast-medium-h),var(--color-contrast-medium-s),var(--color-contrast-medium-l),var(--color-o,1))
}

.color-contrast-high {
	color: hsla(var(--color-contrast-high-h),var(--color-contrast-high-s),var(--color-contrast-high-l),var(--color-o,1))
}

.color-contrast-higher {
	color: hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--color-o,1))
}

.color-primary-darker {
	color: hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),var(--color-o,1))
}

.color-primary-dark {
	color: hsla(var(--color-primary-dark-h),var(--color-primary-dark-s),var(--color-primary-dark-l),var(--color-o,1))
}

.color-primary {
	color: hsla(var(--color-primary-h),var(--color-primary-s),var(--color-primary-l),var(--color-o,1))
}

.color-primary-light {
	color: hsla(var(--color-primary-light-h),var(--color-primary-light-s),var(--color-primary-light-l),var(--color-o,1))
}

.color-primary-lighter {
	color: hsla(var(--color-primary-lighter-h),var(--color-primary-lighter-s),var(--color-primary-lighter-l),var(--color-o,1))
}

.color-accent-darker {
	color: hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),var(--color-o,1))
}

.color-accent-dark {
	color: hsla(var(--color-accent-dark-h),var(--color-accent-dark-s),var(--color-accent-dark-l),var(--color-o,1))
}

.color-accent {
	color: hsla(var(--color-accent-h),var(--color-accent-s),var(--color-accent-l),var(--color-o,1))
}

.color-accent-light {
	color: hsla(var(--color-accent-light-h),var(--color-accent-light-s),var(--color-accent-light-l),var(--color-o,1))
}

.color-accent-lighter {
	color: hsla(var(--color-accent-lighter-h),var(--color-accent-lighter-s),var(--color-accent-lighter-l),var(--color-o,1))
}

.color-success-darker {
	color: hsla(var(--color-success-darker-h),var(--color-success-darker-s),var(--color-success-darker-l),var(--color-o,1))
}

.color-success-dark {
	color: hsla(var(--color-success-dark-h),var(--color-success-dark-s),var(--color-success-dark-l),var(--color-o,1))
}

.color-success {
	color: hsla(var(--color-success-h),var(--color-success-s),var(--color-success-l),var(--color-o,1))
}

.color-success-light {
	color: hsla(var(--color-success-light-h),var(--color-success-light-s),var(--color-success-light-l),var(--color-o,1))
}

.color-success-lighter {
	color: hsla(var(--color-success-lighter-h),var(--color-success-lighter-s),var(--color-success-lighter-l),var(--color-o,1))
}

.color-warning-darker {
	color: hsla(var(--color-warning-darker-h),var(--color-warning-darker-s),var(--color-warning-darker-l),var(--color-o,1))
}

.color-warning-dark {
	color: hsla(var(--color-warning-dark-h),var(--color-warning-dark-s),var(--color-warning-dark-l),var(--color-o,1))
}

.color-warning {
	color: hsla(var(--color-warning-h),var(--color-warning-s),var(--color-warning-l),var(--color-o,1))
}

.color-warning-light {
	color: hsla(var(--color-warning-light-h),var(--color-warning-light-s),var(--color-warning-light-l),var(--color-o,1))
}

.color-warning-lighter {
	color: hsla(var(--color-warning-lighter-h),var(--color-warning-lighter-s),var(--color-warning-lighter-l),var(--color-o,1))
}

.color-error-darker {
	color: hsla(var(--color-error-darker-h),var(--color-error-darker-s),var(--color-error-darker-l),var(--color-o,1))
}

.color-error-dark {
	color: hsla(var(--color-error-dark-h),var(--color-error-dark-s),var(--color-error-dark-l),var(--color-o,1))
}

.color-error {
	color: hsla(var(--color-error-h),var(--color-error-s),var(--color-error-l),var(--color-o,1))
}

.color-error-light {
	color: hsla(var(--color-error-light-h),var(--color-error-light-s),var(--color-error-light-l),var(--color-o,1))
}

.color-error-lighter {
	color: hsla(var(--color-error-lighter-h),var(--color-error-lighter-s),var(--color-error-lighter-l),var(--color-o,1))
}

.color-white {
	color: hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),var(--color-o,1))
}

.color-black {
	color: hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),var(--color-o,1))
}

.color-opacity-0 {
	--color-o: 0
}

.color-opacity-5\% {
	--color-o: 0.05
}

.color-opacity-10\% {
	--color-o: 0.1
}

.color-opacity-15\% {
	--color-o: 0.15
}

.color-opacity-20\% {
	--color-o: 0.2
}

.color-opacity-25\% {
	--color-o: 0.25
}

.color-opacity-30\% {
	--color-o: 0.3
}

.color-opacity-40\% {
	--color-o: 0.4
}

.color-opacity-50\% {
	--color-o: 0.5
}

.color-opacity-60\% {
	--color-o: 0.6
}

.color-opacity-70\% {
	--color-o: 0.7
}

.color-opacity-75\% {
	--color-o: 0.75
}

.color-opacity-80\% {
	--color-o: 0.8
}

.color-opacity-85\% {
	--color-o: 0.85
}

.color-opacity-90\% {
	--color-o: 0.9
}

.color-opacity-95\% {
	--color-o: 0.95
}

[class*=" color-gradient"],[class^=color-gradient] {
	color: transparent!important;
	-webkit-background-clip: text;
	background-clip: text
}

.width-xxxxs {
	width: var(--size-xxxxs,.25rem)
}

.width-xxxs {
	width: var(--size-xxxs,.5rem)
}

.width-xxs {
	width: var(--size-xxs,.75rem)
}

.width-xs {
	width: var(--size-xs,1rem)
}

.width-sm {
	width: var(--size-sm,1.5rem)
}

.width-md {
	width: var(--size-md,2rem)
}

.width-lg {
	width: var(--size-lg,3rem)
}

.width-xl {
	width: var(--size-xl,4rem)
}

.width-xxl {
	width: var(--size-xxl,6rem)
}

.width-xxxl {
	width: var(--size-xxxl,8rem)
}

.width-xxxxl {
	width: var(--size-xxxxl,16rem)
}

.width-0 {
	width: 0
}

.width-10\% {
	width: 10%
}

.width-20\% {
	width: 20%
}

.width-25\% {
	width: 25%
}

.width-30\% {
	width: 30%
}

.width-33\% {
	width: 33.3333333333%
}

.width-40\% {
	width: 40%
}

.width-50\% {
	width: 50%
}

.width-60\% {
	width: 60%
}

.width-66\% {
	width: 66.6666666667%
}

.width-70\% {
	width: 70%
}

.width-75\% {
	width: 75%
}

.width-80\% {
	width: 80%
}

.width-90\% {
	width: 90%
}

.width-100\% {
	width: 100%
}

.width-100vw {
	width: 100vw
}

.width-auto {
	width: auto
}

.width-inherit {
	width: inherit
}

.height-xxxxs {
	height: var(--size-xxxxs,.25rem)
}

.height-xxxs {
	height: var(--size-xxxs,.5rem)
}

.height-xxs {
	height: var(--size-xxs,.75rem)
}

.height-xs {
	height: var(--size-xs,1rem)
}

.height-sm {
	height: var(--size-sm,1.5rem)
}

.height-md {
	height: var(--size-md,2rem)
}

.height-lg {
	height: var(--size-lg,3rem)
}

.height-xl {
	height: var(--size-xl,4rem)
}

.height-xxl {
	height: var(--size-xxl,6rem)
}

.height-xxxl {
	height: var(--size-xxxl,8rem)
}

.height-xxxxl {
	height: var(--size-xxxxl,16rem)
}

.height-0 {
	height: 0
}

.height-10\% {
	height: 10%
}

.height-20\% {
	height: 20%
}

.height-25\% {
	height: 25%
}

.height-30\% {
	height: 30%
}

.height-33\% {
	height: 33.3333333333%
}

.height-40\% {
	height: 40%
}

.height-50\% {
	height: 50%
}

.height-60\% {
	height: 60%
}

.height-66\% {
	height: 66.6666666667%
}

.height-70\% {
	height: 70%
}

.height-75\% {
	height: 75%
}

.height-80\% {
	height: 80%
}

.height-90\% {
	height: 90%
}

.height-100\% {
	height: 100%
}

.height-100vh {
	height: 100vh
}

.height-auto {
	height: auto
}

.height-inherit {
	height: inherit
}

.min-width-0 {
	min-width: 0
}

.min-width-25\% {
	min-width: 25%
}

.min-width-33\% {
	min-width: 33.3333333333%
}

.min-width-50\% {
	min-width: 50%
}

.min-width-66\% {
	min-width: 66.6666666667%
}

.min-width-75\% {
	min-width: 75%
}

.min-width-100\% {
	min-width: 100%
}

.min-width-100vw {
	min-width: 100vw
}

.min-height-0 {
	min-height: 0
}

.min-height-100\% {
	min-height: 100%
}

.min-height-100vh {
	min-height: 100vh
}

:root {
	--max-width-xxxxxs: 17.5rem;
	--max-width-xxxxs: 20rem;
	--max-width-xxxs: 26rem;
	--max-width-xxs: 32rem;
	--max-width-xs: 38rem;
	--max-width-sm: 48rem;
	--max-width-md: 64rem;
	--max-width-lg: 80rem;
	--max-width-xl: 90rem;
	--max-width-xxl: 100rem;
	--max-width-xxxl: 120rem;
	--max-width-xxxxl: 150rem
}

.max-width-xxxxxs {
	max-width: var(--max-width-xxxxxs)
}

.max-width-xxxxs {
	max-width: var(--max-width-xxxxs)
}

.max-width-xxxs {
	max-width: var(--max-width-xxxs)
}

.max-width-xxs {
	max-width: var(--max-width-xxs)
}

.max-width-xs {
	max-width: var(--max-width-xs)
}

.max-width-sm {
	max-width: var(--max-width-sm)
}

.max-width-md {
	max-width: var(--max-width-md)
}

.max-width-lg {
	max-width: var(--max-width-lg)
}

.max-width-xl {
	max-width: var(--max-width-xl)
}

.max-width-xxl {
	max-width: var(--max-width-xxl)
}

.max-width-xxxl {
	max-width: var(--max-width-xxxl)
}

.max-width-xxxxl {
	max-width: var(--max-width-xxxxl)
}

.max-width-100\% {
	max-width: 100%
}

.max-width-none {
	max-width: none
}

[class*=" max-width-adaptive"],[class^=max-width-adaptive] {
	max-width: 32rem
}

@media (min-width: 48rem) {
	.max-width-adaptive,.max-width-adaptive-lg,.max-width-adaptive-md,.max-width-adaptive-sm,.max-width-adaptive-xl {
		max-width:48rem
	}
}

@media (min-width: 64rem) {
	.max-width-adaptive,.max-width-adaptive-lg,.max-width-adaptive-md,.max-width-adaptive-xl {
		max-width:64rem
	}
}

@media (min-width: 80rem) {
	.max-width-adaptive,.max-width-adaptive-lg,.max-width-adaptive-xl {
		max-width:80rem
	}
}

@media (min-width: 90rem) {
	.max-width-adaptive-xl {
		max-width:90rem
	}
}

.max-height-100\% {
	max-height: 100%
}

.max-height-100vh {
	max-height: 100vh
}

.shadow-ring {
	box-shadow: var(--shadow-ring)
}

.shadow-xs {
	box-shadow: var(--shadow-xs)
}

.shadow-xs.shadow-ring {
	box-shadow: var(--shadow-xs),var(--shadow-ring)
}

.shadow-sm {
	box-shadow: var(--shadow-sm)
}

.shadow-sm.shadow-ring {
	box-shadow: var(--shadow-sm),var(--shadow-ring)
}

.shadow-md {
	box-shadow: var(--shadow-md)
}

.shadow-md.shadow-ring {
	box-shadow: var(--shadow-md),var(--shadow-ring)
}

.shadow-lg {
	box-shadow: var(--shadow-lg)
}

.shadow-lg.shadow-ring {
	box-shadow: var(--shadow-lg),var(--shadow-ring)
}

.shadow-xl {
	box-shadow: var(--shadow-xl)
}

.shadow-xl.shadow-ring {
	box-shadow: var(--shadow-xl),var(--shadow-ring)
}

.shadow-none {
	box-shadow: none
}

:where(.inner-glow,.inner-glow-top) {
	position: relative
}

:where(.inner-glow,.inner-glow-top)::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	pointer-events: none
}

.inner-glow::after {
	box-shadow: var(--inner-glow)
}

.inner-glow-top::after {
	box-shadow: var(--inner-glow-top)
}

.position-relative {
	position: relative
}

.position-absolute {
	position: absolute
}

.position-fixed {
	position: fixed
}

.position-sticky {
	position: -webkit-sticky;
	position: sticky
}

.inset-0 {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0
}

.top-0 {
	top: 0
}

.top-50\% {
	top: 50%
}

.top-xxxxs {
	top: var(--space-xxxxs)
}

.top-xxxs {
	top: var(--space-xxxs)
}

.top-xxs {
	top: var(--space-xxs)
}

.top-xs {
	top: var(--space-xs)
}

.top-sm {
	top: var(--space-sm)
}

.top-md {
	top: var(--space-md)
}

.top-lg {
	top: var(--space-lg)
}

.top-xl {
	top: var(--space-xl)
}

.top-xxl {
	top: var(--space-xxl)
}

.top-xxxl {
	top: var(--space-xxxl)
}

.top-xxxxl {
	top: var(--space-xxxxl)
}

.bottom-0 {
	bottom: 0
}

.bottom-50\% {
	bottom: 50%
}

.bottom-xxxxs {
	bottom: var(--space-xxxxs)
}

.bottom-xxxs {
	bottom: var(--space-xxxs)
}

.bottom-xxs {
	bottom: var(--space-xxs)
}

.bottom-xs {
	bottom: var(--space-xs)
}

.bottom-sm {
	bottom: var(--space-sm)
}

.bottom-md {
	bottom: var(--space-md)
}

.bottom-lg {
	bottom: var(--space-lg)
}

.bottom-xl {
	bottom: var(--space-xl)
}

.bottom-xxl {
	bottom: var(--space-xxl)
}

.bottom-xxxl {
	bottom: var(--space-xxxl)
}

.bottom-xxxxl {
	bottom: var(--space-xxxxl)
}

.right-0 {
	right: 0
}

.right-50\% {
	right: 50%
}

.right-xxxxs {
	right: var(--space-xxxxs)
}

.right-xxxs {
	right: var(--space-xxxs)
}

.right-xxs {
	right: var(--space-xxs)
}

.right-xs {
	right: var(--space-xs)
}

.right-sm {
	right: var(--space-sm)
}

.right-md {
	right: var(--space-md)
}

.right-lg {
	right: var(--space-lg)
}

.right-xl {
	right: var(--space-xl)
}

.right-xxl {
	right: var(--space-xxl)
}

.right-xxxl {
	right: var(--space-xxxl)
}

.right-xxxxl {
	right: var(--space-xxxxl)
}

.left-0 {
	left: 0
}

.left-50\% {
	left: 50%
}

.left-xxxxs {
	left: var(--space-xxxxs)
}

.left-xxxs {
	left: var(--space-xxxs)
}

.left-xxs {
	left: var(--space-xxs)
}

.left-xs {
	left: var(--space-xs)
}

.left-sm {
	left: var(--space-sm)
}

.left-md {
	left: var(--space-md)
}

.left-lg {
	left: var(--space-lg)
}

.left-xl {
	left: var(--space-xl)
}

.left-xxl {
	left: var(--space-xxl)
}

.left-xxxl {
	left: var(--space-xxxl)
}

.left-xxxxl {
	left: var(--space-xxxxl)
}

.z-index-header {
	z-index: var(--z-index-header)
}

.z-index-popover {
	z-index: var(--z-index-popover)
}

.z-index-fixed-element {
	z-index: var(--z-index-fixed-element)
}

.z-index-overlay {
	z-index: var(--z-index-overlay)
}

.z-index-1 {
	z-index: 1
}

.z-index-2 {
	z-index: 2
}

.z-index-3 {
	z-index: 3
}

.overflow-visible {
	overflow: visible
}

.overflow-hidden {
	overflow: hidden
}

.overflow-x-hidden {
	overflow-x: hidden
}

.overflow-y-hidden {
	overflow-y: hidden
}

.overflow-clip {
	overflow: clip
}

.overflow-x-clip {
	overflow-x: clip
}

.overflow-y-clip {
	overflow-y: clip
}

.overflow-auto {
	overflow: auto
}

.momentum-scrolling {
	-webkit-overflow-scrolling: touch
}

.overscroll-contain {
	overscroll-behavior: contain
}

.scroll-smooth {
	scroll-behavior: smooth
}

.scroll-padding-xxxxs {
	scroll-padding: var(--space-xxxxs)
}

.scroll-padding-xxxs {
	scroll-padding: var(--space-xxxs)
}

.scroll-padding-xxs {
	scroll-padding: var(--space-xxs)
}

.scroll-padding-xs {
	scroll-padding: var(--space-xs)
}

.scroll-padding-sm {
	scroll-padding: var(--space-sm)
}

.scroll-padding-md {
	scroll-padding: var(--space-md)
}

.scroll-padding-lg {
	scroll-padding: var(--space-lg)
}

.scroll-padding-xl {
	scroll-padding: var(--space-xl)
}

.scroll-padding-xxl {
	scroll-padding: var(--space-xxl)
}

.scroll-padding-xxxl {
	scroll-padding: var(--space-xxxl)
}

.scroll-padding-xxxxl {
	scroll-padding: var(--space-xxxxl)
}

.opacity-0 {
	opacity: 0
}

.opacity-5\% {
	opacity: .05
}

.opacity-10\% {
	opacity: .1
}

.opacity-15\% {
	opacity: .15
}

.opacity-20\% {
	opacity: .2
}

.opacity-25\% {
	opacity: .25
}

.opacity-30\% {
	opacity: .3
}

.opacity-40\% {
	opacity: .4
}

.opacity-50\% {
	opacity: .5
}

.opacity-60\% {
	opacity: .6
}

.opacity-70\% {
	opacity: .7
}

.opacity-75\% {
	opacity: .75
}

.opacity-80\% {
	opacity: .8
}

.opacity-85\% {
	opacity: .85
}

.opacity-90\% {
	opacity: .9
}

.opacity-95\% {
	opacity: .95
}

.float-left {
	float: left
}

.float-right {
	float: right
}

.clearfix::after {
	content: "";
	display: table;
	clear: both
}

[class*=" border-"],[class^=border-] {
	--border-o: 1;
	--border-width: 1px;
	--border-style: solid
}

.border {
	border: var(--border-width,1px) var(--border-style,solid) hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--border-o-base,.1))
}

.border-top {
	border-top: var(--border-width,1px) var(--border-style,solid) hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--border-o-base,.1))
}

.border-bottom {
	border-bottom: var(--border-width,1px) var(--border-style,solid) hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--border-o-base,.1))
}

.border-left {
	border-left: var(--border-width,1px) var(--border-style,solid) hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--border-o-base,.1))
}

.border-right {
	border-right: var(--border-width,1px) var(--border-style,solid) hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--border-o-base,.1))
}

.border-2 {
	--border-width: 2px
}

.border-3 {
	--border-width: 3px
}

.border-4 {
	--border-width: 4px
}

.border-dotted {
	--border-style: dotted
}

.border-dashed {
	--border-style: dashed
}

.border-bg-darker {
	border-color: hsla(var(--color-bg-darker-h),var(--color-bg-darker-s),var(--color-bg-darker-l),var(--border-o,1))
}

.border-bg-dark {
	border-color: hsla(var(--color-bg-dark-h),var(--color-bg-dark-s),var(--color-bg-dark-l),var(--border-o,1))
}

.border-bg {
	border-color: hsla(var(--color-bg-h),var(--color-bg-s),var(--color-bg-l),var(--border-o,1))
}

.border-bg-light {
	border-color: hsla(var(--color-bg-light-h),var(--color-bg-light-s),var(--color-bg-light-l),var(--border-o,1))
}

.border-bg-lighter {
	border-color: hsla(var(--color-bg-lighter-h),var(--color-bg-lighter-s),var(--color-bg-lighter-l),var(--border-o,1))
}

.border-contrast-lower {
	border-color: hsla(var(--color-contrast-lower-h),var(--color-contrast-lower-s),var(--color-contrast-lower-l),var(--border-o,1))
}

.border-contrast-low {
	border-color: hsla(var(--color-contrast-low-h),var(--color-contrast-low-s),var(--color-contrast-low-l),var(--border-o,1))
}

.border-contrast-medium {
	border-color: hsla(var(--color-contrast-medium-h),var(--color-contrast-medium-s),var(--color-contrast-medium-l),var(--border-o,1))
}

.border-contrast-high {
	border-color: hsla(var(--color-contrast-high-h),var(--color-contrast-high-s),var(--color-contrast-high-l),var(--border-o,1))
}

.border-contrast-higher {
	border-color: hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--border-o,1))
}

.border-primary-darker {
	border-color: hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),var(--border-o,1))
}

.border-primary-dark {
	border-color: hsla(var(--color-primary-dark-h),var(--color-primary-dark-s),var(--color-primary-dark-l),var(--border-o,1))
}

.border-primary {
	border-color: hsla(var(--color-primary-h),var(--color-primary-s),var(--color-primary-l),var(--border-o,1))
}

.border-primary-light {
	border-color: hsla(var(--color-primary-light-h),var(--color-primary-light-s),var(--color-primary-light-l),var(--border-o,1))
}

.border-primary-lighter {
	border-color: hsla(var(--color-primary-lighter-h),var(--color-primary-lighter-s),var(--color-primary-lighter-l),var(--border-o,1))
}

.border-accent-darker {
	border-color: hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),var(--border-o,1))
}

.border-accent-dark {
	border-color: hsla(var(--color-accent-dark-h),var(--color-accent-dark-s),var(--color-accent-dark-l),var(--border-o,1))
}

.border-accent {
	border-color: hsla(var(--color-accent-h),var(--color-accent-s),var(--color-accent-l),var(--border-o,1))
}

.border-accent-light {
	border-color: hsla(var(--color-accent-light-h),var(--color-accent-light-s),var(--color-accent-light-l),var(--border-o,1))
}

.border-accent-lighter {
	border-color: hsla(var(--color-accent-lighter-h),var(--color-accent-lighter-s),var(--color-accent-lighter-l),var(--border-o,1))
}

.border-success-darker {
	border-color: hsla(var(--color-success-darker-h),var(--color-success-darker-s),var(--color-success-darker-l),var(--border-o,1))
}

.border-success-dark {
	border-color: hsla(var(--color-success-dark-h),var(--color-success-dark-s),var(--color-success-dark-l),var(--border-o,1))
}

.border-success {
	border-color: hsla(var(--color-success-h),var(--color-success-s),var(--color-success-l),var(--border-o,1))
}

.border-success-light {
	border-color: hsla(var(--color-success-light-h),var(--color-success-light-s),var(--color-success-light-l),var(--border-o,1))
}

.border-success-lighter {
	border-color: hsla(var(--color-success-lighter-h),var(--color-success-lighter-s),var(--color-success-lighter-l),var(--border-o,1))
}

.border-warning-darker {
	border-color: hsla(var(--color-warning-darker-h),var(--color-warning-darker-s),var(--color-warning-darker-l),var(--border-o,1))
}

.border-warning-dark {
	border-color: hsla(var(--color-warning-dark-h),var(--color-warning-dark-s),var(--color-warning-dark-l),var(--border-o,1))
}

.border-warning {
	border-color: hsla(var(--color-warning-h),var(--color-warning-s),var(--color-warning-l),var(--border-o,1))
}

.border-warning-light {
	border-color: hsla(var(--color-warning-light-h),var(--color-warning-light-s),var(--color-warning-light-l),var(--border-o,1))
}

.border-warning-lighter {
	border-color: hsla(var(--color-warning-lighter-h),var(--color-warning-lighter-s),var(--color-warning-lighter-l),var(--border-o,1))
}

.border-error-darker {
	border-color: hsla(var(--color-error-darker-h),var(--color-error-darker-s),var(--color-error-darker-l),var(--border-o,1))
}

.border-error-dark {
	border-color: hsla(var(--color-error-dark-h),var(--color-error-dark-s),var(--color-error-dark-l),var(--border-o,1))
}

.border-error {
	border-color: hsla(var(--color-error-h),var(--color-error-s),var(--color-error-l),var(--border-o,1))
}

.border-error-light {
	border-color: hsla(var(--color-error-light-h),var(--color-error-light-s),var(--color-error-light-l),var(--border-o,1))
}

.border-error-lighter {
	border-color: hsla(var(--color-error-lighter-h),var(--color-error-lighter-s),var(--color-error-lighter-l),var(--border-o,1))
}

.border-white {
	border-color: hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),var(--border-o,1))
}

.border-black {
	border-color: hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),var(--border-o,1))
}

.border-opacity-0 {
	--border-o: 0
}

.border-opacity-5\% {
	--border-o: 0.05
}

.border-opacity-10\% {
	--border-o: 0.1
}

.border-opacity-15\% {
	--border-o: 0.15
}

.border-opacity-20\% {
	--border-o: 0.2
}

.border-opacity-25\% {
	--border-o: 0.25
}

.border-opacity-30\% {
	--border-o: 0.3
}

.border-opacity-40\% {
	--border-o: 0.4
}

.border-opacity-50\% {
	--border-o: 0.5
}

.border-opacity-60\% {
	--border-o: 0.6
}

.border-opacity-70\% {
	--border-o: 0.7
}

.border-opacity-75\% {
	--border-o: 0.75
}

.border-opacity-80\% {
	--border-o: 0.8
}

.border-opacity-85\% {
	--border-o: 0.85
}

.border-opacity-90\% {
	--border-o: 0.9
}

.border-opacity-95\% {
	--border-o: 0.95
}

.radius-sm {
	border-radius: var(--radius-sm)
}

.radius-md {
	border-radius: var(--radius-md)
}

.radius-lg {
	border-radius: var(--radius-lg)
}

.radius-50\% {
	border-radius: 50%
}

.radius-full {
	border-radius: 50em
}

.radius-0 {
	border-radius: 0
}

.radius-inherit {
	border-radius: inherit
}

.radius-top-left-0 {
	border-top-left-radius: 0
}

.radius-top-right-0 {
	border-top-right-radius: 0
}

.radius-bottom-right-0 {
	border-bottom-right-radius: 0
}

.radius-bottom-left-0 {
	border-bottom-left-radius: 0
}

.bg,[class*=" bg-"],[class^=bg-] {
	--bg-o: 1
}

.bg-transparent {
	background-color: transparent
}

.bg-inherit {
	background-color: inherit
}

.bg-darker {
	background-color: hsla(var(--color-bg-darker-h),var(--color-bg-darker-s),var(--color-bg-darker-l),var(--bg-o))
}

.bg-dark {
	background-color: hsla(var(--color-bg-dark-h),var(--color-bg-dark-s),var(--color-bg-dark-l),var(--bg-o))
}

.bg {
	background-color: hsla(var(--color-bg-h),var(--color-bg-s),var(--color-bg-l),var(--bg-o))
}

.bg-light {
	background-color: hsla(var(--color-bg-light-h),var(--color-bg-light-s),var(--color-bg-light-l),var(--bg-o))
}

.bg-lighter {
	background-color: hsla(var(--color-bg-lighter-h),var(--color-bg-lighter-s),var(--color-bg-lighter-l),var(--bg-o))
}

.bg-contrast-lower {
	background-color: hsla(var(--color-contrast-lower-h),var(--color-contrast-lower-s),var(--color-contrast-lower-l),var(--bg-o,1))
}

.bg-contrast-low {
	background-color: hsla(var(--color-contrast-low-h),var(--color-contrast-low-s),var(--color-contrast-low-l),var(--bg-o,1))
}

.bg-contrast-medium {
	background-color: hsla(var(--color-contrast-medium-h),var(--color-contrast-medium-s),var(--color-contrast-medium-l),var(--bg-o,1))
}

.bg-contrast-high {
	background-color: hsla(var(--color-contrast-high-h),var(--color-contrast-high-s),var(--color-contrast-high-l),var(--bg-o,1))
}

.bg-contrast-higher {
	background-color: hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),var(--bg-o,1))
}

.bg-primary-darker {
	background-color: hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),var(--bg-o,1))
}

.bg-primary-dark {
	background-color: hsla(var(--color-primary-dark-h),var(--color-primary-dark-s),var(--color-primary-dark-l),var(--bg-o,1))
}

.bg-primary {
	background-color: hsla(var(--color-primary-h),var(--color-primary-s),var(--color-primary-l),var(--bg-o,1))
}

.bg-primary-light {
	background-color: hsla(var(--color-primary-light-h),var(--color-primary-light-s),var(--color-primary-light-l),var(--bg-o,1))
}

.bg-primary-lighter {
	background-color: hsla(var(--color-primary-lighter-h),var(--color-primary-lighter-s),var(--color-primary-lighter-l),var(--bg-o,1))
}

.bg-accent-darker {
	background-color: hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),var(--bg-o,1))
}

.bg-accent-dark {
	background-color: hsla(var(--color-accent-dark-h),var(--color-accent-dark-s),var(--color-accent-dark-l),var(--bg-o,1))
}

.bg-accent {
	background-color: hsla(var(--color-accent-h),var(--color-accent-s),var(--color-accent-l),var(--bg-o,1))
}

.bg-accent-light {
	background-color: hsla(var(--color-accent-light-h),var(--color-accent-light-s),var(--color-accent-light-l),var(--bg-o,1))
}

.bg-accent-lighter {
	background-color: hsla(var(--color-accent-lighter-h),var(--color-accent-lighter-s),var(--color-accent-lighter-l),var(--bg-o,1))
}

.bg-success-darker {
	background-color: hsla(var(--color-success-darker-h),var(--color-success-darker-s),var(--color-success-darker-l),var(--bg-o,1))
}

.bg-success-dark {
	background-color: hsla(var(--color-success-dark-h),var(--color-success-dark-s),var(--color-success-dark-l),var(--bg-o,1))
}

.bg-success {
	background-color: hsla(var(--color-success-h),var(--color-success-s),var(--color-success-l),var(--bg-o,1))
}

.bg-success-light {
	background-color: hsla(var(--color-success-light-h),var(--color-success-light-s),var(--color-success-light-l),var(--bg-o,1))
}

.bg-success-lighter {
	background-color: hsla(var(--color-success-lighter-h),var(--color-success-lighter-s),var(--color-success-lighter-l),var(--bg-o,1))
}

.bg-warning-darker {
	background-color: hsla(var(--color-warning-darker-h),var(--color-warning-darker-s),var(--color-warning-darker-l),var(--bg-o,1))
}

.bg-warning-dark {
	background-color: hsla(var(--color-warning-dark-h),var(--color-warning-dark-s),var(--color-warning-dark-l),var(--bg-o,1))
}

.bg-warning {
	background-color: hsla(var(--color-warning-h),var(--color-warning-s),var(--color-warning-l),var(--bg-o,1))
}

.bg-warning-light {
	background-color: hsla(var(--color-warning-light-h),var(--color-warning-light-s),var(--color-warning-light-l),var(--bg-o,1))
}

.bg-warning-lighter {
	background-color: hsla(var(--color-warning-lighter-h),var(--color-warning-lighter-s),var(--color-warning-lighter-l),var(--bg-o,1))
}

.bg-error-darker {
	background-color: hsla(var(--color-error-darker-h),var(--color-error-darker-s),var(--color-error-darker-l),var(--bg-o,1))
}

.bg-error-dark {
	background-color: hsla(var(--color-error-dark-h),var(--color-error-dark-s),var(--color-error-dark-l),var(--bg-o,1))
}

.bg-error {
	background-color: hsla(var(--color-error-h),var(--color-error-s),var(--color-error-l),var(--bg-o,1))
}

.bg-error-light {
	background-color: hsla(var(--color-error-light-h),var(--color-error-light-s),var(--color-error-light-l),var(--bg-o,1))
}

.bg-error-lighter {
	background-color: hsla(var(--color-error-lighter-h),var(--color-error-lighter-s),var(--color-error-lighter-l),var(--bg-o,1))
}

.bg-white {
	background-color: hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),var(--bg-o,1))
}

.bg-black {
	background-color: hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),var(--bg-o,1))
}

.bg-opacity-0 {
	--bg-o: 0
}

.bg-opacity-5\% {
	--bg-o: 0.05
}

.bg-opacity-10\% {
	--bg-o: 0.1
}

.bg-opacity-15\% {
	--bg-o: 0.15
}

.bg-opacity-20\% {
	--bg-o: 0.2
}

.bg-opacity-25\% {
	--bg-o: 0.25
}

.bg-opacity-30\% {
	--bg-o: 0.3
}

.bg-opacity-40\% {
	--bg-o: 0.4
}

.bg-opacity-50\% {
	--bg-o: 0.5
}

.bg-opacity-60\% {
	--bg-o: 0.6
}

.bg-opacity-70\% {
	--bg-o: 0.7
}

.bg-opacity-75\% {
	--bg-o: 0.75
}

.bg-opacity-80\% {
	--bg-o: 0.8
}

.bg-opacity-85\% {
	--bg-o: 0.85
}

.bg-opacity-90\% {
	--bg-o: 0.9
}

.bg-opacity-95\% {
	--bg-o: 0.95
}

.bg-center {
	background-position: center
}

.bg-top {
	background-position: center top
}

.bg-right {
	background-position: right center
}

.bg-bottom {
	background-position: center bottom
}

.bg-left {
	background-position: left center
}

.bg-top-left {
	background-position: left top
}

.bg-top-right {
	background-position: right top
}

.bg-bottom-left {
	background-position: left bottom
}

.bg-bottom-right {
	background-position: right bottom
}

.bg-cover {
	background-size: cover
}

.bg-no-repeat {
	background-repeat: no-repeat
}

.backdrop-blur-10 {
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.backdrop-blur-20 {
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px)
}

.isolate {
	isolation: isolate
}

.blend-multiply {
	mix-blend-mode: multiply
}

.blend-overlay {
	mix-blend-mode: overlay
}

.blend-difference {
	mix-blend-mode: difference
}

.object-contain {
	-o-object-fit: contain;
	object-fit: contain
}

.object-cover {
	-o-object-fit: cover;
	object-fit: cover
}

.perspective-xs {
	perspective: 250px
}

.perspective-sm {
	perspective: 500px
}

.perspective-md {
	perspective: 1000px
}

.perspective-lg {
	perspective: 1500px
}

.perspective-xl {
	perspective: 3000px
}

[class*=" -rotate"],[class*=" -scale"],[class*=" -skew"] [class^=skew],[class*=" -translate"],[class*=" flip"],[class*=" rotate"],[class*=" scale"],[class*=" skew"],[class*=" translate"],[class^=-rotate],[class^=-scale],[class^=-skew],[class^=-translate],[class^=flip],[class^=rotate],[class^=scale],[class^=translate] {
	--translate: 0;
	--rotate: 0;
	--skew: 0;
	--scale: 1;
	transform: translate3d(var(--translate-x,var(--translate)),var(--translate-y,var(--translate)),var(--translate-z,0)) rotateX(var(--rotate-x,0)) rotateY(var(--rotate-y,0)) rotateZ(var(--rotate-z,var(--rotate))) skewX(var(--skew-x,var(--skew))) skewY(var(--skew-y,0)) scaleX(var(--scale-x,var(--scale))) scaleY(var(--scale-y,var(--scale)))
}

.flip {
	--scale: -1
}

.flip-x {
	--scale-x: -1
}

.flip-y {
	--scale-y: -1
}

.rotate-90 {
	--rotate: 90deg
}

.rotate-180 {
	--rotate: 180deg
}

.rotate-270 {
	--rotate: 270deg
}

.-translate-50\% {
	--translate: -50%
}

.-translate-x-50\% {
	--translate-x: -50%
}

.-translate-y-50\% {
	--translate-y: -50%
}

.translate-50\% {
	--translate: 50%
}

.translate-x-50\% {
	--translate-x: 50%
}

.translate-y-50\% {
	--translate-y: 50%
}

.origin-center {
	transform-origin: center
}

.origin-top {
	transform-origin: center top
}

.origin-right {
	transform-origin: right center
}

.origin-bottom {
	transform-origin: center bottom
}

.origin-left {
	transform-origin: left center
}

.origin-top-left {
	transform-origin: left top
}

.origin-top-right {
	transform-origin: right top
}

.origin-bottom-left {
	transform-origin: left bottom
}

.origin-bottom-right {
	transform-origin: right bottom
}

.transition {
	transition-property: var(--transition-property,all);
	transition-duration: var(--transition-duration,.2s);
	transition-delay: var(--transition-delay,0s)
}

.fill-current {
	fill: currentColor
}

.stroke-current {
	stroke: currentColor
}

.stroke-1 {
	stroke-width: 1px
}

.stroke-2 {
	stroke-width: 2px
}

.stroke-3 {
	stroke-width: 3px
}

.stroke-4 {
	stroke-width: 4px
}

.visible {
	visibility: visible
}

.invisible {
	visibility: hidden
}

.appearance-none {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none
}

.appearance-auto {
	-webkit-appearance: auto;
	-moz-appearance: auto;
	appearance: auto
}

@media (min-width: 32rem) {
	.flex\@xs {
		display:flex
	}

	.inline-flex\@xs {
		display: inline-flex
	}

	.flex-wrap\@xs {
		flex-wrap: wrap
	}

	.flex-nowrap\@xs {
		flex-wrap: nowrap
	}

	.flex-column\@xs {
		flex-direction: column
	}

	.flex-column-reverse\@xs {
		flex-direction: column-reverse
	}

	.flex-row\@xs {
		flex-direction: row
	}

	.flex-row-reverse\@xs {
		flex-direction: row-reverse
	}

	.flex-center\@xs {
		justify-content: center;
		align-items: center
	}

	.flex-grow\@xs {
		flex-grow: 1
	}

	.flex-grow-0\@xs {
		flex-grow: 0
	}

	.flex-shrink\@xs {
		flex-shrink: 1
	}

	.flex-shrink-0\@xs {
		flex-shrink: 0
	}

	.flex-basis-0\@xs {
		flex-basis: 0
	}

	.justify-start\@xs {
		justify-content: flex-start
	}

	.justify-end\@xs {
		justify-content: flex-end
	}

	.justify-center\@xs {
		justify-content: center
	}

	.justify-between\@xs {
		justify-content: space-between
	}

	.items-center\@xs {
		align-items: center
	}

	.items-start\@xs {
		align-items: flex-start
	}

	.items-end\@xs {
		align-items: flex-end
	}

	.items-baseline\@xs {
		align-items: baseline
	}

	.items-stretch\@xs {
		align-items: stretch
	}

	.content-start\@xs {
		align-content: start
	}

	.content-end\@xs {
		align-content: end
	}

	.content-center\@xs {
		align-content: center
	}

	.content-between\@xs {
		align-content: space-between
	}

	.order-1\@xs {
		order: 1
	}

	.order-2\@xs {
		order: 2
	}

	.order-3\@xs {
		order: 3
	}

	.block\@xs {
		display: block
	}

	.inline-block\@xs {
		display: inline-block
	}

	.inline\@xs {
		display: inline
	}

	.contents\@xs {
		display: contents
	}

	.css-grid\@xs {
		display: grid
	}

	.css-inline-grid\@xs {
		display: inline-grid
	}

	.hide\@xs {
		display: none!important
	}

	.margin-xxxxs\@xs {
		margin: var(--space-xxxxs)
	}

	.margin-xxxs\@xs {
		margin: var(--space-xxxs)
	}

	.margin-xxs\@xs {
		margin: var(--space-xxs)
	}

	.margin-xs\@xs {
		margin: var(--space-xs)
	}

	.margin-sm\@xs {
		margin: var(--space-sm)
	}

	.margin-md\@xs {
		margin: var(--space-md)
	}

	.margin-lg\@xs {
		margin: var(--space-lg)
	}

	.margin-xl\@xs {
		margin: var(--space-xl)
	}

	.margin-xxl\@xs {
		margin: var(--space-xxl)
	}

	.margin-xxxl\@xs {
		margin: var(--space-xxxl)
	}

	.margin-xxxxl\@xs {
		margin: var(--space-xxxxl)
	}

	.margin-auto\@xs {
		margin: auto
	}

	.margin-0\@xs {
		margin: 0
	}

	.margin-top-xxxxs\@xs {
		margin-top: var(--space-xxxxs)
	}

	.margin-top-xxxs\@xs {
		margin-top: var(--space-xxxs)
	}

	.margin-top-xxs\@xs {
		margin-top: var(--space-xxs)
	}

	.margin-top-xs\@xs {
		margin-top: var(--space-xs)
	}

	.margin-top-sm\@xs {
		margin-top: var(--space-sm)
	}

	.margin-top-md\@xs {
		margin-top: var(--space-md)
	}

	.margin-top-lg\@xs {
		margin-top: var(--space-lg)
	}

	.margin-top-xl\@xs {
		margin-top: var(--space-xl)
	}

	.margin-top-xxl\@xs {
		margin-top: var(--space-xxl)
	}

	.margin-top-xxxl\@xs {
		margin-top: var(--space-xxxl)
	}

	.margin-top-xxxxl\@xs {
		margin-top: var(--space-xxxxl)
	}

	.margin-top-auto\@xs {
		margin-top: auto
	}

	.margin-top-0\@xs {
		margin-top: 0
	}

	.margin-bottom-xxxxs\@xs {
		margin-bottom: var(--space-xxxxs)
	}

	.margin-bottom-xxxs\@xs {
		margin-bottom: var(--space-xxxs)
	}

	.margin-bottom-xxs\@xs {
		margin-bottom: var(--space-xxs)
	}

	.margin-bottom-xs\@xs {
		margin-bottom: var(--space-xs)
	}

	.margin-bottom-sm\@xs {
		margin-bottom: var(--space-sm)
	}

	.margin-bottom-md\@xs {
		margin-bottom: var(--space-md)
	}

	.margin-bottom-lg\@xs {
		margin-bottom: var(--space-lg)
	}

	.margin-bottom-xl\@xs {
		margin-bottom: var(--space-xl)
	}

	.margin-bottom-xxl\@xs {
		margin-bottom: var(--space-xxl)
	}

	.margin-bottom-xxxl\@xs {
		margin-bottom: var(--space-xxxl)
	}

	.margin-bottom-xxxxl\@xs {
		margin-bottom: var(--space-xxxxl)
	}

	.margin-bottom-auto\@xs {
		margin-bottom: auto
	}

	.margin-bottom-0\@xs {
		margin-bottom: 0
	}

	.margin-right-xxxxs\@xs {
		margin-right: var(--space-xxxxs)
	}

	.margin-right-xxxs\@xs {
		margin-right: var(--space-xxxs)
	}

	.margin-right-xxs\@xs {
		margin-right: var(--space-xxs)
	}

	.margin-right-xs\@xs {
		margin-right: var(--space-xs)
	}

	.margin-right-sm\@xs {
		margin-right: var(--space-sm)
	}

	.margin-right-md\@xs {
		margin-right: var(--space-md)
	}

	.margin-right-lg\@xs {
		margin-right: var(--space-lg)
	}

	.margin-right-xl\@xs {
		margin-right: var(--space-xl)
	}

	.margin-right-xxl\@xs {
		margin-right: var(--space-xxl)
	}

	.margin-right-xxxl\@xs {
		margin-right: var(--space-xxxl)
	}

	.margin-right-xxxxl\@xs {
		margin-right: var(--space-xxxxl)
	}

	.margin-right-auto\@xs {
		margin-right: auto
	}

	.margin-right-0\@xs {
		margin-right: 0
	}

	.margin-left-xxxxs\@xs {
		margin-left: var(--space-xxxxs)
	}

	.margin-left-xxxs\@xs {
		margin-left: var(--space-xxxs)
	}

	.margin-left-xxs\@xs {
		margin-left: var(--space-xxs)
	}

	.margin-left-xs\@xs {
		margin-left: var(--space-xs)
	}

	.margin-left-sm\@xs {
		margin-left: var(--space-sm)
	}

	.margin-left-md\@xs {
		margin-left: var(--space-md)
	}

	.margin-left-lg\@xs {
		margin-left: var(--space-lg)
	}

	.margin-left-xl\@xs {
		margin-left: var(--space-xl)
	}

	.margin-left-xxl\@xs {
		margin-left: var(--space-xxl)
	}

	.margin-left-xxxl\@xs {
		margin-left: var(--space-xxxl)
	}

	.margin-left-xxxxl\@xs {
		margin-left: var(--space-xxxxl)
	}

	.margin-left-auto\@xs {
		margin-left: auto
	}

	.margin-left-0\@xs {
		margin-left: 0
	}

	.margin-x-xxxxs\@xs {
		margin-left: var(--space-xxxxs);
		margin-right: var(--space-xxxxs)
	}

	.margin-x-xxxs\@xs {
		margin-left: var(--space-xxxs);
		margin-right: var(--space-xxxs)
	}

	.margin-x-xxs\@xs {
		margin-left: var(--space-xxs);
		margin-right: var(--space-xxs)
	}

	.margin-x-xs\@xs {
		margin-left: var(--space-xs);
		margin-right: var(--space-xs)
	}

	.margin-x-sm\@xs {
		margin-left: var(--space-sm);
		margin-right: var(--space-sm)
	}

	.margin-x-md\@xs {
		margin-left: var(--space-md);
		margin-right: var(--space-md)
	}

	.margin-x-lg\@xs {
		margin-left: var(--space-lg);
		margin-right: var(--space-lg)
	}

	.margin-x-xl\@xs {
		margin-left: var(--space-xl);
		margin-right: var(--space-xl)
	}

	.margin-x-xxl\@xs {
		margin-left: var(--space-xxl);
		margin-right: var(--space-xxl)
	}

	.margin-x-xxxl\@xs {
		margin-left: var(--space-xxxl);
		margin-right: var(--space-xxxl)
	}

	.margin-x-xxxxl\@xs {
		margin-left: var(--space-xxxxl);
		margin-right: var(--space-xxxxl)
	}

	.margin-x-auto\@xs {
		margin-left: auto;
		margin-right: auto
	}

	.margin-x-0\@xs {
		margin-left: 0;
		margin-right: 0
	}

	.margin-y-xxxxs\@xs {
		margin-top: var(--space-xxxxs);
		margin-bottom: var(--space-xxxxs)
	}

	.margin-y-xxxs\@xs {
		margin-top: var(--space-xxxs);
		margin-bottom: var(--space-xxxs)
	}

	.margin-y-xxs\@xs {
		margin-top: var(--space-xxs);
		margin-bottom: var(--space-xxs)
	}

	.margin-y-xs\@xs {
		margin-top: var(--space-xs);
		margin-bottom: var(--space-xs)
	}

	.margin-y-sm\@xs {
		margin-top: var(--space-sm);
		margin-bottom: var(--space-sm)
	}

	.margin-y-md\@xs {
		margin-top: var(--space-md);
		margin-bottom: var(--space-md)
	}

	.margin-y-lg\@xs {
		margin-top: var(--space-lg);
		margin-bottom: var(--space-lg)
	}

	.margin-y-xl\@xs {
		margin-top: var(--space-xl);
		margin-bottom: var(--space-xl)
	}

	.margin-y-xxl\@xs {
		margin-top: var(--space-xxl);
		margin-bottom: var(--space-xxl)
	}

	.margin-y-xxxl\@xs {
		margin-top: var(--space-xxxl);
		margin-bottom: var(--space-xxxl)
	}

	.margin-y-xxxxl\@xs {
		margin-top: var(--space-xxxxl);
		margin-bottom: var(--space-xxxxl)
	}

	.margin-y-auto\@xs {
		margin-top: auto;
		margin-bottom: auto
	}

	.margin-y-0\@xs {
		margin-top: 0;
		margin-bottom: 0
	}

	.padding-xxxxs\@xs {
		padding: var(--space-xxxxs)
	}

	.padding-xxxs\@xs {
		padding: var(--space-xxxs)
	}

	.padding-xxs\@xs {
		padding: var(--space-xxs)
	}

	.padding-xs\@xs {
		padding: var(--space-xs)
	}

	.padding-sm\@xs {
		padding: var(--space-sm)
	}

	.padding-md\@xs {
		padding: var(--space-md)
	}

	.padding-lg\@xs {
		padding: var(--space-lg)
	}

	.padding-xl\@xs {
		padding: var(--space-xl)
	}

	.padding-xxl\@xs {
		padding: var(--space-xxl)
	}

	.padding-xxxl\@xs {
		padding: var(--space-xxxl)
	}

	.padding-xxxxl\@xs {
		padding: var(--space-xxxxl)
	}

	.padding-0\@xs {
		padding: 0
	}

	.padding-component\@xs {
		padding: var(--component-padding)
	}

	.padding-top-xxxxs\@xs {
		padding-top: var(--space-xxxxs)
	}

	.padding-top-xxxs\@xs {
		padding-top: var(--space-xxxs)
	}

	.padding-top-xxs\@xs {
		padding-top: var(--space-xxs)
	}

	.padding-top-xs\@xs {
		padding-top: var(--space-xs)
	}

	.padding-top-sm\@xs {
		padding-top: var(--space-sm)
	}

	.padding-top-md\@xs {
		padding-top: var(--space-md)
	}

	.padding-top-lg\@xs {
		padding-top: var(--space-lg)
	}

	.padding-top-xl\@xs {
		padding-top: var(--space-xl)
	}

	.padding-top-xxl\@xs {
		padding-top: var(--space-xxl)
	}

	.padding-top-xxxl\@xs {
		padding-top: var(--space-xxxl)
	}

	.padding-top-xxxxl\@xs {
		padding-top: var(--space-xxxxl)
	}

	.padding-top-0\@xs {
		padding-top: 0
	}

	.padding-top-component\@xs {
		padding-top: var(--component-padding)
	}

	.padding-bottom-xxxxs\@xs {
		padding-bottom: var(--space-xxxxs)
	}

	.padding-bottom-xxxs\@xs {
		padding-bottom: var(--space-xxxs)
	}

	.padding-bottom-xxs\@xs {
		padding-bottom: var(--space-xxs)
	}

	.padding-bottom-xs\@xs {
		padding-bottom: var(--space-xs)
	}

	.padding-bottom-sm\@xs {
		padding-bottom: var(--space-sm)
	}

	.padding-bottom-md\@xs {
		padding-bottom: var(--space-md)
	}

	.padding-bottom-lg\@xs {
		padding-bottom: var(--space-lg)
	}

	.padding-bottom-xl\@xs {
		padding-bottom: var(--space-xl)
	}

	.padding-bottom-xxl\@xs {
		padding-bottom: var(--space-xxl)
	}

	.padding-bottom-xxxl\@xs {
		padding-bottom: var(--space-xxxl)
	}

	.padding-bottom-xxxxl\@xs {
		padding-bottom: var(--space-xxxxl)
	}

	.padding-bottom-0\@xs {
		padding-bottom: 0
	}

	.padding-bottom-component\@xs {
		padding-bottom: var(--component-padding)
	}

	.padding-right-xxxxs\@xs {
		padding-right: var(--space-xxxxs)
	}

	.padding-right-xxxs\@xs {
		padding-right: var(--space-xxxs)
	}

	.padding-right-xxs\@xs {
		padding-right: var(--space-xxs)
	}

	.padding-right-xs\@xs {
		padding-right: var(--space-xs)
	}

	.padding-right-sm\@xs {
		padding-right: var(--space-sm)
	}

	.padding-right-md\@xs {
		padding-right: var(--space-md)
	}

	.padding-right-lg\@xs {
		padding-right: var(--space-lg)
	}

	.padding-right-xl\@xs {
		padding-right: var(--space-xl)
	}

	.padding-right-xxl\@xs {
		padding-right: var(--space-xxl)
	}

	.padding-right-xxxl\@xs {
		padding-right: var(--space-xxxl)
	}

	.padding-right-xxxxl\@xs {
		padding-right: var(--space-xxxxl)
	}

	.padding-right-0\@xs {
		padding-right: 0
	}

	.padding-right-component\@xs {
		padding-right: var(--component-padding)
	}

	.padding-left-xxxxs\@xs {
		padding-left: var(--space-xxxxs)
	}

	.padding-left-xxxs\@xs {
		padding-left: var(--space-xxxs)
	}

	.padding-left-xxs\@xs {
		padding-left: var(--space-xxs)
	}

	.padding-left-xs\@xs {
		padding-left: var(--space-xs)
	}

	.padding-left-sm\@xs {
		padding-left: var(--space-sm)
	}

	.padding-left-md\@xs {
		padding-left: var(--space-md)
	}

	.padding-left-lg\@xs {
		padding-left: var(--space-lg)
	}

	.padding-left-xl\@xs {
		padding-left: var(--space-xl)
	}

	.padding-left-xxl\@xs {
		padding-left: var(--space-xxl)
	}

	.padding-left-xxxl\@xs {
		padding-left: var(--space-xxxl)
	}

	.padding-left-xxxxl\@xs {
		padding-left: var(--space-xxxxl)
	}

	.padding-left-0\@xs {
		padding-left: 0
	}

	.padding-left-component\@xs {
		padding-left: var(--component-padding)
	}

	.padding-x-xxxxs\@xs {
		padding-left: var(--space-xxxxs);
		padding-right: var(--space-xxxxs)
	}

	.padding-x-xxxs\@xs {
		padding-left: var(--space-xxxs);
		padding-right: var(--space-xxxs)
	}

	.padding-x-xxs\@xs {
		padding-left: var(--space-xxs);
		padding-right: var(--space-xxs)
	}

	.padding-x-xs\@xs {
		padding-left: var(--space-xs);
		padding-right: var(--space-xs)
	}

	.padding-x-sm\@xs {
		padding-left: var(--space-sm);
		padding-right: var(--space-sm)
	}

	.padding-x-md\@xs {
		padding-left: var(--space-md);
		padding-right: var(--space-md)
	}

	.padding-x-lg\@xs {
		padding-left: var(--space-lg);
		padding-right: var(--space-lg)
	}

	.padding-x-xl\@xs {
		padding-left: var(--space-xl);
		padding-right: var(--space-xl)
	}

	.padding-x-xxl\@xs {
		padding-left: var(--space-xxl);
		padding-right: var(--space-xxl)
	}

	.padding-x-xxxl\@xs {
		padding-left: var(--space-xxxl);
		padding-right: var(--space-xxxl)
	}

	.padding-x-xxxxl\@xs {
		padding-left: var(--space-xxxxl);
		padding-right: var(--space-xxxxl)
	}

	.padding-x-0\@xs {
		padding-left: 0;
		padding-right: 0
	}

	.padding-x-component\@xs {
		padding-left: var(--component-padding);
		padding-right: var(--component-padding)
	}

	.padding-y-xxxxs\@xs {
		padding-top: var(--space-xxxxs);
		padding-bottom: var(--space-xxxxs)
	}

	.padding-y-xxxs\@xs {
		padding-top: var(--space-xxxs);
		padding-bottom: var(--space-xxxs)
	}

	.padding-y-xxs\@xs {
		padding-top: var(--space-xxs);
		padding-bottom: var(--space-xxs)
	}

	.padding-y-xs\@xs {
		padding-top: var(--space-xs);
		padding-bottom: var(--space-xs)
	}

	.padding-y-sm\@xs {
		padding-top: var(--space-sm);
		padding-bottom: var(--space-sm)
	}

	.padding-y-md\@xs {
		padding-top: var(--space-md);
		padding-bottom: var(--space-md)
	}

	.padding-y-lg\@xs {
		padding-top: var(--space-lg);
		padding-bottom: var(--space-lg)
	}

	.padding-y-xl\@xs {
		padding-top: var(--space-xl);
		padding-bottom: var(--space-xl)
	}

	.padding-y-xxl\@xs {
		padding-top: var(--space-xxl);
		padding-bottom: var(--space-xxl)
	}

	.padding-y-xxxl\@xs {
		padding-top: var(--space-xxxl);
		padding-bottom: var(--space-xxxl)
	}

	.padding-y-xxxxl\@xs {
		padding-top: var(--space-xxxxl);
		padding-bottom: var(--space-xxxxl)
	}

	.padding-y-0\@xs {
		padding-top: 0;
		padding-bottom: 0
	}

	.padding-y-component\@xs {
		padding-top: var(--component-padding);
		padding-bottom: var(--component-padding)
	}

	.text-center\@xs {
		text-align: center
	}

	.text-left\@xs {
		text-align: left
	}

	.text-right\@xs {
		text-align: right
	}

	.text-justify\@xs {
		text-align: justify
	}

	.text-xs\@xs {
		font-size: var(--text-xs,.6875rem)
	}

	.text-sm\@xs {
		font-size: var(--text-sm,.75rem)
	}

	.text-base\@xs {
		font-size: var(--text-unit,1rem)
	}

	.text-md\@xs {
		font-size: var(--text-md,1.125rem)
	}

	.text-lg\@xs {
		font-size: var(--text-lg,1.375rem)
	}

	.text-xl\@xs {
		font-size: var(--text-xl,1.75rem)
	}

	.text-xxl\@xs {
		font-size: var(--text-xxl,2rem)
	}

	.text-xxxl\@xs {
		font-size: var(--text-xxxl,2.5rem)
	}

	.text-xxxxl\@xs {
		font-size: var(--text-xxxxl,3rem)
	}

	.column-count-1\@xs {
		-moz-column-count: 1;
		column-count: 1
	}

	.column-count-2\@xs {
		-moz-column-count: 2;
		column-count: 2
	}

	.column-count-3\@xs {
		-moz-column-count: 3;
		column-count: 3
	}

	.column-count-4\@xs {
		-moz-column-count: 4;
		column-count: 4
	}

	.width-xxxxs\@xs {
		width: var(--size-xxxxs,.25rem)
	}

	.width-xxxs\@xs {
		width: var(--size-xxxs,.5rem)
	}

	.width-xxs\@xs {
		width: var(--size-xxs,.75rem)
	}

	.width-xs\@xs {
		width: var(--size-xs,1rem)
	}

	.width-sm\@xs {
		width: var(--size-sm,1.5rem)
	}

	.width-md\@xs {
		width: var(--size-md,2rem)
	}

	.width-lg\@xs {
		width: var(--size-lg,3rem)
	}

	.width-xl\@xs {
		width: var(--size-xl,4rem)
	}

	.width-xxl\@xs {
		width: var(--size-xxl,6rem)
	}

	.width-xxxl\@xs {
		width: var(--size-xxxl,8rem)
	}

	.width-xxxxl\@xs {
		width: var(--size-xxxxl,16rem)
	}

	.width-0\@xs {
		width: 0
	}

	.width-10\%\@xs {
		width: 10%
	}

	.width-20\%\@xs {
		width: 20%
	}

	.width-25\%\@xs {
		width: 25%
	}

	.width-30\%\@xs {
		width: 30%
	}

	.width-33\%\@xs {
		width: 33.3333333333%
	}

	.width-40\%\@xs {
		width: 40%
	}

	.width-50\%\@xs {
		width: 50%
	}

	.width-60\%\@xs {
		width: 60%
	}

	.width-66\%\@xs {
		width: 66.6666666667%
	}

	.width-70\%\@xs {
		width: 70%
	}

	.width-75\%\@xs {
		width: 75%
	}

	.width-80\%\@xs {
		width: 80%
	}

	.width-90\%\@xs {
		width: 90%
	}

	.width-100\%\@xs {
		width: 100%
	}

	.width-100vw\@xs {
		width: 100vw
	}

	.width-auto\@xs {
		width: auto
	}

	.width-inherit\@xs {
		width: inherit
	}

	.height-xxxxs\@xs {
		height: var(--size-xxxxs,.25rem)
	}

	.height-xxxs\@xs {
		height: var(--size-xxxs,.5rem)
	}

	.height-xxs\@xs {
		height: var(--size-xxs,.75rem)
	}

	.height-xs\@xs {
		height: var(--size-xs,1rem)
	}

	.height-sm\@xs {
		height: var(--size-sm,1.5rem)
	}

	.height-md\@xs {
		height: var(--size-md,2rem)
	}

	.height-lg\@xs {
		height: var(--size-lg,3rem)
	}

	.height-xl\@xs {
		height: var(--size-xl,4rem)
	}

	.height-xxl\@xs {
		height: var(--size-xxl,6rem)
	}

	.height-xxxl\@xs {
		height: var(--size-xxxl,8rem)
	}

	.height-xxxxl\@xs {
		height: var(--size-xxxxl,16rem)
	}

	.height-0\@xs {
		height: 0
	}

	.height-10\%\@xs {
		height: 10%
	}

	.height-20\%\@xs {
		height: 20%
	}

	.height-25\%\@xs {
		height: 25%
	}

	.height-30\%\@xs {
		height: 30%
	}

	.height-33\%\@xs {
		height: 33.3333333333%
	}

	.height-40\%\@xs {
		height: 40%
	}

	.height-50\%\@xs {
		height: 50%
	}

	.height-60\%\@xs {
		height: 60%
	}

	.height-66\%\@xs {
		height: 66.6666666667%
	}

	.height-70\%\@xs {
		height: 70%
	}

	.height-75\%\@xs {
		height: 75%
	}

	.height-80\%\@xs {
		height: 80%
	}

	.height-90\%\@xs {
		height: 90%
	}

	.height-100\%\@xs {
		height: 100%
	}

	.height-100vh\@xs {
		height: 100vh
	}

	.height-auto\@xs {
		height: auto
	}

	.height-inherit\@xs {
		height: inherit
	}

	.max-width-xxxxxs\@xs {
		max-width: var(--max-width-xxxxxs)
	}

	.max-width-xxxxs\@xs {
		max-width: var(--max-width-xxxxs)
	}

	.max-width-xxxs\@xs {
		max-width: var(--max-width-xxxs)
	}

	.max-width-xxs\@xs {
		max-width: var(--max-width-xxs)
	}

	.max-width-xs\@xs {
		max-width: var(--max-width-xs)
	}

	.max-width-sm\@xs {
		max-width: var(--max-width-sm)
	}

	.max-width-md\@xs {
		max-width: var(--max-width-md)
	}

	.max-width-lg\@xs {
		max-width: var(--max-width-lg)
	}

	.max-width-xl\@xs {
		max-width: var(--max-width-xl)
	}

	.max-width-xxl\@xs {
		max-width: var(--max-width-xxl)
	}

	.max-width-xxxl\@xs {
		max-width: var(--max-width-xxxl)
	}

	.max-width-xxxxl\@xs {
		max-width: var(--max-width-xxxxl)
	}

	.max-width-100\%\@xs {
		max-width: 100%
	}

	.max-width-none\@xs {
		max-width: none
	}

	.position-relative\@xs {
		position: relative
	}

	.position-absolute\@xs {
		position: absolute
	}

	.position-fixed\@xs {
		position: fixed
	}

	.position-sticky\@xs {
		position: -webkit-sticky;
		position: sticky
	}

	.position-static\@xs {
		position: static
	}

	.inset-0\@xs {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0
	}

	.top-0\@xs {
		top: 0
	}

	.top-50\%\@xs {
		top: 50%
	}

	.top-xxxxs\@xs {
		top: var(--space-xxxxs)
	}

	.top-xxxs\@xs {
		top: var(--space-xxxs)
	}

	.top-xxs\@xs {
		top: var(--space-xxs)
	}

	.top-xs\@xs {
		top: var(--space-xs)
	}

	.top-sm\@xs {
		top: var(--space-sm)
	}

	.top-md\@xs {
		top: var(--space-md)
	}

	.top-lg\@xs {
		top: var(--space-lg)
	}

	.top-xl\@xs {
		top: var(--space-xl)
	}

	.top-xxl\@xs {
		top: var(--space-xxl)
	}

	.top-xxxl\@xs {
		top: var(--space-xxxl)
	}

	.top-xxxxl\@xs {
		top: var(--space-xxxxl)
	}

	.bottom-0\@xs {
		bottom: 0
	}

	.bottom-50\%\@xs {
		bottom: 50%
	}

	.bottom-xxxxs\@xs {
		bottom: var(--space-xxxxs)
	}

	.bottom-xxxs\@xs {
		bottom: var(--space-xxxs)
	}

	.bottom-xxs\@xs {
		bottom: var(--space-xxs)
	}

	.bottom-xs\@xs {
		bottom: var(--space-xs)
	}

	.bottom-sm\@xs {
		bottom: var(--space-sm)
	}

	.bottom-md\@xs {
		bottom: var(--space-md)
	}

	.bottom-lg\@xs {
		bottom: var(--space-lg)
	}

	.bottom-xl\@xs {
		bottom: var(--space-xl)
	}

	.bottom-xxl\@xs {
		bottom: var(--space-xxl)
	}

	.bottom-xxxl\@xs {
		bottom: var(--space-xxxl)
	}

	.bottom-xxxxl\@xs {
		bottom: var(--space-xxxxl)
	}

	.right-0\@xs {
		right: 0
	}

	.right-50\%\@xs {
		right: 50%
	}

	.right-xxxxs\@xs {
		right: var(--space-xxxxs)
	}

	.right-xxxs\@xs {
		right: var(--space-xxxs)
	}

	.right-xxs\@xs {
		right: var(--space-xxs)
	}

	.right-xs\@xs {
		right: var(--space-xs)
	}

	.right-sm\@xs {
		right: var(--space-sm)
	}

	.right-md\@xs {
		right: var(--space-md)
	}

	.right-lg\@xs {
		right: var(--space-lg)
	}

	.right-xl\@xs {
		right: var(--space-xl)
	}

	.right-xxl\@xs {
		right: var(--space-xxl)
	}

	.right-xxxl\@xs {
		right: var(--space-xxxl)
	}

	.right-xxxxl\@xs {
		right: var(--space-xxxxl)
	}

	.left-0\@xs {
		left: 0
	}

	.left-50\%\@xs {
		left: 50%
	}

	.left-xxxxs\@xs {
		left: var(--space-xxxxs)
	}

	.left-xxxs\@xs {
		left: var(--space-xxxs)
	}

	.left-xxs\@xs {
		left: var(--space-xxs)
	}

	.left-xs\@xs {
		left: var(--space-xs)
	}

	.left-sm\@xs {
		left: var(--space-sm)
	}

	.left-md\@xs {
		left: var(--space-md)
	}

	.left-lg\@xs {
		left: var(--space-lg)
	}

	.left-xl\@xs {
		left: var(--space-xl)
	}

	.left-xxl\@xs {
		left: var(--space-xxl)
	}

	.left-xxxl\@xs {
		left: var(--space-xxxl)
	}

	.left-xxxxl\@xs {
		left: var(--space-xxxxl)
	}

	.overflow-hidden\@xs {
		overflow: hidden
	}

	.overflow-auto\@xs {
		overflow: auto
	}

	.momentum-scrolling\@xs {
		-webkit-overflow-scrolling: touch
	}

	.overscroll-contain\@xs {
		overscroll-behavior: contain
	}

	.visible\@xs {
		visibility: visible
	}

	.invisible\@xs {
		visibility: hidden
	}
}

@media not all and (min-width: 32rem) {
	.display\@xs {
		display:none!important
	}
}

@media (min-width: 48rem) {
	.flex\@sm {
		display:flex
	}

	.inline-flex\@sm {
		display: inline-flex
	}

	.flex-wrap\@sm {
		flex-wrap: wrap
	}

	.flex-nowrap\@sm {
		flex-wrap: nowrap
	}

	.flex-column\@sm {
		flex-direction: column
	}

	.flex-column-reverse\@sm {
		flex-direction: column-reverse
	}

	.flex-row\@sm {
		flex-direction: row
	}

	.flex-row-reverse\@sm {
		flex-direction: row-reverse
	}

	.flex-center\@sm {
		justify-content: center;
		align-items: center
	}

	.flex-grow\@sm {
		flex-grow: 1
	}

	.flex-grow-0\@sm {
		flex-grow: 0
	}

	.flex-shrink\@sm {
		flex-shrink: 1
	}

	.flex-shrink-0\@sm {
		flex-shrink: 0
	}

	.flex-basis-0\@sm {
		flex-basis: 0
	}

	.justify-start\@sm {
		justify-content: flex-start
	}

	.justify-end\@sm {
		justify-content: flex-end
	}

	.justify-center\@sm {
		justify-content: center
	}

	.justify-between\@sm {
		justify-content: space-between
	}

	.items-center\@sm {
		align-items: center
	}

	.items-start\@sm {
		align-items: flex-start
	}

	.items-end\@sm {
		align-items: flex-end
	}

	.items-baseline\@sm {
		align-items: baseline
	}

	.items-stretch\@sm {
		align-items: stretch
	}

	.content-start\@sm {
		align-content: start
	}

	.content-end\@sm {
		align-content: end
	}

	.content-center\@sm {
		align-content: center
	}

	.content-between\@sm {
		align-content: space-between
	}

	.order-1\@sm {
		order: 1
	}

	.order-2\@sm {
		order: 2
	}

	.order-3\@sm {
		order: 3
	}

	.block\@sm {
		display: block
	}

	.inline-block\@sm {
		display: inline-block
	}

	.inline\@sm {
		display: inline
	}

	.contents\@sm {
		display: contents
	}

	.css-grid\@sm {
		display: grid
	}

	.css-inline-grid\@sm {
		display: inline-grid
	}

	.hide\@sm {
		display: none!important
	}

	.margin-xxxxs\@sm {
		margin: var(--space-xxxxs)
	}

	.margin-xxxs\@sm {
		margin: var(--space-xxxs)
	}

	.margin-xxs\@sm {
		margin: var(--space-xxs)
	}

	.margin-xs\@sm {
		margin: var(--space-xs)
	}

	.margin-sm\@sm {
		margin: var(--space-sm)
	}

	.margin-md\@sm {
		margin: var(--space-md)
	}

	.margin-lg\@sm {
		margin: var(--space-lg)
	}

	.margin-xl\@sm {
		margin: var(--space-xl)
	}

	.margin-xxl\@sm {
		margin: var(--space-xxl)
	}

	.margin-xxxl\@sm {
		margin: var(--space-xxxl)
	}

	.margin-xxxxl\@sm {
		margin: var(--space-xxxxl)
	}

	.margin-auto\@sm {
		margin: auto
	}

	.margin-0\@sm {
		margin: 0
	}

	.margin-top-xxxxs\@sm {
		margin-top: var(--space-xxxxs)
	}

	.margin-top-xxxs\@sm {
		margin-top: var(--space-xxxs)
	}

	.margin-top-xxs\@sm {
		margin-top: var(--space-xxs)
	}

	.margin-top-xs\@sm {
		margin-top: var(--space-xs)
	}

	.margin-top-sm\@sm {
		margin-top: var(--space-sm)
	}

	.margin-top-md\@sm {
		margin-top: var(--space-md)
	}

	.margin-top-lg\@sm {
		margin-top: var(--space-lg)
	}

	.margin-top-xl\@sm {
		margin-top: var(--space-xl)
	}

	.margin-top-xxl\@sm {
		margin-top: var(--space-xxl)
	}

	.margin-top-xxxl\@sm {
		margin-top: var(--space-xxxl)
	}

	.margin-top-xxxxl\@sm {
		margin-top: var(--space-xxxxl)
	}

	.margin-top-auto\@sm {
		margin-top: auto
	}

	.margin-top-0\@sm {
		margin-top: 0
	}

	.margin-bottom-xxxxs\@sm {
		margin-bottom: var(--space-xxxxs)
	}

	.margin-bottom-xxxs\@sm {
		margin-bottom: var(--space-xxxs)
	}

	.margin-bottom-xxs\@sm {
		margin-bottom: var(--space-xxs)
	}

	.margin-bottom-xs\@sm {
		margin-bottom: var(--space-xs)
	}

	.margin-bottom-sm\@sm {
		margin-bottom: var(--space-sm)
	}

	.margin-bottom-md\@sm {
		margin-bottom: var(--space-md)
	}

	.margin-bottom-lg\@sm {
		margin-bottom: var(--space-lg)
	}

	.margin-bottom-xl\@sm {
		margin-bottom: var(--space-xl)
	}

	.margin-bottom-xxl\@sm {
		margin-bottom: var(--space-xxl)
	}

	.margin-bottom-xxxl\@sm {
		margin-bottom: var(--space-xxxl)
	}

	.margin-bottom-xxxxl\@sm {
		margin-bottom: var(--space-xxxxl)
	}

	.margin-bottom-auto\@sm {
		margin-bottom: auto
	}

	.margin-bottom-0\@sm {
		margin-bottom: 0
	}

	.margin-right-xxxxs\@sm {
		margin-right: var(--space-xxxxs)
	}

	.margin-right-xxxs\@sm {
		margin-right: var(--space-xxxs)
	}

	.margin-right-xxs\@sm {
		margin-right: var(--space-xxs)
	}

	.margin-right-xs\@sm {
		margin-right: var(--space-xs)
	}

	.margin-right-sm\@sm {
		margin-right: var(--space-sm)
	}

	.margin-right-md\@sm {
		margin-right: var(--space-md)
	}

	.margin-right-lg\@sm {
		margin-right: var(--space-lg)
	}

	.margin-right-xl\@sm {
		margin-right: var(--space-xl)
	}

	.margin-right-xxl\@sm {
		margin-right: var(--space-xxl)
	}

	.margin-right-xxxl\@sm {
		margin-right: var(--space-xxxl)
	}

	.margin-right-xxxxl\@sm {
		margin-right: var(--space-xxxxl)
	}

	.margin-right-auto\@sm {
		margin-right: auto
	}

	.margin-right-0\@sm {
		margin-right: 0
	}

	.margin-left-xxxxs\@sm {
		margin-left: var(--space-xxxxs)
	}

	.margin-left-xxxs\@sm {
		margin-left: var(--space-xxxs)
	}

	.margin-left-xxs\@sm {
		margin-left: var(--space-xxs)
	}

	.margin-left-xs\@sm {
		margin-left: var(--space-xs)
	}

	.margin-left-sm\@sm {
		margin-left: var(--space-sm)
	}

	.margin-left-md\@sm {
		margin-left: var(--space-md)
	}

	.margin-left-lg\@sm {
		margin-left: var(--space-lg)
	}

	.margin-left-xl\@sm {
		margin-left: var(--space-xl)
	}

	.margin-left-xxl\@sm {
		margin-left: var(--space-xxl)
	}

	.margin-left-xxxl\@sm {
		margin-left: var(--space-xxxl)
	}

	.margin-left-xxxxl\@sm {
		margin-left: var(--space-xxxxl)
	}

	.margin-left-auto\@sm {
		margin-left: auto
	}

	.margin-left-0\@sm {
		margin-left: 0
	}

	.margin-x-xxxxs\@sm {
		margin-left: var(--space-xxxxs);
		margin-right: var(--space-xxxxs)
	}

	.margin-x-xxxs\@sm {
		margin-left: var(--space-xxxs);
		margin-right: var(--space-xxxs)
	}

	.margin-x-xxs\@sm {
		margin-left: var(--space-xxs);
		margin-right: var(--space-xxs)
	}

	.margin-x-xs\@sm {
		margin-left: var(--space-xs);
		margin-right: var(--space-xs)
	}

	.margin-x-sm\@sm {
		margin-left: var(--space-sm);
		margin-right: var(--space-sm)
	}

	.margin-x-md\@sm {
		margin-left: var(--space-md);
		margin-right: var(--space-md)
	}

	.margin-x-lg\@sm {
		margin-left: var(--space-lg);
		margin-right: var(--space-lg)
	}

	.margin-x-xl\@sm {
		margin-left: var(--space-xl);
		margin-right: var(--space-xl)
	}

	.margin-x-xxl\@sm {
		margin-left: var(--space-xxl);
		margin-right: var(--space-xxl)
	}

	.margin-x-xxxl\@sm {
		margin-left: var(--space-xxxl);
		margin-right: var(--space-xxxl)
	}

	.margin-x-xxxxl\@sm {
		margin-left: var(--space-xxxxl);
		margin-right: var(--space-xxxxl)
	}

	.margin-x-auto\@sm {
		margin-left: auto;
		margin-right: auto
	}

	.margin-x-0\@sm {
		margin-left: 0;
		margin-right: 0
	}

	.margin-y-xxxxs\@sm {
		margin-top: var(--space-xxxxs);
		margin-bottom: var(--space-xxxxs)
	}

	.margin-y-xxxs\@sm {
		margin-top: var(--space-xxxs);
		margin-bottom: var(--space-xxxs)
	}

	.margin-y-xxs\@sm {
		margin-top: var(--space-xxs);
		margin-bottom: var(--space-xxs)
	}

	.margin-y-xs\@sm {
		margin-top: var(--space-xs);
		margin-bottom: var(--space-xs)
	}

	.margin-y-sm\@sm {
		margin-top: var(--space-sm);
		margin-bottom: var(--space-sm)
	}

	.margin-y-md\@sm {
		margin-top: var(--space-md);
		margin-bottom: var(--space-md)
	}

	.margin-y-lg\@sm {
		margin-top: var(--space-lg);
		margin-bottom: var(--space-lg)
	}

	.margin-y-xl\@sm {
		margin-top: var(--space-xl);
		margin-bottom: var(--space-xl)
	}

	.margin-y-xxl\@sm {
		margin-top: var(--space-xxl);
		margin-bottom: var(--space-xxl)
	}

	.margin-y-xxxl\@sm {
		margin-top: var(--space-xxxl);
		margin-bottom: var(--space-xxxl)
	}

	.margin-y-xxxxl\@sm {
		margin-top: var(--space-xxxxl);
		margin-bottom: var(--space-xxxxl)
	}

	.margin-y-auto\@sm {
		margin-top: auto;
		margin-bottom: auto
	}

	.margin-y-0\@sm {
		margin-top: 0;
		margin-bottom: 0
	}

	.padding-xxxxs\@sm {
		padding: var(--space-xxxxs)
	}

	.padding-xxxs\@sm {
		padding: var(--space-xxxs)
	}

	.padding-xxs\@sm {
		padding: var(--space-xxs)
	}

	.padding-xs\@sm {
		padding: var(--space-xs)
	}

	.padding-sm\@sm {
		padding: var(--space-sm)
	}

	.padding-md\@sm {
		padding: var(--space-md)
	}

	.padding-lg\@sm {
		padding: var(--space-lg)
	}

	.padding-xl\@sm {
		padding: var(--space-xl)
	}

	.padding-xxl\@sm {
		padding: var(--space-xxl)
	}

	.padding-xxxl\@sm {
		padding: var(--space-xxxl)
	}

	.padding-xxxxl\@sm {
		padding: var(--space-xxxxl)
	}

	.padding-0\@sm {
		padding: 0
	}

	.padding-component\@sm {
		padding: var(--component-padding)
	}

	.padding-top-xxxxs\@sm {
		padding-top: var(--space-xxxxs)
	}

	.padding-top-xxxs\@sm {
		padding-top: var(--space-xxxs)
	}

	.padding-top-xxs\@sm {
		padding-top: var(--space-xxs)
	}

	.padding-top-xs\@sm {
		padding-top: var(--space-xs)
	}

	.padding-top-sm\@sm {
		padding-top: var(--space-sm)
	}

	.padding-top-md\@sm {
		padding-top: var(--space-md)
	}

	.padding-top-lg\@sm {
		padding-top: var(--space-lg)
	}

	.padding-top-xl\@sm {
		padding-top: var(--space-xl)
	}

	.padding-top-xxl\@sm {
		padding-top: var(--space-xxl)
	}

	.padding-top-xxxl\@sm {
		padding-top: var(--space-xxxl)
	}

	.padding-top-xxxxl\@sm {
		padding-top: var(--space-xxxxl)
	}

	.padding-top-0\@sm {
		padding-top: 0
	}

	.padding-top-component\@sm {
		padding-top: var(--component-padding)
	}

	.padding-bottom-xxxxs\@sm {
		padding-bottom: var(--space-xxxxs)
	}

	.padding-bottom-xxxs\@sm {
		padding-bottom: var(--space-xxxs)
	}

	.padding-bottom-xxs\@sm {
		padding-bottom: var(--space-xxs)
	}

	.padding-bottom-xs\@sm {
		padding-bottom: var(--space-xs)
	}

	.padding-bottom-sm\@sm {
		padding-bottom: var(--space-sm)
	}

	.padding-bottom-md\@sm {
		padding-bottom: var(--space-md)
	}

	.padding-bottom-lg\@sm {
		padding-bottom: var(--space-lg)
	}

	.padding-bottom-xl\@sm {
		padding-bottom: var(--space-xl)
	}

	.padding-bottom-xxl\@sm {
		padding-bottom: var(--space-xxl)
	}

	.padding-bottom-xxxl\@sm {
		padding-bottom: var(--space-xxxl)
	}

	.padding-bottom-xxxxl\@sm {
		padding-bottom: var(--space-xxxxl)
	}

	.padding-bottom-0\@sm {
		padding-bottom: 0
	}

	.padding-bottom-component\@sm {
		padding-bottom: var(--component-padding)
	}

	.padding-right-xxxxs\@sm {
		padding-right: var(--space-xxxxs)
	}

	.padding-right-xxxs\@sm {
		padding-right: var(--space-xxxs)
	}

	.padding-right-xxs\@sm {
		padding-right: var(--space-xxs)
	}

	.padding-right-xs\@sm {
		padding-right: var(--space-xs)
	}

	.padding-right-sm\@sm {
		padding-right: var(--space-sm)
	}

	.padding-right-md\@sm {
		padding-right: var(--space-md)
	}

	.padding-right-lg\@sm {
		padding-right: var(--space-lg)
	}

	.padding-right-xl\@sm {
		padding-right: var(--space-xl)
	}

	.padding-right-xxl\@sm {
		padding-right: var(--space-xxl)
	}

	.padding-right-xxxl\@sm {
		padding-right: var(--space-xxxl)
	}

	.padding-right-xxxxl\@sm {
		padding-right: var(--space-xxxxl)
	}

	.padding-right-0\@sm {
		padding-right: 0
	}

	.padding-right-component\@sm {
		padding-right: var(--component-padding)
	}

	.padding-left-xxxxs\@sm {
		padding-left: var(--space-xxxxs)
	}

	.padding-left-xxxs\@sm {
		padding-left: var(--space-xxxs)
	}

	.padding-left-xxs\@sm {
		padding-left: var(--space-xxs)
	}

	.padding-left-xs\@sm {
		padding-left: var(--space-xs)
	}

	.padding-left-sm\@sm {
		padding-left: var(--space-sm)
	}

	.padding-left-md\@sm {
		padding-left: var(--space-md)
	}

	.padding-left-lg\@sm {
		padding-left: var(--space-lg)
	}

	.padding-left-xl\@sm {
		padding-left: var(--space-xl)
	}

	.padding-left-xxl\@sm {
		padding-left: var(--space-xxl)
	}

	.padding-left-xxxl\@sm {
		padding-left: var(--space-xxxl)
	}

	.padding-left-xxxxl\@sm {
		padding-left: var(--space-xxxxl)
	}

	.padding-left-0\@sm {
		padding-left: 0
	}

	.padding-left-component\@sm {
		padding-left: var(--component-padding)
	}

	.padding-x-xxxxs\@sm {
		padding-left: var(--space-xxxxs);
		padding-right: var(--space-xxxxs)
	}

	.padding-x-xxxs\@sm {
		padding-left: var(--space-xxxs);
		padding-right: var(--space-xxxs)
	}

	.padding-x-xxs\@sm {
		padding-left: var(--space-xxs);
		padding-right: var(--space-xxs)
	}

	.padding-x-xs\@sm {
		padding-left: var(--space-xs);
		padding-right: var(--space-xs)
	}

	.padding-x-sm\@sm {
		padding-left: var(--space-sm);
		padding-right: var(--space-sm)
	}

	.padding-x-md\@sm {
		padding-left: var(--space-md);
		padding-right: var(--space-md)
	}

	.padding-x-lg\@sm {
		padding-left: var(--space-lg);
		padding-right: var(--space-lg)
	}

	.padding-x-xl\@sm {
		padding-left: var(--space-xl);
		padding-right: var(--space-xl)
	}

	.padding-x-xxl\@sm {
		padding-left: var(--space-xxl);
		padding-right: var(--space-xxl)
	}

	.padding-x-xxxl\@sm {
		padding-left: var(--space-xxxl);
		padding-right: var(--space-xxxl)
	}

	.padding-x-xxxxl\@sm {
		padding-left: var(--space-xxxxl);
		padding-right: var(--space-xxxxl)
	}

	.padding-x-0\@sm {
		padding-left: 0;
		padding-right: 0
	}

	.padding-x-component\@sm {
		padding-left: var(--component-padding);
		padding-right: var(--component-padding)
	}

	.padding-y-xxxxs\@sm {
		padding-top: var(--space-xxxxs);
		padding-bottom: var(--space-xxxxs)
	}

	.padding-y-xxxs\@sm {
		padding-top: var(--space-xxxs);
		padding-bottom: var(--space-xxxs)
	}

	.padding-y-xxs\@sm {
		padding-top: var(--space-xxs);
		padding-bottom: var(--space-xxs)
	}

	.padding-y-xs\@sm {
		padding-top: var(--space-xs);
		padding-bottom: var(--space-xs)
	}

	.padding-y-sm\@sm {
		padding-top: var(--space-sm);
		padding-bottom: var(--space-sm)
	}

	.padding-y-md\@sm {
		padding-top: var(--space-md);
		padding-bottom: var(--space-md)
	}

	.padding-y-lg\@sm {
		padding-top: var(--space-lg);
		padding-bottom: var(--space-lg)
	}

	.padding-y-xl\@sm {
		padding-top: var(--space-xl);
		padding-bottom: var(--space-xl)
	}

	.padding-y-xxl\@sm {
		padding-top: var(--space-xxl);
		padding-bottom: var(--space-xxl)
	}

	.padding-y-xxxl\@sm {
		padding-top: var(--space-xxxl);
		padding-bottom: var(--space-xxxl)
	}

	.padding-y-xxxxl\@sm {
		padding-top: var(--space-xxxxl);
		padding-bottom: var(--space-xxxxl)
	}

	.padding-y-0\@sm {
		padding-top: 0;
		padding-bottom: 0
	}

	.padding-y-component\@sm {
		padding-top: var(--component-padding);
		padding-bottom: var(--component-padding)
	}

	.text-center\@sm {
		text-align: center
	}

	.text-left\@sm {
		text-align: left
	}

	.text-right\@sm {
		text-align: right
	}

	.text-justify\@sm {
		text-align: justify
	}

	.text-xs\@sm {
		font-size: var(--text-xs,.6875rem)
	}

	.text-sm\@sm {
		font-size: var(--text-sm,.75rem)
	}

	.text-base\@sm {
		font-size: var(--text-unit,1rem)
	}

	.text-md\@sm {
		font-size: var(--text-md,1.125rem)
	}

	.text-lg\@sm {
		font-size: var(--text-lg,1.375rem)
	}

	.text-xl\@sm {
		font-size: var(--text-xl,1.75rem)
	}

	.text-xxl\@sm {
		font-size: var(--text-xxl,2rem)
	}

	.text-xxxl\@sm {
		font-size: var(--text-xxxl,2.5rem)
	}

	.text-xxxxl\@sm {
		font-size: var(--text-xxxxl,3rem)
	}

	.column-count-1\@sm {
		-moz-column-count: 1;
		column-count: 1
	}

	.column-count-2\@sm {
		-moz-column-count: 2;
		column-count: 2
	}

	.column-count-3\@sm {
		-moz-column-count: 3;
		column-count: 3
	}

	.column-count-4\@sm {
		-moz-column-count: 4;
		column-count: 4
	}

	.width-xxxxs\@sm {
		width: var(--size-xxxxs,.25rem)
	}

	.width-xxxs\@sm {
		width: var(--size-xxxs,.5rem)
	}

	.width-xxs\@sm {
		width: var(--size-xxs,.75rem)
	}

	.width-xs\@sm {
		width: var(--size-xs,1rem)
	}

	.width-sm\@sm {
		width: var(--size-sm,1.5rem)
	}

	.width-md\@sm {
		width: var(--size-md,2rem)
	}

	.width-lg\@sm {
		width: var(--size-lg,3rem)
	}

	.width-xl\@sm {
		width: var(--size-xl,4rem)
	}

	.width-xxl\@sm {
		width: var(--size-xxl,6rem)
	}

	.width-xxxl\@sm {
		width: var(--size-xxxl,8rem)
	}

	.width-xxxxl\@sm {
		width: var(--size-xxxxl,16rem)
	}

	.width-0\@sm {
		width: 0
	}

	.width-10\%\@sm {
		width: 10%
	}

	.width-20\%\@sm {
		width: 20%
	}

	.width-25\%\@sm {
		width: 25%
	}

	.width-30\%\@sm {
		width: 30%
	}

	.width-33\%\@sm {
		width: 33.3333333333%
	}

	.width-40\%\@sm {
		width: 40%
	}

	.width-50\%\@sm {
		width: 50%
	}

	.width-60\%\@sm {
		width: 60%
	}

	.width-66\%\@sm {
		width: 66.6666666667%
	}

	.width-70\%\@sm {
		width: 70%
	}

	.width-75\%\@sm {
		width: 75%
	}

	.width-80\%\@sm {
		width: 80%
	}

	.width-90\%\@sm {
		width: 90%
	}

	.width-100\%\@sm {
		width: 100%
	}

	.width-100vw\@sm {
		width: 100vw
	}

	.width-auto\@sm {
		width: auto
	}

	.width-inherit\@sm {
		width: inherit
	}

	.height-xxxxs\@sm {
		height: var(--size-xxxxs,.25rem)
	}

	.height-xxxs\@sm {
		height: var(--size-xxxs,.5rem)
	}

	.height-xxs\@sm {
		height: var(--size-xxs,.75rem)
	}

	.height-xs\@sm {
		height: var(--size-xs,1rem)
	}

	.height-sm\@sm {
		height: var(--size-sm,1.5rem)
	}

	.height-md\@sm {
		height: var(--size-md,2rem)
	}

	.height-lg\@sm {
		height: var(--size-lg,3rem)
	}

	.height-xl\@sm {
		height: var(--size-xl,4rem)
	}

	.height-xxl\@sm {
		height: var(--size-xxl,6rem)
	}

	.height-xxxl\@sm {
		height: var(--size-xxxl,8rem)
	}

	.height-xxxxl\@sm {
		height: var(--size-xxxxl,16rem)
	}

	.height-0\@sm {
		height: 0
	}

	.height-10\%\@sm {
		height: 10%
	}

	.height-20\%\@sm {
		height: 20%
	}

	.height-25\%\@sm {
		height: 25%
	}

	.height-30\%\@sm {
		height: 30%
	}

	.height-33\%\@sm {
		height: 33.3333333333%
	}

	.height-40\%\@sm {
		height: 40%
	}

	.height-50\%\@sm {
		height: 50%
	}

	.height-60\%\@sm {
		height: 60%
	}

	.height-66\%\@sm {
		height: 66.6666666667%
	}

	.height-70\%\@sm {
		height: 70%
	}

	.height-75\%\@sm {
		height: 75%
	}

	.height-80\%\@sm {
		height: 80%
	}

	.height-90\%\@sm {
		height: 90%
	}

	.height-100\%\@sm {
		height: 100%
	}

	.height-100vh\@sm {
		height: 100vh
	}

	.height-auto\@sm {
		height: auto
	}

	.height-inherit\@sm {
		height: inherit
	}

	.max-width-xxxxxs\@sm {
		max-width: var(--max-width-xxxxxs)
	}

	.max-width-xxxxs\@sm {
		max-width: var(--max-width-xxxxs)
	}

	.max-width-xxxs\@sm {
		max-width: var(--max-width-xxxs)
	}

	.max-width-xxs\@sm {
		max-width: var(--max-width-xxs)
	}

	.max-width-xs\@sm {
		max-width: var(--max-width-xs)
	}

	.max-width-sm\@sm {
		max-width: var(--max-width-sm)
	}

	.max-width-md\@sm {
		max-width: var(--max-width-md)
	}

	.max-width-lg\@sm {
		max-width: var(--max-width-lg)
	}

	.max-width-xl\@sm {
		max-width: var(--max-width-xl)
	}

	.max-width-xxl\@sm {
		max-width: var(--max-width-xxl)
	}

	.max-width-xxxl\@sm {
		max-width: var(--max-width-xxxl)
	}

	.max-width-xxxxl\@sm {
		max-width: var(--max-width-xxxxl)
	}

	.max-width-100\%\@sm {
		max-width: 100%
	}

	.max-width-none\@sm {
		max-width: none
	}

	.position-relative\@sm {
		position: relative
	}

	.position-absolute\@sm {
		position: absolute
	}

	.position-fixed\@sm {
		position: fixed
	}

	.position-sticky\@sm {
		position: -webkit-sticky;
		position: sticky
	}

	.position-static\@sm {
		position: static
	}

	.inset-0\@sm {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0
	}

	.top-0\@sm {
		top: 0
	}

	.top-50\%\@sm {
		top: 50%
	}

	.top-xxxxs\@sm {
		top: var(--space-xxxxs)
	}

	.top-xxxs\@sm {
		top: var(--space-xxxs)
	}

	.top-xxs\@sm {
		top: var(--space-xxs)
	}

	.top-xs\@sm {
		top: var(--space-xs)
	}

	.top-sm\@sm {
		top: var(--space-sm)
	}

	.top-md\@sm {
		top: var(--space-md)
	}

	.top-lg\@sm {
		top: var(--space-lg)
	}

	.top-xl\@sm {
		top: var(--space-xl)
	}

	.top-xxl\@sm {
		top: var(--space-xxl)
	}

	.top-xxxl\@sm {
		top: var(--space-xxxl)
	}

	.top-xxxxl\@sm {
		top: var(--space-xxxxl)
	}

	.bottom-0\@sm {
		bottom: 0
	}

	.bottom-50\%\@sm {
		bottom: 50%
	}

	.bottom-xxxxs\@sm {
		bottom: var(--space-xxxxs)
	}

	.bottom-xxxs\@sm {
		bottom: var(--space-xxxs)
	}

	.bottom-xxs\@sm {
		bottom: var(--space-xxs)
	}

	.bottom-xs\@sm {
		bottom: var(--space-xs)
	}

	.bottom-sm\@sm {
		bottom: var(--space-sm)
	}

	.bottom-md\@sm {
		bottom: var(--space-md)
	}

	.bottom-lg\@sm {
		bottom: var(--space-lg)
	}

	.bottom-xl\@sm {
		bottom: var(--space-xl)
	}

	.bottom-xxl\@sm {
		bottom: var(--space-xxl)
	}

	.bottom-xxxl\@sm {
		bottom: var(--space-xxxl)
	}

	.bottom-xxxxl\@sm {
		bottom: var(--space-xxxxl)
	}

	.right-0\@sm {
		right: 0
	}

	.right-50\%\@sm {
		right: 50%
	}

	.right-xxxxs\@sm {
		right: var(--space-xxxxs)
	}

	.right-xxxs\@sm {
		right: var(--space-xxxs)
	}

	.right-xxs\@sm {
		right: var(--space-xxs)
	}

	.right-xs\@sm {
		right: var(--space-xs)
	}

	.right-sm\@sm {
		right: var(--space-sm)
	}

	.right-md\@sm {
		right: var(--space-md)
	}

	.right-lg\@sm {
		right: var(--space-lg)
	}

	.right-xl\@sm {
		right: var(--space-xl)
	}

	.right-xxl\@sm {
		right: var(--space-xxl)
	}

	.right-xxxl\@sm {
		right: var(--space-xxxl)
	}

	.right-xxxxl\@sm {
		right: var(--space-xxxxl)
	}

	.left-0\@sm {
		left: 0
	}

	.left-50\%\@sm {
		left: 50%
	}

	.left-xxxxs\@sm {
		left: var(--space-xxxxs)
	}

	.left-xxxs\@sm {
		left: var(--space-xxxs)
	}

	.left-xxs\@sm {
		left: var(--space-xxs)
	}

	.left-xs\@sm {
		left: var(--space-xs)
	}

	.left-sm\@sm {
		left: var(--space-sm)
	}

	.left-md\@sm {
		left: var(--space-md)
	}

	.left-lg\@sm {
		left: var(--space-lg)
	}

	.left-xl\@sm {
		left: var(--space-xl)
	}

	.left-xxl\@sm {
		left: var(--space-xxl)
	}

	.left-xxxl\@sm {
		left: var(--space-xxxl)
	}

	.left-xxxxl\@sm {
		left: var(--space-xxxxl)
	}

	.overflow-hidden\@sm {
		overflow: hidden
	}

	.overflow-auto\@sm {
		overflow: auto
	}

	.momentum-scrolling\@sm {
		-webkit-overflow-scrolling: touch
	}

	.overscroll-contain\@sm {
		overscroll-behavior: contain
	}

	.visible\@sm {
		visibility: visible
	}

	.invisible\@sm {
		visibility: hidden
	}
}

@media not all and (min-width: 48rem) {
	.display\@sm {
		display:none!important
	}
}

@media (min-width: 64rem) {
	.flex\@md {
		display:flex
	}

	.inline-flex\@md {
		display: inline-flex
	}

	.flex-wrap\@md {
		flex-wrap: wrap
	}

	.flex-nowrap\@md {
		flex-wrap: nowrap
	}

	.flex-column\@md {
		flex-direction: column
	}

	.flex-column-reverse\@md {
		flex-direction: column-reverse
	}

	.flex-row\@md {
		flex-direction: row
	}

	.flex-row-reverse\@md {
		flex-direction: row-reverse
	}

	.flex-center\@md {
		justify-content: center;
		align-items: center
	}

	.flex-grow\@md {
		flex-grow: 1
	}

	.flex-grow-0\@md {
		flex-grow: 0
	}

	.flex-shrink\@md {
		flex-shrink: 1
	}

	.flex-shrink-0\@md {
		flex-shrink: 0
	}

	.flex-basis-0\@md {
		flex-basis: 0
	}

	.justify-start\@md {
		justify-content: flex-start
	}

	.justify-end\@md {
		justify-content: flex-end
	}

	.justify-center\@md {
		justify-content: center
	}

	.justify-between\@md {
		justify-content: space-between
	}

	.items-center\@md {
		align-items: center
	}

	.items-start\@md {
		align-items: flex-start
	}

	.items-end\@md {
		align-items: flex-end
	}

	.items-baseline\@md {
		align-items: baseline
	}

	.items-stretch\@md {
		align-items: stretch
	}

	.content-start\@md {
		align-content: start
	}

	.content-end\@md {
		align-content: end
	}

	.content-center\@md {
		align-content: center
	}

	.content-between\@md {
		align-content: space-between
	}

	.order-1\@md {
		order: 1
	}

	.order-2\@md {
		order: 2
	}

	.order-3\@md {
		order: 3
	}

	.block\@md {
		display: block
	}

	.inline-block\@md {
		display: inline-block
	}

	.inline\@md {
		display: inline
	}

	.contents\@md {
		display: contents
	}

	.css-grid\@md {
		display: grid
	}

	.css-inline-grid\@md {
		display: inline-grid
	}

	.hide\@md {
		display: none!important
	}

	.margin-xxxxs\@md {
		margin: var(--space-xxxxs)
	}

	.margin-xxxs\@md {
		margin: var(--space-xxxs)
	}

	.margin-xxs\@md {
		margin: var(--space-xxs)
	}

	.margin-xs\@md {
		margin: var(--space-xs)
	}

	.margin-sm\@md {
		margin: var(--space-sm)
	}

	.margin-md\@md {
		margin: var(--space-md)
	}

	.margin-lg\@md {
		margin: var(--space-lg)
	}

	.margin-xl\@md {
		margin: var(--space-xl)
	}

	.margin-xxl\@md {
		margin: var(--space-xxl)
	}

	.margin-xxxl\@md {
		margin: var(--space-xxxl)
	}

	.margin-xxxxl\@md {
		margin: var(--space-xxxxl)
	}

	.margin-auto\@md {
		margin: auto
	}

	.margin-0\@md {
		margin: 0
	}

	.margin-top-xxxxs\@md {
		margin-top: var(--space-xxxxs)
	}

	.margin-top-xxxs\@md {
		margin-top: var(--space-xxxs)
	}

	.margin-top-xxs\@md {
		margin-top: var(--space-xxs)
	}

	.margin-top-xs\@md {
		margin-top: var(--space-xs)
	}

	.margin-top-sm\@md {
		margin-top: var(--space-sm)
	}

	.margin-top-md\@md {
		margin-top: var(--space-md)
	}

	.margin-top-lg\@md {
		margin-top: var(--space-lg)
	}

	.margin-top-xl\@md {
		margin-top: var(--space-xl)
	}

	.margin-top-xxl\@md {
		margin-top: var(--space-xxl)
	}

	.margin-top-xxxl\@md {
		margin-top: var(--space-xxxl)
	}

	.margin-top-xxxxl\@md {
		margin-top: var(--space-xxxxl)
	}

	.margin-top-auto\@md {
		margin-top: auto
	}

	.margin-top-0\@md {
		margin-top: 0
	}

	.margin-bottom-xxxxs\@md {
		margin-bottom: var(--space-xxxxs)
	}

	.margin-bottom-xxxs\@md {
		margin-bottom: var(--space-xxxs)
	}

	.margin-bottom-xxs\@md {
		margin-bottom: var(--space-xxs)
	}

	.margin-bottom-xs\@md {
		margin-bottom: var(--space-xs)
	}

	.margin-bottom-sm\@md {
		margin-bottom: var(--space-sm)
	}

	.margin-bottom-md\@md {
		margin-bottom: var(--space-md)
	}

	.margin-bottom-lg\@md {
		margin-bottom: var(--space-lg)
	}

	.margin-bottom-xl\@md {
		margin-bottom: var(--space-xl)
	}

	.margin-bottom-xxl\@md {
		margin-bottom: var(--space-xxl)
	}

	.margin-bottom-xxxl\@md {
		margin-bottom: var(--space-xxxl)
	}

	.margin-bottom-xxxxl\@md {
		margin-bottom: var(--space-xxxxl)
	}

	.margin-bottom-auto\@md {
		margin-bottom: auto
	}

	.margin-bottom-0\@md {
		margin-bottom: 0
	}

	.margin-right-xxxxs\@md {
		margin-right: var(--space-xxxxs)
	}

	.margin-right-xxxs\@md {
		margin-right: var(--space-xxxs)
	}

	.margin-right-xxs\@md {
		margin-right: var(--space-xxs)
	}

	.margin-right-xs\@md {
		margin-right: var(--space-xs)
	}

	.margin-right-sm\@md {
		margin-right: var(--space-sm)
	}

	.margin-right-md\@md {
		margin-right: var(--space-md)
	}

	.margin-right-lg\@md {
		margin-right: var(--space-lg)
	}

	.margin-right-xl\@md {
		margin-right: var(--space-xl)
	}

	.margin-right-xxl\@md {
		margin-right: var(--space-xxl)
	}

	.margin-right-xxxl\@md {
		margin-right: var(--space-xxxl)
	}

	.margin-right-xxxxl\@md {
		margin-right: var(--space-xxxxl)
	}

	.margin-right-auto\@md {
		margin-right: auto
	}

	.margin-right-0\@md {
		margin-right: 0
	}

	.margin-left-xxxxs\@md {
		margin-left: var(--space-xxxxs)
	}

	.margin-left-xxxs\@md {
		margin-left: var(--space-xxxs)
	}

	.margin-left-xxs\@md {
		margin-left: var(--space-xxs)
	}

	.margin-left-xs\@md {
		margin-left: var(--space-xs)
	}

	.margin-left-sm\@md {
		margin-left: var(--space-sm)
	}

	.margin-left-md\@md {
		margin-left: var(--space-md)
	}

	.margin-left-lg\@md {
		margin-left: var(--space-lg)
	}

	.margin-left-xl\@md {
		margin-left: var(--space-xl)
	}

	.margin-left-xxl\@md {
		margin-left: var(--space-xxl)
	}

	.margin-left-xxxl\@md {
		margin-left: var(--space-xxxl)
	}

	.margin-left-xxxxl\@md {
		margin-left: var(--space-xxxxl)
	}

	.margin-left-auto\@md {
		margin-left: auto
	}

	.margin-left-0\@md {
		margin-left: 0
	}

	.margin-x-xxxxs\@md {
		margin-left: var(--space-xxxxs);
		margin-right: var(--space-xxxxs)
	}

	.margin-x-xxxs\@md {
		margin-left: var(--space-xxxs);
		margin-right: var(--space-xxxs)
	}

	.margin-x-xxs\@md {
		margin-left: var(--space-xxs);
		margin-right: var(--space-xxs)
	}

	.margin-x-xs\@md {
		margin-left: var(--space-xs);
		margin-right: var(--space-xs)
	}

	.margin-x-sm\@md {
		margin-left: var(--space-sm);
		margin-right: var(--space-sm)
	}

	.margin-x-md\@md {
		margin-left: var(--space-md);
		margin-right: var(--space-md)
	}

	.margin-x-lg\@md {
		margin-left: var(--space-lg);
		margin-right: var(--space-lg)
	}

	.margin-x-xl\@md {
		margin-left: var(--space-xl);
		margin-right: var(--space-xl)
	}

	.margin-x-xxl\@md {
		margin-left: var(--space-xxl);
		margin-right: var(--space-xxl)
	}

	.margin-x-xxxl\@md {
		margin-left: var(--space-xxxl);
		margin-right: var(--space-xxxl)
	}

	.margin-x-xxxxl\@md {
		margin-left: var(--space-xxxxl);
		margin-right: var(--space-xxxxl)
	}

	.margin-x-auto\@md {
		margin-left: auto;
		margin-right: auto
	}

	.margin-x-0\@md {
		margin-left: 0;
		margin-right: 0
	}

	.margin-y-xxxxs\@md {
		margin-top: var(--space-xxxxs);
		margin-bottom: var(--space-xxxxs)
	}

	.margin-y-xxxs\@md {
		margin-top: var(--space-xxxs);
		margin-bottom: var(--space-xxxs)
	}

	.margin-y-xxs\@md {
		margin-top: var(--space-xxs);
		margin-bottom: var(--space-xxs)
	}

	.margin-y-xs\@md {
		margin-top: var(--space-xs);
		margin-bottom: var(--space-xs)
	}

	.margin-y-sm\@md {
		margin-top: var(--space-sm);
		margin-bottom: var(--space-sm)
	}

	.margin-y-md\@md {
		margin-top: var(--space-md);
		margin-bottom: var(--space-md)
	}

	.margin-y-lg\@md {
		margin-top: var(--space-lg);
		margin-bottom: var(--space-lg)
	}

	.margin-y-xl\@md {
		margin-top: var(--space-xl);
		margin-bottom: var(--space-xl)
	}

	.margin-y-xxl\@md {
		margin-top: var(--space-xxl);
		margin-bottom: var(--space-xxl)
	}

	.margin-y-xxxl\@md {
		margin-top: var(--space-xxxl);
		margin-bottom: var(--space-xxxl)
	}

	.margin-y-xxxxl\@md {
		margin-top: var(--space-xxxxl);
		margin-bottom: var(--space-xxxxl)
	}

	.margin-y-auto\@md {
		margin-top: auto;
		margin-bottom: auto
	}

	.margin-y-0\@md {
		margin-top: 0;
		margin-bottom: 0
	}

	.padding-xxxxs\@md {
		padding: var(--space-xxxxs)
	}

	.padding-xxxs\@md {
		padding: var(--space-xxxs)
	}

	.padding-xxs\@md {
		padding: var(--space-xxs)
	}

	.padding-xs\@md {
		padding: var(--space-xs)
	}

	.padding-sm\@md {
		padding: var(--space-sm)
	}

	.padding-md\@md {
		padding: var(--space-md)
	}

	.padding-lg\@md {
		padding: var(--space-lg)
	}

	.padding-xl\@md {
		padding: var(--space-xl)
	}

	.padding-xxl\@md {
		padding: var(--space-xxl)
	}

	.padding-xxxl\@md {
		padding: var(--space-xxxl)
	}

	.padding-xxxxl\@md {
		padding: var(--space-xxxxl)
	}

	.padding-0\@md {
		padding: 0
	}

	.padding-component\@md {
		padding: var(--component-padding)
	}

	.padding-top-xxxxs\@md {
		padding-top: var(--space-xxxxs)
	}

	.padding-top-xxxs\@md {
		padding-top: var(--space-xxxs)
	}

	.padding-top-xxs\@md {
		padding-top: var(--space-xxs)
	}

	.padding-top-xs\@md {
		padding-top: var(--space-xs)
	}

	.padding-top-sm\@md {
		padding-top: var(--space-sm)
	}

	.padding-top-md\@md {
		padding-top: var(--space-md)
	}

	.padding-top-lg\@md {
		padding-top: var(--space-lg)
	}

	.padding-top-xl\@md {
		padding-top: var(--space-xl)
	}

	.padding-top-xxl\@md {
		padding-top: var(--space-xxl)
	}

	.padding-top-xxxl\@md {
		padding-top: var(--space-xxxl)
	}

	.padding-top-xxxxl\@md {
		padding-top: var(--space-xxxxl)
	}

	.padding-top-0\@md {
		padding-top: 0
	}

	.padding-top-component\@md {
		padding-top: var(--component-padding)
	}

	.padding-bottom-xxxxs\@md {
		padding-bottom: var(--space-xxxxs)
	}

	.padding-bottom-xxxs\@md {
		padding-bottom: var(--space-xxxs)
	}

	.padding-bottom-xxs\@md {
		padding-bottom: var(--space-xxs)
	}

	.padding-bottom-xs\@md {
		padding-bottom: var(--space-xs)
	}

	.padding-bottom-sm\@md {
		padding-bottom: var(--space-sm)
	}

	.padding-bottom-md\@md {
		padding-bottom: var(--space-md)
	}

	.padding-bottom-lg\@md {
		padding-bottom: var(--space-lg)
	}

	.padding-bottom-xl\@md {
		padding-bottom: var(--space-xl)
	}

	.padding-bottom-xxl\@md {
		padding-bottom: var(--space-xxl)
	}

	.padding-bottom-xxxl\@md {
		padding-bottom: var(--space-xxxl)
	}

	.padding-bottom-xxxxl\@md {
		padding-bottom: var(--space-xxxxl)
	}

	.padding-bottom-0\@md {
		padding-bottom: 0
	}

	.padding-bottom-component\@md {
		padding-bottom: var(--component-padding)
	}

	.padding-right-xxxxs\@md {
		padding-right: var(--space-xxxxs)
	}

	.padding-right-xxxs\@md {
		padding-right: var(--space-xxxs)
	}

	.padding-right-xxs\@md {
		padding-right: var(--space-xxs)
	}

	.padding-right-xs\@md {
		padding-right: var(--space-xs)
	}

	.padding-right-sm\@md {
		padding-right: var(--space-sm)
	}

	.padding-right-md\@md {
		padding-right: var(--space-md)
	}

	.padding-right-lg\@md {
		padding-right: var(--space-lg)
	}

	.padding-right-xl\@md {
		padding-right: var(--space-xl)
	}

	.padding-right-xxl\@md {
		padding-right: var(--space-xxl)
	}

	.padding-right-xxxl\@md {
		padding-right: var(--space-xxxl)
	}

	.padding-right-xxxxl\@md {
		padding-right: var(--space-xxxxl)
	}

	.padding-right-0\@md {
		padding-right: 0
	}

	.padding-right-component\@md {
		padding-right: var(--component-padding)
	}

	.padding-left-xxxxs\@md {
		padding-left: var(--space-xxxxs)
	}

	.padding-left-xxxs\@md {
		padding-left: var(--space-xxxs)
	}

	.padding-left-xxs\@md {
		padding-left: var(--space-xxs)
	}

	.padding-left-xs\@md {
		padding-left: var(--space-xs)
	}

	.padding-left-sm\@md {
		padding-left: var(--space-sm)
	}

	.padding-left-md\@md {
		padding-left: var(--space-md)
	}

	.padding-left-lg\@md {
		padding-left: var(--space-lg)
	}

	.padding-left-xl\@md {
		padding-left: var(--space-xl)
	}

	.padding-left-xxl\@md {
		padding-left: var(--space-xxl)
	}

	.padding-left-xxxl\@md {
		padding-left: var(--space-xxxl)
	}

	.padding-left-xxxxl\@md {
		padding-left: var(--space-xxxxl)
	}

	.padding-left-0\@md {
		padding-left: 0
	}

	.padding-left-component\@md {
		padding-left: var(--component-padding)
	}

	.padding-x-xxxxs\@md {
		padding-left: var(--space-xxxxs);
		padding-right: var(--space-xxxxs)
	}

	.padding-x-xxxs\@md {
		padding-left: var(--space-xxxs);
		padding-right: var(--space-xxxs)
	}

	.padding-x-xxs\@md {
		padding-left: var(--space-xxs);
		padding-right: var(--space-xxs)
	}

	.padding-x-xs\@md {
		padding-left: var(--space-xs);
		padding-right: var(--space-xs)
	}

	.padding-x-sm\@md {
		padding-left: var(--space-sm);
		padding-right: var(--space-sm)
	}

	.padding-x-md\@md {
		padding-left: var(--space-md);
		padding-right: var(--space-md)
	}

	.padding-x-lg\@md {
		padding-left: var(--space-lg);
		padding-right: var(--space-lg)
	}

	.padding-x-xl\@md {
		padding-left: var(--space-xl);
		padding-right: var(--space-xl)
	}

	.padding-x-xxl\@md {
		padding-left: var(--space-xxl);
		padding-right: var(--space-xxl)
	}

	.padding-x-xxxl\@md {
		padding-left: var(--space-xxxl);
		padding-right: var(--space-xxxl)
	}

	.padding-x-xxxxl\@md {
		padding-left: var(--space-xxxxl);
		padding-right: var(--space-xxxxl)
	}

	.padding-x-0\@md {
		padding-left: 0;
		padding-right: 0
	}

	.padding-x-component\@md {
		padding-left: var(--component-padding);
		padding-right: var(--component-padding)
	}

	.padding-y-xxxxs\@md {
		padding-top: var(--space-xxxxs);
		padding-bottom: var(--space-xxxxs)
	}

	.padding-y-xxxs\@md {
		padding-top: var(--space-xxxs);
		padding-bottom: var(--space-xxxs)
	}

	.padding-y-xxs\@md {
		padding-top: var(--space-xxs);
		padding-bottom: var(--space-xxs)
	}

	.padding-y-xs\@md {
		padding-top: var(--space-xs);
		padding-bottom: var(--space-xs)
	}

	.padding-y-sm\@md {
		padding-top: var(--space-sm);
		padding-bottom: var(--space-sm)
	}

	.padding-y-md\@md {
		padding-top: var(--space-md);
		padding-bottom: var(--space-md)
	}

	.padding-y-lg\@md {
		padding-top: var(--space-lg);
		padding-bottom: var(--space-lg)
	}

	.padding-y-xl\@md {
		padding-top: var(--space-xl);
		padding-bottom: var(--space-xl)
	}

	.padding-y-xxl\@md {
		padding-top: var(--space-xxl);
		padding-bottom: var(--space-xxl)
	}

	.padding-y-xxxl\@md {
		padding-top: var(--space-xxxl);
		padding-bottom: var(--space-xxxl)
	}

	.padding-y-xxxxl\@md {
		padding-top: var(--space-xxxxl);
		padding-bottom: var(--space-xxxxl)
	}

	.padding-y-0\@md {
		padding-top: 0;
		padding-bottom: 0
	}

	.padding-y-component\@md {
		padding-top: var(--component-padding);
		padding-bottom: var(--component-padding)
	}

	.text-center\@md {
		text-align: center
	}

	.text-left\@md {
		text-align: left
	}

	.text-right\@md {
		text-align: right
	}

	.text-justify\@md {
		text-align: justify
	}

	.text-xs\@md {
		font-size: var(--text-xs,.6875rem)
	}

	.text-sm\@md {
		font-size: var(--text-sm,.75rem)
	}

	.text-base\@md {
		font-size: var(--text-unit,1rem)
	}

	.text-md\@md {
		font-size: var(--text-md,1.125rem)
	}

	.text-lg\@md {
		font-size: var(--text-lg,1.375rem)
	}

	.text-xl\@md {
		font-size: var(--text-xl,1.75rem)
	}

	.text-xxl\@md {
		font-size: var(--text-xxl,2rem)
	}

	.text-xxxl\@md {
		font-size: var(--text-xxxl,2.5rem)
	}

	.text-xxxxl\@md {
		font-size: var(--text-xxxxl,3rem)
	}

	.column-count-1\@md {
		-moz-column-count: 1;
		column-count: 1
	}

	.column-count-2\@md {
		-moz-column-count: 2;
		column-count: 2
	}

	.column-count-3\@md {
		-moz-column-count: 3;
		column-count: 3
	}

	.column-count-4\@md {
		-moz-column-count: 4;
		column-count: 4
	}

	.width-xxxxs\@md {
		width: var(--size-xxxxs,.25rem)
	}

	.width-xxxs\@md {
		width: var(--size-xxxs,.5rem)
	}

	.width-xxs\@md {
		width: var(--size-xxs,.75rem)
	}

	.width-xs\@md {
		width: var(--size-xs,1rem)
	}

	.width-sm\@md {
		width: var(--size-sm,1.5rem)
	}

	.width-md\@md {
		width: var(--size-md,2rem)
	}

	.width-lg\@md {
		width: var(--size-lg,3rem)
	}

	.width-xl\@md {
		width: var(--size-xl,4rem)
	}

	.width-xxl\@md {
		width: var(--size-xxl,6rem)
	}

	.width-xxxl\@md {
		width: var(--size-xxxl,8rem)
	}

	.width-xxxxl\@md {
		width: var(--size-xxxxl,16rem)
	}

	.width-0\@md {
		width: 0
	}

	.width-10\%\@md {
		width: 10%
	}

	.width-20\%\@md {
		width: 20%
	}

	.width-25\%\@md {
		width: 25%
	}

	.width-30\%\@md {
		width: 30%
	}

	.width-33\%\@md {
		width: 33.3333333333%
	}

	.width-40\%\@md {
		width: 40%
	}

	.width-50\%\@md {
		width: 50%
	}

	.width-60\%\@md {
		width: 60%
	}

	.width-66\%\@md {
		width: 66.6666666667%
	}

	.width-70\%\@md {
		width: 70%
	}

	.width-75\%\@md {
		width: 75%
	}

	.width-80\%\@md {
		width: 80%
	}

	.width-90\%\@md {
		width: 90%
	}

	.width-100\%\@md {
		width: 100%
	}

	.width-100vw\@md {
		width: 100vw
	}

	.width-auto\@md {
		width: auto
	}

	.width-inherit\@md {
		width: inherit
	}

	.height-xxxxs\@md {
		height: var(--size-xxxxs,.25rem)
	}

	.height-xxxs\@md {
		height: var(--size-xxxs,.5rem)
	}

	.height-xxs\@md {
		height: var(--size-xxs,.75rem)
	}

	.height-xs\@md {
		height: var(--size-xs,1rem)
	}

	.height-sm\@md {
		height: var(--size-sm,1.5rem)
	}

	.height-md\@md {
		height: var(--size-md,2rem)
	}

	.height-lg\@md {
		height: var(--size-lg,3rem)
	}

	.height-xl\@md {
		height: var(--size-xl,4rem)
	}

	.height-xxl\@md {
		height: var(--size-xxl,6rem)
	}

	.height-xxxl\@md {
		height: var(--size-xxxl,8rem)
	}

	.height-xxxxl\@md {
		height: var(--size-xxxxl,16rem)
	}

	.height-0\@md {
		height: 0
	}

	.height-10\%\@md {
		height: 10%
	}

	.height-20\%\@md {
		height: 20%
	}

	.height-25\%\@md {
		height: 25%
	}

	.height-30\%\@md {
		height: 30%
	}

	.height-33\%\@md {
		height: 33.3333333333%
	}

	.height-40\%\@md {
		height: 40%
	}

	.height-50\%\@md {
		height: 50%
	}

	.height-60\%\@md {
		height: 60%
	}

	.height-66\%\@md {
		height: 66.6666666667%
	}

	.height-70\%\@md {
		height: 70%
	}

	.height-75\%\@md {
		height: 75%
	}

	.height-80\%\@md {
		height: 80%
	}

	.height-90\%\@md {
		height: 90%
	}

	.height-100\%\@md {
		height: 100%
	}

	.height-100vh\@md {
		height: 100vh
	}

	.height-auto\@md {
		height: auto
	}

	.height-inherit\@md {
		height: inherit
	}

	.max-width-xxxxxs\@md {
		max-width: var(--max-width-xxxxxs)
	}

	.max-width-xxxxs\@md {
		max-width: var(--max-width-xxxxs)
	}

	.max-width-xxxs\@md {
		max-width: var(--max-width-xxxs)
	}

	.max-width-xxs\@md {
		max-width: var(--max-width-xxs)
	}

	.max-width-xs\@md {
		max-width: var(--max-width-xs)
	}

	.max-width-sm\@md {
		max-width: var(--max-width-sm)
	}

	.max-width-md\@md {
		max-width: var(--max-width-md)
	}

	.max-width-lg\@md {
		max-width: var(--max-width-lg)
	}

	.max-width-xl\@md {
		max-width: var(--max-width-xl)
	}

	.max-width-xxl\@md {
		max-width: var(--max-width-xxl)
	}

	.max-width-xxxl\@md {
		max-width: var(--max-width-xxxl)
	}

	.max-width-xxxxl\@md {
		max-width: var(--max-width-xxxxl)
	}

	.max-width-100\%\@md {
		max-width: 100%
	}

	.max-width-none\@md {
		max-width: none
	}

	.position-relative\@md {
		position: relative
	}

	.position-absolute\@md {
		position: absolute
	}

	.position-fixed\@md {
		position: fixed
	}

	.position-sticky\@md {
		position: -webkit-sticky;
		position: sticky
	}

	.position-static\@md {
		position: static
	}

	.inset-0\@md {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0
	}

	.top-0\@md {
		top: 0
	}

	.top-50\%\@md {
		top: 50%
	}

	.top-xxxxs\@md {
		top: var(--space-xxxxs)
	}

	.top-xxxs\@md {
		top: var(--space-xxxs)
	}

	.top-xxs\@md {
		top: var(--space-xxs)
	}

	.top-xs\@md {
		top: var(--space-xs)
	}

	.top-sm\@md {
		top: var(--space-sm)
	}

	.top-md\@md {
		top: var(--space-md)
	}

	.top-lg\@md {
		top: var(--space-lg)
	}

	.top-xl\@md {
		top: var(--space-xl)
	}

	.top-xxl\@md {
		top: var(--space-xxl)
	}

	.top-xxxl\@md {
		top: var(--space-xxxl)
	}

	.top-xxxxl\@md {
		top: var(--space-xxxxl)
	}

	.bottom-0\@md {
		bottom: 0
	}

	.bottom-50\%\@md {
		bottom: 50%
	}

	.bottom-xxxxs\@md {
		bottom: var(--space-xxxxs)
	}

	.bottom-xxxs\@md {
		bottom: var(--space-xxxs)
	}

	.bottom-xxs\@md {
		bottom: var(--space-xxs)
	}

	.bottom-xs\@md {
		bottom: var(--space-xs)
	}

	.bottom-sm\@md {
		bottom: var(--space-sm)
	}

	.bottom-md\@md {
		bottom: var(--space-md)
	}

	.bottom-lg\@md {
		bottom: var(--space-lg)
	}

	.bottom-xl\@md {
		bottom: var(--space-xl)
	}

	.bottom-xxl\@md {
		bottom: var(--space-xxl)
	}

	.bottom-xxxl\@md {
		bottom: var(--space-xxxl)
	}

	.bottom-xxxxl\@md {
		bottom: var(--space-xxxxl)
	}

	.right-0\@md {
		right: 0
	}

	.right-50\%\@md {
		right: 50%
	}

	.right-xxxxs\@md {
		right: var(--space-xxxxs)
	}

	.right-xxxs\@md {
		right: var(--space-xxxs)
	}

	.right-xxs\@md {
		right: var(--space-xxs)
	}

	.right-xs\@md {
		right: var(--space-xs)
	}

	.right-sm\@md {
		right: var(--space-sm)
	}

	.right-md\@md {
		right: var(--space-md)
	}

	.right-lg\@md {
		right: var(--space-lg)
	}

	.right-xl\@md {
		right: var(--space-xl)
	}

	.right-xxl\@md {
		right: var(--space-xxl)
	}

	.right-xxxl\@md {
		right: var(--space-xxxl)
	}

	.right-xxxxl\@md {
		right: var(--space-xxxxl)
	}

	.left-0\@md {
		left: 0
	}

	.left-50\%\@md {
		left: 50%
	}

	.left-xxxxs\@md {
		left: var(--space-xxxxs)
	}

	.left-xxxs\@md {
		left: var(--space-xxxs)
	}

	.left-xxs\@md {
		left: var(--space-xxs)
	}

	.left-xs\@md {
		left: var(--space-xs)
	}

	.left-sm\@md {
		left: var(--space-sm)
	}

	.left-md\@md {
		left: var(--space-md)
	}

	.left-lg\@md {
		left: var(--space-lg)
	}

	.left-xl\@md {
		left: var(--space-xl)
	}

	.left-xxl\@md {
		left: var(--space-xxl)
	}

	.left-xxxl\@md {
		left: var(--space-xxxl)
	}

	.left-xxxxl\@md {
		left: var(--space-xxxxl)
	}

	.overflow-hidden\@md {
		overflow: hidden
	}

	.overflow-auto\@md {
		overflow: auto
	}

	.momentum-scrolling\@md {
		-webkit-overflow-scrolling: touch
	}

	.overscroll-contain\@md {
		overscroll-behavior: contain
	}

	.visible\@md {
		visibility: visible
	}

	.invisible\@md {
		visibility: hidden
	}
}

@media not all and (min-width: 64rem) {
	.display\@md {
		display:none!important
	}
}

@media (min-width: 80rem) {
	.flex\@lg {
		display:flex
	}

	.inline-flex\@lg {
		display: inline-flex
	}

	.flex-wrap\@lg {
		flex-wrap: wrap
	}

	.flex-nowrap\@lg {
		flex-wrap: nowrap
	}

	.flex-column\@lg {
		flex-direction: column
	}

	.flex-column-reverse\@lg {
		flex-direction: column-reverse
	}

	.flex-row\@lg {
		flex-direction: row
	}

	.flex-row-reverse\@lg {
		flex-direction: row-reverse
	}

	.flex-center\@lg {
		justify-content: center;
		align-items: center
	}

	.flex-grow\@lg {
		flex-grow: 1
	}

	.flex-grow-0\@lg {
		flex-grow: 0
	}

	.flex-shrink\@lg {
		flex-shrink: 1
	}

	.flex-shrink-0\@lg {
		flex-shrink: 0
	}

	.flex-basis-0\@lg {
		flex-basis: 0
	}

	.justify-start\@lg {
		justify-content: flex-start
	}

	.justify-end\@lg {
		justify-content: flex-end
	}

	.justify-center\@lg {
		justify-content: center
	}

	.justify-between\@lg {
		justify-content: space-between
	}

	.items-center\@lg {
		align-items: center
	}

	.items-start\@lg {
		align-items: flex-start
	}

	.items-end\@lg {
		align-items: flex-end
	}

	.items-baseline\@lg {
		align-items: baseline
	}

	.items-stretch\@lg {
		align-items: stretch
	}

	.content-start\@lg {
		align-content: start
	}

	.content-end\@lg {
		align-content: end
	}

	.content-center\@lg {
		align-content: center
	}

	.content-between\@lg {
		align-content: space-between
	}

	.order-1\@lg {
		order: 1
	}

	.order-2\@lg {
		order: 2
	}

	.order-3\@lg {
		order: 3
	}

	.block\@lg {
		display: block
	}

	.inline-block\@lg {
		display: inline-block
	}

	.inline\@lg {
		display: inline
	}

	.contents\@lg {
		display: contents
	}

	.css-grid\@lg {
		display: grid
	}

	.css-inline-grid\@lg {
		display: inline-grid
	}

	.hide\@lg {
		display: none!important
	}

	.margin-xxxxs\@lg {
		margin: var(--space-xxxxs)
	}

	.margin-xxxs\@lg {
		margin: var(--space-xxxs)
	}

	.margin-xxs\@lg {
		margin: var(--space-xxs)
	}

	.margin-xs\@lg {
		margin: var(--space-xs)
	}

	.margin-sm\@lg {
		margin: var(--space-sm)
	}

	.margin-md\@lg {
		margin: var(--space-md)
	}

	.margin-lg\@lg {
		margin: var(--space-lg)
	}

	.margin-xl\@lg {
		margin: var(--space-xl)
	}

	.margin-xxl\@lg {
		margin: var(--space-xxl)
	}

	.margin-xxxl\@lg {
		margin: var(--space-xxxl)
	}

	.margin-xxxxl\@lg {
		margin: var(--space-xxxxl)
	}

	.margin-auto\@lg {
		margin: auto
	}

	.margin-0\@lg {
		margin: 0
	}

	.margin-top-xxxxs\@lg {
		margin-top: var(--space-xxxxs)
	}

	.margin-top-xxxs\@lg {
		margin-top: var(--space-xxxs)
	}

	.margin-top-xxs\@lg {
		margin-top: var(--space-xxs)
	}

	.margin-top-xs\@lg {
		margin-top: var(--space-xs)
	}

	.margin-top-sm\@lg {
		margin-top: var(--space-sm)
	}

	.margin-top-md\@lg {
		margin-top: var(--space-md)
	}

	.margin-top-lg\@lg {
		margin-top: var(--space-lg)
	}

	.margin-top-xl\@lg {
		margin-top: var(--space-xl)
	}

	.margin-top-xxl\@lg {
		margin-top: var(--space-xxl)
	}

	.margin-top-xxxl\@lg {
		margin-top: var(--space-xxxl)
	}

	.margin-top-xxxxl\@lg {
		margin-top: var(--space-xxxxl)
	}

	.margin-top-auto\@lg {
		margin-top: auto
	}

	.margin-top-0\@lg {
		margin-top: 0
	}

	.margin-bottom-xxxxs\@lg {
		margin-bottom: var(--space-xxxxs)
	}

	.margin-bottom-xxxs\@lg {
		margin-bottom: var(--space-xxxs)
	}

	.margin-bottom-xxs\@lg {
		margin-bottom: var(--space-xxs)
	}

	.margin-bottom-xs\@lg {
		margin-bottom: var(--space-xs)
	}

	.margin-bottom-sm\@lg {
		margin-bottom: var(--space-sm)
	}

	.margin-bottom-md\@lg {
		margin-bottom: var(--space-md)
	}

	.margin-bottom-lg\@lg {
		margin-bottom: var(--space-lg)
	}

	.margin-bottom-xl\@lg {
		margin-bottom: var(--space-xl)
	}

	.margin-bottom-xxl\@lg {
		margin-bottom: var(--space-xxl)
	}

	.margin-bottom-xxxl\@lg {
		margin-bottom: var(--space-xxxl)
	}

	.margin-bottom-xxxxl\@lg {
		margin-bottom: var(--space-xxxxl)
	}

	.margin-bottom-auto\@lg {
		margin-bottom: auto
	}

	.margin-bottom-0\@lg {
		margin-bottom: 0
	}

	.margin-right-xxxxs\@lg {
		margin-right: var(--space-xxxxs)
	}

	.margin-right-xxxs\@lg {
		margin-right: var(--space-xxxs)
	}

	.margin-right-xxs\@lg {
		margin-right: var(--space-xxs)
	}

	.margin-right-xs\@lg {
		margin-right: var(--space-xs)
	}

	.margin-right-sm\@lg {
		margin-right: var(--space-sm)
	}

	.margin-right-md\@lg {
		margin-right: var(--space-md)
	}

	.margin-right-lg\@lg {
		margin-right: var(--space-lg)
	}

	.margin-right-xl\@lg {
		margin-right: var(--space-xl)
	}

	.margin-right-xxl\@lg {
		margin-right: var(--space-xxl)
	}

	.margin-right-xxxl\@lg {
		margin-right: var(--space-xxxl)
	}

	.margin-right-xxxxl\@lg {
		margin-right: var(--space-xxxxl)
	}

	.margin-right-auto\@lg {
		margin-right: auto
	}

	.margin-right-0\@lg {
		margin-right: 0
	}

	.margin-left-xxxxs\@lg {
		margin-left: var(--space-xxxxs)
	}

	.margin-left-xxxs\@lg {
		margin-left: var(--space-xxxs)
	}

	.margin-left-xxs\@lg {
		margin-left: var(--space-xxs)
	}

	.margin-left-xs\@lg {
		margin-left: var(--space-xs)
	}

	.margin-left-sm\@lg {
		margin-left: var(--space-sm)
	}

	.margin-left-md\@lg {
		margin-left: var(--space-md)
	}

	.margin-left-lg\@lg {
		margin-left: var(--space-lg)
	}

	.margin-left-xl\@lg {
		margin-left: var(--space-xl)
	}

	.margin-left-xxl\@lg {
		margin-left: var(--space-xxl)
	}

	.margin-left-xxxl\@lg {
		margin-left: var(--space-xxxl)
	}

	.margin-left-xxxxl\@lg {
		margin-left: var(--space-xxxxl)
	}

	.margin-left-auto\@lg {
		margin-left: auto
	}

	.margin-left-0\@lg {
		margin-left: 0
	}

	.margin-x-xxxxs\@lg {
		margin-left: var(--space-xxxxs);
		margin-right: var(--space-xxxxs)
	}

	.margin-x-xxxs\@lg {
		margin-left: var(--space-xxxs);
		margin-right: var(--space-xxxs)
	}

	.margin-x-xxs\@lg {
		margin-left: var(--space-xxs);
		margin-right: var(--space-xxs)
	}

	.margin-x-xs\@lg {
		margin-left: var(--space-xs);
		margin-right: var(--space-xs)
	}

	.margin-x-sm\@lg {
		margin-left: var(--space-sm);
		margin-right: var(--space-sm)
	}

	.margin-x-md\@lg {
		margin-left: var(--space-md);
		margin-right: var(--space-md)
	}

	.margin-x-lg\@lg {
		margin-left: var(--space-lg);
		margin-right: var(--space-lg)
	}

	.margin-x-xl\@lg {
		margin-left: var(--space-xl);
		margin-right: var(--space-xl)
	}

	.margin-x-xxl\@lg {
		margin-left: var(--space-xxl);
		margin-right: var(--space-xxl)
	}

	.margin-x-xxxl\@lg {
		margin-left: var(--space-xxxl);
		margin-right: var(--space-xxxl)
	}

	.margin-x-xxxxl\@lg {
		margin-left: var(--space-xxxxl);
		margin-right: var(--space-xxxxl)
	}

	.margin-x-auto\@lg {
		margin-left: auto;
		margin-right: auto
	}

	.margin-x-0\@lg {
		margin-left: 0;
		margin-right: 0
	}

	.margin-y-xxxxs\@lg {
		margin-top: var(--space-xxxxs);
		margin-bottom: var(--space-xxxxs)
	}

	.margin-y-xxxs\@lg {
		margin-top: var(--space-xxxs);
		margin-bottom: var(--space-xxxs)
	}

	.margin-y-xxs\@lg {
		margin-top: var(--space-xxs);
		margin-bottom: var(--space-xxs)
	}

	.margin-y-xs\@lg {
		margin-top: var(--space-xs);
		margin-bottom: var(--space-xs)
	}

	.margin-y-sm\@lg {
		margin-top: var(--space-sm);
		margin-bottom: var(--space-sm)
	}

	.margin-y-md\@lg {
		margin-top: var(--space-md);
		margin-bottom: var(--space-md)
	}

	.margin-y-lg\@lg {
		margin-top: var(--space-lg);
		margin-bottom: var(--space-lg)
	}

	.margin-y-xl\@lg {
		margin-top: var(--space-xl);
		margin-bottom: var(--space-xl)
	}

	.margin-y-xxl\@lg {
		margin-top: var(--space-xxl);
		margin-bottom: var(--space-xxl)
	}

	.margin-y-xxxl\@lg {
		margin-top: var(--space-xxxl);
		margin-bottom: var(--space-xxxl)
	}

	.margin-y-xxxxl\@lg {
		margin-top: var(--space-xxxxl);
		margin-bottom: var(--space-xxxxl)
	}

	.margin-y-auto\@lg {
		margin-top: auto;
		margin-bottom: auto
	}

	.margin-y-0\@lg {
		margin-top: 0;
		margin-bottom: 0
	}

	.padding-xxxxs\@lg {
		padding: var(--space-xxxxs)
	}

	.padding-xxxs\@lg {
		padding: var(--space-xxxs)
	}

	.padding-xxs\@lg {
		padding: var(--space-xxs)
	}

	.padding-xs\@lg {
		padding: var(--space-xs)
	}

	.padding-sm\@lg {
		padding: var(--space-sm)
	}

	.padding-md\@lg {
		padding: var(--space-md)
	}

	.padding-lg\@lg {
		padding: var(--space-lg)
	}

	.padding-xl\@lg {
		padding: var(--space-xl)
	}

	.padding-xxl\@lg {
		padding: var(--space-xxl)
	}

	.padding-xxxl\@lg {
		padding: var(--space-xxxl)
	}

	.padding-xxxxl\@lg {
		padding: var(--space-xxxxl)
	}

	.padding-0\@lg {
		padding: 0
	}

	.padding-component\@lg {
		padding: var(--component-padding)
	}

	.padding-top-xxxxs\@lg {
		padding-top: var(--space-xxxxs)
	}

	.padding-top-xxxs\@lg {
		padding-top: var(--space-xxxs)
	}

	.padding-top-xxs\@lg {
		padding-top: var(--space-xxs)
	}

	.padding-top-xs\@lg {
		padding-top: var(--space-xs)
	}

	.padding-top-sm\@lg {
		padding-top: var(--space-sm)
	}

	.padding-top-md\@lg {
		padding-top: var(--space-md)
	}

	.padding-top-lg\@lg {
		padding-top: var(--space-lg)
	}

	.padding-top-xl\@lg {
		padding-top: var(--space-xl)
	}

	.padding-top-xxl\@lg {
		padding-top: var(--space-xxl)
	}

	.padding-top-xxxl\@lg {
		padding-top: var(--space-xxxl)
	}

	.padding-top-xxxxl\@lg {
		padding-top: var(--space-xxxxl)
	}

	.padding-top-0\@lg {
		padding-top: 0
	}

	.padding-top-component\@lg {
		padding-top: var(--component-padding)
	}

	.padding-bottom-xxxxs\@lg {
		padding-bottom: var(--space-xxxxs)
	}

	.padding-bottom-xxxs\@lg {
		padding-bottom: var(--space-xxxs)
	}

	.padding-bottom-xxs\@lg {
		padding-bottom: var(--space-xxs)
	}

	.padding-bottom-xs\@lg {
		padding-bottom: var(--space-xs)
	}

	.padding-bottom-sm\@lg {
		padding-bottom: var(--space-sm)
	}

	.padding-bottom-md\@lg {
		padding-bottom: var(--space-md)
	}

	.padding-bottom-lg\@lg {
		padding-bottom: var(--space-lg)
	}

	.padding-bottom-xl\@lg {
		padding-bottom: var(--space-xl)
	}

	.padding-bottom-xxl\@lg {
		padding-bottom: var(--space-xxl)
	}

	.padding-bottom-xxxl\@lg {
		padding-bottom: var(--space-xxxl)
	}

	.padding-bottom-xxxxl\@lg {
		padding-bottom: var(--space-xxxxl)
	}

	.padding-bottom-0\@lg {
		padding-bottom: 0
	}

	.padding-bottom-component\@lg {
		padding-bottom: var(--component-padding)
	}

	.padding-right-xxxxs\@lg {
		padding-right: var(--space-xxxxs)
	}

	.padding-right-xxxs\@lg {
		padding-right: var(--space-xxxs)
	}

	.padding-right-xxs\@lg {
		padding-right: var(--space-xxs)
	}

	.padding-right-xs\@lg {
		padding-right: var(--space-xs)
	}

	.padding-right-sm\@lg {
		padding-right: var(--space-sm)
	}

	.padding-right-md\@lg {
		padding-right: var(--space-md)
	}

	.padding-right-lg\@lg {
		padding-right: var(--space-lg)
	}

	.padding-right-xl\@lg {
		padding-right: var(--space-xl)
	}

	.padding-right-xxl\@lg {
		padding-right: var(--space-xxl)
	}

	.padding-right-xxxl\@lg {
		padding-right: var(--space-xxxl)
	}

	.padding-right-xxxxl\@lg {
		padding-right: var(--space-xxxxl)
	}

	.padding-right-0\@lg {
		padding-right: 0
	}

	.padding-right-component\@lg {
		padding-right: var(--component-padding)
	}

	.padding-left-xxxxs\@lg {
		padding-left: var(--space-xxxxs)
	}

	.padding-left-xxxs\@lg {
		padding-left: var(--space-xxxs)
	}

	.padding-left-xxs\@lg {
		padding-left: var(--space-xxs)
	}

	.padding-left-xs\@lg {
		padding-left: var(--space-xs)
	}

	.padding-left-sm\@lg {
		padding-left: var(--space-sm)
	}

	.padding-left-md\@lg {
		padding-left: var(--space-md)
	}

	.padding-left-lg\@lg {
		padding-left: var(--space-lg)
	}

	.padding-left-xl\@lg {
		padding-left: var(--space-xl)
	}

	.padding-left-xxl\@lg {
		padding-left: var(--space-xxl)
	}

	.padding-left-xxxl\@lg {
		padding-left: var(--space-xxxl)
	}

	.padding-left-xxxxl\@lg {
		padding-left: var(--space-xxxxl)
	}

	.padding-left-0\@lg {
		padding-left: 0
	}

	.padding-left-component\@lg {
		padding-left: var(--component-padding)
	}

	.padding-x-xxxxs\@lg {
		padding-left: var(--space-xxxxs);
		padding-right: var(--space-xxxxs)
	}

	.padding-x-xxxs\@lg {
		padding-left: var(--space-xxxs);
		padding-right: var(--space-xxxs)
	}

	.padding-x-xxs\@lg {
		padding-left: var(--space-xxs);
		padding-right: var(--space-xxs)
	}

	.padding-x-xs\@lg {
		padding-left: var(--space-xs);
		padding-right: var(--space-xs)
	}

	.padding-x-sm\@lg {
		padding-left: var(--space-sm);
		padding-right: var(--space-sm)
	}

	.padding-x-md\@lg {
		padding-left: var(--space-md);
		padding-right: var(--space-md)
	}

	.padding-x-lg\@lg {
		padding-left: var(--space-lg);
		padding-right: var(--space-lg)
	}

	.padding-x-xl\@lg {
		padding-left: var(--space-xl);
		padding-right: var(--space-xl)
	}

	.padding-x-xxl\@lg {
		padding-left: var(--space-xxl);
		padding-right: var(--space-xxl)
	}

	.padding-x-xxxl\@lg {
		padding-left: var(--space-xxxl);
		padding-right: var(--space-xxxl)
	}

	.padding-x-xxxxl\@lg {
		padding-left: var(--space-xxxxl);
		padding-right: var(--space-xxxxl)
	}

	.padding-x-0\@lg {
		padding-left: 0;
		padding-right: 0
	}

	.padding-x-component\@lg {
		padding-left: var(--component-padding);
		padding-right: var(--component-padding)
	}

	.padding-y-xxxxs\@lg {
		padding-top: var(--space-xxxxs);
		padding-bottom: var(--space-xxxxs)
	}

	.padding-y-xxxs\@lg {
		padding-top: var(--space-xxxs);
		padding-bottom: var(--space-xxxs)
	}

	.padding-y-xxs\@lg {
		padding-top: var(--space-xxs);
		padding-bottom: var(--space-xxs)
	}

	.padding-y-xs\@lg {
		padding-top: var(--space-xs);
		padding-bottom: var(--space-xs)
	}

	.padding-y-sm\@lg {
		padding-top: var(--space-sm);
		padding-bottom: var(--space-sm)
	}

	.padding-y-md\@lg {
		padding-top: var(--space-md);
		padding-bottom: var(--space-md)
	}

	.padding-y-lg\@lg {
		padding-top: var(--space-lg);
		padding-bottom: var(--space-lg)
	}

	.padding-y-xl\@lg {
		padding-top: var(--space-xl);
		padding-bottom: var(--space-xl)
	}

	.padding-y-xxl\@lg {
		padding-top: var(--space-xxl);
		padding-bottom: var(--space-xxl)
	}

	.padding-y-xxxl\@lg {
		padding-top: var(--space-xxxl);
		padding-bottom: var(--space-xxxl)
	}

	.padding-y-xxxxl\@lg {
		padding-top: var(--space-xxxxl);
		padding-bottom: var(--space-xxxxl)
	}

	.padding-y-0\@lg {
		padding-top: 0;
		padding-bottom: 0
	}

	.padding-y-component\@lg {
		padding-top: var(--component-padding);
		padding-bottom: var(--component-padding)
	}

	.text-center\@lg {
		text-align: center
	}

	.text-left\@lg {
		text-align: left
	}

	.text-right\@lg {
		text-align: right
	}

	.text-justify\@lg {
		text-align: justify
	}

	.text-xs\@lg {
		font-size: var(--text-xs,.6875rem)
	}

	.text-sm\@lg {
		font-size: var(--text-sm,.75rem)
	}

	.text-base\@lg {
		font-size: var(--text-unit,1rem)
	}

	.text-md\@lg {
		font-size: var(--text-md,1.125rem)
	}

	.text-lg\@lg {
		font-size: var(--text-lg,1.375rem)
	}

	.text-xl\@lg {
		font-size: var(--text-xl,1.75rem)
	}

	.text-xxl\@lg {
		font-size: var(--text-xxl,2rem)
	}

	.text-xxxl\@lg {
		font-size: var(--text-xxxl,2.5rem)
	}

	.text-xxxxl\@lg {
		font-size: var(--text-xxxxl,3rem)
	}

	.column-count-1\@lg {
		-moz-column-count: 1;
		column-count: 1
	}

	.column-count-2\@lg {
		-moz-column-count: 2;
		column-count: 2
	}

	.column-count-3\@lg {
		-moz-column-count: 3;
		column-count: 3
	}

	.column-count-4\@lg {
		-moz-column-count: 4;
		column-count: 4
	}

	.width-xxxxs\@lg {
		width: var(--size-xxxxs,.25rem)
	}

	.width-xxxs\@lg {
		width: var(--size-xxxs,.5rem)
	}

	.width-xxs\@lg {
		width: var(--size-xxs,.75rem)
	}

	.width-xs\@lg {
		width: var(--size-xs,1rem)
	}

	.width-sm\@lg {
		width: var(--size-sm,1.5rem)
	}

	.width-md\@lg {
		width: var(--size-md,2rem)
	}

	.width-lg\@lg {
		width: var(--size-lg,3rem)
	}

	.width-xl\@lg {
		width: var(--size-xl,4rem)
	}

	.width-xxl\@lg {
		width: var(--size-xxl,6rem)
	}

	.width-xxxl\@lg {
		width: var(--size-xxxl,8rem)
	}

	.width-xxxxl\@lg {
		width: var(--size-xxxxl,16rem)
	}

	.width-0\@lg {
		width: 0
	}

	.width-10\%\@lg {
		width: 10%
	}

	.width-20\%\@lg {
		width: 20%
	}

	.width-25\%\@lg {
		width: 25%
	}

	.width-30\%\@lg {
		width: 30%
	}

	.width-33\%\@lg {
		width: 33.3333333333%
	}

	.width-40\%\@lg {
		width: 40%
	}

	.width-50\%\@lg {
		width: 50%
	}

	.width-60\%\@lg {
		width: 60%
	}

	.width-66\%\@lg {
		width: 66.6666666667%
	}

	.width-70\%\@lg {
		width: 70%
	}

	.width-75\%\@lg {
		width: 75%
	}

	.width-80\%\@lg {
		width: 80%
	}

	.width-90\%\@lg {
		width: 90%
	}

	.width-100\%\@lg {
		width: 100%
	}

	.width-100vw\@lg {
		width: 100vw
	}

	.width-auto\@lg {
		width: auto
	}

	.width-inherit\@lg {
		width: inherit
	}

	.height-xxxxs\@lg {
		height: var(--size-xxxxs,.25rem)
	}

	.height-xxxs\@lg {
		height: var(--size-xxxs,.5rem)
	}

	.height-xxs\@lg {
		height: var(--size-xxs,.75rem)
	}

	.height-xs\@lg {
		height: var(--size-xs,1rem)
	}

	.height-sm\@lg {
		height: var(--size-sm,1.5rem)
	}

	.height-md\@lg {
		height: var(--size-md,2rem)
	}

	.height-lg\@lg {
		height: var(--size-lg,3rem)
	}

	.height-xl\@lg {
		height: var(--size-xl,4rem)
	}

	.height-xxl\@lg {
		height: var(--size-xxl,6rem)
	}

	.height-xxxl\@lg {
		height: var(--size-xxxl,8rem)
	}

	.height-xxxxl\@lg {
		height: var(--size-xxxxl,16rem)
	}

	.height-0\@lg {
		height: 0
	}

	.height-10\%\@lg {
		height: 10%
	}

	.height-20\%\@lg {
		height: 20%
	}

	.height-25\%\@lg {
		height: 25%
	}

	.height-30\%\@lg {
		height: 30%
	}

	.height-33\%\@lg {
		height: 33.3333333333%
	}

	.height-40\%\@lg {
		height: 40%
	}

	.height-50\%\@lg {
		height: 50%
	}

	.height-60\%\@lg {
		height: 60%
	}

	.height-66\%\@lg {
		height: 66.6666666667%
	}

	.height-70\%\@lg {
		height: 70%
	}

	.height-75\%\@lg {
		height: 75%
	}

	.height-80\%\@lg {
		height: 80%
	}

	.height-90\%\@lg {
		height: 90%
	}

	.height-100\%\@lg {
		height: 100%
	}

	.height-100vh\@lg {
		height: 100vh
	}

	.height-auto\@lg {
		height: auto
	}

	.height-inherit\@lg {
		height: inherit
	}

	.max-width-xxxxxs\@lg {
		max-width: var(--max-width-xxxxxs)
	}

	.max-width-xxxxs\@lg {
		max-width: var(--max-width-xxxxs)
	}

	.max-width-xxxs\@lg {
		max-width: var(--max-width-xxxs)
	}

	.max-width-xxs\@lg {
		max-width: var(--max-width-xxs)
	}

	.max-width-xs\@lg {
		max-width: var(--max-width-xs)
	}

	.max-width-sm\@lg {
		max-width: var(--max-width-sm)
	}

	.max-width-md\@lg {
		max-width: var(--max-width-md)
	}

	.max-width-lg\@lg {
		max-width: var(--max-width-lg)
	}

	.max-width-xl\@lg {
		max-width: var(--max-width-xl)
	}

	.max-width-xxl\@lg {
		max-width: var(--max-width-xxl)
	}

	.max-width-xxxl\@lg {
		max-width: var(--max-width-xxxl)
	}

	.max-width-xxxxl\@lg {
		max-width: var(--max-width-xxxxl)
	}

	.max-width-100\%\@lg {
		max-width: 100%
	}

	.max-width-none\@lg {
		max-width: none
	}

	.position-relative\@lg {
		position: relative
	}

	.position-absolute\@lg {
		position: absolute
	}

	.position-fixed\@lg {
		position: fixed
	}

	.position-sticky\@lg {
		position: -webkit-sticky;
		position: sticky
	}

	.position-static\@lg {
		position: static
	}

	.inset-0\@lg {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0
	}

	.top-0\@lg {
		top: 0
	}

	.top-50\%\@lg {
		top: 50%
	}

	.top-xxxxs\@lg {
		top: var(--space-xxxxs)
	}

	.top-xxxs\@lg {
		top: var(--space-xxxs)
	}

	.top-xxs\@lg {
		top: var(--space-xxs)
	}

	.top-xs\@lg {
		top: var(--space-xs)
	}

	.top-sm\@lg {
		top: var(--space-sm)
	}

	.top-md\@lg {
		top: var(--space-md)
	}

	.top-lg\@lg {
		top: var(--space-lg)
	}

	.top-xl\@lg {
		top: var(--space-xl)
	}

	.top-xxl\@lg {
		top: var(--space-xxl)
	}

	.top-xxxl\@lg {
		top: var(--space-xxxl)
	}

	.top-xxxxl\@lg {
		top: var(--space-xxxxl)
	}

	.bottom-0\@lg {
		bottom: 0
	}

	.bottom-50\%\@lg {
		bottom: 50%
	}

	.bottom-xxxxs\@lg {
		bottom: var(--space-xxxxs)
	}

	.bottom-xxxs\@lg {
		bottom: var(--space-xxxs)
	}

	.bottom-xxs\@lg {
		bottom: var(--space-xxs)
	}

	.bottom-xs\@lg {
		bottom: var(--space-xs)
	}

	.bottom-sm\@lg {
		bottom: var(--space-sm)
	}

	.bottom-md\@lg {
		bottom: var(--space-md)
	}

	.bottom-lg\@lg {
		bottom: var(--space-lg)
	}

	.bottom-xl\@lg {
		bottom: var(--space-xl)
	}

	.bottom-xxl\@lg {
		bottom: var(--space-xxl)
	}

	.bottom-xxxl\@lg {
		bottom: var(--space-xxxl)
	}

	.bottom-xxxxl\@lg {
		bottom: var(--space-xxxxl)
	}

	.right-0\@lg {
		right: 0
	}

	.right-50\%\@lg {
		right: 50%
	}

	.right-xxxxs\@lg {
		right: var(--space-xxxxs)
	}

	.right-xxxs\@lg {
		right: var(--space-xxxs)
	}

	.right-xxs\@lg {
		right: var(--space-xxs)
	}

	.right-xs\@lg {
		right: var(--space-xs)
	}

	.right-sm\@lg {
		right: var(--space-sm)
	}

	.right-md\@lg {
		right: var(--space-md)
	}

	.right-lg\@lg {
		right: var(--space-lg)
	}

	.right-xl\@lg {
		right: var(--space-xl)
	}

	.right-xxl\@lg {
		right: var(--space-xxl)
	}

	.right-xxxl\@lg {
		right: var(--space-xxxl)
	}

	.right-xxxxl\@lg {
		right: var(--space-xxxxl)
	}

	.left-0\@lg {
		left: 0
	}

	.left-50\%\@lg {
		left: 50%
	}

	.left-xxxxs\@lg {
		left: var(--space-xxxxs)
	}

	.left-xxxs\@lg {
		left: var(--space-xxxs)
	}

	.left-xxs\@lg {
		left: var(--space-xxs)
	}

	.left-xs\@lg {
		left: var(--space-xs)
	}

	.left-sm\@lg {
		left: var(--space-sm)
	}

	.left-md\@lg {
		left: var(--space-md)
	}

	.left-lg\@lg {
		left: var(--space-lg)
	}

	.left-xl\@lg {
		left: var(--space-xl)
	}

	.left-xxl\@lg {
		left: var(--space-xxl)
	}

	.left-xxxl\@lg {
		left: var(--space-xxxl)
	}

	.left-xxxxl\@lg {
		left: var(--space-xxxxl)
	}

	.overflow-hidden\@lg {
		overflow: hidden
	}

	.overflow-auto\@lg {
		overflow: auto
	}

	.momentum-scrolling\@lg {
		-webkit-overflow-scrolling: touch
	}

	.overscroll-contain\@lg {
		overscroll-behavior: contain
	}

	.visible\@lg {
		visibility: visible
	}

	.invisible\@lg {
		visibility: hidden
	}
}

@media not all and (min-width: 80rem) {
	.display\@lg {
		display:none!important
	}
}

@media (min-width: 90rem) {
	.flex\@xl {
		display:flex
	}

	.inline-flex\@xl {
		display: inline-flex
	}

	.flex-wrap\@xl {
		flex-wrap: wrap
	}

	.flex-nowrap\@xl {
		flex-wrap: nowrap
	}

	.flex-column\@xl {
		flex-direction: column
	}

	.flex-column-reverse\@xl {
		flex-direction: column-reverse
	}

	.flex-row\@xl {
		flex-direction: row
	}

	.flex-row-reverse\@xl {
		flex-direction: row-reverse
	}

	.flex-center\@xl {
		justify-content: center;
		align-items: center
	}

	.flex-grow\@xl {
		flex-grow: 1
	}

	.flex-grow-0\@xl {
		flex-grow: 0
	}

	.flex-shrink\@xl {
		flex-shrink: 1
	}

	.flex-shrink-0\@xl {
		flex-shrink: 0
	}

	.flex-basis-0\@xl {
		flex-basis: 0
	}

	.justify-start\@xl {
		justify-content: flex-start
	}

	.justify-end\@xl {
		justify-content: flex-end
	}

	.justify-center\@xl {
		justify-content: center
	}

	.justify-between\@xl {
		justify-content: space-between
	}

	.items-center\@xl {
		align-items: center
	}

	.items-start\@xl {
		align-items: flex-start
	}

	.items-end\@xl {
		align-items: flex-end
	}

	.items-baseline\@xl {
		align-items: baseline
	}

	.items-stretch\@xl {
		align-items: stretch
	}

	.content-start\@xl {
		align-content: start
	}

	.content-end\@xl {
		align-content: end
	}

	.content-center\@xl {
		align-content: center
	}

	.content-between\@xl {
		align-content: space-between
	}

	.order-1\@xl {
		order: 1
	}

	.order-2\@xl {
		order: 2
	}

	.order-3\@xl {
		order: 3
	}

	.block\@xl {
		display: block
	}

	.inline-block\@xl {
		display: inline-block
	}

	.inline\@xl {
		display: inline
	}

	.contents\@xl {
		display: contents
	}

	.css-grid\@xl {
		display: grid
	}

	.css-inline-grid\@xl {
		display: inline-grid
	}

	.hide\@xl {
		display: none!important
	}

	.margin-xxxxs\@xl {
		margin: var(--space-xxxxs)
	}

	.margin-xxxs\@xl {
		margin: var(--space-xxxs)
	}

	.margin-xxs\@xl {
		margin: var(--space-xxs)
	}

	.margin-xs\@xl {
		margin: var(--space-xs)
	}

	.margin-sm\@xl {
		margin: var(--space-sm)
	}

	.margin-md\@xl {
		margin: var(--space-md)
	}

	.margin-lg\@xl {
		margin: var(--space-lg)
	}

	.margin-xl\@xl {
		margin: var(--space-xl)
	}

	.margin-xxl\@xl {
		margin: var(--space-xxl)
	}

	.margin-xxxl\@xl {
		margin: var(--space-xxxl)
	}

	.margin-xxxxl\@xl {
		margin: var(--space-xxxxl)
	}

	.margin-auto\@xl {
		margin: auto
	}

	.margin-0\@xl {
		margin: 0
	}

	.margin-top-xxxxs\@xl {
		margin-top: var(--space-xxxxs)
	}

	.margin-top-xxxs\@xl {
		margin-top: var(--space-xxxs)
	}

	.margin-top-xxs\@xl {
		margin-top: var(--space-xxs)
	}

	.margin-top-xs\@xl {
		margin-top: var(--space-xs)
	}

	.margin-top-sm\@xl {
		margin-top: var(--space-sm)
	}

	.margin-top-md\@xl {
		margin-top: var(--space-md)
	}

	.margin-top-lg\@xl {
		margin-top: var(--space-lg)
	}

	.margin-top-xl\@xl {
		margin-top: var(--space-xl)
	}

	.margin-top-xxl\@xl {
		margin-top: var(--space-xxl)
	}

	.margin-top-xxxl\@xl {
		margin-top: var(--space-xxxl)
	}

	.margin-top-xxxxl\@xl {
		margin-top: var(--space-xxxxl)
	}

	.margin-top-auto\@xl {
		margin-top: auto
	}

	.margin-top-0\@xl {
		margin-top: 0
	}

	.margin-bottom-xxxxs\@xl {
		margin-bottom: var(--space-xxxxs)
	}

	.margin-bottom-xxxs\@xl {
		margin-bottom: var(--space-xxxs)
	}

	.margin-bottom-xxs\@xl {
		margin-bottom: var(--space-xxs)
	}

	.margin-bottom-xs\@xl {
		margin-bottom: var(--space-xs)
	}

	.margin-bottom-sm\@xl {
		margin-bottom: var(--space-sm)
	}

	.margin-bottom-md\@xl {
		margin-bottom: var(--space-md)
	}

	.margin-bottom-lg\@xl {
		margin-bottom: var(--space-lg)
	}

	.margin-bottom-xl\@xl {
		margin-bottom: var(--space-xl)
	}

	.margin-bottom-xxl\@xl {
		margin-bottom: var(--space-xxl)
	}

	.margin-bottom-xxxl\@xl {
		margin-bottom: var(--space-xxxl)
	}

	.margin-bottom-xxxxl\@xl {
		margin-bottom: var(--space-xxxxl)
	}

	.margin-bottom-auto\@xl {
		margin-bottom: auto
	}

	.margin-bottom-0\@xl {
		margin-bottom: 0
	}

	.margin-right-xxxxs\@xl {
		margin-right: var(--space-xxxxs)
	}

	.margin-right-xxxs\@xl {
		margin-right: var(--space-xxxs)
	}

	.margin-right-xxs\@xl {
		margin-right: var(--space-xxs)
	}

	.margin-right-xs\@xl {
		margin-right: var(--space-xs)
	}

	.margin-right-sm\@xl {
		margin-right: var(--space-sm)
	}

	.margin-right-md\@xl {
		margin-right: var(--space-md)
	}

	.margin-right-lg\@xl {
		margin-right: var(--space-lg)
	}

	.margin-right-xl\@xl {
		margin-right: var(--space-xl)
	}

	.margin-right-xxl\@xl {
		margin-right: var(--space-xxl)
	}

	.margin-right-xxxl\@xl {
		margin-right: var(--space-xxxl)
	}

	.margin-right-xxxxl\@xl {
		margin-right: var(--space-xxxxl)
	}

	.margin-right-auto\@xl {
		margin-right: auto
	}

	.margin-right-0\@xl {
		margin-right: 0
	}

	.margin-left-xxxxs\@xl {
		margin-left: var(--space-xxxxs)
	}

	.margin-left-xxxs\@xl {
		margin-left: var(--space-xxxs)
	}

	.margin-left-xxs\@xl {
		margin-left: var(--space-xxs)
	}

	.margin-left-xs\@xl {
		margin-left: var(--space-xs)
	}

	.margin-left-sm\@xl {
		margin-left: var(--space-sm)
	}

	.margin-left-md\@xl {
		margin-left: var(--space-md)
	}

	.margin-left-lg\@xl {
		margin-left: var(--space-lg)
	}

	.margin-left-xl\@xl {
		margin-left: var(--space-xl)
	}

	.margin-left-xxl\@xl {
		margin-left: var(--space-xxl)
	}

	.margin-left-xxxl\@xl {
		margin-left: var(--space-xxxl)
	}

	.margin-left-xxxxl\@xl {
		margin-left: var(--space-xxxxl)
	}

	.margin-left-auto\@xl {
		margin-left: auto
	}

	.margin-left-0\@xl {
		margin-left: 0
	}

	.margin-x-xxxxs\@xl {
		margin-left: var(--space-xxxxs);
		margin-right: var(--space-xxxxs)
	}

	.margin-x-xxxs\@xl {
		margin-left: var(--space-xxxs);
		margin-right: var(--space-xxxs)
	}

	.margin-x-xxs\@xl {
		margin-left: var(--space-xxs);
		margin-right: var(--space-xxs)
	}

	.margin-x-xs\@xl {
		margin-left: var(--space-xs);
		margin-right: var(--space-xs)
	}

	.margin-x-sm\@xl {
		margin-left: var(--space-sm);
		margin-right: var(--space-sm)
	}

	.margin-x-md\@xl {
		margin-left: var(--space-md);
		margin-right: var(--space-md)
	}

	.margin-x-lg\@xl {
		margin-left: var(--space-lg);
		margin-right: var(--space-lg)
	}

	.margin-x-xl\@xl {
		margin-left: var(--space-xl);
		margin-right: var(--space-xl)
	}

	.margin-x-xxl\@xl {
		margin-left: var(--space-xxl);
		margin-right: var(--space-xxl)
	}

	.margin-x-xxxl\@xl {
		margin-left: var(--space-xxxl);
		margin-right: var(--space-xxxl)
	}

	.margin-x-xxxxl\@xl {
		margin-left: var(--space-xxxxl);
		margin-right: var(--space-xxxxl)
	}

	.margin-x-auto\@xl {
		margin-left: auto;
		margin-right: auto
	}

	.margin-x-0\@xl {
		margin-left: 0;
		margin-right: 0
	}

	.margin-y-xxxxs\@xl {
		margin-top: var(--space-xxxxs);
		margin-bottom: var(--space-xxxxs)
	}

	.margin-y-xxxs\@xl {
		margin-top: var(--space-xxxs);
		margin-bottom: var(--space-xxxs)
	}

	.margin-y-xxs\@xl {
		margin-top: var(--space-xxs);
		margin-bottom: var(--space-xxs)
	}

	.margin-y-xs\@xl {
		margin-top: var(--space-xs);
		margin-bottom: var(--space-xs)
	}

	.margin-y-sm\@xl {
		margin-top: var(--space-sm);
		margin-bottom: var(--space-sm)
	}

	.margin-y-md\@xl {
		margin-top: var(--space-md);
		margin-bottom: var(--space-md)
	}

	.margin-y-lg\@xl {
		margin-top: var(--space-lg);
		margin-bottom: var(--space-lg)
	}

	.margin-y-xl\@xl {
		margin-top: var(--space-xl);
		margin-bottom: var(--space-xl)
	}

	.margin-y-xxl\@xl {
		margin-top: var(--space-xxl);
		margin-bottom: var(--space-xxl)
	}

	.margin-y-xxxl\@xl {
		margin-top: var(--space-xxxl);
		margin-bottom: var(--space-xxxl)
	}

	.margin-y-xxxxl\@xl {
		margin-top: var(--space-xxxxl);
		margin-bottom: var(--space-xxxxl)
	}

	.margin-y-auto\@xl {
		margin-top: auto;
		margin-bottom: auto
	}

	.margin-y-0\@xl {
		margin-top: 0;
		margin-bottom: 0
	}

	.padding-xxxxs\@xl {
		padding: var(--space-xxxxs)
	}

	.padding-xxxs\@xl {
		padding: var(--space-xxxs)
	}

	.padding-xxs\@xl {
		padding: var(--space-xxs)
	}

	.padding-xs\@xl {
		padding: var(--space-xs)
	}

	.padding-sm\@xl {
		padding: var(--space-sm)
	}

	.padding-md\@xl {
		padding: var(--space-md)
	}

	.padding-lg\@xl {
		padding: var(--space-lg)
	}

	.padding-xl\@xl {
		padding: var(--space-xl)
	}

	.padding-xxl\@xl {
		padding: var(--space-xxl)
	}

	.padding-xxxl\@xl {
		padding: var(--space-xxxl)
	}

	.padding-xxxxl\@xl {
		padding: var(--space-xxxxl)
	}

	.padding-0\@xl {
		padding: 0
	}

	.padding-component\@xl {
		padding: var(--component-padding)
	}

	.padding-top-xxxxs\@xl {
		padding-top: var(--space-xxxxs)
	}

	.padding-top-xxxs\@xl {
		padding-top: var(--space-xxxs)
	}

	.padding-top-xxs\@xl {
		padding-top: var(--space-xxs)
	}

	.padding-top-xs\@xl {
		padding-top: var(--space-xs)
	}

	.padding-top-sm\@xl {
		padding-top: var(--space-sm)
	}

	.padding-top-md\@xl {
		padding-top: var(--space-md)
	}

	.padding-top-lg\@xl {
		padding-top: var(--space-lg)
	}

	.padding-top-xl\@xl {
		padding-top: var(--space-xl)
	}

	.padding-top-xxl\@xl {
		padding-top: var(--space-xxl)
	}

	.padding-top-xxxl\@xl {
		padding-top: var(--space-xxxl)
	}

	.padding-top-xxxxl\@xl {
		padding-top: var(--space-xxxxl)
	}

	.padding-top-0\@xl {
		padding-top: 0
	}

	.padding-top-component\@xl {
		padding-top: var(--component-padding)
	}

	.padding-bottom-xxxxs\@xl {
		padding-bottom: var(--space-xxxxs)
	}

	.padding-bottom-xxxs\@xl {
		padding-bottom: var(--space-xxxs)
	}

	.padding-bottom-xxs\@xl {
		padding-bottom: var(--space-xxs)
	}

	.padding-bottom-xs\@xl {
		padding-bottom: var(--space-xs)
	}

	.padding-bottom-sm\@xl {
		padding-bottom: var(--space-sm)
	}

	.padding-bottom-md\@xl {
		padding-bottom: var(--space-md)
	}

	.padding-bottom-lg\@xl {
		padding-bottom: var(--space-lg)
	}

	.padding-bottom-xl\@xl {
		padding-bottom: var(--space-xl)
	}

	.padding-bottom-xxl\@xl {
		padding-bottom: var(--space-xxl)
	}

	.padding-bottom-xxxl\@xl {
		padding-bottom: var(--space-xxxl)
	}

	.padding-bottom-xxxxl\@xl {
		padding-bottom: var(--space-xxxxl)
	}

	.padding-bottom-0\@xl {
		padding-bottom: 0
	}

	.padding-bottom-component\@xl {
		padding-bottom: var(--component-padding)
	}

	.padding-right-xxxxs\@xl {
		padding-right: var(--space-xxxxs)
	}

	.padding-right-xxxs\@xl {
		padding-right: var(--space-xxxs)
	}

	.padding-right-xxs\@xl {
		padding-right: var(--space-xxs)
	}

	.padding-right-xs\@xl {
		padding-right: var(--space-xs)
	}

	.padding-right-sm\@xl {
		padding-right: var(--space-sm)
	}

	.padding-right-md\@xl {
		padding-right: var(--space-md)
	}

	.padding-right-lg\@xl {
		padding-right: var(--space-lg)
	}

	.padding-right-xl\@xl {
		padding-right: var(--space-xl)
	}

	.padding-right-xxl\@xl {
		padding-right: var(--space-xxl)
	}

	.padding-right-xxxl\@xl {
		padding-right: var(--space-xxxl)
	}

	.padding-right-xxxxl\@xl {
		padding-right: var(--space-xxxxl)
	}

	.padding-right-0\@xl {
		padding-right: 0
	}

	.padding-right-component\@xl {
		padding-right: var(--component-padding)
	}

	.padding-left-xxxxs\@xl {
		padding-left: var(--space-xxxxs)
	}

	.padding-left-xxxs\@xl {
		padding-left: var(--space-xxxs)
	}

	.padding-left-xxs\@xl {
		padding-left: var(--space-xxs)
	}

	.padding-left-xs\@xl {
		padding-left: var(--space-xs)
	}

	.padding-left-sm\@xl {
		padding-left: var(--space-sm)
	}

	.padding-left-md\@xl {
		padding-left: var(--space-md)
	}

	.padding-left-lg\@xl {
		padding-left: var(--space-lg)
	}

	.padding-left-xl\@xl {
		padding-left: var(--space-xl)
	}

	.padding-left-xxl\@xl {
		padding-left: var(--space-xxl)
	}

	.padding-left-xxxl\@xl {
		padding-left: var(--space-xxxl)
	}

	.padding-left-xxxxl\@xl {
		padding-left: var(--space-xxxxl)
	}

	.padding-left-0\@xl {
		padding-left: 0
	}

	.padding-left-component\@xl {
		padding-left: var(--component-padding)
	}

	.padding-x-xxxxs\@xl {
		padding-left: var(--space-xxxxs);
		padding-right: var(--space-xxxxs)
	}

	.padding-x-xxxs\@xl {
		padding-left: var(--space-xxxs);
		padding-right: var(--space-xxxs)
	}

	.padding-x-xxs\@xl {
		padding-left: var(--space-xxs);
		padding-right: var(--space-xxs)
	}

	.padding-x-xs\@xl {
		padding-left: var(--space-xs);
		padding-right: var(--space-xs)
	}

	.padding-x-sm\@xl {
		padding-left: var(--space-sm);
		padding-right: var(--space-sm)
	}

	.padding-x-md\@xl {
		padding-left: var(--space-md);
		padding-right: var(--space-md)
	}

	.padding-x-lg\@xl {
		padding-left: var(--space-lg);
		padding-right: var(--space-lg)
	}

	.padding-x-xl\@xl {
		padding-left: var(--space-xl);
		padding-right: var(--space-xl)
	}

	.padding-x-xxl\@xl {
		padding-left: var(--space-xxl);
		padding-right: var(--space-xxl)
	}

	.padding-x-xxxl\@xl {
		padding-left: var(--space-xxxl);
		padding-right: var(--space-xxxl)
	}

	.padding-x-xxxxl\@xl {
		padding-left: var(--space-xxxxl);
		padding-right: var(--space-xxxxl)
	}

	.padding-x-0\@xl {
		padding-left: 0;
		padding-right: 0
	}

	.padding-x-component\@xl {
		padding-left: var(--component-padding);
		padding-right: var(--component-padding)
	}

	.padding-y-xxxxs\@xl {
		padding-top: var(--space-xxxxs);
		padding-bottom: var(--space-xxxxs)
	}

	.padding-y-xxxs\@xl {
		padding-top: var(--space-xxxs);
		padding-bottom: var(--space-xxxs)
	}

	.padding-y-xxs\@xl {
		padding-top: var(--space-xxs);
		padding-bottom: var(--space-xxs)
	}

	.padding-y-xs\@xl {
		padding-top: var(--space-xs);
		padding-bottom: var(--space-xs)
	}

	.padding-y-sm\@xl {
		padding-top: var(--space-sm);
		padding-bottom: var(--space-sm)
	}

	.padding-y-md\@xl {
		padding-top: var(--space-md);
		padding-bottom: var(--space-md)
	}

	.padding-y-lg\@xl {
		padding-top: var(--space-lg);
		padding-bottom: var(--space-lg)
	}

	.padding-y-xl\@xl {
		padding-top: var(--space-xl);
		padding-bottom: var(--space-xl)
	}

	.padding-y-xxl\@xl {
		padding-top: var(--space-xxl);
		padding-bottom: var(--space-xxl)
	}

	.padding-y-xxxl\@xl {
		padding-top: var(--space-xxxl);
		padding-bottom: var(--space-xxxl)
	}

	.padding-y-xxxxl\@xl {
		padding-top: var(--space-xxxxl);
		padding-bottom: var(--space-xxxxl)
	}

	.padding-y-0\@xl {
		padding-top: 0;
		padding-bottom: 0
	}

	.padding-y-component\@xl {
		padding-top: var(--component-padding);
		padding-bottom: var(--component-padding)
	}

	.text-center\@xl {
		text-align: center
	}

	.text-left\@xl {
		text-align: left
	}

	.text-right\@xl {
		text-align: right
	}

	.text-justify\@xl {
		text-align: justify
	}

	.text-xs\@xl {
		font-size: var(--text-xs,.6875rem)
	}

	.text-sm\@xl {
		font-size: var(--text-sm,.75rem)
	}

	.text-base\@xl {
		font-size: var(--text-unit,1rem)
	}

	.text-md\@xl {
		font-size: var(--text-md,1.125rem)
	}

	.text-lg\@xl {
		font-size: var(--text-lg,1.375rem)
	}

	.text-xl\@xl {
		font-size: var(--text-xl,1.75rem)
	}

	.text-xxl\@xl {
		font-size: var(--text-xxl,2rem)
	}

	.text-xxxl\@xl {
		font-size: var(--text-xxxl,2.5rem)
	}

	.text-xxxxl\@xl {
		font-size: var(--text-xxxxl,3rem)
	}

	.column-count-1\@xl {
		-moz-column-count: 1;
		column-count: 1
	}

	.column-count-2\@xl {
		-moz-column-count: 2;
		column-count: 2
	}

	.column-count-3\@xl {
		-moz-column-count: 3;
		column-count: 3
	}

	.column-count-4\@xl {
		-moz-column-count: 4;
		column-count: 4
	}

	.width-xxxxs\@xl {
		width: var(--size-xxxxs,.25rem)
	}

	.width-xxxs\@xl {
		width: var(--size-xxxs,.5rem)
	}

	.width-xxs\@xl {
		width: var(--size-xxs,.75rem)
	}

	.width-xs\@xl {
		width: var(--size-xs,1rem)
	}

	.width-sm\@xl {
		width: var(--size-sm,1.5rem)
	}

	.width-md\@xl {
		width: var(--size-md,2rem)
	}

	.width-lg\@xl {
		width: var(--size-lg,3rem)
	}

	.width-xl\@xl {
		width: var(--size-xl,4rem)
	}

	.width-xxl\@xl {
		width: var(--size-xxl,6rem)
	}

	.width-xxxl\@xl {
		width: var(--size-xxxl,8rem)
	}

	.width-xxxxl\@xl {
		width: var(--size-xxxxl,16rem)
	}

	.width-0\@xl {
		width: 0
	}

	.width-10\%\@xl {
		width: 10%
	}

	.width-20\%\@xl {
		width: 20%
	}

	.width-25\%\@xl {
		width: 25%
	}

	.width-30\%\@xl {
		width: 30%
	}

	.width-33\%\@xl {
		width: 33.3333333333%
	}

	.width-40\%\@xl {
		width: 40%
	}

	.width-50\%\@xl {
		width: 50%
	}

	.width-60\%\@xl {
		width: 60%
	}

	.width-66\%\@xl {
		width: 66.6666666667%
	}

	.width-70\%\@xl {
		width: 70%
	}

	.width-75\%\@xl {
		width: 75%
	}

	.width-80\%\@xl {
		width: 80%
	}

	.width-90\%\@xl {
		width: 90%
	}

	.width-100\%\@xl {
		width: 100%
	}

	.width-100vw\@xl {
		width: 100vw
	}

	.width-auto\@xl {
		width: auto
	}

	.width-inherit\@xl {
		width: inherit
	}

	.height-xxxxs\@xl {
		height: var(--size-xxxxs,.25rem)
	}

	.height-xxxs\@xl {
		height: var(--size-xxxs,.5rem)
	}

	.height-xxs\@xl {
		height: var(--size-xxs,.75rem)
	}

	.height-xs\@xl {
		height: var(--size-xs,1rem)
	}

	.height-sm\@xl {
		height: var(--size-sm,1.5rem)
	}

	.height-md\@xl {
		height: var(--size-md,2rem)
	}

	.height-lg\@xl {
		height: var(--size-lg,3rem)
	}

	.height-xl\@xl {
		height: var(--size-xl,4rem)
	}

	.height-xxl\@xl {
		height: var(--size-xxl,6rem)
	}

	.height-xxxl\@xl {
		height: var(--size-xxxl,8rem)
	}

	.height-xxxxl\@xl {
		height: var(--size-xxxxl,16rem)
	}

	.height-0\@xl {
		height: 0
	}

	.height-10\%\@xl {
		height: 10%
	}

	.height-20\%\@xl {
		height: 20%
	}

	.height-25\%\@xl {
		height: 25%
	}

	.height-30\%\@xl {
		height: 30%
	}

	.height-33\%\@xl {
		height: 33.3333333333%
	}

	.height-40\%\@xl {
		height: 40%
	}

	.height-50\%\@xl {
		height: 50%
	}

	.height-60\%\@xl {
		height: 60%
	}

	.height-66\%\@xl {
		height: 66.6666666667%
	}

	.height-70\%\@xl {
		height: 70%
	}

	.height-75\%\@xl {
		height: 75%
	}

	.height-80\%\@xl {
		height: 80%
	}

	.height-90\%\@xl {
		height: 90%
	}

	.height-100\%\@xl {
		height: 100%
	}

	.height-100vh\@xl {
		height: 100vh
	}

	.height-auto\@xl {
		height: auto
	}

	.height-inherit\@xl {
		height: inherit
	}

	.max-width-xxxxxs\@xl {
		max-width: var(--max-width-xxxxxs)
	}

	.max-width-xxxxs\@xl {
		max-width: var(--max-width-xxxxs)
	}

	.max-width-xxxs\@xl {
		max-width: var(--max-width-xxxs)
	}

	.max-width-xxs\@xl {
		max-width: var(--max-width-xxs)
	}

	.max-width-xs\@xl {
		max-width: var(--max-width-xs)
	}

	.max-width-sm\@xl {
		max-width: var(--max-width-sm)
	}

	.max-width-md\@xl {
		max-width: var(--max-width-md)
	}

	.max-width-lg\@xl {
		max-width: var(--max-width-lg)
	}

	.max-width-xl\@xl {
		max-width: var(--max-width-xl)
	}

	.max-width-xxl\@xl {
		max-width: var(--max-width-xxl)
	}

	.max-width-xxxl\@xl {
		max-width: var(--max-width-xxxl)
	}

	.max-width-xxxxl\@xl {
		max-width: var(--max-width-xxxxl)
	}

	.max-width-100\%\@xl {
		max-width: 100%
	}

	.max-width-none\@xl {
		max-width: none
	}

	.position-relative\@xl {
		position: relative
	}

	.position-absolute\@xl {
		position: absolute
	}

	.position-fixed\@xl {
		position: fixed
	}

	.position-sticky\@xl {
		position: -webkit-sticky;
		position: sticky
	}

	.position-static\@xl {
		position: static
	}

	.inset-0\@xl {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0
	}

	.top-0\@xl {
		top: 0
	}

	.top-50\%\@xl {
		top: 50%
	}

	.top-xxxxs\@xl {
		top: var(--space-xxxxs)
	}

	.top-xxxs\@xl {
		top: var(--space-xxxs)
	}

	.top-xxs\@xl {
		top: var(--space-xxs)
	}

	.top-xs\@xl {
		top: var(--space-xs)
	}

	.top-sm\@xl {
		top: var(--space-sm)
	}

	.top-md\@xl {
		top: var(--space-md)
	}

	.top-lg\@xl {
		top: var(--space-lg)
	}

	.top-xl\@xl {
		top: var(--space-xl)
	}

	.top-xxl\@xl {
		top: var(--space-xxl)
	}

	.top-xxxl\@xl {
		top: var(--space-xxxl)
	}

	.top-xxxxl\@xl {
		top: var(--space-xxxxl)
	}

	.bottom-0\@xl {
		bottom: 0
	}

	.bottom-50\%\@xl {
		bottom: 50%
	}

	.bottom-xxxxs\@xl {
		bottom: var(--space-xxxxs)
	}

	.bottom-xxxs\@xl {
		bottom: var(--space-xxxs)
	}

	.bottom-xxs\@xl {
		bottom: var(--space-xxs)
	}

	.bottom-xs\@xl {
		bottom: var(--space-xs)
	}

	.bottom-sm\@xl {
		bottom: var(--space-sm)
	}

	.bottom-md\@xl {
		bottom: var(--space-md)
	}

	.bottom-lg\@xl {
		bottom: var(--space-lg)
	}

	.bottom-xl\@xl {
		bottom: var(--space-xl)
	}

	.bottom-xxl\@xl {
		bottom: var(--space-xxl)
	}

	.bottom-xxxl\@xl {
		bottom: var(--space-xxxl)
	}

	.bottom-xxxxl\@xl {
		bottom: var(--space-xxxxl)
	}

	.right-0\@xl {
		right: 0
	}

	.right-50\%\@xl {
		right: 50%
	}

	.right-xxxxs\@xl {
		right: var(--space-xxxxs)
	}

	.right-xxxs\@xl {
		right: var(--space-xxxs)
	}

	.right-xxs\@xl {
		right: var(--space-xxs)
	}

	.right-xs\@xl {
		right: var(--space-xs)
	}

	.right-sm\@xl {
		right: var(--space-sm)
	}

	.right-md\@xl {
		right: var(--space-md)
	}

	.right-lg\@xl {
		right: var(--space-lg)
	}

	.right-xl\@xl {
		right: var(--space-xl)
	}

	.right-xxl\@xl {
		right: var(--space-xxl)
	}

	.right-xxxl\@xl {
		right: var(--space-xxxl)
	}

	.right-xxxxl\@xl {
		right: var(--space-xxxxl)
	}

	.left-0\@xl {
		left: 0
	}

	.left-50\%\@xl {
		left: 50%
	}

	.left-xxxxs\@xl {
		left: var(--space-xxxxs)
	}

	.left-xxxs\@xl {
		left: var(--space-xxxs)
	}

	.left-xxs\@xl {
		left: var(--space-xxs)
	}

	.left-xs\@xl {
		left: var(--space-xs)
	}

	.left-sm\@xl {
		left: var(--space-sm)
	}

	.left-md\@xl {
		left: var(--space-md)
	}

	.left-lg\@xl {
		left: var(--space-lg)
	}

	.left-xl\@xl {
		left: var(--space-xl)
	}

	.left-xxl\@xl {
		left: var(--space-xxl)
	}

	.left-xxxl\@xl {
		left: var(--space-xxxl)
	}

	.left-xxxxl\@xl {
		left: var(--space-xxxxl)
	}

	.overflow-hidden\@xl {
		overflow: hidden
	}

	.overflow-auto\@xl {
		overflow: auto
	}

	.momentum-scrolling\@xl {
		-webkit-overflow-scrolling: touch
	}

	.overscroll-contain\@xl {
		overscroll-behavior: contain
	}

	.visible\@xl {
		visibility: visible
	}

	.invisible\@xl {
		visibility: hidden
	}
}

@media not all and (min-width: 90rem) {
	.display\@xl {
		display:none!important
	}
}

:root,[data-theme=default] {
	--color-primary-darker: hsl(250, 84%, 38%);
	--color-primary-darker-h: 250;
	--color-primary-darker-s: 84%;
	--color-primary-darker-l: 38%;
	--color-primary-dark: hsl(250, 84%, 46%);
	--color-primary-dark-h: 250;
	--color-primary-dark-s: 84%;
	--color-primary-dark-l: 46%;
	--color-primary: hsl(250, 84%, 54%);
	--color-primary-h: 250;
	--color-primary-s: 84%;
	--color-primary-l: 54%;
	--color-primary-light: hsl(250, 84%, 60%);
	--color-primary-light-h: 250;
	--color-primary-light-s: 84%;
	--color-primary-light-l: 60%;
	--color-primary-lighter: hsl(250, 84%, 67%);
	--color-primary-lighter-h: 250;
	--color-primary-lighter-s: 84%;
	--color-primary-lighter-l: 67%;
	--color-accent-darker: hsl(342, 89%, 38%);
	--color-accent-darker-h: 342;
	--color-accent-darker-s: 89%;
	--color-accent-darker-l: 38%;
	--color-accent-dark: hsl(342, 89%, 43%);
	--color-accent-dark-h: 342;
	--color-accent-dark-s: 89%;
	--color-accent-dark-l: 43%;
	--color-accent: hsl(342, 89%, 48%);
	--color-accent-h: 342;
	--color-accent-s: 89%;
	--color-accent-l: 48%;
	--color-accent-light: hsl(342, 89%, 56%);
	--color-accent-light-h: 342;
	--color-accent-light-s: 89%;
	--color-accent-light-l: 56%;
	--color-accent-lighter: hsl(342, 89%, 62%);
	--color-accent-lighter-h: 342;
	--color-accent-lighter-s: 89%;
	--color-accent-lighter-l: 62%;
	--color-black: hsl(231, 15%, 9%);
	--color-black-h: 231;
	--color-black-s: 15%;
	--color-black-l: 9%;
	--color-white: hsl(0, 0%, 100%);
	--color-white-h: 0;
	--color-white-s: 0%;
	--color-white-l: 100%;
	--color-warning-darker: hsl(35, 79%, 48%);
	--color-warning-darker-h: 35;
	--color-warning-darker-s: 79%;
	--color-warning-darker-l: 48%;
	--color-warning-dark: hsl(35, 79%, 56%);
	--color-warning-dark-h: 35;
	--color-warning-dark-s: 79%;
	--color-warning-dark-l: 56%;
	--color-warning: hsl(35, 79%, 66%);
	--color-warning-h: 35;
	--color-warning-s: 79%;
	--color-warning-l: 66%;
	--color-warning-light: hsl(35, 79%, 74%);
	--color-warning-light-h: 35;
	--color-warning-light-s: 79%;
	--color-warning-light-l: 74%;
	--color-warning-lighter: hsl(35, 79%, 82%);
	--color-warning-lighter-h: 35;
	--color-warning-lighter-s: 79%;
	--color-warning-lighter-l: 82%;
	--color-success-darker: hsl(170, 78%, 26%);
	--color-success-darker-h: 170;
	--color-success-darker-s: 78%;
	--color-success-darker-l: 26%;
	--color-success-dark: hsl(170, 78%, 31%);
	--color-success-dark-h: 170;
	--color-success-dark-s: 78%;
	--color-success-dark-l: 31%;
	--color-success: hsl(170, 78%, 36%);
	--color-success-h: 170;
	--color-success-s: 78%;
	--color-success-l: 36%;
	--color-success-light: hsl(170, 78%, 42%);
	--color-success-light-h: 170;
	--color-success-light-s: 78%;
	--color-success-light-l: 42%;
	--color-success-lighter: hsl(170, 78%, 47%);
	--color-success-lighter-h: 170;
	--color-success-lighter-s: 78%;
	--color-success-lighter-l: 47%;
	--color-error-darker: hsl(342, 89%, 38%);
	--color-error-darker-h: 342;
	--color-error-darker-s: 89%;
	--color-error-darker-l: 38%;
	--color-error-dark: hsl(342, 89%, 43%);
	--color-error-dark-h: 342;
	--color-error-dark-s: 89%;
	--color-error-dark-l: 43%;
	--color-error: hsl(342, 89%, 48%);
	--color-error-h: 342;
	--color-error-s: 89%;
	--color-error-l: 48%;
	--color-error-light: hsl(342, 89%, 56%);
	--color-error-light-h: 342;
	--color-error-light-s: 89%;
	--color-error-light-l: 56%;
	--color-error-lighter: hsl(342, 89%, 62%);
	--color-error-lighter-h: 342;
	--color-error-lighter-s: 89%;
	--color-error-lighter-l: 62%;
	--color-bg-darker: hsl(240, 4%, 90%);
	--color-bg-darker-h: 240;
	--color-bg-darker-s: 4%;
	--color-bg-darker-l: 90%;
	--color-bg-dark: hsl(240, 4%, 95%);
	--color-bg-dark-h: 240;
	--color-bg-dark-s: 4%;
	--color-bg-dark-l: 95%;
	--color-bg: hsl(0, 0%, 100%);
	--color-bg-h: 0;
	--color-bg-s: 0%;
	--color-bg-l: 100%;
	--color-bg-light: hsl(0, 0%, 100%);
	--color-bg-light-h: 0;
	--color-bg-light-s: 0%;
	--color-bg-light-l: 100%;
	--color-bg-lighter: hsl(0, 0%, 100%);
	--color-bg-lighter-h: 0;
	--color-bg-lighter-s: 0%;
	--color-bg-lighter-l: 100%;
	--color-contrast-lower: hsl(240, 4%, 85%);
	--color-contrast-lower-h: 240;
	--color-contrast-lower-s: 4%;
	--color-contrast-lower-l: 85%;
	--color-contrast-low: hsl(240, 4%, 65%);
	--color-contrast-low-h: 240;
	--color-contrast-low-s: 4%;
	--color-contrast-low-l: 65%;
	--color-contrast-medium: hsl(225, 4%, 47%);
	--color-contrast-medium-h: 225;
	--color-contrast-medium-s: 4%;
	--color-contrast-medium-l: 47%;
	--color-contrast-high: hsl(230, 7%, 23%);
	--color-contrast-high-h: 230;
	--color-contrast-high-s: 7%;
	--color-contrast-high-l: 23%;
	--color-contrast-higher: hsl(230, 13%, 9%);
	--color-contrast-higher-h: 230;
	--color-contrast-higher-s: 13%;
	--color-contrast-higher-l: 9%
}

[data-theme=dark] {
	--color-primary-darker: hsl(250, 100%, 60%);
	--color-primary-darker-h: 250;
	--color-primary-darker-s: 100%;
	--color-primary-darker-l: 60%;
	--color-primary-dark: hsl(250, 100%, 64%);
	--color-primary-dark-h: 250;
	--color-primary-dark-s: 100%;
	--color-primary-dark-l: 64%;
	--color-primary: hsl(250, 100%, 69%);
	--color-primary-h: 250;
	--color-primary-s: 100%;
	--color-primary-l: 69%;
	--color-primary-light: hsl(250, 100%, 72%);
	--color-primary-light-h: 250;
	--color-primary-light-s: 100%;
	--color-primary-light-l: 72%;
	--color-primary-lighter: hsl(250, 100%, 76%);
	--color-primary-lighter-h: 250;
	--color-primary-lighter-s: 100%;
	--color-primary-lighter-l: 76%;
	--color-accent-darker: hsl(342, 92%, 41%);
	--color-accent-darker-h: 342;
	--color-accent-darker-s: 92%;
	--color-accent-darker-l: 41%;
	--color-accent-dark: hsl(342, 92%, 47%);
	--color-accent-dark-h: 342;
	--color-accent-dark-s: 92%;
	--color-accent-dark-l: 47%;
	--color-accent: hsl(342, 92%, 54%);
	--color-accent-h: 342;
	--color-accent-s: 92%;
	--color-accent-l: 54%;
	--color-accent-light: hsl(342, 92%, 60%);
	--color-accent-light-h: 342;
	--color-accent-light-s: 92%;
	--color-accent-light-l: 60%;
	--color-accent-lighter: hsl(342, 92%, 65%);
	--color-accent-lighter-h: 342;
	--color-accent-lighter-s: 92%;
	--color-accent-lighter-l: 65%;
	--color-black: hsl(230, 13%, 9%);
	--color-black-h: 230;
	--color-black-s: 13%;
	--color-black-l: 9%;
	--color-white: hsl(0, 0%, 100%);
	--color-white-h: 0;
	--color-white-s: 0%;
	--color-white-l: 100%;
	--color-warning-darker: hsl(35, 79%, 48%);
	--color-warning-darker-h: 35;
	--color-warning-darker-s: 79%;
	--color-warning-darker-l: 48%;
	--color-warning-dark: hsl(35, 79%, 56%);
	--color-warning-dark-h: 35;
	--color-warning-dark-s: 79%;
	--color-warning-dark-l: 56%;
	--color-warning: hsl(35, 79%, 66%);
	--color-warning-h: 35;
	--color-warning-s: 79%;
	--color-warning-l: 66%;
	--color-warning-light: hsl(35, 79%, 74%);
	--color-warning-light-h: 35;
	--color-warning-light-s: 79%;
	--color-warning-light-l: 74%;
	--color-warning-lighter: hsl(35, 79%, 82%);
	--color-warning-lighter-h: 35;
	--color-warning-lighter-s: 79%;
	--color-warning-lighter-l: 82%;
	--color-success-darker: hsl(170, 78%, 26%);
	--color-success-darker-h: 170;
	--color-success-darker-s: 78%;
	--color-success-darker-l: 26%;
	--color-success-dark: hsl(170, 78%, 31%);
	--color-success-dark-h: 170;
	--color-success-dark-s: 78%;
	--color-success-dark-l: 31%;
	--color-success: hsl(170, 78%, 36%);
	--color-success-h: 170;
	--color-success-s: 78%;
	--color-success-l: 36%;
	--color-success-light: hsl(170, 78%, 42%);
	--color-success-light-h: 170;
	--color-success-light-s: 78%;
	--color-success-light-l: 42%;
	--color-success-lighter: hsl(170, 78%, 47%);
	--color-success-lighter-h: 170;
	--color-success-lighter-s: 78%;
	--color-success-lighter-l: 47%;
	--color-error-darker: hsl(342, 92%, 41%);
	--color-error-darker-h: 342;
	--color-error-darker-s: 92%;
	--color-error-darker-l: 41%;
	--color-error-dark: hsl(342, 92%, 47%);
	--color-error-dark-h: 342;
	--color-error-dark-s: 92%;
	--color-error-dark-l: 47%;
	--color-error: hsl(342, 92%, 54%);
	--color-error-h: 342;
	--color-error-s: 92%;
	--color-error-l: 54%;
	--color-error-light: hsl(342, 92%, 60%);
	--color-error-light-h: 342;
	--color-error-light-s: 92%;
	--color-error-light-l: 60%;
	--color-error-lighter: hsl(342, 92%, 65%);
	--color-error-lighter-h: 342;
	--color-error-lighter-s: 92%;
	--color-error-lighter-l: 65%;
	--color-bg-darker: hsl(232, 7%, 8%);
	--color-bg-darker-h: 232;
	--color-bg-darker-s: 7%;
	--color-bg-darker-l: 8%;
	--color-bg-dark: hsl(233, 8%, 11%);
	--color-bg-dark-h: 233;
	--color-bg-dark-s: 8%;
	--color-bg-dark-l: 11%;
	--color-bg: hsl(232, 11%, 15%);
	--color-bg-h: 232;
	--color-bg-s: 11%;
	--color-bg-l: 15%;
	--color-bg-light: hsl(233, 8%, 19%);
	--color-bg-light-h: 233;
	--color-bg-light-s: 8%;
	--color-bg-light-l: 19%;
	--color-bg-lighter: hsl(232, 7%, 22%);
	--color-bg-lighter-h: 232;
	--color-bg-lighter-s: 7%;
	--color-bg-lighter-l: 22%;
	--color-contrast-lower: hsl(240, 6%, 26%);
	--color-contrast-lower-h: 240;
	--color-contrast-lower-s: 6%;
	--color-contrast-lower-l: 26%;
	--color-contrast-low: hsl(240, 3%, 41%);
	--color-contrast-low-h: 240;
	--color-contrast-low-s: 3%;
	--color-contrast-low-l: 41%;
	--color-contrast-medium: hsl(231, 3%, 57%);
	--color-contrast-medium-h: 231;
	--color-contrast-medium-s: 3%;
	--color-contrast-medium-l: 57%;
	--color-contrast-high: hsl(240, 5%, 82%);
	--color-contrast-high-h: 240;
	--color-contrast-high-s: 5%;
	--color-contrast-high-l: 82%;
	--color-contrast-higher: hsl(240, 100%, 99%);
	--color-contrast-higher-h: 240;
	--color-contrast-higher-s: 100%;
	--color-contrast-higher-l: 99%
}

@media (min-width: 64rem) {
	*,:root {
		--space-xxxxs:calc(0.1875 * var(--space-unit));
		--space-xxxs: calc(0.375 * var(--space-unit));
		--space-xxs: calc(0.5625 * var(--space-unit));
		--space-xs: calc(0.75 * var(--space-unit));
		--space-sm: calc(1.125 * var(--space-unit));
		--space-md: calc(2 * var(--space-unit));
		--space-lg: calc(3.125 * var(--space-unit));
		--space-xl: calc(5.125 * var(--space-unit));
		--space-xxl: calc(8.25 * var(--space-unit));
		--space-xxxl: calc(13.25 * var(--space-unit));
		--space-xxxxl: calc(21.5 * var(--space-unit))
	}
}

:root {
	--radius: 0.375em
}

.hover\:reduce-opacity {
	opacity: 1;
	transition: all .3s ease
}

.hover\:reduce-opacity:hover {
	opacity: .8
}

.hover\:scale {
	transition: transform .3s var(--ease-out-back)
}

.hover\:scale:hover {
	transform: scale(1.1)
}

.hover\:elevate {
	box-shadow: var(--shadow-sm);
	transition: all .3s ease
}

.hover\:elevate:hover {
	box-shadow: var(--shadow-md)
}

.link-subtle {
	color: inherit;
	cursor: pointer;
	text-decoration: none;
	transition: all .2s ease
}

.link-subtle:hover {
	color: var(--color-primary)
}

:root {
	--font-primary: sofia-pro,sans-serif;
	--text-base-size: 1rem;
	--text-scale-ratio: 1.2;
	--body-line-height: 1.7;
	--heading-line-height: 1.2;
	--font-primary-capital-letter: 1;
	--text-unit: var(--text-base-size)

}




h1, h2, h3, h4, h5 {
  font-weight: 700;
  line-height: 1.5;
  font-family: aller, sans-serif !important;
  color:#111;

}


*,:root {
	--text-xs: calc((var(--text-unit) / var(--text-scale-ratio)) / var(--text-scale-ratio));
	--text-sm: calc(var(--text-xs) * var(--text-scale-ratio));
	--text-md: calc(var(--text-sm) * var(--text-scale-ratio) * var(--text-scale-ratio));
	--text-lg: calc(var(--text-md) * var(--text-scale-ratio));
	--text-xl: calc(var(--text-lg) * var(--text-scale-ratio));
	--text-xxl: calc(var(--text-xl) * var(--text-scale-ratio));
	--text-xxxl: calc(var(--text-xxl) * var(--text-scale-ratio));
	--text-xxxxl: calc(var(--text-xxxl) * var(--text-scale-ratio))
}

@media (min-width: 64rem) {
	:root {
		--text-base-size:1.125rem;
		--text-scale-ratio: 1.215
	}
}

h1,h2,h3,h4 {
	--heading-font-weight: 700
}

html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.link {
	text-decoration: none;
	background-image: linear-gradient(to right,currentColor 50%,hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),.15) 50%);
	background-size: 200% 1px;
	background-repeat: no-repeat;
	background-position: 100% 100%;
	transition: background-position .2s
}

.link:hover {
	background-position: 0 100%
}

mark {
	background-color: hsla(var(--color-accent-h),var(--color-accent-s),var(--color-accent-l),.2);
	color: inherit
}

.text-component {
	--line-height-multiplier: 1;
	--text-space-y-multiplier: 1
}

.text-component>* {
	--text-unit: 1em;
	--space-unit: 1em
}

.text-component blockquote {
	padding-left: 1em;
	border-left: 4px solid var(--color-contrast-lower);
	font-style: italic
}

.text-component hr {
	background: var(--color-contrast-lower);
	height: 1px
}

.text-component figcaption {
	font-size: var(--text-sm);
	color: var(--color-contrast-low)
}

.article {
	--body-line-height: 1.58;
	--text-space-y-multiplier: 1.2
}

:root {
	--btn-font-size: 1em;
	--btn-padding-x: var(--space-sm);
	--btn-padding-y: var(--space-xxs);
	--btn-radius: var(--radius-md)
}

.btn {
	background: var(--color-bg-dark);
	color: var(--color-contrast-higher);
	cursor: pointer;
	text-decoration: none;
	line-height: 1.2;
	font-weight: 500;
	transition: all .2s ease;
	will-change: transform
}

.btn:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 2px var(--color-bg),0 0 0 4px hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),.15)
}

.btn:active {
	transform: translateY(2px)
}

.btn--primary {
	background: var(--color-primary);
	padding:12px 16px;
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.15),0 1px 3px hsla(var(--color-black-darker-h),var(--color-black-darker-s),var(--color-black-darker-l),.25),0 2px 6px hsla(var(--color-black-darker-h),var(--color-black-darker-s),var(--color-black-darker-l),.1),0 6px 10px -2px hsla(var(--color-black-darker-h),var(--color-black-darker-s),var(--color-black-darker-l),.25);
	color: var(--color-white)
}

.btn--primary:hover {
	background: var(--color-primary-light);
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.15),0 1px 2px hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),.25),0 1px 4px hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),.1),0 3px 6px -2px hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),.25)
}

.btn--primary:focus-visible {
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.15),0 1px 2px hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),.25),0 1px 4px hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),.1),0 3px 6px -2px hsla(var(--color-primary-darker-h),var(--color-primary-darker-s),var(--color-primary-darker-l),.25),0 0 0 2px var(--color-bg),0 0 0 4px var(--color-primary)
}

.btn--subtle {
	background: var(--color-bg-lighter);
	color: var(--color-contrast-higher);
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.1),0 0 0 1px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.02),0 .3px .4px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.025),0 1px 3px -1px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.2),0 3.5px 6px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.12)
}

.btn--subtle:hover {
	background: var(--color-bg-light);
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.1),0 0 0 1px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.02),0 .1px .3px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.06),0 1px 2px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.12),0 1px 3px -1px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.2)
}

.btn--subtle:focus-visible {
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.1),0 0 0 1px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.02),0 .3px .4px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.025),0 1px 3px -1px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.2),0 3.5px 6px hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),.12),0 0 0 2px var(--color-bg),0 0 0 4px var(--color-contrast-high)
}

.btn--accent {
	background: var(--color-accent);
	color: var(--color-white);
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.15),0 1px 3px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.25),0 2px 6px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.1),0 6px 10px -2px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.25)
}

.btn--accent:hover {
	background: var(--color-accent-light);
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.15),0 1px 2px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.25),0 1px 4px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.1),0 3px 6px -2px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.1)
}

.btn--accent:focus-visible {
	box-shadow: inset 0 1px 0 hsla(var(--color-white-h),var(--color-white-s),var(--color-white-l),.15),0 1px 2px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.25),0 1px 4px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.1),0 3px 6px -2px hsla(var(--color-accent-darker-h),var(--color-accent-darker-s),var(--color-accent-darker-l),.1),0 0 0 2px var(--color-bg),0 0 0 4px var(--color-accent)
}

.btn--disabled,.btn[disabled],.btn[readonly] {
	opacity: .6;
	cursor: not-allowed
}

.btn--sm {
	font-size: .8em
}

.btn--md {
	font-size: 1.2em
}

.btn--lg {
	font-size: 1.4em
}

:root {
	--form-control-font-size: 1em;
	--form-control-padding-x: var(--space-xs);
	--form-control-padding-y: var(--space-xxs);
	--form-control-radius: var(--radius-md)
}

.form-control {
	background: var(--color-bg-dark);
	line-height: 1.2;
	box-shadow: inset 0 0 0 1px var(--color-contrast-lower);
	transition: all .2s ease
}

.form-control::-moz-placeholder {
	opacity: 1;
	color: var(--color-contrast-low)
}

.form-control::placeholder {
	opacity: 1;
	color: var(--color-contrast-low)
}

.form-control:focus,.form-control:focus-within {
	background: var(--color-bg);
	box-shadow: inset 0 0 0 1px hsla(var(--color-contrast-lower-h),var(--color-contrast-lower-s),var(--color-contrast-lower-l),0),0 0 0 2px var(--color-primary),var(--shadow-sm)
}

.form-control--disabled,.form-control[disabled],.form-control[readonly] {
	opacity: .5;
	cursor: not-allowed
}

.form-control.form-control--error,.form-control[aria-invalid=true] {
	box-shadow: inset 0 0 0 1px hsla(var(--color-contrast-lower-h),var(--color-contrast-lower-s),var(--color-contrast-lower-l),0),0 0 0 2px var(--color-error)
}

.form-control.form-control--error:focus,.form-control.form-control--error:focus-within,.form-control[aria-invalid=true]:focus,.form-control[aria-invalid=true]:focus-within {
	box-shadow: inset 0 0 0 1px hsla(var(--color-contrast-lower-h),var(--color-contrast-lower-s),var(--color-contrast-lower-l),0),0 0 0 2px var(--color-error),var(--shadow-sm)
}

/*! purgecss start ignore */
:root {
	--list-space-y: 0.375em;
	--list-offset: 1em;
	--list-line-height-multiplier: 1
}

.list,.text-component .list {
	padding-left: 0;
	list-style: none
}

.list ol,.list ul,.text-component .list ol,.text-component .list ul {
	list-style: none;
	margin: 0;
	margin-top: calc(var(--list-space-y)/ 2 * var(--text-space-y-multiplier,1));
	padding-top: calc(var(--list-space-y)/ 2 * var(--text-space-y-multiplier,1));
	padding-left: var(--list-offset)
}

.list li,.text-component .list li {
	padding-bottom: calc(var(--list-space-y)/ 2 * var(--text-space-y-multiplier,1));
	margin-bottom: calc(var(--list-space-y)/ 2 * var(--text-space-y-multiplier,1));
	line-height: calc(var(--body-line-height) * var(--list-line-height-multiplier))
}

.list ol>li:last-child,.list ul>li:last-child,.list>li:last-child,.text-component .list ol>li:last-child,.text-component .list ul>li:last-child,.text-component .list>li:last-child {
	margin-bottom: 0
}

.list ol>li:last-child,.list ul>li:last-child,.list:not(.list--border)>li:last-child,.text-component .list ol>li:last-child,.text-component .list ul>li:last-child,.text-component .list:not(.list--border)>li:last-child {
	padding-bottom: 0
}

.list--ol,.list--ul,.text-component .list--ol,.text-component .list--ul {
	--list-offset: calc(var(--list-bullet-size) + var(--list-bullet-margin-right))
}

.list--ol ol,.list--ol ul,.list--ul ol,.list--ul ul,.text-component .list--ol ol,.text-component .list--ol ul,.text-component .list--ul ol,.text-component .list--ul ul {
	padding-left: 0
}

.list--ol li,.list--ul li,.text-component .list--ol li,.text-component .list--ul li {
	padding-left: var(--list-offset)
}

.list--ol li::before,.list--ul li::before,.text-component .list--ol li::before,.text-component .list--ul li::before {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: var(--list-bullet-size);
	height: var(--list-bullet-size);
	vertical-align: middle;
	position: relative;
	top: -.1em;
	left: calc(var(--list-bullet-margin-right) * -1);
	margin-left: calc(var(--list-bullet-size) * -1)
}

.list--ul,.text-component .list--ul {
	--list-bullet-size: 7px;
	--list-bullet-margin-right: 12px
}

.list--ul>li::before,.text-component .list--ul>li::before {
	content: "";
	border-radius: 50%;
	color: hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),.1);
	background-color: currentColor
}

.list--ul ul li::before,.text-component .list--ul ul li::before {
	background-color: transparent;
	box-shadow: inset 0 0 0 2px currentColor
}

.list--ol,.text-component .list--ol {
	--list-bullet-size: 26px;
	--list-bullet-margin-right: 6px;
	--list-bullet-font-size: 14px;
	counter-reset: list-items
}

.list--ol>li,.text-component .list--ol>li {
	counter-increment: list-items
}

.list--ol ol,.text-component .list--ol ol {
	counter-reset: list-items
}

.list--ol>li::before,.text-component .list--ol>li::before {
	content: counter(list-items);
	font-size: var(--list-bullet-font-size,14px);
	background-color: hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),.075);
	color: var(--color-contrast-higher);
	line-height: 1;
	border-radius: 50%
}

.list--ol ol>li::before,.text-component .list--ol ol>li::before {
	background-color: transparent;
	box-shadow: inset 0 0 0 2px hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),.075)
}

.list--border li:not(:last-child),.text-component .list--border li:not(:last-child) {
	border-bottom: 1px solid var(--color-contrast-lower)
}

.list--border ol,.list--border ul,.text-component .list--border ol,.text-component .list--border ul {
	border-top: 1px solid var(--color-contrast-lower)
}

.list--icons,.text-component .list--icons {
	--list-bullet-size: 24px;
	--list-bullet-margin-right: 8px;
	--list-offset: calc(var(--list-bullet-size) + var(--list-bullet-margin-right))
}

.list--icons ol,.list--icons ul,.text-component .list--icons ol,.text-component .list--icons ul {
	padding-left: var(--list-offset)
}

.list__icon {
	position: relative;
	width: var(--list-bullet-size);
	height: var(--list-bullet-size);
	margin-right: var(--list-bullet-margin-right)
}

.list__icon:not(.top-0) {
	top: calc((1em * var(--body-line-height) * var(--list-line-height-multiplier) - var(--list-bullet-size))/ 2)
}

/* FUNQY Heritage */


.product_title,.woocommerce-loop-product__title {
	text-transform: none
}

.woocommerce-product-details__short-description,.woocommerce-Tabs-panel,#footer-widgets .footer-widget li a,#footer-widgets .footer-widget p,#footer-widgets .footer-widget li {
	font-weight: 300;
	line-height: 1.9em
}

.woocommerce-product-details__short-description,.woocommerce-Tabs-panel {
	color: #0A0B0B
}

#footer-widgets .footer-widget li:before {
	border: none;
	left: 0
}

#footer-widgets .footer-widget li {
	padding-left: 0
}


/* --------------------------------

File#: _1_diagonal-movement
Title: Diagonal Movement
Descr: A JavaScript plugin that detects the direction of the mouse movement (diagonal vs vertical)
Usage: codyhouse.co/license
Based on the jQuery-menu-aim plugin https://github.com/kamens/jQuery-menu-aim

⚠️ The style of this component is only for demo purpose. You don't need it to use the plugin.

-------------------------------- */
.d-movement {
  max-width: 720px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: var(--space-xxs);
}

.d-movement__source {
  display: grid;
  grid-gap: var(--space-xxs);
}

.d-movement__item {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-radius: 0.25em;
}

.d-movement__item--one {
  color: var(--color-white);
  background-color: var(--color-primary);
}

.d-movement__item--two {
  color: var(--color-bg);
  background-color: var(--color-contrast-higher);
}

.d-movement__item--three {
  color: var(--color-white);
  background-color: var(--color-accent);
}

.d-movement__sub-element {
  background-color: var(--color-contrast-lower);
  border-radius: 0.25em;
  transition: background 0.2s;
}

.d-movement__arrow {
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-left-color: currentColor;
}
/* --------------------------------

File#: _2_dropdown
Title: Dropdown
Descr: A hoverable link that toggles the visibility of a dropdown list
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --dropdown-item-padding: var(--space-xxs) var(--space-sm);
}

.dropdown {
  /* position: relative; */
}



.dropdown__menu {
  width: 200px;
  border-radius: var(--radius-md);
  padding: var(--space-xxxs) 0;
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow), var(--shadow-sm);
  z-index: var(--z-index-popover, 5);
  position: absolute;
  left: 0;
  top: 100%;
  --space-unit: 1rem;
  --text-unit: 1rem;
  font-size: var(--text-unit);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0s 0.2s;
}

@media (pointer: fine) {
  .dropdown__wrapper:hover > .dropdown__menu,
.dropdown__sub-wrapper:hover > .dropdown__menu {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.2s;
  }

  .dropdown__sub-wrapper:hover > .dropdown__menu {
	left: 100%;
  }
}
@media not all and (pointer: fine) {
  .dropdown__trigger-icon {
	display: none;
  }
}
.dropdown__item {
  display: block;
  text-decoration: none;
  color: var(--color-contrast-high);
  padding: var(--dropdown-item-padding);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: 0.2s;
}
.dropdown__item:hover, .dropdown__item.dropdown__item--hover {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
}

.dropdown__separator {
  height: 1px;
  background-color: var(--color-contrast-lower);
  margin: var(--dropdown-item-padding);
}

.dropdown__sub-wrapper {
  position: relative;
}
.dropdown__sub-wrapper > .dropdown__item {
  position: relative;
  padding-right: calc(var(--space-sm) + 12px);
}
.dropdown__sub-wrapper > .dropdown__item .icon {
  position: absolute;
  display: block;
  width: 12px;
  height: 12px;
  right: var(--space-xxs);
  top: calc(50% - 6px);
}
.dropdown__sub-wrapper > .dropdown__menu {
  top: calc(var(--space-xxs) * -1);
  box-shadow: var(--inner-glow), var(--shadow-md);
}

.dropdown__menu {
  top: calc(100% + 4px);
}

.dropdown__sub-wrapper .dropdown__menu {
  top: calc(var(--space-xxs) * -1);
}


  .dropdown__menu--is-visible {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.2s;
  }
.dropdown__menu--is-hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0s 0.2s;
}

.dropdown__sub-wrapper > .dropdown__menu--is-visible,
.dropdown__sub-wrapper > .dropdown__menu--is-hidden {
  left: 100%;
}
.dropdown__sub-wrapper > .dropdown__menu--is-visible.dropdown__menu--left,
.dropdown__sub-wrapper > .dropdown__menu--is-hidden.dropdown__menu--left {
  left: -100%;
}

/* --------------------------------

File#: _1_tabs
Title: Tabs
Descr: A list of content sections (panels), accessible one at a time using control labels
Usage: codyhouse.co/license

-------------------------------- */
.tabs__control {
  text-decoration: none;
  color: var(--color-contrast-medium);
}
.tabs__control:focus {
  outline: 2px solid hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
  outline-offset: 2px;
}
.tabs__control:hover {
  color: var(--color-contrast-high);
}

.tabs__control[aria-selected=true] {
  color: var(--color-contrast-high);
  text-decoration: underline;
}

/* --------------------------------

File#: _3_mega-site-navigation
Title: Mega-Site Navigation
Descr: Navigation template for mega-sites
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --mega-nav-height: 50px;
  --mega-nav-content-max-width: var(--max-width-lg);
  /* set max-width for navigation content */
}
@media (min-width: 64rem) {
  :root {
	--mega-nav-height: 70px;
  }
}

.dt-buttons {


}

body:not(.header-4).sticky-d .col-full-nav {display: none !important; visibility: hidden;}
.col-full-nav.is_stuck {display: none;}






.mega-nav {
  height: var(--mega-nav-height);
  width: 100%;
  z-index: var(--z-index-header, 3);
  box-shadow: inset 0px -1px 0px hsla(var(--color-contrast-medium-h), var(--color-contrast-medium-s), var(--color-contrast-medium-l), 0.1);
  /* border bottom */
}
body.home .mega-nav {  box-shadow: none;
}
/* change mega-nav style if menu = expanded */
.mega-nav--expanded {
  background-color: var(--color-bg);
}

.mega-nav__container {
  width: calc(100% - 2 * var(--component-padding));
  height: 100%;
  max-width: var(--max-width-xxl);
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* logo */
.mega-nav__logo {
  display: block;
  padding: 10px;
  width: 130px;
  /* logo width */
  height: auto;
  /* logo height */
  position:relative;
  left: 19px;
  z-index:1;


}
.mega-nav__logo > * {
  /* logo SVG */
  width: 105px;
  height: inherit;
  position: relative;
  top:20px;
  z-index: 9999;
}

.site-branding .mega-nav__logo > *  {
	top:0;
	width: 75px;
}
/* mobile buttons */
.mega-nav__icon-btns {
  display: flex;
  align-items: center;
}

.mega-nav__icon-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  font-size: 24px;
  /* icon size */
  color: var(--color-contrast-high);
  /* icon color */
  cursor: pointer;
  transition: 0.2s;
  position: relative;


}
.mega-nav__icon-btn .icon {
  display: block;
}
.mega-nav__icon-btn .icon__group {
  stroke-width: 1px;
  /* icon stroke width */
}
.mega-nav__icon-btn .icon__group > * {
  transition: stroke-dashoffset 0.3s, opacity 0.3s, -webkit-transform 0.3s var(--ease-in-out);
  transition: transform 0.3s var(--ease-in-out), stroke-dashoffset 0.3s, opacity 0.3s;
  transition: transform 0.3s var(--ease-in-out), stroke-dashoffset 0.3s, opacity 0.3s, -webkit-transform 0.3s var(--ease-in-out);
}

/* animated menu button */
.mega-nav__icon-btn--menu .icon__group > * {
  stroke-dasharray: 24;
}
.mega-nav__icon-btn--menu .icon__group > *:nth-child(1) {
  -webkit-transform-origin: 12px 6px;
		  transform-origin: 12px 6px;
}
.mega-nav__icon-btn--menu .icon__group > *:nth-child(2) {
  stroke-dashoffset: 0;
}
.mega-nav__icon-btn--menu .icon__group > *:nth-child(3) {
  -webkit-transform-origin: 12px 18px;
		  transform-origin: 12px 18px;
}
.mega-nav__icon-btn--menu.mega-nav__icon-btn--state-b .icon__group > *:nth-child(1) {
  -webkit-transform: translateY(6px) rotate(-45deg);
		  transform: translateY(6px) rotate(-45deg);
}
.mega-nav__icon-btn--menu.mega-nav__icon-btn--state-b .icon__group > *:nth-child(2) {
  stroke-dashoffset: 24;
}
.mega-nav__icon-btn--menu.mega-nav__icon-btn--state-b .icon__group > *:nth-child(3) {
  -webkit-transform: translateY(-6px) rotate(45deg);
		  transform: translateY(-6px) rotate(45deg);
}

/* animated search button */
.mega-nav__icon-btn--search .icon__group {
  -webkit-transform-origin: 12px 12px;
		  transform-origin: 12px 12px;
  -webkit-transform: rotate(0deg);
		  transform: rotate(0deg);
  transition: -webkit-transform 0.3s var(--ease-out);
  transition: transform 0.3s var(--ease-out);
  transition: transform 0.3s var(--ease-out), -webkit-transform 0.3s var(--ease-out);
}
.mega-nav__icon-btn--search .icon__group > *:nth-child(1) {
  stroke-dashoffset: 34;
  stroke-dasharray: 24;
}
.mega-nav__icon-btn--search .icon__group > *:nth-child(2) {
  stroke-dashoffset: 24;
  stroke-dasharray: 24;
}
.mega-nav__icon-btn--search .icon__group > *:nth-child(3) {
  -webkit-transform-origin: 9.5px 9.5px;
		  transform-origin: 9.5px 9.5px;
  -webkit-transform: rotate(45deg);
		  transform: rotate(45deg);
  stroke-dashoffset: 84;
  stroke-dasharray: 42;
  opacity: 1;
}
.mega-nav__icon-btn--search.mega-nav__icon-btn--state-b .icon__group {
  -webkit-transform: rotate(-90deg);
		  transform: rotate(-90deg);
}
.mega-nav__icon-btn--search.mega-nav__icon-btn--state-b .icon__group > *:nth-child(1) {
  stroke-dashoffset: 48;
}
.mega-nav__icon-btn--search.mega-nav__icon-btn--state-b .icon__group > *:nth-child(2) {
  stroke-dashoffset: 48;
}
.mega-nav__icon-btn--search.mega-nav__icon-btn--state-b .icon__group > *:nth-child(3) {
  stroke-dashoffset: 42;
  opacity: 0;
}

/* animated arrow icon */
.mega-nav__arrow-icon {
  font-size: 16px;
  /* icon size */
  color: currentColor;
  /* icon color */
  transition: color 0.2s;
}
.mega-nav__arrow-icon .icon {
  display: block;
}
.mega-nav__arrow-icon .icon__group {
  stroke-width: 1px;
  /* icon stroke width */
  will-change: transform;
  -webkit-transform-origin: 8px 8px;
		  transform-origin: 8px 8px;
  transition: -webkit-transform 0.3s var(--ease-out);
  transition: transform 0.3s var(--ease-out);
  transition: transform 0.3s var(--ease-out), -webkit-transform 0.3s var(--ease-out);
}
.mega-nav__arrow-icon .icon__group > * {
  stroke-dasharray: 17;
  -webkit-transform-origin: 8px 8px;
		  transform-origin: 8px 8px;
  -webkit-transform: translateY(3px);
		  transform: translateY(3px);
  transition: stroke-dashoffset 0.3s, -webkit-transform 0.3s;
  transition: transform 0.3s, stroke-dashoffset 0.3s;
  transition: transform 0.3s, stroke-dashoffset 0.3s, -webkit-transform 0.3s;
  transition-timing-function: var(--ease-out);
}
.mega-nav__arrow-icon .icon__group > *:first-child {
  stroke-dashoffset: 8.5;
}
.mega-nav__arrow-icon .icon__group > *:last-child {
  stroke-dashoffset: 8.5;
}

/* label/divider */
.mega-nav__label {
  color: var(--color-contrast-medium);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: var(--text-xs);
}

/* card */
.mega-nav__card img {
  transition: opacity 0.3s;
}
.mega-nav__card img:hover {
  opacity: 0.85;
}

.mega-nav__card-title {
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.mega-nav__card-title:hover {
  text-decoration: underline;
}

/* --------------------------------

--mobile - style affecting only small screens 👇

-------------------------------- */
.mega-nav--mobile {
  /* sub navigation */
}
.mega-nav--mobile .mega-nav__icon-btns--desktop {
  display: none;
  /* hide --desktop icon buttons */
}
.mega-nav--mobile .mega-nav__nav, .mega-nav--mobile .mega-nav__search {
  display: none;
  position: absolute;
  top: var(--mega-nav-height);
  left: 0;
  width: 100%;
  height: calc(100vh - var(--mega-nav-height) - var(--mega-nav-offset-y, 0px));
  /* set --mega-nav-offset-y in JS */
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background-color: var(--color-bg);
  box-shadow: var(--shadow-lg);
}
.mega-nav--mobile .mega-nav__nav--is-visible, .mega-nav--mobile .mega-nav__search--is-visible {
  display: block;
}
.mega-nav--mobile .mega-nav__nav--is-visible > *, .mega-nav--mobile .mega-nav__search--is-visible > * {
  -webkit-animation: mega-nav-entry-animation 0.5s var(--ease-out);
		  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}
.mega-nav--mobile .mega-nav__nav-inner, .mega-nav--mobile .mega-nav__search-inner {
  padding: var(--space-md) 0;
  width: calc(100% - 2 * var(--component-padding));
  max-width: var(--mega-nav-content-max-width);
  margin-left: auto;
  margin-right: auto;
}
.mega-nav--mobile .mega-nav__label {
  /* label/divider */
  margin: var(--space-lg) 0 var(--space-xs);
}
.mega-nav--mobile .mega-nav__item {
  /* main navigation items */
  border-bottom: 1px solid var(--color-contrast-lower);
}
.mega-nav--mobile .mega-nav__control {
  /* navigation main controls (buttons/links) */
  display: flex;
  align-items: center;
  width: 100%;
  font-size: var(--text-md);
  text-align: left;
  padding: var(--space-sm) 0;
  color: var(--color-contrast-higher);
  text-decoration: none;
  cursor: pointer;
}
.mega-nav--mobile a[aria-current=page] {
  /* current page */
  color: var(--color-primary);
}
.mega-nav--mobile .mega-nav__arrow-icon {
  margin-left: auto;
  margin-right: 12px;
}
.mega-nav--mobile .mega-nav__btn {
  /* button */
  width: 100%;
  margin: var(--space-sm) 0;
  font-size: var(--text-md);
}
.mega-nav--mobile .mega-nav__sub-nav-wrapper {
  /* sub navigation content */
  display: none;
  padding: 0 var(--space-md) var(--space-lg);
  overflow: hidden;
}
.mega-nav--mobile .mega-nav__sub-items {
  /* list of sub items */
}
.mega-nav--mobile .mega-nav__sub-items:not(:last-child) {
  margin-bottom: var(--space-lg);
}
.mega-nav--mobile .mega-nav__sub-item {
  /* sub item */
  border-bottom: 1px solid var(--color-contrast-lower);
}

.mega-nav--mobile .mega-nav__sub-item:hover {cursor: pointer;}
.mega-nav--mobile .mega-nav__sub-link {
  /* sub link */
  display: block;
  color: var(--color-contrast-higher);
  text-decoration: none;
  padding: var(--space-xxs) 0;
}
.mega-nav--mobile .mega-nav__quick-link {
  /* search quick links */
  display: block;
  color: var(--color-contrast-higher);
  text-decoration: none;
  border-bottom: 1px solid var(--color-contrast-lower);
  padding: var(--space-xs) 0;
}
.mega-nav--mobile .mega-nav__sub-nav--layout-1 {
  /* layout 1 -> tabbed content */
}
.mega-nav--mobile .mega-nav__sub-nav--layout-1 .mega-nav__sub-items {
  margin-bottom: 0;
}
.mega-nav--mobile .mega-nav__sub-nav--layout-1 .mega-nav__tabs {
  display: none;
  /* hide tabbed content on smaller screens */
}
.mega-nav--mobile .mega-nav__sub-nav--layout-3 {
  /* layout 3 -> gallery */
  padding-top: var(--space-md);
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  /* auto add new cols */
}
.mega-nav--mobile .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group {
  /* animated arrow icon */
}
.mega-nav--mobile .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group > *:first-child {
  -webkit-transform: translateY(-3px) rotate(-90deg);
		  transform: translateY(-3px) rotate(-90deg);
}
.mega-nav--mobile .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group > *:last-child {
  -webkit-transform: translateY(-3px) rotate(90deg);
		  transform: translateY(-3px) rotate(90deg);
}
.mega-nav--mobile .mega-nav__item--expanded .mega-nav__sub-nav-wrapper {
  display: block;
}
.mega-nav--mobile .mega-nav__item--expanded .mega-nav__sub-nav-wrapper > * {
  -webkit-animation: mega-nav-entry-animation 0.5s var(--ease-out);
		  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}

/* --------------------------------

--desktop - style affecting only big screens 👇

-------------------------------- */
.mega-nav--desktop {
  /* tabs */
  /* icon animation on click */
  /* icon buttons */
}
.mega-nav--desktop .mega-nav__icon-btns--mobile, .mega-nav--desktop .mega-nav__sub-nav-wrapper, .mega-nav--desktop .mega-nav__search, .mega-nav--desktop .mega-nav__label {
  display: none;
}
.mega-nav--desktop .mega-nav__logo {
  flex-shrink: 0;
  margin-right: var(--space-sm);
}
.mega-nav--desktop .mega-nav__nav {
  flex-grow: 1;
  height: 100%;
}
.mega-nav--desktop .mega-nav__nav-inner {
  height: 100%;
  display: flex;
  justify-content: space-between;
  /* navigation layout - change to "flex-end" to push the navigation to the right */
}
.mega-nav--desktop .mega-nav__items {
  display: flex;
  height: 100%;
}
.mega-nav--desktop .mega-nav__item {
  display: flex;
  align-items: center;
}
.mega-nav--desktop .mega-nav__control {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 var(--space-md);
  height: 100%;
  font-size: var(--text-sm);
  color: var(--color-contrast-higher);
  text-decoration: none;
  transition: 0.2s;
}
.mega-nav--desktop .mega-nav__control::after {
  /* marker */
  content: "";
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 1px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
}
.mega-nav--desktop .mega-nav__control .mega-nav__arrow-icon {
  margin-left: var(--space-xxs);
}
.mega-nav--desktop .mega-nav__control:hover {
  cursor: pointer;
  background-color:  rgb(244, 233, 140);
}
.mega-nav--desktop .mega-nav__sub-nav-wrapper, .mega-nav--desktop .mega-nav__search {
  position: absolute;
  top: var(--mega-nav-height);
  left: 0;
  width: 100%;
  background-color: var(--color-bg);
  box-shadow: var(--shadow-lg);
  max-height: calc(100vh - var(--mega-nav-height) - var(--mega-nav-offset-y, 0px));
  /* set --mega-nav-offset-y in JS */
  overflow: auto;
}
.mega-nav--desktop .mega-nav__sub-nav, .mega-nav--desktop .mega-nav__search-inner {
  width: calc(100% - 2 * var(--component-padding));
  margin: 0 auto;
  padding: var(--space-xl) 0;
}
.mega-nav--desktop .mega-nav__sub-nav .mega-nav__label, .mega-nav--desktop .mega-nav__search-inner .mega-nav__label {
  display: block;
}
.mega-nav--desktop .mega-nav__sub-nav {
  max-width: var(--mega-nav-content-max-width);
}
.mega-nav--desktop .mega-nav__search-inner {
  max-width: var(--max-width-xs);
  /* reduce max-width for search content */
}
.mega-nav--desktop .mega-nav__label {
  margin-bottom: var(--space-md);
}

.mega-nav--desktop .mega-nav__sub-item:not(:last-child) {
  margin-bottom: var(--space-xxs);
}

.mega-nav--desktop .mega-nav__sub-item:hover {cursor:pointer;}
.mega-nav--desktop .mega-nav__sub-link {
  font-size: var(--text-sm);
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.mega-nav--desktop .mega-nav__sub-link:hover {
  text-decoration: underline;
  cursor: pointer;
}
.mega-nav--desktop .mega-nav__quick-link {
  /* search quick links */
  display: inline-block;
  margin-bottom: var(--space-xxs);
  font-size: var(--text-sm);
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.mega-nav--desktop .mega-nav__quick-link:hover {
  text-decoration: underline;
}
.mega-nav--desktop .mega-nav__btn {
  font-size: var(--text-sm);
  margin-left: var(--space-sm);
}
.mega-nav--desktop .mega-nav__sub-nav--layout-1 {
  /* layout 1 -> tabbed content */
}
.mega-nav--desktop .mega-nav__sub-nav--layout-1 .mega-nav__sub-items {
  display: none;
  /* hide links */
}
.mega-nav--desktop .mega-nav__sub-nav--layout-1 .mega-nav__tabs {
  display: flex;
}
.mega-nav--desktop .mega-nav__sub-nav--layout-2 {
  /* layout 2 -> multi lists */
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-sm);
}
.mega-nav--desktop .mega-nav__sub-nav--layout-3 {
  /* layout 3 -> gallery */
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-md);
}
.mega-nav--desktop .mega-nav__sub-nav--layout-4 {
  /* layout 4 -> single list */
  text-align: center;
}
.mega-nav--desktop .mega-nav__sub-nav--layout-4 .mega-nav__sub-link {
  font-size: var(--text-lg);
}
.mega-nav--desktop .mega-nav__tabs-controls > *:not(:last-child) {
  border-bottom: 1px solid var(--color-contrast-lower);
}
.mega-nav--desktop .mega-nav__tabs-control {
  display: block;
  width: 100%;
  padding: var(--space-xs);
  overflow: hidden;
  color: var(--color-contrast-higher);
  text-decoration: none;
  cursor: pointer;
  transition: 0.2s;
}
.mega-nav--desktop .mega-nav__tabs-control .icon {
  opacity: 0;
  -webkit-transform: translateX(-10px);
		  transform: translateX(-10px);
  transition: opacity 0.5s, -webkit-transform 0.5s var(--ease-out);
  transition: transform 0.5s var(--ease-out), opacity 0.5s;
  transition: transform 0.5s var(--ease-out), opacity 0.5s, -webkit-transform 0.5s var(--ease-out);
}
.mega-nav--desktop .mega-nav__tabs-control:hover, .mega-nav--desktop .mega-nav__tabs-control[aria-selected=true] {
  color: var(--color-black);

}
.mega-nav--desktop .mega-nav__tabs-control[aria-selected=true] .icon {
  opacity: 1;
  -webkit-transform: translateX(0px);
		  transform: translateX(0px);
}
.mega-nav--desktop .mega-nav__tabs-img {
  display: block;
  overflow: hidden;
  border-radius: var(--radius-lg);
  transition: opacity 0.3s;
}
.mega-nav--desktop .mega-nav__tabs-img:hover {
  opacity: 0.85;
}
.mega-nav--desktop .mega-nav__item--expanded .mega-nav__control {
  /* background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.05); */
}
.mega-nav--desktop .mega-nav__item--expanded .mega-nav__control::after {
  /* marker */
  opacity: 1;
}
.mega-nav--desktop .mega-nav__item--expanded .mega-nav__sub-nav-wrapper {
  display: block;
}
.mega-nav--desktop .mega-nav__item--expanded .mega-nav__sub-nav {
  -webkit-animation: mega-nav-entry-animation 0.5s var(--ease-out);
		  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}
.mega-nav--desktop:not([data-hover=on]) .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group {
  -webkit-transform: rotate(-90deg);
		  transform: rotate(-90deg);
}
.mega-nav--desktop:not([data-hover=on]) .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group > *:first-child, .mega-nav--desktop:not([data-hover=on]) .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group *:last-child {
  stroke-dashoffset: 0;
  -webkit-transform: translateY(0px);
		  transform: translateY(0px);
}
.mega-nav--desktop .mega-nav__icon-btn {
  border-radius: 50%;
  margin-left: var(--space-xxxxs);
}
.mega-nav--desktop .mega-nav__icon-btn:hover,
.mega-nav--desktop .mega-nav__icon-btn--state-b {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.05);
}
.mega-nav--desktop .mega-nav__search--is-visible {
  display: block;
}
.mega-nav--desktop .mega-nav__search--is-visible .mega-nav__search-inner {
  -webkit-animation: mega-nav-entry-animation 0.5s var(--ease-out);
		  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}

.mega-nav__sub-items li.menu-item-object-product_cat {margin-bottom: var(--space-xxs);}
.mega-nav__sub-items li.menu-item-object-product_cat a {font-size: var(--text-sm);
	color: var(--color-contrast-higher);
	text-decoration: none;}


/* animations */
@-webkit-keyframes mega-nav-entry-animation {
  from {
	opacity: 0;
	-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
  }
  to {
	opacity: 1;
	-webkit-transform: translateY(0px);
			transform: translateY(0px);
  }
}
@keyframes mega-nav-entry-animation {
  from {
	opacity: 0;
	-webkit-transform: translateY(-10px);
			transform: translateY(-10px);
  }
  to {
	opacity: 1;
	-webkit-transform: translateY(0px);
			transform: translateY(0px);
  }
}
/* used in JS - detect when the menu needs to switch from --mobile to --desktop layout */
[class*=mega-nav--desktop]::before {
  display: none;
  content: "mobile";
}

@media (min-width: 32rem) {
  .mega-nav--desktop\@xs::before {
	content: "desktop";
  }
}
@media (min-width: 48rem) {
  .mega-nav--desktop\@sm::before {
	content: "desktop";
  }
}
@media (min-width: 64rem) {
  .mega-nav--desktop\@md::before {
	content: "desktop";
  }
}
@media (min-width: 80rem) {
  .mega-nav--desktop\@lg::before {
	content: "desktop";
  }
}
@media (min-width: 90rem) {
  .mega-nav--desktop\@xl::before {
	content: "desktop";
  }
}

.commercekit-wishlist-table .cart button ,
#main-content a,.woocommerce-Price-amount,.price,.posted_in a,.tagged_as a,.search-result a {
	color: #111
}
.woocommerce-cart .entry-content .cart-empty {font-size: 28px;}
.posted_in a,.tagged_as a,.term-description a,.search-result a {
	text-decoration: underline
}

.woocommerce-Price-amount,.woocommerce-variation-price,.price {
	padding: 10px 0;

}

.woocommerce-Price-amount {
	font-size:16px;
	display: inline-block;
 font-weight: 700;

}

.woocommerce .woocommerce-error {
	background: rgba(205, 25, 25, 0.902);
	color: #111
}

.woocommerce .woocommerce-info {
	border: 4px solid  #06b62a;
	color: #222;
	font-size: 16px;
	background: transparent;
}

.woocommerce .woocommerce-message {
	background: #222
}

.woocommerce form .form-row {padding-top:12px;}
.woocommerce address {font-size: 16px;}
.woocommerce-account .button {margin-top:20px !important;}
.woocommerce-MyAccount-content .button {color:#222;}
.search-result {
	display: grid;
	grid-template-columns: 450px auto;
	grid-gap: 50px
}
@media (max-width: 992px) {

.sticky-m .mobile-filter, .sticky-m #cgkitpf-horizontal {top: 0 !important;}


.mobile-filter {
display: block;
position: relative;
z-index: 2;
height: 40px;
padding-left: 40px;
background-color:transparent;
border:none;
box-shadow: none;
text-transform: uppercase;
color: #111;
font-size: 11px;
font-weight: 600;
letter-spacing: .03em;
line-height: 38px;
margin-left: -1.3em;
width: calc(100% + 2.6em);
 top: 0; }

}

.search-results .page-title {
	background-color: transparent;
	font-size: 36px;
	padding-bottom: 0
}

.search-results .search-query {
	font-size: 56px;
	margin-bottom: 50px
}

.search-result {
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: 1px solid #ccc
}

.search-result h2 {
	font-size: 20px
}

.search-result p {
	font-size: 16px
}

strong.search-excerpt {
	font-weight: normal;
	background: #fffd8d;
	padding: 6px
}

a.no-underline {
	text-decoration: none;
	font-weight: 400
}

.card-v9 {
	display: block;
	position: relative;
	z-index: 1;
	text-decoration: none;
	color: inherit;
	background-color: var(--color-contrast-lower);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	transition: 0.3s
}

.card-v9:hover {
	box-shadow: var(--shadow-md)
}

.card-v9__content {
	display: flex;
	height: 100%;
	flex-direction: column;
	position: relative;
	z-index: 2;

}
.card-v9__btn {
	position: relative;
	display: inline-block;
	padding: var(--space-xs) var(--space-sm);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin-bottom: 10px!important;
	margin-left: 20px!important
}


.card-v9__btn i {
	position: relative;
	z-index: 2;
	color: var(--color-black);
	opacity: 0;
	transition: opacity 0.3s;
	font-style: normal;

}

.card-v9__btn::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: var(--radius-md);
	background-color: hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),0.8);
	opacity: 0;
	-webkit-transform: translateY(25%);
	transform: translateY(25%);
	transition: opacity 0.3s,-webkit-transform 0.3s var(--ease-out);
	transition: opacity 0.3s,transform 0.3s var(--ease-out);
	transition: opacity 0.3s,transform 0.3s var(--ease-out),-webkit-transform 0.3s var(--ease-out)
}

.card-v9:hover .card-v9__btn i {
	opacity: 1
}

.card-v9:hover .card-v9__btn::after {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0)
}

.card-v9--overlay-bg::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: hsla(var(--color-bg-h),var(--color-bg-s),var(--color-bg-l),0.5);
	transition: background-color 0.3s
}

.card-v9--overlay-bg:hover::before {
	background-color: hsla(var(--color-bg-h),var(--color-bg-s),var(--color-bg-l),0.8)
}

.archive #main-content {
	background: #fff!important
}

#left-area ul.list-horizontal {
	padding: 10px 0;
	text-align: left
}

.list-horizontal li {
	display: inline-block;
	padding-bottom: .2rem
}

.list-horizontal li:before {
	content: '\00a0\29BF\00a0\00a0';
	color: #999;
	color: rgba(115,115,115,0.8)
}

.list-horizontal li:first-child:before {
	content: ''
}

body.paged.archive .woocommerce-products-header picture {
	display: none
}

.woocommerce-products-header {
	display: grid;
	grid-template-columns: 450px auto;
	grid-gap: 50px
}

.woocommerce-products-header h1 {
	grid-column: 1 / -1
}

@media screen and (max-width: 900px) {
	.woocommerce-products-header {
		grid-template-columns:none
	}
}

.woocommerce-result-count {
	padding: 15px 0
}
@media screen and (max-width: 900px) {

	.woocommerce-result-count { display: none;}

}

body.archive .term-description {
	padding-bottom: 35px;
	line-height: 1.9;
	font-weight: 300;
	color: #222;
	max-width: 750px
}

a.button.wc-backward:hover {
	color: #333
}

.amount_needed {
	border: 1px solid black!important
}



.coupon button.button:hover {
	padding: .3em 1em
}

table.shop_table.shop_table_responsive.cart.woocommerce-cart-form__contents button.button:after {
	display: none
}

table.shop_table.shop_table_responsive.cart.woocommerce-cart-form__contents button.button {
	padding: .3em 1em
}

.coupon button.button:after {
	display: none
}



.cart-header .mini-count {
	display: inline-block;
	position: relative;
	top: -23px;
	left: 14px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #444;
	border: 1px solid #444;
	font-size: 9px;
	line-height: 18px;
	text-align: center;
	transition: .2s all;
	color: #fff;
}
.cart-header svg {

	width: 18px;
	height: auto;
}


.cart-header {
	font-size: .9rem;
	padding: 0.7rem 1rem;
	text-decoration: none;
	position: relative;
	top: 12px;
	right: 5px;
}


/* mobile */
#masthead .cart-header {
	padding:0;
	top: 5px;
	right: 5px;
}


input#length_needed {
	padding: 4px 10px;
	border: 0px
}

input#width_needed {
	padding: 4px 10px;
	border: 0px
}


.fpd-product-designer-wrapper {
	margin-top: 30px
}

div#fancy-product-designer-420 {
	width: 100%!important
}


input#pwgc-redeem-gift-card-number {
	padding: 14px 16px 14px 16px;
	border: 2px solid rgb(244, 233, 140);
	border-radius: 3px;
	font-size: 17px
}

#pwgc-redeem-gift-card-form input#pwgc-redeem-button:hover {
	background: #95aaad;
	color: #fff!important;
	cursor: pointer
}

input#pwgc-redeem-button {
	padding: 13px 20px 13px 20px!important;
	border: 0px;
	color: #fff;
	font-weight: 600;
	background: rgb(244, 233, 140);;
	font-size: 15px;
	border-radius: 2px;
	display: inline-block;
	position: absolute;
	margin-left: 6px
}
.wc-proceed-to-checkout,
p.form-submit,
#place_order,
.woocommerce-checkout h3#order_review_heading {
	margin-top: 20px
}
#secondary input[type=search] {font-size: 14px;}

a.reset_variations {
	display: inline-block;
margin-top:10px;}
a.reset_variations:before {
	content: ' x ';


}
.button-benefits {margin-bottom: 35px; line-height: 1.2rem;}
.button-benefits + div::before {
	content: "Tip! ";
}
.list-vink {font-size: 14px;}
.woocommerce-Tabs-panel--description li::before,
.woocommerce-product-details__short-description li::before,
.list-vink::before {
content: " ";
background: url('/wp-content/themes/cookie-child/img/d-check.svg') no-repeat;
width: 16px;
height: 16px;
display: inline-block;
margin-right: 0.5em;

top: 4px;
position: relative;

}

#price_calculator tr.calculated-price td,
#price_calculator tr.total-amount td {

	font-size: 14px !important;
	font-weight: 700 !important;

}
#price_calculator tr.calculated-price td {
	padding-bottom:30px !important;
}

.cgkit-as-wrap .cgkit-attribute-swatches .cgkit-attribute-swatch.cgkit-image > button.cgkit-swatch-selected:before {
border:none;
}
.cgkit-as-wrap .cgkit-attribute-swatches .cgkit-attribute-swatch.cgkit-image > button.cgkit-swatch-selected {
box-shadow: 0 5px 10px rgb(0 0 0 / 0.3);
position: relative;
bottom: 6px;
}


.wc-measurement-price-calculator-price,
.woocommerce-variation-price .woocommerce-Price-amount {
	font-weight: 700;
	font-size: 20px;
}
.wc-measurement-price-calculator-price
.woocommerce-checkout input#pwgc-redeem-button {
	padding: 14px 20px!important;
	border: 0px;
	color: #fff;
	font-weight: 600;
	background: rgb(244, 233, 140);
	font-size: 15px;
	border-radius: 2px;
	display: inline-block;
	position: absolute;
	width: 270px;
	margin-left: 0px
}

button.button:hover {
	color: #161515!important
}

input#pwgc-redeem-button:hover {
	color: #161515!important
}

a.checkout-button.button.alt.wc-forward:hover {
	color: #161515!important
}

li.centered-inline-logo-wrap {
	width: 200px!important
}

#top-menu li a {
	font-weight: 500
}

header#main-header {
	box-shadow: none!important
}

header#main-header {
	background: transparent!important
}

nav#top-menu-nav {
	margin-top: 17px
}


span.select_page {
	display: none!important
}

.mobile_nav.closed {
	float: right!important;
	padding: 20px 20px 15px 23px!important
}



.mobile_nav.opened {
	background: transparent!important
}

.archive #main-content {
	background-color: #f3f3f3
}

.single-product #main-content {
	background: #fff;
	padding-top: 80px
}

nav.woocommerce-breadcrumb {
	display: none
}


.rank-math-breadcrumb {
	font-size: 14px;
	position: absolute;
	top: -47px;
	left: 20px;
}

.rank-math-breadcrumb .last {display:inline-block}
	body.post-type-archive-product .rank-math-breadcrumb {
		top: 223px;
		right: 32px;
		left: unset;
}
@media (min-width: 771px) {
	.rank-math-breadcrumb  {

		top: -42px;
		left: 235px;
	  }
	  body.post-type-archive-product .rank-math-breadcrumb  {

	top: 160px;
	left: unset;
	right: 30px;
  }
}


@media (min-width: 1081px) {
	.rank-math-breadcrumb  {

		left: 120px;
		top: -44px;
	  }
	  body.post-type-archive-product .rank-math-breadcrumb  {

	left: 20%;
	top: 190px;
  }
}






button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed {
	color: #fff;
	border: 0px
}

table.variations th {
	padding: 0!important
}



.logged-in .woocommerce {
	margin-bottom: 40px
}

.mob {
	margin-left: 30px;
	position: relative;
	margin-bottom: 10px
}

.mob:before {
	content: '';
	width: 20px;
	height: 20px;
	position: absolute;
	left: -30px;
	top: 6px;
	background-size: 100%;
	background-repeat: no-repeat;
	background-image: url(/wp-content/uploads/2020/03/phone.svg)
}

.mob a:hover {
	color: #e6bd13!important
}

.mail {
	margin-left: 30px;
	position: relative;
	margin-bottom: 10px
}

.mail:before {
	content: '';
	width: 20px;
	height: 20px;
	position: absolute;
	left: -30px;
	top: 6px;
	background-size: 100%;
	background-repeat: no-repeat;
	background-image: url(/wp-content/uploads/2020/03/mail.svg)
}

.mail a:hover {
	color: #e6bd13!important
}


.wpcf7 input[type="text"],.wpcf7 input[type="email"],.wpcf7 textarea {
	background-color: #eeeeee;
	padding: 12px;
	border: 0px;
	width: 100%;
	font-size: 14px
}

.wpcf7 textarea {
	min-height: 120px;
	min-width: 100%
}

.wpcf7 input[type="submit"] {
	color: #FFF;
	background-color: rgb(244, 233, 140);
	border: 0;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 14px;
	padding-right: 14px;
	cursor: pointer;
	font-size: 120%;
	border-radius: 4px;
	float: right
}

.tm-extra-product-options-select {
	padding-left: 0px!important;
	padding-top: 6px!important
}

.tm-extra-product-options-fields select {
	height: 40px;
	font-size: 16px
}

.et_pb_shop_grid .woocommerce-Price-amount {
	display: inline-block!important
}

.blokken-3 a,.vierkant-2 li,.vierkant-2 a,.breed-2 li {
	background-size: cover;
	background-clip: padding-box;
	min-height: 350px;
	width: auto;
	background-position: center
}

.blokken-3 li.nr-0 {
	border-bottom-left-radius: 15px;
	border-top-left-radius: 15px
}

.blokken-3 li.nr-2 {
	border-bottom-right-radius: 15px;
	border-top-right-radius: 15px
}



.breed-2 .nr-0 .titleProduct {
	display: none
}

.teaser h1 {
	border-bottom-width: 0!important;
	font-size: 28px
}

/* Product cards */
/* --------------------------------

File#: _1_product-card
Title: Product Card
Descr: A selection of product information used as teasers for further content
Usage: codyhouse.co/license

-------------------------------- */

.prod-card {
  position: relative;
}

.prod-card__img-link {
  text-decoration: none;
  display: block;
}
.prod-card__img-link:hover .prod-card__img {
  opacity: 0.85;
}

.prod-card__img {
  transition: opacity 0.2s;
}
.prod-card__img img {
  display: block;
  width: 100%;
}

.prod-card__badge {
  position: absolute;
  z-index: 1;
  top: var(--space-xs);
  right: var(--space-xs);
  background-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), 0.95);
  padding: var(--space-xxs) var(--space-sm);
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-contrast-high);
  font-weight: 500;
}

.prod-card__price--old {
  color: var(--color-accent);
  text-decoration: line-through;
}
.prod-card__price--old::before {
  content: "original price";
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
		  clip-path: inset(50%);
}

.prod-card__price--new {
  text-decoration: none;
}
.prod-card__price--new::before {
  content: "discounted price";
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
		  clip-path: inset(50%);
}

/* END product cards */
/* --------------------------------

File#: _1_background-decoration-v3
Title: Background Decoration v3
Descr: A collection of geometry background decorations
Usage: codyhouse.co/license

-------------------------------- */
.bg-decoration-v3 {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.bg-decoration-v3__svg {
  position: absolute;
  width: 134%;
  min-width: 1280px;
  max-width: 1920px;
  height: auto;
}


div#footer-info a {
	color: #fff
}

div#footer-info {
	color: #fff
}



#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
	content: "\4d"!important
}

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle::before {
	content: "\33"!important
}

#main-header #mobile_menu.et_mobile_menu .sub-menu-toggle.popped::before {
	content: "\32"!important
}

.mobile_nav ul#mobile_menu .current_page_item>a {
	color: #f1e68a!important
}

#main-footer .footer-widget h4 {
	font-weight: 600
}


.link, .text-component a:not(.btn),.et-main-area a,.product-name a {
	color: #222!important;
	font-size: 1.3rem;
	text-decoration: none;
	margin-top: 1em;
	display: inline-block;
	font-weight: bold;
	padding: 0.5em;
	margin-left: -0.5em;
	position: relative;
	clip-path: polygon(0 0,100% 0,100% 100%,0% 100%)
}


body #ship-to-different-address {
	font-size: 16px;
	margin: 45px 0;
	padding: 0;
	border: 0;
}
body #ship-to-different-address span {border-radius: 8px; color: #fff; background:#222; border:1px solid rgba(0,0,0,0.34); padding:8px;}
body #ship-to-different-address span::before {
	content: " ";
	background: url('/wp-content/themes/cookie-child/img/different-address.svg') no-repeat;
	width: 16px;
	height: 16px;
	display: inline-block;
	margin-right: 0.5em;

	top: 1px;
	position: relative;

}
a.woocommerce-review-link,.woocommerce a.button.alt,.woocommerce-page a.button.alt,a.shipping-calculator-button {
	color: #222!important
}

.comment-form-rating a,.woocommerce .star-rating span:before,.woocommerce-page .star-rating span:before {
	color: #ffae42
}

.woocommerce a.button.alt,.woocommerce-page a.button.alt {
	border-color: #222
}

.product-name a:before,.product-name a:after,.et-main-area a:before,.et-main-area a:after,.text-component a:not(.btn):before,.text-component a:not(.btn):after {
	position: absolute;
	content: "";
	border-bottom: 3px solid #222;
	border-radius: 1em;
	bottom: 0.3em;
	transition: transform 0.5s cubic-bezier(0.075,0.82,0.165,1)
}

.text-component a:not(.btn):before,.et-main-area a:before,.product-name a:before {
	width: 1em;
	transform-origin: left
}

.text-component a:not(.btn):after,.et-main-area a:after,.product-name a:after {
	width: 50%;
	left: 1em;
	transform: translateX(110%)
}

.text-component a:not(.btn):hover:before,.et-main-area a:hover:before,.product-name a:hover:before {
	transform: scaleX(0.3)
}

.text-component a:not(.btn):hover:after,.et-main-area a:hover:after,.product-name a:hover:after {
	transform: translateX(0)
}


.teaser h2 {
	border-bottom-width: 0!important;
	font-size: 28px
}

.compare-slider {
	position: relative
}

.compare-slider img {
	display: block;
	width: 100%;
	pointer-events: none
}

.compare-slider__inner {
	position: relative
}

.compare-slider__img {
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow: hidden
}

.compare-slider__caption {
	position: absolute;
	bottom: 0;
	font-size: var(--text-sm);
	padding: var(--space-sm);
	background-color: hsla(var(--color-black-h),var(--color-black-s),var(--color-black-l),0.75);
	color: var(--color-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	transition: opacity 0.3s,visibility 0.3s,-webkit-transform 0.3s;
	transition: opacity 0.3s,visibility 0.3s,transform 0.3s;
	transition: opacity 0.3s,visibility 0.3s,transform 0.3s,-webkit-transform 0.3s
}

.compare-slider__img--original .compare-slider__caption {
	right: 0
}

.compare-slider__img--modified .compare-slider__caption {
	left: 0
}

.compare-slider__handle {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	height: 44px;
	width: 44px;
	border-radius: 50%;
	color: var(--color-contrast-higher);
	background-color: var(--color-bg);
	box-shadow: var(--shadow-sm);
	cursor: -webkit-grab;
	cursor: grab;
	will-change: left;
	align-items: center;
	justify-content: center;
	-webkit-transform: translateY(-50%) translateX(-50%) scale(0);
	transform: translateY(-50%) translateX(-50%) scale(0);
	margin-left: -1px
}

.compare-slider--is-dragging .compare-slider__handle {
	cursor: -webkit-grabbing;
	cursor: grabbing;
	box-shadow: var(--shadow-sm),0 0 0 4px hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),0.5)
}

.compare-slider__input-handle {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	pointer-events: none;
	opacity: 0
}

.compare-slider__input-handle:focus+.compare-slider__handle {
	color: var(--color-primary);
	box-shadow: var(--shadow-sm),0 0 0 4px hsla(var(--color-contrast-higher-h),var(--color-contrast-higher-s),var(--color-contrast-higher-l),0.5)
}

.compare-slider__img--modified {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 0%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	border-right: 2px solid var(--color-bg);
	will-change: width
}

.compare-slider__img--modified img {
	height: 100%;
	width: auto;
	max-width: none
}

.compare-slider--in-viewport .compare-slider__img--modified {
	width: 50%;
	-webkit-animation: compare-slider-bounce-in 0.7s;
	animation: compare-slider-bounce-in 0.7s
}

.compare-slider__caption {
	opacity: 0;
	-webkit-transform: translateY(20px);
	transform: translateY(20px)
}

.compare-slider--in-viewport .compare-slider__caption {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0)
}

.compare-slider--in-viewport .compare-slider__caption--is-hidden {
	opacity: 0;
	visibility: hidden
}

.compare-slider__img--original .compare-slider__caption--is-hidden {
	-webkit-transform: translateX(30px);
	transform: translateX(30px)
}

.compare-slider__img--modified .compare-slider__caption--is-hidden {
	-webkit-transform: translateX(-30px);
	transform: translateX(-30px)
}

.compare-slider__handle {
	display: block;
	display: flex;
	opacity: 0
}

.compare-slider--in-viewport .compare-slider__handle {
	transition: opacity 0s 0.7s,-webkit-transform 0.3s 0.7s;
	transition: transform 0.3s 0.7s,opacity 0s 0.7s;
	transition: transform 0.3s 0.7s,opacity 0s 0.7s,-webkit-transform 0.3s 0.7s;
	-webkit-transform: translateY(-50%) translateX(-50%) scale(1);
	transform: translateY(-50%) translateX(-50%) scale(1);
	opacity: 1
}

.compare-slider__input-handle {
	display: block
}

.compare-slider--reduced-motion .compare-slider__img--modified {
	-webkit-animation: none;
	animation: none
}

.compare-slider--reduced-motion .compare-slider__handle,.compare-slider--reduced-motion .compare-slider__caption {
	transition: none
}

@-webkit-keyframes compare-slider-bounce-in {
	0% {
		width: 0%
	}

	60% {
		width: 55%
	}

	100% {
		width: 50%
	}
}

@keyframes compare-slider-bounce-in {
	0% {
		width: 0%
	}

	60% {
		width: 55%
	}

	100% {
		width: 50%
	}
}

.swipe-content {
	height: 280px;
	width: 280px;
	background-color: var(--color-contrast-low);
	border-radius: var(--radius-md);
	cursor: default;
	transition: background 0.2s
}

.swipe-content:active {
	background-color: var(--color-contrast-medium)
}

.footer-widget h4,#main-footer .widget_block h1,#main-footer .widget_block h2,#main-footer .widget_block h3,#main-footer .widget_block h4,#main-footer .widget_block h5,#main-footer .widget_block h6 {
	color: white!important
}




/* --------------------------------

File#: _2_carousel
Title: Carousel
Descr: Display and cycle through a collection of items
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --carousel-grid-gap: var(--space-xs);
  --carousel-item-auto-size: 260px;
  --carousel-transition-duration: 0.5s;
}

.carousel {
  position: relative;
}

.carousel__list {
  display: flex;
  flex-wrap: nowrap;
  will-change: transform;
}

.carousel__item {
  flex-shrink: 0;
  width: var(--carousel-item-auto-size);
  margin-right: var(--carousel-grid-gap);
  margin-bottom: var(--carousel-grid-gap);
}

.carousel__list--animating {
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  transition-duration: var(--carousel-transition-duration);
  transition-timing-function: var(--ease-out);
}

.carousel__item {
  opacity: 0;
  margin-bottom: 0;
}

.carousel--loaded .carousel__item {
  opacity: 1;
}

.carousel:not(.carousel--is-dragging) .carousel__list:not(.carousel__list--animating) .carousel__item[tabindex="-1"] > * {
  visibility: hidden;
}

.carousel[data-drag=on] .carousel__item {
  -webkit-user-select: none;
	 -moz-user-select: none;
	  -ms-user-select: none;
		  user-select: none;
}
.carousel[data-drag=on] .carousel__item img {
  pointer-events: none;
}

.carousel__control {
  --size: 40px;
  width: 40px;
  height: 40px;
  display: flex;
  /* background-color: var(--color-bg-light);
  border-radius: 50%;
  box-shadow: var(--inner-glow), var(--shadow-sm); */
  z-index: 1;
  transition: 0.2s;
}
.carousel__control:active {
  -webkit-transform: translateY(1px);
		  transform: translateY(1px);
}
.carousel__control:hover {
  background-color: var(--color-bg-lighter);
  box-shadow: var(--inner-glow), var(--shadow-md);
}
.carousel__control[disabled] {
  pointer-events: none;
  opacity: 0.5;
  box-shadow: none;
}
.carousel__control .icon {
  --size: 20px;
  display: block;
  margin: auto;
}

.carousel__navigation {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, 10px);
  gap: var(--space-xs);
  justify-content: center;
  align-items: center;
  margin-top: var(--space-sm);
}

.carousel__nav-item {
  display: inline-block;
  margin: 0 var(--space-xxxs);
}
@supports (grid-area: auto) {
  .carousel__nav-item {
	margin: 0;
  }
}
.carousel__nav-item button {
  display: block;
  position: relative;
  font-size: 10px;
  height: 1em;
  width: 1em;
  border-radius: 50%;
  background-color: var(--color-contrast-high);
  opacity: 0.4;
  cursor: pointer;
  transition: background 0.3s;
}
.carousel__nav-item button::before {
  content: "";
  position: absolute;
  top: calc(50% - 0.5em);
  left: calc(50% - 0.5em);
  font-size: 16px;
  height: 1em;
  width: 1em;
  border-radius: inherit;
  border: 1px solid var(--color-contrast-high);
  opacity: 0;
  -webkit-transform: scale(0);
		  transform: scale(0);
  transition: 3s;
}
.carousel__nav-item button:focus {
  outline: none;
}
.carousel__nav-item button:focus::before {
  opacity: 1;
  -webkit-transform: scale(1);
		  transform: scale(1);
}

.carousel__nav-item--selected button {
  opacity: 1;
}

.carousel__navigation--pagination {
  grid-template-columns: repeat(auto-fit, 24px);
}
.carousel__navigation--pagination .carousel__nav-item button {
  width: 24px;
  height: 24px;
  color: var(--color-bg);
  font-size: 12px;
  line-height: 24px;
  border-radius: var(--radius-md);
  text-align: center;
}
.carousel__navigation--pagination .carousel__nav-item button:focus {
  outline: 1px solid var(--color-primary);
  outline-offset: 2px;
}

.carousel--hide-controls .carousel__navigation, .carousel--hide-controls .carousel__control {
  display: none;
}


/* --------------------------------

File#: _1_feature-v9
Title: Feature v9
Descr: A feature section with 2 blocks
Usage: codyhouse.co/license

-------------------------------- */
.feature-v9:hover .feature-v9__block:not(:hover) .feature-v9__content {
  opacity: 0.5;
}
.feature-v9:hover .feature-v9__block:not(:hover)::after {
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.8);
  -webkit-backdrop-filter: grayscale(100%);
		  backdrop-filter: grayscale(100%);
}

.feature-v9__block {
  position: relative;
  display: flex;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: var(--space-xl) var(--space-md);
  min-height: 350px;
}
.feature-v9__block::before, .feature-v9__block::after {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  width: 100%;
  transition: 0.2s;
}
.feature-v9__block::before {
  height: 70%;
  background: linear-gradient(hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0), hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.8));
  mix-blend-mode: multiply;
}
.feature-v9__block::after {
  height: 100%;
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0);
}
.feature-v9__block:hover .feature-v9__content {
  -webkit-transform: translateY(-10px);
		  transform: translateY(-10px);
}
@media (min-width: 48rem) {
  .feature-v9__block {
	min-height: 450px;
  }
}
@media (min-width: 64rem) {
  .feature-v9__block {
	min-height: 600px;
  }
}
@media (min-width: 80rem) {
  .feature-v9__block {
	min-height: 700px;
  }
}

.feature-v9__content {
  position: relative;
  z-index: 2;
  color: var(--color-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: auto auto 0;
  transition: 0.2s;
}

.feature-v9__link {
  color: var(--color-black);
  text-decoration: none;
  display: inline-block;
  padding: var(--space-xs) var(--space-md);
  background-color: hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.8);
  border-radius: var(--radius-md);
  -webkit-backdrop-filter: blur(5px);
		  backdrop-filter: blur(5px);
  transition: background-color 0.2s;
}
.feature-v9__link:hover {
  background-color: hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 1);
}



/* SMART COOKIE START */



/* Filter shop */
.select2-results__option {font-size: 14px;}
.widget-title, .wp-block-heading {font-size: 16px !important;}

/* Mollie choose bank select */
.payment_box select {
	border:1px solid #222;
	border-radius:6px;
	padding:6px;
	font-size:14px;

}
/* --------------------------------

File#: _1_main-footer-v5
Title: Main Footer v5
Descr: Footer navigation template
Usage: codyhouse.co/license

-------------------------------- */
.footer-v5 {
  position: relative;
  z-index: 1;

}
@media (min-width: 64rem) {
.footer-v5 {
	margin:20px;
	  box-shadow: -20px -20px 30px rgba(255,255,255,1),
	  20px 20px 30px rgba(255,255,255,1);
  }
  }

.drawer .footer-v5__popular-link,
.footer-v5__popular-link {
  display: inline-block;
  padding: var(--space-xxs);
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
  border-radius: var(--radius-md);
  color: var(--color-contrast-medium);
  line-height: 1;
  transition: 0.2s;
}
.drawer .footer-v5__popular-link:hover,
.footer-v5__popular-link:hover {
  color: var(--color-contrast-high);
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
}

.footer-v5__back-to-top {
  color: var(--color-contrast-medium);
  transition: color 0.2s;
}

.footer-v5__back-to-top:hover {
  color: var(--color-contrast-high);
}





.footer-v5__link {
  color: var(--color-white);
  text-decoration: none;
  transition: color 0.2s;
  font-size: 16px;
}

.drawer li {
list-style: none;
font-size: 16px;
line-height: 1.8em;
}

.drawer li a.footer-v5__link{
  --c: #222; /* the color */

  color: #0000;
  background:
	linear-gradient(90deg,#fff 50%,var(--c) 0) calc(100% - var(--_p,0%))/200%,
	linear-gradient(var(--c) 0 0) 0% 100%/var(--_p,0%) no-repeat,
	var(--_c,#0000);
  -webkit-background-clip: text,padding-box,padding-box;
		  background-clip: text,padding-box,padding-box;
  transition: 0s ,color .5s,background-color .5s;
  text-decoration: none;
  padding: 8px;
  border-radius: 6px;
}

.drawer li a.footer-v5__link:hover {
  color: #fff;
  --_c: var(--c);
  --_p: 100%;
  transition: 0.5s,color 0s .5s,background-color 0s .5s;
  text-decoration: none;
}


.mobile-toggled .mobile-menu.close-drawer, .mobile-overlay {display: none; visibility: hidden !important;}

.drawer a.footer-v5__link:hover,
footer a.footer-v5__link:hover,
footer a:not(.btn):hover {
  color: var(--color-white);
  text-decoration: underline;
  }
.drawer .text-component a.footer-v5__link:hover,.modal a.btn--subtle:hover  { color: var(--color-black);}

.footer-v5__social-btn {
  display: block;
  text-decoration: none;
  color: var(--color-contrast-medium);
  transition: color 0.2s;
}
.footer-v5__social-btn .icon {
  display: block;
}
.footer-v5__social-btn:hover {
  color: var(--color-contrast-high);
}
.footer-v5 a {
	color: #fff;
}
/* --------------------------------

File#: _1_video-feature
Title: Video Feature
Descr: A CTA box over a background video
Usage: codyhouse.co/license

-------------------------------- */
.video-feature {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.video-feature__box-wrapper {
  position: relative;
  z-index: 2;
}

.video-feature__box {
  background-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), 0.98);
}
@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
  .video-feature__box {
	background-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), 0.8);
	-webkit-backdrop-filter: blur(10px);
			backdrop-filter: blur(10px);
  }
}

.video-feature__video-wrapper {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.video-feature__video-wrapper img, .video-feature__video-wrapper video {
  position: absolute;
  top: 0;
  left: 0;
  -o-object-fit: cover;
	 object-fit: cover;
  height: 100%;
  width: 100%;
}
.video-feature__video-wrapper img {
  display: none;
}
@media (prefers-reduced-motion: reduce) {
  .video-feature__video-wrapper video {
	visibility: hidden;
  }
  .video-feature__video-wrapper img {
	display: block;
  }
}

.video-feature__link {
  --transition-duration: .4s;
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
  border-radius: inherit;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  color: var(--color-contrast-higher);
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: var(--transition-duration);
}
.video-feature__link > * {
  position: relative;
  z-index: 2;
}
.video-feature__link::before {
  content: "";
  position: absolute;
  bottom: -20%;
  left: -5%;
  width: 110%;
  height: 140%;
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.9);
  will-change: transform;
  -webkit-transform: scaleY(0) skewY(10deg);
		  transform: scaleY(0) skewY(10deg);
  -webkit-transform-origin: center bottom;
		  transform-origin: center bottom;
  transition: -webkit-transform var(--transition-duration) var(--ease-in-out);
  transition: transform var(--transition-duration) var(--ease-in-out);
  transition: transform var(--transition-duration) var(--ease-in-out), -webkit-transform var(--transition-duration) var(--ease-in-out);
}
.video-feature__link:hover {
  color: var(--color-bg);
}
.video-feature__link:hover::before {
  -webkit-transform: scaleY(1) skewY(0deg);
		  transform: scaleY(1) skewY(0deg);
}
.video-feature__link:hover .video-feature__link-icon > *:first-child {
  -webkit-transform: rotate(-180deg);
		  transform: rotate(-180deg);
}
.video-feature__link:hover .video-feature__link-icon > *:last-child {
  -webkit-transform: rotate(180deg);
		  transform: rotate(180deg);
}

.video-feature__link-icon > * {
  will-change: transform;
  transition: -webkit-transform var(--transition-duration) var(--ease-in-out);
  transition: transform var(--transition-duration) var(--ease-in-out);
  transition: transform var(--transition-duration) var(--ease-in-out), -webkit-transform var(--transition-duration) var(--ease-in-out);
}
.video-feature__link-icon > *:first-child {
  -webkit-transform-origin: 8px 5px;
		  transform-origin: 8px 5px;
}
.video-feature__link-icon > *:last-child {
  -webkit-transform-origin: 8px 11px;
		  transform-origin: 8px 11px;
}



.woocommerce a.button.alt,
.woocommerce-page a.button.alt,
a.shipping-calculator-button,
.woocommerce-terms-and-conditions-wrapper a,
a.page-numbers,
a.reset_variations {
  color: #222 !important;
  text-decoration: none !important;
}
.comment-form-rating a,
li.current-menu-item > a {
  color: #f1e68a;
}



.woocommerce a.button.alt,
.woocommerce-page a.button.alt {
  border-color: #222;
}
a.reset_variations {
  border: 1px solid #444;
  padding: 3px;
}
a.reset_variations:before {
  position: relative;
  left: 4px;
  margin-right: 6px;
  font-size: 16px;
  content: "x ";
}
.et_pb_text_inner a,
.link,
.text-component a:not(.btn),
.et-main-area a,
.product-name a {
  color: #222 !important;
  font-size: 1.3rem;
  text-decoration: none;
  margin-top: 1em;
  display: inline-block;
  font-weight: bold;
  padding: 0.5em;
  margin-left: -0.5em;
  position: relative;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
li.current-menu-item > a:before,
#top-menu li.current_page_item > a:before {
  border-bottom: 3px solid #222;
  border-radius: 1em;
  bottom: 0.3em;
}

li.current-menu-item > a:before,
#top-menu li.current_page_item > a:before,
.et_pb_text_inner a:before,
.et_pb_text_inner a:after,
.product-name a:before,
.product-name a:after,
.et-main-area a:before,
.et-main-area a:after,
.text-component a:not(.btn):before,
.text-component a:not(.btn):after {
  position: absolute;
  content: "";
  border-bottom: 3px solid #222;
  border-radius: 1em;
  bottom: 0.3em;
  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.et_pb_text_inner a:before,
.text-component a:not(.btn):before,
.et-main-area a:before,
.product-name a:before {
  width: 1em;
  transform-origin: left;
}
.et_pb_text_inner a:after,
.text-component a:not(.btn):after,
.et-main-area a:after,
.product-name a:after {
  width: 50%;
  left: 1em;
  transform: translateX(110%);
}
.et_pb_text_inner a:before,
.text-component a:not(.btn):hover:before,
.et-main-area a:hover:before,
.product-name a:hover:before {
  transform: scaleX(0.3);
}
.et_pb_text_inner a:after,
.text-component a:not(.btn):hover:after,
.et-main-area a:hover:after,
.product-name a:hover:after {
  transform: translateX(0);
}

.blokken-3 a,
.vierkant-2 li,
.blokken-3 li,
.vierkant-2 a,
.breed-2 li {
  background-size: cover !important;
  background-clip: padding-box !important;
  min-height: 350px !important;
  width: auto !important;
  background-position:  center !important;
}

.blokken-3 li.nr-0 {
  border-bottom-left-radius: 15px;
  border-top-left-radius: 15px;
}

.blokken-3 li.nr-2 {
  border-bottom-right-radius: 15px;
  border-top-right-radius: 15px;
}



.breed-2 .nr-0 .titleProduct {
  display: none;
}
.teaser h2 {
  border-bottom-width: 0 !important;
  font-size: 28px;
}

/* --------------------------------

File#: _2_image-comparison-slider
Title: Image Comparison Slider
Descr: A draggable image slider used to compare two versions of the same image
Usage: codyhouse.co/license

-------------------------------- */
.compare-slider {
  position: relative;
}
.compare-slider img {
  display: block;
  width: 100%;
  pointer-events: none;
}

.compare-slider__inner {
  position: relative;
}

.compare-slider__img {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;
}

.compare-slider__caption {
  position: absolute;
  bottom: 0;
  font-size: var(--text-sm);
  padding: var(--space-sm);
  background-color: hsla(
	var(--color-black-h),
	var(--color-black-s),
	var(--color-black-l),
	0.75
  );
  color: var(--color-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  transition: opacity 0.3s, visibility 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s;
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s,
	-webkit-transform 0.3s;
}

.compare-slider__img--original .compare-slider__caption {
  right: 0;
}

.compare-slider__img--modified .compare-slider__caption {
  left: 0;
}

.compare-slider__handle {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 44px;
  width: 44px;
  border-radius: 50%;
  color: var(--color-contrast-higher);
  background-color: var(--color-bg);
  box-shadow: var(--shadow-sm);
  cursor: -webkit-grab;
  cursor: grab;
  will-change: left;
  align-items: center;
  justify-content: center;
  -webkit-transform: translateY(-50%) translateX(-50%) scale(0);
  transform: translateY(-50%) translateX(-50%) scale(0);
  margin-left: -1px;
}

.compare-slider--is-dragging .compare-slider__handle {
  cursor: -webkit-grabbing;
  cursor: grabbing;
  box-shadow: var(--shadow-sm),
	0 0 0 4px
	  hsla(
		var(--color-contrast-higher-h),
		var(--color-contrast-higher-s),
		var(--color-contrast-higher-l),
		0.5
	  );
}

.compare-slider__input-handle {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  opacity: 0;
}

.compare-slider__input-handle:focus + .compare-slider__handle {
  color: var(--color-primary);
  box-shadow: var(--shadow-sm),
	0 0 0 4px
	  hsla(
		var(--color-contrast-higher-h),
		var(--color-contrast-higher-s),
		var(--color-contrast-higher-l),
		0.5
	  );
}

.compare-slider__img--modified {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  border-right: 2px solid var(--color-bg);
  will-change: width;
}
.compare-slider__img--modified img {
  height: 100%;
  width: auto;
  max-width: none;
}

.compare-slider--in-viewport .compare-slider__img--modified {
  width: 50%;
  -webkit-animation: compare-slider-bounce-in 0.7s;
  animation: compare-slider-bounce-in 0.7s;
}

.compare-slider__caption {
  opacity: 0;
  -webkit-transform: translateY(20px);
  transform: translateY(20px);
}

.compare-slider--in-viewport .compare-slider__caption {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.compare-slider--in-viewport .compare-slider__caption--is-hidden {
  opacity: 0;
  visibility: hidden;
}

.compare-slider__img--original .compare-slider__caption--is-hidden {
  -webkit-transform: translateX(30px);
  transform: translateX(30px);
}

.compare-slider__img--modified .compare-slider__caption--is-hidden {
  -webkit-transform: translateX(-30px);
  transform: translateX(-30px);
}

.compare-slider__handle {
  display: block;
  display: flex;
  opacity: 0;
}

.compare-slider--in-viewport .compare-slider__handle {
  transition: opacity 0s 0.7s, -webkit-transform 0.3s 0.7s;
  transition: transform 0.3s 0.7s, opacity 0s 0.7s;
  transition: transform 0.3s 0.7s, opacity 0s 0.7s, -webkit-transform 0.3s 0.7s;
  -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
  transform: translateY(-50%) translateX(-50%) scale(1);
  opacity: 1;
}

.compare-slider__input-handle {
  display: block;
}

.compare-slider--reduced-motion .compare-slider__img--modified {
  -webkit-animation: none;
  animation: none;
}

.compare-slider--reduced-motion .compare-slider__handle,
.compare-slider--reduced-motion .compare-slider__caption {
  transition: none;
}

@-webkit-keyframes compare-slider-bounce-in {
  0% {
	width: 0%;
  }
  60% {
	width: 55%;
  }
  100% {
	width: 50%;
  }
}

@keyframes compare-slider-bounce-in {
  0% {
	width: 0%;
  }
  60% {
	width: 55%;
  }
  100% {
	width: 50%;
  }
}

/* --------------------------------

File#: _1_swipe-content
Title: Swipe Content
Descr: A Vanilla JavaScript plugin to detect touch interactions
Usage: codyhouse.co/license

-------------------------------- */
.swipe-content {
  height: 280px;
  width: 280px;
  background-color: var(--color-contrast-low);
  border-radius: var(--radius-md);
  cursor: default;
  transition: background 0.2s;
}
.swipe-content:active {
  background-color: var(--color-contrast-medium);
}

/* --------------------------------

File#: _1_banner
Title: Banner
Descr: A CTA banner containing text + media
Usage: codyhouse.co/license

-------------------------------- */
.banner {
  display: block;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow),
	var(--shadow-ring, 0 0 0 1px hsla(0deg, 0%, 0%, 0.05)), var(--shadow-sm);
  border-radius: var(--radius-md);
  transition: 0.3s;
}
.banner:hover {
  background-color: var(--color-bg-lighter);
  box-shadow: var(--inner-glow),
	var(--shadow-ring, 0 0 0 1px hsla(0deg, 0%, 0%, 0.05)), var(--shadow-md);
}
.banner:hover .banner__link {
  transform: scale(1.3);
}
.banner:hover .banner__link i {
  transform: scale(0.7);
}
.banner:hover .banner__link::after {
  height: 100%;
}
.banner:hover .banner__figure {
  transform: scale(1.05);
}

.banner__link {
  position: relative;
  text-decoration: none;
  color: var(var(--color-black));
  display: inline-block;
  transition: 0.3s var(--ease-out);
  transform-origin: left bottom;
}
.banner__link i {
  position: relative;
  z-index: 2;
  display: inline-block;
  transition: 0.3s var(--ease-out);
}
.banner__link::after {
  content: "";
  background-color: rgb(244, 233, 140);
  height: 2px;
  width: 100%;
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  -webkit-clip-path: inset(0% round var(--radius-sm));
  clip-path: inset(0% round var(--radius-sm));
  transition: 0.3s var(--ease-out);
  opacity: 15;
}

.banner__figure {
  height: 0;
  width: 100%;
  padding-bottom: 50%;
  transition: 0.3s var(--ease-out);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (min-width: 64rem) {
  .banner:not(.banner--invert) .banner__grid {
	flex-direction: row-reverse;
  }

  .banner__figure {
	height: 100%;
	padding-bottom: 0;
	-webkit-clip-path: polygon(100px 0%, 100% 0%, 100% 100%, 50px 100%);
	clip-path: polygon(100px 0%, 100% 0%, 100% 100%, 50px 100%);
  }

  .banner--invert .banner__figure {
	-webkit-clip-path: polygon(
	  0% 0%,
	  calc(100% - 100px) 0%,
	  calc(100% - 50px) 100%,
	  0% 100%
	);
	clip-path: polygon(
	  0% 0%,
	  calc(100% - 100px) 0%,
	  calc(100% - 50px) 100%,
	  0% 100%
	);
  }
  .banner--invert .banner__link {
	transform-origin: right bottom;
  }
  .banner--invert .banner__text {
	text-align: right;
  }

  .banner:hover .banner__figure {
	-webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}


/* --------------------------------

File#: _1_drawer
Title: Drawer
Descr: A slide-in panel used to display critical content
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --drawer-width: 400px;
}

.drawer {
  position: fixed;
  z-index: var(--z-index-overlay, 999);

  height: 100%;
  width: 100%;
  max-width: var(--drawer-width);
  top: 0;
  right: 0;
  visibility: hidden;
  transition: visibility 0s 0.3s;
}
.drawer:focus {
  outline: none;
}

.drawer--is-visible {
  visibility: visible;
  transition: none;
  z-index:999;
}

.drawer--open-left {
  right: auto;
  left: 0;
}

.drawer__content {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: translateX(100%);
		  transform: translateX(100%);
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  transition-timing-function: var(--ease-in-out);
}
.drawer--open-left .drawer__content {
  -webkit-transform: translateX(-100%);
		  transform: translateX(-100%);
}
.drawer--is-visible .drawer__content {
  -webkit-transform: translateX(0);
		  transform: translateX(0);
}

.drawer__body {
  height: 100%;
  overflow: auto;
  -ms-scroll-chaining: none;
	  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.drawer__close-btn {
  --size: 32px;
  width: var(--size);
  height: var(--size);
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background-color: hsla(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l), 0.95);
  box-shadow: var(--inner-glow), var(--shadow-sm);
  transition: 0.2s;
}
.drawer__close-btn:hover {
  background-color: var(--color-bg-lighter);
  box-shadow: var(--inner-glow), var(--shadow-md);
}
.drawer__close-btn .icon {
  display: block;
  color: var(--color-contrast-high);
}

.drawer--modal {
  max-width: none;
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0);
  transition: background-color 0.3s, visibility 0s 0.3s;
}
.drawer--modal.drawer--is-visible {
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.75);
  transition: background-color 0.3s;
}
.drawer--modal.drawer--open-left .drawer__content {
  right: auto;
  left: 0;
}
.drawer--modal .drawer__content {
  max-width: var(--drawer-width);
}
.drawer__content li {border-bottom: 1px solid rgba(0,0,0,0.05); line-height: 1.2em !important;}
.drawer__content li a {display: block; padding: 6px; }
.drawer__content li a:hover,
.drawer__content li.current-menu-item > a {
  color: black;
  background: #f1e68a;

  }

/* --------------------------------

File#: _1_immersive-section-transition
Title: Immersive Section Transition
Descr: A media element that animates to a full-screen block, before transitioning to the next section of content
Usage: codyhouse.co/license

-------------------------------- */
.immerse-section-tr {
  position: relative;
  --immerse-section-tr-opacity: 0;
}

.immerse-section-tr__media {
  position: sticky;
  top: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}

.immerse-section-tr--disabled .immerse-section-tr__media {
  position: relative;
}

.immerse-section-tr__figure {
  will-change: transform;
  pointer-events: auto;
  position: relative;
  height: 0;
}
.immerse-section-tr__figure > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.immerse-section-tr__figure--16-9 {
  padding-bottom: 56.25%;
}

.immerse-section-tr__figure--3-4 {
  padding-bottom: 133.33%;
}

.immerse-section-tr__content {
  position: relative;
  z-index: 3;
  transform: translateZ(0);
}
.immerse-section-tr__content::after,
.immerse-section-tr__content::before {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: var(--color-bg);
  opacity: var(--immerse-section-tr-opacity, 0);
  pointer-events: none;
}
.immerse-section-tr__content::before {
  height: 100%;
  z-index: -1;
}
.immerse-section-tr__content::after {
  height: 100vh;
  transform: translateY(-100%);
}

.immerse-section-tr--disabled .immerse-section-tr__content::before {
  opacity: 1;
}

/* Badges bottom footer */
.badgebadgeul {}
.badge {
	display: block;
	padding: 0.5rem 0.95rem;
	margin: 0 10px 10px 0;
	font-size: 1rem;
	line-height: 1;
	color: #111;
	white-space: nowrap;
	vertical-align: baseline;

}

@media (min-width: 768px) {
.badge  {display: inline-block;text-align: center;	}
}
/* SMART COOKIE END */




/* Woocommerce addings smart cookie*/
body {
	font-size: var(--text-base-size,1rem);
	font-family: var(--font-primary,sans-serif);
	color: var(--color-contrast-high,hsl(210deg,7%,21%));
	font-weight: var(--body-font-weight,normal)
}

h1,h2,h3,h4 {
	color: var(--color-contrast-higher,hsl(204deg,28%,7%));
	line-height: var(--heading-line-height,1.2);
	font-weight: var(--heading-font-weight,700)
}

/* body.single-product .woocommerce-product-details__short-description,
body.single-product .woocommerce-tabs {font-size:16px !important;} */
body, p, .entry-content, ul , li , ol, #tab-description, .woocommerce-product-details__short-description  {
	font-family: sofia-pro,sans-serif !important;

}


#main p {margin-top:1rem;}


/* Mobile menu Fly Out */
/* --------------------------------

File#: _1_list
Title: List
Descr: Custom list component
Usage: codyhouse.co/license

-------------------------------- */
/* Oude menu */
.mobile-menu.close-drawer  {display:none;}
:root {
  --list-space-y: 0.375em;
  --list-offset: 1em;
  --list-line-height-multiplier: 1;
}

.list, .text-component .list {
  padding-left: 0;
  list-style: none;
}
.list ul, .list ol, .text-component .list ul, .text-component .list ol {
  list-style: none;
  margin: 0;
  margin-top: calc((var(--list-space-y) / 2) * var(--text-space-y-multiplier, 1));
  padding-top: calc((var(--list-space-y) / 2) * var(--text-space-y-multiplier, 1));
  padding-left: var(--list-offset);
}
.list li, .text-component .list li {
  padding-bottom: calc((var(--list-space-y) / 2) * var(--text-space-y-multiplier, 1));
  margin-bottom: calc((var(--list-space-y) / 2) * var(--text-space-y-multiplier, 1));
  line-height: calc(var(--body-line-height) * var(--list-line-height-multiplier));
}
.list > li:last-child, .list ul > li:last-child, .list ol > li:last-child, .text-component .list > li:last-child, .text-component .list ul > li:last-child, .text-component .list ol > li:last-child {
  margin-bottom: 0;
}
.list:not(.list--border) > li:last-child, .list ul > li:last-child, .list ol > li:last-child, .text-component .list:not(.list--border) > li:last-child, .text-component .list ul > li:last-child, .text-component .list ol > li:last-child {
  padding-bottom: 0;
}

/* #region (ul + ol) */
.list--ul, .text-component .list--ul,
.list--ol, .text-component .list--ol {
  --list-offset: calc(var(--list-bullet-size) + var(--list-bullet-margin-right));
}
.list--ul ul, .list--ul ol, .text-component .list--ul ul, .text-component .list--ul ol,
.list--ol ul,
.list--ol ol, .text-component .list--ol ul, .text-component .list--ol ol {
  padding-left: 0;
}
@supports (--css: variables) {
  .list--ul li, .text-component .list--ul li,
.list--ol li, .text-component .list--ol li {
	padding-left: var(--list-offset) !important;
  }
}
.list--ul li::before, .text-component .list--ul li::before,
.list--ol li::before, .text-component .list--ol li::before {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  position: relative;
  top: -0.1em;
}
@supports (--css: variables) {
  .list--ul li::before, .text-component .list--ul li::before,
.list--ol li::before, .text-component .list--ol li::before {
	width: var(--list-bullet-size) !important;
	height: var(--list-bullet-size) !important;
	margin-left: calc(var(--list-bullet-size) * -1) !important;
	left: calc(var(--list-bullet-margin-right) * -1) !important;
  }
}

.list--ul, .text-component .list--ul {
  --list-bullet-size: 7px;
  --list-bullet-margin-right: 12px;
}
.list--ul > li, .text-component .list--ul > li {
  padding-left: 19px;
}
.list--ul > li::before, .text-component .list--ul > li::before {
  content: "";
  border-radius: 50%;
  color: var(--color-contrast-lower);
  background-color: currentColor;
  width: 7px;
  height: 7px;
  margin-left: -7px;
  left: -12px;
}
.list--ul ul li::before, .text-component .list--ul ul li::before {
  background-color: transparent;
  box-shadow: inset 0 0 0 2px currentColor;
}

.list--ol, .text-component .list--ol {
  --list-bullet-size: 26px;
  --list-bullet-margin-right: 6px;
  --list-bullet-font-size: 14px;
  counter-reset: list-items;
}
.list--ol > li, .text-component .list--ol > li {
  counter-increment: list-items;
  padding-left: 32px;
}
.list--ol ol, .text-component .list--ol ol {
  counter-reset: list-items;
}
.list--ol > li::before, .text-component .list--ol > li::before {
  content: counter(list-items);
  font-size: var(--list-bullet-font-size, 14px);
  background-color: var(--color-contrast-lower);
  color: var(--color-contrast-high);
  line-height: 1;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  margin-left: -26px;
  left: -6px;
}
.list--ol ol > li::before, .text-component .list--ol ol > li::before {
  background-color: transparent;
  box-shadow: inset 0 0 0 2px var(--color-contrast-lower);
}

/* #endregion */
/* #region (border) */
.list--border li:not(:last-child), .text-component .list--border li:not(:last-child) {
  border-bottom: 1px solid var(--color-contrast-lower);
}
.list--border ul, .list--border ol, .text-component .list--border ul, .text-component .list--border ol {
  border-top: 1px solid var(--color-contrast-lower);
}

/* #endregion */
/* #region (icons) */
.list--icons, .text-component .list--icons {
  --list-bullet-size: 24px;
  --list-bullet-margin-right: 8px;
  --list-offset: calc(var(--list-bullet-size) + var(--list-bullet-margin-right));
}
.list--icons ul, .list--icons ol, .text-component .list--icons ul, .text-component .list--icons ol {
  padding-left: 32px;
}
@supports (--css: variables) {
  .list--icons ul, .list--icons ol, .text-component .list--icons ul, .text-component .list--icons ol {
	padding-left: var(--list-offset);
  }
}

.list__icon {
  position: relative;
  width: 24px;
  height: 24px;
  margin-right: 8px;
}
.list__icon:not(.top-0) {
  top: calc((1em * var(--body-line-height) - 24px) / 2);
}
@supports (--css: variables) {
  .list__icon {
	width: var(--list-bullet-size);
	height: var(--list-bullet-size);
	margin-right: var(--list-bullet-margin-right);
  }
  .list__icon:not(.top-0) {
	top: calc((1em * var(--body-line-height) * var(--list-line-height-multiplier) - var(--list-bullet-size)) / 2);
  }
}



/* Display sale price on the cart page */

#page table.cart.woocommerce-cart-form__contents td.product-price {
	display: table-cell;
}
#page table.cart.woocommerce-cart-form__contents td.product-price del {
	opacity: 0.5;
	font-size: 14px;
	margin-right: 3px;
}
.woocommerce-variation-price .price del .amount,
del .woocommerce-Price-amount.amount  {
	text-decoration: line-through !important;
}

.configurator-text {
	padding:15px 0;
}

#tab-description ul,
.woocommerce-product-details__short-description ul  {padding: 15px 0 15px 35px; }
#shoptimizer-modals-wrapper {padding:30px 0;}


.ajax_add_to_cart.add_to_cart_button, .single-product div.product form.cart .button {background: rgb(190, 154, 60); color: #111;}

.mobile-myaccount {
	right: 49px !important;
	top: 14px !important;
	position: absolute !important;
}

/* Single Productpage */
a.reset {border:none !important;}
#shoptimizer-modals-wrapper {padding-top:20px !important;}
#shoptimizer-modals-wrapper a:hover {text-decoration: none;}


/* --------------------------------

File#: _1_accordion
Title: Accordion
Descr: Create stacked sections of content and allow the user to expand/collapse them
Usage: codyhouse.co/license

-------------------------------- */
:root {
  /* general */
  --accordion-border-width: 1px;
  /* icon */
  --accordion-icon-size: 20px;
  --accordion-icon-stroke-width: 2px;
}

.accordion__item {
  border-style: solid;
  border-color: var(--color-contrast-lower);
  border-bottom-width: var(--accordion-border-width);
}
.accordion__item:first-child {
  border-top-width: var(--accordion-border-width);
}

.accordion__header { /* button */
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  cursor: pointer;
}
.accordion__header .icon {
  --size: var(--accordion-icon-size);
}
.accordion__header .icon .icon__group {
  stroke-width: var(--accordion-icon-stroke-width);
}

.accordion__icon-arrow .icon__group,
.accordion__icon-arrow-v2 .icon__group,
.accordion__icon-plus .icon__group {
  will-change: transform;
  transform-origin: 50% 50%;
}

.accordion__icon-arrow .icon__group > * {
  transform-origin: 10px 14px;
}

.accordion__icon-arrow-v2 .icon__group > * {
  transform-origin: 50% 50%;
  stroke-dasharray: 20;
  transform: translateY(4px);
}
.accordion__icon-arrow-v2 .icon__group > *:first-child {
  stroke-dashoffset: 10.15;
}
.accordion__icon-arrow-v2 .icon__group > *:last-child {
  stroke-dashoffset: 10.15;
}

.accordion__icon-plus .icon__group {
  transform: rotate(-90deg);
}
.accordion__icon-plus .icon__group > * {
  transform-origin: 50% 50%;
}
.accordion__icon-plus .icon__group > *:first-child {
  transform: rotate(-90deg);
}

.accordion__item--is-open > .accordion__header > .accordion__icon-arrow .icon__group { /* animated arrow icon */ }
.accordion__item--is-open > .accordion__header > .accordion__icon-arrow .icon__group > *:first-child {
  transform: translateY(-8px) rotate(-90deg);
}
.accordion__item--is-open > .accordion__header > .accordion__icon-arrow .icon__group > *:last-child {
  transform: translateY(-8px) rotate(90deg);
}
.accordion__item--is-open > .accordion__header > .accordion__icon-arrow-v2 .icon__group { /* animated arrow icon v2 */
  transform: rotate(-90deg);
}
.accordion__item--is-open > .accordion__header > .accordion__icon-arrow-v2 .icon__group > *:first-child, .accordion__item--is-open > .accordion__header > .accordion__icon-arrow-v2 .icon__group *:last-child {
  stroke-dashoffset: 0;
  transform: translateY(0px);
}
.accordion__item--is-open > .accordion__header > .accordion__icon-plus .icon__group { /* animated plus icon */
  transform: rotate(0);
}
.accordion__item--is-open > .accordion__header > .accordion__icon-plus .icon__group > *:first-child {
  transform: rotate(0);
}

.accordion__panel {
  display: none;
  will-change: height;
  transform: translateZ(0px);
}

.accordion__item--is-open > .accordion__panel {
  display: block;
}

/* animations */
.accordion[data-animation=on] .accordion__item--is-open .accordion__panel > * {
  animation: accordion-entry-animation 0.4s var(--ease-out);
}
.accordion[data-animation=on] .accordion__icon-arrow .icon__group,
.accordion[data-animation=on] .accordion__icon-arrow-v2 .icon__group,
.accordion[data-animation=on] .accordion__icon-plus .icon__group {
  transition: transform 0.3s var(--ease-out);
}
.accordion[data-animation=on] .accordion__icon-arrow .icon__group > *,
.accordion[data-animation=on] .accordion__icon-arrow-v2 .icon__group > *,
.accordion[data-animation=on] .accordion__icon-plus .icon__group > * {
  transition: transform 0.3s, stroke-dashoffset 0.3s;
  transition-timing-function: var(--ease-out);
}

@keyframes accordion-entry-animation {
  from {
	opacity: 0;
	transform: translateY(-10px);
  }
  to {
	opacity: 1;
	transform: translateY(0px);
  }
}

/* --------------------------------

File#: _1_text-points
Title: Text Points
Descr: A list of text components
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --text-points-bullet-size: 32px;
  --text-points-bullet-font-size: 14px;
  --text-points-bullet-margin-right: var(--space-xs);
}

.text-points--counter .text-points__text,
.text-points--letter .text-points__text,
.text-points--icon .text-points__text {
  padding-left: calc(var(--text-points-bullet-size) + var(--text-points-bullet-margin-right));
}
.text-points--counter .text-points__bullet,
.text-points--letter .text-points__bullet,
.text-points--icon .text-points__bullet {
  position: relative;
  margin-left: calc(-1 * var(--text-points-bullet-size));
  left: calc(-1 * var(--text-points-bullet-margin-right));
}
.text-points--counter .text-points__bullet::before,
.text-points--letter .text-points__bullet::before,
.text-points--icon .text-points__bullet::before {
  content: "X";
  display: inline-flex;
  width: var(--text-points-bullet-size);
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
}
.text-points--counter .text-points__bullet::after,
.text-points--letter .text-points__bullet::after,
.text-points--icon .text-points__bullet::after {
  content: "";
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
		  transform: translateY(-50%);
  width: var(--text-points-bullet-size);
  height: var(--text-points-bullet-size);
  background-color: var(--color-bg-dark);
  border-radius: 50%;
  font-size: var(--text-points-bullet-font-size);
  font-weight: 600;
  color: var(--color-contrast-medium);
}

.text-points--counter .text-points__item {
  counter-increment: text-points;
}
.text-points--counter .text-points__bullet::after {
  content: counter(text-points);
}

.text-points--letter .text-points__bullet::after {
  content: "?";
}

.text-points--icon .text-points__bullet::after {
  content: "";
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='%23000000'%3E%3Ccircle cx='16' cy='16' r='16' opacity='.15'%3E%3C/circle%3E%3Cpath d='M16 24a1 1 0 0 1-1-1v-9a1 1 0 0 1 2 0v9a1 1 0 0 1-1 1z'%3E%3C/path%3E%3Ccircle cx='16' cy='9.5' r='1.5'%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
		  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='%23000000'%3E%3Ccircle cx='16' cy='16' r='16' opacity='.15'%3E%3C/circle%3E%3Cpath d='M16 24a1 1 0 0 1-1-1v-9a1 1 0 0 1 2 0v9a1 1 0 0 1-1 1z'%3E%3C/path%3E%3Ccircle cx='16' cy='9.5' r='1.5'%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
  background: var(--color-primary);
}

.footer__logo svg {max-width:125px;}

/* Darkmode & in zwarte footer */
.darkmode img[src$=".svg"],
.darkmode svg{
	filter: invert(1) hue-rotate(180deg);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart {padding-bottom: 50px;}

.shoptimizer-mini-cart-wrap .widget_shopping_cart