.odd {
	background: #F2F5F7;
}

.even {
	background: white;
}

/* COSTUM CODE */



.bgcolor-grey{
	background-color:#808080;
}

.label-inverse{
	background-color:black;
}
/*
.table {
	border: none;
}
*/
.bg-black {
	background-color: #101010;
}

.bg-grey {
	background-color: #808080;
}

.bg-primary{
/*	background-color: #2D7FF3;*/
	background-color: #0c4f86;
}

.bg-wh{
	background-color:white;
}

.bg-blgrey{
	background-color:#F2F5F7;
}

.bg-lightblue{
	background-color: #dfe8eb;
}

.txt-danger {
	color: #d9534f;
}

.txt-orange{
    color:#f0ad4e;
}

.txt-warning {
    color: #ffa805;
}


.txt-success {
	color: #50D050;
}

.txt-primary {
	color: #428bca;
}

.txt-gris {
	color: #808080;
}

.txt-grey {
	color: #798296;
}

.txt-black{
	color:black;
}

.txt-green{
	color:green;
}

.txt-white{
	color:white;
}

.txt-verdana{
	 face:"Verdana";
}

.txt-bluedark {
	color: #344472;
}

.navbar-primary{
	background-color: #2D7FF3;
}

.navbar-bluedark{
	background-color: #222233;
}

.progress-bar-grey {
	background-color: #808080;
}

.progress-bar-success {
	background-color: #50D050;
}

.panel {
	margin-bottom: 20px;
	background-color: #dfe8eb;
	border: 1px solid transparent;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

.panel-heading{
	padding: 5px 10px;
}

.panel-body{
	padding: 0px;
}

section {
  padding-top: 0px;
}

.crop { 
  overflow:hidden; 
  white-space:nowrap; 
  text-overflow:ellipsis; 
  width:300px; 
}

.crop100 { 
  overflow:hidden; 
  white-space:nowrap; 
  text-overflow:ellipsis; 
  width:100px; 
}

.crop200 { 
  overflow:hidden; 
  white-space:nowrap; 
  text-overflow:ellipsis; 
  width:200px; 
}

.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  color: #428bca;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  background-color: #ffffff;
  border-radius: 10px;
}

.badge:empty {
  display: none;
}

.btn .badge {
  position: relative;
  top: -1px;
}

a.badge:hover,
a.badge:focus {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

a.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
  color: #428bca;
  background-color: #ffffff;
}


.table > thead > tr > th,
.table > thead > tr > td {
  padding: 5px 10px;
}

.well-sm {
  padding: 1px;
  border-radius: 3px;
}

.red{
	color:red;
}

.gi-x1{
	font-size: 1em;
}

.gi-x1-5{
	font-size: 1.5em;
}

.gi-x2{
	font-size: 2em;
}

.gi-x3{
	font-size: 3em;
}

.gi-x4{
	font-size: 4em;
}

.gi-x5{
	font-size: 5em;
}

.gi-x6{
	font-size: 6em;
}

.gi-x7{
	font-size: 7em;
}

.gi-x8{
	font-size: 8em;
}

.gi-x9{
	font-size: 9em;
}

.footer-bluedark {
	margin-top:50px; 
	padding: 20px;
	background-color: #344472;
}

.footer-blueblack{
	margin-top:0; 
	padding: 10px;
	background-color: #100e26;
}

p.uppercase {
    text-transform: uppercase;
}

p.lowercase {
    text-transform: lowercase;
}

p.capitalize {
    text-transform: capitalize;
}

svg { position: absolute !important }

/*CSS FOR HIGHMAPS*/
/*@import 'https://code.highcharts.com/css/highcharts.css';*/

#logo{margin:0;}
	
#logo img
{
	margin-top:10px;
	margin-bottom:10px;
	padding:0px;
	height: 30px;
	width: auto;
}

#container {
    height: 500px; 
    min-width: 310px; 
    max-width: 800px; 
    margin: 0 auto;
}

.highcharts-tooltip>span {
    background: rgba(255,255,255,0.85);
    border: 1px solid silver;
    border-radius: 3px;
    box-shadow: 1px 1px 2px #888;
    padding: 8px;
}

.loading {
    margin-top: 10em;
    text-align: center;
    color: gray;
}

.f32 .flag {
    vertical-align: middle !important;
}
/*END CSS FOR HIGHMAPS*/


.search-box {
  width: 250px;
  cursor: pointer;
  margin: 0 auto;
  border: .5px solid rgb(232, 238, 241);
  border-radius: 28px;
  color: rgb(119, 126, 128);
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
  letter-spacing: 1px;
  background: #fff;
  height: 30px;
  margin-top: 4px;
  
}

.glyphicon .glyphicon-search {margin-right:10px;}

.search-icon {
  width: 250px;
  padding: 5px;
  border-radius: 24px;
  float: right;
  
}
.inner-addon { 
  position: relative; 
}
/* style icon */
.inner-addon .glyphicon {
  position: absolute;
  padding: 13px;
  pointer-events: none;
  margin-right: 5px;
  margin-top:5px;
}
.left-addon .glyphicon  { left:  0px;}
.right-addon .glyphicon { right: 0px;}
.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }



 /*
inspired from http://codepen.io/Rowno/pen/Afykb
& https://jsfiddle.net/q0rgL8ws/
*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
    overflow:hidden;
}
.item.active img {
    transition: transform 5000ms linear 0s;
    /* This should be based on your carousel setting. For bs, it should be 5second*/
    transform: scale(1.05, 1.05);
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

/*
WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
now override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}


/*SPINNER*/
#loader {
    bottom: 0;
    height: 175px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 175px;
}
#loader {
    bottom: 0;
    height: 175px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 175px;
}
#loader .dot {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 87.5px;
}
#loader .dot::before {
    border-radius: 100%;
    content: "";
    height: 87.5px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(0);
    width: 87.5px;
}
#loader .dot:nth-child(7n+1) {
    transform: rotate(45deg);
}
#loader .dot:nth-child(7n+1)::before {
    animation: 0.8s linear 0.1s normal none infinite running load;
    background: #00ff80 none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+2) {
    transform: rotate(90deg);
}
#loader .dot:nth-child(7n+2)::before {
    animation: 0.8s linear 0.2s normal none infinite running load;
    background: #00ffea none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+3) {
    transform: rotate(135deg);
}
#loader .dot:nth-child(7n+3)::before {
    animation: 0.8s linear 0.3s normal none infinite running load;
    background: #00aaff none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+4) {
    transform: rotate(180deg);
}
#loader .dot:nth-child(7n+4)::before {
    animation: 0.8s linear 0.4s normal none infinite running load;
    background: #0040ff none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+5) {
    transform: rotate(225deg);
}
#loader .dot:nth-child(7n+5)::before {
    animation: 0.8s linear 0.5s normal none infinite running load;
    background: #2a00ff none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+6) {
    transform: rotate(270deg);
}
#loader .dot:nth-child(7n+6)::before {
    animation: 0.8s linear 0.6s normal none infinite running load;
    background: #9500ff none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+7) {
    transform: rotate(315deg);
}
#loader .dot:nth-child(7n+7)::before {
    animation: 0.8s linear 0.7s normal none infinite running load;
    background: magenta none repeat scroll 0 0;
}
#loader .dot:nth-child(7n+8) {
    transform: rotate(360deg);
}
#loader .dot:nth-child(7n+8)::before {
    animation: 0.8s linear 0.8s normal none infinite running load;
    background: #ff0095 none repeat scroll 0 0;
}
#loader .lading {
    background-image: url("resource:/images/loading.gif");
    background-position: 50% 50%;
    background-repeat: no-repeat;
    bottom: -40px;
    height: 20px;
    left: 0;
    position: absolute;
    right: 0;
    width: 180px;
}
@keyframes load {
100% {
    opacity: 0;
    transform: scale(1);
}
}
@keyframes load {
100% {
    opacity: 0;
    transform: scale(1);
}
}

#navBar li a .txt-white{color: white;}
#navBar li a:hover .txt-white{color: #222233;}

#navBar li a:hover {background:none;}

#navBar li{
  display : in-line;
}
#navBar li:first-child{
  border-left:none;
}

#content{padding:16px;}
.sticky{
	position:fixed;
	top:0;
	width:100%;
}

.sticky + .container{
	padding-top:120px;
}


.navbar-green{
	background: #569f39;
}
.navbar-green a{
	color: white;	
}

#langageMenu li{
	Float =left;
	display= block;
	width=100%;
	margin-right: 30px;
}

#langageMenu a{
	color:#676767;
}

#langageMenu .active{
	color:#222458;
}

#langageMenu a:hover{
	color:#222458;
}