@font-face {
    font-family: 'Terminal';
    src: url('font/Terminal.ttf');
    font-weight: normal;
    font-style: normal;
}

*{
    margin: 0;
    margin-left: 4px;

    padding: 0;
    background-color: black;
    color: white;
    letter-spacing: 2px;
    font-family: 'Terminal', sans-serif;
}

.txt_intro{
    margin-top: 20px;
    font-size: 30px;
}

.terminal{
    margin-top: 100px;
    font-size: 45px;
    display: flex;
}

.terminal_user{
    animation: 
    appear 0.8s linear 0s 4 normal both,
    dissolve   0.1s ease   3.2s 1 normal forwards;
}

.typing {
    width: 0;
    overflow: hidden;
    white-space: nowrap;
    animation:
    typing 2.5s steps(19, end) forwards;
    animation-delay: 3.6s;
    animation-fill-mode:forwards;

}

.terminal_error{
    opacity: 0;
    font-size: 45px;
    display: flex;
    animation: appear 0.1s linear 6.3s normal forwards;
}

.terminal2{
    margin-top: 100px;
    font-size: 45px;
    display: flex;
    opacity: 0;
    animation: appear 0.1s linear 6.3s normal forwards;
}

.terminal_user2{
    animation: 
    appear 0.8s linear 6.3s 5 normal both,
    dissolve   0.1s ease  10s 1 normal forwards;
}

.typing2{
    width: 0;
    overflow: hidden;
    white-space: nowrap;
    animation:
    typing2 1.4s steps(5, end) forwards;
    animation-delay: 10.2s;
    animation-fill-mode:forwards;

}

.finishterminal{
    opacity: 0;
    font-size: 45px;
    display: flex;
    animation: appear 0.1s linear 12.4s normal forwards;
}

.terminal_success{
    opacity: 0;
    font-size: 45px;
    display: flex;
    animation: appear 0.1s linear 15s normal forwards;
}

.yes{
    color : green;
    text-decoration: none;
}

.no{
    color : red;
    text-decoration: none;
}

.contenu-page{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap : 100px;
} 

/* Animations made in Adam */

@keyframes appear {
    From{
        opacity: 0;
    }
    To{
        opacity: 1;
    }
}

@keyframes typing {
  from {
        width: 0; 
    }
  to { 
        width: 19ch; 
    } 
}

@keyframes typing2 {
  from {
        width: 0; 
    }
  to { 
        width: 5ch; 
    } 
}

@keyframes dissolve {
  from { 
        opacity: 1;
    }
  to {
        opacity: 0;
    }
}