/*Erik Soulard 4 HYPTIQUE*/
* {margin: 0; padding: 0;}
img {border: none}
body {
	background: #294f58;
	color: #787777;
	font: normal 62.5% Arial,sans-serif;
	padding: 2% 0;
}

/*style des polices*/
.bold {font-weight: bold}
.italic {font-style: italic;}
.chapo {font-weight: bold; font-size:1.2em; }
.caractencadre-spip{color:#2D405E}

/*liens declinable selon l'id de la rubrique avec le selecteur .l_rubx a et .l_rubx a:hover 
ou x correspond a l'id de la rubrique */
a, a.spip_in, a.spip_out, a.spip_glossaire {color: #294f58;}
a:hover, a:active, a:focus {color: #f39a20;text-decoration: none  }

/*titres*/
h1,h2,h3,h4, h3.spip, h4.spip, h5.spip {color: #f39920; padding: 8px 0 0;text-align:left;}
h1 {font: normal 1.8em sans-serif,serif; color:#f39920}
h1 a, h2 a, h3 a, h4 a {text-decoration: none;}
h2 {font: normal 1.4em sans-serif,serif; color:#f39920;}
h3.spip {font: bold 1.0em sans-serif,serif;text-align:left;padding: 8px 0 0;margin:0 0; color:#8a8989;}
h3 {font: bold 1.0em sans-serif,serif; margin-top: 5px; color:#8a8989;}
h4 {font: normal 1.0em sans-serif,serif; margin-top: 5px; color:#8a8989;}
h5 {font: 0.8em sans-serif,serif; margin-top: 5px; color:#8a8989;}
/*temoin de navigation*/
.fil {margin-top: 5px; padding: 0 0 13px 0; font: normal 0.8em Arial,sans-serif; color: #527178;}

form,table {margin-bottom: 1.0em;}
label {display: block;}
li {line-height: 1.5em;}
p, div.spip {padding: 2px 0 10px;}
ul,ol {padding: 0 2em 1.2em;}
div.texteencadre-spip {
background:#FBF9F4;
border:1px solid #9c8f70;
color:#333;
margin:1em 0;
padding: 10px;
position:relative;
}
textarea{
	font: normal 1em Arial,sans-serif;
	/*color:#8b8a89;*/
}

/*structure de la page*/
#principale {
	background: #FBF9F4;
	margin: 0 auto;
	width: 100em;
}
/*conteneur titre*/
#conteneur {
	border-top: 6px solid #fff;
	font-size: 1.3em;
	line-height: 1.3em;
	margin-left: 6px; margin-right: 6px;
}
.titre {
	border-top: 1px solid #996;
	background-color: #fff;
}
/*titre texte au dessus de l'image bandeau
.titre h1 {
	color: #441;
	font: normal 2.2em Georgia,"Trebuchet MS",sans-serif;
	padding: 10px 0 10px 18px;
}*/

/*bandeau image*/
.bandeau {
	border-top: 2px solid #fff;
	background: #fff;
	font-size: 1em; height: 166px; width: 987px;
	border-bottom:9px solid #FFFFFF;
}
.bandeau img {
	width: 987px; 
	height: 166px;
	display:block;
}/* > si on veut que firefox grossisse les images*/

/*navigation > menu horizontal*/
.navigation {
	background: #294f58;
	font-size: 0.77em; 
	float: left;
	/*background: #fff4ca;*/ 
	border-top: 1px solid #294f58; 
	border-bottom: 1px solid #294f58;	
	position:relative;
	width:788px;
	height:30px;
}
.navigation ul{
	float: left; padding: 0;
	position:relative;
	z-index:5;
}

.navigation ul ul{
	float: none; padding: 0; display:block;width:200px;
}
.navigation li{
	list-style: none;display:block;position:relative;	
}

.navigation li li{
	float: none; padding: 0; display:block;width:100%;position:relative;z-index:10;
}

.navigation .navfxenabled li {
	float: left; list-style: none;display:inline;position:relative;
	padding: 0 0 0 0;
	margin: 0 -1px 0 0;
}

.navigation  a, .navigation  span  {
	background: #294f58;
	border-right: 1px solid #294f58;
	color: #fff;
	font: 1.3em Arial,sans-serif;
	font-weight: normal;
	padding: 0 7px;
	line-height: 2.3em;
	text-align: center;
	text-decoration: none;
	display:inline;
	z-index:8;
}

.navigation .navfxenabled a, .navigation .navfxenabled span  {
	background: #294f58;
	border-right: 1px solid #294f58;
	border-left: 1px solid #294f58;
	border-bottom: 1px solid #294f58;
	color: #fff;
	float: left;
	font: 1.3em Arial,sans-serif;
	font-weight: normal;
	padding: 0 7px;
	line-height: 30px;
	text-align: center;
	text-decoration: none;
	display:inline;
	z-index:8;	
}

.navigation .navfxenabled li li a, .navigation li li a{
	background:#527178;
	float:left;
	display:inline;
	width:100%;
	z-index:12;	
	text-align:left;
	border-bottom:1px solid #fff;
}
.navigation .navfxenabled li li a:hover, .navigation li li a:hover{
	background-color:#294f58;
	color:#cce805;
}

* html .navigation  li  a, * html .navigation  li  li{
	height:1%;
}
#nav3 .navfxenabled li:hover ul {
	left: -2px;
}
#nav3 .navfxenabled li ul {
	position: absolute;
	left: -999em;
	height: auto;
	font-weight: normal;
	z-index:10;
	padding: 0 0 0 0;
	margin: 31px 0 0 0;
}

#nav3 .navfxenabled li.over ul{
	left: 0;
	z-index:10;	
}

.navigation  ul li.over ul.leftover{
	left: -150px;
}



/*couleurs de roll (hover) + etat selectionne des rubriques
si on veut des couleur specifiques entre les etats roll et selectionnes, il faut faire deux lignes 
comme pour la partie 'accueil' (ici reglee sur la meme couleur
*/
.navigation a.rubrik:focus,
.navigation a.rubrik:hover,
.navigation a.rubrik:active{
	background-color:#ebeaea;
	color: #434343;
	margin : 0 0 0 0;
}

.navigation span.activeRubrik, .navigation a.activeRubrik {
	background-color:#cce805;
	color: #294f58;
	margin : 0 0 0 0;
}

/*moteur de recherche*/
.mrecherche {
background:#cce805;
float:left;
padding:0 0 0 0;
font-size:10px;
line-height:13px;
position:relative;
width:198px;
height:30px;
border-top: 1px solid #294f58; 
border-bottom: 1px solid #294f58;
border-right: 1px solid #294f58;
}
/*.ie11 .mrecherche{
	margin-left: 786px;
	margin-top: -32px;
}*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.mrecherche {

		width: 192px;
	}
}

#searchform{
	margin:0 5px 0 0;
	padding:6px 0 0 0;
}

/*
* html #searchform input{
margin-top:-4px;
}
*/
#searchform input.btsubmit{
background-color:#f3991e;
font-size:1.2em;
border:none;
color:#fff;
margin-left:15px;
padding:0 3px;
}

#formulaire_recherche{border:none;}

#searchform #recherche {
color:#5b7b3b;
font-size:1.2em;
height:14px !important;
left:8px;
padding:0 2px 0 0;
position:relative;
text-indent:2px;
top: 0 !important;
width:132px;
}

#liste_recherche{
	list-style-type:none;
	padding:0 2em 0.5em 0;
}

#liste_recherche li{
	border-bottom:1px solid #eaeaea;
	padding:0.6em 1em 2em;	
}

#liste_recherche li h3{
	font-weight:normal;
	font-size:1em;
}

#liste_recherche li h3 span{
	color:#000;
	
}

/*conteneurs gauche et droit*/
.deuxColonnes{background: url("../img/pix.gif") bottom left no-repeat}
.deuxColonnes .colonne_gauche {width: 20%; background: #fbfafa}
.deuxColonnes .colonne_droite {width: 60%}
.contenu {padding: 18px 20px}
.colonne_droite {float: left;}
.colonne_gauche {float: left;}
#contenuGauche h2 {
	font-size: 1.0em;
	color: #294f58;
	font-weight:bold;
	border-bottom: 2px solid #cce805;
	padding-bottom: 4px;
	width:162px;
}
#contenuGauche h2 a{color: #294f58;}
#contenuGauche h2 a:hover,
#contenuGauche h2 a:active,
#contenuGauche h2 a:focus {background:#294f58; color:#cce805; font-weight:bold;}

.colonne_droite div.contenu p{line-height: 1.6em;  padding: 0.6em 0 10px 0;}
.colonne_droite div.contenu ul{line-height: 1.2em; padding-top: 0.5em;}

/*bloc news extreme droite*/
.deuxColonnes .news {width: 20%; float: left}
.deuxColonnes .news .contenuNews {margin: 29px 0 0 0; background: #f5fdba}
.contenuNews p {padding: 0 10px 10px 10px; color: #f39920;}
.contenuNews .dateNews {font-weight: bold;padding: 0 10px 10px 10px;}
.dateNews {
	color:#abaaaa;
}
.contenuNews h3 {padding: 10px; color: #fff; font-weight: bold;}
.contenuNews a {color: #61426C;}
.contenuNews a:hover {background: none repeat scroll 0; color:#537178;}

/*liens declinable selon l'id de la rubrique avec le selecteur .c_rubx a et .c_rubx a:hover 
ou x correspond a l'id de la rubrique */

/*style du tableau*/
table.spip{width:550px;}
table.spip caption {font-family:Arial,sans-serif; font-weight: bold; text-align: left; color: #666666; padding: 0 0 8px 0;}
table.spip th{font-family:Arial,sans-serif; font-weight: bold; text-align: left; color: #ffffff; background: #294f58;padding: 10px 3px 10px 5px;}
table.spip td{padding: 8px; width: 33%; border: 1px solid #999999; font-size:1.2em; vertical-align: top; color: #000000;}
table.spip tr.row_even {background: #cccccc}
table.spip tr.row_odd {
background:#FFF;
}
/*menu vertical*/
ul.blocListe {
	border-top: 2px solid #fff4ca;
	margin: 4px 0;
	padding: 0;
	width: 90%;
}
.blocListe li {
	border-bottom: 1px dashed #BCBAAC;
	list-style: none;
	font-weight:bold;
	display: block;
	font-size:0.9em;
}
.blocListe li a,.blocListe li em {
	color: #553;
	display: block;
}
.blocListe li em {
	font-size: 0.9em;
	font-style: normal;
}
.blocListe li a {
	padding: 4px 3%;
	text-decoration: none;
	width: 94%;
}
.blocListe li a span {font-weight: bold;}
.blocListe li a:hover, .blocListe li a:active, .blocListe li a:focus  {
	background: #274f58;
	color: #fff;
	font-weight:bold;
}
.blocListe li span {font-weight: normal; color: #294f58; padding: 4px 3%;display: block;}

/*pied de page*/
.pied {
background: #d4eb2a;
color: #274f58;
height: 40px;
border-bottom: 6px solid #FFF;
}
.pied p {
width:500px;
padding: 12px 0 0 6px;
}
.pied a {
color: #274f58;
text-decoration: underline; 
padding: 0 0 0 4px;
margin: 0 0 0 0;
}/*lien pied de page*/
.pied a img{ 
padding: 0 0 0 0;
margin: 0 0 -3px 0;
}
/*lien pied de page*/
.pied a:hover, .pied a:active, .pied a:focus  {color: #274f58; text-decoration:none;}

/*********************************************************************/

/*mise a zero // float*/
.clear,.clearer {clear: both; height:0; overflow:hidden;}
.clearerGris {clear: both; border-bottom: 1px dashed #BCBAAC; margin-bottom: 20px;}
.clearerGris_ {clear: both; border-bottom: 1px dashed #BCBAAC; margin-top: -20px}
.invisible {position: absolute; top:-300em; left:-300em; overflow:hidden; height:1px;}

/*********************************************************************/

/*specificites article + Accueil*/
.titreArticle_Accueil {
	font-size: 1.4em;
}

.titreArticle_Accueil a{
	text-decoration:none;
	color:#f39920;
}

.titreArticle_Accueil a:hover{
	text-decoration:none;
	color:#527178;
}

/*specificites article*/
/*titre*/
.cTitreText {
	width: 80%; float: left;
}
.cTitreIco {
	width: 20%; float: left;
}
.cTitreIco p {text-align: right; margin-top: 8px;}

.cTitreIco p a:hover{background:transparent;}
.cTitreIco p a:hover span {background:#274f58;}

/*image chapeau*/
#chapo_ img{
	float: left; margin-right: 10px;
}

/*bloc news extreme droite*/
.conteneurArticle {width: 80%; float: left;}
.conteneurArticle .article_long {width: 99.1%; background: #dee2e1; float: left; margin: 10px 0 0;}
.article_long p.image img{float: right;}
.conteneurArticle .article_court {width: 49.6%; float: left; margin: 7px 0 0;}

/*separation entre les 2 articles / colonne du milieu, il faut que le contenu de gauche soit le plus long pour les pointill�s*/
#premierArticleGauche {border-right: 1px dashed #8a8989;}

/*colonne des entrees d'articles de droite*/
.listArticle {width: 20%; float: right}
.introArticle {margin: 7px 0 0 0; background: #daee4a}
.introArticle_ {margin: 10px 0 0 0; background: #daee4a}/*premiere intro*/
.introArticle_ p, .introArticle p {padding: 0 10px 10px}
.introArticle_ p.dateNews, .introArticle p.dateNews {padding: 0 10px 0 10px; color: #71527C;}
.introArticle_ h3, .introArticle h3 {padding: 10px 10px 0; font-weight:bold;}
.contenu {padding: 18px 20px}
.article_droite .contenu {padding: 18px 0; margin: 0 20px}

/*specificites liste*/
.titreList {background: #def05c; color: #fff; line-height: 30px; padding: 0 5px; margin-top: 5px; margin-bottom:5px; font-size: 1.1em;
	border:1px solid #def05c;
}
.titreList a{color:#61426C;}
.titreList a:hover, .titreList a:active, .titreList a:focus {color: #527178; text-decoration:none;}
.pListImg {line-height: 1.6em; padding-top: 0.6em;}
.pListImg img{float: right;}

/*paragraphe avec lien de telechargement*/
.dlLink {line-height: 2.5em; padding-top: 0; font-weight:bold; font-size:1.2em;}
.dlLink img{float: left; margin-right: 3px;}
.dlLink a {color: #fff4ca;}
.dlLink a:hover, .dlLink a:active, .dlLink a:focus {color: #FFF; background: #fff4ca;}

/*formulaire envoye ami*/
form.envoyer {
clear:both;
margin:0;
padding:0;
text-align:center;
}
form.envoyer fieldset {
border:1px solid #ACB3C6;
margin:10px;
padding:10px;
text-align:left;
}
form.envoyer fieldset input, form.envoyer fieldset textarea {
margin-bottom:3px;
width:240px;
}
form.envoyer fieldset select {
margin-bottom:3px;
}
form.envoyer fieldset textarea {
height:80px;
}
form.envoyer fieldset input.checkbox {
width:auto;
}
form.envoyer legend {
font-weight:bold;
}
form.envoyer label {
float:left;
margin-top:2px;
width:160px;
}
form.envoyer label.label {
width:260px;
}
a.zip {
	background: url(../img/ico_zip.gif) no-repeat top left;
	padding: 2px 0 2px 20px;
	vertical-align:middle;
	text-decoration:underline;
	color:#71527C;
}

a.pdf {
	background: url(../img/ico_pdf.gif) no-repeat top left;
	padding: 2px 0 2px 20px;
	vertical-align:middle;
	text-decoration:underline;
	color:#71527C;
}

a.excel {
	background: url(../img/ico_xls.gif) no-repeat top left;
	padding: 2px 0 2px 20px;
	vertical-align:middle;
	text-decoration:underline;
	color:#71527C;
}

a.word,
a.rtf {
	background: url(../img/ico_doc.gif) no-repeat top left;
	padding: 2px 0 2px 20px;
	vertical-align:middle;
	text-decoration:underline;
	color:#71527C;
}

a.powerpoint {
	background: url(../img/ico_ppt.gif) no-repeat top left;
	padding: 2px 0 2px 20px;
	vertical-align:middle;
	text-decoration:underline;
	color:#71527C;
}

a.zip:hover,a.zip:active,a.zip:focus,
a.powerpoint:hover,a.powerpoint:active,a.powerpoint:focus,
a.rtf:hover,a.rtf:active,a.rtf:focus,
a.word:hover,a.word:active,a.word:focus,
a.excel:hover,a.excel:active,a.excel:focus,
a.pdf:hover,a.pdf:active,a.pdf:focus {
	color:#71527C;
	text-decoration:none;
}

.spip_documents {
	text-align:left;
	margin-bottom: 10px;
}