/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/

.jumbotron p {
  font-size: 18px;
}
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
html {
  font-size: 10px !important;
}
.row {
  margin-left: -15px;
  margin-right: -15px;
}
.row:before,
.row:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}
.row:after {
  clear: both;
}
.row:before,
.row:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}
.row:after {
  clear: both;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-md-1-5, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-md-2-5, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-md-3-5, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11 {
  float: left;
}
.col-xs-12 {
  width: 100%;
}
.col-xs-11 {
  width: 91.66666667%;
}
.col-xs-10 {
  width: 83.33333333%;
}
.col-xs-9 {
  width: 75%;
}
.col-xs-8 {
  width: 66.66666667%;
}
.col-xs-7 {
  width: 58.33333333%;
}
.col-xs-6 {
  width: 50%;
}
.col-xs-5 {
  width: 41.66666667%;
}
.col-xs-4 {
  width: 33.33333333%;
}
.col-xs-3 {
  width: 25%;
}
.col-xs-2 {
  width: 16.66666667%;
}
.col-xs-1 {
  width: 8.33333333%;
}

@media print {
  .no-print {
    display: none !important;
  }
  .table {
    border-collapse: collapse !important;
  }
  .table-bordered th,
  .table-bordered td {
    border: 1px solid #ddd !important;
  }
  .text-small-print {
    font-size: 9px !important;
  }
  .table {
    width: 90%;
    margin-bottom: 17px;
  }
}
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/*
  Place all the styles related to the matching controller here.
  They will automatically be included in application.css.
*/
/**
 *
 * Apply Here your Custom CSS
 *
*/

.woo-operator {
    margin: 5px 0px 0px 0px;
}

.tile-progress .tile-header {
    padding: 15px 20px;
    padding-bottom: 15px;
}

.currentRow {
    background-color: black;
}

.handsontable .htCore .htDimmed, .disabled_row {
    background-color: #FFFFFF;
    font-style: italic;
    color: #cfd0d1;
}

.handsontable .htDimmed.htAutocomplete .htAutocompleteArrow {
    display: none;
}

/**
.ui-dialog { z-index: 1000 !important ;}

.ui-front { z-index:1000000 !important; }

.ui-widget-overlay { z-index: 0; }
*/

.tile-stats {
    padding: 10px;
    overflow: visible;
}

.tile-stats.tile-gray {
    background: rgb(235, 235, 235);
    border: none;
    margin-top: 8px;
}

.tile-stats.tile-gray:hover {
    background: rgb(235, 235, 235);

}

.tile-footer-with-margin {
    margin-top: -7px;
}

.tile-stats:hover {
    background: var(--color-background-main, #FFF);
}

.tile-stats div.fadable-white {
    color: #303641;
}

rect.systemBox.selected[_ngcontent-c6] {
    stroke: var(--color-ok-availability) !important;
    stroke-width: 4px;
}

rect.selected[_ngcontent-c8] {
    stroke: var(--color-ok-availability) !important;
}

rect.systemBoxHeader.selected[_ngcontent-c6] {
    stroke: var(--color-ok-availability) !important;
}

rect.systemBox.mouseOver[_ngcontent-c6] {
    stroke: var(--color-ok-background) !important;
    stroke-width: 4px;
}

rect.systemBoxHeader.mouseOver[_ngcontent-c6] {
    stroke: var(--color-ok-background) !important;
}

rect.mouseOver[_ngcontent-c8] {
    stroke: var(--color-ok-background) !important;
}

.btn-danger {
    color: #ffffff;
    background-color: var(--color-RPred);
    border-color: var(--color-RPred);
}

.tile-stats .num, .tile-stats h3, .tile-stats p {
    position: relative;
    color: #878889;
    z-index: 5;
    margin: 0;
    padding: 0;
}


.tile-thin {
    padding: 1px;
    text-align: right;
}


.tile-stats div,
.tile-stats p {
    text-align: right;
}

.tile-stats.tile-red div {
    color: var(--color-background-main);
}

.operator_names {
    font-size: 11px;
}

:root {
    --color-background-main: #FFFFFF;
    --color-background-main-grey: #fafafa;
    --color-background-tr-odd: #f8f8f8;
    --color-button-main: #edeeef;
    --color-RPgrey: #878889;
    --color-RPred: #029AA9;
    --color-ok-availability: #99cc99;
    --color-ok-background: #99cc99;
    --color-selection-main: #adbad9;
    --color-todo-main: #b6c3cc;
    --color-warning: #C50045;
    --color-font-dark-blue: #525354;
    --color-error: #C50045;
    --color-background-maintenance-open: #FFFFFF;
    --color-background-maintenance-closed: #edeeef;
    --color-background-maintenance-execution: #878889;
    --color-background-maintenance-paused: #ffed00;
    --color-background-maintenance-items-short: #92D6DD;
    font-family: Arial;
}

input[type="checkbox"] {
    accent-color: var(--color-background-maintenance-items-short) !important;
}

input[type="radio"] {-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-block;
    width: 14px;
    height: 14px;
    background-clip: content-box;
    border: 2px solid #92D6DD;
    border-radius: 50%;
    accent-color: var(--color-background-maintenance-items-short) !important;
}

input[type="radio"]:checked {
    background-color: #029AA9;
}

table.dataTable td.dt-control:before {
    background-color: var(--color-RPred) !important;
}

html {
    height: 100%;
}

body {
    background: var(--color-background-main-grey);

    /* ensure, that the body contains the whole content
       (with height 100% the body only stretches the screen) */
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

body > div.page-container.horizontal-menu > div.main-content > div.row {
    background: var(--color-background-main-grey);
}

body > div.page-container.horizontal-menu > div.main-content {
    background: var(--color-background-main-grey);
}

/*
.row {
    border: 5px solid var(--color-background-main);
}
*/
.operator-schwarz {
    color: #000;
    font-size: 11px;
}

.operator-grau {
    color: #888;
    font-size: 11px;
}

.operator-rot {
    color: #F00;
    font-size: 11px;
}

.operator-blau {
    color: #00F;
    font-size: 11px;
}

.operator-grun {
    color: #080;
    font-size: 11px;
}

.operator-black {
    color: #000;
    font-size: 11px;
}

.operator-gray {
    color: #888;
    font-size: 11px;
}

.operator-red {
    color: #F00;
    font-size: 11px;
}

.operator-blue {
    color: #00F;
    font-size: 11px;
}

.operator-green {
    color: #080;
    font-size: 11px;
}

.operator-yellow {
    color: orange;
    font-size: 11px;
}

.operator-pink {
    color: #9c27b0;
    font-size: 11px;
}

.operator-deep-purple {
    color: #673ab7;
    font-size: 11px;
}

.operator-brown {
    color: #795548;
    font-size: 11px;
}

.operator-deep-orange {
    color: #ff5722;
    font-size: 11px;
}

.operator-light-blue {
    color: #03a9f4;
    font-size: 11px;
}

.operator-light-green {
    color: #8bc34a;
    font-size: 11px;
}

.operator-black-italic {
    color: #000;
    font-size: 11px;
    font-style: italic;
}


.group-schwarz {
    color: #000;
}

.group-grau {
    color: #888;
}

.group-rot {
    color: #F00;
}

.group-blau {
    color: #00F;
}

.group-grun {
    color: #0A0;
}

.group-black {
    color: #000;
}

.operator-black {
    color: #000;
    font-size: 12px;
}

.operator-gray {
    color: var(--color-RPgrey);
    font-size: 12px;
}

.operator-red {
    color: var(--color-RPred);
    font-size: 12px;
}

.operator-blue {
    color: var(--color-font-dark-blue);
    font-size: 12px;
}

.operator-green {
    color: #8fbf93;
    font-size: 12px;
}

.operator-yellow {
    color: orange;
    font-size: 12px;
}

.operator-pink {
    color: #9c27b0;
    font-size: 12px;
}

.operator-deep-purple {
    color: #673ab7;
    font-size: 12px;
}

.operator-brown {
    color: #795548;
    font-size: 12px;
}

.operator-deep-orange {
    color: #ff5722;
    font-size: 12px;
}

.operator-light-blue {
    color: #03a9f4;
    font-size: 12px;
}

.operator-light-green {
    color: #8bc34a;
    font-size: 12px;
}

.group-gray {
    color: #888;
}

.group-red {
    color: #F00;
}

.operator-black-italic {
    color: #000;
    font-size: 12px;
    font-style: italic;
}

.group-blue {
    color: #00F;
}

.group-green {
    color: #0A0;
}

.group-yellow {
    color: orange;
}

.group-background-black {
    background-color: #000;
}

.group-background-gray {
    background-color: #888;
}

.group-background-red {
    background-color: #F00;
}

.group-background-blue {
    background-color: #00F;
}

.group-background-green {
    background-color: #0A0;
}

.btn-shift-delete {
    float: left;
}

.btn-shift-add {
    float: left;
}

.btn-team-app-red {
    color: #C50045;
    background-color: transparent;
    border: none;
}

.btn-team-app-green {
    color: #99cc99;
    background-color: transparent;
    border: none;
}

.btn-increase-green {
    color: #99cc99;
    background-color: transparent;
    border: none;
    height: 30px;
    vertical-align: super;
}

.btn-transparent {
    border: none;
    background-color: transparent;
}

.topbar {
    color: #FFF;
    background-color: #000;
}

.handostable-buttons {
    margin: 10px 0px 10px 0px;
}

.distribution-td {
    padding: 5px;
}

.ps-distribution-td {
    padding: 5px;
}

.distribution-units {
    width: 50px;
}

.input-money {
    text-align: right;
    width: 100px;
}

.input-count {
    text-align: right;
    width: 60px;
}

#handsontable {
    /*  height: 400px;
      overflow-y: auto; */
}

.height-scroll {
    height: 300px;
    overflow-y: auto;
}

.handsontable-buttons {
    padding-bottom: 17px;
}

.availability-available {
    color: black;
}

.availability-unavailable {
    color: #C50045;
}

#content_title, .content_title {
    font-size: 14px;
    color: #878889;
}

@media print {

    div {
        font-size: 10px;
    }

    div p {
        font-size: 10px;
    }

    .no-print {
        display: none !important;
    }

    .table {
        border: 1px solid #edeeef;
        border-collapse: collapse;
    }

    .table tr {
        page-break-inside: avoid;
    }

    .table th {
        font-size: 10px;
        font-weight: bold;
        border: 1px solid #edeeef;
        border-collapse: collapse;
        padding: 2px !important;
    }

    .table td {
        border: 1px solid #edeeef;
        border-collapse: collapse;
        padding: 2px !important;
        font-size: 10px;
    }

    .page-break {
        page-break-before: always;
        page-break-inside: avoid;
    }

    h4 {
        font-size: 14px !important;
        color: #878889 !important;
    }

    #header {
        position: fixed;
        display: block;
        top: 0;
    }

    .top-margin {
        margin-top: 40px;
    }

}

@media screen {

    .no-screen {
        display: none !important;
    }

}

.form-control-small {
    height: 31px;
    padding: 6px 12px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #878889;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #edeeef;
    border-radius: 3px;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -moz-transition: border-color ease-in-out .15s, -moz-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.border-color-error {
    border-color: #C50045;
}

.color-error {
    color: #C50045;
}


.stats-table {
    margin-bottom: 0px;
}

.handsontable th {
    background-color: #fff;
}


.text-green {
    color: #99cc99;
}

.text-red {
    color: #C50045;
}

.background-red {
    color: #fff;
    background-color: #C50045;
}

.ideal-cost-per-unit {
    color: #fff;
}

.holiday {
    color: #000;
    font-weight: bold;
}

.breadcrumb {
    margin-bottom: 0px;
}

.woo-highlight {
    color: #fff;
    background-color: #878889;
    padding: 2px;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;

}

.woo-padding-right-10 {
    padding-right: 10px;
}

input[type="text"]:disabled {
    border: 1px solid #fff;
}

.woo-shift-count-0 {
    background-color: #fff;
}

.woo-shift-count-1 {
    background-color: #fcfdfe;
}

.woo-shift-count-2 {
    background-color: #fcfdfe;
}

.woo-shift-count-3 {
    background-color: #f2f3f4;
}

.woo-shift-count-4 {
    background-color: #edeeef;
}

.indicator {
    font-size: 16px;
}

.ps-row {
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: 5px;
}

.ps-row:before,
.ps-row:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}

.ps-row:after {
    clear: both;
}

.ps-row:before,
.ps-row:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}

#breadcrumb-selector {
    width: 200px;
}

.ps-np {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    background-clip: padding-box;
    color: #eee;
    margin-bottom: 5px;
    opacity: 1;
    font-size: 12px;
}


.ps-p {
    display: block;
    width: 100%;
    text-align: center;
    padding: 5px;
    -webkit-clip-path: polygon(0 0, 80% 0, 100% 50%, 80% 100%, 0 100%);
    clip-path: polygon(0 0, 80% 0, 100% 50%, 80% 100%, 0 100%);
    -ms-clip-path: polygon(0 0, 80% 0, 100% 50%, 80% 100%, 0 100%);
    -moz-clip-path: polygon(0 0, 80% 0, 100% 50%, 80% 100%, 0 100%);
    color: #eee;
    margin-bottom: 5px;
    opacity: 1;
    font-size: 12px;
}

.hover,
.ps-np:hover,
.ps-p:hover,
.ps-p:focus,
.ps-np:focus {
    opacity: 0.5;
}

.no-padding {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.padding-top-3 {
    padding-top: 3px;
}

.padding-top-5 {
    padding-top: 5px;
}

.font-lg {
    font-size: 16px !important;
}

.mobile-calendar {
    margin-bottom: 20px;
}

.mobile-availability-header {
    font-size: 16px;
    text-align: center;
    font-weight: bold;
    padding: 25px 0px 25px 0px;
}

.system-title {
    margin-bottom: 20px;
}

.no-border td {
    border: 0px !important;
}

.no-margin-bottom {
    margin-bottom: 0px !important;
}

.no-margin-left {
    margin-left: 0px !important;
}

.no-padding-bottom {
    padding-bottom: 0px !important;
}

.border-right {
    border-right: 1px solid #fcfdfe;
}

.border-left {
    border-left: 1px solid #fcfdfe;
}

.border-bottom {
    border-bottom: 1px solid #fcfdfe;
}

.border-bottom-strong {
    border-bottom: 2px solid #000000;
}

.no-border-bottom {
    border-bottom: 0 !important;
}

.rpRed-border-bottom {
    border-bottom-color: var(--color-RPred) !important;
}

.border-top {
    border-top: 1px solid #fcfdfe;
}

.border-top-strong {
    border-top: 2px solid #000000;
}

.border-bottom {
    border-bottom: 1px solid #fcfdfe;
}

.no-border-top {
    border-top: 0 !important;
}

.graphic-integer {
    position: relative;
}

.graphic-zero {
    position: relative;
    top: 8px;
    text-align: right;
    border-left: 1px solid #000;
}

.graphic-positive {
    background: #C50045;
    background: -moz-linear-gradient(left, #C50045, white);
    background: -webkit-gradient(linear, left top, right top, from(#C50045), to(white));
    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#981b1b', EndColorStr='white', GradientType=1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#981b1b', EndColorStr='white', GradientType=1)";
    position: absolute;
    top: 8px;
    color: black;
    text-align: right;
    border-left: 1px solid #000;
}

.graphic-negative {
    background: #99cc99;
    background: -moz-linear-gradient(left, white, #99cc99);
    background: -webkit-gradient(linear, left top, right top, from(white), to(#99cc99));
    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='white', EndColorStr='#678e19', GradientType=1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(StartColorStr='white', EndColorStr='#678e19', GradientType=1)";
    position: absolute;
    top: 8px;
    color: black;
    text-align: right;
    border-right: 1px solid #000;
}

.graphic-bar {
    background: #92D6DD;
    background: -moz-linear-gradient(left, #92D6DD, white);
    background: -webkit-gradient(linear, left top, right top, from(#92D6DD), to(white));
    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#3D8585', EndColorStr='white', GradientType=1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#3D8585', EndColorStr='white', GradientType=1)";
    position: absolute;
    top: 8px;
    left: 0px;
    color: black;
    text-align: right;
    float: left;
}

.woo-form-control {
    display: block;
    height: 31px;
    padding: 6px 12px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #878889;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #edeeef;
    border-radius: 3px;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -moz-transition: border-color ease-in-out .15s, -moz-box-shadow ease-in-out .15s;
    -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.woo-form-control:focus {
    border-color: #cfd0d1;
    outline: 0;
    -moz-box-shadow: 0 2px 1px rgba(203, 208, 217, 0.08);
    -webkit-box-shadow: 0 2px 1px rgba(203, 208, 217, 0.08);
    box-shadow: 0 2px 1px rgba(203, 208, 217, 0.08);
}

.woo-form-control::-webkit-input-placeholder {
    color: #b2b3b4;
}

.woo-form-control:-moz-placeholder {
    color: #b2b3b4;
}

.woo-form-control::-moz-placeholder {
    color: #b2b3b4;
}

.woo-form-control:-ms-input-placeholder {
    color: #b2b3b4;
}

.woo-form-control:-moz-placeholder {
    color: #b2b3b4;
}

.woo-form-control::-moz-placeholder {
    color: #b2b3b4;
}

.woo-form-control:-ms-input-placeholder {
    color: #b2b3b4;
}

.woo-form-control::-webkit-input-placeholder {
    color: #b2b3b4;
}

.woo-form-control[disabled],
.woo-form-control[readonly],
fieldset[disabled] .woo-form-control {
    cursor: not-allowed;
    background-color: #edeeef;
}

textarea.woo-form-control {
    height: auto;
}

.icon-medal {
    font-size: 18px;
}

.gold-medal {
    color: gold;
}

.silver-medal {
    color: silver;
}

.bronze-medal {
    color: #cd7f32;
}

.watch {
    margin-bottom: 5px;
}

footer {
    padding: 10px;
    border-top: 1px solid #edeeef;
}

.rating {
    font-size: 18px;
    margin-right: 10px;
    cursor: pointer;
}

.small-rating {
    cursor: pointer;
}

.fadable {
    font-size: 11px;
}

.fadable-white {
    font-size: 11px;
    color: #ffffff;
}

.hyperlink_th {
    cursor: pointer;
}

.cell-input {
    width: 40px;
    border: 0px;
}

.date-input {
    width: 80px;
}

.date-input-full-width {
    width: 100%;
    text-align: right;
}

.table-two-one-striped tr {
    background: #f7f8f9;
}

.table-two-one-striped tr:nth-child(3n+0) {
    background: white;
}

.border-bottom-thick {
    border-bottom: 2px solid #fcfdfe;
}

.border-top-thick {
    border-top: 2px solid #fcfdfe;
}

.border-right-thick {
    border-right: 2px solid #fcfdfe !important;
}

.border-left-thick {
    border-left: 2px solid #fcfdfe;
}

.border-bottom-black {
    border-bottom: 1px solid #000000;
}

.border-top-black {
    border-top: 1px solid #000000;
}

.border-right-black {
    border-right: 1px solid #000000 !important;
}

.border-left-black {
    border-left: 1px solid #000000;
}

.border-right-thick-black {
    border-right: 2px solid #000000 !important;
}

.border-top-thick-black {
    border-top: 2px solid #000000 !important;
}

.border-bottom-thick-black {
    border-bottom: 2px solid #000000 !important;
}

.highlitable:hover {
    background: #cfd0d1 !important;
    cursor: pointer;
}

.tooltip {
    font-size: 11px !important;
}

.tooltip-inner {
    min-width: 100px;
    max-width: 400px;
}

.pagination {
    margin-top: 1px;
    margin-bottom: 1px;
}

.main-content {
    min-height: 240px;
}

@media print {
    body {
        -webkit-print-color-adjust: exact;
    }

    .small-print-font {
        font-size: 10px !important;
    }

    .tiny-print-font {
        font-size: 8px !important;
    }
}

.btn-max-mobile {
    width: 100%;
    max-width: 800px;
}

.legend {
    text-align: center;
}

@media screen {

    .half-width-if-no-print {
        width: 50%;
    }

}

.col-xs-12 {
    overflow: auto;
}

.horizontal-scrollable > .row {
    overflow-x: auto;
    white-space: nowrap;
    margin-right: 10px;
    margin-left: 5px;
}

.horizontal-scrollable > .row > .col-xs-12 {
    display: inline-block;
    float: none;
}

.horizontal-scrollable > .row > .col-sm-6 {
    display: inline-block;
    float: none;
}

.horizontal-scrollable > .row > .col-md-4 {
    display: inline-block;
    float: none;
}

.horizontal-scrollable > .row > .col-lg-3 {
    display: inline-block;
    float: none;
}

.card {
    text-align: center !important;
    padding: 20px;
    white-space: normal;
}

.card div {
    text-align: center !important;
}

.card-title {
    /*font-weight: bold;*/
    margin: 0px 0px 10px 0px;
    word-break: normal !important;
    /*border-bottom: 1px solid #888888;*/
}

.card-subtitle {
    font-size: 10pt;
}

.card-performance {
    font-size: 26pt;
    margin: 14px 0px 30px 0px;
    /*border-bottom: 1px solid #888888;*/
}

.card-info {
    font-size: 10pt;
    margin: 5px 0px 5px 0px;
    padding: 5px 0px 5px 0px !important;
    white-space: nowrap;
}

.card-big-info {
    font-size: 48pt;
    text-align: left !important;
}

.card-sub-info {
    font-size: 14pt;
    text-align: left !important;
}

.bg-success {
    background-color: #99cc99 !important;
}

.bg-meh {
    background-color: #fcc633 !important;
}

.bg-danger {
    background-color: #C50045 !important;
}

.no-background {
    /*background-color: #F2F2F2 !important;*/
    background: none;
    border: 1px solid #b2b3b4;
}

.no-background:hover {
    /*background-color: #F2F2F2 !important;*/
    background: none !important;
    border: 1px solid #b2b3b4;
}


.progress-white {
    border: 1px solid grey;
}

.font-14pt {
    font-size: 14pt !important;
}

.font-13pt {
    font-size: 13pt !important;
}

.font-12pt {
    font-size: 12pt !important;
}

.scrollable-415 {
    min-height: 415px;
    overflow: auto;
}

.scrollable-max-240 {
    max-height: 240px;
    overflow: auto;
}

.scrollable-max-280 {
    max-height: 280px;
    overflow: auto;
}

.scrollable-max-50vh {
    max-height: 50vh;
    overflow: auto;
}

.min-height-20px {
    min-height: 20px;
}

.min-height-60 {
    min-height: 60px;
}

.bg-dark-grey {
    background-color: #525354 !important;
}

.bg-grey {
    background-color: #878889 !important;
}

.bg-light-grey {
    background-color: #cfd0d1 !important;
}

.bg-very-light-grey {
    background-color: #ffffff !important;
}


.switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 18px;
    vertical-align: middle;
}

.switch input {
    display: none;
}

.toggler {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #b2b3b4;
    -webkit-transition: .4s;
    transition: .4s;
}

.toggler:before {
    position: absolute;
    content: "";
    height: 12px;
    width: 12px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .toggler {
    background-color: #b2b3b4;
}

input:focus + .toggler {
    box-shadow: 0 0 1px #b2b3b4;
}

input:checked + .toggler:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.toggler.round {
    border-radius: 34px;
}

.toggler.round:before {
    border-radius: 50%;
}

.page-breaker {
    page-break-after: always;
}

.ta-full-width {
    width: 100%;
}

.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: rgba(255, 255, 255, 0);
    background-clip: border-box;
    border-radius: 0.25rem;
}

.card > hr {
    margin-right: 0;
    margin-left: 0;
}

.card > .list-group:first-child .list-group-item:first-child {
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.card > .list-group:last-child .list-group-item:last-child {
    border-bottom-right-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

.card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1.25rem;
}

.card-title {
    margin-bottom: 0.75rem;
}

.card-subtitle {
    margin-top: -0.375rem;
    margin-bottom: 0;
}

.card-text:last-child {
    margin-bottom: 0;
}

.card-link:hover {
    text-decoration: none;
}

.card-link + .card-link {
    margin-left: 1.25rem;
}

.card-header {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.card-header:first-child {
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

.card-header + .list-group .list-group-item:first-child {
    border-top: 0;
}

.card-footer {
    padding: 0.75rem 1.25rem;
    background-color: rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
}

.card-footer:last-child {
    border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
}

.card-header-tabs {
    margin-right: -0.625rem;
    margin-bottom: -0.75rem;
    margin-left: -0.625rem;
    border-bottom: 0;
}

.card-header-pills {
    margin-right: -0.625rem;
    margin-left: -0.625rem;
}

.card-img-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1.25rem;
}

.card-img {
    width: 100%;
    border-radius: calc(0.25rem - 1px);
}

.card-img-top {
    width: 100%;
    border-top-left-radius: calc(0.25rem - 1px);
    border-top-right-radius: calc(0.25rem - 1px);
}

.card-img-bottom {
    width: 100%;
    border-bottom-right-radius: calc(0.25rem - 1px);
    border-bottom-left-radius: calc(0.25rem - 1px);
}

.card-deck {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
}

.card-deck .card {
    margin-bottom: 15px;
}

.panel-body.with-table > pre {
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: normal;
}

@media (min-width: 576px) {
    .card-deck {
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        margin-right: -15px;
        margin-left: -15px;
    }

    .card-deck .card {
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 1 0 0%;
        flex: 1 0 0%;
        -ms-flex-direction: column;
        flex-direction: column;
        margin-right: 15px;
        margin-bottom: 0;
        margin-left: 15px;
    }
}

.card-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
}

.card-group > .card {
    margin-bottom: 15px;
}

@media (min-width: 576px) {
    .card-group {
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
    }

    .card-group > .card {
        -ms-flex: 1 0 0%;
        flex: 1 0 0%;
        margin-bottom: 0;
    }

    .card-group > .card + .card {
        margin-left: 0;
        border-left: 0;
    }

    .card-group > .card:first-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .card-group > .card:first-child .card-img-top,
    .card-group > .card:first-child .card-header {
        border-top-right-radius: 0;
    }

    .card-group > .card:first-child .card-img-bottom,
    .card-group > .card:first-child .card-footer {
        border-bottom-right-radius: 0;
    }

    .card-group > .card:last-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .card-group > .card:last-child .card-img-top,
    .card-group > .card:last-child .card-header {
        border-top-left-radius: 0;
    }

    .card-group > .card:last-child .card-img-bottom,
    .card-group > .card:last-child .card-footer {
        border-bottom-left-radius: 0;
    }

    .card-group > .card:only-child {
        border-radius: 0.25rem;
    }

    .card-group > .card:only-child .card-img-top,
    .card-group > .card:only-child .card-header {
        border-top-left-radius: 0.25rem;
        border-top-right-radius: 0.25rem;
    }

    .card-group > .card:only-child .card-img-bottom,
    .card-group > .card:only-child .card-footer {
        border-bottom-right-radius: 0.25rem;
        border-bottom-left-radius: 0.25rem;
    }

    .card-group > .card:not(:first-child):not(:last-child):not(:only-child) {
        border-radius: 0;
    }

    .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-img-top,
    .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-img-bottom,
    .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-header,
    .card-group > .card:not(:first-child):not(:last-child):not(:only-child) .card-footer {
        border-radius: 0;
    }

    body .entypo-menu {
        font-size: 30pt;
        color: #FFFFFF;
    }


    body > div.page-container.horizontal-menu > header > div > ul.nav.navbar-right > li.visible-xs > div > a {
        padding: 0;
        transition: none;
        margin: 0;
    }

    body > div.page-container.horizontal-menu > header > div > ul.nav.navbar-right > li.visible-xs > div > a:hover {
        padding: 0;
        transition: none;
    }

}

.card-columns .card {
    margin-bottom: 0.75rem;
}

@media (min-width: 576px) {
    .card-columns {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
        -webkit-column-gap: 1.25rem;
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem;
        orphans: 1;
        widows: 1;
    }

    .card-columns .card {
        display: inline-block;
        width: 100%;
    }
}

.performance-card-wrapper {
    display: inline-block;
    width: 320px;
    padding-right: 15px;
    padding-left: 15px;
}

@media (min-width: 768px) and (max-width: 992px) {
    .main-content > .row > .col-md-12 > .row > .col-sm-4 {
        width: 100%;
    }

    .main-content > .row > .col-md-12 > .row > .col-sm-8 {
        width: 100%;
    }
}

.min-height-40 {
    min-height: 40px;
}

.highlighted {
    box-shadow: 0 0 10px 6px var(--box-shadow-color);
}

.swap {
    min-height: 430px;
    display: block;
}

/* rotated table headers e.g. unavailability view (/availabilities/unavailabilities_view)*/
th.rotated_header {
    height: 120px;
    white-space: nowrap;
}

th.rotated_header > div {
    transform: translate(0px, 41px) rotate(315deg);
    width: 30px;
    position: relative;
    left: 30%;
}

th.rotated_header > div > span {
    border-bottom: 1px solid #ccc;
    padding: 5px 10px;
}

.color-inherit {
    color: inherit;
}

@media print {
    a[href]:after {
        content: none !important;
    }
}

.maintenance-task > div {
    color: #222 !important;
}

.maintenance-task-open {
    color: #222 !important;
    background-color: var(--color-background-maintenance-open, #FFFFFF) !important;
}

.maintenance-task-warning {
    color: #222 !important;
    background-color: #FFFFE0 !important;
}

.maintenance-task-closed {
    color: #222 !important;
    background-color: var(--color-background-maintenance-closed, #ddecde) !important;
}

.maintenance-task-execution {
    color: #222 !important;
    background-color: var(--color-background-maintenance-execution, #b6c3cc) !important;
}

.maintenance-task-paused {
    color: #222 !important;
    background-color: var(--color-background-maintenance-paused, #f2c787) !important;
}

.maintenance-task-assigned {
    color: #222 !important;
    background-color: #ccc !important;
}

.maintenance-task-assigned {
    color: #222 !important;
    background-color: #ccc !important;
}

.maintenance-item-short {
    color: #222 !important;
    background-color: var(--color-background-maintenance-items-short, #f2c787) !important;
}

.table-striped > tbody > tr:nth-child(odd).maintenance-item-short > td {
    color: #222 !important;
    background-color: var(--color-background-maintenance-items-short, #f2c787) !important;
}

.responsive-picture {
    height: auto;
    width: 100%;
    margin: 2px;
}

.hr-darker {
    border: 1px solid #878889;
}

.report-row {
    margin-bottom: 10px;
}

.underlined {
    text-decoration: underline;
}

.mobile-task-status-icon {
    font-size: 18px !important;
    padding-top: 12px;
}

#sandbox-container {
    padding-left: 0;
}

input.input-sm.form-control.hasDatepicker {
    color: #878889;
}

span.input-group-addon {
    color: #727374;
    font-weight: bold;
}

.tile-stats.tile-red {
    background: var(--color-RPred);
    color: #FFF !important;
}

.tile-stats.tile-red:hover {
    background: var(--color-RPred);
}

.table-group {
    border-bottom: 2px solid #000000;
}

div > a > span.badge-primary {
    font-weight: bold;
    font-size: 1em;
}

/*
 * Colors for accessibly reports (e.g. used in CMMS monthly report)
 * see https://material.io/design/color/the-color-system.html#color-theme-creation for more information
 */

.red50 {
    color: #e0f8fa;
}

.red100 {
    color: #b3edf2;
}

.red200 {
    color: #92D6DD;
}

.red300 {
    color: #50d3e1;
}

.red400 {
    color: #2acadb;
}

.red500 {
    color: #08c0d5;
}

.red600 {
    color: #08b0c2;
}

.red700 {
    color: #029AA9;
}

.red800 {
    color: #078791;
}

.red900 {
    color: #006A74;
}

.redwarn100 {
    color: #b3edf2;
}

.redwarn200 {
    color: #92D6DD;
}

.redwarn400 {
    color: #2acadb;
}

.redwarn700 {
    color: #029AA9;
}

.grey50 {
    color: #ffffff;
}

.grey100 {
    color: #fcfdfe;
}

.grey200 {
    color: #f7f8f9;
}

.grey300 {
    color: #f2f3f4;
}

.grey400 {
    color: #edeeef;
}

.grey500 {
    color: #cfd0d1;
}

.grey600 {
    color: #b2b3b4;
}

.grey700 {
    color: #878889;
}

.grey800 {
    color: #727374;
}

.grey900 {
    color: #525354;
}

.greywarn100 {
    color: #fcfdfe;
}

.greywarn200 {
    color: #f7f8f9;
}

.greywarn400 {
    color: #edeeef;
}

.greywarn700 {
    color: #878889;
}

.grey_bold_border {
    border-right: 4px solid #727374 !important;
}

/* Fixes an issue with the navbar buttons (nav bar menu is not hidden correctly w.r.t. the screen size) */
@media (min-width: 768px) {
    .navbar-right {
        margin-right: 0px;
    }

    .horizontal-mobile-menu {
        display: none
    }
}

.iframe_fullscreen_no_border {
    width: 100%;
    min-width: 1600px;
    overflow: auto;
    margin: auto;
    min-height: 72vh;
    height: 100%;
    border: 0 !important;
}

.resp-container {
    position: relative;
    overflow: hidden;
    padding-top: calc(100vh - 105px);
}

.resp-container-homescreen {
    position: relative;
    overflow: hidden;
    padding-top: calc(100vh - 183px);
}


.resp-iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
}

/* This section styles the quantity_evaluation/details report.
 To merge into development move the following section in the file "assets/css/custom/custom_reports.css". */
@media print {
    .quantity_evaluation_data_card {
        display: flex;
        width: 100%;
        page-break-inside: avoid;
        margin-bottom: 15px;
    }

    .quantity_evaluation_upper_card {
        width: 50%;
    }

    .quantity_evaluation_lower_card {
        width: 50%;
        margin: auto 0;
    }
}

.warning-li {
    background-color: #727374 !important;
}

.vertically-centered {
    vertical-align: middle !important;
}

.white-row {
    background-color: #FFFFFF;
}
/* line 1, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-page-container {
  min-height: 100vh;
  width: 100vw;
}

/* line 6, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-container {
  background: #FFF;
  margin: 0 auto auto calc(50vw - 138px);
  color: var(--color-RPgrey, #9d9d9c);
  width: 275px;
  min-height: 432px;
  -ms-transform: translateY(-50%);
  padding-top: calc(50vh - 300px);
}

/* line 16, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-OES {
  margin: auto;
  text-align: center;
  font-size: 16px;
}

/* line 22, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-span {
  background-color: var(--color-RPred, #981a1c);
  width: 52.5%;
  height: 3px;
  margin: 31.75% auto auto auto;
}

/* line 33, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-bottom-links {
  margin-top: calc(max(0px, 50vh - 400px));
  text-align: center;
  margin-right: auto;
}

/* line 39, app/assets/stylesheets/knapp/custom_login_page.scss */
body.login-page {
  color: var(--color-RPgrey, #9d9d9c);
}

/* line 43, app/assets/stylesheets/knapp/custom_login_page.scss */
body.login-page .login-form .form-group .input-group {
  background: #FFF;
  border: 2px solid var(--color-RPgrey, #9d9d9c);
  border-radius: 0px;
  height: 38px;
  padding: 0px;
}

/* line 51, app/assets/stylesheets/knapp/custom_login_page.scss */
body.login-page .login-form .form-group .input-group .input-group-addon:after {
  background: #FFF;
}

/* line 55, app/assets/stylesheets/knapp/custom_login_page.scss */
.icon-keyuser-new {
  width: 25px;
}

/* line 59, app/assets/stylesheets/knapp/custom_login_page.scss */
.icon-key-new {
  width: 25px;
}

/* line 63, app/assets/stylesheets/knapp/custom_login_page.scss */
body.login-page .login-form .form-group .btn-login {
  text-align: center;
  border-radius: 0px;
  background: #9c9c9d;
  border-color: #9c9c9d;
  padding: 12px 20px 12px 20px;
}

/* line 71, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-page .login-content {
  margin: 6% auto 0 auto;
}

/* line 75, app/assets/stylesheets/knapp/custom_login_page.scss */
body.login-page .login-form .form-group .input-group .form-control {
  background-color: #ffffff !important;
  color: #000 !important;
  padding-top: 12px;
}

/* line 81, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-page .login-form .form-group .input-group .input-group-addon {
  padding: 0px 10px 0px 5px;
}

/* line 85, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-page .login-form {
  padding: 60px 0 0 0;
}

/* line 89, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-page.login-form-fall .login-form .form-group {
  margin: 0 0 11% 0;
}

/* line 94, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-error-container {
  position: absolute;
  left: 270px;
  bottom: -8px;
  width: 250px;
}

/* line 101, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-error-message > * {
  font-size: 12px;
  text-align: left;
  color: #424242;
  margin: 5px 0 0 0;
}

/* line 108, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-error-message::before {
  content: url(/assets/svg/mat-icons/warning-yellow-36dp-5ca0fcde8789a6be4d13ab1fc4eafee047697e394ba9d971a85a371a2540b5c9.svg);
  float: left;
  margin: 0 10px 0 0px;
}

/* line 114, app/assets/stylesheets/knapp/custom_login_page.scss */
.login-error-message {
  margin: 27px 10px 0 0px;
}
.modal-body {
    max-height: 70vh;
    overflow-y: auto;
}

/* ensure, that the modal (as well as its background) container stretch over the whole body container */
.modal .modal-backdrop{
    height: 100%;
}
:root {
    --color-menu-main: #424242;
    --color-menu-main-selected: #757575;
    --color-menu-sub: #424242;
    --color-menu-sub-selected: #757575;
    --color-menu-font-selected: #FFF;
    --color-menu-shadow: rgba(0, 0, 0, 0.25);
}

.navbar-right {
    height: 50px;
    width: 7%;
}

.navbar-inner {
    height: 100%;
    width: 100%;
}

.navbar-brand {
    background: white;
    border-radius: 50px;
}

.navbar-brand-img {
    height: 24.5px;
    margin-left: 8px;
}

.page-container.horizontal-menu header.navbar .navbar-brand {
    margin: 0 66px 0 0;
    height: 45px;
    width: 70px;
    border-radius: 5px;
    background: var(--color-menu-main);
    padding: 0;
}

body .page-container.horizontal-menu header.navbar {
    box-shadow: 2px 2px 8px var(--color-menu-shadow);
    background: var(--color-menu-main);
    height: 55px;
}

.navbar-nav > li.root-level {
    margin: 0;
    padding: 0 2px;
    background: var(--color-menu-main);
    flex: 0 1 auto;
}


header.navbar .navbar-nav > li > a > span {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 0 0 4px;
    /*move to relevant media-query*/
}

body .page-container.horizontal-menu header.navbar ul.nav > li > a {
    font-size: 25px;
    font-weight: 100;
    margin: 19px 0 0 2px;
    color: transparent;
}

body .page-container.horizontal-menu header.navbar ul.nav > li > a:hover {
    color: transparent;
}

.page-container.horizontal-menu header.navbar .navbar-nav > li ul li a {
    border: none;
}


body .page-container.horizontal-menu header.navbar .navbar-nav {
    border: none;
    width: 68%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}


body .page-container.horizontal-menu header.navbar .navbar-nav > li ul {
    background: var(--color-menu-sub-selected);
    color: var(--color-menu-font-selected);
    box-shadow: 2px 2px 4px var(--color-menu-shadow);
}

body .page-container.horizontal-menu header.navbar .navbar-nav > li ul li:hover {
    background: var(--color-menu-sub);
    color: var(--color-menu-font-selected);
}

body .page-container.horizontal-menu header.navbar .navbar-nav > li ul li a {
    background: var(--color-menu-sub);
    color: var(--color-menu-font-selected);
}

body .page-container.horizontal-menu header.navbar .navbar-nav > li ul li a::before {
    color: #FFF !important;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(1) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(2) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(3) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(4) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(5) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(6) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(7) > ul > li > ul {
    margin-left: 6px;
}

body > div.page-container.horizontal-menu > header > div > ul.navbar-nav > li:nth-child(8) > ul > li > ul {
    margin-left: 6px;
}


.navbar-icon {
    width: 35px;
    margin: -1px 0 -4px 0;
    pointer-events: none;

}

.page-container.horizontal-menu header.navbar .navbar-nav > li > a {
    padding: 38px 26px 33px 11px;
    color: #404040;
    border: none;
}

.page-container.horizontal-menu header.navbar .navbar-brand {
    height: 40px;
    padding-top: 8px;
    width: 98px;
    background: white;
    margin: 8px 8px 0px 8px !important;
}

@media (min-width: 768px) {
    .navbar-right {
        height: auto;
        width: 20%;
        margin: -5px 0 0 0;
    }

    .navbar-right > li.hidden-xs {
        display: flex;
        align-items: flex-end;
        width: 100%;
    }

    body > div.page-container.horizontal-menu.sidebar-collapsed > header > div > ul.nav.navbar-right > li.hidden-xs > a:nth-child(2) > img {
        margin: -12.5px 0 0 2px;
    }

    body .page-container.horizontal-menu header.navbar ul.nav > li > a {
        width: 65px;
        height: 10px;
        margin: -3px 0 0 2px;
    }

    .page-container.horizontal-menu header.navbar .navbar-nav > li > a > span {
        display: none
    }

    .navbar-icon {
        height: 24.5px;
    }


}

.page-container.horizontal-menu header.navbar .navbar-nav > li > a {
    padding: 15px 11px 13px 11px;
    color: #FFF;
    border: none;
    margin-bottom: 3px;
}

.page-container.horizontal-menu header.navbar .navbar-brand {
    margin: 0 17px 0 0;
}

body .page-container.horizontal-menu header.navbar .navbar-nav {
    width: 55%;
    height: 100%;

}

@media (min-width: 992px) {
    .navbar-right {
        width: 18%;
    }

    .page-container.horizontal-menu header.navbar .navbar-nav > li > a {
        padding: 15px 11px 15px 11px;
        color: #FFF;
        border: none;
        margin-bottom: 3px;
    }
}

@media (min-width: 1200px) {
    .page-container.horizontal-menu header.navbar .navbar-nav > li > a {
        padding-top: 9px;
    }

    .navbar-right {
        width: 23%;
        margin: -4px 0 0 0;
    }


    .page-container.horizontal-menu header.navbar .navbar-nav > li > a > span {
        display: inline;
    }

    body .page-container.horizontal-menu header.navbar .navbar-nav {
        width: 65%;
        height: 48px;
        margin: 7px 0 0 0;
        justify-content: left;
    }

    body .page-container.horizontal-menu header.navbar ul.nav > li > a {
        color: #FFF;
        font-size: 16px;
        font-weight: 600;
        width: auto;
    }

    body .page-container.horizontal-menu header.navbar ul.nav > li > a:hover {
        color: var(--color-menu-font-selected);
    }
}

@media (min-width: 1500px) {
    .navbar-right {
        width: 22%;
    }

    body .page-container.horizontal-menu header.navbar ul.nav > li > a {
        width: 200px;
        height: 10px;
        margin: -3px 0 0 2px;
    }
}

/* Mobile Navbar Selectors*/
@media (max-width: 768px) {

    .mobile-navbar-nav.mobile-navbar-right {
        display: flex;
        padding: 0;
        flex-wrap: wrap-reverse;
        width: 57px;
        position: absolute;
        right: 10px;
        top: 0;
    }

    .mobile-navbar-inner > .mobile-navbar-nav > li {
        margin-top: 7px;
    }

    .mobile-navbar-nav.mobile-navbar-right > li:nth-child(1) {
        order: 2;
    }

    .mobile-navbar-nav.mobile-navbar-right > li:nth-child(2) {
        order: 1;
    }

    .mobile-navbar-nav.mobile-navbar-right > li:nth-child(3) {
        order: 3;
    }

    .mobile-navbar-nav.mobile-navbar-right > li {
        margin-left: 3%;
    }

    .mobile-navbar-nav.mobile-navbar-right > li {
        padding-left: 0px;
        margin-top: 25px;
    }

    .mobile-navbar-nav.mobile-navbar-center {
        display: none;
        flex-wrap: wrap;
        width: 250px;
        height: 200px;
    }

    .mobile-navbar-nav.mobile-navbar-center > li > a > span {
        display: inline-block;
        color: var(--color-menu-font-selected);
        font-weight: 600;
        font-size: 16px;
        margin-left: 15px;
    }

}

.mobile-navbar-right > .visible-xs > div > a > .entypo-menu {
    font-size: 30pt;
    color: #FFF;
}

.mobile-navbar-nav.mobile-navbar-right > li.visible-xs {
    height: 50px;
    margin: 0 0 0 -15px;
}

.mobile-navbar-inner {
    display: grid;
    grid-template-columns: 45px 3fr 1fr;
    grid-template-rows: auto;
    justify-content: start;
    grid-gap: 15px
}

header.mobile-navbar {
    box-shadow: 2px 2px 8px var(--color-menu-shadow);
    background: var(--color-menu-main);
    height: 55px;
}

.mobile-navbar .navbar-brand {
    height: 45px;
    width: 45px;
    margin: -4px 3% 0 -8px;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}

.mobile-navbar-nav {
    border: none;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: left;
    list-style: none;
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    overflow: auto;
}

.mobile-navbar-right {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
}

.mobile-navbar-nav > li {
    margin: 15px 5% 0 0;
    padding: 0 1px;
    background: var(--color-menu-main);
    flex: 0 1 auto;
    flex-wrap: nowrap;
    align-items: baseline;
    padding-bottom: 5px
}

.mobile-navbar-nav > li > a > span {
    display: none;
}

.mobile-navbar-nav > li > a {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    height: 27px;
}

.mobile-navbar-nav > li {
    margin-left: 1%;
}


.mobile-navbar-icon {
    width: auto;
    height: 24.5px;
    margin: -2px 0 0 0;
    pointer-events: none;
}

@media (min-width: 992px) {
    .mobile-navbar-nav > li > a > span {
        display: block;
        color: var(--color-menu-font-selected);
        font-weight: 600;
        font-size: 16px;
        margin: 0 0 0 10px;
    }

    .mobile-navbar-inner {
        grid-template-columns: 45px 1fr 330px;
    }

    .mobile-navbar-right > li {
        margin-left: 0;
    }

}
.panel-body {
    padding-top: 0px;
}

.panel-primary {
    border-radius: 3px;
}

.panel-warning-with-icon > img {
    height: 35px;
    padding: 0 0 0 10px;
}

.panel-warning-with-icon > div {
    padding: 0 0 0 20px;
}

.panel-warning-with-icon > div > a {
    color: #404040;
    font-size: 16px;
}

.panel-warning-with-icon > div > span {
    color: var(--color-RPred);
    font-size: 18px;
    font-weight: bold;
}

.panel-warning-with-icon {
    height: 60px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.panel-warning-with-icon > .panel-heading {
    padding: 0px 15px;
}

.panel-body.with-table {
    overflow: auto;
}

div.panel-title {
    margin-top: 15px;
    margin-bottom: 8px;
    margin-left: 6px;
}

div.panel-heading {
    padding: 0;
}

.panel-heading > .panel-title {
    padding: 10px 0;
}

.tile-progress .tile-header {
    padding: 15px 20px;
    padding-bottom: 15px;
}

.tile-stats {
    padding: 10px;
    overflow: visible;
}

.tile-stats.tile-gray {
    background: rgb(235, 235, 235);
    border: none;
}

.tile-stats.tile-gray:hover {
    background: rgb(235, 235, 235);

}

.tile-stats:hover {
    background: var(--color-background-main, #FFF);
}

.tile-stats div.fadable-white {
    color: #303641;
}

.tile-stats .num, .tile-stats h3, .tile-stats p {
    position: relative;
    color: #303641;
    z-index: 5;
    margin: 0;
    padding: 0;
}


.tile-thin {
    padding: 1px;
    text-align: right;
}


.tile-stats div,
.tile-stats p {
    text-align: right;
}

.tile-stats.tile-red div {
    color: var(--color-font-dark-blue);
}

.smalltile-grey {
    background-color: #BBBBBB;
    border-radius: 2px;
    padding: 1px;
    color: black;
}

.smalltile-red {
    background-color: var(--color-RPred);
    border-radius: 2px;
    padding: 1px;
    color: #FFFFFF !important;
}

.smalltile-red:hover {
    background: var(--color-RPred);
}

.smalltile-red .icon {
    color: rgba(0, 0, 0, 0.1);
}

div.smalltile-red a {
    color: #FFFFFF;
}


.tile-orange div {
    color: #444;
}

.tile-totals {
    border: 2px solid #000 !important;
}

/*.tile-stats {
  margin-bottom: 0px !important;
}*/

.tile-stats.tile-white p {
    color: #000 !important;
}

.tile-stats.tile-red-white {
    background-color: #F44336;
    color: #FFFFFF !important;
}

.tile-stats.tile-no-background {
    /*background-color: #F2F2F2 !important;*/
    background: none;
    border: 1px solid #BBBBBB;
    color: #4F4F4F !important;
}

.custom-tile {
    background: none;
    border: 1px solid #BBBBBB;
    color: #4F4F4F !important;
    border-radius: 5px;
    padding: 0px 15px 0px 15px;
}

.tile-stats.tile-red {
    background: var(--color-RPred);
    color: #FFF !important;
}

.tile-stats.tile-red:hover {
    background: var(--color-RPred);
}

.tile-stats.tile-cmms-home {
    border: 1pt solid var(--box-shadow-color);
    height: 100%;
    width: 100%;
    margin: 0 0 0 -3px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    border-radius: 3px;
    align-items: center;
}

.tile-cmms-home > div > img {
    height: 55px;
}

.tile-cmms-home .num {
    font-size: 33px;
    font-weight: 100;
    margin: 0 6px 0 20px;
}

.tile-cmms-home > .flexhelper {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: baseline;
}

@media (min-width: 992px) and (max-width: 1100px) {
    .tile-cmms-home > .flexhelper {
        position: relative;
        right: 17px;
    }
}

@media (min-width: 992px) and (max-width: 1500px) {
    .tile-cmms-home > .flexhelper {
        flex-wrap: wrap-reverse;
        justify-content: flex-end;
    }

    .tile-cmms-home > .flexhelper > h3 {
        flex-basis: 100%;
    }

}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *


 */