/* ==========================================================================
Hide ng-cloak on page load, https://docs.angularjs.org/api/ng/directive/ngCloak
========================================================================== */
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

.error {
    color: white;
    background-color: red;
}

.pad {
    padding: 10px;
}

.no-padding {
    padding: none;
}

.spacer {
    margin-top: 20px;
}

.break {
    white-space: normal;
    word-break:break-all;
}

a:hover {
  cursor: pointer;
}

.hand {
    cursor: pointer;
}

.clickable {
    cursor: pointer;
}

/* ==========================================================================
start Password strength bar style
========================================================================== */
ul#strengthBar {
    display:inline;
    list-style:none;
    margin:0;
    margin-left:15px;
    padding:0;
    vertical-align:2px;
}

.point:last {
    margin:0 !important;
}
.point {
    background:#DDD;
    border-radius:2px;
    display:inline-block;
    height:5px;
    margin-right:1px;
    width:20px;
}
/* ==========================================================================
Fix error field display
========================================================================== */
.form-group .help-block {
    position: static;
}

/* ==========================================================================
entity detail page css
========================================================================== */
.dl-horizontal.jh-entity-details > dd {
    margin-bottom: 15px;
}

@media screen and (min-width: 768px) {
    .dl-horizontal.jh-entity-details > dt {
        margin-bottom: 15px;
    }

    .dl-horizontal.jh-entity-details > dd {
        border-bottom: 1px solid #eee;
        padding-left: 180px;
        margin-left: 0;
    }
}

/* ==========================================================================
ui bootstrap tweaks
========================================================================== */
.nav, .pagination, .carousel, .panel-title a {
    cursor: pointer;
}

.datetime-picker-dropdown > li.date-picker-menu div > table .btn-default,
.uib-datepicker-popup  > li > div.uib-datepicker > table .btn-default {
    border: 0;
}

.datetime-picker-dropdown > li.date-picker-menu div > table:focus,
.uib-datepicker-popup  > li > div.uib-datepicker > table:focus {
    outline: none;
}


.md-virtual-repeat-container.md-autocomplete-suggestions-container {
    z-index: 9999
}

.full-height{
  /*100% - navbar*/
  height: calc(100% - 65px);
  /*margin-top:-20px;*/
}

.full-height2{
  height: 100%;
}


.full-height3{
  height: calc(100% - 45px);
  /*workaround for throtlling on angular-resize */
}

[role="tabpanel"] {
    transition: none;
}

.badge {
    vertical-align: middle;
    margin-top: -0.5em;
}

.fff{
    background: #fafafa;
}

.form-group{
    margin-top:10px;
    margin-bottom: 10px;
}

.header-fixed > tbody > tr,
.header-fixed > thead > tr{
width: 100%;
display: inline-table;
table-layout: fixed;
}


.header-fixed > table{
 height: calc(100% - 110px);            // <-- Select the height of the table
 display: -moz-groupbox;    // Firefox Bad Effect
}

.header-fixed > tbody{
  overflow-y: auto;
  height: calc(100% - 110px);        //  <-- Select the height of the body
  width: 100%;
  position: absolute;
}

.form-group label{
  color:#333;
}

label{
  color:#333;
}

label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: normal;
}

input[type=number] {
    text-align:center;
}

.modal.fade {
  opacity: 1;
}

.modal.fade .modal-dialog, .modal.in .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

.collapse {
  display: none; }
  .collapse.show {
    display: block; }


.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn; }

/*
.main .container-fluid {
  padding: 0 30px; }
*/

html, body {
    height:100%;
    min-height: 100vh;
}

body.md-default-theme, body, html.md-default-theme, html {
    color: rgba(0,0,0,0.87);
    background-color: #fff;
}

body{
    /*background-color: #F4F5F7 !important*/
    background-color: #fff !important;


    /*background: #07E9EBEE;
    background-color: #F4F5F7;
    background: #0E5992; //blue firefox
    background: #0093BA; //blue linkedin
    background: #3E54FF; //blue kissmetrics.com
    background: #07E9EBEE;
    background-color: #fff !important;
   */
}

.table > tbody > tr > td {
     vertical-align: middle;
}


md-toolbar{
 min-height:55px;
 max-height:55px
}

.ng-table th{
    text-align:left;
    font-size: small;
    font-weight:normal;
}

.dropdown-menu {
    padding: 0;
    margin-top:-10px;
}

/*align titles*/
.h1, .h2, .h3, h1, h2, h3 {
    margin: 0;
}
/* plannings view toolbar*/
md-toolbar.md-default-theme:not(.md-menu-toolbar), md-toolbar:not(.md-menu-toolbar) {
    /*background-color: #03A9F4;*/
    background-color: #FAFAFA;
    color: rgba(0, 0, 0, 0.87);
}

.table-borderless > tbody > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > thead > tr > th {
    border: none;
    padding: 0;
}

/* gant chart*/
.gantt-side-content > div.side-element {
    display: inline;
}

 .gantt-row.custom-row .gantt-row-background {
  // Customize background of the row
  background: blue;
  opacity: 0.3;
}

.gantt-row.custom-row .gantt-row-content {
  // Customize content of the row
  weight: bolder;
}

.gantt-side{
    width:35%;
    min-width:20%;
    max-width:80%;
}

.gantt-column-name{
    width:20%;
}
.gantt-column-distance{
    width:15%;
}
.gantt-column-duration{
    width:15%;
}
.gantt-column-service{
    width:13%;
}
.gantt-column-driving{
    width:13%;
}

.gantt-column-cost{
    width:15%;
}
.gantt-column-weight{
    width:15%;
}
.gantt-column-quantity{
    width:15%;
}

md-checkbox {
    margin-bottom: 0px;
}

 .navbar .dropdown-menu li > a, .navbar.navbar-default .dropdown-menu li > a {
     font-size: 14px;
     padding: 10px 15px;
 }

.drop-box {
     background: #F8F8F8;
     border: 5px dashed #DDD;
     /*    width: 100%;*/
     height: 220px;

     text-align: center;
     /*padding-top: 25px;*/
     margin: 10px;
 }

 .drop-box2 {
     background: #F8F8F8;
     border: 5px dashed #DDD;
     /*width: 100px;*/
     height: 200px;

     text-align: center;
     /*padding-top: 25px;*/
     /*margin: 10px;*/
 }

 a, a:active, a:focus,
 button, button:focus, button:active, li, li:focus, li:active, tr,
 .btn, .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn.focus:active, .btn.active.focus {
     outline: none;
     outline: 0;
 }

 .uib-time input {
   width: 100%;
 }

 .uib-time input {
   width: 70px !important;
 }

.logo {
  width: 200px;
}

 #main {
   margin-top: 10px;
   padding: 10px 10px;
   transition: all 0.3s;
 }