/* Reset CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}


/*------------corps-----------------------------*/
body{
color:#006d9d;
min-height:100%;
margin:0;
padding:0; 
overflow: hidden; 
}
span {
display: inline-block;
vertical-align: middle;
line-height: normal; 
font-family: "Futura-Medium", Futura, sans-serif;
color:white; 
margin:8px 8px 8px 8px;  
}
#imageFond{
display:block;
margin:0;
padding:0; 
width:100%; 
min-height:100%;
position:absolute;
background: url(../img/bkgd.jpg) no-repeat center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
 background-size: cover;
overflow: hidden;
}
#displayed {
 z-index:1;
left:51%; 
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
color:white; 
position:absolute;

}
#label_AS{
z-index:1;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
position: absolute;

}
#infos{
 z-index:1;
width:100%;
text-align:center;
top:95%;

color:white; 
position:absolute;
font-family: "Futura-Medium", Futura, sans-serif;

}
figure { 
margin: 0; 
display: block; 
}
#baseline{
left:50%;
text-align:center; 
font-family: "Futura-Medium", Futura, sans-serif;
transform:translate(-50%,-50%);
 -webkit-transform:translate(-50%,-50%);
color:white; 
position:absolute;
-webkit-animation: monAnim 2s 1; 
-moz-animation: monAnim 2s 1; 
-o-animation:monAnim 2s 1; 
animation:monAnim 2s 1; 
}
#bt_contact{
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	left:10%;
	bottom:0;
  color:white;
	transform:translate(-50%,-50%);
	position:absolute;
	width:200px;
	height:50px;
	line-height:50px;
	text-align:center;
background-color:rgba(255,255,255,0.2);
opacity:1;
}
#bt_mentions{
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	left:10%;
	bottom:0;
  color:white;
	transform:translate(-50%,-50%);
	position:absolute;
	width:200px;
	height:50px;
	line-height:50px;
	text-align:center;
font-size:12px;
opacity:1;
}
#bt_contact:hover,#bt_mentions:hover{
opacity:0.4;
}
/*------------page0-----------------------------*/
#txt1{

position:fixed;	
	transform:translate(-50%,-50%);
	width:200px;
	height:200px;

	line-height:180px;
	text-align:center;	
	transform: rotate(0deg);
	transform-origin: left left;		
	padding:30px;
	
	pointer-events: none; 
}
#txt2{

position:fixed;	
	transform:translate(-50%,-50%);
	width:200px;
	height:200px;
	line-height:180px;
	text-align:center;	
	transform: rotate(0deg);
	transform-origin: left left;		
	padding:30px;

	pointer-events: none; 
}
#active{	
	transform:translate(-50%,-50%);
	width:200px;
	height:200px;
	display:block;
	transform: rotate(0deg);
	transform-origin: left left;
	opacity: 0.2;
	padding:30px;
	color:white; 
	position:fixed;	
}
#commande{	
	transform:translate(-50%,-50%);
	width:200px;
	height:200px;
	display:block;
	opacity: 0.2;
	padding:30px;
	transform: rotate(0deg);
	transform-origin: left left;
	color:white; 
	position:fixed;
	}
#activeHover{	
	transform:translate(-50%,-50%);
	width:200px;
	height:200px;
	display:block;	
	padding:30px;	  
	color:white; 
	position:fixed;		
	cursor:pointer;cursor:hand;	
		
	}
#commandeHover{	
	transform:translate(-50%,-50%);
	width:200px;
	height:200px;
	display:block;		
	padding:30px;
	   color:white; 
	position:fixed;		
	cursor:pointer;cursor:hand;
	}




/*------------page1-----------------------------*/
#txt_download{

position:fixed;	
	transform:translate(-50%,-50%);
	width:180px;
	height:180px;

	line-height:180px;
	text-align:center;	
	transform: rotate(0deg);
	transform-origin: left left;		
	padding:30px;
	
	pointer-events: none; 
}
#txt_utilisation{

position:fixed;	
	transform:translate(-50%,-50%);
	width:180px;
	height:180px;
	line-height:180px;
	text-align:center;	
	transform: rotate(0deg);
	transform-origin: left left;		
	padding:30px;

	pointer-events: none; 
}
#txt_QF{

position:fixed;	
	transform:translate(-50%,-50%);
	width:180px;
	height:180px;

	line-height:180px;
	text-align:center;	
	transform: rotate(0deg);
	transform-origin: left left;		
	padding:30px;
	
	pointer-events: none; 
}
#txt_kit{

position:fixed;	
	transform:translate(-50%,-50%);
	width:180px;
	height:180px;

	line-height:180px;
	text-align:center;	
	transform: rotate(0deg);
	transform-origin: left left;		
	padding:30px;
	
	pointer-events: none; 
}
#Download{
transform:translate(-50%,-50%);
display:block;
transform: rotate(0deg);
transform-origin: left left;
opacity: 0.2;
padding:30px;
color:white; 
position:fixed;
}
#kit{
transform:translate(-50%,-50%);
display:block;
opacity: 0.2;
padding:30px;
margin: 8 8 8 8 ; 
transform: rotate(0deg);
transform-origin: left left;
color:white; 
position:fixed;
}
#utilisation{
transform:translate(-50%,-50%);
display:block;
opacity: 0.2;
padding:30px;
transform: rotate(0deg);
transform-origin: left left;
color:white; 
position:fixed;
}
#QF{
transform:translate(-50%,-50%);
display:block;
opacity: 0.2;
padding:30px;
transform: rotate(0deg);
transform-origin: left left;
color:white; 
position:fixed;
}
#DownloadHover{
transform:translate(-50%,-50%);
display:block;
padding:30px;
transform: rotate(0deg);
transform-origin: left left;
color:white; 
position:fixed;
cursor:pointer;cursor:hand;
}
#kitHover{
transform:translate(-50%,-50%);

display:block;
padding:30px;
transform: rotate(0deg);
transform-origin: left left;
   color:white; 
position:fixed;
cursor:pointer;cursor:hand;
}
#QFHover{
transform:translate(-50%,-50%);
display:block;
padding:30px;
transform: rotate(0deg);
transform-origin: left left;
color:white; 
position:fixed;
cursor:pointer;cursor:hand;
}
#utilisationHover{
transform:translate(-50%,-50%);
display:block;
padding:30px;
transform: rotate(0deg);
transform-origin: left left;
color:white; 
position:fixed;
cursor:pointer;cursor:hand;
}
/*------------------MODAL BOX--------------*/
.popDialog {
position: fixed;
font-family: "Futura-Medium", Futura, sans-serif;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 99997;
opacity:1;
text-align:center;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;

}
/*.popDialog:target {
opacity:1;
pointer-events: auto;
}*/
.popDialog > div {
position: relative;
margin: 100px auto;
text-align:left;
padding: 5px 20px 13px 20px;
border-radius: 10px;
background:white;
text-align:center;
width: 400px;height:auto;top:0px;  overflow: auto;  max-height: 600px;
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius:0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright:0;
border-top-left-radius: 0;
border-top-right-radius:0;
}
.popPDF{
position: fixed;
font-family: "Futura-Medium", Futura, sans-serif;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 99997;
opacity:1;
text-align:center;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
}
.popPDF > div {
position: relative;
margin: 100px auto;
text-align:left;
padding: 5px 20px 13px 20px;
border-radius: 10px;
background:white;
text-align:center;
width: 400px;height:auto;top:0px;  overflow: auto;  max-height: 600px;
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius:0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright:0;
border-top-left-radius: 0;
border-top-right-radius:0;
}
/*.popPDF:target {
opacity:1;
pointer-events: auto;
}*/
a:link, a:visited {
    text-decoration: none;
   
}
#noDecoration{    
    color:#73baba;
}
#topPDF{
font-family: "Futura-Medium", Futura, sans-serif;
font-weight: medium;
text-align:center;
border-bottom:none;
position: relative;
border-radius: 10px;
-webkit-border-bottom-left-radius: 0;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-bottomright:0;
border-bottom-left-radius: 0;
border-bottom-right-radius:0;
font-size: 26px;
background:#73baba url(../img/picto_download.png) 5px 5px no-repeat;
padding:5px 20px 13px 20px;
width: 400px;height:auto;top:100px; 

overflow: inherit;
}
.popQF{
position: fixed;
font-family: Arial;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 99997;
opacity:1;
text-align:center;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
}
.popQF >div {
position: relative;
margin: 100px auto;
text-align:left;
padding: 5px 20px 13px 20px;
border-radius: 10px;
background:white;
width: 600px;height:auto;top:-100px;  overflow: auto;  max-height: 600px;
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius:0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright:0;
border-top-left-radius: 0;
border-top-right-radius:0;
}
#QF_text{
overflow:auto;
cursor:pointer;cursor:hand;

}
#QF_text p{
color:black;
text-align: justify;
text-justify: inter-word;
}
.popQF > div > li:hover {
text-decoration: underline;
cursor:pointer;cursor:hand;
}

/*.popQF:target {
opacity:1;
pointer-events: auto;
}*/
#topPop{
font-family: "Futura-Medium", Futura, sans-serif;
font-weight: medium;
text-align:center;
border-bottom:none;
position: relative;
border-radius: 10px;
-webkit-border-bottom-left-radius: 0;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-bottomright:0;
border-bottom-left-radius: 0;
border-bottom-right-radius:0;
font-size: 26px;
background:#3385f5 url(../img/picto_download.png) 25px 5px no-repeat;
padding:5px 20px 13px 20px;
width: 400px;height:auto;top:100px; 

overflow: inherit;
}
#topActiv{
font-family: "Futura-Medium", Futura, sans-serif;
font-weight: medium;
text-align:center;

background-color:#ae449a;
padding:5px 20px 13px 20px;
border-bottom:none;
position: relative;
border-radius: 10px;
top:0;
-webkit-border-bottom-left-radius: 0;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-bottomright:0;
border-bottom-left-radius: 0;
border-bottom-right-radius:0;
}

#topQF{
font-family: "Futura-Medium", Futura, sans-serif;
font-weight: medium;
text-align:center;
border-bottom:none;
position: relative;
border-radius: 10px;
-webkit-border-bottom-left-radius: 0;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-bottomright:0;
border-bottom-left-radius: 0;
border-bottom-right-radius:0;
font-size: 26px;
background:#ad6eaa url(../img/picto_QF.png) 25px 5px no-repeat;
padding:5px 20px 13px 20px;
width: 600px;height:30px;
top:0;
overflow: inherit;
}
.close{
background: #606061;
font-size:16px;
color: #FFFFFF;
line-height: 25px;
position: absolute;
right: -12px;
text-align: center;
top: -10px;
width: 24px;
text-decoration: none;
font-weight: bold;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}
.close:hover { background: #00d9ff; }
/*-----------------------MODAL--------------------*/
.popActiv{
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99997;
	opacity:1;
	text-align:center;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;

}
.popActiv > div {
top:-100px;
	width: 600px;
	position: relative;
	margin: 100px auto;
	
	padding: 5px 20px 13px 20px;
	border-radius: 10px;
	background:white;
	-webkit-border-top-left-radius: 0;
	-webkit-border-top-right-radius:0;
	-moz-border-radius-topleft: 0;
	-moz-border-radius-topright:0;
	border-top-left-radius: 0;
	border-top-right-radius:0;
	
}

#Activ_text {

font: 12px Helvetica;
text-align:left;

}

/*.popActiv:target {
opacity:1;
pointer-events: auto;
}*/

.popKit{
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: -150px;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99997;
	opacity:1;
	text-align:center;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
}
.popKit > div {

	width: 600px;height:auto;top:0px;   max-height: 600px;
 
	position: relative;
	margin: 100px auto;
	text-align:left;
	padding: 5px 5px 20px 20px;
	border-radius: 10px;
	background:white;
	-webkit-border-top-left-radius: 0;
	-webkit-border-top-right-radius:0;
	-moz-border-radius-topleft: 0;
	-moz-border-radius-topright:0;
	border-top-left-radius: 0;
	border-top-right-radius:0;
overflow:auto;
}
#topKit > h4{
	text-align:center;
  margin-top:6px;
  font-size:24px;
} 
/*.popKit:target {
opacity:1;
pointer-events: auto;
}*/
#Kit_text form { margin: 0 20px; position: relative },#Activ_text form{ margin: 0 20px; position: relative }
#Kit_text form input::-webkit-input-placeholder { color:white; },#Activ_text form input::-webkit-input-placeholder { color:white; }
#Kit_text form input::-moz-placeholder { color:white; },#Activ_text form input::-moz-placeholder { color:white; } /* firefox 19+ */ 
#Kit_text form input:-ms-input-placeholder { color:white; },#Activ_text form input:-ms-input-placeholder { color:white; } /* ie */
#Kit_text form input input:-moz-placeholder { color:white; },#Activ_text form input input:-moz-placeholder { color:white; }
#Kit_text  label{ text-align: left;width: 190px;}
#Kit_text form input[type="text"],#Kit_text form textarea,#Activ_text form input[type="text"],#Activ_text form textarea{
font-family: "Futura-Medium", Futura, sans-serif;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
background: rgba(255,255,255,0.2) ;
border: 1px solid #c8c8c8;
color: #1180ac;
margin: 0 0 10px;
}

#Activ_text form input[type="text"]:focus {
-webkit-box-shadow: 0 0 2px #ed1c24 inset;
-moz-box-shadow: 0 0 2px #ed1c24 inset;
-ms-box-shadow: 0 0 2px #ed1c24 inset;
-o-box-shadow: 0 0 2px #ed1c24 inset;
box-shadow: 0 0 2px #ed1c24 inset;
background-color: #fff;
border: 1px solid #ed1c24;
outline: none;
}

#Kit_text p{
font-family: "Futura-Medium", Futura, sans-serif;
color:#135171;
font-size: 16px;
}
#topKit{
font-family: "Futura-Medium", Futura, sans-serif;
font-weight: medium;
background:#f99221 url(../img/picto_commande.png) 25px 5px no-repeat;
padding: 5px 5px 20px 20px;
border-bottom:none;
position: relative;
width: 600px;height:auto;top:100px; 
border-radius: 10px;
-webkit-border-bottom-left-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-bottomright:0;
	border-bottom-left-radius: 0;
	border-bottom-right-radius:0;
  overflow:inherit;
	}

.styled-select {text-align:left;}
.styled-select select {
font-family: "Futura-Medium", Futura, sans-serif;
color:grey;
background-color: White;
text-align:left;
padding: 5px;
font-size: 16px ;
line-height: 1;
border: 0.5;
border-radius: 5px;
height: 34px;  
}
.submit button  {
top:0;
font-family: "Futura-Medium", Futura, sans-serif;
color: white;
background-color: #f99221;
border-radius: 10px;
border:0;
cursor:pointer;cursor:hand;
}

.validate button  {
font-family: "Futura-Medium", Futura, sans-serif;
color: white;
background-color: #ae449a;
border-radius: 0;
border:0;
cursor:pointer;cursor:hand;
}
.submit button:hover {
opacity:0.5;
}
.validate button:hover {
opacity:0.5;
}
.validateMDP button:hover {
opacity:0.5;
}
.validateMDP button  {
font-family: "Futura-Medium", Futura, sans-serif;
color: rgba(255,255,255,1);
background-color: rgba(255,255,255,0.2);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
cursor: pointer;cursor:hand;
font-size:  16px ;
position: relative;
margin: 30px 30px 30px 30px;
border: 0px solid #fff;
}
.row{
    display:table-row;
}
/*-----------------login----------------------*/

h1,h2,h3,h4,h5,h6{ color:#fff;font-family: "Futura-Light", Futura, sans-serif;}
#forget_password {

font-family: "Futura-Light", Futura, sans-serif;
width: 100%;height:30px;font-size:12px;text-align:center;

}
#forget_password a{
color:#fff;
background-color:rgba(255,255,255,0);
opacity:1;
}
#forget_password a:hover{
opacity:0.5;
}
#content {
background-color:rgba(255,255,255,0.2);
opacity:1;
text-align: left;
}
#log_connexion{
color:#fff;
font-family: "Futura-Light", Futura, sans-serif;
font-size:12px;
line-height:22px;
position:absolute;
left:0;
text-align: right;
} 
#input_connexion{
position:absolute;
left:40%;

}
#connected {
background: rgba(255,255,255,1) url(../img/picto2.png) 5px 5px no-repeat ;
}
#connected h3 {
font-family: "Futura-Light", Futura, sans-serif;
text-align:left;
margin-left:30px;
color: #167fad;
font-size: 16px ;
}
#connected p{
font-family: "Futura-Light", Futura, sans-serif;
text-align:left;
color: #167fad;

margin-left:10px;
top:50px;position:relative;
left: 0;
}
#deconnexion{
font-family: "Futura-Medium", Futura, sans-serif;
background:transparent;

border:0;
text-align:left;
color: #167fad;
cursor:pointer;cursor:hand;

}
#change_psw{
font-family: "Futura-Medium", Futura, sans-serif;
background:transparent;
border:0 solid white;
margin-right:10px;
text-align:left;

color: #167fad;
cursor:pointer;cursor:hand;
}
#See_Deep{
font-family: "Futura-Medium", Futura, sans-serif;
background:transparent;
border:0;
text-align:left;
margin-left:0;

color: #167fad;
font-size: 12px ;
cursor:pointer;cursor:hand;
}
#deconnexion:hover{
background-color:#167fad;
color: white;
}
#change_psw:hover{
background-color:#167fad;
color: white;
}
#See_Deep:hover{
background-color:#167fad;
color: white;
}
#content form {margin-top: 5px;    margin-left: 5px; position: relative }
#content form input::-webkit-input-placeholder { color:white; }
#content form input::-moz-placeholder { color:white; } /* firefox 19+ */
#content form input:-ms-input-placeholder { color:white; } /* ie */
#content form input input:-moz-placeholder { color:white; }
#content form input[type="text"],
#content form input[type="password"] {
font-family: "Futura-Medium", Futura, sans-serif;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
background: rgba(255,255,255,0);
border: 1px solid white;

}
#content form input[type="text"]:focus,
#content form input[type="password"]:focus {
-webkit-box-shadow: 0 0 2px #ed1c24 inset;
-moz-box-shadow: 0 0 2px #ed1c24 inset;
-ms-box-shadow: 0 0 2px #ed1c24 inset;
-o-box-shadow: 0 0 2px #ed1c24 inset;
box-shadow: 0 0 2px #ed1c24 inset;
background-color: #fff;
border: 1px solid #ed1c24;
  color: #1180ac;
outline: none;
}

#connexion  {
font-family: "Futura-Light", Futura, sans-serif;

border-radius: 3px;
color: #00aeef;
background-color: white;
cursor: pointer;
font-size:  12px ;
border: 0px solid #fff;
width: 150px;height:35px;

}
#connexion:hover {
background-color: rgba(255,255,255,0.5);
}

/*-----------------anim----------------------*/
@-webkit-keyframes monAnim {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes monAnim {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes monAnim {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes monAnim {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-webkit-keyframes monAnimTxt {
  0%   { opacity: 0;top:100%; }
  100% { opacity: 1;top:75%; }
}
@-moz-keyframes monAnimTxt {
  0%   { opacity: 0;top:100%; }
  100% { opacity: 1;top:75%; }
}
@-o-keyframes monAnimTxt {
  0%   { opacity: 0;top:100%; }
  100% { opacity: 1;top:75%; }
}
@keyframes monAnimTxt {
  0%   { opacity: 0;top:100%; }
  100% { opacity: 1;top:75%; }
}

@-webkit-keyframes monAnimTxt2 {
  0%   { opacity: 0;top:50%; }
  100% { opacity: 1;top:35%; }
}
@-moz-keyframes monAnimTxt2 {
   0%   { opacity: 0;top:50%; }
  100% { opacity: 1;top:35%; }
}
@-o-keyframes monAnimTxt2 {
  0%   { opacity: 0;top:50%; }
  100% { opacity: 1;top:35%; }
}
@keyframes monAnimTxt2 {
  0%   { opacity: 0;top:50%; }
  100% { opacity: 1;top:35%; }
}

@-webkit-keyframes monAnimBT1l {
  0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:40%; }
}
@-moz-keyframes monAnimBT1l {
  0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:40%; }
}
@-o-keyframes monAnimBT1l {
  0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:40%; }
}
@keyframes monAnimBT1l {
 0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:40%; }
}
@-webkit-keyframes monAnimBT1p {
  0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:30%; }
}
@-moz-keyframes monAnimBT1p {
  0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:30%; }
}
@-o-keyframes monAnimBT1p {
  0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:30%; }
}
@keyframes monAnimBT1p {
 0%   { opacity: 0;left:0%; }
  100% { opacity: 1;left:30%; }
}

@-webkit-keyframes monAnimBT2l {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@-moz-keyframes monAnimBT2l {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@-o-keyframes monAnimBT2l {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@keyframes monAnimBT2l {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@-webkit-keyframes monAnimBT2p {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@-moz-keyframes monAnimBT2p {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@-o-keyframes monAnimBT2p {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}
@keyframes monAnimBT2p {
  0%   { opacity: 0;left:100%; }
  100% { opacity: 1;left:60%; }
}

/*-----------------resultat----------------------*/
.ajax-callback{
position: fixed;
font-family: "Futura-Medium", Futura, sans-serif;
top: 0;
right: 0;
bottom: 0;
left: 0;
color:white;
background: rgba(0,0,0,0.8);
z-index: 99998;
opacity:1;
text-align:center;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
}
.ajax-callback > div {
width: 600px;
position: relative;
margin: 100px auto;
text-align:center;
padding: 5px 20px 13px 20px;
background:white;
}
#error{
font-family: "Futura-Medium", Futura, sans-serif;
position:absolute;
top:30%;
left:50%;
width:300px;
height:100px;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:red;
color:white;
text-align:center;
font-size:  12px;
z-index: 99999;
}
#liremesCGV h5,#Mentions h5{
 color: grey;
}

#liremesCGV,#Mentions{
  font-family: "Futura-Medium", Futura, sans-serif;
  position: absolute;
 
  left: 50%;
  width: 80%;
  height: 80%;
  transform: translate(-50%,0%);
  -webkit-transform: translate(-50%,0%);
  background-color: white;
 
  text-align: justify;
  font-size: 14px;
  z-index: 99999;
  border-radius: 10px;
    display: flex;
}
#textCGV,#textMentions{
 
  background-color:white;
  color: grey;
  width: 98%;
  height:98%;
 overflow-y: scroll;
 -webkit-overflow-scrolling: touch;
 padding: 10px;
}
#successful,#successful_form{
font-family: "Futura-Medium", Futura, sans-serif;
position:absolute;
top:30%;
left:50%;
width:300px;
height:100px;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:#ad6eaa;
color:white;
text-align:center;
font-size:  12px ;
z-index: 99999;
}
.uppercase {
    text-transform: uppercase;
}
#user_logged{
font-family: "Futura-Medium", Futura, sans-serif;
position:absolute;
top:30%;
left:50%;
width:300px;
height:100px;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:#f99221;
color:white;
text-align:center;
font-size:  12px;
z-index: 99999;
}
#fill_form{
font-family: "Futura-Medium", Futura, sans-serif;
position:absolute;
left: 50%;
  top: 35%;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:blue;
color:white;
text-align:center;
font-size:  14px ;
z-index: 99999;
}
#change_mdp{
font-family: "Futura-Light", Futura, sans-serif;
position:absolute;
left: 50%;
  top: 35%;
text-align: center;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:#167fad;
border-radius: 10px;
color:white;
text-align:center;
font-size:  14px ;
z-index: 99998;
}
#forget_mdp{
font-family: "Futura-Light", Futura, sans-serif;
position:absolute;
left: 50%;
  top: 35%;
text-align: center;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:#167fad;
border-radius: 10px;
color:white;
text-align:center;
font-size:  14px ;
z-index: 99999;
}
#message_mdp{
font-family: "Futura-Light", Futura, sans-serif;
position:absolute;
left: 50%;
  top: 35%;
text-align: center;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:#167fad;
border-radius: 10px;
color:white;
text-align:center;
font-size:  14px ;
z-index: 99999;
}
#send_Deep{
font-family: "Futura-Light", Futura, sans-serif;
position:absolute;
  left: 50%;
  top: 35%;
text-align: center;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
background-color:#167fad;
border-radius: 10px;
color:white;
text-align:center;
font-size:  14px ;
z-index: 99999;
}