﻿/* PF Fields */

textarea,
input[type='text'],
input[type='password'],
input[type='datetime'],
input[type='datetime-local'],
input[type='date'],
input[type='month'],
input[type='time'],
input[type='week'],
input[type='number'],
input[type='email'],
input[type='url'],
input[type='search'],
input[type='tel'],
input[type='color'] {
    line-height: 21px;
}

/* paragraaf*/
.header.blue
{
    border-color: #428bca;
    padding-left: 5px;
}
    .header.blue.paragraph {
        border-color: #f0f0f0;
        background-color: #f0f0f0;
        padding-left: 5px;
        font-style: italic;
        font-weight: 600 !important;
        color: #444 !important;
    }

#currentpage .form-group {
    display: none; /* are fields are initially invisible */
}

.form-group .IBStatusWarning,
.form-group input.IBStatusWarning,
.form-group textarea.IBStatusWarning {
    background-color: #ffff4c !important;
}

.form-group .IBStatusError,
.form-group input.IBStatusError,
.form-group textarea.IBStatusError {
    background-color: #ffa07a !important;
}

.form-group .ReadOnlytrue .IBStatusError,
.form-group .ReadOnlytrue input.IBStatusError,
.form-group .ReadOnlytrue textarea.IBStatusError,
.form-group .ReadOnlytrue .IBStatusError,
.form-group .ReadOnlytrue input.IBStatusError,
.form-group .ReadOnlytrue textarea.IBStatusError {
    background-color: #ffc09a !important;
}

.form-group .IBStatusChildError,
.form-group input.IBStatusChildError,
.form-group textarea.IBStatusChildError {
    background-color: #ffa07a !important;
}

.form-group .ReadOnlytrue .IBStatusChildError,
.form-group .ReadOnlytrue input.IBStatusChildError,
.form-group .ReadOnlytrue textarea.IBStatusChildError,
.form-group .ReadOnlytrue .IBStatusChildError,
.form-group .ReadOnlytrue input.IBStatusChildError,
.form-group .ReadOnlytrue textarea.IBStatusChildError {
    background-color: #ffc09a !important;
}

.form-group .IBStatusException,
.form-group input.IBStatusException,
.form-group textarea.IBStatusException {
    background-color: #ffa07a !important;
}

.form-group .ReadOnlytrue .IBStatusException,
.form-group .ReadOnlytrue input.IBStatusException,
.form-group .ReadOnlytrue textarea.IBStatusException,
.form-group .ReadOnlytrue .IBStatusException,
.form-group .ReadOnlytrue input.IBStatusException,
.form-group .ReadOnlytrue textarea.IBStatusException {
    background-color: #ffc09a !important;
}

.form-group .IBStatusChildException,
.form-group input.IBStatusChildException .form-group textarea.IBStatusChildException {
    background-color: #ffa07a !important;
}

.form-group .IBStatusChildNoCheck,
.form-group input.IBStatusChildNoCheck,
.form-group textarea.IBStatusChildNoCheck {
    background-color: #fff !important;
}


/* --------- ComboBox -----------*/
.comboboxContainer {
    margin-top: 0;
    margin-bottom: 0px;
}

    .comboboxContainer .select2-container .select2-choice {
        font-size: 12px;
        line-height: 24.4px;
        min-height: 25px;
        color: #656565;
        border: 1px solid #d5d5d5;
        border-radius: 0;
        background-image: none;
    }
    .comboboxContainer .statusButtontrue .select2-container .select2-choice {
        padding-right: 16px;
    }

    .comboboxContainer.only .select2-container .select2-choice {
        height: 25px;
    }

    .comboboxContainer .IBButtons {
        top: 0;
    }

    .comboboxContainer .IBButtonSelect {
        display: block; /* Select button always visible with ComboBox */
    }

    .comboboxContainer .open .IBButtonSelect {
        opacity: .7;
    }
    .comboboxContainer .comboWrapper:hover .IBTooltip:hover {

    }
    .comboboxContainer .comboWrapper:hover .IBButtonSelect,
    .comboboxContainer .comboWrapper.hover .IBButtonSelect,
    .comboboxContainer .comboWrapper .IBButtonSelect:hover {
        opacity: .7;
    }

    .comboboxContainer .comboWrapper.noth:hover .IBButtonSelect {
        opacity: 1.0;
    }

    .comboboxContainer.ReadOnlytrue .comboWrapper:hover .IBButtonSelect,
    .comboboxContainer.ReadOnlytrue .comboWrapper.hover .IBButtonSelect,
    .comboboxContainer.ReadOnlytrue .comboWrapper.hover.ibc .IBButtonSelect,
    .comboboxContainer.ReadOnlytrue .comboWrapper .IBButtonSelect {
        cursor: default;
        opacity: .4;
    }

    .comboboxContainer .IBStatusIcon {
        right: 37px;
        /*color: #8b9aa3;*/
    }

    .comboboxContainer .select2-container .select2-arrow {
        display: none;
    }

    .comboboxContainer .select2-container.select2-dropdown-open .select2-choice {
        background-color: #fff;
    }

    .comboboxContainer .select2-container .select2-choice:hover,
    .comboboxContainer .comboWrapper.hover .select2-container .select2-choice {
        border: 1px solid #b5b5b5;
    }

    .comboboxContainer.ReadOnlytrue .comboWrapper.hover .select2-container .select2-choice {
        border: 1px solid #d5d5d5;
    }

    .comboboxContainer .select2-container .select2-choice:focus {
        border: 1px solid #f59942;
        outline: none;
    }

    .comboboxContainer .select2-container:focus .select2-choice {
        border: 1px solid #f59942;
        outline: none;
    }

    .comboboxContainer .select2-container-disabled .select2-choice:focus {
        border: 1px solid #d5d5d5;
    }

    .comboboxContainer .select2-container-disabled .select2-choice:hover {
        border: 1px solid #d5d5d5;
    }

    .comboboxContainer .select2-container-active .select2-choice,
    .comboboxContainer .comboWrapper.hover .select2-container-active .select2-choice {
        border: 1px solid #f59942;
    }

    .comboboxContainer .select2-container-active:hover .select2-choice {
        border: 1px solid #f59942;
    }

    .comb

#select2-drop .select2-search input {
    height: 25px !important;
    min-height: 25px;
}

#select2-drop {
    font-size: 12px;
    border-radius: 0;
    box-shadow: none;
}
#select2-drop.select2-drop.select2-drop-above.select2-drop-active {
    border-top: 1px #f59942 solid;
}
#select2-drop .select2-results {
    max-height: 250px;
}

    #select2-drop.select2-drop-active {
        border-right: 1px #f59942 solid;
        border-bottom: 1px #f59942 solid;
        border-left: 1px #f59942 solid;
        z-index: 11500;
    }

.comboboxContainer .IBStatusWarning .select2-choice {
    background-color: #ffff4c;
}

.comboboxContainer.ReadOnlytrue .IBStatusError .select2-choice,
.comboboxContainer.ReadOnlytrue .IBStatusError,
.comboboxContainer.ReadOnlytrue .IBStatusChildError,
.comboboxContainer.ReadOnlytrue .IBStatusChildError .select2-choice,
.comboboxContainer.ReadOnlytrue .IBStatusException,
.comboboxContainer.ReadOnlytrue .IBStatusException .select2-choice,
.comboboxContainer.ReadOnlytrue .IBStatusChildException,
.comboboxContainer.ReadOnlytrue .IBStatusChildException .select2-choice,
.comboboxContainer.ReadOnlytrue .IBStatusChildNoCheck,
.comboboxContainer.ReadOnlytrue .IBStatusChildNoCheck .select2-choice {
    background-color: #ffc09a;
}

.comboboxContainer .IBStatusError .select2-choice {
    background-color: #ffa07a;
}

.comboboxContainer .IBStatusChildError .select2-choice {
    background-color: #ffa07a;
}

.comboboxContainer .IBStatusException .select2-choice {
    background-color: #ffa07a;
}

.comboboxContainer .IBStatusChildException .select2-choice {
    background-color: #ffa07a;
}

.comboboxContainer .IBStatusChildNoCheck .select2-choice {
    background-color: #fff;
}

.comboboxContainer.select2-container .select2-choice > .select2-chosen {
    margin-right: 20px;
}

.comboboxContainer.navigatorButtontrue.userValueButtonfalse .select2-container .select2-choice > .select2-chosen {
    margin-right: 48px;
}

.comboboxContainer.navigatorButtontrue.userValueButtontrue .select2-container .select2-choice > .select2-chosen {
    margin-right: 70px;
}

/* --------- end ComboBox -----------*/


/* ---------  Connector -----------*/

/*
 format: value(1;2;3;4;5;6;7;8;9) or less like (1;2;3;4;5;6)
                      +--------+--------+--------+---+
                      |    1   |    2   |    3   | < |
                      +--------+--------+--------+   |
           P - x,y,z  |    4   |    5   |    6   |   |
                      +--------+--------+--------+   |
           R - x,y,z  |    7   |    8   |    9   |   |
                      +--------+--------+--------+---+
*/


.connectorContainer .connectorWrapper {
    /*border: 1px solid #d5d5d5;*/
}

.connectorContainer .ConnectorUserValue {
    width: 10%; 
    height: 75px; 
    position: absolute;
    right: 12px;
    top: 0px;
    border-right: 1px #d5d5d5 solid;
    border-top: 1px #d5d5d5 solid;
    border-bottom: 1px #d5d5d5 solid;
}

.connectorContainer .IBButtonUserValueRevert {
    right: 15px;
}
.connectorContainer .IBButtonsCover {
    right: 12px;
}

.form-group-Connector .PosXYZ {
    font-size: 10px !important;
    font-weight: lighter;
    margin-top: 25px;
    width: 40px;
}

.form-group-Connector .RotXYZ {
    font-size: 10px !important;
    font-weight: lighter;
    width: 40px;
}
.connectorContainer .options input {
    width: 30%;
    padding-right: 0px !important;
    float: left;
}
.connectorContainer .options input:hover {
    
}
.connectorContainer .options input:focus {

}

.connectorContainer .options input:nth-of-type(1),
.connectorContainer .options input:nth-of-type(2),
.connectorContainer .options input:nth-of-type(3) {
    border-top: 1px solid #d5d5d5;
    border-bottom: none;
    border-left: none;
}
    .connectorContainer .options.hovered2 input:nth-of-type(1),
    .connectorContainer .options.hovered3 input:nth-of-type(2) {
        border-right: 1px solid #b5b5b5;
    }
    .connectorContainer .options.focused2 input:nth-of-type(1),
    .connectorContainer .options.focused3 input:nth-of-type(2) {
        border-right: 1px solid #f59942 !important;
    }
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(1):hover,
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(2):hover,
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(3):hover {
    border-top: 1px solid #b5b5b5;
}
.connectorContainer .options input:nth-of-type(1):focus,
.connectorContainer .options input:nth-of-type(2):focus,
.connectorContainer .options input:nth-of-type(3):focus {
    border-top: 1px solid #f59942 !important;
}

.connectorContainer .options input:nth-of-type(4),
.connectorContainer .options input:nth-of-type(5),
.connectorContainer .options input:nth-of-type(6) {
    border-bottom: none;
    border-left: none;
    border-top: 1px solid #d5d5d5;
}
    .connectorContainer .options.hovered5 input:nth-of-type(4),
    .connectorContainer .options.hovered6 input:nth-of-type(5) {
        border-right: 1px solid #b5b5b5;
    }
    .connectorContainer .options.focused5 input:nth-of-type(4),
    .connectorContainer .options.focused6 input:nth-of-type(5) {
        border-right: 1px solid #f59942 !important;
    }
.connectorContainer .options.hovered1 input:nth-of-type(4),
.connectorContainer .options.hovered2 input:nth-of-type(5),
.connectorContainer .options.hovered3 input:nth-of-type(6),
.connectorContainer .options.hovered4 input:nth-of-type(4),
.connectorContainer .options.hovered5 input:nth-of-type(5),
.connectorContainer .options.hovered6 input:nth-of-type(6) {
    border-top: 1px solid #b5b5b5;
}
.connectorContainer .options.focused1 input:nth-of-type(4),
.connectorContainer .options.focused2 input:nth-of-type(5),
.connectorContainer .options.focused3 input:nth-of-type(6),
.connectorContainer .options.focused4 input:nth-of-type(4),
.connectorContainer .options.focused5 input:nth-of-type(5),
.connectorContainer .options.focused6 input:nth-of-type(6) {
    border-top: 1px solid #f59942 !important;
}

.connectorContainer .options input:nth-of-type(7),
.connectorContainer .options input:nth-of-type(8),
.connectorContainer .options input:nth-of-type(9) {
    border-bottom: none;
    border-left: none;
    border-bottom: 1px solid #d5d5d5;
}
.connectorContainer .options.hovered8 input:nth-of-type(7),
.connectorContainer .options.hovered9 input:nth-of-type(8) {
    border-right: 1px solid #b5b5b5;
}
.connectorContainer .options.focused8 input:nth-of-type(7),
.connectorContainer .options.focused9 input:nth-of-type(8) {
    border-right: 1px solid #f59942 !important;
}


.connectorContainer .options.hovered4 input:nth-of-type(7),
.connectorContainer .options.hovered5 input:nth-of-type(8),
.connectorContainer .options.hovered6 input:nth-of-type(9) {
    border-top: 1px solid #b5b5b5;
}
.connectorContainer .options.focused4 input:nth-of-type(7),
.connectorContainer .options.focused5 input:nth-of-type(8),
.connectorContainer .options.focused6 input:nth-of-type(9) {
    border-top: 1px solid #f59942 !important;
}
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(7):hover,
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(8):hover,
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(9):hover {
    border-bottom: 1px solid #b5b5b5;
}
.connectorContainer .options input:nth-of-type(7):focus,
.connectorContainer .options input:nth-of-type(8):focus,
.connectorContainer .options input:nth-of-type(9):focus {
    border-bottom: 1px solid #f59942 !important;
}

.connectorContainer .options input:nth-of-type(1),
.connectorContainer .options input:nth-of-type(4),
.connectorContainer .options input:nth-of-type(7) {
    clear: both;
    border-left: 1px solid #d5d5d5;
}

.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(1):hover,
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(4):hover,
.connectorContainer:not(.ReadOnlytrue) .options input:nth-of-type(7):hover {
   border-left: 1px solid #b5b5b5;
}
.connectorContainer .options input:nth-of-type(1):focus,
.connectorContainer .options input:nth-of-type(4):focus,
.connectorContainer .options input:nth-of-type(7):focus {
   border-left: 1px solid #f59942 !important;
}

.connectorContainer.IBStatusWarning,
.connectorContainer.IBStatusError {
   background-color: transparent !important;
}

.connectorContainer.ReadOnlytrue .connectorWrapper {
   background-color: #eee;
}

.connectorContainer.IBStatusWarning .connectorWrapper,
.connectorContainer.IBStatusWarning .options input {
    background-color: #ffff4c !important;
}

.connectorContainer.IBStatusError .connectorWrapper,
.connectorContainer.IBStatusError .options input {
    background-color: #ffa07a !important;
}

.connectorContainer.IBStatusError.ReadOnlytrue .connectorWrapper,
.connectorContainer.IBStatusError.ReadOnlytrue .options input {
    background-color: #ffc09a !important;
}

/* --------- end Connector  -----------*/

/* ---------  SelectImage (similar to ComboBox) -----------*/
.selectimageContainer {
  
}
.selectimage-option-image-wrapper {
    width: 100%;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 10px;
}
.select2-results .select2-result-label {
     padding: 0px 7px 0px;
     line-height: 25px;
     overflow: hidden;
     text-overflow: ellipsis;
}
    .selectimage-option-image-wrapper .selectimage-option-image {
display: inline-block;
    width: auto;
    max-width: 50px;
    text-align: center;
    }

.selectimageContainer .IBButtonsCover {
    border-bottom: 1px solid #ccc;
}

.selectimageContainer.comboboxContainer .comboWrapper.hover .IBButtonsCover, .comboboxContainer.selectimageContainer .comboWrapper.hover.noth .IBButtonsCover, .comboboxContainer.selectimageContainer .comboWrapper.hover.noth.ibc .IBButtonsCover {
    border-bottom: 1px solid #ccc;
}

.selectimageContainer .select2-container .select2-choice {
    line-height: 23px;
    min-height: 23px;
}

.selectimageContainer .IBButtonsCover {
    height: 24px;
}

.selectimageContainer .select2-dropdown-open .IBButtonsCover {
    height: 23px;
}

/* --------- end SelectImage -----------*/

/* ---------  SelectList  -----------*/

.selectlistContainer {
}

    .selectlistContainer input {
        display: none;
    }

.selectlist-selectoptions {
    display: block;
    margin-top: 5px;
    cursor: pointer;
    color: #428bca;
}

.selectlist-option-wrapper > .selectlist-option.selected {
    border: 1px solid #ccc;
}
.selectlist-option-content-image > img {
    max-width: 100%;
}

.selectlist-option-wrapper > .selectlist-option {
    border: 1px solid #fff;
    padding: 2px;
}

.input-group:not(.ReadOnlytrue) .selectlist-option-wrapper > .selectlist-option:not(.selected) {
    cursor: pointer;
}


.selectlist-selectoptions:hover {
    text-decoration: underline;
}

.selectlistContainer .lightbox {
    display: none;
}

.selectlistWrapper > .selectlist-option-wrapper {
    /*padding-top: 5px;*/
    padding-bottom: 5px;
}

.lightbox .selectlist-option {
    padding: 10px;
    cursor: pointer;
    border: 1px solid #fff;
}

.input-group:not(.ReadOnlytrue) .lightbox .selectlist-option.selected, .input-group:not(.ReadOnlytrue) .lightbox .selectlist-option.selected:hover {
    border: 1px solid #f59942;
}

.featherlight-content .selectlist-option.selected, .featherlight-content .selectlist-option.selected:hover {
    border: 1px solid #f59942;
    cursor: default;
}

.selectlist-option.selected.readonly, .selectlist-option.selected.readonly:hover {
    border: 1px solid #ccc;
    cursor: default;
}

.selectlist-option.readonly, .selectlist-option.readonly:hover {
    cursor: default;
}

.featherlight-content .selectlist-option:not(.readonly):hover {
    padding: 10px;
    border: 1px solid #ccc;
}

.featherlight-content .selectlist-option.selected:not(.readonly):hover {
    border: 1px solid #f59942;
}

.input-group:not(.ReadOnlytrue) .lightbox .selectlist-option:hover {
    padding: 10px;
    border: 1px solid #ccc;
}

.selectlistContainer .IBButtonsCover {
    width: 24px;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
}

.selectlist-selectoptions .fa-pencil-square-o:before {
    font-family: FontAwesome;
    content: "\f044" !important;
    font-style: normal;
}

/* Default style PF*classes */
.PFRecord {
    position: relative;
}

.PFSelectList {
    float: left;
    
}

.selectlist-option.selected .PFImage {
    cursor: pointer;
}

.PFImage {
    width: 30%;
    min-height: 50px;
    cursor: pointer;
}

    .PFImage .PFImageContent {
        width: 100% !important;
        height: auto !important;
    }

.propAsList .selectlistWrapper .PFImage {
    width: 70%;
    margin-bottom: 15px;
    margin-top: 30px;
}

.featherlight-content > .PFImageContent {
    margin: 0 auto;
    max-width: 900px;
}

.PFDisplayCode {
    width: 20%;
    font-weight: bold;
    margin-bottom: 15px;
    /*word-break: break-all;*/
    word-break: normal;
    word-wrap: break-word;
    padding-right: 5px;
}

.propAsList .selectlistWrapper .PFDisplayCode {
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
}

.selectlistWrapper .IBButtonSelect {
    display: none;
}

.PFDisplayName {
    width: 50%;
    margin-bottom: 15px;
}

.propAsList .selectlistWrapper .PFDisplayName {
    width: 100%;
}

.PFContent {
    width: 70%;
    padding-right: 20%;
    margin-bottom: 15px;
    white-space: pre-line;
    word-wrap: break-word;
}

.propAsList .selectlistWrapper .PFContent {
    width: 100%;
}

.PFPrice {
    width: 8%;
    position: absolute;
    top: 40px;
    right: 10px;
}

.propAsList .selectlistWrapper .PFPrice {
    width: 30%;
    position: absolute;
    left: 70%;
    top: 70px;
}

@media only screen and (max-width: 968px) {
    .PFContent {
        width: 80%;
        margin-bottom: 15px;
    }

    .PFPrice {
        width: 100%;
        position: relative;
        left: 0%;
        top: auto;
        text-align: center;
    }
}


/* --------- end SelectList -----------*/

.catalogfilterContainer {
}

    .catalogfilterContainer input {
        display: none;
    }

.catalogfilterContainer .lightbox {
    display: none;
}
.catalogfilterWrapper .IBButtonsCover {
    right: 13px;
    height: 24px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
.catalogfilterWrapper.userValueButtonfalse.navigatorButtonfalse.cancelButtontrue .IBButtonCancel {
    right: 16px;
}

/* ---------  CatalogFilter  -----------*/



/* --------- end CatalogFilter -----------*/


/* ---------  Slider  -----------*/

.sliderContainer {
    padding-bottom: 5px;
}
.form-group .sliderWrapper.IBStatusError {
    background-color: transparent !important;
}

    .sliderContainer .IBButtonSelect {
        display: none;
    }

.sliderWrapper > .col-md-3 {
    padding-right: 0px;
}

.sliderContainer .inputslider > input {
    display: none !important;
}

.sliderContainer .inputslider.showtextinput > input {
    display: block !important;
}

.sliderContainer .inputslider.showtextinput .current-slider-value {
    display: none;
}

@media(max-width:991px) {
    .sliderContainer .current-slider-value {
        margin-top: 25px;
        margin-left: -16px;
    }

    .sliderContainer .inputslider > input {
        margin-top: 25px;
        padding-right: 0px !important;
        width: 15%;
        min-width: 40px;
        margin-left: -10px;
    }
}

.sliderContainer .ui-slider {
    margin-top: 5px;
    margin-left: -5px;
    border-left: 3px solid #aaa;
    border-right: 3px solid #aaa;
}


.sliderContainer .IBStatusWarning .options input {
    background-color: #ffff4c !important;
}
.sliderContainer .IBStatusError .ui-slider, .sliderContainer .IBStatusChildError .ui-slider, .sliderContainer .IBStatusException .ui-slider, .sliderContainer .IBStatusException .ui-slider {
     background-color: #ffa07a !important;
}
.sliderContainer .IBStatusError.ReadOnlytrue .ui-slider, .sliderContainer .IBStatusChildError.ReadOnlytrue .ui-slider, .sliderContainer .IBStatusException.ReadOnlytrue .ui-slider, .sliderContainer .IBStatusException.ReadOnlytrue .ui-slider {
    background-color: #ffc09a !important;
}

.sliderContainer .slider-labels {
    margin-left: -5px;
    font-size: 10px;
    color: #696969;
}

.slider-labels .min-value {
    float: left;
    margin-left: -5px;
    margin-top: 5px;
}

.slider-labels .max-value {
    float: right;
    text-align: right;
    margin-right: -5px;
    margin-top: 5px;
}

.ui-slider {
    position: relative;
    text-align: left;
}

.ui-slider {
    background-color: #ccc;
}

.ui-slider-horizontal {
    height: 9px;
}

.ui-slider-vertical {
    width: 9px;
}

.ui-slider .ui-slider-handle {
    width: 1.45em;
    height: 1.45em;
    border: 1px solid;
    border-radius: 0;
    cursor: pointer;
    background-color: #f5f5f5;
}

.sliderWrapper .ui-slider .ui-slider-handle {
    cursor: pointer;
}

.ui-slider .ui-slider-handle:before {
    font-family: Helvetica,Arial,sans-serif;
    font-size: 8px;
    line-height: 15px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: inline-block;
    text-align: center;
}

.ui-slider .ui-slider-handle:hover {
    background-color: #fff;
}

.ui-slider .ui-slider-handle:hover,
.ui-slider .ui-slider-handle:focus,
.ui-slider .ui-slider-handle:active {
    text-decoration: none;
    outline: 0;
    box-shadow: 1px 1px 1px 0 rgba(0,0,0,.3);
}

    .ui-slider .ui-slider-handle:hover:before,
    .ui-slider .ui-slider-handle:focus:before,
    .ui-slider .ui-slider-handle:active:before {
        text-shadow: 1px 1px 1px rgba(0,0,0,.3);
    }

.ui-slider-horizontal .ui-slider-handle {
    top: -.4em;
    margin-left: -.725em;
}

.ui-slider-vertical .ui-slider-handle {
    left: -.35em;
    margin-bottom: -.65em;
}

.ui-slider-small.ui-slider-horizontal {
    height: 5px;
}

.ui-slider-small.ui-slider-vertical {
    width: 5px;
}

.ui-slider-small .ui-slider-handle {
    top: -5px;
    width: 16px;
    height: 16px;
    border-radius: 24px;
}

    .ui-slider-small .ui-slider-handle:before {
        font-size: 6px;
        line-height: 13px;
    }

.ui-slider-range {
    background-color: #4aa4ce;
}

.ui-slider-handle {
    outline: none !important;
}

.ReadOnlytrue .ui-slider .ui-slider-handle {
    cursor: default;
}

    .ReadOnlytrue .ui-slider .ui-slider-handle:hover, .ReadOnlytrue .ui-slider .ui-slider-handle:active, .ReadOnlytrue .ui-slider .ui-slider-handle:focus {
        background-color: #f5f5f5 !important;
        box-shadow: none !important;
        border-color: #ccc;
        cursor: default !important;
    }

.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 1.2em;
    height: 1.2em;
    cursor: default;
    -ms-touch-action: none;
    touch-action: none;
}

.ui-slider .ui-slider-handle {
    border-color: #b5b5b5;
}

    .ui-slider .ui-slider-handle:focus, .ui-slider .ui-slider-handle:hover, .ui-slider .ui-slider-handle:active {
        color: #f59942;
        border-color: #f59942;
    }

.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    font-size: .7em;
    display: block;
    border: 0;
    background-position: 0 0;
}

/* support: IE8 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
    filter: inherit;
}

.ui-slider-horizontal {
    height: .8em;
}

    .ui-slider-horizontal .ui-slider-handle {
        top: -.3em;
        margin-left: -.6em;
    }

    .ui-slider-horizontal .ui-slider-range {
        top: 0;
        height: 100%;
    }

    .ui-slider-horizontal .ui-slider-range-min {
        left: 0;
    }

    .ui-slider-horizontal .ui-slider-range-max {
        right: 0;
    }

.ui-slider-vertical {
    width: .8em;
    height: 100px;
}

    .ui-slider-vertical .ui-slider-handle {
        left: -.3em;
        margin-left: 0;
        margin-bottom: -.6em;
    }

    .ui-slider-vertical .ui-slider-range {
        left: 0;
        width: 100%;
    }

    .ui-slider-vertical .ui-slider-range-min {
        bottom: 0;
    }

    .ui-slider-vertical .ui-slider-range-max {
        top: 0;
    }

/* --------- end Slider -----------*/


/* --------- PickBox -----------*/

.pickboxContainer {
    position: relative;
}

    .pickboxContainer.ReadOnlytrue input[disabled],
    .pickboxContainer.ReadOnlytrue input {
        cursor: default;
        -webkit-opacity: 1;
        -webkit-text-fill-color:#848484;

    }

    .pickboxContainer input[disabled],
    .pickboxContainer input {
        cursor: text;
        border: 1px solid #d5d5d5;
    }

        .pickboxContainer input[disabled]:hover,
        .pickboxContainer input:hover {
            border: 1px solid #b5b5b5;
        }

        .pickboxContainer input[disabled]:focus,
        .pickboxContainer input:focus {
            border: 1px solid #f59942;
        }

    .pickboxContainer .pickWrapper.noth:hover .IBButtonSelect {
        opacity: 1.0;
    }

    .pickboxContainer.ReadOnlytrue .pickWrapper.noth:hover .IBButtonSelect {
        opacity: 0.4;
    }

    .pickboxContainer.ReadOnlytrue .pickWrapper .IBButtonSelect {
        cursor: default;
        opacity: .4;
    }

.pickWrapper input[readonly] {
    color: rgb(133, 133, 133);
}

.ReadOnlytrue .pickWrapper input[readonly] {
    color: rgb(132, 132, 132);
    -webkit-opacity:1;
    -webkit-text-fill-color:rgb(132, 132, 132);
}

.pickboxContainer .IBButtonSelect {
    display: block; /* Select button always visible with PickBox */
}

.pickWrapper:hover .IBButtonSelect {
    opacity: .8;
}

.pickWrapper.ibc:hover .IBButtonSelect {
    opacity: 1.0;
}

.ReadOnlytrue .pickWrapper.ibc:hover .IBButtonSelect {
    cursor: default;
    opacity: .4;
}

.ReadOnlytrue .pickWrapper input[readonly] {
    background-color: #eee;
    -webkit-opacity:1;
    -webkit-text-fill-color:#848484;
}

    .ReadOnlytrue .pickWrapper input[readonly]:hover,
    .ReadOnlytrue .pickWrapper.hover input[readonly],
    .ReadOnlytrue .pickWrapper input[readonly]:focus {
        border: 1px solid #d5d5d5;
    }

/* --------- end PickBox -----------*/


/* --------- CheckBox -----------*/
.checkWrapper {
    width: 100%;
}

.statusHelper {
    position: absolute;
    z-index: 20;
    top: 4px;
    left: 10px;
    width: 17px;
    height: 17px;
    border-radius: 2px;
    border-radius: 2px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .statusHelper {
        width: 16px;
        height: 16px;
    }
}

.checkWrapper {
    height: 25px;
}

    .checkWrapper > button.btn {
        width: auto;
        height: 24px;
        line-height: 10px;
        cursor: pointer;
        font-size: 13px;
        border-radius: 4px !important;
        border-bottom-right-radius: 4px !important;
        border-top-right-radius: 4px !important;
    }

    .checkWrapper input[type=checkbox] {
        position: absolute;
        z-index: 21;
        top: 3px;
    }
input[type=checkbox] {
    width: 13px !important;
    height: 13px !important;
    margin-top: 3px !important;
    border-radius: 0 !important;
    background-color: #fff !important;
    -webkit-appearance: checkbox !important;
    -moz-appearance: checkbox !important;
    -ms-appearance: checkbox !important;
    -o-appearance: checkbox !important;
    appearance: checkbox !important;
}


input[type=checkbox].htCheckboxRendererInput {
    margin-top: 7px !important;
    position: absolute;
    margin-left: 4px;
}

/*
   DK 6-1-2018 Checkbox enabled now with white background, disabled gray.

   https://public.3.basecamp.com/p/5XsFHd4JABqjr6sA1y9Efdzs
*/

/* Base for label styling */
input[type="checkbox"]:checked
input[type="checkbox"]:not(:checked) {
  position: absolute;
  left: -9999px;
  opacity: 0;
  transform: scale(0);
}


/* checkbox aspect */
input[type="checkbox"]:not(:checked):before,
input[type="checkbox"]:checked:before {
  content: '';
  position: absolute;
  left: 0; 
  top: 0;
  width: 13px; 
  height: 13px;
  border: 1px solid #d5d5d5;
  background: #fff;
  cursor: pointer;
}

/* checked mark aspect */
input[type="checkbox"]:not(:checked):after,
input[type="checkbox"]:checked:after {
  content: '✔';
  position: absolute;
  left: 2px;
  top: 1px; 
  font-size: 12px;
  line-height: 1em;
  color: #393939;
  font-family: Helvetica, Arial, sans-serif;
  font-weight:bold;
}

/* checked mark aspect changes */
input[type="checkbox"]:not(:checked):after {
  opacity: 0;
  transform: scale(0);
}

input[type="checkbox"]:checked:after {
  opacity: 1;
  transform: scale(1);
}

/* disabled checkbox */
input[type="checkbox"]:disabled:not(:checked):before,
input[type="checkbox"]:disabled:checked:before {
  box-shadow: none;
  border-color: #d5d5d5;
  background-color: #eee;
}

input[type="checkbox"]:disabled:checked:after {
  color: #848484;
}
input[type="checkbox"]:disabled {
  color: #848484;
}

/* accessibility */
input[type="checkbox"]:checked:focus:before,
input[type="checkbox"]:not(:checked):focus:before {
  outline-style: none !important;
}

/* overrule ace.css styling*/
.checkWrapper input[type=checkbox]:focus {
    outline-style: none !important;
}

/* --------- end CheckBox -----------*/


/* --------- LongTextBox -----------*/

textarea {
    line-height: 14px;
    padding: 5px;
}

.longtextboxContainer textarea {
    overflow-y: auto;
    width: 100%;
    height: 150px;
    resize: none;
    white-space: pre-wrap;
}

.longtextboxContainer {
    padding-bottom: 0px;
}
.uilist .longtextboxContainer.ReadOnlytrue textarea {
    height: auto !important;
    min-height: 80px;
}
    .longtextboxContainer.ReadOnlytrue textarea {
        cursor: default;
        background-color: #eee;
        border: 1px solid #d5d5d5;
        -webkit-opacity:1;
        -webkit-text-fill-color:#848484;
    }

        .longtextboxContainer.ReadOnlytrue textarea:hover {
            border: 1px solid #d5d5d5;
        }

/* --------- end LongTextBox -----------*/


/* --------- Image -----------*/

.imageBorder {
    width: 100%;
    min-height: 25px;
    border: 1px solid #d5d5d5;
    overflow-x: hidden;
}

    .imageBorder:hover, .hover .imageBorder {
        border: 1px solid #b5b5b5;
    }

    .imageBorder:focus {
        border: 1px solid #f59942;
    }

    .imageBorder.focus {
        border: 1px solid #f59942;
    }

.ReadOnlytrue .imageBorder.focus,
.ReadOnlytrue .imageBorder:focus {
    border: 1px solid #d5d5d5;
    -webkit-opacity:1;
    -webkit-text-fill-color:#848484;
}

.ReadOnlytrue .hover .imageBorder {
    border: 1px solid #d5d5d5;
}

.imageWrapper input {
    opacity: 0;
    filter: alpha(opacity=0); /* So it can still be focused */
}

.imageInputBorder {
    overflow: hidden;
    width: 0;
    height: 0;
}

.ReadOnlytrue .imageBorder {
    background-color: #eee;
}

    .ReadOnlytrue .imageBorder:hover {
        border: 1px solid #d5d5d5;
    }

.imageBorder {
    text-align: center;
}

.imageWrapper .imageBorder img {
    display: inline-block;
    margin: 5px;
    margin-top: 29px;
    width: auto;
    /*max-width: 100%;*/
    height: auto;
    max-height: 80px;
}

    .imageWrapper .imageBorder img[data-empty=true] {
        margin-top: 0px;
    }

.imageWrapper .IBButtonSelect {
    display: block;
}

.ReadOnlytrue .imageWrapper .IBButtonSelect,
.ReadOnlytrue .imageWrapper .IBButtonSelect:hover,
.ReadOnlytrue .imageWrapper .IBButtonSelect.hover {
    cursor: default;
    opacity: .4;
}

.imageWrapper .IBButtonsCover {
    height: 24px;
    border-bottom: 1px solid #ccc;
}

/* --------- end Image -----------*/


/* --------- FormatedTextBox -----------*/
/* Remaining styles are done in TinyMCE CSS */
.form-group-FormatedTextBox {
    margin-bottom: 4px;
}

.mce-container-body {
    padding-right: 0px !important;
}

/* --------- end FormatedTextBox -----------*/


/* --------- Hyperlink -----------*/

.hyperlinkContainer .IBButtonSelect {
    /*display: block;*/ /* Select button always visible with Hyperlink */
}

.hyperlinkContainer .IBButtonReference {
    display: block !important; /* Reference button always visible with Hyperlink */
}

.hyperlinkContainer .file {
    display: none;
}

.form-group .hyperlinkContainer.ReadOnlytrue input[type=text] {
    background-color: #eee;
}

.noButtons.hyperlinkWrapper input[type=text] {
    padding-right: 23px;
}

/* --------- end Hyperlink -----------*/


/* --------- DateTime -----------*/

.datetimeContainer .IBButtonSelect {
    display: block; /* Select button always visible with DateTime */
}

.datetimeContainer.ReadOnlytrue .IBButtonSelect,
.datetimeContainer.ReadOnlytrue .IBButtonSelect:hover,
.datetimeContainer.ReadOnlytrue .IBButtonSelect.hover {
    cursor: default;
    opacity: .4;
}

.datetimeWrapper:hover .IBButtonSelect {
    opacity: 0.7;
}

.datetimeWrapper input {
    padding-right: 23px;
}

.ui-datepicker-trigger {
    display: none;
}
.ui-datepicker .ui-datepicker-title select {
    padding: 0px;
    padding-right: 2px;
}
.ui-datepicker .ui-datepicker-title {
    margin: 0 2.5em;
}

.ui-datepicker
{
    width: auto;
    border: 1px solid rgba(0,0,0,.2);
    background-color: #fff;
    z-index: 13000 !important;
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.2);
            box-shadow: 0 2px 4px rgba(0,0,0,.2);
}

.ui-datepicker td.ui-datepicker-week-col {
    font-size: 13px;
    padding-top: 6px;
    font-weight: bold;
    padding-left: 4px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    min-width: 24px;
    max-width: 24px;
    line-height: 13px;
    vertical-align:top;
    height: 22px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next
{
    line-height: 26px;

    -webkit-box-sizing: content-box;
       -moz-box-sizing: content-box;
            box-sizing: content-box;
    min-width: 32px;
    max-width: 32px;
    height: 26px;

    cursor: pointer;
    text-align: center;

    color: transparent;
}

.ui-datepicker .ui-datepicker-prev .ui-icon,
.ui-datepicker .ui-datepicker-next .ui-icon
{
    visibility: hidden;

    color: transparent;
}

.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover
{
    text-decoration: none;

    background-color: #eee;
}

.ui-datepicker .ui-datepicker-prev:before,
.ui-datepicker .ui-datepicker-next:before
{
    font-family: FontAwesome;
    font-size: 14px;

    display: inline;

    content: '\f060';

    color: #393939;
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover
{
    top: 2px;
}

.ui-datepicker .ui-datepicker-next:before
{
    content: '\f061';
}

.ui-datepicker .ui-datepicker-prev-hover
{
    left: 2px;
}

.ui-datepicker .ui-datepicker-next-hover
{
    right: 2px;
}

.ui-datepicker td
{
    padding: 0;
}

.ui-datepicker td > a,
.ui-datepicker td > span
{
    font-size: 13px;

    display: inline-block;

    -webkit-box-sizing: content-box;
       -moz-box-sizing: content-box;
            box-sizing: content-box;
    min-width: 24px;
    max-width: 24px;
    height: 22px;

    text-align: center;

    color: #393939;
}

.ui-datepicker td > a:hover
{
    background-color: #eee;
}

.ui-datepicker td > a.ui-state-highlight
{
    background-color: #d5e5ef;
}

.ui-datepicker td > a.ui-state-active
{
    color: #fff;
    background-color: #2283c5;
}

.ui-datepicker td > a.ui-priority-secondary
{
    color: #888;
}

.ui-datepicker td > span
{
    color: #999;
}

.ui-datepicker td .ui-datepicker-title select
{
    line-height: 24px;

    height: 24px;
    padding: 2px 3px;
}

.ui-datepicker td .ui-datepicker-buttonpane
{
    height: 1px;

    background-color: #ddd;
}


/* --------- end DateTime -----------*/


/* --------- Radio -----------*/
.radioWrapper .radioButton {
    font-size: 12px;
    line-height: 21px;
    float: left;
    min-width: 60px;
    max-width: 200px;
    padding-top: 0px;
    text-align: center;
    display: inline-block;
}
.uilistitem .radioWrapper .radioButton {
	width:100%;
}
.radioWrapper .radioInputBorder > input {
    width: 0px;
}
.propAsList .radioWrapper .radioButton {
    width: 85px;
}
.radioWrapper .radioButton img {
    max-width: 200px;
    margin-bottom: 8px;
}
.propAsList .radioWrapper .radioButton img {
    max-width: 80px;
}

.radioWrapper {
    margin-bottom: 0px;
}

    .radioWrapper .radioButtons {
        width: 100%;
        padding-top: 7px;

        padding-right: 5px;
        padding-left: 5px;
        background-color: #fff;
    }

        .radioWrapper .radioButtons.focus {
            border: 1px solid #f59942;
        }

            .radioWrapper .radioButtons.focus:hover {
                border: 1px solid #f59942;
            }

    .radioWrapper .radioButtons {
        border: 1px solid #d5d5d5;
    }

        .radioWrapper .radioButtons:hover {
            border: 1px solid #b5b5b5;
        }

        .radioWrapper .radioButtons.hover {
            border: 1px solid #b5b5b5;
        }

        .radioWrapper .radioButtons .radioInputBorder {
            overflow: hidden;
            width: 0;
            height: 0;
        }

    .radioWrapper .IBButtonsCover {
        border-bottom: 1px solid #ccc;
    }

.ReadOnlytrue .radioWrapper .radioButtons:hover {
    border: 1px solid #d5d5d5;
}

.ReadOnlytrue .radioButtons {
    background-color: #eee;
}

.radioWrapper .radioButton label {
    font-size: 12px;
    line-height: 12px;
    vertical-align: top;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    margin-top: -2px;
    display: block;
    margin-bottom: 5px;
    display: inline-block;
    color: #656565;
    text-align: center;
    /*word-break: break-all;*/
    word-break: normal;
    white-space: normal;
    word-wrap: break-word;
    /* min-height: 28px;*/
    max-height: 28px;
}

.radioButtons.focus label {
    color: #696969;
}

.form-group input[type=radio] {
    height: auto;
}

    .form-group input[type=radio]:focus {
        height: auto;
        border: 0 solid #b5b5b5;
        /*outline-offset: -1px;
	outline: 0px #b5b5b5 solid !important;*/
    }

/* --------- end Radio -----------*/


/* --------- MultiCheck -----------*/

.multicheckWrapper .checkButton {
    font-size: 12px;
    line-height: 16px;
    float: left;
    width: 25%;
    height: 20px;
    padding-top: 3px;
    padding-bottom: 3px;
    text-align: left;
    position: relative;
}
.ica .multicheckWrapper .checkButton {
    width: 100%;
}
@media only screen and (max-width: 1300px) {
    .multicheckWrapper .checkButton {
        float: left;
        width: 33%;
    }
}
@media only screen and (max-width: 968px) {
    .multicheckWrapper .checkButton {
        float: left;
        width: 50%;
    }
}
@media only screen and (max-width: 767px) {
    .multicheckWrapper .checkButton {
        float: none;
        width: 100%;
    }
}

.multicheckWrapper {
    margin-bottom: 0px;
}

    .multicheckWrapper .checkButtons {
        width: 100%;
        padding-top: 0;
        padding-right: 5px;
        padding-left: 5px;
        overflow-y: auto;
        overflow-x: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        background-color: #fff;
        height: 300px;
    }

        .multicheckWrapper .checkButtons.focus {
            border: 1px solid #f59942;
        }

            .multicheckWrapper .checkButtons.focus:hover {
                border: 1px solid #f59942;
            }

    .multicheckWrapper .checkButtons {
        border: 1px solid #d5d5d5;
    }

        .multicheckWrapper .checkButtons:hover, .multicheckWrapper.hover .checkButtons, .multicheckWrapper .checkButtons.hover {
            border: 1px solid #b5b5b5;
        }

        .multicheckWrapper .checkButtons .checkInputBorder {
            overflow: hidden;
            width: 0;
            height: 0;
        }

    .multicheckWrapper .IBButtonsCover {
        border-bottom: 1px solid #ccc;
    }

.ReadOnlytrue .multicheckWrapper .checkButtons:hover {
    border: 1px solid #d5d5d5;
}

.ReadOnlytrue .checkButtons {
    background-color: #eee;
}

.multicheckWrapper .checkButton label {
    font-size: 12px;
    line-height: 18px;
    text-align: left;
    width: auto;
    /*max-width: 200px;*/
    left: 18px;
    position: absolute;
    height: 20px;
    margin-top: 1px;
    margin-left: 0px;
    padding-right: 7px;
    right: 0px;
    color: #656565;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.checkButtons.focus label {
    color: #696969;
}

.multicheckWrapper .options {
    padding-bottom: 10px;
}

.multicheckWrapper.navigatorButtontrue .IBButtonsCover {
    display: none;
}

.multicheckWrapper .IBButtonReference {
    display: none !important;
}

.form-group .multicheckWrapper input[type=checkbox] {
    float: left;
    height: auto;
    position: relative;
}

    .form-group .multicheckWrapper input[type=checkbox]:focus {
        height: auto;
        border: 0 solid #b5b5b5;
        /*outline-offset: -1px;
	outline: 0px #b5b5b5 solid !important;*/
    }

.multichecksearch {
    max-width: 100px;
    width: 100%;
    float: left;
    position: absolute;
    padding-left: 0px;
    margin-top: 25px;
    padding-left: 12px;
}

    .multichecksearch input {
        height: 18px;
        line-height: 18px;
    }

.multicheckWrapper .checkButton.bg label {
    background-color: #eee;
}

.ica.small .multichecksearch {
    max-width: 100px;
    width: 100%;
    right: 24px;
    position: absolute;
    padding-left: 0px;
    margin-top: -20px;
}
@media(max-width:991px) {
    .form-group-MultiCheck > label.control-label {
        width: 100%;
    }
    .multichecksearch {
        max-width: 100px;
        width: 100%;
        right: 24px;
        position: absolute;
        padding-left: 0px;
        margin-top: -20px;
    }
}

/* --------- end MultiCheck -----------*/

/* --------- Code -----------*/

.codeContainer .codeWrapper > textarea {
    overflow-y: auto;
    width: 100%;
    height: 220px;
    resize: none;
    visiblity: hidden;
}

.ReadOnlytrue textarea:focus {
    border: 1px solid #d5d5d5 !important;
    -webkit-opacity:1;
    -webkit-text-fill-color:#848484;
}

.codeWrapper .ace-editor-div {
    margin: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: 7px;
    margin-right: 12px;
    border: 1px solid #d5d5d5;
}
.col-md-9d5 .codeWrapper .ace-editor-div {
    margin-right: 12px;
}
.col-md-9d5 .codeWrapper .ace-editor-div.fullScreen-editor {
    margin-right: 0px;
}
.propAsList .codeWrapper .ace-editor-div {
    margin-left: 12px;
    margin-right: 12px;
}
.propAsList  .codeWrapper .ace-editor-div.fullScreen-editor {
    margin-right: 0px;
    margin-left: 0px;
}

/* Code input in viewer */
.currentdocument .codeWrapper .ace-editor-div { 
    margin-left: 0px;
    margin-right: 0px;
}

.colSpanfalse .codeWrapper .ace-editor-div {
    margin-left: 12px;
    margin-right: 12px;
}
.fullScreen .colSpanfalse .codeWrapper .ace-editor-div {
    margin-left: 0px;
    margin-right: 0px;
}

.fullScreen .fullScreen-editor {
    height: auto !important;
    width: auto !important;
    border: 0;
    margin: 0;
    position: fixed !important;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100000;
}

.fullScreen {
    overflow: hidden;
}

.instructions {
    position: absolute;
    bottom: 1px;
    right: 13px;
    width: 25px;
    height: 25px;
    background-color: rgb(226, 226, 226);
    text-align: center;
    line-height: 25px;
    font-size: 20px;
    cursor: pointer;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    z-index: 900;
}
.idd .instructions {
    right: 9px;
}

#xmlContent .instructions {
    right: 9px;
}

.propAsList .instructions, .col-md-9d5 .instructions {
    right: 13px;
}

    .instructions:hover {
        opacity: 0.7;
    }


.ReadOnlytrue .ace-editor-div {
    background-color: #eee;
    cursor: default;
}

    .ReadOnlytrue .ace-editor-div .ace_content {
        cursor: default;
    }

.codeWrapper .ace-editor-div:hover {
    border: 1px solid #b5b5b5;
}

.codeWrapper .ace-editor-div.ace_focus {
    border: 1px solid #f59942;
}

.ReadOnlytrue .codeWrapper .ace-editor-div:hover, .ReadOnlytrue .codeWrapper .ace-editor-div.ace_focus {
    border: 1px solid #d5d5d5 !important;
}

.codeContainer.IBStatusWarning .ace_scroller {
    background-color: #ffff4c;
}

.codeContainer.ReadOnlytrue.IBStatusError .ace_scroller,
.codeContainer.ReadOnlytrue.IBStatusError,
.codeContainer.ReadOnlytrue.IBStatusChildError,
.codeContainer.ReadOnlytrue.IBStatusChildError .ace_scroller,
.codeContainer.ReadOnlytrue.IBStatusException,
.codeContainer.ReadOnlytrue.IBStatusException .ace_scroller,
.codeContainer.ReadOnlytrue.IBStatusChildException,
.codeContainer.ReadOnlytrue.IBStatusChildException .ace_scroller,
.codeContainer.ReadOnlytrue.IBStatusChildNoCheck,
.codeContainer.ReadOnlytrue.IBStatusChildNoCheck .ace_scroller {
    background-color: #ffc09a;
}

.codeContainer.IBStatusError .ace_scroller {
    background-color: #ffa07a;
}

.codeContainer.IBStatusChildError .ace_scroller {
    background-color: #ffa07a;
}

.codeContainer.IBStatusException .ace_scroller {
    background-color: #ffa07a;
}

.codeContainer.IBStatusChildException .ace_scroller {
    background-color: #ffa07a;
}

.codeContainer.IBStatusChildNoCheck .ace_scroller {
    background-color: #fff;
}

.codeContainer {
    background-color: inherit !important;
}

/* --------- end MultiCheck -----------*/


/* --------- Color -----------*/

.colorpickervalue {
    display: none;
}

.colorContainer {
    min-height: 27px;
}

.colorWrapper .sp-replacer {
    border: 1px solid #d5d5d5;
    background: #fff;
    width: 100%;
    position: absolute;
    top: 0px;
    padding-right: 24px;
}

.colorWrapper.userValueButtonfalse .sp-replacer {
    padding-right: 24px;
}

.colorWrapper.userValueButtontrue .sp-replacer {
    padding-right: 50px;
}

.colorWrapper .sp-replacer.sp-active {
    border: 1px solid #f59942 !important;
}

.colorWrapper .sp-preview {
    width: 100%;
    height: 15px;
}

.colorWrapper .sp-dd {
    display: none;
}

.colorWrapper .sp-replacer:hover, .colorWrapper .sp-replacer.hover, .colorWrapper.hover .sp-replacer {
    border: 1px solid #b5b5b5;
}

.ReadOnlytrue .colorWrapper .sp-replacer:hover, .ReadOnlytrue .colorWrapper.hover .sp-replacer {
    border: 1px solid #d5d5d5;
}

.sp-container {
    border: 1px solid #b5b5b5 !important;
}

input.colorpicker:focus, input.colorpicker.focus, .colorWrapper .sp-replacer.focus {
    border: 1px solid #f59942 !important;
}

.colorContainer .IBButtonSelect {
    display: block;
}

    .colorContainer .IBButtonSelect:hover {
        display: block;
    }

.colorWrapper:hover .IBButtonSelect {
    opacity: 0.7;
}

input.colorpicker {
    display: block !important;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 0px;
    height: 0px;
}

.inputs {
    position: relative;
}

.colorContainer .IBStatusWarning .sp-replacer {
    background-color: #ffff4c;
}

.colorContainer.ReadOnlytrue .sp-replacer {
    background-color: #eee;
}

.colorContainer.ReadOnlytrue .IBStatusError .sp-replacer,
.colorContainer.ReadOnlytrue .IBStatusError,
.colorContainer.ReadOnlytrue .IBStatusChildError .sp-replacer,
.colorContainer.ReadOnlytrue .IBStatusException .sp-replacer,
.colorContainer.ReadOnlytrue .IBStatusChildNoCheck .sp-replacer,
{
    background-color: #ffc09a;
}

.colorContainer .IBStatusError .sp-replacer {
    background-color: #ffa07a;
}

.colorContainer .IBStatusChildError .sp-replacer {
    background-color: #ffa07a;
}

.colorContainer .IBStatusException .sp-replacer {
    background-color: #ffa07a;
}

.colorContainer .IBStatusChildException .sp-replacer {
    background-color: #ffa07a;
}

.colorContainer .IBStatusChildNoCheck .sp-replacer {
    background-color: #fff;
}

/* --------- end Color -----------*/

/* --------- TextBox array --------- */

.textaWrapper .hidden {
    display: none;
}

.textaWrapper input:not(:last-child):first-child {
    border-top: 0px solid #dedede !important;
}

.textaWrapper input:not(:last-child) {
    border: none !important;
    border-top: 1px solid #dedede !important;
}

.textaWrapper input:last-child {
    display: none;
}

.ReadOnlytrue .textaWrapper input {
    color: #656565;
    background-color: #eee;
    -webkit-opacity: 1;
    -webkit-text-fill-color: #848484;
}

.textaWrapper input {
    border: none !important;
}

.textaWrapper .options {
    border: 1px solid #ccc;
}

.textaContainer.ReadOnlytrue .textaWrapper .options {
    border: 1px solid #d5d5d5;
}

    .textaWrapper .options:focus, .textaWrapper .options.focus {
        border: 1px solid #f59942;
    }

.textaContainer:not(.ReadOnlytrue) .textaWrapper .options:hover {
    border: 1px solid rgb(181, 181, 181);
    -webkit-opacity:1;
    -webkit-text-fill-color:#848484;
}

    .textaContainer:not(.ReadOnlytrue) .textaWrapper .options.focus:hover {
        border: 1px solid #f59942;
    }

.form-group .textaContainer.IBStatusError {
    background-color: transparent !important;
}

    .form-group .textaContainer.IBStatusError .options input, .form-group .textaContainer.IBStatusChildError .options input, .form-group .textaContainer.IBStatusException .options input, .form-group .textaContainer.IBStatusChildException .options input {
        background-color: #ffa07a !important;
    }

.form-group .textaContainer.IBStatusWarning .options input {
    background-color: #ffff4c !important;
}

.form-group .textaContainer.IBStatusError.ReadOnlytrue .options input, .form-group .textaContainer.IBStatusChildError.ReadOnlytrue .options input, .form-group .textaContainer.IBStatusException.ReadOnlytrue .options input {
    background-color: #ffc09a !important;
    -webkit-opacity:1;
    -webkit-text-fill-color:#656565;
}

.form-group .textaContainer.IBStatusChildNoCheck .options input {
    background-color: #fff !important;
}



/* --------- end TextBox array --------- */



/* IB Buttons */
.input-group {
    position: relative;
    display: block;
}

    .input-group .fa {
        line-height: 18px;
    }

    .input-group .IBButtonSelect {
        right: 15px;
    }

.comboboxContainer {
    position: relative;
}

.IBButtons {
    font-size: 16px;
    line-height: 15px;
    position: absolute;
    z-index: 9000;
    top: 0;
    display: none;
    width: 17px;
    height: 20px;
    margin-top: 4px;
    cursor: pointer;
    text-align: center;
}

    .IBButtons [class^='icon-'],
    .IBButtons [class*=' icon-'],
    .IBButtons [class^='fa-'],
    .IBButtons [class*=' fa-'] .ReadOnlytrue .IBButtonSelect {
        vertical-align: top !important;
    }

    .IBButtons:hover {
        opacity: .7;
    }

.IBButtonReference {
    right: 55px;
    color: #438eb9;
}

.IBButtonUserValueRevert {
    right: 37px;
    color: #ff794c;
}

.IBButtonCancel {
    right: 37px;
    color: #FF0000;
    display: block;
}
.textWrapper.userValueButtonfalse.navigatorButtonfalse.cancelButtontrue .IBButtonCancel {
    right: 15px;
}
    .IBButtonCancel:hover {
        opacity: 0.5;
    }

.IBButtonSelect {
    right: 14px;
    color: #8b9aa3;
}

.ReadOnlytrue .IBButtonSelect,
.ReadOnlytrue .IBButtonSelect:hover,
.ReadOnlytrue .IBButtonSelect.hover {
    cursor: default;
    opacity: .4;
}

.IBStatusIcon {
    right: 16px;
    display: block;
    cursor: default;
    /*color:#777;*/
    color: #8b9aa3;
}
.ReadOnlytrue .IBStatusIcon {
    opacity: 0.8;
}
.ReadOnlytrue .IBStatusIcon:hover {
    opacity: 0.8;
}
.IBStatusIcon:hover {
    opacity: 1;
}

.IBTooltip {
    position: absolute;
    right: -12px;
    cursor: pointer;
    font-size: 18px;
    z-index: 100;
    top: 0px;
    color: #8b9aa3;
    display: none;
}
.uilist .list-value {
    color: #656565;
    font-size: 12px;
    padding-top: 2px;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 2px;
    max-height: 24px;
    height: 24px;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 24px;
    white-space: nowrap;
}
.uilist .list-value.hasIBButtonReference {
    padding-right: 40px;
    position: relative;
}
.uilist td > .IBButtonReference {
    display: block;
    padding-top: 3px;
    border: 1px solid #E1E1E1;
    background-color: #F6F6F6;
    padding-bottom: 2px;
    padding-left: 3px;
    padding-right: 3px;
    width: 23px;
    line-height: 14px;
    height: 23px;
    top: 5px;
    right: 12px;
}

.uilistitem .IBWrapper.tooltipButtontrue {
    margin-right: 12px;
}
.uilistitem .IBWrapper.tooltipButtontrue .IBTooltip {
    right: 4px;
}

    .IBTooltip:hover {
        opacity: 0.8;
        color: #555555;
    }

.pf-tooltip {
    background: #666;
    background-color: #666;
    font-size: 12px;
}
.pf-tooltip p {
    line-height: 15px;
    margin-bottom: 7px;
}
.pf-tooltip p:last-child {
    margin-bottom: 0px;
}

.ReadOnlytrue .mce-btn-group {
    cursor: default;
}

.userValueButtonfalse.navigatorButtontrue .IBButtonReference {
    right: 37px;
}

.longtextWrapper .IBButtonUserValueRevert,
.textWrapper .IBButtonUserValueRevert,
.checkWrapper .IBButtonUserValueRevert,
.formatedtextWrapper .IBButtonUserValueRevert,
.radioWrapper .IBButtonUserValueRevert,
.multicheckWrapper .IBButtonUserValueRevert,
.codeWrapper .IBButtonUserValueRevert {
    right: 15px;
}

.codeWrapper .IBButtonUserValueRevert {
    right: 11px;
}

#tinymce.focus {
    color: #696969;
}

.longtextWrapper .IBButtonReference,
.textWrapper .IBButtonReference,
.checkWrapper .IBButtonReference,
.formatedtextWrapper .IBButtonReference,
.radioWrapper .IBButtonReference {
    right: 38px;
}

.hyperlinkWrapper .IBButtonReference {
    right: 15px;
}

.textWrapper .IBButtonReference {
    right: 15px;
}

.textWrapper.userValueButtonfalse.navigatorButtontrue .IBButtonReference {
    right: 15px;
}

.ReadOnlytrue .navigatorButtontrue .disabledFix {
    right: 30px;
}

.IBWrapper.hover input {
    border: 1px solid #b5b5b5;
}

    .IBWrapper.hover input:focus {
        border: 1px solid #f59942;
    }
    .IBWrapper.hover input[readonly]:focus {
        border-color: #aaa;
    }

/* IBButtonCover */
.IBButtonsCover {
    position: absolute;
    z-index: 0;
    top: 1px;
    right: 34px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 42px;
    height: 23px;
    padding-bottom: 2px;
    opacity: .5;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    background-color: #eee;
}

.userValueButtontrue.navigatorButtontrue .IBButtonsCover {
    width: 42px;
}

.userValueButtontrue.navigatorButtonfalse .IBButtonsCover {
    width: 23px;
}

.userValueButtonfalse.navigatorButtontrue .IBButtonsCover {
    width: 23px;
}

.userValueButtonfalse.navigatorButtonfalse.cancelButtontrue .IBButtonsCover {
    width: 23px;
}

.userValueButtonfalse.navigatorButtonfalse.cancelButtonfalse.statusButtontrue .IBButtonsCover {
    display: none;
}

.longtextWrapper .IBButtonsCover,
.textWrapper .IBButtonsCover,
.checkWrapper .IBButtonsCover,
.formatedtextWrapper .IBButtonsCover,
.multicheckWrapper .IBButtonsCover,
.radioWrapper .IBButtonsCover,
.codeWrapper .IBButtonsCover {
    right: 12px;
    width: 22px;
}

.textWrapper.statusButtontrue .IBButtonsCover {
    border-left: 0px;
}

.codeWrapper .IBButtonsCover {
    right: 9px;
    height: 24px;
    border-right: 0 solid #fff;
    border-bottom: 1px solid #ccc;
}

.hyperlinkWrapper.noButtons .IBButtonsCover {
    right: 12px;
    display: block;
    width: 23px;
}

.noButtons .IBButtonsCover {
    display: none;
}

.checkWrapper .IBButtonsCover {
    height: 24px;
    border: 1px solid #ccc;
}

.multicheckWrapper .IBButtonsCover {
    height: 24px;
    borer-top: 0px;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.longtextWrapper .IBButtonsCover,
.formatedtextWrapper .IBButtonsCover {
    right: 13px;
    height: 24px;
    border-right: 0 solid #fff;
    border-bottom: 1px solid #ccc;
}

.comboWrapper.open .IBButtonsCover,
.comboWrapper.hover.open .IBButtonsCover {
    border-bottom: 1px solid #ccc;
}

.comboWrapper.hover .IBButtonsCover,
.comboWrapper.hover.noth .IBButtonsCover,
.comboWrapper.hover.ibc .IBButtonsCover {
    border-bottom: 0;
}

.comboboxContainer .comboWrapper.hover.ibc .IBButtonSelect {
    opacity: 1.0;
}



/* General styling */
.form-group input[disabled],
.form-group input:disabled {
    border: 1px solid #d5d5d5;
    background-color: #eee;
    color: #656565;
    -webkit-opacity: 1;
    -webkit-text-fill-color: #656565;
}
.form-group input[readonly],
.form-group input:read-only {
    border: 1px solid #d5d5d5;
    background-color: #eee;
    color: #656565;
    -webkit-opacity: 1;
    -webkit-text-fill-color: #656565;
}

input[type=text],
textarea {
    padding-right: 25px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-appearance: none;
}
input[type=text]:hover, input[type=text]:focus {
    /*text-overflow: clip;*/
}


.userValueButtonfalse.navigatorButtontrue input[type=text], .userValueButtonfalse.navigatorButtontrue textarea {
    padding-right: 48px;
}

.userValueButtontrue.navigatorButtonfalse input[type=text], .userValueButtontrue.navigatorButtonfalse textarea {
    padding-right: 48px;
}

.userValueButtontrue.navigatorButtontrue input[type=text], .userValueButtontrue.navigatorButtontrue textarea {
    padding-right: 65px;
}

.noButtons input[type=text],
.noButtons textarea {
    padding-right: 5px;
}

.ReadOnlytrue:hover input,
.ReadOnlytrue:hover textarea {
    border: 1px solid #d5d5d5;
    -webkit-opacity:1;
    -webkit-text-fill-color:#656565;
}
.ReadOnlytrue:hover input:focus, .ReadOnlytrue:hover textarea:focus {
    border: 1px solid #aaa;
}
.form-group > label.control-label {
    /*overflow: auto;*/
	line-height:15px;
    height: auto;
    /*word-break: break-all;*/
    word-break: normal;
    word-wrap: break-word;
    white-space: normal;
    margin-bottom: 2px;
    padding-right: 0px;
    /*text-overflow: ellipsis;*/
}
.form-group-MultiCheck > label.control-label {
    overflow: visible;
}
.form-group-MultiCheck > label.control-label .multichecksearch  {

}

.unit {
    font-size: 12px;
    line-height: 23px;
    float: right;
    margin-right: -15px;
    text-align: right;
}
.col-md-0d5 .unit {
    margin-right: -5px;
}

input[type=text].pfcode {
    font-family: monospace,serif;
    font-size: 11px;
    border-radius: 4px !important;
}

/* Primefact language */
.ml {
    display: none;
    float: left;
    width: 16px;
    height: 16px;
    margin-top: 5px;
    margin-left: -6px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    margin-bottom: 4px;
}

    .ml.language0 {
        display: block;
        background-image: url(../img/primefact/flags/16/UnitedKingdom.png);
    }

    .ml.language1 {
        display: block;
        background-image: url(../img/primefact/flags/16/Netherlands.png);
    }

    .ml.language2 {
        display: block;
        background-image: url(../img/primefact/flags/16/Germany.png);
    }

    .ml.language3 {
        display: block;
        background-image: url(../img/primefact/flags/16/France.png);
    }

    .ml.language4 {
        display: block;
        background-image: url(../img/primefact/flags/16/Italy.png);
    }

    .ml.language5 {
        display: block;
        background-image: url(../img/primefact/flags/16/Spain.png);
    }

    .ml.language6 {
        display: block;
        background-image: url(../img/primefact/flags/16/OPEC.png);
    }

    .ml.language7 {
        display: block;
        background-image: url(../img/primefact/flags/16/OPEC.png);
    }

    .ml.language8 {
        display: block;
        background-image: url(../img/primefact/flags/16/OPEC.png);
    }

    .ml.language9 {
        display: block;
        background-image: url(../img/primefact/flags/16/Sweden.png);
    }

    .ml.language10 {
        display: block;
        background-image: url(../img/primefact/flags/16/Norway.png);
    }

    .ml.language11 {
        display: block;
        background-image: url(../img/primefact/flags/16/Denmark.png);
    }

.clear {
    clear: both;
}


/* Lists */

.lists .col-md-6 {
    width: 100% !important;
    padding-left: 0px;
    padding-right: 0px;
}

.lists .col-md-12.form-group {
    padding-left: 0px;
    padding-right: 0px;
}

.lists .form-group > label {
    display: none;
}
.lists .form-group .meta .unit {
    margin-right: 2px;
    line-height: 19px;
}

.lists .uilistitem .btn-app {
    /*margin-left: 3px;
	margin-right: 8px;
	margin-top: 0px;*/
}


    .uilist .dataTables-pf tr.selected.uilistitem.isbase-true td {
        background: rgb(219, 231, 238) !important;
    }

    .uilist .dataTables-pf tr.selected.uilistitem.isbase-true {
        border-left: 5px solid #f59942 !important;
    }
.uilistitem.isbase-true {
    background-color: #eee !important;
    border-left: 5px solid #eee !important;
}

    .uilistitem.isbase-true td {
        background-color: #eee !important;
    }

.uilist .dataTables_scrollBody table {
}
.uilist .dataTables_scrollHead .dataTables_scrollHeadInner {
    padding-right: 17px !important;
}
.uilist .dataTables_info {
    display: none;
}

.uilist .dataTable th[class*=sort]:after {
	margin-top: -37px;
    line-height: 37px;
}
.dataTable th[class*=sort]:after {
    margin-right: 3px;
}

.uilist .dataTables_scrollBody table[data-sort='Sort'] thead {
	
}
.uilist .dataTable th.sorting_asc .columntitle, .uilist .dataTable th.sorting_desc .columntitle, .uilist .dataTable th.sorting .columntitle {
    padding-right: 15px;
}
.dataTable th.sorting_desc, .dataTable th.sorting_asc {
	background-image: none;
}
	
.uilist .dataTable th[class*=sort]:first-child:after {
	display: none;
}
.table .selectItemAll {
    position: absolute;
    top: 6px;
    left: 7px;
}

    .table .selectItemAll:active {
        position: absolute;
        top: 6px;
        left: 7px;
    }

    .table .selectItemAll .fa-square-o.selected:before {
        content: "\f046";
    }

/* --------- Grid ----------*/
.componentWrapper .grid > .grid {
    padding-bottom: 20px;
}
.grid .removeIcon {
    color: #D15B47;
    cursor: pointer;
    margin-right: -5px;
    position: absolute;
    text-align: center;
    width: 20px;
    height: 26px;
    line-height: 23px;
}
.grid .handsontableInput {
    border: 1px solid #f59942;
    height: 26px !important;
    line-height: 26px !important;
    font-family: 'Open Sans';
    padding: 0px 4px 0 4px !important;
    font-size: 13px;
    color: #393939;
}
.grid .htMobileEditorContainer {
    z-index: 11000;
}

/* toolbar button .selected */
.btn > i.selected {
    color: yellow;
}
  
.grid-filter-input-wrapper {
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 10px;
}
.grid-filter-input {
    width: 100%;
}

/* --------- ListEditor -----------*/

.uilist .form-group {
    margin-bottom: 0px;
}

.input-group {
    /*min-width: 100px;*/
}

.uilist thead th:first-child {
    min-width: 80px !important;
    max-width: 80px !important;
    width: 80px !important;
}

.uilist thead th {
   /* min-width: 100px !important;*/
   min-width: 28px !important;
}

.uilist .table tbody > tr > td {
    padding-bottom: 5px;
    padding: 8px;
    padding-left: 0px;
    padding-right: 0px;
     -moz-user-select: text;
     -khtml-user-select: text;
     -webkit-user-select: text;
     -ms-user-select: text;
     user-select: text;
}

.uilist.finderresult .table tbody > tr > td {
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 6px;
    padding-top: 6px;
    /*min-width: 100px;*/
    min-width: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 28px;
     -moz-user-select: text;
     -khtml-user-select: text;
     -webkit-user-select: text;
     -ms-user-select: text;
     user-select: text;
}

.uilist .table tbody > tr > td:first-child {
    min-width: 80px !important;
    max-width: 80px !important;
    width: 80px !important;
    overflow: visible;
    padding-left: 6px;
    line-height: 28px;
    height: 41px;
    padding-right: 6px;
}
.uilist .table tbody > tr > td.dataTables_empty:first-child {
   /* width: 100% !important;
    max-width: 100% !important;*/

}
.uilist .table thead > tr > th:first-child {
    cursor: pointer !important;
}

.uilist .col-md-11 {
    float: right;
    width: 90%;
    /*margin-right: -12px; check */
    padding-left: 0px !important;
    margin-left: -12px;
}

.uilist {
    position: relative;
}

    .uilist .table {
        height: 100%;
        /*padding-top: 30px;*/
        margin-top: -7px;
    }

    .uilist table.dataTable {
    }

    .uilist table {
        border-top: 0px;
        position: relative;
    }

    .uilist .dataTables_scrollBody {
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }

    .uilist .dataTables_scrollHead {
        border-left: 1px solid #ddd !important;
        border-right: 1px solid #ddd !important;
        border-top: 1px solid #ddd !important;
        border-bottom: 1px solid #ddd !important;
        background: #f2f2f2;
        background-image: -webkit-gradient(linear,left 0,left 100%,from(#f8f8f8),to(#ececec));
        background-image: -webkit-linear-gradient(top,#f8f8f8,0%,#ececec,100%);
        background-image: -moz-linear-gradient(top,#f8f8f8 0,#ececec 100%);
        background-image: linear-gradient(to bottom,#f8f8f8 0,#ececec 100%);
    }

    .uilist .dataTables_wrapper input[type=text], .dataTables_wrapper select {
    }

    .uilist input[type='search'] {
        margin-left: 5px;
    }

    .uilist .dataTables_paginate a {
        padding-right: 3px;
        padding-left: 3px;
    }

.pagination > li > a, .pager > li > a {
    cursor: pointer;
    padding-top: 5px;
}

.uilist .pagination {
    margin-top: 0px;
}
.uilist .widget-content > .pagination {
    /*position: absolute;
    top: 53px;
    right: 12px;*/
    /*padding-top: 2px;*/
    margin-bottom: 0px;
    margin-right: 1px;
}
@media only screen and (max-width: 1120px) {
    /*.col-sm-8.uilist .widget-content > .pagination {
        position: static;
        margin-bottom: 8px;
    }
    .col-sm-8.uilist .widget-foot > .pagination.pull-right {
        float: none !important;
        margin-bottom: 5px;
    }*/
}

.uilist .widget-foot > .pagination {
    /*margin-top: -11px;
    margin-right: 1px;*/
    margin-bottom: 0px;
}

    .uilist .pagination li.item {
        display: none;
    }
    .uilist .pagination li.divider {
        height: 28px;
    }
    .uilist .pagination li.divider a {
        width: 30px;
        line-height: 1.428571429;
        float: left;
        border: 0px solid;
        color: #000;
        background-color: transparent;
        height: 32px;
        cursor: default;
        font-size: 13px;
        padding-left: 10px;
        padding-right: 3px;
    }

.uilist .quickpage {
    float: left;
    width: 45px;
    margin-right: 10px;
    height: 31px;
        margin-bottom: 8px;
}
.uilist .quickpage.top {
    /*top: 53px;
    position: absolute;
    left: 80px;*/
    margin-bottom: 7px;
    float: left;
}

    .uilist .quickpage input {
        width: 45px;
        height: 31px;
    }

.uilist .pagesize {
    float: left;
    width: auto;
    margin-right: 10px;
    height: 31px;
    margin-bottom: 5px;
    /*padding-top: 2px;*/
}
.uilist .pagesize.top {
    /*top: 53px;
    position: absolute;*/
}
    .uilist .widget-foot .pagesize {
        padding-top: 0px;
    }


    .uilist .pagesize select {
        width: auto;
        height: 31px;
    }

.uilist .dataTables-pf tr.uilistitem td {
    overflow: hidden; /* fix IE */
}

.uilist .dataTables-pf tr {
    border-left: 5px solid transparent;
}

    .uilist .dataTables-pf tr:nth-child(odd) {
        border-left: 5px solid #f9f9f9;
    }
    .uilist .dataTables_scrollBody .dataTables-pf tr:nth-child(odd) {
        border-right: 5px solid #f9f9f9;
    }

.uilist .dataTables-pf thead:nth-child(odd) tr {
    border-left: 5px solid rgb(242, 242, 242);
}

.uilist .dataTables-pf tr.selected {
    /* background: rgb(244, 246, 247);*/
    background: rgb(230, 239, 244);
    border-left: 5px solid #f59942;
}

    .uilist .dataTables-pf tr.selected td {
        background: rgb(230, 239, 244);
    }

    .uilist .dataTables-pf tr.selected {
    /* background: rgb(244, 246, 247);*/
    background: rgb(230, 239, 244);
    border-left: 5px solid #f59942;
}


.uilist .dataTables-pf tr:nth-child(odd) td:nth-child(odd) {
}

.uilist {
    display: none;
}

    .uilist .table .table thead {
    }

    .uilist .col-md-6.hasMeta .col-md-1.meta {
        min-width: 30px;
        position: absolute;
    }

    .uilist .col-md-6.hasMeta .input-group {
        padding-left: 12px !important;
    }

    .uilist .ReadOnlytrue .IBWrapper .disabledFix {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0px;
    }

.table thead > tr > th {
    border-bottom: 0px;
}

.uilist table thead tr {
}

.uilist tbody > tr > td {
    border: none;
    position: relative;
}

    .uilist tbody > tr > td .borderSpace {
        width: 0px;
        height: 100%;
        background-color: #EBEBEB;
        position: absolute;
        margin-top: -8px;
        margin-left: -7px;
    }

.uilist tbody > tr.selected > td > .borderSpace {
    visibility: hidden;
}

.uilist tbody > tr:not(.nhover) > td > .borderSpace {
    visibility: hidden;
}

.uilist tbody > tr > td:nth-child(2) > .borderSpace {
    visibility: hidden;
}

.uilist thead > tr > th {
    font-weight: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-left: 0px;
    border-right: 0px;
    padding-left: 0px;
    padding-bottom: 2px;
    height: 38px;
    line-height: 38px;
    padding-top: 0px !important;
}

    .uilist thead > tr > th > span {
        display: inline-block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 200px;
    }

.uilist .input-group {
    padding-left: 0px;
}

.uilist .pagination > li {
    display: inline-block;
     margin-bottom: 5px;
    float: left;
}
.uilist .pagination > li:last-child {
   
}
.uilist .title-toolbar {
    top: -30px;
}

.uilist .toolbar-bottom .title-toolbar {
    top: -16px;
    padding-right: 190px;
}
@media(max-width:580px) {
    .uilist.finderresult .toolbar-bottom .title-toolbar {
        top: 5px;
    }
}
@media(min-width:768px) and (max-width:880px) {
   .col-sm-8.uilist.finderresult .toolbar-bottom .title-toolbar {
        top: 5px;
    }
}

.uilist .dataTables_info {
    border-top: 1px solid #ddd;
}

.uilist table.cell-overflow-hidden th, table.cell-overflow-hidden td {
    overflow: hidden;
}

.uilist thead > tr > th {
    border-right: 1px solid #ccc;
    padding-left: 8px;
}

.uilist tbody > tr > td {
    border-right: 0px solid transparent;
}

.uilist td {
    overflow-x: hidden;
}

.uilist .dataTables_info {
    font-size: 12px;
}

.selected .icon-check-empty:before, .selected .fa-square-o:before {
    content: "\f046";
}

.uilist .dataTables-pf tr.selected td.dataTables_empty {
    background: #f9f9f9;
    border-left: 5px solid #f9f9f9;
}

.uilist .IBButtons {
    z-index: 1;
}

.uilist .toolbar-top {
    position: absolute;
    margin-top: -16px;
    right: 0px;
}
@media(min-width:992px) and (max-width:1036px) {
    .uilist .toolbar-top {
        position: relative;
    }
    #pagecontainer #currentpage .uilist .toolbar-top > .title-toolbar {
        height: auto;
    }
}

    .uilist .toolbar-top.fr {
        right: 12px;
    }

.uilist .dropdown-menu {
    right: 0px;
    left: auto;
    max-height: 240px;
    overflow-y: scroll;
}


    .uilist .dropdown-menu > li > a, .dropdown-menu > li > a {
        text-align: left;
        padding-right: 30px;
    }

    .uilist .dropdown-menu .dd-button, .dropdown-menu .dd-button {
        padding-left: 5px !important;
        position: absolute;
        right: 10px;
        line-height: 20px;
    }

    .uilist .dropdown-menu li, .dropdown-menu li {
        cursor: pointer;
    }

.sortbutton {
    cursor: pointer;
    position: absolute;
    right: 4px;
}

.uilist.finderresult td {
    padding: 8px;
}

.uilist.finderresult .scrollRight {
    top: calc(50% - 42px);
    right: 23px;
    position: absolute;
    cursor: pointer;
    display: none;
}
.uilist.finderresult .scrollRight > i, .uilist.finderresult .scrollLeft > i {
    font-size: 50px;
    color: #ccc;
}
.uilist.finderresult .scrollRight > i:hover, .uilist.finderresult .scrollLeft > i:hover {
    font-size: 50px;
    color: #aaa;
}

.uilist.finderresult .scrollLeft {
    top: calc(50% - 0px);
    right: 27px;
    position: absolute;
    cursor: pointer;
    display: none;
}

.uilist .list-information {
    /*padding-right: 200px;*/
    line-height: 14px;
}

.pull-left {
    margin-left: -10px;
    padding-left: 8px;
    padding-right: 10px;
    /*cursor: pointer;*/
    
   
}


.slimScrollDiv .table.table-bordered thead tr th, .slimScrollDiv .table.table-bordered thead tr th .portal-val {
    max-height: 42px;
    text-overflow:ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}
.slimScrollDiv .table.table-bordered thead tr th.sorting {
    padding-right: 20px;
}
.slimScrollDiv .table.table-bordered thead tr th.sorting_asc {
    padding-right: 20px;
}
.slimScrollDiv .table.table-bordered thead tr th.sorting_desc {
    padding-right: 20px;
}
.slimScrollDiv .dataTable th:after {
    position: absolute;
    right: 5px;
    top: 12px;
}
.slimScrollDiv .dataTables_scrollBody > table {
    border-top: 0px;
}
.slimScrollDiv .dataTables_scrollHead table {
    border-bottom: 0px;
}
.sortable {
    position: relative;
}

    .sortable:hover {
        cursor: default;
    }

    .sortable .pull-left {
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    .dataTables-pf thead th.resize {
        cursor: col-resize !important;
    }
    .dataTables-pf thead th {
        cursor: pointer !important;
    }

.table tr td {
    position: relative;
    background-clip: padding-box;
}

.table tr .selectItem, .table tr .selectItem:active, .table tr .pickItem, .table tr .pickItem:active {
    width: 28px !important;
    z-index: 2;
    position: absolute;
    left: 4px;
    right: auto !important;
    top: 6px;
}

.table tr .navigateToItemBtn, .table tr .navigateToItemBtn:active {
    width: 28px !important;
    z-index: 2;
    position: absolute;
    left: 37px;
    right: auto !important;
    top: 6px;
}

.table tr:hover td:nth-child(2) {
    /*padding-right: 33px !important;*/
}

.table tr:hover td:nth-child(2) {
}

    .table tr:hover td:nth-child(2) .IBWrapper {
        /*padding-right: 0px !important;*/
    }

.table tr:hover .navigateToItemBtn {
}

.table tr td:hover .navigateToItemBtn {
}

.table td:hover .navigateToItemBtn, .table td .navigateToItemBtn:hover {
    /*    -webkit-transition: .125s linear;
    -moz-transition: .125s linear;
    -ms-transition: .125s linear;
    -o-transition: .125s linear;
    transition: .125s linear;
	visibility: visible;
	opacity: 0.7;
	width: 28px !important;*/
}

.table td .navigateToItemBtn:hover {
}

body.waiting * {
    cursor: wait !important;
}

.uilist .locked-true td, .uilist .locked-true {
    background-color: #ffefd5 !important;

}
.uilist .dataTables-pf tr.locked-true {
     border-left: 5px solid #FFEFD5;
}
 .uilist .dataTables-pf tr.locked-true.selected {
     border-left: 5px solid #F59942;
}
.uilist .locked-true td:first-child {
   
}
.uilist .locked-true.selected td:first-child{


}
.uilist .dataTables-pf tr {

}
.uilist .locked-true td:first-child .selectItem, .uilist .locked-true td:first-child .selectItem:active {

}
.uilist .locked-true td:first-child .navigateToItemBtn, .uilist .locked-true td:first-child .navigateToItemBtn:active {

}

    .uilist .locked-true.selected td, .uilist .locked-true.selected {
        background-color: #FFDEA6 !important;
    }

/* Hover style */

.uilist tr:not(:hover):not(.selected) .form-group input {
    background-color: transparent;
    border: 1px solid transparent;
}

.uilist tr:not(:hover):not(.selected) .comboboxContainer .select2-container .select2-choice {
    background-color: transparent;
    border: 1px solid transparent;
}

.uilist tr:not(:hover):not(.selected) .IBButtonsCover {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.uilist tr:not(:hover):not(.selected) .colorWrapper .sp-replacer {
    background-color: transparent;
    border: 1px solid transparent;
}

.uilist tr:not(:hover):not(.selected) .radioWrapper .radioButtons {
    background-color: transparent;
    border: 1px solid transparent;
}

.uilist tr:not(:hover):not(.selected) .multicheckWrapper .checkButtons {
    background-color: transparent;
    border: 1px solid transparent;
}

.editentity.hover {
    text-decoration: underline;
    color: #2a6496;
}


/* --------- end ListEditor -----------*/

/* --------- PC Grid ------------*/
#pcgridcontainer table thead > tr > td > div, #pcgridcontainer table tbody > tr > td > div {
    /*min-width: 120px;*/
    padding: 3px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    overflow: hidden;
    work-break: break-all;
    height: 100% !important;
}

.handsontable table.htCore {
   /* width: auto; why?? */
  
}
.gridDefault {
    /*padding-bottom :70px;*/
}
.handsontable thead tr th  {
    background-color: #eee;
}
.componentWrapper > .grid .handsontable thead tr th div {
    visibility: visible;
}
.componentWrapper > .grid .handsontable thead tr th {
    text-align: left;
}
.handsontable thead tr th div {
    visibility: hidden;

}
#pcgridcontainer .ht_clone_top.handsontable {
    width: auto !important;
}
#pcgridcontainer .ht_clone_top.handsontable .wtHolder{
    width: auto !important;
}
.handsontable tr:first-child td.hothide {
    height: auto !important;
}
.handsontable tr td.hothide {
    height: 26px !important;
    border-width: 0px !important;
    border-style : solid !important;
    border-bottom: 1px solid #ccc !important;
}
.handsontable tr td.hothide.hideBorderBottom {
    border-bottom: 0px solid !important;
}
.handsontable .htCore tr:last-child td.hothide {
    border-bottom: 0px solid !important;
}
.handsontable .wtHider {

}
.ht_master, .ht_clone_left, .ht_clone_top {
   overflow:visible;
 }
#pcgridcontainer {
    width: 100% !important;
    height: 100% !important;
    overflow: auto !important;
    position: absolute;
}
#pcGridDoc .control-label {
    display: none;
}
.handsontable table.htCore tbody tr:last-child {

}
.handsontable th, .handsontable td {
    height: 100% !important;
   /* overflow: visible;*/
   text-overflow: ellipsis;
   line-height: 26px;

}
.grid-scroll .handsontable th, .grid-scroll .handsontable td {
    white-space: nowrap;
}
.grid-scroll .ht_master .wtHolder {
    overflow: auto; 
} 
    /* grid inputboxes alignment fixes */
    #pcgridcontainer .comboboxContainer .select2-container .select2-choice {
        line-height: 24px;
    }

.componentWrapper .grid-scroll {
    height: calc(100vh - 252px);

    width: 100%;
    overflow: hidden;
}
    .componentWrapper .grid-scroll .htCore tbody {
        
    }
    /* --------- Trees -----------*/
    .soeditor .dd-handle {
        height: 20px !important;
        max-height: 20px;
        min-height: 20px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        position: relative;
    }

.soeditor .dd-handle-text {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    padding-right: 8px;
}

.soeditor .collapse {
    height: 20px;
    width: 12px;
    position: absolute;
    right: 0px;
    top: 0px;
    display: block;
    cursor: pointer;
}

    .soeditor .collapse:hover {
        color: #F59942;
    }

.so-toolbars {
    margin-bottom: 10px;
    margin-top: -1px;
/*    max-height: 140px;
    overflow-x: auto;*/
}

.so-toolbar button {
    height: 20px;
    width: 29px !important;
    float: right;
    margin-right: 3px !important;
}
.so-toolbar button i {
    font-size: 15px !important;
}
@media only screen and (max-width: 1420px) {
    .so-toolbar button i {
        font-size: 15px !important;
    }
    .so-toolbar button {
        height: 20px;
        width: 29px !important;
        float: right;
        margin-right: 3px !important;
    }
}
.so-toolbar {
    text-align: right;
}

.receipttree .dd-list > li[class*='item-'] > .dd-handle, .receipttree .dd-handle {
    height: 20px !important;
    max-height: 20px;
    min-height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-right: 15px !important;
    line-height: 15px !important;
}

    .receipttree .dd-handle .navigateToObject i {
        cursor: pointer;
    }

.receipttree .navigateToObject {
    width: 20px;
    position: absolute;
    right: 12px;
    color: #478FCA;
}

.receipttree .jstree-hovered .navigateToObject {
}

.receipttree .jstree-clicked .navigateToObject {
    color: #fff;
}


.componenttree .dd-list > li[class*='item-'] > .dd-handle, .componenttree .dd-handle {
    height: 20px !important;
    max-height: 20px;
    min-height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-right: 15px !important;
    line-height: 15px !important;
}

    .componenttree .dd-handle .navigateToObject i {
        cursor: pointer;
    }

.componenttree .navigateToObject {
    width: 20px;
    position: absolute;
    right: 12px;
    color: #478FCA;
}

.componenttree .jstree-hovered .navigateToObject {
}

.componenttree .jstree-clicked .navigateToObject {
    color: #fff;
}

.root > ul > li > .jstree-icon {
    display: none;
}

#jstree-dnd .status {
    display: none;
}
#jstree-dnd {
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.65);
    -moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.65);
    box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.65);
    background-color: #fff;
}
#jstree-dnd > i {
    color: #000;
    background-color: #fff;
    border-right: 1px solid #ccc;
    padding-right: 5px !important;
    width: 25px !important;
}
#jstree-dnd.jstree-proton {
    padding: 0 2px !important;
}
#jstree-dnd > span {
    color: #000;
    padding: 0px 5px 2px 5px !important;
}

.root > ul > li > ul > .jstree-node {
    margin-left: 0px;
}

.root > ul > li > .jstree-anchor {
    width: calc(100% + 22px);
    background: #76b6ec;
    color: #fff;
}

.root > ul > li.act > .jstree-anchor {
    background: #76b6ec;
}

.root > ul > li > .jstree-anchor.jstree-clicked {
    background: #3392e3;
}

.pftree .act > .dd-handle {
    background: rgb(244, 246, 247);
    border-top: 1px solid #d5d5d5;
    border-right: 3px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
}

.receipttree .jstree-themeicon, .flattree .jstree-themeicon, .soeditortree .jstree-themeicon {
    display: none;
}

.receipttree .jstree-anchor, .flattree .jstree-anchor, .soeditortree .jstree-anchor {
    padding-left: 0px;
    width: 100%;
}

    .receipttree .jstree-anchor span, .flattree .jstree-anchor span, .soeditortree .jstree-anchor > span {
        padding-left: 5px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        width: 100%;
        height: 100%;
    }

.flattree.jstree .jstree-anchor {
    padding-left: 20px;
    position: relative;
}

.flattree li.colorheader > .jstree-anchor {
    padding-left: 0px;
}

.flattree .status {
    position: absolute;
    margin-left: -15px;
    top: 0px;
    /*text-shadow: 0px 0px 1px #606060;*/
}

.receipttree .jstree-anchor {
    padding-left: 20px;
    position: relative;
}

.receipttree li.colorheader > .jstree-anchor {
    padding-left: 0px;
}

.receipttree .status {
    position: absolute;
    margin-left: -20px;
    top: 0px;
    /*text-shadow: 0px 0px 1px #606060;*/
}

.componenttree .jstree-themeicon, .flattree .jstree-themeicon, .soeditortree .jstree-themeicon {
    display: none;
}

.componenttree .jstree-anchor, .flattree .jstree-anchor, .soeditortree .jstree-anchor {
    padding-left: 0px;
    width: 100%;
}

    .componenttree .jstree-anchor span, .flattree .jstree-anchor span, .soeditortree .jstree-anchor > span {
        padding-left: 5px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

.componenttree .colorheader > .jstree-anchor {
    padding-left: 0px;
}

.componenttree .jstree-anchor {
    padding-left: 20px;
    position: relative;
}

.componenttree .status {
    position: absolute;
    margin-left: -20px;
    top: 0px;
    line-height: 16px;
    /*text-shadow: 0px 0px 1px #606060;*/
}


.root > ul > li > .jstree-anchor > .status {
    margin-left: -15px;
}

.receipttree .status.Ok i, .flattree .status.Ok i, .soeditortree .status.Ok i{
    color: #00BF13 !important;
}

.componenttree .status.Ok i {
    color: #00BF13 !important;
}

.root > ul > li > .jstree-anchor > .status.Ok {
    text-shadow: 0px 0px 2px #000509;
}

.receipttree .active > a > span > .status.Ok i, .flattree .active > a > span > .status.Ok i, .soeditortree .active > a > span > .status.Ok i {
    text-shadow: 0px 0px 2px #000509;
}

.receipttree .active > a > span > .status.Error i, .flattree .active > a > span > .status.Error i, .soeditortree .active > a > span > .status.Error i {
    text-shadow: 0px 0px 2px #000509;
}

.receipttree .active > a > span > .status.Warning i, .flattree .active > a > span > .status.Warning i, .soeditortree .active > a > span > .status.Warning i {
    text-shadow: 0px 0px 2px #000509;
}
	
.receipttree .active > a > span > .status.ChildError i, .flattree .active > a > span > .status.ChildError i, .soeditortree .active > a > span > .status.ChildError i {
    text-shadow: 0px 0px 2px #000509;
}

.receipttree .status.Error i, .flattree .status.Error i, .soeditortree .status.Error i  {
    color: #FF4040 !important;
}

.receipttree .status.Warning i, .flattree .status.Warning i, .soeditortree .status.Warning i {
    color: #FBFB00 !important;
    text-shadow: 0px 0px 2px #000509;
}

.receipttree .status.ChildError i, .flattree .status.ChildError i, .soeditortree .status.ChildError i {
    color: #FBFB00 !important;
    text-shadow: 0px 0px 2px #000509;
}

@media(max-width:991px) {
    .receipttree, .flattree, .soeditortree {
        padding-bottom: 0px !important;
    }
}
.receipttree, .flattree, .soeditortree {
    padding-bottom: 50px;
    padding-right: 20px;
}


.componenttree .active > a > span > .status.Ok i {
    text-shadow: 0px 0px 2px #000509;
}

.componenttree .active > a > span > .status.Error i {
    text-shadow: 0px 0px 2px #000509;
}

.componenttree .active > a > span > .status.Warning i {
    text-shadow: 0px 0px 2px #000509;
}

.componenttree .active > a > span > .status.ChildError i {
    text-shadow: 0px 0px 2px #000509;
}

.componenttree .status.Error i {
    color: #FF4040 !important;
}

.componenttree .status.Warning i {
    color: #FBFB00 !important;
    text-shadow: 0px 0px 2px #000509;
}
							  
.componenttree .status.ChildError i {
    color: #FBFB00 !important;
    text-shadow: 0px 0px 2px #000509;
}

.componenttree, .flattree, .soeditortree, .receipttree {
    /*padding-bottom: 50px;*/
    margin-bottom: 42px;
    padding-right: 20px;
    margin-top: 1px;
    
}

@media(max-width:767px) {
    .soeditortree[data-scrolling="keep"], .receipttree[data-scrolling="keep"], .componenttree[data-scrolling="keep"] {
        height: auto !important;
    }
}
@media(min-width:768px) {

    .soeditortree[data-scrolling="keep"], .receipttree[data-scrolling="keep"], .componenttree[data-scrolling="keep"] {
        height: calc(100vh - 420px);
        overflow-y: auto;
        overflow-x: hidden;
        min-height: 200px;
        position: relative;
        padding-right: 23px;
        margin-bottom: 0px;
    }
    .receipttree[data-scrolling="keep"], .componenttree[data-scrolling="keep"] {
        height: calc(100vh - 273px);
    }

    #pagecontainer .ica .scroll[data-scrolling="keep"] {
        height: calc(100vh - 182px);
        overflow-y: auto;
        overflow-x: hidden;
        min-height: 200px;
        position: relative;
        padding-bottom: 20px;
        /*top: -48px;*/
    }

    #pagecontainer .ica .scroll[data-scrolling="keep"] .fieldHeader:first-child h3 {
        /*margin-top: 0px;*/
    }
}

.soeditor h3.smaller {
    padding-right: 30px;
}
.soeditor .status {
    position: absolute;
    margin-left: -15px;
    top: 0px;
    /*text-shadow: 0px 0px 1px #606060;*/
}
.soeditortree .colorheader > .jstree-anchor {
    padding-left: 0px;
}

.soeditortree .jstree-anchor {
    padding-left: 20px;
    position: relative;
}

.jstree-anchor {
}

    .jstree-anchor > span {
        width: 100%;
        display: inline-block;
    }

.jstree-node.act > .jstree-anchor:hover {
}

.receipttree > ul > li > ul > li > .jstree-anchor {
    font-style: italic;
    font-weight: 100;
}
.receipttree > ul > li > ul  > li li.lightgreen  .jstree-anchor {
    font-style: italic;
    font-weight: 100;
}

.componenttree > ul > li > ul li.colorheader > .jstree-anchor {
    /*    background: #FFEFD9; /* Tree group: show as yellow */
    font-style: italic;
    font-weight: 100;
}

.flattree > ul > li > ul li.colorheader > .jstree-anchor {
    /*    background: #FFEFD9; Tree group: show as yellow */
    font-style: italic;
    font-weight: 100;
}
/* ToDo: receipttree, header always lightyellow? */

.root > ul > li > ul li.colorheader > .jstree-anchor.jstree-clicked {
    background: #3392e3;
}

.root > ul > li > ul li.colorheader.act > .jstree-anchor {
/*    background: #FFCC88;  Tree group: show as yellow */

}
.root > ul > li > ul li.colorheader.act > .jstree-anchor.jstree-clicked {
/*    background: #3392e3; */
}

.root > ul > li > ul > li.act > .jstree-anchor {
/*    background: #FFCC88;*/
}

.jstree-node.act > .jstree-anchor {
    background: #EBEBEB;
    border-radius: 0px;
}

.jstree-node.active > .jstree-anchor {
    /*background: #EBEBEB;*/
    border-radius: 0px;
}

    .jstree-node.active > .jstree-anchor.jstree-clicked {
        background: #3392e3;
        border-radius: 0px;
    }

.componenttree .jstree-node.act > .jstree-anchor {
    /*background: #FFCC88;*/
}

.jstree-node.act > .jstree-anchor.jstree-clicked {
    background: #3392e3;
}

/* --------- end Trees -----------*/


/* Open PFEntity in webapp CSS */
.indexSkeletonBody #breadcrumbs {
    top: 0px;
}
.indexSkeletonBody #navbar {
    display: none;
}
.indexSkeletonBody #propertypagebuttons {
    bottom: 0px;
}
.indexSkeletonBody #propertylistbuttons {
    bottom: 0px;
}
.indexSkeletonBody .btn-scroll-up {
    /*bottom: 10px;*/
}
.indexSkeletonBody {
    padding-top: 0px;
}
.indexSkeletonBody .methodsdocuments {
    /*display: none !important;*/
}
.indexSkeletonBody .attachments  {

}
.indexSkeletonBody ul.breadcrumb {
    display: none;
}
.indexSkeletonBody .specialGroup .wf-actions {
	display: none;
}
.featherlight-iframe {
    cursor: default !important;
}
.entityContent .featherlight-close {
    display: none;
}

.specialWrapper #svgplaceholder > svg {
    height: auto;
    min-width: 750px;
}
.specialWrapper #svgplaceholder {
    overflow-x: auto;
}
.specialWrapper #zoomSpecial {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 20px;
    color: #8b9aa3 !important;
    cursor:pointer;
}

/* Start GEO editor */
#currentdocument {
    position: relative;
}

    #currentdocument #container {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0px;
    }

    #currentdocument #loadingimg {
        top: 45%;
        position: absolute;
    }

    #currentdocument #twodcanvas {
        position: absolute;
        z-index: 0;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        border: 1px solid #ccc;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

#pageredge {
    position: relative;
}

    #pageredge.pc .svgcontainer > svg {
        -webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);
        box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);
    }

    #pageredge .svgcontainer {
        position: absolute;
        top: 0px;
        display: none;
    }

        #pageredge .svgcontainer.visible {
            position: absolute;
            top: 0px;
            display: block;
        }

#currentdocument .svgcontainer > svg {
    height: 100% !important;
    width: auto !important;
    display: block;
    margin-left: auto;
    margin-right: auto;
    /*padding: 1px;*/
}

#currentdocument #diagramcontainer .svgcontainer > svg {
    width: 100% !important;
}

#currentdocument .svgcontainer > svg #svgtoplevelg {
}

/* pageredge with scroll */
#pageredge.Scrolltrue {
    margin: 0 auto;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 804px;
}

#pageredge.pc.Scrolltrue .svgcontainer > svg {
    box-shadow: None;
    display: block;
    overflow: hidden; /* translate correction */
}

#pageredge.Scrolltrue .svgcontainer.visible {
    position: relative;
    top: auto;
    display: block;
}

#pageredge.Scrolltrue .svgcontainer {
    position: relative;
    top: auto;
    display: block;
    border-bottom: 1px solid #ccc;
}



.pc-nav-buttons {
    text-align: center;
    color: #A0B2C1;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    position: relative;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .pc-nav-buttons * {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

.pc-navigation {
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    color: rgb(57, 57, 57);
    font-size: 15px;
}

    .pc-navigation div {
        display: inline-block;
    }

.pc-nav-buttons .btnFitWidth {
    top: 5px;
}

    .pc-nav-buttons .btnFitWidth:active {
        left: auto;
        top: 5px;
    }

.pc-nav-buttons .btnFitHeight {
    top: 5px;
}
.pc-nav-buttons .btnDownloadPDF {
    display: none;
}

.pc-nav-buttons .btnFitWidth.active {
    background: #9baebc !important;
}

.pc-nav-buttons .btnFitHeight:active {
    left: auto;
    top: 5px;
}

.pc-nav-buttons .btnFitHeight.active {
    background: #9baebc !important;
}

.pc-nav-buttons .pc-prev-button {
    display: inline-block;
    cursor: pointer;
}

    .pc-nav-buttons .pc-prev-button:not(.disabled):hover {
        opacity: 0.8;
    }

.pc-nav-buttons.up {
    margin-top: -40px;
    position: absolute;
    width: 100%;
}

.pc-nav-buttons .pc-next-button {
    display: inline-block;
    cursor: pointer;
}

    .pc-nav-buttons .pc-next-button:not(.disabled):hover {
        opacity: 0.8;
    }

.pc-nav-buttons .pc-prev-button.disabled {
    cursor: default;
    color: #ccc;
}

.pc-nav-buttons .pc-next-button.disabled {
    cursor: default;
    color: #ccc;
}


#containerControls {
    position: absolute;
    top: -55px;
    z-index: 150;
}

.btn.btn-app.btn-xs {
    height: 26px;
    vertical-align: top;
}

    .btn.btn-app.btn-xs:focus {
        text-align: center;
    }

.idd .clear {
    position: relative;
}

#containerControls button > i {
    font-size: 14px;
    line-height: 20px;
    margin: 1px;
}

#containerControls ul li {
    position: relative;
    cursor: pointer;
}

    #containerControls ul li a {
        padding-right: 30px;
    }

    #containerControls ul li .geobtn {
        top: 0px;
        right: 0px;
        position: absolute;
    }

#containerControls > div > button {
    height: 26px;
    border-radius: 4px !important;
    position: relative;
}

    #containerControls > div > button > .geobtn > img {
        margin-top: 0px;
        margin-left: -1px;
    }

#containerControls > div > ul li .geobtn > img {
    margin-top: 0px;
    margin-right: 5px;
}

#containerControls .geobtn > img {
}

/* end GEO editor */


/* Featherlight lightbox */

@media all {
    .featherlight {
        display: none;
        /* dimensions: spanning the background from edge to edge */
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 15000;
        /* position: centering content */
        text-align: center;
        /* insures that the ::before pseudo element doesn't force wrap with fixed width content; */
        white-space: nowrap;
        /* styling */
        cursor: pointer;
        background: #333;
        /* IE8 "hack" for nested featherlights */
        background: rgba(0, 0, 0, 0);
    }

        /* support for nested featherlights. Does not work in IE8 (use JS to fix) */
        .featherlight:last-of-type {
            background: rgba(0, 0, 0, 0.25);
        }

        .featherlight:before {
            /* position: trick to center content vertically */
            content: '';
            display: inline-block;
            height: 100%;
            vertical-align: middle;
            margin-right: -0.25em;
        }

        .featherlight .featherlight-content {
            /* make content container for positioned elements (close button) */
            position: relative;
            /* position: centering vertical and horizontal */
            text-align: left;
            vertical-align: middle;
            display: inline-block;
            /* dimensions: cut off images */
            overflow: auto;
            padding: 25px 25px 0;
            /*border-bottom: 25px solid transparent;*/
            padding-bottom: 25px;
            /* dimensions: handling small or empty content */
            min-width: 50%;
            max-width: 80%;
            /* dimensions: handling large content */
            margin-left: 5%;
            margin-right: 5%;
            max-height: 95%;
            /* styling */
            background: #fff;
            cursor: auto;
            /* reset white-space wrapping */
            white-space: normal;
        }

        /* contains the content */
        .featherlight .featherlight-inner {
            /* make sure its visible */
            display: block;
        }

        .featherlight .featherlight-close-icon {
            /* position: centering vertical and horizontal */
            position: absolute;
            z-index: 9999;
            top: 0;
            right: 0;
            /* dimensions: 25px x 25px */
            line-height: 25px;
            width: 25px;
            /* styling */
            cursor: pointer;
            text-align: center;
            font: Arial, sans-serif;
            background: #fff; /* Set the background in case it overlaps the content */
            background: rgba(255, 255, 255, 0.3);
            color: #000;
        }


        .featherlight .featherlight-image {
            /* styling */
            width: 100%;
        }


    .featherlight-iframe .featherlight-content {
        /* removed the border for image croping since iframe is edge to edge */
        border-bottom: 0;
        padding: 0;
    }

    .featherlight iframe {
        /* styling */
        border: none;
    }
}

@media only screen and (max-width: 1024px) {
    .featherlight .featherlight-content {
        /* dimensions: maximize lightbox with for small screens */
        margin-left: 10px;
        margin-right: 10px;
        max-height: 98%;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-right: 10px;
        border-bottom: 10px solid transparent;
    }
}
/* end Featherlight lightbox */
