/* =================================================================================================
	The Explorer
	DEFAULT GOVHK THEME

	Define the color, image, background etc.
	Use class name en/tc/sc for different language style
================================================================================================= */



/* =================================================================================================
	WRAPPER
================================================================================================= */
#wrapper{
	background:#eaebeb url(images/grid/wrapper.gif) repeat-x;
}
#main, #pageHeader{
	background-color:#F7F7F7;
}

/* =================================================================================================
	HYPELINKS
================================================================================================= */
/*a:link		{ color:#333; }
a:visited	{ color:#333; }*/


/* =================================================================================================
	GENERIC ELEMENTS
================================================================================================= */
.more a{
	font-weight:bold;
	padding-right:20px;
	background-image:url(images/widget/arrow.gif) !important;
	background-position:right center !important;
	background-repeat:no-repeat !important;
}
.more a:hover, .more a:active, .more a:focus{
	text-decoration:underline;
	color:#000 !important;
	background-image:url(images/widget/arrow.gif) !important;
	background-position:right center !important;
	background-repeat:no-repeat !important;
}
.button a{
	color:#444 !important;
	background:url(images/widget/button.gif) repeat-x;
}
.button span{
	background:url(images/widget/button.gif) right top repeat-x;
}
.button a:hover, .button a:active, .button a:focus{
	background:url(images/widget/button.gif) left bottom repeat-x;
}
.button a:hover span, .button a:active span, .button a:focus span{
	background:url(images/widget/button.gif) right bottom repeat-x;
}
.button2 a{
	color:#FFF !important;
	background:url(images/widget/button2.gif) repeat-x;
}
.button2 span{
	background:url(images/widget/button2.gif) right top repeat-x;
}
.button2 a:hover, .button2 a:active, .button2 a:focus{
	background:url(images/widget/button2.gif) left bottom repeat-x;
}
.button2 a:hover span, .button2 a:active span, .button2 a:focus span{
	background:url(images/widget/button2.gif) right bottom repeat-x;
}


.backToTop a{
	color:#D88422 !important;
	background:url(images/widget/back_to_top.gif) left center no-repeat;
}
p.noscript{
	color:#F00;
	background:#FFA;
}

.about #pageHeader, .about #tabMenu a {
	border-left-color:#D9541B;
}

/* =================================================================================================
	HEADER
================================================================================================= */
#header{
	background:#E5E5D8 url(images/header/bg.gif) repeat-x;
}
#rss a{
	background:url(images/header/rss.gif) left center no-repeat;
}
.fontSizeActive{
	color:#F30 !important;
}


/* =================================================================================================
	GOVHK BAR
================================================================================================= */
#govhkBar{
	color:#666;
}
#userGroups li a{
	color:#c1c1c1;
	background:url(images/header/usergroup.gif) -250px top no-repeat;
}
#userGroups li a:hover, #userGroups li a:active, #userGroups li a:focus{
	background-position:-250px bottom;
}
.residents #usrGrpResidents a,
.business #usrGrpBusiness a,
.nonresidents #usrGrpNonResidents a{
	color:#f8981d;
}
#userGroups ul #usrGrpResidents a{
	background:url(images/header/usergroup.gif) left top no-repeat;
}
#userGroups ul #usrGrpResidents a:hover,
#userGroups ul #usrGrpResidents a:active,
#userGroups ul #usrGrpResidents a:focus{
	background-position:left bottom;
}
#userGroups ul #govhkSearch{
	background:url(images/header/usergroup.gif) -250px top no-repeat;
}
/* 201012: Search for multiLang */
#userGroups ul #govhkSearchMulti{
	background:url(images/header/usergroup.gif) left top no-repeat;
}
#searchBoxContainer{
	background:url(images/header/usergroup.gif) right top no-repeat;
}
#searchBox{
	color:#666;
	background:url(images/header/searchbox.gif) left top no-repeat;
}
#searchIcon{
	background:url(images/header/searchbox.gif) right top no-repeat;
	border:0px solid #FFF;
}


/* =================================================================================================
	INFORMATION
================================================================================================= */
#info, #themeIdentity{
	background:url(images/grid/bar.png) bottom repeat-x;
}
.theme #info{
	background:none;
}
#info, #info a{
	color:#666;
}


/* =================================================================================================
	FOOTER
================================================================================================= */
#footer{
	background:url(images/grid/footer.png) top repeat-x;
}
#auxiliaryMenu{
	color:#666;
}


/* =================================================================================================
	HOMEPAGE
================================================================================================= */
#homepage{
	background:#3f3530 url(images/homepage/bg.gif) right repeat-y;
}


/* =================================================================================================
	HOMEPAGE FEATURE
================================================================================================= */
#arrowSlider{
	background-color:#151005;
}
#theArrow{
	background:url(images/homepage/feature_arrow.gif) no-repeat;
}
#featureTitles{
	background:#000 url(images/homepage/feature.gif) left top repeat-x;
}
.afeaturetitle a {
	color:#fff !important;
	text-decoration:none !important;
	background:transparent url(images/homepage/feature.gif) left top repeat-x;
}
.afeaturetitle a:hover, .afeaturetitle a:active, .afeaturetitle a:focus {
	background-position:left -100px;
}
.afeaturetitle.selected a {
	background-position:left -100px;
}


/* =================================================================================================
	LOOKING FOR (HOMEPAGE)
================================================================================================= */
#lookingFor{
	background:url(images/homepage/looking_for.gif) right repeat-x;
}

#lookingFor div{
	color:#000;
}



/* =================================================================================================
	CLUSTERS (HOMEPAGE)
================================================================================================= */
#clusters {
	background:#3f3530 url(images/homepage/cluster_sep.gif) bottom repeat-x;
}
.clusterLink{
	color:#FFF;
	border-color:#b2aeac;
	background:url(images/homepage/cluster_arrow.gif) 90% center no-repeat;
}
.clusterName span{
	color:#FFF;
}
.clusterTooltip{
	background-color:transparent;
	background-image:url(images/homepage/cluster_tooltip.gif);
}
.clusterTooltip div, .clusterTooltip strong{
	color:#000;
	background:#F8981D;
}

.clusterTooltip div a{
	color:#333 !important;
}


/* =================================================================================================
	FEATURED COLUMNS (HOMEPAGE)
================================================================================================= */
#featuredColumns{
	background:#3f3530;
}
.featuredColumn h2{
	color:#FFF;
	background:transparent url(images/homepage/fc_top.gif) left top no-repeat;
}
#mobileApps ul, #whatsHKTalking ul, #topOnlineServices ul{
	background:#f5f0f0 url(images/homepage/fc_bottom.gif) bottom no-repeat;
}
.featuredColumn li a{
	background:url(images/widget/arrow.gif) 1em .2em no-repeat;
}

/* =================================================================================================
	EXTRA (MULTIMEDIA)
================================================================================================= */
#hkGallery, #mobileApps{
	background-color:#f5f0f0;
}
#hkInPictures, #hkInVideos{
	background:#E1E0D4;
}


/* =================================================================================================
	MOBILE APPS / TOP ONLINE FORMS / TOP ONLINE SERVICES (HOMEPAGE)
================================================================================================= */
#extra, #topOnline{
	background:#3f3530;
}
/* 20120516: remark
#extra .accordion h2,
#topOnline .accordion h2{
	color:#FFF;
	background:url(images/homepage/accordion.gif) left -300px no-repeat;
}
#extra .accordion .ui-state-default h2,
#topOnline .accordion .ui-state-default h2{
	color:#000;
	background-position:left -100px;
}
#extra .accordion div:first-child h2,
#topOnline .accordion div:first-child h2{
	background-position:left -200px;
}
#extra .accordion .first h2,
#topOnline .accordion .first h2{
	background-position:left -200px;
}
#extra .accordion div:first-child .ui-state-default h2,
#topOnline .accordion div:first-child .ui-state-default h2{
	background-position:left top;
}
#extra .accordion .first .ui-state-default h2,
#topOnline .accordion .first .ui-state-default h2{
	background-position:left top;
}
*/
/* 20120516: default: dim and second-more child */
#extra .accordion h2,
#topOnline .accordion h2 {
	color:#000;
	background:url(images/homepage/accordion.gif) left -100px no-repeat;
}
/* dim and first child */
#extra .accordion div:first-child h2,
#topOnline .accordion div:first-child h2,
#extra .accordion .first h2,
#topOnline .accordion .first h2{
	background-position:left top;
}
/* highlight and second-more child */
#extra .accordion .ui-state-active h2,
#topOnline .accordion .ui-state-active h2{
	color:#FFF;
	background-position:left -300px;
}
/* highlight and first child */
#extra .accordion div:first-child .ui-state-active h2,
#topOnline .accordion div:first-child .ui-state-active h2,
#extra .accordion .first .ui-state-active h2,
#topOnline .accordion .first .ui-state-active h2{
	background-position:left -200px;
}


#extra ul, #topOnline ul{
	background-color:#f5f0f0;
}
#extra li, #topOnline li{
	background:#E1E0D4;
}
#extra li.alt, #topOnline li.alt{
	background:#f5f0f0;
}
#extra li a, #topOnline li a{
	color:#333;
}
#extra li a:hover, #extra li a:active, #extra li a:focus,
#topOnline li a:hover, #topOnline li a:active, #topOnline li a:focus{
	background-color:#EBD7A5;
	color:#333;
}
#extra li.more a:hover, #extra li.more a:active, #extra li.more a:focus,
#topOnline li.more a:hover, #topOnline li.more a:active, #topOnline li.more a:focus{
	background-color:transparent;
}


/* =================================================================================================
	I WANT TO (SIDEBAR)
================================================================================================= */
.en #sidebar #iWantTo{background:url(images/en/hp_iwt.gif) no-repeat;}
.tc #sidebar #iWantTo{background:url(images/tc/hp_iwt.gif) no-repeat;}
.sc #sidebar #iWantTo{background:url(images/sc/hp_iwt.gif) no-repeat;}

#sidebar #iWantTo li{
	border-color:#aaa;
}
#sidebar #iWantTo li a{
	background:url(images/widget/arrow.gif) no-repeat 98% 50%;
	color:#42413f;
}
#sidebar #iWantTo li a:hover, #sidebar #iWantTo li a:active, #sidebar #iWantTo li a:focus{
	background-color:#D3D2CB;
}

/* =================================================================================================
	WEATHER SECTION (HOMEPAGE)
================================================================================================= */
#weather{background:#e9e9e1;}
#weatherTemp{color:#333333;}
#weatherForecast a{color:#333333 !important;}
#weatherForecast a{background:url(images/widget/arrow.gif) right no-repeat !important;}

/* 20120830: for weather links */
#weatherError a {
	border-color:#fbf8f7;	
}

/* =================================================================================================
	SINGLE MENU (HOMEPAGE)
================================================================================================= */
.singleMenu .singleMenuTitle {background:url(images/widget/singlemenu.gif) left top no-repeat;}
.singleMenu .close {background:url(images/widget/singlemenu.gif) left -50px no-repeat !important;}

/* 20120808: multilines: use new image and new y pos */
.singleMenu .singleMenuTitle.multilines { background:url(images/widget/singlemenu_multi.gif) left top no-repeat; }
.singleMenu .close.multilines  {	background:url(images/widget/singlemenu_multi.gif) left -100px no-repeat !important; }


.singleMenu h2{color:#FFF;}
/* 20120724: add "singleMenuBg" for whatsNew area */
.singleMenuList li, .singleMenuBg {
	background:#E9E9E1;
	border-color:#fbf8f7;
}
/* 20120824: singleMenu "a.thumbnail" is for rotatingBanner with thumbnail only */
.singleMenuList li a,
.singleMenu a.thumbnail {
	background-color:#E9E9E1;
	background-image:url(images/widget/singlemenu_bg.gif);
	background-position:left top;
	background-repeat:repeat-y;
}
.singleMenuList li a:hover, .singleMenuList li a:active, .singleMenuList li a:focus,
.singleMenu a.thumbnail:hover, .singleMenu a.thumbnail:active, .singleMenu a.thumbnail:focus {
	color:#FFF;
	background-position:-240px top;
}
.singleMenu a.thumbnail {
	text-decoration:none;
}

.singleMenuList li .more a:hover, .singleMenuList li .more a:active, .singleMenuList li .more a:focus{
	color:#000;
}


/* =================================================================================================
	SINGLE LINK (HOMEPAGE)
================================================================================================= */
.singleLink 	{background:url(images/widget/singlemenu.gif) left -100px no-repeat;}

/* 20120808: multilines: use new image and new y pos */
/* note: singleLink and multilines in same div */
.singleLink.multilines {  background:url(images/widget/singlemenu_multi.gif) left -200px no-repeat; }

.singleLink a	{color:#FFF !important;}


/* =================================================================================================
	ROTATING VEHICLE (SIDEBAR & HK GALLERY)
================================================================================================= */
#sidebar .vcl, #sidebar .vcc, #sidebar .vcr{background-image:url(images/banner/control.gif);}
#sidebar .vind{background-image:url(images/banner/ctl_ind.gif)}
#hkGallery .vcl, #hkGallery .vcc, #hkGallery .vcr{background-image:url(images/homepage/control.gif);}
#hkGallery .vind{background-image:url(images/homepage/ctl_ind.gif)}
.vcl{background-position:left top}
.vcc{background-position:-20px top}
.vcr{background-position:right top}
.vcc .active{background-position:left -28px;}


/* =================================================================================================
	ACCORDION MENU (SIDEBAR)
================================================================================================= */
/* 20120516: remark
#sidebar .accordion h2{
	color:#FFF;
	background:url(images/widget/accordion.gif) left -300px no-repeat;
	border-bottom:1px solid #FFF;
}
#sidebar .accordion .ui-state-default h2{
	color:#000;
	background-position:left -100px;
}
#sidebar .accordion > div:first-child h2{
	background-position:left -200px;
}
#sidebar .accordion .first h2{
	background-position:left -200px;
}
#sidebar .accordion > div:first-child .ui-state-default h2{
	background-position:left top;
}
#sidebar .accordion .first .ui-state-default h2{
	background-position:left top;
}
*/
/* 20120516: default: dim and second-more child */
#sidebar .accordion h2 {
	color:#000;
	background:url(images/widget/accordion.gif) left -100px no-repeat;
	border-bottom:1px solid #FFF;
}
/* dim and first child */
#sidebar .accordion > div:first-child h2, 
#sidebar .accordion .first h2{
	background-position:left top;
}
/* highlight and second-more child */
#sidebar .accordion .ui-state-active h2 {
	color:#FFF;
	background-position:left -300px;
}
/* highlight and first child */
#sidebar .accordion > div:first-child .ui-state-active h2,
#sidebar .accordion .first .ui-state-active h2 {
	background-position:left -200px;
}


#sidebar .accordion ul{
	background:#FFF;
}
#sidebar .accordion li{
	background:#FFF;
}
#sidebar .accordion li.alt{
	background:#E1E0D4;
}
#sidebar .accordion li a{
	background-image:url(images/widget/arrow.gif);
	color:#333;
}
#sidebar .accordion li a:hover, #sidebar .accordion li a:active, #sidebar .accordion li a:focus{
	background-color:#EBD7A5;
	color:#333;
}
#sidebar .accordion li.more a:hover, #sidebar .accordion li.more a:active, #sidebar .accordion li.more a:focus{
	background-color:transparent;
}



/* =================================================================================================
	KEYPAGES (SMART MENU / ARTICLE)
================================================================================================= */
.sidebar{
	background:#F7F7F7 url(images/grid/page.gif) right repeat-y;
}


/* =================================================================================================
	BREADCRUMB
================================================================================================= */
#breadCrumb {
	background:#F7F7F7 url(images/grid/breadcrumb.gif) repeat-x;
}

/* =================================================================================================
	I WANT TO (SMARTMENU PAGE)
================================================================================================= */
.en #smartMenuPage #iWantTo h2{ background:url(images/en/sm_iwt.gif) no-repeat;}
.tc #smartMenuPage #iWantTo h2{ background:url(images/tc/sm_iwt.gif) no-repeat;}
.sc #smartMenuPage #iWantTo h2{ background:url(images/sc/sm_iwt.gif) no-repeat;}
#smartMenuPage #iWantTo{
	color:#FFF;
	background:#C06C21 url(images/smartmenu/iwt_bg.gif) repeat-x;
}
#smartMenuPage #iWantTo li a{
	color:#FFF;
	background:url(images/widget/arrow_header.gif) left .2em no-repeat;
}


/* =================================================================================================
	SMART MENU
================================================================================================= */
#smartMenu, #smartMenu ul, #smartMenu li a{
	background-image:url(images/smartmenu/smartmenu.gif);
	background-repeat:no-repeat;
}
#smartMenu ul{
	background-position:right bottom;
}
#smartMenu li a{
	background-position:right -50px;
	color:#888;
}
#smartMenu li a:hover, #smartMenu li a:active, #smartMenu li a:focus{
	background-position:right -200px;
	color:#000;
}
/*active state*/
.sec1 #smartMenu li.sec1 a, .sec2 #smartMenu li.sec2 a,
.sec3 #smartMenu li.sec3 a, .sec4 #smartMenu li.sec4 a,
.sec5 #smartMenu li.sec5 a, .sec6 #smartMenu li.sec6 a,
.sec7 #smartMenu li.sec7 a, .sec8 #smartMenu li.sec8 a,
.sec9 #smartMenu li.sec9 a, .sec10 #smartMenu li.sec10 a,
.sec11 #smartMenu li.sec11 a, .sec12 #smartMenu li.sec12 a,
#smartMenu li.active a
{
	background-position:right -350px;
	color:#000;
}
.sec1 #smartMenu li.sec1 a:hover, .sec2 #smartMenu li.sec2 a:hover,
.sec3 #smartMenu li.sec3 a:hover, .sec4 #smartMenu li.sec4 a:hover,
.sec5 #smartMenu li.sec5 a:hover, .sec6 #smartMenu li.sec6 a:hover,
.sec7 #smartMenu li.sec7 a:hover, .sec8 #smartMenu li.sec8 a:hover,
.sec9 #smartMenu li.sec9 a:hover, .sec10 #smartMenu li.sec10 a:hover,
.sec11 #smartMenu li.sec11 a:hover, .sec12 #smartMenu li.sec12 a:hover,
.sec1 #smartMenu li.sec1 a:active, .sec2 #smartMenu li.sec2 a:active,
.sec3 #smartMenu li.sec3 a:active, .sec4 #smartMenu li.sec4 a:active,
.sec5 #smartMenu li.sec5 a:active, .sec6 #smartMenu li.sec6 a:active,
.sec7 #smartMenu li.sec7 a:active, .sec8 #smartMenu li.sec8 a:active,
.sec9 #smartMenu li.sec9 a:active, .sec10 #smartMenu li.sec10 a:active,
.sec11 #smartMenu li.sec11 a:active, .sec12 #smartMenu li.sec12 a:active,
.sec1 #smartMenu li.sec1 a:focus, .sec2 #smartMenu li.sec2 a:focus,
.sec3 #smartMenu li.sec3 a:focus, .sec4 #smartMenu li.sec4 a:focus,
.sec5 #smartMenu li.sec5 a:focus, .sec6 #smartMenu li.sec6 a:focus,
.sec7 #smartMenu li.sec7 a:focus, .sec8 #smartMenu li.sec8 a:focus,
.sec9 #smartMenu li.sec9 a:focus, .sec10 #smartMenu li.sec10 a:focus,
.sec11 #smartMenu li.sec11 a:focus, .sec12 #smartMenu li.sec12 a:focus
{
	background-position:right -500px;
}
#smartContent a, #smartContent h3{
	color:#000;
}
#smartContent ul{
	color:#666;
	background-color:#F7F7F7;
}
#smartContent ul a, #smartContent ul h3{
	color:#000;
	background-color:#F7F7F7;
}
#smartContent ul ul, #smartContent ul ul a, #smartContent ul ul h3{
	color:#555;
	background-color:#EEE;
}
#smartContent ul ul ul, #smartContent ul ul ul a, #smartContent ul ul ul h3{
	background-color:#DDD;
}
#smartContent ul ul ul ul, #smartContent ul ul ul ul a, #smartContent ul ul ul ul h3{
	background-color:#CDCDCD;
}
#legends{
	color:#666;
}


/* =================================================================================================
	TOP FAQ (FAQ PAGE)
================================================================================================= */
.en #faqPage #topFAQ h2{ background:url(images/en/top_faq.gif) no-repeat;}
.tc #faqPage #topFAQ h2{ background:url(images/tc/top_faq.gif) no-repeat;}
.sc #faqPage #topFAQ h2{ background:url(images/sc/top_faq.gif) no-repeat;}
#faqPage #topFAQ{
	color:#FFF;
	background:#CF8024 url(images/faq/bg.gif) repeat-x;
}
#faqPage #topFAQ li a{
	color:#FFF;
}
.faqAnswer{
	background:#E1E0D4;
}


/* =================================================================================================
	VERTICAL TAB MENU
================================================================================================= */
#tabMenu, #tabMenu ul, #tabMenu a, #tabMenu li a{
	background-image:url(images/smartmenu/smartmenu.gif);
}
#tabMenu ul{
	background-position:right bottom;
}
#tabMenu li a, #tabMenu li{
	background-position:right -50px;
	color:#888;
}
#tabMenu li a:hover, #tabMenu li a:active, #tabMenu li a:focus{
	background-position:right -200px;
	color:#000;
}

/*active state*/
#tabMenu li.active a,
.sub1 .individual #tabMenu li.sub1 a,
.sub2 .individual #tabMenu li.sub2 a,
.sub3 .individual #tabMenu li.sub3 a,
.sub4 .individual #tabMenu li.sub4 a,
.sub5 .individual #tabMenu li.sub5 a,
.sub6 .individual #tabMenu li.sub6 a,
.sub7 .individual #tabMenu li.sub7 a,
.sub8 .individual #tabMenu li.sub8 a,
.sub9 .individual #tabMenu li.sub9 a,
.sub10 .individual #tabMenu li.sub10 a
{
	background-position:right -350px;
	color:#000;
}
.sub1 .individual #tabMenu li.sub1 a:hover,
.sub2 .individual #tabMenu li.sub2 a:hover,
.sub3 .individual #tabMenu li.sub3 a:hover,
.sub4 .individual #tabMenu li.sub4 a:hover,
.sub5 .individual #tabMenu li.sub5 a:hover,
.sub6 .individual #tabMenu li.sub6 a:hover,
.sub7 .individual #tabMenu li.sub7 a:hover,
.sub8 .individual #tabMenu li.sub8 a:hover,
.sub9 .individual #tabMenu li.sub9 a:hover,
.sub10 .individual #tabMenu li.sub10 a:hover,
.sub1 .individual #tabMenu li.sub1 a:active,
.sub2 .individual #tabMenu li.sub2 a:active,
.sub3 .individual #tabMenu li.sub3 a:active,
.sub4 .individual #tabMenu li.sub4 a:active,
.sub5 .individual #tabMenu li.sub5 a:active,
.sub6 .individual #tabMenu li.sub6 a:active,
.sub7 .individual #tabMenu li.sub7 a:active,
.sub8 .individual #tabMenu li.sub8 a:active,
.sub9 .individual #tabMenu li.sub9 a:active,
.sub10 .individual #tabMenu li.sub10 a:active,
.sub1 .individual #tabMenu li.sub1 a:focus,
.sub2 .individual #tabMenu li.sub2 a:focus,
.sub3 .individual #tabMenu li.sub3 a:focus,
.sub4 .individual #tabMenu li.sub4 a:focus,
.sub5 .individual #tabMenu li.sub5 a:focus,
.sub6 .individual #tabMenu li.sub6 a:focus,
.sub7 .individual #tabMenu li.sub7 a:focus,
.sub8 .individual #tabMenu li.sub8 a:focus,
.sub9 .individual #tabMenu li.sub9 a:focus,
.sub10 .individual #tabMenu li.sub10 a:focus
{
	background-position:right -500px;
}



/* =================================================================================================
	GOVERNMENT AGENCIES
================================================================================================= */
#govAgencyHeader{
	color:#F2DAC0;
	background:#B45B24 url(images/onlineservices/bg.gif) repeat-x;
}
.govAgencyHeaderItem{
	background:url(images/widget/arrow_header.gif) left .1em no-repeat;
}
.govAgencyHeaderItem a{
	color:#FFF !important;
}
.govAgencyAlphabetical ul ul{
	background:#E2E0D4;
	border-color:#CCCDC8;
}
#article .govAgencyAlphabetical li a{
	color:#000;
	border-color:#CCCDC8;
}
#article .govAgencyAlphabetical li a:hover,
#article .govAgencyAlphabetical li a:active,
#article .govAgencyAlphabetical li a:focus{
	background-color:#EBD7A5;
	color:#000;
}
#article .govAgencyAlphabetical li li{
	border-color:#FFF;
}
#article .govAgencyAlphabetical li li a:hover,
#article .govAgencyAlphabetical li li a:active,
#article .govAgencyAlphabetical li li a:focus{
	background-color:transparent;
	color:#000;
}
#govAgencyAlphabeticalList a{
	background-color:#F2DAC0;
	color:#D9541B !important;
}
#govAgencyAlphabeticalList a:hover,
#govAgencyAlphabeticalList a:active,
#govAgencyAlphabeticalList a:focus{
	background-color:#FFF;
}
#article .govAgencyOrganisational li li{
	border-color:#FFF;
}
#article .govAgencyOrganisational a{
	color:#000;
}

#article .govAgencyOrganisational a:visited{
	color:#000;
}


/* =================================================================================================
	SITE MAP
================================================================================================= */
#sitemap .usergroups h3 a{
	color:#FFF;
	background:url(images/sitemap/header.gif);
	border-color:#CCCDC8;
}
#sitemap .usergroups h3 a:hover, #sitemap .usergroups h3 a:active, #sitemap .usergroups h3 a:focus{
	color:#FFF;
	background-position:left 50px;
}
#sitemap .clusterHeader:hover, #sitemap .clusterHeader:active, #sitemap .clusterHeader:focus,
#sitemap .clusters li h4 a:hover, #sitemap .clusters li h4 a:active, #sitemap .clusters li h4 a:focus{
	background-color:#EBD7A5;
	color:#333 !important;
}
#sitemap .clusters{
	background:#ECECE4;
}
#sitemap .clusters li{
	border-color:#CCCDC8;
}
#sitemap .clusters li h4.collapsible{
	background:url(images/widget/collapsible.gif) right top no-repeat;
}
#sitemap .clusters li h4.close{
	background-position:right -400px;
}
#sitemap .subcategories{
	background:#E2E0D4;
	border-color:#CCCDC8;
}
#sitemap .subcategories li{
	border-color:#FFF;
}
#sitemap .subcategories a{
	color:#000;
}

/* =================================================================================================
	RSS
================================================================================================= */
.rssList tr, .rssList td{
	border-color:#FFF;
}
.rssList .rss{
	background:url(images/rss/subscribe.gif) no-repeat;
}
.rssList .rss:hover, .rssList .rss:active, .rssList .rss:focus{
	background-position:right;
}


/* =================================================================================================
	ONLINE SERVICES / E-FORMS
================================================================================================= */
.en #findOnlineServices h2{ background:url(images/en/find_os.gif) no-repeat;}
.tc #findOnlineServices h2{ background:url(images/tc/find_os.gif) no-repeat;}
.sc #findOnlineServices h2{ background:url(images/sc/find_os.gif) no-repeat;}
.en #findEForms h2{ background:url(images/en/find_eforms.gif) no-repeat;}
.tc #findEForms h2{ background:url(images/tc/find_eforms.gif) no-repeat;}
.sc #findEForms h2{ background:url(images/sc/find_eforms.gif) no-repeat;}



#findOnlineServices, #findEForms {
	color:#F2DAC0;
	background:#B45B24 url(images/onlineservices/bg.gif) repeat-x;
}
#findOnlineServices a, #findEForms a {
	color:#FFF;
}
.findOnlineServeicesHeader, .findEFormsHeader  {
	background:url(images/widget/arrow_header.gif) left .2em no-repeat;
}
.onlineFullList li{
	border-color:#FFF;
}
.onlineFullList a{
	color:#000 !important;
}
.onlineFullList .eformsNotes a{
	color:#900 !important;
}
.onlineFullList a:visited, .onlineFullList .eformsNotes a:visited{
	color:#372864 !important;
}
.onlineFullList li .eformsFormats{
	background-image:url(images/widget/arrow.gif)
}
#eFormsTags .tagCloudLabel{
	background-image:url(images/widget/arrow_header.gif);
}
#eFormsTags .tag-ex-large a{color:#FFD200}
#eFormsTags .tag-large a{color:#FFE887}
#eFormsTags .tag a{color:#FFFFDD}


/* =================================================================================================
	PERSONALISATION
================================================================================================= */
#styles{
	background:#F0F0E6;
}
#styleList{
	background:url(images/style/list_btm.gif) left bottom no-repeat;
}
#styleList a{
	background:url(images/style/list.gif) no-repeat;
}
#styleList a{
	background-position:left top;
}
#styleList a:hover, #styleList a:active, #styleList a:focus{
	color:#D9541B;
	background-position:left -250px;
}
#styleList .active a, #styleList .active a:hover, #styleList .active a:active, #styleList .active a:focus{
	color:#D9541B;
	background-position:left -500px;
}
#styleList .active span{
	background:url(images/style/arrow.gif) right center no-repeat;
}
.spcl, .spcr, .spind{
	background:url(images/style/control.gif) no-repeat;
}
.spcl{
	background-position:left top;
}
.spcr{
	background-position:right top;
}
.spind{
	background-position:-52px top;
}
.spcc .active{
	background-position:-34px top;
}


/* =================================================================================================
	TABS
================================================================================================= */
#tabs, #tabs li a, #tabs li span{
	background-color:#F7F7F7;
	background-image:url(images/widget/tabs.gif);
	background-repeat:no-repeat;
}
#tabs{
	background-position:left top;
	background-repeat:repeat-x;
}
#tabs li a{
	background-position:left -150px;
	color:#333;
}
#tabs li span{
	background-position:right -150px;
}
#tabs li.active a{
	background-position:left -50px;
	color:#333;
}
#tabs li.active span{
	background-position:right -50px;
}
#tabs li a:hover, #tabs li a:active, #tabs li a:focus{
	background-position:left -200px;
}
#tabs li a:hover span, #tabs li a:active span, #tabs li a:focus span{
	background-position:right -200px;
}
#tabs li.active a:hover, #tabs li.active a:active, #tabs li.active a:focus{
	background-position:left -100px;
}
#tabs li.active a:hover span, #tabs li.active a:active span, #tabs li.active a:focus span{
	background-position:right -100px;
}



/* =================================================================================================
	AJAX SEARCH
================================================================================================= */
#ajaxQuery{
	color:#666;
	background:url(images/widget/ajaxsearch.gif) no-repeat;
}
#ajaxSubmit{
	background:transparent url(images/widget/ajaxsearch.gif) right no-repeat;
	border:0px solid #FFF;
}
#ajaxResultContainer{
	background-color:#ECECEC;
	border-color:#CCC;
}
#ajaxResultContainer h3{
	border-color:#CCC;
}
#ajaxResultContainer a{
	color:#900 !important;
}
#ajaxResultContainer .highlight{
	color:#F00;
}




/* =================================================================================================
	COLLAPSIBLE MENU (RSS / THEMATIC)
================================================================================================= */
.collapsibleHeader{
	color:#000;
}
.collapsibleHeader:hover, .collapsibleHeader:active, .collapsibleHeader:focus,
.noncollapsibleTitle a:hover, .noncollapsibleTitle a:active, .noncollapsibleTitle a:focus{
	background-color:#EBD7A5;
	color:#333 !important;
}
.collapsibleTitle h3, .noncollapsibleTitle h3 a,
.collapsibleTitle h4, .noncollapsibleTitle h4 a{
	border-color:#CCCDC8;
}
.collapsibleTitle{
	background:transparent url(images/widget/collapsible.gif) right top no-repeat;
}
.collapsibleTitle.close{
	background-position:right -400px;
}
.collapsibleContent{
	border-color:#CCCDC8;
	background:#ECECE4;
}
.collapsibleContent .collapsibleContent{
	background:#E2E0D4;
}


/* =================================================================================================
	GADGETS (THEMATIC SITE SIDEBAR)
================================================================================================= */
.gadgetContainer{
	background:url(images/widget/box.gif) left top no-repeat;
}
.gadget{
	background:url(images/widget/box.gif) left bottom no-repeat;
}
.accordion .gadgetContainer, .accordion .gadget{
	background:#FFF;
}


/* =================================================================================================
	NAVIGATION MENU
================================================================================================= */
#navigation{
	background:#3f3530;
}
/*active item*/
.communication 	#navigation li.communication	a,
.culture		#navigation li.culture			a,
.education		#navigation li.education		a,
.employment		#navigation li.employment		a,
.environment	#navigation li.environment		a,
.government		#navigation li.government		a,
.health			#navigation li.health			a,
.housing		#navigation li.housing			a,
.immigration	#navigation li.immigration		a,
.taxes			#navigation li.taxes			a,
.transport		#navigation li.transport		a,
.businessgov 		#navigation	li.businessgov	a,
.businessmainland	#navigation	li.businessmainland a,
.corporate			#navigation	li.corporate	a,
.ecommerce			#navigation	li.ecommerce	a,
.global				#navigation	li.global		a,
.humanresources		#navigation	li.humanresources a,
.market				#navigation	li.market		a,
.registration		#navigation	li.registration 	,
.supportenterprises	#navigation	li.supportenterprises a,
.investinghk	#navigation	li.investinghk		a,
.living			#navigation	li.living			a,
.studyinghk		#navigation	li.studyinghk		a,
.visarequire	#navigation	li.visarequire		a,
.visitinghk		#navigation	li.visitinghk		a,
.workinghk		#navigation	li.workinghk		a
{
	background:#e98713;
	color:#FFF;
}

#navigation li a {
	color:#fff;
	border-color:#5f524a;
}
#navigation li a:hover, #navigation li a:active, #navigation li a:focus {
	background:#534741 !important;
	color:#FFF !important;
}


/* =================================================================================================
	SUB NAVIGATION MENU
================================================================================================= */
#subNavigation{
	background:#FEFEFE;
}
#subNavigation li, #subNavigation li a{
	color:#000 !important;
	background:#FEFEFE !important;
}
#subNavigation li a:hover, #subNavigation li a:active, #subNavigation li a:focus {
	background:#FEFEFE !important;
	color:#000 !important;
}
/*generic active color*/
.sec1 #subNavigation .sec1 a, .sec2 #subNavigation .sec2 a,
.sec3 #subNavigation .sec3 a, .sec4 #subNavigation .sec4 a,
.sec5 #subNavigation .sec5 a, .sec6 #subNavigation .sec6 a,
.sec7 #subNavigation .sec7 a, .sec8 #subNavigation .sec8 a,
.sec9 #subNavigation .sec9 a, .sec10 #subNavigation .sec10 a,
.sec11 #subNavigation .sec11 a, .sec12 #subNavigation .sec12 a
{color:#884700 !important;}



/* =================================================================================================
	ARTICLE MENU
================================================================================================= */
.en #articleMenu #iWantTo h2{background:#E67E17 url(images/en/article_iwt.gif) no-repeat;}
.tc #articleMenu #iWantTo h2{background:#E67E17 url(images/tc/article_iwt.gif) no-repeat;}
.sc #articleMenu #iWantTo h2{background:#E67E17 url(images/sc/article_iwt.gif) no-repeat;}

#articleMenu #iWantTo li{
	/* 20110228: hide bg arrow
	background:url(images/widget/arrow.gif) 99% center no-repeat;
	*/
}
#otherArticle h2{
	color:#FFF;
	background:#144284 url(images/article/readother.gif) right top no-repeat;
}
#otherArticle h2.close{
	background-position:right -50px;
}
#otherArticle li a{
	background:#333;
	color:#FFF;
}
#feedbackContainer strong, #shareContainer strong{
	background:#F2F2F2;
}
#feedbackContainer a, #shareContainer a{
	color:#900;
}


/* =================================================================================================
	CONTENT SECTIONS
================================================================================================= */
.content{
	color:#333;
	background-color:#F7F7F7;
	text-decoration:none;
}
.content a.anchor{
	color:#333 !important;
	text-decoration:none !important;
}
.content a:link, .contentLink a:link{
	color:#900;
	text-decoration:underline;
}
.content a:hover, .content a:active, .content a:focus,
.contentLink a:hover, .contentLink a:active, .contentLink a:focus{
	color:#000000 !important;
}
.content a:visited, .contentLink a:visited{
	color:#939;
	text-decoration:underline;
}
.content h3{
	border-color:#CCCDC8;
	background-color:#F7F7F7;
}
.content h3 a, .content h4 a{
	color:#000 !important;
}
.content h3 a:hover, .content h3 a:active, .content h3 a:focus{
	color:#000;
}
.content table{border:1px solid #cccdc8;}
.content th, .content td{
	border-bottom-width: 0;
	border:1px solid #cccdc8;
}
/* add th for 2 below */
.content .odd, .content .odd td, .content .odd th {
	background-color:#E1E0D4 !important;
}
.content .even, .content .even td , .content .even th {
	background-color:#fff !important;
}

.collapsibleContent .content, .collapsibleContent .content h3{
	background:#ECECE4;
}
.collapsibleContent .content .odd, .collapsibleContent .content .even{
	background-color:transparent;
}
.collapsibleContent .content table,
.collapsibleContent .content th,
.collapsibleContent .content td{
	border-color:#FFF;
}