/****Icone de carte***/

.navbar{
  margin-bottom:0px;
}

.navbar-nav.navbar-right:last-child {
margin-right: 0px;
}

.navbar li{
  border-bottom-width: 6px;
  border-bottom-color: transparent;
  border-bottom-style: solid;
}

.navbar li.dropdown:hover{
  border-bottom-width: 6px;
  border-bottom-color: green;
  border-bottom-style: solid;
}

.navbar li.dropdown.active{
  border-bottom-width: 6px;
  border-bottom-color: green;
  border-bottom-style: solid;  
}

#menu-left li.active{
  border-bottom-width: 6px;
  border-bottom-color: gold;
  border-bottom-style: solid;
  font-weight: bold;  
  font-size: 14px;  
}


.navbar a{
 //margin-top:5px; 
}

.navbar a,
.navbar button{
  margin-top:5px; 
  padding-top: 6.5px;
  padding-bottom: 6.5px;
}


/***** Extra Data ******/
.list-group div.form-group{
  margin-bottom: 0px;
}

/*******************************/

/***** Structure de la page******/

html,body, .full-height{
  height:100%;
}


.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

.container-enter{
  margin-top:10px;
  height:100%;
  max-width: 100%;  
}

th{
  text-align: center;
}

/**** Bandeau Legend ****/
legend{
  padding-bottom: 10px;
}

/**** Add Transport Order ********/
.input-quantity-int{
  width:60%;
}

.input-quantity-dot{
  width:5%;
}

.input-quantity-dec{
  width:30%;
}

/**** New Construction Site ********/
.siteRefInput{
  float:left;
  padding-left:15px;
}

.siteRefInput .col-lg-2{
  padding-right:2px;
  padding-left:2px;
  width:120px;
}

.siteRefInput .col-lg-1{
  padding-right:2px;
  padding-left:2px;
  width:60px;
}


.siteRefInput .col-lg-1.control-label{
  padding-right:2px;
  padding-left:2px;
  text-align:center;
  width:10px;
}

.form-group.addr1{
  margin-bottom:0px;
}

.formvalidationinfo{
  padding-top:5px;
}

.popover{
  max-width:750px;
}

.table-at{
  width:700px;
}


form[name="newCSForm"] .bootstrap-select{
  width:150px !important;
}

.highlight{
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0;
  margin-right: 0;
  border-width: 1px;
  border-radius: 4px;
  border-radius: 4px;
  background-color: #f7f7f9;
  border: 1px solid #e1e1e8;
  display: inline-block;
}

#tbl-poi th[name='label']{
  width:30%;
}

#tbl-poi th[name='type-poi']{
  width:30%;
}

.tbl-list{
  cursor: pointer;
}

/* In order to display text in a formular after a .control-label */
.form-horizontal .control-text {
  padding-top: 6px;
}


/**** Etapes / Activités ********/

.subViewContent{
  position:relative;
}

td.number{
  text-align:center;
}

td.siteLabel{
  overflow: hidden;
  text-overflow: ellipsis;
  max-width:250px;
}

td.siteCity{
  overflow: hidden;
  text-overflow: ellipsis;
  max-width:100px;
}

.well{
  padding:0;
}

.progress{
  width:110px;
  margin-bottom: 0px;
}

/*** EXTRA DATA ***/

.extra-data-input .form-control{
  width:95%;
  float:right;
}

i.extra-ok,i.extra-ko {
    display:none;
    float:left;
}
.ng-dirty.ng-valid ~ i.extra-ok {
    color:green;
    display:inline;
}
.ng-invalid ~ i.extra-ko {
    color:red;
    display:inline;
}

.tooltip-inner{
  max-width:350px;
}

.control-label{
  font-weight:bold;
}
/*** *** ***/


.control-group {
margin-bottom: 5px;
}

.form-horizontal .control-group {
margin-bottom: 5px;
}

.input-xxmedium {
  width: 420px;
}

code{
  white-space:normal;
}

/**FORMULAIRES**/
.red, .red a{
  color:red;
}

.green, .green a{
  color:green;
}

.white, .white a {
  color: #fff;
}

/**helpers**/
.y-scrollable{
  overflow-y:auto;
  overflow-x:hidden;
}

@media (min-height: 300px) {
  .responsiveHeigtEnter{
    height:300px;
  }
  .responsiveHeightGrid{
    height:300px;
  }
}

@media (min-height: 500px) {
  .responsiveHeigtEnter{
    height:500px;
  }
  .responsiveHeightGrid{
    height:400px;
  }  
}

@media (min-height: 768px) {
  .responsiveHeigtEnter{
    height:600px;
  }
  .responsiveHeightGrid{
    height:480px;
  }  
}

@media (min-height: 820px) {
  .responsiveHeigtEnter{
    height:810px;
  }
  .responsiveHeightGrid{
    height:650px;
  }  
}

.titleLegend{
  margin-bottom: 15px;
  margin-top: 10px;
  font-size: 1.7em; 
}

.cell { 
    border: 1px solid #e5e5e5; 
}

.progressStyle{
  float: none !important;
  display: inline-block !important;
  vertical-align: middle !important;

}

/****************************
ANIMATION (ng Animate)
*****************************/

.show-hide.ng-hide-add, .show-hide.ng-hide-remove {
  -webkit-transition:all linear 0.2s;
  -moz-transition:all linear 0.2s;
  -o-transition:all linear 0.2s;
  transition:all linear 0.2s;
  display:block!important;
}

.show-hide.ng-hide-add.ng-hide-add-active,
.show-hide.ng-hide-remove {
  opacity:0;
}

.show-hide.ng-hide-add,
.show-hide.ng-hide-remove.ng-hide-remove-active {
  opacity:1;
}

.selectTime tr:nth-child(1),
.selectTime tr:nth-child(3){
  display:none;  
}

.icon-spin {
  -webkit-animation: spin 1000ms infinite linear;
  animation: spin 1000ms infinite linear;
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

/*SLIDER - for transport order assingn customisation*/
.slider .tooltip{
  display: none;
}

.slider-selection{
  background-image: none;
  background-color:green;  
}

.slider.slider-horizontal{
  width:100%;
}

.bdls-section-footer{
  margin-bottom:50px;
}

.bdls-profile-display{
  display:none;
}

/**
* It seems that when the class is defined at the latest position in the css file, the style is not applied
*/
.bdls-header-cell .ui-grid-cell-contents{
     white-space: normal;
     -ms-text-overflow: clip;
     -o-text-overflow: clip;
     text-overflow: clip;
}

/** style for hovering in the ui-grid lists **/
.hovered{
  color:#181818;
  font-weight: bold;
}

.bad-state{ text-align: center;font-weight: bold;color:#2A0A0A;background-color: #ff6666 !important; }
.average-state { text-align: center;color : #2A120A;background-color: #ff944d !important; }
.good-state { text-align: center;color:#2E3B0B;background-color: #D8F781 !important; }
.very-good-state { text-align: center;color:#0B3B2E;background-color: #81F781 !important; }
.hide-zero div{ opacity: 0;}

/*
* Classes for the BDLS weekly reporting about operations
*/

/* The table colmun header (we lack space in width, so we choose a narrow font family*/
.reporting-column-header{
  font-family: "Arial Narrow"
}
/* The spacing and color style for the lines of the array corresponding to customers */
.reporting-customer{
  color:rgb(255,255,233);
  background-color: rgb(79,129,189);
}
.reporting-customer td{
  padding:3px !important;
}
/* The spacing and color style for the lines of the array corresponding to sites */
.reporting-site{
  color:rgb(78,112,192);
  background-color: rgb(197,217,241);
}
.reporting-site td{
  padding:3px !important;
}
/* The spacing and color style for the lines of the array corresponding to persons */
.reporting-person{
  background-color: rgb(242,242,242);
}
.reporting-person td{
  padding:3px !important;
}
/* A style that will apply to some elements of the upper horizontal bar of the reporting menu */
.reporting-title{
  color:rgb(0,112,192);
  display:inline;
  vertical-align:middle;
}
/* Brings back a hovering system that otherwise would be broken by the use of reporting-like classes */
.reporting-hoverable:hover{
  color:rgb(0,0,0);
  background-color: rgb(232,232,232);
  font-weight: bold;
}

/**
* Classes for the presentation of garment commands
*/
.garment-command-done{
  color:rgb(0,0,0);
  background-color: rgb(170,220,255) !important;
}
.garment-command-never{
  color:rgb(0,0,0);
  background-color: rgb(255,175,160) !important;
}
.garment-command-ongoing{
  background-color: rgb(255,220,160) !important;
}
.garment-command-wash{
  padding-left:8px;
}
.renew.garment-command-done{
  font-weight: bold;
  text-align:right;
  padding-right:8px;
}
.renew.garment-command-never{
  font-weight: bold;
  padding-left:8px;
}
.renew.garment-command-ongoing{
  text-align:center;
  font-style:italic;
}

/**
* Class that is specific to garment selection
*/
.garment-command-selected{
  background-color: rgb(180,255,160) !important;  
  font-weight: bold;
}

/**
* Dynamic height settings for the ui-grids
*/

@media (min-height: 300px) {
  .responsiveHeigtUiGrid{
    height:300px;
  }
}

@media (min-height: 500px) {
  .responsiveHeigtUiGrid{
    height:320px;
  }
}

@media (min-height: 650px) {
  .responsiveHeigtUiGrid{
    height:470px;
  }
}

@media (min-height: 768px) {
  .responsiveHeigtUiGrid{
    height:580px;
  }
}

@media (min-height: 820px) {
  .responsiveHeigtUiGrid{
    height:640px;
  }
}

@media (min-height: 900px) {
  .responsiveHeigtUiGrid{
    height:720px;
  }
}

.ui-grid-commands-menu{
  border: 1px solid #d4d4d4;
  background-color :rgb(230,225,255) !important; 
}

.ui-grid-commands-menu-item button{
  margin-top:5px;
}

.ui-grid-commands-menu-item div{
  margin-top:1px;
}

.client-navbar {
  background-color :rgb(230,225,255) !important;
}

.employee-navbar {
  background-color :rgb(225,255,230) !important;
}

.ui-grid-generic-menu{
  border: 1px solid #d4d4d4;
  background-color :rgb(225,225,225) !important; 
}

.ui-grid-generic-menu-item button{
  margin-top:5px;
}

.ui-grid-generic-menu-item div{
  margin-top:1px;
}

/**
* CHART PRESENTING THE GARMENTS GENERAL STATE
*/
.general-garment-state{
  border-top: 1px solid grey;
  border-bottom: 1px solid grey;
  display:inline-block;
  height:16px;
}
.general-garment-state-bad{
  border-left: 1px solid grey;
  background-color:red;
  box-shadow:inset -3px 0px 3px orange;
}
.general-garment-state-average{
  background-color:orange;
  box-shadow:inset -3px 0px 3px white;
}
.general-garment-state-good{
  background-color:white;
}
.general-garment-state-very-good{
  border-right: 1px solid grey;
  background-color:green;
  box-shadow:inset 3px 0px 3px white;
}

/* Should handle a scroll issue since Chrome 56 */
.ui-grid-viewport {
  overflow-anchor: none;
}

/*
* To Highlight messages that are waiting for a reply
*/
.unreplied-message{
  font-weight:bold;
}

.ui-grid-cell.customer{
  color:rgb(255,255,233);
  background-color: rgb(79,129,189) !important;
}

.ui-grid-cell.site{
  color:rgb(78,112,192);
  background-color: rgb(197,217,241) !important;
}

.ui-grid-cell.job{
  font-style:italic;
}