/* Style de base */
.message-container {
    position: relative;
    width: 100%; /* S'adapte à la largeur du conteneur */
    /* Limiter la largeur sur grands écrans */
    margin: 0 auto; /* Centrer avec des marges gauche et droite */
    height: 0px; /* Hauteur de la zone d'animation */
    background-color: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Style du message */
.message {
    color: #333;
    /*animation: slideMessage 15s linear infinite alternate;*/ /* Animation alternée */
    text-align: center;
}

/* Animation */
@keyframes slideMessage {
    0% {
        left: 0; /* Début à gauche */
        transform: translateX(0); /* Aucun décalage */
    }
    100% {
        left: 100%; /* Se déplace vers la droite */
        transform: translateX(-100%); /* Décalage pour rester dans le conteneur */
    }
}

/* Responsive: moyens écrans */
@media (max-width: 768px) {
    .message {
         /* Réduire la taille du texte */
    }

    .message-container {
        max-width: 80%; /* Largeur relative pour moyens écrans */
        height: 40px; /* Réduire la hauteur du conteneur */
    }
}

/* Responsive: petits écrans */
@media (max-width: 480px) {
    
    .message-container {
        max-width: 90%; /* Largeur relative pour petits écrans */
        height: 30px; /* Réduire encore la hauteur du conteneur */
    }
}