html {
    min-height: 100%;
    scroll-behavior: smooth;
    --tw-bg-opacity: 1;
    background-color: rgb(from var(--color-grey-1) r g b / var(--tw-bg-opacity))
}

:root {
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-grey: #f2f2f2;
    --color-red: #c80d17;
    --color-green: #2ccf37;
    --color-gold: #ffb800;
    --color-blue: #5e9ed6;
    --color-grey-1: #efefef;
    --color-grey-2: #e7e7e7;
    --color-grey-3: #b0b0b0;
    --color-grey-4: #7c7c7c;
    --color-grey-5: #5d5d5d;
    --color-grey-5-rgb: 93, 93, 93;
    --color-grey-6: #434342;
    --color-background-primary-black: #141414;
    --color-background-primary-grey: #2b2b2a;
    --color-background-primary-white: #ebebeb;
    --font-size-base: 16px;
    --font-primary: "HelveticaNeueRegular";
    --font-primary-medium: "HelveticaNeueMedium";
    --font-primary-bold: "HelveticaNeueBold";
    --font-secondary: "HelveticaNeueCondensed";
    --font-secondary-medium: "HelveticaNeueCondensedMedium";
    --announcement-bar-display: block;
    --announcement-bar-top: 0;
    --announcement-bar-translate-y: 0;
    --announcement-bar-height: 0rem;
    --announcement-bar-initial-y: -100%;
    --header-top: 0rem;
    --header-height: 8rem;
    --header-translate-y: 0px;
    --button-large-height: 2.5rem;
    --button-medium-height: 2rem;
    --button-small-height: 1.25rem;
    --input-height: 3rem;
    --select-medium-height: 2rem;
    --select-large-height: 3rem;
    --content-padding: 1rem;
    --main-bg: var(--color-white);
    --main-padding-top: calc(var(--header-height) + var(--announcement-bar-height));
    --mouse-tooltip-x: 0px;
    --mouse-tooltip-y: 0px;
    --mouse-tooltip-opacity: 0;
    --mouse-tooltip-scale: 0;
    --product-bg: var(--color-white)
}

body {
    min-height: 100%;
    --scrollbar-width: 0px
}

body[data-scroll-lock] {
    top: var(--scroll-offset);
    width: 100%;
    overflow: hidden;
    padding-right: var(--scrollbar-width)
}

body[data-scroll-lock]:after {
    position: fixed;
    right: 0;
    top: 0;
    z-index: 10;
    display: block;
    height: 100%;
    width: var(--scrollbar-width);
    --tw-bg-opacity: 1;
    background-color: rgb(250 250 250 / var(--tw-bg-opacity));
    --tw-content: "";
    content: var(--tw-content)
}

li {
    list-style: none;
}

*,
: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 / .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 / .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:
}

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

:before,
:after {
    --tw-content: ""
}

:-moz-focusring {
    outline: auto
}

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

progress {
    vertical-align: baseline
}

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

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

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

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

@font-face {
    font-family: HelveticaNeueRegular;
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(../fonts/HelveticaNeue-Regular.woff2) format("woff2")
}

@font-face {
    font-family: HelveticaNeueMedium;
    font-display: swap;
    font-weight: 500;
    font-style: normal;
    src: url(../fonts/HelveticaNeue-Medium.woff2) format("woff2")
}

@font-face {
    font-family: HelveticaNeueBold;
    font-display: swap;
    font-weight: 700;
    font-style: normal;
    src: url(../fonts/HelveticaNeue-Bold.woff2) format("woff2")
}

@font-face {
    font-family: HelveticaNeueCondensed;
    font-display: swap;
    font-weight: 400;
    font-style: normal;
    src: url(../fonts/HelveticaNeue-Condensed.woff2) format("woff2")
}

@font-face {
    font-family: HelveticaNeueCondensedMedium;
    font-display: swap;
    font-weight: 500;
    font-style: normal;
    src: url(../fonts/HelveticaNeue-Condensed-Medium.woff2) format("woff2")
}



.slGrlymlanimateslider{
width: 100%;
display: block;
margin: 0;
padding: 0;
text-align: center;
opacity: 1;
}
 
.slGrlymlMouse{
    width: 100%;
    overflow-x: clip;
    opacity: 0;
    display: block;
    position: relative;
    animation: fadeIn .3s ease-out .4s forwards;
}
.slGrlyMainSlideshow{
    position: relative;
    width: 150%;
    display: block;
    height: fit-content;
    height: -moz-fit-content;
    margin-left: -25%;
}
.slGrlyMainSlideEmbla{
    padding-top: 2%;
    padding-bottom: 2%;
    overflow: hidden;
    cursor: grab;
}

.slGrlyMainSlideEmbla:active {
    cursor: grabbing;
}

ul.slGrlyMainSlideContainer{
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

li.slGrlyMainSlideItem{
    width: 100%;
    margin-right:2.5rem;
    flex: 0 0 20%;
    aspect-ratio: 1/1;
    list-style: none;
    transform: translate3d(0px, 0px, 0px) !important;
}

li.slGrlyMainSlideItem img {
    vertical-align: bottom;
      visibility: hidden;
}
.slGrlyMainSlideImg{
    max-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
}
.slGrlyMainCanvasWebgl {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    rotate: -3deg;
}

@keyframes splide-loading {
    0% {
        transform: rotate(0)
    }
    to {
        transform: rotate(1turn)
    }
}


@media (min-width: 1024px) {
    :root {
        --header-height: 9rem;
        --content-padding: 2.5rem
    }
}


@media (prefers-color-scheme: dark) {
    body[data-scroll-lock]:after {
        --tw-bg-opacity: 1;
        background-color: rgb(10 10 10 / var(--tw-bg-opacity))
    }
}


@keyframes flash {
    0% {
        content: var(--tw-content);
        opacity: 1
    }
    25% {
        content: var(--tw-content);
        opacity: 1
    }
    50% {
        content: var(--tw-content);
        opacity: 0
    }
    75% {
        content: var(--tw-content);
        opacity: 1
    }
    to {
        content: var(--tw-content);
        opacity: 1
    }
}


.tooltip {
    background-color: rgb(from var(--color-grey-5) r g b / .4);
    --tw-backdrop-blur: blur(36px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    font-family: var(--font-secondary-medium), Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    pointer-events: none;
    position: absolute;
    left: 1rem;
    top: 1rem;
    z-index: 10;
    display: none;
    height: 1.5rem;
    --tw-translate-x: var(--mouse-tooltip-x);
    --tw-translate-y: var(--mouse-tooltip-y);
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    align-items: center;
    justify-content: center;
    border-radius: .125rem;
    padding-left: .5rem;
    padding-right: .5rem;
    font-size: .625rem;
    line-height: 1.2em;
    letter-spacing: .12em;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    opacity: var(--mouse-tooltip-opacity);
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(.33, 1, .68, 1);
    will-change: transform
}

@media (min-width: 1024px) {
    .tooltip {
        display: inline-flex
    }
}


@keyframes blink {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.animate-blink {
    animation: blink 1s ease-in-out infinite
}

@keyframes pulse {
    0%,
    to {
        opacity: 1
    }
    50% {
        opacity: .5
    }
}


.slGrlymlanimateslider [data-target="animate-in.title"] {
    display: flex;
    flex-wrap: wrap;
    -moz-column-gap: .2em;
    column-gap: .2em;
    margin-left: -.035em;
    line-height: 1.145;
    opacity: 0
}

[data-target="animate-in.word-container"] {
    overflow: hidden;
    display: block;
    padding-right: .05em
}

[data-target="animate-in.word-container"][data-letters] {
    display: flex;
    flex-direction: row
}

[data-target="animate-in.word-text"] {
    display: block;
    transform: translateY(125%)
}

[data-target="animate-in.word-text"][data-letters] {
    display: inline-block
}

[data-target="animate-in.fadeInUp"] {
    --tw-translate-y: .5rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    opacity: 0
}

.slGrlymlanimateslider [data-target="animate-in.title"] {
    overflow: hidden;
    opacity: 1
}

@keyframes titleIn {
    0% {
        transform: translateY(125%) skew(-25deg) rotate(10deg)
    }
    to {
        transform: none
    }
}

.slGrlymlanimateslider [data-target="animate-in.word-text"] {
    animation: titleIn .5s ease-out .05s forwards;
    opacity: 1
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}


.slGrlymlanimateslider [data-target="animate-in.fadeInUp"] {
    animation: slideIn .3s ease-out .4s forwards
}

[data-target="child-link-animation.item"] {
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(0, 0, .2, 1)
}

[data-target="child-link-animation.item"].inactive {
    opacity: .4
}


body[data-design-mode=true] [data-target="animate-in.title"] {
    opacity: 1
}

body[data-design-mode=true] [data-target="animate-in.word-text"] {
    transform: translateY(0)
}

body[data-design-mode=true] [data-target="slider-gallery-in.content"],
body[data-design-mode=true] [data-target="slider-gallery-in.fadeInUp"] {
    opacity: 1;
}

    @keyframes btnIn {
        0% {
            transform: translateY(110%) skewY(12.5deg);
        }
        to {
            transform: translateY(0) skewY(0);
        }
    }
   
    @keyframes btnOut {
        0% {
            transform: translateY(0) skewY(0);
        }
        to {
            transform: translateY(-110%) skewY(12.5deg);
        }
    }


li.slGrlyMainSlideItem img {
    aspect-ratio: 1;
    object-fit: cover;
}
@media(max-width: 1024px) {
    li.slGrlyMainSlideItem {
        margin-right: 1rem;
        flex: 0 0 45%;
    }
}