body { margin:0px; background-color:#EBE3D3; font-family: Helvetica, arial, sans-serif; font-size: 12px; }
img { border: 0;}

#global { width: 900px; background-color: #FFF; margin: 0 auto; padding: 0 20px; }

h1, h2, h3 { margin: 0 }
p { margin: 0; text-align: justify; }

a.lien-rouge { text-decoration: underline; color: #0A7EAE; }
a.lien-rouge-plus { padding-top:5px; padding-bottom:5px;text-decoration: underline; color: #0A7EAE; background: url('../images/puce-carre-bleu.gif') center left no-repeat; padding-left: 28px; }
a.lien-rouge:hover, a.lien-rouge-plus:hover { text-decoration: none; }
.spacer { margin: 0; visibility: hidden; clear: both; }

/*###############################################*/
/*############ Header / navigation  #############*/
/*###############################################*/

#header { width: 900px; height: 30px; padding-top: 192px; background: url('../images/header.gif') center no-repeat; margin-bottom: 10px; }

#nav { padding: 0; margin: 0 0 0 23px; height: 30px; width: 897px; list-style: none; }
#nav li { float: left; }
#nav li a { display: block; height: 30px; margin: 0; background-repeat: no-repeat; }

* html #nav { margin: 0 0 0 44px; } /* Hack IE 6 */

#nav-fleches { width: 34px; height: 30px; background: url('../images/nav-fleches.gif'); }

#nav-qui { width: 181px; background: url('../images/nav-qui-sommes-nous.gif'); }
#nav-enj { width: 127px; background: url('../images/nav-enjeux.gif'); }
#nav-dev { width: 198px; background: url('../images/nav-devenez-eco-citoyen.gif'); }
#nav-lie { width: 119px; background: url('../images/nav-liens-utiles.gif'); }

#nav-qui:hover, #nav-qui-on { width: 181px; background: url('../images/nav-qui-sommes-nous.gif') 0 -30px; }
#nav-enj:hover, #nav-enj-on { width: 127px; background: url('../images/nav-enjeux.gif') 0 -30px; }
#nav-dev:hover, #nav-dev-on { width: 198px; background: url('../images/nav-devenez-eco-citoyen.gif') 0 -30px; }
#nav-lie:hover, #nav-lie-on { width: 119px; background: url('../images/nav-liens-utiles.gif') 0 -30px; }

#lien-accueil {
	width: 376px;
	height: 81px;
	display: block;
	position: absolute;
	top: 0;
	margin-left: 0px;
}
* html #lien-accueil { margin-left: 40px; } /* Hack IE6 */

#lien-adt {
	width: 214px;
	height: 126px;
	display: block;
	position: absolute;
	top: 96px;
	margin-left: 686px;
}
* html #lien-adt { margin-left: 715px; }



/*###############################################*/
/*############ colonne gauche       #############*/
/*###############################################*/

#colonne-gauche { width: 220px; float: left; }


/*###############################################*/
/*############ colonne droite       #############*/
/*###############################################*/

#colonne-droite { width: 650px; margin: 0 0 0 230px; }


/*###############################################*/
/*############ Info  gauche        #############*/
/*###############################################*/

#info-gauche { width: 220px; height: 390px; margin: 0 0 30px 0; }
#info-gauche h1 { margin: 0 0 10px 0; }
#info-gauche p { text-align: justify; margin: 5px 0; }
#info-gauche .info-savoir-plus { text-align: right; }



/*###############################################*/
/*### Flash Recheche info Mini  gauche        ##*/
/*###############################################*/

#flash-recherche-2 { width: 220px; height: 390px; }
#flash-recherche-2  img {
	margin: 0;
	display: block;
	} 

/*###############################################*/
/*############ Flash Recheche info  #############*/
/*###############################################*/

#flash-recherche-1 { width: 650px; height: 390px; margin: 20px 0 20px 0; } 
#flash-recherche-1  img {
	margin: 0;
	display: block;
	} 


/*###############################################*/
/*### Flash Recheche info  ##*/
/*###############################################*/

#flash-recherche-3 { width: 200px; height: 350px; float: left; margin: 0 10px 0 0; } 
#flash-recherche-3  img {
	margin: 0;
	display: block;
	} 


/*###############################################*/
/*############ Bloc photo   #############*/
/*###############################################*/

#bloc-photo { width: 177px; height: 205px; background: url('../images/bloc-photo-barre.gif') left no-repeat; margin-left: 5px; }
#bloc-photo img { width: 153px; height: 200px; border: 2px solid #CCC; margin-left: 20px; }





/*###############################################*/
/*########### Dernieres actualites  #############*/
/*###############################################*/

#bloc-actualite { width: 390px; margin: 0 0 0 0; float: left;  }
#bloc-actualite h1 { margin: 0 0 10px 0 ; }
#bloc-actualite h2 {
	font-size: 13px;
	color: #9D7D58;
	margin: 0 0 0 0;
	letter-spacing: 1px;
}
#bloc-actualite p { margin: 0; text-align: justify; }

#toutes-les-actus { float: right; margin-top: 8px; }

.dernieres-actus { margin: 0 0 10px 0; }




/*###############################################*/
/*########### Bloc texte            #############*/
/*###############################################*/

#bloc-texte-haut{ float: left; width: 660px; margin: 0 0 0 0;  }
#bloc-texte-haut h1 { margin : 5px 0; color: #7e0001; font-size: 16px; }
#bloc-texte-haut p { text-align: justify; margin: 10px 0;  }
#bloc-texte-haut a{
	padding-top:5px; padding-bottom:5px;
	text-decoration: underline;
	color: #0A7EAE;
	background: url('../images/puce-carre-bleu.gif') left no-repeat;
	padding-left: 25px;
}
#bloc-texte-haut a:hover { text-decoration: none; }
#bloc-texte-haut a.accordeon {
	color: #0A7EAE;
	font-size: 13px;
	margin: 10px 0;
	letter-spacing: 1px;
	text-decoration: none;
	margin-top:20px;
	background-image:none;
	padding-left:0;
}
/*#bloc-texte-haut, #bloc-texte-bas h3, #bloc-texte-bas h3 a { color: #17a244; font-size: 13px; margin: 10px 0; letter-spacing: 1px; text-decoration: none;  margin-top:20px; }*/

#accordeons a{padding-top:5px; padding-bottom:5px; text-decoration: underline; color: #0A7EAE; background: url('../images/puce-carre-bleu.gif') center left no-repeat; padding-left: 28px; }
#accordeons a:hover { text-decoration: none; }

#bloc-texte-bas {clear:both; padding-top:10px;}
#bloc-texte-haut h2 {
	color: #BC2B4C;
	font-size: 15px;
	margin: 30px 0 0 0;
	letter-spacing: 1px;
}
#bloc-texte-bas h3, #bloc-texte-bas h3 a { color: #17a244; font-size: 13px; margin: 10px 0; letter-spacing: 1px; text-decoration: none;  margin-top:20px; }
#bloc-texte-bas p { padding: 5px 0; text-align: justify; }


#bloc-texte-bas .ligne-visuel { margin: 30px 0; /*width: 100%;*/ }

#bloc-texte-bas .ligne-visuel .visuel-3, #bloc-texte-bas .ligne-visuel .visuel-2, #bloc-texte-bas .ligne-visuel .visuel-1 { float: left; width: 200px; }
#bloc-texte-bas .ligne-visuel .visuel-3 img, #bloc-texte-bas .ligne-visuel .visuel-2 img, #bloc-texte-bas .ligne-visuel .visuel-1 img { margin: 0; border: 1px dotted #CCC; }
#bloc-texte-bas .ligne-visuel .visuel-3 p, #bloc-texte-bas .ligne-visuel .visuel-2 p, #bloc-texte-bas .ligne-visuel .visuel-1 p { width: 200px; text-align: center; }

/* Cas o il y aurait 3 visuels */
#bloc-texte-bas .ligne-visuel .visuel-3 {  margin-left: 10px; }

/* Cas o il y aurait 2 visuels */
#bloc-texte-bas .ligne-visuel .visuel-2 { margin-left: 84px; }
* html #bloc-texte-bas .ligne-visuel .visuel-2 { margin-left: 50px; } /* Hack IE6 */

/* Cas o il y aurait 1 seul visuel */
#bloc-texte-bas .ligne-visuel .visuel-1 { margin-left: 220px; }
* html #bloc-texte-bas .ligne-visuel .visuel-1 { margin-left: 120px; }

/*###############################################*/
/*########### Bloc Soutenir         #############*/
/*###############################################*/

#bloc-soutenir {
	width: 236px;
	height: 229px;
	background: url('../images/fond-soutenir.gif') top center no-repeat;
	float:right;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 10px;
}
#bloc-soutenir p {
	margin-left: 27px;/*21px;*/
	font-size: 12px;
	text-align: left;
}
#texte-don {
	color: #F4D193;
	margin: 0 0 0 0;
	padding: 20px 0 0 0;
	width: 195px;
	font-weight:bold;
}
#don-1, #don-2, #don-3 { color: #FFF; }

#don-1 { margin: 13px 0 0 0; width: 195px; }
#don-2 { margin: 11px 0 0 0; width: 190px; }
#don-3 { margin: 9px 0 0 0; width: 185px; }
#autres-dons-cliquer { width: 27px; height: 21px; display: block; margin: 10px 0 0 175px; background: url('../images/fleches-jaunes.gif') no-repeat; }
#bloc-soutenir .fleches { background: url('../images/fleches-jaunes.gif') no-repeat; }




/*###############################################*/
/*########### Bloc Cherche...       #############*/
/*###############################################*/

#non-au-jetable {
	width: 635px;
	height: 419px;
	float: left;
	background-image: url(../images/fond-conseils-pratiques-non-au-jetable.gif);
	background-repeat: no-repeat;
	padding-top: 40px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 15px;
	margin:0;
}
#non-au-jetable p { margin: 0 10px 10px 0; }
#non-au-jetable #conseils-pratiques {position:absolute; top:600px; margin-left:30px; width:200px; height:45px;} 
#non-au-jetable #liens-utiles {position:absolute; top:600px; margin-left:250px; width:120px; height:45px;} 

#oui-au-durable {
	width: 635px;
	height: 419px;
	float: left;
	background-image: url(../images/fond-conseils-pratiques-oui-au-durable.gif);
	background-repeat: no-repeat;
	padding-top: 40px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 15px;
	margin:0;
}
#oui-au-durable p { margin: 0 10px 10px 0; }
#oui-au-durable #durable-exemples {position:absolute; top:600px; margin-left:30px; width:200px; height:45px;} 
#oui-au-durable #liens-utiles {position:absolute; top:600px; margin-left:250px; width:120px; height:45px;} 

#allonger-duree-vie-produits {
	width: 635px;
	height: 419px;
	float: left;
	background-image: url(../images/fond-conseils-pratiques-allonger-duree-vie-produits.gif);
	background-repeat: no-repeat;
	padding-top: 40px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 15px;
	margin:0;
}
#allonger-duree-vie-produits p { margin: 0 10px 10px 0; }
#allonger-duree-vie-produits #oui-aux-alternatives {position:absolute; top:600px; margin-left:30px; width:200px; height:45px;} 
#allonger-duree-vie-produits #liens-utiles {position:absolute; top:600px; margin-left:250px; width:120px; height:45px;} 

#colonne-droite-cherche { margin: 0 0 0 260px; }
#colonne-droite-cherche img { border: 0; margin: 0; }

#colonne-droite-cherche .visuel-cherche { margin: 20px 0 0 20px; }

.liste-bouton { width: 139px; height: 10px; background: url('../images/fond-bouton.gif') top center no-repeat;
	display: block; margin: 20px 0 20px 330px; padding: 9px 5px 10px 30px; 
	text-decoration: none; color: #000; }

.liste-bouton span { display: block; width: 130px; text-align: center; cursor: pointer; }

ul#liste-cherche { border: 1px solid #999; width: 175px; height: 200px; overflow-y: scroll; position: absolute; margin: 0 0 0 329px; background: #FFF7E1; list-style: none; padding: 0; }
* html ul#liste-cherche { margin: -24px 0 0 122px; } /* Hack IE6 */
*+html ul#liste-cherche { margin: -20px 0 0 120px; } /* Hack IE 7*/

#cherche-produit #liste-cherche { background-color: #FFF4E9; }
#cherche-label #liste-cherche { background-color: #f4e5dd; }

ul#liste-cherche a { color: #000; display: block; width: 148px; height: 25px; line-height: 25px; padding-left: 10px; text-decoration: none; }
ul#liste-cherche a:hover { color: #000; text-decoration: underline; }

.ligne-1 { background-color: #FFF7E1; }
.ligne-2 { background-color: #FFEDB8; }

#cherche-produit #liste-cherche .ligne-1 { background-color: #FFF4E9; }
#cherche-produit #liste-cherche .ligne-2 { background-color: #F9E4CD; }

#cherche-label #liste-cherche .ligne-1 { background-color: #f4e5dd; }
#cherche-label #liste-cherche .ligne-2 { background-color: #f4dacc; }


/*###############################################*/
/*########### Footer#                ############*/
/*###############################################*/

/*#footer { width: 900px; background: #FFF url('../images/footer.gif') center left no-repeat; clear: both; padding: 10px 0; }*/
#footer {
	width: 900px;
	background: #FFF url('../images/footer.gif') top left no-repeat;
	clear: both;
	padding: 20px 0;
	height: 90px;
}
#footer address { font-style: normal; margin: 48px 0 0 250px; }
#footer address { font-style: normal; margin: 20px 0 0 250px; }
#footer  .intitule {color:#BC838C; }
#footer a {
	color:#FFFFFF;
	font-weight:bold;
	text-decoration: none;
}
#footer p {
	text-align:left;
	margin-left:250px;
	padding:0;
	float: left;
	width: 800px;
	margin-top: 5px;
}
#footer .nom a {
	color:#000;
	font-weight:normal;
	text-decoration: none;
}
* html #footer address { margin-top: 68px;  } /* hack IE6 */
*+html #footer address { margin-top: 68px;  } /* hack IE7 */