@charset "utf-8";
/* CSS Document */
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #e5dfdc;
	margin: 0; /* il est conseillé de mettre à zéro la marge et le remplissage de l'élément body, pour tenir compte des différentes valeurs par défaut des navigateurs */
	padding: 0;
	text-align: center; /* ce paramétrage centre le conteneur dans les navigateurs IE 5.x. Le texte est ensuite aligné à gauche (valeur par défaut) dans le sélecteur #container */
	color: #000000;
}
h1, h2, h3, h4, h5, h6, p {
    margin: .5em 0 .2em 0; /* Rapproche le titre du texte. (5) */
}
#container { 
	text-align: left; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
	position:absolute;
	width:955px;  /* paramétrage de la largeur à 20 pixels de moins que le plein écran (800 pixels) pour tenir compte de l'habillage du navigateur et éviter l'apparition d'un ascenseur horizontal */
	height:590px;
	background: #FFFFFF;
	top:50%;
	left:50%;
	margin: 0 auto; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
/*	border: 1px solid #000000;
*/	text-align: left; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
	margin-left:-477px;
	margin-top:-292px;
	font-size:.7em;
	text-align:justify;
	} 
#header { 
	background: url(images/bandeau-haut.jpg) no-repeat; 
	height:194px;
	width:955px;
} 
#header ul, #footer ul {
	padding:0;
	margin:0;
	}
#accueil{
	position:absolute;
	width:250px;
	height:100px;
	top:30px;
	left:40px;
	}
#rappel{
	margin-left:855px;
	top:60px;
	border:0px;}
#zonedroite{
	float:right;
	width:280px;
	height:387px;
	margin-top:5px;
	}

#zonegauche { 
	position:absolute;
	float:left;
	width:670px;	
	height:387px;
	}
#zonelexique{	
position:absolute;
	width:955px;	
	height:387px;}
.pourquoi {
	background:url(images/fond-pourquoi.gif) no-repeat left;
	}
.avantages { 
	background:url(images/fond-avantages.gif) no-repeat left;
	} 
.simulation { 
	background:url(images/fond-simulation.gif) no-repeat left;
	} 
.fondcontact { 
	background:url(images/fond-contact.gif) no-repeat left;
	}
.fondrecom { 
	background:url(images/fond-recommander.gif) no-repeat left;
	} 
.rejoindre { 
	background:url(images/fond-rejoindre.gif) no-repeat left;
	} 
.lexique { 
	background:url(images/fond-lexique.gif) no-repeat left;
	} 
.parrainage { 
	background:url(images/fond-parrainage.gif) no-repeat left;
	} 
.liens { 
	background:url(images/fond-liens.gif) no-repeat left;
	}
.infopratiques {
	background:url(images/fond-infopratiques.gif) no-repeat left;
}
.mentions {
	background:url(images/fond-mentions.gif) no-repeat left;
}
.plan {
	background:url(images/fond-plan.gif) no-repeat left;
}
#contenu{
	padding:30px 20px 20px 190px;
	overflow:auto;
	height:335px;}
* html #contenu{
	height:350px;
	padding-top:20px;
	padding-bottom:0px;	
}
*+html #contenu{
	height:350px;
	padding-top:20px;
	padding-bottom:0px;	
}

#contenu a,#contenu a:hover, #contenu a:visited, #contenu a:hover {
	color:#000;
	text-decoration:underline;}	
h1 {
	font-size:1.2em;
	}
h2 {
	font-size:1em;
}
.orange{color:#fe7908;}
.violet{color:#ba18e7;}
.vert{color:#fe7908;}
.rouge{color:#e3001a;}
.rose {color:#d30f74;}
.kaki{color:#a4ad0a;}
.bleu{color:#498ff8;}
.dore{color:#d69d3a;}
#footer { 
	padding: 0 10px 0 20px; /* ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent au-dessus. */
	background:url(images/fond-nav-bas.gif) no-repeat;
} 
#footer a {
	margin: 0; /* la mise à zéro de la marge du premier élément du pied de page permet d'éviter une possible disparition de la marge (espace entre les éléments div) */
	padding: 10px 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en évitant le risque de disparition de la marge */
	color:#FFF;
	font-weight:bold;
	text-decoration:none;

}
.fltrt { /* cette classe permet de rendre flottant le côté droit d'un élément dans la page. L'élément flottant doit précéder l'élément à côté duquel il doit se trouver dans la page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* cette classe permet de rendre flottant le côté gauche d'un élément dans la page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
#liensBas{
		width:955px;
		margin-top:10px;
		color:#847d79;
		font-size:.9em;
		text-align:center;}
		
#liensBas a{
	color:#847d79;
		text-decoration:none;}
	#liensBas a:hover{
		color:#b1a7a2;
	text-decoration:underline;}
div#nav{
	position:absolute;
	top:167px;
	width:955px;
	z-index:200;
	left:0px;
	}
	/* ----------------------------- start #nav ----------------------------- */
#nav img { border: none;}
#nav li { display: inline; list-style:none; }
#nav li a{ float: left; display:block;  height: 27px; }
#nav li a img {  border:none; vertical-align:bottom; /* for IE6 */}
#nav li a:hover { visibility:visible; }
#nav li a:hover img { visibility:visible; }
#nav li a:hover img/**/ { visibility:hidden; /* hide from IE5.0/win */}
/* ----------------------------- end #nav ----------------------------- */


/* ----------------------------- start #nav ids ----------------------------- */
#one { background:url(images/bt-accueil-over.gif) no-repeat left bottom; }
#two { background:url(images/bt-pourquoi-over.gif) no-repeat left bottom; }
#three { background:url(images/bt-avantages-over.gif) no-repeat left bottom; }
#four { background:url(images/bt-simulation-over.gif) no-repeat left bottom; }
#five { background:url(images/bt-contact-over.gif) no-repeat left bottom; }
#six { background:url(images/bt-parrainage-over.gif) no-repeat left bottom;}
#seven { background:url(images/bt-infos-over.gif) no-repeat left bottom; }
#nine { background:url(images/bt-lexique-over.gif) no-repeat left bottom; }


div#navBas{
	position:absolute;
	top:580px;
	left:658px;
	width:353px;
	}
* html div#navBas{top:592px;}
*+html div#navBas{top:592px;}
	/* ----------------------------- start #nav ----------------------------- */
#navBas img { border: none; }
#navBas li { display: inline; list-style:none; }
#navBas li a{ float: left; display:block;  height: 13px; }
#navBas li a img {  border:none; vertical-align:bottom; /* for IE6 */}
#navBas li a:hover { visibility:visible; }
#navBas li a:hover img { visibility:visible; }
#navBas li a:hover img/**/ { visibility:hidden; /* hide from IE5.0/win */}
/* ----------------------------- end #nav ----------------------------- */


/* ----------------------------- start #nav ids ----------------------------- */
#un { background:url(images/bt-rejoindre-over.gif) no-repeat left bottom; }
#trois { background:url(images/bt-mentions-over.gif) no-repeat left bottom; }

#navLexique{
	position:relative;
	height:25px;
	padding:5px;
	padding-left:5px;
	padding-bottom:2px;
	margin-left:190px;
	margin-top:20px;
}
#navLexique li{
	position:relative;
	display:inline;
	float:left;
	list-type-style:none;
	font-size:1em;
	margin-left:5px;
}
#navLexique a{
	font-size:1em;
	color:#a4ad0a;
	}
#resultats{
	position:relative;
	width:725px;
	height:305px;
	overflow:auto;
	padding-left:195px;
	padding-right:15px;
	padding-bottom:0px;
	margin-right:0px;
	padding-top:0px;
	z-index:100;
}
/***********************************CONTACT*/
#visuelContact{
	margin-top:12px;
	margin-left:10px;}
#message .envoye {
	position:absolute;
	left:120px;
	height: 15px;
	border-bottom: 1px solid #cccccc;
	border-top:#FFF solid 1px;
	border-left:#FFF solid 1px;
	border-right:#FFF solid 1px;
	width:60%;
}
#message {
	position:absolute; 
	width:550px; 
	left:190px; 
	font-size:0.8em;
}
#message legend,  #message fieldset {
	font-weight:bold;
	/*color:#FFFFFF;*/
	border-width:0px;
	font-size:12px;
}
#message legend{
	color:#e3001a;
	font-weight:bold;
	border-width:0px;}
#message label {
	font-size:0.8em;
	line-height:14px;
	}
#message fieldset {
	font-weight:normal;
	}
#message input{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	}
#message textarea{
	width:83%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	border: #CCC solid 1px;
	}
#envoyer {
position:absolute;
top:250px;
left:395px;
	font-size:1em;}
#envoyer2 {
position:absolute;
top:200px;
left:395px;
	font-size:1em;}
.filetRouge{
	background-color:#f0a6a9;
	
}
	/*#########################################""pourquoi*/
	
#actus{
width: 200px;
height: 115px;
/*border: 1px ridge black;*/
}
#logos{
	width:250px;
	margin-left:15px;
	margin-top:30px;
}

/*#########################################"infos pratiques*/
#sitesinfos ul {
	list-style-type:none;	
	width:430px;
}
#sitesinfos ul li {
	display:inline-block;
	text-align:center;
	margin-left:5px;
}
* html #sitesinfos ul {
	width:430px;

}
* html #sitesinfos ul li{
	display:inline;
	margin-left:5px;
	text-align:center;
}
*+html #sitesinfos ul li  {
	display:inline;
	margin-left:5px;
	text-align:center;
	
}
#sitesinfos ul li a img, #sitesinfos ul li a:hover img{
	border:none;
}
#sitesinfos ul li a, #sitesinfos ul li a:visited {
	border:none;
	text-decoration:none;
}
#sitesinfos ul li a:hover {
	border:none;
	text-decoration:underline;
}