@media (max-width: 767px) {
.line-treeimg .container .row{
    display:flex;
    flex-direction: column-reverse;
 }
.line-treeimg .zone-image:last-child img{
    max-height:none !important;
    margin:20px auto;
    max-width:400px;
    }
}
@media (min-width: 768px) {
    .line-treeimg {
        position:relative;
        .zone-image:last-child {
            position: static;
            .content{
                position: absolute;
                width:340px;
                top:2.5rem;
                img {
                    max-height:none !important;
                    object-fit: contain;
                }
            }
        }
    }
}
@media (min-width: 992px) {
     .line-treeimg .zone-image:last-child .content { width:450px; }
}
@media (min-width: 1200px) {
     .line-treeimg .zone-image:last-child .content { margin-left:75px; }
}

.line-banner .line:nth-of-type(2) .container:first-of-type::after {
display:none !important;
}
/* Styles par défaut pour les écrans de bureau (large) */
ul.navbar-nav {
    display: flex;
    flex-direction: row;
    justify-content: space-between; /* Espace les éléments de manière uniforme */
    align-items: center;  /* Centre les éléments verticalement */
    width: 100%;  /* Assure que l'ul prend toute la largeur disponible */
}

ul.navbar-nav li {
    list-style: none;  /* Retire les puces si elles existent */
    padding: 10px 20px;  /* Ajoute du padding pour plus d'espace autour des éléments */
}

ul.navbar-nav a {
    text-align: center;
    display: block;  /* Pour que le lien prenne toute la surface cliquable */
}

/* Réduire encore la hauteur de ligne et la taille de la police */
li a {
    line-height: 1 !important;  /* Réduire la hauteur de ligne */
    font-size: 14px !important; /* Ajuste la taille de la police */
    padding: 0 !important;      /* Supprime tout padding résiduel */
}

/* Cibler les <li> qui n'ont pas de classe "dropdown-toggle" pour les déplacer vers le haut */
ul.navbar-nav li:not(:has(.dropdown-toggle)) > a {
    position: relative;
    top: -6px; /* Ajuste cette valeur pour déplacer les éléments vers le haut */
}


/* Responsivité pour les écrans de taille moyenne (tablettes) */
/* Styles par défaut pour aligner les carets dropdown sur mobile et tablette */
@media (max-width: 768px) {
    /* Aligner la structure du menu sur mobile et tablette */
    ul.navbar-nav {
        display: flex;
        flex-direction: column;
        width: 100%;
        align-items: flex-start;
    }

    /* Aligner les items du menu pour que les carets et le texte soient bien positionnés */
    ul.navbar-nav li {
        display: flex;
        justify-content: space-between; /* Texte à gauche, caret à droite */
        align-items: center;
        width: 100%;
    }

    /* Assurer que le texte prenne tout l'espace restant */
    ul.navbar-nav a {
        flex-grow: 1;
        text-align: left;
        padding-right: 10px; /* Espace suffisant entre le texte et le caret */
    }

    /* Alignement spécifique pour les carets dropdown */
    ul.navbar-nav li .caret {
        margin-left: auto; /* Assure que le caret reste aligné à droite */
        width: 20px;       /* Largeur fixe pour uniformiser la position du caret */
        text-align: center;
        padding-left: 5px;
        vertical-align: middle;
    }

    /* Assurez-vous que le caret reste visible même après l'ouverture du dropdown */
.dropdown-toggle[aria-expanded="true"] .caret {
    display: inline-block;
    transform: rotate(180deg); /* Fait tourner le caret pour indiquer qu'il est ouvert */
}

/* Style par défaut du caret fermé */
.dropdown-toggle[aria-expanded="false"] .caret {
    display: inline-block;
    transform: rotate(0deg); /* Le caret reste dans sa position initiale lorsqu'il est fermé */
}

}


/* Responsivité pour les écrans de petite taille (mobiles) */
@media (max-width: 480px) {
    /* Style général pour la liste des éléments du menu */
ul.navbar-nav {
    display: flex;
    flex-direction: column; /* Dispose les éléments verticalement */
    justify-content: flex-start; /* Aligne les éléments à gauche */
    align-items: flex-start; /* Aligne tout à gauche */
    width: 100%;
}

/* Style pour chaque élément de la liste */
ul.navbar-nav li {
    display: flex;
    justify-content: space-between; /* Assure que le texte et le caret sont à des extrémités */
    align-items: center; /* Centre verticalement le texte et le caret */
    width: 100%; /* Assure que chaque élément occupe toute la largeur */
    padding: 10px 0; /* Ajoute de l'espace vertical */
}

/* Style pour les liens du menu */
ul.navbar-nav a {
    flex-grow: 1; /* Permet au texte de prendre tout l'espace disponible */
    text-align: left; /* Aligne le texte à gauche */
    padding-right: 20px; /* Ajoute un espace entre le texte et l'icône caret */
}

/* Style spécifique pour le caret */
ul.navbar-nav li .caret {
    vertical-align: middle; /* Centre verticalement le caret */
    margin-left: auto; /* Aligne le caret à droite */
    padding-left: 5px; /* Ajoute un peu d'espace entre le texte et le caret */
}

    /* Assurez-vous que le caret reste visible même après l'ouverture du dropdown */
.dropdown-toggle[aria-expanded="true"] .caret {
    display: inline-block;
    transform: rotate(180deg); /* Fait tourner le caret pour indiquer qu'il est ouvert */
}

/* Style par défaut du caret fermé */
.dropdown-toggle[aria-expanded="false"] .caret {
    display: inline-block;
    transform: rotate(0deg); /* Le caret reste dans sa position initiale lorsqu'il est fermé */
}


}