/* Général */
html{
    height: 100%; /* Voir -> Note 1 ci-dessous */
    font-size: 100%; /* Voir -> Note 1 à la fin de la feuille de styles. */	
}

body{
    height: 100%; /* Voir -> Note 1 ci-dessous */
    margin: 0px;
	padding: 0px; /* Note -> 2 */
	font-family: Arial, Helvetica, FreeSans, sans-serif; /* 3 */
	font-size: 12px; /* -> 4 */
	color: #000000;
	background-color: #9b9b9b;
}

h1, h2, h3, h4, h5, h6{
	margin: 0px; /* -> 6 */
    padding: 0px;
}

p{
	margin: 0px;
    padding: 0px;
}

a{
	color: #000000;
}

a:hover, a:focus{
	color: #000000;
}

a img{
	border: none; /* -> 10 */
}

/*ul, ol{
	margin: 0px;
    padding: 0px;
}*/

#erreur{
    padding: 5px;
    margin-right: auto;
    margin-left: auto;
    font-size: 12px;
    font-weight: bold;
    color: #ff0000;
    text-align: center;
    border: 1px dotted #ff0000;
    
}

#valide{
    padding: 5px;
    margin-right: auto;
    margin-left: auto;
    font-size: 12px;
    font-weight: bold;
    color: #00ae19;
    text-align: center;
    border: 1px dotted #00ae19;
    
}

.highlight { background-color: yellow }

#fond_haut{
    background: url(/site-particulier/images/fond_haut.gif) top left repeat-x;
}

#fond_contenu{
    background: #acacac url(/site-particulier/images/fond_contenu.png) top left repeat-x;
}

#fond_kawneer{
    background: url(/site-particulier/images/fond_kawneer.png) center top no-repeat;
}

#fond_pied{
   background: #9b9b9b url(/site-particulier/images/fond_pied.gif) top left repeat-x;
}

#titre_article{
    font-size: 19px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0px 0px 0px 0px;
    margin: 0px 0px 20px 0px;
	color: #000000;
}

#texte{
    padding: 10px 0px 10px 0px;
}

#atouts_gagnants{
    padding: 25px 0px 0px 0px;
    margin: 0px 0px 0px 30px;
    font-size: 18px;
    font-weight: normal;
    color: #ffffff;
}

#decalage_titre_atouts{
    margin: 0px 0px 0px 30px;    
}

#menu_gauche{
    padding: 25px 0px 0px 0px;
    margin: 0px 0px 0px 30px;
    list-style: none;
}

#menu_gauche li{
    background: url(/site-particulier/images/puce_menu_gauche.png) top left no-repeat;
    padding: 0px 0px 0px 25px;
    margin: 10px 0px 0px 0px;        
}

a.lien_menu_gauche{
    font-size: 18px; 
    color: #ffffff; 
    text-decoration: none;  
}

a.lien_menu_gauche:hover{
    text-decoration: underline;    
}

.multipage{
    background-color: #ed1c24;
    color: #ffffff;
}

a.pageResults{
    color: #ffffff;
}

.fond_thickbox{
    background-color: #ed1c24;
    text-align: center;
}

a.thickbox{
    color : #ffffff;
    text-decoration: none;
}

a.thickbox:hover{
    text-decoration: underline;   
}

/* Entête */
#entete{
    height: 100px;
	padding: 0px 10px 0px 0px;
    margin: 0px;
}

#logo_haut{
    float: left;
    padding: 0px;
}

#header_droit{
    float: right;  
    padding: 0px 0px 0px 0px; 
}

#menu{
    padding: 3px 0px 0px 0px;
    margin: 0px;
    text-align: right;
    color: #000000;
}

#bloc_recherche{
    padding: 5px 0px 0px 0px;
    margin: 0px;
    text-align: right;
    color: #000000;   
    width: 100%;   
}

#bloc_recherche p {
    /*padding: 0 0 0.75em 0.5em !important;
	padding: 0 0 0.35em 0.5em;*/
	padding: 0 0 0.35em 0;
	clear: both;
}

#champ_recherche{
	display: block;
	float: left;
    padding: 5px;
    font-weight: bold;
    color: #000000;
	width: 50%;
	text-align: right; /* n'hésitez pas pas à aligner à gauche, c'est pas mal aussi */
	margin: 0 1em 0 0;
}


#bt_rechercher {
    background-color : #484848;
    color: #ffffff; 
    border: 0px;
    padding: 2px 3px 2px 3px;
    cursor: pointer;
    width:  50px !important; 
}

/* Recherche */

#form_recherche{
    width: 600px;
    margin-right: auto;
    margin-left: auto;
    padding: 10px 0px 0px 0px;
}

#form_recherche p input.text{
    width: 344px;
	margin-right: 0.25em;	
}

#form_recherche p textarea{
    width: 560px;
	margin-right: 0.25em;	
}

#form_recherche p {
    padding: 0 0 0.75em 0.5em !important;
	padding: 0 0 0.35em 0.5em;
	clear: both;
}

#bouton_recherche{
    text-align: center;
}

a.lien_recherche{
    color: #083172;
    text-decoration: none;    
}

a.lien_recherche:hover{
    text-decoration: underline;
}

/* Page */
#global_entete{
	height: 100px;
	width: 994px;
	overflow: hidden; /* -> 2 */
	margin-left: auto;
	margin-right: auto; /* -> 3 */
}

#global_contenu_accueil{
	height: 525px;
    width: 994px;
	overflow: hidden; /* -> 2 */
	margin-left: auto;
	margin-right: auto; /* -> 3 */
}

#global_contenu{
	width: 994px;
	overflow: hidden; /* -> 2 */
	margin-left: auto;
	margin-right: auto; /* -> 3 */
}

#global_pied{
    height: 190px;
    width: 994px;
	overflow: hidden; /* -> 2 */
	margin-left: auto;
	margin-right: auto; /* -> 3 */
}

/* Navigation */
#petit_poucet{
    margin: 0px 0px 15px 0px;
}

#petit_poucet_accueil{
    padding: 0px 25px 0px 0px;    
}

a.lien_poucet{
    color: #000000;
    text-decoration: none;
}

a.lien_poucet:hover{
    text-decoration: underline;
}

/* Contenu principal */
#contenu_accueil{
	padding: 0px;
    margin:  0px;
}

#contenu{
    color: #000000;
    margin: 0px;
 	padding: 0px;
}

/* Index */
#animation{
	padding: 0;
	margin: 0;
	position: relative;
    height: 361px;
}

#slides {
    position:absolute;
    height:361px;
    width:761px;
    z-index: 10;
    border-left: 1px solid #707070;
    border-right: 1px solid #707070;
}

#slides .next,#slides .prev {
	position:absolute;
	top:0px;
	left:0px;
	width:30px;
	height:259px;
	display:block;
	z-index:101;
}

.slides_container {
	width:761px;
	height:361px;
	overflow:hidden;
	position:relative;
    
}

#slides .next {
	left:733px;
}

.slide{
   height:361px;  
   width:758px;
}

.caption {
	position:absolute;
	height:70px;
	padding:0px 10px 0px 10px;
	background:url(/site-particulier/images/fond_slide.png) top left repeat-x;
	width:743px;
	text-shadow:none;
}

.caption p{
    font-family : Arial, Helvetica, sans-serif;	
    margin:  5px 0px 0px 0px;
    font-size: 16px;
	color: #fff;
}

.caption p a{
    font-family : Arial, Helvetica, sans-serif;	
    font-size: 16px;
	color: #fff;
    text-decoration: none;
}

.caption p a:hover{
    text-decoration: underline;
}

#titre_accroche{
    position: absolute;
    margin:  75px 0px 0px 260px;  
    color: #ffffff;
    font-size: 20px;
    font-weight: normal;
}

#possibilites{
    margin: 12px 0px 0px 0px;
    padding: 0px;   
    list-style: none;
}

.premieres_possibilites{
    background: url(/site-particulier/images/fond_blocs_accueil.png) bottom left no-repeat;
    width: 121px;
    height: 81px;
    display: inline-block;
    margin: 0px 7px 0px 0px;  
    padding: 0px;
}

.premieres_possibilites:hover{
    background: url(/site-particulier/images/fond_blocs_accueil_over.png) top left no-repeat;
}

.derniere_possibilite{
    background: url(/site-particulier/images/fond_blocs_accueil.png) top left no-repeat;
    width: 121px;
    height: 81px;
    display: inline-block;
    margin: 0px;  
    padding: 0px; 
    
}

.derniere_possibilite:hover{
    background: url(/site-particulier/images/fond_blocs_accueil_over.png) top left no-repeat;
}

a.position_possibilite{
    display: table-cell;
    color: #464646;
    font-size: 14px;
    text-align:center;
    padding: 20px 5px 0px 5px;
    margin: 0px;
    height:61px;
    width: 111px; 
    text-decoration: none;  
    line-height: 13px;
}

a.position_possibilite:hover{
    text-decoration: underline;
}

#barre{
    margin: 7px 0px 0px 0px;
    width: 763px;
    height: 33px;
    background: url(/site-particulier/images/fond_barre.png) top left no-repeat;
}

#barre:hover{
    background: url(/site-particulier/images/fond_barre_over.png) top left no-repeat;
}

#barre p a{
    color: #464646;
    font-size: 14px;
    display: block;
    padding: 7px 0px 0px 0px;
    width: 763px;
    text-align: center;   
    text-decoration: none;  
}

#barre p a:hover{
    text-decoration: underline;
}

/* Contenu */
#colonne_gauche{
    margin: 6px 0px 0px 0px;
    width: 231px;
    position: absolute;
}

#atouts{
    width: 222px;
    height: 361px;
    background: url(/site-particulier/images/fond_bloc_gauche.gif) top left no-repeat;    
}

#bloc_contact{
    margin: 12px 0px 0px 0px;
    width: 222px;
    height: 121px;     
}

#colonne_droite_accueil{
    margin: 6px 0px 0px 231px;
    padding: 0px;
    float: left;
    width: 763px;
}

#colonne_droite{
    position: relative;
	margin: 6px 0px 10px 231px;
    padding: 3px 20px 0px 20px;
    float: left;
    width: 721px;
    min-height: 489px;
    background: #ffffff url(/site-particulier/images/fond_contenu_haut.png) top left no-repeat;
    border:  1px solid #707070;
    behavior: url(/site-particulier/PIE.htc);
    -moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	border-radius: 10px 10px 10px 10px;  
}

#fond_arbo{
    position: relative;
    margin: 0px 0px 0px -20px;
    padding: 30px 0px 0px 0px;
    width: 761px;
    min-height: 63px;
    background: #c4c4c4 url(/site-particulier/images/fond_arbo.png) top left repeat-x;   
    behavior: url(/site-particulier/PIE.htc);
    -moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;     
}

#fond_arbo2{
    position: relative;
    /*position: absolute;
    bottom: 0px;*/
    margin: 0px 0px 0px -20px;
    padding: 30px 0px 0px 0px;
    width: 761px;
    min-height: 63px;
    background: #c4c4c4 url(/site-particulier/images/fond_arbo.png) top left repeat-x;   
    behavior: url(/site-particulier/PIE.htc);
    -moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;      
}

#fieldset{
    border: 0px;
    margin: 0px 0px 0px 30px;  
    padding: 0px 0px 10px 0px;
}

#plan_rubrique{
    position: absolute;
    background: #cacac8 url(/site-particulier/images/fond_legend.png) top left repeat-x;    
    height: 22px;
    margin: -29px 0px 0px 0px;
    padding: 3px 10px 0px 10px;
    border-bottom:  1px solid #818181;
    border-left:  1px solid #818181;
    border-right:  1px solid #818181;
    behavior: url(/site-particulier/PIE.htc);
    -moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;
    font-weight: bold;
}

a.lien_arbo{
   text-decoration: none;
}

a.lien_arbo:hover{
   text-decoration: underline;    
}

.titre_type_menuiserie{
	margin: 0px;
	padding: 0px;
	font-size: 19px;
}

/* Contact */
#form_contact{
    width: 600px;
    margin-right: auto;
    margin-left: auto;
    padding: 10px 0px 0px 0px;
}

.form_contact_titre{
    display: block;
    color: #7a7979;
    font-size: 16px;
    font-weight: bold;
    /*background: url(/site-particulier/images/fond_sous_titre_arcticle.gif) bottom left no-repeat;*/
    margin: 0px 0px 10px 0px;
    padding:0px;
}

#contact_infos{
    margin: 0px;
    padding: 0px 0px 5px 0px;
    font-size: 12px;
    color: #000000;
}

#warning{
    font-size: 11px;
    color: #ff0000;
}

#champ{
    display: block;
    float: left;
    padding: 5px;
    font-weight: bold;
    color: #ffffff;
    width: 270px;
    text-align: right; /* n'hésitez pas pas à aligner à gauche, c'est pas mal aussi */
    margin: 0 1em 0 0;
    background-color: #043c70;
}

#champ_message{
    display: inline;
    padding: 5px;
    margin-right: 5px;
    float: left;
    width: 556px;
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    background-color: #043c70;
}

.radiocheck {
	margin: 0 1em 0 0.25em;	
}

#form_contact p input.text{
    width: 344px;
	margin-right: 0.25em;	
}

#form_contact p textarea{
    width: 560px;
	margin-right: 0.25em;	
}

#form_contact p {
    padding: 0 0 0.75em 0.5em !important;
	padding: 0 0 0.35em 0.5em;
	clear: both;
}



#bouton_contact{
    text-align: center;
}

#bt_envoyer {
    background-color : #484848;
    color: #ffffff; 
    border: 0px;
    padding: 3px;
    cursor: pointer;
    width:  100px !important; 
}

#galerie_fond{
    margin:  10px 0px 0px 0px;
    
}

/* FAQ */
.theme{
	font-family : Arial, Helvetica, sans-serif;	
	font-size : 14px;
	font-weight : bold;
	color : #3f3f3f;
}

.faq_question{
	font-size : 12px;
	font-weight : bold;
	color : #063071;
}

/* Pied de page */
#pied{
	margin: 0px;
    padding: 18px 0px 0px 236px;
    color: #ffffff;
    font-size: 11px;
}

#pied img{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
}

a.lien_menu_footer{
    color: #ffffff;
    text-decoration: none;
}

a.lien_menu_footer:hover{
    text-decoration: underline;
}





/* --- NOTES ---

1.	Pour pouvoir utiliser une hauteur (height) ou une hauteur minimale
	(min-height) sur un bloc, il faut que sont parent direct ait lui-même une
	hauteur déterminée (donc toute valeur de height sauf "auto": hauteur en
	pixels, em, autres unités...).
	Si la hauteur du parent est en pourcentage, elle se réfère alors à la
	hauteur du «grand-père», et ainsi de suite.
	Ainsi, pour pouvoir utiliser un "min-height: 100%" sur div#contenu, il nous
	faut:
	- un parent (body) en "height: 100%";
	- le parent de body également en "height: 100%".

2.	Il faut éviter que les marges des enfants de div#global ne se transmettent
	à leur parent. Notamment, le margin-top du premier enfant (ici, div#entete),
	et le margin-bottom du dernier enfant (ici, div#pied).
	On évite ce problème grâce à la propriété CSS overflow, qui bloque la
	fusion des marges. En savoir plus sur la fusion des marges:
	http://web.covertprestige.info/test
		04-blocs-imbriques-et-fusion-des-marges.html

3.	Les marges automatiques à gauche et à droite permettent de centrer notre
	bloc div#global, et donc tout le site.
	Pour aligner div#global à gauche, on fera:
		margin-left: 0;
		margin-rigth: auto;
	Pour aligner div#global à droite, on fera:
		margin-left: auto;
		margin-right: 0;
	Pour aligner div#global à droite avec un retrait (à droite) de 100px:
		margin-left: auto;
		margin-right: 100px;

*/
