@charset "UTF-8";
/*! purgecss start ignore */
*, *::after, *::before {
  box-sizing: border-box;
}

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

body {
  background-color: var(--color-bg, white);
}

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

blockquote, q {
  quotes: none;
}

mark {
  background-color: transparent;
  color: inherit;
}

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

a {
  color: var(--color-primary, hsl(250, 100%, 69%));
}

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

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

img, video, svg {
  max-width: 100%;
  display: block;
}

[data-theme] {
  color: var(--color-contrast-high, hsl(240, 5%, 82%));
}

/*!
 * Font Awesome Free 7.2.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2026 Fonticons, Inc.
 */
.fa-solid,
.fa-regular,
.fa-brands,
.fa-classic,
.fas,
.far,
.fab,
.fa {
  --_fa-family: var(--fa-family, var(--fa-style-family, 'Font Awesome 7 Free'));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: var(--fa-display, inline-block);
  font-family: var(--_fa-family);
  font-feature-settings: normal;
  font-style: normal;
  font-synthesis: none;
  font-variant: normal;
  font-weight: var(--fa-style, 900);
  line-height: 1;
  text-align: center;
  text-rendering: auto;
  width: var(--fa-width, 1.25em);
}

:is(.fas,
.far,
.fab,
.fa-solid,
.fa-regular,
.fa-brands,
.fa-classic,
.fa)::before {
  content: var(--fa)/"";
}

@supports not (content: ""/"") {
  :is(.fas,
  .far,
  .fab,
  .fa-solid,
  .fa-regular,
  .fa-brands,
  .fa-classic,
  .fa)::before {
    content: var(--fa);
  }
}
.fa-1x {
  font-size: 1em;
}

.fa-2x {
  font-size: 2em;
}

.fa-3x {
  font-size: 3em;
}

.fa-4x {
  font-size: 4em;
}

.fa-5x {
  font-size: 5em;
}

.fa-6x {
  font-size: 6em;
}

.fa-7x {
  font-size: 7em;
}

.fa-8x {
  font-size: 8em;
}

.fa-9x {
  font-size: 9em;
}

.fa-10x {
  font-size: 10em;
}

.fa-2xs {
  font-size: calc(10 / 16 * 1em); /* converts a 10px size into an em-based value that's relative to the scale's 16px base */
  line-height: calc(1 / 10 * 1em); /* sets the line-height of the icon back to that of it's parent */
  vertical-align: calc((6 / 10 - 0.375) * 1em); /* vertically centers the icon taking into account the surrounding text's descender */
}

.fa-xs {
  font-size: calc(12 / 16 * 1em); /* converts a 12px size into an em-based value that's relative to the scale's 16px base */
  line-height: calc(1 / 12 * 1em); /* sets the line-height of the icon back to that of it's parent */
  vertical-align: calc((6 / 12 - 0.375) * 1em); /* vertically centers the icon taking into account the surrounding text's descender */
}

.fa-sm {
  font-size: calc(14 / 16 * 1em); /* converts a 14px size into an em-based value that's relative to the scale's 16px base */
  line-height: calc(1 / 14 * 1em); /* sets the line-height of the icon back to that of it's parent */
  vertical-align: calc((6 / 14 - 0.375) * 1em); /* vertically centers the icon taking into account the surrounding text's descender */
}

.fa-lg {
  font-size: calc(20 / 16 * 1em); /* converts a 20px size into an em-based value that's relative to the scale's 16px base */
  line-height: calc(1 / 20 * 1em); /* sets the line-height of the icon back to that of it's parent */
  vertical-align: calc((6 / 20 - 0.375) * 1em); /* vertically centers the icon taking into account the surrounding text's descender */
}

.fa-xl {
  font-size: calc(24 / 16 * 1em); /* converts a 24px size into an em-based value that's relative to the scale's 16px base */
  line-height: calc(1 / 24 * 1em); /* sets the line-height of the icon back to that of it's parent */
  vertical-align: calc((6 / 24 - 0.375) * 1em); /* vertically centers the icon taking into account the surrounding text's descender */
}

.fa-2xl {
  font-size: calc(32 / 16 * 1em); /* converts a 32px size into an em-based value that's relative to the scale's 16px base */
  line-height: calc(1 / 32 * 1em); /* sets the line-height of the icon back to that of it's parent */
  vertical-align: calc((6 / 32 - 0.375) * 1em); /* vertically centers the icon taking into account the surrounding text's descender */
}

.fa-width-auto {
  --fa-width: auto;
}

.fa-fw,
.fa-width-fixed {
  --fa-width: 1.25em;
}

.fa-ul {
  list-style-type: none;
  margin-inline-start: var(--fa-li-margin, 2.5em);
  padding-inline-start: 0;
}
.fa-ul > li {
  position: relative;
}

.fa-li {
  inset-inline-start: calc(-1 * var(--fa-li-width, 2em));
  position: absolute;
  text-align: center;
  width: var(--fa-li-width, 2em);
  line-height: inherit;
}

/* Heads Up: Bordered Icons will not be supported in the future!
  - This feature will be deprecated in the next major release of Font Awesome (v8)!
  - You may continue to use it in this version *v7), but it will not be supported in Font Awesome v8.
*/
/* Notes:
* --@{v.$css-prefix}-border-width = 1/16 by default (to render as ~1px based on a 16px default font-size)
* --@{v.$css-prefix}-border-padding =
  ** 3/16 for vertical padding (to give ~2px of vertical whitespace around an icon considering it's vertical alignment)
  ** 4/16 for horizontal padding (to give ~4px of horizontal whitespace around an icon)
*/
.fa-border {
  border-color: var(--fa-border-color, #eee);
  border-radius: var(--fa-border-radius, 0.1em);
  border-style: var(--fa-border-style, solid);
  border-width: var(--fa-border-width, 0.0625em);
  box-sizing: var(--fa-border-box-sizing, content-box);
  padding: var(--fa-border-padding, 0.1875em 0.25em);
}

.fa-pull-left,
.fa-pull-start {
  float: inline-start;
  margin-inline-end: var(--fa-pull-margin, 0.3em);
}

.fa-pull-right,
.fa-pull-end {
  float: inline-end;
  margin-inline-start: var(--fa-pull-margin, 0.3em);
}

.fa-beat {
  animation-name: fa-beat;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out);
}

.fa-bounce {
  animation-name: fa-bounce;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, cubic-bezier(0.28, 0.84, 0.42, 1));
}

.fa-fade {
  animation-name: fa-fade;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, cubic-bezier(0.4, 0, 0.6, 1));
}

.fa-beat-fade {
  animation-name: fa-beat-fade;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, cubic-bezier(0.4, 0, 0.6, 1));
}

.fa-flip {
  animation-name: fa-flip;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, ease-in-out);
}

.fa-shake {
  animation-name: fa-shake;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear);
}

.fa-spin {
  animation-name: fa-spin;
  animation-delay: var(--fa-animation-delay, 0s);
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 2s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, linear);
}

.fa-spin-reverse {
  --fa-animation-direction: reverse;
}

.fa-pulse,
.fa-spin-pulse {
  animation-name: fa-spin;
  animation-direction: var(--fa-animation-direction, normal);
  animation-duration: var(--fa-animation-duration, 1s);
  animation-iteration-count: var(--fa-animation-iteration-count, infinite);
  animation-timing-function: var(--fa-animation-timing, steps(8));
}

@media (prefers-reduced-motion: reduce) {
  .fa-beat,
  .fa-bounce,
  .fa-fade,
  .fa-beat-fade,
  .fa-flip,
  .fa-pulse,
  .fa-shake,
  .fa-spin,
  .fa-spin-pulse {
    animation: none !important;
    transition: none !important;
  }
}
@keyframes fa-beat {
  0%, 90% {
    transform: scale(1);
  }
  45% {
    transform: scale(var(--fa-beat-scale, 1.25));
  }
}
@keyframes fa-bounce {
  0% {
    transform: scale(1, 1) translateY(0);
  }
  10% {
    transform: scale(var(--fa-bounce-start-scale-x, 1.1), var(--fa-bounce-start-scale-y, 0.9)) translateY(0);
  }
  30% {
    transform: scale(var(--fa-bounce-jump-scale-x, 0.9), var(--fa-bounce-jump-scale-y, 1.1)) translateY(var(--fa-bounce-height, -0.5em));
  }
  50% {
    transform: scale(var(--fa-bounce-land-scale-x, 1.05), var(--fa-bounce-land-scale-y, 0.95)) translateY(0);
  }
  57% {
    transform: scale(1, 1) translateY(var(--fa-bounce-rebound, -0.125em));
  }
  64% {
    transform: scale(1, 1) translateY(0);
  }
  100% {
    transform: scale(1, 1) translateY(0);
  }
}
@keyframes fa-fade {
  50% {
    opacity: var(--fa-fade-opacity, 0.4);
  }
}
@keyframes fa-beat-fade {
  0%, 100% {
    opacity: var(--fa-beat-fade-opacity, 0.4);
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(var(--fa-beat-fade-scale, 1.125));
  }
}
@keyframes fa-flip {
  50% {
    transform: rotate3d(var(--fa-flip-x, 0), var(--fa-flip-y, 1), var(--fa-flip-z, 0), var(--fa-flip-angle, -180deg));
  }
}
@keyframes fa-shake {
  0% {
    transform: rotate(-15deg);
  }
  4% {
    transform: rotate(15deg);
  }
  8%, 24% {
    transform: rotate(-18deg);
  }
  12%, 28% {
    transform: rotate(18deg);
  }
  16% {
    transform: rotate(-22deg);
  }
  20% {
    transform: rotate(22deg);
  }
  32% {
    transform: rotate(-12deg);
  }
  36% {
    transform: rotate(12deg);
  }
  40%, 100% {
    transform: rotate(0deg);
  }
}
@keyframes fa-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.fa-rotate-90 {
  transform: rotate(90deg);
}

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

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

.fa-flip-horizontal {
  transform: scale(-1, 1);
}

.fa-flip-vertical {
  transform: scale(1, -1);
}

.fa-flip-both,
.fa-flip-horizontal.fa-flip-vertical {
  transform: scale(-1, -1);
}

.fa-rotate-by {
  transform: rotate(var(--fa-rotate-angle, 0));
}

.fa-stack {
  display: inline-block;
  height: 2em;
  line-height: 2em;
  position: relative;
  vertical-align: middle;
  width: 2.5em;
}

.fa-stack-1x,
.fa-stack-2x {
  --fa-width: 100%;
  inset: 0;
  position: absolute;
  text-align: center;
  width: var(--fa-width);
  z-index: var(--fa-stack-z-index, auto);
}

.fa-stack-1x {
  line-height: inherit;
}

.fa-stack-2x {
  font-size: 2em;
}

.fa-inverse {
  color: var(--fa-inverse, #fff);
}

.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--3xs {
  --size: 8px;
}

.icon--2xs {
  --size: 12px;
}

.icon--xs {
  --size: 16px;
}

.icon--sm {
  --size: 24px;
}

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

.icon--lg {
  --size: 48px;
}

.icon--xl {
  --size: 64px;
}

.icon--2xl {
  --size: 96px;
}

.icon--3xl {
  --size: 128px;
}

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

@keyframes icon-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* SVG symbols - enable icon color corrections */
.icon use {
  color: inherit;
  fill: currentColor;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-0 {
  --fa: "\30 ";
}

.fa-1 {
  --fa: "\31 ";
}

.fa-2 {
  --fa: "\32 ";
}

.fa-3 {
  --fa: "\33 ";
}

.fa-4 {
  --fa: "\34 ";
}

.fa-5 {
  --fa: "\35 ";
}

.fa-6 {
  --fa: "\36 ";
}

.fa-7 {
  --fa: "\37 ";
}

.fa-8 {
  --fa: "\38 ";
}

.fa-9 {
  --fa: "\39 ";
}

.fa-exclamation {
  --fa: "\!";
}

.fa-hashtag {
  --fa: "\#";
}

.fa-dollar-sign {
  --fa: "\$";
}

.fa-dollar {
  --fa: "\$";
}

.fa-usd {
  --fa: "\$";
}

.fa-percent {
  --fa: "\%";
}

.fa-percentage {
  --fa: "\%";
}

.fa-asterisk {
  --fa: "\*";
}

.fa-plus {
  --fa: "\+";
}

.fa-add {
  --fa: "\+";
}

.fa-less-than {
  --fa: "\<";
}

.fa-equals {
  --fa: "\=";
}

.fa-greater-than {
  --fa: "\>";
}

.fa-question {
  --fa: "\?";
}

.fa-at {
  --fa: "\@";
}

.fa-a {
  --fa: "A";
}

.fa-b {
  --fa: "B";
}

.fa-c {
  --fa: "C";
}

.fa-d {
  --fa: "D";
}

.fa-e {
  --fa: "E";
}

.fa-f {
  --fa: "F";
}

.fa-g {
  --fa: "G";
}

.fa-h {
  --fa: "H";
}

.fa-i {
  --fa: "I";
}

.fa-j {
  --fa: "J";
}

.fa-k {
  --fa: "K";
}

.fa-l {
  --fa: "L";
}

.fa-m {
  --fa: "M";
}

.fa-n {
  --fa: "N";
}

.fa-o {
  --fa: "O";
}

.fa-p {
  --fa: "P";
}

.fa-q {
  --fa: "Q";
}

.fa-r {
  --fa: "R";
}

.fa-s {
  --fa: "S";
}

.fa-t {
  --fa: "T";
}

.fa-u {
  --fa: "U";
}

.fa-v {
  --fa: "V";
}

.fa-w {
  --fa: "W";
}

.fa-x {
  --fa: "X";
}

.fa-y {
  --fa: "Y";
}

.fa-z {
  --fa: "Z";
}

.fa-faucet {
  --fa: "\e005";
}

.fa-faucet-drip {
  --fa: "\e006";
}

.fa-house-chimney-window {
  --fa: "\e00d";
}

.fa-house-signal {
  --fa: "\e012";
}

.fa-temperature-arrow-down {
  --fa: "\e03f";
}

.fa-temperature-down {
  --fa: "\e03f";
}

.fa-temperature-arrow-up {
  --fa: "\e040";
}

.fa-temperature-up {
  --fa: "\e040";
}

.fa-trailer {
  --fa: "\e041";
}

.fa-bacteria {
  --fa: "\e059";
}

.fa-bacterium {
  --fa: "\e05a";
}

.fa-box-tissue {
  --fa: "\e05b";
}

.fa-hand-holding-medical {
  --fa: "\e05c";
}

.fa-hand-sparkles {
  --fa: "\e05d";
}

.fa-hands-bubbles {
  --fa: "\e05e";
}

.fa-hands-wash {
  --fa: "\e05e";
}

.fa-handshake-slash {
  --fa: "\e060";
}

.fa-handshake-alt-slash {
  --fa: "\e060";
}

.fa-handshake-simple-slash {
  --fa: "\e060";
}

.fa-head-side-cough {
  --fa: "\e061";
}

.fa-head-side-cough-slash {
  --fa: "\e062";
}

.fa-head-side-mask {
  --fa: "\e063";
}

.fa-head-side-virus {
  --fa: "\e064";
}

.fa-house-chimney-user {
  --fa: "\e065";
}

.fa-house-laptop {
  --fa: "\e066";
}

.fa-laptop-house {
  --fa: "\e066";
}

.fa-lungs-virus {
  --fa: "\e067";
}

.fa-people-arrows {
  --fa: "\e068";
}

.fa-people-arrows-left-right {
  --fa: "\e068";
}

.fa-plane-slash {
  --fa: "\e069";
}

.fa-pump-medical {
  --fa: "\e06a";
}

.fa-pump-soap {
  --fa: "\e06b";
}

.fa-shield-virus {
  --fa: "\e06c";
}

.fa-sink {
  --fa: "\e06d";
}

.fa-soap {
  --fa: "\e06e";
}

.fa-stopwatch-20 {
  --fa: "\e06f";
}

.fa-shop-slash {
  --fa: "\e070";
}

.fa-store-alt-slash {
  --fa: "\e070";
}

.fa-store-slash {
  --fa: "\e071";
}

.fa-toilet-paper-slash {
  --fa: "\e072";
}

.fa-users-slash {
  --fa: "\e073";
}

.fa-virus {
  --fa: "\e074";
}

.fa-virus-slash {
  --fa: "\e075";
}

.fa-viruses {
  --fa: "\e076";
}

.fa-vest {
  --fa: "\e085";
}

.fa-vest-patches {
  --fa: "\e086";
}

.fa-arrow-trend-down {
  --fa: "\e097";
}

.fa-arrow-trend-up {
  --fa: "\e098";
}

.fa-arrow-up-from-bracket {
  --fa: "\e09a";
}

.fa-austral-sign {
  --fa: "\e0a9";
}

.fa-baht-sign {
  --fa: "\e0ac";
}

.fa-bitcoin-sign {
  --fa: "\e0b4";
}

.fa-bolt-lightning {
  --fa: "\e0b7";
}

.fa-book-bookmark {
  --fa: "\e0bb";
}

.fa-camera-rotate {
  --fa: "\e0d8";
}

.fa-cedi-sign {
  --fa: "\e0df";
}

.fa-chart-column {
  --fa: "\e0e3";
}

.fa-chart-gantt {
  --fa: "\e0e4";
}

.fa-clapperboard {
  --fa: "\e131";
}

.fa-closed-captioning-slash {
  --fa: "\e135";
}

.fa-clover {
  --fa: "\e139";
}

.fa-code-compare {
  --fa: "\e13a";
}

.fa-code-fork {
  --fa: "\e13b";
}

.fa-code-pull-request {
  --fa: "\e13c";
}

.fa-colon-sign {
  --fa: "\e140";
}

.fa-cruzeiro-sign {
  --fa: "\e152";
}

.fa-display {
  --fa: "\e163";
}

.fa-dong-sign {
  --fa: "\e169";
}

.fa-elevator {
  --fa: "\e16d";
}

.fa-filter-circle-xmark {
  --fa: "\e17b";
}

.fa-florin-sign {
  --fa: "\e184";
}

.fa-folder-closed {
  --fa: "\e185";
}

.fa-franc-sign {
  --fa: "\e18f";
}

.fa-guarani-sign {
  --fa: "\e19a";
}

.fa-gun {
  --fa: "\e19b";
}

.fa-hands-clapping {
  --fa: "\e1a8";
}

.fa-house-user {
  --fa: "\e1b0";
}

.fa-home-user {
  --fa: "\e1b0";
}

.fa-indian-rupee-sign {
  --fa: "\e1bc";
}

.fa-indian-rupee {
  --fa: "\e1bc";
}

.fa-inr {
  --fa: "\e1bc";
}

.fa-kip-sign {
  --fa: "\e1c4";
}

.fa-lari-sign {
  --fa: "\e1c8";
}

.fa-litecoin-sign {
  --fa: "\e1d3";
}

.fa-manat-sign {
  --fa: "\e1d5";
}

.fa-mask-face {
  --fa: "\e1d7";
}

.fa-mill-sign {
  --fa: "\e1ed";
}

.fa-money-bills {
  --fa: "\e1f3";
}

.fa-naira-sign {
  --fa: "\e1f6";
}

.fa-notdef {
  --fa: "\e1fe";
}

.fa-panorama {
  --fa: "\e209";
}

.fa-peseta-sign {
  --fa: "\e221";
}

.fa-peso-sign {
  --fa: "\e222";
}

.fa-plane-up {
  --fa: "\e22d";
}

.fa-rupiah-sign {
  --fa: "\e23d";
}

.fa-stairs {
  --fa: "\e289";
}

.fa-timeline {
  --fa: "\e29c";
}

.fa-truck-front {
  --fa: "\e2b7";
}

.fa-turkish-lira-sign {
  --fa: "\e2bb";
}

.fa-try {
  --fa: "\e2bb";
}

.fa-turkish-lira {
  --fa: "\e2bb";
}

.fa-vault {
  --fa: "\e2c5";
}

.fa-wand-magic-sparkles {
  --fa: "\e2ca";
}

.fa-magic-wand-sparkles {
  --fa: "\e2ca";
}

.fa-wheat-awn {
  --fa: "\e2cd";
}

.fa-wheat-alt {
  --fa: "\e2cd";
}

.fa-wheelchair-move {
  --fa: "\e2ce";
}

.fa-wheelchair-alt {
  --fa: "\e2ce";
}

.fa-bangladeshi-taka-sign {
  --fa: "\e2e6";
}

.fa-bowl-rice {
  --fa: "\e2eb";
}

.fa-person-pregnant {
  --fa: "\e31e";
}

.fa-house-chimney {
  --fa: "\e3af";
}

.fa-home-lg {
  --fa: "\e3af";
}

.fa-house-crack {
  --fa: "\e3b1";
}

.fa-house-medical {
  --fa: "\e3b2";
}

.fa-cent-sign {
  --fa: "\e3f5";
}

.fa-plus-minus {
  --fa: "\e43c";
}

.fa-sailboat {
  --fa: "\e445";
}

.fa-section {
  --fa: "\e447";
}

.fa-shrimp {
  --fa: "\e448";
}

.fa-brazilian-real-sign {
  --fa: "\e46c";
}

.fa-chart-simple {
  --fa: "\e473";
}

.fa-diagram-next {
  --fa: "\e476";
}

.fa-diagram-predecessor {
  --fa: "\e477";
}

.fa-diagram-successor {
  --fa: "\e47a";
}

.fa-earth-oceania {
  --fa: "\e47b";
}

.fa-globe-oceania {
  --fa: "\e47b";
}

.fa-bug-slash {
  --fa: "\e490";
}

.fa-file-circle-plus {
  --fa: "\e494";
}

.fa-shop-lock {
  --fa: "\e4a5";
}

.fa-virus-covid {
  --fa: "\e4a8";
}

.fa-virus-covid-slash {
  --fa: "\e4a9";
}

.fa-anchor-circle-check {
  --fa: "\e4aa";
}

.fa-anchor-circle-exclamation {
  --fa: "\e4ab";
}

.fa-anchor-circle-xmark {
  --fa: "\e4ac";
}

.fa-anchor-lock {
  --fa: "\e4ad";
}

.fa-arrow-down-up-across-line {
  --fa: "\e4af";
}

.fa-arrow-down-up-lock {
  --fa: "\e4b0";
}

.fa-arrow-right-to-city {
  --fa: "\e4b3";
}

.fa-arrow-up-from-ground-water {
  --fa: "\e4b5";
}

.fa-arrow-up-from-water-pump {
  --fa: "\e4b6";
}

.fa-arrow-up-right-dots {
  --fa: "\e4b7";
}

.fa-arrows-down-to-line {
  --fa: "\e4b8";
}

.fa-arrows-down-to-people {
  --fa: "\e4b9";
}

.fa-arrows-left-right-to-line {
  --fa: "\e4ba";
}

.fa-arrows-spin {
  --fa: "\e4bb";
}

.fa-arrows-split-up-and-left {
  --fa: "\e4bc";
}

.fa-arrows-to-circle {
  --fa: "\e4bd";
}

.fa-arrows-to-dot {
  --fa: "\e4be";
}

.fa-arrows-to-eye {
  --fa: "\e4bf";
}

.fa-arrows-turn-right {
  --fa: "\e4c0";
}

.fa-arrows-turn-to-dots {
  --fa: "\e4c1";
}

.fa-arrows-up-to-line {
  --fa: "\e4c2";
}

.fa-bore-hole {
  --fa: "\e4c3";
}

.fa-bottle-droplet {
  --fa: "\e4c4";
}

.fa-bottle-water {
  --fa: "\e4c5";
}

.fa-bowl-food {
  --fa: "\e4c6";
}

.fa-boxes-packing {
  --fa: "\e4c7";
}

.fa-bridge {
  --fa: "\e4c8";
}

.fa-bridge-circle-check {
  --fa: "\e4c9";
}

.fa-bridge-circle-exclamation {
  --fa: "\e4ca";
}

.fa-bridge-circle-xmark {
  --fa: "\e4cb";
}

.fa-bridge-lock {
  --fa: "\e4cc";
}

.fa-bridge-water {
  --fa: "\e4ce";
}

.fa-bucket {
  --fa: "\e4cf";
}

.fa-bugs {
  --fa: "\e4d0";
}

.fa-building-circle-arrow-right {
  --fa: "\e4d1";
}

.fa-building-circle-check {
  --fa: "\e4d2";
}

.fa-building-circle-exclamation {
  --fa: "\e4d3";
}

.fa-building-circle-xmark {
  --fa: "\e4d4";
}

.fa-building-flag {
  --fa: "\e4d5";
}

.fa-building-lock {
  --fa: "\e4d6";
}

.fa-building-ngo {
  --fa: "\e4d7";
}

.fa-building-shield {
  --fa: "\e4d8";
}

.fa-building-un {
  --fa: "\e4d9";
}

.fa-building-user {
  --fa: "\e4da";
}

.fa-building-wheat {
  --fa: "\e4db";
}

.fa-burst {
  --fa: "\e4dc";
}

.fa-car-on {
  --fa: "\e4dd";
}

.fa-car-tunnel {
  --fa: "\e4de";
}

.fa-child-combatant {
  --fa: "\e4e0";
}

.fa-child-rifle {
  --fa: "\e4e0";
}

.fa-children {
  --fa: "\e4e1";
}

.fa-circle-nodes {
  --fa: "\e4e2";
}

.fa-clipboard-question {
  --fa: "\e4e3";
}

.fa-cloud-showers-water {
  --fa: "\e4e4";
}

.fa-computer {
  --fa: "\e4e5";
}

.fa-cubes-stacked {
  --fa: "\e4e6";
}

.fa-envelope-circle-check {
  --fa: "\e4e8";
}

.fa-explosion {
  --fa: "\e4e9";
}

.fa-ferry {
  --fa: "\e4ea";
}

.fa-file-circle-exclamation {
  --fa: "\e4eb";
}

.fa-file-circle-minus {
  --fa: "\e4ed";
}

.fa-file-circle-question {
  --fa: "\e4ef";
}

.fa-file-shield {
  --fa: "\e4f0";
}

.fa-fire-burner {
  --fa: "\e4f1";
}

.fa-fish-fins {
  --fa: "\e4f2";
}

.fa-flask-vial {
  --fa: "\e4f3";
}

.fa-glass-water {
  --fa: "\e4f4";
}

.fa-glass-water-droplet {
  --fa: "\e4f5";
}

.fa-group-arrows-rotate {
  --fa: "\e4f6";
}

.fa-hand-holding-hand {
  --fa: "\e4f7";
}

.fa-handcuffs {
  --fa: "\e4f8";
}

.fa-hands-bound {
  --fa: "\e4f9";
}

.fa-hands-holding-child {
  --fa: "\e4fa";
}

.fa-hands-holding-circle {
  --fa: "\e4fb";
}

.fa-heart-circle-bolt {
  --fa: "\e4fc";
}

.fa-heart-circle-check {
  --fa: "\e4fd";
}

.fa-heart-circle-exclamation {
  --fa: "\e4fe";
}

.fa-heart-circle-minus {
  --fa: "\e4ff";
}

.fa-heart-circle-plus {
  --fa: "\e500";
}

.fa-heart-circle-xmark {
  --fa: "\e501";
}

.fa-helicopter-symbol {
  --fa: "\e502";
}

.fa-helmet-un {
  --fa: "\e503";
}

.fa-hill-avalanche {
  --fa: "\e507";
}

.fa-hill-rockslide {
  --fa: "\e508";
}

.fa-house-circle-check {
  --fa: "\e509";
}

.fa-house-circle-exclamation {
  --fa: "\e50a";
}

.fa-house-circle-xmark {
  --fa: "\e50b";
}

.fa-house-fire {
  --fa: "\e50c";
}

.fa-house-flag {
  --fa: "\e50d";
}

.fa-house-flood-water {
  --fa: "\e50e";
}

.fa-house-flood-water-circle-arrow-right {
  --fa: "\e50f";
}

.fa-house-lock {
  --fa: "\e510";
}

.fa-house-medical-circle-check {
  --fa: "\e511";
}

.fa-house-medical-circle-exclamation {
  --fa: "\e512";
}

.fa-house-medical-circle-xmark {
  --fa: "\e513";
}

.fa-house-medical-flag {
  --fa: "\e514";
}

.fa-house-tsunami {
  --fa: "\e515";
}

.fa-jar {
  --fa: "\e516";
}

.fa-jar-wheat {
  --fa: "\e517";
}

.fa-jet-fighter-up {
  --fa: "\e518";
}

.fa-jug-detergent {
  --fa: "\e519";
}

.fa-kitchen-set {
  --fa: "\e51a";
}

.fa-land-mine-on {
  --fa: "\e51b";
}

.fa-landmark-flag {
  --fa: "\e51c";
}

.fa-laptop-file {
  --fa: "\e51d";
}

.fa-lines-leaning {
  --fa: "\e51e";
}

.fa-location-pin-lock {
  --fa: "\e51f";
}

.fa-locust {
  --fa: "\e520";
}

.fa-magnifying-glass-arrow-right {
  --fa: "\e521";
}

.fa-magnifying-glass-chart {
  --fa: "\e522";
}

.fa-mars-and-venus-burst {
  --fa: "\e523";
}

.fa-mask-ventilator {
  --fa: "\e524";
}

.fa-mattress-pillow {
  --fa: "\e525";
}

.fa-mobile-retro {
  --fa: "\e527";
}

.fa-money-bill-transfer {
  --fa: "\e528";
}

.fa-money-bill-trend-up {
  --fa: "\e529";
}

.fa-money-bill-wheat {
  --fa: "\e52a";
}

.fa-mosquito {
  --fa: "\e52b";
}

.fa-mosquito-net {
  --fa: "\e52c";
}

.fa-mound {
  --fa: "\e52d";
}

.fa-mountain-city {
  --fa: "\e52e";
}

.fa-mountain-sun {
  --fa: "\e52f";
}

.fa-oil-well {
  --fa: "\e532";
}

.fa-people-group {
  --fa: "\e533";
}

.fa-people-line {
  --fa: "\e534";
}

.fa-people-pulling {
  --fa: "\e535";
}

.fa-people-robbery {
  --fa: "\e536";
}

.fa-people-roof {
  --fa: "\e537";
}

.fa-person-arrow-down-to-line {
  --fa: "\e538";
}

.fa-person-arrow-up-from-line {
  --fa: "\e539";
}

.fa-person-breastfeeding {
  --fa: "\e53a";
}

.fa-person-burst {
  --fa: "\e53b";
}

.fa-person-cane {
  --fa: "\e53c";
}

.fa-person-chalkboard {
  --fa: "\e53d";
}

.fa-person-circle-check {
  --fa: "\e53e";
}

.fa-person-circle-exclamation {
  --fa: "\e53f";
}

.fa-person-circle-minus {
  --fa: "\e540";
}

.fa-person-circle-plus {
  --fa: "\e541";
}

.fa-person-circle-question {
  --fa: "\e542";
}

.fa-person-circle-xmark {
  --fa: "\e543";
}

.fa-person-dress-burst {
  --fa: "\e544";
}

.fa-person-drowning {
  --fa: "\e545";
}

.fa-person-falling {
  --fa: "\e546";
}

.fa-person-falling-burst {
  --fa: "\e547";
}

.fa-person-half-dress {
  --fa: "\e548";
}

.fa-person-harassing {
  --fa: "\e549";
}

.fa-person-military-pointing {
  --fa: "\e54a";
}

.fa-person-military-rifle {
  --fa: "\e54b";
}

.fa-person-military-to-person {
  --fa: "\e54c";
}

.fa-person-rays {
  --fa: "\e54d";
}

.fa-person-rifle {
  --fa: "\e54e";
}

.fa-person-shelter {
  --fa: "\e54f";
}

.fa-person-walking-arrow-loop-left {
  --fa: "\e551";
}

.fa-person-walking-arrow-right {
  --fa: "\e552";
}

.fa-person-walking-dashed-line-arrow-right {
  --fa: "\e553";
}

.fa-person-walking-luggage {
  --fa: "\e554";
}

.fa-plane-circle-check {
  --fa: "\e555";
}

.fa-plane-circle-exclamation {
  --fa: "\e556";
}

.fa-plane-circle-xmark {
  --fa: "\e557";
}

.fa-plane-lock {
  --fa: "\e558";
}

.fa-plate-wheat {
  --fa: "\e55a";
}

.fa-plug-circle-bolt {
  --fa: "\e55b";
}

.fa-plug-circle-check {
  --fa: "\e55c";
}

.fa-plug-circle-exclamation {
  --fa: "\e55d";
}

.fa-plug-circle-minus {
  --fa: "\e55e";
}

.fa-plug-circle-plus {
  --fa: "\e55f";
}

.fa-plug-circle-xmark {
  --fa: "\e560";
}

.fa-ranking-star {
  --fa: "\e561";
}

.fa-road-barrier {
  --fa: "\e562";
}

.fa-road-bridge {
  --fa: "\e563";
}

.fa-road-circle-check {
  --fa: "\e564";
}

.fa-road-circle-exclamation {
  --fa: "\e565";
}

.fa-road-circle-xmark {
  --fa: "\e566";
}

.fa-road-lock {
  --fa: "\e567";
}

.fa-road-spikes {
  --fa: "\e568";
}

.fa-rug {
  --fa: "\e569";
}

.fa-sack-xmark {
  --fa: "\e56a";
}

.fa-school-circle-check {
  --fa: "\e56b";
}

.fa-school-circle-exclamation {
  --fa: "\e56c";
}

.fa-school-circle-xmark {
  --fa: "\e56d";
}

.fa-school-flag {
  --fa: "\e56e";
}

.fa-school-lock {
  --fa: "\e56f";
}

.fa-sheet-plastic {
  --fa: "\e571";
}

.fa-shield-cat {
  --fa: "\e572";
}

.fa-shield-dog {
  --fa: "\e573";
}

.fa-shield-heart {
  --fa: "\e574";
}

.fa-square-nfi {
  --fa: "\e576";
}

.fa-square-person-confined {
  --fa: "\e577";
}

.fa-square-virus {
  --fa: "\e578";
}

.fa-staff-snake {
  --fa: "\e579";
}

.fa-rod-asclepius {
  --fa: "\e579";
}

.fa-rod-snake {
  --fa: "\e579";
}

.fa-staff-aesculapius {
  --fa: "\e579";
}

.fa-sun-plant-wilt {
  --fa: "\e57a";
}

.fa-tarp {
  --fa: "\e57b";
}

.fa-tarp-droplet {
  --fa: "\e57c";
}

.fa-tent {
  --fa: "\e57d";
}

.fa-tent-arrow-down-to-line {
  --fa: "\e57e";
}

.fa-tent-arrow-left-right {
  --fa: "\e57f";
}

.fa-tent-arrow-turn-left {
  --fa: "\e580";
}

.fa-tent-arrows-down {
  --fa: "\e581";
}

.fa-tents {
  --fa: "\e582";
}

.fa-toilet-portable {
  --fa: "\e583";
}

.fa-toilets-portable {
  --fa: "\e584";
}

.fa-tower-cell {
  --fa: "\e585";
}

.fa-tower-observation {
  --fa: "\e586";
}

.fa-tree-city {
  --fa: "\e587";
}

.fa-trowel {
  --fa: "\e589";
}

.fa-trowel-bricks {
  --fa: "\e58a";
}

.fa-truck-arrow-right {
  --fa: "\e58b";
}

.fa-truck-droplet {
  --fa: "\e58c";
}

.fa-truck-field {
  --fa: "\e58d";
}

.fa-truck-field-un {
  --fa: "\e58e";
}

.fa-truck-plane {
  --fa: "\e58f";
}

.fa-users-between-lines {
  --fa: "\e591";
}

.fa-users-line {
  --fa: "\e592";
}

.fa-users-rays {
  --fa: "\e593";
}

.fa-users-rectangle {
  --fa: "\e594";
}

.fa-users-viewfinder {
  --fa: "\e595";
}

.fa-vial-circle-check {
  --fa: "\e596";
}

.fa-vial-virus {
  --fa: "\e597";
}

.fa-wheat-awn-circle-exclamation {
  --fa: "\e598";
}

.fa-worm {
  --fa: "\e599";
}

.fa-xmarks-lines {
  --fa: "\e59a";
}

.fa-child-dress {
  --fa: "\e59c";
}

.fa-child-reaching {
  --fa: "\e59d";
}

.fa-file-circle-check {
  --fa: "\e5a0";
}

.fa-file-circle-xmark {
  --fa: "\e5a1";
}

.fa-person-through-window {
  --fa: "\e5a9";
}

.fa-plant-wilt {
  --fa: "\e5aa";
}

.fa-stapler {
  --fa: "\e5af";
}

.fa-train-tram {
  --fa: "\e5b4";
}

.fa-table-cells-column-lock {
  --fa: "\e678";
}

.fa-table-cells-row-lock {
  --fa: "\e67a";
}

.fa-web-awesome {
  --fa: "\e682";
}

.fa-thumbtack-slash {
  --fa: "\e68f";
}

.fa-thumb-tack-slash {
  --fa: "\e68f";
}

.fa-table-cells-row-unlock {
  --fa: "\e691";
}

.fa-chart-diagram {
  --fa: "\e695";
}

.fa-comment-nodes {
  --fa: "\e696";
}

.fa-file-fragment {
  --fa: "\e697";
}

.fa-file-half-dashed {
  --fa: "\e698";
}

.fa-hexagon-nodes {
  --fa: "\e699";
}

.fa-hexagon-nodes-bolt {
  --fa: "\e69a";
}

.fa-square-binary {
  --fa: "\e69b";
}

.fa-pentagon {
  --fa: "\e790";
}

.fa-non-binary {
  --fa: "\e807";
}

.fa-spiral {
  --fa: "\e80a";
}

.fa-picture-in-picture {
  --fa: "\e80b";
}

.fa-mobile-vibrate {
  --fa: "\e816";
}

.fa-single-quote-left {
  --fa: "\e81b";
}

.fa-single-quote-right {
  --fa: "\e81c";
}

.fa-bus-side {
  --fa: "\e81d";
}

.fa-septagon {
  --fa: "\e820";
}

.fa-heptagon {
  --fa: "\e820";
}

.fa-aquarius {
  --fa: "\e845";
}

.fa-aries {
  --fa: "\e846";
}

.fa-cancer {
  --fa: "\e847";
}

.fa-capricorn {
  --fa: "\e848";
}

.fa-gemini {
  --fa: "\e849";
}

.fa-leo {
  --fa: "\e84a";
}

.fa-libra {
  --fa: "\e84b";
}

.fa-pisces {
  --fa: "\e84c";
}

.fa-sagittarius {
  --fa: "\e84d";
}

.fa-scorpio {
  --fa: "\e84e";
}

.fa-taurus {
  --fa: "\e84f";
}

.fa-virgo {
  --fa: "\e850";
}

.fa-martini-glass-empty {
  --fa: "\f000";
}

.fa-glass-martini {
  --fa: "\f000";
}

.fa-music {
  --fa: "\f001";
}

.fa-magnifying-glass {
  --fa: "\f002";
}

.fa-search {
  --fa: "\f002";
}

.fa-heart {
  --fa: "\f004";
}

.fa-star {
  --fa: "\f005";
}

.fa-user {
  --fa: "\f007";
}

.fa-user-alt {
  --fa: "\f007";
}

.fa-user-large {
  --fa: "\f007";
}

.fa-film {
  --fa: "\f008";
}

.fa-film-alt {
  --fa: "\f008";
}

.fa-film-simple {
  --fa: "\f008";
}

.fa-table-cells-large {
  --fa: "\f009";
}

.fa-th-large {
  --fa: "\f009";
}

.fa-table-cells {
  --fa: "\f00a";
}

.fa-th {
  --fa: "\f00a";
}

.fa-table-list {
  --fa: "\f00b";
}

.fa-th-list {
  --fa: "\f00b";
}

.fa-check {
  --fa: "\f00c";
}

.fa-xmark {
  --fa: "\f00d";
}

.fa-close {
  --fa: "\f00d";
}

.fa-multiply {
  --fa: "\f00d";
}

.fa-remove {
  --fa: "\f00d";
}

.fa-times {
  --fa: "\f00d";
}

.fa-magnifying-glass-plus {
  --fa: "\f00e";
}

.fa-search-plus {
  --fa: "\f00e";
}

.fa-magnifying-glass-minus {
  --fa: "\f010";
}

.fa-search-minus {
  --fa: "\f010";
}

.fa-power-off {
  --fa: "\f011";
}

.fa-signal {
  --fa: "\f012";
}

.fa-signal-5 {
  --fa: "\f012";
}

.fa-signal-perfect {
  --fa: "\f012";
}

.fa-gear {
  --fa: "\f013";
}

.fa-cog {
  --fa: "\f013";
}

.fa-house {
  --fa: "\f015";
}

.fa-home {
  --fa: "\f015";
}

.fa-home-alt {
  --fa: "\f015";
}

.fa-home-lg-alt {
  --fa: "\f015";
}

.fa-clock {
  --fa: "\f017";
}

.fa-clock-four {
  --fa: "\f017";
}

.fa-road {
  --fa: "\f018";
}

.fa-download {
  --fa: "\f019";
}

.fa-inbox {
  --fa: "\f01c";
}

.fa-arrow-rotate-right {
  --fa: "\f01e";
}

.fa-arrow-right-rotate {
  --fa: "\f01e";
}

.fa-arrow-rotate-forward {
  --fa: "\f01e";
}

.fa-redo {
  --fa: "\f01e";
}

.fa-arrows-rotate {
  --fa: "\f021";
}

.fa-refresh {
  --fa: "\f021";
}

.fa-sync {
  --fa: "\f021";
}

.fa-rectangle-list {
  --fa: "\f022";
}

.fa-list-alt {
  --fa: "\f022";
}

.fa-lock {
  --fa: "\f023";
}

.fa-flag {
  --fa: "\f024";
}

.fa-headphones {
  --fa: "\f025";
}

.fa-headphones-alt {
  --fa: "\f025";
}

.fa-headphones-simple {
  --fa: "\f025";
}

.fa-volume-off {
  --fa: "\f026";
}

.fa-volume-low {
  --fa: "\f027";
}

.fa-volume-down {
  --fa: "\f027";
}

.fa-volume-high {
  --fa: "\f028";
}

.fa-volume-up {
  --fa: "\f028";
}

.fa-qrcode {
  --fa: "\f029";
}

.fa-barcode {
  --fa: "\f02a";
}

.fa-tag {
  --fa: "\f02b";
}

.fa-tags {
  --fa: "\f02c";
}

.fa-book {
  --fa: "\f02d";
}

.fa-bookmark {
  --fa: "\f02e";
}

.fa-print {
  --fa: "\f02f";
}

.fa-camera {
  --fa: "\f030";
}

.fa-camera-alt {
  --fa: "\f030";
}

.fa-font {
  --fa: "\f031";
}

.fa-bold {
  --fa: "\f032";
}

.fa-italic {
  --fa: "\f033";
}

.fa-text-height {
  --fa: "\f034";
}

.fa-text-width {
  --fa: "\f035";
}

.fa-align-left {
  --fa: "\f036";
}

.fa-align-center {
  --fa: "\f037";
}

.fa-align-right {
  --fa: "\f038";
}

.fa-align-justify {
  --fa: "\f039";
}

.fa-list {
  --fa: "\f03a";
}

.fa-list-squares {
  --fa: "\f03a";
}

.fa-outdent {
  --fa: "\f03b";
}

.fa-dedent {
  --fa: "\f03b";
}

.fa-indent {
  --fa: "\f03c";
}

.fa-video {
  --fa: "\f03d";
}

.fa-video-camera {
  --fa: "\f03d";
}

.fa-image {
  --fa: "\f03e";
}

.fa-location-pin {
  --fa: "\f041";
}

.fa-map-marker {
  --fa: "\f041";
}

.fa-circle-half-stroke {
  --fa: "\f042";
}

.fa-adjust {
  --fa: "\f042";
}

.fa-droplet {
  --fa: "\f043";
}

.fa-tint {
  --fa: "\f043";
}

.fa-pen-to-square {
  --fa: "\f044";
}

.fa-edit {
  --fa: "\f044";
}

.fa-arrows-up-down-left-right {
  --fa: "\f047";
}

.fa-arrows {
  --fa: "\f047";
}

.fa-backward-step {
  --fa: "\f048";
}

.fa-step-backward {
  --fa: "\f048";
}

.fa-backward-fast {
  --fa: "\f049";
}

.fa-fast-backward {
  --fa: "\f049";
}

.fa-backward {
  --fa: "\f04a";
}

.fa-play {
  --fa: "\f04b";
}

.fa-pause {
  --fa: "\f04c";
}

.fa-stop {
  --fa: "\f04d";
}

.fa-forward {
  --fa: "\f04e";
}

.fa-forward-fast {
  --fa: "\f050";
}

.fa-fast-forward {
  --fa: "\f050";
}

.fa-forward-step {
  --fa: "\f051";
}

.fa-step-forward {
  --fa: "\f051";
}

.fa-eject {
  --fa: "\f052";
}

.fa-chevron-left {
  --fa: "\f053";
}

.fa-chevron-right {
  --fa: "\f054";
}

.fa-circle-plus {
  --fa: "\f055";
}

.fa-plus-circle {
  --fa: "\f055";
}

.fa-circle-minus {
  --fa: "\f056";
}

.fa-minus-circle {
  --fa: "\f056";
}

.fa-circle-xmark {
  --fa: "\f057";
}

.fa-times-circle {
  --fa: "\f057";
}

.fa-xmark-circle {
  --fa: "\f057";
}

.fa-circle-check {
  --fa: "\f058";
}

.fa-check-circle {
  --fa: "\f058";
}

.fa-circle-question {
  --fa: "\f059";
}

.fa-question-circle {
  --fa: "\f059";
}

.fa-circle-info {
  --fa: "\f05a";
}

.fa-info-circle {
  --fa: "\f05a";
}

.fa-crosshairs {
  --fa: "\f05b";
}

.fa-ban {
  --fa: "\f05e";
}

.fa-cancel {
  --fa: "\f05e";
}

.fa-arrow-left {
  --fa: "\f060";
}

.fa-arrow-right {
  --fa: "\f061";
}

.fa-arrow-up {
  --fa: "\f062";
}

.fa-arrow-down {
  --fa: "\f063";
}

.fa-share {
  --fa: "\f064";
}

.fa-mail-forward {
  --fa: "\f064";
}

.fa-expand {
  --fa: "\f065";
}

.fa-compress {
  --fa: "\f066";
}

.fa-minus {
  --fa: "\f068";
}

.fa-subtract {
  --fa: "\f068";
}

.fa-circle-exclamation {
  --fa: "\f06a";
}

.fa-exclamation-circle {
  --fa: "\f06a";
}

.fa-gift {
  --fa: "\f06b";
}

.fa-leaf {
  --fa: "\f06c";
}

.fa-fire {
  --fa: "\f06d";
}

.fa-eye {
  --fa: "\f06e";
}

.fa-eye-slash {
  --fa: "\f070";
}

.fa-triangle-exclamation {
  --fa: "\f071";
}

.fa-exclamation-triangle {
  --fa: "\f071";
}

.fa-warning {
  --fa: "\f071";
}

.fa-plane {
  --fa: "\f072";
}

.fa-calendar-days {
  --fa: "\f073";
}

.fa-calendar-alt {
  --fa: "\f073";
}

.fa-shuffle {
  --fa: "\f074";
}

.fa-random {
  --fa: "\f074";
}

.fa-comment {
  --fa: "\f075";
}

.fa-magnet {
  --fa: "\f076";
}

.fa-chevron-up {
  --fa: "\f077";
}

.fa-chevron-down {
  --fa: "\f078";
}

.fa-retweet {
  --fa: "\f079";
}

.fa-cart-shopping {
  --fa: "\f07a";
}

.fa-shopping-cart {
  --fa: "\f07a";
}

.fa-folder {
  --fa: "\f07b";
}

.fa-folder-blank {
  --fa: "\f07b";
}

.fa-folder-open {
  --fa: "\f07c";
}

.fa-arrows-up-down {
  --fa: "\f07d";
}

.fa-arrows-v {
  --fa: "\f07d";
}

.fa-arrows-left-right {
  --fa: "\f07e";
}

.fa-arrows-h {
  --fa: "\f07e";
}

.fa-chart-bar {
  --fa: "\f080";
}

.fa-bar-chart {
  --fa: "\f080";
}

.fa-camera-retro {
  --fa: "\f083";
}

.fa-key {
  --fa: "\f084";
}

.fa-gears {
  --fa: "\f085";
}

.fa-cogs {
  --fa: "\f085";
}

.fa-comments {
  --fa: "\f086";
}

.fa-star-half {
  --fa: "\f089";
}

.fa-arrow-right-from-bracket {
  --fa: "\f08b";
}

.fa-sign-out {
  --fa: "\f08b";
}

.fa-thumbtack {
  --fa: "\f08d";
}

.fa-thumb-tack {
  --fa: "\f08d";
}

.fa-arrow-up-right-from-square {
  --fa: "\f08e";
}

.fa-external-link {
  --fa: "\f08e";
}

.fa-arrow-right-to-bracket {
  --fa: "\f090";
}

.fa-sign-in {
  --fa: "\f090";
}

.fa-trophy {
  --fa: "\f091";
}

.fa-upload {
  --fa: "\f093";
}

.fa-lemon {
  --fa: "\f094";
}

.fa-phone {
  --fa: "\f095";
}

.fa-square-phone {
  --fa: "\f098";
}

.fa-phone-square {
  --fa: "\f098";
}

.fa-unlock {
  --fa: "\f09c";
}

.fa-credit-card {
  --fa: "\f09d";
}

.fa-credit-card-alt {
  --fa: "\f09d";
}

.fa-rss {
  --fa: "\f09e";
}

.fa-feed {
  --fa: "\f09e";
}

.fa-hard-drive {
  --fa: "\f0a0";
}

.fa-hdd {
  --fa: "\f0a0";
}

.fa-bullhorn {
  --fa: "\f0a1";
}

.fa-certificate {
  --fa: "\f0a3";
}

.fa-hand-point-right {
  --fa: "\f0a4";
}

.fa-hand-point-left {
  --fa: "\f0a5";
}

.fa-hand-point-up {
  --fa: "\f0a6";
}

.fa-hand-point-down {
  --fa: "\f0a7";
}

.fa-circle-arrow-left {
  --fa: "\f0a8";
}

.fa-arrow-circle-left {
  --fa: "\f0a8";
}

.fa-circle-arrow-right {
  --fa: "\f0a9";
}

.fa-arrow-circle-right {
  --fa: "\f0a9";
}

.fa-circle-arrow-up {
  --fa: "\f0aa";
}

.fa-arrow-circle-up {
  --fa: "\f0aa";
}

.fa-circle-arrow-down {
  --fa: "\f0ab";
}

.fa-arrow-circle-down {
  --fa: "\f0ab";
}

.fa-globe {
  --fa: "\f0ac";
}

.fa-wrench {
  --fa: "\f0ad";
}

.fa-list-check {
  --fa: "\f0ae";
}

.fa-tasks {
  --fa: "\f0ae";
}

.fa-filter {
  --fa: "\f0b0";
}

.fa-briefcase {
  --fa: "\f0b1";
}

.fa-up-down-left-right {
  --fa: "\f0b2";
}

.fa-arrows-alt {
  --fa: "\f0b2";
}

.fa-users {
  --fa: "\f0c0";
}

.fa-link {
  --fa: "\f0c1";
}

.fa-chain {
  --fa: "\f0c1";
}

.fa-cloud {
  --fa: "\f0c2";
}

.fa-flask {
  --fa: "\f0c3";
}

.fa-scissors {
  --fa: "\f0c4";
}

.fa-cut {
  --fa: "\f0c4";
}

.fa-copy {
  --fa: "\f0c5";
}

.fa-paperclip {
  --fa: "\f0c6";
}

.fa-floppy-disk {
  --fa: "\f0c7";
}

.fa-save {
  --fa: "\f0c7";
}

.fa-square {
  --fa: "\f0c8";
}

.fa-bars {
  --fa: "\f0c9";
}

.fa-navicon {
  --fa: "\f0c9";
}

.fa-list-ul {
  --fa: "\f0ca";
}

.fa-list-dots {
  --fa: "\f0ca";
}

.fa-list-ol {
  --fa: "\f0cb";
}

.fa-list-1-2 {
  --fa: "\f0cb";
}

.fa-list-numeric {
  --fa: "\f0cb";
}

.fa-strikethrough {
  --fa: "\f0cc";
}

.fa-underline {
  --fa: "\f0cd";
}

.fa-table {
  --fa: "\f0ce";
}

.fa-wand-magic {
  --fa: "\f0d0";
}

.fa-magic {
  --fa: "\f0d0";
}

.fa-truck {
  --fa: "\f0d1";
}

.fa-money-bill {
  --fa: "\f0d6";
}

.fa-caret-down {
  --fa: "\f0d7";
}

.fa-caret-up {
  --fa: "\f0d8";
}

.fa-caret-left {
  --fa: "\f0d9";
}

.fa-caret-right {
  --fa: "\f0da";
}

.fa-table-columns {
  --fa: "\f0db";
}

.fa-columns {
  --fa: "\f0db";
}

.fa-sort {
  --fa: "\f0dc";
}

.fa-unsorted {
  --fa: "\f0dc";
}

.fa-sort-down {
  --fa: "\f0dd";
}

.fa-sort-desc {
  --fa: "\f0dd";
}

.fa-sort-up {
  --fa: "\f0de";
}

.fa-sort-asc {
  --fa: "\f0de";
}

.fa-envelope {
  --fa: "\f0e0";
}

.fa-arrow-rotate-left {
  --fa: "\f0e2";
}

.fa-arrow-left-rotate {
  --fa: "\f0e2";
}

.fa-arrow-rotate-back {
  --fa: "\f0e2";
}

.fa-arrow-rotate-backward {
  --fa: "\f0e2";
}

.fa-undo {
  --fa: "\f0e2";
}

.fa-gavel {
  --fa: "\f0e3";
}

.fa-legal {
  --fa: "\f0e3";
}

.fa-bolt {
  --fa: "\f0e7";
}

.fa-zap {
  --fa: "\f0e7";
}

.fa-sitemap {
  --fa: "\f0e8";
}

.fa-umbrella {
  --fa: "\f0e9";
}

.fa-paste {
  --fa: "\f0ea";
}

.fa-file-clipboard {
  --fa: "\f0ea";
}

.fa-lightbulb {
  --fa: "\f0eb";
}

.fa-arrow-right-arrow-left {
  --fa: "\f0ec";
}

.fa-exchange {
  --fa: "\f0ec";
}

.fa-cloud-arrow-down {
  --fa: "\f0ed";
}

.fa-cloud-download {
  --fa: "\f0ed";
}

.fa-cloud-download-alt {
  --fa: "\f0ed";
}

.fa-cloud-arrow-up {
  --fa: "\f0ee";
}

.fa-cloud-upload {
  --fa: "\f0ee";
}

.fa-cloud-upload-alt {
  --fa: "\f0ee";
}

.fa-user-doctor {
  --fa: "\f0f0";
}

.fa-user-md {
  --fa: "\f0f0";
}

.fa-stethoscope {
  --fa: "\f0f1";
}

.fa-suitcase {
  --fa: "\f0f2";
}

.fa-bell {
  --fa: "\f0f3";
}

.fa-mug-saucer {
  --fa: "\f0f4";
}

.fa-coffee {
  --fa: "\f0f4";
}

.fa-hospital {
  --fa: "\f0f8";
}

.fa-hospital-alt {
  --fa: "\f0f8";
}

.fa-hospital-wide {
  --fa: "\f0f8";
}

.fa-truck-medical {
  --fa: "\f0f9";
}

.fa-ambulance {
  --fa: "\f0f9";
}

.fa-suitcase-medical {
  --fa: "\f0fa";
}

.fa-medkit {
  --fa: "\f0fa";
}

.fa-jet-fighter {
  --fa: "\f0fb";
}

.fa-fighter-jet {
  --fa: "\f0fb";
}

.fa-beer-mug-empty {
  --fa: "\f0fc";
}

.fa-beer {
  --fa: "\f0fc";
}

.fa-square-h {
  --fa: "\f0fd";
}

.fa-h-square {
  --fa: "\f0fd";
}

.fa-square-plus {
  --fa: "\f0fe";
}

.fa-plus-square {
  --fa: "\f0fe";
}

.fa-angles-left {
  --fa: "\f100";
}

.fa-angle-double-left {
  --fa: "\f100";
}

.fa-angles-right {
  --fa: "\f101";
}

.fa-angle-double-right {
  --fa: "\f101";
}

.fa-angles-up {
  --fa: "\f102";
}

.fa-angle-double-up {
  --fa: "\f102";
}

.fa-angles-down {
  --fa: "\f103";
}

.fa-angle-double-down {
  --fa: "\f103";
}

.fa-angle-left {
  --fa: "\f104";
}

.fa-angle-right {
  --fa: "\f105";
}

.fa-angle-up {
  --fa: "\f106";
}

.fa-angle-down {
  --fa: "\f107";
}

.fa-laptop {
  --fa: "\f109";
}

.fa-tablet-button {
  --fa: "\f10a";
}

.fa-mobile-button {
  --fa: "\f10b";
}

.fa-quote-left {
  --fa: "\f10d";
}

.fa-quote-left-alt {
  --fa: "\f10d";
}

.fa-quote-right {
  --fa: "\f10e";
}

.fa-quote-right-alt {
  --fa: "\f10e";
}

.fa-spinner {
  --fa: "\f110";
}

.fa-circle {
  --fa: "\f111";
}

.fa-face-smile {
  --fa: "\f118";
}

.fa-smile {
  --fa: "\f118";
}

.fa-face-frown {
  --fa: "\f119";
}

.fa-frown {
  --fa: "\f119";
}

.fa-face-meh {
  --fa: "\f11a";
}

.fa-meh {
  --fa: "\f11a";
}

.fa-gamepad {
  --fa: "\f11b";
}

.fa-keyboard {
  --fa: "\f11c";
}

.fa-flag-checkered {
  --fa: "\f11e";
}

.fa-terminal {
  --fa: "\f120";
}

.fa-code {
  --fa: "\f121";
}

.fa-reply-all {
  --fa: "\f122";
}

.fa-mail-reply-all {
  --fa: "\f122";
}

.fa-location-arrow {
  --fa: "\f124";
}

.fa-crop {
  --fa: "\f125";
}

.fa-code-branch {
  --fa: "\f126";
}

.fa-link-slash {
  --fa: "\f127";
}

.fa-chain-broken {
  --fa: "\f127";
}

.fa-chain-slash {
  --fa: "\f127";
}

.fa-unlink {
  --fa: "\f127";
}

.fa-info {
  --fa: "\f129";
}

.fa-superscript {
  --fa: "\f12b";
}

.fa-subscript {
  --fa: "\f12c";
}

.fa-eraser {
  --fa: "\f12d";
}

.fa-puzzle-piece {
  --fa: "\f12e";
}

.fa-microphone {
  --fa: "\f130";
}

.fa-microphone-slash {
  --fa: "\f131";
}

.fa-shield {
  --fa: "\f132";
}

.fa-shield-blank {
  --fa: "\f132";
}

.fa-calendar {
  --fa: "\f133";
}

.fa-fire-extinguisher {
  --fa: "\f134";
}

.fa-rocket {
  --fa: "\f135";
}

.fa-circle-chevron-left {
  --fa: "\f137";
}

.fa-chevron-circle-left {
  --fa: "\f137";
}

.fa-circle-chevron-right {
  --fa: "\f138";
}

.fa-chevron-circle-right {
  --fa: "\f138";
}

.fa-circle-chevron-up {
  --fa: "\f139";
}

.fa-chevron-circle-up {
  --fa: "\f139";
}

.fa-circle-chevron-down {
  --fa: "\f13a";
}

.fa-chevron-circle-down {
  --fa: "\f13a";
}

.fa-anchor {
  --fa: "\f13d";
}

.fa-unlock-keyhole {
  --fa: "\f13e";
}

.fa-unlock-alt {
  --fa: "\f13e";
}

.fa-bullseye {
  --fa: "\f140";
}

.fa-ellipsis {
  --fa: "\f141";
}

.fa-ellipsis-h {
  --fa: "\f141";
}

.fa-ellipsis-vertical {
  --fa: "\f142";
}

.fa-ellipsis-v {
  --fa: "\f142";
}

.fa-square-rss {
  --fa: "\f143";
}

.fa-rss-square {
  --fa: "\f143";
}

.fa-circle-play {
  --fa: "\f144";
}

.fa-play-circle {
  --fa: "\f144";
}

.fa-ticket {
  --fa: "\f145";
}

.fa-square-minus {
  --fa: "\f146";
}

.fa-minus-square {
  --fa: "\f146";
}

.fa-arrow-turn-up {
  --fa: "\f148";
}

.fa-level-up {
  --fa: "\f148";
}

.fa-arrow-turn-down {
  --fa: "\f149";
}

.fa-level-down {
  --fa: "\f149";
}

.fa-square-check {
  --fa: "\f14a";
}

.fa-check-square {
  --fa: "\f14a";
}

.fa-square-pen {
  --fa: "\f14b";
}

.fa-pen-square {
  --fa: "\f14b";
}

.fa-pencil-square {
  --fa: "\f14b";
}

.fa-square-arrow-up-right {
  --fa: "\f14c";
}

.fa-external-link-square {
  --fa: "\f14c";
}

.fa-share-from-square {
  --fa: "\f14d";
}

.fa-share-square {
  --fa: "\f14d";
}

.fa-compass {
  --fa: "\f14e";
}

.fa-square-caret-down {
  --fa: "\f150";
}

.fa-caret-square-down {
  --fa: "\f150";
}

.fa-square-caret-up {
  --fa: "\f151";
}

.fa-caret-square-up {
  --fa: "\f151";
}

.fa-square-caret-right {
  --fa: "\f152";
}

.fa-caret-square-right {
  --fa: "\f152";
}

.fa-euro-sign {
  --fa: "\f153";
}

.fa-eur {
  --fa: "\f153";
}

.fa-euro {
  --fa: "\f153";
}

.fa-sterling-sign {
  --fa: "\f154";
}

.fa-gbp {
  --fa: "\f154";
}

.fa-pound-sign {
  --fa: "\f154";
}

.fa-rupee-sign {
  --fa: "\f156";
}

.fa-rupee {
  --fa: "\f156";
}

.fa-yen-sign {
  --fa: "\f157";
}

.fa-cny {
  --fa: "\f157";
}

.fa-jpy {
  --fa: "\f157";
}

.fa-rmb {
  --fa: "\f157";
}

.fa-yen {
  --fa: "\f157";
}

.fa-ruble-sign {
  --fa: "\f158";
}

.fa-rouble {
  --fa: "\f158";
}

.fa-rub {
  --fa: "\f158";
}

.fa-ruble {
  --fa: "\f158";
}

.fa-won-sign {
  --fa: "\f159";
}

.fa-krw {
  --fa: "\f159";
}

.fa-won {
  --fa: "\f159";
}

.fa-file {
  --fa: "\f15b";
}

.fa-file-lines {
  --fa: "\f15c";
}

.fa-file-alt {
  --fa: "\f15c";
}

.fa-file-text {
  --fa: "\f15c";
}

.fa-arrow-down-a-z {
  --fa: "\f15d";
}

.fa-sort-alpha-asc {
  --fa: "\f15d";
}

.fa-sort-alpha-down {
  --fa: "\f15d";
}

.fa-arrow-up-a-z {
  --fa: "\f15e";
}

.fa-sort-alpha-up {
  --fa: "\f15e";
}

.fa-arrow-down-wide-short {
  --fa: "\f160";
}

.fa-sort-amount-asc {
  --fa: "\f160";
}

.fa-sort-amount-down {
  --fa: "\f160";
}

.fa-arrow-up-wide-short {
  --fa: "\f161";
}

.fa-sort-amount-up {
  --fa: "\f161";
}

.fa-arrow-down-1-9 {
  --fa: "\f162";
}

.fa-sort-numeric-asc {
  --fa: "\f162";
}

.fa-sort-numeric-down {
  --fa: "\f162";
}

.fa-arrow-up-1-9 {
  --fa: "\f163";
}

.fa-sort-numeric-up {
  --fa: "\f163";
}

.fa-thumbs-up {
  --fa: "\f164";
}

.fa-thumbs-down {
  --fa: "\f165";
}

.fa-arrow-down-long {
  --fa: "\f175";
}

.fa-long-arrow-down {
  --fa: "\f175";
}

.fa-arrow-up-long {
  --fa: "\f176";
}

.fa-long-arrow-up {
  --fa: "\f176";
}

.fa-arrow-left-long {
  --fa: "\f177";
}

.fa-long-arrow-left {
  --fa: "\f177";
}

.fa-arrow-right-long {
  --fa: "\f178";
}

.fa-long-arrow-right {
  --fa: "\f178";
}

.fa-person-dress {
  --fa: "\f182";
}

.fa-female {
  --fa: "\f182";
}

.fa-person {
  --fa: "\f183";
}

.fa-male {
  --fa: "\f183";
}

.fa-sun {
  --fa: "\f185";
}

.fa-moon {
  --fa: "\f186";
}

.fa-box-archive {
  --fa: "\f187";
}

.fa-archive {
  --fa: "\f187";
}

.fa-bug {
  --fa: "\f188";
}

.fa-square-caret-left {
  --fa: "\f191";
}

.fa-caret-square-left {
  --fa: "\f191";
}

.fa-circle-dot {
  --fa: "\f192";
}

.fa-dot-circle {
  --fa: "\f192";
}

.fa-wheelchair {
  --fa: "\f193";
}

.fa-lira-sign {
  --fa: "\f195";
}

.fa-shuttle-space {
  --fa: "\f197";
}

.fa-space-shuttle {
  --fa: "\f197";
}

.fa-square-envelope {
  --fa: "\f199";
}

.fa-envelope-square {
  --fa: "\f199";
}

.fa-building-columns {
  --fa: "\f19c";
}

.fa-bank {
  --fa: "\f19c";
}

.fa-institution {
  --fa: "\f19c";
}

.fa-museum {
  --fa: "\f19c";
}

.fa-university {
  --fa: "\f19c";
}

.fa-graduation-cap {
  --fa: "\f19d";
}

.fa-mortar-board {
  --fa: "\f19d";
}

.fa-language {
  --fa: "\f1ab";
}

.fa-fax {
  --fa: "\f1ac";
}

.fa-building {
  --fa: "\f1ad";
}

.fa-child {
  --fa: "\f1ae";
}

.fa-paw {
  --fa: "\f1b0";
}

.fa-cube {
  --fa: "\f1b2";
}

.fa-cubes {
  --fa: "\f1b3";
}

.fa-recycle {
  --fa: "\f1b8";
}

.fa-car {
  --fa: "\f1b9";
}

.fa-automobile {
  --fa: "\f1b9";
}

.fa-taxi {
  --fa: "\f1ba";
}

.fa-cab {
  --fa: "\f1ba";
}

.fa-tree {
  --fa: "\f1bb";
}

.fa-database {
  --fa: "\f1c0";
}

.fa-file-pdf {
  --fa: "\f1c1";
}

.fa-file-word {
  --fa: "\f1c2";
}

.fa-file-excel {
  --fa: "\f1c3";
}

.fa-file-powerpoint {
  --fa: "\f1c4";
}

.fa-file-image {
  --fa: "\f1c5";
}

.fa-file-zipper {
  --fa: "\f1c6";
}

.fa-file-archive {
  --fa: "\f1c6";
}

.fa-file-audio {
  --fa: "\f1c7";
}

.fa-file-video {
  --fa: "\f1c8";
}

.fa-file-code {
  --fa: "\f1c9";
}

.fa-life-ring {
  --fa: "\f1cd";
}

.fa-circle-notch {
  --fa: "\f1ce";
}

.fa-paper-plane {
  --fa: "\f1d8";
}

.fa-clock-rotate-left {
  --fa: "\f1da";
}

.fa-history {
  --fa: "\f1da";
}

.fa-heading {
  --fa: "\f1dc";
}

.fa-header {
  --fa: "\f1dc";
}

.fa-paragraph {
  --fa: "\f1dd";
}

.fa-sliders {
  --fa: "\f1de";
}

.fa-sliders-h {
  --fa: "\f1de";
}

.fa-share-nodes {
  --fa: "\f1e0";
}

.fa-share-alt {
  --fa: "\f1e0";
}

.fa-square-share-nodes {
  --fa: "\f1e1";
}

.fa-share-alt-square {
  --fa: "\f1e1";
}

.fa-bomb {
  --fa: "\f1e2";
}

.fa-futbol {
  --fa: "\f1e3";
}

.fa-futbol-ball {
  --fa: "\f1e3";
}

.fa-soccer-ball {
  --fa: "\f1e3";
}

.fa-tty {
  --fa: "\f1e4";
}

.fa-teletype {
  --fa: "\f1e4";
}

.fa-binoculars {
  --fa: "\f1e5";
}

.fa-plug {
  --fa: "\f1e6";
}

.fa-newspaper {
  --fa: "\f1ea";
}

.fa-wifi {
  --fa: "\f1eb";
}

.fa-wifi-3 {
  --fa: "\f1eb";
}

.fa-wifi-strong {
  --fa: "\f1eb";
}

.fa-calculator {
  --fa: "\f1ec";
}

.fa-bell-slash {
  --fa: "\f1f6";
}

.fa-trash {
  --fa: "\f1f8";
}

.fa-copyright {
  --fa: "\f1f9";
}

.fa-eye-dropper {
  --fa: "\f1fb";
}

.fa-eye-dropper-empty {
  --fa: "\f1fb";
}

.fa-eyedropper {
  --fa: "\f1fb";
}

.fa-paintbrush {
  --fa: "\f1fc";
}

.fa-paint-brush {
  --fa: "\f1fc";
}

.fa-cake-candles {
  --fa: "\f1fd";
}

.fa-birthday-cake {
  --fa: "\f1fd";
}

.fa-cake {
  --fa: "\f1fd";
}

.fa-chart-area {
  --fa: "\f1fe";
}

.fa-area-chart {
  --fa: "\f1fe";
}

.fa-chart-pie {
  --fa: "\f200";
}

.fa-pie-chart {
  --fa: "\f200";
}

.fa-chart-line {
  --fa: "\f201";
}

.fa-line-chart {
  --fa: "\f201";
}

.fa-toggle-off {
  --fa: "\f204";
}

.fa-toggle-on {
  --fa: "\f205";
}

.fa-bicycle {
  --fa: "\f206";
}

.fa-bus {
  --fa: "\f207";
}

.fa-closed-captioning {
  --fa: "\f20a";
}

.fa-shekel-sign {
  --fa: "\f20b";
}

.fa-ils {
  --fa: "\f20b";
}

.fa-shekel {
  --fa: "\f20b";
}

.fa-sheqel {
  --fa: "\f20b";
}

.fa-sheqel-sign {
  --fa: "\f20b";
}

.fa-cart-plus {
  --fa: "\f217";
}

.fa-cart-arrow-down {
  --fa: "\f218";
}

.fa-diamond {
  --fa: "\f219";
}

.fa-ship {
  --fa: "\f21a";
}

.fa-user-secret {
  --fa: "\f21b";
}

.fa-motorcycle {
  --fa: "\f21c";
}

.fa-street-view {
  --fa: "\f21d";
}

.fa-heart-pulse {
  --fa: "\f21e";
}

.fa-heartbeat {
  --fa: "\f21e";
}

.fa-venus {
  --fa: "\f221";
}

.fa-mars {
  --fa: "\f222";
}

.fa-mercury {
  --fa: "\f223";
}

.fa-mars-and-venus {
  --fa: "\f224";
}

.fa-transgender {
  --fa: "\f225";
}

.fa-transgender-alt {
  --fa: "\f225";
}

.fa-venus-double {
  --fa: "\f226";
}

.fa-mars-double {
  --fa: "\f227";
}

.fa-venus-mars {
  --fa: "\f228";
}

.fa-mars-stroke {
  --fa: "\f229";
}

.fa-mars-stroke-up {
  --fa: "\f22a";
}

.fa-mars-stroke-v {
  --fa: "\f22a";
}

.fa-mars-stroke-right {
  --fa: "\f22b";
}

.fa-mars-stroke-h {
  --fa: "\f22b";
}

.fa-neuter {
  --fa: "\f22c";
}

.fa-genderless {
  --fa: "\f22d";
}

.fa-server {
  --fa: "\f233";
}

.fa-user-plus {
  --fa: "\f234";
}

.fa-user-xmark {
  --fa: "\f235";
}

.fa-user-times {
  --fa: "\f235";
}

.fa-bed {
  --fa: "\f236";
}

.fa-train {
  --fa: "\f238";
}

.fa-train-subway {
  --fa: "\f239";
}

.fa-subway {
  --fa: "\f239";
}

.fa-battery-full {
  --fa: "\f240";
}

.fa-battery {
  --fa: "\f240";
}

.fa-battery-5 {
  --fa: "\f240";
}

.fa-battery-three-quarters {
  --fa: "\f241";
}

.fa-battery-4 {
  --fa: "\f241";
}

.fa-battery-half {
  --fa: "\f242";
}

.fa-battery-3 {
  --fa: "\f242";
}

.fa-battery-quarter {
  --fa: "\f243";
}

.fa-battery-2 {
  --fa: "\f243";
}

.fa-battery-empty {
  --fa: "\f244";
}

.fa-battery-0 {
  --fa: "\f244";
}

.fa-arrow-pointer {
  --fa: "\f245";
}

.fa-mouse-pointer {
  --fa: "\f245";
}

.fa-i-cursor {
  --fa: "\f246";
}

.fa-object-group {
  --fa: "\f247";
}

.fa-object-ungroup {
  --fa: "\f248";
}

.fa-note-sticky {
  --fa: "\f249";
}

.fa-sticky-note {
  --fa: "\f249";
}

.fa-clone {
  --fa: "\f24d";
}

.fa-scale-balanced {
  --fa: "\f24e";
}

.fa-balance-scale {
  --fa: "\f24e";
}

.fa-hourglass-start {
  --fa: "\f251";
}

.fa-hourglass-1 {
  --fa: "\f251";
}

.fa-hourglass-half {
  --fa: "\f252";
}

.fa-hourglass-2 {
  --fa: "\f252";
}

.fa-hourglass-end {
  --fa: "\f253";
}

.fa-hourglass-3 {
  --fa: "\f253";
}

.fa-hourglass {
  --fa: "\f254";
}

.fa-hourglass-empty {
  --fa: "\f254";
}

.fa-hand-back-fist {
  --fa: "\f255";
}

.fa-hand-rock {
  --fa: "\f255";
}

.fa-hand {
  --fa: "\f256";
}

.fa-hand-paper {
  --fa: "\f256";
}

.fa-hand-scissors {
  --fa: "\f257";
}

.fa-hand-lizard {
  --fa: "\f258";
}

.fa-hand-spock {
  --fa: "\f259";
}

.fa-hand-pointer {
  --fa: "\f25a";
}

.fa-hand-peace {
  --fa: "\f25b";
}

.fa-trademark {
  --fa: "\f25c";
}

.fa-registered {
  --fa: "\f25d";
}

.fa-tv {
  --fa: "\f26c";
}

.fa-television {
  --fa: "\f26c";
}

.fa-tv-alt {
  --fa: "\f26c";
}

.fa-calendar-plus {
  --fa: "\f271";
}

.fa-calendar-minus {
  --fa: "\f272";
}

.fa-calendar-xmark {
  --fa: "\f273";
}

.fa-calendar-times {
  --fa: "\f273";
}

.fa-calendar-check {
  --fa: "\f274";
}

.fa-industry {
  --fa: "\f275";
}

.fa-map-pin {
  --fa: "\f276";
}

.fa-signs-post {
  --fa: "\f277";
}

.fa-map-signs {
  --fa: "\f277";
}

.fa-map {
  --fa: "\f279";
}

.fa-message {
  --fa: "\f27a";
}

.fa-comment-alt {
  --fa: "\f27a";
}

.fa-circle-pause {
  --fa: "\f28b";
}

.fa-pause-circle {
  --fa: "\f28b";
}

.fa-circle-stop {
  --fa: "\f28d";
}

.fa-stop-circle {
  --fa: "\f28d";
}

.fa-bag-shopping {
  --fa: "\f290";
}

.fa-shopping-bag {
  --fa: "\f290";
}

.fa-basket-shopping {
  --fa: "\f291";
}

.fa-shopping-basket {
  --fa: "\f291";
}

.fa-universal-access {
  --fa: "\f29a";
}

.fa-person-walking-with-cane {
  --fa: "\f29d";
}

.fa-blind {
  --fa: "\f29d";
}

.fa-audio-description {
  --fa: "\f29e";
}

.fa-phone-volume {
  --fa: "\f2a0";
}

.fa-volume-control-phone {
  --fa: "\f2a0";
}

.fa-braille {
  --fa: "\f2a1";
}

.fa-ear-listen {
  --fa: "\f2a2";
}

.fa-assistive-listening-systems {
  --fa: "\f2a2";
}

.fa-hands-asl-interpreting {
  --fa: "\f2a3";
}

.fa-american-sign-language-interpreting {
  --fa: "\f2a3";
}

.fa-asl-interpreting {
  --fa: "\f2a3";
}

.fa-hands-american-sign-language-interpreting {
  --fa: "\f2a3";
}

.fa-ear-deaf {
  --fa: "\f2a4";
}

.fa-deaf {
  --fa: "\f2a4";
}

.fa-deafness {
  --fa: "\f2a4";
}

.fa-hard-of-hearing {
  --fa: "\f2a4";
}

.fa-hands {
  --fa: "\f2a7";
}

.fa-sign-language {
  --fa: "\f2a7";
}

.fa-signing {
  --fa: "\f2a7";
}

.fa-eye-low-vision {
  --fa: "\f2a8";
}

.fa-low-vision {
  --fa: "\f2a8";
}

.fa-font-awesome {
  --fa: "\f2b4";
}

.fa-font-awesome-flag {
  --fa: "\f2b4";
}

.fa-font-awesome-logo-full {
  --fa: "\f2b4";
}

.fa-handshake {
  --fa: "\f2b5";
}

.fa-handshake-alt {
  --fa: "\f2b5";
}

.fa-handshake-simple {
  --fa: "\f2b5";
}

.fa-envelope-open {
  --fa: "\f2b6";
}

.fa-address-book {
  --fa: "\f2b9";
}

.fa-contact-book {
  --fa: "\f2b9";
}

.fa-address-card {
  --fa: "\f2bb";
}

.fa-contact-card {
  --fa: "\f2bb";
}

.fa-vcard {
  --fa: "\f2bb";
}

.fa-circle-user {
  --fa: "\f2bd";
}

.fa-user-circle {
  --fa: "\f2bd";
}

.fa-id-badge {
  --fa: "\f2c1";
}

.fa-id-card {
  --fa: "\f2c2";
}

.fa-drivers-license {
  --fa: "\f2c2";
}

.fa-temperature-full {
  --fa: "\f2c7";
}

.fa-temperature-4 {
  --fa: "\f2c7";
}

.fa-thermometer-4 {
  --fa: "\f2c7";
}

.fa-thermometer-full {
  --fa: "\f2c7";
}

.fa-temperature-three-quarters {
  --fa: "\f2c8";
}

.fa-temperature-3 {
  --fa: "\f2c8";
}

.fa-thermometer-3 {
  --fa: "\f2c8";
}

.fa-thermometer-three-quarters {
  --fa: "\f2c8";
}

.fa-temperature-half {
  --fa: "\f2c9";
}

.fa-temperature-2 {
  --fa: "\f2c9";
}

.fa-thermometer-2 {
  --fa: "\f2c9";
}

.fa-thermometer-half {
  --fa: "\f2c9";
}

.fa-temperature-quarter {
  --fa: "\f2ca";
}

.fa-temperature-1 {
  --fa: "\f2ca";
}

.fa-thermometer-1 {
  --fa: "\f2ca";
}

.fa-thermometer-quarter {
  --fa: "\f2ca";
}

.fa-temperature-empty {
  --fa: "\f2cb";
}

.fa-temperature-0 {
  --fa: "\f2cb";
}

.fa-thermometer-0 {
  --fa: "\f2cb";
}

.fa-thermometer-empty {
  --fa: "\f2cb";
}

.fa-shower {
  --fa: "\f2cc";
}

.fa-bath {
  --fa: "\f2cd";
}

.fa-bathtub {
  --fa: "\f2cd";
}

.fa-podcast {
  --fa: "\f2ce";
}

.fa-window-maximize {
  --fa: "\f2d0";
}

.fa-window-minimize {
  --fa: "\f2d1";
}

.fa-window-restore {
  --fa: "\f2d2";
}

.fa-square-xmark {
  --fa: "\f2d3";
}

.fa-times-square {
  --fa: "\f2d3";
}

.fa-xmark-square {
  --fa: "\f2d3";
}

.fa-microchip {
  --fa: "\f2db";
}

.fa-snowflake {
  --fa: "\f2dc";
}

.fa-spoon {
  --fa: "\f2e5";
}

.fa-utensil-spoon {
  --fa: "\f2e5";
}

.fa-utensils {
  --fa: "\f2e7";
}

.fa-cutlery {
  --fa: "\f2e7";
}

.fa-rotate-left {
  --fa: "\f2ea";
}

.fa-rotate-back {
  --fa: "\f2ea";
}

.fa-rotate-backward {
  --fa: "\f2ea";
}

.fa-undo-alt {
  --fa: "\f2ea";
}

.fa-trash-can {
  --fa: "\f2ed";
}

.fa-trash-alt {
  --fa: "\f2ed";
}

.fa-rotate {
  --fa: "\f2f1";
}

.fa-sync-alt {
  --fa: "\f2f1";
}

.fa-stopwatch {
  --fa: "\f2f2";
}

.fa-right-from-bracket {
  --fa: "\f2f5";
}

.fa-sign-out-alt {
  --fa: "\f2f5";
}

.fa-right-to-bracket {
  --fa: "\f2f6";
}

.fa-sign-in-alt {
  --fa: "\f2f6";
}

.fa-rotate-right {
  --fa: "\f2f9";
}

.fa-redo-alt {
  --fa: "\f2f9";
}

.fa-rotate-forward {
  --fa: "\f2f9";
}

.fa-poo {
  --fa: "\f2fe";
}

.fa-images {
  --fa: "\f302";
}

.fa-pencil {
  --fa: "\f303";
}

.fa-pencil-alt {
  --fa: "\f303";
}

.fa-pen {
  --fa: "\f304";
}

.fa-pen-clip {
  --fa: "\f305";
}

.fa-pen-alt {
  --fa: "\f305";
}

.fa-octagon {
  --fa: "\f306";
}

.fa-down-long {
  --fa: "\f309";
}

.fa-long-arrow-alt-down {
  --fa: "\f309";
}

.fa-left-long {
  --fa: "\f30a";
}

.fa-long-arrow-alt-left {
  --fa: "\f30a";
}

.fa-right-long {
  --fa: "\f30b";
}

.fa-long-arrow-alt-right {
  --fa: "\f30b";
}

.fa-up-long {
  --fa: "\f30c";
}

.fa-long-arrow-alt-up {
  --fa: "\f30c";
}

.fa-hexagon {
  --fa: "\f312";
}

.fa-file-pen {
  --fa: "\f31c";
}

.fa-file-edit {
  --fa: "\f31c";
}

.fa-maximize {
  --fa: "\f31e";
}

.fa-expand-arrows-alt {
  --fa: "\f31e";
}

.fa-clipboard {
  --fa: "\f328";
}

.fa-left-right {
  --fa: "\f337";
}

.fa-arrows-alt-h {
  --fa: "\f337";
}

.fa-up-down {
  --fa: "\f338";
}

.fa-arrows-alt-v {
  --fa: "\f338";
}

.fa-alarm-clock {
  --fa: "\f34e";
}

.fa-circle-down {
  --fa: "\f358";
}

.fa-arrow-alt-circle-down {
  --fa: "\f358";
}

.fa-circle-left {
  --fa: "\f359";
}

.fa-arrow-alt-circle-left {
  --fa: "\f359";
}

.fa-circle-right {
  --fa: "\f35a";
}

.fa-arrow-alt-circle-right {
  --fa: "\f35a";
}

.fa-circle-up {
  --fa: "\f35b";
}

.fa-arrow-alt-circle-up {
  --fa: "\f35b";
}

.fa-up-right-from-square {
  --fa: "\f35d";
}

.fa-external-link-alt {
  --fa: "\f35d";
}

.fa-square-up-right {
  --fa: "\f360";
}

.fa-external-link-square-alt {
  --fa: "\f360";
}

.fa-right-left {
  --fa: "\f362";
}

.fa-exchange-alt {
  --fa: "\f362";
}

.fa-repeat {
  --fa: "\f363";
}

.fa-code-commit {
  --fa: "\f386";
}

.fa-code-merge {
  --fa: "\f387";
}

.fa-desktop {
  --fa: "\f390";
}

.fa-desktop-alt {
  --fa: "\f390";
}

.fa-gem {
  --fa: "\f3a5";
}

.fa-turn-down {
  --fa: "\f3be";
}

.fa-level-down-alt {
  --fa: "\f3be";
}

.fa-turn-up {
  --fa: "\f3bf";
}

.fa-level-up-alt {
  --fa: "\f3bf";
}

.fa-lock-open {
  --fa: "\f3c1";
}

.fa-location-dot {
  --fa: "\f3c5";
}

.fa-map-marker-alt {
  --fa: "\f3c5";
}

.fa-microphone-lines {
  --fa: "\f3c9";
}

.fa-microphone-alt {
  --fa: "\f3c9";
}

.fa-mobile-screen-button {
  --fa: "\f3cd";
}

.fa-mobile-alt {
  --fa: "\f3cd";
}

.fa-mobile {
  --fa: "\f3ce";
}

.fa-mobile-android {
  --fa: "\f3ce";
}

.fa-mobile-phone {
  --fa: "\f3ce";
}

.fa-mobile-screen {
  --fa: "\f3cf";
}

.fa-mobile-android-alt {
  --fa: "\f3cf";
}

.fa-money-bill-1 {
  --fa: "\f3d1";
}

.fa-money-bill-alt {
  --fa: "\f3d1";
}

.fa-phone-slash {
  --fa: "\f3dd";
}

.fa-image-portrait {
  --fa: "\f3e0";
}

.fa-portrait {
  --fa: "\f3e0";
}

.fa-reply {
  --fa: "\f3e5";
}

.fa-mail-reply {
  --fa: "\f3e5";
}

.fa-shield-halved {
  --fa: "\f3ed";
}

.fa-shield-alt {
  --fa: "\f3ed";
}

.fa-tablet-screen-button {
  --fa: "\f3fa";
}

.fa-tablet-alt {
  --fa: "\f3fa";
}

.fa-tablet {
  --fa: "\f3fb";
}

.fa-tablet-android {
  --fa: "\f3fb";
}

.fa-ticket-simple {
  --fa: "\f3ff";
}

.fa-ticket-alt {
  --fa: "\f3ff";
}

.fa-rectangle-xmark {
  --fa: "\f410";
}

.fa-rectangle-times {
  --fa: "\f410";
}

.fa-times-rectangle {
  --fa: "\f410";
}

.fa-window-close {
  --fa: "\f410";
}

.fa-down-left-and-up-right-to-center {
  --fa: "\f422";
}

.fa-compress-alt {
  --fa: "\f422";
}

.fa-up-right-and-down-left-from-center {
  --fa: "\f424";
}

.fa-expand-alt {
  --fa: "\f424";
}

.fa-baseball-bat-ball {
  --fa: "\f432";
}

.fa-baseball {
  --fa: "\f433";
}

.fa-baseball-ball {
  --fa: "\f433";
}

.fa-basketball {
  --fa: "\f434";
}

.fa-basketball-ball {
  --fa: "\f434";
}

.fa-bowling-ball {
  --fa: "\f436";
}

.fa-chess {
  --fa: "\f439";
}

.fa-chess-bishop {
  --fa: "\f43a";
}

.fa-chess-board {
  --fa: "\f43c";
}

.fa-chess-king {
  --fa: "\f43f";
}

.fa-chess-knight {
  --fa: "\f441";
}

.fa-chess-pawn {
  --fa: "\f443";
}

.fa-chess-queen {
  --fa: "\f445";
}

.fa-chess-rook {
  --fa: "\f447";
}

.fa-dumbbell {
  --fa: "\f44b";
}

.fa-football {
  --fa: "\f44e";
}

.fa-football-ball {
  --fa: "\f44e";
}

.fa-golf-ball-tee {
  --fa: "\f450";
}

.fa-golf-ball {
  --fa: "\f450";
}

.fa-hockey-puck {
  --fa: "\f453";
}

.fa-broom-ball {
  --fa: "\f458";
}

.fa-quidditch {
  --fa: "\f458";
}

.fa-quidditch-broom-ball {
  --fa: "\f458";
}

.fa-square-full {
  --fa: "\f45c";
}

.fa-table-tennis-paddle-ball {
  --fa: "\f45d";
}

.fa-ping-pong-paddle-ball {
  --fa: "\f45d";
}

.fa-table-tennis {
  --fa: "\f45d";
}

.fa-volleyball {
  --fa: "\f45f";
}

.fa-volleyball-ball {
  --fa: "\f45f";
}

.fa-hand-dots {
  --fa: "\f461";
}

.fa-allergies {
  --fa: "\f461";
}

.fa-bandage {
  --fa: "\f462";
}

.fa-band-aid {
  --fa: "\f462";
}

.fa-box {
  --fa: "\f466";
}

.fa-boxes-stacked {
  --fa: "\f468";
}

.fa-boxes {
  --fa: "\f468";
}

.fa-boxes-alt {
  --fa: "\f468";
}

.fa-briefcase-medical {
  --fa: "\f469";
}

.fa-fire-flame-simple {
  --fa: "\f46a";
}

.fa-burn {
  --fa: "\f46a";
}

.fa-capsules {
  --fa: "\f46b";
}

.fa-clipboard-check {
  --fa: "\f46c";
}

.fa-clipboard-list {
  --fa: "\f46d";
}

.fa-person-dots-from-line {
  --fa: "\f470";
}

.fa-diagnoses {
  --fa: "\f470";
}

.fa-dna {
  --fa: "\f471";
}

.fa-dolly {
  --fa: "\f472";
}

.fa-dolly-box {
  --fa: "\f472";
}

.fa-cart-flatbed {
  --fa: "\f474";
}

.fa-dolly-flatbed {
  --fa: "\f474";
}

.fa-file-medical {
  --fa: "\f477";
}

.fa-file-waveform {
  --fa: "\f478";
}

.fa-file-medical-alt {
  --fa: "\f478";
}

.fa-kit-medical {
  --fa: "\f479";
}

.fa-first-aid {
  --fa: "\f479";
}

.fa-circle-h {
  --fa: "\f47e";
}

.fa-hospital-symbol {
  --fa: "\f47e";
}

.fa-id-card-clip {
  --fa: "\f47f";
}

.fa-id-card-alt {
  --fa: "\f47f";
}

.fa-notes-medical {
  --fa: "\f481";
}

.fa-pallet {
  --fa: "\f482";
}

.fa-pills {
  --fa: "\f484";
}

.fa-prescription-bottle {
  --fa: "\f485";
}

.fa-prescription-bottle-medical {
  --fa: "\f486";
}

.fa-prescription-bottle-alt {
  --fa: "\f486";
}

.fa-bed-pulse {
  --fa: "\f487";
}

.fa-procedures {
  --fa: "\f487";
}

.fa-truck-fast {
  --fa: "\f48b";
}

.fa-shipping-fast {
  --fa: "\f48b";
}

.fa-smoking {
  --fa: "\f48d";
}

.fa-syringe {
  --fa: "\f48e";
}

.fa-tablets {
  --fa: "\f490";
}

.fa-thermometer {
  --fa: "\f491";
}

.fa-vial {
  --fa: "\f492";
}

.fa-vials {
  --fa: "\f493";
}

.fa-warehouse {
  --fa: "\f494";
}

.fa-weight-scale {
  --fa: "\f496";
}

.fa-weight {
  --fa: "\f496";
}

.fa-x-ray {
  --fa: "\f497";
}

.fa-box-open {
  --fa: "\f49e";
}

.fa-comment-dots {
  --fa: "\f4ad";
}

.fa-commenting {
  --fa: "\f4ad";
}

.fa-comment-slash {
  --fa: "\f4b3";
}

.fa-couch {
  --fa: "\f4b8";
}

.fa-circle-dollar-to-slot {
  --fa: "\f4b9";
}

.fa-donate {
  --fa: "\f4b9";
}

.fa-dove {
  --fa: "\f4ba";
}

.fa-hand-holding {
  --fa: "\f4bd";
}

.fa-hand-holding-heart {
  --fa: "\f4be";
}

.fa-hand-holding-dollar {
  --fa: "\f4c0";
}

.fa-hand-holding-usd {
  --fa: "\f4c0";
}

.fa-hand-holding-droplet {
  --fa: "\f4c1";
}

.fa-hand-holding-water {
  --fa: "\f4c1";
}

.fa-hands-holding {
  --fa: "\f4c2";
}

.fa-handshake-angle {
  --fa: "\f4c4";
}

.fa-hands-helping {
  --fa: "\f4c4";
}

.fa-parachute-box {
  --fa: "\f4cd";
}

.fa-people-carry-box {
  --fa: "\f4ce";
}

.fa-people-carry {
  --fa: "\f4ce";
}

.fa-piggy-bank {
  --fa: "\f4d3";
}

.fa-ribbon {
  --fa: "\f4d6";
}

.fa-route {
  --fa: "\f4d7";
}

.fa-seedling {
  --fa: "\f4d8";
}

.fa-sprout {
  --fa: "\f4d8";
}

.fa-sign-hanging {
  --fa: "\f4d9";
}

.fa-sign {
  --fa: "\f4d9";
}

.fa-face-smile-wink {
  --fa: "\f4da";
}

.fa-smile-wink {
  --fa: "\f4da";
}

.fa-tape {
  --fa: "\f4db";
}

.fa-truck-ramp-box {
  --fa: "\f4de";
}

.fa-truck-loading {
  --fa: "\f4de";
}

.fa-truck-moving {
  --fa: "\f4df";
}

.fa-video-slash {
  --fa: "\f4e2";
}

.fa-wine-glass {
  --fa: "\f4e3";
}

.fa-user-astronaut {
  --fa: "\f4fb";
}

.fa-user-check {
  --fa: "\f4fc";
}

.fa-user-clock {
  --fa: "\f4fd";
}

.fa-user-gear {
  --fa: "\f4fe";
}

.fa-user-cog {
  --fa: "\f4fe";
}

.fa-user-pen {
  --fa: "\f4ff";
}

.fa-user-edit {
  --fa: "\f4ff";
}

.fa-user-group {
  --fa: "\f500";
}

.fa-user-friends {
  --fa: "\f500";
}

.fa-user-graduate {
  --fa: "\f501";
}

.fa-user-lock {
  --fa: "\f502";
}

.fa-user-minus {
  --fa: "\f503";
}

.fa-user-ninja {
  --fa: "\f504";
}

.fa-user-shield {
  --fa: "\f505";
}

.fa-user-slash {
  --fa: "\f506";
}

.fa-user-alt-slash {
  --fa: "\f506";
}

.fa-user-large-slash {
  --fa: "\f506";
}

.fa-user-tag {
  --fa: "\f507";
}

.fa-user-tie {
  --fa: "\f508";
}

.fa-users-gear {
  --fa: "\f509";
}

.fa-users-cog {
  --fa: "\f509";
}

.fa-scale-unbalanced {
  --fa: "\f515";
}

.fa-balance-scale-left {
  --fa: "\f515";
}

.fa-scale-unbalanced-flip {
  --fa: "\f516";
}

.fa-balance-scale-right {
  --fa: "\f516";
}

.fa-blender {
  --fa: "\f517";
}

.fa-book-open {
  --fa: "\f518";
}

.fa-tower-broadcast {
  --fa: "\f519";
}

.fa-broadcast-tower {
  --fa: "\f519";
}

.fa-broom {
  --fa: "\f51a";
}

.fa-chalkboard {
  --fa: "\f51b";
}

.fa-blackboard {
  --fa: "\f51b";
}

.fa-chalkboard-user {
  --fa: "\f51c";
}

.fa-chalkboard-teacher {
  --fa: "\f51c";
}

.fa-church {
  --fa: "\f51d";
}

.fa-coins {
  --fa: "\f51e";
}

.fa-compact-disc {
  --fa: "\f51f";
}

.fa-crow {
  --fa: "\f520";
}

.fa-crown {
  --fa: "\f521";
}

.fa-dice {
  --fa: "\f522";
}

.fa-dice-five {
  --fa: "\f523";
}

.fa-dice-four {
  --fa: "\f524";
}

.fa-dice-one {
  --fa: "\f525";
}

.fa-dice-six {
  --fa: "\f526";
}

.fa-dice-three {
  --fa: "\f527";
}

.fa-dice-two {
  --fa: "\f528";
}

.fa-divide {
  --fa: "\f529";
}

.fa-door-closed {
  --fa: "\f52a";
}

.fa-door-open {
  --fa: "\f52b";
}

.fa-feather {
  --fa: "\f52d";
}

.fa-frog {
  --fa: "\f52e";
}

.fa-gas-pump {
  --fa: "\f52f";
}

.fa-glasses {
  --fa: "\f530";
}

.fa-greater-than-equal {
  --fa: "\f532";
}

.fa-helicopter {
  --fa: "\f533";
}

.fa-infinity {
  --fa: "\f534";
}

.fa-kiwi-bird {
  --fa: "\f535";
}

.fa-less-than-equal {
  --fa: "\f537";
}

.fa-memory {
  --fa: "\f538";
}

.fa-microphone-lines-slash {
  --fa: "\f539";
}

.fa-microphone-alt-slash {
  --fa: "\f539";
}

.fa-money-bill-wave {
  --fa: "\f53a";
}

.fa-money-bill-1-wave {
  --fa: "\f53b";
}

.fa-money-bill-wave-alt {
  --fa: "\f53b";
}

.fa-money-check {
  --fa: "\f53c";
}

.fa-money-check-dollar {
  --fa: "\f53d";
}

.fa-money-check-alt {
  --fa: "\f53d";
}

.fa-not-equal {
  --fa: "\f53e";
}

.fa-palette {
  --fa: "\f53f";
}

.fa-square-parking {
  --fa: "\f540";
}

.fa-parking {
  --fa: "\f540";
}

.fa-diagram-project {
  --fa: "\f542";
}

.fa-project-diagram {
  --fa: "\f542";
}

.fa-receipt {
  --fa: "\f543";
}

.fa-robot {
  --fa: "\f544";
}

.fa-ruler {
  --fa: "\f545";
}

.fa-ruler-combined {
  --fa: "\f546";
}

.fa-ruler-horizontal {
  --fa: "\f547";
}

.fa-ruler-vertical {
  --fa: "\f548";
}

.fa-school {
  --fa: "\f549";
}

.fa-screwdriver {
  --fa: "\f54a";
}

.fa-shoe-prints {
  --fa: "\f54b";
}

.fa-skull {
  --fa: "\f54c";
}

.fa-ban-smoking {
  --fa: "\f54d";
}

.fa-smoking-ban {
  --fa: "\f54d";
}

.fa-store {
  --fa: "\f54e";
}

.fa-shop {
  --fa: "\f54f";
}

.fa-store-alt {
  --fa: "\f54f";
}

.fa-bars-staggered {
  --fa: "\f550";
}

.fa-reorder {
  --fa: "\f550";
}

.fa-stream {
  --fa: "\f550";
}

.fa-stroopwafel {
  --fa: "\f551";
}

.fa-toolbox {
  --fa: "\f552";
}

.fa-shirt {
  --fa: "\f553";
}

.fa-t-shirt {
  --fa: "\f553";
}

.fa-tshirt {
  --fa: "\f553";
}

.fa-person-walking {
  --fa: "\f554";
}

.fa-walking {
  --fa: "\f554";
}

.fa-wallet {
  --fa: "\f555";
}

.fa-face-angry {
  --fa: "\f556";
}

.fa-angry {
  --fa: "\f556";
}

.fa-archway {
  --fa: "\f557";
}

.fa-book-atlas {
  --fa: "\f558";
}

.fa-atlas {
  --fa: "\f558";
}

.fa-award {
  --fa: "\f559";
}

.fa-delete-left {
  --fa: "\f55a";
}

.fa-backspace {
  --fa: "\f55a";
}

.fa-bezier-curve {
  --fa: "\f55b";
}

.fa-bong {
  --fa: "\f55c";
}

.fa-brush {
  --fa: "\f55d";
}

.fa-bus-simple {
  --fa: "\f55e";
}

.fa-bus-alt {
  --fa: "\f55e";
}

.fa-cannabis {
  --fa: "\f55f";
}

.fa-check-double {
  --fa: "\f560";
}

.fa-martini-glass-citrus {
  --fa: "\f561";
}

.fa-cocktail {
  --fa: "\f561";
}

.fa-bell-concierge {
  --fa: "\f562";
}

.fa-concierge-bell {
  --fa: "\f562";
}

.fa-cookie {
  --fa: "\f563";
}

.fa-cookie-bite {
  --fa: "\f564";
}

.fa-crop-simple {
  --fa: "\f565";
}

.fa-crop-alt {
  --fa: "\f565";
}

.fa-tachograph-digital {
  --fa: "\f566";
}

.fa-digital-tachograph {
  --fa: "\f566";
}

.fa-face-dizzy {
  --fa: "\f567";
}

.fa-dizzy {
  --fa: "\f567";
}

.fa-compass-drafting {
  --fa: "\f568";
}

.fa-drafting-compass {
  --fa: "\f568";
}

.fa-drum {
  --fa: "\f569";
}

.fa-drum-steelpan {
  --fa: "\f56a";
}

.fa-feather-pointed {
  --fa: "\f56b";
}

.fa-feather-alt {
  --fa: "\f56b";
}

.fa-file-contract {
  --fa: "\f56c";
}

.fa-file-arrow-down {
  --fa: "\f56d";
}

.fa-file-download {
  --fa: "\f56d";
}

.fa-file-export {
  --fa: "\f56e";
}

.fa-arrow-right-from-file {
  --fa: "\f56e";
}

.fa-file-import {
  --fa: "\f56f";
}

.fa-arrow-right-to-file {
  --fa: "\f56f";
}

.fa-file-invoice {
  --fa: "\f570";
}

.fa-file-invoice-dollar {
  --fa: "\f571";
}

.fa-file-prescription {
  --fa: "\f572";
}

.fa-file-signature {
  --fa: "\f573";
}

.fa-file-arrow-up {
  --fa: "\f574";
}

.fa-file-upload {
  --fa: "\f574";
}

.fa-fill {
  --fa: "\f575";
}

.fa-fill-drip {
  --fa: "\f576";
}

.fa-fingerprint {
  --fa: "\f577";
}

.fa-fish {
  --fa: "\f578";
}

.fa-face-flushed {
  --fa: "\f579";
}

.fa-flushed {
  --fa: "\f579";
}

.fa-face-frown-open {
  --fa: "\f57a";
}

.fa-frown-open {
  --fa: "\f57a";
}

.fa-martini-glass {
  --fa: "\f57b";
}

.fa-glass-martini-alt {
  --fa: "\f57b";
}

.fa-earth-africa {
  --fa: "\f57c";
}

.fa-globe-africa {
  --fa: "\f57c";
}

.fa-earth-americas {
  --fa: "\f57d";
}

.fa-earth {
  --fa: "\f57d";
}

.fa-earth-america {
  --fa: "\f57d";
}

.fa-globe-americas {
  --fa: "\f57d";
}

.fa-earth-asia {
  --fa: "\f57e";
}

.fa-globe-asia {
  --fa: "\f57e";
}

.fa-face-grimace {
  --fa: "\f57f";
}

.fa-grimace {
  --fa: "\f57f";
}

.fa-face-grin {
  --fa: "\f580";
}

.fa-grin {
  --fa: "\f580";
}

.fa-face-grin-wide {
  --fa: "\f581";
}

.fa-grin-alt {
  --fa: "\f581";
}

.fa-face-grin-beam {
  --fa: "\f582";
}

.fa-grin-beam {
  --fa: "\f582";
}

.fa-face-grin-beam-sweat {
  --fa: "\f583";
}

.fa-grin-beam-sweat {
  --fa: "\f583";
}

.fa-face-grin-hearts {
  --fa: "\f584";
}

.fa-grin-hearts {
  --fa: "\f584";
}

.fa-face-grin-squint {
  --fa: "\f585";
}

.fa-grin-squint {
  --fa: "\f585";
}

.fa-face-grin-squint-tears {
  --fa: "\f586";
}

.fa-grin-squint-tears {
  --fa: "\f586";
}

.fa-face-grin-stars {
  --fa: "\f587";
}

.fa-grin-stars {
  --fa: "\f587";
}

.fa-face-grin-tears {
  --fa: "\f588";
}

.fa-grin-tears {
  --fa: "\f588";
}

.fa-face-grin-tongue {
  --fa: "\f589";
}

.fa-grin-tongue {
  --fa: "\f589";
}

.fa-face-grin-tongue-squint {
  --fa: "\f58a";
}

.fa-grin-tongue-squint {
  --fa: "\f58a";
}

.fa-face-grin-tongue-wink {
  --fa: "\f58b";
}

.fa-grin-tongue-wink {
  --fa: "\f58b";
}

.fa-face-grin-wink {
  --fa: "\f58c";
}

.fa-grin-wink {
  --fa: "\f58c";
}

.fa-grip {
  --fa: "\f58d";
}

.fa-grid-horizontal {
  --fa: "\f58d";
}

.fa-grip-horizontal {
  --fa: "\f58d";
}

.fa-grip-vertical {
  --fa: "\f58e";
}

.fa-grid-vertical {
  --fa: "\f58e";
}

.fa-headset {
  --fa: "\f590";
}

.fa-highlighter {
  --fa: "\f591";
}

.fa-hot-tub-person {
  --fa: "\f593";
}

.fa-hot-tub {
  --fa: "\f593";
}

.fa-hotel {
  --fa: "\f594";
}

.fa-joint {
  --fa: "\f595";
}

.fa-face-kiss {
  --fa: "\f596";
}

.fa-kiss {
  --fa: "\f596";
}

.fa-face-kiss-beam {
  --fa: "\f597";
}

.fa-kiss-beam {
  --fa: "\f597";
}

.fa-face-kiss-wink-heart {
  --fa: "\f598";
}

.fa-kiss-wink-heart {
  --fa: "\f598";
}

.fa-face-laugh {
  --fa: "\f599";
}

.fa-laugh {
  --fa: "\f599";
}

.fa-face-laugh-beam {
  --fa: "\f59a";
}

.fa-laugh-beam {
  --fa: "\f59a";
}

.fa-face-laugh-squint {
  --fa: "\f59b";
}

.fa-laugh-squint {
  --fa: "\f59b";
}

.fa-face-laugh-wink {
  --fa: "\f59c";
}

.fa-laugh-wink {
  --fa: "\f59c";
}

.fa-cart-flatbed-suitcase {
  --fa: "\f59d";
}

.fa-luggage-cart {
  --fa: "\f59d";
}

.fa-map-location {
  --fa: "\f59f";
}

.fa-map-marked {
  --fa: "\f59f";
}

.fa-map-location-dot {
  --fa: "\f5a0";
}

.fa-map-marked-alt {
  --fa: "\f5a0";
}

.fa-marker {
  --fa: "\f5a1";
}

.fa-medal {
  --fa: "\f5a2";
}

.fa-face-meh-blank {
  --fa: "\f5a4";
}

.fa-meh-blank {
  --fa: "\f5a4";
}

.fa-face-rolling-eyes {
  --fa: "\f5a5";
}

.fa-meh-rolling-eyes {
  --fa: "\f5a5";
}

.fa-monument {
  --fa: "\f5a6";
}

.fa-mortar-pestle {
  --fa: "\f5a7";
}

.fa-paint-roller {
  --fa: "\f5aa";
}

.fa-passport {
  --fa: "\f5ab";
}

.fa-pen-fancy {
  --fa: "\f5ac";
}

.fa-pen-nib {
  --fa: "\f5ad";
}

.fa-pen-ruler {
  --fa: "\f5ae";
}

.fa-pencil-ruler {
  --fa: "\f5ae";
}

.fa-plane-arrival {
  --fa: "\f5af";
}

.fa-plane-departure {
  --fa: "\f5b0";
}

.fa-prescription {
  --fa: "\f5b1";
}

.fa-face-sad-cry {
  --fa: "\f5b3";
}

.fa-sad-cry {
  --fa: "\f5b3";
}

.fa-face-sad-tear {
  --fa: "\f5b4";
}

.fa-sad-tear {
  --fa: "\f5b4";
}

.fa-van-shuttle {
  --fa: "\f5b6";
}

.fa-shuttle-van {
  --fa: "\f5b6";
}

.fa-signature {
  --fa: "\f5b7";
}

.fa-face-smile-beam {
  --fa: "\f5b8";
}

.fa-smile-beam {
  --fa: "\f5b8";
}

.fa-solar-panel {
  --fa: "\f5ba";
}

.fa-spa {
  --fa: "\f5bb";
}

.fa-splotch {
  --fa: "\f5bc";
}

.fa-spray-can {
  --fa: "\f5bd";
}

.fa-stamp {
  --fa: "\f5bf";
}

.fa-star-half-stroke {
  --fa: "\f5c0";
}

.fa-star-half-alt {
  --fa: "\f5c0";
}

.fa-suitcase-rolling {
  --fa: "\f5c1";
}

.fa-face-surprise {
  --fa: "\f5c2";
}

.fa-surprise {
  --fa: "\f5c2";
}

.fa-swatchbook {
  --fa: "\f5c3";
}

.fa-person-swimming {
  --fa: "\f5c4";
}

.fa-swimmer {
  --fa: "\f5c4";
}

.fa-water-ladder {
  --fa: "\f5c5";
}

.fa-ladder-water {
  --fa: "\f5c5";
}

.fa-swimming-pool {
  --fa: "\f5c5";
}

.fa-droplet-slash {
  --fa: "\f5c7";
}

.fa-tint-slash {
  --fa: "\f5c7";
}

.fa-face-tired {
  --fa: "\f5c8";
}

.fa-tired {
  --fa: "\f5c8";
}

.fa-tooth {
  --fa: "\f5c9";
}

.fa-umbrella-beach {
  --fa: "\f5ca";
}

.fa-weight-hanging {
  --fa: "\f5cd";
}

.fa-wine-glass-empty {
  --fa: "\f5ce";
}

.fa-wine-glass-alt {
  --fa: "\f5ce";
}

.fa-spray-can-sparkles {
  --fa: "\f5d0";
}

.fa-air-freshener {
  --fa: "\f5d0";
}

.fa-apple-whole {
  --fa: "\f5d1";
}

.fa-apple-alt {
  --fa: "\f5d1";
}

.fa-atom {
  --fa: "\f5d2";
}

.fa-bone {
  --fa: "\f5d7";
}

.fa-book-open-reader {
  --fa: "\f5da";
}

.fa-book-reader {
  --fa: "\f5da";
}

.fa-brain {
  --fa: "\f5dc";
}

.fa-car-rear {
  --fa: "\f5de";
}

.fa-car-alt {
  --fa: "\f5de";
}

.fa-car-battery {
  --fa: "\f5df";
}

.fa-battery-car {
  --fa: "\f5df";
}

.fa-car-burst {
  --fa: "\f5e1";
}

.fa-car-crash {
  --fa: "\f5e1";
}

.fa-car-side {
  --fa: "\f5e4";
}

.fa-charging-station {
  --fa: "\f5e7";
}

.fa-diamond-turn-right {
  --fa: "\f5eb";
}

.fa-directions {
  --fa: "\f5eb";
}

.fa-draw-polygon {
  --fa: "\f5ee";
}

.fa-vector-polygon {
  --fa: "\f5ee";
}

.fa-laptop-code {
  --fa: "\f5fc";
}

.fa-layer-group {
  --fa: "\f5fd";
}

.fa-location-crosshairs {
  --fa: "\f601";
}

.fa-location {
  --fa: "\f601";
}

.fa-lungs {
  --fa: "\f604";
}

.fa-microscope {
  --fa: "\f610";
}

.fa-oil-can {
  --fa: "\f613";
}

.fa-poop {
  --fa: "\f619";
}

.fa-shapes {
  --fa: "\f61f";
}

.fa-triangle-circle-square {
  --fa: "\f61f";
}

.fa-star-of-life {
  --fa: "\f621";
}

.fa-gauge {
  --fa: "\f624";
}

.fa-dashboard {
  --fa: "\f624";
}

.fa-gauge-med {
  --fa: "\f624";
}

.fa-tachometer-alt-average {
  --fa: "\f624";
}

.fa-gauge-high {
  --fa: "\f625";
}

.fa-tachometer-alt {
  --fa: "\f625";
}

.fa-tachometer-alt-fast {
  --fa: "\f625";
}

.fa-gauge-simple {
  --fa: "\f629";
}

.fa-gauge-simple-med {
  --fa: "\f629";
}

.fa-tachometer-average {
  --fa: "\f629";
}

.fa-gauge-simple-high {
  --fa: "\f62a";
}

.fa-tachometer {
  --fa: "\f62a";
}

.fa-tachometer-fast {
  --fa: "\f62a";
}

.fa-teeth {
  --fa: "\f62e";
}

.fa-teeth-open {
  --fa: "\f62f";
}

.fa-masks-theater {
  --fa: "\f630";
}

.fa-theater-masks {
  --fa: "\f630";
}

.fa-traffic-light {
  --fa: "\f637";
}

.fa-truck-monster {
  --fa: "\f63b";
}

.fa-truck-pickup {
  --fa: "\f63c";
}

.fa-rectangle-ad {
  --fa: "\f641";
}

.fa-ad {
  --fa: "\f641";
}

.fa-ankh {
  --fa: "\f644";
}

.fa-book-bible {
  --fa: "\f647";
}

.fa-bible {
  --fa: "\f647";
}

.fa-business-time {
  --fa: "\f64a";
}

.fa-briefcase-clock {
  --fa: "\f64a";
}

.fa-city {
  --fa: "\f64f";
}

.fa-comment-dollar {
  --fa: "\f651";
}

.fa-comments-dollar {
  --fa: "\f653";
}

.fa-cross {
  --fa: "\f654";
}

.fa-dharmachakra {
  --fa: "\f655";
}

.fa-envelope-open-text {
  --fa: "\f658";
}

.fa-folder-minus {
  --fa: "\f65d";
}

.fa-folder-plus {
  --fa: "\f65e";
}

.fa-filter-circle-dollar {
  --fa: "\f662";
}

.fa-funnel-dollar {
  --fa: "\f662";
}

.fa-gopuram {
  --fa: "\f664";
}

.fa-hamsa {
  --fa: "\f665";
}

.fa-bahai {
  --fa: "\f666";
}

.fa-haykal {
  --fa: "\f666";
}

.fa-jedi {
  --fa: "\f669";
}

.fa-book-journal-whills {
  --fa: "\f66a";
}

.fa-journal-whills {
  --fa: "\f66a";
}

.fa-kaaba {
  --fa: "\f66b";
}

.fa-khanda {
  --fa: "\f66d";
}

.fa-landmark {
  --fa: "\f66f";
}

.fa-envelopes-bulk {
  --fa: "\f674";
}

.fa-mail-bulk {
  --fa: "\f674";
}

.fa-menorah {
  --fa: "\f676";
}

.fa-mosque {
  --fa: "\f678";
}

.fa-om {
  --fa: "\f679";
}

.fa-spaghetti-monster-flying {
  --fa: "\f67b";
}

.fa-pastafarianism {
  --fa: "\f67b";
}

.fa-peace {
  --fa: "\f67c";
}

.fa-place-of-worship {
  --fa: "\f67f";
}

.fa-square-poll-vertical {
  --fa: "\f681";
}

.fa-poll {
  --fa: "\f681";
}

.fa-square-poll-horizontal {
  --fa: "\f682";
}

.fa-poll-h {
  --fa: "\f682";
}

.fa-person-praying {
  --fa: "\f683";
}

.fa-pray {
  --fa: "\f683";
}

.fa-hands-praying {
  --fa: "\f684";
}

.fa-praying-hands {
  --fa: "\f684";
}

.fa-book-quran {
  --fa: "\f687";
}

.fa-quran {
  --fa: "\f687";
}

.fa-magnifying-glass-dollar {
  --fa: "\f688";
}

.fa-search-dollar {
  --fa: "\f688";
}

.fa-magnifying-glass-location {
  --fa: "\f689";
}

.fa-search-location {
  --fa: "\f689";
}

.fa-socks {
  --fa: "\f696";
}

.fa-square-root-variable {
  --fa: "\f698";
}

.fa-square-root-alt {
  --fa: "\f698";
}

.fa-star-and-crescent {
  --fa: "\f699";
}

.fa-star-of-david {
  --fa: "\f69a";
}

.fa-synagogue {
  --fa: "\f69b";
}

.fa-scroll-torah {
  --fa: "\f6a0";
}

.fa-torah {
  --fa: "\f6a0";
}

.fa-torii-gate {
  --fa: "\f6a1";
}

.fa-vihara {
  --fa: "\f6a7";
}

.fa-volume {
  --fa: "\f6a8";
}

.fa-volume-medium {
  --fa: "\f6a8";
}

.fa-volume-xmark {
  --fa: "\f6a9";
}

.fa-volume-mute {
  --fa: "\f6a9";
}

.fa-volume-times {
  --fa: "\f6a9";
}

.fa-yin-yang {
  --fa: "\f6ad";
}

.fa-blender-phone {
  --fa: "\f6b6";
}

.fa-book-skull {
  --fa: "\f6b7";
}

.fa-book-dead {
  --fa: "\f6b7";
}

.fa-campground {
  --fa: "\f6bb";
}

.fa-cat {
  --fa: "\f6be";
}

.fa-chair {
  --fa: "\f6c0";
}

.fa-cloud-moon {
  --fa: "\f6c3";
}

.fa-cloud-sun {
  --fa: "\f6c4";
}

.fa-cow {
  --fa: "\f6c8";
}

.fa-dice-d20 {
  --fa: "\f6cf";
}

.fa-dice-d6 {
  --fa: "\f6d1";
}

.fa-dog {
  --fa: "\f6d3";
}

.fa-dragon {
  --fa: "\f6d5";
}

.fa-drumstick-bite {
  --fa: "\f6d7";
}

.fa-dungeon {
  --fa: "\f6d9";
}

.fa-file-csv {
  --fa: "\f6dd";
}

.fa-hand-fist {
  --fa: "\f6de";
}

.fa-fist-raised {
  --fa: "\f6de";
}

.fa-ghost {
  --fa: "\f6e2";
}

.fa-hammer {
  --fa: "\f6e3";
}

.fa-hanukiah {
  --fa: "\f6e6";
}

.fa-hat-wizard {
  --fa: "\f6e8";
}

.fa-person-hiking {
  --fa: "\f6ec";
}

.fa-hiking {
  --fa: "\f6ec";
}

.fa-hippo {
  --fa: "\f6ed";
}

.fa-horse {
  --fa: "\f6f0";
}

.fa-house-chimney-crack {
  --fa: "\f6f1";
}

.fa-house-damage {
  --fa: "\f6f1";
}

.fa-hryvnia-sign {
  --fa: "\f6f2";
}

.fa-hryvnia {
  --fa: "\f6f2";
}

.fa-mask {
  --fa: "\f6fa";
}

.fa-mountain {
  --fa: "\f6fc";
}

.fa-network-wired {
  --fa: "\f6ff";
}

.fa-otter {
  --fa: "\f700";
}

.fa-ring {
  --fa: "\f70b";
}

.fa-person-running {
  --fa: "\f70c";
}

.fa-running {
  --fa: "\f70c";
}

.fa-scroll {
  --fa: "\f70e";
}

.fa-skull-crossbones {
  --fa: "\f714";
}

.fa-slash {
  --fa: "\f715";
}

.fa-spider {
  --fa: "\f717";
}

.fa-toilet-paper {
  --fa: "\f71e";
}

.fa-toilet-paper-alt {
  --fa: "\f71e";
}

.fa-toilet-paper-blank {
  --fa: "\f71e";
}

.fa-tractor {
  --fa: "\f722";
}

.fa-user-injured {
  --fa: "\f728";
}

.fa-vr-cardboard {
  --fa: "\f729";
}

.fa-wand-sparkles {
  --fa: "\f72b";
}

.fa-wind {
  --fa: "\f72e";
}

.fa-wine-bottle {
  --fa: "\f72f";
}

.fa-cloud-meatball {
  --fa: "\f73b";
}

.fa-cloud-moon-rain {
  --fa: "\f73c";
}

.fa-cloud-rain {
  --fa: "\f73d";
}

.fa-cloud-showers-heavy {
  --fa: "\f740";
}

.fa-cloud-sun-rain {
  --fa: "\f743";
}

.fa-democrat {
  --fa: "\f747";
}

.fa-flag-usa {
  --fa: "\f74d";
}

.fa-hurricane {
  --fa: "\f751";
}

.fa-landmark-dome {
  --fa: "\f752";
}

.fa-landmark-alt {
  --fa: "\f752";
}

.fa-meteor {
  --fa: "\f753";
}

.fa-person-booth {
  --fa: "\f756";
}

.fa-poo-storm {
  --fa: "\f75a";
}

.fa-poo-bolt {
  --fa: "\f75a";
}

.fa-rainbow {
  --fa: "\f75b";
}

.fa-republican {
  --fa: "\f75e";
}

.fa-smog {
  --fa: "\f75f";
}

.fa-temperature-high {
  --fa: "\f769";
}

.fa-temperature-low {
  --fa: "\f76b";
}

.fa-cloud-bolt {
  --fa: "\f76c";
}

.fa-thunderstorm {
  --fa: "\f76c";
}

.fa-tornado {
  --fa: "\f76f";
}

.fa-volcano {
  --fa: "\f770";
}

.fa-check-to-slot {
  --fa: "\f772";
}

.fa-vote-yea {
  --fa: "\f772";
}

.fa-water {
  --fa: "\f773";
}

.fa-baby {
  --fa: "\f77c";
}

.fa-baby-carriage {
  --fa: "\f77d";
}

.fa-carriage-baby {
  --fa: "\f77d";
}

.fa-biohazard {
  --fa: "\f780";
}

.fa-blog {
  --fa: "\f781";
}

.fa-calendar-day {
  --fa: "\f783";
}

.fa-calendar-week {
  --fa: "\f784";
}

.fa-candy-cane {
  --fa: "\f786";
}

.fa-carrot {
  --fa: "\f787";
}

.fa-cash-register {
  --fa: "\f788";
}

.fa-minimize {
  --fa: "\f78c";
}

.fa-compress-arrows-alt {
  --fa: "\f78c";
}

.fa-dumpster {
  --fa: "\f793";
}

.fa-dumpster-fire {
  --fa: "\f794";
}

.fa-ethernet {
  --fa: "\f796";
}

.fa-gifts {
  --fa: "\f79c";
}

.fa-champagne-glasses {
  --fa: "\f79f";
}

.fa-glass-cheers {
  --fa: "\f79f";
}

.fa-whiskey-glass {
  --fa: "\f7a0";
}

.fa-glass-whiskey {
  --fa: "\f7a0";
}

.fa-earth-europe {
  --fa: "\f7a2";
}

.fa-globe-europe {
  --fa: "\f7a2";
}

.fa-grip-lines {
  --fa: "\f7a4";
}

.fa-grip-lines-vertical {
  --fa: "\f7a5";
}

.fa-guitar {
  --fa: "\f7a6";
}

.fa-heart-crack {
  --fa: "\f7a9";
}

.fa-heart-broken {
  --fa: "\f7a9";
}

.fa-holly-berry {
  --fa: "\f7aa";
}

.fa-horse-head {
  --fa: "\f7ab";
}

.fa-icicles {
  --fa: "\f7ad";
}

.fa-igloo {
  --fa: "\f7ae";
}

.fa-mitten {
  --fa: "\f7b5";
}

.fa-mug-hot {
  --fa: "\f7b6";
}

.fa-radiation {
  --fa: "\f7b9";
}

.fa-circle-radiation {
  --fa: "\f7ba";
}

.fa-radiation-alt {
  --fa: "\f7ba";
}

.fa-restroom {
  --fa: "\f7bd";
}

.fa-satellite {
  --fa: "\f7bf";
}

.fa-satellite-dish {
  --fa: "\f7c0";
}

.fa-sd-card {
  --fa: "\f7c2";
}

.fa-sim-card {
  --fa: "\f7c4";
}

.fa-person-skating {
  --fa: "\f7c5";
}

.fa-skating {
  --fa: "\f7c5";
}

.fa-person-skiing {
  --fa: "\f7c9";
}

.fa-skiing {
  --fa: "\f7c9";
}

.fa-person-skiing-nordic {
  --fa: "\f7ca";
}

.fa-skiing-nordic {
  --fa: "\f7ca";
}

.fa-sleigh {
  --fa: "\f7cc";
}

.fa-comment-sms {
  --fa: "\f7cd";
}

.fa-sms {
  --fa: "\f7cd";
}

.fa-person-snowboarding {
  --fa: "\f7ce";
}

.fa-snowboarding {
  --fa: "\f7ce";
}

.fa-snowman {
  --fa: "\f7d0";
}

.fa-snowplow {
  --fa: "\f7d2";
}

.fa-tenge-sign {
  --fa: "\f7d7";
}

.fa-tenge {
  --fa: "\f7d7";
}

.fa-toilet {
  --fa: "\f7d8";
}

.fa-screwdriver-wrench {
  --fa: "\f7d9";
}

.fa-tools {
  --fa: "\f7d9";
}

.fa-cable-car {
  --fa: "\f7da";
}

.fa-tram {
  --fa: "\f7da";
}

.fa-fire-flame-curved {
  --fa: "\f7e4";
}

.fa-fire-alt {
  --fa: "\f7e4";
}

.fa-bacon {
  --fa: "\f7e5";
}

.fa-book-medical {
  --fa: "\f7e6";
}

.fa-bread-slice {
  --fa: "\f7ec";
}

.fa-cheese {
  --fa: "\f7ef";
}

.fa-house-chimney-medical {
  --fa: "\f7f2";
}

.fa-clinic-medical {
  --fa: "\f7f2";
}

.fa-clipboard-user {
  --fa: "\f7f3";
}

.fa-comment-medical {
  --fa: "\f7f5";
}

.fa-crutch {
  --fa: "\f7f7";
}

.fa-disease {
  --fa: "\f7fa";
}

.fa-egg {
  --fa: "\f7fb";
}

.fa-folder-tree {
  --fa: "\f802";
}

.fa-burger {
  --fa: "\f805";
}

.fa-hamburger {
  --fa: "\f805";
}

.fa-hand-middle-finger {
  --fa: "\f806";
}

.fa-helmet-safety {
  --fa: "\f807";
}

.fa-hard-hat {
  --fa: "\f807";
}

.fa-hat-hard {
  --fa: "\f807";
}

.fa-hospital-user {
  --fa: "\f80d";
}

.fa-hotdog {
  --fa: "\f80f";
}

.fa-ice-cream {
  --fa: "\f810";
}

.fa-laptop-medical {
  --fa: "\f812";
}

.fa-pager {
  --fa: "\f815";
}

.fa-pepper-hot {
  --fa: "\f816";
}

.fa-pizza-slice {
  --fa: "\f818";
}

.fa-sack-dollar {
  --fa: "\f81d";
}

.fa-book-tanakh {
  --fa: "\f827";
}

.fa-tanakh {
  --fa: "\f827";
}

.fa-bars-progress {
  --fa: "\f828";
}

.fa-tasks-alt {
  --fa: "\f828";
}

.fa-trash-arrow-up {
  --fa: "\f829";
}

.fa-trash-restore {
  --fa: "\f829";
}

.fa-trash-can-arrow-up {
  --fa: "\f82a";
}

.fa-trash-restore-alt {
  --fa: "\f82a";
}

.fa-user-nurse {
  --fa: "\f82f";
}

.fa-wave-square {
  --fa: "\f83e";
}

.fa-person-biking {
  --fa: "\f84a";
}

.fa-biking {
  --fa: "\f84a";
}

.fa-border-all {
  --fa: "\f84c";
}

.fa-border-none {
  --fa: "\f850";
}

.fa-border-top-left {
  --fa: "\f853";
}

.fa-border-style {
  --fa: "\f853";
}

.fa-person-digging {
  --fa: "\f85e";
}

.fa-digging {
  --fa: "\f85e";
}

.fa-fan {
  --fa: "\f863";
}

.fa-icons {
  --fa: "\f86d";
}

.fa-heart-music-camera-bolt {
  --fa: "\f86d";
}

.fa-phone-flip {
  --fa: "\f879";
}

.fa-phone-alt {
  --fa: "\f879";
}

.fa-square-phone-flip {
  --fa: "\f87b";
}

.fa-phone-square-alt {
  --fa: "\f87b";
}

.fa-photo-film {
  --fa: "\f87c";
}

.fa-photo-video {
  --fa: "\f87c";
}

.fa-text-slash {
  --fa: "\f87d";
}

.fa-remove-format {
  --fa: "\f87d";
}

.fa-arrow-down-z-a {
  --fa: "\f881";
}

.fa-sort-alpha-desc {
  --fa: "\f881";
}

.fa-sort-alpha-down-alt {
  --fa: "\f881";
}

.fa-arrow-up-z-a {
  --fa: "\f882";
}

.fa-sort-alpha-up-alt {
  --fa: "\f882";
}

.fa-arrow-down-short-wide {
  --fa: "\f884";
}

.fa-sort-amount-desc {
  --fa: "\f884";
}

.fa-sort-amount-down-alt {
  --fa: "\f884";
}

.fa-arrow-up-short-wide {
  --fa: "\f885";
}

.fa-sort-amount-up-alt {
  --fa: "\f885";
}

.fa-arrow-down-9-1 {
  --fa: "\f886";
}

.fa-sort-numeric-desc {
  --fa: "\f886";
}

.fa-sort-numeric-down-alt {
  --fa: "\f886";
}

.fa-arrow-up-9-1 {
  --fa: "\f887";
}

.fa-sort-numeric-up-alt {
  --fa: "\f887";
}

.fa-spell-check {
  --fa: "\f891";
}

.fa-voicemail {
  --fa: "\f897";
}

.fa-hat-cowboy {
  --fa: "\f8c0";
}

.fa-hat-cowboy-side {
  --fa: "\f8c1";
}

.fa-computer-mouse {
  --fa: "\f8cc";
}

.fa-mouse {
  --fa: "\f8cc";
}

.fa-radio {
  --fa: "\f8d7";
}

.fa-record-vinyl {
  --fa: "\f8d9";
}

.fa-walkie-talkie {
  --fa: "\f8ef";
}

.fa-caravan {
  --fa: "\f8ff";
}

.fa.fa-glass {
  --fa: "\f000";
}

.fa.fa-envelope-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-envelope-o {
  --fa: "\f0e0";
}

.fa.fa-star-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-star-o {
  --fa: "\f005";
}

.fa.fa-remove {
  --fa: "\f00d";
}

.fa.fa-close {
  --fa: "\f00d";
}

.fa.fa-gear {
  --fa: "\f013";
}

.fa.fa-trash-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-trash-o {
  --fa: "\f2ed";
}

.fa.fa-home {
  --fa: "\f015";
}

.fa.fa-file-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-o {
  --fa: "\f15b";
}

.fa.fa-clock-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-clock-o {
  --fa: "\f017";
}

.fa.fa-arrow-circle-o-down {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-arrow-circle-o-down {
  --fa: "\f358";
}

.fa.fa-arrow-circle-o-up {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-arrow-circle-o-up {
  --fa: "\f35b";
}

.fa.fa-play-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-play-circle-o {
  --fa: "\f144";
}

.fa.fa-repeat {
  --fa: "\f01e";
}

.fa.fa-rotate-right {
  --fa: "\f01e";
}

.fa.fa-refresh {
  --fa: "\f021";
}

.fa.fa-list-alt {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-list-alt {
  --fa: "\f022";
}

.fa.fa-dedent {
  --fa: "\f03b";
}

.fa.fa-video-camera {
  --fa: "\f03d";
}

.fa.fa-picture-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-picture-o {
  --fa: "\f03e";
}

.fa.fa-photo {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-photo {
  --fa: "\f03e";
}

.fa.fa-image {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-image {
  --fa: "\f03e";
}

.fa.fa-map-marker {
  --fa: "\f3c5";
}

.fa.fa-pencil-square-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-pencil-square-o {
  --fa: "\f044";
}

.fa.fa-edit {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-edit {
  --fa: "\f044";
}

.fa.fa-share-square-o {
  --fa: "\f14d";
}

.fa.fa-check-square-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-check-square-o {
  --fa: "\f14a";
}

.fa.fa-arrows {
  --fa: "\f0b2";
}

.fa.fa-times-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-times-circle-o {
  --fa: "\f057";
}

.fa.fa-check-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-check-circle-o {
  --fa: "\f058";
}

.fa.fa-mail-forward {
  --fa: "\f064";
}

.fa.fa-expand {
  --fa: "\f424";
}

.fa.fa-compress {
  --fa: "\f422";
}

.fa.fa-eye {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-eye-slash {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-warning {
  --fa: "\f071";
}

.fa.fa-calendar {
  --fa: "\f073";
}

.fa.fa-arrows-v {
  --fa: "\f338";
}

.fa.fa-arrows-h {
  --fa: "\f337";
}

.fa.fa-bar-chart {
  --fa: "\e0e3";
}

.fa.fa-bar-chart-o {
  --fa: "\e0e3";
}

.fa.fa-twitter-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-twitter-square {
  --fa: "\f081";
}

.fa.fa-facebook-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-facebook-square {
  --fa: "\f082";
}

.fa.fa-gears {
  --fa: "\f085";
}

.fa.fa-thumbs-o-up {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-thumbs-o-up {
  --fa: "\f164";
}

.fa.fa-thumbs-o-down {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-thumbs-o-down {
  --fa: "\f165";
}

.fa.fa-heart-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-heart-o {
  --fa: "\f004";
}

.fa.fa-sign-out {
  --fa: "\f2f5";
}

.fa.fa-linkedin-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-linkedin-square {
  --fa: "\f08c";
}

.fa.fa-thumb-tack {
  --fa: "\f08d";
}

.fa.fa-external-link {
  --fa: "\f35d";
}

.fa.fa-sign-in {
  --fa: "\f2f6";
}

.fa.fa-github-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-github-square {
  --fa: "\f092";
}

.fa.fa-lemon-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-lemon-o {
  --fa: "\f094";
}

.fa.fa-square-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-square-o {
  --fa: "\f0c8";
}

.fa.fa-bookmark-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-bookmark-o {
  --fa: "\f02e";
}

.fa.fa-twitter {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-facebook {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-facebook {
  --fa: "\f39e";
}

.fa.fa-facebook-f {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-facebook-f {
  --fa: "\f39e";
}

.fa.fa-github {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-credit-card {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-feed {
  --fa: "\f09e";
}

.fa.fa-hdd-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hdd-o {
  --fa: "\f0a0";
}

.fa.fa-hand-o-right {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-o-right {
  --fa: "\f0a4";
}

.fa.fa-hand-o-left {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-o-left {
  --fa: "\f0a5";
}

.fa.fa-hand-o-up {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-o-up {
  --fa: "\f0a6";
}

.fa.fa-hand-o-down {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-o-down {
  --fa: "\f0a7";
}

.fa.fa-globe {
  --fa: "\f57d";
}

.fa.fa-tasks {
  --fa: "\f828";
}

.fa.fa-arrows-alt {
  --fa: "\f31e";
}

.fa.fa-group {
  --fa: "\f0c0";
}

.fa.fa-chain {
  --fa: "\f0c1";
}

.fa.fa-cut {
  --fa: "\f0c4";
}

.fa.fa-files-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-files-o {
  --fa: "\f0c5";
}

.fa.fa-floppy-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-floppy-o {
  --fa: "\f0c7";
}

.fa.fa-save {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-save {
  --fa: "\f0c7";
}

.fa.fa-navicon {
  --fa: "\f0c9";
}

.fa.fa-reorder {
  --fa: "\f0c9";
}

.fa.fa-magic {
  --fa: "\e2ca";
}

.fa.fa-pinterest {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-pinterest-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-pinterest-square {
  --fa: "\f0d3";
}

.fa.fa-google-plus-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google-plus-square {
  --fa: "\f0d4";
}

.fa.fa-google-plus {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google-plus {
  --fa: "\f0d5";
}

.fa.fa-money {
  --fa: "\f3d1";
}

.fa.fa-unsorted {
  --fa: "\f0dc";
}

.fa.fa-sort-desc {
  --fa: "\f0dd";
}

.fa.fa-sort-asc {
  --fa: "\f0de";
}

.fa.fa-linkedin {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-linkedin {
  --fa: "\f0e1";
}

.fa.fa-rotate-left {
  --fa: "\f0e2";
}

.fa.fa-legal {
  --fa: "\f0e3";
}

.fa.fa-tachometer {
  --fa: "\f625";
}

.fa.fa-dashboard {
  --fa: "\f625";
}

.fa.fa-comment-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-comment-o {
  --fa: "\f075";
}

.fa.fa-comments-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-comments-o {
  --fa: "\f086";
}

.fa.fa-flash {
  --fa: "\f0e7";
}

.fa.fa-clipboard {
  --fa: "\f0ea";
}

.fa.fa-lightbulb-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-lightbulb-o {
  --fa: "\f0eb";
}

.fa.fa-exchange {
  --fa: "\f362";
}

.fa.fa-cloud-download {
  --fa: "\f0ed";
}

.fa.fa-cloud-upload {
  --fa: "\f0ee";
}

.fa.fa-bell-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-bell-o {
  --fa: "\f0f3";
}

.fa.fa-cutlery {
  --fa: "\f2e7";
}

.fa.fa-file-text-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-text-o {
  --fa: "\f15c";
}

.fa.fa-building-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-building-o {
  --fa: "\f1ad";
}

.fa.fa-hospital-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hospital-o {
  --fa: "\f0f8";
}

.fa.fa-tablet {
  --fa: "\f3fa";
}

.fa.fa-mobile {
  --fa: "\f3cd";
}

.fa.fa-mobile-phone {
  --fa: "\f3cd";
}

.fa.fa-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-circle-o {
  --fa: "\f111";
}

.fa.fa-mail-reply {
  --fa: "\f3e5";
}

.fa.fa-github-alt {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-folder-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-folder-o {
  --fa: "\f07b";
}

.fa.fa-folder-open-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-folder-open-o {
  --fa: "\f07c";
}

.fa.fa-smile-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-smile-o {
  --fa: "\f118";
}

.fa.fa-frown-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-frown-o {
  --fa: "\f119";
}

.fa.fa-meh-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-meh-o {
  --fa: "\f11a";
}

.fa.fa-keyboard-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-keyboard-o {
  --fa: "\f11c";
}

.fa.fa-flag-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-flag-o {
  --fa: "\f024";
}

.fa.fa-mail-reply-all {
  --fa: "\f122";
}

.fa.fa-star-half-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-star-half-o {
  --fa: "\f5c0";
}

.fa.fa-star-half-empty {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-star-half-empty {
  --fa: "\f5c0";
}

.fa.fa-star-half-full {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-star-half-full {
  --fa: "\f5c0";
}

.fa.fa-code-fork {
  --fa: "\f126";
}

.fa.fa-chain-broken {
  --fa: "\f127";
}

.fa.fa-unlink {
  --fa: "\f127";
}

.fa.fa-calendar-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-calendar-o {
  --fa: "\f133";
}

.fa.fa-maxcdn {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-html5 {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-css3 {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-unlock-alt {
  --fa: "\f09c";
}

.fa.fa-minus-square-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-minus-square-o {
  --fa: "\f146";
}

.fa.fa-level-up {
  --fa: "\f3bf";
}

.fa.fa-level-down {
  --fa: "\f3be";
}

.fa.fa-pencil-square {
  --fa: "\f14b";
}

.fa.fa-external-link-square {
  --fa: "\f360";
}

.fa.fa-compass {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-caret-square-o-down {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-caret-square-o-down {
  --fa: "\f150";
}

.fa.fa-toggle-down {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-toggle-down {
  --fa: "\f150";
}

.fa.fa-caret-square-o-up {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-caret-square-o-up {
  --fa: "\f151";
}

.fa.fa-toggle-up {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-toggle-up {
  --fa: "\f151";
}

.fa.fa-caret-square-o-right {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-caret-square-o-right {
  --fa: "\f152";
}

.fa.fa-toggle-right {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-toggle-right {
  --fa: "\f152";
}

.fa.fa-eur {
  --fa: "\f153";
}

.fa.fa-euro {
  --fa: "\f153";
}

.fa.fa-gbp {
  --fa: "\f154";
}

.fa.fa-usd {
  --fa: "\$";
}

.fa.fa-dollar {
  --fa: "\$";
}

.fa.fa-inr {
  --fa: "\e1bc";
}

.fa.fa-rupee {
  --fa: "\e1bc";
}

.fa.fa-jpy {
  --fa: "\f157";
}

.fa.fa-cny {
  --fa: "\f157";
}

.fa.fa-rmb {
  --fa: "\f157";
}

.fa.fa-yen {
  --fa: "\f157";
}

.fa.fa-rub {
  --fa: "\f158";
}

.fa.fa-ruble {
  --fa: "\f158";
}

.fa.fa-rouble {
  --fa: "\f158";
}

.fa.fa-krw {
  --fa: "\f159";
}

.fa.fa-won {
  --fa: "\f159";
}

.fa.fa-btc {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bitcoin {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bitcoin {
  --fa: "\f15a";
}

.fa.fa-file-text {
  --fa: "\f15c";
}

.fa.fa-sort-alpha-asc {
  --fa: "\f15d";
}

.fa.fa-sort-alpha-desc {
  --fa: "\f881";
}

.fa.fa-sort-amount-asc {
  --fa: "\f884";
}

.fa.fa-sort-amount-desc {
  --fa: "\f160";
}

.fa.fa-sort-numeric-asc {
  --fa: "\f162";
}

.fa.fa-sort-numeric-desc {
  --fa: "\f886";
}

.fa.fa-youtube-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-youtube-square {
  --fa: "\f431";
}

.fa.fa-youtube {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-xing {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-xing-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-xing-square {
  --fa: "\f169";
}

.fa.fa-youtube-play {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-youtube-play {
  --fa: "\f167";
}

.fa.fa-dropbox {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-stack-overflow {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-instagram {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-flickr {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-adn {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bitbucket {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bitbucket-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bitbucket-square {
  --fa: "\f171";
}

.fa.fa-tumblr {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-tumblr-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-tumblr-square {
  --fa: "\f174";
}

.fa.fa-long-arrow-down {
  --fa: "\f309";
}

.fa.fa-long-arrow-up {
  --fa: "\f30c";
}

.fa.fa-long-arrow-left {
  --fa: "\f30a";
}

.fa.fa-long-arrow-right {
  --fa: "\f30b";
}

.fa.fa-apple {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-windows {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-android {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-linux {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-dribbble {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-skype {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-foursquare {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-trello {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-gratipay {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-gittip {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-gittip {
  --fa: "\f184";
}

.fa.fa-sun-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-sun-o {
  --fa: "\f185";
}

.fa.fa-moon-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-moon-o {
  --fa: "\f186";
}

.fa.fa-vk {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-weibo {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-renren {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-pagelines {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-stack-exchange {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-arrow-circle-o-right {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-arrow-circle-o-right {
  --fa: "\f35a";
}

.fa.fa-arrow-circle-o-left {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-arrow-circle-o-left {
  --fa: "\f359";
}

.fa.fa-caret-square-o-left {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-caret-square-o-left {
  --fa: "\f191";
}

.fa.fa-toggle-left {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-toggle-left {
  --fa: "\f191";
}

.fa.fa-dot-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-dot-circle-o {
  --fa: "\f192";
}

.fa.fa-vimeo-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-vimeo-square {
  --fa: "\f194";
}

.fa.fa-try {
  --fa: "\e2bb";
}

.fa.fa-turkish-lira {
  --fa: "\e2bb";
}

.fa.fa-plus-square-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-plus-square-o {
  --fa: "\f0fe";
}

.fa.fa-slack {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wordpress {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-openid {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-institution {
  --fa: "\f19c";
}

.fa.fa-bank {
  --fa: "\f19c";
}

.fa.fa-mortar-board {
  --fa: "\f19d";
}

.fa.fa-yahoo {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-reddit {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-reddit-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-reddit-square {
  --fa: "\f1a2";
}

.fa.fa-stumbleupon-circle {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-stumbleupon {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-delicious {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-digg {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-pied-piper-pp {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-pied-piper-alt {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-drupal {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-joomla {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-behance {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-behance-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-behance-square {
  --fa: "\f1b5";
}

.fa.fa-steam {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-steam-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-steam-square {
  --fa: "\f1b7";
}

.fa.fa-automobile {
  --fa: "\f1b9";
}

.fa.fa-cab {
  --fa: "\f1ba";
}

.fa.fa-spotify {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-deviantart {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-soundcloud {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-file-pdf-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-pdf-o {
  --fa: "\f1c1";
}

.fa.fa-file-word-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-word-o {
  --fa: "\f1c2";
}

.fa.fa-file-excel-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-excel-o {
  --fa: "\f1c3";
}

.fa.fa-file-powerpoint-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-powerpoint-o {
  --fa: "\f1c4";
}

.fa.fa-file-image-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-image-o {
  --fa: "\f1c5";
}

.fa.fa-file-photo-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-photo-o {
  --fa: "\f1c5";
}

.fa.fa-file-picture-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-picture-o {
  --fa: "\f1c5";
}

.fa.fa-file-archive-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-archive-o {
  --fa: "\f1c6";
}

.fa.fa-file-zip-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-zip-o {
  --fa: "\f1c6";
}

.fa.fa-file-audio-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-audio-o {
  --fa: "\f1c7";
}

.fa.fa-file-sound-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-sound-o {
  --fa: "\f1c7";
}

.fa.fa-file-video-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-video-o {
  --fa: "\f1c8";
}

.fa.fa-file-movie-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-movie-o {
  --fa: "\f1c8";
}

.fa.fa-file-code-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-file-code-o {
  --fa: "\f1c9";
}

.fa.fa-vine {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-codepen {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-jsfiddle {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-life-bouy {
  --fa: "\f1cd";
}

.fa.fa-life-buoy {
  --fa: "\f1cd";
}

.fa.fa-life-saver {
  --fa: "\f1cd";
}

.fa.fa-support {
  --fa: "\f1cd";
}

.fa.fa-circle-o-notch {
  --fa: "\f1ce";
}

.fa.fa-rebel {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-ra {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-ra {
  --fa: "\f1d0";
}

.fa.fa-resistance {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-resistance {
  --fa: "\f1d0";
}

.fa.fa-empire {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-ge {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-ge {
  --fa: "\f1d1";
}

.fa.fa-git-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-git-square {
  --fa: "\f1d2";
}

.fa.fa-git {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-hacker-news {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-y-combinator-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-y-combinator-square {
  --fa: "\f1d4";
}

.fa.fa-yc-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-yc-square {
  --fa: "\f1d4";
}

.fa.fa-tencent-weibo {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-qq {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-weixin {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wechat {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wechat {
  --fa: "\f1d7";
}

.fa.fa-send {
  --fa: "\f1d8";
}

.fa.fa-paper-plane-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-paper-plane-o {
  --fa: "\f1d8";
}

.fa.fa-send-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-send-o {
  --fa: "\f1d8";
}

.fa.fa-circle-thin {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-circle-thin {
  --fa: "\f111";
}

.fa.fa-header {
  --fa: "\f1dc";
}

.fa.fa-futbol-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-futbol-o {
  --fa: "\f1e3";
}

.fa.fa-soccer-ball-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-soccer-ball-o {
  --fa: "\f1e3";
}

.fa.fa-slideshare {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-twitch {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-yelp {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-newspaper-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-newspaper-o {
  --fa: "\f1ea";
}

.fa.fa-paypal {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google-wallet {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-visa {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-mastercard {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-discover {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-amex {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-paypal {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-stripe {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bell-slash-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-bell-slash-o {
  --fa: "\f1f6";
}

.fa.fa-trash {
  --fa: "\f2ed";
}

.fa.fa-copyright {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-eyedropper {
  --fa: "\f1fb";
}

.fa.fa-area-chart {
  --fa: "\f1fe";
}

.fa.fa-pie-chart {
  --fa: "\f200";
}

.fa.fa-line-chart {
  --fa: "\f201";
}

.fa.fa-lastfm {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-lastfm-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-lastfm-square {
  --fa: "\f203";
}

.fa.fa-ioxhost {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-angellist {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-cc {
  --fa: "\f20a";
}

.fa.fa-ils {
  --fa: "\f20b";
}

.fa.fa-shekel {
  --fa: "\f20b";
}

.fa.fa-sheqel {
  --fa: "\f20b";
}

.fa.fa-buysellads {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-connectdevelop {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-dashcube {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-forumbee {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-leanpub {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-sellsy {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-shirtsinbulk {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-simplybuilt {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-skyatlas {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-diamond {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-diamond {
  --fa: "\f3a5";
}

.fa.fa-transgender {
  --fa: "\f224";
}

.fa.fa-intersex {
  --fa: "\f224";
}

.fa.fa-transgender-alt {
  --fa: "\f225";
}

.fa.fa-facebook-official {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-facebook-official {
  --fa: "\f09a";
}

.fa.fa-pinterest-p {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-whatsapp {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-hotel {
  --fa: "\f236";
}

.fa.fa-viacoin {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-medium {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-y-combinator {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-yc {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-yc {
  --fa: "\f23b";
}

.fa.fa-optin-monster {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-opencart {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-expeditedssl {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-battery-4 {
  --fa: "\f240";
}

.fa.fa-battery {
  --fa: "\f240";
}

.fa.fa-battery-3 {
  --fa: "\f241";
}

.fa.fa-battery-2 {
  --fa: "\f242";
}

.fa.fa-battery-1 {
  --fa: "\f243";
}

.fa.fa-battery-0 {
  --fa: "\f244";
}

.fa.fa-object-group {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-object-ungroup {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-sticky-note-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-sticky-note-o {
  --fa: "\f249";
}

.fa.fa-cc-jcb {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-cc-diners-club {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-clone {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hourglass-o {
  --fa: "\f254";
}

.fa.fa-hourglass-1 {
  --fa: "\f251";
}

.fa.fa-hourglass-2 {
  --fa: "\f252";
}

.fa.fa-hourglass-3 {
  --fa: "\f253";
}

.fa.fa-hand-rock-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-rock-o {
  --fa: "\f255";
}

.fa.fa-hand-grab-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-grab-o {
  --fa: "\f255";
}

.fa.fa-hand-paper-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-paper-o {
  --fa: "\f256";
}

.fa.fa-hand-stop-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-stop-o {
  --fa: "\f256";
}

.fa.fa-hand-scissors-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-scissors-o {
  --fa: "\f257";
}

.fa.fa-hand-lizard-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-lizard-o {
  --fa: "\f258";
}

.fa.fa-hand-spock-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-spock-o {
  --fa: "\f259";
}

.fa.fa-hand-pointer-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-pointer-o {
  --fa: "\f25a";
}

.fa.fa-hand-peace-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-hand-peace-o {
  --fa: "\f25b";
}

.fa.fa-registered {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-creative-commons {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-gg {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-gg-circle {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-odnoklassniki {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-odnoklassniki-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-odnoklassniki-square {
  --fa: "\f264";
}

.fa.fa-get-pocket {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wikipedia-w {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-safari {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-chrome {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-firefox {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-opera {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-internet-explorer {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-television {
  --fa: "\f26c";
}

.fa.fa-contao {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-500px {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-amazon {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-calendar-plus-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-calendar-plus-o {
  --fa: "\f271";
}

.fa.fa-calendar-minus-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-calendar-minus-o {
  --fa: "\f272";
}

.fa.fa-calendar-times-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-calendar-times-o {
  --fa: "\f273";
}

.fa.fa-calendar-check-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-calendar-check-o {
  --fa: "\f274";
}

.fa.fa-map-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-map-o {
  --fa: "\f279";
}

.fa.fa-commenting {
  --fa: "\f4ad";
}

.fa.fa-commenting-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-commenting-o {
  --fa: "\f4ad";
}

.fa.fa-houzz {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-vimeo {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-vimeo {
  --fa: "\f27d";
}

.fa.fa-black-tie {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-fonticons {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-reddit-alien {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-edge {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-credit-card-alt {
  --fa: "\f09d";
}

.fa.fa-codiepie {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-modx {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-fort-awesome {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-usb {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-product-hunt {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-mixcloud {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-scribd {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-pause-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-pause-circle-o {
  --fa: "\f28b";
}

.fa.fa-stop-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-stop-circle-o {
  --fa: "\f28d";
}

.fa.fa-bluetooth {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-bluetooth-b {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-gitlab {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wpbeginner {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wpforms {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-envira {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wheelchair-alt {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wheelchair-alt {
  --fa: "\f368";
}

.fa.fa-question-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-question-circle-o {
  --fa: "\f059";
}

.fa.fa-volume-control-phone {
  --fa: "\f2a0";
}

.fa.fa-asl-interpreting {
  --fa: "\f2a3";
}

.fa.fa-deafness {
  --fa: "\f2a4";
}

.fa.fa-hard-of-hearing {
  --fa: "\f2a4";
}

.fa.fa-glide {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-glide-g {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-signing {
  --fa: "\f2a7";
}

.fa.fa-viadeo {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-viadeo-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-viadeo-square {
  --fa: "\f2aa";
}

.fa.fa-snapchat {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-snapchat-ghost {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-snapchat-ghost {
  --fa: "\f2ab";
}

.fa.fa-snapchat-square {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-snapchat-square {
  --fa: "\f2ad";
}

.fa.fa-pied-piper {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-first-order {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-yoast {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-themeisle {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google-plus-official {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google-plus-official {
  --fa: "\f2b3";
}

.fa.fa-google-plus-circle {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-google-plus-circle {
  --fa: "\f2b3";
}

.fa.fa-font-awesome {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-fa {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-fa {
  --fa: "\f2b4";
}

.fa.fa-handshake-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-handshake-o {
  --fa: "\f2b5";
}

.fa.fa-envelope-open-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-envelope-open-o {
  --fa: "\f2b6";
}

.fa.fa-linode {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-address-book-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-address-book-o {
  --fa: "\f2b9";
}

.fa.fa-vcard {
  --fa: "\f2bb";
}

.fa.fa-address-card-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-address-card-o {
  --fa: "\f2bb";
}

.fa.fa-vcard-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-vcard-o {
  --fa: "\f2bb";
}

.fa.fa-user-circle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-user-circle-o {
  --fa: "\f2bd";
}

.fa.fa-user-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-user-o {
  --fa: "\f007";
}

.fa.fa-id-badge {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-drivers-license {
  --fa: "\f2c2";
}

.fa.fa-id-card-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-id-card-o {
  --fa: "\f2c2";
}

.fa.fa-drivers-license-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-drivers-license-o {
  --fa: "\f2c2";
}

.fa.fa-quora {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-free-code-camp {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-telegram {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-thermometer-4 {
  --fa: "\f2c7";
}

.fa.fa-thermometer {
  --fa: "\f2c7";
}

.fa.fa-thermometer-3 {
  --fa: "\f2c8";
}

.fa.fa-thermometer-2 {
  --fa: "\f2c9";
}

.fa.fa-thermometer-1 {
  --fa: "\f2ca";
}

.fa.fa-thermometer-0 {
  --fa: "\f2cb";
}

.fa.fa-bathtub {
  --fa: "\f2cd";
}

.fa.fa-s15 {
  --fa: "\f2cd";
}

.fa.fa-window-maximize {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-window-restore {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-times-rectangle {
  --fa: "\f410";
}

.fa.fa-window-close-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-window-close-o {
  --fa: "\f410";
}

.fa.fa-times-rectangle-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-times-rectangle-o {
  --fa: "\f410";
}

.fa.fa-bandcamp {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-grav {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-etsy {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-imdb {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-ravelry {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-eercast {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-eercast {
  --fa: "\f2da";
}

.fa.fa-snowflake-o {
  font-family: "Font Awesome 7 Free";
  font-weight: 400;
}

.fa.fa-snowflake-o {
  --fa: "\f2dc";
}

.fa.fa-superpowers {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-wpexplorer {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

.fa.fa-meetup {
  font-family: "Font Awesome 7 Brands";
  font-weight: 400;
}

/*!
 * Font Awesome Free 7.2.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2026 Fonticons, Inc.
 */
:root, :host {
  --fa-family-classic: 'Font Awesome 7 Free';
  --fa-font-solid: normal 900 1em/1 var(--fa-family-classic);
  /* deprecated: this older custom property will be removed next major release */
  --fa-style-family-classic: var(--fa-family-classic);
}

@font-face {
  font-family: "Font Awesome 7 Free";
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url("../webfonts/fa-solid-900.woff2");
}
.fas {
  --fa-family: var(--fa-family-classic);
  --fa-style: 900;
}

.fa-classic {
  --fa-family: var(--fa-family-classic);
}

.fa-solid {
  --fa-style: 900;
}

/*!
 * Font Awesome Free 7.2.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2026 Fonticons, Inc.
 */
:root, :host {
  --fa-family-brands: 'Font Awesome 7 Brands';
  --fa-font-brands: normal 400 1em/1 var(--fa-family-brands);
}

@font-face {
  font-family: "Font Awesome 7 Brands";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../webfonts/fa-brands-400.woff2");
}
.fab,
.fa-brands,
.fa-classic.fa-brands {
  --fa-family: var(--fa-family-brands);
  --fa-style: 400;
}

.fa-firefox-browser {
  --fa: "\e007";
}

.fa-ideal {
  --fa: "\e013";
}

.fa-microblog {
  --fa: "\e01a";
}

.fa-square-pied-piper {
  --fa: "\e01e";
}

.fa-pied-piper-square {
  --fa: "\e01e";
}

.fa-unity {
  --fa: "\e049";
}

.fa-dailymotion {
  --fa: "\e052";
}

.fa-square-instagram {
  --fa: "\e055";
}

.fa-instagram-square {
  --fa: "\e055";
}

.fa-mixer {
  --fa: "\e056";
}

.fa-shopify {
  --fa: "\e057";
}

.fa-deezer {
  --fa: "\e077";
}

.fa-edge-legacy {
  --fa: "\e078";
}

.fa-google-pay {
  --fa: "\e079";
}

.fa-rust {
  --fa: "\e07a";
}

.fa-tiktok {
  --fa: "\e07b";
}

.fa-unsplash {
  --fa: "\e07c";
}

.fa-cloudflare {
  --fa: "\e07d";
}

.fa-guilded {
  --fa: "\e07e";
}

.fa-hive {
  --fa: "\e07f";
}

.fa-42-group {
  --fa: "\e080";
}

.fa-innosoft {
  --fa: "\e080";
}

.fa-instalod {
  --fa: "\e081";
}

.fa-octopus-deploy {
  --fa: "\e082";
}

.fa-perbyte {
  --fa: "\e083";
}

.fa-uncharted {
  --fa: "\e084";
}

.fa-watchman-monitoring {
  --fa: "\e087";
}

.fa-wodu {
  --fa: "\e088";
}

.fa-wirsindhandwerk {
  --fa: "\e2d0";
}

.fa-wsh {
  --fa: "\e2d0";
}

.fa-bots {
  --fa: "\e340";
}

.fa-cmplid {
  --fa: "\e360";
}

.fa-bilibili {
  --fa: "\e3d9";
}

.fa-golang {
  --fa: "\e40f";
}

.fa-pix {
  --fa: "\e43a";
}

.fa-sitrox {
  --fa: "\e44a";
}

.fa-hashnode {
  --fa: "\e499";
}

.fa-meta {
  --fa: "\e49b";
}

.fa-padlet {
  --fa: "\e4a0";
}

.fa-nfc-directional {
  --fa: "\e530";
}

.fa-nfc-symbol {
  --fa: "\e531";
}

.fa-screenpal {
  --fa: "\e570";
}

.fa-space-awesome {
  --fa: "\e5ac";
}

.fa-square-font-awesome {
  --fa: "\e5ad";
}

.fa-square-gitlab {
  --fa: "\e5ae";
}

.fa-gitlab-square {
  --fa: "\e5ae";
}

.fa-odysee {
  --fa: "\e5c6";
}

.fa-stubber {
  --fa: "\e5c7";
}

.fa-debian {
  --fa: "\e60b";
}

.fa-shoelace {
  --fa: "\e60c";
}

.fa-threads {
  --fa: "\e618";
}

.fa-square-threads {
  --fa: "\e619";
}

.fa-square-x-twitter {
  --fa: "\e61a";
}

.fa-x-twitter {
  --fa: "\e61b";
}

.fa-opensuse {
  --fa: "\e62b";
}

.fa-letterboxd {
  --fa: "\e62d";
}

.fa-square-letterboxd {
  --fa: "\e62e";
}

.fa-mintbit {
  --fa: "\e62f";
}

.fa-google-scholar {
  --fa: "\e63b";
}

.fa-brave {
  --fa: "\e63c";
}

.fa-brave-reverse {
  --fa: "\e63d";
}

.fa-pixiv {
  --fa: "\e640";
}

.fa-upwork {
  --fa: "\e641";
}

.fa-webflow {
  --fa: "\e65c";
}

.fa-signal-messenger {
  --fa: "\e663";
}

.fa-bluesky {
  --fa: "\e671";
}

.fa-jxl {
  --fa: "\e67b";
}

.fa-square-upwork {
  --fa: "\e67c";
}

.fa-web-awesome {
  --fa: "\e682";
}

.fa-square-web-awesome {
  --fa: "\e683";
}

.fa-square-web-awesome-stroke {
  --fa: "\e684";
}

.fa-dart-lang {
  --fa: "\e693";
}

.fa-flutter {
  --fa: "\e694";
}

.fa-files-pinwheel {
  --fa: "\e69f";
}

.fa-css {
  --fa: "\e6a2";
}

.fa-square-bluesky {
  --fa: "\e6a3";
}

.fa-openai {
  --fa: "\e7cf";
}

.fa-square-linkedin {
  --fa: "\e7d0";
}

.fa-cash-app {
  --fa: "\e7d4";
}

.fa-disqus {
  --fa: "\e7d5";
}

.fa-eleventy {
  --fa: "\e7d6";
}

.fa-11ty {
  --fa: "\e7d6";
}

.fa-kakao-talk {
  --fa: "\e7d7";
}

.fa-linktree {
  --fa: "\e7d8";
}

.fa-notion {
  --fa: "\e7d9";
}

.fa-pandora {
  --fa: "\e7da";
}

.fa-pixelfed {
  --fa: "\e7db";
}

.fa-tidal {
  --fa: "\e7dc";
}

.fa-vsco {
  --fa: "\e7dd";
}

.fa-w3c {
  --fa: "\e7de";
}

.fa-lumon {
  --fa: "\e7e2";
}

.fa-lumon-drop {
  --fa: "\e7e3";
}

.fa-square-figma {
  --fa: "\e7e4";
}

.fa-tex {
  --fa: "\e7ff";
}

.fa-duolingo {
  --fa: "\e812";
}

.fa-supportnow {
  --fa: "\e833";
}

.fa-tor-browser {
  --fa: "\e838";
}

.fa-typescript {
  --fa: "\e840";
}

.fa-square-deskpro {
  --fa: "\e844";
}

.fa-circle-zulip {
  --fa: "\e851";
}

.fa-julia {
  --fa: "\e852";
}

.fa-zulip {
  --fa: "\e853";
}

.fa-unison {
  --fa: "\e854";
}

.fa-board-game-geek {
  --fa: "\e855";
}

.fa-bgg {
  --fa: "\e855";
}

.fa-ko-fi {
  --fa: "\e856";
}

.fa-kubernetes {
  --fa: "\e857";
}

.fa-postgresql {
  --fa: "\e858";
}

.fa-scaleway {
  --fa: "\e859";
}

.fa-venmo {
  --fa: "\e85a";
}

.fa-venmo-v {
  --fa: "\e85b";
}

.fa-unreal-engine {
  --fa: "\e85c";
}

.fa-globaleaks {
  --fa: "\e85d";
}

.fa-solana {
  --fa: "\e85e";
}

.fa-threema {
  --fa: "\e85f";
}

.fa-forgejo {
  --fa: "\e860";
}

.fa-claude {
  --fa: "\e861";
}

.fa-gitee {
  --fa: "\e863";
}

.fa-xmpp {
  --fa: "\e864";
}

.fa-fediverse {
  --fa: "\e865";
}

.fa-tailwind-css {
  --fa: "\e866";
}

.fa-arch-linux {
  --fa: "\e867";
}

.fa-svelte {
  --fa: "\e868";
}

.fa-hugging-face {
  --fa: "\e869";
}

.fa-leetcode {
  --fa: "\e86a";
}

.fa-openstreetmap {
  --fa: "\e86b";
}

.fa-ultralytics {
  --fa: "\e86d";
}

.fa-ultralytics-hub {
  --fa: "\e86e";
}

.fa-ultralytics-yolo {
  --fa: "\e86f";
}

.fa-obsidian {
  --fa: "\e879";
}

.fa-zoom {
  --fa: "\e87b";
}

.fa-vim {
  --fa: "\e88a";
}

.fa-symfonycasts {
  --fa: "\e8ab";
}

.fa-square-twitter {
  --fa: "\f081";
}

.fa-twitter-square {
  --fa: "\f081";
}

.fa-square-facebook {
  --fa: "\f082";
}

.fa-facebook-square {
  --fa: "\f082";
}

.fa-linkedin {
  --fa: "\f08c";
}

.fa-square-github {
  --fa: "\f092";
}

.fa-github-square {
  --fa: "\f092";
}

.fa-twitter {
  --fa: "\f099";
}

.fa-facebook {
  --fa: "\f09a";
}

.fa-github {
  --fa: "\f09b";
}

.fa-pinterest {
  --fa: "\f0d2";
}

.fa-square-pinterest {
  --fa: "\f0d3";
}

.fa-pinterest-square {
  --fa: "\f0d3";
}

.fa-square-google-plus {
  --fa: "\f0d4";
}

.fa-google-plus-square {
  --fa: "\f0d4";
}

.fa-google-plus-g {
  --fa: "\f0d5";
}

.fa-linkedin-in {
  --fa: "\f0e1";
}

.fa-github-alt {
  --fa: "\f113";
}

.fa-maxcdn {
  --fa: "\f136";
}

.fa-html5 {
  --fa: "\f13b";
}

.fa-css3 {
  --fa: "\f13c";
}

.fa-btc {
  --fa: "\f15a";
}

.fa-youtube {
  --fa: "\f167";
}

.fa-xing {
  --fa: "\f168";
}

.fa-square-xing {
  --fa: "\f169";
}

.fa-xing-square {
  --fa: "\f169";
}

.fa-dropbox {
  --fa: "\f16b";
}

.fa-stack-overflow {
  --fa: "\f16c";
}

.fa-instagram {
  --fa: "\f16d";
}

.fa-flickr {
  --fa: "\f16e";
}

.fa-adn {
  --fa: "\f170";
}

.fa-bitbucket {
  --fa: "\f171";
}

.fa-tumblr {
  --fa: "\f173";
}

.fa-square-tumblr {
  --fa: "\f174";
}

.fa-tumblr-square {
  --fa: "\f174";
}

.fa-apple {
  --fa: "\f179";
}

.fa-windows {
  --fa: "\f17a";
}

.fa-android {
  --fa: "\f17b";
}

.fa-linux {
  --fa: "\f17c";
}

.fa-dribbble {
  --fa: "\f17d";
}

.fa-skype {
  --fa: "\f17e";
}

.fa-foursquare {
  --fa: "\f180";
}

.fa-trello {
  --fa: "\f181";
}

.fa-gratipay {
  --fa: "\f184";
}

.fa-vk {
  --fa: "\f189";
}

.fa-weibo {
  --fa: "\f18a";
}

.fa-renren {
  --fa: "\f18b";
}

.fa-pagelines {
  --fa: "\f18c";
}

.fa-stack-exchange {
  --fa: "\f18d";
}

.fa-square-vimeo {
  --fa: "\f194";
}

.fa-vimeo-square {
  --fa: "\f194";
}

.fa-slack {
  --fa: "\f198";
}

.fa-slack-hash {
  --fa: "\f198";
}

.fa-wordpress {
  --fa: "\f19a";
}

.fa-openid {
  --fa: "\f19b";
}

.fa-yahoo {
  --fa: "\f19e";
}

.fa-google {
  --fa: "\f1a0";
}

.fa-reddit {
  --fa: "\f1a1";
}

.fa-square-reddit {
  --fa: "\f1a2";
}

.fa-reddit-square {
  --fa: "\f1a2";
}

.fa-stumbleupon-circle {
  --fa: "\f1a3";
}

.fa-stumbleupon {
  --fa: "\f1a4";
}

.fa-delicious {
  --fa: "\f1a5";
}

.fa-digg {
  --fa: "\f1a6";
}

.fa-pied-piper-pp {
  --fa: "\f1a7";
}

.fa-pied-piper-alt {
  --fa: "\f1a8";
}

.fa-drupal {
  --fa: "\f1a9";
}

.fa-joomla {
  --fa: "\f1aa";
}

.fa-behance {
  --fa: "\f1b4";
}

.fa-square-behance {
  --fa: "\f1b5";
}

.fa-behance-square {
  --fa: "\f1b5";
}

.fa-steam {
  --fa: "\f1b6";
}

.fa-square-steam {
  --fa: "\f1b7";
}

.fa-steam-square {
  --fa: "\f1b7";
}

.fa-spotify {
  --fa: "\f1bc";
}

.fa-deviantart {
  --fa: "\f1bd";
}

.fa-soundcloud {
  --fa: "\f1be";
}

.fa-vine {
  --fa: "\f1ca";
}

.fa-codepen {
  --fa: "\f1cb";
}

.fa-jsfiddle {
  --fa: "\f1cc";
}

.fa-rebel {
  --fa: "\f1d0";
}

.fa-empire {
  --fa: "\f1d1";
}

.fa-square-git {
  --fa: "\f1d2";
}

.fa-git-square {
  --fa: "\f1d2";
}

.fa-git {
  --fa: "\f1d3";
}

.fa-hacker-news {
  --fa: "\f1d4";
}

.fa-tencent-weibo {
  --fa: "\f1d5";
}

.fa-qq {
  --fa: "\f1d6";
}

.fa-weixin {
  --fa: "\f1d7";
}

.fa-slideshare {
  --fa: "\f1e7";
}

.fa-twitch {
  --fa: "\f1e8";
}

.fa-yelp {
  --fa: "\f1e9";
}

.fa-paypal {
  --fa: "\f1ed";
}

.fa-google-wallet {
  --fa: "\f1ee";
}

.fa-cc-visa {
  --fa: "\f1f0";
}

.fa-cc-mastercard {
  --fa: "\f1f1";
}

.fa-cc-discover {
  --fa: "\f1f2";
}

.fa-cc-amex {
  --fa: "\f1f3";
}

.fa-cc-paypal {
  --fa: "\f1f4";
}

.fa-cc-stripe {
  --fa: "\f1f5";
}

.fa-lastfm {
  --fa: "\f202";
}

.fa-square-lastfm {
  --fa: "\f203";
}

.fa-lastfm-square {
  --fa: "\f203";
}

.fa-ioxhost {
  --fa: "\f208";
}

.fa-angellist {
  --fa: "\f209";
}

.fa-buysellads {
  --fa: "\f20d";
}

.fa-connectdevelop {
  --fa: "\f20e";
}

.fa-dashcube {
  --fa: "\f210";
}

.fa-forumbee {
  --fa: "\f211";
}

.fa-leanpub {
  --fa: "\f212";
}

.fa-sellsy {
  --fa: "\f213";
}

.fa-shirtsinbulk {
  --fa: "\f214";
}

.fa-simplybuilt {
  --fa: "\f215";
}

.fa-skyatlas {
  --fa: "\f216";
}

.fa-pinterest-p {
  --fa: "\f231";
}

.fa-whatsapp {
  --fa: "\f232";
}

.fa-viacoin {
  --fa: "\f237";
}

.fa-medium {
  --fa: "\f23a";
}

.fa-medium-m {
  --fa: "\f23a";
}

.fa-y-combinator {
  --fa: "\f23b";
}

.fa-optin-monster {
  --fa: "\f23c";
}

.fa-opencart {
  --fa: "\f23d";
}

.fa-expeditedssl {
  --fa: "\f23e";
}

.fa-cc-jcb {
  --fa: "\f24b";
}

.fa-cc-diners-club {
  --fa: "\f24c";
}

.fa-creative-commons {
  --fa: "\f25e";
}

.fa-gg {
  --fa: "\f260";
}

.fa-gg-circle {
  --fa: "\f261";
}

.fa-odnoklassniki {
  --fa: "\f263";
}

.fa-square-odnoklassniki {
  --fa: "\f264";
}

.fa-odnoklassniki-square {
  --fa: "\f264";
}

.fa-get-pocket {
  --fa: "\f265";
}

.fa-wikipedia-w {
  --fa: "\f266";
}

.fa-safari {
  --fa: "\f267";
}

.fa-chrome {
  --fa: "\f268";
}

.fa-firefox {
  --fa: "\f269";
}

.fa-opera {
  --fa: "\f26a";
}

.fa-internet-explorer {
  --fa: "\f26b";
}

.fa-contao {
  --fa: "\f26d";
}

.fa-500px {
  --fa: "\f26e";
}

.fa-amazon {
  --fa: "\f270";
}

.fa-houzz {
  --fa: "\f27c";
}

.fa-vimeo-v {
  --fa: "\f27d";
}

.fa-black-tie {
  --fa: "\f27e";
}

.fa-fonticons {
  --fa: "\f280";
}

.fa-reddit-alien {
  --fa: "\f281";
}

.fa-edge {
  --fa: "\f282";
}

.fa-codiepie {
  --fa: "\f284";
}

.fa-modx {
  --fa: "\f285";
}

.fa-fort-awesome {
  --fa: "\f286";
}

.fa-usb {
  --fa: "\f287";
}

.fa-product-hunt {
  --fa: "\f288";
}

.fa-mixcloud {
  --fa: "\f289";
}

.fa-scribd {
  --fa: "\f28a";
}

.fa-bluetooth {
  --fa: "\f293";
}

.fa-bluetooth-b {
  --fa: "\f294";
}

.fa-gitlab {
  --fa: "\f296";
}

.fa-wpbeginner {
  --fa: "\f297";
}

.fa-wpforms {
  --fa: "\f298";
}

.fa-envira {
  --fa: "\f299";
}

.fa-glide {
  --fa: "\f2a5";
}

.fa-glide-g {
  --fa: "\f2a6";
}

.fa-viadeo {
  --fa: "\f2a9";
}

.fa-square-viadeo {
  --fa: "\f2aa";
}

.fa-viadeo-square {
  --fa: "\f2aa";
}

.fa-snapchat {
  --fa: "\f2ab";
}

.fa-snapchat-ghost {
  --fa: "\f2ab";
}

.fa-square-snapchat {
  --fa: "\f2ad";
}

.fa-snapchat-square {
  --fa: "\f2ad";
}

.fa-pied-piper {
  --fa: "\f2ae";
}

.fa-first-order {
  --fa: "\f2b0";
}

.fa-yoast {
  --fa: "\f2b1";
}

.fa-themeisle {
  --fa: "\f2b2";
}

.fa-google-plus {
  --fa: "\f2b3";
}

.fa-font-awesome {
  --fa: "\f2b4";
}

.fa-font-awesome-flag {
  --fa: "\f2b4";
}

.fa-font-awesome-logo-full {
  --fa: "\f2b4";
}

.fa-linode {
  --fa: "\f2b8";
}

.fa-quora {
  --fa: "\f2c4";
}

.fa-free-code-camp {
  --fa: "\f2c5";
}

.fa-telegram {
  --fa: "\f2c6";
}

.fa-telegram-plane {
  --fa: "\f2c6";
}

.fa-bandcamp {
  --fa: "\f2d5";
}

.fa-grav {
  --fa: "\f2d6";
}

.fa-etsy {
  --fa: "\f2d7";
}

.fa-imdb {
  --fa: "\f2d8";
}

.fa-ravelry {
  --fa: "\f2d9";
}

.fa-sellcast {
  --fa: "\f2da";
}

.fa-superpowers {
  --fa: "\f2dd";
}

.fa-wpexplorer {
  --fa: "\f2de";
}

.fa-meetup {
  --fa: "\f2e0";
}

.fa-square-font-awesome-stroke {
  --fa: "\f35c";
}

.fa-font-awesome-alt {
  --fa: "\f35c";
}

.fa-accessible-icon {
  --fa: "\f368";
}

.fa-accusoft {
  --fa: "\f369";
}

.fa-adversal {
  --fa: "\f36a";
}

.fa-affiliatetheme {
  --fa: "\f36b";
}

.fa-algolia {
  --fa: "\f36c";
}

.fa-amilia {
  --fa: "\f36d";
}

.fa-angrycreative {
  --fa: "\f36e";
}

.fa-app-store {
  --fa: "\f36f";
}

.fa-app-store-ios {
  --fa: "\f370";
}

.fa-apper {
  --fa: "\f371";
}

.fa-asymmetrik {
  --fa: "\f372";
}

.fa-audible {
  --fa: "\f373";
}

.fa-avianex {
  --fa: "\f374";
}

.fa-aws {
  --fa: "\f375";
}

.fa-bimobject {
  --fa: "\f378";
}

.fa-bitcoin {
  --fa: "\f379";
}

.fa-bity {
  --fa: "\f37a";
}

.fa-blackberry {
  --fa: "\f37b";
}

.fa-blogger {
  --fa: "\f37c";
}

.fa-blogger-b {
  --fa: "\f37d";
}

.fa-buromobelexperte {
  --fa: "\f37f";
}

.fa-centercode {
  --fa: "\f380";
}

.fa-cloudscale {
  --fa: "\f383";
}

.fa-cloudsmith {
  --fa: "\f384";
}

.fa-cloudversify {
  --fa: "\f385";
}

.fa-cpanel {
  --fa: "\f388";
}

.fa-css3-alt {
  --fa: "\f38b";
}

.fa-cuttlefish {
  --fa: "\f38c";
}

.fa-d-and-d {
  --fa: "\f38d";
}

.fa-deploydog {
  --fa: "\f38e";
}

.fa-deskpro {
  --fa: "\f38f";
}

.fa-digital-ocean {
  --fa: "\f391";
}

.fa-discord {
  --fa: "\f392";
}

.fa-discourse {
  --fa: "\f393";
}

.fa-dochub {
  --fa: "\f394";
}

.fa-docker {
  --fa: "\f395";
}

.fa-draft2digital {
  --fa: "\f396";
}

.fa-square-dribbble {
  --fa: "\f397";
}

.fa-dribbble-square {
  --fa: "\f397";
}

.fa-dyalog {
  --fa: "\f399";
}

.fa-earlybirds {
  --fa: "\f39a";
}

.fa-erlang {
  --fa: "\f39d";
}

.fa-facebook-f {
  --fa: "\f39e";
}

.fa-facebook-messenger {
  --fa: "\f39f";
}

.fa-firstdraft {
  --fa: "\f3a1";
}

.fa-fonticons-fi {
  --fa: "\f3a2";
}

.fa-fort-awesome-alt {
  --fa: "\f3a3";
}

.fa-freebsd {
  --fa: "\f3a4";
}

.fa-gitkraken {
  --fa: "\f3a6";
}

.fa-gofore {
  --fa: "\f3a7";
}

.fa-goodreads {
  --fa: "\f3a8";
}

.fa-goodreads-g {
  --fa: "\f3a9";
}

.fa-google-drive {
  --fa: "\f3aa";
}

.fa-google-play {
  --fa: "\f3ab";
}

.fa-gripfire {
  --fa: "\f3ac";
}

.fa-grunt {
  --fa: "\f3ad";
}

.fa-gulp {
  --fa: "\f3ae";
}

.fa-square-hacker-news {
  --fa: "\f3af";
}

.fa-hacker-news-square {
  --fa: "\f3af";
}

.fa-hire-a-helper {
  --fa: "\f3b0";
}

.fa-hotjar {
  --fa: "\f3b1";
}

.fa-hubspot {
  --fa: "\f3b2";
}

.fa-itunes {
  --fa: "\f3b4";
}

.fa-itunes-note {
  --fa: "\f3b5";
}

.fa-jenkins {
  --fa: "\f3b6";
}

.fa-joget {
  --fa: "\f3b7";
}

.fa-js {
  --fa: "\f3b8";
}

.fa-square-js {
  --fa: "\f3b9";
}

.fa-js-square {
  --fa: "\f3b9";
}

.fa-keycdn {
  --fa: "\f3ba";
}

.fa-kickstarter {
  --fa: "\f3bb";
}

.fa-square-kickstarter {
  --fa: "\f3bb";
}

.fa-kickstarter-k {
  --fa: "\f3bc";
}

.fa-laravel {
  --fa: "\f3bd";
}

.fa-line {
  --fa: "\f3c0";
}

.fa-lyft {
  --fa: "\f3c3";
}

.fa-magento {
  --fa: "\f3c4";
}

.fa-medapps {
  --fa: "\f3c6";
}

.fa-medrt {
  --fa: "\f3c8";
}

.fa-microsoft {
  --fa: "\f3ca";
}

.fa-mix {
  --fa: "\f3cb";
}

.fa-mizuni {
  --fa: "\f3cc";
}

.fa-monero {
  --fa: "\f3d0";
}

.fa-napster {
  --fa: "\f3d2";
}

.fa-node-js {
  --fa: "\f3d3";
}

.fa-npm {
  --fa: "\f3d4";
}

.fa-ns8 {
  --fa: "\f3d5";
}

.fa-nutritionix {
  --fa: "\f3d6";
}

.fa-page4 {
  --fa: "\f3d7";
}

.fa-palfed {
  --fa: "\f3d8";
}

.fa-patreon {
  --fa: "\f3d9";
}

.fa-periscope {
  --fa: "\f3da";
}

.fa-phabricator {
  --fa: "\f3db";
}

.fa-phoenix-framework {
  --fa: "\f3dc";
}

.fa-playstation {
  --fa: "\f3df";
}

.fa-pushed {
  --fa: "\f3e1";
}

.fa-python {
  --fa: "\f3e2";
}

.fa-red-river {
  --fa: "\f3e3";
}

.fa-wpressr {
  --fa: "\f3e4";
}

.fa-rendact {
  --fa: "\f3e4";
}

.fa-replyd {
  --fa: "\f3e6";
}

.fa-resolving {
  --fa: "\f3e7";
}

.fa-rocketchat {
  --fa: "\f3e8";
}

.fa-rockrms {
  --fa: "\f3e9";
}

.fa-schlix {
  --fa: "\f3ea";
}

.fa-searchengin {
  --fa: "\f3eb";
}

.fa-servicestack {
  --fa: "\f3ec";
}

.fa-sistrix {
  --fa: "\f3ee";
}

.fa-speakap {
  --fa: "\f3f3";
}

.fa-staylinked {
  --fa: "\f3f5";
}

.fa-steam-symbol {
  --fa: "\f3f6";
}

.fa-sticker-mule {
  --fa: "\f3f7";
}

.fa-studiovinari {
  --fa: "\f3f8";
}

.fa-supple {
  --fa: "\f3f9";
}

.fa-uber {
  --fa: "\f402";
}

.fa-uikit {
  --fa: "\f403";
}

.fa-uniregistry {
  --fa: "\f404";
}

.fa-untappd {
  --fa: "\f405";
}

.fa-ussunnah {
  --fa: "\f407";
}

.fa-vaadin {
  --fa: "\f408";
}

.fa-viber {
  --fa: "\f409";
}

.fa-vimeo {
  --fa: "\f40a";
}

.fa-vnv {
  --fa: "\f40b";
}

.fa-square-whatsapp {
  --fa: "\f40c";
}

.fa-whatsapp-square {
  --fa: "\f40c";
}

.fa-whmcs {
  --fa: "\f40d";
}

.fa-wordpress-simple {
  --fa: "\f411";
}

.fa-xbox {
  --fa: "\f412";
}

.fa-yandex {
  --fa: "\f413";
}

.fa-yandex-international {
  --fa: "\f414";
}

.fa-apple-pay {
  --fa: "\f415";
}

.fa-cc-apple-pay {
  --fa: "\f416";
}

.fa-fly {
  --fa: "\f417";
}

.fa-node {
  --fa: "\f419";
}

.fa-osi {
  --fa: "\f41a";
}

.fa-react {
  --fa: "\f41b";
}

.fa-autoprefixer {
  --fa: "\f41c";
}

.fa-less {
  --fa: "\f41d";
}

.fa-sass {
  --fa: "\f41e";
}

.fa-vuejs {
  --fa: "\f41f";
}

.fa-angular {
  --fa: "\f420";
}

.fa-aviato {
  --fa: "\f421";
}

.fa-ember {
  --fa: "\f423";
}

.fa-gitter {
  --fa: "\f426";
}

.fa-hooli {
  --fa: "\f427";
}

.fa-strava {
  --fa: "\f428";
}

.fa-stripe {
  --fa: "\f429";
}

.fa-stripe-s {
  --fa: "\f42a";
}

.fa-typo3 {
  --fa: "\f42b";
}

.fa-amazon-pay {
  --fa: "\f42c";
}

.fa-cc-amazon-pay {
  --fa: "\f42d";
}

.fa-ethereum {
  --fa: "\f42e";
}

.fa-korvue {
  --fa: "\f42f";
}

.fa-elementor {
  --fa: "\f430";
}

.fa-square-youtube {
  --fa: "\f431";
}

.fa-youtube-square {
  --fa: "\f431";
}

.fa-flipboard {
  --fa: "\f44d";
}

.fa-hips {
  --fa: "\f452";
}

.fa-php {
  --fa: "\f457";
}

.fa-quinscape {
  --fa: "\f459";
}

.fa-readme {
  --fa: "\f4d5";
}

.fa-java {
  --fa: "\f4e4";
}

.fa-pied-piper-hat {
  --fa: "\f4e5";
}

.fa-creative-commons-by {
  --fa: "\f4e7";
}

.fa-creative-commons-nc {
  --fa: "\f4e8";
}

.fa-creative-commons-nc-eu {
  --fa: "\f4e9";
}

.fa-creative-commons-nc-jp {
  --fa: "\f4ea";
}

.fa-creative-commons-nd {
  --fa: "\f4eb";
}

.fa-creative-commons-pd {
  --fa: "\f4ec";
}

.fa-creative-commons-pd-alt {
  --fa: "\f4ed";
}

.fa-creative-commons-remix {
  --fa: "\f4ee";
}

.fa-creative-commons-sa {
  --fa: "\f4ef";
}

.fa-creative-commons-sampling {
  --fa: "\f4f0";
}

.fa-creative-commons-sampling-plus {
  --fa: "\f4f1";
}

.fa-creative-commons-share {
  --fa: "\f4f2";
}

.fa-creative-commons-zero {
  --fa: "\f4f3";
}

.fa-ebay {
  --fa: "\f4f4";
}

.fa-keybase {
  --fa: "\f4f5";
}

.fa-mastodon {
  --fa: "\f4f6";
}

.fa-r-project {
  --fa: "\f4f7";
}

.fa-researchgate {
  --fa: "\f4f8";
}

.fa-teamspeak {
  --fa: "\f4f9";
}

.fa-first-order-alt {
  --fa: "\f50a";
}

.fa-fulcrum {
  --fa: "\f50b";
}

.fa-galactic-republic {
  --fa: "\f50c";
}

.fa-galactic-senate {
  --fa: "\f50d";
}

.fa-jedi-order {
  --fa: "\f50e";
}

.fa-mandalorian {
  --fa: "\f50f";
}

.fa-old-republic {
  --fa: "\f510";
}

.fa-phoenix-squadron {
  --fa: "\f511";
}

.fa-sith {
  --fa: "\f512";
}

.fa-trade-federation {
  --fa: "\f513";
}

.fa-wolf-pack-battalion {
  --fa: "\f514";
}

.fa-hornbill {
  --fa: "\f592";
}

.fa-mailchimp {
  --fa: "\f59e";
}

.fa-megaport {
  --fa: "\f5a3";
}

.fa-nimblr {
  --fa: "\f5a8";
}

.fa-rev {
  --fa: "\f5b2";
}

.fa-shopware {
  --fa: "\f5b5";
}

.fa-squarespace {
  --fa: "\f5be";
}

.fa-themeco {
  --fa: "\f5c6";
}

.fa-weebly {
  --fa: "\f5cc";
}

.fa-wix {
  --fa: "\f5cf";
}

.fa-ello {
  --fa: "\f5f1";
}

.fa-hackerrank {
  --fa: "\f5f7";
}

.fa-kaggle {
  --fa: "\f5fa";
}

.fa-markdown {
  --fa: "\f60f";
}

.fa-neos {
  --fa: "\f612";
}

.fa-zhihu {
  --fa: "\f63f";
}

.fa-alipay {
  --fa: "\f642";
}

.fa-the-red-yeti {
  --fa: "\f69d";
}

.fa-critical-role {
  --fa: "\f6c9";
}

.fa-d-and-d-beyond {
  --fa: "\f6ca";
}

.fa-dev {
  --fa: "\f6cc";
}

.fa-fantasy-flight-games {
  --fa: "\f6dc";
}

.fa-wizards-of-the-coast {
  --fa: "\f730";
}

.fa-think-peaks {
  --fa: "\f731";
}

.fa-reacteurope {
  --fa: "\f75d";
}

.fa-artstation {
  --fa: "\f77a";
}

.fa-atlassian {
  --fa: "\f77b";
}

.fa-canadian-maple-leaf {
  --fa: "\f785";
}

.fa-centos {
  --fa: "\f789";
}

.fa-confluence {
  --fa: "\f78d";
}

.fa-dhl {
  --fa: "\f790";
}

.fa-diaspora {
  --fa: "\f791";
}

.fa-fedex {
  --fa: "\f797";
}

.fa-fedora {
  --fa: "\f798";
}

.fa-figma {
  --fa: "\f799";
}

.fa-intercom {
  --fa: "\f7af";
}

.fa-invision {
  --fa: "\f7b0";
}

.fa-jira {
  --fa: "\f7b1";
}

.fa-mendeley {
  --fa: "\f7b3";
}

.fa-raspberry-pi {
  --fa: "\f7bb";
}

.fa-redhat {
  --fa: "\f7bc";
}

.fa-sketch {
  --fa: "\f7c6";
}

.fa-sourcetree {
  --fa: "\f7d3";
}

.fa-suse {
  --fa: "\f7d6";
}

.fa-ubuntu {
  --fa: "\f7df";
}

.fa-ups {
  --fa: "\f7e0";
}

.fa-usps {
  --fa: "\f7e1";
}

.fa-yarn {
  --fa: "\f7e3";
}

.fa-airbnb {
  --fa: "\f834";
}

.fa-battle-net {
  --fa: "\f835";
}

.fa-bootstrap {
  --fa: "\f836";
}

.fa-buffer {
  --fa: "\f837";
}

.fa-chromecast {
  --fa: "\f838";
}

.fa-evernote {
  --fa: "\f839";
}

.fa-itch-io {
  --fa: "\f83a";
}

.fa-salesforce {
  --fa: "\f83b";
}

.fa-speaker-deck {
  --fa: "\f83c";
}

.fa-symfony {
  --fa: "\f83d";
}

.fa-waze {
  --fa: "\f83f";
}

.fa-yammer {
  --fa: "\f840";
}

.fa-git-alt {
  --fa: "\f841";
}

.fa-stackpath {
  --fa: "\f842";
}

.fa-cotton-bureau {
  --fa: "\f89e";
}

.fa-buy-n-large {
  --fa: "\f8a6";
}

.fa-mdb {
  --fa: "\f8ca";
}

.fa-orcid {
  --fa: "\f8d2";
}

.fa-swift {
  --fa: "\f8e1";
}

.fa-umbraco {
  --fa: "\f8e8";
}

/*!
 * Font Awesome Free 7.2.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2026 Fonticons, Inc.
 */
:root, :host {
  --fa-family-classic: 'Font Awesome 7 Free';
  --fa-font-regular: normal 400 1em/1 var(--fa-family-classic);
  /* deprecated: this older custom property will be removed next major release */
  --fa-style-family-classic: var(--fa-family-classic);
}

@font-face {
  font-family: "Font Awesome 7 Free";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("../webfonts/fa-regular-400.woff2");
}
.far {
  --fa-family: var(--fa-family-classic);
  --fa-style: 400;
}

.fa-classic {
  --fa-family: var(--fa-family-classic);
}

.fa-regular {
  --fa-style: 400;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  color: var(--color-contrast-high);
  font-family: var(--font-primary);
  font-size: var(--text-base);
  line-height: 1.4;
}

h1, h2, h3, h4 {
  color: var(--color-contrast-higher);
  line-height: 1.2;
  font-weight: 700;
}

h1 {
  font-size: var(--text-2xl);
}

h2 {
  font-size: var(--text-xl);
}

h3 {
  font-size: var(--text-lg);
}

h4 {
  font-size: var(--text-md);
}

small {
  font-size: var(--text-sm);
}

.link {
  text-decoration: none;
  background-image: linear-gradient(to right, currentColor 50%, hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2) 50%);
  background-size: 200% 1px;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  transition: background-position 0.2s;
}
.link.color-accent {
  background-image: linear-gradient(to right, currentColor 50%, hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), 0.2) 50%);
}
.link.color-contrast-higher {
  background-image: linear-gradient(to right, currentColor 50%, hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.2) 50%);
}
.link.color-bg {
  background-image: linear-gradient(to right, currentColor 50%, hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), 0.2) 50%);
}
.link.color-white {
  background-image: linear-gradient(to right, currentColor 50%, hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.2) 50%);
}
.link.color-black {
  background-image: linear-gradient(to right, currentColor 50%, hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2) 50%);
}
.link:hover {
  background-position: 0% 100%;
}

/* text-component */
.text-component {
  --heading-line-height: 1.2;
  --body-line-height: 1.4;
  --spacing: 1rem;
  line-height: var(--body-line-height);
}
.text-component > * {
  margin-bottom: var(--spacing);
}
.text-component :where(h1, h2, h3, h4) {
  margin-top: calc(var(--spacing) * 1.6666666667);
  line-height: var(--heading-line-height);
}
.text-component :where(ul, ol) {
  padding-left: 1.25em;
}
.text-component ul :where(ul, ol),
.text-component ol :where(ul, ol) {
  padding-left: 1em;
}
.text-component :where(ul) {
  list-style-type: disc;
}
.text-component :where(ol) {
  list-style-type: decimal;
}
.text-component ul li::marker,
.text-component ol li::marker {
  color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.25);
}
.text-component :where(img) {
  margin: 0 auto;
  border-radius: var(--radius-md);
}
.text-component :where(figcaption) {
  margin-top: calc(var(--spacing) / 2);
  font-size: var(--text-sm);
  color: var(--color-contrast-low);
  text-align: center;
}
.text-component em {
  font-style: italic;
}
.text-component strong {
  font-weight: bold;
}
.text-component s {
  text-decoration: line-through;
}
.text-component u {
  text-decoration: underline;
}
.text-component :where(mark) {
  background-color: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), 0.2);
  color: inherit;
  border-radius: var(--radius-md);
  padding: 0 0.25em;
}
.text-component :where(blockquote) {
  padding-left: 1em;
  border-left: 3px solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.25);
  font-style: italic;
}
.text-component :where(hr) {
  margin: calc(var(--spacing) * 1.6666666667) 0;
  background: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
  height: 1px;
}
.text-component > *:first-child {
  margin-top: 0;
}
.text-component > *:last-child {
  margin-bottom: 0;
}

/* overflow items */
:where(.text-component__item-full-width, .text-component__item-overflow, .text-component__item-overflow-left, .text-component__item-overflow-right, .text-component__item-left, .text-component__item-right) img {
  width: 100%;
}

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

@media (min-width: 48rem) {
  .text-component__item-left,
  .text-component__item-right,
  .text-component__item-overflow-left,
  .text-component__item-overflow-right {
    width: 45%;
  }
  .text-component__item-left,
  .text-component__item-overflow-left {
    float: left;
    margin-right: var(--spacing);
  }
  .text-component__item-right,
  .text-component__item-overflow-right {
    float: right;
    margin-left: var(--spacing);
  }
}
@media (min-width: 80rem) {
  .text-component__item-overflow,
  .text-component__item-overflow-left,
  .text-component__item-overflow-right {
    --overflow-size: 8rem;
  }
  .text-component__item-overflow {
    width: calc(100% + var(--overflow-size) * 2);
    margin-left: calc(var(--overflow-size) * -1);
  }
  .text-component__item-overflow-left {
    margin-left: calc(var(--overflow-size) * -1);
  }
  .text-component__item-overflow-right {
    margin-right: calc(var(--overflow-size) * -1);
  }
}
/* spacing variations */
.text-component--tight {
  --heading-line-height: 1.1;
  --body-line-height: 1.2;
  --spacing: 0.625rem;
}

.text-component--relaxed {
  --heading-line-height: 1.25;
  --body-line-height: 1.625;
  --spacing: clamp(1.25rem, calc(0.875rem + 0.78125vw), 1.5rem);
}

.btn {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  text-decoration: none;
  background: var(--color-bg-dark);
  padding: var(--space-2xs) var(--space-sm);
  border-radius: var(--radius-md);
  font-size: 1em;
  font-weight: 500;
  color: var(--color-contrast-higher);
  line-height: 1.2;
  cursor: pointer;
  transition: 0.2s;
  will-change: transform;
}
.btn:focus-visible {
  outline: none;
  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), 0.15);
}
.btn:active {
  transform: translateY(2px);
}

/* primary */
.btn--primary {
  background: var(--color-primary);
  box-shadow: inset 0 1px 0 hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.15), 0 1px 3px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.25), 0 2px 6px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.1), 0 6px 10px -2px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.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), 0.15), 0 1px 2px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.25), 0 1px 4px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.1), 0 3px 6px -2px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.25);
}
.btn--primary:focus-visible {
  box-shadow: inset 0 1px 0 hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.15), 0 1px 2px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.25), 0 1px 4px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.1), 0 3px 6px -2px hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), 0.25), 0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-primary);
}

/* subtle */
.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), 0.1), 0 0 0 1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.02), 0 0.3px 0.4px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.025), 0 1px 3px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2), 0 3.5px 6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.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), 0.1), 0 0 0 1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.02), 0 0.1px 0.3px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.06), 0 1px 2px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.12), 0 1px 3px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2);
}
.btn--subtle:focus-visible {
  box-shadow: inset 0 1px 0 hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.1), 0 0 0 1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.02), 0 0.3px 0.4px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.025), 0 1px 3px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2), 0 3.5px 6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.12), 0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-contrast-high);
}

/* accent */
.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), 0.15), 0 1px 3px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.25), 0 2px 6px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.1), 0 6px 10px -2px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.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), 0.15), 0 1px 2px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.25), 0 1px 4px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.1), 0 3px 6px -2px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.1);
}
.btn--accent:focus-visible {
  box-shadow: inset 0 1px 0 hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.15), 0 1px 2px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.25), 0 1px 4px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.1), 0 3px 6px -2px hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), 0.1), 0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-accent);
}

/* contrast */
.btn--contrast {
  background: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.95);
  color: var(--color-bg);
  box-shadow: 0 0.1px 0.3px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.06), 0 1px 2px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.12);
}
.btn--contrast:hover {
  background: var(--color-contrast-higher);
}
.btn--contrast:focus-visible {
  box-shadow: 0 0.1px 0.3px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.06), 0 1px 2px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.12), 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), 0.95);
}

/* primary subtle */
.btn--primary-subtle {
  background: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.15);
  color: var(--color-primary);
}
.btn--primary-subtle:hover {
  background: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.12);
}
.btn--primary-subtle:focus-visible {
  box-shadow: 0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-primary);
}

/* accent subtle */
.btn--accent-subtle {
  background: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), 0.15);
  color: var(--color-accent);
}
.btn--accent-subtle:hover {
  background: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), 0.12);
}
.btn--accent-subtle:focus-visible {
  box-shadow: 0 0 0 2px var(--color-bg), 0 0 0 4px var(--color-accent);
}

/* feedback */
.btn--disabled, .btn[disabled], .btn[readonly] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* a button containing (only) an icon */
.btn--icon {
  padding: var(--space-2xs);
}

.form-control {
  background: var(--color-bg-dark);
  box-shadow: inset 0 0 0 1px var(--color-contrast-lower);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius-md);
  font-size: 1em;
  line-height: 1.2;
  transition: 0.2s;
}
.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);
  outline: none;
  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);
}

/* disabled */
.form-control--disabled,
.form-control[disabled],
.form-control[readonly] {
  opacity: 0.5;
  cursor: not-allowed;
}

/* error */
.form-control[aria-invalid=true],
.form-control.form-control--error {
  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[aria-invalid=true]:focus, .form-control[aria-invalid=true]:focus-within,
.form-control.form-control--error:focus,
.form-control.form-control--error: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);
}

/* legend */
.form-legend {
  font-weight: 700;
  color: var(--color-contrast-higher);
  line-height: 1.2;
  font-size: var(--text-md);
  margin-bottom: var(--space-md);
}

/* label */
.form-label {
  display: inline-block;
  font-size: var(--text-sm);
  margin-bottom: var(--space-3xs);
}

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

File#: _1_az-accordion
Title: az-accordion
Descr: Create stacked sections of content and allow the user to expand/collapse them
Usage: codyhouse.co/license

-------------------------------- */
:root {
  /* general */
  --az-accordion-border-width: 1px;
  /* icon */
  --az-accordion-icon-size: 20px;
  --az-accordion-icon-stroke-width: 2px;
}

.az-accordion__header {
  /* button */
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  cursor: pointer;
}
.az-accordion__header .icon {
  --size: var(--az-accordion-icon-size);
}
.az-accordion__header .icon .icon__group {
  stroke-width: var(--az-accordion-icon-stroke-width);
}

.az-accordion__icon-arrow .icon__group,
.az-accordion__icon-arrow-v2 .icon__group,
.az-accordion__icon-plus .icon__group {
  will-change: transform;
  transform-origin: 50% 50%;
}

.az-accordion__icon-arrow .icon__group > * {
  transform-origin: 10px 14px;
}

.az-accordion__icon-arrow-v2 .icon__group > * {
  transform-origin: 50% 50%;
  stroke-dasharray: 20;
  transform: translateY(4px);
}
.az-accordion__icon-arrow-v2 .icon__group > *:first-child {
  stroke-dashoffset: 10.15;
}
.az-accordion__icon-arrow-v2 .icon__group > *:last-child {
  stroke-dashoffset: 10.15;
}

.az-accordion__icon-plus .icon__group {
  transform: rotate(-90deg);
}
.az-accordion__icon-plus .icon__group > * {
  transform-origin: 50% 50%;
}
.az-accordion__icon-plus .icon__group > *:first-child {
  transform: rotate(-90deg);
}

.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-arrow .icon__group {
  /* animated arrow icon */
}
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-arrow .icon__group > *:first-child {
  transform: translateY(-8px) rotate(-90deg);
}
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-arrow .icon__group > *:last-child {
  transform: translateY(-8px) rotate(90deg);
}
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-arrow-v2 .icon__group {
  /* animated arrow icon v2 */
  transform: rotate(-90deg);
}
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-arrow-v2 .icon__group > *:first-child,
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-arrow-v2 .icon__group *:last-child {
  stroke-dashoffset: 0;
  transform: translateY(0px);
}
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-plus .icon__group {
  /* animated plus icon */
  transform: rotate(0);
}
.az-accordion__item--is-open > .az-accordion__header > .az-accordion__icon-plus .icon__group > *:first-child {
  transform: rotate(0);
}

.az-accordion__panel {
  display: none;
  will-change: height;
  transform: translateZ(0px);
}

.az-accordion__item--is-open > .az-accordion__panel {
  display: block;
}

/* animations */
.az-accordion[data-animation=on] .az-accordion__item--is-open .az-accordion__panel > * {
  animation: az-accordion-entry-animation 0.4s var(--ease-out);
}
.az-accordion[data-animation=on] .az-accordion__icon-arrow .icon__group,
.az-accordion[data-animation=on] .az-accordion__icon-arrow-v2 .icon__group,
.az-accordion[data-animation=on] .az-accordion__icon-plus .icon__group {
  transition: transform 0.3s var(--ease-out);
}
.az-accordion[data-animation=on] .az-accordion__icon-arrow .icon__group > *,
.az-accordion[data-animation=on] .az-accordion__icon-arrow-v2 .icon__group > *,
.az-accordion[data-animation=on] .az-accordion__icon-plus .icon__group > * {
  transition: transform 0.3s, stroke-dashoffset 0.3s;
  transition-timing-function: var(--ease-out);
}

@keyframes az-accordion-entry-animation {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/* -------------------------------- 

File#: _1_az-accordion-sidebar-list
Title: Accordion sidebar List
Descr: Custom list component
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --sidebar-list-space-y: 0.9em;
  --sidebar-list-offset: 1em;
  --sidebar-list-line-height-multiplier: 1;
}

.sidebar-list,
.text-component .sidebar-list {
  padding-left: 0;
  list-style: none;
}
.sidebar-list ul,
.sidebar-list ol,
.text-component .sidebar-list ul,
.text-component .sidebar-list ol {
  list-style: none;
  margin: 0;
  margin-top: calc(var(--sidebar-list-space-y) / 2);
  padding-top: calc(var(--sidebar-list-space-y) / 2);
  padding-left: var(--sidebar-list-offset);
}
.sidebar-list li,
.text-component .sidebar-list li {
  padding-bottom: calc(var(--sidebar-list-space-y) / 2);
  margin-bottom: calc(var(--sidebar-list-space-y) / 2);
  line-height: calc(1.4 * var(--sidebar-list-line-height-multiplier));
}
.sidebar-list > li:last-child,
.sidebar-list ul > li:last-child,
.sidebar-list ol > li:last-child,
.text-component .sidebar-list > li:last-child,
.text-component .sidebar-list ul > li:last-child,
.text-component .sidebar-list ol > li:last-child {
  margin-bottom: 0;
}
.sidebar-list:not(.sidebar-list--border) > li:last-child,
.sidebar-list ul > li:last-child,
.sidebar-list ol > li:last-child,
.text-component .sidebar-list:not(.sidebar-list--border) > li:last-child,
.text-component .sidebar-list ul > li:last-child,
.text-component .sidebar-list ol > li:last-child {
  padding-bottom: 0;
}

/* #region (ul + ol) */
.sidebar-list--ul,
.text-component .sidebar-list--ul,
.sidebar-list--ol,
.text-component .sidebar-list--ol {
  --sidebar-list-offset: calc(var(--sidebar-list-bullet-size) + var(--sidebar-list-bullet-margin-right));
}
.sidebar-list--ul ul,
.sidebar-list--ul ol,
.text-component .sidebar-list--ul ul,
.text-component .sidebar-list--ul ol,
.sidebar-list--ol ul,
.sidebar-list--ol ol,
.text-component .sidebar-list--ol ul,
.text-component .sidebar-list--ol ol {
  padding-left: 0;
}
@supports (--css: variables) {
  .sidebar-list--ul li,
  .text-component .sidebar-list--ul li,
  .sidebar-list--ol li,
  .text-component .sidebar-list--ol li {
    padding-left: var(--sidebar-list-offset) !important;
  }
}
.sidebar-list--ul li::before,
.text-component .sidebar-list--ul li::before,
.sidebar-list--ol li::before,
.text-component .sidebar-list--ol li::before {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  position: relative;
  top: -0.1em;
}
@supports (--css: variables) {
  .sidebar-list--ul li::before,
  .text-component .sidebar-list--ul li::before,
  .sidebar-list--ol li::before,
  .text-component .sidebar-list--ol li::before {
    width: var(--sidebar-list-bullet-size) !important;
    height: var(--sidebar-list-bullet-size) !important;
    margin-left: calc(var(--sidebar-list-bullet-size) * -1) !important;
    left: calc(var(--sidebar-list-bullet-margin-right) * -1) !important;
  }
}

.sidebar-list--ul,
.text-component .sidebar-list--ul {
  --sidebar-list-bullet-size: 7px;
  --sidebar-list-bullet-margin-right: 12px;
}
.sidebar-list--ul > li,
.text-component .sidebar-list--ul > li {
  padding-left: 19px;
}
.sidebar-list--ul > li::before,
.text-component .sidebar-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;
}
.sidebar-list--ul ul li::before,
.text-component .sidebar-list--ul ul li::before {
  background-color: transparent;
  box-shadow: inset 0 0 0 2px currentColor;
}

.sidebar-list--ol,
.text-component .sidebar-list--ol {
  --sidebar-list-bullet-size: 26px;
  --sidebar-list-bullet-margin-right: 6px;
  --sidebar-list-bullet-font-size: 14px;
  counter-reset: list-items;
}
.sidebar-list--ol > li,
.text-component .sidebar-list--ol > li {
  counter-increment: list-items;
  padding-left: 32px;
}
.sidebar-list--ol ol,
.text-component .sidebar-list--ol ol {
  counter-reset: list-items;
}
.sidebar-list--ol > li::before,
.text-component .sidebar-list--ol > li::before {
  content: counter(list-items);
  font-size: var(--sidebar-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;
}
.sidebar-list--ol ol > li::before,
.text-component .sidebar-list--ol ol > li::before {
  background-color: transparent;
  box-shadow: inset 0 0 0 2px var(--color-contrast-lower);
}

/* #endregion */
/* #region (border) */
.sidebar-list--border li:not(:last-child),
.text-component .sidebar-list--border li:not(:last-child) {
  border-bottom: 1px solid var(--color-contrast-lower);
}
.sidebar-list--border ul,
.sidebar-list--border ol,
.text-component .sidebar-list--border ul,
.text-component .sidebar-list--border ol {
  border-top: 1px solid var(--color-contrast-lower);
}

/* #endregion */
/* #region (icons) */
.sidebar-list--icons,
.text-component .sidebar-list--icons {
  --sidebar-list-bullet-size: 24px;
  --sidebar-list-bullet-margin-right: 8px;
  --sidebar-list-offset: calc(var(--sidebar-list-bullet-size) + var(--sidebar-list-bullet-margin-right));
}
.sidebar-list--icons ul,
.sidebar-list--icons ol,
.text-component .sidebar-list--icons ul,
.text-component .sidebar-list--icons ol {
  padding-left: 32px;
}
@supports (--css: variables) {
  .sidebar-list--icons ul,
  .sidebar-list--icons ol,
  .text-component .sidebar-list--icons ul,
  .text-component .sidebar-list--icons ol {
    padding-left: var(--sidebar-list-offset);
  }
}

.sidebar-list__icon {
  position: relative;
  width: 24px;
  height: 24px;
  margin-right: 8px;
}
.sidebar-list__icon:not(.top-0) {
  top: calc((1.4em - 24px) / 2);
}
@supports (--css: variables) {
  .sidebar-list__icon {
    width: var(--sidebar-list-bullet-size);
    height: var(--sidebar-list-bullet-size);
    margin-right: var(--sidebar-list-bullet-margin-right);
  }
  .sidebar-list__icon:not(.top-0) {
    top: calc((1.4em * var(--sidebar-list-line-height-multiplier) - var(--sidebar-list-bullet-size)) / 2);
  }
}

/* #endregion */
/* -------------------------------- 

File#: _1_az-accordion-content-nav
Title: Accordion
Descr: Create stacked sections of content and allow the user to expand/collapse them
Usage: AZITS

-------------------------------- */
.accordion-content {
  max-height: auto;
  display: none;
  transition: height 0.2s ease-in-out;
}

.accordion-content.is-open {
  max-height: 1000px;
  /* sufficiently large to accommodate content */
}

.accordion-content > div {
  height: auto;
  /* Allow content to expand */
}

.accordion .scroll-trigger {
  position: absolute;
  width: 100%;
  height: 10px;
}

.icon {
  display: inline-block;
  transition: transform 0.3s ease;
}

/* Rotated state (pointing up) */
.icon.is-open {
  transform: rotate(180deg);
}

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

File#: _1_anim-menu-btn
Title: Animated Menu Button
Descr: A menu button w/ a morphing icon
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --anim-menu-btn-size: 48px;
  --anim-menu-btn-transition-duration: .2s;
  --anim-menu-btn-icon-size: 32px;
  --anim-menu-btn-icon-stroke: 2px;
}

.anim-menu-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--anim-menu-btn-size);
  height: var(--anim-menu-btn-size);
}

.anim-menu-btn__icon {
  position: relative;
  display: block;
  font-size: var(--anim-menu-btn-icon-size);
  width: 1em;
  height: var(--anim-menu-btn-icon-stroke);
  color: inherit;
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  transform: scale(1);
}
.anim-menu-btn__icon::before, .anim-menu-btn__icon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-image: inherit;
  border-radius: inherit;
}

.anim-menu-btn__icon--close {
  background-size: 100% 100%;
  will-change: transform, background-size;
  transition-property: transform, background-size;
  transition-duration: var(--anim-menu-btn-transition-duration, 0.2s);
}
.anim-menu-btn:active .anim-menu-btn__icon--close {
  transform: scale(0.9);
}
.anim-menu-btn__icon--close::before, .anim-menu-btn__icon--close::after {
  will-change: inherit;
  transition: inherit;
}
.anim-menu-btn__icon--close::before {
  transform: translateY(-0.25em) rotate(0);
}
.anim-menu-btn__icon--close::after {
  transform: translateY(0.25em) rotate(0);
}

.anim-menu-btn--state-b .anim-menu-btn__icon--close {
  background-size: 0% 100%;
}
.anim-menu-btn--state-b .anim-menu-btn__icon--close::before {
  transform: translateY(0) rotate(45deg);
}
.anim-menu-btn--state-b .anim-menu-btn__icon--close::after {
  transform: translateY(0) rotate(-45deg);
}

.anim-menu-btn__icon--arrow-left,
.anim-menu-btn__icon--arrow-right,
.anim-menu-btn__icon--arrow-up,
.anim-menu-btn__icon--arrow-down {
  border-radius: 50em;
  will-change: transform;
  transition-property: transform;
  transition-duration: var(--anim-menu-btn-transition-duration, 0.2s);
}
.anim-menu-btn:active .anim-menu-btn__icon--arrow-left,
.anim-menu-btn:active .anim-menu-btn__icon--arrow-right,
.anim-menu-btn:active .anim-menu-btn__icon--arrow-up,
.anim-menu-btn:active .anim-menu-btn__icon--arrow-down {
  transform: scale(0.9);
}
.anim-menu-btn__icon--arrow-left::before, .anim-menu-btn__icon--arrow-left::after,
.anim-menu-btn__icon--arrow-right::before,
.anim-menu-btn__icon--arrow-right::after,
.anim-menu-btn__icon--arrow-up::before,
.anim-menu-btn__icon--arrow-up::after,
.anim-menu-btn__icon--arrow-down::before,
.anim-menu-btn__icon--arrow-down::after {
  transform-origin: calc(var(--anim-menu-btn-icon-stroke) / 2) 50%;
  will-change: transform, width;
  transition-property: transform, width;
  transition-duration: var(--anim-menu-btn-transition-duration, 0.2s);
}
.anim-menu-btn__icon--arrow-left::before,
.anim-menu-btn__icon--arrow-right::before,
.anim-menu-btn__icon--arrow-up::before,
.anim-menu-btn__icon--arrow-down::before {
  transform: translateY(-0.25em) rotate(0);
}
.anim-menu-btn__icon--arrow-left::after,
.anim-menu-btn__icon--arrow-right::after,
.anim-menu-btn__icon--arrow-up::after,
.anim-menu-btn__icon--arrow-down::after {
  transform: translateY(0.25em) rotate(0);
}

.anim-menu-btn__icon--arrow-right {
  transform: rotate(180deg);
}
.anim-menu-btn:active .anim-menu-btn__icon--arrow-right {
  transform: rotate(180deg) scale(0.9);
}

.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-left::before, .anim-menu-btn--state-b .anim-menu-btn__icon--arrow-left::after,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-right::before,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-right::after,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-up::before,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-up::after,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-down::before,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-down::after {
  width: 50%;
}
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-left::before,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-right::before,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-up::before,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-down::before {
  transform: translateY(0) rotate(-45deg);
}
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-left::after,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-right::after,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-up::after,
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-down::after {
  transform: translateY(0) rotate(45deg);
}
.anim-menu-btn--state-b:active .anim-menu-btn__icon--arrow-up {
  transform: rotate(90deg) scale(0.9);
}
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-up {
  transform: rotate(90deg);
}
.anim-menu-btn--state-b:active .anim-menu-btn__icon--arrow-down {
  transform: rotate(-90deg) scale(0.9);
}
.anim-menu-btn--state-b .anim-menu-btn__icon--arrow-down {
  transform: rotate(-90deg);
}

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

File#: _1_adaptive-navigation
Title: Adaptive Navigation
Descr: Navigation where the number of visible items changes according to the available space
Usage: codyhouse.co/license

-------------------------------- */
.adapt-nav {
  position: relative;
}

.adapt-nav__list {
  display: flex;
  align-items: center;
}

.adapt-nav__item {
  flex-shrink: 0;
  margin-right: var(--space-xs);
}

.adapt-nav__link {
  display: block;
  color: var(--color-white);
  text-decoration: none;
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius-md);
  transition: 0.2s;
}
.adapt-nav__link:hover {
  background-color: hsla(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l), 0.1);
}
.adapt-nav__link[aria-current=page] {
  color: var(--color-primary);
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
  font-weight: 700;
}

.adapt-nav__item--hidden {
  visibility: hidden;
}

.adapt-nav {
  opacity: 0;
}

.adapt-nav--is-visible {
  opacity: 1;
}

.adapt-nav__item--more {
  position: relative;
  margin-right: 0;
}

.adapt-nav__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.adapt-nav__btn .icon {
  --size: 16px;
  display: block;
}
.adapt-nav__btn:hover, .adapt-nav__item--more[aria-expanded=true] .adapt-nav__btn {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
}
.adapt-nav__btn:active {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.25);
}

.adapt-nav__dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  width: 180px;
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow), var(--shadow-md);
  padding: var(--space-2xs) 0;
  border-radius: var(--radius-md);
  z-index: var(--z-index-popover);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 0.2s, opacity 0.2s;
}

.adapt-nav__dropdown--is-visible {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity 0.2s;
}

.adapt-nav__dropdown-link {
  display: block;
  padding: var(--space-2xs) var(--space-sm);
  text-decoration: none;
  color: var(--color-contrast-high);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: 0.2s;
}
.adapt-nav__dropdown-link:hover {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
}
.adapt-nav__dropdown-link[aria-current=page] {
  color: var(--color-primary);
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
  font-weight: 700;
}

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

File#: _1_article-gallery-v3
Title: Article Gallery v3
Descr: A gallery of blog articles
Usage: codyhouse.co/license

-------------------------------- */
.articles-v3__img {
  display: block;
  transition: opacity 0.3s;
  border-radius: var(--radius-md);
  overflow: hidden;
}
.articles-v3__img img {
  display: block;
  width: 100%;
}
.articles-v3__img:hover {
  opacity: 0.85;
}

.articles-v3__headline {
  font-size: var(--text-md);
}
.articles-v3__headline a {
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.articles-v3__headline a:hover {
  text-decoration: underline;
}

.articles-v3__author {
  display: grid;
  grid-template-columns: 3em 1fr;
  grid-gap: var(--space-xs);
  align-items: center;
  margin-top: var(--space-md);
}

.articles-v3__author-img {
  display: block;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  overflow: hidden;
  transition: transform 0.3s var(--ease-out-back);
}
.articles-v3__author-img img {
  display: block;
  width: inherit;
  height: inherit;
}
.articles-v3__author-img:hover {
  transform: scale(1.1);
}

.articles-v3__author-name {
  font-weight: bold;
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.articles-v3__author-name:hover {
  text-decoration: underline;
}

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

File#: _1_article-preview
Title: Article Preview
Descr: Blog post excerpt, containing a link to the article page
Usage: codyhouse.co/license

-------------------------------- */
.story__img {
  display: block;
  transition: opacity 0.2s;
  overflow: hidden;
  margin-bottom: var(--space-xs);
}
.story__img:hover {
  opacity: 0.85;
}
.story__img img {
  display: block;
  width: 100%;
}

.story__category {
  display: inline-flex;
  align-items: center;
  color: var(--color-contrast-higher);
  line-height: 1;
  text-decoration: none;
  font-size: var(--text-sm);
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
  padding: var(--space-2xs);
  border-radius: var(--radius-md);
  transition: background-color 0.2s;
}
.story__category:hover {
  text-decoration: underline;
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.3);
}

.story__title a {
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.story__title a:hover {
  text-decoration: underline;
}

.story__author {
  --author-img-size: 50px;
  display: grid;
  grid-template-columns: var(--author-img-size) 1fr;
  align-items: center;
  gap: var(--space-xs);
}
.story__author img {
  display: block;
  width: var(--author-img-size);
  height: var(--author-img-size);
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
}

.story__author-name {
  margin-bottom: var(--space-4xs);
}
.story__author-name a {
  text-decoration: none;
  color: var(--color-contrast-higher);
}
.story__author-name a:hover {
  text-decoration: underline;
}

.story__meta {
  font-size: var(--text-sm);
  color: var(--color-contrast-medium);
}

@media (min-width: 64rem) {
  .story--featured {
    display: grid;
    grid-template-columns: 3fr 2fr;
    grid-gap: var(--space-md);
    align-items: center;
  }
  .story--featured .story__img {
    margin: 0;
  }
  .story--featured .story__title {
    font-size: var(--text-2xl);
  }
}
/* -------------------------------- 

File#: _1_article-preview-v2
Title: Article Preview v2
Descr: Blog post excerpt, containing a link to the article page
Usage: codyhouse.co/license

-------------------------------- */
.story-v2__meta a {
  color: var(--color-contrast-high);
  transition: 0.2s;
}
.story-v2__meta a:hover {
  color: var(--color-primary);
}
.story-v2__meta span[role=separator] {
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: middle;
  background-color: var(--color-contrast-low);
  border-radius: 50%;
  margin: 0 var(--space-3xs);
}

.story-v2__headline a {
  color: var(--color-contrast-higher);
  text-decoration: underline;
  background-repeat: no-repeat;
  background-image: linear-gradient(transparent 50%, hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2) 50%);
  background-size: 0% 100%;
  will-change: background-size;
  transition: background-size 0.3s var(--ease-in-out);
}
.story-v2__headline a:hover {
  background-size: 100% 100%;
}

.story-v2__excerpt {
  color: var(--color-contrast-medium);
}

.story-v2__img {
  display: block;
  transition: opacity 0.2s;
}
.story-v2__img:hover {
  opacity: 0.85;
}
.story-v2__img img {
  display: block;
  width: 100%;
}

@media (min-width: 64rem) {
  .story-v2--featured .story-v2__excerpt {
    max-width: 70%;
    margin-left: auto;
  }
}
/* -------------------------------- 

File#: _1_auto-sized-grid
Title: Auto Sized Grid
Descr: A grid layout based on CSS Grid where the columns are automatically created according to a min-width value
Usage: codyhouse.co/license

-------------------------------- */
.grid-auto-xs,
.grid-auto-sm,
.grid-auto-md,
.grid-auto-lg,
.grid-auto-xl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--col-min-width), 1fr));
}

.grid-auto-xs {
  --col-min-width: 8rem;
}

.grid-auto-sm {
  --col-min-width: 10rem;
}

.grid-auto-md {
  --col-min-width: 15rem;
}

.grid-auto-lg {
  --col-min-width: 20rem;
}

.grid-auto-xl {
  --col-min-width: 25rem;
}

@media (min-width: 32rem) {
  .grid-auto-xs\@xs {
    --col-min-width: 8rem;
  }
  .grid-auto-sm\@xs {
    --col-min-width: 10rem;
  }
  .grid-auto-md\@xs {
    --col-min-width: 15rem;
  }
  .grid-auto-lg\@xs {
    --col-min-width: 20rem;
  }
  .grid-auto-xl\@xs {
    --col-min-width: 25rem;
  }
}
@media (min-width: 48rem) {
  .grid-auto-xs\@sm {
    --col-min-width: 8rem;
  }
  .grid-auto-sm\@sm {
    --col-min-width: 10rem;
  }
  .grid-auto-md\@sm {
    --col-min-width: 15rem;
  }
  .grid-auto-lg\@sm {
    --col-min-width: 20rem;
  }
  .grid-auto-xl\@sm {
    --col-min-width: 25rem;
  }
}
@media (min-width: 64rem) {
  .grid-auto-xs\@md {
    --col-min-width: 8rem;
  }
  .grid-auto-sm\@md {
    --col-min-width: 10rem;
  }
  .grid-auto-md\@md {
    --col-min-width: 15rem;
  }
  .grid-auto-lg\@md {
    --col-min-width: 20rem;
  }
  .grid-auto-xl\@md {
    --col-min-width: 25rem;
  }
}
@media (min-width: 80rem) {
  .grid-auto-xs\@lg {
    --col-min-width: 8rem;
  }
  .grid-auto-sm\@lg {
    --col-min-width: 10rem;
  }
  .grid-auto-md\@lg {
    --col-min-width: 15rem;
  }
  .grid-auto-lg\@lg {
    --col-min-width: 20rem;
  }
  .grid-auto-xl\@lg {
    --col-min-width: 25rem;
  }
}
@media (min-width: 90rem) {
  .grid-auto-xs\@xl {
    --col-min-width: 8rem;
  }
  .grid-auto-sm\@xl {
    --col-min-width: 10rem;
  }
  .grid-auto-md\@xl {
    --col-min-width: 15rem;
  }
  .grid-auto-lg\@xl {
    --col-min-width: 20rem;
  }
  .grid-auto-xl\@xl {
    --col-min-width: 25rem;
  }
}
/* -------------------------------- 

File#: _1_az-custom
Title: Custom Styles Master
Descr: Syles for custom code modules
Usage: azits.net/license

-------------------------------- */
/* The index 

 01 - Blog archive
 02 - MegaMenu mods
 03 - Object positioning for images
 04 - About Word Jumble styles
 05 - Border hover effect - focus

 -------------------------------- */
/*01 - Blog archive layout*/
.articles {
  display: grid;
  grid-template-columns: 65% 30%;
  gap: var(--space-lg);
}

.sidebar .sticky-wrapper {
  position: sticky;
  top: 1rem;
  border: 1px solid var(--color-contrast-lower);
  padding: var(--space-sm);
  border-radius: var(--radius-lg, 0.375em);
}

.article__legend {
  font-size: 0.9em;
  margin-bottom: var(--space-md);
  color: var(--color-contrast-high);
}

/*Responsive*/
@media (10rem <= width <= 64rem) {
  .articles {
    display: block;
  }
  .sidebar .sticky-wrapper {
    position: none;
    margin-top: var(--space-xl);
    background-color: hsla(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l), 0.2);
    border: 1px solid var(--color-contrast-lower);
  }
  .stories__img-wrapper {
    display: none !important;
  }
}
/* -------------------------------- */
/*02 - MegaMenu Category mod*/
.menu-cat-ser {
  display: inline-block;
  padding: var(--space-2xs) var(--space-sm);
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
  border-radius: 20px;
  color: var(--color-primary);
  font-weight: 600;
  font-size: var(--text-sm);
  margin-top: var(--space-sm);
  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}

.menu-cat-sol {
  display: inline-block;
  padding: var(--space-2xs) var(--space-sm);
  background-color: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), 0.2);
  border-radius: 20px;
  color: var(--color-accent);
  font-weight: 600;
  font-size: var(--text-sm);
  margin-top: var(--space-sm);
  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}

/* -------------------------------- */
/*03 - Object positioning for images*/
.object-center-top {
  -o-object-position: 50% 0%;
     object-position: 50% 0%;
}

.object-center-bottom {
  -o-object-position: 50% 100%;
     object-position: 50% 100%;
}

.object-left-center {
  -o-object-position: 0% 50%;
     object-position: 0% 50%;
}

.object-right-center {
  -o-object-position: 100% 50%;
     object-position: 100% 50%;
}

/* -------------------------------- */
/*04 - About US Jumbled Row - Our Values*/
.jumble-row {
  overflow: hidden;
}

.jumble-row span {
  font-weight: 400;
  cursor: default;
  transition: transform 0.4s ease, color 0.25s ease, font-weight 0.1s ease, opacity 1s ease, margin 0.2s ease, -webkit-text-decoration 0.4s ease;
  transition: transform 0.4s ease, color 0.25s ease, font-weight 0.1s ease, text-decoration 0.4s ease, opacity 1s ease, margin 0.2s ease;
  transition: transform 0.4s ease, color 0.25s ease, font-weight 0.1s ease, text-decoration 0.4s ease, opacity 1s ease, margin 0.2s ease, -webkit-text-decoration 0.4s ease;
  will-change: transform, margin;
}

.jumble-row span:hover {
  transform: scale(1.1);
  text-decoration: underline;
  font-weight: 500;
}

.jumble-row:hover span:not(:hover) {
  opacity: 0.6;
  z-index: 4;
  transform: scale(0.9);
}

/* Color variation */
.jumble-row span:nth-child(1) {
  color: #1e88e5;
}

.jumble-row span:nth-child(2) {
  color: #6a1b9a;
}

.jumble-row span:nth-child(3) {
  color: #00897b;
}

.jumble-row span:nth-child(4) {
  color: #ef6c00;
}

.jumble-row span:nth-child(5) {
  color: #2e7d32;
}

.jumble-row span:nth-child(6) {
  color: #c62828;
}

.jumble-row span:nth-child(7) {
  color: #1565c0;
}

.jumble-row span:nth-child(8) {
  color: #ad1457;
}

.jumble-row span:nth-child(9) {
  color: #4e342e;
}

.jumble-row span:nth-child(10) {
  color: #0277bd;
}

.jumble-row span:nth-child(11) {
  color: #7b1fa2;
}

.jumble-row span:nth-child(12) {
  color: #00695c;
}

.jumble-row span:nth-child(13) {
  color: #f9a825;
}

.jumble-row span:nth-child(14) {
  color: #37474f;
}

.jumble-row span:nth-child(15) {
  color: #5d4037;
}

.jumble-row span:nth-child(16) {
  color: #283593;
}

/*05 - Border hover effect - focus*/
.focus-primary:hover {
  border: 1px solid var(--color-primary);
}

.focus-accent:hover {
  border: 1px solid var(--color-accent-dark);
}

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

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;
  border-radius: var(--radius-md);
  transition: 0.3s;
}
.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(--color-primary-dark);
  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: currentColor;
  height: 2px;
  width: 100%;
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  clip-path: inset(0% round var(--radius-sm));
  transition: 0.3s var(--ease-out);
  opacity: 0.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;
    clip-path: polygon(100px 0%, 100% 0%, 100% 100%, 50px 100%);
  }
  .banner--invert .banner__figure {
    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 {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
/* -------------------------------- 

File#: _1_card-v2
Title: Card v2
Descr: Container of information used as teasers for further content, often displayed in a gallery of related items
Usage: codyhouse.co/license

-------------------------------- */
.card-v2 {
  position: relative;
  overflow: hidden;
}
.card-v2 img {
  display: block;
  width: 100%;
}

.card-v2__caption {
  position: absolute;
  bottom: 0;
  width: 100%;
  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), 1));
  background-blend-mode: multiply;
  color: var(--color-white);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

.card-v2--blur-fx .card-v2__caption {
  background: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.8);
  backdrop-filter: blur(10px);
}

a.card-v2 {
  display: block;
  text-decoration: none;
  transition: box-shadow 0.2s;
}
a.card-v2:hover {
  box-shadow: var(--shadow-md);
}

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

File#: _1_card-v9
Title: Card v9
Descr: Container of information used as teaser for further content exploration
Usage: codyhouse.co/license

-------------------------------- */
.card-v9 {
  display: block;
  position: relative;
  z-index: 1;
  text-decoration: none;
  color: inherit;
  background-color: var(--color-white);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: 0.3s;
}

.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);
}
.card-v9__btn i {
  position: relative;
  z-index: 2;
  color: var(--color-bg);
  opacity: 0;
  transition: opacity 0.3s;
}
.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;
  transform: translateY(25%);
  transition: opacity 0.3s, transform 0.3s var(--ease-out);
}

.card-v9:hover .card-v9__btn i {
  opacity: 1;
}
.card-v9:hover .card-v9__btn::after {
  opacity: 1;
  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);
}

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

File#: _1_collapse
Title: Collapse
Descr: Control button to toggle the visibility of a panel element
Usage: codyhouse.co/license

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

File#: _1_customer-logos
Title: Customer Logos
Descr: A gallery of trusted companies
Usage: codyhouse.co/license

-------------------------------- */
.customer-logo {
  display: block;
  fill: var(--color-contrast-low);
}

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

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-2xs);
}

.d-movement__source {
  display: grid;
  grid-gap: var(--space-2xs);
}

.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#: _1_details-list
Title: Details List
Descr: Pairs of related information displayed in a list
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --details-list-border-width: 1px;
  --details-list-border-opacity: 0.15;
}

.details-list--rows .details-list__item {
  border-bottom: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
}
.details-list--rows .details-list__item:last-child {
  border-bottom: none;
}

.details-list--cols .details-list__item {
  border-right: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
}
.details-list--cols .details-list__item:last-child {
  border-right: none;
}

@media (min-width: 32rem) {
  .details-list--rows\@xs .details-list__item {
    border-right: 0;
    border-bottom: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--rows\@xs .details-list__item:last-child {
    border-bottom: none;
  }
  .details-list--cols\@xs .details-list__item {
    border-bottom: 0;
    border-right: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--cols\@xs .details-list__item:last-child {
    border-right: none;
  }
}
@media (min-width: 48rem) {
  .details-list--rows\@sm .details-list__item {
    border-right: 0;
    border-bottom: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--rows\@sm .details-list__item:last-child {
    border-bottom: none;
  }
  .details-list--cols\@sm .details-list__item {
    border-bottom: 0;
    border-right: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--cols\@sm .details-list__item:last-child {
    border-right: none;
  }
}
@media (min-width: 64rem) {
  .details-list--rows\@md .details-list__item {
    border-right: 0;
    border-bottom: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--rows\@md .details-list__item:last-child {
    border-bottom: none;
  }
  .details-list--cols\@md .details-list__item {
    border-bottom: 0;
    border-right: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--cols\@md .details-list__item:last-child {
    border-right: none;
  }
}
@media (min-width: 80rem) {
  .details-list--rows\@lg .details-list__item {
    border-right: 0;
    border-bottom: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--rows\@lg .details-list__item:last-child {
    border-bottom: none;
  }
  .details-list--cols\@lg .details-list__item {
    border-bottom: 0;
    border-right: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--cols\@lg .details-list__item:last-child {
    border-right: none;
  }
}
@media (min-width: 90rem) {
  .details-list--rows\@xl .details-list__item {
    border-right: 0;
    border-bottom: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--rows\@xl .details-list__item:last-child {
    border-bottom: none;
  }
  .details-list--cols\@xl .details-list__item {
    border-bottom: 0;
    border-right: var(--details-list-border-width) solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--details-list-border-opacity));
  }
  .details-list--cols\@xl .details-list__item:last-child {
    border-right: none;
  }
}
/* -------------------------------- 

File#: _1_feature-v7
Title: Feature v7
Descr: A section containing a list of features
Usage: codyhouse.co/license

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

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

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background-color: hsl(0, 0%, 100%);
  font-family: system-ui, sans-serif;
  color: hsl(230, 7%, 23%);
  font-size: 1.125rem; /* 18px */
  line-height: 1.4;
}

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

h1 {
  font-size: 2.5rem; /* 40px */
}

h2 {
  font-size: 2.125rem; /* 34px */
}

h3 {
  font-size: 1.75rem; /* 28px */
}

h4 {
  font-size: 1.375rem; /* 22px */
}

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

button, input, textarea, select {
  background-color: transparent;
  border-radius: 0;
  color: inherit;
  line-height: inherit;
  -webkit-appearance: none;
  -moz-appearance: none;
       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%;
}

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

Icons 

-------------------------------- */
.cd-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;
}

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

@keyframes cd-icon-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.cd-icon use { /* SVG symbols - enable icon color corrections */
  color: inherit;
  fill: currentColor;
}

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

Component 

-------------------------------- */
.feature-v7__grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 2rem;
}

.feature-v7__grid-item {
  min-width: 0;
  grid-column-end: span 12;
}

@media (min-width: 64rem) {
  .feature-v7__grid-item {
    grid-column-end: span 6;
  }
}
.feature-v7__sub-grid {
  display: flex;
  gap: 1rem;
}

.feature-v7__description {
  color: hsl(225, 4%, 47%);
  line-height: 1.58;
}

.feature-v7__img {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  box-shadow: 0 0 0 1px hsla(230, 13%, 9%, 0.05);
  background-color: hsl(0, 0%, 100%);
}

.feature-v7__img > .cd-icon {
  --size: 24px;
  color: hsl(250, 84%, 54%);
}

.feature-v7__img-clone {
  flex-shrink: 0;
  width: 48px;
}

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

Utilities 

-------------------------------- */
.cd-position-relative {
  position: relative;
}

.cd-z-index-1 {
  z-index: 1;
}

.cd-container {
  width: calc(100% - 3rem);
  margin-left: auto;
  margin-right: auto;
}

.cd-max-width-adaptive-lg {
  max-width: 32rem;
}

@media (min-width: 48rem) {
  .cd-max-width-adaptive-lg {
    max-width: 48rem;
  }
}
@media (min-width: 64rem) {
  .cd-max-width-adaptive-lg {
    max-width: 64rem;
  }
}
@media (min-width: 80rem) {
  .cd-max-width-adaptive-lg {
    max-width: 80rem;
  }
}
.cd-padding-y-2xl {
  padding-top: 7rem;
  padding-bottom: 7rem;
}

.cd-margin-bottom-xl {
  margin-bottom: 4.5rem;
}

.cd-items-center {
  align-items: center;
}

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

File#: _1_google-maps
Title: Google Maps
Descr: Google Maps component
Usage: codyhouse.co/license

-------------------------------- */
.google-maps {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}

.google-maps--ratio-4\:1 {
  padding-bottom: 25%;
}

.google-maps--ratio-3\:1 {
  padding-bottom: 33%;
}

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

File#: az_1_how-it-works-v2
Title: How It Works v2 | AZITS Mod
Descr: A list of steps showing how a product works
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --az-hiw-v2-gap: var(--space-lg);
}

.az-hiw-v2__grid {
  display: flex;
  flex-direction: column;
  gap: calc(var(--az-hiw-v2-gap) * 2);
}

.az-hiw-v2__item {
  position: relative;
}
.az-hiw-v2__item:last-child {
  display: none;
}

@media (min-width: 64rem) {
  /* layout swift */
  :root {
    --az-hiw-v2-gap: var(--space-md);
  }
  .az-hiw-v2__grid {
    flex-direction: row;
  }
  .az-hiw-v2__item {
    flex-grow: 1;
    flex-basis: 0;
    max-width: 100%;
    min-width: 0;
  }
  .az-hiw-v2__figure {
    position: relative;
  }
}
/* -------------------------------- 

File#: _1_list
Title: List
Descr: Custom list component
Usage: codyhouse.co/license

-------------------------------- */
: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);
  padding-top: calc(var(--list-space-y) / 2);
  padding-left: var(--list-offset);
}
.list li,
.text-component .list li {
  padding-bottom: calc(var(--list-space-y) / 2);
  margin-bottom: calc(var(--list-space-y) / 2);
  line-height: calc(1.4 * 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((1.4em - 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((1.4em * var(--list-line-height-multiplier) - var(--list-bullet-size)) / 2);
  }
}

/* #endregion */
/* -------------------------------- 

File#: _1_list-v3
Title: List v3
Descr: Custom list component
Usage: codyhouse.co/license

-------------------------------- */
.list-v3 {
  --list-v3-gap: var(--space-md);
  /* icon wrapper */
  --list-v3-figure-size: 34px;
  --list-v3-icon-size: 24px;
}
@media (min-width: 64rem) {
  .list-v3 {
    --list-v3-figure-size: 55px;
  }
}

.list-v3__item:not(:first-child) {
  padding-top: var(--list-v3-gap);
}
.list-v3__item:not(:last-child) {
  padding-bottom: var(--list-v3-gap);
  border-bottom: 1px solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
}

.list-v3__figure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--list-v3-figure-size);
  height: var(--list-v3-figure-size);
  border-radius: 50%;
  position: relative;
  overflow: hidden;
}
.list-v3__figure img,
.list-v3__figure .list-v3__icon {
  position: relative;
  z-index: 1;
}
.list-v3__figure::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: currentColor;
  opacity: 0.2;
}

.list-v3__icon {
  --size: var(--list-v3-icon-size);
}

.list-v3__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), 0.15) 50%);
  background-size: 200% 2px;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  transition: background-position 0.3s;
}
.list-v3__link:hover {
  background-position: 0% 100%;
}

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

File#: _1_main-footer-v2
Title: Main Footer v2
Descr: Footer navigation template
Usage: codyhouse.co/license

-------------------------------- */
.footer-v2 {
  position: relative;
  z-index: 1;
}

/*Top row link group*/
.footer-v2 .link-group li {
  border: 1px solid var(--color-contrast-low);
}

.footer-v2 .link-group li:hover {
  border: 1px solid var(--color-contrast-high);
}

.footer-v2 .link-group li:hover a {
  color: var(--color-contrast-low);
  text-decoration: none;
}

/*back to top*/
.footer-v2 .up-top {
  text-decoration: none;
}

.footer-v2 .up-top:hover {
  color: var(--color-contrast-low);
}

.footer-v2__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-md);
}
@media (min-width: 32rem) {
  .footer-v2__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 64rem) {
  .footer-v2__list {
    grid-template-columns: repeat(4, 1fr);
  }
}

.footer-v2__item {
  display: grid;
  gap: var(--space-sm);
  align-content: start;
}
@media (min-width: 64rem) {
  .footer-v2__item {
    gap: var(--space-xs);
  }
}

.footer-v2__item a {
  color: var(--color-white);
  text-decoration: none;
}
.footer-v2__item a:hover {
  color: var(--color-contrast-medium);
  text-decoration: underline;
}
@media (min-width: 64rem) {
  .footer-v2__item a {
    font-size: var(--text-sm);
  }
}

.footer-v2__socials {
  display: flex;
  justify-content: center;
  margin-bottom: var(--space-sm);
}
.footer-v2__socials a {
  text-decoration: none;
  display: inline-block;
  margin: 0 var(--space-3xs);
  color: var(--color-contrast-medium);
}
.footer-v2__socials a:hover {
  color: var(--color-contrast-high);
}
.footer-v2__socials a svg {
  display: block;
  width: 1em;
  height: 1em;
  color: inherit;
}

.footer-v2__print {
  font-size: var(--text-sm);
  color: var(--color-contrast-medium);
  text-align: center;
}
.footer-v2__print p {
  margin-bottom: var(--space-sm);
}
.footer-v2__print a {
  color: inherit;
}
.footer-v2__print a:hover {
  color: var(--color-contrast-high);
}
@media (min-width: 64rem) {
  .footer-v2__print {
    font-size: var(--text-xs);
  }
}

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

File#: _1_menu
Title: Menu
Descr: Application menu that provides access to a set of functionalities
Usage: codyhouse.co/license

-------------------------------- */
.menu {
  --menu-vertical-gap: 4px; /* vertical gap between the Menu element and its control */
  --menu-item-padding: var(--space-3xs) var(--space-xs);
  list-style: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  position: fixed; /* top/left position set in JS */
  z-index: var(--z-index-popover, 5);
  width: 220px;
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow), var(--shadow-md);
  padding: var(--space-2xs) 0;
  border-radius: var(--radius-md);
  margin-top: var(--menu-vertical-gap);
  margin-bottom: var(--menu-vertical-gap);
  overflow: auto;
  font-size: 1rem;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 0.2s, opacity 0.2s;
}

.menu--is-visible {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity 0.2s;
}

.menu--overlay {
  z-index: var(--z-index-overlay, 15);
}

.menu__content {
  display: flex;
  align-items: center;
  padding: var(--menu-item-padding);
  text-decoration: none; /* reset link style */
  color: var(--color-contrast-high);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: 0.2s;
}
.menu__content:hover {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
}
.menu__content:focus {
  outline: none;
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.15);
}

.menu__label {
  padding: var(--menu-item-padding);
  font-size: 0.8125rem;
  color: var(--color-contrast-medium);
}

.menu__separator {
  height: 1px;
  background-color: var(--color-contrast-lower);
  margin: var(--menu-item-padding);
}

.menu__icon {
  color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.5);
  margin-right: var(--space-2xs);
}

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

File#: _1_modal-window
Title: Modal Window
Descr: A modal dialog used to display critical information
Usage: codyhouse.co/license

-------------------------------- */
.modal {
  position: fixed;
  z-index: var(--z-index-overlay, 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--is-visible {
  opacity: 1;
  visibility: visible;
}

/* close buttons */
.modal__close-btn {
  display: flex;
  flex-shrink: 0;
  border-radius: 50%;
  transition: 0.2s;
}
.modal__close-btn .icon {
  display: block;
  margin: auto;
}

.modal__close-btn--outer { /* close button - outside the modal__content */
  --size: 48px;
  width: var(--size);
  height: var(--size);
  position: fixed;
  top: var(--space-sm);
  right: var(--space-sm);
  z-index: var(--z-index-fixed-element, 10);
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.9);
  transition: 0.2s;
}
.modal__close-btn--outer .icon {
  color: var(--color-white); /* icon color */
  transition: transform 0.3s var(--ease-out-back);
}
.modal__close-btn--outer:hover {
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 1);
}
.modal__close-btn--outer:hover .icon {
  transform: scale(1.1);
}

.modal__close-btn--inner { /* close button - inside the modal__content */
  --size: 32px;
  width: var(--size);
  height: var(--size);
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow), var(--shadow-sm);
  transition: 0.2s;
}
.modal__close-btn--inner .icon {
  color: inherit; /* icon color */
}
.modal__close-btn--inner:hover {
  background-color: var(--color-bg-lighter);
  box-shadow: var(--inner-glow), var(--shadow-md);
}

/* 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: transform var(--modal-transition-duration) var(--ease-out);
  }
  .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 {
    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: transform var(--modal-transition-duration) var(--ease-out);
  }
  .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 {
    transform: scale(1); /* reset all transformations */
  }
  /* scale */
  .modal--animate-scale .modal__content {
    transform: scale(0.95);
  }
  /* translate */
  .modal--animate-translate-up .modal__content {
    transform: translateY(40px);
  }
  .modal--animate-translate-down .modal__content {
    transform: translateY(-40px);
  }
  .modal--animate-translate-right .modal__content {
    transform: translateX(-40px);
  }
  .modal--animate-translate-left .modal__content {
    transform: translateX(40px);
  }
  /* slide */
  .modal--animate-slide-up .modal__content {
    transform: translateY(100%);
  }
  .modal--animate-slide-down .modal__content {
    transform: translateY(-100%);
  }
  .modal--animate-slide-right .modal__content {
    transform: translateX(-100%);
  }
  .modal--animate-slide-left .modal__content {
    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(--color-black-h), var(--color-black-s), var(--color-black-l), 0);
  transition: background 0.2s;
}
.modal-img-btn:hover::after {
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 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(--color-black-h), var(--color-black-s), var(--color-black-l), 0.7);
  opacity: 0;
  transition: opacity 0.2s;
}
.modal-img-btn__icon-wrapper .icon {
  color: var(--color-white);
}

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

File#: _1_pagination
Title: Pagination 
Descr: Component used to navigate through pages of related content
Usage: codyhouse.co/license

-------------------------------- */
.pagination__list > li {
  display: inline-block;
}

.pagination--split .pagination__list {
  width: 100%;
}
.pagination--split .pagination__list > *:first-child {
  margin-right: auto;
}
.pagination--split .pagination__list > *:last-child {
  margin-left: auto;
}

.pagination__item {
  display: inline-block;
  display: inline-flex;
  height: 100%;
  align-items: center;
  padding: var(--space-xs) calc(1.355 * var(--space-xs));
  white-space: nowrap;
  line-height: 1;
  border-radius: var(--radius-md);
  text-decoration: none;
  color: var(--color-contrast-high);
  will-change: transform;
  transition: 0.2s;
}
.pagination__item:hover:not(.pagination__item--selected):not(.pagination__item--ellipsis) {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
}
.pagination__item:active {
  transform: translateY(2px);
}

.pagination__item--selected {
  background-color: var(--color-contrast-higher);
  color: var(--color-bg);
  box-shadow: var(--shadow-sm);
}

.pagination__item--disabled {
  opacity: 0.5;
  pointer-events: none;
}

.pagination__jumper .form-control {
  width: 3em;
  margin-right: var(--space-xs);
}
.pagination__jumper em {
  flex-shrink: 0;
  white-space: nowrap;
}

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

File#: _1_popover
Title: Popover
Descr: A pop-up box controlled by a trigger element
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --popover-width: 250px;
  --popover-control-gap: 4px;
  --popover-viewport-gap: 20px;
  --popover-transition-duration: 0.2s;
}

.popover {
  position: fixed;
  width: var(--popover-width);
  z-index: var(--z-index-popover, 5);
  margin-top: var(--popover-control-gap);
  margin-bottom: var(--popover-control-gap);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s var(--popover-transition-duration), opacity var(--popover-transition-duration);
}

.popover--is-visible {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity var(--popover-transition-duration);
}

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

File#: _1_previous-next-links
Title: Previous/Next Links
Descr: Links to previous/next articles
Usage: codyhouse.co/license

-------------------------------- */
.pn-links {
  border-top: 1px solid var(--color-contrast-lower);
  border-bottom: 1px solid var(--color-contrast-lower);
}

.pn-links__item:first-child .pn-links__link {
  border-bottom: 1px solid var(--color-contrast-lower);
}

.pn-links__link {
  display: flex;
  align-items: center;
  height: 100%;
  color: inherit;
  text-decoration: none;
  padding: var(--space-md);
}
.pn-links__link:hover {
  text-decoration: underline;
}
.pn-links__link:hover .pn-links__icon line:nth-child(1) {
  transform: rotate(180deg);
}
.pn-links__link:hover .pn-links__icon line:nth-child(2) {
  transform: rotate(-180deg);
}
.pn-links__link:hover .pn-links__icon line:nth-child(3) {
  stroke-dashoffset: 14;
}

.pn-links__icon {
  flex-shrink: 0;
}
.pn-links__icon line:nth-child(1),
.pn-links__icon line:nth-child(2) {
  transition: transform 0.3s var(--ease-out);
}
.pn-links__icon line:nth-child(1) {
  transform-origin: 42px 19px;
}
.pn-links__icon line:nth-child(2) {
  transform-origin: 42px 29px;
}
.pn-links__icon line:nth-child(3) {
  stroke-dasharray: 48;
  transition: stroke-dashoffset 0.3s var(--ease-out);
}

@media (min-width: 64rem) {
  .pn-links__item:first-child .pn-links__link {
    border-bottom: none;
    border-right: 1px solid var(--color-contrast-lower);
  }
}
/* -------------------------------- 

File#: _1_radio-switch
Title: Radio Switch
Descr: Custom radio toggle
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --radio-switch-width: 55px;
  --radio-switch-height: 28px;
  --radio-switch-padding: 3px;
  --radio-switch-radius: 50em;
  --radio-switch-animation-duration: 0.3s;
}

.radio-switch {
  position: relative;
  display: inline-block;
  display: inline-flex;
  padding: var(--radio-switch-padding);
  border-radius: calc(var(--radio-switch-radius) * 1.4);
  background-color: var(--color-bg-darker);
}
.radio-switch:focus-within, .radio-switch:active {
  box-shadow: 0 0 0 2px hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.15);
}

.radio-switch__item {
  position: relative;
  display: inline-block;
  height: calc(var(--radio-switch-height) - 2 * var(--radio-switch-padding));
  width: calc(var(--radio-switch-width) * 0.5 - var(--radio-switch-padding));
}

.radio-switch__label {
  position: relative;
  z-index: 2;
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  border-radius: var(--radio-switch-radius);
  cursor: pointer;
  font-size: var(--text-sm);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all var(--radio-switch-animation-duration);
}
.radio-switch__input:checked ~ .radio-switch__label {
  color: var(--color-white);
}
.radio-switch__input:focus ~ .radio-switch__label {
  background-color: hsl(var(--color-primary-h), var(--color-primary-s), calc(var(--color-primary-l) * 0.6));
}
.radio-switch__label :not(*):focus-within, .radio-switch__input:focus ~ .radio-switch__label {
  background-color: transparent;
}

.radio-switch__marker {
  position: absolute;
  z-index: 1;
  top: 0;
  left: -100%;
  border-radius: var(--radio-switch-radius);
  background-color: var(--color-primary);
  height: calc(var(--radio-switch-height) - 2 * var(--radio-switch-padding));
  width: calc(var(--radio-switch-width) * 0.5 - var(--radio-switch-padding));
  box-shadow: var(--shadow-md);
  transition: transform var(--radio-switch-animation-duration);
}
.radio-switch__input:checked ~ .radio-switch__marker {
  transform: translateX(100%);
}

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

File#: _1_search-input
Title: Search input
Descr: Search input field with custom button
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --search-input-btn-width: 2.2em;
  --search-input-icon-size: 1em;
  --search-input-shortcut-margin: 0.325em;
  /* gap between the shortcut badge and the input edges */
}

.search-input {
  position: relative;
}

.search-input__input {
  width: 100%;
  height: 100%;
}
.search-input__input::-webkit-search-decoration, .search-input__input::-webkit-search-cancel-button, .search-input__input::-webkit-search-results-button, .search-input__input::-webkit-search-results-decoration {
  -webkit-appearance: none;
}
.search-input__input::-ms-clear, .search-input__input::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}
.search-input--icon-right .search-input__input {
  padding-right: var(--search-input-btn-width);
}
.search-input--icon-left .search-input__input {
  padding-left: var(--search-input-btn-width);
}

.search-input__btn {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: var(--search-input-btn-width);
}
.search-input__btn:active .icon {
  transform: translateY(2px);
}
.search-input__btn .icon {
  display: block;
  --size: var(--search-input-icon-size);
  margin-left: auto;
  margin-right: auto;
  color: var(--color-contrast-low);
  /* icon color */
  transition: 0.2s;
}
.search-input--icon-left .search-input__btn {
  left: 0;
  right: auto;
  pointer-events: none;
}

.search-input__btn:focus .icon,
.search-input .search-input__input:focus + .search-input__btn .icon {
  color: var(--color-primary);
  /* active icon color */
}

/* --shortcut */
.search-input__shortcut {
  position: absolute;
  right: var(--search-input-shortcut-margin);
  top: var(--search-input-shortcut-margin);
  height: calc(100% - var(--search-input-shortcut-margin) * 2);
  display: flex;
  align-items: center;
  background-color: var(--color-bg);
  border: 1px solid var(--color-contrast-lower);
  border-radius: var(--radius-sm);
  --space-unit: 1em;
  padding: 0 var(--space-3xs);
  line-height: 1;
  color: var(--color-contrast-medium);
}

.search-input:focus-within .search-input__shortcut {
  display: none;
}

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

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;
}

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

File#: _1_socials
Title: Socials
Descr: Section with links to social media accounts
Usage: codyhouse.co/license

-------------------------------- */
.socials__btns a {
  --size: 2.5em;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-contrast-high);
  transition: 0.3s;
}
.socials__btns a .icon {
  font-size: 1.25em;
  /* icon size */
  color: var(--color-bg);
  /* icon color */
  transition: color 0.3s, transform 0.3s var(--ease-out-back);
}
.socials__btns a:hover {
  background-color: var(--color-primary);
}
.socials__btns a:hover .icon {
  transform: scale(1.2);
  color: var(--color-white);
}

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

File#: _1_social-sharing
Title: Social Sharing
Descr: Social sharing plugin
Usage: codyhouse.co/license

-------------------------------- */
.sharebar__btn {
  --size: 60px;
  width: var(--size);
  height: var(--size);
  display: flex;
  background: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
  border-radius: 50%;
  transition: 0.2s;
}
.sharebar__btn .icon {
  --size: 24px;
  display: block;
  margin: auto;
  color: var(--color-contrast-high);
  transition: color 0.2s;
}
.sharebar__btn:hover {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
  box-shadow: var(--shadow-sm);
}
.sharebar__btn:hover .icon {
  color: var(--color-contrast-higher);
}

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

File#: _1_stories
Title: Stories
Descr: A collection of related article tasters
Usage: codyhouse.co/license

-------------------------------- */
.stories {
  padding: var(--space-md);
}
@media (min-width: 64rem) {
  .stories {
    --text-unit: 1em;
    /* use Em units */
    font-size: var(--text-sm);
    /* reduce font size of all text elements */
    padding: var(--space-sm);
  }
}

.stories__legend {
  font-size: 1em;
  margin-bottom: var(--space-md);
  color: var(--color-contrast-high);
}

.stories__story {
  display: flex;
}
.stories__story:not(:last-child) {
  margin-bottom: var(--space-sm);
  padding-bottom: var(--space-sm);
  border-bottom: 1px solid hsla(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l), 0.5);
}

.stories__img-wrapper {
  display: block;
  width: 3.6em;
  height: 3.6em;
  border-radius: var(--radius-md);
  overflow: hidden;
  flex-shrink: 0;
  transition: opacity 0.2s;
  margin-right: var(--space-xs);
}
.stories__img-wrapper figure,
.stories__img-wrapper img {
  width: inherit;
  height: inherit;
}
.stories__img-wrapper img {
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.stories__img-wrapper:hover {
  opacity: 0.85;
}

.stories__text {
  margin-top: var(--space-3xs);
}

.stories__headline {
  font-size: var(--text-sm);
}

.stories__metadata {
  color: var(--color-contrast-medium);
  font-size: var(--text-sm);
  text-transform: uppercase;
}

.stories__headline a,
.stories__metadata a {
  color: var(--color-contrast-higher);
  text-decoration: none;
}
.stories__headline a:hover,
.stories__metadata a:hover {
  text-decoration: underline;
}

.stories__separator {
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: middle;
  background-color: var(--color-contrast-low);
  border-radius: 50%;
  margin: 0 var(--space-3xs);
}

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

File#: _1_sub-navigation
Title: Sub Navigation
Descr: Secondary navigation template
Usage: codyhouse.co/license

-------------------------------- */
.subnav__nav {
  position: relative;
  display: flex;
}
.subnav__nav::after {
  content: "";
  width: 1em;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background: linear-gradient(to right, hsla(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l), 0), hsla(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l), 1));
  pointer-events: none;
}

.subnav__list {
  display: flex;
  overflow: auto;
}

.subnav__item {
  display: inline-block;
  flex-shrink: 0;
}

.subnav__link {
  display: block;
  font-size: var(--text-sm);
  padding: 1.5625em;
  text-decoration: none;
  color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), 0.65);
  border: 3px solid transparent;
  border-right-width: 0;
  border-left-width: 0;
  transition: 0.2s;
}
.subnav__link:hover {
  color: var(--color-contrast-high);
}
.subnav__link[aria-current=page] {
  border-bottom-color: var(--color-primary);
  color: var(--color-contrast-high);
}

.subnav:not(.subnav--collapsed) .subnav__control, .subnav:not(.subnav--collapsed) .subnav__close-btn {
  display: none;
}

.subnav--collapsed {
  display: inline-block;
}
.subnav--collapsed .subnav__wrapper {
  position: fixed;
  display: block;
  z-index: var(--z-index-overlay, 15);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.9);
  visibility: hidden;
  opacity: 0;
}
.subnav--collapsed .subnav__wrapper--is-visible {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.3s;
}
.subnav--collapsed .subnav__wrapper--is-visible .subnav__nav {
  transform: translateY(0);
  transition: transform 0.3s;
}
.subnav--collapsed .subnav__nav {
  display: block;
  background-color: var(--color-bg);
  box-shadow: var(--shadow-md);
  max-height: 100%;
  overflow: auto;
  transform: translateY(-1em);
}
.subnav--collapsed .subnav__nav::after {
  display: none;
}
.subnav--collapsed .subnav__list {
  flex-direction: column;
  overflow: visible;
  padding: 0 var(--space-md) var(--space-md);
}
.subnav--collapsed .subnav__link {
  border-width: 0;
  font-size: var(--text-md);
  padding: var(--space-xs) 0;
}
.subnav--collapsed .subnav__link[aria-current=page] {
  color: var(--color-primary);
}

.subnav__close-btn {
  --size: 2em;
  width: var(--size);
  height: var(--size);
  display: flex;
  margin: var(--space-xs) var(--space-xs) 0 auto;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow), var(--shadow-sm);
  transition: 0.2s;
}
.subnav__close-btn:hover {
  background-color: var(--color-bg-lighter);
  box-shadow: var(--inner-glow), var(--shadow-md);
}
.subnav__close-btn .icon {
  display: block;
  color: var(--color-contrast-high);
}

[class*=subnav--expanded]::before {
  display: none;
  content: "collapsed";
}

@media (min-width: 32rem) {
  .subnav--expanded\@xs::before {
    content: "expanded";
  }
}
@media (min-width: 48rem) {
  .subnav--expanded\@sm::before {
    content: "expanded";
  }
}
@media (min-width: 64rem) {
  .subnav--expanded\@md::before {
    content: "expanded";
  }
}
@media (min-width: 80rem) {
  .subnav--expanded\@lg::before {
    content: "expanded";
  }
}
@media (min-width: 90rem) {
  .subnav--expanded\@xl::before {
    content: "expanded";
  }
}
/* -------------------------------- 

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_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#: _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;
  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);
}

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

File#: _1_ticker
Title: Ticker
Descr: News-like Horizontal Scrolling List
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --ticker-animation-duration: 40s;
  --ticker-gap-x: var(--space-md);
  /* horizontal gap */
  --ticker-img-width: 280px;
}
@media (min-width: 48rem) {
  :root {
    --ticker-img-width: 400px;
  }
}
@media (min-width: 64rem) {
  :root {
    --ticker-img-width: 550px;
  }
}

.ticker {
  overflow: hidden;
}

.ticker__list {
  display: flex;
  overflow: auto;
  will-change: transform;
  transform: translateZ(0px);
  backface-visibility: hidden;
}

/* class added in JS to trigger the scrolling animation */
.ticker--animate .ticker__list {
  animation: ticker-animation var(--ticker-animation-duration) infinite;
  animation-timing-function: linear;
}

/* pause animation on hover or using an external control button */
.ticker[data-ticker-pause-hover=on] .ticker__list:hover,
.ticker--paused .ticker__list {
  animation-play-state: paused;
}

.ticker__item {
  flex-shrink: 0;
  margin-right: calc(var(--ticker-gap-x) / 2);
  margin-left: calc(var(--ticker-gap-x) / 2);
}

.ticker__img {
  display: block;
  width: var(--ticker-img-width);
}

.ticker-control {
  /* pause/play button */
  display: inline-flex;
  width: 40px;
  height: 40px;
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.75);
  border-radius: 50%;
  transition: 0.2s;
}
.ticker-control i {
  /* icon */
  position: relative;
  display: block;
  width: 16px;
  height: 16px;
  margin: auto;
  color: var(--color-bg);
  /* icon color */
}
.ticker-control i::before, .ticker-control i::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: currentColor;
  transition: clip-path 0.2s var(--ease-out);
}
.ticker-control i::before {
  clip-path: polygon(1px 1px, 5px 1px, 5px calc(100% - 1px), 1px calc(100% - 1px));
}
.ticker-control i::after {
  clip-path: polygon(calc(100% - 5px) 1px, calc(100% - 1px) 1px, calc(100% - 1px) calc(100% - 1px), calc(100% - 5px) calc(100% - 1px));
}
.ticker-control:hover {
  cursor: pointer;
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.95);
}
.ticker-control[aria-pressed=true] i::before {
  clip-path: polygon(2px 0%, 100% 50%, 100% 50%, 2px 100%);
}
.ticker-control[aria-pressed=true] i::after {
  clip-path: polygon(calc(100% - 5px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 5px) calc(100% - 1px));
}

/* ticker--anim-off class turns off translate animation - added in JS if reduced-motion option is on */
.ticker:not(.ticker--anim-off) .ticker__list {
  overflow: visible;
}

.ticker--reverse:not(.ticker--anim-off) .ticker__list {
  flex-direction: row-reverse;
}

.ticker--reverse.ticker--animate:not(.ticker--anim-off) .ticker__list {
  transform: translateX(calc(100vw - 100%));
  animation-name: ticker-animation-reverse;
}

/* intermediate steps are added to fix a bug on Safari */
@keyframes ticker-animation {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes ticker-animation-reverse {
  0% {
    transform: translateX(calc(100vw - 100%));
  }
  100% {
    transform: translateX(calc(100vw - 50%));
  }
}
/* -------------------------------- 

File#: _2_adv-custom-select
Title: Advanced Custom Select
Descr: Custom select with advanced structure options
Usage: codyhouse.co/license

-------------------------------- */
.adv-select-popover.popover {
  --popover-width: 250px;
  --popover-control-gap: 4px;
  --popover-viewport-gap: 20px;
  --popover-transition-duration: 0.2s;
}
@media (min-width: 64rem) {
  .adv-select-popover.popover {
    --popover-width: 320px;
  }
}

.adv-select-popover__optgroup:not(:first-of-type) {
  padding-top: var(--space-2xs);
}

.adv-select-popover__optgroup:not(:last-of-type) {
  border-bottom: 1px solid hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
  padding-bottom: var(--space-2xs);
}

.adv-select-popover__check {
  display: none;
}

.adv-select-popover__option {
  position: relative;
  cursor: pointer;
  transition: 0.2s;
}
.adv-select-popover__option:hover {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
}
.adv-select-popover__option:focus {
  outline: none;
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.15);
}
.adv-select-popover__option[aria-selected=true] {
  background-color: var(--color-primary);
  color: var(--color-white);
}
.adv-select-popover__option[aria-selected=true] .adv-select-popover__check {
  display: block;
}
.adv-select-popover__option[aria-selected=true]:focus {
  box-shadow: inset 0 0 0 2px var(--color-primary-dark);
}

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

File#: _2_article-v2
Title: Article v2
Descr: Article template
Usage: codyhouse.co/license

-------------------------------- */
.t-article-v2__cover {
  height: 200px;
  background-color: var(--color-contrast-low);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
@media (min-width: 64rem) {
  .t-article-v2__cover {
    height: 400px;
  }
}

.t-article-v2__intro {
  background-color: var(--color-bg);
  padding: var(--space-md);
  margin-top: calc(-1 * var(--space-2xl));
}

.t-article-v2__divider {
  display: flex;
  align-items: center;
}
.t-article-v2__divider span {
  display: block;
  margin: 0 var(--space-xs);
  height: 10px;
  width: 10px;
  transform: rotate(45deg);
  background-color: var(--color-contrast-low);
}
.t-article-v2__divider::before, .t-article-v2__divider::after {
  content: "";
  display: block;
  height: 1px;
  width: auto;
  flex-grow: 1;
  background-color: var(--color-contrast-lower);
}

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

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: 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;
          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 {
  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-3xs);
}
@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;
  transform: scale(0);
  transition: 3s;
}
.carousel__nav-item button:focus {
  outline: none;
}
.carousel__nav-item button:focus::before {
  opacity: 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#: _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-2xs) var(--space-sm);
}

.dropdown {
  position: relative;
}

.dropdown__menu {
  width: 200px;
  border-radius: var(--radius-md);
  padding: var(--space-3xs) 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%;
  font-size: 1rem;
  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-2xs);
  top: calc(50% - 6px);
}
.dropdown__sub-wrapper > .dropdown__menu {
  top: calc(var(--space-2xs) * -1);
  box-shadow: var(--inner-glow), var(--shadow-md);
}

.dropdown__menu {
  top: calc(100% + 4px);
}

.dropdown__sub-wrapper .dropdown__menu {
  top: calc(var(--space-2xs) * -1);
}

@media (pointer: fine) {
  .dropdown__menu--is-visible {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.2s;
  }
}
.dropdown__menu--hide {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0s 0.2s;
}

.dropdown__sub-wrapper > .dropdown__menu--is-visible,
.dropdown__sub-wrapper > .dropdown__menu--hide {
  left: 100%;
}
.dropdown__sub-wrapper > .dropdown__menu--is-visible.dropdown__menu--left,
.dropdown__sub-wrapper > .dropdown__menu--hide.dropdown__menu--left {
  left: -100%;
}

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

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#: _2_faq-v2
Title: Frequent Questions v2
Descr: Q&A template based on the accordion component
Usage: codyhouse.co/license

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

File#: _2_full-screen-search
Title: Full Screen Search
Descr: A full-screen window w/ a search input element
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --fs-search-btn-size: 1.5em;
  --fs-search-border-bottom-width: 2px;
}

.full-screen-search {
  position: relative;
  font-size: var(--text-xl);
  background-image: linear-gradient(transparent calc(100% - var(--fs-search-border-bottom-width) * 2), var(--color-contrast-low) calc(100% - var(--fs-search-border-bottom-width) * 2), var(--color-contrast-low) calc(100% - var(--fs-search-border-bottom-width)), transparent var(--fs-search-border-bottom-width));
}

.full-screen-search__input {
  background: transparent;
  width: 100%;
  padding: var(--space-sm) var(--space-xs);
  padding-right: calc(var(--space-xs) + var(--fs-search-btn-size));
  background-image: linear-gradient(transparent calc(100% - var(--fs-search-border-bottom-width) * 2), var(--color-primary) calc(100% - var(--fs-search-border-bottom-width) * 2), var(--color-primary) calc(100% - var(--fs-search-border-bottom-width)), transparent var(--fs-search-border-bottom-width));
  background-size: 0% 100%;
  background-repeat: no-repeat;
}
.full-screen-search__input:focus {
  outline: none;
  background-size: 100% 100%;
}

.full-screen-search__input::-webkit-search-decoration,
.full-screen-search__input::-webkit-search-cancel-button,
.full-screen-search__input::-webkit-search-results-button,
.full-screen-search__input::-webkit-search-results-decoration {
  display: none;
}

.full-screen-search__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: var(--space-xs);
  height: var(--fs-search-btn-size);
  width: var(--fs-search-btn-size);
  background-color: var(--color-primary);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.full-screen-search__btn .icon {
  display: block;
  color: var(--color-white);
  font-size: 20px;
  transition: transform 0.2s;
}
.full-screen-search__btn:hover .icon {
  transform: scale(1.1);
}

@media (prefers-reduced-motion: no-preference) {
  .modal--search .full-screen-search__input {
    transition: background-size 0.4s var(--ease-out);
  }
  .modal--search .full-screen-search__btn {
    transform: translateY(-30%) scale(0.6);
    opacity: 0;
    transition: opacity 0.4s, transform 0.4s var(--ease-out);
  }
  .modal--search.modal--is-visible .full-screen-search__btn {
    transform: translateY(-50%) scale(1);
    opacity: 1;
  }
}
/* -------------------------------- 

File#: _2_menu-bar
Title: Menu Bar
Descr: Application menu with a list of common actions that users can perform
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --menu-bar-button-size: 2.5em;
  --menu-bar-icon-size: 1em;
  --menu-bar-horizontal-gap: var(--space-2xs);
  --menu-bar-vertical-gap: 4px;
  --menu-bar-label-size: var(--text-xs);
}

.menu-bar {
  list-style: none;
  display: inline-flex;
  align-items: center;
}

.menu-bar__item {
  position: relative;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--menu-bar-button-size);
  width: var(--menu-bar-button-size);
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s;
}
.menu-bar__item:not(:last-child) {
  margin-right: var(--menu-bar-horizontal-gap);
}
.menu-bar__item:hover, .menu-bar__item.menu-control--active {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
}
.menu-bar__item:hover > .menu-bar__icon, .menu-bar__item.menu-control--active > .menu-bar__icon {
  color: var(--color-contrast-higher);
}
.menu-bar__item:hover > .menu-bar__label, .menu-bar__item.menu-control--active > .menu-bar__label {
  clip: auto;
  clip-path: none;
  height: auto;
  width: auto;
}
.menu-bar__item:focus {
  outline: none;
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.1);
}
.menu-bar__item:active {
  background-color: var(--color-contrast-low);
}
.menu-bar__item:focus:active {
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.2);
}

.menu-bar__item--trigger {
  display: none;
}

.menu-bar__icon {
  display: block;
  color: var(--color-contrast-high);
  font-size: var(--menu-bar-icon-size);
  transition: color 0.2s;
}

.menu-bar__label {
  position: absolute;
  z-index: var(--z-index-popover, 5);
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(var(--menu-bar-vertical-gap));
  padding: var(--space-2xs) var(--space-xs);
  color: var(--color-bg);
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.95);
  border-radius: var(--radius-md);
  font-size: var(--menu-bar-label-size);
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.menu-bar--collapsed .menu-bar__item--hide {
  display: none;
}
.menu-bar--collapsed .menu-bar__item--trigger {
  display: inline-block;
  display: flex;
}

.menu-bar {
  opacity: 0;
}
.menu-bar::before {
  display: none;
  content: "collapsed";
}

.menu-bar--loaded {
  opacity: 1;
}

@media (min-width: 32rem) {
  .menu-bar--expanded\@xs::before {
    content: "expanded";
  }
}

@media (min-width: 48rem) {
  .menu-bar--expanded\@sm::before {
    content: "expanded";
  }
}

@media (min-width: 64rem) {
  .menu-bar--expanded\@md::before {
    content: "expanded";
  }
}

@media (min-width: 80rem) {
  .menu-bar--expanded\@lg::before {
    content: "expanded";
  }
}

@media (min-width: 90rem) {
  .menu-bar--expanded\@xl::before {
    content: "expanded";
  }
}

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

File#: _2_morphing-navigation
Title: Morphing Navigation
Descr: Header Template with a morphing dropdown
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --morph-nav-height: 50px;
}
@media (min-width: 64rem) {
  :root {
    --morph-nav-height: 70px;
  }
}

.morph-nav {
  z-index: var(--z-index-header);
  height: var(--morph-nav-height);
}
.morph-nav > * {
  height: 100%;
}

.morph-nav__logo {
  display: block;
  width: 104px;
  height: 30px;
}

.morph-nav__link {
  display: flex;
  align-items: center;
}

.morph-nav__link-figure {
  flex-shrink: 0;
  height: 48px;
  width: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: var(--space-sm);
}

.morph-nav__link-title {
  color: var(--color-contrast-higher);
  font-weight: 500;
}
.morph-nav__link-title .icon {
  opacity: 0;
  transform: translateX(-0.5em);
  transition: opacity 0.2s, transform 0.2s;
}
.morph-nav__link:hover .morph-nav__link-title .icon {
  opacity: 1;
  transform: translateX(0);
}

.morph-nav__link-description {
  color: var(--color-contrast-low);
}

.morph-nav__social-link {
  display: flex;
  align-items: center;
  color: var(--color-contrast-higher);
  font-weight: 500;
  transition: color 0.2s;
}
.morph-nav__social-link .icon {
  margin-right: var(--space-xs);
}
.morph-nav__social-link:hover {
  color: var(--color-primary);
}

/* #region (mobile only) */
.morph-nav__sm-nav {
  position: relative;
  z-index: 2;
  height: 100%;
}

.morph-nav__sm-menu-toggle {
  color: var(--color-contrast-higher);
  --anim-menu-btn-size: 40px;
  /* 🍔 icon */
  --anim-menu-btn-icon-size: 28px;
  --anim-menu-btn-icon-stroke: 2px;
}

.morph-nav__sm-dropdown {
  position: absolute;
  z-index: 1;
  padding-top: var(--morph-nav-height);
  top: 0;
  left: 0;
  width: 100%;
  background-color: var(--color-bg-light);
  box-shadow: var(--shadow-sm);
  transform: scale(0.95);
  transform-origin: top center;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 0.3s, opacity 0.3s, transform 0.3s var(--ease-out);
}
.morph-nav__sm-dropdown a {
  color: inherit;
  text-decoration: none;
}

.morph-nav__sm-dropdown--is-visible {
  transform: scale(1);
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity 0.3s, transform 0.3s var(--ease-out);
}

.morph-nav__sm-dropdown-innner {
  max-height: calc(100vh - var(--morph-nav-height));
  overflow: auto;
}

.morph-nav__sm-label {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-contrast-low);
  margin-bottom: var(--space-md);
}

/* #endregion */
/* #region (desktop only) */
.morph-nav__lg-nav-list {
  display: flex;
  height: 100%;
}

.morph-nav__lg-nav-item {
  height: 100%;
  transition: opacity 0.3s;
}

.morph-nav__lg-nav-list:hover .morph-nav__lg-nav-item:not(:hover) {
  opacity: 0.5;
}

.morph-nav__lg-main-nav-link {
  display: block;
  height: 100%;
  line-height: var(--morph-nav-height);
  color: var(--color-contrast-higher);
  font-size: var(--text-sm);
  font-weight: 500;
  text-decoration: none;
  padding: 0 var(--space-md);
}

.morph-nav__lg-subnav {
  position: absolute;
  top: 100%;
  left: 0;
  transform: translateY(20px);
  pointer-events: none;
  transition: transform 0.3s var(--ease-out);
}

.morph-nav__lg-subnav--is-visible {
  transform: translateY(0px);
  pointer-events: auto;
}

.morph-nav__lg-dropdown-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  visibility: hidden;
  will-change: height, width, transform, visibility;
  transition: visibility 0.3s;
}

.morph-nav__lg-subnav--is-visible .morph-nav__lg-dropdown-wrapper {
  visibility: visible;
}

.morph-nav__lg-dropdown-list {
  position: relative;
  z-index: 2;
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.morph-nav__lg-dropdown-item {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.2s var(--ease-out), visibility 0s 0.3s;
}

.morph-nav__lg-dropdown-item--is-visible {
  opacity: 1;
  visibility: visible;
  z-index: 2;
  transition: opacity 0.3s var(--ease-out);
}

.morph-nav__lg-dropdown-bg {
  display: block;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: var(--color-bg-light);
  border-radius: var(--radius-md);
  box-shadow: var(--inner-glow), var(--shadow-md);
  will-change: visibility, opacity;
  /* hide */
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0.3s, opacity 0.3s var(--ease-out);
  /* triangle marker */
}
.morph-nav__lg-dropdown-bg::before {
  --size: 14px;
  content: "";
  display: block;
  height: var(--size);
  width: var(--size);
  background-color: inherit;
  border: inherit;
  position: absolute;
  z-index: 1;
  top: calc(-1 * var(--size) / 2);
  left: calc(50% - var(--size) / 2);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%);
  transform: translateY(1px) rotate(-45deg);
  border-radius: 0 4px 0 0;
  box-shadow: var(--inner-glow);
}

.morph-nav__lg-dropdown-bg--is-visible {
  opacity: 1;
  visibility: visible;
}

.morph-nav__lg-dropdown a {
  text-decoration: none;
}

.morph-nav__lg-dropdown--1 {
  width: 580px;
}

.morph-nav__lg-dropdown--2 {
  width: 280px;
}

.morph-nav__lg-dropdown--3 {
  width: 460px;
}

/* #endregion */
/* -------------------------------- 

File#: _2_slideshow
Title: Slideshow
Descr: Show a collection of items one at a time
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --slideshow-height: 280px;
  --slideshow-fade-transition-duration: 0.25s;
  --slideshow-slide-transition-duration: 0.35s;
  --slideshow-prx-transition-duration: 0.5s;
  --slideshow-btn-width: 1.6em;
  --slideshow-btn-height: 3.2em;
  --slideshow-btn-icon-size: 1.6em;
  --slideshow-btn-offset: var(--space-xs);
}
@media (min-width: 48rem) {
  :root {
    --slideshow-height: 380px;
  }
}
@media (min-width: 64rem) {
  :root {
    --slideshow-height: 480px;
  }
}
@media (min-width: 80rem) {
  :root {
    --slideshow-height: 580px;
  }
}

.slideshow__item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--slideshow-height);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.slideshow__item:focus {
  outline: none;
}

.slideshow--ratio-16\:9 .slideshow__item {
  height: 0;
  padding-bottom: 56.25%;
}

.slideshow--ratio-4\:3 .slideshow__item {
  height: 0;
  padding-bottom: 75%;
}

.slideshow--ratio-1\:1 .slideshow__item {
  height: 0;
  padding-bottom: 100%;
}

.slideshow {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.slideshow__content {
  overflow: hidden;
}

.slideshow__item {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  visibility: hidden;
}

.slideshow__item--selected {
  position: relative;
  z-index: 3;
  visibility: visible;
}

.slideshow--transition-fade .slideshow__item {
  opacity: 0;
  transition: opacity 0s var(--slideshow-fade-transition-duration), visibility 0s var(--slideshow-fade-transition-duration);
}

.slideshow--transition-fade .slideshow__item--selected {
  opacity: 1;
  transition: opacity var(--slideshow-fade-transition-duration);
}

.slideshow--transition-slide .slideshow__item {
  animation-duration: var(--slideshow-slide-transition-duration);
  animation-fill-mode: forwards;
  animation-timing-function: var(--ease-out);
}
.slideshow--transition-slide .slideshow__item > * {
  visibility: hidden;
}

.slideshow--transition-slide .slideshow__item:not(.slideshow__item--selected) * {
  transition: none;
}

.slideshow--transition-slide .slideshow__item--selected > * {
  visibility: visible;
}

.slideshow--transition-slide .slideshow__item--slide-in-left {
  animation-name: slide-in-left;
}

.slideshow--transition-slide .slideshow__item--slide-in-right {
  animation-name: slide-in-right;
}

.slideshow--transition-slide .slideshow__item--slide-out-left {
  animation-name: slide-out-left;
}

.slideshow--transition-slide .slideshow__item--slide-out-right {
  animation-name: slide-out-right;
}

.slideshow--transition-slide .slideshow__item--slide-out-left,
.slideshow--transition-slide .slideshow__item--slide-out-right {
  z-index: 2;
}
.slideshow--transition-slide .slideshow__item--slide-out-left.slideshow__item--selected,
.slideshow--transition-slide .slideshow__item--slide-out-right.slideshow__item--selected {
  z-index: 3;
}
.slideshow--transition-slide .slideshow__item--slide-out-left > *,
.slideshow--transition-slide .slideshow__item--slide-out-right > * {
  visibility: visible;
}

@keyframes slide-in-left {
  0% {
    visibility: visible;
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes slide-in-right {
  0% {
    visibility: visible;
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes slide-out-left {
  0% {
    visibility: visible;
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes slide-out-right {
  0% {
    visibility: visible;
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.slideshow--transition-prx .slideshow__item {
  animation-duration: var(--slideshow-prx-transition-duration);
  animation-fill-mode: forwards;
  animation-timing-function: var(--ease-out);
}
.slideshow--transition-prx .slideshow__item > * {
  visibility: hidden;
}

.slideshow--transition-prx .slideshow__item--selected > * {
  visibility: visible;
}

.slideshow--transition-prx .slideshow__item--prx-in-left {
  animation-name: prx-in-left;
}

.slideshow--transition-prx .slideshow__item--prx-in-right {
  animation-name: prx-in-right;
}

.slideshow--transition-prx .slideshow__item--prx-out-left {
  animation-name: prx-out-left;
}

.slideshow--transition-prx .slideshow__item--prx-out-right {
  animation-name: prx-out-right;
}

.slideshow--transition-prx .slideshow__item--prx-out-left,
.slideshow--transition-prx .slideshow__item--prx-out-right {
  z-index: 2;
}
.slideshow--transition-prx .slideshow__item--prx-out-left.slideshow__item--selected,
.slideshow--transition-prx .slideshow__item--prx-out-right.slideshow__item--selected {
  z-index: 3;
}
.slideshow--transition-prx .slideshow__item--prx-out-left > *,
.slideshow--transition-prx .slideshow__item--prx-out-right > * {
  visibility: visible;
}

@keyframes prx-in-left {
  0% {
    visibility: visible;
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes prx-in-right {
  0% {
    visibility: visible;
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes prx-out-left {
  0% {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
  }
  100% {
    opacity: 0.3;
    transform: translateX(40%);
  }
}
@keyframes prx-out-right {
  0% {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
  }
  100% {
    opacity: 0.3;
    transform: translateX(-40%);
  }
}
.slideshow[data-swipe=on] .slideshow__content {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.slideshow[data-swipe=on] .slideshow__content img {
  pointer-events: none;
}

.slideshow__control {
  display: none;
}

.slideshow[data-controls=hover] .slideshow__control {
  opacity: 0;
  transition: opacity 0.3s;
}

.slideshow[data-controls=hover]:hover .slideshow__control {
  opacity: 1;
}

.slideshow[data-swipe=on] .slideshow__control {
  display: none;
}

.slideshow__control {
  display: block;
  position: absolute;
  z-index: 4;
  top: 50%;
  transform: translateY(-50%);
}
.slideshow__control:first-of-type {
  left: var(--slideshow-btn-offset);
}
.slideshow__control:last-of-type {
  right: var(--slideshow-btn-offset);
}

@media (min-width: 64rem) {
  .slideshow[data-swipe=on] .slideshow__control {
    display: block;
  }
}
.slideshow__btn {
  display: block;
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.75);
  height: var(--slideshow-btn-height);
  width: var(--slideshow-btn-width);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}
.slideshow__btn:hover {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.85);
}
.slideshow__btn:hover .icon {
  color: var(--color-bg);
}
.slideshow:not(.slideshow--is-animating) .slideshow__btn:active {
  transform: translateY(2px);
}
.slideshow__btn .icon {
  display: block;
  width: var(--slideshow-btn-icon-size);
  height: var(--slideshow-btn-icon-size);
  margin: 0 auto;
  transition: color 0.2s;
  color: var(--color-white);
}
@supports (grid-area: auto) {
  .slideshow__btn {
    background-color: transparent;
  }
  .slideshow__btn .icon {
    color: var(--color-contrast-higher);
  }
}

.slideshow__navigation {
  position: absolute;
  z-index: 4;
  bottom: 0;
  width: 100%;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: transparent;
}

.slideshow__nav-item {
  display: inline-block;
  margin: 0 var(--space-3xs);
}
.slideshow__nav-item button {
  display: block;
  position: relative;
  font-size: 8px;
  color: var(--color-contrast-high);
  height: 1em;
  width: 1em;
  border-radius: 50%;
  background-color: currentColor;
  opacity: 0.4;
  cursor: pointer;
  transition: background 0.3s;
}
.slideshow__nav-item button::before {
  content: "";
  position: absolute;
  top: calc(50% - 0.5em);
  left: calc(50% - 0.5em);
  height: 1em;
  width: 1em;
  font-size: 14px;
  border-radius: inherit;
  border: 1px solid var(--color-contrast-high);
  opacity: 0;
  transform: scale(0);
  transition: 0.3s;
}
.slideshow__nav-item button:focus {
  outline: none;
}
.slideshow__nav-item button:focus::before {
  opacity: 1;
  transform: scale(1);
}

.slideshow__nav-item--selected button {
  opacity: 1;
}

@media (min-width: 64rem) {
  .slideshow__navigation {
    height: 40px;
  }
  .slideshow__nav-item button {
    font-size: 10px;
  }
  .slideshow__nav-item button::before {
    font-size: 16px;
  }
}
/* -------------------------------- 

File#: _2_sticky-sharebar
Title: Sticky Sharebar
Descr: Sticky social sharing bar
Usage: codyhouse.co/license

-------------------------------- */
.sticky-sharebar {
  display: flex;
  align-items: center;
  position: fixed;
  height: 100%;
  top: 0;
  right: var(--space-md);
  pointer-events: none;
  z-index: var(--z-index-fixed-element, 10);
  transition: visibility 0s 0.3s, opacity 0.3s, transform 0.3s var(--ease-in-out);
  transform: translateX(10%);
  opacity: 0;
  visibility: hidden;
}

.sticky-sharebar--on-target {
  transition: visibility 0s, opacity 0.3s, transform 0.3s var(--ease-in-out);
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}

.sticky-sharebar__list {
  pointer-events: auto;
  background-color: hsla(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l), 0.95);
  backdrop-filter: blur(5px);
  border-radius: 50em;
  box-shadow: var(--inner-glow), var(--shadow-md);
  padding: 4px;
}

.sticky-sharebar__btn {
  --size: 2.2em;
  width: var(--size);
  height: var(--size);
  position: relative;
  display: flex;
  border-radius: 50%;
}
.sticky-sharebar__btn .icon {
  position: relative;
  color: var(--color-contrast-medium);
  /* icon color */
  display: block;
  margin: auto;
  z-index: 2;
  transition: color 0.2s;
}
.sticky-sharebar__btn::before {
  /* animated bg */
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border-radius: inherit;
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
  transform: scale(0);
  transition: transform 0.2s var(--ease-out);
}
.sticky-sharebar__btn:hover .icon {
  color: var(--color-contrast-higher);
}
.sticky-sharebar__btn:hover::before {
  transform: scale(1);
}

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

File#: _2_table-of-contents
Title: Table of Contents
Descr: A navigation with a list of links to the main sections of the page 
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --toc-border-width: 1px;
  /* static version only */
}

/* #region (style affecting collapsed + static versions) 👇 */
.toc__list {
  position: relative;
}
.toc__list .toc__list .toc__link {
  padding-left: calc(var(--space-sm) * 2);
  /* offset sub nav */
}

.toc__link,
.toc__label {
  padding: var(--space-3xs) var(--space-sm);
}

.toc__link {
  position: relative;
  color: var(--color-contrast-medium);
  text-decoration: none;
}
.toc__link::before {
  /* left mark */
  content: "";
  width: var(--toc-border-width);
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.toc__link:hover {
  color: var(--color-contrast-high);
}

.toc__link--selected {
  color: var(--color-primary);
}
.toc__link--selected:hover {
  color: var(--color-primary);
}

.toc__label {
  /* label style */
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: var(--text-sm);
}

.toc__control {
  /* control button */
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.toc__control-text {
  /* text inside control button */
  position: relative;
}
.toc__control-text > * {
  display: inline-block;
  transition: opacity 0.4s, transform 0.4s var(--ease-out);
}
.toc__control-text > *:last-child {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
}

.toc__icon-arrow {
  /* arrow icon  */
}
.toc__icon-arrow .icon__group {
  will-change: transform;
  transform-origin: 8px 8px;
  transition: transform 0.3s var(--ease-out);
}
.toc__icon-arrow .icon__group > * {
  transform-origin: 8px 8px;
  stroke-dasharray: 17;
  transform: translateY(3px);
  transition: transform 0.3s, stroke-dashoffset 0.3s;
  transition-timing-function: var(--ease-out);
}
.toc__icon-arrow .icon__group > *:first-child {
  stroke-dashoffset: 10;
}
.toc__icon-arrow .icon__group > *:last-child {
  stroke-dashoffset: 10;
}

.toc-content__target {
  scroll-margin-top: var(--space-4xs);
}

/* #endregion */
/* #region (collapsed version only - mobile 👇) */
.toc:not(.toc--static) {
  border-radius: var(--radius-md);
  background-color: var(--color-bg-light);
  box-shadow: var(--inner-glow), var(--shadow-sm);
  transition: 0.3s;
}
.toc:not(.toc--static):hover {
  box-shadow: var(--inner-glow), var(--shadow-md);
}
.toc:not(.toc--static) .toc__nav {
  /* navigation */
  display: none;
  margin: var(--space-2xs) 0;
}
.toc:not(.toc--static) .toc__list {
  padding-bottom: var(--space-xs);
}
.toc:not(.toc--static) .toc__label {
  display: none;
}
.toc:not(.toc--static) .toc__link {
  display: flex;
}
.toc:not(.toc--static).toc--expanded .toc__control-text > *:first-child {
  transform: translateY(10px);
  opacity: 0;
  pointer-events: none;
}
.toc:not(.toc--static).toc--expanded .toc__control-text > *:last-child {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.toc:not(.toc--static).toc--expanded .toc__nav {
  display: block;
  animation: toc-entry-animation 0.4s var(--ease-out);
}
.toc:not(.toc--static).toc--expanded .toc__icon-arrow .icon__group {
  /* animate arrow icon */
  transform: rotate(-90deg);
}
.toc:not(.toc--static).toc--expanded .toc__icon-arrow .icon__group > *:first-child,
.toc:not(.toc--static).toc--expanded .toc__icon-arrow .icon__group *:last-child {
  stroke-dashoffset: 0;
  transform: translateY(0px);
}

/* #endregion */
/* #region (static version only - desktop 👇) */
.toc--static {
  box-shadow: inset var(--toc-border-width) 0 0 var(--color-contrast-lower);
  /* left border */
}
.toc--static[class*=position-sticky] {
  top: var(--space-md);
  /* used if position = sticky */
  max-height: calc(100vh - var(--space-md) * 2);
  /* set max height */
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.toc--static .toc__label {
  font-size: var(--text-xs);
}
.toc--static .toc__link {
  display: inline-flex;
  font-size: var(--text-sm);
}
.toc--static .toc__link--selected::before {
  background-color: var(--color-primary);
}
.toc--static .toc__control {
  /* control - static version only */
  display: none;
}

.toc-content--toc-static *:target {
  animation: toc-target 2s;
  /* highlight section on target */
}

/* #endregion */
@keyframes toc-target {
  0%, 50% {
    outline: 2px solid hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0.5);
  }
  100% {
    outline: 2px solid hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), 0);
  }
}
@keyframes toc-entry-animation {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/* used in JS - detect when the TOC needs to switch from a collapsed to a static version */
[class*=toc--static]::before {
  display: none;
  content: "collapsed";
}

@media (min-width: 32rem) {
  .toc--static\@xs::before {
    content: "static";
  }
}
@media (min-width: 48rem) {
  .toc--static\@sm::before {
    content: "static";
  }
}
@media (min-width: 64rem) {
  .toc--static\@md::before {
    content: "static";
  }
}
@media (min-width: 80rem) {
  .toc--static\@lg::before {
    content: "static";
  }
}
@media (min-width: 90rem) {
  .toc--static\@xl::before {
    content: "static";
  }
}
/* -------------------------------- 

File#: _3_article-v3
Title: Article v3
Descr: Article template
Usage: codyhouse.co/license

-------------------------------- */
.t-article-v3__hero {
  background-color: var(--color-contrast-lower);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: var(--space-2xl) 0;
  clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% - 2em), 0% 100%);
}

.t-article-v3__intro-text {
  padding: var(--space-md);
  color: var(--color-bg);
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.75);
  backdrop-filter: blur(10px);
  border-radius: var(--radius-lg);
}
.t-article-v3__intro-text p {
  opacity: 0.75;
}

.t-article-v3__divider {
  display: flex;
  align-items: center;
}
.t-article-v3__divider span {
  display: block;
  margin: 0 var(--space-xs);
  height: 10px;
  width: 10px;
  transform: rotate(45deg);
  background-color: var(--color-contrast-low);
}
.t-article-v3__divider::before, .t-article-v3__divider::after {
  content: "";
  display: block;
  height: 1px;
  width: auto;
  flex-grow: 1;
  background-color: var(--color-contrast-lower);
}

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

File#: _3_carousel-v2
Title: Carousel v2
Descr: Display a list of items and navigate through them
Usage: codyhouse.co/license

-------------------------------- */
.carousel-v2 {
  --carousel-grid-gap: var(--space-md);
  --carousel-item-auto-size: 320px;
  --carousel-transition-duration: 0.5s;
}
.carousel-v2 .carousel__wrapper:hover .carousel-v2__control {
  opacity: 1;
}

.carousel-v2__control {
  --size: 30px;
  height: var(--size);
  width: var(--size);
  border-radius: 50%;
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.7);
  backdrop-filter: blur(10px);
  pointer-events: auto;
  cursor: pointer;
  margin: 0 var(--space-2xs);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.2s;
}
.carousel-v2__control:hover {
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.9);
}
.carousel-v2__control[disabled] {
  display: none;
}
.carousel-v2__control:active {
  transform: translateY(2px);
}
.carousel-v2__control .icon {
  --size: 20px;
  display: block;
  color: var(--color-white);
}
@media (min-width: 64rem) {
  .carousel-v2__control {
    opacity: 0;
  }
}

.carousel-v2__navigation {
  display: none;
  grid-template-columns: repeat(auto-fit, 52px);
  grid-gap: var(--space-xs);
  justify-content: center;
  align-items: center;
  margin-top: var(--space-sm);
}

@media (min-width: 64rem) {
  .carousel-v2__navigation {
    display: grid;
  }
}
.carousel-v2__navigation-item {
  display: inline-block;
  margin: 0 var(--space-3xs);
}
@supports (grid-area: auto) {
  .carousel-v2__navigation-item {
    margin: 0;
  }
}
.carousel-v2__navigation-item:not(.carousel-v2__navigation-item--selected) button {
  cursor: pointer;
}
.carousel-v2__navigation-item button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 52px;
  height: 24px;
}
.carousel-v2__navigation-item button::before {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), 0.2);
}
.carousel-v2__navigation-item:not(.carousel-v2__navigation-item--selected) button:hover::before {
  background-color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), 0.4);
  transition: 0.2s;
}

.carousel-v2__navigation-item--selected button::before {
  background-color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), 1);
}

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

File#: _3_expandable-img-gallery
Title: Expandable Image Gallery
Descr: Image gallery that expands in a modal media gallery on click
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --exp-gallery-animation-duration: 0.3s;
}

.exp-gallery-item-hidden {
  opacity: 0;
}

.exp-lightbox {
  transition: background var(--exp-gallery-animation-duration);
}
.exp-lightbox .menu-bar {
  --menu-bar-button-size: 2.2em;
  --menu-bar-icon-size: 1.2em;
  --menu-bar-horizontal-gap: var(--space-2xs);
  --menu-bar-vertical-gap: 4px;
  --menu-bar-label-size: var(--text-xs);
}
.exp-lightbox .slideshow {
  --slideshow-btn-width: 1.6em;
  --slideshow-btn-height: 3.2em;
  --slideshow-btn-icon-size: 1.6em;
  --slideshow-btn-offset: var(--space-md);
}
.exp-lightbox .slideshow__content {
  position: relative;
}
.exp-lightbox:not(.modal--is-visible) {
  background-color: transparent;
}

.exp-lightbox__content {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.exp-lightbox__header {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-xs) var(--space-md) 0;
}

.exp-lightbox__title {
  font-size: var(--text-md);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-right: var(--space-sm);
}

.exp-lightbox__body {
  position: relative;
  z-index: 1;
  flex-grow: 1;
  padding: var(--space-md);
}
@media (min-width: 64rem) {
  .exp-lightbox__body {
    padding-top: var(--space-xs);
    padding-bottom: var(--space-xs);
    padding-right: calc(var(--space-xs) + var(--slideshow-btn-width) + var(--slideshow-btn-offset));
    padding-left: calc(var(--space-xs) + var(--slideshow-btn-width) + var(--slideshow-btn-offset));
  }
}

.exp-lightbox {
  --slideshow-height: 100%;
}
.exp-lightbox .slideshow {
  display: flex;
  align-items: stretch;
}
.exp-lightbox .slideshow__content {
  flex-grow: 1;
}

.exp-lightbox--no-transition .slideshow__content * {
  transition: none !important;
  animation: none !important;
}

.exp-lightbox__media {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: 100%;
}

.exp-lightbox__media-outer {
  position: relative;
  width: 100%;
  flex-grow: 1;
}
.slideshow__content--hide .exp-lightbox__media-outer {
  opacity: 0;
}

.exp-lightbox__media-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.exp-lightbox__media-inner img {
  display: inline-block;
  height: auto;
  width: auto;
  max-height: 100%;
}

.exp-lightbox.modal--is-visible .slideshow[data-swipe=on] .exp-lightbox__media-inner img {
  pointer-events: auto;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.exp-lightbox__caption {
  flex-shrink: 0;
  text-align: center;
  max-width: 600px;
  margin-top: var(--space-xs);
  font-size: var(--text-sm);
}

.exp-lightbox__media-outer {
  min-height: 200px;
}
@supports (display: flex) {
  .exp-lightbox__media-outer {
    min-height: 0;
  }
}

.exp-lightbox__clone-img-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--z-index-overlay, 15);
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transform-origin: top left;
  transition: transform var(--exp-gallery-animation-duration) var(--ease-out);
  will-change: transform;
}
.exp-lightbox__clone-img-wrapper svg,
.exp-lightbox__clone-img-wrapper rect,
.exp-lightbox__clone-img-wrapper image {
  height: 100%;
  width: 100%;
}

.exp-lightbox__clone-img-wrapper--is-visible {
  visibility: visible;
  opacity: 1;
}

.exp-lightbox__body[data-zoom=on] .exp-lightbox__media-inner img {
  cursor: zoom-in;
}

.exp-lightbox__zoom {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 3;
  overflow: auto;
  background-color: var(--color-bg);
  cursor: zoom-out;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0s 0.3s, visibility 0s 0.3s;
}
.exp-lightbox__zoom img {
  display: block;
  width: 100%;
  max-width: none;
  transform-origin: top left;
  transition: transform 0.3s;
}

.exp-lightbox__zoom--no-transition img {
  transition: none;
}

.exp-lightbox__zoom--is-visible {
  opacity: 1;
  visibility: visible;
  transition: none;
}

.exp-gallery img {
  display: block;
  width: 100%;
  transition: opacity 0.3s;
}
.exp-gallery img:hover {
  cursor: pointer;
  opacity: 0.85;
}

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

File#: _3_light-dark-switch
Title: Light/Dark Switch
Descr: Color theme switcher
Usage: codyhouse.co/license

-------------------------------- */
.ld-switch-btn {
  position: relative;
  width: 24px;
  height: 24px;
  overflow: hidden;
  display: inline-block;
  transition: opacity 0.2s, color 0.2s;
}
.ld-switch-btn:hover {
  cursor: pointer;
  opacity: 0.8;
}
.ld-switch-btn:focus {
  outline: none;
  color: var(--color-primary);
}

.ld-switch-btn.popover-control--active {
  /* class added to the control button when the dropdown is visible */
  color: var(--color-primary);
}

.ld-switch-btn__icon-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transform: translateY(100%) rotate(35deg) scale(0.5);
}

.ld-switch-btn__icon-wrapper--in {
  opacity: 1;
  transform: translateY(0) rotate(0) scale(1);
}

.ld-switch-btn__icon-wrapper--out {
  opacity: 0;
  transform: translateY(-100%) rotate(-35deg) scale(0.5);
}

.ld-switch-btn__icon-wrapper--in,
.ld-switch-btn__icon-wrapper--out {
  transition: transform 0.3s var(--ease-in-out), opacity 0.3s;
}

.ld-switch-btn__icon {
  margin: auto;
  --size: 20px; /* icon size */
}

.popover.ld-switch-popover {
  --popover-width: 250px;
}

.ld-switch-popover__option {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: opacity 0.2s;
}
.ld-switch-popover__option:hover {
  cursor: pointer;
  opacity: 0.85;
}
.ld-switch-popover__option:focus {
  outline: none;
}
.ld-switch-popover__option:focus figure {
  box-shadow: 0 0 0 1px var(--color-bg-light), 0 0 0 3px var(--color-contrast-higher);
}
.ld-switch-popover__option[aria-selected=true] {
  color: var(--color-primary);
}
.ld-switch-popover__option[aria-selected=true] figure {
  box-shadow: 0 0 0 1px var(--color-bg-light), 0 0 0 3px currentColor;
}

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

File#: _3_main-header-v2
Title: Main Header v2
Descr: Accessible website navigation w/ sub navigations
Usage: codyhouse.co/license

-------------------------------- */
:root {
  --header-v2-height: 50px;
}
@media (min-width: 80rem) {
  :root {
    --header-v2-height: 70px;
  }
}

.header-v2 {
  width: 100%;
}

.header-v2, .header-v2__wrapper {
  position: relative;
  z-index: var(--z-index-header, 3);
  height: var(--header-v2-height);
}

.header-v2__container {
  display: flex;
  position: relative;
  height: 100%;
  align-items: center;
  justify-content: space-between;
}

.header-v2__logo {
  flex-shrink: 0;
}
.header-v2__logo a, .header-v2__logo svg {
  display: block;
}

.header-v2__nav-control {
  --anim-menu-btn-size: 40px;
  --anim-menu-btn-icon-size: 24px;
  --anim-menu-btn-icon-stroke: 2px;
}

.header-v2__nav {
  top: var(--header-v2-height);
  left: 0;
  width: 100%;
  padding: var(--space-sm);
  background-color: var(--color-bg-light);
  border-radius: var(--radius-md);
  box-shadow: var(--inner-glow), var(--shadow-md);
  z-index: var(--z-index-popover, 5);
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.header-v2__nav--is-visible {
  clip: auto;
  clip-path: none;
  height: auto;
  max-height: calc(100vh - var(--header-v2-height) - var(--space-md));
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  visibility: visible;
}

.header-v2__nav-list--main:nth-child(2) {
  border-top: 1px solid var(--color-contrast-lower);
  margin-top: var(--space-md);
  padding-top: var(--space-md);
}

.header-v2__nav-item .btn {
  width: 100%;
  font-size: var(--text-sm);
  margin: var(--space-2xs) 0;
}

.header-v2__nav-item--main {
  margin-bottom: var(--space-sm);
}

.header-v2__nav-item--label {
  font-size: 0.9rem;
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--color-black);
  padding: var(--space-2xs) 0;
}

.header-v2__nav-item--divider {
  height: 1px;
  background-color: var(--color-contrast-lower);
  margin: var(--space-md) 0;
}

.header-v2__nav-item--search-btn {
  display: none;
}

.header-v2__nav-dropdown-icon {
  display: none;
}

.header-v2__nav-link {
  display: flex;
  align-items: center;
  padding: var(--space-xs) 0;
  font-size: var(--text-sm);
  text-decoration: none;
  color: var(--color-contrast-high);
}
.header-v2__nav-link:hover, .header-v2__nav-link[aria-current] {
  color: var(--color-contrast-higher);
}

.header-v2__nav-dropdown {
  padding-left: var(--space-sm);
}

.header-v2__nav-list--title-desc .header-v2__nav-link {
  display: flex;
}
.header-v2__nav-list--title-desc .header-v2__nav-link .header-v2__nav-icon {
  margin-right: var(--space-xs);
  flex-shrink: 0;
}
.header-v2__nav-list--title-desc .header-v2__nav-link strong {
  display: block;
}
.header-v2__nav-list--title-desc .header-v2__nav-link small {
  color: var(--color-contrast-medium);
}
.header-v2__nav-list--title-desc .header-v2__nav-link:hover small {
  color: var(--color-contrast-high);
}

.header-v2__nav-col-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: var(--space-sm);
}

@media (min-width: 80rem) {
  .header-v2[data-animation=on] .header-v2__wrapper--is-fixed {
    position: fixed;
    top: calc(-1 * var(--header-v2-height));
    left: 0;
    width: 100%;
    background-color: var(--color-bg);
    z-index: var(--z-index-fixed-element, 10);
    transition: transform 0.2s;
  }
  .header-v2[data-animation=on] .header-v2__wrapper--slides-down {
    transform: translateY(100%);
    box-shadow: var(--shadow-sm);
  }
  .header-v2__nav-control {
    display: none;
  }
  .header-v2__logo {
    margin-right: var(--space-sm);
  }
  .header-v2__nav {
    position: static;
    clip: auto;
    clip-path: none;
    height: auto;
    max-height: none;
    overflow: visible;
    overscroll-behavior: auto;
    visibility: visible;
    padding: 0;
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    justify-content: space-between;
  }
  .header-v2__nav-list--main {
    display: flex;
    align-items: center;
  }
  .header-v2__nav-item {
    position: relative;
  }
  .header-v2__nav-item .btn {
    width: auto;
    font-size: 1rem;
    margin: 0;
  }
  .header-v2__nav-item--main {
    display: inline-block;
    margin-bottom: 0;
    margin-left: var(--space-md);
  }
  .header-v2__nav-item--main > .header-v2__nav-link {
    padding: var(--space-2xs) 0;
    font-size: 1rem;
    font-weight: 500;
  }
  .header-v2__nav-item--main.header-v2__nav-item--divider {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 0;
    width: 1px;
    height: 1em;
  }
  .header-v2__nav-list--main:last-child {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
  }
  .header-v2__nav-dropdown-icon {
    display: block;
  }
  .header-v2__nav-item--search {
    display: none;
  }
  .header-v2__nav-item--search-btn {
    display: inline-block;
  }
  .header-v2__nav-item--search-btn button, .header-v2__nav-item--search-btn .icon {
    display: block;
  }
  .header-v2__nav-item--search-btn button {
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.2s;
    cursor: pointer;
  }
  .header-v2__nav-item--search-btn button:hover {
    opacity: 0.65;
  }
  .header-v2__nav-dropdown {
    --space-unit: 1rem;
    position: absolute;
    top: 100%;
    left: calc(50% - 100px);
    z-index: var(--z-index-popover, 5);
    width: 200px;
    background-color: var(--color-bg-light);
    border-radius: var(--radius-md);
    box-shadow: var(--inner-glow), var(--shadow-md);
    padding: var(--space-2xs) 0;
    transition: opacity 0.2s, visibility 0.2s;
    visibility: hidden;
    opacity: 0;
  }
  .header-v2__nav-dropdown .header-v2__nav-link, .header-v2__nav-dropdown .header-v2__nav-item--label {
    padding-left: var(--space-xs);
    padding-right: var(--space-xs);
  }
  .header-v2__nav-dropdown .header-v2__nav-link:hover,
  .header-v2__nav-dropdown .header-v2__nav-link--hover {
    background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075);
  }
  .header-v2__nav-dropdown .header-v2__nav-dropdown--nested {
    left: 100%;
    top: calc(var(--space-xs) * -1);
  }
  .header-v2__nav-dropdown .header-v2__nav-dropdown--nested-left {
    left: auto;
    right: 100%;
  }
  .header-v2__nav-dropdown .header-v2__nav-item--divider {
    margin: var(--space-xs) 0;
  }
  .header-v2__nav-dropdown--sm {
    width: 200px;
    left: calc(50% - 100px);
  }
  .header-v2__nav-dropdown--md {
    width: 400px;
    left: calc(50% - 150px);
  }
  .header-v2__nav-dropdown--lg {
    width: 480px;
    left: calc(50% - 240px);
  }
  .header-v2__nav-list--title-desc .header-v2__nav-link {
    padding: var(--space-xs) var(--space-sm);
  }
  .header-v2__nav-list--is-visible,
  .header-v2__nav-item--has-children:hover > .header-v2__nav-dropdown {
    visibility: visible;
    opacity: 1;
  }
}
/* -------------------------------- 

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: 60px;
  }
}

.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-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.1);
  /* border bottom */
}

/* change mega-nav style if menu = expanded */
.mega-nav--expanded {
  background-color: var(--color-bg);
}

.mega-nav__container {
  width: calc(100% - 2 * var(--space-md));
  height: 100%;
  max-width: var(--mega-nav-content-max-width);
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* logo */
.mega-nav__logo {
  display: block;
  width: 104px;
  /* logo width */
  height: 30px;
  /* logo height */
}
.mega-nav__logo > * {
  /* logo SVG */
  width: inherit;
  height: inherit;
}

/* mobile buttons */
.mega-nav__icon-btns {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}

.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;
}
.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: transform 0.3s var(--ease-in-out), stroke-dashoffset 0.3s, opacity 0.3s;
}

/* animated menu button */
.mega-nav__icon-btn--menu .icon__group > * {
  stroke-dasharray: 24;
}
.mega-nav__icon-btn--menu .icon__group > *:nth-child(1) {
  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) {
  transform-origin: 12px 18px;
}
.mega-nav__icon-btn--menu.mega-nav__icon-btn--state-b .icon__group > *:nth-child(1) {
  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) {
  transform: translateY(-6px) rotate(45deg);
}

/* animated search button */
.mega-nav__icon-btn--search .icon__group {
  transform-origin: 12px 12px;
  transform: rotate(0deg);
  transition: 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) {
  transform-origin: 9.5px 9.5px;
  transform: rotate(45deg);
  stroke-dashoffset: 84;
  stroke-dasharray: 42;
  opacity: 1;
}
.mega-nav__icon-btn--search.mega-nav__icon-btn--state-b .icon__group {
  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;
  transform-origin: 8px 8px;
  transition: transform 0.3s var(--ease-out);
}
.mega-nav__arrow-icon .icon__group > * {
  stroke-dasharray: 17;
  transform-origin: 8px 8px;
  transform: translateY(3px);
  transition: transform 0.3s, stroke-dashoffset 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);
}

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

--mobile - style affecting only small screens 👇

-------------------------------- */
.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 > * {
  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(--space-md));
  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 {
  /* sub navigation */
}
.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-link {
  /* sub link */
  display: block;
  color: var(--color-contrast-higher);
  text-decoration: none;
  padding: var(--space-2xs) 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__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 {
  transform: translateY(-3px) rotate(-90deg);
}
.mega-nav--mobile .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group > *:last-child {
  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 > * {
  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}

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

--desktop - style affecting only big screens 👇

-------------------------------- */
.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;
  background-color: var(--color-contrast-higher);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
}
.mega-nav--desktop .mega-nav__control .mega-nav__arrow-icon {
  margin-left: var(--space-2xs);
}
.mega-nav--desktop .mega-nav__control:hover {
  cursor: pointer;
  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__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(--space-md));
  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-2xs);
}
.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;
}
.mega-nav--desktop .mega-nav__quick-link {
  /* search quick links */
  display: inline-block;
  margin-bottom: var(--space-2xs);
  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-2 {
  /* layout 2 -> multi lists -- customize the menu flyout*/
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--space-sm);
  margin-top: var(--space-xs);
  margin-bottom: var(--space-xs);
  padding: var(--space-sm);
}
.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-md);
}
.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 {
  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}
.mega-nav--desktop {
  /* icon animation on click */
}
.mega-nav--desktop:not([data-hover=on]) .mega-nav__item--expanded .mega-nav__arrow-icon .icon__group {
  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;
  transform: translateY(0px);
}
.mega-nav--desktop {
  /* icon buttons */
}
.mega-nav--desktop .mega-nav__icon-btn {
  border-radius: 50%;
  margin-left: var(--space-4xs);
}
.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 {
  animation: mega-nav-entry-animation 0.5s var(--ease-out);
}

/* animations */
@keyframes mega-nav-entry-animation {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    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";
  }
}
/*! purgecss end ignore */
/* variables */
:root {
  /* spacing */
  --space-4xs: clamp(0.125rem, calc(0.125rem + 0vw), 0.125rem);
  --space-3xs: clamp(0.25rem, calc(0.25rem + 0vw), 0.25rem);
  --space-2xs: clamp(0.5rem, calc(0.5rem + 0vw), 0.5rem);
  --space-xs: clamp(0.75rem, calc(0.75rem + 0vw), 0.75rem);
  --space-sm: clamp(1rem, calc(1rem + 0vw), 1rem);
  --space-md: clamp(1.5rem, calc(1.125rem + 0.78125vw), 1.75rem);
  --space-lg: clamp(2.25rem, calc(1.125rem + 2.34375vw), 3rem);
  --space-xl: clamp(3.5rem, calc(1.25rem + 4.6875vw), 5rem);
  --space-2xl: clamp(5.75rem, calc(2.375rem + 7.03125vw), 8rem);
  --space-3xl: clamp(9.25rem, calc(4.75rem + 9.375vw), 12.25rem);
  --space-4xl: clamp(15rem, calc(7.5rem + 15.625vw), 20rem);
  /* font-family */
  --font-primary: system-ui, sans-serif;
  /* font-size */
  --text-xs: clamp(0.6875rem, calc(0.59375rem + 0.1953125vw), 0.75rem);
  --text-sm: clamp(0.8125rem, calc(0.625rem + 0.390625vw), 0.9375rem);
  --text-base: clamp(1rem, calc(0.925rem + 0.15625vw), 1.05rem);
  --text-md: clamp(1.1875rem, calc(1.05625rem + 0.2734375vw), 1.275rem);
  --text-lg: clamp(1.4375rem, calc(1.45625rem + -0.0390625vw), 1.425rem);
  --text-xl: clamp(1.75rem, calc(1.375rem + 0.78125vw), 2rem);
  --text-2xl: clamp(2.0625rem, calc(1.40625rem + 1.3671875vw), 2.5rem);
  --text-3xl: clamp(2.5rem, calc(1.75rem + 1.5625vw), 3rem);
  --text-4xl: clamp(3rem, calc(2.0625rem + 1.953125vw), 3.625rem);
  /* line-height */
  --line-height-xs: 1.1;
  --line-height-sm: 1.2;
  --line-height-md: 1.4;
  --line-height-lg: 1.58;
  --line-height-xl: 1.72;
  /* max-width */
  --max-width-3xs: 20rem;
  --max-width-2xs: 26rem;
  --max-width-xs: 32rem;
  --max-width-sm: 48rem;
  --max-width-md: 64rem;
  --max-width-lg: 80rem;
  --max-width-xl: 90rem;
  --container-margin-x: var(--space-md);
  /* box-shadow */
  --shadow-ring: 0 0 0 1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.05);
  --shadow-xs: 0 0 0 1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.02), 0 1px 3px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2);
  --shadow-sm: 0 0.3px 0.4px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.02), 0 0.9px 1.5px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.045), 0 3.5px 6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.09);
  --shadow-md: 0 0.9px 1.25px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.025), 0 3px 5px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.05), 0 12px 20px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.09);
  --shadow-lg: 0 1.2px 1.9px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.01), 0 3px 5px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.015), 0 8px 15px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.05), 0 28px 40px -1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.1);
  --shadow-xl: 0 1.5px 2.1px -6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.009), 0 3.6px 5.2px -6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.0115), 0 7.3px 10.6px -6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.0125), 0 16.2px 21.9px -6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.025), 0 46px 60px -6px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.15);
  /* inner-glow */
  --inner-glow: inset 0 0 0.5px 1px hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.075);
  --inner-glow-top: inset 0 1px 0.5px hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), 0.075);
  /* border-radius */
  --radius-sm: 0.1875em;
  --radius-md: 0.375em;
  --radius-lg: 0.75em;
  /* z-index */
  --z-index-header: 3;
  --z-index-popover: 5;
  --z-index-fixed-element: 10;
  --z-index-overlay: 15;
  /* timing functions */
  --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);
}

/* colors */
:root, [data-theme=default] {
  --color-primary-darker-h: 202;
  --color-primary-darker-s: 81%;
  --color-primary-darker-l: 25%;
  --color-primary-darker: hsl(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l));
  --color-primary-dark-h: 202;
  --color-primary-dark-s: 81%;
  --color-primary-dark-l: 31%;
  --color-primary-dark: hsl(var(--color-primary-dark-h), var(--color-primary-dark-s), var(--color-primary-dark-l));
  --color-primary-h: 202;
  --color-primary-s: 81%;
  --color-primary-l: 37%;
  --color-primary: hsl(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l));
  --color-primary-light-h: 202;
  --color-primary-light-s: 81%;
  --color-primary-light-l: 43%;
  --color-primary-light: hsl(var(--color-primary-light-h), var(--color-primary-light-s), var(--color-primary-light-l));
  --color-primary-lighter-h: 202;
  --color-primary-lighter-s: 81%;
  --color-primary-lighter-l: 49%;
  --color-primary-lighter: hsl(var(--color-primary-lighter-h), var(--color-primary-lighter-s), var(--color-primary-lighter-l));
  --color-accent-darker-h: 148;
  --color-accent-darker-s: 62%;
  --color-accent-darker-l: 20%;
  --color-accent-darker: hsl(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l));
  --color-accent-dark-h: 148;
  --color-accent-dark-s: 62%;
  --color-accent-dark-l: 26%;
  --color-accent-dark: hsl(var(--color-accent-dark-h), var(--color-accent-dark-s), var(--color-accent-dark-l));
  --color-accent-h: 148;
  --color-accent-s: 62%;
  --color-accent-l: 32%;
  --color-accent: hsl(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l));
  --color-accent-light-h: 148;
  --color-accent-light-s: 62%;
  --color-accent-light-l: 38%;
  --color-accent-light: hsl(var(--color-accent-light-h), var(--color-accent-light-s), var(--color-accent-light-l));
  --color-accent-lighter-h: 148;
  --color-accent-lighter-s: 62%;
  --color-accent-lighter-l: 44%;
  --color-accent-lighter: hsl(var(--color-accent-lighter-h), var(--color-accent-lighter-s), var(--color-accent-lighter-l));
  --color-black-h: 230;
  --color-black-s: 13%;
  --color-black-l: 9%;
  --color-black: hsl(var(--color-black-h), var(--color-black-s), var(--color-black-l));
  --color-white-h: 0;
  --color-white-s: 0%;
  --color-white-l: 100%;
  --color-white: hsl(var(--color-white-h), var(--color-white-s), var(--color-white-l));
  --color-warning-darker-h: 35;
  --color-warning-darker-s: 79%;
  --color-warning-darker-l: 48%;
  --color-warning-darker: hsl(var(--color-warning-darker-h), var(--color-warning-darker-s), var(--color-warning-darker-l));
  --color-warning-dark-h: 35;
  --color-warning-dark-s: 79%;
  --color-warning-dark-l: 56%;
  --color-warning-dark: hsl(var(--color-warning-dark-h), var(--color-warning-dark-s), var(--color-warning-dark-l));
  --color-warning-h: 35;
  --color-warning-s: 79%;
  --color-warning-l: 66%;
  --color-warning: hsl(var(--color-warning-h), var(--color-warning-s), var(--color-warning-l));
  --color-warning-light-h: 35;
  --color-warning-light-s: 79%;
  --color-warning-light-l: 74%;
  --color-warning-light: hsl(var(--color-warning-light-h), var(--color-warning-light-s), var(--color-warning-light-l));
  --color-warning-lighter-h: 35;
  --color-warning-lighter-s: 79%;
  --color-warning-lighter-l: 82%;
  --color-warning-lighter: hsl(var(--color-warning-lighter-h), var(--color-warning-lighter-s), var(--color-warning-lighter-l));
  --color-success-darker-h: 170;
  --color-success-darker-s: 78%;
  --color-success-darker-l: 26%;
  --color-success-darker: hsl(var(--color-success-darker-h), var(--color-success-darker-s), var(--color-success-darker-l));
  --color-success-dark-h: 170;
  --color-success-dark-s: 78%;
  --color-success-dark-l: 31%;
  --color-success-dark: hsl(var(--color-success-dark-h), var(--color-success-dark-s), var(--color-success-dark-l));
  --color-success-h: 170;
  --color-success-s: 78%;
  --color-success-l: 36%;
  --color-success: hsl(var(--color-success-h), var(--color-success-s), var(--color-success-l));
  --color-success-light-h: 170;
  --color-success-light-s: 78%;
  --color-success-light-l: 42%;
  --color-success-light: hsl(var(--color-success-light-h), var(--color-success-light-s), var(--color-success-light-l));
  --color-success-lighter-h: 170;
  --color-success-lighter-s: 78%;
  --color-success-lighter-l: 47%;
  --color-success-lighter: hsl(var(--color-success-lighter-h), var(--color-success-lighter-s), var(--color-success-lighter-l));
  --color-error-darker-h: 342;
  --color-error-darker-s: 89%;
  --color-error-darker-l: 38%;
  --color-error-darker: hsl(var(--color-error-darker-h), var(--color-error-darker-s), var(--color-error-darker-l));
  --color-error-dark-h: 342;
  --color-error-dark-s: 89%;
  --color-error-dark-l: 43%;
  --color-error-dark: hsl(var(--color-error-dark-h), var(--color-error-dark-s), var(--color-error-dark-l));
  --color-error-h: 342;
  --color-error-s: 89%;
  --color-error-l: 48%;
  --color-error: hsl(var(--color-error-h), var(--color-error-s), var(--color-error-l));
  --color-error-light-h: 342;
  --color-error-light-s: 89%;
  --color-error-light-l: 56%;
  --color-error-light: hsl(var(--color-error-light-h), var(--color-error-light-s), var(--color-error-light-l));
  --color-error-lighter-h: 342;
  --color-error-lighter-s: 89%;
  --color-error-lighter-l: 62%;
  --color-error-lighter: hsl(var(--color-error-lighter-h), var(--color-error-lighter-s), var(--color-error-lighter-l));
  --color-bg-darker-h: 240;
  --color-bg-darker-s: 4%;
  --color-bg-darker-l: 90%;
  --color-bg-darker: hsl(var(--color-bg-darker-h), var(--color-bg-darker-s), var(--color-bg-darker-l));
  --color-bg-dark-h: 240;
  --color-bg-dark-s: 4%;
  --color-bg-dark-l: 95%;
  --color-bg-dark: hsl(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l));
  --color-bg-h: 0;
  --color-bg-s: 0%;
  --color-bg-l: 100%;
  --color-bg: hsl(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l));
  --color-bg-light-h: 0;
  --color-bg-light-s: 0%;
  --color-bg-light-l: 100%;
  --color-bg-light: hsl(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l));
  --color-bg-lighter-h: 0;
  --color-bg-lighter-s: 0%;
  --color-bg-lighter-l: 100%;
  --color-bg-lighter: hsl(var(--color-bg-lighter-h), var(--color-bg-lighter-s), var(--color-bg-lighter-l));
  --color-contrast-lower-h: 240;
  --color-contrast-lower-s: 4%;
  --color-contrast-lower-l: 85%;
  --color-contrast-lower: hsl(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l));
  --color-contrast-low-h: 240;
  --color-contrast-low-s: 4%;
  --color-contrast-low-l: 65%;
  --color-contrast-low: hsl(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l));
  --color-contrast-medium-h: 225;
  --color-contrast-medium-s: 4%;
  --color-contrast-medium-l: 47%;
  --color-contrast-medium: hsl(var(--color-contrast-medium-h), var(--color-contrast-medium-s), var(--color-contrast-medium-l));
  --color-contrast-high-h: 230;
  --color-contrast-high-s: 7%;
  --color-contrast-high-l: 23%;
  --color-contrast-high: hsl(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l));
  --color-contrast-higher-h: 230;
  --color-contrast-higher-s: 13%;
  --color-contrast-higher-l: 9%;
  --color-contrast-higher: hsl(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l));
}

[data-theme=dark] {
  --color-primary-darker-h: 250;
  --color-primary-darker-s: 100%;
  --color-primary-darker-l: 60%;
  --color-primary-darker: hsl(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l));
  --color-primary-dark-h: 250;
  --color-primary-dark-s: 100%;
  --color-primary-dark-l: 64%;
  --color-primary-dark: hsl(var(--color-primary-dark-h), var(--color-primary-dark-s), var(--color-primary-dark-l));
  --color-primary-h: 250;
  --color-primary-s: 100%;
  --color-primary-l: 69%;
  --color-primary: hsl(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l));
  --color-primary-light-h: 250;
  --color-primary-light-s: 100%;
  --color-primary-light-l: 72%;
  --color-primary-light: hsl(var(--color-primary-light-h), var(--color-primary-light-s), var(--color-primary-light-l));
  --color-primary-lighter-h: 250;
  --color-primary-lighter-s: 100%;
  --color-primary-lighter-l: 76%;
  --color-primary-lighter: hsl(var(--color-primary-lighter-h), var(--color-primary-lighter-s), var(--color-primary-lighter-l));
  --color-accent-darker-h: 342;
  --color-accent-darker-s: 92%;
  --color-accent-darker-l: 41%;
  --color-accent-darker: hsl(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l));
  --color-accent-dark-h: 342;
  --color-accent-dark-s: 92%;
  --color-accent-dark-l: 47%;
  --color-accent-dark: hsl(var(--color-accent-dark-h), var(--color-accent-dark-s), var(--color-accent-dark-l));
  --color-accent-h: 342;
  --color-accent-s: 92%;
  --color-accent-l: 54%;
  --color-accent: hsl(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l));
  --color-accent-light-h: 342;
  --color-accent-light-s: 92%;
  --color-accent-light-l: 60%;
  --color-accent-light: hsl(var(--color-accent-light-h), var(--color-accent-light-s), var(--color-accent-light-l));
  --color-accent-lighter-h: 342;
  --color-accent-lighter-s: 92%;
  --color-accent-lighter-l: 65%;
  --color-accent-lighter: hsl(var(--color-accent-lighter-h), var(--color-accent-lighter-s), var(--color-accent-lighter-l));
  --color-black-h: 230;
  --color-black-s: 13%;
  --color-black-l: 9%;
  --color-black: hsl(var(--color-black-h), var(--color-black-s), var(--color-black-l));
  --color-white-h: 0;
  --color-white-s: 0%;
  --color-white-l: 100%;
  --color-white: hsl(var(--color-white-h), var(--color-white-s), var(--color-white-l));
  --color-warning-darker-h: 35;
  --color-warning-darker-s: 79%;
  --color-warning-darker-l: 48%;
  --color-warning-darker: hsl(var(--color-warning-darker-h), var(--color-warning-darker-s), var(--color-warning-darker-l));
  --color-warning-dark-h: 35;
  --color-warning-dark-s: 79%;
  --color-warning-dark-l: 56%;
  --color-warning-dark: hsl(var(--color-warning-dark-h), var(--color-warning-dark-s), var(--color-warning-dark-l));
  --color-warning-h: 35;
  --color-warning-s: 79%;
  --color-warning-l: 66%;
  --color-warning: hsl(var(--color-warning-h), var(--color-warning-s), var(--color-warning-l));
  --color-warning-light-h: 35;
  --color-warning-light-s: 79%;
  --color-warning-light-l: 74%;
  --color-warning-light: hsl(var(--color-warning-light-h), var(--color-warning-light-s), var(--color-warning-light-l));
  --color-warning-lighter-h: 35;
  --color-warning-lighter-s: 79%;
  --color-warning-lighter-l: 82%;
  --color-warning-lighter: hsl(var(--color-warning-lighter-h), var(--color-warning-lighter-s), var(--color-warning-lighter-l));
  --color-success-darker-h: 170;
  --color-success-darker-s: 78%;
  --color-success-darker-l: 26%;
  --color-success-darker: hsl(var(--color-success-darker-h), var(--color-success-darker-s), var(--color-success-darker-l));
  --color-success-dark-h: 170;
  --color-success-dark-s: 78%;
  --color-success-dark-l: 31%;
  --color-success-dark: hsl(var(--color-success-dark-h), var(--color-success-dark-s), var(--color-success-dark-l));
  --color-success-h: 170;
  --color-success-s: 78%;
  --color-success-l: 36%;
  --color-success: hsl(var(--color-success-h), var(--color-success-s), var(--color-success-l));
  --color-success-light-h: 170;
  --color-success-light-s: 78%;
  --color-success-light-l: 42%;
  --color-success-light: hsl(var(--color-success-light-h), var(--color-success-light-s), var(--color-success-light-l));
  --color-success-lighter-h: 170;
  --color-success-lighter-s: 78%;
  --color-success-lighter-l: 47%;
  --color-success-lighter: hsl(var(--color-success-lighter-h), var(--color-success-lighter-s), var(--color-success-lighter-l));
  --color-error-darker-h: 342;
  --color-error-darker-s: 92%;
  --color-error-darker-l: 41%;
  --color-error-darker: hsl(var(--color-error-darker-h), var(--color-error-darker-s), var(--color-error-darker-l));
  --color-error-dark-h: 342;
  --color-error-dark-s: 92%;
  --color-error-dark-l: 47%;
  --color-error-dark: hsl(var(--color-error-dark-h), var(--color-error-dark-s), var(--color-error-dark-l));
  --color-error-h: 342;
  --color-error-s: 92%;
  --color-error-l: 54%;
  --color-error: hsl(var(--color-error-h), var(--color-error-s), var(--color-error-l));
  --color-error-light-h: 342;
  --color-error-light-s: 92%;
  --color-error-light-l: 60%;
  --color-error-light: hsl(var(--color-error-light-h), var(--color-error-light-s), var(--color-error-light-l));
  --color-error-lighter-h: 342;
  --color-error-lighter-s: 92%;
  --color-error-lighter-l: 65%;
  --color-error-lighter: hsl(var(--color-error-lighter-h), var(--color-error-lighter-s), var(--color-error-lighter-l));
  --color-bg-darker-h: 232;
  --color-bg-darker-s: 7%;
  --color-bg-darker-l: 8%;
  --color-bg-darker: hsl(var(--color-bg-darker-h), var(--color-bg-darker-s), var(--color-bg-darker-l));
  --color-bg-dark-h: 233;
  --color-bg-dark-s: 8%;
  --color-bg-dark-l: 11%;
  --color-bg-dark: hsl(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l));
  --color-bg-h: 232;
  --color-bg-s: 11%;
  --color-bg-l: 15%;
  --color-bg: hsl(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l));
  --color-bg-light-h: 233;
  --color-bg-light-s: 8%;
  --color-bg-light-l: 19%;
  --color-bg-light: hsl(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l));
  --color-bg-lighter-h: 232;
  --color-bg-lighter-s: 7%;
  --color-bg-lighter-l: 22%;
  --color-bg-lighter: hsl(var(--color-bg-lighter-h), var(--color-bg-lighter-s), var(--color-bg-lighter-l));
  --color-contrast-lower-h: 240;
  --color-contrast-lower-s: 6%;
  --color-contrast-lower-l: 26%;
  --color-contrast-lower: hsl(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l));
  --color-contrast-low-h: 240;
  --color-contrast-low-s: 3%;
  --color-contrast-low-l: 41%;
  --color-contrast-low: hsl(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l));
  --color-contrast-medium-h: 231;
  --color-contrast-medium-s: 3%;
  --color-contrast-medium-l: 57%;
  --color-contrast-medium: hsl(var(--color-contrast-medium-h), var(--color-contrast-medium-s), var(--color-contrast-medium-l));
  --color-contrast-high-h: 240;
  --color-contrast-high-s: 5%;
  --color-contrast-high-l: 82%;
  --color-contrast-high: hsl(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l));
  --color-contrast-higher-h: 240;
  --color-contrast-higher-s: 100%;
  --color-contrast-higher-l: 99%;
  --color-contrast-higher: hsl(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l));
}

/* gradients */
:root, [data-theme=default] {
  --gradient-primary-stop-1-h: 190;
  --gradient-primary-stop-1-s: 100%;
  --gradient-primary-stop-1-l: 50%,0.7;
  --gradient-primary-stop-1: hsl(190, 100%, 50%, 0.7);
  --gradient-primary-stop-2-h: 250;
  --gradient-primary-stop-2-s: 100%;
  --gradient-primary-stop-2-l: 5%;
  --gradient-primary-stop-2: hsl(250, 100%, 5%);
}

[data-theme=dark] {
  --gradient-primary-stop-1-h: 250;
  --gradient-primary-stop-1-s: 100%;
  --gradient-primary-stop-1-l: 69%;
  --gradient-primary-stop-1: hsl(250, 100%, 69%);
  --gradient-primary-stop-2-h: 342;
  --gradient-primary-stop-2-s: 92%;
  --gradient-primary-stop-2-l: 54%;
  --gradient-primary-stop-2: hsl(342, 92%, 54%);
}

/* grid */
.grid {
  --grid-columns: 12;
  --column-gap: 0px;
  --row-gap: 0px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--row-gap) var(--column-gap);
}

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

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

.col-1 {
  --column-span: 1;
}

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

.col-2 {
  --column-span: 2;
}

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

.col-3 {
  --column-span: 3;
}

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

.col-4 {
  --column-span: 4;
}

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

.col-5 {
  --column-span: 5;
}

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

.col-6 {
  --column-span: 6;
}

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

.col-7 {
  --column-span: 7;
}

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

.col-8 {
  --column-span: 8;
}

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

.col-9 {
  --column-span: 9;
}

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

.col-10 {
  --column-span: 10;
}

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

.col-11 {
  --column-span: 11;
}

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

.col-12 {
  --column-span: 12;
}

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

.col {
  width: auto;
  flex: 1 1 0;
}

.col-content {
  width: auto;
  flex: 0 1 auto;
}

.offset-1 {
  --column-offset: 1;
}

.offset-2 {
  --column-offset: 2;
}

.offset-3 {
  --column-offset: 3;
}

.offset-4 {
  --column-offset: 4;
}

.offset-5 {
  --column-offset: 5;
}

.offset-6 {
  --column-offset: 6;
}

.offset-7 {
  --column-offset: 7;
}

.offset-8 {
  --column-offset: 8;
}

.offset-9 {
  --column-offset: 9;
}

.offset-10 {
  --column-offset: 10;
}

.offset-11 {
  --column-offset: 11;
}

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

/* gap */
.gap-4xs {
  --row-gap: var(--space-4xs);
  --column-gap: var(--space-4xs);
  gap: var(--row-gap) var(--column-gap);
}

.gap-x-4xs {
  --column-gap: var(--space-4xs);
  -moz-column-gap: var(--column-gap);
       column-gap: var(--column-gap);
}

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

.gap-3xs {
  --row-gap: var(--space-3xs);
  --column-gap: var(--space-3xs);
  gap: var(--row-gap) var(--column-gap);
}

.gap-x-3xs {
  --column-gap: var(--space-3xs);
  -moz-column-gap: var(--column-gap);
       column-gap: var(--column-gap);
}

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

.gap-2xs {
  --row-gap: var(--space-2xs);
  --column-gap: var(--space-2xs);
  gap: var(--row-gap) var(--column-gap);
}

.gap-x-2xs {
  --column-gap: var(--space-2xs);
  -moz-column-gap: var(--column-gap);
       column-gap: var(--column-gap);
}

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

.gap-xs {
  --row-gap: var(--space-xs);
  --column-gap: var(--space-xs);
  gap: var(--row-gap) var(--column-gap);
}

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

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

.gap-sm {
  --row-gap: var(--space-sm);
  --column-gap: var(--space-sm);
  gap: var(--row-gap) var(--column-gap);
}

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

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

.gap-md {
  --row-gap: var(--space-md);
  --column-gap: var(--space-md);
  gap: var(--row-gap) var(--column-gap);
}

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

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

.gap-lg {
  --row-gap: var(--space-lg);
  --column-gap: var(--space-lg);
  gap: var(--row-gap) var(--column-gap);
}

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

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

.gap-xl {
  --row-gap: var(--space-xl);
  --column-gap: var(--space-xl);
  gap: var(--row-gap) var(--column-gap);
}

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

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

.gap-2xl {
  --row-gap: var(--space-2xl);
  --column-gap: var(--space-2xl);
  gap: var(--row-gap) var(--column-gap);
}

.gap-x-2xl {
  --column-gap: var(--space-2xl);
  -moz-column-gap: var(--column-gap);
       column-gap: var(--column-gap);
}

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

.gap-3xl {
  --row-gap: var(--space-3xl);
  --column-gap: var(--space-3xl);
  gap: var(--row-gap) var(--column-gap);
}

.gap-x-3xl {
  --column-gap: var(--space-3xl);
  -moz-column-gap: var(--column-gap);
       column-gap: var(--column-gap);
}

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

.gap-4xl {
  --row-gap: var(--space-4xl);
  --column-gap: var(--space-4xl);
  gap: var(--row-gap) var(--column-gap);
}

.gap-x-4xl {
  --column-gap: var(--space-4xl);
  -moz-column-gap: var(--column-gap);
       column-gap: var(--column-gap);
}

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

.gap-0 {
  --row-gap: 0px;
  --column-gap: 0px;
  gap: 0px;
}

.gap-x-0 {
  --column-gap: 0px;
  -moz-column-gap: 0px;
       column-gap: 0px;
}

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

/* flexbox */
.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-content */
.justify-start {
  justify-content: start;
}

.justify-end {
  justify-content: end;
}

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

.justify-between {
  justify-content: space-between;
}

/* align-items */
.items-center {
  align-items: center;
}

.items-start {
  align-items: start;
}

.items-end {
  align-items: end;
}

.items-baseline {
  align-items: baseline;
}

.items-stretch {
  align-items: stretch;
}

/* align-content */
.content-start {
  align-content: start;
}

.content-end {
  align-content: end;
}

.content-center {
  align-content: center;
}

.content-between {
  align-content: space-between;
}

/* order */
.order-1 {
  order: 1;
}

.order-2 {
  order: 2;
}

.order-3 {
  order: 3;
}

/* aspect-ratio */
.aspect-ratio-16\:9 {
  aspect-ratio: 16/9;
}

.aspect-ratio-3\:2 {
  aspect-ratio: 3/2;
}

.aspect-ratio-4\:3 {
  aspect-ratio: 4/3;
}

.aspect-ratio-5\:4 {
  aspect-ratio: 5/4;
}

.aspect-ratio-1\:1 {
  aspect-ratio: 1/1;
}

.aspect-ratio-4\:5 {
  aspect-ratio: 4/5;
}

.aspect-ratio-3\:4 {
  aspect-ratio: 3/4;
}

.aspect-ratio-2\:3 {
  aspect-ratio: 2/3;
}

.aspect-ratio-9\:16 {
  aspect-ratio: 9/16;
}

/* media wrapper */
:where([class^=media-wrapper], [class*=" media-wrapper"]) {
  position: relative;
}

[class^=media-wrapper], [class*=" media-wrapper"] {
  height: 0;
}

[class^=media-wrapper] > *,
[class*=" media-wrapper"] > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

[class^=media-wrapper] > *:not(iframe),
[class*=" media-wrapper"] > *:not(iframe) {
  -o-object-fit: cover;
     object-fit: cover;
}

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

.media-wrapper-3\:2 {
  padding-bottom: 66.6666666667%;
}

.media-wrapper-4\:3 {
  padding-bottom: 75%;
}

.media-wrapper-1\:1 {
  padding-bottom: 100%;
}

/* display */
.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.contents {
  display: contents;
}

.css-grid {
  display: grid;
}

.css-inline-grid {
  display: inline-grid;
}

.hide {
  display: none;
}

.is-visible {
  display: var(--display, block) !important;
}

.is-hidden {
  display: none !important;
}

/* margin */
.margin-4xs {
  margin: var(--space-4xs);
}

.margin-3xs {
  margin: var(--space-3xs);
}

.margin-2xs {
  margin: var(--space-2xs);
}

.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-2xl {
  margin: var(--space-2xl);
}

.margin-3xl {
  margin: var(--space-3xl);
}

.margin-4xl {
  margin: var(--space-4xl);
}

.margin-auto {
  margin: auto;
}

.margin-0 {
  margin: 0;
}

.margin-y-4xs {
  margin-top: var(--space-4xs);
  margin-bottom: var(--space-4xs);
}

.margin-x-4xs {
  margin-right: var(--space-4xs);
  margin-left: var(--space-4xs);
}

.margin-y-3xs {
  margin-top: var(--space-3xs);
  margin-bottom: var(--space-3xs);
}

.margin-x-3xs {
  margin-right: var(--space-3xs);
  margin-left: var(--space-3xs);
}

.margin-y-2xs {
  margin-top: var(--space-2xs);
  margin-bottom: var(--space-2xs);
}

.margin-x-2xs {
  margin-right: var(--space-2xs);
  margin-left: var(--space-2xs);
}

.margin-y-xs {
  margin-top: var(--space-xs);
  margin-bottom: var(--space-xs);
}

.margin-x-xs {
  margin-right: var(--space-xs);
  margin-left: var(--space-xs);
}

.margin-y-sm {
  margin-top: var(--space-sm);
  margin-bottom: var(--space-sm);
}

.margin-x-sm {
  margin-right: var(--space-sm);
  margin-left: var(--space-sm);
}

.margin-y-md {
  margin-top: var(--space-md);
  margin-bottom: var(--space-md);
}

.margin-x-md {
  margin-right: var(--space-md);
  margin-left: var(--space-md);
}

.margin-y-lg {
  margin-top: var(--space-lg);
  margin-bottom: var(--space-lg);
}

.margin-x-lg {
  margin-right: var(--space-lg);
  margin-left: var(--space-lg);
}

.margin-y-xl {
  margin-top: var(--space-xl);
  margin-bottom: var(--space-xl);
}

.margin-x-xl {
  margin-right: var(--space-xl);
  margin-left: var(--space-xl);
}

.margin-y-2xl {
  margin-top: var(--space-2xl);
  margin-bottom: var(--space-2xl);
}

.margin-x-2xl {
  margin-right: var(--space-2xl);
  margin-left: var(--space-2xl);
}

.margin-y-3xl {
  margin-top: var(--space-3xl);
  margin-bottom: var(--space-3xl);
}

.margin-x-3xl {
  margin-right: var(--space-3xl);
  margin-left: var(--space-3xl);
}

.margin-y-4xl {
  margin-top: var(--space-4xl);
  margin-bottom: var(--space-4xl);
}

.margin-x-4xl {
  margin-right: var(--space-4xl);
  margin-left: var(--space-4xl);
}

.margin-y-auto {
  margin-top: auto;
  margin-bottom: auto;
}

.margin-y-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.margin-x-auto {
  margin-left: auto;
  margin-right: auto;
}

.margin-x-0 {
  margin-left: 0;
  margin-right: 0;
}

.margin-top-4xs {
  margin-top: var(--space-4xs);
}

.margin-right-4xs {
  margin-right: var(--space-4xs);
}

.margin-bottom-4xs {
  margin-bottom: var(--space-4xs);
}

.margin-left-4xs {
  margin-left: var(--space-4xs);
}

.margin-top-3xs {
  margin-top: var(--space-3xs);
}

.margin-right-3xs {
  margin-right: var(--space-3xs);
}

.margin-bottom-3xs {
  margin-bottom: var(--space-3xs);
}

.margin-left-3xs {
  margin-left: var(--space-3xs);
}

.margin-top-2xs {
  margin-top: var(--space-2xs);
}

.margin-right-2xs {
  margin-right: var(--space-2xs);
}

.margin-bottom-2xs {
  margin-bottom: var(--space-2xs);
}

.margin-left-2xs {
  margin-left: var(--space-2xs);
}

.margin-top-xs {
  margin-top: var(--space-xs);
}

.margin-right-xs {
  margin-right: var(--space-xs);
}

.margin-bottom-xs {
  margin-bottom: var(--space-xs);
}

.margin-left-xs {
  margin-left: var(--space-xs);
}

.margin-top-sm {
  margin-top: var(--space-sm);
}

.margin-right-sm {
  margin-right: var(--space-sm);
}

.margin-bottom-sm {
  margin-bottom: var(--space-sm);
}

.margin-left-sm {
  margin-left: var(--space-sm);
}

.margin-top-md {
  margin-top: var(--space-md);
}

.margin-right-md {
  margin-right: var(--space-md);
}

.margin-bottom-md {
  margin-bottom: var(--space-md);
}

.margin-left-md {
  margin-left: var(--space-md);
}

.margin-top-lg {
  margin-top: var(--space-lg);
}

.margin-right-lg {
  margin-right: var(--space-lg);
}

.margin-bottom-lg {
  margin-bottom: var(--space-lg);
}

.margin-left-lg {
  margin-left: var(--space-lg);
}

.margin-top-xl {
  margin-top: var(--space-xl);
}

.margin-right-xl {
  margin-right: var(--space-xl);
}

.margin-bottom-xl {
  margin-bottom: var(--space-xl);
}

.margin-left-xl {
  margin-left: var(--space-xl);
}

.margin-top-2xl {
  margin-top: var(--space-2xl);
}

.margin-right-2xl {
  margin-right: var(--space-2xl);
}

.margin-bottom-2xl {
  margin-bottom: var(--space-2xl);
}

.margin-left-2xl {
  margin-left: var(--space-2xl);
}

.margin-top-3xl {
  margin-top: var(--space-3xl);
}

.margin-right-3xl {
  margin-right: var(--space-3xl);
}

.margin-bottom-3xl {
  margin-bottom: var(--space-3xl);
}

.margin-left-3xl {
  margin-left: var(--space-3xl);
}

.margin-top-4xl {
  margin-top: var(--space-4xl);
}

.margin-right-4xl {
  margin-right: var(--space-4xl);
}

.margin-bottom-4xl {
  margin-bottom: var(--space-4xl);
}

.margin-left-4xl {
  margin-left: var(--space-4xl);
}

.margin-top-auto {
  margin-top: auto;
}

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

.margin-right-auto {
  margin-right: auto;
}

.margin-right-0 {
  margin-right: 0;
}

.margin-bottom-auto {
  margin-bottom: auto;
}

.margin-bottom-0 {
  margin-bottom: 0;
}

.margin-left-auto {
  margin-left: auto;
}

.margin-left-0 {
  margin-left: 0;
}

/* padding */
.padding-4xs {
  padding: var(--space-4xs);
}

.padding-3xs {
  padding: var(--space-3xs);
}

.padding-2xs {
  padding: var(--space-2xs);
}

.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-2xl {
  padding: var(--space-2xl);
}

.padding-3xl {
  padding: var(--space-3xl);
}

.padding-4xl {
  padding: var(--space-4xl);
}

.padding-0 {
  padding: 0;
}

.padding-y-4xs {
  padding-top: var(--space-4xs);
  padding-bottom: var(--space-4xs);
}

.padding-x-4xs {
  padding-right: var(--space-4xs);
  padding-left: var(--space-4xs);
}

.padding-y-3xs {
  padding-top: var(--space-3xs);
  padding-bottom: var(--space-3xs);
}

.padding-x-3xs {
  padding-right: var(--space-3xs);
  padding-left: var(--space-3xs);
}

.padding-y-2xs {
  padding-top: var(--space-2xs);
  padding-bottom: var(--space-2xs);
}

.padding-x-2xs {
  padding-right: var(--space-2xs);
  padding-left: var(--space-2xs);
}

.padding-y-xs {
  padding-top: var(--space-xs);
  padding-bottom: var(--space-xs);
}

.padding-x-xs {
  padding-right: var(--space-xs);
  padding-left: var(--space-xs);
}

.padding-y-sm {
  padding-top: var(--space-sm);
  padding-bottom: var(--space-sm);
}

.padding-x-sm {
  padding-right: var(--space-sm);
  padding-left: var(--space-sm);
}

.padding-y-md {
  padding-top: var(--space-md);
  padding-bottom: var(--space-md);
}

.padding-x-md {
  padding-right: var(--space-md);
  padding-left: var(--space-md);
}

.padding-y-lg {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
}

.padding-x-lg {
  padding-right: var(--space-lg);
  padding-left: var(--space-lg);
}

.padding-y-xl {
  padding-top: var(--space-xl);
  padding-bottom: var(--space-xl);
}

.padding-x-xl {
  padding-right: var(--space-xl);
  padding-left: var(--space-xl);
}

.padding-y-2xl {
  padding-top: var(--space-2xl);
  padding-bottom: var(--space-2xl);
}

.padding-x-2xl {
  padding-right: var(--space-2xl);
  padding-left: var(--space-2xl);
}

.padding-y-3xl {
  padding-top: var(--space-3xl);
  padding-bottom: var(--space-3xl);
}

.padding-x-3xl {
  padding-right: var(--space-3xl);
  padding-left: var(--space-3xl);
}

.padding-y-4xl {
  padding-top: var(--space-4xl);
  padding-bottom: var(--space-4xl);
}

.padding-x-4xl {
  padding-right: var(--space-4xl);
  padding-left: var(--space-4xl);
}

.padding-y-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.padding-x-0 {
  padding-left: 0;
  padding-right: 0;
}

.padding-top-4xs {
  padding-top: var(--space-4xs);
}

.padding-right-4xs {
  padding-right: var(--space-4xs);
}

.padding-bottom-4xs {
  padding-bottom: var(--space-4xs);
}

.padding-left-4xs {
  padding-left: var(--space-4xs);
}

.padding-top-3xs {
  padding-top: var(--space-3xs);
}

.padding-right-3xs {
  padding-right: var(--space-3xs);
}

.padding-bottom-3xs {
  padding-bottom: var(--space-3xs);
}

.padding-left-3xs {
  padding-left: var(--space-3xs);
}

.padding-top-2xs {
  padding-top: var(--space-2xs);
}

.padding-right-2xs {
  padding-right: var(--space-2xs);
}

.padding-bottom-2xs {
  padding-bottom: var(--space-2xs);
}

.padding-left-2xs {
  padding-left: var(--space-2xs);
}

.padding-top-xs {
  padding-top: var(--space-xs);
}

.padding-right-xs {
  padding-right: var(--space-xs);
}

.padding-bottom-xs {
  padding-bottom: var(--space-xs);
}

.padding-left-xs {
  padding-left: var(--space-xs);
}

.padding-top-sm {
  padding-top: var(--space-sm);
}

.padding-right-sm {
  padding-right: var(--space-sm);
}

.padding-bottom-sm {
  padding-bottom: var(--space-sm);
}

.padding-left-sm {
  padding-left: var(--space-sm);
}

.padding-top-md {
  padding-top: var(--space-md);
}

.padding-right-md {
  padding-right: var(--space-md);
}

.padding-bottom-md {
  padding-bottom: var(--space-md);
}

.padding-left-md {
  padding-left: var(--space-md);
}

.padding-top-lg {
  padding-top: var(--space-lg);
}

.padding-right-lg {
  padding-right: var(--space-lg);
}

.padding-bottom-lg {
  padding-bottom: var(--space-lg);
}

.padding-left-lg {
  padding-left: var(--space-lg);
}

.padding-top-xl {
  padding-top: var(--space-xl);
}

.padding-right-xl {
  padding-right: var(--space-xl);
}

.padding-bottom-xl {
  padding-bottom: var(--space-xl);
}

.padding-left-xl {
  padding-left: var(--space-xl);
}

.padding-top-2xl {
  padding-top: var(--space-2xl);
}

.padding-right-2xl {
  padding-right: var(--space-2xl);
}

.padding-bottom-2xl {
  padding-bottom: var(--space-2xl);
}

.padding-left-2xl {
  padding-left: var(--space-2xl);
}

.padding-top-3xl {
  padding-top: var(--space-3xl);
}

.padding-right-3xl {
  padding-right: var(--space-3xl);
}

.padding-bottom-3xl {
  padding-bottom: var(--space-3xl);
}

.padding-left-3xl {
  padding-left: var(--space-3xl);
}

.padding-top-4xl {
  padding-top: var(--space-4xl);
}

.padding-right-4xl {
  padding-right: var(--space-4xl);
}

.padding-bottom-4xl {
  padding-bottom: var(--space-4xl);
}

.padding-left-4xl {
  padding-left: var(--space-4xl);
}

.padding-top-0 {
  padding-top: 0;
}

.padding-right-0 {
  padding-right: 0;
}

.padding-bottom-0 {
  padding-bottom: 0;
}

.padding-left-0 {
  padding-left: 0;
}

/* vertical-align */
.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;
}

/* typography */
.truncate, .text-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;
}

/* font-size */
.text-xs {
  font-size: var(--text-xs);
}

.text-sm {
  font-size: var(--text-sm);
}

.text-base {
  font-size: var(--text-base);
}

.text-md {
  font-size: var(--text-md);
}

.text-lg {
  font-size: var(--text-lg);
}

.text-xl {
  font-size: var(--text-xl);
}

.text-2xl {
  font-size: var(--text-2xl);
}

.text-3xl {
  font-size: var(--text-3xl);
}

.text-4xl {
  font-size: var(--text-4xl);
}

/* text-transform */
.text-uppercase {
  text-transform: uppercase;
}

.text-capitalize {
  text-transform: capitalize;
}

/* letter-spacing */
.letter-spacing-xs {
  letter-spacing: -0.1em;
}

.letter-spacing-sm {
  letter-spacing: -0.05em;
}

.letter-spacing-md {
  letter-spacing: 0.05em;
}

.letter-spacing-lg {
  letter-spacing: 0.1em;
}

.letter-spacing-xl {
  letter-spacing: 0.2em;
}

/* font-weight */
.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 {
  font-weight: 700;
}

.font-extrabold {
  font-weight: 800;
}

.font-black {
  font-weight: 900;
}

/* font-style */
.font-italic {
  font-style: italic;
}

/* font-smooth */
.font-smooth {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.font-primary {
  font-family: var(--font-primary);
}

/* text-align */
.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

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

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

/* text-decoration */
.text-line-through {
  text-decoration: line-through;
}

.text-underline {
  text-decoration: underline;
}

.text-decoration-none {
  text-decoration: none;
}

/* text-shadow */
.text-shadow-xs {
  text-shadow: 0 1px 1px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.15);
}

.text-shadow-sm {
  text-shadow: 0 1px 2px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.25);
}

.text-shadow-md {
  text-shadow: 0 1px 2px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.1), 0 2px 4px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2);
}

.text-shadow-lg {
  text-shadow: 0 1px 4px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.1), 0 2px 8px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.15), 0 4px 16px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2);
}

.text-shadow-xl {
  text-shadow: 0 1px 4px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.1), 0 2px 8px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.15), 0 4px 16px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.2), 0 6px 24px hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), 0.25);
}

.text-shadow-none {
  text-shadow: none;
}

/* text-indent */
.text-indent-sm {
  text-indent: 0.5em;
}

.text-indent-md {
  text-indent: 1em;
}

.text-indent-lg {
  text-indent: 1.5em;
}

/* line-height */
.line-height-normal {
  line-height: normal;
}

.line-height-1 {
  line-height: 1;
}

.line-height-xs {
  line-height: var(--line-height-xs);
}

.line-height-sm {
  line-height: var(--line-height-sm);
}

.line-height-md {
  line-height: var(--line-height-md);
}

.line-height-lg {
  line-height: var(--line-height-lg);
}

.line-height-xl {
  line-height: var(--line-height-xl);
}

/* line-clamp */
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.line-clamp-4 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

/* white-space */
.ws-nowrap {
  white-space: nowrap;
}

/* column-count */
.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;
}

/* list-style */
.list-style-none {
  list-style: none;
}

/* cursor */
.cursor-pointer {
  cursor: pointer;
}

.cursor-default {
  cursor: default;
}

/* pointer-events */
.pointer-events-auto {
  pointer-events: auto;
}

.pointer-events-none {
  pointer-events: none;
}

/* user-select */
.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;
}

/* color */
[class^=color-], [class*=" color-"] {
  --color-opacity: 1;
}

.color-inherit {
  color: inherit;
}

.color-primary-darker {
  color: hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), var(--color-opacity, 1));
}

.color-primary-dark {
  color: hsla(var(--color-primary-dark-h), var(--color-primary-dark-s), var(--color-primary-dark-l), var(--color-opacity, 1));
}

.color-primary {
  color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), var(--color-opacity, 1));
}

.color-primary-light {
  color: hsla(var(--color-primary-light-h), var(--color-primary-light-s), var(--color-primary-light-l), var(--color-opacity, 1));
}

.color-primary-lighter {
  color: hsla(var(--color-primary-lighter-h), var(--color-primary-lighter-s), var(--color-primary-lighter-l), var(--color-opacity, 1));
}

.color-accent-darker {
  color: hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), var(--color-opacity, 1));
}

.color-accent-dark {
  color: hsla(var(--color-accent-dark-h), var(--color-accent-dark-s), var(--color-accent-dark-l), var(--color-opacity, 1));
}

.color-accent {
  color: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), var(--color-opacity, 1));
}

.color-accent-light {
  color: hsla(var(--color-accent-light-h), var(--color-accent-light-s), var(--color-accent-light-l), var(--color-opacity, 1));
}

.color-accent-lighter {
  color: hsla(var(--color-accent-lighter-h), var(--color-accent-lighter-s), var(--color-accent-lighter-l), var(--color-opacity, 1));
}

.color-black {
  color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), var(--color-opacity, 1));
}

.color-white {
  color: hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), var(--color-opacity, 1));
}

.color-warning-darker {
  color: hsla(var(--color-warning-darker-h), var(--color-warning-darker-s), var(--color-warning-darker-l), var(--color-opacity, 1));
}

.color-warning-dark {
  color: hsla(var(--color-warning-dark-h), var(--color-warning-dark-s), var(--color-warning-dark-l), var(--color-opacity, 1));
}

.color-warning {
  color: hsla(var(--color-warning-h), var(--color-warning-s), var(--color-warning-l), var(--color-opacity, 1));
}

.color-warning-light {
  color: hsla(var(--color-warning-light-h), var(--color-warning-light-s), var(--color-warning-light-l), var(--color-opacity, 1));
}

.color-warning-lighter {
  color: hsla(var(--color-warning-lighter-h), var(--color-warning-lighter-s), var(--color-warning-lighter-l), var(--color-opacity, 1));
}

.color-success-darker {
  color: hsla(var(--color-success-darker-h), var(--color-success-darker-s), var(--color-success-darker-l), var(--color-opacity, 1));
}

.color-success-dark {
  color: hsla(var(--color-success-dark-h), var(--color-success-dark-s), var(--color-success-dark-l), var(--color-opacity, 1));
}

.color-success {
  color: hsla(var(--color-success-h), var(--color-success-s), var(--color-success-l), var(--color-opacity, 1));
}

.color-success-light {
  color: hsla(var(--color-success-light-h), var(--color-success-light-s), var(--color-success-light-l), var(--color-opacity, 1));
}

.color-success-lighter {
  color: hsla(var(--color-success-lighter-h), var(--color-success-lighter-s), var(--color-success-lighter-l), var(--color-opacity, 1));
}

.color-error-darker {
  color: hsla(var(--color-error-darker-h), var(--color-error-darker-s), var(--color-error-darker-l), var(--color-opacity, 1));
}

.color-error-dark {
  color: hsla(var(--color-error-dark-h), var(--color-error-dark-s), var(--color-error-dark-l), var(--color-opacity, 1));
}

.color-error {
  color: hsla(var(--color-error-h), var(--color-error-s), var(--color-error-l), var(--color-opacity, 1));
}

.color-error-light {
  color: hsla(var(--color-error-light-h), var(--color-error-light-s), var(--color-error-light-l), var(--color-opacity, 1));
}

.color-error-lighter {
  color: hsla(var(--color-error-lighter-h), var(--color-error-lighter-s), var(--color-error-lighter-l), var(--color-opacity, 1));
}

.color-bg-darker {
  color: hsla(var(--color-bg-darker-h), var(--color-bg-darker-s), var(--color-bg-darker-l), var(--color-opacity, 1));
}

.color-bg-dark {
  color: hsla(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l), var(--color-opacity, 1));
}

.color-bg {
  color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), var(--color-opacity, 1));
}

.color-bg-light {
  color: hsla(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l), var(--color-opacity, 1));
}

.color-bg-lighter {
  color: hsla(var(--color-bg-lighter-h), var(--color-bg-lighter-s), var(--color-bg-lighter-l), var(--color-opacity, 1));
}

.color-contrast-lower {
  color: hsla(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l), var(--color-opacity, 1));
}

.color-contrast-low {
  color: hsla(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l), var(--color-opacity, 1));
}

.color-contrast-medium {
  color: hsla(var(--color-contrast-medium-h), var(--color-contrast-medium-s), var(--color-contrast-medium-l), var(--color-opacity, 1));
}

.color-contrast-high {
  color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), var(--color-opacity, 1));
}

.color-contrast-higher {
  color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--color-opacity, 1));
}

.color-opacity-0 {
  --color-opacity: 0;
}

.color-opacity-5\% {
  --color-opacity: 0.05;
}

.color-opacity-10\% {
  --color-opacity: 0.1;
}

.color-opacity-15\% {
  --color-opacity: 0.15;
}

.color-opacity-20\% {
  --color-opacity: 0.2;
}

.color-opacity-25\% {
  --color-opacity: 0.25;
}

.color-opacity-30\% {
  --color-opacity: 0.3;
}

.color-opacity-40\% {
  --color-opacity: 0.4;
}

.color-opacity-50\% {
  --color-opacity: 0.5;
}

.color-opacity-60\% {
  --color-opacity: 0.6;
}

.color-opacity-70\% {
  --color-opacity: 0.7;
}

.color-opacity-75\% {
  --color-opacity: 0.75;
}

.color-opacity-80\% {
  --color-opacity: 0.8;
}

.color-opacity-85\% {
  --color-opacity: 0.85;
}

.color-opacity-90\% {
  --color-opacity: 0.9;
}

.color-opacity-95\% {
  --color-opacity: 0.95;
}

/* gradient */
[class^=color-gradient], [class*=" color-gradient"] {
  color: transparent !important;
  -webkit-background-clip: text;
          background-clip: text;
  opacity: var(--color-opacity);
}

.color-gradient-primary-top-left {
  background-image: linear-gradient(315deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-top {
  background-image: linear-gradient(0deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-top-right {
  background-image: linear-gradient(45deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-right {
  background-image: linear-gradient(90deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-bottom-right {
  background-image: linear-gradient(135deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-bottom {
  background-image: linear-gradient(180deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-bottom-left {
  background-image: linear-gradient(225deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.color-gradient-primary-left {
  background-image: linear-gradient(270deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

/* width */
.width-4xs {
  width: 0.25rem;
}

.width-3xs {
  width: 0.5rem;
}

.width-2xs {
  width: 0.75rem;
}

.width-xs {
  width: 1rem;
}

.width-sm {
  width: 1.5rem;
}

.width-md {
  width: 2rem;
}

.width-lg {
  width: 3rem;
}

.width-xl {
  width: 4rem;
}

.width-2xl {
  width: 6rem;
}

.width-3xl {
  width: 8rem;
}

.width-4xl {
  width: 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%;
}

.width-40\% {
  width: 40%;
}

.width-50\% {
  width: 50%;
}

.width-60\% {
  width: 60%;
}

.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 */
.height-4xs {
  height: 0.25rem;
}

.height-3xs {
  height: 0.5rem;
}

.height-2xs {
  height: 0.75rem;
}

.height-xs {
  height: 1rem;
}

.height-sm {
  height: 1.5rem;
}

.height-md {
  height: 2rem;
}

.height-lg {
  height: 3rem;
}

.height-xl {
  height: 4rem;
}

.height-2xl {
  height: 6rem;
}

.height-3xl {
  height: 8rem;
}

.height-4xl {
  height: 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%;
}

.height-40\% {
  height: 40%;
}

.height-50\% {
  height: 50%;
}

.height-60\% {
  height: 60%;
}

.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 */
.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 */
.min-height-0 {
  min-height: 0;
}

.min-height-100\% {
  min-height: 100%;
}

.min-height-100vh {
  min-height: 100vh;
}

/* max-width */
.container {
  width: calc(100% - 2 * var(--container-margin-x));
  margin-left: auto;
  margin-right: auto;
}

.max-width-3xs {
  max-width: var(--max-width-3xs);
}

.max-width-2xs {
  max-width: var(--max-width-2xs);
}

.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-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-sm, .max-width-adaptive-md, .max-width-adaptive-lg, .max-width-adaptive-xl {
    max-width: 48rem;
  }
}
@media (min-width: 64rem) {
  .max-width-adaptive-md, .max-width-adaptive-lg, .max-width-adaptive-xl {
    max-width: 64rem;
  }
}
@media (min-width: 80rem) {
  .max-width-adaptive-lg, .max-width-adaptive-xl {
    max-width: 80rem;
  }
}
@media (min-width: 90rem) {
  .max-width-adaptive-xl {
    max-width: 90rem;
  }
}
/* max-height */
.max-height-100\% {
  max-height: 100%;
}

.max-height-100vh {
  max-height: 100vh;
}

/* box-shadow */
.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;
}

/* inner-glow */
:where(.inner-glow, .inner-glow-top) {
  position: relative;
}

.inner-glow::after, .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 */
.position-relative {
  position: relative;
}

.position-absolute {
  position: absolute;
}

.position-fixed {
  position: fixed;
}

.position-sticky {
  position: sticky;
}

.position-static {
  position: static;
}

.inset-0 {
  inset: 0;
}

.top-4xs {
  top: var(--space-4xs);
}

.right-4xs {
  right: var(--space-4xs);
}

.bottom-4xs {
  bottom: var(--space-4xs);
}

.left-4xs {
  left: var(--space-4xs);
}

.top-3xs {
  top: var(--space-3xs);
}

.right-3xs {
  right: var(--space-3xs);
}

.bottom-3xs {
  bottom: var(--space-3xs);
}

.left-3xs {
  left: var(--space-3xs);
}

.top-2xs {
  top: var(--space-2xs);
}

.right-2xs {
  right: var(--space-2xs);
}

.bottom-2xs {
  bottom: var(--space-2xs);
}

.left-2xs {
  left: var(--space-2xs);
}

.top-xs {
  top: var(--space-xs);
}

.right-xs {
  right: var(--space-xs);
}

.bottom-xs {
  bottom: var(--space-xs);
}

.left-xs {
  left: var(--space-xs);
}

.top-sm {
  top: var(--space-sm);
}

.right-sm {
  right: var(--space-sm);
}

.bottom-sm {
  bottom: var(--space-sm);
}

.left-sm {
  left: var(--space-sm);
}

.top-md {
  top: var(--space-md);
}

.right-md {
  right: var(--space-md);
}

.bottom-md {
  bottom: var(--space-md);
}

.left-md {
  left: var(--space-md);
}

.top-lg {
  top: var(--space-lg);
}

.right-lg {
  right: var(--space-lg);
}

.bottom-lg {
  bottom: var(--space-lg);
}

.left-lg {
  left: var(--space-lg);
}

.top-xl {
  top: var(--space-xl);
}

.right-xl {
  right: var(--space-xl);
}

.bottom-xl {
  bottom: var(--space-xl);
}

.left-xl {
  left: var(--space-xl);
}

.top-2xl {
  top: var(--space-2xl);
}

.right-2xl {
  right: var(--space-2xl);
}

.bottom-2xl {
  bottom: var(--space-2xl);
}

.left-2xl {
  left: var(--space-2xl);
}

.top-3xl {
  top: var(--space-3xl);
}

.right-3xl {
  right: var(--space-3xl);
}

.bottom-3xl {
  bottom: var(--space-3xl);
}

.left-3xl {
  left: var(--space-3xl);
}

.top-4xl {
  top: var(--space-4xl);
}

.right-4xl {
  right: var(--space-4xl);
}

.bottom-4xl {
  bottom: var(--space-4xl);
}

.left-4xl {
  left: var(--space-4xl);
}

.top-50\% {
  top: 50%;
}

.top-auto {
  top: auto;
}

.top-0 {
  top: 0;
}

.right-50\% {
  right: 50%;
}

.right-auto {
  right: auto;
}

.right-0 {
  right: 0;
}

.bottom-50\% {
  bottom: 50%;
}

.bottom-auto {
  bottom: auto;
}

.bottom-0 {
  bottom: 0;
}

.left-50\% {
  left: 50%;
}

.left-auto {
  left: auto;
}

.left-0 {
  left: 0;
}

/* z-index */
.z-index-1 {
  z-index: 1;
}

.z-index-2 {
  z-index: 2;
}

.z-index-3 {
  z-index: 3;
}

.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);
}

/* overflow */
.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-behavior */
.overscroll-contain {
  overscroll-behavior: contain;
}

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

.scroll-padding-4xs {
  scroll-padding: var(--space-4xs);
}

.scroll-padding-3xs {
  scroll-padding: var(--space-3xs);
}

.scroll-padding-2xs {
  scroll-padding: var(--space-2xs);
}

.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-2xl {
  scroll-padding: var(--space-2xl);
}

.scroll-padding-3xl {
  scroll-padding: var(--space-3xl);
}

.scroll-padding-4xl {
  scroll-padding: var(--space-4xl);
}

/* accessibility */
.sr-only, .sr-only-focusable:not(:focus):not(:focus-within) {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  padding: 0;
  border: 0;
  white-space: nowrap;
}

/* opacity */
.opacity-0 {
  opacity: 0;
}

.opacity-5\% {
  opacity: 0.05;
}

.opacity-10\% {
  opacity: 0.1;
}

.opacity-15\% {
  opacity: 0.15;
}

.opacity-20\% {
  opacity: 0.2;
}

.opacity-25\% {
  opacity: 0.25;
}

.opacity-30\% {
  opacity: 0.3;
}

.opacity-40\% {
  opacity: 0.4;
}

.opacity-50\% {
  opacity: 0.5;
}

.opacity-60\% {
  opacity: 0.6;
}

.opacity-70\% {
  opacity: 0.7;
}

.opacity-75\% {
  opacity: 0.75;
}

.opacity-80\% {
  opacity: 0.8;
}

.opacity-85\% {
  opacity: 0.85;
}

.opacity-90\% {
  opacity: 0.9;
}

.opacity-95\% {
  opacity: 0.95;
}

/* float */
.float-left {
  float: left;
}

.float-right {
  float: right;
}

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

/* border */
[class^=border-], [class*=" border-"] {
  --border-opacity: 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-opacity-base, 0.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-opacity-base, 0.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-opacity-base, 0.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-opacity-base, 0.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-opacity-base, 0.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-primary-darker {
  border-color: hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), var(--border-opacity, 1));
}

.border-primary-dark {
  border-color: hsla(var(--color-primary-dark-h), var(--color-primary-dark-s), var(--color-primary-dark-l), var(--border-opacity, 1));
}

.border-primary {
  border-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), var(--border-opacity, 1));
}

.border-primary-light {
  border-color: hsla(var(--color-primary-light-h), var(--color-primary-light-s), var(--color-primary-light-l), var(--border-opacity, 1));
}

.border-primary-lighter {
  border-color: hsla(var(--color-primary-lighter-h), var(--color-primary-lighter-s), var(--color-primary-lighter-l), var(--border-opacity, 1));
}

.border-accent-darker {
  border-color: hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), var(--border-opacity, 1));
}

.border-accent-dark {
  border-color: hsla(var(--color-accent-dark-h), var(--color-accent-dark-s), var(--color-accent-dark-l), var(--border-opacity, 1));
}

.border-accent {
  border-color: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), var(--border-opacity, 1));
}

.border-accent-light {
  border-color: hsla(var(--color-accent-light-h), var(--color-accent-light-s), var(--color-accent-light-l), var(--border-opacity, 1));
}

.border-accent-lighter {
  border-color: hsla(var(--color-accent-lighter-h), var(--color-accent-lighter-s), var(--color-accent-lighter-l), var(--border-opacity, 1));
}

.border-black {
  border-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), var(--border-opacity, 1));
}

.border-white {
  border-color: hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), var(--border-opacity, 1));
}

.border-warning-darker {
  border-color: hsla(var(--color-warning-darker-h), var(--color-warning-darker-s), var(--color-warning-darker-l), var(--border-opacity, 1));
}

.border-warning-dark {
  border-color: hsla(var(--color-warning-dark-h), var(--color-warning-dark-s), var(--color-warning-dark-l), var(--border-opacity, 1));
}

.border-warning {
  border-color: hsla(var(--color-warning-h), var(--color-warning-s), var(--color-warning-l), var(--border-opacity, 1));
}

.border-warning-light {
  border-color: hsla(var(--color-warning-light-h), var(--color-warning-light-s), var(--color-warning-light-l), var(--border-opacity, 1));
}

.border-warning-lighter {
  border-color: hsla(var(--color-warning-lighter-h), var(--color-warning-lighter-s), var(--color-warning-lighter-l), var(--border-opacity, 1));
}

.border-success-darker {
  border-color: hsla(var(--color-success-darker-h), var(--color-success-darker-s), var(--color-success-darker-l), var(--border-opacity, 1));
}

.border-success-dark {
  border-color: hsla(var(--color-success-dark-h), var(--color-success-dark-s), var(--color-success-dark-l), var(--border-opacity, 1));
}

.border-success {
  border-color: hsla(var(--color-success-h), var(--color-success-s), var(--color-success-l), var(--border-opacity, 1));
}

.border-success-light {
  border-color: hsla(var(--color-success-light-h), var(--color-success-light-s), var(--color-success-light-l), var(--border-opacity, 1));
}

.border-success-lighter {
  border-color: hsla(var(--color-success-lighter-h), var(--color-success-lighter-s), var(--color-success-lighter-l), var(--border-opacity, 1));
}

.border-error-darker {
  border-color: hsla(var(--color-error-darker-h), var(--color-error-darker-s), var(--color-error-darker-l), var(--border-opacity, 1));
}

.border-error-dark {
  border-color: hsla(var(--color-error-dark-h), var(--color-error-dark-s), var(--color-error-dark-l), var(--border-opacity, 1));
}

.border-error {
  border-color: hsla(var(--color-error-h), var(--color-error-s), var(--color-error-l), var(--border-opacity, 1));
}

.border-error-light {
  border-color: hsla(var(--color-error-light-h), var(--color-error-light-s), var(--color-error-light-l), var(--border-opacity, 1));
}

.border-error-lighter {
  border-color: hsla(var(--color-error-lighter-h), var(--color-error-lighter-s), var(--color-error-lighter-l), var(--border-opacity, 1));
}

.border-bg-darker {
  border-color: hsla(var(--color-bg-darker-h), var(--color-bg-darker-s), var(--color-bg-darker-l), var(--border-opacity, 1));
}

.border-bg-dark {
  border-color: hsla(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l), var(--border-opacity, 1));
}

.border-bg {
  border-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), var(--border-opacity, 1));
}

.border-bg-light {
  border-color: hsla(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l), var(--border-opacity, 1));
}

.border-bg-lighter {
  border-color: hsla(var(--color-bg-lighter-h), var(--color-bg-lighter-s), var(--color-bg-lighter-l), var(--border-opacity, 1));
}

.border-contrast-lower {
  border-color: hsla(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l), var(--border-opacity, 1));
}

.border-contrast-low {
  border-color: hsla(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l), var(--border-opacity, 1));
}

.border-contrast-medium {
  border-color: hsla(var(--color-contrast-medium-h), var(--color-contrast-medium-s), var(--color-contrast-medium-l), var(--border-opacity, 1));
}

.border-contrast-high {
  border-color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), var(--border-opacity, 1));
}

.border-contrast-higher {
  border-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--border-opacity, 1));
}

@property --border-gradient-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0deg;
}
[class^=border-gradient-], [class*=" border-gradient-"] {
  --border-gradient-angle: 0deg;
  position: relative;
  border-color: transparent;
}
[class^=border-gradient-]::before, [class*=" border-gradient-"]::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: calc(var(--border-width) * -1);
  border: var(--border-width) solid transparent;
  border-radius: inherit;
  -webkit-mask: linear-gradient(black, black) padding-box, linear-gradient(black, black);
          mask: linear-gradient(black, black) padding-box, linear-gradient(black, black);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity: var(--border-opacity);
  pointer-events: none;
}

.border-gradient-primary::before {
  background: radial-gradient(var(--gradient-primary-stop-1), var(--gradient-primary-stop-2)) border-box;
}

.border-gradient-primary-top::before, .border-gradient-primary-top-right::before, .border-gradient-primary-right::before, .border-gradient-primary-bottom-right::before, .border-gradient-primary-bottom::before, .border-gradient-primary-bottom-left::before, .border-gradient-primary-left::before, .border-gradient-primary-top-left::before {
  background: linear-gradient(var(--border-gradient-angle), var(--gradient-primary-stop-1), var(--gradient-primary-stop-2)) border-box;
}

.border-gradient-primary-top-right {
  --border-gradient-angle: 45deg;
}

.border-gradient-primary-right {
  --border-gradient-angle: 90deg;
}

.border-gradient-primary-bottom-right {
  --border-gradient-angle: 135deg;
}

.border-gradient-primary-bottom {
  --border-gradient-angle: 180deg;
}

.border-gradient-primary-bottom-left {
  --border-gradient-angle: 225deg;
}

.border-gradient-primary-left {
  --border-gradient-angle: 270deg;
}

.border-gradient-primary-top-left {
  --border-gradient-angle: 315deg;
}

.border-opacity-0 {
  --border-opacity: 0;
}

.border-opacity-5\% {
  --border-opacity: 0.05;
}

.border-opacity-10\% {
  --border-opacity: 0.1;
}

.border-opacity-15\% {
  --border-opacity: 0.15;
}

.border-opacity-20\% {
  --border-opacity: 0.2;
}

.border-opacity-25\% {
  --border-opacity: 0.25;
}

.border-opacity-30\% {
  --border-opacity: 0.3;
}

.border-opacity-40\% {
  --border-opacity: 0.4;
}

.border-opacity-50\% {
  --border-opacity: 0.5;
}

.border-opacity-60\% {
  --border-opacity: 0.6;
}

.border-opacity-70\% {
  --border-opacity: 0.7;
}

.border-opacity-75\% {
  --border-opacity: 0.75;
}

.border-opacity-80\% {
  --border-opacity: 0.8;
}

.border-opacity-85\% {
  --border-opacity: 0.85;
}

.border-opacity-90\% {
  --border-opacity: 0.9;
}

.border-opacity-95\% {
  --border-opacity: 0.95;
}

/* border-radius */
.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;
}

/* background */
.bg, [class^=bg-], [class*=" bg-"] {
  --bg-opacity: 1;
}

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

.bg-inherit {
  background-color: inherit;
}

.bg-primary-darker {
  background-color: hsla(var(--color-primary-darker-h), var(--color-primary-darker-s), var(--color-primary-darker-l), var(--bg-opacity, 1));
}

.bg-primary-dark {
  background-color: hsla(var(--color-primary-dark-h), var(--color-primary-dark-s), var(--color-primary-dark-l), var(--bg-opacity, 1));
}

.bg-primary {
  background-color: hsla(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l), var(--bg-opacity, 1));
}

.bg-primary-light {
  background-color: hsla(var(--color-primary-light-h), var(--color-primary-light-s), var(--color-primary-light-l), var(--bg-opacity, 1));
}

.bg-primary-lighter {
  background-color: hsla(var(--color-primary-lighter-h), var(--color-primary-lighter-s), var(--color-primary-lighter-l), var(--bg-opacity, 1));
}

.bg-accent-darker {
  background-color: hsla(var(--color-accent-darker-h), var(--color-accent-darker-s), var(--color-accent-darker-l), var(--bg-opacity, 1));
}

.bg-accent-dark {
  background-color: hsla(var(--color-accent-dark-h), var(--color-accent-dark-s), var(--color-accent-dark-l), var(--bg-opacity, 1));
}

.bg-accent {
  background-color: hsla(var(--color-accent-h), var(--color-accent-s), var(--color-accent-l), var(--bg-opacity, 1));
}

.bg-accent-light {
  background-color: hsla(var(--color-accent-light-h), var(--color-accent-light-s), var(--color-accent-light-l), var(--bg-opacity, 1));
}

.bg-accent-lighter {
  background-color: hsla(var(--color-accent-lighter-h), var(--color-accent-lighter-s), var(--color-accent-lighter-l), var(--bg-opacity, 1));
}

.bg-black {
  background-color: hsla(var(--color-black-h), var(--color-black-s), var(--color-black-l), var(--bg-opacity, 1));
}

.bg-white {
  background-color: hsla(var(--color-white-h), var(--color-white-s), var(--color-white-l), var(--bg-opacity, 1));
}

.bg-warning-darker {
  background-color: hsla(var(--color-warning-darker-h), var(--color-warning-darker-s), var(--color-warning-darker-l), var(--bg-opacity, 1));
}

.bg-warning-dark {
  background-color: hsla(var(--color-warning-dark-h), var(--color-warning-dark-s), var(--color-warning-dark-l), var(--bg-opacity, 1));
}

.bg-warning {
  background-color: hsla(var(--color-warning-h), var(--color-warning-s), var(--color-warning-l), var(--bg-opacity, 1));
}

.bg-warning-light {
  background-color: hsla(var(--color-warning-light-h), var(--color-warning-light-s), var(--color-warning-light-l), var(--bg-opacity, 1));
}

.bg-warning-lighter {
  background-color: hsla(var(--color-warning-lighter-h), var(--color-warning-lighter-s), var(--color-warning-lighter-l), var(--bg-opacity, 1));
}

.bg-success-darker {
  background-color: hsla(var(--color-success-darker-h), var(--color-success-darker-s), var(--color-success-darker-l), var(--bg-opacity, 1));
}

.bg-success-dark {
  background-color: hsla(var(--color-success-dark-h), var(--color-success-dark-s), var(--color-success-dark-l), var(--bg-opacity, 1));
}

.bg-success {
  background-color: hsla(var(--color-success-h), var(--color-success-s), var(--color-success-l), var(--bg-opacity, 1));
}

.bg-success-light {
  background-color: hsla(var(--color-success-light-h), var(--color-success-light-s), var(--color-success-light-l), var(--bg-opacity, 1));
}

.bg-success-lighter {
  background-color: hsla(var(--color-success-lighter-h), var(--color-success-lighter-s), var(--color-success-lighter-l), var(--bg-opacity, 1));
}

.bg-error-darker {
  background-color: hsla(var(--color-error-darker-h), var(--color-error-darker-s), var(--color-error-darker-l), var(--bg-opacity, 1));
}

.bg-error-dark {
  background-color: hsla(var(--color-error-dark-h), var(--color-error-dark-s), var(--color-error-dark-l), var(--bg-opacity, 1));
}

.bg-error {
  background-color: hsla(var(--color-error-h), var(--color-error-s), var(--color-error-l), var(--bg-opacity, 1));
}

.bg-error-light {
  background-color: hsla(var(--color-error-light-h), var(--color-error-light-s), var(--color-error-light-l), var(--bg-opacity, 1));
}

.bg-error-lighter {
  background-color: hsla(var(--color-error-lighter-h), var(--color-error-lighter-s), var(--color-error-lighter-l), var(--bg-opacity, 1));
}

.bg-darker {
  background-color: hsla(var(--color-bg-darker-h), var(--color-bg-darker-s), var(--color-bg-darker-l), var(--bg-opacity, 1));
}

.bg-dark {
  background-color: hsla(var(--color-bg-dark-h), var(--color-bg-dark-s), var(--color-bg-dark-l), var(--bg-opacity, 1));
}

.bg {
  background-color: hsla(var(--color-bg-h), var(--color-bg-s), var(--color-bg-l), var(--bg-opacity, 1));
}

.bg-light {
  background-color: hsla(var(--color-bg-light-h), var(--color-bg-light-s), var(--color-bg-light-l), var(--bg-opacity, 1));
}

.bg-lighter {
  background-color: hsla(var(--color-bg-lighter-h), var(--color-bg-lighter-s), var(--color-bg-lighter-l), var(--bg-opacity, 1));
}

.bg-contrast-lower {
  background-color: hsla(var(--color-contrast-lower-h), var(--color-contrast-lower-s), var(--color-contrast-lower-l), var(--bg-opacity, 1));
}

.bg-contrast-low {
  background-color: hsla(var(--color-contrast-low-h), var(--color-contrast-low-s), var(--color-contrast-low-l), var(--bg-opacity, 1));
}

.bg-contrast-medium {
  background-color: hsla(var(--color-contrast-medium-h), var(--color-contrast-medium-s), var(--color-contrast-medium-l), var(--bg-opacity, 1));
}

.bg-contrast-high {
  background-color: hsla(var(--color-contrast-high-h), var(--color-contrast-high-s), var(--color-contrast-high-l), var(--bg-opacity, 1));
}

.bg-contrast-higher {
  background-color: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), var(--bg-opacity, 1));
}

.bg-gradient-primary {
  background-image: radial-gradient(var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-top-left {
  background-image: linear-gradient(315deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-top {
  background-image: linear-gradient(0deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-top-right {
  background-image: linear-gradient(45deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-right {
  background-image: linear-gradient(90deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-bottom-right {
  background-image: linear-gradient(135deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-bottom {
  background-image: linear-gradient(180deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-bottom-left {
  background-image: linear-gradient(225deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-gradient-primary-left {
  background-image: linear-gradient(270deg, var(--gradient-primary-stop-1), var(--gradient-primary-stop-2));
}

.bg-opacity-0 {
  --bg-opacity: 0;
}

.bg-opacity-5\% {
  --bg-opacity: 0.05;
}

.bg-opacity-10\% {
  --bg-opacity: 0.1;
}

.bg-opacity-15\% {
  --bg-opacity: 0.15;
}

.bg-opacity-20\% {
  --bg-opacity: 0.2;
}

.bg-opacity-25\% {
  --bg-opacity: 0.25;
}

.bg-opacity-30\% {
  --bg-opacity: 0.3;
}

.bg-opacity-40\% {
  --bg-opacity: 0.4;
}

.bg-opacity-50\% {
  --bg-opacity: 0.5;
}

.bg-opacity-60\% {
  --bg-opacity: 0.6;
}

.bg-opacity-70\% {
  --bg-opacity: 0.7;
}

.bg-opacity-75\% {
  --bg-opacity: 0.75;
}

.bg-opacity-80\% {
  --bg-opacity: 0.8;
}

.bg-opacity-85\% {
  --bg-opacity: 0.85;
}

.bg-opacity-90\% {
  --bg-opacity: 0.9;
}

.bg-opacity-95\% {
  --bg-opacity: 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-filter */
.backdrop-blur-10 {
  backdrop-filter: blur(10px);
}

.backdrop-blur-20 {
  backdrop-filter: blur(20px);
}

/* mix-blend-mode */
.isolate {
  isolation: isolate;
}

.blend-multiply {
  mix-blend-mode: multiply;
}

.blend-overlay {
  mix-blend-mode: overlay;
}

.blend-difference {
  mix-blend-mode: difference;
}

/* object-fit */
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}

.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}

/* perspective */
.perspective-xs {
  perspective: 250px;
}

.perspective-sm {
  perspective: 500px;
}

.perspective-md {
  perspective: 1000px;
}

.perspective-lg {
  perspective: 1500px;
}

.perspective-xl {
  perspective: 3000px;
}

/* transform */
[class^=flip], [class*=" flip"],
[class^=-rotate], [class*=" -rotate"],
[class^=rotate], [class*=" rotate"],
[class^=-translate], [class*=" -translate"],
[class^=translate], [class*=" translate"],
[class^=-scale], [class*=" -scale"],
[class^=scale], [class*=" scale"],
[class^=-skew], [class*=" -skew"] [class^=skew],
[class*=" skew"] {
  --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-y-slight {
  --translate-y: -0.1em;
}

.translate-50\% {
  --translate: 50%;
}

.translate-x-50\% {
  --translate-x: 50%;
}

.translate-y-50\% {
  --translate-y: 50%;
}

/* transform-origin */
.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 {
  transition-property: var(--transition-property, all);
  transition-duration: var(--transition-duration, 0.2s);
  transition-delay: var(--transition-delay, 0s);
}

/* SVG */
.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;
}

/* visibility */
.visible {
  visibility: visible;
}

.invisible {
  visibility: hidden;
}

/* print */
@media print {
  .print\:hide, .print\:is-hidden {
    display: none !important;
  }
  .print\:shadow-none {
    box-shadow: none;
  }
}
/* appearance */
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.appearance-auto {
  -webkit-appearance: auto;
     -moz-appearance: auto;
          appearance: auto;
}

@media (min-width: 32rem) {
  /* grid */
  .grid-col-1\@xs {
    --grid-columns: 1;
  }
  .col-1\@xs {
    --column-span: 1;
  }
  .grid-col-2\@xs {
    --grid-columns: 2;
  }
  .col-2\@xs {
    --column-span: 2;
  }
  .grid-col-3\@xs {
    --grid-columns: 3;
  }
  .col-3\@xs {
    --column-span: 3;
  }
  .grid-col-4\@xs {
    --grid-columns: 4;
  }
  .col-4\@xs {
    --column-span: 4;
  }
  .grid-col-5\@xs {
    --grid-columns: 5;
  }
  .col-5\@xs {
    --column-span: 5;
  }
  .grid-col-6\@xs {
    --grid-columns: 6;
  }
  .col-6\@xs {
    --column-span: 6;
  }
  .grid-col-7\@xs {
    --grid-columns: 7;
  }
  .col-7\@xs {
    --column-span: 7;
  }
  .grid-col-8\@xs {
    --grid-columns: 8;
  }
  .col-8\@xs {
    --column-span: 8;
  }
  .grid-col-9\@xs {
    --grid-columns: 9;
  }
  .col-9\@xs {
    --column-span: 9;
  }
  .grid-col-10\@xs {
    --grid-columns: 10;
  }
  .col-10\@xs {
    --column-span: 10;
  }
  .grid-col-11\@xs {
    --grid-columns: 11;
  }
  .col-11\@xs {
    --column-span: 11;
  }
  .grid-col-12\@xs {
    --grid-columns: 12;
  }
  .col-12\@xs {
    --column-span: 12;
  }
  .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, .col-10\@xs, .col-11\@xs, .col-12\@xs {
    width: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-span) / var(--grid-columns) + (var(--column-span) - 1) * var(--column-gap));
    flex: initial;
  }
  .col\@xs {
    width: auto;
    flex: 1 1 0;
  }
  .col-content\@xs {
    width: auto;
    flex: 0 1 auto;
  }
  .offset-1\@xs {
    --column-offset: 1;
  }
  .offset-2\@xs {
    --column-offset: 2;
  }
  .offset-3\@xs {
    --column-offset: 3;
  }
  .offset-4\@xs {
    --column-offset: 4;
  }
  .offset-5\@xs {
    --column-offset: 5;
  }
  .offset-6\@xs {
    --column-offset: 6;
  }
  .offset-7\@xs {
    --column-offset: 7;
  }
  .offset-8\@xs {
    --column-offset: 8;
  }
  .offset-9\@xs {
    --column-offset: 9;
  }
  .offset-10\@xs {
    --column-offset: 10;
  }
  .offset-11\@xs {
    --column-offset: 11;
  }
  .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, .offset-10\@xs, .offset-11\@xs {
    margin-left: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-offset) / var(--grid-columns) + var(--column-offset) * var(--column-gap));
  }
  .offset-0\@xs {
    margin-left: 0;
  }
  /* gap */
  .gap-4xs\@xs {
    --row-gap: var(--space-4xs);
    --column-gap: var(--space-4xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xs\@xs {
    --column-gap: var(--space-4xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xs\@xs {
    --row-gap: var(--space-4xs);
    row-gap: var(--row-gap);
  }
  .gap-3xs\@xs {
    --row-gap: var(--space-3xs);
    --column-gap: var(--space-3xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xs\@xs {
    --column-gap: var(--space-3xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xs\@xs {
    --row-gap: var(--space-3xs);
    row-gap: var(--row-gap);
  }
  .gap-2xs\@xs {
    --row-gap: var(--space-2xs);
    --column-gap: var(--space-2xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xs\@xs {
    --column-gap: var(--space-2xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xs\@xs {
    --row-gap: var(--space-2xs);
    row-gap: var(--row-gap);
  }
  .gap-xs\@xs {
    --row-gap: var(--space-xs);
    --column-gap: var(--space-xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xs\@xs {
    --column-gap: var(--space-xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xs\@xs {
    --row-gap: var(--space-xs);
    row-gap: var(--row-gap);
  }
  .gap-sm\@xs {
    --row-gap: var(--space-sm);
    --column-gap: var(--space-sm);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-sm\@xs {
    --column-gap: var(--space-sm);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-sm\@xs {
    --row-gap: var(--space-sm);
    row-gap: var(--row-gap);
  }
  .gap-md\@xs {
    --row-gap: var(--space-md);
    --column-gap: var(--space-md);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-md\@xs {
    --column-gap: var(--space-md);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-md\@xs {
    --row-gap: var(--space-md);
    row-gap: var(--row-gap);
  }
  .gap-lg\@xs {
    --row-gap: var(--space-lg);
    --column-gap: var(--space-lg);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-lg\@xs {
    --column-gap: var(--space-lg);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-lg\@xs {
    --row-gap: var(--space-lg);
    row-gap: var(--row-gap);
  }
  .gap-xl\@xs {
    --row-gap: var(--space-xl);
    --column-gap: var(--space-xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xl\@xs {
    --column-gap: var(--space-xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xl\@xs {
    --row-gap: var(--space-xl);
    row-gap: var(--row-gap);
  }
  .gap-2xl\@xs {
    --row-gap: var(--space-2xl);
    --column-gap: var(--space-2xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xl\@xs {
    --column-gap: var(--space-2xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xl\@xs {
    --row-gap: var(--space-2xl);
    row-gap: var(--row-gap);
  }
  .gap-3xl\@xs {
    --row-gap: var(--space-3xl);
    --column-gap: var(--space-3xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xl\@xs {
    --column-gap: var(--space-3xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xl\@xs {
    --row-gap: var(--space-3xl);
    row-gap: var(--row-gap);
  }
  .gap-4xl\@xs {
    --row-gap: var(--space-4xl);
    --column-gap: var(--space-4xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xl\@xs {
    --column-gap: var(--space-4xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xl\@xs {
    --row-gap: var(--space-4xl);
    row-gap: var(--row-gap);
  }
  .gap-0\@xs {
    --row-gap: 0px;
    --column-gap: 0px;
    gap: 0px;
  }
  .gap-x-0\@xs {
    --column-gap: 0px;
    -moz-column-gap: 0px;
         column-gap: 0px;
  }
  .gap-y-0\@xs {
    --row-gap: 0px;
    row-gap: 0px;
  }
  /* flexbox */
  .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-content */
  .justify-start\@xs {
    justify-content: start;
  }
  .justify-end\@xs {
    justify-content: end;
  }
  .justify-center\@xs {
    justify-content: center;
  }
  .justify-between\@xs {
    justify-content: space-between;
  }
  /* align-items */
  .items-center\@xs {
    align-items: center;
  }
  .items-start\@xs {
    align-items: start;
  }
  .items-end\@xs {
    align-items: end;
  }
  .items-baseline\@xs {
    align-items: baseline;
  }
  .items-stretch\@xs {
    align-items: stretch;
  }
  /* align-content */
  .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 */
  .order-1\@xs {
    order: 1;
  }
  .order-2\@xs {
    order: 2;
  }
  .order-3\@xs {
    order: 3;
  }
  /* display */
  .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;
  }
  /* margin */
  .margin-4xs\@xs {
    margin: var(--space-4xs);
  }
  .margin-3xs\@xs {
    margin: var(--space-3xs);
  }
  .margin-2xs\@xs {
    margin: var(--space-2xs);
  }
  .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-2xl\@xs {
    margin: var(--space-2xl);
  }
  .margin-3xl\@xs {
    margin: var(--space-3xl);
  }
  .margin-4xl\@xs {
    margin: var(--space-4xl);
  }
  .margin-auto\@xs {
    margin: auto;
  }
  .margin-0\@xs {
    margin: 0;
  }
  .margin-y-4xs\@xs {
    margin-top: var(--space-4xs);
    margin-bottom: var(--space-4xs);
  }
  .margin-x-4xs\@xs {
    margin-right: var(--space-4xs);
    margin-left: var(--space-4xs);
  }
  .margin-y-3xs\@xs {
    margin-top: var(--space-3xs);
    margin-bottom: var(--space-3xs);
  }
  .margin-x-3xs\@xs {
    margin-right: var(--space-3xs);
    margin-left: var(--space-3xs);
  }
  .margin-y-2xs\@xs {
    margin-top: var(--space-2xs);
    margin-bottom: var(--space-2xs);
  }
  .margin-x-2xs\@xs {
    margin-right: var(--space-2xs);
    margin-left: var(--space-2xs);
  }
  .margin-y-xs\@xs {
    margin-top: var(--space-xs);
    margin-bottom: var(--space-xs);
  }
  .margin-x-xs\@xs {
    margin-right: var(--space-xs);
    margin-left: var(--space-xs);
  }
  .margin-y-sm\@xs {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
  }
  .margin-x-sm\@xs {
    margin-right: var(--space-sm);
    margin-left: var(--space-sm);
  }
  .margin-y-md\@xs {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
  }
  .margin-x-md\@xs {
    margin-right: var(--space-md);
    margin-left: var(--space-md);
  }
  .margin-y-lg\@xs {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-lg);
  }
  .margin-x-lg\@xs {
    margin-right: var(--space-lg);
    margin-left: var(--space-lg);
  }
  .margin-y-xl\@xs {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-xl);
  }
  .margin-x-xl\@xs {
    margin-right: var(--space-xl);
    margin-left: var(--space-xl);
  }
  .margin-y-2xl\@xs {
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-2xl);
  }
  .margin-x-2xl\@xs {
    margin-right: var(--space-2xl);
    margin-left: var(--space-2xl);
  }
  .margin-y-3xl\@xs {
    margin-top: var(--space-3xl);
    margin-bottom: var(--space-3xl);
  }
  .margin-x-3xl\@xs {
    margin-right: var(--space-3xl);
    margin-left: var(--space-3xl);
  }
  .margin-y-4xl\@xs {
    margin-top: var(--space-4xl);
    margin-bottom: var(--space-4xl);
  }
  .margin-x-4xl\@xs {
    margin-right: var(--space-4xl);
    margin-left: var(--space-4xl);
  }
  .margin-y-auto\@xs {
    margin-top: auto;
    margin-bottom: auto;
  }
  .margin-y-0\@xs {
    margin-top: 0;
    margin-bottom: 0;
  }
  .margin-x-auto\@xs {
    margin-left: auto;
    margin-right: auto;
  }
  .margin-x-0\@xs {
    margin-left: 0;
    margin-right: 0;
  }
  .margin-top-4xs\@xs {
    margin-top: var(--space-4xs);
  }
  .margin-right-4xs\@xs {
    margin-right: var(--space-4xs);
  }
  .margin-bottom-4xs\@xs {
    margin-bottom: var(--space-4xs);
  }
  .margin-left-4xs\@xs {
    margin-left: var(--space-4xs);
  }
  .margin-top-3xs\@xs {
    margin-top: var(--space-3xs);
  }
  .margin-right-3xs\@xs {
    margin-right: var(--space-3xs);
  }
  .margin-bottom-3xs\@xs {
    margin-bottom: var(--space-3xs);
  }
  .margin-left-3xs\@xs {
    margin-left: var(--space-3xs);
  }
  .margin-top-2xs\@xs {
    margin-top: var(--space-2xs);
  }
  .margin-right-2xs\@xs {
    margin-right: var(--space-2xs);
  }
  .margin-bottom-2xs\@xs {
    margin-bottom: var(--space-2xs);
  }
  .margin-left-2xs\@xs {
    margin-left: var(--space-2xs);
  }
  .margin-top-xs\@xs {
    margin-top: var(--space-xs);
  }
  .margin-right-xs\@xs {
    margin-right: var(--space-xs);
  }
  .margin-bottom-xs\@xs {
    margin-bottom: var(--space-xs);
  }
  .margin-left-xs\@xs {
    margin-left: var(--space-xs);
  }
  .margin-top-sm\@xs {
    margin-top: var(--space-sm);
  }
  .margin-right-sm\@xs {
    margin-right: var(--space-sm);
  }
  .margin-bottom-sm\@xs {
    margin-bottom: var(--space-sm);
  }
  .margin-left-sm\@xs {
    margin-left: var(--space-sm);
  }
  .margin-top-md\@xs {
    margin-top: var(--space-md);
  }
  .margin-right-md\@xs {
    margin-right: var(--space-md);
  }
  .margin-bottom-md\@xs {
    margin-bottom: var(--space-md);
  }
  .margin-left-md\@xs {
    margin-left: var(--space-md);
  }
  .margin-top-lg\@xs {
    margin-top: var(--space-lg);
  }
  .margin-right-lg\@xs {
    margin-right: var(--space-lg);
  }
  .margin-bottom-lg\@xs {
    margin-bottom: var(--space-lg);
  }
  .margin-left-lg\@xs {
    margin-left: var(--space-lg);
  }
  .margin-top-xl\@xs {
    margin-top: var(--space-xl);
  }
  .margin-right-xl\@xs {
    margin-right: var(--space-xl);
  }
  .margin-bottom-xl\@xs {
    margin-bottom: var(--space-xl);
  }
  .margin-left-xl\@xs {
    margin-left: var(--space-xl);
  }
  .margin-top-2xl\@xs {
    margin-top: var(--space-2xl);
  }
  .margin-right-2xl\@xs {
    margin-right: var(--space-2xl);
  }
  .margin-bottom-2xl\@xs {
    margin-bottom: var(--space-2xl);
  }
  .margin-left-2xl\@xs {
    margin-left: var(--space-2xl);
  }
  .margin-top-3xl\@xs {
    margin-top: var(--space-3xl);
  }
  .margin-right-3xl\@xs {
    margin-right: var(--space-3xl);
  }
  .margin-bottom-3xl\@xs {
    margin-bottom: var(--space-3xl);
  }
  .margin-left-3xl\@xs {
    margin-left: var(--space-3xl);
  }
  .margin-top-4xl\@xs {
    margin-top: var(--space-4xl);
  }
  .margin-right-4xl\@xs {
    margin-right: var(--space-4xl);
  }
  .margin-bottom-4xl\@xs {
    margin-bottom: var(--space-4xl);
  }
  .margin-left-4xl\@xs {
    margin-left: var(--space-4xl);
  }
  .margin-top-auto\@xs {
    margin-top: auto;
  }
  .margin-top-0\@xs {
    margin-top: 0;
  }
  .margin-right-auto\@xs {
    margin-right: auto;
  }
  .margin-right-0\@xs {
    margin-right: 0;
  }
  .margin-bottom-auto\@xs {
    margin-bottom: auto;
  }
  .margin-bottom-0\@xs {
    margin-bottom: 0;
  }
  .margin-left-auto\@xs {
    margin-left: auto;
  }
  .margin-left-0\@xs {
    margin-left: 0;
  }
  /* padding */
  .padding-4xs\@xs {
    padding: var(--space-4xs);
  }
  .padding-3xs\@xs {
    padding: var(--space-3xs);
  }
  .padding-2xs\@xs {
    padding: var(--space-2xs);
  }
  .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-2xl\@xs {
    padding: var(--space-2xl);
  }
  .padding-3xl\@xs {
    padding: var(--space-3xl);
  }
  .padding-4xl\@xs {
    padding: var(--space-4xl);
  }
  .padding-0\@xs {
    padding: 0;
  }
  .padding-y-4xs\@xs {
    padding-top: var(--space-4xs);
    padding-bottom: var(--space-4xs);
  }
  .padding-x-4xs\@xs {
    padding-right: var(--space-4xs);
    padding-left: var(--space-4xs);
  }
  .padding-y-3xs\@xs {
    padding-top: var(--space-3xs);
    padding-bottom: var(--space-3xs);
  }
  .padding-x-3xs\@xs {
    padding-right: var(--space-3xs);
    padding-left: var(--space-3xs);
  }
  .padding-y-2xs\@xs {
    padding-top: var(--space-2xs);
    padding-bottom: var(--space-2xs);
  }
  .padding-x-2xs\@xs {
    padding-right: var(--space-2xs);
    padding-left: var(--space-2xs);
  }
  .padding-y-xs\@xs {
    padding-top: var(--space-xs);
    padding-bottom: var(--space-xs);
  }
  .padding-x-xs\@xs {
    padding-right: var(--space-xs);
    padding-left: var(--space-xs);
  }
  .padding-y-sm\@xs {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-sm);
  }
  .padding-x-sm\@xs {
    padding-right: var(--space-sm);
    padding-left: var(--space-sm);
  }
  .padding-y-md\@xs {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
  .padding-x-md\@xs {
    padding-right: var(--space-md);
    padding-left: var(--space-md);
  }
  .padding-y-lg\@xs {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
  }
  .padding-x-lg\@xs {
    padding-right: var(--space-lg);
    padding-left: var(--space-lg);
  }
  .padding-y-xl\@xs {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
  }
  .padding-x-xl\@xs {
    padding-right: var(--space-xl);
    padding-left: var(--space-xl);
  }
  .padding-y-2xl\@xs {
    padding-top: var(--space-2xl);
    padding-bottom: var(--space-2xl);
  }
  .padding-x-2xl\@xs {
    padding-right: var(--space-2xl);
    padding-left: var(--space-2xl);
  }
  .padding-y-3xl\@xs {
    padding-top: var(--space-3xl);
    padding-bottom: var(--space-3xl);
  }
  .padding-x-3xl\@xs {
    padding-right: var(--space-3xl);
    padding-left: var(--space-3xl);
  }
  .padding-y-4xl\@xs {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
  }
  .padding-x-4xl\@xs {
    padding-right: var(--space-4xl);
    padding-left: var(--space-4xl);
  }
  .padding-y-0\@xs {
    padding-top: 0;
    padding-bottom: 0;
  }
  .padding-x-0\@xs {
    padding-left: 0;
    padding-right: 0;
  }
  .padding-top-4xs\@xs {
    padding-top: var(--space-4xs);
  }
  .padding-right-4xs\@xs {
    padding-right: var(--space-4xs);
  }
  .padding-bottom-4xs\@xs {
    padding-bottom: var(--space-4xs);
  }
  .padding-left-4xs\@xs {
    padding-left: var(--space-4xs);
  }
  .padding-top-3xs\@xs {
    padding-top: var(--space-3xs);
  }
  .padding-right-3xs\@xs {
    padding-right: var(--space-3xs);
  }
  .padding-bottom-3xs\@xs {
    padding-bottom: var(--space-3xs);
  }
  .padding-left-3xs\@xs {
    padding-left: var(--space-3xs);
  }
  .padding-top-2xs\@xs {
    padding-top: var(--space-2xs);
  }
  .padding-right-2xs\@xs {
    padding-right: var(--space-2xs);
  }
  .padding-bottom-2xs\@xs {
    padding-bottom: var(--space-2xs);
  }
  .padding-left-2xs\@xs {
    padding-left: var(--space-2xs);
  }
  .padding-top-xs\@xs {
    padding-top: var(--space-xs);
  }
  .padding-right-xs\@xs {
    padding-right: var(--space-xs);
  }
  .padding-bottom-xs\@xs {
    padding-bottom: var(--space-xs);
  }
  .padding-left-xs\@xs {
    padding-left: var(--space-xs);
  }
  .padding-top-sm\@xs {
    padding-top: var(--space-sm);
  }
  .padding-right-sm\@xs {
    padding-right: var(--space-sm);
  }
  .padding-bottom-sm\@xs {
    padding-bottom: var(--space-sm);
  }
  .padding-left-sm\@xs {
    padding-left: var(--space-sm);
  }
  .padding-top-md\@xs {
    padding-top: var(--space-md);
  }
  .padding-right-md\@xs {
    padding-right: var(--space-md);
  }
  .padding-bottom-md\@xs {
    padding-bottom: var(--space-md);
  }
  .padding-left-md\@xs {
    padding-left: var(--space-md);
  }
  .padding-top-lg\@xs {
    padding-top: var(--space-lg);
  }
  .padding-right-lg\@xs {
    padding-right: var(--space-lg);
  }
  .padding-bottom-lg\@xs {
    padding-bottom: var(--space-lg);
  }
  .padding-left-lg\@xs {
    padding-left: var(--space-lg);
  }
  .padding-top-xl\@xs {
    padding-top: var(--space-xl);
  }
  .padding-right-xl\@xs {
    padding-right: var(--space-xl);
  }
  .padding-bottom-xl\@xs {
    padding-bottom: var(--space-xl);
  }
  .padding-left-xl\@xs {
    padding-left: var(--space-xl);
  }
  .padding-top-2xl\@xs {
    padding-top: var(--space-2xl);
  }
  .padding-right-2xl\@xs {
    padding-right: var(--space-2xl);
  }
  .padding-bottom-2xl\@xs {
    padding-bottom: var(--space-2xl);
  }
  .padding-left-2xl\@xs {
    padding-left: var(--space-2xl);
  }
  .padding-top-3xl\@xs {
    padding-top: var(--space-3xl);
  }
  .padding-right-3xl\@xs {
    padding-right: var(--space-3xl);
  }
  .padding-bottom-3xl\@xs {
    padding-bottom: var(--space-3xl);
  }
  .padding-left-3xl\@xs {
    padding-left: var(--space-3xl);
  }
  .padding-top-4xl\@xs {
    padding-top: var(--space-4xl);
  }
  .padding-right-4xl\@xs {
    padding-right: var(--space-4xl);
  }
  .padding-bottom-4xl\@xs {
    padding-bottom: var(--space-4xl);
  }
  .padding-left-4xl\@xs {
    padding-left: var(--space-4xl);
  }
  .padding-top-0\@xs {
    padding-top: 0;
  }
  .padding-right-0\@xs {
    padding-right: 0;
  }
  .padding-bottom-0\@xs {
    padding-bottom: 0;
  }
  .padding-left-0\@xs {
    padding-left: 0;
  }
  /* text-align */
  .text-center\@xs {
    text-align: center;
  }
  .text-left\@xs {
    text-align: left;
  }
  .text-right\@xs {
    text-align: right;
  }
  .text-justify\@xs {
    text-align: justify;
  }
  /* font-size */
  .text-xs\@xs {
    font-size: var(--text-xs);
  }
  .text-sm\@xs {
    font-size: var(--text-sm);
  }
  .text-base\@xs {
    font-size: var(--text-base);
  }
  .text-md\@xs {
    font-size: var(--text-md);
  }
  .text-lg\@xs {
    font-size: var(--text-lg);
  }
  .text-xl\@xs {
    font-size: var(--text-xl);
  }
  .text-2xl\@xs {
    font-size: var(--text-2xl);
  }
  .text-3xl\@xs {
    font-size: var(--text-3xl);
  }
  .text-4xl\@xs {
    font-size: var(--text-4xl);
  }
  /* column-count */
  .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 */
  .width-4xs\@xs {
    width: 0.25rem;
  }
  .width-3xs\@xs {
    width: 0.5rem;
  }
  .width-2xs\@xs {
    width: 0.75rem;
  }
  .width-xs\@xs {
    width: 1rem;
  }
  .width-sm\@xs {
    width: 1.5rem;
  }
  .width-md\@xs {
    width: 2rem;
  }
  .width-lg\@xs {
    width: 3rem;
  }
  .width-xl\@xs {
    width: 4rem;
  }
  .width-2xl\@xs {
    width: 6rem;
  }
  .width-3xl\@xs {
    width: 8rem;
  }
  .width-4xl\@xs {
    width: 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%;
  }
  .width-40\%\@xs {
    width: 40%;
  }
  .width-50\%\@xs {
    width: 50%;
  }
  .width-60\%\@xs {
    width: 60%;
  }
  .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-100\%\@xs {
    width: 100%;
  }
  .width-100vw\@xs {
    width: 100vw;
  }
  .width-auto\@xs {
    width: auto;
  }
  .width-inherit\@xs {
    width: inherit;
  }
  .width-0\@xs {
    width: 0;
  }
  /* height */
  .height-4xs\@xs {
    height: 0.25rem;
  }
  .height-3xs\@xs {
    height: 0.5rem;
  }
  .height-2xs\@xs {
    height: 0.75rem;
  }
  .height-xs\@xs {
    height: 1rem;
  }
  .height-sm\@xs {
    height: 1.5rem;
  }
  .height-md\@xs {
    height: 2rem;
  }
  .height-lg\@xs {
    height: 3rem;
  }
  .height-xl\@xs {
    height: 4rem;
  }
  .height-2xl\@xs {
    height: 6rem;
  }
  .height-3xl\@xs {
    height: 8rem;
  }
  .height-4xl\@xs {
    height: 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%;
  }
  .height-40\%\@xs {
    height: 40%;
  }
  .height-50\%\@xs {
    height: 50%;
  }
  .height-60\%\@xs {
    height: 60%;
  }
  .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-100\%\@xs {
    height: 100%;
  }
  .height-100vh\@xs {
    height: 100vh;
  }
  .height-auto\@xs {
    height: auto;
  }
  .height-inherit\@xs {
    height: inherit;
  }
  .height-0\@xs {
    height: 0;
  }
  /* max-width */
  .max-width-3xs\@xs {
    max-width: var(--max-width-3xs);
  }
  .max-width-2xs\@xs {
    max-width: var(--max-width-2xs);
  }
  .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-100\%\@xs {
    max-width: 100%;
  }
  .max-width-none\@xs {
    max-width: none;
  }
  /* position */
  .position-relative\@xs {
    position: relative;
  }
  .position-absolute\@xs {
    position: absolute;
  }
  .position-fixed\@xs {
    position: fixed;
  }
  .position-sticky\@xs {
    position: sticky;
  }
  .position-static\@xs {
    position: static;
  }
  .inset-0\@xs {
    inset: 0;
  }
  .top-4xs\@xs {
    top: var(--space-4xs);
  }
  .right-4xs\@xs {
    right: var(--space-4xs);
  }
  .bottom-4xs\@xs {
    bottom: var(--space-4xs);
  }
  .left-4xs\@xs {
    left: var(--space-4xs);
  }
  .top-3xs\@xs {
    top: var(--space-3xs);
  }
  .right-3xs\@xs {
    right: var(--space-3xs);
  }
  .bottom-3xs\@xs {
    bottom: var(--space-3xs);
  }
  .left-3xs\@xs {
    left: var(--space-3xs);
  }
  .top-2xs\@xs {
    top: var(--space-2xs);
  }
  .right-2xs\@xs {
    right: var(--space-2xs);
  }
  .bottom-2xs\@xs {
    bottom: var(--space-2xs);
  }
  .left-2xs\@xs {
    left: var(--space-2xs);
  }
  .top-xs\@xs {
    top: var(--space-xs);
  }
  .right-xs\@xs {
    right: var(--space-xs);
  }
  .bottom-xs\@xs {
    bottom: var(--space-xs);
  }
  .left-xs\@xs {
    left: var(--space-xs);
  }
  .top-sm\@xs {
    top: var(--space-sm);
  }
  .right-sm\@xs {
    right: var(--space-sm);
  }
  .bottom-sm\@xs {
    bottom: var(--space-sm);
  }
  .left-sm\@xs {
    left: var(--space-sm);
  }
  .top-md\@xs {
    top: var(--space-md);
  }
  .right-md\@xs {
    right: var(--space-md);
  }
  .bottom-md\@xs {
    bottom: var(--space-md);
  }
  .left-md\@xs {
    left: var(--space-md);
  }
  .top-lg\@xs {
    top: var(--space-lg);
  }
  .right-lg\@xs {
    right: var(--space-lg);
  }
  .bottom-lg\@xs {
    bottom: var(--space-lg);
  }
  .left-lg\@xs {
    left: var(--space-lg);
  }
  .top-xl\@xs {
    top: var(--space-xl);
  }
  .right-xl\@xs {
    right: var(--space-xl);
  }
  .bottom-xl\@xs {
    bottom: var(--space-xl);
  }
  .left-xl\@xs {
    left: var(--space-xl);
  }
  .top-2xl\@xs {
    top: var(--space-2xl);
  }
  .right-2xl\@xs {
    right: var(--space-2xl);
  }
  .bottom-2xl\@xs {
    bottom: var(--space-2xl);
  }
  .left-2xl\@xs {
    left: var(--space-2xl);
  }
  .top-3xl\@xs {
    top: var(--space-3xl);
  }
  .right-3xl\@xs {
    right: var(--space-3xl);
  }
  .bottom-3xl\@xs {
    bottom: var(--space-3xl);
  }
  .left-3xl\@xs {
    left: var(--space-3xl);
  }
  .top-4xl\@xs {
    top: var(--space-4xl);
  }
  .right-4xl\@xs {
    right: var(--space-4xl);
  }
  .bottom-4xl\@xs {
    bottom: var(--space-4xl);
  }
  .left-4xl\@xs {
    left: var(--space-4xl);
  }
  .top-50\%\@xs {
    top: 50%;
  }
  .top-auto\@xs {
    top: auto;
  }
  .top-0\@xs {
    top: 0;
  }
  .right-50\%\@xs {
    right: 50%;
  }
  .right-auto\@xs {
    right: auto;
  }
  .right-0\@xs {
    right: 0;
  }
  .bottom-50\%\@xs {
    bottom: 50%;
  }
  .bottom-auto\@xs {
    bottom: auto;
  }
  .bottom-0\@xs {
    bottom: 0;
  }
  .left-50\%\@xs {
    left: 50%;
  }
  .left-auto\@xs {
    left: auto;
  }
  .left-0\@xs {
    left: 0;
  }
  /* overflow */
  .overflow-visible\@xs {
    overflow: visible;
  }
  .overflow-hidden\@xs {
    overflow: hidden;
  }
  .overflow-auto\@xs {
    overflow: auto;
  }
  .momentum-scrolling\@xs {
    -webkit-overflow-scrolling: touch;
  }
  /* visibility */
  .visible\@xs {
    visibility: visible;
  }
  .invisible\@xs {
    visibility: hidden;
  }
}
@media not all and (min-width: 32rem) {
  .display\@xs {
    display: none !important;
  }
}
@media (min-width: 48rem) {
  /* grid */
  .grid-col-1\@sm {
    --grid-columns: 1;
  }
  .col-1\@sm {
    --column-span: 1;
  }
  .grid-col-2\@sm {
    --grid-columns: 2;
  }
  .col-2\@sm {
    --column-span: 2;
  }
  .grid-col-3\@sm {
    --grid-columns: 3;
  }
  .col-3\@sm {
    --column-span: 3;
  }
  .grid-col-4\@sm {
    --grid-columns: 4;
  }
  .col-4\@sm {
    --column-span: 4;
  }
  .grid-col-5\@sm {
    --grid-columns: 5;
  }
  .col-5\@sm {
    --column-span: 5;
  }
  .grid-col-6\@sm {
    --grid-columns: 6;
  }
  .col-6\@sm {
    --column-span: 6;
  }
  .grid-col-7\@sm {
    --grid-columns: 7;
  }
  .col-7\@sm {
    --column-span: 7;
  }
  .grid-col-8\@sm {
    --grid-columns: 8;
  }
  .col-8\@sm {
    --column-span: 8;
  }
  .grid-col-9\@sm {
    --grid-columns: 9;
  }
  .col-9\@sm {
    --column-span: 9;
  }
  .grid-col-10\@sm {
    --grid-columns: 10;
  }
  .col-10\@sm {
    --column-span: 10;
  }
  .grid-col-11\@sm {
    --grid-columns: 11;
  }
  .col-11\@sm {
    --column-span: 11;
  }
  .grid-col-12\@sm {
    --grid-columns: 12;
  }
  .col-12\@sm {
    --column-span: 12;
  }
  .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, .col-10\@sm, .col-11\@sm, .col-12\@sm {
    width: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-span) / var(--grid-columns) + (var(--column-span) - 1) * var(--column-gap));
    flex: initial;
  }
  .col\@sm {
    width: auto;
    flex: 1 1 0;
  }
  .col-content\@sm {
    width: auto;
    flex: 0 1 auto;
  }
  .offset-1\@sm {
    --column-offset: 1;
  }
  .offset-2\@sm {
    --column-offset: 2;
  }
  .offset-3\@sm {
    --column-offset: 3;
  }
  .offset-4\@sm {
    --column-offset: 4;
  }
  .offset-5\@sm {
    --column-offset: 5;
  }
  .offset-6\@sm {
    --column-offset: 6;
  }
  .offset-7\@sm {
    --column-offset: 7;
  }
  .offset-8\@sm {
    --column-offset: 8;
  }
  .offset-9\@sm {
    --column-offset: 9;
  }
  .offset-10\@sm {
    --column-offset: 10;
  }
  .offset-11\@sm {
    --column-offset: 11;
  }
  .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, .offset-10\@sm, .offset-11\@sm {
    margin-left: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-offset) / var(--grid-columns) + var(--column-offset) * var(--column-gap));
  }
  .offset-0\@sm {
    margin-left: 0;
  }
  /* gap */
  .gap-4xs\@sm {
    --row-gap: var(--space-4xs);
    --column-gap: var(--space-4xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xs\@sm {
    --column-gap: var(--space-4xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xs\@sm {
    --row-gap: var(--space-4xs);
    row-gap: var(--row-gap);
  }
  .gap-3xs\@sm {
    --row-gap: var(--space-3xs);
    --column-gap: var(--space-3xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xs\@sm {
    --column-gap: var(--space-3xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xs\@sm {
    --row-gap: var(--space-3xs);
    row-gap: var(--row-gap);
  }
  .gap-2xs\@sm {
    --row-gap: var(--space-2xs);
    --column-gap: var(--space-2xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xs\@sm {
    --column-gap: var(--space-2xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xs\@sm {
    --row-gap: var(--space-2xs);
    row-gap: var(--row-gap);
  }
  .gap-xs\@sm {
    --row-gap: var(--space-xs);
    --column-gap: var(--space-xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xs\@sm {
    --column-gap: var(--space-xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xs\@sm {
    --row-gap: var(--space-xs);
    row-gap: var(--row-gap);
  }
  .gap-sm\@sm {
    --row-gap: var(--space-sm);
    --column-gap: var(--space-sm);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-sm\@sm {
    --column-gap: var(--space-sm);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-sm\@sm {
    --row-gap: var(--space-sm);
    row-gap: var(--row-gap);
  }
  .gap-md\@sm {
    --row-gap: var(--space-md);
    --column-gap: var(--space-md);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-md\@sm {
    --column-gap: var(--space-md);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-md\@sm {
    --row-gap: var(--space-md);
    row-gap: var(--row-gap);
  }
  .gap-lg\@sm {
    --row-gap: var(--space-lg);
    --column-gap: var(--space-lg);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-lg\@sm {
    --column-gap: var(--space-lg);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-lg\@sm {
    --row-gap: var(--space-lg);
    row-gap: var(--row-gap);
  }
  .gap-xl\@sm {
    --row-gap: var(--space-xl);
    --column-gap: var(--space-xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xl\@sm {
    --column-gap: var(--space-xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xl\@sm {
    --row-gap: var(--space-xl);
    row-gap: var(--row-gap);
  }
  .gap-2xl\@sm {
    --row-gap: var(--space-2xl);
    --column-gap: var(--space-2xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xl\@sm {
    --column-gap: var(--space-2xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xl\@sm {
    --row-gap: var(--space-2xl);
    row-gap: var(--row-gap);
  }
  .gap-3xl\@sm {
    --row-gap: var(--space-3xl);
    --column-gap: var(--space-3xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xl\@sm {
    --column-gap: var(--space-3xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xl\@sm {
    --row-gap: var(--space-3xl);
    row-gap: var(--row-gap);
  }
  .gap-4xl\@sm {
    --row-gap: var(--space-4xl);
    --column-gap: var(--space-4xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xl\@sm {
    --column-gap: var(--space-4xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xl\@sm {
    --row-gap: var(--space-4xl);
    row-gap: var(--row-gap);
  }
  .gap-0\@sm {
    --row-gap: 0px;
    --column-gap: 0px;
    gap: 0px;
  }
  .gap-x-0\@sm {
    --column-gap: 0px;
    -moz-column-gap: 0px;
         column-gap: 0px;
  }
  .gap-y-0\@sm {
    --row-gap: 0px;
    row-gap: 0px;
  }
  /* flexbox */
  .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-content */
  .justify-start\@sm {
    justify-content: start;
  }
  .justify-end\@sm {
    justify-content: end;
  }
  .justify-center\@sm {
    justify-content: center;
  }
  .justify-between\@sm {
    justify-content: space-between;
  }
  /* align-items */
  .items-center\@sm {
    align-items: center;
  }
  .items-start\@sm {
    align-items: start;
  }
  .items-end\@sm {
    align-items: end;
  }
  .items-baseline\@sm {
    align-items: baseline;
  }
  .items-stretch\@sm {
    align-items: stretch;
  }
  /* align-content */
  .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 */
  .order-1\@sm {
    order: 1;
  }
  .order-2\@sm {
    order: 2;
  }
  .order-3\@sm {
    order: 3;
  }
  /* display */
  .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;
  }
  /* margin */
  .margin-4xs\@sm {
    margin: var(--space-4xs);
  }
  .margin-3xs\@sm {
    margin: var(--space-3xs);
  }
  .margin-2xs\@sm {
    margin: var(--space-2xs);
  }
  .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-2xl\@sm {
    margin: var(--space-2xl);
  }
  .margin-3xl\@sm {
    margin: var(--space-3xl);
  }
  .margin-4xl\@sm {
    margin: var(--space-4xl);
  }
  .margin-auto\@sm {
    margin: auto;
  }
  .margin-0\@sm {
    margin: 0;
  }
  .margin-y-4xs\@sm {
    margin-top: var(--space-4xs);
    margin-bottom: var(--space-4xs);
  }
  .margin-x-4xs\@sm {
    margin-right: var(--space-4xs);
    margin-left: var(--space-4xs);
  }
  .margin-y-3xs\@sm {
    margin-top: var(--space-3xs);
    margin-bottom: var(--space-3xs);
  }
  .margin-x-3xs\@sm {
    margin-right: var(--space-3xs);
    margin-left: var(--space-3xs);
  }
  .margin-y-2xs\@sm {
    margin-top: var(--space-2xs);
    margin-bottom: var(--space-2xs);
  }
  .margin-x-2xs\@sm {
    margin-right: var(--space-2xs);
    margin-left: var(--space-2xs);
  }
  .margin-y-xs\@sm {
    margin-top: var(--space-xs);
    margin-bottom: var(--space-xs);
  }
  .margin-x-xs\@sm {
    margin-right: var(--space-xs);
    margin-left: var(--space-xs);
  }
  .margin-y-sm\@sm {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
  }
  .margin-x-sm\@sm {
    margin-right: var(--space-sm);
    margin-left: var(--space-sm);
  }
  .margin-y-md\@sm {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
  }
  .margin-x-md\@sm {
    margin-right: var(--space-md);
    margin-left: var(--space-md);
  }
  .margin-y-lg\@sm {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-lg);
  }
  .margin-x-lg\@sm {
    margin-right: var(--space-lg);
    margin-left: var(--space-lg);
  }
  .margin-y-xl\@sm {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-xl);
  }
  .margin-x-xl\@sm {
    margin-right: var(--space-xl);
    margin-left: var(--space-xl);
  }
  .margin-y-2xl\@sm {
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-2xl);
  }
  .margin-x-2xl\@sm {
    margin-right: var(--space-2xl);
    margin-left: var(--space-2xl);
  }
  .margin-y-3xl\@sm {
    margin-top: var(--space-3xl);
    margin-bottom: var(--space-3xl);
  }
  .margin-x-3xl\@sm {
    margin-right: var(--space-3xl);
    margin-left: var(--space-3xl);
  }
  .margin-y-4xl\@sm {
    margin-top: var(--space-4xl);
    margin-bottom: var(--space-4xl);
  }
  .margin-x-4xl\@sm {
    margin-right: var(--space-4xl);
    margin-left: var(--space-4xl);
  }
  .margin-y-auto\@sm {
    margin-top: auto;
    margin-bottom: auto;
  }
  .margin-y-0\@sm {
    margin-top: 0;
    margin-bottom: 0;
  }
  .margin-x-auto\@sm {
    margin-left: auto;
    margin-right: auto;
  }
  .margin-x-0\@sm {
    margin-left: 0;
    margin-right: 0;
  }
  .margin-top-4xs\@sm {
    margin-top: var(--space-4xs);
  }
  .margin-right-4xs\@sm {
    margin-right: var(--space-4xs);
  }
  .margin-bottom-4xs\@sm {
    margin-bottom: var(--space-4xs);
  }
  .margin-left-4xs\@sm {
    margin-left: var(--space-4xs);
  }
  .margin-top-3xs\@sm {
    margin-top: var(--space-3xs);
  }
  .margin-right-3xs\@sm {
    margin-right: var(--space-3xs);
  }
  .margin-bottom-3xs\@sm {
    margin-bottom: var(--space-3xs);
  }
  .margin-left-3xs\@sm {
    margin-left: var(--space-3xs);
  }
  .margin-top-2xs\@sm {
    margin-top: var(--space-2xs);
  }
  .margin-right-2xs\@sm {
    margin-right: var(--space-2xs);
  }
  .margin-bottom-2xs\@sm {
    margin-bottom: var(--space-2xs);
  }
  .margin-left-2xs\@sm {
    margin-left: var(--space-2xs);
  }
  .margin-top-xs\@sm {
    margin-top: var(--space-xs);
  }
  .margin-right-xs\@sm {
    margin-right: var(--space-xs);
  }
  .margin-bottom-xs\@sm {
    margin-bottom: var(--space-xs);
  }
  .margin-left-xs\@sm {
    margin-left: var(--space-xs);
  }
  .margin-top-sm\@sm {
    margin-top: var(--space-sm);
  }
  .margin-right-sm\@sm {
    margin-right: var(--space-sm);
  }
  .margin-bottom-sm\@sm {
    margin-bottom: var(--space-sm);
  }
  .margin-left-sm\@sm {
    margin-left: var(--space-sm);
  }
  .margin-top-md\@sm {
    margin-top: var(--space-md);
  }
  .margin-right-md\@sm {
    margin-right: var(--space-md);
  }
  .margin-bottom-md\@sm {
    margin-bottom: var(--space-md);
  }
  .margin-left-md\@sm {
    margin-left: var(--space-md);
  }
  .margin-top-lg\@sm {
    margin-top: var(--space-lg);
  }
  .margin-right-lg\@sm {
    margin-right: var(--space-lg);
  }
  .margin-bottom-lg\@sm {
    margin-bottom: var(--space-lg);
  }
  .margin-left-lg\@sm {
    margin-left: var(--space-lg);
  }
  .margin-top-xl\@sm {
    margin-top: var(--space-xl);
  }
  .margin-right-xl\@sm {
    margin-right: var(--space-xl);
  }
  .margin-bottom-xl\@sm {
    margin-bottom: var(--space-xl);
  }
  .margin-left-xl\@sm {
    margin-left: var(--space-xl);
  }
  .margin-top-2xl\@sm {
    margin-top: var(--space-2xl);
  }
  .margin-right-2xl\@sm {
    margin-right: var(--space-2xl);
  }
  .margin-bottom-2xl\@sm {
    margin-bottom: var(--space-2xl);
  }
  .margin-left-2xl\@sm {
    margin-left: var(--space-2xl);
  }
  .margin-top-3xl\@sm {
    margin-top: var(--space-3xl);
  }
  .margin-right-3xl\@sm {
    margin-right: var(--space-3xl);
  }
  .margin-bottom-3xl\@sm {
    margin-bottom: var(--space-3xl);
  }
  .margin-left-3xl\@sm {
    margin-left: var(--space-3xl);
  }
  .margin-top-4xl\@sm {
    margin-top: var(--space-4xl);
  }
  .margin-right-4xl\@sm {
    margin-right: var(--space-4xl);
  }
  .margin-bottom-4xl\@sm {
    margin-bottom: var(--space-4xl);
  }
  .margin-left-4xl\@sm {
    margin-left: var(--space-4xl);
  }
  .margin-top-auto\@sm {
    margin-top: auto;
  }
  .margin-top-0\@sm {
    margin-top: 0;
  }
  .margin-right-auto\@sm {
    margin-right: auto;
  }
  .margin-right-0\@sm {
    margin-right: 0;
  }
  .margin-bottom-auto\@sm {
    margin-bottom: auto;
  }
  .margin-bottom-0\@sm {
    margin-bottom: 0;
  }
  .margin-left-auto\@sm {
    margin-left: auto;
  }
  .margin-left-0\@sm {
    margin-left: 0;
  }
  /* padding */
  .padding-4xs\@sm {
    padding: var(--space-4xs);
  }
  .padding-3xs\@sm {
    padding: var(--space-3xs);
  }
  .padding-2xs\@sm {
    padding: var(--space-2xs);
  }
  .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-2xl\@sm {
    padding: var(--space-2xl);
  }
  .padding-3xl\@sm {
    padding: var(--space-3xl);
  }
  .padding-4xl\@sm {
    padding: var(--space-4xl);
  }
  .padding-0\@sm {
    padding: 0;
  }
  .padding-y-4xs\@sm {
    padding-top: var(--space-4xs);
    padding-bottom: var(--space-4xs);
  }
  .padding-x-4xs\@sm {
    padding-right: var(--space-4xs);
    padding-left: var(--space-4xs);
  }
  .padding-y-3xs\@sm {
    padding-top: var(--space-3xs);
    padding-bottom: var(--space-3xs);
  }
  .padding-x-3xs\@sm {
    padding-right: var(--space-3xs);
    padding-left: var(--space-3xs);
  }
  .padding-y-2xs\@sm {
    padding-top: var(--space-2xs);
    padding-bottom: var(--space-2xs);
  }
  .padding-x-2xs\@sm {
    padding-right: var(--space-2xs);
    padding-left: var(--space-2xs);
  }
  .padding-y-xs\@sm {
    padding-top: var(--space-xs);
    padding-bottom: var(--space-xs);
  }
  .padding-x-xs\@sm {
    padding-right: var(--space-xs);
    padding-left: var(--space-xs);
  }
  .padding-y-sm\@sm {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-sm);
  }
  .padding-x-sm\@sm {
    padding-right: var(--space-sm);
    padding-left: var(--space-sm);
  }
  .padding-y-md\@sm {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
  .padding-x-md\@sm {
    padding-right: var(--space-md);
    padding-left: var(--space-md);
  }
  .padding-y-lg\@sm {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
  }
  .padding-x-lg\@sm {
    padding-right: var(--space-lg);
    padding-left: var(--space-lg);
  }
  .padding-y-xl\@sm {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
  }
  .padding-x-xl\@sm {
    padding-right: var(--space-xl);
    padding-left: var(--space-xl);
  }
  .padding-y-2xl\@sm {
    padding-top: var(--space-2xl);
    padding-bottom: var(--space-2xl);
  }
  .padding-x-2xl\@sm {
    padding-right: var(--space-2xl);
    padding-left: var(--space-2xl);
  }
  .padding-y-3xl\@sm {
    padding-top: var(--space-3xl);
    padding-bottom: var(--space-3xl);
  }
  .padding-x-3xl\@sm {
    padding-right: var(--space-3xl);
    padding-left: var(--space-3xl);
  }
  .padding-y-4xl\@sm {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
  }
  .padding-x-4xl\@sm {
    padding-right: var(--space-4xl);
    padding-left: var(--space-4xl);
  }
  .padding-y-0\@sm {
    padding-top: 0;
    padding-bottom: 0;
  }
  .padding-x-0\@sm {
    padding-left: 0;
    padding-right: 0;
  }
  .padding-top-4xs\@sm {
    padding-top: var(--space-4xs);
  }
  .padding-right-4xs\@sm {
    padding-right: var(--space-4xs);
  }
  .padding-bottom-4xs\@sm {
    padding-bottom: var(--space-4xs);
  }
  .padding-left-4xs\@sm {
    padding-left: var(--space-4xs);
  }
  .padding-top-3xs\@sm {
    padding-top: var(--space-3xs);
  }
  .padding-right-3xs\@sm {
    padding-right: var(--space-3xs);
  }
  .padding-bottom-3xs\@sm {
    padding-bottom: var(--space-3xs);
  }
  .padding-left-3xs\@sm {
    padding-left: var(--space-3xs);
  }
  .padding-top-2xs\@sm {
    padding-top: var(--space-2xs);
  }
  .padding-right-2xs\@sm {
    padding-right: var(--space-2xs);
  }
  .padding-bottom-2xs\@sm {
    padding-bottom: var(--space-2xs);
  }
  .padding-left-2xs\@sm {
    padding-left: var(--space-2xs);
  }
  .padding-top-xs\@sm {
    padding-top: var(--space-xs);
  }
  .padding-right-xs\@sm {
    padding-right: var(--space-xs);
  }
  .padding-bottom-xs\@sm {
    padding-bottom: var(--space-xs);
  }
  .padding-left-xs\@sm {
    padding-left: var(--space-xs);
  }
  .padding-top-sm\@sm {
    padding-top: var(--space-sm);
  }
  .padding-right-sm\@sm {
    padding-right: var(--space-sm);
  }
  .padding-bottom-sm\@sm {
    padding-bottom: var(--space-sm);
  }
  .padding-left-sm\@sm {
    padding-left: var(--space-sm);
  }
  .padding-top-md\@sm {
    padding-top: var(--space-md);
  }
  .padding-right-md\@sm {
    padding-right: var(--space-md);
  }
  .padding-bottom-md\@sm {
    padding-bottom: var(--space-md);
  }
  .padding-left-md\@sm {
    padding-left: var(--space-md);
  }
  .padding-top-lg\@sm {
    padding-top: var(--space-lg);
  }
  .padding-right-lg\@sm {
    padding-right: var(--space-lg);
  }
  .padding-bottom-lg\@sm {
    padding-bottom: var(--space-lg);
  }
  .padding-left-lg\@sm {
    padding-left: var(--space-lg);
  }
  .padding-top-xl\@sm {
    padding-top: var(--space-xl);
  }
  .padding-right-xl\@sm {
    padding-right: var(--space-xl);
  }
  .padding-bottom-xl\@sm {
    padding-bottom: var(--space-xl);
  }
  .padding-left-xl\@sm {
    padding-left: var(--space-xl);
  }
  .padding-top-2xl\@sm {
    padding-top: var(--space-2xl);
  }
  .padding-right-2xl\@sm {
    padding-right: var(--space-2xl);
  }
  .padding-bottom-2xl\@sm {
    padding-bottom: var(--space-2xl);
  }
  .padding-left-2xl\@sm {
    padding-left: var(--space-2xl);
  }
  .padding-top-3xl\@sm {
    padding-top: var(--space-3xl);
  }
  .padding-right-3xl\@sm {
    padding-right: var(--space-3xl);
  }
  .padding-bottom-3xl\@sm {
    padding-bottom: var(--space-3xl);
  }
  .padding-left-3xl\@sm {
    padding-left: var(--space-3xl);
  }
  .padding-top-4xl\@sm {
    padding-top: var(--space-4xl);
  }
  .padding-right-4xl\@sm {
    padding-right: var(--space-4xl);
  }
  .padding-bottom-4xl\@sm {
    padding-bottom: var(--space-4xl);
  }
  .padding-left-4xl\@sm {
    padding-left: var(--space-4xl);
  }
  .padding-top-0\@sm {
    padding-top: 0;
  }
  .padding-right-0\@sm {
    padding-right: 0;
  }
  .padding-bottom-0\@sm {
    padding-bottom: 0;
  }
  .padding-left-0\@sm {
    padding-left: 0;
  }
  /* text-align */
  .text-center\@sm {
    text-align: center;
  }
  .text-left\@sm {
    text-align: left;
  }
  .text-right\@sm {
    text-align: right;
  }
  .text-justify\@sm {
    text-align: justify;
  }
  /* font-size */
  .text-xs\@sm {
    font-size: var(--text-xs);
  }
  .text-sm\@sm {
    font-size: var(--text-sm);
  }
  .text-base\@sm {
    font-size: var(--text-base);
  }
  .text-md\@sm {
    font-size: var(--text-md);
  }
  .text-lg\@sm {
    font-size: var(--text-lg);
  }
  .text-xl\@sm {
    font-size: var(--text-xl);
  }
  .text-2xl\@sm {
    font-size: var(--text-2xl);
  }
  .text-3xl\@sm {
    font-size: var(--text-3xl);
  }
  .text-4xl\@sm {
    font-size: var(--text-4xl);
  }
  /* column-count */
  .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 */
  .width-4xs\@sm {
    width: 0.25rem;
  }
  .width-3xs\@sm {
    width: 0.5rem;
  }
  .width-2xs\@sm {
    width: 0.75rem;
  }
  .width-xs\@sm {
    width: 1rem;
  }
  .width-sm\@sm {
    width: 1.5rem;
  }
  .width-md\@sm {
    width: 2rem;
  }
  .width-lg\@sm {
    width: 3rem;
  }
  .width-xl\@sm {
    width: 4rem;
  }
  .width-2xl\@sm {
    width: 6rem;
  }
  .width-3xl\@sm {
    width: 8rem;
  }
  .width-4xl\@sm {
    width: 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%;
  }
  .width-40\%\@sm {
    width: 40%;
  }
  .width-50\%\@sm {
    width: 50%;
  }
  .width-60\%\@sm {
    width: 60%;
  }
  .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-100\%\@sm {
    width: 100%;
  }
  .width-100vw\@sm {
    width: 100vw;
  }
  .width-auto\@sm {
    width: auto;
  }
  .width-inherit\@sm {
    width: inherit;
  }
  .width-0\@sm {
    width: 0;
  }
  /* height */
  .height-4xs\@sm {
    height: 0.25rem;
  }
  .height-3xs\@sm {
    height: 0.5rem;
  }
  .height-2xs\@sm {
    height: 0.75rem;
  }
  .height-xs\@sm {
    height: 1rem;
  }
  .height-sm\@sm {
    height: 1.5rem;
  }
  .height-md\@sm {
    height: 2rem;
  }
  .height-lg\@sm {
    height: 3rem;
  }
  .height-xl\@sm {
    height: 4rem;
  }
  .height-2xl\@sm {
    height: 6rem;
  }
  .height-3xl\@sm {
    height: 8rem;
  }
  .height-4xl\@sm {
    height: 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%;
  }
  .height-40\%\@sm {
    height: 40%;
  }
  .height-50\%\@sm {
    height: 50%;
  }
  .height-60\%\@sm {
    height: 60%;
  }
  .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-100\%\@sm {
    height: 100%;
  }
  .height-100vh\@sm {
    height: 100vh;
  }
  .height-auto\@sm {
    height: auto;
  }
  .height-inherit\@sm {
    height: inherit;
  }
  .height-0\@sm {
    height: 0;
  }
  /* max-width */
  .max-width-3xs\@sm {
    max-width: var(--max-width-3xs);
  }
  .max-width-2xs\@sm {
    max-width: var(--max-width-2xs);
  }
  .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-100\%\@sm {
    max-width: 100%;
  }
  .max-width-none\@sm {
    max-width: none;
  }
  /* position */
  .position-relative\@sm {
    position: relative;
  }
  .position-absolute\@sm {
    position: absolute;
  }
  .position-fixed\@sm {
    position: fixed;
  }
  .position-sticky\@sm {
    position: sticky;
  }
  .position-static\@sm {
    position: static;
  }
  .inset-0\@sm {
    inset: 0;
  }
  .top-4xs\@sm {
    top: var(--space-4xs);
  }
  .right-4xs\@sm {
    right: var(--space-4xs);
  }
  .bottom-4xs\@sm {
    bottom: var(--space-4xs);
  }
  .left-4xs\@sm {
    left: var(--space-4xs);
  }
  .top-3xs\@sm {
    top: var(--space-3xs);
  }
  .right-3xs\@sm {
    right: var(--space-3xs);
  }
  .bottom-3xs\@sm {
    bottom: var(--space-3xs);
  }
  .left-3xs\@sm {
    left: var(--space-3xs);
  }
  .top-2xs\@sm {
    top: var(--space-2xs);
  }
  .right-2xs\@sm {
    right: var(--space-2xs);
  }
  .bottom-2xs\@sm {
    bottom: var(--space-2xs);
  }
  .left-2xs\@sm {
    left: var(--space-2xs);
  }
  .top-xs\@sm {
    top: var(--space-xs);
  }
  .right-xs\@sm {
    right: var(--space-xs);
  }
  .bottom-xs\@sm {
    bottom: var(--space-xs);
  }
  .left-xs\@sm {
    left: var(--space-xs);
  }
  .top-sm\@sm {
    top: var(--space-sm);
  }
  .right-sm\@sm {
    right: var(--space-sm);
  }
  .bottom-sm\@sm {
    bottom: var(--space-sm);
  }
  .left-sm\@sm {
    left: var(--space-sm);
  }
  .top-md\@sm {
    top: var(--space-md);
  }
  .right-md\@sm {
    right: var(--space-md);
  }
  .bottom-md\@sm {
    bottom: var(--space-md);
  }
  .left-md\@sm {
    left: var(--space-md);
  }
  .top-lg\@sm {
    top: var(--space-lg);
  }
  .right-lg\@sm {
    right: var(--space-lg);
  }
  .bottom-lg\@sm {
    bottom: var(--space-lg);
  }
  .left-lg\@sm {
    left: var(--space-lg);
  }
  .top-xl\@sm {
    top: var(--space-xl);
  }
  .right-xl\@sm {
    right: var(--space-xl);
  }
  .bottom-xl\@sm {
    bottom: var(--space-xl);
  }
  .left-xl\@sm {
    left: var(--space-xl);
  }
  .top-2xl\@sm {
    top: var(--space-2xl);
  }
  .right-2xl\@sm {
    right: var(--space-2xl);
  }
  .bottom-2xl\@sm {
    bottom: var(--space-2xl);
  }
  .left-2xl\@sm {
    left: var(--space-2xl);
  }
  .top-3xl\@sm {
    top: var(--space-3xl);
  }
  .right-3xl\@sm {
    right: var(--space-3xl);
  }
  .bottom-3xl\@sm {
    bottom: var(--space-3xl);
  }
  .left-3xl\@sm {
    left: var(--space-3xl);
  }
  .top-4xl\@sm {
    top: var(--space-4xl);
  }
  .right-4xl\@sm {
    right: var(--space-4xl);
  }
  .bottom-4xl\@sm {
    bottom: var(--space-4xl);
  }
  .left-4xl\@sm {
    left: var(--space-4xl);
  }
  .top-50\%\@sm {
    top: 50%;
  }
  .top-auto\@sm {
    top: auto;
  }
  .top-0\@sm {
    top: 0;
  }
  .right-50\%\@sm {
    right: 50%;
  }
  .right-auto\@sm {
    right: auto;
  }
  .right-0\@sm {
    right: 0;
  }
  .bottom-50\%\@sm {
    bottom: 50%;
  }
  .bottom-auto\@sm {
    bottom: auto;
  }
  .bottom-0\@sm {
    bottom: 0;
  }
  .left-50\%\@sm {
    left: 50%;
  }
  .left-auto\@sm {
    left: auto;
  }
  .left-0\@sm {
    left: 0;
  }
  /* overflow */
  .overflow-visible\@sm {
    overflow: visible;
  }
  .overflow-hidden\@sm {
    overflow: hidden;
  }
  .overflow-auto\@sm {
    overflow: auto;
  }
  .momentum-scrolling\@sm {
    -webkit-overflow-scrolling: touch;
  }
  /* visibility */
  .visible\@sm {
    visibility: visible;
  }
  .invisible\@sm {
    visibility: hidden;
  }
}
@media not all and (min-width: 48rem) {
  .display\@sm {
    display: none !important;
  }
}
@media (min-width: 64rem) {
  /* grid */
  .grid-col-1\@md {
    --grid-columns: 1;
  }
  .col-1\@md {
    --column-span: 1;
  }
  .grid-col-2\@md {
    --grid-columns: 2;
  }
  .col-2\@md {
    --column-span: 2;
  }
  .grid-col-3\@md {
    --grid-columns: 3;
  }
  .col-3\@md {
    --column-span: 3;
  }
  .grid-col-4\@md {
    --grid-columns: 4;
  }
  .col-4\@md {
    --column-span: 4;
  }
  .grid-col-5\@md {
    --grid-columns: 5;
  }
  .col-5\@md {
    --column-span: 5;
  }
  .grid-col-6\@md {
    --grid-columns: 6;
  }
  .col-6\@md {
    --column-span: 6;
  }
  .grid-col-7\@md {
    --grid-columns: 7;
  }
  .col-7\@md {
    --column-span: 7;
  }
  .grid-col-8\@md {
    --grid-columns: 8;
  }
  .col-8\@md {
    --column-span: 8;
  }
  .grid-col-9\@md {
    --grid-columns: 9;
  }
  .col-9\@md {
    --column-span: 9;
  }
  .grid-col-10\@md {
    --grid-columns: 10;
  }
  .col-10\@md {
    --column-span: 10;
  }
  .grid-col-11\@md {
    --grid-columns: 11;
  }
  .col-11\@md {
    --column-span: 11;
  }
  .grid-col-12\@md {
    --grid-columns: 12;
  }
  .col-12\@md {
    --column-span: 12;
  }
  .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, .col-10\@md, .col-11\@md, .col-12\@md {
    width: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-span) / var(--grid-columns) + (var(--column-span) - 1) * var(--column-gap));
    flex: initial;
  }
  .col\@md {
    width: auto;
    flex: 1 1 0;
  }
  .col-content\@md {
    width: auto;
    flex: 0 1 auto;
  }
  .offset-1\@md {
    --column-offset: 1;
  }
  .offset-2\@md {
    --column-offset: 2;
  }
  .offset-3\@md {
    --column-offset: 3;
  }
  .offset-4\@md {
    --column-offset: 4;
  }
  .offset-5\@md {
    --column-offset: 5;
  }
  .offset-6\@md {
    --column-offset: 6;
  }
  .offset-7\@md {
    --column-offset: 7;
  }
  .offset-8\@md {
    --column-offset: 8;
  }
  .offset-9\@md {
    --column-offset: 9;
  }
  .offset-10\@md {
    --column-offset: 10;
  }
  .offset-11\@md {
    --column-offset: 11;
  }
  .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, .offset-10\@md, .offset-11\@md {
    margin-left: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-offset) / var(--grid-columns) + var(--column-offset) * var(--column-gap));
  }
  .offset-0\@md {
    margin-left: 0;
  }
  /* gap */
  .gap-4xs\@md {
    --row-gap: var(--space-4xs);
    --column-gap: var(--space-4xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xs\@md {
    --column-gap: var(--space-4xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xs\@md {
    --row-gap: var(--space-4xs);
    row-gap: var(--row-gap);
  }
  .gap-3xs\@md {
    --row-gap: var(--space-3xs);
    --column-gap: var(--space-3xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xs\@md {
    --column-gap: var(--space-3xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xs\@md {
    --row-gap: var(--space-3xs);
    row-gap: var(--row-gap);
  }
  .gap-2xs\@md {
    --row-gap: var(--space-2xs);
    --column-gap: var(--space-2xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xs\@md {
    --column-gap: var(--space-2xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xs\@md {
    --row-gap: var(--space-2xs);
    row-gap: var(--row-gap);
  }
  .gap-xs\@md {
    --row-gap: var(--space-xs);
    --column-gap: var(--space-xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xs\@md {
    --column-gap: var(--space-xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xs\@md {
    --row-gap: var(--space-xs);
    row-gap: var(--row-gap);
  }
  .gap-sm\@md {
    --row-gap: var(--space-sm);
    --column-gap: var(--space-sm);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-sm\@md {
    --column-gap: var(--space-sm);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-sm\@md {
    --row-gap: var(--space-sm);
    row-gap: var(--row-gap);
  }
  .gap-md\@md {
    --row-gap: var(--space-md);
    --column-gap: var(--space-md);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-md\@md {
    --column-gap: var(--space-md);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-md\@md {
    --row-gap: var(--space-md);
    row-gap: var(--row-gap);
  }
  .gap-lg\@md {
    --row-gap: var(--space-lg);
    --column-gap: var(--space-lg);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-lg\@md {
    --column-gap: var(--space-lg);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-lg\@md {
    --row-gap: var(--space-lg);
    row-gap: var(--row-gap);
  }
  .gap-xl\@md {
    --row-gap: var(--space-xl);
    --column-gap: var(--space-xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xl\@md {
    --column-gap: var(--space-xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xl\@md {
    --row-gap: var(--space-xl);
    row-gap: var(--row-gap);
  }
  .gap-2xl\@md {
    --row-gap: var(--space-2xl);
    --column-gap: var(--space-2xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xl\@md {
    --column-gap: var(--space-2xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xl\@md {
    --row-gap: var(--space-2xl);
    row-gap: var(--row-gap);
  }
  .gap-3xl\@md {
    --row-gap: var(--space-3xl);
    --column-gap: var(--space-3xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xl\@md {
    --column-gap: var(--space-3xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xl\@md {
    --row-gap: var(--space-3xl);
    row-gap: var(--row-gap);
  }
  .gap-4xl\@md {
    --row-gap: var(--space-4xl);
    --column-gap: var(--space-4xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xl\@md {
    --column-gap: var(--space-4xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xl\@md {
    --row-gap: var(--space-4xl);
    row-gap: var(--row-gap);
  }
  .gap-0\@md {
    --row-gap: 0px;
    --column-gap: 0px;
    gap: 0px;
  }
  .gap-x-0\@md {
    --column-gap: 0px;
    -moz-column-gap: 0px;
         column-gap: 0px;
  }
  .gap-y-0\@md {
    --row-gap: 0px;
    row-gap: 0px;
  }
  /* flexbox */
  .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-content */
  .justify-start\@md {
    justify-content: start;
  }
  .justify-end\@md {
    justify-content: end;
  }
  .justify-center\@md {
    justify-content: center;
  }
  .justify-between\@md {
    justify-content: space-between;
  }
  /* align-items */
  .items-center\@md {
    align-items: center;
  }
  .items-start\@md {
    align-items: start;
  }
  .items-end\@md {
    align-items: end;
  }
  .items-baseline\@md {
    align-items: baseline;
  }
  .items-stretch\@md {
    align-items: stretch;
  }
  /* align-content */
  .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 */
  .order-1\@md {
    order: 1;
  }
  .order-2\@md {
    order: 2;
  }
  .order-3\@md {
    order: 3;
  }
  /* display */
  .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;
  }
  /* margin */
  .margin-4xs\@md {
    margin: var(--space-4xs);
  }
  .margin-3xs\@md {
    margin: var(--space-3xs);
  }
  .margin-2xs\@md {
    margin: var(--space-2xs);
  }
  .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-2xl\@md {
    margin: var(--space-2xl);
  }
  .margin-3xl\@md {
    margin: var(--space-3xl);
  }
  .margin-4xl\@md {
    margin: var(--space-4xl);
  }
  .margin-auto\@md {
    margin: auto;
  }
  .margin-0\@md {
    margin: 0;
  }
  .margin-y-4xs\@md {
    margin-top: var(--space-4xs);
    margin-bottom: var(--space-4xs);
  }
  .margin-x-4xs\@md {
    margin-right: var(--space-4xs);
    margin-left: var(--space-4xs);
  }
  .margin-y-3xs\@md {
    margin-top: var(--space-3xs);
    margin-bottom: var(--space-3xs);
  }
  .margin-x-3xs\@md {
    margin-right: var(--space-3xs);
    margin-left: var(--space-3xs);
  }
  .margin-y-2xs\@md {
    margin-top: var(--space-2xs);
    margin-bottom: var(--space-2xs);
  }
  .margin-x-2xs\@md {
    margin-right: var(--space-2xs);
    margin-left: var(--space-2xs);
  }
  .margin-y-xs\@md {
    margin-top: var(--space-xs);
    margin-bottom: var(--space-xs);
  }
  .margin-x-xs\@md {
    margin-right: var(--space-xs);
    margin-left: var(--space-xs);
  }
  .margin-y-sm\@md {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
  }
  .margin-x-sm\@md {
    margin-right: var(--space-sm);
    margin-left: var(--space-sm);
  }
  .margin-y-md\@md {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
  }
  .margin-x-md\@md {
    margin-right: var(--space-md);
    margin-left: var(--space-md);
  }
  .margin-y-lg\@md {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-lg);
  }
  .margin-x-lg\@md {
    margin-right: var(--space-lg);
    margin-left: var(--space-lg);
  }
  .margin-y-xl\@md {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-xl);
  }
  .margin-x-xl\@md {
    margin-right: var(--space-xl);
    margin-left: var(--space-xl);
  }
  .margin-y-2xl\@md {
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-2xl);
  }
  .margin-x-2xl\@md {
    margin-right: var(--space-2xl);
    margin-left: var(--space-2xl);
  }
  .margin-y-3xl\@md {
    margin-top: var(--space-3xl);
    margin-bottom: var(--space-3xl);
  }
  .margin-x-3xl\@md {
    margin-right: var(--space-3xl);
    margin-left: var(--space-3xl);
  }
  .margin-y-4xl\@md {
    margin-top: var(--space-4xl);
    margin-bottom: var(--space-4xl);
  }
  .margin-x-4xl\@md {
    margin-right: var(--space-4xl);
    margin-left: var(--space-4xl);
  }
  .margin-y-auto\@md {
    margin-top: auto;
    margin-bottom: auto;
  }
  .margin-y-0\@md {
    margin-top: 0;
    margin-bottom: 0;
  }
  .margin-x-auto\@md {
    margin-left: auto;
    margin-right: auto;
  }
  .margin-x-0\@md {
    margin-left: 0;
    margin-right: 0;
  }
  .margin-top-4xs\@md {
    margin-top: var(--space-4xs);
  }
  .margin-right-4xs\@md {
    margin-right: var(--space-4xs);
  }
  .margin-bottom-4xs\@md {
    margin-bottom: var(--space-4xs);
  }
  .margin-left-4xs\@md {
    margin-left: var(--space-4xs);
  }
  .margin-top-3xs\@md {
    margin-top: var(--space-3xs);
  }
  .margin-right-3xs\@md {
    margin-right: var(--space-3xs);
  }
  .margin-bottom-3xs\@md {
    margin-bottom: var(--space-3xs);
  }
  .margin-left-3xs\@md {
    margin-left: var(--space-3xs);
  }
  .margin-top-2xs\@md {
    margin-top: var(--space-2xs);
  }
  .margin-right-2xs\@md {
    margin-right: var(--space-2xs);
  }
  .margin-bottom-2xs\@md {
    margin-bottom: var(--space-2xs);
  }
  .margin-left-2xs\@md {
    margin-left: var(--space-2xs);
  }
  .margin-top-xs\@md {
    margin-top: var(--space-xs);
  }
  .margin-right-xs\@md {
    margin-right: var(--space-xs);
  }
  .margin-bottom-xs\@md {
    margin-bottom: var(--space-xs);
  }
  .margin-left-xs\@md {
    margin-left: var(--space-xs);
  }
  .margin-top-sm\@md {
    margin-top: var(--space-sm);
  }
  .margin-right-sm\@md {
    margin-right: var(--space-sm);
  }
  .margin-bottom-sm\@md {
    margin-bottom: var(--space-sm);
  }
  .margin-left-sm\@md {
    margin-left: var(--space-sm);
  }
  .margin-top-md\@md {
    margin-top: var(--space-md);
  }
  .margin-right-md\@md {
    margin-right: var(--space-md);
  }
  .margin-bottom-md\@md {
    margin-bottom: var(--space-md);
  }
  .margin-left-md\@md {
    margin-left: var(--space-md);
  }
  .margin-top-lg\@md {
    margin-top: var(--space-lg);
  }
  .margin-right-lg\@md {
    margin-right: var(--space-lg);
  }
  .margin-bottom-lg\@md {
    margin-bottom: var(--space-lg);
  }
  .margin-left-lg\@md {
    margin-left: var(--space-lg);
  }
  .margin-top-xl\@md {
    margin-top: var(--space-xl);
  }
  .margin-right-xl\@md {
    margin-right: var(--space-xl);
  }
  .margin-bottom-xl\@md {
    margin-bottom: var(--space-xl);
  }
  .margin-left-xl\@md {
    margin-left: var(--space-xl);
  }
  .margin-top-2xl\@md {
    margin-top: var(--space-2xl);
  }
  .margin-right-2xl\@md {
    margin-right: var(--space-2xl);
  }
  .margin-bottom-2xl\@md {
    margin-bottom: var(--space-2xl);
  }
  .margin-left-2xl\@md {
    margin-left: var(--space-2xl);
  }
  .margin-top-3xl\@md {
    margin-top: var(--space-3xl);
  }
  .margin-right-3xl\@md {
    margin-right: var(--space-3xl);
  }
  .margin-bottom-3xl\@md {
    margin-bottom: var(--space-3xl);
  }
  .margin-left-3xl\@md {
    margin-left: var(--space-3xl);
  }
  .margin-top-4xl\@md {
    margin-top: var(--space-4xl);
  }
  .margin-right-4xl\@md {
    margin-right: var(--space-4xl);
  }
  .margin-bottom-4xl\@md {
    margin-bottom: var(--space-4xl);
  }
  .margin-left-4xl\@md {
    margin-left: var(--space-4xl);
  }
  .margin-top-auto\@md {
    margin-top: auto;
  }
  .margin-top-0\@md {
    margin-top: 0;
  }
  .margin-right-auto\@md {
    margin-right: auto;
  }
  .margin-right-0\@md {
    margin-right: 0;
  }
  .margin-bottom-auto\@md {
    margin-bottom: auto;
  }
  .margin-bottom-0\@md {
    margin-bottom: 0;
  }
  .margin-left-auto\@md {
    margin-left: auto;
  }
  .margin-left-0\@md {
    margin-left: 0;
  }
  /* padding */
  .padding-4xs\@md {
    padding: var(--space-4xs);
  }
  .padding-3xs\@md {
    padding: var(--space-3xs);
  }
  .padding-2xs\@md {
    padding: var(--space-2xs);
  }
  .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-2xl\@md {
    padding: var(--space-2xl);
  }
  .padding-3xl\@md {
    padding: var(--space-3xl);
  }
  .padding-4xl\@md {
    padding: var(--space-4xl);
  }
  .padding-0\@md {
    padding: 0;
  }
  .padding-y-4xs\@md {
    padding-top: var(--space-4xs);
    padding-bottom: var(--space-4xs);
  }
  .padding-x-4xs\@md {
    padding-right: var(--space-4xs);
    padding-left: var(--space-4xs);
  }
  .padding-y-3xs\@md {
    padding-top: var(--space-3xs);
    padding-bottom: var(--space-3xs);
  }
  .padding-x-3xs\@md {
    padding-right: var(--space-3xs);
    padding-left: var(--space-3xs);
  }
  .padding-y-2xs\@md {
    padding-top: var(--space-2xs);
    padding-bottom: var(--space-2xs);
  }
  .padding-x-2xs\@md {
    padding-right: var(--space-2xs);
    padding-left: var(--space-2xs);
  }
  .padding-y-xs\@md {
    padding-top: var(--space-xs);
    padding-bottom: var(--space-xs);
  }
  .padding-x-xs\@md {
    padding-right: var(--space-xs);
    padding-left: var(--space-xs);
  }
  .padding-y-sm\@md {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-sm);
  }
  .padding-x-sm\@md {
    padding-right: var(--space-sm);
    padding-left: var(--space-sm);
  }
  .padding-y-md\@md {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
  .padding-x-md\@md {
    padding-right: var(--space-md);
    padding-left: var(--space-md);
  }
  .padding-y-lg\@md {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
  }
  .padding-x-lg\@md {
    padding-right: var(--space-lg);
    padding-left: var(--space-lg);
  }
  .padding-y-xl\@md {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
  }
  .padding-x-xl\@md {
    padding-right: var(--space-xl);
    padding-left: var(--space-xl);
  }
  .padding-y-2xl\@md {
    padding-top: var(--space-2xl);
    padding-bottom: var(--space-2xl);
  }
  .padding-x-2xl\@md {
    padding-right: var(--space-2xl);
    padding-left: var(--space-2xl);
  }
  .padding-y-3xl\@md {
    padding-top: var(--space-3xl);
    padding-bottom: var(--space-3xl);
  }
  .padding-x-3xl\@md {
    padding-right: var(--space-3xl);
    padding-left: var(--space-3xl);
  }
  .padding-y-4xl\@md {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
  }
  .padding-x-4xl\@md {
    padding-right: var(--space-4xl);
    padding-left: var(--space-4xl);
  }
  .padding-y-0\@md {
    padding-top: 0;
    padding-bottom: 0;
  }
  .padding-x-0\@md {
    padding-left: 0;
    padding-right: 0;
  }
  .padding-top-4xs\@md {
    padding-top: var(--space-4xs);
  }
  .padding-right-4xs\@md {
    padding-right: var(--space-4xs);
  }
  .padding-bottom-4xs\@md {
    padding-bottom: var(--space-4xs);
  }
  .padding-left-4xs\@md {
    padding-left: var(--space-4xs);
  }
  .padding-top-3xs\@md {
    padding-top: var(--space-3xs);
  }
  .padding-right-3xs\@md {
    padding-right: var(--space-3xs);
  }
  .padding-bottom-3xs\@md {
    padding-bottom: var(--space-3xs);
  }
  .padding-left-3xs\@md {
    padding-left: var(--space-3xs);
  }
  .padding-top-2xs\@md {
    padding-top: var(--space-2xs);
  }
  .padding-right-2xs\@md {
    padding-right: var(--space-2xs);
  }
  .padding-bottom-2xs\@md {
    padding-bottom: var(--space-2xs);
  }
  .padding-left-2xs\@md {
    padding-left: var(--space-2xs);
  }
  .padding-top-xs\@md {
    padding-top: var(--space-xs);
  }
  .padding-right-xs\@md {
    padding-right: var(--space-xs);
  }
  .padding-bottom-xs\@md {
    padding-bottom: var(--space-xs);
  }
  .padding-left-xs\@md {
    padding-left: var(--space-xs);
  }
  .padding-top-sm\@md {
    padding-top: var(--space-sm);
  }
  .padding-right-sm\@md {
    padding-right: var(--space-sm);
  }
  .padding-bottom-sm\@md {
    padding-bottom: var(--space-sm);
  }
  .padding-left-sm\@md {
    padding-left: var(--space-sm);
  }
  .padding-top-md\@md {
    padding-top: var(--space-md);
  }
  .padding-right-md\@md {
    padding-right: var(--space-md);
  }
  .padding-bottom-md\@md {
    padding-bottom: var(--space-md);
  }
  .padding-left-md\@md {
    padding-left: var(--space-md);
  }
  .padding-top-lg\@md {
    padding-top: var(--space-lg);
  }
  .padding-right-lg\@md {
    padding-right: var(--space-lg);
  }
  .padding-bottom-lg\@md {
    padding-bottom: var(--space-lg);
  }
  .padding-left-lg\@md {
    padding-left: var(--space-lg);
  }
  .padding-top-xl\@md {
    padding-top: var(--space-xl);
  }
  .padding-right-xl\@md {
    padding-right: var(--space-xl);
  }
  .padding-bottom-xl\@md {
    padding-bottom: var(--space-xl);
  }
  .padding-left-xl\@md {
    padding-left: var(--space-xl);
  }
  .padding-top-2xl\@md {
    padding-top: var(--space-2xl);
  }
  .padding-right-2xl\@md {
    padding-right: var(--space-2xl);
  }
  .padding-bottom-2xl\@md {
    padding-bottom: var(--space-2xl);
  }
  .padding-left-2xl\@md {
    padding-left: var(--space-2xl);
  }
  .padding-top-3xl\@md {
    padding-top: var(--space-3xl);
  }
  .padding-right-3xl\@md {
    padding-right: var(--space-3xl);
  }
  .padding-bottom-3xl\@md {
    padding-bottom: var(--space-3xl);
  }
  .padding-left-3xl\@md {
    padding-left: var(--space-3xl);
  }
  .padding-top-4xl\@md {
    padding-top: var(--space-4xl);
  }
  .padding-right-4xl\@md {
    padding-right: var(--space-4xl);
  }
  .padding-bottom-4xl\@md {
    padding-bottom: var(--space-4xl);
  }
  .padding-left-4xl\@md {
    padding-left: var(--space-4xl);
  }
  .padding-top-0\@md {
    padding-top: 0;
  }
  .padding-right-0\@md {
    padding-right: 0;
  }
  .padding-bottom-0\@md {
    padding-bottom: 0;
  }
  .padding-left-0\@md {
    padding-left: 0;
  }
  /* text-align */
  .text-center\@md {
    text-align: center;
  }
  .text-left\@md {
    text-align: left;
  }
  .text-right\@md {
    text-align: right;
  }
  .text-justify\@md {
    text-align: justify;
  }
  /* font-size */
  .text-xs\@md {
    font-size: var(--text-xs);
  }
  .text-sm\@md {
    font-size: var(--text-sm);
  }
  .text-base\@md {
    font-size: var(--text-base);
  }
  .text-md\@md {
    font-size: var(--text-md);
  }
  .text-lg\@md {
    font-size: var(--text-lg);
  }
  .text-xl\@md {
    font-size: var(--text-xl);
  }
  .text-2xl\@md {
    font-size: var(--text-2xl);
  }
  .text-3xl\@md {
    font-size: var(--text-3xl);
  }
  .text-4xl\@md {
    font-size: var(--text-4xl);
  }
  /* column-count */
  .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 */
  .width-4xs\@md {
    width: 0.25rem;
  }
  .width-3xs\@md {
    width: 0.5rem;
  }
  .width-2xs\@md {
    width: 0.75rem;
  }
  .width-xs\@md {
    width: 1rem;
  }
  .width-sm\@md {
    width: 1.5rem;
  }
  .width-md\@md {
    width: 2rem;
  }
  .width-lg\@md {
    width: 3rem;
  }
  .width-xl\@md {
    width: 4rem;
  }
  .width-2xl\@md {
    width: 6rem;
  }
  .width-3xl\@md {
    width: 8rem;
  }
  .width-4xl\@md {
    width: 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%;
  }
  .width-40\%\@md {
    width: 40%;
  }
  .width-50\%\@md {
    width: 50%;
  }
  .width-60\%\@md {
    width: 60%;
  }
  .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-100\%\@md {
    width: 100%;
  }
  .width-100vw\@md {
    width: 100vw;
  }
  .width-auto\@md {
    width: auto;
  }
  .width-inherit\@md {
    width: inherit;
  }
  .width-0\@md {
    width: 0;
  }
  /* height */
  .height-4xs\@md {
    height: 0.25rem;
  }
  .height-3xs\@md {
    height: 0.5rem;
  }
  .height-2xs\@md {
    height: 0.75rem;
  }
  .height-xs\@md {
    height: 1rem;
  }
  .height-sm\@md {
    height: 1.5rem;
  }
  .height-md\@md {
    height: 2rem;
  }
  .height-lg\@md {
    height: 3rem;
  }
  .height-xl\@md {
    height: 4rem;
  }
  .height-2xl\@md {
    height: 6rem;
  }
  .height-3xl\@md {
    height: 8rem;
  }
  .height-4xl\@md {
    height: 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%;
  }
  .height-40\%\@md {
    height: 40%;
  }
  .height-50\%\@md {
    height: 50%;
  }
  .height-60\%\@md {
    height: 60%;
  }
  .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-100\%\@md {
    height: 100%;
  }
  .height-100vh\@md {
    height: 100vh;
  }
  .height-auto\@md {
    height: auto;
  }
  .height-inherit\@md {
    height: inherit;
  }
  .height-0\@md {
    height: 0;
  }
  /* max-width */
  .max-width-3xs\@md {
    max-width: var(--max-width-3xs);
  }
  .max-width-2xs\@md {
    max-width: var(--max-width-2xs);
  }
  .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-100\%\@md {
    max-width: 100%;
  }
  .max-width-none\@md {
    max-width: none;
  }
  /* position */
  .position-relative\@md {
    position: relative;
  }
  .position-absolute\@md {
    position: absolute;
  }
  .position-fixed\@md {
    position: fixed;
  }
  .position-sticky\@md {
    position: sticky;
  }
  .position-static\@md {
    position: static;
  }
  .inset-0\@md {
    inset: 0;
  }
  .top-4xs\@md {
    top: var(--space-4xs);
  }
  .right-4xs\@md {
    right: var(--space-4xs);
  }
  .bottom-4xs\@md {
    bottom: var(--space-4xs);
  }
  .left-4xs\@md {
    left: var(--space-4xs);
  }
  .top-3xs\@md {
    top: var(--space-3xs);
  }
  .right-3xs\@md {
    right: var(--space-3xs);
  }
  .bottom-3xs\@md {
    bottom: var(--space-3xs);
  }
  .left-3xs\@md {
    left: var(--space-3xs);
  }
  .top-2xs\@md {
    top: var(--space-2xs);
  }
  .right-2xs\@md {
    right: var(--space-2xs);
  }
  .bottom-2xs\@md {
    bottom: var(--space-2xs);
  }
  .left-2xs\@md {
    left: var(--space-2xs);
  }
  .top-xs\@md {
    top: var(--space-xs);
  }
  .right-xs\@md {
    right: var(--space-xs);
  }
  .bottom-xs\@md {
    bottom: var(--space-xs);
  }
  .left-xs\@md {
    left: var(--space-xs);
  }
  .top-sm\@md {
    top: var(--space-sm);
  }
  .right-sm\@md {
    right: var(--space-sm);
  }
  .bottom-sm\@md {
    bottom: var(--space-sm);
  }
  .left-sm\@md {
    left: var(--space-sm);
  }
  .top-md\@md {
    top: var(--space-md);
  }
  .right-md\@md {
    right: var(--space-md);
  }
  .bottom-md\@md {
    bottom: var(--space-md);
  }
  .left-md\@md {
    left: var(--space-md);
  }
  .top-lg\@md {
    top: var(--space-lg);
  }
  .right-lg\@md {
    right: var(--space-lg);
  }
  .bottom-lg\@md {
    bottom: var(--space-lg);
  }
  .left-lg\@md {
    left: var(--space-lg);
  }
  .top-xl\@md {
    top: var(--space-xl);
  }
  .right-xl\@md {
    right: var(--space-xl);
  }
  .bottom-xl\@md {
    bottom: var(--space-xl);
  }
  .left-xl\@md {
    left: var(--space-xl);
  }
  .top-2xl\@md {
    top: var(--space-2xl);
  }
  .right-2xl\@md {
    right: var(--space-2xl);
  }
  .bottom-2xl\@md {
    bottom: var(--space-2xl);
  }
  .left-2xl\@md {
    left: var(--space-2xl);
  }
  .top-3xl\@md {
    top: var(--space-3xl);
  }
  .right-3xl\@md {
    right: var(--space-3xl);
  }
  .bottom-3xl\@md {
    bottom: var(--space-3xl);
  }
  .left-3xl\@md {
    left: var(--space-3xl);
  }
  .top-4xl\@md {
    top: var(--space-4xl);
  }
  .right-4xl\@md {
    right: var(--space-4xl);
  }
  .bottom-4xl\@md {
    bottom: var(--space-4xl);
  }
  .left-4xl\@md {
    left: var(--space-4xl);
  }
  .top-50\%\@md {
    top: 50%;
  }
  .top-auto\@md {
    top: auto;
  }
  .top-0\@md {
    top: 0;
  }
  .right-50\%\@md {
    right: 50%;
  }
  .right-auto\@md {
    right: auto;
  }
  .right-0\@md {
    right: 0;
  }
  .bottom-50\%\@md {
    bottom: 50%;
  }
  .bottom-auto\@md {
    bottom: auto;
  }
  .bottom-0\@md {
    bottom: 0;
  }
  .left-50\%\@md {
    left: 50%;
  }
  .left-auto\@md {
    left: auto;
  }
  .left-0\@md {
    left: 0;
  }
  /* overflow */
  .overflow-visible\@md {
    overflow: visible;
  }
  .overflow-hidden\@md {
    overflow: hidden;
  }
  .overflow-auto\@md {
    overflow: auto;
  }
  .momentum-scrolling\@md {
    -webkit-overflow-scrolling: touch;
  }
  /* visibility */
  .visible\@md {
    visibility: visible;
  }
  .invisible\@md {
    visibility: hidden;
  }
}
@media not all and (min-width: 64rem) {
  .display\@md {
    display: none !important;
  }
}
@media (min-width: 80rem) {
  /* grid */
  .grid-col-1\@lg {
    --grid-columns: 1;
  }
  .col-1\@lg {
    --column-span: 1;
  }
  .grid-col-2\@lg {
    --grid-columns: 2;
  }
  .col-2\@lg {
    --column-span: 2;
  }
  .grid-col-3\@lg {
    --grid-columns: 3;
  }
  .col-3\@lg {
    --column-span: 3;
  }
  .grid-col-4\@lg {
    --grid-columns: 4;
  }
  .col-4\@lg {
    --column-span: 4;
  }
  .grid-col-5\@lg {
    --grid-columns: 5;
  }
  .col-5\@lg {
    --column-span: 5;
  }
  .grid-col-6\@lg {
    --grid-columns: 6;
  }
  .col-6\@lg {
    --column-span: 6;
  }
  .grid-col-7\@lg {
    --grid-columns: 7;
  }
  .col-7\@lg {
    --column-span: 7;
  }
  .grid-col-8\@lg {
    --grid-columns: 8;
  }
  .col-8\@lg {
    --column-span: 8;
  }
  .grid-col-9\@lg {
    --grid-columns: 9;
  }
  .col-9\@lg {
    --column-span: 9;
  }
  .grid-col-10\@lg {
    --grid-columns: 10;
  }
  .col-10\@lg {
    --column-span: 10;
  }
  .grid-col-11\@lg {
    --grid-columns: 11;
  }
  .col-11\@lg {
    --column-span: 11;
  }
  .grid-col-12\@lg {
    --grid-columns: 12;
  }
  .col-12\@lg {
    --column-span: 12;
  }
  .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, .col-10\@lg, .col-11\@lg, .col-12\@lg {
    width: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-span) / var(--grid-columns) + (var(--column-span) - 1) * var(--column-gap));
    flex: initial;
  }
  .col\@lg {
    width: auto;
    flex: 1 1 0;
  }
  .col-content\@lg {
    width: auto;
    flex: 0 1 auto;
  }
  .offset-1\@lg {
    --column-offset: 1;
  }
  .offset-2\@lg {
    --column-offset: 2;
  }
  .offset-3\@lg {
    --column-offset: 3;
  }
  .offset-4\@lg {
    --column-offset: 4;
  }
  .offset-5\@lg {
    --column-offset: 5;
  }
  .offset-6\@lg {
    --column-offset: 6;
  }
  .offset-7\@lg {
    --column-offset: 7;
  }
  .offset-8\@lg {
    --column-offset: 8;
  }
  .offset-9\@lg {
    --column-offset: 9;
  }
  .offset-10\@lg {
    --column-offset: 10;
  }
  .offset-11\@lg {
    --column-offset: 11;
  }
  .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, .offset-10\@lg, .offset-11\@lg {
    margin-left: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-offset) / var(--grid-columns) + var(--column-offset) * var(--column-gap));
  }
  .offset-0\@lg {
    margin-left: 0;
  }
  /* gap */
  .gap-4xs\@lg {
    --row-gap: var(--space-4xs);
    --column-gap: var(--space-4xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xs\@lg {
    --column-gap: var(--space-4xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xs\@lg {
    --row-gap: var(--space-4xs);
    row-gap: var(--row-gap);
  }
  .gap-3xs\@lg {
    --row-gap: var(--space-3xs);
    --column-gap: var(--space-3xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xs\@lg {
    --column-gap: var(--space-3xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xs\@lg {
    --row-gap: var(--space-3xs);
    row-gap: var(--row-gap);
  }
  .gap-2xs\@lg {
    --row-gap: var(--space-2xs);
    --column-gap: var(--space-2xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xs\@lg {
    --column-gap: var(--space-2xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xs\@lg {
    --row-gap: var(--space-2xs);
    row-gap: var(--row-gap);
  }
  .gap-xs\@lg {
    --row-gap: var(--space-xs);
    --column-gap: var(--space-xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xs\@lg {
    --column-gap: var(--space-xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xs\@lg {
    --row-gap: var(--space-xs);
    row-gap: var(--row-gap);
  }
  .gap-sm\@lg {
    --row-gap: var(--space-sm);
    --column-gap: var(--space-sm);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-sm\@lg {
    --column-gap: var(--space-sm);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-sm\@lg {
    --row-gap: var(--space-sm);
    row-gap: var(--row-gap);
  }
  .gap-md\@lg {
    --row-gap: var(--space-md);
    --column-gap: var(--space-md);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-md\@lg {
    --column-gap: var(--space-md);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-md\@lg {
    --row-gap: var(--space-md);
    row-gap: var(--row-gap);
  }
  .gap-lg\@lg {
    --row-gap: var(--space-lg);
    --column-gap: var(--space-lg);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-lg\@lg {
    --column-gap: var(--space-lg);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-lg\@lg {
    --row-gap: var(--space-lg);
    row-gap: var(--row-gap);
  }
  .gap-xl\@lg {
    --row-gap: var(--space-xl);
    --column-gap: var(--space-xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xl\@lg {
    --column-gap: var(--space-xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xl\@lg {
    --row-gap: var(--space-xl);
    row-gap: var(--row-gap);
  }
  .gap-2xl\@lg {
    --row-gap: var(--space-2xl);
    --column-gap: var(--space-2xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xl\@lg {
    --column-gap: var(--space-2xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xl\@lg {
    --row-gap: var(--space-2xl);
    row-gap: var(--row-gap);
  }
  .gap-3xl\@lg {
    --row-gap: var(--space-3xl);
    --column-gap: var(--space-3xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xl\@lg {
    --column-gap: var(--space-3xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xl\@lg {
    --row-gap: var(--space-3xl);
    row-gap: var(--row-gap);
  }
  .gap-4xl\@lg {
    --row-gap: var(--space-4xl);
    --column-gap: var(--space-4xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xl\@lg {
    --column-gap: var(--space-4xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xl\@lg {
    --row-gap: var(--space-4xl);
    row-gap: var(--row-gap);
  }
  .gap-0\@lg {
    --row-gap: 0px;
    --column-gap: 0px;
    gap: 0px;
  }
  .gap-x-0\@lg {
    --column-gap: 0px;
    -moz-column-gap: 0px;
         column-gap: 0px;
  }
  .gap-y-0\@lg {
    --row-gap: 0px;
    row-gap: 0px;
  }
  /* flexbox */
  .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-content */
  .justify-start\@lg {
    justify-content: start;
  }
  .justify-end\@lg {
    justify-content: end;
  }
  .justify-center\@lg {
    justify-content: center;
  }
  .justify-between\@lg {
    justify-content: space-between;
  }
  /* align-items */
  .items-center\@lg {
    align-items: center;
  }
  .items-start\@lg {
    align-items: start;
  }
  .items-end\@lg {
    align-items: end;
  }
  .items-baseline\@lg {
    align-items: baseline;
  }
  .items-stretch\@lg {
    align-items: stretch;
  }
  /* align-content */
  .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 */
  .order-1\@lg {
    order: 1;
  }
  .order-2\@lg {
    order: 2;
  }
  .order-3\@lg {
    order: 3;
  }
  /* display */
  .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;
  }
  /* margin */
  .margin-4xs\@lg {
    margin: var(--space-4xs);
  }
  .margin-3xs\@lg {
    margin: var(--space-3xs);
  }
  .margin-2xs\@lg {
    margin: var(--space-2xs);
  }
  .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-2xl\@lg {
    margin: var(--space-2xl);
  }
  .margin-3xl\@lg {
    margin: var(--space-3xl);
  }
  .margin-4xl\@lg {
    margin: var(--space-4xl);
  }
  .margin-auto\@lg {
    margin: auto;
  }
  .margin-0\@lg {
    margin: 0;
  }
  .margin-y-4xs\@lg {
    margin-top: var(--space-4xs);
    margin-bottom: var(--space-4xs);
  }
  .margin-x-4xs\@lg {
    margin-right: var(--space-4xs);
    margin-left: var(--space-4xs);
  }
  .margin-y-3xs\@lg {
    margin-top: var(--space-3xs);
    margin-bottom: var(--space-3xs);
  }
  .margin-x-3xs\@lg {
    margin-right: var(--space-3xs);
    margin-left: var(--space-3xs);
  }
  .margin-y-2xs\@lg {
    margin-top: var(--space-2xs);
    margin-bottom: var(--space-2xs);
  }
  .margin-x-2xs\@lg {
    margin-right: var(--space-2xs);
    margin-left: var(--space-2xs);
  }
  .margin-y-xs\@lg {
    margin-top: var(--space-xs);
    margin-bottom: var(--space-xs);
  }
  .margin-x-xs\@lg {
    margin-right: var(--space-xs);
    margin-left: var(--space-xs);
  }
  .margin-y-sm\@lg {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
  }
  .margin-x-sm\@lg {
    margin-right: var(--space-sm);
    margin-left: var(--space-sm);
  }
  .margin-y-md\@lg {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
  }
  .margin-x-md\@lg {
    margin-right: var(--space-md);
    margin-left: var(--space-md);
  }
  .margin-y-lg\@lg {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-lg);
  }
  .margin-x-lg\@lg {
    margin-right: var(--space-lg);
    margin-left: var(--space-lg);
  }
  .margin-y-xl\@lg {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-xl);
  }
  .margin-x-xl\@lg {
    margin-right: var(--space-xl);
    margin-left: var(--space-xl);
  }
  .margin-y-2xl\@lg {
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-2xl);
  }
  .margin-x-2xl\@lg {
    margin-right: var(--space-2xl);
    margin-left: var(--space-2xl);
  }
  .margin-y-3xl\@lg {
    margin-top: var(--space-3xl);
    margin-bottom: var(--space-3xl);
  }
  .margin-x-3xl\@lg {
    margin-right: var(--space-3xl);
    margin-left: var(--space-3xl);
  }
  .margin-y-4xl\@lg {
    margin-top: var(--space-4xl);
    margin-bottom: var(--space-4xl);
  }
  .margin-x-4xl\@lg {
    margin-right: var(--space-4xl);
    margin-left: var(--space-4xl);
  }
  .margin-y-auto\@lg {
    margin-top: auto;
    margin-bottom: auto;
  }
  .margin-y-0\@lg {
    margin-top: 0;
    margin-bottom: 0;
  }
  .margin-x-auto\@lg {
    margin-left: auto;
    margin-right: auto;
  }
  .margin-x-0\@lg {
    margin-left: 0;
    margin-right: 0;
  }
  .margin-top-4xs\@lg {
    margin-top: var(--space-4xs);
  }
  .margin-right-4xs\@lg {
    margin-right: var(--space-4xs);
  }
  .margin-bottom-4xs\@lg {
    margin-bottom: var(--space-4xs);
  }
  .margin-left-4xs\@lg {
    margin-left: var(--space-4xs);
  }
  .margin-top-3xs\@lg {
    margin-top: var(--space-3xs);
  }
  .margin-right-3xs\@lg {
    margin-right: var(--space-3xs);
  }
  .margin-bottom-3xs\@lg {
    margin-bottom: var(--space-3xs);
  }
  .margin-left-3xs\@lg {
    margin-left: var(--space-3xs);
  }
  .margin-top-2xs\@lg {
    margin-top: var(--space-2xs);
  }
  .margin-right-2xs\@lg {
    margin-right: var(--space-2xs);
  }
  .margin-bottom-2xs\@lg {
    margin-bottom: var(--space-2xs);
  }
  .margin-left-2xs\@lg {
    margin-left: var(--space-2xs);
  }
  .margin-top-xs\@lg {
    margin-top: var(--space-xs);
  }
  .margin-right-xs\@lg {
    margin-right: var(--space-xs);
  }
  .margin-bottom-xs\@lg {
    margin-bottom: var(--space-xs);
  }
  .margin-left-xs\@lg {
    margin-left: var(--space-xs);
  }
  .margin-top-sm\@lg {
    margin-top: var(--space-sm);
  }
  .margin-right-sm\@lg {
    margin-right: var(--space-sm);
  }
  .margin-bottom-sm\@lg {
    margin-bottom: var(--space-sm);
  }
  .margin-left-sm\@lg {
    margin-left: var(--space-sm);
  }
  .margin-top-md\@lg {
    margin-top: var(--space-md);
  }
  .margin-right-md\@lg {
    margin-right: var(--space-md);
  }
  .margin-bottom-md\@lg {
    margin-bottom: var(--space-md);
  }
  .margin-left-md\@lg {
    margin-left: var(--space-md);
  }
  .margin-top-lg\@lg {
    margin-top: var(--space-lg);
  }
  .margin-right-lg\@lg {
    margin-right: var(--space-lg);
  }
  .margin-bottom-lg\@lg {
    margin-bottom: var(--space-lg);
  }
  .margin-left-lg\@lg {
    margin-left: var(--space-lg);
  }
  .margin-top-xl\@lg {
    margin-top: var(--space-xl);
  }
  .margin-right-xl\@lg {
    margin-right: var(--space-xl);
  }
  .margin-bottom-xl\@lg {
    margin-bottom: var(--space-xl);
  }
  .margin-left-xl\@lg {
    margin-left: var(--space-xl);
  }
  .margin-top-2xl\@lg {
    margin-top: var(--space-2xl);
  }
  .margin-right-2xl\@lg {
    margin-right: var(--space-2xl);
  }
  .margin-bottom-2xl\@lg {
    margin-bottom: var(--space-2xl);
  }
  .margin-left-2xl\@lg {
    margin-left: var(--space-2xl);
  }
  .margin-top-3xl\@lg {
    margin-top: var(--space-3xl);
  }
  .margin-right-3xl\@lg {
    margin-right: var(--space-3xl);
  }
  .margin-bottom-3xl\@lg {
    margin-bottom: var(--space-3xl);
  }
  .margin-left-3xl\@lg {
    margin-left: var(--space-3xl);
  }
  .margin-top-4xl\@lg {
    margin-top: var(--space-4xl);
  }
  .margin-right-4xl\@lg {
    margin-right: var(--space-4xl);
  }
  .margin-bottom-4xl\@lg {
    margin-bottom: var(--space-4xl);
  }
  .margin-left-4xl\@lg {
    margin-left: var(--space-4xl);
  }
  .margin-top-auto\@lg {
    margin-top: auto;
  }
  .margin-top-0\@lg {
    margin-top: 0;
  }
  .margin-right-auto\@lg {
    margin-right: auto;
  }
  .margin-right-0\@lg {
    margin-right: 0;
  }
  .margin-bottom-auto\@lg {
    margin-bottom: auto;
  }
  .margin-bottom-0\@lg {
    margin-bottom: 0;
  }
  .margin-left-auto\@lg {
    margin-left: auto;
  }
  .margin-left-0\@lg {
    margin-left: 0;
  }
  /* padding */
  .padding-4xs\@lg {
    padding: var(--space-4xs);
  }
  .padding-3xs\@lg {
    padding: var(--space-3xs);
  }
  .padding-2xs\@lg {
    padding: var(--space-2xs);
  }
  .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-2xl\@lg {
    padding: var(--space-2xl);
  }
  .padding-3xl\@lg {
    padding: var(--space-3xl);
  }
  .padding-4xl\@lg {
    padding: var(--space-4xl);
  }
  .padding-0\@lg {
    padding: 0;
  }
  .padding-y-4xs\@lg {
    padding-top: var(--space-4xs);
    padding-bottom: var(--space-4xs);
  }
  .padding-x-4xs\@lg {
    padding-right: var(--space-4xs);
    padding-left: var(--space-4xs);
  }
  .padding-y-3xs\@lg {
    padding-top: var(--space-3xs);
    padding-bottom: var(--space-3xs);
  }
  .padding-x-3xs\@lg {
    padding-right: var(--space-3xs);
    padding-left: var(--space-3xs);
  }
  .padding-y-2xs\@lg {
    padding-top: var(--space-2xs);
    padding-bottom: var(--space-2xs);
  }
  .padding-x-2xs\@lg {
    padding-right: var(--space-2xs);
    padding-left: var(--space-2xs);
  }
  .padding-y-xs\@lg {
    padding-top: var(--space-xs);
    padding-bottom: var(--space-xs);
  }
  .padding-x-xs\@lg {
    padding-right: var(--space-xs);
    padding-left: var(--space-xs);
  }
  .padding-y-sm\@lg {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-sm);
  }
  .padding-x-sm\@lg {
    padding-right: var(--space-sm);
    padding-left: var(--space-sm);
  }
  .padding-y-md\@lg {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
  .padding-x-md\@lg {
    padding-right: var(--space-md);
    padding-left: var(--space-md);
  }
  .padding-y-lg\@lg {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
  }
  .padding-x-lg\@lg {
    padding-right: var(--space-lg);
    padding-left: var(--space-lg);
  }
  .padding-y-xl\@lg {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
  }
  .padding-x-xl\@lg {
    padding-right: var(--space-xl);
    padding-left: var(--space-xl);
  }
  .padding-y-2xl\@lg {
    padding-top: var(--space-2xl);
    padding-bottom: var(--space-2xl);
  }
  .padding-x-2xl\@lg {
    padding-right: var(--space-2xl);
    padding-left: var(--space-2xl);
  }
  .padding-y-3xl\@lg {
    padding-top: var(--space-3xl);
    padding-bottom: var(--space-3xl);
  }
  .padding-x-3xl\@lg {
    padding-right: var(--space-3xl);
    padding-left: var(--space-3xl);
  }
  .padding-y-4xl\@lg {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
  }
  .padding-x-4xl\@lg {
    padding-right: var(--space-4xl);
    padding-left: var(--space-4xl);
  }
  .padding-y-0\@lg {
    padding-top: 0;
    padding-bottom: 0;
  }
  .padding-x-0\@lg {
    padding-left: 0;
    padding-right: 0;
  }
  .padding-top-4xs\@lg {
    padding-top: var(--space-4xs);
  }
  .padding-right-4xs\@lg {
    padding-right: var(--space-4xs);
  }
  .padding-bottom-4xs\@lg {
    padding-bottom: var(--space-4xs);
  }
  .padding-left-4xs\@lg {
    padding-left: var(--space-4xs);
  }
  .padding-top-3xs\@lg {
    padding-top: var(--space-3xs);
  }
  .padding-right-3xs\@lg {
    padding-right: var(--space-3xs);
  }
  .padding-bottom-3xs\@lg {
    padding-bottom: var(--space-3xs);
  }
  .padding-left-3xs\@lg {
    padding-left: var(--space-3xs);
  }
  .padding-top-2xs\@lg {
    padding-top: var(--space-2xs);
  }
  .padding-right-2xs\@lg {
    padding-right: var(--space-2xs);
  }
  .padding-bottom-2xs\@lg {
    padding-bottom: var(--space-2xs);
  }
  .padding-left-2xs\@lg {
    padding-left: var(--space-2xs);
  }
  .padding-top-xs\@lg {
    padding-top: var(--space-xs);
  }
  .padding-right-xs\@lg {
    padding-right: var(--space-xs);
  }
  .padding-bottom-xs\@lg {
    padding-bottom: var(--space-xs);
  }
  .padding-left-xs\@lg {
    padding-left: var(--space-xs);
  }
  .padding-top-sm\@lg {
    padding-top: var(--space-sm);
  }
  .padding-right-sm\@lg {
    padding-right: var(--space-sm);
  }
  .padding-bottom-sm\@lg {
    padding-bottom: var(--space-sm);
  }
  .padding-left-sm\@lg {
    padding-left: var(--space-sm);
  }
  .padding-top-md\@lg {
    padding-top: var(--space-md);
  }
  .padding-right-md\@lg {
    padding-right: var(--space-md);
  }
  .padding-bottom-md\@lg {
    padding-bottom: var(--space-md);
  }
  .padding-left-md\@lg {
    padding-left: var(--space-md);
  }
  .padding-top-lg\@lg {
    padding-top: var(--space-lg);
  }
  .padding-right-lg\@lg {
    padding-right: var(--space-lg);
  }
  .padding-bottom-lg\@lg {
    padding-bottom: var(--space-lg);
  }
  .padding-left-lg\@lg {
    padding-left: var(--space-lg);
  }
  .padding-top-xl\@lg {
    padding-top: var(--space-xl);
  }
  .padding-right-xl\@lg {
    padding-right: var(--space-xl);
  }
  .padding-bottom-xl\@lg {
    padding-bottom: var(--space-xl);
  }
  .padding-left-xl\@lg {
    padding-left: var(--space-xl);
  }
  .padding-top-2xl\@lg {
    padding-top: var(--space-2xl);
  }
  .padding-right-2xl\@lg {
    padding-right: var(--space-2xl);
  }
  .padding-bottom-2xl\@lg {
    padding-bottom: var(--space-2xl);
  }
  .padding-left-2xl\@lg {
    padding-left: var(--space-2xl);
  }
  .padding-top-3xl\@lg {
    padding-top: var(--space-3xl);
  }
  .padding-right-3xl\@lg {
    padding-right: var(--space-3xl);
  }
  .padding-bottom-3xl\@lg {
    padding-bottom: var(--space-3xl);
  }
  .padding-left-3xl\@lg {
    padding-left: var(--space-3xl);
  }
  .padding-top-4xl\@lg {
    padding-top: var(--space-4xl);
  }
  .padding-right-4xl\@lg {
    padding-right: var(--space-4xl);
  }
  .padding-bottom-4xl\@lg {
    padding-bottom: var(--space-4xl);
  }
  .padding-left-4xl\@lg {
    padding-left: var(--space-4xl);
  }
  .padding-top-0\@lg {
    padding-top: 0;
  }
  .padding-right-0\@lg {
    padding-right: 0;
  }
  .padding-bottom-0\@lg {
    padding-bottom: 0;
  }
  .padding-left-0\@lg {
    padding-left: 0;
  }
  /* text-align */
  .text-center\@lg {
    text-align: center;
  }
  .text-left\@lg {
    text-align: left;
  }
  .text-right\@lg {
    text-align: right;
  }
  .text-justify\@lg {
    text-align: justify;
  }
  /* font-size */
  .text-xs\@lg {
    font-size: var(--text-xs);
  }
  .text-sm\@lg {
    font-size: var(--text-sm);
  }
  .text-base\@lg {
    font-size: var(--text-base);
  }
  .text-md\@lg {
    font-size: var(--text-md);
  }
  .text-lg\@lg {
    font-size: var(--text-lg);
  }
  .text-xl\@lg {
    font-size: var(--text-xl);
  }
  .text-2xl\@lg {
    font-size: var(--text-2xl);
  }
  .text-3xl\@lg {
    font-size: var(--text-3xl);
  }
  .text-4xl\@lg {
    font-size: var(--text-4xl);
  }
  /* column-count */
  .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 */
  .width-4xs\@lg {
    width: 0.25rem;
  }
  .width-3xs\@lg {
    width: 0.5rem;
  }
  .width-2xs\@lg {
    width: 0.75rem;
  }
  .width-xs\@lg {
    width: 1rem;
  }
  .width-sm\@lg {
    width: 1.5rem;
  }
  .width-md\@lg {
    width: 2rem;
  }
  .width-lg\@lg {
    width: 3rem;
  }
  .width-xl\@lg {
    width: 4rem;
  }
  .width-2xl\@lg {
    width: 6rem;
  }
  .width-3xl\@lg {
    width: 8rem;
  }
  .width-4xl\@lg {
    width: 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%;
  }
  .width-40\%\@lg {
    width: 40%;
  }
  .width-50\%\@lg {
    width: 50%;
  }
  .width-60\%\@lg {
    width: 60%;
  }
  .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-100\%\@lg {
    width: 100%;
  }
  .width-100vw\@lg {
    width: 100vw;
  }
  .width-auto\@lg {
    width: auto;
  }
  .width-inherit\@lg {
    width: inherit;
  }
  .width-0\@lg {
    width: 0;
  }
  /* height */
  .height-4xs\@lg {
    height: 0.25rem;
  }
  .height-3xs\@lg {
    height: 0.5rem;
  }
  .height-2xs\@lg {
    height: 0.75rem;
  }
  .height-xs\@lg {
    height: 1rem;
  }
  .height-sm\@lg {
    height: 1.5rem;
  }
  .height-md\@lg {
    height: 2rem;
  }
  .height-lg\@lg {
    height: 3rem;
  }
  .height-xl\@lg {
    height: 4rem;
  }
  .height-2xl\@lg {
    height: 6rem;
  }
  .height-3xl\@lg {
    height: 8rem;
  }
  .height-4xl\@lg {
    height: 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%;
  }
  .height-40\%\@lg {
    height: 40%;
  }
  .height-50\%\@lg {
    height: 50%;
  }
  .height-60\%\@lg {
    height: 60%;
  }
  .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-100\%\@lg {
    height: 100%;
  }
  .height-100vh\@lg {
    height: 100vh;
  }
  .height-auto\@lg {
    height: auto;
  }
  .height-inherit\@lg {
    height: inherit;
  }
  .height-0\@lg {
    height: 0;
  }
  /* max-width */
  .max-width-3xs\@lg {
    max-width: var(--max-width-3xs);
  }
  .max-width-2xs\@lg {
    max-width: var(--max-width-2xs);
  }
  .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-100\%\@lg {
    max-width: 100%;
  }
  .max-width-none\@lg {
    max-width: none;
  }
  /* position */
  .position-relative\@lg {
    position: relative;
  }
  .position-absolute\@lg {
    position: absolute;
  }
  .position-fixed\@lg {
    position: fixed;
  }
  .position-sticky\@lg {
    position: sticky;
  }
  .position-static\@lg {
    position: static;
  }
  .inset-0\@lg {
    inset: 0;
  }
  .top-4xs\@lg {
    top: var(--space-4xs);
  }
  .right-4xs\@lg {
    right: var(--space-4xs);
  }
  .bottom-4xs\@lg {
    bottom: var(--space-4xs);
  }
  .left-4xs\@lg {
    left: var(--space-4xs);
  }
  .top-3xs\@lg {
    top: var(--space-3xs);
  }
  .right-3xs\@lg {
    right: var(--space-3xs);
  }
  .bottom-3xs\@lg {
    bottom: var(--space-3xs);
  }
  .left-3xs\@lg {
    left: var(--space-3xs);
  }
  .top-2xs\@lg {
    top: var(--space-2xs);
  }
  .right-2xs\@lg {
    right: var(--space-2xs);
  }
  .bottom-2xs\@lg {
    bottom: var(--space-2xs);
  }
  .left-2xs\@lg {
    left: var(--space-2xs);
  }
  .top-xs\@lg {
    top: var(--space-xs);
  }
  .right-xs\@lg {
    right: var(--space-xs);
  }
  .bottom-xs\@lg {
    bottom: var(--space-xs);
  }
  .left-xs\@lg {
    left: var(--space-xs);
  }
  .top-sm\@lg {
    top: var(--space-sm);
  }
  .right-sm\@lg {
    right: var(--space-sm);
  }
  .bottom-sm\@lg {
    bottom: var(--space-sm);
  }
  .left-sm\@lg {
    left: var(--space-sm);
  }
  .top-md\@lg {
    top: var(--space-md);
  }
  .right-md\@lg {
    right: var(--space-md);
  }
  .bottom-md\@lg {
    bottom: var(--space-md);
  }
  .left-md\@lg {
    left: var(--space-md);
  }
  .top-lg\@lg {
    top: var(--space-lg);
  }
  .right-lg\@lg {
    right: var(--space-lg);
  }
  .bottom-lg\@lg {
    bottom: var(--space-lg);
  }
  .left-lg\@lg {
    left: var(--space-lg);
  }
  .top-xl\@lg {
    top: var(--space-xl);
  }
  .right-xl\@lg {
    right: var(--space-xl);
  }
  .bottom-xl\@lg {
    bottom: var(--space-xl);
  }
  .left-xl\@lg {
    left: var(--space-xl);
  }
  .top-2xl\@lg {
    top: var(--space-2xl);
  }
  .right-2xl\@lg {
    right: var(--space-2xl);
  }
  .bottom-2xl\@lg {
    bottom: var(--space-2xl);
  }
  .left-2xl\@lg {
    left: var(--space-2xl);
  }
  .top-3xl\@lg {
    top: var(--space-3xl);
  }
  .right-3xl\@lg {
    right: var(--space-3xl);
  }
  .bottom-3xl\@lg {
    bottom: var(--space-3xl);
  }
  .left-3xl\@lg {
    left: var(--space-3xl);
  }
  .top-4xl\@lg {
    top: var(--space-4xl);
  }
  .right-4xl\@lg {
    right: var(--space-4xl);
  }
  .bottom-4xl\@lg {
    bottom: var(--space-4xl);
  }
  .left-4xl\@lg {
    left: var(--space-4xl);
  }
  .top-50\%\@lg {
    top: 50%;
  }
  .top-auto\@lg {
    top: auto;
  }
  .top-0\@lg {
    top: 0;
  }
  .right-50\%\@lg {
    right: 50%;
  }
  .right-auto\@lg {
    right: auto;
  }
  .right-0\@lg {
    right: 0;
  }
  .bottom-50\%\@lg {
    bottom: 50%;
  }
  .bottom-auto\@lg {
    bottom: auto;
  }
  .bottom-0\@lg {
    bottom: 0;
  }
  .left-50\%\@lg {
    left: 50%;
  }
  .left-auto\@lg {
    left: auto;
  }
  .left-0\@lg {
    left: 0;
  }
  /* overflow */
  .overflow-visible\@lg {
    overflow: visible;
  }
  .overflow-hidden\@lg {
    overflow: hidden;
  }
  .overflow-auto\@lg {
    overflow: auto;
  }
  .momentum-scrolling\@lg {
    -webkit-overflow-scrolling: touch;
  }
  /* visibility */
  .visible\@lg {
    visibility: visible;
  }
  .invisible\@lg {
    visibility: hidden;
  }
}
@media not all and (min-width: 80rem) {
  .display\@lg {
    display: none !important;
  }
}
@media (min-width: 90rem) {
  /* grid */
  .grid-col-1\@xl {
    --grid-columns: 1;
  }
  .col-1\@xl {
    --column-span: 1;
  }
  .grid-col-2\@xl {
    --grid-columns: 2;
  }
  .col-2\@xl {
    --column-span: 2;
  }
  .grid-col-3\@xl {
    --grid-columns: 3;
  }
  .col-3\@xl {
    --column-span: 3;
  }
  .grid-col-4\@xl {
    --grid-columns: 4;
  }
  .col-4\@xl {
    --column-span: 4;
  }
  .grid-col-5\@xl {
    --grid-columns: 5;
  }
  .col-5\@xl {
    --column-span: 5;
  }
  .grid-col-6\@xl {
    --grid-columns: 6;
  }
  .col-6\@xl {
    --column-span: 6;
  }
  .grid-col-7\@xl {
    --grid-columns: 7;
  }
  .col-7\@xl {
    --column-span: 7;
  }
  .grid-col-8\@xl {
    --grid-columns: 8;
  }
  .col-8\@xl {
    --column-span: 8;
  }
  .grid-col-9\@xl {
    --grid-columns: 9;
  }
  .col-9\@xl {
    --column-span: 9;
  }
  .grid-col-10\@xl {
    --grid-columns: 10;
  }
  .col-10\@xl {
    --column-span: 10;
  }
  .grid-col-11\@xl {
    --grid-columns: 11;
  }
  .col-11\@xl {
    --column-span: 11;
  }
  .grid-col-12\@xl {
    --grid-columns: 12;
  }
  .col-12\@xl {
    --column-span: 12;
  }
  .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, .col-10\@xl, .col-11\@xl, .col-12\@xl {
    width: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-span) / var(--grid-columns) + (var(--column-span) - 1) * var(--column-gap));
    flex: initial;
  }
  .col\@xl {
    width: auto;
    flex: 1 1 0;
  }
  .col-content\@xl {
    width: auto;
    flex: 0 1 auto;
  }
  .offset-1\@xl {
    --column-offset: 1;
  }
  .offset-2\@xl {
    --column-offset: 2;
  }
  .offset-3\@xl {
    --column-offset: 3;
  }
  .offset-4\@xl {
    --column-offset: 4;
  }
  .offset-5\@xl {
    --column-offset: 5;
  }
  .offset-6\@xl {
    --column-offset: 6;
  }
  .offset-7\@xl {
    --column-offset: 7;
  }
  .offset-8\@xl {
    --column-offset: 8;
  }
  .offset-9\@xl {
    --column-offset: 9;
  }
  .offset-10\@xl {
    --column-offset: 10;
  }
  .offset-11\@xl {
    --column-offset: 11;
  }
  .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, .offset-10\@xl, .offset-11\@xl {
    margin-left: calc((100% - (var(--grid-columns) - 1) * var(--column-gap)) * var(--column-offset) / var(--grid-columns) + var(--column-offset) * var(--column-gap));
  }
  .offset-0\@xl {
    margin-left: 0;
  }
  /* gap */
  .gap-4xs\@xl {
    --row-gap: var(--space-4xs);
    --column-gap: var(--space-4xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xs\@xl {
    --column-gap: var(--space-4xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xs\@xl {
    --row-gap: var(--space-4xs);
    row-gap: var(--row-gap);
  }
  .gap-3xs\@xl {
    --row-gap: var(--space-3xs);
    --column-gap: var(--space-3xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xs\@xl {
    --column-gap: var(--space-3xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xs\@xl {
    --row-gap: var(--space-3xs);
    row-gap: var(--row-gap);
  }
  .gap-2xs\@xl {
    --row-gap: var(--space-2xs);
    --column-gap: var(--space-2xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xs\@xl {
    --column-gap: var(--space-2xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xs\@xl {
    --row-gap: var(--space-2xs);
    row-gap: var(--row-gap);
  }
  .gap-xs\@xl {
    --row-gap: var(--space-xs);
    --column-gap: var(--space-xs);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xs\@xl {
    --column-gap: var(--space-xs);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xs\@xl {
    --row-gap: var(--space-xs);
    row-gap: var(--row-gap);
  }
  .gap-sm\@xl {
    --row-gap: var(--space-sm);
    --column-gap: var(--space-sm);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-sm\@xl {
    --column-gap: var(--space-sm);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-sm\@xl {
    --row-gap: var(--space-sm);
    row-gap: var(--row-gap);
  }
  .gap-md\@xl {
    --row-gap: var(--space-md);
    --column-gap: var(--space-md);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-md\@xl {
    --column-gap: var(--space-md);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-md\@xl {
    --row-gap: var(--space-md);
    row-gap: var(--row-gap);
  }
  .gap-lg\@xl {
    --row-gap: var(--space-lg);
    --column-gap: var(--space-lg);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-lg\@xl {
    --column-gap: var(--space-lg);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-lg\@xl {
    --row-gap: var(--space-lg);
    row-gap: var(--row-gap);
  }
  .gap-xl\@xl {
    --row-gap: var(--space-xl);
    --column-gap: var(--space-xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-xl\@xl {
    --column-gap: var(--space-xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-xl\@xl {
    --row-gap: var(--space-xl);
    row-gap: var(--row-gap);
  }
  .gap-2xl\@xl {
    --row-gap: var(--space-2xl);
    --column-gap: var(--space-2xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-2xl\@xl {
    --column-gap: var(--space-2xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-2xl\@xl {
    --row-gap: var(--space-2xl);
    row-gap: var(--row-gap);
  }
  .gap-3xl\@xl {
    --row-gap: var(--space-3xl);
    --column-gap: var(--space-3xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-3xl\@xl {
    --column-gap: var(--space-3xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-3xl\@xl {
    --row-gap: var(--space-3xl);
    row-gap: var(--row-gap);
  }
  .gap-4xl\@xl {
    --row-gap: var(--space-4xl);
    --column-gap: var(--space-4xl);
    gap: var(--row-gap) var(--column-gap);
  }
  .gap-x-4xl\@xl {
    --column-gap: var(--space-4xl);
    -moz-column-gap: var(--column-gap);
         column-gap: var(--column-gap);
  }
  .gap-y-4xl\@xl {
    --row-gap: var(--space-4xl);
    row-gap: var(--row-gap);
  }
  .gap-0\@xl {
    --row-gap: 0px;
    --column-gap: 0px;
    gap: 0px;
  }
  .gap-x-0\@xl {
    --column-gap: 0px;
    -moz-column-gap: 0px;
         column-gap: 0px;
  }
  .gap-y-0\@xl {
    --row-gap: 0px;
    row-gap: 0px;
  }
  /* flexbox */
  .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-content */
  .justify-start\@xl {
    justify-content: start;
  }
  .justify-end\@xl {
    justify-content: end;
  }
  .justify-center\@xl {
    justify-content: center;
  }
  .justify-between\@xl {
    justify-content: space-between;
  }
  /* align-items */
  .items-center\@xl {
    align-items: center;
  }
  .items-start\@xl {
    align-items: start;
  }
  .items-end\@xl {
    align-items: end;
  }
  .items-baseline\@xl {
    align-items: baseline;
  }
  .items-stretch\@xl {
    align-items: stretch;
  }
  /* align-content */
  .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 */
  .order-1\@xl {
    order: 1;
  }
  .order-2\@xl {
    order: 2;
  }
  .order-3\@xl {
    order: 3;
  }
  /* display */
  .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;
  }
  /* margin */
  .margin-4xs\@xl {
    margin: var(--space-4xs);
  }
  .margin-3xs\@xl {
    margin: var(--space-3xs);
  }
  .margin-2xs\@xl {
    margin: var(--space-2xs);
  }
  .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-2xl\@xl {
    margin: var(--space-2xl);
  }
  .margin-3xl\@xl {
    margin: var(--space-3xl);
  }
  .margin-4xl\@xl {
    margin: var(--space-4xl);
  }
  .margin-auto\@xl {
    margin: auto;
  }
  .margin-0\@xl {
    margin: 0;
  }
  .margin-y-4xs\@xl {
    margin-top: var(--space-4xs);
    margin-bottom: var(--space-4xs);
  }
  .margin-x-4xs\@xl {
    margin-right: var(--space-4xs);
    margin-left: var(--space-4xs);
  }
  .margin-y-3xs\@xl {
    margin-top: var(--space-3xs);
    margin-bottom: var(--space-3xs);
  }
  .margin-x-3xs\@xl {
    margin-right: var(--space-3xs);
    margin-left: var(--space-3xs);
  }
  .margin-y-2xs\@xl {
    margin-top: var(--space-2xs);
    margin-bottom: var(--space-2xs);
  }
  .margin-x-2xs\@xl {
    margin-right: var(--space-2xs);
    margin-left: var(--space-2xs);
  }
  .margin-y-xs\@xl {
    margin-top: var(--space-xs);
    margin-bottom: var(--space-xs);
  }
  .margin-x-xs\@xl {
    margin-right: var(--space-xs);
    margin-left: var(--space-xs);
  }
  .margin-y-sm\@xl {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
  }
  .margin-x-sm\@xl {
    margin-right: var(--space-sm);
    margin-left: var(--space-sm);
  }
  .margin-y-md\@xl {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
  }
  .margin-x-md\@xl {
    margin-right: var(--space-md);
    margin-left: var(--space-md);
  }
  .margin-y-lg\@xl {
    margin-top: var(--space-lg);
    margin-bottom: var(--space-lg);
  }
  .margin-x-lg\@xl {
    margin-right: var(--space-lg);
    margin-left: var(--space-lg);
  }
  .margin-y-xl\@xl {
    margin-top: var(--space-xl);
    margin-bottom: var(--space-xl);
  }
  .margin-x-xl\@xl {
    margin-right: var(--space-xl);
    margin-left: var(--space-xl);
  }
  .margin-y-2xl\@xl {
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-2xl);
  }
  .margin-x-2xl\@xl {
    margin-right: var(--space-2xl);
    margin-left: var(--space-2xl);
  }
  .margin-y-3xl\@xl {
    margin-top: var(--space-3xl);
    margin-bottom: var(--space-3xl);
  }
  .margin-x-3xl\@xl {
    margin-right: var(--space-3xl);
    margin-left: var(--space-3xl);
  }
  .margin-y-4xl\@xl {
    margin-top: var(--space-4xl);
    margin-bottom: var(--space-4xl);
  }
  .margin-x-4xl\@xl {
    margin-right: var(--space-4xl);
    margin-left: var(--space-4xl);
  }
  .margin-y-auto\@xl {
    margin-top: auto;
    margin-bottom: auto;
  }
  .margin-y-0\@xl {
    margin-top: 0;
    margin-bottom: 0;
  }
  .margin-x-auto\@xl {
    margin-left: auto;
    margin-right: auto;
  }
  .margin-x-0\@xl {
    margin-left: 0;
    margin-right: 0;
  }
  .margin-top-4xs\@xl {
    margin-top: var(--space-4xs);
  }
  .margin-right-4xs\@xl {
    margin-right: var(--space-4xs);
  }
  .margin-bottom-4xs\@xl {
    margin-bottom: var(--space-4xs);
  }
  .margin-left-4xs\@xl {
    margin-left: var(--space-4xs);
  }
  .margin-top-3xs\@xl {
    margin-top: var(--space-3xs);
  }
  .margin-right-3xs\@xl {
    margin-right: var(--space-3xs);
  }
  .margin-bottom-3xs\@xl {
    margin-bottom: var(--space-3xs);
  }
  .margin-left-3xs\@xl {
    margin-left: var(--space-3xs);
  }
  .margin-top-2xs\@xl {
    margin-top: var(--space-2xs);
  }
  .margin-right-2xs\@xl {
    margin-right: var(--space-2xs);
  }
  .margin-bottom-2xs\@xl {
    margin-bottom: var(--space-2xs);
  }
  .margin-left-2xs\@xl {
    margin-left: var(--space-2xs);
  }
  .margin-top-xs\@xl {
    margin-top: var(--space-xs);
  }
  .margin-right-xs\@xl {
    margin-right: var(--space-xs);
  }
  .margin-bottom-xs\@xl {
    margin-bottom: var(--space-xs);
  }
  .margin-left-xs\@xl {
    margin-left: var(--space-xs);
  }
  .margin-top-sm\@xl {
    margin-top: var(--space-sm);
  }
  .margin-right-sm\@xl {
    margin-right: var(--space-sm);
  }
  .margin-bottom-sm\@xl {
    margin-bottom: var(--space-sm);
  }
  .margin-left-sm\@xl {
    margin-left: var(--space-sm);
  }
  .margin-top-md\@xl {
    margin-top: var(--space-md);
  }
  .margin-right-md\@xl {
    margin-right: var(--space-md);
  }
  .margin-bottom-md\@xl {
    margin-bottom: var(--space-md);
  }
  .margin-left-md\@xl {
    margin-left: var(--space-md);
  }
  .margin-top-lg\@xl {
    margin-top: var(--space-lg);
  }
  .margin-right-lg\@xl {
    margin-right: var(--space-lg);
  }
  .margin-bottom-lg\@xl {
    margin-bottom: var(--space-lg);
  }
  .margin-left-lg\@xl {
    margin-left: var(--space-lg);
  }
  .margin-top-xl\@xl {
    margin-top: var(--space-xl);
  }
  .margin-right-xl\@xl {
    margin-right: var(--space-xl);
  }
  .margin-bottom-xl\@xl {
    margin-bottom: var(--space-xl);
  }
  .margin-left-xl\@xl {
    margin-left: var(--space-xl);
  }
  .margin-top-2xl\@xl {
    margin-top: var(--space-2xl);
  }
  .margin-right-2xl\@xl {
    margin-right: var(--space-2xl);
  }
  .margin-bottom-2xl\@xl {
    margin-bottom: var(--space-2xl);
  }
  .margin-left-2xl\@xl {
    margin-left: var(--space-2xl);
  }
  .margin-top-3xl\@xl {
    margin-top: var(--space-3xl);
  }
  .margin-right-3xl\@xl {
    margin-right: var(--space-3xl);
  }
  .margin-bottom-3xl\@xl {
    margin-bottom: var(--space-3xl);
  }
  .margin-left-3xl\@xl {
    margin-left: var(--space-3xl);
  }
  .margin-top-4xl\@xl {
    margin-top: var(--space-4xl);
  }
  .margin-right-4xl\@xl {
    margin-right: var(--space-4xl);
  }
  .margin-bottom-4xl\@xl {
    margin-bottom: var(--space-4xl);
  }
  .margin-left-4xl\@xl {
    margin-left: var(--space-4xl);
  }
  .margin-top-auto\@xl {
    margin-top: auto;
  }
  .margin-top-0\@xl {
    margin-top: 0;
  }
  .margin-right-auto\@xl {
    margin-right: auto;
  }
  .margin-right-0\@xl {
    margin-right: 0;
  }
  .margin-bottom-auto\@xl {
    margin-bottom: auto;
  }
  .margin-bottom-0\@xl {
    margin-bottom: 0;
  }
  .margin-left-auto\@xl {
    margin-left: auto;
  }
  .margin-left-0\@xl {
    margin-left: 0;
  }
  /* padding */
  .padding-4xs\@xl {
    padding: var(--space-4xs);
  }
  .padding-3xs\@xl {
    padding: var(--space-3xs);
  }
  .padding-2xs\@xl {
    padding: var(--space-2xs);
  }
  .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-2xl\@xl {
    padding: var(--space-2xl);
  }
  .padding-3xl\@xl {
    padding: var(--space-3xl);
  }
  .padding-4xl\@xl {
    padding: var(--space-4xl);
  }
  .padding-0\@xl {
    padding: 0;
  }
  .padding-y-4xs\@xl {
    padding-top: var(--space-4xs);
    padding-bottom: var(--space-4xs);
  }
  .padding-x-4xs\@xl {
    padding-right: var(--space-4xs);
    padding-left: var(--space-4xs);
  }
  .padding-y-3xs\@xl {
    padding-top: var(--space-3xs);
    padding-bottom: var(--space-3xs);
  }
  .padding-x-3xs\@xl {
    padding-right: var(--space-3xs);
    padding-left: var(--space-3xs);
  }
  .padding-y-2xs\@xl {
    padding-top: var(--space-2xs);
    padding-bottom: var(--space-2xs);
  }
  .padding-x-2xs\@xl {
    padding-right: var(--space-2xs);
    padding-left: var(--space-2xs);
  }
  .padding-y-xs\@xl {
    padding-top: var(--space-xs);
    padding-bottom: var(--space-xs);
  }
  .padding-x-xs\@xl {
    padding-right: var(--space-xs);
    padding-left: var(--space-xs);
  }
  .padding-y-sm\@xl {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-sm);
  }
  .padding-x-sm\@xl {
    padding-right: var(--space-sm);
    padding-left: var(--space-sm);
  }
  .padding-y-md\@xl {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
  .padding-x-md\@xl {
    padding-right: var(--space-md);
    padding-left: var(--space-md);
  }
  .padding-y-lg\@xl {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
  }
  .padding-x-lg\@xl {
    padding-right: var(--space-lg);
    padding-left: var(--space-lg);
  }
  .padding-y-xl\@xl {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-xl);
  }
  .padding-x-xl\@xl {
    padding-right: var(--space-xl);
    padding-left: var(--space-xl);
  }
  .padding-y-2xl\@xl {
    padding-top: var(--space-2xl);
    padding-bottom: var(--space-2xl);
  }
  .padding-x-2xl\@xl {
    padding-right: var(--space-2xl);
    padding-left: var(--space-2xl);
  }
  .padding-y-3xl\@xl {
    padding-top: var(--space-3xl);
    padding-bottom: var(--space-3xl);
  }
  .padding-x-3xl\@xl {
    padding-right: var(--space-3xl);
    padding-left: var(--space-3xl);
  }
  .padding-y-4xl\@xl {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
  }
  .padding-x-4xl\@xl {
    padding-right: var(--space-4xl);
    padding-left: var(--space-4xl);
  }
  .padding-y-0\@xl {
    padding-top: 0;
    padding-bottom: 0;
  }
  .padding-x-0\@xl {
    padding-left: 0;
    padding-right: 0;
  }
  .padding-top-4xs\@xl {
    padding-top: var(--space-4xs);
  }
  .padding-right-4xs\@xl {
    padding-right: var(--space-4xs);
  }
  .padding-bottom-4xs\@xl {
    padding-bottom: var(--space-4xs);
  }
  .padding-left-4xs\@xl {
    padding-left: var(--space-4xs);
  }
  .padding-top-3xs\@xl {
    padding-top: var(--space-3xs);
  }
  .padding-right-3xs\@xl {
    padding-right: var(--space-3xs);
  }
  .padding-bottom-3xs\@xl {
    padding-bottom: var(--space-3xs);
  }
  .padding-left-3xs\@xl {
    padding-left: var(--space-3xs);
  }
  .padding-top-2xs\@xl {
    padding-top: var(--space-2xs);
  }
  .padding-right-2xs\@xl {
    padding-right: var(--space-2xs);
  }
  .padding-bottom-2xs\@xl {
    padding-bottom: var(--space-2xs);
  }
  .padding-left-2xs\@xl {
    padding-left: var(--space-2xs);
  }
  .padding-top-xs\@xl {
    padding-top: var(--space-xs);
  }
  .padding-right-xs\@xl {
    padding-right: var(--space-xs);
  }
  .padding-bottom-xs\@xl {
    padding-bottom: var(--space-xs);
  }
  .padding-left-xs\@xl {
    padding-left: var(--space-xs);
  }
  .padding-top-sm\@xl {
    padding-top: var(--space-sm);
  }
  .padding-right-sm\@xl {
    padding-right: var(--space-sm);
  }
  .padding-bottom-sm\@xl {
    padding-bottom: var(--space-sm);
  }
  .padding-left-sm\@xl {
    padding-left: var(--space-sm);
  }
  .padding-top-md\@xl {
    padding-top: var(--space-md);
  }
  .padding-right-md\@xl {
    padding-right: var(--space-md);
  }
  .padding-bottom-md\@xl {
    padding-bottom: var(--space-md);
  }
  .padding-left-md\@xl {
    padding-left: var(--space-md);
  }
  .padding-top-lg\@xl {
    padding-top: var(--space-lg);
  }
  .padding-right-lg\@xl {
    padding-right: var(--space-lg);
  }
  .padding-bottom-lg\@xl {
    padding-bottom: var(--space-lg);
  }
  .padding-left-lg\@xl {
    padding-left: var(--space-lg);
  }
  .padding-top-xl\@xl {
    padding-top: var(--space-xl);
  }
  .padding-right-xl\@xl {
    padding-right: var(--space-xl);
  }
  .padding-bottom-xl\@xl {
    padding-bottom: var(--space-xl);
  }
  .padding-left-xl\@xl {
    padding-left: var(--space-xl);
  }
  .padding-top-2xl\@xl {
    padding-top: var(--space-2xl);
  }
  .padding-right-2xl\@xl {
    padding-right: var(--space-2xl);
  }
  .padding-bottom-2xl\@xl {
    padding-bottom: var(--space-2xl);
  }
  .padding-left-2xl\@xl {
    padding-left: var(--space-2xl);
  }
  .padding-top-3xl\@xl {
    padding-top: var(--space-3xl);
  }
  .padding-right-3xl\@xl {
    padding-right: var(--space-3xl);
  }
  .padding-bottom-3xl\@xl {
    padding-bottom: var(--space-3xl);
  }
  .padding-left-3xl\@xl {
    padding-left: var(--space-3xl);
  }
  .padding-top-4xl\@xl {
    padding-top: var(--space-4xl);
  }
  .padding-right-4xl\@xl {
    padding-right: var(--space-4xl);
  }
  .padding-bottom-4xl\@xl {
    padding-bottom: var(--space-4xl);
  }
  .padding-left-4xl\@xl {
    padding-left: var(--space-4xl);
  }
  .padding-top-0\@xl {
    padding-top: 0;
  }
  .padding-right-0\@xl {
    padding-right: 0;
  }
  .padding-bottom-0\@xl {
    padding-bottom: 0;
  }
  .padding-left-0\@xl {
    padding-left: 0;
  }
  /* text-align */
  .text-center\@xl {
    text-align: center;
  }
  .text-left\@xl {
    text-align: left;
  }
  .text-right\@xl {
    text-align: right;
  }
  .text-justify\@xl {
    text-align: justify;
  }
  /* font-size */
  .text-xs\@xl {
    font-size: var(--text-xs);
  }
  .text-sm\@xl {
    font-size: var(--text-sm);
  }
  .text-base\@xl {
    font-size: var(--text-base);
  }
  .text-md\@xl {
    font-size: var(--text-md);
  }
  .text-lg\@xl {
    font-size: var(--text-lg);
  }
  .text-xl\@xl {
    font-size: var(--text-xl);
  }
  .text-2xl\@xl {
    font-size: var(--text-2xl);
  }
  .text-3xl\@xl {
    font-size: var(--text-3xl);
  }
  .text-4xl\@xl {
    font-size: var(--text-4xl);
  }
  /* column-count */
  .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 */
  .width-4xs\@xl {
    width: 0.25rem;
  }
  .width-3xs\@xl {
    width: 0.5rem;
  }
  .width-2xs\@xl {
    width: 0.75rem;
  }
  .width-xs\@xl {
    width: 1rem;
  }
  .width-sm\@xl {
    width: 1.5rem;
  }
  .width-md\@xl {
    width: 2rem;
  }
  .width-lg\@xl {
    width: 3rem;
  }
  .width-xl\@xl {
    width: 4rem;
  }
  .width-2xl\@xl {
    width: 6rem;
  }
  .width-3xl\@xl {
    width: 8rem;
  }
  .width-4xl\@xl {
    width: 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%;
  }
  .width-40\%\@xl {
    width: 40%;
  }
  .width-50\%\@xl {
    width: 50%;
  }
  .width-60\%\@xl {
    width: 60%;
  }
  .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-100\%\@xl {
    width: 100%;
  }
  .width-100vw\@xl {
    width: 100vw;
  }
  .width-auto\@xl {
    width: auto;
  }
  .width-inherit\@xl {
    width: inherit;
  }
  .width-0\@xl {
    width: 0;
  }
  /* height */
  .height-4xs\@xl {
    height: 0.25rem;
  }
  .height-3xs\@xl {
    height: 0.5rem;
  }
  .height-2xs\@xl {
    height: 0.75rem;
  }
  .height-xs\@xl {
    height: 1rem;
  }
  .height-sm\@xl {
    height: 1.5rem;
  }
  .height-md\@xl {
    height: 2rem;
  }
  .height-lg\@xl {
    height: 3rem;
  }
  .height-xl\@xl {
    height: 4rem;
  }
  .height-2xl\@xl {
    height: 6rem;
  }
  .height-3xl\@xl {
    height: 8rem;
  }
  .height-4xl\@xl {
    height: 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%;
  }
  .height-40\%\@xl {
    height: 40%;
  }
  .height-50\%\@xl {
    height: 50%;
  }
  .height-60\%\@xl {
    height: 60%;
  }
  .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-100\%\@xl {
    height: 100%;
  }
  .height-100vh\@xl {
    height: 100vh;
  }
  .height-auto\@xl {
    height: auto;
  }
  .height-inherit\@xl {
    height: inherit;
  }
  .height-0\@xl {
    height: 0;
  }
  /* max-width */
  .max-width-3xs\@xl {
    max-width: var(--max-width-3xs);
  }
  .max-width-2xs\@xl {
    max-width: var(--max-width-2xs);
  }
  .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-100\%\@xl {
    max-width: 100%;
  }
  .max-width-none\@xl {
    max-width: none;
  }
  /* position */
  .position-relative\@xl {
    position: relative;
  }
  .position-absolute\@xl {
    position: absolute;
  }
  .position-fixed\@xl {
    position: fixed;
  }
  .position-sticky\@xl {
    position: sticky;
  }
  .position-static\@xl {
    position: static;
  }
  .inset-0\@xl {
    inset: 0;
  }
  .top-4xs\@xl {
    top: var(--space-4xs);
  }
  .right-4xs\@xl {
    right: var(--space-4xs);
  }
  .bottom-4xs\@xl {
    bottom: var(--space-4xs);
  }
  .left-4xs\@xl {
    left: var(--space-4xs);
  }
  .top-3xs\@xl {
    top: var(--space-3xs);
  }
  .right-3xs\@xl {
    right: var(--space-3xs);
  }
  .bottom-3xs\@xl {
    bottom: var(--space-3xs);
  }
  .left-3xs\@xl {
    left: var(--space-3xs);
  }
  .top-2xs\@xl {
    top: var(--space-2xs);
  }
  .right-2xs\@xl {
    right: var(--space-2xs);
  }
  .bottom-2xs\@xl {
    bottom: var(--space-2xs);
  }
  .left-2xs\@xl {
    left: var(--space-2xs);
  }
  .top-xs\@xl {
    top: var(--space-xs);
  }
  .right-xs\@xl {
    right: var(--space-xs);
  }
  .bottom-xs\@xl {
    bottom: var(--space-xs);
  }
  .left-xs\@xl {
    left: var(--space-xs);
  }
  .top-sm\@xl {
    top: var(--space-sm);
  }
  .right-sm\@xl {
    right: var(--space-sm);
  }
  .bottom-sm\@xl {
    bottom: var(--space-sm);
  }
  .left-sm\@xl {
    left: var(--space-sm);
  }
  .top-md\@xl {
    top: var(--space-md);
  }
  .right-md\@xl {
    right: var(--space-md);
  }
  .bottom-md\@xl {
    bottom: var(--space-md);
  }
  .left-md\@xl {
    left: var(--space-md);
  }
  .top-lg\@xl {
    top: var(--space-lg);
  }
  .right-lg\@xl {
    right: var(--space-lg);
  }
  .bottom-lg\@xl {
    bottom: var(--space-lg);
  }
  .left-lg\@xl {
    left: var(--space-lg);
  }
  .top-xl\@xl {
    top: var(--space-xl);
  }
  .right-xl\@xl {
    right: var(--space-xl);
  }
  .bottom-xl\@xl {
    bottom: var(--space-xl);
  }
  .left-xl\@xl {
    left: var(--space-xl);
  }
  .top-2xl\@xl {
    top: var(--space-2xl);
  }
  .right-2xl\@xl {
    right: var(--space-2xl);
  }
  .bottom-2xl\@xl {
    bottom: var(--space-2xl);
  }
  .left-2xl\@xl {
    left: var(--space-2xl);
  }
  .top-3xl\@xl {
    top: var(--space-3xl);
  }
  .right-3xl\@xl {
    right: var(--space-3xl);
  }
  .bottom-3xl\@xl {
    bottom: var(--space-3xl);
  }
  .left-3xl\@xl {
    left: var(--space-3xl);
  }
  .top-4xl\@xl {
    top: var(--space-4xl);
  }
  .right-4xl\@xl {
    right: var(--space-4xl);
  }
  .bottom-4xl\@xl {
    bottom: var(--space-4xl);
  }
  .left-4xl\@xl {
    left: var(--space-4xl);
  }
  .top-50\%\@xl {
    top: 50%;
  }
  .top-auto\@xl {
    top: auto;
  }
  .top-0\@xl {
    top: 0;
  }
  .right-50\%\@xl {
    right: 50%;
  }
  .right-auto\@xl {
    right: auto;
  }
  .right-0\@xl {
    right: 0;
  }
  .bottom-50\%\@xl {
    bottom: 50%;
  }
  .bottom-auto\@xl {
    bottom: auto;
  }
  .bottom-0\@xl {
    bottom: 0;
  }
  .left-50\%\@xl {
    left: 50%;
  }
  .left-auto\@xl {
    left: auto;
  }
  .left-0\@xl {
    left: 0;
  }
  /* overflow */
  .overflow-visible\@xl {
    overflow: visible;
  }
  .overflow-hidden\@xl {
    overflow: hidden;
  }
  .overflow-auto\@xl {
    overflow: auto;
  }
  .momentum-scrolling\@xl {
    -webkit-overflow-scrolling: touch;
  }
  /* visibility */
  .visible\@xl {
    visibility: visible;
  }
  .invisible\@xl {
    visibility: hidden;
  }
}
@media not all and (min-width: 90rem) {
  .display\@xl {
    display: none !important;
  }
}