/*****************/
/* Seacorp Styles */
/*****************/

/* Put in these default styles for the Rich Text Editor */
BLOCKQUOTE, H1, H2, H3, H4, H5, H6, OL, UL {
    font-family: Veranda, Arial, helvetica, sans-serif;
    color: black;
    font-size: 10pt;
}

html {
    overflow-y: scroll;
}
html, body {
    overflow-x: auto; /* Show scrollbar only when needed */
    width: 100%;
}

P {
    font-family: Arial;
    color: black;
    font-size: 10pt;
    padding: 0px;
    margin: 0px;
}


BODY {
    background-color: white;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    text-align: left;
    padding: 0;
    border: 0;
    height: 100%
}

TH {
    vertical-align: top;
    font-size: 10pt;
    font-weight: bold;
    font-family: Arial;
    background-color: #D2DBF0;
}

TD {
    font-weight: normal;
    font-size: 10pt;
    vertical-align: top;
    font-family: Arial;
}

A {
    font-family: Arial;
    font-size: 10pt;
    color: black;
    text-decoration: none;
}

    A:active {
        text-decoration: none;
    }

    A:hover {
        text-decoration: underline;
    }

.alarm_link {
    background-color: #3A6079;
    border-width: 0px;
    color: white;
    padding-top: 2px;
    padding-left: 0px;
    padding-right: 0px;
    cursor: hand;
    font-size: 10px;
    vertical-align: bottom;
}

.a_on_white_bold {
    font-weight: bold;
}

.a_small {
    font-size: 9pt;
}

.a_list {
    color: #606060;
    text-decoration: underline;
}

.a_list_small {
    font-size: 9pt;
    color: #606060;
    text-decoration: underline;
}

.pagetitle {
    font-family: Arial;
    color: Black;
    font-size: 14pt;
    font-weight: normal;
    font-style: normal;
    text-align: right;
    padding-right: 10px;
    vertical-align: middle;
    background-color: #FCB131;
}

.label {
    vertical-align: top;
    font-family: Arial;
    font-size: 10pt;
    background-color: white;
}

INPUT, TEXTAREA, SELECT {
    font-family: Arial;
    font-size: 10pt;
    background-color: white;
}

    input[type=radio] {
        background-color: white;
    }

.radio_button {
    background-color: white;
}

.bold_label {
    vertical-align: middle;
    text-align: left;
    font-size: 10pt;
    font-weight: bold;
    color: #606060;
    font-family: Arial;
    padding-top: 5px;
}

.shaded_button {
    background-color: #919FB7;
    border-width: 0px;
    color: white;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 0px;
    padding-right: 0px;
    cursor: hand;
    font-size: 11px;
    vertical-align: middle;
}

.shaded_button_disabled {
    background-color: #FF0000;
    border-width: 0px;
    color: white;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 0px;
    padding-right: 0px;
    cursor: hand;
    font-size: 11px;
    vertical-align: middle;
}

.shaded_button_top {
    background-color: white;
    border-color: black;
    border-width: 1px;
    border-bottom-width: 0px;
    color: black;
    padding-top: 2px;
    padding-left: 0px;
    padding-right: 0px;
    cursor: hand;
    font-size: 10px;
}

.text_box {
    background-color: white;
    border-color: silver;
    border-style: solid;
    border-width: 1px;
    color: black;
    padding-top: 1px;
    padding-left: 2px;
    padding-right: 0px;
    height: 20px;
    cursor: auto;
    font-size: 13px;
}

.text_box_warning {
    border-width: 1;
    border-style: solid;
    border-color: #d0d0d0;
    background-color: Red;
    color: #FDFEFF;
    padding-top: 1px;
    padding-left: 2px;
    padding-right: 0px;
    height: 20px;
    cursor: auto;
    font-size: 13px;
}

.coloured_text_box {
    background-color: #919FB7;
    border-color: silver;
    border-style: solid;
    border-width: 0px;
    color: white;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 0px;
    height: 22px;
    cursor: auto;
    font-size: 13px;
}

.dropdown_list {
    background-color: #919FB7;
    border-width: 0px;
    color: white;
    padding-top: 3px;
    padding-bottom: 1px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: hand;
    font-size: 11px;
    vertical-align: middle;
    height: 22px;
}

.white_dropdown_list {
    background-color: white;
    border-width: 1px;
    color: black;
    padding-top: 5px;
    padding-bottom: 3px;
    padding-left: 0px;
    padding-right: 0px;
    cursor: hand;
    font-size: 11px;
    vertical-align: middle;
}

.list_box_div {
    height: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: #7F9DB9;
    overflow: hidden;
}

.list_box {
    position: absolute;
    height: 25px;
    top: -2px;
    left: -2px;
}

.top_button {
    background-color: white;
    padding-top: 1px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    border-color: black;
    border-width: 1px;
    color: black;
    font-size: 10px;
}

.header_fill {
    background-color: #6A7D9E;
}

.header {
    background-repeat: repeat;
    background-position: bottom;
    background-position: right;
    background-color: white;
    border-color: white;
    border-width: 1;
    border-style: solid;
}

.header_arrow {
    background-image: url(graphics/rightarrow2.gif);
    background-repeat: no-repeat;
    background-position: center;
    background-color: Transparent;
    width: 20px;
}

.header_spacer {
    background-color: #6A7D9E;
    height: 25px;
    border-color: white;
    border-width: 0px;
    border-top-width: 0px;
    border-left-width: 0px;
    border-bottom-width: 0px;
    border-style: solid;
    color: #FDFEFF;
    font-weight: normal;
    font-family: Arial;
    font-size: 14px;
    vertical-align: middle;
    padding-left: 25px;
}

.footer {
    padding-top: 5px;
    padding-left: 5px;
    font-size: 11px;
}

.username {
    background-color: Transparent;
    border-width: 0px;
    color: #19305A;
    font-weight: normal;
    font-family: Arial;
    font-size: 11px;
    padding-right: 3px;
    padding-top: 3px;
    padding-bottom: 2px;
    text-align: right;
    vertical-align: bottom;
}

.status {
    background-color: #E1E7F5;
    border-width: 0px;
    color: black;
    font-family: Arial;
    font-size: 11px;
    font-weight: normal;
    text-align: right;
    vertical-align: bottom;
}

.left_menu {
    width: 175px;
    background-color: #BFDCFE;
    border-color: #BFDCFE;
    border-width: 0px;
    color: #505050;
    border-style: solid;
    border-top-width: 0px;
    border-right-width: 10px;
    border-left-width: 16px;
    padding-left: 4px;
    white-space: nowrap;
}

.menu_box {
    width: 170px;
    background-color: #FFFFFF;
    border-color: #ABB6C8;
    border-width: 0px;
    color: #505050;
    border-style: solid;
    padding-left: 4px;
    padding-right: 4px;
    white-space: nowrap;
    margin-bottom: 20px;
}

.left_ticker {
    width: 200px;
    background-color: #3A6079;
    border-color: #3A6079;
    border-width: 0px;
    font-family: Arial;
    font-size: 12px;
    color: white;
    font-weight: bold;
    border-style: solid;
    border-width: 0px;
    white-space: nowrap;
}

.left_ticker_heading {
    width: 200px;
    background-color: #3A6079;
    border-color: white;
    border-width: 0px;
    font-family: Arial;
    font-size: 12px;
    color: white;
    font-weight: bold;
    border-style: solid;
    border-width: 0px;
    white-space: nowrap;
}

.left_ticker_frame {
    background-color: #3A6079;
}

.left_ticker_frame_cell {
    background-color: #3A6079;
}

.td_menubox_header {
    padding-left: 5px;
    border-width: 0px;
    background-color: #ABB6C8;
    color: #FDFEFF;
    font-weight: normal;
    font-family: Arial;
    font-size: 13px;
    vertical-align: middle;
    height: 25px;
}

.td_leftmenu {
    padding: 0px;
    white-space: nowrap;
    height: 24px;
    vertical-align: middle;
    background-color: white;
    border-width: 0px;
    border-bottom-width: 0px;
    border-style: solid;
    border-color: #BFDCFE;
    cursor: hand;
}

    .td_leftmenu:hover {
        background: #7A8AA7;
        color: white;
    }

.td_leftmenu_selected {
    padding: 0px;
    padding-left: 2px;
    padding-top: 1px;
    white-space: nowrap;
    border-width: 1;
    border-right-width: 0px;
    border-left-width: 6px;
    border-style: solid;
    border-color: #3A6079;
    height: 24px;
    vertical-align: middle;
    background-color: #ECF1F4;
}

.tree_menu {
    border: 0px;
    border-style: solid;
    border-top-width: 1px;
    border-color: #3A6079;
    padding-top: 5px;
    padding-bottom: 2px;
    padding-left: 0px;
    padding-right: 20px;
    overflow: auto;
}

.a_tree_menu {
    color: black;
    width: 100%;
    padding: 2px;
    padding-left: 4px;
    font-family: Arial;
    font-size: 11px;
    color: Black;
    height: 18px;
    text-decoration: none;
}

    .a_tree_menu:hover {
        background: #F8FCFE;
        text-decoration: none;
        border-width: 1px;
        border-style: solid;
        border-color: #C3D0D8;
    }

    .a_tree_menu:selected {
        background: #F8FCFE;
        text-decoration: none;
    }

.a_tree_menu_hover {
    width: 100%;
    padding: 1px;
    padding-left: 3px;
    color: black;
    font-size: 11px;
    background: #F8FCFE;
    border-width: 1px;
    border-style: solid;
    border-color: #C3D0D8;
    height: 18px;
    text-decoration: none;
}

    .a_tree_menu_hover:hover {
        text-decoration: none;
    }

.a_tree_menu_selected {
    width: 100%;
    padding: 2px;
    padding-left: 4px;
    text-decoration: none;
    background: #F8FCFE;
    border-width: 1px;
    border-style: solid;
    border-color: #C3D0D8;
    font-family: Arial;
    font-size: 11px;
    color: Black;
    height: 18px;
    text-decoration: none;
}

    .a_tree_menu_selected:hover {
        text-decoration: none;
    }

.a_left_menu {
    color: white;
    font-weight: normal;
    width: 100%;
    padding: 4px;
    padding-left: 14px;
}

    .a_left_menu:hover {
        color: black;
        text-decoration: none;
        background: #ECF1F4;
        border-width: 0px;
        border-left-width: 6px;
        border-style: solid;
        border-color: #7DAED7;
        padding-left: 8px;
    }

    .a_left_menu:active {
        color: black;
    }

.a_left_submenu {
    padding-left: 5px;
    padding-top: 5px;
    color: black;
    width: 100%;
    height: 100%;
    font-family: Arial;
    font-size: 11px;
    color: Black;
    text-decoration: none;
    vertical-align: middle;
    white-space: nowrap;
}

    .a_left_submenu:hover {
        background: #7A8AA7;
        text-decoration: none;
        color: white;
    }

.a_left_submenu_selected {
    width: 100%;
    color: black;
    font-size: 11px;
    background: #F8FCFE;
    border-width: 1px;
    border-style: solid;
    border-color: #C3D0D8;
    height: 22px;
    text-decoration: none;
    padding: 1px;
    padding-top: 3px;
    padding-left: 19px;
}

    .a_left_submenu_selected:hover {
        text-decoration: none;
    }

.a_left_menu_selected {
    color: black;
    font-weight: normal;
    background-color: #ECF1F4;
    width: 100%;
    padding: 4px;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 8px;
}

    .a_left_menu_selected:hover {
        background: #F8FCFE;
        text-decoration: none;
        border-width: 1px;
        border-style: solid;
        border-color: #C3D0D8;
        color: black;
        padding-left: 7px;
        padding-top: 2px;
        padding-bottom: 2px;
        padding-right: 3px;
    }

.td_menu_selected {
    background: #fffaca;
}

.pageborder {
    background-color: white;
    border-width: 0px;
    border-bottom-width: 1px;
    border-style: solid;
    border-color: #3A6079;
}

.td_pagecontent {
    width: 100%;
    background-color: white;
    border-color: #3A6079;
    border-style: solid;
    border-width: 1px;
    border-bottom-width: 0px;
    border-top-width: 0px;
    border-left-width: 1px;
    border-right-width: 0px;
    padding-bottom: 0px;
    text-align: justify;
}

.table_tab {
    width: 100%;
    background-color: white;
    border-color: white;
    border-style: solid;
    border-width: 1px;
    border-top-width: 0px;
    text-align: left;
}

.map_header {
    line-height: 20px;
    height: 20px;
    color: white;
    text-align: center;
    font-weight: normal;
    background-color: #3A6079;
    border-color: #3A6079;
    border-width: 1px;
    border-right-width: 0px;
    border-style: solid;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}

.td_tab {
    line-height: 24px;
    height: 24px;
    color: white;
    text-align: center;
    font-weight: normal;
    background-color: #3A6079;
    border-color: white;
    border-top-color: #3A6079;
    border-width: 1px;
    border-right-width: 0px;
    border-style: solid;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}

.td_subtab {
    line-height: 24px;
    height: 24px;
    color: black;
    text-align: center;
    font-weight: normal;
    background-color: #7A8E9E;
    border-color: #7A8E9E;
    border-bottom-color: #7A8E9E;
    border-left-color: white;
    border-width: 1px;
    border-right-width: 1px;
    border-style: solid;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}


.td_subtab_filler {
    line-height: 24px;
    height: 24px;
    color: black;
    text-align: center;
    font-weight: normal;
    background-color: white;
    border-color: #798E9F;
    border-width: 1px;
    border-top-width: 0px;
    border-right-width: 0px;
    border-style: solid;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}

.td_highlightedtab {
    line-height: 23px;
    height: 23px;
    text-align: center;
    font-weight: normal;
    color: black;
    background-color: white;
    border-color: white;
    border-top-color: #5D707E;
    border-left-color: white;
    border-width: 1px;
    border-bottom-width: 0px;
    border-right-width: 0px;
    border-style: solid;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}

.td_highlighted_subtab {
    line-height: 23px;
    height: 23px;
    text-align: center;
    font-weight: normal;
    color: black;
    background-color: white;
    border-color: white;
    border-top-color: #798E9F;
    border-left-color: white;
    border-width: 1px;
    border-bottom-width: 0px;
    border-right-width: 0px;
    border-style: solid;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
}

.a_tab_menu {
    color: white;
    white-space: nowrap;
}

    .a_tab_menu:hover {
        color: white;
        text-decoration: none;
    }

    .a_tab_menu:active {
        color: white;
    }

.a_tab_menu_selected {
    color: black;
    white-space: nowrap;
}

    .a_tab_menu_selected:hover {
        color: black;
        text-decoration: none;
    }

    .a_tab_menu_selected:active {
        color: black;
    }

.notab_window {
    padding: 10px;
    white-space: nowrap;
    border-style: solid;
    border-color: white;
    border-width: 0px;
    border-top-width: 0px;
}

.tab_header {
    padding-top: 6px;
    padding-bottom: 3px;
    padding-left: 5px;
    color: white;
    background-color: #ABB6C8;
    font-weight: bold;
    font-size: 12pt;
    vertical-align: top;
    font-family: Arial;
    border-style: solid;
    border-width: 1px;
    border-bottom-width: 1px;
    border-color: white;
}

.tab_subheader {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 5px;
    color: black; /*#000066;*/
    background-color: #E1E7F5; /*#ddddff;*/
    border-style: solid;
    border-color: white;
    border-width: 0px;
    border-top-width: 1px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    font-weight: bold;
    font-size: 9pt;
    vertical-align: middle;
    font-family: Arial;
    white-space: nowrap;
    text-align: left;
}

.tab_helpheader {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
    color: #7B1821;
    border-width: 0px;
    background-color: white;
    border-style: solid;
    font-weight: bold;
    font-size: 10pt;
    vertical-align: middle;
    font-family: Arial;
    white-space: nowrap;
    text-align: center;
    background-color: #f8e8a6;
}

.tab_window {
    padding: 10px;
    white-space: nowrap;
    border-style: solid;
    border-color: white;
    border-width: 0px;
    border-top-width: 0px;
}

.table_data {
    border-width: 1;
    border-style: solid;
    border-color: #C3D0D8;
    border-collapse: collapse;
    margin: 5;
}

.table_data_no_margin {
    border-width: 1;
    border-style: solid;
    border-color: #C3D0D8;
    border-collapse: collapse;
    margin: 0;
    white-space: nowrap;
}

.table_data_noborder {
    border-width: 0;
    margin: 5px;
    margin-left: 0px;
}


/* Apply a background color to every odd row in the table */
/*.oscillating-table tr:nth-child(odd) {
	background-color: #e0e0e0;*/ /* Light gray color for odd rows */
/*}*/

/* Apply a background color to every even row in the table (optional) */
/*.oscillating-table tr:nth-child(even) {
	background-color: #ffffff;*/ /* White color for even rows (optional) */
/*}*/



.job_list_header {
    text-align: center;
    background-color: #BFDCFE;
    font-size: 9pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    height: 20px;
    border-width: 1;
    border-left-width: 0px;
    border-style: solid;
    border-color: #C3D0D8;
    padding-left: 3px;
    padding-right: 5px;
    white-space: nowrap;
    vertical-align: middle;
}

.sub_total {
    border-width: 0;
    border-bottom-width: 1px;
    border-top-width: 1px;
    border-style: solid;
    border-color: #aaaaaa;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-top: 5px;
    padding-bottom: 5px;
}

.button_row {
    border-width: 0;
    border-bottom-width: 1px;
    border-top-width: 1px;
    border-style: solid;
    border-color: #d0d0d0;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: middle;
    font-family: Arial;
    padding-top: 2px;
    padding-bottom: 2px;
}

.button_row_nonalign {
    border-width: 0;
    border-bottom-width: 1px;
    border-top-width: 1px;
    border-style: solid;
    border-color: #d0d0d0;
    font-weight: normal;
    font-size: 9pt;
    font-family: Arial;
    padding-top: 2px;
    padding-bottom: 2px;
}

.highlighted_button_row {
    border-width: 0;
    border-bottom-width: 1px;
    border-top-width: 1px;
    border-style: solid;
    border-color: #d0d0d0;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: middle;
    font-family: Arial;
    padding-top: 2px;
    padding-bottom: 2px;
    background-color: #eeeeee;
}

.item_row {
    border-width: 0;
    border-style: solid;
    border-color: #dddddd;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: middle;
    font-family: Arial;
    padding-top: 5px;
    padding-bottom: 10px;
    vertical-align: top;
}

.td_data_top_border {
    border-width: 0px;
    border-top-width: 1px;
    border-style: solid;
    border-color: black;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-top: 1px;
    padding-bottom: 1px;
}

.td_data {
    border-width: 1px;
    border-style: solid;
    border-color: #d0d0d0;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 3px;
}

.tr_data {
}

.tr_data_warning {
    background-color: Red;
    color: #FDFEFF;
}

.tr_data_daily_warning {
    background-color: orange;
    color: #FDFEFF;
}

.tr_data:hover {
    background-color: #ABB6C8;
    color: #FDFEFF;
    cursor: hand;
}

.eta-grid-cell {
    text-align: center;
    justify-content: center;
    border-width: 1;
    border-style: solid;
    vertical-align: middle;
    text-align: center;
    border-color: #d0d0d0;
    border-collapse: collapse;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 5px;
    padding-right: 5px;
    white-space: nowrap;
}

.eta-grid-cell-yellow {
    text-align: center;
    justify-content: center;
    border-width: 1;
    border-style: solid;
    vertical-align: middle;
    text-align: center;
    border-color: #d0d0d0;
    border-collapse: collapse;
    font-weight: bold;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 5px;
    padding-right: 5px;
    white-space: nowrap;
    background-color: yellow; /* Background color set to yellow */
}


.td_data_no_wrap {
    border-width: 1;
    border-style: solid;
    vertical-align: middle;
    border-color: #d0d0d0;
    border-collapse: collapse;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 3px;
    white-space: nowrap;
}

/*.td_data_no_wrap-centered {
	display: inline ;
	text-align: center;
	border-width: 1;
	border-style: solid;
	border-color: #d0d0d0;
	font-weight: normal;
	font-size: 9pt;
	vertical-align: top;
	font-family: Arial;
	padding-bottom: 1px;
	padding-top: 1px;
	padding-left: 3px;
	padding-right: 3px;
	white-space: nowrap;
}*/

/*.td_data_no_wrap_oddrow {
	border-width: 1;
	border-style: solid;
	border-color: #d0d0d0;
	font-weight: normal;
	font-size: 9pt;
	vertical-align: top;
	font-family: Arial;
	padding-bottom: 1px;
	padding-top: 1px;
	padding-left: 3px;
	padding-right: 3px;
	white-space: nowrap;
	background-color: lightgray;
}*/

.td_data_no_wrap_warning {
    border-width: 1;
    border-style: solid;
    border-color: #d0d0d0;
    background-color: blue;
    background-color: Red;
    color: #FDFEFF;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 3px;
    white-space: nowrap;
}
.td_data_responsive_warning {
    border-width: 1;
    border-style: solid;
    border-color: #d0d0d0;
    background-color: blue;
    background-color: Red;
    color: #FDFEFF;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 3px;
    white-space: wrap;
}

.td_data_no_wrap_daily_warning {
    border-width: 1;
    border-style: solid;
    border-color: #d0d0d0;
    background-color: orange;
    color: #FDFEFF;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 3px;
    white-space: nowrap;
}

.td_data_noborder {
    border-width: 0;
    border-style: solid;
    border-color: #d0d0d0;
    font-weight: normal;
    font-size: 9pt;
    vertical-align: top;
    font-family: Arial;
    padding-bottom: 1px;
    padding-top: 1px;
    padding-left: 3px;
    padding-right: 3px;
}

.td_data_alt {
    background-color: #F0F3FA;
    vertical-align: top;
    font-size: 9pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    border-width: 1;
    border-style: solid;
    border-color: #d0d0d0;
    padding-top: 1px;
}

.th_data {
    background-color: #D4CAB6;
    vertical-align: middle;
    text-align: center;
    font-size: 10pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    border-width: 1;
    border-style: solid;
    border-color: #C3D0D8;
    padding-left: 5px;
    padding-right: 5px;
    height: 20;
}

.th_data_nonalign {
    background-color: #D4CAB6;
    font-size: 10pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    height: 25px;
    border-width: 1;
    border-style: solid;
    border-color: #C4B89C;
    padding-left: 3px;
    padding-right: 5px;
}

.th_data_nonalign_small_text {
    background-color: #D4CAB6;
    font-size: 9pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    height: 100px;
    border-width: 1;
    border-style: solid;
    border-color: #C4B89C;
    padding-left: 3px;
    padding-right: 5px;
    white-space: nowrap;
    vertical-align: middle;
}

.th_data_rotated_text {
    background-color: #D4CAB6;
    font-size: 9pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    height: 100px;
    border-width: 1;
    border-style: solid;
    border-color: #C4B89C;
    padding-left: 3px;
    padding-right: 5px;
    white-space: nowrap;
    vertical-align: bottom;
}

.th_data_nonalign_noborders {
    background-color: #ECF1F4;
    vertical-align: middle;
    font-size: 10pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    border-width: 0;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-style: solid;
    border-color: #C3D0D8;
    padding-left: 3px;
    padding-right: 5px;
    height: 20;
}

.td_data_header {
    background-color: white;
    vertical-align: top;
    font-size: 10pt;
    font-weight: normal;
    font-family: Arial;
    color: black;
    border-width: 0;
    border-style: solid;
    border-color: black;
    padding: 2px;
    padding-left: 5px;
    padding-right: 5px;
}

.a_on_white {
    color: #404040;
}

    .a_on_white:hover {
        color: #404040;
    }

    .a_on_white:active {
        color: #404040;
    }

.helplogo {
    background-color: Transparent;
    border-width: 0px;
    border-color: Black;
    border-style: solid;
    border-bottom-width: 0px;
    color: white;
    font-weight: normal;
    padding-top: 2px;
    padding-bottom: 0px;
    padding-right: 6px;
    text-align: right;
    vertical-align: middle;
}

    .helplogo:hover {
        color: white;
    }

.agency_home_header {
    background-color: #ABB6C8;
    color: #FDFFFF;
    text-align: center;
    vertical-align: middle;
    font-size: 16pt;
    font-family: Arial;
}

.home_page_button {
    background-color: #ABB6C8;
    color: #FDFFFF;
    text-align: left;
    vertical-align: middle;
    padding-left: 45px;
    height: 100px;
    font-size: 20pt;
    font-family: Arial;
}

.agency_home_page_button {
    background-color: #ABB6C8;
    color: #FDFFFF;
    text-align: center;
    vertical-align: middle;
    height: 100px;
    width: 150px;
    font-size: 16pt;
    font-family: Arial;
}

.drag {
    position: relative;
    cursor: pointer;
}

/* Pop up Calender styles */
/* Default attributes of table container for entire calendar */
.table-style {
    font-family: Veranda, Arial, helvetica, sans-serif;
    border-width: 1;
    border-style: solid;
    border-color: #a0a0a0;
    background-color: #ffffff;
    font-family: arial;
    font-size: 11px;
}

/* Default attributes of DIV containing table container for entire calendar.
 * You probably don't want to alter this style.
 */
.div-style {
    z-index: 999;
    position: absolute;
    visibility: hidden;
}

/* Default attributes used in calendar title (month and year columns).*/
.title-style {
    padding: 2px;
    font-family: Veranda, Arial, helvetica, sans-serif;
    font-size: 11px;
    color: #ffffff;
}

/* Default attributes used in calendar title background.*/
.title-background-style {
    /*background-color: #cee3ef;*/
    background-color: #9f9fff
}

/* Normal appearance of controls in calendar title. */
/* Note: The right, left and down icons are images, which must be edited if you need to change them. */
.title-control-normal-style {
    border-style: none;
    /*	border-width: 1;
	border-color: black; */
    cursor: default;
}

/* Moused-over (selected) appearance of controls in calendar title. */
.title-control-select-style {
    /*border-style: solid;
	border-width: 1;
	border-color: #3a6ea5; */
    cursor: default;
}

/* Default attributes of drop down lists (month and year). */
.dropdown-style {
    font-family: Veranda, Arial, helvetica, sans-serif;
    font-size: 11px;
    border-width: 1;
    border-style: solid;
    /*border-color: #a0a0a0;
	background-color: #cee3ef;*/
    background-color: #0066cc;
    border-color: #cccccc;
    color: White;
    cursor: default;
}

/* Default attributes selected (mouse-over) item in drop down lists (month and year). */
.dropdown-select-style {
    background-color: #3a6ea5;
    cursor: hand;
}

/* Default attributes unselected (mouse-off) item in drop down lists (month and year). */
.dropdown-normal-style {
    background-color: #000000;
}

/* Attributes of current day in calendar body. */
.current-day-style {
    /*color: red;*/
    color: red;
    font-weight: bold;
    text-decoration: none;
}

/* Attributes of end-of-week days (Sundays) in calendar body. */
.end-of-weekday-style {
    color: #909090;
    text-decoration: none;
}

/* Attributes of all other days in calendar body. */
.normal-day-style {
    color: black;
    text-decoration: none;
}

/* Attributes of border around selected day in calendar body. */
.selected-day-style {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
    color: #0066cc;
    font-weight: bold;
}

/* Default attributes of designated holidays. */
.holiday-style {
    background-color: #FFDDDD;
}

/* Attributes of today display at bottom on calendar */
.today-style {
    padding: 0px;
    color: white;
    /*background-color: #cee3ef;*/
    background-color: #9f9fff;
    text-align: center;
    text-decoration: none;
}

/* Attributes of week number division (divider.gif) */
.weeknumber-div-style {
}

.scrollable {
}

.rotated_text {
    width: 15px;
    font-size: 9pt;
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* IE6,IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)"; /* IE8 */
    -moz-transform: rotate(-90.0deg); /* FF3.5+ */
    -ms-transform: rotate(-90.0deg); /* IE9+ */
    -o-transform: rotate(-90.0deg); /* Opera 10.5 */
    -webkit-transform: rotate(-90.0deg); /* Safari 3.1+, Chrome */
    transform: rotate(-90.0deg); /* Standard */
}

.rotate {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); /* IE6,IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; /* IE8 */
    -moz-transform: rotate(-90.0deg); /* FF3.5+ */
    -ms-transform: rotate(-90.0deg); /* IE9+ */
    -o-transform: rotate(-90.0deg); /* Opera 10.5 */
    -webkit-transform: rotate(-90.0deg); /* Safari 3.1+, Chrome */
    transform: rotate(-90.0deg); /* Standard */
}

.menu-toggle-button {
    z-index: 1000;
    background: #333;
    color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 20px;
}

.hidden {
    display: none !important;
}

.full-width {
    flex: 1 0 100% !important;
}

.left_menu {
    transition: all 0.3s ease;
    /* Your existing left menu styles */
}

/* Resizable table */
/* Responsive table container */
.table-container {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 10px;
}

/* Responsive task table */
.responsive-task-table {
    width: 100%;
    min-width: 420px; /* Minimum width before scrolling */
    table-layout: fixed;
    border-collapse: collapse;
    overflow-x: auto;
}

/* Column width classes */
.step-column {
    width: 40px;
    max-width: 40px !important;
}

.timeframe-column {
    width: 80px;
    max-width: 140px;
}

.taskno-column {
    width: 25px;
    max-width: 50px;
}

.icon-column {
    width: 25px;
    max-width: 50px;
}

.task-column {
    min-width: 490px;
}

.notes-column {
    width: 25px;
    max-width: 40px;
}

.completed-column {
    width: 73px !important; /* Fixed width */
    min-width: 73px !important; /* Prevents shrinking */
    max-width: 73px !important; /* Prevents growing */
}

.th_data.completed-column {
    width: 73px !important;
    min-width: 73px !important;
    max-width: 73px !important;
}

.notrequired-column {
    width: 70px;
    max-width: 70px;
}

.completedby-column {
    width: 80px;
    max-width: 80px;
}

.followup-column {
    width: 80px;
    max-width: 80px;
}

/* Auto-resize textbox */
.auto-resize-textbox {
    resize: none;
    overflow-y: hidden;
    min-height: 34px; /* Approx 1 line height */
    max-height: 204px; /* Approx 6 lines (34px * 6) */
    line-height: 1.5;
    padding: 6px 12px;
    box-sizing: border-box;
    width: 100%;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* For warning state */
.text_box_warning.auto-resize-textbox {
    /* Your warning styles here */
}

/* Layout */
.page-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.header-section {
    background-color: #2c3e50;
    color: white;
    padding: 0px 0;
}

.main-content-wrapper {
    display: flex;
    flex-direction: row;
    flex: 1;
}

.left-menu-section {
    width: 175px;
    background-color: #BFDCFE;
    border-color: #BFDCFE;
    border-width: 0px;
    color: #505050;
    border-style: solid;
    border-top-width: 0px;
    border-right-width: 10px;
    border-left-width: 16px;
    padding-left: 4px;
    white-space: nowrap;
    font-weight: normal;
    font-size: 10pt;
    vertical-align: top;
    font-family: Arial;
    transition: all 0.3s ease;
}
    /* Collapsed State */
    .left-menu-section.collapsed {
        width: 35px !important; /* Only show toggle button */
        border-right-width: 0px;
        border-left-width: 0px;
        padding-left: 0px !important;
    }
        .left-menu-section.collapsed .left_menu {
            visibility: hidden;
            position: absolute;
        }

        /* Keep the toggle button visible when collapsed */
        .left-menu-section.collapsed .menu-toggle-btn {
            visibility: visible;
            position: relative;
            left: 0;
            top: 0;
            margin-left: 5px;
        }
.content-section {
    flex: 1;
    padding: 0px;
    overflow: auto;
}

.content-area {
    overflow-x: auto;
    width: auto;
    padding-bottom: 20px;
}

.page-header {
    display: flex;
    justify-content: space-between; /* Distributes space between children */
    align-items: center; /* Vertically centers items */
    padding: 0px;
    background-color: #ABB6C8;
    border-bottom: 1px solid #ddd; /* Optional border */
}

.page-title {
    display: flex;
    padding-top: 6px;
    padding-bottom: 3px;
    padding-left: 5px;
    color: white;
    background-color: #ABB6C8;
    font-weight: bold;
    font-size: 12pt;
    vertical-align: top;
    font-family: Arial;
}
/* Wrap the table in a scrollable container */
.tblTasks-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    margin-bottom: 20px;
    border: 1px solid #C3D0D8; /* Match your border color */
}

#frameTable {
    overflow-y: auto; /* Show scrollbar only when needed */
    overflow-x: hidden; /* Prevent horizontal scrolling */
    display: block;
    width: 100%;
    border: none; /* Remove iframe border */
}