* {
    font-family: 'Courier New', Courier, monospace;
    /* cursor: url('../tetris/assets/favicon.png'), default; */
    --bgc: rgb(20,20,25);
}

body {
    background-color: var(--bgc);
    color: aliceblue;
    display: flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
}

footer {
    border-top: 1px solid rgb(63, 63, 63);
    font-size: xx-small;
}

#separator {
    border-top: 1px solid rgb(63, 63, 63);
}

.link {
    text-decoration: none;
    border: purple solid 2px;
    border-style: dashed;
    padding: 0 5px;
}

#user {
    background-color: blueviolet;
    padding: 3px;
}
#highscores p {
    text-align: left;
}

#news-post {
    color:rgb(255, 174, 0);
    background-color: #8A2BE2;
    padding: 20px;
    margin: 30px;
    border-radius: 10px;
    border-style:ridge;
}
#game-post img {
    padding: 5px;
    border-radius: 5px;
    border-style: solid;
    box-shadow: 7px 7px rgba(0,0,0,0.5);

}

#news-game {
    color:rgb(0, 255, 13);
    background-color: #21a33d;
    padding: 20px;
    margin: 30px;
    border-radius: 10px;
    border-style:ridge;
}
#news-game img {
    padding: 5px;
    border-color: #1a8130;
    border-radius: 5px;
    border-style: solid;
    box-shadow: 7px 7px rgba(0,0,0,0.5);

}



@keyframes flash-error {
    0% { opacity: 0.0; color: red; }
    10% { opacity: 1.0; }
    80% { opacity: 1.0; }
    100% { opacity: 0.0; color: red; }
}

@keyframes flash-success {
    0% { opacity: 0.0; }
    10% { opacity: 1.0; }
    80% { opacity: 1.0; }
    100% { opacity: 0.0; }
}

#login-feedback {
    color: lightgreen;
    font-size: small;
    opacity: 0.0;

    /* animation-name: flash; */
    animation-duration: 4s;
}