/* CSS for Supesite Control Panel */


* {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333;
	word-break: break-all;
}
body {
	padding: 0;
	margin: 0;
}
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a.red {
	color: red;
}

img {
	border: none;
}
.wrap {
	width: 770px;
	padding: 0 5px;
	w\idth: 760px;
	margin: 5px auto;
}



/*-----------------------------------*/
#pagehead {
	background: url(table_btm_line.gif) no-repeat left bottom;
	margin-bottom: 2em;
}
h1 {
	background: url(icon_01.gif) no-repeat 0.5em;
	color: #F10712;
	line-height: 2.2em;
	font-size: 14px;
	padding-left: 3em;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

.actions {
	vertical-align: bottom;
	text-align: right;
	padding-right: 0.5em;
	width: 520px;
}
.actions td {
	width: 125px;
	height: 27px;
	background: url(action.gif) no-repeat center;
	text-align: center;
}
.actions td.active {
	background-image: url(action_active.gif);
}

.actions a {
	background: url(action_icon_default.gif) no-repeat left;
	padding-left: 1.5em;
	padding-top: 2px;
	line-height: 27px;
}
.actions a.add {
	background-image: url(action_icon_add.gif);
}
.actions a.edit {
	background-image: url(action_icon_edit.gif);
}
.actions a.view {
	background-image: url(action_icon_view.gif);
}
.actions .active a {
	color: #F10712;
	font-weight: bold;
}


.explain td {
	width: 125px;
	height: 27px;
	background: url(action.gif) no-repeat center;
	text-align: center;
}

h2 {
	margin: 0.8em 0;
	line-height: 2.5em;
	color : #FFFFFF;
	background-color : #698CC3;
	padding-left:5px;
}

/*-----------------------------------*/
form {
	padding: 0;
	margin: 0;
}

/*-----------------------------------*/

.maintable {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #698CC3;
}

.maintable td {
	background: #FFFFFF;
}
.maintable th {
	background: #F8F8F8;
	width: 210px;
	text-align: left;
	font-weight: normal;
}

.maintable th {
	border: 1px solid #D6E0EF;
	padding: 0.3em;
}

.maintable td {
	border: 1px solid #D6E0EF;
	padding: 0.3em;
}


.maintable th p {
	margin: 0;
	color: #999;
}

/*-----------------------------------*/

.edittable {
	border: 1px solid #698CC3;
	width: 100%;
}
.edittable th {
	background: #EDEDED;
	border: 1px solid #EDEDED;
	padding: 0.3em;
	text-align: left;
}
/*-----------------------------------*/

table.watermark {
	border-collapse: collapse;
	width: auto;
}
table.watermark td {
	border: 1px solid #CCC;
}

.buttons {
	padding: 1em;
	text-align: center;
}
.buttons input {
	padding: 0.2em 0.5em 0 0.5em;
}
.submit {
	background: #698CC3;
	color: #FFF;
	padding: 0.2em 1em 0 1em;
	letter-spacing: 1em;
}


/*-----------------------------------*/
.toptable {
	width: 100%;
}
.toptable td {
	text-align: right;
	background: #F8F8F8;
	padding: 0.5em;
	padding-right: 1em;
	border: 1px solid #698CC3;
}
.toptable td * {
	vertical-align: middle;
}

/*-----------------------------------*/

.helptable {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #698CC3;
	margin-bottom: 1em;
}
.helptable th {
	background: #698CC3;
}
.helptable th, .helptable td {
	border: 1px solid #D6E0EF;
	padding: 0.3em;
	background: #F8F8F8;
}
.helptable ul {
	padding: 0;
	margin: 0 0 0 2em;
	line-height: 150%;
}

.listtable {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #698CC3;
}
.listtable th {
	background: #698CC3;
	color: #FFFFFF;
}
.listtable th, .listtable td {
	border: 1px solid #DDD;
	padding: 0.3em;
}

.darkrow2 {
	color: #808080;
	text-decoration: line-through;
}

.darkrow td {
	background: #F8F8F8;
}

.norow td {
	background: #FFFCCC;
	color: blue;
}
.norow a {
	color: blue;
}

.listtable p.cate {
	margin: 0;
}
.listtable p.cate, .listtable p.cate a {
	color: #003195;
}

.listtable .dateline {
	float: right;
}

.listtable .relativetags {
	margin: 0.1em;
}

/*-----------------------------------*/
.btmtable {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #698CC3;
	border-top: none;
}
.btmtable td, .btmtable th {
	padding: 0.5em;
	border-top: none;
}
.btmtable td {
	background: #FFF;
}
.btmtable th {
	background: #698CC3;
	font-weight: normal;
	text-align: left;
	color: #FFF;
}

/*-----------------------------------*/
.freetable {
	border-collapse: collapse;
	width: auto;
	border: 0px;
	word-wrap: break-word;
}

.freetable td, .freetable th {
	border: 0px;
	padding: 0.2em;
	border-bottom:none;
}

.freetable .subject {
	margin-top: 0.5em;
}

/*-----------------------------------*/


/*-----------------------------------*/
.listpage {
	width: 100%;
	margin-top: 0.5em;
}
.listpage td {
	text-align: right;
	background: #F8F8F8;
}

/*-----------------------------------*/

/*分頁*/
div.page {
	text-align: right;
}
table.page {
	margin: 0.4em 0 0.4em auto;
}
table.page td {
	border: 1px solid #9AA1AB;
	padding: 0 0.3em;
}
table.page td.current {
	color: #FFF;
	background: #9AA1AB;
}


/*-----------------------------------*/
.catetb td {
	border: none;
	padding: 0;
}
.catetb #divopcatid {
	height: 120px;
	overflow: auto;
	border: 1px solid #D6E0EF;
	padding: 0.3em;
}

/*-----------------------------------*/
.progress {
	margin:0.5em 0;
	padding: 0.5em;
	background: #D6E0EF;
	color: #F40914;
	font-weight: bold;
	border: 1px solid #698CC3;
}

/*-----------------------------------*/
#uploadbox {
	padding: 0.5em;
	width: 500px;
}
#uploadbox th, #uploadbox td {
	border: none !important;
}

/*-----------------------------------*/
#divshowupload table {
	border-collapse: collapse;
}


/*-----------------------------------*/
#uploadswitch td {
	background: url(switch_tab_small.gif) no-repeat;
	width: 80px;
	text-align: center;
	padding: 0;
	height: 22px;
	padding-top: 5px;
	he\ight: 17px;
	border: none;
}
#localupload table, #netupload table, #batchupload table {
	width: 40em;
}
#localupload, #netupload, #batchupload {
	border: 1px solid #D9D9D9;
	border-top: none;
	border-bottom-width: 2px;
	background: url(switch_tab_line.gif) no-repeat -427px 0;
	padding: 0.5em;
}
#netupload {
	background-position: -347px 0;
}
#batchupload {
	background-position: -267px 0;
}
#localupload td, #netupload td, #batchupload td {
	padding: 0.2em;
	border: none;
}
#localupload th, #netupload th, #batchupload th {
	background: transparent;
	padding: 0.2em;
	width: 8em;
	text-align: center;
	border: none;
}
#batchpreview {
	overflow-y:auto;
	height:310px;
	border: 1px solid #698CC3;
	width:100%;
}
.picbox {
	width: 117px;
	height: 117px;
	w\idth: 105px;
	he\ight: 105px;
	text-align: center;
	border:1px #CECECE solid;
	overflow: hidden;
	padding: 5px;
}

.nopreview {
	margin-top: 30px;
}
.pictext {
	text-align: center;
	width: 117px;
}
.pictext input {
	text-align: center;
	width: 115px;
	w\idth: 115px !important;
	w\idth: 113px;
	border:solid 1px #CCCCCC;
	display: none;
}
.delimg {
	z-index: 65533;
	width: 117px;
	position: absolute;
	height: 18px;
	display: none;
	text-align: right;
	background: #F3F3F3;
	filter: alpha(opacity=70);
	opacity: 0.7;
}
.delimg img {
	cursor: pointer;
}
.picspace {
	float:left;
	margin: 5px 0 0 5px;
	width: 117px;
	height: 150px;
	overflow: hidden;
}
#batchdisplay {
	width: 86px;
	height: 34px;
	background: url(btn_select_file.gif) no-repeat;
}

.fileinput {
	margin-left: -25px;
	height: 34px;
	filter: alpha(opacity=0);
}

#upbutton>#batchdisplay {
	padding-left: 15px;
}
#batchdisplay>.fileinput {
	direction: rtl;
	height: 34px;
	opacity: 0;
	width: 20px;
}

@media all and (min-width: 0px){ /*for Opera Only*/
	#batchdisplay>.fileinput {
		width: 90px;
	}
}


#upbutton div {
	float:left;
}
.upbtntd {
	width: 10em;
	text-align: center;
	border-left: 1px solid #D9D9D9;
}
.upbtntd input {
	width: 92px;
	height: 41px;
	background: url(btn_upload.gif) no-repeat;
	border: none;
	cursor: pointer;
	display: block;
	text-indent: -9999px;
}
#delall {
	width: 86px;
	height: 34px;
	background: url(btn_delall.gif) no-repeat;
	border: none;
	cursor: pointer;
	display: block;
	text-indent: -9999px;
	float: right;
}
.textmsg {
	color: red;
	margin: 0.5em 0;
	padding: 0.5em;
	border: 1px solid #698CC3;
	background: #FCFFEF url(icon_notice.gif) no-repeat 0.5em 0.3em;
	line-height: 1.5em;
	padding-left: 2.5em;
}
.succ {
	background-image: url(icon_succ.gif); 
}

#divshowupload {
	padding: 0.5em;
	padding-top: 0;
}
#divshowupload td {
	border-bottom-color: #D9D9D9;
}
#divshowupload td img {
	width: 50px;
	height: 50px;
}


#uploadbox th, #uploadbox td {
	border: none !important;
}

/* ?? */
#supelinks {
	margin: 1em 0.5em;
	padding: 0;
	list-style: none;
	line-height: 1.5em;
}
#supelinks li {
	padding-left: 0.7em;
	background: url(../../images/icon_01.gif) no-repeat left;
}

#quicklinks {
	margin: 3em auto;
	width: 500px;
	list-style: none;
}

#quicklinks li {
	padding: 0.5em 2em;
	float: left;
}
#quicklinks li * {
	vertical-align: middle;
}
#quicklinks li a {
	color: #F20007;
	font-size: 16px;
	font-weight: bold;
	padding: 0 0.5em;
	display: block;
}
#quicklinks li a:hover {
	text-decoration: none;
	background: #EEE;
}
#quicklinks li a img {
	padding-right: 2em;
	background: url(quicklinks_line.gif) no-repeat right;
}


#quicklinks td {
	padding: 0.5em 2em;
}
#quicklinks td * {
	vertical-align: middle;
}
#quicklinks td a {
	color: #F20007;
	font-size: 16px;
	font-weight: bold;
	padding: 0 0.5em;
}
#quicklinks td a:hover {
	text-decoration: none;
	background: #EEE;
}
#quicklinks td a img {
	padding-right: 2em;
	background: url(quicklinks_line.gif) no-repeat right;
}

/*-----------------------------------*/

.grade {
	background: url(../images/icon-star1.gif) no-repeat center 8px;
	text-indent: -9999px;
	width: 64px;
	height: 2em;
	display: block;
	margin: 0 auto;
}

.grade0 {
	background-image: url(../images/icon-star0.gif);
}

.grade1 {
	background-image: url(../images/icon-star1.gif);
}

.grade2 {
	background-image: url(../images/icon-star2.gif);
}

.grade3 {
	background-image: url(../images/icon-star3.gif);
}

.grade4 {
	background-image: url(../images/icon-star4.gif);
}

.grade5 {
	background-image: url(../images/icon-star5.gif);
}


/*-----------------------------------*/
#footer {
	border-top: 1px solid #698CC3;
	margin-top: 2em;
	padding: 1em 0;
	text-align: center;
	font-size: 11px;
}
#footer * {
	font-size: 11px;
}
#footer strong {
	color: #007EA8;
}
#footer em {
	color: #B3C300;
	font-style: normal;
	font-weight: bold;
}
#footer p {
	margin: 0;
	color: #999;
}



/*SecMenu*/
#secmenu {
	background: #FCFFEF;
	border-top: 1px solid #698CC3;
	border-bottom: 1px solid #698CC3;
	margin-bottom: 1em;
	padding: 0.5em 1em;
}
#secmenu .firsttd {
	background: url(submenu_side.gif) no-repeat 0 0;
	width: 20px;
}
#secmenu .lasttd {
	background: url(submenu_side.gif) no-repeat right bottom;
	width: 20px;
}
#secmenu td a {
	background: url(icon_arrow.gif) no-repeat 0 0.1em;
	padding-left: 1em;
}


#listtab {
	background: url(dot_black.gif) repeat-x left 27px;
	height: 37px;
}

.listtab {
	float: left;
}
.listtab a {
	background: url(listtab.gif) no-repeat left top;
	float: left;
	display: block;
	width: 96px;
	height: 30px;
	margin-top: 2px;
	margin-right: 0.4em;
	text-align: center;
	color: #007EA8;
	padding-top: 8px;
	he\ight: 22px;
}
.listtab a:hover {
	text-decoration: none;
}
.listtab a.active {
	background-image: url(listtab_active.gif);
}


/*圖片管理列表 */
table.imglisttable {
	width: 100%;
	border-collapse: collapse;
}
table.imglisttable th {
	background: #698CC3;
	padding: 0.2em 0.5em;
	text-align: left;
}
table.imglisttable th * {
	vertical-align: text-bottom;
}
table.imglisttable th, table.imglisttable td {
	border: 1px solid #698CC3;
}
table.imglisttable td td {
	border: none;
}

td.imginfo {
	width: 180px;
	border-right: 1px solid #698CC3 !important;
	vertical-align: top;
}
td.imginfo ul {
	margin: 0.5em;
	padding: 0;
	list-style: none;
}
td.imginfo li {
	padding: 0.3em 0;
	border-bottom: 1px solid #EEE;
}

.smallfont {
	font-size: 10px;
}

table.imglist td {
	background: #F2F2F2;
	text-align: center;
	vertical-align: bottom;
}
p.subject {
	height: 22px;
	line-height: 22px;
	margin: 0;
	margin-top: 0.5em;
	border-top: 2px solid #FFF;
	background: #698CC3;
}

/*************************************************************/
/******************************************** 頂部 Tool Bar **/
/*************************************************************/
#toolbarframe {
	height: 30px;
	width: 100%;
}

#toolbarframe iframe {
	width: 100%;
	height: 30px;
}
















/*NEW*/
html {
	overflow-x: hidden;
}
body {
	background: #FFF;
	color: #000;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif, "細明體";
}

a {
	color: #333;
	text-decoration: none !important;
}
a:hover {
	text-decoration: none;
}

/*top toolbar*/
#pagetop {
	margin: 0;
	padding: 0;
	background-color : #698CC3;
	color : #FFFFFF;
}
#pagetop a {
	text-decoration: none;
	color : #FFFFFF;
}




/*************************************************************/
/******************************************** 頂部 Tool Bar **/
/*************************************************************/

#toolbar {
	height: 30px;
	he\ight: 29px;
	overflow: hidden;
	border-bottom: 1px solid #A3A2A7;
	margin-left: 8px !important;
	margin-left: 165px;
}

#toolbar ul {
	list-style: none;
	padding: 0;
	margin: 0;
	padding-top: 4px;
}
#toolbar li {
	display: block;
	float: left;
	padding: 0 3px 0 5px;
	background: url(../../images/default/toolbar_line.gif) no-repeat left;
	line-height: 24px;
}
#toolbar a {
	display: block;
	float: left;
	height: 20px;
	line-height: 22px;
	overflow: visible !important;
	overflow: hidden;
	padding: 0 2px;
	margin: 1px;
}

#toolbar .right {
	float: right;
	width: 240px;
}
#toolbar .right li {
	float: right;
}

#toolbar a:hover {
	border: 1px solid;
	margin: 0 !important;
	margin-right: 1px;
	border-top-color: #FFF;
	border-right-color: #808080;
	border-bottom-color: #808080;
	border-left-color: #FFF;
	text-decoration: none;
}


#toolbar input {
	border-top: 1px solid #333;
	border-right: 1px solid #F5F5F5;
	border-bottom: 1px solid #F5F5F5;
	border-left: 1px solid #333;
	vertical-align: middle;
}
#toolbar button.login {
	background: url(../../images/default/toolbar_icon_login.gif) no-repeat 3px 2px;
	border: none;
	height: 22px;
	line-height: 22px;
	padding-left: 17px;
	vertical-align: middle;
	margin: 1px;
	cursor: pointer;
}



#toolbar li.noborder {
	background: none;
	color : #FFFFFF;
}





#menuctrl {
	float: left;
	width: 160px;
	height: 30px;
	he\ight: 29px;
	border-bottom: 1px solid #D0DACF;
}
#menuctrl a {
	display: block;
	background: url(../images/side_top_link.gif);
	width: 88px;
	height: 22px;
	line-height: 26px;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	margin-top: 7px;
	margin-left: 10px;
	color : #000000;
}



/*側邊frame*/

#side {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	background: #F9F9F9;
}


#menu div {
	border-width : 1px;
	border-color : #698CC3;
	border-style : solid;
	margin: 5px 20px 5px 10px;
}
#menu a {
	text-decoration: none;
	color: #FFFFFF;
}

#menu h3 {
	font-size: 12px;
	margin: 0;
	height: 25px;
	line-height: 25px;
	background-color : #698CC3;
	text-align: center;
}

#menu div.folderopen h3 a {
	background-position: right -76px;
}
#menu div.folder h3 a {
	background-position: right -38px;
}

#menu ul {
	margin: 0;
	padding: 5px 0;
	line-height: 22px;
	list-style: none;
}
#menu li {
	background: url(../images/icon_viewsite.gif) no-repeat;
	background-position: 8px 4px !important;
	background-position: 8px 6px;
	padding-left: 20px;
	border: 1px solid #F9F9F9;
}
#menu li a {
	color: #333;
}
#menu li a:hover {
	color: red;
}
#menu li.active {
	background-color: #F6FDF5;
	border-color: #CBDCEA;
}
#menu li.active a {
	color: red;
}

/*各Title的Icon圖標*/


/*main*/
#main {
	margin: 0;
	padding: 10px 20px !important;
	padding: 10px 30px 10px 20px;
}


/*公告*/
#announcement {
	background: #FCFFEF url(../../images/green/icon_announcement.gif) no-repeat fixed 10px 2px;
	border: 1px solid #E6E8DC;
	margin-bottom: 10px;
	padding: 0 5px 0 40px;
}
#announcement * {
	color: red;
}
#announcement marquee {
	line-height: 25px;
}


/*網站公告*/
#sitemsg {
	border: 1px solid #A3A2B3;
	border-right-color: #333;
	border-bottom-color: #333;
	background: #EEF0F6;
	width: 180px;
	position: fixed !important;
	position: absolute;
	right: 10px;
	bottom: -180px;
	text-align: left;
}
#sitemsg a.close {
	float: right;
	display: block;
	width: 30px;
	height: 22px;
	text-indent: -9999px;
	background: url(../../images/default/btn_close.gif) no-repeat center center;
	overflow: hidden;
}
#sitemsg h6 {
	line-height: 24px;
	height: 22px;
	overflow: hidden;
	margin: 0;
	font-size: 12px;
	padding-left: 8px;
	background: url(../../images/default/toolbar_bg.gif) repeat-x 0 0;
}
#sitemsg div {
	margin: 2px;
	border: 1px solid #A3A2B3;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	padding: 5px 5px 0 5px;
	min-height: 160px;
	height: auto !important;
	height: 160px;
	line-height: 1.6em;
}
#sitemsg p {
	margin: 5px 0;
	background: url(../../images/default/dotline_h.gif) repeat-x bottom;
}
#sitemsg p.more {
	background: none;
	text-align: center;
	margin: 0;
	height: 22px;
}
#sitemsg p.more a {
	display: block;
	margin: 0 4px 0 auto;
	background: url(../../images/default/toolbar_bg.gif) repeat-x 0 0;
	border: 1px solid #A3A2B3;
	width: 50px;
	height: 16px;
	font-size: 11px;
	line-height: 16px;
	overflow: hidden;
}
#sitemsg p.more a:hover {
	text-decoration: none;
}

.tipdiv {
	position:absolute;
	z-index:1;
	width:140px;
	background-color:#FFFFCC;
	border: 1px solid #333366;
	padding: 0.5em;
	text-align: left;
}


/*Pages*/
.pages { text-align: right; border-top: 1px solid #D5E9F8; }

/* 分頁 */
.xspace-page { margin: 2px 2px 2px auto; }
	table.xspace-page a { display: block; background: #EBEBEB; padding: 0.3em 0.5em; text-decoration: none; }
		table.xspace-page a:hover { background: #698CC3; }
	table.xspace-page td.xspace-current { background: #698CC3; padding: 0.3em 0.5em; font-weight: bold; }
	table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #EBEBEB; padding: 0.3em 0.5em; }