﻿@font-face {
    font-family: 'Manrope';
    src: url('../fonts/manrope/Manrope-Regular.ttf') format("truetype-variations");
}

@font-face {
    font-family: text-security-disc;
    src: url('../fonts/text-security-disc.woff');
}


html, body {
    height: 100%;
}

body {
    color: #000;
}

body,
.bootstrap-dialog {
    font-size: 13px;
}

body,
.ui-widget,
.ag-theme-balham .ag-header,
.ag-theme-balham.ag-dnd-ghost,
.ag-theme-balham {
    font-family: 'Manrope', Arial, sans-serif;
}

.ag-bg-danger {
    background-color: #f2dede !important;
}

.ag-bg-warning {
    background-color: #fcf8e3 !important;
}

.ag-bg-info {
    background-color: #d9edf7 !important;
}

.bold {
    font-weight: bold;
}

.no-bold {
    font-weight: 400;
}

a:focus {
    outline: none;
}

.d-flex {
    display: flex;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-column {
    flex-direction: column;
}

.flex-row {
    flex-direction: row;
}

.align-items-end {
    align-items: flex-end;
}

.row-gap-1 {
    row-gap: 5px;
}

.row-gap {
    flex-wrap: wrap;
    gap: 10px;
}

.col-right {
    flex: 1;
    text-align: right;
}

input {
    -webkit-appearance: none;
}

    input[type=checkbox] {
        -webkit-appearance: checkbox;
    }

    input[type=radio] {
        -webkit-appearance: radio;
    }

/* Navbar */
#GlobalSearch {
    position: relative;
}

#tbGlobalSearch {
    border: 0;
    font-size: 12px;
    line-height: 28px;
    padding-right: 25px;
    padding-left: 25px;
    width: 380px;
    position: relative;
    border-radius: 0px;
}

.searchsubtext {
    display: block;
    font-size: 10px;
    line-height: 10px;
    padding-bottom: 5px;
}

#searchitems {
}

    #searchitems li {
        border-bottom: 1px solid #b7e4ff; /*todo*/
    }

        #searchitems li a {
            display: block;
        }

#search-recent {
    padding-top: 5px;
    display: none;
}


textarea {
    resize: none;
}


.btn-primary {
    outline: none;
    font-weight: bold;
}


#close-button {
    position: absolute;
    right: 25px;
    top: 12px;
    color: #fff;
    cursor: pointer;
}

.dropzone.dz-clickable .fa-trash-alt {
    cursor: pointer;
}

#search-icon {
    position: absolute;
    left: 12px;
    top: 14px;
    color: #fff;
    z-index: 100;
}

#lihelp0 span {
    float: right;
    color: black;
    font-weight: bold;
    margin-right: 5%;
}

.dropzone .dz-preview .dz-details .dz-filename {
    cursor: pointer;
}

    .dropzone .dz-preview .dz-details .dz-filename .attachName {
        cursor: pointer;
    }

.dropzone:not(#formAttachments) .dz-preview .dz-details .dz-filename .attachName {
    cursor: pointer;
    display: none;
}

.dropzone:not(#formAttachments) .dz-preview .dz-details {
    top:-20px;
}

.dropzone .dz-preview:hover .dz-image img {
    filter: unset;
    -webkit-filter: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
    transform: unset;
}

.dropzone:not(#formAttachments) .dz-preview .dz-remove { /*kat 21/6/22*/
    position: absolute;
    width: auto;
    padding: 4px;
    border-radius: 3px;
    white-space: nowrap;
    /*background-color: #f4f6f9;*/
    font-size: 15px;
    color: #000;
    border: 1px #bbb solid;
    transform: none;
    z-index: 10;
    bottom: 5px;
    right: 5px;
    margin: 0px;
}
    .dropzone:not(#formAttachments) .dz-preview .dz-remove:hover {
        background-color: #337ad1;
        border-color: #337ad1;
        color: #fff;
        text-decoration: none;
    }
    /*#setupLogo.dropzone:not(#formAttachments) .dz-preview .dz-remove {*/ /*kat 5/7/22*/
    /*transform: translate(calc(-100% + 15px), 15px);
}*/
    .dropzone:not(#formAttachments) .dz-preview .dz-remove i {
        margin-right: 5px;
    }

.dropzone:not(#formAttachments) .dz-preview {
    width: 100%;
    margin: 0px;
    padding: 5px;
    min-height: 176px;
    text-align-last: center;
}

#uploadtest .dz-image::before {
    font-family: "Font Awesome 6 Pro";
    font-weight: 200;
    background: none;
    font-size: 115px;
    content: "\f570";
    opacity: 0.2;
}

.NotifBox {
    position: fixed;
    /*top: 80%;*/
    animation-name: NotifEngineInit;
    animation-fill-mode: forwards;
    animation-duration: 0.25s;
    width: 15%;
    height: 10%;
    background-color: #fff;
    color: white;
    overflow: hidden;
    z-index: 2000;
    border-radius: 3px;
}


    .NotifBox p {
        position: absolute;
        top: 4px;
        left: 4px;
        right: 4px;
        bottom: 4px;
        overflow: hidden;
        margin: 0px;
        padding: 4px 2px;
        background-color: #fff;
        border-radius: inherit;
    }

    .NotifBox.info {
        color: #222;
    }

    .NotifBox p > i {
        margin-right: 5px;
    }

    .NotifBox button {
        position: absolute;
        right: 2px;
        top: -3px;
        margin: 0%;
        background-color: transparent;
        /*color: white;*/
        border: none;
        cursor: pointer;
        height: 30px;
        width: 30px;
        outline: none;
        max-width: 20%;
    }

@keyframes NotifEngineInit {
    from {
        width: 4%;
        left: 96%;
    }

    to {
        width: 18%;
        left: 82%;
    }
}

.navbar-default .navbar-nav > li > a.current-profile {
    padding-top: 6px;
    padding-bottom: 8px;
    text-align: right;
}

.current-user {
    font-size: 13px;
    display: block;
    line-height: 14px;
    min-width: 119px;
}


.current-station {
    font-size: 11px;
    display: block;
    line-height: 12px;
    text-transform: uppercase;
}

.form-group, .filterRow .wheels-combobox-input { /*21/7/22 kat*/
    margin-bottom: 5px;
}


.form-control {
    border-radius: 0;
    box-shadow: none;
    font-size: 12px;
    height: 27px;
    padding: 4px 4px;
}

    .form-control:focus {
        box-shadow: none;
    }



#system-message {
    display: none;
    height: 25px;
    color: #fff;
    font-size: 12px;
    line-height: 25px;
    padding-left: 20px;
    z-index: 150;
}

.navbar {
    min-height: 40px;
    margin: 0;
    z-index: 100;
    font-size: 13px;
}

    .navbar > .container-fluid {
        padding: 0;
    }

.navbar-form {
    margin-top: 6px;
    margin-bottom: 0;
}

.navbar-default {
    box-shadow: none;
    height: 40px;
    border: 0;
    background-image: none;
    border-radius: 0;
}

    .navbar-default .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
        height: 40px;
        overflow: hidden; /*6/7/22 kat*/
        text-overflow: ellipsis; /*6/7/22 kat*/
        white-space: nowrap; /*6/7/22 kat*/
        min-width: 48px;
    }

        .navbar-default .navbar-nav > li > a.brand {
            padding-top: 0;
            padding-bottom: 0;
            padding-left: 4px;
            padding-right: 4px;
        }

        .navbar-default .navbar-nav > li > a > .fal {
            color: #fff;
        }

    .navbar-default .navbar-nav > .active > a {
        box-shadow: none;
        text-shadow: none;
        background-image: none;
    }

.separated {
    border-right: 1px solid #808080;
}

.dropdown-menu .divider {
    margin-top: 2px;
    margin-bottom: 2px;
}

.dropdown-menu > li > a {
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 30px;
}

    .dropdown-menu > li > a:hover {
        background-image: none;
    }


.dropdown-submenu {
    position: relative;
}

    .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -5px;
        margin-left: -1px;
    }

    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }

.dropdown-menu > li > a {
    padding-right: 32px;
}

.dropdown-submenu > a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #000;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover > a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

    .dropdown-submenu.pull-left > .dropdown-menu {
        left: -100%;
        margin-left: 10px;
    }

#setupTabs {
    width: 13%;
    float: left;
    border-right: 1px solid;
    font-size: 14px;
    margin-right: 3%;
    margin-top: 2%;
}

    #setupTabs button {
        display: none;
    }

    #setupTabs p {
        margin: 0;
        line-height: 30px;
    }

.preference_option:hover {
    background-color: blue;
    color: white;
    cursor: pointer;
}

.preference_title {
    font-weight: bold;
}

.selected_preference_option {
    background-color: dodgerblue;
    color: white;
    cursor: pointer;
}

.hiddenOption {
    display: none;
}

#preferenceMenuButton {
    display: none;
    position: fixed;
    left: 0;
    margin-left: 200px;
    top: 77px;
    z-index: 1;
    height: 40px;
    width: 40px;
    font-size: 15px;
    border: 1px solid grey;
    cursor: pointer;
    outline: none;
}

.setupPrefContainer {
    margin-top: 2%;
}

@media (max-width: 979px) {
    #setupTabs {
        width: 200px;
        float: left;
        border-right: 1px solid;
        font-size: 14px;
        margin-right: 3%;
        margin-top: 0;
        position: fixed;
        background-color: #f4f6f9;
        z-index: 1;
        overflow-y: auto;
        height: calc(100% - 40px);
        top: 40px;
        left: 0;
        padding-left: 12px;
    }

    #preferenceMenuButton {
        display: block;
        position: fixed;
        left: 0;
        margin-left: 200px;
        top: 77px;
        z-index: 1;
        height: 40px;
        width: 40px;
        font-size: 15px;
        border: 1px solid grey;
        cursor: pointer;
        outline: none;
    }

    .setupPrefContainer {
        margin-top: 10%;
    }
}

.navbar .fal {
    font-size: 18px;
}

.dropdown-large {
    font-size: 18px;
    line-height: 25px;
}

.navbar-collapse {
    padding-left: 0;
}

.dropdown-menu-large {
    transition: all 0.2s;
    padding: 10px;
    line-height: 25px;
    width: 462px;
}


    .dropdown-menu-large li {
    }

    .dropdown-menu-large > a {
        float: left;
        margin-right: 10px;
        font-size: 10px;
        padding-top: 3px;
        text-align: center;
        padding-bottom: 3px;
        line-height: 20px;
        width: 80px;
    }

        .dropdown-menu-large > a:last-child {
            margin-right: 0px;
        }

        .dropdown-menu-large > a .fa, 
        .dropdown-menu-large > a img {
            display: block;
            text-align: center;
            font-size: 20px;
        }

            .dropdown-menu-large > a img{
                margin: auto;
            }

            .dropdown-menu-large > a:hover {
                text-decoration: none;
            }

.dropdown-menu {
    font-size: 13px;
    border-radius: 0;
    border: 0;
    /*top: 40px;*/
}

#sidepane {
    display: none;
    /*position: absolute;*/ /*3/8/22 kat*/
    position: fixed; /*3/8/22 kat*/
    right: 0;
    top: 40px;
    background-color: #fff;
    width: 350px;
    height: calc(100vh - 40px); /*3/8/22 kat*/
    box-shadow: 0 5px 15px 2px #0000004d;
    padding-left: 0;
    /*padding-right: 15px;*/
    z-index: 101; /*16/8/22 kat*/
}

#sidepane-body {
    height: calc(100% - 40px); /*3/8/22 kat*/
}


#sidepane-content {
    border: 0;
    width: 100%;
    height: 100%;
}

#sidepane-title {
    color: #252525;
    font-size: 16px;
    font-weight: 200;
    line-height: 35px;
    padding: 0 0 0 15px;
    margin: 0;
}

#sidepane-close {
    position: absolute;
    top: 0px;
    right: 0px;
    color: #252525;
    font-size: 15px;
    cursor: pointer;
    padding: 5px 10px;
}

    #sidepane-close:hover {
        background-color: #eee;
    }


.form-group label {
    font-weight: normal;
    color: #252525;
    margin-bottom: 2px;
}

#historyBox {
    display: none;
    position: absolute;
    z-index: 1000;
    padding: 10px;
    box-shadow: #0000004d 0px 5px 15px 2px;
    width: 350px;
    font-size: 12px;
    outline: none;
    transform: translateX(calc(-100% + 48px));
}

    #historyBox ul {
        list-style: none;
        padding: 0;
        padding-top: 10px;
        padding-bottom: 10px;
    }

        #historyBox ul li a {
            font-size: 12px;
        }

#searchbox {
    display: none;
    position: absolute;
    z-index: 1000;
    padding: 10px;
    box-shadow: #0000004d 0px 5px 15px 2px;
    width: 350px;
    font-size: 12px;
}

@media (min-width: 979px) {

    ul.nav li.dropdown:hover > ul.dropdown-menu {
        display: block;
    }

    ul.nav li.dropdown:hover > .dropdown-menu-large {
        display: block;
    }
}


.myprogress {
    width: 40px;
    height: 40px;
    display: block;
    padding-top: 10px;
    text-align: center;
}

    .myprogress > div {
        display: none;
        width: 10px;
        height: 10px;
        --border-radius: 100%;
        -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
        animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    }

    .myprogress .bounce1 {
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
    }

    .myprogress .bounce2 {
        -webkit-animation-delay: -0.16s;
        animation-delay: -0.16s;
    }

.progress-hidden {
    display: none;
}

@-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0)
    }

    40% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    40% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
    }
}
/* New progress bar */
#progressContainer {
    position: absolute;
    width: 100%;
    height: 0;
    background: #fff;
    top: 0;
    left: 0;
    z-index: 90;
    display: none;
    transition: opacity 0.2s;
}



/* End new progress bar */
.bootstrap-dialog .modal-header,
.modal-content {
    border-radius: 0;
}

.modal-footer {
    text-align: left;
}

#notescounter {
    position: absolute;
    text-align: right;
    right: 5px;
    top: 3px;
    font-size: 10px;
}

.content-area {
    height: calc(100% - 73px);
    width: 100%;
    position: relative;
    /*background-color: #f4f6f9;*/
    font-size: 12px;
    padding-top: 6px;
}

.full-width {
    width: 100%;
}

    .full-width > input.form-control {
        width: 100%;
    }

.full-height {
    height: 100%;
    position: relative;
}



/* dialogs */
.wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition.charges-dialog .modal-dialog {
    width: 500px;
}

@media only screen and (min-width: 501px) {
    .middleTopPosition.wheelsModalWindow.charges-dialog .modal-content {
        height: auto;
    }

    .middleTopPosition.wheelsModalWindow.charges-dialog .modal-body {
        height: 100%;
    }
}

.ag-theme-balham {
    font-size: 12px;
}


    .ag-theme-balham .ag-side-bar {
        border-right: 0;
    }

    .ag-theme-balham .ag-side-buttons {
        border-right: 1px solid #bbb;
    }

    .ag-theme-balham .ag-status-bar {
        border: 0;
    }

    .ag-theme-balham .ag-row {
        border: 0;
    }


    .ag-theme-balham .ag-icon-asc,
    .ag-theme-balham .ag-icon-desc {
        position: absolute;
        top: 0px;
        right: 2px;
    }

.ag-cell-not-inline-editing {
    /*background-color: #003366;*/
}

.ag-header-group-text {
    text-align: center;
    width: 100%;
}




.nomargin {
    margin: 0;
}

#toolbar, .toolbar-inline {
    font-size: 12px;
    width: 100%;
    display: block;
    list-style-type: none;
    position: relative;
    /*padding-left: 13px;*/
}

    /*#toolbar li {
    margin-right: 2px;
}*/

    #toolbar .form-control,
    #toolbar .form-group,
    .toolbar-inline .form-control,
    .toolbar-inline .form-group {
        margin-bottom: 0;
    }

/*#toolbar {
    height: 33px;*/ /* 2022-01-06 change */
/*}*/

@media(max-width: 767px) {
    /*#toolbar {
        height: auto;
    }*/
}

@media(min-width: 768px) and (max-width: 1025px) {
    /*#toolbar {
        min-height: 50px;
        height: auto;
    }*/
}

.toolbar-inline {
    margin-top: 5px;
    margin-bottom: 5px;
}

.workhours .inline-group .toolbar-inline a i {
    margin-left: -10%;
}

.workhours .inline-group .toolbar-inline a span {
    margin-left: 10%;
}

/*.gridtoolbar {
    margin-top: -5px;
    
}*/

#toolbar li {
    /*padding: 5px 0 0 0;*/
    padding: 0;
}

#toolbar .list-inline,
.toolbar-inline .list-inline {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 0;
    min-height: 29px;
}

.list-inline > li {
    padding-left: 0;
    padding-right: 0;
    margin: 0;
}

#toolbar .LargeSize {
    margin-right: 4px;
}

#toolbar .labelNone {
    margin-left: 0;
}

.separator {
    /*top: 6px;
    width: 4px;
    height: 24px;
    */
    /*opacity: 0.3;*/
    display: block;
    background-color: #bbb;
    width: 1px;
    height: 25px;
    line-height: 26px;
    margin-right: 4px;
}

#toolbar a,
.toolbar-inline a {
    display: inline-block;
    padding: 3px 10px;
    line-height: 20px;
    text-decoration: none;
    border-radius: 3px;
    border: 1px solid #bbb;
    margin-top: 3px; /* 2022-01-06  change */
}

#toolbar li a,
.toolbar-inline a {
    margin-right: 4px;
}

/*@media (max-width: 767px) {  /*21/7/22 kat
    #toolbar .list-inline {
        margin-top: 35px;
    }

    #toolbar li a,
    .toolbar-inline a {
        margin-bottom: 10px;
    }
}*/


.entity-content .toolbar-inline a {
    margin-top: 0px;
}

/*.entity-content div.toolbar-inline > div:not(.clearfix) {
    padding-top:5px;
}

.entity-content .toolbar-inline > a {
    display:inline-block;
}*/

#toolbar a.toolbarHidden {
    display: none;
}

#toolbar a.noClick {
    opacity: 0.7;
    pointer-events: none;
}

.toolbar-inline a {
    color: #252525;
}

fieldset.field-group > div.toolbar-inline:not(:first-child) {
    margin-top:0px;
}

#toolbar a > .caption,
.toolbar-inline a > .caption {
    margin-left: 5px;
}

#toolbar a > .fal,
.toolbar-inline a > .fal {
    font-size: 13px;
}

#toolbar a:hover,
.toolbar-inline a:hover {
    /*background-color: #55b3ff;*/
    text-decoration: none;
}

#toolbar ul.dropdown-menu {
    padding: 0px;
}

    #toolbar ul.dropdown-menu > li {
        padding-top: 0px;
    }

        #toolbar ul.dropdown-menu > li > a {
            width: 100%;
            border: none;
            border-radius: 0px;
            padding: 5px 15px;
        }

            #toolbar ul.dropdown-menu > li > a:hover {
                color: #fff;
            }

#page-title {
    padding: 4px 20px 5px 20px; /*21/7/22 kat*/
    position: absolute;
    top: 0;
    right: 0;
    font-size: 14px;
    min-width: 150px;
    text-align: center;
    z-index: 1;
}

    #page-title:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 36px;
        height: 100%;
        min-height: 29px; /*21/7/22 kat*/
        background-color: #ed1c24;
        -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
        transform-origin: 100% 100%;
        -webkit-transform: skewX(30deg);
        -ms-transform: skewX(30deg);
        transform: skewX(30deg);
    }

/*@media(min-width: 768px) and (max-width: 1025px) {   /*21/7/22 kat
    #page-title {
        padding: 16px 20px 15px 30px;
    }
}*/

fieldset {
    width: 405px;
    margin-top: 10px;
    max-width: 100%;
}

.colcontainer-double fieldset {
    width: 840px;
}

fieldset > legend{
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 10px;
    padding-bottom: 3px;
    border-bottom-color: #bbb;
    color: #444;
}

@media only screen (max-device-width: 1025px) {
    fieldset > legend {
        font-size: 16px;
    }
}

.col-sm-8.gridArea.custBoot {
    width: calc(100% - 465px);
}

.col-sm-4.lookup-area.custBoot {
    /*padding-top: 8px;*/
    height: calc(100% - 15px); /*21/7/22 kat*/
    width: 450px;
    padding-right: 0px;
}

.lookup-area fieldset {
    margin-top: 0;
}

@media (max-width: 1025px) {

    #filterpermGridText {
        width: 280px;
        position: relative;
    }

    .lookup-area fieldset.rolePermissionsFieldset .toolbar-inline {
        float: left;
    }

    .lookup-area fieldset.rolePermissionsFieldset #permGrid {
        clear: both;
    }
}

.lookup-area .action-buttons,
.sidepane .action-buttons {
    position: absolute;
    bottom: 10px;
}

.grid-container {
    height: calc(100vh - 90px);
}


.singleLookupWithAddNew {
    margin-top: 40px;
}

.multiLookupWithAddNew {
    margin-top: 80px;
}

#errorPane {
    font-size: 13px;
    padding: 4px 20px;
    z-index: 98;
    height: fit-content; /*16/8/22 kat*/
    display: none;
    color: #fff;
    cursor: pointer;
    margin-bottom: 3px;
    overflow: hidden;
    /*position: absolute;
    width: 100%;
    border-bottom: 1px solid white;*/
}

.error {
    background-color: #ff0000;
    color: #fff;
}


#errorPane.warning {
    color: #333;
}



.labelLeft > label {
    padding-top: 6px;
    padding-bottom: 1px;
    padding-left: 12px;
    width: 140px;
    margin: 0;
    font-weight: normal !important;
    position: relative;
    margin-bottom: 1px;
    vertical-align: top;
    overflow: hidden; /*kat 28/6/22*/
    text-overflow: ellipsis; /*kat 28/6/22*/
    white-space: nowrap; /*kat 28/6/22*/
}
.labelLeft.AutoLabel > label {
    width: unset;
    min-width: 80px;
    padding-left: 0;
    margin-right: 5px;
}

#toolbar .list-inline > li > .labelLeft > label {
    width: auto;
    /*padding-left: 5px;*/
    padding-right: 5px;
}

#toolbar div.MediumSize,
#toolbar div.SmallSize,
#toolbar div.XXSmallSize,
#toolbar div.LargeSize {
    width: auto;
    text-wrap: nowrap;
}

#toolbar div.DateSize > input {
    width: 100px;
}


.labelLeft.AutoLabel.labelRequired > label {
    padding-left: 12px;
}

.labelLeft > input,
.labelLeft > textarea,
.labelLeft > select {
    display: inline-block;
}


.SmallSize {
    width: 224px;
}

    .SmallSize > input,
    .SmallSize > select,
    .SmallSize > textarea,
    .SmallSize .wheels-combobox {
        width: 84px;
    }

#wheelslogo {
}

.DoubleSize {
    width: 840px;
}

    .DoubleSize > input {
        width: 700px;
    }


.labelNone {
    margin-left: 5px;
}


.MediumSize > input,
.MediumSize > select,
.MediumSize > div.input-group,
.MediumSize > .wheels-combobox,
.MediumSize > .evo-cp-wrap > input,
.MediumSize > .iti > input {
    width: 130px;
}

.LMediumSize > input,
.LMediumSize > select,
.LMediumSize > div.input-group,
.LMediumSize > .wheels-combobox,
.LMediumSize > .evo-cp-wrap > input {
    width: 176px;
}

.XMediumSize > input,
.XMediumSize > select,
.XMediumSize > div.input-group,
.XMediumSize > .wheels-combobox > input {
    width: 196px;
}

.XXMediumSize > input,
.XXMediumSize > select,
.XXMediumSize > div.input-group,
.XXMediumSize > .wheels-combobox > input {
    width: 227px;
}

.XSmallSize > input,
.XSmallSize > select,
.XSmallSize > .wheels-combobox > input {
    width: 85px;
}

.XXSmallSize > input,
.XXSmallSize > select,
.XXSmallSize > .wheels-combobox > input {
    width: 62px;
}

.XXSmallSize.labelNone > input,
.XXSmallSize.labelNone > select,
.XXSmallSize.labelNone > .wheels-combobox > input {
    width: 63px;
}


.XXXSmallSize > input,
.XXXSmallSize > select,
.XXXSmallSize > .wheels-combobox > input {
    width: 32px;
}

.XXXSmallSize.labelNone > input,
.XXXSmallSize.labelNone > select,
.XXXSmallSize.labelNone > .wheels-combobox > input {
    width: 33px;
}

@media (max-width: 1025px) {
    div.RightAligment {
        margin-right: 40px;
    }
}

.MediumSize {
    width: 270px;
}

.labelNone.MediumSize {
    width: 130px;
}

.labelNone.SmallSize {
    width: 84px;
}

.labelNone.customSmallSize {
    width: 104px;
}

fieldset .inline-group > * {
    white-space: nowrap;

}

.LargeSize > input,
.LargeSize > textarea,
.LargeSize > select,
.LargeSize > .wheels-combobox > input {
    width: 265px;
}

.XLargeSize > input,
.XLargeSize > textarea,
.XLargeSize > select,
.XLargeSize > .wheels-combobox > input {
    width: 360px;
}

.wheels-combobox {
    position: relative;
    display: inline-block;
}

.evo-cp-wrap {
    position: relative;
    display: inline-block;
    width: auto !important;
    padding: 0 !important;
}


/*
    Grid border color
    .ag-theme-balham .ag-root {
    border-top-color: #dbe2e6;
    border-left-color: #dbe2e6;
    border-right-color: #dbe2e6;
    border-bottom-color: #dbe2e6;
}*/

.nosidetoolbar > .ag-root-wrapper > .ag-root-wrapper-body > .ag-tool-panel {
    display: none !important;
}

.labelTop > label {
    box-sizing: border-box;
    display: block;
    padding-left: 12px;
    padding-top: 4px;
    padding-bottom: 1px;
    margin: 0;
    font-weight: normal;
    position: relative;
    margin-bottom: 1px;
    color: #444;
}


.ag-header-row {
    font-weight: bold;
}

.informational {
    font-size: 13px;
}

.wheelsgrid-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    border-radius: 0;
    box-shadow: none;
    /*outline: 1px solid #666;*/
    width: 12px;
    height: 12px;
    margin-top: 5px !important;
}



    .wheelsgrid-checkbox:checked {
        /*background-color: #ff0000;*/
    }

.ag-cell .wheelsgrid-checkbox {
    margin-top: 0px;
}


.ag-filter {
    font-size: 12px;
}

.ag-theme-balham .ag-cell-inline-editing,
.ag-cell-edit-input {
    padding: 0px; /* 2022-01-06  change */
    /*border-radius: 0 !important;
    border: 0 !important;
    outline: none !important;
    
    border-top: 2px solid #666;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
    border-left: 0;
*/ color: #000;
}

}

.ag-theme-balham .ag-ltr .ag-cell-inline-editing.ag-cell {
    /*border-right: 2px solid #666;*/
    /*padding-left: 0;*/
}

.ag-cell-inline-editing.ag-cell {
    height: inherit;
}

.ag-theme-balham .ag-row:not(.ag-row-first) {
    /*border-bottom: 2px solid #0874aa;*/
}

.ag-theme-balham .ag-row-group-expanded.ag-full-width-row {
    font-weight: bold;
    background-color: #fff;
    border-bottom: 2px solid #3b79b7 !important;
    color: #222;
    overflow: hidden;
}

.ag-theme-balham .ag-row-group-contracted {
    /*font-weight: bold;*/
    background-color: #fff;
    border-bottom: 0;
    color: #222;
}

.ag-theme-balham .ag-cell {
    padding-left: 5px;
    padding-right: 5px;
}

.ag-theme-balham .ag-group-expanded .ag-icon-contracted:empty {
    opacity: 1;
}


.ag-theme-balham .ag-ltr .ag-row-group-leaf-indent {
    margin-left: 10px;
    padding-left: 0px;
}

.ag-theme-balham .ag-row-footer .ag-row-group-leaf-indent {
    text-align: unset;
    margin-left: 0px;
}


.wheelsgrid-numeric-editing {
    border: 0;
    padding-bottom: 3px;
}

    .wheelsgrid-numeric-editing:focus {
        color: #000;
    }

.ag-theme-balham .ag-full-width-row {
    overflow-y: auto;
}

.ag-theme-balham .ag-row-even.bg-danger,
.ag-theme-balham .ag-row-odd.bg-danger {
    color: red;
    font-weight: bold;
}

.ag-theme-balham .ag-row-even.bg-warning,
.ag-theme-balham .ag-row-odd.bg-warning {
    /* background-color: #fcf8e3; */
}


.wheelsgrid-preview-row {
    color: blue;
    margin-top: 3px;
    margin-left: 30px;
    white-space: normal;
    /*white-space: nowrap;*/
}

.labelRequired {
    position: relative;
}

    .labelRequired > label {
        padding-left: 12px;
        background-image: url('/public/images/icons/required.png');
        background-position: left center;
        background-repeat: no-repeat;
    }

.checkBox input[type=checkbox],
.checkBox input[type=radio] {
    margin-top: 6px; /*kat 28/6/22*/
    outline-offset: 0px; /*18/8/22 kat*/
    outline: 0px transparent; /*18/8/22 kat*/
    cursor: pointer;
}

.toolbar-inline .checkBox input[type=checkbox], .toolbar-inline .checkBox input[type=radio] {
    margin-top: 4px;
}

/*.checkBox {
    cursor: pointer;
}*/

.checkBox > label {
    padding-left: 4px;
    vertical-align: top;
    margin-top: 4px;
    cursor: pointer;
    display: inline-block;
    overflow: hidden; /*27/6/22 kat*/
    text-overflow: ellipsis; /*27/6/22 kat*/
    white-space: nowrap; /*27/6/22 kat*/
}


.toolbar-inline .checkBox > label {
    margin-top: 3px;
}

.labelLeft.radioList > label:not(:first-of-type),
.labelNone.radioList > label {
    padding-left: 4px;
    padding-top: 0px;
    vertical-align: top;
    margin-top: 4px;
    cursor: pointer;
    display: inline-block;
}

.TextBox {
    position: relative;
    margin-bottom: 1px;
    padding: 3px 3px !important;
    border: 1px solid #e0e0e0;
}

.ButtonEdit { /*todo*/
    position: relative;
    margin-bottom: 1px;
    padding: 3px 10px !important;
    border-bottom: 1px solid #e0e0e0;
    background-image: url('/public/images/editor/list.png');
    background-position: left center;
    background-repeat: no-repeat;
}

.Required {
    background-color: #ffffdd;
}

.form-control.FormRequiredError,
.FormRequiredError {
    border: solid red 1px;
}

.RequiredError {
    right: 0px;
    color: white;
    border: none;
    bottom: 6px;
    display: none;
    padding: 4px 6px;
    position: absolute;
    border-radius: 0px;
    background-color: red;
}

.RequiredErrorRestore {
    display: block;
}

.ReadOnly {
    background-color: #9a9797;
}

.clearBtn {
    position: absolute;
    right: 16px;
    top: 1px;
    padding-top: 3px;
    padding-bottom: 2px;
    padding-left: 5px;
    padding-right: 5px;
    color: #252525;
    font-size: 14px;
    visibility: hidden;
    cursor: pointer;
}

    .clearBtn:hover {
        background-color: #eee;
    }

@media (max-width: 1025px) {
    .clearBtn {
        font-size: 20px;
        padding: 5px 10px;
    }
}


/* Evol Color Picker */
.evo-pop {
    z-index: 10000;
    /*width: 204px;*/
    width: 210px;  /*--3/6/22 kat--*/
    padding: 3px 3px 0;
}

.evo-pop-ie {
    z-index: 10000;
    width: 212px;
    padding: 3px;
}

.evo-palette td {
    font-size: 1px;
    border: solid 1px #c0c0c0;
    padding: 7px;
    cursor: pointer;
}

.evo-palette tr.top > td {
    border-bottom: 0;
}

.evo-palette tr.in > td {
    border-top: 0;
    border-bottom: 0;
}

.evo-palette tr.bottom > td {
    border-top: 0;
}

.evo-palette div.sep {
    height: 3px;
}

.evo-palette,
.evo-palette-ie {
    border-collapse: separate;
    border-spacing: 4px 0px;
    *border-collapse: expression('separate', cellSpacing='2px');
}

    .evo-palette th,
    .evo-palette-ie th {
        border: 0;
        padding: 5px 3px;
        text-align: left;
        font-weight: normal;
        background: transparent !important;
    }

    .evo-palette-ie td {
        font-size: 1px;
        border: solid 1px #c0c0c0;
        padding: 7px;
        cursor: pointer;
    }

.evo-palette2,
.evo-palette2-ie {
    margin: auto;
    border-collapse: collapse;
}

    .evo-palette2 td,
    .evo-palette2-ie td {
        font-size: 1px;
        cursor: pointer;
    }

    .evo-palette2 td {
        padding: 6px 7px;
    }

    .evo-palette2-ie td {
        padding: 5px;
    }

.evo-palcenter {
    padding: 5px;
    text-align: center;
}

.evo-colorind,
.evo-colorind-ie,
.evo-colorind-ff {
    border: 1px solid #bbb;
    height: 27px;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
    width: 22px;
}


.evo-colorind-ie {
    position: relative;
    top: -23px;
}

.evo-colorbox-ie {
    font-size: 8px;
    padding: 3px 9px !important;
}

.evo-pop:after,
.evo-pop-ie:after,
.evo-colorind:after,
.evo-colorind-ie:after,
.evo-colorind-ff:after,
.evo-color span:after,
.evo-cHist:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    font-size: 0;
}

.evo-color {
    width: 94px;
    padding: 1px 3px 0 4px;
}

    .evo-color div {
        border: solid 1px #808080;
        border-right: solid 1px #c0c0c0;
        border-bottom: solid 1px #c0c0c0;
        padding: 3px;
        margin-top: 7px;
        margin-bottom: 0px;
        width: 10px;
        height: 10px;
        float: left;
    }

    .evo-color span {
        font-size: 15px;
        margin: 1px 0 4px 3px;
        float: left;
    }

.evo-sep {
    height: 10px;
    font-size: 0;
}

.evo-more {
    padding: 4px 5px 4px;
    font-size: smaller;
}

.evo-cHist {
    padding: 3px;
}

    .evo-cHist div {
        cursor: pointer;
        border: solid 1px #c0c0c0;
        padding: 3px;
        margin: 5px;
        width: 10px;
        height: 10px;
        float: left;
    }

.evo-transparent {
    background-image: repeating-linear-gradient(135deg, black, black 1px, white 1px, white 3px);
}

.evo-tr-box {
    cursor: pointer;
    border: solid 1px #c0c0c0;
    padding: 3px;
    width: 7px;
    height: 7px;
    float: right;
    position: relative;
    right: -3px;
    top: 2px;
}

a.evo-hist {
    margin-left: 6px;
}

.evo-pointer {
    cursor: pointer;
}

.evo-hidden-button {
    display: none;
}


/* Properties view */

.properties-view {
    width: 100%;
    max-width: 830px;
    clear: both;
    position: relative;
}

    .properties-view .colcontainer:last-of-type {
        margin-right: 0;
    }

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

    .tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #333;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        opacity: 0;
        transition: opacity 0.3s;
    }

        .tooltip .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 10px;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #333 transparent transparent transparent;
        }

    .tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }

/*.flight-tooltip-content {
    max-width: fit-content;
     border-bottom: unset;
}

    .flight-tooltip-content .tooltip-inner {
        text-align: start;
        max-width: 184px;
    }

    .flight-tooltip-content .row {
        margin: 0;
    }

    .flight-tooltip-content .col-xs-7 {
        padding-inline: 5px;
    }
*/

.tokenize > .tokens-container {
    position: relative;
    list-style: none;
    padding: 0 0 5px 5px;
    height: auto;
    min-height: 34px;
    cursor: text;
}

    .tokenize > .tokens-container.disabled {
        background-color: #eee;
        cursor: not-allowed;
    }

.tokenize.focus > .tokens-container {
    outline: 0;
    border-color: #66afe9;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}

.tokenize > .tokens-container.input-sm {
    padding: 0 0 4px 4px;
    min-height: 30px;
}

.tokenize > .tokens-container.input-lg {
    padding: 0 0 9px 9px;
    min-height: 46px;
}

.tokenize > .tokens-container > .token {
    padding: 0 1.2em 0 5px;
    background-color: #eff2f7;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.tokenize > .tokens-container > .token,
.tokenize > .tokens-container > .placeholder,
.tokenize > .tokens-container > .token-search {
    border: 1px solid #cdd5e3;
    display: inline-block;
    margin: 5px 5px 0 0;
    position: relative;
    vertical-align: middle;
}

.tokenize.sortable > .tokens-container > .token {
    cursor: move;
}

.tokenize.single > .tokens-container > .token {
    display: block;
    border-color: #fff;
    background-color: transparent;
}

.tokenize.sortable > .tokens-container > .token.shadow {
    border-color: #ccc;
    background-color: #ccc;
    filter: alpha(opacity=50);
    opacity: .2;
}

.tokenize > .tokens-container > .placeholder,
.tokenize > .tokens-container > .token-search {
    padding: 0;
    border-color: #fff;
}

.tokenize > .tokens-container > .placeholder {
    color: #ccc;
}

.tokenize > .tokens-container > .token-search > input {
    padding: 0;
    margin: 0;
    line-height: 1em;
    border: 1px solid #fff;
    background: transparent;
    border-left: none;
    border-right: none;
    outline: none;
    width: 100%;
}

    .tokenize > .tokens-container > .token-search > input::-ms-clear {
        display: none;
    }

.tokenize > .tokens-container.input-sm > .placeholder,
.tokenize > .tokens-container.input-sm > .token-search,
.tokenize > .tokens-container.input-sm > .token {
    margin: 4px 4px 0 0;
}

.tokenize > .tokens-container.input-lg > .placeholder,
.tokenize > .tokens-container.input-lg > .token-search,
.tokenize > .tokens-container.input-lg > .token {
    margin: 9px 9px 0 0;
}

.tokenize > .tokens-container > .token.pending-delete {
    background-color: #5b72a4;
    border-color: #425c96;
    color: #fff
}

.tokenize > .tokens-container > .token > .dismiss {
    position: absolute;
    right: 5px;
    color: #a9b9d8;
    text-decoration: none;
    cursor: pointer;
}

    .tokenize > .tokens-container > .token > .dismiss:after {
        content: "?";
    }

.tokenize > .tokens-container > .token.pending-delete > .dismiss {
    color: #aaa;
}

.tokenize-dropdown {
    position: absolute;
    display: none;
}

    .tokenize-dropdown > .dropdown-menu {
        min-height: 10px;
        width: 100%;
        display: block;
        margin: -1px 0 0 0;
        visibility: visible;
        opacity: 1;
    }

        .tokenize-dropdown > .dropdown-menu li {
            cursor: pointer;
        }

            .tokenize-dropdown > .dropdown-menu li > a .tokenize-highlight {
                font-weight: bold;
            }

            .tokenize-dropdown > .dropdown-menu li.locked {
                padding: 3px 20px;
                color: #333;
                white-space: nowrap;
            }

            .tokenize-dropdown > .dropdown-menu li.locked,
            .tokenize-dropdown > .dropdown-menu li > a {
                text-overflow: ellipsis;
                overflow-x: hidden;
            }

            .tokenize-dropdown > .dropdown-menu li:not(.active) a:hover,
            .tokenize-dropdown > .dropdown-menu li:not(.active) a:focus {
                background-color: transparent;
            }
/* Wheels Tree view*/

    .treeviewcontainer {
    background: white;
}

.treeviewfilter {
    width: 98% !important;
}

.treeviewcontainer ul {
    padding: 0px;
    margin: 0;
}

.treeviewcontainer li {
    list-style-type: none;
    padding-left: 15px;
    cursor: pointer;
    color: #000;
}

.treeviewItemTitle:hover {
    background-color: #ddd;
}



.treeviewcontainer li span.treeviewItemTitle.treeviewItemHover {
    background-color: #418EFF;
    color: #fff;
}

span.treeviewItemTitleDis {
    display: none !important;
}

span.treeviewItemTitle {
    display: block;
    padding: 2px 4px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

    span.treeviewItemTitle > input {
        margin-right: 2px;
    }

.treeviewParentPlus {
    position: relative;
    left: -12px;
    top: 4px;
    width: 4px;
    float: left;
}

/* Wheels Tree combo*/
.combotreecontainer {
    display: none;
    background: #fff;
    border: 1px solid #aaa;
    max-height: 250px;
    overflow: auto;
    z-index: 25;
    position: absolute;
    width: 100%;
    box-sizing: border-box;
}

    .combotreecontainer ul,
    #toolbar .combotreecontainer ul {
        padding: 0px;
        margin: 0;
    }

    .combotreecontainer li,
    #toolbar .combotreecontainer li {
        list-style-type: none;
        padding-left: 15px;
        cursor: pointer;
        color: #000;
    }

        .combotreecontainer li:hover,
        #toolbar .combotreecontainer li:hover {
            background-color: #ddd;
        }

            .combotreecontainer li:hover ul, #toolbar .combotreecontainer li:hover {
                background-color: #fff;
            }

        .combotreecontainer li span.comboTreeItemTitle.comboTreeItemHover, #toolbar .combotreecontainer li span.comboTreeItemTitle.comboTreeItemHover {
            background-color: #418EFF;
            color: #fff;
        }

span.comboTreeItemTitle {
    display: block;
    padding: 2px 4px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

    span.comboTreeItemTitle > input {
        margin-right: 2px;
    }

.comboTreeDropDownContainer label {
    cursor: pointer;
    width: 100%;
    display: block;
}

.comboTreeDropDownContainer .comboTreeItemTitle input {
    position: relative;
    top: 2px;
    margin: 0px 4px 0px 0px;
}

.comboTreeParentPlus {
    position: relative;
    left: -12px;
    top: 4px;
    width: 4px;
    float: left;
}

.extratreecontainer {
    max-height: 350px;
}

.extratreecontainer .treecombolist {
    border-right: 1px solid #ccc;
    scrollbar-width: thin;
}

    .extratreecontainer .treecombolist ~ ul {
        scrollbar-width: thin;
    }
.extratreecontainer > div {
    display: flex;
}
    .extratreecontainer > div > ul {
        max-height: 333px;
        overflow: auto;
    }
#toolbar .combotreecontainer.extratreecontainer > div > ul.extra-filters {
    overflow: auto;
    display: flex;
    flex-wrap: wrap;
    height: min-content;
    gap: 5px;
    width: 118px;
    min-width: 100px;
    padding: 5px;
    flex: 1;
}

.stations-types {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
}

#toolbar .combotreecontainer.extratreecontainer .stations-types a {
    padding: 5px;
}

#toolbar .combotreecontainer.extratreecontainer .extra-filters li {
    padding: 0;
}

#toolbar .combotreecontainer.extratreecontainer .extra-filters li.stations-types {
    padding-top: 5px;
    border-top: 1px solid #ccc;
}

    #toolbar .combotreecontainer.extratreecontainer .extra-filters li a {
        margin: 0;
        text-align: center;
    }
    #toolbar .combotreecontainer.extratreecontainer .extra-filters li:not(.stations-types) a {
        padding: 0px 5px;
    }
    #toolbar .combotreecontainer.extratreecontainer .extra-filters li a:hover {
        color: #fff !important;
    }

.extratreecontainer li,
.extratreecontainer li a {
    width: 100% !important;
}

#toolbar .extratreecontainer li a > span.caption {
    margin: 0;
}

.extratreecontainer .stations-types div {
    flex: 40%;
}

.extratreecontainer {
    overflow: hidden;
    width: 100%;
    right: 0;
    left: 0;
}

@media only screen and (min-width: 500px) {
    .extratreecontainer {
        width: fit-content !important;
        max-width: calc(-220px + 97vw);
        min-width: calc(100% + 85px);
        box-sizing: border-box;
    }
}

@media only screen and (min-width: 600px) {
    .extratreecontainer {
        max-width: calc(-581px + 97vw);
    }
}

@media only screen and (max-width: 499px) {
    .stationsFilter > .wheels-combobox {
        position: initial;
    }
    #toolbar .stationsFilter .wheels-combobox a.wheels-combobox-toggle {
        top: unset;
        bottom: 0;
    }

    div.extratreecontainer {
        top: 30px !important;
    }
    #toolbar .LargeSize.stationsFilter > .wheels-combobox,
    #toolbar .LargeSize.stationsFilter > .wheels-combobox > input {
        width: 100%;
    }
    #toolbar .list-inline > li > .labelLeft.stationsFilter > label {
        min-width: 66px;
    }

    .stationsFilter .wheels-combobox > span:first-of-type {
        top: 8px !important;
        left: 68px !important;
        width: calc(100% - 91px) !important;
    }
}

@media only screen and (max-width: 400px) {
    #toolbar ul li:has( > .stationsFilter) {
        width: 100% !important;
    }
}
    /* Wheels-Combobox */
    .wheels-combobox a.wheels-combobox-toggle,
    #toolbar .wheels-combobox a.wheels-combobox-toggle, .rfid-button {
        cursor: pointer;
        position: absolute;
        right: 0;
        top: 0;
        height: 27px;
        line-height: 26px;
        margin-right: 0;
        width: 22px;
        text-align: center;
        padding: 0px 0px;
        border-radius: 0;
    }

    #toolbar li .form-control,
    #toolbar li .wheels-combobox a.wheels-combobox-toggle,
    .toolbar-inline li .wheels-combobox a.wheels-combobox-toggle,
    .toolbar-inline .wheels-combobox a.wheels-combobox-toggle,
    .toolbar-inline .form-control {
        height: 26px;
        margin-top: 0px;
    }

    #toolbar li .form-control,
    .toolbar-inline .form-control {
        border-radius: 3px;
    }

    #toolbar li .wheels-combobox a.wheels-combobox-toggle,
    .toolbar-inline .wheels-combobox a.wheels-combobox-toggle {
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
    }



    /*.wheels-combobox-toggle {
    background-image: url('../../public/icons/lookup.png');
    background-repeat: no-repeat;
    background-position: center center;
}*/
    .wheels-combobox .wheels-combobox-input {
        padding-right: 23px; /*allow for button*/
        /*width: inherit !important;*/
    }



    .ui-autocomplete.wheels-combobox-list {
        max-height: 200px;
        overflow-y: auto;
        overflow-x: hidden;
        /*border-top: none !important;*/
    }

        .ui-autocomplete.wheels-combobox-list > li {
            display: block;
            height: 25px;
            overflow: hidden;
            white-space: nowrap; /*--8/7/22 kat--
        text-overflow: ellipsis;*/
            font-size: 12px;
            /*display: flex;*/
        }
            .ui-autocomplete.wheels-combobox-list > li.ui-menu-divider {
                height: 0px;
                margin: 0px;
            }

            .ui-autocomplete.wheels-combobox-list > li:focus {
                outline: 0px;
            }

    span.ui-menu-item-wrapper.ui-item-active.ui-state-active {
        border: solid #007fff 1px;
    }

    .ui-autocomplete.wheels-combobox-list > li > span {
        display: table-cell;
        height: 25px;
        white-space: nowrap;
        padding-left: 5px;
        padding-right: 4px;
        border: none 0px;
        border-right: solid 1px #bbb;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .ui-autocomplete.wheels-combobox-list > li > span:first-of-type {
            padding-left: 4px;
            border-right: solid 1px #bbb;
        }

    @media(max-width: 1140px) {
        /*18/8/22 kat*/
        .ui-autocomplete.wheels-combobox-list > li, .ui-autocomplete.wheels-combobox-list > div {
            width: fit-content;
            min-width: -webkit-fill-available;
            white-space: nowrap;
        }
    }
    @media(max-width: 1025px) {
        .ui-autocomplete.wheels-combobox-list {
            /*max-width: 90%;*/ /*12/8/22 kat*/
            /* overflow-x: auto;*/ /*11/7/22*/
        }
            .ui-autocomplete.wheels-combobox-list > li > span:first-of-type {
                font-size: 11px; /*kat 12/8/22*/
            }
            .ui-autocomplete.wheels-combobox-list > li > span:first-of-type, .ui-widget-header.multicombo > span:last-of-type, .ui-menu-item.multicombo > span:last-of-type {
                line-height: 1.6em; /*kat 27/7/22*/
                /*font-size: 11px !important;*/ /*kat 12/8/22*/
                height: 25px; /*kat 23/4/22*/
                width: 50px;
            }

        .ui-widget-header.multicombo > span:last-of-type {
            min-width: 80px;
        }
    }

    .ui-autocomplete.wheels-combobox-list > li:focus {
        outline: 0px;
    }

    span.ui-menu-item-wrapper.ui-item-active.ui-state-active {
        border: solid #007fff 1px;
    }

    ul.ui-menu span.ui-state-active {
        margin: 0px;
    }

    .ui-menu {
    }

    ul.ui-menu span.ui-state-active {
        margin: 0px;
    }
    /* ul.ui-menu span.ui-state-active:last-of-type,
    .multicombo.ui-menu-item span.bold.ui-menu-item-wrapper {
        min-width: 100%;
    }*/
    ul.ui-menu .ui-widget-header span.ui-state-active:last-of-type { /*16/8/22 kat*/
        min-width: unset;
    }
    .wheels-combobox-toggle:hover {
        background-color: #eee;
    }

    #sipedit {
        position: relative;
    }

    .SipEditDropDown {
        background-color: #fff;
        position: absolute;
        display: none;
        padding: 15px;
        left: -220px;
        top: 26px;
        border: 1px solid #c0c0c0;
        box-shadow: 0 5px 15px 2px #0000004d;
        width: 675px;
        z-index: 999;
    }

    .SipCol {
        float: left;
        width: 160px;
    }

    .SipEditDropDown > label {
        margin-bottom: 2px;
        display: block;
        color: #003366;
    }

    .SipEditDropDown select {
        width: 150px;
        margin-right: 10px;
        margin-bottom: 5px;
    }

    .SipInfo {
        clear: both;
        display: block;
    }

    .sip-close-button {
        float: right;
        margin-right: 5px;
    }

        .sip-close-button:first-of-type {
            margin-right: 15px;
        }


    .properties-view {
        width: 100%;
        max-width: 840px;
        clear: both;
        position: relative;
    }

    .colcontainer {
        width: 100%;
        max-width: 405px;
        margin-right: 30px;
        float: left;
    }


    .colcontainer-double {
        width: 100%;
        max-width: 849px; /* Jo */
        float: left;
    }

    /*@media (max-width: 1025px) {

    .colcontainer {
        width: 100%;
        max-width: 100%;
        float: none;
    }

    .colcontainer-double {
        width: 100%;
        max-width: 100%;
        float: none;
    }

    #generalPanel fieldset {
        width: 100%;
        max-width: 100%;
        float: none;
    }
}*/

    .properties-view .colcontainer:last-of-type {
        margin-right: 0;
    }

    .entity-content {
        padding: 0 15px 0 15px;
        padding: 0;
        /*height: calc(100% - 51px);*/
        height: calc(100% - 20px); /*21/7/22 kat*/
    }

        .entity-content .memo-box,
        .entity-content .attachments-box,
        .entity-content .related-box {
            width: 100%;
            max-width: 840px;
            height: fit-content;
            padding-bottom: 10px;
        }

            .entity-content .memo-box fieldset,
            .entity-content .attachments-box fieldset {
                width: 100%;
            }

            .entity-content .memo-box fieldset,
            .entity-content .related-box fieldset {
                width: 100%;
            }

            /*.wheels-app .entity-content .memo-box,
.wheels-app .entity-content .attachments-box {
    position: relative;
    width: 100%;
    max-width: 830px;
    height: 100px;
}*/

            .entity-content .memo-box textarea {
                height: 60px;
            }

    .inline-group > * {
        float: left;
    }

    .inline-group:after,
    .properties-view:after {
        content: "";
        display: table;
        clear: both;
    }

    .nav-tabs {
        border: 0;
        font-size: 13px;
    }

        .nav-tabs li {
            border-right: 2px solid #f4f6f9;
        }

        .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
            border: 0;
        }

        .nav-tabs > li > a {
            border: 0;
            text-decoration: none;
            border-radius: 0;
            color: #333;
            overflow: hidden; /*6/7/22 kat*/
            text-overflow: ellipsis; /*6/7/22 kat*/
            white-space: nowrap; /*6/7/22 kat*/
        }

            /* 2022-01-07 change start */
            .nav-tabs > li > a:hover {
                background: #b8d5eb;
                border-color: #b8d5eb #b8d5eb transparent;
            }

    /* 2022-01-07 change end */

    .dropdown.hideDropdown > ul.dropdown-menu {
        min-width: 250px;
    }

    #search-iconSmall {
        display: none;
    }

    .nav.navbar-nav.mmenuIcon {
        display: none;
    }

    .checkboxReadonly {
        pointer-events: none;
    }

        .checkboxReadonly input[type=checkbox],
        .checkboxReadonly input[type=checkbox] ~ label {
            opacity: 0.7;
        }

    #btActions .caret {
        margin-left: 5px;
    }

    @media (max-width: 1349px) {
        #mainmenuNav {
            display: none;
        }
    }
    @media (max-width: 991px) {
        /* ---- Excore Master Start ---- */
        .nav.navbar-nav.mmenuIcon {
            display: block;
        }

        ul .nav.navbar-nav li.dropdown.dropdown-large.open div.dropdown-menu.dropdown-menu-large {
            top: 40px;
            left: 0px;
        }

        .dropdown.dropdown-large {
            width: 50px;
        }

            .dropdown.dropdown-large.hideDropdown {
                display: block !important;
            }

        .dropdown.hideDropdown {
            display: none !important;
        }

        .collapse.navbar-collapse {
            width: 100%;
            border: none;
            display: block !important;
            margin-left: 0px;
            margin-right: 0px;
            padding-right: 0px;
        }

            .collapse.navbar-collapse ul.nav.navbar-nav {
                width: 50px;
                height: 40px;
                margin: 0px;
                float: left;
            }

                .collapse.navbar-collapse ul.nav.navbar-nav.mmenuIcon {
                    float: left;
                    width: 50px;
                    margin: 0px;
                }

                .collapse.navbar-collapse ul.nav.navbar-nav.navbar-right {
                    height: 40px;
                    margin: 0px;
                    float: right;
                    padding-right: 10px;
                }

        .navbar-form.GlobalSearch {
            width: 70%;
            margin: 0px;
            margin-left: calc(10% - 5px);
            height: 40px;
            border: none;
            padding: 5px 0px;
            position: relative;
            box-shadow: none;
        }

        #searchbox {
            transform: translateX(-5px);
        }

        ul.nav.navbar-nav.navbar-right li {
            display: none;
        }

        #searchbox ul > li {
            display: list-item;
        }

        #liHistory {
            float: right;
            display: none;
            z-index: 1;
            transform: translateX(-100%);
        }

        #liGlobalSearch {
            float: unset;
            display: block;
            transform: translateX(calc(-10% - 10px));
        }

        #current-user {
            float: right;
            display: block;
            transform: translateY(-100%);
        }

            #current-user a {
                padding-top: 10px !important;
            }

            #current-user li {
                display: block;
            }

        #liHistory li {
            display: block;
        }

        .nav.navbar-nav.mmenuIcon li {
            font-size: 20px;
            text-align: center;
            line-height: 40px;
        }

        .nav.navbar-nav.mmenuIcon i {
            color: #fff;
        }

        #search-icon {
            opacity: 0;
        }

        #close-button {
            top: 11px;
            right: 5px;
            opacity: 0;
            transition: opacity .5s;
        }

        /* Testing Animation */
        #tbGlobalSearch {
            right: 0px;
            width: 40px;
            height: 30px;
            padding: 0px 22px;
            position: absolute;
            transition: linear width .5s;
        }

        #search-iconSmall {
            top: 7px;
            left: calc(100% - 38px);
            color: #fff;
            display: block;
            opacity: 1;
            z-index: 10;
            padding: 7px 10px;
            position: absolute;
            transition: linear left .5s, linear padding-left .5s, linear padding-right .5s;
        }

        #searchbox {
            top: 35px;
            width: 100%;
            min-width: 200px; /*12/8/22 kat*/
        }

        li.dropdown.dropdown-large.open {
            height: 40px;
        }

            li.dropdown.dropdown-large.open div.dropdown-menu.dropdown-menu-large {
                top: 30px;
                left: -10px;
                position: absolute;
            }

        /* ---- Excore Master End ---- */

        /* ---- LookupVeiwEx Css Start ---- */
        div.row.full-height > div.col-sm-4.lookup-area.custBoot {
            z-index: 5;
            position: absolute;
            background: #f4f6f9;
            background-image: linear-gradient(rgb(250 250 250) 0%, rgb(244 246 249) 100%);
            padding-top: 10px;
            transition: linear right .2s;
            -webkit-box-shadow: 4px 0px 10px 0px rgba(0,0,0,0.75);
            -moz-box-shadow: 4px 0px 10px 0px rgba(0,0,0,0.75);
            box-shadow: 4px 0px 10px 0px rgba(0,0,0,0.75);
            height: calc(100% - 1px);
            padding-left: 15px;
            width: 445px;
        }
        /* ---- LookupVeiwEx Css End ---- */
    }

    #liHistory {
        display: none !important;
    }

    /*#advFilters {
    background: #f4f6f9;
}*/

    @media (max-width: 1025px) {

        /*div#advFilters {  /*21/7/22 kat
        height: calc(100% - -25px) !important;
    }*/

        #advFilters .filterRow {
            white-space: normal;
            vertical-align: top;
        }

            #advFilters .filterRow label {
                min-width: 120px;
            }

        #advFilters .valueCell {
            padding-bottom: 5px;
        }

        /*#advFilters .wheels-combobox,   /*kat 7/7/22
        #advFilters .form-control.hasDatepicker {
            margin-right: 10px;
            margin-left: 0;
        }*/

        #advFilters .filtersCont {
            max-height: calc(100% - 75px); /*21/7/22 kat*/
            overflow-y: auto; /*25/7/22 kat*/
        }
    }

    /*@media (max-width: 1025px) {  /*21/7/22 kat
    #lookupPanel {
        max-height: calc(100vh - 195px);
    }
}*/

    /*@media only screen and (max-device-width: 1300px) and (orientation: landscape) {
    #lookupPanel {  /*21/7/22 kat
        max-height: calc(100vh - 195px);
    }
}*/
    @media (max-width: 841px) { /*25/7/22 kat*/
        /* ---- Excore Master Start ---- */
        .collapse.navbar-collapse ul.nav.navbar-nav.navbar-right {
            width: calc(100% - 105px);
        }

        ul.nav.navbar-nav li.dropdown.dropdown-large.open div.dropdown-menu.dropdown-menu-large {
            top: 40px;
            left: -10px;
            width: auto !important;
            padding: 0px;
        }

        .dropdown-menu-large a {
            width: 100%;
        }
        /* ---- Excore Master End ---- */

    }

    @media (max-width: 767px) { /*25/7/22 kat*/
        /* ---- LookupVeiwEx Css Start ---- */
        div.row.full-height div.lookup-area {
            /*position: absolute;*/
            background: #fff;
            right: -100%;
            /*transition: linear right .2s;*/ /*21/7/22 kat*/
        }

        .colcontainer-double fieldset {
            width: 405px;
        }

        .bootstrap-dialog-body .colcontainer-double fieldset {
            width: 100%;
        }

        div.dialogBody .colcontainer-double fieldset {
            width: 100%;
        }
    }

    @media (min-width: 768px) and (max-width: 991px) {
        .collapse.navbar-collapse ul.nav.navbar-nav.navbar-right {
            width: 50%;
        }

        li.dropdown.dropdown-large.open div.dropdown-menu.dropdown-menu-large {
            top: 40px;
            left: 0px;
            position: absolute;
        }
    }
    /* ---- button flash color on save Css Start ---- */
    #btSave.finished {
        animation: blinkingBackground 0.3s 2;
    }

    @keyframes blinkingBackground {
        0% {
            background-color: #fff;
        }

        50% {
            background-color: #b4cc8f;
        }

        100% {
            background-color: #fff;
        }
    }
    /* ---- button flash color on save Css End ---- */

    #btUnassigned.hasClick .caption {
        display: block;
    }

    .subMenu .caption {
        display: unset;
    }

    #toolbar a, .toolbar-inline a {
        padding: 2px 10px;
    }


    #toolbar .AutoLabel > label {
        width: unset;
        min-width: unset;
        margin-left: 8px;
        margin-right: 4px;
    }

    @media (min-width: 992px) and (max-width: 1349px) {
        ul .nav.navbar-nav.navbar-right {
            height: 40px;
        }

        #search-icon {
            top: 15px;
            left: 35px;
        }

        .dropdown.hideDropdown {
            display: none !important;
        }

        .nav.navbar-nav.mmenuIcon {
            display: block;
        }

        #search-icon {
            top: 15px;
            left: 15px;
        }

        #tbGlobalSearch {
            padding-left: 27px;
        }

        div.mm-page.mm-slideout {
            top: 0px;
            left: 0px;
            position: absolute;
        }
    }

    @media (min-width: 1350px) and (max-width: 1460px) {
        .nav > li.dropdown > a {
            padding: 10px 12px;
        }
    }

    @media (min-width: 1349px) and (max-width: 1388px) {
        .nav > li.dropdown > a {
            padding: 10px 10px;
        }
    }

    @media (min-width: 1350px) and (max-width: 1499px) {
        #tbGlobalSearch {
            width: 148px; /*10/10/22 kat*/
        }

        #search-icon {
            top: 15px;
            left: 15px;
        }

        #tbGlobalSearch {
            padding-left: 27px;
        }
    }

    @media (min-width: 1611px) and (max-width: 1646px) {
        #tbGlobalSearch {
            width: 250px;
        }
    }

    @media (min-width: 1500px) and (max-width: 1530px) {
        #tbGlobalSearch {
            width: 165px;
        }
    }

    @media (min-width: 1531px) and (max-width: 1610px) {
        #tbGlobalSearch {
            width: 200px;
        }

        #search-icon {
            top: 15px;
            left: 15px;
        }

        #tbGlobalSearch {
            padding-left: 27px;
        }
    }

    /* ---- LookupVeiwEx Css Start ---- */


    #errorPane.info {
        background: #0173c7;
        color: #fff;
    }

        #errorPane.info a {
            color: #fff;
        }

    /* -------------------------------- Actions menu Css Start -------------------------------- */
    #toolbar li > ul.list-unstyled.actionsList,
    #toolbar li > ul.list-unstyled.newActionsList {
        width: auto;
        min-width: 200px; /*21/7/22 kat*/
        max-width: 250px; /*21/7/22 kat*/
        /*border: solid #215b7d 1px;*/
        height: auto;
        display: none;
        z-index: 10000;
        position: absolute;
        background-color: #fff;
        box-shadow: 0 6px 12px rgba(0,0,0,.175);
        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    }

        #toolbar li > ul.list-unstyled.actionsList *,
        #toolbar li > ul.list-unstyled.actionsList a > .fal,
        #toolbar li > ul.list-unstyled.newActionsList *,
        #toolbar li > ul.list-unstyled.newActionsList a > .fal {
            color: #000;
        }

        #toolbar li > ul.list-unstyled.actionsList > li,
        #toolbar li > ul.list-unstyled.newActionsList > li {
            padding: 0px;
        }

            #toolbar li > ul.list-unstyled.actionsList > li:hover *,
            #toolbar li > ul.list-unstyled.newActionsList > li:hover *,
            #toolbar li > ul.list-unstyled.actionsList > li:hover > a > .fal,
            #toolbar li > ul.list-unstyled.newActionsList > li:hover > a > .fal {
                color: #fff;
                background-color: #0173c7;
            }

            #toolbar li > ul.list-unstyled.actionsList > li:hover a.noClick,
            #toolbar li > ul.list-unstyled.actionsList > li:hover a.noClick *,
            #toolbar li > ul.list-unstyled.actionsList > li:hover > a.noClick > .fal,
            #toolbar li > ul.list-unstyled.newActionsList > li:hover a.noClick,
            #toolbar li > ul.list-unstyled.newActionsList > li:hover a.noClick *,
            #toolbar li > ul.list-unstyled.newActionsList > li:hover > a.noClick > .fal {
                color: #000;
                background-color: transparent;
            }

            #toolbar li > ul.list-unstyled.actionsList > li a,
            #toolbar li > ul.list-unstyled.newActionsList > li a {
                display: block;
                padding: 5px 15px;
            }
                /* 2022-01-07 change start */
                #toolbar li > ul.list-unstyled.actionsList > li a > span:first-child,
                #toolbar li > ul.list-unstyled.newActionsList > li a > span:first-child {
                    padding-left: 15px;
                }
                /* 2022-01-07 change end */
                #toolbar li > ul.list-unstyled.actionsList > li a.toolbarHidden,
                #toolbar li > ul.list-unstyled.newActionsList > li a.toolbarHidden {
                    display: none;
                }

    li > ul.list-unstyled.actionsList > li a:hover {
    }
    /* --------------------------------- Actions menu Css End --------------------------------- */


    /* -------------------------------- Datepicker Css Start -------------------------------- */

    #ui-datepicker-div {
        width: 272px;
        /*z-index: 10 !important;*/
        display: none;
        padding: 0;
    }

    table.ui-datepicker-calendar {
        width: 100%;
        font-size: 13px;
        margin: 0;
    }

        table.ui-datepicker-calendar thead th {
            padding: 0;
            text-align: center;
        }

            table.ui-datepicker-calendar thead th span {
                display: block;
                padding: 4px 0px;
            }

        table.ui-datepicker-calendar tr td {
            text-align: center;
        }

            table.ui-datepicker-calendar tr td a {
                display: block;
                padding: 2px 0px;
            }

            table.ui-datepicker-calendar tr td span.ui-state-default {
                display: block;
            }

    .ui-datepicker-header {
        height: 40px; /*2022-05-09 Changed by Celeste task #29004674  */
        /*height: 30px;*/
        position: relative;
        background-color: transparent; /* 2022-05-09 Added by Celeste task #29004674  */
    }

    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
        top: 2px;
        width: 30px;
        height: 26px;
        position: absolute;
    }

    .ui-datepicker .ui-datepicker-prev {
        left: 2px;
    }

    .ui-datepicker .ui-datepicker-next {
        right: 2px;
    }

    .ui-datepicker .ui-datepicker-prev span {
        top: 5px;
        left: 6px;
    }

    .ui-datepicker .ui-datepicker-next span {
        top: 5px;
        left: 4px;
    }

    /* 2022-05-09 Added by Celeste task #29004674  start */
    .ui-datepicker .ui-datepicker-prev span,
    .ui-datepicker .ui-datepicker-next span {
        background:  none;
    }
    .ui-datepicker .ui-datepicker-prev,
    .ui-datepicker .ui-datepicker-next {
        width: 35px;
        height: 35px;
        border-radius: 0;
        cursor: pointer;
    }
        .ui-datepicker  .ui-datepicker-prev:after,
        .ui-datepicker  .ui-datepicker-next:after {
            font-family: "Font Awesome 5 Pro";
            font-weight: 900;
            background:  none;
            font-size:  15px;
            content: "\f0a8";
            position: absolute;
            display: block;
            width:  100%;
            text-align: center;
            line-height: 36px;
            top: 0;
        }
        .ui-datepicker  .ui-datepicker-next:after {
            content: "\f0a9";
        }
    /* 2022-05-09 Added by Celeste task #29004674 end  */
    .ui-datepicker-title {
        top: 2px;
        left: 26px;
        width: 208px;
        height: 34px; /* 2022-05-09 Changed by Celeste task #29004674  */
        /*height: 24px;*/
        position: absolute;
        text-align: center;
        line-height: 35px; /*2022-05-09 Added by Celeste task #29004674  */
        /*line-height: 25px;*/
        font-size: 13px /*2022-05-30 Added by katerina task #29004674  */
    }

    .ui-state-active, .ui-widget-content .ui-state-active {
        color: #fff;
        border: 1px solid #007fff;
        background-color: #007fff;
    }

    /*.hasDatepicker {
    position: relative;
    background-size: 20px;
    background-image: url(../images/icons/calendar3.png);
    background-repeat: no-repeat;
    background-position: calc(100% - 5px) 2px;
}*/

    /*.hasDatepicker {
    position: relative;
    background-size: 22px;
    background-image: url(../images/icons/calendar5.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - -0.7px) -1px;
}*/

    .wheelsgrid-datepicker-editing.hasDatepicker {
        background-position: 252px center !important;
    }

    /* 2022-05-09 Added by Celeste task #29004674 start */
    html #ui-datepicker-div a.ui-state-active {
        background-color: #ed1c24;
    }

    html #ui-datepicker-div a.ui-state-hover {
        background-color: #0173c7;
        color: white;
    }

    #ui-datepicker-div .ui-state-default, #ui-datepicker-div .ui-widget-content .ui-state-default {
        background: none;
        border: none;
        padding: 7px 0;  /*-- 2/6/22 kat --*/
    }

    #ui-datepicker-div .ui-widget-content span.ui-state-default {
        padding: 7px 0;
    }

    #ui-datepicker-div a.ui-state-default,
    table.ui-datepicker-calendar tr td,
    .ui-datepicker td span, .ui-datepicker td a {
        text-align: center;
    }

    .ui-datepicker .ui-datepicker-title {
        margin: 0;
        line-height: 35px;
    }

    .ui-datepicker-trigger::after {
        font-size: 12px;
        font-family: "Font Awesome 5 Pro";
        font-weight: 400;
        content: "\f133";
        color: #333;
    }

    #toolbar .ui-datepicker-trigger:hover {
        background-image: linear-gradient(rgb(233 233 233) 0%, rgb(211 210 210) 100%);
    }

    /* 2022-05-09 Added by Celeste task #29004674 end */

    @media(max-width: 1025px) {
        #lookupPanel div[col-id=SDate] {
            min-width: 110px;
        }

        #lookupPanel .wheelsgrid-datepicker-editing, .content-area .wheelsgrid-datepicker-editing, #FromToDates1_text, #FromToDates2_text {
            min-width: 110px;
        }

            #lookupPanel .wheelsgrid-datepicker-editing.hasDatepicker,
            .content-area .wheelsgrid-datepicker-editing.hasDatepicker, #FromToDates1_text.hasDatepicker,
            #FromToDates2_text.hasDatepicker,
            .content-area .hasDatepicker,
            #toolbar .hasDatepicker {
                min-width: 110px;
                /*background-position: calc(100% - 5px) center;*/
            }

        #toolbar .form-control#FromToDates1_text, #toolbar .form-control#FromToDates2_text {
            min-width: 140px;
        }
    }
    /* --------------------------------- Datepicker Css End --------------------------------- */

    /* -------------------------------- Modal Css Start -------------------------------- */
    .wheelsModalWindow .modal-body iframe {
        width: 100%;
        /*min-height: 160px;*/ /*12/8/22 kat*/
    }

    #chkBill {
        position: absolute;
        transform: translateY(-50%);
    }

    .dropzone .dz-message {
        margin: 0 !important;
        line-height: 45px;
    }

    #filterText input {
        font-weight: normal;
    }

    .ag-theme-balham .ag-filter-toolpanel-header, .ag-theme-balham .ag-filter-toolpanel-search, .ag-theme-balham .ag-header-row, .ag-theme-balham .ag-multi-filter-group-title-bar, .ag-theme-balham .ag-status-bar {
        color: #000;
    }

    .ag-root-wrapper *, .ag-root-wrapper :after, .ag-root-wrapper :before {
        border: none;
    }

    .ag-root-wrapper .form-control {
        border: 1px #bbb solid;
    }

    .ag-root-wrapper .form-controlNoBorder {
        border: 0px !important;
        background-color: inherit !important;
        color:#000;
    }

    .wheelsModalWindow .bootstrap-dialog-message, .wheelsModalWindow .bootstrap-dialog-message div {
        height: 100%;

    }
        .wheelsModalWindow .bootstrap-dialog-message .modalWindowDateTime { /*21/7/22 kat*/
            width: fit-content;
        }

    .modal.rightPosition.fade:not(.in) .modal-dialog {
        -webkit-transform: translate3d(25%, 0, 0);
        transform: translate3d(25%, 0, 0);
    }

    .modalWindowDateTime {
        width: 370px;
    }

        .modalWindowDateTime .modalTimepicker {
            width: 95px;
            margin-left: 5px;
        }

    #searchField.labelNone {
        margin-left: 0px;
    }

    .wheelsModalWindow .bootstrap-dialog-footer-buttons {
        text-align: left;
    }

    .wheelsModalWindow .modal-dialog {
        margin-top: 75px;
    }

    /*.wheelsModalWindow.middleErrorPosition .modal-dialog {
    margin-top: 75px;
}*/

    .wheelsModalWindow.middleErrorPosition .modalErrorImage {
        width: 24px;
        height: 24px;
        display: inline-block;
        margin-right: 10px;
        background-size: cover;
        background-image: url('../images/icons/errorIcon.png');
        background-position: center;
        background-repeat: no-repeat;
    }

    .wheelsModalWindow.middleErrorPosition .modal-header {
        padding: 8px 10px;
    }

    .wheelsModalWindow.middleErrorPosition .bootstrap-dialog-message {
        color: #0072c6;
        font-size: 18px;
    }

    .bootstrap-dialog-footer-buttons .btnHidden {
        display: none;
    }

    .bootstrap-dialog-footer-buttons .btnRight {
        float: right;
    }
    /*.wheelsModalWindow .bootstrap-dialog-footer-buttons button {
    width: 120px;
    border-radius: 0px;
}*/
    /*.wheelsModalWindow .bootstrap-dialog-footer-buttons button:first-child {
        color: #fff;
        border: solid 2px #043658;
        background-color: #043658;
    }*/
    /*.wheelsModalWindow .bootstrap-dialog-footer-buttons button:first-child:hover {
            color: #000;
            border: solid 2px #043658;
            background-color: #f2c811;
        }*/
    /*.wheelsModalWindow .bootstrap-dialog-footer-buttons button:last-child {
        color: #000;
        border: solid 2px #c8c8c8;
        background-color: #c8c8c8;
    }*/
    /*.wheelsModalWindow .bootstrap-dialog-footer-buttons button:last-child:hover {
            color: #000;
            border: solid 2px #043658;
            background-color: #fff;
        }*/
    .wheelsModalWindow input[type=radio] {
        margin-right: 5px;
    }

    .wheelsModalWindow.emptyHeader .bootstrap-dialog-header {
        height: 16px;
        overflow: hidden;
    }

        .wheelsModalWindow.emptyHeader .bootstrap-dialog-header .bootstrap-dialog-close-button {
            height: 16px;
        }



    .MediumSize.labelLeft.modalWindowDateTime label {
        padding-top: 3px;
        padding-bottom: 3px;
    }

    .MediumSize.labelLeft.modalWindowDateTime input {
        height: 27px; /*21/7/22 kat*/
    }

    .wheelsModalWindow .MediumSize.labelLeft.modalWindowDateTime #simpleInputDialogtxt_text {
        width: calc(100% - 145px);
    }

    /* -------------------------------- Modal Top Css Start -------------------------------- */
    .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .modal-dialog {
        width: 60%;
        margin: 0px auto;
        height: 100%;
        padding-top: 75px;
        /*padding-top: 150px;*/
        max-width: 95% !important;
    }

    .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .bootstrap-dialog-body {
        height: calc(100vh - 450px);
    }
    /* --------------------------------- Modal Top Css End --------------------------------- */

    /* -------------------------------- Modal Middle Css Start -------------------------------- */
    .wheelsModalWindow.modal.bootstrap-dialog.middlePosition .modal-dialog {
        margin: 0px auto;
        padding-top: 75px;
    }

    .wheelsModalWindow.modal.bootstrap-dialog.middlePosition {
    }
    /* -------------------------------- Modal Middle Css Stop -------------------------------- */

    /* -------------------------------- Modal Right Css Start -------------------------------- */
    .wheelsModalWindow.modal.bootstrap-dialog.rightPosition .modal-dialog {
        width: 500px;
        position: absolute;
        right: 0px;
        margin: 0px auto;
        bottom: 0px;
        top: 72px;
    }

    .wheelsModalWindow.modal.bootstrap-dialog.rightPosition .bootstrap-dialog-body {
        height: calc(100vh - 222px);
    }

    .wheelsModalWindow.rightPosition .bootstrap-dialog-footer-buttons {
        text-align: left;
    }
    /* -------------------------------- Modal Left Css Start -------------------------------- */
    .wheelsModalWindow.modal.bootstrap-dialog.leftPosition .modal-dialog {
        width: 800px;
        position: absolute;
        left: 0px;
        margin: 0px auto;
        bottom: 0px;
        top: 72px;
    }

    .wheelsModalWindow.modal.bootstrap-dialog.leftPosition .bootstrap-dialog-body {
        height: calc(100vh - 222px);
    }
    /* --------------------------------- Modal Left Css End --------------------------------- */
    .bootstrap-dialog {
        /* dialog types */
        /**
     * Icon animation
     * Copied from font-awesome: http://fontawesome.io/
     **/
        /** End of icon animation **/
    }

        .bootstrap-dialog .modal-header {
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
        }

        .bootstrap-dialog .bootstrap-dialog-title {
            display: inline-block;
            font-size: 16px;
        }

        .bootstrap-dialog .bootstrap-dialog-message {
            font-size: 14px;
        }

        .bootstrap-dialog .bootstrap-dialog-button-icon {
            margin-right: 3px;
        }

        .bootstrap-dialog .bootstrap-dialog-close-button {
            font-size: 20px;
            float: right;
            opacity: 0.9;
            filter: alpha(opacity=90);
        }

            .bootstrap-dialog .bootstrap-dialog-close-button:hover {
                cursor: pointer;
                opacity: 1;
                filter: alpha(opacity=100);
            }

        .bootstrap-dialog.type-default .modal-header {
            background-color: #ffffff;
        }

        .bootstrap-dialog.type-default .bootstrap-dialog-title {
            color: #333;
        }

        .bootstrap-dialog.type-info .modal-header {
            background-color: #5bc0de;
        }

        .bootstrap-dialog.type-primary .modal-header {
            background-color: #337ab7;
        }

        .bootstrap-dialog.type-success .modal-header {
            background-color: #5cb85c;
        }

        .bootstrap-dialog.type-warning .modal-header {
            background-color: #f0ad4e;
        }

        .bootstrap-dialog.type-danger .modal-header {
            background-color: #d9534f;
        }

        .bootstrap-dialog.size-large .bootstrap-dialog-title {
            font-size: 24px;
        }

        .bootstrap-dialog.size-large .bootstrap-dialog-close-button {
            font-size: 30px;
        }

        .bootstrap-dialog.size-large .bootstrap-dialog-message {
            font-size: 18px;
        }

        .bootstrap-dialog .icon-spin {
            display: inline-block;
            -moz-animation: spin 2s infinite linear;
            -o-animation: spin 2s infinite linear;
            -webkit-animation: spin 2s infinite linear;
            animation: spin 2s infinite linear;
        }

    @-moz-keyframes spin {
        0% {
            -moz-transform: rotate(0deg);
        }

        100% {
            -moz-transform: rotate(359deg);
        }
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
        }

        100% {
            -webkit-transform: rotate(359deg);
        }
    }

    @-o-keyframes spin {
        0% {
            -o-transform: rotate(0deg);
        }

        100% {
            -o-transform: rotate(359deg);
        }
    }

    @-ms-keyframes spin {
        0% {
            -ms-transform: rotate(0deg);
        }

        100% {
            -ms-transform: rotate(359deg);
        }
    }

    @keyframes spin {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(359deg);
        }
    }

    /* --------------------------------- Modal Css End --------------------------------- */

    /* -------------------------------- Modal IdleSignIn Start -------------------------------- */
    body.modal-open.IdleSignIn form#def_Form,
    body.modal-open.IdleSignIn #mymenu {
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
        filter: blur(5px);
        z-index: 10;
    }

    /* --------------------------------- Modal IdleSignIn Css End --------------------------------- */

    /* -------------------------------- DBR Css Start -------------------------------- */
    .smaller label {
        width: 100px;
    }

    @media (-webkit-min-device-pixel-ratio:0) {
        #dbrGrid {
            height: calc(100% - 10px);
        }
    }

    @media (min-width: 992px) {
        .properties-view.summary-group .colcontainer-double .container-fluid .row .col-md-3.col-sm-4 {
            padding-left: 6px;
        }

            .properties-view.summary-group .colcontainer-double .container-fluid .row .col-md-3.col-sm-4:first-child {
                padding-left: 0px;
            }
    }

    @media (min-width: 768px) and (max-width: 991px) and (-webkit-min-device-pixel-ratio:0) {
        /*.entity-content {
            padding: 15px;
        }*/

        .colcontainer-double fieldset {
            width: 100%;
        }

        .properties-view.summary-group .colcontainer-double .container-fluid {
            padding-left: 0px;
            padding-right: 0px;
        }

            .properties-view.summary-group .colcontainer-double .container-fluid .row .col-md-3.col-sm-4:last-child {
                padding-top: 10px;
            }
    }

    /* --------------------------------- DBR Css End --------------------------------- */

    /* -------------------------------- Generic Fixes Css Start -------------------------------- */
    li > div.labelLeft > label {
        height: 100%;
        padding: 0px;
        margin-top: 5px;
        margin-bottom: 0px;
        text-align: left;
    }

    /*li #SelectedDate > #SelectedDate_text {
    width: 110px;
    margin: 0px;
    padding: 0px 10px;
    background-size: 16px;
    background-image: url('/public/images/icons/calendar3.png');
    background-repeat: no-repeat;
    background-position: calc(100% - 10px) 3px;
}*/

    /*li #SelectedDate > #SelectedDate_text {
    position: relative;
    background-size: 22px;
    background-image: url(../images/icons/calendar5.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - -0.7px) -1px;
}*/

    li #SelectedDate {
        width: unset;
        height: 100%;
    }

    li #btPreviousDate {
        padding-left: 10px;
    }

    li #btNextDate {
        padding-right: 10px;
    }

    #Stations label {
        text-align: center;
    }

    #toolbar .form-group.form-inline.checkBox input {
        vertical-align: sub;
    }

        #toolbar .form-group.form-inline.checkBox input + label {
            margin-bottom: 0px;
        }

    #toolbar .labelLeft.SmallSize {
        padding: 0px 10px;
        width: auto;
    }

    /* Checkbox Css Start */

    .chkboxright {
        padding-left: 140px;
        margin-top: -8px;
    }


    .labelLeft.chkboxright {
        height: 25px;
        min-width: 150px;
        margin-top: 0px;
        margin-left: 140px;
        padding-left: 0px;
    }


    .form-group.form-inline.checkBox {
        height: 25px;
        display: block;
        margin-bottom: 3px;
        white-space: nowrap; /*27/6/22 kat*/
    }

    .dialogBody #optionListContainer .form-group.form-inline.checkBox {
        text-align: center;
    }
    /* - Checkbox Css End - */

    div.SplitDateCont {
        width: unset;
    }

    div.SplitDate {
        width: unset;
        display: inline-block;
        padding-left: 5px;
    }

        div.SplitDate input {
            width: 100px;
        }

    #toolbar #fDateRange, #toolbar .labelLeft.LargeSize {
        /*margin-left: 5px;*/
    }

    /*#toolbar .labelLeft > label {
    width: auto;
    padding: 5px 5px 0 5px;
}*/

    #fTextBox input {
        width: 150px;
    }

    #fCurrencyFrom input, #fCurrencyTo input, #fNumericFrom input, #fNumericTo input {
        width: 60px;
    }

    .ui-state-active, .ui-widget-content .ui-state-active {
        border: 1px solid #007fff;
    }

    ul.list-unstyled > li > div.labelLeft.MediumSize {
        width: unset;
        display: inline-block;
    }

        ul.list-unstyled > li > div.labelLeft.MediumSize > label {
            width: unset;
            padding-left: 15px;
            padding-right: 15px;
        }


    #toolbar .LargeSize > .wheels-combobox > input {
        width: 200px;
    }


    #rdDateRange.LargeSize input.wheels-combobox-input {
        width: 150px;
    }

    #rdDateRange.labelLeft label {
        width: unset;
        padding: 0px 15px
    }
    /* --------------------------------- Generic Fixes Css End --------------------------------- */
    /*Fuelbox CSS*/
    /*input.fuel-Lvl-0 {
    background: #fff;
}*/
    input.fuel-Lvl-1 {
        background: linear-gradient(to bottom, #fff 0%,#fff 88%,#74e85a 88%,#74e85a 100%);
    }

    .fuel-Lvl-1.form-control[disabled], .fuel-Lvl-1.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-1 {
        background: linear-gradient(to bottom, #eee 0%, #eee 88%,#74e85a 88%,#74e85a 100%);
    }

    input.fuel-Lvl-2 {
        background: linear-gradient(to bottom, #fff 0%,#fff 75%,#74e85a 75%,#74e85a 100%);
    }

    .fuel-Lvl-2.form-control[disabled], .fuel-Lvl-2.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-2 {
        background: linear-gradient(to bottom, #eee 0%,#eee 75%,#74e85a 75%,#74e85a 100%);
    }

    input.fuel-Lvl-3 {
        background: linear-gradient(to bottom, #fff 0%,#fff 63%,#74e85a 63%,#74e85a 100%);
    }

    .fuel-Lvl-3.form-control[disabled], .fuel-Lvl-3.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-3 {
        background: linear-gradient(to bottom, #eee 0%,#eee 63%,#74e85a 63%,#74e85a 100%);
    }

    input.fuel-Lvl-4 {
        background: linear-gradient(to bottom, #fff 0%,#fff 50%,#74e85a 50%,#74e85a 100%);
    }

    .fuel-Lvl-4.form-control[disabled], .fuel-Lvl-4.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-4 {
        background: linear-gradient(to bottom, #eee 0%,#eee 50%,#74e85a 50%,#74e85a 100%);
    }

    input.fuel-Lvl-5 {
        background: linear-gradient(to bottom, #fff 0%,#fff 36%,#74e85a 36%,#74e85a 100%);
    }

    .fuel-Lvl-5.form-control[disabled], .fuel-Lvl-5.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-5 {
        background: linear-gradient(to bottom, #eee 0%,#eee 36%,#74e85a 36%,#74e85a 100%);
    }

    input.fuel-Lvl-6 {
        background: linear-gradient(to bottom, #fff 0%,#fff 25%,#74e85a 25%,#74e85a 100%);
    }

    .fuel-Lvl-6.form-control[disabled], .fuel-Lvl-6.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-6 {
        background: linear-gradient(to bottom, #eee 0%,#eee 25%,#74e85a 25%,#74e85a 100%);
    }

    input.fuel-Lvl-7 {
        background: linear-gradient(to bottom, #fff 0%,#fff 12%,#74e85a 12%,#74e85a 100%);
    }

    .fuel-Lvl-7.form-control[disabled], .fuel-Lvl-7.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-7 {
        background: linear-gradient(to bottom, #eee 0%,#eee 12%,#74e85a 12%,#74e85a 100%);
    }

    .fuel-Lvl-8.form-control[disabled], .fuel-Lvl-8.form-control[readonly], fieldset[disabled] .form-control.fuel-Lvl-8,
    input.fuel-Lvl-8, input.required.fuel-Lvl-8 {
        background: #74e85a;
    }



    input.efuel-Lvl {
        background: linear-gradient(to bottom, #fff 0%,#fff var(--percent),#74e85a var(--percent),#74e85a 100%);
    }

    .efuel-Lvl.form-control[disabled], .efuel-Lvl.form-control[readonly], fieldset[disabled] .form-control.efuel-Lvl {
        background: linear-gradient(to bottom, #eee 0%,#eee var(--percent),#74e85a var(--percent),#74e85a 100%);
    }


    /*DropZone Overrides*/
    .content-area .dropzone {
        min-height: 180px;
        min-width: 300px;
    }

        .content-area .dropzone .dz-preview > .dz-image,
        .content-area .dropzone .dz-preview.dz-file-preview .dz-image {
            border-radius: 0px;
        }
        /*    .content-area .dropzone .dz-preview > .dz-image > img {
            width: 100%;
            height: auto;
        }
        */
        .content-area .dropzone .dz-preview a.mask {
            display: none;
        }

        .content-area .dropzone .dz-preview > .dz-success-mark,
        .content-area .dropzone .dz-preview > .dz-error-mark {
            font-size: 24px;
            color: rgba(15, 245, 20, 0.5);
        }

        .content-area .dropzone .dz-preview a.mask.attachDelete {
            margin-left: 8px;
        }

        .content-area .dropzone .dz-preview a.single.attachDelete,
        .content-area .dropzone .dz-preview a.mask.attachRename {
            margin-right: 8px;
        }

        .content-area .dropzone .dz-preview .dz-filetype {
            margin-right: 8px;
            margin-top: 2px;
            width: 16px;
            height: 18px;
            display: inline-block;
            background-repeat: no-repeat;
            float: left;
            cursor: pointer;
        }

    .dz-filetype.pdf {
        background: url(../images/filetypes_sprite.png) -32px 0;
    }

    .dz-filetype.png {
        background: url(../images/filetypes_sprite.png) -48px 0;
    }

    .dz-filetype.doc {
        background: url(../images/filetypes_sprite.png) -64px 0;
    }

    .dz-filetype.xls {
        background: url(../images/filetypes_sprite.png) 0 0;
    }

    .dz-filetype.txt {
        background: url(../images/filetypes_sprite.png) -80px 0;
    }

    .dz-filetype.default {
        background: url(../images/filetypes_sprite.png) -16px 0;
    }

    .content-area .dropzone .dz-preview > .dz-error-mark {
        color: rgba(241, 26, 26, 0.5);
    }
    /*Now Attachment list overrides*/
    .content-area .attachments-box fieldset > .dropzone {
        border: solid 1px #bbb;
        padding: 8px 8px;
        min-height: 45px;
        max-height: 72px;
        overflow-y: auto; /*25/7/22 kat*/
    }

        .content-area .attachments-box fieldset > .dropzone .dz-message {
            margin: 5px 0px;
        }

        .content-area .attachments-box fieldset > .dropzone .dz-preview .dz-details .dz-size,
        .content-area .attachments-box fieldset > .dropzone .dz-preview .dz-image,
        .content-area .attachments-box fieldset > .dropzone .dz-preview a.single.attachDelete,
        .content-area .attachments-box fieldset > .dropzone .dz-preview a.single.attachEdit {
            display: none;
        }

        .content-area .attachments-box fieldset > .dropzone .dz-preview a.mask,
        div.dropzone.dz-clickable .mask.attachEdit > i {
            display: inline-block;
            cursor: pointer;
        }
    #attachEditDialog .MediumSize {
        width: auto;
    }

    #attachEditDialog {
        align-content: center;
    }
    .content-area .attachments-box fieldset > .dropzone .dz-preview {
        display: inline-block;
        max-height: 80px;
        margin: 5px;
        height: 25px;
        min-height: 25px;
        min-width: 80px;
        border-right: dotted 1px #555;
    }

        .content-area .attachments-box fieldset > .dropzone .dz-preview .dz-details {
            opacity: 0;
            padding: 2px 2px;
            color: rgba(0,0,0,0.9);
            line-height: 150%;
        }

        .content-area .attachments-box fieldset > .dropzone .dz-preview.dz-file-preview .dz-details {
            opacity: 1;
            position: relative;
            padding-right: 9px;
            z-index: 1;
            display: inline-block;
        }

        .content-area .attachments-box fieldset > .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
            overflow: unset;
        }


        .content-area .attachments-box fieldset > .dropzone .dz-preview .dz-progress {
            width: unset;
            top: 7px;
            left: 0px;
            right: 0px;
            margin-left: 0px;
            margin-top: 0px;
        }

        .content-area .attachments-box fieldset > .dropzone .dz-preview.dz-processing .dz-progress {
            opacity: 0.7;
        }

        .content-area .attachments-box fieldset > .dropzone .dz-preview.dz-complete .dz-progress {
            opacity: 0;
        }






    /*Damage Diagram*/
    div.damageeditor {
        position: relative;
        background-repeat: no-repeat;
        background-position: top left;
        background-size: contain;
        margin-bottom: 15px;
    }

    #toolBarDamage.toolbar-inline a {
        margin-top: 0px;
        height: 27px;
    }

    div.dmgpending,
    div.dmgdone {
        position: relative;
        color: #fff;
        background-color: darkorange;
        height: 16px;
        width: 16px;
        border-radius: 16px;
        opacity: 1;
        top: 0;
        left: 0;
        font-size: 11px;
        font-weight: bold;
        line-height: 16px;
        text-align: center;
    }

    div.dmgdone {
        background-color: lightsteelblue;
        color: #333;
    }

    div.damageeditor div.dmgpending,
    div.damageeditor div.dmgdone {
        position: absolute;
        opacity: 0.8;
    }

        div.damageeditor div.dmgpending.dmgfocused,
        div.damageeditor div.dmgdone.dmgfocused {
            -webkit-box-shadow: 0px 0px 3px 1px rgba(51,51,51,0.5);
            -moz-box-shadow: 0px 0px 3px 1px rgba(51,51,51,0.5);
            box-shadow: 0px 0px 3px 1px rgba(51,51,51,0.5);
            opacity: 1;
            background-color: red;
        }

        div.damageeditor div.dmgdone.dmgfocused {
            background-color: steelblue;
        }

    div.damageeditor div.dmgpending {
        cursor: pointer;
        min-width: 16px;
        min-height: 16px;
    }


    div.dmgfieldwrapper .ClearButtonWrapper {
        margin-left: 25px;
    }

    div.properties-view.dmgfieldwrapper {
        max-width: 975px;
    }


        div.properties-view.dmgfieldwrapper .colcontainer:first-of-type {
            max-width: unset;
            width: 510px;
        }

        div.properties-view.dmgfieldwrapper div.colcontainer.dmgedit {
            max-width: 405px;
        }

    a.btn {
        border-radius: 0px;
        text-decoration: none;
        color: #fff;
    }

    #VehiclefilterCombo {
        display: inline-block;
        float: right;
        width: 210px;
    }

        #VehiclefilterCombo label {
            width: 80px;
        }
    /*damage picture zoom*/
    div.dmgfieldwrapper #imgmodal {
        display: none;
        position: fixed;
        z-index: 100;
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto;
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
        display: flex;
        align-items: center;
    }

        div.dmgfieldwrapper #imgmodal img.modal-image {
            margin: auto;
            max-width: 70%;
            max-height: 90%;
        }

    div.dmgfieldwrapper .dropzone .dz-preview .dz-image {
        width: 300px;
        min-height: 200px;
    }

    /*.dropzone:not(#formAttachments) .dz-preview {
    width: 100%;
}*/


    h2 {
        font-size: 28px;
        color: #333;
        margin-bottom: 20px;
        font-style: normal !important;
    }

    input.autoNumeric {
        text-align: right;
    }

    .content-area .btCancel.btn,
    .content-area .btApply.btn,
    .modal .btn, .btCancel.btn,
    .btApply.btn, a.btCancel.btn,
    a.btApply.btn,
    a.btn.btn-primary,
    a.btn.btn-default {
        min-width: 100px;
        padding: 4px 5px;
        font-size: 12px;
        line-height: 16px;
        border-radius: 0px;
    }


    a.btn.btn-small {
        min-width: 60px!important;
        line-height: 17px!important;
        padding: 4px 5px;
        font-size: 12px;
        border-radius: 0px;
    }

    /*Rental overrides*/
    .rentalwrapper #rentaldata,
    .rentalwrapper #chargedata {
        float: left;
    }


    .rentalwrapper #rentaldata {
        margin-right: 20px;
    }

    .rentalwrapper .colcontainer-double {
        max-width: 725px;
    }

        .rentalwrapper .colcontainer-double fieldset {
            width: 724px;
        }

    .rentalwrapper .colcontainer {
        max-width: 352px;
        margin-right: 20px;
    }

        .rentalwrapper .colcontainer fieldset { /*kat 7/7/22*/
            width: 353px;
        }

    .rentalwrapper #chargedata .colcontainer,
    .rentalwrapper #chargedata .colcontainer fieldset { /*kat 7/7/22*/
        width: 223px;
    }

    .rentalwrapper .labelLeft > label {
        width: 101px; /*8/7/22 kat*/
        margin-right: 5px;
    }

    @media (max-width: 1025px) {
        .statusInd, .irnInd {
            font-size: 17px !important;
            white-space: nowrap; /*12/8/22 kat*/
        }

        .rentalwrapper .colcontainer {
            max-width: 100%;
            margin-right: 20px;
        }

            .rentalwrapper .colcontainer fieldset,
            .rentalwrapper .colcontainer-double,
            .rentalwrapper #chargedata .colcontainer, .rentalwrapper #chargedata .colcontainer fieldset {
                width: 100%;
            }

        .rentalwrapper #rentaldata, .rentalwrapper #chargedata {
            float: none;
        }

        .rentalwrapper .labelLeft > label {
            width: 140px;
            margin-right: 5px;
            padding-left: 0;
        }

        .rentalwrapper .labelRequired > label {
            padding-left: 12px;
        }
        #criteriabox fieldset { /*kat 28/7/22*/
            margin-top: 0px;
        }
        #grid-box { /*kat 28/7/22*/
            min-height: 150px;
        }
        .rentalwrapper .inline-group .labelLeft {
            clear: left;
        }

        #rdExtraday, #rdMayExtend {
            clear: none;
        }
    }

    .rentalwrapper #rdDelCharge > input,
    .rentalwrapper #rdColCharge > input {
        width: 65px;
    }

    .rentalwrapper #rdRemarksFrom > input {
        width: 180px;
    }


    @media (min-width: 1026px) {
        .rentalwrapper #rdDelCharge,
        .rentalwrapper #rdDelCharge > input,
        .rentalwrapper #rdColCharge,
        .rentalwrapper #rdColCharge > input {
            width: 65px;
        }

        .rentalwrapper #rdRemarksFrom,
        .rentalwrapper #rdRemarksFrom > input {
            width: 180px;
        }


        .rentalwrapper .labelLeft.AutoLabel {
            display: table;
        }

            .rentalwrapper .labelLeft.AutoLabel > label {
                display: table-cell;
                min-width: unset;
                width: unset;
                padding-right: 6px;
                padding-left: 12px;
            }

            .rentalwrapper .labelLeft.AutoLabel > input,
            .rentalwrapper .labelLeft.AutoLabel > select {
                display: table-cell;
            }
    }

    .rentalwrapper .labelLeft.AutoLabel > span.RequiredErrorRestore {
        display: none;
    }

    .rentalwrapper label.hasbutton {
        padding-top: 0px;
        margin-right: 0px;
    }

    .rentalwrapper a.btn.btn-default {
        width: 100%;
        min-width: unset;
        overflow: hidden; /*kat 7/7/22*/
        text-overflow: ellipsis; /*kat 7/7/22*/
        white-space: nowrap; /*kat 7/7/22*/
    }

    /*    border-radius: 0px;
    color: #333;
    padding: 4px 6px 5px 6px;
    background-color:#f0f0f0;
    font-size: unset;
}*/
    .rentalwrapper .CorporateSize, .rentalwrapper .CorporateSize div.wheels-combobox {
        width: 335px;
    }

    .rentalwrapper #rdResDate,
    .rentalwrapper #rdResUser,
    .rentalwrapper #rdDispDocno {
        width: 160px;
    }

    .rentalwrapper #rdSource,
    .rentalwrapper #rdBrand {
        width: 122px;
    }

        .rentalwrapper #rdResDate label,
        .rentalwrapper #rdResUser label,
        .rentalwrapper #rdSource label,
        .rentalwrapper #rdBrand label,
        .rentalwrapper #rdDispDocno label {
            width: 60px;
            max-width: 75px;
        }


    .rentalwrapper #rdOwnInsurance,
    .rentalwrapper #rdExtraday,
    .rentalwrapper #rdCorpPOA,
    .rentalwrapper #rdMayExtend,
    .rentalwrapper #ltRewrite {
        padding-left: 5px;
    }

    .rentalwrapper #rdCorpPOA{
        margin-top: 1px;
    }

    .rentalwrapper .checkBox label {
        padding-left: 3px;
    }

    .rentalwrapper .drivDetails {
        width: 100%;
        margin-top: -10px;
    }

    .rentalwrapper #rdPoNo {
        width: 209px;
    }

    .rentalwrapper #rdResmodeId {
        width: 225px;
    }

        .rentalwrapper #rdResmodeId .wheels-combobox, .rentalwrapper #rdResmodeId select {
            width: 120px;
        }

    .rentalwrapper #rdMoreDriv {
        width: 155px;
        clear: both;
    }

    .rentalwrapper #rdAgentRep {
        clear: both;
    }

    .rentalwrapper #rdConfno {
        width: 217px;
    }
    #ui_dialogs_rentalcarsearch_aspx .modal-content {
        height: 95%;
    }

    #ui_dialogs_rentalcarsearch_aspx .modal-body {
        overflow: auto;
        height: calc(100% - 110px);
    }
        #ui_dialogs_rentalcarsearch_aspx .modal-body #grid-box {
            min-height: 180px;
        }
        #ui_dialogs_rentalcarsearch_aspx .modal-body #searchValue {
            width: calc(100% - 205px);
            max-width: 250px;
        }
            #ui_dialogs_rentalcarsearch_aspx .modal-body #searchValue input {
                width: 100%;
            }

    .rentalwrapper #rdVoucherno {
        width: 227px;
        clear: both;
    }

    .rentalwrapper #LpVoucherNo {
        width: 232px;
        clear: both;
    }

    @media (max-width: 1025px) {
        .rentalwrapper .drivDetails {
            padding-top: 10px;
        }

        .konvajs-content, .konvajs-content canvas {
            max-width: 100%;
            height: auto !important;
        }
            .konvajs-content canvas:first-child {
                position: relative !important;
            }
    }

    @media (min-width: 1026px) {
        .rentalwrapper #rdPoNo {
            float: right;
        }

        .rentalwrapper #rdMoreDriv, .rentalwrapper #rdAgentRep, .rentalwrapper #rdVoucherno, .rentalwrapper #LpVoucherNo {
            clear: none;
            float: right;
        }

        .rentalwrapper #rdAgentRep {
            width: 246px;
        }
    }

    .rentalwrapper #LpVoucherNo .wheels-combobox {
        width: 156px; /*12/8/22 kat*/
    }


    .rentalwrapper #rdDateFrom, .rentalwrapper #rdDateTo {
        width: 247px;
    }

        .rentalwrapper #rdDateFrom input, .rentalwrapper #rdDateTo input {
            width: 147px;
        }
    #ui_dialogs_cancelrental_aspx .rentalwrapper #rdDateFrom input {
        width: 102px;
    }

    #ui_dialogs_cancelrental_aspx .wheels-combobox .wheels-combobox-input {
        width: 187px;
    }

    .rentalwrapper #rdTimeFrom, .rentalwrapper #rdTimeTo {
        width: 100px;
        padding-left: 0px;
    }

    .rentalwrapper #rdStationFrom .wheels-combobox, .rentalwrapper #rdStationFrom select, .rentalwrapper #rdStationTo .wheels-combobox, .rentalwrapper #rdStationTo select, .rentalwrapper #rdRemarksTo input {
        width: 246px;
    }

    .rentalwrapper #rdcLocationFrom .wheels-combobox, .rentalwrapper #rdcLocationFrom select, .rentalwrapper #rdcLocationTo .wheels-combobox, .rentalwrapper #rdcLocationTo select, .rentalwrapper #rdRemarksFrom {
        width: 176px;
    }

    .rentalwrapper.lease #rdcLocationFrom .wheels-combobox, .rentalwrapper.lease #rdcLocationFrom select, .rentalwrapper.lease #rdcLocationTo .wheels-combobox, .rentalwrapper.lease #rdcLocationTo select, .rentalwrapper.lease #rdRemarksFrom, .rentalwrapper.lease #rdRemarksFrom input {
        width: 247px;
    }

    .rentalwrapper #rdGroupRes {
        width: 45px;
    }

    .rentalwrapper.lease #rdFlightNo,
    .rentalwrapper.lease #rdGroup {
        width: 100px;
    }

        .rentalwrapper.lease #rdFlightNo input,
        .rentalwrapper.lease #rdGroup .wheels-combobox {
            display: none;
        }

    .rentalwrapper #rdModel,
    .rentalwrapper #rdModel > .wheels-combobox { /*kat 7/7/22*/
        width: 129px;
    }

    .rentalwrapper.lease #rdModel,
    .rentalwrapper.lease #rdModel > .wheels-combobox {
        width: 157px;
    }

    .rentalwrapper #rdPlateNo .wheels-combobox,
    .rentalwrapper #rdUserFrom .wheels-combobox,
    .rentalwrapper #rdUserTo .wheels-combobox {
        width: 113px;
    }

    .rentalwrapper #rdExcess {
        width: 133px; /*8/7/22 kat*/
    }

        .rentalwrapper #rdExcess label {
            padding-left: 5px;
        }

    .rentalwrapper #rdMileageFrom,
    .rentalwrapper #rdMileageTo { /*kat 7/7/22*/
        width: 87px;
    }

    .rentalwrapper #rdTankFrom,
    .rentalwrapper #rdTankTo {
        width: 35px;
    }

    #toolbar #rdResDocDisp { /*13/7/22 kat
    /*display: inline-block; 
    margin-left: 8px;
    width: 180px;*/
        display: inline-block;
        margin-left: 0px;
        width: 151px;
        padding: 0px;
        white-space: nowrap;
        margin-right: 5px;
        margin-top: 2px;
    }

        #toolbar #rdResDocDisp label {
            min-width: unset;
        }

        #toolbar #rdResDocDisp input {
            width: 100px;
        }

    #chargedata .labelLeft label { /*kat 7/7/22*/
        width: 93px;
    }

    #chargedata .labelLeft input,
    #chargedata .labelLeft .wheels-combobox, #chargedata .labelLeft select {
        max-width: 125px;
    }

    #chargedata .labelNone {
        margin-left: 2px;
    }

    #chargedata label.hasbutton {
        margin-right: 3px;
    }

    .rentalwrapper #rdMileageAllowed { /*kat 7/7/22*/
        width: 168px;
    }

        .rentalwrapper #rdMileageAllowed input {
            width: 70px;
        }

    .rentalwrapper #rdKmRate {
        width: 53px;
    }

    .rentalwrapper #rdRPD {
        width: 53px;
    }

    .rentalwrapper #rdRentalCharge {
        width: 70px;
    }

    /*.rentalwrapper #rdDiscountPlan {  /*kat 7/7/22
    width: 158px;
}*/

    .rentalwrapper #rdDiscountPlan .wheels-combobox {
        width: 60px;
    }

    .rentalwrapper #rdDiscAmount {
        width: 63px;
    }

    .rentalwrapper #lsInsurCost {
        width: 60px;
    }

    .rentalwrapper #lsKaskoCost {
        width: 63px;
    }

    .rentalwrapper #rdTax1Perc,
    .rentalwrapper #rdTax2Perc,
    .rentalwrapper #rdPaid,
    .rentalwrapper #lsBillCycles,
    .rentalwrapper #lsSummerCost,
    .rentalwrapper #lsWarrantyPayments,
    .rentalwrapper #lsTireSetRead,
    .rentalwrapper #rdfdepAm,
    .rentalwrapper #rdDiscountPlan { /*kat 7/7/22*/
        width: fit-content;
    }

        .rentalwrapper #rdFuelPolicy .wheels-combobox,
        .rentalwrapper #rdTax1Perc input,
        .rentalwrapper #rdTax2Perc input,
        .rentalwrapper #rdPaid input,
        .rentalwrapper #rdfdepAm input,
        .rentalwrapper #lsBillCycles input,
        .rentalwrapper #lsSummerCost input,
        .rentalwrapper #lsWarrantyPayments input,
        .rentalwrapper #lsTireSetsRead input {
            width: 60px;
        }

    .rentalwrapper #rdFuel,
    .rentalwrapper #rdTax1Amount,
    .rentalwrapper #rdTax2Amount,
    .rentalwrapper #rdBal,
    .rentalwrapper #rdfdepBal,
    .rentalwrapper #lsBilled,
    .rentalwrapper #lsWarrantyAmount,
    .rentalwrapper #lsWinterCost,
    .rentalwrapper #lsTiresUsed {
        width: 63px;
    }

        .rentalwrapper #rdBal .autoNumeric,
        #RentalChargesTable #rdBal_input .autoNumeric,
        .rentalwrapper #rdBal .autoNumeric,
        .rentalwrapper #rdfdepBal .autoNumeric,
        .rentalpay #rdCustBal .autoNumeric,
        .rentalpay #rdCustBal .autoNumeric {
            color: red;
        }

        .rentalwrapper #rdBal .autoNumeric-zero,
        .rentalwrapper #rdBal .autoNumeric-zero,
        #RentalChargesTable #rdBal_input .autoNumeric-zero,
        .rentalwrapper #rdfdepBal .autoNumeric-zero,
        .rentalpay #rdCustBal .autoNumeric-zero,
        .rentalpay #rdCustBal .autoNumeric-zero {
            color: #555;
        }

    .rentalwrapper #lsBillStart {
        width: 230px;
    }

        .rentalwrapper #lsBillStart input,
        .rentalwrapper #lsBillEnd {
            width: 122px;
        }

    .strongTotal label,
    .strongTotal input {
        font-weight: bold;
    }


    #lsbtnInsur {
        display: inline-block;
        max-width: 125px;
        margin-bottom: 5px;
    }

    #paysum input {
        width: 100px;
        margin-right: 5px;
    }

    .rentalexchanges #lsAnnualReplacements,
    .rentalexchanges #lsTotalReplacements,
    .rentalexchanges #lsCumulativeAnnual,
    .rentalexchanges #lsCumulativeReplacements {
        width: 150px;
    }

        .rentalexchanges #lsAnnualReplacements input,
        .rentalexchanges #lsTotalReplacements input,
        .rentalexchanges #lsCumulativeAnnual input,
        .rentalexchanges #lsCumulativeReplacements input {
            width: 50px;
        }

        .rentalexchanges #lsAnnualReplacements label,
        .rentalexchanges #lsTotalReplacements label,
        .rentalexchanges #lsCumulativeAnnual label,
        .rentalexchanges #lsCumulativeReplacements label {
            width: 100px;
        }

    #paysum {
        width:100%;
    }

        #paysum label {
            min-width: 65px;
        }

        #paysum #rdCommtot label {
            min-width: 46px;
        }
        #paysum #rdCommtot input {
            width: 80px;
        }
        /*#paysum #rdCustPaid label,
#paysum #rdCustBal label,
#paysum #rdExCustTotal label,
#paysum #rdAgentPaid label,
#paysum #rdAgentBal label,
#paysum #rdLCustPaid label,
#paysum #rdLCustBal label,
#paysum #rdExAgentTotal label {
    min-width: unset;
}*/
        /*#paysum #rdLCustBal label,
    #paysum #rdLCustTotal label {
        width: 27px;
    }
#paysum #rdLCustPaid label {
    width:29px;
}*/
        /*#paysum #rdPreauthNo label,
#paysum #rdExchRate label,
#paysum #rdPreAuthAmount label {
    width: 95px;
}*/
        #paysum #rdExchRate input {
            width: 52px;
            margin-right: 0px;
        }

        #paysum #rdExchDate input {
            width: 83px;
            background-image: none;
        }

        /*#paysum #rdPreauthNo input,
#paysum #rdPreAuthAmount input
{
    width: 120px;
    margin-right: 0px;
}*/
        #paysum #rdDepositAmount,
        #paysum #rdDepositPaid {
            /*width: 110px;
    margin-left: 5px;*/
            display: none;
        }
    /*#paysum #rdDepositAmount input,
    #paysum #rdDepositPaid  input{
        width: 90px;
        margin-right: 0px;
    }
    #paysum #rdDepositAmount label,
    #paysum #rdDepositPaid label {
        width: 65px;
    }*/
    .rentalpay #rdPaymentsGrid,
    .rentalexchanges #rdExchangesGrid,
    .invtab #invoicesgrid,
    .invtab #tollsGrid,
    .invtab #lschargesgrid {
        height: 500px;
    }

    .rentalwrapper #OrigFrom,
    .rentalwrapper #OrigTo {
        width: 217px;
    }

        .rentalwrapper #OrigFrom input:read-only,
        .rentalwrapper #OrigTo input:read-only,
        .rentalwrapper #OrigVoucher input:read-only {
            color: red;
        }

        .rentalwrapper #OrigFrom label,
        .rentalwrapper #OrigTo label {
            width: 86px;
        }

    .rentalwrapper div.leaseOnly,
    .rentalwrapper div.inline-group.leaseOnly,
    .rentalwrapper fieldset legend.leaseOnly,
    .rentalexchanges div.leaseOnly,
    .rentalexchanges fieldset.leaseOnly {
        display: none;
    }


    .rentalwrapper.lease div.nolease,
    .rentalwrapper.lease div.inline-group.nolease,
    .rentalwrapper.lease fieldset.nolease,
    .rentalwrapper.lease fieldset.lease div.nolease,
    .rentalwrapper.lease fieldset legend.nolease,
    .rentalexchanges.lease div.nolease {
        display: none;
    }

    .rentalwrapper.lease div.leaseOnly,
    .rentalwrapper.lease div.inline-group.leaseOnly,
    .rentalwrapper.lease #chargedata.lease div.leaseOnly,
    .rentalwrapper.lease fieldset legend.leaseOnly,
    .rentalwrapper.lease #chargedata.lease div.inline-group.leaseOnly,
    .rentalexchanges.lease fieldset.leaseOnly,
    .rentalexchanges.lease div.leaseOnly {
        display: block;
    }

    .rentalwrapper #lsAccountManager {
        display: none;
    }

    .rentalwrapper.lease #lsAccountManager {
        display: table;
        width: 320px;
    }

    div.leasetab fieldset.full-width {
        max-width: 964px;
        width: unset;
    }

        div.leasetab fieldset.full-width div.inline-group div.SmallSize {
            width: 180px;
        }

    div.properties-view.full-height div.leasetab {
        min-height: 400px;
    }


    .dropzone .dz-preview.dz-file-preview .dz-image {
        background-image: none !important;
        background: none !important;
    }

    .dropzone {
        padding: 0px !important;
    }

        .dropzone:not(#formAttachments) {
            padding: 0px !important;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .dropzone .dz-preview .dz-image {
            width: auto !important;
            height: auto !important;
            text-align: center;
            display: inline;
            justify-content: center;
            /*transform: translateX(-16px);*/
        }

            .dropzone .dz-preview .dz-image:before {
                content: "";
                /*display: inline-block;*/
                vertical-align: middle;
                height: 100%;
            }

            /*.dropzone .dz-preview{
        width: 100%;
        text-align: center;
    }  */


            .dropzone .dz-preview .dz-image img {
                /*display: inline-block !important;*/
                max-width: 268px;
                max-height: 138px;
                vertical-align: middle;
                cursor: pointer;
            }
    #dmgPhotoUpload .dz-details {
        display: none;
    }
    /* @media (min-width: 768px) and (max-width: 991px) { */
    #rdTransport_text, #rdInsurance_text, #rdExtras_text,
    #rdSurcharges_text, #rdVoucherVal_text {
        min-width: 125px;
    }

    #rdAgentRep div.wheels-combobox {
        width: 162px; /*kat 27/7/22*/
    }

    @media (min-width: 1026px) {
        #rdAgentRep div.wheels-combobox {
            display: table-cell;
        }
    }

    #rdAgentRep select {
        width: 157px;
    }

    #rdPoNo input {
        width: 155px;
    }

    #rdVoucherno input {
        width: 156px; /*13/7/22 kat*/
    }

    #rdVoucherno label {
        width: 96px;
    }
    /* #rdAgentRep div.wheels-combobox, #rdVoucherno div.wheels-combobox {
        width: 150px;
    } */
    /* #rdAgentRep > label, #rdVoucherno > label {
        min-width: 100px;
    } */
    #rdAgentRep, #rdVoucherno {
        min-width: 250px;
    }
    /* } */

    /*Multicolumn combobox*/
    .ui-widget-header.multicombo {
        border: none;
        /* border-top: solid 1px #bbb;*/
        pointer-events: none !important; /*very important to avoid bubbling errors on click*/
    }

        .ui-widget-header.multicombo > span {
            display: inline-block;
            border: none;
            padding: 4px 4px;
            box-sizing: border-box;
            border-right: solid 1px #bbb;
        }


            .ui-widget-header.multicombo > span.ui-state-active {
                background: none;
                border: none;
                color: #333;
                border-right: solid 1px #bbb;
                font-weight: bold;
            }

    .ui-menu-item.multicombo > span {
        display: inline-block;
        box-sizing: border-box;
    }

        .ui-widget-header.multicombo > span:last-of-type,
        .ui-menu-item.multicombo > span:last-of-type {
            border-right: none;
        }

    /*
    NOTES
*/
    .notes-box {
        position: absolute;
        right: 0px;
        height: calc(100% - -1px);
        top: -6px;
        background-color: #fff;
        z-index: 99;
    }

    .notes-collapsed {
        min-height: 20px;
        display: block;
        height: 100%;
        background-color: #3d3d3d; /*kat 21/6/22*/
    }


    .notes-expanded {
        width: 280px;
        border: #d3d3d3; /*kat 21/6/22*/
        border-top: #3d3d3d; /*kat 30/6/22*/
        border-right: #3d3d3d; /*kat 30/6/22*/
        border-style: solid;
        border-width: 1px;
        display: none;
        height: fit-content; /*13/7/22 kat*/
        min-height: 100%; /*13/7/22 kat*/ /*kat 12/7/22*/
        background-color: rgb(254 254 254); /*kat 21/6/22*/
    }

    .notes-panel {
        padding: 0px 5px 0px 5px;
    }

    .notes-expanded .btn-cancel-note,
    .notes-expanded .btn-add-note {
        font-size: 12px;
    }
    .btn-add-note { /*kat 21/6/22*/
        margin-right: 5px;
    }

    .notes-expanded .noteLabel {
        color: rgb(150, 150, 150);
        width: 68px;
        /*float: left;*/
    }

    .notes-expanded .notes-list .user-note {
        min-height: 100px;
        margin-top: 5px;
        padding-top: 5px;
        margin-bottom: 5px;
        border-top: dashed 2px #cccccc;
        position: inherit;
        overflow-y: auto;
        overflow-x: hidden;
    }


    .notes-expanded .add-note-wrapper {
        margin-top: 25px; /*kat 21/6/22*/
        /*margin-bottom: 5px;*/
        display: none;
        height: 167px;
    }

    .notes-list {
        margin-top: 25px; /*kat 21/6/22*/
    }

    .alert {
        margin-bottom: 0px;
        position: fixed;
        bottom: 30px;
        cursor: pointer;
        z-index: 100;
        border-radius: 0px;
        font-size: 14px;
        display: flex;
        flex-direction: column;
        align-items: center;
        right: -100%;
    }

        .alert i {
            font-size: 30px;
        }

        .alert strong {
            padding-left: 5px;
            font-size: 16px;
        }

    @media(max-width: 1025px) {
        .notes-expanded .add-note-wrapper {
            height: 207px;
        }
    }


    .notes-expanded .notes-list .user-note .mark-comment-unread,
    .notes-expanded .notes-list .user-note .mark-comment-otherread,
    .notes-expanded .notes-list .user-note .mark-comment-read,
    .notes-expanded .notes-list .user-note .mark-comment-public,
    .notes-expanded .notes-list .user-note .mark-comment-delete,
    .notes-expanded .notes-list .user-note .mark-comment-readit {
        float: right;
        font-size: 14px;
        color: rgb(64, 124, 206);
        margin-top: -3px;
        margin-right: 1px;
        outline: 0px;
        text-decoration: none;
    }

    .notes-expanded .notes-list .user-note .mark-comment-read {
        color: rgb(38, 146, 38);
    }

    .notes-expanded .notes-list .user-note .mark-comment-public {
        font-size: 16px;
        color: rgb(38, 146, 38);
    }

    .notes-expanded .notes-list .user-note .mark-comment-unread {
        color: rgb(163, 174, 190);
    }

    .notes-expanded .notes-list .user-note .mark-comment-otherread {
        color: rgb(176, 190, 176);
    }

    .notes-expanded .notes-list .user-note .mark-comment-delete {
        color: #b30000;
        margin-right: 2px;
    }

    .notes-expanded .notes-list .user-note .mark-comment-readit > i.fa-envelope {
        display: inline;
    }

    .notes-expanded .notes-list .user-note .mark-comment-readit > i.fa-envelope-open {
        display: none;
    }


    .notes-expanded .notes-list .user-note .mark-comment-read > i.fa-envelope {
        display: none;
    }

    .notes-expanded .notes-list .user-note .mark-comment-read > i.fa-envelope-open {
        display: inline;
    }

    .notes-expanded .notes-list .user-note .sender {
        display: inline-block;
        margin-right: 5px;
        font-weight: 300;
        color: black;
    }

    .notes-expanded .notes-list .user-note .text {
        position: relative;
        top: 0;
        min-height: 50px;
        overflow-y: auto;
        background-color: #e8e8e8;
        margin-top: 5px;
        margin-bottom: 1px;
        overflow-x: hidden;
        word-break: break-all;
        padding: 0px 5px;
    }

    .notes-expanded .notes-list .user-note .mark-comment-readit > i.fa-envelope-open {
        display: none;
    }


    .notes-expanded .notes-list .user-note .mark-comment-read > i.fa-envelope {
        display: none;
    }

    /*.notes-expanded .new-note .note-input .input-control {
            position: absolute;
            left: 68px;
            top: 0;
            bottom: 0;
            right: 0;
        }*/


    .notes-expanded .add-note-users .wheels-combobox {
        width: 205px;
        float: right;
    }

    .notes-expanded .add-note-users > label {
        width: 50px;
    }

    @media (max-width: 1025px) {
        .notes-expanded .add-note-users > label {
            padding-top: 8px;
        }

        .add-note-urgent > label {
            padding-top: 3px;
        }
    }

    .notes-expanded .recipient {
        float: left;
    }

    .notes-toolbar { /*kat 21/6/22*/
        background-color: #3d3d3d; /*kat 21/6/22*/
        height: 27px; /*kat 21/6/22*/
        display: inline-block;
        width: 100%;
        border-width: 0px;
        position: relative; /*kat 21/6/22*/
        z-index: 1;
        width: 279px; /*kat 22/6/22*/
        padding-top: 2px
    }
    .notes-collapsed .notes-toolbar { /*kat 21/6/22*/
        cursor: pointer;
        padding: 5px 3.5px;
        width: fit-content;
        height: 100%;
    }
    .notes-toolbar .note-tool-button.notes-expand {
        cursor: pointer;
        margin: 0px 2px;
        color: white;
    }

    .notes-collapsed .notes-toolbar > span { /*kat 21/6/22*/
        background-image: url(/public/images/notes.svg);
        background-repeat: no-repeat;
        display: block;
        text-indent: -100px;
        width: 14px;
        height: 90px;
        background-size: 56px;
        top: 40%;
    }

    .notes-toolbar .note-tool-button.notes-collapse {
        background-color: transparent; /*kat 21/6/22*/
        float: left;
        margin: 0px 3px; /*kat 21/6/22*/
        font-weight: 300;
        cursor: pointer;
        color: white; /*kat 21/6/22*/
        width: fit-content; /*kat 21/6/22*/
        font-size: inherit; /*kat 21/6/22*/
    }
    .notes-toolbar span.note-tool-button.notes-collapse { /*kat 22/6/22*/
        width: calc(100% - 22px); /*kat 22/6/22*/
        font-size: larger;
        display: flex;
        text-align-last: start;
        padding: 0px 5px;
        color: white;
        float: left;
        cursor: pointer; /*kat 22/6/22*/
    }

    .notes-toolbar .note-tool-button.add-note {
        background-color: transparent; /*kat 21/6/22*/
        color: white;
        float: left;
        /*margin-right: 4px;*/ /*kat 21/6/22*/
        font-weight: 300;
        cursor: pointer;
        color: rgb(61 61 61);
        margin: 7px 5px; /*kat 21/6/22*/
        font-size: larger; /*kat 21/6/22*/
    }

    .notes-toolbar .note-tool-button {
        width: 16px;
        top: 2px;
        position: relative;
        -ms-border-radius: 3px;
        border-radius: 3px;
        text-align: center;
        color: black;
        cursor: pointer;
    }
        .notes-toolbar .note-tool-button i.fa-chevron-right, /*kat 21/6/22*/
        .notes-toolbar .note-tool-button i.fa-chevron-left {
            font-weight: 500;
        }

    .notes-toolbar div.note-tool-button.notes-expand { /*kat 21/6/22*/
        position: absolute;
        margin-left: 0px; /*kat 22/6/22*/
        margin-right: 0px;
        margin-top: 5px; /*kat 22/6/22*/
    }
    .notes-toolbar .note-tool-button.btn-refresh-notes {
        background-color: transparent; /*kat 21/6/22*/
        float: right;
        /*margin-right: 4px;*/ /*kat 21/6/22*/
        font-weight: 300;
        cursor: pointer;
    }

    .add-note-urgent {
        height: 33px;
        margin-top: 7px;
    }

        .add-note-urgent > label {
            float: left;
            width: 66px;
        }

    .notes-panel .urgentNote {
        font-size: 12px;
        color: rgb(201, 23, 23);
    }

        .notes-panel .urgentNote .xmark {
            width: 17px;
            text-align: center;
        }

    @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) {
        .navbar-form {
            margin-top: 3px;
        }

        #close-button {
            top: 11px;
        }

        #search-icon {
            top: 13px;
        }

        .middleTopPosition.wheelsModalWindow .modal-body {
            overflow: auto; /*kat 7/10/22*/
            padding-bottom: 5px;
        }
    }


    /*  daterangepicker     start */
    .daterangepicker {
        border-radius: 0px;
        margin-top: 0px;
    }

        .daterangepicker:before {
            top: -7px;
            border-right: 0px solid transparent;
            border-left: 0px solid transparent;
            border-bottom: 0px solid #ccc;
        }

        .daterangepicker:after {
            top: -6px;
            border-right: 0px solid transparent;
            border-bottom: 0px solid #fff;
            border-left: 0px solid transparent;
        }

        .daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
            border-radius: 0px;
        }

        .daterangepicker .calendar-table {
            border-radius: 0px;
        }

        .daterangepicker td.in-range {
            background-color: #a6c5db;
        }

        .daterangepicker td.active, .daterangepicker td.active:hover {
            background-color: #215b7d;
        }

        .daterangepicker .ranges li.active {
            background-color: #215b7d;
        }

    .cancelBtn {
        color: #000;
        border: solid 1px #c8c8c8;
        background-color: #c8c8c8;
    }

        .cancelBtn:hover {
            color: #000;
            border: solid 1px #0874aa;
            background-color: #fff;
        }

    .applyBtn {
        color: #fff;
        border: solid 1px #0874aa;
        background-color: #0874aa;
    }

        .applyBtn:hover {
            color: #000;
            border: solid 1px #0874aa;
            background-color: #fff;
        }

    .DateRangeSize > input {
        width: 155px;
    }
    /*  daterangepicker     end  */

    .ag-theme-balham .ag-cell {
        line-height: 24px;
    }


    .estatements-checkbox {
        padding-right: 6px;
    }



    /* -------------------------------- selectionsList menu Css Start -------------------------------- */
    #toolbar li > ul.list-unstyled.selectionsList {
        width: auto;
        /*border: solid #215b7d 1px;*/
        height: auto;
        display: none;
        z-index: 10000;
        position: absolute;
        background-color: #fff;
        box-shadow: 0 6px 12px rgba(0,0,0,.175);
        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    }

        #toolbar li > ul.list-unstyled.selectionsList *,
        #toolbar li > ul.list-unstyled.selectionsList a > .fal {
            color: #215b7d;
        }

        #toolbar li > ul.list-unstyled.selectionsList > li.selectionCont {
            padding: 0px;
        }

            #toolbar li > ul.list-unstyled.selectionsList > li.selectionCont:hover *,
            #toolbar li > ul.list-unstyled.selectionsList > li.selectionCont:hover > a > .fal {
                color: #fff;
                background-color: #215b7d;
            }

            #toolbar li > ul.list-unstyled.selectionsList > li.selectionCont a {
                display: block;
                padding: 5px 15px;
            }

                #toolbar li > ul.list-unstyled.selectionsList > li.selectionCont a.toolbarHidden {
                    display: none;
                }

    li > ul.list-unstyled.selectionsList > li.selectionCont a:hover {
    }
    /* --------------------------------- selectionsList menu Css End --------------------------------- */

    a.linkError:link {
        color: #FFF;
        text-decoration: none;
        font-weight: normal;
    }

    a.linkError:visited {
        color: #FFF;
        text-decoration: none;
        font-weight: normal;
    }

    a.linkError:hover {
        color: #FFF;
        text-decoration: underline;
        font-weight: normal;
    }

    a.linkError:active {
        color: #FFF;
        text-decoration: none;
        font-weight: normal;
    }

    .cropper-modal {
        background-color: #FFF;
        /*opacity: .5;*/
    }

    .cropper-container {
        max-height: 100%;
    }
    .dividerSpan {
        border-right: dotted 1px #555;
    }

    .ag-theme-balham .ag-row-footer {
        background-color: #fff !important;
        font-weight: bold;
    }

    .subMenu {
    }

    #toolbar a.subMenu {
        border-radius: 0;
        border: 0;
    }


    .lookup-area .action-buttons {
        position: absolute;
        bottom: 0px; /*21/7/22 kat*/
    }

        .lookup-area .action-buttons .form-group {
            margin-bottom: 0;
        }

    /* IPAD PORTRAIT */
    @media (max-width: 1025px) {
        .hasClick .caption, .LabelHiddenXS > label {
            display: none;
        }

        .extratreecontainer li .hasClick .caption {
            display: block;
        }

        /*.lookup-area {  /*21/7/22 kat
        height: calc(100% - 1px);
    }*/

        /*.lookup-area .action-buttons,*/ /*21/7/22 kat*/
        .sidepane .action-buttons {
            bottom: 40px;
        }
    }

    .sidepane {
        background-color: #fff;
    }

    .gridtoolbar {
        margin-bottom: 4px;
    }

    .hold-select > input[type=checkbox] {
        margin-top: 10px;
        margin-right: 5px !important;
    }

    .hold-select > label {
        margin-bottom: 5px;
        margin-right: 5px;
        vertical-align: middle;
    }


    @media only screen and (min-device-width: 767px) and (max-device-width: 1200px) and (orientation: landscape) {
        /*.col-sm-4.lookup-area.custBoot {  /*21/7/22 kat
        height: calc(100% - 1px);
    }*/

        .col-sm-8.custBoot {
            padding-right: 0px;
        }

        /*.filtersCont, #scheduleReport {  /*21/7/22 kat
        height: calc(100% - 80px);
        overflow-y: auto;
    }*/


        /*#reportGrid {  /*21/7/22 kat
        height: calc(100% - 10px) !important;
    }*/
    }

    @media only screen and (min-device-width: 1201px) and (max-device-width: 1300px) and (orientation: landscape) {
        /*.col-sm-4.lookup-area.custBoot {  /*21/7/22 kat
        height: calc(100% - 1px);
    }*/

        .col-sm-8.custBoot {
            padding-right: 0;
        }

        .filtersCont, #scheduleReport {
            height: calc(100% - 50px);
            overflow-y: auto;
        }

        /*#reportGrid {
        height: calc(100% - 10px) !important;  /*21/7/22 kat
    }*/
    }


    span.bingLogoLight {
        display: none !important;
    }

    .MicrosoftMap,
    .MicrosoftMap .as_container .line1,
    .MicrosoftMap .as_container .line2 {
        font-family: 'Manrope' !important;
    }

        .MicrosoftMap .line1,
        .MicrosoftMap .line2 {
            display: inline-block !important;
            width: auto !important;
        }

        .MicrosoftMap .as_container_search .asOuterContainer {
            border-top-width: 1px !important;
        }

    #as_containerSearch {
        left: 140px !important;
        width: 265px !important;
        /*top: 68px !important;*/
    }

    .MicrosoftMap .as_container ul {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .MicrosoftMap li {
        padding-top: 3px;
        padding-bottom: 3px;
        border-bottom: 1px solid #e6e6e6 !important;
    }


    .MicrosoftMap .line1 {
        font-weight: 700 !important;
        font-size: 12px !important;
        padding-right: 3px !important;
        white-space: nowrap !important;
    }

    .MicrosoftMap .line2 {
        color: #999;
        font-size: 11px !important;
        white-space: nowrap !important;
    }

    .MicrosoftMap .as_container ul li {
        overflow: hidden;
        height: 25px;
        white-space: nowrap !important;
    }

    .MicrosoftMap .as_img {
        width: 18px !important;
        height: 18px !important;
        background-size: contain !important;
        /*display: none !important;*/
    }

    .suggestLink {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }



    .AzureAutoSuggest-ul li {
        padding-top: 3px !important;
        padding-bottom: 3px !important;
        border-bottom: 1px solid #e6e6e6 !important;
        overflow: hidden;
        height: 25px;
        white-space: nowrap !important;
        font-family: 'Manrope' !important;
    }

        .AzureAutoSuggest-ul li .marker {
            width: 18px;
            height: 18px;
            margin-right: 0;
            background-position: left center;
            display: inline-block;
            padding-right: 12px;
            background-repeat: no-repeat;
            -ms-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            flex: 1 1 auto;
            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeBAMAAADJHrORAAAAMFBMVEVHcExtbnFtbnFtbnFtbnFtbnFtbnFtbnFtbnFtbnFtbnH////S0tO2t7ikpaaSkpU+nsJBAAAACnRSTlMA3BA4kMBlIICgSzf0sQAAAI1JREFUGJVjYKAJMOtIRuaqrFq1ygnBZZIC8hcWwPmsq9bf/bUqAM7PWnV6955Vy+B8r/W7d+/+tQTOj1oL5N9aCudLgfkLEfLrgPxXCHl087RWrTvzatUiOJ9zFQhMgPPZwXyE+xi6gNwVSP5RBPKFkPjMQL4Bsoe9Vi1B5jIwrhJA4bMjmw4Cxgy0AQDoZT5XEngrBgAAAABJRU5ErkJggg==);
            background-size: contain !important;
        }

        .AzureAutoSuggest-ul li .line1 {
            font-weight: 700 !important;
            font-size: 12px !important;
            padding-right: 3px !important;
        }

        .AzureAutoSuggest-ul li .line2 {
            color: #999;
            font-size: 11px !important;
            white-space: nowrap !important;
        }

        .AzureAutoSuggest-ul li .line1, .AzureAutoSuggest-ul li .line2 {
            display: inline-block !important;
            width: auto !important;
            white-space: nowrap !important;
            vertical-align: middle !important;
        }

    .AzureAutoSuggest-ul .ui-menu-item .ui-menu-item-wrapper.ui-state-active {
        background-color: #dcecf8 !important;
        color: black !important;
        border-color: #dcecf8 !important;
    }

    form.dlgForm {
        background-color: #fff;
    }

    .expandMemo {
        margin-left: 5px;
    }

        .expandMemo:hover {
            color: blue;
            cursor: pointer;
        }

    .field-value-already-exists {
        padding-top: 7px;
        color: red;
        font-weight: bold;
        font-size: 14px;
    }


    /* -------------------------------- Sign in Pages Css Start -------------------------------- */


    .g-recaptcha {
        transform: scale(0.83);
        transform-origin: 0 0;
    }

    .formdiv .error-text-color {
        color: #DC143C;
    }

    .formdiv .error-container {
        color: #DC143C;
    }

    .formdiv .login-error-container {
        margin-top: 10px;
        text-align: center;
    }


    .formdiv {
        font-size: 13px;
        background-color: #fff;
        padding: 0px;
        padding-top: 20px;
        position: relative;
        box-sizing: border-box;
    }

    @media only screen and (max-width: 768px) {
        #toolbar #rdDateRange.labelLeft { /*21/7/22 kat*/
            display: flex;
            flex-wrap: nowrap;
            width: 250px;
        }
            #toolbar #rdDateRange.labelLeft label { /*21/7/22 kat*/
                padding: 0px;
                width: 122px;
            }
    }

    .formdiv label {
        display: block;
        font-weight: normal;
        margin-bottom: 3px;
    }

    #rblRecoveryOptions label {
        display: inline-block;
        margin-bottom: 6px;
        margin-left: 10px;
    }

    #signInFields .logoContainer,
    #sign-in .logoContainer {
        max-width: 220px;
        overflow: hidden;
        margin: 0 auto 20px;
    }

    #signInFields, #sign-in, #branding-logo,
    .formdiv footer,
    .formdiv.forgot-pass-page footer {
        margin: auto;
        width: 85%;
        max-width: 385px;
    }

    .formdiv footer,
    .formdiv.forgot-pass-page footer {
        font-size: 12px;
        text-align: center;
        padding: 5px;
    }
        .formdiv footer p {
            margin: 0px;
        }

    .brand-div {
        overflow: hidden;
        height: calc(100vh);
        background-size: cover;
        background-image: url(../images/stock/vertical-1.jpg);
        background-repeat: no-repeat;
        background-position: center center;
    }

        .brand-div img {
            width: 100%;
        }

    #signInFields h3, #sign-in h3 {
        margin-bottom: 20px;
    }

    #signInFields input.required, #signInFields input[type=text],
    #sign-in input.required, #sign-in input[type=text] {
        width: 100%;
        background: white;
        padding: 8px 15px;
        font-size: 14px;
        height: auto;
        margin: 0;
        border: 1px solid #bcbcbc;
    }
    #signInFields input.required {
        padding: 8px 30px 8px 15px;
    }
    #sign-in input.form-control[disabled], #sign-in .form-control[readonly], #sign-in fieldset[disabled] .form-group .form-control {
        background-color: #eee;
    }

    #signInFields div.form-group,
    #sign-in div.form-group {
        padding: 8px 0;
        margin-bottom: 0;
    }


    .formdiv button.biglink, .formdiv button.biglink:active, .formdiv button.biglink:visited, .formdiv .action-button, .formdiv a.backToSignIn {
        background-color: #000;
        color: #fff;
        text-decoration: none;
        padding: 5px 20px;
        border: 2px solid #000;
        display: inline-block;
        margin-bottom: 10px;
        min-width: 45%;
        width: auto;
        font-size: 18px;
        padding: 5px 20px;
        text-transform: uppercase;
        border-radius: 0:
    }

    .formdiv a.backToSignIn {
        background-color: #bbb;
        min-width: 0;
        padding-left: 10px;
        padding-right: 10px;
        margin-right: 10px;
        margin-left: 0;
        border: 2px solid #bbb;
        text-align: center;
        padding: 5px 10px;
    }

        .formdiv a.backToSignIn:hover {
            background-color: #fff;
            color: #bbb;
        }


    .formdiv button.biglink:hover, .formdiv .action-button:hover {
        color: #000;
        background-color: #fff;
    }

    .formdiv .list-unstyled li {
        margin-bottom: 5px;
        font-size: 12px;
    }

    #branding-logo {
        margin: 0 auto;
        text-align: center;
        max-width: 200px;
    }

        #branding-logo img {
            max-width: 100%;
            padding-top: 20px;
            padding-bottom: 20px;
            height: 100% !important;
            max-height: 105px;
        }

    #signInFields {
        padding-top: 20px;
    }

    @media only screen and (max-width: 991px) {
        #branding-logo img {
            max-width: 100%;
            max-height: 105px;
            /*height: 69px;*/
            -ms-background-size: contain;
            background-size: contain;
        }
    }


    @media (max-width: 991px) {
        div#branding-logo {
            width: 75%;
            background-size: contain;
            margin-left: auto;
            margin-right: auto;
            /*max-width: 85%;*/
        }
    }

    #brandColor {
        background: #000;
        height: 10px;
    }
    /* -------------------------------- Sign up Pages Css End -------------------------------- */
    .external-europcar {
        background-image: url('../../public/images/europcar-icon.png');
        width: 12px;
        height: 10px;
        position: absolute;
        background-position: center;
        background-repeat: no-repeat;
        display: block;
        right: 5px;
        top: 5px;
    }

    /* -------------------------------- Jsonviewer Css Start -------------------------------- */
    /* Root element */
    .json-document {
        padding: 1em 2em;
    }

    /* Syntax highlighting for JSON objects */
    ul.json-dict, ol.json-array {
        list-style-type: none;
        margin: 0 0 0 1px;
        border-left: 1px dotted #ccc;
        padding-left: 2em;
    }

    .json-string {
        color: #0B7500;
    }

    .json-literal {
        color: #1A01CC;
        font-weight: bold;
    }

    /* Toggle button */
    a.json-toggle {
        position: relative;
        color: inherit;
        text-decoration: none;
    }

        a.json-toggle:focus {
            outline: none;
        }

        a.json-toggle:before {
            font-size: 1.1em;
            color: #c0c0c0;
            content: "\25BC"; /* down arrow */
            position: absolute;
            display: inline-block;
            width: 1em;
            text-align: center;
            line-height: 1em;
            left: -1.2em;
        }

        a.json-toggle:hover:before {
            color: #aaa;
        }

        a.json-toggle.collapsed:before {
            /* Use rotated down arrow, prevents right arrow appearing smaller than down arrow in some browsers */
            transform: rotate(-90deg);
        }

    /* Collapsable placeholder links */
    a.json-placeholder {
        color: #aaa;
        padding: 0 1em;
        text-decoration: none;
    }

        a.json-placeholder:hover {
            text-decoration: underline;
        }

    /* -------------------------------- Jsonviewer Css End -------------------------------- */


    *:focus {
        box-shadow: none;
        outline: none;
    }

    /* 2022-01-07 change  start */
    .wheelsgrid-checkbox-editing {
        -webkit-appearance: none;
        -moz-appearance: none;
        -o-appearance: none;
        appearance: none;
        border-radius: 0;
        box-shadow: none;
        /*outline: 1px solid #666;*/
        width: 12px;
        height: 12px;
        margin-top: 7px !important;
        margin-left: -1px !important;
        transition: margin .2s;
    }

    .ag-row-focus .ag-cell-range-selected .wheelsgrid-checkbox, .ag-cell-range-selected .wheelsgrid-checkbox-editing {
        margin-top: 7px !important;
        margin-left: -1px !important;
        position: relative;
        display: inline-block;
    }

    .ag-cell-value > span {
        /* display: block;*/
    }

    #lookupPanel .ag-row-focus .ag-cell-range-selected .wheelsgrid-checkbox,
    #lookupPanel .ag-cell-range-selected .wheelsgrid-checkbox-editing {
        margin-top: 6px !important;
        margin-left: -2px !important;
    }
    /* 2022-01-07 change  end */

    @media (max-width: 1025px) {

        .ag-row-focus .ag-cell-range-selected .wheelsgrid-checkbox, .ag-cell-range-selected .wheelsgrid-checkbox-editing {
            margin-top: 9px !important;
        }

        #lookupPanel .ag-row-focus .ag-cell-range-selected .wheelsgrid-checkbox,
        #lookupPanel .ag-cell-range-selected .wheelsgrid-checkbox-editing {
            margin-top: 6px !important;
        }
    }

    .ag-theme-balham .ag-cell-range-selected-1:not(.ag-cell-focus) {
        border: 1px solid #0173c7;
    }

    .ag-theme-balham .ag-body-viewport:not(.ag-has-focus) .ag-cell-range-single-cell:not(.ag-cell-inline-editing),
    .ag-theme-balham .ag-cell-range-selected:not(.ag-cell-focus) {
        /*background-color: #0173c7;*/ /* 2022-01-06  change */
        margin-left: 1px; /* 2022-01-07  change */
    }


    /*@media (max-width: 1024px) {
    .form-control, #header-fields #address-input, #header-fields .atxt > input {
        height: auto;
        padding: 7px 7px 8px;
        font-size: 15px;
    }

    .dialogBody #header-fields {
        height: auto;
    }

    .dialogBody #gmap {
        clear: both;
        width: 100% !important;
    }

    #header-fields #spn-distance {
        width: auto;
        position: relative;
        left: auto;
        clear: both;
        margin-top: 10px;
        display: block;
    }

    .ag-theme-balham {
        font-size: 15px;
    }
}
@media (max-width: 1024px) {

    .dialogBody .address-label {
        padding-top: 6px;
        padding-bottom: 1px;
        padding-left: 12px;
        width: 71px;
        margin: 0;
        display: inline-block;
        float: none;
        font-weight: normal !important;
        position: relative;
        margin-bottom: 1px;
        vertical-align: top;
    }

    .labelLeft > label, .dialogBody .address-label {
        padding-top: 0;
        font-size: 15px;
        line-height: 1.1em;
        vertical-align: middle;
        max-width: 100%;
        padding-bottom: 0;
        margin-bottom: 5px;
        white-space: normal;
    }

    .langCombo > label {
        margin-right: -44px !important;
    }

    .ag-menu-option, .ag-menu-separator {
        line-height: 25px;
        font-size: 15px;
    }

    .ag-theme-balham .ag-compact-menu-option-part, .ag-theme-balham .ag-menu-option-part, .ag-theme-balham .ag-compact-menu-option-text, .ag-theme-balham .ag-menu-option-text {
        line-height: 26px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .checkBox > label {
        display: inline;
        line-height: 1em;
        vertical-align: middle;
    }

    .checkBox input[type=checkbox], .checkBox input[type=radio] {
        margin-top: 5px;
        vertical-align: text-top;
    }

    .evo-colorind, .evo-colorind-ie, .evo-colorind-ff {
        height: 37px;
        width: 35px;
    }

    .wheels-combobox a.wheels-combobox-toggle, #toolbar .wheels-combobox a.wheels-combobox-toggle,
    #toolbar li .wheels-combobox a.wheels-combobox-toggle, .toolbar-inline .wheels-combobox-toggle,
    #lookupPanel .toolbar-inline .wheels-combobox-toggle, .toolbar-inline .wheels-combobox a.wheels-combobox-toggle {
        height: 38px;
        line-height: 34px;
        width: 40px;
    }

    #toolbar li .wheels-combobox a.wheels-combobox-toggle {
        height: 48px;
        line-height: 48px;
    }

    #lookupPanel .toolbar-inline .wheels-combobox-toggle {
        padding: 0;
        margin-right: 0;
    }

    #toolbar li .form-control, .toolbar-inline .form-control {
        height: auto;
        padding: 13px 19px;
        font-size: 15px;
    }

    .toolbar-inline .form-control {
        padding: 7px 10px;
    }

    #rdStationSelection > .wheels-combobox {
        width: 250px;
    }

    #filterpermGridText {
        width: 280px;
    }

    .ui-autocomplete.wheels-combobox-list > li {
        height: auto !important;
    }

        span.comboTreeItemTitle, .ui-autocomplete.wheels-combobox-list > li .ui-menu-item-wrapper {
            font-size: 15px;
            padding: 8px 4px;
            height: auto;
            margin: 0;
            vertical-align: middle;
        }

            span.comboTreeItemTitle > input {
                margin-right: 6px;
                vertical-align: text-top;
            }

    #toolbar #Templates, #toolbar #rdRentalTemplatesRental, #toolbar #FromToDates {
        margin-top: 10px;
        width: 280px
    }

    #toolbar #rdRentalTemplatesRental {
        width: 390px
    }

    #toolbar #FromToDates {
        width: 350px
    }

    .form-group.form-inline.checkBox {
        height: 35px;
        font-size: 15px;
    }

    .labelLeft.chkboxright {
        margin-bottom: 5px;
        min-height: 40px;
    }

    .workhours .XSmallSize > .checkBox, .inline-group .form-group.form-inline.checkBox {
        padding-top: 7px;
    }
}

@media (max-width: 1024px) {
    .content-area .btCancel.btn,
    .content-area .btApply.btn,
    .modal .btn,
    .btCancel.btn,
    .btApply.btn, a.btCancel.btn,
    a.btApply.btn,
    a.btn.btn-primary,
    a.btn.btn-default,
    .dialogBody a.btn.btn-default,
    #btnFrx,
    #rdTemplateIcon,
    #hlTemplate {
        padding: 14px 8px;
        font-size: 15px;
        line-height: 16px;
        border-radius: 0px;
    }

    #btnFrx,
    #rdTemplateIcon,
    #hlTemplate {
        background-color: #fff;
        color: #000;
        border-color: #bbb;
        min-width: 100px;
        display: inline-block;
        margin: 10px 0;
        border: 1px #bbb solid;
    }

        a.btn .fa, #hlTemplate .fa {
            margin-right: 5px;
        }

    #btDelete, #btnCustomer, .content-area fieldset .btn {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .dialogBody a.btn.btn-default {
        margin-bottom: 10px;
    }

    .content-area .btApply.btn, .content-area .btn-add-note.btn, .bootstrap-dialog-footer-buttons #btn-ok {
        margin-right: 14px;
    }
}

@media(max-width: 1025px) {
    button.close {
        font-size: 15px;
        color: #fff;
        padding: 13px;
        margin: -10px -10px 0 0 !important;
        background-color: #333;
        opacity: .7;
    }

    .modal-header {
        min-height: 40px;
    }
}

@media (max-width: 1024px) {
    .ag-theme-balham .ag-cell {
        line-height: 28px;
    }

    .ag-theme-balham .ag-row {
        height: 48px;
    }

    .ag-theme-balham .ag-cell-range-selected-1:not(.ag-cell-focus), .ag-theme-balham .ag-root:not(.ag-context-menu-open) .ag-body-viewport:not(.ag-has-focus) .ag-cell-range-selected-1:not(.ag-cell-inline-editing) {
        line-height: 44px;
    }
}*/

    @media (max-width: 1025px) {
        .estatements-checkbox {
            padding-right: 3px;
        }
    }

    @media (max-width: 768px) {

        #filterpermGridText {
            padding-top: 17px;
        }
        #toolbar li .form-control {
            width: 100%;
        }
    }


    .wheelsResizer[data-direction='vertical'] {
        background-color: #bbbbbb;
        cursor: ns-resize;
        height: 1px;
        width: calc(100% - 8px);
        margin-top: 4px;
        margin-bottom: 4px;
        display: inline-block;
    }

    .wheelsResizer[data-direction='horizontal'] {
        background-color: #bbbbbb;
        cursor: ew-resize;
        height: 100%;
        width: 1px;
        margin-left: 4px;
        margin-right: 4px;
    }

    /*--kat  27/4/22 start --*/

    /*-----toolbar-----*/

    @media only screen and (max-device-width: 650px) {

        /*-----toolbar-----*/
        #toolbar #rdResDocDisp { /*13/7/22 kat */
            display: inline-block;
            margin-left: 0px;
            width: 155px;
            padding: 0px;
        }

        #toolbar {
            max-height: 100%;
            /*min-height: 70px;*/ /*2/8/22 kat*/
        }

            #toolbar .labelLeft.LargeSize {
                margin-left: 0px;
            }

            #toolbar a.toolbarHidden {
                display: none;
                padding: 4px 10px;
            }

            #toolbar .list-inline {
                position: relative;
                display: flex;
                flex-direction: row;
                height: auto;
                align-content: flex-start;
                flex-wrap: wrap;
                align-items: baseline;
            }

            #toolbar li .labelLeft {
                position: relative;
            }

            #toolbar #rdDateRange.labelLeft { /*21/7/22 kat*/
                width: 280px;
            }

            /*---fix thead clear button--*/
            #toolbar .clearBtn {
                font-size: 20px;
                padding: 0px 10px;
            }

            /*---end fix thead clear button--*/

            #toolbar li .form-control, #toolbar li a, .toolbar-inline a {
                margin-bottom: 0;
            }

            #toolbar .list-inline > li > .labelLeft > label {
                height: 20px;
            }

            #toolbar li .form-control {
                width: 100%;
                min-width: 100px;
                margin-right: 4px;
            }

            #toolbar .separator {
                margin-top: 3px;
            }

        #page-title:before {
            display: none;
        }

        #toolbar .hidden-sm {
            width: 50%;
            margin-top: 3px;
        }

        #toolbar .nav > li > a {
            padding: 10px 8px;
        }

        #toolbar .dropzone {
            width: 95%;
        }

        #toolbar .col-xs-12 {
            padding-right: 0px;
            padding-left: 0px;
            display: flex;
            flex-direction: column-reverse;
        }


        #toolbar .list-inline {
            padding-right: 15px;
            padding-left: 15px;
            margin-top: 0px;
        }

        #toolbar li .labelLeft, #toolbar .list-unstyled {
            margin-right: 4px;
        }

        #toolbar li .labelLeft {
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            min-width: fit-content;
            align-items: center;
        }

        #toolbar .list-inline > li > .labelLeft > label {
            min-width: fit-content;
        }

        #toolbar .wheels-combobox {
            margin-top: 5px;
            margin-bottom: 0px;
            min-width: 100px;
            width: 100%;
        }

        #toolbar .list-inline li {
            margin-bottom: 0px;
        }

        #toolbar .form-group.form-inline.checkBox {
            padding-top: 0px;
        }

        /*modal*/
        .bootstrap-dialog-footer-buttons { /*kat 7/7/22*/
            display: flex;
            flex-wrap: wrap;
        }
        .modal .btn {
            width: 48%;
            min-width: fit-content;
        }

        .modal .inline-group .btn-default-search {
            width: 72px;
            min-width: fit-content;
        }
        .modal-footer .btn.selectbtns {
            margin-left: 0px;
            margin-right: 5px;
        }

            .modal-footer .btn.selectbtns:last-of-type {
                margin-right: 0px;
            }

        div.modal-footer button, .modal-footer .btn + .btn { /*12/8/22 kat*/
            margin-bottom: 5px;
            height: 30px;
        }
        .vtCalculator-panel .labelLeft { /*kat 7/7/22*/
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            width: 60%;
        }
        .vtCalculator-panel .labelNone,
        .vtCalculator-panel .SmallSize > input { /*kat 7/7/22*/
            width: 80px;
        }
        .vtCalculator-panel .labelLeft label { /*kat 7/7/22*/
            padding-left: 12px;
            width: 130px;
        }
    }

    /*---user logout Panel---*/
    @media only screen and (max-device-width: 767px) {
        #current-user .dropdown-menu {
            position: absolute !important;
            top: 100% !important;
            right: 0px !important;
            background-color: white !important;
            left: unset !important;
            font-size: 13px !important;
            box-shadow: 0 6px 12px rgb(0 0 0 / 18%) !important;
        }

        #user .dropdown-menu > li > a {
            color: #000 !important;
        }

        .modal-dialog {
            margin: 32px auto;
            max-width: 90%; /*11/7/22 kat*/
        }
    }

    @media only screen and (max-device-width: 892px) {
        #ui_dialogs_rentalpaymentedit_aspx .dialogBody fieldset .LargeSize > input { /*12/8/22 kat*/
            width: 220px;
        }
        #ui_dialogs_rentalpaymentedit_aspx .dialogBody fieldset #unlockCC { /*12/8/22 kat*/
            width: 85px !important;
        }
        .dialogBody fieldset .LargeSize > input {
            width: 100%;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody fieldset .LargeSize > input { /*13/7/22 kat*/
            width: 265px;
        }
        #ui_dialogs_airlinemiles_aspx .dialogBody fieldset .LargeSize > input {
            width: fit-content; /*11/7/22 kat*/
        }
    }

    @media only screen and (max-width: 966px) and (min-width: 651px) {

        #toolbar li a, .toolbar-inline a {
            margin-bottom: 0px;
        }
    }

    @media only screen and (min-device-width: 500px) and (max-device-width: 650px) {
        .dialogBody .colcontainer fieldset .SmallSize, .dialogBody .colcontainer fieldset .MediumSize {
            width: fit-content;
        }

        .dialogBody .colcontainer fieldset .labelLeft > label {
            width: 160px;
        }

        .dialogBody .colcontainer fieldset, .dialogBody .colcontainer {
            width: 100%;
            max-width: 100%;
        }
    }

    @media only screen and (max-device-width: 650px) {

        /*--modals--*/

        .bootstrap-dialog-footer-buttons button {
            width: 100%;
        }

        #modalFrame fieldset {
            width: 100%;
        }

        /*---font Size---*/
        body, .bootstrap-dialog, .ui-datepicker-title, .ag-theme-balham, li, /*12/8/22 kat*/
        .ui-autocomplete.wheels-combobox-list > li, label, input, .form-control,
        .content-area .btCancel.btn, .content-area .btApply.btn, .modal .btn,
        .btCancel.btn, .btApply.btn, a.btCancel.btn, a.btApply.btn, a.btn.btn-primary, a.btn.btn-default, .list-unstyled a {
            font-size: 14px;
        }
            .ui-autocomplete.wheels-combobox-list > li > span:first-of-type, .ui-menu-item.multicombo > span:last-of-type {
                font-size: 14px !important; /*3/8/22 kat*/
            }

        .mm-list > li > a, #page-title, fieldset > legend {
            font-size: 17px;
        }


        #attachDeleteBtn {
            width: 100px;
        }

        #attachEditDialog .modal-footer .pull-right {
            width: 200px;
        }
    }

    @media only screen and (max-device-width: 500px) {
        #filterpermGridText { /*kat 21/7/22*/
            width: 100%;
        }
        /*--modals--*/
        .dialogBody fieldset, .dialogBody fieldset .LargeSize > input {
            width: 100%;
        }

            .dialogBody fieldset .inline-group { /*kat 7/7/22*/
                display: flex;
                align-items: flex-end;
            }
        #ui_dialogs_rentalcarsearch_aspx .dialogBody .SmallSize > input { /*12/8/22 kat*/
            width: 111px;
        }
        #ui_dialogs_rentalcarsearch_aspx .dialogBody #rdEquips {
            padding-right: 5px; /*12/8/22 kat*/
        }

        .dialogBody fieldset.field-group .inline-group {
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap; /*kat 7/7/22*/
            align-items: flex-end; /*kat 7/7/22*/
        }

            .dialogBody fieldset.field-group .inline-group.credit-card { /*kat 7/7/22*/
                display: flex;
                align-items: flex-end;
                flex-wrap: wrap;
            }

        .dialogBody fieldset .labelLeft label {
            width: auto; /*kat 7/7/22*/
            white-space: nowrap;
        }

        .dialogBody fieldset.field-group .inline-group .MediumSize {
            display: flex;
            flex-direction: column;
            width: min-content;
            min-width: max-content; /*kat 7/7/22*/
        }

        .dialogBody fieldset.field-group > .MediumSize { /*kat 7/7/22*/
            white-space: unset;
            display: inline-flex;
            flex-direction: column;
        }
        #ui_dialogs_leaserentalrecurringcharges_aspx .dialogBody fieldset.field-group .inline-group .MediumSize {
            width: 50%;
            min-width: unset;
        }

        .dialogBody fieldset.field-group > .MediumSize.make-ctrl-invisible { /*kat 7/7/22*/
            display: none;
        }

        .dialogBody fieldset.field-group .inline-group .LargeSize {
            width: 100%;
        }

        .lock-modal-wnd.wheelsModalWindow .modal-body iframe { /*kat 21/6/22*/
            min-height: 170px;
        }

        .lock-modal-wnd .modal-body { /*kat 21/6/22*/
            height: fit-content !important;
        }

        .dialogBody fieldset.field-group .inline-group label {
            width: max-content;
        }

        #ui_dialogs_rentalpaymentedit_aspx .dialogBody fieldset.field-group .inline-group label, /*12/8/22 kat*/
        .dialogBody fieldset .wheels-combobox,
        .dialogBody fieldset .wheels-combobox input,
        .dialogBody fieldset .LargeSize > .wheels-combobox > input,
        #ui_dialogs_rentalpaymentedit_aspx .dialogBody fieldset .LargeSize > input,
        #ui_dialogs_rentalpaymentedit_aspx .dialogBody fieldset .MediumSize > input,
        .MediumSize > .iti > input,
        #ui_dialogs_cancelrental_aspx .rentalwrapper #rdDateFrom input,
        #ui_dialogs_cancelrental_aspx .wheels-combobox .wheels-combobox-input {
            width: 100%;
        }
        #ui_dialogs_rentalpaymentedit_aspx .dialogBody fieldset .MediumSize { /*12/8/22 kat*/
            width: calc(100% - 90px);
            min-width: auto;
        }
        .dialogBody fieldset .SmallSize, .dialogBody fieldset .XXSmallSize {
            width: min-content;
        }

        #ui_dialogs_airlinemiles_aspx .dialogBody fieldset .LargeSize > input, #ui_dialogs_airlinemiles_aspx .dialogBody fieldset .SmallSize,
        .dialogBody fieldset .wheels-combobox .comboTreeItemTitle input {
            width: fit-content; /*12/8/22 kat*/
        }

        #ui_dialogs_airlinemiles_aspx .dialogBody fieldset .labelLeft label, #ui_dialogs_airlinemiles_aspx .dialogBody fieldset .MediumSize > input,
        #ui_dialogs_rentalbilldates_aspx .dialogBody fieldset .labelLeft > input, #ui_dialogs_rentalbilldates_aspx .dialogBody fieldset .labelLeft label {
            width: 100%; /*11/7/22 kat*/
        }

        #ui_dialogs_airlinemiles_aspx .dialogBody fieldset .MediumSize, #ui_dialogs_rentalbilldates_aspx .dialogBody fieldset .labelLeft,
        #ui_dialogs_rentalcommissionsedit_aspx .dialogBody fieldset .MediumSize,
        #ui_dialogs_cancelrental_aspx .rentalwrapper #rdDateFrom {
            width: 50%; /*11/7/22 kat*/
        }

        #ui_dialogs_rentalbilldates_aspx .dialogBody fieldset .labelNone
        #ui_dialogs_rentalcommissionsedit_aspx .dialogBody fieldset .MediumSize input {
            width: 100%; /*11/7/22 kat*/
        }

        #ui_dialogs_rentalcommissionsedit_aspx .dialogBody fieldset.field-group .inline-group { /*11/7/22 kat*/
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: flex-end;
        }

        .middleTopPosition.wheelsModalWindow.charges-dialog .modal-body {
            height: 100% !important;
        }

        .dialogBody fieldset .labelNone.MediumSize {
            width: 30%;
            min-width: 115px; /*kat 7/7/22*/
        }

        .dialogBody fieldset a.btn.btn-default {
            margin-bottom: 5px;
        }

        .dialogBody fieldset #TiresWidth {
            width: 20%;
        }

        .dialogBody fieldset #CarCatalogRetailPrice {
            width: 27%;
        }

        .dialogBody fieldset .inline-group > * {
            white-space: unset;
        }

        .dialogBody fieldset .inline-group > #searchValue { /*kat 7/7/22*/
            width: calc(100% - 210px); /*12/8/22 kat*/
            min-width: 100px;
        }

        /*---end modals---*/
        #toolbar .hidden-sm {
            width: 100%;
            margin-top: 3px;
        }

        #toolbar li .form-control {
            margin-right: 0px;
        }
    }

    @media (min-width: 1350px) and (max-width: 1355px) {
        .nav > li.dropdown > a {
            padding: 10px 9px;
        }
    }

    @media (min-width: 1389px) and (max-width: 1399px) {
        .nav > li.dropdown > a {
            padding: 10px 10px;
        }
    }

    @media (min-width: 1461px) and (max-width: 1465px) {
        .nav > li.dropdown > a {
            padding: 10px 12px;
        }
    }

    @media (min-width: 1647px) and (max-width: 1650px) {
        .nav > li.dropdown > a {
            padding: 10px 13px;
        }
    }

    @media only screen and (min-width: 768px) and (max-width: 1025px) {
        /* #toolbar {
        min-height: auto;
        height: auto;
    }*/
    }


    /*--kat  27/4/22 end --*/

    /*--kat  12/5/22 navbar start --*/

    li.dropdown.dropdown-large .dropdown-menu.dropdown-menu-large {
        width: max-content !important;
    }
    @media only screen and (min-width: 855px) and (max-width: 910px) {
        .dropdown-menu-large {
            padding: 8px 5px;
        }

            .dropdown-menu-large > a {
                margin-right: 4.5px;
            }
    }

    @media only screen and (min-width: 842px) and (max-width: 1000px) { /*25/7/22 kat*/
        li.dropdown.dropdown-large.open div.dropdown-menu.dropdown-menu-large {
            max-width: 842px;
        }

        .dropdown-menu-large > a {
            width: 72px;
        }

        .dropdown-menu-large {
            padding: 8px 5px;
        }

            .dropdown-menu-large > a {
                margin-right: 4px;
            }
    }

    .nav.navbar-nav.mmenuIcon li {
        font-size: 20px;
        text-align: center;
        line-height: 40px;
    }

    .navbar-right {
        height: 40px;
    }

    #page-title:before {
        width: 20px;
    }

    #liGlobalSearch #searchbox ul li a {
        word-wrap: break-word;
    }

    .navbar-default .navbar-nav > .open > a > span {
        color: #000;
    }

    .navbar-default .navbar-nav > .dropdown-large > a, .navbar-default .navbar-nav > .dropdown-large > a:focus, .navbar-default .navbar-nav > .dropdown-large > a:hover {
        background-color: #ed1c24;
    }

    .navbar-default .navbar-nav > li > a.current-profile {
        padding-top: 8px;
        padding-bottom: 8px;
        text-align: right;
        max-width: 150px; /*7/10/22 kat*/

    }
        .navbar-default .navbar-nav > li > a.current-profile .current-station, /*7/10/22 kat*/
        .navbar-default .navbar-nav > li > a.current-profile .current-user {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
    #liGlobalSearch #searchbox #recentitems {
        border-bottom: 1px solid #b7e4ff;
        border-top: 1px solid #b7e4ff;
        padding: 5px;
    }

        #liGlobalSearch #searchbox #recentitems li {
            padding: 3px 0px;
        }

    @media only screen and (min-height: 580px) and (max-width: 767px) {
        .dropdown-menu-large a {
            padding: 10px;
        }
    }

    @media only screen and (max-width: 991px) {
        #liGlobalSearch {
            float: unset;
            display: block;
            left: -100px;
            transform: none;
        }

        .navbar-form.GlobalSearch {
            width: 100%;
            margin-left: 0px;
        }

        .navbar-default .navbar-nav > li > a:hover[aria-expanded="false"] {
            background-color: transparent;
        }

        #search-icon {
            display: none;
        }
    }

    @media (pointer: coarse) and (hover: none) {
        .navbar-default .navbar-nav > li > a:hover[aria-expanded="false"] {
            background-color: transparent;
        }

        ul.nav li.dropdown:hover > .dropdown-menu-large, ul.nav li.dropdown:hover > ul.dropdown-menu {
            display: none;
        }

        ul.nav li.dropdown.open > .dropdown-menu-large, ul.nav li.dropdown.open > ul.dropdown-menu {
            display: block;
        }
    }

    @media only screen and (max-width: 767px) {
        #liGlobalSearch {
            margin-left: 100px;
        }

        .navbar-default .navbar-nav .open .dropdown-menu > li > a {
            color: #000;
        }

    }

    @media only screen and (max-device-width: 650px) {

        /*-----toolbar-----*/
        #page-title {
            width: 100%;
            position: relative;
        }

        #toolbar .list-inline { /*kat 21/7/22*/
            width: 100% !important; /*kat 27/7/22*/
        }
    }

    #liGlobalSearch #searchbox ul li, #liGlobalSearch #searchbox p, #liGlobalSearch #searchbox span {
        padding: 5px;
    }

    #liGlobalSearch #searchbox {
        padding: 0px;
    }

    /*#toolbar {
    height: auto;
}*/

    .clearBtn:hover {
        background-color: #ffffff00;
    }


    .wheelsgrid-numeric-editing, .wheelsgrid-datepicker-editing.hasDatepicker, .ag-row-even input.wheelsgrid-text-editing, .ag-cell-wrapper, .wheelsgrid-text-editing /*11/7/22 kat*/ {
        border-radius: 0px;
    }


    /*--kat  12/5/22 navbar end --*/

    /*--Lease View start---*/
    .tab-metrics > li > a > span.num {
        font-size: 13px;
        line-height: 13px;
        display: block;
        font-weight: bold;
        color: #0173c7;
    }

    .tab-metrics > li.active > a > .num { /*kat 21/6/22*/
        color: #fff;
    }

    #ui_dashboards_ordermanager_aspx .scrtabs-tabs-fixed-container ul.nav-tabs > li {
        width: fit-content;
    }

    .tab-metrics > .nav-tabs > li {
        border-right-width: 0;
    }

    .tab-metrics > li.active > a,
    .tab-metrics > li.active > a:focus,
    .tab-metrics > li.active > a:hover {
        font-weight: bold;
    }


    .tab-metrics > li > a {
        margin-right: 0;
        background-color: #fff;
        padding: 4px 14px 4px 8px;
        font-size: 12px;
    }

    #ui_dashboards_leaseview_aspx .scrtabs-tabs-fixed-container,
    #ui_dashboards_ordermanager_aspx.scrtabs-tabs-fixed-container,
    #ui_dashboards_leaseview_aspx .scrtabs-tab-container,
    #ui_dashboards_ordermanager_aspx .scrtabs-tab-container,
    #ui_dashboards_leaseview_aspx .scrtabs-tabs-fixed-container,
    #ui_dashboards_ordermanager_aspx .scrtabs-tabs-fixed-container {
        height: 36px; /*kat 21/6/22*/
    }

    #ui_dashboards_leaseview_aspx .content-area,
    #ui_dashboards_ordermanager_aspx .content-area,
    #ui_dashboards_dailyview_aspx .content-area {
        background: linear-gradient(rgb(245, 247, 247) 0%, rgb(221, 221, 221) 100%);
    }

    #ui_dashboards_leaseview_aspx .fas,
    #ui_dashboards_ordermanager_aspx .fas,
    #ui_dashboards_dailyview_aspx .fas {
        font-size: 15px;
    }

    .scrtabs-tab-scroll-arrow.scrtabs-tab-scroll-arrow-right {
        padding-left: 3px;
    }

    .scrtabs-tab-scroll-arrow {
        width: 15px;
    }

    #ui_dashboards_leaseview_aspx #toolbar .checkBox > label,
    #ui_dashboards_ordermanager_aspx #toolbar .checkBox > label {
        margin-top: 6px;
    }


    #ui_dashboards_dailyview_aspx #toolbar #filterText {
        padding-top: 3px;
    }

    .scrtabs-tabs-fixed-container ul.nav-tabs > li { /*kat 21/6/22*/
        min-width: 100px;
    }

    @media (max-width: 426px) { /*12/8/22 kat*/
        #ui_dashboards_dailyview_aspx #toolbar ul li:nth-last-child(4) {
            width: calc(100% - 70px);
        }

        #ui_dashboards_dailyview_aspx #toolbar .extratreecontainer ul li:nth-last-child(4),
        #ui_dashboards_dailyview_aspx #toolbar .extratreecontainer ul li:nth-last-child(4) {
            width: 100%;
        }

        #ui_dashboards_dailyview_aspx #toolbar ul li:nth-last-child(7) {
            width: calc(100% - 169px);
        }

        #ui_dashboards_dailyview_aspx #toolbar .LargeSize > .wheels-combobox > input {
            width: 100%;
        }

        #ui_dashboards_dailyview_aspx #toolbar li #Stations, #ui_dashboards_dailyview_aspx #toolbar li #SelectedDate {
            margin-right: 0px;
        }

        #attachDeleteBtn {
            width: 50px;
        }

            #attachDeleteBtn span {
                display: none;
            }
    }

    @media only screen and (max-device-height: 600px) { /*kat 21/6/22*/
        #gmap {
            margin: 4px 40px;
        }

        .rightPosition.wheelsModalWindow .modal-body iframe {
            min-height: fit-content;
        }
    }


    @media (max-width: 650px) {

        #ui_dashboards_leaseview_aspx .hidden-md,
        #ui_dashboards_ordermanager_aspx .hidden-md,
        #ui_dashboards_dailyview_aspx #toolbar .list-inline li.hidden-md /*kat 21/7/22*/  {
            width: 100%;
        }

        #ui_dashboards_leaseview_aspx #toolbar .list-inline li.hidden-md,
        #ui_dashboards_ordermanager_aspx #toolbar .list-inline li.hidden-md {
            margin-top: 4px;
        }

        .tab-metrics > li > a {
            font-size: 14px;
        }

        #ui_dashboards_dailyview_aspx #toolbar .hidden-sm {
            width: fit-content;
            margin-top: 3px;
        }
    }

    @media (max-width: 527px) {

        #ui_dashboards_leaseview_aspx #toolbar .LargeSize > .wheels-combobox > input,
        #ui_dashboards_ordermanager_aspx #toolbar .LargeSize > .wheels-combobox > input {
            width: 100%;
        }

        #ui_dashboards_leaseview_aspx #toolbar ul li:nth-last-child(3) {
            width: calc(100% - 129.5px);
        }

        #ui_dashboards_ordermanager_aspx #toolbar ul li:nth-last-child(7) {
            width: calc(100% - 129.5px);
        }
    }


    @media (max-width: 424px) {

        #ui_dashboards_leaseview_aspx #toolbar ul li:nth-last-child(3) {
            width: calc(100% - 100px);
        }

        #ui_dashboards_ordermanager_aspx #toolbar ul li:nth-last-child(7) {
            width: calc(100% - 100px);
        }
    }

    #toolbar li .chk-box-li { /*kat 27/6/22*/
        white-space: nowrap;
    }
    /*--Lease View end---*/
    /*---datepicker btn---*/
    .hasDatepicker {
        padding-right: 23px;
    }

    .ui-datepicker-trigger, .rfid-button {
        position: absolute;
        line-height: 25px !important;
        margin-right: 0;
        width: 22px;
        right: 0px;
        text-align: center;
        padding: 0px !important;
        border-radius: 0;
        background-image: linear-gradient(rgb(245, 247, 247) 0%, rgb(221, 221, 221) 100%);
        border: 1px solid #bbb !important;
        margin: 0px !important;
        height: 27px; /*21/7/22 kat*/
    }

    .rfid-button {
        bottom: 5px;
        top: unset;
    }

    #toolbar .ui-datepicker-trigger, #toolbar .ui-datepicker-trigger:hover {
        height: 26px; /*25/7/22 kat*/
    }

    #toolbar li .ui-datepicker-trigger {
        line-height: 24px !important;
        bottom: 0px;
        border-radius: 0px 2px 2px 0px;
    }

    #toolbar ul li .SplitDateCont {
        display: flex;
        flex-wrap: nowrap;
    }

    #toolbar li > #effectiveDate > label {
        margin-top: 10px;
    }

    #corporateLoyaltyExpirDate {
        width: 88px;
    }

    #ui_manage_tasks_invoicesingle_aspx #rdDateFrom,
    #ui_manage_tasks_invoicesingle_aspx #rdDateTo,
    #ui_manage_tasks_fiscalmanagement_aspx #rdDateFrom,
    #ui_manage_tasks_fiscalmanagement_aspx #rdDateTo {
        width: fit-content;
        margin-right: 5px;
    }

    #ui_manage_master_payment_aspx .nomargin {
        margin-bottom: 5px;
    }



    .InlineControls.dates-width input {
        width: 100px; /*kat 21/6/22*/
    }

    #rdLicenseExp { /*kat 21/6/22*/
        width: fit-content;
    }

    @media only screen and (max-width: 550px) {
        .ui-datepicker-trigger {
            bottom: 5px;
        }
        .modalWindowDateTime .ui-datepicker-trigger { /*kat 21/7/22*/
            bottom: 0px;
        }
        #ui_dialogs_vehicleconfigurator_aspx .dialogBody .labelLeft label { /*13/7/22 kat*/
            width: 100%;
            min-width: fit-content;
        }
        #ui_dialogs_vehicleconfigurator_aspx .dialogBody fieldset #TiresWidth { /*13/7/22 kat*/
            width: 62px;
        }
        #ui_dialogs_vehicleconfigurator_aspx .dialogBody fieldset #CarCatalogRetailPrice, /*13/7/22 kat*/
        #ui_dialogs_vehicleconfigurator_aspx .dialogBody fieldset #ModelCC {
            width: 85px;
        }
        .modal .btn-danger { /*12/8/22 kat*/
            width: calc(100% - 9px);
        }

        .daterangepicker .drp-selected {
            width: 100%;
            white-space: nowrap;
        }
    }

    @media only screen and (max-height: 515px) {
        #ui-datepicker-div {
            z-index: 110 !important;
        }
    }

    .container-fluid.sidepane hr {
        margin: 0px;
        margin-top: 15px;
    }

    .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus { /*kat 21/6/22*/
        outline: 0px auto -webkit-focus-ring-color !important;
        outline-offset: 0px !important;
    }


    /*---clearBtn--*/

    #filterText.labelLeft,
    #filterText.labelNone,
    .labelLeft { /*kat 21/6/22*/
        position: relative;
    }

    .clearBtn {
        font-size: 20px;
        padding: 0px 7px;
        position: absolute;
        right: 0;
        top: 0px;
    }

    #ui_dashboards_dailyview_aspx .clearBtn,
    #ui_dashboards_leaseview_aspx .clearBtn {
        top: 3px;
    }

    /*modal*/
    /*kat 21/6/22*/

    @media only screen and (max-device-width: 500px) {
        .dialogBody fieldset .inline-group #rdEntireFleet,
        .dialogBody fieldset .inline-group #rdReadyOnly {
            white-space: nowrap;
        }

            .dialogBody fieldset .inline-group #rdEntireFleet label,
            .dialogBody fieldset .inline-group #rdReadyOnly label {
                width: fit-content;
            }
    }

    .mm-slideout {
        -webkit-transition: none;
        -ms-transition: none;
        transition: none;
    }

    .fade {
        -webkit-transition: none;
        -o-transition: none;
        transition: none;
    }

    .modal.fade .modal-dialog {
        -webkit-transition: none;
        -o-transition: none;
        transition: none;
        -webkit-transform: translate(0,-2%);
        -ms-transform: translate(0,-2%);
        -o-transform: translate(0,-2%);
        transform: translate(0,-2%);
    }


    @media only screen and (max-device-height : 1024px) and (-webkit-min-device-pixel-ratio: 1) {

        .lock-modal-wnd .modal-dialog,
        .lock-modal-wnd .modal-body {
            width: fit-content !important;
        }
    }

    @media only screen and (max-device-width : 1024px) {

        .lock-modal-wnd .modal-dialog,
        .lock-modal-wnd .modal-body {
            height: fit-content !important;
        }

        body[data-help=topic173] .lock-modal-wnd .modal-content {
            height: 315px !important;
        }

            body[data-help=topic173] .lock-modal-wnd .modal-content .modal-body {
                height: calc(100% - 110px ) !important;
            }
        .modal-content .modal-body {
            height: calc(100% - 110px );
        }
        .middleErrorPosition .modal-body {
            height: 100px;
        }

        .ui-autocomplete.wheels-combobox-list > li,
        .ui-autocomplete.wheels-combobox-list > li > span,
        .ui-autocomplete.wheels-combobox-list > li > span:first-of-type,
        .ui-autocomplete.wheels-combobox-list .ui-widget-header.multicombo > span:last-of-type,
        .ui-menu-item.multicombo > span:last-of-type {
            height: 26px;
        }
    }

    @media only screen and (max-device-height: 800px) {
        .lock-modal-wnd .modal-body {
            height: 200px !important;
        }

        .lock-modal-wnd.wheelsModalWindow .modal-body iframe {
            min-height: fit-content;
        }
    }

    #address-input {
        border-radius: 0px;
    }

    /*master forms*/

    #maintabs li.related {
        display: none;
    }

    #maintabs .relatedTabsButton {
        position: relative;
    }

        #maintabs .relatedTabsButton a {
            width: 100%;
            position: relative;
        }

            #maintabs .relatedTabsButton a .caret {
                top: calc(50% - 1px);
                position: absolute;
                left: calc(100% - 20px);
            }

        #maintabs .relatedTabsButton ul {
            list-style: none;
            position: absolute;
            width: 100%;
            padding-left: 0;
            z-index: 4; /*12/8/22 kat*/
            display: none;
        }

        #maintabs .relatedTabsButton:hover ul {
            display: block;
        }

        #maintabs .relatedTabsButton ul li {
            list-style: none;
        }

        #maintabs .relatedTabsButton ul a {
            text-decoration: none;
            color: #333;
            display: block;
            padding: 10px 15px;
            border: 1px #fff solid;
        }

        #maintabs .relatedTabsButton ul .active a {
            background-color: #0173c7;
            color: #fff;
        }

        #maintabs .relatedTabsButton ul a:hover {
            background: #b8d5eb;
        }

    .sidepane #rdDateRange div.SplitDate { /*11/7/22 kat*/
        width: fit-content;
    }
        .sidepane #rdDateRange div.SplitDate input { /*11/7/22 kat*/
            width: 167px;
        }
    #ui_dialogs_vehicleconfigurator_aspx .dialogBody > div { /*13/7/22 kat*/
        flex-wrap: wrap;
    }
    /*.sidepane #divPDF.col-xs-10 {*/ /*12/8/22 kat*/
    /*margin-top: 10px;
}*/
    @media (max-device-width: 650px) {  /*13/7/22 kat*/
        #ui_dialogs_ecvmparams_aspx .dialogBody .labelLeft > label {
            width: 145px;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody div.inline-group .labelLeft.SmallSize {
            width: 231px;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody .MediumSize {
            width: auto;
        }
        #filterButtons.content-area .btApply.btn.btn-primary,
        #filterButtons .btApply.btn.btn-primary, #filterButtons a.btApply.btn.btn-primary, #filterButtons a.btn.btn-primary,
        #filterButtons.content-area .btCancel.btn.btn-default,
        #filterButtons .btCancel.btn.btn-default,
        #filterButtons a.btCancel.btn.btn-default { /*kat 21/7/22*/
            height: 30px;
            width: 30%;
        }
        #filterButtons a.btApply.btn.btn-primary,
        #filterButtons a.btn.btn-primary { /*kat 21/7/22*/
            margin-right: 5px;
        }
        #filterButtons .action-buttons .form-group .btn { /*kat 21/7/22*/
            min-width: auto;
            width: 100%;
            margin: 1px;
            display: flex !important;
            align-items: center;
            justify-content: center;
        }
        #filterButtons { /*kat 21/7/22*/
            display: flex;
        }
        #ui_sidepane_printpreview_aspx .container-fluid { /*12/8/22 kat*/
            padding-right: 0px;
            padding-left: 0px;
        }
        .sidepane #divEmail.col-xs-offset-1, .sidepane #divPDF.col-xs-offset-1 { /*12/8/22 kat*/
            margin-left: 0;
        }
        .sidepane #divEmail.col-xs-10, .sidepane #divPDF.col-xs-10 { /*12/8/22 kat*/
            width: 100%;
        }

        #ui_sidepane_printpreview_aspx .sidepane { /*12/8/22 kat*/
            overflow-x: hidden;
        }

        .ui-autocomplete.wheels-combobox-list > li,
        .ui-autocomplete.wheels-combobox-list > li > span,
        .ui-autocomplete.wheels-combobox-list > li > span:first-of-type,
        .ui-autocomplete.wheels-combobox-list .ui-widget-header.multicombo > span:last-of-type,
        .ui-menu-item.multicombo > span:last-of-type {
            height: 30px;
        }
    }
    @media (max-device-width: 500px) {  /*13/7/22 kat*/
        #ui_dialogs_ecvmparams_aspx .dialogBody fieldset.field-group .inline-group {
            display: flex;
            flex-wrap: wrap;
            flex-direction: row;
        }
            #ui_dialogs_ecvmparams_aspx .dialogBody fieldset.field-group .inline-group .colcontainer .inline-group {
                flex-wrap: nowrap;
            }
        #ui_dialogs_ecvmparams_aspx .dialogBody .labelLeft > label, ul#filestoattach li { /*12/8/22 kat*/
            width: 100%;
            min-width: fit-content;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody div.inline-group .labelLeft.SmallSize {
            width: 87px;
        }
        #ui_dialogs_ecvmparams_aspx .XSmallSize, #ui_dialogs_ecvmparams_aspx .labelNone.LMediumSize,
        #ui_dialogs_ecvmparams_aspx .dialogBody .MediumSize {
            width: 49.3%;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody fieldset.field-group .inline-group .MediumSize {
            min-width: auto;
        }
        #ui_dialogs_ecvmparams_aspx .LMediumSize > input,
        #ui_dialogs_ecvmparams_aspx .dialogBody .MediumSize input,
        #ui_dialogs_ecvmparams_aspx .dialogBody fieldset .LargeSize > input,
        #ui_dialogs_ecvmparams_aspx .dialogBody div.inline-group .SmallSize input {
            width: 100%;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody .colcontainer {
            margin-right: 0px;
        }
        #ui_dialogs_ecvmparams_aspx .dialogBody div.inline-group .labelLeft.SmallSize,
        #ui_dialogs_ecvmparams_aspx .dialogBody div.inline-group .SmallSize {
            width: 32%;
        }
        #filterButtons.content-area .btApply.btn.btn-primary, #filterButtons .btApply.btn.btn-primary,
        #filterButtons a.btApply.btn.btn-primary, #filterButtons a.btn.btn-primary,
        #filterButtons.content-area .btCancel.btn.btn-default, #filterButtons .btCancel.btn.btn-default,
        #filterButtons a.btCancel.btn.btn-default { /*kat 21/7/22*/
            width: 50%;
        }

    }

    @media (max-device-width: 575px) { /*kat 21/7/22*/
        #advFilters .filterRow {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
        }
            #advFilters .filterRow td:nth-of-type(2) {
                width: calc(100% - 20px);
            }
            #advFilters .filterRow label {
                font-size: 14px;
            }
            #advFilters .filterRow input[type=checkbox] {
                margin: 8px 0 0;
            }

            #advFilters .filterRow .form-group.form-inline.form-control.form-filtercontrol {
                width: 33%;
                min-width: 155px;
            }
        #advFilters .valueCell, #advFilters .form-control.wheels-combobox-input.ui-autocomplete-input.small {
            width: 100%;
        }
        #advFilters .form-group.form-inline.form-control.form-filtercontrol.small {
            width: 90%;
            min-width: 109px;
        }
        #advFilters .valueCell .filterDivSelector .wheels-combobox, .valueCell .filterDivSelector .fltDivWrapper {
            width: 33%;
            min-width: 119px;
        }
    }

    @media (max-device-width: 396px) { /*kat 21/7/22*/
        #advFilters .filterDivSelector {
            flex-wrap: wrap;
        }
        #advFilters .fltDivWrapper .form-group.form-inline.form-control.form-filtercontrol.small {
            margin-left: 0px;
        }
        #advFilters .filterRow .form-group.form-inline.form-control.form-filtercontrol, #advFilters .valueCell .filterDivSelector .wheels-combobox, .valueCell .filterDivSelector .fltDivWrapper {
            min-width: 47%;
        }
        #advFilters .valueCell .filterDivSelector .wheels-combobox {
            margin-right: 5px;
        }
    }

    /*kat 21/7/22 start*/
    .content-area .grid-container {
        height: calc(100% - 20px);
    }
    #ui_dashboards_carcontrol_aspx .content-area .grid-container {
        height: calc(100% - 50px);
    }
    .grid-container .tab-content.full-height {
        height: calc(100% - 40px);
    }
    #ui_dashboards_carcontrol_aspx .grid-container .tab-content.full-height {
        height: 100%;
    }
    .grid-container .tab-content.full-height .tab-pane, div#listGrid {
        height: 100%;
        top: 0px;
    }

    /*@media (max-width: 650px) {
    #ui_dashboards_carcontrol_aspx .content-area .grid-container {
        height: calc(100% - 100px);
    }
}*/

    #ui_dashboards_carcontrol_aspx .content-area {
        height: calc(100% - 80px);
    }
    #toolbar li .labelLeft.search-car {
        display: flex;
        align-items: baseline;
    }


    #ui_manage_master_fuelcard_aspx #fuelGrid {
        height: 450px;
    }
    /*kat 21/7/22 end*/
    @media (max-width: 1025px) { /*kat 21/7/22*/
        #ui_dashboards_carcontrol_aspx #rdhistPlate {
            width: 230px;
        }
        #ui_dashboards_carcontrol_aspx .LargeSize > .wheels-combobox > input {
            width: 110px;
        }
    }


    @media (max-width: 970px) {

        #ui_dashboards_carcontrol_aspx .half-height {
            min-height: 115px;
            /*max-height: calc(100% - 22px);*/
        }


        #ui_dashboards_carcontrol_aspx .grid-container .tab-content.full-height .tab-pane {
            top: 0px;
        }

        #ui_dashboards_carcontrol_aspx .half-height .full-height.full-width.ag-theme-balham {
            height: calc(100% - 5px);
        }

    }
    @media (max-width: 679px) { /*kat 21/7/22*/
        #ui_dashboards_carcontrol_aspx .LargeSize > .wheels-combobox > input {
            width: 130px;
        }
    }

    @media (max-width: 535px) { /*kat 21/7/22*/
        .colcontainer-double.colcontainer-carcontrol .labelLeft {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
        }
    }
    .sidepane .action-buttons { /*29/7/22 kat*/
        bottom: 0px; /*12/8/22 kat*/
    }
    @media only screen and (max-device-width: 1025px) { /*12/8/22 kat*/

        .sidepane div.action-buttons {
            max-width: 100%;
            justify-content: flex-start;
        }
            .sidepane div.action-buttons .form-group {
                width: 400px;
            }
    }

    @media (max-device-width: 1024px) and (min-device-width: 551px) { /*12/8/22 kat*/
        .sidepane #lookupPanel fieldset {
            width: 100%;
        }


        .container-fluid.sidepane {
            height: 100% !important; /* 2022-08-22 Changed by Celeste */
            min-height: 100%;
        }

        #sidepane {
            bottom: 0;
            height: calc(100% - 40px);
        }
        .sidepane .action-buttons {
            max-width: 100%;
            width: 100%;
            background-color: white;
        }
    }

    @media (max-device-height: 800px) { /*12/8/22 kat*/
        .sidepane #lookupPanel fieldset {
            width: 100%;
        }
        #sidepane {
            bottom: 0;
            height: calc(100% - 40px);
        }
        .sidepane #lookupPanel {
            margin-bottom: 50px;
        }
        .sidepane .action-buttons, .sidepane .action-buttons .form-group {
            bottom: 0px;
            margin-bottom: 0px;
            width: 100%;
            background-color: white;
        }
        .container-fluid.sidepane {
            height: 100% !important; /* 2022-08-22 Changed by Celeste */
            min-height: 100%;
        }
    }

    @media (max-device-height: 1279px) { /*12/8/22 kat*/
        #ui_sidepane_printpreview_aspx {
            height: initial;
        }
    }
    @media (max-device-width: 900px) { /*12/8/22 kat*/
        .modal-content {
            height: calc(100% - 30px);
        }
        .wheelsModalWindow.modal.bootstrap-dialog .bootstrap-dialog-body {
            height: 100%;
        }
        .wheelsModalWindow.modal.bootstrap-dialog.rightPosition .bootstrap-dialog-body,
        .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .bootstrap-dialog-body {
            height: 100%;
        }
        .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .modal-dialog {
            width: 80%;
        }
    }
    @media (max-device-height: 905px) { /*12/8/22 kat*/
        .rightPosition .modal-content {
            height: 95%;
        }

        .wheelsModalWindow.modal.bootstrap-dialog.rightPosition .bootstrap-dialog-body {
            height: 100%;
        }
        .modal-body, .wheelsModalWindow.modal.bootstrap-dialog.rightPosition .modal-body {
            height: calc(100% - 111px);
            max-height: calc(100% - 110px);
        }
        .middleTopPosition.wheelsModalWindow .modal-content {
            height: 95%;
        }
        .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .bootstrap-dialog-body {
            height: 100%;
        }
    }

    @media (max-device-width: 768px) { /*12/8/22 kat*/
        .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .modal-dialog {
            width: 95%;
        }
    }
    @media (max-device-width: 741px) and (min-device-width: 651px) {
        /*12/8/22 kat*/
        /*#ui_manage_master_rental_aspx .bootstrap-dialog-footer-buttons { /*18/8/22 kat
        display: flex;
        flex-wrap: wrap;
    }*/

        #ui_manage_master_rental_aspx div.modal-footer button, #ui_sidepane_printpreview_aspx .modal-footer .btn + .btn {
            margin-bottom: 5px;
            width: 100px;
            min-width: fit-content;
        }
        #ui_manage_master_rental_aspx .rightPosition div.modal-footer button { /*18/8/22 kat*/
            margin-bottom: 0px;
            width: 25%;
        }
        #ui_sidepane_printpreview_aspx .container-fluid {
            padding-right: 0px;
            padding-left: 0px;
        }
    }
    @media (max-device-height: 550px) { /*12/8/22 kat*/
        .wheelsModalWindow.modal.bootstrap-dialog.middleTopPosition .modal-dialog {
            padding-top: 5%;
        }

        .wheelsModalWindow.modal.bootstrap-dialog.rightPosition .modal-dialog {
            top: 5%;
        }
    }
    @media (max-device-width: 500px) {
        /*12/8/22 kat*/

        .sidepane #lookupPanel fieldset, .sidepane div.action-buttons .form-group {
            width: 100%;
        }

        #sidepane {
            bottom: 0;
            height: 100%;
        }

        .container-fluid.sidepane {
            height: 100% !important; /* 2022-08-22 Changed by Celeste */
            min-height: 100%;
        }

        .sidepane div.action-buttons {
            max-width: calc(100% - 30px);
        }

        #divEmail .LargeSize > input, #divEmail .LargeSize > .wheels-combobox, #divEmail .LargeSize > .wheels-combobox > input {
            width: 100%;
        }
    }
    #btnSearch {
        min-width: 60px; /*12/8/22 kat*/
    }

    #ui_dialogs_idlesignin_aspx .dialogBody .field-group .form-group:last-of-type br {
        display: none; /*12/8/22 kat*/
    }
    #sidepane-content body {
        background-color: white;
    }

    .bootstrap-dialog-footer-buttons .RightAligment { /*18/8/22 kat*/
        float: right;
    }
        .bootstrap-dialog-footer-buttons .RightAligment:first-of-type { /*18/8/22 kat*/
            margin-left: 5px;
        }


    .float-right {
        float: right;
        width: auto !important;
        margin-left: auto;
    }

        .float-right .form-group.form-inline.checkBox {
            margin: 0;
            height: auto;
            width: max-content;
        }

        .float-right .checkBox > input {
            margin-top: 3px;
        }
        .float-right .checkBox > label {
            margin: 0;
            padding-top: 0;
        }

    @media (max-device-width: 389px) {
        .modal .btn {
            width: 48%;
            min-width: fit-content;
        }

        .modal-footer .btn.selectbtns {
            margin-left: 0px;
            margin-right: 5px;
        }
            .modal-footer .btn.selectbtns:last-of-type {
                margin-right: 0px;
            }
    }

    .ui-widget-header {
        white-space: nowrap;
    }
    .ag-body-horizontal-scroll-viewport {
        overflow-x: auto;
    }

    @media (max-width: 1000px) {
        .current-profile span {
            display: none;
        }
    }

    .ui-front { /*kat 7/10/22*/
        z-index: 99;
    }
    #ui_dialogs_rentalchargesedit_aspx .ui-front {
        z-index: 100;
    }
    .MaskInput > input {
        text-security: disc;
        -webkit-text-security: disc;
        -moz-text-security: disc;
        font-family: text-security-disc;
        font-size: 15px;
    }

    /*daterangepicker*/
    /*@media (min-width: 821px) {
    .rangebtn {
        display: none !important;
    }

    .daterangepicker.ltr > .ranges > ul {
        display: block !important;
    }
}

@media (max-width: 820px) {
    .daterangepicker.ltr > .ranges > ul {
        display: none;
    }
    .daterangepicker.ltr {
        max-width: 490px;
        min-width: 490px;
    }
        .daterangepicker.ltr > .ranges {
            width: 100%;
        }
    .daterangepicker > .ranges > ul {
        display: none;
        position: absolute;
        background-color: white;
        z-index: 10;
        top: 45px;
        width: 232px;
        left: 10px;
        border: 1px solid lightgray;
        border-radius: 4px;
    }
    .ranges .dropdown {
        margin-left: 10px;
    }
    .daterangepicker.show-ranges .drp-calendar.left {
        border-left: none;
    }
    .rangebtn {
        width: 232px;
        margin: 0px;
        display: flex !important;
        align-items: center;
        justify-content: space-between;
    }
    .ranges .caret {
        margin-left: 5px;
    }
    .daterangepicker.show-calendar .drp-buttons {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-end;
        align-items: center;
    }

    .drp-selected {
        white-space: nowrap;
    }
}

@media (max-width: 563px) {
    .daterangepicker > .ranges > ul {
        left: 0px;
        width: 100%;
        border: none;
    }
    .ranges .dropdown {
        text-align: center;
        margin-left: 0px;
    }
    .rangebtn {
        width: 95%;
        margin: auto;
    }
    .ranges .dropdown {
        margin-top: 10px;
    }
    .daterangepicker .ranges li {
        padding: 8px 15px;
    }
    .daterangepicker .drp-calendar.left {
        padding: 8px 3px 8px 8px;
    }

    .daterangepicker.ltr {
        min-width: auto;
    }

    .daterangepicker .drp-selected {
        padding-right: 0px;
    }
}*/


    .print-helper {
        display: none;
    }


    /*.ag-row-odd.ag-row-no-focus.ag-row ag-row-level-1.ag-row-position-absolute.ag-after-created.ag-row-selected {*/
    /*height: 63px;*/
    /*position: inherit;
}

.ag-cell.ag-cell-not-inline-editing.ag-cell-normal-height.ag-cell-range-right,
.ag-cell-wrapper,
.ag-cell ag-cell-not-inline-editing.ag-cell-normal-height.ag-cell-range-selected.ag-cell-range-selected-1.ag-cell-range-single-cell {
    height: fit-content;
}

.ag-cell-value {
    white-space: pre-wrap;
}*/

    .ui-autocomplete.wheels-combobox-list > li.multicombo.ui-menu-item > span,
    .ui-autocomplete.wheels-combobox-list .ui-widget-header.multicombo > span {
        display: table-cell;
        min-width: 40px;
    }
        .ui-autocomplete.wheels-combobox-list .ui-widget-header.multicombo > span:last-of-type, .ui-autocomplete.wheels-combobox-list .ui-widget-header,
        .ui-autocomplete.wheels-combobox-list .ui-widget-header.ui-menu-item.multicombo > span:last-of-type {
            font-size: 11px !important;
            height: 24px;
        }

    @media (max-device-width: 1000px) {
        .modal fieldset div.inline-group {
            flex-wrap: inherit;
            align-items: center;
        }

        #searchValue {
            width: calc(100% - 182px)
        }

            #searchValue.LargeSize > input {
                width: 100%;
            }
        #searchField.labelNone {
            padding-left: 0px;
            width: 100px;
        }
        .MediumSize#searchField > .wheels-combobox {
            width: auto;
        }
    }

    @media (max-device-width: 1175px) {
        .ui-autocomplete.wheels-combobox-list span {
            min-width: 50px;
        }
    }

    .content-area,
    #toolbar {
        opacity: 0;
    }

        .content-area.is-loaded,
        #toolbar.is-loaded {
            transition: all 0.1s;
            -webkit-transition: all 0.1s;
            opacity: 1;
        }

    .dropdown-top-right {
        max-width: unset;
        max-height:150px;
        overflow-x: hidden;
        overflow-y: auto;
        left: unset;
        right: 0;
        bottom: 27px;
        top: unset;
    }


    /*MFA*/

    /*.modal.fade.modal-fullscreen {
    padding-left: unset !important;
}

.modal.fade.modal-fullscreen .modal-dialog {
    height: 100%;
    width: 100%;
    max-width: unset;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    margin: 0;
}

.modal.fade.modal-fullscreen .modal-content {
    height: 100%;
}

    .modal.fade.modal-fullscreen .modal-body {
        max-width: 900px;
        max-height: calc(100% - 119px);
        overflow: auto;
    }

.modal.fade.modal-fullscreen.wheelsModalWindow .bootstrap-dialog-message div {
    height: auto;
}

    .modal.fade.modal-fullscreen .bootstrap-dialog-footer-buttons {
        column-gap: 12px;
        flex-wrap: nowrap;
    }

.modal-fullscreen .bootstrap-dialog-body,
.modal-fullscreen .bootstrap-dialog-message {
    min-height: fit-content;
}
*/
    .MFASetupDialog .p-1 {
        padding: 15px;
        flex: 1
    }

    .MFASetupDialog .bootstrap-dialog-message br {
        display: none;
    }

    /*.bootstrap-dialog-message {
        text-align: center;
    }*/

    .MFASetupDialog .badge-pill {
        border-radius: 24px;
        padding: 1px 5px;
        border: 1px solid lightgrey;
        font-size: 12px;
        margin-right: 10px;
        margin-top: 10px;
    }

        .MFASetupDialog .badge-pill + h4 {
            font-weight: 700;
        }

    .MFASetupDialog .pt-5 {
        padding-top: 25px;
    }

    .MFAQRContainer {
        background-color: #f6f4f5;
        display: flex;
        flex-direction: row;
    }

    /*    .MFAQRContainer > div > .inline-group {
        display: flex;
        column-gap: 5px;
        margin-bottom: 9px;
    }
    
    .MFAQRContainer > div > .inline-group > input {
        margin: 0;
    }*/

    .MFASetupDialog .errorMsg {
        display: none;
    }

    .MFASetupDialog .is-invalid {
        border-color: red;
    }

        .MFASetupDialog .is-invalid ~ .errorMsg {
            display: block;
            color: red;
            padding-left: 5px;
            line-height: 27px;
        }

    .MFASetupDialog.wheelsModalWindow .bootstrap-dialog-message div.seperator {
        position: relative;
        height: auto;
        align-content: center;
    }

    .MFASetupDialog .seperator::after {
        content: "";
        display: inline;
        border-left: 1px solid #bbb;
        position: absolute;
        top: 5px;
        left: 9px;
        height: 95%;
    }

    /*@media only screen and (max-device-width: 785px) {
    .MFAQRContainer > div > .inline-group {
        flex-wrap: wrap;
        row-gap: 5px;
    }
}

@media only screen and (max-device-width: 650px) {
    .modal.fade.modal-fullscreen .btn {
        width: 50%;
    }

    .MFAQRContainer {
        flex-direction: column;
    }
}*/

    /*country flags*/
    /*.wheels-combobox-list .countryFlag {
    max-width: 16px;
    margin-right: 5px;
    margin-bottom: 5px;
}

.custom-country-select .wheels-combobox:has(> span) .wheels-combobox-input {
    padding-left: 26px;
}*/

    #claimHyper {
        margin-bottom: 10px;
        position: relative;
        display: flex;
    }
        #claimHyper a {
            margin-left: auto;
        }

.colcontainer > fieldset .iti__selected-flag {
    padding: 0 4px 0 4px;
    height: 25px;
}

.colcontainer > fieldset .iti__arrow {
    margin-left: 4px;
}

.MediumSize > .iti > input {
    padding-left: 37px;
    margin-bottom: 5px !important;
}

.MediumSize .iti__country-list {
    width: 265px;
}