﻿@charset "utf-8";
/* CSS Document */

html, body {
	margin:0;
	padding:0;
	.width:100%;
	.height:100%;
	overflow:auto;
	overflow-y:hidden;
}

body {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	min-width:980px;
	font:12px Tahoma, Arial, Helvetica, Sans-Serif;
}

* html body {
	_position:static;
	_width: expression((document.documentElement.offsetWidth) < 980? "980px" : "auto");
}

img { border: 0; }

a {color:#017ca5;text-decoration:none;}
a:hover {color:#6e4e3a;text-decoration:underline;}

#header {
	border-bottom:1px solid #bfbfbf;
	background:#f9f8f7;
	position: relative;
	width: 100%;
	height: 70px;
	margin: 0;
	padding: 0;
}

#header .logo {
	position:absolute;
	left:10px;
	top: 30px;
}

#header .logo-txt {
	position:absolute;
	left:130px;
	top: 45px;
	font: bold 16px "細明體", Arial, Helvetica, sans-serif, "細明體";
	color:#77473d;
}

/*- navMenu in Header */
.navMenu {
	background:url(../../images/nav_bg01.gif);
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:29px;
	margin: 0;
	padding: 0;
	font-size:9pt;
}

.navMenu ul.nav-L, .navMenu ul.nav-R {
	margin: 5px;
	padding: 0;
	line-height:19px;
	letter-spacing:1px;
}

.navMenu ul.nav-L {
	position:relative;
	float:left;
}

.navMenu ul.nav-R {
	position:relative;
	float:right;
}

.navMenu ul.nav-R img{
	margin:0 1px -2px 0 !important;
	vertical-align:baseline !important;;
}

.navMenu ul li {
	position:relative;
	float:left;
	margin: 0;
	padding: 0;
}

.navMenu ul li a {
	color:#6e4e3a;
	text-decoration:none;
}
/* content */
#index-content {
	position: absolute;
	overflow:hidden;
	overflow:visible;
	top: 75px;
	right: 0;
	bottom:0px;
	left: 0;
	width:100%;
}

#content {
	border-top: 1px solid #ffffff;
	position: absolute;
	overflow:hidden;
	overflow:visible;
	top: 71px;
	right: 0;
	bottom:0px;
	left: 0;
	width:100%;
	height: auto;
	_height:expression((document.documentElement.clientHeight - 70) + "px"); 
}

/* sidebar */	
.sidebar {
	position: absolute;
	overflow: auto;
	border: 1px solid #efcd9c;
	display:block !important;
	top: 0;
	left: 0;
	bottom: 0px;
	width: 180px;
	height: auto;
	_height:expression((this.parentNode.offsetHeight - 5) + 'px');
	overflow-y:hidden;
}

.sidebar h2{
	background: url('../../images/sidebar_bg01.gif') bottom center repeat-x;
	height:26px;
	line-height:26px;
	text-align:center;
	color:#ffffff;
}

.sidebar .panel-selector {
	border-left:1px solid white;
	background:#f9f0e1;
	margin:0;
	padding:0;
	height:39px;
	text-align:center;
}

.sidebar .panel-selector select {
	width:90%;
	font-family:verdana;
	margin-top:10px;
	font-size:11px;
	.font-size:10px;
}

.adv dt {
	width: 180px;
	height:26px;
	line-height:26px;
	text-indent:25px;
	cursor:pointer;
}

.adv dt.close { background: url('../../images/sidebar_bg02.gif') no-repeat; }

.adv dt.open { background: url('../../images/sidebar_bg03.gif') no-repeat; }

.adv dt a { color: #000; }

.adv dd {}

.adv dd a { color:#333; }
.adv dd a:hover { color:#017ca5; }

.adv dd ul {margin:5px 0;}

.adv dd ul li {
	display:inline-block;
	_display:inline; /* IE6 Hack */
	*display: inline; /* IE7 Hack */
	padding:7px 5px 7px 15px;
	zoom:1; /* IE6 7 Hack */

}

.adv dd ul li.active a{
	font-weight:bold;
	color:#6e4e3a;
}

.adv dd ul li a {
	color:#6e4e3a;
	text-decoration:none;
}

.adv dd ul li a:hover {
	color:orange;
}

.adv dd ul li img{
	margin:0 3px -3px 0 !important;
	vertical-align:baseline !important;;
}

/* primary */
#primary {
	position: absolute;
	overflow:auto;
	top:0;
	right: 0;
	bottom: 43px;
	left: 183px;
	width: auto;
	height: auto;
	_width: expression((this.parentNode.offsetWidth - 183) + "px");
	_height: expression((this.parentNode.offsetHeight - 45) + 'px');
}

#primary .frame {
	margin:0;
	padding:0;
	position:absolute;
	z-index:500;
	bottom:0px;
	left:0;
	right:0;
	overflow:auto;
	_width:expression((document.getElementById('primary').offsetWidth - 0) + "px");
	top:62px;
	_height:expression((document.getElementById('primary').offsetHeight - 62) + "px");
}

#primary .frame .cont {
	margin:10px;
}

#primary .frame .cont h3 {
	background:#FFEBE1;
	padding:5px 25px;
}

table.sel-table-out {
	table-layout:fixed;
	border-collapse:collapse;
	width:100%;
	.width:auto;
}

table.sel-table {
	table-layout:fixed;
	border-collapse:collapse;
	width:100%;
	.width:auto;
}

table.sel-table td {
	border-top:1px solid #c0c0c0;
	border-right:1px solid #c0c0c0;
	border-left:1px solid #c0c0c0;
	border-bottom:1px solid #CDCDCD;
}

table.settings-table {
	table-layout:fixed;
	border-collapse:collapse;
	width:100%;
	.width:auto;
}

table.settings-table th{
	width:160px;
	color:#808080;
	padding:8px 10px 8px 8px;
	background:#F3F3F3;
	font-weight:bold;
	text-align:right;
	vertical-align:top;
	line-height:18px;
	border-bottom:5px solid white;
}

table.settings-table td{
	padding:5px 16px 5px 10px;
	background:#FAFAFA;
	border-bottom:5px solid white;
	vertical-align:top;
	line-height:200%;
}

table.settings-table td li{
	border:1px solid #edd8ba;
	background:#fffbf7;
	position:relative;
	float:left;
	width:160px;
	height:160px;
	padding-top:30px;
	margin:5px 0px 5px 10px;
	display:inline;
	overflow:hidden;
}

table.settings-table td li div.image-checkbox{
	border:1px solid #FFF;
	border-bottom:1px solid #edd8ba;
	background:#fff0e2;
	position:absolute;
	top:0px;
	left:0px;
	height:20px;
	width:160px;
	text-align:left;
}

table.settings-table td li div.image-checkbox input{
	margin:3px 0 0 5px;
	padding:0;
	height:13px;
	width:13px;
}

table.settings-table td li div.image-thumbnail {
	position:relative;
	border:1px solid #cccccc;
	background:#FFFFFF;
	width:140px;
	height:105px;
	padding:2px;
	margin: 0 auto;
	text-align:center;
}

table.settings-table td li div.image-caption{
	color:#66829A;
	margin:10px;
	height:30px;
	line-height:15px;
	text-align:center;
	overflow:hidden;
}

.input-text {
	font-size:13px;
	padding:3px;
	font-family:Verdana;
	background:white;
	border:1px solid #AAAAAA;
}

.position {
	position:relative;
	background:#fbe9bc;
	display:block;
	height:26px;
}

.position span {
	position:absolute;
	left:10px;
	height:26px;
	line-height:26px;
}

.fun-bar {
	position:relative;
	border-top:1px solid #ffffff;
	background:#ffe0b8;
	display:block;
	height:35px;
	z-index:1000;
}

.fun-bar .title {
	position:absolute;
	top:8px;
	left:10px;
	width:auto;
	font:bold 16px "細明體", Arial, Helvetica, sans-serif;
}

.fun-bar .title img {
	margin:0 3px -3px 0 !important;
	vertical-align:baseline !important;
}

ul.function-bar-ul  {
	float:right;
	margin-right:10px;
	display:inline;
	font-size:12px;
	line-height:28px;
}

ul li.functions-li {
	float:left;
	display:inline;
	position:relative;
	height:28px;
	line-height:28px;
	padding:5px 0px 4px 0px;
	margin:0px 0px 0px 0px;
	color:gray;
}

.fun-bar .drop-menu{
	position:absolute;
	right:5px;
	top:34px;
	zoom:1;
	/* overflow:hidden; */
	z-index:10000;
	display:none;
	background-color:#F4F4F4;
	border:1px solid #A6A6A6;
	line-height:1.2em;
}

.fun-bar .drop-menu.default  { 
	background: #F4F4F4 url('../../images/drop-menu-bg.png') repeat-y left;
	width:auto;
}

.fun-bar .drop-menu.default ul { 
	border-top:1px solid #F4F4F4;
	border-bottom:1px solid #F4F4F4;
}

.fun-bar .drop-menu.default ul li {
	margin:0 1px;
	white-space:nowrap;
	.width:expression((this.parentNode.offsetWidth - 2) + "px");
}

.fun-bar .drop-menu.default ul li.drop-menu-hr {
	height:0px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #fff;
	overflow:hidden;
	margin:2px 1px;
	line-height:0px;
	font-size:0px;
}

.fun-bar .drop-menu.default ul li a{
	display:block;
	text-align:left;
	line-height:16px;
	height:16px;
	padding:4px 30px 4px 35px;
	text-decoration:none;
	color:black;
	position:relative;
}

.fun-bar .drop-menu.default ul li a span{
	display:block;
	position:absolute;
	left:1px;
	top:3px;
	width:24px;
	height:16px;
	text-align:center;
}

.fun-bar .drop-menu.default ul li a:hover {
	background:#C5E0F2;
	padding:3px 29px 3px 34px;
	border:1px solid #3B97D3;
	margin:0;
	cursor:default;
}

.fun-bar .drop-menu.default ul li a:hover span {
	top:2px;
	left:0;
}

.fun-bar .fun {
	position:relative;
	float:right;
	padding:5px;
}

table.list-table {
	table-layout:fixed;
	width:100%;
	.width:auto;
	border-collapse:separate;
}

table.list-table th {
	border-right:1px solid #D0D0D0;
	border-left:1px solid #EEEEEE;
	border-bottom:1px solid #CDCDCD;	
	background:url(../../images/list_titlebg01.gif) repeat-x;
	height:24px;
	font-size:12px;
	text-align:center;
	vertical-align:middle;
	white-space:nowrap;
	color:#000;
	z-index:1000;
}

table.list-table td {
	border-bottom:1px solid #dddddd;
	height:40px;
	padding:4px;
}

table.list-table td.name {
	line-height:15px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

table.list-table tr.marked {
	background:#fafafa;
}

table.list-table .post-content {
	position:relative;
}

table.list-table .pic {
	position:relative;
	float:left;
	border:1px solid #cccccc;
	background:#FFFFFF;
	width:60px;
	height:60px;
	padding:2px;
	text-align:center;
}

table.list-table ul {
	position:relative;
	float:left;	
	top:10px;
	left:10px;
}

table.list-table ul li {
	width:120px;
	margin-top:2px 0;
	font-size:12px;
}

table.list-table .post-user {
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

table.list-table .post-title {
	margin-bottom:5px;
	line-height:21px;
	vertical-align:middle;
	color:#426194;
}

table.list-table .post-text {
	font-size:11px;
	color:#7B797B;
}

table.list-table .post-reply {
	background:#ddd;
	margin-top:10px;
	margin-right:10px;
	padding:10px;
	zoom:1;
	overflow:hidden;
}

table.list-table .post-reply .pic {
	position:relative;
	margin-right:10px;
}

table.list-table .post-reply .answer {
	position:relative;
	padding:5px;
	font-size:12px;
	line-height:18px;
	color:#444 !important;
}

table.list-table .post-reply a{
	color:#888;
	border:1px solid #AAA;
	text-decoration:none;
	padding:3px 10px;
	margin-right:10px;
	display:block;
	width:40px;
	text-align:center;
	background:white;
	float:left;
}

/* pageStyle */
.pagination {
	background:#fbe9bc;
	position: absolute;
	overflow:auto;
	right: 0px;
	bottom: 0px;
	padding-top:5px;
	height:35px;
	left: 180px;
	_width: expression((document.body.offsetWidth - 180) + "px");
}

.TotalPage {
	position:relative;
	float:left;
	width:15%;
	text-align:center;
}

.PageNum {
	position:relative;
	float:left;
	width:70%;
	text-align:center;
}

.PageNum ul {
	margin: 0;
	padding: 0;
}

.PageNum ul li {
	list-style-type: none;
	display: inline;
}

.PageNum ul li a.Num, .PageNum ul li a:visited.Num {
	border: 1px solid #ccc;
	background-color:#ffffff;
	display:inline-block;
	width:25px;
	text-decoration: none;
	color: #666 !important;
}

.PageNum ul li a:hover.Num {
	border: 1px solid #fb8102;
	background-color:#fb8102;
	text-decoration: none;
	color: #fff !important;
}

.RowCount {
	position:relative;
	float:left;
	width:15%;
	text-align:center;
}

/* footer */
#index-footer {
	background:url('../../images/index-footer_bg01.gif') repeat-x;
	position: absolute;
	overflow:auto;
	right: 0px;
	bottom: 0px;
	padding-top:5px;
	height:125px;
	left: 0px;
	_width: expression((document.body.offsetWidth - 0) + "px");
}

#index-footer .logo {
	position:absolute;
	top:60px;
	left:25px;
}

#index-footer .fun {
	position:absolute;
	top:67px;
	left:190px;
	color: #000;
}

#index-footer .copyright {
	position:absolute;
	top:85px;
	left:190px;
	margin: 0;
	padding: 0;
	color: #000;
}

#footer {
	background:#fbe9bc;
	position: absolute;
	overflow:auto;
	right: 0px;
	bottom: 0px;
	padding-top:5px;
	height:35px;
	left: 180px;
	_width: expression((document.body.offsetWidth - 180) + "px");
	text-align:right;
}

#footer #submit-box{
	margin-top:4px;
	margin-right:4px;
}

/* formStyle */

input.text {
	border:#c7c7c7 solid 1px;
	padding:2px;
	line-height:20px;
}

textarea {
	border:1px solid #ccc;
	font: 14px "微軟正黑體", Arial, Helvetica, sans-serif, "細明體";
	line-height:18px;
}

input.submit {
	BORDER-TOP: #ccc 1px solid;
	BORDER-RIGHT: #999 1px solid;
	BORDER-LEFT: #ccc 1px solid;
	BORDER-BOTTOM: #999 1px solid;
	BACKGROUND: url(../../images/fade-butt.gif);
	padding:1px 2px 1px 2px;
	cursor:pointer;
	font-size:12px;
	font-family:"Lucida Grande", Tahoma, Arial, sans-serif;
	line-height:16px;
	COLOR: #333;
}

button, a.button {
	border:1px solid #dedede;
	border-right:1px solid #bbb;
	border-bottom:1px solid #BFBFBF;
	overflow:visible;
	margin:0 2px;
	cursor:pointer;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	line-height:16px;
	text-decoration:none;
}

button {
	/*	background-color:#f5f5f5;*/
	background-color:#ffffff;
	padding:2px 10px 1px 5px;
}

button:hover {
	background-color:#dff4ff;
	border:1px solid #A7CEDF;
	color:#336699;
}

button img, a.button img {
	margin:0 3px -3px 0 !important;
	vertical-align:baseline !important;
}

button span{
	display:block;
	height:16px;
	white-space:nowrap;
}

button.drop span {
	background:url('../../images/drop-menu-arrow.gif') center right no-repeat;
	display:block;
	height:16px;
	padding-right:15px;
	white-space:nowrap;
}

button[type] {
	width:auto;
	padding:4px 8px 4px 5px;
	line-height:17px;

}

a.button {
	background-color:#f5f5f5;
	display: block;
	padding:5px 8px;
	color:#000000;
}

a.button:hover {
	background-color:#dff4ff;
	border:1px solid #A7CEDF;
	color:#336699;
}

blockquote {
	border:1px dotted #666;
	background:#FAFAFA;
	margin:10px;
	padding:5px;
	font:12px Tahoma, Arial, Helvetica, Sans-Serif;
	line-height:24px;
}

.displayHide { display: none; }

#identTips {
	position: absolute;
	z-index: 3000;
	border: 1px solid #111;
	background-color: #000;
	padding: 5px;
	opacity: 0.9;
	line-height:20px;
	color:#FFFFFF;
}