HTML {
	
}
BODY {
	FONT-SIZE: 12px; FONT-FAMILY: Arial;
	margin: 0px;
	background: #eaeaea;
}
TD {
	FONT-SIZE: 11px; FONT-FAMILY: Arial;
}
A:link, A:visited, A:active{	
}
/*
A:hover{
	color:#000000;
	font-size: 11px; text-decoration:  none;
}
*/
TEXTAREA {
	overflow: hidden;
}

INPUT {
	font-size: 11px;
	TEXT-INDENT: 1px;
}
INPUT.noborder {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px
}
INPUT.mainoption {
	FONT-WEIGHT: bold; BACKGROUND-COLOR: #dddddd
}
INPUT.liteoption {
	FONT-WEIGHT: normal; BACKGROUND-COLOR: #e5e5e5
}

SELECT {
	font-size: 11px;
	TEXT-INDENT: 1px;
}

/* ---------------- link in white color ------------ */
/* just use for A tag, as <a href="#" class="whitelink">link</a> */

A.whitelink {
	color: #b76318;
}
A.whitelink:hover {
	color: #f4c4bf;
}
/* ---------------- page header style ------------------ */
/* use for page header row, normal, this row is a td tag
/* example: <td class="header">PAGE HEADER</td> 
------------------------------------------------------ */
.header {
	background-color: #B3B3B3;
	color: #FFFFFF;
	font-weight: bold;
	height:21px;
	padding-left:3px;
/*	border-bottom: 1px solid #495F6C; 
	text-align:left; */
}

/* --------- taglig ----------- */

a{
	margin:0;
	padding:0;
	font-size: 1em;
	background-repeat:no-repeat;
	list-style-type:none;
}

th.sorted a, th.sortable a {
	background-position: right;
	display: block;
	color: #FFFFFF;
	font-weight: bold;
}
th.sortable a {
	background-image: url(../images/arrow_off.png);
	color: #FFFFFF;
}
th.order1 a {
	background-image: url(../images/arrow_down.png);
}
th.order2 a {
	background-image: url(../images/arrow_up.png);
}
tr.odd {
  background-color: #FFFFFF;
}
tr.tableRowEven, tr.even {
  background-color: #f5f5f5;
}
.pagebanner {
  text-align:right;
}

a.pagelinks:link,  a.pagelinks:active, a.pagelinks:visited {
	text-align:right;
	color: #00579C;
}

/* ----------- Hong Khang edit --------------- */
/* ------------- style use in main page ---------- */
/* this style has edges space, with light gray color, normal style 
use as <td class="main_row1">content</td>
---------------------------------------------------- */
.main_row1 {
	padding-left:16px;
	padding-right:16px;
	padding-top:5px;
	padding-bottom:5px;
	color: #616161;
}

/* ---------------- style use for main subbject in mainpage  
this style has dark gray background, with white bold for text inside 
use as <td class="main_item">ITEM</td> 
------------------------------------------------- */
.main_item {
	background-color: #fdfdef;
}

/* ----------------- style for mainpage ---------------- */
/* this style look like main_row1, but haven't got top and bottom scpace 
use as <td class="main_row2">content</td>
--------------------------------------------------- */
.main_row2 {
	padding-left:3px;
	background: FFFEEF;
	height:400px;
	border-right: 1px solid #B3B3B3;
	border-bottom:1px solid #B3B3B3;
	border-left: 1px solid #B3B3B3;
}

/* -------------- style use for menu item in page ------------- */
/* this style just for menuitem, hs a dark gray background, 
with black bold text. Use as <td class="menuitem">menu item</td> 
--------------------------------------------------- */
.menuitem {
	BACKGROUND: url(../images/menu_bg.gif); 
	background-position: right;
	height: 400px;
}

/* ---------------- menu item in selected state ------------------- */
.menuitem_active {
	FONT-SIZE: 12px; 
	BACKGROUND: #EAEEF0;
	font-weight: bold;
	border-bottom:1px solid #000000;
	padding-left:10px;
	height:22px;
}

.menuitem_selected {
	FONT-SIZE: 12px; 
	BACKGROUND: #97ADB9; 
	font-weight: bold;
	border-bottom:1px solid #000000;
	padding-left:10px;
	height:22px;
}

/* ---------------- style for news item in page --------------- */
/* this style has light gray color and spacing with edges 
use as <td class="news_item">content</td> 
----------------------------------------------------------- */
.news_item {
	color: #616161;
	padding-left:5px;
	padding-right:5px;
	padding-top:5px;
	padding-bottom:5px
}

/* ---------- style for link ------------------- */
/* this style use for internal link in page such as link for news details 
or get more informations. Just use in a tag, 
as <a href="#" class="link_more">link</a>
---------------------------------------------- */
A.link_more:active, A.link_more:link, A.link_more:visited {
	font-family: "Trebuchet MS";
	font-size: 11px;
	color: #DD9C1D;
	text-decoration: none;
}
/* ------------ style for news title ---------------- */
/* this style is small title with bold blue text color 
just use for news in short layout. This style use in SPAN tag
<span class="news_title_1">news title</span>
------------------------------------------------ */
.news_title_1 {
	color: #0363C6;
	font-weight: bold;
}

/* --------------- style for row or table that contain news 
this style has dark cyan background color and row border
use as <td class="news_container">....</td> 
or <table class="news_container" .... >
----------------------------------------------------- */
.news_container {
	background: #E2E9ED;
	border-bottom:1px dashed #000000;
	border-left: 1px solid #C1C1C1;
	border-right: 1px solid #C1C1C1;
}

/* ------------ style use for footer only --------------- */
.footer {
	color: #ABAAAA;
	font-size: 11px;
	text-align: center;
}

/* ------------ style for footer link and pages navigator link 
this style has blue color in normal style 
use as <a class="footer_link" href="#">link</a>
-------------------------------------------------- */
A.footer_link:link,  A.footer_link:active, A.footer_link:visited, A.footer_link:hover{
	color: #004776;
	font-size: 11px;
}

.others_item {
	color: #616161;
	padding-left:5px;
	padding-right:5px;
	padding-top:1px;
	padding-bottom:1px
}

/* ----------------------------------------
this style use for tab with gray color 
use as <td class="tab1">tab</td>
------------------------------------------ */
.tab1 {
	background: #FFE6CB;
	color: #000000;
	font-weight: bold;
	padding-left: 20px;
	height: 25px;
	font-size: 12px;
	font-family: Arial;
	cursor: hand;
}

/* style for tabl1 in selected state */
.tab1_active {
	background: #FFBF87;
	color: #000000;
	font-weight: bold;
	padding-left: 20px;
	height: 25px;
	font-size: 12px;
	font-family: Arial;
	cursor: hand;
}

/* -- tabl2, look like tabl1 style, but another background color */
.tab2 {
	background: #FFE6CB;
	color: #000000;
	font-weight: bold;
	padding-left: 5px;
	cursor: hand;
	height:22px;
	text-align:left;
}

.tab2_active {
	background: #FFBF87;
	color: #000000;
	font-weight: bold;
	padding-left: 5px;
	cursor: hand;
	height:22px;
	text-align:left;	
}
/* -------- message style, bold red text color ------- */
.messageTextBoldRed {
	FONT-WEIGHT: bold; COLOR: #FF0000;
}

.messageTextRed {
	COLOR: #FF0000;
}

/* ------------- message style, normal --------------- */
.messageText {
	FONT-WEIGHT: normal; COLOR: #000000;
}
/* ------------- message style, bold ----------------- */
.messageTextBold {
	FONT-WEIGHT: bold; COLOR: #000000;
}
/* -------- message style, bold blue text color ---- */
.messageTextBoldBlue {
	FONT-WEIGHT: bold; COLOR: #004776;
}

.messageTextBlue {
	COLOR: #004776;
}


/* ---------------- style for top menu item 
use as <td class="menu">menu item</td>
----------------------------------------------------- */
.menu {
	text-align:center; 
	padding-top:2px;
	padding-bottom: 2px;
/*	padding-right: 1px; */
	border-right: 1px solid #FFFFFF;
	BACKGROUND: #356D90;
	FONT-SIZE: 13px;
	FONT-WEIGHT: bold;
	height:22px;
}
/* -------- style for link at menu item 
only use for link. <a href="#" class="topmenu">link</a>
----------------------------------------------------- */
A.topmenu:link, A.topmenu:visited {
	TEXT-DECORATION: none;
/*	COLOR: #495f6c;  */
	color: #FFFFFF;
}
A.topmenu:active {
	TEXT-DECORATION: none;
	COLOR: #FFFFFF;
	font-weight: bold;
}
A.topmenu:hover {
	color: #F9BD5E; 
/*	color: #E77918; 
	color: #2370A0; */
	TEXT-DECORATION: none;
	font-weight: bold;
}

/* ---------------- style for table header row
with dark gray background and black bold text
use as: <td class="table_header">header</td>
---------------------------------------------- */
.table_header {
	font-weight: bold; 
	background: #DFDFDF; 
	color: #000000; 
	padding-top: 2px; 
	padding-left: 5px;
	height: 22px; 
	border-left: 1px solid #B3B3B3;
	border-bottom: 1px solid #B3B3B3;
	text-align: center;
}

.table_result {
	border-right: 1px solid #B3B3B3; 
	border-top: 1px solid #B3B3B3; 
	border-bottom: 1px solid #B3B3B3;
	border-left: 1px solid #B3B3B3;
}

/* ---------------- style for row as a header item
with dark gray background and white bold text
use as: <td class="theader">header</td>
---------------------------------------------- */
.theader {
	font-family: Verdana;
	font-size:12px;
	font-weight: bold; 
	background: #7F9DB9; 
	color: #ffffff; 
	padding-top: 2px;
	padding-bottom: 2px;
	height: 22px;	
	text-align: center;
}

/* ------------ style for table with border at right and top 
just use for table as <table class="tborder" ....>
---------------------------------------------------- */
.tborder {
	border-right: 1px solid #B3B3B3; 
	border-top: 1px solid #B3B3B3; 
}

.tborder_full {
	border: 1px solid #B3B3B3; 	
}

/* ---- style for input row in form, without border line 
with bold right align text. USe as <td class="row_right">text</td>
----------------------------------------------- */
.row_right {
	Padding-top: 3px; 
	padding-right: 5px; 
	text-align: right; 
	height: 22px;
	color:#000000;
	/*color:#495F6C; */
	font-size:12px;
}

/* ---- style for input row in form, without border line 
with bold left align text. USe as <td class="row_left">text</td> 
------------------------------------------------- */
.row_left {
	Padding-left: 5px; 
	padding-top: 3px; 
	text-align: left; 
	height: 22px;
	color:#000000;
	/*color:#495F6C; */
	font-size:12px;
}

/* ------------------------------------------- 
style use for button in form, can use for a td tag as button 
use as : <input type="button" class="button" .../>
or <td class="button">button</td>
--------------------------------------------------- */
.button {
	font-size: 12px;	
	height: 23px;
	width: 80px;
}

/* ------------------------------------------- 
style use for row presentation, with white background 
and border at left and bottom. Use in table with class specify as tborder upon 
ex: <td class="line1_left">text</td>
---------------------------------------------- */
.line1_left {
	padding-left: 5px; 
/*	background: #ffffff; */
	color: #000000; 
	padding-top: 2px; 
	border-bottom: #B3B3B3 1px solid; 
	border-left: #B3B3B3 1px solid; 	
	height: 22px; 
	text-align: left; 
}
/* ------------------------------------------- 
like line1_left, but this style will be align at right
ex: <td class="line1_right">text</td>
---------------------------------------------- */
.line1_right {
	padding-right: 5px; 
/*	background: #ffffff;  */
	color: #ffffff; 
	padding-top: 2px; 
	border-bottom: 1px solid #B3B3B3; 
	border-left: 1px solid #B3B3B3; 	
	height: 22px; 
	text-align: right; 
}

/* ------------------------------------------- 
like line1_left, but this style will be align at center
ex: <td class="line1_center">text</td>
---------------------------------------------- */
.line1_center {
	padding-right: 5px; 
/*	background: #ffffff;  */
	color: #FFFFFF; 
	padding-top: 2px; 
	border-bottom: 1px solid #B3B3B3; 
	border-left: 1px solid #B3B3B3; 	
	height: 22px; 
	text-align: center; 
}
/* ------------------------------------------- 
like line1 style, but this style has light gray background, 
and this has 3 style with align position companion
ex: <td class="line2_left">text</td>
---------------------------------------------- */
.line2_left {
	padding-left: 5px; 
/*	background: #f5f5f5; */
	color: #000000; 
	padding-top: 2px; 
	border-bottom: #B3B3B3 1px solid; 
	border-left: #B3B3B3 1px solid; 	
	height: 22px; 
	text-align: left; 
}
.line2_right {
	padding-right: 5px; 
/*	background: #f5f5f5;  */
	color: #FFFFFF; 
	padding-top: 2px; 
	border-bottom: 1px solid #B3B3B3; 
	border-left: 1px solid #B3B3B3; 	
	height: 22px; 
	text-align: right; 
}
.line2_center {
	padding-right: 5px; 
/*	background: #f5f5f5; */
	color: #FFFFFF; 
	padding-top: 2px; 
	border-bottom: 1px solid #B3B3B3; 
	border-left: 1px solid #B3B3B3; 	
	height: 22px; 
	text-align: center; 
}

/* --- for menu item in portlet ----- */
.trow1 {
	padding-top: 2px; 
/*	border-bottom: 1px solid #FFFFFF; 
	border-left: 1px solid #FFFFFF; 	*/
	height: 25px;
	padding-right: 10px;
	color: #FFFFFF;
	text-align: right;
	font-size:12px;
	font-weight:bold;
	background-color: #DFDFDF;
}

.trow_sub {
	padding-top: 2px; 
	height: 22px;
	padding-right: 10px;
	color: #000000;
	text-align: right;
	font-size: 11px;
	font-weight:bold;	
	background-color: #DFDFDF;
}

.trow_active {
	padding-top: 2px;
	padding-bottom: 2px;
/*	border-left: 1px solid #495F6C; 	
	border-bottom: 1px solid #FFFFFF;  */
	height: 25px;
	padding-right: 10px;
/*	color: #FFFFFF; */
	color: #E77918;
	font-weight: bold;
	text-align: center;
	font-size:12px;	
	font-weight: bold;
	background-color: #83B0CB;
}

.trow_sub_selected {
	padding-top: 2px; 
	height: 22px;
	padding-right: 10px;
/*	color: #FFFFFF; */
	color: #E77918;
	font-weight: bold;
	text-align: right;
	font-size: 11px;
	font-weight: bold;
	background-color: #5C8399;	
}

.cellpadding{
		padding-left:3; 
		padding-right:3;
		padding-top:3;
		padding-bottom:3
}

.field_name{
		text-align: right;
		padding-left:3; 
		padding-right:5;
		padding-top:3;
		padding-bottom:3
}
.c_menu_level1 {  
		font-family:Verdana;
		color:#452f2f; 
		font-size: 14px; font-weight:bold
		
}

.c_menu_level2 {  
		font-family:Verdana;
		color:#000000; 
		font-size: 12px; font-weight:bold
		
}
.mmenu {
	HEIGHT: 22px; BACKGROUND-COLOR: #fdfdef
}
.smenu {
	FONT-SIZE: 12px; COLOR: #452f2f; BORDER-BOTTOM: #95a5bc 1px solid; FONT-FAMILY: arial; HEIGHT: 24px; BACKGROUND-COLOR: #fdfdef; TEXT-ALIGN: left; TEXT-DECORATION: none
}
.smenu2 {
	FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #452f2f; BORDER-BOTTOM: #95a5bc 1px solid; FONT-FAMILY: arial; HEIGHT: 24px; BACKGROUND-COLOR: #fdfdef; TEXT-ALIGN: left; TEXT-DECORATION: none
}
A.txtsmenu:link {
	COLOR: #452f2f; TEXT-DECORATION: none
}
A.txtsmenu:visited {
	COLOR: #452f2f; TEXT-DECORATION: none
}
A.txtsmenu:hover {
	COLOR: #452f2f; TEXT-DECORATION: none
}
.ssmenu {
	FONT-SIZE: 11px; VERTICAL-ALIGN: middle; COLOR: #035495; FONT-FAMILY: arial; HEIGHT: 20px; BACKGROUND-COLOR: #eaf7ff; TEXT-ALIGN: left; TEXT-DECORATION: none
}
.ssmenu2 {
	FONT-SIZE: 11px; VERTICAL-ALIGN: middle; COLOR: #ff7e00; FONT-FAMILY: arial; HEIGHT: 20px; BACKGROUND-COLOR: #eaf7ff; TEXT-ALIGN: left; TEXT-DECORATION: none
}
A.txtssmenu:link {
	COLOR: #ff7e00; TEXT-DECORATION: none
}
A.txtssmenu:visited {
	COLOR: #ff7e00; TEXT-DECORATION: none
}
A.txtssmenu:hover {
	COLOR: #ff7e00; TEXT-DECORATION: none
}

a.menu_text {
	color: #452f2f;
	font-size: 13px;
	font-weight: bold;
	padding: 0 15px;
	font-family: arial;
	text-decoration: none;	
}

a.menu_text:hover {
	color: #b70408;
	font-size: 13px;
	font-weight: bold;
	padding: 0 15px;
	font-family: arial;
	text-decoration: none;	
}

td.menu_td {
	padding: 29px 15px 0 15px;
	vertical-align: top;
	text-align: center;
	border-right: 2px solid #a0c3d9;
	height: 56px;
}

td.menu_td:hover {
	padding: 29px 15px 0 15px;
	vertical-align: top;
	text-align: center;
	border-right: 2px solid #a0c3d9;
	height: 56px;
	background: url(../images/menu/menu_index_hover_bg.png);
}

td.menu_end_td {
	padding: 29px 15px 0 15px;
	vertical-align: top;
	text-align: center;
	height: 56px;
}

td.menu_end_td:hover {
	padding: 29px 15px 0 15px;
	vertical-align: top;
	text-align: center;
	height: 56px;
	background: url(../images/menu/menu_index_hover_bg.png);
}

a.menu_a {
	color: #015aff;
	font-size: 12px;
	font-weight: bold;
	font-family: arial;
	text-decoration: none;	
}

a.menu_a:hover {
	color: #42a9f9;
	font-size: 12px;
	font-weight: bold;
	font-family: arial;
	text-decoration: none;	
}

a.link_title {
	color: #ff8a00;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
}

a.link_title:hover {
	color: #fbb561;
	text-decoration: none;
}

.news_text {
	text-align: justify;
	 padding-right: 4px;
}

.news_image {
	border: 1px solid #999999;
	width: 88px;
	height: 80px;
}

.book_image {
	border: 1px solid #999999;
	width: 70px;
	height: 90px;
}

a.link_content {
	color: #0075d6;
	text-decoration: none;
	font-size: 12px;
}

a.link_content:hover {
	color: #55a9ee;
	text-decoration: none;
	font-size: 12px;
}

a.language_link {
	color: #ffffff;
	font-size: 12px;
	text-decoration: none;
}

a.language_link:hover {
	color: #b3f9d4;
	font-size: 12px;
	text-decoration: none;
}