*,
:after,
:before {
    box-sizing: border-box
}

body {
    --color-text: #fff;
    --color-link: #fff;
    --color-link-hover: var(--main-color);
    --color-bg-menu-item1: #15171b;
    --color-bg-menu-item2: #1c1c1c;
    --color-bg-menu-item3: #0f1013;
    --color-bg-menu-item4: #15171b;
    --color-bg-menu-item5: #0f1013;
    --color-item-alt: #494d54;
    --color-quote: #5b677a;
    --color-info: #57535a;
    --color-title: #e23434;
    --color-tagline: #e2e2e2;
    --font-g: SpaceGrotesk
}

.menuUzi a {
    color: var(--color-link) !important;
    outline: none;
    text-decoration: none;
    transition: color .2s
}

.menuUzi a:focus,
.menuUzi a:hover {
    color: var(--color-item-alt)
}

.menuUzi a:focus,
.menuUzi button:focus {
    outline: none
}

.hidden {
    height: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    width: 0
}

.menuUzi .icon {
    display: block;
    margin: 0 auto;
    width: 1.5em;
    fill: currentColor;
    height: 40px;
    width: 40px
}

.menuUzi main {
    position: relative;
    width: 100%
}

.hidcontent {
    display: none !important;
    position: relative;
    text-align: center;
    z-index: 100
}

.background {
    perspective: 1000px
}

.background,
.background__copy {
    background-image: var(--website-color);
    background-position: 50% 0;
    background-size: cover;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1
}

.background__copy {
    opacity: .3;
    transform: translateZ(0)
}

.codrops-header {
    align-items: center;
    align-self: start;
    display: flex;
    justify-content: center;
    justify-items: center;
    position: relative;
    z-index: 100
}

.codrops-header__title {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1;
    margin: 0 1rem
}

.info {
    display: block;
    grid-area: info;
    justify-self: end;
    margin: 1rem 0;
    text-align: center
}

.hidcontent__title {
    color: var(--color-title);
    cursor: default;
    font-family: sabbath-black, serif;
    font-size: 14vw;
    font-weight: 400;
    line-height: .8;
    margin: 0;
    mix-blend-mode: screen;
    text-transform: lowercase;
    z-index: 199
}

.hidcontent__tagline {
    color: var(--color-tagline);
    cursor: default;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .125rem;
    margin: 1rem 0 0;
    text-align: center;
    text-transform: uppercase;
    word-spacing: .25rem;
    z-index: 199
}

.action {
    background: none;
    border: 0;
    color: var(--black);
    cursor: pointer;
    padding: 0;
    width: 90px
}

.action--menuUzi {
    pointer-events: auto;
    position: absolute;
    right: 1.5rem;
    top: 1.3rem;
    z-index: 1000
}

.menuUzi--open .action--menuUzi {
    pointer-events: none
}

.action--close {
    color: var(--color-bg);
    opacity: 0;
    padding: 0 .5rem;
    position: absolute;
    right: 1.5rem;
    top: 1.2rem;
    z-index: 1000
}

.icon--menuUzi {
    width: 2rem
}

.icon--close {
    width: 1rem;
    color: var(--color-link)
}

.menuUzi {
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: repeat(3, 33.33%);
    height: 100vh;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 200
}

.menuUzi--open {
    pointer-events: auto
}

.menuUzi__item {
    overflow: hidden;
    position: relative;
    width: 101.1%
}

.menuUzi__item-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    overflow: hidden;
    position: relative;
    transform: translate3d(100%, 0, 0);
    width: 100.2%
}

.menuUzi__item--1 .menuUzi__item-inner {
    background: var(--color-bg-menu-item1)
}

.menuUzi__item--2 .menuUzi__item-inner {
    background: var(--color-bg-menu-item2)
}

.menuUzi__item--3 .menuUzi__item-inner {
    background: var(--color-bg-menu-item3)
}

.menuUzi__item--4 .menuUzi__item-inner {
    background: var(--color-bg-menu-item4)
}

.menuUzi__item--5 .menuUzi__item-inner {
    background: var(--color-bg-menu-item5)
}

.label,
.menuUzi__item--4,
.menuUzi__item--5 {
    display: none
}

.mainmenuUzi__item {
    opacity: 0
}

.mainmenuUzi__item,
.sidemenuUzi__item {
    display: block;
    margin: .25rem 0;
    overflow: hidden;
    position: relative;
    transition: color .1s
}

.sidemenuUzi__item-inner {
    display: block;
    transform: translate3d(0, 100%, 0)
}

.menuUzi__item-map {
    background: url(../assets/images/IMG_8008.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform .8s cubic-bezier(.2, 1, .8, 1);
    width: 100%;
    opacity: 0.85;
}

.menuUzi__item-inner:hover .menuUzi__item-map {
    transform: scale3d(1.1, 1.1, 1)
}

.menuUzi__item-hoverlink {
    display: block;
    font-weight: 700;
    position: relative;
    text-transform: capitalize;
    z-index: 1000
}

.menuUzi__item-hoverlink:hover {
    color: var(--color-link)
}

.menuUzi__item-link {
    align-self: flex-start;
    flex-direction: column;
    font-size: 1.5rem;
    height: calc(100% - 3rem);
    justify-self: start;
    line-height: 1;
    margin: 3rem 0 auto;
    padding: 2rem;
    text-align: left;
    width: 100%
}

.menuUzi__item-link:after {
    display: block;
    font-size: .95rem;
    margin-top: auto
}

@media screen and (min-width:53em) {
    body {
        padding: 0
    }

    .hidcontent {
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin: 0 auto;
        min-height: 100vh;
        position: relative;
        text-align: left
    }

    .info {
        color: var(--color-info);
        margin: 0 6rem 0 0
    }

    :root {
        --set-grid: "item3 item2 item1" "item4 item5 item1"
    }

    .targeted {
        grid-template-areas: var(--set-grid) !important
    }

    .menuUzi {
        gap: 0;
        grid-template-areas: unset;
        grid-template-columns: 20% 30% 50%;
        grid-template-rows: 60% 40%;
        height: 100vh;
        left: 0;
        overflow: hidden;
        position: fixed;
        top: 0;
        transition: grid-template-areas .3s ease-in-out;
        width: 100%
    }

    .menuUzi__item {
        height: 100%
    }

    .menuUzi__item--1 {
        grid-area: item1
    }

    .menuUzi__item--2 {
        grid-area: item2
    }

    .menuUzi__item--3 {
        grid-area: item3
    }

    .menuUzi__item--4 {
        grid-area: item4
    }

    .menuUzi__item--5 {
        grid-area: item5
    }

    .menuUzi__item--4,
    .menuUzi__item--5 {
        display: block
    }

    .menuUzi__item-inner {
        align-items: center
    }

    .label {
        color: var(--color-item-alt);
        display: block;
        font-size: .75rem;
        font-weight: 700;
        margin: 0;
        position: absolute;
        white-space: nowrap;
        z-index: 1000
    }

    .label--topleft {
        left: 2rem;
        top: 2rem
    }

    .label--vert,
    .label--vert-mirror {
        -webkit-writing-mode: vertical-rl;
        writing-mode: vertical-rl
    }

    .label--vert-mirror {
        transform: rotate(180deg)
    }

    .label--bottomright {
        bottom: 2rem;
        right: 2rem
    }

    .label:before {
        content: "------------- ";
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        letter-spacing: -5px;
        margin: 0 .75rem 0 0
    }

    .label--vert-mirror:before,
    .label--vert:before {
        margin: .75rem 0
    }

    .mainmenuUzi,
    .sidemenuUzi {
        align-items: center;
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: center;
        width: 100%
    }

    .mainmenuUzi {
        counter-reset: menuUziitem
    }

    .mainmenuUzi__item {
        font-size: 4vw;
        margin: .5rem 0;
        overflow: visible;
        padding: 0 .5rem;
        position: relative;
        text-transform: capitalize;
        transition: color .3s
    }

    .mainmenuUzi__item:hover {
        color: var(--color-item-alt) !important
    }

    .mainmenuUzi__item:before {
        color: var(--color-item-alt);
        content: counters(menuUziitem, "", decimal-leading-zero);
        counter-increment: menuUziitem;
        font-size: .85rem;
        left: -1.25rem;
        position: absolute;
        top: 25%
    }

    .mainmenuUzi__item:after {
        background: var(--color-link-hover);
        content: "";
        height: 6px;
        left: 0;
        opacity: 0;
        position: absolute;
        top: 50%;
        transform: scaleX(0);
        transform-origin: 100% 50%;
        transition: transform .3s, opacity .3s;
        width: 100%
    }

    .mainmenuUzi__item:hover:after {
        color: var(--color-link-hover);
        opacity: 1;
        transform: scaleX(1)
    }

    .sidemenuUzi__item {
        font-size: .85rem;
        letter-spacing: .15rem;
        text-transform: uppercase
    }

    .menuUzi__item-hoverlink {
        font-size: 1.25rem;
        opacity: 1;
        text-transform: lowercase;
        transition: opacity .3s
    }

    .menuUzi__item-inner:hover .menuUzi__item-hoverlink {
        opacity: 1
    }
}



.socials-sidemenu li {
    padding: 10px 0
}

.reachussvg {
    height: 50px;
    margin-top: -30px;
    width: 100px
}

.menuUzi__item-link {
    align-items: center;
    display: flex;
    justify-content: center
}

.reachussvg img {
    height: auto;
    width: 100%
}

.yearnow {
    color: var(--color-white);
    font-size: 2rem;
    
}

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

    

    .menuUzi__item--3 .menuUzi__item-inner {
        background: var(--color-black) !important;
        padding: 10px 20px !important
    }

    .menuUzi {
        height: 100svh !important
    }

    .menuUzi__item--3 .title-upper {
        font-size: 1em;
        padding: 10px;
        text-align: left
    }
}

@media screen and (max-width:767px) {
    @font-face {
        font-display: swap;
        font-family: SpaceGrotesk;
        src: url(../fonts/SpaceGrotesk.woff2) format("woff2")
    }
    
    /* Mobile font size fixes to prevent text from becoming too small */
    .title-upper {
        font-size: max(12px, 0.8rem) !important;
    }
    
    /* Ensure all small fonts have minimum readable sizes, but exclude headings and title elements */
    p, span, a, li, button, input, textarea, label, div:not(.hidcontent__title):not(.feature-header):not(.feature-head):not(.hyper):not(.font-12) {
        font-size: max(11px, 1em) !important;
    }
}

.title-upper {
    color: var(--color-black);
    font-size: .7em;
    font-weight: 700;
    letter-spacing: -.045em;
    text-transform: uppercase
}

.socials-buttons {
    display: flex;
    margin-top: 12px
}

.social-img {
    height: 24px;
    width: 24px
}

.social-networks {
    align-items: center;
    background-color: rgba(1, 1, 1, 0);
    border: 1px solid rgba(1, 1, 1, .35);
    border-radius: 100%;
    display: flex;
    height: 52px;
    justify-content: center;
    margin-right: 4px;
    width: 52px
}