body{font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 16px;background: sienna;color:black;}

/*ci-dessous copié depuis lafranceestbelle_css 
.haut1 {position: absolute ; left:0px;top:0px; width:100%; height:70px; background-color:thistle; margin:0;text-align:center; }
.haut3 {position: absolute ; right:60px; height:80px;background-color:thistle;margin:0;text-align:left;}
h1 {font-size:40px;font-style:normal;color:darkred;margin-top:0px; padding-top: 10px;}
h3 {font-size:12px; color: white ; margin-top:40px;} */

/*annonces {width:1600px;}*/

.haut1 {	margin: 0px; left: 0px; top: -10px; width: 100%; height: 86px; padding-left: 430px;/*text-align: center;*/ line-height: 17px; position: absolute; opacity: 1; background-color: thistle;}
h1 {	color: darkred; padding-left: 60px; font-size: 27px; margin-top: -15px;}
.haut3 {	top: -12px; height: 20px; text-align: left; right: 148px; position: absolute; opacity: 1; background-color: thistle;  }
h2 { color: black; font-size: 15px; margin-top:  0px;}
h3 { color: black; font-size: 12px; margin-top: 3px;}
h4 {position: absolute; width:560px; height:70px; top: 0px; bottom: 10px ; left:20.8%; right:35%; padding: 10px 5px 10px 5px ; }
h5 {font-family: sans-serif; font-style:12px;}
h6 {color: black; font-size: 1.1em; margin-top:  0px;}
h7 {color: red; font-size: 18px; }

d7{font-size:15px;}
d8{color: maroon; font-size: 15px;/* margin: auto;*/ margin-top: 0px; }
b8{color: blue; font-size:12px; }
b9 {color: Maroon; font-size: 15px; text-align: center; padding-left: -3px;}
c8 {padding-left: 15px;margin-left:10px;} 
c9 {color: Maroon; font-size: 15px; text-align: center; padding-left: -3px;}
div h5 {padding: 30px 0 0 130px ; }
/*
.haut1 {position: absolute ; left:0px; width:100%; height:70px;top:0px;line-height:17px; background-color:thistle;opacity:1; margin:0;text-align:center;}
h1 {font-size:27px;color:darkred; margin-top:-15px;}


.haut3 {position: absolute ; right:190px; height:30px;background-color:thistle;margin:0;text-align:left;}
h3 {font-size:12px; color: white ; margin-top:10px;}


*/



/*.haut1 {position: absolute ; left:0px; width:100%; height:70px;top:0px;line-height:17px; background-color:thistle;opacity:1; margin:0;text-align:center;}
h1 {font-size:27px;color:darkred; margin-top:-15px;}
/*annonces {width:1600px;}*/

/*.haut3 {position: absolute ; right:190px; height:30px;background-color:thistle;margin:0;text-align:left;}
h3 {font-size:12px; color: white ; margin-top:10px;}
*/

/*.annonces{position: absolute; margin:0; margin-left:14px; width:110%;top:50px;z-index:1;  height:30px; background:red;color: grey;}*/



div li {display: inline-block;margin-left:-2px; } 

    /*#{display: inline-block;} */   /*div ul {list-style-type: none;}*/

nav a {font-size: 1.3em; color: blue; padding-bottom: 3px; text-decoration: none;}
nav a:hover {color: pink; border-bottom: 3px solid green;}

div.gauche { position: absolute; width:26%; left:0px; top:80px;font-size:15px; background: sandybrown ; padding: 0 20px 0 10px; }
/*.centre {display: inline-block; position: absolute; width:45.4%; top:140px ; left:27.8%; right:25%; background: wheat;}
div. centr2  {display: inline-block; height: 30px; width:63% ;left:18.5%; right:15%; padding-left: 0px; -webkit-padding-start: 0px;}*/
/*div.contenu1{position: absolute; width:63%;  left:18.5%; right:15%; top:10720px; background: wheat;}*/
div.droit{position: absolute ; width:26%; right:0px; top:80px; font-size:15px; background: peru; padding: 0px 10px 0 10px;}
figure {display: inline-block; margin-left: 10px;margin-top:15px; position:center;}   
p.retrait1{padding-left:10px; font-size:14px;}
p.retrait2{padding-left:10px; font-size:12px;}
p.retrait3{padding-left:20px; font size:14px;}
.entree1{font-size:1.3em; text-align:center;}
.entree2{font-size:1.15em;}

/*.centre {display: inline-block; position: absolute; width:45.4%; top:140px ; left:27.8%; right:25%; background: wheat;} */
div.centre {display: inline-block;position:relative; width:45.4%; top:20px ; left:27.2%; right:26%; background: wheat;text-align: center;}
 /*div.contenu {position: absolute; width:45.4%; height:auto;left:27.8%; right:25%; top:0px; background: wheat;} */ 
div.contenua{position: float; width:96%; height:100px;left:27%; right:29%; top:10px; background: wheat;border:3px solid peru;padding:0px 8px 0 12px;}
div.contenub{position: float; width:96%; height:100px;left:29%; right:25%; top:20px; background: sandybrown;border:3px solid peru;padding:0px 10px 0 10px;}
/*div.contenu1{position: absolute; width:63%;  left:18.5%; right:15%; top:10720px; background: wheat;}*/

div.centre1{position:float; display:inline-block ; width:97%;height:auto; left:0px; margin-top:230px; background:wheat;text-align:center;}
#carrousel{position:relative;} /*height:200px; width:700px; margin:auto; }/*text-align:center;  } */
#carrousel ul li{position:absolute;  top: -15px; left:-6px; } 
/*----------------------
#carrousel{ position:relative; height:200px; width:700px; margin:auto; }
#carrousel ul li{ position:absolute; top:0; left:0; } 
-----------------------
*/
div.centre2{ position: absolute; height: auto; width:63% ; margin-top:20px;left:18.5%; right: 15px;padding-top:0px;
            background: wheat;text-align: center; -webkit-padding-start: 0px; border-radius: 15px 15px 15px 15px ;}

div.centre3{display: inline-block;position:relative; width:45.4%; margin-top:655px; padding-left:10px; padding-right:10px ; padding-top:10px ;
            left:27.8%; right:25%; background: wheat;text-align: center;}
div.centre4{ position: absolute; width:42% ; top:16px; font-size: 14px; left:13%; right: 300px;margin-left:auto; height: auto; /* overflow:scroll; */
            padding-left:30px; background: wheat;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px; /*text-decoration:none;*/}
/*le div.centre4 ci-dessus pour le fichier inscription-formulaire.php */
div.centre5{ position: absolute; width:42% ; top:16px; padding-top:9px; font-size: 14px; left:13%; right: 300px;margin-left:auto;margin-bottom:20px; 
            height: auto; border: 1px solid IndianRed; padding-left:30px;padding-right:30px;  background: wheat;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px;} 
div.centre5b{ position: absolute; width:42% ; top:16px; padding-top:9px; font-size: 14px; left:13%; right: 300px;margin-left:auto;padding-bottom:0px; 
            height: auto; /*overflow:scroll;*/ padding-left:30px;  background: wheat;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px;} 
div.centre6{ position: absolute; width:42% ; top:16px; font-size: 14px; left:13%; right: 300px;margin-left:auto; height: 770px; /* overflow:scroll; */ 
            padding-left:30px; background: #FFFFFF;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px;}
div.centre7{ position: absolute; width:46% ; top:16px; padding-top: 10px; font-size: 14px; left:13%; right: 300px;margin-left:auto; height: 194px; /* overflow:scroll; */
            padding-left:30px; padding-right: 20px; background: wheat;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px;}			
div.centre8{ position: absolute; width:45.95% ; top:220px; font-size: 14px; left:13%; right: 300px;margin-left:auto; max-height: 270px; overflow:auto; 
             padding-left:30px; padding-right: 20px; background: wheat;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px;}			
div.centre9{ position: absolute; width:46% ; top:456px; font-size: 14px; left:13%; right: 300px;margin-left:auto; height: 348px; /* overflow:auto; */
            padding-left:30px; padding-right: 20px; background: wheat;opacity:0.8; color: black; text-align: left; -webkit-padding-start: 0px;}	
.reflexions{width:440px; height:120px;}
/*relexions des visiteurs sur le fichier inscription-formulaire.php*/

/*div.centr2{ display: inline-block; height: 30px; width:95% ; padding-left: 0px; -webkit-padding-start: 0px;}*/


/*div.contenu2{position: absolute; height:0px; width:300%; left:0px; right:0%; min-width: 1200px; max-width: 4550px;top:11450px;color:white; background:gray;}*/
footer {display: inline-block; position:relative; top: 0px; height:30px; width:300%; margin-left:-360px;padding-left: 2500px; background:grey; color:white;-webkit-padding-start: 2500px; }
/*#footer {height: 30px; color: white ; width: 300%; background: gray ; padding-left: 2500px; -webkit-padding-start: 2500px;}*/

#commentaire2 { display: inline-block; text-align: left; } 
p1{top:0px; margin-bottom:10px;font-size:1em;}
p2{top:60px;margin-bottom:10px;font-size:0.9em;}

p3{font-size:30px;color:darkred;}
p4{position:float;top:40px; font-size: 14px; line-height:12px;}
/*div.bas{position: absolute ; left:0px; top:700px; width:100%; height:60px;text-align: center; background-color:rgb(0,220,153);} */



.taillepol { font-size: 0.9em ;} 

.taillepol1 { font-size: 0.8em ;}

.taillepol2 { font-size: 1em ; color: maroon ;}

.taillepol3 { font-size: 0.9em ; color: black; text-align: center ;}

.taillepol4 { font-size: 0.8em; color: navy; padding: 0px 15px 0px 15px; }
.taillepol5{ font-size:0.85em; color: black; text-align:center;}

.taillepol6{ font-size: 0.5em; color: green; padding-top: 20px;}
.taillepol7{ font-size: 1.1em; color: green;}
.taillepol8{ font-size: 1.2em; color: blue; text-decoration: underline;}
.taillepol9{ font-size: 1.2em; color: MediumOrchid; }  /* s'applique au fichier accueil_lafranceestbelle.php */
.taillepol10{font-size: 1em; color: DarkMagenta; }     /* s'applique au fichier accueil_lafranceestbelle.php */
.taillepol11{font-size:0.8em;}
/* ------------------------  Ci-dessous les taillepol9 et 10 de lafranceestbelle080515_1.css
.taillepol9{ font-size: 15px ; color : BlueViolet;}  /* taille et couleur pour "Cliquez pour le dernier vers..." 
.taillepol10{ font-size: 0.9em ; background:wheat; color: BlueViolet;}
--------------------------
*/
section { text-align: center ; margin: 0 auto; width: 500px;color:white;} 


#drapeau{margin:0 auto;}

#chateau_versailles1{display: block; margin-left:-6.5px; border: 3px solid peru ;  } 
#mona_lisa{display:block; margin-left: 90px; border:3px solid orange;}
#canotiers1 {display: block; margin: 0 auto ; border: 3px solid peru ; position:center ;} 
#canotiers2 {display: block; margin: 0 auto ; border: 3px solid peru ; position:center ;}
/*#chateau0 { display: block; margin: 0 auto ; border: 3px solid peru ; position:center } */
div.img1 { margin: 0 auto; border : 3px solid chocolate;padding-left: -5px;}               /* img pour les fleurs */
div.img2 { margin: 0 auto; border : 3px solid orange;}  /* img pour les oiseaux */
div.img3 { border : 3px solid peru ;}   /* img pour les châteaux */

 
#commentaire3 {display: inline-block; color: black ;display: block; margin: 0 auto ;	padding-right:10px; padding-left: 10px;font-size: 0.8em ;}   
#commentaire4 {display: inline-block; color: green ;display: block; margin: 0 auto ;	padding-right:10px; padding-left: 10px;font-size: 0.8em ;}  
.bleu {font-size:0.9em; color:blue;}
.blanc{font-size:0.9em; color:white;}
.rouge{font-size:0.9em; color:red; }
.espace{white-space:pre;}

/*div.boutoncroyance { font-size: 0.9em; color: pink; } */ /* ajouté le 03Avril2015 avec le javaScript et jQuery */
#bouton1 {display: inline-block; color: green ;display: block; margin: 0 auto ;	padding-right:10px; padding-left: 10px;font-size: 0.8em ;} 
div.bouton2{ margin: 0 auto; border : 3px solid orange;}
.highlight { font-weight: bold; font-style: italic;}

.switcher { float: right; background-color: #ddd; border: 1px solid #000; margin: 10px; padding: 10px; font-size: .9em;}
background {url("images/champ_lavande.jpg") fixed no-repeat; }   
/*div.contenuc{position: float; width:99%; height:100px;left:27.8%; right:25%; top:20px; background: sandybrown;border:3px solid peru ;}*/


/* Trouvé sur le site : www.frogweb.fr/menu-deroulant-horizontal, ci-dessous :  */


/* Ajouté ce a:hover le 26/01/15 pour colorer le fond au survol du curseur*/
/* Supprimé ce a:hover le 28/01/15 sans problème */


 
#menu-demo2{
border-left:1px solid orange;
border-right:1px solid orange;
border-top:1px solid thistle;

}

#menu-demo2, #menu-demo2 ul{
padding:0;
margin:0;
list-style:none;
font-size:0.9em; /*ajouté le 23/01/15*/
}

#menu-demo2 ul, li{
text-align:center; /*ajouté le 27/01/2015*/

}

#menu-demo2 li{
display:inline-block;
position:relative;
border-radius:8px 8px 0 0;

}

#menu-demo2 ul li{
display:inherit;   
border-radius:0;

}
#menu-demo2 ul li:hover{
border-radius:0;
}
#menu-demo2 ul li:last-child{
border-radius:0 0 8px 8px;
}

#menu-demo2 ul{
position:absolute;
max-height:0;

left: -0px;
right: 0;
border-left: 1px solid orange;
border-right: 1px solid orange;
border-bottom: 1px solid orange;

text-align:center; /*ajouté le 22/01/2015 pour centrer les textes*/

overflow:hidden;
-moz-transition: .8s all .3s;
-webkit-transition: .8s all .3s;
transition: .8s all .3s;
}

#menu-demo2 li:hover ul{
max-height:20em;   /* définit la hauteur des menus déroulants */

}
/* background des liens menus */
#menu-demo2 li:first-child{
background-color: ivory; /*#65537A;*/
background-image:-webkit-linear-gradient(top, white /*#65537A 0%, #2A2333*/ 100%);
background-image:linear-gradient(to bottom, white /*#65537A*/ 0%, white /*#2A2333*/ 100%); 
/*padding-left:4px;*/
}
#menu-demo2 li:nth-child(2){
background-color: ivory; /*#729EBF;*/       /* Titre "Infos" mis en rouge */
background-image: -webkit-linear-gradient(top, white /*#729EBF 0%, #333A40*/ 100%);
background-image:linear-gradient(to bottom, white /*#729EBF 0%, #333A40*/ 100%);
/*padding-left:4px;*/
}
#menu-demo2 li:nth-child(3){
background-color: ivory; /*#F6AD1A;*/     /* Titre "l'ecole au passe" mis en vert */
background-image:-webkit-linear-gradient(top, white /*#F6AD1A 0%, #9F391A*/ 100%);
background-image:linear-gradient(to bottom, white /*#F6AD1A 0%, #9F391A*/ 100%);
/*padding-left:4px;*/
}
#menu-demo2 li:nth-child(4){
background-color: ivory; /*#CFFF6A;*/      /* ajouté le 23/01/15 */
background-image:-webkit-linear-gradient(top, white /*#CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /*#CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(5){
background-color: ivory; /*#CFFF6A;*/      /* ajouté le 23/01/15 */
background-image:-webkit-linear-gradient(top, white /*#CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /*#CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(6){
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(7){
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(8){
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(9){
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(10){
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:nth-child(11){
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}

#menu-demo2 li:last-child{
background-color: ivory; /*#CFFF6A;*/
background-image:-webkit-linear-gradient(top, white /* #CFFF6A 0%, #677F35*/ 100%);
background-image:linear-gradient(to bottom, white /* #CFFF6A 0%, #677F35*/ 100%);
/*padding-left:4px;*/
}


/* background des liens sous menus */
#menu-demo2 li:first-child li{
background:white; /*red; pink; #2A2333;*/

}

#menu-demo2 li:last-child:hover, #menu-demo2 li:last-child li:hover{
background:white; /*#CFFF6A;*/
}
/* les a href */
#menu-demo2 a{        /* Pour l'espacmt entre les colonnes, voir ligne 23 à div:li à margin-left */
text-decoration:none;
display:block;
padding:6px 32px;    /*le 1er padding définit la hauteur des têtes des menus déroulants, 2è padding la largeur des déroulants */ 
color:black ; /*#fff;*/
font-family:arial;
}
#menu-demo2 ul a{
padding:8px 1px      /* le 1er padding définit l'espacement des lignes en hauteur dans les menus déroulants 
                        le 2èm padding définit la marge gauche à l'intérieur des menus déroulants */ 
}
#menu-demo2 li:hover li a{
color:black; /*#fff; */
/*text-transform:inherit;*/
}
#menu-demo2 li:hover a, #menu-demo2 li li:hover a{
color: chocolate; /*#000;*/
}
*/