/* --------------------------------------------------------------

   theme.css
  

-------------------------------------------------------------- */
body{
	font-family: "Luxi sans", "Lucida Grande", Lucida, "Lucida Sans Unicode", sans-serif;
	color:var(--basicFontColor);
	background-color: var(--body_BckgdColor);
}
/* ------------------------------------------
/* Habillage des balises HTML
/* ------------------------------------------ */

/* Elements principaux
------------------------------------------ */
#contenu {
  background-color: var(--page_BckgdColor);
}
header {
	background: var(--header_BckgdColor);
	text-align: center;
}
header .handWrite  {
	font-size: 500%;
}
header li {
	
	}
header h3 {
	opacity: 0.9;
}
header h3 .on {
	opacity: 1;
}
header .hashtag.on {
	color : var(--basicContraFontColor);
/*
	font-variant: all-small-caps;
	font-size: 140%
*/
	}
header .hashtag.on h3::before{
/* 	content: '\0023'; */
	opacity:0.6;
	}
header .hashtag::before{
	color: var(--white-50);
	font-size: 130%;
	
	}
	
header .hashtag::first-letter{
/* 	font-family: var(--reey_font); */
	font-size: 150%;
}
header ul li .on {
	font-size:116%;
}
.main {
	background-color: var(--main_BckgdColor);
}
#nav, #nav button, .dropdown-content a, .dropdown-content label {
	color:var(--basicContraFontColor);
	background: var(--nav_BckgdColor);
}

#nav li:hover, .dropdown-content a:hover  {
	color: hsl(var(--hue), var(--sat), 59%);
}
#nav li.searchInput {
	padding: 0.1em 0.1em;
	border-radius: 5px;
	background-color: var(--white-100);
	}
#nav li.searchInput .spip_surligne {
 color: var(--primaryColor);
	background-color: transparent;
	}
/*
#nav .active::before {
	content: '\0023';
}
*/
.main>.container pre, .main>.container pre svg {
	color: var(--black-75);
	fill : var(--black-75);
	vertical-align: bottom;
}
footer {
	color:var(--basicContraFontColor);
	background-color: var(--nav_BckgdColor);
}
.container-max {
	color:var(--basicContraFontColor);
	height: 200px;
	width:100%;
	background-color: var(--basicFontColor);
	text-align: center;
	padding: 80px  0;
	background-image: url(img/pano1.gif);
	background-repeat: round;
}
#aside {
	background-color: var(--aside_BckgdColor);
}
#overlay {
	background-color: var(--overlay_BckgdColor);
}
.asideTabs_header {
/* 	background-color: var(--aside_headerBckgdColor); */
	background-color: var(--header_BckgdColor);
	}
.asideTabs_header span {
	font-size: 75%;
	color: var(--white-100);
	}
.asideTabs_container {
	background-color: var(--asideTabs_container_BckgdColor);
	overflow: scroll;
}
.asideTabs_container dd {
	margin-bottom: 0.3em;
}
.asideTabs_container dt.on, .asideTabs_container dd.on  {
	color : var(--primaryColor);
	}
	.asideTabs_container dd {
		margin-left: 0.2em;
	}
.asideTabs_container dd.on  {
/* 	text-align: left; */
padding-left:0.5rem;
	border-left:0.3rem solid;
	}
.asideTabs_container dd.on .spip_logo {
/* 	display: none; */
	}
.asideTabs_container dd.on > label {
	background-image: none;
}
/*
.asideTabs_container dt.on::before{
	content: '\0023';
	
	}
*/
.asideTabs_container dd.on::before{
	content: ' \00A0';
	}
	.asideTabs_container dd.on::after{
	content: ' \2023';
	
	float: right;
	}
.overlay_header {
	background-color: var(--overlay_header_BckgdColor);
/* 	border-bottom: 0.15rem solid var(--primaryColor); */
}
.overlay_container {
	background-color: var(--overlay_container_BckgdColor);
/* 	box-shadow: 4px -3px 1em 3px var(--basicShadow); */
	}
/* CheckBox
------------------------------------------ */
#aside-checkbox:checked ~  #asideOverlay {
	background-color: var(--aside-overlay_BckgdColor);
}
#formTab ~ #contenu #aside #formLabel svg, #mapTab ~ #contenu #aside #mapLabel svg, #searchTab ~ #contenu #aside #searchLabel svg {
	fill:var(--basicContraFontColor);
	stroke:transparent;
	}
#formTab:checked ~ #contenu #aside #formLabel svg, #mapTab:checked ~ #contenu #aside #mapLabel svg, #searchTab:checked ~ #contenu #aside #searchLabel svg, #formTab ~ #contenu #aside #formLabel svg:hover, #mapTab ~ #contenu #aside #mapLabel svg:hover, #searchTab ~ #contenu #aside #searchLabel svg:hover {
	fill:var(--basicFontColor);
	}
#formTab:checked ~ #contenu #aside #formLabel, #mapTab:checked ~ #contenu #aside #mapLabel, #searchTab:checked ~ #contenu #aside #searchLabel {
	background-color: var(--asideTabs_checked_BckgdColor);
	box-shadow: 4px -3px 1em 3px var(--basicShadow);
}
#formTab:checked ~ #contenu #aside #formLabel span, #mapTab:checked ~ #contenu #aside #mapLabel span, #searchTab:checked ~ #contenu #aside #searchLabel span {
	color: var(--primaryColor);
	}
/* Components
------------------------------------------ */
.note {
	background-color: var(--primaryColor25);
	border-radius: var(--border-radius);
	padding: 0 1em 1em 1em;
	margin-bottom:1em;
	
}
.noteTitre, .noteTitre svg {
	color: var(--primaryColor);
}
.noteTitre svg {
	vertical-align: bottom;margin-right:0.2em;
}


.tip {
	background-color: var(--triad2Color25);
	border-radius: var(--border-radius);
	padding: 0.5em 1em 1em 1em;
	margin-bottom:1em;
}
.tipTitre, .tipTitre svg {
	color: var(--triad2Color);
}
.tipTitre svg {
	vertical-align: bottom;margin-right:0.2em;
}
/* table spip
---------------------------------------------- */
.table th, table.spip th, .table td, table.spip td {
border-bottom: 1px solid var(--primaryColor25);
}
table.spip td:nth-child(even) {
	background-color: var(--primaryColor05);
	
	}
.table tbody tr:hover td {
  background-color: var(--primaryColor05);
}
.table tbody tr:hover td:nth-child(even) {
  background-color: var(--white100);
}
/* Meta
---------------------------------------------- */
/*
.texte::first-letter{
	font-family: var(--reey_font);
	color: var(--primaryColor);
	font-size: 150%;
}
*/
li::marker {
	color: var(--primaryColor);
}
.rotateCW1 {
	transform: rotate(1deg);
}
.rotateCW2 {
	transform: rotate(2deg);
}
.rotateCW3 {
	transform: rotate(3deg);
}
.rotateCW4 {
	transform: rotate(4deg);
}
.rotateCW5 {
	transform: rotate(5deg);
}
.rotateTitel {
	transform: rotate(-4deg);
}
.rotateCCW1 {
	transform: rotate(359deg);
}
.rotateCCW2 {
	transform: rotate(358deg);
}
.rotateCCW3 {
	transf3rm: rotate(357deg);
}
.rotateCCW4 {
	transform: rotate(356deg);
}
.rotateCCW5 {
	transf3rm: rotate(355deg);
}
.primaryColor {
	color: var(--primaryColor);
	fill: var(--primaryColor);
}
.secondaryColor {
	color: var(--triad1Color);
	fill: var(--triad1Color);
}
.tertiaryColor {
	color: var(--triad2Color);
	fill: var(--triad2Color);
}
.classicColor {
	color: var(--classicColor);
	fill: var(--classicColor);
}
.digitalColor {
	color: var(--digitalColor);
	fill: var(--digitalColor);
}
.primaryColor svg {
	fill: var(--primaryColor);
}
.bottomAlign, .bottomAlign svg {
	vertical-align:bottom;
}
.round {
	border-radius:50%;
}
.travaux {
	border: 0.1rem dashed var(--primaryColor);
	padding: 5vw;
	margin-bottom: 2em;
}
.circle {color: var(--white-100);padding: 5px;background-color: var(--primaryColor);border-radius: 50%;}
.notification sup {
	color: var(--white-100);padding: 5px;background-color: var(--primaryColor);border-radius: var(--border-radius); font-size: 60%;
}
.banner {
	padding : 1em;
	
}
.banner button {
	margin: auto;
	background-color:  var(--white-100);
	border-color: var(--primaryColor);
}
/* Webfont declared as class
---------------------------------------------- */
.reeyFont {
	font-family: var(--reey_font);
	font-size: 250%;
	line-height: 120%;
	
}

.jinkyFont {
	font-family: var(--jinky_font);
	font-size: 300%;
	line-height: 100%;
}
.videoTitel {
	font-family: var(--jinky_font);
	font-size: clamp( 2rem, 1.39rem + 3.48vw, 4rem );
	
}
.candelaBookFont {
	font-family: var(--candelaBook_font);
	font-size: 150%;
	line-height: 100%;
}
.bpdotssquareFont {
	font-family: var(--bpdotssquare_font);
	font-size: 200%;
	line-height: 100%;
}
.loveyalikeasisterFont {
	font-family: var(--loveyalikeasister_font);
}
.dosisBoldFont {
	font-family: var(--dosisBold_font);
}
.dosisFont {
	font-family: var(--dosis_font);
}
/* Vertical*/
.vertical {
  writing-mode: vertical-lr;
/*   margin-right:2rem; */
}
/* first Letter firstLetter first-letter --loveyalikeasister_font
---------------------------------------------- */
.firstLetter::first-letter {
	font-size: 155%;
	padding-left:0.5em;
	line-height: 0;
}
.texte.firstLetter::first-letter, h1.firstLetter::first-letter, h2.firstLetter::first-letter, h3.firstLetter::first-letter {
	color: var(--primaryColor);
	}
.firstLetterReey::first-letter {
	font-size: clamp( 2rem, 1.34rem + 2.88vw, 3.5rem );
	color: var(--primaryColor);
	font-family: var(--reey_font);

}
.firstLetterLoveyalikeasister::first-letter {
	font-size: clamp( 2rem, 1.34rem + 2.88vw, 3.5rem );
	color: var(--primaryColor);
	font-family: var(--loveyalikeasister_font);

}
.titreFormulaire {
	padding: 1em 0;
}

.titreFormulaire:first-letter {
	font-family: var(--reey_font);
	color: var(--primaryColor);
}

/* Hyperliens
---------------------------------------------- */

/* Citations, code et poesie
---------------------------------------------- */


/* ------------------------------------------
/* Habillage des elements du contenu
/* ------------------------------------------ */

/* fil d'ariane */


/* Listes et tableaux */


/* Formulaires : variantes et cas particuliers
----------------------------------------------- */



/* Habillage des portfolios
---------------------------------------------- */

/* Habillage des forums
---------------------------------------------- */

/* Formulaire de forum */

/* Habillage des petitions
---------------------------------------------- */

/* Formulaire de signature */


/* ------------------------------------------
/* Sous-navigation et autres menus
/* ------------------------------------------ */

/* Habillage general des menus de nav */


/* ------------------------------------------
/* Autres medias
/* ------------------------------------------ */

/* ------------------------------------------
/* surlignage resultat recherche
/* ------------------------------------------ */

.spip_surligne {
background-color:  var(--markColor);
}
mark, .mark {
background: var(--markColor);
color: var(--black-100);
}
.cartouche.recherche.noresult {
color: var(--primaryColor);
}
.grandTotal {
	color: var(--primaryColor);
}
.points {
	color:transparent;
	background-color: var(--markColor);
	opacity: 1;
}
/* ------------------------------------------
/* developpement
/* ------------------------------------------ */


/* ------------------------------------------
/* Responsive
/* ------------------------------------------ */
@media screen and (max-width: 1200px) {
	#aside {
		background-color: var(--page_BckgdColor);
		color: var(--black-100);
	}
}
@media screen and (max-width: 375px) {
	.vertical {
		writing-mode: horizontal-tb;
	}
}
@media screen and (min-width: 1201px) {
	#formTab ~ #contenu #aside #formLabel svg:hover, #mapTab ~ #contenu #aside #mapLabel svg:hover, #searchTab ~ #contenu #aside #searchLabel svg:hover {
	fill:var(--primaryColor);
	}
	@media screen and (min-width: 1201px) {
	li.searchInput {
    padding: 0.1em 1em}
}

/* fin */
