/************************************************************************/
/************************************************************************/
/****************************** SITE ************************************/
/************************************************************************/
/************************************************************************/

/* Bannière de titre principal, page d'accueil */
.title-main{
	margin-top: -300px; 
}

/***********************************************/
/***************** MENU
/***********************************************/

/* Container du menu de navigation */
.nav-container{
	margin-top:37px;
	margin-left:150px;
}


/***********************************************/
/***************** CONTENT
/***********************************************/

/* Container des 2 blocs */
.main-container{
	width:315px;
	height:376px;

	margin-top:-200px;
	margin-left:-157.5px;
}

/* Bloc de fond, container des 2 blocs */
.background-main{
	width:335px;
	height:396px;

	margin-top:-210px;
	margin-left:-167.5px;
}

/* Header du premier bloc*/
.header-container{
	padding:35px 15px 10px 15px;
}

/* Zone gris clair du bloc de fond */
.background-main .header-background{
	height:280px;
}

/***************************/
/****** Section ( inputs ) du formulaire de login
/***************************/
.section-container{
	padding:25px 40px 10px 40px;
} 

/* Inputs */
.section-container section .nui-input{
	height:50px;
	font-size:17px;
	
	-webkit-box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4) inset;
	   -moz-box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4) inset;
	    -ms-box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4) inset;
	     -o-box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4) inset;
	        box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4) inset;
	
	padding:0 10px 0 60px;
	margin:5px 0 20px 0;
}

/* Inputs lors du focus */
.section-container section .nui-input:focus {
	-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(82, 168, 236, 0.7);
	   -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(82, 168, 236, 0.7);
	    -ms-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(82, 168, 236, 0.7);
	     -o-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(82, 168, 236, 0.7);
	        box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(82, 168, 236, 0.7);
}

/* Inputs invalide lors du focus */
.section-container section .invalid .nui-input:focus {
	-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(228, 70, 52, 0.7);
	   -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(228, 70, 52, 0.7);
	    -ms-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(228, 70, 52, 0.7);
	     -o-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(228, 70, 52, 0.7);
	        box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15) inset, 0px 0px 4px rgba(228, 70, 52, 0.7);
}

/* Texte dans le champ sur focus */
.section-container section input[placeholder]:focus {
    color: #333;
}

/* Texte dans le champ normal */
.section-container section input[placeholder] {
    color: #999;
}

/* Icone user */
.section-container section .icon-one{
	margin:13px 0 0 15px;
	font-size:30px;
}

/* Icone mdp */
.section-container section .icon-two{
	margin:10px 0 0 20px;
	font-size:40px;
}

/* Icones invalides */
.section-container section .invalid-field .ca-icon, .login-form .section-container section .invalid-field #identifiant{
	color:rgb(219, 108, 108);
}

/* Icones valides */
.section-container section .valid-field .ca-icon, .login-form .section-container section .valid-field #identifiant{
	color:rgb(62, 169, 223);
}

/***************************/
/****** Footer du formulaire de login
/***************************/
.footer-container, .footer-background{
	padding:30px 25px 35px 25px;
}

/* Bloc de footer du background */
.footer-background{
	height:50px;
}

/* Bouton du formulaire */
.footer-container .nui-button{
	height:40px;
	width:150px;
}