body {
	--ajeuegal-orange-bg : #FF9921 ;
	--ajeuegal-creme1-bg : #FFDCB4 ;
	--ajeuegal-creme2-bg : #FFD4A2 ;
	/* --ajeuegal-orange-fg : #E58F2C ; */
	--ajeuegal-orange-fg : #DC8117 ;
	--ajeuegal-rose:#CE2F94 ;
	--ajeuegal-bordeau:#870c59 ;
}
/*
 * Par précaution:
 *	- on supprime toute marge sur la page globale
 *	- on précise un taille de 100% (c'est-à-dire la taille par défaut du navigateur, semble être utile pour certains navigateurs)
 */
html, body {
	margin: 0;
	padding: 0;
	font-size: 100%;
	
	/*
	* Le line-height semble ne pas avoir la même valeur
	* par défaut sur tous les navigateur, pour s'éviter
	* des surprises on la fixe globalement à 1.2*font-size
	*
	* Remarque pas inutile: Quand line-height est spécifiée par un nombre
	* (et non une longueur ou un pourcentage) la propriété line-height hérite
	* des valeurs spécifiées et non des valeurs calculées, donc sans avoir
	* à repréciser le nombre à chaque fois, le line-height évolue
	* en même temps la taille de la police.
	*/
	line-height: 1.31;
}


/*
 * Fontes par défaut du site:
 * On ne précise pas de taille ici de façon
 * à pouvoir utiliser des tailles relatives à la taille par défaut (100%)
 * ensuite
 *
 * Le fond de la page:
 * En pratique ce sont ici les bordures autour du conteneur principal
 */
body {
	background-color: var(--ajeuegal-orange-bg); 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	text-align: justify;
}


/*
 * le  "conteneur_parent" est le conteneur principal qui contient
 * tout: bannière, menus, texte, ligne du bas...
 * on lui donne sa largeur et on le centre au milieu de la page (avec
 * les margin auto)
 * On fixe aussi la couleur globale de fond, mais qui pourra être écrasée par
 * les bloc contenus
 */

#conteneur_parent {
	width: 60vw;
	margin: 0 auto;
	background-color: black;
	-moz-box-shadow: 1px 1px 12px #555; 
	-webkit-box-shadow: 1px 1px 12px #555; 
	box-shadow: 1px 1px 12px #555;
	background-color: #FFC47F; 
}


/*
 * Le bloc qui contient la bannière
 * Le height doit être la hauteur de l'image d'arrière plan 
 *   choisie sinon elle sera tronquée ou une marge apparaîtra.
 * La largeur de l'image doit être le width du conteneur_parent
 *   sinon l'image sera tropnquée ou une marge apparaîtra
 */
#banniere {
	height: 144px;
	background-image: url(../images/banniere-fruits.jpg); 
	background-repeat: no-repeat; 
	z-index: -1;
}


/**********************************************************
********** Menus horizontaux ******************************
**********************************************************/


/*
 * Le conteneur global pour des deux lignes de menus 
 * L'image d'arrière plan est posionnée en bas et répétée horiantalement
 *
 * Actuellement cela place un dégradé en base des menus
 */
.container_menu {
	background-color:#ffebd3;
}

#partie-texte > p:first-child {
	margin-top : 0 !important ;
}

/*
 * Le premier menu horizontal possède la classe "menu_horizontal"
 * Le deuxième menu horizontal possède les deux classes  "menu_horizontal" puis
 * "sous_menu_horizontal"
 * 
 * Les styles .menu_horizontal... ci-dessous s'appliquent donc aux deux menus,
 * sauf dans le cas où des styles seraient écrasés dans .sous_menu_horizontal, ces 
 * `écrasements` s'appliquent alors uniquement au deuxième menu
 */


/*
 * Les menus sont affichés comme des tables, le <div> "menu_horizontal"
 * correspond à la table, le <ul> à la colonne et le <li> à la cellule.
 *
 * Pour chaque `cellule`, le structure est la suivante:
 *	- le <li> contient un <a> qui renvoie vers l'article ou la rubrique concernée
 *	- le <a> s'affiche comme un bloc et contient un <img> s'il y a un logo et un <span>
 *	- le <img> et le <span> sont alignés veticalement au centre de la cellule
 */

/* 
 * On utilise ici une taille de carctère en pixel pour avoir une meilleure maîtrise
 * compte tenu que la largeur du menu est fixe
 * Cependant il faut faire attention car la taille réelle des carctères dépendera
 * de la fonte réellement utilisée par le navigateur
 */
.menu_horizontal {
	font-size: 15px;
	font-family:  "Century Gothic", "Avant Garde", Helvetica, sans-serif;
	background-color:transparent;
	display:table;
	width: 100%;
	padding: 2px 0 1px 0;
	margin:0;
	border-spacing:0;
	border:none;
}

/*
 * On supprime le style de liste et on donne à <ul>
 * un affichage de colonne de table
 */
.menu_horizontal ul {
	width: 100%;
	list-style:none;
	display:table-row;
	white-space:nowrap;
	list-style:none;
	position:relative;
	background-color: transparent;
	padding: 0;
	margin:0;
	border-spacing:0;
	border:none;
}

/*
 * On donne au <li> un affichage de cellule
 */
.menu_horizontal li {
	display:table-cell;
	width: 10000px; /* permet d'avoir une répartition plus jolie! Pourquoi? bonne question! */
	vertical-align: middle;
	text-align:center;
	color:var(--ajeuegal-rose);
	background:none;
	background-color:transparent;
	padding: 0;
	margin:0;
	border-spacing:0;
	border:none;
	
}

/* le color:inherit est utile sinon va utiliser les couleurs prédéfinies par le navigateur
 * La couleur est définie dans le <li> parent (ci-dessus) car elle est
 * utilisée aussi pour écrire la date de mise à jour sur la page sommmaire
 * Utiliser inherit permet de n'avoir qu'un seul endroit où modifier cette couleur
 */
.menu_horizontal li a {
	border:0 none;
	text-align:center;
	color: inherit; 
	text-decoration:none;
	text-align:center;
	cursor:pointer;
	background-color: transparent;
	font-weight:bold;
	padding: 0 0.5em 0.2em 0.5em;
	margin:0;
}

.menu_horizontal li a.actif {
	background-color: var(--ajeuegal-rose);
  	color: white;
}

/* 
 * En cas de logo, on met un padding de 4px
 * à droite  de l'image pour qu'elle ne soit pas collée au texte
 * l'image est centrée verticalement comme le texte pour un
 * alignement agréable
 */
.menu_horizontal li a img {
	vertical-align:middle;
	padding: 0 4px 0 0;
}

/* 
 * aligement vertical sur le milieu, comme l'image de logo
 * la couleur su texte est héritée des ancêtres 
 * (en l'occurant spécifiée dans le li ci-dessus)
 */
.menu_horizontal li a span {
	vertical-align:middle;
	padding: 0;
	margin:0;
	background-color: transparent;
	color:inherit;
} 

/*
 * Couleur du texte du menu lorsqu'il s'agit du lien vers la 
 * page active 
 */
.menu_horizontal li a.on {
	color:black;
	background-color: transparent;
}

/*
 * Couleur du texte du menu lorsqu'on passe la souris dessus
 */
.menu_horizontal li a:hover {
	color:#6b0b47;
	background-color: transparent;
}

/*
 * Couleur du texte du menu lorsqu'on passe la souris dessus
 * et qu'il s'agit du lien vers la page active 
 */
.menu_horizontal li a.on:hover {
	color: black;
	background-color: transparent;
	cursor: default;
}


/* Pour le sous-menu horizontal on garde le même style
 * que pour le premier menu horizontal
 *
 * Le conteneur du sous-menu possède les deux classes "menu_horizontal" 
 * puis "sous_menu_horizontal" donc les styles décrits plus hauts
 * sont utilisés
 *
 * Les lignes suivantes sont commentées car elle ne servent pas ici,
 * elle seront utiles si on souaite appliquer un style différent au sous-menu
 */
/*
.sous_menu_horizontal {}
.sous_menu_horizontal ul {}
.sous_menu_horizontal li {}
.sous_menu_horizontal li a {}
.sous_menu_horizontal li a b {}
.sous_menu_horizontal li a.on {}
.sous_menu_horizontal li a.on b {}
.sous_menu_horizontal li a:hover {}
.sous_menu_horizontal li a:hover b {}
.sous_menu_horizontal li a.on:hover {}
.sous_menu_horizontal li a.on:hover b {}
*/

/*
 * On écrit la date de mise à jour en gras
 */
.sous_menu_horizontal li.datedernieremodif {
	font-weight:normal;
	font-size: 15px;
}

/**********************************************************
 ********** Fin des menus horizontaux *********************
 **********************************************************/



/* C'est le conteneur qui contient le texte
 * c'est à dire tout sauf la baniière et les menus horizontaux
 *
 * Utile pour mettre une image de fond: ici un
 * dégradé horizontal en haut, on ne remet de couleur de fond,
 * déjà sépcifiée dans conteneur_parent
 */
#inside {
	margin:0;
	padding:0;
	background-image: url(../images/haut-fond-princ.png);
	background-repeat: repeat-x;
}


/*****************************************************
 ******* styles spéciaux pour la page sommaire *******
 *****************************************************/

.titre_sommaire {
	text-align: center;
	margin: 0;
	padding:10px 0 0 0 ;
	/* Le reste est spéficié en même temps que
	 * .titrearticle et .titrerubrique */
}

#tablepresentation td{
	padding-left:8px;
	padding-right:8px;
}

#tablepresentation tr.poles {
	background-color: var(--ajeuegal-orange-bg);
	font-size:121%;
	height:1.5em;
	text-align: center;
	font-weight:bold;
}

#tablepresentation tr.horaires {
	font-weight:bold;
	text-align:center;
	background-color:var(--ajeuegal-creme2-bg);
}

#tablepresentation tr.description {
	text-align:justify;
	background-color: var(--ajeuegal-creme1-bg);
}


#blocs_sommaire {
	border-spacing : 10px;
	
}

#blocs_sommaire td {
	vertical-align: top;
	
}

#blocgauche {
	width:55%;
	margin:0;
	padding: 10px;
	border: none;
	font-size:77%;
	background-color: var(--ajeuegal-creme2-bg);
}

#blocgauche ul {
	margin:0 0 0 20px;
	padding:0;
}

#blocgauche p {
	/* text-indent: 15px; */
	margin-top:0px;
	padding-top:0px;
	margin-bottom:3px;
	padding-bottom:0px;
	
	
}


#blocgauche h3.spip {
	text-align:center;
	width:90%;
	margin:0 auto;
	padding:0;
	color: #EC8C1E;
	text-shadow: 1px 1px 5px white;
	border:none;
}



#blocgauche strong strong {
	color:#CE2F94;
}


#blocdroit {

	width:35%;
	margin:0;
	
	padding: 10px;
	border: none;
	background-color: var(--ajeuegal-creme2-bg);
	font-size:77%
}


/*****************************************************
 ***** Fin styles spéciaux pour la page sommaire *****
 *****************************************************/


/*
 * La ligne de hierarchie, on change la couleur
 * des liens lorsqu'on passe la souris dessus (:hover)
 */

#lignehierarchie {
	font-size: 77%;
	color: black; 
	line-height: 2;
}

#lignehierarchie a {
	text-decoration: none;
	color: #cc3393;
	border:none;
}

#lignehierarchie a:hover {
	color: #6b0b47;
}

/*
 * #partie-texte est le conteneur qui contient  le titre,
 * la date, le texte... et aussi le menu de niveau >=3 le cas
 * échéant.
 */
#partie-texte {
	margin:0 20px;
	padding : 2em 0 0 0 !important  ;
}

/*
 * Actuellement on utilise le même style pour les titres d'articles
 * et les titres de rubrique
 */
.titre_sommaire, .titrearticle, .titrerubrique {
	color: var(--ajeuegal-orange-fg);
	text-decoration: none;
	white-space: normal;
	font-size: 200%;
	font-weight: bold;
	padding-bottom:0px;
	margin-bottom:0px;
	text-shadow: 1px 1px 15px white; 
}


/*
* Couleur et taille de la ligne "article publié le..."
* en dessous du titre de l'article
*/
.datearticle {
	margin:0;
	color: #ff7200;
	font-size:77%;
}



/****************************************
 ********** menu de niveau >=3 **********
 ****************************************/

/*
 * Le bloc du menu commence prend place entre le
 * milieu de la page et le bord droit
 *
 * filet de gros pointillés sur la gauche
 */
#sous_rubriques {
	margin: 10px 0 0 50%;
	padding:0 0 0 10px;	
	border-left: 3px dotted #3D5671;
	
}

#sous_rubriques .textetitre{
	font-size: 96%;
	font-weight: bold;
	color: black;
}

#sous_rubriques ul {
	font-family: "Avant Garde", "Century Gothic", Helvetica, sans-serif;
	padding: 0 0 0 30px; /* Le décage des items de la liste */
	margin:0;
	font-size: 96%;
	color: black; /* Cette couleur est utilisée par les puces */
	
}

#sous_rubriques a{
	text-decoration: none;
	font-weight: bold;
	color: #cc3393;
	border:0 none;
}

#sous_rubriques a:hover{
	color: #6b0b47; 
}


/****************************************
 ******** Fin menu de niveau >=3 ********
 ****************************************/


/*
 * Spécialement pour les rubriques
 * le div "textearticle" est contenu dans un div
 * "presentation", ce qui permet éventuellement 
 * d'adapter le style du texte spécialiement pour
 * les présentations de rubrique
 *
 * Ici on ajoute spéicifie une marge avec les bords et
 * on met un filet de gros pointillés sur la gauche
 */
#presentation {
	margin: 0 20px;
	border-style: none;
	border-left: 3px dotted gray;
}



/*
 * On fixe surtout les marges générales du bloc du texte principal
 * et la couleur du texte
 *
 * le clear both permet de s'assurer que le bloc qui commence
 * se positionne correctement (laisse les float éventuels au dessus)
 *
 */
.textearticle {
	clear:both;
	margin: 10px 25px 0px 25px;
	
	color: black; 
	
	text-decoration: none;
	white-space: normal;
	font-weight: normal;
	
}

/*
 * Les paragraphes:
 *	- on indente la première ligne
 *	- on spécifie la taille des caractères

.textearticle p {
	text-indent: 25px;
	font-size: 82%;
}

.textearticle blockquote p {
	text-indent: 0;
}

.textearticle .cancel-text-indent p {
	text-indent: 0;
} */

.textearticle ul, .textearticle ol {
	/* font-size: 82%; */
	margin-right:40px;
	margin-left:0;
	overflow: auto;
}


/*
 * Sinon on se retrouve avec des 82% de 82%...
 * font-size herite de la valeur calculée
 */
.textearticle ul ul, .textearticle ol ol {
	font-size: inherit;
	margin-left: 0;
}

/*
 * pour corriger le text-indent qui décale aussi
 * les images alignées à gauche dans les paragraphes 
 */
.textearticle p .spip_documents_left img {
	/* margin-left: -25px; */
}


/*
 * La taille des caractères dans les tables SPIP
 * (les tables générées par SPIP ne sont pas dans
 * des paragraphes)
 */
.textearticle table.spip {
	font-size:82%;
}

/*
 * Lorsqu'un paragraphe se retrouve dans un tableau généré par
 * spip on n'applique pa une taille de 82% (sinon ça ferait 82% de 82%)
 * et on garde le même text-indent que le conteneur.
 * 
 * Cette situation peu se produire notamment quand on veut mettre un
 * élement dans le tableau entre div, alors pour être correct et s'éviter
 * des problème il faut mettre les balises div entre <html></html> et dans ce cas
 * spip génère des paragraphe, y compris dans un tableau spip où il ne générère pas 
 * de paragraphe habituellement.
 * 
 * C'est pourquoi on mis aussi 0 de padding et de margin pour ne pas ajouter
 * d'espacements supplémentaires (il faut que ça apparaisse comme s'il
 * n'y avait pas eu de bloc <p> ajouté.
 *
 */
.textearticle table.spip p {
	font-size:inherit;
	text-indent: inherit;
	margin:0;
	padding:0;
}


.textearticle table.programme p {
  margin : 0 0 .7em 0
}

/*
 * Styles pour la liste des articles des rubriques
 */

/*
 * Les titres des sections (articles récents et articles anciens)
 */
#articles_recents .titre_section,
#articles_anciens .titre_section {
	font-size: 162%;
}


/*
 * Les artciles anciens sont regroupés par année.
 * Style pour l'écriture de l'année
 */
#articles_anciens .anneeregroupement {
	font-weight: bold;
	font-size: 96%;
	color: black;
}

/*
 * Style des lien vers les articles (titre des articles)
 */
#articles_recents a ,  #articles_anciens a{
	border:none;
	text-decoration: none;
	font-size: 82%;
	color: var(--ajeuegal-bordeau);
}

/*
 * Les dates qui sont écrites
 * à côté des titres des articles dans la liste
 */
.date_article_dans_liste {
	color: black;
	font-size: 77%;
	margin-left: 10px;
}




#articles_recents ul, #articles_anciens ul {
	margin-top:0px; /* supprime la marge entre la liste et l'année */
	padding-top:0px;
	list-style-type: none;
}


/*****************************************
 ****** Styles pour la ligne du bas ******
 *****************************************/

/*
 * Le logo  est aligné à droite, on met une marge
 * en dessous pour l'écarter avec la ligne des liens
 */
#logo-aje-bas {
	clear: both;
	float:right;
	margin: 0 0 10px 0;
}

/*
 * La ligne du bas est la dernière de la page.
 * Le padding bottom sert à décoller la ligne du bas de fenêtre.
 *
 * ne peut pas être remplacé par un margin bottom car ce dernier
 * décolle bien le texte du bas de la fenêtre mais n'agrandi pas
 * le bloc en conséquence et on se retourve une bande de la couleur
 * de fond de la fenêtre
 */
#lignedubas {
	clear:both;
	text-align: center;
	font-size:77%;
	padding: 0 0 10px 0;
	margin:0;
	color: black;
}
#lignedubas a {
	color: #cc3383;
	text-decoration: none;
	border: none;
}
#lignedubas a:hover {
	color: #6b0b47;
}

/*****************************************
 **** Fin Styles pour la ligne du bas ****
 *****************************************/




/*********************************
 ****** Apparence des liens ******
 *********************************/

.textearticle a,  #blocgauche a, #blocdroit a {     
	color : var(--ajeuegal-bordeau);
	/* text-decoration: none; */
	border:none;
}

/* Pour les spip_ancres et les spip_notes
 * pas de bordure  */
a.spip_ancre, a.spip_notes {
	border:none;
} 


/*
 * Aucune bordure autour
 * des liens dans les galeries d'image et des documents de SPIP
 */
.highslide-gallery a, .spip_documents a {
	border:none;
}

/*********************************
 **** Fin apparence des liens ****
 *********************************/


/*********************************
 ***** Apparence des tables ******
 *********************************/


/*
 * Style des tables générées par spip
 */
table.spip {
	max-width: 99%;
	margin: 0 auto 1em auto;
	border-collapse: collapse;
	border-spacing: 0;
	line-height: normal;
}

/*
 * Légendes des tables spip
 */
table.spip caption {
	caption-side: top;
	text-align: center;
	margin: .2em auto;
	font-weight: bold;
}

/*
 * Première ligne (TOUS les élements de la première
 * ligne ont été mis entre double accolades)
 */
table.spip tr.row_first {
	background: #FFC;
}

/*
 * Les cellules des tableaux spip
 */
table.spip th, table.spip td {
	padding: 0.20em 0.40em;
	text-align: left;
	border: none;
}
table.spip th {
	vertical-align: bottom;
	text-align:center;
	font-weight: bold;
}
table.spip td {
	vertical-align: top;
}


/*
 * Couleur de fond pour les lignes impaires des tables
 */

tr.row_even {
	background-color: var(--ajeuegal-creme2-bg);
}

/*
 * Couleur de fond pour les lignes paires des tables
 */
tr.row_odd {
	background-color: var(--ajeuegal-creme1-bg);
}


/*********************************
 *** Fin Apparence des tables ****
 *********************************/




/*
 *  Les styles suivants sont spécialement pour les pages du journal
 *	.Journal-Section 		: classe pour les sections (bloc de plusieurs articles)
 *	.Journal-Titre-Section		: classe pour les titres de section
 *	.Journal-sousTitre-Section	: classe pour les sous-titres de titre de section, ne pas utiliser sans .Journal-Titre-Section juste avant
 *	.Journal-Titre-Article 		: classe pour le titre d'un article
 *	.Journal-sousTitre-Article 	: classe pour le sous-titre d'un titre d'article,  ne pas utiliser sans .Journal-Titre-Article juste avant
 *	.Journal-Titre-sousArticle	: classe pour un titre à l'intérieur d'un article
 *	.Journal-sousTitre-sousArticle	: classe pour le sous-titre d'un titre à l'intérieur d'un article
 *	.Journal-TitreSecondaire-sousArticle: pour faire des petits titres séparateurs
 *
 */


.Journal-Section {
	clear:both;
	margin:10px 0 10px 0;
	padding:0 20px 0 20px; /* une section est un peu éloignée du bord sur la gauche (largeur plus petite) */
	background-color: var(--ajeuegal-creme2-bg);
}



/* Les propriétés d'affichage des carcatères communes
 * aux titres et sous-titres de section, d'article ou sous-article */
.Journal-Titre-Section,
.Journal-sousTitre-Section,
.Journal-Titre-Article,
.Journal-sousTitre-Article,
.Journal-Titre-sousArticle,
.Journal-sousTitre-sousArticle,
.Journal-TitreSecondaire-sousArticle
{
	text-align: left;
	margin:0 0 10px 0; /* la marge bottom sert à éloigner le texte du titre ou sous-titre
                            * margin-left est modifié dans la suite ensuite pour les "sousarticle" */
	padding:0;
}


/* Les sous-titres sont remontés un peu pour coller au titre
 * Pour cette raison les sous titres doivent être utilisés
 * seulement juste après un titre, sinon ils seront trop près
 * du texte qui précéde
 */
.Journal-sousTitre-Section,
.Journal-sousTitre-Article,
.Journal-sousTitre-sousArticle  {
	margin-top: -10px; /* On annule le margin-bottom 
	                    * du titre pour rapprocher le sous-titre du titre */
}


/* Propriété communes aux titres et sous-titres des sections */
.Journal-Titre-Section,
.Journal-sousTitre-Section {
	clear: both;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: var(--ajeuegal-bordeau);
	margin-left:-20px; /* on rabat le bloc de titre de section vers la gauche
                              pour aligner le bord gauche avec les titres des articles hors section */
	padding: 0 0 0 10px; /* Le titre lui-même est décalé vers la droite en ajoutant un padding à gauche */
}

.Journal-Titre-Section {
	font-size:200%;
}

.Journal-sousTitre-Section {
	font-size:150%;
}





/* Propriété communes aux titres et sous-titres des articles */
.Journal-Titre-Article,
.Journal-sousTitre-Article {
	clear: both;
	color: #ff7200; 
}

.Journal-Titre-Article {
	font-size:151%;
}

.Journal-sousTitre-Article {
	font-size:139%;	
}


/* On réduit la taille d'un titre d'article lorsqu'il
 * se trouve dans une section */
.Journal-Section .Journal-Titre-Article {
	font-size:139%;
}

/* On réduit la taille d'un sous-titre d'article lorsqu'il
 * se trouve dans une section */
.Journal-Section .Journal-sousTitre-Article {
	font-size:127%;
}

/*
 * Propriétés communes aux titres, sous-sitres et titres secondaires
 * à l'intérieur d'un article.
 *
 * Remarque; pour les titres, sous-titres et titres secondaires
 * sous article on applique pas la prioriété clear:both, on ne revient pas
 * nécessairement à ligne après un float (left), en général
 * c'est quand on a inséré une image alignée à gauche: les titres,
 * sous-titres et titres secondaires sous article reste sur le côté de l'image
 */
.Journal-Titre-sousArticle,
.Journal-sousTitre-sousArticle,
.Journal-TitreSecondaire-sousArticle
{
	clear:none;
	margin-left: 15px;	/* on met une marge à gauche pour décaler les titres */
	font-style:italic;
	color:black;
}



.Journal-Titre-sousArticle {
	font-size:121%;
}

.Journal-sousTitre-sousArticle {
	font-size:112%;

}

.Journal-TitreSecondaire-sousArticle {
	margin-top:1.5em;
	font-size:100%;
		font-weight: bold;
}

/* SPIP rajoute des balises <p></p> autour des textes mis
 * entre [div-class="..."][/div-class]met les texte qui est indiqué.
 * Les marges et padding étant définis dans les classes des div,
 * on supprime toutes les marges de <p>
 * De la même façon la taille des caracrères est définie dans
 * les classes des div,on met juste 100% dans le <p> pour ne
 * pas modifier cette taille. 
 */
.Journal-Titre-Section > p, .Journal-sousTitre-Section > p,
.Journal-Titre-Article > p, .Journal-sousTitre-Article > p,
.Journal-Titre-sousArticle > p, .Journal-Titre-sousArticle > p,
.Journal-sousTitre-sousArticle > p, .Journal-sousTitre-sousArticle > p,
.Journal-TitreSecondaire-sousArticle > p {
	margin:0;
	padding:0;
	text-indent:0;
	font-size:100%;
}




.signature {
	clear:both;
	text-align:right;
	margin-bottom:0 0 1.9em 0;
	padding:0;
}


.Journal-note {
	font-size: 85%;
}

.Journal-note a.spip_ancre {
	vertical-align: baseline;
	font-size: 100%;
}

/******************************************************************
 *  Fin des styles pour le journal
 ******************************************************************/



/****************************************
 ****   Styles divers et de spip     ****
 ****************************************/


/*
 * Pas de bordure autour des images
 */
img, .spip_logos {
	margin: 0;
	padding: 0;
	border: none;
}

/*
 * Listes énumérées
 */
ol {
	list-style: decimal;
}

/*
 * les balise h3 de classe spip sont générées par spip à
 * partir du raccourci avec les trois accolades
 */
h3.spip {
	font-size:1em;
	text-align: center;
	font-weight:bold;
	color: black;
	border-bottom:1px dotted #474747;
	padding-bottom: 3px;

	margin:0 25% 10px 25%;
}


/* 
 * Raccourci <quote> de SPIP
 */
blockquote.spip {
	margin: 2em 0;
	padding-left: 1em;
	border-left: 0.30em solid;
}

/*
 * Raccourci <poesie> de SPIP
 */
blockquote.spip_poesie {
	margin: 2em 0;
	padding-left: 1em;
	font-family: Garamond, Georgia, Times, serif; 
	font-size: 82%;
}

/*
 * Raccourcis <code> et <cadre> de SPIP
 */
.spip_code, .spip_cadre {
	font-family: Courier, "Courier New", monospace;
	color: #036;
}
.spip_cadre {
	width: 80%;
	font-size: 82%;
	background-color: #F4F8F8;
	border: 1px inset;
}

/*
 * Les documents de SPIP
 */

.spip_documents {
	text-align: center;
	line-height: normal;
}
.spip_documents p {
	margin: 0.10em;
	padding: 0;
}
.spip_documents_center {
	display: block;
	clear: both;
	width: 100%;
	margin: 10px auto;
	padding:0;
}
.spip_documents_left {
	float: left;
	padding:0;
	margin: 10px 10px 10px 0;
}
.spip_documents_right {
	float: right;
	margin-left: 15px;
	text-indent:0;
	margin: 10px 0 10px 10px;
	padding:0;
}
.spip_doc_titre {
	margin-right: auto;
	margin-left: auto;
	font-weight: bold;
	font-size: 0.90em;
}
.spip_doc_descriptif {
	clear: both;
	margin-right: auto;
	margin-left: auto;
	font-size: 0.90em;
}


/*
 * Quand on veut explicitement commencer un paragraphe
 * sans être décalé par les images qui précèdent
 * on écrit <hr class="alaligne"> sur une liegn isolée
 * juste avant (laisser un ligne vide)
 */
hr.alaligne {
	clear: both;
	visibility: hidden;
}

/*
 * Les éléments surlignés par SPIP
 */
.spip_surligne {
	background: #FF6;
}



.spip_doc_titre {
	font-size: 82%
}

hr.spip { margin: 2em auto; }


/*
 * ???????? 
 */
.spip_modele {
	float: right; 
	display: block; 
	padding: 1em; 
	border: 1px solid; 
	width: 180px;
}

ul li {
	list-style-image: url(../images/puce.gif);
	margin-top:10px;
}





/**************************************
 *
 * BOITE À IDÉE
 *
 **************************************/

.aje_forum .message-formulaire {
	width: 75%;
	margin: 0  auto;
}

.aje_forum .message-aje, .aje_forum .message-formulaire fieldset.previsu .forum-message {
	margin: 20px auto 0px auto; /* top right bottom left*/
	width: 50%;
	min-height:80px;
	padding: 0px 0 1px 70px;
	background: var(--ajeuegal-creme2-bg) url('images/ampoule_idee_pt.png') no-repeat left top;
}

.aje_forum .message-formulaire .previsu > ul {
	margin: 0;
	padding:0;
}

.aje_forum .message-aje-titre, .aje_forum .message-formulaire ul.previsu .forum-chapo a {
	font-weight: bold;
	color: var(--ajeuegal-orange-bg) ;
	font-size: 115%;
	text-decoration: none;
}


.aje_forum .message-aje-texte, .aje_forum .message-formulaire ul.previsu .forum-texte {
	font-size: 82%;
	color: black;
}

.aje_forum .message-formulaire fieldset.previsu .forum-message {
	width: 67%;
}

.aje_forum .message-formulaire fieldset {
	margin:0 auto;
	padding:0;
}

.aje_forum .message-formulaire fieldset > p {
	padding-left: 40px;
}

.aje_forum .message-formulaire fieldset > legend {
	margin-left:10px;padding: 0 5px;
	font-weight:bold;
	font-size: 88%;
}


.aje_forum .message-formulaire fieldset.previsu {
	border: 2px dashed red;
	
}

.aje_forum .message-formulaire fieldset.previsu .forum-message .forum-chapo small{
	display: none;
}

.aje_forum .message-formulaire fieldset.previsu > legend {
	color: white;
	background: red;
}

.aje_forum .message-formulaire fieldset ul, .aje_forum .message-formulaire fieldset li {
	list-style:none;
}

.aje_forum .message-formulaire fieldset.previsu p.boutons {
	text-align: center;
	margin-top: 20px;
}

.aje_forum .message-aje-titre, .aje_forum .message-formulaire ul.previsu {
	padding:0;
}

.aje_forum .message-formulaire fieldset .saisie_titre label,
.aje_forum .message-formulaire fieldset .saisie_titre span,
.aje_forum .message-formulaire fieldset .saisie_texte label,
.aje_forum .message-formulaire fieldset .saisie_texte span,
.aje_forum .message-formulaire fieldset .saisie_session_nom,
.aje_forum .message-formulaire fieldset .saisie_session_email,
.aje_forum .message-formulaire fieldset .saisie_session_nom,
.aje_forum .message-formulaire fieldset .explication
{
	font-size:77%;
}

.aje_forum .message-formulaire fieldset ul .saisie_texte label,
.aje_forum .message-formulaire fieldset ul .erreur span {
	display: block;
}

.aje_forum .message-formulaire fieldset ul .saisie_texte .explication {
	display:none
}

.ombre img {
	border: 5px solid white;
	-moz-box-shadow: 0 0 7px var(--ajeuegal-bordeau); 
	-webkit-box-shadow: 0 0 7px var(--ajeuegal-bordeau); 
	box-shadow: 0 0 7px var(--ajeuegal-bordeau);
}

.histo {
  width: 100%;
  text-align: left !important;
  border-collapse : collapse ;
}

.histo th {
	color : #0090C0 ;
	text-align : center ;
}

.histo td {
	width: 33%;
	vertical-align : top ;
	padding: 0 0.5em 0.5em 0.5em
}

.histo td:not(:last-child) {
	border-right : 1px solid var(--ajeuegal-rose) ;
}

.histo td:not(:first-child) {
	border-left : 1px solid var(--ajeuegal-rose) ;
}

.histo td:not(:first-child) br {
	margin-bottom : 1em ;
}

.histo .date {
  text-align: center;
  font-size: 120%;
  background-color: var(--ajeuegal-orange-bg);
  color: white;
  font-weight: 900;
}

.histo .details {
  text-align: center;
  font-size: 90%;
  /* color: white; */
  padding-bottom: 1em;
}

.histo .details span {
	background-color: var(--ajeuegal-creme1-bg);
	border: 1px solid var(--ajeuegal-rose);
	padding: 0.2em 1em ;
	border-radius: 0.4em;
}

.histo .details span a {
	font-weight : 900 ;
}

.histo .date td {
  border-top: 2px solid #ff0021;
}

.histo td:not([colspan="3"]) img {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.histo td:not([colspan="3"]) figure {
  margin: 0;
  padding: 0;
}

.histo td:not([colspan="3"]) legend {
  padding: 0;
}

.histo td[colspan="3"]:has(figure) {
	padding-top: 2em;
}