		
				
	* {margin : 0; padding: 0;}	
	img#frise {display : block;
			width: 100%; height: 30px;}
	div#titre { background-color: skyblue; height: 52px;
			position: relative;}
	#titre img { position: absolute;
			top: 5px; left: 25%;
			height: 50px; width: 40px;}
	#titre h1, #titre h2 {margin: 0 auto;
				width: 280px; color: red;}
	#titre h1 {background-color: khaki;}
	#titre h2 {position:relative ;
			top: -10px; left: 50px;}
	h2#titre_fixe { position: fixed;
			top:200px; left: 0;
			width:120px; padding:10px;
			background-color: lightgreen;
			text-align: center;}
	div#galerie { position: absolute;
			top: 90px; left: 10px;}
	#galerie img {margin: 20px; width: 900px; height: auto;
			border:solid 1px; float: left;}

	 #titre h1, #titre h2 {border-radius : 20px; padding-left :5px;}				
		
		body {
			background-color : #B0C4DE;
		
		}
		img {
			width: 500px; height: 300px; border-radius : 20px;
				
		}
	
	 	div {

			border: 0px solid purple;
			
		}
	
		div:hover img {
		border: 1px solid yellow; 
		}
		div:hover {
		text-transform: uppercase;
		}
		
		/* Pour créer un bouton link c'est à dire avec <a>	*/
		.button {
  		  background-color: skyblue;
  		  border: none;
  		  color: blue;
  		  padding: 5px 5px;
  		  text-align: center;
  		  text-decoration: none;
  		  display: inline-block;
  		  font-size: 16px;
 	 	  border-radius : 20px;
  		  cursor: pointer;
		}
		/* Pour afficher notre adresse */
		#adresse {
			position : absolute;
			right : 25%;
			left : 25%;
			margin : 5px;
			text-align : center;
			color : black;
			
		}
 			/* Pour afficher en relief les lignes d'une table	*/
		tr:hover {background-color: #ddd; }

			/* Conteneur principal */


.overlay-image {
 position: relative;
 width: 100%;
}
			/* Image originale */	
.overlay-image .image {
    
 display: block; 
 border-radius : 20px;
 
}
	/* Texte original */	
.overlay-image .text {
 color: #fff;
 font-size: 30px; 
 line-height: 1.5em;
 text-shadow: 2px 2px 2px #000;
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: auto;
}


		/* Hover image et texte */
	/* Overlay */

.overlay-image .hover {
 position: absolute;
 top: 0;

 height: 100%;
 width: 100%;
 
 opacity: 0;
 transition: .5s ease;
}



	/* Apparition overlay sur passage souris */	

.overlay-image:hover .hover {
 opacity: 1;
}


		/*pour background et texte uniquement */

.overlay-image .normal {
 transition: .5s ease;
}
.overlay-image:hover .normal {
 opacity: 0;
}
.overlay-image .hover {
 background-color: rgba(0,0,0,0.5);
}
/* Utilisation imput	*/
label {
    display: block;
    font: 1rem 'Fira Sans', sans-serif;
}

input,
label {
    margin: .4rem 0;
}

/* Fin imput 	*/
