@import url("../css/normalize.css");
@import url(http://fonts.googleapis.com/css?family=Oswald:400,700);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700);
/* HTML5 Boilerplate */
html{height:100%;}
html, button, input, select, textarea {color:#333;}
body{font-size:13px; color:#555; line-height:1.5; font-family:'Open Sans', Arial, Helvetica, serif; font-weight:400;
	height:auto!important;min-height:100%;height:100%;}

::-moz-selection {background:#b3e0fc; text-shadow:none;}
::selection {background:#b3e0fc; text-shadow:none;}

hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}

/* 移除圖片底下間隙 */
img{vertical-align: middle;}

/* 移除fieldset預設樣式 */
fieldset{border:0; margin:0; padding:0;}

/* 只允許文字區域垂直調整大小 */
textarea{resize:vertical;}
a,a:hover, a:active, a:focus{outline:0; color:#3c68cf;}
a{color:#0499ef; text-decoration:none;}
/* --- ! --- */


/* --- Alert Information --- */
.alert{border:1px solid #b4d7ed; background:#def2ff; 
	font-size:13px; color:#333;
	text-align:center; padding:20px 20px; }
.alert h4{margin:0; font-size:16px;}
.alert a{color:#1044b4;}
.alert.alert-warning{background:#fcf8e3; border-color:#f0ddb6; color:#111;}
/* --- ! --- */


/* --- GLOBAL --- */
body{-webkit-font-smoothing:antialiased;}
.wrapper{width:980px; margin:0 auto; }

/* 設置提示文字顏色 */
::-webkit-input-placeholder{color:#aaa;}
:-moz-placeholder{color:#aaa;}
.placeholder{color:#ccc;}
/* --- ! --- */


/* --- HEADER --- */
#header-container{ background:#fff; height:153px; position:relative;}
#header-container header{ position:relative; height:113px;}
#header-container header h1{margin:0; background:url(../images/twiap-title.png) no-repeat; width:508px; height:85px;
	position:absolute; top:15px; left:15px; text-indent:-9999em;}
#header-container header h2{display:none;}

#top-links{ position:absolute; top:17px; right:15px; z-index:10; text-align:right; font-size:12px; line-height:18px;}
#top-links a{text-decoration:none; color:#666; display:inline-block;*display:inline;zoom:1;}
#top-links a:hover{color:#3c68cf;}
#top-links em{padding:0 7px; font-size:12px; color:#ccc;}
#top-links .name{color:#111;}
#top-links .btn-logout{padding:5px 5px 3px; margin-top:-4px; margin-left:5px; font-size:12px; line-height:14px;}
#top-links .btn-logout:hover{color:#fff;}
#top-links .fb{background:url(../images/icon-fb.png) 0 0 no-repeat; padding-left:20px;}
/* --- ! --- */


/* --- NAV TOP --- */
#menu{margin:0 auto; padding:0; list-style:none; width:965px; height:38px; position:relative; z-index:9999;}
#menu *{box-sizing:border-box;}
#menu li{float:left; position:relative;}
#menu li a{display:inline-block; color:#333; text-decoration:none;}
#menu li a:hover, #menu li a:active{text-decoration:none; }
	/* Sub Menu */
	#menu li ul {position:absolute; top:38px; left:0; z-index:101; display:none;
		background:#f7f7f7; opacity:0; 
		padding:0; margin:0; 
		width:100%;
		border:1px solid #ddd; border-bottom:none; border-top:none;
		box-shadow:0 2px 5px rgba(0,0,0,.2);}	
	#menu li ul li {position:relative; border-bottom:1px solid #d3d3d3; border-top:none; margin:0; font-size:12px; width:100%;}
	#menu li ul li a{display:block; padding:8px; line-height:18px; color:#333; font-weight:bold;}
	#menu li ul li a:hover {background-color:#36559c; color:#fff;}
	#menu li ul ul {left:150px; top:0px}
	#menu .menulink{text-indent:-9999em; background-image:url(../images/navigation.png); height:38px; width:107px;}

#menu .about    {background-position:0 0;}
#menu .news     {background-position:-107px 0;}
#menu .events   {background-position:-214px 0;}
#menu .member   {background-position:-321px 0;}
#menu .quality  {background-position:-428px 0;}
#menu .committee{background-position:-535px 0;}
#menu .data     {background-position:-642px 0;}
#menu .resource {background-position:-749px 0;}
#menu .links    {background-position:-856px 0;}

#menu .about:hover    {background-position:0 bottom;}
#menu .news:hover     {background-position:-107px bottom;}
#menu .events:hover   {background-position:-214px bottom;}
#menu .member:hover   {background-position:-321px bottom;}
#menu .quality:hover  {background-position:-428px bottom;}
#menu .committee:hover{background-position:-535px bottom;}
#menu .data:hover     {background-position:-642px bottom;}
#menu .resource:hover {background-position:-749px bottom;}
#menu .links:hover    {background-position:-856px bottom;}
/* --- ! --- */


/* --- CONTAINER --- */
.decoration{background:url(../images/background-home.jpg) center 0 no-repeat; height:40px;}


#content-container{height:auto!important;min-height:300px;height:300px; padding-bottom:40px;}
#content-container .content{padding:25px 22px;}
#content-container .content .innerRight{float:right; width:750px;}
.content article{word-wrap:break-word; word-break:normal;}
/* --- ! --- */


/* Left Sub Menu */
.subMenu{float:left; width:145px;}
.subMenu .subTitle{margin:0; font-size:15px; color:#030303; height:29px; margin-bottom:12px;}
.subMenu ul{list-style:none; padding:0; margin:0 auto 15px;}
.subMenu ul li{font-size:12px;}
.subMenu ul li a{display:block; padding:12px 10px 10px; font-weight:bold; color:#666; border-bottom:1px solid #e3e3e3;
	transition:background .1s; -webkit-transition:background .1s;}
.subMenu ul li a:hover{background:#4062ab; color:#fff; border-color:#4062ab;}
.subMenu ul li a.current{background:#4062ab; color:#fff; cursor:default; border-color:#4062ab;}
/* --- ! --- */


/* --- TITLE & BREADCRUMB --- */
.content header h2{margin:0 0 20px;}
.content header h2 strong{font-family:"微軟正黑體"; font-size:24px; font-weight:bold; color:#333;}

#breadcrumb{display:block; font-size:12px; color:#999; font-weight:normal; line-height:12px; text-align:right; 
	border-bottom:1px solid #ddd; padding-bottom:5px;}
#breadcrumb em{color:#ccc; padding:0 5px;}
#breadcrumb a{color:#999; text-decoration:none;}
#breadcrumb .home{display:inline-block; width:12px; height:12px; background:url(../images/icon-home.png) 0 50% no-repeat; text-indent:-9999em;}
/* --- ! --- */


/* --- SEARCH --- */
#search-block{font-size:12px; color:#333; padding:8px 10px 8px; margin-bottom:12px; text-align:right; background:#f4f4f4; border:1px dotted #ddd;}
#search-block input[type=text]{background:#fff;}
#search-block input[type=submit], #search_block input[type=button]{width:60px; font-size:13px; border-color:#aaa;}
#search-block input[type=submit]{float:right; margin-left:10px;}
/* --- ! --- */


/* --- PAGE --- */
.page{font-size:12px; margin:0px 0px; padding:10px 0; text-align:center;}
.page span a, .page span a:hover, .page .current, .page .disabled{padding:5px 5px; margin:2px 0; border-radius:5px; line-height:28px;}
.page a{color:#333; border:1px solid #ccc; cursor:pointer; text-decoration:none; }
.page a:hover{color:#fff !important; background:#4062ab; border:1px solid #4062ab;}
.page .current{color:#333; background:#fff; font-weight:bold; border:1px solid #fff; }
.page .disabled{color:#ddd; border:1px solid #ddd;}
/* --- ! --- */


/* --- BANNER --- */
.banner-block{background:#ebebeb; height:auto!important;min-height:120px;height:120px;}
.banner-block ul{margin:0 auto; padding:20px 0; list-style:none;}
.banner-block li{float:left; width:20%; text-align:center; margin:12px 0;}
.banner-block a{display:block; width:154px; height:65px; overflow:hidden; margin:0 auto;}
/*.banner-block a:hover img{visibility:hidden;}*/
.banner-block img{width:154px;}
.bwWrapper {
    position:relative;
    display:block;
}
/* --- ! --- */


/* --- FOOTER --- */
footer{height:120px; font-size:12px; line-height:18px; color:#666; }
footer address{font-style:normal; float:left; padding:25px 25px 0;}
footer address span{color:#111;}
footer address a{color:#666;}
footer .qrcode{float:right; width:85px; height:85px; margin:10px 15px 0 0}
/* --- ! --- */


/* Hide from both screenreaders and browsers */
.hidden{display:none !important; visibility: hidden;}

/* Clearfix: contain floats */
.clearfix:before,
.clearfix:after {
    content: ""; /* 1 */
    display: table; /* 2 */
}
.clearfix:after{clear: both;}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}


/* --- COMM --- */
.maxWidth { width:100%;}
.maxHeight { height:100%; margin:0 auto;}
.floatL{ float:left; }
.floatR{ float:right; }
.explanation{font-size:12px; color:#C60; font-weight:normal;}
.required{color:#f00; font-weight:normal;}
table tr.even{background:#f7f7f7;}
table tr.odd{background:#fff;}
#ui-datepicker-div{font-size:12px;}
.ui-datepicker-trigger{margin-left:3px;}
.noneData{font-size:12px; color:#999; text-align:center; padding:10px;}
.noneBorder th, .noneBorder td{border:none !important;}
form{display:inline;}
/* --- ! --- */


/* --- Input, Select, Textarea --- */
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], textarea, select{
	padding:5px 4px; 
	background:#fff;
	border:1px solid #bbb; 
	border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;
	box-shadow:inset 0 1px 2px #ddd, 0 1px 1px rgba(100%,100%,100%,.4); 
	-moz-box-shadow:inset 0 1px 2px #ddd, 0 1px 1px  rgba(100%,100%,100%,.4);
	-webkit-box-shadow:inset 0 1px 2px #ddd, 0 1px 1px  rgba(100%,100%,100%,.4);
}
select{padding:3px; border:1px solid #ccc;}
select option{padding:3px; background:#fff;}
input[type=checkbox]{vertical-align:-2px;}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=date]:focus, textarea:focus, select:focus{
	outline:0;
	background:#fffeee;
	border:1px solid #67cfff; 
	box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd; 
	-moz-box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd; 
	-webkit-box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd;
	-ms-box-shadow:0 0 3px rgba(123,211,255,0.8), inset 0 1px 2px #ddd;
	webkit-appearance:none;
}
#search-block input.date{width:70px;}
/* --- ! --- */


/* --- Buttons --- */
input[type=submit], input[type=button], input[type=reset], a.btn{
	-webkit-appearance:none;
	display:inline-block; *display:inline; *zoom:1;
	vertical-align:top; text-align:center;
	color:#333; font-weight:bold; font-size:13px;
	padding:5px 8px;
	background:#fff;
	border:1px solid #4062ab;
	border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;
	box-shadow:0 1px 3px rgba(0%,0%,0%,.3), inset 0 -6px 10px -5px rgba(0,0,0,.3); 
	-moz-box-shadow:0 1px 3px rgba(0%,0%,0%,.3), inset 0 -6px 10px -5px rgba(0,0,0,.3); 
	-webkit-box-shadow:0 1px 3px rgba(0%,0%,0%,.3), inset 0 -6px 10px -5px rgba(0,0,0,.3); 
	cursor:pointer;
	text-decoration:none;
}
input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover, a.btn:hover{
	background:#4062ab;
	color:#fff;
	text-decoration:none;
}

.buttons{text-align:center;	padding-top:20px; border-top:1px solid #e3e3e3;}
.buttons input[type=submit], .buttons input[type=button], .buttons input[type=reset], .buttons a.btn{
	padding:6px 30px;
}

input.disabled[type='text'], textarea.disabled[type='text'], select.disabled[type='text'], 
textarea.disabled[type='button'], input.disabled[type='submit']{color:#999; opacity:.4;}
/* --- ! --- */


/* --- Social Share --- */
#social-share{float:right; margin-top:-3px;}
#social-share a{display:block; width:20px; height:20px; 
	background-image:url(../images/icon-social.png); background-repeat:no-repeat;
	text-indent:-9999em; float:left; margin-left:5px;}
#social-share .fb     {background-position:0 0;}
#social-share .plurk  {background-position:0 50%;}
#social-share .twitter{background-position:0 bottom;}
/* --- ! --- */


/* Huaweb */
.huaweb{color:#aaa; font-size:12px; margin-left:1em;}