@charset "UTF-8";
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *=* require select2
 *= require_self
 */
/*!
 * Toastify js 1.12.0
 * https://github.com/apvarun/toastify-js
 * @license MIT licensed
 *
 * Copyright (C) 2018 Varun A P
 */
@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap");
.toastify {
  padding: 12px 20px;
  color: #ffffff;
  display: inline-block;
  box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
  background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5);
  background: linear-gradient(135deg, #73a5ff, #5477f5);
  position: fixed;
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  border-radius: 2px;
  cursor: pointer;
  text-decoration: none;
  max-width: calc(50% - 20px);
  z-index: 2147483647;
}

.toastify.on {
  opacity: 1;
}

.toast-close {
  background: transparent;
  border: 0;
  color: white;
  cursor: pointer;
  font-family: inherit;
  font-size: 1em;
  opacity: 0.4;
  padding: 0 5px;
}

.toastify-right {
  right: 15px;
}

.toastify-left {
  left: 15px;
}

.toastify-top {
  top: -150px;
}

.toastify-bottom {
  bottom: -150px;
}

.toastify-rounded {
  border-radius: 25px;
}

.toastify-avatar {
  width: 1.5em;
  height: 1.5em;
  margin: -7px 5px;
  border-radius: 2px;
}

.toastify-center {
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  max-width: fit-content;
  max-width: -moz-fit-content;
}

@media only screen and (max-width: 360px) {
  .toastify-right, .toastify-left {
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    max-width: fit-content;
  }
}
/**
 * tom-select.css (v2.1.0)
 * Copyright (c) contributors
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
 * file except in compliance with the License. You may obtain a copy of the License at:
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
 * ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 *
 */
.ts-wrapper.single .ts-control, .ts-wrapper.single .ts-control input {
  cursor: pointer;
}

.ts-wrapper.plugin-drag_drop.multi > .ts-control > div.ui-sortable-placeholder {
  visibility: visible !important;
  background: #f2f2f2 !important;
  background: rgba(0, 0, 0, 0.06) !important;
  border: 0 none !important;
  box-shadow: inset 0 0 12px 4px #fff;
}

.ts-wrapper.plugin-drag_drop .ui-sortable-placeholder::after {
  content: "!";
  visibility: hidden;
}

.ts-wrapper.plugin-drag_drop .ui-sortable-helper {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.plugin-checkbox_options .option input {
  margin-right: 0.5rem;
}

.plugin-clear_button .ts-control {
  padding-right: calc(1em + 18px) !important;
}

.plugin-clear_button .clear-button {
  opacity: 0;
  position: absolute;
  top: 8px;
  right: 2px;
  margin-right: 0 !important;
  background: transparent !important;
  transition: opacity 0.5s;
  cursor: pointer;
}

.plugin-clear_button.single .clear-button {
  right: calc(2px + 2rem);
}

.plugin-clear_button.focus.has-items .clear-button, .plugin-clear_button:not(.disabled):hover.has-items .clear-button {
  opacity: 1;
}

.ts-wrapper .dropdown-header {
  position: relative;
  padding: 10px 8px;
  border-bottom: 1px solid #d0d0d0;
  background: #f8f8f8;
  border-radius: 3px 3px 0 0;
}

.ts-wrapper .dropdown-header-close {
  position: absolute;
  right: 8px;
  top: 50%;
  color: #303030;
  opacity: 0.4;
  margin-top: -12px;
  line-height: 20px;
  font-size: 20px !important;
}

.ts-wrapper .dropdown-header-close:hover {
  color: black;
}

.plugin-dropdown_input.focus.dropdown-active .ts-control {
  box-shadow: none;
  border: 1px solid #d0d0d0;
}

.plugin-dropdown_input .dropdown-input {
  border: 1px solid #d0d0d0;
  border-width: 0 0 1px 0;
  display: block;
  padding: 8px 8px;
  box-shadow: none;
  width: 100%;
  background: transparent;
}

.plugin-dropdown_input .items-placeholder {
  border: 0 none !important;
  box-shadow: none !important;
  width: 100%;
}

.plugin-dropdown_input.has-items .items-placeholder, .plugin-dropdown_input.dropdown-active .items-placeholder {
  display: none !important;
}

.ts-wrapper.plugin-input_autogrow.has-items .ts-control > input {
  min-width: 0;
}

.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input {
  flex: none;
  min-width: 4px;
}

.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-webkit-input-placeholder {
  color: transparent;
}

.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-ms-input-placeholder {
  color: transparent;
}

.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::placeholder {
  color: transparent;
}

.ts-dropdown.plugin-optgroup_columns .ts-dropdown-content {
  display: flex;
}

.ts-dropdown.plugin-optgroup_columns .optgroup {
  border-right: 1px solid #f2f2f2;
  border-top: 0 none;
  flex-grow: 1;
  flex-basis: 0;
  min-width: 0;
}

.ts-dropdown.plugin-optgroup_columns .optgroup:last-child {
  border-right: 0 none;
}

.ts-dropdown.plugin-optgroup_columns .optgroup:before {
  display: none;
}

.ts-dropdown.plugin-optgroup_columns .optgroup-header {
  border-top: 0 none;
}

.ts-wrapper.plugin-remove_button .item {
  display: inline-flex;
  align-items: center;
  padding-right: 0 !important;
}

.ts-wrapper.plugin-remove_button .item .remove {
  color: inherit;
  text-decoration: none;
  vertical-align: middle;
  display: inline-block;
  padding: 0 6px;
  border-left: 1px solid #d0d0d0;
  border-radius: 0 2px 2px 0;
  box-sizing: border-box;
  margin-left: 6px;
}

.ts-wrapper.plugin-remove_button .item .remove:hover {
  background: rgba(0, 0, 0, 0.05);
}

.ts-wrapper.plugin-remove_button .item.active .remove {
  border-left-color: #cacaca;
}

.ts-wrapper.plugin-remove_button.disabled .item .remove:hover {
  background: none;
}

.ts-wrapper.plugin-remove_button.disabled .item .remove {
  border-left-color: white;
}

.ts-wrapper.plugin-remove_button .remove-single {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 23px;
}

.ts-wrapper {
  position: relative;
}

.ts-dropdown,
.ts-control,
.ts-control input {
  color: #303030;
  font-family: inherit;
  font-size: 13px;
  line-height: 18px;
  font-smoothing: inherit;
}

.ts-control,
.ts-wrapper.single.input-active .ts-control {
  background: #fff;
  cursor: text;
}

.ts-control {
  border: 1px solid #d0d0d0;
  padding: 8px 8px;
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  box-shadow: none;
  border-radius: 3px;
  display: flex;
  flex-wrap: wrap;
}

.ts-wrapper.multi.has-items .ts-control {
  padding: 6px 8px 3px;
}

.full .ts-control {
  background-color: #fff;
}

.disabled .ts-control, .disabled .ts-control * {
  cursor: default !important;
}

.focus .ts-control {
  box-shadow: none;
}

.ts-control > * {
  vertical-align: baseline;
  display: inline-block;
}

.ts-wrapper.multi .ts-control > div {
  cursor: pointer;
  margin: 0 3px 3px 0;
  padding: 2px 6px;
  background: #f2f2f2;
  color: #303030;
  border: 0px solid #d0d0d0;
}

.ts-wrapper.multi .ts-control > div.active {
  background: #e8e8e8;
  color: #303030;
  border: 0px solid #cacaca;
}

.ts-wrapper.multi.disabled .ts-control > div, .ts-wrapper.multi.disabled .ts-control > div.active {
  color: #7d7d7d;
  background: white;
  border: 0px solid white;
}

.ts-control > input {
  flex: 1 1 auto;
  min-width: 7rem;
  display: inline-block !important;
  padding: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  max-width: 100% !important;
  margin: 0 !important;
  text-indent: 0 !important;
  border: 0 none !important;
  background: none !important;
  line-height: inherit !important;
  -webkit-user-select: auto !important;
  -moz-user-select: auto !important;
  -ms-user-select: auto !important;
  user-select: auto !important;
  box-shadow: none !important;
}

.ts-control > input::-ms-clear {
  display: none;
}

.ts-control > input:focus {
  outline: none !important;
}

.has-items .ts-control > input {
  margin: 0px 4px !important;
}

.ts-control.rtl {
  text-align: right;
}

.ts-control.rtl.single .ts-control:after {
  left: 15px;
  right: auto;
}

.ts-control.rtl .ts-control > input {
  margin: 0px 4px 0px -2px !important;
}

.disabled .ts-control {
  opacity: 0.5;
  background-color: #fafafa;
}

.input-hidden .ts-control > input {
  opacity: 0;
  position: absolute;
  left: -10000px;
}

.ts-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 10;
  border: 1px solid #d0d0d0;
  background: #fff;
  margin: 0.25rem 0 0 0;
  border-top: 0 none;
  box-sizing: border-box;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border-radius: 0 0 3px 3px;
}

.ts-dropdown [data-selectable] {
  cursor: pointer;
  overflow: hidden;
}

.ts-dropdown [data-selectable] .highlight {
  background: rgba(125, 168, 208, 0.2);
  border-radius: 1px;
}

.ts-dropdown .option,
.ts-dropdown .optgroup-header,
.ts-dropdown .no-results,
.ts-dropdown .create {
  padding: 5px 8px;
}

.ts-dropdown .option, .ts-dropdown [data-disabled], .ts-dropdown [data-disabled] [data-selectable].option {
  cursor: inherit;
  opacity: 0.5;
}

.ts-dropdown [data-selectable].option {
  opacity: 1;
  cursor: pointer;
}

.ts-dropdown .optgroup:first-child .optgroup-header {
  border-top: 0 none;
}

.ts-dropdown .optgroup-header {
  color: #303030;
  background: #fff;
  cursor: default;
}

.ts-dropdown .active {
  background-color: #f5fafd;
  color: #495c68;
}

.ts-dropdown .active.create {
  color: #495c68;
}

.ts-dropdown .create {
  color: rgba(48, 48, 48, 0.5);
}

.ts-dropdown .spinner {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 5px 8px;
}

.ts-dropdown .spinner:after {
  content: " ";
  display: block;
  width: 24px;
  height: 24px;
  margin: 3px;
  border-radius: 50%;
  border: 5px solid #d0d0d0;
  border-color: #d0d0d0 transparent #d0d0d0 transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}

@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.ts-dropdown-content {
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 200px;
  overflow-scrolling: touch;
  scroll-behavior: smooth;
}

.ts-hidden-accessible {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}


/**
 * Adapted from: https://codepen.io/chriscoyier/pen/uwJjr
 *
 * HTML example:
   <html>
     <head>
       Stuff
     </head>

     <div class="page_wrap">
       <nav>
         Olá
       </nav>

       <body>
         Stuff
       </body>
     </div>

     <footer>
       Adeus
     </footer>
   </html>
 *
 * Usage if you're using the default elements (previous example):
 * @include sticky-footer(30px);
 *
 * Usage if you want to define the elements:
 * @include sticky-footer(30px, '.page', '.footer');
 *
 */
/**
 * Adapted from: https://css-tricks.com/centering-css-complete-guide/, https://stackoverflow.com/questions/38221573/flexbox-vertical-centering-plus-a-sticky-footer
 *
 * HTML example:
   <div class="centered_div">
     <div class="child_centerer">
       Olá.
     </div>
   </div>
 *
 * CSS example:
   .centered_div{
    background-color: $x_primary-main;
    height: 500px;

    @include centerer-flexbox;

    .child_centerer
    {
       background-color: $x_warning-main;
    }

   }
 *
 * Usage if you're using the default elements (previous example):
 * @include centerer;
 *
 * Usage if you want to define the elements:
 * @include centerer(true, false);
 *
 */
/**
 * Adapted from: https://codepen.io/kristyjy/pen/rewVjX
 *
 * HTML example:
   <div class="hamburger hamburger-default"><span></span></div>
 *
 * Usage if you're using the default elements (previous example):
 * @include burger-icon;
 *
 * Usage if you want to define the elements:
 * @include burger-icon(25px,20px,$s_border);
 *
 */
/**
 * This stylesheet has 5 sections:
 *
 * 1.Neutral Colors - Where are defined the neutral colors
 * This colors could be or not in the project palette
 * Usually this colors are shades of white, gray and black but it could also be
 * shades of beige for example
 *
 * 2.Theme Colors - Where are defined the project palette
 *
 * 3.Other Colors - Where are defined other colors you need.
 * - Project-specific & general colors  -
 *
 * 4.Social Networks Colors - Where are defined the colors of social networks
 *
 * 5.Functions - Where are defined other color functions
 *   - Adaptative Color:
 *     Given a certain color, returns black* or white*, depending on the
 * contrast. You can also define the dark and light color that it should return.
 *     eg.:
 *       adaptative-color( theme-color() ) // returns black or white
 *
 *       adaptative-color( theme-color(), neutral-color($key: "600"), neutral-color($key: "200") ) // returns #4F4F4F or #ECECEC
 *
 *   - Color Shade:
 *     Given a certain color and percentage, returns a shade of the color based
 * on the percentage provided and the light and dark color.
 *     Positive percentages mix the color with the light one, while negative
 * percentages mix it with the dark.
 *
 *
 * HOW TO USE:
 * 1. Add a color to a section:
 *    - Choose a section and a name to the color, then add it to the map.merge
 * of the chosen section. Don't forget to add a comma on the end of the
 * previous line.
 *    eg.: $theme-colors: map.merge(
 *           (
 *             ... ,
 *             "name of the color": #COLORHEX / colorname
 *           ),
 *           $theme-colors
 *         );
 *
 * 2. Call the right color
 *    - function-name()
 *      to use the default color of the section
 *    eg.: theme-color() // = theme-color("blue") = #007bff
 *
 *    - function-name("color name")
 *      to use a specific color of the section
 *    eg.: theme-color("secondary") // = #828282
 *
 * 3. Request a Theme Color Shade
 *    You can call for shades of theme color
 *
 *    - Lighter shade (positive percentage)
 *    eg.: theme-color-shade("primary", 30%)
 *
 *    - Darker shade (negative percentage)
 *    eg.: theme-color-shade("primary", -30%)
 *
 *
 * TIP:
 * If it gets easier, you can use comments next to the colors as notes so you
 * can check more easily where you are using this color on the website.
 *
 * eg.: "white": white, //background -- sidebar, container...
 *
 */
/* NEUTRAL COLORS */
/* THEME COLORS */
/* OTHER COLORS */
/* SOCIAL NETWORKS COLORS */
/* FUNCTIONS */
/* Adaptative Color */
/* Color Shade */
/**
 * This stylesheet has 4 sections:
 *
 * 1.Breakpoints
 *
 * 2.Sizes
 *
 * 3.Spacing
 *
 * 4.Animation
 *
 *
 * How to declare variables:
 *   $a_name
 *
 *   a_: Should be the initial of the variable type
 *     b_  –— border
 *     c_  –— color
 *     d_  –— duration
 *     f_  –— font
 *     fw_ –— font-weight
 *     fs_ –— font-size
 *     h_  –— height
 *     w_  –— width
 *     s_  –— size
 *
 *   name: Should be the name of the variable.
 *         For more info on naming variables check the README file
 */
/* BREAKPOINTS */
/* SIZES */
/* SPACING */
/*
 * if you change this values and don't want to change your styles, don't forget
 * to change all the spacer(key_you_have_changed) to spacer(new_key_of_the_old_value)
 *
 * eg.:
 * ---- before changing values
 *   5: 64px                        .class { margin-right: spacer(6); // 152px }
 *   6: 152px
 *
 * ---- after changing values
 *   5: 64px                        .class { margin-right: spacer(6); //  72px }
 *   6: 72px                        -- you need to change the 6 to a 7 if you
 *   7: 152px                          want to keep the 152px margin-right    --
 *                                  .class { margin-right: spacer(7); // 152px }
 */
/* ANIMATION */
/* RADIUS */
/*
 * if you change this values and don't want to change your styles, don't forget
 * to change all the radius(key_you_have_changed) to radius(new_key_of_the_old_value)
 *
 * eg.:
 * ---- before changing values
 *   3: 10px                        .class { border-radius: radius(4); // 20px }
 *   4: 20px
 *
 * ---- after changing values
 *   3: 10px                        .class { border-radius: radius(4); // 16px }
 *   4: 16px                        -- you need to change the 4 to a 5 if you
 *   5: 20px                           want to keep the 20px border-radius    --
 *                                  .class { border-radius: radius(5); // 20px }
 */
/* MARGIN */
.m-0 {
  margin: 0 !important;
}

.m-x-0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.m-y-0 {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

.m-t-0 {
  margin-top: 0 !important;
}

.m-b-0 {
  margin-bottom: 0 !important;
}

.m-l-0 {
  margin-left: 0 !important;
}

.m-r-0 {
  margin-right: 0 !important;
}

/* PADDING */
.p-0 {
  padding: 0 !important;
}

.p-x-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.p-y-0 {
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

.p-t-0 {
  padding-top: 0 !important;
}

.p-b-0 {
  padding-bottom: 0 !important;
}

.p-l-0 {
  padding-left: 0 !important;
}

.p-r-0 {
  padding-right: 0 !important;
}

/* GAP */
.gap-0 {
  gap: 0 !important;
}

.gap-y-0 {
  gap: 0 0 !important;
}

.gap-x-0 {
  gap: 0 0 !important;
}

.gap-0-0 {
  gap: 0 0 !important;
}

.gap-0-1 {
  gap: 0 8px !important;
}

.gap-0-2 {
  gap: 0 16px !important;
}

.gap-0-3 {
  gap: 0 24px !important;
}

.gap-0-4 {
  gap: 0 32px !important;
}

.gap-0-5 {
  gap: 0 40px !important;
}

.gap-0-6 {
  gap: 0 48px !important;
}

.gap-0-7 {
  gap: 0 56px !important;
}

.gap-0-8 {
  gap: 0 64px !important;
}

.gap-0-9 {
  gap: 0 72px !important;
}

.gap-0-10 {
  gap: 0 80px !important;
}

.gap-0-11 {
  gap: 0 88px !important;
}

.gap-0-12 {
  gap: 0 96px !important;
}

.gap-0-13 {
  gap: 0 104px !important;
}

.gap-0-auto {
  gap: 0 auto !important;
}

/* LETTER SPACING */
.letter-spacing-0 {
  letter-spacing: 0 !important;
}

/* MARGIN */
.m-1 {
  margin: 8px !important;
}

.m-x-1 {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.m-y-1 {
  margin-bottom: 8px !important;
  margin-top: 8px !important;
}

.m-t-1 {
  margin-top: 8px !important;
}

.m-b-1 {
  margin-bottom: 8px !important;
}

.m-l-1 {
  margin-left: 8px !important;
}

.m-r-1 {
  margin-right: 8px !important;
}

/* PADDING */
.p-1 {
  padding: 8px !important;
}

.p-x-1 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.p-y-1 {
  padding-bottom: 8px !important;
  padding-top: 8px !important;
}

.p-t-1 {
  padding-top: 8px !important;
}

.p-b-1 {
  padding-bottom: 8px !important;
}

.p-l-1 {
  padding-left: 8px !important;
}

.p-r-1 {
  padding-right: 8px !important;
}

/* GAP */
.gap-1 {
  gap: 8px !important;
}

.gap-y-1 {
  gap: 8px 0 !important;
}

.gap-x-1 {
  gap: 0 8px !important;
}

.gap-1-0 {
  gap: 8px 0 !important;
}

.gap-1-1 {
  gap: 8px 8px !important;
}

.gap-1-2 {
  gap: 8px 16px !important;
}

.gap-1-3 {
  gap: 8px 24px !important;
}

.gap-1-4 {
  gap: 8px 32px !important;
}

.gap-1-5 {
  gap: 8px 40px !important;
}

.gap-1-6 {
  gap: 8px 48px !important;
}

.gap-1-7 {
  gap: 8px 56px !important;
}

.gap-1-8 {
  gap: 8px 64px !important;
}

.gap-1-9 {
  gap: 8px 72px !important;
}

.gap-1-10 {
  gap: 8px 80px !important;
}

.gap-1-11 {
  gap: 8px 88px !important;
}

.gap-1-12 {
  gap: 8px 96px !important;
}

.gap-1-13 {
  gap: 8px 104px !important;
}

.gap-1-auto {
  gap: 8px auto !important;
}

/* LETTER SPACING */
.letter-spacing-1 {
  letter-spacing: 0.4px !important;
}

/* MARGIN */
.m-2 {
  margin: 16px !important;
}

.m-x-2 {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.m-y-2 {
  margin-bottom: 16px !important;
  margin-top: 16px !important;
}

.m-t-2 {
  margin-top: 16px !important;
}

.m-b-2 {
  margin-bottom: 16px !important;
}

.m-l-2 {
  margin-left: 16px !important;
}

.m-r-2 {
  margin-right: 16px !important;
}

/* PADDING */
.p-2 {
  padding: 16px !important;
}

.p-x-2 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.p-y-2 {
  padding-bottom: 16px !important;
  padding-top: 16px !important;
}

.p-t-2 {
  padding-top: 16px !important;
}

.p-b-2 {
  padding-bottom: 16px !important;
}

.p-l-2 {
  padding-left: 16px !important;
}

.p-r-2 {
  padding-right: 16px !important;
}

/* GAP */
.gap-2 {
  gap: 16px !important;
}

.gap-y-2 {
  gap: 16px 0 !important;
}

.gap-x-2 {
  gap: 0 16px !important;
}

.gap-2-0 {
  gap: 16px 0 !important;
}

.gap-2-1 {
  gap: 16px 8px !important;
}

.gap-2-2 {
  gap: 16px 16px !important;
}

.gap-2-3 {
  gap: 16px 24px !important;
}

.gap-2-4 {
  gap: 16px 32px !important;
}

.gap-2-5 {
  gap: 16px 40px !important;
}

.gap-2-6 {
  gap: 16px 48px !important;
}

.gap-2-7 {
  gap: 16px 56px !important;
}

.gap-2-8 {
  gap: 16px 64px !important;
}

.gap-2-9 {
  gap: 16px 72px !important;
}

.gap-2-10 {
  gap: 16px 80px !important;
}

.gap-2-11 {
  gap: 16px 88px !important;
}

.gap-2-12 {
  gap: 16px 96px !important;
}

.gap-2-13 {
  gap: 16px 104px !important;
}

.gap-2-auto {
  gap: 16px auto !important;
}

/* LETTER SPACING */
.letter-spacing-2 {
  letter-spacing: 0.8px !important;
}

/* MARGIN */
.m-3 {
  margin: 24px !important;
}

.m-x-3 {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.m-y-3 {
  margin-bottom: 24px !important;
  margin-top: 24px !important;
}

.m-t-3 {
  margin-top: 24px !important;
}

.m-b-3 {
  margin-bottom: 24px !important;
}

.m-l-3 {
  margin-left: 24px !important;
}

.m-r-3 {
  margin-right: 24px !important;
}

/* PADDING */
.p-3 {
  padding: 24px !important;
}

.p-x-3 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.p-y-3 {
  padding-bottom: 24px !important;
  padding-top: 24px !important;
}

.p-t-3 {
  padding-top: 24px !important;
}

.p-b-3 {
  padding-bottom: 24px !important;
}

.p-l-3 {
  padding-left: 24px !important;
}

.p-r-3 {
  padding-right: 24px !important;
}

/* GAP */
.gap-3 {
  gap: 24px !important;
}

.gap-y-3 {
  gap: 24px 0 !important;
}

.gap-x-3 {
  gap: 0 24px !important;
}

.gap-3-0 {
  gap: 24px 0 !important;
}

.gap-3-1 {
  gap: 24px 8px !important;
}

.gap-3-2 {
  gap: 24px 16px !important;
}

.gap-3-3 {
  gap: 24px 24px !important;
}

.gap-3-4 {
  gap: 24px 32px !important;
}

.gap-3-5 {
  gap: 24px 40px !important;
}

.gap-3-6 {
  gap: 24px 48px !important;
}

.gap-3-7 {
  gap: 24px 56px !important;
}

.gap-3-8 {
  gap: 24px 64px !important;
}

.gap-3-9 {
  gap: 24px 72px !important;
}

.gap-3-10 {
  gap: 24px 80px !important;
}

.gap-3-11 {
  gap: 24px 88px !important;
}

.gap-3-12 {
  gap: 24px 96px !important;
}

.gap-3-13 {
  gap: 24px 104px !important;
}

.gap-3-auto {
  gap: 24px auto !important;
}

/* LETTER SPACING */
.letter-spacing-3 {
  letter-spacing: 1.2px !important;
}

/* MARGIN */
.m-4 {
  margin: 32px !important;
}

.m-x-4 {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.m-y-4 {
  margin-bottom: 32px !important;
  margin-top: 32px !important;
}

.m-t-4 {
  margin-top: 32px !important;
}

.m-b-4 {
  margin-bottom: 32px !important;
}

.m-l-4 {
  margin-left: 32px !important;
}

.m-r-4 {
  margin-right: 32px !important;
}

/* PADDING */
.p-4 {
  padding: 32px !important;
}

.p-x-4 {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.p-y-4 {
  padding-bottom: 32px !important;
  padding-top: 32px !important;
}

.p-t-4 {
  padding-top: 32px !important;
}

.p-b-4 {
  padding-bottom: 32px !important;
}

.p-l-4 {
  padding-left: 32px !important;
}

.p-r-4 {
  padding-right: 32px !important;
}

/* GAP */
.gap-4 {
  gap: 32px !important;
}

.gap-y-4 {
  gap: 32px 0 !important;
}

.gap-x-4 {
  gap: 0 32px !important;
}

.gap-4-0 {
  gap: 32px 0 !important;
}

.gap-4-1 {
  gap: 32px 8px !important;
}

.gap-4-2 {
  gap: 32px 16px !important;
}

.gap-4-3 {
  gap: 32px 24px !important;
}

.gap-4-4 {
  gap: 32px 32px !important;
}

.gap-4-5 {
  gap: 32px 40px !important;
}

.gap-4-6 {
  gap: 32px 48px !important;
}

.gap-4-7 {
  gap: 32px 56px !important;
}

.gap-4-8 {
  gap: 32px 64px !important;
}

.gap-4-9 {
  gap: 32px 72px !important;
}

.gap-4-10 {
  gap: 32px 80px !important;
}

.gap-4-11 {
  gap: 32px 88px !important;
}

.gap-4-12 {
  gap: 32px 96px !important;
}

.gap-4-13 {
  gap: 32px 104px !important;
}

.gap-4-auto {
  gap: 32px auto !important;
}

/* LETTER SPACING */
.letter-spacing-4 {
  letter-spacing: 1.6px !important;
}

/* MARGIN */
.m-5 {
  margin: 40px !important;
}

.m-x-5 {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.m-y-5 {
  margin-bottom: 40px !important;
  margin-top: 40px !important;
}

.m-t-5 {
  margin-top: 40px !important;
}

.m-b-5 {
  margin-bottom: 40px !important;
}

.m-l-5 {
  margin-left: 40px !important;
}

.m-r-5 {
  margin-right: 40px !important;
}

/* PADDING */
.p-5 {
  padding: 40px !important;
}

.p-x-5 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.p-y-5 {
  padding-bottom: 40px !important;
  padding-top: 40px !important;
}

.p-t-5 {
  padding-top: 40px !important;
}

.p-b-5 {
  padding-bottom: 40px !important;
}

.p-l-5 {
  padding-left: 40px !important;
}

.p-r-5 {
  padding-right: 40px !important;
}

/* GAP */
.gap-5 {
  gap: 40px !important;
}

.gap-y-5 {
  gap: 40px 0 !important;
}

.gap-x-5 {
  gap: 0 40px !important;
}

.gap-5-0 {
  gap: 40px 0 !important;
}

.gap-5-1 {
  gap: 40px 8px !important;
}

.gap-5-2 {
  gap: 40px 16px !important;
}

.gap-5-3 {
  gap: 40px 24px !important;
}

.gap-5-4 {
  gap: 40px 32px !important;
}

.gap-5-5 {
  gap: 40px 40px !important;
}

.gap-5-6 {
  gap: 40px 48px !important;
}

.gap-5-7 {
  gap: 40px 56px !important;
}

.gap-5-8 {
  gap: 40px 64px !important;
}

.gap-5-9 {
  gap: 40px 72px !important;
}

.gap-5-10 {
  gap: 40px 80px !important;
}

.gap-5-11 {
  gap: 40px 88px !important;
}

.gap-5-12 {
  gap: 40px 96px !important;
}

.gap-5-13 {
  gap: 40px 104px !important;
}

.gap-5-auto {
  gap: 40px auto !important;
}

/* LETTER SPACING */
.letter-spacing-5 {
  letter-spacing: 2px !important;
}

/* MARGIN */
.m-6 {
  margin: 48px !important;
}

.m-x-6 {
  margin-left: 48px !important;
  margin-right: 48px !important;
}

.m-y-6 {
  margin-bottom: 48px !important;
  margin-top: 48px !important;
}

.m-t-6 {
  margin-top: 48px !important;
}

.m-b-6 {
  margin-bottom: 48px !important;
}

.m-l-6 {
  margin-left: 48px !important;
}

.m-r-6 {
  margin-right: 48px !important;
}

/* PADDING */
.p-6 {
  padding: 48px !important;
}

.p-x-6 {
  padding-left: 48px !important;
  padding-right: 48px !important;
}

.p-y-6 {
  padding-bottom: 48px !important;
  padding-top: 48px !important;
}

.p-t-6 {
  padding-top: 48px !important;
}

.p-b-6 {
  padding-bottom: 48px !important;
}

.p-l-6 {
  padding-left: 48px !important;
}

.p-r-6 {
  padding-right: 48px !important;
}

/* GAP */
.gap-6 {
  gap: 48px !important;
}

.gap-y-6 {
  gap: 48px 0 !important;
}

.gap-x-6 {
  gap: 0 48px !important;
}

.gap-6-0 {
  gap: 48px 0 !important;
}

.gap-6-1 {
  gap: 48px 8px !important;
}

.gap-6-2 {
  gap: 48px 16px !important;
}

.gap-6-3 {
  gap: 48px 24px !important;
}

.gap-6-4 {
  gap: 48px 32px !important;
}

.gap-6-5 {
  gap: 48px 40px !important;
}

.gap-6-6 {
  gap: 48px 48px !important;
}

.gap-6-7 {
  gap: 48px 56px !important;
}

.gap-6-8 {
  gap: 48px 64px !important;
}

.gap-6-9 {
  gap: 48px 72px !important;
}

.gap-6-10 {
  gap: 48px 80px !important;
}

.gap-6-11 {
  gap: 48px 88px !important;
}

.gap-6-12 {
  gap: 48px 96px !important;
}

.gap-6-13 {
  gap: 48px 104px !important;
}

.gap-6-auto {
  gap: 48px auto !important;
}

/* LETTER SPACING */
.letter-spacing-6 {
  letter-spacing: 2.4px !important;
}

/* MARGIN */
.m-7 {
  margin: 56px !important;
}

.m-x-7 {
  margin-left: 56px !important;
  margin-right: 56px !important;
}

.m-y-7 {
  margin-bottom: 56px !important;
  margin-top: 56px !important;
}

.m-t-7 {
  margin-top: 56px !important;
}

.m-b-7 {
  margin-bottom: 56px !important;
}

.m-l-7 {
  margin-left: 56px !important;
}

.m-r-7 {
  margin-right: 56px !important;
}

/* PADDING */
.p-7 {
  padding: 56px !important;
}

.p-x-7 {
  padding-left: 56px !important;
  padding-right: 56px !important;
}

.p-y-7 {
  padding-bottom: 56px !important;
  padding-top: 56px !important;
}

.p-t-7 {
  padding-top: 56px !important;
}

.p-b-7 {
  padding-bottom: 56px !important;
}

.p-l-7 {
  padding-left: 56px !important;
}

.p-r-7 {
  padding-right: 56px !important;
}

/* GAP */
.gap-7 {
  gap: 56px !important;
}

.gap-y-7 {
  gap: 56px 0 !important;
}

.gap-x-7 {
  gap: 0 56px !important;
}

.gap-7-0 {
  gap: 56px 0 !important;
}

.gap-7-1 {
  gap: 56px 8px !important;
}

.gap-7-2 {
  gap: 56px 16px !important;
}

.gap-7-3 {
  gap: 56px 24px !important;
}

.gap-7-4 {
  gap: 56px 32px !important;
}

.gap-7-5 {
  gap: 56px 40px !important;
}

.gap-7-6 {
  gap: 56px 48px !important;
}

.gap-7-7 {
  gap: 56px 56px !important;
}

.gap-7-8 {
  gap: 56px 64px !important;
}

.gap-7-9 {
  gap: 56px 72px !important;
}

.gap-7-10 {
  gap: 56px 80px !important;
}

.gap-7-11 {
  gap: 56px 88px !important;
}

.gap-7-12 {
  gap: 56px 96px !important;
}

.gap-7-13 {
  gap: 56px 104px !important;
}

.gap-7-auto {
  gap: 56px auto !important;
}

/* LETTER SPACING */
.letter-spacing-7 {
  letter-spacing: 2.8px !important;
}

/* MARGIN */
.m-8 {
  margin: 64px !important;
}

.m-x-8 {
  margin-left: 64px !important;
  margin-right: 64px !important;
}

.m-y-8 {
  margin-bottom: 64px !important;
  margin-top: 64px !important;
}

.m-t-8 {
  margin-top: 64px !important;
}

.m-b-8 {
  margin-bottom: 64px !important;
}

.m-l-8 {
  margin-left: 64px !important;
}

.m-r-8 {
  margin-right: 64px !important;
}

/* PADDING */
.p-8 {
  padding: 64px !important;
}

.p-x-8 {
  padding-left: 64px !important;
  padding-right: 64px !important;
}

.p-y-8 {
  padding-bottom: 64px !important;
  padding-top: 64px !important;
}

.p-t-8 {
  padding-top: 64px !important;
}

.p-b-8 {
  padding-bottom: 64px !important;
}

.p-l-8 {
  padding-left: 64px !important;
}

.p-r-8 {
  padding-right: 64px !important;
}

/* GAP */
.gap-8 {
  gap: 64px !important;
}

.gap-y-8 {
  gap: 64px 0 !important;
}

.gap-x-8 {
  gap: 0 64px !important;
}

.gap-8-0 {
  gap: 64px 0 !important;
}

.gap-8-1 {
  gap: 64px 8px !important;
}

.gap-8-2 {
  gap: 64px 16px !important;
}

.gap-8-3 {
  gap: 64px 24px !important;
}

.gap-8-4 {
  gap: 64px 32px !important;
}

.gap-8-5 {
  gap: 64px 40px !important;
}

.gap-8-6 {
  gap: 64px 48px !important;
}

.gap-8-7 {
  gap: 64px 56px !important;
}

.gap-8-8 {
  gap: 64px 64px !important;
}

.gap-8-9 {
  gap: 64px 72px !important;
}

.gap-8-10 {
  gap: 64px 80px !important;
}

.gap-8-11 {
  gap: 64px 88px !important;
}

.gap-8-12 {
  gap: 64px 96px !important;
}

.gap-8-13 {
  gap: 64px 104px !important;
}

.gap-8-auto {
  gap: 64px auto !important;
}

/* LETTER SPACING */
.letter-spacing-8 {
  letter-spacing: 3.2px !important;
}

/* MARGIN */
.m-9 {
  margin: 72px !important;
}

.m-x-9 {
  margin-left: 72px !important;
  margin-right: 72px !important;
}

.m-y-9 {
  margin-bottom: 72px !important;
  margin-top: 72px !important;
}

.m-t-9 {
  margin-top: 72px !important;
}

.m-b-9 {
  margin-bottom: 72px !important;
}

.m-l-9 {
  margin-left: 72px !important;
}

.m-r-9 {
  margin-right: 72px !important;
}

/* PADDING */
.p-9 {
  padding: 72px !important;
}

.p-x-9 {
  padding-left: 72px !important;
  padding-right: 72px !important;
}

.p-y-9 {
  padding-bottom: 72px !important;
  padding-top: 72px !important;
}

.p-t-9 {
  padding-top: 72px !important;
}

.p-b-9 {
  padding-bottom: 72px !important;
}

.p-l-9 {
  padding-left: 72px !important;
}

.p-r-9 {
  padding-right: 72px !important;
}

/* GAP */
.gap-9 {
  gap: 72px !important;
}

.gap-y-9 {
  gap: 72px 0 !important;
}

.gap-x-9 {
  gap: 0 72px !important;
}

.gap-9-0 {
  gap: 72px 0 !important;
}

.gap-9-1 {
  gap: 72px 8px !important;
}

.gap-9-2 {
  gap: 72px 16px !important;
}

.gap-9-3 {
  gap: 72px 24px !important;
}

.gap-9-4 {
  gap: 72px 32px !important;
}

.gap-9-5 {
  gap: 72px 40px !important;
}

.gap-9-6 {
  gap: 72px 48px !important;
}

.gap-9-7 {
  gap: 72px 56px !important;
}

.gap-9-8 {
  gap: 72px 64px !important;
}

.gap-9-9 {
  gap: 72px 72px !important;
}

.gap-9-10 {
  gap: 72px 80px !important;
}

.gap-9-11 {
  gap: 72px 88px !important;
}

.gap-9-12 {
  gap: 72px 96px !important;
}

.gap-9-13 {
  gap: 72px 104px !important;
}

.gap-9-auto {
  gap: 72px auto !important;
}

/* LETTER SPACING */
.letter-spacing-9 {
  letter-spacing: 3.6px !important;
}

/* MARGIN */
.m-10 {
  margin: 80px !important;
}

.m-x-10 {
  margin-left: 80px !important;
  margin-right: 80px !important;
}

.m-y-10 {
  margin-bottom: 80px !important;
  margin-top: 80px !important;
}

.m-t-10 {
  margin-top: 80px !important;
}

.m-b-10 {
  margin-bottom: 80px !important;
}

.m-l-10 {
  margin-left: 80px !important;
}

.m-r-10 {
  margin-right: 80px !important;
}

/* PADDING */
.p-10 {
  padding: 80px !important;
}

.p-x-10 {
  padding-left: 80px !important;
  padding-right: 80px !important;
}

.p-y-10 {
  padding-bottom: 80px !important;
  padding-top: 80px !important;
}

.p-t-10 {
  padding-top: 80px !important;
}

.p-b-10 {
  padding-bottom: 80px !important;
}

.p-l-10 {
  padding-left: 80px !important;
}

.p-r-10 {
  padding-right: 80px !important;
}

/* GAP */
.gap-10 {
  gap: 80px !important;
}

.gap-y-10 {
  gap: 80px 0 !important;
}

.gap-x-10 {
  gap: 0 80px !important;
}

.gap-10-0 {
  gap: 80px 0 !important;
}

.gap-10-1 {
  gap: 80px 8px !important;
}

.gap-10-2 {
  gap: 80px 16px !important;
}

.gap-10-3 {
  gap: 80px 24px !important;
}

.gap-10-4 {
  gap: 80px 32px !important;
}

.gap-10-5 {
  gap: 80px 40px !important;
}

.gap-10-6 {
  gap: 80px 48px !important;
}

.gap-10-7 {
  gap: 80px 56px !important;
}

.gap-10-8 {
  gap: 80px 64px !important;
}

.gap-10-9 {
  gap: 80px 72px !important;
}

.gap-10-10 {
  gap: 80px 80px !important;
}

.gap-10-11 {
  gap: 80px 88px !important;
}

.gap-10-12 {
  gap: 80px 96px !important;
}

.gap-10-13 {
  gap: 80px 104px !important;
}

.gap-10-auto {
  gap: 80px auto !important;
}

/* LETTER SPACING */
.letter-spacing-10 {
  letter-spacing: 4px !important;
}

/* MARGIN */
.m-11 {
  margin: 88px !important;
}

.m-x-11 {
  margin-left: 88px !important;
  margin-right: 88px !important;
}

.m-y-11 {
  margin-bottom: 88px !important;
  margin-top: 88px !important;
}

.m-t-11 {
  margin-top: 88px !important;
}

.m-b-11 {
  margin-bottom: 88px !important;
}

.m-l-11 {
  margin-left: 88px !important;
}

.m-r-11 {
  margin-right: 88px !important;
}

/* PADDING */
.p-11 {
  padding: 88px !important;
}

.p-x-11 {
  padding-left: 88px !important;
  padding-right: 88px !important;
}

.p-y-11 {
  padding-bottom: 88px !important;
  padding-top: 88px !important;
}

.p-t-11 {
  padding-top: 88px !important;
}

.p-b-11 {
  padding-bottom: 88px !important;
}

.p-l-11 {
  padding-left: 88px !important;
}

.p-r-11 {
  padding-right: 88px !important;
}

/* GAP */
.gap-11 {
  gap: 88px !important;
}

.gap-y-11 {
  gap: 88px 0 !important;
}

.gap-x-11 {
  gap: 0 88px !important;
}

.gap-11-0 {
  gap: 88px 0 !important;
}

.gap-11-1 {
  gap: 88px 8px !important;
}

.gap-11-2 {
  gap: 88px 16px !important;
}

.gap-11-3 {
  gap: 88px 24px !important;
}

.gap-11-4 {
  gap: 88px 32px !important;
}

.gap-11-5 {
  gap: 88px 40px !important;
}

.gap-11-6 {
  gap: 88px 48px !important;
}

.gap-11-7 {
  gap: 88px 56px !important;
}

.gap-11-8 {
  gap: 88px 64px !important;
}

.gap-11-9 {
  gap: 88px 72px !important;
}

.gap-11-10 {
  gap: 88px 80px !important;
}

.gap-11-11 {
  gap: 88px 88px !important;
}

.gap-11-12 {
  gap: 88px 96px !important;
}

.gap-11-13 {
  gap: 88px 104px !important;
}

.gap-11-auto {
  gap: 88px auto !important;
}

/* LETTER SPACING */
.letter-spacing-11 {
  letter-spacing: 4.4px !important;
}

/* MARGIN */
.m-12 {
  margin: 96px !important;
}

.m-x-12 {
  margin-left: 96px !important;
  margin-right: 96px !important;
}

.m-y-12 {
  margin-bottom: 96px !important;
  margin-top: 96px !important;
}

.m-t-12 {
  margin-top: 96px !important;
}

.m-b-12 {
  margin-bottom: 96px !important;
}

.m-l-12 {
  margin-left: 96px !important;
}

.m-r-12 {
  margin-right: 96px !important;
}

/* PADDING */
.p-12 {
  padding: 96px !important;
}

.p-x-12 {
  padding-left: 96px !important;
  padding-right: 96px !important;
}

.p-y-12 {
  padding-bottom: 96px !important;
  padding-top: 96px !important;
}

.p-t-12 {
  padding-top: 96px !important;
}

.p-b-12 {
  padding-bottom: 96px !important;
}

.p-l-12 {
  padding-left: 96px !important;
}

.p-r-12 {
  padding-right: 96px !important;
}

/* GAP */
.gap-12 {
  gap: 96px !important;
}

.gap-y-12 {
  gap: 96px 0 !important;
}

.gap-x-12 {
  gap: 0 96px !important;
}

.gap-12-0 {
  gap: 96px 0 !important;
}

.gap-12-1 {
  gap: 96px 8px !important;
}

.gap-12-2 {
  gap: 96px 16px !important;
}

.gap-12-3 {
  gap: 96px 24px !important;
}

.gap-12-4 {
  gap: 96px 32px !important;
}

.gap-12-5 {
  gap: 96px 40px !important;
}

.gap-12-6 {
  gap: 96px 48px !important;
}

.gap-12-7 {
  gap: 96px 56px !important;
}

.gap-12-8 {
  gap: 96px 64px !important;
}

.gap-12-9 {
  gap: 96px 72px !important;
}

.gap-12-10 {
  gap: 96px 80px !important;
}

.gap-12-11 {
  gap: 96px 88px !important;
}

.gap-12-12 {
  gap: 96px 96px !important;
}

.gap-12-13 {
  gap: 96px 104px !important;
}

.gap-12-auto {
  gap: 96px auto !important;
}

/* LETTER SPACING */
.letter-spacing-12 {
  letter-spacing: 4.8px !important;
}

/* MARGIN */
.m-13 {
  margin: 104px !important;
}

.m-x-13 {
  margin-left: 104px !important;
  margin-right: 104px !important;
}

.m-y-13 {
  margin-bottom: 104px !important;
  margin-top: 104px !important;
}

.m-t-13 {
  margin-top: 104px !important;
}

.m-b-13 {
  margin-bottom: 104px !important;
}

.m-l-13 {
  margin-left: 104px !important;
}

.m-r-13 {
  margin-right: 104px !important;
}

/* PADDING */
.p-13 {
  padding: 104px !important;
}

.p-x-13 {
  padding-left: 104px !important;
  padding-right: 104px !important;
}

.p-y-13 {
  padding-bottom: 104px !important;
  padding-top: 104px !important;
}

.p-t-13 {
  padding-top: 104px !important;
}

.p-b-13 {
  padding-bottom: 104px !important;
}

.p-l-13 {
  padding-left: 104px !important;
}

.p-r-13 {
  padding-right: 104px !important;
}

/* GAP */
.gap-13 {
  gap: 104px !important;
}

.gap-y-13 {
  gap: 104px 0 !important;
}

.gap-x-13 {
  gap: 0 104px !important;
}

.gap-13-0 {
  gap: 104px 0 !important;
}

.gap-13-1 {
  gap: 104px 8px !important;
}

.gap-13-2 {
  gap: 104px 16px !important;
}

.gap-13-3 {
  gap: 104px 24px !important;
}

.gap-13-4 {
  gap: 104px 32px !important;
}

.gap-13-5 {
  gap: 104px 40px !important;
}

.gap-13-6 {
  gap: 104px 48px !important;
}

.gap-13-7 {
  gap: 104px 56px !important;
}

.gap-13-8 {
  gap: 104px 64px !important;
}

.gap-13-9 {
  gap: 104px 72px !important;
}

.gap-13-10 {
  gap: 104px 80px !important;
}

.gap-13-11 {
  gap: 104px 88px !important;
}

.gap-13-12 {
  gap: 104px 96px !important;
}

.gap-13-13 {
  gap: 104px 104px !important;
}

.gap-13-auto {
  gap: 104px auto !important;
}

/* LETTER SPACING */
.letter-spacing-13 {
  letter-spacing: 5.2px !important;
}

/* MARGIN */
.m-auto {
  margin: auto !important;
}

.m-x-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.m-y-auto {
  margin-bottom: auto !important;
  margin-top: auto !important;
}

.m-t-auto {
  margin-top: auto !important;
}

.m-b-auto {
  margin-bottom: auto !important;
}

.m-l-auto {
  margin-left: auto !important;
}

.m-r-auto {
  margin-right: auto !important;
}

/* PADDING */
.p-auto {
  padding: auto !important;
}

.p-x-auto {
  padding-left: auto !important;
  padding-right: auto !important;
}

.p-y-auto {
  padding-bottom: auto !important;
  padding-top: auto !important;
}

.p-t-auto {
  padding-top: auto !important;
}

.p-b-auto {
  padding-bottom: auto !important;
}

.p-l-auto {
  padding-left: auto !important;
}

.p-r-auto {
  padding-right: auto !important;
}

/* GAP */
.gap-auto {
  gap: auto !important;
}

.gap-y-auto {
  gap: auto 0 !important;
}

.gap-x-auto {
  gap: 0 auto !important;
}

.gap-auto-0 {
  gap: auto 0 !important;
}

.gap-auto-1 {
  gap: auto 8px !important;
}

.gap-auto-2 {
  gap: auto 16px !important;
}

.gap-auto-3 {
  gap: auto 24px !important;
}

.gap-auto-4 {
  gap: auto 32px !important;
}

.gap-auto-5 {
  gap: auto 40px !important;
}

.gap-auto-6 {
  gap: auto 48px !important;
}

.gap-auto-7 {
  gap: auto 56px !important;
}

.gap-auto-8 {
  gap: auto 64px !important;
}

.gap-auto-9 {
  gap: auto 72px !important;
}

.gap-auto-10 {
  gap: auto 80px !important;
}

.gap-auto-11 {
  gap: auto 88px !important;
}

.gap-auto-12 {
  gap: auto 96px !important;
}

.gap-auto-13 {
  gap: auto 104px !important;
}

.gap-auto-auto {
  gap: auto auto !important;
}

/* LETTER SPACING */
.letter-spacing-auto {
  letter-spacing: calc(auto * 0.05) !important;
}

.d-grid {
  display: grid;
  gap: 16px;
}

/*  - USAGE -
    Use .d-grid.grid--2 on divs that always have 2 columns
    Add .grid--md-4 to some div that have 4 columns from breakpoints bigger than md (inclusive)

    You can use numbers present in $grid-n-columns, or add custom ones to the list.
*/
.grid--1 {
  grid-template-columns: repeat(1, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-1 {
  grid-column-start: -2;
}

.grid--2 {
  grid-template-columns: repeat(2, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-2 {
  grid-column-start: -3;
}

.grid--3 {
  grid-template-columns: repeat(3, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-3 {
  grid-column-start: -4;
}

.grid--4 {
  grid-template-columns: repeat(4, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-4 {
  grid-column-start: -5;
}

.grid--5 {
  grid-template-columns: repeat(5, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-5 {
  grid-column-start: -6;
}

.grid--6 {
  grid-template-columns: repeat(6, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-6 {
  grid-column-start: -7;
}

.grid--7 {
  grid-template-columns: repeat(7, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-7 {
  grid-column-start: -8;
}

.grid--8 {
  grid-template-columns: repeat(8, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-8 {
  grid-column-start: -9;
}

.grid--9 {
  grid-template-columns: repeat(9, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-9 {
  grid-column-start: -10;
}

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

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-10 {
  grid-column-start: -11;
}

.grid--11 {
  grid-template-columns: repeat(11, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-11 {
  grid-column-start: -12;
}

.grid--12 {
  grid-template-columns: repeat(12, 1fr);
}

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

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

/* Use .grid--start-right-4 if element has a .grid--span-4
/  and it will appear on the right side of the grid.
/  — $n-col should be its span size on the grid
/  */
.grid--start-right-12 {
  grid-column-start: -13;
}

/**
 * This stylesheet has 4 sections:
 *
 * 1.Ratios - Where are defined several default ratios
 *   You can use those with this functon:
 *     - ratio-by-name()
 *       to use the default ratio (1.125)
 *       eg.: ratio-by-name(minor-third) // = 1.2
 *
 * 2.Default Settings - Where are defined the default base, breakpoints
 * and ratios for each breakpoint
 *
 * 3.Functions - Where are defined functions that we need to calculate
 * the size taking into account the base and the breakpoint ratio
 *
 * 4.Mixin - Where are defined the mixin
 *   This mixin allows you to set a step and it automatically calculates
 * the sizes for all the defined breakpoints taking into account the ratio
 * of each breakpoint
 *
 *
 * HOW TO USE:
 * 1. Set your own settings ON YOUR FONTS FILE
 *    or just use the defaults (in this case, you can skip this step)
 *    eg.: $scale: (
 *           base: 16px,
 *           breakpoints: (
 *             $b_initial: ratio-by-name(),
 *             $b_very-small: 1.025,
 *             $b_small: ratio-by-name()
 *           )
 *         );
 *
 * 2. Include the mixin in your class
 *    eg.: h1 {
 *           @include font-scale(6);
 *         }
 */
/* stylelint-disable number-max-precision */
/* RATIOS */
/* DEFAULT SETTINGS */
/* FUNCTIONS */
/* Calculate pow -- this is needed in the font-scale-get-size function */
/* Calculate font-size for a specific step and breakpoint */
/* MIXIN
 * - This will define the font-size for every breakpoint you set in $scale
 */
/**
 * This variables are only assigned to FONT classes.
 *
 * The accent colors of the project are already assigned to internal variables
 * in the colors stylesheet of the styleguide
 * (e.g.: theme-color("primary"), neutral-color("lightest"),...).
 *
 *
 * The name of this variables should follow this rule:
 * $c_nav-text
 *
 *
 * The variable begins with the initial of the variable type c (color),
 * followed by the element, and the section of the element where will be applied
 * the color.
 *
 * $c_nav
 *
 * In this case this variable represents the background color of the element.
 */
/* TEXT COLORS */
/* stylelint-disable selector-no-vendor-prefix */
/**
 * Sheet to import fonts, define typography variables,
 * configure text styles, and provide typography utilities.
 *
 * Structure of the file
 *
 * 1. Fonts
 *    — Import font families and define their Sass variables.
 *    — Provide the ff() function to retrieve the mapped font family.
 *    — Configure the --f-family variable through font-family (.ff-*) utility classes.
 *
 * 2. Font weights
 *    — Define the available font-weight values.
 *    — Map semantic weights to each font family.
 *    — Provide the fw() function to retrieve the mapped font weight.
 *    — Generate .fw-* utility classes.
 *
 * 3. Font scale
 *    — Configure the responsive type scale and base breakpoints.
 *
 * 4. Text styles
 *    — Configure the type scale and font settings for headings and body text.
 *    — Generate .fs-* utility classes for text sizes.
 *    — Generate .fs-step* utility classes for scale-based font sizes.
 *
 * 5. Element styles
 *    — Configure typography for:
 *      - Labels
 *      - Notes
 *      - Inputs
 *      - Links
 *      - Lists
 *
 * 6. Typography utilities
 *    — Provide text color utilities (.text--*).
 *    — Provide text transformation utilities:
 *      - .uppercase
 *      - .capitalize
 *      - .line-through
 *
 *
 * Rules
 *
 * - Whenever you want to set a font family, USE the mixin ONLY.
 *     Example:
 *       @include font-family("primary");
 *   This allows the .fw-* utility classes to resolve the correct
 *   font weight through the fw() function.
 *
 * - Use fw() instead of hardcoding font-weight values whenever the
 *   weight depends on the selected font family.
 *
 * - Keep font-family declarations and their corresponding --f-family
 *   values in sync.
 *
 * - Use the configured font scale through font-scale() rather than
 *   hardcoding font sizes where a scale step is appropriate.
 *
 * - Add new font families to the font-weight mapping so that all
 *   supported families work consistently with fw().
 */
/* FONTS */
.ff-primary {
  --f-family: Quicksand, sans-serif;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
}

.ff-secondary {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
}

/* FONT WEIGHTS */
/* FONT SCALE */
/* TEXT STYLES */
body {
  --f-family: $f_family--primary;
  font-family: var(--f-family);
  -moz-osx-font-smoothing: grayscale; /* (For Firefox) */
  -webkit-font-smoothing: antialiased; /* (For Chrome and Safari) */
  font-weight: 500;
  font-optical-sizing: auto;
  line-height: auto;
  transition: all 2s ease-in-out;
  color: #1C2727;
}
@media (min-width: 0) {
  body {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  body {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  body {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
body * {
  font-family: var(--f-family);
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
p {
  --f-family: Quicksand, sans-serif;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  p {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  p {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  p {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-p {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .fs-p {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .fs-p {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
h6, .menu-sidenav .sidenav .nav-list a, .menu-sidenav .sidenav .nav-list-container .nav-list li .dropdown-button, .nav-list-container .menu-sidenav .sidenav .nav-list li .dropdown-button {
  --f-family: Quicksand, sans-serif;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  h6, .menu-sidenav .sidenav .nav-list a, .menu-sidenav .sidenav .nav-list-container .nav-list li .dropdown-button, .nav-list-container .menu-sidenav .sidenav .nav-list li .dropdown-button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  h6, .menu-sidenav .sidenav .nav-list a, .menu-sidenav .sidenav .nav-list-container .nav-list li .dropdown-button, .nav-list-container .menu-sidenav .sidenav .nav-list li .dropdown-button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  h6, .menu-sidenav .sidenav .nav-list a, .menu-sidenav .sidenav .nav-list-container .nav-list li .dropdown-button, .nav-list-container .menu-sidenav .sidenav .nav-list li .dropdown-button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-h6 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .fs-h6 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .fs-h6 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
h5 {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  h5 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 600px) {
  h5 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 1200px) {
  h5 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-h5 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 600px) {
  .fs-h5 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 1200px) {
  .fs-h5 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
h4, .ne-subtitle {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  color: #D9825B;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  h4, .ne-subtitle {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 600px) {
  h4, .ne-subtitle {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 1200px) {
  h4, .ne-subtitle {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-h4 {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 600px) {
  .fs-h4 {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 1200px) {
  .fs-h4 {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
h3 {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  color: #D9825B;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  h3 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}
@media (min-width: 600px) {
  h3 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}
@media (min-width: 1200px) {
  h3 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-h3 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}
@media (min-width: 600px) {
  .fs-h3 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}
@media (min-width: 1200px) {
  .fs-h3 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
h2 {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  color: #D9825B;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  h2 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 600px) {
  h2 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 1200px) {
  h2 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-h2 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 600px) {
  .fs-h2 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 1200px) {
  .fs-h2 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}

/*
  p = 16px Regular
  h6 = 16px Bold // DEFAULT 18px
  h5 = 18px Medium // DEFAULT 20
  h4 = 20px Medium // DEFAULT 23
  h3 = 25px Medium
  h2 = 28px Regular
  h1 = 32px Medium
*/
h1 {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  color: #D9825B;
  transition: font-size 0.2s ease-in-out;
}
@media (min-width: 0) {
  h1 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}
@media (min-width: 600px) {
  h1 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}
@media (min-width: 1200px) {
  h1 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}

/*
  .fs-p = 16
  .fs-h6 = 16 // DEFAULT 18
  .fs-h5 = 18 // DEFAULT 20
  .fs-h4 = 20 // DEFAULT 23
  ...
*/
@media (min-width: 0) {
  .fs-h1 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}
@media (min-width: 600px) {
  .fs-h1 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}
@media (min-width: 1200px) {
  .fs-h1 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}

@media (min-width: 0) {
  p,
  .fs-body {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  p,
  .fs-body {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  p,
  .fs-body {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

@media (min-width: 0) {
  .fs-body--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 600px) {
  .fs-body--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 1200px) {
  .fs-body--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}

@media (min-width: 0) {
  .fs-body--lg {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 600px) {
  .fs-body--lg {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 1200px) {
  .fs-body--lg {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}

p,
.fs-body,
.fs-body--sm,
.fs-body--lg {
  --f-family: Quicksand, sans-serif;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  line-height: 1.25;
}

/*
  .fs-step-4 = 10
  .fs-step-3 = 11
  .fs-step-2 = 12
  .fs-step-1 = 14
  .fs-step0 = 16 --- p, h6  // DEFAULT p
  .fs-step1 = 18 --- h5     // DEFAULT h6
  .fs-step2 = 20 --- h4     // DEFAULT h5
  .fs-step3 = 23            // DEFAULT h4
  .fs-step4 = 25 --- h3
  .fs-step5 = 28 --- h2
  .fs-step6 = 32 --- h1
*/
@media (min-width: 0) {
  .fs-step-4 {
    font-size: 9.9887212315px;
    letter-spacing: 0.1997744246px;
  }
}
@media (min-width: 600px) {
  .fs-step-4 {
    font-size: 9.9887212315px;
    letter-spacing: 0.1997744246px;
  }
}
@media (min-width: 1200px) {
  .fs-step-4 {
    font-size: 9.9887212315px;
    letter-spacing: 0.1997744246px;
  }
}

@media (min-width: 0) {
  .fs-step-3 {
    font-size: 11.2373113855px;
    letter-spacing: 0.2247462277px;
  }
}
@media (min-width: 600px) {
  .fs-step-3 {
    font-size: 11.2373113855px;
    letter-spacing: 0.2247462277px;
  }
}
@media (min-width: 1200px) {
  .fs-step-3 {
    font-size: 11.2373113855px;
    letter-spacing: 0.2247462277px;
  }
}

@media (min-width: 0) {
  .fs-step-2 {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 600px) {
  .fs-step-2 {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 1200px) {
  .fs-step-2 {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}

@media (min-width: 0) {
  .fs-step-1 {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 600px) {
  .fs-step-1 {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 1200px) {
  .fs-step-1 {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}

@media (min-width: 0) {
  .fs-step0 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .fs-step0 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .fs-step0 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

@media (min-width: 0) {
  .fs-step1 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 600px) {
  .fs-step1 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 1200px) {
  .fs-step1 {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}

@media (min-width: 0) {
  .fs-step2 {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 600px) {
  .fs-step2 {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 1200px) {
  .fs-step2 {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}

@media (min-width: 0) {
  .fs-step3 {
    font-size: 22.78125px;
    letter-spacing: 0.455625px;
  }
}
@media (min-width: 600px) {
  .fs-step3 {
    font-size: 22.78125px;
    letter-spacing: 0.455625px;
  }
}
@media (min-width: 1200px) {
  .fs-step3 {
    font-size: 22.78125px;
    letter-spacing: 0.455625px;
  }
}

@media (min-width: 0) {
  .fs-step4 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}
@media (min-width: 600px) {
  .fs-step4 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}
@media (min-width: 1200px) {
  .fs-step4 {
    font-size: 25.62890625px;
    letter-spacing: 0.512578125px;
  }
}

@media (min-width: 0) {
  .fs-step5 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 600px) {
  .fs-step5 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 1200px) {
  .fs-step5 {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}

@media (min-width: 0) {
  .fs-step6 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}
@media (min-width: 600px) {
  .fs-step6 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}
@media (min-width: 1200px) {
  .fs-step6 {
    font-size: 32.4365844727px;
    letter-spacing: 0.6487316895px;
  }
}

/* ELEMENT STYLES */
label,
.label-text {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
}
@media (min-width: 0) {
  label,
  .label-text {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 600px) {
  label,
  .label-text {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 1200px) {
  label,
  .label-text {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}

.note-text, .breadcrumb li a, .breadcrumb .nav-list-container .nav-list li .dropdown-button, .nav-list-container .nav-list .breadcrumb li .dropdown-button, .breadcrumb li, footer .copyright {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  color: #1C2727;
  font-weight: 500;
}
@media (min-width: 0) {
  .note-text, .breadcrumb li a, .breadcrumb .nav-list-container .nav-list li .dropdown-button, .nav-list-container .nav-list .breadcrumb li .dropdown-button, .breadcrumb li, footer .copyright {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 600px) {
  .note-text, .breadcrumb li a, .breadcrumb .nav-list-container .nav-list li .dropdown-button, .nav-list-container .nav-list .breadcrumb li .dropdown-button, .breadcrumb li, footer .copyright {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 1200px) {
  .note-text, .breadcrumb li a, .breadcrumb .nav-list-container .nav-list li .dropdown-button, .nav-list-container .nav-list .breadcrumb li .dropdown-button, .breadcrumb li, footer .copyright {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}

input,
textarea,
.input-text,
.select2-container--flat .select2-selection--single .select2-selection__rendered,
.select2-container--flat span.select2-search input {
  --f-family: Quicksand, sans-serif;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
}
@media (min-width: 0) {
  input,
  textarea,
  .input-text,
  .select2-container--flat .select2-selection--single .select2-selection__rendered,
  .select2-container--flat span.select2-search input {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  input,
  textarea,
  .input-text,
  .select2-container--flat .select2-selection--single .select2-selection__rendered,
  .select2-container--flat span.select2-search input {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  input,
  textarea,
  .input-text,
  .select2-container--flat .select2-selection--single .select2-selection__rendered,
  .select2-container--flat span.select2-search input {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
input::placeholder,
textarea::placeholder,
.input-text::placeholder,
.select2-container--flat .select2-selection--single .select2-selection__rendered::placeholder,
.select2-container--flat span.select2-search input::placeholder {
  font-weight: 300;
}

a:not([class*=btn]), .nav-list-container .nav-list li .dropdown-button:not([class*=btn]),
.link-text {
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  color: inherit;
  color: #519070;
  font-weight: 600;
}
a:not([class*=btn]) *, .nav-list-container .nav-list li .dropdown-button:not([class*=btn]) *,
.link-text * {
  pointer-events: none;
}

a:not([class*=btn]), .nav-list-container .nav-list li .dropdown-button:not([class*=btn]),
a:not([class*=btn]):hover,
a:not([class*=btn]):visited,
a:not([class*=btn]):link,
a:not([class*=btn]):active,
.link-text,
.link-text:hover,
.link-text:visited,
.link-text:link,
.link-text:active {
  color: #519070;
  text-decoration: none;
}

a:not([class*=btn]):hover, .nav-list-container .nav-list li .dropdown-button:not([class*=btn]):hover,
.link-text:hover {
  color: #D9825B;
  cursor: pointer;
}

@media (min-width: 0) {
  .link-text {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .link-text {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .link-text {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

@media (min-width: 0) {
  .link-text--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 600px) {
  .link-text--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 1200px) {
  .link-text--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}

@media (min-width: 0) {
  .link-text--xs {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 600px) {
  .link-text--xs {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 1200px) {
  .link-text--xs {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}

ul {
  list-style: "— ";
}
ul ul {
  list-style: disc;
}

ol {
  list-style: decimal-leading-zero;
}
ol ol {
  list-style: lower-latin;
}

ul,
ol {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-left: 0;
  padding-left: 2em;
}
@media (min-width: 0) {
  ul,
  ol {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  ul,
  ol {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  ul,
  ol {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
ul ::marker,
ol ::marker {
  color: #D9825B;
}

/* TYPOGRAPHY UTILITIES  */
.text--white {
  color: white;
}

.text--black {
  color: black;
}

.text--lightest {
  color: white;
}

.text--darkest {
  color: #1C2727;
}

.text--primary {
  color: #6FAF8F;
}

.text--secondary {
  color: #519070;
}

.text--accent {
  color: #D9825B;
}

.text--success {
  color: #A4C003;
}

.text--info {
  color: #8AB7EE;
}

.text--warning {
  color: #EC8327;
}

.text--danger {
  color: #A22719;
}

.text--light {
  color: #F7F3EC;
}

.text--dark {
  color: #2F3A3A;
}

.text--disabled {
  color: #DAEAE2;
}

.text--bg-container {
  color: #FBFAF7;
}

.text--blue {
  color: #007BFF;
}

.text--indigo {
  color: #6610F2;
}

.text--purple {
  color: #6F42C1;
}

.text--pink {
  color: #E83E8C;
}

.text--red {
  color: #DC3545;
}

.text--orange {
  color: #FD7E14;
}

.text--yellow {
  color: #FFC107;
}

.text--green {
  color: #28A745;
}

.text--teal {
  color: #20C997;
}

.text--cyan {
  color: #17A2B8;
}

.text--white {
  color: white;
}

.text--gray {
  color: #E0DDD6;
}

.text--gray-dark {
  color: #5E6460;
}

.uppercase, .ne-subtitle {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

.line-through {
  text-decoration: line-through;
}

/* Fixed classes */
.uppercase, .ne-subtitle {
  text-transform: uppercase;
}

.center {
  text-align: center;
}

.min-width-full {
  min-width: 100%;
}

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

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

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

.d-flex {
  display: flex;
  flex-wrap: wrap;
}

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

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

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

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

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

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

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

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

.align-center {
  align-items: center !important;
}

.align-baseline {
  align-items: baseline;
}

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

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

.place-self-end {
  place-self: end;
}

.relative {
  position: relative;
}

.border {
  border: solid 1px #519070;
}

.border-top {
  border-top: solid 1px #519070;
}

.border-left {
  border-left: solid 1px #519070;
}

.border-right {
  border-right: solid 1px #519070;
}

.border-bottom {
  border-bottom: solid 1px #519070;
}

.border-radius--0 {
  border-radius: 0;
}

.border-radius--1 {
  border-radius: 3px;
}

.border-radius--2 {
  border-radius: 8px;
}

.border-radius--3 {
  border-radius: 10px;
}

.border-radius--4 {
  border-radius: 20px;
}

.border-radius-tl--0 {
  border-top-left-radius: 0;
}

.border-radius-tl--1 {
  border-top-left-radius: 3px;
}

.border-radius-tl--2 {
  border-top-left-radius: 8px;
}

.border-radius-tl--3 {
  border-top-left-radius: 10px;
}

.border-radius-tl--4 {
  border-top-left-radius: 20px;
}

.border-radius-tr--0 {
  border-top-right-radius: 0;
}

.border-radius-tr--1 {
  border-top-right-radius: 3px;
}

.border-radius-tr--2 {
  border-top-right-radius: 8px;
}

.border-radius-tr--3 {
  border-top-right-radius: 10px;
}

.border-radius-tr--4 {
  border-top-right-radius: 20px;
}

.border-radius-br--0 {
  border-bottom-right-radius: 0;
}

.border-radius-br--1 {
  border-bottom-right-radius: 3px;
}

.border-radius-br--2 {
  border-bottom-right-radius: 8px;
}

.border-radius-br--3 {
  border-bottom-right-radius: 10px;
}

.border-radius-br--4 {
  border-bottom-right-radius: 20px;
}

.border-radius-bl--0 {
  border-bottom-left-radius: 0;
}

.border-radius-bl--1 {
  border-bottom-left-radius: 3px;
}

.border-radius-bl--2 {
  border-bottom-left-radius: 8px;
}

.border-radius-bl--3 {
  border-bottom-left-radius: 10px;
}

.border-radius-bl--4 {
  border-bottom-left-radius: 20px;
}

/* Containers */
.container-small {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  max-width: 658px;
  padding: 0 32px;
  width: 100%;
}

.container-medium, .navbar, .navbar-content {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  max-width: 1224px;
  padding: 0 32px;
  width: 100%;
}

.container-large {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  max-width: 1464px;
  padding: 0 32px;
  width: 100%;
}

.container--full-page {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin-bottom: 32px;
}

.box {
  background-color: #FBFAF7;
  border-radius: 0;
  padding: 16px;
}

/* Title */
.box-title {
  align-items: center;
  color: #6FAF8F;
  display: flex;
  gap: 16px;
  position: absolute;
  right: 24px;
  top: -24px;
}

/* container btns footer */
.container__btns-footer {
  display: flex;
  flex-flow: row-reverse wrap;
  justify-content: space-between;
}

.container__btns-footer--center {
  gap: 8px;
  justify-content: center !important;
}

/* Background */
.bg--primary {
  background-color: #6FAF8F;
}

.bg--secondary {
  background-color: #519070;
}

.bg--accent {
  background-color: #D9825B;
}

.bg--success {
  background-color: #A4C003;
}

.bg--info {
  background-color: #8AB7EE;
}

.bg--warning {
  background-color: #EC8327;
}

.bg--danger {
  background-color: #A22719;
}

.bg--light {
  background-color: #F7F3EC;
}

.bg--dark {
  background-color: #2F3A3A;
}

.bg--disabled {
  background-color: #DAEAE2;
}

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

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

.bg--100 {
  background-color: #FBFAF7;
}

.bg--200 {
  background-color: #F7F3EC;
}

.bg--300 {
  background-color: #E0DDD6;
}

.bg--400 {
  background-color: #BCBBB6;
}

.bg--500 {
  background-color: #8C8E88;
}

.bg--600 {
  background-color: #5E6460;
}

.bg--700 {
  background-color: #2F3A3A;
}

.bg--800 {
  background-color: #1C2727;
}

.bg--darkest {
  background-color: #1C2727;
}

/* Badges */
.badge--primary {
  background-color: #6FAF8F;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--primary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--primary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--primary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--secondary {
  background-color: #519070;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--secondary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--secondary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--secondary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--accent {
  background-color: #D9825B;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--accent {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--accent {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--accent {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--success {
  background-color: #A4C003;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--info {
  background-color: #8AB7EE;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--warning {
  background-color: #EC8327;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--danger {
  background-color: #A22719;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--light {
  background-color: #F7F3EC;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--dark {
  background-color: #2F3A3A;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--disabled {
  background-color: #DAEAE2;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--lightest {
  background-color: white;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--lightest {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--lightest {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--lightest {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--000 {
  background-color: white;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--000 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--000 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--000 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--100 {
  background-color: #FBFAF7;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--100 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--100 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--100 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--200 {
  background-color: #F7F3EC;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--200 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--200 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--200 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--300 {
  background-color: #E0DDD6;
  padding: 8px 24px;
  color: #1C2727;
}
@media (min-width: 0) {
  .badge--300 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--300 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--300 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--400 {
  background-color: #BCBBB6;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--400 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--400 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--400 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--500 {
  background-color: #8C8E88;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--500 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--500 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--500 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--600 {
  background-color: #5E6460;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--600 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--600 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--600 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--700 {
  background-color: #2F3A3A;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--700 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--700 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--700 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--800 {
  background-color: #1C2727;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--800 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--800 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--800 {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

.badge--darkest {
  background-color: #1C2727;
  padding: 8px 24px;
  color: white;
}
@media (min-width: 0) {
  .badge--darkest {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .badge--darkest {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .badge--darkest {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}

@media (min-width: 600px) {
  .box-title {
    right: 32px;
    top: -40px;
  }
}
/* stylelint-disable @stylistic/indentation */
/**
 * This variables are only assigned to BUTTONS.
 *
 * Some of these variables are used in the mixins and some others are used in the buttons.scss file.
 *
 * * How to declare variables:
 *     $a_name
 *
 *     a_: Should be the initial of the variable type
 *       b_  –— border
 *       fs_ –— font-size
 *       fw_ –— font-weight
 *       h_  –— height
 *       s_  –— size
 *
 *     name: Should be the name of the variable.
 *
 *     For more info on naming variables check the README file
 *
 * This sizes are based on the Material Design Guidelines (https://m3.material.io/components/buttons/specs)
 */
/* BUTTON SIZES */
/**
 * This variables are only assigned to BUTTONS.
 *
 * This file contains the colors of exceptions and states of the buttons used
 * in the buttons mixins and in the buttons.scss file.
 *
 * The accent colors of the project are already assigned to internal variables
 * (e.g.: theme-color("primary"), neutral-color("lightest"),...).
 *
 * The name of this variables should follow this rule:
 * $c_btn-text
 *
 * The variable begins with the initial of the variable type c (color),
 * followed by the element, and the section of the element where will be applied
 * the color.
 *
 * $c_btn
 *
 * In this case this variable represents the background color of the element.
 *
 * example:
 *   $c_btn-text--disabled: color of the text of the disabled button
 *   $c_btn-text--accent: color of the text of the button with accent theme
 *   $c_btn--primary: color of the background of the button with primary theme
 */
/* BUTTON COLORS */
/* Mixins Buttons */
/* Fix for Firefox */
@-moz-document url-prefix() { /* stylelint-disable-line */
  .btn {
    letter-spacing: 1px;
  }
}
/* Buttons */
.btn-primary, .btn, button {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #6FAF8F;
  border: 2px solid #6FAF8F;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-primary:hover, .btn:hover, button:hover, .btn-primary:active, .btn:active, button:active {
  background-color: rgb(94.6571428571, 150.5428571429, 122.6);
  border-color: rgb(94.6571428571, 150.5428571429, 122.6);
  color: white;
}
@media (min-width: 0) {
  .btn-primary, .btn, button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-primary, .btn, button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-primary, .btn, button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-primary:focus:not(:focus-visible), .btn:focus:not(:focus-visible), button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-primary:focus-visible, .btn:focus-visible, button:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-primary:active, .btn:active, button:active {
  border-radius: 12px;
}
.btn-primary i, .btn i, button i {
  margin-bottom: -0.2em;
}
.btn-primary i:before, .btn i:before, button i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-primary {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #6FAF8F;
  border-radius: 100px;
  box-sizing: border-box;
  color: #6FAF8F;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-primary:hover, .btn-outline-primary:active {
  background-color: rgb(204.6, 227, 215.8);
  border-color: #6FAF8F;
  color: #6FAF8F;
}
@media (min-width: 0) {
  .btn-outline-primary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-primary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-primary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-primary:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-primary:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-primary:active {
  border-radius: 12px;
}
.btn-outline-primary i {
  margin-bottom: -0.2em;
}
.btn-outline-primary i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-secondary {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #519070;
  border: 2px solid #519070;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-secondary:hover, .btn-secondary:active {
  background-color: rgb(70.6571428571, 125.7428571429, 97.8);
  border-color: rgb(70.6571428571, 125.7428571429, 97.8);
  color: white;
}
@media (min-width: 0) {
  .btn-secondary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-secondary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-secondary {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-secondary:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-secondary:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-secondary:active {
  border-radius: 12px;
}
.btn-secondary i {
  margin-bottom: -0.2em;
}
.btn-secondary i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-secondary, .btn-outline, .menu-btn {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #519070;
  border-radius: 100px;
  box-sizing: border-box;
  color: #519070;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-secondary:hover, .btn-outline:hover, .menu-btn:hover, .btn-outline-secondary:active, .btn-outline:active, .menu-btn:active {
  background-color: rgb(194.1, 216.15, 204.95);
  border-color: #519070;
  color: #519070;
}
@media (min-width: 0) {
  .btn-outline-secondary, .btn-outline, .menu-btn {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-secondary, .btn-outline, .menu-btn {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-secondary, .btn-outline, .menu-btn {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-secondary:focus:not(:focus-visible), .btn-outline:focus:not(:focus-visible), .menu-btn:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-secondary:focus-visible, .btn-outline:focus-visible, .menu-btn:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-secondary:active, .btn-outline:active, .menu-btn:active {
  border-radius: 12px;
}
.btn-outline-secondary i, .btn-outline i, .menu-btn i {
  margin-bottom: -0.2em;
}
.btn-outline-secondary i:before, .btn-outline i:before, .menu-btn i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-accent, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #D9825B;
  border: 2px solid #D9825B;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-accent:hover, input[type=file]:hover::file-selector-button, input[type=file]:hover::-webkit-file-upload-button, .btn-accent:active, input[type=file]:active::file-selector-button, input[type=file]:active::-webkit-file-upload-button {
  background-color: rgb(179.4571428571, 114.5428571429, 81);
  border-color: rgb(179.4571428571, 114.5428571429, 81);
  color: white;
}
@media (min-width: 0) {
  .btn-accent, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-accent, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-accent, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-accent:focus:not(:focus-visible), input[type=file]:focus:not(:focus-visible)::file-selector-button, input[type=file]:focus:not(:focus-visible)::-webkit-file-upload-button {
  outline: none;
  box-shadow: none;
}
.btn-accent:focus-visible, input[type=file]:focus-visible::file-selector-button, input[type=file]:focus-visible::-webkit-file-upload-button {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-accent:active, input[type=file]:active::file-selector-button, input[type=file]:active::-webkit-file-upload-button {
  border-radius: 12px;
}
.btn-accent i, input[type=file]::file-selector-button i, input[type=file]::-webkit-file-upload-button i {
  margin-bottom: -0.2em;
}
.btn-accent i:before, input[type=file]::file-selector-button i:before, input[type=file]::-webkit-file-upload-button i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-accent {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #D9825B;
  border-radius: 100px;
  box-sizing: border-box;
  color: #D9825B;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-accent:hover, .btn-outline-accent:active {
  background-color: rgb(241.7, 211.25, 197.6);
  border-color: #D9825B;
  color: #D9825B;
}
@media (min-width: 0) {
  .btn-outline-accent {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-accent {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-accent {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-accent:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-accent:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-accent:active {
  border-radius: 12px;
}
.btn-outline-accent i {
  margin-bottom: -0.2em;
}
.btn-outline-accent i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-success {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #A4C003;
  border: 2px solid #A4C003;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-success:hover, .btn-success:active {
  background-color: rgb(137.0571428571, 164.1428571429, 10.6);
  border-color: rgb(137.0571428571, 164.1428571429, 10.6);
  color: white;
}
@media (min-width: 0) {
  .btn-success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-success:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-success:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-success:active {
  border-radius: 12px;
}
.btn-success i {
  margin-bottom: -0.2em;
}
.btn-success i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-success {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #A4C003;
  border-radius: 100px;
  box-sizing: border-box;
  color: #A4C003;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-success:hover, .btn-outline-success:active {
  background-color: rgb(223.15, 232.95, 166.8);
  border-color: #A4C003;
  color: #A4C003;
}
@media (min-width: 0) {
  .btn-outline-success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-success {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-success:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-success:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-success:active {
  border-radius: 12px;
}
.btn-outline-success i {
  margin-bottom: -0.2em;
}
.btn-outline-success i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-info {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #8AB7EE;
  border: 2px solid #8AB7EE;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-info:hover, .btn-info:active {
  background-color: rgb(116.2571428571, 156.9428571429, 198.6);
  border-color: rgb(116.2571428571, 156.9428571429, 198.6);
  color: white;
}
@media (min-width: 0) {
  .btn-info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-info:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-info:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-info:active {
  border-radius: 12px;
}
.btn-info i {
  margin-bottom: -0.2em;
}
.btn-info i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-info {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #8AB7EE;
  border-radius: 100px;
  box-sizing: border-box;
  color: #8AB7EE;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-info:hover, .btn-outline-info:active {
  background-color: rgb(214.05, 229.8, 249.05);
  border-color: #8AB7EE;
  color: #8AB7EE;
}
@media (min-width: 0) {
  .btn-outline-info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-info {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-info:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-info:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-info:active {
  border-radius: 12px;
}
.btn-outline-info i {
  margin-bottom: -0.2em;
}
.btn-outline-info i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-warning {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #EC8327;
  border: 2px solid #EC8327;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-warning:hover, .btn-warning:active {
  background-color: rgb(194.6571428571, 115.3428571429, 39.4);
  border-color: rgb(194.6571428571, 115.3428571429, 39.4);
  color: white;
}
@media (min-width: 0) {
  .btn-warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-warning:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-warning:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-warning:active {
  border-radius: 12px;
}
.btn-warning i {
  margin-bottom: -0.2em;
}
.btn-warning i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-warning {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #EC8327;
  border-radius: 100px;
  box-sizing: border-box;
  color: #EC8327;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-warning:hover, .btn-outline-warning:active {
  background-color: rgb(248.35, 211.6, 179.4);
  border-color: #EC8327;
  color: #EC8327;
}
@media (min-width: 0) {
  .btn-outline-warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-warning {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-warning:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-warning:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-warning:active {
  border-radius: 12px;
}
.btn-outline-warning i {
  margin-bottom: -0.2em;
}
.btn-outline-warning i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-danger {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #A22719;
  border: 2px solid #A22719;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-danger:hover, .btn-danger:active {
  background-color: rgb(135.4571428571, 41.7428571429, 28.2);
  border-color: rgb(135.4571428571, 41.7428571429, 28.2);
  color: white;
}
@media (min-width: 0) {
  .btn-danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-danger:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-danger:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-danger:active {
  border-radius: 12px;
}
.btn-danger i {
  margin-bottom: -0.2em;
}
.btn-danger i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-danger {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #A22719;
  border-radius: 100px;
  box-sizing: border-box;
  color: #A22719;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-danger:hover, .btn-outline-danger:active {
  background-color: rgb(222.45, 179.4, 174.5);
  border-color: #A22719;
  color: #A22719;
}
@media (min-width: 0) {
  .btn-outline-danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-danger {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-danger:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-danger:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-danger:active {
  border-radius: 12px;
}
.btn-outline-danger i {
  margin-bottom: -0.2em;
}
.btn-outline-danger i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-light {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #F7F3EC;
  border: 2px solid #F7F3EC;
  border-radius: 100px;
  box-sizing: border-box;
  color: #1C2727;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-light:hover, .btn-light:active {
  background-color: rgb(203.4571428571, 204.9428571429, 197);
  border-color: rgb(203.4571428571, 204.9428571429, 197);
  color: #1C2727;
}
@media (min-width: 0) {
  .btn-light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-light:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-light:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-light:active {
  border-radius: 12px;
}
.btn-light i {
  margin-bottom: -0.2em;
}
.btn-light i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-light {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #F7F3EC;
  border-radius: 100px;
  box-sizing: border-box;
  color: #F7F3EC;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-light:hover, .btn-outline-light:active {
  background-color: rgb(252.2, 250.8, 248.35);
  border-color: #F7F3EC;
  color: #F7F3EC;
}
@media (min-width: 0) {
  .btn-outline-light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-light {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-light:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-light:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-light:active {
  border-radius: 12px;
}
.btn-outline-light i {
  margin-bottom: -0.2em;
}
.btn-outline-light i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-dark {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #2F3A3A;
  border: 2px solid #2F3A3A;
  border-radius: 100px;
  box-sizing: border-box;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
}
.btn-dark:hover, .btn-dark:active {
  background-color: rgb(67.8, 77.7, 77.7);
  border-color: rgb(67.8, 77.7, 77.7);
  color: white;
}
@media (min-width: 0) {
  .btn-dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-dark:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-dark:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-dark:active {
  border-radius: 12px;
}
.btn-dark i {
  margin-bottom: -0.2em;
}
.btn-dark i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-dark {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #2F3A3A;
  border-radius: 100px;
  box-sizing: border-box;
  color: #2F3A3A;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
}
.btn-outline-dark:hover, .btn-outline-dark:active {
  background-color: rgb(182.2, 186.05, 186.05);
  border-color: #2F3A3A;
  color: #2F3A3A;
}
@media (min-width: 0) {
  .btn-outline-dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-dark {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-dark:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}
.btn-outline-dark:focus-visible {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-dark:active {
  border-radius: 12px;
}
.btn-outline-dark i {
  margin-bottom: -0.2em;
}
.btn-outline-dark i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, button:disabled.btn--xl, button[class^=btn-outline].btn--xl:disabled,
button[class*=" btn-outline"].btn--xl:disabled,
.btn:disabled.btn--xl,
.btn[class^=btn-outline].btn--xl:disabled,
.btn[class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--lg, button[class^=btn-outline].btn--lg:disabled,
button[class*=" btn-outline"].btn--lg:disabled,
.btn:disabled.btn--lg,
.btn[class^=btn-outline].btn--lg:disabled,
.btn[class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--sm, button[class^=btn-outline].btn--sm:disabled,
button[class*=" btn-outline"].btn--sm:disabled,
.btn:disabled.btn--sm,
.btn[class^=btn-outline].btn--sm:disabled,
.btn[class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--xs, button[class^=btn-outline].btn--xs:disabled,
button[class*=" btn-outline"].btn--xs:disabled,
.btn:disabled.btn--xs,
.btn[class^=btn-outline].btn--xs:disabled,
.btn[class*=" btn-outline"].btn--xs:disabled, button:disabled,
.btn:disabled {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: #DAEAE2;
  border: 2px solid #DAEAE2;
  border-radius: 100px;
  box-sizing: border-box;
  color: #1C2727;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  color: rgb(180.2571428571, 197.7428571429, 189);
  pointer-events: none;
}
.btn-disabled:hover, input[type=file]:hover:disabled::file-selector-button, input[type=file]:hover:disabled::-webkit-file-upload-button, button:hover:disabled,
.btn:hover:disabled, .btn-disabled:active, input[type=file]:active:disabled::file-selector-button, input[type=file]:active:disabled::-webkit-file-upload-button, button:active:disabled,
.btn:active:disabled {
  background-color: rgb(180.2571428571, 197.7428571429, 189);
  border-color: rgb(180.2571428571, 197.7428571429, 189);
  color: #1C2727;
}
@media (min-width: 0) {
  .btn-disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, button:disabled.btn--xl, button[class^=btn-outline].btn--xl:disabled,
  button[class*=" btn-outline"].btn--xl:disabled,
  .btn:disabled.btn--xl,
  .btn[class^=btn-outline].btn--xl:disabled,
  .btn[class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--lg, button[class^=btn-outline].btn--lg:disabled,
  button[class*=" btn-outline"].btn--lg:disabled,
  .btn:disabled.btn--lg,
  .btn[class^=btn-outline].btn--lg:disabled,
  .btn[class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--sm, button[class^=btn-outline].btn--sm:disabled,
  button[class*=" btn-outline"].btn--sm:disabled,
  .btn:disabled.btn--sm,
  .btn[class^=btn-outline].btn--sm:disabled,
  .btn[class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--xs, button[class^=btn-outline].btn--xs:disabled,
  button[class*=" btn-outline"].btn--xs:disabled,
  .btn:disabled.btn--xs,
  .btn[class^=btn-outline].btn--xs:disabled,
  .btn[class*=" btn-outline"].btn--xs:disabled, button:disabled,
  .btn:disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, button:disabled.btn--xl, button[class^=btn-outline].btn--xl:disabled,
  button[class*=" btn-outline"].btn--xl:disabled,
  .btn:disabled.btn--xl,
  .btn[class^=btn-outline].btn--xl:disabled,
  .btn[class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--lg, button[class^=btn-outline].btn--lg:disabled,
  button[class*=" btn-outline"].btn--lg:disabled,
  .btn:disabled.btn--lg,
  .btn[class^=btn-outline].btn--lg:disabled,
  .btn[class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--sm, button[class^=btn-outline].btn--sm:disabled,
  button[class*=" btn-outline"].btn--sm:disabled,
  .btn:disabled.btn--sm,
  .btn[class^=btn-outline].btn--sm:disabled,
  .btn[class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--xs, button[class^=btn-outline].btn--xs:disabled,
  button[class*=" btn-outline"].btn--xs:disabled,
  .btn:disabled.btn--xs,
  .btn[class^=btn-outline].btn--xs:disabled,
  .btn[class*=" btn-outline"].btn--xs:disabled, button:disabled,
  .btn:disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, button:disabled.btn--xl, button[class^=btn-outline].btn--xl:disabled,
  button[class*=" btn-outline"].btn--xl:disabled,
  .btn:disabled.btn--xl,
  .btn[class^=btn-outline].btn--xl:disabled,
  .btn[class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--lg, button[class^=btn-outline].btn--lg:disabled,
  button[class*=" btn-outline"].btn--lg:disabled,
  .btn:disabled.btn--lg,
  .btn[class^=btn-outline].btn--lg:disabled,
  .btn[class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--sm, button[class^=btn-outline].btn--sm:disabled,
  button[class*=" btn-outline"].btn--sm:disabled,
  .btn:disabled.btn--sm,
  .btn[class^=btn-outline].btn--sm:disabled,
  .btn[class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--xs, button[class^=btn-outline].btn--xs:disabled,
  button[class*=" btn-outline"].btn--xs:disabled,
  .btn:disabled.btn--xs,
  .btn[class^=btn-outline].btn--xs:disabled,
  .btn[class*=" btn-outline"].btn--xs:disabled, button:disabled,
  .btn:disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-disabled:focus:not(:focus-visible), input[type=file]:focus:not(:focus-visible):disabled::file-selector-button, input[type=file]:focus:not(:focus-visible):disabled::-webkit-file-upload-button, button:focus:not(:focus-visible):disabled,
.btn:focus:not(:focus-visible):disabled {
  outline: none;
  box-shadow: none;
}
.btn-disabled:focus-visible, input[type=file]:focus-visible:disabled::file-selector-button, input[type=file]:focus-visible:disabled::-webkit-file-upload-button, button:focus-visible:disabled,
.btn:focus-visible:disabled {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-disabled:active, input[type=file]:active:disabled::file-selector-button, input[type=file]:active:disabled::-webkit-file-upload-button, button:active:disabled,
.btn:active:disabled {
  border-radius: 12px;
}
.btn-disabled i, input[type=file]:disabled::file-selector-button i, input[type=file]:disabled::-webkit-file-upload-button i, button:disabled.btn--xl i, button[class^=btn-outline].btn--xl:disabled i,
button[class*=" btn-outline"].btn--xl:disabled i, button:disabled.btn--lg i, button[class^=btn-outline].btn--lg:disabled i,
button[class*=" btn-outline"].btn--lg:disabled i, button:disabled.btn--sm i, button[class^=btn-outline].btn--sm:disabled i,
button[class*=" btn-outline"].btn--sm:disabled i, button:disabled.btn--xs i, button[class^=btn-outline].btn--xs:disabled i,
button[class*=" btn-outline"].btn--xs:disabled i, button:disabled i,
.btn:disabled i {
  margin-bottom: -0.2em;
}
.btn-disabled i:before, input[type=file]:disabled::file-selector-button i:before, input[type=file]:disabled::-webkit-file-upload-button i:before, button:disabled.btn--xl i:before, button[class^=btn-outline].btn--xl:disabled i:before,
button[class*=" btn-outline"].btn--xl:disabled i:before, button:disabled.btn--lg i:before, button[class^=btn-outline].btn--lg:disabled i:before,
button[class*=" btn-outline"].btn--lg:disabled i:before, button:disabled.btn--sm i:before, button[class^=btn-outline].btn--sm:disabled i:before,
button[class*=" btn-outline"].btn--sm:disabled i:before, button:disabled.btn--xs i:before, button[class^=btn-outline].btn--xs:disabled i:before,
button[class*=" btn-outline"].btn--xs:disabled i:before, button:disabled i:before,
.btn:disabled i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-outline-disabled, button[class^=btn-outline]:disabled.btn--xl,
button[class*=" btn-outline"]:disabled.btn--xl,
[class^=btn-outline]:disabled.btn--xl,
[class^=btn-outline].btn--xl:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
[class^=btn-outline].btn.btn--xl:disabled,
[class*=" btn-outline"]:disabled.btn--xl,
[class*=" btn-outline"].btn--xl:disabled,
[class*=" btn-outline"].btn.btn--xl:disabled, button[class^=btn-outline]:disabled.btn--lg,
button[class*=" btn-outline"]:disabled.btn--lg,
[class^=btn-outline]:disabled.btn--lg,
[class^=btn-outline].btn--lg:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
[class^=btn-outline].btn.btn--lg:disabled,
[class*=" btn-outline"]:disabled.btn--lg,
[class*=" btn-outline"].btn--lg:disabled,
[class*=" btn-outline"].btn.btn--lg:disabled, button[class^=btn-outline]:disabled.btn--sm,
button[class*=" btn-outline"]:disabled.btn--sm,
[class^=btn-outline]:disabled.btn--sm,
[class^=btn-outline].btn--sm:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
[class^=btn-outline].btn.btn--sm:disabled,
[class*=" btn-outline"]:disabled.btn--sm,
[class*=" btn-outline"].btn--sm:disabled,
[class*=" btn-outline"].btn.btn--sm:disabled, button[class^=btn-outline]:disabled.btn--xs,
button[class*=" btn-outline"]:disabled.btn--xs,
[class^=btn-outline]:disabled.btn--xs,
input[class^=btn-outline][type=file]:disabled::file-selector-button,
input[class^=btn-outline][type=file]:disabled::-webkit-file-upload-button,
[class^=btn-outline].btn--xs:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
[class^=btn-outline].btn.btn--xs:disabled,
[class*=" btn-outline"]:disabled.btn--xs,
input[class*=" btn-outline"][type=file]:disabled::file-selector-button,
input[class*=" btn-outline"][type=file]:disabled::-webkit-file-upload-button,
[class*=" btn-outline"].btn--xs:disabled,
[class*=" btn-outline"].btn.btn--xs:disabled, button[class^=btn-outline]:disabled,
button[class*=" btn-outline"]:disabled,
[class^=btn-outline]:disabled,
[class*=" btn-outline"]:disabled {
  overflow: hidden;
  transition-duration: 0.3s;
  transition-property: "background";
  --f-family: Lexend Deca, sans-serif;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  align-items: center;
  background-color: transparent;
  border: 2px solid #DAEAE2;
  border-radius: 100px;
  box-sizing: border-box;
  color: #DAEAE2;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  font-weight: 600;
  padding: 16px 24px;
  text-align: center;
  backdrop-filter: blur(10px);
  background-color: rgb(242.05, 247.65, 244.85);
  color: rgb(199.1285714286, 215.8714285714, 207.5);
  pointer-events: none;
}
.btn-outline-disabled:hover,
[class^=btn-outline].btn--xl:hover:disabled,
[class*=" btn-outline"].btn--xl:hover:disabled,
[class^=btn-outline].btn--lg:hover:disabled,
[class*=" btn-outline"].btn--lg:hover:disabled,
[class^=btn-outline].btn--sm:hover:disabled,
[class*=" btn-outline"].btn--sm:hover:disabled,
[class^=btn-outline].btn--xs:hover:disabled,
input[class^=btn-outline][type=file]:hover:disabled::file-selector-button,
input[class^=btn-outline][type=file]:hover:disabled::-webkit-file-upload-button,
[class*=" btn-outline"].btn--xs:hover:disabled,
input[class*=" btn-outline"][type=file]:hover:disabled::file-selector-button,
input[class*=" btn-outline"][type=file]:hover:disabled::-webkit-file-upload-button,
[class^=btn-outline]:hover:disabled,
[class*=" btn-outline"]:hover:disabled, .btn-outline-disabled:active,
[class^=btn-outline].btn--xl:active:disabled,
[class*=" btn-outline"].btn--xl:active:disabled,
[class^=btn-outline].btn--lg:active:disabled,
[class*=" btn-outline"].btn--lg:active:disabled,
[class^=btn-outline].btn--sm:active:disabled,
[class*=" btn-outline"].btn--sm:active:disabled,
[class^=btn-outline].btn--xs:active:disabled,
input[class^=btn-outline][type=file]:active:disabled::file-selector-button,
input[class^=btn-outline][type=file]:active:disabled::-webkit-file-upload-button,
[class*=" btn-outline"].btn--xs:active:disabled,
input[class*=" btn-outline"][type=file]:active:disabled::file-selector-button,
input[class*=" btn-outline"][type=file]:active:disabled::-webkit-file-upload-button,
[class^=btn-outline]:active:disabled,
[class*=" btn-outline"]:active:disabled {
  background-color: rgb(242.05, 247.65, 244.85);
  border-color: #DAEAE2;
  color: #DAEAE2;
}
@media (min-width: 0) {
  .btn-outline-disabled, button[class^=btn-outline]:disabled.btn--xl,
  button[class*=" btn-outline"]:disabled.btn--xl,
  [class^=btn-outline]:disabled.btn--xl,
  [class^=btn-outline].btn--xl:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
  [class^=btn-outline].btn.btn--xl:disabled,
  [class*=" btn-outline"]:disabled.btn--xl,
  [class*=" btn-outline"].btn--xl:disabled,
  [class*=" btn-outline"].btn.btn--xl:disabled, button[class^=btn-outline]:disabled.btn--lg,
  button[class*=" btn-outline"]:disabled.btn--lg,
  [class^=btn-outline]:disabled.btn--lg,
  [class^=btn-outline].btn--lg:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
  [class^=btn-outline].btn.btn--lg:disabled,
  [class*=" btn-outline"]:disabled.btn--lg,
  [class*=" btn-outline"].btn--lg:disabled,
  [class*=" btn-outline"].btn.btn--lg:disabled, button[class^=btn-outline]:disabled.btn--sm,
  button[class*=" btn-outline"]:disabled.btn--sm,
  [class^=btn-outline]:disabled.btn--sm,
  [class^=btn-outline].btn--sm:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
  [class^=btn-outline].btn.btn--sm:disabled,
  [class*=" btn-outline"]:disabled.btn--sm,
  [class*=" btn-outline"].btn--sm:disabled,
  [class*=" btn-outline"].btn.btn--sm:disabled, button[class^=btn-outline]:disabled.btn--xs,
  button[class*=" btn-outline"]:disabled.btn--xs,
  [class^=btn-outline]:disabled.btn--xs,
  input[class^=btn-outline][type=file]:disabled::file-selector-button,
  input[class^=btn-outline][type=file]:disabled::-webkit-file-upload-button,
  [class^=btn-outline].btn--xs:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
  [class^=btn-outline].btn.btn--xs:disabled,
  [class*=" btn-outline"]:disabled.btn--xs,
  input[class*=" btn-outline"][type=file]:disabled::file-selector-button,
  input[class*=" btn-outline"][type=file]:disabled::-webkit-file-upload-button,
  [class*=" btn-outline"].btn--xs:disabled,
  [class*=" btn-outline"].btn.btn--xs:disabled, button[class^=btn-outline]:disabled,
  button[class*=" btn-outline"]:disabled,
  [class^=btn-outline]:disabled,
  [class*=" btn-outline"]:disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .btn-outline-disabled, button[class^=btn-outline]:disabled.btn--xl,
  button[class*=" btn-outline"]:disabled.btn--xl,
  [class^=btn-outline]:disabled.btn--xl,
  [class^=btn-outline].btn--xl:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
  [class^=btn-outline].btn.btn--xl:disabled,
  [class*=" btn-outline"]:disabled.btn--xl,
  [class*=" btn-outline"].btn--xl:disabled,
  [class*=" btn-outline"].btn.btn--xl:disabled, button[class^=btn-outline]:disabled.btn--lg,
  button[class*=" btn-outline"]:disabled.btn--lg,
  [class^=btn-outline]:disabled.btn--lg,
  [class^=btn-outline].btn--lg:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
  [class^=btn-outline].btn.btn--lg:disabled,
  [class*=" btn-outline"]:disabled.btn--lg,
  [class*=" btn-outline"].btn--lg:disabled,
  [class*=" btn-outline"].btn.btn--lg:disabled, button[class^=btn-outline]:disabled.btn--sm,
  button[class*=" btn-outline"]:disabled.btn--sm,
  [class^=btn-outline]:disabled.btn--sm,
  [class^=btn-outline].btn--sm:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
  [class^=btn-outline].btn.btn--sm:disabled,
  [class*=" btn-outline"]:disabled.btn--sm,
  [class*=" btn-outline"].btn--sm:disabled,
  [class*=" btn-outline"].btn.btn--sm:disabled, button[class^=btn-outline]:disabled.btn--xs,
  button[class*=" btn-outline"]:disabled.btn--xs,
  [class^=btn-outline]:disabled.btn--xs,
  input[class^=btn-outline][type=file]:disabled::file-selector-button,
  input[class^=btn-outline][type=file]:disabled::-webkit-file-upload-button,
  [class^=btn-outline].btn--xs:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
  [class^=btn-outline].btn.btn--xs:disabled,
  [class*=" btn-outline"]:disabled.btn--xs,
  input[class*=" btn-outline"][type=file]:disabled::file-selector-button,
  input[class*=" btn-outline"][type=file]:disabled::-webkit-file-upload-button,
  [class*=" btn-outline"].btn--xs:disabled,
  [class*=" btn-outline"].btn.btn--xs:disabled, button[class^=btn-outline]:disabled,
  button[class*=" btn-outline"]:disabled,
  [class^=btn-outline]:disabled,
  [class*=" btn-outline"]:disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .btn-outline-disabled, button[class^=btn-outline]:disabled.btn--xl,
  button[class*=" btn-outline"]:disabled.btn--xl,
  [class^=btn-outline]:disabled.btn--xl,
  [class^=btn-outline].btn--xl:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
  [class^=btn-outline].btn.btn--xl:disabled,
  [class*=" btn-outline"]:disabled.btn--xl,
  [class*=" btn-outline"].btn--xl:disabled,
  [class*=" btn-outline"].btn.btn--xl:disabled, button[class^=btn-outline]:disabled.btn--lg,
  button[class*=" btn-outline"]:disabled.btn--lg,
  [class^=btn-outline]:disabled.btn--lg,
  [class^=btn-outline].btn--lg:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
  [class^=btn-outline].btn.btn--lg:disabled,
  [class*=" btn-outline"]:disabled.btn--lg,
  [class*=" btn-outline"].btn--lg:disabled,
  [class*=" btn-outline"].btn.btn--lg:disabled, button[class^=btn-outline]:disabled.btn--sm,
  button[class*=" btn-outline"]:disabled.btn--sm,
  [class^=btn-outline]:disabled.btn--sm,
  [class^=btn-outline].btn--sm:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
  [class^=btn-outline].btn.btn--sm:disabled,
  [class*=" btn-outline"]:disabled.btn--sm,
  [class*=" btn-outline"].btn--sm:disabled,
  [class*=" btn-outline"].btn.btn--sm:disabled, button[class^=btn-outline]:disabled.btn--xs,
  button[class*=" btn-outline"]:disabled.btn--xs,
  [class^=btn-outline]:disabled.btn--xs,
  input[class^=btn-outline][type=file]:disabled::file-selector-button,
  input[class^=btn-outline][type=file]:disabled::-webkit-file-upload-button,
  [class^=btn-outline].btn--xs:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
  [class^=btn-outline].btn.btn--xs:disabled,
  [class*=" btn-outline"]:disabled.btn--xs,
  input[class*=" btn-outline"][type=file]:disabled::file-selector-button,
  input[class*=" btn-outline"][type=file]:disabled::-webkit-file-upload-button,
  [class*=" btn-outline"].btn--xs:disabled,
  [class*=" btn-outline"].btn.btn--xs:disabled, button[class^=btn-outline]:disabled,
  button[class*=" btn-outline"]:disabled,
  [class^=btn-outline]:disabled,
  [class*=" btn-outline"]:disabled {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.btn-outline-disabled:focus:not(:focus-visible),
[class^=btn-outline]:focus:not(:focus-visible):disabled,
[class*=" btn-outline"]:focus:not(:focus-visible):disabled {
  outline: none;
  box-shadow: none;
}
.btn-outline-disabled:focus-visible,
[class^=btn-outline].btn--xl:focus-visible:disabled,
[class*=" btn-outline"].btn--xl:focus-visible:disabled,
[class^=btn-outline].btn--lg:focus-visible:disabled,
[class*=" btn-outline"].btn--lg:focus-visible:disabled,
[class^=btn-outline].btn--sm:focus-visible:disabled,
[class*=" btn-outline"].btn--sm:focus-visible:disabled,
[class^=btn-outline].btn--xs:focus-visible:disabled,
input[class^=btn-outline][type=file]:focus-visible:disabled::file-selector-button,
input[class^=btn-outline][type=file]:focus-visible:disabled::-webkit-file-upload-button,
[class*=" btn-outline"].btn--xs:focus-visible:disabled,
input[class*=" btn-outline"][type=file]:focus-visible:disabled::file-selector-button,
input[class*=" btn-outline"][type=file]:focus-visible:disabled::-webkit-file-upload-button,
[class^=btn-outline]:focus-visible:disabled,
[class*=" btn-outline"]:focus-visible:disabled {
  outline-offset: 0.25em;
  outline: 2px solid #D9825B;
  box-shadow: none;
}
.btn-outline-disabled:active,
[class^=btn-outline].btn--xl:active:disabled,
[class*=" btn-outline"].btn--xl:active:disabled,
[class^=btn-outline].btn--lg:active:disabled,
[class*=" btn-outline"].btn--lg:active:disabled,
[class^=btn-outline].btn--sm:active:disabled,
[class*=" btn-outline"].btn--sm:active:disabled,
[class^=btn-outline].btn--xs:active:disabled,
input[class^=btn-outline][type=file]:active:disabled::file-selector-button,
input[class^=btn-outline][type=file]:active:disabled::-webkit-file-upload-button,
[class*=" btn-outline"].btn--xs:active:disabled,
input[class*=" btn-outline"][type=file]:active:disabled::file-selector-button,
input[class*=" btn-outline"][type=file]:active:disabled::-webkit-file-upload-button,
[class^=btn-outline]:active:disabled,
[class*=" btn-outline"]:active:disabled {
  border-radius: 12px;
}
.btn-outline-disabled i,
[class^=btn-outline]:disabled.btn--xl i,
[class*=" btn-outline"]:disabled.btn--xl i,
[class^=btn-outline]:disabled.btn--lg i,
[class*=" btn-outline"]:disabled.btn--lg i,
[class^=btn-outline]:disabled.btn--sm i,
[class*=" btn-outline"]:disabled.btn--sm i,
[class^=btn-outline]:disabled.btn--xs i,
input[class^=btn-outline][type=file]:disabled::file-selector-button i,
input[class^=btn-outline][type=file]:disabled::-webkit-file-upload-button i,
[class*=" btn-outline"]:disabled.btn--xs i,
input[class*=" btn-outline"][type=file]:disabled::file-selector-button i,
input[class*=" btn-outline"][type=file]:disabled::-webkit-file-upload-button i,
[class^=btn-outline]:disabled i,
[class*=" btn-outline"]:disabled i {
  margin-bottom: -0.2em;
}
.btn-outline-disabled i:before,
[class^=btn-outline]:disabled.btn--xl i:before,
[class*=" btn-outline"]:disabled.btn--xl i:before,
[class^=btn-outline]:disabled.btn--lg i:before,
[class*=" btn-outline"]:disabled.btn--lg i:before,
[class^=btn-outline]:disabled.btn--sm i:before,
[class*=" btn-outline"]:disabled.btn--sm i:before,
[class^=btn-outline]:disabled.btn--xs i:before,
input[class^=btn-outline][type=file]:disabled::file-selector-button i:before,
input[class^=btn-outline][type=file]:disabled::-webkit-file-upload-button i:before,
[class*=" btn-outline"]:disabled.btn--xs i:before,
input[class*=" btn-outline"][type=file]:disabled::file-selector-button i:before,
input[class*=" btn-outline"][type=file]:disabled::-webkit-file-upload-button i:before,
[class^=btn-outline]:disabled i:before,
[class*=" btn-outline"]:disabled i:before {
  font-weight: 600;
  font-size: 1.244em;
}

.btn-icon {
  box-sizing: content-box;
  display: inline-flex !important;
  gap: 8px;
  padding: 16px 16px;
  aspect-ratio: 1/1;
  line-height: normal;
  min-width: 24px;
  place-content: center;
  transition: all 0.3s;
}
.btn-icon i {
  max-width: 24px;
  display: flex;
  justify-content: center;
}
.btn-icon i:before {
  font-weight: 600;
}

.btn--xs, .menu-btn, button.menu-btn:disabled,
.btn.menu-btn:disabled,
[class^=btn-outline].menu-btn:disabled,
[class*=" btn-outline"].menu-btn:disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button, button[class^=btn-outline]:disabled.btn--xs,
button[class*=" btn-outline"]:disabled.btn--xs,
[class^=btn-outline]:disabled.btn--xs,
[class*=" btn-outline"]:disabled.btn--xs,
.btn[class^=btn-outline].btn--xs:disabled,
.btn[class*=" btn-outline"].btn--xs:disabled,
[class^=btn-outline].btn--xs:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
[class*=" btn-outline"].btn--xs:disabled, button:disabled.btn--xs,
.btn:disabled.btn--xs {
  padding: 6px 12px;
  gap: 4px;
}
@media (min-width: 0) {
  .btn--xs, .menu-btn, button.menu-btn:disabled,
  .btn.menu-btn:disabled,
  [class^=btn-outline].menu-btn:disabled,
  [class*=" btn-outline"].menu-btn:disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button, button[class^=btn-outline]:disabled.btn--xs,
  button[class*=" btn-outline"]:disabled.btn--xs,
  [class^=btn-outline]:disabled.btn--xs,
  [class*=" btn-outline"]:disabled.btn--xs,
  .btn[class^=btn-outline].btn--xs:disabled,
  .btn[class*=" btn-outline"].btn--xs:disabled,
  [class^=btn-outline].btn--xs:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
  [class*=" btn-outline"].btn--xs:disabled, button:disabled.btn--xs,
  .btn:disabled.btn--xs {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 600px) {
  .btn--xs, .menu-btn, button.menu-btn:disabled,
  .btn.menu-btn:disabled,
  [class^=btn-outline].menu-btn:disabled,
  [class*=" btn-outline"].menu-btn:disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button, button[class^=btn-outline]:disabled.btn--xs,
  button[class*=" btn-outline"]:disabled.btn--xs,
  [class^=btn-outline]:disabled.btn--xs,
  [class*=" btn-outline"]:disabled.btn--xs,
  .btn[class^=btn-outline].btn--xs:disabled,
  .btn[class*=" btn-outline"].btn--xs:disabled,
  [class^=btn-outline].btn--xs:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
  [class*=" btn-outline"].btn--xs:disabled, button:disabled.btn--xs,
  .btn:disabled.btn--xs {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
@media (min-width: 1200px) {
  .btn--xs, .menu-btn, button.menu-btn:disabled,
  .btn.menu-btn:disabled,
  [class^=btn-outline].menu-btn:disabled,
  [class*=" btn-outline"].menu-btn:disabled, input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button, button[class^=btn-outline]:disabled.btn--xs,
  button[class*=" btn-outline"]:disabled.btn--xs,
  [class^=btn-outline]:disabled.btn--xs,
  [class*=" btn-outline"]:disabled.btn--xs,
  .btn[class^=btn-outline].btn--xs:disabled,
  .btn[class*=" btn-outline"].btn--xs:disabled,
  [class^=btn-outline].btn--xs:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xs:disabled,
  [class*=" btn-outline"].btn--xs:disabled, button:disabled.btn--xs,
  .btn:disabled.btn--xs {
    font-size: 12.6419753086px;
    letter-spacing: 0.2528395062px;
  }
}
.btn--xs.btn-icon, .btn-icon.menu-btn, input.btn-icon[type=file]::file-selector-button, input.btn-icon[type=file]::-webkit-file-upload-button,
.btn-icon[class^=btn-outline].btn--xs:disabled,
.btn-icon[class*=" btn-outline"].btn--xs:disabled, button.btn-icon.btn--xs:disabled,
.btn-icon.btn.btn--xs:disabled {
  padding: 6px 6px;
  min-width: 20px;
}
.btn--xs.btn-icon i:before, .btn-icon.menu-btn i:before, input.btn-icon[type=file]::file-selector-button i:before, input.btn-icon[type=file]::-webkit-file-upload-button i:before,
.btn-icon[class^=btn-outline].btn--xs:disabled i:before,
.btn-icon[class*=" btn-outline"].btn--xs:disabled i:before {
  font-size: 20px;
}

.btn--sm, button[class^=btn-outline]:disabled.btn--sm,
button[class*=" btn-outline"]:disabled.btn--sm,
[class^=btn-outline]:disabled.btn--sm,
[class*=" btn-outline"]:disabled.btn--sm,
.btn[class^=btn-outline].btn--sm:disabled,
.btn[class*=" btn-outline"].btn--sm:disabled,
[class^=btn-outline].btn--sm:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
[class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--sm,
.btn:disabled.btn--sm {
  padding: 10px 16px;
  gap: 8px;
}
@media (min-width: 0) {
  .btn--sm, button[class^=btn-outline]:disabled.btn--sm,
  button[class*=" btn-outline"]:disabled.btn--sm,
  [class^=btn-outline]:disabled.btn--sm,
  [class*=" btn-outline"]:disabled.btn--sm,
  .btn[class^=btn-outline].btn--sm:disabled,
  .btn[class*=" btn-outline"].btn--sm:disabled,
  [class^=btn-outline].btn--sm:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
  [class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--sm,
  .btn:disabled.btn--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 600px) {
  .btn--sm, button[class^=btn-outline]:disabled.btn--sm,
  button[class*=" btn-outline"]:disabled.btn--sm,
  [class^=btn-outline]:disabled.btn--sm,
  [class*=" btn-outline"]:disabled.btn--sm,
  .btn[class^=btn-outline].btn--sm:disabled,
  .btn[class*=" btn-outline"].btn--sm:disabled,
  [class^=btn-outline].btn--sm:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
  [class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--sm,
  .btn:disabled.btn--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
@media (min-width: 1200px) {
  .btn--sm, button[class^=btn-outline]:disabled.btn--sm,
  button[class*=" btn-outline"]:disabled.btn--sm,
  [class^=btn-outline]:disabled.btn--sm,
  [class*=" btn-outline"]:disabled.btn--sm,
  .btn[class^=btn-outline].btn--sm:disabled,
  .btn[class*=" btn-outline"].btn--sm:disabled,
  [class^=btn-outline].btn--sm:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--sm:disabled,
  [class*=" btn-outline"].btn--sm:disabled, button:disabled.btn--sm,
  .btn:disabled.btn--sm {
    font-size: 14.2222222222px;
    letter-spacing: 0.2844444444px;
  }
}
.btn--sm.btn-icon,
.btn-icon[class^=btn-outline].btn--sm:disabled,
.btn-icon[class*=" btn-outline"].btn--sm:disabled, button.btn-icon.btn--sm:disabled,
.btn-icon.btn.btn--sm:disabled {
  padding: 10px 10px;
  min-width: 20px;
}
.btn--sm.btn-icon i:before,
.btn-icon[class^=btn-outline].btn--sm:disabled i:before,
.btn-icon[class*=" btn-outline"].btn--sm:disabled i:before {
  font-size: 20px;
}

.btn--lg, button[class^=btn-outline]:disabled.btn--lg,
button[class*=" btn-outline"]:disabled.btn--lg,
[class^=btn-outline]:disabled.btn--lg,
[class*=" btn-outline"]:disabled.btn--lg,
.btn[class^=btn-outline].btn--lg:disabled,
.btn[class*=" btn-outline"].btn--lg:disabled,
[class^=btn-outline].btn--lg:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
[class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--lg,
.btn:disabled.btn--lg {
  padding: 32px 48px;
  gap: 12px;
}
@media (min-width: 0) {
  .btn--lg, button[class^=btn-outline]:disabled.btn--lg,
  button[class*=" btn-outline"]:disabled.btn--lg,
  [class^=btn-outline]:disabled.btn--lg,
  [class*=" btn-outline"]:disabled.btn--lg,
  .btn[class^=btn-outline].btn--lg:disabled,
  .btn[class*=" btn-outline"].btn--lg:disabled,
  [class^=btn-outline].btn--lg:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
  [class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--lg,
  .btn:disabled.btn--lg {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 600px) {
  .btn--lg, button[class^=btn-outline]:disabled.btn--lg,
  button[class*=" btn-outline"]:disabled.btn--lg,
  [class^=btn-outline]:disabled.btn--lg,
  [class*=" btn-outline"]:disabled.btn--lg,
  .btn[class^=btn-outline].btn--lg:disabled,
  .btn[class*=" btn-outline"].btn--lg:disabled,
  [class^=btn-outline].btn--lg:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
  [class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--lg,
  .btn:disabled.btn--lg {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
@media (min-width: 1200px) {
  .btn--lg, button[class^=btn-outline]:disabled.btn--lg,
  button[class*=" btn-outline"]:disabled.btn--lg,
  [class^=btn-outline]:disabled.btn--lg,
  [class*=" btn-outline"]:disabled.btn--lg,
  .btn[class^=btn-outline].btn--lg:disabled,
  .btn[class*=" btn-outline"].btn--lg:disabled,
  [class^=btn-outline].btn--lg:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--lg:disabled,
  [class*=" btn-outline"].btn--lg:disabled, button:disabled.btn--lg,
  .btn:disabled.btn--lg {
    font-size: 18px;
    letter-spacing: 0.36px;
  }
}
.btn--lg.btn-icon,
.btn-icon[class^=btn-outline].btn--lg:disabled,
.btn-icon[class*=" btn-outline"].btn--lg:disabled, button.btn-icon.btn--lg:disabled,
.btn-icon.btn.btn--lg:disabled {
  padding: 32px 32px;
  min-width: 32px;
}
.btn--lg.btn-icon i:before,
.btn-icon[class^=btn-outline].btn--lg:disabled i:before,
.btn-icon[class*=" btn-outline"].btn--lg:disabled i:before {
  font-size: 32px;
}

.btn--xl, button[class^=btn-outline]:disabled.btn--xl,
button[class*=" btn-outline"]:disabled.btn--xl,
[class^=btn-outline]:disabled.btn--xl,
[class*=" btn-outline"]:disabled.btn--xl,
.btn[class^=btn-outline].btn--xl:disabled,
.btn[class*=" btn-outline"].btn--xl:disabled,
[class^=btn-outline].btn--xl:disabled,
[class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
[class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--xl,
.btn:disabled.btn--xl {
  padding: 48px 64px;
  gap: 16px;
}
@media (min-width: 0) {
  .btn--xl, button[class^=btn-outline]:disabled.btn--xl,
  button[class*=" btn-outline"]:disabled.btn--xl,
  [class^=btn-outline]:disabled.btn--xl,
  [class*=" btn-outline"]:disabled.btn--xl,
  .btn[class^=btn-outline].btn--xl:disabled,
  .btn[class*=" btn-outline"].btn--xl:disabled,
  [class^=btn-outline].btn--xl:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
  [class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--xl,
  .btn:disabled.btn--xl {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 600px) {
  .btn--xl, button[class^=btn-outline]:disabled.btn--xl,
  button[class*=" btn-outline"]:disabled.btn--xl,
  [class^=btn-outline]:disabled.btn--xl,
  [class*=" btn-outline"]:disabled.btn--xl,
  .btn[class^=btn-outline].btn--xl:disabled,
  .btn[class*=" btn-outline"].btn--xl:disabled,
  [class^=btn-outline].btn--xl:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
  [class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--xl,
  .btn:disabled.btn--xl {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
@media (min-width: 1200px) {
  .btn--xl, button[class^=btn-outline]:disabled.btn--xl,
  button[class*=" btn-outline"]:disabled.btn--xl,
  [class^=btn-outline]:disabled.btn--xl,
  [class*=" btn-outline"]:disabled.btn--xl,
  .btn[class^=btn-outline].btn--xl:disabled,
  .btn[class*=" btn-outline"].btn--xl:disabled,
  [class^=btn-outline].btn--xl:disabled,
  [class^=btn-outline][class*=" btn-outline"].btn--xl:disabled,
  [class*=" btn-outline"].btn--xl:disabled, button:disabled.btn--xl,
  .btn:disabled.btn--xl {
    font-size: 20.25px;
    letter-spacing: 0.405px;
  }
}
.btn--xl.btn-icon,
.btn-icon[class^=btn-outline].btn--xl:disabled,
.btn-icon[class*=" btn-outline"].btn--xl:disabled, button.btn-icon.btn--xl:disabled,
.btn-icon.btn.btn--xl:disabled {
  padding: 48px 48px;
  min-width: 40px;
}
.btn--xl.btn-icon i:before,
.btn-icon[class^=btn-outline].btn--xl:disabled i:before,
.btn-icon[class*=" btn-outline"].btn--xl:disabled i:before {
  font-size: 40px;
}

.btn--full-width {
  width: 100%;
}

.btn--overlap {
  box-shadow: 0 0 9px 3px #bcbbb6;
  z-index: 2;
}

.btn--no-border {
  border: 0;
}

/**
 * This variables are only assigned to FORM elements.
 *
 * The accent colors of the project are already assigned to internal variables
 * in the colors stylesheet of the styleguide
 * (e.g.: theme-color("primary"), neutral-color("lightest"),...).
 *
 *
 * The name of this variables should follow this rule:
 * $c_nav-text
 *
 *
 * The variable begins with the initial of the variable type c (color),
 * followed by the element, and the section of the element where will be applied
 * the color.
 *
 * $c_nav
 *
 * In this case this variable represents the background color of the element.
 */
/* INPUT COLORS */
/* SELECT2 COLORS */
/* DATEPICKER COLORS */
/**
 * This variables are only assigned to FORM elements.
 */
/** Radio and Checkbox Buttons
 * Adapted from: https://kyusuf.com/post/completely-css-custom-checkbox-radio-buttons-and-select-boxes
 *
 * HTML example:
  <div class="control_group checkbox_group">
    <label class="control control-checkbox label-text">First checkbox
      <input type="checkbox" checked="checked"/>
      <div class="control-indicator"></div>
    </label>
  </div>

  <div class="control_group radio_group">
  	<label class="control control-radio label-text">First radio
  		<input type="radio" name="radio" checked="checked"/>
  		<div class="control-indicator"></div>
  	</label>
  </div>
 *
 * To update the colors of the inputs, the variables should changed on colors.scss
 *
 */
.control {
  cursor: pointer;
  display: block;
  margin-bottom: 15px;
  padding-left: calc(20px + 10px);
  position: relative;
}
.control input {
  opacity: 0;
  position: absolute;
  z-index: -1;
}
.control input:checked ~ .control-indicator:after {
  display: block;
}
.control input:disabled ~ .control-indicator {
  border: 2px solid #8C8E88;
  opacity: 0.6;
  pointer-events: none;
}
.control:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(236.1881188119, 193.1188118812, 173.8118811881);
}
.control:has(input:disabled) {
  pointer-events: none;
}

/* stylelint-disable-next-line no-descending-specificity */
.control-indicator {
  background: transparent;
  border: 2px solid #1C2727;
  border-radius: 4px;
  height: 20px;
  left: 0;
  position: absolute;
  top: 0;
  width: 20px;
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-indicator:after {
  content: "";
  display: none;
  position: absolute;
}

.control-radio {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-radio .control-indicator {
  border-radius: 50%;
  border-color: #D9825B;
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-radio .control-indicator:after {
  background: #D9825B;
  border-radius: 50%;
  box-sizing: border-box;
  height: 80%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
}
.control-radio input:disabled ~ .control-indicator {
  background-color: rgba(188, 187, 182, 0.6);
  border-color: #BCBBB6;
}
.control-radio input:disabled ~ .control-indicator:after {
  background-color: #BCBBB6;
}

.control-radio--primary .control-indicator {
  border-color: #6FAF8F;
}
.control-radio--primary .control-indicator:after {
  background: #6FAF8F;
}
.control-radio--primary:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(156.7607142857, 180.2392857143, 168.5);
}

.control-radio--secondary .control-indicator {
  border-color: #519070;
}
.control-radio--secondary .control-indicator:after {
  background: #519070;
}
.control-radio--secondary:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(122.79, 153.21, 137.7585714286);
}

.control-radio--accent .control-indicator {
  border-color: #D9825B;
}
.control-radio--accent .control-indicator:after {
  background: #D9825B;
}
.control-radio--accent:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(215.2690594059, 165.8736916549, 143.7309405941);
}

.control-radio--success .control-indicator {
  border-color: #A4C003;
}
.control-radio--success .control-indicator:after {
  background: #A4C003;
}
.control-radio--success:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(193.908974359, 223.7653846154, 22.2346153846);
}

.control-radio--info .control-indicator {
  border-color: #8AB7EE;
}
.control-radio--info .control-indicator:after {
  background: #8AB7EE;
}
.control-radio--info:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(188.7548507463, 211.0254850746, 238.2451492537);
}

.control-radio--warning .control-indicator {
  border-color: #EC8327;
}
.control-radio--warning .control-indicator:after {
  background: #EC8327;
}
.control-radio--warning:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(226.3234042553, 158.8212981963, 99.6765957447);
}

.control-radio--danger .control-indicator {
  border-color: #A22719;
}
.control-radio--danger .control-indicator:after {
  background: #A22719;
}
.control-radio--danger:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(188.3318181818, 63.8381884539, 49.6681818182);
}

.control-radio--light .control-indicator {
  border-color: #F7F3EC;
}
.control-radio--light .control-indicator:after {
  background: #F7F3EC;
}
.control-radio--light:hover input:not([disabled]) ~ .control-indicator {
  background: hsl(38.1818181818, 25.7407407407%, 104.7058823529%);
}

.control-radio--dark .control-indicator {
  border-color: #2F3A3A;
}
.control-radio--dark .control-indicator:after {
  background: #2F3A3A;
}
.control-radio--dark:hover input:not([disabled]) ~ .control-indicator {
  background: #4e4e4e;
}

.control-radio--disabled .control-indicator {
  border-color: #DAEAE2;
}
.control-radio--disabled .control-indicator:after {
  background: #DAEAE2;
}
.control-radio--disabled:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(251.0594827586, 251.9405172414, 251.5);
}

.control-checkbox {
  /* stylelint-disable-next-line no-descending-specificity */
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox .control-indicator {
  border-color: #D9825B;
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox .control-indicator:after {
  border: solid white;
  border-width: 0 2px 2px 0;
  height: 9px;
  left: 0;
  top: 0;
  transform: translate(80%, 25%) rotate(45deg);
  width: 6px;
}
.control-checkbox input:checked ~ .control-indicator {
  background-color: #D9825B;
}
.control-checkbox input:disabled ~ .control-indicator {
  background-color: rgba(188, 187, 182, 0.6);
  border-color: #BCBBB6;
}
.control-checkbox input:disabled ~ .control-indicator:after {
  border-color: #BCBBB6;
}

.control-checkbox--no-text {
  margin-top: 8px;
  min-height: 26px;
}

.control-checkbox--primary {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--primary .control-indicator {
  border-color: #6FAF8F;
}
.control-checkbox--primary .control-indicator:after {
  border-color: white;
}
.control-checkbox--primary input:checked ~ .control-indicator {
  background-color: #6FAF8F;
}
.control-checkbox--primary:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(181.25, 181.25, 181.25);
}

.control-checkbox--secondary {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--secondary .control-indicator {
  border-color: #519070;
}
.control-checkbox--secondary .control-indicator:after {
  border-color: white;
}
.control-checkbox--secondary input:checked ~ .control-indicator {
  background-color: #519070;
}
.control-checkbox--secondary:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(150.75, 150.75, 150.75);
}

.control-checkbox--accent {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--accent .control-indicator {
  border-color: #D9825B;
}
.control-checkbox--accent .control-indicator:after {
  border-color: white;
}
.control-checkbox--accent input:checked ~ .control-indicator {
  background-color: #D9825B;
}
.control-checkbox--accent:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(212.5660891089, 184.5105374823, 171.9339108911);
}

.control-checkbox--success {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--success .control-indicator {
  border-color: #A4C003;
}
.control-checkbox--success .control-indicator:after {
  border-color: white;
}
.control-checkbox--success input:checked ~ .control-indicator {
  background-color: #A4C003;
}
.control-checkbox--success:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(191.9096153846, 215.5557692308, 55.9442307692);
}

.control-checkbox--info {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--info .control-indicator {
  border-color: #8AB7EE;
}
.control-checkbox--info .control-indicator:after {
  border-color: white;
}
.control-checkbox--info input:checked ~ .control-indicator {
  background-color: #8AB7EE;
}
.control-checkbox--info:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(213.4197761194, 224.9669776119, 239.0802238806);
}

.control-checkbox--warning {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--warning .control-indicator {
  border-color: #EC8327;
}
.control-checkbox--warning .control-indicator:after {
  border-color: white;
}
.control-checkbox--warning input:checked ~ .control-indicator {
  background-color: #EC8327;
}
.control-checkbox--warning:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(218.410106383, 172.9348660763, 133.089893617);
}

.control-checkbox--danger {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--danger .control-indicator {
  border-color: #A22719;
}
.control-checkbox--danger .control-indicator:after {
  border-color: white;
}
.control-checkbox--danger input:checked ~ .control-indicator {
  background-color: #A22719;
}
.control-checkbox--danger:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(185.0704545455, 89.3271566025, 78.4295454545);
}

.control-checkbox--light {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--light .control-indicator {
  border-color: #F7F3EC;
}
.control-checkbox--light .control-indicator:after {
  border-color: #1C2727;
}
.control-checkbox--light input:checked ~ .control-indicator {
  background-color: #F7F3EC;
}
.control-checkbox--light:hover input:not([disabled]) ~ .control-indicator {
  background: hsl(38.1818181818, 10.7407407407%, 109.7058823529%);
}

.control-checkbox--dark {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--dark .control-indicator {
  border-color: #2F3A3A;
}
.control-checkbox--dark .control-indicator:after {
  border-color: white;
}
.control-checkbox--dark input:checked ~ .control-indicator {
  background-color: #2F3A3A;
}
.control-checkbox--dark:hover input:not([disabled]) ~ .control-indicator {
  background: rgb(90.75, 90.75, 90.75);
}

.control-checkbox--disabled {
  /* stylelint-disable-next-line no-descending-specificity */
}
.control-checkbox--disabled .control-indicator {
  border-color: #DAEAE2;
}
.control-checkbox--disabled .control-indicator:after {
  border-color: #1C2727;
}
.control-checkbox--disabled input:checked ~ .control-indicator {
  background-color: #DAEAE2;
}
.control-checkbox--disabled:hover input:not([disabled]) ~ .control-indicator {
  background: hsl(0, 0%, 103.6274509804%);
}

/* stylelint-disable no-descending-specificity */
/**  Buttons
 *
 * HTML example:

  <label class="control control-toggle label-text">Toggle Text
    <input type="checkbox" checked="checked"/>
    <div class="control-indicator"></div>
  </label>

 *
 * To update the colors of the inputs, the variables should changed on colors.scss
 *
 */
.control-toggle {
  --f-family: Quicksand, sans-serif;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
  padding-left: 54px;
}
@media (min-width: 0) {
  .control-toggle {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .control-toggle {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .control-toggle {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.control-toggle .control-indicator {
  background: none;
  border-radius: 12px;
  border-color: #D9825B;
  box-sizing: border-box;
  height: 24px;
  width: 44px;
  padding: 2px;
  top: 1px;
  transition: all 0.2s ease-in-out;
}
.control-toggle .control-indicator:after {
  background: #D9825B;
  border-radius: 50%;
  box-sizing: border-box;
  height: 16px;
  left: 4px;
  top: 4px;
  width: 16px;
  transition: all 0.2s ease-in-out;
}
.control-toggle input ~ .control-indicator:after {
  display: block;
}
.control-toggle input:checked ~ .control-indicator {
  background: #D9825B;
}
.control-toggle input:checked ~ .control-indicator:after {
  background: white;
  left: calc(100% - 20px);
}
.control-toggle input:disabled ~ .control-indicator:after {
  background: #BCBBB6;
}

.control-toggle:hover input:not([disabled]) ~ .control-indicator,
.control-toggle:hover input:checked ~ .control-indicator:after {
  background: rgb(236.1881188119, 193.1188118812, 173.8118811881);
}

.control-toggle:hover input ~ .control-indicator,
.control-toggle:hover input:checked ~ .control-indicator,
.control-toggle:hover input ~ .control-indicator:after {
  background: #D9825B;
}

.control-toggle--primary .control-indicator {
  border: 2px solid #6FAF8F;
}
.control-toggle--primary .control-indicator:after {
  background: #6FAF8F;
}
.control-toggle--primary input:checked ~ .control-indicator {
  background: #6FAF8F;
}
.control-toggle--primary input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--primary:hover input:not([disabled]) ~ .control-indicator, .control-toggle--primary:hover input:checked ~ .control-indicator:after {
  background: rgb(182.6714285714, 205.3285714286, 194);
}
.control-toggle--primary:hover input ~ .control-indicator, .control-toggle--primary:hover input:checked ~ .control-indicator, .control-toggle--primary:hover input ~ .control-indicator:after {
  background: #6FAF8F;
}

.control-toggle--secondary .control-indicator {
  border: 2px solid #519070;
}
.control-toggle--secondary .control-indicator:after {
  background: #519070;
}
.control-toggle--secondary input:checked ~ .control-indicator {
  background: #519070;
}
.control-toggle--secondary input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--secondary:hover input:not([disabled]) ~ .control-indicator, .control-toggle--secondary:hover input:checked ~ .control-indicator:after {
  background: rgb(147.03, 179.97, 163.2385714286);
}
.control-toggle--secondary:hover input ~ .control-indicator, .control-toggle--secondary:hover input:checked ~ .control-indicator, .control-toggle--secondary:hover input ~ .control-indicator:after {
  background: #519070;
}

.control-toggle--accent .control-indicator {
  border: 2px solid #D9825B;
}
.control-toggle--accent .control-indicator:after {
  background: #D9825B;
}
.control-toggle--accent input:checked ~ .control-indicator {
  background: #D9825B;
}
.control-toggle--accent input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--accent:hover input:not([disabled]) ~ .control-indicator, .control-toggle--accent:hover input:checked ~ .control-indicator:after {
  background: rgb(231.1881188119, 195.023573786, 178.8118811881);
}
.control-toggle--accent:hover input ~ .control-indicator, .control-toggle--accent:hover input:checked ~ .control-indicator, .control-toggle--accent:hover input ~ .control-indicator:after {
  background: #D9825B;
}

.control-toggle--success .control-indicator {
  border: 2px solid #A4C003;
}
.control-toggle--success .control-indicator:after {
  background: #A4C003;
}
.control-toggle--success input:checked ~ .control-indicator {
  background: #A4C003;
}
.control-toggle--success input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--success:hover input:not([disabled]) ~ .control-indicator, .control-toggle--success:hover input:checked ~ .control-indicator:after {
  background: rgb(213.644017094, 241.0730769231, 55.9269230769);
}
.control-toggle--success:hover input ~ .control-indicator, .control-toggle--success:hover input:checked ~ .control-indicator, .control-toggle--success:hover input ~ .control-indicator:after {
  background: #A4C003;
}

.control-toggle--info .control-indicator {
  border: 2px solid #8AB7EE;
}
.control-toggle--info .control-indicator:after {
  background: #8AB7EE;
}
.control-toggle--info input:checked ~ .control-indicator {
  background: #8AB7EE;
}
.control-toggle--info input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--info:hover input:not([disabled]) ~ .control-indicator, .control-toggle--info:hover input:checked ~ .control-indicator:after {
  background: rgb(228.6597014925, 237.9659701493, 249.3402985075);
}
.control-toggle--info:hover input ~ .control-indicator, .control-toggle--info:hover input:checked ~ .control-indicator, .control-toggle--info:hover input ~ .control-indicator:after {
  background: #8AB7EE;
}

.control-toggle--warning .control-indicator {
  border: 2px solid #EC8327;
}
.control-toggle--warning .control-indicator:after {
  background: #EC8327;
}
.control-toggle--warning input:checked ~ .control-indicator {
  background: #EC8327;
}
.control-toggle--warning input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--warning:hover input:not([disabled]) ~ .control-indicator, .control-toggle--warning:hover input:checked ~ .control-indicator:after {
  background: rgb(237.5968085106, 185.2601090831, 139.4031914894);
}
.control-toggle--warning:hover input ~ .control-indicator, .control-toggle--warning:hover input:checked ~ .control-indicator, .control-toggle--warning:hover input ~ .control-indicator:after {
  background: #EC8327;
}

.control-toggle--danger .control-indicator {
  border: 2px solid #A22719;
}
.control-toggle--danger .control-indicator:after {
  background: #A22719;
}
.control-toggle--danger input:checked ~ .control-indicator {
  background: #A22719;
}
.control-toggle--danger input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--danger:hover input:not([disabled]) ~ .control-indicator, .control-toggle--danger:hover input:checked ~ .control-indicator:after {
  background: rgb(214.4045454545, 88.8825149303, 74.5954545455);
}
.control-toggle--danger:hover input ~ .control-indicator, .control-toggle--danger:hover input:checked ~ .control-indicator, .control-toggle--danger:hover input ~ .control-indicator:after {
  background: #A22719;
}

.control-toggle--light .control-indicator {
  border: 2px solid #F7F3EC;
}
.control-toggle--light .control-indicator:after {
  background: #F7F3EC;
}
.control-toggle--light input:checked ~ .control-indicator {
  background: #F7F3EC;
}
.control-toggle--light input:checked ~ .control-indicator:after {
  background: #1C2727;
}
.control-toggle--light:hover input:not([disabled]) ~ .control-indicator, .control-toggle--light:hover input:checked ~ .control-indicator:after {
  background: hsl(38.1818181818, 30.7407407407%, 114.7058823529%);
}
.control-toggle--light:hover input ~ .control-indicator, .control-toggle--light:hover input:checked ~ .control-indicator, .control-toggle--light:hover input ~ .control-indicator:after {
  background: #F7F3EC;
}

.control-toggle--dark .control-indicator {
  border: 2px solid #2F3A3A;
}
.control-toggle--dark .control-indicator:after {
  background: #2F3A3A;
}
.control-toggle--dark input:checked ~ .control-indicator {
  background: #2F3A3A;
}
.control-toggle--dark input:checked ~ .control-indicator:after {
  background: white;
}
.control-toggle--dark:hover input:not([disabled]) ~ .control-indicator, .control-toggle--dark:hover input:checked ~ .control-indicator:after {
  background: rgb(103.0071428571, 103.9928571429, 103.9928571429);
}
.control-toggle--dark:hover input ~ .control-indicator, .control-toggle--dark:hover input:checked ~ .control-indicator, .control-toggle--dark:hover input ~ .control-indicator:after {
  background: #2F3A3A;
}

.control-toggle--disabled .control-indicator {
  border: 2px solid #DAEAE2;
}
.control-toggle--disabled .control-indicator:after {
  background: #DAEAE2;
}
.control-toggle--disabled input:checked ~ .control-indicator {
  background: #DAEAE2;
}
.control-toggle--disabled input:checked ~ .control-indicator:after {
  background: #1C2727;
}
.control-toggle--disabled:hover input:not([disabled]) ~ .control-indicator, .control-toggle--disabled:hover input:checked ~ .control-indicator:after {
  background: hsl(150, 17.5862068966%, 108.6274509804%);
}
.control-toggle--disabled:hover input ~ .control-indicator, .control-toggle--disabled:hover input:checked ~ .control-indicator, .control-toggle--disabled:hover input ~ .control-indicator:after {
  background: #DAEAE2;
}

/*!
 * Datetimepicker for Bootstrap 3
 * version : 4.17.47
 * https://github.com/Eonasdan/bootstrap-datetimepicker/
 */
[data-action=togglePicker],
[data-action=incrementHours],
[data-action=decrementHours],
[data-action=incrementMinutes],
[data-action=decrementMinutes] {
  display: inline-block;
  min-width: 100%;
}

[data-action=togglePicker]:hover,
[data-action=incrementHours]:hover,
[data-action=decrementHours]:hover,
[data-action=incrementMinutes]:hover,
[data-action=decrementMinutes]:hover {
  background: #F8F9FA;
  cursor: pointer;
}

input:not([type=checkbox], [type=radio], [type=submit]) {
  background-color: transparent;
  border: 2px solid #1C2727;
  border-radius: 32px;
  box-sizing: border-box;
  height: auto;
  margin-top: 10px;
  padding: 0.75em 20px;
  width: 100%;
}
input:not([type=checkbox], [type=radio], [type=submit])::placeholder {
  color: #1C2727;
}
input:not([type=checkbox], [type=radio], [type=submit]):focus, input:not([type=checkbox], [type=radio], [type=submit]):active {
  border-color: #D9825B;
  outline: none;
}
input:not([type=checkbox], [type=radio], [type=submit]):disabled {
  border-color: #8C8E88;
  color: #8C8E88;
  pointer-events: none;
}
input:not([type=checkbox], [type=radio], [type=submit]):disabled::placeholder {
  opacity: 0.6;
}

textarea {
  background-color: transparent;
  border: 2px solid #1C2727;
  border-radius: 32px;
  box-sizing: border-box;
  height: 6em;
  margin-top: 10px;
  padding: 0.75em 20px;
  width: 100%;
  border-radius: 32px 12px 32px 32px;
}
textarea::placeholder {
  color: #1C2727;
}
textarea:focus, textarea:active {
  border-color: #D9825B;
  outline: none;
}
textarea:disabled {
  border-color: #8C8E88;
  color: #8C8E88;
  pointer-events: none;
}
textarea:disabled::placeholder {
  opacity: 0.6;
}

input::placeholder,
textarea::placeholder {
  opacity: 0.6;
}

input[type=file] {
  border: 0;
  border-radius: 0;
  background-color: transparent;
  padding: 0;
  display: flex;
  flex-direction: column-reverse;
  margin: 0 -5px;
  padding: 5px;
}
input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
  display: inline-flex;
  margin-right: 8px;
}
input[type=file]:disabled {
  color: #8C8E88;
  pointer-events: none;
}
input[type=file]:disabled::file-selector-button, input[type=file]:disabled::-webkit-file-upload-button {
  display: inline-flex;
  margin-right: 8px;
  pointer-events: none;
}

input[type=range] {
  appearance: none;
  border: 0;
  background-color: transparent;
  padding: 0;
  width: 100%;
}
input[type=range]::-webkit-slider-runnable-track {
  background-color: transparent;
  border: 2px solid #1C2727;
  border-radius: 32px;
  height: 0.15em;
}
input[type=range]::-webkit-slider-thumb {
  appearance: none;
  background-color: #D9825B;
  border-radius: 32px;
  cursor: pointer;
  height: 1.5em;
  transform: translateY(-50%);
  width: 1.5em;
}
input[type=range]:focus::-webkit-slider-thumb, input[type=range]:active::-webkit-slider-thumb {
  background-color: rgb(236.1881188119, 193.1188118812, 173.8118811881);
}
input[type=range]:hover::-webkit-slider-thumb {
  background-color: rgb(236.1881188119, 193.1188118812, 173.8118811881);
}
input[type=range]:disabled::-webkit-slider-runnable-track {
  border-color: #8C8E88;
}
input[type=range]:disabled::-webkit-slider-thumb {
  background-color: #BCBBB6;
}

input[type=color] {
  background-color: transparent;
  border: 2px solid #1C2727;
  border-radius: 32px;
  box-sizing: border-box;
  height: 2.5em;
  margin-top: 10px;
  padding: 0;
  width: 100%;
  appearance: none;
  cursor: pointer;
}
input[type=color]::placeholder {
  color: #1C2727;
}
input[type=color]:focus, input[type=color]:active {
  border-color: #D9825B;
  outline: none;
}
input[type=color]:disabled {
  border-color: #8C8E88;
  color: #8C8E88;
  pointer-events: none;
}
input[type=color]:disabled::placeholder {
  opacity: 0.6;
}
input[type=color]::-webkit-color-swatch-wrapper {
  padding: 6px;
}
input[type=color]::-webkit-color-swatch {
  border: 0;
  border-radius: 32px;
}

/** Select Box
 * Adapted from: https://kyusuf.com/post/completely-css-custom-checkbox-radio-buttons-and-select-boxes
 *
 * HTML example:
  <div class="control-group">
   <div class="select">
     <select class="input-text">
       <option>First select</option>
       <option>Option</option>
       <option>Option</option>
     </select>
     <div class="select__arrow"></div>
   </div>
  </div>
 *
 *
 * To update the colors of the inputs, the variables should be changed on colors.scss
 *
 */
.select {
  display: inline-block;
  position: relative;
  width: 100%;
}
.select select {
  background-color: transparent;
  border: 2px solid #1C2727;
  border-radius: 32px;
  box-sizing: border-box;
  height: auto;
  margin-top: 10px;
  padding: 0.75em 20px;
  width: 100%;
  appearance: none;
  cursor: pointer;
  outline: 0;
}
.select select::placeholder {
  color: #1C2727;
}
.select select:focus, .select select:active {
  border-color: #D9825B;
  outline: none;
}
.select select:disabled {
  border-color: #8C8E88;
  color: #8C8E88;
  pointer-events: none;
}
.select select:disabled::placeholder {
  opacity: 0.6;
}
.select .select__arrow {
  position: absolute;
  border: solid #1C2727;
  border-width: 0 2px 2px 0;
  right: 20px;
  top: 50%;
  height: 9px;
  width: 9px;
  transform: rotate(45deg);
}
.select select::-ms-expand {
  display: none;
}
.select select:hover {
  background: rgb(236.1881188119, 193.1188118812, 173.8118811881);
}
.select select:disabled {
  color: #BCBBB6;
}
.select select:disabled ~ .select__arrow {
  border-top-color: #BCBBB6;
}
.select select[multiple] {
  border-radius: 12px;
  padding: 4px;
}
.select select[multiple] ~ .select__arrow {
  display: none;
}
.select select[multiple]:hover {
  background-color: transparent;
}
.select select[multiple] option {
  padding: 0 20px;
  margin: 4px;
}
.select select[multiple] option:checked {
  background-color: rgb(236.1881188119, 193.1188118812, 173.8118811881) !important;
}

/**
 * Author : Techhysahil
 * Link : http://techhysahil.com
 * Select2 Override style
 */
/* Assign min-width to container */
.select2-container {
  min-width: 100%;
}

.select2-container--open .select2-dropdown--below,
.select2-container--open .select2-dropdown--above {
  background: transparent;
  border: 2px solid #BCBBB6;
  border-radius: 32px;
  border-top: 0;
}

.select2-container--flat .select2-results__option--highlighted[aria-selected] {
  background: #6FAF8F !important;
  color: white;
}
.select2-container--flat .select2-results__option[aria-selected=true] {
  background: rgb(236.1881188119, 193.1188118812, 173.8118811881);
  color: white;
}
.select2-container--flat.select2-container--open .select2-selection__arrow b {
  transform: rotate(180deg);
}
.select2-container--flat span.select2-search input {
  height: 2.25em !important;
  padding: 0.5em 10px;
}
.select2-container--flat .select2-selection--single {
  background-color: transparent;
  border: 2px solid #1C2727;
  border-radius: 32px;
  box-sizing: border-box;
  height: auto;
  margin-top: 10px;
  padding: 0.75em 20px;
  width: 100%;
}
.select2-container--flat .select2-selection--single::placeholder {
  color: #1C2727;
}
.select2-container--flat .select2-selection--single:focus, .select2-container--flat .select2-selection--single:active {
  border-color: #D9825B;
  outline: none;
}
.select2-container--flat .select2-selection--single:disabled {
  border-color: #8C8E88;
  color: #8C8E88;
  pointer-events: none;
}
.select2-container--flat .select2-selection--single:disabled::placeholder {
  opacity: 0.6;
}
.select2-container--flat .select2-selection--single .select2-selection__rendered {
  padding: 0;
}
.select2-container--flat .select2-selection--single .select2-selection__placeholder {
  color: #1C2727;
}
.select2-container--flat .select2-selection--single .select2-selection__arrow {
  position: absolute;
  right: calc(20px + 10px);
  top: 30px;
}
.select2-container--flat .select2-selection--single .select2-selection__arrow b {
  border-color: #D9825B transparent transparent transparent;
  border-style: solid;
  border-width: 8px 5px 0;
  height: 0;
  position: absolute;
  width: 0;
}
.select2-container--flat .select2-selection--single .select2-selection__clear {
  cursor: pointer;
  float: right;
  margin-right: 20px;
}

.select2-search {
  margin-top: 0;
  /* stylelint-disable-next-line no-descending-specificity */
}
.select2-search input {
  border: 2px solid #BCBBB6;
  border-radius: 32px;
  /* stylelint-disable-next-line no-descending-specificity */
}
.select2-search input:active {
  border-color: #D9825B;
  outline: none;
  outline-width: 0;
}

/**
 * This variables are only assigned to NAVIGATION elements.
 *
 * The accent colors of the project are already assigned to internal variables
 * in the colors stylesheet of the styleguide
 * (e.g.: theme-color("primary"), neutral-color("lightest"),...).
 *
 *
 * The name of this variables should follow this rule:
 * $c_nav-text
 *
 *
 * The variable begins with the initial of the variable type c (color),
 * followed by the element, and the section of the element where will be applied
 * the color.
 *
 * $c_nav
 *
 * In this case this variable represents the background color of the element.
 */
/* FOOTER COLORS */
/* NAV COLORS */
/* PAGINATION COLORS */
/* BREADCRUMB COLORS */
/* SIDENAV COLORS */
/* Footer */
footer {
  background-color: transparent;
}
footer p {
  color: #1C2727;
}
footer .container-medium, footer .navbar, footer .navbar-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  justify-content: space-between;
  padding: 36px 24px;
}
footer .footer-socials {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: end;
  gap: 12px;
}
@media (min-width: 0) {
  footer .footer-socials {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 600px) {
  footer .footer-socials {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 1200px) {
  footer .footer-socials {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
footer .footer-sections {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 24px;
}
footer .copyright {
  color: #6FAF8F;
  text-align: center;
  margin-top: 36px;
}

@media (min-width: 600px) {
  footer .footer-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 900px) {
  footer .footer-sections {
    grid-template-columns: repeat(4, 1fr);
  }
}
.navbar-container {
  background-color: #FBFAF7;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.navbar-content {
  display: contents;
}

.navbar {
  display: grid;
  gap: 8px;
  grid-template-columns: auto auto;
  grid-template-areas: "logo side-buttons" "menu menu";
  padding-top: 32px;
  padding-bottom: 32px;
  z-index: 2000000;
}

.nav-logo {
  display: FLEX;
  padding: 6px;
  grid-area: logo;
}
.nav-logo .nav-logo--logo {
  max-height: 60px;
  height: 100%;
}

.nav__side-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: end;
  grid-area: side-buttons;
}

.nav__menu {
  grid-area: menu;
  position: relative;
}

.menu-btn {
  align-self: flex-end;
  justify-self: start;
}

.burger-menu {
  cursor: pointer;
  height: 10px;
  overflow: hidden;
  position: relative;
  width: 16px;
  margin: 2px;
  display: inline-flex;
}
.burger-menu span {
  background-color: #519070;
  height: 2px;
  left: 0;
  position: absolute;
  transition: 0.2s all;
  width: 100%;
  top: 4px;
}
.burger-menu span:before {
  background-color: #519070;
  height: 2px;
  left: 0;
  position: absolute;
  transition: 0.2s all;
  width: 100%;
  content: "";
  top: -4px;
}
.burger-menu span:after {
  background-color: #519070;
  height: 2px;
  left: 0;
  position: absolute;
  transition: 0.2s all;
  width: 100%;
  bottom: -4px;
  content: "";
}
.burger-menu.open span {
  left: -16px;
}
.burger-menu.open span:before {
  left: 100%;
  top: 0;
  transform: rotate(45deg);
}
.burger-menu.open span:after {
  bottom: 0;
  left: 100%;
  transform: rotate(-45deg);
}

.nav-list-container {
  position: absolute;
  top: calc(100% + 8px);
  width: 100%;
  max-width: 550px;
  height: 0;
  overflow: auto;
  flex-grow: initial;
  transition: height 0.3s ease;
  /* stylelint-disable-next-line selector-max-compound-selectors */
  /* stylelint-disable-next-line selector-max-compound-selectors */
}
.nav-list-container .nav-list {
  background-color: #FBFAF7;
  box-sizing: border-box;
  border: 2px solid #519070;
  border-radius: 32px;
  display: flex;
  align-items: start;
  flex-direction: column;
  gap: 16px;
  margin-left: 0;
  padding: 6px 12px;
}
.nav-list-container .nav-list li {
  list-style: none;
  width: 100%;
}
.nav-list-container .nav-list li .nav-link {
  color: #519070;
  cursor: pointer;
  font-weight: 600;
  transition: color 0.2s ease;
  display: flex;
  place-items: center;
  justify-content: center;
  padding: 6px 12px;
  justify-self: stretch;
  text-align: center;
}
@media (min-width: 0) {
  .nav-list-container .nav-list li .nav-link {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .nav-list-container .nav-list li .nav-link {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .nav-list-container .nav-list li .nav-link {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.nav-list-container .nav-list li .nav-link:hover {
  color: #D9825B;
}
.nav-list-container .nav-list li:not(.nav-dropdown) .nav-link:not(.dropdown-button):hover,
.nav-list-container .nav-list li .nav-link--active:hover,
.nav-list-container .nav-list li .nav-link--active {
  color: #D9825B;
}
.nav-list-container .nav-list li .dropdown-content {
  flex-direction: column;
  gap: 16px;
  max-height: 0;
  height: auto !important;
  overflow: hidden;
  padding: 0;
  transition: all 0.6s ease;
  /* stylelint-disable-next-line selector-max-compound-selectors */
}
.nav-list-container .nav-list li .dropdown-content li {
  padding: 12px 0 0 24px;
}
.nav-list-container .nav-list li .dropdown-button {
  align-items: start;
  display: flex;
  gap: 8px;
}
.nav-list-container .nav-list li .dropdown-button i {
  transform: rotate(90deg);
  transition: all 0.2s ease-in-out;
  /* stylelint-disable-next-line selector-max-compound-selectors */
}
.nav-list-container .nav-list li .dropdown-button i:before {
  font-weight: 700;
}
@media (min-width: 0) {
  .nav-list-container .nav-list li .dropdown-button i:before {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 600px) {
  .nav-list-container .nav-list li .dropdown-button i:before {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
@media (min-width: 1200px) {
  .nav-list-container .nav-list li .dropdown-button i:before {
    font-size: 16px;
    letter-spacing: 0.32px;
  }
}
.nav-list-container .nav-list li .dropdown-button.active-dropdown i {
  transform: rotate(270deg);
  transition: all 0.2s ease-in-out;
}
.nav-list-container .nav-list li .dropdown-content-active {
  height: auto !important;
  max-height: 100dvh !important;
}

@media (min-width: 900px) {
  .navbar-container {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .navbar-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.pagination {
  text-align: center;
}
.pagination .pagination__list {
  display: inline-block;
}
.pagination .pagination__list a, .pagination .pagination__list .nav-list-container .nav-list li .dropdown-button, .nav-list-container .nav-list li .pagination .pagination__list .dropdown-button {
  border-radius: 2px;
  color: #1C2727;
  float: left;
  margin: 0 4px;
  padding: 8px 16px;
  text-decoration: none;
  transition: background-color 0.3s;
}
.pagination .pagination__list a.active-page, .pagination .pagination__list .nav-list-container .nav-list li .active-page.dropdown-button, .nav-list-container .nav-list li .pagination .pagination__list .active-page.dropdown-button {
  background-color: #6FAF8F;
  color: white;
}
.pagination .pagination__list a:hover:not(.active-page), .pagination .pagination__list .nav-list-container .nav-list li .dropdown-button:hover:not(.active-page), .nav-list-container .nav-list li .pagination .pagination__list .dropdown-button:hover:not(.active-page) {
  background-color: #BCBBB6;
}

.breadcrumb {
  list-style: none;
  padding: 0;
}
.breadcrumb li {
  display: inline;
  /* stylelint-disable-next-line no-descending-specificity */
}
.breadcrumb li a:hover, .breadcrumb .nav-list-container .nav-list li .dropdown-button:hover, .nav-list-container .nav-list .breadcrumb li .dropdown-button:hover {
  color: rgb(87.5714285714, 157.6285714286, 122.6);
}
.breadcrumb li + li:before {
  color: #1C2727;
  content: ">";
  padding: 8px;
}

/* Side Navigation */
.menu-sidenav {
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 2;
}
.menu-sidenav .burger-box {
  background-color: #FBFAF7;
  cursor: pointer;
  display: inline-block;
  left: 0;
  padding: 20px 20px 18px;
  position: absolute;
  transition: 0.6s all;
}
.menu-sidenav .burger-box .burger-sidenav {
  cursor: pointer;
  height: 16px;
  overflow: hidden;
  position: relative;
  width: 21px;
  margin: 2px;
  display: inline-block;
}
.menu-sidenav .burger-box .burger-sidenav span {
  background-color: #519070;
  height: 2px;
  left: 0;
  position: absolute;
  transition: 0.2s all;
  width: 100%;
  top: 7px;
}
.menu-sidenav .burger-box .burger-sidenav span:before {
  background-color: #519070;
  height: 2px;
  left: 0;
  position: absolute;
  transition: 0.2s all;
  width: 100%;
  content: "";
  top: -7px;
}
.menu-sidenav .burger-box .burger-sidenav span:after {
  background-color: #519070;
  height: 2px;
  left: 0;
  position: absolute;
  transition: 0.2s all;
  width: 100%;
  bottom: -7px;
  content: "";
}
.menu-sidenav .burger-box .burger-sidenav.open span {
  left: -21px;
}
.menu-sidenav .burger-box .burger-sidenav.open span:before {
  left: 100%;
  top: 0;
  transform: rotate(45deg);
}
.menu-sidenav .burger-box .burger-sidenav.open span:after {
  bottom: 0;
  left: 100%;
  transform: rotate(-45deg);
}
.menu-sidenav .logo {
  margin-top: 20px;
  vertical-align: top;
  width: 40px;
}
.menu-sidenav .sidenav {
  background-color: rgb(87.5714285714, 157.6285714286, 122.6);
  height: 100%;
  left: 0;
  overflow-x: hidden;
  padding-top: 30px;
  position: fixed;
  top: 0;
  transition: 0.6s all;
  width: 0;
  z-index: 1;
}
.menu-sidenav .sidenav .nav-list {
  padding: 0 50px;
}
.menu-sidenav .sidenav .nav-list li {
  list-style: none;
}
.menu-sidenav .sidenav .nav-list a, .menu-sidenav .sidenav .nav-list-container .nav-list li .dropdown-button, .nav-list-container .menu-sidenav .sidenav .nav-list li .dropdown-button {
  border-bottom: 2px solid transparent;
  color: #519070;
  display: block;
  margin: 10px 0;
  padding: 10px 0;
  text-align: left;
  transition: 0.2s all;
}
.menu-sidenav .sidenav .nav-list a:hover, .menu-sidenav .sidenav .nav-list-container .nav-list li .dropdown-button:hover, .nav-list-container .menu-sidenav .sidenav .nav-list li .dropdown-button:hover {
  border-bottom: 2px solid #FBFAF7;
}

/* Page */
* {
  margin: 0;
}

html,
body {
  height: 100%;
  background-color: #FBFAF7;
}

body {
  display: flex;
  flex-direction: column;
  min-width: 100dvw;
}

.container {
  float: none;
  width: 100%;
}

.ne-subtitle {
  color: #1C2727;
}

.ne-section {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  justify-content: center;
}

.ne-section__content {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 550px;
}

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

@media (min-width: 900px) {
  .ne-section {
    flex-direction: row;
  }
}
.ne-divider {
  background-color: #D9825B;
  background-image: url("/assets/logo-horizontal-white-cddd0328.svg");
  background-repeat: repeat-x;
  background-position: center;
  background-size: contain;
  height: 24px;
}

/*
 *  - NUTR&ENTRE Image -
 *  Use this structure:
 *  <div class="ne-image">
 *    <%= image_tag "image.png" %>
 *  </div>
 *
*/
.ne-image {
  position: relative;
  overflow: hidden;
  border-radius: 80px 160px;
  margin: 16px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: rotate(15deg);
}
.ne-image img {
  transform: rotate(-15deg) scale(1.225);
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
}

.cookies {
  background: white;
  border-radius: 32px 32px 0 0;
  bottom: 0;
  box-shadow: 0 -8px 16px rgba(28, 39, 39, 0.25);
  padding: 24px;
  position: fixed;
  width: 100%;
}

.cookies > div:not(.cookies-disclaimer-buttons) {
  margin-left: auto;
  margin-right: auto;
  max-width: 800px;
}

.cookies-disclaimer-buttons {
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  grid-gap: 8px;
  justify-content: flex-end;
  margin-top: 16px;
}

/* ===== modal container fade ===== */
.modal {
  position: fixed;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.6);
  /* Animation */
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 1000;
}

.modal.show {
  opacity: 1;
  pointer-events: auto;
}

/* ===== modal content slide animation ===== */
.modal-content {
  background: white;
  padding: 40px;
  width: 80%;
  max-height: 80%;
  overflow-y: auto;
  position: relative;
  /* Start slightly down + transparent */
  transform: translateY(20px);
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.modal.show .modal-content {
  transform: translateY(0);
  opacity: 1;
}

/* Close button */
.modal-close {
  cursor: pointer;
  position: absolute;
  right: 16px;
  top: 0;
}
@media (min-width: 0) {
  .modal-close {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 600px) {
  .modal-close {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}
@media (min-width: 1200px) {
  .modal-close {
    font-size: 28.8325195313px;
    letter-spacing: 0.5766503906px;
  }
}

/**
 * Shame stylesheet is reserved just for hacky code.
 * The code written to get the release out on time,
 * but the code that makes you ashamed.
 *
 * This is a temporary stylesheet to be clean as soon as possible.
 *
 * Comment every code added here, by answering these questions:
 * 1. What part of the codebase does it relate to?
 * 2. Why was this needed?
 * 3. How does this fix it?
 * 4. How might you fix it properly, given more time?
 *
 */
.page-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: auto;
}

.page-grid__block {
  grid-column: 1/-1;
}

@media (min-width: 768px) {
  .page-grid__block {
    grid-column: var(--col-start)/span var(--col-span);
    grid-row: var(--row-start)/span var(--row-span);
    order: 0;
  }
}
/**
 * Swiper 12.1.2
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2026 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: February 18, 2026
 */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}

:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}

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

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

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}

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

.swiper-horizontal {
  touch-action: pan-y;
}

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

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

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

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

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

.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  backface-visibility: hidden;
}

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

.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}

.swiper-3d {
  perspective: 1200px;
  .swiper-slide,
  .swiper-cube-shadow {
    transform-style: preserve-3d;
  }
}

/* CSS Mode */
.swiper-css-mode {
  > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none; /* For Firefox */
    -ms-overflow-style: none; /* For Internet Explorer and Edge */
    &::-webkit-scrollbar {
      display: none;
    }
  }
  > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start;
  }
  &.swiper-horizontal {
    > .swiper-wrapper {
      scroll-snap-type: x mandatory;
    }
    > .swiper-wrapper > .swiper-slide:first-child {
      margin-inline-start: var(--swiper-slides-offset-before);
      scroll-margin-inline-start: var(--swiper-slides-offset-before);
    }
    > .swiper-wrapper > .swiper-slide:last-child {
      margin-inline-end: var(--swiper-slides-offset-after);
    }
  }
  &.swiper-vertical {
    > .swiper-wrapper {
      scroll-snap-type: y mandatory;
    }
    > .swiper-wrapper > .swiper-slide:first-child {
      margin-block-start: var(--swiper-slides-offset-before);
      scroll-margin-block-start: var(--swiper-slides-offset-before);
    }
    > .swiper-wrapper > .swiper-slide:last-child {
      margin-block-end: var(--swiper-slides-offset-after);
    }
  }
  &.swiper-free-mode {
    > .swiper-wrapper {
      scroll-snap-type: none;
    }
    > .swiper-wrapper > .swiper-slide {
      scroll-snap-align: none;
    }
  }
  &.swiper-centered {
    > .swiper-wrapper::before {
      content: "";
      flex-shrink: 0;
      order: 9999;
    }
    > .swiper-wrapper > .swiper-slide {
      scroll-snap-align: center center;
      scroll-snap-stop: always;
    }
  }
  &.swiper-centered.swiper-horizontal {
    > .swiper-wrapper > .swiper-slide:first-child {
      margin-inline-start: var(--swiper-centered-offset-before);
    }
    > .swiper-wrapper::before {
      height: 100%;
      min-height: 1px;
      width: var(--swiper-centered-offset-after);
    }
  }
  &.swiper-centered.swiper-vertical {
    > .swiper-wrapper > .swiper-slide:first-child {
      margin-block-start: var(--swiper-centered-offset-before);
    }
    > .swiper-wrapper::before {
      width: 100%;
      min-width: 1px;
      height: var(--swiper-centered-offset-after);
    }
  }
}

/* Slide styles start */
/* 3D Shadows */
.swiper-3d {
  .swiper-slide-shadow,
  .swiper-slide-shadow-left,
  .swiper-slide-shadow-right,
  .swiper-slide-shadow-top,
  .swiper-slide-shadow-bottom,
  .swiper-slide-shadow,
  .swiper-slide-shadow-left,
  .swiper-slide-shadow-right,
  .swiper-slide-shadow-top,
  .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
  }
  .swiper-slide-shadow {
    background: rgba(0, 0, 0, 0.15);
  }
  .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
}

.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%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}

.swiper:not(.swiper-watch-progress),
.swiper-watch-progress .swiper-slide-visible {
  .swiper-lazy-preloader {
    animation: swiper-preloader-spin 1s infinite linear;
  }
}

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

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

@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */
.swiper-virtual .swiper-slide {
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}

.swiper-virtual.swiper-css-mode {
  .swiper-wrapper::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
  }
}

.swiper-virtual.swiper-css-mode.swiper-horizontal {
  .swiper-wrapper::after {
    height: 1px;
    width: var(--swiper-virtual-size);
  }
}

.swiper-virtual.swiper-css-mode.swiper-vertical {
  .swiper-wrapper::after {
    width: 1px;
    height: var(--swiper-virtual-size);
  }
}

:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-top-offset: 50%;
  --swiper-navigation-sides-offset: 4px;
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}

.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  width: var(--swiper-navigation-size);
  height: var(--swiper-navigation-size);
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
  &.swiper-button-disabled {
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
  }
  &.swiper-button-hidden {
    opacity: 0;
    cursor: auto;
    pointer-events: none;
  }
  .swiper-navigation-disabled & {
    display: none !important;
  }
  svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform-origin: center;
    fill: currentColor;
    pointer-events: none;
  }
}

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

.swiper-button-prev,
.swiper-button-next {
  top: var(--swiper-navigation-top-offset, 50%);
  margin-top: calc(0px - var(--swiper-navigation-size) / 2);
}

.swiper-button-prev {
  left: var(--swiper-navigation-sides-offset, 4px);
  right: auto;
  .swiper-navigation-icon {
    transform: rotate(180deg);
  }
}

.swiper-button-next {
  right: var(--swiper-navigation-sides-offset, 4px);
  left: auto;
}

.swiper-horizontal {
  .swiper-button-prev,
  .swiper-button-next,
  ~ .swiper-button-prev,
  ~ .swiper-button-next {
    top: var(--swiper-navigation-top-offset, 50%);
    margin-top: calc(0px - var(--swiper-navigation-size) / 2);
    margin-left: 0;
  }
  .swiper-button-prev,
  & ~ .swiper-button-prev,
  &.swiper-rtl .swiper-button-next,
  &.swiper-rtl ~ .swiper-button-next {
    left: var(--swiper-navigation-sides-offset, 4px);
    right: auto;
  }
  .swiper-button-next,
  & ~ .swiper-button-next,
  &.swiper-rtl .swiper-button-prev,
  &.swiper-rtl ~ .swiper-button-prev {
    right: var(--swiper-navigation-sides-offset, 4px);
    left: auto;
  }
  .swiper-button-prev,
  & ~ .swiper-button-prev,
  &.swiper-rtl .swiper-button-next,
  &.swiper-rtl ~ .swiper-button-next {
    .swiper-navigation-icon {
      transform: rotate(180deg);
    }
  }
  &.swiper-rtl .swiper-button-prev,
  &.swiper-rtl ~ .swiper-button-prev {
    .swiper-navigation-icon {
      transform: rotate(0deg);
    }
  }
}

.swiper-vertical {
  .swiper-button-prev,
  .swiper-button-next,
  ~ .swiper-button-prev,
  ~ .swiper-button-next {
    left: var(--swiper-navigation-top-offset, 50%);
    right: auto;
    margin-left: calc(0px - var(--swiper-navigation-size) / 2);
    margin-top: 0;
  }
  .swiper-button-prev,
  ~ .swiper-button-prev {
    top: var(--swiper-navigation-sides-offset, 4px);
    bottom: auto;
    .swiper-navigation-icon {
      transform: rotate(-90deg);
    }
  }
  .swiper-button-next,
  ~ .swiper-button-next {
    bottom: var(--swiper-navigation-sides-offset, 4px);
    top: auto;
    .swiper-navigation-icon {
      transform: rotate(90deg);
    }
  }
}

:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  --swiper-pagination-left: auto;
  --swiper-pagination-right: 8px;
  --swiper-pagination-bottom: 8px;
  --swiper-pagination-top: auto;
  --swiper-pagination-fraction-color: inherit;
  --swiper-pagination-progressbar-bg-color: rgba(0,0,0,0.25);
  --swiper-pagination-progressbar-size: 4px;
  --swiper-pagination-bullet-size: 8px;
  --swiper-pagination-bullet-width: 8px;
  --swiper-pagination-bullet-height: 8px;
  --swiper-pagination-bullet-border-radius: 50%;
  --swiper-pagination-bullet-inactive-color: #000;
  --swiper-pagination-bullet-inactive-opacity: 0.2;
  --swiper-pagination-bullet-opacity: 1;
  --swiper-pagination-bullet-horizontal-gap: 4px;
  --swiper-pagination-bullet-vertical-gap: 6px;
  */
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
  &.swiper-pagination-hidden {
    opacity: 0;
  }
  .swiper-pagination-disabled > &,
  &.swiper-pagination-disabled {
    display: none !important;
  }
}

/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: var(--swiper-pagination-bottom, 8px);
  top: var(--swiper-pagination-top, auto);
  left: 0;
  width: 100%;
}

/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
  .swiper-pagination-bullet {
    transform: scale(0.33);
    position: relative;
  }
  .swiper-pagination-bullet-active {
    transform: scale(1);
  }
  .swiper-pagination-bullet-active-main {
    transform: scale(1);
  }
  .swiper-pagination-bullet-active-prev {
    transform: scale(0.66);
  }
  .swiper-pagination-bullet-active-prev-prev {
    transform: scale(0.33);
  }
  .swiper-pagination-bullet-active-next {
    transform: scale(0.66);
  }
  .swiper-pagination-bullet-active-next-next {
    transform: scale(0.33);
  }
}

.swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
  display: inline-block;
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
  button& {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    appearance: none;
  }
  .swiper-pagination-clickable & {
    cursor: pointer;
  }
  &:only-child {
    display: none !important;
  }
}

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

.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
  right: var(--swiper-pagination-right, 8px);
  left: var(--swiper-pagination-left, auto);
  top: 50%;
  transform: translate3d(0px, -50%, 0);
  .swiper-pagination-bullet {
    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
    display: block;
  }
  &.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    .swiper-pagination-bullet {
      display: inline-block;
      transition: 200ms transform, 200ms top;
    }
  }
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-horizontal.swiper-pagination-bullets {
  .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
  }
  &.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    .swiper-pagination-bullet {
      transition: 200ms transform, 200ms left;
    }
  }
}

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

/* Fraction */
.swiper-pagination-fraction {
  color: var(--swiper-pagination-fraction-color, inherit);
}

/* Progress */
.swiper-pagination-progressbar {
  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
  position: absolute;
  .swiper-pagination-progressbar-fill {
    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-rtl & .swiper-pagination-progressbar-fill {
    transform-origin: right top;
  }
  .swiper-horizontal > &,
  &.swiper-pagination-horizontal,
  .swiper-vertical > &.swiper-pagination-progressbar-opposite,
  &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: var(--swiper-pagination-progressbar-size, 4px);
    left: 0;
    top: 0;
  }
  .swiper-vertical > &,
  &.swiper-pagination-vertical,
  .swiper-horizontal > &.swiper-pagination-progressbar-opposite,
  &.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
    width: var(--swiper-pagination-progressbar-size, 4px);
    height: 100%;
    left: 0;
    top: 0;
  }
}

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

:root {
  /*
  --swiper-scrollbar-border-radius: 10px;
  --swiper-scrollbar-top: auto;
  --swiper-scrollbar-bottom: 4px;
  --swiper-scrollbar-left: auto;
  --swiper-scrollbar-right: 4px;
  --swiper-scrollbar-sides-offset: 1%;
  --swiper-scrollbar-bg-color: rgba(0, 0, 0, 0.1);
  --swiper-scrollbar-drag-bg-color: rgba(0, 0, 0, 0.5);
  --swiper-scrollbar-size: 4px;
  */
}

.swiper-scrollbar {
  border-radius: var(--swiper-scrollbar-border-radius, 10px);
  position: relative;
  touch-action: none;
  background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));
  .swiper-scrollbar-disabled > &,
  &.swiper-scrollbar-disabled {
    display: none !important;
  }
  .swiper-horizontal > &,
  &.swiper-scrollbar-horizontal {
    position: absolute;
    left: var(--swiper-scrollbar-sides-offset, 1%);
    bottom: var(--swiper-scrollbar-bottom, 4px);
    top: var(--swiper-scrollbar-top, auto);
    z-index: 50;
    height: var(--swiper-scrollbar-size, 4px);
    width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
  }
  .swiper-vertical > &,
  &.swiper-scrollbar-vertical {
    position: absolute;
    left: var(--swiper-scrollbar-left, auto);
    right: var(--swiper-scrollbar-right, 4px);
    top: var(--swiper-scrollbar-sides-offset, 1%);
    z-index: 50;
    width: var(--swiper-scrollbar-size, 4px);
    height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
  }
}

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

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

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

/* Zoom container styles start */
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  > img,
  > svg,
  > canvas {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }
}

/* Zoom container styles end */
.swiper-slide-zoomed {
  cursor: move;
  touch-action: none;
}

/* a11y */
.swiper .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-thumbs {
  .swiper-slide-thumb-active {
    /* Styles for active thumb slide */
  }
}

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

.swiper-grid > .swiper-wrapper {
  flex-wrap: wrap;
}

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

.swiper-fade {
  &.swiper-free-mode {
    .swiper-slide {
      transition-timing-function: ease-out;
    }
  }
  .swiper-slide {
    pointer-events: none;
    transition-property: opacity;
    .swiper-slide {
      pointer-events: none;
    }
  }
  .swiper-slide-active {
    pointer-events: auto;
    & .swiper-slide-active {
      pointer-events: auto;
    }
  }
}

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

.swiper-cube {
  .swiper-slide {
    pointer-events: none;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%;
    .swiper-slide {
      pointer-events: none;
    }
  }
  &.swiper-rtl .swiper-slide {
    transform-origin: 100% 0;
  }
  .swiper-slide-active {
    &,
    & .swiper-slide-active {
      pointer-events: auto;
    }
  }
  .swiper-slide-active,
  .swiper-slide-next,
  .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible;
  }
  .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 0;
    &:before {
      content: "";
      background: #000;
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      right: 0;
      filter: blur(50px);
    }
  }
}

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

/* Cube slide shadows start */
.swiper-cube {
  .swiper-slide-shadow-cube.swiper-slide-shadow-top,
  .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,
  .swiper-slide-shadow-cube.swiper-slide-shadow-left,
  .swiper-slide-shadow-cube.swiper-slide-shadow-right {
    z-index: 0;
    backface-visibility: hidden;
  }
}

/* Cube slide shadows end */
.swiper.swiper-flip {
  overflow: visible;
}

.swiper-flip {
  .swiper-slide {
    pointer-events: none;
    backface-visibility: hidden;
    z-index: 1;
    .swiper-slide {
      pointer-events: none;
    }
  }
  .swiper-slide-active {
    &,
    & .swiper-slide-active {
      pointer-events: auto;
    }
  }
}

/* Flip slide shadows start */
.swiper-flip {
  .swiper-slide-shadow-flip.swiper-slide-shadow-top,
  .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,
  .swiper-slide-shadow-flip.swiper-slide-shadow-left,
  .swiper-slide-shadow-flip.swiper-slide-shadow-right {
    z-index: 0;
    backface-visibility: hidden;
  }
}

/* Flip slide shadows end */
.swiper-creative {
  .swiper-slide {
    backface-visibility: hidden;
    overflow: hidden;
    transition-property: transform, opacity, height;
  }
}

.swiper.swiper-cards {
  overflow: visible;
}

.swiper-cards {
  .swiper-slide {
    transform-origin: center bottom;
    backface-visibility: hidden;
    overflow: hidden;
  }
}