:root {
  --Fond-page:#dad9d6;
  /* #c8d2d4 */
  --Fond-tout:transparent;
  --Fond-article:#e4e3da;
  --Fond-titre:#046380;
  --Fond-menu:#046380;
  --Fond-menu-select:#E6E2AF;
  --Bordure:#002F2F;
  --Texte-page:#046380;
  --Texte-article:#046380;
  --Texte-titre:#EFECCA;
  --Texte-menu:#EFECCA;
  --Texte-menu-select:#046380;
  --Texte-lien:#CE5C00;
  --Texte-couleur:#ff6600;
  --Fond-lien:#f7d9d4;
  --Ombre:#002F2F;

}
Body {
  margin-top: 3px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1060px;
  background: var(--Fond-page);
  font-size: 10pt;
  
/* background-image: url(Images/Ciel_bleu.jpg);
background-position: center center;
background-attachment: fixed; */
/* background-repeat: no-repeat; */

 /* color: var(--Texte-page) ;*/
}
ul {
margin-top: 10px;
padding-left: 50px;
}
/* _____________Positionement de la page */
#tout {
  width: 100%;
  margin-top: 15px;
  background-color: var(--Fond-tout);
}
.bloc {
  margin-top: 20px;
  margin-left: 50px;
  margin-right: auto;
  width: 98%;
  max-width: 1000px;
}
#entete, #central, #bas {
  margin-top: 30px;
  margin-left: 30px;
  margin-right: auto;
  width: 94%;
  max-width: 1000px;
  background-color: var(--Fond-tout);
}
.bande_titre {
  margin-left: -30px;
  width: 94%;
  max-width: 1000px;
  padding-left: 20px;
  margin-top: 0px;
  position: relative;
  z-index: 5000; 
  background-color: var(--Fond-titre);
  color: var(--Texte-titre);
  border-radius: 10px;
}
.bande_titre, .pave img, .baniere, #article, #PST, 
.encart {   
  -moz-box-shadow: 8px 8px 12px var(--Ombre); 
  -webkit-box-shadow: 8px 8px 12px var(--Ombre);
  box-shadow: 8px 8px 12px #555;
}
#article, #cadre_Blocs {
  width: 94%;
  max-width: 1000px;
  margin-top: 5px;
  position: relative;
  padding: 5px;
  font-size: 1.1em;
  color:var(--Texte-article);
}
#article {
  background-color: var(--Fond-article);
}
aaa {
  padding-left: 5px;
  margin-left: 300px;
}
#cadre_blocs {
  background-color: transparent;
}
.droite {
  position: absolute;
  width: 20%;
  max-width: 300px;
  margin-top: 20px;
  margin-left: 5%;
  background-color: var(--Fond-titre);
  color: var(--Bordure) ;
  
}
/* _____________Partie fixe menu */
#fixe {
  position: fixed;
  margin-left: 3px;
  margin-top: -13px;

  z-index: 1000; 
  text-align: center;
  background-color: var(--Fond-menu);

}
/*_______________Entete Remonter Bas de page*/
#entete {
  margin-top: 0px;
  text-align: center;
}
#remonter{
  display:block;
  height:0px;
  width:48px;
  background-color: var(--Fond-tout);
  margin-left:auto;
  margin-right:1px;
  position: -webkit-sticky;
  position: sticky;
  top: 80%;	
  z-index: 5000;
  background-image:url(Images/Top-48px.png);

}
#remonter a {
  background-color: var(--Fond-tout);
}
#remonter img:hover {
  background-color: var(--Texte-lien);
  border: 3px dotted;
}

#bas {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
  margin-top: 20pt;
  width: 94%;
  background-color: var(--Fond-menu);
  font-size: 1em;	
  z-index: 3000;
  
}
#bas table{
  width: 100%;
  vertical-align: center;
  width: 98%;
}
#entete #baniere img {
  margin-top: 35px;
  width:86%;
}
.baniere{
  Max-width: 900px;
  /*align: center;*/
}
#PST {
  position: absolute;
  margin-top: 30px;
  margin-left: 30px;
  float: left;
  height: 100px; width: 100px;
  background-color: transparent;
  background-image: url(Images/Logo_conteur_FVermel3.gif);
  background-position:  center center;
  background-repeat: no-repeat;

}
#centrer {
  height: 30px;
  margin: 50 auto;
  /*  width: 450px;*/
  background-color: transparent;
}
/*_______________Partie centrale*/
#central {
  background-color: var(--Fond-article);
}

#titre {
  font-size: 1.50em;
  background-color: var(--Fond-titre);
  height:30px;  
  z-index: 900;
}
.pave {
  display: inline-block;
  z-index: 500;
  width: 180px;
  min-height: 250px;
  text-align: center;
  border-style: none;
  margin: 10px;
  position: relative;
  background-color: transparent;
}
.pave img {
  margin: 0px;
  width: 180px;
  Height: 250px;
  border-style: solid;
  border-color: var(--Fond-titre);
}
.pave img:hover {
  margin-left: -40px;
  width: 270px;
  Height: 375px;
}
.pave:hover { 
  z-index: 600;
}

.gauche {
  float: left;
}
.centre {
  z-index: 5;
}
.droit {
  float: right;
  position: relative;
  margin-top: -25px;
}
#popup {
  position: relative;
  visibility: hidden;
  z-index: 5000;
  background-color:  var(--Fond-titre);
  width: 300px;
  Height: 400px;
  margin-top: 5px;
  margin-left: 5px;
  
}
#pave:hover #popup {
  visibility: visible;
}
.decale {
  margin-left: 150px;
}
/*__________________________Formatage du menu*/
#menu {
  height: 30px;
  width: 100%;
}
#menu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: left;
  background-color: var(--Fond-menu);
}
#menu li {
  margin: auto;
  padding: 5px;
  float: left;
  background-color: var(--Fond-menu);
}
#menu li a {
  padding: 5px;
  text-decoration: none;
  display: block;
  color:   var(--Texte-menu);
  background-color: var(--Fond-menu);
}
#menu li a:hover {
  color: var(--Texte-menu-select);
  background-color: var(--Fond-menu-select);
}
#menu ul li ul {
  display: none;
}
#menu ul li:hover ul {
  display: block;
}
#menu li:hover ul li {
  float: none;
  border-bottom: 1px solid var(--Fond-menu-select);

  }
#menu li ul {
  position: absolute;
}
/* __________________________Liens */
a, a:visited, a:active {
  color:var(--Texte-lien);
}
a:hover {
  color:var(--Fond-lien);
  background-color: var(--Texte-lien);
}
/* __________________________Styles de texte */
p {
  padding-left: 100px;
  margin-top: 3px;
  margin-bottom: 12px;
}
h1 {
  font-size: 1.5em;
  margin-top: 0px;
  margin-bottom: 0px;
  
}
h2 {
  font-size: 1.3em;
  padding-left: 25px;
  margin-top: 10px;
  margin-bottom: 0px;
}
h3 {
  font-size: 1.2em;
  padding-left: 40px;
  margin-top: 0px;
  margin-bottom: 0px;
}
h4 {
  font-size: 1em;
  padding-left: 50px;
  margin-top: 0px;
  margin-bottom: 0px;
}
h5 {
  font-size: 1em;
  padding-left: 100px;
  margin-top: 0px;
  margin-bottom: 0px;
}
h6 {
  font-size: 1em;
  padding-left: 100px;
  margin-top: 0px;
  margin-bottom: 0px;
}
/* _________Styles Agenda */
.rendezvous {  
}
.rendezvous h2 {  
  margin-left: -30px;
  width: 94%;
  max-width: 900px;
  padding-left: 20px;
  margin-top: 15px;
  position: relative;
  z-index: 500; 
  background-color: var(--Fond-titre);
  
  color: var(--Texte-titre);
  border-radius: 10px;

    
  -moz-box-shadow: 8px 8px 12px var(--Ombre); 
  -webkit-box-shadow: 8px 8px 12px var(--Ombre);
  box-shadow: 8px 8px 12px #555;
}
.ville {
  margin-top: 10px;
}
.titre {  
  font-size: 1.3em; 
  text-decoration-line: underline;
}
.type { 
}
#agenda { 
}
.auteur {  
}
.plusdinfos {  
  font-size: 1em;
}
.encart {
  border: 2px solid var(--Texte-couleur);
  align : center;
  max-width: 80%;
  padding: 10px;
  background-color: var(--Fond-page);
  background-color: var(--Fond-titre);
  color: var(--Texte-titre);
  margin-left: 50px;
  }