
html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
    padding: 0;
	
	 background-image: url("../images/fond.jpg");

  /* Full height */
  height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
#page-table {
    height: 100%;
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}
#page-td {
    height: 100%;
    padding: 0;
    vertical-align: middle;
}
div#global {
    width: 500px;
    margin: 20px auto;
    text-align: center;
}


.texte1
{ 
	position:absolute;
	 font-family: Arial,Ubuntu,sans-serif;
 font-weight: bold;
 font-size: 30px;
 /* centrage vertical */
 transform: translateY(-50%);
	top: 50%; 
 /*-------------------*/ 	
	color:#FFFFFF
}

.texte2
{ 
	position:absolute;
	/* centrage vertical et horizontal */
	transform: translateY(-50%);
	top: 50%; left: 50%; 
	transform: translate(-50%, -50%); 
	/*-------------------------------- */
	 font-family: Arial,Ubuntu,sans-serif;
	
	font-size: 15px;
	color:#FFFFFF;
}

.texte2:Hover {
 color:#00AADC; 
}

.texte2A { 
text-decoration:none; 
}

.LA1 {
 position:relative;
 top:0px;
 font-family: Arial,Ubuntu,sans-serif;
 font-size: 22px;
 text-align: center;
 margin-left: auto;
 margin-right: auto;
 text-align:center; /* centrage horizontal */
 width:400px;
 height:25px;
 padding:10px;
 border:0px solid #fff;
 vertical-align:middle;
 color:#FFFFFF;
}

.Message1 {
 position:relative;
 font-family: Ubuntu,Arial,sans-serif;
 font-size: 12px;
 margin-left:10px;
 text-align:left; /* a gauche */
 color:#FF0000;
}

.LA7 {
 position:relative;
 font-family: Ubuntu,Arial,sans-serif;
 font-size: 12px;
 margin-left:10px;
 text-align:left; /* a gauche */
 color:#3A8415;
}

.Cadre1 {
 position:relative;
 top:0px;
 margin-left:auto;
 margin-right:auto;
 width: 400px;
 padding: 0px;
 height:550px;
 z-index: 1;
  border-width:0px;
 border-style:solid;
 border-color:#c3c3c3;
 
    }
	
.Cadre2 {

 width: 400px;
 padding: 0px;
 margin-bottom:10px;
 border-width:1px;
 border-style:solid;
 border-color:#FF0000;
 margin-left:auto;
 margin-right:auto;
 background-color: #FFEBE8;
 height:50px;
 border-radius: 6px;
 display: table-cell; 
 vertical-align: middle;
 }
 
 .Cadre2B {
	position:relative;
	top:0px;
    width: 360px;
    background-color: #FFEBE8;
    border-width:1px;
    border-style:solid;
    border-color:#FF0000;
	margin-left:auto;
    margin-right:auto;
	margin-bottom:10px;
    padding: 20px;
	border-radius: 6px;
}	
	
	


.Cadre3 {
 position:relative;
 top:0px;
 margin-left:auto;
 margin-right:auto;
 width: 400px;
 border-width:1px;
 border-style:solid;
 border-color:#c3c3c3;
 background-color: #FFFFFF;
 height:210px;
 border-radius: 10px;
 z-index: 1;
    }
    
.Cadre4 {
 position:relative;
 top:0px;
 margin-left:auto;
 margin-right:auto;
 width: 400px;
 padding: 0px;
 height:100px;
 z-index: 1;
    }
	
.Cadre2A {
 position:relative;
 top:60px;
 width: 400px;
 padding: 0px;
 border-width:1px;
 border-style:solid;
 border-color:#FF0000;
 background-color: #FFEBE8;
 height:50px;
 border-radius: 6px;
 display: table-cell; 
 vertical-align: middle;
    }

	
	
.Mail{
 position:relative;
 top:50px;
 z-index: 2;
 width:320px;
 height: 44px;
  margin-left:auto;
 margin-right:auto;
 border: 1px solid #c3c3c3;
 border-radius: 4px;
    }	
	

.Mail:focus {
 border-color: #0087be;
 outline: 0;
}

.Passe:focus {
 border-radius: 4px;
 border-color: #0087be;
 outline: 0;
}

.Bouton {
 position:relative;
 top:70px;

 border-radius: 4px;
  border-width:1px;
 border-style:solid;
 width:325px;
 height:44px;
 background:#348EFF;
 margin-left:auto;
 margin-right:auto;
 font-weight: bold;
 color:#FFFFFF;
}

.Bouton:hover {
 border-width:1px;
 border-style:solid;
 border-color:#348EFF; 
 background:#FFFFFF;
 color:#348EFF;
}

.LA4B {
 position:relative;
font-family: Ubuntu,sans-serif;
 font-weight: bold;
 font-size: 13px;
 margin-left:auto;
 margin-right:auto;
top:0px;
display: table-cell; /* comportement visuel de cellule */
 padding:10px;
 height:30px;
   color:#FFFFFF;

vertical-align: middle;
}

.LA4B:Hover {
 border-color:#FF0000;
 color:#FFB200; 
}

.LA4A { 
text-decoration:none; 
}


.LA5B {
 position:relative;
 font-family: Ubuntu,sans-serif;
 text-decoration:none; 
 font-weight: bold;
 font-size: 13px;
 display: table-cell; /* comportement visuel de cellule */
 vertical-align: middle;
 border-width:1px;
 border-style:solid;
 border-color:#FFB200;
 height:25px;
 width:250px;
 padding:10px;
 top:0px;
 color:#FFB200;
 text-decoration:none; 
}

.LA5B:Hover {
 border-color:#F1F1F1;
 color:#0087be; 
}

.LA5A { 
text-decoration:none; 
}

 .LA6 {
 position:relative;
 top:0px;
 font-family: Ubuntu,Arial,sans-serif;
 font-size: 12px;
 margin-left:10px;
 text-align:left; /* a gauche */
 color:#FF0000;
}
  
.box {
     display: table;
}
 

  
.Message2 {
margin-left: 50px;
display: table-cell;
vertical-align: middle;
font-family: Ubuntu,Arial,sans-serif;
font-size: 12px;
color:#3A8415;
}