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;
}


.LA1 {
 display:flex;
 align-items: center;
 justify-content: center;
 position:relative;
 font-family: Arial,Ubuntu,sans-serif;
 font-size: 22px;
 text-align: center;
 margin-bottom:25px;
 width:400px;
 height:25px;
 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;
}


.global0{
padding: 0px;
border: 0px solid #c3c3c3;
height:100%;
width:100%;
display: flex;
justify-content: center;
align-items: center;
}

	
.global1{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width:400px;
height:600px;
border: 0px solid #c3c3c3;
}

.Cadre3 {
display:flex;
position:relative;
align-items: center;
justify-content: center;
flex-direction: column;
width: 400px;
border-width:1px;
border-style:solid;
border-color:#c3c3c3;
background-color: #FFFFFF;
height:265px;
border-radius: 10px;
z-index: 1;
}
	
.Cadre2A {
display:flex;
align-items: center;
justify-content: center;
margin-bottom:20px;
position:relative;
top:0px;
width: 400px;
height: 50px;
background-color: #FFEBE8;
border-width:1px;
border-style:solid;
border-color:#FF0000;
border-radius: 6px;
}	
		
.login{
display:flex;
z-index: 2;
width:320px;
height: 44px;
border: 1px solid #c3c3c3;
border-radius: 4px;
 }	
	
.login:focus {
border-color: #0087be;
outline: 0;
}	

.passe{
display:flex;
margin-bottom:20px;
margin-top:10px;
border-radius: 4px 0px 0px 4px;
border: 1px solid #c3c3c3;
width:280px;
height: 45px;
}	

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

.mask{
display:flex;
align-items: center;
justify-content: center;
margin-top:10px;
margin-left:1px;
width:40px;
height: 45px;
border: 1px solid #c3c3c3;
border-left:0px;
border-radius: 0px 4px 4px 0px;
background-color: #FFFFFF;
color:#959595;
 }
 
.mask:hover{
color:#0087be;
border: 1px solid #0087be;
}		

.bouton {
display:flex;
align-items: center;
justify-content: center;
z-index: 2;
border-radius: 5px;
border-width:1px;
border-style:solid;
width:320px;
height:45px;
background:#3488F1;
font-family:Arial;
color:#FFFFFF;
}

.bouton:hover {
border-width:1px;
border-style:solid;
border-color:#3488F1; 
background:#FFFFFF;
color:#3488F1;
}

.perdu {
display:flex;
position:relative;
width:400px;
border: 0px solid #c3c3c3;
align-items: center;
justify-content: center;
}

.patient {
display:flex;
position:relative;
width:400px;
border: 0px solid #c3c3c3;
align-items: center;
justify-content: center;
}

.LA4A { 
text-decoration:none; 
}

.LA4B {
display:flex;
position:relative;
font-family: Ubuntu,sans-serif;
font-weight: bold;
font-size: 13px;
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; 
text-decoration:none;
}

.LA5A { 
text-decoration:none; 
}

.LA5B {
display:flex;
align-items: center;
justify-content: center;
position:relative;
font-family: Ubuntu,sans-serif;
text-decoration:none; 
font-weight: bold;
font-size: 13px;
border-width:1px;
border-style:solid;
border-color:#FFB200;
height:50px;
width:250px;
padding:10px;
top:0px;
color:#FFB200;
text-decoration:none; 
}

.LA5B:Hover {
border-color:#F1F1F1;
color:#F1F1F1; 
text-decoration:none;
}