html{
height:100%;
}

body {
	margin: 0;
	padding: 0;
	color: #666666;
	background:url(img/bg_haut_blanc.gif) repeat-x top;
	
	background-color: #ffffff;
	text-align: center;
	font-family: Palatino, Geogia, Times, 'Times New Roman', serif;
	font-size: 95%;

	height:100%;
	
}

body > #wrapper {
        height: auto;
		
}
body > #wrappernograss {
        height: auto;
		
}
* html div#wrapper{
    height:100%;
}

* html div#wrappernograss{
    height:100%;
}
#description table  {
border:1px solid #b0c1e1;
border-collapse:separate;
border-spacing:1px;
}
#description th{
	padding:3px;
	border-right:1px solid #b0c1e1;
	border-bottom:1px solid #b0c1e1;
	background-color:#DADADA;
}
#description td {
	padding:3px;
	border-right:1px solid #b0c1e1;
	border-bottom:1px solid #b0c1e1;
	background-color:#FFFFFF;
}

#description img{margin:3px 3px;}
/* master init styles */

h1, h2, h3, h4, p, ul, li {
 margin: 0;
 padding: 0;
}

a {
 text-decoration: none;
}

a:link, a:visited {
	color: #73E600;
}

a:active, a:hover {
	text-decoration:underline;
	color: #73e600;}

ul {
 list-style-type: none;
}

li {
 list-style-position: outside;
}

/*textarea, input{
font-family: Palatino, Geogia, Times, 'Times New Roman', serif;
border:0px;
background-color: transparent;
overflow:auto;
color: #9e8b2f;
 font-size: 100%;
 font-weight: normal;
 line-height: 150%;
}*/
/* contents--------------------------------*/

div#wrapper {
	width: 90%;
	margin: 0 auto;
	padding: 20px 0 0;
	background-color: transparent;
	text-align: left;
	min-height:100%;
	position:relative;
	background:url(img/bg_bas.gif) repeat-x left bottom;
	

}
div#wrappernograss {
 width: 90%;

 margin: 0 auto;
 padding: 20px 0 0;
 background-color: transparent;
 text-align: left;
 	min-height:100%;
	position:relative;
	

}

/* div#header-------------------------------- */
div#header {
	margin-bottom:8px;
	width: auto;
	height: 70px;
	padding:0 10px;
	background-color: transparent;
	/*background-image:url(img/logo.jpg);
 background-repeat: no-repeat;
	background-position: 0 0px;*/
	text-align: left;
 
}

div#header a:link, div#header a:visited, div#navigation a:link, div#navigation a:visited {
 color: #666666;
}

div#header a:active, div#header a:hover, div#navigation a:active, div#navigation a:hover {
	color: #73e600;}


div#header h1#logo {
	color:#666666;
	font-size: 50px;
	font-weight: bold;
	font-family:"Times New Roman", Times, serif;
	line-height:35px
}
div#header h1#logo a, div#header h1#logo a:hover{
	color:#666666;
	text-decoration:none;
}
div#header h2{
	font-size: 18px;
	font-style:italic;
	font-family:"Times New Roman", Times, serif;
	text-indent:4.5em;
	line-height:28px;
	color: #828282;
}

div#header p {
 color#666666;
 font-size: 90%;
 font-weight: normal;
 text-indent: -90000px;
}

div#header ul {
 float: right;
}

div#header li {
 display: inline;
 margin-left: 0.5em;
 color: #666666;
 font-family: 'Lucida Sands', Helvetica, Arial, Verdana, sans-serif;
 font-size: 85%;
 text-transform:uppercase;
}

div#header li#accespro {
 padding-left: 0.5em;
 border-left: 1px solid #666666;
}

div#header li#accesproactu{
	padding-left: 0.5em;
	border-left: 1px solid #666666;
	color:#73e600;}
.right{text-align:right;
text-transform:none;}
/*------header end--------------*/







/* div#contents---------------------------------*/
div#contents {
	margin-top: -103px;
	margin-left:0px;	/*border-left: 5px solid #baa338;
border-bottom: 1px dotted #baa338;*/
	width: 980px;
}

div#contentsform {
margin-top: -103px;
	margin-left:0px;
	padding: 0 0 60px 0;	/*border-left: 5px solid #baa338;
border-bottom: 1px dotted #baa338;*/
	width: 980px;
	z-index:1000;
}











/* div#contents---------------------------------*/
div#comingsoon {
	
	margin-left:0px;
	margin-top:50px;
/*border-left: 5px solid #baa338;
border-bottom: 1px dotted #baa338;*/

}


/* div#contents---------------------------------*/
div#contentsindex {
	margin-top: -300px;
	margin-left:0px;
	margin-bottom:50px;	/*border-left: 5px solid #baa338;
border-bottom: 1px dotted #baa338;*/
	width: auto;
}



div#contents2 {
	margin-left:0px;
	padding: 0 0 80px 0;
	margin-top: -80px;
	width: 980px;


}

/* div#navigation ----------------------*/

div#navigation ul {
font-family: Palatino, Geogia, Times, 'Times New Roman', serif;
 margin-bottom: 2em;

}

div#navigation li {
 display: inline;
 margin-right: 0.5em;
 padding-left: 0.5em;
 border-left: 1px solid #666666;
 color: #666666;
 font-size: 100%;
 font-weight: bold;
 
}

div#navigation li#acceuil{
 padding-left: 0;
 border-left: none;
}
div#navigation li#actu{
	color:#73e600;}

/* div#navi2-------------------------------------*/
div#navi3 {
	height: auto;
	float: left;
	padding-top: 10px;
	padding-left: 20px;
	width: 240px;
}



div#navi2 {
	width: 140px;
	height: auto;
	margin-right:30px;
	float: left;
	padding-top:120px;
	padding-left: 10px;
	
 
}
div#navi2 #terre {
 background: url(img/collections.gif) 0 0 ; height: 30px; width: 150px;
 background-position:top;
  }
div#navi2 #bronze {
background: url(img/collections.gif) 0 -30px; top: 30px; width: 150px; height: 30px; background-position:top;}
div#navi2 #zincalu {
background: url(img/collections.gif) 0 -60px; top: 60px; width: 150px; height: 30px; background-position:top;}
div#navi2 #polystones{
background: url(img/collections.gif) 0 -90px; top: 90px; width: 150px; height: 30px; background-position:top;}
div#navi2 #plants {
background: url(img/collections.gif) 0 -120px; top: 120px; width: 150px; height: 30px; background-position:top;}
div#navi2 #destockages {
background: url(img/collections.gif) 0 -150px; top: 150px; width: 150px; height: 30px;  background-position:top;}
div#navi2 #nouveautes {
background: url(img/collections.gif) 0 -180px; top:180px; width: 150px; height: 30px;  background-position:top;}
















div#navi2 ul {
 list-style-type: none;
 text-transform:uppercase;

}

div#navi2 li {padding:0;
}
div#navi2 li a{
	color: #666666;
	display:block;
	height:17px;
	background-color:transparent;
	text-align:center;
	padding:7px;
	border-top:3px solid #EAEAEA;
	border-left:3px solid #eaeaea;
	border-bottom:3px solid #C3C3C3;
	border-right:3px solid #c3c3c3;
	}

div#navi2 li a:hover{
	background-color:#f9f9f9;
	color:#73e600;}
img#mainImg {
	float: left;
	/*border: 5px solid #B0B0B0;*/
	margin-right: 20px;
	z-index: 2;
}
#wrapper #contents #left {
	background-color: #99CCCC;
	height: 300px;
	width: 435px;
	float: left;
	margin-top: 0px;
}


img#mainImg2 {
	width:300px;
	/*border: 5px solid #B0B0B0;*/
	top: 0px;
	height: 300px;
	margin-right:20px;
	margin-bottom: 50px;
	

}
div#produitimg_desc {
	width:320px;
	top: 0px;
	float: left;
	padding-left: 20px;
	padding-bottom: 50px;

}
div#produitimg_desc img{ border:0px;}
div#produitimg_desc img a{ border:0px;}


.width300{
	width:300px;
}


div#descriptionindex{
	width:auto;
	color: #666666;
	font-size: 100%;
	font-weight: normal;
	line-height: 150%;
	padding: 0 0 0 650px;
	}
#z1000 {
	z-index: 1000;
}

	div#description{
	width:300px;
	margin-top:0px;
	margin-left:650px;
	color: #666666;
	font-size: 100%;
	font-weight: normal;
	line-height: 150%;
	height:100%;
	margin-bottom: 100px;
	}
	div#descriptionboutique{
	width:300px;
	margin-top:0px;
	margin-left:650px;
	color: #666666;
	font-size: 100%;
	font-weight: normal;
	line-height: 150%;
	
	
	}
		
div#descriptionboutique h1{
text-transform:uppercase;
	padding-top: 10px;
	padding-bottom: 20px;

}


	div#descriptionproduits{
	width:auto;
	margin-top:0px;
	margin-left:600px;
	color: #666666;
	font-size: 100%;
	font-weight: normal;
	line-height: 150%;
	height:100%;
	}
	
	
	
div#description h1{
text-transform:uppercase;
	padding-top: 10px;
	padding-bottom: 20px;

}
	
div#descriptionproduits h1{
	padding-top: 10px;
	padding-bottom: 20px;

}
	
	

#wrapper #contents2 #left {
	background-color: #3333FF;
	float: left;
	height: 300px;
	width: 300px;
}

.desc{
	margin-top:5px;
	margin-bottom: 5px;
	color: #666666;
	font-size: 100%;
	font-weight: normal;
	line-height: 120%;
	}



div#contents h2 {
 margin-bottom: 1em;
 color: #666666;
 font-size: 200%;
 font-weight: normal;
 text-transform: lowercase;
}

div#contents h2#archives {
 color: #d9be42;
 font-size: 140%;
 font-weight: bold;
}



div#contents h3 {
 margin-bottom: 0.5em;
 color: #d9be42;
 font-size: 150%;
 font-weight: normal;
 text-transform: capitalize;
}





/*div#contents ul {
 list-style-type: disc;
}

div#contents li {
 color: #66581e;
 list-style-position: inside;
}*/



.menu {
	position:relative;
	
	font-family: Palatino, Geogia, Times, 'Times New Roman', serif;
	font-size:11px;
	text-transform:uppercase;
	text-align:center;
	width: 900px;
	
}
/* hack to correct IE5.5 faulty box model */
* html .menu {
	width:775px;
	w\idth:775px;
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none;}
.menu ul ul {width:149px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:149px;position:relative;}

/* style the links for the top level */


.menu a, .menu a:visited {
	display:block;
	font-size:11px;
	text-decoration:none;
	color:#666;
	width:140px;
	height:32px;
	background:transparent;
	line-height:30px;
	font-weight:bold;
	border-top:3px solid #f5f5f5;
	border-left:3px solid #f2f2f2;
	border-bottom:3px solid #E0DED1;
	border-right:3px solid #E0DED1;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
	width:149px;
	w\idth:140px;
}

/* top level :hover =======================================================================*/
.menu a:hover, .menu ul ul a:hover{color:#fff; background:#AFAEA3; text-decoration:none;}
.menu :hover > a, .menu ul ul :hover > a {color:#fff; background:#AFAEA3; text-decoration:none;}/*--menu hover*/

#s2, #s3, #s5{display:none;}



#sublinks{
	width:auto;
	margin:0 auto;
	background:#888888;
	height:30px;
	font-size:11px;
}	
	#sublinks ul{
	 height:32px;
	 line-height:31px;	
	}
	#sublinks ul li{
		display:inline;
	}
	#sublinks ul li a,
	#sublinks ul li a:visited {
		padding:0 20px;
		display:block;
		text-decoration:none;
		float:left;
		color:#FFFFFF;
	}
	#sublinks ul li a:hover{
		text-decoration:underline;
	}
/* ----------- SUBMENU ----------- */
#s2, #s3, #s5{display:none;}
	

























/* second level links ===================================================================*/
.menu ul ul a, .menu ul ul a:visited {
	background-color:#e9ebd3;
	color:#666;
	height:auto;
	line-height:1em;
	padding:5px;
	width:133px;
	border-width:0 1px 1px 1px;
	text-align:center;
	text-decoration:none;
}




/* second level  .drop=========================================== */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
	background-color:#E9EBD3;
	text-decoration:none;
	text-transform:none;
}
/* second level  .drop a:hover====================================================*/
.menu ul ul a.drop:hover{
	background-color: #F9F7ED;
	color: #888;
}
.menu ul ul :hover > a.drop {
	background:#F9F7ED;
	color: #888;
	text-transform:none;
}


/* style the third level================================================= */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#e2dfa8;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#b2ab9b;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:38px;left:0; width:149px;}
/* another hack for IE5.5 */
* html .menu ul ul {top:35px;t\op:36px;}

/* position the third level flyout menu */
.menu ul ul ul{left:149px; top:-1px; width:149px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;}



/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:150px;w\idth:135px;}


/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }


/*class for make visible----------------------------------------*/
.menu ul li a.visible{
visibility:visible;

}
.menu ul li a#actuul{
color:#FFFFFF;
background:#AFAEA3;}
.menu ul ul li a#actuli{
	background:#666;
	color: #fff;
	}






/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul {visibility:hidden;}



/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}
























/* address#footer --------------------------------------------*/
div#footer {
	clear: both;
	width: 90%;
	height:40px;
	border-top: 1px solid #666666;
	padding-top: 5px;
	text-align: center;
	font-family:  Verdana, sans-serif;
	font-size:x-small;
	position:absolute;
	bottom:-1px;
	margin:0;
	z-index: 1;
	left: -3px;
}



div#footerrelative {
	clear: both;
	width: 90%;
	height:40px;
	border-top: 1px solid #666666;
	padding-top: 5px;
	text-align: center;
	font-family:  Verdana, sans-serif;
	font-size:x-small;
	position:relative
	bottom:0px;
	margin:0;
	z-index: 1;
}

#boutique {
	clear: both;
	width: 600px;
	padding-top: 50px;
	margin-top: -75px;
	margin-bottom: 100px;
	margin-left: 160px;
}

* div#boutique {margin-top:-10px;}
#boutique img{
	margin:3px 3px 3px 3px;
}

#procedes{
	clear: both;
	width: 700px;
	padding-top: 50px;
	padding-left: 70px;
	margin-top: -150px;
	padding-bottom: 120px;
}
#procedes .desc img{
	margin:0px 20px 10px 20px;
	
	
}

#formmail {
	clear: both;
	width: 600px;
	padding-top: 50px;
	padding-left: 160px;
}

#formmail img{
	margin:3px 3px 3px 3px;
}
#comingsoon {
	width: 600px;
	float: left;
	padding: 0 0 100px 120px;

	
	
}
#comingsoon h1{
	font-size: 50px;
	color: #C7C7C7;

	
	
}
#900x205 {
	height: 205px;
	width: 900px;
}
