html, body {
	height: 100%;	
}

body {
	margin:0;
	padding:0;
	text-align: center; /* pour corriger le bug de centrage IE */ 
	font:1em Arial, Helvetica, Verdana, sans-serif;	
	background-color: #333;
}

table td {
	font:0.8em Arial, Helvetica, Verdana, sans-serif;	
}

/* ********************* 
  CONTENEURS
 ********************* */
#abstand {
	height: 50%;
	width: 100px;
	margin-bottom: -18em;
	float: left;	
}
/*
 #content, #col_right , #col_left  {
	border:solid 1px red;
}
*/
#page { 
  	width: 960px; 
	margin-left: auto; 
	margin-right: auto; 
	position: relative; /* on positionne le conteneur */ 
	clear:left;
	text-align: left; /* on rétablit l'alignement normal du texte */ 
}
div.menu {
	width:960px;
	margin:0;
	padding:0;
	height:45px;

}
div.bandeau_images {
	width:960px;
	height:65px;
	padding-top:5px;
	padding-bottom:5px;
}
#main { 
  	width:960px;
	clear:both; 
}
#content { 
  	width:720px;	
	margin-left:120px;
	min-height:360px;
	background-color:#A8A8A8;
	padding:0;
	font:1em Arial, Helvetica, Verdana, sans-serif;	
}
#col_left {
	float:left;
	width:110px;
	vertical-align:middle;
	background-color:#707070;
	min-height: 350px;
	padding:5px;
	text-align:center;
	color:#fff;
	font:1em Arial, Helvetica, Verdana, sans-serif;
}

#col_right {
	float:right;
	width:120px;
	vertical-align:top;
	background-color:#707070;
	min-height: 360px;
	padding:0px;
}

#notes {	
	width:110px;
	vertical-align:top;
	background-color:#707070;
	min-height: 345px;
	padding:5 5 5 5px;
	color:#fff;
	font:1em Arial, Helvetica, Verdana, sans-serif;
	text-align:center;
	overflow:hidden;
}

#visionneuse {
	position:relative;
	bottom:0px;
	width:120px; 
	background-color:#707070;
	height:15px; 
	padding:0px;
	text-align:center;
}

/* ********************* 
  VISIONNEUSE
 ********************* */
img.cmd {
	width:14px;
	margin:1px 7px 1px 7px;
} 
img.cmdsel, img.cmd:hover, img.cmdsel:hover {
	width:12px;
	margin:1px 7px 1px 7px;
	border:solid 1px #FFFFFF;
}
/* ********************* 
  LIENS
 ********************* */
a {
	color:#fff;
	text-decoration:none;
}

/*
a:visited{
	color: #fff;
}
*/
a:hover {
	text-decoration:underline;
}

a.selected {
	font-weight:bold;	
}

#col_left a {
	color: #fff;
}	

#col_right a {
	color: #bbb;
	font:1em Arial, Helvetica, Verdana, sans-serif;
	text-decoration:underline;	
}
#col_right a:hover, #col_right a:focus, #col_right a:active, #col_right a.selected  {
	color: #000;
	font:1em Arial, Helvetica, Verdana, sans-serif;
	text-decoration:underline;
}
	

/* ********************* 
  TITRES MENUS
 ********************* */
.nav  {  /* div.menu ul */
	list-style:none;
	padding:0;
	margin:0;
	text-align:center;
}

.nav li {
	float:left;
	padding:0px;
	font-size:0.85em;
	height:45px;
	width:120px;
	font: 0.8em  Arial, Helvetica, Verdana, sans-serif;	
}

.nav li a {
	display:block;
	font: 0.85em  Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none; 
	padding: 6px 0px;
	line-height: 1.52em;  
}

.nav li a:hover, .nav li a:focus { 
	text-decoration:underline;	
	color: #fff;
}

.nav li a:active, .nav li a.selected {
	font-weight:bold;
	color: #fff;
}


/* ********************* 
  BANDEAUX IMAGES
 ********************* */
a img {
	border:0;
}

.ssnav { /* div.bandeau_images ul */
	list-style:none;
	padding:0;
	text-align:center;
	margin: 0px auto 0px auto;
}	

.ssnav li {
	float:left;
	margin:0;
	padding:5px 5px 0px 5px;
}

.ssnav img {
	width:110px;
	height: 55px;
	margin:0;
}

.htmlicone {
	width:110px;
	vertical-align:middle;
	height: 55px;
	background-color: #484848;
	margin-bottom:4px;
	/*padding:5px 0px 0px 0px;*/
}
.htmlicone a {
	font: 0.8em   Verdana  Helvetica,  sans-serif;	
	/*color:#FFCC00;*/
	/*font-weight:bold;*/
}

.htmlicone .i1 {
	padding: 3px 0px 3px 0px;
	font:0.85em Verdana, Helvetica,  sans-serif;
	font-weight:bold;
}

.htmlicone .i2 {
	font:Times, Verdana,  Helvetica,  sans-serif;
	font-size:85%;
	font-style:italic;	
	padding-top:3px;
}

/*div.bandeau_images ul li:hover, div.bandeau_images ul li.selected {
	background-color:#FFFFFF;
}
*/

/* *********************
  NAVIGATEUR
 ***********************/
img.nav, img.navsel {
 width:10px;
 margin:3px 1px 3px 1px;
} 

a img.nav{
	border:0;	
}

a img.navsel {
	width:8px;
	border:solid 1px white;
}

img.nav:hover, img.navsel:hover {
	width:8px;
	border:solid 1px #FFFFFF;
}

/*
.divXY a.selected {
	font-weight:bold;
}

*/
/* **********************
  HTML tag styles
* ************************/
h1{
 font: 1.4em Arial, Helvetica, Verdana, sans-serif;
 color: #999999;
 font-weight:bold;
 text-align:left;
 margin: 0px;
 padding: 0px;
}

h2{
 font: 1.3em Arial, Helvetica, Verdana, sans-serif;
 color: #999999;
 font-weight:bold;
 font-style:italic;
 text-align:left;
 margin: 0px;
 padding: 0px;
}

h3{
 font: 1em Arial, Helvetica, Verdana, sans-serif;
 color: #000000;
 text-align:justify;
 margin: 0px;
 padding: 0px;
}

h4{
 font: 1em Arial, Helvetica, Verdana, sans-serif;
 font-weight: normal;
 color: #ffffff;
 margin: 0px;
 padding: 0px;
}

h5{
 font: 0.9em Arial, Helvetica, Verdana, sans-serif;
 color: #bbb;
 text-align:center;
 margin: 0px;
 padding: 0px;
}


h6{
 font: 0.8em Arial, Helvetica, Verdana, sans-serif;
 color: #000;
 margin: 0px;
 padding: 0px;
}
h7{
 font: 0.4em Arial, Helvetica, Verdana, sans-serif;
 color: #000;
 margin: 0px;
 padding: 0px;
}

/* ********************* 
  DEGRADES Bleu-Vert
 ********************* */
 /*
.bgBV0 { background-color:#003399;}
.bgBV1 { background-color:#004C99;}
.bgBV2 { background-color:#006699;}
.bgBV3 { background-color:#008099;}
.bgBV4 { background-color:#009980;}
.bgBV5 { background-color:#009966;}
.bgBV6 { background-color:#00994C;}
.bgBV7 { background-color:#009933;}
.bgBV8 { background-color:#009933;}
.bgBV9 { background-color:#00994C;}
.bgBVA { background-color:#009966;}
.bgBVB { background-color:#009980;}
.bgBVC { background-color:#008099;}
.bgBVD { background-color:#006699;}
.bgBVE { background-color:#004C99;}
.bgBVF { background-color:#003399;}
*/
/* ********************* 
  DEGRADES Rouge-Jaune
 ********************* */
 /*
.bgRJ0 { background-color:#F00000;}
.bgRJ1 { background-color:#F03C00;}
.bgRJ2 { background-color:#F05A00;}
.bgRJ3 { background-color:#F07800;}
.bgRJ4 { background-color:#F09600;}
.bgRJ5 { background-color:#F0B400;}
.bgRJ6 { background-color:#F0D200;}
.bgRJ7 { background-color:#F0F000;} 
.bgRJ8 { background-color:#F0F000;}
.bgRJ9 { background-color:#F0D200;}
.bgRJA { background-color:#F0B400;}
.bgRJB { background-color:#F09600;}
.bgRJC { background-color:#F07800;}
.bgRJD { background-color:#F05A00;}
.bgRJE { background-color:#F03C00;}
.bgRJF { background-color:#F00000;}
*/
/* ********************* 
  DEGRADES MIXTES: 8 Bleu-vert / 8 Rouge-Jaune
 ********************* */
.bg0, #content.bg0, li.bgNG0 a:hover, li.YbgNG0 a:hover, li.bgbd0:hover, li.bgbd0.selected { background-color:#003399;}
.bg1, #content.bg1, li.bgNG1 a:hover, li.YbgNG1 a:hover, li.bgbd1:hover, li.bgbd1.selected { background-color:#004C99;}
.bg2, #content.bg2, li.bgNG2 a:hover, li.YbgNG2 a:hover, li.bgbd2:hover, li.bgbd2.selected { background-color:#006699;}
.bg3, #content.bg3, li.bgNG3 a:hover, li.YbgNG3 a:hover, li.bgbd3:hover, li.bgbd3.selected { background-color:#008099;}
.bg4, #content.bg4, li.bgNG4 a:hover, li.YbgNG4 a:hover, li.bgbd4:hover, li.bgbd4.selected { background-color:#009980;}
.bg5, #content.bg5, li.bgNG5 a:hover, li.YbgNG5 a:hover, li.bgbd5:hover, li.bgbd5.selected { background-color:#009966;}
.bg6, #content.bg6, li.bgNG6 a:hover, li.YbgNG6 a:hover, li.bgbd6:hover, li.bgbd6.selected { background-color:#00994C;}
.bg7, #content.bg7, li.bgNG7 a:hover, li.YbgNG7 a:hover, li.bgbd7:hover, li.bgbd7.selected { background-color:#009933;}
.bg8, #content.bg8, li.bgNG8 a:hover, li.YbgNG8 a:hover, li.bgbd8:hover, li.bgbd8.selected { background-color:#CC0000;}
.bg9, #content.bg9, li.bgNG9 a:hover, li.YbgNG9 a:hover, li.bgbd9:hover, li.bgbd9.selected { background-color:#D31D00;}
.bgA, #content.bgA, li.bgNGA a:hover, li.YbgNGA a:hover, li.bgbdA:hover, li.bgbdA.selected { background-color:#DA3A00;}
.bgB, #content.bgB, li.bgNGB a:hover, li.YbgNGB a:hover, li.bgbdB:hover, li.bgbdB.selected { background-color:#E15700;}
.bgC, #content.bgC, li.bgNGC a:hover, li.YbgNGC a:hover, li.bgbdC:hover, li.bgbdC.selected { background-color:#E87400;}
.bgD, #content.bgD, li.bgNGD a:hover, li.YbgNGD a:hover, li.bgbdD:hover, li.bgbdD.selected { background-color:#EF9100;}
.bgE, #content.bgE, li.bgNGE a:hover, li.YbgNGE a:hover, li.bgbdE:hover, li.bgbdE.selected { background-color:#F6AE00;}
.bgF, #content.bgF, li.bgNGF a:hover, li.YbgNGF a:hover, li.bgbdF:hover, li.bgbdF.selected { background-color:#FFCC00;} 
.bgX, #content.bgX, li.bgNGX a:hover, li.YbgNGX a:hover, li.bgbdX:hover, li.bgbdX.selected { background-color:#CDCDCD;} 
.bgY, #content.bgY, li.bgNGY a:hover, li.YbgNGY a:hover, li.bgbdY:hover, li.bgbdY.selected { background-color:#A8A8A8;} 

/* COULEURS DES TEXTES pour HTMLICONE */
li.bgbd0 .htmlicone a { color:#003399;}
li.bgbd1 .htmlicone a { color:#004C99;}
li.bgbd2 .htmlicone a { color:#006699;}
li.bgbd3 .htmlicone a { color:#008099;}
li.bgbd4 .htmlicone a { color:#009980;}
li.bgbd5 .htmlicone a { color:#009966;}
li.bgbd6 .htmlicone a { color:#00994C;}
li.bgbd7 .htmlicone a { color:#009933;}
li.bgbd8 .htmlicone a { color:#CC0000;}
li.bgbd9 .htmlicone a { color:#D31D00;}
li.bgbdA .htmlicone a { color:#DA3A00;}
li.bgbdB .htmlicone a { color:#E15700;}
li.bgbdC .htmlicone a { color:#E87400;}
li.bgbdD .htmlicone a { color:#EF9100;}
li.bgbdE .htmlicone a { color:#F6AE00;}
li.bgbdF .htmlicone a { color:#FFCC00;} 
li.bgbdX .htmlicone a { color:#CDCDCD;} 
li.bgbdY .htmlicone a { color:#A8A8A8;} 


/* ********************* 
  BORDER-COLOR DEGRADES MIXTES: 8 Bleu-vert / 8 Rouge-Jaune
 ********************* */
.bd0 { border-color:#003399;}
.bd1 { border-color:#004C99;}
.bd2 { border-color:#006699;}
.bd3 { border-color:#008099;}
.bd4 { border-color:#009980;}
.bd5 { border-color:#009966;}
.bd6 { border-color:#00994C;}
.bd7 { border-color:#009933;}
.bd8 { border-color:#CC0000;}
.bd9 { border-color:#D31D00;}
.bdA { border-color:#DA3A00;}
.bdB { border-color:#E15700;}
.bdC { border-color:#E87400;}
.bdD { border-color:#EF9100;}
.bdE { border-color:#F6AE00;}
.bdF { border-color:#FFCC00;}

/* ********************* 
  DEGRADES Gris
 ********************* */
.bgNG0 { background-color:#BEBEBE;}
.bgNG1 { background-color:#ABABAB;}
.bgNG2 { background-color:#989898;}
.bgNG3 { background-color:#868686;}
.bgNG4 { background-color:#747474;}
.bgNG5 { background-color:#616161;}
.bgNG6 { background-color:#4E4E4E;}
.bgNG7 { background-color:#3C3C3C;}
.bgNG8 { background-color:#3C3C3C;}
.bgNG9 { background-color:#4E4E4E;}
.bgNGA { background-color:#616161;}
.bgNGB { background-color:#747474;}
.bgNGC { background-color:#868686;}
.bgNGD { background-color:#989898;}
.bgNGE { background-color:#ABABAB;}
.bgNGF { background-color:#BEBEBE;}
/* ********************* 
  DEGRADES Gris inversés (sortie Y)
 ********************* */
.YbgNG8 { background-color:#BEBEBE;}
.YbgNG9 { background-color:#ABABAB;}
.YbgNGA { background-color:#989898;}
.YbgNGB { background-color:#868686;}
.YbgNGC { background-color:#747474;}
.YbgNGD { background-color:#616161;}
.YbgNGE { background-color:#4E4E4E;}
.YbgNGF { background-color:#3C3C3C;}
.YbgNG0 { background-color:#3C3C3C;}
.YbgNG1 { background-color:#4E4E4E;}
.YbgNG2 { background-color:#616161;}
.YbgNG3 { background-color:#747474;}
.YbgNG4 { background-color:#868686;}
.YbgNG5 { background-color:#989898;}
.YbgNG6 { background-color:#ABABAB;}
.YbgNG7 { background-color:#BEBEBE;}