@charset "utf-8";

/* Basic style */
* { margin: 0px; padding: 0px; }
html 	{ height: auto; width: 100%; }
body 	{ color: #999999; width: 100%; background-color: #FFFFFF; font-family: "Arial", sans-serif;
		  font-size: 0.7em; font-style: normal; font-weight: normal; font-variant: normal; text-align:justify; }
a 		{ border: 0px; }
a 		{ text-decoration:none; color: #990000; }
a:hover { text-decoration:underline; color: #FF0000; }
img 	{ border: 0px; }
hr 		{ display: none; }
#content { width: 980px; clear: both; margin-right: auto; margin-left: auto; overflow: hidden; text-align: justify; right:auto; left:auto; padding-bottom:5px; }
#footer { width: 980px; clear: both; margin-right: auto; margin-left: auto; overflow: hidden; text-align: justify; right:auto; left:auto;}
h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color:#065879;
}
h5 {
	font-family: Calibri, Arial;
	font-size: 12px;
	color: #666666;
}

/* Header & Main Menu */
#header 		{ width: 980px; height: 74px; background-image: url(../images/bg_header.gif); background-repeat: repeat-x; clear: both; margin-right: auto; margin-left: auto; }
#logo 			{ background-image: url(../images/logo.gif); background-repeat: no-repeat; width: 234px; height: 74px; margin-left: 10px; position: absolute; }
#main_menu 		{ position: relative; float: right; height:51px; list-style:none; top: 10px; text-align: left; clear: right; width: auto; overflow: hidden; }
#main_menu li	{ float: left; }
#main_menu li a	{ color: #083148; font-size: 1.1em; font-weight: normal; line-height: 51px; background-image: url(../images/menu_sep.gif); background-repeat: no-repeat; background-position: left center; letter-spacing: -1px;
				  text-decoration: none; padding-top: 0px; padding-bottom: 0px; padding-left: 15px; text-align: left; float: left; padding-right: 15px; font-family: "Arial Rounded MT Bold", "Arial Black"; text-transform: uppercase; }
#main_menu li a:hover	{ text-decoration: underline; }

/* Banner */
#banner { height: 350px; clear: both; width: 980px; background-image: url(../images/bg_main_banner.gif); background-repeat: repeat-x; margin-right: auto; margin-left: auto; }
#banner_text { position: relative; width: auto; float:left; text-align: left; padding-top:90px; padding-left:65px; }
#banner_flash { position: relative; width: auto; float:left; text-align:right; padding-top:45px; padding-left:65px; }
#banner_sep { height: 32px; clear: both; width: 980px; background-image: url(../images/bg_bottom_banner.gif); background-repeat: repeat-x; margin-right: auto; margin-left: auto; }
#content_banner { height: 151px; clear: both; width: 980px; background-image: url(../images/content_banner.gif); background-repeat: no-repeat; margin-right: auto; margin-left: auto; }

/* Quick Link */
#quick_link1 { position: relative; width: 311px; float:left; margin-left: 8px;}
#content #quick_link1 h1 { height: 111px; text-indent: -9999px; overflow: hidden; width: 311px; }
#content #quick_link1 h1 span 	{ display: block; height: 111px; position: absolute; left: 0; top: 0; width: 311px; z-index: 1; background-image: url(../images/demo_account_link.gif); background-repeat: no-repeat; background-position: left top; cursor:pointer; }
#content #quick_link1 h1 span:hover 	{ background-position: right top; cursor:pointer; }

#quick_link2 { position: relative; width: 311px; float:left; margin-left: 15px;}
#content #quick_link2 h1 { height: 111px; text-indent: -9999px; overflow: hidden; width: 311px; }
#content #quick_link2 h1 span 	{ display: block; height: 111px; position: absolute; left: 0; top: 0; width: 311px; z-index: 1; background-image: url(../images/real_account_link.gif); background-repeat: no-repeat; background-position: left top; cursor:pointer; }
#content #quick_link2 h1 span:hover	{ background-position: right top; cursor:pointer; }

#quick_link3 { position: relative; width: 311px; float:left; margin-left:15px;}
#content #quick_link3 h1 { height: 111px; text-indent: -9999px; overflow: hidden; width: 311px; }
#content #quick_link3 h1 span 	{ display: block; height: 111px; position: absolute; left: 0; top: 0; width: 311px; z-index: 1; background-image: url(../images/software_download_link.gif); background-repeat: no-repeat; background-position: left top; cursor:pointer; }
#content #quick_link3 h1 span:hover 	{ background-position: right top; cursor:pointer; }

/* Content Separator */
#content_sep { position: relative; float:left; background-image: url(../images/content_sep.gif); background-repeat: no-repeat; height: 35px; width: 100%; background-position: center bottom; }

/* Content Title */
#content_details { position: relative; float:left; width: 634px; margin-left: 8px; padding-top:10px; }
#content_side_item { position: relative; float:left; width: 311px; margin-left: 15px; padding-top:10px; }

/* Content */
#content_details #content_title { text-align: left; margin-bottom:15px; }
#content #content_details #content_detail { text-align: justify; font-size: 1.1em; color: #666666; clear: both; }

/*footer */
#footer_sep { background-image: url(../images/footer_sep.gif); background-repeat: repeat-x; height: 4px; margin-top: 15px; }
#footer_bg { background-image: url(../images/bg_footer.gif); background-repeat: repeat-x; height: 268px; }
#footer_link { height: 65px; background-color: #000000; }
#footer_main_link { position: relative; width: 430px; height:75%; float:left; text-align: left; padding:30px; }
#footer_main_link1 { position: relative; width: 142px; float:left;}
#footer_main_link1 li { list-style:none; margin-bottom: 10px; }
#footer_main_link1 li a { color: #cbccce; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; text-decoration: none; text-align: left; letter-spacing: -1px; }
#footer_main_link1 li a:hover { color: #cbccce; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; text-decoration: underline; }

#footer_form {
	position: relative;
	width: 430px;
	height:75%;
	float:left;
	text-align: left;
	padding-top: 50px;
	padding-right: 30px;
	padding-bottom: 10px;
	padding-left: 30px;
}
#footer_form_area { border-left-width: 1px; border-left-style: solid; border-left-color: #526776; padding-left:30px; padding-right:30px; height: 210px; }
#footer_form_area h1 {
	text-indent: -9999px;
}
#footer_form_area h1 span {
	background-image: url(../images/contact_us.png);
	display: block;
	height: 36px;
	position: absolute;
	left: 60px;
	top: 30px;
	width: 113px;
	z-index: 1;
	background-repeat: no-repeat;
}
#my_form { clear:both; }

#footer_bg img { z-index: 0; position: absolute; left: 150px; padding-top: 60px; }
label { width: 10em; float: left; text-align: left; margin-right: 0.5em; display: block; color: #000000; font-weight: bold; font-family: Arial, Helvetica, sans-serif; font-size: 11px; }

/*Form Style */
span.CheckBoxStyle input { left: 100%; right: 100%; display: block; text-align: center; }
span.TextBoxStyle input { border: 1px solid #cbcdcc; background-image: url(../images/bg_text_field.gif); background-repeat: repeat-x; width:200px; height: 21px; text-align: left; margin-bottom: 7px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color:#333333; padding-left:2px;}
span.MyButStyle input { border: 1px solid #cbcdcc; font-family: Arial, Helvetica, sans-serif; background-image: url(../images/bg_footer.gif); width: auto; text-align: center; padding-right: 5px; padding-left: 5px; color: #FFFFFF; font-weight: bold; height: 25px; background-position: bottom; position: static; }

#my_form label { width: 8em; float: left; text-align: left; margin-right: 0.5em; display: block; color: #cbcbcd; font-weight: bold; }
#my_form input { border: 1px solid #cbcdcc; background-image: url(../images/bg_text_field.gif); background-repeat: repeat-x; height: 21px; text-align: left; margin-bottom: 7px; width: 185px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color:#333333; }
#my_form textarea { width: 270px; border: 1px solid #cccccc; overflow: auto; background-image: url(../images/bg_text_area.gif); background-repeat: repeat-x; background-position: top; background-color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-size: 12px; height: 50px; color:#333333; margin-bottom: 7px; }
#my_form .submit input { font-family: Arial, Helvetica, sans-serif; background-image: url(../images/bg_footer.gif); width: auto; text-align: center; padding-right: 5px; padding-left: 5px; color: #FFFFFF; font-weight: bold; height: 25px; float: right; background-position: bottom; position: static; }

#footer_company { width: 460px; height: 36px; margin-left: 10px; position: absolute; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #CCCCCC; display: block; margin-top: 16px; }
#footer_hyperlink { position: relative; float: right; height:auto; list-style:none; text-align: left; clear: right; width: auto; overflow: hidden; margin-top: 10px; top: -50px; }
#footer_hyperlink li	{ float: left; }
#footer_hyperlink li a	{ color: #cccccc; font-size: 1.1em; font-weight: normal; line-height: 17px; letter-spacing: -1px; text-decoration: none; padding-top: 0px; padding-bottom: 0px; padding-left: 15px; text-align: left; float: left; padding-right: 15px; font-family: Arial, Helvetica, sans-serif; border-left-width: 1px; border-left-style: solid; border-left-color: #CCCCCC; }
#footer_hyperlink li a:hover	{ text-decoration: underline; }

/* Login */
#login_form label { color:#000000; }
#login_form a { text-align: right; text-decoration: none; font-size: 11px; color: #003366; }
#login_form a:hover { text-align: right; color: #FF0000; text-decoration: underline; }

/* Menu Client */
#menu_cl h4 { color: #092d43; font-size: 14px; }
#menu_cl ul { color: #083952; list-style-type: square; padding-left: 20px; height:25px; }
#menu_cl ul:hover { color: #037ea9; background-color: #F5F5F5; }
#menu_cl li a { color: #083952; font-size: 1.05em; font-weight: normal; letter-spacing: 0px; text-decoration: none; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; text-align: left; padding-right: 15px; font-family: "Trebuchet MS", Arial; display: block; margin-bottom: 0px; }
#menu_cl li a:hover { text-decoration:underline; }

/* Form */
#form_client { position: relative; width: 600px; height:100%; float:left; text-align: left; display: block; padding-right: 30px; padding-left: 30px; }
#form_client form label { color: #000000; width: 11em; margin-left: 5px; clear: left; }
#form_client fieldset{ margin-bottom: 50px; padding: 10px; border: 1px dashed #CCCCCC; }
#form_client fieldset legend{ font-family: Arial, Helvetica, sans-serif; font-size: 12pt; color: #333333; text-align: left; font-weight: bold; }
#form_client .lagend_img{ padding: 5px; width: 60px; text-align: center; border-right-width: 1px; border-right-style: solid; border-right-color: #999999; position: relative; }
#form_client .lagend_info{ width: auto; float: left; text-align: left; position: absolute; z-index: auto; padding-left: 90px; left: 35px; top: 35px; list-style-type: none; margin-bottom: 5px; }

.error{ float: left; text-align: left; z-index: auto; left: 35px; top: 35px; list-style-type: none; margin-bottom: 5px;	background-color: #FFCECE; height: auto; border: 4px solid #FF7777; width: 540px; background-image: url(../images/msg_error.gif); background-repeat: no-repeat; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 40px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; background-position: 5px 5px; }
.error li{ font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; }

.success{ float: left; text-align: left; z-index: auto; left: 35px; top: 35px; list-style-type: none; margin-bottom: 5px;	background-color: #BDF48A; height: auto; border: 4px solid #006633; width: 540px; background-image: url(../images/msg_check.gif); background-repeat: no-repeat; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 40px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; background-position: 5px 5px; }

.spacer{clear:both;}
.spacer_pad_top{clear:both; height:10px;}
.error_login { float: left; text-align: left; z-index: auto; left: 35px; top: 35px; list-style-type: none; margin-bottom: 5px;	background-color: #FFCECE; height: auto; border: 4px solid #FF7777; width: 180px; background-repeat: no-repeat; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 20px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold;}
.error_login li{ font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; list-style-type: none; }

#acc_type { width: 196px; float: right; margin-right: 7px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #333333; text-align: justify; height: 120px; background-color: #EFEFEF; padding: 3px; border: 1px solid #CCCCCC; }
#acc_type h3 { text-align: left; font-family: "Arial Narrow", Arial; font-size: 13px; font-weight: bold; color: #333333; }

/* Table */
#tbl_doc { text-align: left; font-family: "Arial Narrow", Arial; font-size: 13px; font-weight: bold; color: #333333; margin-top: 10px; }
#tbl_doc th { font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; background-color: #08739e; font-size: 10pt; text-align: left; text-indent: 10px; height: 30px; vertical-align: middle; }
#right_th { background-image: url(../images/blue-30-hdr-crnr.gif); background-repeat: no-repeat; background-position: right; background-color: #08739e; }
#tbl_doc tr { height: 30px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; text-align: left; text-indent: 10px; }
.grey { background-color: #F5F5F5; }

/* Bank Link */
#hsbc { height: 36px; width: 98px; float: left; position: relative; padding-right: 1px; }
#hsbc h1 {text-indent: -9999px; }
#hsbc h1 span {cursor: pointer;background-image: url(../images/hsbc.gif);background-repeat: no-repeat;background-position: left;z-index:1;height: 36px;width: 98px;left: 0px;top: 0px;position: absolute;display: block; }
#hsbc h1 span:hover { background-position: right; }

#asb { height: 36px; width: 76px; float: left; position: relative; padding-right: 1px; }
#asb h1 {text-indent: -9999px; }
#asb h1 span {cursor: pointer;background-image: url(../images/asb.gif);background-repeat: no-repeat;background-position: left;z-index:1;height: 36px;width: 76px;left: 0px;top: 0px;position: absolute;display: block; }
#asb h1 span:hover { background-position: right; }

#scb { height: 36px; width: 94px; float: left; position: relative; padding-right: 1px; }
#scb h1 {text-indent: -9999px; }
#scb h1 span {cursor: pointer;background-image: url(../images/standard_chartered.gif);background-repeat: no-repeat;background-position: left;z-index:1;height: 36px;width: 94px;left: 0px;top: 0px;position: absolute;display: block; }
#scb h1 span:hover { background-position: right; }

#icbc { height: 36px; width: 79px; float: left; position: relative; padding-right: 1px; }
#icbc h1 {text-indent: -9999px; }
#icbc h1 span {cursor: pointer;background-image: url(../images/icbc.gif);background-repeat: no-repeat;background-position: left;z-index:1;height: 36px;width: 79px;left: 0px;top: 0px;position: absolute;display: block; }
#icbc h1 span:hover { background-position: right; }

#boc { height: 36px; width: 103px; float: left; position: relative; padding-right: 1px; }
#boc h1 {text-indent: -9999px; }
#boc h1 span {cursor: pointer;background-image: url(../images/boc.gif);background-repeat: no-repeat;background-position: left;z-index:1;height: 36px;width: 103px;left: 0px;top: 0px;position: absolute;display: block; }
#boc h1 span:hover { background-position: right; }


#content_menu { width: 170px; float: left; height: auto; margin-right: 10px; }

#content_menu li {
	background-image: url(../images/sep.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	text-align: left;
	vertical-align: top;
	padding-top: 7px;
	padding-bottom: 7px;
	list-style-type: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}

#sub_content {
	width: 454px;
	float: left;
}