.k-grid,
.k-chip-md,
.k-list-md,
.k-input-md,
.k-picker-md,
.k-button-md,
.k-calendar-md,
.k-notification {
    font-size: 14px;
    font-family: Arial;
}

.k-notification-info {
    background-color: #fff;
}

.k-list-item {
    border: solid 1px #fff;
}

/****************************************
                Kendo Grid
****************************************/
.k-grid-header tr:not(.k-filter-row) th {
    background-color: #f4f4f5;
    font-size: 13px;
    font-weight: bold;
    padding: 8px !important;
}

.k-grid-header tr:not(.k-filter-row) th a {
    font-size: 13px;
    font-weight: bold;
}

.k-grid-header tr:not(.k-filter-row) th a.k-grid-filter {
    padding: 3px 1px;
    border: solid 1px transparent;
    border-radius: 2px;
    position: relative;
    top: 2px;
    left: -1px;
}

.k-grid-header tr:not(.k-filter-row) th a.k-grid-filter .k-icon:before {
    height: 12px;
    width: 12px;
    font-size: 12px !important;
    font-weight: normal !important;
}

.k-grid-header th a:hover {
    text-decoration: none !important;
}

.k-grid-header tr:not(.k-filter-row) th a.k-grid-filter:hover {
    border-color: #4682ba;
}

.k-grid tr:hover {
    background: transparent;
}

/* By default, Bootstrap sets a background colour for the entire current-sort column, which
   looks weird and doesn't sit well with our alternate row colour, so we hide it by setting a
   background for the non-aternate rows.
*/
.k-grid tr {
    background-color: #fff;
}

.pro-alternate-row,
.k-grid tr.pro-alternate-row,
.k-grid .k-alt {
    background-color: #fcfcfc;
}

.k-grid tr.pro-grid-data-row td {
    border-color: #fff;
    line-height: 1.5em;
}

.k-grid tr.pro-grid-data-row.pro-alt td {
    border-color: #f9f9f9;
}

.k-grid .pro-multi-row-top {
    padding-top: 4px;
    padding-bottom: 0;
    vertical-align: top;
}

.k-grid .pro-multi-row-inner {
    padding-top: 0;
    padding-bottom: 0;
    vertical-align: top;
}

.k-grid .pro-multi-row-bottom {
    padding-top: 0;
    padding-bottom: 0;
    vertical-align: top;
}

.k-grid .pro-multi-row-top.pro-grid-priority-image {
    padding-top: 8px;
    text-align: center;
    width: 30px;
    padding-left: 0;
    padding-right: 0;
}

.k-grida .pro-multi-row-top.pro-grid-priority-image {
    padding-top: 8px;
    text-align: center;
    width: 30px;
}

.k-grid .pro-row-hovered td {
    background-color: #ebebeb !important;
    border-left-color: #ebebeb !important;
    border-bottom-color: #ebebeb !important;
}

.k-grid .pro-grid-data-row.pro-current-row td {
    background-color: #ddd !important;
    border-color: #ddd !important;
}

.k-grid .k-state-default {
    color: #535b6a;
}

.k-grid td.pro-grid-center {
    text-align: center;
}

.k-grid td.pro-grid-right {
    text-align: right;
}

.pro-grid-top {
    vertical-align: top !important;
    padding-top: 6px !important;
}

.k-grid th a.k-active {
    background-color: #888;
    color: #fff;
}

.k-grid .pro-grid-info .glyphicons:before {
    padding: 0;
    padding-top: 4px;
}

.k-grid .pro-row-selector {
    margin: 0;
    margin-top: 2px;
}

.k-grid .pro-no-search-results-fixed-height {
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    font-size: 16px;
    position: relative;
}

.k-grid .pro-no-search-results {
    min-height: 100px;
    padding-top: 50px;
    text-align: center;
    font-size: 16px;
}

.k-grid .pro-grid-row-main.pro-bold-result-data td {
    font-weight: bold;
}

.pro-fixed-grid-pager .pro-grid-export-options,
.k-grid .pro-grid-export-options {
    float: right;
    padding: 0 10px;
    font-size: 24px;
    line-height: 20px;
    order: 100; /*make sure it's at the end*/
}

.pro-fixed-grid-pager .pro-grid-export-options a,
.k-grid .pro-grid-export-options a {
    display: inline-block;
    padding: 3px;
    border: solid 1px transparent;
    border-radius: 2px;
    font-size: 20px;
}

.pro-fixed-grid-pager .pro-grid-export-options a .fa:before,
.k-grid .pro-grid-export-options a .fa:before {
    padding: 0;
}

.pro-fixed-grid-pager .pro-grid-export-options a:hover,
.k-grid .pro-grid-export-options a:hover {
    background-color: #ddd;
    border-color: #ccc;
}

.pro-grid-totals-row td {
    font-weight: bold;
    color: #000;
    border-top: solid 1px #eee !important;
}

.pro-fixed-grid-container {
    overflow-y: auto;
}

.pro-fixed-grid-pager {
    width: 100%;
}

.pro-fixed-grid-container {
    margin: 0 !important;
}

div.k-grid-norecords {
    height: 70% !important;
    display: block;
}

.pro-grid-totals-row td {
    font-weight: bold;
    color: #000;
    border-top: solid 1px #eee !important;
}

/* This button appears in the grid filter row and show the drop-down list of filte actions. */
.k-dropdown-operator {
    border-color: #ceced2;
    background-color: #eaeaea !important;
    background-image: linear-gradient(to bottom, #eaeaea, #dedede);
}

.k-dropdown-operator.k-picker-md .k-input-button {
    padding: 0;
}

.k-filtercell {
    display: block;
    position: relative;
}

.k-grid .k-filter-row .k-input-md .k-input-inner,
.k-grid .k-filter-row .k-picker-md .k-input-inner,
.k-grid .k-filter-row .k-input-md .k-input-button,
.k-grid .k-filter-row .k-input-md .k-spinner-increase,
.k-grid .k-filter-row .k-input-md .k-spinner-decrease,
.k-grid .k-filter-row .k-picker-md .k-input-button,
.k-grid .k-filter-row .k-picker-md .k-spinner-increase,
.k-grid .k-filter-row .k-picker-md .k-spinner-decrease,
.k-grid .k-filter-row .k-autocomplete .k-input-inner,
.k-grid .k-filter-row .k-dropdown .k-input,
.k-grid .k-filter-row .k-dropdown .k-select,
.k-grid .k-filter-row .k-numeric-wrap .k-input,
.k-grid .k-filter-row input.k-textbox {
    line-height: 25px !important;
    height: 25px !important;
    padding: 0px 2px !important;
    font-size: 14px;
    padding-right: 30px;
}

.k-grid .k-filter-row select {
    padding-top: 4.5px !important;
    padding-bottom: 4.5px !important;
}

.k-grid .k-filter-row .k-datepicker.k-focus {
    background-color: #fff !important;
}

.k-grid .k-filter-row .k-autocomplete.k-focus,
.k-grid .k-filter-row .k-autocomplete {
    height: auto;
    background-color: #fff !important;
    position: absolute;
    left: 0px;
    margin-right: 40px;
}

.k-grid .k-filter-row .k-numeric-wrap .k-input {
    line-height: 24px !important;
    height: 24px !important;
}

.k-grid .k-filter-row .k-autocomplete input {
    max-width: 92% !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.k-grid .k-filter-row .k-autocomplete input:focus {
    max-width: 92% !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.k-grid-header .k-header .k-link {
    color: #535b6a;
    line-height: 18px;
}

/* If the Kendo grid column cannot be sorted then show normal cursor. */
.k-grid-header .k-header.pro-not-sortable .k-link:hover {
    cursor: default !important;
}

/****************************************
           Kendo Grid (end of)
****************************************/


/****************************************
           Kendo Pager 
****************************************/

.k-pager {
    padding: 5px;
    font-size: 14px;
    background-color: #f3f3f4;
    border: solid 1px #dee2e6;
    border-top: none;
}

.k-pager-numbers-wrap .k-button {
    width: 32.1875px;
    height: 32.1875px;
    min-width: 32.1875px !important;
    min-height: 32.1875px !important;
    color: #333;
    margin: 0;
    margin-right: 1px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-color: #ceced2 !important;
    border-radius: 4px;
    padding: 0;
    z-index: 1;
}

.k-pager-numbers-wrap .k-pager-numbers .k-button {
    border-color: transparent !important;
}

.k-pager-numbers-wrap .k-pager-numbers .k-button.k-selected {
    color: #fff;
    background-color: #777 !important;
    border-color: #6f6f6f !important;
    background-image: url('../textures/highlight.png') !important;
    background-image: none, linear-gradient(to bottom, rgba(255,255,255,.2) 0%, rgba(255,255,255,0) 100%) !important;
}

.k-pager-numbers-wrap .k-pager-numbers .k-button:not(.k-selected):not(.k-disabled):hover {
    background-color: #eaeaea !important;
    border-color: #e6e6e6 !important;
    background-image: url('../textures/highlight.png') !important;
    background-image: none, linear-gradient(to bottom, rgba(255,255,255,.2) 0%, rgba(255,255,255,0) 100%) !important;
}

.k-pager-wrap {
    padding: 0.333em 0.25em;
    background-color: #f3f3f4;
    border-width: 1px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    cursor: default;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.k-button.k-pager-nav:not(.k-disabled) {
    background-color: #eaeaea !important;
    background-image: linear-gradient(to bottom, #eaeaea, #dedede);
}

/****************************************
           Kendo Pager (end of)
****************************************/


/****************************************
           Kendo Auto-Complete
****************************************/
.k-autocomplete-clearable {
    background-image: none !important;
}

.pro-auto-complete {
    overflow-x: hidden;
}

.pro-auto-complete-header {
    background-color: #ebebeb;
    border: 0;
    border-bottom: solid 1px #bbb !important;
}

.pro-auto-complete-header > span {
    display: inline-block;
    box-sizing: border-box;
    background-color: #ebebeb;
    font-weight: bold;
    padding: 4px 0;
    color: #555 !important;
}

.pro-auto-complete-header > span:nth-child(1) {
    padding-inline-start: 8px;
}

.pro-auto-complete-footer {
    padding: 8px;
}

.pro-auto-complete-header,
.k-input-inner {
    font-size: 14px;
}

.k-rounded-md {
    border-radius: 3px;
}

.k-autocomplete {
    height: 30px;
    background-color: #fff;
    border: solid 1px #ccc;
}

.k-autocomplete .k-input1,
.k-autocomplete .k-input-inner {
    line-height: 24px !important;
    padding: 3px !important;
    background-color: #fff;
}

.pro-auto-complete-container {
    border-radius: 0 0 4px 4px;
}

.pro-auto-complete-dropdown .k-list-item-text {
    font-size: 13px;
    width: 100%;
}

.k-combobox .k-dropdown-wrap.k-focus .k-input {
    box-shadow: none !important;
}

.pro-combo-box-dropdown,
.pro-multi-select-dropdown,
.pro-auto-complete-dropdown,
.pro-auto-complete-container {
    background-color: #fff;
    overflow-x: hidden !important;
}

.pro-auto-complete-list .k-item,
.pro-auto-complete-list .k-list-item .k-list-item-text {
    line-height: 1em !important;
    min-width: 300px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

.pro-auto-complete-list .k-list-item {
    padding-inline-start: 8px;
}

.k-autocomplete .k-i-loading {
    position: absolute;
    top: auto;
    right: 0.4em;
    bottom: 0.4em;
}

.pro-auto-complete-item {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    text-align: left;
    vertical-align: top;
    padding: 0;
    padding-top: 4px;
    padding-bottom: 4px;
    color: #333 !important;
    overflow-wrap: break-word;
}

.k-autocomplete .k-i-x,
.k-autocomplete .k-i-loading {
    font-size: 100%;
    display: none;
    position: absolute;
    cursor: pointer;
    right: calc(1.14285714em - 8px);
}

.k-autocomplete .k-i-x,
.k-autocomplete .k-i-loading {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.k-autocomplete.k-hover .k-i-x,
.k-autocomplete.k-focus .k-i-x,
.k-autocomplete.k-hover .k-i-loading,
.k-autocomplete.k-focus .k-i-loading {
    display: inline-block;
    outline: none;
}

.pro-auto-complete-item.pro-centre {
    text-align: center;
}

.pro-auto-complete-item.pro-right {
    text-align: center;
    text-align: right;
    padding-right: 6px;
}

.pro-no-data {
    color: #000;
    font-weight: 500;
    text-transform: none;
    font-size: 14px;
}

/*.k-list > .k-hover,
.pro-auto-complete-list > .k-hover,
.k-list-item.k-hover,
.k-list-item.k-focus {
    background-color: #ebebeb !important;
    border-color: #ebebeb !important;
}*/

.k-list-item:focus,
.k-list-item.k-focus {
    box-shadow: none !important;
}

/* Fixed css of stop impact on main menu */
:not(.k-list-item):not(.mainMenuItem):not(.pro-environment):not(.k-list.pro-multiselect):not(.k-selected).k-focus,
:not(.mainMenuItem):not(.pro-environment).k-list:not(.pro-multiselect) > .k-focus {
    -webkit-box-shadow: none;
    box-shadow: none;
/*    background-color: #ebebeb;
    border-color: #ebebeb;*/
}

.mainMenuItem.k-focus,
.pro-environment.k-focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.k-menu-expand-arrow {
    width: 1em;
}
/* End of "Fixed css of stop impact on main menu" */


.pro-error-field {
    box-shadow: 0 0 3px #d59696 !important;
    box-shadow: 0 0 3px #db7d7d !important;
    border: solid 1px darkred !important;
}

/****************************************
      Kendo Auto-Complete (end of)
****************************************/



/****************************************
      Kendo Multi-Select (start)
****************************************/

/*.k-multiselect {
    display: inline-block;
}

.k-multiselect .k-select {
    top: 2px;
}

.k-multiselect .k-input {
    height: 30px;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: 1px;
}

.k-multiselect .k-button {
    height: 24px;
}

.k-multiselect .k-button .k-icon:before {
    top: -5px;
}

.pro-multi-select-list.k-list > .k-focus {
    border-radius: 0;
}

.pro-multi-select-list.k-list > .k-selected {
    background-image: none !important;
    background-color: #ddd;
    border-top: solid 1px #ccc;
    border-radius: 0;
    color: #333;
}

.pro-multi-select-list.k-list > .k-focus.k-selected {
    background-image: none !important;
    background-color: #d0d0d0 !important;
    -webkit-box-shadow: none;
    box-shadow: none none;
}

.pro-multi-select-header {
    border-width: 0 0 1px 0;
    background-color: #ebebeb;
}

.pro-multi-select-header > span {
    display: inline-block;
    box-sizing: border-box;
    background-color: #ebebeb;
    font-weight: bold;
    color: #777;
}

.pro-multi-select-header > span:nth-child(1) {
    padding-inline-start: 8px;
}

.pro-multi-select-item {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    text-align: left;
    vertical-align: top;
    padding: 0;
    padding-left: 8px;
    color: #333 !important;
}

.pro-multi-select-item.pro-centre {
    text-align: center;
}

.pro-multi-select-item.pro-right {
    text-align: center;
    text-align: right;
    padding-right: 6px;
}

.pro-multi-select-dropdown {
    border: solid 1px #1c6cab !important;
    border-top: none;
    box-shadow: 0 0 1px 1px #c0d6e8 !important;
}
*/
/****************************************
      Kendo Multi-Select (end of)
****************************************/



/****************************************
      Kendo Combo-Box (start)
****************************************/

.pro-combobox {
    height: 28px;
}

.pro-combobox.k-focus {
    border: solid 1px #1c6cab !important;
}

.pro-combobox.k-focus input {
    background-color: #fff;
}

.pro-combo-boxlist li {
    padding: 0 !important;
    margin: 0 !important;
    background-color: orange !important;
    border: none !important;
}

.pro-combo-box-list.k-list > .k-focus {
    border-radius: 0;
}

.pro-combo-boxlist.k-list > .k-selected {
    background-image: none !important;
    background-color: #ddd;
    border-top: solid 1px #ccc;
    border-radius: 0;
    color: #333;
}

.pro-combo-box-list.k-list > .k-focus.k-selected {
    background-image: none !important;
    background-color: #d0d0d0 !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.k-popup {
    border-radius: 3px;
}

.k-popup > .pro-combo-box-header {
    border: none;
    border-bottom: solid 1px #ddd !important;
    background-color: #ebebeb;
}

.pro-combo-box-header > span {
    display: inline-block;
    box-sizing: border-box;
    background-color: #ebebeb;
    font-weight: bold;
    padding: 6px;
}

.pro-combo-box-item {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    vertical-align: top;
    padding: 0;
    padding-left: 8px;
    color: #333 !important;
}

.k-list-item.k-selected .pro-combo-box-item {
    color: #fff !important;
}

/* Combobox with multiple columns in the drop-down results. */
.pro-multi-column-results .k-list-md .k-list-item {
    padding: 4px 0px;
}

.k-list-item-text {
    display: flex;
    flex-direction: row;
}

.pro-combo-box-item:last-of-type {
    border-right: none;
}

.pro-combo-box-item.pro-centre {
    text-align: center;
}

.pro-combo-box-item.pro-right {
    text-align: center;
    text-align: right;
    padding-right: 6px;
}

.pro-combo-box-dropdown {
    border: solid 1px #1c6cab !important;
    border-top: none;
    box-shadow: 0 0 1px 1px #c0d6e8 !important;
    margin-top: 4px !important;
}

.pro-combo-box-header > span {
    box-sizing: border-box !important;
}

.k-popup .k-list.pro-combo-box-list .k-item {
    border: none;
    margin: 0;
    padding: 0;
}

.k-autocomplete .k-input-inner {
    padding: 0;
    display: block;
    width: 100%;
}

.k-combobox-clearable .k-input {
    height: 2em;
}

.k-combobox .k-dropdown-wrap .k-select {
    height: 2em;
    line-height: 1em;
}

.k-combobox .k-dropdown-wrap .k-input {
    padding: 0;
}

.k-combobox .k-dropdown-wrap:before, .k-picker-wrap:before, .k-numeric-wrap:before {
    line-height: 1em;
    height: 1em;
}

.k-combobox .k-icon:before {
    top: 0.5em;
}

.k-pager-sizes .k-icon {
    position: static;
}


/****************************************
      Kendo Combo-Box (end of)
****************************************/



/****************************************
      Kendo Menu
****************************************/

/* We dislike the silver gradient that is the default for this style */
.k-menu .k-hover > .k-link,
.k-menu .k-menu-scroll-button:hover,
.k-menu.k-header {
    background-image: none;
}

.k-menu {
    position: absolute;
    width: 100%;
}

.k-menu .k-sprite,
.k-menu .k-menu-link-text {
    margin: -2px 4px 0 -4px;
    vertical-align: middle;
}

.k-menu-horizontal > .k-item > .k-link > .k-menu-expand-arrow {
    margin: -2px 0 0;
}

element.style {
}

#mainMenu {
    padding-top: 0;
    padding-bottom: 0;
}

#mainMenu .k-link {
    border: 0;
    padding: 14px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 0;
    height: 24px;
}

#mainMenu .k-link {
    color: #f5f5f5;
    font-size: 14px;
    border: none;
    min-height: 30px;
}

#mainMenu .pro-environment > .k-link,
#mainMenu .mainMenuItem > .k-link {
    min-height: 48px;
}

ul .k-menu-horizontal {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}

.mainMenuItem k-selected {
    background-color: transparent;
}


/****************************************
      Kendo Menu (end of)
****************************************/


/****************************************
      Kendo Date-Picker 
****************************************/
.k-datepicker {
    width: 114px !important;
}

.k-datepicker .k-input,
.k-datepicker .k-select {
    height: 24px !important;
    padding: 0 !important;
    line-height: 24px;
}

.k-datepicker .k-select {
    line-height: 24px;
}

.k-picker-wrap .k-input {
    width: 88px !important;
    font-size: 14px;
}

.k-picker-wrap .k-select {
    width: 24px !important;
}

/****************************************
      Kendo Date-Picker (end of)
****************************************/


/****************************************
      File Uploader
****************************************/
.k-upload-button-wrap {
    margin-right: 6px;
}

/****************************************
      General
****************************************/


/* This styling has been done for the grid filter menu lists */
/* These list were displayiong a white font and a blue shadow border for the current list item. */
.k-list:not(.pro-multiselect) > .k-selected,
.k-list:not(.pro-multiselect) > .k-state-highlight {
    color: #333;
}

/* This styling has been done for the grid filter menu lists */
/* These list were displayiong a white font and a blue shadow border for the current list item. */
.k-list:not(.pro-multiselect) > .k-focus.k-selected {
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #ddd;
}

.k-menu-item {
    font-size: 20px;
}

.k-menu-bar, .k-menu {
    font-family: Arial;
}

.k-window {
    font-size: 14px;
    font-family: Arial;
    line-height: normal;
    justify-content: flex-start;
}

.k-window-title {
    margin: 0;
}

input:not([type]):not(.pro-combobox):focus,
input[type="text"]:not(.k-input-inner):focus,
input[type="search"]:not(.k-input-inner):focus,
input[type="password"]:not(.k-input-inner):focus,
select:focus,
.k-input-solid:focus,
.k-input-solid.k-focus,
.k-autocomplete.k-focus,
.ui-autocomplete-input:focus,
textarea:focus,
.editField:focus,
#header select:focus,
#header input:not(.pro-combobox):not(.k-input-inner):focus,
#header textarea:focus,
#workArea .line.selected input:not(.pro-combobox):not(.k-input-inner):focus,
#workArea .line.selected select:focus,
#workArea .line.selected textarea:focus,
.section select:focus,
.section input:not(.pro-combobox):not(.k-input-inner):focus,
.section textarea:focus,
#order .line.selected select:focus,
#order .line.selected input:not(.pro-combobox):not(.k-input-inner):focus,
#order .line.selected textarea:focus {
    border-color: #1c6cab;
    box-shadow: 0 0 1px 1px #c0d6e8;
}