:root{
/* Gestion des couleurs et variables */
/* Thèmes de couleurs *
*    --couleur_base-1 : menus et icones
*    --couleur_base-2 : textes et liens
*    --couleur_base-3 : Bordures et lignes
*    --couleur_base-4 : Fonds
*/
    
    /*Couleurs Logo CBAP */
    --couleur_cbap-1 : #eb7b04;
    --couleur_cbap-2 : #526a04;
    --couleur_cbap-3 : #04345c;
    --couleur_cbap-4 : #950d0f;
    
    /*Couleurs terre */
    --couleur_base-1 : #849324;
    --couleur_base-2 : #6f4415;
    --couleur_base-3 : #6b5c3e;
    --couleur_base-4 : #6b5c3e;
    
      
    
    
    /* déclinaison de la palette */
    
     --couleur_dark-1 : hsl(from var(--couleur_base-1) h calc(s - 15) calc(l - 10));
     --couleur_dark-2 : hsl(from var(--couleur_base-2) h calc(s - 15) calc(l - 10));
     --couleur_dark-3 : hsl(from var(--couleur_base-3) h calc(s - 15) calc(l - 10));
     --couleur_dark-4 : hsl(from var(--couleur_base-4) h calc(s - 25) calc(l - 25));

     --couleur_light-1 : hsl(from var(--couleur_base-1) h calc(s + 10) calc(l + 15));
     --couleur_light-2 : hsl(from var(--couleur_base-2) h calc(s + 10) calc(l + 15));
     --couleur_light-3 : hsl(from var(--couleur_base-3) h calc(s + 10) calc(l + 15));
     --couleur_light-4 : hsl(from var(--couleur_base-4) h calc(s + 10) calc(l + 15));
    
    --level0_background : hsl(from var(--couleur_base-4) h calc(s - 30) calc(l + 40));
    --level1_background : hsl(from var(--couleur_base-4) h calc(s - 40) 180 );
    --level2_background : hsla(from var(--couleur_base-4) h calc(s - 40) calc(l + 20) / 35%);
    --level3_background : hsla(from var(--couleur_base-4) h calc(s - 40) calc(l + 20) / 75%);
 
    --liste_background : linear-gradient(to right, var(--ombre-claire-color) 66%, transparent);
    --text_color : var(--couleur_dark-2);
    --link_color : var(--couleur_base-2);
    --link_underline : var(--couleur_light-2);
    
    --menu_color : var(--couleur_base-1);
    --button_color : var(--couleur_dark-1); /*ajuster en fonction du contraste*/
    --valider : darkolivegreen;
    --annuler : firebrick;    

    --titre_color : var(--couleur_cbap-1); 
    --slogan_color : #000;
    --bzh_color : #000;
    --h1_color : #000;
    --h2_color : #000;
    --h3_color : #000;
    --h4_color : #000;

    --actif_color: #232220;
	--inactif_color: #88816d;
    --administration_color: rgba(20,20,20,0.2);
	
    --link_background : var(--couleur_light-3);
    --menu_background : #000;
    --blur : blur(0.5rem);
    
    /*bordures*/
    --ombre-claire-color: hsla(from var(--couleur_base-4) h calc(s + 20) calc(l + 45) / 55%);
    --ombre-sombre-color : hsla(from var(--couleur_base-4) h calc(s - 20) calc(l - 25) / 35%);
   --ombre-legere-claire: 1px 1px var(--S) var(--ombre-claire-color);
   --ombre-legere-sombre: 1px 1px var(--S) var( --ombre-sombre-color);
   --ombre-claire: var(--XS) var(--XS) var(--M) var(--ombre-claire-color)
   --ombre-sombre: var(--S) var(--S) var(--M) var(--ombre-sombre-color);
    
    
   --border-light : 1px solid hsla(from var(--couleur_light-3) h s calc(l + 15) / 75%);
   --border-dark : 1px solid var(--couleur_dark-3);
   --border-radius : 0.5rem;
   --border-diapo : 0 1px 1px 0;  
   --border-image-fluide: linear-gradient(to right, var(--couleur_dark-3), var(--level1_background)) 1;

    /* Gestion des polices */
    --font-family-base: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;  
    --font-family-heading: var(--font-family-base);
    
    font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */

    
     /* Tailles de police  */
    --font-size-base: 1rem;
    
    --font-size-xs: calc(var(--font-size-base)* 0.75);
    --font-size-sm: calc(var(--font-size-base)* 0.875);
    --font-size-md: calc(var(--font-size-base)* 1.1);
    --font-size-lg: calc(var(--font-size-base)* 1.25);
    --font-size-xl: calc(var(--font-size-base)* 1.5);
    --font-size-2xl: calc(var(--font-size-base)* 2);
    --font-size-3xl: calc(var(--font-size-base)* 3);

    /* Poids de police */
    --font-weight:100;
    --font-weight-light: calc(var(--font-weight)*3);   
    --font-weight-normal: calc(var(--font-weight)*4);
    --font-weight-medium: calc(var(--font-weight)*5);
    --font-weight-semibold: calc(var(--font-weight)*6);
    --font-weight-bold: calc(var(--font-weight)*7);
    

    /* Hauteur de ligne */
    --line-height :1;
    --line-height-tight: calc(var(--line-height)* 1.25);
    --line-height-base: calc(var(--line-height)* 1.5);
    --line-height-relaxed: calc(var(--line-height)* 1.6);

    
    /*Espacements et dimensions diverses */
    --L: 1rem;  
    --XXL: calc(var(--L)* 3);
    --XL: calc(var(--L)* 2);    
    --M: calc(var(--L)* 0.8);
    --S: calc(var(--L)* 0.5);
    --XS: calc(var(--L)* 0.2);
    
    --vignette-galerie : 150px;
    --vignette-illustration : 300px;
   /* --taille-galerie :calc( var(--vignette-galerie) * 2 );*/
    --taille-icones : 48px;

 --transition_fast : 0.4s;
 --transition_slow : 0.8s;
    
    --mask-sprite : url("/squelettes/css/img/sprite_cbap-min5.svg");

}

/*initialisation*/
@supports (font-variation-settings: normal) {
  :root { font-family: InterVariable, sans-serif; }
}

/*viewport en CSS*/
@-webkit-viewport { zoom: 1; width: device-width;}
@-moz-viewport { zoom: 1; width: device-width;}
@-ms-viewport { zoom: 1; width: device-width;}
@-o-viewport { zoom: 1; width: device-width;}
@viewport { zoom: 1; width: device-width;}


@font-face {
  font-family: 'cbap';
  src: url('font/cbap.eot?#iefix') format('embedded-opentype'),  url('font/cbap.woff') format('woff'), url('font/cbap.ttf')  format('truetype'), url('font/cbap.svg#cbap') format('svg');
  font-weight: normal;
  font-style: normal;
}


html, body { height: 100%; scroll-behavior: smooth;} 
body, div, ul, li { margin: 0; padding: 0; border: 0;}


body {
	font-family: var(--font-family-base);
	font-size: var(--font-size-base);
	font-weight:var(--font-weight-light);
	line-height: var(--line-height-base);
	color: var(--text_color);
	background: transparent;
}



body > div:first-of-type {
	display: table;
	height: 100%;
	width: 100%;
}

.none {display:none !important;}
.separateur {clear: both;}
.ligne {
	border-top: 1px solid var(--couleur_light-3);
	padding: var(--M) 0;
	margin-top: var(--M);
}

hr {
  border: 0;
  height: 1px;
  padding: 0;
  clear: both;
}

.ligne {
	border-top: 1px solid var(--couleur_light-3);
	padding: var(--M) 0;
	margin-top: var(--M);
}

hr.ligne {
  border: 0;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  clear: both;
}

hr.spacer {
    margin-bottom: var(--M);    
  clear: both;
}

ul {list-style: none;}

a, a:hover { 
    color: var(--link_color);
    text-decoration: underline var(--link_underline) 1px;
    transition: all var(--transition_fast);

}
a:hover{
    filter: brightness(1.8);
}

/*conserver les images au bon ratio */
img {
	max-width: 100%;
	height: auto;
}

iframe {
	max-width: 100%;
}
/*titrage*/
h1, h2, h3 {    font-family: var(--font-family-heading) ;
}
h1 {
	font-size: var(--font-size-xl);
	font-weight: var(--font-weight-semibold);
	line-height: var(--line-height-tight);
	color: var(--h1_color);
	margin: var(--L) 0 var(--S) 0;
	text-transform: uppercase;
	border-bottom: var(--border-dark);
	border-image: var(--border-image-fluide);
}

h2 {
    font-size: var(--font-size-lg) ;
    font-weight: var(--font-weight-semibold) ;
    line-height: var(--line-height-tight) ;
    color: var(--h2_color) ;
    margin: var(--L) 0 var(--XS) 0 ;
}

h3 {
    font-size: var(--font-size-md) ;
    font-weight: var(--font-weight-semibold) ;
    line-height: var(--line-height-tight) ;
    color: var(--h3_color) ;
}

h4 {
    font-size: var(--font-size-base) ;
    font-weight: var(--font-weight-semibold) ;
    line-height: var(--line-height-tight) ;
    color: var(--h4_color) ;
    margin: var(--XS) 0 ;
}

/* style des titres bilingues, séparés par un slash '/' dans le texte */

h1 span, h2 span, h3 span, h4 span, h5 span, .lire span {
	color: var(--couleur_dark-1);
	font-style: italic;
	margin: 0;
	display: block;
	font-weight: initial;
}


/* Mise en page générale, commun à toutes les pages*/

button, boutons {
	margin: 0;
	padding: 0;
	border: 0;
}

#debut {
	margin: 0;
}
#page {position: relative;}

#page section {
	margin-bottom: var(--XL);
	background-color: var(--level1_background);
	padding: var(--L);
	border: var(--border-light);
	box-shadow: var(--ombre-legere-sombre);
	border-radius: var(--border-radius);
    position: relative;
}


#page:has(div.navigation) section:first-of-type {
	margin-top: var(--L);
}

/*éviter le dépassement des images flottantes*/
#page section div img {
    overflow: hidden;
}

.rubrique #page .edito {
	border: none;
	box-shadow: none;
    }
.navigation:first-of-type {margin-top: var(--XL);}
   
.navigation.retour{display:none;margin-top: var(--XL);}
    
    
section.rubrique .item nav.ancre {
	margin-top: var(--nav-margin);
}
section.rubrique > h2 {	display: flex;}
section.rubrique > h2::before {
	content: "";
	mask-image: var(--mask-sprite);
	font-size: 0;
	background-color: var(--button_color);
	width: var(--XL);
	height: var(--XL);
	mask-size: var(--XL);
	mask-position: 0 calc(var(--XL)*-31); /*repertoire*/
	border: 0;
	margin-right: var(--S);
	display: inline-block;
    }

#logo_cbap::before, #installer_pwa > div::before {
    content:'';
    display:block;
	width: calc(var(--taille-icones)*3);
	height:calc(var(--taille-icones)*3);
	background-image: url("img/logoCBAP-min.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
p {	margin-top: 0;}

.conteneur_haut {
	width: 100%;
	display: grid;
	align-content: center;
	align-items: center;
	justify-items: center;
	justify-content: center;
	overflow:hidden;
}

div.conteneur_haut > div > div {
	display: table-cell;
	vertical-align: middle;
	height: 100%;
}
.conteneur_haut span {
	display: block;
	padding-left: var(--L);
}

.slogan {
	font-size: var(--font-size-2xl);
	font-family: cbap,sans-serif;
	line-height: 1;
	color: var(--slogan_color);
	text-shadow: var(--ombre-legere-claire);
}
.titre_site {
	font-size: var(--font-size-3xl);
	font-family: cbap,sans-serif;
	line-height: 1;
	color: var(--titre_color);
	text-shadow: var(--ombre-legere-sombre);
}


/*reseaux*/
.reseau {
	float: right;
   /* margin-top: -1rem;*/
}


#reseaux {
	height: 0;
	text-align: center;
	position: absolute;
	padding: 1rem;
	margin: 1rem;
	right: 0;
	top: 0;
}

#reseaux.administration[name] {
    height: auto;
}


.item .reseaux {
	/* float: none; */
	grid-column: span 3;
}
.socialtags img { 
	height: 1.5rem;
}
.socialtags-hovers {
	opacity: .6;
}

#reseaux .m29 {
	/* height: auto; */
	/* margin: auto; */
	width: 100%;
}
#reseaux button, .bouton-ligne button,  .bouton-ligne a {
	display: flex;
	/* height: var(--taille-icones); */
	/* border: 1px solid red; */
	/* width: auto; */
	align-items: center;
	margin: auto;
}

.edition button {
	display: flex;
	align-items: center;
    padding:0;
}
.edition .dropfilebutton.bigup-btn {
	display: initial !important;
}

/* Page d'accueil div class=sommaire */
#accueil {
	background-color: #011c35;
	background-repeat: no-repeat;
	height: 100%;
	width: 100%;
	background-position: top;
	-webkit-background-size: cover;
	background-size: cover;
	position: fixed;
	z-index: -1;
	background-image: url("img/fond_0_web.jpg");
}

.sommaire .conteneur_haut {
	min-height: 100vh;
	height: 100%;
	margin-bottom: var(--XL);
	background: none;
}

.sommaire .conteneur_haut > div:first-of-type {
/*	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;*/
}


.sommaire .titre_site {
	font-size: calc(var(--font-size-3xl)*1.5);
}

.sommaire #logo_cbap::before {
	width: calc(var(--taille-icones)*5);
	height: calc(var(--taille-icones)*5);
}
.sommaire .slogan {
	font-size: var(--font-size-3xl);
}
#splash {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: calc(100% - 6em);
	cursor: pointer;
}

/*PWA */

#installer_pwa {
	z-index: 1;
	bottom: 0;
	left: 0;
	text-align: center;
	position: fixed;
	margin: 0;
	display: none; 
	cursor: pointer;
	background-color: transparent;
	backdrop-filter: var(--blur);
	border: 0;
	width: 100%;
	padding: var(--S);
}



#installer_pwa > div::before {
    display:block;
	width: calc(var(--taille-icones)*1);
	height:calc(var(--taille-icones)*1);
}

#installer_pwa > div {
	display: flex;
	/* flex-direction: row; */
	flex-wrap: wrap; 
	justify-content: center;
	align-items: center;
	gap: var(--L);
}


#pwaHelp {
	flex-basis: 100%;
}

/*pages internes rubriques et articles */

.conteneur_haut {
	background-image: url("img/fond_0_pages.jpg");
	background-repeat: no-repeat;
	height: 180px;
	background-position: bottom;
	webkit-background-size: cover;
	background-size: cover;
}


.item {
	/* border: var(--border-light); */
	display: grid;
	grid-template-columns: 0 calc( var(--vignette-illustration) + ( var(--S) * 2) ) 2fr;
	margin-top: var(--S); 
	/* padding: 0.5em; */
}

.item > div:first-of-type {
	border-right: var(--border-dark);
	padding-right: var(--L);
	max-width: calc( var(--vignette-illustration) + ( var(--S) * 2) );
}

.item > div:nth-of-type(2) {
	margin-left: var(--L);
}


.item div {
	word-wrap: anywhere;
    /*display : inline-block;*/ 
}
/*Plan*/
/*.plan details div {margin-left: var(--L);}
.plan .rub {margin-left: calc(var(--L) * 1.2);}
*/
.plan details > *, .plan details li, #contenu_edit summary.m38 {
	margin-left: var(--XL);
}
.plan details a {text-decoration:none;}

summary.hasicone {
	position: relative;
	list-style: none;
	line-height: calc(var(--taille-icones) * 0.5);
	font-weight: var(--font-weight-semibold);
	margin-bottom: var(--S);
}
 
/* summary.m32::before{ mask-position: 0 calc(var(--taille-icones)*-32*0.75);}*/	/*blanc*/
 summary.m38::before{ mask-position: 0 calc(var(--taille-icones)*-38*0.5);}	/*plus*/
 summary.m39::before{ mask-position: 0 calc(var(--taille-icones)*-39*0.5);}	/*moins*/

 summary.hasicone::before, .m36 p.boutons::before {
	content: "";
	
	mask-image: var(--mask-sprite);
	background-color: var(--button_color);
    width: calc(var(--taille-icones) * 0.5);
	height: calc(var(--taille-icones) * 0.5);
	mask-size: calc(var(--taille-icones) * 0.5);
	border: 0;
	position: absolute;
	left: calc(var(--taille-icones) * -0.5);
	top: 0;
	font-size: 0;
	cursor: pointer;
}
details:not(:open) summary.m32 {
 /* mask-position: 0 calc(var(--taille-icones)*-38*0.75);*/
}

.plan details[open]>summary.m38::before {
 /* mask-position: 0 calc(var(--taille-icones)*-39*0.5);*/
}
details[open]>summary.m38::before {
  mask-position: 0 calc(var(--taille-icones)*-39*0.5);
}

/*menu et boutons*/
/* #conteneur_menu : contient le menu, en dessous du bandeau */
#conteneur_menu {
	position: sticky;
	top: 0px;
	width: 100%;
	opacity: .99;
	text-align: center;
	z-index: 100;
}
 
#conteneur_menu::before {
	content: "";
	backdrop-filter: var(--blur) !important;
	-webkit-backdrop-filter: var(--blur)  !important;
	mask: linear-gradient(black 60%,transparent);
	width: 100%;
	height: 3rem;
	display: block;
	position: absolute;
}



 
 
.menuder, .menuder ul{
padding:0;
margin:0;
list-style:none;
text-align:center;
}

.menuder li {
	display: inline-block;
	position: relative;
	padding: var(--XS) auto;
}



.menuder > li {
	width: calc(1024px/11);
	display: flex;
	align-items: flex-start;
	/* justify-content: inherit; */
	/* align-content: center; */
}

.menuder ul li{
display:inherit;
border-top:1px #dfcfa1 solid;
margin: var(--XS);
}

.menuder li:hover ul{
max-height:20em;
}


.menuitem button {
    background-color: transparent;
    border: 0;
    color: var(--menu_color);
}

.menuitem button:hover {
    filter: brightness(50%); -webkit-filter: brightness(150%); -moz-filter: brightness(150%); -o-filter: brightness(150%); -ms-filter: brightness(150%);
cursor: pointer;

}
.menuitem button:before {
    content:"";
    mask-image: var(--mask-sprite);
    font-size: 0;
    background-color: var(--menu_color);
    width: var(--taille-icones);
    height: var(--taille-icones);
    border: 0;
    margin: auto;
    display: block;
    	mask-size: var(--taille-icones);

}

#menu_bar {
    background-color: var(--menu_background) ;
}

.switch.menuder {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    min-height: 3rem;
    max-width: 1024px;
    margin: 0 auto;
}
.boutons > a:before, .boutons > span:before, .recherche:has(.boutons.m24):before, .formulaire_archive_papier span:has(input.submit):before  {
    content:"";
    mask-image: var(--mask-sprite);
    font-size: 0;
    width: var(--taille-icones);
    height: var(--taille-icones);
    border: 0;
    display: block;
    mask-size: var(--taille-icones);
	background-color: var(--menu_color);
	cursor: pointer;
}

menuitem.boutons a,
.menuitem.boutons button {
   line-height:normal;
}

.boutons > a::before {
	margin: auto;
}


.boutons.m0 > a:before{ mask-position: 0 0px;}	/*home*/
.boutons.m1 > a:before{ mask-position: 0 calc(var(--taille-icones)*-1);}	/*musique*/
.boutons.m2 > a:before{ mask-position: 0 calc(var(--taille-icones)*-2);}	/*info*/
.boutons.m3 > a:before{ mask-position: 0 calc(var(--taille-icones)*-3);}	/*image*/
.boutons.m4 > a:before{ mask-position: 0 calc(var(--taille-icones)*-4);}	/*lettre*/
.boutons.m5 > a:before{ mask-position: 0 calc(var(--taille-icones)*-5);}	/*agenda*/
.boutons.m6 > a:before{ mask-position: 0 calc(var(--taille-icones)*-6);}	/*forum*/
.boutons.m7 > a:before{ mask-position: 0 calc(var(--taille-icones)*-7);}	/*sortir*/
.boutons.m8 > a:before{ mask-position: 0 calc(var(--taille-icones)*-8);}	/*recherche*/
.boutons.m9 > a:before{ mask-position: 0 calc(var(--taille-icones)*-9);}	/*poubelle*/
.boutons.m10 > a:before{ mask-position: 0 calc(var(--taille-icones)*-10);}	/*ajouter aricle*/
.boutons.m11 > a:before{ mask-position: 0 calc(var(--taille-icones)*-11);}	/*ajouter rubrique*/
.boutons.m12 > a:before{ mask-position: 0 calc(var(--taille-icones)*-12);}	/*crayon plus*/
.boutons.m13 > a:before{ mask-position: 0 calc(var(--taille-icones)*-13);}	/*lien*/
.boutons.m14 > a:before{ mask-position: 0 calc(var(--taille-icones)*-14);}	/*croix fermer*/
.boutons.m15 > a:before{ mask-position: 0 calc(var(--taille-icones)*-15);}	/*enregistrer*/
.boutons.m16 > a:before{ mask-position: 0 calc(var(--taille-icones)*-16);}	/*lien petit*/
.boutons.m17 > a:before{ mask-position: 0 calc(var(--taille-icones)*-17);}	/*crayon petit*/
.boutons.m18 > a:before{ mask-position: 0 calc(var(--taille-icones)*-18);}	/*poubelle petit*/
.boutons.m19 > a:before{ mask-position: 0 calc(var(--taille-icones)*-19);}	/*plus menu*/
.boutons.m20 > a:before{ mask-position: 0 calc(var(--taille-icones)*-20);}	/*moins menu*/
.boutons.m21 > a:before{ mask-position: 0 calc(var(--taille-icones)*-21);}	/*fleche haut*/
.boutons.m22 > a:before{ mask-position: 0 calc(var(--taille-icones)*-22);}	/*fleche bas*/
.boutons.m23 > a:before{ mask-position: 0 calc(var(--taille-icones)*-23);}	/*archives*/
.boutons.m24 > a:before{ mask-position: 0 calc(var(--taille-icones)*-24);}	/*rechercher*/
.boutons.m25 > a:before{ mask-position: 0 calc(var(--taille-icones)*-25);}	/*Info audio*/
.boutons.m26 > a:before{ mask-position: 0 calc(var(--taille-icones)*-26);}	/*Info image*/
.boutons.m27 > a:before{ mask-position: 0 calc(var(--taille-icones)*-27);}	/*Info video*/
.boutons.m28 > a:before{ mask-position: 0 calc(var(--taille-icones)*-28);}	/*Valider*/
.boutons.m29 > a:before {mask-position: 0 calc(var(--taille-icones)*-29);}		/*annuler*/
.boutons.m30 > a:before{ mask-position: 0 calc(var(--taille-icones)*-30);}	/*connect*/
.boutons.m35 > a:before{ mask-position: 0 calc(var(--taille-icones)*-35);}	/*reseaux*/
.boutons.m36 > a:before{mask-position: 0 calc(var(--taille-icones)*-36);} /*Email*/

.boutons.m8 button:before{ mask-position: 0 calc(var(--taille-icones)*-8);}	/*recherche*/
.boutons.m15 button:before{ mask-position: 0 calc(var(--taille-icones)*-15);}	/*enregistrer*/
.boutons.m18 button:before{ mask-position: 0 calc(var(--taille-icones)*-18);}	/*poubelle petit*/
.boutons.m24 button:before{ mask-position: 0 calc(var(--taille-icones)*-24);}	/*rechercher*/
.boutons.m25 button:before{ mask-position: 0 calc(var(--taille-icones)*-25);}	/*Info audio*/
.boutons.m26 button:before{ mask-position: 0 calc(var(--taille-icones)*-26);}	/*Info image*/
.boutons.m27 button:before{ mask-position: 0 calc(var(--taille-icones)*-27);}	/*Info video*/
.boutons.m28 button:before{ mask-position: 0 calc(var(--taille-icones)*-28); background-color: var(--valider);}
.boutons.m29 button:before{ mask-position: 0 calc(var(--taille-icones)*-29); background-color: var(--annuler);}
.boutons.m30 button:before{ mask-position: 0 calc(var(--taille-icones)*-30);}	/*connect*/

.boutons.m35 button:before{ mask-position: 0 calc(var(--taille-icones)*-35);}	/*reseaux*/
.boutons.m37 button:before{ mask-position: 0 calc(var(--taille-icones)*-37);}	/*fichier*/

.boutons.m17 span:before{ mask-position: 0 calc(var(--taille-icones)*-17);}	/*crayon petit*/
.boutons.m26 span:before{ mask-position: 0 calc(var(--taille-icones)*-26);}	/*image*/
.boutons.m29 span:before {mask-position: 0 calc(var(--taille-icones)*-29); background-color: var(--annuler);}		/*annuler*/
.boutons.m36 span:before{ mask-position: 0 calc(var(--taille-icones)*-36);}	/*Email*/

.boutons.m28 > a:before{background-color: var(--valider);} 
.boutons.m29 > a:before{background-color: var(--annuler);} 

.boutons.m15 > a::before {display: inline-block;} 

#m21 button:before{ mask-position: 0 calc(var(--taille-icones)*-21);}	/*fleche haut*/
#m22 button:before{ mask-position: 0 calc(var(--taille-icones)*-22);}	/*fleche bas*/

#m21 {
	display: block;
	right: 20px;
	bottom: calc(var(--taille-icones) * 1.5);
	position: absolute;
}/*retour haut de page */

#m22 {
	display: block;
	right: 20px;
	position: absolute;
	bottom: 20px;
}/*flèche suivant */

.m36 p.boutons::before {mask-position: 0 calc(var(--taille-icones)*0.5*-36);}/*Email*/
.m28 p.boutons > ::before {	mask-position: 0 calc(var(--taille-icones)*-28);}/*Valider*/

.recherche:has(.boutons.m24):before{ mask-position: 0 calc(var(--taille-icones)*-24); cursor:auto;}	/*rechercher*/

.boutons form {
	display: flex;
	justify-content: center;
	gap: var(--XL);
}
.boutons input {
	cursor: pointer;
	background: transparent;
	border: none;
	color: #FFF;
}

p.boutons > * {
	display: flex;
	border-radius: 0.3em;
	font-size: var(--font-size-sm);
	color: white;
	text-shadow: var(--ombre-sombre);
	width: fit-content;
	margin: 0.5em auto;
	background-color: var(--menu_color);
	cursor: pointer;
	padding: 0 var(--S);
	align-items: center;
}

p.boutons a {
	color: var(--level1_background);
}


p.boutons > *:before {
    background-color: #FFF;
    margin: calc(var(--S)*-1) 0 calc(var(--S)*-1) calc(var(--S)*-1);
}

 p.boutons > .image_loading:before {
    content:none;
    
}


button.recherche {
	background: transparent !important;
	border: none;
}

.recherche {
	display: flex;
	align-items: center;
}

.recherche input {
	width: auto;
	margin-left: var(--M);
}
.recherche label {
    margin:0;
}

#input_recherche {
	width: 15rem;
}

details.bouton summary {cursor: pointer;}


details[open] {
 /* animation: margin .5s ease-in-out;
      margin-bottom: 10px;*/
}

details  {
 /* animation: margin .5s ease-in-out;*/
}
@keyframes sweep {
  0%    {opacity: 0; transform: translateX(-10px)}
  100%  {opacity: 1; transform: translateX(0)}
}



.fleche {
	transition: opacity var(--transition_slow);
}
#fleches_nav {
	position: fixed;
	bottom: 0;
	right: 0;
}
.simple{text-decoration:none;}
.cacher_fleche {opacity: 0;}

#menuactif { display: none;}
#menu_bar > input { display: none; position: absolute; top: 0; left: -100px;}

.menuder li, .menuder a {
	color: var(--menu_color);
	justify-content: center;
}

.menuder ul {
	list-style: none;
	min-width: calc(1024px/10);
	position: absolute; 
	z-index: 1000;
	max-height: 0;
	left: 50%;
	right: 0;
	top:0;
	overflow: hidden;
	-moz-transition: max-height var(--transition_slow) ease;
	-webkit-transition: max-height var(--transition_slow) ease;
	transition: max-height var(--transition_slow) ease;
	background-color: var(--menu_background);
	width: max-content;
	transform: translateX(-50%);
}




.menuder .texte {
  align-self: center;
  flex-grow: 4;
  max-width:unset;
}
.menuitem span { /*display: inline-block;*/ /*margin-top: var(--taille-icones);*/}
.menuitem a {
	text-decoration: none;
	font-size: var(--font-size-sm);
}
.edit_article {
	text-align: right;
	margin-bottom: calc(var(--S) * -1) !important;
	float: left;
	z-index: 1;
	position: relative;
}

.fixed {
    position: fixed !important;
    top: 0 !important;
}

/* Portfolio des articles */
.galerie {
	display: flex !important;
	flex-wrap: wrap;
	text-align: left;
	margin: 0 auto;
	justify-content: space-evenly;
}



section:not(.le_forum) .item div:has(.galerie) {
	grid-column: span 3;
	margin-top: var(--L);
}

div:has(>.un_media) {
	margin: var(--L);
	box-sizing: content-box;
	max-width: calc(var(--vignette-galerie) + var(--L) );
}

.un_media {
	width: var(--vignette-galerie);
	height: var(--vignette-galerie);
	padding: var(--S);
	box-shadow: var(--ombre-legere-sombre);
	border: var(--border-light);
	border-width: var(--border-diapo);
	position: relative;
	box-sizing: content-box;
}

.un_media p {
	margin-top: -66%;
	text-align: center;
	font-weight: var(--font-weight-medium);
	color: var(--couleur_dark-4);
}

.infos {
/*	position: relative;*/
/*	margin-top: var(--XS);*/
}
.infos .menuitem {
	width: 100% !important;
}
.menuitem.mimetype {
	position: absolute;
	top: 0;
	margin-top: calc(var(--taille-icones)*-0.5);
}

.infos img {/*margin:unset;*/}

.infos img {
	width: calc(var(--taille-icones)*0.6);
	/* margin-top: calc(var(--taille-icones) * -0.5); */
}



.infos .inactive:hover {
filter: unset;
 cursor:unset;
    
}
.image .inactive:before {
    	background-color: var( --couleur_cbap-3);   
}

.audio .inactive:before {
    	background-color: var( --couleur_cbap-1);   
}

.video .inactive:before {
    	background-color: var( --couleur_cbap-3);   
}


.infos label {
	/* clear: unset !important; */
	/* max-width: 100%; */
	display: block;
	word-wrap: anywhere;
}
/*
.infos .poubelle {
	position: absolute;
	right: 0;
	top: 0;
	margin-top: calc(var(--taille-icones)*-0.8);
}*/

.infos .poubelle {
	/* position: absolute; */
	/* right: 0; */
	/* top: 0; */
	margin-top: calc(var(--taille-icones)*-0.8);
	margin-left: calc(var(--vignette-galerie) - var(--taille-icones) );
}

.edition .un_media {
	height: unset;
    word-wrap : anywhere;

}

.galerie .un_media div.logo {
	display: flex;
	justify-content: center;
	align-content: center;
	width: 150px;
	height: 150px;
	overflow: hidden;
	margin: auto;
}





/* Pied de page */

#pied {
    background-color: var(--menu_background);
    color: var(--menu_color);
    display: table-row;
    text-align: center;
    font-size: var(--font-size-sm);
    
}

#pied #legal{
margin:auto;
}

#pied a{
	display: inline-block;
    color: var(--menu_color);
}


#pied a::before {
	content: " | ";
}

/*Edition en mode public*/
/*.iframe #spip-admin {display: none;}*/

.lity-container:has(div#form_editer_article) {
	width: 100%;
}

.lity-iframe-container iframe {
	width: 100%;
}

.lity-content {
    overflow: hidden !important;
    display: flex;
    flex-direction: column;
}

.lity-content-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden; 
}


#edition {
	flex-grow: 1;
	overflow-y: auto;
	min-height: 0;
	padding-right: var(--M);
}



#edition form details.bouton:not([open]) h3 {
  /*  display: none;*/
}

#edition form details.bouton[open] summary {
  /*  display: none;*/
}

#edition details > div {
transition: max-height var(--transition_slow) ease-out, opacity var(--transition_slow) ease-out;
  max-height: 0;
  overflow: hidden;
  opacity: 0;

}

#edition details.is-open > div {
  max-height: 200vh;
  opacity:1;
}

#edition table.spip.liste {
	width: 100%;
}

.edition details[open]>summary.m38::before {
 /* mask-position: 0 calc(var(--taille-icones)*-39*0.75);*/
}

details[open]>summary.m38::before {
  mask-position: 0 calc(var(--taille-icones)*-39*0.5);
}

body.iframe {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden; /* Empêche le scroll sur le body */
    
}

.box_mediabox.lity-iframe .lity-iframe-container iframe {
	background: transparent;
}

.box_mediabox.lity-image.lity-ready .lity-image-figure::before {
	background-color: black;
}
.box_mediabox .lity-container {
	max-width: 90vw;
	max-height: 90vh;
	height: 90vh;
}
.box_mediabox .lity-content {
	min-width: min(90vw,400px);
	height: 100%;
}

.box_mediabox.lity-ajax .lity-content {
	background: none;
}

.lity-iframe-container {
	padding: unset;
	overflow: auto;
	min-height: 90vh !important;
	max-width: 90%;
	margin: auto;
}

section#contenu_edit {
	background-color: var(--level1_background);
	padding: var(--L);
	border: var(--border-light);
	box-shadow: var(--ombre-legere-sombre);
	border-radius: var(--border-radius);
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	height: calc(100% - var(--L)*2);
	min-height: 0;
	overflow: hidden;
	margin: var(--L);
    box-sizing: border-box; 
    overflow-y: auto;   
    
    -webkit-overflow-scrolling: touch; 
}

.commentaire {font-size:var(--font-size-sm);}

/*formulaires */
form {margin:0;}

span.form-hidden {
	margin: 0;
}
.edition textarea, .edition input {
	width: 100%;
    box-sizing: border-box;
}



textarea, input {
	width: 100%;
    box-sizing: border-box;

}

.contenu_onglets input {
	max-width: 40rem;
	display: block;
}

input[type=checkbox]{width:auto;}

input.datePicker {
    cursor:pointer;
}
.edition .choix input, .edition .editer_date input {
	width: initial;
}
input.checkbox {
	width: auto;
}

.edition label {
	font-weight: var(--font-weight-semibold);
	font-size: var(--font-size-xs);
	/* margin-top: var(--S); */
	/* clear: both; */
	display: inline-block;
	text-overflow: ellipsis;
	overflow: hidden;
	max-width: 100%;
	white-space: nowrap;
}

.edition .choix label, .edition .editer_date label {
	display: initial;
    margin:0;
}

.editer.editer_date {
	margin-top: var(--M);
}
.editer_date .date {
	float: none;
}
.choix {
	margin-left: var(--XL);
}
.choix input {
	width: auto;
}


.enregistrer_objet, .editer_objet {
	position: absolute;
	top: calc(var(--L)*-0.5);
	right: calc(var(--L) + var(--taille-icones));
}


.supprimer_objet {
	position: absolute;
	top: calc(var(--L)*-0.5);
	right: calc(var(--L) + var(--taille-icones)*2);
}

.toggle_box_link .ajouter.btn_mini {
	display: flex;
	border-radius: 0.3em;
	font-size: var(--font-size-sm);
	color: white;
	text-shadow: var(--ombre-sombre);
	width: fit-content;
	margin: 0.5em auto;
	background-color: var(--menu_color);
	cursor: pointer;
	padding: 0 var(--S);
	align-items: center;
}

.edition .markItUp .markItUpContainer {
	display: grid;
	grid-template-areas: "outils tabs" "text   text" "preview preview";
	grid-template-rows: min-content auto auto;
}

.edition .markItUp textarea#texte {
	grid-area: text;
}
.edition .markItUp .markItUpPreview {
	grid-area: preview;
}
.edition .markItUp .markItUpEditor, .edition .markItUp .markItUpPreview {
	width: 100%;
	max-width: unset;
	border: var(--border-light);
	position: unset;
    padding:var(--S);   
    margin: 0;
    box-sizing: border-box;
}
.edition .markItUp .markItUpTabs {
	grid-area: tabs;
	position: relative;
	right:0;
}

.markItUp .markItUpTabs a {
	border: var(--border-light);
	border-radius: var(--border-radius) var(--border-radius) 0 0;
	background: var(--level1_background);
}
.edition .markItUp .markItUpHeader {
	grid-area: outils;
}
.edition .markItUp .markItUpHeader ul {
	display: flex;
	flex-wrap: wrap;
}
.markItUp .markItUpContainer.fullscreen {
	background: var(--level0_background);
	padding: var(--M);
	box-sizing: border-box;
}
.edition .markItUp .markItUpContainer.fullscreen  {
	grid-template-areas: "outils tabs" "text   preview";
	grid-template-rows: min-content auto;
	gap: var(--S);
}

.markItUp .fullscreen .markItUpEditor {
	 position: absolute ; 
	 right: unset; 
}
.markItUp .fullscreen .markItUpEditor, .markItUp .fullscreen .markItUpPreview {
	width: 100%;
	max-width: unset;
	border: var(--border-light);
	position: unset;
}
.markItUp .fullscreen .markItUpHeader {
	position: initial; 
	width: unset; 
	display: block !important;
}






/*   abonnements et infolettre online */
.m36 form .editer-groupe > div, .m36 form > div {
	display: flex;
}

.m36 form > div {
	flex-wrap:wrap;
}


.m36 form .editer-groupe label, .m36 form .editer-groupe input {
    margin-right: var(--S);
}

.m36 form .editer-groupe input {
	width: 20rem;
}
.m36 p.boutons {
	position: relative;
	margin-left: calc(var(--taille-icones)*0.5 + var(--M));
}
.m36 p.boutons::before {
	background-color: var(--valider);
}

details .newsletter #contenu {
	margin: 0;
}

/* mediabox */

.menuitem.lity-close button::before, .menuitem.fermer_objet button::before {
	background-color: var(--menu_color);
}

.menuitem.lity-close, .menuitem.fermer_objet {
	position: absolute;
	top: calc(var(--L)*-0.5);
	right: var(--L);
	color: var(--menu_color);
	height: var(--taille-icones);
	width: var(--taille-icones);
}




button.lity-close {display:none;}

.box_mediabox.portfolio button.lity-close {
	display: initial;
}

.saisie_selecteur_parent h3 {
	display: none;
	/* grid-template-columns: 1fr auto; */
}

select.saisie_selecteur_parent {
	border: none;
	width: auto;
	overflow: auto;
	position: relative;
	padding: var(--XS);
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: calc(var(--taille-icones)*1);
	cursor: pointer;
	margin-left: var(--S);
    font-size: var(--font-size-sm);
	background: var(--liste_background);
}

.editer_parent:has(select)::after {
	content: "";
	margin-left: calc(var(--taille-icones)*-1);
    pointer-events: none;  
	mask-image: var(--mask-sprite);
	font-size: 0;
	background-color: var(--couleur_dark-1);
	width: calc(var(--taille-icones)*1);
	height: calc(var(--taille-icones)*1);
	border: 0;
	display: inline-block;
	mask-size: calc(var(--taille-icones)*1);
}
.editer_parent.boutons.m24 {
    display:flex;
    align-items:center;
    
}

.editer_parent.boutons.m24 label{
    margin:0;
}
.editer_parent.boutons.m24:after{ mask-position: 0 calc(var(--taille-icones)*-24);}	/*rechercher*/









.item_picker{position:relative;}
/*.item_picker:has(.browser.ajax){position:relative;}

.item_picker:has(.browser.ajax[style*='display']){grid-column:initial;}*/

.item_picker .frame {
	border: 1px solid #909090;
	width: 250px;
	overflow: auto;
	position: relative;
	padding: var(--S);
}

.item_picker .frame h2 {
	font-size: var(--font-size-sm);
}


.item_picker .browser.ajax > div:has(.frame) {
	display: flex;
    /*flex-wrap: wrap;*/
}

.edition .item_picker button {
	/*display: flex;
	align-items: center;*/
}

.edition .item_picker .chemin {
	display: none;
}
.edition .item_picker .frame {
	margin: 0;
}
/*
.frame.total_2.frame_1 {
	width: min-content;
}

.frame.total_3.frame_1, .frame.total_3.frame_2 {
	width: min-content;
}
.frame.total_4.frame_1, .frame.total_4.frame_2, .frame.total_4.frame_3 {
	width: min-content;
}*/


.item_picker .frame ul li.rubrique {
	background: var(--ombre-claire-color);
	margin: var(--XS) 0;
	line-height: var(--line-height-tight);
	position: relative;
	font-size: var(--font-size-xs);
	padding-right: var(--L);
}

.item_picker .frame ul li a {
/*	display: inline;*/
	text-decoration:none;
}

.item_picker .frame ul li a:has(img.add) {
}

.item_picker .frame ul li a:has(img.add)::before {
    content: '\0025A1';
    cursor:pointer;
    display : inline;
    margin-right: var(--S);
}
.item_picker .frame ul > li .add {display:none;}
.item_picker .frame ul > li .ouvrir {display:none;}


.item_picker .frame ul li a:has(img.ouvrir) {
	position: absolute;
	top: 0;
	right: 0;
	font-weight: var(--font-weight-bold);
	font-size: var(--font-size-base);
}

.item_picker .frame ul li a:has(img.ouvrir)::before {
	content: '\002192';
	cursor: pointer;
	display: block;
	margin-right: var(--S);
	height: var(--L);
	width: var(--L);
}

a:has(img.close) {
	float: left;
	margin-right: var(--S);
}

.item_picker .frame ul li .ouvrir {
/*	position: absolute;
	right:0;
	top:0;
	cursor:pointer;*/
} 
ul.item_picked li.rubrique a:has(img) {
	/*display: none;*/
}
/*
.item_picker:has(.browser.ajax) .picker_bouton {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 1;
}*/
.item_picker .picker_bouton {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 1;
}
.item_picked a[title="del"] {
	display: none;
}

#annulation {
	text-align: center;
}

/*interactivité*/

.administration {
	margin-top: 80px;
	margin-right:20px;
	padding:1%;
	position: absolute;
	visibility:hidden;
	opacity:0;
   transition:visibility var(--transition_fast) linear,opacity var(--transition_fast) linear;
   background-color: #FFF;
   font:initial;
   color:initial;
   border: 1px solid rgba(0,0,0,0.2);
	box-shadow: 1px 1px 26px black;   
	min-width: 250px;
	right: 0; 
}

.administration p {
	display: inline-block;
}
	 
.administration[name] {
	visibility: visible;
	opacity: 1;
}

.administration textarea {
	width: auto;
	border: 0;
	display: block;
	margin: auto;
}

/* bouton submit des formulaires créés via le plugin 'Formidable' - Ajouter la classe 'm28' sur le formulaire*/
.m28 p.boutons > ::before {
	background-color: var(--valider);
}




/*formulaire de recherche*/
#formulaire_recherche .editer-groupe {
	display: flex;
}



#lien_recherche {
	background-color: var(--administration_color);
	height: 0;
	width: 100%;
	margin: 0;
	box-shadow: none;
	position: sticky;
	top: 0;
	padding: 0;
	border: 1px solid transparent;
}


#lien_recherche[name] {
	height: 10vh;
	backdrop-filter: var(--blur);
	padding: 25vh 0;
	z-index: 2;
	margin-bottom: calc((10vh + 25vh*2)*-1);
	border: 0;
	mask: linear-gradient(black 80%, black 20%, transparent);
}
#lien_recherche[name]::before {
/*	content: '';
	height: 10vh;
	width: 100%;
	mask: linear-gradient(black 50%, black 50%, transparent);
	backdrop-filter: var(--blur) ;
	box-sizing: border-box;
	position: absolute;
	display: block;
	top: 100%;
	background-color: var(--administration_color);
*/
}



#lien_recherche .editer-groupe {
    display: flex;
    justify-content: center;
    margin-top : -10vh;
    position: relative;
    z-index:1;
}
.rechercher #lien_recherche {
	background-color: rgba(255,255,255,0); 
	 height: auto; 
	position: initial;
	margin: 0;
}


.rechercher #lien_recherche[name] {
	position: initial;
	margin: 0;
	padding: 0;
}
.rechercher #lien_recherche[name]::before {
/*	display:none;*/
}

.rechercher .administration {
	visibility: visible;
	opacity: 1;
}
.rechercher #lien_recherche .editer-groupe {
	display: flex;
	justify-content: center;
	margin-top: 10vh; 
	position: relative;
	z-index: 1;
}
input#recherche {
    max-width: calc( 30rem - var(--taille-icones) );
    margin: auto var(--L);
   
}

.editer_parent .choix_rapide {
	display: none;
}


/*mise en page */
#page {
	margin: 0 15%;
}


div:has(> .suite) {
	/* min-height: var(--font-size-lg); */
	text-align: right;
}

.suite {
	font-size: var(--font-size-sm);
	font-style: italic;
    margin: 0 0 var(--L) var(--L);
}


/*menus internes à chaque rubrique : sous-rubriques et articles */
.lire {
	clear: both;
	font-weight: var(--font-weight-medium);
}
ul.menu_rubriques {
    text-align: initial;
}

.menu_rubriques li, .menu_articles li {
	margin-bottom: var(--S);
	background-color: var(--ombre-claire-color);
	transition: all var(--transition-fast);
	padding: 0 var(--S);
	font-size: var(--font-size-sm);
	display: flex;
	align-items: center;
	background: var(--liste_background);
}

.menu_rubriques li a , .menu_articles li a  {
	text-decoration: none;
    color: var(--text_color) !important;
    width:100%;
}

.menu_rubriques li a:hover, .menu_articles li a:hover {
	font-weight: var(--font-weight-medium);
    font-size:1.1em;
}

.menu_rubriques li {
	border-left: var(--S) solid var(--button_color);
}
.menu_rubriques li::before {
	content: "";
	mask-image: var(--mask-sprite);
	font-size: 0;
	background-color: var(--couleur_dark-1);
	width: var(--XL);
	height: var(--XL);
	border: 0;
	display: block;
	mask-size: var(--XL);
}

.menu_rubriques li::before{mask-position: 0 calc(var(--XL)*-31);} /*repertoire*/


.menu_articles li {
	border-left: var(--S) solid var(--menu_color);
}

.menu_rubriques li a span, .menu_articles li a span {
	display: block ;
	/* font-size: var(--font-size-xs) ; */
	font-style: italic ;
	color: var(--color-text-muted) ;
	/* margin-top: var(--L) ; */
}

/* Styles de l'agenda */

.agenda_cbap, .agenda_partenaires, .agenda_profs {
	margin: 0;
}
.agenda_cbap::before {
	content: '\0025A0\0000A0 ';
	color: #57a3d3;
}
.agenda_partenaires::before {
	content: '\0025A0\0000A0 ';
	color: #e68d0e;
}
.agenda_profs::before {
	content: '\0025A0\0000A0 ';
	color: #93b817;
}
.agenda_fini {
	opacity: 0.6;
	font-style: italic;
}
nav.pagination {
	background-color: rgba(0,0,0,0.1);
	grid-column: inherit;
    flex-basis: 100%;
}

.pagination, .tri {
	background: var(--spip-color-gray-lighter);
	margin: 0;
	margin-top: 1em;
	padding: calc(var(--spip-list-spacing-y) / 2) calc(var(--spip-list-spacing-x) / 2);
	font-size: 0.85em;
	font-weight: bold;
	text-align: var(--spip-right);
	white-space: nowrap;
}
.pagination a, .tri a {
	transition: background var(--transition_fast);
}
.pagination .pagination-items {
	list-style: none;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	border-radius: inherit;
}
.pagination .pagination-items {
	justify-content: center !important;
}
.pagination-item:not(:first-child)::before {
	content: "\00007C";
    
}
    
    
    
    
/* Styles du forum */ 
    
    


	.onglets 
  			{
						margin: 0 -0.5em;
			}

        .onglet 
        {
				    display: inline-block;
				    margin-right: 3px;
				    padding: 3px;
				    border: 1px solid #a49c77;
				    cursor: pointer;
				    border-radius: 10px 10px 0 0;
				    border-bottom: none;
				    font-size: 0.8em;
				    color: #555;
			}
        .onglet_0
        {
                background:#c4c1af;
        }

        .onglet_1
        {
                background:#f1f1e8;
                padding-bottom:4px;
                font-weight: bold;
        }
        .contenu_onglet
        {
                background-color:#f1f1e8;
                border:1px solid #a49c77;
                margin-top:-1px;
                padding:5px;
                display:none;
        }
        .contenu_onglets {
    margin: -0.5em;
    margin-top: 0;
}
		
		.contenu_onglet #spip_logo_auteur {
	display: none;
}

/*
.le_forum .btn.submit, .le_forum p.boutons > * {
	display: flex;
	border-radius: 0.3em;
	font-size: 0.8em;
	color: white;
	text-shadow: var(--ombre-sombre);
	width: fit-content;
	margin: 0.5em auto;
	background-color: var(--menu_color);
	cursor: pointer;
	padding: 0 var(--S);
	align-items: center;
} */

.le_forum .navigation {
	text-align: right;
	font-size: var(--font-size-xs);
	color: var(--couleur_light-2);
	font-style: italic;
	cursor: pointer;
	display:block !important;
}


.le_forum details summary {
    list-style: none;
}
.le_forum details:not([open]) summary .ouvrir {
	display: initial;
}
.le_forum details:not([open]) summary .fermer {
	display: none;
}
.le_forum details[open] summary .ouvrir {
	display: none;
}
.le_forum details[open] summary .fermer {
	display: initial;
}

.le_forum details[open] {
	box-shadow: 4px 4px 10px #888;
	background: #f1f1e8;
	padding: 0.5em;
	margin-top: 1em;
    box-sizing: border-box;
	width: calc( 100% - var(--M));
    
}

.comment-item.comment-fil {
	grid-template-columns: calc(var(--taille-icones)*3) auto;
}

.comment.auteur {
	grid-template-columns: var(--taille-icones) 1fr auto;
	gap: var(--L);
	align-items: center;
    /*border-bottom: var(--border-light);*/
	padding-bottom: var(--S);
	text-align: center;
	padding-right: var(--XL);
}




/*écran large */
.comment-item.comment-fil {
	display: grid;
}

.comment.auteur {
	display: unset;
}

/*écran étroit
.comment-item.comment-fil {
	display: unset;
}

.comment.auteur {
	display: grid;
} */



.comment-content.description {
	overflow: auto;
}

.le_forum textarea {
	/*max-width: calc( 100% - var(--XS)*2);*/
}

.le_forum > div:not(:first-of-type) {
	border-top: var(--border-light);
	padding-top: var(--S);
	margin-top: var(--S);
}
.le_forum > div:last-of-type {
	border-bottom: var(--border-light);
}

.date {
	text-align: right;
	font-style: oblique;
	float: right;
	margin-right: var(--S);
	font-size: var(--font-size-xs);
}

.comment-content p {
/*	margin-top: var(--S);*//*incompatible avec illustrer video forum*/
	/* margin-top: 0; */
}
.avatar a {
	display: block;
	text-decoration: none;
	color: var(--menu_color);
	font-weight: var(--font-weight-bold);
}

div.avatar.spip_logo {
	display: inline-block;
	position: relative;
	height: calc(var(--taille-icones)*1.5);
	width: calc(var(--taille-icones)*1.5);
	
}

svg.avatar.spip_logo {
	width: 100%;
	height: 100%;
}

.avatar.spip_logo span {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: var(--font-size-xl);
	font-weight: bold;
	line-height: 1;
}
/*
.avatar svg {
	width: calc(var(--taille-icones)*2);
	height: auto;
}
.avatar svg circle {
	r: var(--taille-icones);
	cx: var(--taille-icones);
	cy: var(--taille-icones);
}*/
.avatar svg text {
/*	font-size: var(--taille-icones) !important;
	x: var(--taille-icones);
	y: var(--taille-icones);
	fill: #FFF;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	text-anchor: middle;
	dominant-baseline: central;*/
}
.avatar img {
	border: var(--border-light);
	border-radius: 50%;
	width: calc(var(--taille-icones) * 2);
}
    
    /*Formulaire Lity - Illustrer video*/
.loader {
	width: var(--taille-icones);
	height: var(--taille-icones);
	position: absolute;
	margin: calc(var(--taille-icones)*-0.5);
	left: 50%;
	top: 50%;
    animation: grow-shrink 2.5s infinite;
}

@keyframes grow-shrink {
	0%, 100% {transform: scale(0.5);opacity: 0.1;}
	50% {transform: scale(1);opacity: 0.8;}
	}
	
canvas, video {max-width : 100%; max-height : 100%; padding:0;margin:0;}
#illustrer_video {opacity: 0; transition: opacity var(--transition_fast) linear;}
#videoPreview {position: absolute; top: -9999px; left: -9999px; visibility: hidden;}
#selectPreview {position : absolute; display: block; width:0; height:0;border:1px solid red; box-sizing: border-box;transform-origin: top left;}
section {margin:0;padding:0;}
.handle {
	width: 10px;
	height: 10px;
	background: #007bff; 
	position: absolute;
	}

.br { bottom : -5px; right: -5px; cursor: se-resize; }
.bl { bottom : -5px; left: -5px; cursor: sw-resize; }
.tr { top : -5px; right: -5px; cursor: ne-resize; }
.tl { top : -5px; left: -5px; cursor: nw-resize; }
  
#clip {
	position: absolute;
	top: 0; 
	box-sizing: border-box;
	pointer-events: none;
	}
	
.overlay-flou {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
    background-color: #2246;
  -webkit-mask-image: url(#svgMask);
  mask-image: url(#svgMask);
}

#canvasPreview {display:none;}
#slider {display: block;}
#illustrer_video {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	}
#illustrer_video > .preview {flex-direction: column;}
.preview {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	flex: min-content;
}
.preview label {display: block;}
.preview .logo {
	overflow: hidden;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.preview .logo img {max-width: unset;}    
    
 /* Mise en page spécifique du Karnet */   
 
.karnet .menu_articles, .karnet .menu_rubriques {
	display: grid !important;
	grid-template-columns: 1fr 1fr;}
	
	

#papiers details .montrer {
	position: absolute !important;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.7);
	transition: opacity var(--transition_slow);
	opacity: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

#papiers details .montrer::before {
	content: "";
	display: block;
	width: var(--taille-icones);
	height: var(--taille-icones);
	mask-image: var(--mask-sprite);
	mask-repeat: no-repeat;
	mask-position: 0 calc(var(--taille-icones)*-19);
	background-color: var(--couleur_cbap-1);
	opacity: 1;
}

#papiers details .montrer:hover{
opacity: 1;
cursor: pointer;
}	


#papiers {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: var(--XL);
	grid-auto-flow: dense;
	margin-bottom: var(--XL);
}
	
#papiers details, #archives details#detailsArchive {
	background-color: var(--level1_background);
	padding: var(--L);
	border: var(--border-light);
	box-shadow: var(--ombre-legere-sombre);
	border-radius: var(--border-radius);
	position: relative;
	overflow: clip;
	word-wrap: anywhere;
}

#papiers summary {
	display: block;
}

#papiers details[open] summary{
	display:none;
}


#papiers details[open] {
	grid-column-start: 1;
	grid-column-end: -1;
}    
 
#papiers details:not([open]) {
	max-width: 400px;
} 
#archives {
	clear: both;
	margin: var(--L) 0;
}
#archives first_row {
    margin: var(--L) 0;
}
#archives details#detailsArchive {
    margin: var(--XL) 0;
}

#archives details#detailsArchive summary, #archives details#detailsArchive[open] summary {
    display: none;
}

#archives details#detailsArchive:not([open]) {
	display: none;
} 

#papiers {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: var(--XL);
	grid-auto-flow: dense;
	margin-bottom: var(--XL);
}

#page {position: relative;}

.
.menuitem.m17, .menuitem.m18, .menuitem.m29 {
/*	height: var(--taille-icones);
	width: var(--taille-icones);*/
}

input[type=checkbox]{width:auto;}

.enregistrer_objet, .editer_objet {
	position: absolute;
	top: calc(var(--L)*-0.5);
	right: calc(var(--L) + var(--taille-icones));
}

.menuitem.lity-close, .menuitem.fermer_objet {
	position: absolute;
	top: calc(var(--L)*-0.5);
	right: var(--L);
	color: var(--menu_color);
	height: var(--taille-icones);
	width: var(--taille-icones);
}
.menuitem.lity-close button::before, .menuitem.fermer_objet button::before {
	background-color: var(--menu_color);
}


.lity-container {
	width: 100%;
}


.lity-content section {
	background-color: var(--level1_background);
	padding: var(--L);
	border: var(--border-light);
	box-shadow: var(--ombre-legere-sombre);
	border-radius: var(--border-radius);
	display: flex;
	/* flex-direction: column; */
	/* flex-grow: 1; */
	height: calc(100% - var(--L)*2);
	min-height: 0;
	overflow: hidden;
	/*margin: var(--L);*/
	box-sizing: border-box;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	/* border: 10px solid red !important; */
	/*align-items: center;*/
	align-content: center;
}


.lity-content-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden !important;
    padding:0;
}

/*audio et video */

/*lecteur audio & video */

video {
height: 100%;
width:100%;}

.blog figure {
	z-index: 0;
}

.spip_document .oembed, .spip_documents .oembed {
	display: block;
	background: #f8f8f8;
	padding: 0;
	border: none;
	max-width: 100% !important;
}
.oembed figure {
	text-align: center;
}
.oembed figcaption > div {
	max-width: unset !important;
}
.oe-play-button button {
    display: flex;
    position: initial;
    margin: 25% auto;
    z-index: auto;
    border: 4px solid white;
	align-items: center;
	justify-content: center;
}

.oe-play-button button:before {
   	display: none;
}



.oe-play-button button::after {
 width: 50px;
 position:initial;
 border:none;
 margin:0;
  height: 50px;
  background: #e74c3c;
clip-path: polygon(32% 15%, 32% 85%, 87% 50%);
    
}

.mejs__overlay.mejs__layer.mejs__overlay-play {

}


.rwd-video-container.oe-play-button {
   position: initial;
   display: flex;
}




.oe-play-button_label {
    color: red;
    font-size: 2em;
}




.scc {
	max-width: 75%;
	padding: 0;
	width: 100%;
	margin: 0 auto var(--L) auto;
}

.lity-content .scc {
	margin:  var(--M) auto;
}
.scc .menuitem.m15 button{
	display: flex;
	align-items: center;
}
.scc audio { 
width: 100%; display: block; 
}
.scc > div {
	display: flex;
	padding: 0.2rem 0 0 0;
	gap: 0 0.5rem;
	flex-wrap: wrap;
	align-items: center;
}

.scc .menuitem button::before {
	display: inline-block;
}

.scc input[type="range"] { flex: 5; }
.scc.menuitem > a::before {
	vertical-align: middle;
}

/*Styles du Karnet*/
.formulaire_editer_liens-papiers .btn_secondaire[value="Ooops"] {
	display: flex;
	border-radius: 0.3em;
	font-size: var(--font-size-sm);
	color: white;
	text-shadow: var(--ombre-sombre);
	width: fit-content;
	margin: 0.5em auto;
	background-color: var(--menu_color);
	cursor: pointer;
	padding: 0 var(--S);
	align-items: center;
}
.formulaire_editer_liens-papiers .over {
	display: none;
}

.formulaire_editer_liens-papiers .boutons {
	display: none;
}

#edition table.spip.liste tr:hover, .liste-objets-lies.papiers li:hover {
background-color: var(--menu_color);
}
#edition table.spip.liste tr:hover button, .liste-objets-lies.papiers li:hover button  {
background-color: transparent;
}
#edition table.spip.liste td.action button, .liste-objets-lies.papiers li button {
	cursor: pointer;
}



.papier-xx a {
	display: none;
}
.papiers > .action .button.link {
	display: none; 
}
.liste-objets.papiers {
    margin-bottom: var(--L);
}

.liste-objets.papiers .row_odd {
	background: var(--liste_background);
}

.liste-objets.papiers ul li:not(.pagination-item) {
	display: grid;
	grid-template-columns: 5rem 1fr auto;
}

.liste-objets.papiers td {
	font-size: var(--font-size-sm);
}

.creer_archive form > div {
	display: grid;
	grid-template-columns: 0 auto 1fr var(--taille-icones);
}

.visible {
	align-self: center;
	margin-right: var(--S);
}

.formulaire_archive_papier div>input {
	min-width: 15rem;
}
.formulaire_archive_papier div>input, .formulaire_archive_papier div>span,  .formulaire_archive_papier label {
	align-self: center;
}


.formulaire_archive_papier input.submit {
	width: auto;
}

label.boutons.m24 {
	display: initial;
}

    
/*Menu responsive    */
@media screen and (max-width:947px) { 
.switch { 
padding-top: var(--M);
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
border: none; 
-webkit-transition: -webkit-transform var(--transition_fast) cubic-bezier(.72,.89,.28,1.39); 
transition: transform var(--transition_fast) cubic-bezier(.72,.89,.28,1.39); 
-webkit-transform: translateX(0%) translateY(-1000%) translateZ(0); 
-ms-transform: translateX(0%) translateY(-1000%) translateZ(0); 
transform: translateX(0%) translateY(-1000%) translateZ(0); 
will-change: transform;}

 /* Theming opened nav */
/* handling clic with CSS3 checked */
#menu_bar > input:checked ~ ul {position:relative; -webkit-transform: translateX(0) translateZ(0); -ms-transform: translateX(0) translateZ(0); transform: translateX(0) translateZ(0);}
 /* Global styling nav button */

#menu_bar > label {
	background-image: var(--mask-sprite);
	background-position: 0 calc(var(--taille-icones)*-19);
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	width: var(--taille-icones);
	height: var(--taille-icones);
	padding: 0;
	-webkit-transition: -webkit-transform var(--transition_fast);
	transition: transform var(--transition_fast);
	cursor: pointer;
	background-size: var(--taille-icones);
	margin: var(--M);
}   
#menu_bar > label:hover { filter: brightness(50%); -webkit-filter: brightness(150%); -moz-filter: brightness(150%); -o-filter: brightness(150%); -ms-filter: brightness(150%);}
 /* Theming opened nav button */
#menu_bar > input:checked + label { 
	background-position: 0 calc(var(--taille-icones)*-20);	/*moins menu*/
-webkit-transform: rotate(90deg) translateZ(0); -ms-transform: rotate(90deg) translateZ(0); transform: rotate(90deg) translateZ(0);}
.menuder > li:first-of-type {
	margin-left: calc(var(--taille-icones) + var(--M));
}

 /* Hide alternate text except from screen readers */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px);}
}

/*affichage responsive*/
@media screen and (min-width:1440px) { 
    #page {
	margin: 0 auto;
	max-width : 1024px ;
}
}   


@media screen and (max-width:1024px) { 
    
.sommaire .conteneur_haut > div:first-of-type {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}    
    
.sommaire .conteneur_haut span {
	text-align: center;
	margin: 0 var(--M);
}
    
#page {
	margin: 0 10%;
	padding-top: var(--M);
}
    .navigation{display:none;}
    .navigation.retour{display:block;}


   .item {
	grid-template-columns: 0 1fr 2fr;
}
    .switch.menuder {justify-content: center;}
   
   .edition .markItUp .markItUpContainer.fullscreen  {
	grid-template-areas: "outils tabs" "text   text" "preview preview";
	grid-template-rows: min-content auto auto;
}
   
   
    
}

@media screen and (max-width:768px) { 
  
:root {
    --taille-icones : 42px; 
}
    #page {
	margin: var(--L) 0 0 0 ;
	padding: var(--L);
}
  .sommaire  #page {
	background-color: var(--level1_background);
}


.sommaire .conteneur_haut span {
	text-align: center;
	margin: 0 var(--M);
}
.sommaire .titre_site {
	font-size: var(--font-size-3xl);
}
.sommaire .slogan {
	font-size: var(--font-size-3xl);
}
 .titre_site {
	font-size: var(--font-size-2xl);
}
 .slogan {
	font-size: var(--font-size-xl);
}

    .navigation.retour{display:none;}

.item {
	grid-template-columns: 1fr; 
	
}
section .item div {
    grid-column: span 1 !important;
}
 .item > div:first-of-type {
	border-right: none;
	padding-right: 0;
	max-width: 100%;
} 

.item > div:first-of-type img{
	margin: auto;
	display: block;
}

    .item > div {
	margin: 0 var(--L) !important;
}
    #page section {
	border: none; 
	box-shadow: none; 
	border-radius: 0;
	padding:0;
}

#page section::after {
    display: block;
	content: '';
	width: 100%;
	height: 1px;
	box-shadow: 0px 5px var(--S) var( --ombre-sombre-color);
	border-bottom: var(--border-light);
	margin-top: var(--L);
}

.box_mediabox .lity-container {
	max-width: 100vw;
	max-height: 100vh;
	height: 100vh;
}
.lity-iframe-container {
	/*padding: unset;
	overflow: auto;*/
	/*min-height: 90vh !important;*/
	max-width: 100% !important;
	/*margin: auto;*/
	max-height: 100% !important;
	height: 100%;
}

#archives {
	margin-left: var(--XL);
}


.comment-item.comment-fil {
	grid-template-columns: 1fr;
}
.comment.auteur {
	display: flex;
	border-bottom: var(--border-light);
	font-size: var(--font-size-sm);
}    
div.avatar.spip_logo {
	height: calc(var(--taille-icones));
	width: calc(var(--taille-icones));
}
.avatar.spip_logo span {
	font-size: var(--font-size-l);
} 
.avatar.comment.auteur .spip_logo {
	width: var(--taille-icones);
	height: var(--taille-icones);
}
}