@charset "UTF-8";
/*
AzulEscuro:141B41
Azul Meio:306BAC
Azul Mid:6F9CEB
Azul Claro:98B9F2
Roxo:918EF4
*/
@font-face {
    font-family: 'PixelP';
    src: url(src/sh-pinscher/SHPinscher-Regular.otf);
}
@font-face {
    font-family: 'PixelE';
    src: url(src/Silkscreen/slkscrb.ttf);
}
*{
    font-family: "PixelP",monospace;
    background-color: var(--azulE);
    text-align: center;
    color: white;
}
:root{
    --azulC:#98B9F2 ;
    --azulE:#121a42;
    --azulM:#6F9CEB;
    --azul:#306BAC;
    --roxo:#918EF4;
    --fontAcento:'PixelP';
    --fontPica: "PixelE";
}


@keyframes digitar {
    0%,100%{
        content: "VITÓRIA";
    }
    
}
.textdigitado span{
    position: relative;
    font-size: 1.5em;
}
.textdigitado span::before{
    content: "";
    color: rgb(255, 217, 0);
    animation: digitar 20s infinite;
}
.textdigitado span::after{
    content: "";
    position: absolute;
    height: 100%;
    right: -10px;
    animation: cursor 25s, digitando 15s steps(15);
    width: 0px;
    background-color: var(--azulE);
}

@keyframes cursor {
    0%{
        width: calc(100% + 14px);;

    }
}

@keyframes digitando{
    10%,99%{
        width: 0px;
    }
    100%{
        opacity: 0;
    }
    
}


a:hover{
    color: var(--azulM);

}
a{
    text-decoration: none;
    font-family: var(--fontPica);
}

.hero-name{
    color: #98B9F2;
}