body {



background-color: #ffffff;



margin-left: 0;



margin-right: 0;



margin-top: 0;



font: 18px Verdana, Arial, Helvetica, sans-serif;



color: #444444;



text-align: center;



margin: 0;



padding-top: 50px;



padding-right: 0px;



padding-bottom: 0px;



padding-left: 0px;



    }







h1 {



font-family: Arial, Helvetica, sans-serif; 



font-size: 18px; 



font-weight: bold; 



text-align: left; 



text-indent: 0px; 



color: #000000;



}







h2 {



font-family: Arial, Helvetica, sans-serif; 



font-size: 18px; 



font-weight: bold; 



text-align: left; 



text-indent: 0px; 



color: #000000;



}











h3 {



font-family: Arial, Helvetica, sans-serif; 



font-size: 18px; 



font-weight: bold; 



text-align: left; 



text-indent: 0px; 



color: #000000;



}











p {



font-family: Arial, Helvetica, sans-serif; 



font-size: 18px; 



font-weight: normal; 



text-align: justify; 



text-indent: 0px; 



color: #444444;



}







a {     /* valeurs generales /*



font-weight: bold;



text-decoration: none;



text-decoration: none;



color: #3366CC;



padding: 8px 12px;



transition: all 0.3s ease;



}







a:link {      /* lien normal */



color: #3366CC;



text-decoration: none;



font-weight: bold;



}







a:visited {            /* lien déjà visité */



color: #3366CC;



text-decoration: none;



}







a:hover {              /* quand la souris passe dessus */



font-style: italic;



text-decoration: underline;



font-weight: bold;



}







table {



  margin-left: auto;



  margin-right: auto;



}







.bandeau {



  position: absolute;



  top: 0;



  left: 0;



  width: 100%;



  height: 50px;



  background-color: #4678b6;



  border: 0;



}







.image-gauche {



      float: left;



      margin: 0 15px 15px 0;



    }







.etiquete-jaune {



  font-weight: bold;           /* Texte en gras */



  color: black;                /* Couleur du texte */



  background-color: yellow;    /* Fond jaune */



  border: 2px solid black;     /* Cadre noir */



  border-radius: 10px;           /* Coins arrondis à 5% */



  padding: 5px 10px;          /* xxpx vertical, xxpx horizontal */



  font-family: sans-serif;     /* Police par défaut */



  font-size: 25px;             /* Taille du texte */



  display: inline-block;       /* Pour que le cadre s’adapte au contenu */



  text-indent: 0px; 



}







/*Menu*/



#hideshow



{



	position: absolute;



	width: 100%;



	height: 100%;



	top: 0;



	left: 0;



	z-index: 4;



	



}



#hideshow p



{



	border-bottom: #ffffff thin solid;



	text-align: left;



	text-transform: none;



	list-style-type: none;



	font-variant: small-caps;



	font-family: Arial, Verdana;



	color: #ffff00;



	font-size: 16px;



	vertical-align: middle;



	font-weight: bold;



	line-height: 5mm;/*regle la hauetru des case de menu*/



}



#hideshow a



{



	text-decoration: none;



	text-align: left;



	text-transform: none;



	list-style-type: none;



	font-variant: small-caps;



	font-family: Arial, Verdana;



	color: #ffffff;



	font-size: 16px;



	vertical-align: middle;



	font-weight: normal;



	line-height: 5mm;/*regle la hauetru des case de menu*/



}







.popup_menu



{ 



	float: left;



	width: 250px;



	background: #232425;



	margin: 0px 0;



	padding: 0px 0;



	border: 0px solid #bbb;



    text-align: left; text-transform: none; list-style-type: none; font-variant: small-caps; font-family: Arial, Verdana; color: #ffffff; font-size: 16px; vertical-align: middle; font-weight: bold; 



}







.related-links ul 



{



  list-style: none;      /* supprime les puces */



  margin: 0;



  padding: 0;



}







.related-links li 



{



  padding-left: 10px;    /* espace de 10px avant */



  margin-bottom: 10px;   /* espace vertical entre les lignes */



}







.articles-container-fixe {



  width: 70%;



  margin: 0 auto;



  display: flex;



  flex-direction: column;



  gap: 30px;



}







.articles-container-mobile {



  width: 90%;



  margin: 0 auto;



  display: flex;



  flex-direction: column;



  gap: 30px;



}





/*menu deroulant*/



/* Liste globale */



nav ul.menu-mobile {



    list-style: none;



    padding: 0;



    margin: 0;



    font-family: Arial, sans-serif;



    font-size: 16px;



}







/* Chaque ligne du menu */



nav ul.menu-mobile li {



    margin: 0;



    padding: 10px 10px; /* espace vertical augmenté */



    border-bottom: 1px solid #ddd; /* trait séparateur */



}







/* Liens */



nav ul.menu-mobile li a {



    text-decoration: none;



    color: #333;



    display: block;



}







/* Survol */



nav ul.menu-mobile li a:hover {



    font-style: italic;   /* texte en italique */



    background: #000000;  /* garde le même fond */



}







/* Titres de sections */



nav ul.menu-mobile li.menu-section {



    font-weight: bold;



    background: #000000;      /* fond identique */



    border-left: 0px solid #FFFFFF;



    color: #ffff00;           /* texte jaune */



    padding: 4px 10px;



}







/* Lien retour / accueil */



nav ul.menu-mobile li.menu-retour a {



    font-weight: bold;



    background: #000000;



    border-radius: 4px;



}







/* Icône retour */



nav ul.menu-mobile li.menu-retour img {



    width: 20px;



    vertical-align: middle;



    margin-right: 6px;



}



/* ramene l'alignement après l'article important */

article::after {

    content: \"\";

    display: block;

    clear: both;

}


/*POUR LES MENU ACCORDEON*/

/* Sous-menus masqués par défaut */
.accordeon-menu-mobile ul {
    display: none;
    padding-left: 15px;
    margin: 0;
}

/* Boutons de section */
.accordeon-menu-mobile li.accordeon-section-toggle {
    cursor: pointer;
    font-weight: bold;
    padding: 8px 0;
    list-style: none;
}

/* Flèches */
.accordeon-menu-mobile li.accordeon-section-toggle span::after {
    /*content: \" ▼\";*/
    font-size: 12px;
}

.accordeon-menu-mobile li.accordeon-section-toggle.open span::after {
    /*content: \" ▲\";*/
}

/* Liens */
.accordeon-menu-mobile a {
    text-decoration: none;
    display: block;
    padding: 6px 0;
}

/* Texte des rubriques */
.accordeon-menu-mobile li.accordeon-section-toggle span {
    color: #FFFF00;
    padding: 5px;
}

/* Supprime toutes les puces natives */
.accordeon-menu-mobile ul,
.accordeon-menu-mobile li {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Puce triangle pour tous les liens */
.accordeon-menu-mobile li a::before {
    content: \"►\";
    color: #FFFFFF;
    margin-right: 6px;
    font-size: 12px;
    display: inline-block;
    width: 12px;
}

/* Supprime la puce du lien Accueil */
.accordeon-menu-mobile li.accordeon-menu-retour a::before {
    content: \"\";
    margin: 0;
    width: 0;
}

/* Réinitialisation */
.accordeon-menu-mobile,
.accordeon-menu-mobile ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Niveau 1 */
.accordeon-menu-mobile > li {
    padding-left: 0;
}

/* Niveau 2 */
.accordeon-menu-mobile ul > li {
    padding-left: 20px;
}

/* Niveau 3 */
.accordeon-menu-mobile ul ul > li {
    padding-left: 40px;
}

/* Niveau 4 */
.accordeon-menu-mobile ul ul ul > li {
    padding-left: 60px;
}

/* Titres niveau 2 */
.accordeon-menu-mobile ul > li.accordeon-section-toggle > span {
    padding-left: 20px;
    display: block;
}

/* Titres niveau 3 */
.accordeon-menu-mobile ul ul > li.accordeon-section-toggle > span {
    padding-left: 40px;
    display: block;
}

/* Titres niveau 4 */
.accordeon-menu-mobile ul ul ul > li.accordeon-section-toggle > span {
    padding-left: 60px;
    display: block;
}


/* Ligne blanche au-dessus des rubriques de niveau 1 */
.accordeon-menu-mobile > li.accordeon-section-toggle {
    border-top: 1px solid #FFFFFF;
    padding-top: 10px;
}

/* Ligne blanche sous la dernière rubrique de niveau 1 */
.accordeon-menu-mobile > li.accordeon-section-toggle:last-of-type {
    border-bottom: 1px solid #FFFFFF;
    padding-bottom: 10px;
}

/*couleur de fond du menu*/
.accordeon-menu-mobile {
    background-color: #4678b6; /* noir par exemple */
}

/*nav[aria-label=\"Menu principal\"],
.accordeon-menu-mobile {
    margin: 0;
    padding: 0;
}*/


/*pour l'ouverture automatique*/
.accordeon-section-toggle.open > ul {
    display: block !important;
}


/*FIN POUR LES MENU ACCORDEON*/

/*POUR LES SOMMAIRES*/

.sommaire {
    list-style: none;
    padding: 0;
    margin: 0;
}

.chapitre {
    margin-bottom: 18px;
    border-bottom: 1px solid #ddd;
}

/* Bouton du chapitre */
.toggle {
    width: 100%;
    text-align: left;
    padding: 14px 45px 14px 15px; /* espace à droite pour la flèche */
    font-size: 1em;
    background: #f2f2f2;
    border: none;
    cursor: pointer;
    border-radius: 4px;
    position: relative;
    line-height: 1.4em;
    min-height: 48px; /* hauteur mini pour mobile */
}

/* Flèche à droite */
.toggle::after {
    content: '▶'; /* triangle vers la droite */
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
    font-size: 1.9em;
    color: #555;
}

/* Flèche tournée quand ouvert */
.toggle.open::after {
    transform: translateY(-50%) rotate(90deg);
}

/* Résumé animé */
.resume {
    max-height: 0;
    overflow: hidden;
    padding: 0 15px;
    background: #fff;
    font-size: 0.95em;
    line-height: 1.5em;
    text-align: justify;
    transition: max-height 0.4s ease, padding 0.3s ease;
}

.resume.open {
    max-height: 800px;
    padding: 10px 15px;
}