@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;
  @break;
  font-size: 16px;
  @break;
  @break;
  @break;
  @break;
  @break;
  @break;
  @break;
}
body.dark-theme {
  background-color: var(--bg-dark-default);
  color: var(--text-color-dark-default);
}
@media (min-width: 0px) and (max-width: 1200px) {
  body {
    font-size: 15.2px;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 12.8px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body {
    font-size: 15.2px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 12.8px;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body {
    font-size: 16px;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body {
    font-size: 16px;
  }
}
@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] {
  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;
  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]::placeholder, input[type=email]::placeholder, input[type=password]::placeholder, input[type=number]::placeholder {
  color: rgba(var(--color-lgray-800), 1);
}
input[type=text].required, input[type=email].required, input[type=password].required, input[type=number].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 {
  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) {
  border: 2px solid rgba(var(--color-lgray-600), 1);
}

select {
  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 {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  select {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  select {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  select {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  select {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  select {
    height: calc(var(--spacer) * 1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  select {
    height: calc(var(--spacer) * 1.5);
  }
}

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);
}

/*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));
}

/*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: 600;
}

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

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

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

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

@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));
}

.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);
}

.light {
  font-weight: 300;
}

.regular {
  font-weight: 400;
}

.medium {
  font-weight: 500;
}

.bold {
  font-weight: 600;
}

.extrabold {
  font-weight: 700;
}

.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);
  transition: background-color 0.3s ease 0s;
}
.video-button-wrapper button:hover path {
  fill: #fff;
}
.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 tr.highlight td {
  background-color: #fff7d6;
}
.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: 600;
  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-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-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);
    margin: calc(var(--spacer) * 0.25);
  }
  .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);
    margin: calc(var(--spacer) * 0.5);
  }
  .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);
    margin: calc(var(--spacer) * 0.5);
  }
  .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);
    margin: calc(var(--spacer) * 0.75);
  }
  .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);
    margin: calc(var(--spacer) * 1);
  }
  .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: 600;
}

.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;
}

textarea.editor {
  min-width: 100%;
}

.CodeMirror-wrap {
  margin-bottom: calc(var(--spacer) * 1);
  border-radius: calc(var(--spacer) * 0.25) !important;
}

.cm-s-juejin.CodeMirror {
  background-color: rgba(var(--color-primary-100), 0.2) !important;
}

.advanced-editing-fields label {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.advanced-editing-fields label .material-icons {
  margin-right: calc(var(--spacer) * 0.125);
}

.info-var-css-wrapper {
  position: relative;
}
.info-var-css-wrapper.open .info-var-css {
  display: flex;
}

a.btn-info-var-css {
  display: flex;
  align-items: center;
  height: 100%;
}

.info-var-css {
  position: absolute;
  white-space: nowrap;
  padding: calc(var(--spacer) * 0.25);
  background: white;
  top: 100%;
  right: 0;
  z-index: 100;
  display: none;
}

iframe#preview-frame {
  max-width: 100%;
}

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;
}

:root, :root *:after, :root *:before {
  --theme: default;
  --spacer: 2rem;
  --gutter: 2rem;
  --col: 12;
  --row: 12;
  --text-font: var(--font-primary);
  --text-color: rgba(var(--color-primary-500), 1);
  --text-color-dark: rgb(var(--color-primary-contrast-500));
  --headings-font: var(--font-primary);
  --headings-color: rgba(var(--color-primary-500), 1);
  --headings-color-dark: rgb(var(--color-primary-contrast-500));
  --bg-dark: black;
  --bg-light: white;
  --max-xs: 1200px;
  --min-xs: 0px;
  --spacer-xs: 1.6rem;
  --gutter-xs: 1.6rem;
  --mobile-xs: true;
  --orientation-xs-l: landscape;
  --breakpoint-xs-l: xs;
  --spacer-xs-l: 1.6rem;
  --gutter-xs-l: 1.6rem;
  --mobile-xs-l: true;
  --max-sm: 1200px;
  --min-sm: 768px;
  --spacer-sm: 1.6rem;
  --gutter-sm: 1.6rem;
  --mobile-sm: true;
  --orientation-sm-l: landscape;
  --breakpoint-sm-l: sm;
  --spacer-sm-l: 1.5rem;
  --gutter-sm-l: 1.5rem;
  --mobile-sm-l: true;
  --max-md: 10000px;
  --min-md: 1201px;
  --spacer-md: 1.6rem;
  --gutter-md: 1.6rem;
  --mobile-md: false;
  --max-lg: 10000px;
  --min-lg: 1441px;
  --spacer-lg: 1.8rem;
  --gutter-lg: 1.8rem;
  --mobile-lg: false;
  --max-xl: 10000px;
  --min-xl: 1921px;
  --spacer-xl: 2rem;
  --gutter-xl: 2rem;
  --mobile-xl: false;
  --font-primary: 'DM Sans', sans-serif;
  --font-secondary: 'DM Sans', sans-serif;
  --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: 0, 0, 0;
  --color-secondary-600: 16.0135135135, 175.0810810811, 220.9864864865;
  --color-secondary-contrast-600: 0, 0, 0;
  --color-secondary-500: 48, 197, 240;
  --color-secondary-contrast-500: 0, 0, 0;
  --color-secondary-400: 109.8202702703, 214.3216216216, 244.4797297297;
  --color-secondary-contrast-400: 0, 0, 0;
  --color-secondary-300: 171.6405405405, 231.6432432432, 248.9594594595;
  --color-secondary-contrast-300: 0, 0, 0;
  --color-secondary-200: 233.4608108108, 248.9648648649, 253.4391891892;
  --color-secondary-contrast-200: 0, 0, 0;
  --color-secondary-100: 295.2810810811, 266.2864864865, 257.9189189189;
  --color-secondary-contrast-100: 0, 0, 0;
  --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;
}

@media (min-width: 0px) and (max-width: 1200px) {
  :root, :root *:after, :root *:before {
    --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 {
    --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 {
    --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 {
    --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 {
    --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 {
    --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 {
    --max: 10000px;
    --min: 1921px;
    --spacer: 2rem;
    --gutter: 2rem;
    --mobile: false;
  }
}