html {
  height: 100%;
}
body {
  min-height: 100%;
  margin: 0;
  padding: 0;
}

body {position: relative;}

footer {position: absolute; bottom: 0;}

 
                                                   /* unvisited link */
body a:link {
  color:#1450aa;
  text-decoration:none;
}
                                                    /* unvisited link */
													
													/* Input error dans formulaire */

.input-error1 {
    border: 1px solid #cccccc;
    background-color: #ffffff;
	color : red;
  }
  
  
                                                     /* fin Input error dans formulaire */
													
  /* Texte courant / paragraphes */
body{
font-family:'Roboto',sans-serif;
font-size:16px;
line-height:1.7;
color:#333;
background:#ffffff;
}	

/* Mobile : taille réduite */
@media (max-width: 768px) {
    body { font-size: 14px; 
	}
}	

                                                             /* CTA button */


.cta-container {
  text-align: center;
  margin: 0 0; /* espace autour du bouton */
}

.cta-animated-button {
  display: inline-block;
  background-color: #FF6600;
  color: #FFFFFF !important;
  font-weight: 600;
  padding: 16px 20px; /* bouton élargi */
  min-width: 180px; /* largeur minimale */
  border-radius: 12px;
  text-decoration: none;
  font-size: 14px;
  position: relative;
  overflow: hidden;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

/* forcer la couleur même si le lien est visité */

.cta-animated-button:link,
.cta-animated-button:visited{
color:#FFFFFF !important;
}

.cta-animated-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-20deg);
  transition: left 0.5s ease;
}

.cta-animated-button:hover::after {
  left: 100%;
}

.cta-animated-button:hover {
  background-color: green;
  color: white;
  transform: scale(1.05);
}


                                                         /* Fin CTA button */
														 
														 /* CTA 1 button */


.cta1-container {
  text-align: center;
  margin: 0 0; /* espace autour du bouton */
}

.cta1-animated-button {
  display: inline-block;
  background-color: #FF6600;
  color: #FFFFFF !important;
  font-weight: 600;
  padding: 25px 35px; /* bouton élargi */
  min-width: 180px; /* largeur minimale */
  border-radius: 12px;
  text-decoration: none;
  font-size: 14px;
  position: relative;
  overflow: hidden;
  transition: background-color 0.3s ease, transform 0.3s ease;
}


/* forcer la couleur même si le lien est visité */

.cta1-animated-button:link,
.cta1-animated-button:visited{
color:#FFFFFF !important;
}

.cta1-animated-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-20deg);
  transition: left 0.5s ease;
}

.cta1-animated-button:hover::after {
  left: 100%;
}

.cta1-animated-button:hover {
  background-color: green;
  color: white;
  transform: scale(1.05);
}


                                                         /* Fin CTA 1 button */
														 
														 /* CTA 2 button */


.cta2-container {
  text-align: center;
  margin-top:10px;
}

.cta2-animated-button {
  display: inline-block;
  background-color: green;
  color: #FFFFFF !important;
  font-weight: 600;
  padding: 12px 16px; /* bouton élargi */
  border-radius: 12px;
  text-decoration: none;
  font-size: 14px;
  position: relative;
  overflow: hidden;
  transition: background-color 0.3s ease, transform 0.3s ease;
  width:auto;              /* ❌ enlève le 100% */
  max-width:260px;         /* limite la largeur */
  text-align:center;       /* centre le texte */
  margin:0 auto;           /* centre le bouton */
}

/* forcer la couleur même si le lien est visité */

.cta2-animated-button:link,
.cta2-animated-button:visited{
color:#FFFFFF !important;
}

.cta2-animated-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-20deg);
  transition: left 0.5s ease;
}

.cta2-animated-button:hover::after {
  left: 100%;
}

.cta2-animated-button:hover {
  background-color: green;
  color: white;
  transform: scale(1.05);
}


                                                         /* Fin CTA 2 button */

                                                    /* alignement image et texte */

.liste-label{
margin-top:10px;
}

.item-label{
display:flex;
align-items:flex-start;
gap:2px;
margin-bottom:5px;
}

.item-label img{
width:8px;
height:8px;
margin-right:12px;
margin-top:8px;
}

.item-label p{
margin:0;
line-height:1.6;   /* réduit fortement l'espacement */
font-family:'Roboto', sans-serif !important;
font-size:16px !important;
color:#666666 !important;
}

                                                        /* Fin alignement image et texte */

                                                        /* alignement image et texte 1 */


/* ligne */
.item-label1{
display:flex;
align-items:flex-start;
gap:10px;
padding:8px 0;

}

/* lien */
.item-label1 a{
text-decoration:none;
transition:all 0.25s ease;
font-family:'Roboto', sans-serif !important;
font-size:16px !important;
color:#666666 !important;
margin:0;
}

/* effet hover */
.item-label1:hover a{
color:#1450aa;
padding-left:4px;
}

.item-label1 img{
width:8px;
height:8px;
margin-right:12px;
margin-top:8px;
}


                                                              /* Fin alignement image et texte 1*/
															  
/* Titres de section */

.v7{
padding:30px;
margin-bottom:30px;
background:#ffffff;
border-radius:6px;
border:1px solid #e5e5e5;
line-height:1.7;
}

.o47{
display:inline-block;
position:relative;
font-family:'Montserrat',sans-serif;
font-size:18px;
font-weight:700;
color:#0b3d86;
margin-bottom:15px;
padding-left:14px;
line-height:1.5;
}

.o47::before{
content:"";
position:absolute;
left:0;
top:4px;
width:4px;
height:24px;
background:#018DB1;
border-radius:2px;
}

/* Texte principal */
.v7 .o7 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
}


.v7 .o280 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
}



.v7 .round5 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
}

.o69 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
}
											

                                                     /* banniere-label */ 
												
.banniere-label {
  border: 2px solid #1450aa;
  padding: 5px 10px;
  margin: 30px auto;
  max-width: 95%;
  box-sizing: border-box;
  text-align: center;
  font-family: 'Georgia', serif;
  background-color: #fff;
  animation: fadeIn 1.5s ease;
}

 .banniere-label p {
  font-size: 1.3rem;
  margin: 0;
  line-height: 1.6;
  word-wrap: break-word;
}

.mot-important {
  color: #003d7a;  
}

/* Animation QUALITÉ (effet pulsant doux) */
@keyframes pulse {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.08); opacity: 0.8; }
  100% { transform: scale(1); opacity: 1; }
}

/* Animation d'apparition */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to   { opacity: 1; transform: translateY(0); }
}

.btn-labellises {
  display: inline-block;
  margin-top: 15px;
  padding: 10px 20px;
  background-color: #005baa;
  color: white;
  text-decoration: none;
  font-weight: bold;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}

.btn-labellises a{
  color: #FFFFFF;
}

.btn-labellises:hover {
  background-color: #003d7a;
}

/* Responsive */
@media (max-width: 768px) {
  .banniere-label p {
    font-size: 1.1rem;
  }
}

@media (max-width: 480px) {
  .banniere-label p {
    font-size: 1rem;
  }
}
													 /* Fin banniere-label */
													 
													 /* Icones et Text */
.icone {
    font-size: 12px; /* Taille icône ajustable */
}			 
													  /* Fin icones et Text */

	                                                   /* css boutton de defilement vers le haut */
													
													


.retourHaut{
position:fixed;
text-align:center;
text-decoration: none;
bottom: 20px;
right: 20px;
z-index: 99;
display:none;
}

.retourHaut img{
    border-radius:5px;
}

.retourHaut:hover{
text-decoration:none;
}




                                                    /* fin css boutton de defilement vers le haut */
													
													
                                                 /* css tableau responsive */
/*striped row */

/* heading row */
th {background-color:#018DB1;font-weight:bold;color:#fff;}
/* first column bold */
tbody tr td:nth-of-type(1) {font-weight: normal;}
/* additional */
td, th {
  padding: 5px 8px 10px ;
  vertical-align:top;
  line-height: 150%;
}

@media screen and (max-width: 800px) {
table {width:100%;}
thead {display: none;}
tr:nth-of-type(2n) {background-color: inherit;}
tr td: {font-size:14px;}
tbody td {display: block;  text-align:left;}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
  font-weight: normal;
  }
  tbody td::before {
  content: attr(data-th);
  display: none;
}
}

/* first column styling 
tbody tr td:nth-of-type(1) {font-weight: normal; background:#eaeaea;}*/


	
                                                        /* css image responsive */
.responsive {
  max-width: 100%;
  max-height: 50%;
}

.responsive01 {
  max-width: 100%;
}

.responsive04 {
  max-width: 100%;
  max-height: 50%;
  border-radius: 8px;
  height: auto;
}

                                                    /* fin css image responsive */

  


                                                    /* fin css tableau responsive */


.a0 {
	font-family: 'Sofia';font-size: 12px;
}
.a1 {
	border:2px solid #FF6600;
}
.a2 {
	border-bottom:2px solid #FF6600;
	
}
.a3 {
	border-left:1px solid #FF6600;
}

                                                    /* css barre de recherche dans menu responsive */
										
								

.openBtn {
  background:white;
  padding: 5px 10px;
  border:none;
  font-size: 14px;
  cursor: pointer;
}

.overlay {
  height: 28%;
  width: 100%;
  display: none;
  position: fixed;
  z-index:99999;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
}

.overlay-content {
  position: relative;
  top: 30%;
  width: 80%;
  text-align: center;
  margin-top: 30px;
  margin: auto;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
  cursor: pointer;
  color: #ccc;
}

.overlay .closebtn:hover {
  color: white;
}

/*the container must be positioned relative:*/
.autocomplete {
  position: relative;
  display: inline-block;
}

input {
  border: 1px solid transparent;
  background-color: #f1f1f1;
  padding: 10px;
  font-size:14px;
}


input[type=text] {
  width: 100%;
  padding: 12px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-size:14px;
  border-radius: 4px;
}

input[type=submit] {
  background-color: #FF6600;
  color: white;
  border: none;
  width: 50%;
  font-size:14px;
}

input[type=submit]:hover {
 background-color:green;
}


.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9; 
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}

								
		
										
										           /* fin css barre de recherche dans menu responsive */
												   
												    /* css video autoplay muet responsive */
												   												   


.container {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0px;
  width: 97%;
  height: 100%;
  border: none;
}
                                                        /* fin css video autoplay muet responsive */
														

      
.m2{font-size:10px; text-align:center; color:#CCCCCC;} 
.m01{border-bottom:1px solid #CCCCCC;}



	  
	  
	  
	                   
														
														
														 /* css image de fond responsive */
														
.container {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
}

.container img {vertical-align: middle;}

.container .content {
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 70%;
  padding: 0px;
}	

.m3{font-size: 24px;}

.container .content a{
	color: #f1f1f1;
  text-decoration: none;
  }
  
  .container1 .content1 a{
  text-decoration: none;
  }
														
	
                                                         /* fin css image de fond responsive */	
	  
	  
	  
	                                                     	  /* css menu responsive */
													  

 /* HEADER */
 
.site-header {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  align-items: center;
  position: relative;
  
}

.site-branding {
  flex: 1 0 80%;
  max-width: 95%;
}

.site-title {
  font-size: 14px;
}


.site-header > .top-nav-label {
  flex: 0 0 auto;
  background:#1450aa;
  border-radius:4px;
}

  
  /* NAVIGATION */

.main-navigation {
  display: none;
  flex: 1 0 100%;
  
}

.main-navigation ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: left;
  width:auto;
}

  
  /* MENU PRINCIPAL */

.main-navigation .menu {
    width: 85%;         /* largeur du menu */
    margin-left: auto;  /* pousse le menu vers la droite */
    margin-right: 0;    /* pas de marge à droite */
    display: flex;      /* pour aligner les items en ligne */
    justify-content: flex-end; /* items alignés à droite */
    align-items: center; /* centre verticalement */
}

@media only screen and (min-width: 64em) {
  .main-navigation .menu-item-has-children > a::after {
      content: none !important;
      display: none !important;
  }
}


  /* ITEMS */

.main-navigation .menu .menu-item {
  position: relative;
}

.main-navigation .menu .menu-item a {
  background: #efefef;
  border: 0.0625rem solid #dcdcdc;
  color: #1450aa;
  display: block;
  padding: 0.4rem 0.8rem;
  text-decoration:none;
  white-space: nowrap;
}


  /* HOVER MENU */

.main-navigation .menu .menu-item a:hover {
  background: #1450aa;
  color: #efefef;
}

.main-navigation .menu .menu-item a:hover,
.main-navigation .menu .menu-item a:focus {
  background: #1450aa;
  color: #efefef;
}

.main-navigation .menu .menu-item a:active {
  background: #0b3d86;
  color: #efefef;
}


  /* SOUS MENU */
  
.main-navigation .sub-menu {
    display: none; /* caché par défaut */
    position: absolute;
	top:100%;
    left:0;
    background-color: #ffffff; /* fond blanc propre */
    border-radius: 0.25rem; /* coins arrondis */
    box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* légère ombre pour relief */
    padding: 0.5rem 0;
    margin-top: 0.5rem; /* espace sous le menu parent */
    width: 245px;
    z-index: 999;
}

  /* afficher au hover */
  
.main-navigation .menu-item-has-children:hover > .sub-menu{
display:block;
}
 
  /* items du sous menu */
  
/* séparation entre les items du sous-menu */
.main-navigation .sub-menu .menu-item {
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* supprimer le trait sur le dernier item */
.main-navigation .sub-menu .menu-item:last-child {
    border-bottom: none;
}
  
.main-navigation .sub-menu .menu-item a {
    display: block;
    padding: 0.6rem 1rem; /* plus de confort pour cliquer */
    font-size: 14px;
    color: #1450aa; /* texte bleu */
    text-decoration: none;
    transition: all 0.3s ease; /* effet hover doux */
    border-radius: 0.25rem; /* coins arrondis */
    /* gestion des textes longs */
    white-space: normal;
    line-height:1.4;
}


/* flèche du sous-menu */
.main-navigation .menu-item-has-children > .sub-menu::before{
content:"";
position:absolute;
top:-8px;
left:16px;
border-left:8px solid transparent;
border-right:8px solid transparent;
border-bottom:8px solid #ffffff;
}

/* supprimer la deuxième flèche générée par le thème */
.main-navigation .sub-menu::after,
.main-navigation .menu-item-has-children::after{
content:none !important;
display:none !important;
}


  /* hover sous menu */
.main-navigation .sub-menu .menu-item a:hover,
.main-navigation .sub-menu .menu-item a:focus {
    background-color: #018DB1; /* bleu clair au survol */
    color: #ffffff; /* texte blanc au hover */
}


  /* Si vous avez des sous-sous-menus - Sous-items plats */

.sub-sub-menu {
    list-style: none; /* on gère le point manuellement */
    padding-left: 1.2rem; /* décale légèrement vers la droite */
    margin: 0.2rem 0 0 0;
}

.sub-sub-menu li a {
    font-size: 14px;      /* un peu plus petit que le parent */
    color: #1450aa;
    text-decoration: none;
    display: block;
    padding: 0.25rem 0;
    transition: color 0.3s ease;
}

  /* petit point devant */
.sub-sub-menu li a:before{
content:"•";
position:absolute;
left:-10px;
color:#018DB1;
font-size:14px;
}

.sub-sub-menu li a:hover {
    color: #018DB1; /* couleur hover pour plus de visibilité */
}

.menu-item span {
	display: block; 
	padding: 10px 15px;
	color: #777;
	font-style: italic;
	background:white;
	font-style: normal;
}

.menu-item small {
	display: block; 
	color: #999;
	font-size:11px;
	margin-top: 3px;
}

.main-navigation .menu .menu-item .menu-item-has-children {
  border-right:1px solid #FF6600;
}

.main-navigation .menu .menu-item-has-children a {
  padding: 0.4rem 1rem; 
  font-size: 16px;
}

/* Hide/Show Main Menu if checkbox unchecked/checked */
.site-header > [type="checkbox"]:checked ~ .main-navigation {
  display: block;
}

/* Hide/Show Sub-Menu if checkbox unchecked/checked */
.main-navigation [type="checkbox"]:checked ~ ul {
  display: block;
}

/* Toggle buttons */
.top-nav-label {
  cursor: pointer;
  display: block;
  font-size: 0;
  margin: 0;
  overflow: hidden;
  padding: 0;
  
}

.top-nav-label .open-close-menu {
  display: block;
  position: absolute;
 
}

.top-nav-label .open-close-menu::before,
.top-nav-label .open-close-menu::after {
  border-radius: 0.1875rem;
  content: "";
  display: block;
  position: absolute;
}

/* Hamburger button */
.site-header > .top-nav-label {
  position: relative;
  right: 0;
  top: 0;
  height: 2.5rem;
  width: 2.5rem;
  border-radius: 0.1875rem;
  background:#1450aa;
  border-radius:4px;
}


.site-header > .top-nav-label .open-close-menu {
  background: #ffffff;
  border-radius: 0.1875rem;
  height: 0.25rem;
  left: 0.1875rem;
  right: 0.1875rem;
  top: 1.125rem;
  transition: 0.25s ease-in-out 0s;
}

.site-header > .top-nav-label .open-close-menu::before,
.site-header > .top-nav-label .open-close-menu::after {
  background-color: #ffffff;
  height: 0.25rem;
  left: 0;
  transition-duration: 0.3s, 0.3s;
  width: 100%;
}

.site-header > .top-nav-label .open-close-menu::before {
  top: -0.6875rem;
  transform-origin: top;
}

.site-header > .top-nav-label .open-close-menu::after {
  bottom: -0.6875rem;
  transform-origin: bottom;
}

/* Hamburger animation */
.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
  left: 0.125rem;
  transition-delay: 0s, 0.3s;
}

.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
  top: 0;
  transform: rotate(45deg);
}

.site-header > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
  bottom: 0;
  transform: rotate(-45deg);
}

/* Hamburger button hover/focus/active */
.site-header > .top-nav-label:hover,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label {
  background: #1450aa;
}

.site-header > .top-nav-label:hover .open-close-menu,
.site-header > .top-nav-label:hover .open-close-menu::after,
.site-header > .top-nav-label:hover .open-close-menu::before,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::before,
.site-header > input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::after,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label .open-close-menu,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label .open-close-menu::before,
.site-header > input[type="checkbox"]:hover ~ .top-nav-label .open-close-menu::after {
  background: #efefef;
}

.site-header > input[type="checkbox"]:checked ~ .top-nav-label:hover .open-close-menu,
.site-header > input[type="checkbox"]:checked:focus ~ .top-nav-label .open-close-menu,
.site-header > input[type="checkbox"]:checked:hover ~ .top-nav-label .open-close-menu {
  background: none;
}

/* Plus/Minus button */
.main-navigation .menu-item-has-children > .top-nav-label {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu {
  height: 100%;
  width: 100%;
  position:sticky;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::after,
.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::before {
  background: #1450aa;
  transition: transform 0.25s ease-out;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::before {
  height: 50%;
  left: calc(50% - 0.1875rem / 2);
  top: 25%;
  width: 0.1875rem;
}

.main-navigation .menu-item-has-children > .top-nav-label .open-close-menu::after {
  height: 0.1875rem;
  left: 25%;
  top: calc(50% - 0.1875rem / 2);
  width: 50%;
}

.main-navigation .menu-item-has-children a:hover ~ .top-nav-label,
.main-navigation .menu-item-has-children a:focus ~ .top-nav-label,
.main-navigation .menu-item-has-children a:active ~ .top-nav-label,
.main-navigation .menu-item-has-children:focus-within a ~ .top-nav-label {
  background: #efefef;
}

/* Plus/Minus button animation */
.main-navigation [type="checkbox"]:checked ~ .top-nav-label.open-close-menu::before {
  transform: rotate(90deg);
}

.main-navigation [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
  transform: rotate(180deg);
}

/* Plus/Minus button hover/focus/active */
.main-navigation .menu-item-has-children > .top-nav-label:hover {
  background: #1450aa;
}

.main-navigation .menu-item-has-children
  input[type="checkbox"]:focus ~ .top-nav-label {
  background: #1450aa;
}

.main-navigation .menu-item-has-children > .top-nav-label:hover .open-close-menu::after,
.main-navigation .menu-item-has-children > .top-nav-label:hover .open-close-menu::before,
.main-navigation .menu-item-has-children input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::before,
.main-navigation .menu-item-has-children input[type="checkbox"]:focus ~ .top-nav-label .open-close-menu::after {
  background: #efefef;
}

/* Hide and place checkbox over the toggle buttons */
.site-header input[type="checkbox"] {
  cursor: pointer;
  display: block;
  opacity: 0;
  position: absolute;
  z-index: 2;
}

.site-header > input[type="checkbox"] {
  right: 0.5rem;
  top: 2.75rem;
}

.site-header .menu-item-has-children input[type="checkbox"] {
  right: 1rem;
  top: 1rem;
}

/* Display the right label if checkbox checked */
.site-header input[type="checkbox"] + .top-nav-label .close-menu,
.site-header input[type="checkbox"]:checked + .top-nav-label .open-menu {
  display: none;
}

.site-header input[type="checkbox"]:checked + .top-nav-label .close-menu,
.site-header input[type="checkbox"] + .top-nav-label .open-menu {
  display: block;
}




/* RESTAURER LE HAMBURGER MOBILE */

.site-header{
display:flex;
justify-content:space-between;
flex-wrap:wrap;
align-items:center;
position:relative;
}

/* bouton hamburger visible */

.site-header > .top-nav-label{
display:block;
position:relative;
width:40px;
height:40px;
z-index:1001;
}

/* checkbox invisible mais fonctionnelle */

.site-header > input[type="checkbox"]{
position:absolute;
right:0;
top:0;
width:40px;
height:40px;
opacity:0;
z-index:1002;
cursor:pointer;
}

/* menu caché par défaut */

.main-navigation{
display:none;
width:100%;
}

/* menu visible quand hamburger cliqué */

.site-header > input[type="checkbox"]:checked ~ .main-navigation{
display:block;
}










/* MENU MOBILE VERTICAL */
@media (max-width:768px){

.main-navigation ul{
display:flex;
flex-direction:column; /* empile les éléments verticalement */
width:100%;
}

.main-navigation ul li{
width:100%;
}

.main-navigation ul li a{
display:block;
width:100%;
padding:12px 16px;
}

}



@media only screen and (min-width: 37.5em) {
  .site-title {
    font-size: 14px;
  }
}


@media only screen and (min-width: 64em) {
  .site-branding {
    flex: 1 0 30%;
    max-width: 30%;
  }

  .site-title {
    font-size: 14px;
  }

  .site-header input[type="checkbox"],
  .site-header .top-nav-label {
    display: none;
  }

  .main-navigation {
    display: block;
    flex: 1 0 70%;
    max-width: 70%;
  }

  .main-navigation .menu::before,
  .main-navigation .menu::after {
    display: none;
  }

  .main-navigation .menu > .menu-item {
    margin-left: 0.3125rem;
  }
  
  
  .main-navigation .menu {
    border: none;
    display: flex;
    justify-content: flex-end;
  }

  .main-navigation .menu .menu-item a{
    background: #fff;
    border: none;
    color: #1450aa;
    padding: 0;
  }
  
  .main-navigation .menu .menu-item a:hover {
    background: #1450aa;
    color: white;
    text-decoration: none;
  }
  
 .main-navigation .menu .menu-item a:active {
    color: #0b3d86;
    text-decoration: none;
  } 

  .main-navigation .menu-item-has-children > .top-nav-label {
    position: absolute;
    right: 0;
    top: 0;
    height: 2.5625rem;
    width: 2.5625rem;
  }
 
  .main-navigation .menu-item-has-children a:hover ~ .top-nav-label,
  .main-navigation .menu-item-has-children a:focus ~ .top-nav-label,
  .main-navigation .menu-item-has-children a:active ~ .top-nav-label,
  .main-navigation .menu-item-has-children:focus-within a ~ .top-nav-label {
    background: #FFFFFF;
  }
  
  .main-navigation .menu .menu-item-has-children a {
    padding: 0.4045rem 0.809rem;
  }

  .main-navigation .menu .menu-item-has-children > a::after {
    display: inline-block;
    content: "\25BE";
    margin-left: 0.4045rem;
    text-decoration: none;
    position: relative;
  }

  /* Show submenu on hover/focus */
  .main-navigation .menu-item-has-children > a:hover ~ ul,
  .main-navigation .menu-item-has-children:hover > a ~ ul,
  .main-navigation .menu-item-has-children > a ~ ul:hover,
  .main-navigation .menu-item-has-children > a:focus ~ ul {
    display: block;
    z-index: 999;
    pointer-events: auto;
  }

  /* Same rules - Focus-within not supported by Edge/IE. Unsupported selectors cause the entire block to be ignored, so we must repeat all styles separately. */
  .main-navigation .menu-item-has-children:focus-within > a ~ ul {
    display: block;
    z-index: 999;
  }

  .main-navigation .sub-menu::before {
    border-bottom: 0.5625rem solid #dcdcdc;
    border-left: 0.5625rem solid transparent;
    border-right: 0.5625rem solid transparent;
    border-top: 0 solid #dcdcdc;
    content: "";
    left: 30%;
    position: absolute;
    top: -0.5625rem;
  }

  .main-navigation .sub-menu::after {
    border-color: #fff transparent;
    border-style: solid;
    border-width: 0 0.5rem 0.5rem;
    content: "";
    left: calc(30% + 0.0625rem);
    position: absolute;
    top: -0.4375rem;
  }

  .main-navigation .sub-menu .sub-menu::before,
  .main-navigation .sub-menu .sub-menu::after {
    display: none;
  }
  
  .main-navigation .sub-menu .menu-item-has-children > a::before {
    content: "\25C4";
    vertical-align: top;
  }
  
  .main-navigation .sub-menu .menu-item-has-children > a::after {
    content: "";
    vertical-align: top;
  } 
   
 .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children a {
	text-align: left;
    font-size: 14px;
  }
  
  .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children .sub-menu {
	background-color: blue;
	color: white;
  }
  
  .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children .sub-menu a {
	background-color: white;
	color: #1450aa;
  }
  
  .main-navigation .menu-item-has-children .sub-menu .menu-item-has-children a:focus {
	background-color: blue;
	color: white;
  } 
 
}

@media only screen and (min-width: 64em) and (any-pointer: coarse) {
  .main-navigation .menu .menu-item-has-children a {
    padding-right: 3rem;
  }

  .site-header .menu-item-has-children .top-nav-label {
    display: block;
  }

  .site-header .menu-item-has-children input[type="checkbox"] {
    display: block;
    right: 0.625rem;
    top: 0.625rem;
  }

  .main-navigation .menu-item-has-children > a:focus ~ ul,
  .main-navigation .menu-item-has-children > input[type="checkbox"]:not(:checked):focus ~ ul {
    display: none;
  }

  .main-navigation .menu .menu-item-has-children > a::after,
  .main-navigation .sub-menu .menu-item-has-children > a::after {
    display: none;
  }
   
}


@media only screen and (min-width: 100em) {
  .site {
    max-width: 80rem;
  }

  .site-title {
    font-size: 14px;
  }

  .main-navigation .sub-menu ul {
    left: 100%;
    top: 0;
    max-width: 100%;
  }
  
  .main-navigation ul {
    width: 100%;
  }
  
  .main-navigation .sub-menu .menu-item-has-children > a::after {
    content: "\25BA";
  }

}

@media screen and (max-width: 800px) {
.main-navigation .menu .menu-item-has-children .sub-menu .menu-item {
  width:90%; 
}
}









/* ===== MENU MOBILE ===== */

@media (max-width:768px){

/* menu pleine largeur */
.main-navigation .menu{
width:100%;
margin:0;
display:block;
}

/* supprimer les div wrapper qui cassent le layout */
.main-navigation .menu .s009{
width:100%;
}

/* chaque ligne du menu */
.main-navigation .menu .menu-item{
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
}

/* lien du menu */
.main-navigation .menu .menu-item a{
flex:1;
text-align:left;
padding:14px 16px;
}

/* bouton toggle à droite */
.main-navigation .menu-item-has-children .top-nav-label{
position:relative;
width:40px;
height:40px;
right:0;
}

/* sous menu mobile */
.main-navigation .sub-menu{
position:relative;
width:100%;
box-shadow:none;
margin:0;
}

/* sous items */
.main-navigation .sub-menu .menu-item a{
padding-left:25px;
}

}





















/* ===== SOUS-MENU MOBILE ===== */

@media (max-width:768px){

/* désactiver ouverture au survol */
.main-navigation .menu-item-has-children:hover > .sub-menu{
display:none;
}

/* sous-menu sous le parent */
.main-navigation .sub-menu{
position:relative;
top:0;
left:0;
width:100%;
margin:0;
box-shadow:none;
border:none;
}

/* ouverture uniquement au clic */
.main-navigation .menu-item-has-children input[type="checkbox"]:checked ~ .sub-menu{
display:block;
}

/* style des sous-items */
.main-navigation .sub-menu .menu-item{
display:block;
width:100%;
}

.main-navigation .sub-menu .menu-item a{
padding:12px 20px;
text-align:left;
}

}



@media (max-width:768px){
.main-navigation .sub-menu::before{
display:none;
}
}





/* ===== SOUS MENU MOBILE SOUS LE PARENT ===== */

@media screen and (max-width: 800px){

/* sous-menu sous le parent */
.main-navigation .sub-menu{
position:relative !important;
top:auto !important;
left:auto !important;
width:100%;
margin:0;
border:none;
}

/* éviter les largeurs fixes */
.main-navigation .menu .menu-item-has-children .sub-menu .menu-item{
width:100%;
}

/* style sous items */
.main-navigation .sub-menu li{
width:100%;
display:block;
}

.main-navigation .sub-menu li a{
padding:12px 30px;
}
}



@media screen and (max-width:800px){

/* parent sur une ligne */
.main-navigation .menu-item{
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
width:100%;
}

/* lien principal */
.main-navigation .menu-item > a{
flex:1;
}

/* bouton + */
.main-navigation .submenu-toggle{
margin-left:auto;
}

/* sous-menu sous le parent */
.main-navigation .sub-menu{
display:none;
width:100%;
position:relative !important;
margin-top:5px;
}

/* ouverture au clic */
.main-navigation .submenu-toggle:checked ~ .sub-menu{
display:block;
}

/* items du sous menu */
.main-navigation .sub-menu li{
display:block;
width:100%;
}

}





@media (max-width:768px){

/* fond blanc pour les colonnes de sous-menu */
.main-navigation .sub-menu{
background:#ffffff !important;
}

/* liens dans les sous-menus */
.main-navigation .sub-menu li a{
background:#ffffff !important;
color:#1450aa !important; /* garde la couleur du texte */
}

/* sous-sous-menu */
.main-navigation .sub-sub-menu{
background:#ffffff !important;
}

.main-navigation .sub-sub-menu li a{
background:#ffffff !important;
color:#1450aa !important;
}

}

				                                    /* fin css menu responsive */
															 
															 
															     
															  
															  

/* css navigation collante  */


/* =============================== */
/* NAVIGATION COLLANTE */
/* =============================== */

.exemple{
min-height:0;
}

.test{
position:relative;
}

/* menu collant */
.scroll{
position:fixed;
top:0;
left:0;
width:100%;
z-index:9999;
}

/* correction mobile */

@media only screen and (max-width:800px){

.scroll{
position:static;   /* menu redevient normal */
width:100%;
}

}

                                                        /* fin css navigation collante  */
											
											
															
	.s008{border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}															
	.s0001{font-size:12px;
	      text-align:left;}	
	
	
												  
												  
.container0 {
  position: relative;
  max-width: 420px;
  margin: 0 auto;
}

.container0 img {vertical-align: middle;}

.container0 .content0 {
  position: absolute;
  top: 0;
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.2); /* Black background with 0.7 opacity */
  color: #ffffff;
  width: 25%;
  
  padding: 0px;
  text-align:center;
  
}


	
								
.round0{
          font-size: 14px; color:#666666; text-align:center; 
        }
.round1{
          font-size: 14px; color:#FF6600; text-align:left;
        }
.round2 {
         font-size: 14px; color:#666666;
        }
.round3 {
         font-family: 'Allerta', Helvetica, Arial, sans-serif; line-height:170%; text-align:justify;
        }
		
.round5{
          font-size: 14px; color:#666666; text-align:center; 
        }
		
.round5 a:link{
          font-size: 14px; color:#666666; text-align:center; 
        }
	
			


.style3{
	border-radius:5px/5px; 
	}
	

* {box-sizing: border-box;}

.mySlides {display: none;}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 350px;
  position: relative;
  margin: auto;
}


/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: inherit;
  font-size: 8px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 5px;
  width: 5px;
  margin: 0 2px;
  background-color: #FFFFFF;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 0s;
  animation-name: fade;
  animation-duration: 0s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}

		
.item-align {
  display: flex;
  align-items: center; 
  justify-content: flex-start; /* centre horizontalement */
  gap: 8px; /* espace entre l’image et le texte */
  margin: 6px 0; 
}


.icon-img {

  max-width: 100%;
  max-height: 50%;
  border-radius: 8px;
  height: auto;
}
		
.t0{ display:none;}		
.t1{font-size:14px; background:#666666; color:#FFFFFF; line-height: 1.6; padding:20px 10px; font-family:'Roboto', sans-serif;}
.t2{font-size: 12px; color: white;}
.t3{ font-size: 12px; color: white;}
.t4{color:#FFFFFF; font-size:14px;}
.t5{color:#FFFFFF; font-size:14px; font-family:'Roboto', sans-serif;}
.t6{color:#FFFFFF; font-size: 14px; font-family:'Roboto', sans-serif;}
.t6 a:link{color:#FFFFFF; font-size: 14px; font-family:'Roboto', sans-serif;}
.t7{color:#FFFFFF; text-align:center; font-family:'Roboto', sans-serif;}
.t7 a:link{color:#FFFFFF; text-align:center; font-family:'Roboto', sans-serif;}


.s009{border-right:1px solid #F0F0F0;}	

.o1{color:blue;
	font-size: 16px;
	}
	
.o2{border: 1px solid #CCCCCC; font-size:14px; padding:15px; text-align:left;}
	
.o4{color:blue;
    font-weight: bold;
	text-decoration: none;
	font-size: 14px;
	text-align:left;
	}
	
.o4 a:link{color:blue;
    text-align:center;
	}
	
.o5{color:white;
    text-align:center;
	}
.o5 a:link{color:white;
    text-align:center;
	}

.o6{background-color:blue;
    border-radius:10px/10px;
	text-align:left;
	}
	
.o7{color:#666666;
	font-size: 14px;
	}
	
.o8{
     font-size:14px;
     color:#666666;
     text-align:left;
}

.o9{
     border-left:2px solid #FF6600;
}

.o09{
     border-top:2px solid #CCCCCC;
}


.o10{color:#FFFFFF; font-size:14px;}
.o11{color:#FFFFFF; font-size:12px;}
.o12{color:#FFFFFF; font-size:14px;}
.o13{font-size:14px; color:#FFFFFF;}
.o13 a:link{color:#FFFFFF;}
.o17{color:red; font-size:12px;}

.o23{font-size:12px; border: 2px solid #FFFFFF; border-radius:5px/5px; line-height: 150%;}

.o24{color:#FFFFFF; font-size:14px;}
.o25{font-size:14px; color:#FFFFFF;}
.o25 a:link{color:#FFFFFF;}
.o26{color:#FFFFFF; font-size:14px;}

.o28{font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
	text-decoration: underline;
	}
	
.o28 a:link{font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #666666 !important;
	text-decoration: underline;
	}


.o0280{font-size:14px; color:#666666;}
.o0280 a:link{font-size:14px; color:#666666;}
.o0280 a:hover{text-decoration:underline;}

.o280{font-size:14px; color:#666666; padding: 5px;}
.o280 a:link{font-size:14px; color:#666666; padding: 5px;}


.o30{color:white; font-size:14px; font-weight:bold;}

.o41{border:1px solid #CCCCCC; border-radius: 5px/5px; box-shadow: 2px 2px 0px #CCCCCC; font-size:14px; color: #666666;}
.o41 a:link{color:#666666;}
.o42{color:blue; font-size:22px; font-weight:bold;}
.o042{display:flex; justify-content: center; width: 1000px;}
.o43{color:#FFFFFF; text-align:center; border-radius:5px/5px;}

.o45{color:#FFFFFF; font-size: 12px;}
.o45 a:link{color:#FFFFFF; font-size: 12px;}

.o46{font-size:14px; color:#1450aa;}
.o46 a:link{font-size:14px; color:#1450aa;}

.o50{color:#FFFFFF; font-size: 12px;}
.o50 a:link{color:#FFFFFF; font-size: 12px;}

.o52{border: 2px solid #FF6600; border-radius:5px/5px;}
.o60{ color:#CCCCCC; font-size:14px;}

.o69{margin-left:15px; font-size:14px; text-align:left; text-decoration:underline; width:200px;}
.o69 a:link{margin-left:15px; font-size:14px; text-align:left; text-decoration:underline; width:200px;}

.o069{ display:none;}

.o70{ display:none;}
.o71{ display:none;}
.o72{ display:block;}
.o072{display:block; border-radius:5px/5px;}
.o73{display:none;}
.o74{font-size:14px; color:red; text-align:left; text-decoration:underline; width:200px;}
.o74 a:link{font-size:14px; color:red; text-align:left; text-decoration:underline; width:200px;}

.o80{font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 50px/50px;}

.o83{Position: absolute; top: 259px; left: 70px; display:none}

td{line-height: 150%;}	

.n1{color:#666666;
    font-size:14px;
	}

.n4{color:#1450aa;}
.n4 a:link{color:#1450aa;}

.n6 {
  color:#1450aa;
  margin-top: auto; /* pousse le nombre en bas */
  text-align:right;
  font-weight: bold;
}

.o043{color:#FFFFFF; text-align:center;}

.x1{border-radius:5px/5px; border-left: 1px solid #666666; border-bottom: 1px dotted #666666; border-top: 1px dotted #666666; border-right: 1px solid #666666; color:#666666; font-size: 12px; font-family: 'Roboto', sans-serif !important; padding: 5px;}
.x1 a:link{text-decoration: underline;}




.v2 {
        font-weight:bold; color:white; font-size:18px;
        }
.v3 {
        color:#FFFFFF; font-size:14px;  text-align:left; width:100%;
        }

.v7{
   font-size:14px; border-radius:5px/5px; border-left: 1px solid #666666; border-bottom: 1px dotted #666666; border-top: 1px dotted #666666; border-right: 1px solid #666666;
   }
  
.v07 {
  font-size:16px;
  border-radius:5px;
  border-left: 1px solid #666;
  border-bottom: 1px dotted #666;
  border-top: 1px dotted #666;
  border-right: 1px solid #666;
  vertical-align: top; /* important */
  height: 140px; /* OBLIGATOIRE */
  padding: 10px;
}

.card0 {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* pousse le nombre en bas */
  padding: 10px;
}

.s1 {
	position:absolute;
	left: 925px;
	top: 335px; 
}

.s2 {
	position:absolute;
	left: 925px;
	top: 745px; 
}

.s3 {display:none;}
.s4 {display:none;}


@media only screen and (max-width: 800px) {
	
.barre{display:none;}
.s1 {display:none;}
.s2 {display:none;}
.s3 {display:block;}
.s4 {display:block; font-size:14px; text-align:left; border-radius:5px/5px; border: 1px solid #CCCCCC;}
	
.o60{ color:#CCCCCC; font-size:14px;}
.o69{display:none;}
.o069{ display:block; font-size:14px; text-align:center;}
.o70{ display:block; text-align:center; max-width:100%;}	
.o71{ display:block; text-align:center; width:100%;}
.o72{ display:none;}
.o072{ display:none;}
.o73{display:block; text-align:center; font-size:14px; color:red;}
.o73 a:link{text-align:center; font-size:14px; color:red;}
.o74{display:none;}
.o76{border: 1px solid #FF6600; width:160px;}
.o80{max-width:100%; font-size:12px; border: 1px solid #CCCCCC; color:#1450aa; border-radius: 50px/50px; text-align: center;}
.o83{display:block; z-index: 1; width:70%; text-align: center;} 

.o41{text-align:center; width:100%;}
.o41 a:link{text-align:center;}
.o42{text-align:center;}
.o042{display:flex; justify-content: center; width: 100%;}
.o30{color:blue; font-weight:bold; }
.style3{ background:#FFFFFF; width:100%;}
.o20{border-spacing: 0; border-collapse : collapse; background:#FFFFFF; width:100%;}
.o43{border-spacing: 0; border-collapse : collapse; background:#FFFFFF; width:100%; border-radius:5px/5px;}
.o47{font-size:16px; padding-left:12px; line-height:1.4;}
.o47::before{height:20px; width:3px;}
.o14{background:#FFFFFF;}
.o3{background-color:#FFFFFF; text-align:center; width:100%;}
.openBtn {border:1px solid #CCCCCC;}
.o68{background-color:#FFFFFF;} 
.respons0{max-width:100%;}
.responsive0 {height:65px; z-index: 1;}
.responsive02 {max-width:100%;}
.responsive01 {max-width:100%; height:30%;}
.o65{display:none;}
.o75{display:none;}	
.o010{display:none;}
.o24{text-align:center;}
.o2{border: 1px solid #CCCCCC; font-size:18px; padding:25px; text-align:left;}
.n6{color:#1450aa; text-align:right; margin-top: 5px;}
.v7{font-size:18px; padding:15px; justify-content: space-between; border-radius:5px/5px; border-left: 1px solid #666666; border-bottom: 1px dotted #666666; border-top: 1px dotted #666666; border-right: 1px solid #666666;}
.v07{font-size:18px; height: auto; padding:15px; justify-content: space-between; border-radius:5px/5px; border-left: 1px solid #666666; border-bottom: 1px dotted #666666; border-top: 1px dotted #666666; border-right: 1px solid #666666;}
.card0 {height: auto;}
.t0{ display:block; text-align:center; max-width:100%;}
.t3{display:none;}
.t5{text-align:center;}

}


@media only screen and (max-width:900px){

.sidebar-label{
width:100% !important;
max-width:100% !important;
margin:0 auto;
}

.sidebar-label td{
width:100% !important;
}

.sidebar-label .v7{
width:100% !important;
}
}
	  










/* =============================== */
/* TITRE CSS SUR MOBILE */
/* =============================== */
 
/* VERSION ORDINATEUR */

.table-titre0{
display:none;
}

/* STYLE TITRE */

.table-titre{
width:100%;
border-collapse:collapse;
}

.titre-section{
color:#ffffff;
font-weight:bold;
font-size:18px;
text-align:center;
padding:14px 10px;
width:100%;
box-sizing:border-box;
}

/* MOBILE */

@media screen and (max-width:800px){

.table-titre0{
display:table !important;
width:100% !important;
max-width:100% !important;
table-layout:fixed;
}

.table-titre{
width:100% !important;
max-width:100% !important;
table-layout:fixed;
font-weight:bold;
}

.table-titre tbody,
.table-titre tr,
.table-titre td{
width:100%;
}

}

/* =============================== */
/* FIN CSS TITRE SUR MOBILE */
/* =============================== */








.container10 {
  position: relative;
  text-align: center;
  color: white;
}

.top-left {
  position: absolute;
  top: 0px;
  left: 16px;
  text-align:left;
  display:block;
}

.top-right {
  position: absolute;
  top: 8px;
  right: 16px;
  text-align:left;
}

@media only screen and (max-width:900px){

.top-left {
  display:none;
  width:100%;
  color : #FFFFFF;
  background: green;
}
}




/* =============================== */
/* BLOC PILOTE */
/* =============================== */


.pilote {
  margin: 40px 0;
}

.pilote-card {
  background: #fff;
  padding: 25px;
  border-radius: 12px;
  border-left: 5px solid #ff6b00;
  box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}

.pilote-card h3 {
  margin-bottom: 15px;
}

.badge.actif {
  background: #ff6b00;
  color: #fff;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  margin-left: 10px;
}

.actions {
  margin-top: 20px;
}

.bta {
  text-decoration: none;
  padding: 10px 18px;
  border-radius: 6px;
  margin-right: 10px;
  display: inline-block;
}

.bta.primaire {
  background: #1450aa;
  color: white;
}

/* =============================== */
/* FIN BLOC PILOTE */
/* =============================== */





/* =============================== */
/* CSS ACCORDEON */
/* =============================== */


.referentiels {
  padding: 40px;
  font-family: 'Roboto', sans-serif !important;
}

.grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.card {
  background: white;
  border-radius: 12px;
  padding: 10px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
}

.accordion {
  background-color: #1450aa;
  color: #fff;
  font-family: 'Roboto', sans-serif !important;
  cursor: pointer;
  padding: 12px;
  width: 100%;
  border: none;
  text-align: left;
  font-size: 16px;
  border-radius: 8px;
  position: relative; /* pour que le + soit positionné */
  display: flex;
  align-items: center;
  gap: 10px;
  padding-right: 50px; /* espace pour le + */
}

.accordion .icon {
  width: 30px;
  text-align: center;
  margin-right: 10px;
  flex-shrink: 0;
}

.accordion .title {
  flex: 1; /* pousse le + à droite */
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.accordion:after {
  content: '+';
  position: absolute;
  right: 20px; /* distance du bord droit */
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
}

.accordion.active:after {
  content: '-';
}

.panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0 10px;
}

.panel ul {
  padding-left: 20px;
}


.badge {
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 20px;
  white-space: nowrap;
}

.badge.dev {
  background: #f0ad4e;
  color: white;
  padding: 3px 8px;
  border-radius: 5px;
  font-size: 12px;
  margin-left: 10px;
}

.badge.venir {
  background: #999;
  color: white;
  padding: 3px 8px;
  border-radius: 5px;
  font-size: 12px;
  margin-left: 10px;
}


/* =============================== */
/* FIN CSS ACCORDEON */
/* =============================== */





/* =============================== */
/* FOOTER PRO QUALIFIE */
/* =============================== */

/* container principal */

.footer-container{
max-width:1174px;
margin:auto;
display:flex;
justify-content:space-between;
gap:40px;
flex-wrap:wrap; /* important pour mobile */
}

/* colonnes */

.footer-col{
flex:1;
font-size:14px;
text-align:left; 
color:#ffffff;
}

.footer-col1{
flex:1;
font-size:14px;
text-align:left; 
background:#666666;
}

/* titres */

.footer-col h3{
color:#ffffff;
font-size:16px;
margin-bottom:15px;
text-decoration:underline; /* titres soulignés */
}

/* texte */

.footer-col p{
color:#ffffff;
line-height:1.6;
}

/* liste */

.footer-col ul{
list-style:none;
padding:0;
margin:0;
}

.footer-col li{
margin-bottom:8px;
}

/* liens */

.footer-col a{
color:#ffffff;
text-decoration:none;
transition:0.3s;
}

.footer-col a:hover{
text-decoration:underline;
}

/* réseaux sociaux */

.footer-social a{
margin-right:12px;
color:#ffffff;
text-decoration:none;
}

/* partie basse */

.footer-bottom{
text-align:center;
margin-top:30px;
font-size:14px;
color:#ffffff;
border-top:1px solid rgba(255,255,255,0.3);
padding-top:15px;
}

.footer-bottom a{
color:#ffffff;
text-decoration:none;
margin:0 6px;
}

.footer-bottom a:hover{
text-decoration:underline;
}




/* =============================== */
/* VERSION MOBILE FOOTER */
/* =============================== */

@media (max-width:768px){

.footer-container{
flex-direction:column;
text-align:center;
}

.footer-col{
width:100%;
}

.footer-social{
margin-top:10px;
}

}


/* CENTRER LE FOOTER SUR MOBILE */

@media only screen and (max-width:900px){

.footer-table{
width:100% !important;
max-width:100% !important;
margin:0 auto;
}

/* centrer tout le contenu */

.footer-container{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
}

/* colonnes du footer */

.footer-col,
.footer-col1{
width:100%;
margin-bottom:25px;
text-align:center;
}

/* centrer les listes */

.footer-col ul{
padding-left:0;
list-style:none;
}

/* centrer les icones */

.footer-social{
display:flex;
justify-content:center;
gap:10px;
}

/* centrer le bas du footer */

.footer-bottom{
text-align:center;
padding:15px 10px;
}

}


/* REDUIRE LES ESPACES ENTRE LES BLOCS DU FOOTER SUR MOBILE */

@media only screen and (max-width:900px){

.footer-container{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap:8px; /* espace entre colonnes réduit */
}

.footer-col,
.footer-col1{
width:100%;
margin-bottom:10px; /* espace vertical réduit */
padding:5px 0;
}

/* réduire espace titres */

.footer-col h3{
margin-bottom:8px;
}

/* réduire espace des listes */

.footer-col ul{
margin:0;
padding:0;
}

.footer-col ul li{
margin-bottom:4px;
}

}


/* =============================== */
/* FIN CSS VERSION MOBILE FOOTER */
/* =============================== */





/* =============================== */
/* CSS zone partenaires */
/* =============================== */

.header-partenaires{
margin-left:0;
}

/* titre */

.titre-partenaire{
font-family:'Roboto', sans-serif;
font-size:14px;
color:#FFFFFF;
padding-right:10px;
white-space:nowrap;
}

/* conteneur */

.carousel-partenaires{
width:200px;
height:100px;
overflow:hidden;
position:relative;
border-left: 4px solid #FFFFFF;
}

/* logos */

.logo-partenaire{
position:absolute;
left:15px;
top:0;
opacity:0;
animation:carouselLogos 15s infinite;
}

/* animation */

.logo-partenaire:nth-child(1){
animation-delay:0s;
}

.logo-partenaire:nth-child(2){
animation-delay:3s;
}

.logo-partenaire:nth-child(3){
animation-delay:6s;
}

.logo-partenaire:nth-child(4){
animation-delay:9s;
}

.logo-partenaire:nth-child(5){
animation-delay:12s;
}

@keyframes carouselLogos{

0%{
opacity:0;
transform:translateY(10px);
}

10%{
opacity:1;
transform:translateY(0);
}

25%{
opacity:1;
}

35%{
opacity:0;
}

100%{
opacity:0;
}

}

/* =============================== */
/* FIN CSS zone partenaires */
/* =============================== */




/* =============================== */
/* CSS barre supérieure */
/* =============================== */

.top-bar{
max-width:1150px;
margin:auto;
background:#ffffff;
border-bottom:1px solid #e5e5e5;
}

.top-bar-container{
width:100%;
display:flex;
justify-content:space-between;
align-items:center;
padding:6px 0;
gap:15px; /* espace propre */
}

/* icones social */

.social-icons{
display:flex;
align-items:center;
}

.social-icons img{
width:30px;
height:30px;
object-fit:contain;
margin-right:10px;
}

/* boutons */

.top-links{
display:flex;
gap:10px;
}

.btn-green{
background:#1aa34a;
color:white !important;
padding:8px 14px;
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:14px;
border-radius:4px;
transition:0.3s;
}

.btn-blue{
display:flex; /* important */
align-items:center; /* centrage vertical */
justify-content:center;
background:#1450aa;
color:white !important;
padding:0 14px; /* on enlève padding vertical */
height:30px; /* même hauteur que icônes */
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:14px;
border-radius:4px;
transition:0.3s;
}

.btn-blue a{
display:flex;
align-items:center;
height:100%;
color:white !important;
text-decoration:none;
}

.btn-green::after{
content:" ▼";
font-size:10px;
margin-left:4px;
}

.btn-green:hover{
background:#14853b;
color:white !important;
}


.menu-item input{
display:none;
}


/* =============================== */
/* FIN CSS barre supérieure */
/* =============================== */





/* =============================== */
/* CSS MEGA MENU */
/* =============================== */

.menu-item{
position:relative;
}

/* mega menu */

.mega-menu{
position:absolute;
top:40px;
right:0;
width:900px;
min-height:450px; /* ajuste selon ton design */
background:#fff;
border:1px solid green;
box-shadow:0 4px 15px rgba(0,0,0,0.1);
display:flex;
opacity:0;
visibility:hidden;
transition:0.3s;
z-index:999;
max-height:80vh;
overflow-y:auto;
}

/* mega menu desktop : hover */
@media (min-width:901px){

.menu-item:hover .mega-menu{
opacity:1;
visibility:visible;
}

}


/* partie gauche */

.mega-left{
width:50%;
padding:20px;
display:flex;
flex-direction:column;
gap:10px;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left a{
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left a:hover{
color:#555;
}

/* image droite */

.mega-right{
width:50%;
}

.mega-right img{
width:100%;
height:100%;
object-fit:cover;
}


/* partie gauche mega-left1 */

.mega-left1{
width:60%;
padding:20px;
flex-direction:column;
gap:15px;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left1 b{
grid-column:span 2;
font-size:18px;
color:#000;
margin-bottom:10px;
}

.mega-left1 br{
display:none;
}

.mega-left1 a{
text-decoration:none;
font-family:'Roboto',sans-serif;
font-size:18px;
color:#1450aa;
}

.mega-left1 a:hover{
color:#555;
}

.section-header{
margin-bottom:10px;
}

.section{
display:flex;
flex-direction:column;
}

.section .title{
font-weight:bold;
color:#1aa34a;
margin:10px 0 5px;
font-size:18px;
}

.menu-block{
padding-bottom:12px;
margin-bottom:12px;
transition:0.3s;
}

.menu-block:hover{
border-bottom:1px solid #1aa34a;
}

.menu-block:last-child{
border-bottom:none;
margin-bottom:0;
}


/* image droite */

.mega-right1{
width:55%;
height:100%;
display:flex;
overflow:hidden;
border-left:1px solid #eee;
justify-content:center;
padding:30px 20px;
align-items:center; /* centre vertical */
box-sizing:border-box;
}

.mega-right1 img{
width:100%;
height:100%;
object-fit:contain; /* clé du problème */
object-position:center; /* centre l'image */
display:block;
}


/* liens du sous menu dans mega menu */

.mega-left a{
display:block;
text-decoration:none;
color:#1450aa;
font-family:'Roboto', sans-serif;
font-size:18px;
padding:6px 0;
position:relative;
transition:0.3s;
}

/* point devant chaque lien dans mega menu*/

.mega-left a::before{
content:"•";
color:#1aa34a;
margin-right:8px;
font-size:18px;
}

/* trait en dessous dans mega menu */

.mega-left a::after{
content:"";
position:absolute;
left:0;
bottom:0;
width:0;
height:1px;
background:#1aa34a;
transition:0.3s;
}

/* effet hover dans mega menu*/

.mega-left a:hover{
color:#1aa34a;
}

.mega-left a:hover::after{
width:100%;
}


/* liens du sous menu dans mega-left1 */

.mega-left1 a{
display:block;
text-decoration:none;
color:#1450aa;
font-family:'Roboto', sans-serif;
font-size:18px;
padding:6px 0;
position:relative;
transition:0.3s;
}

.cta-animated-button a{
font-size:14px;
padding:8px 14px;
border-radius:6px;
display:inline-block;
font-weight:600;
}

/* point devant chaque lien dans mega menu*/

.mega-left1 a::before{
content:"•";
color:#1aa34a;
margin-right:8px;
font-size:18px;
}

.cta2-animated-button::before{
content:none !important;
}

/* trait en dessous dans mega menu */

.mega-left1 a::after{
content:"";
position:absolute;
left:0;
bottom:0;
width:0;
height:1px;
background:#1aa34a;
transition:0.3s;
}

/* effet hover dans mega menu*/

.mega-left1 a:hover{
color:#1aa34a;
}

.mega-left1 a:hover::after{
width:100%;
}


/* =============================== */
/* FIN CSS MEGA MENU */
/* =============================== */





/* ================= MOBILE ================= */

/* Rendre la barre responsive */


@media only screen and (max-width:900px){

.top-bar{
position:relative;
z-index:9999;
width:100%;
}

.top-bar-container{
width:100%;
max-width:100%;
margin:auto;
padding:6px 10px;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:nowrap;   /* empêche les retours à la ligne */
}

/* icones */

.social-icons{
align-items:center;
}

.social-icons img{
width:30px;
margin-right:8px;
}

/* boutons */

.top-links{
display:flex;
gap:6px;
align-items:center;
}

.btn-green{
font-size:12px;
padding:7px 10px;
white-space:nowrap;
display:inline-block;
}

}


/* écrans très petits */

@media only screen and (max-width:480px){

.btn-green{
font-size:11px;
padding:6px 8px;
}

.social-icons img{
width:18px;
}

}



@media (max-width:900px){

.section-header{
margin-bottom:15px;
}

.section .title{
font-size:18px;
margin-top:15px;
}

}



/* Adapter le mega menu pour mobile */ 

@media only screen and (max-width:900px){

/* cacher les checkbox partout */
.menu-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
}


/* mega menu mobile */
@media (max-width:900px){

.mega-menu{
position:fixed;
top:50px;
left:0;
width:100vw;
height:calc(100vh - 50px);

background:white;
display:block; /* 🔥 IMPORTANT : PAS FLEX */

opacity:0;
visibility:hidden;
z-index:9999;

/* 🔥 SCROLL ICI */
overflow-y:auto;
-webkit-overflow-scrolling: touch;
}

/* ouverture au clic */

.menu-item input:checked ~ .mega-menu{
opacity:1;
visibility:visible;
}

/* bloquer le scroll arrière */
body.menu-open{
overflow:hidden;
}

.menu-block{
border-bottom:1px solid rgba(0,0,0,0.05); /* ultra léger */
padding-bottom:12px;
margin-bottom:12px;
}

.menu-block:last-child{
border-bottom:none;
}

/* liens */

.mega-left{
width:100%;
max-width:100%;
padding:20px 16px; /* 🔥 padding équilibré mobile */
box-sizing:border-box;
}

.mega-left a{
display:block;
padding:10px 0;
font-family:'Roboto',sans-serif;
font-size:18px;
text-decoration:none;
color:#1450aa;
line-height:1.4;
}

.mega-left1{
width:100%;
max-width:100%;
padding:20px 16px; /* 🔥 padding équilibré mobile */
box-sizing:border-box;
}

.mega-left1 a{
display:block;
padding:10px 0;
font-family:'Roboto',sans-serif;
font-size:18px;
text-decoration:none;
color:#1450aa;
line-height:1.4;
}

.mega-right{
display:none;
}

.mega-right1{
display:none;
}

}

/* ================= FIN MOBILE ================= */




                                                 /* CSS TABLEAU POUR NIVEAU DE LABELLISATION */

/* CONTENEUR PRINCIPAL */
.pql-table-wrapper{
    max-width: 800px;
    margin: 30px auto;
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    font-family: Arial, sans-serif;
}

/* TITRE */
.pql-table-title{
    text-align: center;
    margin-bottom: 20px;
    color: #1d3557;
    font-size: 20px;
    font-weight: bold;
}

/* TABLE */
.pql-table{
    width: 100%;
    border-collapse: collapse;
}

/* HEADER */
.pql-table thead .pql-th{
    background: #1d3557;
    color: #ffffff;
    padding: 12px;
    text-align: left;
    font-size: 14px;
}

/* CELLULES */
.pql-table .pql-td{
    padding: 12px;
    border-bottom: 1px solid #eaeaea;
    font-size: 14px;
}

/* HOVER LIGNE */
.pql-table .pql-tr:hover{
    background: #f1f5f9;
}

/* BADGES NIVEAUX */
.pql-badge{
    font-weight: bold;
}

.pql-performance{
    color: #b8860b;
}

.pql-excellence{
    color: #1e88e5;
}

.pql-platinum{
    color: #6a1b9a;
}



                                                   /* CSS TABLEAU POUR NIVEAU DE LABELLISATION */




                                                  /* CSS PAGE IDENTIFIER LE BADGE OFFICIEL */


.badges-section {
    text-align: center;
    margin: 50px 0;
}

.badges-section h2 {
    font-size: 26px;
    margin-bottom: 30px;
    color: #1a1a1a;
}

/* Container */
.badges-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}

/* Chaque badge */
.badge-item {
    max-width: 300px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Image */
.badge-item img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

/* Titre */
.badge-item h3 {
    margin-top: 12px;
    font-size: 18px;
    color: #333;
}

/* Effet hover (pro) */
.badge-item:hover {
    transform: translateY(-8px);
}

.badge-item:hover img {
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

/* Responsive mobile */
@media (max-width: 768px) {
    .badges-container {
        flex-direction: column;
        align-items: center;
    }

    .badge-item {
        max-width: 90%;
    }
}

                                                                   /* FIN CSS PAGE IDENTIFIER LE BADGE OFFICIEL */




                                                                   /* CSS PAGE VERIFIER LE CERTIFICAT ET L'IDENTIFICATION */
																  

/* CONTAINER GLOBAL */
.certificate {
    width: 100%;
    max-width: 900px;
    margin: 40px auto;
    background: #FFFFFF;
    padding: 40px 30px;
    border: 6px solid #d4af37;
    box-sizing: border-box;
    position: relative;
	z-index: 1;
    background: linear-gradient(
        rgba(255,255,255,0.95),
        rgba(255,255,255,0.95)
    ),
    #fff;
}


.certificate * {
    position: relative;
    z-index: 2;
}

.certificate::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;

    width: 100%;
    max-width: 400px;
    height: auto;
    aspect-ratio: 1 / 1;

    background: url('./v_files/LOGO PRO QUALIFIE 5.png') no-repeat center;
    background-size: contain;

    opacity: 8%;

    transform: translate(-50%, -50%) rotate(-20deg);

    pointer-events: none;
}



/* HEADER */
.header {
    text-align: center;
}

.logo {
    width: 180px;
    height: auto;
	margin-bottom: 10px;
}

.header h1 {
    font-size: 22px;
    margin: 10px 0;
    letter-spacing: 1px;
}

.subtitle {
    font-size: 13px;
    color: #777;
}

/* CONTENT */
.content {
    text-align: center;
    margin-top: 30px;
}

.intro {
    font-size: 16px;
}

.company-name {
    font-size: 24px;
    margin: 20px 0;
    color: #000;
}

.texto {
    font-size: 15px;
    margin: 10px 0;
}

.sector {
    font-size: 16px;
    margin: 10px 0;
}

.level {
    font-size: 24px;
    font-weight: bold;
    color: #2e7d32;
    border: 2px solid #2e7d32;
    display: inline-block;
    padding: 8px 20px;
    margin: 15px 0;
}

.description {
    font-size: 14px;
    margin-top: 20px;
    color: #444;
    line-height: 1.6;
}

/* DETAILS */

.details {
    margin-top: 30px;
    font-size: 14px;
    border-top: 1px solid #ccc;
    padding-top: 15px;
}

/* FOOTER */
.footer-line {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
	border-top: 1px solid #ddd;
    padding-top: 20px;
}

.signature {
    text-align: center;
}

.line {
    width: 180px;
    height: 1px;
    background: #000;
    margin: 30px auto 0 auto; /* ← centrage horizontal */
}

.qr {
    text-align: center;
}

.qr img {
    display: block;
    margin: 0 auto;
    width: 70px;
    max-width: 100%;
	border: 1px solid #ccc;
    padding: 5px;
}

.qr p {
    font-size: 12px;
    text-align: center;
    margin-top: 5px;
}

/* 🔽 RESPONSIVE MOBILE */
@media (max-width: 768px) {

    .certificate {
        padding: 25px 15px;
        border-width: 4px;
    }

    .header h1 {
        font-size: 18px;
    }

    .company-name {
        font-size: 20px;
    }

    .level {
        font-size: 18px;
    }

    .footer-line {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .line {
        width: 140px;
    }
}


@media (max-width: 768px) {
    .certificate::before {
        width: 80%;
        opacity: 0.04;
    }
}

/* 🔽 PRINT A4 (TRÈS IMPORTANT) */
@media print {

    .certificate {
        width: 210mm;
        height: 297mm;
        padding: 40px;
        border: 8px solid #d4af37;
        margin: 0;
    }

    body {
        background: none;
    }

    .footer-line {
        position: absolute;
        bottom: 40px;
        left: 40px;
        right: 40px;
    }
}
																   										   
													  /* FIN CSS PAGE VERIFIER LE CERTIFICAT ET L'IDENTIFICATION */
													  													  
													  
													   /* CSS PAGE CONTACTEZ-NOUS */
													   
.bloc-contact{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:25px;
margin-bottom:25px;
width:100%;
}

.contact-item{
background:#f8f9fa;
padding:25px;
border-radius:12px;
border:1px solid #e5e7eb;
box-sizing:border-box;
min-height:220px;
width:100%;
display:flex;
flex-direction:column;
justify-content:flex-start;
overflow:hidden; /* IMPORTANT : empêche les débordements */
}

.contact-item h3{
margin-top:0;
margin-bottom:18px;
color:#1450aa;
font-size:20px;
line-height:1.4;
}

.contact-item p{
margin:10px 0;
line-height:1.7;
font-size:16px;
word-break:break-word;
overflow-wrap:break-word; /* IMPORTANT */
}

.contact-item a{
color:#1450aa;
text-decoration:none;
font-weight:bold;
display:flex;
align-items:center;
gap:10px;
word-break:break-word;
overflow-wrap:break-word;
max-width:100%;
}

.social-icon{
width:26px;
height:26px;
object-fit:contain;
flex-shrink:0;
}

/* TABLETTE */
@media screen and (max-width:768px){

.bloc-contact{
grid-template-columns:1fr;
}

.contact-item{
min-height:auto;
width:100%;
}

}

/* MOBILE TRÈS IMPORTANT (sécurité anti-débordement) */
@media screen and (max-width:480px){

.contact-item{
padding:18px;
}

.contact-item h3{
font-size:18px;
}

.contact-item p,
.contact-item a{
font-size:15px;
}

}												   
													   
													   /* FIN CSS PAGE CONTACTEZ-NOUS */
													   
													   
													   /* CSS FORMULAIRE SIGNALER UN ABUS */
													   
.container00{
width:100%;
max-width:100%;
box-sizing:border-box;
overflow:hidden;
}

#signalementForm{
width:100%;
max-width:100%;
}

#signalementForm label{
display:block;
margin-bottom:8px;
font-weight:bold;
color:#222;
}

#signalementForm input[type="text"],
#signalementForm input[type="email"],
#signalementForm input[type="file"],
#signalementForm select,
#signalementForm textarea{
width:100%;
max-width:100%;
padding:12px;
border:1px solid #d1d5db;
border-radius:8px;
font-size:16px;
box-sizing:border-box;
background:#fff;
}

#signalementForm textarea,
.grand-textarea{
display:block;
width:100% !important;
max-width:100% !important;
min-height:220px;
padding:12px;
border:1px solid #d1d5db;
border-radius:8px;
font-size:16px;
line-height:1.6;
box-sizing:border-box;
resize:vertical;
}

#signalementForm input[type="submit"]{
width:100%;
max-width:320px;
padding:14px;
font-size:16px;
font-weight:bold;
background:#1d4ed8;
color:#fff;
border:none;
border-radius:8px;
cursor:pointer;
transition:0.3s;
}

#signalementForm input[type="submit"]:hover{
background:#143ea7;
}

/* reCAPTCHA responsive */
.g-recaptcha{
overflow:hidden;
}

@media screen and (max-width:480px){

#signalementForm input[type="submit"]{
max-width:100%;
}

.g-recaptcha{
transform:scale(0.90);
transform-origin:left top;
}

}
													   
													   /* FIN CSS FORMULAIRE SIGNALER UN ABUS */
													   
													   
													   /* CSS FORMULAIRE ALERTER SUR UNE PRATIQUE NON CONFORME */
													 
.container00{
width:100%;
max-width:100%;
box-sizing:border-box;
overflow:hidden;
}

#alerteForm{
width:100%;
max-width:100%;
}

#alerteForm label{
display:block;
margin-bottom:8px;
font-weight:bold;
color:#222;
}

#alerteForm input[type="text"],
#alerteForm input[type="email"],
#alerteForm input[type="date"],
#alerteForm input[type="file"],
#alerteForm select,
#alerteForm textarea{
display:block;
width:100%;
max-width:100%;
padding:12px;
border:1px solid #d1d5db;
border-radius:8px;
font-size:16px;
box-sizing:border-box;
background:#fff;
}

.grand-textarea{
min-height:220px;
line-height:1.6;
resize:vertical;
}

#alerteForm input[type="submit"]{
width:100%;
max-width:320px;
padding:14px;
font-size:16px;
font-weight:bold;
background:#dc2626;
color:#fff;
border:none;
border-radius:8px;
cursor:pointer;
transition:0.3s;
}

#alerteForm input[type="submit"]:hover{
background:#b91c1c;
}

/* Responsive reCAPTCHA */
.g-recaptcha{
overflow:hidden;
}

@media screen and (max-width:480px){

#alerteForm input[type="submit"]{
max-width:100%;
}

.g-recaptcha{
transform:scale(0.90);
transform-origin:left top;
}

}													 
													   
													   /* FIN CSS FORMULAIRE ALERTER SUR UNE PRATIQUE NON CONFORME */
													   
													   
					                                  /* CSS FORMULAIRE DEPOSER UNE RECLAMATION */
													  
.container00{
width:100%;
max-width:100%;
box-sizing:border-box;
overflow:hidden;
}

#reclamationForm{
width:100%;
max-width:100%;
}

#reclamationForm label{
display:block;
margin-bottom:8px;
font-weight:bold;
color:#222;
}

#reclamationForm input[type="text"],
#reclamationForm input[type="email"],
#reclamationForm input[type="date"],
#reclamationForm input[type="file"],
#reclamationForm select,
#reclamationForm textarea{
display:block;
width:100%;
max-width:100%;
padding:12px;
border:1px solid #d1d5db;
border-radius:8px;
font-size:16px;
box-sizing:border-box;
background:#fff;
}

.grand-textarea{
min-height:220px;
line-height:1.6;
resize:vertical;
}

#reclamationForm h3{
margin-top:30px;
margin-bottom:20px;
color:#1450aa;
font-size:22px;
}

#reclamationForm input[type="submit"]{
width:100%;
max-width:320px;
padding:14px;
font-size:16px;
font-weight:bold;
background:#1450aa;
color:#fff;
border:none;
border-radius:8px;
cursor:pointer;
transition:0.3s;
}

#reclamationForm input[type="submit"]:hover{
background:#0f3d84;
}

/* Responsive reCAPTCHA */
.g-recaptcha{
overflow:hidden;
}

@media screen and (max-width:480px){

#reclamationForm input[type="submit"]{
max-width:100%;
}

.g-recaptcha{
transform:scale(0.90);
transform-origin:left top;
}

}												  
													  
													  /* FIN CSS FORMULAIRE DEPOSER UNE RECLAMATION */
													  
													  
													  /* CSS FORMULAIRE CONTACTEZ-NOUS */
/* =========================
   CONTENEUR GENERAL
========================= */

.container00{
width:100%;
max-width:100%;
box-sizing:border-box;
overflow:hidden;
padding:0 10px;
}

/* =========================
   BLOC CONTACT
========================= */

.bloc-contact{
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:20px;
margin-bottom:30px;
width:100%;
}

.contact-item{
background:#f8f9fa;
padding:20px;
border-radius:10px;
border:1px solid #e5e7eb;
box-sizing:border-box;
min-width:0;
}

.contact-item h3{
margin-top:0;
margin-bottom:15px;
color:#1450aa;
font-size:18px;
}

.contact-item p{
margin:10px 0;
line-height:1.6;
word-wrap:break-word;
overflow-wrap:break-word;
}

.contact-item a{
display:flex;
align-items:center;
gap:10px;
color:#1450aa;
font-weight:bold;
text-decoration:none;
word-break:break-word;
}

.contact-item a:hover{
text-decoration:underline;
}

.social-icon{
width:24px;
height:24px;
object-fit:contain;
flex-shrink:0;
}

/* =========================
   FORMULAIRE
========================= */

#contactForm{
width:100%;
max-width:100%;
}

#contactForm label{
display:block;
margin-bottom:8px;
font-weight:bold;
color:#222;
}

#contactForm input[type="text"],
#contactForm input[type="email"],
#contactForm input[type="file"],
#contactForm select,
#contactForm textarea{
display:block;
width:100%;
max-width:100%;
padding:12px;
border:1px solid #d1d5db;
border-radius:8px;
font-size:16px;
box-sizing:border-box;
background:#fff;
}

/* TEXTAREA */

.grand-textarea{
min-height:220px;
line-height:1.6;
resize:vertical;
}

/* BOUTON */

#contactForm input[type="submit"]{
width:100%;
max-width:320px;
padding:14px;
font-size:16px;
font-weight:bold;
background:#1450aa;
color:#fff;
border:none;
border-radius:8px;
cursor:pointer;
transition:0.3s;
}

#contactForm input[type="submit"]:hover{
background:#0f3d84;
}

/* reCAPTCHA */

.g-recaptcha{
overflow:hidden;
}

/* =========================
   TABLETTE
========================= */

@media screen and (max-width:768px){

.bloc-contact{
grid-template-columns:1fr;
}

}

/* =========================
   MOBILE
========================= */

@media screen and (max-width:480px){

.container00{
padding:0 5px;
}

#contactForm input[type="submit"]{
max-width:100%;
}

.g-recaptcha{
transform:scale(0.90);
transform-origin:left top;
}

.contact-item{
padding:15px;
}

}
													  
													  /* FIN CSS FORMULAIRE CONTACTEZ-NOUS */

