/* CSS Document */
/*
-----------------------------------------------------------------------------------------------------------
File Name: ha_framework-en.css
Purpose: Cascading Style Sheets
Author/s: ME
Date: 
Start Date	 Completion Date	Last upd by			Description
----------	 ---------------	---------------	--------------------------------------------------------------
XXXX/XX/XX   YYYY/YY/YY         ME              Initial version
2012/04/10   2012/04/10         CP(N4)3         Add Static Banner - Style amendment
2018/08/23   2018/08/31         Bobby Li        Update ShortCut and added ShortCutBox
2023/07/06   2023/07/06			Terry Tung		Add auto wrap and adjust position of print button
*/
body{
	margin-top: 0px;
	margin:0px;
	padding::0px;
	background-color: #FFF;
}
#hpBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#greenBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#blueBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#redBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#darkgreenBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#purpleBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#orangeBg {
	background-color: #FFF;
	background-image: url(../image/ha_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
}
#newBg {
	background-color: #FFF;
	background-position: top;
}

#content{
	position: relative;
	background: #FFF;
	width: 1000px;
	height:auto;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
	overflow:visible;
}
#leftbar{
	width: 265px;
	float: left;
	padding-top: 0px;
	padding-bottom:20px;
	padding-right: 5px;
	background-color: #fff;
	--background-image: url(../image/leftnav_bcbg.gif);
	background-repeat: repeat-x;
	background-position: top;
	overflow:visible;
}
#rightbar {
	float:left;
	width: 730px;
	height: auto;
	background-color:white;
}
#vertMenuholder{
	position:relative;
	background-color: #FFF;
	display: block;
	margin-top: 1px;
	background: #F1ECE9;
    background: -webkit-linear-gradient(left, #F1ECE9 , #CCC9C2);

    background: -moz-linear-gradient(right, #F1ECE9, #CCC9C2);
    background: linear-gradient(to right, #F1ECE9 , #CCC9C2);
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	border-radius: 5px;
}


#accordion3{
	--top:-8px;
	position: relative;
	float:left;
}
#searchPanel{
}
.whiteBg{
background-color:white;
}

/*--
#leftnavbg2{
	background-image: url(../eng/common/images/leftnav_navbgs.png);
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../common/images/leftnav_navbgs.png',sizingMethod='crop');
}
--*/


iframe#childframe{
	width: 728px;
	height: 800px;
	padding-top: 0px;
	padding-bottom:0px;
	margin:0px;
}
#contentholder{
	width: 710px;
	float: right;
	padding-top: 0px;
	padding-bottom:0px;
	margin:0px;
	background-color: #fff;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #E0E0E0;
}


#visual{
	position: relative;
	width:100%;
	margin:0px;
	padding:0px;
	text-align: center;
	background-color:white;
}

#mainVisual{
	position: relative;
	width:100%;
	height: 370px;
	margin:0px;
	padding:0px;
	text-align: center;
	background-color:white;
}

.leftnavbg{
	background-image: url(../image/leftnav_navbg2.gif);
	background-repeat: repeat-y;
}
/*  breadcrumb  */
#crumbsholder{
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-size: 10px;
	color: #666;
	background-color: #CCD0CF;
	border-top-left-radius:1em;
	border-top-right-radius:1em;
}
.crumbs {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	white-space: break-spaces; /* Updated by Terry Tung - 06/07/2023 Changed from nowrap to break-spaces */
	height:30px;
}
.crumbs a, .crumbs a:visited {
	list-style-type: none;
	color:black;
}	
#crumbsPrint{
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-size: 12px;
	color: #666;
	padding-top: 10px;
	padding-right: 15px;
	padding-bottom: 0px;
	padding-left: 10px;
	margin: 0px;
	float:right;
	height:23px;
}

#crumbsPrint a:link, 
#crumbsPrint a:visited{
	color: black;
	text-decoration:none;
}
#crumbsPrint a:hover{
	color:#5A1E88;
	text-decoration:underline;
}

#printPic2{
	padding: 0;
	margin-right: 5px;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: -50px; /* Updated by Terry Tung - 06/07/2023 Changed from 0px to -50px */
	vertical-align: text-bottom;
}
.crumbs a#bc  {
	list-style-type: none;
	background:url(../image/bc_arrow.gif) no-repeat right center;
	display:block;
	padding:0 15px 0 0;
	}		
	
.crumbs a#print  {
	background:url(../image/bc_arrow.gif) no-repeat right center;
	list-style-type: none;
	padding:0 15px 0 0;
}	
.crumbs a:link,
.crumbs a:visited {
	color:black;
	text-decoration:none;
}	
.crumbs a:hover,
.crumbs a:focus {
	color:#5A1E88;
	text-decoration:underline;
}

#searchBox{
	background-color: #0d732c;
	display: block;
	height: 54px;
	width: 214px;
	margin-top: -8px;
	padding: 13px 10px 13px 14px;
}
#searchfield{
	border: 1px solid #CCC;
	margin-right: -4px;

	height: 16px;
	width: 176px;
}
#searchBut{
	vertical-align: text-bottom;
}
#advsearch a:link,
#advsearch a:visited {
/*	color:#abceb5;*/
	text-decoration:none;
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-size: 10px;
	vertical-align: middle;
	}	
#advsearch a:hover,
#advsearch a:focus {
	color:black;
	text-decoration:underline;
}
#shortCut{
	position:relative;
	background-color: #FFF;
	display: block;
	/* height: 180px; */ 
	height:165px; /* CP(N4)3 - 2012/04/10 - Add Static Banner - Style amendment */
	width: 222px;
	margin-top: 1px;
	background-image: url(../image/r_nav_sc_bg.gif);
	background-repeat: repeat-x;
	background-position: top;
	/* padding: 13px 8px 13px 8px;*/ 
	padding: 13px 8px 0px 8px; /* CP(N4)3 - 2012/04/10 - Add Static Banner - Style amendment */
}
#shortCutBox{
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	background-color: #FFF;

	margin-top: 7px;
	color: #666;
	font-size: 11px;
	line-height: 29px;
	position:absolute;
	bottom:15px;
}

#shortCutBox a:link,
#shortCutBox a:visited {
	color: #666;
	text-decoration: none;	
}
#shortCutBox a:hover,
#shortCutBox a:focus {
	color: #666;
	text-decoration: underline;
}

/*service*/
#serviceCutBox{
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	background-color: #FFF;

	margin-top: 7px;
	color: #666;
	font-size: 11px;
	line-height: 29px;
	position:absolute;
	bottom:15px;
}

#serviceCutBox a:link,
#serviceCutBox a:visited {
	color: #666;
	text-decoration: none;	
}
#serviceCutBox a:hover,
#serviceCutBox a:focus {
	color: #666;
	text-decoration: underline;
}

#sc1{
	clear:both;
	width:186px;
	background-image: url(../image/sc1-en.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 28px;
}
#sc2{
	clear:both;
	width:186px;
	background-image: url(../image/sc2-en.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 28px;	
}
#sc3{
	clear:both;
	width:186px;
	background-image: url(../image/sc3-en.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 28px;		
}
/* CP(N4)3 - 2012/04/10 - Add Static Banner - Style amendment */
#homeBanner
{
    width:100%;
    float:right; 
}
/* CP(N4)3 - 2012/04/10 - Add Static Banner - Style amendment */
#homeBanner div
{
    float:right;
}

/*ASL revamp*/
.bg_leftToRight{
	background: #F1ECE9;
    background: -webkit-linear-gradient(left, #F1ECE9 , #CCC9C2);
    background: -moz-linear-gradient(right, #F1ECE9, #CCC9C2);
    background: linear-gradient(to right, #F1ECE9 , #CCC9C2);
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-weight: bold;
	border-radius: 5px;
	padding: 10px;
}

.bg_leftToRight span{
	vertical-align: middle;
	display: inline-block;
}

#mainContent
{
	float: left;
	width: 1000px;
	border: 1px solid #B4BFBB;
}


#menuMiddle {
	padding-top:3px;
	padding-bottom:3px;
	background: #FFFFFF;
	position: relative;
}

#menuMiddle table tr td{
	padding: 0;
	vertical-align: top;
}

#whatsNewPane::-webkit-scrollbar {
    width: 1em;
}
 
#whatsNewPane::-webkit-scrollbar-thumb {
  background-color: #C5342D;
  outline: 1px solid slategrey;
  width:2em;
  border-radius: 10px;
}

/*IE scrollbar */
#whatsNewPane {
scrollbar-face-color:#C5342D;
}

/*Service shortcut at homepage*/
.ShortCutItem
{
    width: 255px;
	min-height: 20px;
}

.ShortCutItem a
{	
	text-decoration: none;
	display:block;
	width:100%;
	height:100%;
	/*Raymond on 23Oct2018 - amend to darker color for web accessibility */
	/* color: #6C615D; */	
	color: #3F3836;
	float: left;
}

#ShortCut{
	position:relative;
	background-color: #FFF;
	display: block;

	height: 182px; /* Updated by Bobby Li - 23/8/2018 Changed from 140px to 182px */
	margin-top: 1px;
	background: #F1ECE9;
    background: -webkit-linear-gradient(left, #F1ECE9 , #CCC9C2);
    background: -moz-linear-gradient(right, #F1ECE9, #CCC9C2);
    background: linear-gradient(to right, #F1ECE9 , #CCC9C2);
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	border-radius: 5px;
}

#ShortCutTitle
{
	font-size:13pt;
	position:absolute;
	top:3px;
	left:10px;
	color: #C5342D;
}

/* Added by Bobby Li - 23/8/2018 */
#ShortCutBox
{
	padding-top: 15px;
	padding-bottom: 15px;
}

/*FindUs at homepage*/
#FindUs{
	position: relative;
	background-color: #FFF;
	display: block;
	height: 130px;
	margin-top: 1px;
	/*background-image: url(../images/r_nav6_service_bg_clean.gif);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top;*/
	background: #F1ECE9;
    background: -webkit-linear-gradient(left, #F1ECE9 , #CCC9C2);
    background: -moz-linear-gradient(right, #F1ECE9, #CCC9C2);
    background: linear-gradient(to right, #F1ECE9 , #CCC9C2);
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-weight: bold;
	border-radius: 5px;
}

.homeGalleryTitleBar
{
	height: 28px;
}

.GalleryTitleText
{
	color:#C5342D;	
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-size: 12pt;
	height:100%;
	font-weight:bold;	
	float:left;
	padding: 5px 0 0 0;
	height:90%;
}

.TitleDec
{
	background-image: url(../image/title_decoration.png);
	background-repeat: repeat-x;
	height:30px;
}

.leftnavTitleDec
{
	background-image: url(../image/leftnavtitle_decoration.png);
	background-repeat: repeat-x;
	height:30px;
}

#leftnavTitle{
	font-family: "Microsoft JhengHei", 微軟正黑體, "Arial", sans-serif;
	font-size: 12pt;
	height:100%;
	font-weight:bold;	
	padding: 5px 0 0 0;
	height:90%;
	float:left;
	color:#C5342D;
}

.leftnavItem a
{	
	text-decoration: none;
	display:block;
	height:100%;
	color:black;
}