﻿#color-quality,
#color-quality-wizard {
    height: 100%;
}

#color-quality .left-side-content,
#color-quality-wizard .left-side,
#color-quality-wizard .left-side-content {
    height: 100%;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

#color-quality-wizard .left-side {
    height: 100%;
    padding: 5px;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

#color-quality .right-side-content {
    height: 100%;
    margin: 0;
    padding-left: 5px;
}

#color-quality-wizard .right-side-content {
    height: -moz-calc(100% - 10px);
    height: -webkit-calc(100% - 10px);
    height: calc(100% - 10px);
    margin: 0;
}

#color-quality-wizard .right-side {
    height: 100%;
    padding: 5px 5px 5px 10px;
    margin: 0;
}

#color-quality-wizard .right-side-top {
    min-height: 55px;
}

#color-quality-wizard .right-side-bottom {
    height: -moz-calc(100% - 86px);
    height: -webkit-calc(100% - 86px);
    height: calc(100% - 86px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
}

#color-quality .mosaic-widget-header-right {
    float: right;
    margin-top: -25px;
    width: initial;
}

#job-information-widget .visibility-disabled-for-template,
#job-conditions .visibility-disabled-for-template,
#target-widget .visibility-disabled-for-template,
#attribute-general-settings .visibility-disabled-for-template,
#color-quality-general-settings .visibility-disabled-for-template {
    background-color: #dddddd !important;
}

#job-information-widget .visibility-hidden-for-template,
#job-conditions .visibility-hidden-for-template,
#target-widget .visibility-hidden-for-template,
#attribute-general-settings .visibility-hidden-for-template,
#color-quality-general-settings .visibility-hidden-for-template {
    background-color: #dddddd !important;
    font-style: italic !important;
}

/* Summary with action */
#color-quality #summary-with-action {
    margin-top: -30px;
}

#color-quality #summary-with-action .button-container {
    display: inline-block;
    position: relative;
    width: 100%;
    margin-top: 5px;
}

#color-quality #summary-with-action .button-container button {
    margin-left: 5px;
    margin-bottom: 5px;
}

/* Title */
#color-quality #title-view,
#color-quality-wizard #title-view {
    padding: 5px;
    height: 100px;
    position: relative;
}

#color-quality #block-group,
#color-quality-wizard #block-group {
    position: absolute;
    left: 5px;
    top: 2px;
    height: 60px;
    width: 60px;
}

#color-quality .mosaic-controller-group,
#color-quality-wizard .mosaic-controller-group {
    position: absolute;
    top: -10px;
    right: 0;
    height: 10px;
    width: 50px;
}

#color-quality .mosaic-controller-group .mosaic-block-div,
#color-quality-wizard .mosaic-controller-group .mosaic-block-div {
    display: initial;
    float: right;
}

#color-quality .main-title,
#color-quality-wizard .main-title {
    position: relative;
    margin-left: 40px;
    margin-top: 12px;
    font-weight: 300;
}

#color-quality .title,
#color-quality-wizard .title {
    text-align: right;
    margin-left: 10px;
    margin-top: 10px;
    margin-right: 10px;
}

#color-quality .sub-title,
#color-quality-wizard .sub-title {
    text-align: right;
    margin-left: 10px;
    margin-bottom: 10px;
}

#color-quality .main-title span,
#color-quality .sub-title,
#color-quality-wizard .main-title span,
#color-quality-wizard .sub-title {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Form stuff */
#color-quality .form-wrapper {
    padding: 15px;
}

#color-quality-wizard .form-wrapper {
    padding: 0;
}

#color-quality-wizard .form-container {

}

#color-quality-wizard .form-container .form-row {
    /*margin-top: 5px;*/
}

#color-quality-wizard .form-container .form-row .left-side,
#color-quality-wizard .form-container .form-row .left-side-content {
    text-align: right;
}

#color-quality-wizard .form-container .form-row .right-side,
#color-quality-wizard .form-container .form-row .right-side-content {
    padding-right: 25px;
}

#color-quality-wizard .form-container .form-row .right-side input[type=text],
#color-quality-wizard .form-container .form-row .right-side-content input[type=text],
#color-quality-wizard .form-container .form-row .right-side select,
#color-quality-wizard .form-container .form-row .right-side-content select {
    width: 100%;
}

#color-quality .custom-width,
#color-quality-wizard .custom-width {
    width: -moz-calc(100% - 10px);
    width: -webkit-calc(100% - 10px);
    width: calc(100% - 10px);
}

#color-quality .relative-position {
    position: relative;
}

#color-quality .margin-right-5 {
    margin-right: 5px;
}


/*TODO: Think about where to put this*/
#chart-widget .mosaic-widget-content {
    height: calc(100% - 48px);
}

/*TODO: Think about where to put this*/
#chart-widget #chartApp, #chart-widget .cie-lab-chart-app, #chart-widget .spectrum-chart-app {
    height: 100%;
}


/* Widgets */
#color-quality #color-quality-widgets {
    height: 100%;
    padding: 0;
    overflow: hidden;
}

#color-quality #color-quality-widgets #gridster-inner-wrapper {
    height: 100%;
}

#color-quality #color-quality-widgets #gridster-inner-wrapper #gridster {
    height: -moz-calc(100% - 5px) !important;
    height: -webkit-calc(100% - 5px) !important;
    height: calc(100% - 5px) !important;
}

#color-quality #color-quality-widgets #gridster-inner-wrapper #gridster #gridster-container {
    width: 100%;
}

#color-quality #color-quality-widgets #gridster-inner-wrapper #gridster #gridster-container .gridster-item {
    cursor: auto;
}

#color-quality #color-quality-widgets #measurement-buttons,
#color-quality #color-quality-widgets #all-measurement-button {
    height: 23px;
    text-align: right;
    position: absolute;
    right: 20px;
    top: 44px;
    z-index: 10;
    border-left: 1px solid rgba(196, 196, 196, 1);
}

#color-quality #color-quality-widgets #measurement-buttons button,
#color-quality #color-quality-widgets #all-measurement-button button {
    height: 23px;
    padding-top: 1px;
}

#color-quality #color-quality-widgets #measurement-buttons #number-of-measurements-group {
    display: inline;
}

#color-quality #color-quality-widgets #measurement-buttons #number-of-measurements-group input {
    width: 40px;
}

#color-quality #color-quality-widgets #measurement-buttons .measurement-action-button,
#color-quality #color-quality-widgets #measurement-buttons .delete-button {
    margin-right: 3px;
}

#color-quality #color-quality-widgets .single-widget .mosaic-widget-content {
    width: 100%;
    height: -moz-calc(100% - 48px);
    height: -webkit-calc(100% - 48px);
    height: calc(100% - 48px);
}

#widget-chooser .mosaic-widget-content {
    width: 100%;
    height: -moz-calc(100% - 48px);
    height: -webkit-calc(100% - 48px);
    height: calc(100% - 48px);
}

#widget-chooser .settings-icon-container {
    right: 9px ! important;
    top: 24px ! important;
}

#color-quality #color-quality-widgets .single-widget .chart-container {
    overflow-y: auto;
}

/* overwrite tab-menu style --> trim width for measurement-buttons */
#color-quality .trim-right-side-small #tab-menu .tab-submenu-container .tab-submenu {
    width: -moz-calc(100% - 165px);
    width: -webkit-calc(100% - 165px);
    width: calc(100% - 165px);
}

#color-quality .trim-right-side-medium #tab-menu .tab-submenu-container .tab-submenu {
    width: -moz-calc(100% - 179px);
    width: -webkit-calc(100% - 179px);
    width: calc(100% - 179px);
}

#color-quality .trim-right-side-large #tab-menu .tab-submenu-container .tab-submenu {
    width: -moz-calc(100% - 203px);
    width: -webkit-calc(100% - 203px);
    width: calc(100% - 203px);
}

#color-quality .trim-right-side-xlarge #tab-menu .tab-submenu-container .tab-submenu {
    width: -moz-calc(100% - 227px);
    width: -webkit-calc(100% - 227px);
    width: calc(100% - 227px);
}

#color-quality .trim-right-side-single-button #tab-menu .tab-submenu-container .tab-submenu {
    width: -moz-calc(100% - 28px);
    width: -webkit-calc(100% - 28px);
    width: calc(100% - 28px);
}


#limits-tabs .tabs .nav-tabs,
#limits-tabs .tab-submenu-container .nav-tabs {
    border-bottom: none !important;
}

#limits-tabs .tabs .tab {
    float: left;
    display: block;
}
#limits-tabs .tabs .tab-label {
    display: block;
    padding: 8px 10px;
    border-radius: 0;
    font-weight: normal;
    background: #eeeeee;
    cursor: pointer;
    position: relative;
    top: 4px;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    outline: none !important;
    border-bottom: none;
    border-top: 1px solid rgba(196, 196, 196, 1);
    border-left: 1px solid rgba(196, 196, 196, 1);
    border-right: 1px solid rgba(196, 196, 196, 1);
}
#limits-tabs .tabs .tab-label:hover {
    background: #eeeeee;
    color: #777777;
    top: 0;
    padding: 10px 10px;
    border-bottom: none;
    border-top: 1px solid rgba(196, 196, 196, 1);
    border-left: 1px solid rgba(196, 196, 196, 1);
    border-right: 1px solid rgba(196, 196, 196, 1);
}
#limits-tabs .tabs .nav-tabs .tab:last-child {
    margin-left: 2px;
}
#limits-tabs .tabs .tab-label.current {
    z-index: 999;
    top: 0;
    padding: 9px 10px;
    background: white;
    font-weight: bold;
    border: none;
    border-top: 1px solid rgba(196, 196, 196, 1);
    border-left: 1px solid rgba(196, 196, 196, 1);
    border-right: 1px solid rgba(196, 196, 196, 1);
}
#limits-tabs .tab-content {
    z-index: 2;
    display: block;

    width: calc(100% - 8px);
    height: -moz-calc(100% - 98px);
    height: -webkit-calc(100% - 98px);
    height: calc(100% - 98px);
    position: absolute;
    top: 93px;
    left: 0;
    background: white;
    margin-left: 4px;
    margin-right: 4px;
    border: 1px solid rgba(196, 196, 196, 1);
}
#limits-tabs .tab-content #limit-group-tabs,
#limits-tabs .tab-content #limit-group-tabs .new-limit,
#limits-tabs .tab-content #limit-group-tabs .select-and-delete {
    padding: 10px 10px 0 10px;
}

#limits-tabs .tab-content #limit-group-tabs .select-and-delete .not-all-limits-selected {
    background-color: rgba(196, 196, 196, 1)!important;
    border: none !important;
}

#limits-tabs .tab-content #limit-group-tabs .select-and-delete .limits-button {
    width: 32px;
    margin-right: 8px;
}

#color-quality #color-quality-widgets .single-widget .max-min-container,
#color-quality-wizard #layout-container #widget-chooser .max-min-container {
    height: 20px;
    width: 20px;
    text-align: center;
    color: rgba(196, 196, 196, 1);
}

#color-quality #color-quality-widgets .single-widget .max-min-container:hover,
#color-quality-wizard #layout-container #widget-chooser .max-min-container:hover {
    color: #000000;
}

#color-quality .enable-disable-switch {
    display: inline-block;
    font-size: 17px;
    margin-right: 5px;
    height: 23px;
    float: left;
    padding-left: 5px;
}

#color-quality #all-measurements-container {
    display: block;
    /*display: none;*/
    position: absolute;
    background: #ffffff;
    z-index: 10;
    top: 70px;
    width: 100%;
    /*height: 0;*/
    height: -moz-calc(100% - 70px);
    height: -webkit-calc(100% - 70px);
    height: calc(100% - 70px);
}

#color-quality .full-screen {
    display: block !important;
    height: -moz-calc(100% - 70px) !important;
    height: -webkit-calc(100% - 70px) !important;
    height: calc(100% - 70px) !important;
}

#color-quality #all-measurements-container .close-button-container {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 16px;
    color: rgba(196, 196, 196, 1);
}

#color-quality #all-measurements-container .close-button-container:hover {
    color: #000000;
}

#color-quality #all-measurements-container .mosaic-widget-content {
    height: -moz-calc(100% - 50px);
    height: -webkit-calc(100% - 50px);
    height: calc(100% - 50px);
}

#color-quality #all-measurements-container .colibri-grid,
#color-quality #all-measurements-container .colibri-grid-view {
    height: 100% !important;
}

#color-quality .switch-disabled {
    color: #dddddd;
}

#color-quality #layout-pages-container .text-disabled .tab-content .mosaic-widget {
    background-color: #dddddd;
    color: #999999;
}

#color-quality #layout-pages-container .text-disabled .tab-content .mosaic-widget td {
    color: #999999 !important;
}

#color-quality #layout-pages-container .text-disabled .tab-content .mosaic-widget text {
    fill: #999999;
}

/* Wizard */
#color-quality-wizard #color-quality-wizard-job-information-colormatch-template-name {
    width: -moz-calc(100% - 25px);
    width: -webkit-calc(100% - 25px);
    width: calc(100% - 25px);
}

#color-quality-wizard #buttons {
    width: 100%;
    display: inline-block;
    margin-top: 10px;
    text-align: center;
}

#color-quality-wizard #buttons #previous-next-buttons #previous-button,
#color-quality-wizard #buttons #previous-next-buttons #next-button {
    float: left;
    margin-right: 3px;
}

#color-quality-wizard #buttons #save-buttons {
    float: right;
}

#color-quality-wizard #buttons .settings-button-group {
    width: 100px;
    display: inline-block;
    text-align: center;
}

.fas.only-mobile {
    font-size: 0;
}

/*Only have left active when screen is large enough to prevent clipping with other buttons.*/
@media only screen and (min-width: 1450px) {
    #color-quality-wizard #buttons .settings-button-group.settings-button-group-large {
        position: absolute;
        left: -moz-calc(100% - 50px);
        left: -webkit-calc(100% - 50px);
        left: calc(50% - 50px);
    }
}

/*Mobile view*/
@media only screen and (max-width: 991px) {
    #color-quality-wizard .hide-button-text {
        font-size: 0;
    }

    .fas.only-mobile {
        font-size: medium;
    }

    #color-quality-wizard #buttons .settings-button-group.settings-button-group-large {
        position: absolute;
        left: -moz-calc(100% - 50px);
        left: -webkit-calc(100% - 50px);
        left: calc(50% - 50px);
    }
}

#color-quality-wizard #help-container {
    width: 100%;
    text-align: left;
    padding-right: 15px;
    padding-left: 15px;
}

#color-quality-wizard #tolerances-widget {
    height: auto;
}

#color-quality-wizard #job-information-widget {
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    overflow: hidden;
}

#color-quality-wizard #job-information-widget #job-information-form {
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    padding: 10px;
    overflow-x: hidden;
    overflow-y: auto;
}

#color-quality-wizard #job-information-widget #selectedFolderPath,
#color-quality-wizard #job-information-widget #selectedColorQualityReportTemplatePath {
    width: -moz-calc(100% - 25px);
    width: -webkit-calc(100% - 25px);
    width: calc(100% - 25px);
}

#color-quality-wizard #job-information-widget .job-properties-container {
    margin-left: 0;
    margin-right: 0;
}

#color-quality-wizard #job-information-widget .custom-properties-view-model {
    /*
    border-top: 1px solid rgba(196, 196, 196, 1);
    margin-top: 5px;
    */
    margin-left: 0;
    margin-right: 0;
}

#color-quality-wizard #target-widget, 
#color-quality-wizard #job-limits-widget {
    height: auto;
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    overflow: hidden;
}

#color-quality-wizard .color-quality-summary-traffic-light svg {
    width: 100%;
    height: 100%;
}

#color-quality-wizard #target-widget-container{
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    padding-bottom: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    float: left;
    width: 100%;
}
#color-quality-wizard #target-widget-container #target-selection-view-model{
    height: 100%;
}
#color-quality-wizard #tolerances-widget-container {
    padding: 10px;
}

#color-quality-wizard #display-widget {
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    overflow: hidden;
}

#color-quality-wizard #layout-container {
    height: auto;
    padding: 0;
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    overflow: hidden;
}

#color-quality #layout-pages-container,
#color-quality-wizard #layout-pages-container {
    display: inline-block;
    width: 100%;
    height: 100%;
    padding: 0;
}

#color-quality-wizard #layout-container #widget-chooser .mosaic-widget-header-middle {
    width: auto;
    margin-top: 4px;
    padding-left: 10px;
}

#color-quality-wizard #layout-container #widget-chooser select {
    width: 100%;
}

#color-quality-wizard #layout-container .remove-page-button-container {
    position: relative;
    top: -8px;
    right: -5px;
}

#color-quality-wizard #layout-container .remove-page-button-container:hover {
    color: black;
}

#color-quality-wizard .not-valid {
    border-color: red;
}

#color-quality-wizard #layout-container .dummy-title {
    margin: 0 0 5px 5px;
}

#color-quality-wizard #layout-container .dummy-preview {
    margin: 0 0 0 5px;
}

/* The tooltip is directly added to the html tag, so no prefix here. */
.save-path-schema-tooltip .tooltip-inner {
    max-width: 370px;
    width: auto;
    margin: 0;
    padding: 0;
}

.save-path-schema-tooltip .tooltip-inner textarea {
    max-width: 365px;
    width: 370px;
    height: 500px;
    color: black;
}


#color-quality-wizard #color-quality-wizard-recipe-widget {
    height: auto;
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    overflow: hidden;
}

#color-quality-wizard-recipe-widget .recipe-targets .recipe-target-element {
    display: inline-block;
    width: 50px;
    height: 50px;
    margin-right: 4px;
}

#color-quality-wizard-recipe-widget .recipe-targets .recipe-target-element.selected {
    border: dashed blue;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .mosaic-widget-content {
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
    padding: 10px 5px 5px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .edit-recipe {
    margin-bottom: 10px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .edit-recipe .mosaic-sub-widget-content {
    display: inline-block;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .edit-recipe .mosaic-sub-widget-content .key-value-container {
    display: inline-block;
    height: 100%;
    width: 100%;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .edit-recipe .mosaic-sub-widget-content .key-value-container .key {
    font-weight: bold;
    float: left;
    margin-right: 15px;
    margin-top: 2px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .edit-recipe .mosaic-sub-widget-content .key-value-container .value {
    float: left;
    width: 150px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes {
    height: -moz-calc(100% - 102px);
    height: -webkit-calc(100% - 102px);
    height: calc(100% - 102px);
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .mosaic-sub-widget-content {
    height: -moz-calc(100% - 35px);
    height: -webkit-calc(100% - 35px);
    height: calc(100% - 35px);
    overflow-y: auto;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .edit-recipe .mosaic-sub-widget-content .key-value-container {
    display: inline-block;
    height: 100%;
    width: 100%;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .mosaic-sub-widget-content .key-value-container .row {
    margin: 0 0 5px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .mosaic-sub-widget-content .key-value-container .row .key {
    font-weight: bold;
    float: left;
    margin-right: 15px;
    margin-top: 2px;
    width: 120px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .mosaic-sub-widget-content .key-value-container .row .value {
    float: left;
    width: 175px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .mosaic-sub-widget-content .key-value-container .row .value select {
    width: 100%;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .edit-job-recipe {
    margin-top: 15px;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .edit-job-recipe .ui-grid-viewport,
#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .edit-job-recipe .colibri-grid {
    height: auto !important;
}

#color-quality-wizard #color-quality-wizard-recipe-widget .color-quality-wizard-recipes .edit-job-recipe .ui-grid-footer-cell .ui-grid-cell-contents,
#color-quality .edit-job-measurement-recipe .ui-grid-footer-cell .ui-grid-cell-contents {
    text-align: right;
}

.thicknessDefinitionInputStyleSelector > div {
    display: inline-block;
}

#color-quality .thicknessDefinitionInputStyleSelector .thickness-definition-selection-check-boxes,
#color-quality-wizard .thicknessDefinitionInputStyleSelector .thickness-definition-selection-check-boxes {
    width: 100%;
    max-width: 150px;
}

#color-quality .thicknessDefinitionInputStyleSelector .thickness-definition-selection-check-boxes span.mosaic-radio,
#color-quality-wizard .thicknessDefinitionInputStyleSelector .thickness-definition-selection-check-boxes span.mosaic-radio {
    display: inline-block;
    width: 100px;
}

#color-quality .thicknessDefinitionInputStyleSelector .thickness-definition-selection-options,
#color-quality-wizard .thicknessDefinitionInputStyleSelector .thickness-definition-selection-options {
    width: 100%;
    max-width: 100px;
}


/* LIMIT SUMMARY */
.limits-summary .ui-grid-cell-contents {
    padding: 0 5px 5px 5px;
}
.limits-summary .no-limit-defined-label,
.limits-summary .no-target-defined-label {
    padding: 10px 10px 0 10px;
}
.limits-summary .ui-grid-cell-contents .target-limit-colors {
    display: inline-block;
    margin: 0;
    padding: 0;
}
.limits-summary .ui-grid-cell-contents .target-limit-values {
    display: inline-block;
    margin: 0;
    padding: 0;
}
.limits-summary .ui-grid-cell-contents .target-limit-colors .limit-value-color {
    height: 8px;
    width: 40px;
    margin: 0;
    padding: 0;
    line-height:8px;
}
.limits-summary .ui-grid-cell-contents .target-limit-values .limit-value-label {
    text-align: right;
    height: 10px;
    width: 20px;
    margin-left: 22px;
    margin-top: 0;
    padding-top: 0;
}
.limits-summary .ui-grid-cell-contents .target-limit-values .hidden-limit-value {
    color: rgba(0, 0, 0, 0);
}
.limits-summary {
    height: calc(100% - 40px);
}
.limits-summary #limits-summary-grid-with-targets,
.limits-summary #limits-summary-grid-with-targets > div {
    height: 100%;
}
.limits-summary .color-limit-preference {
    padding: 20px 10px 20px 10px;
}
.limits-summary .colibri-grid-view {
    height: 100%!important;
}
.limits-summary .colibri-grid-view .colibri-grid {
    height: calc(100% - 40px);
}
.limits-summary .ui-grid-render-container {
    height: 100%;
}
.limits-summary .ui-grid-render-container .ui-grid-viewport {
    height: 100%!important;
}
.limits-summary .ui-grid-contents-wrapper .ui-grid-pinned-container-left {
    height:100%;
}
.limits-summary .ui-grid-cell .ui-grid-row-header-cell {
    background-color: red;
}

/* Responsive area */
@media (max-width: 357px) {
    /* overwrite secondary-navbar-collapse-button in mainNavBar */
    #mainNavBar #secondary-navbar-collapse-button.navbar-toggle {
        display: block !important;
    }

    #color-quality .left-side.collapse,
    #color-quality-wizard .left-side.collapse {
        display: none !important;
    }

    #color-quality .left-side.collapse.in,
    #color-quality-wizard .left-side.collapse.in {
        display: block !important;
        margin-left: 0;
    }

    #color-quality .collapsing,
    #color-quality-wizard .collapsing {
        overflow: hidden !important;
    }

    #color-quality .secondary-navbar-collapse,
    #color-quality-wizard .secondary-navbar-collapse {
        position: absolute;
        top: -22px;
        left: 0;
        width: 100%;
        height: -moz-calc(100% + 22px);
        height: -webkit-calc(100% + 22px);
        height: calc(100% + 22px);
        background: rgba(255, 255, 255, 1);
        z-index: 1000;
    }
}

@media (min-width: 358px) and (max-width: 991px) {
    /* overwrite secondary-navbar-collapse-button in mainNavBar */
    #mainNavBar #secondary-navbar-collapse-button.navbar-toggle {
        display: block !important;
    }

    #color-quality .secondary-navbar-collapse.collapse.in,
    #color-quality-wizard .secondary-navbar-collapse.collapse.in {
        display: block !important;
        margin-left: 0;
    }

    #color-quality .collapsing,
    #color-quality-wizard .collapsing {
        overflow: hidden !important;
    }

    #color-quality .secondary-navbar-collapse,
    #color-quality-wizard .secondary-navbar-collapse {
        position: absolute;
        top: -22px;
        left: 0;
        width: 100%;
        height: -moz-calc(100% + 22px);
        height: -webkit-calc(100% + 22px);
        height: calc(100% + 22px);
        background: rgba(255, 255, 255, 1);
        z-index: 1000;
    }
}

@media (min-width: 992px) and (max-width: 1300px) {
    /* overwrite secondary-navbar-collapse-button in mainNavBar */
    #mainNavBar #secondary-navbar-collapse-button.navbar-toggle {
        display: none;
    }

    #color-quality .secondary-navbar-collapse.collapse,
    #color-quality-wizard .secondary-navbar-collapse.collapse {
        display: block !important;
        height: 100% !important;
    }

    #color-quality .secondary-navbar-collapse,
    #color-quality-wizard .secondary-navbar-collapse {
        top: 0;
        z-index: auto;
    }

    #color-quality .secondary-navbar-collapse.collapse.in,
    #color-quality-wizard .secondary-navbar-collapse.collapse.in {
        display: block !important;
        margin-left: 0;
    }
}

@media (min-width: 1301px) {
    /* overwrite secondary-navbar-collapse-button in mainNavBar */
    #mainNavBar #secondary-navbar-collapse-button.navbar-toggle {
        display: none;
    }

    #color-quality .secondary-navbar-collapse.collapse,
    #color-quality-wizard .secondary-navbar-collapse.collapse {
        display: block !important;
        height: 100% !important;
    }

    #color-quality .secondary-navbar-collapse,
    #color-quality-wizard .secondary-navbar-collapse {
        top: 0;
        z-index: auto;
    }

    #color-quality .secondary-navbar-collapse.collapse.in,
    #color-quality-wizard .secondary-navbar-collapse.collapse.in {
        display: block !important;
        margin-left: 0;
    }
}

@media print {
    .mosaic-main-background {
        background: none !important;
    }

    .mosaic-navbar {
        display: none !important;
    }

    #toastr-infocenter-button {
        display: none !important;
    }

    #color-quality .secondary-navbar-collapse.collapse {
        display: none !important;
    }

    #color-quality .right-side {
        width: 100% !important;
    }

    #color-quality .tabs label {
        display: none !important;
    }

    #color-quality #measurement-buttons {
        display: none !important;
    }

    #color-quality .tab-content {
        border: none !important;
    }
}