﻿@import url('https://fonts.googleapis.com/css?family=Inter:300,400,500,700');

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,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}

:root {
    /* Colors: */
    --accent-main: #0B4BE3;
    --text-main: #414141;
    --text-secondary: #000000;
    --background-secondary: #F2F2F2;
    --danger: #DF365D;
    --success: #6fa515;
    --unnamed-color-727272: #727272;
    /* Font/text values */
    --unnamed-font-family-inter: Inter;
    --unnamed-font-style-normal: normal;
    --unnamed-font-weight-600: 600;
    --unnamed-font-weight-medium: medium;
    --unnamed-font-size-11: 11px;
    --unnamed-font-size-12: 12px;
    --unnamed-font-size-13: 13px;
    --unnamed-font-size-16: 16px;
    --unnamed-font-size-18: 18px;
    --unnamed-character-spacing-0: 0px;
    --unnamed-line-spacing-14: 14px;
    --unnamed-line-spacing-15: 15px;
    --unnamed-line-spacing-16: 16px;
    --unnamed-line-spacing-20: 20px;
    --unnamed-line-spacing-21: 21px;
}
/****************************** Global Styles ***************************************/
html,
body {
    height: 100%;
    width: 100%;
}

body {
    color: #000;
    background-color: var(--dx-color-main-bg);
    font-family: 'Inter';
    line-height: 1rem;
    font-size: 0.875rem;
    font: 500 14px 'Inter', sans-serif;
}

table {
    border-collapse: separate;
}

a:hover {
    text-decoration: none;
}

a {
    text-decoration: none;
}

.clr {
    clear: both;
    height: 0;
    font-size: 0;
}

.floted_left {
    float: left;
}

.floted_right {
    float: right;
}

.erase_m {
    margin: 0;
}

.stronged {
    font-weight: bold;
}

legend {
    color: #39f;
    font-weight: bold;
}

* html #minwidth {
    border-left: 945px solid #fff;
    position: relative;
    float: left;
    z-index: 1;
    min-width: 945px;
    background: #fff;
}

* html #container {
    margin-left: -945px;
    position: relative;
    float: left;
    z-index: 2;
    text-align: left;
    background: #fff;
}

#page_container {
    min-width: 990px;
    width: expression((document.documentElement.clientWidth || document.body.clientWidth) < 990 ? '990px': 'auto');
    /* background:url(Images/bg_main_menu.gif) repeat-y 0 0;*/
    height: 100%;
}

.text-courier td {
    font-family: 'courier'
}

/****************************** Right Side Styles ***************************************/
.main_right {
    padding-left: 235px;
}

#master_popup {
    margin: 0px;
    padding: 0px;
    background-color: #ffffff;
}

/****** Header Styles *******/
#header {
    background: #fff url(Images/bg_horisontal_dots.gif) repeat-x 0 100%;
    height: 22px;
    padding-top: 10px;
    padding-bottom: 3px;
}

    #header .inner {
        height: 15px;
        padding: 0 15px 0 10px;
    }

#welcome_msg {
    float: left;
    font-size: 12px;
    color: #333;
    font-weight: bold;
}

/****** User Menu Styles *******/
#user_menu {
    float: right;
    color: #999;
}

    #user_menu ul {
        list-style: none;
        display: inline;
    }

        #user_menu ul li {
            display: inline;
        }

            #user_menu ul li a {
                color: #3f66a0;
                padding: 0 14px;
                border-left: 4px solid #3f66a0;
                text-decoration: none;
            }

                #user_menu ul li a:hover {
                    color: #f39128;
                    text-decoration: underline;
                    border-left: 4px solid #f39128;
                }

/****** SubHeader Styles *******/
#subheader {
    background: #f5f5f5;
    padding: 3px 0;
    border-radius: 5px;
}

    #subheader .inner {
        padding: 0 22px 0 10px;
    }

#page_name {
    float: left;
    color: #0B4BE3;
    font-size: 18px;
    font-weight: 500;
}

/*#page_name .page_name_sep {margin-left:15px;}*/
#sel_view {
    float: right;
    color: #0B4BE3;
}

/*#sel_view .sel_view_combobox {margin-top:2px;}*/
/*#sel_view span {float:left;}*/

.sel_view_combobox {
    padding: 0;
}

.combobox_item {
    line-height: 18px;
}

#wrapper {
}

/****************************** Left Side Styles **************************************/
.plashka {
    position: absolute;
    left: 227px;
    width: 5px;
    height: 100%;
    background: url(Images/bg_plashka.gif) repeat-y 0 0;
    z-index: 2;
}

    .plashka a {
        background: url(Images/plashka_alt.gif) no-repeat 0 0;
        display: block;
        width: 7px;
        height: 52px;
        top: 45%;
        position: absolute;
        left: -1px;
    }

.plashka_invert {
    position: absolute;
    width: 5px;
    height: 100%;
    background: url(Images/bg_plashka.gif) repeat-y 0 0;
    z-index: 2;
}

    .plashka_invert a {
        background: url(Images/plashka_alt_invert.gif) no-repeat 0 0;
        display: block;
        width: 7px;
        height: 52px;
        top: 45%;
        position: absolute;
        left: -1px;
    }

/****************************** Popup Styles *****************************************/
.popup_buttons_container {
    text-align: right;
}

/****** Main Popup Styles *******/
.popup_main {
    background: #b9d1eb;
    border: 1px solid #000;
}

.popup_header {
    background: url(Images/bg_popup_header.gif) repeat-x top left;
    height: 25px;
    color: #000;
    border-top: 1px solid #fff;
    padding-right: 10px;
    font-weight: bold;
}

.popup_content {
    background: #f7f7f7;
    color: #000;
    padding: 10px;
    border: 0px solid #b9d1eb;
}

    .popup_content label {
    }

.popap_panel1 {
    width: 665px;
}

.popap_up_table {
    margin-bottom: 10px;
    width: 100%;
}

    .popap_up_table td {
        padding: 2px 0;
    }



    .popap_up_table input.txtrightalign {
        text-align: right;
    }

.padding10 {
    padding-left: 10px;
}

.popap_up_inner_table {
    width: 270px;
    $width: 100%;
}

/****** Find Popup Styles *******/
/*.popup_find {margin-right:6px; margin-top:10px;}
.popup_find_inner { margin:10px 5px;}*/
.popup_find .text_box_skin {
    width: 140px;
}

.popup_find fieldset {
}

.popup_find_foot {
    margin-top: 10px;
}

.popup_find fieldset {
    background: #f1f1f1;
    margin: 0;
    padding: 0;
}

    .popup_find fieldset fieldset {
        background: #f4f3ee;
        margin: 0;
        padding: 0;
    }

        .popup_find fieldset fieldset label,
        .popup_find_foot label {
            vertical-align: middle;
        }

        .popup_find fieldset fieldset input {
            vertical-align: top;
            $vertical-align: middle;
        }

.popup_find_foot input {
    vertical-align: middle;
}

.popup_find_sens {
    padding-left: 3px;
}

.popup_find_sens_label {
    margin-left: -4px;
}

.popup_find_foot .button {
    $margin-right: -5px;
}

/****** Expense Claim Popup Styles *******/
/*.popup_expense_claim_panel {width:570px;}*/
.popup_expense_claim {
    padding: 15px 25px 15px 25px;
    margin-top: 10px;
}

    .popup_expense_claim div.btn_appfilter {
        padding-top: 13px;
        margin-left: 30px;
        $margin-left: 15px;
    }

/*.popup_expense_claim div.btn_appfilter input {padding:0 10px 2px 10px;}*/
.popup_expense_claim_btn_ok {
    text-align: right;
    padding: 10px 0;
}

.popup_expense_claim .pec_block {
    margin-right: 15px;
}

.pec_inner div {
    float: left;
}

.popup_select_expense_claim_btn_ok {
    padding: 10px 5px 0 0;
    text-align: right;
}

/****** SelectProject Popup Styles *******/
.popup_select_project {
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

    .popup_select_project fieldset {
        margin: 0 0 0 0;
        padding: 0;
        font-size: 11px;
    }

.popup_select_project_tbl {
    width: 100%;
}

.popup_select_project div.btn_ok {
    text-align: right;
    padding: 10px 0;
}

.popup_select_project_grid {
    margin-top: 15px;
}

/****** SelectNCTimeCategory Popup Styles *******/
.selectNCTime_btn {
    text-align: right;
    margin-top: 7px;
}

/****** Timesheet Details Popup Styles *******/
.popup_timesheet_details_container td {
    vertical-align: bottom;
    padding: 0 0 5px 0;
}

.popup_timesheet_details_container .form_validator {
    margin-bottom: 3px;
}

.popup_timesheet_details_nar .text_box_skin {
    height: 81px;
    width: 277px;
    margin-bottom: 5px;
}

.popup_timesheet_details_container .popup_buttons_container {
    border-top: #B2B2B2 solid 1px;
    padding-top: 10px;
}

/****** Timesheet Block Time Popup Styles *******/
.popup_block_time_container .popup_buttons_container {
    padding-top: 10px;
}

.popup_block_time_cell {
    padding: 0 0 15px 0;
    vertical-align: bottom;
}

.popup_block_time_text .text_box_skin {
    height: 74px;
    width: 277px;
    margin-bottom: 5px;
}

.popup_block_time_container .form_validator {
    margin-bottom: 3px;
    padding-right: 5px;
}


.popup_enter_block_time .popup_buttons_container {
    border-top: #B2B2B2 solid 1px;
    padding-top: 10px;
    margin-top: 10px;
}




#personel_panel {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    font-size: 13px;
    gap: 10px;
}

.personel_block {
}

/*.personel_block .sel_view_combobox, .personel_block .date_edit_skin, .personel_block .button {display:inline-block;}*/
#personel_panel label,
#personel_panel .txt {
}

#personel_panel .erase_m {
    margin: 0;
}

.personel_curency {
    width: 140px;
    font-weight: 400;
}

/****************************** Expenses Styles *****************************************/
/****** Expenses Top Bar Form *******/
.expenses_plForm_tbl {
    table-layout: fixed;
    font-family: 'Inter' !important;
    font-weight: 400;
    font-size: 12px !important;
}

    .expenses_plForm_tbl th, .expenses_plForm_tbl td {
        border: 1px solid #dddddd;
        border-collapse: collapse;
        border-radius: 3px;
        padding: 6px 10px;
        
    }

        .expenses_plForm_tbl td.cellspacing {
            padding: 0 4px;
        }

    .expenses_plForm_tbl label {
        font-size: 12px;
    }

/* .no_pading_ie_buttons input {$padding:0;} */
.expenses_plForm_field {
    margin: 5px 0;
    padding: 0;
    background: #f1f1f1;
}

.expenses_plForm_values table {
    width: 100%;
}

.expenses_plForm_approved {
    color: red;
    font-weight: bold;
    font-size: 11px;
}

.expenses_plForm_values td {
}

.expenses_plForm_row {
    height: 34px;
}

.expenses_plForm_tbl fieldset {
    margin: 10px 0 0 0;
    padding: 0;
    padding-bottom: 5px;
}

.expenses_plForm_field legend {
    padding: 0 3px;
}

.expenses_status {
    font-size: 15px;
}

    .expenses_status > .submitted {
        color: #0B4BE3;
        width: fit-content;
        box-shadow: inset 0 0 0 1px #b6c8f2;
        background: #f2f6ff;
        border-radius: 5px;
        text-align: center;
        display: block;
        margin-left: auto;
        padding: 6px 10px;
    }


    .expenses_status > .approved {
        color: #145e1b;
        width: fit-content;
        box-shadow: inset 0 0 0 1px #6cb172;
        background: #ecffee;
        border-radius: 5px;
        text-align: center;
        display: block;
        margin-left: auto;
        padding: 6px 10px;
    }


    .expenses_status > .rejected {
        color: #a3102a;
        width: fit-content;
        box-shadow: inset 0 0 0 1px #ceadb0;
        background: #fbf3f3;
        border-radius: 5px;
        text-align: center;
        display: block;
        margin-left: auto;
        padding: 6px 10px;
    }

    .expenses_status > .pending {
        color: #47506e;
        width: fit-content;
        box-shadow: inset 0 0 0 1px #47506e;
        background: #eceef3;
        border-radius: 5px;
        text-align: center;
        display: block;
        margin-left: auto;
        padding: 6px 10px;
    }

.expenses_approver {
    font-size: 12px;
    font-weight: 400;
    font-family: 'Inter';
    width: 100%;
    align-content: center;
}


.expenseItemHeader {
    font-family: 'Inter' !important;
    text-align: left;
    font-size: 1rem;
    color: #0B4BE3;
    font-weight: 600;
    padding-left: 0px;
    padding-top: 0px;
}




.timesheet_status {
    width: fit-content;
    border-radius: 5px;
    text-align: center;
    display: block;
    margin-left: auto;
    padding: 6px 10px;
}

.timesheet_status.approved {
    color: #145e1b;
    box-shadow: inset 0 0 0 1px #6cb172;
    background: #ecffee;
}

.timesheet_status.rejected {
    color: #a3102a;
    box-shadow: inset 0 0 0 1px #ceadb0;
    background: #fbf3f3;
}

.timesheet_status.pending {
    color: #47506e;
    box-shadow: inset 0 0 0 1px #47506e;
    background: #eceef3;
}



.dxbButton div.dxbf {
    border: 0px dotted black;
}





.button_secondary, .dxb-outline, .command_icon {
    font: inherit;
    cursor: pointer;
    font-size: inherit;
    font-weight: 500;
    padding: 6px 10px;
    background-image: none;
    white-space: nowrap;
    border-radius: 3px;
    border: 1px solid #e0e0e0;
    background-color: transparent;
    color: #242424;
}

    .button_secondary div.dxb {
        padding: 0;
    }

    .button_secondary.dxbButton:Hover, .dxb-outline:Hover, .command_icon:hover {
        background-color: #f5f5f5;
        color: #242424;
        border: 1px solid #e0e0e0;
    }

    .button_secondary.dxbDisabled {
        background: #eee;
        border-color: #eee;
        color: #aaa;
        cursor: default;
    }

.button_accent {
    font: inherit;
    cursor: pointer;
    font-size: inherit;
    font-weight: 500;
    padding: 6px 10px;
    background-image: none;
    white-space: nowrap;
    border-radius: 3px;
    border: 1px solid #cbd8f7;
    background-color: #f0f5ff;
    color: var(--accent-main);
}

    .button_accent div.dxb {
        padding: 0;
    }

    .button_accent.dxbButtonHover {
        background-color: #e6efff;
    }

    .button_accent.dxbDisabled {
        background: #eee;
        border-color: #eee;
        color: #aaa;
        cursor: default;
    }

.button_danger {
    font: inherit;
    color: white;
    cursor: pointer;
    font-size: inherit;
    font-weight: 500;
    padding: 6px 10px;
    background-color: var(--danger);
    background-image: none;
    border: 0;
    white-space: nowrap;
    border-radius: 3px;
}

.button_danger div.dxb {
    padding: 0;
}

.button_success {
    font: inherit;
    color: white;
    cursor: pointer;
    font-size: inherit;
    font-weight: 500;
    padding: 6px 10px;
    background-color: var(--success);
    background-image: none;
    border: 0;
    white-space: nowrap;
    border-radius: 3px;
}

    .button_success div.dxb {
        padding: 2px 0;
    }





/****** Expenses Popup EditExpenseItemDetails Styles *******/
.expenses_edit_container {
}

    .expenses_edit_container fieldset {
        margin-bottom: 0px;
        margin-top: 6px;
        $margin-left: 0px;
        $margin-right: 5px;
    }

.expenses_edit_form_tbl {
    table-layout: fixed;
    width: 100%;
    margin: 0 auto;
    font-size: 12px;
}

.expenses_edit_form_checkbox input {
    margin-left: 0;
    $margin-left: -4px;
}

.form_validator {
    display: block;
    width: 16px;
    height: 16px;
}

.expenses_edit_form_tbl_footer {
    width: 161px;
    $width: 156px;
}

.expenses_edit_form_tbl_narrative {
    margin-top: 8px;
}

    .expenses_edit_form_tbl_narrative input {
        width: 520px;
    }

.expenses_edit_form_miles_fld {
    $padding-bottom: 8px;
    height: 128px;
}

.expenses_edit_form_charge_fld {
    $padding-bottom: 6px;
    height: 146px;
}

.sub-analysis-tbl {
    margin-top: 12px;
}

.required-star {
    color: Red;
    padding: 0 10px;
    font-family: 'Inter' !important;
}

.dxrpcontent {
    padding: 0px !important;
}


/****************************** Skins Styles *****************************************/
.grid_main_skin,
.chek_box_skin,
.sel_view_combobox,
.popup_content,
.text_box_skin,
.button_edit_skin,
.date_edit_skin {
}

.button_edit_skin {
    height: 21px;
    border: 1px solid #b2b2b2;
}

.date_edit_skin {
    border: 1px solid #b2b2b2;
}

.text_box_skin {
    border: 1px solid #b2b2b2;
    width: 200px;
    height: 17px;
    line-height: 19px;
    padding: 2px 2px 0 2px;
    $padding-top: 0;
    $height: 19px;
}

.text_box_skin_inline {
    border: 1px solid #b2b2b2;
    width: 200px;
    height: 17px;
    line-height: 19px;
    padding: 2px 0px 0px 0px;
    $padding-top: 0;
    $height: 19px;
}

.spin_edit_skin {
    border: 1px solid #b2b2b2;
}

.main_grid_footer {
}

.grid_main_skin td {
    text-overflow: ellipsis;
}

.grid_main_skin {
    padding-right: -17px;
}

.text_box_skin_dis {
    background: #ece9d8;
    border: 1px solid #b2b2b2;
}

.sgrid_header {
    text-overflow: ellipsis;
}

.btn_customization_button {
    padding: 0;
    border: 0;
    background: url(Images/btn_customization_window.gif) no-repeat 0 0;
    width: 10px;
    height: 7px;
    margin-left: 8px;
    _margin-bottom: 5px;
}

    .btn_customization_button:hover {
        background: url(Images/btn_customization_window_hover.gif) no-repeat 0 0;
    }

.uppercase {
    text-transform: uppercase;
}

    .uppercase input {
        text-transform: uppercase !important;
    }

/****************************** Timesheet Grid Styles *****************************************/
#timesheet_grid {
    list-style: none;
    border: 1px solid #cfcfcf;
    border-bottom: 0;
}

    #timesheet_grid li {
        border-bottom: 1px solid #cfcfcf;
    }

.timesheet_grid_head {
    background: #dcebfe;
    _height: 20px;
}

#timesheet_grid li span {
    line-height: 20px;
    _line-height: 170%;
}

#timesheet_grid input {
    width: 35px;
    border: 0px solid #cfcfcf;
    text-align: right;
    padding: 0 3px;
}

.timesheet_grid_container {
    width: 100%;
    float: left;
    margin-right: -330px;
    _margin-right: -370px;
}

.timesheet_grid_container_content {
    margin-right: 330px;
    display: block;
    _margin-right: 370px;
}

.timesheet_grid_left_column {
    display: block;
    float: left;
    width: 290px;
    border-right: 1px solid #cfcfcf;
}

.timesheet_grid_center_column {
    display: block;
    margin-left: 290px;
    padding-left: 10px;
}

.timesheet_grid_right_column {
    display: block;
    float: right;
    width: 330px;
    _width: 370px;
}

.timesheet_project_code {
    width: 110px;
    padding: 0 10px 0 10px;
    border-right: 1px solid #cfcfcf;
    height: 20px;
    display: block;
    float: left;
}

.timesheet_project_name {
    width: 91px;
    padding-left: 10px;
}

.timesheet_date_input {
    border-left: 1px solid #cfcfcf;
    display: block;
    float: left;
    background: #fff;
    line-height: 20px;
    height: 20px;
    width: 40px;
    text-align: center;
    _width: 45px;
}

.timesheet_name,
input.timesheet_totals {
    background: #3399ff;
    color: #fff;
}

.timesheet_totals {
    border-right: 1px solid #cfcfcf;
}

.timesheet_ie6_debug {
    _margin-top: -2px;
}

.timesheet_grid_foot span {
    background: #e9e9e9;
    color: #000;
}


/****************************** Calendar Styles *****************************************/
/*.calendar_edit_box {height:17px; border:1px solid #b2b2b2;}
.calendar_edit_box img {padding:1px; background:url(Images/btn_combobox.gif) no-repeat 1px 1px;}
.calendar_edit_box img:hover {background:none;}
.calendar_main {background:#fff; border:1px solid #b2b2b2;}
.calendar_header {background:#dcdcdc; padding:0 2px;}
.calendar_header td {text-align:center;}*/
.calendar_footer table {
    margin: 0 auto;
}

/****************************** Table Timesheets Styles *****************************************/
.tbl_timesheet {
    border-collapse: collapse;
    width: 100%;
    border: 1px solid #fff;
    margin-top: 10px;
    border: 1px solid #9f9f9f;
    background: #f7f7f7;
    table-layout: fixed;
    font-size: 11px;
}

    .tbl_timesheet thead th {
        height: 20px;
        white-space: nowrap;
        border: 1px solid #9f9f9f;
        font-weight: bold;
        background: #f0f0f0 url(Images/bg_grid_header.gif) repeat-x 0 0;
        font-size: 11px;
    }

    .tbl_timesheet td {
        height: 20px;
        white-space: nowrap;
        padding: 0 5px;
        border: 1px solid #cfcfcf;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .tbl_timesheet td div {
            width: 41px;
            height: 16px;
            padding: 3px 5px 0 3px;
            margin: -2px -2px -2px -1px;
            $position: absolute;
            $top: -1px;
            $left: -1px;
            $margin: 0;
            $width: 43px;
            $height: 17px;
            $overflow: hidden;
            font-size: 11px;
        }

    .tbl_timesheet tfoot td {
        background: #e9e9e9;
        padding: 0;
        border-top: 0;
        text-align: right;
        padding-right: 3px;
        font-size: 10px;
    }

    /*.tbl_timesheet tbody th {background:#fff; border:1px solid #fff; color:#000; text-align:right; padding:0 3px;}*/
    /*.tbl_timesheet th {background:#39f; color:#fff; font-weight:normal;}*/
    .tbl_timesheet td.cell-editable {
        color: #39f;
        text-align: right;
        padding: 0;
        position: relative;
    }

        .tbl_timesheet td.cell-editable div {
            border: 1px solid #9cf;
            background: #fff;
            color: #000;
            cursor: default;
            z-index: 0;
            overflow: hidden;
        }

    .tbl_timesheet td.cell-editable-holiday {
        color: #39f;
        text-align: right;
        padding: 0;
        position: relative;
    }

        .tbl_timesheet td.cell-editable-holiday div {
            background: #ffffe1;
            border: 1px solid #9cf;
            cursor: default;
            color: #39f;
            overflow: hidden;
        }

    .tbl_timesheet td.cell-readonly {
        background: #e9e9e9;
        color: #a0a0a0;
        padding: 0;
        text-align: right;
        position: relative;
        font-weight: bold;
    }

        .tbl_timesheet td.cell-readonly div {
            border: 1px solid #9cf;
            cursor: default;
            color: #000;
            background: #e9e9e9;
            overflow: hidden;
        }

    .tbl_timesheet td.cell-focusin {
        position: relative;
        background: #39f;
        text-align: center;
        border: 0;
    }

        .tbl_timesheet td.cell-focusin div {
            border-top: 2px solid #39f;
            border-left: 2px solid #39f;
            border-bottom: 2px solid #39f;
            border-right: 2px solid #39f;
            cursor: default;
            background: #fff;
            z-index: 100;
            width: 40px;
            height: 15px;
            margin: -1px;
            margin-top: -11px;
            $margin-top: -10px;
            $width: 42px;
            $height: 15px;
            $left: 0px;
            $top: 10px;
            padding-top: 2px;
            padding-right: 4px;
            position: absolute;
            $position: relative;
            text-align: right;
            $padding-right: 2px;
        }

    .tbl_timesheet td.row-total {
        text-align: right;
        background: #e9e9e9;
        font-size: 11px;
    }

.header-info {
    text-align: left;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 11px !important;
}

.tbl_timesheet .row-selected td {
    background: #39f;
    color: #fff;
}

.timesheet-time-edit-box {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 101;
    width: 43px;
    text-align: left;
    font-size: 11px;
    padding-left: 3px;
    height: 15px;
    border: 2px solid #39f;
    font-family: Calibri, Verdana, Arial;
}

/********** CSS Hack For FireFox Table Timesheets Styles ****************/
.tbl_timesheet td.cell-editable,
x:-moz-any-link {
    overflow: auto;
}

.tbl_timesheet td.cell-editable-holiday,
x:-moz-any-link {
    overflow: auto;
}

.tbl_timesheet td.cell-readonly,
x:-moz-any-link {
    overflow: auto;
}

.tbl_timesheet td.cell-focusin,
x:-moz-any-link {
    overflow: auto;
}

.error_container {
    width: 50%;
    margin: 100px auto;
    border: 1px solid #c72b48;
    background-color: #fff4f6;
    border-radius: 5px;
    font-size: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
    .error_container h1 {
        color: #c72b48;
        font-size: 1.2rem;
    }

    .error_container h2 {
        font-size: 1rem;
    }


/****************************** Timeshit Reports Styles *****************************************/
.timesheet_reports_container {
    width: 550px;
    position: relative;
}

    .timesheet_reports_container fieldset,
    .timesheet_reports_show fieldset {
        padding: 10px 15px 6px;
        margin: 29px 0 10px 0;
        background: #fff;
        border: 1px solid #a0a0a0;
    }

.timesheet_reports_tbl {
    border: 0px solid red;
    width: 450px;
    ;
    margin: 5px 0 10px;
    table-layout: fixed;
    height: 100px;
}

.timesheet_reports_btns {
    text-align: right;
    height: 20px;
    padding: 5px;
    width: 267px;
    position: absolute;
    top: 85px;
    left: 501px;
    z-index: 1000;
}

    .timesheet_reports_btns input {
        margin-left: 5px;
    }

.timesheet_reports_cell {
    padding: 5px;
    vertical-align: top;
    float: left;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.timesheet_reports {
}

.timesheet_reports_name {
    font-weight: bold;
    font-size: 14px;
    float: left;
    padding: 5px;
    height: 20px;
}

.timesheet_report_collapse {
    float: left;
    padding: 7px 5px 5px;
    font-size: 14px;
    height: 18px;
}

.timesheet_reports_steps {
    padding: 0 0 0 10px;
    color: #999;
    position: absolute;
    top: 59px;
    left: 230px;
    z-index: 10000;
    _top: 63px;
}

    .timesheet_reports_steps a {
        text-decoration: none;
        color: #000;
        padding: 5px 10px;
        display: block;
        float: left;
        border: 1px solid #a0a0a0;
        margin: 1px;
        background: #fff url(Images/bg_btn_show_timesheet.gif) repeat-x 0 100%;
    }

        .timesheet_reports_steps a.active {
            border-bottom: 1px solid #f4f3ee;
            background: #f4f3ee;
            border-top: 3px solid #39f;
            padding: 4px 10px;
        }

            .timesheet_reports_steps a.active:hover {
                background: #f4f3ee;
            }

        .timesheet_reports_steps a:hover {
            background: #fff url(Images/bg_btn_show_timesheet_hover.gif) repeat-x 0 100%;
        }

.timesheet_reports_field_block {
    margin-top: 10px;
}


/****************************** Tree List Styles *****************************************/
.tree_list_container {
    border: 1px solid #bbb;
    background: #fff;
}

.tree_list_btn {
    text-align: right;
    margin-top: 7px;
}

.tree_list_name {
    padding: 3px 0;
}

/****** Timesheet Split Popup Styles *******/
.timesheet_split_popup .popup_buttons_container {
    padding-top: 10px;
    position: fixed;
    bottom: 8px;
    right: 8px;
}

.timesheet_split_popup .text_box_skin {
    line-height: 15px;
    padding: 0;
    $padding-top: 1px;
}

.timesheet_split_cell {
    padding: 0px 5px !important;
}

.timesheet_split_altrow a.timesheet_split_footerlnk,
.timesheet_split_altrow a.timesheet_split_footerlnk:visited {
    color: #39f;
}

.timesheet_split_row a.timesheet_split_footerlnk,
.timesheet_split_row a.timesheet_split_footerlnk:visited {
    color: #39f;
}

.timesheet_split_selrow a.timesheet_split_footerlnk,
.timesheet_split_selrow a.timesheet_split_footerlnk:visited {
    color: #fff !important;
}

a.timesheet_split_footerlnk,
a.timesheet_split_footerlnk:visited {
    color: #f4921b !important;
}

    a.timesheet_split_footerlnk:hover {
        text-decoration: none;
    }

a.timesheet_split_lnk,
a.timesheet_split_lnk:visited {
    color: #f4921b !important;
    padding: 0 8px;
}

    a.timesheet_split_lnk:hover {
        text-decoration: none;
    }

.panel_full_scren,
.panel_full_scren_no_panel {
    height: 100%;
    min-height: 100%;
    position: absolute;
    $position: inherit;
    /*margin-top:-135px;*/
    top: 135px;
    min-width: 755px;
}

.panel_full_scren_inner,
.panel_full_scren_inner_no_panel {
    /*padding-top:135px;*/
}

.panel_full_scren_no_panel {
    margin-top: -100px;
}

.panel_full_scren_inner_no_panel {
    padding-top: 100px;
}

.disabled_contxt_menu {
    opacity: 0.4;
    FILTER: progid:DXImageTransform.Microsoft.BasicImage(Grayscale=1, Opacity=0.4);
}

.contxt_menu {
    z-index: 102;
}

/**************************** Loading Panel *********************************/
.spiner_container {
    font-size: 0;
    background-color: rgb(0, 0, 0, 0.2);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .spiner_container span {
        display: none;
    }

    .spiner_container img,
    .spiner_container span {
        vertical-align: middle;
    }

    .spiner_container img {
    }

.spiner_loading_div {
    width: 660px !important;
}



.grid_command_column a {
    display: block;
    font-size: 9px;
}

.mysettings_fld {
    margin: 15px 10px;
}

    .mysettings_fld label {
        float: left;
        padding-top: 3px;
        padding-right: 4px;
    }

    .mysettings_fld div.inner {
        padding: 20px;
    }

.mysettings_btn {
    margin-left: 10px;
}

    .mysettings_btn .button {
        width: 60px;
    }

.right_pos_buttons_view {
    text-align: right;
    padding-right: 14px;
}

.view_popup_container {
    height: 360px;
    overflow: auto;
}


/************************* Resourse Planing ****************************************/

.capacity_container_tbl {
    margin-top: 5px;
    border: 1px solid #a3c0e8;
}

/******** Main Table *********/


/**************** First Table ***********************/
.job_grid {
    border: solid #a3c0e8;
    border-width: 0 0 0 1px;
    font-size: 11px;
    empty-cells: show;
    width: 310px;
}

    .job_grid th {
        height: 14px;
        background: #dfeeff url(Images/bg_fieldset.gif) repeat-x 0 0;
        color: #000;
        padding: 3px 2px;
        text-align: left;
        border: solid #a3c0e8;
        border-width: 0 1px 1px 0;
        empty-cells: show;
        text-overflow: ellipsis;
        overflow: hidden;
        font-weight: normal;
    }

    .job_grid td {
        height: 14px;
        padding: 2px;
        border: solid #9c9ab7;
        border-width: 0 1px 1px 0;
        overflow: hidden;
        empty-cells: show;
        text-overflow: ellipsis;
    }

.sub_header {
    background: #0e5ed5;
    color: #fff;
    font-weight: bold;
}

.sub_body td {
    height: 14px;
    background: #c7ddfd;
}

.sub_total {
    text-align: right;
    background: #ffe794;
}

.actual_total,
.actual_capacity,
.all_total {
    text-align: right;
    background: #ffc076;
}


/**************** Second Table ***********************/
.resource_grid {
    /*border-collapse:collapse;*/
    table-layout: fixed;
    border: solid #a3c0e8;
    border-width: 0 0 0 1px;
    font-size: 11px;
    empty-cells: show;
    text-align: right;
}

    .resource_grid th {
        height: 14px;
        background: #dfeeff url(Images/bg_fieldset.gif) repeat-x 0 0;
        border: solid #a3c0e8;
        color: #000;
        border-width: 0 1px 1px 0;
        padding: 3px 2px;
        text-align: center;
        font-weight: normal;
    }

    .resource_grid td {
        height: 14px;
        padding: 2px;
        border: solid #c9d6e9;
        width: 54px;
        border-width: 0 1px 1px 0;
        text-align: right;
        overflow: hidden;
    }

    .resource_grid .sub_head th {
        height: 14px;
        background: #0e5ed5;
        color: #fff;
        text-align: right;
        border-color: #0e5ed5;
        padding: 2px;
    }

    .resource_grid .readonly {
        background: #e5e5e5;
        text-align: right;
    }

/****************/

.runing_div {
    width: 66px;
    border: 1px dashed black;
    position: absolute;
    top: 40px;
    left: 138px;
    overflow: hidden;
    height: 17px;
    font-family: Arial, Verdana, Sans-Serif;
}

    .runing_div input {
        border: 0;
        padding: 2px 0 0 0;
        font-size: 11px;
        font-family: Arial, Verdana, Sans-Serif;
    }

.global_head th {
    background: #6666FF;
    color: #fff;
}

.global_foot td {
    background: #ffc076;
}

.body_foot td {
    background: #ffc076;
}

.sub_foot td {
    background: #ffe794;
    border-bottom: 2px solid #000 !important;
}

.resource_grid .editable {
    background: #fff;
    text-align: right;
}

.resource_grid .line-total {
    font-weight: bold;
}

.sub_total td {
    border-bottom: 2px solid #000;
}

.column6 td,
.column5 td {
    width: 35px;
}

.column6 {
    width: 210px;
}

.column5 {
    width: 175px;
}

.resourse_planing_container {
    overflow: auto;
}

.capacity_container_tbl td {
    vertical-align: top;
    font-family: Arial, Verdana, Sans-Serif;
}

.negative-capacity {
    color: Red;
}

.positive-capacity {
    color: #0000ff;
}

.zero-capacity {
    color: #000;
}

.job-item0 {
    width: 70px;
    overflow: hidden;
    height: 14px;
}

.job-item1 {
    width: 105;
    overflow: hidden;
    height: 14px;
}

.job-item2 {
    width: 120px;
    overflow: hidden;
    height: 14px;
}

.total-col td {
    border-color: Red;
    background: aqua;
}

.arrow_worck_sheduling {
    margin-top: 3px;
}

/*.grid_main_skin .dxeButtonEdit {width:150px !important;}*/

.fieldset_imit {
}

.fieldset_imit_head {
    padding: 0; pr
    font: 600 0.875rem 'Inter', sans-serif;
}


.top_margin {
    margin-top: 12px;
}

.bottom_margin {
    margin-bottom: 12px;
}

#ctl00_ContentPlaceHolder1_tbValue {
    width: 330px;
}

.expense_total {
    background: #dfdfdf;
    padding-top: 1px;
    padding-bottom: 1px;
}


.right_aligned {
    text-align: right;
}

.devex_button span {
    line-height: 100% !important;
}

.devex_button div {
    padding: 3px 10px 4px !important;
    $padding: 2px 10px 3px !important;
}


/*************** Expences Color Text ***************************/
input.expenses {
    background-color: expression(this.readOnly ? '#EAEAEA': 'White');
}

    input.expenses[readonly="readonly"] {
        background-color: #fff;
    }

tr.sub_analysis1 td input,
tr.sub_analysis1 td select {
    color: Red !important;
    font-weight: normal;
}

tr.sub_analysis2 td input,
tr.sub_analysis2 td select {
    color: orange !important;
    font-weight: normal;
}

tr.sub_analysis3 td input,
tr.sub_analysis3 td select {
    color: Red !important;
    font-weight: bold;
}

tr.sub_analysis4 td input,
tr.sub_analysis4 td select {
    color: orange !important;
    font-weight: bold;
}

/******************/

.right_aligned_txtfld {
    font-family: Calibri, Verdana, Arial;
}

.dropDownList {
    font-family: Calibri, Verdana, Arial;
}

/* Self-Service */

.header {
    width: 100%;
    height: 70px;
    background-color: #ffffff;
    padding: 0 20px 0 0;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    position: fixed;
    top: 0;
    z-index: 1501;
    border-bottom: 2px solid #f2f3f7;
    border-image: linear-gradient(to right, #333945 221px, #f2f3f7 100px) 2;
}

    .header .box {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        height: 70px;
    }

    .header .company {
        color: #47506e;
        font-size: 14px;
        font-weight: 600;
        white-space: nowrap;
        padding: 0;
        border-radius: 5px;
        display: flex;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 10px;
        flex-direction: row;
        align-items: center;
    }

    .header .companyname {
        color: #47506e;
        font-size: 14px;
    }

    .header .username {
        color: #0B4BE3;
        font-size: 14px;
        font-weight: 600;
    }

    .header .date {
        color: #47506e;
        font-size: 12px;
        font-weight: 400;
    }

    .header img {
        height: 1rem;
        width: fit-content;
    }



    .header .dropbtn {
        color: black;
        padding: 16px;
        cursor: pointer;
        border: 1px solid #DDDDDD;
        font-size: 11px !important;
        font-family: 'Inter';
        height: auto;
        outline: none !important;
        font-weight: 500 !important;
        border-radius: 3px;
        transition: all 0.2s ease;
        padding: 4px 6px 4px 12px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        line-height: 0.9rem
    }

    .header .dropdown {
        position: relative;
        display: inline-block;
    }

    .header .dropdown-content {
        display: none;
        position: absolute;
        right: 0;
        background-color: #f9f9f9;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
    }

        .header .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
        }

            .header .dropdown-content a:hover {
                background-color: #f1f1f1;
            }

    .header .dropdown:hover .dropdown-content {
        display: block;
    }

    .header .dropdown:hover .dropbtn {
        background-color: #3e8e41;
    }




.bg_top_desktop {
    background: url(Images/bg_top_desktop.png) repeat;
    height: 80px;
    padding-top: 0px;
    padding-left: 3px;
    padding-right: 3px;
    color: White;
    font-size: 11px;
    font-weight: bold;
}

.bg_top_desktop_image {
    background: url(Images/bg_top_desktop.png) repeat;
    height: 100px;
    padding-right: 10px;
    width: 100px;
}

.bg_top {
    height: 100px;
    background: url(Images/bg_top_desktop.png) repeat;
    font-family: Calibri, Verdana, Arial;
    font-size: 12px;
    text-decoration: none;
}

.bg_top_logo {
    background: url(Images/bg_top_logo.png) no-repeat;
    height: 100px;
    width: 373px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    color: White;
    font-size: 11px;
    font-weight: bold;
}

.task_top {
    background: url(Images/task_topXXX.png) no-repeat;
    background-position: left bottom;
    border-left: 1px solid transparent;
}

.task_bottom {
    background: url(Images/task_bottomXXX.png) no-repeat;
    background-color: #edf2f8;
    background-position: left top;
    height: 37px;
    border-left: 1px solid #bed6f6;
}

.task_text {
    font-size: 14px;
    font-weight: bold;
    padding-left: 85px;
    vertical-align: bottom;
    color: #000000;
}

.tx_top_panel {
    font-size: 12px;
}

.tx_header {
    font-size: 18px;
    font-weight: bold;
    color: #283b56;
}

.tx_employee_header {
    font-size: 22px;
    font-weight: bold;
    color: #000000;
}

.tx_smallheader {
    font-size: 14px;
    font-weight: bold
}

.tx_mediumheader {
    font-size: 16px;
    font-weight: bold
}

.tx_content_header {
    font-size: 1.2rem;
    line-height: normal;
    font-weight: 600;
    color: #2b3043;
    font-family: Inter;
}

.tr_hide {
    display: none;
}

/* Control Panel */

.cp_title {
    font-size: 20px;
    color: #003399;
}

.cp_tbl tr.cp_tasks {
    display: none;
}

.cp_tbl {
    border: 0px solid Gray;
    height: 100%;
    padding-left: 20px;
}

    .cp_tbl td.cp_headerText {
        font-family: Calibri;
        font-weight: normal;
        font-size: 17px;
        color: #386E16;
        padding: 7px 7px 0px 5px;
    }

    .cp_tbl td.cp_headerTextSmall {
        font-family: Calibri;
        font-weight: normal;
        font-size: 14px;
        color: #386E16;
        padding: 7px 7px 0px 5px;
    }

    .cp_tbl td.cp_image {
        padding: 7px 7px 5px 10px;
    }

    .cp_tbl td.cp_image_details {
        padding-top: 7px;
    }

    .cp_tbl td.cp_link {
        font-family: Calibri;
        font-weight: bold;
        height: 16px;
        font-size: 10pt;
        color: #0066C9;
        padding: 0px 5px;
        text-align: left;
    }

        .cp_tbl td.cp_link:hover {
            font-family: Calibri;
            text-decoration: underline;
            font-weight: bold;
            height: 16px;
            font-size: 10pt;
            color: #0066C9;
            padding: 0px 5px;
            text-align: left;
        }

    .cp_tbl td.cp_link_disabled {
        font-family: Calibri;
        font-weight: bold;
        height: 16px;
        font-size: 10pt;
        color: #999999;
        padding: 0px 5px;
        text-align: left;
    }

    .cp_tbl td.cp_line {
        background: url(Images/desktop_line.png) repeat;
        height: 10px;
        vertical-align: top;
    }

.cp_tbl_header {
    border: solid 0px White;
    height: 55px;
}

    .cp_tbl_header:hover {
        background: url(Images/cp_header_bg.png) repeat;
        border: 1px solid #b9d7fc;
    }

.lc_header {
    font-weight: bold;
    font-size: 17px;
}

.lc_table {
    padding: 30px;
}

.lc_info {
    font-weight: bold;
    padding-top: 7px;
}

.lc_text {
    font-weight: normal;
    padding-top: 7px;
}

.prf_table {
    margin: 0px;
    padding: 0px;
}

.prf_header {
    font-size: 18px;
    font-weight: 500;
    color: #333;
}

.prf_name {
    font-size: 20px;
    font-weight: 500;
    color: #000;
}

.prf_line {
    height: 1px;
    background: url(Images/mnu_line_horz.png) repeat;
}

.prf_label {
    font-size: 13px;
    font-weight: bold;
    height: 20px;
    color: #000000;
}

.prf_text {
    font-size: 13px;
    font-weight: normal;
    height: 20px;
    color: #000000;
}

.prf_image {
    margin-right: 15px;
}

.dlg_text {
    padding-top: 10px;
    font-size: 15px;
    font-weight: 500;
    background: transparent;
}

.dlg_countdown {
    font-weight: bold;
    font-size: 18px;
    color: #59A1E9;
    padding-left: 0px;
    padding-bottom: 15px;
}

.dlg_button {
    padding-left: 7px;
    padding-top: 10px;
}


.inf_header {
    background: url(Images/bg_top_desktop.png) repeat;
    height: 45px;
    font-size: 16px;
    font-family: Calibri, Verdana, Arial;
    font-weight: bold;
    padding-left: 10px;
    color: White;
}

.inf_img {
    background: url(Images/bg_top_desktop.png) repeat;
    height: 40px;
    padding-left: 15px;
}

.inf_text {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    font-family: Calibri, Verdana, Arial;
}

.inf_countdown {
    font-weight: bold;
    font-size: 18px;
    color: #59A1E9;
    padding-left: 7px;
    padding-bottom: 15px;
}

.inf_button {
    padding-left: 7px;
    padding-top: 10px;
}

.dlg_header {
    height: 45px;
    font-size: 16px;
    font-weight: bold;
    padding-right: 10px;
    color: Black;
}

.dlg_img {
    background: url(Images/bg_dlg_header.png) repeat;
    height: 40px;
    padding-left: 15px;
}

.dynamic_header {
    background: url(Images/bg_dynamic_header.png) repeat;
    height: 55px;
    font-size: 16px;
    font-family: Calibri, Verdana, Arial;
    font-weight: bold;
    padding-left: 10px;
    color: #4471b0;
}

.dynamic_img {
    background: url(Images/bg_dynamic_header.png) repeat;
    height: 55px;
    padding-left: 15px;
}

.dynamic_text {
    padding-left: 15px;
    padding-top: 10px;
}

.dynamic_button {
    padding-left: 7px;
    padding-top: 10px;
}


.dxsplPane, .dxsplPaneCollapsed {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 0px;
    background-color: white;
}

    .dxsplCC, .dxsplP {
        width: 100% !important;
        height: 100% !important;
    }


.dxsplVSeparator, .dxsplHSeparator, .dxsplVSeparator, .dxsplHSeparator, .dxsplVSeparatorCollapsed, .dxsplHSeparatorCollapsed {
    padding: 5px;
}

    .dxsplControl, .dxsplVSeparator, .dxsplHSeparator {
        background-color: transparent;
    }


.employeeTasksHeader {
    display: flex;
    align-items: center;
    align-content: center;
    flex-direction: row;
    padding: 0;
    margin: 0 0 10px 0;
}

.desktop_header {
    font-size: 14px;
    font-family: Inter;
    font-weight: bold;
}


    .desktop_header > .dxm-ltr .dxm-main, .dxm-ltr .dxm-horizontal ul.dx {
        padding: 0 !important;
        display: flex !important;
        gap: 5px !important;
    }

    .tasksToolbars {
        border: 0!important;
    }

        .tasksToolbars > ul > li.dxm-item {
            border: 1px solid #e0e0e0;
            border-radius: 5px;
        }

        .tasksToolbars > ul > li.dxm-separator {
            display:none;
            visibility:hidden;
        }

        .tasksToolbars > ul > .primaryButton {
            color: white;
            background: #0B4BE3;
            border-color: #0B4BE3!important;
        }

            .tasksToolbars > ul > .primaryButton.dxm-hovered {
                color: white;
                background: #10358c !important;
                border-color: #10358c !important;
            }



        .contentMasterContentArea > .dxm-ltr .dxm-main, .dxm-ltr .dxm-horizontal ul.dx {
            padding: 0 !important;
            display: inherit !important;
        }

.chart_bg_left {
    font-size: 13px;
    font-weight: normal;
    height: 350px;
    background: url(Images/chart_bg.png) no-repeat;
    background-position: left center;
}

.chart_bg_middle {
    font-size: 13px;
    font-weight: normal;
    height: 350px;
    background: url(Images/chart_bg.png) no-repeat;
    background-position: center center;
}

.chart_bg_right {
    font-size: 13px;
    font-weight: normal;
    height: 350px;
    background: url(Images/chart_bg.png) no-repeat;
    background-position: right center;
}

/* Controls */

.text_box {
    margin: 0;
    outline: 0;
    height: 18px;
}

.text_upper input {
    text-transform: uppercase;
}

/* Web form */

.webform_tbl {
    margin-top: 0;
    margin-left: 0;
}

    .webform_tbl th {
        /*background: url(Images/bg_panel_headerXXX.png) repeat-x 0 0;*/
        border-bottom: 1px solid #a3c0e8;
        text-align: left;
        font-size: 13px;
        color: #4471b0;
        font-weight: bold;
        padding-left: 0px;
        padding-top: 0px;
    }

    .webform_tbl tr {
        padding-top: 5px;
    }


.webpanel_tbl_header th {
    font-family: 'Inter' !important;
    text-align: left;
    font-size: 1rem;
    color: #0B4BE3;
    font-weight: 600;
    padding-left: 0px;
    padding-top: 0px;
}

.info_panel {
    margin-top: 0px;
}

.top_panel {
    margin-bottom: 0;
}

.webForm_header {
    border-bottom: 1px solid #ddd;
    text-align: left;
    padding: 0 0 5px 0;
    color: #0B4BE3;
    font-weight: 600;
    font-size: 14px;
}

.tbl_details_block {
    width: 100%;

}


    .tbl_details_block lbl {
        vertical-align: middle;
    }

    .details_status {
        visibility: visible;
        width: 100%;
        text-align: center;
        font-size: 12pt;
        font-weight: 400;
        padding-top: 50px;
    }

.subtopic_tbl_container {
    border-spacing: 10px;
    border-collapse: initial;
    border: 1px solid #dddddd;
    border-radius: 5px;
}

#ctl00_chDefault_pnlDetails_cpCallbackPanel {
    width: auto !important;
}

#tblDetails


.subtopic_tbl_container .tbl_in_row {
    border-spacing: 10px !important;
}


.dxeRadioButtonList, .dxeCheckBoxList {
    border: 0;
}

    .dxeRadioButtonList, .dxeRadioButtonList table, .dxeCheckBoxList, .dxeCheckBoxList table {
        font: 600 12px 'Inter';
    }

/*.subtopic_tbl_container th {background:#c9def5 url(Images/bg_subtopicXXX.gif) repeat-x 0 0; border-bottom:1px solid #a3c0e8; text-align:left; padding:5px 10px; font-weight:normal; color:#283b56; font-weight:bold;}*/
.subtopic_tbl_container th {
    border-bottom: 1px solid #ddd;
    text-align: left;
    padding: 0 0 5px 0;
    color: #0B4BE3;
    font-weight: 600;
    font-size: 14px;
}

.subtopic_tbl_cell {
    padding: 0;
    vertical-align: middle;
}

.subtopic_tbl_cell_top {
    padding: 0;
    vertical-align: top;
}

.comment_tbl_cell {
    padding: 20px 5px;
    vertical-align: middle;
}

.right_pos_btns {
    text-align: right;
    /*padding:15px 0;*/
    margin-top: 10px;
    float: right;
}

    .right_pos_btns no_margin {
        text-align: right;
        /*padding:15px 0;*/
        margin-top: 0px;
        float: right;
    }

    .right_pos_btns .button,
    .right_pos_btns_adress_popup .button,
    .right_pos_btns_dependant_popup .button,
    .right_pos_btns_bank_acc .button {
        margin-left: 15px;
    }

.right_pos_btns_adress_popup {
    text-align: right;
    padding: 15px 6px 15px 0;
}

.right_pos_btns_dependant_popup {
    text-align: right;
    padding: 15px 6px 15px 0;
    $padding-right: 4px;
}

.right_pos_btns_bank_acc {
    text-align: right;
    padding: 15px 0;
    margin-top: -10px;
}

.right_pos_btns_last {
    text-align: right;
    /*padding:15px 0;*/
    margin-top: 10px;
    margin-right: 10px;
    float: right;
    width: 100%;
}

.right_pos_btns .button_skin {
    float: left;
    margin-left: 10px;
}

.left_pos_btns {
    /*text-align: left;*/
    /*padding:15px 0;*/
    /*margin-top: 10px;*/
    /*float: left;*/
}

    .left_pos_btns no_margin {
        text-align: left;
        /*padding:15px 0;*/
        margin-top: 0px;
        float: left;
    }

    .left_pos_btns .button_skin {
        float: left;
        margin-right: 10px;
    }

.webform_btn_left {
    text-align: left;
    margin-top: 0px;
    float: left;
}

    .webform_btn_left .button_skin {
        float: left;
        margin-right: 10px;
    }

.webform_btn_right {
    text-align: right;
    margin-top: 0px;
    float: right;
}

    .webform_btn_right .button_skin {
        float: left;
        margin-left: 10px;
    }


/****** Navigation Menu Styles *******/

.main_nav_container {
    height: 99%;
    position: absolute;
    width: 226px;
    top: 0;
    left: 0;
    z-index: 0;
}

.nav_menu_container {
    height: 100%;
}

.nav_menu_header_selected {
    background: #e0efff url(Images/bg_menu_head.gif) repeat-x 0 0;
    height: 31px;
    font-size: 13px;
    font-weight: bold;
    line-height: 31px;
    border: 1px solid #92b2dd;
    padding-left: 3px;
    margin: 5px 5px 0px;
}

    .nav_menu_header_selected #nav_menu_lnk_container div {
        cursor: default;
        text-decoration: none;
        color: #000;
    }

    .nav_menu_header_selected div {
        float: left;
        line-height: 31px;
        padding: 0 0 0 3px;
        font-size: 1.2em;
    }

    .nav_menu_header_selected img {
        padding-top: 4px;
    }

.nav_menu_content {
    background: #cfe3fb;
    /*border:1px solid #fff; border-bottom:0; border-right:0;*/
}

    .nav_menu_content ul {
        margin: 0 5px 5px;
    }

    .nav_menu_content li {
        padding: 5px 0;
        background: #e0edff
        /*url(Images/bg_menu_li.gif) repeat-x 0 0*/
        ;
        /*border:1px solid #f5f5f5;*/
        margin-bottom: 0px;
    }

        .nav_menu_content li img {
            /*margin-bottom:-3px;*/
            margin-right: 2px;
            margin-left: 5px;
            /*background:#fff;*/
            padding: 0;
            vertical-align: middle;
        }

        .nav_menu_content li a,
        .nav_menu_content li a:visited {
            text-decoration: none;
            color: #000;
            vertical-align: middle;
        }

            .nav_menu_content li a:hover {
                text-decoration: underline;
                /*color:#f4921b !important;*/
            }

/*.nav_menu_header {border:1px solid #a0a0a0; height:31px; background:url(Images/bg_no_active_header.gif) repeat-x top left; border-bottom:0; border-right:0; cursor:pointer; line-height:31px;}*/
/*.nav_menu_header #nav_menu_lnk_container div {text-decoration:none; color:#000; cursor:pointer; font-weight:bold;}*/
/*.nav_menu_header #nav_menu_lnk_container {display:block; height:31px;}*/
/*.nav_menu_header #nav_menu_lnk_container:hover {background:url(Images/bg_no_active_header_hover.gif) repeat-x top left;}*/

.att_bg_month {
    height: 10px;
    width: 60px;
    background-color: #a8d5ff;
    font-weight: bold;
}


/* Attendance Records grid */
.tbl_attendance_records {
    border: 1px solid Black;
    width: 500px;
    height: 200px;
}

    .tbl_attendance_records td {
        width: 15px;
        font-weight: normal;
        font-size: 9px;
        font-weight: normal;
        color: Black;
        vertical-align: middle;
        text-align: center;
        border: solid 1px #999999;
        background-color: #fff4bc;
    }

    .tbl_attendance_records th {
        text-align: center;
        vertical-align: middle;
        padding: 1px;
        background: url(Images/att_bg_header.png) repeat;
        font-weight: normal;
        font-size: 10px;
        color: White;
        border: solid 1px #999999;
    }

        .tbl_attendance_records th.day_names {
            height: 7px;
            font-size: 9px;
            font-weight: normal;
            text-align: center;
        }

    .tbl_attendance_records td.month_line_free_days {
        background-color: #E3E3E3;
    }

    .tbl_attendance_records td.weekend_day {
        background-color: #EAD098;
    }

    .tbl_attendance_records div.attendance_record {
        width: 100%;
        height: 7px;
        position: relative;
        top: 5px;
    }

    .tbl_attendance_records td.att_leave_start {
        border-left: solid 2px Gray;
        border-top: solid 2px Gray;
        border-bottom: solid 2px Gray;
        cursor: pointer;
        cursor: hand;
    }

    .tbl_attendance_records td.att_leave_mid {
        border-top: solid 2px Gray;
        border-bottom: solid 2px Gray;
        border-left: hidden 0px;
        border-right: hidden 0px;
        cursor: pointer;
        cursor: hand;
    }

    .tbl_attendance_records td.att_leave_end {
        border-right: solid 2px Gray;
        border-top: solid 2px Gray;
        border-bottom: solid 2px Gray;
        cursor: pointer;
        cursor: hand;
    }

    .tbl_attendance_records td.att_leave_full {
        border-right: solid 2px Gray;
        border-top: solid 2px Gray;
        border-bottom: solid 2px Gray;
        border-left: solid 2px Gray;
        cursor: pointer;
        cursor: hand;
    }

    .tbl_attendance_records td.att_leave_overlap {
        border-right: solid 2px Red;
        border-top: solid 2px Red;
        border-bottom: dotted 2px Black;
        border-left: solid 2px Red;
        cursor: pointer;
        cursor: hand;
    }

.tbl_attendance_legends {
}

    .tbl_attendance_legends td {
        vertical-align: top;
        padding-left: 7px;
        font-size: 11px;
    }

        .tbl_attendance_legends td.lg_key {
            width: 15px;
            height: 15px;
        }

        .tbl_attendance_legends td.lg_last_row {
            height: 100%;
        }

/****************************** Login Form Styles *****************************************/




/****************************** Home Page Styles *****************************************/

.home_page_logo {
    background: #f7f7f7 url(Images/logo_home.gif) no-repeat 20px 15px;
    height: 70px;
    padding: 15px 0px 15px 20px;
    border: 1px solid #e3e3e3;
    margin: 10px 10px 0;
}

.home_page_container {
    padding: 10px;
}

.home_page_border {
    border: 1px solid #aecaf0;
    background: #fff url(Images/bg_home_topic.gif) repeat-x 0 0;
    padding: 0 0 0 0;
    border-top: 0;
    height: 100%;
}

.home_page_container p {
    margin: 0.4em 0 1em 0;
    line-height: 1.4em;
    font-weight: bold;
    color: #282828;
}

.home_page_timesheets {
}

    .home_page_timesheets h1 {
        background: url(Images/Folder-Clock-32x32.png) no-repeat 0% 30%;
        padding: 10px 0 20px 40px;
        line-height: 32px;
        font-size: 27px;
        font-weight: normal;
    }

        .home_page_timesheets h1 a,
        .home_page_timesheets h1 a:visited {
            color: #0e5ed5;
        }

            .home_page_timesheets h1 a:hover {
                text-decoration: none;
            }

.home_page_timesheets_datalist a,
.home_page_timesheets_datalist a:visited {
    color: #ff5400;
    text-decoration: none;
    line-height: 140%;
}

    .home_page_timesheets_datalist a:hover {
        text-decoration: underline;
    }

.home_page_reminders {
}

.home_page_reminders_datalist a,
.home_page_reminders_datalist:visited {
    color: #3f66a0;
    text-decoration: underline;
    background: url(Images/home_page_bullet_reminders.gif) no-repeat 0 50%;
    padding-left: 15px;
}

    .home_page_reminders_datalist a:hover {
        text-decoration: none;
    }

.home_page_reminders h1 {
    background: url(Images/alarm-clock.png) no-repeat 0% 30%;
    padding: 10px 0 20px 40px;
    line-height: 32px;
    font-size: 27px;
    color: #0e5ed5;
    font-weight: normal;
}

.home_page_timesheets_datalist table {
    margin-left: 20px;
}

.home_page_container td {
    text-align: left;
    vertical-align: top;
    width: 50%;
    padding-left: 20px;
    padding-right: 20px;
    min-width: 200px;
}

.home_page_container table {
    width: 100%;
    height: 100%;
}

.brace {
    width: 250px;
    height: 0px;
}

/* Panels */

.hide_panel {
    display: none;
}

/************************* Employee Holiday ********************************/
.employee_holiday_details .subtopic_tbl_container {
    margin-bottom: 8px;
}

.employee_holiday_details .subtopic_tbl_cell {
    padding: 4px 5px;
}

.employee_holiday_details_foot .text_box_skin {
    margin-right: 4px;
    $margin-right: 0;
    float: left;
}

.employee_holiday_records_flds {
    margin-left: auto;
    margin-right: 18px;
}

    .employee_holiday_records_flds .text_box_skin {
        margin-left: 4px;
        text-align: right;
    }

/****************************** Tree List Styles *****************************************/

.dxtlControl {
    cursor: default;
    color: black;
    border: 0;
    background: #fff;
    table-layout: fixed;
    margin-top: 5px;
    margin-right: 5px;
    font-family: 'Inter';
}

    .dxtlControl td img,
    .dxtlControl td span {
        vertical-align: middle !important;
    }

.dxtlIndentWithButton {
    padding: 4px 7px 0 !important;
}

/****************************** Jq Grid styles (ui.jqgrid.css) **********************************/
.ui-jqgrid {
    position: inherit;
}

    .ui-jqgrid .ui-jqgrid-view {
        position: relative;
        left: 0px;
        top: 0px;
        padding: .0em;
    }

    /* caption*/
    .ui-jqgrid .ui-jqgrid-titlebar {
        padding: .3em .2em .2em .3em;
        position: relative;
        border-left: 0px none;
        border-right: 0px none;
        border-top: 0px none;
    }

    .ui-jqgrid .ui-jqgrid-title {
        float: left;
        margin: .1em 0 .2em;
    }

    .ui-jqgrid .ui-jqgrid-titlebar-close {
        position: absolute;
        top: 50%;
        width: 19px;
        margin: -10px 0 0 0;
        padding: 1px;
        height: 18px;
    }

        .ui-jqgrid .ui-jqgrid-titlebar-close span {
            display: block;
            margin: 1px;
        }

        .ui-jqgrid .ui-jqgrid-titlebar-close:hover {
            padding: 0;
        }

    /* header*/
    .ui-jqgrid .ui-jqgrid-hdiv {
        position: relative;
        margin: 0em;
        padding: 0em;
        overflow-x: hidden;
        overflow-y: auto;
        border-left: 0px none !important;
        border-top: 0px none !important;
        border-right: 0px none !important;
    }

    .ui-jqgrid .ui-jqgrid-hbox {
        float: left;
    }

    /* padding-right: 20px;overflow: auto; */
    .ui-jqgrid .ui-jqgrid-htable {
        table-layout: fixed;
        margin: 0em;
        border-radius: 5px 5px 0 0;
        background-color: #eee;
    }

        .ui-jqgrid .ui-jqgrid-htable th {
            height: 25px;
            padding: 0 5px;
        }

            .ui-jqgrid .ui-jqgrid-htable th div {
                overflow: hidden;
                position: relative;
                font-family 'Inter' !important;
                text-align: left;
            }

            .ui-th-column,
            .ui-jqgrid .ui-jqgrid-htable th.ui-th-column {
                overflow: hidden;
                white-space: nowrap;
                text-align: center;
                border-top: 0px none;
                border-bottom: 0px none;
            }

            .ui-th-ltr,
            .ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr {
                border-left: 0px none;
            }

            .ui-th-rtl,
            .ui-jqgrid .ui-jqgrid-htable th.ui-th-rtl {
                border-right: 0px none;
            }

    .ui-jqgrid .ui-th-div-ie {
        white-space: nowrap;
        zoom: 1;
        height: 25px;
    }

    .ui-jqgrid .ui-jqgrid-resize {
        height: 20px !important;
        position: relative;
        cursor: e-resize;
        display: inline;
        overflow: hidden;
    }

    .ui-jqgrid .ui-grid-ico-sort {
        overflow: hidden;
        position: absolute;
        display: inline;
        cursor: pointer !important;
    }

    .ui-jqgrid .ui-icon-asc {
        margin-top: -3px;
        height: 12px;
    }

    .ui-jqgrid .ui-icon-desc {
        margin-top: 3px;
        height: 12px;
        margin-left: -1px
    }

    .ui-jqgrid .ui-i-asc {
        margin-top: 0px;
        height: 16px;
    }

    .ui-jqgrid .ui-i-desc {
        margin-top: 0px;
        margin-left: 13px;
        height: 16px;
    }

    .ui-jqgrid .ui-jqgrid-sortable {
        cursor: pointer;
    }

    .ui-jqgrid tr.ui-search-toolbar th {
        border-top-width: 1px !important;
        border-top-color: inherit !important;
        border-top-style: ridge !important
    }

tr.ui-search-toolbar input {
    margin: 1px 0px 0px 0px
}

tr.ui-search-toolbar select {
    margin: 1px 0px 0px 0px
}

/* body */
.ui-jqgrid .ui-jqgrid-bdiv {
    position: relative;
    margin: 0em;
    padding: 0;
    overflow: auto;
    text-align: left;
    border-top: 2px solid #ddd;
}

.ui-jqgrid .ui-jqgrid-btable {
    table-layout: fixed;
    margin: 0em;
}

.ui-jqgrid tr.jqgrow td {
    font-family: 'Inter';
    color: #555;
    font-size: 12px;
    overflow: hidden;
    white-space: pre;
    padding: 8px 5px;
    font-weight: 400;
    border-bottom-width: 1px;
    border-bottom-color: #ddd;
    border-bottom-style: none;
}

.ui-jqgrid tr.jqgfirstrow td {
    padding: 0 2px 0 2px;
    border-right-width: 1px;
    border-right-style: solid;
}

.ui-jqgrid tr.jqgroup td {
    font-weight: normal;
    overflow: hidden;
    white-space: pre;
    height: 22px;
    padding: 0 2px 0 2px;
    border-bottom-width: 1px;
    border-bottom-color: inherit;
    border-bottom-style: solid;
}

.ui-jqgrid tr.jqfoot td {
    font-weight: bold;
    overflow: hidden;
    white-space: pre;
    height: 22px;
    padding: 0 2px 0 2px;
    border-bottom-width: 1px;
    border-bottom-color: inherit;
    border-bottom-style: solid;
}

.ui-jqgrid tr.ui-row-ltr td {
    text-align: left;
    border-right-width: 0;
    border-right-color: #fff;
    border-right-style: solid;
}

.ui-jqgrid tr.ui-row-rtl td {
    text-align: right;
    border-left-width: 0;
    border-left-color: #fff;
    border-left-style: solid;
}

.ui-jqgrid td.jqgrid-rownum {
    padding: 0 2px 0 2px;
    margin: 0px;
    border: 0px none;
}

.ui-jqgrid .ui-jqgrid-resize-mark {
    width: 2px;
    left: 0;
    background-color: #777;
    cursor: e-resize;
    cursor: col-resize;
    position: absolute;
    top: 0;
    height: 100px;
    overflow: hidden;
    display: none;
    border: 0 none;
}

/* footer */
.ui-jqgrid .ui-jqgrid-sdiv {
    position: relative;
    margin: 0em;
    padding: 0em;
    overflow: hidden;
    border-left: 0px none !important;
    border-top: 0px none !important;
    border-right: 0px none !important;
}

.ui-jqgrid .ui-jqgrid-ftable {
    table-layout: fixed;
    margin-bottom: 0em;
}

.ui-jqgrid tr.footrow td {
    font-weight: 400;
    overflow: hidden;
    white-space: nowrap;
    height: 25px;
    padding: 0 2px;
}

.ui-jqgrid tr.footrow-ltr td {
    text-align: left;
    border-right-width: 0;
    border-right-color: inherit;
    border-right-style: solid;
}

.ui-jqgrid tr.footrow-rtl td {
    text-align: right;
    border-left-width: 0;
    border-left-color: inherit;
    border-left-style: solid;
}

/* Pager*/
.ui-jqgrid .ui-jqgrid-pager {
    border-left: 0px none !important;
    border-right: 0px none !important;
    border-bottom: 0px none !important;
    margin: 0px !important;
    padding: 0px !important;
    position: relative;
    height: 25px;
    white-space: nowrap;
    overflow: hidden;
}

.ui-jqgrid .ui-pager-control {
    position: relative;
}

.ui-jqgrid .ui-pg-table {
    position: relative;
    padding-bottom: 2px;
    width: auto;
    margin: 0em;
}

    .ui-jqgrid .ui-pg-table td {
        font-weight: normal;
        vertical-align: middle;
        padding: 1px;
    }

.ui-jqgrid .ui-pg-button {
    height: 19px !important;
}

    .ui-jqgrid .ui-pg-button span {
        display: block;
        margin: 1px;
        float: left;
    }

    .ui-jqgrid .ui-pg-button:hover {
        padding: 0px;
    }

.ui-jqgrid .ui-state-disabled:hover {
    padding: 1px;
}

.ui-jqgrid .ui-pg-input {
    height: 13px;
    font-size: .8em;
    margin: 0em;
}

.ui-jqgrid .ui-pg-selbox {
    font-size: .8em;
    line-height: 18px;
    display: block;
    height: 18px;
    margin: 0em;
}

.ui-jqgrid .ui-separator {
    height: 18px;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    margin: 1px;
    float: right;
}

.ui-jqgrid .ui-paging-info {
    font-weight: normal;
    height: 19px;
    margin-top: 3px;
    margin-right: 4px;
}

.ui-jqgrid .ui-jqgrid-pager .ui-pg-div {
    padding: 1px 0;
    float: left;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    position: relative;
}

.ui-jqgrid .ui-jqgrid-pager .ui-pg-button {
    cursor: pointer;
}

.ui-jqgrid .ui-jqgrid-pager .ui-pg-div span.ui-icon {
    float: left;
    margin: 0 2px;
}

.ui-jqgrid td input,
.ui-jqgrid td select .ui-jqgrid td textarea {
    margin: 0em;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0 5px !important;
}

.ui-jqgrid td textarea {
    width: auto;
    height: auto;
}

.ui-jqgrid .ui-jqgrid-toppager {
    border-left: 0px none !important;
    border-right: 0px none !important;
    border-top: 0px none !important;
    margin: 0px !important;
    padding: 0px !important;
    position: relative;
    height: 25px !important;
    white-space: nowrap;
    overflow: hidden;
}

/*subgrid*/
.ui-jqgrid .ui-jqgrid-btable .ui-sgcollapsed span {
    display: block;
}

.ui-jqgrid .ui-subgrid {
    margin: 0em;
    padding: 0em;
    width: 100%;
}

    .ui-jqgrid .ui-subgrid table {
        table-layout: fixed;
    }

    .ui-jqgrid .ui-subgrid tr.ui-subtblcell td {
        height: 18px;
        border-right-width: 1px;
        border-right-color: inherit;
        border-right-style: solid;
        border-bottom-width: 1px;
        border-bottom-color: inherit;
        border-bottom-style: solid;
    }

    .ui-jqgrid .ui-subgrid td.subgrid-data {
        border-top: 0px none !important;
    }

    .ui-jqgrid .ui-subgrid td.subgrid-cell {
        border-width: 0px 0px 1px 0px;
    }

.ui-jqgrid .ui-th-subgrid {
    height: 20px;
}

/* loading */
.ui-jqgrid .loading {
    position: absolute;
    top: 45%;
    left: 45%;
    width: auto;
    z-index: 101;
    padding: 6px;
    margin: 5px;
    text-align: center;
    font-weight: bold;
    display: none;
    border-width: 2px !important;
}

.ui-jqgrid .jqgrid-overlay {
    display: none;
    z-index: 100;
}

* html .jqgrid-overlay {
    width: expression(this.parentNode.offsetWidth+'px');
    height: expression(this.parentNode.offsetHeight+'px');
}

* .jqgrid-overlay iframe {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: expression(this.parentNode.offsetWidth+'px');
    height: expression(this.parentNode.offsetHeight+'px');
}

/* end loading div */
/* toolbar */
.ui-jqgrid .ui-userdata {
    border-left: 0px none;
    border-right: 0px none;
    height: 21px;
    overflow: hidden;
}

/*Modal Window */
.ui-jqdialog {
    display: none;
    width: 300px;
    position: absolute;
    padding: .2em;
    font-size: 11px;
    overflow: visible;
}

    .ui-jqdialog .ui-jqdialog-titlebar {
        padding: .3em .2em;
        position: relative;
    }

    .ui-jqdialog .ui-jqdialog-title {
        margin: .1em 0 .2em;
    }

    .ui-jqdialog .ui-jqdialog-titlebar-close {
        position: absolute;
        top: 50%;
        width: 19px;
        margin: -10px 0 0 0;
        padding: 1px;
        height: 18px;
    }

        .ui-jqdialog .ui-jqdialog-titlebar-close span {
            display: block;
            margin: 1px;
        }

        .ui-jqdialog .ui-jqdialog-titlebar-close:hover,
        .ui-jqdialog .ui-jqdialog-titlebar-close:focus {
            padding: 0;
        }

    .ui-jqdialog-content,
    .ui-jqdialog .ui-jqdialog-content {
        border: 0;
        padding: .3em .2em;
        background: none;
        height: auto;
    }

    .ui-jqdialog .ui-jqconfirm {
        padding: .4em 1em;
        border-width: 3px;
        position: absolute;
        bottom: 10px;
        right: 10px;
        overflow: visible;
        display: none;
        height: 80px;
        width: 220px;
        text-align: center;
    }

/* end Modal window*/
/* Form edit */
.ui-jqdialog-content .FormGrid {
    margin: 0px;
}

.ui-jqdialog-content .EditTable {
    width: 100%;
    margin-bottom: 0em;
}

.ui-jqdialog-content .DelTable {
    width: 100%;
    margin-bottom: 0em;
}

.EditTable td input,
.EditTable td select,
.EditTable td textarea {
    margin: 0em;
}

.EditTable td textarea {
    width: auto;
    height: auto;
}

.ui-jqdialog-content td.EditButton {
    text-align: right;
    border-top: 0px none;
    border-left: 0px none;
    border-right: 0px none;
    padding-bottom: 5px;
    padding-top: 5px;
}

.ui-jqdialog-content td.navButton {
    text-align: center;
    border-left: 0px none;
    border-top: 0px none;
    border-right: 0px none;
    padding-bottom: 5px;
    padding-top: 5px;
}

.ui-jqdialog-content .CaptionTD {
    text-align: left;
    vertical-align: top;
    border-left: 0px none;
    border-right: 0px none;
    border-bottom: 0px none;
    padding: 1px;
    white-space: nowrap;
}

.ui-jqdialog-content .DataTD {
    padding: 1px;
    border-left: 0px none;
    border-right: 0px none;
    border-bottom: 0px none;
    vertical-align: top;
}

.ui-jqdialog-content .form-view-data {
    white-space: pre
}

.fm-button {
    display: inline-block;
    margin: 0 4px 0 0;
    padding: .4em .5em;
    text-decoration: none !important;
    cursor: pointer;
    position: relative;
    text-align: center;
    zoom: 1;
}

.fm-button-icon-left {
    padding-left: 1.9em;
}

.fm-button-icon-right {
    padding-right: 1.9em;
}

.fm-button-icon-left .ui-icon {
    right: auto;
    left: .2em;
    margin-left: 0;
    position: absolute;
    top: 50%;
    margin-top: -8px;
}

.fm-button-icon-right .ui-icon {
    left: auto;
    right: .2em;
    margin-left: 0;
    position: absolute;
    top: 50%;
    margin-top: -8px;
}

#nData,
#pData {
    float: left;
    margin: 3px;
    padding: 0;
    width: 15px;
}

/* End Eorm edit */
/*.ui-jqgrid .edit-cell {}*/
.ui-jqgrid .selected-row,
div.ui-jqgrid .selected-row td {
    font-style: normal;
    border-left: 0px none;
}

/* Tree Grid */
.ui-jqgrid .tree-wrap {
    float: left;
    position: relative;
    height: 18px;
    white-space: nowrap;
    overflow: hidden;
}

.ui-jqgrid .tree-minus {
    position: absolute;
    height: 18px;
    width: 18px;
    overflow: hidden;
}

.ui-jqgrid .tree-plus {
    position: absolute;
    height: 18px;
    width: 18px;
    overflow: hidden;
}

.ui-jqgrid .tree-leaf {
    position: absolute;
    height: 18px;
    width: 18px;
    overflow: hidden;
}

.ui-jqgrid .treeclick {
    cursor: pointer;
}

/* moda dialog */
.jqmOverlay {
    background-color: #000;
}

* iframe.jqm {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: expression(this.parentNode.offsetWidth+'px');
    height: expression(this.parentNode.offsetHeight+'px');
}

.ui-jqgrid-dnd tr td {
    border-right-width: 1px;
    border-right-color: inherit;
    border-right-style: solid;
    height: 20px
}

/* RTL Support */
.ui-jqgrid .ui-jqgrid-title-rtl {
    float: right;
    margin: .1em 0 .2em;
}

.ui-jqgrid .ui-jqgrid-hbox-rtl {
    float: right;
    padding-left: 20px;
}

.ui-jqgrid .ui-jqgrid-resize-ltr {
    float: right;
    margin: -2px -2px -2px 0px;
}

.ui-jqgrid .ui-jqgrid-resize-rtl {
    float: left;
    margin: -2px 0px -1px -3px;
}

.ui-jqgrid .ui-sort-rtl {
    left: 0px;
}

.ui-jqgrid .tree-wrap-ltr {
    float: left;
}

.ui-jqgrid .tree-wrap-rtl {
    float: right;
}

.ui-jqgrid .ui-ellipsis {
    text-overflow: ellipsis;
    -moz-binding: url('ellipsis-xbl.xml#ellipsis');
}

.ui-searchFilter {
    display: none;
    position: absolute;
    z-index: 770;
    overflow: visible;
}

    .ui-searchFilter table {
        position: relative;
        margin: 0em;
        width: auto
    }

        .ui-searchFilter table td {
            margin: 0em;
            padding: 1px;
        }

            .ui-searchFilter table td input,
            .ui-searchFilter table td select {
                margin: 0.1em;
            }

    .ui-searchFilter .ui-state-default {
        cursor: pointer;
    }

    .ui-searchFilter .divider {
        height: 1px;
    }

        .ui-searchFilter .divider div {
            background-color: black;
            height: 1px;
        }

/* Custom overrides */
.ui-jqgrid tr.ui-row-ltr td.extended-cell {
    font-weight: bold;
}

.ui-jqgrid-sdiv,
.ui-jqgrid-ftable td {
    background: none;
    border-top: 1px solid #ddd;
}

.ui-jqgrid .selected-row td {
    color: #0B4BE3 !important;
    background: none;
    background-color: #0B4BE321;
    font-weight: 500 !important;
}

.ui-jqgrid .ui-jqgrid-bdiv {
    overflow-y: auto;
    overflow-x: hidden;
    height: 45vh;
}

.ui-jqgrid .selected-row td.ui-state-highlight,
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    background-image: none;
    border-top-color: inherit;
    border-top-width: 0px;
}

/********************* New Timesheets page ************************/
.colored-cell {
}

.last-cell {
    background-color: #eee;
    color: #222 !important;
}

.footrow .colored-cell,
.footrow .money-cell {
    font-size: 12px !important;
    padding: 10px 5px !important;
    color: #222 !important;
    background-color: #eee;
    font-weight: 500 !important;
}

.footrow .last-cell {
    background-color: #ddd;
}

.nonworkingday-cell {
    color: #d5d5d5 !important;
}

.holiday-cell {
    color: #835702 !important;
    background-color: #f9f3e7;
    font-weight: 500 !important;
}

.approved-cell {
    color: #166b1e !important;
    background-color: #edf5ee;
    font-weight: 500 !important;
}

.rejected-cell {
    color: #b0282d !important;
    background-color: #fcefef;
    font-weight: 500 !important;
}

.readonly-cell,
.not-editable-cell,
.locked-cell {
    color: #aaa !important;
}



.valerr {
    color: #9a1d1d;
}

a.del-item-link {
    background: none;
    color: #3f66a0
}

/**/
.qtip .qtip-content {
    padding: 10px;
    overflow: hidden;
}

.qtip input,
.qtip textarea {
    font: 500 12px 'Inter';
}

.qtip a:hover {
    text-decoration: none;
    color: #000;
    cursor: pointer;
    font-weight: 500;
}

.qtip a {
    text-decoration: none;
    cursor: pointer;
}

.qtip .qtip-content .qtip-title,
.qtip-cream .qtip-content .qtip-title {
    background-color: #f0de7d;
}

/******************** Select Employee Page **********************/

.select-employee .results-grid-container {
    width: 640px;
    height: 330px;
}

/*********************** Employee Wizard ********************************************/
.employee_wizard_height {
    overflow: auto;
    font-size: 12px;
    font-weight: 500;
}

    .employee_wizard_height .line {
        height: 0px;
        border-top: 1px solid #aca899;
    }

.employee_wizard_noform {
    background: #fff;
}

    .employee_wizard_noform .subtopic_tbl_cell {
        vertical-align: top;
    }

.wizard_btns {
    background: #e3efff;
    border-top: 1px solid #fff;
    padding-top: 9px;
    padding-bottom: 10px;
    padding-right: 15px;
    vertical-align: bottom;
    text-align: right;
}

    .wizard_btns div.inner {
        float: right;
    }

    .wizard_btns .button_skin {
        float: left;
        margin-left: 10px;
    }

.employee_wizard_noform h1 {
    font-size: 1.8em;
}

.employee_wizard_form {
    width: 648px;
}

    .employee_wizard_form h2 {
        font-size: 1.2em;
    }

    .employee_wizard_form th {
        background: #fff;
        text-align: left;
        border-bottom: 1px solid #ccc;
        font-weight: normal;
        padding: 0 0 10px 0;
        margin: 0 0 10px 0;
    }

        .employee_wizard_form th p {
            margin-left: 0px;
            margin-bottom: 0px;
        }

    .employee_wizard_form .subtopic_tbl_cell {
        padding: 3px 8px;
    }

    .employee_wizard_form .wizard_form_block {
        padding-top: 14px;
    }

.wizard_scrolled {
    width: 443px;
}

.wizard_bank_block .text_box_skin {
    margin-bottom: 0;
}

.wizard_holiday_profile .subtopic_tbl_cell {
    padding: 1px 8px;
}

.wizard_hp_1st {
    width: 219px;
}

.wizard_hp_2nd {
    width: 100px;
}

.wizard_grid_foot .inner {
    float: right;
    padding-right: 43px;
}

.wizard_grid_foot .text_box_skin {
    float: left;
    margin-left: 20px;
}

.wizard_img {
    width: 153px;
    height: 300px;
    background: #fff url(Images/img_wizard.jpg) no-repeat 0 0;
}

/**************************** Clock In/Out ********************************/
#ClockInOut .subtopic_tbl_container {
    Width: 400px;
    height: 100px;
}

#ClockInOut table {
    text-align: center;
}

#ClockInOut .center_pos_btns {
    text-align: center;
    margin-top: 10px;
    margin-left: 90px;
}

    #ClockInOut .center_pos_btns .button_skin {
        float: left;
        margin-right: 10px;
        margin-top: 20px;
    }

#ClockInOut .error {
    color: Red
}

/*********************************** Attendance *****************************************/
.attendance_option {
    vertical-align: top;
    padding-top: 26px;
    $padding-top: 24px;
}

    .attendance_option .subtopic_tbl_container {
        margin-top: 10px;
    }

.attendanse_calendar_grid {
    border: 1px solid #88B0E4;
    background: #88B0E4;
}

.attendanse_calendar_header {
    background: url(Images/bg_subtopic.gif) repeat-x 0 0;
    color: #00156E;
    border: 1px solid #88B0E4;
    font-weight: bold;
}

.attendanse_calendar_dayheader {
    background: url(Images/bg_subtopic.gif) repeat-x 0 0;
    color: #00156E;
    border: 1px solid #88B0E4;
    border-width: 0 1px 1px 0;
}

.attendanse_color_cell {
    width: 100%;
    height: 10px;
}

.attendance_IEFix {
    height: 25px;
}

.attendanse_graph {
    height: 27px;
    width: 666px;
}

/* Attendance Records grid 730px 17px*/
.tbl_attendance_records {
    border: solid 1px #5C5C5C;
    width: 930px;
    height: 465px;
}

    .tbl_attendance_records td {
        width: 27px;
        font-weight: normal;
        font-size: 10px;
        color: Black;
        vertical-align: top;
        text-align: center;
        border: solid 1px #5C5C5C;
        background-color: #FFF4BC;
    }

    .tbl_attendance_records th {
        text-align: center;
        vertical-align: middle;
        padding: 1px;
        background-color: #969696;
        font-weight: normal;
        font-size: 10px;
        color: White;
        border: solid 1px #5C5C5C;
    }

        .tbl_attendance_records th.day_names {
            height: 15px;
            font-size: 9px;
            text-align: center;
        }

    .tbl_attendance_records td.month_line_free_days {
        background-color: #E3E3E3;
    }

    .tbl_attendance_records td.weekend_day {
        background-color: #EAD098;
    }

    .tbl_attendance_records div.attendance_record {
        width: 100%;
        height: 20px;
        position: relative;
        top: 5px;
    }

div.attendance_record {
    color: White;
    border: solid 1px black;
    position: absolute;
    height: 16px;
    font-size: 11px;
    vertical-align: middle;
    white-space: nowrap;
    padding: 2px 2px 0px 3px;
    overflow: hidden;
    text-align: center;
}

div.attendance_record_drilldown {
    color: White;
    border: solid 1px black;
    position: absolute;
    height: 3px;
    font-size: 8px;
    vertical-align: top;
    white-space: nowrap;
    padding: 0px 2px 0px 3px;
    overflow: hidden;
    background-color: #CCCCCC;
    cursor: pointer;
}

/********************************** Attendance Statuses *****************************************/
.rectangle {
    text-align: center;
    vertical-align: middle;
    height: 15px;
    margin: 3px 4px
}

.rectangle_fixed {
    height: 15px;
    width: 14px
}

.onTime {
    background-color: Lime;
    border: 1px solid Black
}

.holiday {
    background-color: Yellow;
    border: 1px solid Black
}

.absence {
    background-color: Red;
    border: 1px solid Black;
    color: White;
}

.incomplete {
    background-color: Silver;
    border: 1px solid Black;
}

.late {
    background-color: Aqua;
    border: 1px solid Black;
}

.leftEarly {
    background-color: #6C8F99;
    border: 1px solid Black;
}

.knownAbsence {
    background-color: Green;
    border: 1px solid Black;
    color: White;
}

.clickable {
    cursor: pointer
}

/********************************** Time Card Details *****************************************/
.timeCardHeader {
    font-weight: 600;
    font-size: 14px!important;
    color: var(--accent-main);
}

/********************************* Clocking Attendance Approve ********************************/
.clockingApproveHeader {
    grid-column: 1 / span 2;
    color: #0B4BE3;
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 10px;
}

.clockingApprove {
    grid-column: 1 / span 2;
}


    .clockingApprove > .dxeRadioButtonList td.dxe {
        padding: 0!important;
    }
    /**************************** Enter Timesheets ****************************/
    .gv_payments input.textbox_skin {
        border: 1px solid #aecaf0;
        font-size: 12px;
        height: 16px;
        padding: 2px 0px 3px 0px;
        font-family: 'Inter';
    }

.gv_payments td.group_header {
    font-family: 'Inter';
    color: #0f1d64;
    font-size: 9pt;
    font-weight: bold;
    text-align: center;
}

.gv_payments tr.dxgvDataRow_Aqua {
    height: 30px;
}

/**************************** Expense Documents ****************************/
.treeListContainer {
    width: 100%;
    overflow: scroll;
    background-color: White
}

/**************************** New Job applicant Wizard *********************/
.imageContainer {
    width: 280px;
    height: 280px;
    background-color: #fff
}




/* Removes flicking in iOS Safari*/
.dxgvTable_Aqua {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/*************** Main Details Popup ******************/
.details_age_fld .text_box_skin {
    width: 160px;
    $width: 123px;
}

.novalidate_fld .text_box_skin,
.novalidate_fld .sel_view_combobox {
    margin: 2px;
}

.employee_chekbox {
    padding: 18px 8px 18px 8px;
    $padding: 21px 8px 22px 8px;
}

.employee_master_menu {
    vertical-align: top;
    padding: 10px 0 0 0;
}

    .employee_master_menu ul {
        list-style: none;
        margin-left: 0;
        margin-top: 10px;
    }

        .employee_master_menu ul li {
            margin-top: 3px;
        }

    .employee_master_menu a,
    .employee_master_menu a:visited {
        color: #000;
        text-decoration: none;
        font-weight: 500;
        line-height: 140%;
    }

        .employee_master_menu a:hover {
            text-decoration: underline;
        }

.employee_master_col {
    width: 210px;
    $width: 190px;
}

/********************************* Self-Service Employee User Rules ********************************/
.UserRulesContainer {
    border: 1px solid #b9d1eb;
    margin: 10px;
    width: 320px;
    height: 220px;
    overflow: auto;
    background-color: #fff;
    float: left
}

.UserRuleButtons {
    padding-top: 70px
}

.UserRuleLine {
    height: 0px;
    border-top: 1px solid #aca899;
    border-bottom: 1px solid #fff;
}

.UserRuleNote {
    padding-top: 8px;
    float: left;
}

/********************************* Leave Planner ********************************/
#LeavePlannerDivMain {
    
    overflow: hidden;
    white-space: nowrap;
}

.LeavePlannerOptionsBar {
    border: 1px solid #a3c0e8;
    width: 260px;
    background-color: #fff;
    height: 100%;
    height: 670px;
    overflow-y: scroll
}

    .LeavePlannerOptionsBar .SubHeader {
        background-color: #e1eeff;
        font-weight: bold;
        padding: 5px 10px;
        color: #15428B
    }

    .LeavePlannerOptionsBar .SubTopic {
        padding: 5px;
    }

/****************************** ToolBar Styles **************************************/
#toolbar {
    background: transparent;
    border: 0px;
    margin: 0px;
}

    #toolbar .toolbar_item {
        background: #f0f0f5;
        font-size: 11px;
        text-decoration: none;
        color: #ffffff;
        height: 60px;
        padding: 0px 0px;
        line-height: 11px;
    }

    #toolbar .toolbar_item_hover {
        background:;
        border: 0px solid #3399ff;
        color: #000;
        height: 60px;
        line-height: 11px;
        padding: 0 0px;
    }

.toolbar_disabled {
    opacity: 0.7;
    FILTER: progid:DXImageTransform.Microsoft.BasicImage(Opacity=0.3);
}



#toolbar .dxmMenu_Aqua img {
    height: 16px;
}

.dxmSubMenu_Aqua img {
    height: 16px;
}


.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: 0px solid #ddd;
    background-color: #eee;
    border-radius: 5px 5px 0 0;
    color: #222;
    font-weight: 500;
    font-size: 11px;
    text-transform: uppercase;
}

.ui-widget-content {
    border: 1px solid #ddd;
    background: #fff;
    color: #222222;
    border-radius: 5px;
}

.footrow {
    border: 0;
}

.popup_select_project .dxeEditArea_Aqua {
    font-family: 'Inter' !important;
    border: 1px solid #ddd;
}


.dxpcControl_Aqua #ctl00_pcModalDialog_CLW-1 {
    border: 0px !important;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

#timesheettable {
    margin: 0 0 20px 0;
    display: flex;
    align-items: flex-end;
    gap: 10px;
}


    #timesheettable .ui-jqgrid-labels {
        margin: 0 0 0 10px !important;
    }

.go-button {
    color: #0B4BE3;
    text-decoration: none;
}

    .go-button:hover {
        color: #000;
        text-decoration: none;
    }


.dxeMemoEditAreaSys,
input[type="text"].dxeEditAreaSys,
input[type="password"].dxeEditAreaSys {
    outline: 0 !important;
}

.sel_view_combobox {
    height: 25px !important;
}


.ui-jqgrid .ui-jqgrid-bdiv {
    height: 64vh !important;
}

.dxnbItem_Aqua,
.dxnbLargeItem_Aqua,
.dxnbBulletItem_Aqua {
    font-size: 12px !important;
    font-weight: 400 !important;
    padding: 10px !important;
    font-family: 'Arial' !important;
}

.dxeMemoSys textarea {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 7px 10px;
}

   .dxeMemoEditAreaSys {
    padding: 0px;
    }

.dxeMemoSys td {
    padding: 0;
}

    .dxeTextBoxSys td.dxic, .dxeButtonEditSys td.dxic {
        padding: 0;
        background: transparent !important;
    }


.dxeButtonEditSysWithSpacing td.dxic {
    padding: 0;
}

.dxeButtonEditSys {
    border-spacing: 0;
    height: auto !important;
    font-weight: 500;
    padding: 0;
    background: #fff !important;
}

input[type='text'], input[type="password"] {
    padding: 7px 10px;
    font-size: 14px;
}

.dxic input[type="text"].dxeEditArea {
    padding: 7px;
}

.dxh3d.dxeEditArea {
    background: radial-gradient(ellipse at center, rgba(247,247,247,1) 97%,rgba(247,247,247,1) 0%,rgba(247,247,247,0.71) 0%,rgba(247,247,247,0) 0%) !important;
}
.dxeDisabled, .dxeDisabled td.dxe {
    background: radial-gradient(ellipse at center, rgba(247,247,247,1) 97%,rgba(247,247,247,1) 0%,rgba(247,247,247,0.71) 0%,rgba(247,247,247,0) 0%) !important;
}

.dxeTextBoxDefaultWidthSys, .dxeButtonEditSys {
    width: 100%;
}

.dxFirefox .dxeTextBoxSys td.dxic {padding-left:0;padding-right:0} /* Firefox support */


input:-webkit-autofill,
input:-webkit-autofill:focus {
    transition: background-color 0s 600000s, color 0s 600000s !important;
}






.dxnbGroupHeader_Aqua {
}

#toolbar .dxmMenu_Aqua img {
    height: 16px !important;
}


.dxEditors_edtDropDown_Aqua {
    background-position: 0px 0px !important;
    width: 10px;
    height: 7px;
    background-image: url(Images/down_arrow.svg) !important;
    background-size: 10px 10px;
}

.dxWeb_mHorizontalPopOut_Aqua {
    background-position: 0px 0px !important;
    width: 10px !important;
    background-image: url(Images/down_arrow.svg) !important;
    background-size: 10px 10px;
}

.dxtcControl {
    font: 500 12px 'Inter';
}

.dxtcPageContent, .dxtcPageContentWithTabPositionBottom, .dxtcPageContentWithTabPositionLeft, .dxtcPageContentWithTabPositionRight, .dxtcPageContentWithoutTabs {
    border: 1px solid #dddddd !important;
    border-top-width: 0px !important;
    background: white;
    border-radius: 0 0 5px 5px;
    padding: 20px !important;
}




.dxtcTab, .dxtcTabWithTabPositionLeft, .dxtcTabWithTabPositionBottom, .dxtcTabWithTabPositionRight {
    background-color: #fff;
    border: 1px solid #fff;
    padding: 10px 15px;
    text-align: center;
    color: #444;
}

.dxtcTabHover, .dxtcTabHoverWithTabPositionLeft, .dxtcTabHoverWithTabPositionBottom, .dxtcTabHoverWithTabPositionRight {
    background-color: #eee;
    border: 1px solid #eee;
    padding: 10px 15px;
    text-align: center;
    color: #222;
    border-radius: 5px 5px 0 0;
}

.dxtcActiveTab, .dxtcActiveTabWithTabPositionBottom, .dxtcActiveTabWithTabPositionLeft, .dxtcActiveTabWithTabPositionRight {
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom: 1px solid #fff !important;
    padding: 10px 15px;
    text-align: center;
    color: #000;
    border-radius: 5px 5px 0 0;
}

.dxtcLeftIndentCell {
    display: none;
}

.dxtcTabsCell {
    padding: 0 !important;
}

#report_div {
    border: 1px solid #ddd;
}

#divForm table {
    border-collapse: collapse;
}

.dxeButtonEditButton_Aqua table.dxbebt, .dxeSpinIncButton_Aqua table.dxbebt, .dxeSpinDecButton_Aqua table.dxbebt, .dxeSpinLargeIncButton_Aqua table.dxbebt, .dxeSpinLargeDecButton_Aqua table.dxbebt {
    margin-right: 0 !important;
}

.TEST table tr td {
    border-collapse: separate !important;
    border-spacing: 5px !important;
}

.TEST .dxeBase_Aqua {
    display: block !important;
}

.TEST .dxeButtonEdit_Aqua,
.TEST .dxeTextBox,
.TEST .dxeTextBox_Aqua,
.TEST .dxeMemo,
.TEST .dxeMemo_Aqua,
.TEST .textbox_skin,
.TEST select {
    width: 100% !important;
    margin-bottom: 10px !important;
}

.TEST .dxeMemoSys td {
    padding: 0;
}

.TEST .dxeMemoEditAreaSys, .TEST input[type='text'].dxeEditAreaSys {
    border: 1px solid #bbb;
    padding: 5px !important;
}

    .TEST .dxeMemoEditAreaSys:focus, .TEST input[type='text'].dxeEditAreaSys:focus {
        border-color: #0B4BE3;
    }

.TEST .dxgvFilterRow_Aqua .dxeTextBox_Aqua, .TEST .dxeMemo_Aqua {
    border-right: 0;
    border-bottom: 0;
}

.ui-widget-content:nth-child(even) {
    background-color: #f9f9f9 !important;
}

#master_popup .dxgvDataRow_Aqua:nth-child(even) {
    background-color: #f9f9f9 !important;
}




.dxnbControl td.dxnbCtrl {
    padding: 0px;
}

.dxnbGroupHeader {
    font-weight: bold;
    background-color: transparent;
    border: 0;
    padding: 0;
    font-family: "Inter";
}

    .dxnbGroupHeader td.dxnb {
    }

.dxnbGroupContent {
    width: auto;
    /* height: calc(100vh - 98px); */
    overflow-y: scroll;
    display: block;
    padding: 20px !important;
    border: 0;
    font-family: "Inter";
}

    .dxnbGroupContent > div > table > tbody {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

        .dxnbGroupContent > div > table > tbody > tr {
            white-space: nowrap;
        }

            .dxnbGroupContent > div > table > tbody > tr > td {
                display: block;
            }

.dxnbLargeItemImgTop {
    margin-bottom: 3px;
    height: 0px;
}

.dxnbItem, .dxnbLargeItem, .dxnbBulletItem {
    padding: 6px 12px 7px !important;
}

.dxnbGroupContent > .dxnbItemSelected, .dxnbLargeItemSelected, .dxnbBulletItemSelected, .dxnbItemHover, .dxnbLargeItemHover, .dxnbBulletItemHover {
    background-color: #ececec;
    border: 0px solid #ececec;
    border-radius: 5px
}

td .dxrpLE, td .dxrpRE {
    visibility: collapse;
    display: none;
}

    td .dxrpLE > div, td .dxrpRE > div {
        height: 0 !important;
        width: 0 !important;
    }

#divDetails {
    border-spacing: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #ffffff;
}

table .dxnbControl {
    width: 100%
}

table#tblDetails {
    border-spacing: 10px;
}

#tdTopGridPanel {
    display: block;
    width: 100%;
}

#tblGridPanel > tbody {
    display: flex;
    flex-direction: column;
    gap: 0px;
}

#tblItemPanel > tbody {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0;
}

#tblItemPanel h1 {
    font-size: 1.4em;
}

    #tblItemPanel h1 span {
        font-weight: 500;
    }

#tdDetailsPanel > table {
    width: 100%;
}

#ctl00_chDefault_pnlDetails_cpCallbackPanel_tblForm > tbody > tr > td > table {
    border-spacing: 10px;
    width: 100%!important;
}



#tdDetailsPanel .textbox_skin, #tdDetailsPanel .dxeTextBox_Aqua, #tdDetailsPanel .dxeMemo_Aqua, .dxeTextBox, #tdDetailsPanel .dxeMemo, #tdDetailsPanel. #tdDetailsPanel select {
    width: 100% !important;
}


.WorkPatternShiftPlanGrid > table > tbody > tr {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr!important;
}

.WorkPatternShiftPlanGrid > table > tbody > tr > th {
    grid-column: span 6;!important;
}






iframe body {
    background: #ffffff;
}



.padding10 {
    padding: 10px;
}

.dxeTextBoxSys.form-control {
    display: table !important;
}


.btnUserTypeOne {
    background: #0B4BE3;
    color: white;
    border: 0;
    padding: 8px 16px;
    text-transform: uppercase;
    font-weight: 500;
    border-radius: 4px;
    margin-top: 10px;
}





/* DEFAULT STYLES */

.w400 {width:400px!important;}
.w800 {width: 800px!important;}

.checkboxCompany {
    display: flex;
}

.flexCompany {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    width: 100%; /* Ensures it takes full width of parent */
    box-sizing: border-box;
}

    .flexCompany.row {
        flex-direction: row;
        justify-content: space-between;
        padding: 20px 20px 0 20px;
        align-items: stretch;
    }

    .flexCompany > .box {
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }

        .flexCompany > .box.row {
            flex-direction: row;
            width: 100%;
        }

            .flexCompany > .box.row.buttons {
                justify-content: flex-end;
            }

            .columnCustom {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: 20px;
            }

    .columnCustom > div {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 10px
    }

.rowCustom {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 10px;
}

    .rowCustom > div {
        width: 100%;
    }

    .rowCustom h1, .columnCustom h1 {
        font-size: 1.2rem;
        line-height: 1.2rem;
    }

    .rowCustom h4, .columnCustom h4 {
        margin-bottom: 0px !important;
    }

.flexCompany > .border {
    border: 1px solid #DDDDDD!important;
    background-color: white;
    border-radius: 4px;
    padding: 20px;
    width: 100%;
}

            .flexCompany > .border h4 {
                color: ;
            }


.flexCompany h1, .dx-toolbar-item-content h1 {
    font-size: 19px;
    font-weight: 600;
}

.flexCompany h2 {
    font-size: 14px;
    font-weight: 600;
}

.settings-box {
    border: 1px solid var(--dx-color-border);
    background-color: var(--dx-component-color-bg);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    font-size: 0.875rem;
}

.settings-item {
    padding: 20px;
    gap: 24px;
    display: grid;
    grid-template-columns: 55% 1fr;
    justify-content: space-between;
    align-items: center;
    line-height: 1.3rem;
}

    .settings-item + .settings-item {
        border-top: solid 1px var(--dx-color-border);
    }

.settings-item-header {
    display: grid;
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
    justify-content: space-between;
    grid-template-columns: 50% auto;
}

.gridsCompany .settings-item {
    grid-template-columns: 1fr;
}



#main-content {
    width: 100%;
    height: 100%;
    padding-top: 70px;
    display: flex;
}

.contentMasterNavbar {
    display: block;
    font-size: 12px;
    background: white;
    height: 100%;
    border-right: 1px solid var(--dx-color-border);
}

.contentMasterNavigation {
    display: block;
    background: #1c2230;
    width: 220px;
}

    .contentMasterNavigation > span {
        display: block;
        width: 220px;
    }

.contentMasterContentArea {
    width: 100%;
    height: fit-content;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
}

    .contentMasterContentArea > .box {
        border: 1px solid #e0e0e0;
        width: 100%;
        margin: 0 auto;
        background: white;
        border-radius: 5px;
        display: flex;
        flex-direction: column;
        padding: 20px;
    }


.selectEmployee_tabs, .select-employee {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.selectEmployee_buttons_area {
    display: flex;
    gap: 5px;
}


.dx-widget, .dx-widget input, .dx-widget textarea {
    font-family: var(--unnamed-font-family-inter);
}

.dx-toolbar .dx-toolbar-items-container {
    height: 32px;
}

.dx-datagrid-header-panel {
    padding: 0 0 10px 0;
}

.dx-datagrid-borders > .dx-datagrid-filter-panel {
    border: 0;
    background-color: transparent;
}

.dx-datagrid .dx-datagrid-table .dx-header-row > td:first-child {
    border-top-left-radius: 8px;
}

.dx-datagrid .dx-datagrid-table .dx-header-row > td:last-child {
    border-top-right-radius: 8px;
}

@media screen and (min-width: 90em) {
    .ui-jqgrid .ui-jqgrid-bdiv {
        height: 60vh !important;
    }
}

@media screen and (max-width: 76em) {

    .settings-item {
        grid-template-columns: 1fr;
    }

    .nav > .nav-item > .nav-link {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 90em) {

    .nav > .nav-item > .nav-link {
        font-size: 0.75rem;
    }
}