:root {
  --color-main:#9DC4FF;
  --color-gray-dark: #101010;
  --color-gray: #000;
  --color-gray-light: #FBF9F7;
  --color-white: #ffffff;
  --header-height:3rem;
}

* {
  box-sizing: border-box;
}

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, address, em, img, q, strong, var, b, center, form, label, table, caption, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu, nav, output, ruby, section, summary, time, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  list-style: none;
}

a {
  color: inherit;
  font-weight: bold;
  text-decoration: none;
}

.compact, .nav ul {
  list-style-type: none;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
}

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

html {
  scroll-behavior: smooth;
}

.well, .swell {
  padding: 1.5rem;
  border: 1px solid var(--color-gray-dark);
  font-family: "Sneak", sans-serif;
  text-align: center;
}

.swell {
  background-color: var(--color-white);
  font-family: "Sneak", sans-serif;
}

.wrapper {
  margin: 0 auto;
}
.wrapper p::selection {
  background-color: #d0e3ff;
}
.wrapper h1::selection {
  background-color: #d0e3ff;
}
.wrapper h2::selection {
  background-color: #d0e3ff;
}
.wrapper h5::selection {
  background-color: #d0e3ff;
}
.wrapper a::selection {
  background-color: #d0e3ff;
}

.page {
  display: grid;
  grid-template-columns: 25vw 75vw;
  height: 100%;
}
@media screen and (max-width: 900px) {
  .page {
    grid-template-columns: auto;
  }
}

.sidebar {
  position: fixed;
  height: 100vh;
  width: 25vw;
  max-width: 500px;
}
@media screen and (max-width: 900px) {
  .sidebar {
    position: relative;
    width: 100%;
    height: auto;
  }
}
.sidebar header {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.6rem 3rem 1.6rem 1.6rem;
}
@media screen and (max-width: 900px) {
  .sidebar header {
    height: auto;
  }
}

.main {
  grid-column-start: 2;
  height: 100%;
  position: relative;
  padding-bottom: 5rem;
  max-width: 1500px;
  margin: 0 auto;
}
@media screen and (max-width: 900px) {
  .main {
    grid-column-start: 1;
    margin-bottom: 0;
  }
}
.main--padded {
  padding: 2.5rem;
}

.description {
  position: relative;
  padding: 0;
  width: 100%;
}
.description video {
  margin-top: 0;
}

.content {
  opacity: 0;
  position: absolute;
  color: #000;
  background-color: rgba(255, 255, 255, 0.95);
  width: 100%;
  height: 100%;
  transition: all 300ms ease-out;
}

.description .content:hover {
  opacity: 1;
}

.description .content .text {
  height: 100%;
  width: 100%;
  opacity: 1;
  transition-delay: 0s;
  transition-duration: 0.3s;
}

.description .content:hover .text {
  opacity: 1;
}

.project {
  margin: 40px;
}

section {
  margin-bottom: 5rem;
  max-width: 1200px;
}
section nav {
  margin-bottom: 2.5rem;
}
section.footer {
  margin-bottom: 0;
  position: absolute;
  width: 100%;
  bottom: 0;
}
@media screen and (max-width: 900px) {
  section {
    margin-bottom: 2.5rem;
  }
}

.nav {
  display: block;
}
.nav ul li {
  display: flex;
  align-items: flex-end;
}
.nav a {
  display: block;
  padding: 0.2em 0.5em;
  outline: none;
}
.navbar {
  color: var(--color-gray-light);
  line-height: var(--header-height);
}
.navbar h1 {
  margin: 0;
  font-size: 1.2em;
}
.nav--home a {
  display: inline-block;
  padding: 0.2em;
}

.desktop-only {
  display: inline;
}
@media screen and (max-width: 900px) {
  .desktop-only {
    display: none;
  }
}

.about {
  width: 200px;
}

iframe {
  width: 400;
  height: 600;
  margin-bottom: 6.25rem;
}
@media screen and (max-width: 500px) {
  iframe {
    width: 300;
  }
}

video {
  margin-top: 1.25rem;
  width: 100%;
}

.figma {
  border: none;
  width: 100%;
}

.container img {
  width: 100%;
  max-width: 1200px;
  object-fit: cover;
  max-height: 75vh;
}
.container--home {
  display: block;
  margin-top: 2.5rem;
}
.container--home a {
  display: inline-block;
  margin: 0.125rem;
}
@media screen and (max-width: 900px) {
  .container--home a {
    margin: 1.5rem;
  }
}
.container--home h5 {
  margin: 1rem 0 0.2rem 0;
}
.container--home img {
  margin-bottom: 0rem;
}

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

.child {
  font-size: 0.6875rem;
  font-family: "Sneak Mono", sans-serif;
  margin-top: 1.25rem;
  margin-left: 1.25rem;
  margin-bottom: 0;
}
.child--home {
  margin-top: 0.625rem;
  margin-left: 0rem;
}

.collection {
  padding: 0.125rem;
}

.appstore-button {
  background-image: url(../img/Download_on_the_App_Store_Badge_US-UK_RGB_blk_092917.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 9rem;
  height: 3rem;
}

.dark {
  background-color: var(--color-gray-dark);
}
.dark .headline {
  color: var(--color-white);
}

.letter-animation {
  width: auto;
  height: 100vw;
}
@media screen and (min-width: 900px) {
  .letter-animation {
    display: none;
  }
}

.typetester {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  border-bottom: solid 1px #000;
  margin-bottom: 4.375rem;
}

#typetester {
  background-color: var(--color-white);
}
@media screen and (max-width: 900px) {
  #typetester {
    display: none;
  }
}

.example-image-carousel {
  overflow: hidden;
  height: 37.5rem;
  position: relative;
  display: flex;
}
@media screen and (max-width: 900px) {
  .example-image-carousel {
    height: auto;
  }
}

.example-image-items {
  position: relative;
  flex: 1;
  overflow: hidden;
}

.example-image-item {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  max-width: 1400px;
  height: 100%;
  transition: transform 1s;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.example-image-item.first {
  left: 0;
}
.example-image-item.second {
  left: 100%;
}
@media screen and (max-width: 900px) {
  .example-image-item.second {
    left: 0;
  }
}
.example-image-item.third {
  left: 200%;
}
@media screen and (max-width: 900px) {
  .example-image-item.third {
    left: 0;
  }
}
.example-image-item.fourth {
  left: 300%;
}
@media screen and (max-width: 900px) {
  .example-image-item.fourth {
    left: 0;
  }
}
.example-image-item.fifth {
  left: 400%;
}
@media screen and (max-width: 900px) {
  .example-image-item.fifth {
    left: 0;
  }
}
.example-image-item.bernal-01 {
  background-image: url("../img/bernal-04.jpg");
}
.example-image-item.bernal-02 {
  background-image: url("../img/bernal-05.jpg");
}
.example-image-item.bernal-03 {
  background-image: url("../img/bernal-02.jpg");
}
.example-image-item.bernal-04 {
  background-image: url("../img/bernal-01.jpg");
}
.example-image-item.bernal-05 {
  background-image: url("../img/bernal-03.jpg");
}
.example-image-item.strucc-01 {
  background-image: url("../img/sweet-studio-10.jpg");
}
.example-image-item.strucc-02 {
  background-image: url("../img/sweet-studio-16.jpg");
}
.example-image-item.strucc-03 {
  background-image: url("../img/sweet-studio-17.jpg");
}
.example-image-item.strucc-04 {
  background-image: url("../img/sweet-studio-06.jpg");
}
.example-image-item.strucc-05 {
  background-image: url("../img/sweet-studio-08.jpg");
}
.example-image-item.groundwork-01 {
  background-image: url("../img/groundwork-02.jpg");
}
.example-image-item.groundwork-02 {
  background-image: url("../img/groundwork-03.jpg");
}
.example-image-item.groundwork-03 {
  background-image: url("../img/groundwork-04.jpg");
}
.example-image-item.groundwork-04 {
  background-image: url("../img/groundwork-05.jpg");
}
.example-image-item.groundwork-05 {
  background-image: url("../img/groundwork-06.jpg");
}
@media screen and (max-width: 900px) {
  .example-image-item {
    height: 31.25rem;
    position: relative;
  }
}
@media screen and (max-width: 500px) {
  .example-image-item {
    height: 18.75rem;
  }
}

.desktop-only {
  display: inline;
}
@media screen and (max-width: 1000px) {
  .desktop-only {
    display: none;
  }
}

.button {
  background-color: var(--color-gray-dark);
  color: var(--color-gray-light);
  width: 11.25rem;
  height: 3.125rem;
  border: none;
  outline: none;
  cursor: pointer;
  margin: 2.5rem 0;
  transition: all 100ms ease-out;
}
.button:hover {
  background-color: transparent;
  color: var(--color-gray-dark);
  border: solid 1px black;
  transition-duration: 0.1s;
}

@media screen and (max-width: 900px) {
  #download {
    display: none;
  }
}

@media screen and (max-width: 900px) {
  .language-markup, .language-css {
    display: none;
  }
}

@font-face {
  font-family: Bernal;
  src: url("../fonts/Bernal-Regular.otf") format("opentype");
}
@font-face {
  font-family: Sneak Regular;
  src: url("../fonts/Sneak-Regular.otf") format("opentype");
}
@font-face {
  font-family: Sneak Mono;
  src: url("../fonts/Sneak-Mono.otf") format("opentype");
}
h1,
.h1 {
  font-family: "Inter", sans-serif;
  font-size: 2.625rem;
  margin-bottom: 1.25rem;
}
@media screen and (max-width: 900px) {
  h1,
.h1 {
    font-size: 2.25rem;
  }
}

.bernal {
  font-family: "Bernal", sans-serif;
}

h2 {
  font-family: "Inter", sans-serif;
  font-size: 2.25rem;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 900px) {
  h2 {
    font-size: 1.75rem;
  }
}

h3 {
  font-family: "Inter", sans-serif;
  font-size: 2rem;
  margin-bottom: 1rem;
}
@media screen and (max-width: 900px) {
  h3 {
    font-size: 1.75rem;
  }
}

h4 {
  font-family: "Inter", sans-serif;
  font-size: 1rem;
  margin-bottom: 1rem;
  margin-top: 2.25rem;
  text-transform: uppercase;
}
@media screen and (max-width: 900px) {
  h4 {
    font-size: 1.25rem;
  }
}

h5 {
  font-family: "Sneak Mono", sans-serif;
  font-size: 0.875rem;
}
@media screen and (max-width: 900px) {
  h5 {
    font-size: 1.25rem;
  }
}

a {
  font-weight: 500;
}
a:hover {
  color: #000;
}

header {
  font-family: "Sneak Mono", sans-serif;
}
header h2 {
  font-family: "Sneak Mono", sans-serif;
  font-size: 1.75rem;
  margin-top: 3.75rem;
  margin-bottom: 0rem;
}
@media screen and (max-width: 900px) {
  header h2 {
    font-size: 1.75rem;
  }
}
header p {
  font-size: 0.75rem;
  line-height: 1.225rem;
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 900px) {
  header p {
    font-size: 1.125rem;
    line-height: 1.4rem;
    max-width: 34rem;
  }
}
header a {
  font-size: 0.6875rem;
  color: #000;
}
header a:hover {
  text-decoration: underline;
  color: #101010;
}
@media screen and (max-width: 900px) {
  header a {
    font-size: 1.125rem;
  }
}

p {
  font-family: "Inter", sans-serif;
  line-height: 1.4rem;
  margin-bottom: 1.25rem;
}
@media screen and (max-width: 900px) {
  p {
    font-size: 1.125rem;
    max-width: 34rem;
  }
}

.text {
  font-family: "Inter", sans-serif;
  font-size: 1.75rem;
  line-height: 1.75rem;
  padding: 1rem;
}
.text span {
  font-family: "Sneak Mono", serif;
  font-size: 0.875rem;
}
.text a {
  text-decoration: underline;
}

.mono {
  font-family: "Sneak Mono", serif;
  margin-bottom: 0.875rem;
  font-size: 0.6875rem;
}

.italic {
  font-style: italic;
  margin-bottom: 2rem;
}

.headline {
  font-family: "Sneak Mono", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  color: #000;
  padding-top: 1.5rem;
}

.characters {
  font-family: "Bernal", sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 3.675rem;
  color: #ffffff;
  padding: 2.625rem;
  word-break: break-all;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 900px) {
  .characters {
    display: none;
  }
}
.characters span {
  cursor: default;
  display: inline-block;
  width: 1.5em;
  text-align: center;
}
.characters span:hover {
  color: #101010;
  background-color: #9DC4FF;
  position: relative;
  z-index: 2;
  transform: scale(3, 3);
}

input::placeholder {
  color: #4d4d4d;
  line-height: 1.6;
}

.typetester {
  font-family: "Bernal", sans-serif;
  font-size: 4rem;
  line-height: 1.6;
}

.button {
  font-size: 1rem;
}

.active-link {
  color: #101010;
}

.text-link {
  font-family: "Sneak Regular", sans-serif;
  font-size: 1rem;
  color: #9DC4FF;
  font-weight: 500;
  text-decoration: underline dashed;
  margin-bottom: 1.5rem;
}
.text-link:hover {
  color: #101010;
}
@media screen and (max-width: 900px) {
  .text-link {
    margin-bottom: 2.625rem;
  }
}

.footer-text {
  font-family: "Sneak Mono", sans-serif;
  font-size: 0.6875rem;
  color: #333333;
  line-height: 1.8;
  padding-right: 1.5rem;
  margin-bottom: 1rem;
  text-align: right;
}
.footer-text--dark {
  font-family: "Sneak Mono", sans-serif;
  font-size: 0.75rem;
  line-height: 1.8;
  padding-left: 1.5rem;
  margin-bottom: 1rem;
  color: black;
}

.grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
}
.grid.gap {
  grid-gap: var(--gap-size);
  --gap-size: 1rem;
}

.col--1 {
  grid-column-end: span 1;
}

.offset--1 {
  grid-column-start: 1;
}

.col--2 {
  grid-column-end: span 2;
}

.offset--2 {
  grid-column-start: 2;
}

.col--3 {
  grid-column-end: span 3;
}

.offset--3 {
  grid-column-start: 3;
}

.col--4 {
  grid-column-end: span 4;
}

.offset--4 {
  grid-column-start: 4;
}

.col--5 {
  grid-column-end: span 5;
}

.offset--5 {
  grid-column-start: 5;
}

.col--6 {
  grid-column-end: span 6;
}

.offset--6 {
  grid-column-start: 6;
}

.col--7 {
  grid-column-end: span 7;
}

.offset--7 {
  grid-column-start: 7;
}

.col--8 {
  grid-column-end: span 8;
}

.offset--8 {
  grid-column-start: 8;
}

.col--9 {
  grid-column-end: span 9;
}

.offset--9 {
  grid-column-start: 9;
}

.col--10 {
  grid-column-end: span 10;
}

.offset--10 {
  grid-column-start: 10;
}

.col--11 {
  grid-column-end: span 11;
}

.offset--11 {
  grid-column-start: 11;
}

.col--12 {
  grid-column-end: span 12;
}

.offset--12 {
  grid-column-start: 12;
}

@media (min-width: 0) {
  .row-xs-12 {
    grid-template-columns: repeat(12, 1fr);
  }

  .row-xs-10 {
    grid-template-columns: repeat(10, 1fr);
  }

  .grid.gap-xs-xl {
    --gap-size:3rem;
  }

  .grid.gap-xs-l {
    --gap-size:1.5rem;
  }

  .grid.gap-xs-m {
    --gap-size:1rem;
  }

  .grid.gap-xs-s {
    --gap-size:0.5rem;
  }

  .grid.gap-xs-n {
    --gap-size:0;
  }

  .col-xs-1 {
    grid-column-end: span 1;
  }

  .offset-xs-1 {
    grid-column-start: 1;
  }

  .col-xs-2 {
    grid-column-end: span 2;
  }

  .offset-xs-2 {
    grid-column-start: 2;
  }

  .col-xs-3 {
    grid-column-end: span 3;
  }

  .offset-xs-3 {
    grid-column-start: 3;
  }

  .col-xs-4 {
    grid-column-end: span 4;
  }

  .offset-xs-4 {
    grid-column-start: 4;
  }

  .col-xs-5 {
    grid-column-end: span 5;
  }

  .offset-xs-5 {
    grid-column-start: 5;
  }

  .col-xs-6 {
    grid-column-end: span 6;
  }

  .offset-xs-6 {
    grid-column-start: 6;
  }

  .col-xs-7 {
    grid-column-end: span 7;
  }

  .offset-xs-7 {
    grid-column-start: 7;
  }

  .col-xs-8 {
    grid-column-end: span 8;
  }

  .offset-xs-8 {
    grid-column-start: 8;
  }

  .col-xs-9 {
    grid-column-end: span 9;
  }

  .offset-xs-9 {
    grid-column-start: 9;
  }

  .col-xs-10 {
    grid-column-end: span 10;
  }

  .offset-xs-10 {
    grid-column-start: 10;
  }

  .col-xs-11 {
    grid-column-end: span 11;
  }

  .offset-xs-11 {
    grid-column-start: 11;
  }

  .col-xs-12 {
    grid-column-end: span 12;
  }

  .offset-xs-12 {
    grid-column-start: 12;
  }

  .p-xs-txl {
    padding-top: 3rem;
  }

  .p-xs-rxl {
    padding-right: 3rem;
  }

  .p-xs-bxl {
    padding-bottom: 3rem;
  }

  .p-xs-lxl {
    padding-left: 3rem;
  }

  .p-xs-hxl {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .p-xs-vxl {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .p-xs-xl {
    padding: 3rem;
  }

  .p-xs-tl {
    padding-top: 1.5rem;
  }

  .p-xs-rl {
    padding-right: 1.5rem;
  }

  .p-xs-bl {
    padding-bottom: 1.5rem;
  }

  .p-xs-ll {
    padding-left: 1.5rem;
  }

  .p-xs-hl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .p-xs-vl {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .p-xs-l {
    padding: 1.5rem;
  }

  .p-xs-tm {
    padding-top: 1rem;
  }

  .p-xs-rm {
    padding-right: 1rem;
  }

  .p-xs-bm {
    padding-bottom: 1rem;
  }

  .p-xs-lm {
    padding-left: 1rem;
  }

  .p-xs-hm {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .p-xs-vm {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .p-xs-m {
    padding: 1rem;
  }

  .p-xs-ts {
    padding-top: 0.5rem;
  }

  .p-xs-rs {
    padding-right: 0.5rem;
  }

  .p-xs-bs {
    padding-bottom: 0.5rem;
  }

  .p-xs-ls {
    padding-left: 0.5rem;
  }

  .p-xs-hs {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .p-xs-vs {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .p-xs-s {
    padding: 0.5rem;
  }

  .p-xs-tn {
    padding-top: 0;
  }

  .p-xs-rn {
    padding-right: 0;
  }

  .p-xs-bn {
    padding-bottom: 0;
  }

  .p-xs-ln {
    padding-left: 0;
  }

  .p-xs-hn {
    padding-left: 0;
    padding-right: 0;
  }

  .p-xs-vn {
    padding-top: 0;
    padding-bottom: 0;
  }

  .p-xs-n {
    padding: 0;
  }

  .m-xs-txl {
    margin-top: 3rem;
  }

  .m-xs-rxl {
    margin-right: 3rem;
  }

  .m-xs-bxl {
    margin-bottom: 3rem;
  }

  .m-xs-lxl {
    margin-left: 3rem;
  }

  .m-xs-hxl {
    margin-left: 3rem;
    margin-right: 3rem;
  }

  .m-xs-vxl {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .m-xs-xl {
    margin: 3rem;
  }

  .m-xs-tl {
    margin-top: 1.5rem;
  }

  .m-xs-rl {
    margin-right: 1.5rem;
  }

  .m-xs-bl {
    margin-bottom: 1.5rem;
  }

  .m-xs-ll {
    margin-left: 1.5rem;
  }

  .m-xs-hl {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }

  .m-xs-vl {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .m-xs-l {
    margin: 1.5rem;
  }

  .m-xs-tm {
    margin-top: 1rem;
  }

  .m-xs-rm {
    margin-right: 1rem;
  }

  .m-xs-bm {
    margin-bottom: 1rem;
  }

  .m-xs-lm {
    margin-left: 1rem;
  }

  .m-xs-hm {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .m-xs-vm {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .m-xs-m {
    margin: 1rem;
  }

  .m-xs-ts {
    margin-top: 0.5rem;
  }

  .m-xs-rs {
    margin-right: 0.5rem;
  }

  .m-xs-bs {
    margin-bottom: 0.5rem;
  }

  .m-xs-ls {
    margin-left: 0.5rem;
  }

  .m-xs-hs {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .m-xs-vs {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }

  .m-xs-s {
    margin: 0.5rem;
  }

  .m-xs-tn {
    margin-top: 0;
  }

  .m-xs-rn {
    margin-right: 0;
  }

  .m-xs-bn {
    margin-bottom: 0;
  }

  .m-xs-ln {
    margin-left: 0;
  }

  .m-xs-hn {
    margin-left: 0;
    margin-right: 0;
  }

  .m-xs-vn {
    margin-top: 0;
    margin-bottom: 0;
  }

  .m-xs-n {
    margin: 0;
  }

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

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

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

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

  .align-xs-t {
    vertical-align: top;
  }

  .align-xs-m {
    vertical-align: middle;
  }

  .align-xs-b {
    vertical-align: bottom;
  }

  .align-xs-bl {
    vertical-align: baseline;
  }

  .align-xs-tb {
    vertical-align: text-bottom;
  }

  .display-xs-b {
    display: block;
  }

  .display-xs-i {
    display: inline;
  }

  .display-xs-inb {
    display: inline-block;
  }

  .display-xs-f {
    display: flex;
  }

  .display-xs-inf {
    display: inline-flex;
  }

  .display-xs-n {
    display: none;
  }

  .position-xs-s {
    position: static;
  }

  .position-xs-r {
    position: relative;
  }

  .position-xs-a {
    position: absolute;
  }

  .position-xs-f {
    position: fixed;
  }

  .flex-xs-parent {
    display: flex;
  }
  .flex-xs-child {
    flex: 1 1 auto;
  }
  .flex-xs-none {
    flex: none;
  }
  .flex-xs-wrap {
    flex-wrap: wrap;
  }
  .flex-xs-vertical {
    flex-direction: column;
  }
  .flex-xs-align-center {
    align-items: center;
  }
  .flex-xs-justify-center {
    justify-content: center;
  }

  .order-xs-1 {
    order: 1;
  }

  .order-xs-2 {
    order: 2;
  }

  .order-xs-3 {
    order: 3;
  }

  .order-xs-4 {
    order: 4;
  }

  .order-xs-5 {
    order: 5;
  }

  .order-xs-6 {
    order: 6;
  }

  .order-xs-7 {
    order: 7;
  }

  .order-xs-8 {
    order: 8;
  }

  .order-xs-9 {
    order: 9;
  }

  .order-xs-10 {
    order: 10;
  }
}
@media (min-width: 500px) {
  .row-sm-12 {
    grid-template-columns: repeat(12, 1fr);
  }

  .row-sm-10 {
    grid-template-columns: repeat(10, 1fr);
  }

  .grid.gap-sm-xl {
    --gap-size:3rem;
  }

  .grid.gap-sm-l {
    --gap-size:1.5rem;
  }

  .grid.gap-sm-m {
    --gap-size:1rem;
  }

  .grid.gap-sm-s {
    --gap-size:0.5rem;
  }

  .grid.gap-sm-n {
    --gap-size:0;
  }

  .col-sm-1 {
    grid-column-end: span 1;
  }

  .offset-sm-1 {
    grid-column-start: 1;
  }

  .col-sm-2 {
    grid-column-end: span 2;
  }

  .offset-sm-2 {
    grid-column-start: 2;
  }

  .col-sm-3 {
    grid-column-end: span 3;
  }

  .offset-sm-3 {
    grid-column-start: 3;
  }

  .col-sm-4 {
    grid-column-end: span 4;
  }

  .offset-sm-4 {
    grid-column-start: 4;
  }

  .col-sm-5 {
    grid-column-end: span 5;
  }

  .offset-sm-5 {
    grid-column-start: 5;
  }

  .col-sm-6 {
    grid-column-end: span 6;
  }

  .offset-sm-6 {
    grid-column-start: 6;
  }

  .col-sm-7 {
    grid-column-end: span 7;
  }

  .offset-sm-7 {
    grid-column-start: 7;
  }

  .col-sm-8 {
    grid-column-end: span 8;
  }

  .offset-sm-8 {
    grid-column-start: 8;
  }

  .col-sm-9 {
    grid-column-end: span 9;
  }

  .offset-sm-9 {
    grid-column-start: 9;
  }

  .col-sm-10 {
    grid-column-end: span 10;
  }

  .offset-sm-10 {
    grid-column-start: 10;
  }

  .col-sm-11 {
    grid-column-end: span 11;
  }

  .offset-sm-11 {
    grid-column-start: 11;
  }

  .col-sm-12 {
    grid-column-end: span 12;
  }

  .offset-sm-12 {
    grid-column-start: 12;
  }

  .p-sm-txl {
    padding-top: 3rem;
  }

  .p-sm-rxl {
    padding-right: 3rem;
  }

  .p-sm-bxl {
    padding-bottom: 3rem;
  }

  .p-sm-lxl {
    padding-left: 3rem;
  }

  .p-sm-hxl {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .p-sm-vxl {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .p-sm-xl {
    padding: 3rem;
  }

  .p-sm-tl {
    padding-top: 1.5rem;
  }

  .p-sm-rl {
    padding-right: 1.5rem;
  }

  .p-sm-bl {
    padding-bottom: 1.5rem;
  }

  .p-sm-ll {
    padding-left: 1.5rem;
  }

  .p-sm-hl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .p-sm-vl {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .p-sm-l {
    padding: 1.5rem;
  }

  .p-sm-tm {
    padding-top: 1rem;
  }

  .p-sm-rm {
    padding-right: 1rem;
  }

  .p-sm-bm {
    padding-bottom: 1rem;
  }

  .p-sm-lm {
    padding-left: 1rem;
  }

  .p-sm-hm {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .p-sm-vm {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .p-sm-m {
    padding: 1rem;
  }

  .p-sm-ts {
    padding-top: 0.5rem;
  }

  .p-sm-rs {
    padding-right: 0.5rem;
  }

  .p-sm-bs {
    padding-bottom: 0.5rem;
  }

  .p-sm-ls {
    padding-left: 0.5rem;
  }

  .p-sm-hs {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .p-sm-vs {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .p-sm-s {
    padding: 0.5rem;
  }

  .p-sm-tn {
    padding-top: 0;
  }

  .p-sm-rn {
    padding-right: 0;
  }

  .p-sm-bn {
    padding-bottom: 0;
  }

  .p-sm-ln {
    padding-left: 0;
  }

  .p-sm-hn {
    padding-left: 0;
    padding-right: 0;
  }

  .p-sm-vn {
    padding-top: 0;
    padding-bottom: 0;
  }

  .p-sm-n {
    padding: 0;
  }

  .m-sm-txl {
    margin-top: 3rem;
  }

  .m-sm-rxl {
    margin-right: 3rem;
  }

  .m-sm-bxl {
    margin-bottom: 3rem;
  }

  .m-sm-lxl {
    margin-left: 3rem;
  }

  .m-sm-hxl {
    margin-left: 3rem;
    margin-right: 3rem;
  }

  .m-sm-vxl {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .m-sm-xl {
    margin: 3rem;
  }

  .m-sm-tl {
    margin-top: 1.5rem;
  }

  .m-sm-rl {
    margin-right: 1.5rem;
  }

  .m-sm-bl {
    margin-bottom: 1.5rem;
  }

  .m-sm-ll {
    margin-left: 1.5rem;
  }

  .m-sm-hl {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }

  .m-sm-vl {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .m-sm-l {
    margin: 1.5rem;
  }

  .m-sm-tm {
    margin-top: 1rem;
  }

  .m-sm-rm {
    margin-right: 1rem;
  }

  .m-sm-bm {
    margin-bottom: 1rem;
  }

  .m-sm-lm {
    margin-left: 1rem;
  }

  .m-sm-hm {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .m-sm-vm {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .m-sm-m {
    margin: 1rem;
  }

  .m-sm-ts {
    margin-top: 0.5rem;
  }

  .m-sm-rs {
    margin-right: 0.5rem;
  }

  .m-sm-bs {
    margin-bottom: 0.5rem;
  }

  .m-sm-ls {
    margin-left: 0.5rem;
  }

  .m-sm-hs {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .m-sm-vs {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }

  .m-sm-s {
    margin: 0.5rem;
  }

  .m-sm-tn {
    margin-top: 0;
  }

  .m-sm-rn {
    margin-right: 0;
  }

  .m-sm-bn {
    margin-bottom: 0;
  }

  .m-sm-ln {
    margin-left: 0;
  }

  .m-sm-hn {
    margin-left: 0;
    margin-right: 0;
  }

  .m-sm-vn {
    margin-top: 0;
    margin-bottom: 0;
  }

  .m-sm-n {
    margin: 0;
  }

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

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

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

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

  .align-sm-t {
    vertical-align: top;
  }

  .align-sm-m {
    vertical-align: middle;
  }

  .align-sm-b {
    vertical-align: bottom;
  }

  .align-sm-bl {
    vertical-align: baseline;
  }

  .align-sm-tb {
    vertical-align: text-bottom;
  }

  .display-sm-b {
    display: block;
  }

  .display-sm-i {
    display: inline;
  }

  .display-sm-inb {
    display: inline-block;
  }

  .display-sm-f {
    display: flex;
  }

  .display-sm-inf {
    display: inline-flex;
  }

  .display-sm-n {
    display: none;
  }

  .position-sm-s {
    position: static;
  }

  .position-sm-r {
    position: relative;
  }

  .position-sm-a {
    position: absolute;
  }

  .position-sm-f {
    position: fixed;
  }

  .flex-sm-parent {
    display: flex;
  }
  .flex-sm-child {
    flex: 1 1 auto;
  }
  .flex-sm-none {
    flex: none;
  }
  .flex-sm-wrap {
    flex-wrap: wrap;
  }
  .flex-sm-vertical {
    flex-direction: column;
  }
  .flex-sm-align-center {
    align-items: center;
  }
  .flex-sm-justify-center {
    justify-content: center;
  }

  .order-sm-1 {
    order: 1;
  }

  .order-sm-2 {
    order: 2;
  }

  .order-sm-3 {
    order: 3;
  }

  .order-sm-4 {
    order: 4;
  }

  .order-sm-5 {
    order: 5;
  }

  .order-sm-6 {
    order: 6;
  }

  .order-sm-7 {
    order: 7;
  }

  .order-sm-8 {
    order: 8;
  }

  .order-sm-9 {
    order: 9;
  }

  .order-sm-10 {
    order: 10;
  }
}
@media (min-width: 900px) {
  .row-md-12 {
    grid-template-columns: repeat(12, 1fr);
  }

  .row-md-10 {
    grid-template-columns: repeat(10, 1fr);
  }

  .grid.gap-md-xl {
    --gap-size:3rem;
  }

  .grid.gap-md-l {
    --gap-size:1.5rem;
  }

  .grid.gap-md-m {
    --gap-size:1rem;
  }

  .grid.gap-md-s {
    --gap-size:0.5rem;
  }

  .grid.gap-md-n {
    --gap-size:0;
  }

  .col-md-1 {
    grid-column-end: span 1;
  }

  .offset-md-1 {
    grid-column-start: 1;
  }

  .col-md-2 {
    grid-column-end: span 2;
  }

  .offset-md-2 {
    grid-column-start: 2;
  }

  .col-md-3 {
    grid-column-end: span 3;
  }

  .offset-md-3 {
    grid-column-start: 3;
  }

  .col-md-4 {
    grid-column-end: span 4;
  }

  .offset-md-4 {
    grid-column-start: 4;
  }

  .col-md-5 {
    grid-column-end: span 5;
  }

  .offset-md-5 {
    grid-column-start: 5;
  }

  .col-md-6 {
    grid-column-end: span 6;
  }

  .offset-md-6 {
    grid-column-start: 6;
  }

  .col-md-7 {
    grid-column-end: span 7;
  }

  .offset-md-7 {
    grid-column-start: 7;
  }

  .col-md-8 {
    grid-column-end: span 8;
  }

  .offset-md-8 {
    grid-column-start: 8;
  }

  .col-md-9 {
    grid-column-end: span 9;
  }

  .offset-md-9 {
    grid-column-start: 9;
  }

  .col-md-10 {
    grid-column-end: span 10;
  }

  .offset-md-10 {
    grid-column-start: 10;
  }

  .col-md-11 {
    grid-column-end: span 11;
  }

  .offset-md-11 {
    grid-column-start: 11;
  }

  .col-md-12 {
    grid-column-end: span 12;
  }

  .offset-md-12 {
    grid-column-start: 12;
  }

  .p-md-txl {
    padding-top: 3rem;
  }

  .p-md-rxl {
    padding-right: 3rem;
  }

  .p-md-bxl {
    padding-bottom: 3rem;
  }

  .p-md-lxl {
    padding-left: 3rem;
  }

  .p-md-hxl {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .p-md-vxl {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .p-md-xl {
    padding: 3rem;
  }

  .p-md-tl {
    padding-top: 1.5rem;
  }

  .p-md-rl {
    padding-right: 1.5rem;
  }

  .p-md-bl {
    padding-bottom: 1.5rem;
  }

  .p-md-ll {
    padding-left: 1.5rem;
  }

  .p-md-hl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .p-md-vl {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .p-md-l {
    padding: 1.5rem;
  }

  .p-md-tm {
    padding-top: 1rem;
  }

  .p-md-rm {
    padding-right: 1rem;
  }

  .p-md-bm {
    padding-bottom: 1rem;
  }

  .p-md-lm {
    padding-left: 1rem;
  }

  .p-md-hm {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .p-md-vm {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .p-md-m {
    padding: 1rem;
  }

  .p-md-ts {
    padding-top: 0.5rem;
  }

  .p-md-rs {
    padding-right: 0.5rem;
  }

  .p-md-bs {
    padding-bottom: 0.5rem;
  }

  .p-md-ls {
    padding-left: 0.5rem;
  }

  .p-md-hs {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .p-md-vs {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .p-md-s {
    padding: 0.5rem;
  }

  .p-md-tn {
    padding-top: 0;
  }

  .p-md-rn {
    padding-right: 0;
  }

  .p-md-bn {
    padding-bottom: 0;
  }

  .p-md-ln {
    padding-left: 0;
  }

  .p-md-hn {
    padding-left: 0;
    padding-right: 0;
  }

  .p-md-vn {
    padding-top: 0;
    padding-bottom: 0;
  }

  .p-md-n {
    padding: 0;
  }

  .m-md-txl {
    margin-top: 3rem;
  }

  .m-md-rxl {
    margin-right: 3rem;
  }

  .m-md-bxl {
    margin-bottom: 3rem;
  }

  .m-md-lxl {
    margin-left: 3rem;
  }

  .m-md-hxl {
    margin-left: 3rem;
    margin-right: 3rem;
  }

  .m-md-vxl {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .m-md-xl {
    margin: 3rem;
  }

  .m-md-tl {
    margin-top: 1.5rem;
  }

  .m-md-rl {
    margin-right: 1.5rem;
  }

  .m-md-bl {
    margin-bottom: 1.5rem;
  }

  .m-md-ll {
    margin-left: 1.5rem;
  }

  .m-md-hl {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }

  .m-md-vl {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .m-md-l {
    margin: 1.5rem;
  }

  .m-md-tm {
    margin-top: 1rem;
  }

  .m-md-rm {
    margin-right: 1rem;
  }

  .m-md-bm {
    margin-bottom: 1rem;
  }

  .m-md-lm {
    margin-left: 1rem;
  }

  .m-md-hm {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .m-md-vm {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .m-md-m {
    margin: 1rem;
  }

  .m-md-ts {
    margin-top: 0.5rem;
  }

  .m-md-rs {
    margin-right: 0.5rem;
  }

  .m-md-bs {
    margin-bottom: 0.5rem;
  }

  .m-md-ls {
    margin-left: 0.5rem;
  }

  .m-md-hs {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .m-md-vs {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }

  .m-md-s {
    margin: 0.5rem;
  }

  .m-md-tn {
    margin-top: 0;
  }

  .m-md-rn {
    margin-right: 0;
  }

  .m-md-bn {
    margin-bottom: 0;
  }

  .m-md-ln {
    margin-left: 0;
  }

  .m-md-hn {
    margin-left: 0;
    margin-right: 0;
  }

  .m-md-vn {
    margin-top: 0;
    margin-bottom: 0;
  }

  .m-md-n {
    margin: 0;
  }

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

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

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

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

  .align-md-t {
    vertical-align: top;
  }

  .align-md-m {
    vertical-align: middle;
  }

  .align-md-b {
    vertical-align: bottom;
  }

  .align-md-bl {
    vertical-align: baseline;
  }

  .align-md-tb {
    vertical-align: text-bottom;
  }

  .display-md-b {
    display: block;
  }

  .display-md-i {
    display: inline;
  }

  .display-md-inb {
    display: inline-block;
  }

  .display-md-f {
    display: flex;
  }

  .display-md-inf {
    display: inline-flex;
  }

  .display-md-n {
    display: none;
  }

  .position-md-s {
    position: static;
  }

  .position-md-r {
    position: relative;
  }

  .position-md-a {
    position: absolute;
  }

  .position-md-f {
    position: fixed;
  }

  .flex-md-parent {
    display: flex;
  }
  .flex-md-child {
    flex: 1 1 auto;
  }
  .flex-md-none {
    flex: none;
  }
  .flex-md-wrap {
    flex-wrap: wrap;
  }
  .flex-md-vertical {
    flex-direction: column;
  }
  .flex-md-align-center {
    align-items: center;
  }
  .flex-md-justify-center {
    justify-content: center;
  }

  .order-md-1 {
    order: 1;
  }

  .order-md-2 {
    order: 2;
  }

  .order-md-3 {
    order: 3;
  }

  .order-md-4 {
    order: 4;
  }

  .order-md-5 {
    order: 5;
  }

  .order-md-6 {
    order: 6;
  }

  .order-md-7 {
    order: 7;
  }

  .order-md-8 {
    order: 8;
  }

  .order-md-9 {
    order: 9;
  }

  .order-md-10 {
    order: 10;
  }
}
@media (min-width: 1000px) {
  .row-lg-12 {
    grid-template-columns: repeat(12, 1fr);
  }

  .row-lg-10 {
    grid-template-columns: repeat(10, 1fr);
  }

  .grid.gap-lg-xl {
    --gap-size:3rem;
  }

  .grid.gap-lg-l {
    --gap-size:1.5rem;
  }

  .grid.gap-lg-m {
    --gap-size:1rem;
  }

  .grid.gap-lg-s {
    --gap-size:0.5rem;
  }

  .grid.gap-lg-n {
    --gap-size:0;
  }

  .col-lg-1 {
    grid-column-end: span 1;
  }

  .offset-lg-1 {
    grid-column-start: 1;
  }

  .col-lg-2 {
    grid-column-end: span 2;
  }

  .offset-lg-2 {
    grid-column-start: 2;
  }

  .col-lg-3 {
    grid-column-end: span 3;
  }

  .offset-lg-3 {
    grid-column-start: 3;
  }

  .col-lg-4 {
    grid-column-end: span 4;
  }

  .offset-lg-4 {
    grid-column-start: 4;
  }

  .col-lg-5 {
    grid-column-end: span 5;
  }

  .offset-lg-5 {
    grid-column-start: 5;
  }

  .col-lg-6 {
    grid-column-end: span 6;
  }

  .offset-lg-6 {
    grid-column-start: 6;
  }

  .col-lg-7 {
    grid-column-end: span 7;
  }

  .offset-lg-7 {
    grid-column-start: 7;
  }

  .col-lg-8 {
    grid-column-end: span 8;
  }

  .offset-lg-8 {
    grid-column-start: 8;
  }

  .col-lg-9 {
    grid-column-end: span 9;
  }

  .offset-lg-9 {
    grid-column-start: 9;
  }

  .col-lg-10 {
    grid-column-end: span 10;
  }

  .offset-lg-10 {
    grid-column-start: 10;
  }

  .col-lg-11 {
    grid-column-end: span 11;
  }

  .offset-lg-11 {
    grid-column-start: 11;
  }

  .col-lg-12 {
    grid-column-end: span 12;
  }

  .offset-lg-12 {
    grid-column-start: 12;
  }

  .p-lg-txl {
    padding-top: 3rem;
  }

  .p-lg-rxl {
    padding-right: 3rem;
  }

  .p-lg-bxl {
    padding-bottom: 3rem;
  }

  .p-lg-lxl {
    padding-left: 3rem;
  }

  .p-lg-hxl {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .p-lg-vxl {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .p-lg-xl {
    padding: 3rem;
  }

  .p-lg-tl {
    padding-top: 1.5rem;
  }

  .p-lg-rl {
    padding-right: 1.5rem;
  }

  .p-lg-bl {
    padding-bottom: 1.5rem;
  }

  .p-lg-ll {
    padding-left: 1.5rem;
  }

  .p-lg-hl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .p-lg-vl {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .p-lg-l {
    padding: 1.5rem;
  }

  .p-lg-tm {
    padding-top: 1rem;
  }

  .p-lg-rm {
    padding-right: 1rem;
  }

  .p-lg-bm {
    padding-bottom: 1rem;
  }

  .p-lg-lm {
    padding-left: 1rem;
  }

  .p-lg-hm {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .p-lg-vm {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .p-lg-m {
    padding: 1rem;
  }

  .p-lg-ts {
    padding-top: 0.5rem;
  }

  .p-lg-rs {
    padding-right: 0.5rem;
  }

  .p-lg-bs {
    padding-bottom: 0.5rem;
  }

  .p-lg-ls {
    padding-left: 0.5rem;
  }

  .p-lg-hs {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .p-lg-vs {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .p-lg-s {
    padding: 0.5rem;
  }

  .p-lg-tn {
    padding-top: 0;
  }

  .p-lg-rn {
    padding-right: 0;
  }

  .p-lg-bn {
    padding-bottom: 0;
  }

  .p-lg-ln {
    padding-left: 0;
  }

  .p-lg-hn {
    padding-left: 0;
    padding-right: 0;
  }

  .p-lg-vn {
    padding-top: 0;
    padding-bottom: 0;
  }

  .p-lg-n {
    padding: 0;
  }

  .m-lg-txl {
    margin-top: 3rem;
  }

  .m-lg-rxl {
    margin-right: 3rem;
  }

  .m-lg-bxl {
    margin-bottom: 3rem;
  }

  .m-lg-lxl {
    margin-left: 3rem;
  }

  .m-lg-hxl {
    margin-left: 3rem;
    margin-right: 3rem;
  }

  .m-lg-vxl {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .m-lg-xl {
    margin: 3rem;
  }

  .m-lg-tl {
    margin-top: 1.5rem;
  }

  .m-lg-rl {
    margin-right: 1.5rem;
  }

  .m-lg-bl {
    margin-bottom: 1.5rem;
  }

  .m-lg-ll {
    margin-left: 1.5rem;
  }

  .m-lg-hl {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }

  .m-lg-vl {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .m-lg-l {
    margin: 1.5rem;
  }

  .m-lg-tm {
    margin-top: 1rem;
  }

  .m-lg-rm {
    margin-right: 1rem;
  }

  .m-lg-bm {
    margin-bottom: 1rem;
  }

  .m-lg-lm {
    margin-left: 1rem;
  }

  .m-lg-hm {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .m-lg-vm {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .m-lg-m {
    margin: 1rem;
  }

  .m-lg-ts {
    margin-top: 0.5rem;
  }

  .m-lg-rs {
    margin-right: 0.5rem;
  }

  .m-lg-bs {
    margin-bottom: 0.5rem;
  }

  .m-lg-ls {
    margin-left: 0.5rem;
  }

  .m-lg-hs {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .m-lg-vs {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }

  .m-lg-s {
    margin: 0.5rem;
  }

  .m-lg-tn {
    margin-top: 0;
  }

  .m-lg-rn {
    margin-right: 0;
  }

  .m-lg-bn {
    margin-bottom: 0;
  }

  .m-lg-ln {
    margin-left: 0;
  }

  .m-lg-hn {
    margin-left: 0;
    margin-right: 0;
  }

  .m-lg-vn {
    margin-top: 0;
    margin-bottom: 0;
  }

  .m-lg-n {
    margin: 0;
  }

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

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

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

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

  .align-lg-t {
    vertical-align: top;
  }

  .align-lg-m {
    vertical-align: middle;
  }

  .align-lg-b {
    vertical-align: bottom;
  }

  .align-lg-bl {
    vertical-align: baseline;
  }

  .align-lg-tb {
    vertical-align: text-bottom;
  }

  .display-lg-b {
    display: block;
  }

  .display-lg-i {
    display: inline;
  }

  .display-lg-inb {
    display: inline-block;
  }

  .display-lg-f {
    display: flex;
  }

  .display-lg-inf {
    display: inline-flex;
  }

  .display-lg-n {
    display: none;
  }

  .position-lg-s {
    position: static;
  }

  .position-lg-r {
    position: relative;
  }

  .position-lg-a {
    position: absolute;
  }

  .position-lg-f {
    position: fixed;
  }

  .flex-lg-parent {
    display: flex;
  }
  .flex-lg-child {
    flex: 1 1 auto;
  }
  .flex-lg-none {
    flex: none;
  }
  .flex-lg-wrap {
    flex-wrap: wrap;
  }
  .flex-lg-vertical {
    flex-direction: column;
  }
  .flex-lg-align-center {
    align-items: center;
  }
  .flex-lg-justify-center {
    justify-content: center;
  }

  .order-lg-1 {
    order: 1;
  }

  .order-lg-2 {
    order: 2;
  }

  .order-lg-3 {
    order: 3;
  }

  .order-lg-4 {
    order: 4;
  }

  .order-lg-5 {
    order: 5;
  }

  .order-lg-6 {
    order: 6;
  }

  .order-lg-7 {
    order: 7;
  }

  .order-lg-8 {
    order: 8;
  }

  .order-lg-9 {
    order: 9;
  }

  .order-lg-10 {
    order: 10;
  }
}
@media (min-width: 1500px) {
  .row-xl-12 {
    grid-template-columns: repeat(12, 1fr);
  }

  .row-xl-10 {
    grid-template-columns: repeat(10, 1fr);
  }

  .grid.gap-xl-xl {
    --gap-size:3rem;
  }

  .grid.gap-xl-l {
    --gap-size:1.5rem;
  }

  .grid.gap-xl-m {
    --gap-size:1rem;
  }

  .grid.gap-xl-s {
    --gap-size:0.5rem;
  }

  .grid.gap-xl-n {
    --gap-size:0;
  }

  .col-xl-1 {
    grid-column-end: span 1;
  }

  .offset-xl-1 {
    grid-column-start: 1;
  }

  .col-xl-2 {
    grid-column-end: span 2;
  }

  .offset-xl-2 {
    grid-column-start: 2;
  }

  .col-xl-3 {
    grid-column-end: span 3;
  }

  .offset-xl-3 {
    grid-column-start: 3;
  }

  .col-xl-4 {
    grid-column-end: span 4;
  }

  .offset-xl-4 {
    grid-column-start: 4;
  }

  .col-xl-5 {
    grid-column-end: span 5;
  }

  .offset-xl-5 {
    grid-column-start: 5;
  }

  .col-xl-6 {
    grid-column-end: span 6;
  }

  .offset-xl-6 {
    grid-column-start: 6;
  }

  .col-xl-7 {
    grid-column-end: span 7;
  }

  .offset-xl-7 {
    grid-column-start: 7;
  }

  .col-xl-8 {
    grid-column-end: span 8;
  }

  .offset-xl-8 {
    grid-column-start: 8;
  }

  .col-xl-9 {
    grid-column-end: span 9;
  }

  .offset-xl-9 {
    grid-column-start: 9;
  }

  .col-xl-10 {
    grid-column-end: span 10;
  }

  .offset-xl-10 {
    grid-column-start: 10;
  }

  .col-xl-11 {
    grid-column-end: span 11;
  }

  .offset-xl-11 {
    grid-column-start: 11;
  }

  .col-xl-12 {
    grid-column-end: span 12;
  }

  .offset-xl-12 {
    grid-column-start: 12;
  }

  .p-xl-txl {
    padding-top: 3rem;
  }

  .p-xl-rxl {
    padding-right: 3rem;
  }

  .p-xl-bxl {
    padding-bottom: 3rem;
  }

  .p-xl-lxl {
    padding-left: 3rem;
  }

  .p-xl-hxl {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .p-xl-vxl {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .p-xl-xl {
    padding: 3rem;
  }

  .p-xl-tl {
    padding-top: 1.5rem;
  }

  .p-xl-rl {
    padding-right: 1.5rem;
  }

  .p-xl-bl {
    padding-bottom: 1.5rem;
  }

  .p-xl-ll {
    padding-left: 1.5rem;
  }

  .p-xl-hl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .p-xl-vl {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .p-xl-l {
    padding: 1.5rem;
  }

  .p-xl-tm {
    padding-top: 1rem;
  }

  .p-xl-rm {
    padding-right: 1rem;
  }

  .p-xl-bm {
    padding-bottom: 1rem;
  }

  .p-xl-lm {
    padding-left: 1rem;
  }

  .p-xl-hm {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .p-xl-vm {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .p-xl-m {
    padding: 1rem;
  }

  .p-xl-ts {
    padding-top: 0.5rem;
  }

  .p-xl-rs {
    padding-right: 0.5rem;
  }

  .p-xl-bs {
    padding-bottom: 0.5rem;
  }

  .p-xl-ls {
    padding-left: 0.5rem;
  }

  .p-xl-hs {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .p-xl-vs {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .p-xl-s {
    padding: 0.5rem;
  }

  .p-xl-tn {
    padding-top: 0;
  }

  .p-xl-rn {
    padding-right: 0;
  }

  .p-xl-bn {
    padding-bottom: 0;
  }

  .p-xl-ln {
    padding-left: 0;
  }

  .p-xl-hn {
    padding-left: 0;
    padding-right: 0;
  }

  .p-xl-vn {
    padding-top: 0;
    padding-bottom: 0;
  }

  .p-xl-n {
    padding: 0;
  }

  .m-xl-txl {
    margin-top: 3rem;
  }

  .m-xl-rxl {
    margin-right: 3rem;
  }

  .m-xl-bxl {
    margin-bottom: 3rem;
  }

  .m-xl-lxl {
    margin-left: 3rem;
  }

  .m-xl-hxl {
    margin-left: 3rem;
    margin-right: 3rem;
  }

  .m-xl-vxl {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .m-xl-xl {
    margin: 3rem;
  }

  .m-xl-tl {
    margin-top: 1.5rem;
  }

  .m-xl-rl {
    margin-right: 1.5rem;
  }

  .m-xl-bl {
    margin-bottom: 1.5rem;
  }

  .m-xl-ll {
    margin-left: 1.5rem;
  }

  .m-xl-hl {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }

  .m-xl-vl {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .m-xl-l {
    margin: 1.5rem;
  }

  .m-xl-tm {
    margin-top: 1rem;
  }

  .m-xl-rm {
    margin-right: 1rem;
  }

  .m-xl-bm {
    margin-bottom: 1rem;
  }

  .m-xl-lm {
    margin-left: 1rem;
  }

  .m-xl-hm {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .m-xl-vm {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .m-xl-m {
    margin: 1rem;
  }

  .m-xl-ts {
    margin-top: 0.5rem;
  }

  .m-xl-rs {
    margin-right: 0.5rem;
  }

  .m-xl-bs {
    margin-bottom: 0.5rem;
  }

  .m-xl-ls {
    margin-left: 0.5rem;
  }

  .m-xl-hs {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .m-xl-vs {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }

  .m-xl-s {
    margin: 0.5rem;
  }

  .m-xl-tn {
    margin-top: 0;
  }

  .m-xl-rn {
    margin-right: 0;
  }

  .m-xl-bn {
    margin-bottom: 0;
  }

  .m-xl-ln {
    margin-left: 0;
  }

  .m-xl-hn {
    margin-left: 0;
    margin-right: 0;
  }

  .m-xl-vn {
    margin-top: 0;
    margin-bottom: 0;
  }

  .m-xl-n {
    margin: 0;
  }

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

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

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

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

  .align-xl-t {
    vertical-align: top;
  }

  .align-xl-m {
    vertical-align: middle;
  }

  .align-xl-b {
    vertical-align: bottom;
  }

  .align-xl-bl {
    vertical-align: baseline;
  }

  .align-xl-tb {
    vertical-align: text-bottom;
  }

  .display-xl-b {
    display: block;
  }

  .display-xl-i {
    display: inline;
  }

  .display-xl-inb {
    display: inline-block;
  }

  .display-xl-f {
    display: flex;
  }

  .display-xl-inf {
    display: inline-flex;
  }

  .display-xl-n {
    display: none;
  }

  .position-xl-s {
    position: static;
  }

  .position-xl-r {
    position: relative;
  }

  .position-xl-a {
    position: absolute;
  }

  .position-xl-f {
    position: fixed;
  }

  .flex-xl-parent {
    display: flex;
  }
  .flex-xl-child {
    flex: 1 1 auto;
  }
  .flex-xl-none {
    flex: none;
  }
  .flex-xl-wrap {
    flex-wrap: wrap;
  }
  .flex-xl-vertical {
    flex-direction: column;
  }
  .flex-xl-align-center {
    align-items: center;
  }
  .flex-xl-justify-center {
    justify-content: center;
  }

  .order-xl-1 {
    order: 1;
  }

  .order-xl-2 {
    order: 2;
  }

  .order-xl-3 {
    order: 3;
  }

  .order-xl-4 {
    order: 4;
  }

  .order-xl-5 {
    order: 5;
  }

  .order-xl-6 {
    order: 6;
  }

  .order-xl-7 {
    order: 7;
  }

  .order-xl-8 {
    order: 8;
  }

  .order-xl-9 {
    order: 9;
  }

  .order-xl-10 {
    order: 10;
  }
}

/*# sourceMappingURL=style.css.map */