@charset "utf-8"; /*
	css design by Xanedarel
	Je ne remercie pas InternetExplorer, qui fait tripler les temps de developpements
	Micro$oft ne respecte jamais les normes du W3C (dont ils font partie !) et ralentissent le monde du web depuis 20 ans
	Pour rire : analysez le respect du w3c par microsoft : http://validator.w3.org/check?uri=http%3A%2F%2Fmicrosoft.com
	Ceci étant dit bien fort, on peux passer à la description de cette page
	------------------------------------------------------------------------
	l'idée est de créer des lignes de zones, comme les cellules d'un tableau 
	Chaque cellule est en float-left, et la ligne se termine par un clear-both
	Cela permet de résoudre le problème des retours à la lignes des div relatives
	
	L'espacement entre différentes zones ne peut pas se faire avec des margin (merci Micro$oft)
	Pour résumer : on ne doit jamais voir des margin-left: 10px; c'est la foire assurée sur IE6, 7, et ses potes
	on va donc devoir ruser en utilisant des cales : classe cale10 (pour 10px)
		
	cette page, avec le fichier html, structure et spécifie le design, elle est organisée comme suit :
	BODY 
		PAGE (absolute)
			HAUT (relative, car c'est la première, et la seule DIV de la première ligne)
				ACTION 
				HAUT_IMAGE
				ARIANE 
			DROITE (ligne1, float-left)			
			CENTRE (ligne1, float-left)
			GAUCHE (ligne1, float-left, se termine par un br clear:both)
			PIED (ligne2, float-left)
*/
#page {
	display: block;
	position: absolute;
	left: 50%; /* on cale la page à 50% de la largeur */
	width: 964px; /* largeur de la feuille, et donc largeur minimum du site */
	margin-left: -482px; /* puis on decale en pixels de la moitié de la largeur de la feuille : pour la CENTRER sur le body */
	background: white;
	text-align: left;
	font-size:11px;
} 
img {
	border: none;
	font-size: 11px;
} 
/* HAUT ------------------------------------------------------------------------------- */
#haut {
	position : relative;
	float: left;
	margin-left: 0px;
	margin-top: 0px;
	padding: 0px;
	width: 964px;
	/* la hauteur est action + haut_image + ariane ( 100+148+20 = 268)*/
	height: 258px;
	background: #dddddd;
} 
#action{
	position: absolute;
	left : 0px;
	top: 0px;
	/*background-image: url(images_etablissement/en-tete_etablissement.jpg);*/
	height: 100px;
	width:964px;
	background-repeat: no-repeat;
	background-color: transparent;
	overflow: hidden;
} 
#action_contenu{
	position: absolute;
	left : 410px;
	top: 0px;
	height: 20px;
	width: 560px;
	border: none;
	padding: 0px;
	margin: 0px;
	font-size:10px;
	padding: 5px 5px 0px 5px;
} 
.action_border{
   border-left: 1px solid #7f7d7e;
   padding: 0px 5px 0px 5px;
}
#haut_image  {
	position: absolute;
	left : 0px;
	top: 100px;
	background-image: url(images_etablissement/en-tete_etablissement.jpg);
	padding: 0px;
	margin: 0px;
	height: 148px; /* 148 */
	width: 964px;
}
#haut h1 {
	margin: 0;
	padding: 10px 0;
	font-size: 14pt;
	color:#0085b1; /*bleu fonce*/
}
#fil_ariane {
	position: absolute;
	left :0px;
	top: 248px;
	width: 964px;
	height:16px;
	background-color: red;
	font-size:11px;
	padding: 2px 0;
	background-image:url(images_etablissement/ariane.jpg);
}

/* GAUCHE ------------------------------------------------------------------------------- */
#gauche {
	float: left;
	margin-top: 10px;
	width: 227px; /* la couleur de l'arrière-plan est affichée sur la largeur du contenu de la colonne, mais pas au-delà */
	padding: 20px 5px 0;
	overflow: hidden;
}
#gauche_titre {
	margin-left:-5px;
	width: 230px;
	height: 32px;
	background-color: #0085b1;
	padding: 5px 0px;
	color: White;
	line-height: 16px;
	font-size: 14px;
	overflow: hidden;
}
ul.navigation li{
   list-style-image: url(images_etablissement/fleche-cyan.png);
}
#gauche_poste_titre{
	margin-left:15px;
	padding: 5px 0 0 10px;
	width: 204px;
	height: 22px;
	background-color: #616161;
	color: White;
	font-size: 14px;
}
#poste_titre {
	margin-left:15px;
	padding: 5px 0 0 10px;
	width: 204px;
	height: 22px;
	background-color: #616161;
	color: White;
	font-size: 14px;
}
#gauche_poste{
	margin-left:15px;
	padding: 0 0 0 10px;
	width: 204px;
	height:180px;
	background-color: #efefef;
	/* background-image: url(images_etablissement/poste.png); */
	color: #616161;
	font-size: 11px;
	display: block;
}
.gauche_poste_sstitre{
   padding: 0 0 0 10px;
   background: url(images_etablissement/fleche-grise.png) no-repeat;
   display: block;
}
.gauche_poste_sstitre2 {
   padding: 0 15px 0 10px;
   background: url(images_etablissement/double-fleche.png) no-repeat right;
   line-height: 20px;
   width: auto;
}
#gauche_recommandation{
	margin-left:15px;
   padding: 5px 0 0 10px;
   width: 204px;
   height: 22px;
   background-color: #d3d4d8;
   color: #000;
   font-size: 14px;
}
#gauche_utilestitre{
	margin-left:15px;
	padding: 5px 0 0 10px;
	width: 204px;
	height: 22px;
	background-color: #d3ebf4;
	color: #0085b1;
	font-size: 14px;
}
#gauche_utiles {
   margin : 0px 0 0 15px;
   padding: 5px 0 5px 0;
	width: 214px;
	background-color: #efefef;
}
ul.gauche_utiles li  {
   width: 180px;
   padding: 0px;
   margin-left:-18px;
   list-style: none;
   background: url(images_etablissement/double_fleche_cyan.png) no-repeat right 10px;
   line-height: 20px;
}


/* CENTRE ------------------------------------------------------------------------------- */ 
#centre {
	float: left;
	margin-top: 10px;
	width: 480px; /* 455 */
	text-align: left;
	font-size: 100%;
	margin-left:0px;
	margin-right:0px; /* les 15px de margin right seront gérés chez DROITE */
	padding-left: 10px;
	padding-right: 12px;
	font-size: 12px;
	overflow: hidden;
}
.centrelistetitre {
   margin: 0;
   padding: 0;
   font-weight: bold;
   width: 345px;
   font-size: 12px;
   line-height: 25px;
}
.centreimage {
	margin:20px 0; 
   padding: 0px;
   border: none;
}
.centreliste{
	margin: -90px 0; 
  /* line-height: 20px;*/
   width: 345px;
   font-weight: normal;
   float: right;
   font-size: 11px;
}
.centrelistesuite{
   margin: -10px 0;
   padding: 0 0 10px 0px;
   text-align: right;
   border-bottom: solid 1px #ccc;
   background: url(images_etablissement/flechevetre.png) no-repeat right;
}
ul.centrepuces li{
   background: url(images_enseignants/puce_carre.png) no-repeat left;
   list-style:none;
   padding-left:15px;
}
ul.pucescircle li{
  background: url(images_enseignants/puce_cercle.png) no-repeat left;
   list-style:none;
   padding-left:15px;
}
/* DROITE ------------------------------------------------------------------------------- */
#droite {
	float: left;
	margin: 0px;
	margin-top: -10px;
	padding:0px;
	width: 224px;
	color: black;
	background-color: white;
}
.droite_gris{
	position: relative;
	font-size: 10px;
	display: block;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	width: 224px;
	background-color: #efefef;
}
.droite_blanc_border{
	position: relative;
	font-size: 10px;
	display: block;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	width: 222px;
	background-color: white;
	border: solid 1px;
	border-color: #bcab99;
}
.droite_contenu{
	position: relative;
	text-align: left;
	display: block;
	margin-left: 10px;
	margin-top: 10px;
	bottom: 10px;
	padding: 0px;
	width: 204px;
	background-color: transparent;
	font-size: 11px;
}
.droite_bloc_rouge{
	position: relative;
	font-size: 4px;
	display: block;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	width: 224px;
	background-color: #d3ebf4;
}
.droite_bloc_marron{
	position: relative;
	font-size: 4px;
	display: block;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	width: 224px;
	background-color: #786755;
}
.droite_bloc_contenu{
	position: relative;
	text-align: left;
	display: block;
	margin-left: 10px;
	margin-top: 0px;
	bottom: 1px;
	padding: 0px;
	width: 204px;
	background-color: transparent;
	font-size: 11px;
}
.titre_newsletter{
   color: #fff;
   font-size: 14px;
   text-transform: uppercase;
}
#droite_services{
	margin-top: -10px;
	margin-left:-10px;
	padding: 5px 0 0 10px;
	width: 214px;
	height: 22px;
	background-image: url(images_etablissement/services.png);
	background-repeat:no-repeat;
	background-position:left center;
	background-color: #d3ebf4;
	color: #e34031;
	font-size: 14px;
}

/* PIED ------------------------------------------------------------------------------- */ 
#piedpage {
	float: left;
	/* a cause de son design débordant de la page, on attribue une grande largeur et on le recentre
	la page fait 964, le pied fait 2000, ce qui fait une défférence de 1036, la moitié faisant 518 */
	width:964px;
	margin-left:0px; 
	background:#252525;
	padding: 10px 10px; 
}
#baspage {
	width: 964px; 
	margin: 0 auto; 
	font-size:10px;
   text-align: right;
   color: #b3b5b4;
} 
.titrepied {
   text-align: left;
  color: #9fc600;
  text-transform: uppercase;
  font-size: 11px;
  display: block;
  width: 350px;
  float: left;
  padding-bottom: 5px;
}
.menupied {
  text-align: right;
  display: block;
  width: 590px;
  float: right;
  padding-bottom: 5px;
}
.menupied a, .textegris a {
	color:#FFFFFF;
	font-size: 11px;
}

.lignepied {
  width: auto;
  border-bottom: 1px solid #3d3f44;
}
.copyright {
  text-align: left;
  color: #fff;
  text-transform: uppercase;
  display: block;
  width: 350px;
  float: left;
  font-size: 9px;
  margin-top: -10px;
}
.copyright2 {
  font-size: 9px;
  color: #fff;
  margin-top: -10px;
  display: block;
}
.copyright3 {
  text-align: left;
  font-size: 13px;
  color: White;
  margin-top: -10px;
  display: block;
}
.copyright3 a, texteblanc a {
 font-size: 13px;
  color: #FFFFFF;
}  

/* AUTRES ------------------------------------------------------------------------- */
.titre_1 {
	font-size: 14pt;
color: #e34031
	text-transform:uppercase;
   font-weight: 100;
   	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
}
.titre_2 {
	font-size: 11pt;
	color:#0085b1;
	text-transform:uppercase;
	font-weight: bolder;
}
/*
.actualite {
	font-size: 14pt;
	color:#e34031;
	text-transform:uppercase;
	border-bottom:solid 1px #ccc;
   font-weight: 100;
}
*/
.actualite { /*GVE*/
	font-size: 14pt;
	color:#616161;
	text-transform:uppercase;
	border-bottom:solid 1px #ccc;
   	font-weight: 100;
}
.titre_4 {
	font-size: 14pt;
	color:#e34031;
	text-transform:uppercase;
   font-weight: 100;
}
.titre_5 {
	font-size: 11pt;
	color:#e34031;
	text-transform:uppercase;
   font-weight: bold;
   line-height: 14px;
}
.sous_titre {
	color:#000;
	font-weight: bold;
	font-size: 12px;
	}
.sous_titre_G {
	color:#000;
	font-weight: bold;
	font-size: 12px;
	}
.sous_titre_G11 {
	color:#000;
	font-weight: bold;
	font-size: 11px;

}
.sous_titre_8 {
	color:#000;
	font-size: 9px;

}

.sous_titre_R {
	color:#0085b1;
	font-weight: bold;
	font-size: 12px;
	}
	.sous_titre_bleu_gras_11 {
	color:#0085b1;
	font-weight: bold;
	font-size: 11px;
	}
	.sous_titre_bleu_gras_13 {
	color:#0085b1;
	font-weight: bold;
	font-size: 13px;
	}
	.sous_titre_bleu_gras_15 {
	color:#0085b1;
	font-weight: bold;
	font-size: 15px;
	}
.sous_titre_R_11 {
	color:#0085b1;
	font-size: 11px;
	font-weight: normal;
	}
.texte_rouge_11 {
	color:#FF0000;
	font-size: 11px;
	font-weight: normal;
	}
.texte_rouge_12_gras {
	color:#FF0000;
	font-size: 12px;
	font-weight: bold;
}
.texte_mentionlegale {
	color: #0085b1;
	font-size: 9px;
	}
.tab1{
	background-color:#d3ebf4;
	width:460px;
	height:30px;
	border:none;
	margin-top:20px;
   font-size: 11px;
}
.table_100{
 width:100%;
}
.td_15{
 width:15%;
}
.td_85{
 width:85%;
}
.txt_3{
	font-size:11px;
}
.txt_1{
	font-size:1px; 
}
/* GENERAL */
html,body  {
  /*  background: #ffffff;*/
   background-color: #000000;
   margin: 0px; 
   padding: 0px;
   text-align: center;
   color: #000000;
   background: url(images_etablissement/fond_etablissement.jpg) top center  no-repeat;
   font-family: Geneva, Arial, Helvetica, sans-serif;
   font-size: 100%;
   font-weight: 100; /* plus sympa pour les gros titres, cela fait moins gras */
}
a  {
	text-decoration: none;
	color: #000000;
	font-size: 11px;
}
a .tab1{
text-decoration: none;
}



/* CALES */
.cale_3 {
	margin: 0px;
	padding: 0px;
	width: 3px;
	height: 3px;
	font-size: 2px;
	background-color: transparent;
	overflow: hidden;
}
.cale_7 {
	margin: 0px;
	padding: 0px;
	width: 7px;
	height: 7px;
	font-size: 6px;
	background-color: transparent;
	overflow: hidden;
}
.cale_10 {
	margin: 0px;
	padding: 0px;
	width: 10px;
	height: 10px;
	font-size: 6px;
	background-color: transparent;
	overflow: hidden;
}
.cale_14 {
	margin: 0px;
	padding: 0px;
	width: 14px;
	height: 14px;
	font-size: 6px;
	background-color: transparent;
	overflow: hidden;
}
.clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
/* GVE */
.tab1{
	background-color:#d3ebf4;
	width:460px;
	height:30px;
	border:none;
	margin-top:20px;
   font-size: 11px;
}

a .tab1{
text-decoration: none;
}
.titre_1_cnu {
	font-size: 14pt;
	color:#E33F33;
	text-transform:uppercase;
   font-weight: 100;
}
.titre_page {
	font-size: 14pt;
	color:#0085b1;
	text-transform:uppercase;
   font-weight: 100;
}
.titre_2_cnu {
	font-size: 11pt;
	color:#E33F33;
	text-transform:uppercase;
	border-bottom:solid 1px #ccc;
   	font-weight: 100;
	width:100%;
}
.soustitre_page {
	font-size: 11pt;
	color:#0085b1;
	text-transform:uppercase;
	border-bottom:solid 1px #ccc;
   	font-weight: 100;
	width:100%;
	}
.soustitre_pagesansborder {
	font-size: 11pt;
	color:#0085b1;
	text-transform:uppercase;
	font-weight: 100;
	width:100%;
}
#suite{
	padding: 0 0 0 0px;
}

.centretext{
	margin:0px;
	font-size: 11px;
	font-weight: normal;
	color: #000;
}

centretext_droit{
	text-align:right;
	float : right;
}
a.lien2 {
	color:#212324;
	background-image:url(images_etablissement/flecheverte.png);
	background-repeat:no-repeat;
	background-position:left 3px;
	padding-left:10px;
	margin-top:5px;
}
hr {
	color:#D3D4D8;
 	background-color:#D3D4D8;
 	height: 0.5pt;
 	border: 0;
}
/*FIN GVE*/

/*  FIN   DU   CSS   */