@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,700,900');
 body {
	/*background-color: #EDEDED;*/
	font-size: 14px;
    font-family: 'Raleway', sans-serif;
	}
td {
	border-top: 0px solid #ddd !important;	
	padding: 4px ;
}
.table2 > tbody > tr > td {
	padding: 3px 20px;
}
a {
    color: #000;
    text-decoration: none;
}
#logo img {
	width: 180px;
height: auto;
margin-right: 30px;
padding: 10px 0;
}
#logo {
	float: left;
}
/*
.table2 > tbody > tr > td, .table2 > tbody > tr > th, .table2 > tfoot > tr > td, .table2 > tfoot > tr > th, .table2 > thead > tr > td, .table2 > thead > tr > th {
    padding: 3px !important;
    line-height: 1.12857143;
    vertical-align: middle;
}*/

  	.table2{
		width:100%; 
		border-collapse:collapse; 
	}
	/* Define the default color for all the table rows */
	.table2 tr{
		background: #4f4b4c;
	}
	/* Define the hover highlight color for the table row */
  .table2 > tbody > tr:hover {
        background-color: #111;
		-o-transition:.3s;
		-ms-transition:.3s;
		-moz-transition:.3s;
		-webkit-transition:.3s;
		transition:.3s;
    }
/*.table2 > tbody > tr:hover { background: yellow; }*/
.toolbox-logo {
	position:fixed;
	top:25px;
	right:0px;color:#333;
	background-color:#fbb231;
	z-index: 1033; 
	padding:14px;
}
.form-control {
    display: block;
    width: 100%;
    height: 30px;
	border: 1px solid #ccc;
}
.form-controltwo {
    display: block;
    width: 100%;
    height: 30px;
	border: 1px solid #ccc;
	border-radius: 5px 0 0 5px;
	padding-left: 12px;
}
.fp-tableCell {
    /*display: block;
    padding-top: 150px;*/
    width: 100%;
    height: 100%;
}
ol li {
    padding: 5px;
    margin-left: 10px;
}
li {
	
  display: list-item;
  list-style-position: inside;
}
p {
	font-size: 14px;
}
label {
    font-weight: 500;
}
h1, h2, h3, h4 {
    font-family: 'Raleway', sans-serif;
	font-weight: 700;
	}	
h1 {
    font-size: 44px;
	color: #fff;
	font-weight: 700;
	margin-bottom: 12px;
}	
h2 {
		font-size: 34px;
	line-height: 38px;
	/**/
	
	padding-left: 0px;
	margin-left: 0;
	color: #fff;
	}	
.title-brand h2 {
		color: #555;
padding-left: 30px;
border-left: #fbb231 solid 3px;
margin: 25px 0 0 0;
float: left;
font-size: 28px;

	}

h3 {
	    font-size: 1.6em;
		margin-bottom: 10px;
	}
h4 {
		padding: 20px;
		background: rgba(0,0,0, 0.5);
		color: #fff;
		font-size: 24px;
		text-align: center;
	}
.h5, h5 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 14px;
	margin-top: 20px;
}
hr {
    border-top: 2px solid #ddd;
	margin-top: 7px;
	margin-bottom: 9px;
	}
.title-brand {
    float: left;
    height: 20px;
    padding: 0px;
    font-size: 18px;
    line-height: 20px;
}
.navbar-brand {
    float: left;
    height: 20px;
    padding: 7px;
    font-size: 18px;
    line-height: 20px;
}	
.navbar-default {
    background-color: #fff;
    border-color: #e7e7e7;
}
.row {
    margin-right: 0px;
    margin-left: -15px;
}
.navbar {
    min-height: 90px;
	}
.navbar-brand > img {
    width: 70%;
    height: auto;
	}
.progress-bar {
    float: left;
    width: 0;
    height: 100%;
	font-size: 20px;
	line-height: 50px;
	color: #fff;
	font-weight: 700;
	}
.progress {
    height: 50px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 7px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
}
.progress-bar-danger, .progress-bar-danger-one, .progress-bar-danger-two, .progress-bar-danger-three, .progress-bar-danger-four, .progress-bar-danger-five {
    background-color: #504c4d;
	width:5%;
}
.progress-bar-success, .progress-bar-success-one, .progress-bar-success-two, .progress-bar-success-three, .progress-bar-success-four, .progress-bar-success-five  {
    background-color: #fbb231;
	width:95%;
	text-align: left;
	padding-left: 30px;
}
.scrollspy-example {
    position: relative;
    height: 430px;
    margin-top: 10px;
    overflow: auto;
}
.panel-default {
    border-color: #4f4b4c;
	border-radius:0px;
}
.panel-body {
    padding: 15px 20px 10px 30px;
    min-height: 320px;
	background-color: #4f4b4c;
	border-radius:0px;
	border: 0px solid;
	}
.panel-body li {
	font-size: 18px;
line-height: 28px;

	
	
}
#menu {
		background-color: #fff;
		text-align: center;
		height: 50px;
	}
	#menu li {
		margin: 0 3px;
	}
	#menu li {
    background: #bcbcbc;
	}
	#menu li a {
    color: #fff;
}
	#menu li a:hover {
    color: #fff;
}	
	#menu li:hover {
    background-color: #555;
  -o-transition:.3s;
  -ms-transition:.3s;
  -moz-transition:.3s;
  -webkit-transition:.3s;
  transition:.3s;
}
#menu li a, #menu li.active a {
    padding: 9px 20px;
   /* display: block;*/
    font-weight: 700;
	}
#menu li.active {
    background: #fbb231;
    color: #fff;
}
ol, ul {
    list-style: inherit;
    margin-left: 5px;
}
.modal-dialog {
    width: 800px;
margin: 12% auto;
max-width: 100%;

}
.modal-header {
    padding: 20px;
    border-bottom: 0px solid #e5e5e5;
}
.modal-body {
    position: relative;
    padding: 0 30px;
}
.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 0px solid #e5e5e5;
}
.modal-content {
    border-radius: 0px;
}
.chart-text {
	float: right; 
	z-index: 9999999; 
	color: #000; 
	margin-right: 15px;
}
.btn-success {
    color: #fff;
    background-color: #000;
    border-color: #000;
}
.btn-success:hover, .btn-success:active, .btn-success:focus,  .btn-success:visited  {
    color: #fff;
    background-color: #222;
    border-color: #222;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
    color: #fff;
    background-color: #222;
    border-color: #222;
}
.btn-success:active:hover,
.btn-success.active:hover,
.open > .dropdown-toggle.btn-success:hover,
.btn-success:active:focus,
.btn-success.active:focus,
.open > .dropdown-toggle.btn-success:focus,
.btn-success:active.focus,
.btn-success.active.focus,
.open > .dropdown-toggle.btn-success.focus {
    color: #fff;
    background-color: #222;
    border-color: #222;
}

.btn-primary {
    color: #000;
    background-color: #fbb231;
	border-color: #fbb231;
}
.btn-primary:hover {
    color: #fff;
	background-color: #e29b1d;
	border-color: #c78614;
}
.btn-primary:active, .btn-primary:focus,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #e29b1d;
  border-color: #c78614;
}
.btn-primary:active:focus {
    color: #fff;
	background-color: #4f4b4c;
	border-color: #4f4b4c;
}
.modal-content {
    position: relative;
    background-color: #333;
	color: #fff;
}
.modal-title {
    line-height: 1.2;
    color: #fbb231;
	margin-bottom: 14px;
}
.fp-slidesNav.bottom {
    bottom: 90px;
}
.fp-controlArrow.fp-next {
right: -10px;
border-width: 0px;
border-color: transparent;
box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.45);
background: url("../img/right-arrow.png") bottom center no-repeat;
opacity: .7;
height: 60px;
width: 60px;
	  -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}
.fp-controlArrow.fp-prev {
    left: -10px;
    border-width: 0px;
border-color: transparent;
box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.45);
background: url("../img/left-arrow.png") bottom center no-repeat;
opacity: .7;
height: 60px;
width: 60px;
	  -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  /* ...and now for the proper property */
  transition:.5s;
}
.fp-controlArrow.fp-next:hover {
	opacity: 1;
	right: 0px;
	  -o-transition:.3s;
  -ms-transition:.3s;
  -moz-transition:.3s;
  -webkit-transition:.3s;
  transition:.3s;
}
.fp-controlArrow.fp-prev:hover {
	opacity: 1;
	left:0px;	
	  -o-transition:.3s;
  -ms-transition:.3s;
  -moz-transition:.3s;
  -webkit-transition:.3s;
  transition:.3s;
}
/*NO GUTTER */

.no-gutters .col {
  margin-right: 0;
  margin-left: 0;
    padding-right: 0;
    padding-left: 0;
}
.table, .table2 {
	/*font-weight: 700;*/
	font-size: 1.0em;	
	color:#222;
}

/* OL NUMBERS */

ol {
	counter-reset:li; /* Initiate a counter */
	margin-left:0; /* Remove the default left margin */
	padding-left:0; /* Remove the default left padding */
}
ol li {
	position:relative; /* Create a positioning context */
	margin: 0 0 0px 2em;
	padding: 2px 0px 0px 10px; /* Add some spacing around the content */
	list-style:none; /* Disable the normal item numbering */
	border-top:0px solid #666;
	/*background:#f6f6f6;*/
}
ol li:before {
	content:counter(li); /* Use the counter as content */
	counter-increment:li; /* Increment the counter by 1 */
	/* Position and style the number */
	position:absolute;
	top:-2px;
	left:-1.8em;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	width:1.8em;
	/* Some space between the number and the content in browsers that support
	   generated content but not positioning it (Camino 2 is one example) */
	margin-right:8px;
	padding:4px;
	border-top:0px solid #666;
	color:#fff;
	background:#fbb231;
	font-weight:bold;
	text-align:center;
}
li ol,
li ul {margin-top:6px;}
ol ol li:last-child {margin-bottom:0;}


/* RADIO BUTTONS */
/*input[type="radio"] {
  display: none;
}*/
label {
  display: inline-block;
  background-color: #d3d3d3;
  padding: 11px 10px;
font-size: 12px;
cursor: pointer;
	margin-bottom: 0px;
}
label:hover {
  background: #fbb231;
  color:#fff;
	
}
input[type="radio"]:checked + label {
		background: #ffc326;
		color:#fff;
}

/*RESPONSIVE */

@media screen and (max-width: 1100px) {
    .fp-tableCell {
    /*display: block;
    padding-top: 110px;*/
	}
	.scrollspy-example {
		height: 450px;
	}
}


@media screen and (max-width: 992px) {
    li {
		font-size: 12px;
	}
	label {
    padding: 9px 8px;
    font-size: 11px;
	}
	#menu li a, #menu li.active a {
    	padding: 9px 14px;
	}
	.fp-slidesNav.bottom {
   		bottom: 50px;
	}
	#menu {
    	height: 35px;
	}
	.navbar-brand > img {
    	width: 50%;
    	height: auto;
	}
	.navbar {
    	min-height: 65px;
	}
	.toolbox-logo {
		position:fixed;top:15px; right:0px;color:#333;background-color:#fbb231;z-index: 1033; padding:9px;
	}
	h2 {
    	font-size: 24px;
		line-height: 30px;
		/**/
		margin: 15px 0 0 0;
		
	}
	#logo img {
    width: 140px;
    height: auto;
    margin-right: 30px;
    padding: 5px 0;
}

	.title-brand h2 {
		color: #555;
		padding-left: 30px;
		border-left: #fbb231 solid 2px;
		font-size: 20px;
		margin: 20px 0 0 0;
	}
	h3 {
    	font-size: 1.4em;
    	margin-bottom: 10px;
	}
	.progress {
    	height: 40px;
    	margin-bottom: 10px;
	}
	.progress-bar {
	    font-size: 18px;
    	line-height: 40px;
	}
	hr {
    	border-top: 1px solid #ddd;
    	margin-top: 5px;
    	margin-bottom: 5px;
	}
	.scrollspy-example {
    	height: 360px;
	}
	.table2 > tbody > tr > td, .table2 > tbody > tr > th, .table2 > tfoot > tr > td, .table2 > tfoot > tr > th, .table2 > thead > tr > td, .table2 > thead > tr > th {
    	padding: 2px !important;
    	line-height: 0.92857143;
    	vertical-align: middle;
	}
	.panel-body {
    	padding: 10px 10px 5px 20px;
    	/*min-height: 280px;*/
	}
	#menu li {
    	margin: 0 1px;
	}
	h1 {
    font-size: 32px;
	}
	.h5, h5 {
    font-size: 14px;
	}
}
@media screen and (max-width: 768px) {

	.fp-slidesNav.bottom {
   	 	bottom: 50px;
	}
}

input[type=checkbox] { display: none; }
input[type=checkbox]:checked + label { 
	background:#333;
	color:#fff;
}



/*--- SIDEBAR  ---*/ /* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 99999; /* Stay on top */
    top: 0;
    right: 0;
    background-color: #4f4b4c; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}
.sidenav-inner {
	padding: 0 15px; 
}
.sidenav-inner p {
	color:#fff;
	padding: 6px 0;
}
.tt-suggestions p {
	color:#000;
	padding: 6px 0;
}
.sidenav hr {
    border-top: 1px solid #aaa;
    margin-top: 12px;
    margin-bottom: 12px;
}
.sidenav input {
	padding: 6px;	
}
.sidenav h4 {
		padding: 0px;
		background: transparent;
		color: #fff;
		font-size: 14px;
text-align: left;
margin-bottom: 19px;
	margin-top:10px;
	

	}
/* The navigation menu links */
.sidenav a {
    /*padding: 26px 0px 8px 32px;*/
    text-decoration: none;
    display: block;
    transition: 0.3s
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover, .offcanvas a:focus{
    color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 18px;
	padding-top:25px;
    margin-left: 50px;
	color: #ddd;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left .5s;
    padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
} 


/*--- INPUT TYPE---*/

.bs-example{
	font-family: sans-serif;
	position: relative;
	margin: 50px;
}
.typeahead, .tt-query, .tt-hint {
	border: 2px solid #CCCCCC;
	border-radius: 5px;
	font-size: 20px;
	height: 40px;
	line-height: 30px;
	outline: medium none;
	padding: 8px 0 8px 12px;
	width: 100%;
}
.typeahead {
	background-color: #FFFFFF;
}
.typeahead:focus {
	border: 2px solid #fbb231;
}
.tt-query {
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
}
.tt-hint {
	color: #999999;
}
.tt-dropdown-menu {
	background-color: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	margin-top: 12px;
	padding: 8px 0;
	width: 100%;
}
.tt-suggestion {
	font-size: 24px;
	line-height: 24px;
	padding: 3px 20px;
}
.tt-suggestion.tt-is-under-cursor {
	background-color: #fbb231;
	color: #FFFFFF;
}
.tt-suggestion p {
	margin: 0;
}

#getdata, #saveddata {
	 font-style: italic;
	
}

.fond{position:absolute;padding-top:0px;top:0;left:0; right:0;bottom:0;
 background-color:#00506b;}

.style_prevu_kit
{
    display:inline-block;
    border:0;
    width:60%;
    height:30px;
    position: relative;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1); 
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1); 
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1);
    transition: all 200ms ease-in;
    transform: scale(1);   

}
.style_prevu_kit:hover
{
    box-shadow: 0px 0px 50px #000000;
    z-index: 2;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.5);
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1.5);   
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1.5);
    transition: all 200ms ease-in;
    transform: scale(1.5);
}