html, body {
height:100%;
}




body {
margin: 0;
padding: 0;
background:gray;
font-size:0.8 em;
}



a{text-decoration:none;
color:#002d56;
}

a:hover{text-decoration:none;
color:#f79421;
}


h2 {color:#f79421;
text-align:center}

#global {
	position: relative;
	min-height: 100%;
	width:800px;
	left:50%;
	margin-left:-400px;
	border:3px solid;
	background-color:white; 
font-size:0.8 em; 
				     /*#FFFFF0;*/
}








.menu { 
z-index:100;
font: bold 12px/24px verdana,Verdana, Arial, Helvetica, sans-serif;
text-align:center;
border-top:2px solid white;
height:25px;
background-color:black;
position:relative;
top:0px;
width:800px;
left:0px;

}
 * html .menu {
				
background-color:transparent;}


.menu ul {
list-style-type: none;
width: 100%; /* prýcision pour Opera */
margin-left:0;
}


.menu li {
float: left;
}

.menu a {

color:white;
margin: -12px 1px;
width: 143px;
height: 25px;
display: block;
text-align: center;
text-decoration: none;          
font-size:12px;
font-weight:bold;
background-color:black;

}

*html .menu a {
margin:0px 0px;
width: 160px; 
padding-bottom:0;

}

.menu a:hover {
text-decoration:none;
background: #ffecce;
color:#f60;
border: 0px solid #f60; 
}


.menu a:active {
background: gray;
border: 0px solid gray; 
color: #fff;

}



.menu a span {display: none;}
.menu a:hover span {display: block;
   position: absolute; top: 20px; right: 10px; width: 125px;
   padding: 5px; margin: 10px; z-index: 100;
   color: black; background: white;
   font: 10px Verdana, sans-serif; text-align: center;}






.entete {
background:#f79421 url(fond3.jpg);
width:100%;
height:190px;
color:blue;
font-family:Showcard Gothic,Jokerman,Lucida Handwriting,Comic Sans MS,Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
top:0;
}





.entete h1 { 
font-size:40px;
color:blue;
}

#corps {
padding:0px 10px 48px 10px;
}


#centre {

position:relative;
left:10px;
top:10px;
width:550px;
margin-bottom:23px;
border:0px solid black;
background-color:white;
padding:10px;
font-size:12 pt


}


#produit {
background:#f79421 url(compt12.jpg);
text-align:center;
width:150px;
height:150px;
border:0px solid #78A8FF;
position:absolute;
top:330px;
right:10px;
font-weight:bold;
color:black;
font-size:12pt;
}

#recherche {
background:#f79421 url(compt12.jpg);
position:absolute;
text-align:center;
width:150px;
height:50px;
color:black;
border:0px solid #78A8FF;
top:490px;
right:10px;
font-weight:bold;
font-size:12pt;
}


#contact {
background:#f79421 url(contact2.jpg);
position:absolute;
font:bold 25px/50px verdana;
text-align:center;
width:150px;
height:50px;
color:white;
border:0px solid #78A8FF;
top:550px;
right:10px;
font-weight:bold;
}

* html #contact {
top:575px;}

#contact a {
color:white}

#contact a:hover {
color:#f79421}


#accueil {

background:black url(acceuil6.jpg);
position:absolute;
text-align:center;
width:150px;
height:50px;
font:bold 25px/50px verdana;
border:0px solid #78A8FF;
top:270px;
right:10px;
}

#accueil a {
color:white;

}
#accueil a:hover {
color:red;
}

.tab {
background-color:white;
border:1px;
text-align:center;
}

.tab1 {
background-color:white;
border:0px;
text-align:center;
width:200px
}

dt {font-weight:bold}

h3 {text-align:center}


#pied {
background:black;/*#f79421;*/
/*font-size:12px;*/
height: 25px;
position:absolute;
width:100%;
bottom:-1px;
left:0;
right:0;
text-align:center;
color:white;
clear:both;
}



#pied a {

color:white;}

#pied a:hover {
color:#f79421;}




.plan {
text-align:center;
position:relative;
float:left;
top:0px;
margin-top:0px;
bottom:0px;
left:0px
}


a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:transparent;
    color:#000;
    text-decoration:none}

a.info:hover{z-index:25; background-color:white;}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:-5em; left:-12em; width:10em;
    border:1px solid #002d56;
    background-color:white; color:#f79421;
    text-align: center}