:root {
    --zerory: #070707;
    --zerory-primary: #101010;
    --primary: #131313;
    --primary-secondary: #1b1b1b;
    --secondary: #232323;
    --secondary-tertiary: #2b2b2b;
    --tertiary: #333333;
    --tertiary-quaternary: #3b3b3b;
    --quaternary: #444444;

    --white: #efefef;
    --white-secondary: #d4d4d4;
    --gray: #a9a9a9;

    --logo: #FE8921;
    --yt-red: #fd0033;
    --red: #E63946;

    --transparent: transparent;

    --text-05: clamp(0.75rem, 0.72rem + 0.15vw, 0.875rem);
    --text-1: clamp(0.95rem, 0.91rem + 0.2vw, 1.06rem);
    --text-2: clamp(1.2rem, 1.13rem + 0.36vw, 1.4rem);
    --text-4: clamp(1.5rem, 1.36rem + 0.73vw, 1.9rem);
    --text-8: clamp(2.25rem, 1.84rem + 2.08vw, 3.75rem);

    --space-1: clamp(0.5rem, 0.44rem + 0.25vw, 0.65rem);
    --space-2: clamp(0.875rem, 0.77rem + 0.5vw, 1.25rem);
    --space-4: clamp(1.5rem, 1.3rem + 1vw, 2.25rem);
    --space-8: clamp(2.5rem, 2.14rem + 1.8vw, 3.75rem);
    --space-16: clamp(4.5rem, 3.77rem + 3.6vw, 7rem);
}

@font-face {
    font-family: 'IM Fell English';
    src: url('fonts/IMFellEnglish-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'IM Fell English';
    src: url('fonts/IMFellEnglish-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'ClarityCity';
    src: url('fonts/claritycity/ClarityCity-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

body{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    font-family: 'ClarityCity', sans-serif;
    line-height: 1;
}

link, button, h1, h2, h3, h4, h5, h6, p, fieldset, span, div, a, img, input, textarea, select, option, strong, label, ul, li, ol, table, tr, td, th, form, section, header, footer, nav, aside, article, figure, figcaption, address, video, audio, canvas, iframe, embed, object, svg, svg * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    text-decoration: none;
    all: unset;
}

.col {
    display: flex;
    flex: 0 0 auto;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    box-sizing: border-box;
    min-height: 0;
}

.row {
    display: flex;
    flex: 0 0 auto;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    box-sizing: border-box;
    min-height: 0;
}

::-webkit-scrollbar {
    width: 0.5rem;
    background-color: var(--primary);
}

::-webkit-scrollbar-thumb {
    background-color: var(--tertiary);
    border-radius: 5vh;
    border: 0.1vw solid var(--primary);
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--gray);
}