/* Utilisation de la police Google Fonts */
body {
    font-family: 'Source Sans Pro', sans-serif;
    background-color: #fff;
    text-align: center;
    top: 0px!important;
    min-height: 100vh;
    padding-top: 60px;
}

/* Styles pour le pied de page */

.navbar-brand {
    display: none;
}

.cookies-banner{background-color:#fffffff;bottom:0;color:#201f1e;left:0;padding:1.2rem;position:fixed;right:0;width:100%;z-index:1201!important}
.cookies-banner__container{display:flex;flex-direction:column;gap:1.6rem}
.cookies-banner__container{align-items:center;flex-direction:row;justify-content:space-between}
.cookies-banner__description,.cookies-banner__link{font-size:1.6rem;line-height:1.5}
.cookies-banner__description{flex-basis:60%}
.cookies-banner__accept{align-self:center}

.cookies-banner__description {
	font-size: 15px;
	line-height: 1.2; /* Réduisez la valeur en fonction de vos préférences */

}
.cookie-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5); /* Couleur blanche avec une opacité de 0.5 */
    display: block;
    z-index: 1010!important; /* Assurez-vous que l'overlay est au-dessus de tout le contenu */
    pointer-events: auto; /* Empêche les interacti255ons avec les éléments en dessous de l'overlay */
    transition: opacity 0.5s; /* Animation de transition de l'opacité */
    opacity: 1; /* L'overlay est visible par défaut */
}
.alert.alert-info.cookies-banner__container {
    max-width: 1500px;
}
.btn{
	z-index: 1005;
}
h10{
	font-size: 13px;
	color:#6F6F6F;
	font: 200;
}
h8{
	font-size: 15px;
	color:#6F6F6F;
	font: 200;
}
.alert-info {
	background-color: aliceblue;
}
.py-4 {
    padding-top: 8px!important;
    padding-bottom: 2rem!important;
	background-color: #FFF;
	font-size: 13px;
	height: auto;
	max-height: 30px;
	touch-action: none; /* Empêche les gestes tactiles par défaut sur le pied de page */

}
h9{
	font-size: 10px;
}	

.navbar-toggler {
    justify-content: flex-start;
    margin-top: -220px!important;
    padding: 6px;
	z-index: 1000!important;
}

.surligneBouton {
    text-decoration: none; /* Supprimez le soulignement par défaut */
    position: relative; /* Définissez la position relative pour le conteneur */
}

.surligneBouton::after {
    content: ""; /* Ajoutez un élément pseudo-élément ::after pour le trait de soulignement */
    position: absolute; /* Position absolue par rapport au conteneur parent */
    left: 0; /* Placez le trait de soulignement au début du conteneur */
    margin-right: 10px; /* Ajoutez de l'espace à droite de chaque bouton */
	bottom: 7px; /* Ajustez la distance entre le texte et le trait (par exemple, -3px pour décaler vers le haut) */
    width: 100%; /* Largeur du trait de soulignement à 100% du conteneur */
    height: 0.8px; /* Épaisseur du trait de soulignement */
    background-color: #005CAA; /* Couleur du trait de soulignement (vous pouvez changer la couleur) */
}


/* Styles pour la liste de liens du menu */
ul {
    list-style: none;
    display: flex;
}
li {
    margin-left: 30px;
}

a {
	color: #3D3939;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: border-color 0.3s ease, opacity 0.3s ease;
    font-size: 13px;
	 white-space: wrap!important;
}

a:hover {
    background-color: #f9f9f9;
    border-color: #ddd ;
	border-radius: 5px; /* Rayon de bordure de 2px */
    border-width: 1px; /* Épaisseur de la bordure (en pixels, em, rem, etc.) */
    border-style: solid; /* Style de la bordure (par exemple, solid, dashed, etc.) */
	color: #333;
    opacity: 0.5;
    font-size: 17px;
}



/* Styles pour le contenu */
.content {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100vh;
}




@media screen and (min-width: 767px) {
	
	.navbar-collapse {
		width: 100%;
		flex-wrap: wrap;/* Hauteur fixe */
    }


	.navbar {
    top: -31px!important;
    margin: -23px;
}
	/* Styles pour le contenu de l'iframe */
	.iframe-container {
    padding-top: 0px; /* Ajout du padding-top */
}

/* Styles pour la page container */
#page-container {
    min-height: 100vh; /* Garantissez que le conteneur est au moins de la hauteur de la fenêtre */
	
}



    .buttons {
        display: flex;
        flex-direction: row;
        align-items: center;
		
    }

    .buttons li {
        margin: 50px;
        padding: 0;
		
    }

}


@media screen and (max-width: 600px) {
   .navbar-nav {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 80px!important;
    list-style: none;
    flex-wrap: wrap;
    margin: -48px;
    padding-top: -8px!important;
    align-content: space-around;
    justify-content: unset;
    align-items: center;
}   
	
	.navbar {
    width: 100%;
    position: fixed;
    padding-top: 257px;
    left: 0;
    right: 0;
    padding: 57px 0px 1px 2px;
    z-index: 2000;
    height: auto!important;
}
	.navbar-toggler {
    justify-content: flex-start;
    margin-top: 0px;
    font-size: 14px!important;
padding: 3px!important;
	 	  }
	.surligneBouton {
    text-decoration: none;
    width: 100%;
    top: 92px;
    padding: 6px 23px 6px 10px;
    margin-bottom: 39px!important;
    margin: -35px 45px -2px 42px;
    position: relative;
    color: #01689F;
    text-decoration-skip-ink: none;
	}	
.navbar.navbar-expand-lg.navbar-light.bg-light.mx-auto {
    position: fixed;
    top: 0; /* Assurez-vous que la barre de navigation est en haut */
    left: 0;
    right: 0;
    z-index: 500; /* Assurez-vous que la barre de navigation est au-dessus du contenu */
    margin: -127px 0 0 0; /* Marge de -150px seulement en haut */
}

button, input, optgroup, select, textarea {
    margin: -23px;
	position: sticky;
	}
	.cookies-banner {
        display: none; /* Masquer l'élément en mode mobile */
    }
	.container{
		top:0px!important;
		margin: 0px 0px -52px 0px!important;
	}
   
	.cookie-overlay {        
		display: none; /* Masquer l'élément en mode mobile */
    }
 /* Styles pour la navbar en mode mobile */
	body {
	position: fixed;
	top:0;
    text-align: center;
}
iframe {
    width: 100%;
    height: auto; /* Ajustez la hauteur automatiquement en fonction du contenu */
    border: none; /* Supprimez la bordure de l'iframe si nécessaire */
}

	.navbar-toggler {
    top: 4px!important;
}
/* Styles pour l'icône du menu hamburger lorsque le menu est fermé */
.menu-closed .navbar-toggler-icon {
    color: #333; /* Couleur de l'icône */
}
.menu-opened .navbar-toggler-icon {
    font-size: 18px; /* Taille de police de l'icône */
    color: red; /* Couleur de l'icône */
    margin-right: 10px; /* Marge à droite de l'icône (ajustez selon vos besoins) */

}
#page-container {
    min-height: 100vh; /* Garantissez que le conteneur est au moins de la hauteur de la fenêtre */
	margin: -42px 0px 0px 0px;
	z-index: -1;
	top: 200px!important;

}
	
.collapse {
    display: flex;
    width: 100%;
	justify-content: center;
    align-items: center;
    padding: -34px 67px 1px 46px!important;
}

	
.navbar-collapse {
    margin: 15px;
}
	.navbar>.container{
	z-index: 5000!important;
		
	}
.navbar-nav {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;	

}
	
.navbar-nav .nav-link {
    width: 100%;
	color: #01689F;
    font-size: 20px;
    margin-left: auto;
    position: relative;
    display: flex;
    top: 8px;
	margin: 10px 6px 9px 25px;
    padding: 0px 6px 10px 1px;
    flex-wrap: wrap; /* Permettre le retour à la ligne des éléments flexibles */
}
.bando1 {
    padding-top: 11px!important;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 19px!important;
    font-weight: bold;
    line-height: 1;
}
.navbar-toggler-icon {
    padding: 10px;
}

.surligneBouton {
    text-decoration: none;
	width: 100%;
	top: 100px;
	margin: -41px 22px 1px;
    position: relative;
    color: #01689F;
    text-decoration-skip-ink: none;
    padding-bottom: 0.5em; /* Ajoutez de l'espace sous le texte souligné */
}

.surligneBouton::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px; /* Ajustez la distance entre le texte et le trait (par exemple, -3px pour décaler vers le haut) */
    width: 100%;
    height: 1px; /* Épaisseur du trait de soulignement */
    background-color: #01689F; /* Couleur du trait de soulignement (vous pouvez changer la couleur) */
}
}

@media screen and (max-width: 767px) {
    .bando {
            width: 100%;
			max-width: 350px!important;
			position: absolute; 
			top:85px!important;
            left: 50%;
            transform: translate(-50%, -50%);
		    font-size: 8vw!important; /* 5% de la largeur de la vue */
            letter-spacing: 3px;
            text-align: center;
			line-height: 1; /* Ajustez cette valeur pour réduire l'interligne */
            color: white;
            text-shadow: 0px 0px 18px rgba(52, 77, 102, 0.8);
            font-family: 'Pacifico', cursive;
            font-weight: 300;
            z-index: 1;
        }

	.iframe-container {
            position: fixed;
            top: 340px;}
	.bando1 {
    padding-top: 11px!important;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 19px!important;
    font-weight: bold;
    line-height: 1;
}
	.text-nowrap {
    white-space: wrap!important;
    line-height: 1.2;
}
	.header-background-image {
        content: url('Images/header767px.jpg'); /* Changez le chemin de l'image selon votre structure de fichiers */
        max-height: 200px!important;
		position: fixed;
        top: 0px;
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
    }

	  .cookies-banner {
        display: none; /* Masquer l'élément en mode mobile */
    }
	.cookie-overlay {        
		display: none; /* Masquer l'élément en mode mobile */
    }
	
	body {
    position: fixed!important;
	top:0px;
	margin: 0;
    padding: 0;
    height: 100vh; /* 100% de la hauteur de la fenêtre */
    overflow: hidden; /* Empêche le défilement vertical */
}		

	.iframe-container {
    top: 230px!important; /* Ajout du padding-top */
	display: flex;
    left: top;
	justify-content: center; /* Centrer horizontalement */
    align-items: center; /* Centrer verticalement */
    width: 100%;
    overflow: hidden; /* Supprimez le défilement vertical */
		
}
	
	.nav-link {
    display: block;
  }
	.navbar {
        position: relative; /* Annule la position 'fixed' pour centrer horizontalement */
		justify-content: center;
    	margin: -110px 0px 57px 0px;	
		width: 100%;
		height: auto;
    display: flex;
    }
li {
    margin-left: 2%;
    margin-right: 2%;
}
}