/* -- "STYLE_GENERAL.CSS" ---------------------------- */ 
/* -- POLICES DE CARACTERES -------------------------- */ 
@font-face {
	font-family: 'Merienda';
	src: url('../fonts/Merienda-Regular.ttf'); 
}
@font-face {
	font-family: 'Handlee';
	src: url('../fonts/Handlee-Regular.ttf');
}
/* -- BANDEAU NAVIGATION ------------------------------- */
nav {
	font-family: "Merienda",arial;
    text-align: center;         /* Centrage du texte */
}
.menu {
	display: flex;
	flex-direction: row; 		/* Axe principale horizontale - en ligne - Inverse de Column */
	justify-content: center; 	/* Alignement axe principal - Ici Row = ligne */
	align-items: center; 		/* Alignement axe secondaire - Ici colonne */
	flex-wrap: wrap; 			/* Retour automatique à la ligne */
}
.menu p {
	cursor:default;
}
nav a {
    min-width: 110px;            	 /* Largeur minimale des liens */  
	height: 30px;					 /* Hauteur */
    padding: 4px 10px 0px 10px;  	 /* Marges internes Top Right Bottom Left */
    margin-right: 20px;			     /* Marges externes */
    margin-left: 20px;			     /* Marges externes */ 
	font-size: 1.0em;				 /* Taille des caractères */
    color: #55493F;                  /* Couleur écriture : Gris foncé */
    text-decoration: none;           /* Suppression du soulignement */
    background-color: #E1FEC7;		 /* Couleur du fond :  Vert clair */	
    border: 2px solid #E1FEC7;       /* Couleur bordure : Vert clair */
    border-radius: 20px;             /* Arrondis des bordures */	
}
nav p {
    min-width: 110px;  
	height: 30px;
    padding: 4px 10px 0px 10px;  
    margin-right: 20px;	
    margin-left: 20px;	   
    color: 55493F;                   
	font-size: 1.0em;
    text-decoration: none; 
    background-color: #E1FEC7;      
    border: 2px solid #FE5B25;       /* Couleur bordure : orange */
    border-radius: 20px;       
}
nav a:hover {
    border: 2px solid #FE5B25; 	      /* Couleur bordure : orange */
}
/* -- EN-TETE BANDEAU VAGUE ORANGE --------------------- */
header {
	background-image: url('../images/vague_orange.png');
	background-repeat: repeat;
    height: 60px;
}
/* -- BODY  ---------- */
main {
	font-family: 'Handlee',arial;	
}
main h1,h2,h3,h4,h5,h6 {
	text-align: center; 
	margin-top: 18px;
	margin-bottom: 18px;
}
main h1,h2,h3 {
	font-family: 'Merienda',arial;
}
main h4,h5,h6 {
	font-family: 'Handlee',arial;
}
main h1 {
	color: #479302;	/* vert */
	font-size: 2.1em;
}
main h2 {
	color: #FE5B25;	 /* orange */
	font-size: 1.4em;
}
main h3 {
	color: #55493F; /* Gris */
	font-size: 1.2em;	
}
main h4 {
	color: #479302; /* Vert */
	font-size: 1.4em;	
	text-align: center;
}
main h5 {
	color: #FE5B25;	 /* orange */
	font-size: 1.4em;
}
Main h6 {
	color: #55493F; /* Gris */
	font-size: 1.4em;
}
Main p {
	font-family: 'Handlee',arial;
	color: #55493F; /* Gris */
	font-size: 1.2em;	
}
Main table {
	font-family: 'Handlee',arial;
	color: #55493F; /* Gris */
	font-size: 1.4em;	
}
.centrer-verticalement {
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
}
/* -- BAS DE PAGE VAGUE VERT PALE  --------------------- */
section {
	height: 100px;
	background-repeat: repeat;
}
.vague_verte { 					/* vague vert pale en bas */
	background-image: url('../images/vague_verte.png');
	background-repeat: repeat;
}
/* -- PIED DE PAGE -------------------------------------- */
footer {
	font-family: "Merienda",arial;
	background-color: #E1FEC7; 	/* Couleur du fond : vert pale */
    text-align: left;			/* texte centré */
	color: #55493F;				/* Couleur du texte : gris Foncé */ 
}
.piedepage {
	display: flex;
	flex-direction: row;   		/* présentation horizontale - en ligne - Inverse de Column */
	justify-content: center;    /* alignement axe principal */
	align-items: center;        /* alignement axe secondaire */
	flex-wrap: wrap;            /* retour automatique à la ligne */
}
.piedepage a {
	font-size: 1.2em;
    color: #479302;           	/* Couleur du texte : vert */
    text-decoration: none;      /* Suppression du soulignement */	
    margin-right: 40px;       	/* Pour ne pas coller les liens entre eux */     
}
.piedepage a:hover {
	color: #2C5A01; 			/* vert foncé */
    text-decoration: underline;  
}
.piedepage img {
    margin-left: 40px;       	/* Pour ne pas coller les liens entre eux */     
}
.bloc_contact {
	width: 300px;
	text-align: center; 
	border-left: 2px solid #2C5A01; 	/* vert foncé */
    border-right: 2px solid #2C5A01; 	/* vert foncé */   	
}
.bloc_contact h2 {	
	font-weight: normal;
}
.bloc_contact a {	
	color: #FE5B25; 			/* Orange */
    margin-right: 0px;       	/* remise à zéro de la marge de droite pour centrage */
	font-size: 1.1em;
	text-decoration: none;	
}
.bloc_contact a:hover {	
	color: #FE5B25; 			/* Orange */
	text-decoration: underline;
	font-weight: bold;
}
.bloc_contact p {
	font-family: "Handlee",arial;
	font-size: 1.4em;
    color: #55493F;               /* vert */
	margin-top: 10px;
	margin-bottom: 10px;
}
/*-- POUR LES ECRANS INF A 1320 PX ------------------------- */

@media screen and (max-width:1320px) {
	.navigation img { display:none; }
	.navigation {padding:15px 0 15px 0; }
}
/* Cacher la case à cocher */
.menu-toggle {
    display: none;
}
.menu-icon {
	margin-left:20px;
}
/*-- POUR LES ECRANS INF A 640 PX -------------------------- */ 
@media (max-width: 640px) {
    /* Cacher le menu par défaut */
    .menu {
        display: none;
        flex-direction: column;
		padding-top:10px;
    }
    .menu a, .menu p {
        text-decoration: none;
        display: block;
    }
    /* Afficher le menu lorsque la case est cochée */
    #menu-toggle:checked + .menu-icon + .menu {
        display: flex;
    }
    .menu-icon {
        display: block; /* Afficher le bouton burger */
        cursor: pointer;
        width: 30px;
        height: 22px;
        position: relative;
    }
    .menu-icon span {
        background-color: #333;
        display: block;
        height: 4px;
		margin: 5px 0;
        transition: 0.4s;
    }
	.navigation .menu a,.navigation .menu p  {
		width:80%;
		margin:10px 0 10px;
	}
}
/* FIN 
   #E1FEC7 = vert clair
   #479302 = vert 
   #2C5A01 = vert Foncé
   #FE5B25 = orange
   #55493F = Gris Foncé   
*/
/*-- STYLE GENERAL.CSS" -------------------------------------*/

