/*************************/
/* GENERAL               */
/*************************/
html, body {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	height: 100%;
	background-color:#FFFFFF;
	font-family:Univers;
	color:#324759;
}
form{
	padding:0;
	margin:0;
}

@font-face {
	font-family: 'Univers';
	src: url('../font/Univers.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Univers Condensed';
	src: url('../font/Univers-Condensed.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	 
@font-face {
	font-family: 'Univers Condensed Light';
	src: url('../font/Univers-CondensedLight.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	 
@font-face {
	font-family: 'Univers Condensed Light Oblique';
	src: url('../font/Univers-CondensedLtOblique.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}		 
@font-face {
	font-family: 'Universal Condensed';
	src: url('../font/ufonts.com_universal-condensed.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
} 	 
@font-face {
	font-family: 'Roboto';
	src: url('../font/Roboto-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	 		 
@font-face {
	font-family: 'Consola';
	src: url('../font/consola.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
} 	 


/*************************/
/* LOGIN                 */
/*************************/
.login-container {
	height: 100%;
	/*background:url('../images/charte_mfi_2016/degrade_fond.png') repeat-x;*/
	background:linear-gradient(#343436 0%,#343436 30%,#fcfefd 100%);
}
.login-container .earth{
	bottom:0;
	position:absolute;
	width:100%;
	height:30%;
	background:url('../images/charte_mfi_2016/fond_terre.png');
	background-size: contain;                   
    background-repeat: no-repeat;
    background-position: bottom center;     
	z-index:80;
}


.login-container .rosas {
	top:0;
	left:0;
	position:absolute;
	width:100%;
	height:100%;
	background:url('../images/charte_mfi_2016/rosas.png');
	background-size: 44%;                   
    background-repeat: no-repeat;
    background-position: top left;    
	z-index:100;
}
/*
.login-container .rosas img {
	top:0;
	left:0;
	position:absolute;
	width:44%;
	z-index:80;
}
*/
.login-container .bleuet {
	top:0;
	right:0;
	position:absolute;
	width:100%;
	height:100%;
	background:url('../images/charte_mfi_2016/degrade_bleu.png');             
    background-repeat: repeat-y;
    background-position: top right;     
	z-index:100;
}

.login-container .slideshow {
	top:0;
	left:0;
	position:absolute;
	width:20%;
	max-width:20%;
	z-index:120;
}
.login-container .slideshow img {
	max-width:100%;
	height:auto;
}



.login-container .logo-mfi {
	bottom:5%;
	left:5%;
	position:absolute;
	width:25%;
	height:10%;
	background:url('../images/charte_mfi_2016/logo_mfi.png');  
	background-size: contain;                   
    background-repeat: no-repeat;
    background-position: bottom left;     
	z-index:120;
}



.login-container .logo-client {
	bottom:5%;
	right:5%;
	position:absolute;
	width:25%;
	height:10%;
	background:url('../images/charte_mfi_2016/logo_geode_grande.png');  
	background-size: contain;                   
    background-repeat: no-repeat;
    background-position: bottom right;     
	z-index:120;
}


.login-form form {
	position:absolute;
	width:33%;
	top:45%;
	left:33%;
	right:33%;
	z-index:100;
}

.login-form p {
    color: white;
    background-color: #FF7777;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
}

.login-form form label {
	color:#fefefe;
	font-family:Univers Condensed Light;
	font-size:12pt;
	margin:5px;
}

.login-form form input {
	border:2px solid #fff;
	background:#d2d3d5;
	color:#333;
	width:100%;
	height:28px;
	margin:5px;
	font-family:Univers Condensed Light;
	font-size:12pt;
	margin-bottom:15px;
}

.login-form form .submit-box {
	text-align:center;
}

.login-form form button.connexion {
	border:2px solid #fff;
	background:#4c687e;
	color:#fff;
	height:30px;
	margin:5px;
	margin-top:20px;
	width:40%;
	font-family:Univers Condensed;
	font-size:14pt;
	cursor:pointer;
}

.login-form form button.connexion:hover {
	background:#ffcc00;
}

.login-form form a.forgotten {
	margin:5px;
	color:#4c687e;
	font-family:Univers Condensed Light Oblique;
	font-size:10pt;
	text-decoration:none;
}

.login-form form a.forgotten:hover {
	text-decoration:underline;
}

.title-box {
	position:absolute;
	width:60%;
	height:60%;
	top:0;
	left:20%;
	z-index:100;
	background:url('../images/charte_mfi_2016/titre.png');  
	background-size: contain;                 
    background-repeat: no-repeat;
    background-position: center center;
	color:#fff;
}

.title-product {
	position:absolute;
	top:44%;
	right:40%;
	font-size:40pt;
	font-family:Universal Condensed;
	text-shadow:#000 1px -2px 5px;
}

.title-version {
	position:absolute;
	top:60%;
	right:15%;
	z-index:100;
	font-size:14pt;
	font-family:Univers Condensed Light Oblique;
	text-shadow:#333 1px -2px;
}
.title-description {
	position:absolute;
	top:60%;
	left:1%;
	font-size:14pt;
	font-family:Univers Condensed Light;
	text-shadow:#333 1px -2px;
}


.toolbar {
	position:absolute;
	top:20px;
	right:50px;
	width:100%;
	height:50px;
	z-index:100;
}
.toolbar .ico {
	float:right;
}

.ico {
	width:25px;
	height:25px;
	margin:4px;
	cursor:pointer;
}

.ico.config {
	background:url('../images/charte_mfi_2016/picto_engrenage_blanc.png'); 
	background-size: contain;
}
.ico.config:hover {
	background:url('../images/charte_mfi_2016/picto_engrenage_jaune.png');  
	background-size: contain;      
}
.ico.info {
	background:url('../images/charte_mfi_2016/picto_info_blanc.png'); 
	background-size: contain;    
}
.ico.info:hover {
	background:url('../images/charte_mfi_2016/picto_info_jaune.png'); 
	background-size: contain;
}
.description {
	position:absolute;
	top:50px;
	right:18px;
	width:320px;
	height:140px;
	background:url('../images/charte_mfi_2016/ligne_texte_info_jaune.png');
    background-repeat: no-repeat;
	background-size: contain;
	z-index:100;
	color:#fff;
	font-size:9pt;
	font-family:Roboto;
	padding-right:30px;
	text-align: justify;
    text-justify: inter-word;
}


/*************************/
/* HEADER               */
/*************************/
.page-content {
	padding:0px;
	padding-top:75px;
}

.navbar-header {
	background-color:#333;
	margin:0;
	padding:0;
}

.navbar-brand {
	margin:0;
	padding:0;
    width: 100%;
}

.navbar-container {
	background:linear-gradient(to right, #343436 0%,#4c687e 30%,#333333 100%);
}

.site-navbar {
    background-color: #333;
}

.navbar-brand {
}
.navbar-brand .logo-mfi {
    width: 150px;
    height: 50px;
	margin:5px;
	margin-left:20px;
	
}

.navbar-container .titlebar {
	background:url('../images/charte_mfi_2016/fond_titre_bis.png');      
    background-repeat: no-repeat;
    background-position: top left;
	width:300px;
	height:66px;
	padding-top:10px;
	padding-left:130px;
	margin-left:-100px;
}

.navbar-container .product-title {
	font-size:20pt;
	font-family:Univers Condensed Light;
	color:#fff;
}

.navbar-container .version {
	font-size:14pt;
	font-family:Univers Condensed Light Oblique;
	color:#fff;
}

.navbar-container .bloc {
	background:url('../images/charte_mfi_2016/ligne_blanc.png');      
    background-repeat: no-repeat;
    background-position: top left;
	font-size:9pt;
	font-family:Consola;
	color:#fff;
	width:150px;
	height:66px;
	padding-right:40px;
	padding-top:12px;
	line-height:16px;
}

.navbar-container .metabloc {
	padding-left:20px;
	position: relative;
	height:66px;
	width:calc(100% - 600px);
}

.navbar-container .bloc.server {
	padding-top:10px;
}

.navbar-container .bloc.datehour {
	text-align:center;
}

.navbar-container .profil {
	background:url('../images/charte_mfi_2016/ligne_admin_blanc.png');      
    background-repeat: no-repeat;
    background-position: top left;
	font-size:9pt;
	font-family:Univers Condensed Light;
	color:#fff;
	width:220px;
	height:66px;
	line-height:1.3;
}

.navbar-container .profil .quidam {
	padding-top:2px;
	padding-left:50px;
	background:url('../images/charte_mfi_2016/picto_admin_blanc.png') no-repeat;   
}

.navbar-container .logo-client {
	margin:10px;
	margin-right:10px;
}

.btn-mini {
	color:#fff;
	padding:2px;
	padding-left:10px;
	padding-right:10px;
	font-size:9pt;
	font-family:Univers Condensed;
	background:#4c687e;
	margin-top:2px;
	margin-right:5px;
	margin-left:5px;
	border-radius:0px;
	line-height:0.9;
}

.btn-mini:hover {
	color:#fff;
	background:#ffcc00;
}

.navbar-toolbar > li > a.flag {
	padding:5px;
	margin-top:22px;
	margin-right:5px;
	cursor:pointer;
}

/*************************/
/* MENU               */
/*************************/
.site-menubar
,.site-menubar * {
	color:#fff;
}
	
.site-menubar 
,.site-menu .site-menu-sub .site-menu-item 
,.site-menu > .site-menu-item.open {
	background:linear-gradient(to right, #1a1f25 0%,#567288 100%);
}
.site-menubar-unfold  .site-menu-category
,.site-menu-category {
	font-family:Univers Condensed;
	color:#fff;
	background:#4c687e;
	margin-left:10px;
	margin-right:10px;
	font-size:14pt;
}

ul.site-menu  li.site-menu-item.has-sub > a span.site-menu-title {
	border-bottom:1px solid #fff;
	width:100%;
}
ul.site-menu  li.site-menu-item.has-sub.open > a span.site-menu-arrow
,ul.site-menu  li.site-menu-item.has-sub.open > a span.site-menu-title 
,ul.site-menu  li.site-menu-item.has-sub a.active span
 {
	color:#ffcc00;
}

.site-menubar-unfold .site-menu  .site-menu-item  a {
  font-family:Univers Condensed Light;
  line-height:2;
  font-weight:300;
  font-size:10pt;
}


.site-menubar-body {
    /*height: calc(100% - 50px);*/
	height:100%;
}
.site-menubar-footer {
    height: 50px;
	background:#1a1f25;
}

.badge-info {
	background:#ffcc00;
	color:#ff0000;
}

.badge-success {
	background:#567288;
}

/*************************/
/* MESSAGES               */
/*************************/
li.dropdown {
	top:12px;
}
li.dropdown a {
	padding-left:30px;
}
li.dropdown .badge {
	right: 5px;
}
.open .dropdown-menu {
	position:absolute;
	left:260px;
	top:auto;
	bottom:-10px;
	background:#1a1f25;
	border:1px solid #567288;
}

.open .dropdown-menu ul li {
	padding:5px;
	margin:10px;
	border-bottom:1px solid #567288;
}

.open .dropdown-menu ul li:hover {
	background:#324759;
	background-image: url("../images/picto/fleche-orange.gif");
	background-position: 8px 8px;
	background-repeat: no-repeat;
	margin: 0;
	padding: 0 10px 0 18px;
}


/* upper version */
.navbar-container .bloc.messages a {
	margin:0;
	padding:0;
	color:#fff;
}
.navbar-container .bloc.messages a:hover 
,.navbar-container .bloc.messages a:focus  {
	margin:0;
	padding:0;
	color:#ffcc00;
	background:none;
}

.bloc.messages.open .dropdown-menu {
	position:absolute;
	left:0px;
	top:50px;
	background:#1a1f25;
	border:1px solid #567288;
	height:270px;
	animation-duration: 0.3s;
	transform-origin: 100% 0 0;
}

.bloc.messages.open .dropdown-menu  ul {
	margin:5px;
	padding:5px;
}

.bloc.messages.open .dropdown-menu  ul li {
	background-position: 8px 12px;
	list-style:none;
	padding: 8px;
	margin: 0;
}

.bloc.messages.open .dropdown-menu ul li  a{
	padding-left:20px;
}
.bloc.messages.open .dropdown-menu ul li:hover {
	background:#324759;
	background-image: url("../images/picto/fleche-orange.gif");
	background-position: 8px 12px;
	background-repeat: no-repeat;
	margin: 0;
	padding: 8px;
}
.bloc.messages.open .dropdown-menu ul li:hover  a{
	padding-left:20px;
}

/*************************/
/* CONTENT PAGE         */
/*************************/
.page {
	min-height:100%;
	background:#7c9cb5 url("../images/charte_mfi_2016/rosace_coupee_transparent.png") no-repeat bottom center;
}

.page-content {
	/*padding-top:66px;*/
	padding-top:70px;
	padding-left:10px;
	padding-right:10px;
}


#fondPop span {
	color:#324759 !important;
}