@charset "UTF-8";
body[data-aos-duration="50"] [data-aos], [data-aos][data-aos][data-aos-duration="50"] {
  transition-duration: 50ms;
}
body[data-aos-delay="50"] [data-aos], [data-aos][data-aos][data-aos-delay="50"] {
  transition-delay: 0;
}
body[data-aos-delay="50"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="50"].aos-animate {
  transition-delay: 50ms;
}
body[data-aos-duration="100"] [data-aos], [data-aos][data-aos][data-aos-duration="100"] {
  transition-duration: 100ms;
}
body[data-aos-delay="100"] [data-aos], [data-aos][data-aos][data-aos-delay="100"] {
  transition-delay: 0;
}
body[data-aos-delay="100"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="100"].aos-animate {
  transition-delay: 100ms;
}
body[data-aos-duration="150"] [data-aos], [data-aos][data-aos][data-aos-duration="150"] {
  transition-duration: 150ms;
}
body[data-aos-delay="150"] [data-aos], [data-aos][data-aos][data-aos-delay="150"] {
  transition-delay: 0;
}
body[data-aos-delay="150"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="150"].aos-animate {
  transition-delay: 150ms;
}
body[data-aos-duration="200"] [data-aos], [data-aos][data-aos][data-aos-duration="200"] {
  transition-duration: 200ms;
}
body[data-aos-delay="200"] [data-aos], [data-aos][data-aos][data-aos-delay="200"] {
  transition-delay: 0;
}
body[data-aos-delay="200"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="200"].aos-animate {
  transition-delay: 200ms;
}
body[data-aos-duration="250"] [data-aos], [data-aos][data-aos][data-aos-duration="250"] {
  transition-duration: 250ms;
}
body[data-aos-delay="250"] [data-aos], [data-aos][data-aos][data-aos-delay="250"] {
  transition-delay: 0;
}
body[data-aos-delay="250"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="250"].aos-animate {
  transition-delay: 250ms;
}
body[data-aos-duration="300"] [data-aos], [data-aos][data-aos][data-aos-duration="300"] {
  transition-duration: 300ms;
}
body[data-aos-delay="300"] [data-aos], [data-aos][data-aos][data-aos-delay="300"] {
  transition-delay: 0;
}
body[data-aos-delay="300"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="300"].aos-animate {
  transition-delay: 300ms;
}
body[data-aos-duration="350"] [data-aos], [data-aos][data-aos][data-aos-duration="350"] {
  transition-duration: 350ms;
}
body[data-aos-delay="350"] [data-aos], [data-aos][data-aos][data-aos-delay="350"] {
  transition-delay: 0;
}
body[data-aos-delay="350"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="350"].aos-animate {
  transition-delay: 350ms;
}
body[data-aos-duration="400"] [data-aos], [data-aos][data-aos][data-aos-duration="400"] {
  transition-duration: 400ms;
}
body[data-aos-delay="400"] [data-aos], [data-aos][data-aos][data-aos-delay="400"] {
  transition-delay: 0;
}
body[data-aos-delay="400"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="400"].aos-animate {
  transition-delay: 400ms;
}
body[data-aos-duration="450"] [data-aos], [data-aos][data-aos][data-aos-duration="450"] {
  transition-duration: 450ms;
}
body[data-aos-delay="450"] [data-aos], [data-aos][data-aos][data-aos-delay="450"] {
  transition-delay: 0;
}
body[data-aos-delay="450"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="450"].aos-animate {
  transition-delay: 450ms;
}
body[data-aos-duration="500"] [data-aos], [data-aos][data-aos][data-aos-duration="500"] {
  transition-duration: 500ms;
}
body[data-aos-delay="500"] [data-aos], [data-aos][data-aos][data-aos-delay="500"] {
  transition-delay: 0;
}
body[data-aos-delay="500"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="500"].aos-animate {
  transition-delay: 500ms;
}
body[data-aos-duration="550"] [data-aos], [data-aos][data-aos][data-aos-duration="550"] {
  transition-duration: 550ms;
}
body[data-aos-delay="550"] [data-aos], [data-aos][data-aos][data-aos-delay="550"] {
  transition-delay: 0;
}
body[data-aos-delay="550"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="550"].aos-animate {
  transition-delay: 550ms;
}
body[data-aos-duration="600"] [data-aos], [data-aos][data-aos][data-aos-duration="600"] {
  transition-duration: 600ms;
}
body[data-aos-delay="600"] [data-aos], [data-aos][data-aos][data-aos-delay="600"] {
  transition-delay: 0;
}
body[data-aos-delay="600"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="600"].aos-animate {
  transition-delay: 600ms;
}
body[data-aos-duration="650"] [data-aos], [data-aos][data-aos][data-aos-duration="650"] {
  transition-duration: 650ms;
}
body[data-aos-delay="650"] [data-aos], [data-aos][data-aos][data-aos-delay="650"] {
  transition-delay: 0;
}
body[data-aos-delay="650"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="650"].aos-animate {
  transition-delay: 650ms;
}
body[data-aos-duration="700"] [data-aos], [data-aos][data-aos][data-aos-duration="700"] {
  transition-duration: 700ms;
}
body[data-aos-delay="700"] [data-aos], [data-aos][data-aos][data-aos-delay="700"] {
  transition-delay: 0;
}
body[data-aos-delay="700"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="700"].aos-animate {
  transition-delay: 700ms;
}
body[data-aos-duration="750"] [data-aos], [data-aos][data-aos][data-aos-duration="750"] {
  transition-duration: 750ms;
}
body[data-aos-delay="750"] [data-aos], [data-aos][data-aos][data-aos-delay="750"] {
  transition-delay: 0;
}
body[data-aos-delay="750"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="750"].aos-animate {
  transition-delay: 750ms;
}
body[data-aos-duration="800"] [data-aos], [data-aos][data-aos][data-aos-duration="800"] {
  transition-duration: 800ms;
}
body[data-aos-delay="800"] [data-aos], [data-aos][data-aos][data-aos-delay="800"] {
  transition-delay: 0;
}
body[data-aos-delay="800"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="800"].aos-animate {
  transition-delay: 800ms;
}
body[data-aos-duration="850"] [data-aos], [data-aos][data-aos][data-aos-duration="850"] {
  transition-duration: 850ms;
}
body[data-aos-delay="850"] [data-aos], [data-aos][data-aos][data-aos-delay="850"] {
  transition-delay: 0;
}
body[data-aos-delay="850"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="850"].aos-animate {
  transition-delay: 850ms;
}
body[data-aos-duration="900"] [data-aos], [data-aos][data-aos][data-aos-duration="900"] {
  transition-duration: 900ms;
}
body[data-aos-delay="900"] [data-aos], [data-aos][data-aos][data-aos-delay="900"] {
  transition-delay: 0;
}
body[data-aos-delay="900"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="900"].aos-animate {
  transition-delay: 900ms;
}
body[data-aos-duration="950"] [data-aos], [data-aos][data-aos][data-aos-duration="950"] {
  transition-duration: 950ms;
}
body[data-aos-delay="950"] [data-aos], [data-aos][data-aos][data-aos-delay="950"] {
  transition-delay: 0;
}
body[data-aos-delay="950"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="950"].aos-animate {
  transition-delay: 950ms;
}
body[data-aos-duration="1000"] [data-aos], [data-aos][data-aos][data-aos-duration="1000"] {
  transition-duration: 1000ms;
}
body[data-aos-delay="1000"] [data-aos], [data-aos][data-aos][data-aos-delay="1000"] {
  transition-delay: 0;
}
body[data-aos-delay="1000"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1000"].aos-animate {
  transition-delay: 1000ms;
}

body[data-aos-easing=linear] [data-aos], [data-aos][data-aos][data-aos-easing=linear] {
  transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
body[data-aos-easing=ease] [data-aos], [data-aos][data-aos][data-aos-easing=ease] {
  transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
}
body[data-aos-easing=ease-in] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in] {
  transition-timing-function: cubic-bezier(0.42, 0, 1, 1);
}
body[data-aos-easing=ease-out] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out] {
  transition-timing-function: cubic-bezier(0, 0, 0.58, 1);
}
body[data-aos-easing=ease-in-out] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out] {
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
}
body[data-aos-easing=ease-in-back] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-back] {
  transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
body[data-aos-easing=ease-out-back] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-back] {
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
body[data-aos-easing=ease-in-out-back] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-back] {
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
body[data-aos-easing=ease-in-sine] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-sine] {
  transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
}
body[data-aos-easing=ease-out-sine] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-sine] {
  transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
}
body[data-aos-easing=ease-in-out-sine] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-sine] {
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
body[data-aos-easing=ease-in-quad] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-quad] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
body[data-aos-easing=ease-out-quad] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-quad] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body[data-aos-easing=ease-in-out-quad] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-quad] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
body[data-aos-easing=ease-in-cubic] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-cubic] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
body[data-aos-easing=ease-out-cubic] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-cubic] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body[data-aos-easing=ease-in-out-cubic] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-cubic] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
body[data-aos-easing=ease-in-quart] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-quart] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
body[data-aos-easing=ease-out-quart] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-quart] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body[data-aos-easing=ease-in-out-quart] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-quart] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

/**
 * Fade animations:
 * fade
 * fade-up, fade-down, fade-left, fade-right
 * fade-up-right, fade-up-left, fade-down-right, fade-down-left
 */
[data-aos^=fade][data-aos^=fade] {
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos^=fade][data-aos^=fade].aos-animate {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

[data-aos=fade-up] {
  transform: translate3d(0, 100px, 0);
}

[data-aos=fade-down] {
  transform: translate3d(0, -100px, 0);
}

[data-aos=fade-right] {
  transform: translate3d(-100px, 0, 0);
}

[data-aos=fade-left] {
  transform: translate3d(100px, 0, 0);
}

[data-aos=fade-up-right] {
  transform: translate3d(-100px, 100px, 0);
}

[data-aos=fade-up-left] {
  transform: translate3d(100px, 100px, 0);
}

[data-aos=fade-down-right] {
  transform: translate3d(-100px, -100px, 0);
}

[data-aos=fade-down-left] {
  transform: translate3d(100px, -100px, 0);
}

/**
 * Zoom animations:
 * zoom-in, zoom-in-up, zoom-in-down, zoom-in-left, zoom-in-right
 * zoom-out, zoom-out-up, zoom-out-down, zoom-out-left, zoom-out-right
 */
[data-aos^=zoom][data-aos^=zoom] {
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos^=zoom][data-aos^=zoom].aos-animate {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

[data-aos=zoom-in] {
  transform: scale(0.6);
}

[data-aos=zoom-in-up] {
  transform: translate3d(0, 100px, 0) scale(0.6);
}

[data-aos=zoom-in-down] {
  transform: translate3d(0, -100px, 0) scale(0.6);
}

[data-aos=zoom-in-right] {
  transform: translate3d(-100px, 0, 0) scale(0.6);
}

[data-aos=zoom-in-left] {
  transform: translate3d(100px, 0, 0) scale(0.6);
}

[data-aos=zoom-out] {
  transform: scale(1.2);
}

[data-aos=zoom-out-up] {
  transform: translate3d(0, 100px, 0) scale(1.2);
}

[data-aos=zoom-out-down] {
  transform: translate3d(0, -100px, 0) scale(1.2);
}

[data-aos=zoom-out-right] {
  transform: translate3d(-100px, 0, 0) scale(1.2);
}

[data-aos=zoom-out-left] {
  transform: translate3d(100px, 0, 0) scale(1.2);
}

/**
 * Slide animations
 */
[data-aos^=slide][data-aos^=slide] {
  transition-property: transform;
}
[data-aos^=slide][data-aos^=slide].aos-animate {
  transform: translate3d(0, 0, 0);
}

[data-aos=slide-up] {
  transform: translate3d(0, 100%, 0);
}

[data-aos=slide-down] {
  transform: translate3d(0, -100%, 0);
}

[data-aos=slide-right] {
  transform: translate3d(-100%, 0, 0);
}

[data-aos=slide-left] {
  transform: translate3d(100%, 0, 0);
}

/**
 * Flip animations:
 * flip-left, flip-right, flip-up, flip-down
 */
[data-aos^=flip][data-aos^=flip] {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transition-property: transform;
}

[data-aos=flip-left] {
  transform: perspective(2500px) rotateY(-100deg);
}
[data-aos=flip-left].aos-animate {
  transform: perspective(2500px) rotateY(0);
}

[data-aos=flip-right] {
  transform: perspective(2500px) rotateY(100deg);
}
[data-aos=flip-right].aos-animate {
  transform: perspective(2500px) rotateY(0);
}

[data-aos=flip-up] {
  transform: perspective(2500px) rotateX(-100deg);
}
[data-aos=flip-up].aos-animate {
  transform: perspective(2500px) rotateX(0);
}

[data-aos=flip-down] {
  transform: perspective(2500px) rotateX(100deg);
}
[data-aos=flip-down].aos-animate {
  transform: perspective(2500px) rotateX(0);
}

/**
 * Swiper 6.5.4
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2021 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: April 5, 2021
 */
@font-face {
  font-family: "swiper-icons";
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
}

.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}

.swiper-container-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
  flex-wrap: wrap;
}

.swiper-container-multirow-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}

.swiper-container-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-container-pointer-events {
  touch-action: pan-y;
}

.swiper-container-pointer-events.swiper-container-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

/* 3D Effects */
.swiper-container-3d {
  perspective: 1200px;
}

.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.swiper-container-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

/* CSS Mode */
.swiper-container-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}

.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}

.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}

.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
  -ms-scroll-snap-type: x mandatory;
      scroll-snap-type: x mandatory;
}

.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
  -ms-scroll-snap-type: y mandatory;
      scroll-snap-type: y mandatory;
}

:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}

.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: calc(44px / 44 * 27);
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: 44px;
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - (44px / 2));
  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-theme-color);
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}

.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: 44px;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  text-transform: none;
  font-variant: initial;
  line-height: 1;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  left: 10px;
  right: auto;
}

.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
  content: "prev";
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  right: 10px;
  left: auto;
}

.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
  content: "next";
}

.swiper-button-prev.swiper-button-white,
.swiper-button-next.swiper-button-white {
  --swiper-navigation-color: #ffffff;
}

.swiper-button-prev.swiper-button-black,
.swiper-button-next.swiper-button-black {
  --swiper-navigation-color: #000000;
}

.swiper-button-lock {
  display: none;
}

:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  */
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}

/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}

.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 50%;
  background: #000;
  opacity: 0.2;
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--swiper-theme-color);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}

.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform, 200ms top;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms left;
}

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform, 200ms right;
}

/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-theme-color);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progressbar,
.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}

.swiper-container-vertical > .swiper-pagination-progressbar,
.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}

.swiper-pagination-white {
  --swiper-pagination-color: #ffffff;
}

.swiper-pagination-black {
  --swiper-pagination-color: #000000;
}

.swiper-pagination-lock {
  display: none;
}

/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}

.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}

.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-scrollbar-lock {
  display: none;
}

.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.swiper-slide-zoomed {
  cursor: move;
}

/* Preloader */
:root {
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  */
}

.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s infinite linear;
          animation: swiper-preloader-spin 1s infinite linear;
  box-sizing: border-box;
  border: 4px solid var(--swiper-theme-color);
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}

.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}

.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}

@-webkit-keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}

.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube {
  overflow: visible;
}

.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}

.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
  transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}

.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  z-index: 0;
}

.swiper-container-cube .swiper-cube-shadow:before {
  content: "";
  background: #000;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  filter: blur(50px);
}

.swiper-container-flip {
  overflow: visible;
}

.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/**
 * 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.
 */
/*Should not be used prefer css vars to get spacer and gutter*/
:root {
  --theme-default: default;
  --spacer-default: 32px;
  --gutter-default: 32px;
  --col-default: 12;
  --row-default: 12;
  --text-font-default: var(--font-primary);
  --text-color-default: rgba(var(--color-primary-500), 1);
  --text-color-dark-default: rgb(var(--color-primary-contrast-500));
  --headings-font-default: var(--font-secondary);
  --headings-color-default: rgba(var(--color-primary-500), 1);
  --headings-color-dark-default: rgb(var(--color-primary-contrast-500));
  --bg-dark-default: #384043;
  --bg-medium-default: rgba(var(--color-gray-300), 1);
  --bg-light-default: #ffffff;
  --max-xs: 1200px;
  --min-xs: 0px;
  --spacer-xs: 28px;
  --gutter-xs: 28px;
  --mobile-xs: true;
  --orientation-xs-l: landscape;
  --breakpoint-xs-l: xs;
  --spacer-xs-l: 28px;
  --gutter-xs-l: 28px;
  --mobile-xs-l: true;
  --max-sm: 1200px;
  --min-sm: 768px;
  --spacer-sm: 28px;
  --gutter-sm: 28px;
  --mobile-sm: true;
  --orientation-sm-l: landscape;
  --breakpoint-sm-l: sm;
  --spacer-sm-l: 24px;
  --gutter-sm-l: 24px;
  --mobile-sm-l: true;
  --max-md: 10000px;
  --min-md: 1201px;
  --spacer-md: 28px;
  --gutter-md: 28px;
  --mobile-md: false;
  --max-lg: 10000px;
  --min-lg: 1441px;
  --spacer-lg: 32px;
  --gutter-lg: 32px;
  --mobile-lg: false;
  --max-xl: 10000px;
  --min-xl: 1921px;
  --spacer-xl: 36px;
  --gutter-xl: 36px;
  --mobile-xl: false;
  --font-primary: 'sofia-pro', sans-serif;
  --font-secondary: 'Cormorant Garamond', serif;
  --font-third: 'Dry-Brush', cursive;
  --color-primary-900: 0, 0, 0;
  --color-primary-contrast-900: 255, 255, 255;
  --color-primary-800: 0, 0, 0;
  --color-primary-contrast-800: 255, 255, 255;
  --color-primary-700: 19, 22, 23;
  --color-primary-contrast-700: 255, 255, 255;
  --color-primary-600: 37, 43, 45;
  --color-primary-contrast-600: 255, 255, 255;
  --color-primary-500: 56, 64, 67;
  --color-primary-contrast-500: 255, 255, 255;
  --color-primary-400: 75, 85, 89;
  --color-primary-contrast-400: 255, 255, 255;
  --color-primary-300: 93, 106, 111;
  --color-primary-contrast-300: 255, 255, 255;
  --color-primary-200: 112, 128, 134;
  --color-primary-contrast-200: 255, 255, 255;
  --color-primary-100: 133, 148, 153;
  --color-primary-contrast-100: 56, 64, 67;
  --color-secondary-900: 92, 60, 0;
  --color-secondary-contrast-900: 255, 255, 255;
  --color-secondary-800: 133, 87, 0;
  --color-secondary-contrast-800: 255, 255, 255;
  --color-secondary-700: 173, 114, 0;
  --color-secondary-contrast-700: 255, 255, 255;
  --color-secondary-600: 214, 140, 0;
  --color-secondary-contrast-600: 56, 64, 67;
  --color-secondary-500: 255, 167, 0;
  --color-secondary-contrast-500: 56, 64, 67;
  --color-secondary-400: 255, 181, 41;
  --color-secondary-contrast-400: 56, 64, 67;
  --color-secondary-300: 255, 195, 82;
  --color-secondary-contrast-300: 56, 64, 67;
  --color-secondary-200: 255, 209, 122;
  --color-secondary-contrast-200: 56, 64, 67;
  --color-secondary-100: 255, 223, 163;
  --color-secondary-contrast-100: 56, 64, 67;
  --color-gray-900: 110, 118, 120;
  --color-gray-contrast-900: 255, 255, 255;
  --color-gray-800: 130, 138, 140;
  --color-gray-contrast-800: 255, 255, 255;
  --color-gray-700: 151, 158, 160;
  --color-gray-contrast-700: 56, 64, 67;
  --color-gray-600: 173, 178, 179;
  --color-gray-contrast-600: 56, 64, 67;
  --color-gray-500: 194, 198, 199;
  --color-gray-contrast-500: 56, 64, 67;
  --color-gray-400: 215, 218, 219;
  --color-gray-contrast-400: 56, 64, 67;
  --color-gray-300: 237, 238, 238;
  --color-gray-contrast-300: 56, 64, 67;
  --color-gray-200: 255, 255, 255;
  --color-gray-contrast-200: 56, 64, 67;
  --color-gray-100: 255, 255, 255;
  --color-gray-contrast-100: 56, 64, 67;
}

@media (min-width: 0px) and (max-width: 1200px) {
  :root {
    --max-xs: 1200px;
    --max-current: 1200px;
    --min-xs: 0px;
    --min-current: 0px;
    --spacer-xs: 28px;
    --spacer-current: 28px;
    --gutter-xs: 28px;
    --gutter-current: 28px;
    --mobile-xs: true;
    --mobile-current: true;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  :root {
    --orientation-xs-l: landscape;
    --orientation-current: landscape;
    --breakpoint-xs-l: xs;
    --breakpoint-current: xs;
    --spacer-xs-l: 28px;
    --spacer-current: 28px;
    --gutter-xs-l: 28px;
    --gutter-current: 28px;
    --mobile-xs-l: true;
    --mobile-current: true;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  :root {
    --max-sm: 1200px;
    --max-current: 1200px;
    --min-sm: 768px;
    --min-current: 768px;
    --spacer-sm: 28px;
    --spacer-current: 28px;
    --gutter-sm: 28px;
    --gutter-current: 28px;
    --mobile-sm: true;
    --mobile-current: true;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  :root {
    --orientation-sm-l: landscape;
    --orientation-current: landscape;
    --breakpoint-sm-l: sm;
    --breakpoint-current: sm;
    --spacer-sm-l: 24px;
    --spacer-current: 24px;
    --gutter-sm-l: 24px;
    --gutter-current: 24px;
    --mobile-sm-l: true;
    --mobile-current: true;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  :root {
    --max-md: 10000px;
    --max-current: 10000px;
    --min-md: 1201px;
    --min-current: 1201px;
    --spacer-md: 28px;
    --spacer-current: 28px;
    --gutter-md: 28px;
    --gutter-current: 28px;
    --mobile-md: false;
    --mobile-current: false;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  :root {
    --max-lg: 10000px;
    --max-current: 10000px;
    --min-lg: 1441px;
    --min-current: 1441px;
    --spacer-lg: 32px;
    --spacer-current: 32px;
    --gutter-lg: 32px;
    --gutter-current: 32px;
    --mobile-lg: false;
    --mobile-current: false;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  :root {
    --max-xl: 10000px;
    --max-current: 10000px;
    --min-xl: 1921px;
    --min-current: 1921px;
    --spacer-xl: 36px;
    --spacer-current: 36px;
    --gutter-xl: 36px;
    --gutter-current: 36px;
    --mobile-xl: false;
    --mobile-current: false;
  }
}
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;
}

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

html {
  overflow-x: hidden;
  min-height: 100%;
  font-size: 100%;
  margin: 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  html {
    font-size: 100%;
    margin: 0;
    background-color: #384043;
    background-color: var(--bg-dark-default);
  }
}

body {
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--text-font-default);
  line-height: 1.618;
  font-weight: 300;
  font-size: 15px;
  min-width: 280px;
  overflow-x: hidden;
  min-height: 100vh;
  color: rgba(56, 64, 67, 1);
  color: var(--text-color-default);
  background-color: #ffffff;
  background-color: var(--bg-light-default);
  -webkit-tap-highlight-color: transparent;
  font-size: 14px;
}
@media (min-width: 0px) and (max-width: 1200px) {
  body {
    font-size: 13px;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 12px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body {
    font-size: 14px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 13px;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body {
    font-size: 14px;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body {
    font-size: 16px;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body {
    font-size: 18px;
    max-width: 2560px;
    position: relative;
    margin: 0 auto;
  }
}

a {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
  text-decoration: none;
}
a:hover {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
a:hover [class*=icon-] {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}

p {
  margin-bottom: calc(32px * 0.75);
  margin-bottom: calc(var(--spacer-default) * 0.75);
}
@media (min-width: 0px) and (max-width: 1200px) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-xs) * 0.75);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-xs-l) * 0.75);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-sm) * 0.75);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  p {
    margin-bottom: calc(24px * 0.75);
    margin-bottom: calc(var(--spacer-sm-l) * 0.75);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-md) * 0.75);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  p {
    margin-bottom: calc(32px * 0.75);
    margin-bottom: calc(var(--spacer-lg) * 0.75);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  p {
    margin-bottom: calc(36px * 0.75);
    margin-bottom: calc(var(--spacer-xl) * 0.75);
  }
}

/*HEADINGS FONTS*/
h1, .h1, [default~=h1],
h2, .h2, [default~=h2],
h3, .h3, [default~=h3],
h4, .h4, [default~=h4],
h5, .h5, [default~=h5] {
  margin-bottom: calc(32px * 0.666);
  margin-bottom: calc(var(--spacer-default) * 0.666);
  color: rgba(56, 64, 67, 1);
  color: var(--headings-color-default);
}
body.dark-theme h1, body.dark-theme .h1, body.dark-theme [default~=h1],
body.dark-theme h2, body.dark-theme .h2, body.dark-theme [default~=h2],
body.dark-theme h3, body.dark-theme .h3, body.dark-theme [default~=h3],
body.dark-theme h4, body.dark-theme .h4, body.dark-theme [default~=h4],
body.dark-theme h5, body.dark-theme .h5, body.dark-theme [default~=h5] {
  color: rgb(255, 255, 255);
  color: var(--headings-color-dark-default);
}
h1 strong, .h1 strong, [default~=h1] strong,
h2 strong, .h2 strong, [default~=h2] strong,
h3 strong, .h3 strong, [default~=h3] strong,
h4 strong, .h4 strong, [default~=h4] strong,
h5 strong, .h5 strong, [default~=h5] strong {
  font-family: 'Dry-Brush', cursive;
  font-family: var(--font-third);
  font-weight: 400 !important;
  color: rgba(255, 167, 0, 1) !important;
  color: rgba(var(--color-secondary-500), 1) !important;
}

h1, .h1, [default~=h1] {
  font-size: 3.8rem;
  font-family: 'Cormorant Garamond', serif;
  font-family: var(--headings-font-default);
  line-height: 1.33;
  font-weight: 300;
}

h2, .h2, [default~=h2] {
  font-size: 3rem;
  font-family: 'Cormorant Garamond', serif;
  font-family: var(--headings-font-default);
  line-height: 1.33;
  font-weight: 300;
}

h3, .h3, [default~=h3] {
  font-size: 2rem;
  font-family: 'Cormorant Garamond', serif;
  font-family: var(--headings-font-default);
  line-height: 1.33;
  font-weight: 300;
}

h4, .h4, [default~=h4] {
  font-size: 1.5rem;
  font-family: 'Cormorant Garamond', serif;
  font-family: var(--headings-font-default);
  line-height: 1.33;
  font-weight: 400;
}

h5, .h5, [default~=h5] {
  font-size: 1.25rem;
  font-family: 'Cormorant Garamond', serif;
  font-family: var(--headings-font-default);
  line-height: 1.33;
  font-weight: 400;
}

.caption {
  font-size: 1.25rem;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  line-height: 1.33;
  font-weight: 200;
}
.caption:before {
  content: "/ ";
}

@media (min-width: 0px) and (max-width: 1200px) {
  h1, .h1, [xs~=h1],
h2, .h2, [xs~=h2],
h3, .h3, [xs~=h3],
h4, .h4, [xs~=h4],
h5, .h5, [xs~=h5] {
    margin-bottom: calc(28px * 0.666);
    margin-bottom: calc(var(--spacer-xs) * 0.666);
  }

  h1, .h1, [xs~=h1] {
    font-size: 2.66rem;
    font-size: 2.128rem;
  }

  h2, .h2, [xs~=h2] {
    font-size: 2.1rem;
  }

  h3, .h3, [xs~=h3] {
    font-size: 1.4rem;
  }

  h4, .h4, [xs~=h4] {
    font-size: 1.05rem;
  }

  h5, .h5, [xs~=h5] {
    font-size: 0.875rem;
  }

  .caption {
    font-size: 0.875rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  h1, .h1, [xs-l~=h1],
h2, .h2, [xs-l~=h2],
h3, .h3, [xs-l~=h3],
h4, .h4, [xs-l~=h4],
h5, .h5, [xs-l~=h5] {
    margin-bottom: calc(28px * 0.666);
    margin-bottom: calc(var(--spacer-xs-l) * 0.666);
  }

  h1, .h1, [xs-l~=h1] {
    font-size: 2.47rem;
  }

  h2, .h2, [xs-l~=h2] {
    font-size: 1.95rem;
  }

  h3, .h3, [xs-l~=h3] {
    font-size: 1.3rem;
  }

  h4, .h4, [xs-l~=h4] {
    font-size: 0.975rem;
  }

  h5, .h5, [xs-l~=h5] {
    font-size: 0.8125rem;
  }

  .caption {
    font-size: 0.8125rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  h1, .h1, [sm~=h1],
h2, .h2, [sm~=h2],
h3, .h3, [sm~=h3],
h4, .h4, [sm~=h4],
h5, .h5, [sm~=h5] {
    margin-bottom: calc(28px * 0.666);
    margin-bottom: calc(var(--spacer-sm) * 0.666);
  }

  h1, .h1, [sm~=h1] {
    font-size: 3.04rem;
  }

  h2, .h2, [sm~=h2] {
    font-size: 2.4rem;
  }

  h3, .h3, [sm~=h3] {
    font-size: 1.6rem;
  }

  h4, .h4, [sm~=h4] {
    font-size: 1.2rem;
  }

  h5, .h5, [sm~=h5] {
    font-size: 1rem;
  }

  .caption {
    font-size: 1rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  h1, .h1, [sm-l~=h1],
h2, .h2, [sm-l~=h2],
h3, .h3, [sm-l~=h3],
h4, .h4, [sm-l~=h4],
h5, .h5, [sm-l~=h5] {
    margin-bottom: calc(24px * 0.666);
    margin-bottom: calc(var(--spacer-sm-l) * 0.666);
  }

  h1, .h1, [sm-l~=h1] {
    font-size: 2.66rem;
  }

  h2, .h2, [sm-l~=h2] {
    font-size: 2.1rem;
  }

  h3, .h3, [sm-l~=h3] {
    font-size: 1.4rem;
  }

  h4, .h4, [sm-l~=h4] {
    font-size: 1.05rem;
  }

  h5, .h5, [sm-l~=h5] {
    font-size: 0.875rem;
  }

  .caption {
    font-size: 0.875rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  h1, .h1, [md~=h1],
h2, .h2, [md~=h2],
h3, .h3, [md~=h3],
h4, .h4, [md~=h4],
h5, .h5, [md~=h5] {
    margin-bottom: calc(28px * 0.666);
    margin-bottom: calc(var(--spacer-md) * 0.666);
  }

  h1, .h1, [md~=h1] {
    font-size: 3.04rem;
  }

  h2, .h2, [md~=h2] {
    font-size: 2.4rem;
  }

  h3, .h3, [md~=h3] {
    font-size: 1.6rem;
  }

  h4, .h4, [md~=h4] {
    font-size: 1.2rem;
  }

  h5, .h5, [md~=h5] {
    font-size: 1rem;
  }

  .caption {
    font-size: 1rem;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  h1, .h1, [lg~=h1],
h2, .h2, [lg~=h2],
h3, .h3, [lg~=h3],
h4, .h4, [lg~=h4],
h5, .h5, [lg~=h5] {
    margin-bottom: calc(32px * 0.666);
    margin-bottom: calc(var(--spacer-lg) * 0.666);
  }

  h1, .h1, [lg~=h1] {
    font-size: 3.42rem;
  }

  h2, .h2, [lg~=h2] {
    font-size: 2.7rem;
  }

  h3, .h3, [lg~=h3] {
    font-size: 1.8rem;
  }

  h4, .h4, [lg~=h4] {
    font-size: 1.35rem;
  }

  h5, .h5, [lg~=h5] {
    font-size: 1.125rem;
  }

  .caption {
    font-size: 1.125rem;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  h1, .h1, [xl~=h1],
h2, .h2, [xl~=h2],
h3, .h3, [xl~=h3],
h4, .h4, [xl~=h4],
h5, .h5, [xl~=h5] {
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }

  h1, .h1, [xl~=h1] {
    font-size: 3.8rem;
  }

  h2, .h2, [xl~=h2] {
    font-size: 3rem;
  }

  h3, .h3, [xl~=h3] {
    font-size: 2rem;
  }

  h4, .h4, [xl~=h4] {
    font-size: 1.5rem;
  }

  h5, .h5, [xl~=h5] {
    font-size: 1.25rem;
  }

  .caption {
    font-size: 1.25rem;
  }
}
/* Mixins */
[class*=order-1],
:root [default*=order-1] {
  order: 1;
}

[class*=order-2],
:root [default*=order-2] {
  order: 2;
}

[class*=order-3],
:root [default*=order-3] {
  order: 3;
}

@media (min-width: 0px) and (max-width: 1200px) {
  [class*=order-1],
:root [xs*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [xs*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [xs*=order-3] {
    order: 3;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  [class*=order-1],
:root [xs-l*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [xs-l*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [xs-l*=order-3] {
    order: 3;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  [class*=order-1],
:root [sm*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [sm*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [sm*=order-3] {
    order: 3;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  [class*=order-1],
:root [sm-l*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [sm-l*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [sm-l*=order-3] {
    order: 3;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  [class*=order-1],
:root [md*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [md*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [md*=order-3] {
    order: 3;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  [class*=order-1],
:root [lg*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [lg*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [lg*=order-3] {
    order: 3;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  [class*=order-1],
:root [xl*=order-1] {
    order: 1;
  }

  [class*=order-2],
:root [xl*=order-2] {
    order: 2;
  }

  [class*=order-3],
:root [xl*=order-3] {
    order: 3;
  }
}
/* Global CSS*/
.grecaptcha-badge {
  opacity: 0;
  pointer-events: none;
}

.wysiwyg ul, .wp-editor ul {
  list-style-type: none;
  margin-bottom: calc(32px * 1);
  margin-bottom: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(24px * 1);
    margin-bottom: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(32px * 1);
    margin-bottom: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .wysiwyg ul, .wp-editor ul {
    margin-bottom: calc(36px * 1);
    margin-bottom: calc(var(--spacer-xl) * 1);
  }
}
.wysiwyg ul li, .wp-editor ul li {
  position: relative;
  padding-left: calc(32px * 1.6);
  padding-left: calc(var(--spacer-default) * 1.6);
  margin-bottom: calc(36px * 0.666);
  margin-bottom: calc(var(--spacer-xl) * 0.666);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(28px * 1.6);
    padding-left: calc(var(--spacer-xs) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(28px * 1.6);
    padding-left: calc(var(--spacer-xs-l) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(28px * 1.6);
    padding-left: calc(var(--spacer-sm) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(24px * 1.6);
    padding-left: calc(var(--spacer-sm-l) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(28px * 1.6);
    padding-left: calc(var(--spacer-md) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(32px * 1.6);
    padding-left: calc(var(--spacer-lg) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .wysiwyg ul li, .wp-editor ul li {
    padding-left: calc(36px * 1.6);
    padding-left: calc(var(--spacer-xl) * 1.6);
    margin-bottom: calc(36px * 0.666);
    margin-bottom: calc(var(--spacer-xl) * 0.666);
  }
}
.wysiwyg ul li:before, .wp-editor ul li:before {
  content: "";
  background: url("/site-content/themes/theme-zambla/static/medias/arrow.svg") center center no-repeat;
  display: flex;
  flex-shrink: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: calc(32px * 1.5);
  width: calc(var(--spacer-default) * 1.5);
  height: calc(32px * 0.75);
  height: calc(var(--spacer-default) * 0.75);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-xs) * 1.5);
    height: calc(28px * 0.75);
    height: calc(var(--spacer-xs) * 0.75);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-xs-l) * 1.5);
    height: calc(28px * 0.75);
    height: calc(var(--spacer-xs-l) * 0.75);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-sm) * 1.5);
    height: calc(28px * 0.75);
    height: calc(var(--spacer-sm) * 0.75);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(24px * 1.5);
    width: calc(var(--spacer-sm-l) * 1.5);
    height: calc(24px * 0.75);
    height: calc(var(--spacer-sm-l) * 0.75);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-md) * 1.5);
    height: calc(28px * 0.75);
    height: calc(var(--spacer-md) * 0.75);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(32px * 1.5);
    width: calc(var(--spacer-lg) * 1.5);
    height: calc(32px * 0.75);
    height: calc(var(--spacer-lg) * 0.75);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .wysiwyg ul li:before, .wp-editor ul li:before {
    width: calc(36px * 1.5);
    width: calc(var(--spacer-xl) * 1.5);
    height: calc(36px * 0.75);
    height: calc(var(--spacer-xl) * 0.75);
  }
}

.title-link a {
  text-align: left;
  padding: 0;
  color: inherit;
}
.title-link a:hover {
  color: inherit;
}

.js-inject-inline {
  visibility: hidden;
}
.js-inject-inline.injected-svg {
  visibility: visible;
}

:root body {
  --swiper-theme-color: rgba(var(--color-secondary-500), 1) !important;
  --swiper-navigation-size: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  :root body {
    --swiper-navigation-size: calc(var(--spacer-xl) * 1);
  }
}

.scroll-down {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .scroll-down {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-down {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .scroll-down {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-down {
    padding: calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .scroll-down {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .scroll-down {
    padding: calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .scroll-down {
    padding: calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.5);
  }
}
.scroll-down a {
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
}
.scroll-down a:hover {
  color: rgba(255, 167, 0, 1) !important;
  color: rgba(var(--color-secondary-500), 1) !important;
}
.scroll-down a:hover * {
  color: rgba(255, 167, 0, 1) !important;
  color: rgba(var(--color-secondary-500), 1) !important;
}

.circle-brush {
  position: relative;
  padding: calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .circle-brush {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .circle-brush {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .circle-brush {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .circle-brush {
    padding: calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .circle-brush {
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .circle-brush {
    padding: calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .circle-brush {
    padding: calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.5);
  }
}
.circle-brush svg {
  position: absolute;
  top: -18%;
  left: -18%;
  width: 136%;
  height: 136%;
}
.circle-brush svg path {
  fill: rgba(56, 64, 67, 1);
  fill: rgba(var(--color-primary-500), 1);
}
.dark .circle-brush svg path {
  fill: white;
}
.medium .circle-brush svg path {
  fill: white;
}

.btn {
  text-align: center;
  cursor: pointer;
  outline: none;
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  outline: none;
  line-height: 1.4;
  border: 0px none;
  outline: none;
  color: white;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--text-font-default);
  font-weight: 400;
  border-radius: calc(32px * 0.1);
  border-radius: calc(var(--spacer-default) * 0.1);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: calc(32px * 0.5) 0;
  padding: calc(var(--spacer-default) * 0.5) 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .btn {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-xs) * 0.1);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-xs) * 0.5) 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .btn {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-xs-l) * 0.1);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-xs-l) * 0.5) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .btn {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-sm) * 0.1);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-sm) * 0.5) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .btn {
    border-radius: calc(24px * 0.1);
    border-radius: calc(var(--spacer-sm-l) * 0.1);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: calc(24px * 0.5) 0;
    padding: calc(var(--spacer-sm-l) * 0.5) 0;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .btn {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-md) * 0.1);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-md) * 0.5) 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .btn {
    border-radius: calc(32px * 0.1);
    border-radius: calc(var(--spacer-lg) * 0.1);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: calc(32px * 0.5) 0;
    padding: calc(var(--spacer-lg) * 0.5) 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .btn {
    border-radius: calc(36px * 0.1);
    border-radius: calc(var(--spacer-xl) * 0.1);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: calc(36px * 0.5) 0;
    padding: calc(var(--spacer-xl) * 0.5) 0;
  }
}
.btn:disabled {
  pointer-events: none;
}
.btn:disabled:after {
  background: rgba(var(--color-lgray-500), 1);
}
.btn:after {
  content: "";
  background: url("/site-content/themes/theme-zambla/static/medias/underline.svg") center center no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0px;
  height: 10px;
  width: 100%;
}

:root .wp-block-button__link {
  text-align: center;
  cursor: pointer;
  outline: none;
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  outline: none;
  line-height: 1.4;
  border: 0px none;
  outline: none;
  background-color: transparent;
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--text-font-default);
  font-weight: 700;
  border: 2px solid rgba(255, 167, 0, 1);
  border: 2px solid rgba(var(--color-secondary-500), 1);
  font-size: 1em;
  border-radius: calc(32px * 0.1);
  border-radius: calc(var(--spacer-default) * 0.1);
  margin: calc(32px * 0.25) 0 calc(32px * 0.5) 0;
  margin: calc(var(--spacer-default) * 0.25) 0 calc(var(--spacer-default) * 0.5) 0;
  padding: calc(32px * 0.25) calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.25) calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  :root .wp-block-button__link {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-xs) * 0.1);
    margin: calc(28px * 0.25) 0 calc(28px * 0.5) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0 calc(var(--spacer-xs) * 0.5) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.25) calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  :root .wp-block-button__link {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-xs-l) * 0.1);
    margin: calc(28px * 0.25) 0 calc(28px * 0.5) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0 calc(var(--spacer-xs-l) * 0.5) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.25) calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  :root .wp-block-button__link {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-sm) * 0.1);
    margin: calc(28px * 0.25) 0 calc(28px * 0.5) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0 calc(var(--spacer-sm) * 0.5) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.25) calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  :root .wp-block-button__link {
    border-radius: calc(24px * 0.1);
    border-radius: calc(var(--spacer-sm-l) * 0.1);
    margin: calc(24px * 0.25) 0 calc(24px * 0.5) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0 calc(var(--spacer-sm-l) * 0.5) 0;
    padding: calc(24px * 0.25) calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.25) calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  :root .wp-block-button__link {
    border-radius: calc(28px * 0.1);
    border-radius: calc(var(--spacer-md) * 0.1);
    margin: calc(28px * 0.25) 0 calc(28px * 0.5) 0;
    margin: calc(var(--spacer-md) * 0.25) 0 calc(var(--spacer-md) * 0.5) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.25) calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  :root .wp-block-button__link {
    border-radius: calc(32px * 0.1);
    border-radius: calc(var(--spacer-lg) * 0.1);
    margin: calc(32px * 0.25) 0 calc(32px * 0.5) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0 calc(var(--spacer-lg) * 0.5) 0;
    padding: calc(32px * 0.25) calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.25) calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  :root .wp-block-button__link {
    border-radius: calc(36px * 0.1);
    border-radius: calc(var(--spacer-xl) * 0.1);
    margin: calc(36px * 0.25) 0 calc(36px * 0.5) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0 calc(var(--spacer-xl) * 0.5) 0;
    padding: calc(36px * 0.25) calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.25) calc(var(--spacer-xl) * 0.5);
  }
}
:root .wp-block-button__link:hover {
  color: white;
  background-color: rgba(214, 140, 0, 1);
  background-color: rgba(var(--color-secondary-600), 1);
}
:root .wp-block-button__link:disabled {
  pointer-events: none;
}
:root .wp-block-button__link:disabled:after {
  background: rgba(var(--color-lgray-500), 1);
}

.btn-pills {
  border: 2px solid rgba(56, 64, 67, 1);
  border: 2px solid rgba(var(--color-primary-500), 1);
  background: white;
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
  font-size: 0.8em;
  margin: 0;
  border-radius: calc(32px * 0.125);
  border-radius: calc(var(--spacer-default) * 0.125);
  margin: 0 calc(32px * 0.25) calc(32px * 0.25) 0;
  margin: 0 calc(var(--spacer-default) * 0.25) calc(var(--spacer-default) * 0.25) 0;
  padding: calc(32px * 0.25) calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.25) calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .btn-pills {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs) * 0.125);
    margin: 0 calc(28px * 0.25) calc(28px * 0.25) 0;
    margin: 0 calc(var(--spacer-xs) * 0.25) calc(var(--spacer-xs) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.25) calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .btn-pills {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs-l) * 0.125);
    margin: 0 calc(28px * 0.25) calc(28px * 0.25) 0;
    margin: 0 calc(var(--spacer-xs-l) * 0.25) calc(var(--spacer-xs-l) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.25) calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .btn-pills {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-sm) * 0.125);
    margin: 0 calc(28px * 0.25) calc(28px * 0.25) 0;
    margin: 0 calc(var(--spacer-sm) * 0.25) calc(var(--spacer-sm) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.25) calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .btn-pills {
    border-radius: calc(24px * 0.125);
    border-radius: calc(var(--spacer-sm-l) * 0.125);
    margin: 0 calc(24px * 0.25) calc(24px * 0.25) 0;
    margin: 0 calc(var(--spacer-sm-l) * 0.25) calc(var(--spacer-sm-l) * 0.25) 0;
    padding: calc(24px * 0.25) calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.25) calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .btn-pills {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-md) * 0.125);
    margin: 0 calc(28px * 0.25) calc(28px * 0.25) 0;
    margin: 0 calc(var(--spacer-md) * 0.25) calc(var(--spacer-md) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.25) calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .btn-pills {
    border-radius: calc(32px * 0.125);
    border-radius: calc(var(--spacer-lg) * 0.125);
    margin: 0 calc(32px * 0.25) calc(32px * 0.25) 0;
    margin: 0 calc(var(--spacer-lg) * 0.25) calc(var(--spacer-lg) * 0.25) 0;
    padding: calc(32px * 0.25) calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.25) calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .btn-pills {
    border-radius: calc(36px * 0.125);
    border-radius: calc(var(--spacer-xl) * 0.125);
    margin: 0 calc(36px * 0.25) calc(36px * 0.25) 0;
    margin: 0 calc(var(--spacer-xl) * 0.25) calc(var(--spacer-xl) * 0.25) 0;
    padding: calc(36px * 0.25) calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.25) calc(var(--spacer-xl) * 0.5);
  }
}
.btn-pills:hover {
  color: white;
  background-color: rgba(56, 64, 67, 1);
  background-color: rgba(var(--color-primary-500), 1);
}

.btn.btn-reverse {
  color: rgb(var(--color-accent-contrast-500));
}
.btn.btn-reverse:after {
  background: rgba(255, 167, 0, 1);
  background: rgba(var(--color-secondary-500), 1);
}
.btn.btn-reverse:hover {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-500));
}
.btn.btn-reverse:hover:after {
  background: rgba(255, 167, 0, 1);
  background: rgba(var(--color-secondary-500), 1);
}

.btn.btn-white {
  background-color: white;
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
.btn.btn-white:hover {
  background-color: rgba(56, 64, 67, 1);
  background-color: rgba(var(--color-primary-500), 1);
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}

.btn [class*=icon-] {
  font-size: calc(32px * 1);
  font-size: calc(var(--spacer-default) * 1);
  margin-right: calc(32px * 0.5);
  margin-right: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .btn [class*=icon-] {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-xs) * 1);
    margin-right: calc(28px * 0.5);
    margin-right: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .btn [class*=icon-] {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-xs-l) * 1);
    margin-right: calc(28px * 0.5);
    margin-right: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .btn [class*=icon-] {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-sm) * 1);
    margin-right: calc(28px * 0.5);
    margin-right: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .btn [class*=icon-] {
    font-size: calc(24px * 1);
    font-size: calc(var(--spacer-sm-l) * 1);
    margin-right: calc(24px * 0.5);
    margin-right: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .btn [class*=icon-] {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-md) * 1);
    margin-right: calc(28px * 0.5);
    margin-right: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .btn [class*=icon-] {
    font-size: calc(32px * 1);
    font-size: calc(var(--spacer-lg) * 1);
    margin-right: calc(32px * 0.5);
    margin-right: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .btn [class*=icon-] {
    font-size: calc(36px * 1);
    font-size: calc(var(--spacer-xl) * 1);
    margin-right: calc(36px * 0.5);
    margin-right: calc(var(--spacer-xl) * 0.5);
  }
}

[class^=container] {
  margin-left: auto;
  margin-right: auto;
  max-width: 1480px;
}

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

.container-small, :root [default=container-small] {
  width: 60%;
  max-width: 1036px;
}

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

@media (min-width: 0px) and (max-width: 1200px) {
  .container, :root [xs=container] {
    width: 87.5%;
  }

  .container-small, :root [xs=container-small] {
    width: 90%;
    max-width: 1036px;
  }

  .container-xs, :root [xs*=container-xs] {
    width: 85%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .container, :root [xs-l=container] {
    width: 87.5%;
  }

  .container-small, :root [xs-l=container-small] {
    width: 85%;
    max-width: 1036px;
  }

  .container-xs, :root [xs-l*=container-xs] {
    width: 85%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .container, :root [sm=container] {
    width: 87.5%;
  }

  .container-small, :root [sm=container-small] {
    width: 85%;
    max-width: 1036px;
  }

  .container-xs, :root [sm*=container-xs] {
    width: 85%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .container, :root [sm-l=container] {
    width: 85%;
  }

  .container-small, :root [sm-l=container-small] {
    width: 75%;
    max-width: 1036px;
  }

  .container-xs, :root [sm-l*=container-xs] {
    width: 85%;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .container, :root [md=container] {
    width: 95%;
  }

  .container-small, :root [md=container-small] {
    width: 70%;
    max-width: 1036px;
  }

  .container-xs, :root [md*=container-xs] {
    width: 66%;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .container, :root [lg=container] {
    width: 85%;
  }

  .container-small, :root [lg=container-small] {
    width: 60%;
    max-width: 1036px;
  }

  .container-xs, :root [lg*=container-xs] {
    width: 55%;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .container, :root [xl=container] {
    width: 75%;
  }

  .container-small, :root [xl=container-small] {
    width: 50%;
    max-width: 1036px;
  }

  .container-xs, :root [xl*=container-xs] {
    width: 50%;
  }
}
input[type=text], input[type=email], input[type=password] {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  background: transparent;
  width: 100%;
  outline: none;
  border: 1px solid rgba(237, 238, 238, 1);
  border: 1px solid rgba(var(--color-gray-300), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  background: white;
  border-radius: calc(32px * 0.125);
  border-radius: calc(var(--spacer-default) * 0.125);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: 0 calc(32px * 0.666);
  padding: 0 calc(var(--spacer-default) * 0.666);
  line-height: calc(32px * 1.666);
  line-height: calc(var(--spacer-default) * 1.666);
  height: calc(32px * 1.666);
  height: calc(var(--spacer-default) * 1.666);
}
input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder {
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
}
input[type=text]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder {
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
}
input[type=text]::placeholder, input[type=email]::placeholder, input[type=password]::placeholder {
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-xs) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-xs) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-xs) * 1.666);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs-l) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-xs-l) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-xs-l) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-xs-l) * 1.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-sm) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-sm) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-sm) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-sm) * 1.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(24px * 0.125);
    border-radius: calc(var(--spacer-sm-l) * 0.125);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: 0 calc(24px * 0.666);
    padding: 0 calc(var(--spacer-sm-l) * 0.666);
    line-height: calc(24px * 1.666);
    line-height: calc(var(--spacer-sm-l) * 1.666);
    height: calc(24px * 1.666);
    height: calc(var(--spacer-sm-l) * 1.666);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-md) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-md) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-md) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-md) * 1.666);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(32px * 0.125);
    border-radius: calc(var(--spacer-lg) * 0.125);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: 0 calc(32px * 0.666);
    padding: 0 calc(var(--spacer-lg) * 0.666);
    line-height: calc(32px * 1.666);
    line-height: calc(var(--spacer-lg) * 1.666);
    height: calc(32px * 1.666);
    height: calc(var(--spacer-lg) * 1.666);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(36px * 0.125);
    border-radius: calc(var(--spacer-xl) * 0.125);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: 0 calc(36px * 0.666);
    padding: 0 calc(var(--spacer-xl) * 0.666);
    line-height: calc(36px * 1.666);
    line-height: calc(var(--spacer-xl) * 1.666);
    height: calc(36px * 1.666);
    height: calc(var(--spacer-xl) * 1.666);
  }
}

input[type=checkbox] {
  background: white;
  width: calc(32px * 0.666);
  width: calc(var(--spacer-default) * 0.666);
  height: calc(32px * 0.666);
  height: calc(var(--spacer-default) * 0.666);
  margin-right: calc(32px * 0.25);
  margin-right: calc(var(--spacer-default) * 0.25);
}
input[type=checkbox]:focus {
  border: 1px solid rgba(255, 255, 255, 1);
  border: 1px solid rgba(var(--color-gray-100), 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  input[type=checkbox] {
    width: calc(28px * 0.666);
    width: calc(var(--spacer-xs) * 0.666);
    height: calc(28px * 0.666);
    height: calc(var(--spacer-xs) * 0.666);
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=checkbox] {
    width: calc(28px * 0.666);
    width: calc(var(--spacer-xs-l) * 0.666);
    height: calc(28px * 0.666);
    height: calc(var(--spacer-xs-l) * 0.666);
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  input[type=checkbox] {
    width: calc(28px * 0.666);
    width: calc(var(--spacer-sm) * 0.666);
    height: calc(28px * 0.666);
    height: calc(var(--spacer-sm) * 0.666);
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=checkbox] {
    width: calc(24px * 0.666);
    width: calc(var(--spacer-sm-l) * 0.666);
    height: calc(24px * 0.666);
    height: calc(var(--spacer-sm-l) * 0.666);
    margin-right: calc(24px * 0.25);
    margin-right: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  input[type=checkbox] {
    width: calc(28px * 0.666);
    width: calc(var(--spacer-md) * 0.666);
    height: calc(28px * 0.666);
    height: calc(var(--spacer-md) * 0.666);
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  input[type=checkbox] {
    width: calc(32px * 0.666);
    width: calc(var(--spacer-lg) * 0.666);
    height: calc(32px * 0.666);
    height: calc(var(--spacer-lg) * 0.666);
    margin-right: calc(32px * 0.25);
    margin-right: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  input[type=checkbox] {
    width: calc(36px * 0.666);
    width: calc(var(--spacer-xl) * 0.666);
    height: calc(36px * 0.666);
    height: calc(var(--spacer-xl) * 0.666);
    margin-right: calc(36px * 0.25);
    margin-right: calc(var(--spacer-xl) * 0.25);
  }
}

select {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  width: 100%;
  outline: none;
  border: 1px solid rgba(237, 238, 238, 1);
  border: 1px solid rgba(var(--color-gray-300), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: white;
  background-image: url("data:image/svg+xml;utf8,<svg fill='%23FFA700' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M5.293 9.707l6 6c0.391 0.391 1.024 0.391 1.414 0l6-6c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z'></path></svg>");
  background-repeat: no-repeat;
  border-radius: calc(32px * 0.125);
  border-radius: calc(var(--spacer-default) * 0.125);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: 0 calc(32px * 0.666);
  padding: 0 calc(var(--spacer-default) * 0.666);
  line-height: calc(32px * 1.666);
  line-height: calc(var(--spacer-default) * 1.666);
  height: calc(32px * 1.666);
  height: calc(var(--spacer-default) * 1.666);
  background-position-y: calc(32px * 0.5);
  background-position-y: calc(var(--spacer-default) * 0.5);
  background-position-x: calc(100% - calc(32px * 0.3));
  background-position-x: calc(100% - calc(var(--spacer-default) * 0.3));
}
@media (min-width: 0px) and (max-width: 1200px) {
  select {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-xs) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-xs) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-xs) * 1.666);
    background-position-y: calc(28px * 0.5);
    background-position-y: calc(var(--spacer-xs) * 0.5);
    background-position-x: calc(100% - calc(28px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-xs) * 0.3));
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  select {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs-l) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-xs-l) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-xs-l) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-xs-l) * 1.666);
    background-position-y: calc(28px * 0.5);
    background-position-y: calc(var(--spacer-xs-l) * 0.5);
    background-position-x: calc(100% - calc(28px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-xs-l) * 0.3));
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  select {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-sm) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-sm) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-sm) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-sm) * 1.666);
    background-position-y: calc(28px * 0.5);
    background-position-y: calc(var(--spacer-sm) * 0.5);
    background-position-x: calc(100% - calc(28px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-sm) * 0.3));
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  select {
    border-radius: calc(24px * 0.125);
    border-radius: calc(var(--spacer-sm-l) * 0.125);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: 0 calc(24px * 0.666);
    padding: 0 calc(var(--spacer-sm-l) * 0.666);
    line-height: calc(24px * 1.666);
    line-height: calc(var(--spacer-sm-l) * 1.666);
    height: calc(24px * 1.666);
    height: calc(var(--spacer-sm-l) * 1.666);
    background-position-y: calc(24px * 0.5);
    background-position-y: calc(var(--spacer-sm-l) * 0.5);
    background-position-x: calc(100% - calc(24px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-sm-l) * 0.3));
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  select {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-md) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-md) * 0.666);
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-md) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-md) * 1.666);
    background-position-y: calc(28px * 0.5);
    background-position-y: calc(var(--spacer-md) * 0.5);
    background-position-x: calc(100% - calc(28px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-md) * 0.3));
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  select {
    border-radius: calc(32px * 0.125);
    border-radius: calc(var(--spacer-lg) * 0.125);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: 0 calc(32px * 0.666);
    padding: 0 calc(var(--spacer-lg) * 0.666);
    line-height: calc(32px * 1.666);
    line-height: calc(var(--spacer-lg) * 1.666);
    height: calc(32px * 1.666);
    height: calc(var(--spacer-lg) * 1.666);
    background-position-y: calc(32px * 0.5);
    background-position-y: calc(var(--spacer-lg) * 0.5);
    background-position-x: calc(100% - calc(32px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-lg) * 0.3));
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  select {
    border-radius: calc(36px * 0.125);
    border-radius: calc(var(--spacer-xl) * 0.125);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: 0 calc(36px * 0.666);
    padding: 0 calc(var(--spacer-xl) * 0.666);
    line-height: calc(36px * 1.666);
    line-height: calc(var(--spacer-xl) * 1.666);
    height: calc(36px * 1.666);
    height: calc(var(--spacer-xl) * 1.666);
    background-position-y: calc(36px * 0.5);
    background-position-y: calc(var(--spacer-xl) * 0.5);
    background-position-x: calc(100% - calc(36px * 0.3));
    background-position-x: calc(100% - calc(var(--spacer-xl) * 0.3));
  }
}

textarea {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  width: 100%;
  outline: none;
  border: 1px solid rgba(237, 238, 238, 1);
  border: 1px solid rgba(var(--color-gray-300), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  border-radius: calc(32px * 0.125);
  border-radius: calc(var(--spacer-default) * 0.125);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: 0 calc(32px * 0.666);
  padding: 0 calc(var(--spacer-default) * 0.666);
}
@media (min-width: 0px) and (max-width: 1200px) {
  textarea {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-xs) * 0.666);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  textarea {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-xs-l) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-xs-l) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  textarea {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-sm) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-sm) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  textarea {
    border-radius: calc(24px * 0.125);
    border-radius: calc(var(--spacer-sm-l) * 0.125);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: 0 calc(24px * 0.666);
    padding: 0 calc(var(--spacer-sm-l) * 0.666);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  textarea {
    border-radius: calc(28px * 0.125);
    border-radius: calc(var(--spacer-md) * 0.125);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: 0 calc(28px * 0.666);
    padding: 0 calc(var(--spacer-md) * 0.666);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  textarea {
    border-radius: calc(32px * 0.125);
    border-radius: calc(var(--spacer-lg) * 0.125);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: 0 calc(32px * 0.666);
    padding: 0 calc(var(--spacer-lg) * 0.666);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  textarea {
    border-radius: calc(36px * 0.125);
    border-radius: calc(var(--spacer-xl) * 0.125);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: 0 calc(36px * 0.666);
    padding: 0 calc(var(--spacer-xl) * 0.666);
  }
}

.form-group {
  margin-bottom: calc(32px * 0.5);
  margin-bottom: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .form-group {
    margin-bottom: calc(24px * 0.5);
    margin-bottom: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .form-group {
    margin-bottom: calc(32px * 0.5);
    margin-bottom: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .form-group {
    margin-bottom: calc(36px * 0.5);
    margin-bottom: calc(var(--spacer-xl) * 0.5);
  }
}

#error-notice, .error-notice {
  position: absolute;
  display: block;
}
#error-notice.hidden, .error-notice.hidden {
  display: none;
}

:root {
  --forms-elems-base-size: calc(var(--spacer-default) * 1);
  --forms-elems-active-size: calc(var(--spacer-default) * 0.5);
  --forms-elems-padding-size: calc(var(--spacer-default) * 0.5);
  --forms-elems-radius-checkbox: calc(var(--spacer-default) * 0.1);
}

@media (min-width: 0px) and (max-width: 1200px) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-xs) * 1);
    --forms-elems-active-size: calc(var(--spacer-xs) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-xs) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-xs) * 0.1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-xs-l) * 1);
    --forms-elems-active-size: calc(var(--spacer-xs-l) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-xs-l) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-xs-l) * 0.1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-sm) * 1);
    --forms-elems-active-size: calc(var(--spacer-sm) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-sm) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-sm) * 0.1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-sm-l) * 1);
    --forms-elems-active-size: calc(var(--spacer-sm-l) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-sm-l) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-sm-l) * 0.1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-md) * 1);
    --forms-elems-active-size: calc(var(--spacer-md) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-md) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-md) * 0.1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-lg) * 1);
    --forms-elems-active-size: calc(var(--spacer-lg) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-lg) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-lg) * 0.1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  :root {
    --forms-elems-base-size: calc(var(--spacer-xl) * 1);
    --forms-elems-active-size: calc(var(--spacer-xl) * 0.5);
    --forms-elems-padding-size: calc(var(--spacer-xl) * 0.5);
    --forms-elems-radius-checkbox: calc(var(--spacer-xl) * 0.1);
  }
}
.tickbox input[type=checkbox], .tickbox input[type=radio] {
  display: none;
}
.tickbox.checkbox input[type=radio] + label,
.tickbox.checkbox input[type=checkbox] + label, .tickbox.radio input[type=radio] + label,
.tickbox.radio input[type=checkbox] + label {
  margin: calc(calc(32px * 1)/6);
  margin: calc(var(--forms-elems-base-size)/6);
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  min-width: calc(32px * 1);
  min-width: var(--forms-elems-base-size);
  padding: 0 calc(32px * 0.5) 0 calc(calc(32px * 1) + calc(32px * 0.5));
  padding: 0 var(--forms-elems-padding-size) 0 calc(var(--forms-elems-base-size) + var(--forms-elems-padding-size));
  line-height: calc(32px * 1);
  line-height: var(--forms-elems-base-size);
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
  display: inline-flex;
  position: relative;
  flex-wrap: wrap;
}
.tickbox.checkbox input[type=radio] + label:before, .tickbox.checkbox input[type=radio] + label:after,
.tickbox.checkbox input[type=checkbox] + label:before,
.tickbox.checkbox input[type=checkbox] + label:after, .tickbox.radio input[type=radio] + label:before, .tickbox.radio input[type=radio] + label:after,
.tickbox.radio input[type=checkbox] + label:before,
.tickbox.radio input[type=checkbox] + label:after {
  content: "";
  position: absolute;
  display: block;
}
.tickbox.checkbox input[type=radio] + label:before,
.tickbox.checkbox input[type=checkbox] + label:before, .tickbox.radio input[type=radio] + label:before,
.tickbox.radio input[type=checkbox] + label:before {
  width: calc(32px * 1);
  width: var(--forms-elems-base-size);
  height: calc(32px * 1);
  height: var(--forms-elems-base-size);
  top: 0;
  left: 0;
  background: rgba(56, 64, 67, 1);
  background: rgba(var(--color-primary-500), 1);
}
.tickbox.checkbox input[type=radio] + label:after,
.tickbox.checkbox input[type=checkbox] + label:after, .tickbox.radio input[type=radio] + label:after,
.tickbox.radio input[type=checkbox] + label:after {
  left: calc((calc(32px * 1) - calc(32px * 0.5))/2);
  left: calc((var(--forms-elems-base-size) - var(--forms-elems-active-size))/2);
  top: calc((calc(32px * 1) - calc(32px * 0.5))/2);
  top: calc((var(--forms-elems-base-size) - var(--forms-elems-active-size))/2);
  width: calc(32px * 0.5);
  width: var(--forms-elems-active-size);
  height: calc(32px * 0.5);
  height: var(--forms-elems-active-size);
  overflow: hidden;
  transform: scale(0.5);
  transition: all 0.33s ease;
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
  opacity: 0;
}
.tickbox.checkbox input[type=radio]:checked + label,
.tickbox.checkbox input[type=checkbox]:checked + label, .tickbox.radio input[type=radio]:checked + label,
.tickbox.radio input[type=checkbox]:checked + label {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
.tickbox.checkbox input[type=radio]:checked + label:after,
.tickbox.checkbox input[type=checkbox]:checked + label:after, .tickbox.radio input[type=radio]:checked + label:after,
.tickbox.radio input[type=checkbox]:checked + label:after {
  transform: scale(1);
  opacity: 1;
  transition: all 0.66s ease;
}
.tickbox.checkbox input[type=radio] + label, .tickbox.radio input[type=radio] + label {
  border-radius: 100%;
}
.tickbox.checkbox input[type=radio] + label:after, .tickbox.radio input[type=radio] + label:after {
  box-shadow: inset 1px 1px 1px #ffffff;
}
.tickbox.checkbox input[type=radio] + label:after, .tickbox.checkbox input[type=radio] + label:before, .tickbox.radio input[type=radio] + label:after, .tickbox.radio input[type=radio] + label:before {
  border-radius: 100%;
}
.tickbox.checkbox input[type=radio]:checked + label:after, .tickbox.radio input[type=radio]:checked + label:after {
  background: #ffffff;
}
.tickbox.checkbox input[type=checkbox] + label:before, .tickbox.radio input[type=checkbox] + label:before {
  border-radius: calc(32px * 0.1);
  border-radius: var(--forms-elems-radius-checkbox);
}
.tickbox.checkbox input[type=checkbox] + label:after, .tickbox.radio input[type=checkbox] + label:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' width='32px' height='32px' viewBox='0 0 32 32'%3E%3Cpath d='M31.706 7.133l-2.84-2.84c-.392-.392-1.025-.392-1.418 0L12.933 19.62l-8.32-8.324c-.397-.397-1.04-.397-1.438 0L.3 14.172c-.398.396-.398 1.04 0 1.438L12.13 27.718c.23.23.54.31.84.27.308.046.63-.032.867-.27L31.705 8.553c.392-.392.392-1.028 0-1.42z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: cover;
}
.tickbox.switch {
  width: calc(calc(32px * 1)*2 + 10px);
  width: calc(var(--forms-elems-base-size)*2 + 10px);
  height: calc(calc(32px * 1) + 10px);
  height: calc(var(--forms-elems-base-size) + 10px);
  background: rgba(56, 64, 67, 1);
  background: rgba(var(--color-primary-500), 1);
  display: inline-block;
  border-radius: calc(32px * 1);
  border-radius: var(--forms-elems-base-size);
  position: relative;
  border: 5px solid rgba(56, 64, 67, 1);
  border: 5px solid rgba(var(--color-primary-500), 1);
  vertical-align: middle;
}
.tickbox.switch:after {
  content: "";
  position: absolute;
  left: calc(32px * 1);
  left: var(--forms-elems-base-size);
  top: 0;
  width: calc(32px * 1);
  width: var(--forms-elems-base-size);
  height: calc(32px * 1);
  height: var(--forms-elems-base-size);
  display: block;
  overflow: hidden;
  transition: all 0.33s ease;
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
  background: #ffffff;
  border-radius: calc(32px * 1);
  border-radius: var(--forms-elems-base-size);
}
.tickbox.switch:before {
  content: "Off";
  display: block;
  width: calc(32px * 1);
  width: var(--forms-elems-base-size);
  height: calc(32px * 1);
  height: var(--forms-elems-base-size);
  position: absolute;
  line-height: calc(32px * 1);
  line-height: var(--forms-elems-base-size);
  color: #ffffff;
}
input:checked + .tickbox.switch {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
input:checked + .tickbox.switch:after {
  opacity: 1;
  left: 0;
  background: #ffffff;
  transition: all 0.66s ease;
}
input:checked + .tickbox.switch:before {
  content: "On";
  opacity: 1;
  left: calc(32px * 1);
  left: var(--forms-elems-base-size);
  color: #ffffff;
  transition: all 0.66s ease;
}

.bg-primary-100, .bg-hover-primary-100:hover {
  background-color: rgba(133, 148, 153, 1);
  background-color: rgba(var(--color-primary-100), 1);
}
.bg-primary-100:not([class*=color-]), .bg-hover-primary-100:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-primary-contrast-100));
}
.bg-primary-100:not([class*=color-]) *, .bg-hover-primary-100:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-primary-contrast-100));
}

.color-primary-100,
.color-primary-100[class*=icon]:before {
  color: rgba(133, 148, 153, 1);
  color: rgba(var(--color-primary-100), 1);
}

.color-primary-contrast-100,
.color-primary-contrast-100[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-primary-contrast-100));
}

.bg-primary-200, .bg-hover-primary-200:hover {
  background-color: rgba(112, 128, 134, 1);
  background-color: rgba(var(--color-primary-200), 1);
}
.bg-primary-200:not([class*=color-]), .bg-hover-primary-200:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-200));
}
.bg-primary-200:not([class*=color-]) *, .bg-hover-primary-200:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-200));
}

.color-primary-200,
.color-primary-200[class*=icon]:before {
  color: rgba(112, 128, 134, 1);
  color: rgba(var(--color-primary-200), 1);
}

.color-primary-contrast-200,
.color-primary-contrast-200[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-200));
}

.bg-primary-300, .bg-hover-primary-300:hover {
  background-color: rgba(93, 106, 111, 1);
  background-color: rgba(var(--color-primary-300), 1);
}
.bg-primary-300:not([class*=color-]), .bg-hover-primary-300:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-300));
}
.bg-primary-300:not([class*=color-]) *, .bg-hover-primary-300:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-300));
}

.color-primary-300,
.color-primary-300[class*=icon]:before {
  color: rgba(93, 106, 111, 1);
  color: rgba(var(--color-primary-300), 1);
}

.color-primary-contrast-300,
.color-primary-contrast-300[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-300));
}

.bg-primary-400, .bg-hover-primary-400:hover {
  background-color: rgba(75, 85, 89, 1);
  background-color: rgba(var(--color-primary-400), 1);
}
.bg-primary-400:not([class*=color-]), .bg-hover-primary-400:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-400));
}
.bg-primary-400:not([class*=color-]) *, .bg-hover-primary-400:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-400));
}

.color-primary-400,
.color-primary-400[class*=icon]:before {
  color: rgba(75, 85, 89, 1);
  color: rgba(var(--color-primary-400), 1);
}

.color-primary-contrast-400,
.color-primary-contrast-400[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-400));
}

.bg-primary-500, .bg-hover-primary-500:hover {
  background-color: rgba(56, 64, 67, 1);
  background-color: rgba(var(--color-primary-500), 1);
}
.bg-primary-500:not([class*=color-]), .bg-hover-primary-500:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}
.bg-primary-500:not([class*=color-]) *, .bg-hover-primary-500:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}

.color-primary-500,
.color-primary-500[class*=icon]:before {
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
}

.color-primary-contrast-500,
.color-primary-contrast-500[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}

.bg-primary-600, .bg-hover-primary-600:hover {
  background-color: rgba(37, 43, 45, 1);
  background-color: rgba(var(--color-primary-600), 1);
}
.bg-primary-600:not([class*=color-]), .bg-hover-primary-600:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-600));
}
.bg-primary-600:not([class*=color-]) *, .bg-hover-primary-600:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-600));
}

.color-primary-600,
.color-primary-600[class*=icon]:before {
  color: rgba(37, 43, 45, 1);
  color: rgba(var(--color-primary-600), 1);
}

.color-primary-contrast-600,
.color-primary-contrast-600[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-600));
}

.bg-primary-700, .bg-hover-primary-700:hover {
  background-color: rgba(19, 22, 23, 1);
  background-color: rgba(var(--color-primary-700), 1);
}
.bg-primary-700:not([class*=color-]), .bg-hover-primary-700:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-700));
}
.bg-primary-700:not([class*=color-]) *, .bg-hover-primary-700:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-700));
}

.color-primary-700,
.color-primary-700[class*=icon]:before {
  color: rgba(19, 22, 23, 1);
  color: rgba(var(--color-primary-700), 1);
}

.color-primary-contrast-700,
.color-primary-contrast-700[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-700));
}

.bg-primary-800, .bg-hover-primary-800:hover {
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-800), 1);
}
.bg-primary-800:not([class*=color-]), .bg-hover-primary-800:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-800));
}
.bg-primary-800:not([class*=color-]) *, .bg-hover-primary-800:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-800));
}

.color-primary-800,
.color-primary-800[class*=icon]:before {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-800), 1);
}

.color-primary-contrast-800,
.color-primary-contrast-800[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-800));
}

.bg-primary-900, .bg-hover-primary-900:hover {
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-900), 1);
}
.bg-primary-900:not([class*=color-]), .bg-hover-primary-900:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}
.bg-primary-900:not([class*=color-]) *, .bg-hover-primary-900:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}

.color-primary-900,
.color-primary-900[class*=icon]:before {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-900), 1);
}

.color-primary-contrast-900,
.color-primary-contrast-900[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}

.bg-secondary-100, .bg-hover-secondary-100:hover {
  background-color: rgba(255, 223, 163, 1);
  background-color: rgba(var(--color-secondary-100), 1);
}
.bg-secondary-100:not([class*=color-]), .bg-hover-secondary-100:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-100));
}
.bg-secondary-100:not([class*=color-]) *, .bg-hover-secondary-100:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-100));
}

.color-secondary-100,
.color-secondary-100[class*=icon]:before {
  color: rgba(255, 223, 163, 1);
  color: rgba(var(--color-secondary-100), 1);
}

.color-secondary-contrast-100,
.color-secondary-contrast-100[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-100));
}

.bg-secondary-200, .bg-hover-secondary-200:hover {
  background-color: rgba(255, 209, 122, 1);
  background-color: rgba(var(--color-secondary-200), 1);
}
.bg-secondary-200:not([class*=color-]), .bg-hover-secondary-200:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-200));
}
.bg-secondary-200:not([class*=color-]) *, .bg-hover-secondary-200:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-200));
}

.color-secondary-200,
.color-secondary-200[class*=icon]:before {
  color: rgba(255, 209, 122, 1);
  color: rgba(var(--color-secondary-200), 1);
}

.color-secondary-contrast-200,
.color-secondary-contrast-200[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-200));
}

.bg-secondary-300, .bg-hover-secondary-300:hover {
  background-color: rgba(255, 195, 82, 1);
  background-color: rgba(var(--color-secondary-300), 1);
}
.bg-secondary-300:not([class*=color-]), .bg-hover-secondary-300:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-300));
}
.bg-secondary-300:not([class*=color-]) *, .bg-hover-secondary-300:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-300));
}

.color-secondary-300,
.color-secondary-300[class*=icon]:before {
  color: rgba(255, 195, 82, 1);
  color: rgba(var(--color-secondary-300), 1);
}

.color-secondary-contrast-300,
.color-secondary-contrast-300[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-300));
}

.bg-secondary-400, .bg-hover-secondary-400:hover {
  background-color: rgba(255, 181, 41, 1);
  background-color: rgba(var(--color-secondary-400), 1);
}
.bg-secondary-400:not([class*=color-]), .bg-hover-secondary-400:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-400));
}
.bg-secondary-400:not([class*=color-]) *, .bg-hover-secondary-400:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-400));
}

.color-secondary-400,
.color-secondary-400[class*=icon]:before {
  color: rgba(255, 181, 41, 1);
  color: rgba(var(--color-secondary-400), 1);
}

.color-secondary-contrast-400,
.color-secondary-contrast-400[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-400));
}

.bg-secondary-500, .bg-hover-secondary-500:hover {
  background-color: rgba(255, 167, 0, 1);
  background-color: rgba(var(--color-secondary-500), 1);
}
.bg-secondary-500:not([class*=color-]), .bg-hover-secondary-500:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-500));
}
.bg-secondary-500:not([class*=color-]) *, .bg-hover-secondary-500:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-500));
}

.color-secondary-500,
.color-secondary-500[class*=icon]:before {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}

.color-secondary-contrast-500,
.color-secondary-contrast-500[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-500));
}

.bg-secondary-600, .bg-hover-secondary-600:hover {
  background-color: rgba(214, 140, 0, 1);
  background-color: rgba(var(--color-secondary-600), 1);
}
.bg-secondary-600:not([class*=color-]), .bg-hover-secondary-600:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-600));
}
.bg-secondary-600:not([class*=color-]) *, .bg-hover-secondary-600:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-600));
}

.color-secondary-600,
.color-secondary-600[class*=icon]:before {
  color: rgba(214, 140, 0, 1);
  color: rgba(var(--color-secondary-600), 1);
}

.color-secondary-contrast-600,
.color-secondary-contrast-600[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-secondary-contrast-600));
}

.bg-secondary-700, .bg-hover-secondary-700:hover {
  background-color: rgba(173, 114, 0, 1);
  background-color: rgba(var(--color-secondary-700), 1);
}
.bg-secondary-700:not([class*=color-]), .bg-hover-secondary-700:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-700));
}
.bg-secondary-700:not([class*=color-]) *, .bg-hover-secondary-700:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-700));
}

.color-secondary-700,
.color-secondary-700[class*=icon]:before {
  color: rgba(173, 114, 0, 1);
  color: rgba(var(--color-secondary-700), 1);
}

.color-secondary-contrast-700,
.color-secondary-contrast-700[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-700));
}

.bg-secondary-800, .bg-hover-secondary-800:hover {
  background-color: rgba(133, 87, 0, 1);
  background-color: rgba(var(--color-secondary-800), 1);
}
.bg-secondary-800:not([class*=color-]), .bg-hover-secondary-800:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-800));
}
.bg-secondary-800:not([class*=color-]) *, .bg-hover-secondary-800:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-800));
}

.color-secondary-800,
.color-secondary-800[class*=icon]:before {
  color: rgba(133, 87, 0, 1);
  color: rgba(var(--color-secondary-800), 1);
}

.color-secondary-contrast-800,
.color-secondary-contrast-800[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-800));
}

.bg-secondary-900, .bg-hover-secondary-900:hover {
  background-color: rgba(92, 60, 0, 1);
  background-color: rgba(var(--color-secondary-900), 1);
}
.bg-secondary-900:not([class*=color-]), .bg-hover-secondary-900:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}
.bg-secondary-900:not([class*=color-]) *, .bg-hover-secondary-900:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}

.color-secondary-900,
.color-secondary-900[class*=icon]:before {
  color: rgba(92, 60, 0, 1);
  color: rgba(var(--color-secondary-900), 1);
}

.color-secondary-contrast-900,
.color-secondary-contrast-900[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}

.bg-gray-100, .bg-hover-gray-100:hover {
  background-color: rgba(255, 255, 255, 1);
  background-color: rgba(var(--color-gray-100), 1);
}
.bg-gray-100:not([class*=color-]), .bg-hover-gray-100:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-100));
}
.bg-gray-100:not([class*=color-]) *, .bg-hover-gray-100:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-100));
}

.color-gray-100,
.color-gray-100[class*=icon]:before {
  color: rgba(255, 255, 255, 1);
  color: rgba(var(--color-gray-100), 1);
}

.color-gray-contrast-100,
.color-gray-contrast-100[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-100));
}

.bg-gray-200, .bg-hover-gray-200:hover {
  background-color: rgba(255, 255, 255, 1);
  background-color: rgba(var(--color-gray-200), 1);
}
.bg-gray-200:not([class*=color-]), .bg-hover-gray-200:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-200));
}
.bg-gray-200:not([class*=color-]) *, .bg-hover-gray-200:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-200));
}

.color-gray-200,
.color-gray-200[class*=icon]:before {
  color: rgba(255, 255, 255, 1);
  color: rgba(var(--color-gray-200), 1);
}

.color-gray-contrast-200,
.color-gray-contrast-200[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-200));
}

.bg-gray-300, .bg-hover-gray-300:hover {
  background-color: rgba(237, 238, 238, 1);
  background-color: rgba(var(--color-gray-300), 1);
}
.bg-gray-300:not([class*=color-]), .bg-hover-gray-300:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-300));
}
.bg-gray-300:not([class*=color-]) *, .bg-hover-gray-300:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-300));
}

.color-gray-300,
.color-gray-300[class*=icon]:before {
  color: rgba(237, 238, 238, 1);
  color: rgba(var(--color-gray-300), 1);
}

.color-gray-contrast-300,
.color-gray-contrast-300[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-300));
}

.bg-gray-400, .bg-hover-gray-400:hover {
  background-color: rgba(215, 218, 219, 1);
  background-color: rgba(var(--color-gray-400), 1);
}
.bg-gray-400:not([class*=color-]), .bg-hover-gray-400:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-400));
}
.bg-gray-400:not([class*=color-]) *, .bg-hover-gray-400:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-400));
}

.color-gray-400,
.color-gray-400[class*=icon]:before {
  color: rgba(215, 218, 219, 1);
  color: rgba(var(--color-gray-400), 1);
}

.color-gray-contrast-400,
.color-gray-contrast-400[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-400));
}

.bg-gray-500, .bg-hover-gray-500:hover {
  background-color: rgba(194, 198, 199, 1);
  background-color: rgba(var(--color-gray-500), 1);
}
.bg-gray-500:not([class*=color-]), .bg-hover-gray-500:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-500));
}
.bg-gray-500:not([class*=color-]) *, .bg-hover-gray-500:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-500));
}

.color-gray-500,
.color-gray-500[class*=icon]:before {
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
}

.color-gray-contrast-500,
.color-gray-contrast-500[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-500));
}

.bg-gray-600, .bg-hover-gray-600:hover {
  background-color: rgba(173, 178, 179, 1);
  background-color: rgba(var(--color-gray-600), 1);
}
.bg-gray-600:not([class*=color-]), .bg-hover-gray-600:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-600));
}
.bg-gray-600:not([class*=color-]) *, .bg-hover-gray-600:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-600));
}

.color-gray-600,
.color-gray-600[class*=icon]:before {
  color: rgba(173, 178, 179, 1);
  color: rgba(var(--color-gray-600), 1);
}

.color-gray-contrast-600,
.color-gray-contrast-600[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-600));
}

.bg-gray-700, .bg-hover-gray-700:hover {
  background-color: rgba(151, 158, 160, 1);
  background-color: rgba(var(--color-gray-700), 1);
}
.bg-gray-700:not([class*=color-]), .bg-hover-gray-700:hover:not([class*=color-]) {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-700));
}
.bg-gray-700:not([class*=color-]) *, .bg-hover-gray-700:hover:not([class*=color-]) * {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-700));
}

.color-gray-700,
.color-gray-700[class*=icon]:before {
  color: rgba(151, 158, 160, 1);
  color: rgba(var(--color-gray-700), 1);
}

.color-gray-contrast-700,
.color-gray-contrast-700[class*=icon]:before {
  color: rgb(56, 64, 67);
  color: rgb(var(--color-gray-contrast-700));
}

.bg-gray-800, .bg-hover-gray-800:hover {
  background-color: rgba(130, 138, 140, 1);
  background-color: rgba(var(--color-gray-800), 1);
}
.bg-gray-800:not([class*=color-]), .bg-hover-gray-800:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-gray-contrast-800));
}
.bg-gray-800:not([class*=color-]) *, .bg-hover-gray-800:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-gray-contrast-800));
}

.color-gray-800,
.color-gray-800[class*=icon]:before {
  color: rgba(130, 138, 140, 1);
  color: rgba(var(--color-gray-800), 1);
}

.color-gray-contrast-800,
.color-gray-contrast-800[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-gray-contrast-800));
}

.bg-gray-900, .bg-hover-gray-900:hover {
  background-color: rgba(110, 118, 120, 1);
  background-color: rgba(var(--color-gray-900), 1);
}
.bg-gray-900:not([class*=color-]), .bg-hover-gray-900:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-gray-contrast-900));
}
.bg-gray-900:not([class*=color-]) *, .bg-hover-gray-900:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-gray-contrast-900));
}

.color-gray-900,
.color-gray-900[class*=icon]:before {
  color: rgba(110, 118, 120, 1);
  color: rgba(var(--color-gray-900), 1);
}

.color-gray-contrast-900,
.color-gray-contrast-900[class*=icon]:before {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-gray-contrast-900));
}

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

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

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

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

.font-primary {
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
}

.font-secondary {
  font-family: 'Cormorant Garamond', serif;
  font-family: var(--font-secondary);
}

.font-third {
  font-family: 'Dry-Brush', cursive;
  font-family: var(--font-third);
}

.regular {
  font-weight: 400;
}

.bold {
  font-weight: 700;
}

@media (min-width: 0px) and (max-width: 1200px) {
  [class~=m-1-1],
:root [xs~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-xs) * 1);
  }

  [class~=mt-1-1],
:root [xs~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs) * 1);
  }

  [class~=mb-1-1],
:root [xs~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=ml-1-1],
:root [xs~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs) * 1);
  }

  [class~=mr-1-1],
:root [xs~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs) * 1);
  }

  [class~=mx-1-1],
:root [xs~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs) * 1);
  }

  [class~=my-1-1],
:root [xs~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=p-1-1],
:root [xs~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
  }

  [class~=pt-1-1],
:root [xs~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs) * 1);
  }

  [class~=pb-1-1],
:root [xs~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=pl-1-1],
:root [xs~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs) * 1);
  }

  [class~=pr-1-1],
:root [xs~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs) * 1);
  }

  [class~=px-1-1],
:root [xs~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs) * 1);
  }

  [class~=py-1-1],
:root [xs~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=h-1-1],
:root [xs~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-xs) * 1);
  }

  [class~=w-1-1],
:root [xs~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-xs) * 1);
  }

  [class~=m-2-1],
:root [xs~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-xs) * 2);
  }

  [class~=mt-2-1],
:root [xs~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs) * 2);
  }

  [class~=mb-2-1],
:root [xs~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=ml-2-1],
:root [xs~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs) * 2);
  }

  [class~=mr-2-1],
:root [xs~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs) * 2);
  }

  [class~=mx-2-1],
:root [xs~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs) * 2);
  }

  [class~=my-2-1],
:root [xs~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=p-2-1],
:root [xs~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs) * 2);
  }

  [class~=pt-2-1],
:root [xs~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs) * 2);
  }

  [class~=pb-2-1],
:root [xs~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=pl-2-1],
:root [xs~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs) * 2);
  }

  [class~=pr-2-1],
:root [xs~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs) * 2);
  }

  [class~=px-2-1],
:root [xs~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs) * 2);
  }

  [class~=py-2-1],
:root [xs~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=h-2-1],
:root [xs~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }

  [class~=w-2-1],
:root [xs~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
  }

  [class~=m-3-1],
:root [xs~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-xs) * 3);
  }

  [class~=mt-3-1],
:root [xs~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs) * 3);
  }

  [class~=mb-3-1],
:root [xs~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=ml-3-1],
:root [xs~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs) * 3);
  }

  [class~=mr-3-1],
:root [xs~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs) * 3);
  }

  [class~=mx-3-1],
:root [xs~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs) * 3);
  }

  [class~=my-3-1],
:root [xs~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=p-3-1],
:root [xs~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-xs) * 3);
  }

  [class~=pt-3-1],
:root [xs~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs) * 3);
  }

  [class~=pb-3-1],
:root [xs~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=pl-3-1],
:root [xs~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs) * 3);
  }

  [class~=pr-3-1],
:root [xs~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs) * 3);
  }

  [class~=px-3-1],
:root [xs~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs) * 3);
  }

  [class~=py-3-1],
:root [xs~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=h-3-1],
:root [xs~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs) * 3);
  }

  [class~=w-3-1],
:root [xs~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-xs) * 3);
  }

  [class~=m-4-1],
:root [xs~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-xs) * 4);
  }

  [class~=mt-4-1],
:root [xs~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs) * 4);
  }

  [class~=mb-4-1],
:root [xs~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=ml-4-1],
:root [xs~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs) * 4);
  }

  [class~=mr-4-1],
:root [xs~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs) * 4);
  }

  [class~=mx-4-1],
:root [xs~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs) * 4);
  }

  [class~=my-4-1],
:root [xs~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=p-4-1],
:root [xs~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-xs) * 4);
  }

  [class~=pt-4-1],
:root [xs~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs) * 4);
  }

  [class~=pb-4-1],
:root [xs~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=pl-4-1],
:root [xs~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs) * 4);
  }

  [class~=pr-4-1],
:root [xs~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs) * 4);
  }

  [class~=px-4-1],
:root [xs~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs) * 4);
  }

  [class~=py-4-1],
:root [xs~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=h-4-1],
:root [xs~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-xs) * 4);
  }

  [class~=w-4-1],
:root [xs~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-xs) * 4);
  }

  [class~=m-5-1],
:root [xs~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-xs) * 5);
  }

  [class~=mt-5-1],
:root [xs~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs) * 5);
  }

  [class~=mb-5-1],
:root [xs~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=ml-5-1],
:root [xs~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs) * 5);
  }

  [class~=mr-5-1],
:root [xs~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs) * 5);
  }

  [class~=mx-5-1],
:root [xs~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs) * 5);
  }

  [class~=my-5-1],
:root [xs~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=p-5-1],
:root [xs~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-xs) * 5);
  }

  [class~=pt-5-1],
:root [xs~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
  }

  [class~=pb-5-1],
:root [xs~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=pl-5-1],
:root [xs~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs) * 5);
  }

  [class~=pr-5-1],
:root [xs~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs) * 5);
  }

  [class~=px-5-1],
:root [xs~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs) * 5);
  }

  [class~=py-5-1],
:root [xs~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=h-5-1],
:root [xs~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-xs) * 5);
  }

  [class~=w-5-1],
:root [xs~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-xs) * 5);
  }

  [class~=m-6-1],
:root [xs~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-xs) * 6);
  }

  [class~=mt-6-1],
:root [xs~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs) * 6);
  }

  [class~=mb-6-1],
:root [xs~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=ml-6-1],
:root [xs~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs) * 6);
  }

  [class~=mr-6-1],
:root [xs~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs) * 6);
  }

  [class~=mx-6-1],
:root [xs~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs) * 6);
  }

  [class~=my-6-1],
:root [xs~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=p-6-1],
:root [xs~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-xs) * 6);
  }

  [class~=pt-6-1],
:root [xs~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs) * 6);
  }

  [class~=pb-6-1],
:root [xs~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=pl-6-1],
:root [xs~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs) * 6);
  }

  [class~=pr-6-1],
:root [xs~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs) * 6);
  }

  [class~=px-6-1],
:root [xs~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs) * 6);
  }

  [class~=py-6-1],
:root [xs~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=h-6-1],
:root [xs~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-xs) * 6);
  }

  [class~=w-6-1],
:root [xs~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-xs) * 6);
  }

  [class~=m-7-1],
:root [xs~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-xs) * 7);
  }

  [class~=mt-7-1],
:root [xs~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs) * 7);
  }

  [class~=mb-7-1],
:root [xs~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=ml-7-1],
:root [xs~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs) * 7);
  }

  [class~=mr-7-1],
:root [xs~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs) * 7);
  }

  [class~=mx-7-1],
:root [xs~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs) * 7);
  }

  [class~=my-7-1],
:root [xs~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=p-7-1],
:root [xs~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-xs) * 7);
  }

  [class~=pt-7-1],
:root [xs~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs) * 7);
  }

  [class~=pb-7-1],
:root [xs~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=pl-7-1],
:root [xs~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs) * 7);
  }

  [class~=pr-7-1],
:root [xs~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs) * 7);
  }

  [class~=px-7-1],
:root [xs~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs) * 7);
  }

  [class~=py-7-1],
:root [xs~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=h-7-1],
:root [xs~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-xs) * 7);
  }

  [class~=w-7-1],
:root [xs~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-xs) * 7);
  }

  [class~=m-1-2],
:root [xs~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-xs) / 2);
  }

  [class~=mt-1-2],
:root [xs~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs) / 2);
  }

  [class~=mb-1-2],
:root [xs~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=ml-1-2],
:root [xs~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs) / 2);
  }

  [class~=mr-1-2],
:root [xs~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs) / 2);
  }

  [class~=mx-1-2],
:root [xs~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs) / 2);
  }

  [class~=my-1-2],
:root [xs~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=p-1-2],
:root [xs~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-xs) / 2);
  }

  [class~=pt-1-2],
:root [xs~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs) / 2);
  }

  [class~=pb-1-2],
:root [xs~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=pl-1-2],
:root [xs~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs) / 2);
  }

  [class~=pr-1-2],
:root [xs~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs) / 2);
  }

  [class~=px-1-2],
:root [xs~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs) / 2);
  }

  [class~=py-1-2],
:root [xs~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=h-1-2],
:root [xs~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-xs) / 2);
  }

  [class~=w-1-2],
:root [xs~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-xs) / 2);
  }

  [class~=m-1-3],
:root [xs~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-xs) / 3);
  }

  [class~=mt-1-3],
:root [xs~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs) / 3);
  }

  [class~=mb-1-3],
:root [xs~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=ml-1-3],
:root [xs~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs) / 3);
  }

  [class~=mr-1-3],
:root [xs~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs) / 3);
  }

  [class~=mx-1-3],
:root [xs~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs) / 3);
  }

  [class~=my-1-3],
:root [xs~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=p-1-3],
:root [xs~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-xs) / 3);
  }

  [class~=pt-1-3],
:root [xs~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs) / 3);
  }

  [class~=pb-1-3],
:root [xs~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=pl-1-3],
:root [xs~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs) / 3);
  }

  [class~=pr-1-3],
:root [xs~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs) / 3);
  }

  [class~=px-1-3],
:root [xs~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs) / 3);
  }

  [class~=py-1-3],
:root [xs~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=h-1-3],
:root [xs~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-xs) / 3);
  }

  [class~=w-1-3],
:root [xs~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-xs) / 3);
  }

  [class~=m-1-4],
:root [xs~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-xs) / 4);
  }

  [class~=mt-1-4],
:root [xs~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs) / 4);
  }

  [class~=mb-1-4],
:root [xs~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=ml-1-4],
:root [xs~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs) / 4);
  }

  [class~=mr-1-4],
:root [xs~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs) / 4);
  }

  [class~=mx-1-4],
:root [xs~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs) / 4);
  }

  [class~=my-1-4],
:root [xs~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=p-1-4],
:root [xs~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-xs) / 4);
  }

  [class~=pt-1-4],
:root [xs~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs) / 4);
  }

  [class~=pb-1-4],
:root [xs~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=pl-1-4],
:root [xs~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs) / 4);
  }

  [class~=pr-1-4],
:root [xs~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs) / 4);
  }

  [class~=px-1-4],
:root [xs~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs) / 4);
  }

  [class~=py-1-4],
:root [xs~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=h-1-4],
:root [xs~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-xs) / 4);
  }

  [class~=w-1-4],
:root [xs~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-xs) / 4);
  }

  [class~=m-0],
:root [xs~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [xs~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [xs~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [xs~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [xs~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [xs~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [xs~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [xs~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [xs~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [xs~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [xs~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [xs~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [xs~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [xs~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [xs~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [xs~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [xs~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-xs) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-xs) * -1);
  }
  [class~=gutter] > *,
:root [xs~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-xs) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-xs) * 1);
  }

  [class~=gutter-1-2],
:root [xs~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-xs) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-xs) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [xs~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-xs) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-xs) * 0.5);
  }

  [class~=gutter-1-3],
:root [xs~=gutter-1-3] {
    margin-left: calc(28px * -0.333);
    margin-left: calc(var(--gutter-xs) * -0.333);
    margin-right: calc(28px * -0.333);
    margin-right: calc(var(--gutter-xs) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [xs~=gutter-1-3] > * {
    padding-left: calc(28px * 0.333);
    padding-left: calc(var(--gutter-xs) * 0.333);
    padding-right: calc(28px * 0.333);
    padding-right: calc(var(--gutter-xs) * 0.333);
  }

  [class~=gutter-1-4],
:root [xs~=gutter-1-4] {
    margin-left: calc(28px * -0.25);
    margin-left: calc(var(--gutter-xs) * -0.25);
    margin-right: calc(28px * -0.25);
    margin-right: calc(var(--gutter-xs) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [xs~=gutter-1-4] > * {
    padding-left: calc(28px * 0.25);
    padding-left: calc(var(--gutter-xs) * 0.25);
    padding-right: calc(28px * 0.25);
    padding-right: calc(var(--gutter-xs) * 0.25);
  }

  [class~=row-12],
:root [xs~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [xs~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [xs~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [xs~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [xs~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [xs~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [xs~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [xs~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [xs~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [xs~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [xs~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [xs~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [xs~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [xs~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [xs~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [xs~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [xs~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [xs~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [xs~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [xs~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [xs~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [xs~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [xs~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [xs~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [xs~=row],
:root [xs~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [xs~=row] > *,
:root [xs~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [xs~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [xs~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [xs~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [xs~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [xs~=row][xs~=v-center], :root [xs~=column][xs~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [xs~=row][xs~=v-start], :root [xs~=column][xs~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [xs~=row][xs~=v-end], :root [xs~=column][xs~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [xs~=row][xs~=v-stretch], :root [xs~=column][xs~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [xs~=row][xs~=h-center], :root [xs~=column][xs~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [xs~=row][xs~=h-start], :root [xs~=column][xs~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [xs~=row][xs~=h-end], :root [xs~=column][xs~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [xs~=row][xs~=h-spacein], :root [xs~=column][xs~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [xs~=row][xs~=h-spaceout], :root [xs~=column][xs~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [xs~=row] > [xs~=v-self-center], :root [xs~=column] > [xs~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [xs~=row] > [xs~=v-self-start], :root [xs~=column] > [xs~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [xs~=row] > [xs~=v-self-end], :root [xs~=column] > [xs~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [xs~=row] > [xs~=v-self-stretch], :root [xs~=column] > [xs~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [xs~=row] > [xs~=v-self-selfstart], :root [xs~=column] > [xs~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [xs~=row] > [xs~=v-self-selfend], :root [xs~=column] > [xs~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [xs~=row] > [xs~=h-self-center], :root [xs~=column] > [xs~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [xs~=row] > [xs~=h-self-start], :root [xs~=column] > [xs~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [xs~=row] > [xs~=h-self-end], :root [xs~=column] > [xs~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [xs~=row] > [xs~=h-self-stretch], :root [xs~=column] > [xs~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [xs~=row] > [xs~=h-self-selfstart], :root [xs~=column] > [xs~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [xs~=row] > [xs~=h-self-selfend], :root [xs~=column] > [xs~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [xs~=row] > [xs~=h-self-left], :root [xs~=column] > [xs~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [xs~=row] > [xs~=h-self-right], :root [xs~=column] > [xs~=v-self-right] {
    justify-self: right;
  }

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

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

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

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

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

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

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

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

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

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

  [class*=d-flex],
:root [xs*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [xs*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [xs*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [xs*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [xs*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [xs*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [xs*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [xs*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [xs*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [xs*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [xs*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [xs*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [xs*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [xs*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [xs*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [xs*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [xs*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [xs*=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) {
  [class~=m-1-1],
:root [xs-l~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mt-1-1],
:root [xs-l~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mb-1-1],
:root [xs-l~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=ml-1-1],
:root [xs-l~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mr-1-1],
:root [xs-l~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mx-1-1],
:root [xs-l~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs-l) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=my-1-1],
:root [xs-l~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs-l) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=p-1-1],
:root [xs-l~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pt-1-1],
:root [xs-l~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pb-1-1],
:root [xs-l~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pl-1-1],
:root [xs-l~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pr-1-1],
:root [xs-l~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=px-1-1],
:root [xs-l~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs-l) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=py-1-1],
:root [xs-l~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs-l) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=h-1-1],
:root [xs-l~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-xs-l) * 1);
  }

  [class~=w-1-1],
:root [xs-l~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-xs-l) * 1);
  }

  [class~=m-2-1],
:root [xs-l~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mt-2-1],
:root [xs-l~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mb-2-1],
:root [xs-l~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=ml-2-1],
:root [xs-l~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mr-2-1],
:root [xs-l~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mx-2-1],
:root [xs-l~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs-l) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=my-2-1],
:root [xs-l~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs-l) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=p-2-1],
:root [xs-l~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pt-2-1],
:root [xs-l~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pb-2-1],
:root [xs-l~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pl-2-1],
:root [xs-l~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pr-2-1],
:root [xs-l~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=px-2-1],
:root [xs-l~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs-l) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=py-2-1],
:root [xs-l~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs-l) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=h-2-1],
:root [xs-l~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
  }

  [class~=w-2-1],
:root [xs-l~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
  }

  [class~=m-3-1],
:root [xs-l~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mt-3-1],
:root [xs-l~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mb-3-1],
:root [xs-l~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=ml-3-1],
:root [xs-l~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mr-3-1],
:root [xs-l~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mx-3-1],
:root [xs-l~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs-l) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=my-3-1],
:root [xs-l~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs-l) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=p-3-1],
:root [xs-l~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pt-3-1],
:root [xs-l~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pb-3-1],
:root [xs-l~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pl-3-1],
:root [xs-l~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pr-3-1],
:root [xs-l~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=px-3-1],
:root [xs-l~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs-l) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=py-3-1],
:root [xs-l~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs-l) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=h-3-1],
:root [xs-l~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs-l) * 3);
  }

  [class~=w-3-1],
:root [xs-l~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-xs-l) * 3);
  }

  [class~=m-4-1],
:root [xs-l~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mt-4-1],
:root [xs-l~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mb-4-1],
:root [xs-l~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=ml-4-1],
:root [xs-l~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mr-4-1],
:root [xs-l~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mx-4-1],
:root [xs-l~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs-l) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=my-4-1],
:root [xs-l~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs-l) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=p-4-1],
:root [xs-l~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pt-4-1],
:root [xs-l~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pb-4-1],
:root [xs-l~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pl-4-1],
:root [xs-l~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pr-4-1],
:root [xs-l~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=px-4-1],
:root [xs-l~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs-l) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=py-4-1],
:root [xs-l~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs-l) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=h-4-1],
:root [xs-l~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-xs-l) * 4);
  }

  [class~=w-4-1],
:root [xs-l~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-xs-l) * 4);
  }

  [class~=m-5-1],
:root [xs-l~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mt-5-1],
:root [xs-l~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mb-5-1],
:root [xs-l~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=ml-5-1],
:root [xs-l~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mr-5-1],
:root [xs-l~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mx-5-1],
:root [xs-l~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs-l) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=my-5-1],
:root [xs-l~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs-l) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=p-5-1],
:root [xs-l~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pt-5-1],
:root [xs-l~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pb-5-1],
:root [xs-l~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pl-5-1],
:root [xs-l~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pr-5-1],
:root [xs-l~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=px-5-1],
:root [xs-l~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs-l) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=py-5-1],
:root [xs-l~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=h-5-1],
:root [xs-l~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-xs-l) * 5);
  }

  [class~=w-5-1],
:root [xs-l~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-xs-l) * 5);
  }

  [class~=m-6-1],
:root [xs-l~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mt-6-1],
:root [xs-l~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mb-6-1],
:root [xs-l~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=ml-6-1],
:root [xs-l~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mr-6-1],
:root [xs-l~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mx-6-1],
:root [xs-l~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs-l) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=my-6-1],
:root [xs-l~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs-l) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=p-6-1],
:root [xs-l~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pt-6-1],
:root [xs-l~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pb-6-1],
:root [xs-l~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pl-6-1],
:root [xs-l~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pr-6-1],
:root [xs-l~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=px-6-1],
:root [xs-l~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs-l) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=py-6-1],
:root [xs-l~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs-l) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=h-6-1],
:root [xs-l~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-xs-l) * 6);
  }

  [class~=w-6-1],
:root [xs-l~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-xs-l) * 6);
  }

  [class~=m-7-1],
:root [xs-l~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mt-7-1],
:root [xs-l~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mb-7-1],
:root [xs-l~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=ml-7-1],
:root [xs-l~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mr-7-1],
:root [xs-l~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mx-7-1],
:root [xs-l~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs-l) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=my-7-1],
:root [xs-l~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs-l) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=p-7-1],
:root [xs-l~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pt-7-1],
:root [xs-l~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pb-7-1],
:root [xs-l~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pl-7-1],
:root [xs-l~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pr-7-1],
:root [xs-l~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=px-7-1],
:root [xs-l~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs-l) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=py-7-1],
:root [xs-l~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs-l) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=h-7-1],
:root [xs-l~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-xs-l) * 7);
  }

  [class~=w-7-1],
:root [xs-l~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-xs-l) * 7);
  }

  [class~=m-1-2],
:root [xs-l~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mt-1-2],
:root [xs-l~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mb-1-2],
:root [xs-l~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=ml-1-2],
:root [xs-l~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mr-1-2],
:root [xs-l~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mx-1-2],
:root [xs-l~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs-l) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=my-1-2],
:root [xs-l~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs-l) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=p-1-2],
:root [xs-l~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pt-1-2],
:root [xs-l~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pb-1-2],
:root [xs-l~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pl-1-2],
:root [xs-l~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pr-1-2],
:root [xs-l~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=px-1-2],
:root [xs-l~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs-l) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=py-1-2],
:root [xs-l~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs-l) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=h-1-2],
:root [xs-l~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-xs-l) / 2);
  }

  [class~=w-1-2],
:root [xs-l~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-xs-l) / 2);
  }

  [class~=m-1-3],
:root [xs-l~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mt-1-3],
:root [xs-l~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mb-1-3],
:root [xs-l~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=ml-1-3],
:root [xs-l~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mr-1-3],
:root [xs-l~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mx-1-3],
:root [xs-l~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs-l) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=my-1-3],
:root [xs-l~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs-l) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=p-1-3],
:root [xs-l~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pt-1-3],
:root [xs-l~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pb-1-3],
:root [xs-l~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pl-1-3],
:root [xs-l~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pr-1-3],
:root [xs-l~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=px-1-3],
:root [xs-l~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs-l) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=py-1-3],
:root [xs-l~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs-l) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=h-1-3],
:root [xs-l~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-xs-l) / 3);
  }

  [class~=w-1-3],
:root [xs-l~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-xs-l) / 3);
  }

  [class~=m-1-4],
:root [xs-l~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mt-1-4],
:root [xs-l~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mb-1-4],
:root [xs-l~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=ml-1-4],
:root [xs-l~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mr-1-4],
:root [xs-l~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mx-1-4],
:root [xs-l~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs-l) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=my-1-4],
:root [xs-l~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs-l) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=p-1-4],
:root [xs-l~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pt-1-4],
:root [xs-l~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pb-1-4],
:root [xs-l~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pl-1-4],
:root [xs-l~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pr-1-4],
:root [xs-l~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=px-1-4],
:root [xs-l~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs-l) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=py-1-4],
:root [xs-l~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs-l) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=h-1-4],
:root [xs-l~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-xs-l) / 4);
  }

  [class~=w-1-4],
:root [xs-l~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-xs-l) / 4);
  }

  [class~=m-0],
:root [xs-l~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [xs-l~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [xs-l~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [xs-l~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [xs-l~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [xs-l~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [xs-l~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [xs-l~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [xs-l~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [xs-l~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [xs-l~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [xs-l~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [xs-l~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [xs-l~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [xs-l~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [xs-l~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [xs-l~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-xs-l) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-xs-l) * -1);
  }
  [class~=gutter] > *,
:root [xs-l~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-xs-l) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-xs-l) * 1);
  }

  [class~=gutter-1-2],
:root [xs-l~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-xs-l) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-xs-l) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [xs-l~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-xs-l) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-xs-l) * 0.5);
  }

  [class~=gutter-1-3],
:root [xs-l~=gutter-1-3] {
    margin-left: calc(28px * -0.333);
    margin-left: calc(var(--gutter-xs-l) * -0.333);
    margin-right: calc(28px * -0.333);
    margin-right: calc(var(--gutter-xs-l) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [xs-l~=gutter-1-3] > * {
    padding-left: calc(28px * 0.333);
    padding-left: calc(var(--gutter-xs-l) * 0.333);
    padding-right: calc(28px * 0.333);
    padding-right: calc(var(--gutter-xs-l) * 0.333);
  }

  [class~=gutter-1-4],
:root [xs-l~=gutter-1-4] {
    margin-left: calc(28px * -0.25);
    margin-left: calc(var(--gutter-xs-l) * -0.25);
    margin-right: calc(28px * -0.25);
    margin-right: calc(var(--gutter-xs-l) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [xs-l~=gutter-1-4] > * {
    padding-left: calc(28px * 0.25);
    padding-left: calc(var(--gutter-xs-l) * 0.25);
    padding-right: calc(28px * 0.25);
    padding-right: calc(var(--gutter-xs-l) * 0.25);
  }

  [class~=row-12],
:root [xs-l~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [xs-l~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [xs-l~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [xs-l~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [xs-l~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [xs-l~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [xs-l~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [xs-l~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [xs-l~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [xs-l~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [xs-l~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [xs-l~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [xs-l~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [xs-l~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [xs-l~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [xs-l~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [xs-l~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [xs-l~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [xs-l~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [xs-l~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [xs-l~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [xs-l~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [xs-l~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [xs-l~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [xs-l~=row],
:root [xs-l~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [xs-l~=row] > *,
:root [xs-l~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [xs-l~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [xs-l~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [xs-l~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [xs-l~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [xs-l~=row][xs-l~=v-center], :root [xs-l~=column][xs-l~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [xs-l~=row][xs-l~=v-start], :root [xs-l~=column][xs-l~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [xs-l~=row][xs-l~=v-end], :root [xs-l~=column][xs-l~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [xs-l~=row][xs-l~=v-stretch], :root [xs-l~=column][xs-l~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [xs-l~=row][xs-l~=h-center], :root [xs-l~=column][xs-l~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [xs-l~=row][xs-l~=h-start], :root [xs-l~=column][xs-l~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [xs-l~=row][xs-l~=h-end], :root [xs-l~=column][xs-l~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [xs-l~=row][xs-l~=h-spacein], :root [xs-l~=column][xs-l~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [xs-l~=row][xs-l~=h-spaceout], :root [xs-l~=column][xs-l~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [xs-l~=row] > [xs-l~=v-self-center], :root [xs-l~=column] > [xs-l~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [xs-l~=row] > [xs-l~=v-self-start], :root [xs-l~=column] > [xs-l~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [xs-l~=row] > [xs-l~=v-self-end], :root [xs-l~=column] > [xs-l~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [xs-l~=row] > [xs-l~=v-self-stretch], :root [xs-l~=column] > [xs-l~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [xs-l~=row] > [xs-l~=v-self-selfstart], :root [xs-l~=column] > [xs-l~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [xs-l~=row] > [xs-l~=v-self-selfend], :root [xs-l~=column] > [xs-l~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [xs-l~=row] > [xs-l~=h-self-center], :root [xs-l~=column] > [xs-l~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [xs-l~=row] > [xs-l~=h-self-start], :root [xs-l~=column] > [xs-l~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [xs-l~=row] > [xs-l~=h-self-end], :root [xs-l~=column] > [xs-l~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [xs-l~=row] > [xs-l~=h-self-stretch], :root [xs-l~=column] > [xs-l~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [xs-l~=row] > [xs-l~=h-self-selfstart], :root [xs-l~=column] > [xs-l~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [xs-l~=row] > [xs-l~=h-self-selfend], :root [xs-l~=column] > [xs-l~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [xs-l~=row] > [xs-l~=h-self-left], :root [xs-l~=column] > [xs-l~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [xs-l~=row] > [xs-l~=h-self-right], :root [xs-l~=column] > [xs-l~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-xs-l-1 {
    flex-grow: 1;
  }

  .flex-grow-xs-l-2 {
    flex-grow: 2;
  }

  .flex-grow-xs-l-3 {
    flex-grow: 3;
  }

  .flex-grow-xs-l-4 {
    flex-grow: 4;
  }

  .flex-grow-xs-l-5 {
    flex-grow: 5;
  }

  .flex-grow-xs-l-6 {
    flex-grow: 6;
  }

  .flex-grow-xs-l-7 {
    flex-grow: 7;
  }

  .flex-grow-xs-l-8 {
    flex-grow: 8;
  }

  .flex-grow-xs-l-9 {
    flex-grow: 9;
  }

  .flex-grow-xs-l-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [xs-l*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [xs-l*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [xs-l*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [xs-l*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [xs-l*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [xs-l*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [xs-l*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [xs-l*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [xs-l*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [xs-l*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [xs-l*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [xs-l*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [xs-l*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [xs-l*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [xs-l*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [xs-l*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [xs-l*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [xs-l*=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) {
  [class~=m-1-1],
:root [sm~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-sm) * 1);
  }

  [class~=mt-1-1],
:root [sm~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-sm) * 1);
  }

  [class~=mb-1-1],
:root [sm~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=ml-1-1],
:root [sm~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-sm) * 1);
  }

  [class~=mr-1-1],
:root [sm~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-sm) * 1);
  }

  [class~=mx-1-1],
:root [sm~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-sm) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-sm) * 1);
  }

  [class~=my-1-1],
:root [sm~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-sm) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=p-1-1],
:root [sm~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-sm) * 1);
  }

  [class~=pt-1-1],
:root [sm~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-sm) * 1);
  }

  [class~=pb-1-1],
:root [sm~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=pl-1-1],
:root [sm~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-sm) * 1);
  }

  [class~=pr-1-1],
:root [sm~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-sm) * 1);
  }

  [class~=px-1-1],
:root [sm~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-sm) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-sm) * 1);
  }

  [class~=py-1-1],
:root [sm~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-sm) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=h-1-1],
:root [sm~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-sm) * 1);
  }

  [class~=w-1-1],
:root [sm~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-sm) * 1);
  }

  [class~=m-2-1],
:root [sm~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-sm) * 2);
  }

  [class~=mt-2-1],
:root [sm~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-sm) * 2);
  }

  [class~=mb-2-1],
:root [sm~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=ml-2-1],
:root [sm~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-sm) * 2);
  }

  [class~=mr-2-1],
:root [sm~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-sm) * 2);
  }

  [class~=mx-2-1],
:root [sm~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-sm) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-sm) * 2);
  }

  [class~=my-2-1],
:root [sm~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-sm) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=p-2-1],
:root [sm~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-sm) * 2);
  }

  [class~=pt-2-1],
:root [sm~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-sm) * 2);
  }

  [class~=pb-2-1],
:root [sm~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=pl-2-1],
:root [sm~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-sm) * 2);
  }

  [class~=pr-2-1],
:root [sm~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-sm) * 2);
  }

  [class~=px-2-1],
:root [sm~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-sm) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-sm) * 2);
  }

  [class~=py-2-1],
:root [sm~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-sm) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=h-2-1],
:root [sm~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
  }

  [class~=w-2-1],
:root [sm~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
  }

  [class~=m-3-1],
:root [sm~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-sm) * 3);
  }

  [class~=mt-3-1],
:root [sm~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-sm) * 3);
  }

  [class~=mb-3-1],
:root [sm~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=ml-3-1],
:root [sm~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-sm) * 3);
  }

  [class~=mr-3-1],
:root [sm~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-sm) * 3);
  }

  [class~=mx-3-1],
:root [sm~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-sm) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-sm) * 3);
  }

  [class~=my-3-1],
:root [sm~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-sm) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=p-3-1],
:root [sm~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-sm) * 3);
  }

  [class~=pt-3-1],
:root [sm~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-sm) * 3);
  }

  [class~=pb-3-1],
:root [sm~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=pl-3-1],
:root [sm~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-sm) * 3);
  }

  [class~=pr-3-1],
:root [sm~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-sm) * 3);
  }

  [class~=px-3-1],
:root [sm~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-sm) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-sm) * 3);
  }

  [class~=py-3-1],
:root [sm~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-sm) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=h-3-1],
:root [sm~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-sm) * 3);
  }

  [class~=w-3-1],
:root [sm~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-sm) * 3);
  }

  [class~=m-4-1],
:root [sm~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-sm) * 4);
  }

  [class~=mt-4-1],
:root [sm~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-sm) * 4);
  }

  [class~=mb-4-1],
:root [sm~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=ml-4-1],
:root [sm~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-sm) * 4);
  }

  [class~=mr-4-1],
:root [sm~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-sm) * 4);
  }

  [class~=mx-4-1],
:root [sm~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-sm) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-sm) * 4);
  }

  [class~=my-4-1],
:root [sm~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-sm) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=p-4-1],
:root [sm~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-sm) * 4);
  }

  [class~=pt-4-1],
:root [sm~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-sm) * 4);
  }

  [class~=pb-4-1],
:root [sm~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=pl-4-1],
:root [sm~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-sm) * 4);
  }

  [class~=pr-4-1],
:root [sm~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-sm) * 4);
  }

  [class~=px-4-1],
:root [sm~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-sm) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-sm) * 4);
  }

  [class~=py-4-1],
:root [sm~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-sm) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=h-4-1],
:root [sm~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-sm) * 4);
  }

  [class~=w-4-1],
:root [sm~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-sm) * 4);
  }

  [class~=m-5-1],
:root [sm~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-sm) * 5);
  }

  [class~=mt-5-1],
:root [sm~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-sm) * 5);
  }

  [class~=mb-5-1],
:root [sm~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=ml-5-1],
:root [sm~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-sm) * 5);
  }

  [class~=mr-5-1],
:root [sm~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-sm) * 5);
  }

  [class~=mx-5-1],
:root [sm~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-sm) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-sm) * 5);
  }

  [class~=my-5-1],
:root [sm~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-sm) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=p-5-1],
:root [sm~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-sm) * 5);
  }

  [class~=pt-5-1],
:root [sm~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
  }

  [class~=pb-5-1],
:root [sm~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=pl-5-1],
:root [sm~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-sm) * 5);
  }

  [class~=pr-5-1],
:root [sm~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-sm) * 5);
  }

  [class~=px-5-1],
:root [sm~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-sm) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-sm) * 5);
  }

  [class~=py-5-1],
:root [sm~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=h-5-1],
:root [sm~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-sm) * 5);
  }

  [class~=w-5-1],
:root [sm~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-sm) * 5);
  }

  [class~=m-6-1],
:root [sm~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-sm) * 6);
  }

  [class~=mt-6-1],
:root [sm~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-sm) * 6);
  }

  [class~=mb-6-1],
:root [sm~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=ml-6-1],
:root [sm~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-sm) * 6);
  }

  [class~=mr-6-1],
:root [sm~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-sm) * 6);
  }

  [class~=mx-6-1],
:root [sm~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-sm) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-sm) * 6);
  }

  [class~=my-6-1],
:root [sm~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-sm) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=p-6-1],
:root [sm~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-sm) * 6);
  }

  [class~=pt-6-1],
:root [sm~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-sm) * 6);
  }

  [class~=pb-6-1],
:root [sm~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=pl-6-1],
:root [sm~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-sm) * 6);
  }

  [class~=pr-6-1],
:root [sm~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-sm) * 6);
  }

  [class~=px-6-1],
:root [sm~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-sm) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-sm) * 6);
  }

  [class~=py-6-1],
:root [sm~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-sm) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=h-6-1],
:root [sm~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-sm) * 6);
  }

  [class~=w-6-1],
:root [sm~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-sm) * 6);
  }

  [class~=m-7-1],
:root [sm~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-sm) * 7);
  }

  [class~=mt-7-1],
:root [sm~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-sm) * 7);
  }

  [class~=mb-7-1],
:root [sm~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=ml-7-1],
:root [sm~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-sm) * 7);
  }

  [class~=mr-7-1],
:root [sm~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-sm) * 7);
  }

  [class~=mx-7-1],
:root [sm~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-sm) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-sm) * 7);
  }

  [class~=my-7-1],
:root [sm~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-sm) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=p-7-1],
:root [sm~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-sm) * 7);
  }

  [class~=pt-7-1],
:root [sm~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-sm) * 7);
  }

  [class~=pb-7-1],
:root [sm~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=pl-7-1],
:root [sm~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-sm) * 7);
  }

  [class~=pr-7-1],
:root [sm~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-sm) * 7);
  }

  [class~=px-7-1],
:root [sm~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-sm) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-sm) * 7);
  }

  [class~=py-7-1],
:root [sm~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-sm) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=h-7-1],
:root [sm~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-sm) * 7);
  }

  [class~=w-7-1],
:root [sm~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-sm) * 7);
  }

  [class~=m-1-2],
:root [sm~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-sm) / 2);
  }

  [class~=mt-1-2],
:root [sm~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-sm) / 2);
  }

  [class~=mb-1-2],
:root [sm~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=ml-1-2],
:root [sm~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-sm) / 2);
  }

  [class~=mr-1-2],
:root [sm~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-sm) / 2);
  }

  [class~=mx-1-2],
:root [sm~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-sm) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-sm) / 2);
  }

  [class~=my-1-2],
:root [sm~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-sm) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=p-1-2],
:root [sm~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-sm) / 2);
  }

  [class~=pt-1-2],
:root [sm~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-sm) / 2);
  }

  [class~=pb-1-2],
:root [sm~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=pl-1-2],
:root [sm~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-sm) / 2);
  }

  [class~=pr-1-2],
:root [sm~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-sm) / 2);
  }

  [class~=px-1-2],
:root [sm~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-sm) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-sm) / 2);
  }

  [class~=py-1-2],
:root [sm~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-sm) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=h-1-2],
:root [sm~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-sm) / 2);
  }

  [class~=w-1-2],
:root [sm~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-sm) / 2);
  }

  [class~=m-1-3],
:root [sm~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-sm) / 3);
  }

  [class~=mt-1-3],
:root [sm~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-sm) / 3);
  }

  [class~=mb-1-3],
:root [sm~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=ml-1-3],
:root [sm~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-sm) / 3);
  }

  [class~=mr-1-3],
:root [sm~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-sm) / 3);
  }

  [class~=mx-1-3],
:root [sm~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-sm) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-sm) / 3);
  }

  [class~=my-1-3],
:root [sm~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-sm) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=p-1-3],
:root [sm~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-sm) / 3);
  }

  [class~=pt-1-3],
:root [sm~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-sm) / 3);
  }

  [class~=pb-1-3],
:root [sm~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=pl-1-3],
:root [sm~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-sm) / 3);
  }

  [class~=pr-1-3],
:root [sm~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-sm) / 3);
  }

  [class~=px-1-3],
:root [sm~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-sm) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-sm) / 3);
  }

  [class~=py-1-3],
:root [sm~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-sm) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=h-1-3],
:root [sm~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-sm) / 3);
  }

  [class~=w-1-3],
:root [sm~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-sm) / 3);
  }

  [class~=m-1-4],
:root [sm~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-sm) / 4);
  }

  [class~=mt-1-4],
:root [sm~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-sm) / 4);
  }

  [class~=mb-1-4],
:root [sm~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=ml-1-4],
:root [sm~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-sm) / 4);
  }

  [class~=mr-1-4],
:root [sm~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-sm) / 4);
  }

  [class~=mx-1-4],
:root [sm~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-sm) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-sm) / 4);
  }

  [class~=my-1-4],
:root [sm~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-sm) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=p-1-4],
:root [sm~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-sm) / 4);
  }

  [class~=pt-1-4],
:root [sm~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-sm) / 4);
  }

  [class~=pb-1-4],
:root [sm~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=pl-1-4],
:root [sm~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-sm) / 4);
  }

  [class~=pr-1-4],
:root [sm~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-sm) / 4);
  }

  [class~=px-1-4],
:root [sm~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-sm) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-sm) / 4);
  }

  [class~=py-1-4],
:root [sm~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-sm) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=h-1-4],
:root [sm~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-sm) / 4);
  }

  [class~=w-1-4],
:root [sm~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-sm) / 4);
  }

  [class~=m-0],
:root [sm~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [sm~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [sm~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [sm~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [sm~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [sm~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [sm~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [sm~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [sm~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [sm~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [sm~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [sm~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [sm~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [sm~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [sm~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [sm~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [sm~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-sm) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-sm) * -1);
  }
  [class~=gutter] > *,
:root [sm~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-sm) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-sm) * 1);
  }

  [class~=gutter-1-2],
:root [sm~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-sm) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-sm) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [sm~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-sm) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-sm) * 0.5);
  }

  [class~=gutter-1-3],
:root [sm~=gutter-1-3] {
    margin-left: calc(28px * -0.333);
    margin-left: calc(var(--gutter-sm) * -0.333);
    margin-right: calc(28px * -0.333);
    margin-right: calc(var(--gutter-sm) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [sm~=gutter-1-3] > * {
    padding-left: calc(28px * 0.333);
    padding-left: calc(var(--gutter-sm) * 0.333);
    padding-right: calc(28px * 0.333);
    padding-right: calc(var(--gutter-sm) * 0.333);
  }

  [class~=gutter-1-4],
:root [sm~=gutter-1-4] {
    margin-left: calc(28px * -0.25);
    margin-left: calc(var(--gutter-sm) * -0.25);
    margin-right: calc(28px * -0.25);
    margin-right: calc(var(--gutter-sm) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [sm~=gutter-1-4] > * {
    padding-left: calc(28px * 0.25);
    padding-left: calc(var(--gutter-sm) * 0.25);
    padding-right: calc(28px * 0.25);
    padding-right: calc(var(--gutter-sm) * 0.25);
  }

  [class~=row-12],
:root [sm~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [sm~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [sm~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [sm~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [sm~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [sm~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [sm~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [sm~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [sm~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [sm~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [sm~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [sm~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [sm~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [sm~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [sm~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [sm~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [sm~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [sm~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [sm~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [sm~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [sm~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [sm~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [sm~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [sm~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [sm~=row],
:root [sm~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [sm~=row] > *,
:root [sm~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [sm~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [sm~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [sm~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [sm~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [sm~=row][sm~=v-center], :root [sm~=column][sm~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [sm~=row][sm~=v-start], :root [sm~=column][sm~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [sm~=row][sm~=v-end], :root [sm~=column][sm~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [sm~=row][sm~=v-stretch], :root [sm~=column][sm~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [sm~=row][sm~=h-center], :root [sm~=column][sm~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [sm~=row][sm~=h-start], :root [sm~=column][sm~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [sm~=row][sm~=h-end], :root [sm~=column][sm~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [sm~=row][sm~=h-spacein], :root [sm~=column][sm~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [sm~=row][sm~=h-spaceout], :root [sm~=column][sm~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [sm~=row] > [sm~=v-self-center], :root [sm~=column] > [sm~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [sm~=row] > [sm~=v-self-start], :root [sm~=column] > [sm~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [sm~=row] > [sm~=v-self-end], :root [sm~=column] > [sm~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [sm~=row] > [sm~=v-self-stretch], :root [sm~=column] > [sm~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [sm~=row] > [sm~=v-self-selfstart], :root [sm~=column] > [sm~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [sm~=row] > [sm~=v-self-selfend], :root [sm~=column] > [sm~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [sm~=row] > [sm~=h-self-center], :root [sm~=column] > [sm~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [sm~=row] > [sm~=h-self-start], :root [sm~=column] > [sm~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [sm~=row] > [sm~=h-self-end], :root [sm~=column] > [sm~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [sm~=row] > [sm~=h-self-stretch], :root [sm~=column] > [sm~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [sm~=row] > [sm~=h-self-selfstart], :root [sm~=column] > [sm~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [sm~=row] > [sm~=h-self-selfend], :root [sm~=column] > [sm~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [sm~=row] > [sm~=h-self-left], :root [sm~=column] > [sm~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [sm~=row] > [sm~=h-self-right], :root [sm~=column] > [sm~=v-self-right] {
    justify-self: right;
  }

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

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

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

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

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

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

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

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

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

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

  [class*=d-flex],
:root [sm*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [sm*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [sm*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [sm*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [sm*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [sm*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [sm*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [sm*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [sm*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [sm*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [sm*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [sm*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [sm*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [sm*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [sm*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [sm*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [sm*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [sm*=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) {
  [class~=m-1-1],
:root [sm-l~=m-1-1] {
    margin: calc(24px * 1);
    margin: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mt-1-1],
:root [sm-l~=mt-1-1] {
    margin-top: calc(24px * 1);
    margin-top: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mb-1-1],
:root [sm-l~=mb-1-1] {
    margin-bottom: calc(24px * 1);
    margin-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=ml-1-1],
:root [sm-l~=ml-1-1] {
    margin-left: calc(24px * 1);
    margin-left: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mr-1-1],
:root [sm-l~=mr-1-1] {
    margin-right: calc(24px * 1);
    margin-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mx-1-1],
:root [sm-l~=mx-1-1] {
    margin-left: calc(24px * 1);
    margin-left: calc(var(--spacer-sm-l) * 1);
    margin-right: calc(24px * 1);
    margin-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=my-1-1],
:root [sm-l~=my-1-1] {
    margin-top: calc(24px * 1);
    margin-top: calc(var(--spacer-sm-l) * 1);
    margin-bottom: calc(24px * 1);
    margin-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=p-1-1],
:root [sm-l~=p-1-1] {
    padding: calc(24px * 1);
    padding: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pt-1-1],
:root [sm-l~=pt-1-1] {
    padding-top: calc(24px * 1);
    padding-top: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pb-1-1],
:root [sm-l~=pb-1-1] {
    padding-bottom: calc(24px * 1);
    padding-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pl-1-1],
:root [sm-l~=pl-1-1] {
    padding-left: calc(24px * 1);
    padding-left: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pr-1-1],
:root [sm-l~=pr-1-1] {
    padding-right: calc(24px * 1);
    padding-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=px-1-1],
:root [sm-l~=px-1-1] {
    padding-left: calc(24px * 1);
    padding-left: calc(var(--spacer-sm-l) * 1);
    padding-right: calc(24px * 1);
    padding-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=py-1-1],
:root [sm-l~=py-1-1] {
    padding-top: calc(24px * 1);
    padding-top: calc(var(--spacer-sm-l) * 1);
    padding-bottom: calc(24px * 1);
    padding-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=h-1-1],
:root [sm-l~=h-1-1] {
    height: calc(24px * 1);
    height: calc(var(--spacer-sm-l) * 1);
  }

  [class~=w-1-1],
:root [sm-l~=w-1-1] {
    width: calc(24px * 1);
    width: calc(var(--spacer-sm-l) * 1);
  }

  [class~=m-2-1],
:root [sm-l~=m-2-1] {
    margin: calc(24px * 2);
    margin: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mt-2-1],
:root [sm-l~=mt-2-1] {
    margin-top: calc(24px * 2);
    margin-top: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mb-2-1],
:root [sm-l~=mb-2-1] {
    margin-bottom: calc(24px * 2);
    margin-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=ml-2-1],
:root [sm-l~=ml-2-1] {
    margin-left: calc(24px * 2);
    margin-left: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mr-2-1],
:root [sm-l~=mr-2-1] {
    margin-right: calc(24px * 2);
    margin-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mx-2-1],
:root [sm-l~=mx-2-1] {
    margin-left: calc(24px * 2);
    margin-left: calc(var(--spacer-sm-l) * 2);
    margin-right: calc(24px * 2);
    margin-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=my-2-1],
:root [sm-l~=my-2-1] {
    margin-top: calc(24px * 2);
    margin-top: calc(var(--spacer-sm-l) * 2);
    margin-bottom: calc(24px * 2);
    margin-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=p-2-1],
:root [sm-l~=p-2-1] {
    padding: calc(24px * 2);
    padding: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pt-2-1],
:root [sm-l~=pt-2-1] {
    padding-top: calc(24px * 2);
    padding-top: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pb-2-1],
:root [sm-l~=pb-2-1] {
    padding-bottom: calc(24px * 2);
    padding-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pl-2-1],
:root [sm-l~=pl-2-1] {
    padding-left: calc(24px * 2);
    padding-left: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pr-2-1],
:root [sm-l~=pr-2-1] {
    padding-right: calc(24px * 2);
    padding-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=px-2-1],
:root [sm-l~=px-2-1] {
    padding-left: calc(24px * 2);
    padding-left: calc(var(--spacer-sm-l) * 2);
    padding-right: calc(24px * 2);
    padding-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=py-2-1],
:root [sm-l~=py-2-1] {
    padding-top: calc(24px * 2);
    padding-top: calc(var(--spacer-sm-l) * 2);
    padding-bottom: calc(24px * 2);
    padding-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=h-2-1],
:root [sm-l~=h-2-1] {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
  }

  [class~=w-2-1],
:root [sm-l~=w-2-1] {
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
  }

  [class~=m-3-1],
:root [sm-l~=m-3-1] {
    margin: calc(24px * 3);
    margin: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mt-3-1],
:root [sm-l~=mt-3-1] {
    margin-top: calc(24px * 3);
    margin-top: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mb-3-1],
:root [sm-l~=mb-3-1] {
    margin-bottom: calc(24px * 3);
    margin-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=ml-3-1],
:root [sm-l~=ml-3-1] {
    margin-left: calc(24px * 3);
    margin-left: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mr-3-1],
:root [sm-l~=mr-3-1] {
    margin-right: calc(24px * 3);
    margin-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mx-3-1],
:root [sm-l~=mx-3-1] {
    margin-left: calc(24px * 3);
    margin-left: calc(var(--spacer-sm-l) * 3);
    margin-right: calc(24px * 3);
    margin-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=my-3-1],
:root [sm-l~=my-3-1] {
    margin-top: calc(24px * 3);
    margin-top: calc(var(--spacer-sm-l) * 3);
    margin-bottom: calc(24px * 3);
    margin-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=p-3-1],
:root [sm-l~=p-3-1] {
    padding: calc(24px * 3);
    padding: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pt-3-1],
:root [sm-l~=pt-3-1] {
    padding-top: calc(24px * 3);
    padding-top: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pb-3-1],
:root [sm-l~=pb-3-1] {
    padding-bottom: calc(24px * 3);
    padding-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pl-3-1],
:root [sm-l~=pl-3-1] {
    padding-left: calc(24px * 3);
    padding-left: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pr-3-1],
:root [sm-l~=pr-3-1] {
    padding-right: calc(24px * 3);
    padding-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=px-3-1],
:root [sm-l~=px-3-1] {
    padding-left: calc(24px * 3);
    padding-left: calc(var(--spacer-sm-l) * 3);
    padding-right: calc(24px * 3);
    padding-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=py-3-1],
:root [sm-l~=py-3-1] {
    padding-top: calc(24px * 3);
    padding-top: calc(var(--spacer-sm-l) * 3);
    padding-bottom: calc(24px * 3);
    padding-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=h-3-1],
:root [sm-l~=h-3-1] {
    height: calc(24px * 3);
    height: calc(var(--spacer-sm-l) * 3);
  }

  [class~=w-3-1],
:root [sm-l~=w-3-1] {
    width: calc(24px * 3);
    width: calc(var(--spacer-sm-l) * 3);
  }

  [class~=m-4-1],
:root [sm-l~=m-4-1] {
    margin: calc(24px * 4);
    margin: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mt-4-1],
:root [sm-l~=mt-4-1] {
    margin-top: calc(24px * 4);
    margin-top: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mb-4-1],
:root [sm-l~=mb-4-1] {
    margin-bottom: calc(24px * 4);
    margin-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=ml-4-1],
:root [sm-l~=ml-4-1] {
    margin-left: calc(24px * 4);
    margin-left: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mr-4-1],
:root [sm-l~=mr-4-1] {
    margin-right: calc(24px * 4);
    margin-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mx-4-1],
:root [sm-l~=mx-4-1] {
    margin-left: calc(24px * 4);
    margin-left: calc(var(--spacer-sm-l) * 4);
    margin-right: calc(24px * 4);
    margin-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=my-4-1],
:root [sm-l~=my-4-1] {
    margin-top: calc(24px * 4);
    margin-top: calc(var(--spacer-sm-l) * 4);
    margin-bottom: calc(24px * 4);
    margin-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=p-4-1],
:root [sm-l~=p-4-1] {
    padding: calc(24px * 4);
    padding: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pt-4-1],
:root [sm-l~=pt-4-1] {
    padding-top: calc(24px * 4);
    padding-top: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pb-4-1],
:root [sm-l~=pb-4-1] {
    padding-bottom: calc(24px * 4);
    padding-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pl-4-1],
:root [sm-l~=pl-4-1] {
    padding-left: calc(24px * 4);
    padding-left: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pr-4-1],
:root [sm-l~=pr-4-1] {
    padding-right: calc(24px * 4);
    padding-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=px-4-1],
:root [sm-l~=px-4-1] {
    padding-left: calc(24px * 4);
    padding-left: calc(var(--spacer-sm-l) * 4);
    padding-right: calc(24px * 4);
    padding-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=py-4-1],
:root [sm-l~=py-4-1] {
    padding-top: calc(24px * 4);
    padding-top: calc(var(--spacer-sm-l) * 4);
    padding-bottom: calc(24px * 4);
    padding-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=h-4-1],
:root [sm-l~=h-4-1] {
    height: calc(24px * 4);
    height: calc(var(--spacer-sm-l) * 4);
  }

  [class~=w-4-1],
:root [sm-l~=w-4-1] {
    width: calc(24px * 4);
    width: calc(var(--spacer-sm-l) * 4);
  }

  [class~=m-5-1],
:root [sm-l~=m-5-1] {
    margin: calc(24px * 5);
    margin: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mt-5-1],
:root [sm-l~=mt-5-1] {
    margin-top: calc(24px * 5);
    margin-top: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mb-5-1],
:root [sm-l~=mb-5-1] {
    margin-bottom: calc(24px * 5);
    margin-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=ml-5-1],
:root [sm-l~=ml-5-1] {
    margin-left: calc(24px * 5);
    margin-left: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mr-5-1],
:root [sm-l~=mr-5-1] {
    margin-right: calc(24px * 5);
    margin-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mx-5-1],
:root [sm-l~=mx-5-1] {
    margin-left: calc(24px * 5);
    margin-left: calc(var(--spacer-sm-l) * 5);
    margin-right: calc(24px * 5);
    margin-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=my-5-1],
:root [sm-l~=my-5-1] {
    margin-top: calc(24px * 5);
    margin-top: calc(var(--spacer-sm-l) * 5);
    margin-bottom: calc(24px * 5);
    margin-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=p-5-1],
:root [sm-l~=p-5-1] {
    padding: calc(24px * 5);
    padding: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pt-5-1],
:root [sm-l~=pt-5-1] {
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pb-5-1],
:root [sm-l~=pb-5-1] {
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pl-5-1],
:root [sm-l~=pl-5-1] {
    padding-left: calc(24px * 5);
    padding-left: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pr-5-1],
:root [sm-l~=pr-5-1] {
    padding-right: calc(24px * 5);
    padding-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=px-5-1],
:root [sm-l~=px-5-1] {
    padding-left: calc(24px * 5);
    padding-left: calc(var(--spacer-sm-l) * 5);
    padding-right: calc(24px * 5);
    padding-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=py-5-1],
:root [sm-l~=py-5-1] {
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=h-5-1],
:root [sm-l~=h-5-1] {
    height: calc(24px * 5);
    height: calc(var(--spacer-sm-l) * 5);
  }

  [class~=w-5-1],
:root [sm-l~=w-5-1] {
    width: calc(24px * 5);
    width: calc(var(--spacer-sm-l) * 5);
  }

  [class~=m-6-1],
:root [sm-l~=m-6-1] {
    margin: calc(24px * 6);
    margin: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mt-6-1],
:root [sm-l~=mt-6-1] {
    margin-top: calc(24px * 6);
    margin-top: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mb-6-1],
:root [sm-l~=mb-6-1] {
    margin-bottom: calc(24px * 6);
    margin-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=ml-6-1],
:root [sm-l~=ml-6-1] {
    margin-left: calc(24px * 6);
    margin-left: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mr-6-1],
:root [sm-l~=mr-6-1] {
    margin-right: calc(24px * 6);
    margin-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mx-6-1],
:root [sm-l~=mx-6-1] {
    margin-left: calc(24px * 6);
    margin-left: calc(var(--spacer-sm-l) * 6);
    margin-right: calc(24px * 6);
    margin-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=my-6-1],
:root [sm-l~=my-6-1] {
    margin-top: calc(24px * 6);
    margin-top: calc(var(--spacer-sm-l) * 6);
    margin-bottom: calc(24px * 6);
    margin-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=p-6-1],
:root [sm-l~=p-6-1] {
    padding: calc(24px * 6);
    padding: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pt-6-1],
:root [sm-l~=pt-6-1] {
    padding-top: calc(24px * 6);
    padding-top: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pb-6-1],
:root [sm-l~=pb-6-1] {
    padding-bottom: calc(24px * 6);
    padding-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pl-6-1],
:root [sm-l~=pl-6-1] {
    padding-left: calc(24px * 6);
    padding-left: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pr-6-1],
:root [sm-l~=pr-6-1] {
    padding-right: calc(24px * 6);
    padding-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=px-6-1],
:root [sm-l~=px-6-1] {
    padding-left: calc(24px * 6);
    padding-left: calc(var(--spacer-sm-l) * 6);
    padding-right: calc(24px * 6);
    padding-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=py-6-1],
:root [sm-l~=py-6-1] {
    padding-top: calc(24px * 6);
    padding-top: calc(var(--spacer-sm-l) * 6);
    padding-bottom: calc(24px * 6);
    padding-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=h-6-1],
:root [sm-l~=h-6-1] {
    height: calc(24px * 6);
    height: calc(var(--spacer-sm-l) * 6);
  }

  [class~=w-6-1],
:root [sm-l~=w-6-1] {
    width: calc(24px * 6);
    width: calc(var(--spacer-sm-l) * 6);
  }

  [class~=m-7-1],
:root [sm-l~=m-7-1] {
    margin: calc(24px * 7);
    margin: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mt-7-1],
:root [sm-l~=mt-7-1] {
    margin-top: calc(24px * 7);
    margin-top: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mb-7-1],
:root [sm-l~=mb-7-1] {
    margin-bottom: calc(24px * 7);
    margin-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=ml-7-1],
:root [sm-l~=ml-7-1] {
    margin-left: calc(24px * 7);
    margin-left: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mr-7-1],
:root [sm-l~=mr-7-1] {
    margin-right: calc(24px * 7);
    margin-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mx-7-1],
:root [sm-l~=mx-7-1] {
    margin-left: calc(24px * 7);
    margin-left: calc(var(--spacer-sm-l) * 7);
    margin-right: calc(24px * 7);
    margin-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=my-7-1],
:root [sm-l~=my-7-1] {
    margin-top: calc(24px * 7);
    margin-top: calc(var(--spacer-sm-l) * 7);
    margin-bottom: calc(24px * 7);
    margin-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=p-7-1],
:root [sm-l~=p-7-1] {
    padding: calc(24px * 7);
    padding: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pt-7-1],
:root [sm-l~=pt-7-1] {
    padding-top: calc(24px * 7);
    padding-top: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pb-7-1],
:root [sm-l~=pb-7-1] {
    padding-bottom: calc(24px * 7);
    padding-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pl-7-1],
:root [sm-l~=pl-7-1] {
    padding-left: calc(24px * 7);
    padding-left: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pr-7-1],
:root [sm-l~=pr-7-1] {
    padding-right: calc(24px * 7);
    padding-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=px-7-1],
:root [sm-l~=px-7-1] {
    padding-left: calc(24px * 7);
    padding-left: calc(var(--spacer-sm-l) * 7);
    padding-right: calc(24px * 7);
    padding-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=py-7-1],
:root [sm-l~=py-7-1] {
    padding-top: calc(24px * 7);
    padding-top: calc(var(--spacer-sm-l) * 7);
    padding-bottom: calc(24px * 7);
    padding-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=h-7-1],
:root [sm-l~=h-7-1] {
    height: calc(24px * 7);
    height: calc(var(--spacer-sm-l) * 7);
  }

  [class~=w-7-1],
:root [sm-l~=w-7-1] {
    width: calc(24px * 7);
    width: calc(var(--spacer-sm-l) * 7);
  }

  [class~=m-1-2],
:root [sm-l~=m-1-2] {
    margin: calc(24px / 2);
    margin: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mt-1-2],
:root [sm-l~=mt-1-2] {
    margin-top: calc(24px / 2);
    margin-top: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mb-1-2],
:root [sm-l~=mb-1-2] {
    margin-bottom: calc(24px / 2);
    margin-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=ml-1-2],
:root [sm-l~=ml-1-2] {
    margin-left: calc(24px / 2);
    margin-left: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mr-1-2],
:root [sm-l~=mr-1-2] {
    margin-right: calc(24px / 2);
    margin-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mx-1-2],
:root [sm-l~=mx-1-2] {
    margin-left: calc(24px / 2);
    margin-left: calc(var(--spacer-sm-l) / 2);
    margin-right: calc(24px / 2);
    margin-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=my-1-2],
:root [sm-l~=my-1-2] {
    margin-top: calc(24px / 2);
    margin-top: calc(var(--spacer-sm-l) / 2);
    margin-bottom: calc(24px / 2);
    margin-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=p-1-2],
:root [sm-l~=p-1-2] {
    padding: calc(24px / 2);
    padding: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pt-1-2],
:root [sm-l~=pt-1-2] {
    padding-top: calc(24px / 2);
    padding-top: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pb-1-2],
:root [sm-l~=pb-1-2] {
    padding-bottom: calc(24px / 2);
    padding-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pl-1-2],
:root [sm-l~=pl-1-2] {
    padding-left: calc(24px / 2);
    padding-left: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pr-1-2],
:root [sm-l~=pr-1-2] {
    padding-right: calc(24px / 2);
    padding-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=px-1-2],
:root [sm-l~=px-1-2] {
    padding-left: calc(24px / 2);
    padding-left: calc(var(--spacer-sm-l) / 2);
    padding-right: calc(24px / 2);
    padding-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=py-1-2],
:root [sm-l~=py-1-2] {
    padding-top: calc(24px / 2);
    padding-top: calc(var(--spacer-sm-l) / 2);
    padding-bottom: calc(24px / 2);
    padding-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=h-1-2],
:root [sm-l~=h-1-2] {
    height: calc(24px / 2);
    height: calc(var(--spacer-sm-l) / 2);
  }

  [class~=w-1-2],
:root [sm-l~=w-1-2] {
    width: calc(24px / 2);
    width: calc(var(--spacer-sm-l) / 2);
  }

  [class~=m-1-3],
:root [sm-l~=m-1-3] {
    margin: calc(24px / 3);
    margin: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mt-1-3],
:root [sm-l~=mt-1-3] {
    margin-top: calc(24px / 3);
    margin-top: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mb-1-3],
:root [sm-l~=mb-1-3] {
    margin-bottom: calc(24px / 3);
    margin-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=ml-1-3],
:root [sm-l~=ml-1-3] {
    margin-left: calc(24px / 3);
    margin-left: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mr-1-3],
:root [sm-l~=mr-1-3] {
    margin-right: calc(24px / 3);
    margin-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mx-1-3],
:root [sm-l~=mx-1-3] {
    margin-left: calc(24px / 3);
    margin-left: calc(var(--spacer-sm-l) / 3);
    margin-right: calc(24px / 3);
    margin-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=my-1-3],
:root [sm-l~=my-1-3] {
    margin-top: calc(24px / 3);
    margin-top: calc(var(--spacer-sm-l) / 3);
    margin-bottom: calc(24px / 3);
    margin-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=p-1-3],
:root [sm-l~=p-1-3] {
    padding: calc(24px / 3);
    padding: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pt-1-3],
:root [sm-l~=pt-1-3] {
    padding-top: calc(24px / 3);
    padding-top: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pb-1-3],
:root [sm-l~=pb-1-3] {
    padding-bottom: calc(24px / 3);
    padding-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pl-1-3],
:root [sm-l~=pl-1-3] {
    padding-left: calc(24px / 3);
    padding-left: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pr-1-3],
:root [sm-l~=pr-1-3] {
    padding-right: calc(24px / 3);
    padding-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=px-1-3],
:root [sm-l~=px-1-3] {
    padding-left: calc(24px / 3);
    padding-left: calc(var(--spacer-sm-l) / 3);
    padding-right: calc(24px / 3);
    padding-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=py-1-3],
:root [sm-l~=py-1-3] {
    padding-top: calc(24px / 3);
    padding-top: calc(var(--spacer-sm-l) / 3);
    padding-bottom: calc(24px / 3);
    padding-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=h-1-3],
:root [sm-l~=h-1-3] {
    height: calc(24px / 3);
    height: calc(var(--spacer-sm-l) / 3);
  }

  [class~=w-1-3],
:root [sm-l~=w-1-3] {
    width: calc(24px / 3);
    width: calc(var(--spacer-sm-l) / 3);
  }

  [class~=m-1-4],
:root [sm-l~=m-1-4] {
    margin: calc(24px / 4);
    margin: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mt-1-4],
:root [sm-l~=mt-1-4] {
    margin-top: calc(24px / 4);
    margin-top: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mb-1-4],
:root [sm-l~=mb-1-4] {
    margin-bottom: calc(24px / 4);
    margin-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=ml-1-4],
:root [sm-l~=ml-1-4] {
    margin-left: calc(24px / 4);
    margin-left: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mr-1-4],
:root [sm-l~=mr-1-4] {
    margin-right: calc(24px / 4);
    margin-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mx-1-4],
:root [sm-l~=mx-1-4] {
    margin-left: calc(24px / 4);
    margin-left: calc(var(--spacer-sm-l) / 4);
    margin-right: calc(24px / 4);
    margin-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=my-1-4],
:root [sm-l~=my-1-4] {
    margin-top: calc(24px / 4);
    margin-top: calc(var(--spacer-sm-l) / 4);
    margin-bottom: calc(24px / 4);
    margin-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=p-1-4],
:root [sm-l~=p-1-4] {
    padding: calc(24px / 4);
    padding: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pt-1-4],
:root [sm-l~=pt-1-4] {
    padding-top: calc(24px / 4);
    padding-top: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pb-1-4],
:root [sm-l~=pb-1-4] {
    padding-bottom: calc(24px / 4);
    padding-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pl-1-4],
:root [sm-l~=pl-1-4] {
    padding-left: calc(24px / 4);
    padding-left: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pr-1-4],
:root [sm-l~=pr-1-4] {
    padding-right: calc(24px / 4);
    padding-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=px-1-4],
:root [sm-l~=px-1-4] {
    padding-left: calc(24px / 4);
    padding-left: calc(var(--spacer-sm-l) / 4);
    padding-right: calc(24px / 4);
    padding-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=py-1-4],
:root [sm-l~=py-1-4] {
    padding-top: calc(24px / 4);
    padding-top: calc(var(--spacer-sm-l) / 4);
    padding-bottom: calc(24px / 4);
    padding-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=h-1-4],
:root [sm-l~=h-1-4] {
    height: calc(24px / 4);
    height: calc(var(--spacer-sm-l) / 4);
  }

  [class~=w-1-4],
:root [sm-l~=w-1-4] {
    width: calc(24px / 4);
    width: calc(var(--spacer-sm-l) / 4);
  }

  [class~=m-0],
:root [sm-l~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [sm-l~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [sm-l~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [sm-l~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [sm-l~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [sm-l~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [sm-l~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [sm-l~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [sm-l~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [sm-l~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [sm-l~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [sm-l~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [sm-l~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [sm-l~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [sm-l~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [sm-l~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [sm-l~=gutter] {
    margin-left: calc(24px * -1);
    margin-left: calc(var(--gutter-sm-l) * -1);
    margin-right: calc(24px * -1);
    margin-right: calc(var(--gutter-sm-l) * -1);
  }
  [class~=gutter] > *,
:root [sm-l~=gutter] > * {
    padding-left: calc(24px * 1);
    padding-left: calc(var(--gutter-sm-l) * 1);
    padding-right: calc(24px * 1);
    padding-right: calc(var(--gutter-sm-l) * 1);
  }

  [class~=gutter-1-2],
:root [sm-l~=gutter-1-2] {
    margin-left: calc(24px * -0.5);
    margin-left: calc(var(--gutter-sm-l) * -0.5);
    margin-right: calc(24px * -0.5);
    margin-right: calc(var(--gutter-sm-l) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [sm-l~=gutter-1-2] > * {
    padding-left: calc(24px * 0.5);
    padding-left: calc(var(--gutter-sm-l) * 0.5);
    padding-right: calc(24px * 0.5);
    padding-right: calc(var(--gutter-sm-l) * 0.5);
  }

  [class~=gutter-1-3],
:root [sm-l~=gutter-1-3] {
    margin-left: calc(24px * -0.333);
    margin-left: calc(var(--gutter-sm-l) * -0.333);
    margin-right: calc(24px * -0.333);
    margin-right: calc(var(--gutter-sm-l) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [sm-l~=gutter-1-3] > * {
    padding-left: calc(24px * 0.333);
    padding-left: calc(var(--gutter-sm-l) * 0.333);
    padding-right: calc(24px * 0.333);
    padding-right: calc(var(--gutter-sm-l) * 0.333);
  }

  [class~=gutter-1-4],
:root [sm-l~=gutter-1-4] {
    margin-left: calc(24px * -0.25);
    margin-left: calc(var(--gutter-sm-l) * -0.25);
    margin-right: calc(24px * -0.25);
    margin-right: calc(var(--gutter-sm-l) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [sm-l~=gutter-1-4] > * {
    padding-left: calc(24px * 0.25);
    padding-left: calc(var(--gutter-sm-l) * 0.25);
    padding-right: calc(24px * 0.25);
    padding-right: calc(var(--gutter-sm-l) * 0.25);
  }

  [class~=row-12],
:root [sm-l~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [sm-l~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [sm-l~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [sm-l~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [sm-l~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [sm-l~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [sm-l~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [sm-l~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [sm-l~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [sm-l~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [sm-l~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [sm-l~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [sm-l~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [sm-l~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [sm-l~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [sm-l~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [sm-l~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [sm-l~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [sm-l~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [sm-l~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [sm-l~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [sm-l~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [sm-l~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [sm-l~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [sm-l~=row],
:root [sm-l~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [sm-l~=row] > *,
:root [sm-l~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [sm-l~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [sm-l~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [sm-l~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [sm-l~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [sm-l~=row][sm-l~=v-center], :root [sm-l~=column][sm-l~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [sm-l~=row][sm-l~=v-start], :root [sm-l~=column][sm-l~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [sm-l~=row][sm-l~=v-end], :root [sm-l~=column][sm-l~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [sm-l~=row][sm-l~=v-stretch], :root [sm-l~=column][sm-l~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [sm-l~=row][sm-l~=h-center], :root [sm-l~=column][sm-l~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [sm-l~=row][sm-l~=h-start], :root [sm-l~=column][sm-l~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [sm-l~=row][sm-l~=h-end], :root [sm-l~=column][sm-l~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [sm-l~=row][sm-l~=h-spacein], :root [sm-l~=column][sm-l~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [sm-l~=row][sm-l~=h-spaceout], :root [sm-l~=column][sm-l~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [sm-l~=row] > [sm-l~=v-self-center], :root [sm-l~=column] > [sm-l~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [sm-l~=row] > [sm-l~=v-self-start], :root [sm-l~=column] > [sm-l~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [sm-l~=row] > [sm-l~=v-self-end], :root [sm-l~=column] > [sm-l~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [sm-l~=row] > [sm-l~=v-self-stretch], :root [sm-l~=column] > [sm-l~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [sm-l~=row] > [sm-l~=v-self-selfstart], :root [sm-l~=column] > [sm-l~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [sm-l~=row] > [sm-l~=v-self-selfend], :root [sm-l~=column] > [sm-l~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [sm-l~=row] > [sm-l~=h-self-center], :root [sm-l~=column] > [sm-l~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [sm-l~=row] > [sm-l~=h-self-start], :root [sm-l~=column] > [sm-l~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [sm-l~=row] > [sm-l~=h-self-end], :root [sm-l~=column] > [sm-l~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [sm-l~=row] > [sm-l~=h-self-stretch], :root [sm-l~=column] > [sm-l~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [sm-l~=row] > [sm-l~=h-self-selfstart], :root [sm-l~=column] > [sm-l~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [sm-l~=row] > [sm-l~=h-self-selfend], :root [sm-l~=column] > [sm-l~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [sm-l~=row] > [sm-l~=h-self-left], :root [sm-l~=column] > [sm-l~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [sm-l~=row] > [sm-l~=h-self-right], :root [sm-l~=column] > [sm-l~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-sm-l-1 {
    flex-grow: 1;
  }

  .flex-grow-sm-l-2 {
    flex-grow: 2;
  }

  .flex-grow-sm-l-3 {
    flex-grow: 3;
  }

  .flex-grow-sm-l-4 {
    flex-grow: 4;
  }

  .flex-grow-sm-l-5 {
    flex-grow: 5;
  }

  .flex-grow-sm-l-6 {
    flex-grow: 6;
  }

  .flex-grow-sm-l-7 {
    flex-grow: 7;
  }

  .flex-grow-sm-l-8 {
    flex-grow: 8;
  }

  .flex-grow-sm-l-9 {
    flex-grow: 9;
  }

  .flex-grow-sm-l-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [sm-l*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [sm-l*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [sm-l*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [sm-l*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [sm-l*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [sm-l*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [sm-l*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [sm-l*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [sm-l*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [sm-l*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [sm-l*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [sm-l*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [sm-l*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [sm-l*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [sm-l*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [sm-l*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [sm-l*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [sm-l*=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) {
  [class~=m-1-1],
:root [md~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-md) * 1);
  }

  [class~=mt-1-1],
:root [md~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-md) * 1);
  }

  [class~=mb-1-1],
:root [md~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=ml-1-1],
:root [md~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-md) * 1);
  }

  [class~=mr-1-1],
:root [md~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-md) * 1);
  }

  [class~=mx-1-1],
:root [md~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-md) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-md) * 1);
  }

  [class~=my-1-1],
:root [md~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-md) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=p-1-1],
:root [md~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-md) * 1);
  }

  [class~=pt-1-1],
:root [md~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-md) * 1);
  }

  [class~=pb-1-1],
:root [md~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=pl-1-1],
:root [md~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-md) * 1);
  }

  [class~=pr-1-1],
:root [md~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-md) * 1);
  }

  [class~=px-1-1],
:root [md~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-md) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-md) * 1);
  }

  [class~=py-1-1],
:root [md~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-md) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=h-1-1],
:root [md~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-md) * 1);
  }

  [class~=w-1-1],
:root [md~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-md) * 1);
  }

  [class~=m-2-1],
:root [md~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-md) * 2);
  }

  [class~=mt-2-1],
:root [md~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-md) * 2);
  }

  [class~=mb-2-1],
:root [md~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=ml-2-1],
:root [md~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-md) * 2);
  }

  [class~=mr-2-1],
:root [md~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-md) * 2);
  }

  [class~=mx-2-1],
:root [md~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-md) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-md) * 2);
  }

  [class~=my-2-1],
:root [md~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-md) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=p-2-1],
:root [md~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-md) * 2);
  }

  [class~=pt-2-1],
:root [md~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-md) * 2);
  }

  [class~=pb-2-1],
:root [md~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=pl-2-1],
:root [md~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-md) * 2);
  }

  [class~=pr-2-1],
:root [md~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-md) * 2);
  }

  [class~=px-2-1],
:root [md~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-md) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-md) * 2);
  }

  [class~=py-2-1],
:root [md~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-md) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=h-2-1],
:root [md~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
  }

  [class~=w-2-1],
:root [md~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
  }

  [class~=m-3-1],
:root [md~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-md) * 3);
  }

  [class~=mt-3-1],
:root [md~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-md) * 3);
  }

  [class~=mb-3-1],
:root [md~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=ml-3-1],
:root [md~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-md) * 3);
  }

  [class~=mr-3-1],
:root [md~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-md) * 3);
  }

  [class~=mx-3-1],
:root [md~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-md) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-md) * 3);
  }

  [class~=my-3-1],
:root [md~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-md) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=p-3-1],
:root [md~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-md) * 3);
  }

  [class~=pt-3-1],
:root [md~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-md) * 3);
  }

  [class~=pb-3-1],
:root [md~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=pl-3-1],
:root [md~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-md) * 3);
  }

  [class~=pr-3-1],
:root [md~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-md) * 3);
  }

  [class~=px-3-1],
:root [md~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-md) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-md) * 3);
  }

  [class~=py-3-1],
:root [md~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-md) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=h-3-1],
:root [md~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-md) * 3);
  }

  [class~=w-3-1],
:root [md~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-md) * 3);
  }

  [class~=m-4-1],
:root [md~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-md) * 4);
  }

  [class~=mt-4-1],
:root [md~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-md) * 4);
  }

  [class~=mb-4-1],
:root [md~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=ml-4-1],
:root [md~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-md) * 4);
  }

  [class~=mr-4-1],
:root [md~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-md) * 4);
  }

  [class~=mx-4-1],
:root [md~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-md) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-md) * 4);
  }

  [class~=my-4-1],
:root [md~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-md) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=p-4-1],
:root [md~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-md) * 4);
  }

  [class~=pt-4-1],
:root [md~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-md) * 4);
  }

  [class~=pb-4-1],
:root [md~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=pl-4-1],
:root [md~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-md) * 4);
  }

  [class~=pr-4-1],
:root [md~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-md) * 4);
  }

  [class~=px-4-1],
:root [md~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-md) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-md) * 4);
  }

  [class~=py-4-1],
:root [md~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-md) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=h-4-1],
:root [md~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-md) * 4);
  }

  [class~=w-4-1],
:root [md~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-md) * 4);
  }

  [class~=m-5-1],
:root [md~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-md) * 5);
  }

  [class~=mt-5-1],
:root [md~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-md) * 5);
  }

  [class~=mb-5-1],
:root [md~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=ml-5-1],
:root [md~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-md) * 5);
  }

  [class~=mr-5-1],
:root [md~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-md) * 5);
  }

  [class~=mx-5-1],
:root [md~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-md) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-md) * 5);
  }

  [class~=my-5-1],
:root [md~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-md) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=p-5-1],
:root [md~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-md) * 5);
  }

  [class~=pt-5-1],
:root [md~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
  }

  [class~=pb-5-1],
:root [md~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=pl-5-1],
:root [md~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-md) * 5);
  }

  [class~=pr-5-1],
:root [md~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-md) * 5);
  }

  [class~=px-5-1],
:root [md~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-md) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-md) * 5);
  }

  [class~=py-5-1],
:root [md~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=h-5-1],
:root [md~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-md) * 5);
  }

  [class~=w-5-1],
:root [md~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-md) * 5);
  }

  [class~=m-6-1],
:root [md~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-md) * 6);
  }

  [class~=mt-6-1],
:root [md~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-md) * 6);
  }

  [class~=mb-6-1],
:root [md~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=ml-6-1],
:root [md~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-md) * 6);
  }

  [class~=mr-6-1],
:root [md~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-md) * 6);
  }

  [class~=mx-6-1],
:root [md~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-md) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-md) * 6);
  }

  [class~=my-6-1],
:root [md~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-md) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=p-6-1],
:root [md~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-md) * 6);
  }

  [class~=pt-6-1],
:root [md~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-md) * 6);
  }

  [class~=pb-6-1],
:root [md~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=pl-6-1],
:root [md~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-md) * 6);
  }

  [class~=pr-6-1],
:root [md~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-md) * 6);
  }

  [class~=px-6-1],
:root [md~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-md) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-md) * 6);
  }

  [class~=py-6-1],
:root [md~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-md) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=h-6-1],
:root [md~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-md) * 6);
  }

  [class~=w-6-1],
:root [md~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-md) * 6);
  }

  [class~=m-7-1],
:root [md~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-md) * 7);
  }

  [class~=mt-7-1],
:root [md~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-md) * 7);
  }

  [class~=mb-7-1],
:root [md~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=ml-7-1],
:root [md~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-md) * 7);
  }

  [class~=mr-7-1],
:root [md~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-md) * 7);
  }

  [class~=mx-7-1],
:root [md~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-md) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-md) * 7);
  }

  [class~=my-7-1],
:root [md~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-md) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=p-7-1],
:root [md~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-md) * 7);
  }

  [class~=pt-7-1],
:root [md~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-md) * 7);
  }

  [class~=pb-7-1],
:root [md~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=pl-7-1],
:root [md~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-md) * 7);
  }

  [class~=pr-7-1],
:root [md~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-md) * 7);
  }

  [class~=px-7-1],
:root [md~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-md) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-md) * 7);
  }

  [class~=py-7-1],
:root [md~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-md) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=h-7-1],
:root [md~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-md) * 7);
  }

  [class~=w-7-1],
:root [md~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-md) * 7);
  }

  [class~=m-1-2],
:root [md~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-md) / 2);
  }

  [class~=mt-1-2],
:root [md~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-md) / 2);
  }

  [class~=mb-1-2],
:root [md~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=ml-1-2],
:root [md~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-md) / 2);
  }

  [class~=mr-1-2],
:root [md~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-md) / 2);
  }

  [class~=mx-1-2],
:root [md~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-md) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-md) / 2);
  }

  [class~=my-1-2],
:root [md~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-md) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=p-1-2],
:root [md~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-md) / 2);
  }

  [class~=pt-1-2],
:root [md~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-md) / 2);
  }

  [class~=pb-1-2],
:root [md~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=pl-1-2],
:root [md~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-md) / 2);
  }

  [class~=pr-1-2],
:root [md~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-md) / 2);
  }

  [class~=px-1-2],
:root [md~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-md) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-md) / 2);
  }

  [class~=py-1-2],
:root [md~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-md) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=h-1-2],
:root [md~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-md) / 2);
  }

  [class~=w-1-2],
:root [md~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-md) / 2);
  }

  [class~=m-1-3],
:root [md~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-md) / 3);
  }

  [class~=mt-1-3],
:root [md~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-md) / 3);
  }

  [class~=mb-1-3],
:root [md~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=ml-1-3],
:root [md~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-md) / 3);
  }

  [class~=mr-1-3],
:root [md~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-md) / 3);
  }

  [class~=mx-1-3],
:root [md~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-md) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-md) / 3);
  }

  [class~=my-1-3],
:root [md~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-md) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=p-1-3],
:root [md~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-md) / 3);
  }

  [class~=pt-1-3],
:root [md~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-md) / 3);
  }

  [class~=pb-1-3],
:root [md~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=pl-1-3],
:root [md~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-md) / 3);
  }

  [class~=pr-1-3],
:root [md~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-md) / 3);
  }

  [class~=px-1-3],
:root [md~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-md) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-md) / 3);
  }

  [class~=py-1-3],
:root [md~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-md) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=h-1-3],
:root [md~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-md) / 3);
  }

  [class~=w-1-3],
:root [md~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-md) / 3);
  }

  [class~=m-1-4],
:root [md~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-md) / 4);
  }

  [class~=mt-1-4],
:root [md~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-md) / 4);
  }

  [class~=mb-1-4],
:root [md~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=ml-1-4],
:root [md~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-md) / 4);
  }

  [class~=mr-1-4],
:root [md~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-md) / 4);
  }

  [class~=mx-1-4],
:root [md~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-md) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-md) / 4);
  }

  [class~=my-1-4],
:root [md~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-md) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=p-1-4],
:root [md~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-md) / 4);
  }

  [class~=pt-1-4],
:root [md~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-md) / 4);
  }

  [class~=pb-1-4],
:root [md~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=pl-1-4],
:root [md~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-md) / 4);
  }

  [class~=pr-1-4],
:root [md~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-md) / 4);
  }

  [class~=px-1-4],
:root [md~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-md) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-md) / 4);
  }

  [class~=py-1-4],
:root [md~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-md) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=h-1-4],
:root [md~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-md) / 4);
  }

  [class~=w-1-4],
:root [md~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-md) / 4);
  }

  [class~=m-0],
:root [md~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [md~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [md~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [md~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [md~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [md~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [md~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [md~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [md~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [md~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [md~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [md~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [md~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [md~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [md~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [md~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [md~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-md) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-md) * -1);
  }
  [class~=gutter] > *,
:root [md~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-md) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-md) * 1);
  }

  [class~=gutter-1-2],
:root [md~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-md) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-md) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [md~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-md) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-md) * 0.5);
  }

  [class~=gutter-1-3],
:root [md~=gutter-1-3] {
    margin-left: calc(28px * -0.333);
    margin-left: calc(var(--gutter-md) * -0.333);
    margin-right: calc(28px * -0.333);
    margin-right: calc(var(--gutter-md) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [md~=gutter-1-3] > * {
    padding-left: calc(28px * 0.333);
    padding-left: calc(var(--gutter-md) * 0.333);
    padding-right: calc(28px * 0.333);
    padding-right: calc(var(--gutter-md) * 0.333);
  }

  [class~=gutter-1-4],
:root [md~=gutter-1-4] {
    margin-left: calc(28px * -0.25);
    margin-left: calc(var(--gutter-md) * -0.25);
    margin-right: calc(28px * -0.25);
    margin-right: calc(var(--gutter-md) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [md~=gutter-1-4] > * {
    padding-left: calc(28px * 0.25);
    padding-left: calc(var(--gutter-md) * 0.25);
    padding-right: calc(28px * 0.25);
    padding-right: calc(var(--gutter-md) * 0.25);
  }

  [class~=row-12],
:root [md~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [md~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [md~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [md~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [md~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [md~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [md~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [md~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [md~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [md~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [md~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [md~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [md~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [md~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [md~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [md~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [md~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [md~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [md~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [md~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [md~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [md~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [md~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [md~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [md~=row],
:root [md~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [md~=row] > *,
:root [md~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [md~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [md~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [md~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [md~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [md~=row][md~=v-center], :root [md~=column][md~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [md~=row][md~=v-start], :root [md~=column][md~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [md~=row][md~=v-end], :root [md~=column][md~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [md~=row][md~=v-stretch], :root [md~=column][md~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [md~=row][md~=h-center], :root [md~=column][md~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [md~=row][md~=h-start], :root [md~=column][md~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [md~=row][md~=h-end], :root [md~=column][md~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [md~=row][md~=h-spacein], :root [md~=column][md~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [md~=row][md~=h-spaceout], :root [md~=column][md~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [md~=row] > [md~=v-self-center], :root [md~=column] > [md~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [md~=row] > [md~=v-self-start], :root [md~=column] > [md~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [md~=row] > [md~=v-self-end], :root [md~=column] > [md~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [md~=row] > [md~=v-self-stretch], :root [md~=column] > [md~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [md~=row] > [md~=v-self-selfstart], :root [md~=column] > [md~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [md~=row] > [md~=v-self-selfend], :root [md~=column] > [md~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [md~=row] > [md~=h-self-center], :root [md~=column] > [md~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [md~=row] > [md~=h-self-start], :root [md~=column] > [md~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [md~=row] > [md~=h-self-end], :root [md~=column] > [md~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [md~=row] > [md~=h-self-stretch], :root [md~=column] > [md~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [md~=row] > [md~=h-self-selfstart], :root [md~=column] > [md~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [md~=row] > [md~=h-self-selfend], :root [md~=column] > [md~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [md~=row] > [md~=h-self-left], :root [md~=column] > [md~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [md~=row] > [md~=h-self-right], :root [md~=column] > [md~=v-self-right] {
    justify-self: right;
  }

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

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

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

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

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

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

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

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

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

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

  [class*=d-flex],
:root [md*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [md*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [md*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [md*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [md*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [md*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [md*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [md*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [md*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [md*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [md*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [md*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [md*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [md*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [md*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [md*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [md*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [md*=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) {
  [class~=m-1-1],
:root [lg~=m-1-1] {
    margin: calc(32px * 1);
    margin: calc(var(--spacer-lg) * 1);
  }

  [class~=mt-1-1],
:root [lg~=mt-1-1] {
    margin-top: calc(32px * 1);
    margin-top: calc(var(--spacer-lg) * 1);
  }

  [class~=mb-1-1],
:root [lg~=mb-1-1] {
    margin-bottom: calc(32px * 1);
    margin-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=ml-1-1],
:root [lg~=ml-1-1] {
    margin-left: calc(32px * 1);
    margin-left: calc(var(--spacer-lg) * 1);
  }

  [class~=mr-1-1],
:root [lg~=mr-1-1] {
    margin-right: calc(32px * 1);
    margin-right: calc(var(--spacer-lg) * 1);
  }

  [class~=mx-1-1],
:root [lg~=mx-1-1] {
    margin-left: calc(32px * 1);
    margin-left: calc(var(--spacer-lg) * 1);
    margin-right: calc(32px * 1);
    margin-right: calc(var(--spacer-lg) * 1);
  }

  [class~=my-1-1],
:root [lg~=my-1-1] {
    margin-top: calc(32px * 1);
    margin-top: calc(var(--spacer-lg) * 1);
    margin-bottom: calc(32px * 1);
    margin-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=p-1-1],
:root [lg~=p-1-1] {
    padding: calc(32px * 1);
    padding: calc(var(--spacer-lg) * 1);
  }

  [class~=pt-1-1],
:root [lg~=pt-1-1] {
    padding-top: calc(32px * 1);
    padding-top: calc(var(--spacer-lg) * 1);
  }

  [class~=pb-1-1],
:root [lg~=pb-1-1] {
    padding-bottom: calc(32px * 1);
    padding-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=pl-1-1],
:root [lg~=pl-1-1] {
    padding-left: calc(32px * 1);
    padding-left: calc(var(--spacer-lg) * 1);
  }

  [class~=pr-1-1],
:root [lg~=pr-1-1] {
    padding-right: calc(32px * 1);
    padding-right: calc(var(--spacer-lg) * 1);
  }

  [class~=px-1-1],
:root [lg~=px-1-1] {
    padding-left: calc(32px * 1);
    padding-left: calc(var(--spacer-lg) * 1);
    padding-right: calc(32px * 1);
    padding-right: calc(var(--spacer-lg) * 1);
  }

  [class~=py-1-1],
:root [lg~=py-1-1] {
    padding-top: calc(32px * 1);
    padding-top: calc(var(--spacer-lg) * 1);
    padding-bottom: calc(32px * 1);
    padding-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=h-1-1],
:root [lg~=h-1-1] {
    height: calc(32px * 1);
    height: calc(var(--spacer-lg) * 1);
  }

  [class~=w-1-1],
:root [lg~=w-1-1] {
    width: calc(32px * 1);
    width: calc(var(--spacer-lg) * 1);
  }

  [class~=m-2-1],
:root [lg~=m-2-1] {
    margin: calc(32px * 2);
    margin: calc(var(--spacer-lg) * 2);
  }

  [class~=mt-2-1],
:root [lg~=mt-2-1] {
    margin-top: calc(32px * 2);
    margin-top: calc(var(--spacer-lg) * 2);
  }

  [class~=mb-2-1],
:root [lg~=mb-2-1] {
    margin-bottom: calc(32px * 2);
    margin-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=ml-2-1],
:root [lg~=ml-2-1] {
    margin-left: calc(32px * 2);
    margin-left: calc(var(--spacer-lg) * 2);
  }

  [class~=mr-2-1],
:root [lg~=mr-2-1] {
    margin-right: calc(32px * 2);
    margin-right: calc(var(--spacer-lg) * 2);
  }

  [class~=mx-2-1],
:root [lg~=mx-2-1] {
    margin-left: calc(32px * 2);
    margin-left: calc(var(--spacer-lg) * 2);
    margin-right: calc(32px * 2);
    margin-right: calc(var(--spacer-lg) * 2);
  }

  [class~=my-2-1],
:root [lg~=my-2-1] {
    margin-top: calc(32px * 2);
    margin-top: calc(var(--spacer-lg) * 2);
    margin-bottom: calc(32px * 2);
    margin-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=p-2-1],
:root [lg~=p-2-1] {
    padding: calc(32px * 2);
    padding: calc(var(--spacer-lg) * 2);
  }

  [class~=pt-2-1],
:root [lg~=pt-2-1] {
    padding-top: calc(32px * 2);
    padding-top: calc(var(--spacer-lg) * 2);
  }

  [class~=pb-2-1],
:root [lg~=pb-2-1] {
    padding-bottom: calc(32px * 2);
    padding-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=pl-2-1],
:root [lg~=pl-2-1] {
    padding-left: calc(32px * 2);
    padding-left: calc(var(--spacer-lg) * 2);
  }

  [class~=pr-2-1],
:root [lg~=pr-2-1] {
    padding-right: calc(32px * 2);
    padding-right: calc(var(--spacer-lg) * 2);
  }

  [class~=px-2-1],
:root [lg~=px-2-1] {
    padding-left: calc(32px * 2);
    padding-left: calc(var(--spacer-lg) * 2);
    padding-right: calc(32px * 2);
    padding-right: calc(var(--spacer-lg) * 2);
  }

  [class~=py-2-1],
:root [lg~=py-2-1] {
    padding-top: calc(32px * 2);
    padding-top: calc(var(--spacer-lg) * 2);
    padding-bottom: calc(32px * 2);
    padding-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=h-2-1],
:root [lg~=h-2-1] {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
  }

  [class~=w-2-1],
:root [lg~=w-2-1] {
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
  }

  [class~=m-3-1],
:root [lg~=m-3-1] {
    margin: calc(32px * 3);
    margin: calc(var(--spacer-lg) * 3);
  }

  [class~=mt-3-1],
:root [lg~=mt-3-1] {
    margin-top: calc(32px * 3);
    margin-top: calc(var(--spacer-lg) * 3);
  }

  [class~=mb-3-1],
:root [lg~=mb-3-1] {
    margin-bottom: calc(32px * 3);
    margin-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=ml-3-1],
:root [lg~=ml-3-1] {
    margin-left: calc(32px * 3);
    margin-left: calc(var(--spacer-lg) * 3);
  }

  [class~=mr-3-1],
:root [lg~=mr-3-1] {
    margin-right: calc(32px * 3);
    margin-right: calc(var(--spacer-lg) * 3);
  }

  [class~=mx-3-1],
:root [lg~=mx-3-1] {
    margin-left: calc(32px * 3);
    margin-left: calc(var(--spacer-lg) * 3);
    margin-right: calc(32px * 3);
    margin-right: calc(var(--spacer-lg) * 3);
  }

  [class~=my-3-1],
:root [lg~=my-3-1] {
    margin-top: calc(32px * 3);
    margin-top: calc(var(--spacer-lg) * 3);
    margin-bottom: calc(32px * 3);
    margin-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=p-3-1],
:root [lg~=p-3-1] {
    padding: calc(32px * 3);
    padding: calc(var(--spacer-lg) * 3);
  }

  [class~=pt-3-1],
:root [lg~=pt-3-1] {
    padding-top: calc(32px * 3);
    padding-top: calc(var(--spacer-lg) * 3);
  }

  [class~=pb-3-1],
:root [lg~=pb-3-1] {
    padding-bottom: calc(32px * 3);
    padding-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=pl-3-1],
:root [lg~=pl-3-1] {
    padding-left: calc(32px * 3);
    padding-left: calc(var(--spacer-lg) * 3);
  }

  [class~=pr-3-1],
:root [lg~=pr-3-1] {
    padding-right: calc(32px * 3);
    padding-right: calc(var(--spacer-lg) * 3);
  }

  [class~=px-3-1],
:root [lg~=px-3-1] {
    padding-left: calc(32px * 3);
    padding-left: calc(var(--spacer-lg) * 3);
    padding-right: calc(32px * 3);
    padding-right: calc(var(--spacer-lg) * 3);
  }

  [class~=py-3-1],
:root [lg~=py-3-1] {
    padding-top: calc(32px * 3);
    padding-top: calc(var(--spacer-lg) * 3);
    padding-bottom: calc(32px * 3);
    padding-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=h-3-1],
:root [lg~=h-3-1] {
    height: calc(32px * 3);
    height: calc(var(--spacer-lg) * 3);
  }

  [class~=w-3-1],
:root [lg~=w-3-1] {
    width: calc(32px * 3);
    width: calc(var(--spacer-lg) * 3);
  }

  [class~=m-4-1],
:root [lg~=m-4-1] {
    margin: calc(32px * 4);
    margin: calc(var(--spacer-lg) * 4);
  }

  [class~=mt-4-1],
:root [lg~=mt-4-1] {
    margin-top: calc(32px * 4);
    margin-top: calc(var(--spacer-lg) * 4);
  }

  [class~=mb-4-1],
:root [lg~=mb-4-1] {
    margin-bottom: calc(32px * 4);
    margin-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=ml-4-1],
:root [lg~=ml-4-1] {
    margin-left: calc(32px * 4);
    margin-left: calc(var(--spacer-lg) * 4);
  }

  [class~=mr-4-1],
:root [lg~=mr-4-1] {
    margin-right: calc(32px * 4);
    margin-right: calc(var(--spacer-lg) * 4);
  }

  [class~=mx-4-1],
:root [lg~=mx-4-1] {
    margin-left: calc(32px * 4);
    margin-left: calc(var(--spacer-lg) * 4);
    margin-right: calc(32px * 4);
    margin-right: calc(var(--spacer-lg) * 4);
  }

  [class~=my-4-1],
:root [lg~=my-4-1] {
    margin-top: calc(32px * 4);
    margin-top: calc(var(--spacer-lg) * 4);
    margin-bottom: calc(32px * 4);
    margin-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=p-4-1],
:root [lg~=p-4-1] {
    padding: calc(32px * 4);
    padding: calc(var(--spacer-lg) * 4);
  }

  [class~=pt-4-1],
:root [lg~=pt-4-1] {
    padding-top: calc(32px * 4);
    padding-top: calc(var(--spacer-lg) * 4);
  }

  [class~=pb-4-1],
:root [lg~=pb-4-1] {
    padding-bottom: calc(32px * 4);
    padding-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=pl-4-1],
:root [lg~=pl-4-1] {
    padding-left: calc(32px * 4);
    padding-left: calc(var(--spacer-lg) * 4);
  }

  [class~=pr-4-1],
:root [lg~=pr-4-1] {
    padding-right: calc(32px * 4);
    padding-right: calc(var(--spacer-lg) * 4);
  }

  [class~=px-4-1],
:root [lg~=px-4-1] {
    padding-left: calc(32px * 4);
    padding-left: calc(var(--spacer-lg) * 4);
    padding-right: calc(32px * 4);
    padding-right: calc(var(--spacer-lg) * 4);
  }

  [class~=py-4-1],
:root [lg~=py-4-1] {
    padding-top: calc(32px * 4);
    padding-top: calc(var(--spacer-lg) * 4);
    padding-bottom: calc(32px * 4);
    padding-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=h-4-1],
:root [lg~=h-4-1] {
    height: calc(32px * 4);
    height: calc(var(--spacer-lg) * 4);
  }

  [class~=w-4-1],
:root [lg~=w-4-1] {
    width: calc(32px * 4);
    width: calc(var(--spacer-lg) * 4);
  }

  [class~=m-5-1],
:root [lg~=m-5-1] {
    margin: calc(32px * 5);
    margin: calc(var(--spacer-lg) * 5);
  }

  [class~=mt-5-1],
:root [lg~=mt-5-1] {
    margin-top: calc(32px * 5);
    margin-top: calc(var(--spacer-lg) * 5);
  }

  [class~=mb-5-1],
:root [lg~=mb-5-1] {
    margin-bottom: calc(32px * 5);
    margin-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=ml-5-1],
:root [lg~=ml-5-1] {
    margin-left: calc(32px * 5);
    margin-left: calc(var(--spacer-lg) * 5);
  }

  [class~=mr-5-1],
:root [lg~=mr-5-1] {
    margin-right: calc(32px * 5);
    margin-right: calc(var(--spacer-lg) * 5);
  }

  [class~=mx-5-1],
:root [lg~=mx-5-1] {
    margin-left: calc(32px * 5);
    margin-left: calc(var(--spacer-lg) * 5);
    margin-right: calc(32px * 5);
    margin-right: calc(var(--spacer-lg) * 5);
  }

  [class~=my-5-1],
:root [lg~=my-5-1] {
    margin-top: calc(32px * 5);
    margin-top: calc(var(--spacer-lg) * 5);
    margin-bottom: calc(32px * 5);
    margin-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=p-5-1],
:root [lg~=p-5-1] {
    padding: calc(32px * 5);
    padding: calc(var(--spacer-lg) * 5);
  }

  [class~=pt-5-1],
:root [lg~=pt-5-1] {
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
  }

  [class~=pb-5-1],
:root [lg~=pb-5-1] {
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=pl-5-1],
:root [lg~=pl-5-1] {
    padding-left: calc(32px * 5);
    padding-left: calc(var(--spacer-lg) * 5);
  }

  [class~=pr-5-1],
:root [lg~=pr-5-1] {
    padding-right: calc(32px * 5);
    padding-right: calc(var(--spacer-lg) * 5);
  }

  [class~=px-5-1],
:root [lg~=px-5-1] {
    padding-left: calc(32px * 5);
    padding-left: calc(var(--spacer-lg) * 5);
    padding-right: calc(32px * 5);
    padding-right: calc(var(--spacer-lg) * 5);
  }

  [class~=py-5-1],
:root [lg~=py-5-1] {
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=h-5-1],
:root [lg~=h-5-1] {
    height: calc(32px * 5);
    height: calc(var(--spacer-lg) * 5);
  }

  [class~=w-5-1],
:root [lg~=w-5-1] {
    width: calc(32px * 5);
    width: calc(var(--spacer-lg) * 5);
  }

  [class~=m-6-1],
:root [lg~=m-6-1] {
    margin: calc(32px * 6);
    margin: calc(var(--spacer-lg) * 6);
  }

  [class~=mt-6-1],
:root [lg~=mt-6-1] {
    margin-top: calc(32px * 6);
    margin-top: calc(var(--spacer-lg) * 6);
  }

  [class~=mb-6-1],
:root [lg~=mb-6-1] {
    margin-bottom: calc(32px * 6);
    margin-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=ml-6-1],
:root [lg~=ml-6-1] {
    margin-left: calc(32px * 6);
    margin-left: calc(var(--spacer-lg) * 6);
  }

  [class~=mr-6-1],
:root [lg~=mr-6-1] {
    margin-right: calc(32px * 6);
    margin-right: calc(var(--spacer-lg) * 6);
  }

  [class~=mx-6-1],
:root [lg~=mx-6-1] {
    margin-left: calc(32px * 6);
    margin-left: calc(var(--spacer-lg) * 6);
    margin-right: calc(32px * 6);
    margin-right: calc(var(--spacer-lg) * 6);
  }

  [class~=my-6-1],
:root [lg~=my-6-1] {
    margin-top: calc(32px * 6);
    margin-top: calc(var(--spacer-lg) * 6);
    margin-bottom: calc(32px * 6);
    margin-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=p-6-1],
:root [lg~=p-6-1] {
    padding: calc(32px * 6);
    padding: calc(var(--spacer-lg) * 6);
  }

  [class~=pt-6-1],
:root [lg~=pt-6-1] {
    padding-top: calc(32px * 6);
    padding-top: calc(var(--spacer-lg) * 6);
  }

  [class~=pb-6-1],
:root [lg~=pb-6-1] {
    padding-bottom: calc(32px * 6);
    padding-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=pl-6-1],
:root [lg~=pl-6-1] {
    padding-left: calc(32px * 6);
    padding-left: calc(var(--spacer-lg) * 6);
  }

  [class~=pr-6-1],
:root [lg~=pr-6-1] {
    padding-right: calc(32px * 6);
    padding-right: calc(var(--spacer-lg) * 6);
  }

  [class~=px-6-1],
:root [lg~=px-6-1] {
    padding-left: calc(32px * 6);
    padding-left: calc(var(--spacer-lg) * 6);
    padding-right: calc(32px * 6);
    padding-right: calc(var(--spacer-lg) * 6);
  }

  [class~=py-6-1],
:root [lg~=py-6-1] {
    padding-top: calc(32px * 6);
    padding-top: calc(var(--spacer-lg) * 6);
    padding-bottom: calc(32px * 6);
    padding-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=h-6-1],
:root [lg~=h-6-1] {
    height: calc(32px * 6);
    height: calc(var(--spacer-lg) * 6);
  }

  [class~=w-6-1],
:root [lg~=w-6-1] {
    width: calc(32px * 6);
    width: calc(var(--spacer-lg) * 6);
  }

  [class~=m-7-1],
:root [lg~=m-7-1] {
    margin: calc(32px * 7);
    margin: calc(var(--spacer-lg) * 7);
  }

  [class~=mt-7-1],
:root [lg~=mt-7-1] {
    margin-top: calc(32px * 7);
    margin-top: calc(var(--spacer-lg) * 7);
  }

  [class~=mb-7-1],
:root [lg~=mb-7-1] {
    margin-bottom: calc(32px * 7);
    margin-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=ml-7-1],
:root [lg~=ml-7-1] {
    margin-left: calc(32px * 7);
    margin-left: calc(var(--spacer-lg) * 7);
  }

  [class~=mr-7-1],
:root [lg~=mr-7-1] {
    margin-right: calc(32px * 7);
    margin-right: calc(var(--spacer-lg) * 7);
  }

  [class~=mx-7-1],
:root [lg~=mx-7-1] {
    margin-left: calc(32px * 7);
    margin-left: calc(var(--spacer-lg) * 7);
    margin-right: calc(32px * 7);
    margin-right: calc(var(--spacer-lg) * 7);
  }

  [class~=my-7-1],
:root [lg~=my-7-1] {
    margin-top: calc(32px * 7);
    margin-top: calc(var(--spacer-lg) * 7);
    margin-bottom: calc(32px * 7);
    margin-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=p-7-1],
:root [lg~=p-7-1] {
    padding: calc(32px * 7);
    padding: calc(var(--spacer-lg) * 7);
  }

  [class~=pt-7-1],
:root [lg~=pt-7-1] {
    padding-top: calc(32px * 7);
    padding-top: calc(var(--spacer-lg) * 7);
  }

  [class~=pb-7-1],
:root [lg~=pb-7-1] {
    padding-bottom: calc(32px * 7);
    padding-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=pl-7-1],
:root [lg~=pl-7-1] {
    padding-left: calc(32px * 7);
    padding-left: calc(var(--spacer-lg) * 7);
  }

  [class~=pr-7-1],
:root [lg~=pr-7-1] {
    padding-right: calc(32px * 7);
    padding-right: calc(var(--spacer-lg) * 7);
  }

  [class~=px-7-1],
:root [lg~=px-7-1] {
    padding-left: calc(32px * 7);
    padding-left: calc(var(--spacer-lg) * 7);
    padding-right: calc(32px * 7);
    padding-right: calc(var(--spacer-lg) * 7);
  }

  [class~=py-7-1],
:root [lg~=py-7-1] {
    padding-top: calc(32px * 7);
    padding-top: calc(var(--spacer-lg) * 7);
    padding-bottom: calc(32px * 7);
    padding-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=h-7-1],
:root [lg~=h-7-1] {
    height: calc(32px * 7);
    height: calc(var(--spacer-lg) * 7);
  }

  [class~=w-7-1],
:root [lg~=w-7-1] {
    width: calc(32px * 7);
    width: calc(var(--spacer-lg) * 7);
  }

  [class~=m-1-2],
:root [lg~=m-1-2] {
    margin: calc(32px / 2);
    margin: calc(var(--spacer-lg) / 2);
  }

  [class~=mt-1-2],
:root [lg~=mt-1-2] {
    margin-top: calc(32px / 2);
    margin-top: calc(var(--spacer-lg) / 2);
  }

  [class~=mb-1-2],
:root [lg~=mb-1-2] {
    margin-bottom: calc(32px / 2);
    margin-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=ml-1-2],
:root [lg~=ml-1-2] {
    margin-left: calc(32px / 2);
    margin-left: calc(var(--spacer-lg) / 2);
  }

  [class~=mr-1-2],
:root [lg~=mr-1-2] {
    margin-right: calc(32px / 2);
    margin-right: calc(var(--spacer-lg) / 2);
  }

  [class~=mx-1-2],
:root [lg~=mx-1-2] {
    margin-left: calc(32px / 2);
    margin-left: calc(var(--spacer-lg) / 2);
    margin-right: calc(32px / 2);
    margin-right: calc(var(--spacer-lg) / 2);
  }

  [class~=my-1-2],
:root [lg~=my-1-2] {
    margin-top: calc(32px / 2);
    margin-top: calc(var(--spacer-lg) / 2);
    margin-bottom: calc(32px / 2);
    margin-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=p-1-2],
:root [lg~=p-1-2] {
    padding: calc(32px / 2);
    padding: calc(var(--spacer-lg) / 2);
  }

  [class~=pt-1-2],
:root [lg~=pt-1-2] {
    padding-top: calc(32px / 2);
    padding-top: calc(var(--spacer-lg) / 2);
  }

  [class~=pb-1-2],
:root [lg~=pb-1-2] {
    padding-bottom: calc(32px / 2);
    padding-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=pl-1-2],
:root [lg~=pl-1-2] {
    padding-left: calc(32px / 2);
    padding-left: calc(var(--spacer-lg) / 2);
  }

  [class~=pr-1-2],
:root [lg~=pr-1-2] {
    padding-right: calc(32px / 2);
    padding-right: calc(var(--spacer-lg) / 2);
  }

  [class~=px-1-2],
:root [lg~=px-1-2] {
    padding-left: calc(32px / 2);
    padding-left: calc(var(--spacer-lg) / 2);
    padding-right: calc(32px / 2);
    padding-right: calc(var(--spacer-lg) / 2);
  }

  [class~=py-1-2],
:root [lg~=py-1-2] {
    padding-top: calc(32px / 2);
    padding-top: calc(var(--spacer-lg) / 2);
    padding-bottom: calc(32px / 2);
    padding-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=h-1-2],
:root [lg~=h-1-2] {
    height: calc(32px / 2);
    height: calc(var(--spacer-lg) / 2);
  }

  [class~=w-1-2],
:root [lg~=w-1-2] {
    width: calc(32px / 2);
    width: calc(var(--spacer-lg) / 2);
  }

  [class~=m-1-3],
:root [lg~=m-1-3] {
    margin: calc(32px / 3);
    margin: calc(var(--spacer-lg) / 3);
  }

  [class~=mt-1-3],
:root [lg~=mt-1-3] {
    margin-top: calc(32px / 3);
    margin-top: calc(var(--spacer-lg) / 3);
  }

  [class~=mb-1-3],
:root [lg~=mb-1-3] {
    margin-bottom: calc(32px / 3);
    margin-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=ml-1-3],
:root [lg~=ml-1-3] {
    margin-left: calc(32px / 3);
    margin-left: calc(var(--spacer-lg) / 3);
  }

  [class~=mr-1-3],
:root [lg~=mr-1-3] {
    margin-right: calc(32px / 3);
    margin-right: calc(var(--spacer-lg) / 3);
  }

  [class~=mx-1-3],
:root [lg~=mx-1-3] {
    margin-left: calc(32px / 3);
    margin-left: calc(var(--spacer-lg) / 3);
    margin-right: calc(32px / 3);
    margin-right: calc(var(--spacer-lg) / 3);
  }

  [class~=my-1-3],
:root [lg~=my-1-3] {
    margin-top: calc(32px / 3);
    margin-top: calc(var(--spacer-lg) / 3);
    margin-bottom: calc(32px / 3);
    margin-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=p-1-3],
:root [lg~=p-1-3] {
    padding: calc(32px / 3);
    padding: calc(var(--spacer-lg) / 3);
  }

  [class~=pt-1-3],
:root [lg~=pt-1-3] {
    padding-top: calc(32px / 3);
    padding-top: calc(var(--spacer-lg) / 3);
  }

  [class~=pb-1-3],
:root [lg~=pb-1-3] {
    padding-bottom: calc(32px / 3);
    padding-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=pl-1-3],
:root [lg~=pl-1-3] {
    padding-left: calc(32px / 3);
    padding-left: calc(var(--spacer-lg) / 3);
  }

  [class~=pr-1-3],
:root [lg~=pr-1-3] {
    padding-right: calc(32px / 3);
    padding-right: calc(var(--spacer-lg) / 3);
  }

  [class~=px-1-3],
:root [lg~=px-1-3] {
    padding-left: calc(32px / 3);
    padding-left: calc(var(--spacer-lg) / 3);
    padding-right: calc(32px / 3);
    padding-right: calc(var(--spacer-lg) / 3);
  }

  [class~=py-1-3],
:root [lg~=py-1-3] {
    padding-top: calc(32px / 3);
    padding-top: calc(var(--spacer-lg) / 3);
    padding-bottom: calc(32px / 3);
    padding-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=h-1-3],
:root [lg~=h-1-3] {
    height: calc(32px / 3);
    height: calc(var(--spacer-lg) / 3);
  }

  [class~=w-1-3],
:root [lg~=w-1-3] {
    width: calc(32px / 3);
    width: calc(var(--spacer-lg) / 3);
  }

  [class~=m-1-4],
:root [lg~=m-1-4] {
    margin: calc(32px / 4);
    margin: calc(var(--spacer-lg) / 4);
  }

  [class~=mt-1-4],
:root [lg~=mt-1-4] {
    margin-top: calc(32px / 4);
    margin-top: calc(var(--spacer-lg) / 4);
  }

  [class~=mb-1-4],
:root [lg~=mb-1-4] {
    margin-bottom: calc(32px / 4);
    margin-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=ml-1-4],
:root [lg~=ml-1-4] {
    margin-left: calc(32px / 4);
    margin-left: calc(var(--spacer-lg) / 4);
  }

  [class~=mr-1-4],
:root [lg~=mr-1-4] {
    margin-right: calc(32px / 4);
    margin-right: calc(var(--spacer-lg) / 4);
  }

  [class~=mx-1-4],
:root [lg~=mx-1-4] {
    margin-left: calc(32px / 4);
    margin-left: calc(var(--spacer-lg) / 4);
    margin-right: calc(32px / 4);
    margin-right: calc(var(--spacer-lg) / 4);
  }

  [class~=my-1-4],
:root [lg~=my-1-4] {
    margin-top: calc(32px / 4);
    margin-top: calc(var(--spacer-lg) / 4);
    margin-bottom: calc(32px / 4);
    margin-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=p-1-4],
:root [lg~=p-1-4] {
    padding: calc(32px / 4);
    padding: calc(var(--spacer-lg) / 4);
  }

  [class~=pt-1-4],
:root [lg~=pt-1-4] {
    padding-top: calc(32px / 4);
    padding-top: calc(var(--spacer-lg) / 4);
  }

  [class~=pb-1-4],
:root [lg~=pb-1-4] {
    padding-bottom: calc(32px / 4);
    padding-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=pl-1-4],
:root [lg~=pl-1-4] {
    padding-left: calc(32px / 4);
    padding-left: calc(var(--spacer-lg) / 4);
  }

  [class~=pr-1-4],
:root [lg~=pr-1-4] {
    padding-right: calc(32px / 4);
    padding-right: calc(var(--spacer-lg) / 4);
  }

  [class~=px-1-4],
:root [lg~=px-1-4] {
    padding-left: calc(32px / 4);
    padding-left: calc(var(--spacer-lg) / 4);
    padding-right: calc(32px / 4);
    padding-right: calc(var(--spacer-lg) / 4);
  }

  [class~=py-1-4],
:root [lg~=py-1-4] {
    padding-top: calc(32px / 4);
    padding-top: calc(var(--spacer-lg) / 4);
    padding-bottom: calc(32px / 4);
    padding-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=h-1-4],
:root [lg~=h-1-4] {
    height: calc(32px / 4);
    height: calc(var(--spacer-lg) / 4);
  }

  [class~=w-1-4],
:root [lg~=w-1-4] {
    width: calc(32px / 4);
    width: calc(var(--spacer-lg) / 4);
  }

  [class~=m-0],
:root [lg~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [lg~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [lg~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [lg~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [lg~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [lg~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [lg~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [lg~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [lg~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [lg~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [lg~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [lg~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [lg~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [lg~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [lg~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [lg~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [lg~=gutter] {
    margin-left: calc(32px * -1);
    margin-left: calc(var(--gutter-lg) * -1);
    margin-right: calc(32px * -1);
    margin-right: calc(var(--gutter-lg) * -1);
  }
  [class~=gutter] > *,
:root [lg~=gutter] > * {
    padding-left: calc(32px * 1);
    padding-left: calc(var(--gutter-lg) * 1);
    padding-right: calc(32px * 1);
    padding-right: calc(var(--gutter-lg) * 1);
  }

  [class~=gutter-1-2],
:root [lg~=gutter-1-2] {
    margin-left: calc(32px * -0.5);
    margin-left: calc(var(--gutter-lg) * -0.5);
    margin-right: calc(32px * -0.5);
    margin-right: calc(var(--gutter-lg) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [lg~=gutter-1-2] > * {
    padding-left: calc(32px * 0.5);
    padding-left: calc(var(--gutter-lg) * 0.5);
    padding-right: calc(32px * 0.5);
    padding-right: calc(var(--gutter-lg) * 0.5);
  }

  [class~=gutter-1-3],
:root [lg~=gutter-1-3] {
    margin-left: calc(32px * -0.333);
    margin-left: calc(var(--gutter-lg) * -0.333);
    margin-right: calc(32px * -0.333);
    margin-right: calc(var(--gutter-lg) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [lg~=gutter-1-3] > * {
    padding-left: calc(32px * 0.333);
    padding-left: calc(var(--gutter-lg) * 0.333);
    padding-right: calc(32px * 0.333);
    padding-right: calc(var(--gutter-lg) * 0.333);
  }

  [class~=gutter-1-4],
:root [lg~=gutter-1-4] {
    margin-left: calc(32px * -0.25);
    margin-left: calc(var(--gutter-lg) * -0.25);
    margin-right: calc(32px * -0.25);
    margin-right: calc(var(--gutter-lg) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [lg~=gutter-1-4] > * {
    padding-left: calc(32px * 0.25);
    padding-left: calc(var(--gutter-lg) * 0.25);
    padding-right: calc(32px * 0.25);
    padding-right: calc(var(--gutter-lg) * 0.25);
  }

  [class~=row-12],
:root [lg~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [lg~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [lg~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [lg~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [lg~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [lg~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [lg~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [lg~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [lg~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [lg~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [lg~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [lg~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [lg~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [lg~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [lg~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [lg~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [lg~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [lg~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [lg~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [lg~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [lg~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [lg~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [lg~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [lg~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [lg~=row],
:root [lg~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [lg~=row] > *,
:root [lg~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [lg~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [lg~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [lg~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [lg~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [lg~=row][lg~=v-center], :root [lg~=column][lg~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [lg~=row][lg~=v-start], :root [lg~=column][lg~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [lg~=row][lg~=v-end], :root [lg~=column][lg~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [lg~=row][lg~=v-stretch], :root [lg~=column][lg~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [lg~=row][lg~=h-center], :root [lg~=column][lg~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [lg~=row][lg~=h-start], :root [lg~=column][lg~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [lg~=row][lg~=h-end], :root [lg~=column][lg~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [lg~=row][lg~=h-spacein], :root [lg~=column][lg~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [lg~=row][lg~=h-spaceout], :root [lg~=column][lg~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [lg~=row] > [lg~=v-self-center], :root [lg~=column] > [lg~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [lg~=row] > [lg~=v-self-start], :root [lg~=column] > [lg~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [lg~=row] > [lg~=v-self-end], :root [lg~=column] > [lg~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [lg~=row] > [lg~=v-self-stretch], :root [lg~=column] > [lg~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [lg~=row] > [lg~=v-self-selfstart], :root [lg~=column] > [lg~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [lg~=row] > [lg~=v-self-selfend], :root [lg~=column] > [lg~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [lg~=row] > [lg~=h-self-center], :root [lg~=column] > [lg~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [lg~=row] > [lg~=h-self-start], :root [lg~=column] > [lg~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [lg~=row] > [lg~=h-self-end], :root [lg~=column] > [lg~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [lg~=row] > [lg~=h-self-stretch], :root [lg~=column] > [lg~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [lg~=row] > [lg~=h-self-selfstart], :root [lg~=column] > [lg~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [lg~=row] > [lg~=h-self-selfend], :root [lg~=column] > [lg~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [lg~=row] > [lg~=h-self-left], :root [lg~=column] > [lg~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [lg~=row] > [lg~=h-self-right], :root [lg~=column] > [lg~=v-self-right] {
    justify-self: right;
  }

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

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

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

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

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

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

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

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

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

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

  [class*=d-flex],
:root [lg*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [lg*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [lg*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [lg*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [lg*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [lg*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [lg*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [lg*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [lg*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [lg*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [lg*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [lg*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [lg*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [lg*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [lg*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [lg*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [lg*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [lg*=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) {
  [class~=m-1-1],
:root [xl~=m-1-1] {
    margin: calc(36px * 1);
    margin: calc(var(--spacer-xl) * 1);
  }

  [class~=mt-1-1],
:root [xl~=mt-1-1] {
    margin-top: calc(36px * 1);
    margin-top: calc(var(--spacer-xl) * 1);
  }

  [class~=mb-1-1],
:root [xl~=mb-1-1] {
    margin-bottom: calc(36px * 1);
    margin-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=ml-1-1],
:root [xl~=ml-1-1] {
    margin-left: calc(36px * 1);
    margin-left: calc(var(--spacer-xl) * 1);
  }

  [class~=mr-1-1],
:root [xl~=mr-1-1] {
    margin-right: calc(36px * 1);
    margin-right: calc(var(--spacer-xl) * 1);
  }

  [class~=mx-1-1],
:root [xl~=mx-1-1] {
    margin-left: calc(36px * 1);
    margin-left: calc(var(--spacer-xl) * 1);
    margin-right: calc(36px * 1);
    margin-right: calc(var(--spacer-xl) * 1);
  }

  [class~=my-1-1],
:root [xl~=my-1-1] {
    margin-top: calc(36px * 1);
    margin-top: calc(var(--spacer-xl) * 1);
    margin-bottom: calc(36px * 1);
    margin-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=p-1-1],
:root [xl~=p-1-1] {
    padding: calc(36px * 1);
    padding: calc(var(--spacer-xl) * 1);
  }

  [class~=pt-1-1],
:root [xl~=pt-1-1] {
    padding-top: calc(36px * 1);
    padding-top: calc(var(--spacer-xl) * 1);
  }

  [class~=pb-1-1],
:root [xl~=pb-1-1] {
    padding-bottom: calc(36px * 1);
    padding-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=pl-1-1],
:root [xl~=pl-1-1] {
    padding-left: calc(36px * 1);
    padding-left: calc(var(--spacer-xl) * 1);
  }

  [class~=pr-1-1],
:root [xl~=pr-1-1] {
    padding-right: calc(36px * 1);
    padding-right: calc(var(--spacer-xl) * 1);
  }

  [class~=px-1-1],
:root [xl~=px-1-1] {
    padding-left: calc(36px * 1);
    padding-left: calc(var(--spacer-xl) * 1);
    padding-right: calc(36px * 1);
    padding-right: calc(var(--spacer-xl) * 1);
  }

  [class~=py-1-1],
:root [xl~=py-1-1] {
    padding-top: calc(36px * 1);
    padding-top: calc(var(--spacer-xl) * 1);
    padding-bottom: calc(36px * 1);
    padding-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=h-1-1],
:root [xl~=h-1-1] {
    height: calc(36px * 1);
    height: calc(var(--spacer-xl) * 1);
  }

  [class~=w-1-1],
:root [xl~=w-1-1] {
    width: calc(36px * 1);
    width: calc(var(--spacer-xl) * 1);
  }

  [class~=m-2-1],
:root [xl~=m-2-1] {
    margin: calc(36px * 2);
    margin: calc(var(--spacer-xl) * 2);
  }

  [class~=mt-2-1],
:root [xl~=mt-2-1] {
    margin-top: calc(36px * 2);
    margin-top: calc(var(--spacer-xl) * 2);
  }

  [class~=mb-2-1],
:root [xl~=mb-2-1] {
    margin-bottom: calc(36px * 2);
    margin-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=ml-2-1],
:root [xl~=ml-2-1] {
    margin-left: calc(36px * 2);
    margin-left: calc(var(--spacer-xl) * 2);
  }

  [class~=mr-2-1],
:root [xl~=mr-2-1] {
    margin-right: calc(36px * 2);
    margin-right: calc(var(--spacer-xl) * 2);
  }

  [class~=mx-2-1],
:root [xl~=mx-2-1] {
    margin-left: calc(36px * 2);
    margin-left: calc(var(--spacer-xl) * 2);
    margin-right: calc(36px * 2);
    margin-right: calc(var(--spacer-xl) * 2);
  }

  [class~=my-2-1],
:root [xl~=my-2-1] {
    margin-top: calc(36px * 2);
    margin-top: calc(var(--spacer-xl) * 2);
    margin-bottom: calc(36px * 2);
    margin-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=p-2-1],
:root [xl~=p-2-1] {
    padding: calc(36px * 2);
    padding: calc(var(--spacer-xl) * 2);
  }

  [class~=pt-2-1],
:root [xl~=pt-2-1] {
    padding-top: calc(36px * 2);
    padding-top: calc(var(--spacer-xl) * 2);
  }

  [class~=pb-2-1],
:root [xl~=pb-2-1] {
    padding-bottom: calc(36px * 2);
    padding-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=pl-2-1],
:root [xl~=pl-2-1] {
    padding-left: calc(36px * 2);
    padding-left: calc(var(--spacer-xl) * 2);
  }

  [class~=pr-2-1],
:root [xl~=pr-2-1] {
    padding-right: calc(36px * 2);
    padding-right: calc(var(--spacer-xl) * 2);
  }

  [class~=px-2-1],
:root [xl~=px-2-1] {
    padding-left: calc(36px * 2);
    padding-left: calc(var(--spacer-xl) * 2);
    padding-right: calc(36px * 2);
    padding-right: calc(var(--spacer-xl) * 2);
  }

  [class~=py-2-1],
:root [xl~=py-2-1] {
    padding-top: calc(36px * 2);
    padding-top: calc(var(--spacer-xl) * 2);
    padding-bottom: calc(36px * 2);
    padding-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=h-2-1],
:root [xl~=h-2-1] {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
  }

  [class~=w-2-1],
:root [xl~=w-2-1] {
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
  }

  [class~=m-3-1],
:root [xl~=m-3-1] {
    margin: calc(36px * 3);
    margin: calc(var(--spacer-xl) * 3);
  }

  [class~=mt-3-1],
:root [xl~=mt-3-1] {
    margin-top: calc(36px * 3);
    margin-top: calc(var(--spacer-xl) * 3);
  }

  [class~=mb-3-1],
:root [xl~=mb-3-1] {
    margin-bottom: calc(36px * 3);
    margin-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=ml-3-1],
:root [xl~=ml-3-1] {
    margin-left: calc(36px * 3);
    margin-left: calc(var(--spacer-xl) * 3);
  }

  [class~=mr-3-1],
:root [xl~=mr-3-1] {
    margin-right: calc(36px * 3);
    margin-right: calc(var(--spacer-xl) * 3);
  }

  [class~=mx-3-1],
:root [xl~=mx-3-1] {
    margin-left: calc(36px * 3);
    margin-left: calc(var(--spacer-xl) * 3);
    margin-right: calc(36px * 3);
    margin-right: calc(var(--spacer-xl) * 3);
  }

  [class~=my-3-1],
:root [xl~=my-3-1] {
    margin-top: calc(36px * 3);
    margin-top: calc(var(--spacer-xl) * 3);
    margin-bottom: calc(36px * 3);
    margin-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=p-3-1],
:root [xl~=p-3-1] {
    padding: calc(36px * 3);
    padding: calc(var(--spacer-xl) * 3);
  }

  [class~=pt-3-1],
:root [xl~=pt-3-1] {
    padding-top: calc(36px * 3);
    padding-top: calc(var(--spacer-xl) * 3);
  }

  [class~=pb-3-1],
:root [xl~=pb-3-1] {
    padding-bottom: calc(36px * 3);
    padding-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=pl-3-1],
:root [xl~=pl-3-1] {
    padding-left: calc(36px * 3);
    padding-left: calc(var(--spacer-xl) * 3);
  }

  [class~=pr-3-1],
:root [xl~=pr-3-1] {
    padding-right: calc(36px * 3);
    padding-right: calc(var(--spacer-xl) * 3);
  }

  [class~=px-3-1],
:root [xl~=px-3-1] {
    padding-left: calc(36px * 3);
    padding-left: calc(var(--spacer-xl) * 3);
    padding-right: calc(36px * 3);
    padding-right: calc(var(--spacer-xl) * 3);
  }

  [class~=py-3-1],
:root [xl~=py-3-1] {
    padding-top: calc(36px * 3);
    padding-top: calc(var(--spacer-xl) * 3);
    padding-bottom: calc(36px * 3);
    padding-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=h-3-1],
:root [xl~=h-3-1] {
    height: calc(36px * 3);
    height: calc(var(--spacer-xl) * 3);
  }

  [class~=w-3-1],
:root [xl~=w-3-1] {
    width: calc(36px * 3);
    width: calc(var(--spacer-xl) * 3);
  }

  [class~=m-4-1],
:root [xl~=m-4-1] {
    margin: calc(36px * 4);
    margin: calc(var(--spacer-xl) * 4);
  }

  [class~=mt-4-1],
:root [xl~=mt-4-1] {
    margin-top: calc(36px * 4);
    margin-top: calc(var(--spacer-xl) * 4);
  }

  [class~=mb-4-1],
:root [xl~=mb-4-1] {
    margin-bottom: calc(36px * 4);
    margin-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=ml-4-1],
:root [xl~=ml-4-1] {
    margin-left: calc(36px * 4);
    margin-left: calc(var(--spacer-xl) * 4);
  }

  [class~=mr-4-1],
:root [xl~=mr-4-1] {
    margin-right: calc(36px * 4);
    margin-right: calc(var(--spacer-xl) * 4);
  }

  [class~=mx-4-1],
:root [xl~=mx-4-1] {
    margin-left: calc(36px * 4);
    margin-left: calc(var(--spacer-xl) * 4);
    margin-right: calc(36px * 4);
    margin-right: calc(var(--spacer-xl) * 4);
  }

  [class~=my-4-1],
:root [xl~=my-4-1] {
    margin-top: calc(36px * 4);
    margin-top: calc(var(--spacer-xl) * 4);
    margin-bottom: calc(36px * 4);
    margin-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=p-4-1],
:root [xl~=p-4-1] {
    padding: calc(36px * 4);
    padding: calc(var(--spacer-xl) * 4);
  }

  [class~=pt-4-1],
:root [xl~=pt-4-1] {
    padding-top: calc(36px * 4);
    padding-top: calc(var(--spacer-xl) * 4);
  }

  [class~=pb-4-1],
:root [xl~=pb-4-1] {
    padding-bottom: calc(36px * 4);
    padding-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=pl-4-1],
:root [xl~=pl-4-1] {
    padding-left: calc(36px * 4);
    padding-left: calc(var(--spacer-xl) * 4);
  }

  [class~=pr-4-1],
:root [xl~=pr-4-1] {
    padding-right: calc(36px * 4);
    padding-right: calc(var(--spacer-xl) * 4);
  }

  [class~=px-4-1],
:root [xl~=px-4-1] {
    padding-left: calc(36px * 4);
    padding-left: calc(var(--spacer-xl) * 4);
    padding-right: calc(36px * 4);
    padding-right: calc(var(--spacer-xl) * 4);
  }

  [class~=py-4-1],
:root [xl~=py-4-1] {
    padding-top: calc(36px * 4);
    padding-top: calc(var(--spacer-xl) * 4);
    padding-bottom: calc(36px * 4);
    padding-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=h-4-1],
:root [xl~=h-4-1] {
    height: calc(36px * 4);
    height: calc(var(--spacer-xl) * 4);
  }

  [class~=w-4-1],
:root [xl~=w-4-1] {
    width: calc(36px * 4);
    width: calc(var(--spacer-xl) * 4);
  }

  [class~=m-5-1],
:root [xl~=m-5-1] {
    margin: calc(36px * 5);
    margin: calc(var(--spacer-xl) * 5);
  }

  [class~=mt-5-1],
:root [xl~=mt-5-1] {
    margin-top: calc(36px * 5);
    margin-top: calc(var(--spacer-xl) * 5);
  }

  [class~=mb-5-1],
:root [xl~=mb-5-1] {
    margin-bottom: calc(36px * 5);
    margin-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=ml-5-1],
:root [xl~=ml-5-1] {
    margin-left: calc(36px * 5);
    margin-left: calc(var(--spacer-xl) * 5);
  }

  [class~=mr-5-1],
:root [xl~=mr-5-1] {
    margin-right: calc(36px * 5);
    margin-right: calc(var(--spacer-xl) * 5);
  }

  [class~=mx-5-1],
:root [xl~=mx-5-1] {
    margin-left: calc(36px * 5);
    margin-left: calc(var(--spacer-xl) * 5);
    margin-right: calc(36px * 5);
    margin-right: calc(var(--spacer-xl) * 5);
  }

  [class~=my-5-1],
:root [xl~=my-5-1] {
    margin-top: calc(36px * 5);
    margin-top: calc(var(--spacer-xl) * 5);
    margin-bottom: calc(36px * 5);
    margin-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=p-5-1],
:root [xl~=p-5-1] {
    padding: calc(36px * 5);
    padding: calc(var(--spacer-xl) * 5);
  }

  [class~=pt-5-1],
:root [xl~=pt-5-1] {
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
  }

  [class~=pb-5-1],
:root [xl~=pb-5-1] {
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=pl-5-1],
:root [xl~=pl-5-1] {
    padding-left: calc(36px * 5);
    padding-left: calc(var(--spacer-xl) * 5);
  }

  [class~=pr-5-1],
:root [xl~=pr-5-1] {
    padding-right: calc(36px * 5);
    padding-right: calc(var(--spacer-xl) * 5);
  }

  [class~=px-5-1],
:root [xl~=px-5-1] {
    padding-left: calc(36px * 5);
    padding-left: calc(var(--spacer-xl) * 5);
    padding-right: calc(36px * 5);
    padding-right: calc(var(--spacer-xl) * 5);
  }

  [class~=py-5-1],
:root [xl~=py-5-1] {
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=h-5-1],
:root [xl~=h-5-1] {
    height: calc(36px * 5);
    height: calc(var(--spacer-xl) * 5);
  }

  [class~=w-5-1],
:root [xl~=w-5-1] {
    width: calc(36px * 5);
    width: calc(var(--spacer-xl) * 5);
  }

  [class~=m-6-1],
:root [xl~=m-6-1] {
    margin: calc(36px * 6);
    margin: calc(var(--spacer-xl) * 6);
  }

  [class~=mt-6-1],
:root [xl~=mt-6-1] {
    margin-top: calc(36px * 6);
    margin-top: calc(var(--spacer-xl) * 6);
  }

  [class~=mb-6-1],
:root [xl~=mb-6-1] {
    margin-bottom: calc(36px * 6);
    margin-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=ml-6-1],
:root [xl~=ml-6-1] {
    margin-left: calc(36px * 6);
    margin-left: calc(var(--spacer-xl) * 6);
  }

  [class~=mr-6-1],
:root [xl~=mr-6-1] {
    margin-right: calc(36px * 6);
    margin-right: calc(var(--spacer-xl) * 6);
  }

  [class~=mx-6-1],
:root [xl~=mx-6-1] {
    margin-left: calc(36px * 6);
    margin-left: calc(var(--spacer-xl) * 6);
    margin-right: calc(36px * 6);
    margin-right: calc(var(--spacer-xl) * 6);
  }

  [class~=my-6-1],
:root [xl~=my-6-1] {
    margin-top: calc(36px * 6);
    margin-top: calc(var(--spacer-xl) * 6);
    margin-bottom: calc(36px * 6);
    margin-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=p-6-1],
:root [xl~=p-6-1] {
    padding: calc(36px * 6);
    padding: calc(var(--spacer-xl) * 6);
  }

  [class~=pt-6-1],
:root [xl~=pt-6-1] {
    padding-top: calc(36px * 6);
    padding-top: calc(var(--spacer-xl) * 6);
  }

  [class~=pb-6-1],
:root [xl~=pb-6-1] {
    padding-bottom: calc(36px * 6);
    padding-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=pl-6-1],
:root [xl~=pl-6-1] {
    padding-left: calc(36px * 6);
    padding-left: calc(var(--spacer-xl) * 6);
  }

  [class~=pr-6-1],
:root [xl~=pr-6-1] {
    padding-right: calc(36px * 6);
    padding-right: calc(var(--spacer-xl) * 6);
  }

  [class~=px-6-1],
:root [xl~=px-6-1] {
    padding-left: calc(36px * 6);
    padding-left: calc(var(--spacer-xl) * 6);
    padding-right: calc(36px * 6);
    padding-right: calc(var(--spacer-xl) * 6);
  }

  [class~=py-6-1],
:root [xl~=py-6-1] {
    padding-top: calc(36px * 6);
    padding-top: calc(var(--spacer-xl) * 6);
    padding-bottom: calc(36px * 6);
    padding-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=h-6-1],
:root [xl~=h-6-1] {
    height: calc(36px * 6);
    height: calc(var(--spacer-xl) * 6);
  }

  [class~=w-6-1],
:root [xl~=w-6-1] {
    width: calc(36px * 6);
    width: calc(var(--spacer-xl) * 6);
  }

  [class~=m-7-1],
:root [xl~=m-7-1] {
    margin: calc(36px * 7);
    margin: calc(var(--spacer-xl) * 7);
  }

  [class~=mt-7-1],
:root [xl~=mt-7-1] {
    margin-top: calc(36px * 7);
    margin-top: calc(var(--spacer-xl) * 7);
  }

  [class~=mb-7-1],
:root [xl~=mb-7-1] {
    margin-bottom: calc(36px * 7);
    margin-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=ml-7-1],
:root [xl~=ml-7-1] {
    margin-left: calc(36px * 7);
    margin-left: calc(var(--spacer-xl) * 7);
  }

  [class~=mr-7-1],
:root [xl~=mr-7-1] {
    margin-right: calc(36px * 7);
    margin-right: calc(var(--spacer-xl) * 7);
  }

  [class~=mx-7-1],
:root [xl~=mx-7-1] {
    margin-left: calc(36px * 7);
    margin-left: calc(var(--spacer-xl) * 7);
    margin-right: calc(36px * 7);
    margin-right: calc(var(--spacer-xl) * 7);
  }

  [class~=my-7-1],
:root [xl~=my-7-1] {
    margin-top: calc(36px * 7);
    margin-top: calc(var(--spacer-xl) * 7);
    margin-bottom: calc(36px * 7);
    margin-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=p-7-1],
:root [xl~=p-7-1] {
    padding: calc(36px * 7);
    padding: calc(var(--spacer-xl) * 7);
  }

  [class~=pt-7-1],
:root [xl~=pt-7-1] {
    padding-top: calc(36px * 7);
    padding-top: calc(var(--spacer-xl) * 7);
  }

  [class~=pb-7-1],
:root [xl~=pb-7-1] {
    padding-bottom: calc(36px * 7);
    padding-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=pl-7-1],
:root [xl~=pl-7-1] {
    padding-left: calc(36px * 7);
    padding-left: calc(var(--spacer-xl) * 7);
  }

  [class~=pr-7-1],
:root [xl~=pr-7-1] {
    padding-right: calc(36px * 7);
    padding-right: calc(var(--spacer-xl) * 7);
  }

  [class~=px-7-1],
:root [xl~=px-7-1] {
    padding-left: calc(36px * 7);
    padding-left: calc(var(--spacer-xl) * 7);
    padding-right: calc(36px * 7);
    padding-right: calc(var(--spacer-xl) * 7);
  }

  [class~=py-7-1],
:root [xl~=py-7-1] {
    padding-top: calc(36px * 7);
    padding-top: calc(var(--spacer-xl) * 7);
    padding-bottom: calc(36px * 7);
    padding-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=h-7-1],
:root [xl~=h-7-1] {
    height: calc(36px * 7);
    height: calc(var(--spacer-xl) * 7);
  }

  [class~=w-7-1],
:root [xl~=w-7-1] {
    width: calc(36px * 7);
    width: calc(var(--spacer-xl) * 7);
  }

  [class~=m-1-2],
:root [xl~=m-1-2] {
    margin: calc(36px / 2);
    margin: calc(var(--spacer-xl) / 2);
  }

  [class~=mt-1-2],
:root [xl~=mt-1-2] {
    margin-top: calc(36px / 2);
    margin-top: calc(var(--spacer-xl) / 2);
  }

  [class~=mb-1-2],
:root [xl~=mb-1-2] {
    margin-bottom: calc(36px / 2);
    margin-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=ml-1-2],
:root [xl~=ml-1-2] {
    margin-left: calc(36px / 2);
    margin-left: calc(var(--spacer-xl) / 2);
  }

  [class~=mr-1-2],
:root [xl~=mr-1-2] {
    margin-right: calc(36px / 2);
    margin-right: calc(var(--spacer-xl) / 2);
  }

  [class~=mx-1-2],
:root [xl~=mx-1-2] {
    margin-left: calc(36px / 2);
    margin-left: calc(var(--spacer-xl) / 2);
    margin-right: calc(36px / 2);
    margin-right: calc(var(--spacer-xl) / 2);
  }

  [class~=my-1-2],
:root [xl~=my-1-2] {
    margin-top: calc(36px / 2);
    margin-top: calc(var(--spacer-xl) / 2);
    margin-bottom: calc(36px / 2);
    margin-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=p-1-2],
:root [xl~=p-1-2] {
    padding: calc(36px / 2);
    padding: calc(var(--spacer-xl) / 2);
  }

  [class~=pt-1-2],
:root [xl~=pt-1-2] {
    padding-top: calc(36px / 2);
    padding-top: calc(var(--spacer-xl) / 2);
  }

  [class~=pb-1-2],
:root [xl~=pb-1-2] {
    padding-bottom: calc(36px / 2);
    padding-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=pl-1-2],
:root [xl~=pl-1-2] {
    padding-left: calc(36px / 2);
    padding-left: calc(var(--spacer-xl) / 2);
  }

  [class~=pr-1-2],
:root [xl~=pr-1-2] {
    padding-right: calc(36px / 2);
    padding-right: calc(var(--spacer-xl) / 2);
  }

  [class~=px-1-2],
:root [xl~=px-1-2] {
    padding-left: calc(36px / 2);
    padding-left: calc(var(--spacer-xl) / 2);
    padding-right: calc(36px / 2);
    padding-right: calc(var(--spacer-xl) / 2);
  }

  [class~=py-1-2],
:root [xl~=py-1-2] {
    padding-top: calc(36px / 2);
    padding-top: calc(var(--spacer-xl) / 2);
    padding-bottom: calc(36px / 2);
    padding-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=h-1-2],
:root [xl~=h-1-2] {
    height: calc(36px / 2);
    height: calc(var(--spacer-xl) / 2);
  }

  [class~=w-1-2],
:root [xl~=w-1-2] {
    width: calc(36px / 2);
    width: calc(var(--spacer-xl) / 2);
  }

  [class~=m-1-3],
:root [xl~=m-1-3] {
    margin: calc(36px / 3);
    margin: calc(var(--spacer-xl) / 3);
  }

  [class~=mt-1-3],
:root [xl~=mt-1-3] {
    margin-top: calc(36px / 3);
    margin-top: calc(var(--spacer-xl) / 3);
  }

  [class~=mb-1-3],
:root [xl~=mb-1-3] {
    margin-bottom: calc(36px / 3);
    margin-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=ml-1-3],
:root [xl~=ml-1-3] {
    margin-left: calc(36px / 3);
    margin-left: calc(var(--spacer-xl) / 3);
  }

  [class~=mr-1-3],
:root [xl~=mr-1-3] {
    margin-right: calc(36px / 3);
    margin-right: calc(var(--spacer-xl) / 3);
  }

  [class~=mx-1-3],
:root [xl~=mx-1-3] {
    margin-left: calc(36px / 3);
    margin-left: calc(var(--spacer-xl) / 3);
    margin-right: calc(36px / 3);
    margin-right: calc(var(--spacer-xl) / 3);
  }

  [class~=my-1-3],
:root [xl~=my-1-3] {
    margin-top: calc(36px / 3);
    margin-top: calc(var(--spacer-xl) / 3);
    margin-bottom: calc(36px / 3);
    margin-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=p-1-3],
:root [xl~=p-1-3] {
    padding: calc(36px / 3);
    padding: calc(var(--spacer-xl) / 3);
  }

  [class~=pt-1-3],
:root [xl~=pt-1-3] {
    padding-top: calc(36px / 3);
    padding-top: calc(var(--spacer-xl) / 3);
  }

  [class~=pb-1-3],
:root [xl~=pb-1-3] {
    padding-bottom: calc(36px / 3);
    padding-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=pl-1-3],
:root [xl~=pl-1-3] {
    padding-left: calc(36px / 3);
    padding-left: calc(var(--spacer-xl) / 3);
  }

  [class~=pr-1-3],
:root [xl~=pr-1-3] {
    padding-right: calc(36px / 3);
    padding-right: calc(var(--spacer-xl) / 3);
  }

  [class~=px-1-3],
:root [xl~=px-1-3] {
    padding-left: calc(36px / 3);
    padding-left: calc(var(--spacer-xl) / 3);
    padding-right: calc(36px / 3);
    padding-right: calc(var(--spacer-xl) / 3);
  }

  [class~=py-1-3],
:root [xl~=py-1-3] {
    padding-top: calc(36px / 3);
    padding-top: calc(var(--spacer-xl) / 3);
    padding-bottom: calc(36px / 3);
    padding-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=h-1-3],
:root [xl~=h-1-3] {
    height: calc(36px / 3);
    height: calc(var(--spacer-xl) / 3);
  }

  [class~=w-1-3],
:root [xl~=w-1-3] {
    width: calc(36px / 3);
    width: calc(var(--spacer-xl) / 3);
  }

  [class~=m-1-4],
:root [xl~=m-1-4] {
    margin: calc(36px / 4);
    margin: calc(var(--spacer-xl) / 4);
  }

  [class~=mt-1-4],
:root [xl~=mt-1-4] {
    margin-top: calc(36px / 4);
    margin-top: calc(var(--spacer-xl) / 4);
  }

  [class~=mb-1-4],
:root [xl~=mb-1-4] {
    margin-bottom: calc(36px / 4);
    margin-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=ml-1-4],
:root [xl~=ml-1-4] {
    margin-left: calc(36px / 4);
    margin-left: calc(var(--spacer-xl) / 4);
  }

  [class~=mr-1-4],
:root [xl~=mr-1-4] {
    margin-right: calc(36px / 4);
    margin-right: calc(var(--spacer-xl) / 4);
  }

  [class~=mx-1-4],
:root [xl~=mx-1-4] {
    margin-left: calc(36px / 4);
    margin-left: calc(var(--spacer-xl) / 4);
    margin-right: calc(36px / 4);
    margin-right: calc(var(--spacer-xl) / 4);
  }

  [class~=my-1-4],
:root [xl~=my-1-4] {
    margin-top: calc(36px / 4);
    margin-top: calc(var(--spacer-xl) / 4);
    margin-bottom: calc(36px / 4);
    margin-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=p-1-4],
:root [xl~=p-1-4] {
    padding: calc(36px / 4);
    padding: calc(var(--spacer-xl) / 4);
  }

  [class~=pt-1-4],
:root [xl~=pt-1-4] {
    padding-top: calc(36px / 4);
    padding-top: calc(var(--spacer-xl) / 4);
  }

  [class~=pb-1-4],
:root [xl~=pb-1-4] {
    padding-bottom: calc(36px / 4);
    padding-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=pl-1-4],
:root [xl~=pl-1-4] {
    padding-left: calc(36px / 4);
    padding-left: calc(var(--spacer-xl) / 4);
  }

  [class~=pr-1-4],
:root [xl~=pr-1-4] {
    padding-right: calc(36px / 4);
    padding-right: calc(var(--spacer-xl) / 4);
  }

  [class~=px-1-4],
:root [xl~=px-1-4] {
    padding-left: calc(36px / 4);
    padding-left: calc(var(--spacer-xl) / 4);
    padding-right: calc(36px / 4);
    padding-right: calc(var(--spacer-xl) / 4);
  }

  [class~=py-1-4],
:root [xl~=py-1-4] {
    padding-top: calc(36px / 4);
    padding-top: calc(var(--spacer-xl) / 4);
    padding-bottom: calc(36px / 4);
    padding-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=h-1-4],
:root [xl~=h-1-4] {
    height: calc(36px / 4);
    height: calc(var(--spacer-xl) / 4);
  }

  [class~=w-1-4],
:root [xl~=w-1-4] {
    width: calc(36px / 4);
    width: calc(var(--spacer-xl) / 4);
  }

  [class~=m-0],
:root [xl~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [xl~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [xl~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [xl~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [xl~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [xl~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [xl~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [xl~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [xl~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [xl~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [xl~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [xl~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [xl~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [xl~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [xl~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [xl~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [xl~=gutter] {
    margin-left: calc(36px * -1);
    margin-left: calc(var(--gutter-xl) * -1);
    margin-right: calc(36px * -1);
    margin-right: calc(var(--gutter-xl) * -1);
  }
  [class~=gutter] > *,
:root [xl~=gutter] > * {
    padding-left: calc(36px * 1);
    padding-left: calc(var(--gutter-xl) * 1);
    padding-right: calc(36px * 1);
    padding-right: calc(var(--gutter-xl) * 1);
  }

  [class~=gutter-1-2],
:root [xl~=gutter-1-2] {
    margin-left: calc(36px * -0.5);
    margin-left: calc(var(--gutter-xl) * -0.5);
    margin-right: calc(36px * -0.5);
    margin-right: calc(var(--gutter-xl) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [xl~=gutter-1-2] > * {
    padding-left: calc(36px * 0.5);
    padding-left: calc(var(--gutter-xl) * 0.5);
    padding-right: calc(36px * 0.5);
    padding-right: calc(var(--gutter-xl) * 0.5);
  }

  [class~=gutter-1-3],
:root [xl~=gutter-1-3] {
    margin-left: calc(36px * -0.333);
    margin-left: calc(var(--gutter-xl) * -0.333);
    margin-right: calc(36px * -0.333);
    margin-right: calc(var(--gutter-xl) * -0.333);
  }
  [class~=gutter-1-3] > *,
:root [xl~=gutter-1-3] > * {
    padding-left: calc(36px * 0.333);
    padding-left: calc(var(--gutter-xl) * 0.333);
    padding-right: calc(36px * 0.333);
    padding-right: calc(var(--gutter-xl) * 0.333);
  }

  [class~=gutter-1-4],
:root [xl~=gutter-1-4] {
    margin-left: calc(36px * -0.25);
    margin-left: calc(var(--gutter-xl) * -0.25);
    margin-right: calc(36px * -0.25);
    margin-right: calc(var(--gutter-xl) * -0.25);
  }
  [class~=gutter-1-4] > *,
:root [xl~=gutter-1-4] > * {
    padding-left: calc(36px * 0.25);
    padding-left: calc(var(--gutter-xl) * 0.25);
    padding-right: calc(36px * 0.25);
    padding-right: calc(var(--gutter-xl) * 0.25);
  }

  [class~=row-12],
:root [xl~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [xl~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [xl~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [xl~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [xl~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [xl~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [xl~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [xl~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [xl~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [xl~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [xl~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [xl~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [xl~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [xl~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [xl~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [xl~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [xl~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [xl~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [xl~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [xl~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [xl~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [xl~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [xl~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [xl~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [xl~=row],
:root [xl~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [xl~=row] > *,
:root [xl~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [xl~=column] {
    flex-direction: column;
  }

  [class~=column-reverse],
:root [xl~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row],
:root [xl~=row] {
    flex-direction: row;
  }

  [class~=row-reverse],
:root [xl~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [xl~=row][xl~=v-center], :root [xl~=column][xl~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [xl~=row][xl~=v-start], :root [xl~=column][xl~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [xl~=row][xl~=v-end], :root [xl~=column][xl~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [xl~=row][xl~=v-stretch], :root [xl~=column][xl~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [xl~=row][xl~=h-center], :root [xl~=column][xl~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [xl~=row][xl~=h-start], :root [xl~=column][xl~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [xl~=row][xl~=h-end], :root [xl~=column][xl~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [xl~=row][xl~=h-spacein], :root [xl~=column][xl~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [xl~=row][xl~=h-spaceout], :root [xl~=column][xl~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [xl~=row] > [xl~=v-self-center], :root [xl~=column] > [xl~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [xl~=row] > [xl~=v-self-start], :root [xl~=column] > [xl~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [xl~=row] > [xl~=v-self-end], :root [xl~=column] > [xl~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [xl~=row] > [xl~=v-self-stretch], :root [xl~=column] > [xl~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [xl~=row] > [xl~=v-self-selfstart], :root [xl~=column] > [xl~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [xl~=row] > [xl~=v-self-selfend], :root [xl~=column] > [xl~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [xl~=row] > [xl~=h-self-center], :root [xl~=column] > [xl~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [xl~=row] > [xl~=h-self-start], :root [xl~=column] > [xl~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [xl~=row] > [xl~=h-self-end], :root [xl~=column] > [xl~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [xl~=row] > [xl~=h-self-stretch], :root [xl~=column] > [xl~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [xl~=row] > [xl~=h-self-selfstart], :root [xl~=column] > [xl~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [xl~=row] > [xl~=h-self-selfend], :root [xl~=column] > [xl~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [xl~=row] > [xl~=h-self-left], :root [xl~=column] > [xl~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [xl~=row] > [xl~=h-self-right], :root [xl~=column] > [xl~=v-self-right] {
    justify-self: right;
  }

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

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

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

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

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

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

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

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

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

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

  [class*=d-flex],
:root [xl*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [xl*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [xl*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [xl*=d-block] {
    display: block;
  }

  [class*=d-none],
:root [xl*=d-none] {
    display: none;
  }

  [class*=absolute],
:root [xl*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [xl*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [xl*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [xl*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [xl*=sticky] {
    position: sticky;
  }

  [class*=top-0],
:root [xl*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [xl*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [xl*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [xl*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [xl*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [xl*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [xl*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [xl*=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;
  }
}
.modal {
  display: none;
  position: fixed;
  z-index: 2000;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(56, 64, 67, 0.9);
  background: rgba(var(--color-primary-500), 0.9);
  background: linear-gradient(-35deg, rgba(255, 181, 41, 1) 0%, rgba(56, 64, 67, 1) 100%);
  background: linear-gradient(-35deg, rgba(var(--color-secondary-400), 1) 0%, rgba(var(--color-primary-500), 1) 100%);
}
.modal .modal-content {
  background: rgba(var(--color-default-white), 1);
  position: relative;
  max-height: 88vh;
  min-height: 280px;
  max-width: 100vw;
  transition: all 0.5s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(32px * 2);
  padding: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs-l) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-sm) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .modal .modal-content {
    padding: calc(24px * 2);
    padding: calc(var(--spacer-sm-l) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .modal .modal-content {
    padding: calc(32px * 2);
    padding: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .modal .modal-content {
    padding: calc(36px * 2);
    padding: calc(var(--spacer-xl) * 2);
  }
}
.modal .modal-content > .circle-button {
  position: absolute;
  top: 0;
  right: 0;
}

.modal-video {
  background: black;
}
.modal-video.active {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 1;
}
.modal-video.active video {
  width: 80vw;
  height: calc(80vw * (9/16));
  -o-object-fit: cover;
     object-fit: cover;
}
.modal-video .video-close {
  position: absolute;
  z-index: 1;
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
  cursor: pointer;
  line-height: 1;
  transition: all 0.666s ease 0s;
  font-size: 2rem;
  top: calc(32px * 2);
  top: calc(var(--spacer-default) * 2);
  right: calc(32px * 2);
  right: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .modal-video .video-close {
    font-size: 1.4rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-xs) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .modal-video .video-close {
    font-size: 1.3rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-xs-l) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .modal-video .video-close {
    font-size: 1.6rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-sm) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .modal-video .video-close {
    font-size: 1.4rem;
    top: calc(24px * 2);
    top: calc(var(--spacer-sm-l) * 2);
    right: calc(24px * 2);
    right: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .modal-video .video-close {
    font-size: 1.6rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-md) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .modal-video .video-close {
    font-size: 1.8rem;
    top: calc(32px * 2);
    top: calc(var(--spacer-lg) * 2);
    right: calc(32px * 2);
    right: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .modal-video .video-close {
    font-size: 2rem;
    top: calc(36px * 2);
    top: calc(var(--spacer-xl) * 2);
    right: calc(36px * 2);
    right: calc(var(--spacer-xl) * 2);
  }
}
.modal-video .video-close:hover {
  transform: scale(1.5);
  transition: all 0.666s ease 0s;
}
body.modal-header-video-active .modal-video {
  -webkit-animation: fadeIn 1.66s 0s ease forwards 1;
          animation: fadeIn 1.66s 0s ease forwards 1;
}

body.modal-header-video-active #main-header {
  opacity: 0;
  pointer-events: none;
  transition: all 0.66s ease;
}

/*Selection*/
::-moz-selection {
  background: get-color(secondary, 500);
  color: get-contrast(secondary, 500);
}
::selection {
  background: get-color(secondary, 500);
  color: get-contrast(secondary, 500);
}

header, footer, nav, button, svg, img {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

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

::-webkit-scrollbar {
  width: 6px;
  background-color: white;
}

::-webkit-scrollbar-thumb {
  border: 2px solid rgba(255, 167, 0, 1);
  border: 2px solid rgba(var(--color-secondary-500), 1);
  border-radius: 0px;
  background-color: rgba(255, 167, 0, 1);
  background-color: rgba(var(--color-secondary-500), 1);
}

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

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

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

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

/*Cards*/
.card, article.type-works {
  background-color: #ffffff;
  background-color: var(--bg-light-default);
  height: 100%;
}
.card .image-16-9:hover .read-next, article.type-works .image-16-9:hover .read-next {
  opacity: 1;
  transition: all 0.666s ease 0s;
}
.card .read-next, article.type-works .read-next {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  display: none;
  align-items: center;
  justify-content: center;
  opacity: 0;
  background-color: rgba(56, 64, 67, 0.333);
  background-color: rgba(var(--color-primary-500), 0.333);
  transition: all 0.666s ease 0s;
}
.card .content, article.type-works .content {
  padding: calc(32px * 1);
  padding: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .card .content, article.type-works .content {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .card .content, article.type-works .content {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .card .content, article.type-works .content {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .card .content, article.type-works .content {
    padding: calc(24px * 1);
    padding: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .card .content, article.type-works .content {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .card .content, article.type-works .content {
    padding: calc(32px * 1);
    padding: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .card .content, article.type-works .content {
    padding: calc(36px * 1);
    padding: calc(var(--spacer-xl) * 1);
  }
}
.card .content h3, article.type-works .content h3 {
  margin-bottom: 0 !important;
}
.card .icon-arrow-left, article.type-works .icon-arrow-left {
  padding-top: 4px;
}
.card ul.skills, article.type-works ul.skills {
  margin: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.card ul.skills > li, article.type-works ul.skills > li {
  border: 1px solid rgba(56, 64, 67, 1);
  border: 1px solid var(--text-color-default);
  font-size: 0.8em;
  list-style: none !important;
  white-space: nowrap;
  padding: calc(32px * 0.125);
  padding: calc(var(--spacer-default) * 0.125);
  margin-right: calc(32px * 0.125);
  margin-right: calc(var(--spacer-default) * 0.125);
  margin-bottom: calc(32px * 0.25);
  margin-bottom: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(28px * 0.125);
    padding: calc(var(--spacer-xs) * 0.125);
    margin-right: calc(28px * 0.125);
    margin-right: calc(var(--spacer-xs) * 0.125);
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(28px * 0.125);
    padding: calc(var(--spacer-xs-l) * 0.125);
    margin-right: calc(28px * 0.125);
    margin-right: calc(var(--spacer-xs-l) * 0.125);
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(28px * 0.125);
    padding: calc(var(--spacer-sm) * 0.125);
    margin-right: calc(28px * 0.125);
    margin-right: calc(var(--spacer-sm) * 0.125);
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(24px * 0.125);
    padding: calc(var(--spacer-sm-l) * 0.125);
    margin-right: calc(24px * 0.125);
    margin-right: calc(var(--spacer-sm-l) * 0.125);
    margin-bottom: calc(24px * 0.25);
    margin-bottom: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(28px * 0.125);
    padding: calc(var(--spacer-md) * 0.125);
    margin-right: calc(28px * 0.125);
    margin-right: calc(var(--spacer-md) * 0.125);
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(32px * 0.125);
    padding: calc(var(--spacer-lg) * 0.125);
    margin-right: calc(32px * 0.125);
    margin-right: calc(var(--spacer-lg) * 0.125);
    margin-bottom: calc(32px * 0.25);
    margin-bottom: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .card ul.skills > li, article.type-works ul.skills > li {
    padding: calc(36px * 0.125);
    padding: calc(var(--spacer-xl) * 0.125);
    margin-right: calc(36px * 0.125);
    margin-right: calc(var(--spacer-xl) * 0.125);
    margin-bottom: calc(36px * 0.25);
    margin-bottom: calc(var(--spacer-xl) * 0.25);
  }
}

main#main ul {
  margin-top: calc(32px * 0.5);
  margin-top: calc(var(--spacer-default) * 0.5);
  margin-bottom: calc(32px * 1);
  margin-bottom: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  main#main ul {
    margin-top: calc(28px * 0.5);
    margin-top: calc(var(--spacer-xs) * 0.5);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  main#main ul {
    margin-top: calc(28px * 0.5);
    margin-top: calc(var(--spacer-xs-l) * 0.5);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  main#main ul {
    margin-top: calc(28px * 0.5);
    margin-top: calc(var(--spacer-sm) * 0.5);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  main#main ul {
    margin-top: calc(24px * 0.5);
    margin-top: calc(var(--spacer-sm-l) * 0.5);
    margin-bottom: calc(24px * 1);
    margin-bottom: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  main#main ul {
    margin-top: calc(28px * 0.5);
    margin-top: calc(var(--spacer-md) * 0.5);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  main#main ul {
    margin-top: calc(32px * 0.5);
    margin-top: calc(var(--spacer-lg) * 0.5);
    margin-bottom: calc(32px * 1);
    margin-bottom: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  main#main ul {
    margin-top: calc(36px * 0.5);
    margin-top: calc(var(--spacer-xl) * 0.5);
    margin-bottom: calc(36px * 1);
    margin-bottom: calc(var(--spacer-xl) * 1);
  }
}
main#main ul li {
  list-style: inside disc;
}

small, .small {
  font-size: 0.8em;
}

strong, b, .strong {
  font-weight: 700;
}

.h5.label {
  color: rgba(255, 167, 0, 1)!important;
  color: rgba(var(--color-secondary-500), 1)!important;
  text-transform: uppercase;
}

small.h5.label {
  font-size: 0.8em;
}

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

hr {
  border: 0px none;
  margin: 32px/8 auto;
  margin: var(--spacer-default)/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%;
  display: flex;
}

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

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

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

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

.hidden {
  display: none !important;
}

.visible-default {
  display: block;
}

time {
  font-size: 1.1rem;
}

@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;
  }
}
#main-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000000000;
}
body.scrolled #main-header {
  background-color: rgba(56, 64, 67, 1);
  background-color: rgba(var(--color-primary-500), 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header {
    display: flex;
  }
  .primary-menu-active #main-header {
    height: 100%;
    flex-direction: row;
    overflow: auto;
    align-items: center;
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    flex-wrap: wrap;
  }
  .primary-menu-active #main-header > nav {
    width: 100%;
  }
  .primary-menu-active #main-header:after {
    content: "";
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    width: 100%;
    top: 0;
    left: 0;
    position: fixed;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header {
    display: flex;
  }
  .primary-menu-active #main-header {
    height: 100%;
    flex-direction: row;
    overflow: auto;
    align-items: center;
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    flex-wrap: wrap;
  }
  .primary-menu-active #main-header > nav {
    width: 100%;
  }
  .primary-menu-active #main-header:after {
    content: "";
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    width: 100%;
    top: 0;
    left: 0;
    position: fixed;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header {
    display: flex;
  }
  .primary-menu-active #main-header {
    height: 100%;
    flex-direction: row;
    overflow: auto;
    align-items: center;
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    flex-wrap: wrap;
  }
  .primary-menu-active #main-header > nav {
    width: 100%;
  }
  .primary-menu-active #main-header:after {
    content: "";
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    width: 100%;
    top: 0;
    left: 0;
    position: fixed;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header {
    display: flex;
  }
  .primary-menu-active #main-header {
    height: 100%;
    flex-direction: row;
    overflow: auto;
    align-items: center;
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    flex-wrap: wrap;
  }
  .primary-menu-active #main-header > nav {
    width: 100%;
  }
  .primary-menu-active #main-header:after {
    content: "";
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
    background-color: rgba(56, 64, 67, 1);
    background-color: rgba(var(--color-primary-500), 1);
    width: 100%;
    top: 0;
    left: 0;
    position: fixed;
  }
}
#main-header #home-link {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  z-index: 3;
  transition: all 0.666s ease 0s;
}
body.scrolled #main-header #home-link {
  transition: all 0.666s ease 0s;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #home-link {
    position: fixed;
    top: calc(28px * 1);
    top: calc(var(--spacer-xs) * 1);
    left: calc(28px * 1);
    left: calc(var(--spacer-xs) * 1);
  }
  body.scrolled #main-header #home-link {
    top: calc(28px * 0.5);
    top: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #home-link {
    position: fixed;
    top: calc(28px * 1);
    top: calc(var(--spacer-xs-l) * 1);
  }
  body.scrolled #main-header #home-link {
    top: calc(28px * 0.5);
    top: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #home-link {
    position: fixed;
    top: calc(28px * 1);
    top: calc(var(--spacer-sm) * 1);
    left: calc(28px * 1);
    left: calc(var(--spacer-sm) * 1);
  }
  body.scrolled #main-header #home-link {
    top: calc(28px * 0.5);
    top: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #home-link {
    position: fixed;
    top: calc(24px * 1);
    top: calc(var(--spacer-sm-l) * 1);
  }
  body.scrolled #main-header #home-link {
    top: calc(24px * 0.5);
    top: calc(var(--spacer-sm-l) * 0.5);
  }
}
#main-header #home-link img.logo {
  width: auto !important;
  transition: all 0.666s ease 0s;
  height: calc(32px * 3);
  height: calc(var(--spacer-default) * 3);
}
body.scrolled #main-header #home-link img.logo {
  transition: all 0.666s ease 0s;
}
body.scrolled #main-header #home-link img.logo {
  height: calc(32px * 2) !important;
  height: calc(var(--spacer-default) * 2) !important;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #home-link img.logo {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs) * 3);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(28px * 2) !important;
    height: calc(var(--spacer-xs) * 2) !important;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #home-link img.logo {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs-l) * 3);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(28px * 2) !important;
    height: calc(var(--spacer-xs-l) * 2) !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #home-link img.logo {
    height: calc(28px * 3);
    height: calc(var(--spacer-sm) * 3);
    height: calc(28px * 3);
    height: calc(var(--spacer-sm) * 3);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(28px * 2) !important;
    height: calc(var(--spacer-sm) * 2) !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #home-link img.logo {
    height: calc(24px * 3);
    height: calc(var(--spacer-sm-l) * 3);
    height: calc(24px * 3);
    height: calc(var(--spacer-sm-l) * 3);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(24px * 2) !important;
    height: calc(var(--spacer-sm-l) * 2) !important;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #home-link img.logo {
    height: calc(28px * 3);
    height: calc(var(--spacer-md) * 3);
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(28px * 2) !important;
    height: calc(var(--spacer-md) * 2) !important;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #home-link img.logo {
    height: calc(32px * 3);
    height: calc(var(--spacer-lg) * 3);
    height: calc(32px * 2.5);
    height: calc(var(--spacer-lg) * 2.5);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(32px * 2) !important;
    height: calc(var(--spacer-lg) * 2) !important;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #home-link img.logo {
    height: calc(36px * 3);
    height: calc(var(--spacer-xl) * 3);
  }
  body.scrolled #main-header #home-link img.logo {
    height: calc(36px * 2) !important;
    height: calc(var(--spacer-xl) * 2) !important;
  }
}
#main-header #top-menu {
  position: relative;
  z-index: 1;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu {
    box-shadow: none;
    width: 100%;
    order: 1;
    padding-bottom: calc(28px * 1.5);
    padding-bottom: calc(var(--spacer-xs) * 1.5);
    position: absolute;
  }
  .primary-menu-active #main-header #top-menu {
    position: relative;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu {
    box-shadow: none;
    width: 100%;
    order: 1;
    padding-bottom: calc(28px * 1.5);
    padding-bottom: calc(var(--spacer-xs-l) * 1.5);
    position: absolute;
  }
  .primary-menu-active #main-header #top-menu {
    position: relative;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu {
    box-shadow: none;
    width: 100%;
    order: 1;
    padding-bottom: calc(28px * 1.5);
    padding-bottom: calc(var(--spacer-sm) * 1.5);
    position: absolute;
  }
  .primary-menu-active #main-header #top-menu {
    position: relative;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu {
    box-shadow: none;
    width: 100%;
    order: 1;
    padding-bottom: calc(24px * 1.5);
    padding-bottom: calc(var(--spacer-sm-l) * 1.5);
    position: absolute;
  }
  .primary-menu-active #main-header #top-menu {
    position: relative;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu {
    box-shadow: 0 0 calc(36px * 0.5) rgba(0, 0, 0, 0.11);
    box-shadow: 0 0 calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.11);
  }
}
#main-header #top-menu .menu-wrapper {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-end;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper {
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper {
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper {
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper {
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #top-menu .menu-wrapper .menu-container {
    display: block;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #top-menu .menu-wrapper .menu-container {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #top-menu .menu-wrapper .menu-container {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #top-menu .menu-wrapper .menu-container {
    display: block;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .menu-container li {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .menu-container li {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .menu-container li {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .menu-container li {
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
  }
}
#main-header #top-menu .menu-wrapper a {
  font-size: 0.8rem;
  color: #384043;
  margin: 0 calc(32px * 0.5);
  margin: 0 calc(var(--spacer-default) * 0.5);
  padding: calc(32px * 0.125) 0;
  padding: calc(var(--spacer-default) * 0.125) 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 0.8rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-xs) * 0.5);
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-xs) * 0.125) 0;
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-xs) * 0.125) 0;
    text-align: center;
    white-space: nowrap;
    color: white;
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-xs-l) * 0.5);
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-xs-l) * 0.125) 0;
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-xs-l) * 0.125) 0;
    text-align: center;
    white-space: nowrap;
    color: white;
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-sm) * 0.5);
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-sm) * 0.125) 0;
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-sm) * 0.125) 0;
    text-align: center;
    white-space: nowrap;
    color: white;
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(24px * 0.5);
    margin: 0 calc(var(--spacer-sm-l) * 0.5);
    padding: calc(24px * 0.125) 0;
    padding: calc(var(--spacer-sm-l) * 0.125) 0;
    padding: calc(24px * 0.125) 0;
    padding: calc(var(--spacer-sm-l) * 0.125) 0;
    text-align: center;
    white-space: nowrap;
    color: white;
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    font-size: 1em;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-md) * 0.5);
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-md) * 0.125) 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(32px * 0.5);
    margin: 0 calc(var(--spacer-lg) * 0.5);
    padding: calc(32px * 0.125) 0;
    padding: calc(var(--spacer-lg) * 0.125) 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper a {
    margin: 0 calc(36px * 0.5);
    margin: 0 calc(var(--spacer-xl) * 0.5);
    padding: calc(36px * 0.125) 0;
    padding: calc(var(--spacer-xl) * 0.125) 0;
  }
}
#main-header #top-menu .menu-wrapper > a {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper > a {
    order: 1;
    display: none;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper > a {
    order: 1;
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper > a {
    order: 1;
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper > a {
    order: 1;
    display: none;
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher {
  position: relative;
  z-index: 2;
  text-transform: uppercase;
  width: calc(32px * 2);
  width: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
    position: fixed;
    top: 0;
    z-index: 1000;
    right: calc(28px * 3);
    right: calc(var(--spacer-xs) * 3);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
    position: fixed;
    top: 0;
    z-index: 1000;
    right: calc(28px * 3);
    right: calc(var(--spacer-xs-l) * 3);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
    position: fixed;
    top: 0;
    z-index: 1000;
    right: calc(28px * 3);
    right: calc(var(--spacer-sm) * 3);
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
    position: fixed;
    top: 0;
    z-index: 1000;
    right: calc(24px * 3);
    right: calc(var(--spacer-sm-l) * 3);
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher {
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher li {
  display: none;
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: calc(32px * 1);
  height: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(28px * 1);
    height: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(28px * 1);
    height: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(28px * 1);
    height: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(24px * 1);
    height: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(28px * 1);
    height: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(32px * 1);
    height: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li {
    height: calc(36px * 1);
    height: calc(var(--spacer-xl) * 1);
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher li.active {
  display: flex;
  height: 100% !important;
  border-bottom: 2px solid transparent;
  pointer-events: none;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a {
    color: rgb(255, 255, 255) !important;
    color: rgb(var(--color-primary-contrast-500)) !important;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a {
    color: rgb(255, 255, 255) !important;
    color: rgb(var(--color-primary-contrast-500)) !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a {
    color: rgb(255, 255, 255) !important;
    color: rgb(var(--color-primary-contrast-500)) !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a {
    color: rgb(255, 255, 255) !important;
    color: rgb(var(--color-primary-contrast-500)) !important;
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  width: calc(32px * 0.25);
  width: calc(var(--spacer-default) * 0.25);
  height: calc(32px * 0.25);
  height: calc(var(--spacer-default) * 0.25);
  margin-left: calc(32px * 0.25);
  margin-left: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(28px * 0.25);
    width: calc(var(--spacer-xs) * 0.25);
    height: calc(28px * 0.25);
    height: calc(var(--spacer-xs) * 0.25);
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-xs) * 0.25);
    display: none;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(28px * 0.25);
    width: calc(var(--spacer-xs-l) * 0.25);
    height: calc(28px * 0.25);
    height: calc(var(--spacer-xs-l) * 0.25);
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-xs-l) * 0.25);
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(28px * 0.25);
    width: calc(var(--spacer-sm) * 0.25);
    height: calc(28px * 0.25);
    height: calc(var(--spacer-sm) * 0.25);
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-sm) * 0.25);
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(24px * 0.25);
    width: calc(var(--spacer-sm-l) * 0.25);
    height: calc(24px * 0.25);
    height: calc(var(--spacer-sm-l) * 0.25);
    margin-left: calc(24px * 0.25);
    margin-left: calc(var(--spacer-sm-l) * 0.25);
    display: none;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(28px * 0.25);
    width: calc(var(--spacer-md) * 0.25);
    height: calc(28px * 0.25);
    height: calc(var(--spacer-md) * 0.25);
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(32px * 0.25);
    width: calc(var(--spacer-lg) * 0.25);
    height: calc(32px * 0.25);
    height: calc(var(--spacer-lg) * 0.25);
    margin-left: calc(32px * 0.25);
    margin-left: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher li.active a:after {
    width: calc(36px * 0.25);
    width: calc(var(--spacer-xl) * 0.25);
    height: calc(36px * 0.25);
    height: calc(var(--spacer-xl) * 0.25);
    margin-left: calc(36px * 0.25);
    margin-left: calc(var(--spacer-xl) * 0.25);
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher li a {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li.active {
  border-bottom: 2px solid white;
  background: rgba(255, 167, 0, 1) !important;
  background: rgba(var(--color-secondary-500), 1) !important;
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li.active a {
  color: white !important;
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
  display: flex;
  background: rgb(255, 255, 255);
  background: rgb(var(--color-primary-contrast-500));
  color: rgba(56, 64, 67, 1);
  color: rgba(var(--color-primary-500), 1);
  top: 100%;
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active):hover {
  background: rgba(255, 167, 0, 1);
  background: rgba(var(--color-secondary-500), 1);
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active):hover a, #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active):hover a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) {
    top: 100%;
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
  top: calc(100% + calc(32px * 1));
  top: calc(100% + calc(var(--spacer-default) * 1));
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 1));
    top: calc(100% + calc(var(--spacer-xs) * 1));
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 1));
    top: calc(100% + calc(var(--spacer-xs-l) * 1));
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 1));
    top: calc(100% + calc(var(--spacer-sm) * 1));
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(24px * 1));
    top: calc(100% + calc(var(--spacer-sm-l) * 1));
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 1));
    top: calc(100% + calc(var(--spacer-md) * 1));
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(32px * 1));
    top: calc(100% + calc(var(--spacer-lg) * 1));
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(36px * 1));
    top: calc(100% + calc(var(--spacer-xl) * 1));
  }
}
#main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
  top: calc(100% + calc(32px * 2));
  top: calc(100% + calc(var(--spacer-default) * 2));
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 2));
    top: calc(100% + calc(var(--spacer-xs) * 2));
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 2));
    top: calc(100% + calc(var(--spacer-xs-l) * 2));
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 2));
    top: calc(100% + calc(var(--spacer-sm) * 2));
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(24px * 2));
    top: calc(100% + calc(var(--spacer-sm-l) * 2));
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(28px * 2));
    top: calc(100% + calc(var(--spacer-md) * 2));
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(32px * 2));
    top: calc(100% + calc(var(--spacer-lg) * 2));
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #top-menu .menu-wrapper .lang-switcher:hover li:not(.active) ~ li:not(.active) ~ li:not(.active) {
    top: calc(100% + calc(36px * 2));
    top: calc(100% + calc(var(--spacer-xl) * 2));
  }
}
#main-header #top-menu .menu-wrapper .dropdown-trigger {
  position: relative;
  display: flex;
  align-items: center;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger {
    justify-content: center;
    flex-direction: column;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger {
    justify-content: center;
    flex-direction: column;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger {
    justify-content: center;
    flex-direction: column;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger {
    justify-content: center;
    flex-direction: column;
  }
}
#main-header #top-menu .menu-wrapper .dropdown-trigger:hover .dropdown-menu {
  display: flex;
}
#main-header #top-menu .menu-wrapper .dropdown-trigger:after {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger:after {
    display: none;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger:after {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger:after {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .dropdown-trigger:after {
    display: none;
  }
}
#main-header #top-menu .menu-wrapper .dropdown-menu {
  display: none;
  flex-direction: column;
  position: absolute;
  top: 100%;
  z-index: 1;
  background-color: white;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .dropdown-menu {
    background-color: inherit;
    position: relative;
    align-items: center;
    justify-content: center;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .dropdown-menu {
    background-color: inherit;
    position: relative;
    align-items: center;
    justify-content: center;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper .dropdown-menu {
    background-color: inherit;
    position: relative;
    align-items: center;
    justify-content: center;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper .dropdown-menu {
    background-color: inherit;
    position: relative;
    align-items: center;
    justify-content: center;
  }
}
#main-header #top-menu .menu-wrapper .dropdown-menu li a {
  white-space: nowrap;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    display: flex;
    flex-direction: column;
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    display: flex;
    flex-direction: column;
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    display: flex;
    flex-direction: column;
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    display: flex;
    flex-direction: column;
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #top-menu .menu-wrapper ul#item-list {
    margin: 0;
  }
}
#main-header #primary-menu {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  transition: all 0.666s ease 0s;
  height: calc(32px * 5);
  height: calc(var(--spacer-default) * 5);
  width: 100%;
}
body.scrolled #main-header #primary-menu {
  transition: all 0.666s ease 0s;
}
body.scrolled #main-header #primary-menu {
  height: calc(32px * 3);
  height: calc(var(--spacer-default) * 3);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu {
    height: calc(28px * 5);
    height: calc(var(--spacer-xs) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs) * 3);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu {
    height: calc(28px * 5);
    height: calc(var(--spacer-xs-l) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs-l) * 3);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu {
    height: calc(28px * 5);
    height: calc(var(--spacer-sm) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(28px * 3);
    height: calc(var(--spacer-sm) * 3);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu {
    height: calc(24px * 5);
    height: calc(var(--spacer-sm-l) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(24px * 3);
    height: calc(var(--spacer-sm-l) * 3);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu {
    height: calc(28px * 5);
    height: calc(var(--spacer-md) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(28px * 3);
    height: calc(var(--spacer-md) * 3);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #primary-menu {
    height: calc(32px * 5);
    height: calc(var(--spacer-lg) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(32px * 3);
    height: calc(var(--spacer-lg) * 3);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #primary-menu {
    height: calc(36px * 5);
    height: calc(var(--spacer-xl) * 5);
    width: 100%;
  }
  body.scrolled #main-header #primary-menu {
    height: calc(36px * 3);
    height: calc(var(--spacer-xl) * 3);
  }
}
#main-header #primary-menu > .container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-wrapper {
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-wrapper {
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-wrapper {
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-wrapper {
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #primary-menu .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #primary-menu .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #primary-menu .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container {
    display: none;
  }
  .primary-menu-active #main-header #primary-menu .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  .primary-menu-active #main-header #primary-menu .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .primary-menu-active #main-header #primary-menu .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .primary-menu-active #main-header #primary-menu .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .primary-menu-active #main-header #primary-menu .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  .primary-menu-active #main-header #primary-menu .menu-container ul li {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .primary-menu-active #main-header #primary-menu .menu-container ul li {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .primary-menu-active #main-header #primary-menu .menu-container ul li {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .primary-menu-active #main-header #primary-menu .menu-container ul li {
    margin: calc(24px * 0.5);
    margin: calc(var(--spacer-sm-l) * 0.5);
  }
}
#main-header #primary-menu .menu-container ul li.disabled a {
  opacity: 0.5;
  pointer-events: none;
}
#main-header #primary-menu .menu-container ul li > a {
  margin: 0 calc(32px * 0.66);
  margin: 0 calc(var(--spacer-default) * 0.66);
  padding: calc(32px * 0.25) 0;
  padding: calc(var(--spacer-default) * 0.25) 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(28px * 0.66);
    margin: 0 calc(var(--spacer-xs) * 0.66);
    padding: calc(28px * 0.25) 0;
    padding: calc(var(--spacer-xs) * 0.25) 0;
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-xs) * 0.125) 0;
  }
  .primary-menu-active #main-header #primary-menu .menu-container ul li > a {
    font-size: 1.2rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(28px * 0.66);
    margin: 0 calc(var(--spacer-xs-l) * 0.66);
    padding: calc(28px * 0.25) 0;
    padding: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-xs-l) * 0.125) 0;
  }
  .primary-menu-active #main-header #primary-menu .menu-container ul li > a {
    font-size: 1.2rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(28px * 0.66);
    margin: 0 calc(var(--spacer-sm) * 0.66);
    padding: calc(28px * 0.25) 0;
    padding: calc(var(--spacer-sm) * 0.25) 0;
    padding: calc(28px * 0.125) 0;
    padding: calc(var(--spacer-sm) * 0.125) 0;
  }
  .primary-menu-active #main-header #primary-menu .menu-container ul li > a {
    font-size: 1.2rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(24px * 0.66);
    margin: 0 calc(var(--spacer-sm-l) * 0.66);
    padding: calc(24px * 0.25) 0;
    padding: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: calc(24px * 0.125) 0;
    padding: calc(var(--spacer-sm-l) * 0.125) 0;
  }
  .primary-menu-active #main-header #primary-menu .menu-container ul li > a {
    font-size: 1.2rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(28px * 0.66);
    margin: 0 calc(var(--spacer-md) * 0.66);
    padding: calc(28px * 0.25) 0;
    padding: calc(var(--spacer-md) * 0.25) 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(32px * 0.66);
    margin: 0 calc(var(--spacer-lg) * 0.66);
    padding: calc(32px * 0.25) 0;
    padding: calc(var(--spacer-lg) * 0.25) 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container ul li > a {
    margin: 0 calc(36px * 0.66);
    margin: 0 calc(var(--spacer-xl) * 0.66);
    padding: calc(36px * 0.25) 0;
    padding: calc(var(--spacer-xl) * 0.25) 0;
  }
}
#main-header #primary-menu .menu-container > ul#navigation > li {
  align-items: center;
}
#main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
  position: relative;
  color: white !important;
  padding: calc(32px * 0.5) 0;
  padding: calc(var(--spacer-default) * 0.5) 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-xs) * 0.5) 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-xs-l) * 0.5) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-sm) * 0.5) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(24px * 0.5) 0;
    padding: calc(var(--spacer-sm-l) * 0.5) 0;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(28px * 0.5) 0;
    padding: calc(var(--spacer-md) * 0.5) 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(32px * 0.5) 0;
    padding: calc(var(--spacer-lg) * 0.5) 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container > ul#navigation > li:last-child > a {
    padding: calc(36px * 0.5) 0;
    padding: calc(var(--spacer-xl) * 0.5) 0;
  }
}
#main-header #primary-menu .menu-container > ul#navigation > li:last-child > a:after {
  content: "";
  background: url("/site-content/themes/theme-zambla/static/medias/underline.svg") center center no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0px;
  height: 10px;
  width: 100%;
}
#main-header #primary-menu .menu-container .js-dropdown-menu a:after {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: white;
  margin-left: 6px;
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown {
  pointer-events: none;
  opacity: 0;
  left: 0;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: nowrap;
  transition: opacity 0.3s ease;
  width: 100%;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown {
    z-index: 1;
    top: 0;
    bottom: 0;
    position: fixed;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown {
    z-index: 1;
    top: 0;
    bottom: 0;
    position: fixed;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown {
    z-index: 1;
    top: 0;
    bottom: 0;
    position: fixed;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown {
    z-index: 1;
    top: 0;
    bottom: 0;
    position: fixed;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown {
    z-index: -1;
    top: 100%;
  }
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
  position: relative;
  background: #ffffff;
  padding: calc(32px * 1);
  padding: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
    width: 100%;
    height: 100vh;
    overflow: auto;
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs) * 4);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs-l) * 1);
    width: 100%;
    height: 100vh;
    overflow: auto;
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs-l) * 4);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-sm) * 1);
    width: 100%;
    height: 100vh;
    overflow: auto;
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-sm) * 4);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(24px * 1);
    padding: calc(var(--spacer-sm-l) * 1);
    width: 100%;
    height: 100vh;
    overflow: auto;
    padding-top: calc(24px * 4);
    padding-top: calc(var(--spacer-sm-l) * 4);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-md) * 1);
    box-shadow: 0 0 calc(36px * 0.5) rgba(0, 0, 0, 0.11);
    box-shadow: 0 0 calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.11);
    border-radius: 0 0 calc(28px * 0.5) calc(28px * 0.5);
    border-radius: 0 0 calc(var(--spacer-md) * 0.5) calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(32px * 1);
    padding: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container {
    padding: calc(36px * 1);
    padding: calc(var(--spacer-xl) * 1);
  }
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
  position: absolute;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  top: 0;
  right: 0;
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
  width: calc(32px * 2);
  width: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
    display: none;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
    display: none;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown > .container .close {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
  }
}
nav.navigation-archive .menu-item.active .dropdown {
  display: flex;
}

#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown p.h4 {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items {
    padding: 0;
    max-height: calc(28px * 14);
    max-height: calc(var(--spacer-md) * 14);
    overflow: auto;
  }
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li {
  height: auto;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li {
    max-width: initial;
    width: 100%;
    margin: 0 !important;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li {
    max-width: initial;
    width: 100%;
    margin: 0 !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li {
    max-width: initial;
    width: 100%;
    margin: 0 !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li {
    max-width: initial;
    width: 100%;
    margin: 0 !important;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li {
    width: 50%;
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--spacer-md) * 0.5);
  }
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a {
  color: rgba(56, 64, 67, 1);
  color: var(--text-color-default);
  display: block;
  border-bottom: 1px solid rgba(255, 255, 255, 1);
  border-bottom: 1px solid rgba(var(--color-gray-200), 1);
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a {
    padding: calc(28px * 0.5) 0 !important;
    padding: calc(var(--spacer-xs) * 0.5) 0 !important;
    margin: 0 !important;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a {
    padding: calc(28px * 0.5) 0 !important;
    padding: calc(var(--spacer-xs-l) * 0.5) 0 !important;
    margin: 0 !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a {
    padding: calc(28px * 0.5) 0 !important;
    padding: calc(var(--spacer-sm) * 0.5) 0 !important;
    margin: 0 !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a {
    padding: calc(24px * 0.5) 0 !important;
    padding: calc(var(--spacer-sm-l) * 0.5) 0 !important;
    margin: 0 !important;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a {
    padding: calc(28px * 0.5) 0 !important;
    padding: calc(var(--spacer-md) * 0.5) 0 !important;
  }
}
#main-header #primary-menu .menu-container .js-dropdown-menu .dropdown .page-items li > a.active {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
#main-header #primary-menu .menu-container .js-dropdown-menu.dropdown-active {
  background-color: white;
  padding: 0 calc(36px * 0.4);
  padding: 0 calc(var(--spacer-xl) * 0.4);
}
#main-header #primary-menu .menu-container .js-dropdown-menu.dropdown-active > a {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
#main-header #primary-menu .menu-container .js-dropdown-menu.dropdown-active > a:after {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
#main-header #primary-menu .menu-container .js-dropdown-menu.dropdown-active .dropdown {
  pointer-events: all;
  opacity: 1;
  transition: opacity 0.3s ease;
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #primary-menu .menu-container .js-dropdown-menu.dropdown-active .dropdown:after {
    content: "";
    background: rgba(0, 0, 0, 0.3);
    position: fixed;
    top: 50px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
  }
}
#main-header #primary-menu .menu-container .js-dropdown-menu.dropdown-active .dropdown .left-dropdown p {
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
}
#main-header .menu-container > ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 100%;
}
#main-header .menu-container > ul li {
  display: flex;
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header .menu-container > ul li {
    height: 100%;
  }
}
#main-header .menu-container > ul li.active > a:not(.btn) {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
#main-header .menu-container > ul li > a {
  display: flex;
  align-items: center;
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
#main-header .menu-container > ul li > a:hover {
  color: rgba(255, 167, 0, 1) !important;
  color: rgba(var(--color-secondary-500), 1) !important;
}
#main-header button.hamburger-toggle {
  z-index: 1000;
  display: none;
  cursor: pointer;
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
  right: calc(32px * 1);
  right: calc(var(--spacer-default) * 1);
  transition: all 0.666s ease 0s;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header button.hamburger-toggle {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
    right: calc(28px * 1);
    right: calc(var(--spacer-xs) * 1);
    transition: all 0.666s ease 0s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: calc(28px * 0.75);
    margin-left: calc(var(--spacer-xs) * 0.75);
    position: fixed;
    top: calc(28px * 1);
    top: calc(var(--spacer-xs) * 1);
  }
  body.scrolled #main-header button.hamburger-toggle {
    top: calc(28px * 0.5);
    top: calc(var(--spacer-xs) * 0.5);
    transition: all 0.666s ease 0s;
  }
  #main-header button.hamburger-toggle svg {
    width: 32px;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header button.hamburger-toggle {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
    right: calc(28px * 1);
    right: calc(var(--spacer-xs-l) * 1);
    transition: all 0.666s ease 0s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: calc(28px * 0.75);
    margin-left: calc(var(--spacer-xs-l) * 0.75);
    position: fixed;
    top: calc(28px * 1);
    top: calc(var(--spacer-xs-l) * 1);
  }
  body.scrolled #main-header button.hamburger-toggle {
    top: calc(28px * 0.5);
    top: calc(var(--spacer-xs-l) * 0.5);
    transition: all 0.666s ease 0s;
  }
  #main-header button.hamburger-toggle svg {
    width: 32px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header button.hamburger-toggle {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
    right: calc(28px * 1);
    right: calc(var(--spacer-sm) * 1);
    transition: all 0.666s ease 0s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: calc(28px * 0.75);
    margin-left: calc(var(--spacer-sm) * 0.75);
    position: fixed;
    top: calc(28px * 1);
    top: calc(var(--spacer-sm) * 1);
  }
  body.scrolled #main-header button.hamburger-toggle {
    top: calc(28px * 0.5);
    top: calc(var(--spacer-sm) * 0.5);
    transition: all 0.666s ease 0s;
  }
  #main-header button.hamburger-toggle svg {
    width: 32px;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header button.hamburger-toggle {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
    right: calc(24px * 1);
    right: calc(var(--spacer-sm-l) * 1);
    transition: all 0.666s ease 0s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: calc(24px * 0.75);
    margin-left: calc(var(--spacer-sm-l) * 0.75);
    position: fixed;
    top: calc(24px * 1);
    top: calc(var(--spacer-sm-l) * 1);
  }
  body.scrolled #main-header button.hamburger-toggle {
    top: calc(24px * 0.5);
    top: calc(var(--spacer-sm-l) * 0.5);
    transition: all 0.666s ease 0s;
  }
  #main-header button.hamburger-toggle svg {
    width: 32px;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header button.hamburger-toggle {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
    right: calc(28px * 1);
    right: calc(var(--spacer-md) * 1);
    transition: all 0.666s ease 0s;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header button.hamburger-toggle {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
    right: calc(32px * 1);
    right: calc(var(--spacer-lg) * 1);
    transition: all 0.666s ease 0s;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header button.hamburger-toggle {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
    right: calc(36px * 1);
    right: calc(var(--spacer-xl) * 1);
    transition: all 0.666s ease 0s;
  }
}
#main-header button.hamburger-toggle .line {
  fill: none;
  stroke-width: 6;
  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1), stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
  stroke: rgb(255, 255, 255);
  stroke: rgb(var(--color-primary-contrast-500));
}
#main-header button.hamburger-toggle .line1 {
  stroke-dasharray: 60 207;
  stroke-width: 6;
  stroke-linecap: round;
}
#main-header button.hamburger-toggle .line2 {
  stroke-dasharray: 60 60;
  stroke-width: 6;
  stroke-linecap: round;
}
#main-header button.hamburger-toggle .line3 {
  stroke-dasharray: 60 207;
  stroke-width: 6;
  stroke-linecap: round;
}
.primary-menu-active #main-header button.hamburger-toggle {
  margin-right: 6px;
}
.primary-menu-active #main-header button.hamburger-toggle .line1 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 6;
}
.primary-menu-active #main-header button.hamburger-toggle .line2 {
  stroke-dasharray: 1 60;
  stroke-dashoffset: -30;
  stroke-width: 6;
}
.primary-menu-active #main-header button.hamburger-toggle .line3 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 6;
}
.secondary-menu-active #main-header button.hamburger-toggle .line {
  stroke: rgba(56, 64, 67, 1);
  stroke: rgba(var(--color-primary-500), 1);
}

html.primary-menu-active {
  overflow: hidden;
  height: 100vh;
}

.scroll-to-top {
  position: fixed;
  bottom: 0%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: right 0.66s ease;
  width: calc(32px * 1.5);
  width: calc(var(--spacer-default) * 1.5);
  height: calc(32px * 1.5);
  height: calc(var(--spacer-default) * 1.5);
  right: calc(32px * -1.5);
  right: calc(var(--spacer-default) * -1.5);
}
.scroll-to-top:after {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  text-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.11);
  text-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.11);
  font-size: calc(32px * 1);
  font-size: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .scroll-to-top:after {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top:after {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .scroll-to-top:after {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top:after {
    font-size: calc(24px * 1);
    font-size: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .scroll-to-top:after {
    font-size: calc(28px * 1);
    font-size: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .scroll-to-top:after {
    font-size: calc(32px * 1);
    font-size: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .scroll-to-top:after {
    font-size: calc(36px * 1);
    font-size: calc(var(--spacer-xl) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-xs) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-xs) * -1.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-xs-l) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs-l) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-xs-l) * -1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-sm) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-sm) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-sm) * -1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top {
    width: calc(24px * 1.5);
    width: calc(var(--spacer-sm-l) * 1.5);
    height: calc(24px * 1.5);
    height: calc(var(--spacer-sm-l) * 1.5);
    right: calc(24px * -1.5);
    right: calc(var(--spacer-sm-l) * -1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-md) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-md) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-md) * -1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .scroll-to-top {
    width: calc(32px * 1.5);
    width: calc(var(--spacer-lg) * 1.5);
    height: calc(32px * 1.5);
    height: calc(var(--spacer-lg) * 1.5);
    right: calc(32px * -1.5);
    right: calc(var(--spacer-lg) * -1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .scroll-to-top {
    width: calc(36px * 1.5);
    width: calc(var(--spacer-xl) * 1.5);
    height: calc(36px * 1.5);
    height: calc(var(--spacer-xl) * 1.5);
    right: calc(36px * -1.5);
    right: calc(var(--spacer-xl) * -1.5);
  }
}
body.scrolled .scroll-to-top {
  right: 0;
  transition: right 0.66s ease;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .primary-menu-active .scroll-to-top {
    right: calc(28px * -1.5) !important;
    right: calc(var(--spacer-xs) * -1.5) !important;
    transition: right 0.66s ease;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .primary-menu-active .scroll-to-top {
    right: calc(28px * -1.5) !important;
    right: calc(var(--spacer-xs-l) * -1.5) !important;
    transition: right 0.66s ease;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .primary-menu-active .scroll-to-top {
    right: calc(28px * -1.5) !important;
    right: calc(var(--spacer-sm) * -1.5) !important;
    transition: right 0.66s ease;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .primary-menu-active .scroll-to-top {
    right: calc(24px * -1.5) !important;
    right: calc(var(--spacer-sm-l) * -1.5) !important;
    transition: right 0.66s ease;
  }
}
section.flexible-section {
  position: relative;
  background-color: #ffffff;
  background-color: var(--bg-light-default);
  color: rgba(56, 64, 67, 1);
  color: var(--text-color-default);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding-top: calc(32px * 5);
  padding-top: calc(var(--spacer-default) * 5);
  padding-bottom: calc(32px * 5);
  padding-bottom: calc(var(--spacer-default) * 5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section {
    min-height: 100vh;
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section {
    min-height: 100vh;
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section {
    min-height: 100vh;
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
  }
}
section.flexible-section.dark {
  background-color: #384043;
  background-color: var(--bg-dark-default);
  color: white;
}
section.flexible-section.dark * {
  color: white;
}
section.flexible-section.medium {
  background-color: rgba(237, 238, 238, 1);
  background-color: var(--bg-medium-default);
}
section.flexible-section .container {
  min-height: 0;
}
section.flexible-section * {
  color: rgba(56, 64, 67, 1);
  color: var(--text-color-default);
}
section.flexible-section a:hover, section.flexible-section a:hover * {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
section.flexible-section.section-steps .number {
  font-size: 10rem;
  line-height: 1;
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
  font-family: 'Dry-Brush', cursive;
  font-family: var(--font-third);
  margin-bottom: 0px;
}
section.flexible-section.section-steps-full > article {
  width: 100%;
  position: relative;
  min-height: 100vh;
  padding-left: calc(32px * 2);
  padding-left: calc(var(--spacer-default) * 2);
  padding-right: calc(32px * 2);
  padding-right: calc(var(--spacer-default) * 2);
  padding-bottom: calc(32px * 4);
  padding-bottom: calc(var(--spacer-default) * 4);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs) * 2);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs) * 4);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs-l) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs-l) * 2);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs-l) * 4);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-sm) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-sm) * 2);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-sm) * 4);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(24px * 2);
    padding-left: calc(var(--spacer-sm-l) * 2);
    padding-right: calc(24px * 2);
    padding-right: calc(var(--spacer-sm-l) * 2);
    padding-bottom: calc(24px * 4);
    padding-bottom: calc(var(--spacer-sm-l) * 4);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-md) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-md) * 2);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-md) * 4);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(32px * 2);
    padding-left: calc(var(--spacer-lg) * 2);
    padding-right: calc(32px * 2);
    padding-right: calc(var(--spacer-lg) * 2);
    padding-bottom: calc(32px * 4);
    padding-bottom: calc(var(--spacer-lg) * 4);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article {
    min-height: 100vh;
    padding-left: calc(36px * 2);
    padding-left: calc(var(--spacer-xl) * 2);
    padding-right: calc(36px * 2);
    padding-right: calc(var(--spacer-xl) * 2);
    padding-bottom: calc(36px * 4);
    padding-bottom: calc(var(--spacer-xl) * 4);
  }
}
section.flexible-section.section-steps-full > article:first-of-type {
  min-height: calc(100vh - calc(32px * 5));
  min-height: calc(100vh - calc(var(--spacer-default) * 5));
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(28px * 5));
    min-height: calc(100vh - calc(var(--spacer-xs) * 5));
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(28px * 5));
    min-height: calc(100vh - calc(var(--spacer-xs-l) * 5));
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(28px * 5));
    min-height: calc(100vh - calc(var(--spacer-sm) * 5));
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(24px * 5));
    min-height: calc(100vh - calc(var(--spacer-sm-l) * 5));
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(28px * 5));
    min-height: calc(100vh - calc(var(--spacer-md) * 5));
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(32px * 5));
    min-height: calc(100vh - calc(var(--spacer-lg) * 5));
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article:first-of-type {
    min-height: calc(100vh - calc(36px * 5));
    min-height: calc(100vh - calc(var(--spacer-xl) * 5));
  }
}
section.flexible-section.section-steps-full > article:not(:first-of-type) {
  padding-top: calc(32px * 5);
  padding-top: calc(var(--spacer-default) * 5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full > article:not(:first-of-type) {
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
  }
}
section.flexible-section.section-steps-full > article:last-of-type {
  min-height: 0;
}
section.flexible-section.section-steps-full > article > img {
  max-height: calc(36px * 12);
  max-height: calc(var(--spacer-xl) * 12);
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full > article [class*=icon-chevron] {
    transform: rotate(90deg);
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }
}
section.flexible-section.section-steps-full .substep .h1 {
  font-size: 6rem;
  line-height: 1;
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
  font-family: 'Dry-Brush', cursive;
  font-family: var(--font-third);
  margin-bottom: 0px;
}
section.flexible-section.section-steps-full .substep p {
  max-width: calc(32px * 8);
  max-width: calc(var(--spacer-default) * 8);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(28px * 12);
    max-width: calc(var(--spacer-xs) * 12);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(28px * 8);
    max-width: calc(var(--spacer-xs-l) * 8);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(28px * 8);
    max-width: calc(var(--spacer-sm) * 8);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(24px * 8);
    max-width: calc(var(--spacer-sm-l) * 8);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(28px * 8);
    max-width: calc(var(--spacer-md) * 8);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(32px * 8);
    max-width: calc(var(--spacer-lg) * 8);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-steps-full .substep p {
    max-width: calc(36px * 8);
    max-width: calc(var(--spacer-xl) * 8);
  }
}
@-webkit-keyframes squiggle {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes squiggle {
  to {
    stroke-dashoffset: 0;
  }
}
section.flexible-section.section-squiggle #squiggle-svg {
  stroke-dasharray: 50000;
  stroke-dashoffset: 50000;
  width: 100%;
}
section.flexible-section.section-squiggle [data-aos=squiggle-ready].aos-animate #squiggle-svg {
  -webkit-animation: squiggle 24s forwards infinite ease-out;
          animation: squiggle 24s forwards infinite ease-out;
}
section.flexible-section.section-team .carousel-team {
  position: relative;
}
section.flexible-section.section-team .swipper-navi {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
  line-height: calc(32px * 2);
  line-height: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
    line-height: calc(24px * 2);
    line-height: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
    line-height: calc(32px * 2);
    line-height: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-team .swipper-navi {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
    line-height: calc(36px * 2);
    line-height: calc(var(--spacer-xl) * 2);
  }
}
section.flexible-section.section-team .swiper-pagination-bullets {
  bottom: calc(32px * 3);
  bottom: calc(var(--spacer-default) * 3);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(28px * 3);
    bottom: calc(var(--spacer-xs) * 3);
    bottom: calc(28px * 2);
    bottom: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(28px * 3);
    bottom: calc(var(--spacer-xs-l) * 3);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(28px * 3);
    bottom: calc(var(--spacer-sm) * 3);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(24px * 3);
    bottom: calc(var(--spacer-sm-l) * 3);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(28px * 3);
    bottom: calc(var(--spacer-md) * 3);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(32px * 3);
    bottom: calc(var(--spacer-lg) * 3);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-team .swiper-pagination-bullets {
    bottom: calc(36px * 3);
    bottom: calc(var(--spacer-xl) * 3);
  }
}
section.flexible-section.section-team .swiper-pagination-bullet {
  background: white;
  opacity: 0.33;
}
section.flexible-section.section-team .swiper-pagination-bullet-active {
  opacity: 1;
}
section.flexible-section.section-team .team-member-info {
  padding: 0 calc(32px * 2);
  padding: 0 calc(var(--spacer-default) * 2);
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
  line-height: calc(32px * 2);
  line-height: calc(var(--spacer-default) * 2);
  margin-top: calc(32px * 2);
  margin-top: calc(var(--spacer-default) * 2);
}
section.flexible-section.section-team .team-member-info > * {
  margin: 0 calc(32px * 1);
  margin: 0 calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(28px * 1);
    margin: 0 calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(28px * 1);
    margin: 0 calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(28px * 1);
    margin: 0 calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(24px * 1);
    margin: 0 calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(28px * 1);
    margin: 0 calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(32px * 1);
    margin: 0 calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-team .team-member-info > * {
    margin: 0 calc(36px * 1);
    margin: 0 calc(var(--spacer-xl) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(28px * 2);
    padding: 0 calc(var(--spacer-xs) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-xs) * 2);
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs) * 2);
    height: auto !important;
    line-height: inherit !important;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(28px * 2);
    padding: 0 calc(var(--spacer-xs-l) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-xs-l) * 2);
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(28px * 2);
    padding: 0 calc(var(--spacer-sm) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-sm) * 2);
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(24px * 2);
    padding: 0 calc(var(--spacer-sm-l) * 2);
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
    line-height: calc(24px * 2);
    line-height: calc(var(--spacer-sm-l) * 2);
    margin-top: calc(24px * 2);
    margin-top: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(28px * 2);
    padding: 0 calc(var(--spacer-md) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-md) * 2);
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(32px * 2);
    padding: 0 calc(var(--spacer-lg) * 2);
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
    line-height: calc(32px * 2);
    line-height: calc(var(--spacer-lg) * 2);
    margin-top: calc(32px * 2);
    margin-top: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-team .team-member-info {
    padding: 0 calc(36px * 2);
    padding: 0 calc(var(--spacer-xl) * 2);
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
    line-height: calc(36px * 2);
    line-height: calc(var(--spacer-xl) * 2);
    margin-top: calc(36px * 2);
    margin-top: calc(var(--spacer-xl) * 2);
  }
}
section.flexible-section.section-numbers .number p.h1 {
  font-size: 10rem;
  line-height: 1;
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
  font-family: 'Dry-Brush', cursive;
  font-family: var(--font-third);
  margin-bottom: 0px;
}
section.flexible-section.section-image {
  position: relative;
  transition: all 0.666s ease 0s;
}
section.flexible-section.section-image:not(.enlarged) {
  min-height: 33vh;
  background-clip: content-box;
  padding: 0 calc(32px * 1.5) calc(32px * 1.5) calc(32px * 1.5);
  padding: 0 calc(var(--spacer-default) * 1.5) calc(var(--spacer-default) * 1.5) calc(var(--spacer-default) * 1.5);
  transition: all 0.666s ease 0s;
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(28px * 1.5) calc(28px * 1.5) calc(28px * 1.5);
    padding: 0 calc(var(--spacer-xs) * 1.5) calc(var(--spacer-xs) * 1.5) calc(var(--spacer-xs) * 1.5);
    min-height: 20vh;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(28px * 1.5) calc(28px * 1.5) calc(28px * 1.5);
    padding: 0 calc(var(--spacer-xs-l) * 1.5) calc(var(--spacer-xs-l) * 1.5) calc(var(--spacer-xs-l) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(28px * 1.5) calc(28px * 1.5) calc(28px * 1.5);
    padding: 0 calc(var(--spacer-sm) * 1.5) calc(var(--spacer-sm) * 1.5) calc(var(--spacer-sm) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(24px * 1.5) calc(24px * 1.5) calc(24px * 1.5);
    padding: 0 calc(var(--spacer-sm-l) * 1.5) calc(var(--spacer-sm-l) * 1.5) calc(var(--spacer-sm-l) * 1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(28px * 1.5) calc(28px * 1.5) calc(28px * 1.5);
    padding: 0 calc(var(--spacer-md) * 1.5) calc(var(--spacer-md) * 1.5) calc(var(--spacer-md) * 1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(32px * 1.5) calc(32px * 1.5) calc(32px * 1.5);
    padding: 0 calc(var(--spacer-lg) * 1.5) calc(var(--spacer-lg) * 1.5) calc(var(--spacer-lg) * 1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-image:not(.enlarged) {
    padding: 0 calc(36px * 1.5) calc(36px * 1.5) calc(36px * 1.5);
    padding: 0 calc(var(--spacer-xl) * 1.5) calc(var(--spacer-xl) * 1.5) calc(var(--spacer-xl) * 1.5);
  }
}
section.flexible-section.section-image:not(.enlarged) button.enlarge {
  color: white;
}
section.flexible-section.section-image:not(.enlarged) button.close {
  display: none;
}
section.flexible-section.section-image.enlarged {
  transition: all 0.666s ease 0s;
}
section.flexible-section.section-image.enlarged button.enlarge {
  display: none;
}
section.flexible-section.section-image.enlarged button.close {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  width: calc(32px * 2);
  width: calc(var(--spacer-default) * 2);
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
}
section.flexible-section.section-image.enlarged button.close:after {
  display: none !important;
}
@media (min-width: 0px) and (max-width: 1200px) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  section.flexible-section.section-image.enlarged button.close {
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
  }
}
section.flexible-section.section-image.enlarged button.close [class*=icon-] {
  color: white;
}

body.content-workshop section.full-section {
  position: relative;
  background-color: #ffffff;
  background-color: var(--bg-light-default);
  color: rgba(56, 64, 67, 1);
  color: var(--text-color-default);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding-top: calc(32px * 5);
  padding-top: calc(var(--spacer-default) * 5);
  padding-bottom: calc(32px * 5);
  padding-bottom: calc(var(--spacer-default) * 5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body.content-workshop section.full-section {
    min-height: 100vh;
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
  }
}
body.content-workshop section.full-section.dark {
  background-color: #384043;
  background-color: var(--bg-dark-default);
  color: white;
}
body.content-workshop section.full-section.dark * {
  color: white;
}
body.content-workshop section.full-section.medium {
  background-color: rgba(237, 238, 238, 1);
  background-color: var(--bg-medium-default);
}
body.content-workshop section.full-section .container {
  min-height: 0;
}
body.content-workshop section.full-section * {
  color: rgba(56, 64, 67, 1);
  color: var(--text-color-default);
}
body.content-workshop section.full-section a:hover, body.content-workshop section.full-section a:hover * {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}

body.post-type-archive-works option.hidden {
  color: rgba(194, 198, 199, 1);
  color: rgba(var(--color-gray-500), 1);
  pointer-events: none;
  display: block !important;
}
body.post-type-archive-works article.template-archive {
  background-color: rgba(237, 238, 238, 1);
  background-color: var(--bg-medium-default);
}
body.post-type-archive-works #entry-content + .scroll-down {
  background-color: rgba(237, 238, 238, 1);
  background-color: var(--bg-medium-default);
}

@media (min-width: 0px) and (max-width: 1200px) {
  body.content-workshop section.team .circle-brush {
    max-width: 480px;
    margin: 0 auto;
  }
}
header.header-archive {
  position: relative;
  background-color: rgba(56, 64, 67, 1);
  background-color: rgba(var(--color-primary-500), 1);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  margin-top: calc(32px * 2);
  margin-top: calc(var(--spacer-default) * 2);
  padding-top: calc(32px * 4);
  padding-top: calc(var(--spacer-default) * 4);
  padding-bottom: calc(32px * 4);
  padding-bottom: calc(var(--spacer-default) * 4);
}
header.header-archive.with-back {
  min-height: 66.6vh;
}
header.header-archive .header-container {
  width: 100%;
}
@media (min-width: 0px) and (max-width: 1200px) {
  header.header-archive .header-container {
    display: flex;
    flex-direction: column-reverse;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  header.header-archive .header-container {
    display: flex;
    flex-direction: column-reverse;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  header.header-archive .header-container {
    display: flex;
    flex-direction: column-reverse;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  header.header-archive .header-container {
    display: flex;
    flex-direction: column-reverse;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  header.header-archive {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs) * 2);
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs) * 4);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  header.header-archive {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs-l) * 2);
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs-l) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs-l) * 4);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  header.header-archive {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-sm) * 2);
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-sm) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-sm) * 4);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  header.header-archive {
    margin-top: calc(24px * 2);
    margin-top: calc(var(--spacer-sm-l) * 2);
    padding-top: calc(24px * 4);
    padding-top: calc(var(--spacer-sm-l) * 4);
    padding-bottom: calc(24px * 4);
    padding-bottom: calc(var(--spacer-sm-l) * 4);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  header.header-archive {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-md) * 2);
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-md) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-md) * 4);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  header.header-archive {
    margin-top: calc(32px * 2);
    margin-top: calc(var(--spacer-lg) * 2);
    padding-top: calc(32px * 4);
    padding-top: calc(var(--spacer-lg) * 4);
    padding-bottom: calc(32px * 4);
    padding-bottom: calc(var(--spacer-lg) * 4);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  header.header-archive {
    margin-top: calc(36px * 2);
    margin-top: calc(var(--spacer-xl) * 2);
    padding-top: calc(36px * 4);
    padding-top: calc(var(--spacer-xl) * 4);
    padding-bottom: calc(36px * 4);
    padding-bottom: calc(var(--spacer-xl) * 4);
  }
}
header.header-archive .header-container .h3 {
  color: rgba(255, 167, 0, 1) !important;
  color: rgba(var(--color-secondary-500), 1) !important;
}
header.header-archive .header-container h1, header.header-archive .header-container p {
  color: rgb(255, 255, 255) !important;
  color: rgb(var(--color-primary-contrast-500)) !important;
}
header.header-archive .header-container .btn {
  color: rgb(255, 255, 255) !important;
  color: rgb(var(--color-primary-contrast-500)) !important;
  padding: 0;
}
header.header-archive .header-container .btn:hover {
  color: rgba(255, 167, 0, 1) !important;
  color: rgba(var(--color-secondary-500), 1) !important;
}
header.header-archive .background-image-header {
  position: absolute;
  right: 0;
  width: 50%;
  margin: 5%;
  bottom: 0;
  top: 0;
  z-index: 1;
  pointer-events: none;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
@media (min-width: 0px) and (max-width: 1200px) {
  header.header-archive .background-image-header {
    position: relative;
    width: 100%;
    padding-top: 66.7%;
    top: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  header.header-archive .background-image-header {
    position: relative;
    width: 100%;
    padding-top: 66.7%;
    top: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  header.header-archive .background-image-header {
    position: relative;
    width: 100%;
    padding-top: 66.7%;
    top: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  header.header-archive .background-image-header {
    position: relative;
    width: 100%;
    padding-top: 66.7%;
    top: 0;
  }
}
body > article#entry-content > header.module-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  background-color: #384043;
  background-color: var(--bg-dark-default);
  color: white;
  padding-top: calc(32px * 5);
  padding-top: calc(var(--spacer-default) * 5);
  padding-bottom: calc(32px * 5);
  padding-bottom: calc(var(--spacer-default) * 5);
  min-height: 100vh;
}
@media (min-width: 0px) and (max-width: 1200px) {
  body > article#entry-content > header.module-header {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body > article#entry-content > header.module-header {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body > article#entry-content > header.module-header {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body > article#entry-content > header.module-header {
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
    min-height: 100vh;
    min-height: calc(1vh * 100);
    min-height: calc(var(--vh, 1vh) * 100);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body > article#entry-content > header.module-header {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
    min-height: 100vh;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body > article#entry-content > header.module-header {
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
    min-height: 100vh;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body > article#entry-content > header.module-header {
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
    min-height: 100vh;
  }
}
body > article#entry-content > header.module-header * {
  color: white;
}
body > article#entry-content > header.module-header a:hover, body > article#entry-content > header.module-header a:hover * {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
body > article#entry-content > header.module-header .container {
  min-height: 0;
  position: relative;
}
body > article#entry-content > header.module-header > div {
  z-index: 2;
}
body > article#entry-content > header.module-header:after {
  background-color: rgba(19, 22, 23, 1);
  background-color: rgba(var(--color-primary-700), 1);
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.666;
  z-index: 0;
}
body > article#entry-content > header.module-header .video-bg {
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
}
body > article#entry-content > header.module-header .video-bg video {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.posts-filter .js-clear {
  align-self: flex-end;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  line-height: calc(32px * 1.666);
  line-height: calc(var(--spacer-default) * 1.666);
  height: calc(32px * 1.666);
  height: calc(var(--spacer-default) * 1.666);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
}
.posts-filter .js-clear:hover {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .posts-filter .js-clear {
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-xs) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-xs) * 1.666);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .posts-filter .js-clear {
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-xs-l) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-xs-l) * 1.666);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .posts-filter .js-clear {
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-sm) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-sm) * 1.666);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .posts-filter .js-clear {
    line-height: calc(24px * 1.666);
    line-height: calc(var(--spacer-sm-l) * 1.666);
    height: calc(24px * 1.666);
    height: calc(var(--spacer-sm-l) * 1.666);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .posts-filter .js-clear {
    line-height: calc(28px * 1.666);
    line-height: calc(var(--spacer-md) * 1.666);
    height: calc(28px * 1.666);
    height: calc(var(--spacer-md) * 1.666);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .posts-filter .js-clear {
    line-height: calc(32px * 1.666);
    line-height: calc(var(--spacer-lg) * 1.666);
    height: calc(32px * 1.666);
    height: calc(var(--spacer-lg) * 1.666);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .posts-filter .js-clear {
    line-height: calc(36px * 1.666);
    line-height: calc(var(--spacer-xl) * 1.666);
    height: calc(36px * 1.666);
    height: calc(var(--spacer-xl) * 1.666);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
  }
}
.posts-filter .js-clear [class*=icon-] {
  margin-right: calc(32px * 0.25);
  margin-right: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(24px * 0.25);
    margin-right: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(32px * 0.25);
    margin-right: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .posts-filter .js-clear [class*=icon-] {
    margin-right: calc(36px * 0.25);
    margin-right: calc(var(--spacer-xl) * 0.25);
  }
}
.posts-filter > div:last-child {
  align-self: flex-end;
}

.separator:before {
  content: "•";
  display: flex;
  margin: 0 calc(32px * 0.5);
  margin: 0 calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .separator:before {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .separator:before {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .separator:before {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .separator:before {
    margin: 0 calc(24px * 0.5);
    margin: 0 calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .separator:before {
    margin: 0 calc(28px * 0.5);
    margin: 0 calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .separator:before {
    margin: 0 calc(32px * 0.5);
    margin: 0 calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .separator:before {
    margin: 0 calc(36px * 0.5);
    margin: 0 calc(var(--spacer-xl) * 0.5);
  }
}

body.error404 {
  background: rgba(56, 64, 67, 1);
  background: rgba(var(--color-primary-500), 1);
}

body.error404 article *:not(input), body.error404 footer *:not(input) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}
body.error404 article h1, body.error404 footer h1 {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
body.error404 article h1 *, body.error404 footer h1 * {
  color: rgba(255, 167, 0, 1);
  color: rgba(var(--color-secondary-500), 1);
}
body.error404 article form.container-xs, body.error404 footer form.container-xs {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
  margin-left: calc(32px * 0.25);
  margin-left: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(24px * 0.25);
    margin-left: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(32px * 0.25);
    margin-left: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(36px * 0.25);
    margin-left: calc(var(--spacer-xl) * 0.25);
  }
}
/*# sourceMappingURL=style.css.map */