body#accueil a#accueilnav,
	body#login a#loginnav,
	body#adhesion a#adhesionnav,
	body#articles a#articlesnav,
	body#email a#emailnav,
	body#cgv a#cgvnav,
	body#contact a#contactnav,
	body#couv a#couvnav,
	body#var a#varnav,
	body#connex a#connexnav, 
	body#rayons a#rayonsnav,
	body#fiches a#fichesnav,
	body#archivage a#vararchiv,
	body#clients a#clientsnav  { 
		background-color: blue;
	}
	
	html, body {
		margin: 0;
		padding: 0;
		background-color: #270925;	/* mauve 'digital' (un peu plus fonce en fait, c'est mieux)
	      /*background-color: #000;*/
		/*background-image:url(images/fond2010c.jpg);*/
		/*background-image:url(images/gold2.jpg);*/
		/*background-image:url(images/2012.jpg);*/
		background-repeat:repeat;
		background-attachment:scroll;
		background-attachment:fixed;  */
		text-align: center;  /*remis pour centrer les overlib mais invalider si impact sur le reste du site*/  
		/*background-position:top;
		height: 100%;*/
	}
	
	body {
		/*margin: 0;
		padding: 0;
		height: 100%;
		background-color : #323031;
		background-color : #444444;
		background-color: #000; */
		font-family : verdana;
		font-size : 0.8em;
		color : #000;
	}
	tmp
	{
	vertical-align: superexposant;

	}
	
	/* c'est la marge en haut, au dessus de la feuille blanche */
	.top {margin : 50px 0 0}
	/* --------- ??? ne sert plus (théoriquement) ??? -------- */
	#haut{width : 100% ; background-color : #ccc; height : 10px;}
	
	/* c'est la marge en bas, en dessous de la feuille blanche */
	.bottom {margin : 0 0 20px}
	/*  -------------------c'est l'ancienne ----------
	.bas {clear : both ; height : 10px; background-color : #c0c0c0 ; margin-top : 20px} 

	
	/* ce 'content' est notre feuille blanche */
	#content{
		width: 900px;
		background-color : #fff;
		border: 3em solid #fff;
		text-align: left;
		/*width :75%;*/
		/*height: 60%;*/
	}
	
	html>body #content {height : auto; min-height : 100%;  }

	/* présentation du div principal dans chacun des prg */
	.main_div {
		clear: both;
		background: url(images/femme_opaque.jpg) repeat; 
		border: 1px solid black; 
		padding-top: 0.5em;
		/* background-color: white;
		position: relative; 
		padding-bottom: 2em;*/
	}
	
	.col_gauche {
	float : left;
	/*width : 31%;*/
	width : 280px;
	/*width : 340px;*/
	/*height: auto;*/
	height: 10px;
	/*text-align: center;*/
	position: relative;
	border: 0px solid blue;
	margin-top: 8px;
	}
	.col_centre {
	float : left;
	/*width : 31%;
	margin-left: 3%;
	margin-right: 2%;*/
	width : 280px;
	margin-left: 33px;
	margin-right: 0px;
	text-align: justify;
	border: 0px solid blue;
	}
	
	.col_droite {
	float : right;
	/*width : 31%;*/
	width : 280px;
	text-align: justify;
	}

	h1 {
		text-align: left;
	}

	h2 {
	font-size : 1.4em;
	line-height: 1.2em;
	margin: 10px;
	}
	
	h3 {
	font-size: 1.1em;
	}
	
	h4 {
	text-align: left;
	font-size: 1.3em;
	font-weight: bold;
	line-height: 1em;
	/* il faudrait mettre un hack 'sauf FF' pour la ligne ci-dessous */
	margin-top: 10px;
	}

	h6 {
		font-size: 1.25em;
		font-weight: bolder;
	}
	
	a {color: #0000FF; text-decoration: none}
	a:hover {color: blue; text-decoration: underline}

	a.pied {color: black; text-decoration: none}
	a.pied:hover {color: black; text-decoration: none; font-weight: bold;}

	a.couv_choix {color: black; text-decoration: none}
	a.couv_choix:hover {color: black; text-decoration: none;}

	a.promo_deroul {color: black; text-decoration: none}
	a.promo_deroul:hover {color: black ; text-decoration: underline; font-weight: bold; font-size: smaller;}

	p {
		text-indent : 0em ;
		line-height : 1.2em ; 
		margin : 0 0 0 0
	}

	.col_gauche_miniature {
	float : left;
	width : 31%;
	/*width : 340px;*/
	/*height: auto;*/
	height: 10px;
	/*text-align: center;*/
	position: relative;
	border: 0px solid blue;
	margin-top: 3px;
	}
	.col_centre_miniature {
	float : left;
	width : 31%;
	margin-left: 3%;
	margin-right: 2%;
	margin-right: 0px;
	text-align: justify;
	border: 0px solid blue;
	}
	
	.col_droite_miniature {
	float : right;
	width : 31%;
	text-align: justify;
	}
	
	/* la barre de navigation */
	ul#navig {
		list-style-type: none;
		padding: 0.5em 0;
		margin-top: 0px;
		margin-right: 0px;
		margin-bottom: 0px;
		margin-left: 0px;
	}
	
	/* chaque item de la barre de navigation */
	ul#navig li {float : left; margin-right : 2px;}
	
	ul#navig li a
	{
		display: block;
		/* la largeur de chaque item de la barre */
		width: 5em;
		color: #FFF;
		background-color: #C0C0C0;
		padding: 0 0;
		font-size : 1em;
		font-weight :bold;
		text-align: center;
		text-decoration: none;
	}
	
	ul#navig li a:hover{
		color: #FFF;
		background-color: blue;
	}
	
	ul#navigadmin {
		list-style-type: none;
		padding: 0.5em 0;
		margin-top: 0px;
		margin-right: 0px;
		margin-bottom: 0px;
		margin-left: 0px;
		font-size : 0.85em;
	}
	ul#navigadmin li {
		float: left; margin-right: 0.35em;
	}
	ul#navigadmin li a {
		display: block;
		/* la largeur de chaque item de la barre */
		width: 5em;
		color: #FFF;
		background-color: #555555;
		padding: 0 0;
		font-weight :bold;
		text-align: center;
		text-decoration: none;
	}
	
	ul#navigadmin li a:hover {
		color: #FFF;
		background-color: blue;
	}
	
	.taille_max_width{
	border: 0px solid #808080;
	/* class utilisée pour 'maintenir' une taille max à une IMG dans une colonne, la taille  	*/
	/* est calculée pile-poil pour qu'un écran de XXXpx soit la limite au dela de 				*/
	/* laquelle l'image reste en format fixe (max_width px, donc) et en dessous de laquelle  	*/
	/* la proportionnalité de width% prend le relais en assurant ainsi une transition douce 	*/
	/* dans le cas d'une reduction/agrandissement taille écran par l'internaute					*/
	/* code pour tout browser, sauf IE :														*/
	width: 85%;
	max-width: 225px;
	/* ligne suivante pour IE seulement car ce dernier ne reconnait pas max-width	*/
	/* en css 'expression' (IE seulement) exécute le JS qu'il contient, soit :		*/
	/* si taille du body supérieur à body(px) alors width(en px) sinon width(en %) 	*/
	/* l'équation est réso = body + 25px = max_width / (0,264 x pourcentage)		*/
	/* donc, dans notre cas présent 1024px = 999px + 25px = 225px /(0,264 x 85%) 	*/
	/* 26,4%, paramètre fixe, est la taille en % d'une colonne de couv				*/
	/* body 999px équivaut à taille écran de 1024px, because ascenceurs (25px)!  	*/
	width:expression(document.body.clientWidth > 999? "225px": "85%" );
	}

	#tst {
	font-weight: bold;
	font-size: xx-small;
	background-color: white;
	text-transform: lowercase;
	font-style: italic;
	vertical-align: middle;
	clear: right;
	float: left;
	background-position: 5px center;
	background-image: url(images/5eurob.jpg);
	font-family: monospace, "Courier New", "Small Fonts";
	line-height: 2em;
	text-decoration: underline;
	letter-spacing: 0.8em;
	}

	.ombre{
	width: 100%;
	background-color: #ffffff;
	border: 1px solid #666;
	border-color: #bbb #666 #666 #bbb;
	padding: 4px;
	/* l'ombrage suivant ne fonctionne malheureusement que sous IE 	*/
	/* pas d'équivalent 'simple' pour les autres navigateurs		*/
	filter:progid:DXImageTransform.Microsoft.Shadow(color:#666666, strength:5, direction:135);
	} 

	.ombre_test{
	width: 100%;
	background-color: #ffffff;
	border: 1px solid #666;
	border-color: #bbb #666 #666 #bbb;
	padding: 4px;
	} 

	/* onglet de presentation en haut a gauche du main_div */
	.legend {
		font-size: 1.5em; 
		font-weight: bold;
		color: black;
		/* background: url(images/bg_legend.jpg) repeat; */
		/* background-color: #FEFFBF;
		color: #c0c0c0; */
		color: black;
		margin-left: 10px;  
		padding-top: 0.2em;
		padding-bottom: 0.2em; 
		border-top: 1px solid black;
		border-right: 1px solid black;
		border-left: 1px solid black; 
		text-align: center; 
		width: 18em;
		height: 1.2em;
		/*font-style: italic;*/
	}
	
	/* onglet de presentation au centre du main_div 
	destiné à recevoir l'icône welcome.gif */
	.legend_center {
		font-size: 0.75em; 
		color: #c0c0c0; */
		color: black;
		margin-left: 70px;  
		margin-top: 4px;  
		border: 0px solid black;
		text-align: center; 
		height: 1.2em;
	}

	/* onglet de presentation à droite du main_div 
	destiné à recevoir l'icône return.gif */
	.legend_right {
		font-size: 0.75em; 
		color: #c0c0c0; */
		color: black;
		margin-right: 0px;  
		padding-top: 0em;
		padding-bottom: 0.2em; 
		border-top: 0px solid black;
		border-right: 0px solid black;
		border-left: 0px solid black; 
		text-align: center; 
		height: 2.4em;
	}
	
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body) 
	il faut en effet redescendre quelque peu l'icone return.gif sur FF */
	html>body 	.legend-right  {
		padding-top: 0.7em;
	}

	#centrage {
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	}
	
	#centrage_image{
		display: block;
		margin-left: auto;
		margin-right: auto;
 	}
		
	/* insertion du texte du joke dans le main_div 
	(contient l'insert d'une img transparente de 198 X 201px)*/
	#joke_in_main_div_opacity {
		float: right; 
		filter:alpha(opacity=75); 
		-moz-opacity: 0.75; 
		opacity: 0.75;
		margin-top: -202px;   
		border: 0px solid blue;
	}
	
	/* insertion du texte du joke dans le main_div 
	(contient l'insert d'une img transparente de 198 X 201px)*/
	#joke_in_main_div_no_opacity {
		float: right; 
		margin-top: -202px;   
		border: 0px solid blue;
	}

	#tmp{
		float: left; 
		filter:alpha(opacity=60); 
		-moz-opacity: 0.6; 
		opacity: 0.6;
		margin-left: 0px;  
		margin-top: 5px;
		border: 1px solid blue;
		width:30%;
	}

	/* insertion du bandeau promo dans l'image miniature de liste.asp*/
	#promo_opacity_miniature{
		float: left; 
		filter:alpha(opacity=60); 
		-moz-opacity: 0.6; 
		opacity: 0.6;
		margin-left: -65px;  
		margin-top: 5px;
		border: 0px solid blue;
	}
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)*/
	html>body 	#promo_opacity_miniature{
		margin-left: -65px;
		border: 0;
	}
	
	/* insertion du bandeau promo à gauche dans fiche.asp*/
	#promo_opacity_left {
		float: left; 
		filter:alpha(opacity=40); 
		-moz-opacity: 0.4; 
		opacity: 0.4;
		margin-top: -132px;
		margin-left: -131px;  
		border: 0px solid blue;
	}
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)*/
	html>body 	#promo_opacity_left {
		margin-left: -131px;
	}

	/* insertion du bandeau promo à droite dans fiche.asp*/
	#promo_opacity_right {
		float: right; 
		filter:alpha(opacity=40); 
		-moz-opacity: 0.4; 
		opacity: 0.4;
		margin-top: -151px;
		margin-right: 1px;  
		border: 0px solid blue;
	}
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)*/
	html>body 	#promo_opacity_right {
		margin-right: 2px;
	}
	
	#icone_panier_bleu {
		float: right; 
		/*filter:alpha(opacity=99); 
		-moz-opacity: 0.99;  
		opacity: 0.99; */	
		margin-top: -26px;
		margin-right: 2px;
		border: 0px solid red;
	}
	
	#icone_new {
		float: right; 
		margin-top: -23px;
		margin-right: -5px;
		border: 0px solid green;
	}

	#icone_ecotaxe {
		float: left; 
		margin-top: -27px;
		/*margin-right: 137px;*/
		margin-left: 3px;
		border: 0px solid red;
	}


	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)
	en effet le margin-right -198px ne passe pas sous ff */
	html>body 	#icone_new {
		margin-right: 29px;
	}
	
	/* ceci est un hack pour IE7 qui ne passe pas les margin-right a cet endroit */
	*+html 	#icone_new  {
		clear:both;
		float: right;
	}

	/* insertion de la mention littérale de l'opération REDUC en diagonale dans le main_div 
	(contient l'insert d'une img transparente de 198 X 201px)*/
	#joke_in_main_div_currency {
		float: right; 
		filter:alpha(opacity=99); 
		-moz-opacity: 0.99;  
		opacity: 0.99; 	
		margin-top: -201px;
		/*margin-right: -200px;*/
		border: 0px solid black;
	}
	
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)
	en effet le margin-right -198px ne passe pas sous ff */
	html>body 	#joke_in_main_div_currency {
		margin-right: 0px;
	}
	
	/* insertion de la valeur en euro (avec les compositions de billets) dans le main_div 
	(contient l'insert d'une img transparente de 198 X 201px)*/
	#joke_in_main_div_currency2 {
		float: right; 
		filter:alpha(opacity=99); 
		-moz-opacity: 0.99;  
		opacity: 0.99; 	
		margin-top: -201px;
		margin-right: -200px;
		border: 0px solid black;
	}
	
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)
	en effet le margin-right -198px ne passe pas sous ff */
	html>body 	#joke_in_main_div_currency2 {
		margin-right: 0px;
	}
	
	/* ceci est un hack pour IE7 qui ne passe pas les margin-right négatives */
	*+html 	#joke_in_main_div_currency2 {
		clear:both;
		float: right;
		border: 0px solid black;
	}

	/* div vide juste pour l'affichage d'un JS-overlib d'explication avec onMouseOver
	(contient l'insert d'une img transparente et vide de 200 X 85px)*/
	#joke_in_main_div_transparent {
		float: right; 
		cursor: help; 
		margin-right: -200px;
		margin-top: -120px; 
		border: 0px solid blue;
	}
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)
	en effet le margin-right -198px ne passe pas sous ff */
	html>body 	#joke_in_main_div_transparent {
		margin-right: 0px;
		position: relative;  
		border: 0px solid blue;
	}

	/* ceci est un hack pour IE7 qui ne passe pas les margin-right négatives */
	*+html 	#joke_in_main_div_transparent {
		clear:both;
		float: right;
		margin-right: -200px;
		position: relative;  
		border: 0px solid blue;
	}
		
	/* insertion du code client dans le main_div */
	#joke_in_main_div_code {
		float: right;
		position: relative;  
		width: 198px;
		margin-right: -198px;
		margin-top: -2.3em; 
		border: 0px solid blue;
		text-align: right;
		font-size: 0.8em; 
		padding-right: 0px;
		text-transform: uuuuuppercase; 
		/*font-weight: booooold;*/
		color: black;
	}
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)
	en effet le margin-right -198px ne passe pas sous ff */
	html>body 	#joke_in_main_div_code {
		margin-right: 0px;
	}
	
	/* ceci est un hack pour IE7 qui ne passe pas les margin-right négatives */
	*+html 	#joke_in_main_div_code {
		clear:both;
		float: right;
		border: 0px solid black;
		margin-top: -2.9em; 
	}
	/* insertion de la ref de l'article dans le main_div */
	#joke_in_main_div_ref {
		float: right;
		position: relative;  
		width: 198px;
		margin-right: -198px;
		margin-top: -1.2em; 
		border: 0px solid blue;
		text-align: right;
		font-size: 0.8em; 
		padding-right: 0px;
		text-transform: uuuuuppercase; 
		/*font-weight: booooold;*/
		color: black;
	}
	/* ceci est un hack pour FF (et pas IE qui ne reconnait pas html>body)
	en effet le margin-right -198px ne passe pas sous ff */
	html>body 	#joke_in_main_div_ref {
		margin-right: 0px;
	}

	/* ceci est un hack pour IE7 qui ne passe pas les margin-right négatives */
	*+html 	#joke_in_main_div_ref {
		clear:both;
		float: right;
		border: 0px solid black;
		margin-top: -1.8em; 
	}

	img.opac10{
		filter:alpha(opacity=10);
		-moz-opacity: 0.1; 
		opacity: 0.1;
	}
	
	img.opac20{
		filter:alpha(opacity=20);
		-moz-opacity: 0.2; 
		opacity: 0.2;
	}

	img.opac30{
		filter:alpha(opacity=30);
		-moz-opacity: 0.3; 
		opacity: 0.3;
	}
	
	img.opac50{
		filter:alpha(opacity=50);
		-moz-opacity: 0.5; 
		opacity: 0.5;
	}
	
	img.opac55{
		filter:alpha(opacity=50);
		-moz-opacity: 0.5; 
		opacity: 0.5;
	}

	img.opac100{
		filter:alpha(opacity=100);
		-moz-opacity: 1; 
		opacity: 1;
	}

	a.opac img {
		filter:alpha(opacity=30);
		-moz-opacity: 0.3; 
		opacity: 0.3;
	}

	a.opac:hover img {
		filter:alpha(opacity=100);
		cursor: hand;
		-moz-opacity: 1.0;
		opacity: 1.0;
	}

	a.opac50 img {
		filter:alpha(opacity=50);
		-moz-opacity: 0.5; 
		opacity: 0.5;
	}

	a.opac50:hover img {
		filter:alpha(opacity=100);
		cursor: hand;
		-moz-opacity: 1.0;
		opacity: 1.0;
	}

	#centrage_miniature_pied_page
	{
		/*position: absolute; width: 350px; left: 50%; margin-left: -175px;
		position: absolute; width: 425px; border: 0px solid red; left: 50%; margin-left: -210px;*/
		position: absolute; width: 550px; border: 0px solid red; left: 50%; margin-left: -275px;
	}
	
	.miniature {
		float:left;
		margin-left:10px;
		/*width:420px;*/
		width:55%;
		font-size: 5px;
		background-color: white;
		padding: 10px;
		/*background-image : url(images/bg_thin.jpg);*/
		background-image : url(images/fond.jpg);
		border: thin solid #000000;
		height: auto;
	}
	
	.miniature2 {
		float:left;
		margin-left:10px;
		width:880px;
		font-size: 5px;
		background-color: white;
		padding: 10px;
		background-image : url(images/bg_thin.jpg);
		border: thin solid #000000;
		height: auto;
	}
	
	#content_miniature{
		width :80%;
		background-color : white;
		border: 1em solid #FFFFFF;
		margin-left:0px;
	}

	/*.test{
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 1em;
		font-style: normal;
		font-weight: bold;
		
		border-top-width: medium;
		border-right-width: medium;
		border-bottom-width: medium;
		border-left-width: medium;
		border-top-style: outset;
		border-right-style: outset;
		border-bottom-style: outset;
		border-left-style: outset;
		border-top-color: #FFFFFF;
		border-right-color: #666666;
		border-bottom-color: #666666;
		border-left-color: #FFFFFF;
		
		color: white;
		padding-bottom: 1px;
		height: 35px;
		background-color: #c0c0c0;
		text-align: center;
	}*/
	
	.liresuite {float : left;  background-image : url(images/nothing.gif);}

	.tabscrollist {
		border-spacing: 0px 0px;
		padding: 0px;
		align: left;
		font-size: xx-small;
		color: black;
		display: table-caption;
		margin: 0px;
		border-collapse:collapse;
		width: 85%;
	}
	
	.divscrollist-articles {
		border: 1px solid black;
		/*background-image: url(images/Copyright2.jpg);
		background-attachment: fixed;*/
		background-color: white;
		overflow: scroll;
		height: 500px;
		width: 100%;
	}
	
	.divscrollist-clients {
		border: thin solid #666666;
		/*background-image: url(images/Copyright2.jpg);
		background-attachment: fixed;*/
		background-color: white;
		overflow: scroll;
		height: 500px;
		width: 100%;
	}
	
	.divscrollist-stats {
		border: thin solid #666666;
		/*background-image: url(images/Copyright2.jpg);
		background-attachment: fixed;*/
		background-color: white;
		overflow: scroll;
		height: 500px;
		width: 100%;
		/*display:block;*/
	}
	
	legend {
		position:absolute;
		top:-15px;
		background:white;
		color:black;
		border:1px solid #000;
		padding:2px 5px;
		text-align: left;
	}
	
	.liste_lien-rouge {
		color: #FF0000;
		text-decoration: underline;
	}

	.liste_lien_normal {
		color: #333333;
		/*color: black;*/
		font-weight: bold;
		text-decoration: underline;
	}
	
	.bouton {
	font-size : 1.1em;
	text-align: center;
	background-color: #C0C0C0;
	color: #000000;
	cursor: pointer;
	cursor: hand;

	}
	
	.bouton_nav {
	font-size : 0.7em;
	text-align: center;
	font-weight: normal;
	background-color: #CCCCCC;
	color: #000000;
	cursor: pointer;
	cursor: hand;
	}