/* GENERALITE */
*{
	padding:0px;
	/*! margin:0px; */
}

@font-face {
    font-family: "times new roman";
	  font-style: normal;
    src: url('/includes/TimesNRSevenMTStd.otf') format('opentype');
	  
}

@font-face {
    font-family: "dosis";
	  font-style: normal;
    src: url('/includes/DOSIS-MEDIUM.TTF') format('truetype');
	  
}
@font-face {
    font-family: "times new roman";
    font-style: italic;
    src: url('/includes/TimesNRSevenMTStd-Italic.otf') format('opentype');

}
body { 
	font-family: "dosis", "times new roman", sans-serif;
	background-image: url("/images/fond.png");
	
	min-width: 600px;
	min-height: 5000px;
	overflow: scroll;
}

.fonds { 
	position:fixed;
	top: 00px;
	right: 00px;
	background-image: url("/images/fond.png");
	width: 100%;
	height: 100%;
  
}



a{ color: black;
	text-decoration: none;
	
		
} 
a:hover{
	color:blue;	
} 
p {
   
}

h1 {
    color: black;
    text-align: right;
    font-style: normal;
    font-size: 18px;
		letter-spacing: 0.06em;
    margin-bottom: 21x;
    line-height: 60px; 
}

h2 {
    color: black;
	  font-style: normal;
	  letter-spacing: 0.06em;
    font-size: 18px;
    line-height: 24px; 
	  text-align: left;
}
.italique {/*CV-italique*/
  font-style: italic;  
	
}

.blue {/*lien*/
    color: blue;
	/*! text-decoration-line: underline; */
    font-style: normal;
}

.tabulation {
padding-left: 158px;
}
.grandetabulation {
padding-left: 90px;		
}
.date {
float: left;		
}



/*-------------------------fond---------------------------*/
.conteneur_fond {
	float: right;
	width: 110%;
	height: 110%;
	top: 0px;
	right: 0px;
	position: fixed;
	

    
	
}

.casefond {
	float: right;
	width: 20px;
	height: 20px;
	top: 0px;
	right: 0px;
	position: relative;
	z-index: 0;
    
	
}

.bord_top {
	
	width: 100%;
	height: 40px;
	
	top: 0px;
	right: 0px;
	
	position: fixed;
	
}
/*-------------------------INDEX---------------------------*/

.fiche_index {
	
	 
	left:40px; right:350px;
	top:40px; bottom: 40px;
	width: auto;
	height: auto;
	min-width: 600px;
	min-height: 560px;
	position: fixed;
	z-index: 20;
	
}
.fiche_conteneur_index {
	left:40px; right:390px;
  	top:80px; bottom:40px;
	float: left;
	width: auto;
	height:auto;
	position: fixed;
	z-index: 5;
	overflow: visible;
	min-width: 560px;
}

.conteneurimage_index {
	left:40px; right:390px;
  	top:80px; bottom:40px;
	float: right;
	position: fixed;
	overflow: visible;
	min-width: 560px;
	min-height: 480px;
	z-index: 30;
	
}
.conteneurimage_index:hover {
	cursor: url("/images/cursor.png"), pointer;

}


.legende {
	
	 
	left:0px; right:350px;
	top:-40px; bottom: 0px;
	width: 500px;
	height: 40px;
	position: absolute;
	z-index: 20;
	
	line-height: 40px;
	color: black;
	text-align: left;
  	font-style: normal;
  	font-size: 18px;
	letter-spacing: 0.14em;
	float: left;
	background-color: white;
	
	text-transform: uppercase;
}

/*-------------------------menu---------------------------*/

.menu {
	
	top:40px; bottom:40px;
    right:40px;
 	width: 300px;
    height: 156px;
	position: fixed;
	z-index: 20;
 }

.img_menu_vignette {
	top: 100px;
	right:60px;
	max-width: 200px;
  	max-height: 200px;
	position: fixed;
 }

.titre_menu {
	top:40px;
	right:40px;
	width: 310px;
	height: 58px;
	position: fixed;
	z-index: 22;
	background-color:white;	
	color: black;
	
    
}
.titre_menu_texte{
	
	top: -1px; bottom:;
	left:; right: 20px;
	width: 280px ;
	height: 60px;
	position: relative;
	float: right;
	overflow: hidden;
	
	margin-bottom: 21x;

	color: black;
	text-align: right;
  font-style: normal;
  font-size: 26px;
	letter-spacing: 0.15em;
  line-height: 58px;

}

.liens_menu {
	
	top:98px; bottom:;
	left:; right:40px;
	width: 310px ;
	height: 98px;
	position: fixed;
	z-index: 30;
	background-color: white;
	
	line-height: 57px; 
	
}

.liens_menu_texte {
	
	
	top:98px; bottom:;
	left:; right:60px;
	width: 270px ;
	height: 100px;
	position: fixed;
	float: right;
	z-index: 30;

	
	line-height: 57px; 
	color: blue;
	font-style: normal;
	font-size: 18px;
	letter-spacing: 0.14em;
	line-height: 27px; 
	text-align: right;
	
	text-transform: uppercase;
}


.conteneur_menu {
	top:70px;
	right:50px;
	width: 350px;
	
	z-index: 1;
	overflow: hidden;
	float: right;
	height: 100%;
}


.con_conteneur_menu {
	top:0px;
	right:00px;
	width: 100%;
	height: 8000px;
	position: absolute;
	z-index: 1;
	overflow: hidden;		
}

.vignette_menu {
	float: left;
	width: 310px;
	top:198px;
	position: relative;
	/*! margin-top: 10px; */
	z-index: 1;
	overflow: hidden;
	
	background-color: white;
}
.img_menu {
	
	width: 290px;
	height: auto;
}



/*-------------------------contenu des fiches---------------------------*/
.fiche {
	
	 
	left:40px; right:350px;
	top:40px; bottom: 40px;
	width: auto;
	height: auto;
	min-width: 600px;
	min-height: 560px;
	background-color:#ffffff;
	position: fixed;
	z-index: 20;
	
}



.fiche_conteneur {
	left:60px; right:390px;
  	top:60px; bottom:60px;
	float: left;
	width: auto;
	height:auto;
	position: fixed;
	z-index: 5;
	overflow: visible;
	min-width: 560px;
}

.conteneurimage {
	top: 100px;
	left: 60px;
	float: right;
	/*! width: 100%; */
	/*! height: 100%; */
  bottom: 60px;
	position: fixed;
	z-index: 30;
	overflow: visible;
	right: 390px; 
	min-width: 560px;
	min-height: 480px;
}
.conteneurimage:hover {
	cursor: url("/images/cursor.png"), pointer;

}




/*-------------------------textes fiches---------------------------*/

.conteneurtexte {
	top: 0px; bottom:;
	left: 0px; right:;
	float: left;
	width: 280px;
	min-width: 280px;
	height: 100%;
	position: absolute;
	z-index: 19;
	overflow: hidden;
	
}
.titre{
	
	top: -8px; bottom:;
	 right: 0px;
	height: 29px;
	position: relative;

	z-index: 51;
	
	/*! margin-bottom: 21x; */
	
	font-style: normal;
    font-size: 26px;
	letter-spacing: 0.14em;
    

	float: right;
	text-transform: uppercase;
}
.info_fiche{
	top: 160px; 	bottom:;
	left:; 		right:;
	width: 360px;
	height: auto;
	position: absolute;
	float: left;
	
	color: black;
	/*! font-style: italic; */
    font-size: 18px;
	letter-spacing: 0.15em;
    line-height: 27px; 
	text-align: left;

	text-transform: uppercase;
}
.conteneur_multitexte {
	
	top: ; bottom:0px;
	left:0px; right:;
	width:100%;
	min-width: 310px;
	position:absolute; 
	overflow:visible;
	z-index: 19;
	
	margin:auto;
	
	color: black;
	font-size: 18px;
	letter-spacing: 0.05em;
	line-height: 26px; 
	text-align: left;
	
	
	
}
.texte{
	top: 00px;bottom:;
	left:; width: 100%;
	height: auto;
	position: relative;
	float: left;
	
	 
}

.liens {
	top:0px; bottom:;
	left:; right:0px ;
	width: 240px ;
	height: 100px;
	float: right;
	z-index: 30;
	position: inherit;
	
	color: blue;
	font-style: normal;
    font-size: 18px;
	letter-spacing: 0.14em;
	line-height: 57px; 
    line-height: 27px; 
	text-align: right;


	text-transform: uppercase;
}



.liensbis {
	
	line-height: 57px; 
	z-index: 30;
	font-style: italic;
	font-size: 35px;
	letter-spacing: 0.02em;
	line-height: 39.5px; 
	text-align: left;
	
}

.lienstierce {
	
	line-height: 25px; 
	z-index: 30;
	font-style: italic;
	font-size: 18px;
	letter-spacing: 0.02em;
	line-height: 39.5px; 
	text-align: left;
	
}


/*------------------------- fiche CV ---------------------------*/


.fiche_cv {
	
	position:absolute; 
	left:40px; right:350px;
	top:40px; 
	margin:auto;
	z-index: 20;
	overflow:hidden;
	background-color:#ffffff;
	
	min-width: 600px;
	height: 4300px;
}

.texte_cv{
	top: 90px;	bottom:80px;
	left:60px; 	right:45px;
	width: auto;
	height: auto;
	position: absolute;
	float: left;
	
	color: black;
  font-size: 26px;
	letter-spacing: 0.06em;
  line-height: 33px; 
	text-align: left;
  text-decoration-line: none;
}

.fiche_conteneur_cv {
	left:0px; /*! right:390px; */
  	top:60px; bottom:60px;
	float: left;
	width: 100%;
	height:100%;
	position: absolute;
	z-index: 5;
	overflow: hidden;
}

.titre_cv{
	
	top: 11px; 
	right: 40px;
	height: 29px;
	position: relative;
	overflow: hidden;
	z-index: 21;

	
	font-style: normal;
    font-size: 26px;
	letter-spacing: 0.14em;
    

	float: right;
	text-transform: uppercase;
}

.mail{
	position: relative;
	top: 58px; 
	/*! right: 40px; */
	height: 29px;
	float: left;
	
	left: -192px;
}
/*-------------------------galerie d'images---------------------------*/
.gal {
	width: auto;
	height: auto;
	max-height: 100%;
	max-width: 100%;

}

.img_fiche_active {
	position: absolute;
	top: 00px;
	width: 100%;
	height: 100%;
	
	z-index: 20;

}
.img_fiche_inactive {
	position: absolute;
	top: 00px;
	left: -100000px;
	width: 100%;
	height: auto;
	z-index: 6;
}

.vignette_galerie {
	left:0px;  right:0px;
  	top:0px; bottom:0px;
	float: left;
	width: 100%;
	height:90px;
	position: absolute;
	z-index: 5;
	overflow: visible
	
}

.img_vignette_galerie {
	
	width: auto;
	height: 90px;
	position: fixed;
	z-index: 5;
	
}

/*-------------------------BONUS---------------------------*/
.bonus {
	
	left:; right:40px;
	top:; bottom: 24px;
	width: 310px;
	height: 200px;
	background-color:;
	position: absolute;
	z-index: 5000;
	
}

.img_bonus {
	 
	
	margin-left: -10px; 
	transform: rotate( -18deg);
	/*! float: left; */
	margin-bottom: 100px;
	position: absolute;
}
}

/*-------------------------fiches annimées---------------------------*/



.ficheoff {

					width: auto;
        height: auto;
        position:fixed; 
        left:4000px; right:-4000px;
        top:40px; bottom:40px;
        margin:auto;
		z-index: 5;
        overflow:hidden;
	background-color:#ffffff;

 }

.ficheon {
		width: calc(100% - 77px);
        height: calc(100% - 80px);
        position:fixed; 
        left:0; right:0px;
        top:0px; bottom:0;
        margin:auto;
		z-index: 5;

        overflow:auto;
	
		animation-name: cssAnimation;
		animation-duration:1s;
		animation-iteration-count: 1;
		animation-timing-function: ease;
		animation-fill-mode: forwards;	

		-webkit-animation-name: cssAnimation;
		-webkit-animation-duration:1s;
		-webkit-animation-iteration-count: 1;
		-webkit-animation-timing-function: ease;
		-webkit-animation-fill-mode: forwards;
}

@keyframes cssAnimation {
from {
	transform: translate(3000px);
}
to {
	transform: translate(0px);
}
}
	
@-webkit-keyframes cssAnimation {
from {
-webkit-transform: translate(3000px);
}
to {
-webkit-transform: translate(0px);
}
	
	
}
@keyframes cssAnimationback {
from {
	transform: translate(0px);
}
to {
	transform: translate(3000px);
}
}
	
@-webkit-keyframes cssAnimationback {
from {
-webkit-transform: translate(0px);
}
to {
-webkit-transform: translate(3000px);
}
	
	
}

