/* Général
-------------------------------------------------------- */

* {
margin: 0;
padding: 0;
}

html,body {
height: 100%;
}

body{
	behavior:url("hoverIE/csshover.htc");
	background: #daeedf /*url(shadow.png) repeat-y 50% 0*/;
	color: #000;
	font-size: 80%;
	line-height: 1.6em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6{
	font-family: "Trebuchet MS", sans-serif;
}

h1{font-size: 1.5em;}
h2{font-size: 1.4em;}
h3{font-size: 1.3em;}
h4{font-size: 1.2em;}
h5{font-size: 1.1em;}
h6{font-size: 1em;}

/* Les containers
-------------------------------------------------------- */



#container {
position: relative;
width: 1024px;
min-height: 100%;
margin: 0 auto;
}

#shadow {
/*padding: 0 11px;*/
min-height: 100%;
}

#main {
width: 100%;
float: left;
/*/*border: 1px black solid; /* temp */
background: #fff url(background.jpg) top left;
background-repeat: no-repeat;
min-height: 100%;
}

#flou {
position: relative;
width: 100%;
float: left;
/*/*border: 1px black solid; /* temp */
/*background: transparent url(flou2.png) top left repeat-y;*/
min-height: 100%;
}

/* L'entête
-------------------------------------------------------- */

#header {
/*border: 1px red solid; /* temp */
/*padding: 0;*/
margin: 0 0 0 330px;
}

#header_title {
/*height: 30px;*/
position: relative;
left: 2px;
}

#header_title p {
color: #060;
font-family: Helvetica;
font-size: 54px;
/*font-weight: bold;*/
/*letter-spacing: 83px;*/
/*text-align: right;*/
/*margin: 40px 100px 0 0;*/
margin-top: 40px;
padding-right: 72px;
}

#header_title p .notlast{
margin-right: 83px;
}

#header_title p .last{
margin-right: 0;
}

#header_subtitle {
height: 45px;
}

#header_subtitle p {
color: #060;
font-family: Helvetica;
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
/*text-align: right;*/
margin: 20px 0 0 0;
}

/* Le menu
-------------------------------------------------------- */

#menu {

}

#menu ul,#menu li,#menu a {
	display:block;
	margin:0;
	padding:0;
	border:0;
}

#menu ul {
	width: 180px;
	/*width:240px !important;
	width:230px;*/
	/*border:1px solid #9d9da1;*/
	background:transparent url(flou2.png) top left repeat-y;
	/*background: white;*/
	list-style:none;
	font-weight: bold;
	/*border-left: 1px black solid;*/
	margin-left: 60px;
	padding: 10px 0;
	float: left;
}

#menu li {
	position:relative;
	padding:1px;
	/*padding-left:26px;*/
	padding-left: 7px;
	padding-right: 26px;
	/*background:url("imgs/orange.png") no-repeat;*/
	z-index:9;

}
	
/*#menu li.rubrique	{ background:url("imgs/orange.png") no-repeat; }		*/
	
#menu li.rubrique ul {
	position:absolute;
	left:230px; /* IE */
	top:-2em;
	background: transparent url("flou.png");
}		
	
#menu li.rubrique>ul { left:230px; background: transparent url("flou.png");} /* others */

#menu a {
	padding:2px;
	/*border:1px solid white;*/
	text-decoration:none;
	color:#777;
	/*font-weight:bold;*/
	width:100%; /* IE */
	/*background: transparent url("flou.png") bottom left repeat-x;*/
}

#menu li>a { width:auto; } /* others */

#menu li a.first-rub {
	/* background:url("imgs/orange.png") right no-repeat; */
	font-size: 1.3em;
}

#menu li a.second-rub {
	font-size:1.4em;
	/* background:url("imgs/orange.png") right no-repeat; */
}

#menu li a.third-rub {
	font-size:0.9em;
	/* background:url("imgs/orange.png") right no-repeat; */
}

/* regular hovers */

#menu a:hover {
	/*border-color:gray;
	background-color:#CCCCCC;*/
	color:black;
	/*background: transparent url("flou_hover.png");*/
}

#menu li.rubrique a:hover {
	/*background-color:#CCCCCC;*/
}
	
/* hovers with specificity */
	
#menu li.rubrique:hover { z-index:10; }		
		
#menu ul ul, #menu li:hover ul ul {
	display:none;
}

#menu li:hover ul,#menu li:hover li:hover ul {
	display:block;
}		

/* La page
-------------------------------------------------------- */

#content {
/*width: 100%;*/
/*/*border: 1px red solid; /* temp */
}

#colonne_gauche {
width: 262px;
height: 100%;
float: left;
/*border: 1px black solid; /* temp */
}

#left_top {
margin-top: 10em;
margin-bottom: 5em;

/*border: 1px red solid; /* temp */
}

#left_bottom {
height: 70%;
padding: 18px;
/*border: 1px red solid; /* temp */
}

#colonne_centrale {
width: 740px;
height: 410px;
float: left;
/*border: 1px black solid; /* temp */
}

#middle_top {
height: 30%;
/*padding: 50px 0 0 50px;*/
/*position: relative;*/
/*border: 1px red solid; /* temp */
}

#middle_middle {
clear: both;
height: 60%;
/*border: 1px red solid; /* temp */
}



.avertissement {
/*position: relative;
top: 4.5em;
left: 70px;
width: 150%;
padding: 10px;*/
text-align: center;
display: block;
/*border-top: 1px #ddd solid;
border-bottom: 1px #ddd solid;
background: transparent url("flou.png") top left;*/
font-size: 1.2em;
margin-left: 100px;
}

.contact {
/*position: relative;
top: 4.5em;
left: 70px;
width: 150%;
padding: 10px;*/
text-align: left;
display: block;
/*border-top: 1px #ddd solid;
border-bottom: 1px #ddd solid;
background: transparent url("flou.png") top left;*/
font-size: 1.2em;
margin-left: 300px;
border-left: 3px #060 solid;
padding-left: 2em;
}



/* ------------------------ PAGE PRODUITS ------------------ */

.produits_title {
padding-top: 2.5em;
font-size: 1.2em;
}

.fond_liste_produits{
background: url(menu_produits.jpg) 0 -20px no-repeat;
position: relative;
top: -90px;
margin-left: 385px;
}

.flou_liste_produits{
background: transparent url(flou.png) top left;
padding: 1.2em 0;
}

.liste_produits {
/*position: relative;
top: -90px;*/
text-align: left;
display: block;
font-size: 1.2em;
/*margin-left: 385px;*/
padding-left: 2em;
list-style: none;
}

.liste_produits p {
margin-top: 10px;
margin-bottom: 40px;
}

.liste_produits li {
margin: 5px 0;
}

.liste_produits li a {
text-decoration: none;
color: #222;
}

.liste_produits li a:hover{
background-color: #eee;
}

/* ------------------------ Mise en page pour chaque produit ---------------------------- */

/* ----------- ARBUM ----------- */

.arbum_boite {
position: relative;
left: 50px;
}

.arbum_visage {
position: relative;
top: -450px;
left: 550px;
width: 153px;
}

.arbum_plante {
position: relative;
top: 200px;
left: 50px;
}

.arbum_desc {
padding: 10px;
display: block;
position: relative;
top: -250px;
left: 270px;
background-color: #d2d6ff;
font-size: 1.2em;
width: 15em;
}

.arbum_desc ul {
padding-left: 20px;
}

.arbum_boite_desc {
position: relative;
top: -150px;
left: 250px;
width: 60%;
}

#middle_bottom {
/*height: 30%;*/
/*border: 1px red solid; /* temp */
}

#middle_bottom img {
float: left;
position: relative;
top: -130px;
margin: 10px;
}

#colonne_droite {
width: 370px;
height: 400px;
float: left;
/*border: 1px black solid; /* temp */
}

#right_top {
height: 60%;
/*border: 1px red solid; /* temp */
}

#langue ul {
position: relative;
right: -160px;
/*width: 40%;*/
list-style: none;
/*display: block;*/
font-size: 1.3em;
/*background-color: #feffbf;*/
/*background: transparent url("fond_jaune.jpg") top left;*/
/*border-top: 1px #ddd solid;*/
/*border-right: 1px #ddd solid;*/
}

#langue li {
padding: 0.5em;
float: left;
/*line-height: 1.4em;*/
background: transparent url("fond_jaune.jpg") top left;
}

#langue a {
background-color: transparent;
text-decoration: none;
color: black;
}

#langue a:hover {
background-color: #bfdaff;
}

#right_bottom {
/*height: 40%;*/
/*border: 1px red solid; /* temp */
}

/* Le pied de page
-------------------------------------------------------- */

#footer {
clear: both;
position: absolute;
bottom: 0;
width: 1024px;
height: 40px;
background:white top left;
/*border: 1px black solid; /*temp*/
}

#footer p {
text-align: center;
font-size: 14px;
margin: 0 30px; 
line-height: 40px;
}

#nofooter {
clear: both;
bottom: 0;
width: 1024px;
height: 37px;
background:transparent;
}