
/* ----------------------------------------------------------------------------------------------------------
1) HTML tags
---------------------------------------------------------------------------------------------------------- */

body {color: #575757; background: #f2f2f2; font: 14px/21px Arial, Helvetica, sans-serif;}


h1, h2, h3, h4, h5, h6, p, address, blockquote, table, dl, fieldset {margin:15px 0; color: #575757;}
h2.topTitle{border-bottom:1px solid #DDDDDD; color:#3088C5; font-size:20px; margin-top:20px; font-family:Helvetica,Arial; font-weight:bold; line-height:1.1em; padding-bottom:5px; text-shadow:0 1px 0}

/* ----------------------------------------------------------------------------------------------------------
2) HTML styles
---------------------------------------------------------------------------------------------------------- */

ul.ul-01 {margin:15px 0; list-style:none;}
ul.ul-01 li {padding:2px 0 2px 25px; background:url("../design/ul-01.gif") 0 50% no-repeat; font-size:85%;}

ul.ul-list {margin:15px 0; list-style:none;}
ul.ul-list li {padding:1px 0;}
.date {padding:0px 10px 0px 5px; font-weight:bold;	font-style:italic; float:left; min-height:60px;}
.date_news {padding:0px 10px 0px 0px; font-weight:bold;	font-style:italic; float:left;}

.link_news{margin:20px 0px 0px 250px;}
.link_news a{text-decoration:none;}
.button{background:url(../design/button.gif) no-repeat;display: inline; float:left; color: #575757; font-weight:bold; height:30px; margin:0px 10px 0px 10px; text-decoration:none; width:150px;}
.button:hover{color:#519B44;}
.download{background:url(../design/download.gif) no-repeat 10px 5px; text-indent:30px; display:block;}
.newsletter{background:url(../design/msg.gif) no-repeat 10px 5px;text-indent:30px;display:block;}
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}

/* ----------------------------------------------------------------------------------------------------------
3) Layout
---------------------------------------------------------------------------------------------------------- */

#main {width:1000px; margin:20px auto;  overflow:hidden; background:white; border:1px solid #fff; padding:1px 0 0;-moz-box-shadow:0 0 15px #4e7093;}
#global {width:960px; margin:0px 0px 0px 20px;}

    #header {position:relative; height:90px; padding:82px 20px 15px 20px;}

    #logo {position:absolute; top:-45px; left:-75px;}
		
	#wrap {width:190px; height:25px; text-align:left; background:url("../design/compteur.gif") 0px 0px no-repeat; float:right; overflow:hidden; z-index:120; margin:-28px 3px 0px 0px;  }
	#wrap img.time { float:left;}
	
	#monNombre{ float:right;font-size:20px; letter-spacing: 9px; margin:0px -5px 0px 0px; padding:3px 0px 0px 0px; font-family: Lucida Console;  }
		
	#logo_left{position:absolute; top:-12px; right:-15px;z-index: 10;}
		
	#nav {position:absolute; top:80px; right:20px; margin:0;}
    #nav span {margin:0 8px;}
    #nav #nav-active {font-weight:bold; text-decoration:none;}	

    #footer {background: url("../design/footer.png") no-repeat scroll center top transparent; clear:both; min-height:109px; padding:55px 0px 0px 550px; position:relative;  margin-top:-20px;  /*Affichage pour ie7*/ /margin-left:-2px; }
	/* hack Chrome / Safari */
	@media screen and (-webkit-min-device-pixel-ratio:0) {#footer  {margin-left:-2px;}}
	#footer ul {text-align: center; }
	#footer ul li {display: inline; margin-left: 20px;}
	#footer ul a { text-decoration: none; color: #7A6E64; font-size: 0.9em; font-weight: bold; }
	#footer ul a:hover, #footer ul a:focus, #footer ul a:active {color: black; font-weight: bold;}



/* ----------------------------------------------------------------------------------------------------------
4-1) Page: Homepage
---------------------------------------------------------------------------------------------------------- */

#col-top {position:relative; width:960px; height:5px; margin: 7px 0px 0px 0px; background:url("../design/col-top.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;z-index: 10;}
#col-bottom {width:960px; height:5px; margin: 0px 0px 15px 0px; background:url("../design/col-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}
#col {background:url("../design/col.gif") repeat-y scroll 0 0 transparent; padding:15px 30px 15px 20px; position:relative;}

#col-top-contact {position:relative; width:960px; height:70px; margin: 7px 0px 0px 0px; background:url("../design/col-top-contact.png") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;z-index: 10;}

#container {position:relative; width:990px; height:300px; padding:5px 30px 15px 0px; margin: 0px 0px 0px -15px;  z-index: 10; }

#col_one {background:url("../design/col_one.png") repeat-y scroll 0 0; padding:0px 30px 15px 20px; position:relative;}
#col_one_top {position:relative; width:990px; height:5px; margin: 15px 0px 0px 0px; background:url("../design/col_one_top.png") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;z-index: 10;}
#col_one_bottom { width:990px; height:5px; margin: 0px 0px 0px 0px; background:url("../design/col_one_bottom.png") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}


#cols2-top {width:960px; height:5px; margin-top:15px; background:url("../design/cols2-top.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}
#cols2-top-contact {width:960px; height:5px; margin-top:15px; background:url("../design/cols2-top-left.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}
#cols2-bottom {width:960px; height:5px; margin-bottom:15px; background:url("../design/cols2-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden; }
#cols2-bottom-contact {width:960px; height:5px; margin-bottom:15px; background:url("../design/cols2-bottom-left.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}
#cols2 {background:url("../design/cols2.gif") 0 0 repeat-y;}
#cols2-left {background:url("../design/cols2-left.gif") 0 0 repeat-y;}

    #cols2 #col-left {float:left; width:595px; padding:20px 20px 0px 20px;}
    #cols2 #col-right {float:right; width:275px; margin-right:1px; padding:0px 30px 0px 0px;}
	#col-left-contact {float:right; width:595px; margin-right:1px; padding: 0 20px 20px 20px;}
    
        #cols2 #col-left h4, #cols2 #col-right h3 {margin:0; font-size:100%;}
        #cols2 #col-left .title {background:url("../design/dot.gif") 0 50% repeat-x;}
        #cols2 #col-left .title h4 {display:inline; padding-right:10px;}
        #cols2 #col-left .title span {padding-left:10px;}
		

        #cols2 .box {margin-top:15px;}
        #cols2 #col-right h3 {margin:0; font-size:100%;}
        #col-left-contact h4 {margin:0; font-size:100%;}
        #col-left-contact .title { background:url("../design/dot.gif") 0 50% repeat-x; margin:10px 30px 20px 0px;}
		#col-left-contact .title h4 {display:inline; padding-right: 10px; }
        #cols2 #col-right h3 span {padding-right:10px;}
        #cols2 .col-right-img {float:left; width:65px;margin:0px 0px 0px 10px;}
        #cols2 .col-right-text {float:right; width:200px;}
        #cols2 .col-right-text p {margin:0px 0px 0px 10px;}

#cols3-top {width:960px; height:5px; margin-top:55px; background:url("../design/cols3-top.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}
#cols3-bottom {width:960px; height:5px; margin-bottom:15px; background:url("../design/cols3-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;}
#cols3 {background:url("../design/cols3.gif") 0 0 repeat-y;}

    .col {float:left; width:308px; padding:0 1px; margin-right:15px;}
    .col.last {margin-right:0;}
    .col h3 {margin:0; padding:7px 15px 12px 50px; background:url("../design/cols3-title.gif") 20px 40% no-repeat; font-size:120%;}
    .title_right_last_box {margin:0; padding:7px 15px 12px 30px; background:url("../design/cols3-title.gif") 2px 40% no-repeat; font-size:120%;}

        .col-text {padding:20px; border-top:1px solid #DFDFDF;}
        .col-text p {margin:0;}
        .col-text ul {margin-bottom:0;}
        .col-more {padding:10px 10px 1px 0; text-align:right;}

#green_liste-pattern{position:relative; margin: 0px 0px 0px 160px; padding: 20px 0px 0px 10px; background:url("../design/note_page_pattern.png") 0 0 repeat-y; width:635px;z-index: 10;}
#green_liste-top{position:relative; width:635px; height:117px; margin: 20px 0px 0px 160px; background:url("../design/note_page_header.png") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;z-index: 10;}
#green_liste-bottom{position::relative; width:635px; height:117px; margin: 0px 0px 0px 160px; background:url("../design/note_page_footer.png") 0 0 no-repeat; font-size:0; line-height:0; overflow:hidden;z-index: 10;}
		
/* ----------------------------------------------------------------------------------------------------------
5) Others
---------------------------------------------------------------------------------------------------------- */
.language a{position:absolute; right:10px; top:20px; color: #519B44; font: bold 12px Helvetica,Arial,FreeSans,sans-serif; cursor: pointer; text-transform: uppercase; text-decoration: none; white-space: nowrap;}
.language a:hover{position:absolute; right:10px; top:20px; color: white; font: bold 12px Helvetica,Arial,FreeSans,sans-serif; cursor: pointer; text-transform: uppercase; text-decoration: none; white-space: nowrap;}
.ico-comment {padding-left:18px; background:url("../design/ico-comment.gif") 0 50% no-repeat;}
.ico-rss {padding-left:18px; background:url("../design/ico-rss.gif") 0 50% no-repeat;}
.alert { background: #fff6bf url('../tmp/exclamation.png') 15px 50% no-repeat; padding: 5px 20px 5px 45px; border-top: 2px solid #ffd324; border-bottom: 2px solid #ffd324; }
.info { background: #f8fafc url('../tmp/information.png') 15px 50% no-repeat; padding: 55px 20px 55px 45px; border-top: 2px solid #b5d4fe; border-bottom: 2px solid #b5d4fe;  }

.text_compteur{font-weight:bold; color:white; margin:0px 0px 5px 565px; padding-top:5px; font-size:11px;}
.smaller {font-size:85%;}

.strong {font-weight:bold;}

.image_pretty {margin:10px 0px 0px 23px; background:#dfdfdf; border:2px solid #dfdfdf; padding:5px;}
.image_pretty:hover {margin:10px 0px 0px 23px; background:#c0bcbc; border:2px solid #c0bcbc; padding:5px; opacity : 0.8; filter : alpha(opacity=80); }

#map {margin:-220px 0px 20px 300px; height:300px; width:550px; 	border: 5px solid #dfdfdf;}

#news{margin:20px 0px 0px 0px; 	border-bottom: solid 1px #c4df9b;}

.info_newsletter_global{margin:0px 0px 20px 20px;}
.info_newsletter{margin:0px 0px 20px 30px; border-top: 1px solid #51A2E5;padding: 3px 30px; height:auto ;width:auto; border-bottom: 1px solid #51A2E5; background: #D7EBFF url(../design/information.png) no-repeat 5px 3px; font-weight: bold;text-align: justify; font-size:12px;}
.form_newsletter {margin:0px 0px 0px 20px;}
.title_newsletter_validation{margin:0px 0px 10px 20px; text-align:center; font-size:16px; }
.info_newsletter_validation_delai{margin:0px 0px 10px 60px; padding: 3px 30px; height:auto ;width:150px; background: #FF9D9D url(../design/stop.gif) no-repeat 5px 3px;border: 2px solid #D00D00;color: #D00D00;font-weight: bold;text-align: center; font-size:12px;}

.title_resultats_global{
	font-family:"Trebuchet MS",Rockwell,Arial,sans-serif;
	background: url('../tmp/coins.png') 670px 0 no-repeat;
	height:64px;
	font-size:30px;
	font-weight:bold;
	margin:0px 0px 80px 0px;
	text-align:center;
	padding-top:20px;
}

.title_step_global{
	font-family:"Trebuchet MS",Rockwell,Arial,sans-serif;
	background: url('../tmp/Tools.png') 670px 0 no-repeat;
	height:64px;
	font-size:30px;
	font-weight:bold;
	margin:0px 0px 80px 0px;
	text-align:center;
	padding-top:20px;
}
.title_step {
	border-bottom:1px solid #DDDDDD;
	padding:2px 15px 15px 50px;
	background: url('../tmp/right_32.png') no-repeat;
	font-family:"Trebuchet MS",Rockwell,Arial,sans-serif;
	font-size:30px;
	font-weight:bold;
	margin-top:20px;
}

.description_step {
	width:450px;
	height:250px;
	float:left;
	margin: 20px 180px 0px 0px;
}

.installation_list {
	margin: 10px 0px 3px 30px;
}

.installation_list li{
	line-height:30px;
	list-style-image:url("../design/tick.png");
}

.pane-list {
	background: white;
	margin:  0;
	padding: 0;
	list-style: none;
}

.pane-list li {
	padding: 10px 20px 10px 10px;
	border-top: solid 1px #c4df9b;
	cursor: pointer;
	min-height: 60px;
}

.pane-list:hover {
	/*background: #f6ffe9;*/
	background: #ecfad7;
}

.col-right-text-quality {
	margin: 5px 0px 8px 30px;
	text-align: center;
	line-height:1.6em;
}
.blockquote_fr {
	  font: 1.2em/1.6em Georgia, "Times New Roman", Times, serif;
	  background: url(../design/close-quote.gif) 200px 250px no-repeat;
	  text-indent: -18px;
}

.blockquote_fr:first-letter {
  padding-left: 18px;
  background: url(../design/open-quote.gif) no-repeat left top;
  font: italic 1.4em Georgia, "Times New Roman", Times, serif;
}

.blockquote_en {
	  font: 1.2em/1.6em Georgia, "Times New Roman", Times, serif;
	  background: url(../design/close-quote.gif) 195px 195px no-repeat;
	  text-indent: -18px;
}

.blockquote_en:first-letter {
  padding-left: 18px;
  background: url(../design/open-quote.gif) no-repeat left top;
  font: italic 1.4em Georgia, "Times New Roman", Times, serif;
}


.quality_list {
	margin: 60px 0px 3px 120px;
}

.quality_list li{
	line-height:30px;
	font-weight:bold;
	font-size: 20px;
	list-style-image:url("../design/tick.png");
}

.gallery_clearfix_fmz{
	margin: 30px 0px 0px 70px;
}

.img_fmz  img{
	padding: 1px 2px 0px 0px;
}

.mapliste{
	padding:10px 20px 10px 20px;
	list-style-image:url("../design/ico-puce.png");
}

#main_green_liste{
	position:relative;
	width:1000px;
}

.icon_green {
	position:absolute;
	width:470px;
	height:377px;
	right:20px;
	top:30px;
	z-index:1000;
	background:url("../tmp/Icone_greenlist.png") 110% 2%  no-repeat;
}

#intro_green_liste{
	width:900px;
	height:300px;
	margin: 40px 0px 0px 10px;
	padding:0px 20px 0px 20px;
	background:url("../tmp/Icone_greenlist.png") 100% 2%  no-repeat;
}
.text_intro_green_list{
	text-align:justify;
	margin: 20px 0px 0px 0px;
	padding: 0px 40px 0px 0px;
	width:500px;
	float:left;
	border-right: solid 1px #c4df9b;
}


#form_green_list{
	margin: 30px 0px 10px 250px;
}

.tipsy {font-family:Helvetica,Arial; padding: 5px; margin: -70px 0px 0px -60px; font-size: 12px; opacity: 0.8; filter: alpha(opacity=80); background-repeat: no-repeat;  background-image: url(../tmp/tipsy.gif); width: 300px; }
.tipsy-inner { padding: 8px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; height:80px;  }
.tipsy-inner { -moz-border-radius:3px; -webkit-border-radius:3px; }
.tipsy-west { background-position: left center; }
.title_tooltip { font-size: 13px; font-weight:bold;}

.greenliste{
	width:635px;
	cursor:pointer;
}

h3.title_green{
	font-style:italic;
	margin: 0px 0px 20px 250px;
	font-family: 'Trebuchet MS', Rockwell, Arial, sans-serif;
	font-size: 20px;
	font-weight: bold;
}
.greenliste li {
	width:505px;
	border-bottom: solid 1px #e4de17;
	padding: 10px 0px 0px 110px;
	list-style-type:none;
	font-weight: normal;
}

.img_green{
	position:relative; left:0px; top:0px;
}

#map_description{
	margin: 15px 0px 20px 0px;
}

.titlemap{
	padding:20px 0px 5px 0px;
	border-bottom: solid 1px #c4df9b;
}
.titlemap a{
	text-decoration:none;
}

.pane-list-contact {
	background: white;
	margin:  0;
	padding: 0;
	list-style: none;
}

.pane-list-contact li {
	padding: 10px 20px 10px 10px;
	border-top: solid 1px #c4df9b;
	cursor: pointer;
	min-height: 60px;
}

.input_newsletter{
border: 1px solid #51A2E5;
width: 175px
}

.input_newsletter:hover, .input_newsletter:focus {
border-color:#c5c5c5;
background:#f6f6f6;
} 

/*animation*/

.title_anim{margin:0px 0px 0px 0px; color: #575757; font-size:130%; margin:0; padding:7px 15px 0px 25px; background:url("../design/cols3-title.gif") 0px 7px no-repeat;}

#intro_anim{
	width:900px;
	height:200px;
	margin: 10px 0px 0px 10px;
	padding:0px 20px 0px 20px;
	background:url("../tmp/boitier_fmz_anim.gif") 86% 15%  no-repeat;
}

.text_intro_anim{
	text-align:justify;
	margin: 20px 0px 50px 0px;
	padding: 0px 0px 0px 0px;
	width:600px;
	float:left;
	border-right: solid 1px #c4df9b;
}
