/* start dark mode */
body {
    background-color: #FAFFFF;
}

body.dark-mode {
    background-color: #212529;
    color: #f8f9fa;
}

body.dark-mode .navbar {
    background-color: #343a40;
}

body.dark-mode .bg-light {
    background-color: #343a40 !important;
}

body.dark-mode .text-white {
    color: #f8f9fa !important;
}

body.dark-mode .nav-link {
    color: #f8f9fa;
}

body.dark-mode .nav-link:hover {
    color: #adb5bd;
}

body.dark-mode .btn {
    color: #f8f9fa;
}

.custom-navbar .dropdown-menu {
    background-color: #4493e7;
    /* Remplacez #votre_couleur_de_fond par la couleur de fond souhaitée */
}

.custom-navbar .dropdown-item {
    font-weight: bold;
    /* color: #votre_couleur_de_texte;  Remplacez #votre_couleur_de_texte par la couleur de texte souhaitée */
}

.sticky-fade {
    opacity: 1;
    transition: opacity 0.3s;
}



/* Changer la couleur de texte du lien lors du survol 
.custom-navbar .dropdown-item:hover {
    color: #votre_couleur_de_texte_survol; /* Remplacez #votre_couleur_de_texte_survol par la couleur de texte souhaitée lors du survol 
    background-color: #votre_couleur_de_fond_survol; /* Remplacez #votre_couleur_de_fond_survol par la couleur de fond souhaitée lors du survol
}*/


/* start bouton dark mode */

.bordure-gras {
    border-width: 3px;
    /* Modifier cette valeur pour ajuster l'épaisseur de la bordure */
}

.btn-outline-secondary.bordure-gras {
    border-color: white;
    /* Remplacez #votre_couleur_vive par la couleur souhaitée */
}

/* Changer la couleur de la bordure lors du survol
.btn-outline-secondary.bordure-gras:hover {
    border-color: grey; /* Remplacez #votre_couleur_vive_survol par la couleur souhaitée lors du survol 
} */


/* end bouton dark mode */


/* end dark mode */


/* start navbar */
.custom-navbar {
    background-color: #4493e7;
}

.navbar-brand {
    color: #f8f9fa;
}

.navbar .nav-link {
    font-weight: bold;
}

.navbar .nav-link:hover {
    color: white;
}

.navbar .btn {
    font-weight: bold;
    color: black;
}

/* end navbar */


/* start Banniere haut de pages */

.banniere-personnalisee {
    height: 400px;
    /* Modifier cette valeur en fonction de la hauteur souhaitée */
    object-fit: cover;
}

/* end Banniere haut de pages */


/* start mise en forme pages */

.container {
    max-width: 1080px;
    margin: 0 auto;

}

p {
    font-weight: bold;
    font-weight: 500;
}

img {
    max-width: 250px;
    max-height: 250px;
}

.back-to-top {
    position: fixed;
    bottom: 25px;
    right: 25px;
    display: none;
    background-color: #eb6111;
    color: white;
    font-size: 22px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border-radius: 4px;
    z-index: 9999;
    cursor: pointer;
}

.custom-list li {
    position: relative;
    padding-left: 20px;
}

.custom-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #0069d9;
    /* Vous pouvez changer la couleur du point ici */
}

h3 {
    color: #0069d9;
}

.letter-spacing {
    letter-spacing: 0.10em;
    /* Ajustez cette valeur pour modifier l'espacement des lettres */
}


/* end mise en forme pages */


/* start carousel */

.carousel-image {
    max-width: 800px;
    max-height: 500px;
    width: auto;
    height: auto;
    margin: 0 auto;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: black;
}


/* end carousel */


/* start video */

.custom-video-iframe {
    max-width: 90%;
    max-height: 40%;
}

@media (min-width: 768px) {
    .custom-video-iframe {
        width: 1280px;
        height: 720px;
    }
}

/* end video */



/* start footer */

.custom-footer {
    background-color: #1770cf;
}

.custom-footer a {
    color: #f8f9fa;
}

.custom-footer a:hover {
    color: #adb5bd;
    text-decoration: none;
}

/* end footer */


/* start bouton remonte la page */

.back-to-top:hover {
    background-color: rgb(126, 36, 36);
    text-decoration: none;
}

/* end bouton remonte la page */