﻿/*****************************************
    SVG
*****************************************/
svg .dbq-icon-color-1 {
    fill: #676767;
}
svg .dbq-icon-color-2 {
    fill: #bfcad2;
}
.logo svg .dbq-logo-color-1 {
    fill: #bfcad2;
}
.logo svg .dbq-logo-color-2 {
    fill: #E6E6E6;
}
.logo svg .dbq-logo-color-3 {
    fill: #F2F2F2;
}
.logo svg .dbq-logo-color-4 {
    fill: #bfcad2;
}
.logo svg .dbq-logo-color-5 {
    fill: #717171;
}
.logo svg .dbq-logo-color-6 {
    fill: #989898;
}

#content-wrapper .help-button svg {
    fill: #001323;
}

/*#content-wrapper .ui-iggrid .ui-iggrid-tablebody td span.row-button:hover svg {*/ /* added .row-button otherwise non-clickable svg also hover (check in relatiebeheer)*/
    /*fill: #43464c;
}
    #content-wrapper .ui-iggrid .ui-iggrid-tablebody td.button-table-cell svg.blue, #content-wrapper .ui-iggrid .ui-iggrid-tablebody .row-button svg.blue {
        fill: #0054F0;
    }*/
#content-wrapper .ui-iggrid .ui-iggrid-tablebody td.button-table-cell svg, #content-wrapper .ui-iggrid .ui-iggrid-tablebody .row-button svg {
    fill: #0054F0;
}

#content-wrapper .ui-iggrid .ui-iggrid-tablebody td.button-table-cell svg,
#content-wrapper .ui-iggrid .ui-iggrid-tablebody .row-button svg {
    fill: #0054F0;
}

#content-wrapper .input-group-addon {
    padding: 8px;
}
    #content-wrapper .input-group-addon svg {
        background: #e5e7ec;
        fill: #495057;
    }

#content-wrapper .input-list-item-add-button svg {
    fill: #FFFFFF;
}

.dbqstdt-arrow svg {
}
    .dbqstdt-arrow svg:hover {
        fill: #FFFFFF;
    }

/*****************************************
    breadcrumbs
*****************************************/
#dbq-document-class-list-breadcrumbs .btn-default {
    color: #333;
    background-color: #FFFFFF;
    border-color: #bfcad2;
}

/*****************************************
    button
*****************************************/

/*.ui-iggrid .ui-iggrid-paging .ui-iggrid-paging-item.ui-state-hover span[data-localeid="prevPageLabelText"], .ui-iggrid .ui-iggrid-paging .ui-iggrid-paging-item.ui-state-hover span[data-localeid="nextPageLabelText"] {
    color: #ffffff;
}

#content-wrapper .ui-iggrid .ui-iggrid-footer .ui-state-hover .ui-state-default .ui-iggrid-pagedropdowncontainer .ui-icon:before, #content-wrapper .ui-iggrid .ui-iggrid-footer .ui-state-hover .ui-state-default .ui-iggrid-pagesizedropdown .ui-icon:before {
    background: #0054F0 !important;
    color: #ffffff;
}
*/

a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
    /*color: #e5e7ec;*/
}
/*#content-wrapper .btn-primary {
    color: #fff;
}
    #content-wrapper .btn-primary.disabled,
    #content-wrapper .btn-primary:disabled {
        color: #fff;
        opacity: .65;
    }*/
#content-wrapper .ui-state-active, #content-wrapper .ui-widget-content .ui-state-active, #content-wrapper .ui-widget-header .ui-state-active {
    color: #595F6E;
    background-color: #e5e7ec;
    border-color: #e5e7ec;
}
.ui-iggrid .ui-ig-altrecord td.ui-state-active, .ui-iggrid .ui-ig-altrecord th.ui-iggrid-rowselector-class.ui-state-active, .ui-iggrid tbody .ui-ig-altrecord .ui-iggrid-mergedcell.ui-state-active, .ui-iggrid tbody .ui-ig-altrecord .ui-iggrid-mergedcellstop.ui-state-active, .ui-iggrid tbody .ui-iggrid-mergedcell.ui-state-active, .ui-iggrid tbody .ui-iggrid-mergedcellstop.ui-state-active, .ui-iggrid td.ui-state-active, .ui-iggrid th.ui-iggrid-rowselector-class.ui-state-active {
    background: #0F131B;
}
#content-wrapper .btn-secondary {
    background: #242a3c;
    color: #fff;
}
#content-wrapper .btn-danger {
    background: #e23530;
    color: #fff;
}
#content-wrapper .ui-state-hover a, #content-wrapper .ui-state-hover a:hover {
    /*color: #e5e7ec;*/
}
#content-wrapper .ui-iggrid .ui-iggrid-footer .ui-state-hover {
    /*background-color: #FFFFFF;
    border-color: #0054F0 !important;*/
}
    #content-wrapper .ui-iggrid .ui-iggrid-footer .ui-state-hover a {
        /*color: #e5e7ec;*/
    }

/*****************************************
    Column
*****************************************/
.dbq-column {
}
.modal .dbq-column {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

/*****************************************
    dialog
*****************************************/
.dialog-header {
}
.dialog-title {
}

/*****************************************
    Modal
*****************************************/
.topic {
    background: #e0e6f3;
}
#document-topics .topic,
.dbq-form .topic {
    background: #F5F7F9; /*<-- more dynamic when every graph inside a dashboard has 10px margin*/
}
.alert-success, .alert-danger {
    /*color: #001323;
    background-color: #FFFFFF;
    border: 0;
    border-bottom: 1px solid #e5e7ec;
    font-weight: 600;*/
}
.alert {
    border-width: 2px;
}
.alert-danger {
    color: #D5473C;
    background-color: #FEE5E4;
    border-color: #D5473C;
    font-weight: 500;
}
.dbq-modal-header {
    padding: 20px 30px;
    color: #001323;
    background-color: #F5F7F9;
    border: 0;
    border-bottom: 1px solid #e2e7f3;
    font-weight: 600;
}
.modal-dialog main {
}
.modal-footer {
    background-color: #F5F7F9;
    border: 0;
    border-top: 1px solid #e2e7f3 !important;
}
.dbq-graph-full-screen-button {
    fill: #bfcad2;
}
.topic .btn-default {
    background: #e5e7ec;
    border-color: #e5e7ec;
    color: #3c4144;
}
    .topic .btn-default:hover {
        background: #bfcad2; /* this is for multiselect so before changing it next time think about that.. */
        border-color: #bfcad2;
        color: #FFFFFF;
    }
.topic .modal-footer .btn-link {
    color: #5a5a5a;
    border: 0;
}
    .topic .modal-footer .btn-link:hover {
        color: #9D2828;
    }

.modal-content {
    background-color: #F5F7F9;
    color: #001323;
}
.modal-dialog-loading {
    background-color: #F5F7F9 !important;
}

/*****************************************
    image upload / file upload
*****************************************/
.image-file-upload-input, .file-upload-input {
    /*background: #e5e7ec;*/
}
/*.input-group-btn svg, .file-upload-input svg {
    fill: #FFFFFF;
}
    .input-group-btn span, .file-upload-input span {
        color: #FFFFFF;
    }*/
.image-file-upload-clear, .file-upload-clear {
    color: #FFFFFF;
    background: #bbb;
}
    .file-upload-clear svg {
        fill: #FFFFFF;
    }
    .file-upload-clear span {
        color: #FFFFFF;
    }
    .image-file-upload-clear:hover, .file-upload-clear:hover {
        background: #000000;
    }

.image-file-upload {
}
    .image-file-upload .image-file-upload-filename {
    }
    .image-file-upload .input-group-btn {
        background: #FFFFFF;
    }
.image-file-upload-clear {
    border: 0;
}
    .image-file-upload-clear svg {
        fill: #0054F0;
    }
    .image-file-upload-clear:hover svg {
        fill: #0054F0;
    }

.image-file-upload .input-group-btn {
    border-radius: 0 10px 10px 0 !important;
}

/*****************************************
    topic / document topic tabs
*****************************************/
#document-topic-tabs.nav-tabs {
    background: #F5F7F9 !important;
    border-bottom: 1px solid #e2e7f3 !important;
}
    #document-topic-tabs.nav-tabs > li.active {
        color: #FFFFFF !important;
        background: #e5e7ec !important;
    }
    /*#document-topic-tabs.nav-tabs > li.active > a::after, <-- moet in andere css (stylesheet-?.css) */
    #document-topic-tabs.nav-tabs > li:hover > a::after {
        background: #0c0c0c !important;
        border-bottom: 5px solid #0c0c0c !important;
    }
    #document-topic-tabs.nav-tabs > li:hover a::after {
        background: 0 !important;
        border-bottom: 0 !important;
    }
    #document-topic-tabs.nav-tabs.document-topic-tabs {
    }
        #document-topic-tabs.nav-tabs.document-topic-tabs > li > a {
            color: #001323 !important;
        }
        #document-topic-tabs.nav-tabs.document-topic-tabs > li.active > a {
            color: #001323 !important;
            background-color: #e5e7ec;
        }
        #document-topic-tabs.nav-tabs.document-topic-tabs > li.active:hover > a {
            color: #001323 !important;
        }

.topic .form-control {
    /*background-color: #111213 !important;
    border-color: #111213 !important;*/
    color: #001323 !important;
}

div[data-element-type="Header"] span {
    color: #001323; /* can't have important..! must be possible to override in CMS (title: escalatie -> in tijsens) */
}

.form-inline .form-control {
    /*border: 2px solid #e5e7ec;*/
    border: 0;
    background: #272727;
}


/*
    Document topics
*/
#document-topics .checkbox label,
.dbq-form .checkbox label {
    background: 0;
    color: #001323;
    border: 0;
    /*border-top: 2px solid #e5e7ec; <-- this border-top should be more specific, in much situations its not needed..*/
}
.modal #document-topics .dbq-form-group .dbq-form-group-title-label,
.modal .dbq-form .dbq-form-group .dbq-form-group-title-label {
    display: none;
}
.modal #document-topics .dbq-form-group .checkbox label,
.modal .dbq-form .dbq-form-group .checkbox label {
    display: block;
    border: 0 !important;
    padding: 5px !important;
}
#document-topics h3,
.dbq-form h3 {
    color: #0054F0;
}
#document-topics .dbq-graph-header h3,
.dbq-form .dbq-graph-header h3 {
    color: #001323;
}
.popover-title {
    background-color: #0c0c0c !important;
    border-bottom: 1px solid #e2e7f3 !important;
}
.popover-content {
    background-color: #0c0c0c !important;
    color: #FFFFFF !important;
}
#document-topics h2,
.dbq-form h2 {
    color: #626D86;
}
/*.dbq-form .form-control*/
#document-topics input.form-control,
.dbq-form input.form-control {
    background-color: #FFFFFF !important;
    border: 2px solid #e5e7ec !important;
}
#document-topics .input-group .form-control.datetimepicker,
.dbq-form .input-group .form-control.datetimepicker {
}
#document-topics .input-group .form-control.datepicker,
.dbq-form .input-group .form-control.datepicker {
    border: 2px solid #e5e7ec !important;
}
    #document-topics .input-group .form-control.datepicker:disabled,
    form[data-view-mode="View"] #document-topics .input-group .form-control.datepicker,
    .dbq-form .input-group .form-control.datepicker:disabled,
    form[data-view-mode="View"] .dbq-form .input-group .form-control.datepicker {
        border: 2px solid #e5e7ec !important;
        border-left: 0 !important;
    }
#document-topics .input-group .form-control.file-upload-filename,
.dbq-form .input-group .form-control.file-upload-filename {
    border: 2px solid #e5e7ec !important;
    border-right: 0 !important;
}
#document-topics .input-group.file-upload-hover .form-control.file-upload-filename,
.dbq-form .input-group.file-upload-hover .form-control.file-upload-filename {
    border: 0 !important;
}
#document-topics .input-group button.file-upload-clear,
.dbq-form .input-group button.file-upload-clear {
    border-right: 0 !important;
    margin: 0 !important;
    font-size: 12px !important;
}

#content-wrapper .form-control {
    border-width: 2px;
    border-style: solid;
    border-color: #e5e7ec;
    color: #001323;
    fill: #001323;
    background-color: #FFFFFF;
}
    #content-wrapper .form-control#searchbox {
        padding: 2px 10px;
    }
    #content-wrapper select.form-control option {
        background: #FFFFFF;
    }
#content-wrapper #document-class-list-filters .document-class-list-filter .form-control {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
.modal .form-control {
    /*background-color: #ffffff !important;
    border: 2px solid #e5e7ec !important;*/
    border: 2px solid #e5e7ec !important;
    color: #001323;
}
    #content-wrapper .form-control[disabled], #content-wrapper .form-control[readonly], #content-wrapper fieldset[disabled] .form-control, #content-wrapper .form-control:disabled {
        /*opacity: 1 !important; */ /* <-- don't make everything opacity.. only text.. and give bg-color*/
    }
#document-topics select[multiple="multiple"],
.dbq-form select[multiple="multiple"] {
}
#document-topics hr,
.dbq-form hr {
    border-top: 1px solid #e5e7ec;
}
#document-topics .dbq-form-group-title-label,
.dbq-form .dbq-form-group-title-label {
    background: #f0f2f5;
    border: 2px solid #e5e7ec;
    border-bottom: 0;
    color: #595F6E;
}
    #document-topics .dbq-form-group-title-label.dbq-label-disabled,
    .dbq-form .dbq-form-group-title-label.dbq-label-disabled {
        background: #e5e7ec;
        border: 2px solid #e5e7ec;
        border-bottom: 0;
        opacity: 1 !important;
    }
    #document-topics .dbq-form-group-title-label svg,
    .dbq-form .dbq-form-group-title-label svg {
        fill: #595F6E;
    }
        #document-topics .dbq-form-group-title-label svg:hover,
        .dbq-form .dbq-form-group-title-label svg:hover {
            fill: #b9ae28;
        }
#document-topics .input-list .dbq-form-group-title-label,
.dbq-form .input-list .dbq-form-group-title-label {
    background: #f0f2f5 !important;
    background-color: #f0f2f5 !important;
}
#document-topics .input-list .dbq-label-disabled,
.dbq-form .input-list .dbq-label-disabled {
    background: #e5e7ec !important;
    background-color: #e5e7ec !important;
}
#document-topics .input-list .input-group-addon,
.dbq-form .input-list .input-group-addon {
    background: #f0f2f5 !important;
    background-color: #f0f2f5 !important;
}

#document-topics .dbq-form-group-title-label.dbq-label-disabled > .dbq-form-group-padding,
.dbq-form .dbq-form-group-title-label.dbq-label-disabled > .dbq-form-group-padding {
    background: #e5e7ec;
    border: 2px solid #e5e7ec;
}

#document-topics .topic .input-list-item-add-button svg, #document-topics .topic .input-list-item-remove-button svg,
.dbq-form .input-list-item-add-button svg, .dbq-form .input-list-item-remove-button svg {
    fill: #FFFFFF;
}
#document-topics div[data-topic-name="Form"] table,
.dbq-form div[data-topic-name="Form"] table {
    /*background: #272727; <-- can't add background here.. in WSP (and possibly more) you will get a background in datetimepicker*/
}

.form-inline .form-control {
    /*border: 2px solid #e5e7ec;*/
    border: 0;
    background: #272727;
}

.input-list[data-show-index-numbers='true'] .input-list-item .input-list-item-index-background {
    background: 0;
    border: 1px solid #e5e7ec;
}
    .input-list[data-show-index-numbers='true'] .input-list-item .input-list-item-index-background .input-list-item-index {
        color: #595F6E;
    }

#document-topics .topic .image-file-upload-input, #document-topics .topic .file-upload-input, .file-upload-clear,
.dbq-form .image-file-upload-input, .dbq-form .file-upload-input, .file-upload-clear {
    color: #0054F0 !important;
    background: #FFFFFF !important;
    border: 2px solid #e5e7ec !important;
}
    #document-topics .topic .image-file-upload-input svg, #document-topics .topic .file-upload-input svg, #document-topics .file-upload-clear svg,
    .dbq-form .image-file-upload-input svg, .dbq-form .file-upload-input svg, .dbq-form .file-upload-clear svg {
        fill: #0054F0;
    }
    #document-topics .topic .image-file-upload-input:hover svg, #document-topics .topic .file-upload-input:hover svg, #document-topics .file-upload-clear:hover svg,
    .dbq-form .image-file-upload-input:hover svg, .dbq-form .file-upload-input:hover svg, .dbq-form .file-upload-clear:hover svg {
        fill: #0054F0;
    }
    #document-topics .topic .image-file-upload-input:hover, #document-topics .topic .file-upload-input:hover,
    .dbq-form .image-file-upload-input:hover, .dbq-form .file-upload-input:hover {
        background: #0054F0 !important;
        background-color: #0054F0 !important;
        border-color: #0054F0 !important;
    }
        #document-topics .topic .image-file-upload-input:hover svg, #document-topics .topic .file-upload-input:hover svg,
        .dbq-form .image-file-upload-input:hover svg, .dbq-form .file-upload-input:hover svg {
            fill: #FFFFFF !important;
        }
        #document-topics .topic .image-file-upload-input:hover span, #document-topics .topic .file-upload-input:hover span,
        .dbq-form .image-file-upload-input:hover span, .dbq-form .file-upload-input:hover span {
            color: #FFFFFF !important;
        }

#document-topics .topic .file-upload-hover .image-file-upload-input,
#document-topics .topic .file-upload-hover .file-upload-input,
.dbq-form .file-upload-hover .image-file-upload-input,
.dbq-form .file-upload-hover .file-upload-input,
.file-upload-hover .file-upload-clear {
    border: 0 !important;
    border-left: 2px dashed #0054F0 !important;
}
#document-topics .file-upload-clear svg,
#document-topics .file-upload-clear .file-upload-clear-title,
.dbq-form .file-upload-clear svg,
.dbq-form .file-upload-clear .file-upload-clear-title {
    color: #EC564B !important;
    fill: #EC564B !important;
}
#document-topics .file-upload-clear:hover,
.dbq-form .file-upload-clear:hover {
    background: #EC564B !important;
    border-color: #EC564B !important;
    border: 2px solid #EC564B !important;
}
    #document-topics .file-upload-clear:hover svg,
    #document-topics .file-upload-clear:hover .file-upload-clear-title,
    .dbq-form .file-upload-clear:hover svg,
    .dbq-form .file-upload-clear:hover .file-upload-clear-title {
        color: #FFFFFF !important;
        fill: #FFFFFF !important;
    }

#document-topics .topic .dbq-has-download-button .file-upload-input,
.dbq-form .dbq-has-download-button .file-upload-input {
}
#document-topics .dbq-has-download-button .btn-primary.file-download-button,
.dbq-form .dbq-has-download-button .btn-primary.file-download-button {
    border-left: 0 !important;
}
    #document-topics .dbq-has-download-button .btn-primary.file-download-button:hover,
    .dbq-form .dbq-has-download-button .btn-primary.file-download-button:hover {
        color: #FFFFFF !important;
        background: #0054F0 !important;
        border: 2px solid #0054F0 !important;
        border-left: 0 !important;
    }
        #document-topics .dbq-has-download-button .btn-primary.file-download-button:hover svg,
        .dbq-form .dbq-has-download-button .btn-primary.file-download-button:hover svg {
            fill: #FFFFFF !important;
        }

/*.dbq-form div[data-element-type="Header"] {
    border-top: 1px solid #eef5ff;
}*/
#document-topics .topic div[data-element-type="Header"]:first-of-type,
.dbq-form div[data-element-type="Header"]:first-of-type {
    border-top: 0;
}

.dbq-drawing-canvas {
    /*width: 100%; */ /*<-- not possible to set width 100%.. the canvas has an inline width attribute. This causes signatures to get out of shape */
    height: 250px; /* Should be the same as attribute height of the canvas */
    background: #FFFFFF !important;
    border: 2px dashed #e5e7ec !important;
    box-sizing: unset;
}

/* ******************************
    File upload
****************************** */
button.btn-default.image-file-upload-clear:enabled {
    color: #D5473C !important;
    border: 2px solid #e5e7ec !important;
    border-right: 0 !important;
}
    button.btn-default.image-file-upload-clear:enabled span.image-file-upload-input-title-clear {
        color: #D5473C !important;
    }

#document-topics .image-file-upload-clear,
.dbq-form .image-file-upload-clear {
}
    #document-topics .image-file-upload-clear:hover,
    .dbq-form .image-file-upload-clear:hover {
        background: #D5473C !important;
        border: 2px solid #D5473C !important;
        border-right: 0 !important;
    }
        #document-topics .image-file-upload-clear:hover span,
        .dbq-form .image-file-upload-clear:hover span {
            color: #fff !important;
        }
        #document-topics .image-file-upload-clear:hover svg,
        .dbq-form .image-file-upload-clear:hover svg {
            fill: #fff !important;
        }

.image-preview {
    background: #FFFFFF !important;
    border: 2px dashed #e5e7ec !important;
}
.dbq-has-image-preview .image-preview {
    border-bottom: 0 !important;
}
#document-topics .dbq-has-image-preview .image-file-upload input.form-control.image-file-upload-filename,
#document-topics .dbq-has-image-preview .input-group-btn button.image-file-upload-clear,
#document-topics .dbq-has-image-preview .input-group-btn div.image-file-upload-input,
.dbq-form .dbq-has-image-preview .image-file-upload input.form-control.image-file-upload-filename,
.dbq-form .dbq-has-image-preview .input-group-btn button.image-file-upload-clear,
.dbq-form .dbq-has-image-preview .input-group-btn div.image-file-upload-input {
    border-top: 2px dashed #e5e7ec !important;
}
    #document-topics .dbq-has-image-preview .input-group-btn button.image-file-upload-clear:hover,
    .dbq-form .dbq-has-image-preview .input-group-btn button.image-file-upload-clear:hover {
        border-top: 2px dashed #D5473C !important;
    }
    #document-topics .dbq-has-image-preview .input-group-btn div.image-file-upload-input:hover,
    .dbq-form .dbq-has-image-preview .input-group-btn div.image-file-upload-input:hover {
        border-top: 2px dashed #0054F0 !important;
    }


div.dbq-label-disabled + div.image-preview,
form[data-view-mode="View"] .image-preview {
    /*background: #FFFFFF !important;*/
    border: 2px dashed #e5e7ec !important;
}
    .image-preview img {
        opacity: 1;
    }
    .image-preview:hover img {
        opacity: 0.3;
    }
    .image-preview:hover .image-hover {
        opacity: 1;
    }
    .image-preview .image-hover {
        opacity: 0;
    }
    .image-preview:hover {
        background: rgb(221 226 232 / 70%);
    }
    /*.image-preview:hover img {
        opacity: 0 !important; <-- why should the image not be visible?
    }*/
    .image-preview .image-hover {
        fill: #0054F0;
    }

#document-topics .btn-primary.file-download-button,
.dbq-form .btn-primary.file-download-button {
    background: #FFFFFF !important;
    border: 2px solid #e5e7ec !important;
    color: #0054F0 !important;
    fill: #0054F0 !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
    #document-topics .btn-primary.file-download-button svg,
    .dbq-form .btn-primary.file-download-button svg {
        fill: #0054F0 !important;
    }
    #document-topics .btn-primary.file-download-button:hover,
    .dbq-form .btn-primary.file-download-button:hover {
        background: #0054F0 !important;
        border: 2px solid #004ad4 !important;
        color: #FFFFFF !important;
    }
        #document-topics .btn-primary.file-download-button:hover svg,
        .dbq-form .btn-primary.file-download-button:hover svg {
            fill: #FFFFFF !important;
        }

#document-topics .btn-primary.file-download-button,
.dbq-form .btn-primary.file-download-button {
    /*padding: 5px 10px; <-- padding before.. */
    line-height: 20px;
    /*
        this next style is added for a read-only modals where file download only have a button? if this goes wrong somewhere:
        - cms TSN -> inspectiebeheer -> click tr (XLTest-2021) -> click tr 5591RAtest -> externe inspectierapportages -> wijzig formulier in tabel (2nd checklist icon)
        - DocumentBuilder.cs -> BuildInputPropertyFileHtml
    */
    width: 100%;
    height: 50px !important;
    padding: 11px 10px 9px !important;
}
    #document-topics .btn-primary.file-download-button svg,
    .dbq-form .btn-primary.file-download-button svg {
        /*width: 12px;
        height: 20px;
        padding: 4px 0;
        margin-right: 5px; <-- outcomment because in the position from the comment above this, it should be like the code below */
        width: 20px;
        height: 20px;
        padding: 0px;
        margin-right: 10px;
    }

.file-upload, .image-file-upload {
}
    .file-upload.file-upload-hover input[type='text'],
    .image-file-upload.file-upload-hover input[type='text'] {
        /*background-color: #FFFFFF;*/
    }
    .file-upload.file-upload-hover .file-upload-input, .file-upload.file-upload-hover .file-upload-clear,
    .image-file-upload.file-upload-hover .image-file-upload-input, .image-file-upload.file-upload-hover .image-file-upload-clear {
        /*background-color: #FFFFFF;*/
    }

#document-topics .image-file-upload.file-upload-hover .form-control,
.dbq-form .image-file-upload.file-upload-hover .form-control {
    border: 0 !important;
}
#document-topics .image-file-upload.file-upload-hover .image-file-upload-input,
#document-topics .image-file-upload.file-upload-hover .file-upload-input,
.dbq-form .image-file-upload.file-upload-hover .image-file-upload-input,
.dbq-form .image-file-upload.file-upload-hover .file-upload-input,
.image-file-upload.file-upload-hover .file-upload-clear,
.modal-content .image-file-upload.file-upload-hover button.btn-default.file-upload-clear,
.modal-content .file-upload.file-upload-hover button.btn-default.file-upload-clear { /*:enabled*/
    border: 0 !important;
    border-left: 2px dashed #0054F0 !important;
}

.file-upload input[type=file], .image-file-upload input[type=file] {
	opacity: 0;
	filter: alpha(opacity=0);
}

/************************
    Custom checkbox
    https://bootsnipp.com/snippets/featured/animated-radios-amp-checkboxes-nojs
*************************/
.checkbox label input[type="checkbox"] + .cr > .cr-icon {
    opacity: 0;
}
.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon {
    opacity: 1;
}
.checkbox label input[type="checkbox"]:disabled + .cr {
    opacity: 1;
}

/************************************************
    Helper classes.
*************************************************/
h3.tile-project-title {
}
span.tile-project-subtitle {
}
span.tile-project-attr-title {
    color: #797a7d;
}
p.tile-project-attr-description {
    color: #797a7d;
}

/************************************************
    Multiple select autocomplete
*************************************************/
.searchbox-container .input-group .input-group-btn button {
    border-left: 0;
    border: 0;
}
    .searchbox-container .input-group .input-group-btn button span {
        color: #b3baca;
    }
    .searchbox-container .input-group .input-group-btn button.searchbox-container-remove {
        border-left: 0 !important;
    }
.modal button.btn-default.searchbox-container-remove:enabled:hover {
    background: #0054f0 !important;
    border: 2px solid #0054f0 !important;
}
.modal button.btn-default.searchbox-container-remove:enabled:hover svg {
    fill: #FFFFFF !important;
}

.autocomplete-suggestions {
    border: 1px solid #bfcad2;
    border-top: 0;
    background: #FFFFFF;
    -webkit-box-shadow: -1px 1px 3px rgba(0,0,0,.1);
    -moz-box-shadow: -1px 1px 3px rgba(0,0,0,.1);
    box-shadow: -1px 1px 3px rgba(0,0,0,.1);
}
.autocomplete-suggestion {
    color: #333;
}
.autocomplete-suggestion b {
    color: #1f8dd6;
}
.autocomplete-suggestion.selected {
    background: #f0f0f0;
}


/************************************************
    Source Code Editor
*************************************************/
div[type='source-code-editor'] {
    border: 1px solid #eeeeee;
}
    div[type='source-code-editor'] .cm-keyword {
        color: #0000ff !important;
    }
    div[type='source-code-editor'] .cm-comment {
        color: #008000 !important;
    }
    div[type='source-code-editor'] .cm-string {
        color: #01957b !important;
    }
    div[type='source-code-editor'] .cm-builtin {
        color: #000000 !important;
    }


/************************************************
    Graphs (Infragistics charts)
*************************************************/
.ui-chart-piechart-container {
    border: 0 none;
}
.graph-table th, .graph-table td {
    border: 1px solid #eee;
}

/************************************************
    Graphs (Infragistics charts: tooltip styling)
*************************************************/

.ui-chart-tooltip {
    border-color: transparent !important;
}
    .graph-tooltip label.header {
        color: #bbb;
    }
    .graph-tooltip label.content {
        color: #666;
    }

/************************
    Input lists
*************************/
.input-list {
    background: #F5F7F9;
}
div[data-sort-direction="0"][data-has-visible-add-button="true"] .input-list-content {
    background: #f0f2f5; /*#e5e7ec <-- this was set on disabled color, this is not the right selector, this disabled color is not good for CMS -> tijdregistratie -> voeg toe btn */
    border: 2px solid #e5e7ec;
}
div[data-sort-direction="1"][data-has-visible-add-button="true"] .input-list-content {
    background: #f0f2f5; /*#e5e7ec <-- this was set on disabled color, this is not the right selector, this disabled color is not good for CMS -> tijdregistratie -> voeg toe btn */
    border: 2px solid #e5e7ec;
}
div[data-sort-direction="0"][data-has-visible-add-button="false"] .input-list-content,
div[data-sort-direction="1"][data-has-visible-add-button="false"] .input-list-content {
}

.input-list[data-show-index-numbers='true'] .input-list-item {
    border-bottom: 1px solid #e5e7ec;
}
    .input-list[data-show-index-numbers='true'] .input-list-item:last-of-type {
        border: 0;
    }

    .input-list[data-show-index-numbers='true'] .input-list-item .input-list-item-index-background {
        border: 0;
        border-right: 1px solid #e5e7ec;
    }

.input-list-item[data-is-read-only='true'] {
}
    .input-list-item[data-is-read-only='true'] .input-list-item-remove-button {
        filter: alpha(opacity=65);
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        opacity: .65;
    }
    .input-list-item[data-is-read-only='true'] .form-control {
        background-color: #eee;
    }

.input-list[data-sort-direction="0"] .input-list-item-add {
    background: #F5F7F9;
    border: 2px solid #e5e7ec;
    border-top: 0;
}
    .input-list[data-sort-direction="0"] .input-list-item:last-of-type {
    }
.input-list[data-sort-direction="1"] .input-list-item-add {
    background: #F5F7F9;
    border: 2px solid #e5e7ec;
    border-bottom: 0;
}
    .input-list[data-sort-direction="1"] .input-list-item:last-of-type {
        border: 0;
    }

#document-topics .input-list-item-add button.input-list-item-add-button, #document-topics button.input-list-item-remove-button,
.dbq-form .input-list-item-add button.input-list-item-add-button, .dbq-form button.input-list-item-remove-button {
    border: 0 !important;
    background: 0 !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
    #document-topics .input-list-item-add button.input-list-item-add-button span,
    .dbq-form .input-list-item-add button.input-list-item-add-button span {
        color: #0054f0 !important;
    }
    #document-topics .input-list-item-add button.input-list-item-add-button svg,
    .dbq-form .input-list-item-add button.input-list-item-add-button svg {
        fill: #0054F0 !important;
    }

.input-list-item {
    border-bottom: 1px solid #e5e7ec;
}
    .input-list-item:last-child {
        border-bottom: 0;
    }

/*****************************************
    Pop over
*****************************************/
.popover {
    background-color: #e5e7ec;
    border: 1px solid #e5e7ec;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
.popover-header {
    background-color: #fff;
    border-bottom: 1px solid #e5e7ec;
    color: #001323;
}
.popover-body {
    color: #001323;
    background: #fff;
}
.popover .close {
    color: #001323;
    text-shadow: none !important;
    opacity: 1;
}

/*****************************************
    Multiple select
*****************************************/
/* this is for tags section in Modal (relatiebeheer) */
#document-topics .multiple-select-selectmulti,
.dbq-form .multiple-select-selectmulti {
    border: 2px solid #e5e7ec;
}
.multiple-select-selectmulti svg {
    fill: #5a5a5a;
}
.multiple-select-selectmulti button:hover svg {
    fill: #0054F0;
}
div[data-document-property-code="OrganisationUserSecurityObjects"] svg:hover {
    fill: #0054F0;
}
.multiple-select-selectmulti strong {
    background: #ffffff;
    border: 0;
    border-bottom: 2px solid #e5e7ec;
    color: #001323;
}
.multiple-select-selectmulti > div:first-of-type strong {
    border-right: 2px solid #e5e7ec;
}
.multiple-select-selectmulti > div:last-of-type strong {
    border-left: 2px solid #e5e7ec;
}
.multiple-select-selectmulti option {
    background: #FFFFFF !important;
    color: #001323;
}
#document-topics .multiple-select-selectmulti .btn,
.dbq-form .multiple-select-selectmulti .btn {
    background: #FFFFFF;
    border: 0;
    border-bottom: 2px solid #e5e7ec;
}
    #document-topics .multiple-select-selectmulti .btn svg,
    .dbq-form .multiple-select-selectmulti .btn svg {
        fill: #0054F0;
    }
    #document-topics .multiple-select-selectmulti .btn:hover,
    .dbq-form .multiple-select-selectmulti .btn:hover {
        background: #0054F0;
    }
        #document-topics .multiple-select-selectmulti .btn:hover svg,
        .dbq-form .multiple-select-selectmulti .btn:hover svg {
            fill: #FFFFFF !important;
        }
#document-topics .multiple-select-selectmulti select.form-control,
.dbq-form .multiple-select-selectmulti select.form-control {
    border: 0 !important;
}
#document-topics .multiple-select-selectmulti > div:first-of-type select.form-control,
.dbq-form .multiple-select-selectmulti > div:first-of-type select.form-control {
    border-right: 2px solid #e5e7ec !important;
}
#document-topics .multiple-select-selectmulti > div:last-of-type select.form-control,
.dbq-form .multiple-select-selectmulti > div:last-of-type select.form-control {
    border-left: 2px solid #e5e7ec !important;
}
#document-topics .multiple-select-selectmulti select.form-control,
.dbq-form .multiple-select-selectmulti select.form-control {
    box-shadow: none;
}
#document-topics .multiple-select-selectmulti select.form-control option,
.dbq-form .multiple-select-selectmulti select.form-control option {
    background: #FFFFFF !important;
    border-bottom: 1px solid #e5e7ec;
    color: #001323 !important;
}
    #document-topics .multiple-select-selectmulti select.form-control option:checked,
    .dbq-form .multiple-select-selectmulti select.form-control option:checked {
        background: #001323 !important;
        /*box-shadow: 0 0 10px 100px #001323 inset; <-- when deselect the selectbox, the box-shadow will stay but the font color doesnt change */
        color: #FFFFFF !important;
    }
    #document-topics .multiple-select-selectmulti select.form-control option:hover,
    .dbq-form .multiple-select-selectmulti select.form-control option:hover {
        background: #0054F0 !important;
        color: #FFFFFF !important;
    }

#document-topics .multiple-select-selectmulti > div:first-of-type strong,
.dbq-form .multiple-select-selectmulti > div:first-of-type strong {
    border-right: 2px solid #e5e7ec;
}
#document-topics .multiple-select-selectmulti > div:last-of-type strong,
.dbq-form .multiple-select-selectmulti > div:last-of-type strong {
    border-left: 2px solid #e5e7ec;
}
#document-topics .multiple-select-selectmulti strong,
.dbq-form .multiple-select-selectmulti strong {
    background: #f0f2f5;
    border-bottom: 2px solid #e5e7ec;
}

/*.dbq-form .multiple-select-selectmulti select.form-control:focus option:checked {
    color: #FFFFFF !important;
    box-shadow: 0 0 10px 100px #001323 inset !important;
}*/
/*****************************************
    Placeholder
*****************************************/
/*#content ::-webkit-input-placeholder, .dbq-form input::-webkit-input-placeholder {
    color: #001323;
}
#content ::-moz-placeholder, .dbq-form input::-moz-placeholder {
    color: #001323;
}
#content :-ms-input-placeholder, .dbq-form input:-ms-input-placeholder {
    color: #001323;
}
#content :-moz-placeholder, .dbq-form input:-moz-placeholder {
    color: #001323;
}*/
/*****************************************
    element graph
*****************************************/
.element-graph .dbq-graph-full-screen {
    background: #FFFFFF;
}
.element-graph .dbq-graph-toolbar button,
.element-graph .dbq-graph-toolbar button:active,
.element-graph .dbq-graph-toolbar button:focus {
    outline: 0 !important;
}

.modal .element-graph {
    border: 2px solid #e5e7ec !important;
}

/*****************************************
    Main menu
*****************************************/
#side_navigation h3 {
    color: #445668;
}

/* ******************************
    Multi select dropdown menu
****************************** */
.multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu {
    background-color: #ffffff;
    border: 0;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.18);
    -moz-box-shadow: 0 6px 12px rgba(0,0,0,0.18);
    box-shadow: 0 6px 12px rgba(0,0,0,0.18);
}
    .multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu li a {
        color: #abb1bf !important;
    }
        .multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu li a:hover {
            color: #abb1bf !important;
        }
    .multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu li[data-is-selectable="true"] a {
        color: #001323 !important;
    }
        .multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu li[data-is-selectable="true"] a:hover {
            color: #1B93F1 !important;
        }
    .multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu svg {
        fill: #001323 !important;
    }
        .multiple-select-rule-single-tree .dbq-select-type-dropdown-tree ul.dropdown-menu svg:hover {
            fill: #1B93F1 !important;
        }

.dbq-select-view-button,
.dbq-select-add-button {
    background: #FFFFFF;
    color: #004ad4;
    border-color: #e5e7ec;
    border-width: 2px;
    border-left: 0 !important;
    border-left-width: 0 !important;
    /*background: #FFFFFF; <-- should have no background, sometimes its in an input-list */
}
    .dbq-select-view-button:hover, .dbq-select-add-button:hover {
        color: #FFFFFF;
        border-color: #004ad4;
        border-left: 0;
        background: #004ad4;
    }
    .dbq-select-view-button svg, .dbq-select-add-button svg {
        width: 20px;
        height: 20px;
        fill: #004ad4;
    }
        .dbq-select-view-button:hover svg, .dbq-select-add-button:hover svg {
            fill: #FFFFFF;
        }

/* view/add button next to disabled select */
.form-control:disabled + .input-group-append .dbq-select-view-button,
.form-control:disabled + .input-group-append .dbq-select-add-button {
    border-color: #e5e7ec;
}
    .form-control:disabled + .input-group-append .dbq-select-view-button:hover,
    .form-control:disabled + .input-group-append .dbq-select-add-button:hover {
        border-color: #0054F0;
    }

/*****************************************
    View / Add buttons
*****************************************/
.btn-outline-primary.dbq-select-view-button,
.btn-outline-primary.dbq-select-add-button {
    color: #000000;
    border-color: #e5e7ec;
    margin-left: 5px;
}
    .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle,
    .btn-outline-primary.dbq-select-view-button:hover,
    .btn-outline-primary.dbq-select-add-button:hover {
        color: #000000;
        border-color: #e5e7ec;
        background: #FFFFFF;
    }
    .btn-outline-primary.dbq-select-view-button:active,
    .btn-outline-primary.dbq-select-add-button:active,
    .btn-outline-primary.dbq-select-view-button:active:hover,
    .btn-outline-primary.dbq-select-add-button:active:hover {
        background: #FFFFFF;
        border-color: #e5e7ec;
    }

.dbq-select-view-button,
.dbq-select-add-button {
    background: #FFFFFF;
}

/* table insde data-element-type="InputProperty" (mail) */
.modal #document-topics .row[data-element-type="InputProperty"] table,
.modal .dbq-form .row[data-element-type="InputProperty"] table {
    border: 2px solid #e5e7ec !important;
}
.modal #document-topics .row[data-element-type="InputProperty"] .datepicker table,
.modal .dbq-form .row[data-element-type="InputProperty"] .datepicker table {
    border: 0 !important;
}

/*****************************************
    Multiple Select (Select single)
*****************************************/
.property select.form-control {
    background-color: #FFFFFF !important;
    border: 2px solid #e5e7ec !important;
}

/* Alle border prefill, infragistics voegt over borders toe die voor verschuivingen zorgen.. */
div[data-is-multiselect="true"] .ui-iggrid .ui-iggrid-table > tbody > tr > td {
    border-top: 1px solid #FFFFFF !important;
    border-right: 0 !important;
    border-bottom: 1px solid #F0EFF4 !important;
    border-left: 0 !important;
    background: #FFFFFF !important;
}
    div[data-is-multiselect="true"] .ui-iggrid .ui-iggrid-table > tbody > tr > td.ui-state-active {
        border-top: 1px solid #e2e7f3 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #e2e7f3 !important;
        border-left: 0 !important;
        background: #e2e7f3 !important;
    }
    div[data-is-multiselect="true"] .ui-iggrid .ui-iggrid-table > tbody > tr > td.ui-state-hover {
        border-top: 1px solid #0054F0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #0054F0 !important;
        border-left: 0 !important;
        background: #0054F0 !important;
    }

/*
    active state after click on view-button
*/
.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show > .btn-outline-primary.dropdown-toggle {
    background: #0054F0 !important;
    border: 2px solid #004ad4 !important;
    box-shadow: none !important;
}

#document-topics .dbq-label-disabled + .form-group .btn.dbq-select-view-button,
.dbq-form .dbq-label-disabled + .form-group .btn.dbq-select-view-button { /*:not(:disabled):not(.disabled):active*/
    background: #e6e9ed !important;
    border: 0 !important;
    box-shadow: none !important;
}

/*
    from DocumentClassLists.css
*/
/* Form group styling (group of checkboxes for example) */
#document-topics .dbq-form-group-padding,
#document-topics .element .property .button_list,
.dbq-form .dbq-form-group-padding,
.dbq-form .element .property .button_list {
    background: #FFFFFF;
    border: 2px solid #e5e7ec;
}
#document-topics .dbq-form-group,
#document-topics .dbq-label-disabled + .dbq-form-group-padding,
#document-topics .element .property .dbq-label-disabled + .button_list,
#document-topics .dbq-form-group-no-padding,
.dbq-form .dbq-form-group,
.dbq-form .dbq-label-disabled + .dbq-form-group-padding,
.dbq-form .element .property .dbq-label-disabled + .button_list,
.dbq-form .dbq-form-group-no-padding {
    background: #e5e7ec;
}
#document-topics .dbq-form-group-disabled,
.dbq-form .dbq-form-group-disabled {
    background: #e5e7ec;
}
form[data-view-mode="View"] #document-topics .dbq-form-group,
form[data-view-mode="View"] .dbq-form .dbq-form-group {
    background: #e5e7ec !important;
    border: 2px solid #e5e7ec !important;
    opacity: 1 !important;
    color: #001323 !important;
    cursor: not-allowed;
}
#document-topics .dbq-form-group-padding[data-read-only="true"],
.dbq-form .dbq-form-group-padding[data-read-only="true"] {
    background: #e5e7ec;
    border: 2px solid #e5e7ec;
}
    #document-class-list-filters .document-class-list-filter input.form-control {
        background-color: #FFFFFF;
        border: 2px solid #e5e7ec;
    }
#document-topics .dbq-colon-first p,
.dbq-form .dbq-colon-first p {
    color: #43464c !important;
}
#document-topics .dbq-colon-second p,
.dbq-form .dbq-colon-second p {
    background: #e5e7ec;
    color: #595F6E !important;
}
















/* ******************************
    UI-Igrid styles
****************************** */
/*
    General
*/
.ui-iggrid .ui-iggrid-footer .ui-iggrid-paging-item .ui-iggrid-page.ui-state-default,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-paging-item.ui-state-default,
.ui-iggrid-pagedropdowncontainer, .ui-iggrid-pagedropdowncontainer .ui-state-default {
    border: 0 !important;
    background: 0 !important;
    background-color: none !important;
    cursor: pointer;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabeldisabled,
.ui-iggrid .ui-iggrid-paging .ui-igedit-input {
    color: #001323 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default:hover .ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default:hover .ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpagelabel,
.ui-iggrid .ui-iggrid-paging .ui-igedit-input {
    color: #FFFFFF !important;
}

/*
    Normal
*/
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default .ui-iggrid-firstpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-lastpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default .ui-iggrid-firstpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-lastpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimg,
.ui-iggrid-pagedropdowncontainer .ui-state-default,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-paging-item .ui-iggrid-page.ui-state-default {
    border: 2px solid #e5e7ec !important;
    background-color: #FFFFFF !important;
    opacity: 1 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default .ui-iggrid-firstpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-lastpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimg,
.ui-iggrid-pagedropdowncontainer .ui-state-default .ui-icon:before {
    color: #0054F0 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabel {
    color: #0054F0 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default .ui-iggrid-firstpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-lastpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimgdisabled {
    color: #001323 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabeldisabled {
    color: #001323 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimgdisabled {
    border-left: 0 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimgdisabled {
    border-right: 0 !important;
}
/*
    Disabled
*/
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default .ui-iggrid-firstpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-lastpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabeldisabled {
    /*opacity: .35 !important;*/
    background: #e5e7ec !important;
    border: 2px solid #e5e7ec !important;
    color: #001323 !important;
    opacity: 1 !important;
}

/*
    Normal Hover
*/
.ui-iggrid .ui-iggrid-footer .ui-iggrid-paging ul.ui-iggrid-pagelist li.ui-iggrid-page.ui-state-default:hover {
    background: #0054f0 !important;
    border: 2px solid #004ad4 !important;
}
    .ui-iggrid .ui-iggrid-footer .ui-iggrid-paging ul.ui-iggrid-pagelist li.ui-iggrid-page.ui-state-default:hover a {
        color: #FFFFFF !important;
    }
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default:hover .ui-iggrid-firstpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default:hover .ui-iggrid-lastpageimg {

}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default:hover .ui-iggrid-firstpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default:hover .ui-iggrid-lastpageimg,
.ui-iggrid-pagedropdowncontainer:hover .ui-state-default {
    background: #0054f0 !important;
    border: 2px solid #004ad4 !important;
    color: #FFFFFF !important;
}
    .ui-iggrid-pagedropdowncontainer:hover .ui-state-default .ui-igedit-input,
    .ui-iggrid-pagedropdowncontainer:hover .ui-state-default .ui-icon:before {
        color: #FFFFFF !important;
    }
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpagelabel {
    border-left: 0 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpageimg,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpagelabel {
    border-right: 0 !important;
}
/*
    Disabled hover
*/
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default:hover .ui-iggrid-firstpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default:hover .ui-iggrid-lastpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-lastpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpageimgdisabled {
    color: #001323 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default .ui-iggrid-nextpagelabel,
.ui-iggrid .ui-iggrid-paging .ui-igedit-input {
    color: #0054F0 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default .ui-iggrid-prevpagelabeldisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default .ui-iggrid-nextpagelabeldisabled {
    color: #001323 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpageimgdisabled.ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpageimgdisabled.ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default:hover .ui-iggrid-firstpageimgdisabled.ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default:hover .ui-iggrid-lastpageimgdisabled.ui-icon:before,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-prevpage.ui-state-default:hover .ui-iggrid-prevpagelabeldisabled.ui-iggrid-prevpagelabel,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-nextpage.ui-state-default:hover .ui-iggrid-nextpagelabeldisabled.ui-iggrid-nextpagelabel {
    color: #001323 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-firstpage.ui-state-default:hover .ui-iggrid-firstpageimgdisabled,
.ui-iggrid .ui-iggrid-footer .ui-iggrid-lastpage.ui-state-default:hover .ui-iggrid-lastpageimgdisabled {
    background: #e5e7ec !important;
    border: 2px solid #e5e7ec !important;
    color: #001323 !important;
}

.ui-iggrid-pagedropdowncontainer:hover .ui-igedit-button-common {
    background: 0 !important; /*#0054F0 */
    border: 0 !important; /* #0054F0 */
}
    .ui-iggrid-pagedropdowncontainer:hover .ui-state-hover.ui-state-default .ui-icon {
        color: #ffffff;
    }
    .ui-iggrid .ui-iggrid-footer .ui-state-default.ui-igedit-button-common {
        border: 0 !important;
    }

/* Different ui-iggrid, next time note where this is for.. */
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
    color: #001323 !important;
}
.ui-igcombo-listitemholder li.ui-state-default, .ui-igedit-dropdown .ui-igedit-listitem.ui-state-default, .ui-igedit-list .ui-igedit-listitem.ui-state-default, .ui-iggrid-columnmoving-dropdown-list li.ui-state-default, .ui-iggrid-featurechooser-list li.ui-state-default, .ui-iggrid-filterddlist li.ui-state-default, .ui-iggrid-hiding-dropdown-list li.ui-state-default {
    color: #001323;
    background-color: #FFFFFF;
    border: 1px solid #e5e7ec;
}
.ui-igedit-dropdown, .ui-iggrid-featurechooser-dropdown-dialog, .ui-iggrid-filterdd, .ui-widget.ui-widget-content.ui-igpivot-filterdropdown, .ui-widget.ui-widget-content.ui-igpivot-metadatadropdown {
    background: #e5e7ec;
    border: 1px solid #e5e7ec;
}
    .ui-igedit-dropdown::-webkit-scrollbar-track {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        background: #e5e7ec;
    }
    .ui-igedit-dropdown::-webkit-scrollbar-thumb {
        background-color: #0054F0;
        border: 2px solid #e5e7ec;
    }
    .ui-igcombo-listitemholder li.ui-state-active, .ui-igcombo-listitemholder li.ui-state-active a, .ui-igcombo-listitemholder li.ui-state-highlight, .ui-igcombo-listitemholder li.ui-state-highlight a, .ui-igedit-dropdown .ui-igedit-listitem.ui-state-highlight, .ui-igedit-list .ui-igedit-listitem.ui-state-highlight, .ui-iggrid-columnmoving-dropdown-list li.ui-state-active, .ui-iggrid-columnmoving-dropdown-list.ui-state-active a, .ui-iggrid-featurechooser-list li.ui-state-active, .ui-iggrid-featurechooser-list.ui-state-active a, .ui-iggrid-filterddlist li.ui-state-active, .ui-iggrid-filterddlistitem.ui-state-active a, .ui-iggrid-hiding-dropdown-list li.ui-state-active, .ui-iggrid-hiding-dropdown-list.ui-state-active a {
        border: 2px solid #e5e7ec;
        background-color: #0054F0;
        color: #FFFFFF;
    }
.ui-igedit-listitem.ui-state-hover + .ui-igedit-listitem.ui-igedit-listitemselected {
    border: 2px solid #e5e7ec;
}
.ui-igedit-dropdown .ui-igedit-listitem.ui-state-default.ui-state-hover {
    background-color: #0054F0; /* This is for pagination DROPDOWN option hover */
    color: #FFFFFF;
    border-top-color: #e5e7ec; /* Infragistics sets this on transparant.. */
}

.ui-iggrid, .ui-iggrid .ui-iggrid-content, .ui-iggrid .ui-iggrid-headertable, .ui-iggrid .ui-widget-content, .ui-iggrid-scrolldiv table {
    border: 0 !important;
}

/* ******************************
    Bulk changes
****************************** */
div[data-is-multiselect="true"] .document-class-list-tree tr[aria-selected="true"] td.ui-state-active {
    background: #e5e7ec !important;
    background-color: #e5e7ec !important;
    color: #595F6E !important;
    border-color: #e5e7ec !important;
}
    div[data-is-multiselect="true"] .document-class-list-tree tr[aria-selected="true"] td.ui-state-active.ui-state-hover {
        background: #0054F0 !important;
        background-color: #0054F0 !important;
        color: #FFFFFF !important;
        border: 0 !important;
    }

    div[data-is-multiselect="true"] .document-class-list-tree tr[aria-selected="true"] td.ui-state-active svg {
        fill: #001323 !important;
    }
    .document-class-list-tree tr[aria-selected="true"] td.ui-state-active.ui-state-hover svg {
        fill: #ffffff !important;
    }
        .document-class-list-tree tr[aria-selected="true"] td.ui-state-active.ui-state-hover svg:hover {
            fill: #001335 !important;
        }

/* the hover */
.ui-iggrid-pagesizedropdown:hover {
    border-color: #004ad4 !important;
    background-color: #0054F0 !important;
    color: #FFFFFF !important;
}

.ui-state-hover span.row-button:hover svg,
.ui-iggrid .ui-iggrid-tablebody td span.row-button:hover svg {
    fill: #001335 !important;
}
.ui-iggrid .ui-iggrid-footer .ui-state-active {
    border: 0 !important;
    background-color: #e5e7ec !important;
    color: #FFFFFF !important;
}
.ui-iggrid .ui-ig-altrecord td.ui-state-active, .ui-iggrid .ui-ig-altrecord th.ui-iggrid-rowselector-class.ui-state-active, .ui-iggrid tbody .ui-ig-altrecord .ui-iggrid-mergedcell.ui-state-active, .ui-iggrid tbody .ui-ig-altrecord .ui-iggrid-mergedcellstop.ui-state-active, .ui-iggrid tbody .ui-iggrid-mergedcell.ui-state-active, .ui-iggrid tbody .ui-iggrid-mergedcellstop.ui-state-active, .ui-iggrid td.ui-state-active, .ui-iggrid th.ui-iggrid-rowselector-class.ui-state-active {
    background: #FFF;
    color: #43464c;
    border-color: #f5f5f5;
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-paging-item.ui-state-hover {
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-page.ui-iggrid-page-hover {
}
.ui-iggrid .ui-iggrid-footer .ui-iggrid-paging-item .ui-iggrid-pagecurrent.ui-state-active {
    border: 2px solid #0054F0 !important;
    background-color: #FFFFFF !important;
}
.ui-iggrid .ui-iggrid-footer .ui-state-default a {
    color: #0054F0 !important;
}
.ui-iggrid-paging .ui-state-active a:link {
    color: #001323 !important;
}

/*****************************************
    Infragistics override
*****************************************/
.document-class-list-tree tr[aria-selected="true"] td.ui-state-active {
    border-color: #FFF;
}
.ui-iggrid-toolbar .form-control {
    background: #FFF !important;
    background-color: #FFF !important;
    border-color: #e5e7ec !important;
    color: #001323 !important;
}
    .ui-iggrid-toolbar .form-control:focus {
        color: #001323;
        background-color: #fff;
        border-color: #0054F0 !important;
        outline: 0;
        /*box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);*/
        -webkit-box-shadow: 0 0 0 0.2rem rgba(0,123,255,0.25);
        -moz-box-shadow: 0 0 0 0.2rem rgba(0,123,255,0.25);
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,0.25);
        /*-webkit-box-shadow: 0px 3px 5px rgba(0,24,62,0.1);
        -moz-box-shadow: 0px 3px 5px rgba(0,24,62,0.1);
        box-shadow: 0px 3px 5px rgba(0,24,62,0.1);*/
    }
.ui-iggrid-paging-item .ui-state-hover {
    border: 0 !important;
    background: 0 !important;
}
.ui-state-focus, .ui-widget-content .ui-state-focus {
    border: 0 !important;
}
.ui-iggrid .ui-iggrid-toolbar, .ui-iggrid .ui-iggrid-footer {
    background-color: transparent !important;
    border-bottom: 0 !important;
}
.ui-iggrid .ui-iggrid-table > tbody > tr > td:first-child, .ui-iggrid .ui-iggrid-tablebody > tr > td:first-child {
    border-left: 0 !important;
}
.ui-iggrid .ui-iggrid-table>tbody>tr:first-child, .ui-iggrid .ui-iggrid-tablebody>tr:first-child {
    border-top: 1px solid black;
}
.ui-iggrid .ui-iggrid-table>tbody>tr>td:last-child, .ui-iggrid .ui-iggrid-tablebody>tr>td:last-child {
    border-right: 0 !important;
}

.ui-iggrid .ui-iggrid-scrolldiv {
    border-bottom: 0 !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}
