﻿/* font settings */

@font-face {
    font-family: 'Khmer-OS-Content';
    src: url(Khmer_OS_Content.TTF);
}

body,
table,
select,
input,
textarea {
    font-family: 'Open Sans', sans-serif, 'Khmer-OS-Content';
    font-size: 10pt;
    color: #000000;
}

a,
a span {
    text-decoration: underline;
}

/* default settings for HTML elements */

body {
    background-color: white;
    margin: 0px 0px 0px 0px;
}

img {
    border: none;
}

/* fields */

.field-caption {
    font-weight: normal;
    font-size: 10pt;
    color: #666666;
}

.field-error input,
.field-error select,
.field-error textarea {
    background-color: #ffcccc;
    color: #cc0000;
}

.field-required,
.field-required input,
.field-required select,
.field-required textarea,
.field-required .field-caption {
    color: #0B108C;
}

.field-search {
    color: #777777;
}

.field {
    padding-bottom: 4px;
    padding-right: 16px;
}

.aspradio input {
    float: left;
}

.aspradio label {
    margin-left: 25px;
    margin-bottom: -12px;
    display: block;
}

.aspcheck input {
    float: left;
}

.aspcheck label {
    margin-left: 25px;
    display: block;
}

.field-textbox {
    padding-bottom: 4px;
    padding-right: 16px;
}

    .field-textbox select,
    .field-textbox input,
    .field-textbox textarea {
        border: solid 1px #bbbbbb;
        padding: 2px 4px;
        background-color: White;
    }

        .field-textbox select[readonly],
        .field-textbox input[readonly],
        .field-textbox textarea[readonly] {
            background-color: #eeeeee;
        }

.field-textbox-large {
    font-size: 15pt;
    padding-bottom: 4px;
}

    .field-textbox-large input {
        color: Black;
        border: solid 1px #bbbbbb;
        padding: 2px 2px 2px 2px;
        background-color: White;
        font-size: 15pt;
    }

        .field-textbox-large input[readonly] {
            background-color: #eeeeee;
        }

.field-textbox-md input {
    border: solid 1px #bbbbbb;
    background-color: white;
    padding: 3px 3px 3px 3px;
    height: 20px;
    font-size: 11pt;
}

    .field-textbox-md input[readonly] {
        background-color: #eeeeee;
    }

.field-black {
    color: black;
    border: solid 1px #bbbbbb;
    padding: 0px 2px 0px 2px;
    background-color: white;
}

.field-errormessage {
    display: inline-block;
    padding: 2px 4px 2px 4px;
    color: red;
    font-size: 10pt;
    font-weight: bold;
}

.field-error,
.field-error .field-caption {
    color: #cc0000;
}

.field-hint {
    font-family: 'Open Sans', sans-serif;
    font-size: 9pt;
    color: Gray;
}

br {
    clear: both;
}

.separator {
    font-family: 'Open Sans', sans-serif;
    font-size: 13pt;
    font-weight: 400;
    color: #1e8dc8;
    padding: 5px 0px 5px 10px;
    margin: 0px 0px 10px -10px;
    background-color: #eeeeee;
    -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 1px 1px 0px #dddddd;
    clear: both;
    font-weight: bold;
}

.separator-line hr {
    margin: 0 0 0 0;
    height: 1px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px #aaaaaa;
    padding: 0 0 0 0;
}

.separator hr {
    margin: 0 0 0 36px;
    margin-left: +36px;
    height: 1px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 2px #cccccc;
    padding: 0 0 0 0;
}

.treeview {
    background-color: #e6e6fa;
}

.treenode {
    color: Gray;
}

    .treenode a {
        color: blue;
    }

.webpart-zonecontainer {
    padding: 0px 5px 0px 5px;
    border-left: dashed 1px gray;
}

.webpart-zonecontainerleft {
    padding: 0px 5px 0px 5px;
    background-color: #f8f8f8;
}

.homediv {
    border: solid 1px #e2e2e2;
    background-color: #f8f8f8;
    padding: 6px 6px 6px 6px;
}

.hometitle {
    background-color: #626262;
    padding: 6px 9px 6px 9px;
    margin-bottom: 7px;
    font-size: 11pt;
    font-weight: bold;
}

.contextmenu {
    width: 200px;
    border: solid 1px #777777;
    background-color: #eeeeee;
    padding: 5px 5px 3px 5px;
}

    .contextmenu div {
        margin-bottom: 2px;
        padding-bottom: 2px;
    }

        .contextmenu div a {
            margin-bottom: 2px;
            padding-bottom: 2px;
            background-color: #eeeeee;
            display: inline;
            color: #39639d;
            text-decoration: underline;
        }

.searchabledropdown {
    padding-bottom: 4px;
    padding-right: 16px;
}

    .searchabledropdown div a {
        padding: 0px 2px 0px 2px;
        color: #000000 !important;
        background-color: #ffffff !important;
        text-decoration: none;
        display: block;
        width: 100%;
    }

        .searchabledropdown div a:hover {
            background-color: #e2e2e2 !important;
        }

.sddnormal {
    border: solid 1px silver;
    background-color: white !important;
    padding: 2px 4px;
    background-image: url('../../images/sdd0.gif');
    background-repeat: no-repeat;
    background-position: right;
}

.sddhover {
    border: solid 1px #bbbbbb;
    background-color: white;
    padding: 2px 4px;
    background-image: url('../../images/sdd1.gif');
    background-repeat: no-repeat;
    background-position: right;
}

.sddsearch {
    border: solid 1px #aaaaaa;
    background-color: white;
    padding: 2px 4px;
    background-image: url('../../images/sdds.gif');
    background-repeat: no-repeat;
    background-position: right;
}

.menu {
    color: black;
    background-color: #F1EBEB;
    border: none;
}

.menu-logo {
    background-repeat: no-repeat;
    width: 500px;
}

.menu-apptop {
    background-color: #002157;
}

.menu-top a,
.menu-top a:visited,
.menu-top a:visited {
    text-decoration: none;
    font-weight: bold;
}

.menu-top {
    padding-top: 6px;
}

.menu-staticitem a {
    text-decoration: none;
    display: inline-block;
    color: #bbbbbb;
    font-size: 11pt;
    cursor: pointer;
    text-transform: lowercase;
    padding: 5px 12px 5px 12px;
    height: 18px;
    border-bottom: solid 4px black;
}

    .menu-staticitem a:hover,
    .menu-staticitem a:active {
        color: white;
        font-size: 11pt;
        cursor: pointer;
        text-transform: lowercase;
        padding: 5px 12px 5px 12px;
        height: 18px;
        border-bottom: solid 4px white;
    }

.menu-dropdown {
    background-color: white;
    border-top: solid 1px white;
    border-bottom: solid 2px white;
    z-index: 1000000;
}

.menu-dropdown-templates {
    background-color: Transparent;
    z-index: 1000000;
}

.menu-dynamicitemheader {
    display: inline-block;
    background-color: #F9F9F9;
    color: #1E8DC8;
    font-size: 10pt;
    cursor: default;
    padding: 2px 24px 2px 16px;
    width: 100%;
    font-weight: bold;
}

a.menu-dynamicitem {
    text-decoration: none;
    display: inline-block;
    background-color: #107FC9;
    border-bottom: solid 1px #0E4EAD;
    color: white;
    font-size: 10pt;
    cursor: pointer;
    padding: 8px 24px 8px 16px;
    width: 100%;
}

    a.menu-dynamicitem:hover,
    a.menu-dynamicitem:active {
        background-color: #F9F9F9;
        border-bottom: solid 1px #0E4EAD;
        color: #1E8DC8;
        cursor: pointer;
        padding: 8px 24px 8px 16px;
    }

a.menu-dynamicitem2 {
    text-decoration: none;
    display: inline-block;
    background-color: #0058b3;
    border-bottom: solid 1px #004080;
    color: white;
    font-size: 10pt;
    cursor: pointer;
    padding: 8px 24px 8px 16px;
    width: 100%;
}

    a.menu-dynamicitem2:hover,
    a.menu-dynamicitem2:active {
        background-color: black;
        border-bottom: solid 1px #004080;
        color: white;
        cursor: pointer;
        padding: 8px 24px 8px 16px;
    }

.hint {
    padding-top: 8px;
    padding-bottom: 8px;
    width: 100%;
}

    .hint table {
        padding: 2px 8px 2px 8px;
        border-top: solid 1px #1e8dc8;
        border-bottom: solid 1px #1e8dc8;
        background-color: #b3e3fc;
        color: #0e70a5;
    }

.hint-warning {
    padding-top: 8px;
    padding-bottom: 8px;
    width: 100%;
}

    .hint-warning table {
        padding: 2px 8px 2px 8px;
        border-top: solid 1px #FFD172;
        border-bottom: solid 1px #FFD172;
        background-color: #FCF8E3;
        color: #8A6D38;
    }

.hint-red-alert {
    padding-top: 8px;
    padding-bottom: 8px;
    width: 100%;
}

    .hint-red-alert table {
        padding: 2px 8px 2px 8px;
        border-top: solid 1px #D70000;
        border-bottom: solid 1px #D70000;
        background-color: #fcd6d6;
        color: #D70000;
    }

.hint table table {
    border: solid 1px #eeeeaa;
    background-color: white;
}

.grid-outer table {
    empty-cells: show;
    border-collapse: collapse;
    /* solves IE7 empty cells problem */
}

.grid {
    border: none;
}

.grid-headerscrollable {
    background-color: #F9F9F9;
    color: #555555;
}

.grid-rowscrollable {
    border-bottom: solid 1px #cfcfcf;
}

.grid-footerscrollable {
    border-top: solid 2px #aaaaaa;
    border-bottom: solid 1px #cccccc;
}

.grid-caption {
    color: black;
}

    .grid-caption div {
        font-weight: bold;
        font-size: 10pt;
        padding: 0px 0px 2px 0px;
        margin: 8px 0px 0px 0px;
        clear: both;
    }

.grid-caption-error div,
.grid-caption-error img {
    border-bottom: solid 1px #cfcfcf;
    font-weight: bold;
    font-size: 10pt;
    padding: 0px 0px 2px 0px;
    margin: 8px 0px 0px 0px;
    clear: both;
}

.grid-caption-error {
    color: #cc0000;
}

.grid-command {
    padding: 6px 0px 6px 0px;
    border: none;
    background-color: #F9F9F9;
}

.grid-header {
    color: black;
    border: none;
    font-weight: bold;
    font-size: 10pt;
    background-color: #F9F9F9;
}

    .grid-header a,
    .grid-header a:visited {
        font-weight: 500;
        color: #252525;
        text-decoration: none;
    }

        .grid-header a:hover {
            text-decoration: underline;
        }

    .grid-header th,
    .grid-header td {
        white-space: normal;
        font-weight: 500;
        color: #404040 !important;
        padding: 2px 5px;
        border: solid 1px #cccccc;
        background-color: #eeeeee;
    }

        .grid-header th input {
            vertical-align: middle;
        }

.grid-row {
    border: none;
}

    .grid-row td {
        font-size: 10pt;
        white-space: normal;
        padding: 2px 5px;
        border: solid 1px #CCCCCC;
        border-bottom: solid 1px #CCCCCC;
    }

        .grid-row td input {
            vertical-align: middle;
        }

            .grid-row td input[type="image"] {
                height: 16px;
                background: none;
            }

.grid-emptyrow td {
    height: 20px;
    border-bottom: solid 1px #cccccc;
    white-space: normal;
    text-align: center;
    vertical-align: middle;
    color: Gray;
}

.grid-row td table {
    border: none;
    padding: 0 0 0 0;
    height: auto;
}

    .grid-row td table td {
        padding: 0 0 0 0;
        border: none;
        height: auto;
    }

.grid-footer {
    border-top: solid 2px #cccccc;
    border-bottom: solid 1px #cccccc;
}

    .grid-footer td {
        font-weight: bold;
        border: none;
        height: 16px;
        padding: 2px 5px;
        border-bottom: solid 1px #dddddd;
    }


.grid-pager {
    padding-bottom: 20px;
    table-layout: fixed;
}

    .grid-pager td {
        padding: 2px 4px 8px 0px;
        border: none;
    }

        .grid-pager td div {
            display: inline-block;
            float: left;
        }

            .grid-pager td div,
            .grid-pager td div table,
            .grid-pager td div table td {
                border: none;
            }

    .grid-pager a {
        display: inline-block;
        padding-top: 8px;
        height: 26px;
        width: 34px;
        text-align: center;
        border-left: solid 1px #dddddd;
        border-right: solid 1px #dddddd;
        color: black;
        text-decoration: none;
    }

        .grid-pager a:hover {
            border-left: solid 1px #dddddd;
            border-right: solid 1px #dddddd;
            background-color: #eeeeee;
            color: #0077ff;
        }

    .grid-pager span {
        display: inline-block;
        padding-top: 8px;
        height: 26px;
        width: 34px;
        text-align: center;
        border-left: solid 1px #dddddd;
        border-right: solid 1px #dddddd;
        background-color: #dddddd;
        color: black;
        font-weight: bold;
    }

.div-form {
    border: none;
    background-color: #F9F9F9;
    padding: 12px 12px 12px 12px;
}

.div-main {
    padding: 0 0px 0 0;
    background-color: #f9f9f9;
}

.div-tree {
    background-color: white;
}

.div-nostrip-content {
    padding-left: 75px;
    padding-right: 75px;
}

.task-title {
    font-weight: bold;
    color: white;
    background-color: #3377ff;
    height: 20px;
}

.task-header {
    font-weight: bold;
    color: White;
    background-color: #66ccff;
    height: 20px;
}

.task-urgentitem {
    color: red;
}

.task-item {
    height: 20px;
}

.task-altitem {
    height: 20px;
    background-color: #eeece1;
}

.tooltip-header {
    padding: 2px 2px 2px 2px;
    background-color: #aaddff;
    border: solid 1px #aaddff;
}

.tooltip-body {
    padding: 2px 2px 2px 2px;
    background-color: white;
    border: solid 1px #aaddff;
}

.object-top {
    height: 20px;
    background-color: white;
}

.object-workflow .field-caption,
.object-workflow a {
    color: White;
    font-weight: normal;
}

.object-workflow,
.object-workflow table {
    color: White;
    font-weight: bold;
}

    .object-workflow td {
        padding-top: 3px;
        padding-bottom: 3px;
    }

.object-caption {
    font-family: 'Open Sans', sans-serif;
    font-size: 15pt;
    font-weight: 500;
    color: #005A84;
}

.subobject-buttons {
    padding: 10px 10px 10px 10px;
    background-color: #1E8DC8;
}

.object-buttons-div {
    background-color: #1E8DC8;
    border-top: solid 1px #113355;
}

.object-buttons {
    padding: 5px 30px 5px 22px;
    background-color: #1E8DC8;
}

    .object-buttons table {
        width: 100%;
        min-width: 800px;
    }

/* search page */

.search-caption {
    border: 1px solid #005A84;
    border-right: 5px solid #005A84;
    display: inline-block;
    padding: 2px 5px 2px 5px;
    font-size: 12pt;
    color: #005A84;
    font-weight: 500;
    text-transform: lowercase;
}

.search-hint {
    font-size: 9pt;
    color: #999999;
    display: block;
    padding-bottom: 3px;
}

.search-icon {
    background-image: url(../../images/page-search.jpg);
    background-repeat: no-repeat;
    background-position: top left;
}

/* report */

.reportpage {
    background-color: #FFFFFF;
}

.report-name {
    background-color: #F1EBEB;
    padding: 20px 20px 10px 20px;
}

    .report-name table {
        font-family: Century Gothic, sans-serif;
        color: #036CA4;
        font-size: 18pt;
        font-weight: bold;
    }

.report-buttons {
    background-color: #F1EBEB;
    padding: 10px 100px 5px 100px;
}

.div-report {
    padding-left: 130px;
    padding-right: 50px;
}

.object-message,
.search-message {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px black;
    background-color: #ffffaa;
    z-index: 1000000;
}

.dashboard-container {
    font-family: Arial;
    width: 300px;
    float: left;
    border: solid 1px #9C9E73;
}

.dashboard-header {
    font-family: Arial;
    width: 300px;
    height: 20px;
    background-color: #C3C49C;
    font-weight: bold;
    color: black;
    vertical-align: middle;
}

.dashboard-iframe {
    font-family: Arial;
    width: 300px;
    height: 320px;
}

.gantt- .gantt-PendingAssignment,
.gantt-PendingHelpdesk,
.gantt-PendingPlanning {
    height: 16px;
    width: 95%;
    border: solid 1px blue;
    font-family: Arial;
    font-size: 9pt;
    background-color: #bbbbff;
}

.gantt-PendingApproval {
    height: 16px;
    width: 95%;
    border: solid 1px blue;
    font-family: Arial;
    font-size: 9pt;
    background-color: #bbbbff;
}

.gantt-PendingAssignment {
    height: 16px;
    width: 95%;
    border: solid 1px blue;
    font-family: Arial;
    font-size: 9pt;
    background-color: #bbbbff;
}

.gantt-PendingExecution {
    height: 16px;
    width: 95%;
    border: solid 1px green;
    font-family: Arial;
    font-size: 9pt;
    background-color: #bbffbb;
}

.gantt-Rejected,
.gantt-Cancelled,
.gantt-Close {
    height: 16px;
    width: 95%;
    border: solid 1px gray;
    font-family: Arial;
    font-size: 9pt;
    background-color: #eeeeee;
}

.gantt-PendingClosure {
    height: 16px;
    width: 95%;
    border: solid 1px cyan;
    font-family: Arial;
    font-size: 9pt;
    background-color: #bbffff;
}

.gantt-background {
    background-color: #ffffff;
    border: solid 1px #cccccc;
    font-family: Arial;
    font-size: 9pt;
    padding: 1px 1px 1px 1px;
    height: 0px;
}

.gantt-rangeheader {
    background-color: #dddddd;
    border: solid 1px #cccccc;
    font-family: Arial;
    font-size: 7pt;
    font-weight: normal;
    padding: 0px 1px 0px 1px;
    height: 0px;
}

.gantt-today {
    background-color: #ddddff;
    border: solid 1px #cccccc;
    font-family: Arial;
    font-size: 9pt;
    padding: 1px 1px 1px 1px;
    height: 0px;
}

.gantt-weekend {
    background-color: #dddddd;
    border: solid 1px #cccccc;
    font-family: Arial;
    font-size: 9pt;
    font-weight: normal;
    padding: 1px 1px 1px 1px;
    height: 0px;
}

.gantt-title {
    background-color: #dddddd;
    border: solid 1px #cccccc;
    font-family: Arial;
    font-size: 9pt;
    font-weight: normal;
    height: 0px;
}

.gantt-tooltip-body {
    width: 250px;
    background-color: #ffffff;
    border: solid 1px #cccccc;
    padding: 2px 4px 2px 4px;
}

.gantt-tooltip-header {
    width: 260px;
    background-color: #ddddff;
    border: solid 1px #bbbbff;
    padding: 2px 4px 2px 4px;
}

.gantt-complete {
    height: 4px;
    background-color: black;
    border: solid 1px black;
}

/*----------------------------------------------
 CSS for charts
----------------------------------------------*/

.chartsubmitbutton {
    font-family: Verdana, Sans-Serif;
    font-size: 9pt;
    background-color: #ddddff;
    border: solid 1px #608161;
}

.chartdroparea {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    border-style: groove;
    border-width: thin;
    padding: 2px;
}

.chartsetuparea {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    border-bottom-width: 2px;
    border-bottom-style: ridge;
    padding: 2px;
}

.advancedreportagggroupheader {
    font-family: Arial;
    font-size: 9pt;
    color: #0000A3;
    background-color: #ddffdd;
    padding: 2px;
}

.advancedreportgroup {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    background-color: #ffffdd;
    padding: 2px;
}

.advancedreportitem {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    background-color: white;
    padding: 2px;
}

.reportgridpager {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    padding: 4px;
}

.advancedreportaltitem {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    background-color: #eeeeee;
    padding: 2px;
}

.reporttitle {
    background: transparent url(../../images/reportTop.gif) top left;
    font-weight: bold;
    font-size: 9pt;
    font-family: Arial;
    color: white;
    height: 25px;
}

.advancedreportungroupcolheader {
    font-family: Arial;
    font-size: 9pt;
    color: black;
    background-color: #ddddff;
}

.advancedreportgroupcolheader {
    font-family: Arial;
    font-size: 9pt;
    color: blue;
    background-color: #ddddff;
}

.advancedreportdropnormal {
    background-color: #ddddff;
}

.advancedreportdropover_agg {
    border: solid 1px #0000ff;
}

.advancedreportdropover_ungroup {
    border: solid 1px black;
    background-color: Black;
}

.advancedreportdropover_ungrouppivot {
    border: solid 1px black;
    background-color: Black;
}

.advancedreportdropover_groupY {
    border: solid 2px #7777ff;
    background-color: #7777ff;
}

.advancedreportdropover_groupx {
    border: solid 1px #7777ff;
    background-color: #7777ff;
}

.reportheaderbuttonnormal {
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
    border: solid 1px #4A6F9B;
    cursor: pointer;
    height: 21px;
    height: 21px;
}

.reportheaderbuttonmouseover {
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
    background-color: #6085B0;
    border: solid 1px #6085B0;
    cursor: pointer;
    height: 21px;
    width: 21px;
}

.advancedreportbuttonnormal {
    border: solid 1px #AED3F0;
    cursor: pointer;
    height: 21px;
    width: 21px;
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
    background-color: #AED3F0;
}

.advancedreportbuttonmouseover {
    background-color: #8BBEE7;
    border: solid 1px #3F668F;
    cursor: pointer;
    height: 21px;
    width: 21px;
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
}

.reportbarleft {
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
    border-right-style: solid;
    border-right-color: #103B5D;
    border-right-width: 1px;
    border-top-style: solid;
    border-top-color: #103B5D;
    border-top-width: 1px;
    background-color: #AED3F0;
}

.reportbackground {
    border-top-width: 2px;
    border-top-style: groove;
    border-top-color: #5F3FD6;
    border-left-style: groove;
    border-left-width: 2px;
    border-left-color: #5F3FD6;
    border-right-style: inset;
    border-right-width: 2px;
    border-right-color: #6887BB;
    border-bottom-style: inset;
    border-bottom-width: 2px;
    border-bottom-color: #6887BB;
}

.reportbarright {
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #103B5D;
    background-color: #AED3F0;
}

.leftpanelrow {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #103B5D;
}

.parallelviewdivide {
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #6887BB;
}

.tabstrip {
}

    .tabstrip ul {
        margin: 0;
        list-style: none;
        font-size: 14pt;
        font-weight: bold;
        text-transform: uppercase;
        padding: 10px 0px 10px 0px;
    }

    .tabstrip li {
        display: inline-block;
        margin: 0;
        padding: 0;
    }

    .tabstrip a,
    .tabstrip a:visited {
        display: inline-block;
        padding: 0px 0px 5px 0px;
        margin-right: 20px;
        text-decoration: none;
        color: #888888;
        cursor: pointer;
    }

        .tabstrip a:hover,
        .tabstrip a:active {
            color: #005A84;
        }

    .tabstrip .selected a {
        color: #1E8DC8;
    }

.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
    z-index: 99999;
}

.modalPopup {
    background-color: white;
    border-width: 1px;
    border-style: solid;
    border-color: Gray;
    padding: 8px 8px 8px 8px;
    width: 550px;
    z-index: 100000;
}

/*----------------------------------------
   v7.0 styles
----------------------------------------*/

.tabstrip-bg {
    background-color: inherit;
}

.tabmbl {
    background-color: #e7e7e7;
    border-bottom: solid 1px #f9f9f9;
}

    .tabmbl a {
        text-decoration: none;
        color: #888888;
        display: block;
        padding: 7px 0px 7px 0px;
        cursor: pointer;
    }

.selectedmbl {
    background-color: #e7e7e7;
    border-bottom: solid 1px #f9f9f9;
}

    .selectedmbl a {
        text-decoration: none;
        background-color: #e7e7e7;
        color: Black;
        display: block;
        padding: 7px 0px 7px 0px;
        cursor: default;
    }

/* Tab Strip Standard */
.tab-ver {
    background-position: top right;
    background-repeat: no-repeat;
    background-color: #e7e7e7;
}

.tabstrip-ver {
    padding: 0px 0px 0px 0px;
    font-size: 12pt;
    font-weight: normal;
    height: 500px;
}

    .tabstrip-ver td {
        vertical-align: top;
    }

    .tabstrip-ver ul {
        margin: 0;
        padding: 0px 0px 0px 0px;
        list-style: none;
    }

    .tabstrip-ver li {
        display: inline;
        margin: 0;
        padding: 0;
    }

    .tabstrip-ver a {
        color: #888888;
        display: block;
        text-decoration: none;
        padding: 7px 0px 7px 29px;
        border-left: none;
        width: 170px;
        cursor: pointer;
    }

        .tabstrip-ver a:hover,
        .tabstrip-ver a:active {
            color: #fff;
            background-color: #1E8DC8;
            border-right: 1px solid #005A84;
        }

    .tabstrip-ver .selected a,
    .tabstrip-ver .selected a:hover,
    .tabstrip-ver .selected a:active {
        color: #fff;
        background-color: #1E8DC8;
        padding: 7px 0px 7px 20px;
        border-left: solid 9px #005A84;
        border-right: 1px solid #005A84;
        border-bottom: 1px solid #005A84;
        border-top: 1px solid #005A84;
        width: 170px;
    }

.tabstrip-ver-content {
    background-color: #f9f9f9;
    border-left: solid 1px #cccccc;
}

/* Tab Strip Small */
.tab-sm {
    background-position: top right;
    background-repeat: no-repeat;
    background-color: #f9f9f9;
    border-left: solid 1px #e4e9f0;
    border-right: solid 1px #e4e9f0;
}

.tabstrip-sm {
    font-size: 12pt;
    font-weight: normal;
    /*min-height: 500px;*/
    height: 440px;
    padding: 0px 0px 0px 0px;
}

    .tabstrip-sm td {
        vertical-align: top;
    }

    .tabstrip-sm ul {
        margin: 0;
        padding: 0px 0px 0px 0px;
        list-style: none;
    }

    .tabstrip-sm li {
        display: inline;
        margin: 0;
        padding: 0;
    }

    .tabstrip-sm a {
        font-size: 10pt;
        color: #514d6a;
        display: block;
        text-decoration: none;
        padding: 5px 0px 5px 10px;
        border-left: none;
        width: 160px;
        cursor: pointer;
        border-bottom: solid 1px #e4e9f0;
    }

        .tabstrip-sm a:hover,
        .tabstrip-sm a:active {
            color: #514d6a;
            background: #f2f4f8;
        }

    .tabstrip-sm .selected a,
    .tabstrip-sm .selected a:hover,
    .tabstrip-sm .selected a:active {
        color: #fff;
        background-color: #acb7bf;
        padding: 5px 0px 5px 10px;
        width: 160px;
    }

.tabstrip-sm-content {
    padding-left: 5px;
    padding-right: 5px;
    background-color: #f9f9f9;
}
/* ---- buttons ---- */
/* common styles */
.btn-d,
.btn-d:hover,
.btn-d:active,
.btnblack-d,
.btnblack-d:hover,
.btnblack-d:active,
.btnblue-d,
.btnblue-d:hover,
.btnblue-d:active,
.btngray-d,
.btngray-d:hover,
.btngray-d:active,
.btnblackpnmbl-d,
.btnblackpnmbl-d:hover,
.btnblackpnmbl-d:active,
.btnblackmbl-d,
.btnblackmbl-d:hover,
.btnblackmbl-d:active,
.btn-std-blue-d,
.btn-std-blue-d:hover,
.btn-std-blue-d:active {
    opacity: 0.25;
    -moz-opacity: 0.25;
    filter: alpha(opacity=25);
}

    .btnblack img,
    .btnblack-d img,
    .btnblue img,
    .btnblue-d img,
    .btngray img,
    .btngray-d img,
    .btnblackpnmbl img,
    .btnblackpnmbl-d img,
    .btnblackmbl img,
    .btnblackmbl-d img {
        height: 16px;
        width: 16px;
    }
/* ClearView standard button */
.btn-new,
.btn-new:visited {
    display: inline-block;
    padding: 4px 12px 6px 12px;
    background-color: #F1EBEB;
    border: 1px solid Gray;
    color: #000;
    text-decoration: none;
}

    .btn-new:hover {
        color: #1E8DC8;
        background-color: #CACACA;
        border: 1px solid #1E8DC8;
    }

    .btn-new:active {
    }

.btn-std-blue {
    display: inline-block;
    color: #fff;
    background-color: #0073A8;
    letter-spacing: 1px;
    padding: 6px 14px;
    font-size: 14px;
    border: 1px solid #005a84;
    text-decoration: none;
    vertical-align: middle;
}

    .btn-std-blue img {
        width: 16px;
        height: 16px;
        margin-top: -4px;
        vertical-align: middle;
    }

    .btn-std-blue:hover,
    .btn-std-blue:active {
        /* border-color: #005a84; */
        background-color: #005A84;
    }

.btn-std-blue-d,
.btn-std-blue-d:hover,
.btn-std-blue-d:active {
    display: inline-block;
    color: #fff;
    background-color: #0073A8;
    letter-spacing: 1px;
    padding: 6px 14px;
    font-size: 14px;
    border: 1px solid #005A84;
    text-decoration: none;
    vertical-align: middle;
}

    .btn-std-blue-d img {
        height: 16px;
        width: 16px;
        margin-top: -4px;
        vertical-align: middle;
    }
/* standard button */
.btn,
.btn:visited,
.btn-d,
.btn-d:hover,
.btn-d:active,
.btn-d:visited {
    display: inline-block;
    text-decoration: none;
    background-image: none;
    padding: 3px 8px 3px 8px;
    margin-bottom: 5px;
    font-size: 10pt;
    color: #3e3e3e;
    background-color: #eeeeee;
    border: solid 1px #cccccc;
}

    .btn:active {
        border-bottom: 1px solid;
    }

    .btn:hover {
        background-color: white;
        color: #1E8DC8;
        border-color: #1E8DC8;
    }

    .btn img,
    .btn-d img {
        height: 16px;
        width: 16px;
        margin-top: -2px;
        vertical-align: middle;
    }
/* black button */
.btnblack,
.btnblack:visited,
.btnblack-d,
.btnblack-d:hover,
.btnblack-d:active,
.btnblack-d:visited {
    display: inline-block;
    text-transform: uppercase;
    text-decoration: none;
    background-image: none;
    padding: 6px 8px 6px 8px;
    margin-bottom: 5px;
    font-size: 12pt;
    font-weight: normal;
    color: white;
    background-color: #224466;
    border: solid 1px #446688;
}

    .btnblack:hover {
        background-color: #6688aa;
        border: solid 1px #cccccc;
    }
/* black (mobile) button for prev/next buttons */
.btnblackpnmbl,
.btnblackpnmbl:visited,
.btnblackpnmbl-d,
.btnblackpnmbl-d:hover,
.btnblackpnmbl-d:active,
.btnblackpnmbl-d:visited {
    width: 146px;
    display: inline-block;
    text-transform: uppercase;
    text-decoration: none;
    background-image: none;
    padding: 6px 8px 6px 8px;
    margin-bottom: 5px;
    font-size: 12pt;
    font-weight: normal;
    color: white;
    background-color: #224466;
    border: solid 1px #446688;
}

    .btnblackpnmbl:hover {
        background-color: #6688aa;
        border: solid 1px #cccccc;
    }
/* black (mobile) button for action buttons */
.btnblackmbl,
.btnblackmbl:visited,
.btnblackmbl-d,
.btnblackmbl-d:hover,
.btnblackmbl-d:active,
.btnblackmbl-d:visited {
    width: 320px;
    display: inline-block;
    text-transform: uppercase;
    text-decoration: none;
    background-image: none;
    padding: 6px 8px 6px 8px;
    margin-bottom: 5px;
    font-size: 12pt;
    font-weight: normal;
    color: white;
    background-color: #224466;
    border: solid 1px #446688;
}

    .btnblackmbl:hover {
        background-color: #6688aa;
        border: solid 1px #cccccc;
    }
/* blue button */
.btnblue,
.btnblue:visited,
.btnblue-d,
.btnblue-d:hover,
.btnblue-d:active,
.btnblue-d:visited {
    display: inline-block;
    text-decoration: none;
    background-image: none;
    padding: 6px 8px 6px 8px;
    margin-bottom: 5px;
    font-size: 11pt;
    font-weight: normal;
    color: #ffffff;
    background-color: #0378b5;
    border: solid 1px #88ddff;
}

    .btnblue:hover {
        background-color: #2bc3ff;
        border: solid 1px white;
    }
/* gray button */
.btngray,
.btngray:visited,
.btngray-d,
.btngray-d:hover,
.btngray-d:active,
.btngray-d:visited {
    display: inline-block;
    text-transform: uppercase;
    text-decoration: none;
    background-image: none;
    padding: 6px 8px 6px 8px;
    margin-bottom: 5px;
    font-size: 11pt;
    font-weight: normal;
    color: #ffffff;
    background-color: gray;
    border: solid 1px gray;
}

    .btngray:hover {
        background-color: #aaaaaa;
    }
/* hyper links */
/* white */
.hlink-white,
.hlink-white:hover,
.hlink-white:active,
.hlink-white:visited,
.hlink-white-d,
.hlink-white-d:hover,
.hlink-white-d:active,
.hlink-white-d:visited {
    color: White;
    text-decoration: underline;
    cursor: pointer;
}
/* gray */
.hlink-gray,
.hlink-gray:hover,
.hlink-gray:active,
.hlink-gray:visited,
.hlink-gray-d,
.hlink-gray-d:hover,
.hlink-gray-d:active,
.hlink-gray-d:visited {
    color: gray;
    text-decoration: underline;
    cursor: pointer;
}
/* blue */
.hlink-blue,
.hlink-blue:hover,
.hlink-blue:active,
.hlink-blue:visited,
.hlink-blue-d,
.hlink-blue-d:hover,
.hlink-blue-d:active,
.hlink-blue-d:visited {
    color: #0077ff;
    text-decoration: underline;
    cursor: pointer;
}
/* black */
.hlink-black,
.hlink-black:hover,
.hlink-black:active,
.hlink-black:visited,
.hlink-black-d,
.hlink-black-d:hover,
.hlink-black-d:active,
.hlink-black-d:visited {
    color: Black;
    text-decoration: underline;
    font-size: 9pt;
    cursor: pointer;
}

    .hlink-white-d,
    .hlink-white-d:hover,
    .hlink-white-d:active,
    .hlink-white-d:visited,
    .hlink-gray-d,
    .hlink-gray-d:hover,
    .hlink-gray-d:active,
    .hlink-gray-d:visited,
    .hlink-blue-d,
    .hlink-blue-d:hover,
    .hlink-blue-d:active,
    .hlink-blue-d:visited,
    .hlink-black-d,
    .hlink-black-d:hover,
    .hlink-black-d:active,
    .hlink-black-d:visited {
        opacity: 0.25;
        -moz-opacity: 0.25;
        filter: alpha(opacity=25);
    }

.btn-g-grey,
.btn-g-grey-d,
.btn-g-grey-d:hover,
.btn-g-grey-d:active {
    color: #545454;
    border: solid 1px #dddddd;
    background-color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    padding: 3px 10px;
    text-decoration: none;
    vertical-align: middle;
}

    .btn-g-grey:hover,
    .btn-g-grey:active {
        color: #000000;
        font-weight: 600;
        background-color: #efefef;
    }

.btn-image-icon {
    padding-right: 5px;
}

.btn-g-image-icon {
    height: 16px;
    padding-right: 3px;
    margin-bottom: -2px;
}

.btn-g-grey-d,
.btn-g-grey-d:hover,
.btn-g-grey-d:active {
    opacity: 0.50;
    -moz-opacity: 0.50;
    filter: alpha(opacity=50);
}

.div-searchfom {
    border: solid 1px #dddddd;
    background-color: #f7f7f7;
    padding: 8px 8px 8px 8px;
    clear: both;
}

.div-edit {
    min-width: 506px;
    padding: 0px 20px 20px 30px;
}

.div-audit {
    padding: 10px 20px 10px 30px;
}

.div-status {
    text-align: center;
    vertical-align: middle;
    padding: 10px 10px 10px 10px;
    text-transform: capitalize;
    font-size: 0pt;
    font-weight: normal;
    color: White;
}

    .div-status .field span {
        font-size: 11pt;
    }

.div-urgent-no {
    padding: 5px 5px 5px 10px;
    width: 110px;
    text-align: left;
    vertical-align: middle;
    border-left: solid 30px #f7f7f7;
    font-size: 1pt;
    font-weight: bold;
    color: #cccccc;
}

    .div-urgent-no label {
        color: #cccccc;
        font-size: 14pt;
    }

    .div-urgent-no br {
        height: 0px;
    }

.div-urgent-yes {
    padding: 5px 5px 5px 10px;
    width: 110px;
    text-align: left;
    vertical-align: middle;
    border-left: solid 30px red;
    font-size: 1pt;
    font-weight: bold;
    color: Red;
}

    .div-urgent-yes label {
        color: Red;
        font-size: 14pt;
    }

.div-objectbase {
    padding: 6px 0px 2px 0px;
    min-width: 630px;
}

.div-objectbase-int {
    padding: 0px 20px 0px 30px;
}

.div-tabbuttons {
    padding: 8px 8px 8px 8px;
}

.div-home {
    border: none;
    background-color: white;
    padding: 0px 40px 0px 56px;
    background-color: #F9F9F9;
}

.homepage {
    background-color: #eeeeee;
}

.editpage {
    background-color: #F9F9F9;
    background-position: top;
    background-repeat: repeat-x;
}

.hint-top {
    padding: 8px 0px 8px 0px;
}

    .hint-top table {
        border: solid 1px #cccc00;
        background-color: #ffffcc;
    }

.span-inboxdate {
    padding-top: 3px;
    color: Gray;
    font-size: 7pt;
}

.subobject-panel {
    border: solid 1px #1E8DC8;
    background-color: #ffffff;
    padding: 20px 20px;
}

.separator2 {
    background-color: #6699cc;
    color: white;
    text-align: center;
    font-weight: bold;
    font-size: 12pt;
    padding: 5px 0px 5px 0px;
    margin: 15px 0px 15px 0px;
    clear: both;
}

.separator-small {
    font-weight: bold;
    font-size: 10pt;
    padding: 0px 0px 5px 0px;
    margin: 10px 0px 15px 0px;
    clear: both;
    border-bottom: solid 2px #e4e4e4;
    color: #1e8dc8;
    text-transform: capitalize;
}

.dialog {
    z-index: 1000000;
    position: fixed;
    top: 50%;
    left: 50%;
}

.dialog-bg {
    background-color: Black;
    filter: alpha(opacity=70);
    opacity: 0.7;
    z-index: 99999;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
}

.dialog-title {
    background-color: #26ade4;
    color: #ffffff;
    font-weight: normal;
    font-size: 18pt;
    padding: 5px 30px 5px 30px;
    border-bottom: solid 1px #dddddd;
}

.dialog-title-closebutton {
    background-color: #26ade4;
    color: gray;
    font-weight: bold;
    font-size: 8pt;
    padding: 15px 8px 8px 8px;
    border-bottom: solid 1px #dddddd;
}

    .dialog-title-closebutton a {
        color: #ffffff;
    }

.dialog-main {
    background-color: #f7f7f7;
    padding: 20px 30px 20px 30px;
}

.dialog-buttons {
    background-color: #26ADE4;
    padding: 10px;
    text-align: center;
}

.div-audit table {
    font-size: 9pt;
    color: Gray;
}

.div-audit-int {
}

.div-indent {
    padding-left: 20px;
}

.text-right {
    text-align: right;
}

.stateBox {
    background-color: Pink;
    text-align: center;
    font-weight: bold;
    border: .1em solid #900;
    position: absolute;
    z-index: -1;
}

.stateBox-current {
    background-color: LightBlue;
    text-align: center;
    font-weight: bold;
    border: .1em solid #900;
    position: absolute;
    z-index: -1;
}

.actionBox {
    position: absolute;
    z-index: 4;
    background-color: white;
}

.stateBox div {
    font-size: 9px;
    font-weight: normal;
}

.stateBox-current div {
    font-size: 9px;
    font-weight: normal;
}

.text-sub {
    font-family: Tahoma;
    font-size: 8pt;
    color: Gray;
}

.object-base,
.object-base input {
    font-size: 11pt;
    font-weight: bold;
}
/* month view calendar */
.monthv {
}

    .monthv span {
        font-size: 8pt;
        font-weight: normal;
        color: Black;
        cursor: pointer;
    }

.monthv-day-today {
    font-size: 13pt;
    font-weight: bold;
    min-height: 100px;
    border: solid 1px #dddddd;
    padding: 4px 8px 4px 8px;
}

.monthv-day-day {
    font-size: 13pt;
    min-height: 100px;
    border: solid 1px #dddddd;
    padding: 4px 8px 4px 8px;
}

.monthv-day-weekend {
    font-size: 13pt;
    min-height: 100px;
    border: solid 1px #dddddd;
    background-color: #ddeeff;
    padding: 4px 8px 4px 8px;
}

.monthv-day-othermonth {
    font-size: 13pt;
    min-height: 100px;
    border: solid 1px #dddddd;
    background-color: #eeeeee;
    color: #cccccc;
    padding: 4px 8px 4px 8px;
}

.monthv-dayheader {
    background-color: Silver;
    padding: 4px 8px 4px 8px;
    border: none;
}

.monthv-header {
    background-color: White;
    border: none;
}

    .monthv-header td {
        background-color: White;
        border: none;
        font-size: 15pt;
        padding: 4px 20px 4px 20px;
    }

.ajax__calendar_container {
    z-index: 1;
}
/* --- Desktop Menu --- */
.cssmenu ul,
.cssmenu li,
.cssmenu span,
.cssmenu a {
    margin: 0;
    padding: 0;
    position: relative;
    color: #FFFFFF;
}

.cssmenu {
    height: 30px;
    background: #1E8DC8;
    border-bottom: 0px;
    width: auto;
}

    .cssmenu:after,
    .cssmenu ul:after {
        content: '';
        background: black;
        display: block;
        clear: both;
    }

    .cssmenu a {
        background: #1E8DC8;
        color: #FFFFFF;
        display: inline-block;
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        line-height: 30px;
        padding: 0 10px;
        text-decoration: none;
    }

    .cssmenu ul {
        background: #1E8DC8;
        list-style: none;
    }

    .cssmenu > ul {
        float: left;
    }

        .cssmenu > ul > li {
            float: left;
        }

            .cssmenu > ul > li > a {
                color: #FFFFFF;
                font-size: 14px;
            }

                .cssmenu > ul > li > a:first-child {
                    font-size: 13px;
                    text-transform: uppercase;
                }

            .cssmenu > ul > li.active > a {
                background: #F1EBEB;
                color: #FFFFFF;
            }

            .cssmenu > ul > li:hover > a {
                background: #F1EBEB;
                box-shadow: 0px 0px 4px gray;
                color: #1E8DC8;
            }

    .cssmenu .has-sub {
    }

        .cssmenu .has-sub ul {
            display: none;
            position: fixed;
            width: 250px;
            left: 0px;
            top: 0px;
            max-height: 704px;
            overflow-y: auto;
        }

            .cssmenu .has-sub ul li {
                *margin-bottom: -1px;
            }

                .cssmenu .has-sub ul li a {
                    background: #107FC9;
                    border-bottom: 1px solid #0E4EAD;
                    filter: none;
                    font-size: 13px;
                    display: block;
                    line-height: 120%;
                    padding: 8px 15px 8px 15px;
                    color: #ffffff;
                }

                .cssmenu .has-sub ul li:hover a {
                    background: #F1EBEB;
                    color: #1E8DC8;
                }

        .cssmenu .has-sub .has-sub ul {
            display: none;
            position: fixed;
        }

        .cssmenu .has-sub > ul > .has-sub > a,
        .cssmenu .has-sub > ul > .has-sub > a:hover,
        .cssmenu .has-sub > ul > .has-sub > ul > .has-sub a,
        .cssmenu .has-sub > ul > .has-sub > ul > .has-sub a:hover {
            background-image: url(../../images/submenu.gif);
            background-position: center right;
            background-repeat: no-repeat;
        }

        .cssmenu .has-sub .has-sub ul li a,
        .cssmenu .has-sub .has-sub .has-sub ul li a {
            color: white;
            background: #0058b3;
            border-bottom: 1px solid #0E4EAD;
        }

            .cssmenu .has-sub .has-sub ul li a:hover,
            .cssmenu .has-sub .has-sub .has-sub ul li a:hover {
                background: #F1EBEB;
                color: #1E8DC8;
            }

    .cssmenu > ul {
        z-index: 10000;
    }

        .cssmenu > ul > li > ul {
            z-index: 20000;
        }

            .cssmenu > ul > li > ul > li > ul {
                z-index: 30000;
            }
/* --- Mobile Menu --- */
.cssmenum,
.cssmenum ul,
.cssmenum li,
.cssmenum a {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    font-weight: normal;
    text-decoration: none;
    line-height: 1;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    position: relative;
}

    .cssmenum a {
        line-height: 1.3;
        padding: 6px 15px;
    }

.cssmenum {
    width: 100%;
}

    .cssmenum > ul > li {
        cursor: pointer;
        background-color: #000;
        border-bottom: 1px solid #333333;
    }

        .cssmenum > ul > li > a {
            font-size: 13px;
            display: block;
            color: #ffffff;
            background-color: black;
            padding: 9px 0px 9px 15px;
        }
        /* Sub menu */
        .cssmenum > ul > li > ul {
            padding: 0;
            display: none;
        }

            .cssmenum > ul > li > ul > li > ul {
                padding: 0;
                display: none;
            }

    .cssmenum ul ul a {
        background-color: #107FC9;
        display: block;
        color: white;
        font-size: 13px;
        padding: 9px 0px 9px 30px;
    }

    .cssmenum ul ul li {
        border-bottom: 1px solid #0E4EAD;
    }

    .cssmenum ul ul ul a {
        background-color: #0058b3;
        display: block;
        color: white;
        font-size: 13px;
        padding: 9px 0px 9px 45px;
    }

    .cssmenum .has-sub > a {
        background-image: url(../../images/submenu.gif);
        background-position: center right;
        background-repeat: no-repeat;
    }

    .cssmenum ul ul ul li {
        border-bottom: 1px solid #0E4EAD;
    }
/*-----------------------
  Date Picker
-------------------------*/
#AUFCalSlide {
    overflow: hidden;
    width: 245px;
    height: 252px;
}

#AUFMYSlide {
    overflow: hidden;
    width: 240px;
    height: 180px;
}

#AUFCal,
#AUFMY {
    font-family: 'Open Sans', sans-serif;
    width: 245px;
    border: none;
    position: absolute;
    background-color: White;
    border: solid 4px #0cf;
    z-index: 1000001;
}

#AUFMY {
    width: 240px;
}

#AUFCalHeader,
#AUFMYHeader {
    color: white;
    background-color: #0cf;
    height: 43px;
}

#AUFCalMonthYear,
#AUFMYYear {
    padding-top: 3px;
}

#AUFCalLeft,
#AUFCalRight,
#AUFMYLeft,
#AUFMYRight {
    width: 40px;
}

    #AUFCalLeft a,
    #AUFMYLeft a,
    #AUFCalRight a,
    #AUFMYRight a {
        padding-top: 8px;
        text-align: center;
        display: block;
        width: 40px;
        height: 32px;
        cursor: pointer;
    }

        #AUFCalLeft a div,
        #AUFMYLeft a div {
            display: inline-block;
            border: solid 6px transparent;
            border-right: solid 6px black;
        }

        #AUFCalRight a div,
        #AUFMYRight a div {
            display: inline-block;
            border: solid 6px transparent;
            border-left: solid 6px black;
        }

#AUFCalMonthYear,
#AUFMYYear {
    text-align: center;
    width: 200px;
}

#AUFCalWeeks td {
    color: #bbb;
    font-size: 12px;
}

#AUFCalCells,
#AUFMYCells {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    width: 245px;
    border-spacing: none;
    position: relative;
    top: 0px;
    left: 0px;
}

#AUFMYCells {
    width: 240px;
}

    #AUFCalCells td,
    #AUFMYCells td {
        width: 35px;
        height: 35px;
        text-align: center;
        vertical-align: center;
    }

    #AUFMYCells td {
        width: 60px;
        height: 60px;
    }

    #AUFCalCells a,
    #AUFMYCells a {
        text-decoration: none;
        display: inline-block;
        padding-top: 7px;
        width: 33px;
        height: 26px;
        color: black;
    }

    #AUFMYCells a {
        padding-top: 22px;
        width: 58px;
        height: 36px;
    }

#AUFCalToday,
#AUFMYThisMonth {
    border-top: solid 1px #ddd;
    padding-top: 1px;
    padding-bottom: 1px;
    border-bottom: solid 1px #ddd;
}

    #AUFCalToday a,
    #AUFMYThisMonth a {
        text-decoration: none;
        display: block;
        padding-top: 10px;
        height: 34px;
        width: 243px;
        color: #08f;
    }

    #AUFMYThisMonth a {
        width: 238px;
    }

        #AUFCalCells a:hover,
        #AUFMYCells a:hover,
        #AUFCalToday a:hover,
        #AUFMYThisMonth a:hover {
            color: white;
        }

.AUFSel select,
.AUFSelY select {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    background: transparent;
    width: 90px;
    height: 33px;
    border: 0;
    color: black;
    line-height: 1;
    border-radius: 0;
    -webkit-appearance: none;
}

.AUFSel,
.AUFSelY {
    display: inline-block;
    width: 60px;
    height: 33px;
    overflow: hidden;
    background: url('../../images/datepicker-dn.gif') no-repeat right transparent;
    border: none;
    color: white;
}

a.calsel {
    background-color: #0cf;
    color: white;
}

a.calnor {
    background-color: white;
    color: black;
}

.calnor:hover,
.calsel:hover,
#AUFCalToday a:hover,
#AUFMYThisMonth a:hover {
    background-color: #2288ff;
}

.grid-dayheader {
    border: none;
    padding: 3px 3px 3px 3px;
    background-color: #eeece1;
}

.grid-day {
    text-align: center;
    padding: 3px 3px 3px 3px;
}

.grid-day-big {
    padding: 3px 3px 3px 3px;
}

.default-node {
    font-family: 'Open Sans', sans-serif;
    font-size: 11pt;
    color: #888888;
    padding-top: 5px;
    padding-bottom: 5px;
}

.selected-node {
    font-weight: bold;
}

.hover-node {
    color: #2278ff;
}

.leaf-node {
    margin: 0px 0px 0px -19px;
}

.home-calendar {
    margin-bottom: 0px;
}

.home-calendar-cell {
    font-family: 'Open Sans', sans-serif;
    font-size: 10pt;
    text-align: center;
    padding: 5px 3px 5px 3px;
    background-color: #1E8DC8;
    color: #000000;
}

.home-calendar-today {
    border: 1px solid white;
    padding: 5px 3px 5px 3px;
    color: white;
}

.home-calendar-dayheader {
    font-family: 'Open Sans', sans-serif;
    font-size: 10pt;
    border: none;
    padding: 3px 3px 3px 3px;
    background-color: #1E8DC8;
}

.home-calendar-header {
    color: white;
    border: none;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 9pt;
    background-color: #1E8DC8;
}
/*background-color: #1E8DC8;*/
.home-calendar-weekend {
    text-align: center;
    padding: 3px 3px 3px 3px;
    background-color: #1E8DC8;
    color: #EFFAB4;
}

.home-separator {
    font-family: 'Open Sans', sans-serif;
    font-size: 14pt;
    color: #1E8DC8;
    padding: 0px 0px 2px 0px;
    margin: 0px 0px 0px 0px;
    clear: both;
    text-transform: uppercase;
}

.dashboard-tooltip-header {
    padding: 2px 10px 0px 5px;
    background-color: #0378b5 !important;
    white-space: nowrap;
    font-weight: bold;
    border: solid 0px #666;
    border-bottom: none;
    font-size: 1em;
    color: #FFF;
}

.dashboard-tooltip-body td {
    font-size: 1em;
}

.dashboard-tooltip-body {
    padding: 5px 10px 5px 5px;
    font-size: 1em;
    background-color: #0378b5 !important;
    color: #FFF;
    white-space: nowrap;
    border: solid 0px #666;
    border-top: none;
}

.div-search {
    background-color: #F9F9F9;
    padding: 10px 10px 10px 60px;
}

.btn-search {
    display: inline-block;
    border: solid 1px #1e8dc8;
    background-color: #1E8DC8;
    color: White;
    font-size: 12pt;
    padding: 3px 5px 0px 5px;
    height: 23px;
    text-transform: uppercase;
    text-decoration: none;
}

    .btn-search img {
        vertical-align: middle;
        padding-bottom: 8px;
        padding-left: 2px;
    }

    .btn-search:hover {
        background-color: #005A84;
    }

    .btn-search:active {
        background-color: #005A84;
    }

.btn-search-sm {
    padding: 2px 5px;
    border: solid 1px #bbbbbb;
}
/*----------------------------------------
    Fieldset & Legend
------------------------------------------*/
fieldset {
    margin-bottom: 5px;
    border: solid 1px #0e70a4;
}

legend {
    color: #1e8dc8;
    font-size: 14px;
    font-weight: bold;
    text-align: left;
}
/********************/
/* Career History   */
/********************/
.employee-code {
    width: 120px !important;
}

.employee-name {
    width: 150px !important;
}

.career-code {
    width: 110px !important;
}

.department {
    width: 250px !important;
}

.location {
    width: 200px !important;
}

.position {
    width: 260px !important;
}

.branch {
    width: 120px !important;
}
/**************/
/*  Employee  */
/**************/
.code {
    width: 60px !important;
}

.name {
    width: 130px !important;
}

.status {
    width: 120px !important;
}

.incentive {
    width: 240px !important;
}

.incentive-code {
    width: 70px !important;
}

.year {
    width: 60px !important;
}

.month-text {
    width: 90px !important;
}

.last-generate-on {
    width: 160px !important;
}

.last-generate-by {
    width: 120px !important;
}

.location-code {
    width: 60px !important;
}

.department-code {
    width: 90px !important;
}

.email {
    width: 180px !important;
}

.text-red {
    color: #ff0000;
}

.payslip {
    width: 80px !important;
}

.payment-type {
    width: 250px !important;
}

.allowance-type {
    width: 180px !important;
}

.bonus-type {
    width: 180px !important;
}

.remark {
    width: 280px !important;
}

.remark {
    width: 280px !important;
}

.leave-template {
    width: 120px !important;
}

.last-generation-datetime {
    width: 180px !important;
}

.last-generation-status {
    width: 180px !important;
}

#gvResultsGrid_d2,
#gvResultsGrid_d1 {
    /*overflow-x: scroll;
    margin-left: 60px;*/
}

.annual-leave {
    width: 40px !important;
}

.maternity-leave {
    width: 40px !important;
}

.special-leave {
    width: 40px !important;
}

.unpaid-leave {
    width: 40px !important;
}

.vacation-leave {
    width: 40px !important;
}

.sick-leave {
    width: 40px !important;
}

.extended-sick-leave {
    width: 40px !important;
}

.compensatory-dayoff {
    width: 40px !important;
}

.last-generation-status {
    width: 312px !important;
}

.last-generation-status-row {
    width: 312px !important;
    font-size: 8pt !important;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

.leave-template {
    width: 100px !important;
}

.gender {
    width: 50px !important;
}

.to-generate {
    width: 120px !important;
}

.action {
    width: 70px !important;
}

.start-date,
.joined-date {
    width: 85px !important;
}

.service-length {
    width: 85px !important;
}

.employee-status {
    width: 45px !important;
}

.leave-type {
    width: 145px !important;
}

.leave-type-code {
    width: 100px !important;
}

.position-group-code {
    width: 100px !important;
}

.position-group-title {
    width: 285px !important;
}
/**************/
/*  Training  */
/**************/
.course-name {
    width: 300px !important;
}

.rate-number {
    width: 240px !important;
    text-align: center;
    font-family: 'Khmer OS';
    font-size: 16px;
}

.invite-col {
    width: 70px !important;
    text-align: center;
}

.status-col {
    width: 70px !important;
    text-align: center;
    font-weight: bold;
}

.advance-search-containter {
    background: #eeeeee;
    padding: 10px 10px 10px 10px;
    border: solid 1px #cccccc;
}

.table-salary {
    border: none;
    width: 100%;
}

    .table-salary a,
    .table-salary a:visited {
        font-weight: 500;
        color: #252525;
        text-decoration: none;
    }

    .table-salary th,
    .table-salary td {
        white-space: normal;
        font-weight: 500;
        color: #404040 !important;
        padding: 2px 5px;
        border: solid 1px #cccccc;
        background-color: #ffffff;
    }

        .table-salary th .field,
        .table-salary td .field {
            padding-right: 0px;
            padding-bottom: 0px;
        }

    .table-salary th {
        white-space: normal;
        font-weight: 500;
        color: #404040 !important;
        padding: 5px 5px;
        border: solid 1px #cccccc;
        background-color: #eeeeee;
        text-align: left;
        font-weight: bold;
    }

        .table-salary th input,
        .table-salary td input,
        .table-salary th select,
        .table-salary td select {
            padding: 2px 5px;
            border: solid 1px #ccc;
            vertical-align: middle;
            background-color: #fff;
        }

        .table-salary th input,
        .table-salary td input {
            padding: 2px 5px;
            border: solid 1px #ccc;
            vertical-align: middle;
            background-color: #fff;
            text-align: right;
        }

            .table-salary th input[type='number'],
            .table-salary td input[type='number'] {
                text-align: center;
            }

.table-salary-footer {
}

    .table-salary-footer td {
        font-weight: bold;
        background: #eeeeee;
    }

@-moz-document url-prefix() {
    .table-salary {
        border: none;
        width: 100%;
    }

    .sable-salary a,
    .sable-salary a:visited {
        color: #252525;
        font-weight: 500;
        text-decoration: none;
    }

    .table-salary th,
    .table-salary td {
        white-space: normal;
        font-weight: 500;
        color: #404040 !important;
        padding: 4px 4px;
        border: solid 1px #cccccc;
        background-color: #fff;
    }

        .table-salary th .field,
        .table-salary td .field {
            padding-right: 0px;
            padding-bottom: 0px;
        }

        .table-salary th input,
        .table-salary td input,
        .table-salary th select,
        .table-salary td select {
            padding: 3px 3px;
            border: solid 1px #ccc;
            vertical-align: middle;
            background-color: #fff;
        }

        .table-salary th input,
        .table-salary td input {
            text-align: right;
        }

            .table-salary th input[type='number'],
            .table-salary td input[type='number'] {
                text-align: center;
            }

    .table-salary-footer {
    }

        .table-salary-footer td {
            font-weight: bold;
            background: #eeeeee;
        }
}
