@charset "utf-8";
/* Tag Style*/
body {margin-top:10px; font-family:Arial, Helvetica, sans-serif, "新細明體";	font-size:12px;}
div {text-align:left;}
img {border-style:none;}
a {color:#000073;}
/*ID for differnt basic area*/
/*Container Component*/
#WebSite {width:975px; margin-left:auto; margin-right:auto;}
#Header {width:975px; margin-bottom:10px;}
#SiteBody {
	width:975px; 
	min-height:400px; 
	height:auto; !important
	height:400px;
}
#Partner {width: 810px; height:120px; margin-bottom:5px; margin-top:5px; float:left;}
#Facebook {width: 810px; height:200px; margin-bottom:5px; margin-top:5px; float:left;}
/*
* html #SiteBody {height: 400px;}
*/
#Footer {width:975px; height:40px;}
.spacer {width:100%; height:1em;}
.seperator {width:100%; height:2em;}

/*Header Component*/
#CompanyBar {width:100%; height:120px; margin-top:5px; margin-bottom:5px;}
	#CompanyLogo {width:510px; float:left;}
	#MemberBox {width:350px; float:right; text-align:right;}
#Navigation {width:100%; height:25px; margin-top:5px; margin-bottom:5px; position:relative}
#LoginBar {width: 100%; height:100px; margin-top:5px; margin-bottom:5px;}
	#LoginBox {width: 150px; height:100px; margin-top:5px; margin-bottom:5px;}
	.AdTop {width: 810px; height:100px; margin-bottom:5px; margin-top:5px; float:left;}

/*Search Box Component*/
#MemberBox table { border: 0px none; padding:0; width:100%; height:80px;}
#MemberBox td.welcome { vertical-align:top;}
#MemberBox .content {float:right; font-weight:bold; font-size:13px; line-height:20px; margin-left:3px; margin-right:3px;}
#MemberBox .fields		 {float:right; margin-left:3px; margin-right:3px;}
#MemberBox td.search {text-align:right; vertical-align:bottom;}
#MemberBox form {padding:0; margin:0}
#MemberBox input {padding:0; margin:0;}

/*SiteBody Component for index page*/
#SideBarIndex {float:left; width:150px;}
#ContentIndex {float:right; width:810px;}
	#Cover {width:100%; margin-bottom:10px;}
		#Story {width:65%; float:left;}
		#Trade {width:33%; float: right;}
	#SepIndustry {width:100%; margin-bottom:10px; height:22px; background-image:url(images/sepIndustry.jpg); float:left;}
	#Industry {width:100%; margin-bottom:10px;}
	#SepPS {width:100%; margin-bottom:10px; height:22px; background-image:url(images/sepPS.jpg); float:inherit;}
	#DIR {width:100%; margin-bottom:10px;}
	#SepTopics {width:100%; margin-top:10px; margin-bottom:10px; height:22px; background-image:url(images/sepTopics.jpg); float:inherit;}
	#PS {width:100%; margin-bottom:10px;}
.LeftCol {float:left; width:400px;}
.RightCol {float:right; width:400px;}

/*SiteBody Component for article page*/
#ContentArticle {float:left; width:810px;}
#SideBarArticle {float:right; width:150px;}

/*Class of Header element*/
#Navigation ul{
	margin: 0;
    padding: 0;
    list-style-type: none;
}
#Navigation li{
	margin-right:35px;
	/*margin-right:35px;*/
	text-align: left;
    /*margin: 0;*/
    padding: 0;
    float: left;
	border-style:none;
	line-height:25px;
	font-weight:bold;
	display: block;
	position:relative;
}
#Navigation a{
	margin-left:10px;
	text-decoration: none;
	color:white;
}
#Navigation a:hover{
	color:yellow;
}
#menuIndustry, #menuPS, #menuTrade, #menuJob, #menuSubscription{
	position:absolute;
	top:23px;
	left:5px;
	visibility:hidden;
	z-index:99;
}
#menuIndustry{width:130px;}
#menuPS{width:130px;}
#menuTrade{width:130px;}
#menuJob{width:130px;}
#menuSubscription{width:130px;}
#menuIndustry ul, #menuPS ul, #menuTrade ul, #menuJob ul, #menuSubscription ul{
    list-style-type: none;
}
#menuIndustry li, #menuPS li, #menuTrade li, #menuJob li, #menuSubscription li{
	width:100%;
	border:solid 1px;
	border-color:white;
	line-height:25px;
	background-color:#B60005;
	display: block;
	text-decoration: none;
	color:white;
	cursor:pointer;
}
#menuIndustry li:hover, #menuPS li:hover, #menuTrade li:hover, #menuJob li:hover, #menuSubscription li:hover {
	background-color:#A60005;
	color:white;
}
#menuIndustry a, #menuPS a, #menuTrade a, #menuJob a, #menuSubscription a {
	margin-left: 5px;
	display:block;
	height:25px;
}
#menuIndustry a:hover, #menuPS a:hover, #menuTrade a:hover, #menuJob a:hover, #menuSubscription a:hover {
	background-color:#A60005;
	color:white;
}

#LoginBox form{
	margin: 8px;
	text-align:center;
	font-weight:bold;
}
#LoginBox input{font-family:Arial, Helvetica, sans-serif, "新細明體";}
#LoginBox a{
	text-decoration:none;
	color:white;
	margin-right:50px;
}
#LoginBox a:hover{
	color:red;
}

/*Class of index page SiteBody.SideBarIndex element*/
.adSide{width: 150px; height:200px; margin-bottom:15px;}

/*Class of index page SiteBody.ContentIndex element*/
.adMainSmall{width:400px; height:100px; margin-bottom:10px;}
.adMainLarge{width:400px; height:210px; margin-bottom:10px;}

/*Class of article page SiteBody.SideBarArticle element*/
.adSideArticle{width: 200px; height:150px; margin-bottom:15px; border:1px solid black;}

.boxContainer{
	width:100%;
	margin-bottom:10px;
}
.boxTitle{
	width:100%;
	height:25px;
	font-weight:bold;
	font-size:15px;
	line-height: 25px;
	text-indent:15px;
	float:left;
}
/*boxHead start*/
.boxHead2, .boxHead3, .boxHead4, .boxHead5, .boxHead6 {
	width:100%;
	height:25px;
	margin: 0;
	padding: 0;
}
.boxHead2 ul, .boxHead3 ul, .boxHead4 ul, .boxHead5 ul, .boxHead6 ul{
	margin: 0;
    padding: 0;
    list-style-type: none;
}
.boxHead2 li, .boxHead3 li, .boxHead4 li, .boxHead5 li, .boxHead6 li{
	text-align: center;
    margin: 0;
    padding: 0;
    float: left;
	border:solid 1px;
	border-color:#999999;
	line-height:25px;
	background-image:url(images/boxHeadDown.gif);
	display: block;
	text-decoration: none;
	cursor:pointer;
}
.boxHead2 li.selected, .boxHead3 li.selected, .boxHead4 li.selected, .boxHead5 li.selected, .boxHead6 li.selected {
	  background-image:url(images/boxHeadUp.gif);
      /*border-style: solid solid none solid;*/
	  border-bottom: none;
}
.boxHead2 li{width:49.5%;}
.boxHead3 li{width:32.8%;}
.boxHead4 li{width:24.5%;}
.boxHead5 li{width:19.5%;}
.boxHead6 li{width:16.1%;}

/*for wider head*/
.big3 li{width:33%;}
.big5 li{width:19.7%;}
.big6 li{width:16.3%;}
/*boxHead end*/

/*for table head*/
.tbl7{
	width:100%;
	margin: 0;
	padding: 0;
	float:left;
}
.tbl7 ul{
	margin: 0;
    padding: 0;
    list-style-type: none;
}
.tbl7 li{
	margin: 0;
    padding: 5px 0px 5px 0px;
    float: left;
	/*line-height:25px;*/
	display: block;
	overflow: hidden;
}
.tbl7 a{ cursor:pointer; }

.tbl7 li.date{ width:10%; text-indent: 8px;}
.tbl7 li.pos{ width:25%; }
.tbl7 li.com{ width:31%; }
.tbl7 li.type{ width:9%; }
.tbl7 li.lv{ width:7%; }
.tbl7 li.exp{ width:5%; }
.tbl7 li.sal{ width:9%; }
.tbl7 li.B{ font-weight:bold; }

.tbl7 li.tDate{ width:10%; text-indent: 8px;}
.tbl7 li.tName{ width:25%; }
.tbl7 li.tSource{ width:15%; }
.tbl7 li.tTrade{ width:5%; }
.tbl7 li.tFood{ width:13%; }
.tbl7 li.tQuantity{ width:15%; }
.tbl7 li.tPrice{ width:15%; }
/*table head end*/

/*boxBody start*/
.boxBody{
	width:99.7%;
	background-color: white;
	border-width:1px;
	border-color:#999999;
	border-style: none solid solid solid;
	min-height:170px;
	height: auto !important;
	/*text-align:left;*/
	height: 170px;
}
.boxBodyBig{
	min-height: 600px;
	height: auto !important;
	height: 600px;
	float: left;
}
/*\*/
/*
* html .boxBody {height: 150px;}
*/
/**/
.boxBody table{
	margin: auto;
	width: 96%;
	height: 150px;
}
.boxBody td.pics{
	width: 150px;
	vertical-align:top;
	text-align:center;
}
.boxBody td.issue{
	width: 110px;
	vertical-align:top;
	text-align:center;
}

.boxBody td.top{vertical-align:top;}
.boxBody td.mid{vertical-align: bottom;}
.boxBody td.base{text-align:right;}
.boxBody a{text-decoration:none;}
.boxBody a:hover{text-decoration:underline;}
.boxBody a.headline{font-size:16px; font-weight:bold;}
.boxBody a.headlineEng{font-size:12px; font-weight:bold;}
.boxBody ul{
	margin-left: 1em;
	margin-top: 0em;
	margin-bottom: 0em;
	padding-left: 0em;
}
.boxBody li{
	margin: 0;
	padding: 0;
}

/*boxBody end*/

/*Footer start*/
#Footer p{text-align:center; line-height: 40px;}
/*Footer end*/
.iconContainer{
	width:100%;
	margin-bottom:10px;
}
.icon{
	padding: 2px;
	border: 0px;
	float: left;
	margin-right: 2px;
	margin-bottom: 5px;
	text-align:left;
}

/*Article page class*/
.articleBox {	
	width:100%;
	margin-bottom:15px;
}
.articleTitle{
	font-weight:bold;
	font-size:15px;
	margin:20px 10px 2px 10px;
}
.articleTitle a{ text-decoration:none; }
.articleTitle a:hover{ text-decoration:underline; }
.articleInfo{
	font-size:11px;
	margin-left:10px;
}
.articleDesc{
	margin-left:10px;
	margin-right:10px;
}
.pageNav{
	width:97%;
	text-align:right;
	margin-bottom:10px;
	margin-top:30px;
	font-weight:bold;
}
.articleList{
	margin:10px 20px 10px 10px;
	z-index:0;
	text-align:right;
}
.articleTitleBig{
	font-weight:bold;
	font-size:24px;
	margin:10px 10px 10px 10px;
}
.articleInfoBig{
	font-weight:bold;
	height:30px;
	margin-left:10px;
}
.articleDescBig{
	font-size:15px;
	margin-left:10px;
	margin-right:10px;
}
.articlePics{
	margin:10px 10px 10px 10px;
}
.thumbnail{
	padding: 7px;
	border: 1px solid #ddd;
	float: left;
	margin-right: 10px;
	margin-bottom: 15px;
	text-align:left;
	width:235px;
}
.caption{ font-size: 0.9em; padding-top: 0.2em ; }

/*Form Page*/
#RegContainer{
	width: 600px;
	margin-left: 80px;
	float:left;
	margin-bottom: 10px;
}
#RegContainer form{
	padding: 0px;
	margin: 0px;
	font-family:Arial, Helvetica, sans-serif, "新細明體";
}
#RegContainer .row { width: 100%; line-height:25px; float:left;}
#RegContainer .label{ width:30%;float:left;}
#RegContainer .field{ width:60%;float:left;}
#RegContainer table{
	border: none 0px;
	padding: 0px;
	margin: 0px;
}
#RegContainer td{
	line-height: 25px;
}
#RegContainer .contract{
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
}

/*Popup Page*/
#Popup{ width:850px; margin-left:auto; margin-right:auto;}
#ContentPopup{ width:550px; float:left; margin-left:5px;}
#SideBarPopup{ width:260px; float:right; margin-right:5px;}

#Popup .boxTitle a{ color:white; }
#Popup .jobPos { float:left; }
#Popup .jobDate { float:right; margin-right:15px; }

/*MemJob Page*/
#Popup .row { width: 100%; line-height:25px; float:left;}
#Popup .label {float:left; width:90px;}
#Popup .field {float:left;}
#Popup .fieldOne {float:left; width:145px;}
#Popup .fieldGroup {float:left; width:440px;}

#Popup input {font-family:Arial, Helvetica, sans-serif, "新細明體"; font-size:12px;}
#Popup textarea {font-family:Arial, Helvetica, sans-serif, "新細明體"; font-size:12px;}

.boxPopup{
	border-width:1px;
	border-color:#999999;
	border-style: none solid solid solid;
	padding: 5px;
	float:left;
}
#ContentPopup .boxPopup{ 
	width:97.9%;
	min-height:150px;
	height: auto !important;
	height: 150px;
}
#SideBarPopup .boxPopup{ 
	width:95.2%;
}
#JobList ul{
	margin: 5px;
    padding: 0;
    list-style-type: none;
}
#JobList li{
	margin: 0;
    padding: 5px;
	/*line-height:25px;*/
	display: block;
	border-color: #D89EA2;
	border-style: solid;
	border-width: 0px 0px 1px 0px;
}
#JobList a{ color:#910000; text-decoration:none; }
/*End of Popup Page*/

/*centreBox*/
.centreBox{
	margin-top: 50px;
	margin-left:auto;
	margin-right:auto;
	width:600px;
}
.centreBox2{
	margin-top: 50px;
	margin-left:auto;
	margin-right:auto;
	width:78%;
}

/*MemCentre Page*/
#MemCentre .row { width: 100%; line-height:25px; float:left;}
#MemCentre .label {float:left; width:150px;}
#MemCentre .field {float:left;}

/*Button*/
.sButton, .button {
	height:20px;
	cursor:pointer;
	margin-left:3px;
	margin-right:3px;
	text-align:center;
	line-height:20px;
	color:white;
	font-weight:bold;
}
.button{width:60px; background-image:url(images/button.gif); font-size:12px;}
.sButton{width:30px; background-image:url(images/sButton.gif); font-size:12px;}
.wButton{width:120px; background-image:url(images/wButton.gif); font-size:12px; color:white; line-height:20px; text-decoration:none; text-align:center; cursor:pointer;}

.issuebutton {
	height:30px;
	width:265px;
	cursor:pointer;
	margin-left:1px;
	margin-right:1px;
	margin-top:5px;
	text-align:center;
	line-height:30px;
	color:white;
	font-weight:bold;
	background-image:url(images/issuebutton.gif); 
	font-size:15px;
}

#MemberBox .button, #MemberBox .sButton  {float:right;}
#MemCentre .wButton {float:left; margin-left:20px;}
#MemCentre .wButton:hover {color:yellow; cursor:pointer;}


/*color definition*/
.bgBlack {background-color:black; color:white;}
.bgBrown {background-color:#221816; color:white;}
.bgLBrown {background-color:#AC6A00; color:white;}
.bgRed {background-color:#B60005; color:white;}
.bgBlue {background-color:#006795; color:white;}
.bgGreen {background-color:#006328; color:white;}
.bgPurple {background-color:#69005E; color:white;}
.bgDarkRed {background-color:#910000; color:white;}
.bgLightRed {background-color:#EED5D6; color:black;}
.bgOrange {background-color:#FF6600; color:white;}

.fontRed {color:red;}
.fontGrey { color:#666666;}

.font16 {font-size:16px;}

img.trans { 
	filter:alpha(opacity=80);
  /* CSS3 standard */
  opacity:0.8;
}