/* ++++++ COLORS / SCHEMA ++++++ 
orange = #EAA83B
rouge = #911
beige ciment clair = #bba
beige ciment foncé = #775
marron foncé = #332
gris clair = #eee
 ++++++ COLORS / SCHEMA ++++++ */

/*------------------------------------------------------
C O U L E U R S   U N I F O R M E S 
------------------------------------------------------*/
 /* ORANGE */
#shortcutMenu li a:hover, .voletInfo h2, .voletInfo a:hover, .New h3, .New .soustitre, .soustitreLight, #menu li a:hover, #menu li a:focus{
color:#EAA83B!important;
}

 /* GRIS VERT CLAIR */
#shortcutMenu li, .TabMiddl, #menu li{ 
background-color:#bba; 
}
.NewsPlus a:hover, #AllerHaut a:hover{
color:#bba!important;
}

 /* GRIS VERT FONCE */
.voletInfo a, .soustitreLight, .NewsPlus a, #AllerHaut a, #menu li a{
color:#775!important;

}


/*------------------------------------------------------
G L O B A L  E L E M E N T S
------------------------------------------------------*/

#corps, #entete, #menu, #footer{
width:780px;/*TAILLE DU SITE*/
}
* {
margin: 0;
padding: 0;
}
html{
margin:0; 
padding:0;
}
body{
font: 11px/15px Tahoma, Arial, sans-serif;
color:#333333;
margin:0; 
padding-top:0px; 
background-color:#BCBCAC; 
background-image:url(../pics/bg_BODY.gif); 
background-repeat:repeat-x;
}
a:link{
color: #000000;
}
a:visited{
color: #000000;
}
a:hover{
color:#555555;
}
a:active{
color: #000000;
}
#corps{
overflow:hidden;
margin:2px auto 5px auto;
padding:0;
position:relative;
top:5px;
background-color:#eee;
border-left:#616144 solid 1px;
border-right:#616144 solid 1px;
}
acronym{
cursor:help;
}
img{
border:none;
}
ul{
margin:5px 0px 5px 25px;
}

/*------------------------------------------------------
E N T E T E
------------------------------------------------------*/

#entete{
position:relative;
height:70px;
background:url(../pics/logo_odeis.gif) no-repeat #F8F8F8;
border-bottom:6px #EEE solid;
margin:0px 0px 5px 0px;
}
h1{ 
position:relative; 
top:39px;
text-align:center; 
font-family:Arial, Helvetica, sans-serif; 
font-weight:bold; 
font-size:16px;
color:#666666;
margin:0; 
padding:0;
vertical-align:bottom;
} 
#shortcutMenu { 
float:right; 
position:absolute;
top:0px;
right:-4px;
margin:0; 
padding:0;
}
#shortcutMenu li{ 
display:inline; 
margin:0px 1px 0px 1px; 
padding:0; 
}
#shortcutMenu li a{
color:#fff!important;
padding:0px 6px 0px 6px; 
text-decoration:none;
}

#presentOdeis a, #presentOdeis a:hover{
display:block;
z-index:50;
position:absolute; 
top:-14px; 
left:6px; 
color:#777; 
font-size:11px;
margin-top:20px;
padding-top:60px;
text-decoration:none;
}
#presentOdeis span{
position:absolute;
top:1px;
display:block;
width:500px;
}

/*------------------------------------------------------
B A R R E   M E N U   H O R I Z O N T A L 
------------------------------------------------------*/

#menu{
position:absolute;
z-index:100;
top: 82px;
left: 0;
height:100px;
margin:0;
padding:0;
}
#rfi a{ 
background-image:url(../pics/head_menu1.gif);
}
#rfi a:hover{ 
background-image:url(../pics/head_menu1_ro.gif);
}
#gamme a{ 
background-image:url(../pics/head_menu2.gif);
}
#gamme a:hover{ 
background-image:url(../pics/head_menu2_ro.gif);
}
#actualites a{ 
background-image:url(../pics/head_menu3.gif);
}
#actualites a:hover{ 
background-image:url(../pics/head_menu3_ro.gif);
}
#consommables a{ 
background-image:url(../pics/head_menu4.gif);
}
#consommables a:hover{ 
background-image:url(../pics/head_menu4_ro.gif);
}
#contacts a{ 
background-image:url(../pics/head_menu5.gif);
}
#contacts a:hover{ 
background-image:url(../pics/head_menu5_ro.gif);
}
#menu span{
display:none;
}
dl, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu dl {
float: left;
width: 156px;
}
#menu dd {
display: none;
border: 1px solid #bba;
top:100px;
position:absolute;
width:154px;
z-index:0;
}
#menu li {
text-align: left;
}
#menu li a:before {
content:url(../pics/fleche.gif);
}
#menu li a {
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
padding:1px 0px 1px 7px;
background: #eee;
}
#menu li a:hover, #menu li a:focus{
background:url(../pics/degrad_sous_menu.gif) repeat-x #eee;
}
#gamme a, #actualites a, #consommables a, #rfi a, #contacts a{ 
width:156px; 
height:100px;
position:relative; 
float:left; 
left:0px;
margin:0px; 
padding:0px;
background-repeat:no-repeat;
background-color:#911;
}

/*------------------------------------------------------
N A V I G A T I O N   V O L E T   D R O I T  
------------------------------------------------------*/

#voletDroit{
background-color:#eee;
position:relative;
float:right;
width:196px;
padding:120px 0px 10px 0px;
margin:0px 0px 0px 0px;
}
.voletInfo, .voletInfoRFI { 
width:150px; 
margin:0px auto 20px auto; 
text-align:center;
}
.voletInfoRFI{
margin-top:50px;
}
.borderTop{
background:url(../pics/voletInfoTop1.gif) no-repeat top; 
padding-top:8px;
}
.borderBottom{
background:url(../pics/voletInfoBottom1.gif) no-repeat bottom; 
padding-bottom:8px;
}
.sideBorder{
border-left:#BBA 1px solid; 
border-right:#775 1px solid; 
background-color:#F8F8F8;
}
.sideBorder p{
text-align:left;
padding:5px;
}
.voletInfo h2{
font-size:11px; 
font-weight:bold; 
margin:0px 0px 0px 2px;
}
.voletInfo a{
display:block; 
padding:3px 0px 3px 5px; 
text-align:left; 
background-image:url(../pics/BG_a_VoletInfo.gif); 
text-decoration:none; 
} 
.voletInfo a:hover{ 
background-image:none;
}

/*------------------------------------------------------
P A G E   /   C O N T E N U 
------------------------------------------------------*/

#page{
background-color:#F8F8F8;
position:relative;
width:578px;
padding:120px 0px 10px 0px;
border:#ddd solid 1px;
float:left;
min-height:400px;
}
.New{
display:block;
width:460px;
position:relative; 
left:-10px;
overflow:visible;
margin-bottom:20px; 
padding:5px 80px 20px 72px;
}
.New p{
margin:0px 0px 11px 5px;
padding:0px 0px 0px 5px;
text-align:justify; 
}
/* - - - - - - - -
++ T I T R E S ++	
 - - - - - - - - */
.New h2, .avertissement{
color:#911;
}
.New h2{
font-size:15px; 
font-weight:bold;
position:relative;
margin:0px 0px 4px 0px;
padding-bottom:5px;
border-bottom:#888888 solid thin;
}
.New h3, .New .soustitre, .soustitreLight {
background:url(../pics/fleche-new-h3.gif) no-repeat left; 
font:11px/15px Tahoma, Arial normal;
margin:5px -5px 0px 0px;
padding:2px 0px 2px 14px;
}
.New .soustitre{ 
border:none;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 14px; 
font-weight:bold;
}
.soustitreLight{ 
border:none;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 14px; 
font-weight:normal; 
}
/* - - - - - - - -
++ L I E N S ++	
 - - - - - - - - */

.NewsPlus a{
position:relative;
text-decoration:none; 
top:0px;
}
.NewsPlus a:hover{
text-decoration:underline;
}
/* - - - - - - - -
++ I M A G E S ++	
 - - - - - - - - */
.imageDroite{
float:right;
padding-left:10px;
}
.imageGauche{
float:left;
padding-right:10px;
}
/* - - - - - - - -
++ C A L E N D R I E R ++	
 - - - - - - - - */
.calNew{
color:#c3c3a8;/* #D5D5C4; */
text-align:center; 
text-transform:uppercase; 
font-size: 11px;
background:url(../pics/calendrier.gif) 0 0 no-repeat;
position:relative; 
top:-22px; 
left:-45px;
display:block; 
width: 40px; 
height:45px;
padding-top:4px;
margin-bottom:-47px;
}
.calNew .month {
color:#c3c3a8;
font-weight:bold; 
font-size:13px; 
text-indent:-2px; 
letter-spacing:-1px; 
text-shadow:#bbb 2px 2px 0;
display: block;
top:4px;
padding-bottom:3px;
}
/* - - - - - - - -
++ T A B L E A U X ++	
 - - - - - - - - */
.TabMiddl{
margin:10px auto 5px auto;
}
.TabMiddl tr{
background-color:#F8F8F8!important;
}
/* - - - - - - - -
++ R E T O U R   H A U T ++	
 - - - - - - - - */
#AllerHaut a{
background:url(../pics/Go_top.gif) no-repeat top;
text-decoration:none; 
left:5px;
width:50px;
text-align:center;
font:9px/9px Tahoma, Arial;
position:relative;
padding-top:20px;
}
#AllerHaut a:hover{ 
text-decoration:underline;
background:url(../pics/Go_top_hover.gif) no-repeat top;
}


/*------------------------------------------------------
F O O T E R 
------------------------------------------------------*/

#footer{
margin:0px auto 0px auto; 
text-align:center; 
background:url(../pics/BG_Footer.gif) repeat-x bottom;
padding:0px 0px 4px 0px; 
}




