@import url("/library/newmain.css");
/*@import url("/library/reset.css");*/
/* GENERIC */
html, body, form {
    padding: 0;
    margin: 0;
}

body {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-style: normal;
    line-height: 150%;
    font-weight: normal;
    font-variant: normal;
}


a.DesktopModuleTitle {
    color: #FFFFFF;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    font-weight: bold;
    text-decoration: none;
    padding: 3px;
}

    a.DesktopModuleTitle:hover {
        color: #FFFFFF;
        text-decoration: underline;
    }

    a.DesktopModuleTitle:visited {
        color: #FFFFFF;
        text-decoration: none;
    }

table tr.DesktopHead {
    /*background: #428EC6;*/
    background: #4a92c6;
}

table tr td.DesktopHead {
    /*background: #428EC6;*/
    background: #4a92c6;
    vertical-align: middle;
}

.DesktopModuleContentTable {
    padding-left: 0px;
    padding-right: 0px;
    border: 1px solid #aec8d7;
    background: #ffffff;
    margin-bottom: 10px;
}

.CompanyName {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 10pt;
    color: #fff;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    margin-left: 10px;
    margin-top: 10px;
    float: left;
}

@media only screen and (max-width: 800px) {
    .CompanyName {
        display: none;
    }
}

.Login_CompanyName {
    font-family: Arial,Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 10pt;
    color: #122142;
    font-weight: bold;
    text-transform: none;
    background-color: #e6f1f3;
    padding: 5px 5px 5px 5px;
    display: block;
}

.Login_Banner {
    height: 100px;
    width: 500px;
    background-image: url(/images/login_banner.jpg);
    background-size: cover; /* <------ */
    background-repeat: no-repeat;
    background-position: center center; /* optional, center the image */
}

.Login_Form {
    border-top: 2px solid #eeeeee;
    border-right: 2px solid #008080;
    border-left: 1px solid #eeeeee;
    border-bottom: 2px solid #008080;
    margin: 0 auto;
    width: 500px;
}

.Login_Table_Outer {
    background-color: #d0e8ec;
}

.Login_Table {
    margin: 0 auto;
    width: 400px;
}

.Login_ResendPassword {
    background-color: #bbe0e9;
    padding: 5px;
}

.T1 {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 12pt;
    color: #477311;
    padding-left: 2px;
    padding-top: 6px;
    padding-bottom: 5px;
    font-weight: bold;
}

.T2 {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 11pt;
    line-height: 150%;
    color: #808000;
    font-weight: bold;
    padding-top: 6px;
    padding-bottom: 5px;
}

.T3 {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 10pt;
    padding-bottom: 1px;
    padding-top: 5px;
    color: #004ee3;
    font-weight: bold;
}

H1 {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 14pt;
    line-height: 150%;
    font-weight: Bold;
    color: #626294;
}

H2 {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 12pt;
    line-height: 150%;
    font-weight: Bold;
    color: #666666;
}

H3 {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

.HR {
    line-height: 150%;
    color: #CED7E7;
}

.SPACE10 {
    /*position: relative;*/
    padding: 0;
    height: 10px; /* works only if parent container is assigned a height value */
}

td {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    font-style: normal;
    line-height: 150%;
}


A {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    text-decoration: none;
    color: #0060A6; /*color: #5a7490;*/
}

    A:hover {
        text-decoration: underline;
        color: #0060A6; /*color: #5a7490;*/
    }

    A:visited {
        text-decoration: none;
        color: #0060A6; /*color: #5a7490;*/
    }

.Normal {
    line-height: 150%;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 0.9rem;
}

table tr .ModuleHead_BG {
    background: #fff;
    padding-bottom: 5px;
    padding-top: 5px;
    padding-left: 5px;
}

table tr td.ModuleHead {
    background: #4A92C6;
    color: #fff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    padding-bottom: 7px;
    padding-top: 7px;
    padding-left: 5px;
}

table tr td.ModuleHead_Gray {
    background: #6B656B;
    color: #fff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 5px;
}


table tr td.ModuleHead_Admin {
    background: #6B656B;
    color: #fff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 5px;
}

table tr td.LeftPanel_BG {
    background: #E7EBF7 url(/images/LeftPanel_bg.jpg) repeat-y;
}

table tr td.LeftPanel_Sep {
    background: url(/images/LeftPanel_Border_bg.gif) repeat-y;
}

table tr td.LeftPanel_Sep2 {
    /** background: url(/images/bg_vline_dot.gif) repeat-y ; **/
    background: url(/images/LeftPanel_Border_bg.gif) repeat-y;
}


table tr td.LeftPanel_Admin_BG {
    background: #EEEEEE;
}

table tr td.ModuleHead_BG {
    background: #D6EBFF;
}

table tr td.LeftPanel_Right {
    background: #A5BEDE url(/images/LeftPane_Right_bg.gif) repeat-y;
}

table tr td.LeftPanel_Left {
    background: #A5BEDE url(/images/LeftPane_Left_bg.gif) repeat-y;
}

table tr td.LeftPanel_Top {
    background: #ADBED6 url(/images/LeftPane_Top_bg.gif) repeat-x;
}

table tr td.LeftPanel_Bottom {
    background: #A5BEDE url(/images/LeftPanel_Bottom_bg.gif) repeat-x;
}

/***************************************************************/

.ModuleTitle {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 14pt;
    color: #549700;
}



.DesktopSection {
    font-family: Tahoma, Arial;
    font-size: 14pt;
    color: #FF8A21;
}


.DesktopBold {
    font-family: Arial, Tahoma;
    font-size: 9pt;
    color: #000084;
    font-weight: bold;
}

.UserOnline_LI {
    font-size: 9pt;
    list-style: disc;
    padding-left: 0px;
    color: Black;
}


a.menu {
    font-weight: Bold;
    color: White;
    padding-left: 5px;
    height: 26px;
    margin: 0px;
    padding-top: 5px;
}

    a.menu:Hover {
        font-weight: Bold;
        color: #EFEFEF;
        padding-left: 5px;
        height: 26px;
        margin: 0px;
        padding-top: 5px;
    }

a.SOmenu {
    font-weight: Bold;
    color: black;
    padding-left: 5px;
    height: 26px;
    margin: 0px;
    padding-top: 5px;
}

    a.SOmenu:Hover {
        font-weight: Bold;
        color: black;
        padding-left: 5px;
        height: 26px;
        margin: 0px;
        padding-top: 5px;
    }

a.white {
    font-weight: Normal;
    color: White;
    padding-left: 5px;
    height: 26px;
    margin: 0px;
    padding-top: 5px;
}

    a.white:Hover {
        font-weight: Normal;
        color: #CCCCCC;
        padding-left: 5px;
        height: 26px;
        margin: 0px;
        padding-top: 5px;
    }

.SubHead {
    color: #1D4B5B;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 8pt;
}

.PersonalLink {
    color: #ffffff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 8pt;
}

a.PersonalLink:hover {
    text-decoration: underline;
    color: white;
}

a.PersonalLink:visited {
    text-decoration: none;
    color: white;
}

.LinkWhite {
    color: White;
    font-weight: bold;
    font-family: Tahoma, Verdana, Arial, helvetica, sans-serif, Times New Roman;
    font-size: 8pt;
}

.MenuLink {
    color: black;
    font-weight: bold;
    font-family: Tahoma, Verdana, Arial, helvetica, sans-serif, Times New Roman;
    font-size: 8pt;
    padding-left: 10px;
}

.MenuSubLink {
    color: black;
    font-family: Tahoma, Verdana, Arial, helvetica, sans-serif, Times New Roman;
    font-size: 8pt;
    padding-left: 10px;
}

/*
.MenuLink A:Hover {
	 PADDING-LEFT: 20px; COLOR: #CEFF00; 
}
*/
.MenuLink A:visited {
    padding-left: 20px;
    color: black;
}


/* text style for buttons and link buttons used in the portal admin pages */
.CommandButton {
    font-weight: bold;
}

.NormalRed {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    color: #FF0000;
}

.NormalBlue {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    color: blue;
}

.NormalBold {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    font-weight: bold;
}

.NormalBold_Gray {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    font-weight: bold;
    color: gray;
}

.Error_Message {
    padding-bottom: 10px;
    padding-top: 10px;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 10pt;
    color: #FF0000;
    font-weight: bold;
}

.basic-table {
    text-align: justify;
    font-family: Verdana, Tahoma, Arial, Times New Roman, helvetica, sans-serif;
    font-size: 8pt;
    line-height: 150%;
}

    .basic-table td {
        padding-right: 0.7em;
        padding-left: 0.7em;
        padding-bottom: 0.4em;
        padding-top: 0.4em;
    }

    .basic-table TH {
        padding-right: 1em;
        padding-left: 1em;
        padding-bottom: 0.5em;
        padding-top: 0.5em;
        text-align: left;
    }

table tr.dark td {
    background: #006AA4;
    color: #fff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.gray {
    background: #ddd;
}

    table tr.gray td {
        color: #000;
        font-weight: bold;
    }

td.date {
    white-space: nowrap;
}

td.number {
    text-align: right;
}

table tr.light td {
    background: #EEEEEE;
    color: #fff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.light {
    background: #EEEEEE;
}

    table tr.light td {
        color: black;
        font-weight: bold;
    }

table tr.blue td {
    background: #085075;
    color: #ffffff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.blue {
    background: #085075;
}

table tr.LightCyan td {
    background: #E0FFFF;
    color: Black;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.LightCyan {
    background: #E0FFFF;
}

table tr.LightBlue td {
    background: #ADD8E6;
    color: Black;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.LightBlue {
    background: #ADD8E6;
}

table tr.lightseagreen td {
    background: #20B2AA;
    color: Black;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.lightseagreen {
    background: #20B2AA;
}


table tr.lightskyblue td {
    background: #87CEFA;
    color: Black;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.lightskyblue {
    background: #87CEFA;
}

table tr.peachpuff td {
    background: #FFDAB9;
    color: Black;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.peachpuff {
    background: #FFDAB9;
}


table tr.PortalTR td {
    background: #eeeeee;
    color: Black;
    vertical-align: middle;
    font-weight: bold;
    font-family: Arial, Times New Roman, verdana;
}

table tr.PortalTR {
    background: #eeeeee;
}

.form-table {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
}

    .form-table tr td {
        padding: 3.2px 8px 3.2px 11.2px;
    }

    .form-table > tr td.form-table-cell-padding-0 {
        padding: 0;
    }

td.form-table-cell-padding-0 tr td {
    padding: 0;
}

.small-table {
    font-family: Verdana, Arial, Tahoma, Times New Roman, helvetica, sans-serif;
    font-size: 8pt;
}

    .small-table td {
        padding-right: 0.5em;
        padding-left: 0.7em;
        padding-bottom: 0.5em;
        padding-top: 0.5em;
        font-family: Verdana, Arial, Tahoma, Times New Roman, helvetica, sans-serif;
        font-size: 8pt;
    }

    .small-table A {
        font-family: Verdana, Arial, Tahoma, Times New Roman, helvetica, sans-serif;
        font-size: 8pt;
    }

.small {
    font-family: Verdana, Arial, Tahoma, Times New Roman, helvetica, sans-serif;
    font-size: 8pt;
}

.menu-table {
    text-align: justify;
    font-family: Tahoma, Verdana, Arial, Times New Roman, helvetica, sans-serif;
    font-size: 8pt;
    line-height: 130%;
}

    .menu-table td {
        padding-right: 1em;
        padding-left: 1em;
        padding-bottom: 0.4em;
        padding-top: 0.4em;
        color: #FFFFFF;
    }

    .menu-table A {
        font-family: Verdana, Tahoma, Times New Roman, Arial, helvetica, sans-serif;
        font-size: 8.5pt;
        line-height: 150%;
        text-decoration: none;
        color: #FFFFFF;
    }



a.NormalLink {
    font-family: Tahoma, Verdana, Times New Roman, Arial, helvetica, sans-serif;
    font-size: 9pt;
    color: #235667;
    font-weight: bold;
}

    a.NormalLink:hover {
        color: #32409B;
    }

.BigLink {
    font-family: Tahoma, Verdana, Times New Roman, Arial, helvetica, sans-serif;
    font-size: 10pt;
    color: #739CAF;
    font-weight: bold;
}

a.BigLink:hover {
    color: #32409B;
}

.TextBox {
    padding: .12em 0 .1em .12em;
    margin-left: 4px;
}

.TextBox_Shadow {
    color: #000;
    font-family: Verdana, Times New Roman, Arial, Tahoma, helvetica, sans-serif;
    font-size: 8pt;
    padding: .12em 0 .1em .12em;
    border-style: solid;
    border-width: 1px;
    border-color: #96A6C5;
    background-color: #EFEFEF;
    height: 23px;
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 5px;
    -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 5px;
    -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 5px;
}

.CheckBox {
    color: #000;
    font-family: Verdana, Times New Roman, Arial, Tahoma, helvetica, sans-serif;
    font-size: 8pt;
    padding: .0em 0 .0em .0em;
    margin: 0px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 15px;
    padding-left: 0px;
}
/*
button
{
	border: none;
	padding: 5px 30px;
	border-radius: 4px;
	background: lightgreen;
}
*/

.Button {
    font-family: Tahoma, Times New Roman, Arial, Verdana;
    color: #000;
    font-weight: bold;
    font-size: 8pt;
    text-align: center;
    padding: .4em .3em .4em .3em;
    border-color: #fff #999 #999 #fff;
    border-width: 1px;
}

    .Button:active {
    }

.formbutton {
    font-family: Tahoma, Times New Roman, Arial, Verdana;
    color: #000;
    font-weight: bold;
    font-size: 8pt;
    text-align: center;
    padding: .2em 0 .1em .2em;
    border-style: solid;
    border-width: 1px;
    border-color: #fff #999 #999 #fff;
}

.formbutton_disabled {
    color: gray;
    font-weight: bold;
    font-size: 8pt;
    text-align: center;
    padding: .2em 0 .1em .2em;
    border-style: solid;
    border-width: 1px;
    border-color: #fff #999 #999 #fff;
    background: #ddd url(/images/button_bg_gray.gif) repeat-x;
}


.formcontrol {
    color: #000;
    font-family: Verdana, Times New Roman, Arial, Tahoma, helvetica, sans-serif;
    font-size: 8pt;
    padding: .12em 0 .1em .12em;
    border-style: solid;
    border-width: 1px;
    border-color: #96A6C5;
    background-color: #EFEFEF;
}

.TextControl {
    color: #000;
    font-family: Verdana, Times New Roman, Arial, Tahoma, helvetica, sans-serif;
    font-size: 8pt;
    padding: .12em 0 .1em .12em;
    border-style: solid;
    border-width: 1px;
    border-color: #96A6C5;
    background-color: #EFEFEF;
    height: 23px;
}

.SOF_T1 {
    font-family:  Arial, Tahoma, verdana, Times New Roman, helvetica, sans-serif;
    font-size: 14pt;
    color: #BC3500;
}

.SOF_T2 {
    font-family: Arial,  Tahoma, helvetica, sans-serif;
    font-size: 12pt;
    line-height: 150%;
    font-weight: bold;
}

.SOF_T3 {
    font-family: Arial,  Tahoma, helvetica, sans-serif;
    font-size: 10pt;
    text-align: justify;
    line-height: 150%;
    color: #31518C;
    font-weight: bold;
}

.SOF_T4 {
    font-family: Tahoma, Arial,Times New Roman, Verdana, helvetica, sans-serif;
    font-size: 8pt;
    text-align: justify;
    line-height: 150%;
    font-weight: bold;
}

.SOF_Normal {
    font-family: Verdana, Arial, Tahoma, helvetica, sans-serif;
    font-size: 8pt;
    text-align: justify;
    line-height: 150%;
}

.SOF_Normal_Color {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    text-align: justify;
    line-height: 150%;
    color: #294D6B;
}

.SOF_HR {
    text-align: justify;
    line-height: 150%;
    color: #CED7E7;
}

.SOF_ShortCut {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    text-align: justify;
    line-height: 150%;
    color: #294D6B;
    font-weight: bold;
}


/* Left Panel Menu */

#LeftPanel {
    border-bottom: #ccc 1px solid;
    width: 100%;
}

.LeftPanel_1 A {
    padding-left: 3px;
    display: block;
    width: 100%;
    font-size: 11px;
    font-weight: bold;
    margin: 0px;
    padding-top: 5px;
    padding-bottom: 4px;
    text-decoration: none;
    color: black;
    border-top: #fff 1px solid;
    border-bottom: #eeeeee 1px solid;
    background-color: #F7FBFF;
}

    .LeftPanel_1 A:visited {
        padding-left: 3px;
        color: black;
        border-top: #fff 1px solid;
        border-bottom: #eeeeee 1px solid;
        background-color: #F7FBFF;
    }

    .LeftPanel_1 A:hover {
        background: whitesmoke;
        color: #F37623;
        text-decoration: none;
        border-bottom: #eeeeee 1px solid;
    }

.LeftPanel_2 A {
    padding-left: 7px;
    display: block;
    width: 100%;
    font-size: 11px;
    font-weight: bold;
    margin: 0px;
    padding-top: 5px;
    padding-bottom: 4px;
    text-decoration: none;
    color: #104194;
    border-top: #fff 1px solid;
    border-bottom: #eeeeee 1px solid;
    background-color: #F7FBFF;
}

    .LeftPanel_2 A:visited {
        padding-left: 7px;
        color: black;
        border-top: #fff 1px solid;
        border-bottom: #eeeeee 1px solid;
        background-color: #F7FBFF;
    }

    .LeftPanel_2 A:hover {
        background: whitesmoke;
        color: #F37623;
        text-decoration: none;
        border-bottom: #eeeeee 1px solid;
    }


abbr, acronym, span.abbr {
    /** cursor: help; border-bottom: 1px dashed #000; **/
}

.formbutton {
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 4px;
    padding-bottom: 4px;
}

    .formbutton:disabled, .formbutton[disabled], .formbutton[disabled=disabled], .formbutton[disabled=true] {
        color: gray;
    }

a:disabled, a[disabled], a[disabled=disabled], a[disabled=true] {
    color: gray;
}

.Box_Message {
    background: #F5F5F5;
    height: 27px;
    padding: 7px 15px 0px 10px;
    margin-left: 10px;
    margin-top: 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-style: solid;
    border-width: thin;
    border-color: #DDDDDD;
}

.Box_Message {
    float: left;
    margin-right: 10px;
}

a.POPMessage {
    color: #000000;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    text-decoration: none;
}

    a.POPMessage:hover {
        text-decoration: underline;
        color: #7A991A;
    }

.Panel_Oval {
    border: 1px solid #9D9D9D;
    padding: 1px 1px;
    margin: 15px 5px 5px 5px;
    background: #ffffff;
    width: 96%;
    border-radius: 5px;
    -moz-border-radius: 5px; /* Firefox 3.6 and earlier */
}

.HRSLIM {
    line-height: 100%;
    height: 0;
    border-style: dotted;
    border-width: 1px 0 0 0;
    border-color: gray;
}

/*************************************************/
.formbutton2 {
    padding-left: 2px;
    padding-right: 2px;
    margin: 0px;
    padding-top: 3px;
    padding-bottom: 3px;
    text-decoration: none;
    color: black;
    background-color: #EEEEEE;
    border-top: whitesmoke 1px solid;
    border-bottom: #CCCCCC 1px solid;
    border-right: #CCCCCC 1px solid;
    border-left: #EEEEEE 1px solid;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
}

    .formbutton2:disabled, .formbutton2[disabled], .formbutton2[disabled=disabled], .formbutton2[disabled=true] {
        color: gray;
    }

/*************************************************/

a.formlink {
    padding: 5px 4px;
    margin: 0px !important;
    text-decoration: none !important;
    color: black !important;
    background-color: #EEEEEE !important;
    border-top: whitesmoke 1px solid !important;
    border-bottom: #CCCCCC 1px solid !important;
    border-right: #CCCCCC 1px solid !important;
    border-left: #EEEEEE 1px solid !important;
}

    a.formlink:hover {
        text-decoration: none !important;
        color: black !important;
        background-color: whitesmoke !important;
        border-top: whitesmoke 1px solid !important;
        border-bottom: #BC8F8F 1px solid !important;
        border-right: #BC8F8F 1px solid !important;
        border-left: #EEEEEE 1px solid !important;
    }

.formcell {
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    padding-bottom: 0.2em;
    padding-left: 0.7em;
    padding-right: 0.5em;
    padding-top: 0.2em;
}

.mozvir {
    display: table-row;
}

.mozvic {
    display: table-cell;
}

.vir {
    display: block;
}

.vic {
    display: block;
}

.mozinvir {
    display: none;
}

.mozinvic {
    display: none;
}

.invir {
    display: none;
}

.invic {
    display: none;
}
/*************************************************/
.notice {
    padding: 5px;
    background-color: Yellow;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
    font-size: 9pt;
    font-weight: bold;
}

    .notice:empty {
        display: none;
    }

a.tooltip {
    position: relative; /*this is the key*/
    z-index: 24;
    text-decoration: none;
}

    a.tooltip:hover {
        z-index: 25;
    }

    a.tooltip span {
        display: none;
    }

    a.tooltip:hover span {
        /*the span will display just on :hover state*/
        display: block;
        position: absolute;
        top: 2em;
        left: 2em; /*width:15em;     border:1px solid #0cf;     background-color:#cff; color:#000;     text-align: center*/
    }

span.tooltip {
    position: relative; /*this is the key*/
    z-index: 24;
    text-decoration: none;
}

    span.tooltip:hover {
        z-index: 25;
    }

    span.tooltip span {
        display: none;
    }

    span.tooltip:hover span {
        display: block;
        position: absolute;
        top: 2em;
        left: 2em;
    }

.T1 a {
    font-family: Tahoma, Arial, Segoe UI, verdana, Times New Roman, helvetica, sans-serif;
    font-size: 12pt;
    color: #477311;
    padding-left: 2px;
    padding-top: 6px;
    padding-bottom: 5px;
    font-weight: bold;
}

    .T1 a:visited {
        color: #477311;
        text-decoration: none;
    }

    .T1 a:hover {
        color: #477311;
        text-decoration: none;
    }

.nicescroll {
    max-height: 265px;
}

.ScrollDesktopModuleContentTable {
    padding-left: 0px;
    padding-right: 0px;
    border: 1px solid #aec8d7;
    background: #ffffff;
    margin-bottom: 10px;
    max-height: 265px;
    overflow: auto;
}

.smallformbutton {
    font-family: Tahoma, Times New Roman, Arial, Verdana;
    color: #000;
    font-weight: bold;
    font-size: 8pt;
    text-align: center;
    padding: .2em 0 .1em .2em;
    border-style: solid;
    border-width: 1px;
    border-color: #fff #999 #999 #fff;
}

    .smallformbutton:disabled, .smallformbutton[disabled], .smallformbutton[disabled=disabled], .smallformbutton[disabled=true] {
        color: gray;
    }

table tr.light2 td {
    background: #EEEEEE;
    color: #fff;
    font-weight: bold;
    font-family: Arial, Segoe UI, Tahoma, Times New Roman, Verdana;
}

table tr.light2 {
    background: #EEEEEE;
}

    table tr.light2 td {
        color: black;
        font-weight: bold;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

.note {
    color: #3b3b3b;
}

.red {
    color: red;
}

.green {
    color: green;
}

.bold {
    font-weight: bold;
}
.italic {
    font-style: italic
}

table td.FormControl {
    padding-left: 0;
    padding-right: 0;
}
p {
    margin-block-start: .5em;
    margin-block-end: .5em;
}
.oneLine {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

 .max-lines {
  overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 20px;     /* fallback */

   -webkit-line-clamp: 2; /* number of lines to show */
   -webkit-box-orient: vertical;
}

/* collape text */
 .wrap-collabsible {
  margin-bottom: 1.2rem 0;
}



.lbl-toggle {
    margin-top: 5px;
    padding-top: 10px;
    display: block;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 10px;
    transition: all 0.25s ease-out;
    background: #fff;
    padding: 10px;
    /*border-bottom: 2px solid #007bff;
    border-top: 2px solid #007bff;
    border-left: 2px solid #007bff;
    border-right: 2px solid #007bff;*/
}

.lbl-toggle:hover {
  color: #7C5A0B;
}

.lbl-toggle::before {
  content: ' ';
  display: inline-block;

  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid currentColor;
  vertical-align: middle;
  margin-right: .7rem;
  transform: translateY(-2px);

  transition: transform .2s ease-out;
}

.toggle:checked + .lbl-toggle::before {
  transform: rotate(90deg) translateX(-3px);
}

.collapsible-content {
  max-height: 0px;
  overflow: hidden;
  transition: max-height .25s ease-in-out;
}

.toggle:checked + .lbl-toggle + .collapsible-content {
  max-height: 100vh;
}

.toggle:checked + .lbl-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.collapsible-content .content-inner {
  background: #fafafa;
  border-bottom: 1px solid #f0f0f0;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
  padding: .5rem 1rem;
}
/* collape text */


.po_top-level
{
	padding-left: 2px;
	display: block;
	width: 100%;
	font-size: 8pt;
	border-top: white 1px solid;
	font-weight: bold;
	text-decoration: none;
	color: black;
	background-color: #E7E3E7;
	padding-top: 5px;
	padding-bottom: 5px;
	border-top: #fff 1px solid;
	border-bottom: #CCCCCC 1px solid;
	font-size: 0.9rem;
	font-family: arial, tahoma;
}

.po_top-level A
{
	padding-left: 3px;
	color: black;
	font-size: 0.8rem;

}
.po_top-level A:visited
{
	padding-left: 3px;
	color: black;
font-size: 0.8rem;
	background-color: whitesmoke;
}
.po_top-level A:active
{
	padding-left: 3px;
	color: black;
	background-color: whitesmoke;
	font-size: 0.8rem;
}


.po_top-level A:hover
{
	background: #EEEEEE;
	color: black;
	font-size: 0.8rem;
}

.po_second-level A
{
	padding-left: 5px;
	display: block;
	width: 100%;
	font-weight: Normal;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-decoration: none;
	color: black;
	background-color: whitesmoke;
	border-top: #fff 1px solid;
	border-bottom: #eeeeee 1px solid;
	font-size: 0.9rem;
	font-family: arial, tahoma;
}


.po_second-level A:visited
{
	padding-left: 5px;
	color: black;
	background-color: whitesmoke;
}


.po_second-level A:hover
{
	background: #EEEEEE;
	color: black;

}
.po_third-level A
{
	padding-left: 15px;
	display: block;
	width: 100%;
	font-weight: Normal;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-decoration: none;
	color: black;
	background-color: whitesmoke;
	border-top: #fff 1px solid;
	border-bottom: #eeeeee 1px solid;
	font-size: 0.9rem;
	font-family: arial, tahoma;
}


.po_third-level A:visited
{
	padding-left: 15px;
	color: black;
	background-color: whitesmoke;
}


.po_third-level A:hover
{
	background: #EEEEEE;
	color: black;

}
/*************************************/

/* Works on Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #b0b0b0 #ffffff;
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 12px;
}

*::-webkit-scrollbar-track {
  background: #ccc;
}

*::-webkit-scrollbar-thumb {
  background-color: #b0b0b0;
  border-radius: 10px;
  border: 3px solid #ffffff;
}


/*left right modal*/
.modal.left_modal, .modal.right_modal{
  position: fixed;
  z-index: 99999;
}
.modal.left_modal .modal-dialog,
.modal.right_modal .modal-dialog {
  position: fixed;
  margin: auto;
  
  height: 100%;
  -webkit-transform: translate3d(0%, 0, 0);
      -ms-transform: translate3d(0%, 0, 0);
       -o-transform: translate3d(0%, 0, 0);
          transform: translate3d(0%, 0, 0);
}

.modal-dialog {
    /* max-width: 100%; */
    margin: 1.75rem auto;
}
@media (min-width:576px) {
  .modal.right_modal .modal-dialog {
    width: 100vw; 
  }

}
/*Tablet nhỏ(480 x 640)*/
@media  (min-width: 480px){
       .modal.right_modal .modal-dialog {
    width: 100vw;   
}

}
/*Iphone(480 x 640)*/
@media (min-width: 320px){
       .modal.right_modal .modal-dialog {
    width: 100vw; 
}

.modal.right_modal .modal-dialog {
    width: 100vw;  
}  
}

@media (min-width:992px) {
  .right_modal .modal-dialog {
    width: 60vw;  
    max-width: 900px;
	}  
}

@media (min-width:1200px) {
  .modal.right_modal .modal-dialog {
    width: 60vw;  
    max-width: 1024px;
}  
}
/*left right modal*/
/*Left*/
.modal.left_modal.fade .modal-dialog{
  left: -50%;
  -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
  -o-transition: opacity 0.3s linear, left 0.3s ease-out;
  transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left_modal.fade.show .modal-dialog{
  left: 0;
  box-shadow: 0px 0px 19px rgba(0,0,0,.5);
}
    
/*Right*/
.modal.right_modal.fade .modal-dialog {
  right: -50%;
  -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
     -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
       -o-transition: opacity 0.3s linear, right 0.3s ease-out;
          transition: opacity 0.3s linear, right 0.3s ease-out;
}



.modal.right_modal.fade.show .modal-dialog {
  right: 0;
  box-shadow: 0px 0px 19px rgba(0,0,0,.5);
}
/* ----- MODAL STYLE ----- */