/* 	
	--> Complément CSS principal aux feuilles de styles de SPIP
	Auteur	:	Mickael Bertainchant
	Site		:	http://ia62.ac-lille.fr

	
	Palettes des couleurs  :
	
		Vert foncé dominant	:	#888F6B
		Vert clair dominant	: 	#DDE9AF
		Vert fond menu		:	#B7BE9C
		Rouge Sang			:	#B82F00
		maron			:	#8c6558
	
*/

/* Définition des éléments typographiques_________________________________________________________________________________________*/

*{
	font-family: arial, helvetica, sans-serif;
	font-size: 11px;
}

body{
	margin: 0px;
	padding: 0px;
	/* background-color: #f2f0eb; */
	background:URL('images/BodyBg.jpg') center repeat-y;
}

#colonne_gauche h1, #colonne_droite h1{
	background:url('images/bg_fondMenu_rouge.jpg') repeat-x;
	padding: 0px 5px 0px 0px;   /* Hummm me rappel plus pourquoi j'ai mis cette ligne, apparement elle ne sert plus a rien */	
	font-size: 16px;
	color: #FFFFFF;
	border-top: 2px solid #FFFFFF;
	border-bottom: 2px solid #FFFFFF;
}

#news h1{
	background:url('images/bg_fondMenu_vert.jpg') repeat-x;
}

#navLinks h1{
	background:url('images/bg_fondMenu_orange.jpg') repeat-x;
}

/* Typographiqe et Couleur des titres d'Article, de rubrique dans la zone centrale */
#zonetext h1, #zonetext h1 a:visited, #zonetext h1 a:link{
	/* color: #B82F00; */
	color: #8c6558;
	text-decoration: none;
	background: none;
	font-size: 18px;
}

#zonetext h2, #zonetext h2 a:visited, #zonetext h2 a:link{
	color: #B82F00;
	text-decoration: none;
	background: none;
	font-size: 16px;
}

/* _____ Tableaux _____ */
/* tr{
	color: #FFFFFF;
	line-height: 15px;
	background-color : #888F6B;
}

td{
	color: #000000;
	line-height: 15px;
	background-color : #DDE9AF;
} */


/* Class' ___________________________________________________________________________________________________________________*/

.descriptifAccueil{
	background: transparent url('images/corner-bas-droite.png') bottom right no-repeat;
	/* background: transparent url('images/bg_degrade_descriptif.gif') repeat-x; */
}

.descriptifAccueil{
	width: 815px;
	padding: 10px 10px 10px 10px;
	margin: 3px auto;
	/* border: 1px solid #888F6B;  */
}

.descriptifAccueil{
	text-align: justify;
}

.descriptifAccueil h1, h2{
	margin: 	0px 0px 0px 0px;
	padding:	0px 0px 0px 0px;
	/* border: 1px solid #FFBBBB; */
}

.descriptifAccueil p {
	margin: 	10px 0px 10px 0px;
	padding: 0px;
	text-align: right;
	text-align: justify;
	/* border: 1px solid #FFBBBB; */
}

.descriptifAccueil img {
	float: left;
	margin: 0px 10px 0px 0px;		/* Ajoute une bordue de 10 pixel entre l'image et le texte */
	/* border: 1px solid #00BBFF; */
}

.descriptifAccueil #both{
	clear: both;	/* Reinitialise le flux CSS pour que les elements qui se trouvent apres un descriptif de rubrique ou de sous rubrique soient correctement inséré dans ce même flux */
}

/* ################################################################################################### */

.descriptifRubrique{
	background: transparent url('images/bg_degrade_descriptif.png') repeat-x;
}

.descriptifRubrique{
	width: 815px;
	padding: 10px 10px 10px 10px;
	margin: 3px auto;
	background-color: #F8FBEB;	 	/* Couleur du fond de la description */
	border: 1px solid #888F6B; 		/* Couleur du cadre du descriptif */
}

.descriptifRubrique{
	text-align: justify;
}

.descriptifRubrique h1, h2{
	margin: 	0px 0px 0px 0px;
	padding:	0px 0px 0px 0px;
	/* border: 1px solid #FFBBBB; */
}

.descriptifRubrique p {
	margin: 	10px 0px 10px 0px;
	padding: 0px;
	text-align: right;
	text-align: justify;
	/* border: 1px solid #FFBBBB; */
}

.descriptifRubrique img {
	float: left;
	margin: 0px 10px 0px 0px;		/* Ajoute une bordue de 10 pixel entre l'image et le texte */
	/* border: 1px solid #00BBFF; */
}

.descriptifRubrique #both{
	clear: both;	/* Reinitialise le flux CSS pour que les elements qui se trouvent apres un descriptif de rubrique ou de sous rubrique soient correctement inséré dans ce même flux */
}

/* ############################################################################################# */

.descriptifSousRubrique{
	background: transparent url('images/bg_degrade_ssrub.jpg') repeat-x;
}

.descriptifSousRubrique{
	width: 815px;
	padding: 10px 10px 10px 10px;
	margin: 3px auto;
	background-color: #F0F0F0;
	border: 1px solid #BBBBBB; 
}

.descriptifSousRubrique{
	text-align: justify;
}

.descriptifSousRubrique h1, h2{
	margin: 	0px 0px 0px 0px;
	padding:	0px 0px 0px 0px;
	/* border: 1px solid #FFBBBB; */
}

.descriptifSousRubrique p {
	margin: 	10px 0px 10px 0px;
	padding: 0px;
	/* text-align: right; */
	text-align: justify;
	/* border: 1px solid #FFBBBB; */
}

.descriptifSousRubrique img {
	float: left;
	margin: 0px 10px 0px 0px;		/* Ajoute une bordue de 10 pixel entre l'image et le texte */
	/* border: 1px solid #00BBFF; */
}

.descriptifSousRubrique #both{
	clear: both;	/* Reinitialise le flux CSS pour que les elements qui se trouvent apres un descriptif de rubrique ou de sous rubrique soient correctement inséré dans ce même flux */
}

.descriptifSousRubrique small{
	color : #B82F00;
}

.descriptifSousRubrique small.petitGris{
	color : #999999;		/* Pour afficher "Nombre d'articles : " en gris */
}

.descriptifSousRubrique p.droiteNbArticle{
	text-align: right;	/* On ne peut pas reutiliser la classe right ici car on formate de maniere generale toutes balises <p></p> contenues dans la classe .descriptifSousRubrique, c'est pourquoi on crée cette sous classe */
}

/* #################################################################################################### */

.article{
/* PROBLEME de Flux avec IE */
/* si on utilise un style italique et/ou gras dont la phrase comporte un ou plusieurs retours,  Il faut donc prévoir une zone morte */
	width: 813px;					/* 615px */
	padding: 5px 10px 10px 10px;	 
	margin: 3px auto;
	text-align: justify;			/* Texte Justifié pour tout les artciles */
	background: transparent url('images/corner.png') no-repeat;
}

.article small.petitGris{
	color : #999999;		/* Pour afficher "Publié le : " en gris */
}

.article small{
	color : #B82F00;
}

.article {
	color : #000000;	/* Couleur police des article */
}

.article img {
	float: left;
	margin: 0px 10px 0px 0px;		/* Ajoute une bordue de 10 pixel entre l'image et le texte */
	/* border: 1px solid #00BBFF; */
}

/* #################################################################################################### */

.standard{
/* PROBLEME de Flux avec IE */
/* si on utilise un style italique et/ou gras dont la phrase comporte un ou plusieurs retours,  Il faut donc prévoir une zone morte */
	width: 813px;					/* 615px */
	padding: 5px 10px 10px 10px;	 
	margin: 3px auto;
	text-align: justify;			/* Texte Justifié pour tout les artciles */
	background: transparent url('images/corner.png') no-repeat;
}

.standard small.petitGris{
	color : #999999;		/* Pour afficher "Publié le : " en gris */
}

.standard small{
	color : #B82F00;
}

.standard {
	color : #919191;	/* Couleur police des article */
}

.standard img {
	float: none;
	margin: 0px 10px 0px 0px;		/* Ajoute une bordue de 10 pixel entre l'image et le texte */
	/* border: 1px solid #00BBFF; */
}

/* #################################################################################################### */

.centrer {
	text-align: center;
}

.right {
	text-align: right;
}

/* Mise en place des blocks (ou Flux) _____________________________________________________________________________________________*/

#conteneur{
/*Taille totale : 982 ---> 980 + 2x1px (Marges) */ 
	width: 1180px;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
	position: relative;	
 	border-left: 2px solid #FFFFFF;
	border-right: 2px solid #FFFFFF; 	 	
/* 	background: transparent url('images/bg_degrade_colonnes.gif') bottom repeat-x; */
	/* background-color: #DDE9AF;	  */	 /*Colore les div inclues dans ce conteneur qui n'ont pas eu de background color prédéfini , notament le cas de la colonne gauche et droite*/
	
}

#banniere{
	position: relative;
	height: 100px;
	width: 1180px;
	margin: 0 auto;
	padding: 0px;
}	

#topmenu{
	overflow:hidden;
	height:24px;
	margin: 0px auto;
	padding: 0px;
	border-top: 2px solid #FFFFFF;
	border-bottom: 2px solid #FFFFFF;
	/* background-color: #8c6558; */
	/* pour colorer et grossir les Pipes en blanc */
  	color: #FFFFFF;
	font-weight: bold;
	background: transparent url('images/bg_fondMenu.jpg') repeat-x;	
}													

#moteur_recherche *{
/* 	margin: 0px;
	padding: 0px; */
		/* Des elements CSS sont déclarés dans les feuilles de style de SPIP pour l'affichage d'un formulaire, */
		/* on retire donc les marge et paddin de tous ces elements pour l'unicités des plateformes */
}

/*#moteur_recherche label {display: none;}	*//* On cache le label 'Rechercher' */

#moteur_recherche{
	float:right;
	margin: 4px 0px 0px 0px;
	padding-right: 4px;	
	text-align:right;	
		/* border: 1px solid #FF0000; */
}

#moteur_recherche input {
	width: 110px;					/* On fixe une taille pour avoir la meme largeur du champ de saisie recherche quelque soit les navigateurs */
	
	background-color: #FFFFFF;
	color : #CCC;
    border: 1px solid #cbcbcb;
	margin: 0px;
	padding: 0px;
	vertical-align:bottom;
}

/* #loupe{	
	position: relative;	
	top: -18px;	
	left: 130px;
	background: transparent url('images/zoom.png') no-repeat;
	margin: 0px; 
	padding: 0px;
	width: 16px;
	height: 16px;	
} */

#troisColonnes{
	clear:both;
	background: transparent url('images/bg_degrade.png') repeat-x;
}

#colonne_gauche{
/* 160 px */
	float:left;
	margin: 15px 0px 0px 0px;	/* Rajoute une marge en haut pour decaler le contenu vers le bas */
	width: 160px;
	padding: 0px 0px 150px 0px;
	/* background-color: #D1D1D1; */	
	/* border: 1px solid #8c6558; */
}

#colonne_gauche ul, #colonne_droite ul{
	background: transparent url('images/bg_degrade.png') 0px 0px repeat-x;
}

#colonne_droite{
/* 160px */
	float:right;
	margin: 15px 0px 0px 0px;	/* Rajoute une marge de 40px en haut pour decaler le contenu vers le bas */
	width: 160px;
	padding: 0px 0px 150px 0px;
	/* border: 1px solid #FF0000;  */
}

#zonetext{
	overflow: hidden;	/* Pour faire passer ce qui depasse de cette div en dessous de la div colonne_droite afin de pas "denaturer le flux (ou positions des elements) */
	width: 848px;		/* Attention a deduire les pixels des bordures defaut 646px*/ /*Valeur d'origine 648*/
	padding : 5px;

/* 	border-right: 1px solid #8c6558;
	border-left: 1px solid #8c6558; */

}

#basdiv{
	clear:both;
	position:relative;
 	margin: 0px;
	padding: 0px;
	/* border-top: 2px solid #FFFFFF; */
	background: transparent url('images/bg_piedpage.jpg') no-repeat;
	/* border: 1px solid #FF0000; */
}

#basdiv a:hover, #basdiv a:visited, #basdiv a:link{
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}

#basdiv p{
	margin: 0px;
	padding: 5px;
	color: #000000;
}
/* 
#basdiv span{
	margin: 0px;
	padding: 0px;
} */

/* ########## Impression ##########  */
#impression{
	position : relative;
	margin: 0px;
	padding: 0px;
	text-align: right;
}

/* ##########  Fil d'arianne ##########  */

#hierarchie{
	position: relative;
	text-align: right;
	margin:0px auto;
	padding:0px;	
	/* border: 1px solid #888F6B; */
	font-size: 9px;
}

#hierarchie a, #hierarchie a:visited{
	color : #888F6B;				/* Colore tous les liens en vert foncé */
	text-transform: uppercase;		/* Transforme en majuscule tous les liens */
	text-decoration: none;
}

#hierarchie a:hover{
	text-decoration: underline;		/* souligne le lien au survole */
}

/* ##########  Selecteur du nombre d'article à afficher par page ##########  */

#selectNbArticle *{
	position: relative;
	margin: 0px;
	padding: 0px;
	text-align: center;
	/* border: 1px solid #FF0000; */
}

/* Habillage graphique__________________________________________________________________________________*/

#logo{
	background: transparent url('images/last_logo.gif') no-repeat;
}

#banniere{
	/* background: transparent url('images/bann.gif') no-repeat; */
/*  	background: transparent url('images/banniereV1.jpg') no-repeat; */
  	background: transparent url('images/banniere.jpg') no-repeat; 

}

#zonetext{
	background: transparent url('images/bg_degrade.png') repeat-x;
	background-color: #FFFFFF;
}

/* LISTES _____________________________________________________________________________________________*/

		/* _____ Liste Menu Rubrique et positionnement de la div menu qui la contient _____  */
	 	#menu_rubrique *{
			font-size: 11px;			
		}
		
		#menu_rubrique{
		float:left;
			text-align: left;
 			margin: 5px 0px 5px 0px;
			/* padding-left: 477px;  */
 			/* margin: 5px auto;*/
			padding: 0px; 
		}
		
		#menu_rubrique img{
			position: relative;
			width:16px;
			height:12px;
			top:2px;			/* On decale l'image de la maison de 3 pixel vers le bas pour la centrer par rapport au texte */
		}
		
		#menu_rubrique ul{
			margin: 0px;
			padding: 0px;
			list-style: none;
			/* border: 1px solid #888F6B; */
		}

		#menu_rubrique li{
			margin: 0px;
			padding: 0px;
			text-decoration: none;
		}

		#menu_rubrique li{display: inline;}

		#menu_rubrique a{
			margin: 0px;
			padding: 5px 5px 5px 5px;
		}		

		#menu_rubrique li a.on {
			color: #FFFFFF;
			background-color: #FFFFFF;
		}

		#menu_rubrique a:link, #menu_rubrique a:visited
		{
			color: #FFFFFF;
			/* background-color: #888F6B; */
			text-decoration: none;
			font-weight: bold;
		}

		#menu_rubrique a:hover
		{
			color: #FFFFFF;
			/*background-color: #33CCFF;*/
			background-image: url('images/bg_fondMenu_on.png');
			text-decoration: none;
		}

		/* _____ Liste Grands Dossiers _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  */

		/* Pour obtenir le même ecart entre le cadre Grands Dossiers et le 1er element de LI sur IE et FF */
		#grand_dossier h1{		
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
		} 

		#grand_dossier ul{
			margin: 0px;
			padding: 0px;
			list-style: none;
		}

		#grand_dossier li{
			background-image: url('images/page_white_go.png');			
			background-repeat: no-repeat;
			margin-right: 5px;
			margin-left: 5px;
			padding: 0px;
			background-position: 0;		/* centre la puce sur le LI*/
			padding: 7px 2px 7px 20px;
			border-bottom: 1px dotted #B1B69C;
		}

		#grand_dossier a:link, #grand_dossier a:visited{
			text-decoration: none;
			color: #444;
		}

		#grand_dossier a:hover{
			color: #000000;
		}

		/* _____ Liste News _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  _____  */

		#news h1 {
			margin: 0px;
			padding: 0px;
		}

		#news ul {
			margin: 0px;
			padding: 0px;
			list-style: none;
		}

		#news li {
			background-image: url('images/bullet_go.png');
			background-repeat: no-repeat;
			margin-right: 5px;
			margin-left: 5px;
			padding: 0px;
			background-position: 0;		/* centre la puce sur le LI*/
			padding: 7px 2px 7px 20px;
			border-bottom: 1px dotted #B1B69C;
		}

		#news a:link, #news a:visited{
			text-decoration: none;
			color: #444;
		}

		#news a:hover{
			color: #000000;
		}
		
		/* _____ Liste navLinks __________________________________________________*/
		
		#navLinks h1 {
			margin: 0px;
			padding: 0px;
		}		
		
		#navLinks ul {
			margin: 0px;
			padding: 0px;
			list-style: none;
		}

		#navLinks li {
			background-image: url('images/link_go.png');		/* icones de la liste par defaut */			
			background-repeat: no-repeat;
			margin-right: 5px;
			margin-left: 5px;
			padding: 0px;
			background-position: 0;		/* Centre la puce sur le LI */
			padding: 7px 2px 7px 20px;
			border-bottom: 1px dotted #B1B69C;
		}

		#navLinks a:link, #navLinks a:visited{
			text-decoration: none;
			color: #444;
		}
		
		#navLinks a:hover{
			color: #000000;
		}
		
		/* _____ Exceptions des icones de la liste _____*/
		#navLinks li.applications{
			background-image: url('images/computer_go.png');
		}
		
		#navLinks li.portail{
			background-image: url('images/layout_content.png');
		}
		
		#navLinks li.webmail{
			background-image: url('images/email_go.png');
		}
		
		#navLinks li.iprof{
			background-image: url('images/group.png');
		}		
		
		#navLinks li.BO{
			background-image: url('images/page_white_text.png');
		}
		
		
		/* _____ Liste News RSS  __________________________________________________*/
		
		#fluxRSS h1 {
			margin: 0px;
			padding: 0px;
		}		
		
		#fluxRSS ul {
			margin: 0px;
			padding: 0px;
			list-style: none;
		}

		#fluxRSS li {
			background-image: url('images/rss.png');		/* icones de la liste par defaut */			
			background-repeat: no-repeat;
			margin-right: 5px;
			margin-left: 5px;
			padding: 0px;
			background-position: 0;		/* Centre la puce sur le LI */
			padding: 7px 2px 7px 20px;
			border-bottom: 1px dotted #B1B69C;
		}

		#fluxRSS a:link, #fluxRSS a:visited{
			text-decoration: none;
			color: #444;
		}
		
		#fluxRSS a:hover{
			color: #000000;
		}		
		
/* Informations a masquer_________________________________________________________________________________*/

/* #moteur_recherche label {display: none;} */

/* #banniere p span, #logo p span, #titrehg p span{display:none;} */