@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-weight: bold;
} 
/* 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 : 1px;
	top: 2px;
	/*background-image: url(images_cnu/en-tete.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_cnu/en-tete_cnu.jpg);
	padding: 0px;
	margin: 0px;
	height: 148px; /* 148 */
	width: 964px;
}
#haut_image2  {
	position: absolute;
	left : 0px;
	top: 100px;
	background-image: url(images_cnu/en_tete_Galaxie_instances_nationales.jpg);
	padding: 0px;
	margin: 0px;
	height: 148px; /* 148 */
	width: 964px;
}
#haut h1 {
	margin: 0;
	padding: 10px 0;
	font-size: 14pt;
	color:#9b0b77;
}
#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_cnu/ariane.jpg);
	color: #000000;
}

/* 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: #e33f33;
	padding: 5px 0px;
	color: White;
	line-height: 16px;
	font-size: 120%;
	overflow: hidden;
}
ul.navigation li{
   list-style-image: url(images_cnu/flecherouge.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:103px;
	background-color: #efefef;
	color: #616161;
	font-size: 12px;
	display: block;
}
.gauche_poste_sstitre{
   padding: 0 0 0 10px;
   background: url(images_cnu/fleche-grise.png) no-repeat;
   display: block;
}
.gauche_poste_sstitre2 {
   padding: 0 15px 0 10px;
   background: url(images_cnu/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: #f6dad6;
	color: #e34031;
	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_cnu/double-fleche_magenta.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: 11px;
	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_cnu/flechevetre.png) no-repeat right;
}

/* 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: #f6dad6;
}
.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_cnu/services.png);
	background-repeat:no-repeat;
	background-position:left center;
	background-color: #f6dad6;
	color: #e34031;
	font-size: 14px;
}
.texte_mentionlegale {
	color: #e34031;
	font-size: 9px;
	}

/* 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;
  color:#CCC;
}

.menupied a, .textegris a {
	color:#FFFFFF;
}
.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:#e34031;
	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:#e34031;
}
.menu_horizontal{
	background-color:#f8d9d6;
	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:3px; 
}
.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_cnu/fond_cnu.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 .menu_horizontal{
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 */
.menu_horizontal{
	background-color:#f8d9d6;
	width:475px;
	height:30px;
	border:none;
	margin-top:20px;
	font-size: 11px;
}

a .menu_horizontal{
text-decoration: none;
}
.titre_page {
	font-size: 14pt;
	color:#E33F33;
	text-transform:uppercase;
   font-weight: 100;
    padding-top:10px;
}
.titre_page_soustitre {
	font-size: 11pt;
	color:#E33F33;
	text-transform:uppercase;
	border-bottom:solid 1px #ccc;
   	font-weight: 100;
	width:100%;
}
.bordure_separation{
	border-bottom:solid 1px #ccc;
	padding:5 px;
	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_cnu/flecheverte.png);
	background-repeat:no-repeat;
	background-position:left 2px;
	padding-left:5px;
	margin-top:-20px;
}
hr {
	color:#D3D4D8;
 	background-color:#D3D4D8;
 	height: 0.5pt;
 	border: 0;
}
h4 {
	color:#000;
	font-size:12px;
}
.sous_titre_G {
	color:#000;
	font-weight: bold;
	font-size: 12px;
}
	.sous_titre_G_O_12 {
	color:#E33F33;
	font-weight: bold;
	font-size: 12px;
}
.sous_titre_G_O_13 {
	color:#E33F33;
	font-weight: bold;
	font-size: 13px;
}
	.texte_G_O_11 {
	color:#E33F33;
	font-weight: bold;
	font-size: 11px;
	}
	.texte_O_11 {
	color:#E33F33;
	font-size: 11px;
	font-weight: normal;
	}
	
.texte_G_11 {
	color:#000;
	font-weight: bold;
	font-size: 11px;
	}
.texte_rouge_12_gras {
	color:#FF0000;
	font-size: 12px;
	font-weight: bold;
}
	
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;
}
	
/*FIN GVE*/

/*  FIN   DU   CSS   */
