
/*----- Mise en page et typo générale ----- */

body {
font-family: "Lucida Sans Unicode", "Lucida Sans", sans-serif;
font-weight: 100;
background: #242e30;
}
strong {
font-weight: 400;
}
#conteneur {
background: #fffff9;
margin:0;
padding:0; 
padding-top: 	150px;
padding-bottom: 30px;
min-height: 100%;
}
article { /* va aussi p. sommaire grâce à <article> */
color: #000;
width: 50%;
margin: auto auto;
text-align: left;
min-height: 100%;
}
h1 {
font-family: 'futura_condensedregular', "Lucida Sans Unicode", "Lucida Sans", sans-serif;
font-size: 2.2em;
font-weight: 600;
margin-bottom: -3px;
color: #9e9e9e;
}
p.soustitre {
letter-spacing: 1px;
margin-bottom: 12px;
margin-top: -5px;
font-weight: 400;
color: #939393;
}
p.surtitre {
letter-spacing: 1px;
position: absolute;
margin-top: -16px;
font-weight: 400;
color: #939393;
}
.main { /* Tout le contenu réel */
margin-top: -33px !important;
}
.chapo {
font-style: italic;
padding-left: 50px;
}
hr { /* Ligne horizontale */
background: 	#aaa;
color: 			#aaa;
margin-top:		-5px;
width: 			100%;
clear: both; /* important pour mep à la ligne */
}
.main h2, /* sous-titres dans le contenu */
div.ps.surlignable h2 { 
font-family: 'futura_condensedregular', "Lucida Sans Unicode", "Lucida Sans", sans-serif;
font-size: 1.7em;
font-weight: 400;
margin-bottom: 0;
color: #878787;
letter-spacing: -0.1px;
}
img.puce { /* recadrer puces perso p. défaut - oui c'est une img! */
margin-left: 0 !important;
margin-right: 0!important;
margin-bottom: 5px;
}


 /* ---------- EXPO ----------- */
 
.ContAnnonce {
position: fixed;
right: 0px;
top: 70px;
width: 290px;
height: 80px;
font-style: normal;
}
 
.annonce {
width: 320px;
background-color: #ffcc66;
font-family: 'futura_condensedregular', "Lucida Sans Unicode", "Lucida Sans", sans-serif;
font-size: 1.4em;
line-height: 1.2;
text-align: left;
font-style: normal;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 25px;
padding-right: 10px;
position: relative;
animation: mymove 1s;
animation-iteration-count: 1;
}

@keyframes mymove {
  from {left: 400px;}
  to {left: 0px;}
}

.ContAnnonce a:link {
text-decoration: none;
opacity: 0.8;
}
.ContAnnonce a:visited {
opacity: 0.5;
}
.ContAnnonce a:hover {
opacity: 1;
}

@media only screen and (max-width: 767px) {
.ContAnnonce {
right: -20px;
top: 50px;
}
}

/* --------- Sans ia --------- */

.sansia {
position: fixed;
top: 70px;
margin-left: 7px;
font-size: 1rem;
}

.anim {
animation-duration: 3s;
animation-name: defilement;
}

@keyframes defilement {
from {
translate: 150vw 0;
scale: 200% 1;
}

to {
translate: 0 0;
scale: 100% 1;
}
}

@media only screen and (max-width: 767px) {
.sansia {
top: 50px;
}
}





 /* --------------- Page Sommaire ---------------- */
/*.page_sommaire article {
width: 80%;
}*/
#descriptif_site_spip {
color: #000;
width: 80%;
margin: auto auto;
}
.page_sommaire .spip_doc_descriptif {
font-size: 1.5em;
color: #000;
margin-top:-60px;
text-align: center;
}
.page_sommaire .chapo {
font-style: normal;
padding-left: 0;
margin-bottom: -50px;
}
.page_sommaire dt.spip_doc_titre { /* garder title uniquement p. navigation */
display: none;
}
.page_sommaire .main a {
border-bottom: none;
}
.page_sommaire h3 {
font-family: 'futura_condensedregular', "Lucida Sans Unicode", "Lucida Sans", sans-serif;
font-size: 1.5em;
font-weight: 400;
margin-bottom: 0;
color: #878787;
}
.page_sommaire .chapo h2 {
margin-bottom: 25px;
}
.textearticle a {
text-decoration: none;
}

/*page_sommaire .main a:hover {
opacity: 1;
background: none;
}*/
.spip_logo {
float: none;
}
.textearticle {
position: relative;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fffff9+0,fffff9+100&1+0,1+25,0.35+75,0+100 */
background: -moz-linear-gradient(top,  rgba(255,255,249,1) 0%, rgba(255,255,249,1) 25%, rgba(255,255,249,0.35) 75%, rgba(255,255,249,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,249,1) 0%,rgba(255,255,249,1) 25%,rgba(255,255,249,0.35) 75%,rgba(255,255,249,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,249,1) 0%,rgba(255,255,249,1) 25%,rgba(255,255,249,0.35) 75%,rgba(255,255,249,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffff9', endColorstr='#00fffff9',GradientType=0 ); /* IE6-9 */

padding:      10px 10px 10px 10px;
}
.imgresume {
margin-left: -50%;
margin-right: -50%;
max-width: 200%;
}
@media only screen and (max-width: 1200px) {
.imgresume {
max-width: 100%;
}
}
@media only screen and (max-width: 767px) {
.page_sommaire article img {
margin-left: 0 !important;
margin-right: 0 !important;
}
.spip_logo_center {
margin-left: 0;
}
.imgresume {
margin-left: -13%;
margin-right: 0;
}
}






/*----- placement du texte des résumés -----*/
@media only screen and (max-width: 525px) {
.textearticle {
top:          140px;
margin-top: -100px;
}
}
@media only screen and (min-width: 525px) {
.textearticle {
top:          140px;
margin-top: -100px;
}
}
@media only screen and (min-width: 767px) {
.textearticle {
top:          160px;
margin-top: -120px;
}
}
@media only screen and (min-width: 837px) {
.textearticle {
top:          160px;
margin-top: -120px;
}
}
@media only screen and (min-width: 984px) {
.textearticle {
top:          140px;
margin-top: -80px;
}
}
@media only screen and (min-width: 1147px) {
.textearticle {
top:          130px;
margin-top: -80px;
}
}
@media only screen and (min-width: 1354px) {
.textearticle {
top:          110px;
margin-top: -80px;
}
}
@media only screen and (min-width: 2180px) {
.textearticle {
top:          90px;
margin-top: -70px;
}
}







/* ------ Texte en colonnes ------ 
.colonne .colonnes { 
float: left; 
text-align: left;
margin-bottom: -10px;
margin-top: 10px;
}
@media (min-width: 768px) {
.colonne .colonnes {
width: 50%; 
padding-right: 5%;
}
}
@media (min-width: 979px) { 
.colonne .colonnes { 
width: 50%;
padding-right: 5%;
}
}
@media (min-width: 1200px) { /* grand format 
.colonne .colonnes { 
width: 50%;
padding-right: 5%;
}
}
.colonne .colonnes hr { /* pour neutraliser le nouveau hr 
padding-top: 0px; 
}
.neutralise { /* pour neutraliser le PS qui remonte dans les colonnes 
clear: left;
}
.colonne img {
margin-left: 0;
margin-right: 0;
margin-top: -20px;
max-width: 100%;
}

*/


/* ---------- Pied ---------- */
.lignemenu { /* ligne pointillée */
border-bottom: 1px dotted #999;
margin-left: 30px;
margin-bottom: 10px;
}
#cd-lateral-nav .pied a {
padding: 5px 0px 5px 0px;
display: inline;
}
.pied { /* Texte dans la colonne du menu */
position: relative;
background: #242e30;
bottom: 0px;
height: 100px;
width: 210px;
margin: 0px 20px 0px 30px;
}
.piedsup {
font-size: 100%;
}
.piedinf {
font-size: 75%;
background:	transparent;
}
/*--- Social tags ---*/
.socialtags a:hover { /* pour enlever survol socialtags */
background-color:	transparent;
}
.socialtags img {
height: 24px !important;	
max-width:24px !important;
margin-right:	10px !important;
}
.socialtags {
float: 	left;
}
div.socialtags {
	clear:		none !important;
	padding:0px !important;
}
.socialtags-hovers {
	opacity: 1.0 !important;
	filter: alpha(opacity=100);
}
.socialtags-hovers:hover {
	opacity: none !important;
	filter: alpha(opacity=0);
	height: 24px !important;	
max-width:24px !important;
}
.rss {
padding-top: 2px;
}




/* ---------- Liens ---------- */
.main a,
.piedpage a,
div.ps.surlignable a {
text-decoration: none;
border-bottom: 1px solid #ffab00;
}
.main a:hover,
.piedpage a:hover,
div.ps.surlignable a:hover {
background:  #ffab00;
opacity: 0.5;
}
/*pour liens ouvrants*/
.spip_out { 
background: url(../img/external.gif) no-repeat right 50%; 
padding-right: 14px
}
a.spip_out:after, a.external:after { /* p. supprimer l'icone ouvrante par défaut */
content:none;
}




/* ---------- Media queries ---------- */
@media only screen and (max-width: 767px) {
#conteneur {
margin: 0 -20px 0 -20px;
}
article { /* adapt. colonage */
width: 80% !important;
}
article img { /* adapt. colonage */
margin-left: -65% !important;
margin-right: -65% !important;
}
img { /* adapt. colonage */
max-width: 125% !important; /* adapt. colonage */
}
headermenu {
height: 70px !important;
top: -20px !important;
}
#cd-menu-trigger .cd-menu-icon {
top: 58% !important;
}
h1#logo_site_spip {
margin-right: -70px !important;
font-size: 1.8em !important;
margin-top: 0.55em !important;
}
h1 small {
padding-left: 0px !important;
}
#cd-menu-trigger .cd-menu-icon {
top: 3.1em !important; /* placement en hauteur de l'icone */
}
hr { /* Ligne horizontale p. Contexte */
margin-top:		0px;
}
}
/* p. enlever le header en format paysage */
@media only screen and (max-width: 767px) and (orientation:landscape) {
headermenu {
top: -70px !important;
}
#cd-menu-trigger {
top: 50px !important;
}
}
/* visibilité du texte illustrateur.ch car manque de place */
@media only screen and (max-width: 300px) {
h1 small {
visibility: hidden;
}
}



/* ---------- Images ---------- */
article img { /* 1200 de large ou 1000 de haut */
/* width: 200%; */
margin-left: -50%;
margin-right: -50%;
max-width: 200%;
max-height: 1000px;
width: auto;
}
dd.spip_doc_descriptif, 
dt.spip_doc_titre {
text-align: left;
width: 100% !important; /* largeur surtout pour Contexte */
}
dt.spip_doc_titre {
margin-top: 6px;
font-weight: 400;
}
.spip_documents, 
.spip_documents_center, 
.spip_doc_titre, 
.spip_doc_descriptif {
margin-right: 0;
margin-left: 0;
font-size: 92%;
color: #888;
}
.article_sansimg .spip_documents { /* p. img page à propos */
margin-right: 10px;
margin-bottom: 5px;
margin-top: 7px;
}
.spip_documents.spip_documents_center { /* espace entre images sur la page */
margin-bottom: 100px;
}
.spip_documents a, 
.spip_documents_center a, 
.spip_doc_titre a, 
.spip_doc_descriptif a {
color: #888;
}
.cs_blocs img {
padding-right: 30px;
}
.article_cycleCor article .spip_documents_left { /* p. cibler uniquement les imagettes de légendes sans toucher au diaporama qui réagit à img */
padding-right: 10px;
margin-bottom: 0;
}
.article_cycleCor article .spip_documents.spip_documents_center { /* p. tenir image pano */
margin-bottom: -20px;
margin-top: 7px;
}
.article_cycleCor article img { /* p. tenir image pano */
max-width: 939px !important;
width: 100%;
}
.credits {
text-align: left;
color: #888;
}
.article_cyclePia article img,
.article_contes article img  { 
border: 1px #ccc solid;
}
.article_contes article .spip_documents_left img,
.article_contes article .spip_documents_right img { /* p. figurines crayon */
border: none !important;
margin-bottom: -10px;
margin-top: -10px;
}
.article_souris article .spip_documents.spip_documents_center {
/* espace entre images sur la page */
margin-bottom: 0px; 
margin-top: 100px;
}
.article_souris article .spip_documents.spip_documents_left { /* réglage 1re image */
margin-bottom: -20px !important;
margin-top: -20px !important;
}
.article_souris article hr {
margin-top: -17px;
}




/* ----- Diaporama ----- */
.article_cyclePia article, 
.article_cycleRet article, 
.article_cycleCor article {  /*élargir texte p. maintenir largeur image */
width: 80%;
} 
.article_cycleRet article img { 
border: 1px #fffff9 solid; /* couleur de fond! */
}
.article_cycleRet .pre1, .pre2, .pre3, .pre4, .prev5 { /* p. légende avant/après, en relation avec la commande suivante */
margin-left: 40%;
position: relative;
top: -95px;
}
.article_cycleRet .suiv1, .suiv2, .suiv3, .suiv4, .suiv5 { /* p. légende avant/après, en relation avec la commande suivante */
margin-left: 1%;
position: relative;
top: -95px;
}
.article_cycleRet div.cycle-slideshow {
margin-bottom: 100px;
}

div.cycle-slideshow { /* compensation  du border */
max-width: 642px !important;
}

.article_cycleCor div.cycle-slideshow { /* ANNULATION-compensation  du border */
max-width: 939px !important;
}

.cycle-next {
right: 0;
background: url("../img/flechR.png") 100% 50% no-repeat;
margin-right: -25px;
}
.cycle-prev {
left: 0;
background: url("../img/flechG.png") 0% 50% no-repeat;
margin-left: -25px;
}
.article_cycleCor .cycle-next {
background: url("../img/flechDr.png") 98% 50% no-repeat !important;
margin-right: 0px;
}
.article_cycleCor .cycle-prev {
background: url("../img/flechGr.png") 2% 50% no-repeat !important;
margin-left: 0px;
}
.article_cycleCor .cycle-prev:hover, 
.article_cycleCor .cycle-next:hover {
opacity: .6;
}
.cycle-caption {
position: absolute;
color: white;
font-weight: 400;
bottom: 1px !important;
right: 10px !important;
z-index: 700;
}
.cycle-overlay { /* p. titre et légende */
font-family: "Lucida Sans Unicode", "Lucida Sans", sans-serif;
font-weight: 100
position: absolute;
bottom: -62px;
left: 70px;
width: 80%; 
z-index: 600;
background: 0; 
color: #777;
padding: 15px;
opacity: 1; 
font-size: 85%;
}

@media only screen and (max-width: 767px) {
.article_cyclePia article img,
.article_cycleRet article img, 
.article_cycleCor article img,
.piedpage img { 
margin-left: 0 !important;
margin-right: 0 !important;
}
.cycle-overlay {
left: 5px;
width: 100%;
}
.cycle-next,
.cycle-prev {
background-size: 20px;
margin: 0px -20px 0px -20px;
}
}
/* ----- FIN Diaporama ----- */



/* ---------- Blocs dépliables p. article ---------- 
 -------- réglages par rapport à blocs p. menu -------- */
.main h4.blocs_titre.cs_done,
.main h4.blocs_titre.cs_done .on,
.main h4.blocs_titre.cs_done a .on,
.main h4.blocs_titre.blocs_replie.cs_done,
.main h4.blocs_titre.blocs_replie.cs_done .on, 
.main h4.blocs_titre.blocs_replie.cs_done a.on {
text-transform: none !important;
color: #000 !important;
}
.main .blocs_titre {
background:transparent url("../img/triangleJ-bas.png") no-repeat scroll left center !important;
padding: 0pt 0pt 0pt 20px;
}
.main .blocs_replie {
background:transparent url("../img/triangleJ.png") no-repeat scroll left center !important;
}
.spip_doc_descriptif div.blocs_invisible { /* hauteur du dépliable p. éjecter le texte suivant de la page */
height: 320px;
}



/* ---------- Tableaux pour page Référence ---------- */

.article_tablo .table th { 
border-bottom: 	1px solid;
}
.article_tablo .table.spip {
border-bottom: 	0px solid;
}
/*.article_tablo .numeric {
font-weight: 600;
}*/
.article_tablo strong {
font-weight: 600;
}
.article_tablo .main h2 {
margin-bottom: 9px;
margin-top: 70px;
}
.article_tablo hr {
margin-bottom: -3px;
background: #000;
color: #000;
}

@media only screen and (max-width: 640px) {
.article_tablo .table caption, table.spip caption, .table th, table.spip th, .table td, table.spip td {
padding: 0.1em !important;
line-height: 1.5;
}
}


/* FORMULAIRES 
___________________________________________________*/

#FormContact { 
background-color: 	#f0f1eb; 
padding: 			15px; 
}
.FormCheck label { 
display:		 inline;
padding-left:	   10px;
}
input[type="radio"], input[type="checkbox"] {
margin:			0;
}
.FormText label { 
display:		 inline;
}
.oblig,
.rouge,
.erreur,
.erreur_message,  
.formulaire_erreur,  
.formulaire_message,
.formulaire_ok { 
color: 				#c00;
}
.erreur {
font-style: 		italic; 
display: 			block; 
}

/*___________________________________________________*/
/* ----- Pied de page -----*/

.piedpage {
text-align: center;
position: relative;
bottom: -30px;
}
.mini {
font-size: 75%;
line-height: 1.3;
/*color: #fff;*/
}
.piedpage img {
margin-left: 0%;
margin-right: 0%;
width: auto !important;
}
.copy {
background-color: #364649;
color: #aab5b7;
padding-bottom: 20px;
}
.copy strong {
font-weight: 600;
}




/*___________________________________________________*/

/* Boutons d'administration */
.spip-admin-float { 
right: 40% !important;
}