/* Saisissez votre CSS personnalisé ci-dessous */

/********* Basique *******/
/* Centrer */
.centrer {
text-align:center;
}
/* Justifier */
.justify {
text-align:justify;
}

/********* Flotter *******/
/* Flotter à gauche */
.flotte-left {
float:left;
}
/* Flotter à droite */
.flotte-right {
float:right;
}
/* Positionnement médaillon */
.medaillon {
float:left; 
width:300px; height:300px; 
margin-top:10px; margin-bottom:40px; margin-right:40px
}

/********* Superposition simple de texte sur une image *******/
/* Conteneur principal */
.overlay-image {
 position: relative;
 width: 100%;
}
/* Image originale */
.overlay-image .image {
 display: block;
 width: 100%;
 height: auto;
}
/* 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: 100%;
}

/* Overlay */
.overlay-image .hover {
 position: absolute;
 top: 0;
 height: 100%;
 width: 100%;
 opacity: 0;
 transition: .5s ease;
	background:url
}
/* Apparition overlay sur passage souris */
.overlay-image:hover .hover {
 opacity: 1;
}

/********* Hover 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);
}