titre/* --------------------------------------------------------------

   typo.css
   Base typographique
   Cf.: http://www.spip-contrib.net/3820

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



html { margin:0; padding:0;height:100%;width:100%; s
 font-size: 100.01%; } /* pour IE < 6 */
 
body, html {
    height: 100%;min-height:100%
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

.scroll-container {
  overflow: scroll;

  @supports (scrollbar-gutter: stable) {
    overflow: auto;
    scrollbar-gutter: stable;
  }
}
/* pour sticky header  */
.scroll-container {
  scroll-padding-top: var(--header-height);
}

* body {
	font-family:  "Georgia", Arial,  Times New Roman, Times,serif;  
	font-size: 18px;
	line-height:1.4;
 	color: #5f5f5f;
	margin:0;padding:0;	border:none;
	text-align:center;
	font-weight:normal;
	font-style:normal;
	word-wrap: break-word; 
	overflow-x: auto;
    overflow-y: scroll;
	scroll-behavior: smooth;
}
	


p, .p, p.spip {
  margin-bottom: 0.5em;
  line-height:1.4;
  margin: 0 0 0.8214285714285714em;
 
}
	
/* Paragraphes */
dl, dd, blockquote, address, pre, table, fieldset { margin-bottom: 1.5em; }




.on {
	font-weight: bolder;/*text-transform: uppercase;*/
}
/* Titraille / Intertitres */
h1,.h1,
h2,.h2,
h3,.h3,
h4,.h4,
h5,.h5,
h6,.h6 {
	display: block;
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: middle;
	color:#4a6776;}

hr {
	height: 1px;
	border: 0;
	background: #222222;
	color: #222222;
	margin-top: 1em;
	margin-right: 0;
	margin-bottom: 1em;
	margin-left: 0;
	padding-right: 5px;
	padding-left: 5px;
}

.aside hr {
	height: 1px;
	border: 0;
	background-color: #333;
	margin-top: 0.5em;
	margin-right: 0;
	margin-bottom: 0.5em;
	margin-left: 0;
	padding-right: 5px;
	padding-left: 5px;
}

h1 { font-size: 30px; line-height: 2; margin-bottom: .75em;font-weight:600!important;}
.aside  h1{	font-size: 110%!important;line-height:1.4;padding:20px}
h1, h2, h3, h4, h5, h6,.titre{
	margin:0;
	padding :20px  20px 20px 20px ;
	border:0;
	font-weight:normal;
	font-style:normal;
	font-family:inherit;
	color:inherit;
	text-align:left;
}
.titre {font-size: 20px; line-height: 2; margin:auto auto 1.5em auto ;font-weight:600!important;text-align:center;text-transform: uppercase}
.aside *.titre {font-size: 18px; line-height: 2; margin:auto auto .50em auto }


.entry-title {
  margin-bottom: 14px;
  width: 100%;
  word-wrap: break-word;
  overflow: hidden;
}

.entry-title a {
  font-family: Merriweather, serif;
  font-style: italic;
  font-weight: 700;
  color: #4a4849;
  font-size: 20px;
}
.entry-date, .entry-date a {
  color: #afafaf;
  font-weight: 700;
  font-size: 15px;
  margin: 3px 0 8px;
  position:absolute; z-index: 999;
  left:10px; bottom:20px;color:white;
 }
 





h1 {text-align:left;
	text-transform: uppercase;
	position: relative;
	overflow: hidden;
}
.am-container h2 {font-size:110%;}
/****************** style titre ******************/
.cartouche h1 {padding-bottom:1%;margin-bottom:5px;padding-left:20px;	}
.souligne  { border-bottom-width: thick; border-bottom-style: solid;}
.ombreetsouligne { text-shadow: 2px 4px 3px rgba(0,0,0,0.3);border-bottom-width: thick; border-bottom-style: solid;}
.stombre{ text-shadow: 2px 4px 3px rgba(0,0,0,0.3);}
.souligne_simple  { text-decoration:underline;text-decoration-color: red;text-decoration-style: solid;text-decoration-thickness:3px }
.normal {text-transform: none;text-shadow: none;font-style: normal}
.oblique{font-style: oblique;}


.titrespec{
  font-size: 100%; 
  font-weight:lighter; 
  text-shadow: -1px -1px #f2e9dd, 1px 1px #f4f1ee, -3px 0 4px #000;
  color:black;   
  position:absolute;
  top:20px; 
  left:20px;
  z-index:100;
 
  font-family:"Segoe print", Arial, Helvetica, sans-serif;
}

@media only screen and (min-width: 480px) {
	.titrespec{font-size: 130%!important; }
}

@media only screen and (min-width: 640px) {
	.titrespec{font-size: 150%!important; }
}

	
@media only screen and (min-width:800px) {
.titrespec{font-size: 3vw!important; line-height:3vw}
}
/******************fin  style titre ******************/
h2, h3, h4, h5, h6 {  text-align: left;margin-left: 15px;font-weight: bold}
h2 {font-size: 120%;margin-bottom: 1em; margin-left: 0; margin-bottom:10px;text-transform: uppercase }
h3,h4  {margin-bottom:10px;	text-transform: uppercase;font-style:oblique;}
h4 {font-size: 100%;margin-left: 10px;line-height:1.2;font-style:oblique;}
h5,h6{font-size:100%;font-variant: small-caps;margin-left: 15px;line-height:1.3;}
h6{font-style:oblique;margin-left:20px;}
h7 {margin-left:25px;font-size: 100%; line-height:1.2;
	font-variant: small-caps;
	font-style: oblique;
}
.text h3 {font-size: 110% }
.titrecadre {font-style:normal!important;margin-bottom:10px; font-weight: bold;font-size: 110%; 	}	

.aside h2
{text-align:center;font-size:100%;font-weight: bold;font-variant: small-caps;padding-top:3px;text-transform: uppercase;padding-bottom: 10px;line-height: 1;text-shadow: none;font-family: "Times New Roman",Times,serif;}
.aside h3{font-size:85%;text-align:center;margin-left:auto;margin-right:auto;}
.aside h4{font-size:85%;margin-left:5px;}
.aside h5{font-size:85%;margin-left:10px;}
.aside h6{font-size:85%;margin-left:15px;}
.aside h7{font-size:85%;margin-left:20px;}

.surtitre,.soustitre{font-size: 110%;
	font-weight: bolder;
	position: relative;
	margin: 3px 0px 0.75em 0;
	padding:10px;
	text-align: left;
	font-style: oblique;
	overflow: hidden;	}

.soustitre {padding: 0 30px 30px 0;margin-left:60px}
.st{	font-weight:500;}
.capitale {text-transform:capitalize}
.minuscule {text-transform:lowercase}
.minuscule *::first-letter {text-transform:uppercase}
.majuscule {text-transform:uppercase}

p::first-letter ,div::first-letter,li::first-letter,li a::first-letter, p.spip::first-letter,h1::first-letter, h2::first-letter, h3::first-letter,h4::first-letter,h5::first-letter,h6::first-letter
{text-transform: uppercase;}

.noshadow{text-shadow:none!important}
@media (max-width: 768px) {
		.marfl50{margin:10px}
		
}


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

a[hreflang]:after { content: "\0000a0(" attr(hreflang) ")"; }
a {text-decoration: none;font-weight:bold;color:inherit}
a:focus,
a:active,
a:hover{text-decoration: none;opacity: 0.5;}
a:focus .opaque,
a:hover .opaque{opacity: 0.8!important;}
a:hover .noopaque   {opacity:1!important;}
a::first-letter{text-transform:uppercase!important}
.nav a {color: #333; line-height:1.4;font-size: 16px;text-decoration: none;}
.nav a::first-letter {text-transform:uppercase;}
ul.nav  li, .aside ul.nav li{
	list-style-image:none;
	list-style-type:none;
	padding-right: 5px;
	padding-bottom: 3px;
	list-style-position: outside;
	
		
	
}	
ul.nav  li:before  {
	content:"\27A4";
	font-size: 80%;
	padding-right: 5px;text-decoration: none;color:inherit;
}	


@media  only screen and (min-width:480px) and (max-width:767px) {
	.nav ul li a { float: none; border: 0; }
}

/* Enrichissements typographiques */

strong, b { font-weight: bold; }
em, i { font-style: italic; }
small, .small { font-size: 90%; }
big, .big { font-size: 130%; }
abbr[title], acronym[title] { border-bottom: .1em dotted; cursor: help; }
.ps, .s ,.ps p , .s p{
	margin-bottom: 1.6em;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	text-align:right;
	margin-right:30px;
	font-size:20px;
	font-style:oblique;color:#000;
	
	}
.s { clear: both; font-size: .9em; }
@media print { abbr[title]:after { content: " (" attr(title) ")"; } }
dfn { font-weight: bold; font-style: italic; }
del, .del { background-color: #FFDDDD; border-color: #CC0000; color: #CC0000; text-decoration: line-through; }
ins, .ins { background-color: #DDFFDD; border-color: #00AA00; color: #00AA00; text-decoration: none; }
sup, sub { font-size: .8em; font-variant: normal; line-height: 0; }
sup { vertical-align: super; }
.ie sup { vertical-align: text-top; }
sub { vertical-align: sub; }
.ie sub { vertical-align: text-bottom; }
.caps { font-variant: small-caps; }

/* Listes */

ul, ol, li, dl, dt, dd {}
ul ul, ol ol, ul ol, ol ul { margin-top: 0; margin-bottom: 0;}
dl dt { font-weight: bold; }
dl dd {}
 @media only screen and (min-width: 480px)  {
ul.spip, ol.spip
{  margin-left: 50px;}

 }
ul li{
	text-align:left;   list-style-position: inside;	list-style-type:disc; margin-left:10px;margin-bottom:0.3em;	padding-left: 5px;
	}



	
.right_triangle:before      {content:"\27A4";}
.right_main	:before         {content:"\261E";}


.aside  {line-height:normal}
.aside ul.spip,.aside ol.spip ,.aside ul{
	list-style-position: outside;1.6em
	 }
.aside ul li, .aside ul.spip li {
	padding-left: 2px;margin-bottom:0.3em;
}

.li {list-style-position: outside;	list-style-type: square; padding-left: 6px;}
  

/* Tableaux */
/* Listes et tableaux */
dl.spip dt { background: url(img/def.png) no-repeat 25px .5em; }
dl.spip dd {}
table,table.spip { max-width: 99%;margin-right: auto; margin-left: auto; margin-bottom: 1.385em;
                   border-collapse: collapse;border-spacing: 0;}
table.spip caption { caption-side: top;text-align: center;margin-right: auto;margin-left: auto;font-weight: 700; }
table.spip thead th {  }
table.spip th, table.spip td {   border: 1px solid #ccc;}
table.spip td, table.spip th, th, td, caption { padding: .6925em;}
table.spip tfoot { border-top: 1px solid; }
caption {background: #eee;font-size: 1.09625em;
    line-height: 1.2633979475485em;
    margin-bottom: 1.2633979475485em;
    font-weight: 700;}
thead th { color: inherit; background: #dcdceb;}
th { font-weight: 700; }
tbody tr:nth-child(2n) td, tbody tr:nth-child(2n) th, tbody tr.even td, tbody tr.even th {
    background: #f3f3f8;}
tfoot { font-style: italic; }

/* Citations, code et poesie */
q { font-style: italic; }
blockquote { padding: 0 50px; }
cite { font-style: italic; }

address { font-style: italic; }

pre,code,kbd,samp,var,tt { font-family: 'Courier New', Courier, monospace; font-size: 1em; }
pre { margin: 1.5em 0;
  /* Cf.: http://perishablepress.com/press/2010/06/01/wrapping-content/ */
  white-space:pre;           /* CSS 2.0 */
  white-space:pre-wrap;      /* CSS 2.1 */
  white-space:pre-line;      /* CSS 3.0 */
  white-space:-pre-wrap;     /* Opera 4-6 */
  white-space:-o-pre-wrap;   /* Opera 7 */
  white-space:-moz-pre-wrap; /* Mozilla */
  white-space:-hp-pre-wrap;  /* HP Printers */
  word-wrap: break-word;      /* IE 5+ */
}
kbd { background-color: #222222; color: #FFFFFF; }
samp { font-weight: bold; }
var { font-style: italic; }


@media print {
  a, a:visited { color: #222222; text-decoration: underline; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
  pre, blockquote { page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}

@media (max-width: 340px) {
 h1,.h1{	font-size: 105%!important;line-height:1.4;}
 h2,.h2{	font-size: 100%!important;line-height:1.3;}
 h3,.h3{	font-size: 100%!important;}
 h4,.h4{	font-size: 95%!important;}
}

@media (min-width:341px) and (max-width: 748px)
 {
h1,.h1{	font-size: 110%!important;line-height:1.4;}
 h2,.h2{	font-size: 105%!important;line-height:1.3;}
 h3,.h3{	font-size: 100%!important;}
 h4,.h4{	font-size: 95%!important;}
}

@media (max-width: 640px) {
	* body {    line-height: 1.5!important;}
h1 {
		padding-left: 0px;
}

 
  /* fixer une largeur maximale  de 100 % aux elements potentiellement problematiques */
  img, .spip_logos,.spip_logo,table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video { max-width: 100% !important; }
  /* conserver le ratio des images, necessaire car attribut height existant */
  
  iframe {margin-left:auto!important;margin-right:auto!important;text-align:center!important;width:100%!important;max-width:100%!important;float:none;}
  
  /* gestion des mots longs */
  textarea, table, td, th, code, pre, samp { word-wrap: break-word; /* cesure forcee */ }
  code, pre, samp { white-space: pre-line; /* passage a la ligne specifique pour les elements a chasse fixe */ }
  
}
::before, ::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
::selection {
    background: #444;
    color: #FFFFFF;
}

.containertxt{margin:30px;border-radius:30px}
.containertxt p{font-size:28px;font-style:italic;margin:auto }

.aside .note .spip_logos, .aside .note img {
    float: none;
    padding: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

@media screen and (max-width:640px) and (orientation: landscape) {
  body { -webkit-text-size-adjust: 70%; }
}
@media only screen and  (max-width: 1200px){
.spip_logos,.spip_logo,img.spip_logos, img.spip_logo,.spip_logos img, .spip_logo.img{max-width:100%}
}
 @media only screen and (min-width:641px)and (max-width: 1024px) {
	 h4,.h4{	font-size: 95%!important;}
 }
.boite-line h2{
	padding-bottom: 5px;
	border-bottom-width: 12px;
	border-bottom-style: solid;
	border-bottom-color: #a90303;
}

.boite2
{
	text-align:center;
	background-color: #FFFFFF;
	padding:0px;
	color:#FF9900;
			
	border-bottom-width: 15px;
	border-bottom-style: solid;
	border-top-width: 10px;
	border-top-style: solid;
	border-top-color:   #454cff;
	border-right-color: #666;
	border-bottom-color:  #454cff;
	border-left-color: #666;
	margin-top:10px;
	margin-bottom:10px;
}

/* modeles */
.encadre {
	 padding:1em;
	 margin:2em;
	 border: 2px outset #B2B2FF;
	border-radius:15px;
	-webkit-border-radius:15px;
    position:relative;
	font: 20px Arial, Helvetica, sans-serif;
	font-weight:bold;
	overflow:auto; /* permet de creer un nouveau contexte et étend la hauteur de l'élément*/
	float: none!important;
	/*background:#D2E0FF;
	color: #0000FF;*/
	} 
 
.encadre p.spip,  .encadre p:first-letter,.encadre p.spip:first-letter   {
	font: 20px Verdana, Helvetica, sans-serif;
	font-weight:bold;
	color: #F0F;
	text-indent: 0px;
	}	

	
.encadre2 {
	border:4px solid #B2B2FF;
	font-family: Garamond, Georgia, Times, serif;
	font-size:1.6em;
	vertical-align: middle;text-align:center;
	position: relative;
	overflow: hidden;
	float: none!important;
	/*float:left;*/
	
	font-weight: bold;
	color: #333333;
	background:#e9e9e9;/* dépend du fond */
	/* clip:       rect(1em 5px 1em 5px);*/
	width: auto;
	left: auto;
	padding: 20px;
	}
 .transparent{
  opacity: 0.4;
  filter: alpha(opacity=50); /* For IE8 and earlier */
  }
.background_opacity {
position: fixed;
z-index: -10;
top: 0; left: 0; right: 0; bottom: 0;
background-color: rgba(255, 255, 255, 0.01); /* L'opacite se regle ici */
}


/* les élémenst icones dans les menus */

/* on génère un élément :after lors du survol et du focus :*/
/* <span class="infobulle" aria-label="texte de l'infobulle"> */
a .picto-item {cursor:none}

.picto-item {
  position: relative;  /*les .picto-item deviennent référents*/
  cursor: help;
  border-radius: 50%;opacity:1;z-index:1;text-align:center;margin:auto;
}
.picto-item:hover {z-index:1000;opacity:1;}
/* on génère un élément :after lors du survol et du focus :*/

.picto-item:hover:after,
.picto-item:focus:after {
  content: attr(aria-label);  /* on affiche aria-label */
  position: absolute;
  top: -2.4em;
  left: 50%;
 transform: translateX(-50%); /* on centre horizontalement  */
  z-index:1;/* pour s'afficher au dessus des éléments en position relative */
  padding: 5px 14px;
  background: #000000;
  color: #ffffff;
  border-radius: 4px;
  font-size:0.9rem!important;font-family: Arial, Helvetica, sans-serif!important;text-transform:none!important;
  display: inline-block;
  white-space: nowrap; 
 
  
}

	

@media screen and (max-width:640px)  {
li:last-child .picto-item:hover:after, #menu-button span:last-child .picto-item:hover:after
{ white-space:normal;}
}
/* Un info bulle personnalisé <a class="picto-item" href="#" aria-label="favoris">?</a> */

[aria-label]:hover:before,
[aria-label]:focus:before {
  content: "?";
  position: absolute;
  top: -1em;
  left: 50%;
  transform: translateX(-50%); /* on centre horizontalement  */
  font-size:20px;
  color:#000000;
  
}

/* pas de contour durant le :focus */
[aria-label]:focus {
  outline: none;
}


/* pour les menus */
.mcl {font-size:20px;line-height:1em;z-index:2;}
.mcl:hover, a:hover .mcl  {color:red}
/*******************************/
.souligner a
 {
    text-decoration:none;
    line-height: 1em!important;
     text-align: center;
    font-size: 1em!important;
	color:#FFFFFF;
    text-transform: uppercase;
}
.souligner a :active{color:red;}

.souligner a:after {    
    content: '';
    display: block;
    margin: auto;
    height: 3px;
    width: 0;
    background: transparent;
    transition: width .5s ease, background-color .5s ease;
}
.souligner  a:hover:after {    width: 90%;    background: #FFF;}

#menuancre{text-align:center;margin:auto;font-size:18px/1.4em;font-family: poppins;padding-top:20px;padding-bottom:20px }
#menuancre ul li {list-style-type:none;margin:auto;}
#menuancre li {padding-left:20px;margin:auto;display:inline-block;vertical-align:middle}

.sanstype {list-style-type:none}