:root {
    --doc-height: 100%;
    --header-height: ;
    --footer-height: ;
    --bg-color: #e8e8e8;
    --main-color: #2304c7;
    --difference-color: #cce42a;
    --acc-color: #f49f0a;
    --acc-difference-color: #0047c4;
    --white: #ffffff;
    --black: #000000;
    --txt-title-size: 4rem;
    --txt-large-size: 2.5rem;
    --txt-medium-size: 1.25rem;
    --txt-size: 1rem;
    --txt-small-size: .8rem;
    --button-size: 1.25rem;
    --main-margin: 2.5rem;
    --inner-margin: 5rem;
    --menu-gap: 2.5rem;
    --grid-gap: 2.5rem;
    --main-gap: 5rem;
    --inner-gap: .5rem;
    --text-gap: 1rem;
    --cursor-size: .75rem;
}

@media screen and (max-width: 800px) {
    :root {
        --menu-gap: 1rem;
    }
}

@media screen and (max-width: 600px) {
    :root {
        --txt-title-size: 4rem;
        --txt-large-size: 1.5rem;
        --txt-medium-size: .9rem;
        --txt-size: .9rem;
        --main-margin: 1rem;
        --inner-margin: 2rem;
        --menu-gap: 1rem;
        --grid-gap: 1rem;
        --main-gap: 2rem;
    }
}