/* Feuille de style pour la charte graphique du site
 * Cette feuille de style est appelée depuis styles.css.
 */

/***************** STRUCTURE *****************/
*{
/*---toutes les marges sont à 0---*/
margin:0;
padding:0;
}
body,html{
	height:100%;/*---obligatoire pour le footer---*/
	background:#B0FF2E url(../images/charte/bg-body.jpg) center bottom no-repeat;
	background-attachment: fixed;
}

body{
	font-size:62.5%;
}



#container{
	position: relative;/*---obligatoire pour le footer---*/
	min-height:100%; /*---obligatoire pour le footer:Firefox---*/
	height:auto !important;/*---obligatoire pour le footer:Firefox---*/
	height:100%;/*---obligatoire pour le footer:IE---*/
	width:990px;
	margin:0 auto;
	background: url(../images/charte/bg-container.jpg) left top repeat-y;
}

#header{
	width:990px;
	height:85px;
	background:#C7FE90 url(../images/charte/header.jpg) left top no-repeat;
}
#sousheader{
	width:387px;
	height:35px;
	background:#C7FE90 url(../images/charte/sousheader.jpg) left top no-repeat;
	padding-left:603px;
}


#sousheader dt {
	cursor: pointer;
}
#sousheaderdt a {
	display: block;
}
#sousheaderdt a:hover {
	display: block;
}
#sousheader dt span {
	display: none;
}

a.bt1		{ 	background:url(../images/charte/presentation.jpg) no-repeat left top; width:143px; float:left; height: 35px; }
a:hover.bt1 {	background:url(../images/charte/presentationhover.jpg) no-repeat left top; width:143px; float:left;	height: 35px;}

a.bt2		{	background:url(../images/charte/contact.jpg) no-repeat left top; width:143px; float:left; height: 35px;}
a:hover.bt2 {   background:url(../images/charte/contacthover.jpg) no-repeat left top; width:143px; float:left; height: 35px;}

a.bt3		{   background:url(../images/charte/liens.jpg) no-repeat left top; width:101px; float:left; height: 35px;}
a:hover.bt3 {	background:url(../images/charte/lienshover.jpg) no-repeat left top; width:101px; float:left; height: 35px;}

/***************** CONTAINER DU CONTENU *****************/


#contenu {
	position:relative;
	width:990px;
	padding-bottom:90px;
	display:table;
	font-family:Arial, Helvetica, sans-serif;
	color:#D4D4D4;
	background:url(../images/charte/bg-contenu.jpg) left top no-repeat;
	
	
}

/* menu
*********************/
#contenu #menu {
  width: 224px;
  float: left;
  padding: 86px 17px 0 18px;
  font-size: 0px;
  }
#menu ul{
  list-style: none;
  }
#menu ul li{
  position: relative;
  }
#menu ul li a span{
  display: none;
  }
#bt4,
#bt5,
#bt6,
#bt7,
#bt8{
  display: block;
  width: 225px;
  height: 41px;
  }
#bt4{ background: url(../images/charte/bt1.jpg); }
#bt5{ background: url(../images/charte/bt2.jpg); }
#bt6{ background: url(../images/charte/bt3.jpg); }
#bt7{ background: url(../images/charte/bt4.jpg); }
#bt8{ background: url(../images/charte/bt5.jpg); }
#bt4:hover,
#bt5:hover,
#bt6:hover,
#bt7:hover,
#bt8:hover,
#bt4.trigered,
#bt5.trigered,
#bt6.trigered,
#bt7.trigered,
#bt8.trigered{
  background-position: 0px 41px;
  }

/* sous-menus
*********************/
#menu ul ul{
  width: 220px;
  background: #0C0;
  }
#menu ul ul li a:link,#menu ul ul li a:visited{
  display: block;
  font-size: 11px;
  color:#006600;
  position: relative;
  left: 0;
  text-decoration: none;
  padding: 4px;
  }
#menu ul ul li a:hover{
  background: #6C0;
  color:#FFFFFF;
  text-decoration:none;
  }
/***************** CONTENU TEXTUEL *****************/

#contenuTexte{
	padding:0px 20px 0px 0px;
	width:710px;
	float:left;
	display:block;
}
 .invisible
{
display:none;
}

#contenuTexte h1{
	margin:10px 0 5px 0;
	font-family: "Times New Roman", Times, serif;
	font-size:2.2em;
	text-align:left;
	width:710px;
	color: #A90A02;
	border-bottom:1px solid #006600;
}

#contenuTexte h2{
	font-family: "Times New Roman", Times, serif;
	font-size:1.8em;
	text-align:left;
	color:#006600;
	width:400px;
}
 #contenuTexte h3{
	font-family: "Times New Roman", Times, serif;
	font-size:1.8em;
	text-align:left;
  margin-bottom: 10px;
	color:#006600;
}
#contenuTexte p{
	padding-bottom:5px;
	font-size:12px!important ;
	text-align:justify;
	color:#000000
}
#contenuTexte a:link, #contenu a:visited{
	color: #006600;
	text-decoration:underline;
}
#contenuTexte a:hover, #contenu a:active{
	color: #33cc00;
	text-decoration:none;
}
#contenuTexte p.couleur, .couleur{
	font-weight:bold;
	color: #A90A02;
}
#contenuTexte p.couleur2, .couleur2{
	font-weight:bold;
	color: #006600;
}
/***************** ENCARTS *****************/
#contenu #vignettes{
	width:710px;
	padding:10px 20px 0 0;
	margin-bottom:60px;
	min-height:100%; /*---obligatoire pour le footer:Firefox---*/
	height:auto !important;/*---obligatoire pour le footer:Firefox---*/
	height:100%;/*---obligatoire pour le footer:IE---*/
	float:right;
	display:block;
}
.fleur-plantes
{
  width: 700px;
  height: 100%;
  float: left;
  margin-right: 35px;
}
.ferronnerie
{

  width: 320px;
  float: left;
  margin-right: 10px;
}
.list
{
  margin-left: 100px;
  margin-top: 20px;
  margin-bottom: 10px;
  line-height: 20px;
  font-size: 12px;
  font-weight: bold;
}
.bullet
{
  background: url(../images/charte/bullet.gif) no-repeat top left;
  margin: 1px 5px 0px 0px;
  float: left;
}
.list1
{
  margin-top: 20px;
  margin-bottom: 10px;
  line-height: 20px;
  font-size: 12px;
  font-weight: bold;
}

.list-ferronnerie1
{ width:250px;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  line-height: 20px;
  font-size: 12px;
  font-weight: bold;
  float: left;
}
.list-arbres
{ width:180px;
  margin-top: 20px;
  margin-bottom: 10px;
  line-height: 20px;
  font-size: 12px;
  font-weight: bold;
  float: left;

}
.img-left
{
  float: left;
  padding: 3px;
  border: solid 1px #272A02;
  margin: 3px 5px 2px 0px;
  cursor: pointer;
}
.img-right
{
  float: right;
  padding: 3px;
  border: solid 1px #272A02;
  margin: 0px 0px 2px 5px;
  cursor: pointer;
}
.img-center
{
  padding: 3px;
  border: solid 1px #272A02;
  margin: 12px 0px 0px 8px;
  cursor: pointer;
  float: left;
}
.logo
{
background: url(../images/charte/bg-contact.gif) no-repeat left top;
width: 339px;
height: 103px;
margin: auto;
 text-align: center;
}
.logo1
{
background: url(../images/charte/bg-contact1.gif) no-repeat left top;
width: 200px;
height: 90px;
margin: 0 auto;

padding-top: 13px;
 text-align: center;
}
.text-contact
{
  width: 200px;
  margin-top: 15px;
  float: left;
  text-align: center;
}

.ficheProd{
	width:170px;
	height:181px;
	background: url(../images/charte/bg-encart.jpg) no-repeat left top ;
	float:left;
  text-align:center;
  margin-bottom: 13px;
   margin-left: 5px;

} .ficheProdP{
	width:170px;
	height:181px;
	background: url(../images/charte/bg-encart.jpg) no-repeat left top ;
	float:left;
  text-align:center;
  margin-bottom: 13px;
   margin-left: 7px;
 }

 .ficheProdO{
	width:170px;
	height:181px;
	background: url(../images/charte/bg-encart.jpg) no-repeat left top ;
	float:left;
  text-align:center;
  margin-bottom: 13px;
   margin-left: 5px;

}
.ficheProd h4{
	width: 170px;
	height: 13px;
	float:left;
	font:18px "Times New Roman", Times, serif;
	color: #006600;
	text-align:center;
	line-height:8px;
	padding: 7px 0 6px 0;
	border-bottom: 1px solid #006600;
	margin: 0 0 2px 1px;

} .ficheProdP h4{
	width: 170px;
	height: 13px;
	float:left;
	font:18px "Times New Roman", Times, serif;
	color: #006600;
	text-align:center;
	line-height:8px;
	padding: 7px 0 6px 0;
	border-bottom: 1px solid #006600;
	margin: 0 0 2px 1px;
}
.ficheProdO h4{
	width: 170px;
	height: 13px;
	float:left;
	font:18px "Times New Roman", Times, serif;
	color: #006600;
	text-align:center;
	line-height:8px;
	padding: 7px 0 6px 0;
	border-bottom: 1px solid #006600;
	margin: 0 0 2px 1px;

}
.ficheProdF{
	width:170px;
	height:181px;
	background: url(../images/charte/bg-encart.jpg) no-repeat left top ;
	float:left;
  text-align:center;
  margin-bottom: 13px;
  margin-left: 4px;
}
.ficheProdF h4{
	width: 170px;
	height: 13px;
	float:left;
	font:18px "Times New Roman", Times, serif;
	color: #006600;
	text-align:center;
	line-height:8px;
	padding: 7px 0 6px 0;
	border-bottom: 1px solid #006600;
	margin: 0 0 2px 1px;
 }
 .ficheProdA{
	width:170px;
	height:181px;
	background: url(../images/charte/bg-encart.jpg) no-repeat left top ;
	float:left;
  text-align:center;
  margin-bottom: 13px;
  margin-left: 5px;
}
.ficheProdA h4{
	width: 170px;
	height: 13px;
	float:left;
	font:18px "Times New Roman", Times, serif;
	color: #006600;
	text-align:center;
	line-height:8px;
	padding: 7px 0 6px 0;
	border-bottom: 1px solid #006600;
	margin: 0 0 2px 1px;
 }
/*#ficheProd p
{
	width:140px;
	height:35px;
	display:block;
	text-align:center;
	padding: 5px 5px 10px 5px ;
	font:  1.1em Arial, Helvetica, sans-serifs;
	color: #003300;

}

#ficheProd #ensavoirplus{
	width:148px;
	height:20px;
	display:block;
	text-align:center;
	font:  1.1em Arial, Helvetica, sans-serifs;
	color: #000000;
	line-height:20px;


}
#ficheProd #ensavoirplus a {
	text-decoration:none;
	color: #003300;
	font-weight:bold;


}
#ficheProd #ensavoirplus a:hover{
	text-decoration:none;
	color: #006600;
}*/

/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer"></div> apres la div contenu---*/
.clearer
{
	clear: both;
	display: block;
	height: 0px;
	margin-bottom: 0px;
	font-size: 0px;
	line-height: 0px;
}
/***************** FOOTER *****************/
#footer{
	position: relative;/*---obligatoire pour le footer---*/
	margin: -90px auto 0 auto;/*---margin top = - hauteur du footer---*/
	width:990px;
	height:90px;
	font-weight:bold;
	clear:both;
	background:#C7FE90 url(../images/charte/footer.jpg) left top no-repeat;
}
#footer #idep {
	width: 243px;
	height:90px;
	float:left;
	display:block;
}
#footer #crea{
	width: 243px;
	padding: 74px 10px 0 0px;
	float:right;
	display:block;
	text-align: right;
}

#footer #crea a {
	font:bold 1.2em Arial, Helvetica, sans-serif;
	text-decoration:none;
	color: #fff;
}
#footer #crea a:hover {
text-decoration:underline;

}
/* contact page */
#frmContact{
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
  margin-top: 20px;
	padding-top:10px;
	width:490px;
  float:left;
  text-align: left;
  color: #000000;
}
#frmContact1{
background: url(../images/charte/bg-form.gif) no-repeat top center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	padding-top:2px;
	width:425px;
  float:left;
  height:320px;
  color: #000000;
}

#image_contact{
	width:200px;
  padding:10px 0px 0px 0px;
	font-family:Arial, Helvetica, sans-serif;
	text-align:center;
	float:left;
  margin-top: 10px;
}
 #contact{
	width:100%;
  float:left;
}
.inputForm{
	border:1px solid #2C8327;
	background-color:transparent;
	width:150px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#000000;
  margin-top:3px;
  margin-bottom:3px;
}
.inputFormOver{
	border:1px solid #000000;
	background-color:#2C8327;
	width:150px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#ffffff;
	margin-top:3px;
  margin-bottom:3px;
}
.inputForm1{
	border:1px solid #2C8327;
	background-color:transparent;
	width:178px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#000000;
  margin-top:3px;
  margin-bottom:3px;
}
.inputForm1Over{
	border:1px solid #000000;
	background-color:#2C8327;
	width:178px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#ffffff;
	margin-top:3px;
  margin-bottom:3px;
}
/*input{
  background-color:transparent;
  border:1px solid #2C8327;
  width:180px;
  margin-top:2px;
  margin-bottom:2px;
}*/
div.fileinputs {
	position: relative;

}

div.fakefile {
	position: absolute;
	z-index: 1;
	text-align: right;
}
input.file {
	position: absolute;
	-moz-opacity:0;
	filter:alpha(opacity: 0);
	opacity: 0;
	z-index: 0;
}
.button{
  border:1px solid #2C8327;
	background-color:transparent;
	width:65px;
  color:#5DB650;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 13px;
  font-weight: bold;
	cursor:pointer;
}
.buttonOver{
	border:1px solid #ffffff;
	background-color: #2C8327;
	width:65px;
	color:#ffffff;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 13px;
  font-weight: bold;
	cursor:pointer;
}

.petit{
  font-size:10px;
  text-align:left;
}
/*merci.php*/
#contact-title{
	margin:10px 0 0px 0;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:20px!important;
	font-weight:bold;
	color:#4B060D;
	}

#merci{
width:600px;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
font-weight:bold;
}
#ouvert
{
  width:191px;
  height: 132px;
  float: left;
  margin-top:10px;
  background: url(../images/charte/bg-ouvert.jpg) no-repeat top left;
  font-size: 12px;
  color:#A10D02;

}
#ouvert p
{ width:150px;
  float: left;
  padding-left: 30px;
  font-size: 12px;
  color:#A10D02;
  text-align:center !important;
  color:#A10D02 !important;
}

.pop
{
 font-family: Arial, Helvetica, sans-serif;
 font-size:12px;
 font-weight:bold;
}
.pop a:link, .pop a:visited{
 color: #8C1D19;
  text-decoration:none;
}
.pop a:hover, .pop a:active{
	color: #000000;
  text-decoration:underline;
}