.creationAvis{
    margin: 10% auto 5%;
    width: fit-content;
    text-align: center;
    background-color: rgba(123, 123, 123, 0.774);
    color: white;
    padding: 1%;
    border-radius: 2%;
}

.titreLogAvis{
    /* display: inline-block; */
    text-transform: uppercase;
    color: cyan;
    font-family: 'Permanent Marker', cursive;
}

.areaAvis{
    background: #ffffff94;
}

.envoyerAvis{
    margin-top: 3%;
    padding: 2% 10%;
    background-color: #555555;
    border: white 1px solid;
    color: white;
}

.envoyerAvis:hover{
    /* background: linear-gradient(to bottom, #555555, #00ae0999); */
    background: linear-gradient(to bottom, #555555, #3c9194);
    cursor: pointer;
    box-shadow: 0px 0px 3px #000;

}

.afficheAvis{
    width: 80%;
    margin: 1% auto 5%;
}

.afficheAvisNonValide{
    width: 80%;
    margin: 20% auto 0%;
}

.divCommentaire{
    padding: 0% 1% 1%;
    margin-bottom: 1%;
}

.LogAvis{
    text-transform: uppercase;
    /* color: rgb(183, 37, 4); */
    color: #ac0827;
    /* font-family: 'Rock Salt', cursive; */
    font-family: 'Permanent Marker', cursive;
}

.commentaire{
    background: rgba(255, 255, 255, 0.77);
    padding: 1%;
    font-family: 'Akaya Telivigala', cursive;
    font-size: 1.3em;
}

/* ----------------------------------------------------partie Media Screen----------------------------------------------------------------- */


@media (max-width: 1024px) {

    .voirContenu2{
        font-size: 1.5em;
    }
    .areaAvis{
        width: 80%;
    }
}

@media (max-width: 800px) {

    .voirContenu2{
        font-size: 1.2em;
        margin-top: 20%;
    }
    .pseudoCommentaire{
        font-size: 1.5em;
    }
}
@media (max-width: 600px) {

    .pseudoCommentaire{
        font-size: 1em;
    }
    .commentaire{
        font-size: 1em;
    }
    .dateCommentaire{
        font-size: 1em;
    }
    .afficheAvis{
        width: 70%;
    }
    /* .areaAvis{
        width: 80%;
    } */
    .creationAvis{
        width: 80%;
        font-size: 0.8em;
    }
}