@media (prefers-color-scheme: dark) {
    :root {
        --background-color: #333333;
        --text-color: white;
        --inverted-text-color: black;
    }
}

@media (max-width: 1000px) {
    h1 {
        font-size: 2.441rem;
    }

    h2 {
        font-size: 1.953rem;
    }

    h3 {
        font-size: 1.563rem;
    }

    h4 {
        font-size: 1.25rem;
    }

    h5 {
        font-size: 1rem;
    }

    p {
        font-size: 0.8rem;
    }

    small {
        font-size: 0.64rem;
    }
}

@media (max-width: 800px) {
    /* Navigation */

    nav {
        grid-template-columns: 1fr 1fr;
    }

    /* hide links and  */
    nav .nav-links,
    nav .social {
        display: none;
    }

    .nav-icons .menu-btn {
        display: initial;
    }

    .nav-links {
        align-items: center;
        flex-direction: column;
    }

    footer .nav-links {
        margin-block: 1.25rem;
    }

    /* Navigation end */

    /* Videos */

    .videos_main footer {
        left: 0;
        width: 100vw;
    }

    .video {
        left: 0;
        width: 100vw;
    }

    /* Videos end */

    /* Footer */

    footer > .main {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        justify-items: center;
    }

    #language-selector {
        margin-block: 0.25rem;
    }

    /* Footer end */
}

@media (max-width: 450px) {
    h1 {
        font-size: 1.953rem;
    }

    h2 {
        font-size: 1.563rem;
    }

    h3 {
        font-size: 1.25rem;
    }

    h4 {
        font-size: 1rem;
    }

    h5 {
        font-size: 0.8rem;
    }

    small:not(.landingLink small),
    .text_small {
        font-size: 0.64rem;
    }
}

@media (max-width: 650px) {
    /* Main */

    .landing-btns {
        flex-direction: column;
    }

    /* Main end */
}

@media (max-height: 450px) {
    h1 {
        font-size: 1.563rem;
    }

    h2 {
        font-size: 1.25rem;
    }

    h3 {
        font-size: 1rem;
    }

    h4 {
        font-size: 0.8rem;
    }

    h5 {
        font-size: 0.64rem;
    }

    .menu {
        height: calc(100vh - 90px);
    }
}
