.conteneur {
    width: 100%;
    height: 600px;
    margin-bottom: 50px;
}

.d3[target="ImageCarte"] {
    width: 100%;
    height: 600px;
    box-shadow: 0px 0px 10px #777;
    background-color: #EDEDED;
    background-size: contain; /* Meilleur rendu pour les petits écrans */
    background-repeat: no-repeat;
    background-position: center;
    animation: Fonducarte 20s infinite both;
}

@keyframes Fonducarte {
    0% { background-image: url("imagescss/Image1.jpg"); background-repeat: no-repeat;}
    25% { background-image: url("imagescss/Image2.jpg"); background-repeat: no-repeat;}
    50% { background-image: url("imagescss/Image3.jpg"); background-repeat: no-repeat;}
    75% { background-image: url("imagescss/Image4.jpg"); background-repeat: no-repeat;}
    100% { background-image: url("imagescss/Image5.jpg"); background-repeat: no-repeat;}
}

/* Adaptation pour les écrans de téléphone */
@media (max-width: 768px) {
    .conteneur {
        height: 400px; /* Réduction de la hauteur pour les petits écrans */
        margin-bottom: 30px;
    }

    .d3[target="ImageCarte"] {
        height: 400px;
        background-size: cover; /* Assure un bon ajustement des images */
    }
}

@media (max-width: 480px) {
    .conteneur {
        height: 300px; /* Hauteur encore réduite pour très petits écrans */
        margin-bottom: 20px;
    }

    .d3[target="ImageCarte"] {
        height: 300px;
    }
}