/*===| I. MAIN LAYOUT  |=====================================================*/
* {margin: 0;}
html, body {height: 100%;width: 100%;}
ul, li{list-style: none;list-style-position: outside;	margin: 0;	padding: 0;}
body{font: 12px/1.5em Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;}
p{padding:5px 0 0; line-height:15px; text-align:justify}
.left{float: left;} .right{float: right;}
#push, .clr	{clear: both;}

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

#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{}


/* ===| III. LEFT COLUMN ELEMENTS |===========================================*/
#left-outter{float:left; margin: 0; overflow: hidden; color:#004349}
#left-outter p{
  line-height:14px;
  font-size:11px;
  padding-top:5px;
  }


#mdm{
  width:219px;
  height:191px;
  background:url(../../images/charte/bg-mdm.jpg) left top no-repeat;
  }
  .mdm-content{
    padding:45px 12px 0;
    height:110px;
    width:200px;
    text-align: center;
    position: relative;
    }
    #mdm .title-actualite, p.title-mdm{
      color: #04757E;
      font-size:12px;
      font-weight:bold;
      }

    .mdm-buttons{
      margin-top:5px;
      margin-left:107px;
      clear:both;
      }
    #mdm .image-left img{
      margin-top:5px;
      border: 1px solid #19B3C0;
      }
    .image-mdm{
      float:left;
      margin-right:7px;
      margin-top:3px;
      border: 1px solid #19B3C0;
      }





#notre-actualite{
  width:219px;
  height:155px;
  margin-top:13px;
  background: url(../../images/charte/bg-actualite.jpg) left top no-repeat;
  position:relative;
  }
  .notreactualite-content{
    padding-top:35px;
    padding-left:67px;
    padding-right:6px;
    }
  #notre-actualite p{
    color:#ffffff;
    }
  #notre-actualite a:link,#notre-actualite a:visited{
    color:#ffffff;
    font:bold 11px Arial;
    }
  #notre-actualite a:hover, #notre-actualite a:active{
    color:#B3E5E9;
    font:bold 11px Arial;
    }
    #actualite-popup{
      background: url(../../images/charte/bg-notreactualite.jpg) left top no-repeat;
      width:500px;
      height:400px;
      }
    .notre-actualitecontent{
      padding-top:105px;
      padding-left:10px;
      padding-right:10px;
      padding-bottom:15px;
      }


.rendez-vous{
  margin:11px 0;
  }
#adresse{
  width:219px;
  height:96px;
  background: url(../../images/charte/bg-adresse.jpg) left top no-repeat;
  margin:0px 0 11px;
  padding-top:34px;
  padding-left:9px;
  }
#plan{
  width:219px;
  height:60px;
  background: url(../../images/charte/bg-plan.jpg) left top no-repeat;
  padding-top:27px;
  text-align: center;
  margin-bottom:11px;
  }

/* ===| IV. RIGHT COLUMN ELEMENTS |===========================================*/
#right-outter{	float:left;	margin:0; padding:0; overflow: hidden;}
#right-inner{padding-left:28px; padding-top:6px;}

h1{height:38px; margin:0; padding:0;}
h1 span{display:none;}
h1#accueil{background:url(../../images/charte/title-accueil.jpg) right top no-repeat;}
h1#objets{background:url(../../images/charte/title-objets.jpg) right top no-repeat;}
h1#cadeaux{background:url(../../images/charte/title-cadeaux.jpg) right top no-repeat;}
h1#textile{background:url(../../images/charte/title-textile.jpg) right top no-repeat;}
h1#contact{background:url(../../images/charte/title-contact.jpg) right top no-repeat;}
h1#merci{background:url(../../images/charte/title-merci.jpg) right top no-repeat;}
h1#actualites{background:url(../../images/charte/title-actualites.jpg) right top no-repeat;}


h2{font:bold 16px Arial; color:#086068; text-transform: uppercase;}
h3{font:bold 12px Arial; color:#004349; text-transform: uppercase; padding-top:5px;}



.subtitle{background: url(../../images/charte/bg-box-top.gif) left top no-repeat; width:603px; color:#fff; float:left; margin-bottom:25px;}
  #right-inner .subtitle p{background-color:#05929E; padding:0 10px;  width:583px; margin-bottom:9px;}
  .subtitle div{background: url(../../images/charte/bg-box-bottom.gif) left bottom no-repeat; float:left; margin-top:9px; width:603px;}

.arrow{background: url(../../images/charte/arrow.gif) left 6px no-repeat; padding-left:17px;}


.box1{background: url(../../images/charte/bg-box1.jpg) left top no-repeat; width:524px; padding: 5px 70px 13px 10px; }
.box2{background: url(../../images/charte/bg-box2.jpg) left top no-repeat; width:524px; padding: 5px 70px 15px 10px; }
.box3{background: url(../../images/charte/bg-box3.jpg) left top no-repeat; width:524px; padding: 5px 70px 22px 10px; }
.box4{background: url(../../images/charte/bg-box4.jpg) left top no-repeat; width:524px; padding: 5px 70px 18px 10px; }









/* ===| V. FOOTER BOXES |=====================================================*/
#wrap-footer {position:relative; z-index: 4; width: 100%; text-align: left;}
#fwrap1 {position:absolute; z-index: -3; left:0; background:#DBF7FB url("../../images/charte/bg-footer.jpg") 50% 0% repeat-x; width:100%;}
#fwrap2 {position:absolute; z-index: -2; left:0; width:100%;}
#fwrap3 {position:absolute; z-index: -1; left:0; }

#footer{margin: 0 auto; padding-top: 10px; height:76px; color:#03666E; font-size:11px;}
#footer .digital{
  float:left;
  width:200px;
  }

#footer .footer-links{
  float:right;
  text-align:right;
  }
.footer-links a:link,
.footer-links a:visited{
  margin:0 7px;
  text-transform: uppercase;
  color:#03666E !important;
  text-decoration: none;
  }
.footer-links a:hover{
  color:#0EADBB !important;
  text-decoration: underline;
  }





div.ref{padding: 0 10px 0; clear:both; text-align:center}

/* ===| VI. OTHER ELEMENTS |====================================================*/
a img {border: 0;}

a:link,
a:visited{border:	0px; padding:0px; color:#0EADBB; text-decoration:none;}
a:hover,
a:active{color:#000000}

.lead{margin:0 !important; padding-top:0;}
.line{
  height:30px;
  background: url(../../images/charte/line.jpg) repeat-x left center;
  line-height:0;
  font-size:0px;
  padding:0;
  clear:both;
  }
#content .indent{margin-left:15px;}
#content .centered{
  text-align:center;
  margin:0 auto;
  clear:both;}
.left{float:left}
.right{float:right}
.image-left{
  float:left;
  margin-right:10px;
  }
.image-right{
  float:right;
  margin-left:10px;
  }
.couleur{
	color:#59F2FE;
  }
ul.list{
  list-style:none;
  margin-left:20px;
  margin-top:0px;
  }
  ul.list li{
    background: url(../../images/charte/icon-list.jpg) no-repeat left 5px;
    color:#000;
    padding-left:10px;
    line-height:17px;
    margin-top:3px;
    }

/* contact */
.contact-left{
  width:290px;
  float:left;
  padding-left:30px;
  font:normal 12px Arial;
  }
  .contact-right{
    width:270px;
    display:inline;
    float:left;
    }
    .contact-right p{
      padding-left:5px;
      }

.inputForm{
	border:1px solid #44C0CB;
	background-color:#fff;
	color:#648C93;
  width:160px;
  font:normal 12px Arial;
	}
.inputFormOver{
	border:1px solid #FE0C00;
	background-color:#ffffff;
	color:#FE0C00;
  width:160px;
  font:normal 12px Arial
	}
textarea{
  font:normal 12px Arial;
}


.label{
	width:80px;
	float:left;
	display:inline;
	clear:both;
	margin-top:5px;
	color:#000000;
	text-align:left;
  font:normal 12px Arial;

	}
  .label span{
    color:#FE0C00;
    }
.field{
	width:160px;
	float:left;
	margin-top:5px;
  font:normal 12px Arial;
 	}
.btn{
  clear:both;
  width:330px;
  margin:10px auto;
  }
  .btn div{
    float:left;
    display:inline;
    width:150px;
    }


.button{
  background:url(../../images/charte/button.jpg) no-repeat center top;
  border:none;
	width:108px;
  height:25px;
	cursor:pointer;
  color:#ffffff;
  font:bold 12px Arial;
	}
  .buttonOver{
    background:url(../../images/charte/button-over.jpg) no-repeat center top;
    border:none;
  	width:108px;
    height:25px;
  	cursor:pointer;
    color:#ffffff;
    font:bold 12px Arial;
    }