/*!
 * 1990KB Grid System.
 * The responsive CSS flexbox grid system by 1990KB.
 *
 * @version 2.4.3
 *
 * @author Kevin Brand
 * @mail   kevin@1990kb.de
 * @url    https://1990kb.de
 *
 * Copyright (c) Kevin Brand
 *
 * @license GPLv3 or later
 *          https://www.gnu.org/licenses/gpl-3.0.html
 */
.grid {
  --grid-width: auto;
  --grid-max-width: none;
  display: block;
  width: var(--grid-width);
  max-width: var(--grid-max-width);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
.grid.fullsize {
  --grid-width: 100%;
  --grid-max-width: none;
}
.grid::after,
.grid::before {
  content: "";
  display: table;
  width: 100%;
  height: 0;
}
.grid.-debug,
.grid.-debug .col,
.grid.-debug .row {
  background-color: rgba(255, 0, 255, 0.1);
  outline: 1px solid transparent;
  outline-offset: -1px;
}
.grid.-debug:hover {
  outline-color: #3cb371;
  background-color: rgba(60, 179, 113, 0.1);
}
.grid.-debug .row:hover {
  outline-color: #00bfff;
  background-color: rgba(0, 191, 255, 0.1);
}
.grid.-debug .col:hover {
  outline-color: #f0f;
}
.grid.-debug .col {
  min-height: 50px;
  outline-color: rgba(255, 0, 255, 0.25);
}
.row {
  --grid-columns: 12;
  --vertical-gutter-width: 30px;
  --horizontal-gutter-width: 30px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: var(--horizontal-gutter-width) var(--vertical-gutter-width);
}
.row + .row {
  margin-top: var(--horizontal-gutter-width);
}
.row,
.row > .col {
  box-sizing: border-box;
}
.row > .col {
  --column-span: var(--grid-columns);
  --column-offset-span: 0;
  display: block;
  flex: 0 0 auto;
  width: calc(
    (
        (100% - ((var(--grid-columns) - 1) * var(--vertical-gutter-width))) *
          (var(--column-span) / var(--grid-columns))
      ) + ((var(--column-span) - 1) * var(--vertical-gutter-width))
  );
  margin-left: calc(
    (
        (100% - ((var(--grid-columns) - 1) * var(--vertical-gutter-width))) *
          (var(--column-offset-span) / var(--grid-columns))
      ) + (var(--column-offset-span) * var(--vertical-gutter-width))
  );
}
.row > .col > :not(.row):nth-child(1) {
  margin-top: 0;
}
.row > .col > :not(.row):nth-last-child(1) {
  margin-bottom: 0;
}
.row.top {
  align-items: flex-start;
}
.row.middle {
  align-items: center;
}
.row.bottom {
  align-items: flex-end;
}
.row.left {
  justify-content: flex-start;
}
.row.center {
  justify-content: center;
}
.row.right {
  justify-content: flex-end;
}
@media all and (min-width: 75em) {
  .grid {
    --grid-width: 90%;
    --grid-max-width: 71.666667rem;
  }
  .row {
    --grid-columns: 12;
    --horizontal-gutter-width: 1.666667rem;
  }
  .row > .col.desktop-1 {
    --column-span: 1;
  }
  .row > .col.offset-desktop-1 {
    --column-offset-span: 1;
  }
  .row > .col.desktop-2 {
    --column-span: 2;
  }
  .row > .col.offset-desktop-2 {
    --column-offset-span: 2;
  }
  .row > .col.desktop-3 {
    --column-span: 3;
  }
  .row > .col.offset-desktop-3 {
    --column-offset-span: 3;
  }
  .row > .col.desktop-4 {
    --column-span: 4;
  }
  .row > .col.offset-desktop-4 {
    --column-offset-span: 4;
  }
  .row > .col.desktop-5 {
    --column-span: 5;
  }
  .row > .col.offset-desktop-5 {
    --column-offset-span: 5;
  }
  .row > .col.desktop-6 {
    --column-span: 6;
  }
  .row > .col.offset-desktop-6 {
    --column-offset-span: 6;
  }
  .row > .col.desktop-7 {
    --column-span: 7;
  }
  .row > .col.offset-desktop-7 {
    --column-offset-span: 7;
  }
  .row > .col.desktop-8 {
    --column-span: 8;
  }
  .row > .col.offset-desktop-8 {
    --column-offset-span: 8;
  }
  .row > .col.desktop-9 {
    --column-span: 9;
  }
  .row > .col.offset-desktop-9 {
    --column-offset-span: 9;
  }
  .row > .col.desktop-10 {
    --column-span: 10;
  }
  .row > .col.offset-desktop-10 {
    --column-offset-span: 10;
  }
  .row > .col.desktop-11 {
    --column-span: 11;
  }
  .row > .col.offset-desktop-11 {
    --column-offset-span: 11;
  }
  .row > .col.desktop-12 {
    --column-span: 12;
  }
  .row > .col.offset-desktop-12 {
    --column-offset-span: 12;
  }
  .row,
  .row.gutter-v-normal,
  .row.normal-gutter {
    --vertical-gutter-width: 1.666667rem;
  }
  .row.gutter-h-normal,
  .row.normal-gutter {
    --horizontal-gutter-width: 1.666667rem;
  }
  .row.gutter-v-small,
  .row.small-gutter {
    --vertical-gutter-width: 0.277778rem;
  }
  .row.gutter-h-small,
  .row.small-gutter {
    --horizontal-gutter-width: 0.277778rem;
  }
  .row.gutter-v-none,
  .row.no-gutter {
    --vertical-gutter-width: 0px;
  }
  .row.gutter-h-none,
  .row.no-gutter {
    --horizontal-gutter-width: 0px;
  }
  .col.hide-desktop,
  .hide-desktop {
    display: none !important;
  }
}
@media all and (min-width: 56.25em) and (max-width: 74.9375em) {
  .grid {
    --grid-width: 90%;
    --grid-max-width: 56.25rem;
  }
  .row {
    --grid-columns: 12;
    --horizontal-gutter-width: 1.875rem;
  }
  .row > .col.tablet-1 {
    --column-span: 1;
  }
  .row > .col.offset-tablet-1 {
    --column-offset-span: 1;
  }
  .row > .col.tablet-2 {
    --column-span: 2;
  }
  .row > .col.offset-tablet-2 {
    --column-offset-span: 2;
  }
  .row > .col.tablet-3 {
    --column-span: 3;
  }
  .row > .col.offset-tablet-3 {
    --column-offset-span: 3;
  }
  .row > .col.tablet-4 {
    --column-span: 4;
  }
  .row > .col.offset-tablet-4 {
    --column-offset-span: 4;
  }
  .row > .col.tablet-5 {
    --column-span: 5;
  }
  .row > .col.offset-tablet-5 {
    --column-offset-span: 5;
  }
  .row > .col.tablet-6 {
    --column-span: 6;
  }
  .row > .col.offset-tablet-6 {
    --column-offset-span: 6;
  }
  .row > .col.tablet-7 {
    --column-span: 7;
  }
  .row > .col.offset-tablet-7 {
    --column-offset-span: 7;
  }
  .row > .col.tablet-8 {
    --column-span: 8;
  }
  .row > .col.offset-tablet-8 {
    --column-offset-span: 8;
  }
  .row > .col.tablet-9 {
    --column-span: 9;
  }
  .row > .col.offset-tablet-9 {
    --column-offset-span: 9;
  }
  .row > .col.tablet-10 {
    --column-span: 10;
  }
  .row > .col.offset-tablet-10 {
    --column-offset-span: 10;
  }
  .row > .col.tablet-11 {
    --column-span: 11;
  }
  .row > .col.offset-tablet-11 {
    --column-offset-span: 11;
  }
  .row > .col.tablet-12 {
    --column-span: 12;
  }
  .row > .col.offset-tablet-12 {
    --column-offset-span: 12;
  }
  .row,
  .row.gutter-v-normal,
  .row.normal-gutter {
    --vertical-gutter-width: 1.875rem;
  }
  .row.gutter-h-normal,
  .row.normal-gutter {
    --horizontal-gutter-width: 1.875rem;
  }
  .row.gutter-v-small,
  .row.small-gutter {
    --vertical-gutter-width: 0.3125rem;
  }
  .row.gutter-h-small,
  .row.small-gutter {
    --horizontal-gutter-width: 0.3125rem;
  }
  .row.gutter-v-none,
  .row.no-gutter {
    --vertical-gutter-width: 0px;
  }
  .row.gutter-h-none,
  .row.no-gutter {
    --horizontal-gutter-width: 0px;
  }
  .col.hide-tablet,
  .hide-tablet {
    display: none !important;
  }
}
@media all and (min-width: 37.5em) and (max-width: 56.1875em) {
  .grid {
    --grid-width: 90%;
    --grid-max-width: 37.5rem;
  }
  .row {
    --grid-columns: 12;
    --horizontal-gutter-width: 1.25rem;
  }
  .row > .col.phablet-1 {
    --column-span: 1;
  }
  .row > .col.offset-phablet-1 {
    --column-offset-span: 1;
  }
  .row > .col.phablet-2 {
    --column-span: 2;
  }
  .row > .col.offset-phablet-2 {
    --column-offset-span: 2;
  }
  .row > .col.phablet-3 {
    --column-span: 3;
  }
  .row > .col.offset-phablet-3 {
    --column-offset-span: 3;
  }
  .row > .col.phablet-4 {
    --column-span: 4;
  }
  .row > .col.offset-phablet-4 {
    --column-offset-span: 4;
  }
  .row > .col.phablet-5 {
    --column-span: 5;
  }
  .row > .col.offset-phablet-5 {
    --column-offset-span: 5;
  }
  .row > .col.phablet-6 {
    --column-span: 6;
  }
  .row > .col.offset-phablet-6 {
    --column-offset-span: 6;
  }
  .row > .col.phablet-7 {
    --column-span: 7;
  }
  .row > .col.offset-phablet-7 {
    --column-offset-span: 7;
  }
  .row > .col.phablet-8 {
    --column-span: 8;
  }
  .row > .col.offset-phablet-8 {
    --column-offset-span: 8;
  }
  .row > .col.phablet-9 {
    --column-span: 9;
  }
  .row > .col.offset-phablet-9 {
    --column-offset-span: 9;
  }
  .row > .col.phablet-10 {
    --column-span: 10;
  }
  .row > .col.offset-phablet-10 {
    --column-offset-span: 10;
  }
  .row > .col.phablet-11 {
    --column-span: 11;
  }
  .row > .col.offset-phablet-11 {
    --column-offset-span: 11;
  }
  .row > .col.phablet-12 {
    --column-span: 12;
  }
  .row > .col.offset-phablet-12 {
    --column-offset-span: 12;
  }
  .row,
  .row.gutter-v-normal,
  .row.normal-gutter {
    --vertical-gutter-width: 1.25rem;
  }
  .row.gutter-h-normal,
  .row.normal-gutter {
    --horizontal-gutter-width: 1.25rem;
  }
  .row.gutter-v-small,
  .row.small-gutter {
    --vertical-gutter-width: 0.3125rem;
  }
  .row.gutter-h-small,
  .row.small-gutter {
    --horizontal-gutter-width: 0.3125rem;
  }
  .row.gutter-v-none,
  .row.no-gutter {
    --vertical-gutter-width: 0px;
  }
  .row.gutter-h-none,
  .row.no-gutter {
    --horizontal-gutter-width: 0px;
  }
  .col.hide-phablet,
  .hide-phablet {
    display: none !important;
  }
}
@media all and (max-width: 37.4375em) {
  .grid {
    --grid-width: 90%;
  }
  .row {
    --grid-columns: 12;
    --horizontal-gutter-width: 1.25rem;
  }
  .row > .col.phone-1 {
    --column-span: 1;
  }
  .row > .col.offset-phone-1 {
    --column-offset-span: 1;
  }
  .row > .col.phone-2 {
    --column-span: 2;
  }
  .row > .col.offset-phone-2 {
    --column-offset-span: 2;
  }
  .row > .col.phone-3 {
    --column-span: 3;
  }
  .row > .col.offset-phone-3 {
    --column-offset-span: 3;
  }
  .row > .col.phone-4 {
    --column-span: 4;
  }
  .row > .col.offset-phone-4 {
    --column-offset-span: 4;
  }
  .row > .col.phone-5 {
    --column-span: 5;
  }
  .row > .col.offset-phone-5 {
    --column-offset-span: 5;
  }
  .row > .col.phone-6 {
    --column-span: 6;
  }
  .row > .col.offset-phone-6 {
    --column-offset-span: 6;
  }
  .row > .col.phone-7 {
    --column-span: 7;
  }
  .row > .col.offset-phone-7 {
    --column-offset-span: 7;
  }
  .row > .col.phone-8 {
    --column-span: 8;
  }
  .row > .col.offset-phone-8 {
    --column-offset-span: 8;
  }
  .row > .col.phone-9 {
    --column-span: 9;
  }
  .row > .col.offset-phone-9 {
    --column-offset-span: 9;
  }
  .row > .col.phone-10 {
    --column-span: 10;
  }
  .row > .col.offset-phone-10 {
    --column-offset-span: 10;
  }
  .row > .col.phone-11 {
    --column-span: 11;
  }
  .row > .col.offset-phone-11 {
    --column-offset-span: 11;
  }
  .row > .col.phone-12 {
    --column-span: 12;
  }
  .row > .col.offset-phone-12 {
    --column-offset-span: 12;
  }
  .row,
  .row.gutter-v-normal,
  .row.normal-gutter {
    --vertical-gutter-width: 1.25rem;
  }
  .row.gutter-h-normal,
  .row.normal-gutter {
    --horizontal-gutter-width: 1.25rem;
  }
  .row.gutter-v-small,
  .row.small-gutter {
    --vertical-gutter-width: 0.3125rem;
  }
  .row.gutter-h-small,
  .row.small-gutter {
    --horizontal-gutter-width: 0.3125rem;
  }
  .row.gutter-v-none,
  .row.no-gutter {
    --vertical-gutter-width: 0px;
  }
  .row.gutter-h-none,
  .row.no-gutter {
    --horizontal-gutter-width: 0px;
  }
  .col.hide-phone,
  .hide-phone {
    display: none !important;
  }
}