
/* raz css ---------------------------------------------*/

* { margin :0; padding: 0; }
       
body { width: 100%; height: 100%; background-color: #005050; }

#MaPage {display: flex ; flex-flow: row wrap; justify-content: center; display: inline-block; }


.page { object-fit:cover; max-width:100%; Width: auto; padding: 10px ; text-align: center; display: inline-block; background-color: black; margin: 5px; border: 3px solid #ccc; }  

.page img {border: 0px solid #ccc; }



.pageGalerie {display: flex ; flex-flow: row wrap; text-align: center; justify-content: center; margin: 3px 5px; overflow: hidden; object-fit:cover; padding: 10px; background-color: black; border: 10px solid white; }  

.pageGalerie img { margin: 5px; border: 3px solid white; }



.figSeule { display: flex ; max-width:100%; justify-content: center; background-color: #005050; }

.imageSeuleSansBordure { border : 3px solid #005050; }

.imageSeuleAvecBordure  { border : 3px solid white; }



h1 { font-family: geogia; font-weight: bold; font-size:40px; color: orange; background-color: black; }


h3 { font-family: geogia; font-weight: bold; font-size:30px; color: orange; background-color: black; }

h4 { font-family: geogia; font-weight: bold; font-size:20px; color: white; background-color: black; }

a { font-family: geogia; font-weight: bold; font-size:20px; color: white; background-color: #005050; }

a:hover figcaption:hover { background-color: violet; } 

button { background-color: green; color: white;}


#aefface { color: #005050; background-color: #005050; padding: 0; border: none ; }

video { width:100%; background-color: #005050; }

figcaption { color : white; }


/* css menu--------------------------------------------*/  
 
    


body {
    font-family: "Trebuchet MS";
}



.menu {
    display: flex;                /* Transformation en flexbox */
    padding:0;                    /* Suppression des marges internes */
    background-color: #005050;       /* Ajout de la couleur d'arrière-plan */
    justify-content: flex-begin;     /* Alignements des liens dans le menu */
}
.menu li {
    list-style-type: none ;       /* Suppression des puces */
  
}


.menu a {
    display:block;                /* Transformation en block */
    min-width: 120px;             /* Largeur minimale des liens */   
    
    margin: 0.5rem;               /* Marges externes */
    padding: 0.4rem 0;            /* Marges internes */
    text-align: center;           /* Centrage du texte */   
    background-color: green;    /* Arrière-plan */
    color: white;                  /* Couleur du texte */
    text-decoration: none;        /* Suppression du soulignement */
    border: 1px solid #fff;       /* Ajout d'une bordure */
    border-radius: 8px;           /* Arrondis des bordures */
    
    transition: all 1s ;          /* Ajout des effets de transition */
}



.menu a.actif {    
    background-color: #000 ; 
    color: white;
    border-color: #1ABC9C ;
}
.menu a:hover,
.menu a:hover.actif {
    background-color: violet;
    color: white;
    border-color: #1ABC9C;
}

/* css pour compteur de visites */


#visites {
	display: flex;
	border: 5px solid red;
	justify-content: center;
	min-height: 10Px;
	align-items: center;
	flex-direction: column;
	background-color: #005050;
	color: #FF0000;
}



#compteur {

	font-size: 8em;
	margin: 0;
	
	/*filter: blur(32px); */
}



/* fin css -----------------------------------------------*/




