@import url(typos.css);

  /*////////////////
 ///// Règles /////
////////////////*/

/* Convention de nommage : camelCase + conteneurTypeLibellé */
/* Hiérarchisation :
   1. Le positionnement => display – visibility – position – top/right/bottom/left – z-index – float – clear
   2. Les marges et bordures => margin – padding – border
   3. Les dimensions => width – height – min-width/max-width – min-height/max-height
   4. Les propriétés de texte => font – line-height – text-align – text-indent – text-decoration – text-transform – letter-spacing – word-spacing – color
   5. L'arrière-plan => background */


  /*//////////////////
 ///// Couleurs /////
//////////////////*/

/* Gris foncé : 322d33 */



  /*//////////////////////////
 ///// Classes globales /////
//////////////////////////*/

HTML {
	height:100%;
	margin:0;
	padding:0;
}

BODY {
	height:100%;
	margin:0;
	padding:0;
	
	font-family:"Trebuchet MS";
	font-size:12px;
	line-height:18px;
	color:#3e3938;
}

TD {

}

P {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	line-height:17px;
	margin:0;
	margin-top:10px;
	margin-bottom:10px;
}


  /*/////////////////////////////////
 ///// Classes de la structure /////
/////////////////////////////////*/

#center {
	width:980px;
	margin:0 auto;
	text-align:left;
	background-image:url(../img/fond.gif);
	background-position:left;
	background-repeat:repeat-y;
	display:table;
}

#wrapper {
	position:relative;
	width:980px;
	margin:0 auto;
	background-image:url(../img/footer.gif);
	background-position:bottom left;
	background-repeat:no-repeat;
	float:left;
}

#menu {
	float:left;
	width:208px;
}

#nav_princ {
	margin-bottom:260px;
	margin-top:0;
	list-style:none;
	padding-left:0;
	padding-bottom:5px;
	margin-left:0;
	
	background-image:url(../img/menu_v_footer.gif);
	background-position:bottom left;
	background-repeat:no-repeat;
}

#nav_princ LI {
	height:25px;
	
	background-image:url(../img/menu_v_bt.gif);
	background-position:left;
	background-repeat:no-repeat;
	
	padding-left:0;
	margin-left:0;
	text-indent:20px;
	line-height:22px;
	
	overflow:hidden;
}

#nav_princ LI A {
	color:#FFFFFF;
	display:block;
	height:100%;
	width:100%;
	text-decoration:none;
}

#nav_princ LI A:hover {
	text-decoration:underline;
}

#nav_princ #active {
	color:#FFFFFF;
	font-weight: bold;
}

#nav_princ .sousmenu {
	background-color:#FFFFFF;
	background-image:none;
	
	background-image:url(../img/li.gif);
	background-position:20px;
	background-repeat:no-repeat;
	
	text-indent:35px;
	line-height:20px;
	font-size:11px;
	height:20px;
}

#nav_princ .sousmenu A {
	color:#000000;
	display:block;
	height:100%;
	width:100%;
	text-decoration:none;
}

#nav_princ .sousmenu A:hover {
	text-decoration:underline;
}

#menu_footer {
	position:absolute;
	bottom:0;
	left:0;
}

#skip {
	display:none;
}

#logo {
	height:148px;	
}

#contenu {
	float:left;
	width:702px;
	padding-left:30px;
	padding-right:30px;
	
	background-image:url(../img/header.gif);
	background-position:top left;
	background-repeat:no-repeat;
}

#nav_sec {
	height:27px;
	margin:0;
	margin-top:30px;
	margin-bottom:20px;
	margin-left:202px;
	
	list-style:none;
	padding-left:0;
	padding-bottom:5px;
}

#nav_sec LI {
	height:27px;
	float:left;
	
	background-image:url(../img/menu_h_bt.gif);
	background-position:left;
	background-repeat:repeat-x;
	
	padding-left:0;
	margin-right:10px;
	margin-left:0;
	line-height:24px;
	overflow:hidden;
}

#nav_sec LI DIV {
	float:left;
	height:27px;
	text-align:center;
	cursor:pointer;
}

#nav_sec LI .bouton_g {
	width:6px;
	background-image:url(../img/menu_h_bt_g.gif);
	background-position:right;
	background-repeat:no-repeat;
}

#nav_sec LI .bouton_d {
	float:right;
	width:8px;
	background-image:url(../img/menu_h_bt_d.gif);
	background-position:left;
	background-repeat:no-repeat;
} 
#nav_sec LI A {
	color:#FFFFFF;
	display:block;
	height:100%;
	width:100%;
	text-decoration:none;
}

#nav_sec LI A:hover {
	text-decoration:underline;
}

#footer {
	padding-top:20px;
	clear: both;
}

/**********************TABLEAU DE PRODUIT*******************************/
#contenu #vig_ul {
position: relative;
z-index: 3;
list-style-type: none;
margin: 0px;
padding-left: 1px;
clear: both;
}
#contenu #vig_ul li {
display: inline;
position: relative;
float: left;
width: 120px;
border: 0px;
padding: 0px;
margin: 0px 0px 12px 12px;
background-image: none;
text-align: center;
}



.tabloproduit{
	width:120px;
	height:83px;
	border-width:1px;
	border-style:solid;
	border-color:#70ad3a;
}	

.tabloproduit tr{

}	
.tabloproduit td{

}

.tdtabloproduit{
	background-color: #70ad3a;
	height:18px;
	line-height:10px;
}

.tdtabloproduit2{
	height:55px;
	background-position:center;
	background-repeat:no-repeat;
}

.tabloproduit_pageproduit{
	width:80px;
	height:53px;
	border-width:1px;
	border-style:solid;
	border-color:#70ad3a;
}	

.tdtabloproduit_pageproduit{
	background-position:center;
	background-repeat:no-repeat;
	cursor:pointer;
	padding:2px;
}

a.lienProduit:link {color: #FFFFFF; text-decoration: none; font-size:10px; font-weight:bold; line-height:10px;}
a.lienProduit:active {color: #FFFFFF; text-decoration: none; font-size:10px; font-weight:bold; line-height:10px;}
a.lienProduit:visited {color: #FFFFFF; text-decoration: none; font-size:10px; font-weight:bold; line-height:10px;} 
a.lienProduit:hover {color: #FFFFFF; text-decoration: underline; font-size:10px; font-weight:bold; line-height:10px;}
/************************** FIN TABLEAU PRODUIT *************************************/


/**********************TABLEAU DE PROMOTION*******************************/
.tablopromo{
 width: 710px;
}

.tablopromotr1{
	background-color:#70ad3a;
	padding:3px 0px 3px 3px;
	font-weight:bold;
}

.tablopromotr1 span{
	color:#FFFFFF;
}

.tablopromotd1{
 width: 120px;
 height:60px;
 border: 1px solid #70ad3a;
}

.tablopromotd2{
 width: 350px;
 font-size:16px;
 font-weight:bold;
 text-align:left;
 padding:10px;
}

.tablopromotd2 a:link, .tablopromotd2 a:visited, .tablopromotd2 a:active{
text-decoration:none;
color:#404040;
}

.tablopromotd2 a:hover{
text-decoration:none;
color:#000000;
}


.tablopromotd3{
 width: 250px;
 text-align:left;
 padding:10px;
}

.tablopromotd3 a:link, .tablopromotd3 a:visited, .tablopromotd3 a:active{
text-decoration:none;
color:#404040;
}

.tablopromotd3 a:hover{
text-decoration:none;
color:#000000;
}
/************************** FIN TABLEAU PROMOTION *************************************/



/* PLAN DU SITE */
a.lienPlan:link {color: #000000; text-decoration: none; font-size:12px;}
a.lienPlan:active {color: #000000; text-decoration: none; font-size:12px;}
a.lienPlan:visited {color: #000000; text-decoration: none; font-size:12px; } 
a.lienPlan:hover {color: #000000; text-decoration: underline; font-size:12px;}

/*   CONTACT    */
.c60 {
float:left;
width: 60%;
}
.d40 {
float:right;
width: 39%;
}
form {
margin: 0px 0px 0px 0px;
text-align: right;
}
fieldset {
padding-bottom: 5px;
padding-right: 5px;
}
#contenu fieldset p {
margin: 0px;
}
#contenu fieldset .mb5 {
margin-bottom: 5px;
}
input, textarea {
width: 70%;
}
.sub {
width: 5em;
}
input, textarea, label {
vertical-align: middle;
}
label {
font-weight: bold;
}
label#tp {
position: relative;
top: 3px;
vertical-align: top;
}
input {
font-size: 1em;
}
.bigr {
font-size: 125%;
font-weight: bold;
color: #f00;
background-color: #fff;
line-height: 0.7;
}
.fcr {
color: #f00;
background: #fff;
}
dt {
font-weight: bold;
}