/*============================================================*\
    MAIN CSS FILE
\*============================================================*/

@font-face {
    font-family: 'Helvetica';
    font-style: normal;
    font-weight: 400;
    src: local('Helvetica'), url(../fonts/Helvetica.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Light';
    font-style: normal;
    font-weight: 400;
    src: local('Montserrat-Light'), url(../fonts/Montserrat-Light.woff) format('woff');
}

@font-face {
    font-family: 'Montserrat-Regular';
    font-style: normal;
    font-weight: 400;
    src: local('Montserrat-Regular'), url(../fonts/Montserrat-Regular.ttf) format('truetype');
}

body {
    background-color: #eaedea;
    font-family: Montserrat-Light;
    font-size: 10px;
    line-height: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    overflow: hidden;
    height: 100%;
    margin: 0;
}

/*============================================================*\
    GLOBAL
\*============================================================*/

.bt-hidden {
    visibility: hidden;
}

.bt-none {
    display: none;
}

.bt-clear {
    float: none;
    clear: both;
}

.padding-0 {
    padding: 0px;
}

.margin-0 {
    margin: 0px;
}

.margin-left-right-20px {
    margin-left: 20px;
    margin-right: 20px;
}

.padding-20px {
    padding: 20px;
}

.padding-left-right-20px {
    padding-left: 20px;
    padding-right: 20px;
}

.padding-left-right-5px {
    padding-left: 5px;
    padding-right: 5px;
}

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

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.relative {
    position: relative;
}

.middle {
    position: relative;
    margin-left: 15px;
    margin-right: 15px;
    transform: translateY(50%);
}

right-0 {
    right: 0;
}

left-0 {
    left: 0;
}

.to-bottom {
    position: absolute;
    bottom: 0px;
}

.overlap-container {
    position: relative;
}

.overlap {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    background-color: lightGrey;
    opacity: 0.8;
    min-height: 6em;
}

    .overlap > i {
        line-height: 120%;
    }

    .overlap .main-spinner {
        display: table-cell;
        vertical-align: middle;
    }

.clickable {
    cursor: pointer;
}

.scrollable {
    overflow: auto;
    height: 100%;
    pointer-events: auto !important;
}

.centered {
    margin: 0px auto;
}

.disabled {
    pointer-events: none;
    cursor: auto;
}

.background-edit {
    background-color: #fff;
}

.affix-top {
    position: fixed;
    top: 0px;
}

.affix-bottom {
    position: fixed !important;
    bottom: 0px !important;
}

.col-left-margin {
    margin-right: 9px !important;
}

.col-center-margin {
    margin-left: 9px !important;
    margin-right: 9px !important;
}

.col-right-margin {
    margin-left: 9px !important;
}

.block {
    text-align: center;
    white-space: nowrap;
}

    .block:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
    }

    .block .centered {
        display: inline-block;
        vertical-align: middle;
        text-align: left;
    }

/*============================================================*\
    BASE CLASS
\*============================================================*/

/*======= SIZE OF SCREEN ==========*/

@media screen and (min-width: 9in) {
    #screen {
        opacity: 0;
    }
}

@media screen and (max-width: 9in) {
    #screen {
        opacity: 1;
    }
}

/*============BASE GRID STYLE============*/
.k-grid.k-widget {
    /*IES color: #4d4d4d;*/
    color: #000000;
    border-top-width: 5px;
    border-top-color: #ffff01;
    background-color: #fffffc;
}
/*IES*/
.k-grid-header .k-header .k-link,
.k-grid-header .k-header,
.k-grid-header .k-link,
.k-grid-header .k-link:link,
.k-pager-info,
.k-scheduler-header,
.k-scheduler-agendaview .k-scheduler-datecolumn {
    color: #000;
}

.fk-row.fk-row.empty-row {
    height: 60px;
}
/* test ies .main-view.fk-row.col-xs-12 {
    background-color: yellow !important;
}
.main-view.fk-row.col-xs-12.k-loading-text {
    text-indent: 0;
    top: 50%;
    left: 50%;
    background-color: #0F0;
}
.main-view.fk-row.col-xs-12.k-loading-image {
    display: none;
}

.main-view.fk-row.col-xs-12.k-loading-mask {
    z-index: 3;
}*/
/*-----------------*/

k-loading-mask {
    background-color: dimgrey;
    opacity: 40%;
}

.k-grid .k-alt {
    /*background-color: #fffffc;*/
    background-color: #f2f5f2;
}

.background-edit .fk-prospect .kf-deleteprospect.k-grid.k-widget {
    border-top-color: #ffff01;
}

.background-edit .k-grid.k-widget,
.background-edit .fk-prospect .fk-deleteprospect.edit.k-grid.k-widget {
    border-top-color: #002426;
}

.k-grid tr:not(.k-state-selected):hover {
    background: none;
    color: inherit;
}

.k-grid tr.k-alt:not(.k-state-selected):hover {
    /*background: #fffffc;*/
    background-color: #f2f5f2;
}

.k-grid .k-pager-numbers .k-state-selected {
    border-top-color: #ffff01;
    border-top-width: 2px;
    color: #4d4d4d;
    background-color: #ffff01;
}
/*IES SELECTED ROW -- .k-state-selected*/

tr.activeRow td {
    background-color: violet;
}

k-alt ng-scope k-state-selected k-grid-edit-row .activeRow {
    background-color: whitesmoke !important;
}

.k-state-selected td, .k-grid td.k-state-selected, .k-grid td.k-state-selected.k-state-focused, .k-grid tr.k-state-selected, .k-state-selected.k-line {
    background-color: #9f9f9d !important; /* #9f9f9d*/
    /* background-image: linear-gradient(#9f9f9d 0%, #ffffff 100%) !important;*/
    /*#ffff01 50%,*/
}

    /*div.k-grid .k-selectable tr.k-state-selected {
    background-color: #e6e6e6;
}*/
    .k-grid td.k-state-selected, .k-grid tr.k-state-selected > td {
        border-color: #e6e6e6 !important;
        /* border-bottom-color: #5a6660 !important;
    border-top-color: #5a6660 !important;*/
        /* border-color: #e6e6e6 !important;*/
    }

.k-grid td.k-state-selected, .k-grid tr.k-state-selected, .k-listview > .k-state-selected, .k-state-selected .k-progress-status {
    color: #0a0a0a;
}
/*
.k-grid .k-alt.k-state-selected {
    background-color: #f1f1f1 !important;
    color: #000000;
}
    */
.k-grid.k-widget .k-grid-header {
    background-color: #eaedea;
}

    .k-grid.k-widget .k-grid-header .k-grid.header-wrap {
    }

    .k-grid.k-widget .k-grid-header .k-grid-header-wrap table {
    }

        .k-grid.k-widget .k-grid-header .k-grid-header-wrap table thead {
        }

            .k-grid.k-widget .k-grid-header .k-grid-header-wrap table thead tr {
                /*height: 40px;*/
            }

                .k-grid.k-widget .k-grid-header .k-grid-header-wrap table thead tr th {
                    /* background-color: #eaedea; #b6b6b6;ies*/
                    background-color: #d4d1d1;
                    padding: 10px 10px; /*20px 10px*/
                }

                    .k-grid.k-widget .k-grid-header .k-grid-header-wrap table thead tr th .k-link {
                        text-decoration: none;
                    }

.k-grid-header .k-header {
    overflow: visible !important;
    white-space: normal !important;
    vertical-align: top !important;
}

.k-grid.k-widget.k-grid-content {
}

    .k-grid.k-widget .k-grid-content table {
    }

        .k-grid.k-widget .k-grid-content table tbody {
        }

            .k-grid.k-widget .k-grid-content table tbody .cell-danger {
                border-bottom-color: #d74123;
            }

            .k-grid.k-widget .k-grid-content table tbody tr {
                height: 30px !important;
            }

                .k-grid.k-widget .k-grid-content table tbody tr:last-child > td {
                    border-bottom-width: 1px;
                }

                .k-grid.k-widget .k-grid-content table tbody tr td {
                    border-left-width: 1px;
                    padding: 05px 05px 05px;
                    /*padding: 30px 10px 10px; ies*/
                }

                    .k-grid.k-widget .k-grid-content table tbody tr td.k-edit-cell {
                        padding: 19.9px 0px 10px;
                    }

                        .k-grid.k-widget .k-grid-content table tbody tr td.k-edit-cell .k-textbox {
                            margin-top: -0.9px;
                        }

                        .k-grid.k-widget .k-grid-content table tbody tr td.k-edit-cell .k-numerictextbox {
                            margin-top: -3.5px;
                            padding: 19.9px 5px 10px;
                        }

                    .k-grid.k-widget .k-grid-content table tbody tr td:last-child {
                        padding-top: 05px;
                        /*padding-top: 22px; ies*/
                    }

                    .k-grid.k-widget .k-grid-content table tbody tr td .grid-action {
                        text-decoration: none !important;
                        padding-top: 10px;
                    }

                    .k-grid.k-widget .k-grid-content table tbody tr td .grid-action-spacer {
                        padding-top: 10px;
                        padding-right: 10px;
                        margin-left: 10px;
                        border-left-width: 1px;
                        border-left-color: #4d4d4d;
                        border-left-style: solid;
                    }

/*--- FK-DROPDOWN ---*/
/*Custom dropdown layout for fleet keeper layout*/
.k-popup .k-list .k-item {
    padding: 2px 10px;
    margin: 5px 0px;
    color: #999999;
}

.k-popup .k-list .k-state-selected,
.k-popup .k-list .k-state-focused,
.k-popup .k-list .k-state-hover {
    background-color: transparent;
    color: #4D4D4D;
    border: none;
}

.k-popup .k-list .k-state-hover {
    background-color: #FFFF01;
}

.k-fieldselector .k-li {
    min-height: 0px;
    line-height: 12px;
}

.k-popup {
    box-shadow: none;
    -webkit-box-shadow: none;
}

    .k-fieldselector .k-list .k-item,
    .k-popup .k-list .k-state-focused,
    .k-popup .k-list .k-state-hover,
    .k-popup .k-list .k-state-selected {
        border: 0px;
    }

    .k-popup .k-list-optionlabel {
        min-height: 21px;
    }

        .k-popup .k-list-optionlabel.k-state-hover {
            background-color: #FFFF01;
        }

.k-icon.k-i-arrow-s {
    background-image: url('fk-down.svg');
    /*background-position: 0 -224px;*/
    background-position: 0px 0px !important;
    opacity: 0.41;
}

.k-icon.k-i-arrow-n,
.k-state-border-down .k-select .k-icon.k-i-arrow-s {
    /*background-position: 0 -192px;*/
    background-image: url('fk-up.svg');
    background-position: 0px 0px !important;
    opacity: 0.41;
}

.k-icon.k-i-search,
.k-state-border-down .k-select .k-icon.k-i-search,
.k-icon.k-font-icon.k-i-search {
    background-image: url('fk-search.svg');
    background-position: 0px 0px;
    opacity: 0.41;
}

.k-textbox .k-font-icon, .k-textbox .k-icon.k-font-icon {
    color: transparent;
}

/*--- FK-AUTOCOMPLETE ---*/
/*Custom autocomplete layout for fleet keeper layout*/
.k-autocomplete.k-header {
    padding: 0px 10px;
}

.k-autocomplete.k-state-focused,
.k-autocomplete.k-state-hover,
.k-autocomplete.k-state-border-up,
.k-autocomplete.k-state-border-down {
    color: #4D4D4D;
    box-shadow: none;
    -webkit-box-shadow: none;
}

    .k-autocomplete .k-input,
    .k-autocomplete.k-state-focused .k-input {
        border-bottom: 1px solid #CCCCC9;
        border-left: 0px;
        border-right: 0px;
        border-top: 0px;
    }

.k-autocomplete.k-state-border-up {
    border-top-color: transparent;
}

/*--- FK-DATETIME ---*/
/*Custom dropdown layout for fleet keeper layout*/
.k-calendar .k-header.k-hideYear,
.k-calendar .k-header.k-hideYear .k-nav-fast {
    background-color: #FFFF01 !important;
    color: #FFFF01 !important;
}

    .k-calendar .k-header.k-hideYear .k-nav-prev,
    .k-calendar .k-header.k-hideYear .k-nav-next {
        display: none;
    }

.k-calendar .k-header {
    background-color: #FFFF01;
}

    .k-calendar.k-popup,
    .k-calendar .k-header .k-link,
    .k-calendar td.k-state-hover.k-today .k-link {
        color: #4D4D4D;
    }

    .k-calendar .k-header .k-nav-prev.k-state-hover,
    .k-calendar .k-header .k-nav-fast.k-state-hover,
    .k-calendar .k-header .k-nav-next.k-state-hover {
        background-color: transparent;
    }

.k-calendar .k-content thead .row {
    border-bottom: 1px solid #CCCCC9;
}

.k-calendar .k-footer {
    height: 20px;
    border-top: none;
}

    .k-calendar .k-footer .k-nav-today {
        display: none;
    }

.k-calendar .k-today,
.k-calendar td.k-today.k-state-focused {
    background-color: #CCCCC9;
}

.k-calendar td.k-state-focused,
.k-calendar td.k-state-selected,
.k-calendar td.k-state-focused.k-state-selected {
    background-color: transparent;
    box-shadow: none;
    -webkit-box-shadow: none;
}

    .k-calendar td.k-state-focused.k-state-selected .k-link {
        color: #4D4D4D;
        font-weight: bold;
    }

.k-calendar td.k-state-hover,
.k-calendar td.k-state-hover.k-today,
.k-calendar td.k-state-hover.k-state-selected {
    background-color: #FFFF01;
    color: #4D4D4D;
}

.k-other-month .k-link {
    color: #999999;
}

.k-i-arrow-w.k-icon,
.k-state-hover .k-i-arrow-w.k-icon,
.k-calendar .k-i-arrow-w.k-icon,
.k-calendar .k-state-hover .k-i-arrow-w.k-icon {
    background-image: url('fk-left.svg');
    background-position: 0px 0px;
    opacity: 0.41;
}

.k-i-arrow-e.k-icon,
.k-state-hover .k-i-arrow-e.k-icon,
.k-calendar .k-i-arrow-e.k-icon,
.k-calendar .k-state-hover .k-i-arrow-e.k-icon {
    background-image: url('fk-right.svg');
    background-position: 0px 0px;
    opacity: 0.41;
}

.k-link:not(.k-state-disabled):hover > .k-i-arrow-w,
.k-button:not(.k-state-disabled):hover .k-i-arrow-w,
.k-calendar :not(.k-state-disabled).k-link:hover > .k-i-arrow-w,
.k-link:not(.k-state-disabled):hover > .k-i-arrow-e,
.k-button:not(.k-state-disabled):hover .k-i-arrow-e,
.k-calendar :not(.k-state-disabled).k-link:hover > .k-i-arrow-e {
    background-position: 0px 0px;
}

.k-scheduler .k-i-refresh {
    background-position: -32px -112px;
    opacity: 0.41;
}

.k-icon.k-i-calendar {
    background-image: url('fk-calendar.svg');
    background-position: 0px 0px;
    opacity: 0.41;
}

.k-icon.k-i-clock {
    background-image: url('fk-time.svg');
    background-position: 0px 0px;
    opacity: 0.41;
}

/*--- FK-MULTISELECT ---*/
/*Custom popup layout for fleet keeper layout*/
.k-multiselect.k-state-focused,
.k-multiselect.k-state-hover,
.k-multiselect.k-state-border-up,
.k-multiselect.k-state-border-down,
.k-multiselect.k-header.k-state-focused {
    color: #4D4D4D;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.k-multiselect .k-button,
.k-multiselect.k-header.k-state-focused {
    background-color: transparent;
    border-color: transparent;
}

.k-multiselect-wrap li {
    margin: 0px 15px 0px 0px;
    padding: 0px 20px 0px 5px;
}

    .k-multiselect-wrap li span {
        margin-right: 0px;
    }

.k-multiselect-wrap .k-icon.k-i-close {
    background-image: url('fk-close-small.svg');
    background-position: 0px 0px;
    opacity: 0.41;
}

.k-multiselect.k-state-disabled .k-icon.k-i-close {
    background-image: none;
}

.k-multiselect-wrap :not(k-state-disabled).k-button:hover .k-i-close {
    background-position: 0px 0px;
}

/*--- FK-POPUP ---*/
/*Custom popup layout for fleet keeper layout*/
.k-window {
    padding-top: 76px;
}

    .k-window .k-window-titlebar {
        padding: 30px 0px;
        margin-top: -76px;
    }

.k-window-titlebar {
    background-color: #FFFFFF;
    color: #4D4D4D;
    font-size: 10px;
    line-height: 12px;
    height: auto;
    border-bottom: 1px solid #CCCCC9;
}

    .k-window-titlebar .k-window-title {
        left: 0px;
        padding-left: 20px;
    }

    .k-window-titlebar .k-window-actions {
        right: 0px;
        padding-top: 20px;
    }

    .k-window-titlebar .k-state-hover {
        background-color: transparent;
        border: none;
    }

    .k-window-titlebar .k-window-action {
        padding-right: 20px;
    }

div.k-window-content {
    padding: 40px 20px 0px 20px;
}

.k-window .k-i-close.k-icon,
.k-window-titlebar :not(.k-state-disabled).k-link:hover > .k-i-close.k-icon {
    background-image: url('fk-close-small-20');
    opacity: 0.41;
}

.k-window-actions .k-link:last-child {
    padding-top: 6px;
}

.k-icon.k-i-save {
    background-image: url('fk-save-check.svg');
    opacity: 0.41;
}

.k-icon.k-i-save {
    width: 20px;
    height: 23px;
}

.k-icon.k-i-print {
    background-image: url('fk-print.svg');
    opacity: 0.41;
}

.k-icon.k-i-print {
    width: 20px;
    height: 23px;
}

/*--- FK-SCHEDULER ---*/
.k-scheduler .k-scheduler-toolbar,
.k-scheduler .k-scheduler-toolbar .k-nav-today,
.k-scheduler .k-scheduler-toolbar .k-nav-today:hover,
.k-scheduler .k-scheduler-toolbar .k-nav-prev,
.k-scheduler .k-scheduler-toolbar .k-nav-prev:hover,
.k-scheduler .k-scheduler-toolbar .k-nav-next,
.k-scheduler .k-scheduler-toolbar .k-nav-next:hover,
.k-scheduler .k-scheduler-toolbar .k-link {
    background-color: #ebedea;
    border-color: #ebedea;
    color: #4d4d4d;
}

.k-scheduler .k-scheduler-table .k-today {
    background-color: #fff;
}

.k-scheduler .k-nonwork-hour,
.k-scheduler .k-today.k-nonwork-hour {
    background-color: rgba(121,165,252,0.1);
}

.k-scheduler .k-event,
.k-scheduler .k-task-complete {
    background-color: #98999b;
    border-color: #98999b;
}

.k-scheduler-layout tr + tr .k-scheduler-times th:last-child {
    vertical-align: top;
    white-space: normal;
    min-width: 250px;
}

/*--- FK-FILTER ---*/
.k-filter-menu,
.k-filter-menu .k-textbox,
.k-filter-menu .k-textbox:hover,
.k-filter-menu .k-dropdown,
.k-filter-menu .k-dropdown .k-state-default,
.k-filter-menu .k-dropdown-wrap.k-state-hover {
    background-color: #ccccc9;
}

    .k-filter-menu label {
        margin: 0px;
        font-weight: normal;
        display: block;
        color: #fff;
    }

    .k-filter-menu .k-widget.k-datepicker,
    .k-filter-menu .k-widget.k-numerictextbox {
        width: 100%;
        background-color: #fff;
    }

        .k-filter-menu .k-widget.k-datepicker .k-picker-wrap {
            border-bottom-color: transparent;
        }

            .k-filter-menu .k-widget.k-datepicker .k-picker-wrap .k-input {
                line-height: 2.214em;
            }

            .k-filter-menu .k-widget.k-datepicker .k-picker-wrap .k-icon.k-i-calendar {
                margin-top: 5px;
            }

    .k-filter-menu label input {
        margin-right: 10px;
    }

    .k-filter-menu .k-filter-help-text {
        visibility: hidden;
    }

    .k-filter-menu .k-textbox,
    .k-filter-menu .k-textbox:hover,
    .k-filter-menu .k-dropdown .k-input,
    .k-filter-menu .k-button {
        color: #fff;
    }

        .k-filter-menu .k-textbox input {
            text-transform: uppercase;
        }

    .k-filter-menu input {
        text-transform: uppercase;
        color: #444 !important;
    }

    .k-filter-menu .k-dropdown.k-header {
        border-top: none;
        border-left: none;
        border-right: none;
    }

    .k-filter-menu .k-textbox,
    .k-filter-menu .k-textbox:hover {
        background-color: #fff;
        margin-bottom: 15px;
    }

    .k-filter-menu .k-textbox,
    .k-filter-menu .k-dropdown.k-header {
        border-bottom: 1px solid #fff;
    }

    .k-filter-menu span.k-filter-and,
    .k-filter-menu .k-dropdown {
        width: 100%;
    }

    .k-filter-menu > div > div:last-child {
        border-color: #ccccc9;
    }

    .k-filter-menu .k-button {
        margin-top: 20px;
    }

        .k-filter-menu .k-button:hover {
            color: #4d4d4d;
            background-color: #ffff01;
        }

    .k-filter-menu .k-multicheck-wrap .k-label {
        color: #fff;
        margin: 15px 0px 0px 0px;
    }

        .k-filter-menu .k-multicheck-wrap .k-label input {
            margin: 0px 10px 0px 0px;
        }

/*.k-filter-menu .k-i-arrow-s,
    .k-filter-menu .k-state-hover .k-i-arrow-s {
        background-position: -16px -224px;
    }

    .k-filter-menu .k-i-arrow-n,
    .k-filter-menu .k-state-hover .k-i-arrow-n,
    .k-filter-menu .k-state-border-down .k-select .k-i-arrow-s {
        background-position: -16px -192px;
    }*/

/*--- COMMON ---*/
.k-input {
    text-transform: uppercase;
}

.k-state-disabled {
    opacity: 1;
}

.k-dropdown,
.k-multiselect,
.k-datetimepicker,
.k-datepicker,
.k-timepicker,
.k-autocomplete {
    width: 100%;
}

    .k-dropdown,
    .k-dropdown-wrap.k-state-disabled,
    .k-multiselect,
    .k-multiselect.k-state-focused,
    .k-multiselect.k-state-hover,
    .k-multiselect.k-state-focused.k-state-hover,
    .k-multiselect.k-header.k-state-disabled,
    .k-multiselect-wrap,
    .k-datetimepicker,
    .k-datepicker,
    .k-datepicker .k-input,
    .k-timepicker,
    .k-timepicker .k-input,
    .k-picker-wrap.k-state-disabled,
    .k-autocomplete,
    .k-autocomplete.k-state-focused,
    .k-autocomplete.k-state-disabled,
    .k-state-focused.k-picker-wrap .k-input,
    .k-state-hover.k-picker-wrap .k-input {
        background-color: transparent;
    }

        .k-dropdown.k-header,
        .k-multiselect.k-header,
        .k-multiselect.k-header.k-state-focused,
        .k-multiselect.k-header.k-state-hover,
        .k-datepicker.k-header,
        .k-timepicker,
        .k-timepicker.k-header,
        .k-datetimepicker.k-header,
        .k-autocomplete.k-header {
            border-color: transparent;
            border-top: 1px;
            border-bottom: 1px;
            border-left: 0px;
            border-right: 0px;
        }

        .k-dropdown.k-header {
            box-sizing: border-box;
        }

.k-dropdown-wrap,
.k-multiselect-wrap,
.k-picker-wrap {
    margin: 0px 9px;
    border-bottom: 1px solid #CCCCC9;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
}

    /*.k-dropdown-wrap,
.k-multiselect-wrap,
.k-picker-wrap,
.k-numeric-wrap,
.k-textbox {
    margin: 0px 9px;
}*/

    .k-picker-wrap .k-select {
        border-left-color: transparent;
    }

    .k-dropdown .k-state-default,
    .k-dropdown-wrap.k-state-hover,
    .k-multiselect .k-state-default,
    .k-multiselect-wrap.k-state-hover,
    .k-state-border-up .k-state-hover,
    .k-state-border-down .k-state-hover,
    .k-datetimepicker .k-state-default,
    .k-datepicker .k-state-default,
    .k-timepicker .k-state-default,
    .k-picker-wrap.k-state-hover {
        color: #4D4D4D;
        background-color: transparent;
        border-color: #CCCCC9;
        box-shadow: none;
        -webkit-box-shadow: none;
    }

.k-dropdown.k-state-border-up,
.k-multiselect.k-state-border-up,
.k-multiselect.k-state-focused.k-state-border-up,
.k-multiselect.k-state-hover.k-state-border-up,
.k-datetimepicker.k-state-border-up,
.k-datepicker.k-state-border-up,
.k-timepicker.k-state-border-up,
.k-autocomplete.k-state-border-up {
    border-left: 1px solid #CCCCC9;
    border-right: 1px solid #CCCCC9;
    border-top-color: transparent;
    border-bottom: transparent;
}

.k-dropdown.k-state-border-down,
.k-multiselect.k-state-border-down,
.k-multiselect.k-state-focused.k-state-border-down,
.k-multiselect.k-state-hover.k-state-border-down,
.k-datetimepicker.k-state-border-down,
.k-datepicker.k-state-border-down,
.k-timepicker.k-state-border-down,
.k-autocomplete.k-state-border-down {
    border-left: 1px solid #CCCCC9;
    border-right: 1px solid #CCCCC9;
    border-top-color: transparent;
    border-bottom: transparent;
}

.k-dropdown-wrap.k-state-border-up,
.k-multiselect-wrap.k-state-border-up,
.k-picker-wrap.k-state-border-up {
    border-bottom: 1px solid #CCCCC9;
}

.k-dropdown-wrap.k-state-border-down,
.k-multiselect-wrap.k-state-border-down,
.k-picker-wrap.k-state-border-down {
    border-bottom: 1px solid #CCCCC9;
}

.k-popup.k-state-border-up {
    border-left: 1px solid #CCCCC9;
    border-right: 1px solid #CCCCC9;
    border-bottom: 1px solid #CCCCC9;
    border-top: none;
}

.k-popup.k-state-border-down {
    border-left: 1px solid #CCCCC9;
    border-right: 1px solid #CCCCC9;
    border-top: 1px solid #CCCCC9;
    border-bottom: none;
}

.k-popup.k-calendar-container {
    box-shadow: none;
    -webkit-box-shadow: none;
}

.k-state-focused .k-icon,
.k-state-selected .k-icon {
    opacity: 0.41;
}

.k-autocomplete .k-input,
.k-dropdown-wrap .k-input,
.k-multiselect-wrap .k-input,
.k-picker-wrap .k-input {
    min-height: 12px;
    height: auto;
    line-height: 12px;
    padding-bottom: 11px;
    text-indent: 0px;
}

.k-autocomplete .k-select,
.k-dropdown-wrap .k-select,
.k-multiselect-wrap .k-select,
.k-picker-wrap .k-select {
    /*width: 16px;*/
}

.k-dropdown-wrap .k-select,
.k-multiselect-wrap .k-select,
.k-picker-wrap .k-select {
    min-height: 0px;
    line-height: 12px;
}

/*============================================================*\
    CONTAINERS
\*============================================================*/

/*============================================================*\
    MAJOR ZONES
\*============================================================*/

/*   LEFT   */

/*   CENTER   */

/*   RIGHT   */

/*============================================================*\
    SUB ZONES
\*============================================================*/

/*   LEFT   */
.left-content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.left-content-float {
    float: left;
}
/*   CENTER   */

/*   RIGHT   */
.right-content {
    float: right;
    margin-left: 5px;
    /*margin-right: 8px;*/
}

.right-content-numberbox {
    float: right;
    margin-left: 9px;
    margin-right: 1px;
}

.right-content-dropdown {
    margin-top: -35px;
    width: 160px;
    margin-right: -22px;
}

/*.right-content-dropdown .k-dropdown .k-state-default, .k-dropdown-wrap.k-state-hover, .k-multiselect .k-state-default, .k-multiselect-wrap.k-state-hover, .k-state-border-up .k-state-hover, .k-state-border-down .k-state-hover, .k-datetimepicker .k-state-default, .k-datepicker .k-state-default, .k-timepicker .k-state-default, .k-picker-wrap.k-state-hover {
        border: none;
    }*/

/*============================================================*\
    PAGES
\*============================================================*/

.menuContainer {
    position: absolute;
    width: 272px;
    height: 100%;
    /*overflow-y: scroll;*/
    left: 0;
    background-color: #002426;
    margin: 0px;
}

.headerContainer {
    position: absolute;
    float: left;
    width: calc(100% - 272px);
    /*height: 80px;*/
    overflow-y: hidden;
    top: 0px;
    left: 272px;
}

.report .headerContainer {
    width: calc(100% - 472px);
}

.pageContainer {
    position: absolute;
    float: left;
    width: calc(100% - 272px);
    /*height: 100%;*/
    overflow-y: auto;
    bottom: 0px;
    top: 77px;
    left: 272px;
}

.report .pageContainer {
    width: calc(100% - 472px);
}

.col-header {
    padding-bottom: 10px;
    margin: 0px 9px;
    border-bottom: 5px solid #FFFF01;
}

.col-header-no-space {
    margin: 0px 9px;
    border-bottom: 5px solid #FFFF01;
}

.col-body {
    padding: 20px 0px 40px 0px;
}

.report .reportContainer {
    position: absolute;
    top: 140px; /*0px;*/
    right: 0px;
    bottom: 0px;
    width: 200px;
    background-color: #FFFFFC;
    overflow: auto;
    border-right: 20px solid #ebebeb;
    border-bottom: 60px solid #ebebeb;
}

.report .report-chart {
    padding-top: 20px;
}

.map-content {
    padding: 20px;
    margin: 0px 0px 20px 9px;
    background-color: #FFFFFF;
}

    .map-content .map {
        height: 30vh;
    }

    .map-content .note {
        padding-left: 20px;
    }

        .map-content .note .head {
            padding-bottom: 10px;
        }

/* #region LOGIN PAGE */

/* #region generic login styles */

body.login {
    font-family: Helvetica, sans-serif;
    color: #003A3B;
    text-transform: none;
    overflow: auto;
    font-size: 13px;
}

.login .container-fluid {
    max-width: 1281px;
}

.login h1, .login h2, .login h3, .login h4, .login h5, .login h6 {
    text-transform: none;
}

.login .btn-primary {
    background-color: #ffff01;
    border-radius: 0;
    color: #003a3b;
    border: none;
}

.btn-bar-centered {
    margin: auto;
    width: 60%;
}

.login .btn-azure {
    background-color: #007fff;
    border-radius: 0;
    color: #003a3b;
    border: none;
}

.login .text-green {
    color: #003a3b;
}

.login .text-yellow {
    color: #ffff01;
}

.login .vertical-center {
    display: table;
    height: 100%;
    width: 100%;
}

    .login .vertical-center > div {
        display: table-cell;
        vertical-align: middle;
    }

.login .grey-block {
    background-color: #eaedea;
}

.login .green-block {
    background-color: #003a3b;
    color: #fff;
}

.login .dark-green-block {
    background-color: #012426;
    color: #fff;
}

.login .spacer-lg {
    display: block;
    clear: both;
    width: 100%;
    height: 80px;
}

.login .spacer-md {
    display: block;
    clear: both;
    width: 100%;
    height: 45px;
}

.login .spacer-sm {
    display: block;
    clear: both;
    width: 100%;
    height: 30px;
}

.login .spacer-xs {
    display: block;
    clear: both;
    width: 100%;
    height: 5px;
}

.login .login-container-sm {
    max-width: 600px;
    margin: auto;
}

.login .login-container {
    max-width: 795px;
    margin: auto;
}

.login .login-aside {
    position: absolute;
}

.login .img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}

.login .text {
    font-size: 21px;
    line-height: 120%;
}

.login a {
    color: #002426;
}

/* #endregion */

/* #region header */
.login #login-header {
    height: 45px;
    background-color: #012426;
    overflow: hidden;
}

.login #login-logo {
    width: 90px;
    height: auto;
    margin-top: 17px;
}

.login .login-contacts-button {
    color: #fff;
    font-size: 11px;
    margin-top: 17px;
    display: block;
}

    .login .login-contacts-button .glyphicon {
        font-size: 13px;
        margin-top: -1px;
        margin-right: 10px;
    }

@media screen and (max-width: 991px) {
    .login #login-header {
        height: 80px;
    }

    .login #login-logo {
        margin-top: 35px;
    }

    .login .login-contacts-button {
        margin-top: 33px;
    }

    .login #login-fleeway-logo {
        width: 112px;
        height: auto;
        margin-top: 30px;
    }

    .login .login-contacts-button .glyphicon {
    }
}

@media screen and (max-width: 5in) {
    .login #login-header {
        height: 45px;
        padding-right: 5px;
        padding-left: 5px;
    }

    .login .login-contacts-button {
        margin-top: 16px;
    }

    .login #login-fleeway-logo {
        width: 88px;
        height: auto;
        margin-top: 14px;
    }

    .login .login-contacts-button .glyphicon {
        margin-right: 0;
    }
}
/* #endregion */

/* #region top block */

#login-fleeway-logo-inner {
    width: 150px;
    height: auto;
    margin-top: 40px;
}

.login .top-box {
    height: 280px;
    overflow: hidden;
    padding: 25px 30px;
}

.login .video-box img {
    max-width: 100%;
    height: auto;
}

.login .video-box .video-link img.video-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    margin-top: -32px;
    margin-left: -32px;
}

.login .login-box .login-text {
    color: #002426;
    font-size: 9px;
}

.login .login-box #remember-check {
    text-transform: uppercase;
    color: #002426;
    font-size: 12px;
    margin-left: 15px;
    display: inline-block;
    margin-top: -3px;
}

    .login .login-box #remember-check input[type="checkbox"] {
        vertical-align: bottom;
    }

    .login .login-box #remember-check LABEL {
        color: #002426;
        font-size: 10px;
        margin: 0 0 1px;
        font-weight: normal;
    }

.login .login-box .login-text a {
    text-decoration: underline;
}

.login .login-box h5 {
    margin-top: 3px;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.login .login-box input[type="text"], .login .login-box input[type="password"], select {
    border: none;
    background: none !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-bottom: 3px solid #ffff01;
    width: 100%;
    background-color: transparent !important;
    text-transform: uppercase;
    color: #002426 !important;
    margin-top: 15px;
    padding-bottom: 4px;
    font-size: 9px;
}

.login .login-box input[type="email"], select {
    border: none;
    background: none !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-bottom: 3px solid #b80d0d;
    width: 100%;
    background-color: transparent !important;
    text-transform: uppercase;
    color: #002426 !important;
    margin-top: 15px;
    padding-bottom: 4px;
    font-size: 9px;
}

.login .top-box h3 {
    margin-top: 1px;
    margin-bottom: -3px;
}

.login .top-box p.top-text {
    margin-top: 23px;
    line-height: 17px;
    letter-spacing: 1.1px;
    margin-bottom: 19px;
}

.login .top-box .btn {
    font-size: 10px;
}

.login .features-block {
    color: #ffff01;
    text-align: center;
    padding-bottom: 15px;
    padding-top: 75px;
    border-bottom: 1px solid #002426;
    height: 97px;
    position: relative;
}

    .login .features-block .img {
        position: absolute;
        bottom: 35px;
        width: 100%;
        left: 0;
    }

    .login .features-block span {
        display: block;
    }

@media screen and (min-width: 768px) and (max-width: 991px) {
    .login .top-box {
        background-color: transparent;
        padding: 0;
        height: 195px;
        position: relative;
        overflow: visible;
    }

    .login .submit-container {
        position: absolute;
        bottom: 0;
    }

    .login .top-box .submit-container .btn {
        bottom: 3px;
    }

    .login .top-box p.top-text {
        margin-top: 18px;
        line-height: 17px;
        letter-spacing: 1.1px;
        margin-bottom: 6px;
    }

    .login .video-box .video-link {
        background-color: #CCCCC9;
        height: 140px;
        display: block;
        padding: 22px 30px;
        position: absolute;
        top: 0;
    }

    .login .video-box .btn {
        margin-top: 30px;
    }

    .login .login-box h5 {
        text-align: left;
        font-size: 22px;
        color: #fff;
        text-transform: none;
    }

    .login .login-box .mid-login-box {
        background-color: #CCCCC9;
        padding: 2px 20px 20px;
    }

    .login .top-box .btn {
        width: 100%;
        position: absolute;
        bottom: 0;
    }

    .login .login-box .login-text {
        position: absolute;
        top: 100%;
        color: #fff;
        margin-top: 40px;
    }

        .login .login-box .login-text a {
            color: #fff;
        }

    .login .login-box input[type="text"], .login .login-box input[type="password"] {
        margin-top: 11px;
    }

    .login .login-box .login-text {
        margin-top: 30px;
    }

    .login .login-aside {
        position: relative;
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 768px) {
    .login .spacer-lg {
        height: 30px;
    }

    .login .top-box {
        height: auto;
    }

    .login .login-box .btn {
        margin-bottom: 10px;
    }

    .login .top-box.dark-green-block {
        background-color: transparent;
        padding: 0;
    }

        .login .top-box.dark-green-block .btn {
            width: 100%;
            background-color: #fff;
        }

    .login .text {
        text-transform: uppercase;
        text-align: left;
        font-size: 16px;
    }

    .login .login-aside {
        position: relative;
        margin-bottom: 20px;
    }

        .login .login-aside h5 {
            text-transform: uppercase;
            font-size: 16px;
        }

    .references p.text {
        font-size: 14px;
        text-transform: none;
    }

    .login .bottom-btn {
        margin-bottom: 25px;
    }

    #fleet-editor-accordion {
        margin: 0 -31px;
    }

        #fleet-editor-accordion .panel-heading {
            text-align: left;
            position: relative;
            padding: 0;
            height: 60px;
            margin-bottom: 20px;
            border-bottom: 1px solid #002426;
            display: block;
        }

            #fleet-editor-accordion .panel-heading > h3 {
                padding-top: 0px;
                margin-top: 0;
                margin-bottom: 10px;
                font-size: 14px;
                text-transform: uppercase;
            }

            #fleet-editor-accordion .panel-heading > h5 {
                font-size: 11px;
            }

            #fleet-editor-accordion .panel-heading > img {
                position: absolute;
                top: 0;
                right: 0;
            }

    .login .login-bottom .container {
        padding: 0;
    }
}

/* #endregion */
/* #region tabs */
.login #fleet-editor-tabs {
    display: block;
    width: 100%;
    list-style-type: none;
    text-align: center;
    padding: 0;
}

    .login #fleet-editor-tabs li {
        display: block;
        width: 100%;
        height: 32px;
        line-height: 32px;
        position: relative;
    }

        .login #fleet-editor-tabs li + li {
            border-top: 1px solid #d0d2d1;
        }

        .login #fleet-editor-tabs li.active {
            background-color: #FFFF01;
        }

        .login #fleet-editor-tabs li a {
            display: block;
            background-color: transparent !important;
            cursor: pointer;
            padding: 0;
            line-height: 32px;
            color: #003A3B !important;
            border: none;
        }

.login .tab-content .btnNext {
    position: absolute;
    top: 0;
    right: 15px;
}
/* #endregion */
/* #region REFERENCES ---- */

.login img.noclick {
    opacity: 1 !important;
    cursor: not-allowed;
}

.references h2 {
    padding-top: 20px;
}

.references ul {
    border-bottom: 2px solid #003A3B;
    height: 84px;
}

.references .nav > li > a {
    padding: 20px 8px;
}

.references .nav-tabs > .active.center > a {
    background-color: transparent;
}

.references .nav-tabs > a > img {
    opacity: 0.3;
}

.references .active.center > a > img {
    -webkit-filter: sepia() hue-rotate(110deg);
    opacity: 1;
}

.references .referenze p {
    color: #003A3B;
}

.references .customer {
    /*padding-left: 20px;*/
}

/*#region owl carousel*/
.owl-carousel {
    position: relative;
}

.owl-prev,
.owl-next {
    position: absolute;
    top: 50%;
    margin-top: -10px;
}

.owl-prev {
    left: 0;
}

.owl-next {
    right: 0;
}
/*#endregion*/

.text-white {
    color: #fffffa;
}

.text-normal {
    font-weight: normal;
}

.divider-small,
.divider-normal,
.divider-big {
    clear: both;
}

.video-content {
    width: 100%;
    position: relative;
    padding-bottom: 56%;
}

    .video-content iframe {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
    }

@media (max-width: 767px) {
    .smartphone-gray {
        background-color: #c8cac9;
    }
}

@media (max-width: 767px) {
    .smartphone-white {
        background-color: #fffffa;
    }
}

@media (max-width: 767px) {
    .smartphone-green {
        background-color: #003A3B;
        color: #fffffa;
    }
}

@media (max-width: 767px) {
    .btn-responsive {
        width: 100%;
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .pull-xs-right {
        float: right;
    }
}

.side-button {
    min-width: 130px;
}

@media (max-width: 767px) {
    .head:not(.collapsable) {
        text-align: center;
    }
}

hr {
    border-color: transparent;
}

    hr.separator {
        border-bottom: 2px solid #003A3B;
        margin: 0;
        padding: 0;
    }

.references ul {
    border: none;
}

.references p.text,
.references .customer {
    width: 65%;
    margin: auto;
}

@media (max-width: 767px) {
    .references p.text,
    .references .customer {
        width: 100%;
        text-align: center;
    }
}

.references p.text {
    margin-top: 40px;
    margin-bottom: 20px;
}

.references .btn {
    min-width: 280px;
}

.carousel-inner .img-responsive {
    width: 100%;
}

.carousel-inner-text ul {
    padding-left: 20px;
}

.references .owl-carousel {
    width: 80%;
    margin: auto;
}

    .references .owl-carousel .owl-item {
        text-align: center;
    }

        .references .owl-carousel .owl-item img {
            display: inline-block;
            width: auto;
            max-width: 100%;
        }

    .references .owl-carousel .owl-prev,
    .references .owl-carousel .owl-next {
        top: 27px;
        display: inline-block;
        font-family: 'Glyphicons Halflings';
        font-style: normal;
        font-weight: 400;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        font-size: 15px;
    }

    .references .owl-carousel .owl-prev {
        left: -12.5%;
    }

        .references .owl-carousel .owl-prev:before {
            content: "\e257";
        }

    .references .owl-carousel .owl-next {
        right: -12.5%;
    }

        .references .owl-carousel .owl-next:before {
            content: "\e258";
        }

    .references .owl-carousel li {
        list-style-type: none;
    }

        .references .owl-carousel li.active img {
            opacity: 1;
        }

    .references .owl-carousel div img {
        opacity: 0.4;
    }

        .references .owl-carousel div img:hover {
            opacity: 1;
        }

/*#endregion*/

/*#region LOGIN FOOTER */
#footer-menu {
    margin-right: 45px;
    float: right;
}

@media (max-width: 767px) {
    footer .row {
        padding: 15px 10px;
    }

    footer img {
        margin-left: 62px;
    }

    footer p {
        font-size: 11px;
        font-weight: 100;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    footer .row {
        padding: 60px 10px 60px 10px;
    }

    footer img {
        margin-left: 8px;
        margin-top: 35px;
    }

    footer p {
        font-size: 11px;
        font-weight: 100;
        line-height: 110%;
        letter-spacing: 1px;
    }
}

@media (min-width: 992px) {
    footer .row {
        padding: 70px 10px;
    }

    footer img {
        margin-left: 32px;
        margin-top: 50px;
    }
}

footer {
    width: 100%;
    background-color: #012426;
    font-weight: 100;
    line-height: 15px;
}

    footer img {
        height: 27px;
    }

    footer p {
        color: #ffffff;
        padding: 0;
        margin: 0;
    }
/*#endregion*/

/*#region LOGIN MODALS */

.login .modal-dialog {
    margin: 30px auto;
    height: auto;
}

    .login .modal-dialog .modal-body {
        overflow: auto;
        height: auto;
        padding: 15px;
    }

    .login .modal-dialog .modal-content {
        border-radius: 0;
        background-color: #c8cac9;
        font-family: Helvetica, sans-serif;
        font-size: 13px;
        font-weight: 100;
        line-height: 1.42857143;
        height: auto;
    }

.login .modal-header {
    border: 0;
    font-weight: bold;
}

    .login .modal-header .close {
        opacity: 1;
    }

        .login .modal-header .close:hover {
            opacity: 0.7;
        }

        .login .modal-header .close > span {
            color: #003A3B !important;
        }

.login .modal-body {
    color: #000;
}

/*#endregion*/

.login .stat-box {
    padding-bottom: 15px;
    border-top: 3px solid #ffff01;
    border-bottom: 3px solid #ffff01;
}

    .login .stat-box h6 {
        font-size: 9px
    }

.login .bottom-btn {
    color: #fff;
    border-bottom: 1px solid #fff;
    display: block;
    padding-bottom: 10px;
    height: 23px;
    position: relative;
}

.login .field-validation-error::after {
    content: ".";
    display: inline;
}

.login .bottom-btn span {
    float: right;
}

.login .bottom-btn .linkedin {
    position: absolute;
    top: -3px;
    right: 40px;
}

.login .bottom-btn .fb {
    position: absolute;
    top: -2px;
    right: 0;
}

.login .bottom-btn .twitter {
    position: absolute;
    top: 0;
    right: 17px;
}

/* #endregion */
/*  ERROR  */
.error > div {
    padding-left: 20px;
}

/*-------------------HOME PAGE---------------------------------*/

.main-view .box {
    /*display: inline-block;*/
    height: 700px;
    width: 400px;
    /*background-color: yellow;*/
}

/*-------------------VEHICLE-----------------------------------*/

.vehicles {
}

    .vehicles .vehicles-grid {
        /*height: 500px;*/
    }

/*-------------------GRID-----------------------------------*/

a {
    color: #0b2cea;
}

.k-grid-edit-row .k-textbox.k-input, .k-grid-edit-row .k-textbox.k-state-focused.k-input, .k-grid-edit-row .k-numerictextbox .k-input, .k-grid-edit-row .k-numerictextbox.k-state-focused .k-input {
    color: #4D4D4D;
    border: 1px solid;
    border-top-color: #FFFFFF;
    border-right-color: #FFFFFF;
    border-left-color: #FFFFFF;
    border-bottom-color: #ccccc9;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.k-alt.k-grid-edit-row .k-textbox.k-input,
.k-alt.k-grid-edit-row .k-textbox.k-state-focused.k-input,
.k-alt.k-grid-edit-row .k-numerictextbox .k-input,
.k-alt.k-grid-edit-row .k-numerictextbox.k-state-focused .k-input {
    background-color: #f2f5f2;
    border-top-color: #f2f5f2;
    border-right-color: #f2f5f2;
    border-left-color: #f2f5f2;
    border-bottom-color: #ccccc9;
}

.k-grid-edit-row .k-numeric-wrap {
    border-top-color: #ffffff;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
}

.k-alt.k-grid-edit-row .k-numeric-wrap {
    border-color: #f2f5f2;
    border-right-color: #f2f5f2;
    border-left-color: #f2f5f2;
    border-bottom-color: #f2f5f2;
}

.k-grid-edit-row .k-numerictextbox .k-select {
    background-color: #FFFFFF;
    border-color: #FFFFFF;
}

.k-alt.k-grid-edit-row .k-numerictextbox .k-select {
    background-color: #f2f5f2;
    border-color: #f2f5f2;
}

.k-grid-edit-row .k-state-focused .k-select {
    background-color: #FFFFFF;
}

.k-alt.k-grid-edit-row .k-state-focused .k-select {
    background-color: #f2f5f2;
}

.k-grid-edit-row .k-numeric-wrap.k-state-focused,
.k-grid-edit-row .k-numeric-wrap.k-state-hover {
    box-shadow: none;
    -webkit-box-shadow: none;
}

.k-numerictextbox .k-numeric-wrap .k-state-selected.k-link,
.k-grid .k-numeric-wrap .k-state-selected.k-link {
    box-shadow: none;
}

.k-grid .k-numeric-wrap .k-state-selected.k-link,
.k-numerictextbox .k-numeric-wrap .k-state-selected.k-link,
.k-grid tr:hover .k-state-selected.k-link {
    background-color: transparent;
}

.k-numerictextbox .k-state-focused.k-numeric-wrap > .k-select {
    background-color: #ffffff;
}

.k-grid-edit-row .k-i-arrow-s,
.k-grid-edit-row .k-state-hover .k-i-arrow-s,
.k-grid .k-grid-header .k-numerictextbox .k-select .k-link .k-icon.k-i-arrow-n,
.k-grid .k-grid-header .k-link:not(.k-state-disabled):hover > .k-i-arrow-n,
.k-grid-edit-row .k-i-arrow-n,
.k-grid-edit-row .k-state-hover .k-i-arrow-n,
.k-grid-edit-row .k-state-border-down .k-select .k-icon.k-i-arrow-s,
.k-grid .k-grid-header .k-numerictextbox .k-select .k-link .k-icon.k-i-arrow-s,
.k-grid .k-grid-header .k-link:not(.k-state-disabled):hover > .k-i-arrow-s {
    /*background-position: 0 -195px !important;
    opacity: 0.7;*/
    background-position: 0 0 !important;
}

.k-filter-menu .k-dropdown .k-icon.k-i-arrow-s {
    background-image: url('fk-down-invert.svg');
    background-position: 0px 0px;
    opacity: 1;
}

.k-filter-menu .k-dropdown .k-icon.k-i-arrow-n,
.k-filter-menu .k-dropdown .k-state-border-down .k-select .k-icon.k-i-arrow-s {
    background-image: url('fk-up-invert.svg');
    background-position: 0px 0px;
    opacity: 1;
}

.k-grid .k-filter,
.k-grid .k-state-hover .k-filter {
    background-image: url('fk-filter.svg');
    background-position: 0 0;
    background-size: contain;
    opacity: 0.69;
}

.k-grid-filter.k-state-active {
    background-color: #e4e1e1 !important;
    border: 1px solid #ffff01;
    border-radius: 1em;
}

/*============================================================*\
    DIRECTIVES
\*============================================================*/
/*--- Tooltip ---*/
.k-widget.k-tooltip {
    margin-top: 10px;
}

    .k-widget.k-tooltip.grid-tooltip {
        margin-top: 0px;
    }

.grid-tooltip-description {
    /*min-width: 300px !important;
    width:auto;*/
    padding: 10px;
}
/*-------------------MODAL-------------------------------------*/
.modal-dialog {
    height: calc(100vh - 200px);
    max-width: 1280px;
    width: calc(100vw - 272px);
    margin: 100px auto;
}

    .modal-dialog.modal-medium {
        width: 600px;
        height: 338px;
        margin: calc(50vh - 169px) auto;
    }

    .modal-dialog.modal-email {
        width: 800px;
        margin: calc(50vh - 169px) auto;
    }

    .modal-dialog .row-edit-modal,
    .modal-dialog .user-edit-modal {
        height: 100%;
    }

    .modal-dialog.modal-email .modal-content {
        border-radius: 0px;
        height: 520px;
    }

    .modal-dialog .modal-content {
        border-radius: 0px;
        height: calc(100vh - 200px);
    }

    .modal-dialog.modal-medium .modal-content {
        height: 338px;
    }

    .modal-dialog .modal-header {
        padding: 20px 20px;
        border-bottom: 1px solid #CCCCC9;
    }

        .modal-dialog .modal-header .left-content {
            padding: 10px 0px;
        }

        .modal-dialog .modal-header .icon {
            float: left;
        }

            .modal-dialog .modal-header .icon.cancel {
                /*height: 10px;
                width: 10px;*/
                margin: 8px -4px 0px 16px;
                cursor: pointer;
            }

            .modal-dialog .modal-header .icon.save-check {
                margin-top: 6px;
                height: 20px;
                width: 23px;
                cursor: pointer;
            }

            .modal-dialog .modal-header .icon.print {
                margin-top: 6px;
                height: 20px;
                width: 23px;
                cursor: pointer;
                margin-right: 20px;
            }

            .modal-dialog .modal-header .icon.printExcel {
                margin-top: 3px;
                height: 30px;
                width: 30px;
                cursor: pointer;
                margin-right: 20px;
            }

            .modal-dialog .modal-header .icon.printPdf {
                margin-top: 3px;
                height: 30px;
                width: 30px;
                cursor: pointer;
                margin-right: 20px;
            }

            .modal-dialog .modal-header .icon.printExcel svg {
                width: 90% !important;
                height: 100% !important;
                color: gray;
            }

            .modal-dialog .modal-header .icon.printPdf svg {
                width: 66% !important;
                height: 100% !important;
                color: gray;
            }

.icon.print > svg:hover {
    fill: #F3EC90;
}

.modal-dialog .modal-header .icon.export {
    margin-top: 8px;
    height: 20px;
    width: 23px;
    cursor: pointer;
}

.modal-dialog .modal-body {
    padding: 40px 20px 0px 20px;
    height: calc(100% - 73px);
    overflow: auto;
}

.modal-dialog .save-report-modal,
.modal-dialog .close-report-modal {
    background-color: #fffffc;
}

    .modal-dialog .save-report-modal .report-chart .body-content,
    .modal-dialog .close-report-modal .report-chart .body-content {
        background-color: #fffffc;
    }

.ADM {
    width: 20px;
    height: 20px;
    float: right;
    margin-left: 5px;
    margin-right: 50px;
    margin-top: -22px;
    cursor: pointer;
}

    .ADM:hover {
        color: #e2d304;
    }

/*-------------------MENU-------------------------------------*/
.menu {
    color: #f2f2f2;
}

    .menu .k-panel > .k-item > .k-link,
    .menu .k-panelbar > .k-item > .k-link {
        padding-left: 0px;
        padding-right: 0px;
    }

    .menu .header-menu {
    }

    .menu .content-menu {
        /*-ms-overflow-style: none;
        overflow: -moz-scrollbars-none;
        overflow-y: scroll;*/
    }

    .menu .bottom-border {
        border-top-color: #5a6660;
        border-top-width: 1px;
        border-top-style: solid;
        margin: 0px 20px;
        padding-bottom: 30px;
    }

    /*.menu .content-menu::-webkit-scrollbar {
        height: 0;
        width: 0;
    }*/

    /*.menu .fleetKeeperLogo {
        height: 64px;
        margin-top: 40px;
        margin-bottom: 40px;
    }

        .menu .fleetKeeperLogo img {
            height: 64px;
        }*/

    .menu .fleetKeeperLogo {
        margin-bottom: 20px;
    }

        .menu .fleetKeeperLogo svg {
            height: 30px;
            width: auto;
            margin-top: 20px;
        }

        .menu .fleetKeeperLogo .st1 {
            fill: #F5F50A;
        }

        .menu .fleetKeeperLogo .st0 {
            fill: #ffffff;
        }

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

        .menu .fleerunLogo svg {
            height: 30px;
            width: auto;
        }

        .menu .fleerunLogo .st1 {
            fill: #6b6a6a;
        }

        .menu .fleerunLogo svg .st1:focus,
        .menu .fleerunLogo svg .st1:hover {
            fill: #F19822;
        }

    .menu .version {
        /* background-color: red;*/
        margin-left: 38px;
    }
    /*.menu .username-logout {
        color: #5a6660;
        margin-bottom: 15px;
    }

        .menu .username-logout .username {
            margin-left: 20px;
        }

        .menu .username-logout .logout {
            position: absolute;
            right: 20px;
        }

            .menu .username-logout .logout:hover {
                color: #ffff01;
            }*/

    .menu .group-style {
        border-top-color: #5a6660;
        border-top-width: 1px;
        border-top-style: solid;
        height: 100px; /*114px;*/
        text-align: center;
        margin: 0px 20px;
    }

        .menu .group-style .group-item-style {
            margin-top: 30px; /*60*/
            /*margin-bottom: 5px;*/
            height: 30px; /*20px;*/
            width: 30px;
            cursor: pointer;
            /*stroke: #eaedea;
            fill: #eaedea;*/
            overflow: visible;
            margin-bottom: 20px;
        }

            .menu .group-style .group-item-style .stroke {
                stroke: #eaedea;
            }

            .menu .group-style .group-item-style .fill {
                fill: #eaedea;
            }

        .menu .group-style .title {
            margin-top: 55px;
            cursor: pointer;
        }

        .menu .group-style .left {
            position: absolute;
            left: 30px;
        }

        .menu .group-style .title-centered {
            margin-top: -25px;
            cursor: pointer;
        }

        .menu .group-style .left.down {
            left: 10px;
            margin-top: 30px;
        }

        .menu .group-style .right {
            position: absolute;
            right: 30px;
        }

        .menu .group-style .centered {
            margin-left: auto;
            margin-right: auto;
        }

        .menu .group-style .group-item-selected {
            color: #ffff01;
            /*stroke: #ffff01;
            fill: #ffff01;*/
        }

            .menu .group-style .group-item-selected .stroke {
                stroke: #ffff01;
            }

            .menu .group-style .group-item-selected .fill {
                fill: #ffff01;
            }

        .menu .group-style .group-item-deactivated {
            color: lightgray;
            /*stroke: lightgray;
            fill: lightgray;*/
        }

            .menu .group-style .group-item-deactivated .stroke {
                stroke: lightgray;
            }

            .menu .group-style .group-item-deactivated .fill {
                fill: lightgray;
            }

        .menu .group-style div:hover {
            color: #ffff01;
            /*stroke: #ffff01;
            fill: #ffff01;*/
        }

            .menu .group-style div:hover .stroke {
                stroke: #ffff01;
            }

            .menu .group-style div:hover .fill {
                fill: #ffff01;
            }

    .menu .group-selected {
        border-bottom: none;
    }

    .menu .panel-bar-menu {
        border-right: none;
        border-left: none;
        border-top: none;
        border-bottom: none;
        height: auto;
        overflow: hidden;
        /*visibility: hidden;*/
    }

        .menu .panel-bar-menu.ng-enter, .menu .panel-bar-menu.ng-leave {
            -webkit-transition: 0.2s linear all;
            -moz-transition: 0.2s linear all;
            -ms-transition: 0.2s linear all;
            -o-transition: 0.2s linear all;
            transition: 0.2s linear all;
        }

        .menu .panel-bar-menu .outer-menu-item-style {
            background-color: #002426;
        }

            .menu .panel-bar-menu .outer-menu-item-style.selected > span.k-link {
                color: #ffff01;
            }

            .menu .panel-bar-menu .outer-menu-item-style span {
                background-color: #002426;
                color: #f2f2f2;
                border-bottom-style: dashed;
                border-bottom-color: #5a6660;
                margin-left: 20px;
                margin-right: 20px;
                line-height: normal;
                padding-top: 15px;
                padding-bottom: 15px;
            }

                .menu .panel-bar-menu .outer-menu-item-style span.k-link {
                    color: #f2f2f2;
                }

                    .menu .panel-bar-menu .outer-menu-item-style span.k-link:hover {
                        color: #ffff01;
                    }

                    .menu .panel-bar-menu .outer-menu-item-style span.k-link.k-state-selected {
                        /*color: #ffff01;*/
                    }

                        .menu .panel-bar-menu .outer-menu-item-style span.k-link.k-state-selected.k-state-hover {
                            background-color: #002426;
                        }

            .menu .panel-bar-menu .outer-menu-item-style ul {
                border-bottom: none;
            }

            .menu .panel-bar-menu .outer-menu-item-style span span {
                visibility: hidden;
            }

            .menu .panel-bar-menu .outer-menu-item-style.k-first span.k-header {
                border-top-style: dashed;
                border-top-color: #5a6660;
                border-top-width: 1px;
            }

            .menu .panel-bar-menu .outer-menu-item-style.k-state-active span.k-header {
                border-bottom-width: 0px;
            }

            .menu .panel-bar-menu .outer-menu-item-style.k-state-active span:only-child.k-header {
                border-bottom-width: 1px;
            }

            .menu .panel-bar-menu .outer-menu-item-style.k-state-active .k-item.k-last.inner-menu-item-style span {
                border-bottom-width: 0px;
            }

            .menu .panel-bar-menu .outer-menu-item-style.k-last span {
                padding-bottom: 30px;
            }

                .menu .panel-bar-menu .outer-menu-item-style.k-last span.k-header {
                    border-bottom-style: none;
                }

        .menu .panel-bar-menu .inner-menu-item-style {
            background-color: #003a3b;
        }

            .menu .panel-bar-menu .inner-menu-item-style.heavyDisabled {
            }

            .menu .panel-bar-menu .inner-menu-item-style.selected > span.k-link {
                color: #ffff01;
            }

            .menu .panel-bar-menu .inner-menu-item-style.heavyDisabled > span.k-link {
            }

            .menu .panel-bar-menu .inner-menu-item-style span {
                background-color: #003a3b;
                color: #f2f2f2;
                margin-left: 20px;
                margin-right: 20px;
                border-bottom-width: 1px;
                border-bottom-color: #5a6660;
                border-bottom-style: solid;
                line-height: normal;
                padding-top: 15px;
                padding-bottom: 15px;
            }

                .menu .panel-bar-menu .inner-menu-item-style span span {
                    visibility: hidden;
                }

                .menu .panel-bar-menu .inner-menu-item-style span.k-link.k-state-selected.k-state-hover {
                    background-color: #003a3b;
                }

            .menu .panel-bar-menu .inner-menu-item-style.k-first span {
                padding-top: 30px;
            }

            .menu .panel-bar-menu .inner-menu-item-style.k-last span {
                padding-bottom: 30px;
            }

        .menu .panel-bar-menu .k-state-disabled {
            opacity: 1;
        }

            .menu .panel-bar-menu .k-state-disabled span {
                color: #5a6660 !important;
            }

    .menu .bottom-menu {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }

    .menu .panel-bar-menu.bottom-menu .outer-menu-item-style.k-first span {
        padding-top: 30px;
    }

        .menu .panel-bar-menu.bottom-menu .outer-menu-item-style.k-first span.k-header {
            border-top-style: solid;
            /*border-top-color: #5a6660;
            border-top-width: 1px;*/
        }

    .menu .panel-bar-menu.bottom-menu .outer-menu-item-style.k-last span {
        padding-bottom: 15px;
    }

        .menu .panel-bar-menu.bottom-menu .outer-menu-item-style.k-last span.k-header {
            border-bottom-style: dashed;
        }

    .menu .secondary-menu {
        padding: 0px 20px;
    }

        .menu .secondary-menu .item-style {
            /*margin-top: 30px;
            margin-bottom: 30px;*/
        }

            .menu .secondary-menu .item-style a {
                margin-top: 15px;
                margin-bottom: 15px;
                color: #f2f2f2;
                cursor: pointer;
                text-decoration: none !important;
                display: inline-block;
            }

                .menu .secondary-menu .item-style a:hover {
                    color: #ffff01;
                }

                .menu .secondary-menu .item-style a.item-selected {
                    color: #ffff01;
                }

            .menu .secondary-menu .item-style .icon {
                /*stroke: #f2f2f2;
                fill: #f2f2f2;*/
                margin-right: 10px;
                display: inline-block;
            }

                .menu .secondary-menu .item-style .icon .stroke {
                    stroke: #f2f2f2;
                }

            .menu .secondary-menu .item-style.top-border {
                border-top-width: 1px;
                border-top-style: solid;
                border-top-color: #5a6660;
            }

/*-------------------HEADER-----------------------------------*/

.header {
}

    .header .top-header {
        border-bottom-color: #ffff01;
        border-bottom-width: 5px;
        border-bottom-style: solid;
        padding-top: 35px;
    }

        .header .top-header.vehicle-detail {
            border-bottom: none;
            padding-top: 10px;
        }

    .header.edit .top-header {
        border-bottom-color: #002426;
    }

    .header .top-header .page-title {
        margin-bottom: 15px;
        font-family: Montserrat-Regular;
        font-size: 12px;
    }

    .header .top-header .email-icon {
        position: absolute;
        /*top:22px;*/
        bottom: 13px;
        right: 22px;
    }

    .header .top-header .account-icon {
        position: absolute;
        bottom: 15px;
        right: 50px;
    }

    .header .top-header .username-logout {
        /*position: absolute;*/
    }

        .header .top-header .username-logout .username {
            position: absolute;
            bottom: 25px;
            font-weight: bold;
            right: 80px;
        }

        .header .top-header .username-logout .logout {
            position: absolute;
            text-decoration: underline;
            font-size: 8px;
            right: 80px;
            bottom: 10px;
        }

            .header .top-header .username-logout .logout:hover {
                color: #ffff01;
            }

    .header .top-header .bell-icon {
        position: absolute;
        bottom: 15px;
        right: 0px;
    }

    .header .top-header .deadline-count {
        position: absolute;
        top: 10px;
        right: -10px;
        padding-left: 3px;
        padding-right: 3px;
        opacity: 0.7;
        color: #333;
        background: #ffff01;
        text-align: center;
        line-height: 17px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }

    .header .top-header .bell-container:hover .deadline-count {
        /*        opacity: 1; ies*/
    }

    .header .bottom-header {
        padding-top: 15px;
    }

        .header .bottom-header .edit-icon {
            display: inline-block;
            width: 20px;
            height: 23px;
        }

        .header .bottom-header .clone-icon {
            display: inline-block;
            width: 20px;
            height: 23px;
        }

        .header .bottom-header .export-icon {
            display: inline-block;
            width: 20px;
            height: 23px;
            margin-left: 7px;
        }

        .header .bottom-header .export-iconaqp {
            display: inline-block;
            width: 30px;
            height: 23px;
            margin-left: 7px;
            margin-right: 15px;
        }

        .header .bottom-header .export-aqp {
            display: inline-block;
            width: 85px;
            margin-left: 10px;
        }

        .header .bottom-header .filter-year {
            display: inline-block;
            width: 120px;
            margin-left: 10px;
        }

        .header .bottom-header .filter-month-range {
            display: inline-block;
            width: 370px;
        }

        .header .bottom-header .filter-month-range-year {
            display: inline-block;
            width: 70px;
            margin-left: 14px;
        }

        .header .bottom-header .filter-month-range-monts {
            display: inline-block;
            width: 190px;
            margin-left: 2px;
        }

        .header .bottom-header .filter-month-range-apply {
            display: inline-flex;
            width: 20px;
            height: 23px;
            margin-left: 7px;
            position: relative;
            top: 5px;
            opacity: 0.81;
        }

            .header .bottom-header .filter-month-range-apply:hover {
                fill: #4d4d4d;
            }

.icon.filter-month-range-apply > svg:hover {
    fill: #F3EC90;
}

.header .bottom-header .save-icon {
    display: inline-block;
    width: 20px;
    height: 23px;
    margin-right: 20px;
}

.header .bottom-header .cancel-icon {
    display: inline-block;
}

/*-------------------GRID------------------------------------*/

.minimum-grid .k-grid {
    height: 195px;
}

.small-grid .k-grid {
    height: 300px;
}

.medium-grid .k-grid {
    height: 450px;
}

.big-grid .k-grid {
    height: 600px;
}

.fit_grid .k-grid {
    height: calc(70vh - 200px);
    box-sizing: border-box;
}

/*-------------------CHART------------------------------------*/
.chart {
    /*padding-left: 5px;
    padding-right: 5px;*/
}

.small-chart .k-chart {
    height: 165px;
}

.big-chart .k-chart {
    height: 453px;
}

/*-------------------REPORT CHART------------------------------------*/
.report-chart {
    margin: 0px 9px;
}

    .report-chart .header-content {
        padding-bottom: 40px;
    }

        .report-chart .header-content > div {
            padding: 20px 0px;
            background-color: #FFFFFC;
        }

            .report-chart .header-content > div:hover {
                background-color: #FFFF01;
            }

                .report-chart .header-content > div:hover .icon-stroke {
                    stroke: #4d4d4d;
                }

                .report-chart .header-content > div:hover .icon-fill {
                    fill: #4d4d4d;
                }

        .report-chart .header-content > .disabled:hover {
            background-color: #FFFFFC;
        }

        .report-chart .header-content .selected {
            background-color: #CCCCC9;
        }

            .report-chart .header-content .selected .icon-stroke {
                stroke: #fffffC;
            }

            .report-chart .header-content .selected .icon-fill {
                fill: #fffffC;
            }

    .report-chart .body-content {
        padding: 20px;
        background-color: #FFFFFC;
    }

    .report-chart .icon {
        height: 20px;
        width: 20px;
        margin: 0px auto;
    }

        .report-chart .icon > div:first-child {
            height: 20px;
        }

.selected .triangle {
    position: absolute;
    top: 60px;
    margin-left: -10px;
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #ccccc9;
}

/*-------------------REPORT LIST------------------------------------*/
.report-list .item {
    border-bottom: 1px solid #CCCCC9;
}

    .report-list .item.pinned {
        border-bottom-color: #eaedea;
        background-color: #ccccc9;
    }

    .report-list .item.compare {
        border-bottom-color: #eaedea;
        background-color: #26958f;
    }

    .report-list .item:hover,
    .report-list .item.selected {
        background-color: #FFFF01;
    }

        .report-list .item:hover .box-commands {
            visibility: visible;
        }

.report-list .box-head {
    padding: 20px 10px 10px 10px;
}

.report-list .box-commands {
    margin-top: 13px;
    height: 13px;
}

    .report-list .box-commands > div {
        width: 33.3%;
    }

        .report-list .box-commands > div:nth-child(2n) {
            border-left: 1px solid #ccccc9;
            border-right: 1px solid #ccccc9;
        }

    .report-list .box-commands svg {
        margin: -13px calc(50% - 10px) 5px;
    }

        .report-list .box-commands svg.icon-fill {
            color: #999;
        }

            .report-list .box-commands svg.icon-fill:hover {
                color: #4d4d4d;
            }

/*============================================================*\
    CONTROLS
\*============================================================*/

/*--- common ---*/
.security-grid {
    height: 330px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.modal-grid {
    height: calc(100vh - 460px);
}

.main-view .home-chart .chart,
/*.vehicles-grid,
.refuelings-grid,
.requests-grid,
.security-grid,*/
.fk-textbox,
.fk-numberbox,
.fk-notestextarea
.fk-switchbox {
    margin-left: 9px;
    margin-right: 9px;
}

.fk-report-panel,
.fk-report-vehicle,
.fk-report-deadline {
    margin-bottom: 20px;
}

.fk-prospect,
.fk-deleteprospect,
.fk-groupbox {
}

.fk-dropdownbox,
.fk-multiselectbox,
.fk-timebox,
.fk-datebox,
.fk-daterangebox,
.fk-datetimebox,
.fk-autocompletebox {
    background-color: transparent;
    padding-top: 10px;
}

    .fk-dropdownbox .box-head,
    .fk-multiselectbox .box-head,
    .fk-timebox .box-head,
    .fk-datebox .box-head,
    .fk-datetimebox .box-head,
    .fk-autocompletebox .box-head {
        font-size: 8px;
        margin: 0px 0px 5px 10px;
        color: black; /*#999999; ;*/
    }

        .fk-dropdownbox.danger .k-dropdown-wrap,
        .fk-datebox.danger .k-picker-wrap,
        .fk-timebox.danger .k-picker-wrap,
        .fk-datetimebox.danger .k-picker-wrap,
        .fk-multiselectbox.danger .k-multiselect-wrap,
        .fk-dropdownbox .box-head.danger,
        .fk-datebox .box-head.danger,
        .fk-timebox .box-head.danger,
        .fk-datetimebox .box-head.danger,
        .fk-multiselectbox .box-head.danger {
            color: #D74123;
            border-bottom-color: #D74123;
        }

.create-grid-icon {
    display: inline-block;
}

/*--- input ---*/
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"] {
    background-color: none;
    border: none;
    box-shadow: none;
    /*Firefox fixing*/
    -moz-appearance: textfield;
}

    input[type="text"]:focus,
    input[type="password"]:focus,
    input[type="number"]:focus {
        outline: none;
    }

    /*Explorer fixing*/
    input[type="text"]::-ms-clear,
    input[type="password"]::-ms-clear,
    input[type="number"]::-ms-clear {
        display: none;
    }

    /*Chrome fixing*/
    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

.col-left-margin-report .fk-report-panel,
.col-left-margin-report .fk-groupbox {
    margin-right: 9px;
}

.col-center-margin-report .fk-report-panel,
.col-center-margin-report .fk-groupbox {
    margin-right: 9px;
    margin-left: 9px;
}

.col-right-margin-report .fk-report-panel,
.col-right-margin-report .fk-groupbox {
    margin-left: 9px;
}

.col-right-margin.fk-dropzone {
    margin-left: 20px !important;
    margin-right: 11px;
}

.col-left-margin.fk-dropzone {
    margin-right: 20px !important;
    margin-left: 11px;
}

/*--- groupbox ---*/
.consumption .fk-groupbox > .box-body {
    padding: 10px 10px 0px 10px;
}

.fk-groupbox {
    background-color: #fffffc;
    margin-bottom: 20px;
}

    .fk-groupbox > .box-head {
        padding: 20px 20px;
    }

/*ies*/
.box-head.dashboard {
    font-weight: unset;
    font-family: Montserrat-Regular;
}

.fk-groupbox > .box-body {
    padding: 0px;
    border-top: 1px solid #CCCCC9;
}

.fk-groupbox .report-chart {
    margin: 0px;
    overflow: hidden;
}

.fk-groupbox .body-content {
    padding: 0px;
}

.groupbox-small .fk-groupbox {
    height: 279px;
}

.groupbox-medium .fk-groupbox {
    height: 578px;
}

.groupbox-small .fk-groupbox > .box-body {
    height: 207px;
}

.groupbox-medium .fk-groupbox > .box-body {
    height: 506px;
}

.groupbox-small .fk-groupbox > .box-body .k-chart {
    height: 191px;
}

.groupbox-medium .fk-groupbox > .box-body .k-chart {
    height: 360px;
}

.consumption .fk-groupbox .box-body .k-chart {
    height: 181px;
}

.vehicle-data .fk-groupbox > .box-head {
    border-top: 5px solid #ffff01;
}

/*groupbox br */

.groupbox-br > .fk-groupbox > .box-head {
    padding: 24px 20px !important;
}

/*--- dropzone ---*/
.fk-dropzone {
    background-color: #fff;
    padding: 10px 20px 20px;
    text-align: center;
    border: 1px dashed #CCCCC9;
    margin-bottom: 20px;
    pointer-events: none;
}

    .fk-dropzone.edit-mode {
        background-color: #eaedea;
        pointer-events: all;
    }

    .fk-dropzone:hover {
        border: 2px solid #ffff01;
    }

    .fk-dropzone > .box-body {
        min-height: 90px; /*120*/
        padding-bottom: 20px;
        text-align: left;
    }

    .fk-dropzone .dz-preview {
        display: inline-block;
        margin-top: 10px;
        margin-right: 10px;
    }

/*--- prospect ---*/
.fk-prospect {
    -webkit-transition: background-color 0s linear;
    -moz-transition: background-color 0s linear;
    -ms-transition: background-color 0s linear;
    -o-transition: background-color 0s linear;
    transition: background-color 0s linear;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    -ms-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s;
    background-color: transparent;
    margin-bottom: 20px;
}

.prospect-animation {
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    overflow: hidden;
}

.fk-prospect.expanded {
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    background-color: #fffffc;
}

.background-edit .fk-prospect.expanded {
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    background-color: #fff;
}

.fk-prospect > .box-head {
    padding: 20px 20px;
    border-top: 5px solid #ffff01;
    font-weight: bold;
}

    .fk-prospect > .box-head.edit {
        border-top-color: #002426;
    }

        .fk-prospect > .box-head.edit.read {
            border-top-color: #ffff01;
        }

.fk-prospect > .box-body {
    padding: 10px 11px 20px 11px;
    border-top: 1px solid #CCCCC9;
    background-color: #fffffc;
}

.background-edit .fk-prospect > .box-body {
    background-color: #fff;
}

.background-grid-prospect.fk-prospect.expanded,
.background-grid-prospect.fk-prospect.expanded > .box-body,
.background-grid-prospect.fk-prospect > .box-body {
    background-color: transparent;
}

.fk-prospect > .box-body > div {
    padding-top: 10px;
}

/*--- deleteprospect ---*/
.fk-deleteprospect {
    -webkit-transition: background-color 0s linear;
    -moz-transition: background-color 0s linear;
    -ms-transition: background-color 0s linear;
    -o-transition: background-color 0s linear;
    transition: background-color 0s linear;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    -ms-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s;
    background-color: transparent;
    margin-bottom: 20px;
}

.deleteprospect-animation {
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    overflow: hidden;
}

.fk-deleteprospect {
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    background-color: #fffffc;
}

.background-edit .fk-deleteprospect {
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    background-color: #fff;
}

.fk-deleteprospect > .box-head {
    padding: 20px 20px;
    border-top: 5px solid #ffff01;
    font-weight: bold;
}

    .fk-deleteprospect > .box-head.edit {
        border-top-color: #002426;
    }

        .fk-deleteprospect > .box-head.edit.read {
            border-top-color: #ffff01;
        }

.fk-deleteprospect > .box-body {
    padding: 5px;
    border-top: 1px solid #CCCCC9;
    background-color: #fffffc;
}

.background-edit .fk-deleteprospect > .box-body {
    background-color: #fff;
}

.col-right-margin-deleteprospect .fk-deleteprospect {
    margin-left: 9px;
}

/*---textarea--*/
.fk-notestextarea {
    padding: 10px 10px 10px;
    /*border-bottom: 1px solid #CCCCC9;*/
}

.top-header .fk-notestextarea {
    border-bottom: 5px solid #ffff01;
    margin: 0px;
}

.fk-notestextarea .box-head {
    font-size: 8px;
    margin-bottom: 5px;
    color: black;
    /* color: #999;*/
}

.fk-notestextarea .box-content {
    height: 99%;
}

    .fk-notestextarea .box-content .color-success,
    .fk-notestextarea .box-content .color-warning,
    .fk-notestextarea .box-content .color-danger {
        height: 15px;
    }

.fk-notestextarea.success,
.fk-notestextarea .box-head.success {
    color: #009490;
    border-bottom-color: #009490;
}

.fk-notestextarea.warning,
.fk-notestextarea .box-head.warning {
    color: #d26e3d; /* #FF7F3F;*/
    border-bottom-color: #d26e3d; /* #FF7F3F;*/
}

.fk-notestextarea.danger,
.fk-notestextarea .box-head.danger {
    color: #D74123;
    border-bottom-color: #D74123;
}

.fk-notestextarea textarea {
    font-size: 10px;
    line-height: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    width: 100%;
    height: 100%;
    background-color: transparent;
    color: #4d4d4d;
    border-color: gainsboro;
}

    .fk-notestextarea textarea:focus {
        outline: none !important;
        border-color: #aaacad;
        /*box-shadow: 0 0 10px #719ECE;*/
    }

.fk-notestextarea .stroke-success,
.fk-notestextarea .stroke-warning {
    width: 15px;
    height: 15px;
}

.fk-notestextarea .stroke-danger {
    width: 10px;
    height: 10px;
    margin-top: 5px;
}
/*.fk-notestextarea .box-body {
    height: 90px;
}*/
/*--- textbox ---*/
.fk-textbox {
    padding: 10px 0px;
    border-bottom: 1px solid #CCCCC9;
}

.top-header .fk-textbox {
    border-bottom: 5px solid #ffff01;
    margin: 0px;
}

.fk-textbox .box-head {
    font-size: 8px;
    margin-bottom: 5px;
    color: black;
    /* color: #999;*/
}

.fk-textbox .box-content {
    height: 15px;
}

    .fk-textbox .box-content .color-success,
    .fk-textbox .box-content .color-warning,
    .fk-textbox .box-content .color-danger {
        height: 15px;
    }

.fk-textbox.success,
.fk-textbox .box-head.success {
    color: #009490;
    border-bottom-color: #009490;
}

.fk-textbox.warning,
.fk-textbox .box-head.warning {
    color: #d26e3d; /* #FF7F3F;*/
    border-bottom-color: #d26e3d; /* #FF7F3F;*/
}

.fk-textbox.danger,
.fk-textbox .box-head.danger {
    color: #D74123;
    border-bottom-color: #D74123;
}

.fk-textbox input {
    font-size: 10px;
    line-height: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    width: 100%;
    background-color: transparent;
    color: #4d4d4d;
}

.fk-textbox .stroke-success,
.fk-textbox .stroke-warning {
    width: 15px;
    height: 15px;
}

.fk-textbox .stroke-danger {
    width: 10px;
    height: 10px;
    margin-top: 5px;
}

/*--- numberbox ---*/
.fk-numberbox > .right-content {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently not supported by any browser */
}

    .fk-numberbox > .right-content .color-normal:first-child {
        margin-top: 7px;
    }

.fk-numberbox .color-normal {
    width: 15px;
    height: 15px;
}

.fk-numberbox .unit-measure {
    float: left;
    padding-top: 2px;
    padding-right: 5px;
    text-transform: none;
}

/*--- checkbox ---*/
.fk-checkbox {
    width: 24px;
    height: 12px;
    background: none;
    border: 1px solid #999999;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    position: relative;
    box-sizing: border-box;
}

    .fk-checkbox.centered {
        margin: auto;
    }

    .fk-checkbox input {
        opacity: 0;
        filter: alpha(opacity=0);
        width: 27px;
        margin: 0px 0px 0px -2px !important;
        top: -2px;
        position: relative;
        z-index: 10;
    }

    .fk-checkbox.checked {
        background: #FFFF01;
        -webkit-transition: all .4s ease-in;
        -moz-transition: all .4s ease-in;
        -o-transition: all .4s ease-in;
        -ms-transition: all .4s ease-in;
        transition: all .4s ease-in;
    }

    .fk-checkbox label {
        display: block;
        width: 14px;
        height: 14px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        border-radius: 50px;
        -webkit-transition: all .4s ease;
        -moz-transition: all .4s ease;
        -o-transition: all .4s ease;
        -ms-transition: all .4s ease;
        transition: all .4s ease;
        /*cursor: pointer;*/
        position: absolute;
        top: -2px;
        left: -2px;
        z-index: 1;
        background: #999999;
    }

    .fk-checkbox input[type=checkbox]:checked + label {
        left: 12px;
    }

/*--- pointbox ---*/
.fk-pointbox {
    height: 12px;
    background: none;
    position: relative;
    box-sizing: border-box;
    text-align: center;
}

    .fk-pointbox label {
        width: 14px;
        height: 14px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        border-radius: 50px;
        margin-top: -2px;
        /*position: absolute;
        top: -2px;
        left: -2px;*/
        background: #d34333;
    }

        .fk-pointbox label.checked {
            background: #26958f;
        }

/*--- warningbox ---*/
.fk-warningbox {
    width: 0;
    height: 0;
    background: none;
    border-left: 11px solid transparent;
    border-right: 11px solid transparent;
    border-bottom: 22px solid #F2FF00;
    position: relative;
    text-align: center;
}

    .fk-warningbox.checked {
        display: none;
    }

    .fk-warningbox::before {
        content: "!";
        position: absolute;
        top: 0.90em;
        left: 55%;
        transform: translate(-50%, -50%);
        font-size: 14px;
        font-weight: bold;
        color: #000000;
    }

td > div.fk-warningbox {
    margin: 0 auto;
}

/*--- switchbox ---*/
.fk-switchbox {
    padding: 21px 0px 10px 0px;
    border-bottom: 1px solid #CCCCC9;
    margin: 9px;
}

    .fk-switchbox .fk-checkbox {
        margin-left: 10px;
    }

/*--- notification ---*/
.notification {
    color: #fff;
}

    .notification.success {
        background-color: #009490;
    }

    .notification.error {
        background-color: #d74123;
    }

    .notification.warning {
        background-color: #d26e3d; /* #f49542;;*/
    }

    .notification .image {
        height: 100%;
        width: 20px;
        position: absolute;
    }

        .notification .image > span {
            padding: 10px;
            position: absolute;
            top: 50%;
            margin-top: -10px;
            background-image: url('fk-close-small-white.svg');
        }

    .notification .message {
        padding: 10px 10px; /*30px 20px;*/
        margin-left: 40px; /* 60px;*/
        line-height: normal; /*20px;*/
        border-left: 1px solid #fff;
        /*min-width:70px;*/
    }

/*--- report panel ---*/
.fk-report-panel {
    background-color: #ccccc9;
    height: 279px;
    position: relative;
}

    .fk-report-panel:hover .box-head,
    .fk-report-panel:hover .box-body {
        color: #ffff01;
    }

    .fk-report-panel .box-head {
        padding: 30px 20px;
    }

    .fk-report-panel .box-body {
        border-top: 1px solid #eaedea;
        padding: 30px 20px;
    }

        .fk-report-panel .box-body .text-ellipsis {
            font-size: 18px;
            line-height: 24px;
            max-height: 96px;
            word-wrap: break-word;
            position: relative;
            overflow: hidden;
            padding-right: 1em;
            /*margin-right: -1em;
  text-align: justify;*/
        }

            .fk-report-panel .box-body .text-ellipsis:before {
                content: '...';
                position: absolute;
                right: 0;
                bottom: 0;
            }

            .fk-report-panel .box-body .text-ellipsis:after {
                content: '';
                position: absolute;
                right: 0;
                width: 1em;
                height: 1em;
                margin-top: 0.2em;
                background-color: #ccccc9;
            }

    .fk-report-panel .box-footer {
        border-top: 1px solid #eaedea;
        padding: 20px;
        width: 100%;
        bottom: 0px;
        position: absolute;
    }

/*--- report total cost ---*/
.box-body .total-cost .series-title:first-child,
.box-body .total-cost .series-value:first-child {
    border-right: 1px solid #ccccc9;
}

.box-body .total-cost .series-value:first-child {
    color: #333;
}

.box-body .total-cost .series-value:last-child {
    color: #333;
}

.box-body .total-cost .series-title {
    text-align: center;
    border-bottom: 1px solid #ccccc9;
    padding: 15px;
    font-size: 12px; /*ies*/
    font-weight: bold; /*ies*/
}

.box-body .total-cost .series-value {
    text-align: center;
    border-bottom: 1px solid #ccccc9;
    padding: 30px;
    font-size: 33px;
    line-height: 35px;
}

/*--- report vehicle ---*/
.fk-report-vehicle {
    background-color: #fffffc;
    height: 279px;
    position: relative;
}

    .fk-report-vehicle .border-left {
        border-left: 1px solid #ccccc9;
    }

    .fk-report-vehicle .box-head {
        padding: 30px 20px;
    }

    .fk-report-vehicle .box-body {
        height: 165px;
    }

        .fk-report-vehicle .box-body .fk-row,
        .fk-report-vehicle .box-body .block {
            height: 100%;
        }

        .fk-report-vehicle .box-body .value-total,
        .fk-report-vehicle .box-body .value-not-disp {
            padding-bottom: 10px;
            font-size: 33px;
            line-height: 35px;
        }

        .fk-report-vehicle .box-body .value-total {
            color: #009490;
        }

        .fk-report-vehicle .box-body .value-not-disp {
            color: #d74123;
        }

    .fk-report-vehicle .box-body,
    .fk-report-vehicle .box-footer {
        border-top: 1px solid #ccccc9;
    }

    .fk-report-vehicle .box-footer {
        width: 100%;
        bottom: 0px;
        position: absolute;
    }

        .fk-report-vehicle .box-footer .fk-row > div {
            padding: 15px 0px;
        }

/*--- report deadline ---*/
.fk-report-deadline {
    background-color: #fffffc;
    height: 279px;
    position: relative;
}

    .fk-report-deadline .box-head {
        padding: 30px 20px;
    }

    .fk-report-deadline .box-body {
        height: 207px;
        overflow-y: auto;
    }

        .fk-report-deadline .box-body,
        .fk-report-deadline .box-body .list-item:nth-child(n+2) {
            border-top: 1px solid #ccccc9;
        }

            .fk-report-deadline .box-body .list-item {
                padding: 10px 20px;
                line-height: 10px;
            }

                .fk-report-deadline .box-body .list-item.alert-item {
                    color: #d74123;
                }

/*--- dropzone ---*/
.dz-details {
    height: 100px;
    width: 100px;
    position: relative;
    overflow: hidden;
}

.dz-overlap {
    position: absolute;
    top: 0;
    left: 0;
    height: 100px;
    width: 100px;
    overflow: hidden;
    padding: 20px 10px;
    background-color: rgba(78, 78, 78, 0.9);
    visibility: hidden;
}

.dz-details:hover .dz-overlap {
    visibility: visible !important;
}

.dz-filename {
    color: #fff;
    font-size: 8px;
    word-wrap: break-word;
}

.dz-remove {
    background-image: url('fk-rounded-cancel.svg');
    height: 20px;
    width: 20px;
    position: absolute;
    margin-left: 30px;
    bottom: 20px;
}

/*============================================================*\
    COLORS
\*============================================================*/
.color-success {
    color: #009490;
    font-weight: bold;
}

.color-warning {
    color: #ff7f3f;
    font-weight: bold;
}

.color-danger {
    color: #d74123;
    font-weight: bold;
}

.color-info {
    color: #236ed7;
    font-weight: bold;
}

.color-purple {
    color: #780a0a; /* #801bbf;*/
    font-weight: bold;
}

.color-blu {
    color: #1c52e8; /* #801bbf;*/
    font-weight: bold;
}

.color-sky {
    color: #1cdae8;
    font-weight: bold;
}

.color-light-grey {
    color: #b0acac; /* #801bbf;*/
}

/*============================================================*\
    SVG ICONS
\*============================================================*/
.color-normal svg .icon-stroke {
    /* stroke: #999;*/
    stroke: #4d4d4d;
}

.color-normal:hover svg .icon-stroke {
    /*stroke: #4d4d4d;*/
    stroke: #e2d304;
}

.color-normal.disabled svg .icon-stroke,
.color-normal.disabled:hover svg .icon-stroke {
    stroke: #d6d9d6;
}

.color-normal svg .icon-fill {
    fill: #4d4d4d /* #999*/;
}

.color-normal:hover svg .icon-fill {
    fill: #e2d304 /* #4d4d4d*/;
}

.color-normal.disabled svg .icon-fill,
.color-normal.disabled:hover svg .icon-fill {
    fill: #d6d9d6;
}

.color-success svg .icon-stroke {
    stroke: #009490;
}

.color-warning svg .icon-stroke {
    stroke: #ff7f3f;
}

.color-danger svg .icon-stroke {
    stroke: #d74123;
}

.color-success svg .icon-fill {
    fill: #009490;
}

.color-warning svg .icon-fill {
    fill: #ff7f3f;
}

.color-danger svg .icon-fill {
    fill: #d74123;
}

/*--- kendo override ---*/
.k-state-hover .k-i-arrow-s,
.k-state-hover.k-state-focused .k-i-arrow-s,
.k-state-hover .k-i-arrow-e,
.k-state-hover.k-state-focused .k-i-arrow-e,
.k-state-hover .k-i-arrow-w,
.k-state-hover.k-state-focused .k-i-arrow-w,
.k-state-hover .k-i-arrow-n,
.k-state-hover.k-state-focused .k-i-arrow-n,
.k-multiselect-wrap .k-state-hover .k-i-close,
.k-i-calendar:hover,
.k-i-clock:hover {
    opacity: 0.69;
}

.k-state-disabled .k-i-arrow-s,
.k-state-disabled .k-i-arrow-n,
.k-state-disabled .k-i-calendar,
.k-state-disabled .k-i-clock {
    opacity: 0.16;
}

/*============================================================*\
    SCROLLBAR
\*============================================================*/
/*  chrome  */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #5a6660;
    -webkit-box-shadow: none;
}

    ::-webkit-scrollbar-thumb:window-inactive {
        background: #5a6660;
    }

/*  explorer  */
/*body{
  scrollbar-base-color: transparent;
  scrollbar-3dlight-color: transparent;
  scrollbar-highlight-color: transparent;
  scrollbar-face-color: #5a6660;
  scrollbar-track-color: transparent;
  scrollbar-arrow-color: #fff;
  scrollbar-shadow-color: transparent;
}*/

/*  firefox */
/*not working*/
.buttonPenalties, .buttonSaveToHistory, .buttonMassivePay {
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}
/*============================================================*\
    TESTING
\*============================================================*/
/*
 * css relativo alla pagina controls.html raggiungibile mediante la route ~/testing.
 * Oltre a gestire da dimensione massima e la posizione del div che visualizza i dati,
 * riordina e ottimizza il posizionamento dei tre elementi principali.
 */
.left-menu {
    background-color: #002426;
    width: 275px;
    height: 100vh;
    position: fixed;
    top: 0px;
    left: 0px;
    overflow-y: scroll;
}

.fixed-header {
    position: fixed;
    top: 0px;
    margin-left: /*275px; ies*/ 305px;
    padding: 0px 10px; /*ies 40*/
    width: calc(100% - 345px); /*ies calc(100% - 293px); -- 286 last ies */
    z-index: 1;
}

.report .fixed-header {
    /*margin-right: 200px;*/
    /*width: calc(100% - 493px);*/
    /*width: calc(100% - 480px);*/
}

.webkit .fixed-header {
    width: calc(100% - 285px);
}

.report.webkit .fixed-header {
    /*width: calc(100% - 485px);*/
    width: calc(100% - 370px);
}

.fixed-header .header {
    background-color: #eaedea;
    margin: 0px auto;
    /*max-width: 1280px; ies */
    height: 11em; /*145px;*/
}

    .fixed-header .header.edit {
        background-color: #fff;
    }

.main-page {
    background-color: #eaedea;
    padding: 145px 40px 0px 315px;
    width: 100%;
    height: 100vh;
    overflow-y: scroll;
}

.report .main-page {
    margin-right: 200px;
    width: calc(100% - 200px);
}

.webkit .main-page {
    margin-right: 5px;
    padding-right: 35px;
    width: calc(100% - 5px);
}

.report.webkit .main-page {
    margin-right: 205px;
    padding-right: 35px;
    width: calc(100% - 205px);
}

.main-page.background-edit {
    background-color: #fff;
}

.main-view {
    margin: 0px auto;
    /*max-width: 1280px; ies */
}

.testing .main-view {
    height: 1500px;
}

.main-view .create-grid-icon,
.main-view .refuelings-grid {
    margin: 0px;
    margin-bottom: 20px;
}

.fixed-header .top-header {
    position: relative;
}

/*number-box bold*/

.box-head .bold {
    font-weight: bold;
}

.box-head .backgroundligthYellow {
    background-color: lightgoldenrodyellow;
    font-weight: bold;
    color: black;
}

/* tooltip menu */

/*--- FK-TOOLTIP ---*/
.fw-tooltip {
    /*background-color: #ccccc9;*/
    margin: 9px 0px 0px 0px;
    padding: 0px;
}

    .fw-tooltip .fw-button {
        color: #fff;
        padding: 3px 15px 3px 15px;
        margin: 0px;
        cursor: pointer;
    }

        .fw-tooltip .fw-button + .fw-button {
            margin-top: 4px;
            margin-bottom: 10px;
        }

        .fw-tooltip .fw-button:hover {
            color: #4d4d4d;
            background-color: #ffff01;
        }

.k-widget.k-tooltip.k-tooltip-closable {
    padding: 0px;
}

    .k-widget.k-tooltip.k-tooltip-closable .k-tooltip-button {
        display: none;
    }

    .k-widget.k-tooltip.k-tooltip-closable .k-tooltip-content {
        margin: 0px;
        padding: 0px;
    }

.error-dynamic {
    font-size: 10px;
}

.k-list-optionlabel {
    padding: 2px 10px 0px 10px !important;
    /* margin: 5px 10px 0px 0px!important; */
    /* color: #999999; */
}

div.jsoneditor-tree {
    overflow: hidden !important
}

div.jsoneditor {
    border: none !important
}

div.jsoneditor-menu {
    background-color: #cbcbc8 !important;
    border-bottom: 1px solid #cbcbc8 !important;
}

a.jsoneditor-poweredBy {
    display: none !important;
}

/* charts*/
.k-chart, .k-stockchart {
    height: 100% !important;
}

.modal-report-container {
    margin: auto;
    display: flex;
    align-items: center;
}

.modal-report {
    max-height: 500px !important;
    width: 100%;
    display: inline-block;
}

.full-height {
    height: 100% !important;
}

.home-donut-height {
    height: 365px !important;
}

.myreport-chart-height {
    height: 550px !important;
}

/* report loader */

.report-loader {
    height: 100%;
    width: 100%;
    /*position: relative;*/
    background-color: white;
    display: block;
    /*z-index: 1000;*/
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.report-loader-icon {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    overflow: hidden;
    /*this to solve "the content will not be cut when the window is smaller than the content": */
    /*max-width: 100%;
    max-height: 100%;
    overflow: auto;*/
    /*z-index: 1001;*/
}

/* image loader */

.image-loader {
    height: 90%;
    width: 100%;
    /*position: relative;*/
    display: block;
    /*z-index: 1000;*/
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.image-loader-icon {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    overflow: hidden;
    /*this to solve "the content will not be cut when the window is smaller than the content": */
    /*max-width: 100%;
    max-height: 100%;
    overflow: auto;*/
    /*z-index: 1001;*/
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*icon send email driver*/
.fk-prospect > .box-body .email-driver-icon {
    position: absolute;
    top: 20px;
    right: 13px;
}

.k-grid-edit-row .k-state-focused .k-select {
    background-color: transparent;
}

.k-grid-edit-row .k-state-focused .k-select {
    background-color: transparent;
}

.k-grid .k-header .k-button {
    color: #444;
    background-color: transparent;
    border-color: transparent;
}

    .k-grid .k-header .k-button.k-state-hover {
        color: #444;
        background-color: transparent;
        border-color: #CCCCC9;
    }

.report-configurator-grid tr.k-state-selected, .report-configurator-grid .k-state-selected td {
    background-color: transparent !important;
    font-weight: bold;
}

    .report-configurator-grid tr.k-state-selected.k-alt {
        background-color: #f2f5f2 !important;
    }

.loadingimport {
    z-index: 1000;
    min-height: 60px;
    width: 50px;
    position: fixed;
    top: 70px;
    right: 150px;
}

    .loadingimport div.loadingtitle {
        position: absolute;
        top: 60px;
        font-weight: bold;
        display: none;
    }

.loadingimportmodal {
    z-index: 1000;
    min-height: 60px;
    width: 50px;
    position: fixed;
    top: 115px;
    right: 150px;
}

    .loadingimportmodal div.loadingtitle {
        position: absolute;
        top: 60px;
        font-weight: bold;
        display: none;
    }

.permButtonChecked {
    width: 22px;
    font-weight: 900;
    background-color: #26958f;
    background-size: 10px 10px;
    background-repeat: no-repeat;
    color: white;
    border-radius: 4px;
    border-color: darkgreen;
    float: right;
    margin-left: 5px;
    margin-top: 3px;
    text-align: center;
    padding-bottom: 2px;
}

.permButtonUnChecked {
    width: 22px;
    font-weight: 100;
    background-color: #CCCCC9;
    color: white;
    border-radius: 4px;
    border-color: #bca2a2;
    float: right;
    margin-left: 5px;
    margin-top: 3px;
    text-align: center;
    padding-bottom: 2px;
}

.hiddenButton {
    width: 0px;
    heigth: 0px;
    visibility: hidden;
}

li[role=treeitem]:nth-child(even):not([data-expanded]),
li[role=treeitem]:nth-child(even):not([data-expanded]) .k-state-hover,
li[role=treeitem]:nth-child(even):not([data-expanded]) .k-state-selected {
    background: #ffffff;
}

li[role=treeitem]:nth-child(odd):not([data-expanded]),
li[role=treeitem]:nth-child(odd):not([data-expanded]) .k-state-hover,
li[role=treeitem]:nth-child(odd):not([data-expanded]) .k-state-selected {
    background: #f2f5f2;
}

li[role=treeitem]:nth-child(even)[data-expanded=true],
li[role=treeitem]:nth-child(even)[data-expanded=true] .k-state-hover,
li[role=treeitem]:nth-child(even)[data-expanded=true] .k-state-selected {
    background: #ffffff;
}

li[role=treeitem]:nth-child(odd)[data-expanded=true],
li[role=treeitem]:nth-child(odd)[data-expanded=true] .k-state-hover,
li[role=treeitem]:nth-child(odd)[data-expanded=true] .k-state-selected {
    background: #f2f5f2;
}

li[role=treeitem]:nth-child(odd) {
    border-bottom: 1px solid #eee;
}

li[role=treeitem]:nth-child(even) {
    border-bottom: 1px solid #eee;
}

div[data-role=treeview] {
    border: 2px solid #eee;
    padding: 1px;
}

.permissionCheckAll {
    padding: 5px 5px 5px 15px;
}

    .permissionCheckAll input {
        padding-left: 15px;
    }

.checkAllText {
    padding-left: 30px;
}

.group-row {
    font-weight: bold;
    margin-top: 10px;
    border-bottom: 2px solid;
    padding-bottom: 10px;
    padding-left: 10px !important;
}

#qrcodeprint {
    display: none;
    width: 20px;
    height: 20px;
    margin-bottom: 30px;
    float: left;
    margin-left: 30px;
}

#qrcode {
    float: left;
    width: 200px;
}

#qrcodeNumberplate {
    text-align: center;
    font-weight: bold;
    padding: 10px;
}

div[model$=permission] input[type=checkbox],
div[model$=permissionBox] input[type=checkbox] {
    accent-color: #0000b8 !important;
}

#tabstrip .tab {
    padding: 5px 8px 5px 8px;
    float: left;
    width: 25%;
    cursor: pointer;
    position: relative;
    padding-top: 0.5em;
}

#tabstrip .lasttab {
    clear: both;
    background-color: #eaedea;
    cursor: pointer;
}

#tabstrip .tab.selected {
    background-color: white;
}

#tabstrip .tab.unselected {
    background-color: #eaedea;
}

#tabstrip {
    background-color: #eaedea;
    height: 1.8em;
}

    #tabstrip .tabContent > div {
        background-color: white;
    }

    #tabstrip .fk-prospect > .box-head {
        display: none;
    }

    #tabstrip .fk-prospect > .box-body {
        border: 0px solid transparent;
        padding: 0px;
    }

    #tabstrip .halfTable {
        width: 70%;
        float: left;
    }

    #tabstrip .halfContent {
        width: 30%;
        float: right;
        padding: 25px 10px 10px 10px;
    }

    #tabstrip .halfContentContainer {
        padding: 10px;
    }

    #tabstrip .halfContentPanel {
        padding: 10px;
        background-color: #eaedea;
    }

    #tabstrip .contentImage {
        border: 1px solid black;
        margin-left: 10px;
        text-align: center;
    }

    #tabstrip .contentTitle {
        padding: 10px 10px 20px 10px;
    }

    #tabstrip .contentDescription {
        padding-bottom: 20px;
        padding-left: 10px;
    }

    #tabstrip .halfContentPanel img {
        padding: 10px;
        height: 400px;
    }

div[field=excludeFromCompetition] {
    background-color: lightgray;
}

.saveToHistory-icon {
    display: inline-block;
    width: 20px;
    height: 23px;
    margin-left: 7px;
}

.simple-modal {
    position: fixed; /* Stay in place */
    z-index: 1000000; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.simple-modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    height: 300px;
}

.simple-modal-text {
    white-space: normal;
}

.fk-prospect > .box-body > div.export-form {
    padding-top: 0px;
}

.chart > .fk-switchbox {
    padding: 21px 0px 10px 0px;
    border: 0px;
    font-size: 8px;
    margin: 9px;
}

    .chart > .fk-switchbox > .left-content {
        text-align: right;
    }

.menu .panel-bar-menu .inner-menu-item-style.k-last span {
    border-bottom: 0px solid white !important;
}

.menu .panel-bar-menu .inner-menu-item-style > span.k-link.k-state-hover {
    color: #ffff01;
}

.menu .panel-bar-menu .inner-menu-item-style.selected > span.k-link {
    color: #ffff01;
}

.remove-top-border > div {
    border-top: 0px solid white !important;
}

#tabstrip .k-grid-content {
    min-height: 50px;
}

.tab.selected {
    border-top: 1px solid #ffff01;
    border-right: 1px solid #ffff01;
    border-left: 1px solid #ffff01;
}

/* Style for the tooltip */
.version {
    position: relative;
    cursor: pointer; /* Add a pointer cursor to indicate interactivity */
}

    .version::before {
        content: attr(data-tooltip);
        position: absolute;
        top: -30px; /* Adjust the top position as needed */
        left: 50%;
        transform: translateX(-50%);
        background-color: #000;
        color: #fff;
        padding: 5px;
        border-radius: 5px;
        opacity: 0;
        transition: opacity 0.3s;
        pointer-events: none; /* Prevent interaction with the tooltip */
    }

.notifyjs-bootstrap-success {
    background-color: #7be57d !important;
    background-position: left !important;
}

.notifyjs-bootstrap-info {
    background-position: left !important;
}

.notifyjs-bootstrap-error {
    background-position: left !important;
}

.notifyjs-bootstrap-warn {
    background-position: left !important;
}

.invisible {
    display: none;
}

.visible {
    display: block;
}

.printQRButtonContainer {
    float: right;
    padding-top: 20px;
}

.printQRButton, .warningExpulsionButton {
    display: block;
    height: 2em;
}

.k-window-actions span.k-i-close.k-icon {
    background-image: url('fk-close-small-16.png') !important;
    background-position: 0px 0px;
    !important;
}

.k-window .k-i-close.k-icon,
.k-window-titlebar :not(.k-state-disabled).k-link:hover > .k-i-close.k-icon {
    background-image: url('fk-close-small-16.png');
    background-position: 0px 0px;
    !important;
    margin-left: 10px;
    margin-top: -16px;
    opacity: 0.7;
}

.penalties .btn-bar-centered input[type="button"] {
    width: 97% !important;
    border-radius: 4px !important;
}

.warehouse-movements .btn-bar-left input[type="button"] {
    min-width: 100px;
    border-radius: 4px !important;
    margin-right: 5px;
}

div#commonSupplierDropdown .fk-dropdownbox {
    float: left;
    width: 210px;
}

#commonSupplierButton {
    padding-top: 25px;
}

.headeradd {
    font-size: 8px;
    float: left;
    padding-right: 20px;
    margin: 0px 0px 5px 10px;
    width: 200px;
}

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

.warningExpulsionButton {
    float: right;
    margin: 30px 20px 0px 0px;
    min-width: 60px;
}

.warningExpulsionValue {
    font-weight: bold;
    color: red;
}

.warningExpulsionInfoRow {
    padding-top: 10px;
}

.btn-default {
    font: inherit;
    text-transform: uppercase;
}

.sticky {
    position: sticky;
}

.rightClickMenuItem {
    display: block;
}

a.rightClickMenuItem:link, a.rightClickMenuItem:visited {
    display: block;
    color: #f2f2f2;
    text-decoration: none;
    height: 20px;
    line-height: 20px;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px;
}

a.rightClickMenuItem:hover, a.rightClickMenuItem:active {
    display: block;
    background: #f2f2f2;
    color: #002426;
    text-decoration: none;
    height: 20px;
    line-height: 20px;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px;
}

#rightClickMenu {
    display: none;
    position: absolute;
    z-index: 10000000;
    background-color: #002426;
    height: 60px;
    padding: 20px 0px 10px 0px;
    border: 1px solid #5a6660;
}

.rightClickMenuCloseButton {
    display: block;
    float: right;
    color: white;
    width: 20px;
    border: 1px solid #5a6660;
    padding: 3px 2px 4px 5px;
    margin-top: -17px;
    height: 20px;
    margin-right: 3px;
    cursor: pointer;
}

.on-screen-error {
    margin-left: 10px;
    font-size: 8px;
}

.applyWarningLicenseMultilineButtonContainer > div {
    overflow: scroll;
    height: 200px;
}

.k-grid-content {
    height: calc(100vh - 300px);
}