/*===| I. MAIN LAYOUT  |=====================================================*/
* {margin: 0;}
html, body {height: 100%;width: 100%; font:normal 11px Tahoma;}
ul, li{list-style: none;list-style-position: outside;	margin: 0;	padding: 0;}
p{padding-top:8px;}
.left{float: left;} .right{float: right;}
#push, .clr	{clear: both;}

body{background-color: #000000;}
#bg1{position:absolute;z-index: 1; width:100%; background:url("images/bg0.gif") 50% 0% repeat-y;}
#bg2{position:absolute;z-index: 2; width:100%; background:url("images/bg1.jpg") 50% 0% repeat-x;}
#bg3{position:absolute;z-index: 3; background:url("images/bg2.jpg") 50% 0% no-repeat;}

#wrap-container{position:relative;z-index:4; width: 100%;}
#container{background:url("images/bg0.gif") 50% 50% repeat-y; margin:0 auto;	text-align: left;}
#content{}

/* ===| II. HEADER ELEMENTS |================================================*/
#site-header.outter{background:url("../../images/charte/header.jpg") left top no-repeat;}
#site-header .inner{}

/* ===| III. LEFT COLUMN ELEMENTS |===========================================*/
#left-outter{float:left; margin: 0; overflow: hidden;}
#left-outter{color:#000000;}
#left-outter div.outter{}
#left-outter div.inner{}

#left-outter div.box1{}
#left-outter .box1 .inner{}

#left-outter div.box2{}
#left-outter div.box3{}
#left-outter .box4{}

#mdm{
  height:106px;
  background:url("../../images/charte/bg-mdm.jpg") 0 0 no-repeat;
  padding-top:42px;
  padding-left:17px;
  padding-right:17px;
  }
  #mdm p {text-align: justify;}
  #mdm img{
    border:1px solid #000000;
    margin-top:5px;
    }
  #mdm-popup{
    background:url("../../images/charte/bg-popup.jpg") 0 0 no-repeat;
    display: table;
    }
    .mdm-popup-content{
      width:560px;
      height: 350px;
      overflow: auto;
      margin-top:105px;
      margin-left:20px;
      padding-right:5px;
      color:#ffffff;
      text-align: justify;
      line-height:15px;
      }
    #mdm-popup img{border:1px solid #634D1C;}

object{
  outline: none;
}


#info{
  height:103px;
  background:url("../../images/charte/bg-adresse.jpg") left top no-repeat;
  padding-top:42px;
  padding-left:17px;
  padding-right:29px;
  }


/* ===| IV. RIGHT COLUMN ELEMENTS |===========================================*/
#right-outter{float:left;	margin:0; padding:0; color:#ffffff; height:583px; background:url("../../images/charte/bg-content1.jpg") 50% bottom no-repeat;}
#right-inner{padding:40px 19px 0; line-height:15px; text-align:justify; float:left; width:562px;}

#right-inner a:link,#right-inner a:visited{color:#FFD476; text-decoration: underline;}
#right-inner a:hover,#right-inner a:active{color:#CBA653; text-decoration: none;}


h1{height:23px; margin-top:4px}
h1 span{display: none;}

h1#entreprise{background:url("../../images/charte/title-entreprise.jpg") right 0 no-repeat;}
h1#particulier{background:url("../../images/charte/title-particulier.jpg") right 0 no-repeat;}
h1#professionnel{background:url("../../images/charte/title-professionnel.jpg") right 0 no-repeat;}
h1#realisations{background:url("../../images/charte/title-realisations.jpg") right 0 no-repeat;}
h1#realisations-detail{background:url("../../images/charte/title-realisations-detail.jpg") right 0 no-repeat;}
h1#contact{background:url("../../images/charte/title-contact.jpg") right 0 no-repeat;}
h1#merci{background:url("../../images/charte/title-merci.jpg") right 0 no-repeat;}

/* ===| V. FOOTER BOXES |=====================================================*/
#footer{background:url("../../images/charte/bg-footer.jpg") 0 0 no-repeat; padding-top:20px;}

.digital{ float:left;}

  .digital a:link,.digital a:visited{color:#ffffff; text-decoration:none;}
  .digital a:hover,.digital a:active{color:#B3B3B3;}


#footer p{color:#FCBC2F; line-height:30px;}

.footer-links{
  float:right;
  padding-top:20px;
  color: #FCBC2F;
  padding-right:50px;
  }
  .footer-links a:link,.footer-links a:visited{color:#FCBC2F; text-decoration: none; margin:0 10px;}
  .footer-links a:hover,.footer-links a:active{color:#ffffff}


#footer.outter	{height:40px;}
#footer .inner	{background:url("") 0px 100% no-repeat; }
#footer .box1	{background:url("images/footer-bg-2.gif") 0px 0% no-repeat; }

.copyright{}
div.ref{padding: 0 10px 5px;clear:both; color:#ffffff; text-align: center;}

/* ===| VI. Basic Css|====================================================*/
a img {border: 0;}
a:focus{outline:none;}

.line{
  height:20px;
  background: url(../../images/charte/line.jpg) repeat-x left center;
  line-height:0;
  font-size:0px;
  padding:0;
  clear:both;
  }
#content .lead{padding:0;}
#content .indent{margin-left:15px;}
#content #right-inner .centered{
  text-align:center;
  margin:0 auto;
  clear:both;}
#content p.centered{
  text-align: center;
  margin:0 auto;
  }

.left{float:left}
.right{float:right}
.image-left{
  float:left;
  margin-right:7px;
  }
.image-right{
  float:right;
  margin-left:10px;
  }
#content .couleur{
	font-weight:bold;
	color:#FFBB23;
  }
#content .noBg{background: none; padding-bottom:10px; margin-left:-14px;}

ul.list{
  list-style:none;
  margin-left:40px;
  margin-top:10px;
  margin-bottom:6px;
  }
  ul.list li{
    background: url(../../images/charte/icon1.jpg) no-repeat left 5px;
    padding-left:14px;
    line-height:14px;
    color:#FFBB23;
    font-weight:bold;
    }

ul.list1{
  list-style:none;
  margin-left:126px;
  padding-top:43px;
  padding-bottom:20px;
  }
  ul.list1 li{
    background: url(../../images/charte/icon2.jpg) no-repeat left 5px;
    padding-left:14px;
    line-height:14px;
    color:#ffffff;
    }
ul.list2{
  list-style:none;
  padding-top:43px;
  padding-bottom:20px;
  margin-right:20px;
  margin-left:20px;
  }
  ul.list2 li{
    background: url(../../images/charte/icon3.jpg) no-repeat left 5px;
    padding-left:14px;
    line-height:14px;
    color:#ffffff;
    }
/* contact */
.contact-left{
  width:290px;
  float:left;
  padding-left:20px;
  font:normal 11px Arial;
  }
  .contact-right{
    width:240px;
    display:inline;
    float:left;
    font:normal 11px Arial;
    }
    .contact-right p{
      padding-left:5px;
      }

.inputForm{
	border:1px solid #A98940;
	background-color:#FFE2A0;
	color:#000000;
  width:160px;
  font:normal 11px Arial;
	}
.inputFormOver{
	border:1px solid #A98940;
	background-color:#FFFFFF;
	color:#9E6F0A;
  width:160px;
  font:normal 11px Arial
	}
textarea{
  font:normal 11px Arial;
}


.label{
	width:70px;
	float:left;
	display:inline;
	clear:both;
	margin-top:5px;
	color:#ffffff;
	text-align:left;

	}
  .label span{
    color:#FF9F04;
    font-size:10px !important;
    }
.field{
	width:160px;
	float:left;
	margin-top:5px;
  font:normal 12px Arial;
 	}
.btn{
  clear:both;
  width:330px;
  text-align: center;
  margin:10px auto 0;
  }
  .btn div{
    float:left;
    display:inline;
    width:165px;
    }
.realisations-right h1 span{
  display: inline !important;
}

.realisations-right h2 span{
  display: inline !important;
}

.realisations-right h3 span{
  display: inline !important;
}

.realisations-right h4 span{
  display: inline !important;
}

.realisations-right h5 span{
  display: inline !important;
}

.realisations-right h6 span{
  display: inline !important;
}


.button{
  background:url(../../images/charte/button.jpg) no-repeat center top;
  border:none;
	width:108px;
  height:23px;
	cursor:pointer;
  color:#ffffff;
  font:bold 11px Arial;
	}
  .buttonOver{
    background:url(../../images/charte/button-over.jpg) no-repeat center top;
    border:none;
  	width:108px;
    height:23px;
  	cursor:pointer;
    color:#B3E0CC;
    font:bold 11px Arial;
    }
.recherche{
  background:url(../../images/charte/recherche.jpg) no-repeat center top;
  display: block;
	width:75px;
  height:18px;
	cursor:pointer;
  color:#010000;
  font-size: 0px;
  border: 0 none;
	}
  .recherche:hover{
    background:url(../../images/charte/recherche-over.jpg) no-repeat center top;
    display: block;
  	width:75px;
    height:18px;
  	cursor:pointer;
    color:#010000;
    font-size: 0px;
    border: 0 none;
    }

.retour{
  background-image: url(../../images/charte/retour.gif);
  display: block;
  width: 55px;
  height: 18px;
  font-size: 0px;
  border: 0 none; }

  .retour:hover{
    background-image: url(../../images/charte/retour-over.gif);
    display: block;
    width: 55px;
    height: 18px;
    font-size: 0px;
    border: 0 none; }


/* nos realisations */
.realisations-box{
  text-align: center;
  width:170px;
  float:left;
  margin: 10px 4px 30px 11px;
  display:inline;

  }

.realisations-content{
  width:170px;
  height:145px;
  background:url(../../images/charte/bg-realisations.gif) no-repeat center top;
  }
  .realisations-box td{line-height:13px; height:30px; width:170px;}
  .realisations-content img{
    border:1px solid #63D2A2;
    }