/*!******************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/scss/app.scss ***!
  \******************************************************************************************************************************************************/

/* Tailwind */

*,
::before,
::after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: ;
}

::-ms-backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: ;
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: ;
}

/* ! tailwindcss v3.4.16 | MIT License | https://tailwindcss.com */

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* 1 */
    border-width: 0;
    /* 2 */
    border-style: solid;
    /* 2 */
    border-color: #e5e7eb;
    /* 2 */
}

::before,
::after {
    --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
    line-height: 1.5;
    /* 1 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
    -moz-tab-size: 4;
    /* 3 */
    -o-tab-size: 4;
    tab-size: 4;
    /* 3 */
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    /* 4 */
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
    /* 5 */
    font-variation-settings: normal;
    /* 6 */
    -webkit-tap-highlight-color: transparent;
    /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
    margin: 0;
    /* 1 */
    line-height: inherit;
    /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
    height: 0;
    /* 1 */
    color: inherit;
    /* 2 */
    border-top-width: 1px;
    /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
    color: inherit;
    text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
    font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    /* 1 */
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
    /* 2 */
    font-variation-settings: normal;
    /* 3 */
    font-size: 1em;
    /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
    font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
    text-indent: 0;
    /* 1 */
    border-color: inherit;
    /* 2 */
    border-collapse: collapse;
    /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    /* 1 */
    -webkit-font-feature-settings: inherit;
    font-feature-settings: inherit;
    /* 1 */
    font-variation-settings: inherit;
    /* 1 */
    font-size: 100%;
    /* 1 */
    font-weight: inherit;
    /* 1 */
    line-height: inherit;
    /* 1 */
    letter-spacing: inherit;
    /* 1 */
    color: inherit;
    /* 1 */
    margin: 0;
    /* 2 */
    padding: 0;
    /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
    text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
    -webkit-appearance: button;
    /* 1 */
    background-color: transparent;
    /* 2 */
    background-image: none;
    /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
    outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
    box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
    vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
    -webkit-appearance: textfield;
    /* 1 */
    outline-offset: -2px;
    /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
    -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
    -webkit-appearance: button;
    /* 1 */
    font: inherit;
    /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
    display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
    margin: 0;
}

fieldset {
    margin: 0;
    padding: 0;
}

legend {
    padding: 0;
}

ol,
ul,
menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
    padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
    resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    opacity: 1;
    /* 1 */
    color: #9ca3af;
    /* 2 */
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    opacity: 1;
    /* 1 */
    color: #9ca3af;
    /* 2 */
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    opacity: 1;
    /* 1 */
    color: #9ca3af;
    /* 2 */
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    opacity: 1;
    /* 1 */
    color: #9ca3af;
    /* 2 */
}

input::placeholder,
textarea::placeholder {
    opacity: 1;
    /* 1 */
    color: #9ca3af;
    /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
    cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
    cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
    /* 1 */
    vertical-align: middle;
    /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
    max-width: 100%;
    height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
    display: none;
}

.container {
    width: 100%;
}

@media (min-width: 640px) {
    .container {
        max-width: 640px;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 768px;
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 1024px;
    }
}

@media (min-width: 1280px) {
    .container {
        max-width: 1280px;
    }
}

@media (min-width: 1536px) {
    .container {
        max-width: 1536px;
    }
}

.pointer-events-none {
    pointer-events: none;
}

.visible {
    visibility: visible;
}

.absolute {
    position: absolute;
}

.relative {
    position: relative;
}

.sticky {
    position: sticky;
}

.bottom-0 {
    bottom: 0px;
}

.left-0 {
    left: 0px;
}

.left-\[-5\%\] {
    left: -5%;
}

.left-\[50\%\] {
    left: 50%;
}

.right-0 {
    right: 0px;
}

.top-0 {
    top: 0px;
}

.top-\[20\%\] {
    top: 20%;
}

.top-\[50\%\] {
    top: 50%;
}

.top-\[calc\(100\%-24px\)\] {
    top: calc(100% - 24px);
}

.z-\[0\] {
    z-index: 0;
}

.z-\[10\] {
    z-index: 10;
}

.z-\[1\] {
    z-index: 1;
}

.z-\[21\] {
    z-index: 21;
}

.z-\[2\] {
    z-index: 2;
}

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

.my-28 {
    margin-top: 7rem;
    margin-bottom: 7rem;
}

.mb-1 {
    margin-bottom: 0.25rem;
}

.mb-14 {
    margin-bottom: 3.5rem;
}

.mb-16 {
    margin-bottom: 4rem;
}

.mb-2 {
    margin-bottom: 0.5rem;
}

.mb-4 {
    margin-bottom: 1rem;
}

.mb-6 {
    margin-bottom: 1.5rem;
}

.mb-8 {
    margin-bottom: 2rem;
}

.mb-\[64px\] {
    margin-bottom: 64px;
}

.ml-4 {
    margin-left: 1rem;
}

.mt-12 {
    margin-top: 3rem;
}

.mt-16 {
    margin-top: 4rem;
}

.mt-8 {
    margin-top: 2rem;
}

.mt-\[110px\] {
    margin-top: 110px;
}

.mt-\[24px\] {
    margin-top: 24px;
}

.mt-\[32px\] {
    margin-top: 32px;
}

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

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.hidden {
    display: none;
}

.aspect-\[1\/2\] {
    aspect-ratio: 1/2;
}

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

.h-\[40px\] {
    height: 40px;
}

.h-\[80vh\] {
    height: 80vh;
}

.h-auto {
    height: auto;
}

.h-full {
    height: 100%;
}

.h-screen {
    height: 100vh;
}

.min-h-screen {
    min-height: 100vh;
}

.w-\[100\%\] {
    width: 100%;
}

.w-\[125\%\] {
    width: 125%;
}

.w-\[35vh\] {
    width: 35vh;
}

.w-\[40\%\] {
    width: 40%;
}

.w-\[calc\(100\%-80px\)\] {
    width: calc(100% - 80px);
}

.w-auto {
    width: auto;
}

.w-fit {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.w-full {
    width: 100%;
}

.max-w-\[220px\] {
    max-width: 220px;
}

.max-w-\[280px\] {
    max-width: 280px;
}

.max-w-\[420px\] {
    max-width: 420px;
}

.flex-1 {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
}

.translate-x-\[-50\%\] {
    --tw-translate-x: -50%;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-x-\[50\%\] {
    --tw-translate-x: 50%;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-x-\[calc\(-100\%-2\.5vw\)\] {
    --tw-translate-x: calc(-100% - 2.5vw);
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-\[-100\%\] {
    --tw-translate-y: -100%;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-\[-50\%\] {
    --tw-translate-y: -50%;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-\[1\.3\] {
    --tw-scale-x: 1.3;
    --tw-scale-y: 1.3;
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transform {
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.resize {
    resize: both;
}

.flex-col {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-col-reverse {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

.items-start {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.justify-start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.justify-end {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.gap-24 {
    gap: 6rem;
}

.gap-4 {
    gap: 1rem;
}

.gap-6 {
    gap: 1.5rem;
}

.gap-8 {
    gap: 2rem;
}

.overflow-hidden {
    overflow: hidden;
}

.border-b-\[1px\] {
    border-bottom-width: 1px;
}

.border-l-0 {
    border-left-width: 0px;
}

.border-r-0 {
    border-right-width: 0px;
}

.border-t-0 {
    border-top-width: 0px;
}

.border-solid {
    border-style: solid;
}

.border-white {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.bg-dark1 {
    --tw-bg-opacity: 1;
    background-color: rgb(43 41 40 / var(--tw-bg-opacity, 1));
}

.bg-light {
    --tw-bg-opacity: 1;
    background-color: rgb(251 241 229 / var(--tw-bg-opacity, 1));
}

.object-cover {
    -o-object-fit: cover;
    object-fit: cover;
}

.px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.px-\[20px\] {
    padding-left: 20px;
    padding-right: 20px;
}

.py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.pb-8 {
    padding-bottom: 2rem;
}

.pl-\[5vw\] {
    padding-left: 5vw;
}

.pt-16 {
    padding-top: 4rem;
}

.pt-24 {
    padding-top: 6rem;
}

.pt-8 {
    padding-top: 2rem;
}

.font-moderato {
    font-family: moderato;
}

.text-\[120px\] {
    font-size: 120px;
}

.text-\[14px\] {
    font-size: 14px;
}

.text-\[16px\] {
    font-size: 16px;
}

.text-\[24px\] {
    font-size: 24px;
}

.text-\[40px\] {
    font-size: 40px;
}

.text-black {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.text-dark {
    --tw-text-opacity: 1;
    color: rgb(43 41 40 / var(--tw-text-opacity, 1));
}

.text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

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

.opacity-\[0\.2\] {
    opacity: 0.2;
}

.mix-blend-difference {
    mix-blend-mode: difference;
}

.blur {
    --tw-blur: blur(8px);
    -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.invert {
    --tw-invert: invert(100%);
    -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
    -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

/* Core variables */

/* CSS Reset */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    border: none;
    font: inherit;
    font-size: 100%;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}

html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

*,
*:before,
*:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary,
main {
    display: block;
}

audio,
canvas,
video {
    display: inline-block;
}

body {
    margin: 0;
}

ul {
    list-style-type: none;
}

a {
    background: transparent;
    text-decoration: none;
}

button,
input {
    line-height: normal;
}

button,
a {
    outline: none !important;
}

input[type=search] {
    -webkit-appearance: textfield;
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

textarea:focus,
input:focus {
    outline: 0;
}

input {
    margin: 0;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Browser specific styles */

/* Fonts */

@font-face {
    font-family: "unbounded";
/*    src: url(/Content/fonts/Unbounded.fa78bb.woff2) format("woff2");*/
    src: url('fonts/Unbounded-VariableFont_wght.ttf') format('truetype');
    font-style: normal;
}


@font-face {
    font-family: "unbounded-bold";
    /*    src: url(/Content/fonts/Unbounded.fa78bb.woff2) format("woff2");*/
    src: url('fonts/Unbounded-VariableFont_wght.ttf') format('truetype');
    font-style: normal;
    font-weight:bold;
}


/*@font-face {
    font-family: "unbounded-bold";
    src: url(../images/fonts/UnboundedB.28b557.woff2) format("woff2");
    font-style: normal;
}
*/
@font-face {
    font-family: "moderato";
    src: url(/Content/fonts/moderatoA5.ccaa41.woff2) format("woff2");
    font-style: normal;
}

/*@font-face {
    font-family: "moderato-bold";
    src: url(../images/fonts/moderatoA5b.e05e69.woff2) format("woff2");
    font-style: normal;
}*/

/* Typography */

body,
input,
textarea,
option,
select,
table,
form,
p,
a,
pre,
ul,
span,
::before,
::after {
    font-size: inherit;
    line-height: inherit;
    font-family: "unbounded";
    color: #FBF1E5;
}

.terms h1,
.terms .h1,
.terms body,
.terms input,
.terms textarea,
.terms option,
.terms select,
.terms table,
.terms form,
.terms p,
.terms pre,
.terms span,
.terms::before,
.terms::after {
    line-height: inherit;
    font-family: "unbounded";
    color: black;
}

.terms ul,
.terms li,
.terms a,
.terms li a {
    color: maroon;
}

.terms p {
    line-height:150%;
}


h1,
.h1 {
    font-size: 80px;
    line-height: 1;
    color: #FBF1E5;
    font-family: "moderato";
}

@media (max-width: 576px) {
    h1,
    .h1 {
        font-size: 64px;
    }
}

h2,
.h2 {
    font-size: 40px;
    line-height: normal;
    color: #FBF1E5;
    font-family: "moderato";
}

@media (max-width: 576px) {
    h2,
    .h2 {
        font-size: 40px;
    }
}

h3,
.h3 {
    font-size: 24px;
    line-height: normal;
    color: #FBF1E5;
    font-family: "moderato";
}

@media (max-width: 576px) {
    h3,
    .h3 {
        font-size: 24px;
    }
}

p {
    line-height: 124%;
}

@-webkit-keyframes marquee {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(calc(-100% - var(--gap)));
        transform: translateX(calc(-100% - var(--gap)));
    }
}

@keyframes marquee {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(calc(-100% - var(--gap)));
        transform: translateX(calc(-100% - var(--gap)));
    }
}

#hero-seciton {
    overflow: hidden;
}

#hero-seciton .title {
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
}

#hero-seciton .cover-wrapper {
    -webkit-transform: scale(0);
    transform: scale(0);
    visibility: hidden;
    width: 0;
}

#hero-seciton img {
    z-index: 1;
    position: relative;
}

@media (max-width: 576px) {
    #hero-seciton h2 {
        font-size: 40px !important;
    }
}

#hero-seciton .label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 72px;
    z-index: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    height: 0;
}

@media (max-width: 1024px) {
    #hero-seciton .label {
        margin-bottom: 64px;
    }
    #hero-seciton .label span {
        font-size: 14px;
    }
}

#hero-seciton .label span {
    background-color: #FBF1E5;
    width: auto;
    color: #2B2928;
    padding: 4px;
    margin-top: -1px;
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    visibility: hidden;
}

#hero-seciton .label span:first-child {
    z-index: -1;
}

#hero-seciton .label span:last-child {
    z-index: -2;
}

@media (max-width: 1024px) {
    .main-article-section {
        height: 100%;
        position: relative;
        padding: 48px 0;
    }
}

.main-article-section .label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 72px;
}

.main-article-section .label span {
    width: auto;
    padding: 4px;
    font-size: 24px;
}

@media (max-width: 576px) {
    .main-article-section .label span {
        font-size: 16px;
    }
}

@media (max-width: 1024px) {
    .main-article-section .circle-cursor {
        position: absolute;
        bottom: 64px;
        left: 50%;
        -webkit-transform: translateX(-50%) !important;
        transform: translateX(-50%) !important;
        scale: 1 !important;
        opacity: 1 !important;
    }
    .main-article-section .article-text {
        margin-bottom: 72px;
    }
}

.main-article-section .article-text p {
    color: #000000;
    font-family: "moderato";
    font-size: 30px;
    margin-bottom: 24px;
}

@media (max-width: 576px) {
    .main-article-section .article-text p {
        font-size: 24px;
    }
}

#articles .article {
    position: relative;
}

#articles .label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 36px;
}

#articles .label span {
    background-color: #2B2928;
    /*width: auto;*/
    width: 100%;
    color: #FBF1E5;
    padding: 4px;
    margin-top: -1px;
    font-size: 24px;
}

#articles .article-text {
    position: relative;
}

#articles .article-text::after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(90%, #FBF1E5), to(#FBF1E5));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FBF1E5 90%, #FBF1E5 100%);
}

#articles .article-text p {
    color: #2B2928;
    font-family: "moderato";
    font-size: 20px;
    margin-bottom: 12px;
}

.marquee {
    position: relative;
    background: #FBF1E5;
    color: #2B2928;
    padding: 0px 0px;
    font-size: 24px;
    overflow: hidden;
    z-index: 2;
}

.marquee.dark {
    background: #2B2928;
    color: #FBF1E5;
}

.marquee__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.marquee__part {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 0 4px;
}

.hero_media {
    position: absolute;
    -o-object-fit: contain;
    object-fit: contain;
    z-index: 9;
    pointer-events: none;
    -webkit-transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
}

.circle-cursor {
    background: #2B2928;
    display: block;
    border-radius: 100%;
    font-size: 12px;
    width: 128px;
    height: 54px;
    position: fixed;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #FBF1E5;
    display: grid;
    pointer-events: all;
    place-items: center;
    opacity: 1;
    -webkit-transition-property: opacity, scale;
    transition-property: opacity, scale;
    -webkit-transition-duration: 0.15s;
    transition-duration: 0.15s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    z-index: 2;
    scale: 1;
    white-space: nowrap;
}

.circle-cursor-article {
    background: #2B2928;
    display: block;
    border-radius: 100%;
    font-size: 12px;
    width: 128px;
    height: 54px;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #FBF1E5;
    display: grid;
    pointer-events: all;
    place-items: center;
    opacity: 1;
    -webkit-transition-property: opacity, scale;
    transition-property: opacity, scale;
    -webkit-transition-duration: 0.15s;
    transition-duration: 0.15s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    z-index: 2;
    scale: 1;
    white-space: nowrap;
}

.circle-cursor-down {
    background: #ffffff;
    display: block;
    border-radius: 100%;
    font-size: 12px;
    width: 128px;
    height: 54px;
    position: fixed;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #2B2928;
    display: grid;
    pointer-events: all;
    place-items: center;
    opacity: 1;
    -webkit-transition-property: opacity, scale;
    transition-property: opacity, scale;
    -webkit-transition-duration: 0.15s;
    transition-duration: 0.15s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    z-index: 2;
    scale: 1;
    white-space: nowrap;
}

.circle-cursor.hidden,
.circle-cursor-down.hidden,
.circle-cursor-article.hidden {
    opacity: 0;
    scale: 0;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    will-change: transform;
}

/* Components */

.primary-btn {
    --color: #fff;
    --color-hover: var(--color);
    --background: #20396E;
    --background-hover: var(--background);
    --hover-back: #E4AF23;
    --hover-front: #E4AF23;
    display: inline-block;
    padding: 20px 16px;
    border-radius: 100%;
    font-size: 12px;
    border: none;
    outline: none;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    color: var(--c, var(--color));
    background: var(--b, var(--background));
    -webkit-transition: color 0.2s linear var(--c-d, 0.2s), background 0.3s linear var(--b-d, 0.2s);
    transition: color 0.2s linear var(--c-d, 0.2s), background 0.3s linear var(--b-d, 0.2s);
}

.primary-btn.secondary-style {
    --background: #E4AF23;
    --background-hover: var(--hover-back);
    --hover-back: #2B2928;
    --hover-front: #2B2928;
}

.primary-btn.secondary-style span {
    color: #000000;
    -webkit-transition: color 0.3s 0.2s;
    transition: color 0.3s 0.2s;
}

.primary-btn.secondary-style.in {
    background: #E4AF23;
}

.primary-btn.secondary-style.in:not(.out) {
    --c: var(--color-hover);
    --b: var(--background-hover);
}

.primary-btn.secondary-style.in:not(.out):before,
.primary-btn.secondary-style.in:not(.out):after {
    --y: 0;
    --br: 5%;
}

.primary-btn.secondary-style.in:not(.out):after {
    --br: 10%;
    --d-d: .02s;
}

.primary-btn.secondary-style.in:not(.out) span {
    color: #ffffff !important;
    -webkit-transition: color 0.3s 0.2s;
    transition: color 0.3s 0.2s;
}

.primary-btn.modal-btn {
    --hover-back: #2B2928;
    --hover-front: #2B2928;
}

.primary-btn.modal-btn span {
    color: #ffffff;
    -webkit-transition: color 0.3s 0.2s;
    transition: color 0.3s 0.2s;
}

    .primary-btn.modal-btn1 span {
        color: #000;
        -webkit-transition: color 0.3s 0.2s;
        transition: color 0.3s 0.2s;
    }


.primary-btn.modal-btn.in {
    --name: move;
}

.primary-btn.modal-btn.in:not(.out) {
    --c: var(--color-hover);
    --b: var(--background-hover);
}

.primary-btn.modal-btn.in:not(.out):before,
.primary-btn.modal-btn.in:not(.out):after {
    --y: 0;
    --br: 5%;
}

.primary-btn.modal-btn.in:not(.out):after {
    --br: 10%;
    --d-d: .02s;
}

.primary-btn.modal-btn.in:not(.out) span {
    color: #ffffff !important;
    -webkit-transition: color 0.3s 0.2s;
    transition: color 0.3s 0.2s;
}

.primary-btn:not(.simple):before,
.primary-btn:not(.simple):after {
    content: "";
    position: absolute;
    background: var(--pb, var(--hover-back));
    top: 0;
    left: 0;
    right: 0;
    height: 200%;
    border-radius: var(--br, 100%);
    -webkit-transform: translateY(var(--y, 50%));
    transform: translateY(var(--y, 50%));
    -webkit-transition: border-radius 0.4s ease var(--br-d, 0.04s), -webkit-transform var(--d, 0.4s) ease-in var(--d-d, 0s);
    transition: border-radius 0.4s ease var(--br-d, 0.04s), -webkit-transform var(--d, 0.4s) ease-in var(--d-d, 0s);
    transition: transform var(--d, 0.4s) ease-in var(--d-d, 0s), border-radius 0.4s ease var(--br-d, 0.04s);
    transition: transform var(--d, 0.4s) ease-in var(--d-d, 0s), border-radius 0.4s ease var(--br-d, 0.04s), -webkit-transform var(--d, 0.4s) ease-in var(--d-d, 0s);
}

.primary-btn:not(.simple):after {
    --pb: var(--hover-front);
    --d: .44s;
}

.primary-btn div {
    z-index: 1;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    pointer-events: none;
}

.primary-btn div span {
    display: block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: var(--name, none) 0.7s linear forwards 0.18s;
    animation: var(--name, none) 0.7s linear forwards 0.18s;
    -webkit-transition: color 0.3s 0.2s;
    transition: color 0.3s 0.2s;
}

.primary-btn.in {
    --name: move;
}

.primary-btn.in:not(.out) {
    --c: var(--color-hover);
    --b: var(--background-hover);
}

.primary-btn.in:not(.out):before,
.primary-btn.in:not(.out):after {
    --y: 0;
    --br: 5%;
}

.primary-btn.in:not(.out):after {
    --br: 10%;
    --d-d: .02s;
}

.primary-btn.in:not(.out) span {
    color: #2B2928;
    -webkit-transition: color 0.3s 0.2s;
    transition: color 0.3s 0.2s;
}

.primary-btn.in.out {
    --name: move-out;
}

.primary-btn.in.out:before {
    --d-d: .06s;
}

.primary-link, .primary-link1 {
    --color: #fff;
    --color-hover: var(--color);
    display: inline-block;
    font-size: 16px;
    border: none;
    outline: none;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    color: var(--c, var(--color));
    background: var(--b, var(--background));
    -webkit-transition: color 0.2s linear var(--c-d, 0.2s), background 0.3s linear var(--b-d, 0.2s);
    transition: color 0.2s linear var(--c-d, 0.2s), background 0.3s linear var(--b-d, 0.2s);
}

    .primary-link.dark div span, .primary-link1.dark div span {
        color: #2B2928;
    }

    .primary-link:not(.simple):before,
    .primary-link:not(.simple):after,
    .primary-link1:not(.simple):before,
    .primary-link1:not(.simple):after {
        content: "";
        position: absolute;
        background: var(--pb, var(--hover-back));
        top: 0;
        left: 0;
        right: 0;
        height: 200%;
        border-radius: var(--br, 100%);
        -webkit-transform: translateY(var(--y, 50%));
        transform: translateY(var(--y, 50%));
        -webkit-transition: border-radius 0.4s ease var(--br-d, 0.04s), -webkit-transform var(--d, 0.4s) ease-in var(--d-d, 0s);
        transition: border-radius 0.4s ease var(--br-d, 0.04s), -webkit-transform var(--d, 0.4s) ease-in var(--d-d, 0s);
        transition: transform var(--d, 0.4s) ease-in var(--d-d, 0s), border-radius 0.4s ease var(--br-d, 0.04s);
        transition: transform var(--d, 0.4s) ease-in var(--d-d, 0s), border-radius 0.4s ease var(--br-d, 0.04s), -webkit-transform var(--d, 0.4s) ease-in var(--d-d, 0s);
    }

    .primary-link:not(.simple):after, .primary-link1:not(.simple):after {
        --pb: var(--hover-front);
        --d: .44s;
    }

    .primary-link div, .primary-link1 div {
        z-index: 1;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .primary-link div span, .primary-link1 div span {
            display: block;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transform: translateZ(0);
            transform: translateZ(0);
            -webkit-animation: var(--name, none) 0.7s linear forwards 0.18s;
            animation: var(--name, none) 0.7s linear forwards 0.18s;
            -webkit-transition: color 0.4s ease-out;
            transition: color 0.4s ease-out;
        }

    .primary-link.in, .primary-link1.in {
        --name: move;
    }

        .primary-link.in:not(.out), .primary-link1.in:not(.out) {
            --c: var(--color-hover);
            --b: var(--background-hover);
        }

            .primary-link.in:not(.out):before,
            .primary-link.in:not(.out):after, .primary-link1.in:not(.out):before,
            .primary-link1.in:not(.out):after {
                --y: 0;
                --br: 5%;
            }

            .primary-link.in:not(.out):after, .primary-link1.in:not(.out):after {
                --br: 10%;
                --d-d: .02s;
            }

            .primary-link.in:not(.out) span, .primary-link1.in:not(.out) span {
                color: #E4AF23;
                -webkit-transition: color 0.2s ease-out 0.4s;
                transition: color 0.2s ease-out 0.4s;
            }

@-webkit-keyframes move {
    36% {
        -webkit-transform: translateY(calc(-6px * var(--move))) translateZ(0) rotate(calc(-13deg * var(--rotate) * var(--part)));
        transform: translateY(calc(-6px * var(--move))) translateZ(0) rotate(calc(-13deg * var(--rotate) * var(--part)));
    }
    50% {
        -webkit-transform: translateY(calc(3px * var(--move))) translateZ(0) rotate(calc(6deg * var(--rotate) * var(--part)));
        transform: translateY(calc(3px * var(--move))) translateZ(0) rotate(calc(6deg * var(--rotate) * var(--part)));
    }
    70% {
        -webkit-transform: translateY(calc(-2px * var(--move))) translateZ(0) rotate(calc(-3deg * var(--rotate) * var(--part)));
        transform: translateY(calc(-2px * var(--move))) translateZ(0) rotate(calc(-3deg * var(--rotate) * var(--part)));
    }
}

@keyframes move {
    36% {
        -webkit-transform: translateY(calc(-6px * var(--move))) translateZ(0) rotate(calc(-13deg * var(--rotate) * var(--part)));
        transform: translateY(calc(-6px * var(--move))) translateZ(0) rotate(calc(-13deg * var(--rotate) * var(--part)));
    }
    50% {
        -webkit-transform: translateY(calc(3px * var(--move))) translateZ(0) rotate(calc(6deg * var(--rotate) * var(--part)));
        transform: translateY(calc(3px * var(--move))) translateZ(0) rotate(calc(6deg * var(--rotate) * var(--part)));
    }
    70% {
        -webkit-transform: translateY(calc(-2px * var(--move))) translateZ(0) rotate(calc(-3deg * var(--rotate) * var(--part)));
        transform: translateY(calc(-2px * var(--move))) translateZ(0) rotate(calc(-3deg * var(--rotate) * var(--part)));
    }
}

@-webkit-keyframes move-out {
    36% {
        -webkit-transform: translateY(calc(6px * var(--move))) translateZ(0) rotate(calc(13deg * var(--rotate) * var(--part)));
        transform: translateY(calc(6px * var(--move))) translateZ(0) rotate(calc(13deg * var(--rotate) * var(--part)));
    }
    50% {
        -webkit-transform: translateY(calc(-3px * var(--move))) translateZ(0) rotate(calc(-6deg * var(--rotate) * var(--part)));
        transform: translateY(calc(-3px * var(--move))) translateZ(0) rotate(calc(-6deg * var(--rotate) * var(--part)));
    }
    70% {
        -webkit-transform: translateY(calc(2px * var(--move))) translateZ(0) rotate(calc(3deg * var(--rotate) * var(--part)));
        transform: translateY(calc(2px * var(--move))) translateZ(0) rotate(calc(3deg * var(--rotate) * var(--part)));
    }
}

@keyframes move-out {
    36% {
        -webkit-transform: translateY(calc(6px * var(--move))) translateZ(0) rotate(calc(13deg * var(--rotate) * var(--part)));
        transform: translateY(calc(6px * var(--move))) translateZ(0) rotate(calc(13deg * var(--rotate) * var(--part)));
    }
    50% {
        -webkit-transform: translateY(calc(-3px * var(--move))) translateZ(0) rotate(calc(-6deg * var(--rotate) * var(--part)));
        transform: translateY(calc(-3px * var(--move))) translateZ(0) rotate(calc(-6deg * var(--rotate) * var(--part)));
    }
    70% {
        -webkit-transform: translateY(calc(2px * var(--move))) translateZ(0) rotate(calc(3deg * var(--rotate) * var(--part)));
        transform: translateY(calc(2px * var(--move))) translateZ(0) rotate(calc(3deg * var(--rotate) * var(--part)));
    }
}

header {
    position: fixed;
    left: 0;
/*    width: 580px;*/
    background-color: #2B2928;
    z-index: 10;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0px 36px 0px 24px;
    height: 70px;
}

@media (max-width: 1024px) {
    header {
        width: 100vw;
        height: 64px;
        padding: 0 20px;
    }
}

header nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 32px;
}

@media (max-width: 1024px) {
    header nav {
        gap: 20px;
    }
}

header nav a {
    font-size: 14px !important;
}

.mobile-menu {
    background-color: #2B2928;
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 24px;
    overflow: hidden;
    width: 100vw;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    padding: 24px 20px 36px 20px;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
}

.mobile-menu svg {
    margin-bottom: 24px;
    display: block;
    width: 220px;
}

.mobile-menu .close-nav-wrapper {
    position: absolute;
    top: 24px;
    right: 20px;
}

.mobile-menu .close-nav-wrapper a {
    font-size: 14px !important;
}

.mobile-menu a {
    font-size: 24px;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.mobile-menu.open {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
    padding: 24px 20px 36px 20px;
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
}

/* Backdrop styles */

.backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    opacity: 0;
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s;
    z-index: 9;
    pointer-events: none;
}

.backdrop.visible {
    opacity: 1;
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s;
    pointer-events: all;
}

footer {
    padding: 64px 0;
    line-height:160%;
}

@media (max-width: 1024px) {
    footer .flex-1 {
        border-bottom: 1px solid #ffffff;
        padding-bottom: 32px;
    }
}

footer .nav,
footer .legal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
}

html.lenis,
html.lenis body {
    height: auto;
    overflow-x: hidden;
    background-color: #FBF1E5;
}

body::-webkit-scrollbar {
    width: 8px;
    background-color: #000000;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

body::-webkit-scrollbar-thumb {
    background-color: #2B2928;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-smooth iframe {
    pointer-events: none;
}

.container.small {
    max-width: 624px;
}

@media (max-width: 1024px) {
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.project-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0px;
}

@media (min-width: 768px) {
    .project-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 1rem;
    }
}

@media (max-width: 1024px) {
    .project-grid {
        padding-right: 20px;
        padding-left: 20px;
    }
    .project-section {
        padding-right: 20px;
        padding-left: 20px;
    }
}

#archive {
    height: 100vh;
    overflow: hidden;
}

@media (max-width: 576px) {
    #archive {
        height: auto;
    }
}

#archive .bg-dropdown {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 9;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: all 0.8s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transition: all 0.8s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}

#archive .bg-dropdown.open {
    opacity: 1;
    pointer-events: all;
    -webkit-transition: all 0.8s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transition: all 0.8s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    cursor: pointer;
}

#archive #archive-title {
    visibility: hidden;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
}

#archive #main-desc {
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scaleY(0.8);
    transform: scaleY(0.8);
    -webkit-transform-origin: top;
    transform-origin: top;
}

#archive .filters {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
}

@media (max-width: 1024px) {
    #archive .filters {
        margin-bottom: 24px;
    }
}

#archive .filters a {
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
    opacity: 0;
}

#archive .filters a span {
    opacity: 0.3;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

#archive .filters a:hover {
    opacity: 1;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

#archive .filters a:hover span {
    opacity: 1;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

#archive .filters a.active {
    pointer-events: none;
}

#archive .filters a.active span {
    opacity: 1;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

#archive #comet {
    scale: 0;
    visibility: hidden;
    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
}

#archive #archive-text {
    opacity: 0;
    visibility: hidden;
}

#archive .modal {
    position: fixed;
    width: 40%;
    top: 0;
    right: 0;
    background-color: #FBF1E5;
    height: 100%;
    z-index: 10;
    padding: 5vh;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}

@media (max-width: 576px) {
    #archive .modal .header h2 {
        font-size: 34px;
    }
}

@media (max-width: 1024px) {
    #archive .modal {
        width: 80%;
        padding: 40px 20px;
    }
}

@media (max-width: 576px) {
    #archive .modal {
        width: 100%;
        padding: 20px 20px;
    }
}

#archive .modal.open {
    -webkit-transform: translateX(0%) !important;
    transform: translateX(0%) !important;
    -webkit-transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}

#archive .modal .abs-position-btn {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 5vh;
}

#archive .modal .close-modal svg path {
    -webkit-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

#archive .modal .close-modal:hover span {
    color: #E4AF23;
}

#archive .modal .close-modal:hover svg path {
    fill: #E4AF23;
    -webkit-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

#archive .modal .modal-text {
    position: relative;
}

#archive .modal .modal-text p {
    color: #2B2928;
    font-family: "moderato";
    font-size: 20px;
    margin-bottom: 12px;
}

@media (max-width: 1024px) {
    #archive .modal .modal-text p {
        font-size: 24px;
    }
}

@media (max-width: 576px) {
    #archive .modal .modal-text p {
        font-size: 16px;
    }
}

#archive .modal .modal-text::after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(90%, #FBF1E5), to(#FBF1E5));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FBF1E5 90%, #FBF1E5 100%);
}

.slider-section {
    height: 100%;
}

.slider-container {
    opacity: 0;
    -webkit-transform: translate(100%);
    transform: translate(100%);
    visibility: hidden;
}

.slider {
    width: 100%;
    height: auto;
    cursor: -webkit-grab;
    cursor: grab;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.slider-wrapper {
    height: -webkit-max-content;
    height: -moz-max-content;
    height: max-content;
    white-space: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 5vw;
}

.slider-item {
    display: inline-block;
    height: auto;
    width: 28vw;
    padding: 5vw;
    pointer-events: all;
}

@media (max-width: 1024px) {
    .slider-item {
        width: 70vw;
    }
}

.slider-item img {
    cursor: pointer;
    width: 60vw;
}

@media (max-width: 1024px) {
    .slider-item img {
        width: 70vw;
        pointer-events: none;
    }
}

.asb-center {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

@media (max-width: 1024px) {
    #about .hero-section {
        padding: 0 20px;
    }
    #about .slogan {
        padding: 110px 0 0 0;
    }
}

#about canvas {
    cursor: -webkit-grab;
    cursor: grab;
}

#about #comet {
    visibility: hidden;
}

@media (max-width: 1024px) {
    #about #comet {
        width: 120%;
    }
}

#about #about-title {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
}

#about #main-desc p {
    -webkit-transform: scaleY(0.8);
    transform: scaleY(0.8);
    visibility: hidden;
    opacity: 0;
    -webkit-transform-origin: top;
    transform-origin: top;
    max-width: 624px;
    font-size: 24px;
}

@media (max-width: 576px) {
    #about #main-desc p {
        font-size: 16px;
    }
}

@media (max-width: 1024px) {
    #about .interactiv-elements {
        position: relative;
        height: 60vh;
        -webkit-box-flex: 1;
        -ms-flex: auto;
        flex: auto;
    }
}

#about .freiraum-25-wrapper {
    width: 100%;
    height: 100%;
}

#about .freiraum-25-floats {
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform-origin: 75%;
    transform-origin: 75%;
    width: 100%;
    height: 100%;
    scale: 0;
    opacity: 0;
    visibility: hidden;
}

#about .desc p {
    margin-bottom: 24px;
}

@media (max-width: 1024px) {
    #about .desc p {
        margin-bottom: 16px;
    }
}

#terms h1 {
    font-size: 80px;
    color: #000000;
    line-height: 1;
    margin-bottom: 48px;
}

@media (max-width: 1024px) {
    #terms h1 {
        margin-bottom: 16px;
        font-size: 40px;
    }
}

.wysiwyg {
    color: #000000;
    font-family: "moderato";
}

.wysiwyg h2 {
    margin-top: 16px;
    font-size: 30px;
    color: #000000;
}

.wysiwyg h3 {
    font-size: 24px;
    margin-top: 16px;
    color: #000000;
}

.wysiwyg ul {
    list-style-type: circle;
    padding-left: 20px;
    margin-bottom: 16px;
}

.wysiwyg ul li {
    margin-top: 5px;
    font-size: 18px;
    font-family: "moderato";
}

@media (max-width: 576px) {
    .wysiwyg ul li {
        font-size: 16px;
    }
}

.wysiwyg ol {
    list-style-type: decimal;
    padding-left: 20px;
    margin-bottom: 16px;
}

.wysiwyg ol li {
    margin-top: 5px;
    font-size: 18px;
    font-family: "moderato";
}

@media (max-width: 576px) {
    .wysiwyg ol li {
        font-size: 16px;
    }
}

.wysiwyg p {
    margin-top: 6px;
    color: #000000;
    font-family: "moderato";
}

.wysiwyg p strong {
    font-family: "moderato-bold";
}

.wysiwyg strong {
    font-family: "moderato-bold";
}

.wysiwyg a {
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    text-decoration: underline !important;
    color: #E4AF23 !important;
}

.wysiwyg a div {
    text-decoration: underline !important;
}

#anim-title {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
}

.wysiwyg {
    -webkit-transform: scaleY(0.8);
    transform: scaleY(0.8);
    visibility: hidden;
    opacity: 0;
    -webkit-transform-origin: top;
    transform-origin: top;
}

#team .rows {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
}

#team .rows .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    gap: 24px;
    width: 100%;
}

#team .rows .left-side {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

#team .rows .left-side P {
    text-align: right;
}

#team .rows .right-side {
    width: 50%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px;
}

#team .rows .right-side p {
    font-family: "moderato";
    font-size: 24px;
}

#team .rows .right-side p a {
    font-family: "moderato";
    font-size: 24px;
    color: #000000;
}

#team .rows p {
    color: #000000;
}

.modereto {
    font-family: "moderato" !important;
}

@media (min-width: 768px) {
    .md\:-mt-64 {
        margin-top: -16rem;
    }
    .md\:mb-\[20\%\] {
        margin-bottom: 20%;
    }
    .md\:mt-0 {
        margin-top: 0px;
    }
    .md\:mt-\[20\%\] {
        margin-top: 20%;
    }
    .md\:h-\[50vh\] {
        height: 50vh;
    }
    .md\:w-\[20\%\] {
        width: 20%;
    }
    .md\:w-\[40\%\] {
        width: 40%;
    }
    .md\:w-auto {
        width: auto;
    }
    .md\:max-w-\[100\%\] {
        max-width: 100%;
    }
    .md\:flex-row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
    .md\:items-start {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    .md\:gap-0 {
        gap: 0px;
    }
    .md\:gap-64 {
        gap: 16rem;
    }
    .md\:px-0 {
        padding-left: 0px;
        padding-right: 0px;
    }
    .md\:py-48 {
        padding-top: 12rem;
        padding-bottom: 12rem;
    }
    .md\:pt-0 {
        padding-top: 0px;
    }
}

@media (min-width: 1024px) {
    .lg\:flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .lg\:hidden {
        display: none;
    }
}

@media (min-width: 1280px) {
    .xl\:absolute {
        position: absolute;
    }
    .xl\:left-\[100\%\] {
        left: 100%;
    }
    .xl\:left-\[50\%\] {
        left: 50%;
    }
    .xl\:top-\[50\%\] {
        top: 50%;
    }
    .xl\:my-48 {
        margin-top: 12rem;
        margin-bottom: 12rem;
    }
    .xl\:mb-0 {
        margin-bottom: 0px;
    }
    .xl\:mb-20 {
        margin-bottom: 5rem;
    }
    .xl\:mb-8 {
        margin-bottom: 2rem;
    }
    .xl\:mt-0 {
        margin-top: 0px;
    }
    .xl\:mt-\[-20\%\] {
        margin-top: -20%;
    }
    .xl\:mt-\[20\%\] {
        margin-top: 20%;
    }
    .xl\:flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .xl\:hidden {
        display: none;
    }
    .xl\:h-screen {
        height: 100vh;
    }
    .xl\:w-\[40vh\] {
        width: 40vh;
    }
    .xl\:w-auto {
        width: auto;
    }
    .xl\:translate-x-\[-50\%\] {
        --tw-translate-x: -50%;
        -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }
    .xl\:translate-y-\[-50\%\] {
        --tw-translate-y: -50%;
        -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }
    .xl\:flex-row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
    .xl\:items-end {
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }
    .xl\:items-center {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .xl\:justify-end {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
    .xl\:gap-16 {
        gap: 4rem;
    }
    .xl\:gap-2 {
        gap: 0.5rem;
    }
    .xl\:gap-4 {
        gap: 1rem;
    }
    .xl\:border-b-0 {
        border-bottom-width: 0px;
    }
    .xl\:py-32 {
        padding-top: 8rem;
        padding-bottom: 8rem;
    }
    .xl\:pb-0 {
        padding-bottom: 0px;
    }
    .xl\:pt-0 {
        padding-top: 0px;
    }
    .xl\:text-right {
        text-align: right;
    }
    .xl\:text-\[30px\] {
        font-size: 30px;
    }
}


.slider-section {
    height: 100%;
}

.modal {
    position: fixed;
    width: 40%;
    top: 0;
    right: 0;
    left:unset !important;
    background-color: #FBF1E5;
    height: 100%;
    z-index: 10;
    padding: 5vh;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}


.modal.open {
    -webkit-transform: translateX(0%) !important;
    transform: translateX(0%) !important;
    -webkit-transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transition: all 1.2s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    display:block;
}


.showInfo {
    cursor:pointer;

}

    .showInfo:hover {
        font-weight:bold;
    }


.businessCard {
    margin:15px 0;
}

.businessCard p {
    line-height: 150% !important;
    color: black !important;
    font-size: 1.3vw;
    font-family:moderato;
}


.carouselItems {
    display: inline-block;
}

.login {
    padding: 30px;
    /*display: flex;*/
    justify-content: center;
    align-items: center;
/*    height: 70vh;*/
    margin-top: 70px;
}
    .login b {
        font-weight:500;
    }
        .login h2 {
        margin-bottom: 20px;
    }

    .login h4, .login h2, .login label, .login p, .login button, .login h3, .login .h3, .login div {
        color: black;
    }

    .login input {
        width: 100%;
        padding: 10px;
        margin: 10px 0;
        color: black !important;
        -webkit-appearance: auto;
        -moz-appearance: auto;
        appearance: auto;
    }
    .login a {
        color: #71541f;
    }

    .login a:hover {
        color: #61440f;
    }

    .login .text-danger {
        color: red;
    }



    .login input[type=submit] {
        border: 1px solid #999;
        cursor: pointer;
        padding: 10px;
        background-color: #E4AF23;
    }

    .login input[type=submit]:hover {
        color:black !important;

    }
        .login input[type=checkbox] {
        width:35px;
    }


.googleButton {
    background-image: url('/images/googlelogo.svg');
    background-repeat: no-repeat;
    background-size: 30px;
    background-color: white;
    padding-left: 40px;
}

    .googleButton:hover {
        background-color: white !important;
        color: black !important;
    }


.facebookButton {
    background-image: url('/images/FacebookLogo.svg');
    background-repeat: no-repeat;
    background-size: 30px;
    background-color: white;
    padding-left: 40px;
}

    .facebookButton:hover {
        background-color: white !important;
        color: black !important;
    }

.field-validation-error span {
    color: red !important;
}
.text-danger span {
    color: red !important;
    margin-bottom: 20px;
    display: block;
    font-size: 14px;
}

.mobile-wrapper .btn {
    color:white;
}


*[id^='privacy'] {
    margin-top: 15px;
    font-size: x-large !important;
}


.arrowRight, .arrowLeft {
    position:absolute;
    top:45%;
    font-size:40px;
    cursor:pointer;
    border-radius:49%;
    padding:3px;
}
.arrowRight {
    right:5px;
}
.arrowLeft {
    left: 5px;
}


.arrowRight:hover, .arrowLeft:hover {
    background-color: lightgray;
}

.mySlickCarousel {
    z-index:8;
    margin-top:80px;
}

img.myslickImage {
    margin: 0 auto;
}


img.cItem:hover {
    transition: .5s ease all;
    transform: scale(1.1) !important;
}

.overflowHidden {
    overflow:hidden;
}