/* || FONTS */
/*#region*/
@font-face {
    font-family: 'LogiQ-naam';
    src: url('Images/LogiQ-naam.svg') format('svg');
}

@font-face {
    font-family: 'Roboto-Black';
    src: url('fonts/Roboto-Black.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-BlackItalic';
    src: url('fonts/Roboto-BlackItalic.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-Bold';
    src: url('fonts/Roboto-Bold.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-BoldItalic';
    src: url('fonts/Roboto-BoldItalic.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-Italic';
    src: url('fonts/Roboto-Italic.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-Light';
    src: url('fonts/Roboto-Light.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-LightItalic';
    src: url('fonts/Roboto-LightItalic.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-Medium';
    src: url('fonts/Roboto-Medium.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-MediumItalic';
    src: url('fonts/Roboto-MediumItalic.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url('fonts/Roboto-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-Thin';
    src: url('fonts/Roboto-Thin.woff') format('woff');
}

@font-face {
    font-family: 'Roboto-ThinItalic';
    src: url('fonts/Roboto-ThinItalic.woff') format('woff');
}

i {
    font-style: normal;
}

.upbuttongroup .appbuttons {
    top: calc(50% - 70px);
    left: calc(50% - 140px);
    position: absolute;
    z-index: 999;
}

.downbuttongroup .appbuttons {
    top: calc(50% - 70px);
    left: 50%;
    position: absolute;
    z-index:999;
}

.multipleselectcontrol.uppercontrol {
    height:50%;
}

.multipleselectcontrol.lowercontrol {
    height: 50%;
    margin-top: 20px;
}

    .multipleselectcontrol.lowercontrol .datatablewrapper {
        height: 100%;
    }


    .multipleselectcontrol {
        height: 100%;
    }
    .multipleselectcontrol .datatablewrapper {
        height: calc(100% - 60px);
    }
        .multipleselectcontrol .datatablewrapper.doubleheader {
            height: calc(100% - 120px);
        }

.repeatercontrol {
    height: 100%;
}
    .repeatercontrol .datatablewrapper {
        height: calc(100% - 60px);
    }

table {
    border-spacing: 8px 2px;
}

.outercontentdiv {
    padding: 1px 24px 0 10px;
}


.grid-6-2 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 6fr 2fr;
}

.grid-2-6 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 2fr 6fr;
}


.grid-num-slash-num {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 10fr 10px 5fr 5fr;
}

.grid-6-4 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 6fr 4fr;
}

.grid-4-6 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 4fr 6fr;
}

.grid-4-1-4 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 4.75fr 0.5fr 4.75fr;
}

.grid-1-4-4 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 0.5fr 4.75fr 4.75fr;
}

.grid-2-4-4 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 2fr 4fr 4fr;
}

.grid-5-5 {
    width: 100%;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-columns: 5fr 5fr;
}

.grid-row-2-5 {
    display: grid;
    grid-template-rows: 2fr 5fr;
    overflow-x: hidden;
    overflow-y: auto;
}

.grid-row-5-5 {
    display: grid;
    grid-template-rows: 5fr 5fr;
    overflow-x: hidden;
    overflow-y: auto;
}

tr.odd, tr.even, .dt-loading-text {
    font-size: 15px;
    font-family: roboto-light;
    color: rgba(0,0,0,0.7);
}

.dataTables_wrapper .dataTables_processing {
    line-height: 50px;
    padding-top: 0;
    margin-top: -4px;
    height: 50px;
    text-align: left;
    padding-left: 40px;
    left: unset;
    margin-left: unset;
    background: #fff;
    top: 42px;
}
/*#endregion*/
/* || GENERAL */
/*#region*/
html, body {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Roboto-Regular;
}

body {
    padding: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

*, *:before, *:after {
    -moz-box-sizing: inherit;
    -webkit-box-sizing: inherit;
    /* box-sizing: inherit; */
    box-sizing: border-box;
}

.main {
    flex: 1 1 auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    /*width: calc(100% - 240px);*/
}

    .main > div {
        flex: 0 0 auto !important;
    }

        .main > div:last-child {
            flex: initial;
        }

        /*this is done to force last div in main class to fill up the rest of the space. The last child is app-buttons.*/
        .main > div:nth-last-child(2) {
            flex: 1 1 auto !important;
        }



div.flex0 {
    flex: 0 0 auto;
}

div #control-data {
    display: none;
}

#wmsForm, .card-form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    overflow: auto;
}

    #wmsForm > div, #wmsform > nav {
        height: 100%;
    }

a:active, a:focus, button:active, button:focus {
    outline: 0;
    border: none;
}

h1 {
    font-size: 3.0em;
}

h2 {
    font-size: 2.5em;
}

h3 {
    font-size: 2em;
}

h4 {
    font-size: 1.5em;
    margin: 3px;
}

h5 {
    font-size: 0.95em;
    margin: 3px;
}

h6 {
    font-size: 0.5em;
}

/*#endregion*/

/* || COLORS */
/*#region*/

/* Palette color codes */
/* Palette URL: http://paletton.com/#uid=2171q0knXvSbOacl7oscJWC02XO */

/* Feel free to copy&paste color codes to your application */

/* As hex codes */
.color-primary-0 {
    color: #FECA40;
}
/* Main Primary color */
.color-primary-1 {
    color: #514933;
}

.color-primary-2 {
    color: #C3A042;
}

.color-primary-3 {
    color: #FFE49A;
}

.color-primary-4 {
    color: #FFFFFF;
}

.color-complement-0 {
    color: #3E49AF;
}
/* Main Complement color */
.color-complement-1 {
    color: #262838;
}

.color-complement-2 {
    color: #3A4186;
}

.color-complement-3 {
    color: #A0A8F4;
}

.color-complement-4 {
    color: #F7F7F7;
}

/* As RGBa codes */
.rgba-primary-0 {
    color: rgba(254,202, 64,1);
}
/* Main Primary color */
.rgba-primary-1 {
    color: rgba( 81, 73, 51,1);
}

.rgba-primary-2 {
    color: rgba(195,160, 66,1);
}

.rgba-primary-3 {
    color: rgba(255,227,154,1);
}

.rgba-primary-4 {
    color: rgba(255,255,255,1);
}

.rgba-complement-0 {
    color: rgba( 62, 73,175,1);
}
/* Main Complement color */
.rgba-complement-1 {
    color: rgba( 38, 40, 56,1);
}

.rgba-complement-2 {
    color: rgba( 58, 65,134,1);
}

.rgba-complement-3 {
    color: rgba(160,168,244,1);
}

.rgba-complement-4 {
    color: rgba(247,247,247,1);
}
/* #endregion */

/* || HEADER */
/*#region*/

.header {
    display: block;
    /*width: 100%;*/
    /*position: fixed;*/
    z-index: 10000;
}

    .header .top {
        position: absolute;
    }

    .header .right {
        position: absolute;
    }

.header-hide {
    display: none !important;
}

.header-logo {
    background: url('Images/logo-witterand-92px.png');
    background-size: cover;
    width: 46.25px;
    height: 51.74px;
}

.header.small-shadow {
    box-shadow: 1px 1px 4px #AAAAAA;
}
/*#endregion*/

/* || IMAGES */
/*#region*/
/*.logo {
    background: url('Images/logo.png') no-repeat center;
    background-color: #FFE49A;
    width: 200px;
    height: calc(100vh - 101px);
    height: 200px;
    background-size: cover;
    transform: translate(-50%, -50%);
    position: fixed;
    top: 50%;
    left: 50%;
    box-shadow: 2px 2px 2px gray;
}*/

.logo {
    background: url('Images/logIQ-logotransparantwit.svg');
    height: 100%;
    width: 100%;
    background-size: contain, cover;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 1;
}

.splash-screen-nologo {
    background: url('Images/splash-screen-nologo.jpg') no-repeat center;
    width: 100%;
    height: 100%;
    background-size: cover;
    position: fixed;
}

.warehousephotoblur {
    background: url('Images/splash-screen-nologo.jpg') no-repeat center;
    width: 100%;
    height: 100%;
    background-size: cover;
}

.logo2 {
    background: url('Images/logIQ-logotransparantwit.svg') no-repeat center;
    width: 198px;
    height: 280px;
    background-size: cover;
    margin: 0 auto;
    margin-bottom: 26.25px;
}


/*#endregion*/

/* || TABLE GENERAL */
/*#region*/
table, .table {
    position: relative;
    /*border: 1px solid rgba(0, 0, 0, 0.12);*/
    border: 1px transparent;
    border-collapse: collapse;
    white-space: nowrap;
    font-size: 13px;
    /*background-color: #ddd;*/
    /*width: 100%;*/
    width: auto;
}

.table {
    display: table;
    /*display: inline-table;*/
}

/* override std datatable css*/
/*table.dataTable {
    width: auto;
    margin: 0;
}
*/
table.dataTable th:first-child, table.dataTable td:first-child {
    padding-left: 0;
}

table.dataTable th, table.dataTable td {
    line-height: 46px;
    padding-left: 3px;
}

button.dt-button, div.dt-button, a.dt-button, input.dt-button {
    font-size: 14px;
    margin: 0;
}

    button.dt-button:focus:not(.disabled), div.dt-button:focus:not(.disabled), a.dt-button:focus:not(.disabled), input.dt-button:focus:not(.disabled) {
        border: none;
        background: none;
    }

td.dt-inline-button a {
    text-decoration: inherit;
    color: inherit;
}

.dataTables_wrapper {
    height: 100%;
}

    .dataTables_wrapper > div {
        height: 100%;
    }

.datatablewrapper {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x:auto;
}

/*.btn-dtSettings {
    border: none;
    background: none;
    float: right;
    vertical-align: middle;
}*/
.selected {
    background-color:snow;
}
/*#endregion*/

/* .th is used to define the tr in thead, not a th */
.th {
    /*padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 3px;*/
    text-align: left;
    display: table-row;
    position: relative;
}

th {
    /*padding-top: 12px;
    padding-bottom: 12px;*/
    text-align: left;
    font-weight: normal;
    position: sticky;
    top: 0;
    z-index: 900;
    position: -webkit-sticky;
    position: sticky;
}


/*overrrides for datatables*/
/*which uses span to wrap the sort arrows*/
table.dataTable thead th div.DataTables_sort_wrapper span.Fat {
    position: static;
}

.ls-widget-header {
    position: sticky;
    top: 0;
    z-index: 1;
}

.fixed-header .ls-widget-header {
    /* position: fixed; */
    /* width: 100%; */
    /*height: 40px;*/
    /* top: 68px; */
    /*border-top: 1px solid rgba(0,0,0,.12);*/
}

.fixed-header.secondrepeater .ls-widget-header {
    top: 182px;
    /*border-top: 1px solid rgba(0,0,0,.12);*/
}

.fixed-header.topmobilespacer .ls-widget-header {
    /* top: 110px; */
    /*border-top: 1px solid rgba(0,0,0,.12);*/
}

.fixed-header .ls-widget-header.generated-lookup {
    position: relative;
}

.lookup.fixed-header .ls-widget-header {
    max-width: 428px;
    margin-top: -46px;
}

.fixed-header .ls-widget-header .table-cell {
    display: block;
    margin-left: 0;
    margin-right: 0;
    max-width: none !important;
}

.fixed-header .ls-widget-header.generated-lookup .table-cell {
    display: table-cell;
}

.fixed-header .table-row .table-cell {
    /* padding-top: 53px; */
    padding-bottom: 10px;
}

.fixed-header .lookups .table-row .table-cell {
    padding-top: 10px;
}

.fixed-header .table-row ~ .table-row .table-cell {
    padding: 10px;
}

.lookup .table.lookups {
    z-index: 2;
    width: 100%;
}

   .lookup.fixed-header .table.lookups {
    margin-top: 46px;
    z-index:2;
}

.fixed-header button i {
    z-index: 40;
}
/*#endregion*/

/* || TABLE ROWS */
/*#region*/
/*.table.rows.multipleselect {
    height: calc(100vh - 120px);
}*/

/*.table-row:nth-child(even) {
    background-color: #eeeeee;
}*/
tbody tr {
    position: relative;
    transition-duration: 0.28s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: background-color;
}

tr:nth-child(even) {
    /*background-color: #eeeeee;*/
    /* opacity: .45; */
}

/*tr:hover {
    background-color: #f3bd68;
    opacity: 0.6;
    transition: .2s ease;
}*/

div.table-row.GreyedOut, a.table-row.GreyedOut, .hover-buttons button.GreyedOut, .dt-hover-buttons button.GreyedOut, a.GreyedOut, tr.table-row.GreyedOut {
    opacity: 0.6;
    pointer-events: none;
}

div.table-row.Grey, a.table-row.Grey {
    opacity: 0.6;
}

div.table-row button.selecthidden {
    position: absolute;
    right: 15px;
    top: 18px;
    display: none;
}

div.table-row.selected-row button.selecthidden {
    display: unset;
}

div .table-row i.row-checked.material-icons, a.table-row i.row-checked.material-icons, tr.table-row i.row-checked.material-icons {
    font-size: 24px !important;
    bottom: 5px;
}

div.table-row i.row-checked::before, a.table-row i.row-checked::before, tr.table-row i.row-checked::before {
    content: '\F0130';
}

div.table-row.Checked i.row-checked::before, a.table-row.Checked i.row-checked::before, tr.table-row.Checked i.row-checked::before {
    content: '\F05E1';
    color: #97CC33;
}

tr.table-row.Highlight {
    background-color: #97CC33;
}


div.table-row.GREEN, tr.table-row.GREEN, a.table-row.GREEN {
    background-color: #97CC33;
}

div.table-row.ORANGE, tr.table-row.ORANGE, a.table-row.ORANGE {
    background-color: #FFA500;
}

    div.table-row.GREEN span, div.table-row.GREEN p,
    div.table-row.ORANGE span, div.table-row.ORANGE p {
        color: black;
    }

/*#endregion*/

/* || TABLE CELL */
/*#region*/
td {
    position: relative;
    vertical-align: middle;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
}

.td {
    position: relative;
    vertical-align: middle;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    box-sizing: border-box;
}

.tdhdivider {
    display: inline-flex;
    width: 100%;
    justify-content: space-between;
    margin: 0 auto;
}

.tdwidth {
    width: auto;
}

.table-cell, table.dataTable td.table-cell, table.dataTable th.table-cell {
    display: table-cell;
    /* height: 46px; */
    line-height: 22px;
    /* max-width: 250px; */
    overflow: hidden;
    white-space: nowrap;
    padding-top: 9px;
}

    .table-cell p {
        display: inline-flex;
        /* min-width: 250px; */
    }

    .table-cell.shortcol {
        max-width: 75px;
        table-layout: fixed;
    }

        .table-cell.shortcol span {
            max-width: 75px;
            width: 75px;
            overflow: hidden;
            white-space: nowrap;
        }

    .table-cell .readonlyswitchlabel {
        padding-top: 0;
        padding-left: 0;
        min-height: 22px;
        width: 22px;
        margin: 0 auto;
    }

    .table-cell.sortable:hover {
        cursor: pointer;
    }

    .table-cell.sortable span::after {
        font-family: "Material Design Icons";
        font-weight: normal;
        font-style: normal;
        font-size: 24px;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        font-feature-settings: "liga";
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
        content: "\F0A64";
    }

    .table-cell.sortable.asc span::after {
        content: "\F035D";
    }

    .table-cell.sortable.desc span::after {
        content: "\F0360";
    }

    .table-cell.wrap-text {
        white-space: normal;
    }

        .table-cell.wrap-text p {
            max-width: 250px;
        }

        .table-cell.wrap-text.width375 p {
            max-width: 375px;
        }

    .table-cell.width375 {
        max-width: 375px;
    }

    .table-cell.wide {
        max-width: unset;
    }

    .table-cell span {
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .table-cell .checkbox, td .checkbox {
        width: 40px;
        padding-top: 8px;
        border: 1px solid #b7b7b7;
    }

    .table-cell .material-icons {
        font-size: 23px;
        /*margin: 3px 2px 5px 2px;*/
        line-height: 28px;
        color: #AAAAAA;
    }

        .table-cell .material-icons.red,
        .table-row .material-icons.red {
            color: red;
            background-color: inherit;
        }

        .table-cell .material-icons.green,
        .table-row .material-icons.green {
            color: #97cc33;
            background-color: inherit;
        }
    tbody tr td input {
    background-color: black;
    }


    .DTE_rectangle {
        border: 1px solid #ccc;
        padding: 3px 4px;
        border-radius: 3px;
      /* font-size: 15px;*/
        margin: 1px;
        width: 100%;
        height: 25px;
        line-height: 17px;
        display: block;
    }

.DTE_date_rectangle {
    border: 1px solid #ccc;
    padding: 3px 4px;
    border-radius: 3px;
    /* font-size: 15px;*/
    margin: 1px;
    width: 100%;
    height: 25px;
    line-height: 17px;
    text-align: right;
    display: block;
}

.DTE_number_rectangle {
    border: 1px solid #ccc;
    padding: 3px 4px;
    border-radius: 3px;
    /* font-size: 15px;*/
    margin: 1px;
    width: 100%;
    height: 25px;
    line-height: 17px;
    text-align: right;
    display: block;
}

.DTE_no_edit_rectangle {
    padding: 4px 5px;
    border-radius: 3px;
    /* font-size: 15px;*/
    margin: 1px;
    width: 100%;
    height: 25px;
    line-height: 17px;
    display: block;
}

.DTE_no_edit_date_rectangle {
    padding: 4px 5px;
    border-radius: 3px;
    /* font-size: 15px;*/
    margin: 1px;
    width: 100%;
    height: 25px;
    line-height: 17px;
    text-align: right;
    display: block;
}

.DTE_no_edit_number_rectangle {
    padding: 4px 5px;
    border-radius: 3px;
    /* font-size: 15px;*/
    margin: 1px;
    width: 100%;
    height: 25px;
    line-height: 17px;
    text-align: right;
    display: block;
}
/*#endregion*/

/* || ICONS */
/*#region*/
.material-icons.mdi-pencil:hover {
    color: #3391CC;
}

.material-icons.mdi-delete-forever:hover {
    color: #D80000;
}

.material-icons.mdi-delete-forever {
    color: #aaaaaa;
}

.table-cell .material-icons.mdi-alert.highlight {
    color: #fbcb09;
}
/*#endregion*/

/* || MENU */
/*#region*/


    nav.menu::-webkit-scrollbar {
        display: none;
    }

    nav.menu > a {
        display: block;
        color: #AAAAAA;
    }

        nav.menu > a:hover {
            color: #FFCC33;
        }

.menu_show {
    left: 0 !important;
    position: fixed !important;
    /*height: 100%;*/
    top: 68px;
}


.MainMenu .footer {
    background-color: transparent;
}

.meatballmenu {
    width: 290px;
    background-color: #191919;
    top: 68px;
    height: calc(100vh - 148px);
    z-index: 1000;
    position: fixed;
    right: -300px;
    -moz-transition: .2s all;
    -o-transition: .2s all;
    -webkit-transition: .2s all;
    transition: .2s all;
    border-left: 1px solid #707070;
    border-top: 1px solid #707070;
    padding: 10px;
}

    .meatballmenu.meatballshow {
        right: 0 !important;
    }

    .meatballmenu span, .meatballmenu p {
        color: #aaa;
        font-family: Roboto-Light;
        font-size: 22px;
    }

    .meatballmenu .meatballitem {
        width: 100%;
        border-bottom: 1px solid #707070;
        padding: 15px 0;
    }

/*#endregion*/


.Logon .group {
    font-size: 19px;
    color: #333333;
    margin-bottom: 9.75px;
}

    .Logon .group .bar {
        background: #333333 !important;
    }

.group .input-info {
    text-align: left;
}

.div-pagetitle {
    background: #eeeeee 0 0 no-repeat;
    height: 40px;
    width: 100%;
}

.readonlyswitchlabel {
    padding-top: 15px;
    padding-left: 15px;
}

.secondrepeater {
    /*max-height: calc(100vh - 204px);*/
}

.footer {
    height: 40px;
    background-color: #333333;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 0;
    left: 0;
    position: fixed;
    width: 100%;
    z-index: 2000;
}

.narrower .appbuttons {
    width: calc(100vw - 60px);
}

.jstree .treediv {
    height: calc(100vh - 300px);
    overflow-y: auto;
}

.appbuttons {
    display: flex;
    width: inherit;
    justify-content: center;
    padding-bottom: 10px;
    padding-top: 10px;
    bottom: 0;
    pointer-events: none;
    /*width: calc(100vw);*/
}

.appbuttons-spacer {
    height: 90px;
    width: 100%;
}

.spacer60px {
    height: 60px;
    width: 100%;
    background-color: #dfdfdf;
    margin-bottom: 20px;
}

    .spacer60px p {
        color: #3391cc;
        line-height: 50px;
        font-weight: 700;
    }


.appbuttons i.menu_icon.mdi-plus {
    line-height: 50px;
    text-indent: -2px;
    cursor: pointer;
}

.appbuttons i.menu_icon.mdi-subdirectory-arrow-right {
    line-height: 50px;
    font-size: 45px;
    text-indent: 5px;
    cursor: pointer;
}

.appbuttons i.menu_icon.mdi-subdirectory-arrow-left {
    line-height: 50px;
    font-size: 45px;
    text-indent: -1px;
    cursor: pointer;
}

.appbuttons .menu_icon i.mdi-plus {
    margin-left: -2px;
}

.appbuttons .menu_icon i.mdi-delete-forever {
    margin-top: 0;
    margin-left: 0;
    font-size: 50px;
}

.appbuttons .menu_icon i.mdi-chevron-left {
    margin-left: -3px;
}

.appbuttons .menu_icon.inverted i {
    color: #FFFFFF !important;
}

.appbuttons.right {
    display: block;
    width: inherit;
}

    .appbuttons.right a {
        display: block;
    }

    .appbuttons.right .menu_icon {
        margin-top: 10px;
        margin-right: 10px;
        height: inherit;
        width: inherit;
        padding: 5px;
    }

        .appbuttons.right .menu_icon i, .appbuttons.right i.menu_icon {
            font-size: 32px;
            margin-left: 0;
            margin-top: 0;
        }

a.disabled, a.disabled-by-widget {
    pointer-events: none;
}

.repeater a {
    text-decoration: none;
    color: rgba(0,0,0,.7);
}

.searcher a {
    text-decoration: none;
}

    .repeatercontrol .scrollable, .multipleselectcontrol .scrollable, .fullscreen .repeatercontrol .scrollable, .fullscreen .multipleselectcontrol .scrollable {
        /*max-height: calc(100vh - 140px);*/
        flex: 1 1 auto;
    }

.singlepagetable {
    height: 90%;
}

    .singlepagetable .datatablewrapper {
        width: 100%;
        height: calc(100% - 60px);
    }

    .popupdiv .singlepagetable .datatablewrapper {
       max-height: 78vh;
    }

/*|| TOPBUTTONGROUP*/
/*#region*/
.topbuttongroup {
    position: sticky;
    /*top: 68px;*/
}

.card .topbuttongroup {
    width: 100%;
    top: 0px;
}

.topbuttongroup .group {
    margin-top: 15px;
}

.topbuttongroup .filterspacer {
    width: 275px;
}

    .topbuttongroup .filterspacer.twoinputs {
        width: 530px;
    }

    .topbuttongroup .filterspacer.threeinputs {
        width: 650px;
    }

    .topbuttongroup .filterspacer.fourinputs {
        width: 900px;
    }

    .topbuttongroup .filterspacer.withstate {
        width: 400px;
    }

.topbuttongroup .multipleselectbuttons, .bottombuttongroup .multipleselectbuttons {
    padding-top: 11px;
    display: inline-flex;
}

.topbuttongroup .multipleselectbuttons i, .topbuttongroup a.menu_icon i, .mobile.multipleselectbuttons i, .appbuttons.right.multipleselectbuttons i, .topbuttongroup button.menu_icon i,
.bottombuttongroup .multipleselectbuttons i, .bottombuttongroup a.menu_icon i, .bottombuttongroup button.menu_icon i {
    font-size: 32px;
    padding: 5px 5px 5px 5px;
    cursor: pointer;
}

.mobile.multipleselectbuttons span {
    font-size: 18px;
    line-height: 32px;
    margin-top: 5px;
}

.topbuttongroup i:hover, .topbuttongroup .menu_icon i:hover, .repeaterfilter .fullsearchbox button i:hover, .card-maximize i:hover, .bottombuttongroup i:hover {
    color: #97CC33;
}

.topbuttongroup .addtext, .topbuttongroup .deletetext {
    margin-top: 21px;
    font-family: roboto-medium;
    font-size: 15px;
}

.topbuttongroup .title {
    margin-top: 15px;
    font-family: roboto-medium;
    font-size: 21px;
    width: 213px;
}

    .topbuttongroup .title.longtitle {
        font-size: 18px;
        margin-top: 8px;
    }

.topbuttongroup .material-icons.mdi-plus-box, .topbuttongroup .material-icons.mdi-plus-box-multiple {
    color: #AAAAAA;
}

.topbuttongroup .menu_icon.ls-button {
    padding-top: 11px;
    height: 52px;
}

.topbuttongroup a.menu_icon {
    margin-top: 9px;
}

.topbuttongroup .servicecontrols {
    padding-left: 40px;
}

/*.topbuttongroup .material-icons.mdi-delete-forever {
    color: #AAAAAA;
}*/
.card34 .topbuttongroup .title {
    width: 125px;
}

.topbuttongroup .ls-button {
    background-color: transparent;
    padding: 0;
    color: rgba(0,0,0,.87);
}

div.dt-button-background {
    background: none;
}

button.dt-button, div.dt-button, a.dt-button, input.dt-button, button.dt-button:hover:not(.disabled), div.dt-button:hover:not(.disabled), a.dt-button:hover:not(.disabled), input.dt-button:hover:not(.disabled) {
    background: #eee;
    border: none;
    padding: 0;
    /*margin: 0;*/
}

div.dt-buttons {
    /*float: right;*/
    position: absolute;
    top: 8px;
    right: 15px;
    opacity: 0.2;
    z-index: 1000;
}

.dt-button > span {
    margin: 0;
}

thead tr .dt-buttons {
    position: sticky;
    top: 0;
}

div.dt-buttons:hover {
    opacity: 1;
}

div.dt-button-collection {
    right: 0;
}

.dt-button-collection .dt-button.buttons-columnVisibility {
    background: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0.25em 1em !important;
    margin: 0 !important;
    text-align: left !important;
}

.dt-button-collection .buttons-columnVisibility:before,
.dt-button-collection .buttons-columnVisibility.active span:before {
    display: block;
    position: absolute;
    top: 1.2em;
    left: 0;
    width: 12px;
    height: 12px;
    box-sizing: border-box;
}

.dt-button-collection .buttons-columnVisibility:before {
    content: ' ';
    margin-top: -8px;
    margin-left: 10px;
    border: 1px solid black;
    border-radius: 3px;
}

.dt-button-collection .buttons-columnVisibility.active span:before {
    font-family: 'Arial' !important;
    content: '\2714';
    margin-top: -15px;
    margin-left: 12px;
    text-align: center;
    text-shadow: 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
}

.dt-button-collection .buttons-columnVisibility span {
    margin-left: 17px;
}

.dt-button span i.menu_icon {
    /*font-size: 32px;*/
    /*padding: 16px 5px 5px 0;*/
    cursor: pointer;
    color: #aaaaaa;
}

.topbuttongroup div.dt-buttons {
    padding-top: 11px;
    position: relative;
    opacity: unset;
    top: 0;
    right: unset;
}

.topbuttongroup button.dt-button {
    background: transparent;
}

.topbuttongroup .dt-button span i.menu_icon {
    color: rgba(0,0,0,.87);
    font-size: 32px;
    padding: 5px 5px 5px 5px;
    cursor: pointer;
}

.dt-down-arrow {
    display: none;
}
/*.multipleselect {
    top: 60px;
}*/

.Logon .header {
    display: none;
}

.lookup .header {
    display: none;
}

.Logon .footer {
    display: none;
}

.ls-button {
    padding: 10px 36.71px 12px 36.9px;
    display: inline-block;
    position: relative;
    right: 0;
    line-height: normal;
    margin-right: .1em;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #3391CC;
    border: 0;
    /* Support: IE <= 11 */
    overflow: visible;
    color: white;
    font-family: Roboto-Regular;
    font-size: 16px;
}

    .ls-button,
    .ls-button:link,
    .ls-button:visited,
    .ls-button:hover,
    .ls-button:active {
        text-decoration: none;
    }

.ls-corner-all,
.ls-corner-top,
.ls-corner-left,
.ls-corner-tl {
    border-top-left-radius: 25px;
}

.ls-corner-all,
.ls-corner-top,
.ls-corner-right,
.ls-corner-tr {
    border-top-right-radius: 25px;
}

.ls-corner-all,
.ls-corner-bottom,
.ls-corner-left,
.ls-corner-bl {
    border-bottom-left-radius: 25px;
}

.ls-corner-all,
.ls-corner-bottom,
.ls-corner-right,
.ls-corner-br {
    border-bottom-right-radius: 25px;
}

.margin-bottom-30 {
    margin-bottom: 30px;
}

.margin-bottom-35 {
    margin-bottom: 35px;
}

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

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

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

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

.margin-bottom-50 {
    margin-bottom: 50px;
}

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

.center-button {
    display: block;
    margin: 25px auto;
}

.Fat {
    font-weight: 700;
    font-size: 13px;
}

span, .span {
    margin: 3px 5px;
    /*margin: auto;*/
}

div.progressbar {
    height: 30px;
    width: 100%;
    max-width: 1024px;
    margin: 0 auto;
}

.progressbar div.bar {
    display: inline-flex;
    width: 100%;
    justify-content: center;
    padding: 5px 5px;
}

    .progressbar div.bar div.barsection {
        background-color: grey;
        height: 20px;
    }

    .progressbar div.bar div.barspacer {
        background-color: transparent;
        height: 20px;
        width: 5px;
        min-width: 5px;
    }

    .progressbar div.bar div.barsection.checked {
        background-color: green;
    }

.hover-buttons {
    position: sticky;
    right: 0;
    margin-top: 8px;
    display: none;
    background-color: #EEEEEE;
    padding-left: 10px;
    height: 26px;
    -moz-transition: none;
    -o-transition: none;
    -webkit-transition: none;
    transition: none;
    border: none;
}

.dt-hover-buttons {
    display: none;
    position: absolute;
    z-index: 10;
    right: 0px;
    top: 0;
    text-align: right;
    margin-top: 8px;
}

.dt-hover-buttons .linkinactive {
    display: none;
}
    /*used to display dt-hover-buttons but hide the column*/
    .notVisible {
        /*display: none !important;*/
        width: 0px !important;
    }


tr:hover {
    background-color: #ebebeb;
}

    tr:hover .dt-hover-buttons {
        display: block;
    }

.hover-buttons a.menu_icon i, .dt-hover-buttons a.menu_icon i {
    font-size: 26px;
    padding: 3px;
    color: #888;
}

.hover-buttons button.menu_icon i, .dt-hover-buttons button.menu_icon i {
    font-size: 26px;
    padding: 3px;
    color: #888;
    margin-bottom: 13px;
    height: 32px;
}

    .hover-buttons button.menu_icon i:hover, .hover-buttons a.menu_icon i:hover, .dt-hover-buttons button.menu_icon i:hover, .dt-hover-buttons a.menu_icon i:hover {
        color: #000;
        border-radius: 50%;
        background-color: #BBBBBB;
    }

.hover-buttons button.menu_icon, .dt-hover-buttons button.menu_icon {
    height: 43px;
}

.hover-parent:hover .hover-buttons {
    display: block;
}

.message input {
    margin-top: 5px;
    border-radius: 10px;
}

div.pagecontrols {
    justify-content: center;
    margin-top: 5px;
    margin-left: 30px;
}

.pagecolumns {
    display: inline-flex;
}

.pagecolumns2 {
    display: inline-flex;
}

.card .pagecolumns {
    display: block;
}

.card30 .pagecolumns {
    display: inline-flex;
}

.pagecolumns .pagefieldcolumn {
    width: 430px;
    border: 1px transparent;
    margin-right: 5px;
}

/*.pagecontrols .submitdiv {
    position: absolute;
    right: 0;
}*/

/* || FILTER */
/*#region*/

div.filter {
    width: 100%;
    position: fixed;
    left: -10000px;
    background-color: #FECA40;
    transition: .3s all;
    margin-bottom: 10px;
    /*min-height: calc(100vh - 81px);*/
    z-index: 51;
    padding: 10px;
    display: inline-flex;
    top: 68px;
    border: 1px solid #ddd;
}

.ui-tabs-panel div.filter {
    top: 145px;
}

    div.filter.pvo.repeaterfilter {
        background-color: transparent;
        border: none;
        display: inline-flex;
        justify-content: flex-start;
        width: 100%;
        left: initial;
        padding-top: 4px;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    div.filter.repeaterfilter {
        position: fixed;
        background-color: transparent;
        border: none;
        display: inline-flex;
        justify-content: flex-start;
        width: 220px;
        left: 325px;
        padding-top: 4px;
        padding-bottom: 0;
        margin-bottom: 0;
    }

.card34 div.filter.repeaterfilter {
    left: 200px;
}

div.filter.repeaterfilter.withstate {
    width: 390px;
}

div.filter.repeaterfilter.twoinputs {
    width: 445px;
}

div.filter.repeaterfilter.threeinputs {
    width: 605px;
}

div.filter.repeaterfilter.fourinputs {
    width: 820px;
}

.repeaterfilter .fullsearchbox, .repeaterfilter .group {
    width: 200px;
    margin-top: 10px;
    margin-right: 5px;
    border-radius: 25px;
    padding: 5px 10px;
    border: 2px solid #B7B7B7;
    position: sticky;
    background-color: #eee;
}

.repeaterfilter .lookup-input {
    border-top-left-radius: 19px;
    border-top-right-radius: 19px;
    width: 176px;
    padding: 5px 10px;
    background-color: #eee;
    border: 2px solid #B7B7B7;
    margin-top: -27px;
    margin-left: -2px;
}

    .repeaterfilter .lookup-input input {
        background-color: transparent;
        height: 24px;
    }

    .repeaterfilter .lookup-input i.lookup-close {
        margin-top: 0;
        top: 2px;
    }

.repeaterfilter div.lookup {
    width: 176px;
    top: 33px;
    margin-left: -2px;
    border-bottom-left-radius: 19px;
    border-bottom-right-radius: 19px;
    border: 2px solid #B7B7B7;
    padding-bottom: 15px;
    overflow: hidden;
}

.repeaterfilter .table-row .table-cell {
    padding: 10px;
}

.repeaterfilter .search {
    top: 5px;
    right: 8px;
}

.repeaterfilter .lookup.fixed-header .ls-widget-header {
    width: 168px;
}

.repeaterfilter .group input, .repeaterfilter .group .lookup-input input {
    padding: 1px 2px;
    margin: 0;
    border: none;
    color: #b7b7b7;
}

.repeaterfilter .group {
    min-height: 0;
}

.repeaterfilter .switch {
    margin-bottom: 0;
}

.repeaterfilter .switchdiv {
    max-width: 200px;
    width: unset;
}

.repeaterfilter .bar, .repeaterfilter .label {
    display: none;
}

.group.disabled .search {
    display: none;
}

.group i.datepicker-clear {
    position: absolute;
    top: 3px;
    right: 12px;
}

.filter .group.date {
    width: 150px;
}

.filter .group.stateselect {
    width: 176px;
}

.fullsearchbox i, .fullsearchbox input {
    color: #B7B7B7;
}

.repeaterfilter .fullsearchbox input {
    width: 160px;
}

.fullsearchbox .footerbutton {
    position: absolute;
    top: 5px;
    right: 8px;
    z-index: 3;
}

div.filter.smallfilter {
    background-color: #eee;
}

.smallfilter button {
    position: absolute;
    padding: 0;
    width: 40px;
    height: 40px;
    background-color: transparent;
    top: 9px;
    right: 13px;
}

    .smallfilter button i {
        color: #b7b7b7;
        font-size: 35px;
    }

.smallfilter input {
    /*background-color: #ffffff;
    border-radius: 15px;
    border: 1px solid #c7c7c7;*/
}

.filter_show {
    left: 0 !important;
}

div.mobilefilter {
    position: fixed;
    top: 50px;
    width: 100%;
    z-index: 99;
    /* max-width: 430px; */
    /* left: 50%;*/
    height: 60px;
}

    div.mobilefilter > div {
        position: relative;
        left: 0;
    }

div.mobilefilter_fix {
    width: 100%;
    z-index: 99;
    /* max-width: 430px; */
    /* left: 50%;*/
    height: 60px;
}

    div.mobilefilter_fix > div {
        position: relative;
    }

div.mobilefilterspacer {
    min-height: 41px;
}
/* #endregion */

/* || SWITCH */
/* #region */
.switchdiv {
    display: inline-flex;
    width: 100%;
}

.switch,
.switch * {
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.switch {
    margin-left: 15px;
    margin-bottom: 10px;
    margin-top: 10px;
    line-height: 1.25;
}

.switch-p {
    font-family: Roboto-Light;
    font-size: 16px;
    font-weight: 300;
    margin-top: 12px;
}

.switch label {
    cursor: pointer;
    /*width: 60px;*/
}

    .switch label input[type=checkbox] {
        opacity: 0;
        width: 0;
        height: 0;
    }

        .switch label input[type=checkbox]:checked + .lever {
            background-color: #3391CC;
        }

            .switch label input[type=checkbox]:checked + .lever:before, .switch label input[type=checkbox]:checked + .lever:after {
                left: 18px;
            }

            .switch label input[type=checkbox]:checked + .lever:after {
                background-color: #fff;
            }

    .switch label .lever {
        content: "";
        display: inline-block;
        position: relative;
        width: 34px;
        height: 16px;
        background-color: rgba(0, 0, 0, 0.38);
        border-radius: 15px;
        margin-right: 10px;
        -webkit-transition: background 0.3s ease;
        transition: background 0.3s ease;
        vertical-align: middle;
        margin: 0 8px 0 0;
    }

        .switch label .lever:before, .switch label .lever:after {
            content: "";
            position: absolute;
            display: inline-block;
            width: 14px;
            height: 14px;
            border-radius: 50%;
            left: 1px;
            top: 1px;
            -webkit-transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
            transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
            transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease;
            transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
        }

        .switch label .lever:before {
            background-color: rgba(38, 166, 154, 0.15);
        }

        .switch label .lever:after {
            background-color: #fff;
            /*-webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);*/
            /*box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);*/
        }
/* #endregion */

.pagebutton {
    margin-top: 19px;
    border-radius: 10px;
    color: #eee !important;
}

::-ms-clear {
    width: 0;
    height: 0;
}
/*/
.logiq-ajaxloader {
    background: url('data:image/gif;base64,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')  no-repeat center;
    z-index: 999;
}
*/

.logiq-ajaxloader {
    background: url('../content/Images/2.svg') /*../content/slb/Images/ajax-loader.gif*/ no-repeat center;
    z-index: 20000;
}

.lookup.logiq-ajaxloader {
    height: 200px;
}

.menu-item-setting {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAVCAMAAABrN94UAAACc1BMVEUAAAAAAH8Af39Mf7I3WXw3WXsyW3o3WHw3XHw4XH42Wnw2WXs3Wnw8ZItAa5I3WX01WXxISG03X4M+ZIs3XH01UHguXH83WnxDb5o3Wns3WXw2Wns2W31AaJA4XH46YIM/X4o9Y4hKeqlKe6hJeqZJeKZKd6Q4WXxAaY8/f39DeJ1GdaE2W387YoZLd6IuXItKeqg3WXlCbJY3Wnw/aI9CZ5dIeqY2W385XoNMfq03XH1Aa5NKfKs3W31Og7JMgbJPf7Q7YYZHdqI8YYk3WntDbpdPf69Mf7BPgLI2W307YoY8Y4hDb5lFdqBHeqhMf643WXtLgrAzWX81WXs2WX02W343W31Mf7A2Wns3W31PgbM3Wno3W302XH5NgbJMf684VHFPgrNRhLY2WXs/X388Wn83XYFOgrRPgbJUcalOgrFOgbJPgbI7YIRCbphFc55KeaZMfaxOgrRUjalIf7ZNg7E3X386X4M+ZoxMf5lNf7EAAAA3XH89ZYtLe6pNgLE6X4E6YIRJeadKe6lMfKtMf6w3WnxOgrI5XoJPgrRPgrNOgbE+ZoxNgK89ZIpPg7Q7YoY3XH5Pg7VHdqJQhLVNgLBMfq44XIBAapI4XYA6YIQ8Y4g4XH9OgLBOgLFHdaE9ZYtMf65EcJs6XoI3W31Aa5JNf685XoFLfKtOgbI/aZA4XH46YYY6YIU5X4JEcJo8ZIlKe6k4XX9AapFBbJQ+ZYxMfaw6YYVDb5lAaZA7YYZKeqhCbpdEcZxGc55IdqM/Z45OgrNMfq1Ba5Q+Z44/aI9LfKpGdJ88YodJeaY8YoZJeKY+Z41Ke6pKfKpEcZtDbpjkd4v1AAAAhnRSTlMAAgIUJfEZc1i2ltj4mKKOewdArG4TFpO051ja9vP9yRg24pmisj62pwQi4Dj0Lwt/WP3x+BulVFmt49a4+nxDMO3vP6/FIPZXms+k/EkyyDxeFI6f0tl4yIatSdzW+cgJ9DhnCCLJ4k0JwPhDmtDm49D6CQ5CQPbACi4BuEv7X2jEj5mZULknbSQAAAGbSURBVHheXc1jkyRBGATgnL1Z2/aebdu2bdt2VXNsa20dbeMnXXXM9cbGPR8z480XfbTJsSQH/8sF8kjEOBnMlCyoYuJj46CZ2ewZAaBi7sj5arGAkPSExDInV75seWW2JKWqxZoUNtNV39bq1v1ocrxPi4FiNIAkJXcZOj5097xoL4jmewozMvMjRifn+hL42PPn5Sv/vFFQFBFSXGLs4lrdUum435/NX5//rKquGTgIgwnb99S73NKQocOGf+98ZAsGbe8axkA7duv4ZmebQTdhIjCpwWYVKaU+61Qw05SDN9MBzJBFKlA6a/acAWA22bkW3dOFwKLFVOBZsQRRS+1hQ69jxcpVq6lez1PRtxbMuvUbNtrD36TakPmXVzDpeVGWN0OxhRg93LPe2tDrT17eZBJ8suzbprzYTnbs5FoCjnYzKywWftdua+PefWD2Hzh46LGu+4m/s+6tyXL4yNFjx0/gH83JjqZTp8+cFfXnzgMXLkJ16bL7CoCrdY3CNfRz/QZnuAnmls17G/1p7tzVgLl3/8FDRP0FIDSfQbDzALMAAAAASUVORK5CYII=') /*slb/images/blauw_radertje_48x42.png*/ /*slb/images/blauw_radertje_48x42.png*/ no-repeat center;
    height: 20px;
    width: 40px;
}

.content-wrapper {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    min-width: 400px;
}

fieldset {
    border: none;
    margin: 1em 0;
    padding: 1em;
}

    fieldset legend {
        display: none;
        color: #0F8FC3;
    }

    fieldset p {
        margin: 12px 12px 10px 10px;
    }

.display-label,
.display-field,
.editor-field {
    margin: 0.5em 0;
}

.editor-label {
    width: 100px;
    margin: 0.5em 0 1.5em 0;
}

.div-center {
    width: 99%;
    max-width: 430px;
    margin: 0 auto;
    border: 1px transparent;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.mobilefilter_fix .div-center {
    flex: none;
}

.ui-menu.ui-widget-content {
    border: none;
    background-color: transparent;
}

.ui-menu-item-wrapper.ui-state-active {
    border: none;
    background: transparent;
}

.ui-menu a {
    text-decoration: none;
}

.ui-menu .ui-menu-item {
    list-style-image: none;
}

.ui-menu {
    margin-top: 10px;
}

.two-columns {
    width: 100%;
    min-width: 220px;
    margin: 0 auto;
}

.three-columns {
    width: 645px;
    margin: 0 auto;
}

.four-columns {
    width: 860px;
    margin: 0 auto;
}

.five-columns {
    width: 1075px;
    margin: 0 auto;
}

.hdivider {
    display: inline-flex;
    width: 320px;
    justify-content: space-between;
    margin: 0 auto;
}

.dispcol {
    width: 100%;
    display: inline-flex;
    justify-content: space-between;
}

    .dispcol.start {
        justify-content: flex-start;
    }

.flex {
    display: flex;
}

/* || FIXED SIZES */
/*#region*/
.max-height-200 {
    max-height: 200px;
}

.max-height-260 {
    max-height: 260px;
}

.max-height-320 {
    max-height: 320px;
}

.max-height-380 {
    max-height: 380px;
}

.max-height-440 {
    max-height: 440px;
}

.max-height-500 {
    max-height: 500px;
}

.maxheightvh30 {
    max-height: calc(100vh - 234px);
}

.height300px {
    height: 300px !important;
}

.height200px {
    height: 200px !important;
}


.height100px {
    height: 100px !important;
}

.height75px {
    height: 75px !important;
}

.width300px {
    width: 300px !important;
}

.width250px {
    width: 250px !important;
}

.width200px {
    width: 200px !important;
}

.width172px {
    width: 172px !important;
}

.width100px {
    width: 100px !important;
}

.width150px {
    width: 150px !important;
}

.width50px {
    width: 50px !important;
}

.width5, .GE-width5 {
    width: 5% !important;
    min-width: 5% !important;
}

.width8, .GE-width8 {
    width: 8% !important;
    min-width: 8% !important;
}

.width10, .GE-width10 {
    width: 10% !important;
    min-width: 10% !important;
}

.width12, .GE-width12 {
    width: 12% !important;
    min-width: 12% !important;
}

.width15, .GE-width15 {
    width: 15% !important;
    min-width: 15% !important;
}

.width18, .GE-width18 {
    width: 18% !important;
    min-width: 18% !important;
}

.width20, .GE-width20 {
    width: 20% !important;
    min-width: 20% !important;
}

.width25, .GE-width25 {
    width: 25% !important;
    min-width: 25% !important;
}

.width26, .GE-width26 {
    width: 26% !important;
    min-width: 26% !important;
}

.width30, .GE-width30 {
    width: 30% !important;
    min-width: 30% !important;
}

.width33, .GE-width33 {
    width: 33% !important;
    min-width: 33% !important;
}

.width35, .GE-width35 {
    width: 35% !important;
    min-width: 35% !important;
}

.width36, .GE-width36 {
    width: 36% !important;
    min-width: 36% !important;
}

.width38, .GE-width38 {
    width: 38% !important;
    min-width: 38% !important;
}

.width40, .GE-width40 {
    width: 40% !important;
    min-width: 40% !important;
}

.width45, .GE-width45 {
    width: 45% !important;
    min-width: 45% !important;
}

.width47, .GE-width47 {
    width: 47% !important;
    min-width: 47% !important;
}

.width50, .GE-width50 {
    width: 50% !important;
    min-width: 50% !important;
}

.width55, .GE-width55 {
    width: 55% !important;
    min-width: 55% !important;
}

.width60, .GE-width60 {
    width: 60% !important;
    min-width: 60% !important;
}

.width64, .GE-width64 {
    width: 64% !important;
    min-width: 64% !important;
}

.width65, .GE-width65 {
    width: 65% !important;
    min-width: 65% !important;
}

.width66, .GE-width66 {
    width: 66% !important;
    min-width: 66% !important;
}

.width70, .GE-width70 {
    width: 70% !important;
    min-width: 70% !important;
}

.width80, .GE-width80 {
    width: 80% !important;
    min-width: 80% !important;
}

.width90, .GE-width90 {
    width: 90% !important;
    min-width: 90% !important;
}

.width92, .GE-width92 {
    width: 92% !important;
    min-width: 92% !important;
}

.width95, .GE-width95 {
    width: 95% !important;
    min-width: 95% !important;
}

.minheight40 {
    min-height: 40px;
}
/* #endregion */

/*.blankrow {
    height: 70px;
    width: 100%;
}*/

.dispcol .group.readonly {
    width: inherit;
    min-width: 100px;
}

.dispcol .group {
    width: 100%;
    min-width: 160px;
}

.horizontal-div {
    width: 100%;
    display: inline-flex;
}

.userinfo, .tablet .userinfo {
    top: -5px;
    right: 41px;
    position: absolute;
}

    .userinfo span {
        margin: 0;
    }

.ui-selecting {
    background: #FECA40;
}

.ui-selected {
    background: #F39814;
    color: white;
}

.PageElement {
    border: 1px solid #FECA40;
    padding: 5px;
    margin: 5px;
}

.repeater-footer a.menu_icon i, .repeater-footer button.menu_icon i {
    font-size: 30px;
}

a.menu_icon:hover i, button.menu_icon:hover i {
    color: #fff;
}

.pagecontrols .submitdiv a.menu_icon:hover i, .pagecontrols .submitdiv button.menu_icon:hover i {
    color: #FECA40;
}

.repeater-footer {
    height: 30px;
    background-color: #F8F8F8;
    color: #fff;
    margin-top: -10px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
}

.four-column {
    width: 100%;
}

    .four-column .column {
        width: 25%;
    }

    .four-column .gutter {
        width: 24px;
    }

    .four-column .margin-left {
        width: 32px;
    }

    .four-column .margin-right {
        width: 32px;
    }

    .four-column .row {
        height: 360px;
        display: inline-flex;
        width: 100%;
    }

p {
    margin: 3px 5px;
}

.eight-column {
    width: 100%;
}

.twelve-column {
    width: 100%;
}

    .twelve-column .column {
        width: 12.5%;
    }

    .twelve-column .gutter {
        width: 24px;
    }

    .twelve-column .margin-left {
        width: 32px;
    }

    .twelve-column .margin-right {
        width: 32px;
    }

    .twelve-column .row {
        height: 360px;
        display: inline-flex;
        width: 100%;
    }

.repeater {
    margin-bottom: 10px;
}

.searcher {
    margin-bottom: 10px;
}

.textheight {
    height: 21px;
}

.field-label {
    position: absolute;
    top: 13px;
    padding: 7px 0 0 5px;
    transition: all 200ms;
    opacity: .5;
    margin-bottom: .4em;
    z-index: 1;
}

.field-control {
    display: block;
    width: 100%;
    padding: .25rem .375rem;
    background-clip: padding-box;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    /* vertical-align: middle; */
    z-index: 2;
    margin-top: 6px;
}

    .field-control:focus {
        outline: 0;
    }

        .field-control:focus + .field-label,
        .field-control:valid + .field-label {
            font-size: 75%;
            transform: translate3d(0, -100%, 0);
            opacity: 1;
        }

.field-container {
    background-color: #ddd;
    padding: 10px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    position: relative;
    margin-bottom: .75rem;
    display: flex;
    flex: 0 0 auto;
    flex-flow: row wrap;
    align-items: center;
    /*width: 100%;*/
    opacity: 0.4;
}

input {
    background-color: transparent;
    border: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input[type=number] {
    -moz-appearance: textfield;
}

label {
    display: inline-block;
    touch-action: manipulation;
}

.inputfield {
    width: 100%;
    max-width: 480px;
}

.field-input {
    position: relative;
    width: 100%;
}

.popupdiv {
    position: fixed;
    z-index: 2000;
    background-color: #ffffff;
    padding: 5px;
    border: 1px solid black;
    width: calc(80vw);
    height: calc(80vh);
    margin: 0 auto;
    left: 50%;
    margin-left: calc(-40vw);
    top: 50%;
    margin-top: calc(-40vh);
}

    .popupdiv .popupcontent {
        margin-top: 24px;
    }

    .popupdiv .button-holder {
        position: absolute;
        right: 5px;
        z-index: 1000;
    }

        .popupdiv .button-holder i {
            padding: 0;
        }

    .popupdiv .repeatercontrol .scrollable, .popupdiv .multipleselectcontrol .scrollable {
        max-height: calc(80vh - 100px);
    }

    .popupdiv div.filter.repeaterfilter {
        position: absolute;
        top: 28px;
        left: 280px;
    }

div.barcode-message, div.remark-message {
    position: absolute;
    left: 50%;
    margin: 0 auto;
    margin-left: -150px;
    top: 25%;
    width: 300px;
    padding: 20px;
    z-index: 2000;
    border-color: #C3A042;
    background-color: #cfcfcf;
    text-align: center;
    height: fit-content !important;
}

.wordbreak {
    text-align: left;
    overflow-wrap: break-word;
    word-break: break-all;
}

.remark-message .wordbreak {
    word-break: unset;
}

.barcode-button, .remark-close-button, .scanerror-close-button {
    border: 2px;
    border-color: #C3A042;
    margin-top: 5px;
}

.keyboard {
    position: absolute;
    display: none;
}

.inputfield .menu_icon {
    opacity: 0.4;
    filter: alpha(opacity=40);
}

.button-group {
    display: inline-flex;
    width: 90%;
    justify-content: space-between;
}

.fast_forward {
    font-family: fast_forward;
    font-size: 40px;
}

.hide, .remarkbuttoncontents {
    display: none !important;
}

input:focus {
    outline: none;
}

.group input.stateselector {
    color: #b7b7b7;
}

.group input.stateselector ~ .label {
    font-size: 16px;
    display: block;
    top: 5px;
    left: 9px;
}

.stateselect .lookup {
    max-height: fit-content;
}

.default .main {
    padding: 0;
}

.lookup-input {
    width: 100%;
    margin-top: -25px;
    margin-left: 0;
    margin-bottom: 3px;
    z-index: 998;
    position: absolute;
    left: -10000px;
    transition: .3s all;
}

    .lookup-input i.lookup-close {
        z-index: 999;
        right: 3px;
        position: absolute;
        margin-top: -28px;
        font-size: 26px;
    }

.select_show {
    left: 0 !important;
}

.list li:hover {
    background-color: #f3bd68;
    /*opacity: .6;*/
    transition: .2s ease;
}

/* || CHECKBOXES */
/* #region */

input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
    -webkit-transform: scale(2.4);
    transform: scale(2.4);
    background-color: rgba(38, 166, 154, 0.15);
}

input[type=checkbox]:not(:disabled) ~ .lever:active:before,
input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {
    -webkit-transform: scale(2.4);
    transform: scale(2.4);
    background-color: rgba(0, 0, 0, 0.08);
}

.switch input[type=checkbox][disabled] + .lever {
    cursor: default;
    background-color: rgba(0, 0, 0, 0.12);
}

.switch label input[type=checkbox][disabled] + .lever:after,
.switch label input[type=checkbox][disabled]:checked + .lever:after {
    background-color: #949494;
}

.dataTable [type="checkbox"].checkbox.repeater-header-checkbox, .dataTable [type="checkbox"].checkbox.repeater-row-checkbox {
    margin-left: 2px;
}

[type="checkbox"].checkbox {
    margin-left: 15px;
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

/* Remove default checkbox */
[type="checkbox"].leverbox:not(:checked),
[type="checkbox"].leverbox:checked {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

[type="checkbox"].leverbox {
    /* checkbox aspect */
}

    [type="checkbox"].leverbox + span:not(.lever) {
        position: relative;
        padding-left: 35px;
        cursor: pointer;
        display: inline-block;
        height: 25px;
        line-height: 25px;
        font-size: 1rem;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

        [type="checkbox"].leverbox + span:not(.lever):before,
        [type="checkbox"].leverbox:not(.filled-in) + span:not(.lever):after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 18px;
            height: 18px;
            z-index: 0;
            border: 2px solid #5a5a5a;
            border-radius: 1px;
            margin-top: 3px;
            -webkit-transition: .2s;
            transition: .2s;
        }

    [type="checkbox"].leverbox:not(.filled-in) + span:not(.lever):after {
        border: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    [type="checkbox"].leverbox:not(:checked):disabled + span:not(.lever):before {
        border: none;
        background-color: rgba(0, 0, 0, 0.42);
    }

    [type="checkbox"].leverbox.tabbed:focus + span:not(.lever):after {
        -webkit-transform: scale(1);
        transform: scale(1);
        border: 0;
        border-radius: 50%;
        -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
        background-color: rgba(0, 0, 0, 0.1);
    }

    [type="checkbox"].leverbox:checked + span:not(.lever):before {
        top: -4px;
        left: -5px;
        width: 12px;
        height: 22px;
        border-top: 2px solid transparent;
        border-left: 2px solid transparent;
        border-right: 2px solid #26a69a;
        border-bottom: 2px solid #26a69a;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

    [type="checkbox"].leverbox:checked:disabled + span:before {
        border-right: 2px solid rgba(0, 0, 0, 0.42);
        border-bottom: 2px solid rgba(0, 0, 0, 0.42);
    }

    /* Indeterminate checkbox */
    [type="checkbox"].leverbox:indeterminate + span:not(.lever):before {
        top: -11px;
        left: -12px;
        width: 10px;
        height: 22px;
        border-top: none;
        border-left: none;
        border-right: 2px solid #26a69a;
        border-bottom: none;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

    [type="checkbox"].leverbox:indeterminate:disabled + span:not(.lever):before {
        border-right: 2px solid rgba(0, 0, 0, 0.42);
        background-color: transparent;
    }

    [type="checkbox"].leverbox.filled-in + span:not(.lever):after {
        border-radius: 2px;
    }

    [type="checkbox"].leverbox.filled-in + span:not(.lever):before,
    [type="checkbox"].leverbox.filled-in + span:not(.lever):after {
        content: '';
        left: 0;
        position: absolute;
        /* .1s delay is for check animation */
        -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
        transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
        z-index: 1;
    }

    [type="checkbox"].leverbox.filled-in:not(:checked) + span:not(.lever):before {
        width: 0;
        height: 0;
        border: 3px solid transparent;
        left: 6px;
        top: 10px;
        -webkit-transform: rotateZ(37deg);
        transform: rotateZ(37deg);
        -webkit-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

    [type="checkbox"].leverbox.filled-in:not(:checked) + span:not(.lever):after {
        height: 20px;
        width: 20px;
        background-color: transparent;
        border: 2px solid #5a5a5a;
        top: 0px;
        z-index: 0;
    }

    [type="checkbox"].leverbox.filled-in:checked + span:not(.lever):before {
        top: 0;
        left: 1px;
        width: 8px;
        height: 13px;
        border-top: 2px solid transparent;
        border-left: 2px solid transparent;
        border-right: 2px solid #fff;
        border-bottom: 2px solid #fff;
        -webkit-transform: rotateZ(37deg);
        transform: rotateZ(37deg);
        -webkit-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
    }

    [type="checkbox"].leverbox.filled-in:checked + span:not(.lever):after {
        top: 0;
        width: 20px;
        height: 20px;
        border: 2px solid #26a69a;
        background-color: #26a69a;
        z-index: 0;
    }

    [type="checkbox"].leverbox.filled-in.tabbed:focus + span:not(.lever):after {
        border-radius: 2px;
        border-color: #5a5a5a;
        background-color: rgba(0, 0, 0, 0.1);
    }

    [type="checkbox"].leverbox.filled-in.tabbed:checked:focus + span:not(.lever):after {
        border-radius: 2px;
        background-color: #26a69a;
        border-color: #26a69a;
    }

    [type="checkbox"].leverbox.filled-in:disabled:not(:checked) + span:not(.lever):before {
        background-color: transparent;
        border: 2px solid transparent;
    }

    [type="checkbox"].leverbox.filled-in:disabled:not(:checked) + span:not(.lever):after {
        border-color: transparent;
        background-color: #949494;
    }

    [type="checkbox"].leverbox.filled-in:disabled:checked + span:not(.lever):before {
        background-color: transparent;
    }

    [type="checkbox"].leverbox.filled-in:disabled:checked + span:not(.lever):after {
        background-color: #949494;
        border-color: #949494;
    }

/* #endregion */

.productionstables {
    position: absolute;
    left: 5px;
    width: calc(100%-365px);
    height: 85%;
}

.runningproductions {
    position: absolute;
    right: 5px;
    width: 351px;
    height: 85%;
}

.productions, .tables {
    width: 100%;
    height: 50%;
    display: inline-flex;
    overflow-x: auto;
    margin-bottom: 10px;
}

.usedentries, .openentries, .entries, .runningentries {
    height: 34vh;
    border: 1px solid black;
    margin-top: 10px;
    background-color: gainsboro;
    overflow-y: auto;
    list-style: none;
    padding: 5px;
}

.runningentries {
    height: 80vh;
}

.sales-add, .sales-remove, .prod-add, .prod-remove, .wc-add, .wc-remove {
    height: 25px;
}

.salescontrol, .productioncontrol {
    margin-right: 5px;
    width: 351px;
    padding: 10px;
}

.rightscontrol, .rolescontrol {
    margin-left: 3px;
    margin-right: 3px;
    width: 351px;
    padding: 10px;
}

    .rightscontrol .entries, .rolescontrol .entries {
        height: 650px;
    }

.dispcol.rightscontrols, .dispcol.rolescontrols, .dispcol.workcentercontrols {
    justify-content: center;
    margin-top: 15px;
}

a.sale-button:hover i, a.prod-button:hover i {
    color: #FF9C25;
}

.selector {
    background-color: gainsboro;
}

.hideoption {
    visibility: collapse;
    display: none;
}

.selection {
    display: inline-flex;
    justify-content: space-between;
    width: 100%;
}

.centerscreen {
    max-width: 430px;
    min-width: 200px;
    transform: translate(-50%, -50%);
    position: fixed;
    top: 50%;
    left: 50%;
    /*background-color: #FECA40;*/
    padding: 20px;
    /*box-shadow: 5px 5px 5px gray;*/
    text-align: center;
}

.home .two-columns {
    /*transform: translate(-50%, -50%);*/
    position: fixed;
    /*top: 25%;
    left: 50%;*/
    /*background-color: #FECA40;*/
    /*box-shadow: 5px 5px 5px gray;*/
}

.largescreen .two-columns {
    min-width: 430px;
}

.home .three-columns {
    transform: translate(-50%, -50%);
    position: fixed;
    top: 50%;
    left: 50%;
    /*background-color: #FECA40;*/
    /*box-shadow: 5px 5px 5px gray;*/
}

.home .ui-widget-content {
    border: none;
}

/*.home .mobile-menu i:hover {
    color: white;
    transition: .2s ease;
}*/

.ui-button:hover {
    color: white;
    transition: .2s ease;
}

.linkinactive i.material-icons {
    color: gray;
}

.linkinactive {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    opacity: 0.75;
    pointer-events: none;
    /*display: none !important;*/
}

.table-cell .linkinactive {
    -webkit-filter: none;
    filter: none;
    opacity: 1;
    /*display: none !important;*/
}

.switch.linkinactive {
    opacity: 0.4;
}

button.linkinactive {
    opacity: 0.4;
}

.content-pannel {
    position: absolute;
    background-color: #f3bd68;
    font-size: 22px;
    left: -200px;
    border-collapse: separate;
    height: 29px;
}

.table-row.rowactionselected {
    background-color: #f3bd68;
}

.actionbutton {
    cursor: pointer;
    -moz-transition: transform 0.2s;
    -webkit-transition: transform 0.2s;
    transition: transform 0.2s;
    height: 21px;
}

.actionbuttons .table-row {
    height: 30px;
    vertical-align: middle;
    cursor: default;
}

.actionbuttons .table-cell {
    vertical-align: middle;
    height: 30px;
}

.assignpickorders .mainqueue, .assignpickusers .unassigned {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px,1fr));
    grid-template-rows: repeat(auto-fill, minmax(80px,1fr));
    grid-gap: 10px;
    width: 100%;
    height: 360px;
}

.mainqueue .pickorders, .unassigned .pickorders {
    border: dotted;
    width: 200px;
    height: 50px;
}

.pickcontrols, .userassigncontrols {
    margin-top: 10px;
    display: inline-flex;
}

.pickcontrol, .userassigncontrol {
    margin-right: 10px;
    width: 265px;
}

li.entry {
    cursor: pointer;
    cursor: -webkit-grab;
}

.openprod {
    height: 55vh;
    border: 1px solid black;
    margin-top: 10px;
    background-color: gainsboro;
    overflow-y: auto;
    list-style: none;
    padding: 5px;
}

.usedprod {
    height: 25vh;
    border: 1px solid black;
    margin-top: 10px;
    background-color: gainsboro;
    overflow-y: auto;
    list-style: none;
    padding: 5px;
}

.assignwctables .toptable {
    height: calc(60vh - 68px);
}

.assignwctables .bottomtables {
    height: calc(40vh);
    display: inline-flex;
}

.assignwctables .bottomtables .bottomtable {
    margin-right: 5px;
    width: 350px;
}

.assignwctables .toptable .bottombuttongroup {
    top: 60vh;
    height: 0;
    position: absolute;
    z-index: 250;
}

.assignwctables .toptable .multipleselectbuttons {
    display: inline-flex;
    margin-left: 35px;
}

.assignwctables i.arrow_and_edge {
    padding: 5px 0 5px 5px;
}

.assignwctables .toptable .bottombuttongroup .assignmentbutton div {
    z-index: 250;
}

.assignwctables .toptable .bottombuttongroup .multipleselectbuttons {
    display: inline-flex;
}

.assignwctables .bottombar {
    display: inline-flex;
}

.assignwctables .bottomtables .topbuttongroup {
    background-color: transparent;
    width: fit-content;
}

.assignwctables .bottomtables .topbuttongroup .workcenterselector {
    z-index: 300;
}

.assignwctables .bottomtables .topbuttongroup .multipleselectbuttons {
    margin-left: 70px;
    z-index: 300;

}

.assignwctables .toptable .bottombuttongroup .toptablebutton {
    margin-right: 5px;
    width: 350px;
    height: 0;
}

.assignwctables .toptable .bottombuttongroup .toptablebutton div {
    position: relative;
    left: 210px;
    width: 42px;
}

.assignwctables .topbuttongroup .workcenterselector .group {
    margin-top: 8px;
}

.assignwctables .bottomtables .bottomtable .closebutton {
    width: 24px;
    position: fixed;
    margin-top: 10px;
    margin-left: 325px;
    cursor: pointer;
}

.assignwctables .bottomtables .bottomtable .closebutton:hover {
    color: red;
}

.assignwctables .bottombar .addbutton {
    width: 24px;
    margin-top: 10px;
    cursor: pointer;
}

.assignwctables .bottombar .addbutton:hover {
    color: #97CC33;
}

.red {
    background-color: Red;
}

.yellow {
    background-color: #fbcb09;
}

.green {
    background-color: #97cc33;
}

p.red {
    color: red;
    background-color: inherit;
}

p.green, span.green {
    color: #97cc33;
    background-color: inherit;
}


.user .div-center {
    text-align: center;
}

.sidebaritem a {
    text-decoration: none;
    color: #aaaaaa;
}

.footer a.menu_icon i, .footer button.menu_icon i, .footer a.menu_icon i {
    color: #FECA40;
}

.footer a.menu_icon:hover i, .footer button.menu_icon:hover i {
    color: white;
}

/* || MENU */
/* #region */

.user .mobile-menu {
    margin-top: 10px;
}

.Logon nav.menusidebar {
    display: none;
}

nav.menusidebar {
    background-color: #000;
    /* margin-top: 68px; */
    padding-top: 123px;
    padding-left: 20px;
    padding-right: 8px;
    /*height: auto;*/
    min-width: 55px;
    margin-right: 5px;
    /* position: sticky; */
    /* top: 68px; */
    z-index: 1001;
    overflow: auto;
}

    nav.menusidebar.toback {
        z-index: 999;
    }

.menusidebar div.sidebaritem {
    padding-bottom: 7px;
}

.liq-menu-selected i, .liq-menu-selected p, i.liq-menu-selected {
    color: #FECA40;
}

li.liq-menu-item, .menusidebar .sidebaritem {
    color: #aaaaaa;
    list-style-type: none;
    margin-top: 20px;
    font-size: 20px;
}

    li.liq-menu-item.lowlevel {
        margin-top: 0;
        margin-bottom: 10px;
    }

    li.liq-menu-item div {
        display: inline-flex;
        width: 100%;
        justify-content: space-between;
    }

        li.liq-menu-item div.no-spread {
            display: inline-flex;
            width: 100%;
            justify-content: flex-start;
        }

.liq-menu-item p.lowlevel {
    font-size: 16px;
}

.liq-menu-item i.lowlevel {
    font-size: 20px;
}

.liq-menu-item p {
    /* display: inline; */
    margin: 0 0 6px 9px;
}

.liq-menu-item .level0 p {
    margin-left: 17px;
}

.liq-menu.collapse {
    display: none;
}

.liq-menu-item i.collapse-control.before-link {
    text-indent: -25px;
    padding-right: 9px;
}

.liq-menu-item i.collapse-control {
    margin-top: 5px;
}

    .liq-menu-item i.collapse-control:hover, .menusidebar a:hover, a.liq-menu-link:hover {
        color: #FECA40;
        cursor: pointer;
    }

.liq-menu-item.square-bullet p {
    position: relative;
    left: -10px;
}

.liq-menu-item a {
    color: inherit;
    text-decoration: none;
}

    .liq-menu-item a:hover {
        color: #FECA40;
    }

li.liq-menu-item .square-bullet {
    list-style-type: square;
}

ul.liq-menu.liq-menu-top {
    padding-left: 0;
}

ul.liq-menu {
    padding-left: 25px;
}

a.menu_icon.small i {
    font-size: 22px;
}

button.menu_icon.small i {
    font-size: 22px;
}

/* #endregion */

div.scrollable {
    overflow: auto;
    flex: 1 1 auto;
}

div.no-scroll {
    overflow: hidden;
    flex: 1 1 auto;
}

.dispcol .edit {
    width: 21px;
}

.edit .material-icons {
    font-size: 18px;
    line-height: 29px;
    color: #494949;
}

span.edit {
    margin: 0;
}

.dispcol.editval {
    width: 40%;
    justify-content: flex-start;
}

.dispcol.summary {
    justify-content: flex-start;
}

.dispcol.table-cell {
    justify-content: flex-start;
}

/* ||BEGIN SMALL */
/* #region */
.main.small {
    /* padding-top: 68px; */
    overflow-x: hidden;
}

.small .scanned {
    position: absolute;
    top: 0;
    right: 40px;
    z-index: 3;
}

.small .table {
    border: none;
    width: 100%;
    max-width: 1024px;
    margin: auto;
}

/*.small .fixed-header .ls-widget-header {
    max-width: 1024px;
}

.fixed-header .ls-widget-header.spacer120 {
    top: 120px;
}
*/
.small .div-center {
    border-left-color: #c7c7c7;
    border-right-color: #c7c7c7;
}

.small.table {
    border: none;
}

.small .table-cell p {
    display: block;
}

.small .table-cell .ls-button {
    margin: 0;
}

.small .table-cell .material-icons {
    font-size: 32px !important;
}

.small .table-cell p, .small .table-cell span {
    margin: 0;
    font-size: 16px;
}

.small .table-cell {
    padding: 10px 10px;
}
/* #endregion */

.align-right {
    text-align: right;
    padding-right: 10px;
}

.circlenumber {
    background: #888888;
    -moz-border-radius: 0.8em;
    -webkit-border-radius: 0.8em;
    border-radius: 0.8em;
    color: #ffffff;
    display: inline-block;
    font-weight: bold;
    line-height: 28px;
    margin-right: 5px;
    padding-right: 1px;
    text-align: center;
    width: 28px;
}

.salescontrols {
    display: inline-flex;
}

.footerbutton {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    cursor: pointer;
    outline: inherit;
}

.button {
    font: bold 11px Arial;
    text-decoration: none;
    background-color: #EEEEEE;
    color: #333333;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    margin-bottom: 5px;
}

i.touch {
    font-size: 26px !important;
}

.no-click {
    pointer-events: none !important;
}

.logiq-submitloader {
    background: rgba(0, 0, 0, 0.2) url('data:image/gif;base64,R0lGODlhIAAgAPMLALy8vMbGxoSEhLa2tpqamjY2NlZWVtjY2OTk5AQEBB4eHv///wAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCgALACwAAAAAIAAgAEAE5nDJSSlJpOo6SsmToSiChgwTAgzsIQlwDG/0wt4DgEjn4E6Blo0lue1qlZECJUk4JysfckLwMKeLH/YgxEZzx1o0fKMEr9NBieJMmInYSWG0bhdZYZrB4zFokTg6cYNDgXmEFX8aZywAU1wpX4oVUT9lEpWECIorjohTCgkKiYc1CCMGbE88jYQCIwUTdlmtiANKO3ZcAwEUu2FVfUwBCiA1jLwaA3t8cbuTJmufFQEEMjOEODcA1dfS04+Dz6ZfnljIvRO7YBMDpbvpEgcrpRQ9TJe75s61hSmXcVjE8+erniZBcSIAACH5BAUKAAsALAAAAAAYABcAAARycMlJqxo161lUqQKxiZRiUkWSaMVXnhKhKmwLTCYtKaqgES0DDiaYbRaGFim3OKgSpE3LxTSoXE2B4IbCUmSBCUCrPUgOBcyRMiCHEOvNwe2Lb8aCsP2o3vvjCAADg4R/C4KEhX+BiYOGj5CRkpNHensRACH5BAUKAAsALAEAAAAdAA4AAARycMlJ5yg1671MMdnATQdQFShlKMooCYI4oZg0sPUIC8ecSgWWSwLY+XK4oYQAMy1oCwRLIZsgNgfjMyVggSaCRIKAGAB6E2ZM01oqxAneYA64RgWBUaAAT9QCc3N5Sn1UFAgAgU4uYXFYc2hDBpFYShwRACH5BAUKAAsALAcAAAAZABEAAARpcMm5ggg0600Eyd+2IEcmnFlRiMOATadAqeLSDgiMSoYaaocWQCdbEFSG2gLQKi1iEtVKibhJoAtaRqEYUAJNzaDgHHMVYmfNcFYklZv2lOKFG7l2uCCX7/s1CYGCCj99gocJfwuICYQRACH5BAUKAAsALA4AAAASABgAAARl8JCzqr14ELwA5QshXoQggOFYHeYJilvVAihcAS2axu33jgNTrEIoFFABAcJiMBaGIIrzqKtMDbSq9anter8VhXhM1Y3PiipaURiAvQJfV5BIuLr1ugKKLOQTZVUECnl3WnQJbhEAIfkEBQoACwAsDgAAABIAHgAABIAQAbSqvRgMgAO+QwgSxFeFw0WmJmoNpNeKS0CW5uIud36KNgKrAhAIDqbD8GA0cnwIQlOA802PPkvAmcUMu+BsYUw2fD/kdEGsNoTfFsqboFDA6/XCOWnAK9wmAgkyAwV4JgYJCWsXhiYIiglVXYIJdm8KigJvA5FwBYpyYVQmEQAh+QQFCgALACwPAAEAEQAfAAAEe3DJuQ6iGIcxskcc4GUAd4zUEaIUN1xsxQUpB1P3gpQmu7k0lGsAyHlUg1NMolw6PYKolBCESq+oa5T67DoHhQLBGQ4bnuXCiKCgGMpjikChOE/G6kViL6ErOh57CRN0eRmCEwV0I4iEi4d8EwaPGI0tHgoJbU4ECXFLEQAh+QQFCgALACwIAA4AGAASAAAEbHDJSesaOANk+8wg4Hkgto1oig4qGgiC2FpwfcwUQtQCMQ+F2+LAky0CCUGnUKgAYMJFIZEwLBRYCbM5IlATHKxCQmBaPQqq8pqVGJg+GnUsEVO2nXQizqZPmB1UXHVtE3wVOxUFCoM4H34qEQAh+QQFCgALACwCABIAHQAOAAAEeHDJSatd59JjtD3DkF1CkggeBYQDgFCDYpopFbBDIBVzUuiegOC1QKxCh5JJQZAcmJaBQNCcHFYIggk1MSgUqIJYMhWMLMRJ7LsbLwDl2qTAbhcmhClAvvje7VZxNXQKA3NuEnlcKV8dh38TAGcehhUGBY58cpA1EQAh+QQFCgALACwAAA8AGQARAAAEZ5CoROu6OOtbe9pgJnlfaJ7oiQgpqihECxbvK2dGrRjoMWy1wu8i3PgGgczApikULoLoZUBFoJzPRZS1OAJOBmdMK70AqIcQwcmDlhcI6nCWdXMvAWrIqdlqDlZqGgQCYzcaAQJJGxEAIfkEBQoACwAsAQAIABEAGAAABFxwpCSWvfiKmRTJ4FJwSRGEGKGQaLZRbXZUcW3feK7vKFEUNoDh96sRgYeW72e4IAQn0O9zIQgEg8Vgi5pdLdts6CoAgLkgAPkSHl+TZ7ELi2mDDnILYGC+IQAIEQAh+QQFCgALACwAAAIADgAdAAAEcnDJuYigeKZUMt7J4E3CpoyTsl0oAR5pRxWbkSpKIS5BwkoGHM4A8wwKwhNqgSMsF4jncmAoWK+Zq1ZGoW650vAOBRAIAqODee2xrAlRTNlMQEsG8YVaAKAEBgNFHgiAYx4AgIIZB4B9ZIB5RgN2KAiKEQA7') /*../content/slb/Images/ajax-loader.gif*/ no-repeat center;
}

.logiq-submitdarken {
    background-color: rgba(0, 0, 0, 0.2);
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 998;
    transition: .1s all;
}

/* || CARD */
/*#region*/

div.gutter {
    background-color: #ddd;
}

div.gutter-horizontal {
    cursor: col-resize;
}

div.gutter-vertical {
    cursor: row-resize;
}

.cardcontainer {
    -moz-transition: all .1s;
    -o-transition: all .1s;
    -webkit-transition: all .1s;
    transition: all .1s;
    position: relative;
    /*background-color: lightgray;*/
}

    .cardcontainer .card {
        overflow: auto;
        height: -moz-available; /* WebKit-based browsers will ignore this. */
        height: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
        height: fill-available;
        /*max-height: -moz-available;*/ /* WebKit-based browsers will ignore this. */
        /*max-height: -webkit-fill-available;*/ /* Mozilla-based browsers will ignore this. */
        /*max-height: fill-available;*/
        /*padding-left: 5px;
        padding-right: 5px;*/
        position: absolute;
        width: 100%;
        display: flex;
        flex-direction: column;
        padding: 10px 0 3px 3px
    }

    .cardcontainer.fullscreen {
        position: absolute;
        z-index: 53;
        height: calc(100vh - 70px) !important;
        max-height: calc(100vh - 70px) !important;
        width: calc(100vw - 45px) !important;
        background-color: #fff;
        /*left: 58px;*/
        top: 70px;
    }

    .cardcontainer .card-buttons {
        position: absolute;
        right: 30px;
        z-index: 52;
    }

        .cardcontainer .card-buttons .button-holder {
            display: none;
        }

        .cardcontainer .card-buttons i {
            display: inline;
            cursor: pointer;
            font-size: 28px;
        }

div.cardcontainer.logiq-submitdarken {
    position: relative;
}

div.cardsholder {
    width: inherit;
    height: calc(100vh - 70px);
    max-height: calc(100vh - 70px);
    display: flex;
}

div.cardcontainer div.cardsholder {
    width: inherit;
    height: inherit;
    max-height: inherit;
}

div.cardsholder.split_vertical {
    display: block;
}

div.cardsholder.split_vertical > div.split_horizontal{
    display: flex;
}

div.cardcontainer {
    height: 100%;
}

p.card-header {
    background-color: #eee;
    color: #3391cc;
    line-height: 36px;
    padding-left: 10px;
    padding-top: 4px;
    margin: 0;
    margin-bottom: 5px;
}

.card-buttons .button-holder {
    background: rgb(238, 238, 238);
}

.card-buttons.wide .button-holder {
    width: 95px;
}

.button-holder .autorefresh-control {
    height: 45px;
}

.button-holder span {
    font-size: 12px;
    margin: 0;
}

.button-holder span.refresh-handle {
    margin-left: 5px;
}

.button-holder .checkbox {
    margin-left: 5px;
}

.refresh-slider.ui-widget.ui-widget-content {
    border: 1px solid #b7b7b7;
    width: 79px;
    margin-left: 8px;
}

.refresh-slider .ui-slider-handle {
    background: #b7b7b7;
    font-weight: normal;
    color: #b7b7b7;
    top: -0.1em;
}

.refresh-slider .ui-state-hover {
    border: 2px solid #a1a1a1;
}


.ui-tabs-panel {
    height: 695.94px;
}

div.card55 {
    width: 55%;
}

div.card45 {
    width: calc(45% - 1px);
}

div.card34 {
    width: calc(34% - 3px);
}

div.card33 {
    width: calc(33% - 3px);
}

div.cardcontainer.fullheightcard {
    height: calc(100% - 5px);
}

div.card20 {
    height: calc(20% - 3px);
}

div.cardcontainer.card30 {
    height: calc(30% - 3px);
}

div.cardcontainer.card40 {
    height: calc(40% - 3px);
}

div.cardcontainer.card70 {
    height: calc(70% - 3px);
}

div.cardcontainer.topcardblock {
    height: calc(50% - 5px);
}

div.cardcontainer.topthirdcardblock {
    height: calc(34% - 6px);
}

div.cardcontainer.bottomcardblock {
    height: calc(50% - 6px);
}

div.cardcontainer.bottomthirdcardblock {
    height: calc(33% - 10px);
}

div.card50left {
    width: 50%;
}

div.card66left {
    width: 66%;
}

div.card34left {
    width: 34%;
}

div.card50right {
    width: calc(50% - 1px);
}

div.card66right {
    width: calc(66% - 1px);
}

div.card34right {
    width: calc(34% - 1px);
}
/*#endregion*/

.wide .display-buttons {
    width: 95px;
}

.display-buttons {
    height: 8px;
    width: 60px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #b7b7b7;
    margin: 0px;
    cursor: pointer;
    float: right;
}

.ui-datepicker {
    z-index: 52 !important;
}

button.ui-datepicker-current {
    display: none;
}

.orange {
    background-color: #FECA40;
}

/*|| RESPONSIVE */
/* #region */
@media screen and (max-width: 230px) {
    .header {
        height: 25px;
    }

    .two-columns {
        min-width: 210px;
    }

        .two-columns div {
            padding-left: 3px;
            padding-right: 3px;
        }

    .home .mobile-menu {
        margin-left: 0;
        margin-right: 0;
    }

    .menu .mobile-menu {
        margin-bottom: 2px;
    }

        .menu .mobile-menu .material-icons {
            font-size: 15px;
            line-height: 15px;
            width: 10%;
        }

            .menu .mobile-menu .material-icons.large {
                font-size: 17px;
            }

        .menu .mobile-menu p {
            font-size: 14px;
            line-height: 15px;
            padding-top: 3px;
        }

    nav.menu > a {
        padding: 8px;
    }

    nav.menu {
        margin-top: 24px;
    }

    .group {
        height: 60px;
    }

        .group input {
            font-size: 12px;
        }

        .group label {
            top: 17px;
            font-size: 16px;
        }

    input:focus ~ label, input.used ~ label {
        font-size: 11px;
    }

    .logo2 {
        display: none;
    }

    .header h1 {
        font-size: 12px;
    }

    a.menu_icon i, button.menu_icon i {
        font-size: 25px;
    }

    .footer {
        height: 25px;
    }

    .table {
        width: 176px;
    }

    .lookup .Fat {
        font-size: 12px;
    }

    div.lookup {
        max-height: 130px;
    }

    div#ui-datepicker-div {
        font-size: 12px;
    }
}

@media screen and (max-width: 360px) {
    nav.menu {
        width: 85%;
        left: -100%;
    }

    .tdwidth {
        width: auto;
    }

    div.lookup {
        max-height: 200px;
    }

    div#ui-datepicker-div {
        font-size: 14px;
    }

    .message {
        min-width: 200px;
        max-height: 200px;
        top: 50%;
        transform: translate(-50%, -50%);
        font-size: 13px;
    }

        .message .errormessage {
            max-height: 145px;
        }

    .user span {
        max-width: 60%;
        word-wrap: break-word;
    }
    /*.th {
        display: inline-block;
    }
    .table-row {
        display: inline-block;
        height: 100%;
    }
    .table-cell {
        display: block;
        line-height: 23px;
    }

    div.table {
        width: 340px;
    }*/
}

@media screen and (max-width: 425px) {
    .header h1 {
        font-size: 16px;
    }

    .userinfo {
        font-size: 14px;
    }

    nav.menu {
        width: 295px;
        left: -295px;
    }
}

@media screen and (max-width: 480px) {
    .input-info {
        font-size: 12px;
    }

    div.filter {
        width: 100%;
        display: block;
    }

    .table-cell.no-resize {
        max-width: 250px !important;
    }

    .table-cell {
        min-width: 75px;
        max-width: 125px;
    }

        /*     div.table-cell span {
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    div.table-cell p {
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
 */

        .table-cell span {
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }

        .table-cell p {
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }

        .table-cell.dispcol span {
            min-width: 0;
        }
}

@media screen and (max-height: 645px), (max-width: 480px) {
    div.lookup {
        position: fixed !important;
        min-height: calc(100vh - 100px) !important;
        max-height: calc(100vh - 100px) !important;
        top: 100px !important;
    }

    .lookup.fixed-header .ls-widget-header {
        max-width: 480px;
        margin-top: 100px;
        top: 0;
    }

    div.lookup-input input {
        padding-right: 5px;
    }

    div.lookup-input i {
        display: none;
    }

    .lookup .header {
        top: 0;
        height: 75px;
        display: block;
    }

    .lookup-input {
        position: fixed;
        top: 68px;
        margin-top: 0;
        width: 98%;
        z-index: 901;
    }
}

@media screen and (max-width: 725px) {
    .footer {
        height: 60px;
    }

    nav.menu {
        height: calc(100vh - 68px);
    }
}

@media screen and (max-width: 767px) {
    input[type="text"],
    input[type="number"],
    input[type="email"],
    input[type="tel"],
    input[type="password"] {
        font-size: 16px;
    }
}

/*@media screen and (max-height: 900px) and (min-aspect-ratio: 8/5) {
    div.div-center {
        display: inline-flex;
        margin: auto;
        max-width: none;
    }
    div.widescreengroup {
        min-width: 430px;
}*/

@media screen and (max-width: 1060px) {
    div.table-cell p {
        display: block;
        min-width: 0;
    }
}

/* #endregion */