body
{
    font-family: Arial;
    font-size: 12px;
    color: #222;
    background: #000;
    height: 100%;
    min-height: 800px;
}
#wrapper
{
    width: 100%;
    min-height: 1200px;
    background: #eee;
    margin: 0 auto;
}
#header
{
    width: 100%;
    height: 106px;
    background: url(images/header_bg.jpg) repeat-x left top;
    position: relative;
}
#logo
{
    position: absolute;
    top: 5px;
    left: 10px;
}
#support
{
    position: absolute;
    top: 5px;
    right: 10px;
    color: #fff;
    font-weight: bold;
}

#content
{
    width: 100%;   
      
    position: relative;
}

/*Start:LoginPage*/
#login
{
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -115px;
    margin-left: -182px;
    width: 365px;
    height: 232px;
    background: url(images/login.png) no-repeat left top;
}
#titlelogin
{
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    position: absolute;
    top: 31px;
    left: 60px;
}

#username
{    
    position: absolute;
    top: 72px;
    left: 75px;
}
.txt_username
{
    border: none !important;
    background: none !important;
    width: 200px;
    height: 25px !important;
    line-height: 25px;
    vertical-align: middle;
    font-size: 10px !important;
    color: #666 !important;
    padding: 0px !important;
    
}
#password
{   
    position: absolute;    
    top: 115px;
    left: 75px;
}
.txt_password
{
    border: none !important;
    background: none !important;
    width: 200px;
    height: 25px !important;
    line-height: 25px;
    vertical-align: middle;
    font-size: 10px !important;
    color: #666 !important;
    padding: 0px !important;
}
#rememberme
{    
    position: absolute;
    top: 147px;
    left: 27px;
    padding-left: 15px;
}
#forgotpassword
{    
    position: absolute;
    top: 147px;
    right: 45px;
}
#forgotpassword a
{
    font-weight: normal !important;
    color: #029ee9;    
}
#forgotpassword a:hover
{
    text-decoration: underline;    
}

#loginbutton
{
    position: absolute;
    top: 170px;
    left: 130px;
}
.btn_login
{
    border: none !important;
    background: none !important;
    background: url(images/btn_login.png) no-repeat left top !important;
    width: 93px;
    height: 28px;
    color: #fff;
    text-align: center;
    font-weight: bold;
}

.btn_login:hover
{    
    background: url(images/btn_login_hover.png) no-repeat left top !important;    
}

.chk_remember
{
    margin-right: 5px;            
}

#message
{
    width: 350px; 
    height: 36px;
    position: absolute;
    top: -50px;
    left: 0px;  
    padding-left: 12px; 
    
}
.mesage{width: 100%; padding-left: 12px; position: relative !important;}
.message .bleft{position: absolute; left:0; top:0; width: 12px; height: 36px; background: url(images/red_message_left.png) no-repeat left top;}
.message .bcontent{float: left; width: 100%; height: 36px; background: url(images/red_message_right.png) no-repeat right top;}
.message .binside{width: 100%; text-align: center; color: Red; line-height: 36px; vertical-align: middle; }

.mesage_green{width: 100%; padding-left: 12px; position: relative !important;}
.message_green .bleft{position: absolute; left:0; top:0; width: 12px; height: 36px; background: url(images/green_message_left.png) no-repeat left top;}
.message_green .bcontent{float: left; width: 100%; height: 36px; background: url(images/green_message_right.png) no-repeat right top;}
.message_green .binside{width: 100%; text-align: center; color: Green; line-height: 36px; vertical-align: middle; }
/*End:LoginPage*/

/*Start:ListPage*/
#nav
{
    position: absolute;
    top: 35px;
    left: 10px;    
    width: 100%;
}

#nav a
{
    display: block !important;
    float: left !important;
    height: 36px !important;
    margin-right: 10px !important;  
    color: #222 !important;
    cursor: pointer !important;
    font-weight: normal !important;
}

#nav a:hover
{
    color: Red !important;    
}

#loginbox
{
    float: right;    
    margin-right: 10px;
    line-height: 26px;
    vertical-align: middle;
}

#loginbox a
{
    display: inline !important;
    color: Blue !important;   
    float:none !important; 
}

ul#theader
{
    height: 28px;
    margin: 0px auto;
    width: 99%; 
    z-index: 9999;        
}

ul#theader li
{
    display: block;
    height: 28px;
    float: left;
    background: url(images/ttitle_left.png) no-repeat left top;
    padding-left: 6px;
    padding-right: 0px !important;
    margin-left: 10px;
}

ul#theader li a
{
    display: block;
    float: left;
    width: 98%;
    height: 28px;
    background: url(images/ttitle_right.png) no-repeat right top; 
    padding-right: 4px;   
    padding-left: 4px;
    line-height: 28px;
    vertical-align: middle;
    color: #555 !important;
    font-weight: normal !important;
    cursor: pointer !important;
    font-size: 12px !important;
}

ul#theader li:hover{}

ul#theader li a:hover
{
    color: #111 !important;    
}

ul#theader li.active
{
    display: block;
    height: 28px;
    float: left;
    background: url(images/ttitle_left_ac.png) no-repeat left top;
    padding-left: 6px;
    padding-right: 0px !important;
    margin-left: 10px;
}

ul#theader li.active a
{
    display: block;
    float: left;
    width: 98%;
    height: 28px;
    background: url(images/ttitle_right_ac.png) no-repeat right top; 
    padding-right: 4px;   
    padding-left: 4px;
    line-height: 28px;
    vertical-align: middle;
    color: #01bdfd !important;
    font-weight: bold !important;
    cursor: default !important;
}

ul#theader li.active:hover{}

ul#theader li.active a:hover
{
    color: #01bdfd !important;    
}

#tcontent
{
    z-index: 1;
    margin: 0px auto;
    border: solid 1px #ccc;
    width: 99%;    
    background: #fff;   
    min-height: 400px;  
    margin-top: -1px;  
}

#tinside{padding: 20px;}


.pager
{
    width: 100%;
    height: 35px;
        
}
.pager .left
{
    width: 5px;
    height: 35px;
    float: left;
    background: url(images/pager_bg_left.png) no-repeat left top;    
}
.pager .right
{
    width: 5px;
    height: 35px;
    float: left;
    background: url(images/pager_bg_right.png) no-repeat right top;     
}
.pager .middle
{
    width: 98%;
    height: 35px;
    float: left;
    background: url(images/pager_bg_middle.png) repeat-x left top;  
    line-height: 35px;
    vertical-align: middle;  
}

.box_26px{height: 26px; float: left; margin-right:5px; margin-top: 4px; position: relative;}
.box_26px .left{width: 4px; height: 26px; float: left; background: url(images/sum_left.png) no-repeat left top;}
.box_26px .middle{width: auto; height: 26px; float: left; background: url(images/sum_middle.png) repeat-x left top; padding: 0 8px; line-height: 26px; vertical-align: middle;}
.box_26px .right{width: 4px; height: 26px; float: left; background: url(images/sum_right.png) no-repeat right top;}
.search_textbox{border: none !important; background: none !important; color: #555 !important; font-size: 11px !important; font-style: italic !important; vertical-align: middle; width: 200px; height: 26px;line-height: 26px; padding: 0px !important; margin-right: 20px !important;}
.search_btn{border: none !important; background: none !important; width: 18px; height: 18px; background: url(images/icon_search.png) no-repeat left center !important; position: absolute; right: 5px; top: 4px;}
.search_btn:hover{background: url(images/icon_search_hover.png) no-repeat left center !important;}
.indicator{float: left; margin-top: 3px; margin-right: 10px;}
.indicator a{display: block; float: left; margin: 3px; width: 21px; height: 21px; text-align: center; line-height: 21px; vertical-align: middle; color: #333 !important; font-size: 12px !important; font-weight: normal !important;}
.indicator .page_first{background: url(images/page_first.png) no-repeat left top;}
.indicator .page_prev{background: url(images/page_prev.png) no-repeat left top;}
.indicator .page_current{background: url(images/page_current.png) no-repeat left top; color: #fff !important; cursor: default !important;}
.indicator .page_note{background: url(images/page_note.png) no-repeat left top;}
.indicator .page_next{background: url(images/page_next.png) no-repeat left top;}
.indicator .page_last{background: url(images/page_last.png) no-repeat left top;}

.indicator .page_first:hover{background: url(images/page_first_hover.png) no-repeat left top;}
.indicator .page_prev:hover{background: url(images/page_prev_hover.png) no-repeat left top;}
.indicator .page_note:hover{background: url(images/page_note_hover.png) no-repeat left top; color: #08b7e9 !important;}
.indicator .page_next:hover{background: url(images/page_next_hover.png) no-repeat left top;}
.indicator .page_last:hover{background: url(images/page_last_hover.png) no-repeat left top;}

.addnewone{ float: right; margin-right: 10px;}
.addnewone a{display: block !important; height: 35px; line-height: 35px; vertical-align: middle ;padding-left: 20px; background: url(images/icon_addnew.png) no-repeat left center; font-size: 14px !important; color: #222 !important; font-weight: bold; font-style: italic;}
.addnewone a:hover{background: url(images/icon_addnew_hover.png) no-repeat left center;}

.tbl_data{width: 99%; margin: 10px 0px;}
.tbl_data td{border: solid 1px #ccc; height: 25px; line-height: 20px; vertical-align: middle; padding: 3px;}
.tbl_data th{border: solid 1px #ccc; background: #00a6ca !important; text-align: center; font-weight: bold; color: #fff;height: 30px; line-height: 30px; vertical-align: middle;}
.tbl_data .center{text-align: center;}
.tbl_data a{font-weight: normal; color: #333;}
.tbl_data .a_edit{display: block; float: left; width: 22px; height: 22px; background: url(images/icon_edit.png) no-repeat left top; margin-left: 20px; margin-right: 5px;}
.tbl_data .a_delete{display: block; float: left; width: 22px; height: 22px; background: url(images/icon_delete.png) no-repeat left top;}
.tbl_data tr.hover{background: #cff5fd; cursor: pointer;}
/*End:ListPage*/

.box_one
{    
    font-size: 14px;
    color: #333;
    height: 35px;
    line-height: 35px;
    vertical-align: middle;
    padding: 0 10px;        
}

.box_up
{
    margin-bottom: 10px;    
}

.box_button
{
    position: relative;
    top: 5px;
}

.red{color: Red;}

.tbl_input
{
    min-width: 800px;    
}
.tbl_input th
{
    vertical-align: top; 
    height: 40px;
}

.tbl_input tr{position: relative;}

.tbl_input td
{
    line-height: 30px;
    vertical-align: top;
    font-weight: bold;
        
}

.btn_save
{
    border: none !important;
    background: none !important;
    background: url(images/icon_save.png) no-repeat left top !important;   
    padding-left: 35px !important; 
    height: 32px !important;    
    font-size: 14px !important;
    width: 100px !important;
}

.btn_save:hover{font-weight: bold !important;}
.btn_cancel
{
    border: none !important;
    background: none !important;
    background: url(images/icon_cancel.png) no-repeat left top !important;   
    padding-left: 35px !important;  
    height: 32px !important;
    font-size: 14px !important;
}
.btn_cancel:hover{font-weight: bold !important;}
.btn_upload
{
    border: none !important;
    background: none !important;
    background: url(images/icon_upload.png) no-repeat left top !important;   
    padding-left: 35px !important;  
    height: 32px !important;
    font-size: 14px !important;
}
.btn_upload:hover{font-weight: bold !important;}
.btn_delete
{
    border: none !important;
    background: none !important;
    background: url(images/icon_delete.png) no-repeat left top !important;   
    padding-left: 35px !important;  
    height: 32px !important;
    font-size: 14px !important;
}
.btn_delete:hover{font-weight: bold !important;}

ul#lheader
{
    height: 28px;
    margin: 0px auto;
    width: 99%; 
    z-index: 9999;        
}

ul#lheader li
{
    display: block;
    height: 28px;
    float: left;
    background: url(images/ttitle_left.png) no-repeat left top;
    padding-left: 6px;
    padding-right: 0px !important;
    margin-left: 10px;
}

ul#lheader li a
{
    display: block;
    float: left;
    width: 98%;
    height: 28px;
    background: url(images/ttitle_right.png) no-repeat right top; 
    padding-right: 4px;   
    padding-left: 4px;
    line-height: 28px;
    vertical-align: middle;
    color: #555 !important;
    font-weight: normal !important;
    cursor: pointer !important;
    font-size: 12px !important;
}

ul#lheader li:hover{}

ul#lheader li a:hover
{
    color: #111 !important;    
}

ul#lheader li.active
{
    display: block;
    height: 28px;
    float: left;
    background: url(images/ttitle_left_ac.png) no-repeat left top;
    padding-left: 6px;
    padding-right: 0px !important;
    margin-left: 10px;
}

ul#lheader li.active a
{
    display: block;
    float: left;
    width: 98%;
    height: 28px;
    background: url(images/ttitle_right_ac.png) no-repeat right top; 
    padding-right: 4px;   
    padding-left: 4px;
    line-height: 28px;
    vertical-align: middle;
    color: #01bdfd !important;
    font-weight: bold !important;
    cursor: default !important;
}

ul#lheader li.active:hover{}

ul#lheader li.active a:hover
{
    color: #01bdfd !important;    
}

#lcontent
{
    z-index: 1;
    margin: 0px auto;
    border: solid 1px #ccc;
    width: 99%;    
    background: #fff;   
    min-height: 400px;  
    margin-top: -1px;  
}

#linside{padding: 10px;}
#left_panel
{
    float: left;
    width: 15%;    
    margin-left: 10px;
}
#right_panel
{
    float: left;    
    width: 84%;    
}

#linside ul li
{
    padding: 2px 0px;        
}

#linside ul li a
{
    font-weight: normal !important;
    color: #333;   
}

#linside ul li a.active
{
    font-weight: bold !important;    
}
#linside ul li a:hover
{
    color: Orange;    
}

#ngonngu_bar
{
    position: absolute;
    top: -45px;
    left: 10px;    
}

td.td_lenh
{
    color: Blue;
    cursor: pointer;
    text-align: center;    
}