#cF {
    border-color: transparent !important;
    color: black !important;
}

.k-dropdown-wrap .k-input {
    text-indent: .2em !important;
}

.k-grid {
    max-width: 1920px;
    font-size: var(--fs-sm);
    border-color: white !important;
}

.k-table-thead, .k-table-thead .k-group-cell {
    text-align: center;
    background-color: #dfdfde;
}

.k-grid-header .k-table-th {
    border-color: gray;
    font-weight: bold;
}

.k-grid-header .k-header .k-link {
    display: block;
    color: #333;
    /*background-color: white !important;*/
    font-size: 12px !important;
    border: 0px solid white;
    /*text-align: left;*/
    text-align: center;
}

.k-table, .k-data-table{
    color: #000;
}

.k-grid .md-link{
    color: var(--clr-primary);
}

.k-grid .md-link.color-secondary {
    color: var(--clr-secondary);
}

.k-grid td {
    padding: 6px 6px !important;
}

.k-grid .k-selectable .k-table-td {
    cursor: pointer;
}

.k-grid-filter .k-icon {
    padding-top: 12px !important;
}

.k-grid-header th.k-header {
    padding: 4px;
    padding-left: 8px;
    /*background-color: white !important;*/
}

.k-grid-header th.k-header > .k-link {
    padding: 8px 0px !important;
    color: #115A9E !important;
}

.k-grid a:is(:hover, :focus){
    text-decoration: underline;
}

.k-grid-pager .k-pager-info{
    display: initial !important;
}

.k-grid-pager .k-pager-numbers-wrap .k-dropdown {
    display: none !important;
}

.k-grid-pager .k-pager-numbers-wrap .k-pager-numbers {
    display: flex !important;
}

@media (max-width: 768px) {
    .k-grid-pager .k-pager-numbers-wrap .k-dropdown {
        display: inline-block !important;
    }

    .k-grid-pager .k-pager-numbers-wrap .k-pager-numbers {
        display: none !important;
    }
}

/*#gridShippers, #gridEquipment, #gridCustomers, #gridQuotes, #gridWebUsers {
    border-color: transparent !important;
}*/

/*#gridShippers .k-header, #gridEquipment .k-header, #gridCustomers .k-header, #gridQuotes .k-header, #gridWebUsers .k-header {
        background-color: white !important;
        font-size: 12px !important;
        border-bottom: 3px solid #e6e6e6;
        border-top: 0px solid white;
        border-right: 0px solid white;
        border-left: 0px solid white;
        text-align: left;
    }

    #gridShippers .k-grid, #gridEquipment .k-grid, #gridCustomers .k-grid, #gridQuotes .k-grid, #gridWebUsers .k-grid {
        border-color: white !important;
    }

    #gridShippers .k-link, #gridEquipment .k-link, #gridCustomers .k-link, #gridQuotes .k-link, #gridWebUsers .k-link {
        color: black !important;
    }*/


.disabled {
    pointer-events: none;
    opacity: 0.6;
}

div.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 100px;
}

.err {
    display: inline-block;
    position: relative;
    background: url('../images/wavy_u.gif') bottom repeat-x;
}

.custom {
    display: inline-block;
    position: relative;
    background: url('../images/wavy_u_g.gif') bottom repeat-x;
}

.topnav {
    /*background-color: #FAFAFA;*/
    position: relative;
    /*padding: 0px;*/
}

.topnav a, .k-menu-link {
    color: black;
    text-align: center;
    /*padding: 14px 16px;*/
    /*padding: 8px;*/
    text-decoration: none;
    font-size: 14px;
    /*border: 5px solid transparent;*/
    /*background-color: #FAFAFA;*/
}

.topmenu {
    padding-left: 8px;
}

.topmenu li {
    list-style: none;
}

.topmenu button {
    padding-block: 8px;
    cursor: pointer !important;
}

.navX {
    margin: 0;
    list-style: none;
    padding-left: 0px;
    white-space: nowrap;
}

.navX > li {
    display: inline-block;
}

/*.navX > li > a {
    display: inline-block;
    padding: 10px 15px;
}*/

.navX > li > a:hover,
.navX > li > a:focus {
    text-decoration: none;
    /*background-color: #eee;*/
}


.tdlActive {
    color: #104b7d;
    font-weight: bold;
    border-right: 2px solid #104b7d;
}

.tdlInactive {
    color: black;
    font-weight: normal;
    border-right: 2px solid #c3c3c3;
}

.tdlActive a, .tdlInactive a {
    color: black;
}

.flat-button {
    border: 0px;
    padding: 10px;
    background: transparent;
    box-shadow: none;
    border-radius: 5px;
    cursor: pointer;
}

.flat-button:hover {
    background: #FAFAFA;
}

.flat-button-w {
    border: 0px;
    padding: 10px;
    background: transparent;
    box-shadow: none;
    border-radius: 5px;
}

.flat-button-w:hover {
    background: #FAFAFA;
}


.flat-button-b {
    border: 0px;
    padding: 10px;
    font-weight: normal;
    color: #1b4a9a;
    background: transparent;
    box-shadow: none;
    border-radius: 5px;
}

.flat-button-b:hover {
    background: #FAFAFA;
}

.flat-button-bb {
    border: 1px solid #104b7d;
    padding: 10px;
    font-weight: normal;
    color: #104b7d;
    background: transparent;
    box-shadow: none;
    border-radius: 0px;
}

.flat-button-bb:hover {
    background: #FAFAFA;
}

.flat-button-gray {
    border: 0px;
    padding: 10px;
    background: #FAFAFA;
    box-shadow: none;
    border-radius: 5px;
}

.flat-button-gray:hover {
    background: #FFFFFF;
}

.lg-link, .md-link {
    color: var(--clr-primary-300);
    padding: 0px;
    float: left;
}

:is(.lg-link, .md-link):is(:hover, :focus){
    text-decoration: underline;
}

.lg-link {
    font-size: var(--fs-lg);
}

.md-link {
    font-size: var(--fs-base);
}

.sm-subtitle {
    font-size: 10px;
    color: gray;
    float: left;
    padding-left: 0px;
    padding-top: 0px;
    padding-right: 2px;
}

.xlg-icon-w {
    font-size: 40px;
    color: white;
    float: left;
    padding: 0px;
}

.xlg-flat-button-w {
    border: 0px;
    padding: 10px;
    background: transparent;
    box-shadow: none;
    border-radius: 5px;
}

.xlg-flat-button-w:hover {
    background: #1D81E5;
}

.button-w-selected {
    border: 2px solid white;
}

.animate-red:hover {
    color: red;
    transition: all .3s ease;
}

.animate-gray:hover {
    color: gray;
    transition: all .3s ease;
}

.animate-white:hover {
    color: white;
    transition: all .3s ease;
}

.animate-green:hover {
    color: #107a5a;
    transition: all .3s ease;
}

.animate-blue:hover {
    color: #104b7d;
    transition: all .3s ease;
}       

.animate-lighblue-border {
    border-bottom: 5px solid transparent;
}

.animate-lighblue-border:hover {
    /*border-bottom: 5px solid #0089F7;*/
    border-bottom: 5px solid #90BbFd;
}

.animate-lightblue:hover {
    color: #0089F7;
    transition: all .3s ease;
}

.animate-cesium:hover {
    color: #727235;
    transition: all .3s ease;
}


.lg-icon {
    font-size: 22px;
    color: gray;
    float: left;
    padding: 0px;
    position: relative;
    top: -4px;
}

.lg-icon-link {
    font-size: 22px;
    color: var(--clr-primary);
    float: left;
    padding: 0px;
}

.lg-title {
    font-size: 18px;
    color: gray;
    float: left;
    padding-left: 20px;
    padding-right: 8px;
}

.md-title {
    font-size: 16px;
    color: gray;
    font-family: arial,sans-serif;
    float: left;
    padding-left: 20px;
    padding-right: 8px;
}

.md-text {
    font-size: 14px;
    float: left;
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: #FAFAFA;
}

.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 17px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-color: #fff;
    background-color: #ccc;
    -webkit-transition: .2s;
    transition: .2s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 13px;
    width: 13px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .2s;
    transition: .2s;
}

input:checked + .slider {
    background-color: var(--clr-primary);
}

input:focus + .slider {
    outline: 1px solid var(--clr-primary);
}

input:checked + .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 17px;
}

.slider.round:before {
    border-radius: 50%;
}

.modal.top .modal-content {
    width: 100%;
    height: 100%;
    overflow-x: auto;
}

.modal.top .modal-dialog,
.modal.left .modal-dialog,
.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 320px;
    height: 100%;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.modal.top .modal-dialog {
    width: 100%;
}

.modal.left .modal-dialog{
    left: 0;
}
.modal.right .modal-dialog {
    right: 0;
}

.modal.left .modal-content,
.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body,
.modal.top .modal-body {
    padding: 20px 15px;
}

/*Top*/
.modal.top.fade .modal-dialog {
    top: -320px;
    -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
    -o-transition: opacity 0.3s linear, top 0.3s ease-out;
    transition: opacity 0.3s linear, top 0.3s ease-out;
}

.modal.top.fade.in .modal-dialog {
    top: 0;
}

/*Left and Right modals*/
.modal.left.fade .modal-dialog,
.modal.right.fade .modal-dialog {
    transform: translateX(-100%);
    -webkit-transition: opacity 0.3s linear, transform 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, transform 0.3s ease-out;
    -o-transition: opacity 0.3s linear, transform 0.3s ease-out;
    transition: opacity 0.3s linear, transform 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog,
.modal.left.fade.in .modal-dialog {
    transform: translateX(0);
}

/*Left*/
.modal.left.fade .modal-dialog {
    transform: translateX(-100%);
}

/*Right*/
.modal.right.fade .modal-dialog {
    transform: translateX(100%);
}

/* ----- MODAL STYLE ----- */
.modal-dialog * {
    box-sizing: border-box;
}

.modal-content {
    background-color: var(--clr-modal-background);
}

.modal-content {
    border-radius: 0;
    border: none;
}

.modal-header {
    color: black;
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    box-sizing: border-box;
}

.modal-title {
    font-size: 24px;
    color: var(--clr-primary);
    text-transform: uppercase;
}

.modal-close {
    float: right;
    padding: 8px;
    border-radius: 50%;
    font-size: 28px;
    line-height: 1;
    color: var(--clr-primary);
    background: transparent;
    position: relative;
}

.modal-close:hover {
    background: #FAFAFA;
}

.modal-close img {
    display: block;
}

.modal-close:not(:has(img)) {
    padding: 6px 8px;
    border-radius: 4px;
}

.close {
    font-size: 35px;
}

.row_highlight_gray:hover {
    background-color: #FAFAFA;
}

.hideme {
    display: none;
}

.showme {
    height: 100px;
    padding: 25px;
    box-sizing: border-box;
}

.k-pager-numbers ul li {
    border-top-width: 3px;
    border-top-color: #104B7D;
    margin: 0px;
    padding: 0px;
}


.handsontable .currentRow {
    border-top: 1px solid #4b89ff;
    border-bottom: 1px solid #4b89ff;
}

.k-grid:where(:has(.k-table-tbody:empty)) {
    height: 150px;
}

/*Make grid content equal to the height of its rows (kendo has it 400px by default)*/
.k-grid-content.k-auto-scrollable {
    height: auto !important;
    max-height: 100% !important;
}

/*Remove blank space at the right of the grid (reserved space for scrollbar even when not needed)*/
.k-grid-content {
    overflow-y: auto;
}

.k-grid-content, .k-scrollbar-vertical, .k-virtual-scrollable-wrap {
    scrollbar-width: thin;
}

/*Remove blank space at the right of the grid for virtual scrolling grids*/
.k-scrollbar.k-scrollbar-vertical {
    overflow-y: auto;
}

.k-grid-header {
    padding-right: 0 !important;
}

.k-grid-content.k-auto-scrollable[data-role="virtualscrollable"] {
    padding-right: 0 !important;
}

/*Avoid empty space at the end of the grid when resizing a column*/
.k-grid table{
    min-width: 100%;
}

.k-grid td,
.k-grid .k-table-td, 
.k-grid .k-table-th {
    white-space: nowrap;
    text-overflow: ellipsis;
}

.k-grid .k-table-td .mdi {
    line-height: 1;
}

.k-grid table {
    border-collapse: collapse !important;
}

.k-grid .k-state-selected {
    background-color: #FFFFFF !important;
    border-top: 1px solid #4b89ff;
    border-bottom: 1px solid #4b89ff;
    border-collapse: unset !important;
    color: black !important;
}

.k-grid .k-alt.k-state-selected {
    background-color: #FFFFFF !important;
    border-top: 1px solid #4b89ff;
    border-bottom: 1px solid #4b89ff;
    border-collapse: unset !important;
    color: black !important;
}

.k-grid tr.k-state-selected > td {
    border-color: #FAFAFA !important;
    background-color: #FAFAFA !important;
    color: black !important;
}

.dash-head .k-rpanel-toggle {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 20px;
    left: 20px;
}


#gridSingleReceive .k-state-selected {
    background-color: #0072CE !important;
    color: white !important;
}

#gridSingleReceive .k-alt.k-state-selected {
    background-color: #0072CE !important;
    color: white !important;
}

#gridSingleReceive tr.k-state-selected > td {
    border-color: #0072CE !important;
    background-color: #0072CE !important;
    color: white !important;
}

.demo-section.k-content {
    box-shadow: 0 1px 2px 1px rgba(0,0,0,.08), 0 3px 6px rgba(0,0,0,.08);
}

.demo-section:not(.wide), #exampleWrap .box:not(.wide) {
    max-width: 400px;
}

.demo-section {
    /*margin: 0 auto 4.5em;*/
    padding: 3em;
    border: 1px solid rgba(20,53,80,0.14);
}


.removable ul {
    margin: 0;
    padding: 0;
}

/* Style the list items */
.removable ul li {
    cursor: pointer;
    position: relative;
    padding: 4px;
    list-style-type: none;
    /* make the list items unselectable */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#filterIcon {
    display: inline-block;
    font-size: 24px;
    vertical-align: bottom;
    border-radius: 50%;
    color: black;
    width: 32px;
    height: 32px;
    padding-left: 4px;
    margin-top: 4px;
    border: 0px;
    background-color: #E6E6E6;
}

#filterIcon:hover {
    background-color: #FAFAFA;
}

.closeSm {
    margin-left: 8px;
    font-size: 20px;
    padding: 0px;
}

.closeSm:hover {
    background-color: #FAFAFA;
}


.k-view-agenda .k-state-default {
    border-bottom-color: transparent !important;
    border-bottom-width: 5px !important;
}

.k-with-icon {
    color: gray !important;
}


/*Templates*/

.tempTable {
    width: 250px;
}

.imgLogo {
    width: 250px;
}

.menuopt > li > a {
    /*padding-top: 25px;*/
    font-weight: bold;
}

.pointer {
    cursor: pointer;
}

.sideTemplates:hover td:first-child {
    background-color: #9cbdd6;
    border-color: #9cbdd6;
}

.sideTemplates :hover td:first-child {
    background-color: #9cbdd6;
}

sideTemplates.active {
    background-color: #9cbdd6 !important;
}

.sideTemplates.active td:first-child {
    background-color: #9cbdd6 !important;
}

.searchRow:hover td {
    background-color: #9cbdd6;
    border-color: #9cbdd6;
}

.searchRow :hover td {
    background-color: #9cbdd6;
}

searchRow.active {
    background-color: #9cbdd6 !important;
}

.searchRow.active td {
    background-color: #9cbdd6 !important;
}

.tempDetail {
    /*border-radius: 5px;
    border: 2px solid #a4acbb;
    padding: 20px;*/
    height: 280px;
    /*margin-top: 5px;*/
    /*box-shadow: 0 0 8px #a4acbb;*/
    /*margin-bottom: 10px;*/
}

.detailFields {
    display: inline-grid;
    width: 32%;
    margin-right: 5px;
}

.customersDropDown {
    width: 330px;
    height: 34px;
    /*border-radius: 5px;*/
}

.menuOption {
    position: relative;
    align-content: center;
    padding: .25em .25em .25em .25em;
    float: left;
    /*margin-right: 1em;*/
    font-size: 1.5em;
    /*font-weight: bold;*/
    text-align: center;
    cursor: pointer;
}

.menuIcon {
    font-size: 20px;
}

.tempSteps {
    /*border-radius: 5px;
    margin-bottom: 10px;*/
    /*min-height: 220px;*/
    /*max-height: 220px;*/
    overflow: auto;
    border: 1px solid #ccc;
}

.addMaxHeight {
    max-height: 220px;
}

.stepContainer {
    overflow: auto;
}

.float-right {
    float: right;
    padding-right: 10px;
}

.float-left {
    float: left;
    padding-left: 10px;
    padding-top: 10px;
}

.detailCommentsContainer {
    max-width: 670px;
}

.detailComments {
    resize: none;
    max-height: 90px;
}

.stepActions {
    height: 50px;
}

.standardsInput {
    height: 100px;
}

.standarsControls {
    /*max-width: 60px;
    vertical-align: bottom;*/
    padding-top: 100px;
}

.standardButton {
    width: 50px;
    margin-bottom: 10px;
}

.standarsActions {
    font-weight: bold;
    text-align: center;
}

.standarsActions > a {
    padding: 1px;
}

.customModal {
    width: 900px !important;
    height: 100%;
}

.optionsMenu {
    padding-left: 10px
}

.stepDetail {
    /*border-radius: 5px;
    border: 2px solid #a4acbb;*/
    /*margin-bottom: 10px;*/
    /*padding-top: 20px;*/
    padding-bottom: 20px;
}

.tcalc {
    border-radius: 5px;
    border: 1px solid #a4acbb;
    padding: 2px 10px 2px 2px !important;
    margin-bottom: 10px;
    min-height: 300px;
}

.disabledRow {
    cursor: no-drop !important;
}

.tableLine {
    min-height: 100px;
    max-height: 100px;
    overflow: scroll;
    border-radius: 5px;
    border: 1px solid #a4acbb;
}

.noMargingBottom {
    margin-bottom: 0;
}

.border {
    min-height: 80px;
    border-radius: 5px;
    border: 1px solid #a4acbb;
    margin-bottom: 5px;
    padding: 10px 10px 10px 10px;
}

.atStep {
    width: 16% !important;
    padding: 0px 0px 0px 15px;
}

.cloneInput {
    max-width: 65px;
}

.cloneError {
    padding-top: 8px;
    color: red;
}

.dropStep {
    height: 30px;
    vertical-align: text-top;
}

.stepActionsContainer {
    padding-right: 20px;
    padding-top: 10px;
    font-size: medium;
}

.gray-buttons {
    background-color: lightgray;
    border-color: darkslategray;
}

.tdpadding {
    padding: 0 !important;
    border: 1px solid #ddd;
}

.whiteBorder {
    border: 1px solid #fff;
    padding: 2px 2px;
    border-radius: 0px;
}

.paramTable {
    max-height: 145px;
    min-height: 145px;
    padding: 0;
}

.searchTable {
    max-height: 200px;
    min-height: 200px;
    overflow: auto
}

.assignButton {
    width: 100%;
    height: 50px;
    word-wrap: break-word;
    white-space: normal;
    font-size: smaller;
}

.assingButtonContainer {
    padding: 0;
    padding-top: 25px;
}

/*cards*/
.card {
    background: #fff;
    border-radius: 2px;
    display: inline-block;
    height: 370px;
    margin: 1rem;
    max-width: 400px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
    display: inline-flex;
}

.card:hover {
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.card-block {
    padding: 16px;
    text-align: justify;
    height: inherit;
    overflow-y: auto;
    overflow-x: hidden;
}

.card-title{
    font-weight: 700;
}

.MainClass {
    position: relative;
}

.AutoScrollClass {
    overflow: hidden;
}

.AutoScrollClass:hover {
    overflow: auto;
    /*padding-right: 1px;*/
}

.FilterClass {
    border-bottom: 1px solid #DADADA;
}

a.FilterItemClass {
    color: black;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    /*padding-top: 5px;*/
    float: left;
    background-color: white;
    width: auto;
    font-size: 14px;
    margin-top: 3px;
    margin-right: 20px;
}

a.FilterItemClass:hover {
    color: black;
    text-decoration: none;
    color: #104b7d;
    border-bottom: 3px solid #90BbFd;
}

a.FilterItemSelectedClass {
    color: black;
    text-decoration: none;
    border-bottom: 3px solid var(--clr-primary);
    /*padding-top: 5px;*/
    float: left;
    background-color: white;
    width: auto;
    font-size: 14px;
    margin-top: 3px;
    margin-right: 20px;
}

a.SubTitleItemClass {
    text-decoration: none;
    padding-top: 5px;
    float: left;
    background-color: transparent;
    width: auto;
    font-size: 14px;
    margin-top: 3px;
    margin-right: 20px;
    color: #104b7d;
    border-bottom: 3px solid #90BbFd;
}

.FilterButtonClass {
    background-color: #90BbFd;
    border-bottom: 3px solid transparent;
}

.FilterButtonClass:hover {
    color: #104b7d;
    border-bottom: 3px solid #90BbFd;
    background-color: #90BbFd;
}

.animate-pin:hover {
    color: red;
    transition: all .3s ease;
}

.animate-pinoff:hover {
    color: red;
    transition: all .3s ease;
}


.ItemClass {
    /* padding: 10px;*/
    border-left: 25px solid transparent;
    border-bottom: 1px solid #C0C0C0;
}

.ItemSelectedClass {
    border-left: #104b7d;
}

.modal-header-light-3dots {
    padding: 0px;
    margin: 0px;
    border: 0px;
    position: absolute;
    right: -160px;
    top: -16px;
    z-index: 3;
    background: transparent;
    box-shadow: none;
    border-radius: 1px;
    float: right;
    font-size: 26px;
    color: black;
}

.modal-header-light-3dots:hover {
    background: #FAFAFA;
}

.modal-header-light-3dots-menu {
    width: 200px;
    top: 20px;
}

.modal-header-light-3dots-btngroup {
    padding: 0px;
    margin: 0px;
    border: 0px;
    float: left;
    position: absolute;
    right: 220px;
    top: -15px;
    z-index: 3;
}

.titlebar-info {
    position: absolute;
    left: auto;
    padding: 0px;
    margin: 10px;
    border: 0px;
    color: black;
    top: -50px;
    font-size: 20px;
}

.titlesection-info {
    font-size: 18px;
    position: relative;
    float: left;
    color: var(--clr-primary);
}

.flat-button-edit {
    border: 0px;
    padding: 8px;
    background: transparent;
    box-shadow: none;
    border-radius: 5px;
    position: relative;
    bottom: 6px;
    float: left;
    margin-left: 20px;
    color: #104b7d;
}

.flat-button-edit:hover {
    background: #FAFAFA;
}

.flat-button-blue {
    border: 0px;
    padding: 10px 16px 10px 16px;
    margin: 0px 4px 0px 4px;
    background: #0072CE;
    box-shadow: none;
    border-radius: 1px;
    color: white;
    min-width: 80px;
}

.flat-button-blue:hover {
    background: #0089F7;
}

.flat-button-green {
    border: 0px;
    padding: 10px 16px 10px 16px;
    margin: 0px 4px 0px 4px;
    background: #008000;
    box-shadow: none;
    border-radius: 1px;
    color: white;
    min-width: 80px;
}

.flat-button-green:hover {
    background: #008F00;
}

.flat-button-gray {
    border: 0px;
    padding: 10px 16px 10px 16px;
    margin: 0px 4px 0px 4px;
    background: #E8E8E8;
    box-shadow: none;
    border-radius: 1px;
    color: black;
    margin-left: 8px;
    min-width: 80px;
}

.flat-button-gray:hover {
    background: #FFFFFF;
}

.flat-button-yellow {
    border: 0px;
    padding: 10px 16px 10px 16px;
    margin: 0px 4px 0px 4px;
    background: #FFC90E;
    box-shadow: none;
    border-radius: 1px;
    color: black;
    margin-left: 8px;
    min-width: 80px;
}

.flat-button-yellow:hover {
    background: #FFD047;
}

.INFO, .WARN {
    position: relative;
    display: block;
    padding: 2px 8px;
    text-align: center;
    font-weight: bold;
    color: white;
}

.INFO {
    background-color: #2f96b4;
}

.WARN {
    background-color: red;
}

/*Kendo override styles*/

/*Remove Kendo Menu default styles*/
.k-menu.k-menu-horizontal:not(.k-context-menu) {
    background-color: transparent;
    padding: 0;
}

.k-menu-link{
    padding: 0.25em 0.5em;
    gap: 0.25em;
}

.k-menu-group .k-item > .k-link:active, .k-menu-group .k-item > .k-link.k-active, .k-menu-group .k-item > .k-link.k-selected, .k-menu.k-context-menu .k-item > .k-link:active, .k-menu.k-context-menu .k-item > .k-link.k-active, .k-menu.k-context-menu .k-item > .k-link.k-selected {
    background-color: var(--clr-primary);
}

.k-list-container {
    scrollbar-color: var(--clr-primary) transparent;
    scrollbar-width: thin;
}

.k-list-item.k-selected, .k-selected.k-list-optionlabel,
.k-button-solid-base.k-selected,
.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner, .k-calendar .k-calendar-td.k-selected .k-link,
.k-calendar .k-calendar-td.k-selected:hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected:hover .k-link,
.k-calendar .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected.k-hover .k-link,
.k-checkbox:checked, .k-checkbox.k-checked,
.k-grid-header .k-grid-filter.k-active, .k-grid-header .k-header-column-menu.k-active, 
.k-grid-header .k-grid-header-menu.k-active, .k-grid-header .k-hierarchy-cell .k-icon.k-active,
.k-button-solid-primary {
    background-color: var(--clr-primary);
}

.k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover,
.k-list-item.k-selected.k-hover, .k-selected.k-hover.k-list-optionlabel,
.k-button-solid-primary:hover, .k-button-solid-primary.k-hover,
.k-grid-header .k-grid-header-menu.k-active:hover {
    background-color: var(--clr-primary-700);
}

.k-grid-header .k-grid-header-menu:not(.k-active):hover {
    background-color: #bbb;
}

.k-button-solid-primary,
.k-checkbox:checked, .k-checkbox.k-checked {
    border-color: var(--clr-primary);
}