<style type="text/css">
@charset "UTF-8";
/* CSS Document */


/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																																	Definition l'affichage des liens */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
a:link    {text-decoration: none; color: #888;}
a:visited {text-decoration: none; color: #888;}
a:hover   {text-decoration: underline; color: #888;}
a:active  {text-decoration: none; color: #CC6633;}
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																																  Definition du fond de page : BODY */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
html {
	margin: 0;
	padding: 0;
	height: 100%;
	overflow-y: scroll;
	}

body {
	margin: 0;
	padding: 0;
	height: 100%;
	text-align: center ;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px ;
	/*background: #411e0a ;*/
	background-image: url(images/CX-fond-body.jpg);
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																																	Definition de la page : DIV PAGE */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#page {
	width: 840px ;
	padding: 0 0 0 0;
	margin: 0px auto ;
	text-align: left ;
	border: 0 ;
	background: url(images/CX-fond-page.jpg) repeat-y left top  ;
	background-color:#FFF ;
	}
		
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																											Definition du bord haut de l'ombre : DIV PREHEADER */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#preheader {
	width: 840px ;
	margin: 0 0 0 0 ;
	padding: 0 0 0 0 ;
	}
		
		
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 														  Definition du subheader : contient le header, le menu et le scroll haut : DIV SUBHEADER */
/* ------------------------------------------------------------------------------------------------------------------------------------*/

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																						Definition de l'entete : logo avec lien vers accueil : DIV HEADER */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#header {
	width: 800px ;
	height: 45px ;
	padding: 0 ;
	}

div#header a {
	height: 45px ;
	width: 400px ;
	margin: 0 ;
	padding: 0 ;
	display: block ;
	background: url(images/CX-logo.jpg) no-repeat left top    ;
	}
		
div#header a span {
	display: none ;
	}
		
div#header h1 {
	float: left ;
	height: 45px ;
	width: 220px ;
	margin: 0 ;
	padding: 0 ;
	}
		
div#header h2 {
	display: none ;
	}
		
div#header h3 {
	margin: 0 0 0 220px ;
	padding: 0 ;
	display: block ;
	position: relative ;
	top: 7px ;
	font-style: italic;
	font-size: 14px ;
	letter-spacing: 0px ;
	text-align: right ;
	color: #0098bc ; /*00AAD2 ;*/
	font-weight: normal ;
	}
		
div#header h4 {
	margin: 0 0 0 220px ;
	padding: 0 ;
	display: block ;
	position: relative ;
	top: 7px ;
	font-style: italic;
	font-size: 14px ;
	letter-spacing: 0px ;
	text-align: right ;
	color: #7AB030 ; /*7AB030 ;*/
	font-weight: normal ;
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																																		Definition du menu : DIV MENU */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#menu {																										  
	width: 800px ;
	height: 25px ;
	margin: 0 20px 0 20px ;
	padding: 0 ;
	}
	
				
/* --------------------------------------------------------------------------------------------- Définition de la liste menu : UL MENU */
ul.menu {
	height: 25px ;
	margin: 0 ;
	padding: 0 ;
	text-align: left ;
	letter-spacing: 1px ;		/* Ecartement des caractères */
	background: url(images/CX-menu-out.jpg) repeat-x top  ;
	list-style-type: none ;
	}

ul.menu li {
	border-right: 1px solid #fff ;
	}
	
/* ---------------------------------------------------------------------------- Début de la barre de menu : image à gauche : LI MENU A */
ul.menu li.menua {
	height: 25px ;
	width: 25px ;			/* Largeur de l'image de gauche + décalage : 15+10 */
	margin: 0 ;
	padding: 0 ;
	float: left ;
	background: url(images/CX-menu-start.jpg) no-repeat top left  ;
	border-right: 0px solid #fff ;
	}

ul.menu span.menua {
	height: 20px ;
	margin: 0 ;
	padding: 0 ;
	float: right ;
	border-right: 1px solid #fff ;
	}
				
/* ----------------------------------------------------------------------------------------------- Option de menu inactive : LI MENU B */
ul.menu li.menub {
	float: left ;
	text-align: center ;
	}
		
ul.menu li.menub a {
	line-height: 20px ;
	font-weight: normal ;
	font-size: 12px ;
	color: #000 ;
	text-shadow: 0px 0px 0px #fff;
	display: block ;
	float:left;
	text-decoration: none ;
	padding: 0 15px 0 15px ;		/*Espace autour des options de menu */
	}
		
ul.menu li.menub a:hover {
	color: #000 ;
	text-shadow: 0px 0px 0px #fff;
	background: url(images/CX-menu-over.jpg) repeat-x top  ;
	}
	
ul.menu li.menub a:active {
	color: #000 ;
	text-shadow: 1px 1px 0px #FFF;
	line-height: 22px ;
	background: url(images/CX-menu-clic.jpg) repeat-x top  ;
	}
	
/* ------------------------------------------------------------------------------------------------- Option de menu active : LI MENU C */
ul.menu li.menuc {
	float: left ;
	text-align: center ;
	background: url(images/CX-menu-down.jpg) repeat-x top  ;
	}
		
ul.menu li.menuc a {
	line-height: 20px ;
	font-weight: bold ;
	font-size: 12px ;
	color: #000 ;
	text-shadow: 1px 1px 1px #fff;
	display: block ;
	float:left;
	text-decoration:  none ;
	padding: 0 15px 0 15px ;		/*Espace autour des options de menu */
	}
		
ul.menu li.menuc a:hover {
	color: #000 ;
	text-shadow: -1px -1px 1px #fff;
	background: url(images/CX-menu-downover.jpg) repeat-x top  ;
	}
	
ul.menu li.menuc a:active {
	line-height: 22px ;
	color: #000 ;
	background: url(images/CX-menu-clic.jpg) repeat-x top  ;
	}
	
/* -------------------------------------------------------------------------------- Option de menu active avec lien inactif : LI MENU F */
ul.menu li.menuf {
	float: left ;
	text-align: center ;
	/*background: url(images/CX-menu-down.jpg) repeat-x top  ;*/
	}
		
ul.menu li.menuf a {
	line-height: 20px ;
	font-weight: bold ;
	font-size: 12px ;
	color: #bbb ;
	text-shadow: 1px 1px 1px #fff;
	display: block ;
	float:left;
	text-decoration:  none ;
	padding: 0 15px 0 15px ;		/*Espace autour des options de menu */
	}
		
ul.menu li.menuf a:hover {
	/*color: #000 ;*/
	/*text-shadow: -1px -1px 1px #fff;*/
	/*background: url(images/CX-menu-downover.jpg) repeat-x top  ;*/
	}
	
ul.menu li.menuf a:active {
	/*line-height: 22px ;*/
	/*color: #000 ;*/
	/*background: url(images/CX-menu-clic.jpg) repeat-x top  ;*/
	}
	
/* ------------------------------------------------------------------------------ Fin de la barre de menu : image à droite : LI MENU D */
ul.menu li.menud {
	height: 30px ;
	width: 15px ;			/* Largeur de l'image de gauche + décalage : 15+0 */
	margin: 0 ;
	padding: 0 ;
	display: block ;
	float: right ;
	background: url(images/CX-menu-end.jpg) no-repeat top right  ;
	border-right: 0px solid #FFF ;
	}

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																									 Definition du scroll haut de fin d'entête : DIV SCROLLH */
/* ------------------------------------------------------------------------------------------------------------------------------------*/

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																															  Definition de la page : DIV PRINCIPAL*/
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#principal {
	width: 800px ;
	text-align: left ;
	border: 0 ;
	}
		
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																													  Definition du bandeau colonne : DIV COLONNE*/
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#colonne {
	float: right ;
	width: 200px ;
	margin: 0 ;
   padding: 0 0 0 10px ;
	/*border-left: 1px solid #aaa ;*/
	background-color: #ffffff;
	}
		
div#colonne h1 {
	margin: 15px 0 0 0 ;
	padding: 0 0 0 5px;
	/*padding-left: 25px ;*/
	line-height: 18px ;
	font-size: 1.2em ;
	/* background: url(images/Logos-1e-20.jpg) no-repeat left center    ; */
	color: #0098bc ;/*7AB030*/
	border-bottom: 1px solid #E2E776 ;
	border-left: 3px solid #E2E776 ;
	}
		
div#colonne h2 {
	margin: 8px 0 3px 0 ;
	padding-left: 0px ;
	line-height: 14px ;
	font-size: 1.0em ;
	border-bottom: 1px solid #E2E776 ;
	color: #0098bc ;/*7AB030*/
	letter-spacing: 0px ;
	}
		
div#colonne h2 span {
	font-size: 0.9em ;
	font-weight:normal;
	}
		
div#colonne h3 {
	font-size: 0.95em;
	font-weight: normal ;
	margin: 0 0 0 16px ;
	padding: 0 0 0 0 ;
	display: list-item;
	list-style-position: outside;
	list-style-type: disc;
	text-align: left;
	list-style-image: url(images/Puce-verte-petite.gif) ;
	}

div#colonne h5 { /* Image centrée */
	text-align: center ;
	font-size: 1.0em;
	font-weight: bold ;
	color: #888 ;
	line-height: 15px ;
	}
	
div#colonne h5 span {
	color: #999 ;
	}
	
div#colonne p {
	text-align: left ;
	text-indent: 0em ;
	line-height: 1.0em ;
	font-size: 0.95em ;
	text-align: justify ;
	}
	
div#colonne a {
	color: #0098bc ;/*7AB030*/
	font-weight:bold ;
	}
	
div#colonne a:hover {
	color: #7AB030 ;
	}
	
div#colonne span {
	/*color: #ff0000 ;*/
	font-weight:bold;
	}

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																														Definition de la partie gauche : DIV MAIN */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#main {
	margin: 0 210px 0 0 ;
	padding: 0 10px 0 0 ;
	border-right: 1px solid #aaa ;
	/*width:579px;*/
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																								  Definition de la partie gauche pour l'admin : DIV MAINADM */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#mainadm {
	margin: 0 0 0 0 ;
	padding: 0 0 0 0 ;
	/*width:579px;*/
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																										 Definition d'une colonne gauche dans Main : DIV COLG */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#colg {
	/*height: 160px ;*/
	width: 160px;
	float: left ;
	margin: 0 0 0 0 ;
	padding: 0 0 0 0 ;
	display:block;
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																										 Definition d'une colonne droite dans Main : DIV COLD */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#cold {
	/*height: 160px ;*/
	width: 419px;
	float: left ;
	margin: 0 0 0 0;
	padding: 0 0 0 0 ;
	display:block;
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																														  Definition l'entete réduit : DIV ENTETE */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#entete {
	/*height: 160px ;*/
	margin: 0 0 0 0 ;
	padding: 0 0 0 0 ;
	}
	
div#entete h1 { /* c'est le titre de la page */
	margin: 0 0 10px 0;
	padding: 0;
	line-height: 30px;
	font-size: 2em;
	font-family: "Comic Sans MS";
	font-weight: normal ;
	color: #0098bc;
	text-align: left ;
	border-bottom: 3px solid #E2E776 ; /* 7AB030 */
	}
div#entete h1 span { /* c'est le titre de la page petit */
	font-size: 0.8em;
	}
	
div#entete h2 {
	margin: 0 0 5px 30px ;
	padding-left: 0px ;
	line-height: 18px ;
	font-size: 1.3em ;
	font-weight: normal ;
	font-style: italic ;
	color: #000 ;
	display: list-item ;
	list-style-position: outside ;
	list-style-type: disc ;
	text-align: left ;
	list-style-image: url(images/Puce-bleue.gif) ;
	}
		
div#entete li.menua {
	height: 36px ;
	width: 7px ;			/* Largeur de l'image de gauche + décalage : 7+0 */
	margin: 0 ;
	padding: 0 ;
	float: left ;
	background: url(images/CX-enteted.jpg) no-repeat top left  ;
	}

div#entete li.menub {
	float: left ;
	text-align: left ;
	border-right: 0px solid #fff ;
	text-shadow: 1px 1px 0px #fff;
	}

div#entete li.menuc {
	height: 36px ;
	width: 7px ;			/* Largeur de l'image de droite + décalage : 7+0 */
	margin: 0 ;
	padding: 0 ;
	display: block ;
	float: right ;
	background: url(images/CX-entetef.jpg) no-repeat top right  ;
	}
		
div#entete h3 {
	margin: 0 0 5px 30px ;
	padding-left: 0px ;
	line-height: 18px ;
	font-size: 1.1em ;
	font-weight: normal ;
	font-style: italic ;
	color: #000 ;
	text-align: left ;
	}
		
div#entete h4 {
	margin: 0 0 5px 40px ;
	padding-left: 0px ;
	line-height: 18px ;
	font-size: 1.1em ;
	font-weight: normal ;
	font-style: italic ;
	color: #000 ;
	display: list-item ;
	list-style-position: outside ;
	list-style-type: disc ;
	text-align: left ;
	list-style-image: url(images/Puce-bleue-petite.gif) ;
	}
		
div#entete h6 { /* c'est le visuel, cadré à droite */
	float: right ;
	display: block ;
	margin: 0 ;
	}	
	
div#entete h9 { /* Image flottante à gauche */
	float: left ;
	font-size: 1.0em;
	display: block ;
	margin: 0 0 0 0px ;
	padding: 0 30px 0 0px ;
	}
	
div#entete a {
	color: #000 ;
	}
	
div#entete a:hover {
	color: #7AB030 ;
	text-decoration: none ;
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																													  Definition du contenu réduit : DIV CONTENU */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#contenu {
	margin: 0 0 0 0 ;
	padding: 0 0 0 0 ;
	/*border-right: 1px solid #aaa ;*/
	/*width:579px;*/
	}
	
div#contenu h1 { /* Titre 1 cadre bas à puce */
	padding-left: 5px ;
	line-height: 20px ;
	font-size: 1.4em ;
	/* background: url(images/Logos-1e-28.jpg) no-repeat left center    ; */
	color: #000 ;
	border-bottom: 2px solid #79DCF2 ; /* 00AAD2 */
	border-left: 3px solid #79DCF2 ;
	}
	
div#contenu h2 { /* Titre 2 cadre gauche bas */
	margin-left: 10px ;
	margin-top: 8px;
	margin-bottom: 3px;
	padding-left: 0px ;
	line-height: 15px ;
	border-bottom: 1px solid #79DCF2 ;
	color: #000 ;
	letter-spacing: 1px ;
	font-size: 1.2em ;
	font-style: italic ;
	font-weight: normal ;
	}
		
div#contenu h3 { /* Titre 3 à petite puce */
	font-size: 1.0em;
	font-weight: normal ;
	margin-left: 30px;
	padding-left: 0px;
	display: list-item;
	list-style-position: outside;
	list-style-type: disc;
	margin-top: 2px;
	margin-bottom: 0px;
	text-align: justify;
	list-style-image: url(images/Puce-bleue-petite.gif);
	}
	
div#contenu h4 { /* Titre 4 à petite puce */
	font-size: 1.1em;
	font-weight: normal;
	margin-left: 45px;
	padding-left: 0px;
	display: list-item;
	list-style-position: outside;
	list-style-type: circle;
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: justify;
	list-style-image: url(images/Puce-bleue-mini.gif);
	}
	
div#contenu h5 { /* Image centrée, tableau titre */
	margin: 0 0 0 0;
	font-size: 1.1em;
	text-align: center ;
	/*font-weight: normal;*/
	text-decoration:underline ;
	}
	
div#contenu h6 { /* Image flottante à droite */
	float: right ;
	display: block ;
	margin: 0 0 0 0px ;
	padding: 0 ;
	}
	
div#contenu h7 { /* tableau corps */
	margin: 0;
	font-size: 1.1em;
	font-weight: normal ;
	text-align: center ;
	}
	
div#contenu h8 { /* Image centrée */
	margin: 0;
	font-size: 1.1em;
	text-align: center ;
	text-decoration:underline ;
	}
	
div#contenu h9 { /* Image flottante à gauche */
	float: left ;
	font-size: 1.0em;
	display: block ;
	margin: 0 0 0 0px ;
	padding: 0 30px 0 0px ;
	}
	
div#contenu p { /* Texte centré */
	margin: 0 0 0 5px;
	font-size: 1.1em;
	text-align: center ;
	font-weight: normal;
	/*text-decoration:underline ;*/
	}
	
div#contenu a {
	color: #000000 ;
	}
	
div#contenu a:hover {
	color: #7AB030 ;
	}
	
div#contenu span {
	color: #FF0000 ;
	}

.col2, .col3 {
	-moz-column-gap:20px;
	-moz-column-rule:1px solid #aaa;
	-webkit-column-gap:20px;
	-webkit-column-rule:1px solid #aaa;
	column-gap:20px;
	column-rule:1px solid #aaa;
	text-align:justify;
}
.col2 {
	-moz-column-count:2;
	-webkit-column-count:2;
	column-count:2;
}
.col3 {
	-moz-column-count:3;
	-webkit-column-count:3;
	column-count:3;
}

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																														  Definition de contenu texte caché : DIV CONTENT */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#content {
	display:none;
	}

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																														  Definition du pied de page : DIV FOOTER */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
div#footer {
	height: 30px ;
	width: 840px;
	margin: 10px 0 0 0 ;
	line-height: 28px ;
	font-size: 11px ;
	color: #000000 ;
	text-align: center ;
	}

div#footer span a {
	color:#000000;
	text-decoration: underline;
	/*font-weight:bold;*/
	text-shadow: 1px 1px 0px #fff;
	}
		
div#footer span a:hover {
	color:#000000;
	text-decoration: underline;
	/*font-weight:bold;*/
	text-shadow: 1px 1px 0px #fff;
	}
		
div#footer a {
	color:#444444;
	text-shadow: 1px 1px 0px #fff;
	}
		
div#footer a:hover {
	color:#000000;
	text-decoration:none;
	text-shadow: 1px 1px 0px #fff;
	}
		
/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																																			Classes des table standard */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
.table {
	border : none ;
	padding : 0 ;
	margin : 0 ;
	font-size: 1.0em;
	vertical-align:middle;
	}
.td, th {
	border: none;
	padding : 0 ;
	margin : 0 ;
	}
.trita, tdita {
	font-style:italic;
	}

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																														 Definition des éléments d'administration */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
.bouton {
	color: #000000;
	font-weight: normal;
	padding:0 0 0 0;
	background-color:#E8ECA6; 
	/*margin:0 0 0 0;*/
	background:url(images/CX-menu-titre.jpg) repeat-x;
	/*border-width:0 0 0 0;*/
	}

.boutonnavig {
	color: #000000;
	font-weight: normal;
	letter-spacing: -2px;
	padding:0 2px 0 2px;
	background-color:#E8ECA6; 
	margin:0 0 0 0;
	background:url(images/CX-menu-titre.jpg) repeat-x;
	/*border-width:0 0 0 0;*/
	}

.boutonhl {
	color: #888888;
	font-weight: normal;
	padding:0 0 0 0;
	background-color:#E8ECA6; 
	/*margin:0 0 0 0;*/
	background:url(images/CX-menu-titre.jpg) repeat-x;
	/*border-width:0 0 0 0;*/
	}
	
.textareap {
	/*margin: 0;
	padding: 0;
	width: 100%;*/
	/*height: 100%;*/
	text-align: left ;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px ;
	color: #000000;
	font-weight: normal;
	/*line-height: 14px ;
	background:none ;*/
	}

.tabdec {
	width:100% ;
	border:0; 
	/*cellspacing:1px; 
	cellpadding:0 ;*/
	background-color:#bcb48b;
	font-size: 1.0em;
	}

.tddec0 {
	background-image:url(images/CX-menu-titre.jpg);
	border:0; 
	height: 18px;
	}

.tddec1 {
	background-image:url(images/CX-menu-over.jpg);
	border:0; 
	}

.tddec1dsc {
	background-image:url(images/CX-menu-dsc.jpg);
	border:0; 
	}

.tddec1asc {
	background-image:url(images/CX-menu-asc.jpg);
	border:0; 
	}

/* ------------------------------------------------------------------------------------------------------------------------------------*/
/* 																																							 Autres styles */
/* ------------------------------------------------------------------------------------------------------------------------------------*/
.indeximage {
	visibility: hidden;
	display: none;
	}
	
.image {
	border:none;
	}
	
#Layer1 {
	position:relative;
	/*float:left;*/
	left: -400px;
	width:700px;
	z-index:1;
	}

hr {
	clear: both;
	visibility: hidden;
	/*width:579px;*/
	/*float:right;
	bottom:0px;*/
	/*line-height:1px;*/
}

fieldset {
	background-color:#fdf5d2; 
}

legend {
	background-color:#ecd709; 
	/*background:url(images/CX-menu-titre.jpg) repeat-x;*/
	border: 1px solid #888888 ;
	padding: 0 5px 0 5px;
	margin: 5px 0 5px;
}
