@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined");

@import url("https://fonts.googleapis.com/css2?family=Sixtyfour&display=swap");
/*  font-family: "Sixtyfour", sans-serif; */

@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap");
/* font-family: "Roboto Mono", monospace; */

@import url("https://fonts.googleapis.com/css2?family=Alan+Sans:wght@300..900&display=swap");
/* font-family: "Alan Sans", sans-serif; */

@import url("https://fonts.googleapis.com/css2?family=Vollkorn:ital,wght@0,400..900;1,400..900&display=swap");
/* font-family: "Vollkorn", serif; */

@import url("https://fonts.googleapis.com/css2?family=BioRhyme:wght@200..800&family=Google+Sans+Code:ital,wght@0,300..800;1,300..800&display=swap");
/* font-family: "BioRhyme", serif; */

:root {
    --dark: #1d1c23;
    --dark-opacity: #1d1c2380;
    --bg-dark: #0f0e12;
    --bg-dark-opacity: #0f0e1280;
    --bg-light: #07248f;
    --font: #d6aad7;
    --color-pry: #ab22c8;
    --lines: #302747;
    --eternal-blue: #00ffff;
}

::-webkit-scrollbar {
    display: none;
}

* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    font-family: "Inconsolata", monospace;
}

body {
    overflow-x: hidden;
    background: linear-gradient(
        30deg,
        var(--bg-dark) 10%,
        var(--bg-light) 200%
    );

    background-attachment: fixed;
    width: 100%;
    min-height: 100dvh;
}

#container {
    overflow-x: hidden;
}
@keyframes pulsating {
    0%,
    100% {
        text-shadow:
            0vw 0 1vw var(--font),
            0vw 0 1vw var(--color-pry);
    }
    50% {
        text-shadow:
            0vw 0 1vw var(--font),
            0vw 0 2vw var(--color-pry);
    }
}

#rodape {
    background-color: var(--dark);
    margin: 1vw;
    padding: 1vw;
    transition: 1s;
    animation: end_blink 0.8s ease-in-out infinite;
    text-align: center;
}

@keyframes blink {
    0%,
    100% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}

@keyframes load {
    0% {
        background-position: 0vw;
    }
    100% {
        background-position: 100vw;
    }
}

@keyframes end_blink {
    0%,
    80%,
    85% {
        background-color: var(--dark);

        box-shadow:
            0 0 1vw var(--bg-light),
            0 0 5vw var(--eternal-blue);
    }

    1%,
    79%,
    81%,
    84%,
    85% {
        background-color: var(--eternal-blue);
        color: var(--bg-light);
        box-shadow:
            0 0 3vw var(--bg-light),
            0 0 10vw var(--eternal-blue);
    }
}