html { height: 100%; }
body { height: 100%; background-color: #FFFFFF; margin: 0px; padding: 0px; font-family: Arial; background-image: url('logoOnebase.png'); background-repeat: no-repeat; background-attachment: fixed; background-position: bottom right; }

#footer              { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; height: 50px; position: absolute; font-weight: normal; font-size: 14px; padding: 0px 0px 0px 0px; color: #FFFFFF; background-color: #00313c; bottom: 0%; }
#footer .version_num { background-image: url('../onebase_ico.png'); background-repeat: no-repeat; background-position: center left; padding: 0px 0px 0px 16px; margin-left: 10px; }
#footer .url_app     { margin-right: 10px; }
#footer .tel         { margin-left: 10px; }
#footer .mail        { margin-left: 15px; }
#footer .mail a      { }
#footer a            { color: #FFFFFF; text-decoration: none; }
#footer a:hover      { text-decoration: underline; }

#page_login    { height: 100%; width: 100%; }
#outer         { height: 75%; width: 80%; display: table; vertical-align: middle; }
#container     { text-align: center; position: relative; vertical-align: middle; display: table-cell; height: 160px; }
#login_box     { width: 350px; background: #c5e86c; min-height: 160px; padding: 25px; margin-left: auto; margin-right: auto; border-radius: 10px; }

#login_box #logo         { width: 100%; text-align: left; margin-bottom: 8px; }
#login_box #logo img     { padding: 5px; background-color: #c8db82; background: rgba(255,255,255, 0.5); border-radius: 5px; max-width: 100%; max-height: 70px; }
#login_box #formulaire   { position: relative; margin-top: 30px; }
#login_box #formulaire INPUT { font-size: 14px; margin-bottom: 4px; display: block; }
#login_box #messages     { float: right; height: 20px; margin-bottom: 3px; }
#login_box #mdp_perdu    { color:#000000; padding: 3px 0px 3px 0px; text-align: right; float: right; font-size: 10px; text-decoration: none; }
#login_box #explication  { text-align: left; font-size: 12px; }
#login_box #explication div { margin: 10px; }
#login_box #go           { background-color: #FFFFFF; color: #00313c; background-image: url('../onebase_ico.png'); background-repeat: no-repeat; background-position: 8px; border: 1px solid transparent; padding: 6px 15px 6px 24px; border-radius: 5px; cursor: pointer; }
#login_box #go:hover     { background-color: #DCE7E7; border: 1px solid #00313c; box-shadow: 3px 2px 5px #585858; }
.msg_erreur              { color: red; padding: 3px 20px 3px 20px; background-color: rgba(255,255,255, 0.3); }
.msg_debug               { font-family: Courrier; font-size: 9px; color: #000000; font-style: italic; text-align: left; }

.bouton_actualiser       { width: 30px; height: 30px; display: block; float: left; background-repeat: No-repeat; background-position: center; background-image: url('./../Icones/iconRefresh.png'); border: none; border-radius: 8px; }
.bouton_actualiser:hover { background-color: #DCE7E7; }

#bienvenue_box              { width: 70%; min-height: 160px; padding: 25px; margin-left: auto; margin-right: auto; border-radius: 10px; background-color: #a8c737; background: linear-gradient(to bottom, rgba(215,237,136,0.5) 0%, rgba(0,0,0,0.3) 100%); }
#bienvenue_box #bienvenue   { font-size: 16px; font-weight: bold; text-align: left; color: #000000; }
#bienvenue_box .nom_edition { font-size: 12px; font-weight: bold; text-align: left; color: #000000; }
#message_role               { font-size: 16px; font-weight: bold; text-align: left; color: #000000; margin-top: 10px; }

.spacer { clear: both; }

/*********************************************************************************************************/
/* Styles pour affichage d'une simulation de mail                                                        */
/*********************************************************************************************************/
.mail_simulation          { display: block; background-color: #E3EFFF; color: #000000; padding: 5px 5px 5px 5px; font-style: normal; font-size: 12px; text-align: left; }
.mail_simulation .libelle { width: 36px; float: left; }
.mail_simulation .contenu { display: block; background-color: #FFFFFF; border: 1px solid #6593CF; color: #000000; padding: 5px; }

/* Modification de l'apparence du site suivant le mode de site spécifique */
.mode_site_formation #page_login			{ background-image: url('./../Icones/bgModeFormationLight.png'); background-repeat: repeat; }
.mode_site_developpement #page_login	{ background-image: url('./../Icones/bgModeDeveloppement.png'); background-repeat: repeat; }

.form_password 												 { position: relative; display: block; width: fit-content; }
.form_password a 		 									 { position: absolute; top: 0px; right: 5px; width: 16px; height: 100%; cursor: pointer; }
.form_password a.icone_voir 	 			 	 { background: url('./../Icones/iconEye.png') center no-repeat; }
.form_password a.icone_cacher 	 			 { background: url('./../Icones/iconEyeSlash.png') center no-repeat; }
input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear 	 { display: none; }