/* CSS Document */
@charset "utf-8";
* { font-family: Arial,Helvetica,Verdana,sans-serif; }
body { margin:0; padding:0; font-size:12px; color:#333;}
	/* firefox 2.0/3.0 hacks only, for 1px background issue */
	body, x:-moz-any-link {position:relative;left:-1px;}
	body, x:-moz-any-link, x:default {position:relative;left:-1px;}
		
a:link, a:visited, a:hover {color:#0066CC; text-decoration:none;}
	 
form {margin: 0px 0px; padding: 0px 0px;}

textarea,{ background:#FFFFFF; color:#000000; }

td {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 14px;
	letter-spacing: 0px;
	color: #4b4b4b;
	font-weight : normal;
	text-decoration : none;
	line-height: 23px;	
	}
	
#bodyWrap {
	padding:0; margin:0; text-align:left; width:100%; background:url('../images/top_bg.png') repeat-x; 
	}	
	
#wrap {
	padding:0 0px 0 25px; margin: 0 auto 0 auto; text-align:left; width:1001px; 
	}

#header {
	position:relative; height:139px; margin-left:0px; padding:0 0px 0 0px; text-align:left;
/*	background:url('../images/header_bg.jpg') no-repeat; */
	}
	
#footerMenu {padding:0px auto 0px auto; text-align:center; font-size:12px; width:100%; margin:0px auto 30px auto;	}
#footerMenu .sitemap {padding-top:2px; text-align:left; margin:2px auto; background:url('../images/footerMenu_bg.gif') repeat-x; }
#footerMenu .sitemap hr { display:none;}
#footerMenu .sitemap .column {width: 160px; margin-right: 5px; padding-top:0px;}
#footerMenu .sitemap .column h3 {font: bold 11px Arial,Helvetica,Verdana,sans-serif; margin-bottom:0px; text-align:left; margin: 0 0 1px 0; padding-top:0px;}
#footerMenu .sitemap .column a { text-decoration: none; color:#707070;}
#footerMenu .sitemap .column a:hover { color:#33CCFF;}
#footerMenu .sitemap .column ul {margin-top:0px; margin:0; padding-left: 10px;	list-style-type: none;}
#footerMenu .sitemap .column ul li {padding-bottom: 5px; text-align:left;}
#footerMenu .column ul li a {text-decoration: none; color: #707070;}
#footerMenu .column ul li a:hover {color:#33CCFF;}
	
#footer {padding:10px auto 0px auto; margin:10px auto 0px auto; text-align:center; font-size:12px; background-color:#eee}
	
.logo {position:absolute; left:8px; top:40px; z-index:2;}
.select_language {position:absolute; left:230px; top:90px; z-index:2; color:#666666;}

/* webID input */
.personal_website {position:absolute; top:20px; left:240px; z-index:2;}
.personal_website input {vertical-align:middle; margin:0 2px 0 2px; padding:1px 2px 0 2px; border:1px solid #CDCDCD;}
.personal_website .webidinput {
	width:80px; height:20px; padding:1px 2px 0 2px;
	margin:0 1px 0 0; _margin:-2px 1px 0 0;
	font-size:12px; color:#9d9491;
	background:#fff;
	border:1px solid #CDCDCD;
}
*+html .personal_website .webidinput {margin:-2px 1px 0 0;}

.main_banner {
	position:relative;width:977px; height:375px;  padding:0 auto 0 auto; margin:0 auto 0 auto; z-index:0; 
	background-color:#FFFFFF;
	}
	
.main_banner2 {float:left; position:relative;width:825px; height:401px;  padding:0; margin:0; z-index:0; background-color:#FFFFFF; text-align:left; background:url(../images/banner_bg.jpg) no-repeat;}

.main_videothumb {float:left; position:absolute; left:830px; width:199px; height:401px; padding:0; margin:0; z-index:0; background:url(../images/videoThumb_bg.png) no-repeat;}
.main_videothumb .main_videothumbContent {position:relative; width:162px; background:#fff; margin:40px 0px 20px 18px; }
.main_videothumb .watchvideo_label {position:absolute; left:16px; bottom:20px;}

.banner {
	position:relative;width:977px; height:251x;  padding:0 auto 0 auto; margin:0 auto 0 auto; z-index:0; 
	background-color:#FFFFFF;
	}
	
	
.hh_line {
	position:relative;width:977px; height:20px;  padding:0 auto 0 auto; margin:0 auto 0 auto; z-index:2;
	background:url('../images/hh_line.png') no-repeat; 
	}
	
.navigation {
	position:relative;width:977px; height:13px;  padding:0 auto 0 auto; margin:0 auto 0 auto; z-index:2;
	background:url('../images/hh_line.png') no-repeat; 
	}

#content {
	clear:both; 
	position:relative;  padding:0 auto 0 auto; margin:0 auto 0 auto; height: 100%; width:100%; 
	}
	
.mainContent {width:700px; margin:15px auto; padding: 15px auto;}

#content .div1 { float:left; width:230px; padding:0 10px 0 0; }
#content .div2 { float:left; width:619px; padding:0 0 0 0; }
#content .div1 .leftNav { float:left; position:relative; margin:25px 5px 0px 20px;clear:both; width:220px; height: 100%;}
#content .div2 .mainContent { float:left; position:relative; margin:15px 0px 0px 10px; padding:0px 0px 20px 20px; clear:both; width:680px; height: 100%;}
#content .div2 .eventScroller { position:relative; margin:10px 0px 0 0;padding:0px 0px 20px 20px; width:675px; clear:both}
#content .div2 .mainVideo { position:relative; margin: 0 auto 0 auto; padding:50px 0px 20px 0; width:520px; height:328px;clear:both}


#content .leftNav {width:230px; padding:0px 0px 0px 0px; }
#content .leftNav hr {width:90%; padding: 0; text-align:left}
#content .leftNav .column{
	width: 220px; /*width of each menu column*/
	margin: 0px;
	padding: 0px;
	text-align:left;
	line-height:20px;
}

#content .leftNav .column h3{
	font-size:12px;
	margin:0px;
	padding:0px;
}

#content .leftNav .column h3 a{
	font-size:12px;
	margin-top:0px;
	display:block;
	width: 100%;
}

#content .leftNav .column h3 a:hover{
	font-size:12px;
	margin-bottom:0px;
	background-color:#e6e5f0;
	display:block;
}


#content .leftNav .column ul{
	margin: 0;
	padding-left: 10px;
	list-style-type: none;
	text-align:left;
}

#content .leftNav .column ul li{
	padding-bottom: 0px;
}

#content .leftNav .column ul li a{
	text-decoration: none;
	color:#666666;
	display:block; 
	width: 100%;
}

#content .leftNav .column ul li a:hover{
	color:#33CCFF;
	background:center;
	width: 100%;
	padding:0;
	background-color:#e6e5f0;
	display:block;
}

#content .leftNav #eventScrollVertical li {
	clear:both;
	float:none;
	list-style:none; 
	border:0; 
	margin: 0;
	padding:0; 
	background:#FFF;
	width:230px;
	height:152px;
	text-align:left;
}


.tab_container .tab_content .tabdiv1 { float:left; width:440px; padding:0 10px 0 0; }
.tab_container .tab_content .tabdiv2 { float:left; width:440px; padding:0 10px 0 0; }
.tab_container .tabdiv1 #news { position:relative; margin:0px 5px 0px 5px;clear:both; height: 100%;}
.tab_container .tabdiv2 #countdown_dashboard { position:relative; margin:0px 10px 0px 10px; padding:0px 10px 0px 10px; clear:both; width:400px; height: 100%;}
.tab_container .tabdiv2 #check_qualification { position:relative; margin:0px 0px 10px 20px; padding:0px 0px 10px 20px; clear:both; width:400px; height: 100%;}


.text0 {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
	color: #4b4b4b;
	font-weight : normal;
	text-decoration : none;
	line-height: 15px;
	}

.text1 {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
	color: #666666;
	font-weight : normal;
	text-decoration : none;
	}
	
.text2 {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
	color: #4b4b4b;
	font-weight : normal;
	text-decoration : none;
	line-height: 15px;
	}
/*
.personalweb_text {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
	color: #15ADFF;
	font-weight : bold;
	text-decoration : none;
	line-height: 20px;
	}
*/
.warning {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
	color: #FF0000;
	font-weight : bold;
	text-decoration : none;
	line-height: 15px;
	height:500px;
	}
	
.header1 {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 12px;
	letter-spacing: 0px;
	color: #4b4b4b;
	font-weight : bold;
	text-decoration : none;
}

.header2 {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 16px;
	letter-spacing: 0px;
	color: #ffae00;
	font-weight : bold;
	text-decoration : none;
	line-height: 40px;
}

.header3 {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 13px;
	letter-spacing: 0px;
	color: #ffae00;
	font-weight : bold;
	text-decoration : none;
	line-height: 20px; 
}
	
.copyright {
	font-family: Arial,Helvetica,Verdana,sans-serif;
	font-size: 11px;
	letter-spacing: 0px;
	color: #cccccc;
	font-weight : normal;
	text-decoration : none;
}	


#video {padding:10px auto 0 auto; margin:10px auto; text-align:center;}

#support_tools {width:100%; padding-top:30px; padding-left:20px;}
#support_tools .column {float:left; width: 300px;}
#support_tools .column li {list-style-type: none; height:50px;}
#support_tools .column li .tools-icon {float:left; padding-right:5px;}
#support_tools ..column li .header1 {float:left; padding-left:15px; padding-top:15px;line-height:10px; vertical-align:bottom;}

#fullheight {height:100%}


#liquid-round { 
width:100%;
margin:0px auto; 
background:#fff url(http://www.bhipglobal.com.hk/images/leftside.gif) repeat-y left top;
} 

.top { 
width:100%; 
height:20px; 
background:url(http://www.bhipglobal.com.hk/images/top.gif) no-repeat left top; 
} 

.top span { 
display:block; 
position:relative; 
height:20px; 
background:url(http://www.bhipglobal.com.hk/images/top-right.gif) no-repeat right top; 
} 

.center-content { 
position:relative; 
background:url(http://www.bhipglobal.com.hk/images/rightside.gif) repeat-y right top; 
padding:1px 20px 1px 25px; 
margin:-1px 0 -50px 0; 
} 

.bottom { 
height:60px; 
background:url(http://www.bhipglobal.com.hk/images/bottom.gif) no-repeat left bottom; 
}


.bottom span { 
display:block; 
position:relative; 
height:60px; 
background:url(http://www.bhipglobal.com.hk/images/bottom-right.gif) no-repeat right top; 
} 


.t {background: url(http://www.bhipglobal.com.hk/images/dot.gif) 0 0 repeat-x; width: 20em}
.b {background: url(http://www.bhipglobal.com.hk/images/dot.gif) 0 100% repeat-x}
.l {background: url(http://www.bhipglobal.com.hk/images/dot.gif) 0 0 repeat-y}
.r {background: url(http://www.bhipglobal.com.hk/images/dot.gif) 100% 0 repeat-y}
.bl {background: url(http://www.bhipglobal.com.hk/images/bl.gif) 0 100% no-repeat}
.br {background: url(http://www.bhipglobal.com.hk/images/br.gif) 100% 100% no-repeat}
.tl {background: url(http://www.bhipglobal.com.hk/images/tl.gif) 0 0 no-repeat}
.tr {background: url(http://www.bhipglobal.com.hk/images/tr.gif) 100% 0 no-repeat; padding:10px} 


#emailform {
	width:450px;margin:10px auto;padding:10px;
	border:1px solid #333;background-color:#dfdfdf}

#emailform strong {	color:#66f}

#buttons {text-align:right}


/******* For Mega Menu ********/
.megamainmenu {  
	position:absolute;
/*	padding-left: 10px; 
	margin-left: -6px; 
*/
	color: #ffffff;
width:540px;
	top:75px; 
	height:35px;
	right:25px;
	font-size:14px;	
	font-weight:bold; 
	z-index:10000; 
	background:url('../images/navbg.jpg') repeat-x;
}

.megamainmenu .megamainmenu_left {
	padding-left: 10px; 
	margin-left: -6px; 
	height:35px;
	background:url('../images/nav_left.jpg') no-repeat left top;
}

.megamainmenu .megamainmenu_right {
	padding-right: 10px; 
	margin-right: -6px; 
	padding-top:10px;
	height:35px;
	background:url('../images/nav_right.jpg') no-repeat right top;
}

.megamainmenu .megamainmenu_left .megamainmenu_right a {
	color: #ffffff;
	border: 0px solid #cccccc;
	border-top: 0px solid #cccccc;
	border-style: solid;
	border-width: 0px; 
	background:none;
}

.megamainmenu a:hover {
	color: #cccccc;
	border: 0px solid #cccccc;
	border-top: 0px solid #cccccc;
	border-bottom: 1px solid white;
	border-style: solid;
	border-width: 0px; 
	background: 0f0087;
}

.megamenu {
width:250px;
	position:absolute;
 	display: none; 
	left: 0px;
	top: 0px;
	background-color: #617bab; 
/*	filter:alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity:0.8; 
	border: 0px solid #cccccc; */
	border-width: 0px;
	padding-left: 12px; 
	margin-left: -6px; 
	font: normal 14px Arial,Helvetica,Verdana,sans-serif;
	z-index: 1;
	background: url(../images/mgabg_left.png) no-repeat 0 100%; 
}

.megamenu .megamenu_container {
	padding: 10px; 
	background: url(../images/mgabg.png) no-repeat 100% 100%;
}

.megamenu .column {
	float: left;
	padding-right:50px;
/*	width: 200px; width of each menu column */
}

.megamenu .column ul {
	margin: 0;
	padding-left: 8px;
	list-style-type: none;
	text-align:left;	
}

.megamenu .column ul li {
	padding-bottom: 5px;
}

.megamenu .column h3 {
/*	background: #e0e0e0; */
	font: bold 12px Arial,Helvetica,Verdana,sans-serif;
	margin: 0 0 3px 0;
	height: 20px;
/*	background-image:url(../images/bg_nav.gif); */
	padding-top:0px;
	text-align:left;
}

.megamenu .column h3 a {
	text-decoration: none;
	color:#FFFFFF;
}

.megamenu .column h3 a:hover { color:#33CCFF;}

.megamenu .column ul li a {
	text-decoration: none;
	color: #ffffff;
}

.megamenu .column ul li a:hover {
	color:#33CCFF;
}
/***** End for Meaga Menu **********


/***** For slideshow ***********/
.clearfix{
	clear:both;
	float:none;
}

#bigPic{
	width:977px;
	height:250px;
	padding:0px;
	border:none;
	background-color:#FFF;
	margin-bottom:0px;
}
#bigPic img{
	position:absolute;
	display:none;
}
ul#thumbs li.active{
	border:2px solid #000;	
	background:#fff;
	padding:2px;
}
ul#thumbs, ul#thumbs li{
	margin:0;
	padding:0;
	list-style:none;
}
	
ul#thumbs li{
	float:left;
	margin-right:7px;
	margin-bottom:5px;
	border:1px solid #CCC;	
	padding:3px;
	cursor:pointer;
}
ul#thumbs img{
	float:left;
	width:80px;
	height:80px;
	line-height:80px;
	overflow:hidden;
	position:relative;
	z-index:1;		
}
/******* End for slideshow *********/


/******** For Event Scroller *******/
.infiniteCarousel {
  width: 920px;
  height: 250px;
  position: relative;
}

.infiniteCarousel .wrapper {
  width: 780px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
  overflow: auto;
  min-height: 10em;
  padding:  40px 20px 0px 30px;
  margin: 40px 20px 0px 30px;
  position: absolute;
  top: 0;
}

.infiniteCarousel ul a img {
  border: 0px solid #000;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
}

.infiniteCarousel .wrapper ul {
  width: 9999px;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0;
  padding:0;
  position: absolute;
  top: 0;
}

.infiniteCarousel ul li {
  display:block;
  float:left;
  padding: 0px;
  height: 85px;
  width: 220px;
}

.infiniteCarousel ul li a img {
  display:block;
}

.infiniteCarousel .arrow {
  display: block;
  height: 36px;
  width: 37px;
  background: url('../images/arrow.png') no-repeat 0 0;
  text-indent: -999px;
  position: absolute;
  top: 77px;
  cursor: pointer;
}

.infiniteCarousel .forward {
  background-position: 0 0;
  right: 0;
}

.infiniteCarousel .back {
  background-position: 0 -72px;
  left: 0;
}

.infiniteCarousel .forward:hover {
  background-position: 0 -36px;
}

.infiniteCarousel .back:hover {
  background-position: 0 -108px;
}
/******** End Event Scroller *******/



/******* For Tabs ************/
.container {width: 950px; margin: 10px auto;}
ul.tabs {
	margin: 0;
	padding-left: 50px;
	float: left;
	list-style: none;
	height: 32px;
	border-bottom: 0px solid #999;
	border-left: 0px solid #999;
	width: 100%;
}
ul.tabs li {
	float: left;
	margin: 0;
	padding: 0;
	height: 31px;
	line-height: 31px;
	border: 1px solid #999;
/*	border-left: none; */
	margin-bottom: -1px;
	background: #e0e0e0;
	overflow: hidden;
	position: relative;
}
ul.tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	font-size: 1.2em;
	padding: 0 20px;
	border: 1px solid #fff;
	outline: none;
}
ul.tabs li a:hover {
	background: #ccc;
}	

ul.tabs li a:active {color: #FF9900;}
ul.tabs li.active {color: #FF9900;}

html ul.tabs li.active, html ul.tabs li.active a:hover  {
	background: #fff;
	border-bottom: 0px solid #fff;
	color: #FF9900;
}

.tab_container {
	background:url('../images/hh_line.png') no-repeat; 
	border: 0px solid #999;
	border-top: none;
	clear: both;
	float: left; 
	width: 100%;
/*	background: #fff; */
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
.tab_content {
	padding: 20px;
	font-size: 1.2em;
}
.tab_content h2 {
	font-weight: normal;
	padding-bottom: 10px;
	border-bottom: 1px dashed #ddd;
	font-size: 1.8em;
}
.tab_content h3 a{
	color: #254588;
}
.tab_content img {
/*	float: left; */
	margin: 0 0px 0px 0;
	border: 0px solid #ddd;
	padding: 0px;
}
/******* End for Tabs ********/




/******* For Countdown *******/
#countdown_dashboard {
	height: 110px;
}

.dash {
	width: 110px;
	height: 114px;
	background: transparent url('../images/dash.png') 0 0 no-repeat; 
	float: left;
	margin-left: 20px;
	position: relative;
}

.weeks_dash {
	background: transparent url('../images/dash.png') 0 0 no-repeat;
}

.days_dash {
	background: transparent url('../images/dash.png') 0 0 no-repeat;
}

.hours_dash {
	background: transparent url('../images/dash.png') 0 0 no-repeat;
}

.minutes_dash {
	background: transparent url('../images/dash.png') 0 0 no-repeat;
}

.seconds_dash {
	background: transparent url('../images/dash.png') 0 0 no-repeat;
}


.dash .digit {
	font-size: 55pt;
	font-weight: bold;
	float: left;
	width: 55px;
	text-align: center;
	font-family: Times;
	color: #555;
	position: relative;
}

#countdown_dashboard .dash_title {
	position: absolute;
	display: block;
	bottom: 20px;
	right: 6px;
	font-size: 9pt;
	color: #555;
	text-transform: uppercase;
	letter-spacing: 2px;
}
/*********** End for Countdown ********/

/******* Chinese New Year ********/
.firework {  
	position:absolute;
	right:38px; 
	top:525px;
	z-index:10000; 
}

.firework2 {  
	position:absolute;
	left:0px; 
	top:5px;
	z-index:10000; 
}
.lantern {  
	position:absolute;
	right:0px; 
	top:5px;
	z-index:10000; 
}

.happy_cny {  
	position:absolute;
	right:38px; 
	top:525px;
	z-index:10000; 
}
/******* End Chinese New Year ********/