/*** 
    ATTENTION infokalf loads after CommonUi and can use CommonUi variables  
    Page specific css kan use variables from infokalf and CommonUi    
 ***/

:root {
    /* color scheme */
    --ik-base-color-white-1: var( --cui-base-color-white-1);
    --ik-base-color-grey-1: var(--cui-base-color-grey-1);
    --ik-base-color-grey-2: var(--cui-base-color-grey-2);
    --ik-base-color-grey-3: var(--cui-base-color-grey-3);
    --ik-base-color-blue-1: var(--cui-base-color-blue-1);
    --ik-base-color-blue-2: var(--cui-base-color-blue-2);
    --ik-base-color-blue-3: var(--cui-base-color-blue-3);
    --ik-base-color-black-1: var(--cui-base-color-black-1);
    /* color  */
    --ik-color-text: var(--ik-base-color-grey-1);
    --ik-font-family-main: Verdana, Arial, Helvetica, sans-serif;
    --ik-font-size-main: 11px;
    --ik-menu-background-color-dark: var(--ik-base-color-blue-2);
    --ik-menu-background-color-main: var(--ik-base-color-blue-1);
    --ik-menu-color-main: var(--ik-base-color-white-1);
}

table#DDDOverzichtArts {
}

    table#DDDOverzichtArts td {
        padding-right: 8px;
        max-width: 190px;
        cursor: default;
    }

    table#DDDOverzichtArts th {
        padding-top: 0;
    }

        table#DDDOverzichtArts th:nth-child(4) {
            width: 75px;
        }

        table#DDDOverzichtArts th:nth-child(5),
        table#DDDOverzichtArts th:nth-child(6),
        table#DDDOverzichtArts th:nth-child(7) {
            width: 60px;
        }


.divKoppelDetail {
    width: 100%;
    float: left;
    margin: 5px 5px 5px 0;
}

.divKoppelDetail {
    --koppel-detail-label-width: 185px;
}

    .divKoppelDetail label {
        width: var(--koppel-detail-label-width);
        font-weight: bold;
    }

    .divKoppelDetail input {
        width: 145px;
    }

    .divKoppelDetail p {
        width: 740px;
        padding-top: 2px;
        padding-bottom: 5px;
    }

        .divKoppelDetail p span {
            float: left;
        }

        .divKoppelDetail p textarea {
            width: 300px;
            height: 75px;
        }

.floatright {
    float: right;
}

.floatrightbutton {
    float: right;
    margin-left: 5px;
}

#tbxAantalOpgezetError {
    color: red;
}

#KoppelList thead {
    display: block;
}

#KoppelList tbody {
    display: block;
    overflow-y: auto;
    max-height: 435px;
}

#KoppelList th {
    font-weight: bold;
    font-size: 100%;
}

    #KoppelList th:nth-child(1), #KoppelList td:nth-child(1) {
        width: 25px;
    }

    #KoppelList th:nth-child(2), #KoppelList td:nth-child(2) {
        width: 105px;
    }

    #KoppelList th:nth-child(3), #KoppelList td:nth-child(3) {
        width: 320px;
    }

    #KoppelList th:nth-child(4), #KoppelList td:nth-child(4) {
        width: 85px;
    }

    #KoppelList th:nth-child(4) {
        padding-right: 16px;
    }

#KoppelList td {
    vertical-align: middle;
}

.aanleverdatum label {
    width: 320px;
}

.summarystep {
    float: left;
    min-width: 500px;
    display: block;
    height: auto;
}

.tblGetVKI table {
    margin-top: 5px;
    margin-bottom: 10px;
    width: 740px;
}

.tblGetVKI td {
    padding: 0 0 5px 3px;
}

.ddd_chart_header {
    margin-bottom: 6px;
}
/* --------------------------------	*/
/* IKBRegister           			*/
/* --------------------------------	*/
#IKBRegisterZoekveld {
    float: left;
    width: 740px;
}

    #IKBRegisterZoekveld label {
        float: left;
        width: 105px;
    }

    #IKBRegisterZoekveld input {
        width: 200px;
        margin: 0 0 4px 0;
    }

    #IKBRegisterZoekveld select {
        float: left;
        width: 203px;
        margin: 0 4px 4px 0;
    }

    #IKBRegisterZoekveld input[type="submit"] {
        width: 100px;
        float: left;
    }

    #IKBRegisterZoekveld input[type="button"] {
        width: 100px;
        float: left;
        margin: 0 0 4px 4px;
    }

.ikbregistervalidatie {
    float: left;
    margin-left: 105px !important;
}


table#eenopeenrelatie tr td {
    vertical-align: middle;
}

table#eenopeenrelatie th {
    vertical-align: bottom;
}

.eenopeenrelatie_colvbi {
    width: 50px;
}

.eenopeenrelatie_colbuttons {
    width: 120px;
}

.eenopeenrelatie_vbibenchmarkwaardentable {
    font-size: 10px;
    margin: 10px;
}

a.ik-grid-row-button {
    background-color: var(--ik-menu-background-color-main);
    color: var(--ik-menu-color-main) !important;
    font-weight: bold;
    border: none;
    border-top: #85b8dd 1px solid;
    border-bottom: #85b8dd 1px solid;
    width: 86px;
    height: 20px;
    border-radius: 4px;
    font-size: 0.9em;
    display: flex;
    align-items: center;
    justify-content: center;
}

a.buttonoverzichtarts:hover {
    background-image: none;
    background-color: var(--kendo-color-primary-hover);
}

a.buttonoverzichtarts {
    float: left;
    width: 236px;
    background-image: url(/Content/shared/images/buttonbg.jpg);
    background-repeat: repeat-x;
    color: var(--ik-menu-color-main);
    font-weight: bold;
    font-size: 9px;
    border: none;
    padding: 2px 20px 1px 20px;
    height: 18px;
    margin: 0 2px 0 0;
    cursor: pointer;
    font-family: var(--ik-font-family-main);
    text-decoration: none;
    text-align: center;
    display: block;
    white-space: nowrap;
}

    a.ik-grid-row-button:hover, a.buttonoverzichtarts:hover {
        text-decoration: none;
    }

.divEenopEenrelatieRow {
    width: 100%;
    overflow: hidden;
    float: left;
}

.divEenopEenrelatie {
    width: 100%;
    float: left;
    margin: 5px 5px 5px 0;
    border: #aaaaaa 1px solid;
    background-color: #eee;
    color: #aaaaaa;
    padding: 5px 0 0 5px;
    box-sizing: border-box
}

    .divEenopEenrelatie label,
    .divEenopEenrelatie .wizard-step .boldfont {
        font-weight: bold;
    }

    .divEenopEenrelatie p.undefined_height {
        height: auto;
        display: inline-block;
    }

    .divEenopEenrelatie p.smallheight {
        min-height: 0;
        height: 5px;
        width: 100%;
    }

    .divEenopEenrelatie p.brheight {
        height: 12px;
        width: 100%;
    }

    .divEenopEenrelatie .boldfont .summarystep span {
        float: left;
        display: block;
        margin: 2px 4px 0 0;
    }

    .divEenopEenrelatie input {
        margin: 0 2px 0 2px;
        display: block;
    }

    .divEenopEenrelatie select {
        width: 250px;
        margin: 0 2px 0 2px;
        min-height: 16px;
    }

    .divEenopEenrelatie img {
        float: left;
        display: block;
    }

    .divEenopEenrelatie input[type="submit"] {
        float: left;
        width: 170px;
        margin: 5px 0 0 5px;
    }

    .divEenopEenrelatie input[type="button"] {
        float: left;
        width: 167px;
        margin: -1px 0 0 0;
    }

    .divEenopEenrelatie .errormessage {
        width: 250px;
        float: left;
        height: 21px;
        color: #f00;
    }

    .divEenopEenrelatie .dateerrormessage {
        width: 200px;
        height: auto !important;
        float: left;
        color: #f00;
    }

    .divEenopEenrelatie .dateerrormessagescan {
        display: inline-block;
        width: 300px;
        height: auto !important;
        float: left;
        color: #f00;
    }

a#InfoKalverEigenaar img {
    float: none;
    display: inline;
}

.summaryondertekend {
    float: left;
    width: 365px;
    display: block;
    margin-left: 5px;
}

#errorfileupload {
    height: 50px !important;
}

a.printscan, a.printscan:hover {
    float: left;
    width: 165px;
    background-image: url(/Content/shared/images/buttonbg.jpg);
    background-repeat: repeat-x;
    color: var(--ik-menu-color-main);
    font-weight: bold;
    font-size: 10px;
    border: none;
    border-top: #85b8dd 1px solid;
    border-bottom: #85b8dd 1px solid;
    padding: 2px 0;
    height: 14px;
    margin: 0 2px 0 0;
    cursor: pointer;
    font-family: var(--ik-font-family-main);
    text-decoration: none;
    text-align: center;
    display: block;
}

.divEenopeenovereenkomst {
    width: 100%;
    float: left;
    margin: 5px 5px 5px 0;
    display: inline-block;
}

    .divEenopeenovereenkomst p {
        display: inline-block;
        width: 100%;
    }

        .divEenopeenovereenkomst p span {
            width: 100px;
            display: inline-block;
            float: left;
            margin: 2px 0 0 0;
        }

        .divEenopeenovereenkomst p input, .divEenopeenovereenkomst p img {
            display: inline-block;
            float: left;
            margin: 2px 2px 0 0;
        }

#eenopeenrelatieInzageZoeken input[type="text"] {
    width: 240px;
    margin: 4px 0 0 0;
}

#eenopeenrelatieInzageZoeken select {
    width: 244px;
}

#eenopeenrelatieInzageZoeken label {
    width: 140px;
    display: inline-block;
    font-weight: bold;
}

#VBIVeehoudergegevens {
    word-wrap: break-word;
    word-break: normal
}

    #VBIVeehoudergegevens td,
    #VBIVeehoudergegevens th {
        padding-right: 4px;
        padding-left: 2px;
    }

.buttonVBI {
    float: left;
    background-image: url(/Content/shared/images/buttonbg.jpg);
    background-repeat: repeat-x;
    color: var(--ik-menu-color-main);
    font-weight: bold;
    font-size: 10px;
    border: none;
    padding: 2px 10px 0 10px;
    height: 18px;
    margin: 0 2px 0 0;
    cursor: pointer;
    font-family: var(--ik-font-family-main);
    text-decoration: none;
    text-align: center;
    display: block;
}

/* area email invoer */

div.emailbox {
    float: left;
    padding: 4px 12px;
    width: 714px;
    margin-top: 12px;
}

    div.emailbox table {
        margin-bottom: 4px !important; /* overrule default */
    }

        div.emailbox table td.col1 {
            /* label */
            width: 150px;
        }

        div.emailbox table td.col2 {
            /* input email */
            width: 250px;
        }

        div.emailbox table td.col3 {
            /* checkbox */
            width: 24px;
        }

        div.emailbox table td.col4 {
            /* label */
            width: 99%;
            text-align: left;
        }

/* --------------------------------	*/
/* Overview Grids                   *
/* --------------------------------	*/

.overviewfilter label {
    display: inline-block;
    vertical-align: top !important;
    width: 14em;
}

.overview-date {
    text-align: left;
    vertical-align: top !important;
}

.overview-string {
    text-align: left;
    overflow: clip;
    vertical-align: top !important;
}

.overview-text {
    text-align: left;
    overflow-wrap: break-word;
    vertical-align: top !important;
}

.overview-number {
    text-align: right !important;
    vertical-align: top !important;
}

.overview-action {
    vertical-align: top !important;
}

.overview-tooltip {
    font-size: 10pt;
    padding: 3px 7px;
    background-color: #eee;
    border: solid 1px #000;
    border-radius: 3px;
    position: absolute;
    width: 150px;
    display: none;
    z-index: 9999;
}

.overview-button.k-button {
    background-image: url(/Content/shared/images/buttonbg.jpg);
    background-repeat: repeat-x;
    height: 21px;
    color: var(--ik-menu-color-main);
    font-weight: bold;
    font-size: 10px;
    border: none;
    border-top: #85b8dd 1px solid;
    border-bottom: #85b8dd 1px solid;
    min-width: 120px;
    padding: 0;
    margin: 0 5px 0 0;
    cursor: pointer;
    font-family: var(--ik-font-family-main);
    border-radius: 0;
}

.k-widget.k-grid.k-grid-display-block {
    border: none;
    box-shadow: none;
}

.k-grid table, .k-grid-norecords {
    border-style: solid;
    border-width: thin;
    border-color: #cccccc;
}

.k-pager-sizes .k-dropdown, .k-pager-sizes .k-dropdownlist, .k-pager-sizes > select {
    width: 75px !important;
}

/* Hide grid pager bar */
.ik-hide-grid-pager-bar.k-grid {
    border-style: none;
}

    .ik-hide-grid-pager-bar .k-grid.k-table {
        border-style: none;
    }

.ik-hide-grid-pager-bar .k-pager {
    visibility: hidden
}

.ik-hide-grid-pager-bar .k-grid-table {
    border-style: solid;
    border-width: 1px;
}

/* icons */


/* icons in gridcells */
.k-grid .k-icon.ik-grid-cell-icon {
    font-size: 1.3rem;
    color: var(--ik-base-color-blue-3);
}

    .k-grid .k-icon.ik-grid-cell-icon:hover {
        font-size: 1.3rem;
        cursor: pointer;
    }

    .k-grid .k-icon.ik-grid-cell-icon.ik-grid-cell-icon-grey-2 {
        color: var(--ik-base-color-grey-2);
    }

    .k-grid .k-icon.ik-grid-cell-icon.ik-grid-icon-color-blue-2 {
        color: var(--ik-base-color-blue-2);
    }

/* general icon*/
.ik-show-pointer .k-icon {
    cursor: pointer;
}

.k-icon.ik-icon-color-green {
    color: #3FB445;
}

.k-icon.ik-icon-color-orange {
    color: #F4CF1A;
}

.k-icon.ik-icon-color-red {
    color: #FE3627;
}

.k-icon.ik-icon-color-blue {
    color: #0899ff;
}

.k-icon.ik-icon-color-black {
    color: #777777;
}


/* kendo dialog and window*/

.k-dialog .k-window-titlebar {
    height: 30px;
    background-color: var(--ik-base-color-grey-3);
}


.k-dialog .k-window-title {
    font-size: 18px;
    padding: 7px 0 0 0;
    color: var(--cui-color-heading);
    font-weight: bold;
}

.k-dialog .k-window-content {
    padding-bottom: 25px;
}

.overview-number .k-column-title {
    width: 100%;
}