a {
    color:#234;
    /* #869FF0; */
    /* #5A638D; */
   /* #869FF0; */
    /* #234; */
    font-size: 14pt; font-family:Rancho; text-decoration:underline; background-color: transparent}
a:hover { color: #456; font-size: 14pt; font-family:Rancho; text-decoration:underline; background-color: transparent}

/* ======================================================================================================================== */
/* ==========================================              body                   ========================================= */
/* ======================================================================================================================== */

body { 
/* background-color:#E0E0E0; */
font-weight:Regular;
font-family:"Josefin Sans", "sans-serif" ;
font-size:11pt;
 width:980;
 background-image:url("../Images/Fonds/fondBeige.jpg")
 }

/* =================================================================================================== */
/* ==================================== Pour les diaporamas ========================================== */

.legende2 {
    font-size: 14pt;
    font-family: Pompiere;
    text-align: justify;
    margin-top: 0pt;
    margin-bottom:5px;
    margin-right:10
    margin-left:10
    /* font-weight: bold; */
}

.legende2 {
    text-align: center;
    background-color:rgba(255, 255, 255, 0.7);
    width:560px;
    background-position: 0 -2cm
}

.superposeCerise {
    position:absolute;
    top:400px;
    left:220px;
    z-index:2;
}

.superposeLesGenets {
    position:absolute;
    top:400px;
    left:220px;
    z-index:2;
}
.superposeMenthe {
    position:absolute;
    top:400px;
    left:220px;
    z-index:2;
}

.bandeRouge
{
    top:100px;
    left:20px;
    width: 950px;
    height: 300px;
    background: #7D061A;
}

.bandeJaune
{
    top:100px;
    left:20px;
    width: 950px;
    height: 300px;
    background: #FBC636;
}
.bandeVerte
{
    top:100px;
    left:20px;
    width: 950px;
    height: 300px;
    background: #4B8350;
}

/* https://www.creativejuiz.fr/blog/tutoriels/ombre-avancees-avec-css3-et-box-shadow */
.bloc {
    position: relative; 
    display: inline-block;
    vertical-align: top;
    margin: 15px 15px;
    margin-bottom:0px;
    padding: 20px;
    width: 700px;
    height: 400px;
    background: #f0e8d8;
    font-size: 1.6em;
    line-height: 5em;
    font-family: Georgia, Times, Serif;
    text-align: center;
    background-image: linear-gradient(to bottom, #dacdb1 11%, #f0e8d8 56%);
    box-shadow: 0 0 65px #cdbe9f inset, 0 0 20px #beae8c inset;
    z-index:1;
}



/*
 .bloc:after, .bloc:before {
 content: " ";
 position: absolute;
 width: 50%;
 height: 20px;
 z-index: -10;
 }
 
 .bloc:before { background: green;
 width: 80%;
 }
 .bloc:after { background: red; }


.curve {}

.curve:before {
    top: 52px;
    left: 5px;
    
    transform: rotate(-5deg);
    box-shadow: 7px 6px 15px #333;
}
.curve:after {
    top: 52px;
    right: 5px;
    
    transform: rotate(5deg);
    box-shadow: -7px 6px 15px #333;
}
*/
.simple {
    box-shadow: 0 0 65px #cdbe9f inset, 0 0 20px #beae8c inset, 0 0 10px #816f47;
}

 .simple:after { display: none; }
 .simple:before
 {
 display: none;
 }

/* =================================================================================================== */
.VideFin
{
height:500px;
}

.Vide
{
height:60px;
}


.MenuGauche
{
width:180px;
float:left;
background:#678;
}

.ListeMenuGauche
{

}

.Corps
{
width:950px;
background:#567;
border:3px solid #345;
float:left;
}


.menuImage {
    background-color:#6677A4;
    # 6677A4; # violet clair
    # 5B6990; violet fonce
    # 4189C2; bleu OK
    # 4189C3;
    # 3D7FBF;
    #    448B6C; vert 2 OK
# 7DAFAE; vert clair
margin-left: 5px;
margin-top: 5px;
margin-bottom: 0px;
margin-right: 5px;
padding:5px 5px 5px 5px;
font-size: 10pt;
box-shadow:3px 3px 3px black;
}

.ImageHtml, .Bouton, .Drapeau {
margin-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
margin-right: 5px;
border:0px;
box-shadow:3px 3px 3px black;
}

.Drapeau {
margin-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
margin-right: 5px;
border:0px;
position: fixed;
top: 7px; left: 920px;
height:30px;
width:50;
/* visibility:hidden; */
}

.Cadre, .CadreLavande, .CadreLesGenets, .CadreBrimbelle, .CadreChocolat,
.CadreCerise, .CadreMenthe
{
background-color: grey;
margin-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
margin-right: 5px;
box-shadow:7px 5px 5px black;
font-size: 14pt;
font-family: Pompiere;
text-align: justify;
padding:5px;
}

.CadreLavande
{
    background-color: #6677A4;
}
.CadreLesGenets
{
    background-color: #DBA527;
    /* #B88B21; */
    /* #DBA527; */
    /* #FBC636; */
}
.CadreMenthe
{
    background-color: #386E11;
    /* #59A64F; */
/*    #5FA61F; */
}
.CadreCerise
{
    background-color: #D40022;
    /* #A11416; */
}
.CadreChocolat
{
    background-color: #563F36;
}
.CadreBrimbelle
{
    background-color: #334676;
}
.CadreViolette
{
    background-color: #65457F;
}

.cadreBleu
{
width:1000px;
background:#67c;
border:3px solid #345;
margin-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
margin-right: 5px;
text-align: center;
}

.Ligne, .ligneTransp, .LigneMenu, .LigneLavande, .LigneMenthe, .LigneCerise, .LigneLesGenets, .LigneBrimbelle
{
margin-bottom: 5px;
margin-left: 3%;
margin-right: 2%;
margin-top: 5px;
width:970px;
float:left;
#background:#97BCBF;
#border:3px solid #466A6A;
clear:both;
#box-shadow:7px 5px 5px black;
#border: 5px outset #466A6A
}

.LigneLavande
{
    width:900px;
    background:#6677A4;
    box-shadow:7px 5px 5px black;
    border: 5px outset #6677A4
}

.LigneMenthe
{
    width:900px;
    background:#57985D;
    box-shadow:7px 5px 5px black;
    border: 5px outset #57985D
}

.LigneLesGenets
{
    width:900px;
    background:#FBC636;
    box-shadow:7px 5px 5px black;
    border: 5px outset #FFCF3F
}

.LigneCerise
{
    width:900px;
    background:#FF8888;
    box-shadow:7px 5px 5px black;
    border: 5px outset #DD6666
}

.ligneMenu
{
    # background:#6BA09E;
    # border: 2px outset #466A6A
}

.ligneTransp
{
background:none;
border:0px;
/* background:yellow; */
width:100%;
box-shadow:0px 0px 0px black;
}

.IvParam {
background:#678;
}

.Colonne
{

}

.Tableau
{
text-align: center; 
}

.LigneTableau
{
vertical-align:middle;
}

# 97BCBF vert clair

.ElemTableau
{
# border:2px solid #345;
padding:1px;
margin:1px;

}

.IvMois
{
	
}

.IvMoisTexte
{
	font-size: 7pt;
}

.IvMoisImageLibre
{
background-color:white;
width:15px;	
height:10px;
margin:2px;
}
.IvMoisImageOccupe
{
	background-color:red;
	width:15px;	
height:10px;
margin:2px;
}


/*   vertical-align
- numérique positive ou négative suivie de px ou % ou ex ou em. Le point de départ sera baseline pour les valeurs fixes et pour les pourcentages dépend de line-height. 
- baseline, lignes de bases alignées, valeur par défaut. 
- sub, ligne de base de l'enfant aligné un peu plus bas que la ligne de base de son parent. 
- super, ligne de base de l'enfant aligné un peu plus bas que la partie la plus haute des caractères de son parent. 
- text-top, alignement sur les parties les plus hautes. 
- text-bottom, alignement sur les parties les plus basses. 
- middle, alignement par le milieu vertical. 
- top, le haut de l'enfant est aligné sur la partie la plus haute de la ligne. 
- bottom, le bas de l'enfant est aligné sur la partie la plus basse de la ligne (sauf ie). 
- inherit, hérite de la propriété de son parent (css 2)

*/

.Icone
{
    margin-bottom: 1px;
    margin-left: 1px;
    margin-right: 1px;
    margin-top: 5px;
    color:black;
    padding:10px 0px 0px 0px;
}

.Img, .ImgCentre, .ImgCentreCerise, .ImgCentreLesGenets, .ImgCentreMenthe
{
margin-bottom: 5px;
margin-left: 5px;
margin-right: 5px;
margin-top: 5px;
/* pour la legende */
font-size: 13pt;
font-family: Pompiere; 
text-align: justify; 
 
/* font-weight: bold; */
color:black;
padding:5px 5px 5px 5px;
}

.TexteBarreMenu
{
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
    font-size: 14pt;
    font-family: Pompiere;
    text-align: justify;
    
    /* font-weight: bold; */
    color:black;
    padding:5px 5px 5px 5px;
}

.ImgCentre, .ImgCentreCerise, .ImgCentreLesGenets, .ImgCentreMenthe
{
text-align: center;
margin-left: 2.5%;
box-shadow:7px 5px 5px black;
border: 5px outset #6677A4
}

.ImgCentreCerise
{
    border: 5px outset #7D061A;
}
.ImgCentreMenthe
{
    border: 5px outset #4B8350;
}
.ImgCentreLesGenets
{
    border: 5px outset #FBC636;
}

.nomImg {
color: black; 
font-size: 8pt; 
font-family: Helvetica;  
margin-right:0pt; 
font-weight: normal;
z-index:2;
}


.Sep {
width:99%;
clear:both;
margin-left:1%;
height:5px;
}

.Txt, .TxtCentre, .Parag, .paragReserver, TxtRougeClignottant {
font-size: 14pt;
font-family: Pompiere; 
text-align: justify; 
margin-top: 0pt; 
margin-right:10
margin-left:10
/* font-weight: bold; */
}

.TxtRougeClignottant
{
text-decoration:blink;
color:red;
}

.Parag {
    margin-right:50
    margin-left:50
    padding:50px 50px 50px 50px;
}

.paragReserver { 
text-align: center; 
}

.TxtCentre { 
text-align: center;  
}

.titre, .ImgTitre { 
color: black; 
font-weight: bold; 
font-size: 24pt;
font-family: Pompiere;
margin-bottom: 3pt; 
margin-top: 5pt; 
margin-right:5;
margin-left:5;
text-align: center; 

# background-color:#97BCBF;
padding:5px 5px 5px 5px;
}

.ImgTitre {
margin-left: 15px;
margin-top: 15px;
margin-bottom: 15px;
margin-right: 15px;
}

.Liste, .listePresentation, .listePuceBleue, .listePuceLigneEntiere {
list-style-type:none;
list-style-image: url("../Images/Boutons/puce1.gif");
}

.listePresentation {
width:45%;
}

.listePuceBleue {
    list-style-image: url("../Images/Boutons/puceBleue.gif");
    width:45%;
}
.listePuceLigneEntiere {
    list-style-image: url("../Images/Boutons/puceBleue.gif");
    width:90%;
}


.ElementListe
{
    font-size: 14pt;
    font-family: Pompiere;
}

.BoutonPere, .BoutonHaut, .BoutonPrecedent, .BoutonSuivant, .BoutonHome
{
height:30px;
width:30px;
backgroung:yellow;
}
.BoutonPere
{
 background-image:url("../Images/Boutons/boutonPere.png");
 //border:0px;
 }
 .BoutonPrecedent
{
 background-image:url("../Images/Boutons/boutonPrecedent.png");
  //border:0px;
 }
 .BoutonSuivant
{
 background-image:url("../Images/Boutons/boutonSuivant.png");
  //border:0px;
 }
 .BoutonHaut
{
 background-image:url("../Images/Boutons/boutonHaut.png");
  //border:0px;
 }
  .BoutonHome
{
 background-image:url("../Images/Boutons/boutonHome.gif");
  //border:0px;
 }

.FrameMenuHaut
{
position: fixed;
top: 0px; left: 8px;
height: 68px;
width:900px;
/* visibility:hidden; */
}

.MenuGauche
{
width:950px;
height:50px;
background:#67c;
position: fixed; 
top: 8px; left: 16px;

border:3px solid #345;
z-index:1;

/* pour IE */
// position: absolute;
// top: expression(body.scrollTop + 8 + "px");
// width:800px;
}

.ListeMenuGauche li
{
display:inline;
/* background:yellow; */
margin-left:0px;
padding-left:0px;

}


/* ======================================================================================================================== */