﻿/* Prevent the content area height from growing beyond the height of the browser, by making the body a flex box */
/* If flex isn't needed in a page, just override the display: flex */
body {
    display: flex;
    flex-direction: column;
}

#pageContentContainer_19_0 {
    /* All of these properties are needed to make sure the page content is flexible */
    display: flex;
    flex: 1 1 auto; /* Make this fully flexible, growing and shrinking with window size and available space */
    flex-direction: column;
}

/* http://meyerweb.com/eric/tools/css/reset/ 
    v2.0 | 20110126
    License: none (public domain)
    // copied from /content/styles/reset.css
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

blockquote, q {
    quotes: none;
}

    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }

table {
    border-collapse: collapse;
    border-spacing: 0;
}





/* kendo theme --------------------------------------------------- */
.k-draghandle {
    border-color: #1f7800;
    background-color: #1f7800;
    box-shadow: 0 1px 1px 0 rgba(95, 95, 95, 0.3);
}

    .k-draghandle:hover {
        border-color: #1f7800;
        background-color: #1f7800;
        box-shadow: 0 1px 1px 0 rgba(95, 95, 95, 0.3);
    }

.k-event,
.k-task-complete {
    border-color: #1f7800;
    background: #1f7800 0 -257px none repeat-x;
    color: #ffffff;
}

/* Randy is beginning a move away from everything Kendo */
.formActionButton {
    padding: 5px 14px 4px;
    border: 1px solid #dbdbdb;
    text-align: center;
    vertical-align: middle;
    background-position: 50% 50%;
    box-shadow: none;
}

.formActionButton:hover {
    border-color: #1f7800;
}

.formActionButton {
    background-image: none;
}

.formActionButton:active {
    border-color: #1f7800;
}

.formActionButton:active:hover {
    border-color: #1f7800;
}

a.formActionButton {
    user-select: none;
    text-decoration: none;
    cursor: pointer;
}

.formCommitButton {
    background-color: #1f7800;
    color: #fff;
}

.formCommitButton:hover {
    background-color: #00648b;
    color: #fff;
}

.formCancelButton {
    background-color: #fff;
    color: #00648b;
}

.formCancelButton:hover {
    background-color: #00648b;
    color: #fff;
}

/*Ado - I removed the !important designation from the below block so I could override the style*/
.k-button {
    background-color: #1f7800;
    color: #fff;
}

.k-button:hover:not([disabled])  {
    background-color: #00648b !important;
}

.panel-heading .k-button:hover {
    background-color: #e0e0e0 !important;
    color: #000 !important;
    border-color: #000 !important;
}

.k-button:not([disabled]) > .k-icon.k-addRowAbove {
    background-position: -220px -76px;
}

.k-button:not([disabled]) > .k-icon.k-addRowBelow {
    background-position: -220px -100px;
}

.k-button:not([disabled]) > .k-icon.k-add {
    background-position: -48px -64px;
}

.k-button > .k-icon.k-edit {
    background-position: -48px 0px;
}

.k-button:not([disabled]) > .k-icon.k-update {
    background-position: -48px -32px !important;
}

.k-button:not([disabled]) > .k-icon.k-i-undo {
    background-position: -80px -160px !important;
}

.k-button > .k-icon.k-cancel {
    background-position: -48px -48px !important;
}

.k-button > .k-icon.k-delete {
    background-position: -48px -48px !important;
}

.k-state-focused .k-icon.k-i-calendar, .k-state-default .k-icon.k-i-calendar {
    background-position: -48px -176px !important;
}

/* sets selected main menu dropdown arrow to white instead of grey to improve visibility */
.k-state-highlight > * > .k-icon.k-i-arrow-s, .k-state-border-down > * > .k-icon.k-i-arrow-s {
    background-position-x: -16px;
}
.k-select > .k-icon.k-i-arrow-s:not(.k-loading){
    background-position-x: -16px;
}

.k-picker-wrap:not(.k-state-disabled) .k-icon.k-i-clock {
    background-position-x: -48px;
}

.k-state-default .k-select {
    background-color: #1f7800;
}

.k-state-focused .k-select, .k-state-hover .k-select {
    background-color: #00648b;
}

.k-state-active > .k-icon.k-filter {
    background-position: -48px -80px;
}

.k-active-filter,
.k-tabstrip .k-state-active {
    background-color: #ffffff;
    border-color: #1f7800;
    color: #000000;
}

.k-button:hover,
.k-button.k-state-hover {
    color: #ffffff;
    border-color: #1f7800;
    background-color: #1f7800;
}

.k-tabstrip-scrollable .k-button-bare:hover {
    background: #1f7800 !important;
}

.k-button:active,
.k-button.k-state-active {
    color: #ffffff;
    background-color: #1f7800;
    border-color: #1f7800;
}

.k-button:active:hover,
.k-button.k-state-active:hover {
    color: #ffffff;
    border-color: #1f7800;
    background-color: #1f7800;
}

.k-button:focus:not(.k-state-disabled):not([disabled]) {
    box-shadow: inset 0 0 0 1px #1f7800;
}

.k-menu .k-state-selected > .k-link {
    color: #ffffff;
    background-color: #1f7800;
    border-color: #1f7800;
    background-image: none;
}

.k-menu .k-link.k-state-active {
    background-color: #ffffff;
    border-color: #1f7800;
    color: #000000;
}

.k-menu .k-state-hover > .k-link {
    color: #ffffff;
    background-color: #1f7800;
    border-color: #1f7800;
    background-image: none;
    background-image: none, linear-gradient(to bottom, #1f7800 0px, #1f7800 100%);
}

.k-item .k-state-default {
    background-color: #00648b;
}

    .k-item.k-state-default > .k-state-active {
        background-color: #1f7800;
    }

.k-state-focused,
.k-grouping-row .k-state-focused {
    border-color: #1f7800;
}

.k-calendar .k-nav-fast.k-state-hover {
    text-decoration: none;
    background-color: #1f7800;
    color: #ffffff;
}

.k-calendar .k-today {
    box-shadow: inset 0 0 0 1px #1f7800;
}

.k-calendar td.k-state-hover.k-state-focused {
    box-shadow: inset 0 0 0 1px #124500;
}

.k-calendar td.k-state-focused,
.k-calendar .k-today.k-state-focused,
.k-calendar .k-today:active,
.k-calendar .k-today.k-state-selected:active {
    box-shadow: inset 0 0 0 1px #175900;
}

.k-calendar td.k-state-selected.k-state-hover {
    background-color: #1f7800;
}

.k-state-selected,
.k-state-selected:link,
.k-state-selected:visited,
.k-list > .k-state-selected,
.k-list > .k-state-highlight,
.k-panel > .k-state-selected,
.k-ghost-splitbar-vertical,
.k-ghost-splitbar-horizontal,
.k-draghandle.k-state-selected:hover,
.k-scheduler .k-scheduler-toolbar .k-state-selected,
.k-scheduler .k-today.k-state-selected,
.k-marquee-color {
    color: #ffffff;
    background-color: #1f7800;
    border-color: #1f7800;
}

.k-virtual-item.k-first,
.k-group-header + .k-list > .k-item.k-first,
.k-static-header + .k-list > .k-item.k-first {
    border-top-color: #1f7800;
}

.k-group-header + div > .k-list > .k-item.k-first:before {
    border-top-color: #1f7800;
}

.k-popup > .k-group-header,
.k-popup > .k-virtual-wrap > .k-group-header {
    background: #1f7800;
    color: #ffffff;
}

.k-popup .k-list .k-item > .k-group {
    background: #1f7800;
    color: #ffffff;
    border-bottom-left-radius: 0;
}

.k-state-focused,
.k-list > .k-state-focused,
.k-listview > .k-state-focused,
.k-grid-header th.k-state-focused,
td.k-state-focused,
.k-button.k-state-focused {
    box-shadow: inset 0 0 0 1px #1f7800;
}

.k-state-focused.k-state-selected,
.k-list > .k-state-focused.k-state-selected,
.k-listview > .k-state-focused.k-state-selected,
td.k-state-focused.k-state-selected {
    box-shadow: inset 0 0 3px 1px #0b2c00;
}

.k-state-hover,
.k-state-hover:hover,
.k-splitbar-horizontal-hover:hover,
.k-splitbar-vertical-hover:hover,
.k-list > .k-state-hover,
.k-scheduler .k-scheduler-toolbar ul li.k-state-hover,
.k-pager-wrap .k-link:hover,
.k-dropdown .k-state-focused,
.k-filebrowser-dropzone,
.k-list > .k-item.k-state-focused,
.k-mobile-list .k-item > .k-link:active,
.k-mobile-list .k-item > .k-label:active,
.k-mobile-list .k-edit-label.k-check:active,
.k-mobile-list .k-recur-view .k-check:active {
    color: #ffffff;
    background-color: #1f7800;
    border-color: #1f7800;
}

/* this selector should be used separately, otherwise old IEs ignore the whole rule */
.k-mobile-list .k-scheduler-timezones .k-edit-field:nth-child(2):active {
    color: #ffffff;
    background-color: #1f7800;
    border-color: #1f7800;
}

.k-ie8 .k-window-titlebar .k-state-hover {
    border-color: #1f7800;
}

.k-state-hover > .k-select,
.k-state-focused > .k-select {
    border-color: #1f7800;
}

.k-button:hover,
.k-button.k-state-hover,
.k-button:focus,
.k-button.k-state-focused,
.k-textbox:hover,
.k-state-hover,
.k-state-hover:hover,
.k-pager-wrap .k-link:hover,
.k-other-month.k-state-hover .k-link,
div.k-filebrowser-dropzone em,
.k-draghandle:hover,
.k-split-button:focus {
    background-image: none;
}

.k-autocomplete.k-state-hover,
.k-autocomplete.k-state-focused,
.k-picker-wrap.k-state-hover,
.k-picker-wrap.k-state-focused,
.k-numeric-wrap.k-state-hover,
.k-numeric-wrap.k-state-focused,
.k-dropdown-wrap.k-state-hover,
.k-dropdown-wrap.k-state-focused {
    background-color: #1f7800;
    background-image: none;
    background-image: none, linear-gradient(to bottom, #1f7800 0px, #1f7800 100%);
    background-position: 50% 50%;
    border-color: #dbdbdb;
}

.km-pane-wrapper .km-pane .k-mobile-list.k-filter-menu .k-space-right > input:focus {
    border-color: #1f7800;
}

.k-upload-status .k-button:hover .k-delete,
.k-upload-status .k-button:hover .k-i-delete {
    background-color: #1f7800;
}

.k-widget.k-tooltip {
    border-color: #207d00;
    background-color: #207d00;
    color: #ffffff;
}

.k-callout-n {
    border-bottom-color: #207d00;
}

.k-callout-w {
    border-right-color: #207d00;
}

.k-callout-s {
    border-top-color: #207d00;
}

.k-callout-e {
    border-left-color: #207d00;
}

input.k-textbox[readonly] {
    background-color: #ececec;
}

.k-textbox:hover:not([readonly]),
.k-tiles li.k-state-hover {
    border-color: #1f7800;
}

.k-tiles li.k-state-selected {
    border-color: #1f7800;
}

.k-editor-inline ::selection {
    background-color: #1f7800;
    text-shadow: none;
    color: #fff;
}

.k-editor-inline ::-moz-selection {
    background-color: #1f7800;
    text-shadow: none;
    color: #fff;
}

.k-gantt .k-treelist tr:hover {
    background-color: #1f7800;
}

.k-gantt .k-treelist .k-state-selected,
.k-gantt .k-treelist .k-state-selected td,
.k-gantt .k-treelist .k-alt.k-state-selected,
.k-gantt .k-treelist .k-alt.k-state-selected > td {
    background-color: #1f7800;
}

.k-gantt .k-treelist .k-state-selected:hover,
.k-gantt .k-treelist .k-state-selected:hover td {
    background-color: #1f7800;
}

.k-state-selected.k-task-milestone,
.k-state-selected .k-task-summary-complete {
    border-color: #1f7800;
    background: #1f7800;
}

.k-task-single {
    background-color: #289c00;
    border-color: #1f7800;
    color: #ffffff;
}

.k-state-selected.k-task-single {
    border-color: #1f7800;
}

.k-state-selected.k-line {
    background-color: #1f7800;
    color: #1f7800;
}

.km-pane-wrapper .k-mobile-list .k-item.k-state-selected {
    background-color: #1f7800;
    border-top-color: #1f7800;
}

.k-autocomplete.k-state-hover,
.k-picker-wrap.k-state-hover,
.k-numeric-wrap.k-state-hover,
.k-dropdown-wrap.k-state-hover {
    background-color: #1f7800;
    background-image: none;
    background-image: none, linear-gradient(to bottom, #1f7800 0px, #1f7800 100%);
    background-position: 50% 50%;
    border-color: #dbdbdb;
}

.k-autocomplete.k-state-focused,
.k-picker-wrap.k-state-focused,
.k-numeric-wrap.k-state-focused,
.k-dropdown-wrap.k-state-focused,
.k-multiselect.k-header.k-state-focused {
    background-color: #1f7800;
    background-image: none;
    background-image: none, linear-gradient(to bottom, #1f7800 0px, #1f7800 100%);
    background-position: 50% 50%;
    border-color: #dbdbdb;
    box-shadow: none;
}

.k-panelbar .k-state-focused.k-state-hover {
    background: #1f7800;
    box-shadow: none;
}

.k-tabstrip-items .k-state-hover {
    border-color: #1f7800;
}

.k-tabstrip-items .k-state-active,
.k-panelbar .k-tabstrip-items .k-state-active {
    background-color: #ffffff;
    background-image: none;
    border-color: #1f7800;
}

.k-grid tr:hover,
.k-grid td.k-state-selected:hover {
    color: #ffffff;
    background-color: #1f7800;
}

.k-grid td.k-state-focused {
    box-shadow: inset 0 0 0 1px #175900;
}

.k-primary,
.k-overflow-container .k-primary {
    color: #ffffff;
    border-color: #1f7800;
    background-image: none;
    background-position: 50% 50%;
    background-color: #1f7800;
    box-shadow: none;
}

.k-primary:hover {
    color: #ffffff;
    border-color: #1f7800;
    background-image: none;
    background-color: #1f7800;
    box-shadow: none;
}

.k-primary:active {
    color: #ffffff;
    border-color: #1f7800;
    background-image: none;
    background-color: #1f7800;
    box-shadow: none;
}

.k-primary.k-state-disabled,
.k-state-disabled .k-primary,
.k-primary.k-state-disabled:hover,
.k-state-disabled .k-primary:hover,
.k-primary.k-state-disabled:hover,
.k-state-disabled .k-primary:active,
.k-primary.k-state-disabled:active {
    color: #d4d4d4;
    border-color: #228200;
    background-color: #228200;
    background-image: none;
    box-shadow: none;
}

.k-split-button:focus {
    box-shadow: inset 0 0 0 1px #1f7800;
}

.k-editor .k-tool:focus {
    outline: 0;
    border-color: #dbdbdb;
    box-shadow: inset 0 0 0 1px #1f7800;
}

.k-checkbox-label:hover:before,
.k-checkbox:checked + .k-checkbox-label:hover:before {
    border-color: #1f7800;
    box-shadow: none;
}

.k-checkbox:checked + .k-checkbox-label:before {
    background-color: #ffffff;
    border-color: #dbdbdb;
    color: #1f7800;
}

.k-checkbox-label:active:before {
    box-shadow: none;
    border-color: #1f7800;
}

.k-checkbox:focus + .k-checkbox-label:before {
    border-color: #1f7800;
    box-shadow: none;
}

.k-checkbox:indeterminate + .k-checkbox-label:after {
    background-color: #1f7800;
    background-image: none;
    border-color: #1f7800;
    border-radius: -1;
}

.k-checkbox:indeterminate:hover + .k-checkbox-label:after {
    border-color: #1f7800;
    background-color: #1f7800;
}

.k-radio-label:before {
    border-color: #dbdbdb;
    border-radius: 50%;
    background-color: #ffffff;
    border-width: 1px;
}

.k-radio-label:hover:before,
.k-radio:checked + .k-radio-label:hover:before {
    border-color: #1f7800;
    box-shadow: none;
}

.k-radio:checked + .k-radio-label:after {
    background-color: #1f7800;
    border-radius: 50%;
}

.k-radio-label:active:before {
    border-color: #1f7800;
    box-shadow: none;
}

.k-radio:checked + .k-radio-label:active:before {
    box-shadow: none;
    border-color: #1f7800;
}

.k-radio:disabled:checked + .k-radio-label:after {
    background-color: #1f7800;
    opacity: .5;
}

.k-radio:focus + .k-radio-label:before {
    border-color: #1f7800;
    box-shadow: none;
}

.k-webkit .k-pager-numbers .k-current-page .k-link:hover,
.k-ff .k-pager-numbers .k-current-page .k-link:hover,
.k-ie11 .k-pager-numbers .k-current-page .k-link:hover,
.k-safari .k-pager-numbers .k-current-page .k-link:hover,
.k-webkit .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view:hover,
.k-ff .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view:hover,
.k-ie11 .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view:hover,
.k-safari .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view:hover {
    border-color: #1f7800;
    background-image: none;
    background-image: none, linear-gradient(to bottom, #1f7800 0px, #1f7800 100%);
    background-color: #1f7800;
}

.k-chart .k-selection:hover {
    border-color: #1f7800;
    box-shadow: inset 0 0 20px rgba(31, 120, 0, 0.5);
}

.k-chart .k-handle {
    background-color: #c7c7c7;
    width: 1px;
}

    .k-chart .k-handle:hover {
        background-color: #1f7800;
        width: 3px;
        border-radius: 0px;
    }

.k-chart .k-navigator-hint .k-tooltip {
    border: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    background: #1f7800;
    color: #ffffff;
    border-radius: 0px;
}

.k-spreadsheet-filter:hover {
    color: #ffffff;
    background: #1f7800;
    border-color: #144f00;
}

.k-spreadsheet-window .k-edit-field > input[type="radio"]:checked + .k-orientation-label {
    background-image: none;
    background-color: #1f7800;
    color: #ffffff;
}

.k-spreadsheet-popup .k-button:hover {
    background-color: #1f7800;
}

.k-spreadsheet-popup .k-state-active {
    background-color: #7ea700;
    color: #000000;
}

.k-spreadsheet-popup .k-state-active:hover {
    background-color: #587400;
}

.k-pager-wrap .k-dropdown {
    width: 5em;
}
/* end kendo theme --------------------------------------------------- */

body {
    background-color: #fff;
    flex-direction: column;
    text-rendering: optimizeLegibility;
}

.hidden {
    display: none;
}

canvas {
    border: 2px solid #c0c0c0;
    display: block;
}

    canvas:focus, canvas:hover {
        border: 2px solid #007241;
    }

        canvas:active, canvas:focus:hover {
            border: 2px solid #00af64;
        }

h1 {
    display: inline-block;
    font-size: 30pt;
    font-weight: normal;
}

header {
    min-width: 0 !important;
}

/**
#modal-back-button {
    float: left;
    margin-left: 7px;
}

.k-window-title {
    position: relative;
}

/*
legend {
    border: 1px solid #000000;
    font-family: "Museo Sans Condensed", Verdana, Tahoma, Geneva, sans-serif;
    padding: 20px;
    font-weight: bold;
}*/

.log {
    float: right;
}

option {
    font-family: "Museo Sans Display", "Courier New", Courier, Monaco, monospace;
    margin: 0px;
    padding: 0px 0px 0px 10px;
}

select {
    background: #ffffff;
    border: 2px solid #c0c0c0;
    font-weight: normal;
    padding: 10px;
    width: 224px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    select:invalid {
        border: 2px solid #a60000;
        color: #a60000;
    }

.bold {
    font-weight: bold;
}

a:focus, a:hover {
    color: #fff;
}

.topValueCellRow > td {
    border: 1px solid black;
}

.notTopValueCellRow > td {
    border: 1px solid black;
}

.border-all {
    border: 1px solid #000000 !important;
}



.border-bottom {
    border-bottom: 1px solid #000000 !important;
}

.border-bottom-none {
    border-bottom: none !important;
}

.border-left {
    border-left: 1px solid #000000 !important;
}

.border-right {
    border-right: 1px solid #000000 !important;
}

.border-right-none {
    border-right: none !important;
}

.border-top {
    border-top: 1px solid #000000 !important;
}

.center {
    text-align: center;
}

.data {
    font-family: "Museo Sans Display", "Courier New", Courier, Monaco, monospace;
}

.label {
    font-family: "Museo Sans Condensed", Verdana, Tahoma, Geneva, sans-serif;
}

.large {
    font-size: large;
}

.padding-bottom-5 {
    padding-bottom: 5px !important;
}

.padding-none {
    padding: 0px !important;
}

.red {
    color: #ff0000;
}

.required {
    font-weight: bold;
    text-align: right;
    width: 200px;
}

.right {
    float: right;
    margin: 0px 0px 5px 0px;
    text-align: right;
}

    .right:last-of-type {
        margin: 0px;
    }

    .right > input[type=button] {
        margin: 0px;
        padding: 5px;
    }

.separator {
    background: #c0c0c0;
    border: 1px solid #000000;
    height: 5px;
}

.shaded {
    background: #dddddd;
}

.small {
    font-size: small;
}

.top {
    vertical-align: top;
}

.width-15 {
    width: 15%;
}

.width-20 {
    width: 20%;
}

.width-25 {
    width: 25%;
}

.width-30 {
    width: 30%;
}

.width-35 {
    width: 35%;
}

.width-40 {
    width: 40%;
}

.width-45 {
    width: 45%;
}

.width-50 {
    width: 50%;
}

.width-60 {
    width: 60%;
}

.width-80 {
    width: 80%;
}

.width-100 {
    width: 100%;
}

.xx-large {
    font-size: xx-large;
}

#content {
    color: #000;
    width: 98%;
    min-width: 1170px;
    margin-right: 1%;
    margin-left: 1%;
}

#footer {
    margin: 10px auto 10px auto;
}

#runticket {
    border: 1px solid #000000;
}

    #runticket > table {
        border: none;
        margin: 0px;
    }

        #runticket > table > tbody > tr {
            background: #ffffff;
        }

            #runticket > table > tbody > tr > td {
                padding: 5px;
            }

fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}

#runTicketsContent td, #runTicketsContent th {
    font-size: 14px;
}

textarea {
    min-height: 75px;
}

select {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
}
/*
#runticket > table > tbody > tr > td:first-child {
    padding-left: 0px;
}*/

#runticket > table > tbody > tr > td:last-child {
    border-right: none;
    padding-right: 0px;
}

.display-label,
.editor-label {
    margin: 1em 0 0 0;
}

.display-field,
.editor-field {
    margin: 0.5em 0 0 0;
}

/*I added the text box color as black so that highlighted rows in kendo grids wouldn't show white text. Not sure if this is going to have bad side effects on the rest of the site. TK needs to review*/
.text-box {
    width: 30em;
    color: black;
}


    .text-box.multi-line {
        height: 6.5em;
    }

.tri-state {
    width: 6em;
}


#topStatusBar {
    display: block;
    border-bottom: 1px solid #999;
    padding: 3px 8px;
    font-size: 14px;
    color: #000;
    background-color: #ffe699;
}

.k-widget.k-menu,
.k-menu .k-group.k-popup {
    border: none;
}

.k-item {
    border-right: none !important;
}

.k-grouping-header {
    background-color: #f5f5f5 !important;
    color: #333 !important;
}

    .k-grouping-header .k-link {
        padding-top: 7px;
    }

.k-pager-wrap {
    background-color: #f5f5f5 !important;
    color: #333 !important;
}

.k-grid .k-alt {
    background-color: #f1efef; /* specify the alternate background-color */
}

.gridHeader, .detailHeader {
    /*border-top-left-radius: 7px;
    border-top-right-radius: 7px;*/
    width: 100%;
    /*height: 40px;*/
    color: white;
    background: rgb(70, 70, 70); /* Old browsers */
    padding-bottom: 10px;
    padding-left: 5px;
    padding-top: 10px;
    display: inline-block;
}

.detailHeader {
    width: 98%;
    margin: auto;
}

.detailHeaderButtons {
    float: right;
    margin-top: 8px;
    margin-right: 5px;
}

.propertiesTable {
    width: 100%;
}

.leftProperties, .rightProperties {
    width: 100%;
}

.propertyRow, .gridRow {
    vertical-align: middle;
    min-height: 40px;
    max-height: 90px;
    height: 40px;
    background-color: white;
}

.propertyRow th, .gridRow th {
    text-align: left;
    vertical-align: middle;
    padding-left: 5px;
}

.headerRow {
    vertical-align: central;
    max-height: 90px;
    height: 40px;
    font-weight: bold;
    background-color: wheat;
}

.alternate {
    background-color: rgb(241, 239, 239);
}

tr.propertyRow td {
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 8px;
    padding-top: 10px;
}

tr.gridRow td {
    vertical-align: top;
    padding: 10px 5px 10px 5px;
}

.propertyValue select {
    width: 95%;
}

.propertyValueWide textarea {
    height: 200px;
    width: 98.4%;
    margin-top: 0px;
}

.propertyRowSubcontainer {
    display: table-cell;
    vertical-align: middle;
}

.propertyName, .propertyValue {
    word-wrap: break-word;
}

.propertyName {
    width: 180px;
    text-align: right;
    padding-right: 10px;
    color: #000000; /*I changed this from grey to black - Ado 1/25/2017*/
}

.propertyValue {
    width: 200px;
    text-align: left;
}

.propertyValue textarea {
    margin-top: 10px;
    margin-bottom: 10px;
}

.field-validation-error {
    font-weight: bold;
    color: red;
}

.modalContainer {
    float: left;
    clear: both;
    width: 780px;
    margin: 5px 0 5px 10px;
}

.modalSubContainer {
    color: #000000;
    color: rgba(0,0,0,1);
    background-color: rgb(70, 70, 70);
    margin: auto;
    width: 760px;
}


.gridContainer, .detailContainer {
    color: #000000;
    color: rgba(0,0,0,1);
    background-color: rgb(70, 70, 70);
    margin: auto;
}


.gridSubContainer, .detailSubContainer {
    padding: 0 5px 5px 5px;
    color: #000000;
    color: rgba(0,0,0,1);
    background-color: rgb(70, 70, 70);
}

.gridHeader > h2, .detailHeader > h2 {
    padding-top: 5px;
    margin-left: 20px;
    float: left;
}


.gridHeaderButtons {
    float: right;
    margin-top: 5px;
    margin-right: 20px;
}

.gridHeaderButtons .k-button {
    margin: 2px;
}

#content .k-grid .export {
    float: right;
}

.modallink.buttonlink.extra-toolbar-buttons.k-button.k-button-icontext {
    margin-right: 25px;
}

.ticketlink {
    text-decoration: underline !important;
    font-weight: bold;
    color: #1f7800;
}

a.detaillink,
a.detaillink:visited,
a.detaillink:active,
a.detaillink:hover {
    color: #105f93;
}

td.number {
    text-align: right;
}

body.gray {
    background-color: rgb(160, 160, 160);
}

.valign {
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

#header h1 {
    color: #ffffff;
}

#header {
    flex: auto 0 0;
    padding: 10px 0px 10px 5px;
    align-items: flex-end;
    justify-content: space-between;
    text-align: left;
    margin: 0 auto 0 auto;
    background: #2a2d33; /* Old browsers */
}

.k-widget.k-grid {
    /*    border: 0; */
    margin-top: 1px;
}

.loginContainer {
    width: 280px;
    height: auto;
    padding: 15px;
    border: 1px white solid;
    margin: auto;
}

.loginContainer .hrdiv {
    margin: 10px 0;
    width: 100%;
}

.loginContainer hr {
    border: none;
    height: 1px;
}

    .loginContainer input[type="text"],
    .loginContainer input[type="password"] {
        width: 98%;
    }

.darkcolor {
    background-color: rgb(70, 70, 70);
}

.loginContent {
    max-width: 100%;
    min-width: 200px;
}

    .loginContent label {
        font-size: 11px;
    }

.inputfield {
    margin: 5px 0;
}


.darkaccent {
    color: black;
    background-color: black;
}

.lightaccent {
    color: rgb(140, 140, 140);
    background-color: rgb(140, 140, 140);
}

.companySharingContainer {
    width: 490px;
    height: 121px;
    padding: 5px;
}

.authContainer {
    width: 350px;
    height: 90px;
    padding: 10px 15px 5px 15px;
}

.authContainer .hrdiv {
    margin: 3px 0 10px 0px;
    width: 100%;
}

.authContainer hr {
    border: none;
    height: 1px;
}

.userDetailContainer {
    margin-left: 5px;
    color: white;
    padding: 10px 15px 5px 15px;
}

.userDetailContainer .hrdiv {
    margin: 3px 0 10px 0px;
    width: 100%;
}

.userDetailContainer hr {
    border: none;
    height: 1px;
}

.detailSaveButton {
    float: right;
    height: 33px;
    width: 80px;
    text-align: center;
    flex-direction: inherit;
}

.datePicker {
    color: black;
}

.k-grid-header .k-header {
    overflow: visible;
    white-space: normal;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-header-errors {
    font-weight: bold !important;
    color: #ff0000 !important;
    height: auto !important;
}

.validation-summary-valid {
    display: none;
}

#tooltipContainer {
    margin-bottom: 15px;
}

.inputfield a {
    color: #FFFFFF;
    font-size: 11px;
    text-decoration: none;
}

    .inputfield a:hover {
        color: #cccccc;
    }

.modal-buttonlink {
    color: gray;
    background-color: whitesmoke;
    box-sizing: border-box;
    overflow: visible;
    cursor: pointer;
    margin: 0px;
    line-height: 1.66em;
    background-repeat: repeat;
    display: inline-block;
    box-sizing: border-box;
    border-color: gray;
    border-style: groove;
    border-width: thin;
    padding: 2px 12px;
    font-size: 13px;
    font-family: inherit;
    text-rendering: optimizeLegibility;
    flex-direction: column;
    text-decoration: none;
    vertical-align: middle;
    border-radius: 5px;
}

.modal-buttonlink:hover {
    background-color: rgb(200, 200, 200);
}

.detail-form-heading {
    font-size: 1.75em;
}

.detail-form-subheading {
    font-size: 0.75em;
}

.detail-actions {
    float: right;
    margin-bottom: 10px;
    /* we add a negative margin in the container div and positive margin in each item (css rule below)
       so the first line will have no margin from the top of the screen and the line that were broken
       will have some margin from the line above */
    margin-top: -5px;
}

.detail-actions .enabled-grid-button {
    display: inline-block;
    white-space: nowrap; /* stop link from being broken in 2 lines */
    margin-top: 5px; /* explanation in the rule above */
}

.detail-actions span {
    margin: 10px;
}

.detail-form {
margin: 30px;
border-collapse: collapse;
}

.detail-form tbody {
    border-bottom: 30px solid transparent;
}

.detail-form tr {
    border-bottom: 10px solid transparent;
}

.detail-form .label {
    text-align: right;
    padding-right: 20px;
    vertical-align: top;
}

.enabled-grid-button {
    background: #1f7800;
    background: -moz-linear-gradient(top,#1f7800 0%,#1f7800 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#1f7800), color-stop(100%,#1f7800));
    background: -webkit-linear-gradient(top,#1f7800 0%,#1f7800 100%);
    background: -o-linear-gradient(top,#1f7800 0%,#1f7800 100%);
    background: -ms-linear-gradient(top,#1f7800 0%,#1f7800 100%);
    background: linear-gradient(top,#1f7800 0%,#1f7800 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f7800',endColorstr='#1f7800',GradientType=0);
    padding: 6px 6px;
    color: #fff;
    font-family: 'Helvetica',sans-serif;
    font-size: 15px;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border: 1px solid #1A356E;
}

.enabled-grid-button-rejected {
    background: #A40000;
    background: -moz-linear-gradient(top,#A40000 0%,#A40000 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#A40000), color-stop(100%,#A40000));
    background: -webkit-linear-gradient(top,#A40000 0%,#A40000 100%);
    background: -o-linear-gradient(top,#A40000 0%,#A40000 100%);
    background: -ms-linear-gradient(top,#A40000 0%,#A40000 100%);
    background: linear-gradient(top,#A40000 0%,#A40000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A40000',endColorstr='#A40000',GradientType=0);
    padding: 6px 6px;
    color: #fff;
    font-family: 'Helvetica',sans-serif;
    font-size: 15px;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border: 1px solid #1A356E;
}

.disabled-grid-button {
    background: #e0e0e0;
    background: -moz-linear-gradient(top,#e0e0e0 0%,#e0e0e0 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#e0e0e0), color-stop(100%,#e0e0e0));
    background: -webkit-linear-gradient(top,#e0e0e0 0%,#e0e0e0 100%);
    background: -o-linear-gradient(top,#e0e0e0 0%,#e0e0e0 100%);
    background: -ms-linear-gradient(top,#e0e0e0 0%,#e0e0e0 100%);
    background: linear-gradient(top,#e0e0e0 0%,#e0e0e0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0',endColorstr='#e0e0e0',GradientType=0);
    padding: 6px 6px;
    color: #778899;
    font-family: 'Helvetica',sans-serif;
    font-size: 15px;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border: 1px solid #1A356E;
}

.content-section {
    color: black;
    background-color: #EEEEEE;
    padding: 10px;
}

    .content-section h1 {
        margin-bottom: 10px;
        display: block;
    }

.valign_bottom {
    vertical-align: bottom;
}

.spaced_table td {
    padding: 10px;
}

.propertiesTable td {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    background-color: white;
}

.propertiesTable tr.alternate td {
    background-color: rgb(241, 239, 239);
}

.ui-slider-handle.ui-state-active {
    z-index: 3;
}

.wrap-word {
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    white-space: -webkit-pre-wrap; /*Chrome & Safari */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: pre-wrap; /* css-3 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    /*    word-break: break-all; */
    white-space: normal;
}

.table-wrap-word {
    table-layout: fixed;
    word-wrap: break-word;
}

.statusRed {
    color: red;
}

.statusBlack {
    color: black;
}

.statusGreen {
    color: forestgreen;
}

.grid-search {
    float: right;
}

* {
    border-radius: 0 !important;
}

.panel-heading {
    min-height: 30px;
}

.panel-heading h2 {
    font-size: 28px;
    display: inline;
    margin-right: 15px;
}

input.date-picker {
    width: 130px;
}

.k-input, .k-multiselect-wrap, .k-textbox > input, input.k-textbox, input.k-textbox:hover:not([readonly]), textarea.k-textbox, textarea.k-textbox:hover /*, .k-button:not(.k-primary)*/ {
    color: #000;
}

.k-button:not(.k-primary):hover {
    color: #fff;
    border-color: #fff;
}

.k-primary:hover {
    border-color: #fff;
}

.no-margin-left-right {
    margin-left: 15px;
    margin-right: 15px;
}

/* Bootstrap  Overrides */

.container {
    padding-right: 0;
    padding-left: 0;
}

.panel-default > .panel-heading {
    background-color: #00648b;
    color: #fff;
}

.panel-grid {
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.panel-grid-modal {
    padding: 0;
}

.panel {
    margin-bottom: 0px;
}

    .panel.panel-default {
        margin-top: 10px;
    }

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding-right: 7px;
    padding-left: 7px;
}

.label {
    color: #000;
    white-space: normal;
}

.k-window-container .row {
    margin-left: 0;
}

.k-window-container {
    width: 765px;
}

.additionalInfoLabel {
    text-align: left;
    font-weight: normal;
    font-style: italic;
    font-size: .85em;
}

/* Kendo Overrides*/
.fill-horizontal-anchor {
    display: block;
    text-align: center;
}

.k-block, .k-content, .k-dropdown .k-input, .k-popup, .k-toolbar, .k-widget, .k-grid-header .k-header > .k-link, .k-header, .k-treemap-title {
    color: #000;
}

.k-space-right .k-icon {
    right: 7px;
}

.k-draghandle.k-state-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list > .k-state-highlight, .k-list > .k-state-selected, .k-marquee-color, .k-panel > .k-state-selected, .k-scheduler .k-scheduler-toolbar .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-state-selected, .k-state-selected:link, .k-state-selected:visited,
.k-state-selected.k-alt {
    color: #fff;
    background-color: #1f7800;
    border-color: #1f7800;
}

.k-grid table tr:hover td {
    background-color: #8badc6 !important;
}

.k-state-hover,
.k-state-hover:hover,
.k-splitbar-horizontal-hover:hover,
.k-splitbar-vertical-hover:hover,
.k-list > .k-state-hover,
.k-scheduler .k-scheduler-toolbar ul li.k-state-hover,
.k-pager-wrap .k-link:hover,
.k-dropdown .k-state-focused,
.k-filebrowser-dropzone,
.k-mobile-list .k-item > .k-link:active,
.k-mobile-list .k-item > .k-label:active,
.k-mobile-list .k-edit-label.k-check:active,
.k-mobile-list .k-recur-view .k-check:active {
    color: #fff;
    background-color: #00648b;
    border-color: #00648b;
}

.panel-heading input.k-textbox, .panel-heading input.k-button, .panel-heading button.k-button, .panel-heading a.k-button,
.k-header.k-grid-toolbar.k-grid-top > a.k-button {
    height: 30px;
    font-size: 14px;
    padding-top: 3px;
}

    .k-header.k-grid-toolbar.k-grid-top > a.k-button.fa {
        padding-top: 7px !important;
    }

.k-header.k-grid-toolbar.k-grid-top {
    min-height: 30px;
    padding: 5px;
}

.k-grouping-header {
    height: 16px;
    padding-top: 8px;
    font-size: 12px;
}

.k-group-indicator {
    height: 12px;
    font-size: 12px;
    margin-top: 2px;
    background-color: #00648b;
}

    .k-group-indicator .k-link {
        margin-top: -15px;
        color: #fff;
    }

    .k-group-indicator .k-button .k-group-delete {
        margin-top: -10px;
    }

.k-list-container .k-list .k-item {
    padding-right: 25px;
}

.k-list {
    background-color: #fff;
}

.k-grid-filter.k-state-active {
    background-color: #1f7800;
}

.panel-heading span.k-dropdown, .panel-heading span.k-dropdown-wrap {
    height: 30px;
}

.k-dropdown-wrap .k-input {
    line-height: 1.6em;
}

[data-role="popup"] ul li[class="k-item"] {
    color: #000;
}

[data-role="popup"] ul li[class="k-item k-state-hover"], [data-role="popup"] ul li[class="k-item k-state-selected k-state-focused"],
.k-dropdown .k-state-focused > .k-input {
    color: #fff;
}

.div-not-visible {
    display: none;
}

.div-visible {
    display: block;
}

.table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
    border: 1px solid #000;
}

.table > tbody + tbody {
    border-top: none;
}

.break-word-cell {
    word-wrap: break-word;
    max-width: 200px;
}

.k-window-titlebar.k-header {
    margin-top: -40px !important;
    background-color: #00648b;
    color: white;
}

.k-window-titlebar .k-i-close {
    background-position-x: -48px;
}

.k-window-titlebar .k-i-popout {
    background-position-x: -16px;
}

/* Main menu --------------------------------------------------- */
/* old css had this note:   TODO: Clean Up Menu */
#MainMenu {
    background-color: #f5f5f5;
    border: none;
}

    #MainMenu > li > .k-link {
        line-height: 1em;
    }

#MainMenu, #MainMenu .k-link:link,
#MainMenu .k-link:visited,
.k-item.k-state-default {
    color: black;
}

#MainMenu .k-popup .k-item.k-state-default .k-link {
    color: #fff;
}

#MainMenu .k-link:hover {
    background-color: #00648b;
    border-color: #00648b;
    color: #fff;
}

#MainMenu .k-link.k-state-active.k-state-border-down {
    background-color: #00648b;
    color: #fff;
}

#MainMenu > li.k-item.k-state-highlight.k-state-default {
    background-color: #00648b;
}

#MainMenu .k-item.k-state-highlight > .k-link,
#MainMenu .k-item.k-state-selected.k-state-default > .k-link {
    color: white;
}

#mainMenuWrapper {
    background-color: #f5f5f5;
    border-bottom: 3px solid #00648b;
    display: flex !important;
    flex: 1 1 auto;
    flex-direction: row;
    justify-content: space-between;
}

#userMenu {
    background-color: #f5f5f5;
    white-space: nowrap;
    display: flex;
    flex: 0 0 auto;
}

    #userMenu > li:first-child > span.k-link {
        max-width: 300px;
        min-width: 152px;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1em;
    }

        #userMenu > li:first-child > span.k-link.k-state-active {
            color: #fff;
        }

    #userMenu > li > .k-animation-container,
    #userMenu > li > .k-animation-container > .k-group {
        background-color: #00648b;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        left: auto !important;
        right: 0 !important;
        top: auto !important;
        /* the "!important" statements are here to override the element style applied by kendo */
    }

    #userMenu .k-popup .k-item .k-link {
        color: #fff;
        padding: 5px 10px;
    }

    #userMenu .k-link.k-state-active.k-state-border-down {
        background-color: #00648b;
    }

/* menu as drawer */
#mainMenuWrapper .k-icon.k-i-menu {
    cursor: pointer;
    margin: 10px 0 10px 10px;
    /* use full size icons for the menu */
    width: 32px;
    height: 32px;
    background-size: 680px 672px;
    /* set up the drawer icon */
    background-position: -128px -64px;
}

    #mainMenuWrapper .k-icon.k-i-menu.is-mobile {
        display: block;
    }

#logo {
    max-height: 28px !important;
    margin-top: 12px !important;
}

#MainMenu.is-mobile {
    display: none;
    width: 100%;
}

#MainMenu.visibleMainMenu {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 55px;
    z-index: 10;
    display: flex;
    bottom: 0;
    flex-direction: column;
    overflow: auto;
    flex: 1 1 auto;
}

#mainMenuOverlay {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: black;
    opacity: 0.5;
    z-index: 9 /*main menu is 10*/;
}

    #mainMenuOverlay.visibleMainMenu {
        display: block;
    }

@media screen and (max-width: 1024px) {
    #mainMenuWrapper .k-icon.k-i-menu:not(.is-mobile) {
        display: block;
    }

    #MainMenu:not(.visibleMainMenu):not(.is-mobile) {
        display: none;
    }
}

#mainMenuWrapper .k-icon.k-i-menu.is-empty {
    display: none !important;
}

@media screen and (max-width: 1366px) and (min-width: 1025px) {

    #MainMenu {
        display: flex;
        flex-wrap: wrap;
    }

        #MainMenu li.k-item > .k-link {
            padding: 20px 10px 20px 10px; /* This makes more menu items fit into that kind of mid-sized screen */
        }
}


@media screen and (min-width: 768px) {
    #MainMenu.visibleMainMenu {
        max-width: 400px; /* This makes the menu visible only on a small part of the left side for screens that are big enough to fit */
    }

    #userMenu > li:first-child > span.k-link {
        max-width: 300px;
    }
}

@media screen and (max-width: 415px) {
    #mainMenuWrapper {
        flex-wrap: wrap; /* For smaller screens (specially for phones on upright position) wrap the logo and user menu*/
    }

    #userMenu > li:first-child > span.k-link {
        max-width: 182px;
        min-width: 80px;
    }

    #userMenu > li > .k-animation-container,
    #userMenu > li > .k-animation-container > .k-group {
        max-width: 220px !important;
    }

    #logoWrapper {
        /* Hide the RtChex part of the logo to gain more space for the userMenu*/
        max-width: 40px;
        overflow: hidden;
    }
}