body, html {
   
   
    margin:0;
    
   background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
 background-attachment: fixed;
  
}



 h2{
	  
	  
	  font-size:3em;
	  
  }

  h1{
	  font-family: Corbel; 
	 
	   margin: 5px;
	  font-size:1.1em;
	   
  }
  
  .Saisie{
	 margin: 5px;
	  font-size:0.9em;
	   width: 350px;
	 
	  background-color: rgba(255, 255, 255, .0);
	  font-style: italic;
	   text-align:center;
	   border-top-style: none;border-right-style: none; border-left-style: none;
	   border-bottom-color: gray;
  }
   .SaisieMpd{
	 margin: 5px;
	  font-size:0.9em;
	   width: 350px;
	  
	  	  background-color: rgba(255, 255, 255, .0);
		  font-style: italic;
		  text-align:center;
		  border-top-style: none;border-right-style: none; border-left-style: none;
		  border-bottom-color: gray;
  }
  .buttonValide{
	  cursor: pointer;
	  border:none;
	  font-size:1.2em;
	  width: 150px;
	  height: 50px;
	  background-color: unset;
	    border-radius: 4px;
		box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7); 
  }
  
    .buttonValide:hover{
		
		background-color: #ddd;
	}
	
	

	
	
	
	
	.passeOublie{
		font-size:0.7em;
		 cursor: pointer;
		margin-right:1px;
		 font-family: Corbel; 
	}
	
	.Bvideo{
		font-size:1.2em;
		font-family: Corbel;
		cursor: pointer;
		 border:none;
	  font-size:1.2em;
	  width: 155px;
	  height: 27px;
	  background-color: unset;
	    border-radius: 15px;
	box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);		
	   bottom: 48px;   
	   right: 20px;
    position: fixed;
	}


@media screen and (max-width: 1280px) {
	
	 .Saisie{
	 margin: 5px;
	  font-size:1.1em;
	   width: 500px;
	}
	
	
	
	.buttonValide{
	width: 200px;
	height: 50px;
	 font-size:1.8em;
	 bottom:10px;
	}
	
	
	
	
}



	
	
	
.modalLoadIndex  {
	
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 300px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modalLoadIndex -content {
	color: white;
    
    margin: auto;
	
    padding: 20px;
  
    width: 100%; /* Full width */
    height: 100%; /* Full height */
	
	text-align: center;
}

.loaderIndex  {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #CC0000;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
  margin-right:auto;	
	margin-left:auto;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}











.modalMdp {
	
    display: none; 
    position: fixed; 
    z-index: 99; 
    padding-top: 5%; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.4);
	
	
	
	
	
}

/* Modal Content */
.modalMdp-content {
	position: relative;
	color: #000000;
    background-color: #fff;
    margin: auto;
	font-size: 18px;
    padding: 30px;
    border: 2px solid #6C6B6B;
    width: 400px;
	
	
	text-align: center;
	overflow-y: auto;
	overflow: hidden; 
	margin-right:auto;	
	margin-left:auto;
}



.buttonMdp{
	cursor: pointer;
	  border:none;
	  font-size:0.9em;
	  width: 160px;
	  height: 50px;
	  background-color: white;
	  border-radius: 4px;
      box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7); 
	     margin: 20px;
	
	
}
.buttonMdp:hover{
	
	background-color: #ddd;
	
}