/*************************/
/* GENERAL               */
/*************************/
html, body {
	margin: 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('/public/admin_synopsis/media/img/logo_client.png');
	background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom right;
	z-index:120;
}


.login-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;
	padding-left:5px;
	padding-top:5px;
}

.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:25%;
	font-size:14pt;
	font-family:Univers Condensed Light;
	text-shadow:#333 1px -2px;
}

.toolbar a {
  position: relative;
}

.toolbar a[tooltip]:hover:after {
  content: attr(tooltip);
  padding: 4px 8px;
  color: #ffffff;
  position: absolute;
  left: -100px;
  top: 35px;
  white-space: nowrap;
  z-index: 20px;
  border-radius: 5px;
  box-shadow: 0px 0px 4px #222;
  background:transparent;
  border:2px solid #ffcc00;
}

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

.ico {
    text-align: center;
	width: 30px;
	height: 30px;
	border: 2px solid #ffffff;
	border-radius: 100%;
	margin-right: 7px; /*space between*/

}
.ico i {
	font-size: 20px;
    line-height: 28px;
	color: #ffffff;
}
.ico:hover  {
	border: 2px solid #ffcc00;
}
.ico:hover i {
	color:#ffcc00;
}

.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:310px;
	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% - 520px);
}

.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:200px;
	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:2px;
	margin-left:2px;
	border-radius:0px;
	line-height:0.9;
}

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

.btn-danger {
    font-size:12px;
}

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




/*************************/
/* APPLICATIONS         */
/*************************/

.bloc.messages.open .dropdown-menu {
	position:fixed;
	left:260px;
	top:60px;
	background:#1a1f25;
	border:1px solid #567288;
	height:50px;
	animation-duration: 0.3s;
	transform-origin: 100% 0 0;
    width: calc(100% - 20px);

}

.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;
    display:inline-block;
    border:none;
	border-right:1px solid #567288;
}

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

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

/****************************/
/*  Thomas                  */
/****************************/

.breadcrumb li a, .breadcrumb>li+li:before {
	color: #37474f;
}
.breadcrumb li strong,.breadcrumb>.active {
	color:white;
}

.site-menubar-unfold .site-menu .site-menu-item a,
.site-menubar-unfold .site-menu>.site-menu-item>a .site-menu-title {
	font-size: 12pt;
}

span.nav-label,.site-menu-title {
	padding-left:4px;
}
li.site-menu-item {
	padding-left: 17px;
}

.btn-outline.btn-default {
	background-color:white;
}


.selector-available h2, .selector-chosen h2 {
    font-size: 18px;
    padding: 5px;
}

a {
	color:#89bceb;
}

.btn-primary {
	background-color: #89bceb;
	border-color:#89bceb;
    margin-bottom:5px;
}
.btn-primary:hover {
	background-color: #99acfb;
	border-color:#99acfb;
}

ul.grp-messagelist {
    display: block;
    width: 100%;
    padding: 0;
    background-color: white;
}
li.grp-success {
    padding: 10px;
    background-color: #EEEEFF;
    font-size: 16px;
}

p.errornote {
    display: block;
    width: 100%;
    background-color: #FF5555;
    padding: 10px;
    color: white;
}


ul.errorlist {
    list-style-type: none;
    margin: 0 !important;
    padding: 0 !important;
    padding-left: 30px !important;
    color: #FF5555;
    font-weight: bold;
    font-size: 12px;
}
div.errornote {
    display: block;
    width: 100%;
    background-color: #FFDDDD;
    padding: 10px;
    color: #FF5555;
    margin-bottom:10px;
}
div.errornote.light {
    background-color: #FFDDDD;
    color: #FF2222;
}
div.errornote.light ul.errorlist {
    background-color: #FFDDDD;
    color: #FF5555;
}

.form-group.form-row.errors {
    background-color: #FFDDDD;
}


/****************************/
/*  ASRANGE                 */
/****************************/

.form-group.form-row .rangeUi {
	margin-top:20px;
}

.range-selector div
,.range-selector input {
	/*display:inline-block;*/
}

#range_filter_min
,#range_filter_max {
	width:70px;
}

/****************************/
/*  ERRORS                 */
/****************************/
.errorlist
,.errornote {
	color:#ff0000;
}


/****************************/
/*  MODULE LIST MENU        */
/****************************/
.modules-list > li a {
  padding-top: 22px;
  padding-bottom: 22px;
  line-height: 22px;
  text-transform: uppercase;
  color:white !important;
  font-family: Univers Condensed;
  font-size: 12pt;
}
.modules-list  > li a:hover {
  background-color: rgba(255,255,255,0.2);
}
.modules-list  > li a:focus {
  background:none;
}

/****************************/
/*  RESPONSIVE              */
/****************************/
@media screen and (max-width: 1600px) {
  .modules-list > li a {
    font-size: 15px;
    padding-right: 9px;
    padding-left: 9px;
  }
}
@media screen and (max-width: 1540px) {
  .modules-list > li a {
    font-size: 14px;
    padding-right: 5px;
    padding-left: 5px;
  } 
}   
@media screen and (max-width: 1440px) {
  .modules-list > li a {
    font-size: 11px;
    padding-right: 4px;
    padding-left: 4px;
  } 
  .page-header-actions {
      top:35%; 
  } 
} 

@media(max-width:1300px) {
	.modules-list {
		position: absolute;
		right: 204px;
		/* background-color: #343436; */
		top: 0px;
		width: 309px;
	}

	.modules-list:before {
		content: "\f0c9";
		color: white;
		text-align: center;
		width: 75px;
		font-size: 22px;
		background-color: #4c687e;
		margin: 0 auto;
		font-family: 'FontAwesome';
		line-height: 66px;
	}

	.modules-list:hover >li {
		display: block;
	}

    .modules-list > li a {
        font-size: 14px;
        padding-left:12px;
        padding-right:12px;
    }


	.modules-list >li {
		display: block;
		float: left;
		width: 44%;
		display: none;
		background-color: #333;
	}
}

@media screen and (max-width: 1400px) {
  .page-header-actions {
      top:35%;
  }
}
@media screen and (max-width: 1000px) {
  .page-header-actions .btn {
      color:transparent;
      width:40px;
      font-size:0;
  }
  .page-header-actions .btn i {
      color:#fff;
      font-size:12px;
  }
  .page-header-actions .btn-default i {
      color:#333;
      font-size:12px;
  }
}

.site-menubar-fold .site-menu-category {
    height:0px;
}
.site-menubar-fold .nav-label {
    display:none;
}
.site-menubar-fold .site-menu-item a {
    text-align:center;
}

/****************************/
/*  DATATABLES              */
/****************************/
.table.dataTable  {
    width:calc(100% - 20px);
}