/* GLOBAL SETTINGS AND VARIABLES */
    :root {
        --gutter: 3.5vw;
        --spacer: 15vw;
        --lineHeight: 2rem;
        --navbarHeight: min(30vh, 160px);
        --trackWidth: 100%;
        --trackWidthFullSpan: 100%;
        --trackGap: 50px;
        --formWidth: min(85%, 420px);
        --websiteWidthMax: 2000px;
        --cardCellSize: min(calc(100vw - var(--gutter) * 2), 350px);
        --artCellSize: min(calc(100vw - var(--gutter) * 2), 435px);
        --colorBackground: #e6e6e6;
        --colorBackground: #f3f3f3;
        --colorLight: #bbbbbb;
        --colorFade: #89898a;
        --colorFont: #1b1b1c;
    }
    * {
        /*overscroll-behavior: auto;*/
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        text-decoration: none;
        list-style: none;
    }
    
/* MAIN ELEMENTS */
    html {
        image-rendering: pixelated;
        scroll-behavior: smooth;
        overflow-x: hidden;
    }
    body {
        height: 100vh;
        height: 100svh;
        width: 100vw;
        display: grid;
        overflow-x: hidden;
        background: var(--colorBackground);
        grid-template-columns: 100vw;
        grid-template-rows: var(--navbarHeight) auto auto;
    }

@media only screen and (min-width: 480px) {
    :root {
        --trackWidth: min(100%, 480px);
        --trackWidthFullSpan: min(100%, 480px);
    }
}

@media only screen and (min-width: 768px) {
    :root {
        --trackWidth: 550px;
        --trackWidthFullSpan: 550px;
    }
}

@media only screen and (min-width: 1281px) {
    :root {
        --trackWidthFullSpan: 1150px;
        --spacer: 2.7rem;
    }
}