@charset "utf-8";
/* CSS Document */
HTML{
    font-size: 100%;    
}
body{
	background:#fff;

     padding: 0;
     margin: 0;
}
	
}
input, select, textarea{
    font-size: 100%;
}
a {
	color:black;
	text-decoration:none;
}

em.italic{
    font-family:Times New Roman;
    font-style: italic;
}




.info {
	font-family:Times New Roman;
	font-size:30px;
	color:black;
	z-index:150;
	position:relative;
	margin-top: 40px;
	margin-left:40px;
    margin-right:40px;
    margin-bottom: 100px;
	text-align:left;

}



/*LIENS TEXT*/
.info a:link {

 border-bottom: 2px solid;
    
}

.info a:hover {
        font-style: italic;
     border-bottom: 0px solid;

}
    
 .info a:visited {
    
}

/*FIN LIENS TEXT */


/* ITALIC TEXT*/

.info .italic {font-style: italic}
/* FIN ITALIC TEXT*/



.camille{
		font-family: times New Roman ;
	font-weight: normal;
	font-size:19px;
	color:black;
	z-index:150;
	position:fixed;
	top:20px;
	left:40px;
	text-align:left;
}
.monoinfo{
	font-family:helvetica;
	font-weight: normal;
	font-size:13px;
	color:black;
	position:fixed;
	top:20px;
	right:45px;
	text-align:right;
    	z-index:3000;

}



.background {
position:relative; /* important */ 
width:100%;
vertical-align: middle;
top:0 ;
right:0;
bottom:0;
left:0;
}
 
.background .full img {
width: 100%;
vertical-align: middle;
}

.background .demi img {
width: 50%;
    margin-left: 50%;
vertical-align: right;
}

.background .tiers img {
width: 70%;
    margin-left: 30%;
vertical-align: right;
}



/********* 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 {
 font-size: 35px;
 font-family: times new roman;
    color: black;
 line-height: 1em;
 text-align:center;
 position:inherit;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
}

/* Overlay */
.overlay-image .hover {
 position: absolute;
 top: 0;
 height: 100%;
 width: 100%;
 opacity: 0;
}

/* Apparition overlay sur passage souris */
.overlay-image:hover .hover {
 opacity: 1;
}




.retour {
    font-family: helvetica;
	font-weight: normal;
	font-size:13px;
	color:black;
	z-index:3000;
	padding-left:10px;
	text-align:left;
    
}


     .camillemobile{
	font-family: helvetica;
	font-weight: normal;
	font-size:13px;
	color:#FFFFFF;
	z-index:0;
	position:fixed;
		top:20px;
	    padding-left: 18px;
	text-align:left;
        opacity: 0;
    }


@media only screen and (max-width: 780px) {      
    
        .info {
	font-family:Times New Roman;
	font-size:30px;
	color:black;
	z-index:150;
	position:relative;
margin-top: 40px;
            margin-left:0px;
            padding-left: 20px;
    padding-right: 20px;
        margin-right: 0px;

	text-align:left;
}
    

    
    
.camille{
	opacity: 0;
    	z-index:00;

    }
.monoinfo{
	opacity: 0;	z-index:0;


}
    .camillemobile{
	z-index:3000;

                opacity: 1;

    }
    
    .overlay-image .text {
 font-size: 15px;
 
}
    
.overlay-image .hover {
 position: absolute;
 top: 0;
 height: 100%;
 width: 100%;
 opacity: 0;
}    
   .overlay-image:checked .hover {
 opacity: 1;
}


    
}