.separateur {
display:block; height: 2px;width: 740px; position:relative; left: 40px;
border-top: 1px solid #d9bd88;
border-bottom: 1px solid #f7f2e7;
background-color:#e0d0b1;
margin:30px 0 10px 0;}

#boitegraph { width: 740px; height: 150px;  background: transparent; position:relative; left: 40px;  }
 
#vertgraph { width: 550px; height: 150px; float:left; left: 0px; background: url("/img/css/graph/backbar.gif")no-repeat; } 
#vertgraph ul { width: 550px; height: 150px; margin: 0;padding: 0; } 
#vertgraph ul li { position: absolute; width: 40px; height: 120px; bottom: 25px; padding: 0 !important; margin: 0 !important; background: url("/img/css/graph/colorbar.jpg") no-repeat!important; text-align: center; text-decoration: none; list-style: none; font-weight: bold; color: black; line-height: 2.0em; } 
#vertgraph li.un { left: 5px;background-position: 0px bottom !important; }
#vertgraph li.deux { left: 55px;background-position: 0px bottom !important; } 
#vertgraph li.trois { left: 105px;background-position: 0px bottom !important; } 
#vertgraph li.quatre { left: 155px;background-position: 0px bottom !important; } 
#vertgraph li.cinq { left: 205px;background-position: 0px bottom !important; } 
#vertgraph li.six { left: 255px;background-position: 0px bottom !important; }
#vertgraph li.sept { left: 305px;background-position: 0px bottom !important; } 
#vertgraph li.huit { left: 355px;background-position: 0px bottom !important; } 
#vertgraph li.neuf { left: 405px;background-position: 0px bottom !important; } 
#vertgraph li.dix {left: 455px;background-position: 0px bottom !important; } 
#vertgraph li.onze { left: 505px;background-position: 0px bottom !important; }

#vertgraph2 { width: 150px; height: 150px; float:right; right: 0px; background: url("/img/css/graph/backbar2.gif")no-repeat; } 
#vertgraph2 ul { width: 150px; height: 150px; margin: 0;padding: 0; } 
#vertgraph2 ul li { position: absolute; width: 50px; height: 120px; bottom: 25px; padding: 0 !important; margin: 0 !important; background: url("/img/css/graph/colorbar2.jpg") no-repeat!important; text-align: center; text-decoration: none; list-style: none; font-weight: bold; color: black; line-height: 2.0em; } 
#vertgraph2 li.un { right: 87px;background-position: 0px bottom !important; }
#vertgraph2 li.deux { right: 12px;background-position: 0px bottom !important; } 


div.stats ul { list-style: none; }
        div#part1 { width: 80%; float: left; }
	div#part2 { width: 20%; float: right; }


div.stats .percent {
	/* on passe l'élément span correspondant à la classe .percent
	en affichage en bloc pour pouvoir lui donner une dimension.
	Diverses autres choses sont modifiées ensuite à votre convenance. */
	display: block;  /* on affiche le span sous forme de bloc pour lui affecter des dimensions */
	height: 1.5em;
	line-height: 1.5em;
	margin: 5px 10px 0px 43px;
	padding: 0 5px;
	text-align: right;
	color: #fff;
	font-weight: bold;
	font-family: monospace; 
	-moz-border-radius: 5px;  /* un petit arrondi pour les navigateurs le supportant */
	border-bottom: 1px solid #aaa;
	border-right: 1px solid #aaa;
	cursor: default;
}


body
{
   width: 980px;
   height: 100%;
   background-color: #555555;
   font: 14px arial, helvetica, sans-serif;
   color: white;   margin: left;
   margin-top: 0px;
   margin-bottom: 0px;
   list-style-type:none; 
}


#cadre {
text-align: center;
width: 500px;
padding:10px;
background-color:#FFFF00;
border-left:1px solid #000000; /* couleur du cadre */
border-right:1px solid #000000;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
}




#info
{
width: 155px;
height: 595px;
margin: auto;
position: absolute;
left: 0px;
top: 0px;
background-image: url(../img/css/gg-lef.png);
background-repeat: no-repeat;
background-color: transparent;
}

.element_info
{
   width: 155px;
   height: 225px;
   font-size: 1.0em;
   background-color: transparent;
   text-align: center;
   position: relative;
   top: 27px;
   left: 5px;
   text-align: center;
   list-style-type: none;
}


#boiterss
{
text-align: center;
width: 120px;
height: 300px;
margin: auto;
position: absolute;
left: 22px;
top: 600px;
background-color: transparent;
}


#banniere
{
width: 820px;
height: 155px;
margin: auto;
position: relative;
left: 67px;
top: 0px;
background-image: url(../img/css/dh-lef.png);
background-repeat: no-repeat;
background-color: transparent;
}


#menuhaut
{
width: 820px;
height: 70px;
margin: auto;
position: relative;
left: 67px;
top: 0px;
background-image: url(../img/css/db-lef.png);
background-repeat: no-repeat;
background-color: transparent;
}

.element_menuhaut
{
   width: 95px;
   height: 22px;
   background-color: transparent;
   background-image: url(../img/css/boutonh0.gif);
   background-repeat: no-repeat;
   font: 12px arial, helvetica, sans-serif;
   text-align: center;
   line-height: 22px;
   float: left;
   margin: 20px 10px;

}



.hautcorps
{
background-image: url("../img/css/ch-lef.png");
background-repeat: no-repeat;
height: 60px;
width: 820px;
margin-left: 147px;
margin-top: -10px;
}

.corps
{
background-image: url("../img/css/cm-lef.png");
background-repeat: repeat-y;
text-align: center;
width: 820px;
margin-left: 147px;
margin-top: -16px;
}


.bascorps
{
background-image: url("../img/css/cb-lef.png");
background-repeat: no-repeat;
height: 35px;
width: 820px;
margin-top: 0px
margin-left: 0px;
}

.hautpied
{
background-image: url("../img/css/bh-lef.png");
background-repeat: no-repeat;
height: 35px;
width: 820px;
margin-left: 0px;
margin-top: 0px;
}

.pied
{
background-image: url("../img/css/cm-lef.png");
background-repeat: repeat-y;
text-align: left;
width: 820px;
margin-left: 0px;
margin-top: 0px;
padding-left:20px;
}


.baspied
{
background-image: url("../img/css/bb-lef.png");
background-repeat: no-repeat;
height: 35px;
width: 820px;
margin-top: 0px;
margin-left: 0px;
}




.hautsyno
{
position: relative;
background-image: url("../img/css/synopsysh.png");
background-repeat: no-repeat;
height: 36px;
width: 630px;
left: 8px;
}

.syno
{
position: relative;
background-image: url("../img/css/synopsysm.png");
background-repeat: repeat-y;
text-align: left;
width: 630px;
left: 8px;
font: 16px arial, helvetica, sans-serif;
}

.synotexte
{
position: relative;
text-align: left;
width: 580px;
left: 20px;
font: 16px arial, helvetica, sans-serif;
}

.bassyno
{
position: relative;
background-image: url("../img/css/synopsysb.png");
background-repeat: no-repeat;
height: 47px;
width: 630px;
left: 8px;
}

.fondR
{
position: relative;
background-image: url("../img/css/fondR.png");
background-repeat: no-repeat;
height: 330px;
width: 630px;
left: 8px;
}

.fondR2
{
text-align:center;
position: relative;
background-repeat: no-repeat;
height: 250px;
width: 578px;
right: 7px;
top: 16px;
}


.zoom {
position: relative;
height:233px;
width:560px;
top: 3px;
left: 2px;
}
.zoom p {
text-align:center;
}
.zoom img {
width:560px;
height:233px;
}
.zoom img:hover {
position: relative;
width:580px;
height:250px;
right:10px;
bottom:8px;
}

.fondT
{
font: 15px arial, helvetica, sans-serif;
color: #6a79d8;
text-decoration: none;
text-align:center;
position: relative;
background-repeat: no-repeat;
height: 20px;
width: 155px;
right: 225px;
top: 32px;
}

.fondT2
{
font: 15px arial, helvetica, sans-serif;
color: #6a79d8;
text-decoration: none;
text-align:center;
position: relative;
background-repeat: no-repeat;
height: 20px;
width: 320px;
left: 119px;
top: 12px;
}


.fondTop
{
position: relative;
background-image: url("../img/css/fondTop.png");
background-repeat: no-repeat;
height: 127px;
width: 630px;
left: 8px;

}

.fondTop2
{
font: 15px arial, helvetica, sans-serif;
color: #6a79d8;
background-color: transparent;
text-decoration: none;
position: relative;
background-repeat: no-repeat;
height: 20px;
width: 563px;
right: 7px;
top: 27px;
}

.fondTop2 a:link {color: green ; text-decoration: none ;}
.fondTop2 a:visited {color: #FF6699 ; }
.fondTop2 a:hover { color: red ; text-decoration: underline overline ; }


.fondTop3
{
text-align:left;
font: 15px arial, helvetica, sans-serif;
color: blue;
text-decoration: none;
position: relative;
background-repeat: no-repeat;
background-color: transparent;
height: 20px;
width: 130px;
right: 223px;
top: 27px;
}

.fondTop4
{
text-align:left;
font: 15px arial, helvetica, sans-serif;
color: blue;
text-decoration: none;
background-color: transparent;
position: relative;
background-repeat: no-repeat;
height: 20px;
width: 130px;
right: 223px;
top: 27px;
}

.fondTop5
{
text-align:right;
font: 15px arial, helvetica, sans-serif;
color: blue;
text-decoration: none;
background-color: transparent;
position: relative;
background-repeat: no-repeat;
height: 20px;
width: 320px;
left: 113px;
top: 8px;
}


a { /* lien */
 color: yellow;
 background-color:inherit;
 text-decoration: none;
 font-weight: bold;
}
a:hover { /* lien survolé */
 font-weight: bold;
 color: red;
 background-color: inherit;
 position: relative;
 top: 0px;
 left: 0px;
 text-decoration: none;
 font-weight: bold; 
}

p { /* paragraphe */
 margin: 6px 0;
}
hr { /* ligne horizontale */
 border-style : none none solid;
 border-color : #C0C0C0;
/* border-color : red;*/
 height: 0;
 border-width: 0px 0px 1px;
 width: 100%;
}
ul, ol { /* listes */
 font: 14px arial, helvetica, sans-serif;
 color: #C0C0C0;
 background-color:inherit;
 margin: 0;
 padding: 0;
}
h1 { /* titre niveau 1 */
 font-size: 24px;
}
h2 { /* titre niveau 2 */
 font-size: 18px;
}
h3 { /* titre niveau 3 */
 font-size: 16px;
}
h4 { /* titre niveau 4 */
 font-size: 14px;
}
.bordure {
 border: 0px solid #000;
}

strong /* ... et les mots importants en rouge clignotant ! */
{
   color: orange;
}

.arrowlistmenu{
   position: absolute;
   left: 28px;
    top: 197px;
   width: 100px; /*width of accordion menu*/
}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
margin-top: 15px;
font: bold 0.8em Arial;
text-align: center;
color: white;
background: black url(../img/java/accordion/titlebar.png) repeat-x center left;
margin-bottom: 8px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 0; /*header text is indented 10px*/
cursor: hand;
cursor: pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-image: url(../img/java/accordion/titlebar-active.png);
}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 1px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li a{
color: yellow;
background: url(../img/java/accordion/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 80%;
}

.arrowlistmenu ul li a:visited{
color: yellow;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #A70303;
background-color: #F3F3F3;
}


#alexguestbook {
 font-family: Verdana, Arial, Helvetica; 
 color: #000000; 
 font-size: 1em;
 text-align: center; /*corrige un bug IE<6 pour centrer le div "contour"*/
 padding-bottom: 40px;
}

#alexguestbook .body_txt {
 /* body width - you can update it */
 width: 750px;

 margin-left: auto;
 margin-right: auto;
}

#alexguestbook a, #alexguestbook img, #alexguestbook abbr, #alexguestbook acronym, #alexguestbook frame { 
 border: none; 
}

#alexguestbook a:link    { text-decoration: none;      color: #0000FF; }
#alexguestbook a:visited { text-decoration: none;      color: #6633CC; }
#alexguestbook a:hover   { text-decoration: underline; color: #FF0000; }

#alexguestbook a.a_info_code:link       { text-decoration: none;      color: #3A3A3A; }
#alexguestbook a.a_info_code:visited    { text-decoration: none;      color: #3A3A3A; }
#alexguestbook a.a_info_code:hover      { text-decoration: underline; color: #3A3A3A; }

#alexguestbook input, #alexguestbook textarea, #alexguestbook select {
 font-family: Verdana, Helvetica, sans-serif; 
 font-size: 1em;
 border: 1px solid #757575;
}

#alexguestbook input.i_text {
 font-family: Verdana, Helvetica, sans-serif; 
 font-size: 1em;
 border: 1px solid #757575;
 width: 200px;
}

#alexguestbook input.i_focus {
 padding-left: 2px; 
 border: 1px solid #00007E;
 border-left: 3px solid #00007E;
 background-color: #EBEBFF; 
 width: 200px;
}

#alexguestbook input.btn_add {
 font-size: 1em;
 cursor: pointer;
 font-weight: bold;
 color: #373737;
}

#alexguestbook input.btn_search {
 cursor: pointer;
 font-weight: bold;
 color: #373737;
}

#alexguestbook input.i_nbre_car {
 font-size: 0.8em; 
 color: #A1A1A1;
 text-align: center;
 background-color: transparent; 
 border: 0px none; 
}

#alexguestbook textarea.i_comment {
 font-family: Verdana, Helvetica, sans-serif; 
 font-size: 1em;
 border: 1px solid #757575;
 width: 430px;
}

#alexguestbook textarea.i_comment_focus {
 padding-left: 2px; 
 border: 1px solid #00007E;
 border-left: 3px solid #00007E;
 background-color: #EBEBFF; 
 width: 430px;
}

#alexguestbook form {
 margin: 0px;
 padding: 0px;
}

#alexguestbook img.img_left{
 float: left;
}

#alexguestbook .d_title {
 font-weight: bold;
 color: #78ff78; 
 font-size: 1.3em;
 text-align: center;
}

#alexguestbook .d_title img {
	vertical-align: middle;
}

#alexguestbook .d_note {
 font-family: Verdana, Helvetica, sans-serif; 
 color: #000066; 
 font-size: 1em;
 text-align: center;
}

#alexguestbook .d_add_msg {
 text-align: center;
}

#alexguestbook .d_f_add_msg {
 margin-left: auto;
 margin-right: auto;
 width: 750px;
 padding-top: 4px;
 padding-bottom: 4px;
 color: #3A3A3A;
 background: #F3F3F3 url('img/background_add_msg.png');
}

#alexguestbook .d_add_msg_h {
 margin-left: auto;
 margin-right: auto;
 width: 750px;
 height: 4px;
 background: #F3F3F3 url('img/border_h.png') no-repeat;
}

#alexguestbook .d_add_msg_b {
 margin-left: auto;
 margin-right: auto;
 width: 750px;
 height: 4px;
 background: #F3F3F3 url('img/border_b.png') no-repeat;
}

#alexguestbook .add_msg_left {
 float: left;
 width: 170px;
 text-align: left;
 margin-top: 2px;
 padding-left: 180px;
 height: 23px;
 clear: both;
}

#alexguestbook .add_msg_right {
 text-align: left;
 height: 25px;
}

#alexguestbook .reponse {
 border: 1px solid #B4B4B4;
 background-color: #FFFFFF;
 padding: 5px;
}

#alexguestbook .code_sec {
 font-family: Courier New;
 font-size: 1.1em;
 text-align: center;
}

#alexguestbook .d_center {
 text-align: center;
}

#alexguestbook .copyright {
 color: #000;
 font-family: Arial, Helvetica, sans-serif; 
 font-size: 1em;
 text-align: center;
 padding-bottom: 10px;
}

#alexguestbook .copyright p {
	margin: 0;
}

#alexguestbook .d_smileys {
 text-align: center;
 padding: 3px;
}

#alexguestbook .body_all {
 text-align: center;
}

#alexguestbook .d_nb_mess_page {
 background-color: #006;
 font-weight: bold;
 height: 15px;
 font-size: 0.8em;
}

#alexguestbook span.color_d_nb_mess_page1 {
 color: #DDDDDD;
}

#alexguestbook span.color_d_nb_mess_page2 {
 color: #FFFFFF;
}

#alexguestbook .three1 { 
 float: left;
 width: 35%;
 text-align: left;
 padding-left: 3px;
 padding-top: 1px;
 height: 14px;
 border-right: 2px solid #FFFFFF;
}

#alexguestbook .three2 { 
 float: left;
 width: 28%;
 text-align: center;
 padding-top: 1px;
 height: 14px;
}

#alexguestbook .three3 { 
 float: right;
 width: 35%;
 text-align: right;
 padding-right: 3px;
 padding-top: 1px;
 height: 14px;
 border-left: 2px solid #FFFFFF;
}

#alexguestbook .d_liste_page {
 padding: 1px;
 height: 15px;
}

#alexguestbook .three1_2 { 
 float: left;
 width: 25%;
 text-align: left;
}

#alexguestbook .three2_2 { 
 float: left;
 width: 49%;
 text-align: center;
}

#alexguestbook .three3_2 { 
 float: right;
 width: 25%;
 text-align: right;
}

#alexguestbook span.Gris_prec_suiv {
 color: #C0C0C0;
}

#alexguestbook .d_corps_msg {
 background-color: #0092F3;
 border: 1px solid #757575;
 padding: 4px;
 text-align: left;
}

#alexguestbook .d_pseudo {
 color: #CC3300;
 font-weight: bold;
}



#alexguestbook .d_date {
 color: #CC3300;
 font-size: 0.8em;
 float: right;
 width: 145px;
 text-align: right;
}

#alexguestbook .d_code1{
 display: inline;
 float: left;
 text-align: right;
 height: 20px;
 width: 238px;
}

#alexguestbook .d_code2{
 display: inline;
 float: left;
 text-align: left;
 height: 20px;
}

#alexguestbook .d_submit_msg {
 text-align: center;
 clear: both;
}

#alexguestbook .d_note_user {
 font-weight: bold;
 color: #FF0004;
 text-align: left;
}

#alexguestbook #d_contour {
	background-image: url(images/bg_pg_ci.jpg);
	margin-left: auto;
	margin-right: auto;
	width: 91%;
}

#alexguestbook .gras {
	font-weight: bold;
}
#alexguestbook #lien_accueil a:link, #alexguestbook #lien_accueil a:hover, #alexguestbook #lien_accueil a:visited, #alexguestbook #lien_administration a:link, #alexguestbook #lien_administration a:hover, #alexguestbook #lien_administration a:visited {
	text-decoration: underline;
	color: #4A7DAC;
}

#alexguestbook #lien_accueil  img, #alexguestbook #lien_administration  img {
	vertical-align: text-bottom;
	width: 16px;
	height: 16px;
	border: 0;
	margin: 0 2px 0 0;
}

#alexguestbook #lien_accueil {
	text-align: center;
	padding: 8px;
}

#alexguestbook #lien_administration {
	text-align: center;
	margin-top: 10px;
	padding-bottom: 5px;
}

#alexguestbook .symbole_champ_obligatoire {
	color: #FF0000;
}

#alexguestbook .symbole_champ_prive {
	color: #6264FA;
}

table {
border:3px solid #6495ed;
border-collapse:collapse;
width:90%;
margin:auto;
}
thead, tfoot {
background-color:#D0E3FA;
background-image:url(../img/css/sky.jpg);
border:1px solid #6495ed;
color:black;
}
tbody {
background-color:#FFFFFF;
border:1px solid #6495ed;
color:black;
}
th {
font-family:monospace;
border:1px dotted #6495ed;
padding:5px;
background-color:#EFF6FF;
}
td {
font-family:sans-serif;
font-size:80%;
border:1px solid #6495ed;
padding:5px;
}
caption {
font-family:sans-serif;
}

.infobulle{
  position: absolute;   
  visibility : hidden;
  border: 1px solid Black;
  padding: 10px;
  font-family: Verdana, Arial;
  font-size: 10px;
  background-color: #FFFFCC;
      }


.tool-tip {
	color		: #fff;
	width		: 228px;
	z-index		: 13000;
}
.tool-title {
	font		: 12px Tahoma, Arial, Helvetica;
	font-weight	: bold;
	margin		: 0;
	color		: #fce181;
	padding		: 8px 0 4px 0;
	background	: url(images/tips1.png) top left;
}
.tool-text {
	font		: 11px Tahoma, Arial, Helvetica;
	font-weight	: bold;
	text-align	: center;
	padding		: 0px 5px 10px 5px;
	background	: url(images/tips1.png) bottom right;
}