@charset "UTF-8";
@import 'https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap';
@import 'https://fonts.googleapis.com/css2?family=Material+Icons+Outlined';
/**
 * Calculate the luminance for a color.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
/**
 * Calculate the contrast ratio between two colors.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
/**
 * Determine whether to use dark or light text on top of given color.
 * Returns black for dark text and white for light text.
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

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

button {
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  overflow: visible;
  background: transparent;
  outline: none;
  /* inherit font & color from ancestor */
  color: inherit;
  font: inherit;
  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
  line-height: normal;
  /* Corrects font smoothing for webkit */
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
  /* Corrects inability to style clickable `input` types in iOS */
  -webkit-appearance: none;
  font-size: 1rem;
}

*, *:after, *:before {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html {
  min-height: 100%;
  min-width: 320px;
  margin: 0;
}
@media (max-width: 320px) {
  html {
    overflow-x: auto;
  }
}
@media (min-width: 320px) {
  html {
    overflow-x: hidden;
  }
}

body {
  font-family: var(--text-font);
  line-height: 1.2;
  font-weight: 400;
  font-size: 16px;
  overflow-x: hidden;
  min-height: 100vh;
  color: var(--text-color-default);
  background-color: var(--bg-light-default);
  -webkit-tap-highlight-color: transparent;
  min-width: 320px;
}
body.dark-theme {
  background-color: var(--bg-dark-default);
  color: var(--text-color-dark-default);
}
body {
  @break;
  font-size: 16px;
  @break;
}
@media (min-width: 0px) and (max-width: 1200px) {
  body {
    font-size: 15.2px;
  }
}
body {
  @break;
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 12.8px;
  }
}
body {
  @break;
}
@media (min-width: 768px) and (max-width: 1200px) {
  body {
    font-size: 15.2px;
  }
}
body {
  @break;
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 12.8px;
  }
}
body {
  @break;
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body {
    font-size: 16px;
  }
}
body {
  @break;
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body {
    font-size: 16px;
  }
}
body {
  @break;
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body {
    font-size: 16px;
  }
}

a {
  color: rgba(var(--color-primary-default), 1);
  text-decoration: none;
  transition: color 0.3s ease;
}
a:hover {
  transition: color 0.3s ease;
}

p {
  margin-top: calc(var(--spacer) * 0.25);
  margin-bottom: calc(var(--spacer) * 0.75);
}

input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=file] {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  background: transparent;
  width: 100%;
  outline: none;
  border: 1px solid rgba(var(--color-lgray-600), 1);
  font-family: var(--font-primary);
  border-radius: calc(var(--spacer) * 0.25);
  background: white;
}
input[type=text]::placeholder, input[type=email]::placeholder, input[type=password]::placeholder, input[type=number]::placeholder, input[type=date]::placeholder, input[type=file]::placeholder {
  color: rgba(var(--color-lgray-800), 1);
}
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=file] {
  margin: calc(var(--spacer) * 0.125) 0 calc(var(--spacer) * 0.2) 0;
  padding: calc(var(--spacer) * 0.5) calc(var(--spacer) * 0.5);
}
input[type=text].required, input[type=email].required, input[type=password].required, input[type=number].required, input[type=date].required, input[type=file].required {
  border: 2px solid rgba(var(--color-accent-500), 1);
}
input[type=text].required::placeholder, input[type=email].required::placeholder, input[type=password].required::placeholder, input[type=number].required::placeholder, input[type=date].required::placeholder, input[type=file].required::placeholder {
  color: rgba(var(--color-accent-500), 1);
}
input[type=text]:not(:placeholder-shown), input[type=email]:not(:placeholder-shown), input[type=password]:not(:placeholder-shown), input[type=number]:not(:placeholder-shown), input[type=date]:not(:placeholder-shown), input[type=file]:not(:placeholder-shown) {
  border: 2px solid rgba(var(--color-lgray-600), 1);
}

select,
input[list] {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  width: 100%;
  outline: none;
  border: 1px solid rgba(var(--color-lgray-600), 1);
  font-family: var(--font-primary);
  appearance: none;
  background-color: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg fill='%23000000' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
  background-repeat: no-repeat;
  border-radius: calc(var(--spacer) * 0.25);
  background-color: white;
  height: calc(var(--spacer) * 1.25);
  margin: calc(var(--spacer) * 0.125) 0 calc(var(--spacer) * 0.25) 0;
  padding: calc(var(--spacer) * 0.1) calc(var(--spacer) * 0.5);
  background-position-y: center;
  background-position-x: calc(100% - calc(var(--spacer) * 0.5));
  cursor: pointer;
  height: calc(var(--spacer) * 1.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  select,
  input[list] {
    height: calc(var(--spacer) * 1.5);
  }
}

input[type=file] {
  width: 100%;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: calc(var(--spacer) * 0.35);
  padding: calc(var(--spacer) * 0.35) calc(var(--spacer) * 0.5);
  color: rgba(var(--color-secondary-default), 1);
  background-color: white;
  border: 1px solid rgba(var(--color-lgray-600), 1);
  border-radius: calc(var(--spacer) * 0.25);
  cursor: pointer;
}
input[type=file]::file-selector-button {
  padding: calc(var(--spacer) * 0.25) calc(var(--spacer) * 0.75);
  margin-right: calc(var(--spacer) * 0.5);
  border: 1px solid rgba(var(--color-primary-500), 1);
  border-radius: calc(var(--spacer) * 0.25);
  background: rgba(var(--color-primary-500), 1);
  color: #fff;
  font-family: var(--font-primary);
  cursor: pointer;
  height: calc(100% - (var(--spacer) * 0.2));
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
input[type=file]:hover::file-selector-button, input[type=file]:focus::file-selector-button {
  background: rgba(var(--color-primary-500), 1);
  border-color: rgba(var(--color-primary-500), 1);
  opacity: 0.9;
}

textarea {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  width: 100%;
  outline: none;
  border: 1px solid rgba(var(--color-lgray-600), 1);
  font-family: var(--font-primary);
  border-radius: calc(var(--spacer) * 0.25);
  margin: calc(var(--spacer) * 0.125) 0 calc(var(--spacer) * 0.25) 0;
  padding: calc(var(--spacer) * 0.5);
}

.form-group {
  margin-bottom: calc(var(--spacer) * 0.125);
}

.error-notice {
  display: block;
  color: rgba(var(--color-accent-500), 1) !important;
}
.error-notice.hidden {
  display: none;
}

.required-notice {
  display: block;
  color: rgba(var(--color-accent-500), 1) !important;
}
.required-notice.hidden {
  display: none;
}

.custom-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.custom-checkbox .checkbox {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(var(--color-primary-500), 1);
  border-radius: 5px;
  width: calc(var(--spacer) * 0.8);
  height: calc(var(--spacer) * 0.8);
}
.custom-checkbox:hover, .custom-checkbox.active {
  color: rgba(var(--color-accent-500), 1);
}
.custom-checkbox:hover .checkbox, .custom-checkbox.active .checkbox {
  border-color: rgba(var(--color-accent-500), 1);
}
.custom-checkbox.active {
  font-weight: 700;
}
.custom-checkbox.active .checkbox:before {
  color: rgba(var(--color-accent-500), 1);
  content: "✓";
}

label.required {
  color: rgba(var(--color-accent-500), 1);
}

input[type=search] {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  width: 100%;
  outline: none;
  border: 1px solid rgba(var(--color-lgray-600), 1);
  font-family: var(--font-primary);
  border-radius: calc(var(--spacer) * 0.25);
  background-color: white;
  height: calc(var(--spacer) * 1.25);
  margin: calc(var(--spacer) * 0.125) 0 calc(var(--spacer) * 0.25) 0;
  padding: calc(var(--spacer) * 0.1) calc(var(--spacer) * 0.5);
  -webkit-appearance: none;
  appearance: none;
  background-image: none;
  height: calc(var(--spacer) * 1.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  input[type=search] {
    height: calc(var(--spacer) * 1.5);
  }
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*Selection*/
::selection {
  background: rgba(var(--color-primary-500), 1);
  color: rgb(var(--color-primary-contrast-500));
}

[class*=-primary] *::selection, [class*=-primary]::selection {
  background: rgba(var(--color-primary-500), 1);
  color: rgb(var(--color-primary-contrast-500));
}

[class*=-secondary] *::selection, [class*=-secondary]::selection {
  background: rgba(var(--color-secondary-500), 1);
  color: rgb(var(--color-secondary-contrast-500));
}

[class*=-third] *::selection, [class*=-third]::selection {
  background: rgba(var(--color-third-500), 1);
  color: rgb(var(--color-third-contrast-500));
}

[class*=-accent] *::selection, [class*=-accent]::selection {
  background: rgba(var(--color-accent-500), 1);
  color: rgb(var(--color-accent-contrast-500));
}

[class*=-lgray] *::selection, [class*=-lgray]::selection {
  background: rgba(var(--color-lgray-500), 1);
  color: rgb(var(--color-lgray-contrast-500));
}

[class*=-success] *::selection, [class*=-success]::selection {
  background: rgba(var(--color-success-500), 1);
  color: rgb(var(--color-success-contrast-500));
}

[class*=-warning] *::selection, [class*=-warning]::selection {
  background: rgba(var(--color-warning-500), 1);
  color: rgb(var(--color-warning-contrast-500));
}

[class*=-danger] *::selection, [class*=-danger]::selection {
  background: rgba(var(--color-danger-500), 1);
  color: rgb(var(--color-danger-contrast-500));
}

/*Scrollbar*/
::-webkit-scrollbar-track {
  border-radius: 0px;
  background-color: white;
}

::-webkit-scrollbar {
  width: calc(var(--spacer) * 0.333);
  height: calc(var(--spacer) * 0.333);
  background-color: white;
}

::-webkit-scrollbar-thumb {
  border: calc(var(--spacer) * 0.166) solid rgba(var(--color-primary-500), 1);
  border-radius: 0px;
  background-color: rgba(var(--color-primary-500), 1);
}

::-webkit-scrollbar-thumb:hover {
  border: calc(var(--spacer) * 0.166) solid rgba(var(--color-accent-500), 1);
  border-radius: 0px;
  background-color: rgba(var(--color-accent-500), 1);
}

/*Common for sections*/
.section {
  min-height: 50vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: calc(var(--spacer) * 2);
  padding-bottom: calc(var(--spacer) * 2);
}
.section > div {
  min-height: 0;
}
.section:nth-child(odd) {
  background: rgba(var(--color-primary-100), 1);
  color: rgb(var(--color-primary-contrast-100));
}

/*img*/
img {
  width: 100%;
  height: auto;
  display: flex;
}

.img-fit-cover {
  height: 100%;
}
.img-fit-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.background-image {
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center center !important;
}

/*HEADINGS FONTS*/
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5 {
  margin-top: calc(var(--spacer) * 0.5);
  margin-bottom: calc(var(--spacer) * 0.25);
  color: var(--headings-color);
}
body.dark-theme h1, body.dark-theme .h1,
body.dark-theme h2, body.dark-theme .h2,
body.dark-theme h3, body.dark-theme .h3,
body.dark-theme h4, body.dark-theme .h4,
body.dark-theme h5, body.dark-theme .h5 {
  color: var(--headings-color-dark);
}

h1, .h1 {
  font-size: 2.5rem;
  font-family: var(--headings-font);
  line-height: 1.4;
  font-weight: 700;
}

h2, .h2 {
  font-size: 2.25rem;
  font-family: var(--headings-font);
  line-height: 1.4;
  font-weight: 700;
}

h3, .h3 {
  font-size: 2rem;
  font-family: var(--headings-font);
  line-height: 1.4;
  font-weight: 700;
}

h4, .h4 {
  font-size: 1.5rem;
  font-family: var(--headings-font);
  line-height: 1.4;
  font-weight: 700;
}

h5, .h5 {
  font-size: 1.25rem;
  font-family: var(--headings-font);
  line-height: 1.4;
  font-weight: 700;
}

@media (min-width: 0px) and (max-width: 1200px) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 1.625rem;
  }
  h2, .h2 {
    font-size: 1.4625rem;
  }
  h3, .h3 {
    font-size: 1.3rem;
  }
  h4, .h4 {
    font-size: 0.975rem;
  }
  h5, .h5 {
    font-size: 0.8125rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 1.75rem;
  }
  h2, .h2 {
    font-size: 1.575rem;
  }
  h3, .h3 {
    font-size: 1.4rem;
  }
  h4, .h4 {
    font-size: 1.05rem;
  }
  h5, .h5 {
    font-size: 0.875rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 1.75rem;
  }
  h2, .h2 {
    font-size: 1.575rem;
  }
  h3, .h3 {
    font-size: 1.4rem;
  }
  h4, .h4 {
    font-size: 1.05rem;
  }
  h5, .h5 {
    font-size: 0.875rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 1.875rem;
  }
  h2, .h2 {
    font-size: 1.6875rem;
  }
  h3, .h3 {
    font-size: 1.5rem;
  }
  h4, .h4 {
    font-size: 1.125rem;
  }
  h5, .h5 {
    font-size: 0.9375rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 2rem;
  }
  h2, .h2 {
    font-size: 1.8rem;
  }
  h3, .h3 {
    font-size: 1.6rem;
  }
  h4, .h4 {
    font-size: 1.2rem;
  }
  h5, .h5 {
    font-size: 1rem;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 2.25rem;
  }
  h2, .h2 {
    font-size: 2.025rem;
  }
  h3, .h3 {
    font-size: 1.8rem;
  }
  h4, .h4 {
    font-size: 1.35rem;
  }
  h5, .h5 {
    font-size: 1.125rem;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5 {
    margin-top: calc(var(--spacer) * 0.5);
    margin-bottom: calc(var(--spacer) * 0.25);
  }
  h1, .h1 {
    font-size: 2.5rem;
  }
  h2, .h2 {
    font-size: 2.25rem;
  }
  h3, .h3 {
    font-size: 2rem;
  }
  h4, .h4 {
    font-size: 1.5rem;
  }
  h5, .h5 {
    font-size: 1.25rem;
  }
}
.bg-primary-100 {
  background-color: rgba(var(--color-primary-100), 1);
  color: rgb(var(--color-primary-contrast-100));
}

.text-primary-100 {
  color: rgba(var(--color-primary-100), 1);
}

.border-primary-100 {
  border-color: rgba(var(--color-primary-100), 1);
}

.bg-primary-contrast-100 {
  background-color: rgb(var(--color-primary-contrast-100));
  color: rgba(var(--color-primary-100), 1);
}

.text-primary-contrast-100 {
  color: rgb(var(--color-primary-contrast-100));
}

.border-primary-contrast-100 {
  border-color: rgb(var(--color-primary-contrast-100));
}

.bg-primary-200 {
  background-color: rgba(var(--color-primary-200), 1);
  color: rgb(var(--color-primary-contrast-200));
}

.text-primary-200 {
  color: rgba(var(--color-primary-200), 1);
}

.border-primary-200 {
  border-color: rgba(var(--color-primary-200), 1);
}

.bg-primary-contrast-200 {
  background-color: rgb(var(--color-primary-contrast-200));
  color: rgba(var(--color-primary-200), 1);
}

.text-primary-contrast-200 {
  color: rgb(var(--color-primary-contrast-200));
}

.border-primary-contrast-200 {
  border-color: rgb(var(--color-primary-contrast-200));
}

.bg-primary-300 {
  background-color: rgba(var(--color-primary-300), 1);
  color: rgb(var(--color-primary-contrast-300));
}

.text-primary-300 {
  color: rgba(var(--color-primary-300), 1);
}

.border-primary-300 {
  border-color: rgba(var(--color-primary-300), 1);
}

.bg-primary-contrast-300 {
  background-color: rgb(var(--color-primary-contrast-300));
  color: rgba(var(--color-primary-300), 1);
}

.text-primary-contrast-300 {
  color: rgb(var(--color-primary-contrast-300));
}

.border-primary-contrast-300 {
  border-color: rgb(var(--color-primary-contrast-300));
}

.bg-primary-400 {
  background-color: rgba(var(--color-primary-400), 1);
  color: rgb(var(--color-primary-contrast-400));
}

.text-primary-400 {
  color: rgba(var(--color-primary-400), 1);
}

.border-primary-400 {
  border-color: rgba(var(--color-primary-400), 1);
}

.bg-primary-contrast-400 {
  background-color: rgb(var(--color-primary-contrast-400));
  color: rgba(var(--color-primary-400), 1);
}

.text-primary-contrast-400 {
  color: rgb(var(--color-primary-contrast-400));
}

.border-primary-contrast-400 {
  border-color: rgb(var(--color-primary-contrast-400));
}

.bg-primary-500 {
  background-color: rgba(var(--color-primary-500), 1);
  color: rgb(var(--color-primary-contrast-500));
}

.text-primary-500 {
  color: rgba(var(--color-primary-500), 1);
}

.border-primary-500 {
  border-color: rgba(var(--color-primary-500), 1);
}

.bg-primary-contrast-500 {
  background-color: rgb(var(--color-primary-contrast-500));
  color: rgba(var(--color-primary-500), 1);
}

.text-primary-contrast-500 {
  color: rgb(var(--color-primary-contrast-500));
}

.border-primary-contrast-500 {
  border-color: rgb(var(--color-primary-contrast-500));
}

.bg-primary-600 {
  background-color: rgba(var(--color-primary-600), 1);
  color: rgb(var(--color-primary-contrast-600));
}

.text-primary-600 {
  color: rgba(var(--color-primary-600), 1);
}

.border-primary-600 {
  border-color: rgba(var(--color-primary-600), 1);
}

.bg-primary-contrast-600 {
  background-color: rgb(var(--color-primary-contrast-600));
  color: rgba(var(--color-primary-600), 1);
}

.text-primary-contrast-600 {
  color: rgb(var(--color-primary-contrast-600));
}

.border-primary-contrast-600 {
  border-color: rgb(var(--color-primary-contrast-600));
}

.bg-primary-700 {
  background-color: rgba(var(--color-primary-700), 1);
  color: rgb(var(--color-primary-contrast-700));
}

.text-primary-700 {
  color: rgba(var(--color-primary-700), 1);
}

.border-primary-700 {
  border-color: rgba(var(--color-primary-700), 1);
}

.bg-primary-contrast-700 {
  background-color: rgb(var(--color-primary-contrast-700));
  color: rgba(var(--color-primary-700), 1);
}

.text-primary-contrast-700 {
  color: rgb(var(--color-primary-contrast-700));
}

.border-primary-contrast-700 {
  border-color: rgb(var(--color-primary-contrast-700));
}

.bg-primary-800 {
  background-color: rgba(var(--color-primary-800), 1);
  color: rgb(var(--color-primary-contrast-800));
}

.text-primary-800 {
  color: rgba(var(--color-primary-800), 1);
}

.border-primary-800 {
  border-color: rgba(var(--color-primary-800), 1);
}

.bg-primary-contrast-800 {
  background-color: rgb(var(--color-primary-contrast-800));
  color: rgba(var(--color-primary-800), 1);
}

.text-primary-contrast-800 {
  color: rgb(var(--color-primary-contrast-800));
}

.border-primary-contrast-800 {
  border-color: rgb(var(--color-primary-contrast-800));
}

.bg-primary-900 {
  background-color: rgba(var(--color-primary-900), 1);
  color: rgb(var(--color-primary-contrast-900));
}

.text-primary-900 {
  color: rgba(var(--color-primary-900), 1);
}

.border-primary-900 {
  border-color: rgba(var(--color-primary-900), 1);
}

.bg-primary-contrast-900 {
  background-color: rgb(var(--color-primary-contrast-900));
  color: rgba(var(--color-primary-900), 1);
}

.text-primary-contrast-900 {
  color: rgb(var(--color-primary-contrast-900));
}

.border-primary-contrast-900 {
  border-color: rgb(var(--color-primary-contrast-900));
}

.bg-secondary-100 {
  background-color: rgba(var(--color-secondary-100), 1);
  color: rgb(var(--color-secondary-contrast-100));
}

.text-secondary-100 {
  color: rgba(var(--color-secondary-100), 1);
}

.border-secondary-100 {
  border-color: rgba(var(--color-secondary-100), 1);
}

.bg-secondary-contrast-100 {
  background-color: rgb(var(--color-secondary-contrast-100));
  color: rgba(var(--color-secondary-100), 1);
}

.text-secondary-contrast-100 {
  color: rgb(var(--color-secondary-contrast-100));
}

.border-secondary-contrast-100 {
  border-color: rgb(var(--color-secondary-contrast-100));
}

.bg-secondary-200 {
  background-color: rgba(var(--color-secondary-200), 1);
  color: rgb(var(--color-secondary-contrast-200));
}

.text-secondary-200 {
  color: rgba(var(--color-secondary-200), 1);
}

.border-secondary-200 {
  border-color: rgba(var(--color-secondary-200), 1);
}

.bg-secondary-contrast-200 {
  background-color: rgb(var(--color-secondary-contrast-200));
  color: rgba(var(--color-secondary-200), 1);
}

.text-secondary-contrast-200 {
  color: rgb(var(--color-secondary-contrast-200));
}

.border-secondary-contrast-200 {
  border-color: rgb(var(--color-secondary-contrast-200));
}

.bg-secondary-300 {
  background-color: rgba(var(--color-secondary-300), 1);
  color: rgb(var(--color-secondary-contrast-300));
}

.text-secondary-300 {
  color: rgba(var(--color-secondary-300), 1);
}

.border-secondary-300 {
  border-color: rgba(var(--color-secondary-300), 1);
}

.bg-secondary-contrast-300 {
  background-color: rgb(var(--color-secondary-contrast-300));
  color: rgba(var(--color-secondary-300), 1);
}

.text-secondary-contrast-300 {
  color: rgb(var(--color-secondary-contrast-300));
}

.border-secondary-contrast-300 {
  border-color: rgb(var(--color-secondary-contrast-300));
}

.bg-secondary-400 {
  background-color: rgba(var(--color-secondary-400), 1);
  color: rgb(var(--color-secondary-contrast-400));
}

.text-secondary-400 {
  color: rgba(var(--color-secondary-400), 1);
}

.border-secondary-400 {
  border-color: rgba(var(--color-secondary-400), 1);
}

.bg-secondary-contrast-400 {
  background-color: rgb(var(--color-secondary-contrast-400));
  color: rgba(var(--color-secondary-400), 1);
}

.text-secondary-contrast-400 {
  color: rgb(var(--color-secondary-contrast-400));
}

.border-secondary-contrast-400 {
  border-color: rgb(var(--color-secondary-contrast-400));
}

.bg-secondary-500 {
  background-color: rgba(var(--color-secondary-500), 1);
  color: rgb(var(--color-secondary-contrast-500));
}

.text-secondary-500 {
  color: rgba(var(--color-secondary-500), 1);
}

.border-secondary-500 {
  border-color: rgba(var(--color-secondary-500), 1);
}

.bg-secondary-contrast-500 {
  background-color: rgb(var(--color-secondary-contrast-500));
  color: rgba(var(--color-secondary-500), 1);
}

.text-secondary-contrast-500 {
  color: rgb(var(--color-secondary-contrast-500));
}

.border-secondary-contrast-500 {
  border-color: rgb(var(--color-secondary-contrast-500));
}

.bg-secondary-600 {
  background-color: rgba(var(--color-secondary-600), 1);
  color: rgb(var(--color-secondary-contrast-600));
}

.text-secondary-600 {
  color: rgba(var(--color-secondary-600), 1);
}

.border-secondary-600 {
  border-color: rgba(var(--color-secondary-600), 1);
}

.bg-secondary-contrast-600 {
  background-color: rgb(var(--color-secondary-contrast-600));
  color: rgba(var(--color-secondary-600), 1);
}

.text-secondary-contrast-600 {
  color: rgb(var(--color-secondary-contrast-600));
}

.border-secondary-contrast-600 {
  border-color: rgb(var(--color-secondary-contrast-600));
}

.bg-secondary-700 {
  background-color: rgba(var(--color-secondary-700), 1);
  color: rgb(var(--color-secondary-contrast-700));
}

.text-secondary-700 {
  color: rgba(var(--color-secondary-700), 1);
}

.border-secondary-700 {
  border-color: rgba(var(--color-secondary-700), 1);
}

.bg-secondary-contrast-700 {
  background-color: rgb(var(--color-secondary-contrast-700));
  color: rgba(var(--color-secondary-700), 1);
}

.text-secondary-contrast-700 {
  color: rgb(var(--color-secondary-contrast-700));
}

.border-secondary-contrast-700 {
  border-color: rgb(var(--color-secondary-contrast-700));
}

.bg-secondary-800 {
  background-color: rgba(var(--color-secondary-800), 1);
  color: rgb(var(--color-secondary-contrast-800));
}

.text-secondary-800 {
  color: rgba(var(--color-secondary-800), 1);
}

.border-secondary-800 {
  border-color: rgba(var(--color-secondary-800), 1);
}

.bg-secondary-contrast-800 {
  background-color: rgb(var(--color-secondary-contrast-800));
  color: rgba(var(--color-secondary-800), 1);
}

.text-secondary-contrast-800 {
  color: rgb(var(--color-secondary-contrast-800));
}

.border-secondary-contrast-800 {
  border-color: rgb(var(--color-secondary-contrast-800));
}

.bg-secondary-900 {
  background-color: rgba(var(--color-secondary-900), 1);
  color: rgb(var(--color-secondary-contrast-900));
}

.text-secondary-900 {
  color: rgba(var(--color-secondary-900), 1);
}

.border-secondary-900 {
  border-color: rgba(var(--color-secondary-900), 1);
}

.bg-secondary-contrast-900 {
  background-color: rgb(var(--color-secondary-contrast-900));
  color: rgba(var(--color-secondary-900), 1);
}

.text-secondary-contrast-900 {
  color: rgb(var(--color-secondary-contrast-900));
}

.border-secondary-contrast-900 {
  border-color: rgb(var(--color-secondary-contrast-900));
}

.bg-third-100 {
  background-color: rgba(var(--color-third-100), 1);
  color: rgb(var(--color-third-contrast-100));
}

.text-third-100 {
  color: rgba(var(--color-third-100), 1);
}

.border-third-100 {
  border-color: rgba(var(--color-third-100), 1);
}

.bg-third-contrast-100 {
  background-color: rgb(var(--color-third-contrast-100));
  color: rgba(var(--color-third-100), 1);
}

.text-third-contrast-100 {
  color: rgb(var(--color-third-contrast-100));
}

.border-third-contrast-100 {
  border-color: rgb(var(--color-third-contrast-100));
}

.bg-third-200 {
  background-color: rgba(var(--color-third-200), 1);
  color: rgb(var(--color-third-contrast-200));
}

.text-third-200 {
  color: rgba(var(--color-third-200), 1);
}

.border-third-200 {
  border-color: rgba(var(--color-third-200), 1);
}

.bg-third-contrast-200 {
  background-color: rgb(var(--color-third-contrast-200));
  color: rgba(var(--color-third-200), 1);
}

.text-third-contrast-200 {
  color: rgb(var(--color-third-contrast-200));
}

.border-third-contrast-200 {
  border-color: rgb(var(--color-third-contrast-200));
}

.bg-third-300 {
  background-color: rgba(var(--color-third-300), 1);
  color: rgb(var(--color-third-contrast-300));
}

.text-third-300 {
  color: rgba(var(--color-third-300), 1);
}

.border-third-300 {
  border-color: rgba(var(--color-third-300), 1);
}

.bg-third-contrast-300 {
  background-color: rgb(var(--color-third-contrast-300));
  color: rgba(var(--color-third-300), 1);
}

.text-third-contrast-300 {
  color: rgb(var(--color-third-contrast-300));
}

.border-third-contrast-300 {
  border-color: rgb(var(--color-third-contrast-300));
}

.bg-third-400 {
  background-color: rgba(var(--color-third-400), 1);
  color: rgb(var(--color-third-contrast-400));
}

.text-third-400 {
  color: rgba(var(--color-third-400), 1);
}

.border-third-400 {
  border-color: rgba(var(--color-third-400), 1);
}

.bg-third-contrast-400 {
  background-color: rgb(var(--color-third-contrast-400));
  color: rgba(var(--color-third-400), 1);
}

.text-third-contrast-400 {
  color: rgb(var(--color-third-contrast-400));
}

.border-third-contrast-400 {
  border-color: rgb(var(--color-third-contrast-400));
}

.bg-third-500 {
  background-color: rgba(var(--color-third-500), 1);
  color: rgb(var(--color-third-contrast-500));
}

.text-third-500 {
  color: rgba(var(--color-third-500), 1);
}

.border-third-500 {
  border-color: rgba(var(--color-third-500), 1);
}

.bg-third-contrast-500 {
  background-color: rgb(var(--color-third-contrast-500));
  color: rgba(var(--color-third-500), 1);
}

.text-third-contrast-500 {
  color: rgb(var(--color-third-contrast-500));
}

.border-third-contrast-500 {
  border-color: rgb(var(--color-third-contrast-500));
}

.bg-third-600 {
  background-color: rgba(var(--color-third-600), 1);
  color: rgb(var(--color-third-contrast-600));
}

.text-third-600 {
  color: rgba(var(--color-third-600), 1);
}

.border-third-600 {
  border-color: rgba(var(--color-third-600), 1);
}

.bg-third-contrast-600 {
  background-color: rgb(var(--color-third-contrast-600));
  color: rgba(var(--color-third-600), 1);
}

.text-third-contrast-600 {
  color: rgb(var(--color-third-contrast-600));
}

.border-third-contrast-600 {
  border-color: rgb(var(--color-third-contrast-600));
}

.bg-third-700 {
  background-color: rgba(var(--color-third-700), 1);
  color: rgb(var(--color-third-contrast-700));
}

.text-third-700 {
  color: rgba(var(--color-third-700), 1);
}

.border-third-700 {
  border-color: rgba(var(--color-third-700), 1);
}

.bg-third-contrast-700 {
  background-color: rgb(var(--color-third-contrast-700));
  color: rgba(var(--color-third-700), 1);
}

.text-third-contrast-700 {
  color: rgb(var(--color-third-contrast-700));
}

.border-third-contrast-700 {
  border-color: rgb(var(--color-third-contrast-700));
}

.bg-third-800 {
  background-color: rgba(var(--color-third-800), 1);
  color: rgb(var(--color-third-contrast-800));
}

.text-third-800 {
  color: rgba(var(--color-third-800), 1);
}

.border-third-800 {
  border-color: rgba(var(--color-third-800), 1);
}

.bg-third-contrast-800 {
  background-color: rgb(var(--color-third-contrast-800));
  color: rgba(var(--color-third-800), 1);
}

.text-third-contrast-800 {
  color: rgb(var(--color-third-contrast-800));
}

.border-third-contrast-800 {
  border-color: rgb(var(--color-third-contrast-800));
}

.bg-third-900 {
  background-color: rgba(var(--color-third-900), 1);
  color: rgb(var(--color-third-contrast-900));
}

.text-third-900 {
  color: rgba(var(--color-third-900), 1);
}

.border-third-900 {
  border-color: rgba(var(--color-third-900), 1);
}

.bg-third-contrast-900 {
  background-color: rgb(var(--color-third-contrast-900));
  color: rgba(var(--color-third-900), 1);
}

.text-third-contrast-900 {
  color: rgb(var(--color-third-contrast-900));
}

.border-third-contrast-900 {
  border-color: rgb(var(--color-third-contrast-900));
}

.bg-accent-100 {
  background-color: rgba(var(--color-accent-100), 1);
  color: rgb(var(--color-accent-contrast-100));
}

.text-accent-100 {
  color: rgba(var(--color-accent-100), 1);
}

.border-accent-100 {
  border-color: rgba(var(--color-accent-100), 1);
}

.bg-accent-contrast-100 {
  background-color: rgb(var(--color-accent-contrast-100));
  color: rgba(var(--color-accent-100), 1);
}

.text-accent-contrast-100 {
  color: rgb(var(--color-accent-contrast-100));
}

.border-accent-contrast-100 {
  border-color: rgb(var(--color-accent-contrast-100));
}

.bg-accent-200 {
  background-color: rgba(var(--color-accent-200), 1);
  color: rgb(var(--color-accent-contrast-200));
}

.text-accent-200 {
  color: rgba(var(--color-accent-200), 1);
}

.border-accent-200 {
  border-color: rgba(var(--color-accent-200), 1);
}

.bg-accent-contrast-200 {
  background-color: rgb(var(--color-accent-contrast-200));
  color: rgba(var(--color-accent-200), 1);
}

.text-accent-contrast-200 {
  color: rgb(var(--color-accent-contrast-200));
}

.border-accent-contrast-200 {
  border-color: rgb(var(--color-accent-contrast-200));
}

.bg-accent-300 {
  background-color: rgba(var(--color-accent-300), 1);
  color: rgb(var(--color-accent-contrast-300));
}

.text-accent-300 {
  color: rgba(var(--color-accent-300), 1);
}

.border-accent-300 {
  border-color: rgba(var(--color-accent-300), 1);
}

.bg-accent-contrast-300 {
  background-color: rgb(var(--color-accent-contrast-300));
  color: rgba(var(--color-accent-300), 1);
}

.text-accent-contrast-300 {
  color: rgb(var(--color-accent-contrast-300));
}

.border-accent-contrast-300 {
  border-color: rgb(var(--color-accent-contrast-300));
}

.bg-accent-400 {
  background-color: rgba(var(--color-accent-400), 1);
  color: rgb(var(--color-accent-contrast-400));
}

.text-accent-400 {
  color: rgba(var(--color-accent-400), 1);
}

.border-accent-400 {
  border-color: rgba(var(--color-accent-400), 1);
}

.bg-accent-contrast-400 {
  background-color: rgb(var(--color-accent-contrast-400));
  color: rgba(var(--color-accent-400), 1);
}

.text-accent-contrast-400 {
  color: rgb(var(--color-accent-contrast-400));
}

.border-accent-contrast-400 {
  border-color: rgb(var(--color-accent-contrast-400));
}

.bg-accent-500 {
  background-color: rgba(var(--color-accent-500), 1);
  color: rgb(var(--color-accent-contrast-500));
}

.text-accent-500 {
  color: rgba(var(--color-accent-500), 1);
}

.border-accent-500 {
  border-color: rgba(var(--color-accent-500), 1);
}

.bg-accent-contrast-500 {
  background-color: rgb(var(--color-accent-contrast-500));
  color: rgba(var(--color-accent-500), 1);
}

.text-accent-contrast-500 {
  color: rgb(var(--color-accent-contrast-500));
}

.border-accent-contrast-500 {
  border-color: rgb(var(--color-accent-contrast-500));
}

.bg-accent-600 {
  background-color: rgba(var(--color-accent-600), 1);
  color: rgb(var(--color-accent-contrast-600));
}

.text-accent-600 {
  color: rgba(var(--color-accent-600), 1);
}

.border-accent-600 {
  border-color: rgba(var(--color-accent-600), 1);
}

.bg-accent-contrast-600 {
  background-color: rgb(var(--color-accent-contrast-600));
  color: rgba(var(--color-accent-600), 1);
}

.text-accent-contrast-600 {
  color: rgb(var(--color-accent-contrast-600));
}

.border-accent-contrast-600 {
  border-color: rgb(var(--color-accent-contrast-600));
}

.bg-accent-700 {
  background-color: rgba(var(--color-accent-700), 1);
  color: rgb(var(--color-accent-contrast-700));
}

.text-accent-700 {
  color: rgba(var(--color-accent-700), 1);
}

.border-accent-700 {
  border-color: rgba(var(--color-accent-700), 1);
}

.bg-accent-contrast-700 {
  background-color: rgb(var(--color-accent-contrast-700));
  color: rgba(var(--color-accent-700), 1);
}

.text-accent-contrast-700 {
  color: rgb(var(--color-accent-contrast-700));
}

.border-accent-contrast-700 {
  border-color: rgb(var(--color-accent-contrast-700));
}

.bg-accent-800 {
  background-color: rgba(var(--color-accent-800), 1);
  color: rgb(var(--color-accent-contrast-800));
}

.text-accent-800 {
  color: rgba(var(--color-accent-800), 1);
}

.border-accent-800 {
  border-color: rgba(var(--color-accent-800), 1);
}

.bg-accent-contrast-800 {
  background-color: rgb(var(--color-accent-contrast-800));
  color: rgba(var(--color-accent-800), 1);
}

.text-accent-contrast-800 {
  color: rgb(var(--color-accent-contrast-800));
}

.border-accent-contrast-800 {
  border-color: rgb(var(--color-accent-contrast-800));
}

.bg-accent-900 {
  background-color: rgba(var(--color-accent-900), 1);
  color: rgb(var(--color-accent-contrast-900));
}

.text-accent-900 {
  color: rgba(var(--color-accent-900), 1);
}

.border-accent-900 {
  border-color: rgba(var(--color-accent-900), 1);
}

.bg-accent-contrast-900 {
  background-color: rgb(var(--color-accent-contrast-900));
  color: rgba(var(--color-accent-900), 1);
}

.text-accent-contrast-900 {
  color: rgb(var(--color-accent-contrast-900));
}

.border-accent-contrast-900 {
  border-color: rgb(var(--color-accent-contrast-900));
}

.bg-lgray-100 {
  background-color: rgba(var(--color-lgray-100), 1);
  color: rgb(var(--color-lgray-contrast-100));
}

.text-lgray-100 {
  color: rgba(var(--color-lgray-100), 1);
}

.border-lgray-100 {
  border-color: rgba(var(--color-lgray-100), 1);
}

.bg-lgray-contrast-100 {
  background-color: rgb(var(--color-lgray-contrast-100));
  color: rgba(var(--color-lgray-100), 1);
}

.text-lgray-contrast-100 {
  color: rgb(var(--color-lgray-contrast-100));
}

.border-lgray-contrast-100 {
  border-color: rgb(var(--color-lgray-contrast-100));
}

.bg-lgray-200 {
  background-color: rgba(var(--color-lgray-200), 1);
  color: rgb(var(--color-lgray-contrast-200));
}

.text-lgray-200 {
  color: rgba(var(--color-lgray-200), 1);
}

.border-lgray-200 {
  border-color: rgba(var(--color-lgray-200), 1);
}

.bg-lgray-contrast-200 {
  background-color: rgb(var(--color-lgray-contrast-200));
  color: rgba(var(--color-lgray-200), 1);
}

.text-lgray-contrast-200 {
  color: rgb(var(--color-lgray-contrast-200));
}

.border-lgray-contrast-200 {
  border-color: rgb(var(--color-lgray-contrast-200));
}

.bg-lgray-300 {
  background-color: rgba(var(--color-lgray-300), 1);
  color: rgb(var(--color-lgray-contrast-300));
}

.text-lgray-300 {
  color: rgba(var(--color-lgray-300), 1);
}

.border-lgray-300 {
  border-color: rgba(var(--color-lgray-300), 1);
}

.bg-lgray-contrast-300 {
  background-color: rgb(var(--color-lgray-contrast-300));
  color: rgba(var(--color-lgray-300), 1);
}

.text-lgray-contrast-300 {
  color: rgb(var(--color-lgray-contrast-300));
}

.border-lgray-contrast-300 {
  border-color: rgb(var(--color-lgray-contrast-300));
}

.bg-lgray-400 {
  background-color: rgba(var(--color-lgray-400), 1);
  color: rgb(var(--color-lgray-contrast-400));
}

.text-lgray-400 {
  color: rgba(var(--color-lgray-400), 1);
}

.border-lgray-400 {
  border-color: rgba(var(--color-lgray-400), 1);
}

.bg-lgray-contrast-400 {
  background-color: rgb(var(--color-lgray-contrast-400));
  color: rgba(var(--color-lgray-400), 1);
}

.text-lgray-contrast-400 {
  color: rgb(var(--color-lgray-contrast-400));
}

.border-lgray-contrast-400 {
  border-color: rgb(var(--color-lgray-contrast-400));
}

.bg-lgray-500 {
  background-color: rgba(var(--color-lgray-500), 1);
  color: rgb(var(--color-lgray-contrast-500));
}

.text-lgray-500 {
  color: rgba(var(--color-lgray-500), 1);
}

.border-lgray-500 {
  border-color: rgba(var(--color-lgray-500), 1);
}

.bg-lgray-contrast-500 {
  background-color: rgb(var(--color-lgray-contrast-500));
  color: rgba(var(--color-lgray-500), 1);
}

.text-lgray-contrast-500 {
  color: rgb(var(--color-lgray-contrast-500));
}

.border-lgray-contrast-500 {
  border-color: rgb(var(--color-lgray-contrast-500));
}

.bg-lgray-600 {
  background-color: rgba(var(--color-lgray-600), 1);
  color: rgb(var(--color-lgray-contrast-600));
}

.text-lgray-600 {
  color: rgba(var(--color-lgray-600), 1);
}

.border-lgray-600 {
  border-color: rgba(var(--color-lgray-600), 1);
}

.bg-lgray-contrast-600 {
  background-color: rgb(var(--color-lgray-contrast-600));
  color: rgba(var(--color-lgray-600), 1);
}

.text-lgray-contrast-600 {
  color: rgb(var(--color-lgray-contrast-600));
}

.border-lgray-contrast-600 {
  border-color: rgb(var(--color-lgray-contrast-600));
}

.bg-lgray-700 {
  background-color: rgba(var(--color-lgray-700), 1);
  color: rgb(var(--color-lgray-contrast-700));
}

.text-lgray-700 {
  color: rgba(var(--color-lgray-700), 1);
}

.border-lgray-700 {
  border-color: rgba(var(--color-lgray-700), 1);
}

.bg-lgray-contrast-700 {
  background-color: rgb(var(--color-lgray-contrast-700));
  color: rgba(var(--color-lgray-700), 1);
}

.text-lgray-contrast-700 {
  color: rgb(var(--color-lgray-contrast-700));
}

.border-lgray-contrast-700 {
  border-color: rgb(var(--color-lgray-contrast-700));
}

.bg-lgray-800 {
  background-color: rgba(var(--color-lgray-800), 1);
  color: rgb(var(--color-lgray-contrast-800));
}

.text-lgray-800 {
  color: rgba(var(--color-lgray-800), 1);
}

.border-lgray-800 {
  border-color: rgba(var(--color-lgray-800), 1);
}

.bg-lgray-contrast-800 {
  background-color: rgb(var(--color-lgray-contrast-800));
  color: rgba(var(--color-lgray-800), 1);
}

.text-lgray-contrast-800 {
  color: rgb(var(--color-lgray-contrast-800));
}

.border-lgray-contrast-800 {
  border-color: rgb(var(--color-lgray-contrast-800));
}

.bg-lgray-900 {
  background-color: rgba(var(--color-lgray-900), 1);
  color: rgb(var(--color-lgray-contrast-900));
}

.text-lgray-900 {
  color: rgba(var(--color-lgray-900), 1);
}

.border-lgray-900 {
  border-color: rgba(var(--color-lgray-900), 1);
}

.bg-lgray-contrast-900 {
  background-color: rgb(var(--color-lgray-contrast-900));
  color: rgba(var(--color-lgray-900), 1);
}

.text-lgray-contrast-900 {
  color: rgb(var(--color-lgray-contrast-900));
}

.border-lgray-contrast-900 {
  border-color: rgb(var(--color-lgray-contrast-900));
}

.bg-success-100 {
  background-color: rgba(var(--color-success-100), 1);
  color: rgb(var(--color-success-contrast-100));
}

.text-success-100 {
  color: rgba(var(--color-success-100), 1);
}

.border-success-100 {
  border-color: rgba(var(--color-success-100), 1);
}

.bg-success-contrast-100 {
  background-color: rgb(var(--color-success-contrast-100));
  color: rgba(var(--color-success-100), 1);
}

.text-success-contrast-100 {
  color: rgb(var(--color-success-contrast-100));
}

.border-success-contrast-100 {
  border-color: rgb(var(--color-success-contrast-100));
}

.bg-success-200 {
  background-color: rgba(var(--color-success-200), 1);
  color: rgb(var(--color-success-contrast-200));
}

.text-success-200 {
  color: rgba(var(--color-success-200), 1);
}

.border-success-200 {
  border-color: rgba(var(--color-success-200), 1);
}

.bg-success-contrast-200 {
  background-color: rgb(var(--color-success-contrast-200));
  color: rgba(var(--color-success-200), 1);
}

.text-success-contrast-200 {
  color: rgb(var(--color-success-contrast-200));
}

.border-success-contrast-200 {
  border-color: rgb(var(--color-success-contrast-200));
}

.bg-success-300 {
  background-color: rgba(var(--color-success-300), 1);
  color: rgb(var(--color-success-contrast-300));
}

.text-success-300 {
  color: rgba(var(--color-success-300), 1);
}

.border-success-300 {
  border-color: rgba(var(--color-success-300), 1);
}

.bg-success-contrast-300 {
  background-color: rgb(var(--color-success-contrast-300));
  color: rgba(var(--color-success-300), 1);
}

.text-success-contrast-300 {
  color: rgb(var(--color-success-contrast-300));
}

.border-success-contrast-300 {
  border-color: rgb(var(--color-success-contrast-300));
}

.bg-success-400 {
  background-color: rgba(var(--color-success-400), 1);
  color: rgb(var(--color-success-contrast-400));
}

.text-success-400 {
  color: rgba(var(--color-success-400), 1);
}

.border-success-400 {
  border-color: rgba(var(--color-success-400), 1);
}

.bg-success-contrast-400 {
  background-color: rgb(var(--color-success-contrast-400));
  color: rgba(var(--color-success-400), 1);
}

.text-success-contrast-400 {
  color: rgb(var(--color-success-contrast-400));
}

.border-success-contrast-400 {
  border-color: rgb(var(--color-success-contrast-400));
}

.bg-success-500 {
  background-color: rgba(var(--color-success-500), 1);
  color: rgb(var(--color-success-contrast-500));
}

.text-success-500 {
  color: rgba(var(--color-success-500), 1);
}

.border-success-500 {
  border-color: rgba(var(--color-success-500), 1);
}

.bg-success-contrast-500 {
  background-color: rgb(var(--color-success-contrast-500));
  color: rgba(var(--color-success-500), 1);
}

.text-success-contrast-500 {
  color: rgb(var(--color-success-contrast-500));
}

.border-success-contrast-500 {
  border-color: rgb(var(--color-success-contrast-500));
}

.bg-success-600 {
  background-color: rgba(var(--color-success-600), 1);
  color: rgb(var(--color-success-contrast-600));
}

.text-success-600 {
  color: rgba(var(--color-success-600), 1);
}

.border-success-600 {
  border-color: rgba(var(--color-success-600), 1);
}

.bg-success-contrast-600 {
  background-color: rgb(var(--color-success-contrast-600));
  color: rgba(var(--color-success-600), 1);
}

.text-success-contrast-600 {
  color: rgb(var(--color-success-contrast-600));
}

.border-success-contrast-600 {
  border-color: rgb(var(--color-success-contrast-600));
}

.bg-success-700 {
  background-color: rgba(var(--color-success-700), 1);
  color: rgb(var(--color-success-contrast-700));
}

.text-success-700 {
  color: rgba(var(--color-success-700), 1);
}

.border-success-700 {
  border-color: rgba(var(--color-success-700), 1);
}

.bg-success-contrast-700 {
  background-color: rgb(var(--color-success-contrast-700));
  color: rgba(var(--color-success-700), 1);
}

.text-success-contrast-700 {
  color: rgb(var(--color-success-contrast-700));
}

.border-success-contrast-700 {
  border-color: rgb(var(--color-success-contrast-700));
}

.bg-success-800 {
  background-color: rgba(var(--color-success-800), 1);
  color: rgb(var(--color-success-contrast-800));
}

.text-success-800 {
  color: rgba(var(--color-success-800), 1);
}

.border-success-800 {
  border-color: rgba(var(--color-success-800), 1);
}

.bg-success-contrast-800 {
  background-color: rgb(var(--color-success-contrast-800));
  color: rgba(var(--color-success-800), 1);
}

.text-success-contrast-800 {
  color: rgb(var(--color-success-contrast-800));
}

.border-success-contrast-800 {
  border-color: rgb(var(--color-success-contrast-800));
}

.bg-success-900 {
  background-color: rgba(var(--color-success-900), 1);
  color: rgb(var(--color-success-contrast-900));
}

.text-success-900 {
  color: rgba(var(--color-success-900), 1);
}

.border-success-900 {
  border-color: rgba(var(--color-success-900), 1);
}

.bg-success-contrast-900 {
  background-color: rgb(var(--color-success-contrast-900));
  color: rgba(var(--color-success-900), 1);
}

.text-success-contrast-900 {
  color: rgb(var(--color-success-contrast-900));
}

.border-success-contrast-900 {
  border-color: rgb(var(--color-success-contrast-900));
}

.bg-warning-100 {
  background-color: rgba(var(--color-warning-100), 1);
  color: rgb(var(--color-warning-contrast-100));
}

.text-warning-100 {
  color: rgba(var(--color-warning-100), 1);
}

.border-warning-100 {
  border-color: rgba(var(--color-warning-100), 1);
}

.bg-warning-contrast-100 {
  background-color: rgb(var(--color-warning-contrast-100));
  color: rgba(var(--color-warning-100), 1);
}

.text-warning-contrast-100 {
  color: rgb(var(--color-warning-contrast-100));
}

.border-warning-contrast-100 {
  border-color: rgb(var(--color-warning-contrast-100));
}

.bg-warning-200 {
  background-color: rgba(var(--color-warning-200), 1);
  color: rgb(var(--color-warning-contrast-200));
}

.text-warning-200 {
  color: rgba(var(--color-warning-200), 1);
}

.border-warning-200 {
  border-color: rgba(var(--color-warning-200), 1);
}

.bg-warning-contrast-200 {
  background-color: rgb(var(--color-warning-contrast-200));
  color: rgba(var(--color-warning-200), 1);
}

.text-warning-contrast-200 {
  color: rgb(var(--color-warning-contrast-200));
}

.border-warning-contrast-200 {
  border-color: rgb(var(--color-warning-contrast-200));
}

.bg-warning-300 {
  background-color: rgba(var(--color-warning-300), 1);
  color: rgb(var(--color-warning-contrast-300));
}

.text-warning-300 {
  color: rgba(var(--color-warning-300), 1);
}

.border-warning-300 {
  border-color: rgba(var(--color-warning-300), 1);
}

.bg-warning-contrast-300 {
  background-color: rgb(var(--color-warning-contrast-300));
  color: rgba(var(--color-warning-300), 1);
}

.text-warning-contrast-300 {
  color: rgb(var(--color-warning-contrast-300));
}

.border-warning-contrast-300 {
  border-color: rgb(var(--color-warning-contrast-300));
}

.bg-warning-400 {
  background-color: rgba(var(--color-warning-400), 1);
  color: rgb(var(--color-warning-contrast-400));
}

.text-warning-400 {
  color: rgba(var(--color-warning-400), 1);
}

.border-warning-400 {
  border-color: rgba(var(--color-warning-400), 1);
}

.bg-warning-contrast-400 {
  background-color: rgb(var(--color-warning-contrast-400));
  color: rgba(var(--color-warning-400), 1);
}

.text-warning-contrast-400 {
  color: rgb(var(--color-warning-contrast-400));
}

.border-warning-contrast-400 {
  border-color: rgb(var(--color-warning-contrast-400));
}

.bg-warning-500 {
  background-color: rgba(var(--color-warning-500), 1);
  color: rgb(var(--color-warning-contrast-500));
}

.text-warning-500 {
  color: rgba(var(--color-warning-500), 1);
}

.border-warning-500 {
  border-color: rgba(var(--color-warning-500), 1);
}

.bg-warning-contrast-500 {
  background-color: rgb(var(--color-warning-contrast-500));
  color: rgba(var(--color-warning-500), 1);
}

.text-warning-contrast-500 {
  color: rgb(var(--color-warning-contrast-500));
}

.border-warning-contrast-500 {
  border-color: rgb(var(--color-warning-contrast-500));
}

.bg-warning-600 {
  background-color: rgba(var(--color-warning-600), 1);
  color: rgb(var(--color-warning-contrast-600));
}

.text-warning-600 {
  color: rgba(var(--color-warning-600), 1);
}

.border-warning-600 {
  border-color: rgba(var(--color-warning-600), 1);
}

.bg-warning-contrast-600 {
  background-color: rgb(var(--color-warning-contrast-600));
  color: rgba(var(--color-warning-600), 1);
}

.text-warning-contrast-600 {
  color: rgb(var(--color-warning-contrast-600));
}

.border-warning-contrast-600 {
  border-color: rgb(var(--color-warning-contrast-600));
}

.bg-warning-700 {
  background-color: rgba(var(--color-warning-700), 1);
  color: rgb(var(--color-warning-contrast-700));
}

.text-warning-700 {
  color: rgba(var(--color-warning-700), 1);
}

.border-warning-700 {
  border-color: rgba(var(--color-warning-700), 1);
}

.bg-warning-contrast-700 {
  background-color: rgb(var(--color-warning-contrast-700));
  color: rgba(var(--color-warning-700), 1);
}

.text-warning-contrast-700 {
  color: rgb(var(--color-warning-contrast-700));
}

.border-warning-contrast-700 {
  border-color: rgb(var(--color-warning-contrast-700));
}

.bg-warning-800 {
  background-color: rgba(var(--color-warning-800), 1);
  color: rgb(var(--color-warning-contrast-800));
}

.text-warning-800 {
  color: rgba(var(--color-warning-800), 1);
}

.border-warning-800 {
  border-color: rgba(var(--color-warning-800), 1);
}

.bg-warning-contrast-800 {
  background-color: rgb(var(--color-warning-contrast-800));
  color: rgba(var(--color-warning-800), 1);
}

.text-warning-contrast-800 {
  color: rgb(var(--color-warning-contrast-800));
}

.border-warning-contrast-800 {
  border-color: rgb(var(--color-warning-contrast-800));
}

.bg-warning-900 {
  background-color: rgba(var(--color-warning-900), 1);
  color: rgb(var(--color-warning-contrast-900));
}

.text-warning-900 {
  color: rgba(var(--color-warning-900), 1);
}

.border-warning-900 {
  border-color: rgba(var(--color-warning-900), 1);
}

.bg-warning-contrast-900 {
  background-color: rgb(var(--color-warning-contrast-900));
  color: rgba(var(--color-warning-900), 1);
}

.text-warning-contrast-900 {
  color: rgb(var(--color-warning-contrast-900));
}

.border-warning-contrast-900 {
  border-color: rgb(var(--color-warning-contrast-900));
}

.bg-danger-100 {
  background-color: rgba(var(--color-danger-100), 1);
  color: rgb(var(--color-danger-contrast-100));
}

.text-danger-100 {
  color: rgba(var(--color-danger-100), 1);
}

.border-danger-100 {
  border-color: rgba(var(--color-danger-100), 1);
}

.bg-danger-contrast-100 {
  background-color: rgb(var(--color-danger-contrast-100));
  color: rgba(var(--color-danger-100), 1);
}

.text-danger-contrast-100 {
  color: rgb(var(--color-danger-contrast-100));
}

.border-danger-contrast-100 {
  border-color: rgb(var(--color-danger-contrast-100));
}

.bg-danger-200 {
  background-color: rgba(var(--color-danger-200), 1);
  color: rgb(var(--color-danger-contrast-200));
}

.text-danger-200 {
  color: rgba(var(--color-danger-200), 1);
}

.border-danger-200 {
  border-color: rgba(var(--color-danger-200), 1);
}

.bg-danger-contrast-200 {
  background-color: rgb(var(--color-danger-contrast-200));
  color: rgba(var(--color-danger-200), 1);
}

.text-danger-contrast-200 {
  color: rgb(var(--color-danger-contrast-200));
}

.border-danger-contrast-200 {
  border-color: rgb(var(--color-danger-contrast-200));
}

.bg-danger-300 {
  background-color: rgba(var(--color-danger-300), 1);
  color: rgb(var(--color-danger-contrast-300));
}

.text-danger-300 {
  color: rgba(var(--color-danger-300), 1);
}

.border-danger-300 {
  border-color: rgba(var(--color-danger-300), 1);
}

.bg-danger-contrast-300 {
  background-color: rgb(var(--color-danger-contrast-300));
  color: rgba(var(--color-danger-300), 1);
}

.text-danger-contrast-300 {
  color: rgb(var(--color-danger-contrast-300));
}

.border-danger-contrast-300 {
  border-color: rgb(var(--color-danger-contrast-300));
}

.bg-danger-400 {
  background-color: rgba(var(--color-danger-400), 1);
  color: rgb(var(--color-danger-contrast-400));
}

.text-danger-400 {
  color: rgba(var(--color-danger-400), 1);
}

.border-danger-400 {
  border-color: rgba(var(--color-danger-400), 1);
}

.bg-danger-contrast-400 {
  background-color: rgb(var(--color-danger-contrast-400));
  color: rgba(var(--color-danger-400), 1);
}

.text-danger-contrast-400 {
  color: rgb(var(--color-danger-contrast-400));
}

.border-danger-contrast-400 {
  border-color: rgb(var(--color-danger-contrast-400));
}

.bg-danger-500 {
  background-color: rgba(var(--color-danger-500), 1);
  color: rgb(var(--color-danger-contrast-500));
}

.text-danger-500 {
  color: rgba(var(--color-danger-500), 1);
}

.border-danger-500 {
  border-color: rgba(var(--color-danger-500), 1);
}

.bg-danger-contrast-500 {
  background-color: rgb(var(--color-danger-contrast-500));
  color: rgba(var(--color-danger-500), 1);
}

.text-danger-contrast-500 {
  color: rgb(var(--color-danger-contrast-500));
}

.border-danger-contrast-500 {
  border-color: rgb(var(--color-danger-contrast-500));
}

.bg-danger-600 {
  background-color: rgba(var(--color-danger-600), 1);
  color: rgb(var(--color-danger-contrast-600));
}

.text-danger-600 {
  color: rgba(var(--color-danger-600), 1);
}

.border-danger-600 {
  border-color: rgba(var(--color-danger-600), 1);
}

.bg-danger-contrast-600 {
  background-color: rgb(var(--color-danger-contrast-600));
  color: rgba(var(--color-danger-600), 1);
}

.text-danger-contrast-600 {
  color: rgb(var(--color-danger-contrast-600));
}

.border-danger-contrast-600 {
  border-color: rgb(var(--color-danger-contrast-600));
}

.bg-danger-700 {
  background-color: rgba(var(--color-danger-700), 1);
  color: rgb(var(--color-danger-contrast-700));
}

.text-danger-700 {
  color: rgba(var(--color-danger-700), 1);
}

.border-danger-700 {
  border-color: rgba(var(--color-danger-700), 1);
}

.bg-danger-contrast-700 {
  background-color: rgb(var(--color-danger-contrast-700));
  color: rgba(var(--color-danger-700), 1);
}

.text-danger-contrast-700 {
  color: rgb(var(--color-danger-contrast-700));
}

.border-danger-contrast-700 {
  border-color: rgb(var(--color-danger-contrast-700));
}

.bg-danger-800 {
  background-color: rgba(var(--color-danger-800), 1);
  color: rgb(var(--color-danger-contrast-800));
}

.text-danger-800 {
  color: rgba(var(--color-danger-800), 1);
}

.border-danger-800 {
  border-color: rgba(var(--color-danger-800), 1);
}

.bg-danger-contrast-800 {
  background-color: rgb(var(--color-danger-contrast-800));
  color: rgba(var(--color-danger-800), 1);
}

.text-danger-contrast-800 {
  color: rgb(var(--color-danger-contrast-800));
}

.border-danger-contrast-800 {
  border-color: rgb(var(--color-danger-contrast-800));
}

.bg-danger-900 {
  background-color: rgba(var(--color-danger-900), 1);
  color: rgb(var(--color-danger-contrast-900));
}

.text-danger-900 {
  color: rgba(var(--color-danger-900), 1);
}

.border-danger-900 {
  border-color: rgba(var(--color-danger-900), 1);
}

.bg-danger-contrast-900 {
  background-color: rgb(var(--color-danger-contrast-900));
  color: rgba(var(--color-danger-900), 1);
}

.text-danger-contrast-900 {
  color: rgb(var(--color-danger-contrast-900));
}

.border-danger-contrast-900 {
  border-color: rgb(var(--color-danger-contrast-900));
}

.m-1-1 {
  margin: calc(var(--spacer) / 1);
}

.mt-1-1 {
  margin-top: calc(var(--spacer) / 1);
}

.mb-1-1 {
  margin-bottom: calc(var(--spacer) / 1);
}

.ml-1-1 {
  margin-left: calc(var(--spacer) / 1);
}

.mr-1-1 {
  margin-right: calc(var(--spacer) / 1);
}

.mx-1-1 {
  margin-left: calc(var(--spacer) / 1);
  margin-right: calc(var(--spacer) / 1);
}

.my-1-1 {
  margin-top: calc(var(--spacer) / 1);
  margin-bottom: calc(var(--spacer) / 1);
}

.p-1-1 {
  padding: calc(var(--spacer) / 1);
}

.pt-1-1 {
  padding-top: calc(var(--spacer) / 1);
}

.pb-1-1 {
  padding-bottom: calc(var(--spacer) / 1);
}

.pl-1-1 {
  padding-left: calc(var(--spacer) / 1);
}

.pr-1-1 {
  padding-right: calc(var(--spacer) / 1);
}

.px-1-1 {
  padding-left: calc(var(--spacer) / 1);
  padding-right: calc(var(--spacer) / 1);
}

.py-1-1 {
  padding-top: calc(var(--spacer) / 1);
  padding-bottom: calc(var(--spacer) / 1);
}

.h-1-1 {
  height: calc(var(--spacer) / 1);
}

.w-1-1 {
  width: calc(var(--spacer) / 1);
}

.m-1-2 {
  margin: calc(var(--spacer) / 2);
}

.mt-1-2 {
  margin-top: calc(var(--spacer) / 2);
}

.mb-1-2 {
  margin-bottom: calc(var(--spacer) / 2);
}

.ml-1-2 {
  margin-left: calc(var(--spacer) / 2);
}

.mr-1-2 {
  margin-right: calc(var(--spacer) / 2);
}

.mx-1-2 {
  margin-left: calc(var(--spacer) / 2);
  margin-right: calc(var(--spacer) / 2);
}

.my-1-2 {
  margin-top: calc(var(--spacer) / 2);
  margin-bottom: calc(var(--spacer) / 2);
}

.p-1-2 {
  padding: calc(var(--spacer) / 2);
}

.pt-1-2 {
  padding-top: calc(var(--spacer) / 2);
}

.pb-1-2 {
  padding-bottom: calc(var(--spacer) / 2);
}

.pl-1-2 {
  padding-left: calc(var(--spacer) / 2);
}

.pr-1-2 {
  padding-right: calc(var(--spacer) / 2);
}

.px-1-2 {
  padding-left: calc(var(--spacer) / 2);
  padding-right: calc(var(--spacer) / 2);
}

.py-1-2 {
  padding-top: calc(var(--spacer) / 2);
  padding-bottom: calc(var(--spacer) / 2);
}

.h-1-2 {
  height: calc(var(--spacer) / 2);
}

.w-1-2 {
  width: calc(var(--spacer) / 2);
}

.m-1-3 {
  margin: calc(var(--spacer) / 3);
}

.mt-1-3 {
  margin-top: calc(var(--spacer) / 3);
}

.mb-1-3 {
  margin-bottom: calc(var(--spacer) / 3);
}

.ml-1-3 {
  margin-left: calc(var(--spacer) / 3);
}

.mr-1-3 {
  margin-right: calc(var(--spacer) / 3);
}

.mx-1-3 {
  margin-left: calc(var(--spacer) / 3);
  margin-right: calc(var(--spacer) / 3);
}

.my-1-3 {
  margin-top: calc(var(--spacer) / 3);
  margin-bottom: calc(var(--spacer) / 3);
}

.p-1-3 {
  padding: calc(var(--spacer) / 3);
}

.pt-1-3 {
  padding-top: calc(var(--spacer) / 3);
}

.pb-1-3 {
  padding-bottom: calc(var(--spacer) / 3);
}

.pl-1-3 {
  padding-left: calc(var(--spacer) / 3);
}

.pr-1-3 {
  padding-right: calc(var(--spacer) / 3);
}

.px-1-3 {
  padding-left: calc(var(--spacer) / 3);
  padding-right: calc(var(--spacer) / 3);
}

.py-1-3 {
  padding-top: calc(var(--spacer) / 3);
  padding-bottom: calc(var(--spacer) / 3);
}

.h-1-3 {
  height: calc(var(--spacer) / 3);
}

.w-1-3 {
  width: calc(var(--spacer) / 3);
}

.m-1-4 {
  margin: calc(var(--spacer) / 4);
}

.mt-1-4 {
  margin-top: calc(var(--spacer) / 4);
}

.mb-1-4 {
  margin-bottom: calc(var(--spacer) / 4);
}

.ml-1-4 {
  margin-left: calc(var(--spacer) / 4);
}

.mr-1-4 {
  margin-right: calc(var(--spacer) / 4);
}

.mx-1-4 {
  margin-left: calc(var(--spacer) / 4);
  margin-right: calc(var(--spacer) / 4);
}

.my-1-4 {
  margin-top: calc(var(--spacer) / 4);
  margin-bottom: calc(var(--spacer) / 4);
}

.p-1-4 {
  padding: calc(var(--spacer) / 4);
}

.pt-1-4 {
  padding-top: calc(var(--spacer) / 4);
}

.pb-1-4 {
  padding-bottom: calc(var(--spacer) / 4);
}

.pl-1-4 {
  padding-left: calc(var(--spacer) / 4);
}

.pr-1-4 {
  padding-right: calc(var(--spacer) / 4);
}

.px-1-4 {
  padding-left: calc(var(--spacer) / 4);
  padding-right: calc(var(--spacer) / 4);
}

.py-1-4 {
  padding-top: calc(var(--spacer) / 4);
  padding-bottom: calc(var(--spacer) / 4);
}

.h-1-4 {
  height: calc(var(--spacer) / 4);
}

.w-1-4 {
  width: calc(var(--spacer) / 4);
}

.m-1-5 {
  margin: calc(var(--spacer) / 5);
}

.mt-1-5 {
  margin-top: calc(var(--spacer) / 5);
}

.mb-1-5 {
  margin-bottom: calc(var(--spacer) / 5);
}

.ml-1-5 {
  margin-left: calc(var(--spacer) / 5);
}

.mr-1-5 {
  margin-right: calc(var(--spacer) / 5);
}

.mx-1-5 {
  margin-left: calc(var(--spacer) / 5);
  margin-right: calc(var(--spacer) / 5);
}

.my-1-5 {
  margin-top: calc(var(--spacer) / 5);
  margin-bottom: calc(var(--spacer) / 5);
}

.p-1-5 {
  padding: calc(var(--spacer) / 5);
}

.pt-1-5 {
  padding-top: calc(var(--spacer) / 5);
}

.pb-1-5 {
  padding-bottom: calc(var(--spacer) / 5);
}

.pl-1-5 {
  padding-left: calc(var(--spacer) / 5);
}

.pr-1-5 {
  padding-right: calc(var(--spacer) / 5);
}

.px-1-5 {
  padding-left: calc(var(--spacer) / 5);
  padding-right: calc(var(--spacer) / 5);
}

.py-1-5 {
  padding-top: calc(var(--spacer) / 5);
  padding-bottom: calc(var(--spacer) / 5);
}

.h-1-5 {
  height: calc(var(--spacer) / 5);
}

.w-1-5 {
  width: calc(var(--spacer) / 5);
}

.m-1-6 {
  margin: calc(var(--spacer) / 6);
}

.mt-1-6 {
  margin-top: calc(var(--spacer) / 6);
}

.mb-1-6 {
  margin-bottom: calc(var(--spacer) / 6);
}

.ml-1-6 {
  margin-left: calc(var(--spacer) / 6);
}

.mr-1-6 {
  margin-right: calc(var(--spacer) / 6);
}

.mx-1-6 {
  margin-left: calc(var(--spacer) / 6);
  margin-right: calc(var(--spacer) / 6);
}

.my-1-6 {
  margin-top: calc(var(--spacer) / 6);
  margin-bottom: calc(var(--spacer) / 6);
}

.p-1-6 {
  padding: calc(var(--spacer) / 6);
}

.pt-1-6 {
  padding-top: calc(var(--spacer) / 6);
}

.pb-1-6 {
  padding-bottom: calc(var(--spacer) / 6);
}

.pl-1-6 {
  padding-left: calc(var(--spacer) / 6);
}

.pr-1-6 {
  padding-right: calc(var(--spacer) / 6);
}

.px-1-6 {
  padding-left: calc(var(--spacer) / 6);
  padding-right: calc(var(--spacer) / 6);
}

.py-1-6 {
  padding-top: calc(var(--spacer) / 6);
  padding-bottom: calc(var(--spacer) / 6);
}

.h-1-6 {
  height: calc(var(--spacer) / 6);
}

.w-1-6 {
  width: calc(var(--spacer) / 6);
}

.m-1-7 {
  margin: calc(var(--spacer) / 7);
}

.mt-1-7 {
  margin-top: calc(var(--spacer) / 7);
}

.mb-1-7 {
  margin-bottom: calc(var(--spacer) / 7);
}

.ml-1-7 {
  margin-left: calc(var(--spacer) / 7);
}

.mr-1-7 {
  margin-right: calc(var(--spacer) / 7);
}

.mx-1-7 {
  margin-left: calc(var(--spacer) / 7);
  margin-right: calc(var(--spacer) / 7);
}

.my-1-7 {
  margin-top: calc(var(--spacer) / 7);
  margin-bottom: calc(var(--spacer) / 7);
}

.p-1-7 {
  padding: calc(var(--spacer) / 7);
}

.pt-1-7 {
  padding-top: calc(var(--spacer) / 7);
}

.pb-1-7 {
  padding-bottom: calc(var(--spacer) / 7);
}

.pl-1-7 {
  padding-left: calc(var(--spacer) / 7);
}

.pr-1-7 {
  padding-right: calc(var(--spacer) / 7);
}

.px-1-7 {
  padding-left: calc(var(--spacer) / 7);
  padding-right: calc(var(--spacer) / 7);
}

.py-1-7 {
  padding-top: calc(var(--spacer) / 7);
  padding-bottom: calc(var(--spacer) / 7);
}

.h-1-7 {
  height: calc(var(--spacer) / 7);
}

.w-1-7 {
  width: calc(var(--spacer) / 7);
}

.m-2-1 {
  margin: calc(var(--spacer) * 2);
}

.mt-2-1 {
  margin-top: calc(var(--spacer) * 2);
}

.mb-2-1 {
  margin-bottom: calc(var(--spacer) * 2);
}

.ml-2-1 {
  margin-left: calc(var(--spacer) * 2);
}

.mr-2-1 {
  margin-right: calc(var(--spacer) * 2);
}

.mx-2-1 {
  margin-left: calc(var(--spacer) * 2);
  margin-right: calc(var(--spacer) * 2);
}

.my-2-1 {
  margin-top: calc(var(--spacer) * 2);
  margin-bottom: calc(var(--spacer) * 2);
}

.p-2-1 {
  padding: calc(var(--spacer) * 2);
}

.pt-2-1 {
  padding-top: calc(var(--spacer) * 2);
}

.pb-2-1 {
  padding-bottom: calc(var(--spacer) * 2);
}

.pl-2-1 {
  padding-left: calc(var(--spacer) * 2);
}

.pr-2-1 {
  padding-right: calc(var(--spacer) * 2);
}

.px-2-1 {
  padding-left: calc(var(--spacer) * 2);
  padding-right: calc(var(--spacer) * 2);
}

.py-2-1 {
  padding-top: calc(var(--spacer) * 2);
  padding-bottom: calc(var(--spacer) * 2);
}

.h-2-1 {
  height: calc(var(--spacer) * 2);
}

.w-2-1 {
  width: calc(var(--spacer) * 2);
}

.m-3-1 {
  margin: calc(var(--spacer) * 3);
}

.mt-3-1 {
  margin-top: calc(var(--spacer) * 3);
}

.mb-3-1 {
  margin-bottom: calc(var(--spacer) * 3);
}

.ml-3-1 {
  margin-left: calc(var(--spacer) * 3);
}

.mr-3-1 {
  margin-right: calc(var(--spacer) * 3);
}

.mx-3-1 {
  margin-left: calc(var(--spacer) * 3);
  margin-right: calc(var(--spacer) * 3);
}

.my-3-1 {
  margin-top: calc(var(--spacer) * 3);
  margin-bottom: calc(var(--spacer) * 3);
}

.p-3-1 {
  padding: calc(var(--spacer) * 3);
}

.pt-3-1 {
  padding-top: calc(var(--spacer) * 3);
}

.pb-3-1 {
  padding-bottom: calc(var(--spacer) * 3);
}

.pl-3-1 {
  padding-left: calc(var(--spacer) * 3);
}

.pr-3-1 {
  padding-right: calc(var(--spacer) * 3);
}

.px-3-1 {
  padding-left: calc(var(--spacer) * 3);
  padding-right: calc(var(--spacer) * 3);
}

.py-3-1 {
  padding-top: calc(var(--spacer) * 3);
  padding-bottom: calc(var(--spacer) * 3);
}

.h-3-1 {
  height: calc(var(--spacer) * 3);
}

.w-3-1 {
  width: calc(var(--spacer) * 3);
}

.m-4-1 {
  margin: calc(var(--spacer) * 4);
}

.mt-4-1 {
  margin-top: calc(var(--spacer) * 4);
}

.mb-4-1 {
  margin-bottom: calc(var(--spacer) * 4);
}

.ml-4-1 {
  margin-left: calc(var(--spacer) * 4);
}

.mr-4-1 {
  margin-right: calc(var(--spacer) * 4);
}

.mx-4-1 {
  margin-left: calc(var(--spacer) * 4);
  margin-right: calc(var(--spacer) * 4);
}

.my-4-1 {
  margin-top: calc(var(--spacer) * 4);
  margin-bottom: calc(var(--spacer) * 4);
}

.p-4-1 {
  padding: calc(var(--spacer) * 4);
}

.pt-4-1 {
  padding-top: calc(var(--spacer) * 4);
}

.pb-4-1 {
  padding-bottom: calc(var(--spacer) * 4);
}

.pl-4-1 {
  padding-left: calc(var(--spacer) * 4);
}

.pr-4-1 {
  padding-right: calc(var(--spacer) * 4);
}

.px-4-1 {
  padding-left: calc(var(--spacer) * 4);
  padding-right: calc(var(--spacer) * 4);
}

.py-4-1 {
  padding-top: calc(var(--spacer) * 4);
  padding-bottom: calc(var(--spacer) * 4);
}

.h-4-1 {
  height: calc(var(--spacer) * 4);
}

.w-4-1 {
  width: calc(var(--spacer) * 4);
}

.m-0 {
  margin: 0;
}

.mt-0 {
  margin-top: 0;
}

.mb-0 {
  margin-bottom: 0;
}

.ml-0 {
  margin-left: 0;
}

.mr-0 {
  margin-right: 0;
}

.mx-0 {
  margin-left: 0;
  margin-right: 0;
}

.my-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.p-0 {
  padding: 0;
}

.pt-0 {
  padding-top: 0;
}

.pb-0 {
  padding-bottom: 0;
}

.pl-0 {
  padding-left: 0;
}

.pr-0 {
  padding-right: 0;
}

.px-0 {
  padding-left: 0;
  padding-right: 0;
}

.py-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.h-0 {
  height: 0;
}

.w-0 {
  width: 0;
}

.grid__gutter--3-1 {
  margin-left: calc(var(--gutter) * -3);
  margin-right: calc(var(--gutter) * -3);
}
.grid__gutter--3-1 > * {
  padding-left: calc(var(--gutter) * 3);
  padding-right: calc(var(--gutter) * 3);
}

.grid__gutter--2-1 {
  margin-left: calc(var(--gutter) * -2);
  margin-right: calc(var(--gutter) * -2);
}
.grid__gutter--2-1 > * {
  padding-left: calc(var(--gutter) * 2);
  padding-right: calc(var(--gutter) * 2);
}

.grid__gutter {
  margin-left: calc(var(--gutter) * -1);
  margin-right: calc(var(--gutter) * -1);
}
.grid__gutter > * {
  padding-left: calc(var(--gutter) * 1);
  padding-right: calc(var(--gutter) * 1);
}

.grid__gutter--1-2 {
  margin-left: calc(var(--gutter) * -0.5);
  margin-right: calc(var(--gutter) * -0.5);
}
.grid__gutter--1-2 > * {
  padding-left: calc(var(--gutter) * 0.5);
  padding-right: calc(var(--gutter) * 0.5);
}

.grid__gutter--1-3 {
  margin-left: calc(var(--gutter) * -0.333);
  margin-right: calc(var(--gutter) * -0.333);
}
.grid__gutter--1-3 > * {
  padding-left: calc(var(--gutter) * 0.333);
  padding-right: calc(var(--gutter) * 0.333);
}

.grid__gutter--1-4 {
  margin-left: calc(var(--gutter) * -0.25);
  margin-right: calc(var(--gutter) * -0.25);
}
.grid__gutter--1-4 > * {
  padding-left: calc(var(--gutter) * 0.25);
  padding-right: calc(var(--gutter) * 0.25);
}

.row__row--12 {
  min-height: calc(var(--vh) * 100 / 12 * 12);
}

.row__row--11 {
  min-height: calc(var(--vh) * 100 / 12 * 11);
}

.row__row--10 {
  min-height: calc(var(--vh) * 100 / 12 * 10);
}

.row__row--9 {
  min-height: calc(var(--vh) * 100 / 12 * 9);
}

.row__row--8 {
  min-height: calc(var(--vh) * 100 / 12 * 8);
}

.row__row--7 {
  min-height: calc(var(--vh) * 100 / 12 * 7);
}

.row__row--6 {
  min-height: calc(var(--vh) * 100 / 12 * 6);
}

.row__row--5 {
  min-height: calc(var(--vh) * 100 / 12 * 5);
}

.row__row--4 {
  min-height: calc(var(--vh) * 100 / 12 * 4);
}

.row__row--3 {
  min-height: calc(var(--vh) * 100 / 12 * 3);
}

.row__row--2 {
  min-height: calc(var(--vh) * 100 / 12 * 2);
}

.row__row--1 {
  min-height: calc(var(--vh) * 100 / 12 * 1);
}

.col__col--12 {
  flex: 0 0 calc(100% * 12 / 12);
  max-width: calc(100% * 12 / 12);
}

.col__col--11 {
  flex: 0 0 calc(100% * 11 / 12);
  max-width: calc(100% * 11 / 12);
}

.col__col--10 {
  flex: 0 0 calc(100% * 10 / 12);
  max-width: calc(100% * 10 / 12);
}

.col__col--9 {
  flex: 0 0 calc(100% * 9 / 12);
  max-width: calc(100% * 9 / 12);
}

.col__col--8 {
  flex: 0 0 calc(100% * 8 / 12);
  max-width: calc(100% * 8 / 12);
}

.col__col--7 {
  flex: 0 0 calc(100% * 7 / 12);
  max-width: calc(100% * 7 / 12);
}

.col__col--6 {
  flex: 0 0 calc(100% * 6 / 12);
  max-width: calc(100% * 6 / 12);
}

.col__col--5 {
  flex: 0 0 calc(100% * 5 / 12);
  max-width: calc(100% * 5 / 12);
}

.col__col--4 {
  flex: 0 0 calc(100% * 4 / 12);
  max-width: calc(100% * 4 / 12);
}

.col__col--3 {
  flex: 0 0 calc(100% * 3 / 12);
  max-width: calc(100% * 3 / 12);
}

.col__col--2 {
  flex: 0 0 calc(100% * 2 / 12);
  max-width: calc(100% * 2 / 12);
}

.col__col--1 {
  flex: 0 0 calc(100% * 1 / 12);
  max-width: calc(100% * 1 / 12);
}

.flex__row, .flex__column {
  display: flex;
  flex-wrap: wrap;
}
.flex__row > *, .flex__column > * {
  flex-grow: 0;
}

.flex__row {
  flex-direction: row;
}

.flex__row-reverse {
  flex-direction: row-reverse;
}

.flex__column {
  flex-direction: column;
}

.flex__column-reverse {
  flex-direction: column-reverse;
}

.flex__nowrap {
  flex-wrap: nowrap;
}

.flex__wrap {
  flex-wrap: wrap;
}

.flex__align-items--center {
  align-items: center;
}

.flex__align-items--start {
  align-items: flex-start;
}

.flex__align-items--end {
  align-items: flex-end;
}

.flex__align-items--stretch {
  align-items: stretch;
}

.flex__justify-content--center {
  justify-content: center;
}

.flex__justify-content--start {
  justify-content: flex-start;
}

.flex__justify-content--end {
  justify-content: flex-end;
}

.flex__justify-content--spacein {
  justify-content: space-between;
}

.flex__justify-content--spaceout {
  justify-content: space-around;
}

.flex__align-self--center {
  align-self: center;
}

.flex__align-self--start {
  align-self: flex-start;
}

.flex__align-self--end {
  align-self: flex-end;
}

.flex__align-self--stretch {
  align-self: stretch;
}

.flex__align-self--selfstart {
  align-self: self-start;
}

.flex__align-self--selfend {
  align-self: self-end;
}

.flex__justify-self--center {
  justify-self: center;
}

.flex__justify-self--start {
  justify-self: flex-start;
}

.flex__justify-self--end {
  justify-self: flex-end;
}

.flex__justify-self--stretch {
  justify-self: stretch;
}

.flex__justify-self--selfstart {
  justify-self: self-start;
}

.flex__justify-self--selfend {
  justify-self: self-end;
}

.flex__justify-self--left {
  justify-self: left;
}

.flex__justify-self--right {
  justify-self: right;
}

.flex__flex-grow--1 {
  flex-grow: 1;
}

.flex__flex-grow--2 {
  flex-grow: 2;
}

.flex__flex-grow--3 {
  flex-grow: 3;
}

.flex__flex-grow--4 {
  flex-grow: 4;
}

.flex__flex-grow--5 {
  flex-grow: 5;
}

.flex__flex-grow--6 {
  flex-grow: 6;
}

.flex__flex-grow--7 {
  flex-grow: 7;
}

.flex__flex-grow--8 {
  flex-grow: 8;
}

.flex__flex-grow--9 {
  flex-grow: 9;
}

.flex__flex-grow--10 {
  flex-grow: 10;
}

.display__flex {
  display: flex;
}

.display__inline {
  display: inline;
}

.display__inline-block {
  display: inline-block;
}

.display__block {
  display: block;
}

.position__absolute {
  position: absolute;
}

.position__fixed {
  position: fixed;
}

.position__inherit {
  position: inherit;
}

.position__relative {
  position: relative;
}

.position__sticky {
  position: sticky;
}

.position__top--0 {
  top: 0;
}

.position__top--inherit {
  top: inherit;
}

.position__left--0 {
  left: 0;
}

.position__left--inherit {
  left: inherit;
}

.position__right--0 {
  right: 0;
}

.position__right--inherit {
  right: inherit;
}

.position__bottom--0 {
  bottom: 0;
}

.position__bottom--inherit {
  bottom: inherit;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

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

.font-primary {
  font-family: var(--font-primary);
}

.font-secondary {
  font-family: var(--font-secondary);
}

.font-title {
  font-family: var(--font-title);
}

.font-mono {
  font-family: var(--font-mono);
}

.light {
  font-weight: 300;
}

.regular {
  font-weight: 400;
}

.medium {
  font-weight: 500;
}

.semibold {
  font-weight: 600;
}

.bold {
  font-weight: 700;
}

.extrabold {
  font-weight: 800;
}

.black {
  font-weight: 900;
}

@media (min-width: 0px) and (max-width: 1200px) {
  .xs-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .xs-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .xs-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .xs-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .xs-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .xs-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .xs-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .xs-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .xs-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .xs-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .xs-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .xs-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .xs-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .xs-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .xs-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .xs-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .xs-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .xs-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .xs-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .xs-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .xs-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .xs-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .xs-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .xs-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .xs-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .xs-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .xs-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .xs-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .xs-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .xs-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .xs-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .xs-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .xs-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .xs-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .xs-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .xs-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .xs-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .xs-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .xs-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .xs-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .xs-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .xs-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .xs-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .xs-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .xs-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .xs-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .xs-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .xs-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .xs-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .xs-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .xs-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .xs-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .xs-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .xs-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .xs-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .xs-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .xs-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .xs-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .xs-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .xs-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .xs-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .xs-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .xs-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .xs-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .xs-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .xs-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .xs-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .xs-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .xs-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .xs-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .xs-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .xs-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .xs-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .xs-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .xs-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .xs-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .xs-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .xs-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .xs-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .xs-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .xs-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .xs-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .xs-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .xs-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .xs-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .xs-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .xs-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .xs-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .xs-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .xs-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .xs-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .xs-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .xs-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .xs-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .xs-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .xs-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .xs-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .xs-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .xs-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .xs-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .xs-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .xs-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .xs-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .xs-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .xs-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .xs-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .xs-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .xs-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .xs-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .xs-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .xs-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .xs-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .xs-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .xs-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .xs-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .xs-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .xs-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .xs-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .xs-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .xs-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .xs-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .xs-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .xs-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .xs-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .xs-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .xs-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .xs-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .xs-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .xs-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .xs-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .xs-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .xs-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .xs-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .xs-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .xs-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .xs-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .xs-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .xs-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .xs-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .xs-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .xs-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .xs-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .xs-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .xs-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .xs-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .xs-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .xs-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .xs-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .xs-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .xs-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .xs-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .xs-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .xs-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .xs-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .xs-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .xs-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .xs-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .xs-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .xs-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .xs-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .xs-m-0 {
    margin: 0;
  }
  .xs-mt-0 {
    margin-top: 0;
  }
  .xs-mb-0 {
    margin-bottom: 0;
  }
  .xs-ml-0 {
    margin-left: 0;
  }
  .xs-mr-0 {
    margin-right: 0;
  }
  .xs-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .xs-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .xs-p-0 {
    padding: 0;
  }
  .xs-pt-0 {
    padding-top: 0;
  }
  .xs-pb-0 {
    padding-bottom: 0;
  }
  .xs-pl-0 {
    padding-left: 0;
  }
  .xs-pr-0 {
    padding-right: 0;
  }
  .xs-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .xs-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .xs-h-0 {
    height: 0;
  }
  .xs-w-0 {
    width: 0;
  }
  .xs-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .xs-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .xs-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .xs-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .xs-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .xs-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .xs-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .xs-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .xs-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .xs-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .xs-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .xs-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .xs-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .xs-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .xs-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .xs-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .xs-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .xs-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .xs-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .xs-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .xs-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .xs-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .xs-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .xs-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .xs-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .xs-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .xs-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .xs-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .xs-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .xs-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .xs-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .xs-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .xs-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .xs-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .xs-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .xs-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .xs-flex__row, .xs-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .xs-flex__row > *, .xs-flex__column > * {
    flex-grow: 0;
  }
  .xs-flex__row {
    flex-direction: row;
  }
  .xs-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .xs-flex__column {
    flex-direction: column;
  }
  .xs-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .xs-flex__nowrap {
    flex-wrap: nowrap;
  }
  .xs-flex__wrap {
    flex-wrap: wrap;
  }
  .xs-flex__align-items--center {
    align-items: center;
  }
  .xs-flex__align-items--start {
    align-items: flex-start;
  }
  .xs-flex__align-items--end {
    align-items: flex-end;
  }
  .xs-flex__align-items--stretch {
    align-items: stretch;
  }
  .xs-flex__justify-content--center {
    justify-content: center;
  }
  .xs-flex__justify-content--start {
    justify-content: flex-start;
  }
  .xs-flex__justify-content--end {
    justify-content: flex-end;
  }
  .xs-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .xs-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .xs-flex__align-self--center {
    align-self: center;
  }
  .xs-flex__align-self--start {
    align-self: flex-start;
  }
  .xs-flex__align-self--end {
    align-self: flex-end;
  }
  .xs-flex__align-self--stretch {
    align-self: stretch;
  }
  .xs-flex__align-self--selfstart {
    align-self: self-start;
  }
  .xs-flex__align-self--selfend {
    align-self: self-end;
  }
  .xs-flex__justify-self--center {
    justify-self: center;
  }
  .xs-flex__justify-self--start {
    justify-self: flex-start;
  }
  .xs-flex__justify-self--end {
    justify-self: flex-end;
  }
  .xs-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .xs-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .xs-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .xs-flex__justify-self--left {
    justify-self: left;
  }
  .xs-flex__justify-self--right {
    justify-self: right;
  }
  .xs-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .xs-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .xs-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .xs-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .xs-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .xs-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .xs-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .xs-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .xs-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .xs-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .xs-display__flex {
    display: flex;
  }
  .xs-display__inline {
    display: inline;
  }
  .xs-display__inline-block {
    display: inline-block;
  }
  .xs-display__block {
    display: block;
  }
  .xs-position__absolute {
    position: absolute;
  }
  .xs-position__fixed {
    position: fixed;
  }
  .xs-position__inherit {
    position: inherit;
  }
  .xs-position__relative {
    position: relative;
  }
  .xs-position__sticky {
    position: sticky;
  }
  .xs-position__top--0 {
    top: 0;
  }
  .xs-position__top--inherit {
    top: inherit;
  }
  .xs-position__left--0 {
    left: 0;
  }
  .xs-position__left--inherit {
    left: inherit;
  }
  .xs-position__right--0 {
    right: 0;
  }
  .xs-position__right--inherit {
    right: inherit;
  }
  .xs-position__bottom--0 {
    bottom: 0;
  }
  .xs-position__bottom--inherit {
    bottom: inherit;
  }
  [xs*=text-center] {
    text-align: center;
  }
  [xs*=text-left] {
    text-align: left;
  }
  [xs*=text-right] {
    text-align: right;
  }
  [xs*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .xs-l-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .xs-l-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .xs-l-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .xs-l-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .xs-l-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .xs-l-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .xs-l-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .xs-l-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .xs-l-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .xs-l-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .xs-l-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .xs-l-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .xs-l-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .xs-l-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .xs-l-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .xs-l-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .xs-l-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .xs-l-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .xs-l-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .xs-l-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .xs-l-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .xs-l-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .xs-l-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .xs-l-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .xs-l-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .xs-l-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .xs-l-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .xs-l-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .xs-l-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .xs-l-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .xs-l-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .xs-l-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .xs-l-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .xs-l-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .xs-l-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .xs-l-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .xs-l-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .xs-l-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .xs-l-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .xs-l-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .xs-l-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .xs-l-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .xs-l-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .xs-l-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .xs-l-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .xs-l-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .xs-l-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .xs-l-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .xs-l-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .xs-l-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .xs-l-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .xs-l-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .xs-l-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .xs-l-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .xs-l-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .xs-l-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .xs-l-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .xs-l-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .xs-l-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .xs-l-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .xs-l-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .xs-l-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .xs-l-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .xs-l-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .xs-l-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .xs-l-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .xs-l-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .xs-l-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .xs-l-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .xs-l-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .xs-l-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .xs-l-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .xs-l-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .xs-l-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .xs-l-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .xs-l-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .xs-l-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .xs-l-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .xs-l-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .xs-l-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .xs-l-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .xs-l-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .xs-l-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .xs-l-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .xs-l-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .xs-l-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .xs-l-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .xs-l-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .xs-l-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .xs-l-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .xs-l-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .xs-l-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .xs-l-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .xs-l-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .xs-l-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .xs-l-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .xs-l-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .xs-l-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .xs-l-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .xs-l-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .xs-l-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .xs-l-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .xs-l-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .xs-l-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .xs-l-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .xs-l-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .xs-l-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .xs-l-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .xs-l-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .xs-l-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .xs-l-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .xs-l-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .xs-l-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .xs-l-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .xs-l-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .xs-l-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .xs-l-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .xs-l-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .xs-l-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .xs-l-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .xs-l-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .xs-l-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .xs-l-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .xs-l-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .xs-l-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .xs-l-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .xs-l-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .xs-l-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .xs-l-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .xs-l-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .xs-l-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .xs-l-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .xs-l-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .xs-l-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .xs-l-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .xs-l-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .xs-l-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .xs-l-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .xs-l-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .xs-l-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .xs-l-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .xs-l-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .xs-l-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .xs-l-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .xs-l-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .xs-l-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .xs-l-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .xs-l-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .xs-l-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .xs-l-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .xs-l-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .xs-l-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .xs-l-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .xs-l-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .xs-l-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .xs-l-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .xs-l-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .xs-l-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .xs-l-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .xs-l-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .xs-l-m-0 {
    margin: 0;
  }
  .xs-l-mt-0 {
    margin-top: 0;
  }
  .xs-l-mb-0 {
    margin-bottom: 0;
  }
  .xs-l-ml-0 {
    margin-left: 0;
  }
  .xs-l-mr-0 {
    margin-right: 0;
  }
  .xs-l-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .xs-l-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .xs-l-p-0 {
    padding: 0;
  }
  .xs-l-pt-0 {
    padding-top: 0;
  }
  .xs-l-pb-0 {
    padding-bottom: 0;
  }
  .xs-l-pl-0 {
    padding-left: 0;
  }
  .xs-l-pr-0 {
    padding-right: 0;
  }
  .xs-l-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .xs-l-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .xs-l-h-0 {
    height: 0;
  }
  .xs-l-w-0 {
    width: 0;
  }
  .xs-l-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .xs-l-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .xs-l-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .xs-l-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .xs-l-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .xs-l-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .xs-l-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .xs-l-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .xs-l-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .xs-l-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .xs-l-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .xs-l-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .xs-l-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .xs-l-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .xs-l-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .xs-l-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .xs-l-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .xs-l-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .xs-l-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .xs-l-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .xs-l-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .xs-l-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .xs-l-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .xs-l-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .xs-l-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .xs-l-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .xs-l-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .xs-l-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .xs-l-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .xs-l-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .xs-l-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .xs-l-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .xs-l-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .xs-l-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .xs-l-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .xs-l-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .xs-l-flex__row, .xs-l-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .xs-l-flex__row > *, .xs-l-flex__column > * {
    flex-grow: 0;
  }
  .xs-l-flex__row {
    flex-direction: row;
  }
  .xs-l-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .xs-l-flex__column {
    flex-direction: column;
  }
  .xs-l-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .xs-l-flex__nowrap {
    flex-wrap: nowrap;
  }
  .xs-l-flex__wrap {
    flex-wrap: wrap;
  }
  .xs-l-flex__align-items--center {
    align-items: center;
  }
  .xs-l-flex__align-items--start {
    align-items: flex-start;
  }
  .xs-l-flex__align-items--end {
    align-items: flex-end;
  }
  .xs-l-flex__align-items--stretch {
    align-items: stretch;
  }
  .xs-l-flex__justify-content--center {
    justify-content: center;
  }
  .xs-l-flex__justify-content--start {
    justify-content: flex-start;
  }
  .xs-l-flex__justify-content--end {
    justify-content: flex-end;
  }
  .xs-l-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .xs-l-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .xs-l-flex__align-self--center {
    align-self: center;
  }
  .xs-l-flex__align-self--start {
    align-self: flex-start;
  }
  .xs-l-flex__align-self--end {
    align-self: flex-end;
  }
  .xs-l-flex__align-self--stretch {
    align-self: stretch;
  }
  .xs-l-flex__align-self--selfstart {
    align-self: self-start;
  }
  .xs-l-flex__align-self--selfend {
    align-self: self-end;
  }
  .xs-l-flex__justify-self--center {
    justify-self: center;
  }
  .xs-l-flex__justify-self--start {
    justify-self: flex-start;
  }
  .xs-l-flex__justify-self--end {
    justify-self: flex-end;
  }
  .xs-l-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .xs-l-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .xs-l-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .xs-l-flex__justify-self--left {
    justify-self: left;
  }
  .xs-l-flex__justify-self--right {
    justify-self: right;
  }
  .xs-l-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .xs-l-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .xs-l-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .xs-l-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .xs-l-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .xs-l-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .xs-l-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .xs-l-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .xs-l-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .xs-l-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .xs-l-display__flex {
    display: flex;
  }
  .xs-l-display__inline {
    display: inline;
  }
  .xs-l-display__inline-block {
    display: inline-block;
  }
  .xs-l-display__block {
    display: block;
  }
  .xs-l-position__absolute {
    position: absolute;
  }
  .xs-l-position__fixed {
    position: fixed;
  }
  .xs-l-position__inherit {
    position: inherit;
  }
  .xs-l-position__relative {
    position: relative;
  }
  .xs-l-position__sticky {
    position: sticky;
  }
  .xs-l-position__top--0 {
    top: 0;
  }
  .xs-l-position__top--inherit {
    top: inherit;
  }
  .xs-l-position__left--0 {
    left: 0;
  }
  .xs-l-position__left--inherit {
    left: inherit;
  }
  .xs-l-position__right--0 {
    right: 0;
  }
  .xs-l-position__right--inherit {
    right: inherit;
  }
  .xs-l-position__bottom--0 {
    bottom: 0;
  }
  .xs-l-position__bottom--inherit {
    bottom: inherit;
  }
  [xs-l*=text-center] {
    text-align: center;
  }
  [xs-l*=text-left] {
    text-align: left;
  }
  [xs-l*=text-right] {
    text-align: right;
  }
  [xs-l*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .sm-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .sm-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .sm-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .sm-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .sm-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .sm-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .sm-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .sm-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .sm-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .sm-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .sm-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .sm-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .sm-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .sm-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .sm-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .sm-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .sm-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .sm-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .sm-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .sm-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .sm-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .sm-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .sm-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .sm-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .sm-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .sm-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .sm-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .sm-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .sm-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .sm-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .sm-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .sm-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .sm-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .sm-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .sm-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .sm-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .sm-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .sm-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .sm-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .sm-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .sm-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .sm-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .sm-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .sm-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .sm-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .sm-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .sm-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .sm-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .sm-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .sm-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .sm-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .sm-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .sm-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .sm-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .sm-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .sm-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .sm-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .sm-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .sm-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .sm-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .sm-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .sm-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .sm-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .sm-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .sm-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .sm-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .sm-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .sm-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .sm-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .sm-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .sm-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .sm-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .sm-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .sm-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .sm-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .sm-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .sm-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .sm-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .sm-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .sm-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .sm-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .sm-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .sm-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .sm-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .sm-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .sm-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .sm-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .sm-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .sm-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .sm-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .sm-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .sm-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .sm-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .sm-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .sm-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .sm-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .sm-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .sm-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .sm-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .sm-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .sm-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .sm-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .sm-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .sm-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .sm-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .sm-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .sm-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .sm-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .sm-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .sm-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .sm-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .sm-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .sm-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .sm-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .sm-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .sm-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .sm-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .sm-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .sm-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .sm-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .sm-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .sm-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .sm-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .sm-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .sm-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .sm-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .sm-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .sm-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .sm-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .sm-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .sm-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .sm-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .sm-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .sm-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .sm-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .sm-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .sm-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .sm-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .sm-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .sm-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .sm-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .sm-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .sm-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .sm-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .sm-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .sm-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .sm-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .sm-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .sm-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .sm-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .sm-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .sm-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .sm-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .sm-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .sm-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .sm-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .sm-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .sm-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .sm-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .sm-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .sm-m-0 {
    margin: 0;
  }
  .sm-mt-0 {
    margin-top: 0;
  }
  .sm-mb-0 {
    margin-bottom: 0;
  }
  .sm-ml-0 {
    margin-left: 0;
  }
  .sm-mr-0 {
    margin-right: 0;
  }
  .sm-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .sm-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .sm-p-0 {
    padding: 0;
  }
  .sm-pt-0 {
    padding-top: 0;
  }
  .sm-pb-0 {
    padding-bottom: 0;
  }
  .sm-pl-0 {
    padding-left: 0;
  }
  .sm-pr-0 {
    padding-right: 0;
  }
  .sm-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .sm-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .sm-h-0 {
    height: 0;
  }
  .sm-w-0 {
    width: 0;
  }
  .sm-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .sm-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .sm-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .sm-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .sm-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .sm-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .sm-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .sm-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .sm-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .sm-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .sm-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .sm-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .sm-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .sm-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .sm-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .sm-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .sm-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .sm-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .sm-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .sm-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .sm-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .sm-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .sm-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .sm-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .sm-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .sm-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .sm-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .sm-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .sm-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .sm-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .sm-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .sm-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .sm-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .sm-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .sm-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .sm-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .sm-flex__row, .sm-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .sm-flex__row > *, .sm-flex__column > * {
    flex-grow: 0;
  }
  .sm-flex__row {
    flex-direction: row;
  }
  .sm-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .sm-flex__column {
    flex-direction: column;
  }
  .sm-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .sm-flex__nowrap {
    flex-wrap: nowrap;
  }
  .sm-flex__wrap {
    flex-wrap: wrap;
  }
  .sm-flex__align-items--center {
    align-items: center;
  }
  .sm-flex__align-items--start {
    align-items: flex-start;
  }
  .sm-flex__align-items--end {
    align-items: flex-end;
  }
  .sm-flex__align-items--stretch {
    align-items: stretch;
  }
  .sm-flex__justify-content--center {
    justify-content: center;
  }
  .sm-flex__justify-content--start {
    justify-content: flex-start;
  }
  .sm-flex__justify-content--end {
    justify-content: flex-end;
  }
  .sm-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .sm-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .sm-flex__align-self--center {
    align-self: center;
  }
  .sm-flex__align-self--start {
    align-self: flex-start;
  }
  .sm-flex__align-self--end {
    align-self: flex-end;
  }
  .sm-flex__align-self--stretch {
    align-self: stretch;
  }
  .sm-flex__align-self--selfstart {
    align-self: self-start;
  }
  .sm-flex__align-self--selfend {
    align-self: self-end;
  }
  .sm-flex__justify-self--center {
    justify-self: center;
  }
  .sm-flex__justify-self--start {
    justify-self: flex-start;
  }
  .sm-flex__justify-self--end {
    justify-self: flex-end;
  }
  .sm-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .sm-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .sm-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .sm-flex__justify-self--left {
    justify-self: left;
  }
  .sm-flex__justify-self--right {
    justify-self: right;
  }
  .sm-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .sm-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .sm-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .sm-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .sm-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .sm-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .sm-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .sm-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .sm-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .sm-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .sm-display__flex {
    display: flex;
  }
  .sm-display__inline {
    display: inline;
  }
  .sm-display__inline-block {
    display: inline-block;
  }
  .sm-display__block {
    display: block;
  }
  .sm-position__absolute {
    position: absolute;
  }
  .sm-position__fixed {
    position: fixed;
  }
  .sm-position__inherit {
    position: inherit;
  }
  .sm-position__relative {
    position: relative;
  }
  .sm-position__sticky {
    position: sticky;
  }
  .sm-position__top--0 {
    top: 0;
  }
  .sm-position__top--inherit {
    top: inherit;
  }
  .sm-position__left--0 {
    left: 0;
  }
  .sm-position__left--inherit {
    left: inherit;
  }
  .sm-position__right--0 {
    right: 0;
  }
  .sm-position__right--inherit {
    right: inherit;
  }
  .sm-position__bottom--0 {
    bottom: 0;
  }
  .sm-position__bottom--inherit {
    bottom: inherit;
  }
  [sm*=text-center] {
    text-align: center;
  }
  [sm*=text-left] {
    text-align: left;
  }
  [sm*=text-right] {
    text-align: right;
  }
  [sm*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .sm-l-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .sm-l-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .sm-l-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .sm-l-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .sm-l-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .sm-l-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .sm-l-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .sm-l-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .sm-l-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .sm-l-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .sm-l-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .sm-l-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .sm-l-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .sm-l-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .sm-l-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .sm-l-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .sm-l-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .sm-l-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .sm-l-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .sm-l-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .sm-l-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .sm-l-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .sm-l-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .sm-l-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .sm-l-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .sm-l-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .sm-l-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .sm-l-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .sm-l-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .sm-l-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .sm-l-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .sm-l-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .sm-l-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .sm-l-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .sm-l-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .sm-l-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .sm-l-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .sm-l-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .sm-l-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .sm-l-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .sm-l-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .sm-l-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .sm-l-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .sm-l-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .sm-l-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .sm-l-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .sm-l-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .sm-l-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .sm-l-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .sm-l-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .sm-l-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .sm-l-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .sm-l-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .sm-l-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .sm-l-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .sm-l-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .sm-l-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .sm-l-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .sm-l-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .sm-l-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .sm-l-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .sm-l-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .sm-l-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .sm-l-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .sm-l-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .sm-l-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .sm-l-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .sm-l-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .sm-l-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .sm-l-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .sm-l-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .sm-l-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .sm-l-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .sm-l-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .sm-l-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .sm-l-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .sm-l-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .sm-l-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .sm-l-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .sm-l-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .sm-l-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .sm-l-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .sm-l-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .sm-l-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .sm-l-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .sm-l-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .sm-l-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .sm-l-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .sm-l-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .sm-l-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .sm-l-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .sm-l-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .sm-l-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .sm-l-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .sm-l-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .sm-l-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .sm-l-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .sm-l-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .sm-l-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .sm-l-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .sm-l-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .sm-l-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .sm-l-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .sm-l-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .sm-l-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .sm-l-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .sm-l-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .sm-l-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .sm-l-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .sm-l-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .sm-l-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .sm-l-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .sm-l-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .sm-l-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .sm-l-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .sm-l-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .sm-l-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .sm-l-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .sm-l-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .sm-l-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .sm-l-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .sm-l-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .sm-l-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .sm-l-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .sm-l-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .sm-l-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .sm-l-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .sm-l-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .sm-l-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .sm-l-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .sm-l-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .sm-l-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .sm-l-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .sm-l-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .sm-l-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .sm-l-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .sm-l-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .sm-l-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .sm-l-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .sm-l-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .sm-l-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .sm-l-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .sm-l-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .sm-l-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .sm-l-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .sm-l-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .sm-l-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .sm-l-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .sm-l-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .sm-l-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .sm-l-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .sm-l-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .sm-l-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .sm-l-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .sm-l-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .sm-l-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .sm-l-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .sm-l-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .sm-l-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .sm-l-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .sm-l-m-0 {
    margin: 0;
  }
  .sm-l-mt-0 {
    margin-top: 0;
  }
  .sm-l-mb-0 {
    margin-bottom: 0;
  }
  .sm-l-ml-0 {
    margin-left: 0;
  }
  .sm-l-mr-0 {
    margin-right: 0;
  }
  .sm-l-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .sm-l-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .sm-l-p-0 {
    padding: 0;
  }
  .sm-l-pt-0 {
    padding-top: 0;
  }
  .sm-l-pb-0 {
    padding-bottom: 0;
  }
  .sm-l-pl-0 {
    padding-left: 0;
  }
  .sm-l-pr-0 {
    padding-right: 0;
  }
  .sm-l-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .sm-l-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .sm-l-h-0 {
    height: 0;
  }
  .sm-l-w-0 {
    width: 0;
  }
  .sm-l-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .sm-l-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .sm-l-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .sm-l-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .sm-l-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .sm-l-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .sm-l-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .sm-l-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .sm-l-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .sm-l-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .sm-l-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .sm-l-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .sm-l-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .sm-l-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .sm-l-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .sm-l-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .sm-l-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .sm-l-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .sm-l-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .sm-l-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .sm-l-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .sm-l-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .sm-l-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .sm-l-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .sm-l-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .sm-l-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .sm-l-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .sm-l-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .sm-l-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .sm-l-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .sm-l-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .sm-l-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .sm-l-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .sm-l-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .sm-l-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .sm-l-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .sm-l-flex__row, .sm-l-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .sm-l-flex__row > *, .sm-l-flex__column > * {
    flex-grow: 0;
  }
  .sm-l-flex__row {
    flex-direction: row;
  }
  .sm-l-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .sm-l-flex__column {
    flex-direction: column;
  }
  .sm-l-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .sm-l-flex__nowrap {
    flex-wrap: nowrap;
  }
  .sm-l-flex__wrap {
    flex-wrap: wrap;
  }
  .sm-l-flex__align-items--center {
    align-items: center;
  }
  .sm-l-flex__align-items--start {
    align-items: flex-start;
  }
  .sm-l-flex__align-items--end {
    align-items: flex-end;
  }
  .sm-l-flex__align-items--stretch {
    align-items: stretch;
  }
  .sm-l-flex__justify-content--center {
    justify-content: center;
  }
  .sm-l-flex__justify-content--start {
    justify-content: flex-start;
  }
  .sm-l-flex__justify-content--end {
    justify-content: flex-end;
  }
  .sm-l-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .sm-l-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .sm-l-flex__align-self--center {
    align-self: center;
  }
  .sm-l-flex__align-self--start {
    align-self: flex-start;
  }
  .sm-l-flex__align-self--end {
    align-self: flex-end;
  }
  .sm-l-flex__align-self--stretch {
    align-self: stretch;
  }
  .sm-l-flex__align-self--selfstart {
    align-self: self-start;
  }
  .sm-l-flex__align-self--selfend {
    align-self: self-end;
  }
  .sm-l-flex__justify-self--center {
    justify-self: center;
  }
  .sm-l-flex__justify-self--start {
    justify-self: flex-start;
  }
  .sm-l-flex__justify-self--end {
    justify-self: flex-end;
  }
  .sm-l-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .sm-l-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .sm-l-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .sm-l-flex__justify-self--left {
    justify-self: left;
  }
  .sm-l-flex__justify-self--right {
    justify-self: right;
  }
  .sm-l-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .sm-l-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .sm-l-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .sm-l-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .sm-l-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .sm-l-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .sm-l-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .sm-l-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .sm-l-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .sm-l-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .sm-l-display__flex {
    display: flex;
  }
  .sm-l-display__inline {
    display: inline;
  }
  .sm-l-display__inline-block {
    display: inline-block;
  }
  .sm-l-display__block {
    display: block;
  }
  .sm-l-position__absolute {
    position: absolute;
  }
  .sm-l-position__fixed {
    position: fixed;
  }
  .sm-l-position__inherit {
    position: inherit;
  }
  .sm-l-position__relative {
    position: relative;
  }
  .sm-l-position__sticky {
    position: sticky;
  }
  .sm-l-position__top--0 {
    top: 0;
  }
  .sm-l-position__top--inherit {
    top: inherit;
  }
  .sm-l-position__left--0 {
    left: 0;
  }
  .sm-l-position__left--inherit {
    left: inherit;
  }
  .sm-l-position__right--0 {
    right: 0;
  }
  .sm-l-position__right--inherit {
    right: inherit;
  }
  .sm-l-position__bottom--0 {
    bottom: 0;
  }
  .sm-l-position__bottom--inherit {
    bottom: inherit;
  }
  [sm-l*=text-center] {
    text-align: center;
  }
  [sm-l*=text-left] {
    text-align: left;
  }
  [sm-l*=text-right] {
    text-align: right;
  }
  [sm-l*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .md-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .md-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .md-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .md-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .md-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .md-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .md-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .md-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .md-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .md-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .md-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .md-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .md-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .md-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .md-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .md-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .md-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .md-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .md-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .md-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .md-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .md-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .md-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .md-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .md-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .md-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .md-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .md-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .md-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .md-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .md-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .md-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .md-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .md-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .md-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .md-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .md-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .md-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .md-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .md-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .md-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .md-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .md-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .md-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .md-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .md-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .md-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .md-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .md-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .md-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .md-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .md-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .md-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .md-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .md-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .md-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .md-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .md-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .md-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .md-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .md-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .md-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .md-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .md-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .md-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .md-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .md-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .md-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .md-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .md-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .md-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .md-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .md-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .md-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .md-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .md-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .md-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .md-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .md-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .md-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .md-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .md-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .md-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .md-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .md-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .md-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .md-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .md-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .md-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .md-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .md-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .md-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .md-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .md-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .md-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .md-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .md-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .md-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .md-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .md-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .md-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .md-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .md-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .md-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .md-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .md-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .md-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .md-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .md-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .md-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .md-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .md-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .md-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .md-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .md-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .md-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .md-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .md-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .md-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .md-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .md-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .md-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .md-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .md-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .md-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .md-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .md-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .md-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .md-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .md-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .md-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .md-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .md-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .md-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .md-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .md-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .md-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .md-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .md-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .md-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .md-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .md-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .md-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .md-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .md-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .md-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .md-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .md-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .md-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .md-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .md-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .md-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .md-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .md-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .md-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .md-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .md-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .md-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .md-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .md-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .md-m-0 {
    margin: 0;
  }
  .md-mt-0 {
    margin-top: 0;
  }
  .md-mb-0 {
    margin-bottom: 0;
  }
  .md-ml-0 {
    margin-left: 0;
  }
  .md-mr-0 {
    margin-right: 0;
  }
  .md-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .md-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .md-p-0 {
    padding: 0;
  }
  .md-pt-0 {
    padding-top: 0;
  }
  .md-pb-0 {
    padding-bottom: 0;
  }
  .md-pl-0 {
    padding-left: 0;
  }
  .md-pr-0 {
    padding-right: 0;
  }
  .md-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .md-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .md-h-0 {
    height: 0;
  }
  .md-w-0 {
    width: 0;
  }
  .md-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .md-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .md-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .md-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .md-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .md-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .md-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .md-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .md-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .md-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .md-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .md-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .md-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .md-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .md-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .md-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .md-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .md-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .md-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .md-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .md-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .md-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .md-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .md-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .md-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .md-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .md-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .md-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .md-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .md-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .md-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .md-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .md-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .md-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .md-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .md-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .md-flex__row, .md-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .md-flex__row > *, .md-flex__column > * {
    flex-grow: 0;
  }
  .md-flex__row {
    flex-direction: row;
  }
  .md-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .md-flex__column {
    flex-direction: column;
  }
  .md-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .md-flex__nowrap {
    flex-wrap: nowrap;
  }
  .md-flex__wrap {
    flex-wrap: wrap;
  }
  .md-flex__align-items--center {
    align-items: center;
  }
  .md-flex__align-items--start {
    align-items: flex-start;
  }
  .md-flex__align-items--end {
    align-items: flex-end;
  }
  .md-flex__align-items--stretch {
    align-items: stretch;
  }
  .md-flex__justify-content--center {
    justify-content: center;
  }
  .md-flex__justify-content--start {
    justify-content: flex-start;
  }
  .md-flex__justify-content--end {
    justify-content: flex-end;
  }
  .md-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .md-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .md-flex__align-self--center {
    align-self: center;
  }
  .md-flex__align-self--start {
    align-self: flex-start;
  }
  .md-flex__align-self--end {
    align-self: flex-end;
  }
  .md-flex__align-self--stretch {
    align-self: stretch;
  }
  .md-flex__align-self--selfstart {
    align-self: self-start;
  }
  .md-flex__align-self--selfend {
    align-self: self-end;
  }
  .md-flex__justify-self--center {
    justify-self: center;
  }
  .md-flex__justify-self--start {
    justify-self: flex-start;
  }
  .md-flex__justify-self--end {
    justify-self: flex-end;
  }
  .md-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .md-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .md-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .md-flex__justify-self--left {
    justify-self: left;
  }
  .md-flex__justify-self--right {
    justify-self: right;
  }
  .md-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .md-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .md-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .md-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .md-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .md-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .md-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .md-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .md-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .md-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .md-display__flex {
    display: flex;
  }
  .md-display__inline {
    display: inline;
  }
  .md-display__inline-block {
    display: inline-block;
  }
  .md-display__block {
    display: block;
  }
  .md-position__absolute {
    position: absolute;
  }
  .md-position__fixed {
    position: fixed;
  }
  .md-position__inherit {
    position: inherit;
  }
  .md-position__relative {
    position: relative;
  }
  .md-position__sticky {
    position: sticky;
  }
  .md-position__top--0 {
    top: 0;
  }
  .md-position__top--inherit {
    top: inherit;
  }
  .md-position__left--0 {
    left: 0;
  }
  .md-position__left--inherit {
    left: inherit;
  }
  .md-position__right--0 {
    right: 0;
  }
  .md-position__right--inherit {
    right: inherit;
  }
  .md-position__bottom--0 {
    bottom: 0;
  }
  .md-position__bottom--inherit {
    bottom: inherit;
  }
  [md*=text-center] {
    text-align: center;
  }
  [md*=text-left] {
    text-align: left;
  }
  [md*=text-right] {
    text-align: right;
  }
  [md*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .lg-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .lg-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .lg-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .lg-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .lg-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .lg-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .lg-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .lg-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .lg-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .lg-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .lg-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .lg-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .lg-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .lg-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .lg-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .lg-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .lg-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .lg-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .lg-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .lg-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .lg-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .lg-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .lg-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .lg-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .lg-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .lg-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .lg-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .lg-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .lg-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .lg-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .lg-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .lg-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .lg-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .lg-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .lg-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .lg-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .lg-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .lg-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .lg-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .lg-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .lg-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .lg-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .lg-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .lg-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .lg-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .lg-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .lg-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .lg-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .lg-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .lg-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .lg-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .lg-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .lg-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .lg-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .lg-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .lg-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .lg-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .lg-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .lg-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .lg-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .lg-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .lg-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .lg-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .lg-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .lg-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .lg-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .lg-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .lg-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .lg-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .lg-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .lg-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .lg-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .lg-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .lg-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .lg-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .lg-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .lg-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .lg-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .lg-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .lg-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .lg-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .lg-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .lg-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .lg-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .lg-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .lg-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .lg-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .lg-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .lg-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .lg-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .lg-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .lg-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .lg-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .lg-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .lg-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .lg-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .lg-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .lg-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .lg-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .lg-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .lg-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .lg-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .lg-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .lg-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .lg-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .lg-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .lg-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .lg-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .lg-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .lg-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .lg-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .lg-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .lg-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .lg-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .lg-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .lg-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .lg-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .lg-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .lg-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .lg-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .lg-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .lg-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .lg-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .lg-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .lg-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .lg-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .lg-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .lg-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .lg-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .lg-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .lg-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .lg-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .lg-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .lg-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .lg-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .lg-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .lg-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .lg-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .lg-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .lg-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .lg-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .lg-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .lg-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .lg-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .lg-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .lg-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .lg-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .lg-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .lg-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .lg-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .lg-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .lg-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .lg-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .lg-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .lg-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .lg-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .lg-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .lg-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .lg-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .lg-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .lg-m-0 {
    margin: 0;
  }
  .lg-mt-0 {
    margin-top: 0;
  }
  .lg-mb-0 {
    margin-bottom: 0;
  }
  .lg-ml-0 {
    margin-left: 0;
  }
  .lg-mr-0 {
    margin-right: 0;
  }
  .lg-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .lg-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .lg-p-0 {
    padding: 0;
  }
  .lg-pt-0 {
    padding-top: 0;
  }
  .lg-pb-0 {
    padding-bottom: 0;
  }
  .lg-pl-0 {
    padding-left: 0;
  }
  .lg-pr-0 {
    padding-right: 0;
  }
  .lg-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .lg-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .lg-h-0 {
    height: 0;
  }
  .lg-w-0 {
    width: 0;
  }
  .lg-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .lg-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .lg-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .lg-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .lg-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .lg-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .lg-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .lg-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .lg-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .lg-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .lg-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .lg-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .lg-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .lg-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .lg-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .lg-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .lg-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .lg-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .lg-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .lg-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .lg-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .lg-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .lg-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .lg-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .lg-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .lg-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .lg-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .lg-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .lg-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .lg-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .lg-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .lg-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .lg-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .lg-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .lg-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .lg-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .lg-flex__row, .lg-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .lg-flex__row > *, .lg-flex__column > * {
    flex-grow: 0;
  }
  .lg-flex__row {
    flex-direction: row;
  }
  .lg-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .lg-flex__column {
    flex-direction: column;
  }
  .lg-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .lg-flex__nowrap {
    flex-wrap: nowrap;
  }
  .lg-flex__wrap {
    flex-wrap: wrap;
  }
  .lg-flex__align-items--center {
    align-items: center;
  }
  .lg-flex__align-items--start {
    align-items: flex-start;
  }
  .lg-flex__align-items--end {
    align-items: flex-end;
  }
  .lg-flex__align-items--stretch {
    align-items: stretch;
  }
  .lg-flex__justify-content--center {
    justify-content: center;
  }
  .lg-flex__justify-content--start {
    justify-content: flex-start;
  }
  .lg-flex__justify-content--end {
    justify-content: flex-end;
  }
  .lg-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .lg-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .lg-flex__align-self--center {
    align-self: center;
  }
  .lg-flex__align-self--start {
    align-self: flex-start;
  }
  .lg-flex__align-self--end {
    align-self: flex-end;
  }
  .lg-flex__align-self--stretch {
    align-self: stretch;
  }
  .lg-flex__align-self--selfstart {
    align-self: self-start;
  }
  .lg-flex__align-self--selfend {
    align-self: self-end;
  }
  .lg-flex__justify-self--center {
    justify-self: center;
  }
  .lg-flex__justify-self--start {
    justify-self: flex-start;
  }
  .lg-flex__justify-self--end {
    justify-self: flex-end;
  }
  .lg-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .lg-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .lg-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .lg-flex__justify-self--left {
    justify-self: left;
  }
  .lg-flex__justify-self--right {
    justify-self: right;
  }
  .lg-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .lg-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .lg-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .lg-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .lg-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .lg-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .lg-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .lg-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .lg-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .lg-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .lg-display__flex {
    display: flex;
  }
  .lg-display__inline {
    display: inline;
  }
  .lg-display__inline-block {
    display: inline-block;
  }
  .lg-display__block {
    display: block;
  }
  .lg-position__absolute {
    position: absolute;
  }
  .lg-position__fixed {
    position: fixed;
  }
  .lg-position__inherit {
    position: inherit;
  }
  .lg-position__relative {
    position: relative;
  }
  .lg-position__sticky {
    position: sticky;
  }
  .lg-position__top--0 {
    top: 0;
  }
  .lg-position__top--inherit {
    top: inherit;
  }
  .lg-position__left--0 {
    left: 0;
  }
  .lg-position__left--inherit {
    left: inherit;
  }
  .lg-position__right--0 {
    right: 0;
  }
  .lg-position__right--inherit {
    right: inherit;
  }
  .lg-position__bottom--0 {
    bottom: 0;
  }
  .lg-position__bottom--inherit {
    bottom: inherit;
  }
  [lg*=text-center] {
    text-align: center;
  }
  [lg*=text-left] {
    text-align: left;
  }
  [lg*=text-right] {
    text-align: right;
  }
  [lg*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .xl-m-1-1 {
    margin: calc(var(--spacer) / 1);
  }
  .xl-mt-1-1 {
    margin-top: calc(var(--spacer) / 1);
  }
  .xl-mb-1-1 {
    margin-bottom: calc(var(--spacer) / 1);
  }
  .xl-ml-1-1 {
    margin-left: calc(var(--spacer) / 1);
  }
  .xl-mr-1-1 {
    margin-right: calc(var(--spacer) / 1);
  }
  .xl-mx-1-1 {
    margin-left: calc(var(--spacer) / 1);
    margin-right: calc(var(--spacer) / 1);
  }
  .xl-my-1-1 {
    margin-top: calc(var(--spacer) / 1);
    margin-bottom: calc(var(--spacer) / 1);
  }
  .xl-p-1-1 {
    padding: calc(var(--spacer) / 1);
  }
  .xl-pt-1-1 {
    padding-top: calc(var(--spacer) / 1);
  }
  .xl-pb-1-1 {
    padding-bottom: calc(var(--spacer) / 1);
  }
  .xl-pl-1-1 {
    padding-left: calc(var(--spacer) / 1);
  }
  .xl-pr-1-1 {
    padding-right: calc(var(--spacer) / 1);
  }
  .xl-px-1-1 {
    padding-left: calc(var(--spacer) / 1);
    padding-right: calc(var(--spacer) / 1);
  }
  .xl-py-1-1 {
    padding-top: calc(var(--spacer) / 1);
    padding-bottom: calc(var(--spacer) / 1);
  }
  .xl-h-1-1 {
    height: calc(var(--spacer) / 1);
  }
  .xl-w-1-1 {
    width: calc(var(--spacer) / 1);
  }
  .xl-m-1-2 {
    margin: calc(var(--spacer) / 2);
  }
  .xl-mt-1-2 {
    margin-top: calc(var(--spacer) / 2);
  }
  .xl-mb-1-2 {
    margin-bottom: calc(var(--spacer) / 2);
  }
  .xl-ml-1-2 {
    margin-left: calc(var(--spacer) / 2);
  }
  .xl-mr-1-2 {
    margin-right: calc(var(--spacer) / 2);
  }
  .xl-mx-1-2 {
    margin-left: calc(var(--spacer) / 2);
    margin-right: calc(var(--spacer) / 2);
  }
  .xl-my-1-2 {
    margin-top: calc(var(--spacer) / 2);
    margin-bottom: calc(var(--spacer) / 2);
  }
  .xl-p-1-2 {
    padding: calc(var(--spacer) / 2);
  }
  .xl-pt-1-2 {
    padding-top: calc(var(--spacer) / 2);
  }
  .xl-pb-1-2 {
    padding-bottom: calc(var(--spacer) / 2);
  }
  .xl-pl-1-2 {
    padding-left: calc(var(--spacer) / 2);
  }
  .xl-pr-1-2 {
    padding-right: calc(var(--spacer) / 2);
  }
  .xl-px-1-2 {
    padding-left: calc(var(--spacer) / 2);
    padding-right: calc(var(--spacer) / 2);
  }
  .xl-py-1-2 {
    padding-top: calc(var(--spacer) / 2);
    padding-bottom: calc(var(--spacer) / 2);
  }
  .xl-h-1-2 {
    height: calc(var(--spacer) / 2);
  }
  .xl-w-1-2 {
    width: calc(var(--spacer) / 2);
  }
  .xl-m-1-3 {
    margin: calc(var(--spacer) / 3);
  }
  .xl-mt-1-3 {
    margin-top: calc(var(--spacer) / 3);
  }
  .xl-mb-1-3 {
    margin-bottom: calc(var(--spacer) / 3);
  }
  .xl-ml-1-3 {
    margin-left: calc(var(--spacer) / 3);
  }
  .xl-mr-1-3 {
    margin-right: calc(var(--spacer) / 3);
  }
  .xl-mx-1-3 {
    margin-left: calc(var(--spacer) / 3);
    margin-right: calc(var(--spacer) / 3);
  }
  .xl-my-1-3 {
    margin-top: calc(var(--spacer) / 3);
    margin-bottom: calc(var(--spacer) / 3);
  }
  .xl-p-1-3 {
    padding: calc(var(--spacer) / 3);
  }
  .xl-pt-1-3 {
    padding-top: calc(var(--spacer) / 3);
  }
  .xl-pb-1-3 {
    padding-bottom: calc(var(--spacer) / 3);
  }
  .xl-pl-1-3 {
    padding-left: calc(var(--spacer) / 3);
  }
  .xl-pr-1-3 {
    padding-right: calc(var(--spacer) / 3);
  }
  .xl-px-1-3 {
    padding-left: calc(var(--spacer) / 3);
    padding-right: calc(var(--spacer) / 3);
  }
  .xl-py-1-3 {
    padding-top: calc(var(--spacer) / 3);
    padding-bottom: calc(var(--spacer) / 3);
  }
  .xl-h-1-3 {
    height: calc(var(--spacer) / 3);
  }
  .xl-w-1-3 {
    width: calc(var(--spacer) / 3);
  }
  .xl-m-1-4 {
    margin: calc(var(--spacer) / 4);
  }
  .xl-mt-1-4 {
    margin-top: calc(var(--spacer) / 4);
  }
  .xl-mb-1-4 {
    margin-bottom: calc(var(--spacer) / 4);
  }
  .xl-ml-1-4 {
    margin-left: calc(var(--spacer) / 4);
  }
  .xl-mr-1-4 {
    margin-right: calc(var(--spacer) / 4);
  }
  .xl-mx-1-4 {
    margin-left: calc(var(--spacer) / 4);
    margin-right: calc(var(--spacer) / 4);
  }
  .xl-my-1-4 {
    margin-top: calc(var(--spacer) / 4);
    margin-bottom: calc(var(--spacer) / 4);
  }
  .xl-p-1-4 {
    padding: calc(var(--spacer) / 4);
  }
  .xl-pt-1-4 {
    padding-top: calc(var(--spacer) / 4);
  }
  .xl-pb-1-4 {
    padding-bottom: calc(var(--spacer) / 4);
  }
  .xl-pl-1-4 {
    padding-left: calc(var(--spacer) / 4);
  }
  .xl-pr-1-4 {
    padding-right: calc(var(--spacer) / 4);
  }
  .xl-px-1-4 {
    padding-left: calc(var(--spacer) / 4);
    padding-right: calc(var(--spacer) / 4);
  }
  .xl-py-1-4 {
    padding-top: calc(var(--spacer) / 4);
    padding-bottom: calc(var(--spacer) / 4);
  }
  .xl-h-1-4 {
    height: calc(var(--spacer) / 4);
  }
  .xl-w-1-4 {
    width: calc(var(--spacer) / 4);
  }
  .xl-m-1-5 {
    margin: calc(var(--spacer) / 5);
  }
  .xl-mt-1-5 {
    margin-top: calc(var(--spacer) / 5);
  }
  .xl-mb-1-5 {
    margin-bottom: calc(var(--spacer) / 5);
  }
  .xl-ml-1-5 {
    margin-left: calc(var(--spacer) / 5);
  }
  .xl-mr-1-5 {
    margin-right: calc(var(--spacer) / 5);
  }
  .xl-mx-1-5 {
    margin-left: calc(var(--spacer) / 5);
    margin-right: calc(var(--spacer) / 5);
  }
  .xl-my-1-5 {
    margin-top: calc(var(--spacer) / 5);
    margin-bottom: calc(var(--spacer) / 5);
  }
  .xl-p-1-5 {
    padding: calc(var(--spacer) / 5);
  }
  .xl-pt-1-5 {
    padding-top: calc(var(--spacer) / 5);
  }
  .xl-pb-1-5 {
    padding-bottom: calc(var(--spacer) / 5);
  }
  .xl-pl-1-5 {
    padding-left: calc(var(--spacer) / 5);
  }
  .xl-pr-1-5 {
    padding-right: calc(var(--spacer) / 5);
  }
  .xl-px-1-5 {
    padding-left: calc(var(--spacer) / 5);
    padding-right: calc(var(--spacer) / 5);
  }
  .xl-py-1-5 {
    padding-top: calc(var(--spacer) / 5);
    padding-bottom: calc(var(--spacer) / 5);
  }
  .xl-h-1-5 {
    height: calc(var(--spacer) / 5);
  }
  .xl-w-1-5 {
    width: calc(var(--spacer) / 5);
  }
  .xl-m-1-6 {
    margin: calc(var(--spacer) / 6);
  }
  .xl-mt-1-6 {
    margin-top: calc(var(--spacer) / 6);
  }
  .xl-mb-1-6 {
    margin-bottom: calc(var(--spacer) / 6);
  }
  .xl-ml-1-6 {
    margin-left: calc(var(--spacer) / 6);
  }
  .xl-mr-1-6 {
    margin-right: calc(var(--spacer) / 6);
  }
  .xl-mx-1-6 {
    margin-left: calc(var(--spacer) / 6);
    margin-right: calc(var(--spacer) / 6);
  }
  .xl-my-1-6 {
    margin-top: calc(var(--spacer) / 6);
    margin-bottom: calc(var(--spacer) / 6);
  }
  .xl-p-1-6 {
    padding: calc(var(--spacer) / 6);
  }
  .xl-pt-1-6 {
    padding-top: calc(var(--spacer) / 6);
  }
  .xl-pb-1-6 {
    padding-bottom: calc(var(--spacer) / 6);
  }
  .xl-pl-1-6 {
    padding-left: calc(var(--spacer) / 6);
  }
  .xl-pr-1-6 {
    padding-right: calc(var(--spacer) / 6);
  }
  .xl-px-1-6 {
    padding-left: calc(var(--spacer) / 6);
    padding-right: calc(var(--spacer) / 6);
  }
  .xl-py-1-6 {
    padding-top: calc(var(--spacer) / 6);
    padding-bottom: calc(var(--spacer) / 6);
  }
  .xl-h-1-6 {
    height: calc(var(--spacer) / 6);
  }
  .xl-w-1-6 {
    width: calc(var(--spacer) / 6);
  }
  .xl-m-1-7 {
    margin: calc(var(--spacer) / 7);
  }
  .xl-mt-1-7 {
    margin-top: calc(var(--spacer) / 7);
  }
  .xl-mb-1-7 {
    margin-bottom: calc(var(--spacer) / 7);
  }
  .xl-ml-1-7 {
    margin-left: calc(var(--spacer) / 7);
  }
  .xl-mr-1-7 {
    margin-right: calc(var(--spacer) / 7);
  }
  .xl-mx-1-7 {
    margin-left: calc(var(--spacer) / 7);
    margin-right: calc(var(--spacer) / 7);
  }
  .xl-my-1-7 {
    margin-top: calc(var(--spacer) / 7);
    margin-bottom: calc(var(--spacer) / 7);
  }
  .xl-p-1-7 {
    padding: calc(var(--spacer) / 7);
  }
  .xl-pt-1-7 {
    padding-top: calc(var(--spacer) / 7);
  }
  .xl-pb-1-7 {
    padding-bottom: calc(var(--spacer) / 7);
  }
  .xl-pl-1-7 {
    padding-left: calc(var(--spacer) / 7);
  }
  .xl-pr-1-7 {
    padding-right: calc(var(--spacer) / 7);
  }
  .xl-px-1-7 {
    padding-left: calc(var(--spacer) / 7);
    padding-right: calc(var(--spacer) / 7);
  }
  .xl-py-1-7 {
    padding-top: calc(var(--spacer) / 7);
    padding-bottom: calc(var(--spacer) / 7);
  }
  .xl-h-1-7 {
    height: calc(var(--spacer) / 7);
  }
  .xl-w-1-7 {
    width: calc(var(--spacer) / 7);
  }
  .xl-m-2-1 {
    margin: calc(var(--spacer) * 2);
  }
  .xl-mt-2-1 {
    margin-top: calc(var(--spacer) * 2);
  }
  .xl-mb-2-1 {
    margin-bottom: calc(var(--spacer) * 2);
  }
  .xl-ml-2-1 {
    margin-left: calc(var(--spacer) * 2);
  }
  .xl-mr-2-1 {
    margin-right: calc(var(--spacer) * 2);
  }
  .xl-mx-2-1 {
    margin-left: calc(var(--spacer) * 2);
    margin-right: calc(var(--spacer) * 2);
  }
  .xl-my-2-1 {
    margin-top: calc(var(--spacer) * 2);
    margin-bottom: calc(var(--spacer) * 2);
  }
  .xl-p-2-1 {
    padding: calc(var(--spacer) * 2);
  }
  .xl-pt-2-1 {
    padding-top: calc(var(--spacer) * 2);
  }
  .xl-pb-2-1 {
    padding-bottom: calc(var(--spacer) * 2);
  }
  .xl-pl-2-1 {
    padding-left: calc(var(--spacer) * 2);
  }
  .xl-pr-2-1 {
    padding-right: calc(var(--spacer) * 2);
  }
  .xl-px-2-1 {
    padding-left: calc(var(--spacer) * 2);
    padding-right: calc(var(--spacer) * 2);
  }
  .xl-py-2-1 {
    padding-top: calc(var(--spacer) * 2);
    padding-bottom: calc(var(--spacer) * 2);
  }
  .xl-h-2-1 {
    height: calc(var(--spacer) * 2);
  }
  .xl-w-2-1 {
    width: calc(var(--spacer) * 2);
  }
  .xl-m-3-1 {
    margin: calc(var(--spacer) * 3);
  }
  .xl-mt-3-1 {
    margin-top: calc(var(--spacer) * 3);
  }
  .xl-mb-3-1 {
    margin-bottom: calc(var(--spacer) * 3);
  }
  .xl-ml-3-1 {
    margin-left: calc(var(--spacer) * 3);
  }
  .xl-mr-3-1 {
    margin-right: calc(var(--spacer) * 3);
  }
  .xl-mx-3-1 {
    margin-left: calc(var(--spacer) * 3);
    margin-right: calc(var(--spacer) * 3);
  }
  .xl-my-3-1 {
    margin-top: calc(var(--spacer) * 3);
    margin-bottom: calc(var(--spacer) * 3);
  }
  .xl-p-3-1 {
    padding: calc(var(--spacer) * 3);
  }
  .xl-pt-3-1 {
    padding-top: calc(var(--spacer) * 3);
  }
  .xl-pb-3-1 {
    padding-bottom: calc(var(--spacer) * 3);
  }
  .xl-pl-3-1 {
    padding-left: calc(var(--spacer) * 3);
  }
  .xl-pr-3-1 {
    padding-right: calc(var(--spacer) * 3);
  }
  .xl-px-3-1 {
    padding-left: calc(var(--spacer) * 3);
    padding-right: calc(var(--spacer) * 3);
  }
  .xl-py-3-1 {
    padding-top: calc(var(--spacer) * 3);
    padding-bottom: calc(var(--spacer) * 3);
  }
  .xl-h-3-1 {
    height: calc(var(--spacer) * 3);
  }
  .xl-w-3-1 {
    width: calc(var(--spacer) * 3);
  }
  .xl-m-4-1 {
    margin: calc(var(--spacer) * 4);
  }
  .xl-mt-4-1 {
    margin-top: calc(var(--spacer) * 4);
  }
  .xl-mb-4-1 {
    margin-bottom: calc(var(--spacer) * 4);
  }
  .xl-ml-4-1 {
    margin-left: calc(var(--spacer) * 4);
  }
  .xl-mr-4-1 {
    margin-right: calc(var(--spacer) * 4);
  }
  .xl-mx-4-1 {
    margin-left: calc(var(--spacer) * 4);
    margin-right: calc(var(--spacer) * 4);
  }
  .xl-my-4-1 {
    margin-top: calc(var(--spacer) * 4);
    margin-bottom: calc(var(--spacer) * 4);
  }
  .xl-p-4-1 {
    padding: calc(var(--spacer) * 4);
  }
  .xl-pt-4-1 {
    padding-top: calc(var(--spacer) * 4);
  }
  .xl-pb-4-1 {
    padding-bottom: calc(var(--spacer) * 4);
  }
  .xl-pl-4-1 {
    padding-left: calc(var(--spacer) * 4);
  }
  .xl-pr-4-1 {
    padding-right: calc(var(--spacer) * 4);
  }
  .xl-px-4-1 {
    padding-left: calc(var(--spacer) * 4);
    padding-right: calc(var(--spacer) * 4);
  }
  .xl-py-4-1 {
    padding-top: calc(var(--spacer) * 4);
    padding-bottom: calc(var(--spacer) * 4);
  }
  .xl-h-4-1 {
    height: calc(var(--spacer) * 4);
  }
  .xl-w-4-1 {
    width: calc(var(--spacer) * 4);
  }
  .xl-m-0 {
    margin: 0;
  }
  .xl-mt-0 {
    margin-top: 0;
  }
  .xl-mb-0 {
    margin-bottom: 0;
  }
  .xl-ml-0 {
    margin-left: 0;
  }
  .xl-mr-0 {
    margin-right: 0;
  }
  .xl-mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .xl-my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .xl-p-0 {
    padding: 0;
  }
  .xl-pt-0 {
    padding-top: 0;
  }
  .xl-pb-0 {
    padding-bottom: 0;
  }
  .xl-pl-0 {
    padding-left: 0;
  }
  .xl-pr-0 {
    padding-right: 0;
  }
  .xl-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .xl-py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .xl-h-0 {
    height: 0;
  }
  .xl-w-0 {
    width: 0;
  }
  .xl-grid__gutter--3-1 {
    margin-left: calc(var(--gutter) * -3);
    margin-right: calc(var(--gutter) * -3);
  }
  .xl-grid__gutter--3-1 > * {
    padding-left: calc(var(--gutter) * 3);
    padding-right: calc(var(--gutter) * 3);
  }
  .xl-grid__gutter--2-1 {
    margin-left: calc(var(--gutter) * -2);
    margin-right: calc(var(--gutter) * -2);
  }
  .xl-grid__gutter--2-1 > * {
    padding-left: calc(var(--gutter) * 2);
    padding-right: calc(var(--gutter) * 2);
  }
  .xl-grid__gutter {
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
  }
  .xl-grid__gutter > * {
    padding-left: calc(var(--gutter) * 1);
    padding-right: calc(var(--gutter) * 1);
  }
  .xl-grid__gutter--1-2 {
    margin-left: calc(var(--gutter) * -0.5);
    margin-right: calc(var(--gutter) * -0.5);
  }
  .xl-grid__gutter--1-2 > * {
    padding-left: calc(var(--gutter) * 0.5);
    padding-right: calc(var(--gutter) * 0.5);
  }
  .xl-grid__gutter--1-3 {
    margin-left: calc(var(--gutter) * -0.333);
    margin-right: calc(var(--gutter) * -0.333);
  }
  .xl-grid__gutter--1-3 > * {
    padding-left: calc(var(--gutter) * 0.333);
    padding-right: calc(var(--gutter) * 0.333);
  }
  .xl-grid__gutter--1-4 {
    margin-left: calc(var(--gutter) * -0.25);
    margin-right: calc(var(--gutter) * -0.25);
  }
  .xl-grid__gutter--1-4 > * {
    padding-left: calc(var(--gutter) * 0.25);
    padding-right: calc(var(--gutter) * 0.25);
  }
  .xl-row__row--12 {
    min-height: calc(var(--vh) * 100 / 12 * 12);
  }
  .xl-row__row--11 {
    min-height: calc(var(--vh) * 100 / 12 * 11);
  }
  .xl-row__row--10 {
    min-height: calc(var(--vh) * 100 / 12 * 10);
  }
  .xl-row__row--9 {
    min-height: calc(var(--vh) * 100 / 12 * 9);
  }
  .xl-row__row--8 {
    min-height: calc(var(--vh) * 100 / 12 * 8);
  }
  .xl-row__row--7 {
    min-height: calc(var(--vh) * 100 / 12 * 7);
  }
  .xl-row__row--6 {
    min-height: calc(var(--vh) * 100 / 12 * 6);
  }
  .xl-row__row--5 {
    min-height: calc(var(--vh) * 100 / 12 * 5);
  }
  .xl-row__row--4 {
    min-height: calc(var(--vh) * 100 / 12 * 4);
  }
  .xl-row__row--3 {
    min-height: calc(var(--vh) * 100 / 12 * 3);
  }
  .xl-row__row--2 {
    min-height: calc(var(--vh) * 100 / 12 * 2);
  }
  .xl-row__row--1 {
    min-height: calc(var(--vh) * 100 / 12 * 1);
  }
  .xl-col__col--12 {
    flex: 0 0 calc(100% * 12 / 12);
    max-width: calc(100% * 12 / 12);
  }
  .xl-col__col--11 {
    flex: 0 0 calc(100% * 11 / 12);
    max-width: calc(100% * 11 / 12);
  }
  .xl-col__col--10 {
    flex: 0 0 calc(100% * 10 / 12);
    max-width: calc(100% * 10 / 12);
  }
  .xl-col__col--9 {
    flex: 0 0 calc(100% * 9 / 12);
    max-width: calc(100% * 9 / 12);
  }
  .xl-col__col--8 {
    flex: 0 0 calc(100% * 8 / 12);
    max-width: calc(100% * 8 / 12);
  }
  .xl-col__col--7 {
    flex: 0 0 calc(100% * 7 / 12);
    max-width: calc(100% * 7 / 12);
  }
  .xl-col__col--6 {
    flex: 0 0 calc(100% * 6 / 12);
    max-width: calc(100% * 6 / 12);
  }
  .xl-col__col--5 {
    flex: 0 0 calc(100% * 5 / 12);
    max-width: calc(100% * 5 / 12);
  }
  .xl-col__col--4 {
    flex: 0 0 calc(100% * 4 / 12);
    max-width: calc(100% * 4 / 12);
  }
  .xl-col__col--3 {
    flex: 0 0 calc(100% * 3 / 12);
    max-width: calc(100% * 3 / 12);
  }
  .xl-col__col--2 {
    flex: 0 0 calc(100% * 2 / 12);
    max-width: calc(100% * 2 / 12);
  }
  .xl-col__col--1 {
    flex: 0 0 calc(100% * 1 / 12);
    max-width: calc(100% * 1 / 12);
  }
  .xl-flex__row, .xl-flex__column {
    display: flex;
    flex-wrap: wrap;
  }
  .xl-flex__row > *, .xl-flex__column > * {
    flex-grow: 0;
  }
  .xl-flex__row {
    flex-direction: row;
  }
  .xl-flex__row-reverse {
    flex-direction: row-reverse;
  }
  .xl-flex__column {
    flex-direction: column;
  }
  .xl-flex__column-reverse {
    flex-direction: column-reverse;
  }
  .xl-flex__nowrap {
    flex-wrap: nowrap;
  }
  .xl-flex__wrap {
    flex-wrap: wrap;
  }
  .xl-flex__align-items--center {
    align-items: center;
  }
  .xl-flex__align-items--start {
    align-items: flex-start;
  }
  .xl-flex__align-items--end {
    align-items: flex-end;
  }
  .xl-flex__align-items--stretch {
    align-items: stretch;
  }
  .xl-flex__justify-content--center {
    justify-content: center;
  }
  .xl-flex__justify-content--start {
    justify-content: flex-start;
  }
  .xl-flex__justify-content--end {
    justify-content: flex-end;
  }
  .xl-flex__justify-content--spacein {
    justify-content: space-between;
  }
  .xl-flex__justify-content--spaceout {
    justify-content: space-around;
  }
  .xl-flex__align-self--center {
    align-self: center;
  }
  .xl-flex__align-self--start {
    align-self: flex-start;
  }
  .xl-flex__align-self--end {
    align-self: flex-end;
  }
  .xl-flex__align-self--stretch {
    align-self: stretch;
  }
  .xl-flex__align-self--selfstart {
    align-self: self-start;
  }
  .xl-flex__align-self--selfend {
    align-self: self-end;
  }
  .xl-flex__justify-self--center {
    justify-self: center;
  }
  .xl-flex__justify-self--start {
    justify-self: flex-start;
  }
  .xl-flex__justify-self--end {
    justify-self: flex-end;
  }
  .xl-flex__justify-self--stretch {
    justify-self: stretch;
  }
  .xl-flex__justify-self--selfstart {
    justify-self: self-start;
  }
  .xl-flex__justify-self--selfend {
    justify-self: self-end;
  }
  .xl-flex__justify-self--left {
    justify-self: left;
  }
  .xl-flex__justify-self--right {
    justify-self: right;
  }
  .xl-flex__flex-grow--1 {
    flex-grow: 1;
  }
  .xl-flex__flex-grow--2 {
    flex-grow: 2;
  }
  .xl-flex__flex-grow--3 {
    flex-grow: 3;
  }
  .xl-flex__flex-grow--4 {
    flex-grow: 4;
  }
  .xl-flex__flex-grow--5 {
    flex-grow: 5;
  }
  .xl-flex__flex-grow--6 {
    flex-grow: 6;
  }
  .xl-flex__flex-grow--7 {
    flex-grow: 7;
  }
  .xl-flex__flex-grow--8 {
    flex-grow: 8;
  }
  .xl-flex__flex-grow--9 {
    flex-grow: 9;
  }
  .xl-flex__flex-grow--10 {
    flex-grow: 10;
  }
  .xl-display__flex {
    display: flex;
  }
  .xl-display__inline {
    display: inline;
  }
  .xl-display__inline-block {
    display: inline-block;
  }
  .xl-display__block {
    display: block;
  }
  .xl-position__absolute {
    position: absolute;
  }
  .xl-position__fixed {
    position: fixed;
  }
  .xl-position__inherit {
    position: inherit;
  }
  .xl-position__relative {
    position: relative;
  }
  .xl-position__sticky {
    position: sticky;
  }
  .xl-position__top--0 {
    top: 0;
  }
  .xl-position__top--inherit {
    top: inherit;
  }
  .xl-position__left--0 {
    left: 0;
  }
  .xl-position__left--inherit {
    left: inherit;
  }
  .xl-position__right--0 {
    right: 0;
  }
  .xl-position__right--inherit {
    right: inherit;
  }
  .xl-position__bottom--0 {
    bottom: 0;
  }
  .xl-position__bottom--inherit {
    bottom: inherit;
  }
  [xl*=text-center] {
    text-align: center;
  }
  [xl*=text-left] {
    text-align: left;
  }
  [xl*=text-right] {
    text-align: right;
  }
  [xl*=text-justify] {
    text-align: justify;
  }
}
.video-16-9,
.video-container {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  background-color: black;
  /*get-color(third, 500);*/
  border-radius: calc(var(--spacer) * 0.5);
  overflow: hidden;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .video-16-9,
  .video-container {
    border-radius: calc(var(--spacer) * 0.5);
    overflow: hidden;
  }
}

.video-button-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.video-button-wrapper button {
  pointer-events: all;
  border-radius: 50%;
  background-clip: content-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  text-align: center;
  cursor: pointer;
  border: 3px solid rgba(var(--color-accent-500), 1);
  width: calc(var(--spacer) * 2.25);
  height: calc(var(--spacer) * 2.25);
  padding: calc(var(--spacer) * 0.333);
}
.video-button-wrapper button:hover {
  background-color: rgba(var(--color-accent-500), 1);
  background-clip: border-box;
  border-color: rgba(var(--color-accent-500), 1);
}
.video-button-wrapper button:hover path {
  fill: #fff;
}
.video-button-wrapper button:hover {
  transition: background-color 0.3s ease 0s;
}
.video-button-wrapper button.icon-pause, .video-button-wrapper button.icon-pause + button {
  opacity: 0;
  pointer-events: none;
}
.video-button-wrapper button svg {
  margin-right: calc(var(--spacer) * -0.15);
  width: calc(var(--spacer) * 0.666);
  height: calc(var(--spacer) * 0.666);
}

code {
  background-color: rgba(var(--color-primary-400), 1);
  color: rgb(var(--color-primary-contrast-400));
  border-radius: calc(var(--spacer) * 0.25);
  padding: calc(var(--spacer) * 0.1) calc(var(--spacer) * 0.25);
  font-size: 0.9em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}

:root {
  --color-table-bg:white;
  --color-table-text: rgba(var(--color-primary-500), 1);
  --color-table-border: rgba(var(--color-primary-500), 1);
  --color-table-bg-alt: rgba(var(--color-primary-100), 1);
  --color-table-text-alt: rgb(var(--color-primary-contrast-100));
  --color-table-hover-bg: rgba(var(--color-primary-600), 1);
  --color-table-hover-text: rgb(var(--color-primary-contrast-600));
  --color-table-dark-bg: rgba(var(--color-primary-500), 1);
  --color-table-dark-text: rgb(var(--color-primary-contrast-500));
  --color-table-dark-border: rgb(var(--color-primary-contrast-500));
  --color-table-dark-bg-alt: rgba(var(--color-primary-500), 1);
  --color-table-dark-text-alt: rgb(var(--color-primary-contrast-500));
  --color-table-dark-hover-bg: rgba(var(--color-primary-600), 1);
  --color-table-dark-hover-text: rgb(var(--color-primary-contrast-600));
}

.table {
  width: 100%;
  margin-bottom: 1rem;
  color: var(--color-table-text);
}
.table th,
.table td {
  padding: calc(var(--spacer) * 0.33);
  vertical-align: middle;
  text-align: left;
  border-top: 1px solid var(--color-table-border);
  background-color: var(--color-table-bg);
}
.table thead th {
  vertical-align: middle;
  border-bottom: 2px solid var(--color-table-border);
  font-weight: bold;
}
.table tbody + tbody {
  border-top: 2px solid var(--color-table-border);
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: var(--color-table-bg-alt);
  color: var(--color-table-text-alt);
}

.table-hover tbody tr:hover td {
  background-color: var(--color-table-hover-bg);
  color: var(--color-table-hover-text);
  border-color: var(--color-table-hover-text);
}

.table-bordered {
  border: 1px solid var(--color-table-border);
}
.table-bordered th,
.table-bordered td {
  border: 1px solid var(--color-table-border);
}

.table-sm th,
.table-sm td {
  padding: calc(var(--spacer) * 0.125);
  font-size: 0.9em;
}

.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-dark th,
.table-dark td,
.table-dark thead th {
  border-color: var(--color-table-dark-border);
  color: var(--color-table-dark-text);
  background-color: var(--color-table-dark-bg);
}
.table-dark tbody + tbody {
  border-top: 2px solid var(--color-table-dark-border);
}
.table-dark .table-striped tbody tr:nth-of-type(odd) {
  background-color: var(--color-table-dark-bg-alt);
  color: var(--color-table-dark-text-alt);
}
.table-dark .table-hover tbody tr:hover {
  background-color: var(--color-table-dark-hover-bg);
  color: var(--color-table-dark-hover-text);
}

.btn, button {
  position: relative;
  z-index: 1;
  text-align: center;
  cursor: pointer;
  outline: none;
  font-weight: 700;
  display: inline-flex;
  font-family: var(--text-font-default);
  line-height: 1.4;
  border: 2px solid;
  border-radius: calc(var(--spacer) * 0.25);
  margin: calc(var(--spacer) * 0.1) 0;
  font-size: 1em;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s ease 0s;
  padding: calc(var(--spacer) * 0.4) calc(var(--spacer) * 1);
  font-size: 1em;
}
.btn .material-icons, button .material-icons {
  font-size: 1.5em;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .btn, button {
    padding: calc(var(--spacer) * 0.25) calc(var(--spacer) * 0.25);
    font-size: 0.9em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .btn, button {
    padding: calc(var(--spacer) * 0.25) calc(var(--spacer) * 0.25);
    font-size: 0.9em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .btn, button {
    padding: calc(var(--spacer) * 0.25) calc(var(--spacer) * 0.25);
    font-size: 0.9em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .btn, button {
    padding: calc(var(--spacer) * 0.25) calc(var(--spacer) * 0.25);
    font-size: 0.9em;
  }
}
.btn:hover, button:hover {
  transition: all 0.3s ease 0s;
  background: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  color: white;
  border-color: rgba(var(--color-primary-500), 1);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}
.btn:disabled, button:disabled {
  pointer-events: none;
}
.btn:disabled:after, button:disabled:after {
  background: rgba(var(--color-lgray-500), 1);
}
.btn[class*=btn-outline-], button[class*=btn-outline-] {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  margin: calc(var(--spacer) * 0.25) 0;
  border-style: solid;
  border-width: 2px;
}
.btn [class*=icons], button [class*=icons] {
  margin-right: calc(var(--spacer) * 0.25);
}
.btn svg:last-child, button svg:last-child {
  margin-left: calc(var(--spacer) * 0.25);
}
.btn svg:first-child, button svg:first-child {
  margin-right: calc(var(--spacer) * 0.25);
}
.btn.btn-primary-100, button.btn-primary-100 {
  background-color: rgba(var(--color-primary-100), 1);
  color: rgb(var(--color-primary-contrast-100));
  border-color: rgba(var(--color-primary-100), 1);
}
.btn.btn-primary-100:hover, button.btn-primary-100:hover {
  background-color: rgba(var(--color-primary-200), 1);
  color: rgb(var(--color-primary-contrast-200));
  border-color: rgba(var(--color-primary-200), 1);
}
.btn.btn-outline-primary-100, button.btn-outline-primary-100 {
  border-color: rgba(var(--color-primary-100), 1);
  color: rgba(var(--color-primary-100), 1);
}
.btn.btn-outline-primary-100:hover, button.btn-outline-primary-100:hover {
  color: rgba(var(--color-primary-200), 1);
  border-color: rgba(var(--color-primary-200), 1);
}
.btn.btn-primary-200, button.btn-primary-200 {
  background-color: rgba(var(--color-primary-200), 1);
  color: rgb(var(--color-primary-contrast-200));
  border-color: rgba(var(--color-primary-200), 1);
}
.btn.btn-primary-200:hover, button.btn-primary-200:hover {
  background-color: rgba(var(--color-primary-300), 1);
  color: rgb(var(--color-primary-contrast-300));
  border-color: rgba(var(--color-primary-300), 1);
}
.btn.btn-outline-primary-200, button.btn-outline-primary-200 {
  border-color: rgba(var(--color-primary-200), 1);
  color: rgba(var(--color-primary-200), 1);
}
.btn.btn-outline-primary-200:hover, button.btn-outline-primary-200:hover {
  color: rgba(var(--color-primary-300), 1);
  border-color: rgba(var(--color-primary-300), 1);
}
.btn.btn-primary-300, button.btn-primary-300 {
  background-color: rgba(var(--color-primary-300), 1);
  color: rgb(var(--color-primary-contrast-300));
  border-color: rgba(var(--color-primary-300), 1);
}
.btn.btn-primary-300:hover, button.btn-primary-300:hover {
  background-color: rgba(var(--color-primary-400), 1);
  color: rgb(var(--color-primary-contrast-400));
  border-color: rgba(var(--color-primary-400), 1);
}
.btn.btn-outline-primary-300, button.btn-outline-primary-300 {
  border-color: rgba(var(--color-primary-300), 1);
  color: rgba(var(--color-primary-300), 1);
}
.btn.btn-outline-primary-300:hover, button.btn-outline-primary-300:hover {
  color: rgba(var(--color-primary-400), 1);
  border-color: rgba(var(--color-primary-400), 1);
}
.btn.btn-primary-400, button.btn-primary-400 {
  background-color: rgba(var(--color-primary-400), 1);
  color: rgb(var(--color-primary-contrast-400));
  border-color: rgba(var(--color-primary-400), 1);
}
.btn.btn-primary-400:hover, button.btn-primary-400:hover {
  background-color: rgba(var(--color-primary-500), 1);
  color: rgb(var(--color-primary-contrast-500));
  border-color: rgba(var(--color-primary-500), 1);
}
.btn.btn-outline-primary-400, button.btn-outline-primary-400 {
  border-color: rgba(var(--color-primary-400), 1);
  color: rgba(var(--color-primary-400), 1);
}
.btn.btn-outline-primary-400:hover, button.btn-outline-primary-400:hover {
  color: rgba(var(--color-primary-500), 1);
  border-color: rgba(var(--color-primary-500), 1);
}
.btn.btn-primary-500, button.btn-primary-500 {
  background-color: rgba(var(--color-primary-500), 1);
  color: rgb(var(--color-primary-contrast-500));
  border-color: rgba(var(--color-primary-500), 1);
}
.btn.btn-primary-500:hover, button.btn-primary-500:hover {
  background-color: rgba(var(--color-primary-600), 1);
  color: rgb(var(--color-primary-contrast-600));
  border-color: rgba(var(--color-primary-600), 1);
}
.btn.btn-outline-primary-500, button.btn-outline-primary-500 {
  border-color: rgba(var(--color-primary-500), 1);
  color: rgba(var(--color-primary-500), 1);
}
.btn.btn-outline-primary-500:hover, button.btn-outline-primary-500:hover {
  color: rgba(var(--color-primary-600), 1);
  border-color: rgba(var(--color-primary-600), 1);
}
.btn.btn-primary-600, button.btn-primary-600 {
  background-color: rgba(var(--color-primary-600), 1);
  color: rgb(var(--color-primary-contrast-600));
  border-color: rgba(var(--color-primary-600), 1);
}
.btn.btn-primary-600:hover, button.btn-primary-600:hover {
  background-color: rgba(var(--color-primary-700), 1);
  color: rgb(var(--color-primary-contrast-700));
  border-color: rgba(var(--color-primary-700), 1);
}
.btn.btn-outline-primary-600, button.btn-outline-primary-600 {
  border-color: rgba(var(--color-primary-600), 1);
  color: rgba(var(--color-primary-600), 1);
}
.btn.btn-outline-primary-600:hover, button.btn-outline-primary-600:hover {
  color: rgba(var(--color-primary-700), 1);
  border-color: rgba(var(--color-primary-700), 1);
}
.btn.btn-primary-700, button.btn-primary-700 {
  background-color: rgba(var(--color-primary-700), 1);
  color: rgb(var(--color-primary-contrast-700));
  border-color: rgba(var(--color-primary-700), 1);
}
.btn.btn-primary-700:hover, button.btn-primary-700:hover {
  background-color: rgba(var(--color-primary-800), 1);
  color: rgb(var(--color-primary-contrast-800));
  border-color: rgba(var(--color-primary-800), 1);
}
.btn.btn-outline-primary-700, button.btn-outline-primary-700 {
  border-color: rgba(var(--color-primary-700), 1);
  color: rgba(var(--color-primary-700), 1);
}
.btn.btn-outline-primary-700:hover, button.btn-outline-primary-700:hover {
  color: rgba(var(--color-primary-800), 1);
  border-color: rgba(var(--color-primary-800), 1);
}
.btn.btn-primary-800, button.btn-primary-800 {
  background-color: rgba(var(--color-primary-800), 1);
  color: rgb(var(--color-primary-contrast-800));
  border-color: rgba(var(--color-primary-800), 1);
}
.btn.btn-primary-800:hover, button.btn-primary-800:hover {
  background-color: rgba(var(--color-primary-900), 1);
  color: rgb(var(--color-primary-contrast-900));
  border-color: rgba(var(--color-primary-900), 1);
}
.btn.btn-outline-primary-800, button.btn-outline-primary-800 {
  border-color: rgba(var(--color-primary-800), 1);
  color: rgba(var(--color-primary-800), 1);
}
.btn.btn-outline-primary-800:hover, button.btn-outline-primary-800:hover {
  color: rgba(var(--color-primary-900), 1);
  border-color: rgba(var(--color-primary-900), 1);
}
.btn.btn-primary-900, button.btn-primary-900 {
  background-color: rgba(var(--color-primary-900), 1);
  color: rgb(var(--color-primary-contrast-900));
  border-color: rgba(var(--color-primary-900), 1);
}
.btn.btn-primary-900:hover, button.btn-primary-900:hover {
  background-color: rgba(var(--color-primary-1000), 1);
  color: rgb(var(--color-primary-contrast-1000));
  border-color: rgba(var(--color-primary-1000), 1);
}
.btn.btn-outline-primary-900, button.btn-outline-primary-900 {
  border-color: rgba(var(--color-primary-900), 1);
  color: rgba(var(--color-primary-900), 1);
}
.btn.btn-outline-primary-900:hover, button.btn-outline-primary-900:hover {
  color: rgba(var(--color-primary-1000), 1);
  border-color: rgba(var(--color-primary-1000), 1);
}
.btn.btn-secondary-100, button.btn-secondary-100 {
  background-color: rgba(var(--color-secondary-100), 1);
  color: rgb(var(--color-secondary-contrast-100));
  border-color: rgba(var(--color-secondary-100), 1);
}
.btn.btn-secondary-100:hover, button.btn-secondary-100:hover {
  background-color: rgba(var(--color-secondary-200), 1);
  color: rgb(var(--color-secondary-contrast-200));
  border-color: rgba(var(--color-secondary-200), 1);
}
.btn.btn-outline-secondary-100, button.btn-outline-secondary-100 {
  border-color: rgba(var(--color-secondary-100), 1);
  color: rgba(var(--color-secondary-100), 1);
}
.btn.btn-outline-secondary-100:hover, button.btn-outline-secondary-100:hover {
  color: rgba(var(--color-secondary-200), 1);
  border-color: rgba(var(--color-secondary-200), 1);
}
.btn.btn-secondary-200, button.btn-secondary-200 {
  background-color: rgba(var(--color-secondary-200), 1);
  color: rgb(var(--color-secondary-contrast-200));
  border-color: rgba(var(--color-secondary-200), 1);
}
.btn.btn-secondary-200:hover, button.btn-secondary-200:hover {
  background-color: rgba(var(--color-secondary-300), 1);
  color: rgb(var(--color-secondary-contrast-300));
  border-color: rgba(var(--color-secondary-300), 1);
}
.btn.btn-outline-secondary-200, button.btn-outline-secondary-200 {
  border-color: rgba(var(--color-secondary-200), 1);
  color: rgba(var(--color-secondary-200), 1);
}
.btn.btn-outline-secondary-200:hover, button.btn-outline-secondary-200:hover {
  color: rgba(var(--color-secondary-300), 1);
  border-color: rgba(var(--color-secondary-300), 1);
}
.btn.btn-secondary-300, button.btn-secondary-300 {
  background-color: rgba(var(--color-secondary-300), 1);
  color: rgb(var(--color-secondary-contrast-300));
  border-color: rgba(var(--color-secondary-300), 1);
}
.btn.btn-secondary-300:hover, button.btn-secondary-300:hover {
  background-color: rgba(var(--color-secondary-400), 1);
  color: rgb(var(--color-secondary-contrast-400));
  border-color: rgba(var(--color-secondary-400), 1);
}
.btn.btn-outline-secondary-300, button.btn-outline-secondary-300 {
  border-color: rgba(var(--color-secondary-300), 1);
  color: rgba(var(--color-secondary-300), 1);
}
.btn.btn-outline-secondary-300:hover, button.btn-outline-secondary-300:hover {
  color: rgba(var(--color-secondary-400), 1);
  border-color: rgba(var(--color-secondary-400), 1);
}
.btn.btn-secondary-400, button.btn-secondary-400 {
  background-color: rgba(var(--color-secondary-400), 1);
  color: rgb(var(--color-secondary-contrast-400));
  border-color: rgba(var(--color-secondary-400), 1);
}
.btn.btn-secondary-400:hover, button.btn-secondary-400:hover {
  background-color: rgba(var(--color-secondary-500), 1);
  color: rgb(var(--color-secondary-contrast-500));
  border-color: rgba(var(--color-secondary-500), 1);
}
.btn.btn-outline-secondary-400, button.btn-outline-secondary-400 {
  border-color: rgba(var(--color-secondary-400), 1);
  color: rgba(var(--color-secondary-400), 1);
}
.btn.btn-outline-secondary-400:hover, button.btn-outline-secondary-400:hover {
  color: rgba(var(--color-secondary-500), 1);
  border-color: rgba(var(--color-secondary-500), 1);
}
.btn.btn-secondary-500, button.btn-secondary-500 {
  background-color: rgba(var(--color-secondary-500), 1);
  color: rgb(var(--color-secondary-contrast-500));
  border-color: rgba(var(--color-secondary-500), 1);
}
.btn.btn-secondary-500:hover, button.btn-secondary-500:hover {
  background-color: rgba(var(--color-secondary-600), 1);
  color: rgb(var(--color-secondary-contrast-600));
  border-color: rgba(var(--color-secondary-600), 1);
}
.btn.btn-outline-secondary-500, button.btn-outline-secondary-500 {
  border-color: rgba(var(--color-secondary-500), 1);
  color: rgba(var(--color-secondary-500), 1);
}
.btn.btn-outline-secondary-500:hover, button.btn-outline-secondary-500:hover {
  color: rgba(var(--color-secondary-600), 1);
  border-color: rgba(var(--color-secondary-600), 1);
}
.btn.btn-secondary-600, button.btn-secondary-600 {
  background-color: rgba(var(--color-secondary-600), 1);
  color: rgb(var(--color-secondary-contrast-600));
  border-color: rgba(var(--color-secondary-600), 1);
}
.btn.btn-secondary-600:hover, button.btn-secondary-600:hover {
  background-color: rgba(var(--color-secondary-700), 1);
  color: rgb(var(--color-secondary-contrast-700));
  border-color: rgba(var(--color-secondary-700), 1);
}
.btn.btn-outline-secondary-600, button.btn-outline-secondary-600 {
  border-color: rgba(var(--color-secondary-600), 1);
  color: rgba(var(--color-secondary-600), 1);
}
.btn.btn-outline-secondary-600:hover, button.btn-outline-secondary-600:hover {
  color: rgba(var(--color-secondary-700), 1);
  border-color: rgba(var(--color-secondary-700), 1);
}
.btn.btn-secondary-700, button.btn-secondary-700 {
  background-color: rgba(var(--color-secondary-700), 1);
  color: rgb(var(--color-secondary-contrast-700));
  border-color: rgba(var(--color-secondary-700), 1);
}
.btn.btn-secondary-700:hover, button.btn-secondary-700:hover {
  background-color: rgba(var(--color-secondary-800), 1);
  color: rgb(var(--color-secondary-contrast-800));
  border-color: rgba(var(--color-secondary-800), 1);
}
.btn.btn-outline-secondary-700, button.btn-outline-secondary-700 {
  border-color: rgba(var(--color-secondary-700), 1);
  color: rgba(var(--color-secondary-700), 1);
}
.btn.btn-outline-secondary-700:hover, button.btn-outline-secondary-700:hover {
  color: rgba(var(--color-secondary-800), 1);
  border-color: rgba(var(--color-secondary-800), 1);
}
.btn.btn-secondary-800, button.btn-secondary-800 {
  background-color: rgba(var(--color-secondary-800), 1);
  color: rgb(var(--color-secondary-contrast-800));
  border-color: rgba(var(--color-secondary-800), 1);
}
.btn.btn-secondary-800:hover, button.btn-secondary-800:hover {
  background-color: rgba(var(--color-secondary-900), 1);
  color: rgb(var(--color-secondary-contrast-900));
  border-color: rgba(var(--color-secondary-900), 1);
}
.btn.btn-outline-secondary-800, button.btn-outline-secondary-800 {
  border-color: rgba(var(--color-secondary-800), 1);
  color: rgba(var(--color-secondary-800), 1);
}
.btn.btn-outline-secondary-800:hover, button.btn-outline-secondary-800:hover {
  color: rgba(var(--color-secondary-900), 1);
  border-color: rgba(var(--color-secondary-900), 1);
}
.btn.btn-secondary-900, button.btn-secondary-900 {
  background-color: rgba(var(--color-secondary-900), 1);
  color: rgb(var(--color-secondary-contrast-900));
  border-color: rgba(var(--color-secondary-900), 1);
}
.btn.btn-secondary-900:hover, button.btn-secondary-900:hover {
  background-color: rgba(var(--color-secondary-1000), 1);
  color: rgb(var(--color-secondary-contrast-1000));
  border-color: rgba(var(--color-secondary-1000), 1);
}
.btn.btn-outline-secondary-900, button.btn-outline-secondary-900 {
  border-color: rgba(var(--color-secondary-900), 1);
  color: rgba(var(--color-secondary-900), 1);
}
.btn.btn-outline-secondary-900:hover, button.btn-outline-secondary-900:hover {
  color: rgba(var(--color-secondary-1000), 1);
  border-color: rgba(var(--color-secondary-1000), 1);
}
.btn.btn-third-100, button.btn-third-100 {
  background-color: rgba(var(--color-third-100), 1);
  color: rgb(var(--color-third-contrast-100));
  border-color: rgba(var(--color-third-100), 1);
}
.btn.btn-third-100:hover, button.btn-third-100:hover {
  background-color: rgba(var(--color-third-200), 1);
  color: rgb(var(--color-third-contrast-200));
  border-color: rgba(var(--color-third-200), 1);
}
.btn.btn-outline-third-100, button.btn-outline-third-100 {
  border-color: rgba(var(--color-third-100), 1);
  color: rgba(var(--color-third-100), 1);
}
.btn.btn-outline-third-100:hover, button.btn-outline-third-100:hover {
  color: rgba(var(--color-third-200), 1);
  border-color: rgba(var(--color-third-200), 1);
}
.btn.btn-third-200, button.btn-third-200 {
  background-color: rgba(var(--color-third-200), 1);
  color: rgb(var(--color-third-contrast-200));
  border-color: rgba(var(--color-third-200), 1);
}
.btn.btn-third-200:hover, button.btn-third-200:hover {
  background-color: rgba(var(--color-third-300), 1);
  color: rgb(var(--color-third-contrast-300));
  border-color: rgba(var(--color-third-300), 1);
}
.btn.btn-outline-third-200, button.btn-outline-third-200 {
  border-color: rgba(var(--color-third-200), 1);
  color: rgba(var(--color-third-200), 1);
}
.btn.btn-outline-third-200:hover, button.btn-outline-third-200:hover {
  color: rgba(var(--color-third-300), 1);
  border-color: rgba(var(--color-third-300), 1);
}
.btn.btn-third-300, button.btn-third-300 {
  background-color: rgba(var(--color-third-300), 1);
  color: rgb(var(--color-third-contrast-300));
  border-color: rgba(var(--color-third-300), 1);
}
.btn.btn-third-300:hover, button.btn-third-300:hover {
  background-color: rgba(var(--color-third-400), 1);
  color: rgb(var(--color-third-contrast-400));
  border-color: rgba(var(--color-third-400), 1);
}
.btn.btn-outline-third-300, button.btn-outline-third-300 {
  border-color: rgba(var(--color-third-300), 1);
  color: rgba(var(--color-third-300), 1);
}
.btn.btn-outline-third-300:hover, button.btn-outline-third-300:hover {
  color: rgba(var(--color-third-400), 1);
  border-color: rgba(var(--color-third-400), 1);
}
.btn.btn-third-400, button.btn-third-400 {
  background-color: rgba(var(--color-third-400), 1);
  color: rgb(var(--color-third-contrast-400));
  border-color: rgba(var(--color-third-400), 1);
}
.btn.btn-third-400:hover, button.btn-third-400:hover {
  background-color: rgba(var(--color-third-500), 1);
  color: rgb(var(--color-third-contrast-500));
  border-color: rgba(var(--color-third-500), 1);
}
.btn.btn-outline-third-400, button.btn-outline-third-400 {
  border-color: rgba(var(--color-third-400), 1);
  color: rgba(var(--color-third-400), 1);
}
.btn.btn-outline-third-400:hover, button.btn-outline-third-400:hover {
  color: rgba(var(--color-third-500), 1);
  border-color: rgba(var(--color-third-500), 1);
}
.btn.btn-third-500, button.btn-third-500 {
  background-color: rgba(var(--color-third-500), 1);
  color: rgb(var(--color-third-contrast-500));
  border-color: rgba(var(--color-third-500), 1);
}
.btn.btn-third-500:hover, button.btn-third-500:hover {
  background-color: rgba(var(--color-third-600), 1);
  color: rgb(var(--color-third-contrast-600));
  border-color: rgba(var(--color-third-600), 1);
}
.btn.btn-outline-third-500, button.btn-outline-third-500 {
  border-color: rgba(var(--color-third-500), 1);
  color: rgba(var(--color-third-500), 1);
}
.btn.btn-outline-third-500:hover, button.btn-outline-third-500:hover {
  color: rgba(var(--color-third-600), 1);
  border-color: rgba(var(--color-third-600), 1);
}
.btn.btn-third-600, button.btn-third-600 {
  background-color: rgba(var(--color-third-600), 1);
  color: rgb(var(--color-third-contrast-600));
  border-color: rgba(var(--color-third-600), 1);
}
.btn.btn-third-600:hover, button.btn-third-600:hover {
  background-color: rgba(var(--color-third-700), 1);
  color: rgb(var(--color-third-contrast-700));
  border-color: rgba(var(--color-third-700), 1);
}
.btn.btn-outline-third-600, button.btn-outline-third-600 {
  border-color: rgba(var(--color-third-600), 1);
  color: rgba(var(--color-third-600), 1);
}
.btn.btn-outline-third-600:hover, button.btn-outline-third-600:hover {
  color: rgba(var(--color-third-700), 1);
  border-color: rgba(var(--color-third-700), 1);
}
.btn.btn-third-700, button.btn-third-700 {
  background-color: rgba(var(--color-third-700), 1);
  color: rgb(var(--color-third-contrast-700));
  border-color: rgba(var(--color-third-700), 1);
}
.btn.btn-third-700:hover, button.btn-third-700:hover {
  background-color: rgba(var(--color-third-800), 1);
  color: rgb(var(--color-third-contrast-800));
  border-color: rgba(var(--color-third-800), 1);
}
.btn.btn-outline-third-700, button.btn-outline-third-700 {
  border-color: rgba(var(--color-third-700), 1);
  color: rgba(var(--color-third-700), 1);
}
.btn.btn-outline-third-700:hover, button.btn-outline-third-700:hover {
  color: rgba(var(--color-third-800), 1);
  border-color: rgba(var(--color-third-800), 1);
}
.btn.btn-third-800, button.btn-third-800 {
  background-color: rgba(var(--color-third-800), 1);
  color: rgb(var(--color-third-contrast-800));
  border-color: rgba(var(--color-third-800), 1);
}
.btn.btn-third-800:hover, button.btn-third-800:hover {
  background-color: rgba(var(--color-third-900), 1);
  color: rgb(var(--color-third-contrast-900));
  border-color: rgba(var(--color-third-900), 1);
}
.btn.btn-outline-third-800, button.btn-outline-third-800 {
  border-color: rgba(var(--color-third-800), 1);
  color: rgba(var(--color-third-800), 1);
}
.btn.btn-outline-third-800:hover, button.btn-outline-third-800:hover {
  color: rgba(var(--color-third-900), 1);
  border-color: rgba(var(--color-third-900), 1);
}
.btn.btn-third-900, button.btn-third-900 {
  background-color: rgba(var(--color-third-900), 1);
  color: rgb(var(--color-third-contrast-900));
  border-color: rgba(var(--color-third-900), 1);
}
.btn.btn-third-900:hover, button.btn-third-900:hover {
  background-color: rgba(var(--color-third-1000), 1);
  color: rgb(var(--color-third-contrast-1000));
  border-color: rgba(var(--color-third-1000), 1);
}
.btn.btn-outline-third-900, button.btn-outline-third-900 {
  border-color: rgba(var(--color-third-900), 1);
  color: rgba(var(--color-third-900), 1);
}
.btn.btn-outline-third-900:hover, button.btn-outline-third-900:hover {
  color: rgba(var(--color-third-1000), 1);
  border-color: rgba(var(--color-third-1000), 1);
}
.btn.btn-accent-100, button.btn-accent-100 {
  background-color: rgba(var(--color-accent-100), 1);
  color: rgb(var(--color-accent-contrast-100));
  border-color: rgba(var(--color-accent-100), 1);
}
.btn.btn-accent-100:hover, button.btn-accent-100:hover {
  background-color: rgba(var(--color-accent-200), 1);
  color: rgb(var(--color-accent-contrast-200));
  border-color: rgba(var(--color-accent-200), 1);
}
.btn.btn-outline-accent-100, button.btn-outline-accent-100 {
  border-color: rgba(var(--color-accent-100), 1);
  color: rgba(var(--color-accent-100), 1);
}
.btn.btn-outline-accent-100:hover, button.btn-outline-accent-100:hover {
  color: rgba(var(--color-accent-200), 1);
  border-color: rgba(var(--color-accent-200), 1);
}
.btn.btn-accent-200, button.btn-accent-200 {
  background-color: rgba(var(--color-accent-200), 1);
  color: rgb(var(--color-accent-contrast-200));
  border-color: rgba(var(--color-accent-200), 1);
}
.btn.btn-accent-200:hover, button.btn-accent-200:hover {
  background-color: rgba(var(--color-accent-300), 1);
  color: rgb(var(--color-accent-contrast-300));
  border-color: rgba(var(--color-accent-300), 1);
}
.btn.btn-outline-accent-200, button.btn-outline-accent-200 {
  border-color: rgba(var(--color-accent-200), 1);
  color: rgba(var(--color-accent-200), 1);
}
.btn.btn-outline-accent-200:hover, button.btn-outline-accent-200:hover {
  color: rgba(var(--color-accent-300), 1);
  border-color: rgba(var(--color-accent-300), 1);
}
.btn.btn-accent-300, button.btn-accent-300 {
  background-color: rgba(var(--color-accent-300), 1);
  color: rgb(var(--color-accent-contrast-300));
  border-color: rgba(var(--color-accent-300), 1);
}
.btn.btn-accent-300:hover, button.btn-accent-300:hover {
  background-color: rgba(var(--color-accent-400), 1);
  color: rgb(var(--color-accent-contrast-400));
  border-color: rgba(var(--color-accent-400), 1);
}
.btn.btn-outline-accent-300, button.btn-outline-accent-300 {
  border-color: rgba(var(--color-accent-300), 1);
  color: rgba(var(--color-accent-300), 1);
}
.btn.btn-outline-accent-300:hover, button.btn-outline-accent-300:hover {
  color: rgba(var(--color-accent-400), 1);
  border-color: rgba(var(--color-accent-400), 1);
}
.btn.btn-accent-400, button.btn-accent-400 {
  background-color: rgba(var(--color-accent-400), 1);
  color: rgb(var(--color-accent-contrast-400));
  border-color: rgba(var(--color-accent-400), 1);
}
.btn.btn-accent-400:hover, button.btn-accent-400:hover {
  background-color: rgba(var(--color-accent-500), 1);
  color: rgb(var(--color-accent-contrast-500));
  border-color: rgba(var(--color-accent-500), 1);
}
.btn.btn-outline-accent-400, button.btn-outline-accent-400 {
  border-color: rgba(var(--color-accent-400), 1);
  color: rgba(var(--color-accent-400), 1);
}
.btn.btn-outline-accent-400:hover, button.btn-outline-accent-400:hover {
  color: rgba(var(--color-accent-500), 1);
  border-color: rgba(var(--color-accent-500), 1);
}
.btn.btn-accent-500, button.btn-accent-500 {
  background-color: rgba(var(--color-accent-500), 1);
  color: rgb(var(--color-accent-contrast-500));
  border-color: rgba(var(--color-accent-500), 1);
}
.btn.btn-accent-500:hover, button.btn-accent-500:hover {
  background-color: rgba(var(--color-accent-600), 1);
  color: rgb(var(--color-accent-contrast-600));
  border-color: rgba(var(--color-accent-600), 1);
}
.btn.btn-outline-accent-500, button.btn-outline-accent-500 {
  border-color: rgba(var(--color-accent-500), 1);
  color: rgba(var(--color-accent-500), 1);
}
.btn.btn-outline-accent-500:hover, button.btn-outline-accent-500:hover {
  color: rgba(var(--color-accent-600), 1);
  border-color: rgba(var(--color-accent-600), 1);
}
.btn.btn-accent-600, button.btn-accent-600 {
  background-color: rgba(var(--color-accent-600), 1);
  color: rgb(var(--color-accent-contrast-600));
  border-color: rgba(var(--color-accent-600), 1);
}
.btn.btn-accent-600:hover, button.btn-accent-600:hover {
  background-color: rgba(var(--color-accent-700), 1);
  color: rgb(var(--color-accent-contrast-700));
  border-color: rgba(var(--color-accent-700), 1);
}
.btn.btn-outline-accent-600, button.btn-outline-accent-600 {
  border-color: rgba(var(--color-accent-600), 1);
  color: rgba(var(--color-accent-600), 1);
}
.btn.btn-outline-accent-600:hover, button.btn-outline-accent-600:hover {
  color: rgba(var(--color-accent-700), 1);
  border-color: rgba(var(--color-accent-700), 1);
}
.btn.btn-accent-700, button.btn-accent-700 {
  background-color: rgba(var(--color-accent-700), 1);
  color: rgb(var(--color-accent-contrast-700));
  border-color: rgba(var(--color-accent-700), 1);
}
.btn.btn-accent-700:hover, button.btn-accent-700:hover {
  background-color: rgba(var(--color-accent-800), 1);
  color: rgb(var(--color-accent-contrast-800));
  border-color: rgba(var(--color-accent-800), 1);
}
.btn.btn-outline-accent-700, button.btn-outline-accent-700 {
  border-color: rgba(var(--color-accent-700), 1);
  color: rgba(var(--color-accent-700), 1);
}
.btn.btn-outline-accent-700:hover, button.btn-outline-accent-700:hover {
  color: rgba(var(--color-accent-800), 1);
  border-color: rgba(var(--color-accent-800), 1);
}
.btn.btn-accent-800, button.btn-accent-800 {
  background-color: rgba(var(--color-accent-800), 1);
  color: rgb(var(--color-accent-contrast-800));
  border-color: rgba(var(--color-accent-800), 1);
}
.btn.btn-accent-800:hover, button.btn-accent-800:hover {
  background-color: rgba(var(--color-accent-900), 1);
  color: rgb(var(--color-accent-contrast-900));
  border-color: rgba(var(--color-accent-900), 1);
}
.btn.btn-outline-accent-800, button.btn-outline-accent-800 {
  border-color: rgba(var(--color-accent-800), 1);
  color: rgba(var(--color-accent-800), 1);
}
.btn.btn-outline-accent-800:hover, button.btn-outline-accent-800:hover {
  color: rgba(var(--color-accent-900), 1);
  border-color: rgba(var(--color-accent-900), 1);
}
.btn.btn-accent-900, button.btn-accent-900 {
  background-color: rgba(var(--color-accent-900), 1);
  color: rgb(var(--color-accent-contrast-900));
  border-color: rgba(var(--color-accent-900), 1);
}
.btn.btn-accent-900:hover, button.btn-accent-900:hover {
  background-color: rgba(var(--color-accent-1000), 1);
  color: rgb(var(--color-accent-contrast-1000));
  border-color: rgba(var(--color-accent-1000), 1);
}
.btn.btn-outline-accent-900, button.btn-outline-accent-900 {
  border-color: rgba(var(--color-accent-900), 1);
  color: rgba(var(--color-accent-900), 1);
}
.btn.btn-outline-accent-900:hover, button.btn-outline-accent-900:hover {
  color: rgba(var(--color-accent-1000), 1);
  border-color: rgba(var(--color-accent-1000), 1);
}
.btn.btn-lgray-100, button.btn-lgray-100 {
  background-color: rgba(var(--color-lgray-100), 1);
  color: rgb(var(--color-lgray-contrast-100));
  border-color: rgba(var(--color-lgray-100), 1);
}
.btn.btn-lgray-100:hover, button.btn-lgray-100:hover {
  background-color: rgba(var(--color-lgray-200), 1);
  color: rgb(var(--color-lgray-contrast-200));
  border-color: rgba(var(--color-lgray-200), 1);
}
.btn.btn-outline-lgray-100, button.btn-outline-lgray-100 {
  border-color: rgba(var(--color-lgray-100), 1);
  color: rgba(var(--color-lgray-100), 1);
}
.btn.btn-outline-lgray-100:hover, button.btn-outline-lgray-100:hover {
  color: rgba(var(--color-lgray-200), 1);
  border-color: rgba(var(--color-lgray-200), 1);
}
.btn.btn-lgray-200, button.btn-lgray-200 {
  background-color: rgba(var(--color-lgray-200), 1);
  color: rgb(var(--color-lgray-contrast-200));
  border-color: rgba(var(--color-lgray-200), 1);
}
.btn.btn-lgray-200:hover, button.btn-lgray-200:hover {
  background-color: rgba(var(--color-lgray-300), 1);
  color: rgb(var(--color-lgray-contrast-300));
  border-color: rgba(var(--color-lgray-300), 1);
}
.btn.btn-outline-lgray-200, button.btn-outline-lgray-200 {
  border-color: rgba(var(--color-lgray-200), 1);
  color: rgba(var(--color-lgray-200), 1);
}
.btn.btn-outline-lgray-200:hover, button.btn-outline-lgray-200:hover {
  color: rgba(var(--color-lgray-300), 1);
  border-color: rgba(var(--color-lgray-300), 1);
}
.btn.btn-lgray-300, button.btn-lgray-300 {
  background-color: rgba(var(--color-lgray-300), 1);
  color: rgb(var(--color-lgray-contrast-300));
  border-color: rgba(var(--color-lgray-300), 1);
}
.btn.btn-lgray-300:hover, button.btn-lgray-300:hover {
  background-color: rgba(var(--color-lgray-400), 1);
  color: rgb(var(--color-lgray-contrast-400));
  border-color: rgba(var(--color-lgray-400), 1);
}
.btn.btn-outline-lgray-300, button.btn-outline-lgray-300 {
  border-color: rgba(var(--color-lgray-300), 1);
  color: rgba(var(--color-lgray-300), 1);
}
.btn.btn-outline-lgray-300:hover, button.btn-outline-lgray-300:hover {
  color: rgba(var(--color-lgray-400), 1);
  border-color: rgba(var(--color-lgray-400), 1);
}
.btn.btn-lgray-400, button.btn-lgray-400 {
  background-color: rgba(var(--color-lgray-400), 1);
  color: rgb(var(--color-lgray-contrast-400));
  border-color: rgba(var(--color-lgray-400), 1);
}
.btn.btn-lgray-400:hover, button.btn-lgray-400:hover {
  background-color: rgba(var(--color-lgray-500), 1);
  color: rgb(var(--color-lgray-contrast-500));
  border-color: rgba(var(--color-lgray-500), 1);
}
.btn.btn-outline-lgray-400, button.btn-outline-lgray-400 {
  border-color: rgba(var(--color-lgray-400), 1);
  color: rgba(var(--color-lgray-400), 1);
}
.btn.btn-outline-lgray-400:hover, button.btn-outline-lgray-400:hover {
  color: rgba(var(--color-lgray-500), 1);
  border-color: rgba(var(--color-lgray-500), 1);
}
.btn.btn-lgray-500, button.btn-lgray-500 {
  background-color: rgba(var(--color-lgray-500), 1);
  color: rgb(var(--color-lgray-contrast-500));
  border-color: rgba(var(--color-lgray-500), 1);
}
.btn.btn-lgray-500:hover, button.btn-lgray-500:hover {
  background-color: rgba(var(--color-lgray-600), 1);
  color: rgb(var(--color-lgray-contrast-600));
  border-color: rgba(var(--color-lgray-600), 1);
}
.btn.btn-outline-lgray-500, button.btn-outline-lgray-500 {
  border-color: rgba(var(--color-lgray-500), 1);
  color: rgba(var(--color-lgray-500), 1);
}
.btn.btn-outline-lgray-500:hover, button.btn-outline-lgray-500:hover {
  color: rgba(var(--color-lgray-600), 1);
  border-color: rgba(var(--color-lgray-600), 1);
}
.btn.btn-lgray-600, button.btn-lgray-600 {
  background-color: rgba(var(--color-lgray-600), 1);
  color: rgb(var(--color-lgray-contrast-600));
  border-color: rgba(var(--color-lgray-600), 1);
}
.btn.btn-lgray-600:hover, button.btn-lgray-600:hover {
  background-color: rgba(var(--color-lgray-700), 1);
  color: rgb(var(--color-lgray-contrast-700));
  border-color: rgba(var(--color-lgray-700), 1);
}
.btn.btn-outline-lgray-600, button.btn-outline-lgray-600 {
  border-color: rgba(var(--color-lgray-600), 1);
  color: rgba(var(--color-lgray-600), 1);
}
.btn.btn-outline-lgray-600:hover, button.btn-outline-lgray-600:hover {
  color: rgba(var(--color-lgray-700), 1);
  border-color: rgba(var(--color-lgray-700), 1);
}
.btn.btn-lgray-700, button.btn-lgray-700 {
  background-color: rgba(var(--color-lgray-700), 1);
  color: rgb(var(--color-lgray-contrast-700));
  border-color: rgba(var(--color-lgray-700), 1);
}
.btn.btn-lgray-700:hover, button.btn-lgray-700:hover {
  background-color: rgba(var(--color-lgray-800), 1);
  color: rgb(var(--color-lgray-contrast-800));
  border-color: rgba(var(--color-lgray-800), 1);
}
.btn.btn-outline-lgray-700, button.btn-outline-lgray-700 {
  border-color: rgba(var(--color-lgray-700), 1);
  color: rgba(var(--color-lgray-700), 1);
}
.btn.btn-outline-lgray-700:hover, button.btn-outline-lgray-700:hover {
  color: rgba(var(--color-lgray-800), 1);
  border-color: rgba(var(--color-lgray-800), 1);
}
.btn.btn-lgray-800, button.btn-lgray-800 {
  background-color: rgba(var(--color-lgray-800), 1);
  color: rgb(var(--color-lgray-contrast-800));
  border-color: rgba(var(--color-lgray-800), 1);
}
.btn.btn-lgray-800:hover, button.btn-lgray-800:hover {
  background-color: rgba(var(--color-lgray-900), 1);
  color: rgb(var(--color-lgray-contrast-900));
  border-color: rgba(var(--color-lgray-900), 1);
}
.btn.btn-outline-lgray-800, button.btn-outline-lgray-800 {
  border-color: rgba(var(--color-lgray-800), 1);
  color: rgba(var(--color-lgray-800), 1);
}
.btn.btn-outline-lgray-800:hover, button.btn-outline-lgray-800:hover {
  color: rgba(var(--color-lgray-900), 1);
  border-color: rgba(var(--color-lgray-900), 1);
}
.btn.btn-lgray-900, button.btn-lgray-900 {
  background-color: rgba(var(--color-lgray-900), 1);
  color: rgb(var(--color-lgray-contrast-900));
  border-color: rgba(var(--color-lgray-900), 1);
}
.btn.btn-lgray-900:hover, button.btn-lgray-900:hover {
  background-color: rgba(var(--color-lgray-1000), 1);
  color: rgb(var(--color-lgray-contrast-1000));
  border-color: rgba(var(--color-lgray-1000), 1);
}
.btn.btn-outline-lgray-900, button.btn-outline-lgray-900 {
  border-color: rgba(var(--color-lgray-900), 1);
  color: rgba(var(--color-lgray-900), 1);
}
.btn.btn-outline-lgray-900:hover, button.btn-outline-lgray-900:hover {
  color: rgba(var(--color-lgray-1000), 1);
  border-color: rgba(var(--color-lgray-1000), 1);
}
.btn.btn-success-100, button.btn-success-100 {
  background-color: rgba(var(--color-success-100), 1);
  color: rgb(var(--color-success-contrast-100));
  border-color: rgba(var(--color-success-100), 1);
}
.btn.btn-success-100:hover, button.btn-success-100:hover {
  background-color: rgba(var(--color-success-200), 1);
  color: rgb(var(--color-success-contrast-200));
  border-color: rgba(var(--color-success-200), 1);
}
.btn.btn-outline-success-100, button.btn-outline-success-100 {
  border-color: rgba(var(--color-success-100), 1);
  color: rgba(var(--color-success-100), 1);
}
.btn.btn-outline-success-100:hover, button.btn-outline-success-100:hover {
  color: rgba(var(--color-success-200), 1);
  border-color: rgba(var(--color-success-200), 1);
}
.btn.btn-success-200, button.btn-success-200 {
  background-color: rgba(var(--color-success-200), 1);
  color: rgb(var(--color-success-contrast-200));
  border-color: rgba(var(--color-success-200), 1);
}
.btn.btn-success-200:hover, button.btn-success-200:hover {
  background-color: rgba(var(--color-success-300), 1);
  color: rgb(var(--color-success-contrast-300));
  border-color: rgba(var(--color-success-300), 1);
}
.btn.btn-outline-success-200, button.btn-outline-success-200 {
  border-color: rgba(var(--color-success-200), 1);
  color: rgba(var(--color-success-200), 1);
}
.btn.btn-outline-success-200:hover, button.btn-outline-success-200:hover {
  color: rgba(var(--color-success-300), 1);
  border-color: rgba(var(--color-success-300), 1);
}
.btn.btn-success-300, button.btn-success-300 {
  background-color: rgba(var(--color-success-300), 1);
  color: rgb(var(--color-success-contrast-300));
  border-color: rgba(var(--color-success-300), 1);
}
.btn.btn-success-300:hover, button.btn-success-300:hover {
  background-color: rgba(var(--color-success-400), 1);
  color: rgb(var(--color-success-contrast-400));
  border-color: rgba(var(--color-success-400), 1);
}
.btn.btn-outline-success-300, button.btn-outline-success-300 {
  border-color: rgba(var(--color-success-300), 1);
  color: rgba(var(--color-success-300), 1);
}
.btn.btn-outline-success-300:hover, button.btn-outline-success-300:hover {
  color: rgba(var(--color-success-400), 1);
  border-color: rgba(var(--color-success-400), 1);
}
.btn.btn-success-400, button.btn-success-400 {
  background-color: rgba(var(--color-success-400), 1);
  color: rgb(var(--color-success-contrast-400));
  border-color: rgba(var(--color-success-400), 1);
}
.btn.btn-success-400:hover, button.btn-success-400:hover {
  background-color: rgba(var(--color-success-500), 1);
  color: rgb(var(--color-success-contrast-500));
  border-color: rgba(var(--color-success-500), 1);
}
.btn.btn-outline-success-400, button.btn-outline-success-400 {
  border-color: rgba(var(--color-success-400), 1);
  color: rgba(var(--color-success-400), 1);
}
.btn.btn-outline-success-400:hover, button.btn-outline-success-400:hover {
  color: rgba(var(--color-success-500), 1);
  border-color: rgba(var(--color-success-500), 1);
}
.btn.btn-success-500, button.btn-success-500 {
  background-color: rgba(var(--color-success-500), 1);
  color: rgb(var(--color-success-contrast-500));
  border-color: rgba(var(--color-success-500), 1);
}
.btn.btn-success-500:hover, button.btn-success-500:hover {
  background-color: rgba(var(--color-success-600), 1);
  color: rgb(var(--color-success-contrast-600));
  border-color: rgba(var(--color-success-600), 1);
}
.btn.btn-outline-success-500, button.btn-outline-success-500 {
  border-color: rgba(var(--color-success-500), 1);
  color: rgba(var(--color-success-500), 1);
}
.btn.btn-outline-success-500:hover, button.btn-outline-success-500:hover {
  color: rgba(var(--color-success-600), 1);
  border-color: rgba(var(--color-success-600), 1);
}
.btn.btn-success-600, button.btn-success-600 {
  background-color: rgba(var(--color-success-600), 1);
  color: rgb(var(--color-success-contrast-600));
  border-color: rgba(var(--color-success-600), 1);
}
.btn.btn-success-600:hover, button.btn-success-600:hover {
  background-color: rgba(var(--color-success-700), 1);
  color: rgb(var(--color-success-contrast-700));
  border-color: rgba(var(--color-success-700), 1);
}
.btn.btn-outline-success-600, button.btn-outline-success-600 {
  border-color: rgba(var(--color-success-600), 1);
  color: rgba(var(--color-success-600), 1);
}
.btn.btn-outline-success-600:hover, button.btn-outline-success-600:hover {
  color: rgba(var(--color-success-700), 1);
  border-color: rgba(var(--color-success-700), 1);
}
.btn.btn-success-700, button.btn-success-700 {
  background-color: rgba(var(--color-success-700), 1);
  color: rgb(var(--color-success-contrast-700));
  border-color: rgba(var(--color-success-700), 1);
}
.btn.btn-success-700:hover, button.btn-success-700:hover {
  background-color: rgba(var(--color-success-800), 1);
  color: rgb(var(--color-success-contrast-800));
  border-color: rgba(var(--color-success-800), 1);
}
.btn.btn-outline-success-700, button.btn-outline-success-700 {
  border-color: rgba(var(--color-success-700), 1);
  color: rgba(var(--color-success-700), 1);
}
.btn.btn-outline-success-700:hover, button.btn-outline-success-700:hover {
  color: rgba(var(--color-success-800), 1);
  border-color: rgba(var(--color-success-800), 1);
}
.btn.btn-success-800, button.btn-success-800 {
  background-color: rgba(var(--color-success-800), 1);
  color: rgb(var(--color-success-contrast-800));
  border-color: rgba(var(--color-success-800), 1);
}
.btn.btn-success-800:hover, button.btn-success-800:hover {
  background-color: rgba(var(--color-success-900), 1);
  color: rgb(var(--color-success-contrast-900));
  border-color: rgba(var(--color-success-900), 1);
}
.btn.btn-outline-success-800, button.btn-outline-success-800 {
  border-color: rgba(var(--color-success-800), 1);
  color: rgba(var(--color-success-800), 1);
}
.btn.btn-outline-success-800:hover, button.btn-outline-success-800:hover {
  color: rgba(var(--color-success-900), 1);
  border-color: rgba(var(--color-success-900), 1);
}
.btn.btn-success-900, button.btn-success-900 {
  background-color: rgba(var(--color-success-900), 1);
  color: rgb(var(--color-success-contrast-900));
  border-color: rgba(var(--color-success-900), 1);
}
.btn.btn-success-900:hover, button.btn-success-900:hover {
  background-color: rgba(var(--color-success-1000), 1);
  color: rgb(var(--color-success-contrast-1000));
  border-color: rgba(var(--color-success-1000), 1);
}
.btn.btn-outline-success-900, button.btn-outline-success-900 {
  border-color: rgba(var(--color-success-900), 1);
  color: rgba(var(--color-success-900), 1);
}
.btn.btn-outline-success-900:hover, button.btn-outline-success-900:hover {
  color: rgba(var(--color-success-1000), 1);
  border-color: rgba(var(--color-success-1000), 1);
}
.btn.btn-warning-100, button.btn-warning-100 {
  background-color: rgba(var(--color-warning-100), 1);
  color: rgb(var(--color-warning-contrast-100));
  border-color: rgba(var(--color-warning-100), 1);
}
.btn.btn-warning-100:hover, button.btn-warning-100:hover {
  background-color: rgba(var(--color-warning-200), 1);
  color: rgb(var(--color-warning-contrast-200));
  border-color: rgba(var(--color-warning-200), 1);
}
.btn.btn-outline-warning-100, button.btn-outline-warning-100 {
  border-color: rgba(var(--color-warning-100), 1);
  color: rgba(var(--color-warning-100), 1);
}
.btn.btn-outline-warning-100:hover, button.btn-outline-warning-100:hover {
  color: rgba(var(--color-warning-200), 1);
  border-color: rgba(var(--color-warning-200), 1);
}
.btn.btn-warning-200, button.btn-warning-200 {
  background-color: rgba(var(--color-warning-200), 1);
  color: rgb(var(--color-warning-contrast-200));
  border-color: rgba(var(--color-warning-200), 1);
}
.btn.btn-warning-200:hover, button.btn-warning-200:hover {
  background-color: rgba(var(--color-warning-300), 1);
  color: rgb(var(--color-warning-contrast-300));
  border-color: rgba(var(--color-warning-300), 1);
}
.btn.btn-outline-warning-200, button.btn-outline-warning-200 {
  border-color: rgba(var(--color-warning-200), 1);
  color: rgba(var(--color-warning-200), 1);
}
.btn.btn-outline-warning-200:hover, button.btn-outline-warning-200:hover {
  color: rgba(var(--color-warning-300), 1);
  border-color: rgba(var(--color-warning-300), 1);
}
.btn.btn-warning-300, button.btn-warning-300 {
  background-color: rgba(var(--color-warning-300), 1);
  color: rgb(var(--color-warning-contrast-300));
  border-color: rgba(var(--color-warning-300), 1);
}
.btn.btn-warning-300:hover, button.btn-warning-300:hover {
  background-color: rgba(var(--color-warning-400), 1);
  color: rgb(var(--color-warning-contrast-400));
  border-color: rgba(var(--color-warning-400), 1);
}
.btn.btn-outline-warning-300, button.btn-outline-warning-300 {
  border-color: rgba(var(--color-warning-300), 1);
  color: rgba(var(--color-warning-300), 1);
}
.btn.btn-outline-warning-300:hover, button.btn-outline-warning-300:hover {
  color: rgba(var(--color-warning-400), 1);
  border-color: rgba(var(--color-warning-400), 1);
}
.btn.btn-warning-400, button.btn-warning-400 {
  background-color: rgba(var(--color-warning-400), 1);
  color: rgb(var(--color-warning-contrast-400));
  border-color: rgba(var(--color-warning-400), 1);
}
.btn.btn-warning-400:hover, button.btn-warning-400:hover {
  background-color: rgba(var(--color-warning-500), 1);
  color: rgb(var(--color-warning-contrast-500));
  border-color: rgba(var(--color-warning-500), 1);
}
.btn.btn-outline-warning-400, button.btn-outline-warning-400 {
  border-color: rgba(var(--color-warning-400), 1);
  color: rgba(var(--color-warning-400), 1);
}
.btn.btn-outline-warning-400:hover, button.btn-outline-warning-400:hover {
  color: rgba(var(--color-warning-500), 1);
  border-color: rgba(var(--color-warning-500), 1);
}
.btn.btn-warning-500, button.btn-warning-500 {
  background-color: rgba(var(--color-warning-500), 1);
  color: rgb(var(--color-warning-contrast-500));
  border-color: rgba(var(--color-warning-500), 1);
}
.btn.btn-warning-500:hover, button.btn-warning-500:hover {
  background-color: rgba(var(--color-warning-600), 1);
  color: rgb(var(--color-warning-contrast-600));
  border-color: rgba(var(--color-warning-600), 1);
}
.btn.btn-outline-warning-500, button.btn-outline-warning-500 {
  border-color: rgba(var(--color-warning-500), 1);
  color: rgba(var(--color-warning-500), 1);
}
.btn.btn-outline-warning-500:hover, button.btn-outline-warning-500:hover {
  color: rgba(var(--color-warning-600), 1);
  border-color: rgba(var(--color-warning-600), 1);
}
.btn.btn-warning-600, button.btn-warning-600 {
  background-color: rgba(var(--color-warning-600), 1);
  color: rgb(var(--color-warning-contrast-600));
  border-color: rgba(var(--color-warning-600), 1);
}
.btn.btn-warning-600:hover, button.btn-warning-600:hover {
  background-color: rgba(var(--color-warning-700), 1);
  color: rgb(var(--color-warning-contrast-700));
  border-color: rgba(var(--color-warning-700), 1);
}
.btn.btn-outline-warning-600, button.btn-outline-warning-600 {
  border-color: rgba(var(--color-warning-600), 1);
  color: rgba(var(--color-warning-600), 1);
}
.btn.btn-outline-warning-600:hover, button.btn-outline-warning-600:hover {
  color: rgba(var(--color-warning-700), 1);
  border-color: rgba(var(--color-warning-700), 1);
}
.btn.btn-warning-700, button.btn-warning-700 {
  background-color: rgba(var(--color-warning-700), 1);
  color: rgb(var(--color-warning-contrast-700));
  border-color: rgba(var(--color-warning-700), 1);
}
.btn.btn-warning-700:hover, button.btn-warning-700:hover {
  background-color: rgba(var(--color-warning-800), 1);
  color: rgb(var(--color-warning-contrast-800));
  border-color: rgba(var(--color-warning-800), 1);
}
.btn.btn-outline-warning-700, button.btn-outline-warning-700 {
  border-color: rgba(var(--color-warning-700), 1);
  color: rgba(var(--color-warning-700), 1);
}
.btn.btn-outline-warning-700:hover, button.btn-outline-warning-700:hover {
  color: rgba(var(--color-warning-800), 1);
  border-color: rgba(var(--color-warning-800), 1);
}
.btn.btn-warning-800, button.btn-warning-800 {
  background-color: rgba(var(--color-warning-800), 1);
  color: rgb(var(--color-warning-contrast-800));
  border-color: rgba(var(--color-warning-800), 1);
}
.btn.btn-warning-800:hover, button.btn-warning-800:hover {
  background-color: rgba(var(--color-warning-900), 1);
  color: rgb(var(--color-warning-contrast-900));
  border-color: rgba(var(--color-warning-900), 1);
}
.btn.btn-outline-warning-800, button.btn-outline-warning-800 {
  border-color: rgba(var(--color-warning-800), 1);
  color: rgba(var(--color-warning-800), 1);
}
.btn.btn-outline-warning-800:hover, button.btn-outline-warning-800:hover {
  color: rgba(var(--color-warning-900), 1);
  border-color: rgba(var(--color-warning-900), 1);
}
.btn.btn-warning-900, button.btn-warning-900 {
  background-color: rgba(var(--color-warning-900), 1);
  color: rgb(var(--color-warning-contrast-900));
  border-color: rgba(var(--color-warning-900), 1);
}
.btn.btn-warning-900:hover, button.btn-warning-900:hover {
  background-color: rgba(var(--color-warning-1000), 1);
  color: rgb(var(--color-warning-contrast-1000));
  border-color: rgba(var(--color-warning-1000), 1);
}
.btn.btn-outline-warning-900, button.btn-outline-warning-900 {
  border-color: rgba(var(--color-warning-900), 1);
  color: rgba(var(--color-warning-900), 1);
}
.btn.btn-outline-warning-900:hover, button.btn-outline-warning-900:hover {
  color: rgba(var(--color-warning-1000), 1);
  border-color: rgba(var(--color-warning-1000), 1);
}
.btn.btn-danger-100, button.btn-danger-100 {
  background-color: rgba(var(--color-danger-100), 1);
  color: rgb(var(--color-danger-contrast-100));
  border-color: rgba(var(--color-danger-100), 1);
}
.btn.btn-danger-100:hover, button.btn-danger-100:hover {
  background-color: rgba(var(--color-danger-200), 1);
  color: rgb(var(--color-danger-contrast-200));
  border-color: rgba(var(--color-danger-200), 1);
}
.btn.btn-outline-danger-100, button.btn-outline-danger-100 {
  border-color: rgba(var(--color-danger-100), 1);
  color: rgba(var(--color-danger-100), 1);
}
.btn.btn-outline-danger-100:hover, button.btn-outline-danger-100:hover {
  color: rgba(var(--color-danger-200), 1);
  border-color: rgba(var(--color-danger-200), 1);
}
.btn.btn-danger-200, button.btn-danger-200 {
  background-color: rgba(var(--color-danger-200), 1);
  color: rgb(var(--color-danger-contrast-200));
  border-color: rgba(var(--color-danger-200), 1);
}
.btn.btn-danger-200:hover, button.btn-danger-200:hover {
  background-color: rgba(var(--color-danger-300), 1);
  color: rgb(var(--color-danger-contrast-300));
  border-color: rgba(var(--color-danger-300), 1);
}
.btn.btn-outline-danger-200, button.btn-outline-danger-200 {
  border-color: rgba(var(--color-danger-200), 1);
  color: rgba(var(--color-danger-200), 1);
}
.btn.btn-outline-danger-200:hover, button.btn-outline-danger-200:hover {
  color: rgba(var(--color-danger-300), 1);
  border-color: rgba(var(--color-danger-300), 1);
}
.btn.btn-danger-300, button.btn-danger-300 {
  background-color: rgba(var(--color-danger-300), 1);
  color: rgb(var(--color-danger-contrast-300));
  border-color: rgba(var(--color-danger-300), 1);
}
.btn.btn-danger-300:hover, button.btn-danger-300:hover {
  background-color: rgba(var(--color-danger-400), 1);
  color: rgb(var(--color-danger-contrast-400));
  border-color: rgba(var(--color-danger-400), 1);
}
.btn.btn-outline-danger-300, button.btn-outline-danger-300 {
  border-color: rgba(var(--color-danger-300), 1);
  color: rgba(var(--color-danger-300), 1);
}
.btn.btn-outline-danger-300:hover, button.btn-outline-danger-300:hover {
  color: rgba(var(--color-danger-400), 1);
  border-color: rgba(var(--color-danger-400), 1);
}
.btn.btn-danger-400, button.btn-danger-400 {
  background-color: rgba(var(--color-danger-400), 1);
  color: rgb(var(--color-danger-contrast-400));
  border-color: rgba(var(--color-danger-400), 1);
}
.btn.btn-danger-400:hover, button.btn-danger-400:hover {
  background-color: rgba(var(--color-danger-500), 1);
  color: rgb(var(--color-danger-contrast-500));
  border-color: rgba(var(--color-danger-500), 1);
}
.btn.btn-outline-danger-400, button.btn-outline-danger-400 {
  border-color: rgba(var(--color-danger-400), 1);
  color: rgba(var(--color-danger-400), 1);
}
.btn.btn-outline-danger-400:hover, button.btn-outline-danger-400:hover {
  color: rgba(var(--color-danger-500), 1);
  border-color: rgba(var(--color-danger-500), 1);
}
.btn.btn-danger-500, button.btn-danger-500 {
  background-color: rgba(var(--color-danger-500), 1);
  color: rgb(var(--color-danger-contrast-500));
  border-color: rgba(var(--color-danger-500), 1);
}
.btn.btn-danger-500:hover, button.btn-danger-500:hover {
  background-color: rgba(var(--color-danger-600), 1);
  color: rgb(var(--color-danger-contrast-600));
  border-color: rgba(var(--color-danger-600), 1);
}
.btn.btn-outline-danger-500, button.btn-outline-danger-500 {
  border-color: rgba(var(--color-danger-500), 1);
  color: rgba(var(--color-danger-500), 1);
}
.btn.btn-outline-danger-500:hover, button.btn-outline-danger-500:hover {
  color: rgba(var(--color-danger-600), 1);
  border-color: rgba(var(--color-danger-600), 1);
}
.btn.btn-danger-600, button.btn-danger-600 {
  background-color: rgba(var(--color-danger-600), 1);
  color: rgb(var(--color-danger-contrast-600));
  border-color: rgba(var(--color-danger-600), 1);
}
.btn.btn-danger-600:hover, button.btn-danger-600:hover {
  background-color: rgba(var(--color-danger-700), 1);
  color: rgb(var(--color-danger-contrast-700));
  border-color: rgba(var(--color-danger-700), 1);
}
.btn.btn-outline-danger-600, button.btn-outline-danger-600 {
  border-color: rgba(var(--color-danger-600), 1);
  color: rgba(var(--color-danger-600), 1);
}
.btn.btn-outline-danger-600:hover, button.btn-outline-danger-600:hover {
  color: rgba(var(--color-danger-700), 1);
  border-color: rgba(var(--color-danger-700), 1);
}
.btn.btn-danger-700, button.btn-danger-700 {
  background-color: rgba(var(--color-danger-700), 1);
  color: rgb(var(--color-danger-contrast-700));
  border-color: rgba(var(--color-danger-700), 1);
}
.btn.btn-danger-700:hover, button.btn-danger-700:hover {
  background-color: rgba(var(--color-danger-800), 1);
  color: rgb(var(--color-danger-contrast-800));
  border-color: rgba(var(--color-danger-800), 1);
}
.btn.btn-outline-danger-700, button.btn-outline-danger-700 {
  border-color: rgba(var(--color-danger-700), 1);
  color: rgba(var(--color-danger-700), 1);
}
.btn.btn-outline-danger-700:hover, button.btn-outline-danger-700:hover {
  color: rgba(var(--color-danger-800), 1);
  border-color: rgba(var(--color-danger-800), 1);
}
.btn.btn-danger-800, button.btn-danger-800 {
  background-color: rgba(var(--color-danger-800), 1);
  color: rgb(var(--color-danger-contrast-800));
  border-color: rgba(var(--color-danger-800), 1);
}
.btn.btn-danger-800:hover, button.btn-danger-800:hover {
  background-color: rgba(var(--color-danger-900), 1);
  color: rgb(var(--color-danger-contrast-900));
  border-color: rgba(var(--color-danger-900), 1);
}
.btn.btn-outline-danger-800, button.btn-outline-danger-800 {
  border-color: rgba(var(--color-danger-800), 1);
  color: rgba(var(--color-danger-800), 1);
}
.btn.btn-outline-danger-800:hover, button.btn-outline-danger-800:hover {
  color: rgba(var(--color-danger-900), 1);
  border-color: rgba(var(--color-danger-900), 1);
}
.btn.btn-danger-900, button.btn-danger-900 {
  background-color: rgba(var(--color-danger-900), 1);
  color: rgb(var(--color-danger-contrast-900));
  border-color: rgba(var(--color-danger-900), 1);
}
.btn.btn-danger-900:hover, button.btn-danger-900:hover {
  background-color: rgba(var(--color-danger-1000), 1);
  color: rgb(var(--color-danger-contrast-1000));
  border-color: rgba(var(--color-danger-1000), 1);
}
.btn.btn-outline-danger-900, button.btn-outline-danger-900 {
  border-color: rgba(var(--color-danger-900), 1);
  color: rgba(var(--color-danger-900), 1);
}
.btn.btn-outline-danger-900:hover, button.btn-outline-danger-900:hover {
  color: rgba(var(--color-danger-1000), 1);
  border-color: rgba(var(--color-danger-1000), 1);
}

.btn-small {
  padding: calc(var(--spacer) * 0.25) calc(var(--spacer) * 0.25);
  font-size: 0.9em;
}

.btn-medium {
  padding: calc(var(--spacer) * 0.4) calc(var(--spacer) * 1);
  font-size: 1em;
}

.btn-large {
  padding: calc(var(--spacer) * 0.5) calc(var(--spacer) * 1.2);
  font-size: 1.1em;
}

.btn-radius-default {
  border-radius: calc(var(--spacer) * 0.5);
}

.btn-radius-large {
  border-radius: calc(var(--spacer));
}

.btn-radius-small {
  border-radius: calc(var(--spacer) * 0.25);
}

[class*=container] {
  margin: 0 auto;
  max-width: 1440px;
}

@break;
@break;
@break;
.container, :root [default=container] {
  width: 87.5%;
}

.container-xs, :root [default*=container-xs] {
  width: 60%;
}

.container-xl, :root [default*=container-xl] {
  width: 80%;
}

@break;
@break;
@break;
@media (min-width: 0px) and (max-width: 1200px) {
  .container, :root [xs=container] {
    width: 90%;
  }
  .container-xs, :root [xs*=container-xs] {
    width: 85%;
  }
  .container-xl, :root [xs*=container-xl] {
    width: 90%;
  }
}
@break;
@break;
@break;
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .container, :root [xs-l=container] {
    width: 87.5%;
  }
  .container-xs, :root [xs-l*=container-xs] {
    width: 85%;
  }
  .container-xl, :root [xs-l*=container-xl] {
    width: 90%;
  }
}
@break;
@break;
@break;
@media (min-width: 768px) and (max-width: 1200px) {
  .container, :root [sm=container] {
    width: 85%;
  }
  .container-xs, :root [sm*=container-xs] {
    width: 85%;
  }
  .container-xl, :root [sm*=container-xl] {
    width: 90%;
  }
}
@break;
@break;
@break;
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .container, :root [sm-l=container] {
    width: 85%;
  }
  .container-xs, :root [sm-l*=container-xs] {
    width: 85%;
  }
  .container-xl, :root [sm-l*=container-xl] {
    width: 90%;
  }
}
@break;
@break;
@break;
@media (min-width: 1201px) and (max-width: 10000px) {
  .container, :root [md=container] {
    width: 90%;
  }
  .container-xs, :root [md*=container-xs] {
    width: 66%;
  }
  .container-xl, :root [md*=container-xl] {
    width: 90%;
  }
}
@break;
@break;
@break;
@media (min-width: 1441px) and (max-width: 10000px) {
  .container, :root [lg=container] {
    width: 80%;
  }
  .container-xs, :root [lg*=container-xs] {
    width: 55%;
  }
  .container-xl, :root [lg*=container-xl] {
    width: 87.5%;
  }
}
@break;
@break;
@break;
@media (min-width: 1921px) and (max-width: 10000px) {
  .container, :root [xl=container] {
    width: 75%;
  }
  .container-xs, :root [xl*=container-xs] {
    width: 50%;
  }
  .container-xl, :root [xl*=container-xl] {
    width: 85%;
  }
}
.container-left {
  margin-left: 0;
  margin-right: auto;
}

.container-right {
  margin-left: auto;
  margin-right: 0;
}

.container-left,
.container-right {
  width: calc(100% - 6.25%);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .container-left,
  .container-right {
    width: calc(100% - 5%);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .container-left,
  .container-right {
    width: calc(100% - 6.25%);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .container-left,
  .container-right {
    width: calc(100% - 7.5%);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .container-left,
  .container-right {
    width: calc(100% - 7.5%);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .container-left,
  .container-right {
    width: calc(100% - 5%);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .container-left,
  .container-right {
    width: calc(100% - 10%);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .container-left,
  .container-right {
    width: calc(100% - 12.5%);
  }
}
.container-left,
.container-right {
  max-width: calc(1440px + (100vw - 1440px) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .container-left,
  .container-right {
    width: calc(100% - 10%);
    margin-left: auto;
    margin-right: auto;
  }
}
.modal {
  display: none; /* Masquer par défaut */
  position: fixed; /* Rester à l'écran */
  z-index: 1; /* Placer au-dessus */
  left: 0;
  top: 0;
  width: 100%; /* Pleine largeur */
  height: 100%; /* Pleine hauteur */
  overflow: auto; /* Activer le défilement si nécessaire */
  background-color: rgba(0, 0, 0, 0.5); /* Overlay noir transparent */
}

.modal.modal--open {
  display: block;
}

.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% du haut de la page et centrer */
  padding: 20px;
  border: 1px solid #888;
  width: min(80%, 640px); /* Largeur par défaut */
  box-shadow: calc(var(--spacer) * 25) calc(var(--spacer) * 25) calc(var(--spacer) * 1) rgba(46, 56, 98, 0.1);
  border-radius: calc(var(--spacer) * 0.5);
}

.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.card {
  background-color: rgb(var(--color-primary-contrast-500));
  color: rgba(var(--color-primary-500), 1);
  border: rgb(var(--color-primary-contrast-500));
}
@media (min-width: 0px) and (max-width: 1200px) {
  .card {
    padding: calc(var(--spacer) * 0.5);
  }
  .card-title {
    font-size: 1rem;
  }
  .card-content {
    font-size: 0.875rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .card {
    padding: calc(var(--spacer) * 0.75);
  }
  .card-title {
    font-size: 1.125rem;
  }
  .card-content {
    font-size: 1rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .card {
    padding: calc(var(--spacer) * 1);
  }
  .card-title {
    font-size: 1.25rem;
  }
  .card-content {
    font-size: 1rem;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .card {
    padding: calc(var(--spacer) * 1.25);
  }
  .card-title {
    font-size: 1.5rem;
  }
  .card-content {
    font-size: 1.125rem;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .card {
    padding: calc(var(--spacer) * 1.5);
  }
  .card-title {
    font-size: 1.75rem;
  }
  .card-content {
    font-size: 1.25rem;
  }
}
.accordeon .accordeon-trigger {
  cursor: pointer;
}
.accordeon .accordeon-target {
  height: 0;
  overflow: hidden;
  transition: height 0.3s ease;
}
.accordeon .accordeon-target.active {
  height: 100%;
  transition: height 0.3s ease;
}

.accordeon {
  border-top: 1px solid rgba(var(--color-secondary-500), 1);
  padding: calc(var(--spacer) * 0.666);
}
.accordeon:last-of-type {
  border-bottom: 1px solid rgba(var(--color-secondary-500), 1);
}
.accordeon .accordeon-title {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.accordeon .accordeon-title .h3 {
  margin-bottom: 0;
  margin-left: calc(var(--spacer) * 1);
}
.accordeon .minus {
  display: none;
}
.accordeon.active .plus {
  display: none;
}
.accordeon.active .minus {
  display: block;
}
.accordeon .accordeon-target p {
  margin-bottom: 0;
  margin-top: calc(var(--spacer) * 0.5);
}

.material-icons {
  font-family: "Material Icons Outlined";
}

.material-icons {
  font-weight: normal;
  font-style: normal;
  font-size: calc(var(--spacer) * 1);
  display: inline-flex;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: "liga";
}
.material-icons.size-1 {
  font-size: calc(var(--spacer) * 1) !important;
}
.material-icons.size-2 {
  font-size: calc(var(--spacer) * 2) !important;
}
.material-icons.size-3 {
  font-size: calc(var(--spacer) * 3) !important;
}
.material-icons.size-4 {
  font-size: calc(var(--spacer) * 4) !important;
}
.material-icons.size-5 {
  font-size: calc(var(--spacer) * 5) !important;
}
.material-icons.size-6 {
  font-size: calc(var(--spacer) * 6) !important;
}
.material-icons.size-7 {
  font-size: calc(var(--spacer) * 7) !important;
}
.material-icons.size-8 {
  font-size: calc(var(--spacer) * 8) !important;
}
.material-icons.size-9 {
  font-size: calc(var(--spacer) * 9) !important;
}
.material-icons.size-10 {
  font-size: calc(var(--spacer) * 10) !important;
}

:root {
  --scroll-gauge--height: calc(var(--spacer) * 0.125);
  --scroll-gauge--background: rgba(var(--color-primary-100), 1);
  --scroll-gauge--color: rgba(var(--color-primary-500), 1);
}

.scroll-gauge {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: var(--scroll-gauge--height);
  background: var(--scroll-gauge--background);
  z-index: 1000;
}
.scroll-gauge__progress {
  width: 0;
  height: 100%;
  background: var(--scroll-gauge--color);
  transition: width 0.25s ease-out;
}

.loader--circularSquare {
  width: 1em;
  height: 1em;
  position: relative;
  animation: rotateLoader 1.5s linear infinite;
}
.loader--circularSquare::before, .loader--circularSquare::after {
  content: "";
  position: absolute;
  width: 1em;
  height: 1em;
  border-radius: 50%;
}
.loader--circularSquare::before {
  top: -1em;
  left: 0;
  background: rgba(var(--color-primary-500), 1);
  animation: moveBefore 1.5s linear infinite;
}
.loader--circularSquare::after {
  top: 1em;
  left: 0;
  background: rgba(var(--color-third-500), 1);
  animation: moveAfter 1.5s linear infinite;
}
.loader--circularSquare .child1, .loader--circularSquare .child2 {
  position: absolute;
  width: 1em;
  height: 1em;
  border-radius: 50%;
}
.loader--circularSquare .child1 {
  top: 0;
  left: -1em;
  background: rgba(var(--color-secondary-500), 1);
  animation: moveChild1 1.5s linear infinite;
}
.loader--circularSquare .child2 {
  top: 0;
  left: 1em;
  background: rgba(var(--color-accent-500), 1);
  animation: moveChild2 1.5s linear infinite;
}
@keyframes rotateLoader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes moveBefore {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(1em);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-1em);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes moveAfter {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(-1em);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(1em);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes moveChild1 {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(1em);
  }
  50% {
    transform: translateX(0);
  }
  75% {
    transform: translateX(-1em);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes moveChild2 {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-1em);
  }
  50% {
    transform: translateX(0);
  }
  75% {
    transform: translateX(1em);
  }
  100% {
    transform: translateX(0);
  }
}

.border-default {
  border-style: solid;
  border-width: 1px;
}

.border-radius {
  border-radius: calc(var(--spacer) * 0.25);
}

small, .small {
  font-size: 13px;
  line-height: 18px;
}

strong, b {
  font-weight: 700;
}

.bg-white {
  background-color: white;
}

hr {
  border: 0px none;
  margin: var(--spacer)/8 auto;
}

.italic {
  font-style: italic;
}

.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.video-16-9, .image-16-9 {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.video-16-9 video {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: contain;
}

[class*=image-] img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: contain;
}

.h-100 {
  height: 100%;
}

.w-100 {
  width: 100%;
}

.h-default-100 {
  height: 100%;
}

.w-default-100 {
  width: 100%;
}

.hidden-default {
  display: none !important;
}

.visible-default {
  display: block;
}

time {
  font-size: 1.1rem;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.flex-row {
  display: flex;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

@media (min-width: 0px) and (max-width: 1200px) {
  .h-xs-100 {
    height: 100%;
  }
  .w-xs-100 {
    width: 100%;
  }
  .hidden-xs {
    display: none !important;
  }
  .visible-xs {
    display: block;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .h-xs-l-100 {
    height: 100%;
  }
  .w-xs-l-100 {
    width: 100%;
  }
  .hidden-xs-l {
    display: none !important;
  }
  .visible-xs-l {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .h-sm-100 {
    height: 100%;
  }
  .w-sm-100 {
    width: 100%;
  }
  .hidden-sm {
    display: none !important;
  }
  .visible-sm {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .h-sm-l-100 {
    height: 100%;
  }
  .w-sm-l-100 {
    width: 100%;
  }
  .hidden-sm-l {
    display: none !important;
  }
  .visible-sm-l {
    display: block;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .h-md-100 {
    height: 100%;
  }
  .w-md-100 {
    width: 100%;
  }
  .hidden-md {
    display: none !important;
  }
  .visible-md {
    display: block;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .h-lg-100 {
    height: 100%;
  }
  .w-lg-100 {
    width: 100%;
  }
  .hidden-lg {
    display: none !important;
  }
  .visible-lg {
    display: block;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .h-xl-100 {
    height: 100%;
  }
  .w-xl-100 {
    width: 100%;
  }
  .hidden-xl {
    display: none !important;
  }
  .visible-xl {
    display: block;
  }
}
body {
  padding: calc(var(--spacer) * 1);
  display: flex;
  flex-direction: column;
}

main {
  padding: calc(var(--spacer) * 1);
  flex-grow: 1;
}
main > h2 {
  margin-bottom: calc(var(--spacer) * 1);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 0px) and (max-width: 1200px) {
  main > h2 {
    margin-top: 0;
  }
}
main > h2 > div {
  display: flex;
  flex-direction: row;
  align-items: center;
}
main > h2 a.btn {
  padding: calc(var(--spacer) * 0.25);
}
main > h2 a.btn .material-icons {
  margin-right: 0 !important;
  font-size: calc(var(--spacer) * 1);
}
main > a.btn {
  margin-top: calc(var(--spacer) * 1);
  width: 100%;
}

.strong {
  font-weight: 600;
}

h3 strong {
  font-weight: 900;
  display: block;
}

nav {
  background-color: rgba(var(--color-primary-500), 1);
  color: #fff;
  padding: 0 calc(var(--spacer) * 0.5);
  border-radius: calc(var(--spacer) * 0.5);
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  z-index: 10;
  font-weight: 600;
}
nav .logo {
  height: calc(var(--spacer) * 2.25);
  width: auto;
  margin: 0 calc(var(--spacer) * 0.5);
  padding: calc(var(--spacer) * 0.5) 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  nav .logo {
    max-width: calc(var(--spacer) * 6);
  }
}
nav > ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
}
@media (min-width: 0px) and (max-width: 1200px) {
  nav > ul {
    flex-direction: column;
    transition: all 0.3s ease 0s;
    position: absolute;
    top: calc(100% + calc(var(--spacer) * 1));
    left: 0;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    background: rgba(var(--color-primary-500), 1);
    border-radius: calc(var(--spacer) * 0.5);
    text-align: center;
    overflow: hidden;
  }
  nav > ul li {
    margin-right: 0 !important;
  }
}
nav > ul > li:not(:last-of-type) {
  margin-right: calc(var(--spacer) * 0.25);
}
nav > ul > li:not(:last-of-type) .material-icons {
  margin-right: calc(var(--spacer) * 0.25);
}
@media (min-width: 1201px) and (max-width: 10000px) {
  nav > ul > li:hover {
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
  }
}
nav > ul > li a {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 calc(var(--spacer) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  nav > ul > li a {
    justify-content: center;
    width: 100%;
  }
}
nav.open {
  background: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
}
@media (min-width: 0px) and (max-width: 1200px) {
  nav.open > ul {
    opacity: 1;
    pointer-events: all;
  }
}
nav.open a.menu .open {
  opacity: 0;
}
nav.open a.menu .close {
  opacity: 1;
}
nav ul li {
  position: relative;
  display: flex;
  padding: calc(var(--spacer) * 0.5);
  height: 100%;
  cursor: pointer;
}
@media (min-width: 0px) and (max-width: 1200px) {
  nav ul li {
    width: 100%;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  nav ul li:hover {
    background: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  }
}
nav ul li.selected {
  background: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
}
@media (min-width: 1201px) and (max-width: 10000px) {
  nav ul ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 125%;
    background-color: rgba(var(--color-primary-400), 1);
    padding: calc(var(--spacer) * 0.25);
  }
}
nav ul ul li {
  display: block;
  padding: calc(var(--spacer) * 0.25);
  white-space: nowrap;
  font-size: 1em;
}
nav ul ul li:hover {
  border-radius: calc(var(--spacer) * 0.25);
}
nav ul ul li:hover > ul {
  display: block;
}

a.menu {
  margin-right: calc(var(--spacer) * 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--spacer) * 1);
  height: calc(var(--spacer) * 1);
  position: relative;
}
@media (min-width: 1201px) and (max-width: 10000px) {
  a.menu {
    display: none;
  }
}
a.menu > span {
  color: white;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
a.menu .open {
  opacity: 1;
}
a.menu .close {
  opacity: 0;
}

table {
  border-bottom: 2px solid var(--color-table-border);
  margin-bottom: 0 !important;
}
table th {
  border-top: 0px solid !important;
}
table th:last-of-type {
  font-size: 0;
}
table td, table th {
  text-align: left;
}
table td:first-of-type, table th:first-of-type {
  text-align: left;
}
table td:last-of-type, table th:last-of-type {
  text-align: right;
}
table td a.order, table th a.order {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
table td a.order .material-icons, table th a.order .material-icons {
  font-size: calc(var(--spacer) * 0.5);
  margin-left: 4px;
}
@media (min-width: 0px) and (max-width: 1200px) {
  table thead {
    display: none;
  }
  table tr {
    display: flex;
    flex-direction: row;
    border: 2px solid var(--color-table-border) !important;
    margin-bottom: calc(var(--spacer) * 1);
    border-radius: calc(var(--spacer) * 0.25);
    padding: calc(var(--spacer) * 0.1);
    flex-wrap: wrap;
  }
  table td {
    display: flex !important;
    border-top: 0px solid !important;
    flex-wrap: wrap;
    flex-grow: 1;
  }
  table td:last-of-type .btn {
    margin-right: calc(var(--spacer) * 0.1);
  }
  table td:last-of-type * {
    display: flex !important;
    flex-grow: 1;
    flex-basis: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  table td:not(:last-of-type) > a {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  table.print-label-sheets-table tbody td:nth-of-type(2), table.labels-table tbody td:nth-of-type(2), table.template-table tbody td:nth-of-type(2) {
    display: flex;
    justify-content: flex-end;
    text-align: right;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  table.print-label-sheets-table tbody td:nth-of-type(2), table.labels-table tbody td:nth-of-type(2), table.template-table tbody td:nth-of-type(2) {
    display: flex;
    justify-content: flex-start;
    text-align: left;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  table.print-label-sheets-table tbody td:nth-of-type(2) td:last-of-type(), table.labels-table tbody td:nth-of-type(2) td:last-of-type(), table.template-table tbody td:nth-of-type(2) td:last-of-type() {
    width: 100%;
  }
}
table.print-template-table small.visible-xs {
  width: 100%;
}
@media (min-width: 0px) and (max-width: 1200px) {
  table.print-template-table tbody td:not(:last-of-type) {
    width: 50%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  table.print-template-table tbody td:last-of-type() {
    width: 100%;
  }
}

label {
  margin-top: calc(var(--spacer) * 0.5);
  display: block;
}

form.search {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  margin-bottom: calc(var(--spacer) * 1);
}
form.search > * {
  margin: 0;
}
form.search input[name=search] {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border: 2px solid;
}
form.search button {
  display: flex;
  border-top-right-radius: calc(var(--spacer) * 0.25);
  border-bottom-right-radius: calc(var(--spacer) * 0.25);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  padding-left: calc(var(--spacer) * 0.5);
  padding-right: calc(var(--spacer) * 0.5);
  border-left: 0px solid;
}

input[readonly] {
  cursor: not-allowed;
  color: gray;
}

body.home main {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.home-menu {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: calc(var(--spacer) * 1);
  text-align: center;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .home-menu {
    grid-template-columns: 1fr;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .home-menu {
    grid-template-columns: 1fr 1fr;
  }
}
.home-menu li a {
  padding: calc(var(--spacer) * 1);
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 3px solid;
  border-radius: calc(var(--spacer) * 0.5);
  height: 100%;
}
.home-menu li a .material-icons {
  font-size: calc(var(--spacer) * 3);
}
.home-menu li a .label-text {
  font-weight: 600;
}
.home-menu li a:hover {
  background: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
}
.home-menu li a:hover * {
  color: white;
}

body.login {
  padding: 0;
}
body.login header {
  position: absolute;
  top: calc(var(--spacer) * 1);
  left: calc(var(--spacer) * 1);
  right: calc(var(--spacer) * 1);
}
body.login main {
  padding: 0;
  flex-grow: 1;
  display: flex;
}
body.login main .title-login {
  display: flex;
  flex-direction: row;
  align-items: center;
}
body.login main .title-login img {
  height: calc(var(--spacer) * 1);
  width: auto;
}
body.login main .img-box {
  padding-right: calc(var(--spacer) * 0.5);
  background: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  flex-grow: 1;
  height: 100%;
  max-width: inherit;
}
body.login main .img-box img {
  height: 100%;
  object-fit: cover;
  filter: grayscale();
}
@media (min-width: 0px) and (max-width: 1200px) {
  body.login main .img-box {
    padding-right: 0;
    padding-top: calc(var(--spacer) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body.login main .img-box {
    padding-right: calc(var(--spacer) * 0.5);
    padding-top: 0;
  }
}
body.login main .login-box {
  padding: calc(var(--spacer) * 1);
  max-width: inherit;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.page-title .title-actions {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--spacer) * 0.25);
  flex-wrap: wrap;
}
.page-title .title-actions > * {
  display: inline-flex;
  align-items: center;
}
.page-title .list-filter-form {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--spacer) * 0.2);
  margin: 0;
}
.page-title .list-filter-label {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--spacer) * 0.18);
  margin: 0;
  border: 2px solid;
  border-radius: calc(var(--spacer) * 0.25);
  padding: calc(var(--spacer) * 0.2) calc(var(--spacer) * 0.35);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.1;
  white-space: nowrap;
  background: #ffffff;
  cursor: pointer;
}
.page-title .list-filter-label input[type=checkbox] {
  width: auto !important;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  appearance: auto;
}
.page-title .list-filter-form noscript .btn {
  margin: 0 !important;
}
.page-title .btn {
  font-size: 0.95rem;
  line-height: 1.2;
  padding: calc(var(--spacer) * 0.22) calc(var(--spacer) * 0.45);
  margin: 0 !important;
  white-space: nowrap;
}
.page-title .btn .material-icons {
  font-size: 1.1rem;
  margin-right: calc(var(--spacer) * 0.2);
}

.page-subtitle {
  margin-top: calc(var(--spacer) * -0.5);
  margin-bottom: calc(var(--spacer) * 1);
  color: rgba(var(--color-primary-500), 0.65);
}

.muted {
  color: rgba(var(--color-primary-500), 0.55);
}

.message {
  display: flex;
  align-items: center;
  border: 2px solid;
  border-radius: calc(var(--spacer) * 0.25);
  padding: calc(var(--spacer) * 0.35) calc(var(--spacer) * 0.5);
  margin-bottom: calc(var(--spacer) * 1);
  font-weight: 500;
}

.message.success {
  border-color: rgba(var(--color-success-500), 1);
  color: rgba(var(--color-success-700), 1);
  background: rgba(var(--color-success-100), 0.2);
}

.message.error {
  border-color: rgba(var(--color-accent-500), 1);
  color: rgba(var(--color-accent-700), 1);
  background: rgba(var(--color-accent-100), 0.2);
}

.login-error {
  color: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
}

.worker-panel {
  border: 2px solid #000000;
  border-radius: calc(var(--spacer) * 0.35);
  padding: calc(var(--spacer) * 0.75);
  margin-bottom: calc(var(--spacer) * 0.75);
  background: #ffffff;
}
.worker-panel h3 {
  margin-top: 0;
  margin-bottom: calc(var(--spacer) * 0.5);
}

.worker-form {
  display: flex;
  flex-direction: column;
  gap: calc(var(--spacer) * 0.25);
}

.worker-form-grid {
  display: grid;
  gap: calc(var(--spacer) * 0.3);
}

.worker-grid {
  display: grid;
  gap: calc(var(--spacer) * 0.35);
}

.worker-grid.two-cols {
  grid-template-columns: 1fr 1fr;
}

.worker-grid .span-2 {
  grid-column: 1/-1;
}

.worker-form-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: calc(var(--spacer) * 0.25);
}

.row-actions {
  display: flex;
  align-items: center;
  gap: calc(var(--spacer) * 0.15);
  flex-wrap: wrap;
}

.inline-form {
  display: inline;
  margin: 0;
}

.inline-form button {
  margin: 0;
}

.status-pill {
  border: 2px solid;
  border-radius: 999px;
  font-size: 0.8em;
  padding: calc(var(--spacer) * 0.1) calc(var(--spacer) * 0.3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.status-pill.is-active {
  border-color: rgba(var(--color-success-500), 1);
  color: rgba(var(--color-success-700), 1);
}

.status-pill.is-inactive {
  border-color: rgba(var(--color-primary-500), 0.35);
  color: rgba(var(--color-primary-500), 0.7);
}

.btn-danger {
  border-color: rgba(var(--color-accent-500), 1);
  color: rgba(var(--color-accent-700), 1);
}

.btn-danger:hover {
  border-color: rgba(var(--color-accent-500), 1);
}

form.search {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--spacer) * 0.25);
}

form.search .search-query-group {
  display: inline-flex;
  align-items: stretch;
  min-width: min((var(--spacer) * 18), 100%);
  flex: 1 1 calc(var(--spacer) * 18);
}

form.search .search-query-group input[name=q] {
  margin: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border: 2px solid;
}

form.search .search-query-group button {
  margin: 0;
  white-space: nowrap;
}

table.workers-table {
  margin-top: calc(var(--spacer) * 0.25);
}

table.workers-table td:last-of-type {
  text-align: right;
}

.error-page main {
  min-height: calc(100vh - calc(var(--spacer) * 4));
}

.error-panel {
  max-width: calc(var(--spacer) * 28);
}

code {
  font-family: monospace;
  background: rgba(var(--color-primary-500), 0.08);
  padding: 0 calc(var(--spacer) * 0.15);
  border-radius: calc(var(--spacer) * 0.12);
}

@media (min-width: 0px) and (max-width: 1200px) {
  .worker-grid.two-cols {
    grid-template-columns: 1fr;
  }
  .worker-grid .span-2 {
    grid-column: auto;
  }
  form.search .search-query-group {
    min-width: 100%;
    flex: 1 1 100%;
  }
  table.workers-table td:last-of-type {
    text-align: left;
  }
}
:root, :root *:after, :root *:before {
  --app-bg: #ffffff;
  --app-surface: #ffffff;
  --app-surface-muted: #f6f6f6;
  --app-border: rgba(0, 0, 0, 0.22);
  --app-border-strong: rgba(0, 0, 0, 0.5);
  --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs: 4px;
  --app-radius-sm: 8px;
  --app-radius-md: 10px;
  --app-radius-lg: 12px;
  --app-spacing: 1rem;
  --app-spacing-lg: 1.5rem;
  --app-spacing-xl: 2.5rem;
  --app-primary: #000000;
  --app-primary-strong: #111111;
  --app-secondary: #30c5f0;
  --app-secondary-dark: #1697be;
  --app-text: #101010;
  --app-text-muted: #2c2c2c;
  --app-text-soft: #555555;
  --app-success: #2eb68b;
  --app-warning: #f6a600;
  --app-danger: #eb4a4a;
  --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg: rgba(255, 255, 255, 0.95);
  --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
  --theme: default;
  --spacer: 2rem;
  --gutter: 2rem;
  --col: 12;
  --row: 12;
  --text-font: var(--font-primary);
  --text-color: #101010;
  --text-color-dark: #ffffff;
  --headings-font: var(--font-title);
  --headings-color: #101010;
  --headings-color-dark: #ffffff;
  --bg-dark: #141026;
  --bg-light: #ffffff;
  --app-bg-xs: #ffffff;
  --app-surface-xs: #ffffff;
  --app-surface-muted-xs: #f6f6f6;
  --app-border-xs: rgba(0, 0, 0, 0.22);
  --app-border-strong-xs: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-xs: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-xs: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-xs: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-xs: 4px;
  --app-radius-sm-xs: 8px;
  --app-radius-md-xs: 10px;
  --app-radius-lg-xs: 12px;
  --app-spacing-xs: 1rem;
  --app-spacing-lg-xs: 1.5rem;
  --app-spacing-xl-xs: 2.5rem;
  --app-primary-xs: #000000;
  --app-primary-strong-xs: #111111;
  --app-secondary-xs: #30c5f0;
  --app-secondary-dark-xs: #1697be;
  --app-text-xs: #101010;
  --app-text-muted-xs: #2c2c2c;
  --app-text-soft-xs: #555555;
  --app-success-xs: #2eb68b;
  --app-warning-xs: #f6a600;
  --app-danger-xs: #eb4a4a;
  --app-gradient-xs: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-xs: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-xs: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-xs: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-xs: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-xs: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-xs: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-xs: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-xs: rgba(255, 255, 255, 0.18);
  --max-xs: 1200px;
  --min-xs: 0px;
  --spacer-xs: 1.6rem;
  --gutter-xs: 1.6rem;
  --mobile-xs: true;
  --app-bg-xs-l: #ffffff;
  --app-surface-xs-l: #ffffff;
  --app-surface-muted-xs-l: #f6f6f6;
  --app-border-xs-l: rgba(0, 0, 0, 0.22);
  --app-border-strong-xs-l: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-xs-l: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-xs-l: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-xs-l: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-xs-l: 4px;
  --app-radius-sm-xs-l: 8px;
  --app-radius-md-xs-l: 10px;
  --app-radius-lg-xs-l: 12px;
  --app-spacing-xs-l: 1rem;
  --app-spacing-lg-xs-l: 1.5rem;
  --app-spacing-xl-xs-l: 2.5rem;
  --app-primary-xs-l: #000000;
  --app-primary-strong-xs-l: #111111;
  --app-secondary-xs-l: #30c5f0;
  --app-secondary-dark-xs-l: #1697be;
  --app-text-xs-l: #101010;
  --app-text-muted-xs-l: #2c2c2c;
  --app-text-soft-xs-l: #555555;
  --app-success-xs-l: #2eb68b;
  --app-warning-xs-l: #f6a600;
  --app-danger-xs-l: #eb4a4a;
  --app-gradient-xs-l: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-xs-l: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-xs-l: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-xs-l: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-xs-l: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-xs-l: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-xs-l: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-xs-l: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-xs-l: rgba(255, 255, 255, 0.18);
  --orientation-xs-l: landscape;
  --breakpoint-xs-l: xs;
  --spacer-xs-l: 1.6rem;
  --gutter-xs-l: 1.6rem;
  --mobile-xs-l: true;
  --app-bg-sm: #ffffff;
  --app-surface-sm: #ffffff;
  --app-surface-muted-sm: #f6f6f6;
  --app-border-sm: rgba(0, 0, 0, 0.22);
  --app-border-strong-sm: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-sm: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-sm: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-sm: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-sm: 4px;
  --app-radius-sm-sm: 8px;
  --app-radius-md-sm: 10px;
  --app-radius-lg-sm: 12px;
  --app-spacing-sm: 1rem;
  --app-spacing-lg-sm: 1.5rem;
  --app-spacing-xl-sm: 2.5rem;
  --app-primary-sm: #000000;
  --app-primary-strong-sm: #111111;
  --app-secondary-sm: #30c5f0;
  --app-secondary-dark-sm: #1697be;
  --app-text-sm: #101010;
  --app-text-muted-sm: #2c2c2c;
  --app-text-soft-sm: #555555;
  --app-success-sm: #2eb68b;
  --app-warning-sm: #f6a600;
  --app-danger-sm: #eb4a4a;
  --app-gradient-sm: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-sm: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-sm: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-sm: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-sm: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-sm: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-sm: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-sm: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-sm: rgba(255, 255, 255, 0.18);
  --max-sm: 1200px;
  --min-sm: 768px;
  --spacer-sm: 1.6rem;
  --gutter-sm: 1.6rem;
  --mobile-sm: true;
  --app-bg-sm-l: #ffffff;
  --app-surface-sm-l: #ffffff;
  --app-surface-muted-sm-l: #f6f6f6;
  --app-border-sm-l: rgba(0, 0, 0, 0.22);
  --app-border-strong-sm-l: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-sm-l: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-sm-l: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-sm-l: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-sm-l: 4px;
  --app-radius-sm-sm-l: 8px;
  --app-radius-md-sm-l: 10px;
  --app-radius-lg-sm-l: 12px;
  --app-spacing-sm-l: 1rem;
  --app-spacing-lg-sm-l: 1.5rem;
  --app-spacing-xl-sm-l: 2.5rem;
  --app-primary-sm-l: #000000;
  --app-primary-strong-sm-l: #111111;
  --app-secondary-sm-l: #30c5f0;
  --app-secondary-dark-sm-l: #1697be;
  --app-text-sm-l: #101010;
  --app-text-muted-sm-l: #2c2c2c;
  --app-text-soft-sm-l: #555555;
  --app-success-sm-l: #2eb68b;
  --app-warning-sm-l: #f6a600;
  --app-danger-sm-l: #eb4a4a;
  --app-gradient-sm-l: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-sm-l: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-sm-l: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-sm-l: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-sm-l: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-sm-l: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-sm-l: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-sm-l: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-sm-l: rgba(255, 255, 255, 0.18);
  --orientation-sm-l: landscape;
  --breakpoint-sm-l: sm;
  --spacer-sm-l: 1.5rem;
  --gutter-sm-l: 1.5rem;
  --mobile-sm-l: true;
  --app-bg-md: #ffffff;
  --app-surface-md: #ffffff;
  --app-surface-muted-md: #f6f6f6;
  --app-border-md: rgba(0, 0, 0, 0.22);
  --app-border-strong-md: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-md: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-md: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-md: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-md: 4px;
  --app-radius-sm-md: 8px;
  --app-radius-md-md: 10px;
  --app-radius-lg-md: 12px;
  --app-spacing-md: 1rem;
  --app-spacing-lg-md: 1.5rem;
  --app-spacing-xl-md: 2.5rem;
  --app-primary-md: #000000;
  --app-primary-strong-md: #111111;
  --app-secondary-md: #30c5f0;
  --app-secondary-dark-md: #1697be;
  --app-text-md: #101010;
  --app-text-muted-md: #2c2c2c;
  --app-text-soft-md: #555555;
  --app-success-md: #2eb68b;
  --app-warning-md: #f6a600;
  --app-danger-md: #eb4a4a;
  --app-gradient-md: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-md: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-md: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-md: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-md: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-md: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-md: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-md: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-md: rgba(255, 255, 255, 0.18);
  --max-md: 10000px;
  --min-md: 1201px;
  --spacer-md: 1.6rem;
  --gutter-md: 1.6rem;
  --mobile-md: false;
  --app-bg-lg: #ffffff;
  --app-surface-lg: #ffffff;
  --app-surface-muted-lg: #f6f6f6;
  --app-border-lg: rgba(0, 0, 0, 0.22);
  --app-border-strong-lg: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-lg: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-lg: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-lg: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-lg: 4px;
  --app-radius-sm-lg: 8px;
  --app-radius-md-lg: 10px;
  --app-radius-lg-lg: 12px;
  --app-spacing-lg: 1rem;
  --app-spacing-lg-lg: 1.5rem;
  --app-spacing-xl-lg: 2.5rem;
  --app-primary-lg: #000000;
  --app-primary-strong-lg: #111111;
  --app-secondary-lg: #30c5f0;
  --app-secondary-dark-lg: #1697be;
  --app-text-lg: #101010;
  --app-text-muted-lg: #2c2c2c;
  --app-text-soft-lg: #555555;
  --app-success-lg: #2eb68b;
  --app-warning-lg: #f6a600;
  --app-danger-lg: #eb4a4a;
  --app-gradient-lg: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-lg: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-lg: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-lg: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-lg: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-lg: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-lg: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-lg: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-lg: rgba(255, 255, 255, 0.18);
  --max-lg: 10000px;
  --min-lg: 1441px;
  --spacer-lg: 1.8rem;
  --gutter-lg: 1.8rem;
  --mobile-lg: false;
  --app-bg-xl: #ffffff;
  --app-surface-xl: #ffffff;
  --app-surface-muted-xl: #f6f6f6;
  --app-border-xl: rgba(0, 0, 0, 0.22);
  --app-border-strong-xl: rgba(0, 0, 0, 0.5);
  --app-shadow-soft-xl: 0 8px 22px rgba(0, 0, 0, 0.08);
  --app-shadow-medium-xl: 0 12px 28px rgba(0, 0, 0, 0.2);
  --app-shadow-focus-xl: 0 0 0 3px rgba(48, 197, 240, 0.35);
  --app-radius-xs-xl: 4px;
  --app-radius-sm-xl: 8px;
  --app-radius-md-xl: 10px;
  --app-radius-lg-xl: 12px;
  --app-spacing-xl: 1rem;
  --app-spacing-lg-xl: 1.5rem;
  --app-spacing-xl-xl: 2.5rem;
  --app-primary-xl: #000000;
  --app-primary-strong-xl: #111111;
  --app-secondary-xl: #30c5f0;
  --app-secondary-dark-xl: #1697be;
  --app-text-xl: #101010;
  --app-text-muted-xl: #2c2c2c;
  --app-text-soft-xl: #555555;
  --app-success-xl: #2eb68b;
  --app-warning-xl: #f6a600;
  --app-danger-xl: #eb4a4a;
  --app-gradient-xl: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --app-gradient-dark-xl: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
  --accent-gradient-xl: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
  --btn-surface-bg-xl: rgba(255, 255, 255, 0.95);
  --btn-base-shadow-xl: 0 4px 10px rgba(0, 0, 0, 0.06);
  --btn-primary-shadow-xl: 0 12px 26px rgba(0, 0, 0, 0.16);
  --btn-primary-shadow-hover-xl: 0 14px 28px rgba(0, 0, 0, 0.2);
  --btn-ghost-border-xl: rgba(255, 255, 255, 0.48);
  --btn-ghost-hover-bg-xl: rgba(255, 255, 255, 0.18);
  --max-xl: 10000px;
  --min-xl: 1921px;
  --spacer-xl: 2rem;
  --gutter-xl: 2rem;
  --mobile-xl: false;
  --font-primary: 'DM Sans', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-secondary: 'DM Sans', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-title: 'DM Sans', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-mono: 'SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', monospace;
  --color-primary-900: -102, -102, -102;
  --color-primary-contrast-900: 153, 153, 153;
  --color-primary-800: -76.5, -76.5, -76.5;
  --color-primary-contrast-800: 153, 153, 153;
  --color-primary-700: -51, -51, -51;
  --color-primary-contrast-700: 153, 153, 153;
  --color-primary-600: -25.5, -25.5, -25.5;
  --color-primary-contrast-600: 153, 153, 153;
  --color-primary-500: 0, 0, 0;
  --color-primary-contrast-500: 153, 153, 153;
  --color-primary-400: 33.15, 33.15, 33.15;
  --color-primary-contrast-400: 153, 153, 153;
  --color-primary-300: 66.3, 66.3, 66.3;
  --color-primary-contrast-300: 153, 153, 153;
  --color-primary-200: 99.45, 99.45, 99.45;
  --color-primary-contrast-200: 0, 0, 0;
  --color-primary-100: 132.6, 132.6, 132.6;
  --color-primary-contrast-100: 0, 0, 0;
  --color-secondary-900: 5.6756756757, 62.0540540541, 78.3243243243;
  --color-secondary-contrast-900: 172.2, 231.8, 249;
  --color-secondary-800: 9.1216216216, 99.7297297297, 125.8783783784;
  --color-secondary-contrast-800: 172.2, 231.8, 249;
  --color-secondary-700: 12.5675675676, 137.4054054054, 173.4324324324;
  --color-secondary-contrast-700: 172.2, 231.8, 249;
  --color-secondary-600: 16.0135135135, 175.0810810811, 220.9864864865;
  --color-secondary-contrast-600: 8.7567567568, 95.7405405405, 120.8432432432;
  --color-secondary-500: 48, 197, 240;
  --color-secondary-contrast-500: 8.7567567568, 95.7405405405, 120.8432432432;
  --color-secondary-400: 109.8202702703, 214.3216216216, 244.4797297297;
  --color-secondary-contrast-400: 8.7567567568, 95.7405405405, 120.8432432432;
  --color-secondary-300: 171.6405405405, 231.6432432432, 248.9594594595;
  --color-secondary-contrast-300: 8.7567567568, 95.7405405405, 120.8432432432;
  --color-secondary-200: 233.4608108108, 248.9648648649, 253.4391891892;
  --color-secondary-contrast-200: 8.7567567568, 95.7405405405, 120.8432432432;
  --color-secondary-100: 295.2810810811, 266.2864864865, 257.9189189189;
  --color-secondary-contrast-100: 8.7567567568, 95.7405405405, 120.8432432432;
  --color-third-900: 166, 119.7571428571, 0;
  --color-third-contrast-900: 0, 0, 0;
  --color-third-800: 217, 156.55, 0;
  --color-third-contrast-800: 0, 0, 0;
  --color-third-700: 255, 187.5857142857, 13;
  --color-third-contrast-700: 0, 0, 0;
  --color-third-600: 255, 201.7928571429, 64;
  --color-third-contrast-600: 0, 0, 0;
  --color-third-500: 255, 216, 115;
  --color-third-contrast-500: 0, 0, 0;
  --color-third-400: 255, 234.4692857143, 181.3;
  --color-third-contrast-400: 0, 0, 0;
  --color-third-300: 255, 252.9385714286, 247.6;
  --color-third-contrast-300: 0, 0, 0;
  --color-third-200: 255, 271.4078571429, 313.9;
  --color-third-contrast-200: 0, 0, 0;
  --color-third-100: 255, 289.8771428571, 380.2;
  --color-third-contrast-100: 0, 0, 0;
  --color-accent-900: 153, 0, 76;
  --color-accent-contrast-900: 255, 255, 255;
  --color-accent-800: 204, 0, 101.3333333333;
  --color-accent-contrast-800: 255, 255, 255;
  --color-accent-700: 255, 0, 126.6666666667;
  --color-accent-contrast-700: 255, 255, 255;
  --color-accent-600: 255, 51, 152.3333333333;
  --color-accent-contrast-600: 255, 255, 255;
  --color-accent-500: 255, 102, 178;
  --color-accent-contrast-500: 142.8, 0, 70.9333333333;
  --color-accent-400: 255, 168.3, 211.3666666667;
  --color-accent-contrast-400: 142.8, 0, 70.9333333333;
  --color-accent-300: 255, 234.6, 244.7333333333;
  --color-accent-contrast-300: 142.8, 0, 70.9333333333;
  --color-accent-200: 255, 300.9, 278.1;
  --color-accent-contrast-200: 142.8, 0, 70.9333333333;
  --color-accent-100: 255, 367.2, 311.4666666667;
  --color-accent-contrast-100: 142.8, 0, 70.9333333333;
  --color-lgray-900: 19.0775510204, 21.0857142857, 21.9224489796;
  --color-lgray-contrast-900: 255, 255, 255;
  --color-lgray-800: 42.8081632653, 47.3142857143, 49.1918367347;
  --color-lgray-contrast-800: 255, 255, 255;
  --color-lgray-700: 66.5387755102, 73.5428571429, 76.4612244898;
  --color-lgray-contrast-700: 255, 255, 255;
  --color-lgray-600: 90.2693877551, 99.7714285714, 103.7306122449;
  --color-lgray-contrast-600: 255, 255, 255;
  --color-lgray-500: 114, 126, 131;
  --color-lgray-contrast-500: 0, 0, 0;
  --color-lgray-400: 148.7563265306, 158.4885714286, 162.5436734694;
  --color-lgray-contrast-400: 0, 0, 0;
  --color-lgray-300: 184.2065306122, 190.6914285714, 193.3934693878;
  --color-lgray-contrast-300: 0, 0, 0;
  --color-lgray-200: 219.6567346939, 222.8942857143, 224.2432653061;
  --color-lgray-contrast-200: 0, 0, 0;
  --color-lgray-100: 255.1069387755, 255.0971428571, 255.0930612245;
  --color-lgray-contrast-100: 0, 0, 0;
  --color-success-900: 4.8421052632, 19.1578947368, 14.6315789474;
  --color-success-contrast-900: 176.2131578947, 235.0868421053, 216.4723684211;
  --color-success-800: 15.1315789474, 59.8684210526, 45.7236842105;
  --color-success-contrast-800: 176.2131578947, 235.0868421053, 216.4723684211;
  --color-success-700: 25.4210526316, 100.5789473684, 76.8157894737;
  --color-success-contrast-700: 176.2131578947, 235.0868421053, 216.4723684211;
  --color-success-600: 35.7105263158, 141.2894736842, 107.9078947368;
  --color-success-contrast-600: 176.2131578947, 235.0868421053, 216.4723684211;
  --color-success-500: 46, 182, 139;
  --color-success-contrast-500: 20.7, 81.9, 62.55;
  --color-success-400: 82.8184210526, 211.4815789474, 170.8013157895;
  --color-success-contrast-400: 20.7, 81.9, 62.55;
  --color-success-300: 135.7421052632, 224.8578947368, 196.6815789474;
  --color-success-contrast-300: 20.7, 81.9, 62.55;
  --color-success-200: 188.6657894737, 238.2342105263, 222.5618421053;
  --color-success-contrast-200: 20.7, 81.9, 62.55;
  --color-success-100: 241.5894736842, 251.6105263158, 248.4421052632;
  --color-success-contrast-100: 20.7, 81.9, 62.55;
  --color-warning-900: 42, 28.3414634146, 0;
  --color-warning-contrast-900: 255, 216.3658536585, 136.2;
  --color-warning-800: 93, 62.756097561, 0;
  --color-warning-contrast-800: 255, 216.3658536585, 136.2;
  --color-warning-700: 144, 97.1707317073, 0;
  --color-warning-contrast-700: 255, 216.3658536585, 136.2;
  --color-warning-600: 195, 131.5853658537, 0;
  --color-warning-contrast-600: 110.7, 74.7, 0;
  --color-warning-500: 246, 166, 0;
  --color-warning-contrast-500: 110.7, 74.7, 0;
  --color-warning-400: 255, 190.7073170732, 57.3;
  --color-warning-contrast-400: 110.7, 74.7, 0;
  --color-warning-300: 255, 212.2682926829, 123.6;
  --color-warning-contrast-300: 110.7, 74.7, 0;
  --color-warning-200: 255, 233.8292682927, 189.9;
  --color-warning-contrast-200: 110.7, 74.7, 0;
  --color-warning-100: 255, 255.3902439024, 256.2;
  --color-warning-contrast-100: 110.7, 74.7, 0;
  --color-danger-900: 94.552238806, 10.447761194, 10.447761194;
  --color-danger-contrast-900: 246, 173.55, 173.55;
  --color-danger-800: 140.4776119403, 15.5223880597, 15.5223880597;
  --color-danger-contrast-800: 246, 173.55, 173.55;
  --color-danger-700: 186.4029850746, 20.5970149254, 20.5970149254;
  --color-danger-contrast-700: 246, 173.55, 173.55;
  --color-danger-600: 229.9253731343, 28.0746268657, 28.0746268657;
  --color-danger-contrast-600: 246, 173.55, 173.55;
  --color-danger-500: 235, 74, 74;
  --color-danger-contrast-500: 125.2141791045, 13.8358208955, 13.8358208955;
  --color-danger-400: 241.5970149254, 133.7029850746, 133.7029850746;
  --color-danger-contrast-400: 125.2141791045, 13.8358208955, 13.8358208955;
  --color-danger-300: 248.1940298507, 193.4059701493, 193.4059701493;
  --color-danger-contrast-300: 125.2141791045, 13.8358208955, 13.8358208955;
  --color-danger-200: 254.7910447761, 253.1089552239, 253.1089552239;
  --color-danger-contrast-200: 125.2141791045, 13.8358208955, 13.8358208955;
  --color-danger-100: 261.3880597015, 312.8119402985, 312.8119402985;
  --color-danger-contrast-100: 125.2141791045, 13.8358208955, 13.8358208955;
}

@media (min-width: 0px) and (max-width: 1200px) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --max: 1200px;
    --min: 0px;
    --spacer: 1.6rem;
    --gutter: 1.6rem;
    --mobile: true;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --orientation: landscape;
    --breakpoint: xs;
    --spacer: 1.6rem;
    --gutter: 1.6rem;
    --mobile: true;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --max: 1200px;
    --min: 768px;
    --spacer: 1.6rem;
    --gutter: 1.6rem;
    --mobile: true;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --orientation: landscape;
    --breakpoint: sm;
    --spacer: 1.5rem;
    --gutter: 1.5rem;
    --mobile: true;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --max: 10000px;
    --min: 1201px;
    --spacer: 1.6rem;
    --gutter: 1.6rem;
    --mobile: false;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --max: 10000px;
    --min: 1441px;
    --spacer: 1.8rem;
    --gutter: 1.8rem;
    --mobile: false;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  :root, :root *:after, :root *:before {
    --app-bg: #ffffff;
    --app-surface: #ffffff;
    --app-surface-muted: #f6f6f6;
    --app-border: rgba(0, 0, 0, 0.22);
    --app-border-strong: rgba(0, 0, 0, 0.5);
    --app-shadow-soft: 0 8px 22px rgba(0, 0, 0, 0.08);
    --app-shadow-medium: 0 12px 28px rgba(0, 0, 0, 0.2);
    --app-shadow-focus: 0 0 0 3px rgba(48, 197, 240, 0.35);
    --app-radius-xs: 4px;
    --app-radius-sm: 8px;
    --app-radius-md: 10px;
    --app-radius-lg: 12px;
    --app-spacing: 1rem;
    --app-spacing-lg: 1.5rem;
    --app-spacing-xl: 2.5rem;
    --app-primary: #000000;
    --app-primary-strong: #111111;
    --app-secondary: #30c5f0;
    --app-secondary-dark: #1697be;
    --app-text: #101010;
    --app-text-muted: #2c2c2c;
    --app-text-soft: #555555;
    --app-success: #2eb68b;
    --app-warning: #f6a600;
    --app-danger: #eb4a4a;
    --app-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --app-gradient-dark: linear-gradient(135deg, #19abd7, #f04ca1, #f9c74b);
    --accent-gradient: linear-gradient(135deg, #30c5f0, #ff66b2, #ffd873);
    --btn-surface-bg: rgba(255, 255, 255, 0.95);
    --btn-base-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    --btn-primary-shadow: 0 12px 26px rgba(0, 0, 0, 0.16);
    --btn-primary-shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.2);
    --btn-ghost-border: rgba(255, 255, 255, 0.48);
    --btn-ghost-hover-bg: rgba(255, 255, 255, 0.18);
    --max: 10000px;
    --min: 1921px;
    --spacer: 2rem;
    --gutter: 2rem;
    --mobile: false;
  }
}
/*# sourceMappingURL=main.css.map */