@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Round');

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 100 700;
    src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v138/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format('woff2');
}

@font-face {
    font-family: 'Material Symbols Rounded';
    font-style: normal;
    font-weight: 100 700;
    src: url(https://fonts.gstatic.com/s/materialsymbolsrounded/v138/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) format('woff2');
}

*[class^="material-symbols"] {
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
}

.material-symbols,
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';

}

.material-symbols-rounded,
.material-symbols-rounded-outlined,
.material-symbols-outlined-rounded {
    font-family: 'Material Symbols Rounded';
}

.material-symbols {
    font-variation-settings:
        'FILL' 1,
        'wght' 400,
        'GRAD' 0,
        'opsz' 24
}

.material-symbols-outlined {
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 24
}

.material-symbols-rounded {
    font-variation-settings:
        'FILL' 1,
        'wght' 400,
        'GRAD' 0,
        'opsz' 24
}

.material-symbols-rounded-outlined,
.material-symbols-outlined-rounded {
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 24
}

:root {
    --bg: hsl(0, 0%, 100%);
    --text: hsl(0, 0%, 15%);
    --action: hsl(346, 78%, 41%);
    --action-hs: 346, 78%;
    --action-l: 41%;
    --coral: hsl(358, 100%, 74%);
    --rose: hsl(358, 100%, 65%);
    --scarlet: hsl(338, 65%, 47%);
    --crimson: hsl(344, 83%, 47%);
    --red: hsl(347, 91%, 50%);
    --brick: hsl(27, 100%, 50%);
    --orange: hsl(36, 93%, 58%);
    --amber: hsl(45, 100%, 51%);
    --yellow: hsl(54, 100%, 51%);
    --lime: hsl(64, 86%, 54%);
    --mint: hsl(86, 88%, 68%);
    --lightgreen: hsl(145, 79%, 72%);
    --teal: hsl(159, 77%, 62%);
    --green: hsl(165, 100%, 40%);
    --pine: hsl(168, 51%, 50%);
    --turquoise: hsl(180, 85%, 46%);
    --pine: hsl(174, 100%, 36%);
    --steelblue: rgb(19, 122, 207);
    --blue: hsl(211, 91%, 61%);
    --lightblue: hsl(201, 100%, 68%);
    --lavender: rgba(204, 153, 255, 1);
    --purple: rgba(234, 128, 252, 1);
    --magenta: hsl(288, 99%, 63%);
    --pink: hsl(303, 100%, 69%);
    --indigo: hsl(246, 100%, 60%);
    --lila: hsl(258, 99%, 63%);
    --gold: hsl(44, 81%, 70%);
    --silver: hsl(240, 10%, 86%);
    --bronze: hsl(32, 65%, 60%);
    --shadow: rgba(0, 0, 0, 0.1) 0px 3px 5px, rgba(0, 0, 0, 0.1) 0px 3px 5px;
    --shadowHov: rgba(0, 0, 0, 0.1) 0px 14px 28px, rgba(0, 0, 0, 0.1) 0px 10px 10px;
    --shadowPressed: rgba(0, 0, 0, 0.1) 0px 1px 3px, rgba(0, 0, 0, 0.1) 0px 1px 2px;
}

* {
    font-family: Montserrat;
    -webkit-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -ms-overflow-style: none;

    user-zoom: none;
    box-sizing: border-box;
    scroll-behavior: smooth;
}

.mdi:before {
    width: 24px;
    height: 24px;
    font-size: 24px;
}

html {
    scrollbar-width: thin;
}
*:not(html) {
    scrollbar-width: none;
}

*:not(html)::-webkit-scrollbar {
    background-color: transparent;
    -webkit-appearance: none;
    height: 0px;
    width: 0px;
}

*:not(html)::-webkit-scrollbar-thumb {
    background-color: transparent;
}

html,body {
    margin: 0;
    color: var(--text);
}

img,
a {
    user-drag: none;
    -webkit-user-drag: none;
}

.hidden {
    display: none !important;
}

.invisible {
    visibility: collapse;
}

.inactive {
    pointer-events: none;
}

.active {
    pointer-events: auto;
}

.interactive {
    cursor: pointer;
}

.nooverflow,
.o0 {
    overflow: hidden;
}

.nowrap {
    white-space: nowrap;
}

.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    min-width: 0;
}

.l2,
.l3,
.l4,
.l5,
.l6,
.l7,
.l8,
.l9,
.l10 {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.l1 {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.l2 {
    -webkit-line-clamp: 2;
    line-clamp: 2;
    max-lines: 2;
}

.l3 {
    -webkit-line-clamp: 3;
    line-clamp: 3;
    max-lines: 3;
}

.l4 {
    -webkit-line-clamp: 4;
    line-clamp: 4;
    max-lines: 4;
}

.l5 {
    -webkit-line-clamp: 5;
    line-clamp: 5;
    max-lines: 5;
}

.l6 {
    -webkit-line-clamp: 6;
    line-clamp: 6;
    max-lines: 6;
}

.l7 {
    -webkit-line-clamp: 7;
    line-clamp: 7;
    max-lines: 7;
}

.l8 {
    -webkit-line-clamp: 8;
    line-clamp: 8;
    max-lines: 8;
}

.l9 {
    -webkit-line-clamp: 9;
    line-clamp: 9;
    max-lines: 9;
}

.l10 {
    -webkit-line-clamp: 10;
    line-clamp: 10;
    max-lines: 10;
}

@media screen and (max-width: 600px) {

    .show-tablet:not(.show-mobile),
    .show-laptop:not(.show-mobile),
    .show-desktop:not(.show-mobile),
    .min-tablet,
    .min-laptop {
        display: none !important;
    }
}

@media screen and (min-width: 600px) and (max-width: 1000px) {

    .show-mobile:not(.show-tablet),
    .show-laptop:not(.show-tablet),
    .show-desktop:not(.show-tablet),
    .min-laptop {
        display: none !important;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1800px) {

    .show-mobile:not(.show-laptop),
    .show-tablet:not(.show-laptop),
    .show-desktop:not(.show-laptop),
    .max-tablet {
        display: none !important;
    }
}

@media screen and (min-width: 1800px) {

    .show-mobile:not(.show-desktop),
    .show-tablet:not(.show-desktop),
    .show-laptop:not(.show-desktop),
    .max-tablet,
    .max-laptop {
        display: none !important;
    }
}

.rel {
    position: relative;
}

.abs {
    position: absolute;
}

.square,
.ratio-1,
.ratio-1-1,
.ratio-square {
    aspect-ratio: 1;
}

.ratio-16-9 {
    aspect-ratio: 16/9;
}

.ratio-9-16 {
    aspect-ratio: 9/16;
}

.ratio-2-3 {
    aspect-ratio: 2/3;
}

.ratio-3-2 {
    aspect-ratio: 3/2;
}

.ratio-4-5 {
    aspect-ratio: 4/5;
}

.ratio-5-4 {
    aspect-ratio: 5/4;
}

.selectable {
    user-select: unset !important;
}

::-moz-selection {
    background: hsla(var(--action-hs), var(--action-l), .5);
}

::selection {
    background: hsla(var(--action-hs), var(--action-l), .5);
}

*:not(#map *):not(.pswp *),
*:not(#map *)::before,
*:not(#map *)::after {
    transition: all ease 0.2s;
}

.noanimate {
    transition: none !important;
}

.noanimate-all,
.noanimate-all * {
    transition: none !important;
}

.cover {
    object-fit: cover;
}

.contain {
    object-fit: contain;
}

*[class*="bgimg"] {
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #f0f0f0;
}

.bgimg-tl {
    background-position: 0% 0%;
}

.bgimg-tc {
    background-position: top;
}

.bgimg-tr {
    background-position: 100% 0%;
}

.bgimg-cl {
    background-position: left;
}

.bgimg,
.bgimg-c,
.bgimg-cc {
    background-position: center;
}

.bgimg-cr {
    background-position: right;
}

.bgimg-bl {
    background-position: 0% 100%;
}

.bgimg-bc {
    background-position: bottom;
}

.bgimg-br {
    background-position: 100% 100%;
}

a {
    font-weight: 500;
    color: var(--action);
}

a,
a:link:active,
a:visited:active {
    text-decoration: none;
}

button,
.button {
    cursor: pointer;
    border: none;
}

.floatbutton {
    --c: var(--action);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    text-decoration: none;
    color: var(--c);
    background-color: white;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
    box-shadow: var(--shadow);
}

.floatbutton.grey,
.floatbutton.gray {
    color: rgb(105, 105, 105) !important;
}

.elevatedbutton {
    --hs: var(--action-hs);
    --l: var(--action-l);
    --color: hsl(var(--hs), var(--l));
    --light: hsl(var(--hs), calc(var(--l) + 10%));
    --dark: hsl(var(--hs), calc(var(--l) - 10%));
    --o-10: hsla(var(--hs), var(--l), 0.1);
    --o-20: hsla(var(--hs), var(--l), 0.2);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    text-decoration: none;
    color: white;
    background-color: var(--color);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
    box-shadow: var(--shadow);
}

.tonalbutton-elevated,
.tonalbutton {
    --color1: var(--primary);
    --color2: var(--accent);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    text-decoration: none;
    color: white;
    background-color: var(--color);
    background-image: linear-gradient(90deg, var(--color1) 0%, var(--color2) 50%, var(--color1) 100%);
    background-size: 200% 100%;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}

.tonalbutton-elevated {
    box-shadow: var(--shadow);
}

.fullbutton {
    --hs: var(--action-hs);
    --l: var(--action-l);
    --color: hsl(var(--hs), var(--l));
    --light: hsl(var(--hs), calc(var(--l) + 10%));
    --dark: hsl(var(--hs), calc(var(--l) - 10%));
    --o-10: hsla(var(--hs), var(--l), 0.1);
    --o-20: hsla(var(--hs), var(--l), 0.2);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    text-decoration: none;
    color: white;
    background-color: var(--color);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}

.halfbutton {
    --hs: var(--action-hs);
    --l: var(--action-l);
    --color: hsl(var(--hs), var(--l));
    --light: hsl(var(--hs), calc(var(--l) + 10%));
    --dark: hsl(var(--hs), calc(var(--l) - 10%));
    --o-10: hsla(var(--hs), var(--l), 0.1);
    --o-20: hsla(var(--hs), var(--l), 0.2);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    text-decoration: none;
    color: var(--color);
    background-color: var(--o-20);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}

.outlinebutton {
    --hs: var(--action-hs);
    --l: var(--action-l);
    --color: hsl(var(--hs), var(--l));
    --light: hsl(var(--hs), calc(var(--l) + 10%));
    --dark: hsl(var(--hs), calc(var(--l) - 10%));
    --o-10: hsla(var(--hs), var(--l), 0.1);
    --o-20: hsla(var(--hs), var(--l), 0.2);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    box-shadow: var(--color) 0 0 0 1.5px inset;
    vertical-align: middle;
    text-decoration: none;
    color: var(--color);
    background-color: rgba(255, 255, 255, 0);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}

.outlinebutton.thin {
    box-shadow: hsl(0, 0%, 85%) 0 0 0 .5px inset;
}

.linebutton {
    --hs: var(--action-hs);
    --l: var(--action-l);
    --color: hsl(var(--hs), var(--l));
    --light: hsl(var(--hs), calc(var(--l) + 10%));
    --dark: hsl(var(--hs), calc(var(--l) - 10%));
    --o-10: hsla(var(--hs), var(--l), 0.1);
    --o-20: hsla(var(--hs), var(--l), 0.2);
    display: flex;
    font-size: 14px;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    text-transform: uppercase;
    font-weight: 600;
    vertical-align: middle;
    text-decoration: none;
    color: var(--color);
    background-color: rgba(255, 255, 255, 0);
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}

.FAB {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1000;
}

.floatbutton:hover,
.floatbutton:focus {
    background-color: hsl(0, 0%, 98%);
    box-shadow: var(--shadowHov);
}

.floatbutton:active {
    background-color: whitesmoke;
    box-shadow: var(--shadowPressed);
}

.elevatedbutton:hover,
.elevatedbutton:focus {
    background-color: var(--light);
    box-shadow: var(--shadowHov);
}

.elevatedbutton:active {
    background-color: var(--dark);
    box-shadow: var(--shadowPressed);
}

.tonalbutton:hover,
.tonalbutton-elevated:hover,
.tonalbutton:focus,
.tonalbutton-elevated:focus {
    background-position: 100% 0;
}

.tonalbutton-elevated:hover,
.tonalbutton-elevated:focus {
    box-shadow: var(--shadowHov);
}

.tonalbutton-elevated:active {
    box-shadow: var(--shadowPressed);
}

.fullbutton:hover,
.fullbutton:focus {
    background-color: var(--light);
}

.halfbutton:hover,
.halfbutton:focus {
    background-color: var(--light);
    color: white;
}

.outlinebutton:hover,
.outlinebutton:focus,
.linebutton:hover,
.linebutton:focus {
    background-color: var(--o-10);
}

.outlinebutton:active,
.linebutton:active {
    background-color: var(--o-20);
}

.fullbutton:active,
.halfbutton:active {
    background-color: var(--dark);
    color: white;
    outline: 0px;
}

.lc {
    text-transform: none !important;
}

button,
a.button {
    cursor: pointer;
    border: none;
}

.buttongroup-v,
.buttongroup-h {
    --line: #f0f0f0;
    display: flex;
    overflow: hidden;
    box-shadow: var(--shadow);
    background-color: white;
}

.buttongroup-v {
    flex-direction: column;
}

.buttongroup-h>* {
    box-shadow: none !important;
    border-right: 1px solid var(--line);
}

.buttongroup-v>* {
    box-shadow: none !important;
    border-bottom: 1px solid var(--line);
}

.buttongroup-h>*:last-child {
    border-right: none;
}

.buttongroup-v>*:last-child {
    border-bottom: none;
}

.buttongroup-v,
.buttongroup-h {
    overflow: hidden;
}

.buttongroup-v:hover,
.buttongroup-h:hover {
    box-shadow: var(--shadowHov);
}

.buttongroup-v:active,
.buttongroup-h:active {
    box-shadow: var(--shadowPressed);
}

.outlinebutton.white {
    color: white;
    box-shadow: white 0 0 0 2px inset;
}

.linebutton.white {
    color: white;
}

.outlinebutton.white:hover,
.outlinebutton.white:focus,
.linebutton.white:hover,
.linebutton.white:focus {
    background-color: rgba(255, 255, 255, 0.2);
}

.linebutton.white:active,
.outlinebutton.white:active {
    background-color: white;
    color: var(--color);
}

.txt {
    padding: 9px 12px !important;
}

.txt.wide {
    padding: 15px 16px !important;
}

.ico-txt {
    padding: 6px 12px 6px 8px !important;
}

.txt-ico {
    padding: 6px 8px 6px 12px !important;
}

.ico-txt.wide {
    padding: 12px 16px 12px 12px !important;
}

.txt-ico.wide {
    padding: 12px 12px 12px 16px !important;
}

.ico {
    padding: 6px !important;
}

.ico.wide {
    padding: 12px !important;
}

.ico-txt.reveal {
    padding: 6px !important;
    gap: 0;
}

.ico-txt.reveal span:nth-child(2) {
    max-width: 0;
    overflow: hidden;
}

.ico-txt.reveal:hover {
    padding: 6px 12px 6px 8px !important;
    gap: 6px;
}

.ico-txt.reveal:hover span:nth-child(2) {
    max-width: unset;
}

.ico-txt.reveal.wide {
    padding: 12px !important;
    gap: 0;
}

.ico-txt.reveal.wide span:nth-child(2) {
    max-width: 0;
    overflow: hidden;
}

.ico-txt.reveal.wide:hover {
    padding: 12px 16px 12px 12px !important;
    gap: 8px;
}

.ico-txt.reveal.wide:hover span:nth-child(2) {
    max-width: unset;
}

.card,
.card0 {
    box-shadow: var(--shadow);
    overflow: hidden;
    background-color: white;
}

.card.outlined,
.card0.outlined {
    box-shadow: hsl(0, 0%, 85%) 0 0 0 .5px;
}

.card:hover {
    box-shadow: var(--shadowHov);
    cursor: pointer;
}

.card:active {
    box-shadow: var(--shadowPressed);
}

.r {
    border-radius: 10000px;
}

.r0 {
    border-radius: 0;
}

.r5 {
    border-radius: 5px;
}

.r10 {
    border-radius: 10px;
}

.r15 {
    border-radius: 15px;
}

.r20 {
    border-radius: 20px;
}

.r25 {
    border-radius: 25px;
}

.r30 {
    border-radius: 30px;
}

.r40 {
    border-radius: 40px;
}

.r50 {
    border-radius: 50px;
}

.main,
.allmain>*:not(.nomain) {
    max-width: calc(100vw - 30px);
    width: 900px;
    margin: 0 auto;
}

.main-wide,
.allmain-wide>*:not(.nomain) {
    max-width: calc(100vw - 30px);
    width: 1200px;
    margin: 0 auto;
}

.main .tilegrid,
.allmain>*:not(.nomain) .tilegrid {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.main-wide .tilegrid,
.allmain-wide>*:not(.nomain) .tilegrid {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

@media screen and (max-width: 1230px) {

    .main-wide .tilegrid,
    .allmain-wide>*:not(.nomain) .tilegrid {
        max-width: 900px;
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media screen and (max-width: 930px) {

    .main .tilegrid,
    .allmain>*:not(.nomain) .tilegrid,
    .main-wide .tilegrid,
    .allmain-wide>*:not(.nomain) .tilegrid {
        max-width: 600px;
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 630px) {

    .main .tilegrid,
    .allmain>*:not(.nomain) .tilegrid,
    .main-wide .tilegrid,
    .allmain-wide>*:not(.nomain) .tilegrid {
        max-width: 300px;
        grid-template-columns: 1fr;
    }

    .main .tilegrid.flexible,
    .allmain>*:not(.nomain) .tilegrid.flexible,
    .main-wide .tilegrid.flexible,
    .allmain-wide>*:not(.nomain) .tilegrid.flexible {
        max-width: calc(100vw - 30px);
    }
}

.center:not([class*="flex"]) {
    text-align: center;
}

.balanced {
    text-wrap: balance;
}

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

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

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

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

.center {
    justify-content: center;
}

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

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

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

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

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

.stretch {
    justify-content: stretch;
}

.rev {
    flex-direction: row-reverse;
}

.col {
    flex-direction: column;
}

.col.rev {
    flex-direction: column-reverse;
}

.wrap {
    flex-wrap: wrap;
}

.wrap-rev {
    flex-wrap: wrap-reverse;
}

.grow {
    flex-grow: 1;
}

.gap1 {
    gap: 1px;
}

.gap2 {
    gap: 2px;
}

.gap3 {
    gap: 3px;
}

.gap4 {
    gap: 4px;
}

.gap5 {
    gap: 5px;
}

.gap6 {
    gap: 6px;
}

.gap8 {
    gap: 8px;
}

.gap10 {
    gap: 10px;
}

.gap12 {
    gap: 12px;
}

.gap14 {
    gap: 14px;
}

.gap15 {
    gap: 15px;
}

.gap16 {
    gap: 16px;
}

.gap18 {
    gap: 18px;
}

.gap20 {
    gap: 20px;
}

.gap22 {
    gap: 22px;
}

.gap24 {
    gap: 24px;
}

.gap25 {
    gap: 25px;
}

.gap30 {
    gap: 30px;
}

.gap40 {
    gap: 40px;
}

.gap50 {
    gap: 50px;
}

.gaph1 {
    column-gap: 1px;
}

.gaph2 {
    column-gap: 2px;
}

.gaph3 {
    column-gap: 3px;
}

.gaph4 {
    column-gap: 4px;
}

.gaph5 {
    column-gap: 5px;
}

.gaph6 {
    column-gap: 6px;
}

.gaph8 {
    column-gap: 8px;
}

.gaph10 {
    column-gap: 10px;
}

.gaph12 {
    column-gap: 12px;
}

.gaph14 {
    column-gap: 14px;
}

.gaph15 {
    column-gap: 15px;
}

.gaph16 {
    column-gap: 16px;
}

.gaph18 {
    column-gap: 18px;
}

.gaph20 {
    column-gap: 20px;
}

.gaph22 {
    column-gap: 22px;
}

.gaph24 {
    column-gap: 24px;
}

.gaph25 {
    column-gap: 25px;
}

.gaph30 {
    column-gap: 30px;
}

.gaph40 {
    column-gap: 40px;
}

.gaph50 {
    column-gap: 50px;
}

.gapv1 {
    row-gap: 1px;
}

.gapv2 {
    row-gap: 2px;
}

.gapv3 {
    row-gap: 3px;
}

.gapv4 {
    row-gap: 4px;
}

.gapv5 {
    row-gap: 5px;
}

.gapv6 {
    row-gap: 6px;
}

.gapv8 {
    row-gap: 8px;
}

.gapv10 {
    row-gap: 10px;
}

.gapv12 {
    row-gap: 12px;
}

.gapv14 {
    row-gap: 14px;
}

.gapv15 {
    row-gap: 15px;
}

.gapv16 {
    row-gap: 16px;
}

.gapv18 {
    row-gap: 18px;
}

.gapv20 {
    row-gap: 20px;
}

.gapv22 {
    row-gap: 22px;
}

.gapv24 {
    row-gap: 24px;
}

.gapv25 {
    row-gap: 25px;
}

.gapv30 {
    row-gap: 30px;
}

.gapv40 {
    row-gap: 40px;
}

.gapv50 {
    row-gap: 50px;
}

.m1 {
    margin: 1px;
}

.m2 {
    margin: 2px;
}

.m3 {
    margin: 3px;
}

.m4 {
    margin: 4px;
}

.m5 {
    margin: 5px;
}

.m6 {
    margin: 6px;
}

.m8 {
    margin: 8px;
}

.m10 {
    margin: 10px;
}

.m12 {
    margin: 12px;
}

.m14 {
    margin: 14px;
}

.m15 {
    margin: 15px;
}

.m16 {
    margin: 16px;
}

.m18 {
    margin: 18px;
}

.m20 {
    margin: 20px;
}

.m22 {
    margin: 22px;
}

.m24 {
    margin: 24px;
}

.m25 {
    margin: 25px;
}

.m30 {
    margin: 30px;
}

.m40 {
    margin: 40px;
}

.m50 {
    margin: 50px;
}

.mh1 {
    margin-left: 1px !important;
    margin-right: 1px !important;
}

.mh2 {
    margin-left: 2px !important;
    margin-right: 2px !important;
}

.mh3 {
    margin-left: 3px !important;
    margin-right: 3px !important;
}

.mh4 {
    margin-left: 4px !important;
    margin-right: 4px !important;
}

.mh5 {
    margin-left: 5px !important;
    margin-right: 5px !important;
}

.mh6 {
    margin-left: 6px !important;
    margin-right: 6px !important;
}

.mh8 {
    margin-left: 8px !important;
    margin-right: 8px !important;
}

.mh10 {
    margin-left: 10px !important;
    margin-right: 10px !important;
}

.mh12 {
    margin-left: 12px !important;
    margin-right: 12px !important;
}

.mh14 {
    margin-left: 14px !important;
    margin-right: 14px !important;
}

.mh15 {
    margin-left: 15px !important;
    margin-right: 15px !important;
}

.mh16 {
    margin-left: 16px !important;
    margin-right: 16px !important;
}

.mh18 {
    margin-left: 18px !important;
    margin-right: 18px !important;
}

.mh20 {
    margin-left: 20px !important;
    margin-right: 20px !important;
}

.mh22 {
    margin-left: 22px !important;
    margin-right: 22px !important;
}

.mh24 {
    margin-left: 24px !important;
    margin-right: 24px !important;
}

.mh25 {
    margin-left: 25px !important;
    margin-right: 25px !important;
}

.mh30 {
    margin-left: 30px !important;
    margin-right: 30px !important;
}

.mh40 {
    margin-left: 40px !important;
    margin-right: 40px !important;
}

.mh50 {
    margin-left: 50px !important;
    margin-right: 50px !important;
}

.mv1 {
    margin-top: 1px !important;
    margin-bottom: 1px !important;
}

.mv2 {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}

.mv3 {
    margin-top: 3px !important;
    margin-bottom: 3px !important;
}

.mv4 {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}

.mv5 {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

.mv6 {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
}

.mv8 {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
}

.mv10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.mv12 {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
}

.mv14 {
    margin-top: 14px !important;
    margin-bottom: 14px !important;
}

.mv15 {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}

.mv16 {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
}

.mv18 {
    margin-top: 18px !important;
    margin-bottom: 18px !important;
}

.mv20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

.mv22 {
    margin-top: 22px !important;
    margin-bottom: 22px !important;
}

.mv24 {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
}

.mv25 {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
}

.mv30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

.mv40 {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
}

.mv50 {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
}

.m0,
.nomargin {
    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
}

.p1 {
    padding: 1px;
}

.p2 {
    padding: 2px;
}

.p3 {
    padding: 3px;
}

.p4 {
    padding: 4px;
}

.p5 {
    padding: 5px;
}

.p6 {
    padding: 6px;
}

.p8 {
    padding: 8px;
}

.p10 {
    padding: 10px;
}

.p12 {
    padding: 12px;
}

.p14 {
    padding: 14px;
}

.p15 {
    padding: 15px;
}

.p16 {
    padding: 16px;
}

.p18 {
    padding: 18px;
}

.p20 {
    padding: 20px;
}

.p22 {
    padding: 22px;
}

.p24 {
    padding: 24px;
}

.p25 {
    padding: 25px;
}

.p30 {
    padding: 30px;
}

.p40 {
    padding: 40px;
}

.p50 {
    padding: 50px;
}

.ph1 {
    padding-left: 1px;
    padding-right: 1px;
}

.ph2 {
    padding-left: 2px;
    padding-right: 2px;
}

.ph3 {
    padding-left: 3px;
    padding-right: 3px;
}

.ph4 {
    padding-left: 4px;
    padding-right: 4px;
}

.ph5 {
    padding-left: 5px;
    padding-right: 5px;
}

.ph6 {
    padding-left: 6px;
    padding-right: 6px;
}

.ph8 {
    padding-left: 8px;
    padding-right: 8px;
}

.ph10 {
    padding-left: 10px;
    padding-right: 10px;
}

.ph12 {
    padding-left: 12px;
    padding-right: 12px;
}

.ph14 {
    padding-left: 14px;
    padding-right: 14px;
}

.ph15 {
    padding-left: 15px;
    padding-right: 15px;
}

.ph16 {
    padding-left: 16px;
    padding-right: 16px;
}

.ph18 {
    padding-left: 18px;
    padding-right: 18px;
}

.ph20 {
    padding-left: 20px;
    padding-right: 20px;
}

.ph22 {
    padding-left: 22px;
    padding-right: 22px;
}

.ph24 {
    padding-left: 24px;
    padding-right: 24px;
}

.ph25 {
    padding-left: 25px;
    padding-right: 25px;
}

.ph30 {
    padding-left: 30px;
    padding-right: 30px;
}

.ph40 {
    padding-left: 40px;
    padding-right: 40px;
}

.ph50 {
    padding-left: 50px;
    padding-right: 50px;
}

.pv1 {
    padding-top: 1px;
    padding-bottom: 1px;
}

.pv2 {
    padding-top: 2px;
    padding-bottom: 2px;
}

.pv3 {
    padding-top: 3px;
    padding-bottom: 3px;
}

.pv4 {
    padding-top: 4px;
    padding-bottom: 4px;
}

.pv5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.pv6 {
    padding-top: 6px;
    padding-bottom: 6px;
}

.pv8 {
    padding-top: 8px;
    padding-bottom: 8px;
}

.pv10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.pv12 {
    padding-top: 12px;
    padding-bottom: 12px;
}

.pv14 {
    padding-top: 14px;
    padding-bottom: 14px;
}

.pv15 {
    padding-top: 15px;
    padding-bottom: 15px;
}

.pv16 {
    padding-top: 16px;
    padding-bottom: 16px;
}

.pv18 {
    padding-top: 18px;
    padding-bottom: 18px;
}

.pv20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

.pv22 {
    padding-top: 22px;
    padding-bottom: 22px;
}

.pv24 {
    padding-top: 24px;
    padding-bottom: 24px;
}

.pv25 {
    padding-top: 25px;
    padding-bottom: 25px;
}

.pv30 {
    padding-top: 30px;
    padding-bottom: 30px;
}

.pv40 {
    padding-top: 40px;
    padding-bottom: 40px;
}

.pv50 {
    padding-top: 50px;
    padding-bottom: 50px;
}

.fullwidth {
    width: 100%;
}

.fullheight {
    height: 100%;
}

.expand {
    width: 100%;
    height: 100%;
}

.fullwindow {
    width: 100vw;
    height: 100svh;
}

.form-field:not(:placeholder-shown):valid+label::before {
    font-family: 'Material Icons';
    content: "done";
    pointer-events: none;
    display: inline-block;
    transform: translateY(10%);
    padding-right: 2px;
}

.form-field:required~label::after {
    content: " *";
    margin-left: 4px;
}

.form-field.visited:invalid {
    border-bottom: 1px solid crimson;
}

.form-field.visited:invalid~label {
    color: crimson;
}

.form-field.visited:invalid:hover {
    background-color: rgba(220, 20, 60, 0.2);
}

.form-field.visited:invalid:focus {
    border-bottom: 2px solid crimson;
}

.form-field.visited:invalid~p.helper {
    display: none;
}

.form-field.visited:invalid~p.error {
    display: block;
}

.form-field.visited:invalid~label::before {
    font-family: 'Material Icons';
    content: "error_outline";
    color: crimson;
    pointer-events: none;
    display: inline-block;
    transform: translateY(10%);
    padding-right: 2px;
}

.form-group {
    position: relative;
    padding-top: 15px;
}

.form-group p.helper {
    display: block;
    position: absolute;
    font-size: 12px;
    color: rgba(105, 105, 105, 0.5);
    margin-top: 0;
    padding-left: 5px;
}

.form-group p.error {
    display: none;
    position: absolute;
    font-size: 12px;
    color: crimson;
    margin-top: 0;
    padding-left: 5px;
}

.form-group textarea~p.helper {
    transform: translateY(-4px);
}

.form-group textarea~p.error {
    transform: translateY(-4px);
}

.form-field {
    background-color: transparent;
    width: 100%;
    border: 0;
    outline: 0;
    border-bottom: 1px solid rgba(105, 105, 105, 0.5);
    font-size: 16px;
    color: var(--darkGrey);
    padding: 5px;
    box-sizing: border-box;
}

.form-field:hover {
    border-radius: 6px;
    background-color: hsla(var(--action-hs), var(--action-l), .2);
    border-bottom: 1px solid hsla(var(--action-hs), var(--action-l), .2);
}

.form-field:hover~.form-label {
    color: hsl(var(--action-hs), var(--action-l));
}

.form-field::placeholder {
    color: transparent;
}

.form-field:placeholder-shown~.form-label,
select:invalid~.form-label {
    font-size: 16px;
    cursor: text;
    top: 20px;
    left: 5px;
    pointer-events: none;
}

.form-label,
.form-field:focus~.form-label {
    position: absolute;
    top: 0px;
    left: 5px;
    display: flex;
    font-size: 12px;
    color: #9b9b9b;
}

.form-field:focus~.form-label {
    color: var(--action);
}

.form-field:focus {
    padding-bottom: 4px;
    border-bottom: 2px solid var(--action);
}

select option {
    color: black;
    background-color: white;
    border-radius: 100px;
}

select:valid {
    color: var(--text);
}

select:invalid {
    color: gray;
}

select {
    outline: none;
    border: none;
    font-size: 16px;
    padding: 4px 6px;
    height: 30px;
}

textarea {
    resize: none;
}