:root {
    --nutun-blue-primary: #001e2c;
    --nutun-blue-primary-lighten: #002d43;
    --nutun-blue-primary-darken: #001a27;
    --nutun-cyan-primary: #008263;
    --nutun-cyan-primary-lighten: #009471;
    --nutun-cyan-primary-darken: #007559;
    --nutun-cyan-secondary: #00b495;
    --nutun-cyan-secondary-lighten: #00c4a2;
    --nutun-cyan-tertiary: #00ffd2;
    --nutun-cyan-tertiary-lighten: #0cfed4;
    --nutun-green-primary: #138200;
    --nutun-green-primary-lighten: #159400;
    --nutun-green-primary-darken: #117500;
    --nutun-green-secondary: #13b400;
    --nutun-green-secondary-lighten: #14c400;
    --nutun-green-tertiary: #1ee600;
    --nutun-green-tertiary-lighten: #1ff400;
    --nutun-gradient-start: #52ffcf;
    --nutun-gradient-end: #4df14c;
    --nutun-gradient-start-lighten: #63ffd3;
    --nutun-gradient-end-lighten: #5ef25d;
    --nutun-gradient-start-darken: #00d79b; /*#0effbc;*/
    --nutun-gradient-end-darken: #0fbb0e; /*#13eb12;*/
    /*******/
    --nutun-magenta-neon: #ff03a9;
    --nutun-magenta-neon-darken: #e80098;
    --nutun-amber-neon: #ebb700;
    --nutun-amber-neon-darken: #d3a400;
    --nutun-green-neon: #1ee600;
    --nutun-turquise-neon: #00ffd2;
    --nutun-gray-dark: #707070;
    --nutun-gray-light: #c0c0c0;
}

body {
    background-color: #ffffff;
    font-family: "Sora", Arial, sans-serif;
    font-weight: 300;
    font-size: 11px;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
}

button,
input[type=submit],
input[type=button],
input[type=reset] {
    border: 1px solid var(--nutun-blue-primary);
    font-weight: 500 !important;
    padding: 2px 2px;
    background: linear-gradient(113deg, var(--nutun-gradient-start) 0%, var(--nutun-gradient-end) 100%) !important;
    color: #000000;
}

    button:hover,
    input[type=submit]:hover,
    input[type=button]:hover,
    input[type=reset]:hover,
    button:focus,
    input[type=submit]:focus,
    input[type=button]:focus,
    input[type=reset]:focus {
        border: 1px solid var(--nutun-blue-primary-darken);
        font-weight: 500 !important;
        padding: 2px 2px;
        background: linear-gradient(113deg, var(--nutun-gradient-start-darken) 0%, var(--nutun-gradient-end-darken) 100%) !important;
        color: #ffffff;
    }

    button:disabled,
    input[type=submit]:disabled,
    input[type=button]:disabled,
    input[type=reset]:disabled {
        border: 1px solid var(--nutun-blue-primary-lighten);
        color: var(--nutun-gray-dark) !important;
        background: var(--nutun-gray-light) !important;
    }

label {
    padding: 3px 3px;
}

input[type=text],
input[type=password] {
    border-width: 1px !important;
    border-style: solid !important;
    padding: 2px 2px;
}

input[type=text]:focus,
input[type=password]:focus {
    border-width: 2px !important;
    border-style: solid !important;
    border-color: var(--nutun-blue-primary) !important;
    padding: 2px 2px;
}

input:disabled {
    color: #AAAAAA;
}

select:disabled {
    color: #AAAAAA;
}

a[disabled] {
    color: #BBBBBB;
}

.MainMenuRow {
    text-indent: 10px;
    background-color: var(--nutun-blue-primary);
    padding: 0;
}

.StaticMenuItem {
    color: White;
    height: 20px;
    font-weight: bold;
}

.DynamicMenuItem {
    color: #ffffff;
    width: 255px;
    height: 20px;
    background-color: var(--nutun-blue-primary);
    padding: 2px 0;
}

.DynamicMenuItem:disabled {
    cursor: not-allowed !important;
    color: var(--nutun-gray-light) !important;
}

.DynamicMenuItem:hover:not([disabled]) {
    background-color: var(--nutun-blue-primary-lighten);
    color: var(--nutun-green-tertiary);
}

.DynamicMenuItem:hover img:hover {
    background-color: white;
    color: var(--nutun-green-tertiary);
    border-radius: 50%;
}

.DynamicMenuItem:hover img {
    background-color: white;
    color: var(--nutun-green-tertiary);
    border-radius: 50%;
}

/* IE 8 Fix */
.DynamicMenuStyle {
    z-index: 1000;
    background-color: var(--nutun-blue-primary);
}

.DynamicHoverStyle {
    color: White;
    width: 255px;
    height: 20px;
    background-color: var(--nutun-blue-primary-lighten);
}

.PageHeader {
    vertical-align: middle;
    font-size: 3em;
    font-weight: bold;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    color: var(--nutun-blue-primary);
    text-align: center;
}

.SystemHeader {
    vertical-align: top;
    font-size: 18px;
    font-weight: bold;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    color: var(--nutun-blue-primary);
    text-align: center;
}

.PageSubHeader {
    vertical-align: middle;
    font-size: 14px;
    font-weight: bold;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    color: var(--nutun-blue-primary);
    text-align: center;
}

.HeaderSignedIn {
    vertical-align: middle;
    font-size: 10px;
    font-style: italic;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    text-align: right;
}

.HeaderSupport {
    vertical-align: middle;
    font-size: 10px;
    font-weight: normal;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    text-align: right;
}

.PageFooter {
    vertical-align: middle;
    font-size: 10px;
    font-weight: normal;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    text-align: center;
}

.FormFooter {
    vertical-align: middle;
    font-size: 12px;
    font-weight: normal;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    color: var(--nutun-blue-primary);
    text-align: center;
}

.FormHeader {
    vertical-align: middle;
    text-indent: 2px;
    font-size: 11px;
    font-weight: bold;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    color: #ffffff;
    line-height: 20px;
    background-color: var(--nutun-blue-primary); /* fallback for old browsers */
}

.FormHeader2 {
    vertical-align: middle;
    text-align: center;
    font-size: 9pt;
    height: 20px;
    font-weight: bold;
    word-spacing: normal;
    letter-spacing: normal;
    text-transform: none;
    color: #FFFFFF;
    background-color: var(--nutun-blue-primary);
    line-height: 16px;
}

.FormLabel {
    font-size: 11px;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
}

.FormLabelReqd {
    font-size: 11px;
    font-weight: bold;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
}

.TableLabelHint {
    color: #222222;
    font-size: 10px;
}

.TextInput {
    border-width: 1px !important;
    border-style: solid !important;
    height: auto;
    font-size: 11px;
    width: -webkit-fill-available;
}

.TextInput:focus {
    border-width: 1px !important;
    border-style: solid !important;
    border-color: var(--nutun-blue-primary) !important;
    width: stretch;
}

.clsButton {
    background: linear-gradient(113deg, var(--nutun-gradient-start) 0%, var(--nutun-gradient-end) 100%) !important;
    color: #000000;
    height: auto;
    width: 105px;
    font-size: 11px;
}

.clsButton:disabled {
    border-color: var(--nutun-blue-primary-lighten) !important;
    color: var(--nutun-gray-dark) !important;
    background: var(--nutun-gray-light) !important;
}

.clsWarning {
    background-color: var(--nutun-amber-neon) !important;
    color: #000000;
    height: auto;
    width: 105px;
    font-size: 11px;
}

.clsWarning:disabled {
    border-color: var(--nutun-blue-primary-lighten) !important;
    color: var(--nutun-gray-dark) !important;
    background: var(--nutun-gray-light) !important;
}

.DropDown {
    background-color: #ffffff;
    height: auto;
    font-size: 11px;
    color: var(--nutun-blue-primary);
}

table {
    font-size: 11px;
    font-weight: normal;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
}

a {
    color: var(--nutun-blue-primary);
}

.LinkHeader {
    color: #ffffff;
}

.HighlightRow {
    background-color: #F0F0F0;
}

.LowlightRow {
    background-color: #ffffff;
}

.MouseOverRow {
    background-color: silver;
}

.lblError {
    color: Red;
    font-weight: bold;
}

.lblSuccess {
    color: Green;
}

.lblNotice {
    color: Teal;
}

.smallgrey {
    color: #999999;
}
/* Shaded field items */
.shaded {
    CURSOR: default;
    color: #000000;
    font-size: 13pt;
    font-weight: normal;
    background-color: var(--nutun-green-tertiary);
    text-align: center;
    width: 1.5rem;
}
/* Shaded field items */
.shadedlarge {
    color: #000000;
    font-size: 13pt;
    font-weight: normal;
    background-color: var(--nutun-green-tertiary);
    text-align: center;
    width: 1.5rem;
}
/* Shaded field items */
.shadedbold {
    font-family: Arial;
    color: #000000;
    font-size: 13pt;
    font-weight: bold;
    background-color: var(--nutun-green-tertiary);
    text-align: center;
    width: 1.5rem;
}

.shadedlarge:disabled {
    background-color: var(--nutun-gray-light);
    color: #000000;
}

.shaded:disabled, .shadedbold:disabled {
    color: #000000;
}

.QueryWindow {
    background-color: #f5f4f4;
    font-weight: bold;
    font-size: 11px;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
}

.HiddenControls {
    display: none;
    visibility: hidden;
}

.WaitLabel {
    background-color: #CFDBF3;
    text-align: center;
    font-size: large;
    font-weight: bold;
    font-style: italic;
}

.overlay {
    position: fixed;
    z-index: 99;
    top: 0px;
    left: 0px;
    background-color: #FFFFFF;
    width: 100%;
    height: 100%;
    filter: Alpha(Opacity=70);
    opacity: 0.70;
    -moz-opacity: 0.70;
}

* html .overlay {
    position: absolute;
    height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
    width: expression(document.body.scrollWidth > document.body.offsetWidth ? document.body.scrollWidth : document.body.offsetWidth + 'px');
}

.loader {
    z-index: 100;
    position: fixed;
    width: 120px;
    margin-left: -60px;
    top: 50%;
    left: 50%;
}

* html .loader {
    position: absolute;
    margin-top: expression((document.body.scrollHeight / 4) + (0 - parseInt(this.offsetParent.clientHeight / 2) + (document.documentElement && document.documentElement.scrollTop || document.body.scrollTop)) + 'px');
}

.loginCap div, .loginCap img {
    height: 35px !important;
    width: 141px !important;
}

:focus-visible {
    outline: none;
    /*outline: -webkit-focus-ring-color auto 1px;*/
    /*outline-color: -webkit-focus-ring-color;
	outline-style: auto;
	outline-width: 1px;*/
}

.vCenter {
    vertical-align: middle;
}

.ajax__calendar .ajax__calendar_disabled .ajax__calendar_day {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
    color: var(--nutun-magenta-neon) !important;
}

.ajax__calendar .ajax__calendar_active .ajax__calendar_day {
    color: var(--nutun-blue-primary) !important;
    background-color: var(--nutun-green-tertiary) !important;
    font-weight: 500 !important;
}

.ajax__calendar .ajax__calendar_other .ajax__calendar_day {
    color: var(--nutun-blue-primary) !important;
}

.ajax__calendar_day {
    color: var(--nutun-blue-primary) !important;
}

td.ajax__calendar_hover .ajax__calendar_day, td.ajax__calendar_hover div.ajax__calendar_month, td.ajax__calendar_hover div.ajax__calendar_year {
    border-color: var(--nutun-gray-light) !important;
    background-color: transparent !important;
    color: var(--nutun-blue-primary-darken) !important;
    font-weight: 500 !important;
}

td.ajax__calendar_active .ajax__calendar_day, td.ajax__calendar_active div.ajax__calendar_month, td.ajax__calendar_active div.ajax__calendar_year {
    color: var(--nutun-blue-primary) !important;
    border-block-color: var(--nutun-blue-primary) !important;
    background-color: var(--nutun-green-tertiary) !important;
    font-weight: 500 !important;
}

td.ajax__calendar_disabled div.ajax__calendar_month, td.ajax__calendar_disabled div.ajax__calendar_year {
    background-color: transparent !important;
    color: var(--nutun-gray-light) !important;
    font-weight: 500 !important;
}

div.ajax__calendar_hover .ajax__calendar_title {
    color: var(--nutun-green-tertiary) !important;
}

table.DynamicMenuItem td img {
    background-color: white;
    border-radius: 50%;
}

select:focus option:checked,
select:focus option::selection {
    background-color: var(--nutun-green-tertiary) !important;
}

select option:checked,
select option::selection {
    background-color: var(--nutun-green-tertiary) !important;
}

select option:hover {
    background-color: var(--nutun-green-tertiary-lighten) !important;
}

.pagination {
    color: #000000;
    display: inline-block;
    font-size: 9pt;
    padding-top: 0.1rem;
    text-align: center;
    width: 1.2rem;
    height: 1.1rem;
    vertical-align: middle;
    border-radius: 0.2rem;
    border-color: transparent;
    border-style: solid;
    border-width: 1px;
    text-decoration: none;
}

a.pagination:hover {
    border-color: var(--nutun-blue-primary-lighten);
}

a.pagination.nav-direction {
    cursor: pointer;
    width: 30px;
}

a.pagination.nav-direction:hover {
    /*border-color: transparent !important;*/
    cursor: pointer;
}

span.pagination.nav-direction {
    cursor: no-drop;
    margin: 0 0.4rem;
}

.pagination.page-current {
    font-weight: 600;
    color: var(--nutun-green-tertiary) !important;
    cursor: no-drop;
    border: 1px solid var(--nutun-blue-primary-lighten) !important;
    background-color: var(--nutun-blue-primary);
}

.pagination-img {
    margin: 0 0.2rem;
    height: 0.75rem;
    cursor: pointer;
}