/*
    Global Settings:
        font-size: .9rem;
        Header/Dark Blue         = #03254E
        Tabs/Blue                = #7ea3cc  - STEEL BLUE
        Titles/Mid Blue          = #255c99  - YALE
        Hover/Alt Row/Light Blue = #dff0ff
        Background/Cream         = #262626
        Inner Table/Cream        = #37404a

        Buttons
        - Primary - Edit/Save/Update   = #727CF5 - Hover #6973e3
		- Success - Search              = #0ACF97 - Hover #09bf8c
		- Danger = Delete/Cancel        = #FA5C7C - Hover #e75573
		- warning - Clear                = #FFC35A - Hover #ecb453
		- Info - Actions                = #39AFD1 - Hover #35a2c1

*/

[data-theme="light"] {
    --color-bg: #f9fafd;
    --color-fg: #000000;
    --color-in: #F9FAF0;
    --color-row-m: #f9fafd;
    --color-row-a: #dff0ff;
    --color-head: #f9fafd;
    --filter: none;
    --page-color-fg: #000000;
    --fieldset-border: #03254E;
    --map-text-colour: #000000;
}

[data-theme="dark"] {
    --color-bg: #262626;
    --color-fg: #ffffff;
    --color-in: #37404a;
    --color-row-m: #37404a;
    --color-row-a: #464f5b;
    --color-head: #464f5b;
    --filter: invert(1);
    --page-color-fg: #ffffff;
    --fieldset-border: #f9fafd;
    --map-text-colour: #000000;
}

html {
    font-family: "Nunito", sans-serif;
    font-size: .9rem;
    background-color: var(--color-bg);
    color: var(--color-fg);
}

body {
    font-size: .9rem;
    font-family: "Nunito", sans-serif;
    background-color: var(--color-bg);
    color: var(--color-fg);
}

.k-content {
    color: var(--color-fg);
}

a:-webkit-any-link {
    color: var(--color-fg);
}

header {
    background: #03254E;
    color: #ffffff;
}
    header ul li a {
        color: #ffffff !important;
    }

nav, nav ul li a {
    background: var(--color-bg);
    color: var(--color-fg);
}

    nav ul li a:hover{
        background-color: #dff0ff;
        color:#000000;
    }

    nav ul li a.selected {
        background-color: #255c99;
    }

section .bottomToolbar {
    background: #03254E;
}

section #left {
    background-color: var(--color-bg);
}

section #right {
    background: var(--color-bg);
}

.k-list-container {
    background-color: var(--color-bg);
}
    .k-list-container .k-item {
        background-color: var(--color-in);
        color: var(--color-fg);
    }

.k-tabstrip {
    background: var(--color-bg) !important;
}

.k-tabstrip-items .k-state-default {
    background: none;
    background-color: #7ea3cc;
    color: #000000;
}

.k-tabstrip-items .k-state-active {
    background: #f9fafd;
    color: #ffffff;
    border-color: #03254E;
}

.k-tabstrip-items .k-state-default .k-link {
    color: #ffffff;
}

.k-tabstrip-items .k-state-active .k-link, .k-tabstrip-items .k-state-hover .k-link {
    color: #000000;
}

.k-tabstrip-items .k-state-hover {
    background: #dff0ff;
}

.k-dropdown-wrap.k-state-default {
    background: none !important;
    background-color: var(--color-bg);
    color: var(--color-fg);
}

.k-i-close, .k-state-hover > .k-i-close {
    background: url('../img/cross.png') no-repeat;
}

.k-state-hover > .k-state-hover:hover,.k-link:not(.k-state-disabled):hover>.k-i-close {
    background: url('../img/cross.png') no-repeat;
}

.k-state-hover > .k-link {
    color: #ffffff;
}

.k-grid-header .k-header > .k-link {
    background-color: #255c99;
    color: #ffffff;
}

.k-grid-header .k-header, .k-footer-template td, .k-link:visited, #vrmContent th {
    background-color: #255c99;
    color: #ffffff;
}

.k-detail-row {
    background-color: var(--color-in) !important;
}

tr, .k-master-row {
    background-color: var(--color-row-m);
    color: var(--color-fg);
}

.k-alt {
    background-color: var(--color-row-a);
    color: var(--color-fg);
}

.k-header {
    background: var(--color-head);
}

.k-panelbar > .k-item > .k-state-selected, .k-panelbar > li.k-state-default > .k-link, .k-panelbar > li.k-state-active > .k-link, .k-panelbar > li.k-item > .k-link {
    background: #dff0ff;
    color: #000000;
}

.k-panelbar > .k-state-active > .k-state-selected {
    background-color: #255c99 !important;
    border-color: #255c99 !important;
    color: #ffffff !important;
}

.k-panelbar > .k-item > .k-state-focused.k-state-hover, .k-panelbar > .k-item > .k-state-focused {
    background-color: #255c99 !important;
    border-color: #255c99 !important;
    color: #ffffff !important;
}

.k-state-focused.k-state-selected {
    box-shadow: none !important;
    background-color: #255c99;
    border-color: #255c99;
    color: #ffffff;
}

.k-pager-wrap {
    background: none;
    background-color: #255c99;
    color: #ffffff;
}

.k-pager-wrap .k-link:hover {
    background-color: #6973e3;
}

section #content, .background {
    background: var(--color-bg);
}

section .bottomToolbar ul li, section .bottomToolbar ul li.left {
    background: none;
}

    section .bottomToolbar ul li a {
        box-shadow: inset 0px 1px 0px 0px #ffffff;
        background: #f9fafd;
        border-radius: 6px;
        border: 1px solid #dcdcdc;
        display: inline-block;
        cursor: pointer;
        color: #03254E;
        font-family: Arial;
        font-weight: bold;
        text-decoration: none;
        text-shadow: 0px 1px 0px #ffffff;
    }

        /*section .bottomToolbar ul li a:hover {
            background-color: var(--color-bg);
        }*/

    section .bottomToolbar ul li a:active {
        position: relative;
        top: 1px;
    }

.k-window-titlebar {
    background: #03254E;
    color: #ffffff;
}

.toolbar {
    padding: 10px;
}

.k-textbox {
    background: none;
    background-color: var(--color-bg);
}

.nav ul li a.selected {
    background-color: #026CCF;
}
nav ul li a img, .k-grid .k-hierarchy-cell .k-icon {
    filter: var(--filter);
}

.k-state-active, .k-state-active:hover, .k-active-filter, .k-tabstrip .k-state-active {
    border-color: var(--fieldset-border);
}

.k-panelbar > .k-item > .k-link {
    border-color: #03254E;
}

.k-panelbar > li.k-item {
    background-color: var(--color-bg);
}
.k-panelbar .k-content {
    background-color: var(--color-bg);
}

fieldset {
    border: 1px solid var(--fieldset-border);
}

legend {
    color: var(--color-fg);
    font-weight: bold;
}

.k-state-default > .k-select {
    background-color: #255c99;
}

.k-pager-numbers .k-state-selected {
    background-color: #03254E;
    color: #ffffff;
    border-color: #03254E;
}

section #left h4 {
    background: none;
    background-color: #03254E;
    color: #ffffff;
}

.k-grid-content {
    background-color: var(--color-bg);
}

.k-grid-content .k-state-selected, .k-selectable .k-state-selected {
    background-color: #03254E;
    color: #ffffff;
    border-color: #03254E;
}

.k-button:focus:not(.k-state-disabled):not([disabled]) {
    box-shadow: none !important;
}

.success {
    background: none;
    background-color: #0ACF97;
    color: #ffffff;
}

    .success:hover {
        background: none;
        background-color: #09bf8c;
        color: #ffffff;
    }

.danger, .k-grid-delete, .k-grid-DeleteParent, .k-grid-DeleteChild, .k-grid-cancel, .k-grid-RemoveSession, .k-grid-Delete, .k-grid-RemoveSystem, .k-grid-RemoveCamera {
    background: none;
    background-color: #FA5C7C;
    color: #ffffff;
}

    .danger:hover, .k-grid-delete:hover, .k-grid-DeleteParent:hover, .k-grid-DeleteChild:hover, .k-grid-cancel:hover, .k-grid-RemoveSession:hover, .k-grid-Delete:hover, .k-grid-RemoveSystem:hover, .k-grid-RemoveCamera:hover {
        background: none;
        background-color: #e75573;
        color: #ffffff;
    }

.warning, .k-filter-menu .k-button {
    background: none;
    background-color: #FFC35A;
    color: #000000;
}

    .warning:hover, .k-filter-menu .k-button:hover {
        background: none;
        background-color: #ecb453;
        color: #000000;
    }

.info, .k-grid-Details, .k-grid-claim, .k-grid-ViewParent, .k-grid-ViewDetails, .k-grid-Cameras, .k-grid-ViewChild, .k-grid-Snapshot, .k-buttonOff, .k-grid-ExtendedDetails, .k-grid-VehicleDetails {
    background: none;
    background-color: #39AFD1;
    color: #ffffff;
}

    .info:hover, .k-grid-Details:hover, .k-grid-claim:hover, .k-grid-ViewParent:hover, .k-grid-ViewDetails:hover, .k-grid-Cameras:hover, .k-grid-ViewChild:hover, .k-grid-Snapshot:hover, .k-buttonOff:hover, .k-grid-ExtendedDetails:hover, .k-grid-VehicleDetails:hover {
        background: none;
        background-color: #35a2c1;
        color: #ffffff;
    }

.primary, .k-grid-edit, .k-grid-Edit, .k-grid-update, .k-grid-EditParent, .k-grid-add, .k-grid-ResetPassword, .k-grid-SetupCamera, .k-grid-CopyRole, .k-upload-button, .k-grid-Preview, .k-grid-Load, .k-grid-Update, .k-filter-menu .k-primary, .k-grid-Launch, section #right section#rightEditPane #btnSubmitChanges {
    background: none;
    background-color: #727CF5;
    color: #ffffff;
}

    .primary:hover, .k-grid-edit:hover, .k-grid-Edit:hover, .k-grid-update:hover, .k-grid-EditParent:hover, .k-grid-add:hover, .k-grid-ResetPassword:hover, .k-grid-SetupCamera:hover, .k-grid-CopyRole:hover, .k-upload-button:hover, .k-grid-Preview:hover, .k-grid-Load:hover, .k-grid-Update:hover, .k-grid-Launch:hover, .k-filter-menu .k-primary:hover {
        background: none;
        background-color: #6973e3;
        color: #ffffff;
    }


.k-i-arrow-s, .k-state-selected .k-i-arrow-s {
    background: url(../img/arrow_down_full.png) no-repeat;
}

.k-i-arrow-n {
    background: url(../img/arrow_up_full.png) no-repeat;
}

.k-numerictextbox .k-select .k-link span.k-i-arrow-s {
    background-position: 0 -6px;
}

.k-state-hover > * > .k-i-arrow-s {
    background: url(../img/double_arrow_down.png) no-repeat;
}

.k-i-seek-w, .k-link:not(.k-state-disabled):hover > .k-i-seek-w {
    background: url(../img/first_page.png) no-repeat;
}

.k-i-seek-e, .k-link:not(.k-state-disabled):hover > .k-i-seek-e {
    background: url(../img/last_page.png) no-repeat;
}

.k-i-arrow-w, .k-link:not(.k-state-disabled):hover > .k-i-arrow-w {
    background: url(../img/arrow_left.png) no-repeat;
}

.k-i-arrow-e, .k-link:not(.k-state-disabled):hover > .k-i-arrow-e {
    background: url(../img/arrow_right.png) no-repeat;
}

.k-filter {
    background: url(../img/filter.png) no-repeat;
}

.k-grid-filter.k-state-active {
    background: url(../img/filter.png) no-repeat #03254E;
}

.k-grid-filter .k-state-active {
    /*background: url(../img/filter-on.png) no-repeat;*/
    background-color: #dff0ff;
}

.k-picker-wrap.k-state-default {
    background:none;
}
.k-i-calendar, .k-state-hover > * > .k-i-calendar {
    background: url(../img/calendar_month.png) no-repeat;
}

.k-i-clock, .k-state-hover > * > .k-i-clock {
    background: url(../img/clock_analog.png) no-repeat;
}

.k-picker-wrap.k-state-hover {
    background-color: #dff0ff !important;
}

.right-pane {
    text-align: center;
    border: 1px solid #03254E;
    background-color: var(--color-bg);
}
.stack > div {
    background-color: var(--color-bg);
    border: 1px solid var(--fieldset-border);
    color: var(--color-fg);
}

.convoy-snap {
    clear: both;
    height: 150px;
    width: 100%;
    background-color: var(--color-bg);
    border: 1px solid var(--fieldset-border);
}

.map {
    border: 1px solid #03254E;
}

.selected {
    background: var(--color-bg);
    color: var(--color-fg);
}

.k-multiselect-wrap li {
    background: #39AFD1;
    color: #ffffff;
}

.k-reset .k-state-hover {
    background-color: #dff0ff;
    color: #000000;
}

.furtherDetailsViewModel, .border {
    border: 1px solid var(--fieldset-border);
    background-color: var(--color-bg);
}

.pane-content {
    background: var(--color-bg);
}

.k-calendar {
    background-color: var(--color-bg);
}

    .k-calendar .k-link {
        background-color: #255c99;
        color: #ffffff;
    }

        .k-calendar .k-link:hover {
            background-color: #03254E;
        }

    .k-calendar .k-state-selected .k-link {
        background-color: #03254E;
    }

    .k-calendar .k-state-focused.k-state-selected {
        box-shadow: none !important;
        background-color: #03254E;
    }

    .k-calendar .k-link.k-nav-fast {
        color: #ffffff;
    }

    .k-calendar th, .k-calendar .k-footer, .k-calendar .k-footer .k-nav-today {
        background-color: var(--color-in);
        color: var(--color-fg);
    }

.k-grid .k-widget a {
    color: var(--page-color-fg);
}

.k-list-container {
    color: #ffffff;
}

.k-input, input.k-textbox, textarea.k-textbox, input.k-textbox:hover, textarea.k-textbox:hover, .k-textbox > input, .k-multiselect-wrap {
    background-color: var(--color-in) !important;
    color: var(--color-fg) !important;
}

/*
.k-widget {
    background-color: var(--color-bg);
}
*/

.k-tabstrip .k-content.k-state-active {
    background-color: var(--color-bg) !important;
    color: var(--color-fg) !important;
}

.k-chart {
    background-color: var(--color-bg);
    color: var(--color-fg);
}
div.k-window-content {
    background-color: var(--color-bg);
}

input[type="text"], input[type="number"], input[type="search"], textarea {
    background-color: var(--color-in);
    color: var(--color-fg);
}

.MicrosoftMap .as_container_search, #txtLocation {
    background-color: var(--color-in) !important;
    color: var(--color-fg) !important;
}

.MicrosoftMap .as_container li {
    color: var(--color-fg) !important;
}

.MicrosoftMap .as_container ul li:hover {
    color: var(--map-text-colour) !important;
}

.k-panelbar .k-content {
    color: var(--color-fg);
}

#hotlistdetails {
    background-color: var(--color-bg);
    color: var(--color-fg);
}

.box {
    background-color: var(--color-bg);
    color: var(--color-fg);
}

input:-webkit-autofill, input:-webkit-autofill:focus {
    background-color: var(--color-in) !important;
    color: var(--color-fg) !important;
}

.theme 
{
    background:none;
}

#viscelogo {
    /*filter: var(--filter);*/
}

.car-el {
    text-align: center;
    width: 75px;
    float: left;
    margin-top: 10px;
}

.car-el-target {
    color: var(--fieldset-border);
}

.standardCol {
    color: var(--color-fg);
}

#splitter {
    background-color: var(--color-bg);
}

.dropdown-menuitems {
    border: 1px solid var(--fieldset-border);
}


.k-treeview .k-treeview-lines .k-item  {
    color: var(--color-fg);
}

.k-treeview .k-icon {
    filter: var(--filter);
}

.k-block, .k-widget {
    background-color: var(--color-bg);
}
