/* ------------------------ */
/*    Feuilles de style    */
/*  rédigées par P. Deynis  */
/* ------------------------ */

/* Eléments principaux de la page */
body{
    font-family: 'Trebuchet MS', Arial, sans-serif;
    background-color: #F5F5DC;} /* fond légèrement jaune */}
	

header .bg-grad {
	height: 75px;
	border-radius: 15px;
	background-color: green; /* For browsers that do not support gradients */
	background-image: linear-gradient(to bottom, green , lightgreen); /* Standard syntax (must be last) */
	}
	
 header .titre_banniere{
	left: 50px;
	font-size: 2em;
	letter-spacing: 2px;
	font-style: italic;
	color: yellow;
	text-shadow: 5px 5px 5px #000000;
	padding-left: 20px;
	padding-top: 15px;
	}
	
/* barre de navigation à déroulé */
	.barnav {
	   overflow: hidden;
	   background-color: #333;
	   border-style:solid;
	   border-bottom-color:red;
	   border-top-color:yellow;
	   }

	.barnav a {
	   float: left;
	   font-size: 14px;
	   font-weight:bold;
	   color:white;
	   text-align: center;
	   padding: 14px 16px;
	   text-decoration: none;
	   }

	.deroul {
	   float: left;
	   overflow: hidden;
	   }

	.deroul .deroulbtn {
	   font-size: 14px;
	   font-weight:bold;
	   border: none;
	   outline: none;
	   color: white;
	   padding: 14px 16px;
	   background-color: #333;
	   /*background-color: inherit; */
	   font-family: inherit;
	   margin: 0;
	   }

	.barnav a:hover, .deroul:hover .deroulbtn {
	   background-color: green;
	   }

	.deroul-content {
	   display: none;
	   position: absolute;
	   background-color: #ffcccc;
	   min-width: 160px;
	   box-shadow: 8px 8px 16px 0px rgba(0,0,0,0.5);
	   z-index: 1;
	   }

	.deroul-content a {
	   float: none;
	   color: blue;
	   padding: 4px 6px;
	   text-decoration: none;
	   display: block;
	   text-align: left;
	   }

	.deroul-content a:hover {
	   background-color: green;
	   color: white;;
	   }

	.deroul:hover .deroul-content {
	   display: block;
	   }
/* fin barre de navigation à déroulé */			
	
 .bienvenue
{font-family: Pristina, 'Trebuchet MS', Arial, sans-serif;
 font-size: 3em; 
 color: #008000;
 font-weight: bold;
 letter-spacing:2px;
 }	
 
section h1
{	font-size: 1.5em;
	color: red;  
	font-weight: bold;
	text-align: center;} 
	
section h2
{	font-size: 1.3em;
	color: blue;  
	font-weight: bold;
	font-style: italic;}

section h3
{	font-size: 1.2em;
	color: green;  
	font-weight: bold;
	font-style: italic;}
	
section h4
{	font-size: 1em;
	color: blue;  
	font-weight: bold;
	font-style: italic;}	
	
section p
{	font-size: 1em;
	color: black;  
	font-weight: bold;
	}	


/* Bouton Retour haut de page */
a#cRetour{
		  border-radius:3px;
		  padding:10px;
		  font-size:15px;
		  font-weight:bold;
		  text-align:center;
		  color:white;		/* couleur de la forme géométrique dans la touche */
		  background:#0066ff;	/*#0066ff couleur du fond de la touche */	
		  position:fixed;
		  right:20px;		/* touche à 20px du bord droit */
		  opacity:1;
		  z-index:99999;
		  transition:all ease-in 0.2s;
		  backface-visibility: hidden;
		  -webkit-backface-visibility: hidden;
		  text-decoration: none;
		}
		
		a#cRetour:before{ content: "Retour en haut"; } /* forme géométrique dans la touche */
		
		a#cRetour:hover{
		  background:rgba(0, 0, 0, 1);	/* couleur de fond sombre de la touche */
		  transition:all ease-in 0.2s;
		}
		
		a#cRetour.cInvisible{
		  bottom:-35px;
		  opacity:0;
		  transition:all ease-in 0.5s;
		}

		a#cRetour.cVisible{
		  bottom:20px;
		  opacity:1;
		}
		

/* Footer */
footer p {
font-size: 1em;
font-weight: bold;
}
/* fin footer */