/* 判斷：當打開 DIY 面板時加載 */
body { padding-top: 170px; }
#controlpanel { color: #000;position: fixed; top: 0; left: 0; z-index: 200; width: 100%; border-bottom: 1px solid #999; background: #F5F5F5 url({STATICURL}image/diy/cp-bg.png) repeat-x 0 0; }
	* html #controlpanel { position: absolute; top: expression(offsetParent.scrollTop); }
	#controlheader { margin: 0 10px; background: url({STATICURL}image/diy/cp-nav.png) repeat-x 0 0; line-height: 46px; }
		#controlheader p { width: 460px; height: 46px; background: url({STATICURL}image/diy/cp-nav-corner-tr.png) no-repeat 100% 100%; }
			#controlheader p a { float: right; margin-top: 8px; height: 27px; line-height: 27px; }
				#navsave a { margin-right: 2px; width: 54px; background: url({STATICURL}image/diy/cp-save.png) no-repeat 0 0; text-indent: -9999px; overflow: hidden; }
				#navcancel a { width: 27px; background: url({STATICURL}image/diy/cp-close.png) no-repeat 0 0; text-indent: -9999px; overflow: hidden; }
				#button_redo a, #button_undo a { background: url({STATICURL}image/diy/cp-step.png) no-repeat 0 0; text-indent: -9999px; overflow: hidden; }
				#button_redo a { margin-right: 5px; width: 27px; background-position: 0 -54px; }
					#button_redo.unusable a { background-position: 0 -81px; cursor: default; }
				#button_undo a { margin-left: 10px; width: 28px; }
					#button_undo.unusable a { background-position: 0 -27px; cursor: default; }
				#button_more { margin-right: 20px; width: 17px; height: 27px; background: url({STATICURL}image/diy/cp-more.png) no-repeat 0 0; text-indent: -9999px; overflow: hidden; }
				#preview a { margin-right: 2px; width: 43px; background: url({STATICURL}image/diy/cp-preview.png) no-repeat 0 -27px; text-indent: -9999px; overflow: hidden; }
					#preview.unusable a { background-position: 0 0; }
				#savecache a { margin-right: 2px; width: 43px; background: url({STATICURL}image/diy/cp-savecache.png) no-repeat 0 -27px; text-indent: -9999px; overflow: hidden; }
					#savecache.unusable a { background-position: 0 0; }
				#savecachemsg { float: right; padding-right: 5px; text-align: right; }
		#controlnav { padding-left: 50px; height: 46px; background: transparent url({STATICURL}image/diy/t-diy.png) no-repeat 0 100%; line-height: 35px; }
			#controlnav li { float: left; margin-top: 7px; margin-right: 5px; font-size: 14px; font-weight: 700; }
				#controlnav li a { float: left; padding: 0 15px; color: #333 !important; }
			#controlnav li.current { background: url({STATICURL}image/diy/cp-nav-active.png) no-repeat 0 0; }
				#controlnav li.current a { background: url({STATICURL}image/diy/cp-nav-active.png) no-repeat 100% -50px; }
				#controlnav li.current span { margin-right: -8px; }
		#diy_backup_tip { top: 32px; right: 55px; width: auto; line-height: 1.5; }
			#diy_backup_tip a { text-decoration: underline; }
	#controlcontent { margin: 0 10px; padding: 10px; height: 110px; he\ight: 90px; border: solid #CCBDCC; border-width: 0 1px; background: #FFF; overflow: hidden; }
	#controlcontent li { float: left; margin-right: 4px; }
		#controlcontent li a, #controlcontent li label { float: left; width: 90px; height: 90px; text-align: center; cursor: pointer; }
			#controlcontent li a { color: #333 !important; }
			#controlcontent li a:hover, #controlcontent li label.hover { background: url({STATICURL}image/diy/cp-item-selected.png) no-repeat 0 0; text-decoration: none; }
			#controlcontent li img, #controlcontent li label span { display: block; margin: 7px auto 0; width: 80px; height: 60px; text-align: center; }
				#controlcontent li span { background: url({STATICURL}image/diy/cp-module-type.png) no-repeat 0 0; }
					#controlcontent li.module-html span { background-position: -80px -180px; }
					#controlcontent li.module-thread span { background-position: -80px 0; }
					#controlcontent li.module-forum span { background-position: 0 -180px; }
					#controlcontent li.module-member span { background-position: 0 -120px; }
					#controlcontent li.module-article span { background-position: -80px -120px; }
					#controlcontent li.module-attachment span { background-position: 0 -240px; }
					#controlcontent li.module-blog span { background-position: 0 -60px; }
					#controlcontent li.module-doing span { background-position: -80px -60px; }
	#contentblockclass ul li { float: none; margin: 0; }
	#contentblockclass ol { overflow: hidden; margin-bottom: 10px; padding-left: 45px; height: 60px; background: url({STATICURL}image/diy/module-html.png) no-repeat 5px 0; }
		#contentblockclass ol li { float: left; margin-right: 2px; }
		#contentblockclass li.module-html ol { border: none; background-image: url({STATICURL}image/diy/module-html.png); }
		#contentblockclass li.module-forum ol { background-image: url({STATICURL}image/diy/module-forum.png); }
		#contentblockclass li.module-space ol { background-image: url({STATICURL}image/diy/module-space.png); }
		#contentblockclass li.module-group ol { background-image: url({STATICURL}image/diy/module-group.png); }
		#contentblockclass li.module-portal ol { background-image: url({STATICURL}image/diy/module-article.png); }
		#contentblockclass li.module-member ol { background-image: url({STATICURL}image/diy/module-member.png); }
		#contentblockclass ol label { margin-top: 3px; width: 60px; height: 24px; border: 1px dotted #B6C7EC; line-height: 24px; overflow: hidden; }
			#contentblockclass ol label.hover { border-style: solid; background: none; }
	#cpfooter { padding: 0 10px 10px; border-bottom: 1px solid #FFF; }
		#cpfooter td { height: 6px; background: #FFF; line-height: 0; overflow: hidden; }
			#cpfooter td.l { width: 6px; background: url({STATICURL}image/diy/cp-nav-corner-bl.png) no-repeat 0 0; }
			#cpfooter td.c { height: 5px; border-bottom: 1px solid #CCBDCC; }
			#cpfooter td.r { width: 6px; background: url({STATICURL}image/diy/cp-nav-corner-br.png) no-repeat 0 0; }

/* DIY 部分 */
dl.diy dt { margin-top: -10px; margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #CCC; line-height: 26px; }
	dl.diy dt a { color: #06C !important; text-decoration: underline; }
		dl.diy dt a.activity { color: #333 !important; font-weight: 700; text-decoration: none; }
	dl.diy dl { clear: both; padding: 0 10px; }
		dl.diy dl dt { float: left; margin: 0; padding: 0; width: 5em; border: none; }
		#positiontable td { width: 12px; height: 12px; border: 2px solid #FFF; background: #EEE; line-height: 0; overflow: hidden; cursor: pointer; }
			#positiontable td.red{ background-color:red;}
	.color_diy { width:310px; float:left; overflow:visible;}
		.color_diy .span { float:left; display:inline; line-height:24px;}
	#controlcontent .diy li a { width: 60px; height: 60px; }
		#controlcontent .diy li a:hover { background: none; }
		#controlcontent li.thumb img { margin: 0; width: 60px; height: 60px; }
	#diyimg_prev div *, #diyimg_next div * { display: none; }
		dl.diy .pg { float: left; }
		#diyimg_prev .prev, #diyimg_next .nxt { display: block; padding: 0 !important; width: 20px; height: 60px; border: 1px solid #EEE; text-indent: -9999px; }
			#diyimg_prev .prev { margin-right: 4px; }
			#diyimg_next .prev { background: url({IMGDIR}/arw_l.gif) no-repeat 50% 50%; }
			#diyimg_next .nxt { margin: 0; background: url({IMGDIR}/arw_r.gif) no-repeat 50% 50%; }

/* 原CSS */
#outerbox { width: 970px; margin: auto; }
.float_left { margin: 0 0 0 34px;}
.float_center { margin: auto; }
#header,#wrap,#footer, .wrap { margin: 0 auto; }
#wrap { min-height:320px;}
#header {margin-top:34px; position:relative; height:150px; text-align:center; line-height:100px; z-index:10;}
#footer { height:100px; line-height:100px; width: 970px; border:0;}
#widgets { position:relative; z-index:20; overflow:visible;}
.float_item { position:absolute; z-index:25;}
#nav { border:1px solid #09f; min-height:30px; line-height:28px;}
#nav ul li { float:left; margin:1px 2px;}
.op {position:absolute; right:10px; bottom:10px;}
.op a {display:inline; margin-left:2px; line-height:22px;}
#space_page { width: 100%; overflow: hidden; }
#left { float: left; margin: 0 15px 0 0; width: 190px; overflow: hidden; border: 0 solid #09F; }
#center { float: left; margin: 0 15px 0 0; width: 560px; border: 0 solid #CCC; }
#right { float: left; width: 180px; border: 0 solid #F9F; }
.move-span {margin: 1px; }
.area { margin-bottom: 5px; padding: 3px; background: #DDF0DF; }
	body#space .area { padding: 10px 0; border: none; background: transparent; }
.frame,.frame-tab { margin: 5px 0; padding-top: 5px; border: 1px dashed #09F; background: #FFF; }
#space .frame{background-color: transparent; }
	.frame-tab { border-color: #FF8500; }
		.frame-tab .title .titletext { float: left; margin: 0 2px;}
	body#space .frame, body#space .frame-tab { padding: 0; }
.frame-tab .title ul li {cursor:pointer;}
.frame-tab .tabcontent { width:98%; border:1px solid #09f; margin:3px; float:left;}
.tabactivity { background: #FFF; }
/*.column,.titletext { float:left;}*/
.title .tmpbox { float: left; }

.frame-1-1, .frame-1-1-1, .frame-1-2, .frame-2-1, .frame-1-3, .frame-3-1 { background-image: url({STATICURL}image/diy/vline.png); background-repeat: repeat-y; }
	.frame-1-1, .frame-1-1-1 { background-position: 50% 0; }
		.frame-1-1-1 { background-image: url({STATICURL}image/diy/vline2.png); }
	.frame-1-2 { background-position: 33.3% 0; }
	.frame-2-1 { background-position: 66.6% 0; }
	.frame-1-3 { background-position: 24.9% 0; }
	.frame-3-1 { background-position: 74.9% 0; }

.block { margin: 0 0 5px; padding: 5px; border: 0 solid #CCC; background: #FFF; }
	#space .block{background-color: transparent; }
	.block .blocktitle { height: 26px; line-height: 26px; }
	.block .blockname { font-weight: 700; margin-left: 5px; float: left; }
	.block .blockedit { margin-right: 5px; float: right; text-decoration: underline; cursor: pointer; }
	.block .dxb_bc { overflow: hidden; }
	body#space .block { margin: 0 2px 5px; border: 1px dashed #09F; }

.title { background: #CBFAFD; }
	.tab-title { background: #FFFAD2 !important; }
		.frame-tab .title .move-span .blocktitle { background: #FFFAD2; }

.moving {background:#4ef; position:absolute;}
.tmpbox { margin:4px 0; border:2px dashed #aaa; background:#FFF;}
.temp {height:0;border:0;}
.hide {display:none}
.left {float:left;}
.right {float:right;}
.pointer { cursor:pointer;}
.m_left_40 {margin-left:40px;}

.current { background: #FFF; }
.activity { background: #FFF; }
#currentlayout { color: #F04; }
.td_right { float: left; display: block; line-height:22px; }
.rb { border: 2px solid red; }
#contentframe li a, #contentblockclass li label { cursor: move; }
/***原CSS***/
#diy-tg { display: none !important; }
/**space**/
#controlcontent .selector li a { margin: 5px 10px 0 0; padding-left: 30px; width: 60px; height: 30px; line-height: 30px; background: url({STATICURL}image/diy/cp-item-mini.png) no-repeat 0 0; text-align: left; cursor: pointer; }
	#controlcontent .selector li a:hover { background: url({STATICURL}image/diy/cp-item-mini.png) no-repeat 0 -30px; }
	#controlcontent .selector li.activity a, #controlcontent .selector li.activity a:hover { background: url({STATICURL}image/diy/cp-item-mini.png) no-repeat 0 100%; }

#borderul label { margin-right: 3px; }
	.borderul .bordera, .borderul label { display: none; }
	.borderul label.y { display: inline; }

/* 彈窗 by Pony */
.diywin .px { vertical-align: middle; }
.diywin td { padding: 2px 0; }
.diywin .tfm caption, .diywin .tfm th, .diywin .tfm td { padding: 5px 2px; }
/* 個人導航小樣式 */
.mininv { width: 450px; height: 30px; border: 1px dotted #09F; }

/* 個人空間和網站DIY共用的部分樣式 */
.hide { display: none; }
.frame,.tab,.block { position: relative; zoom:1; min-height: 20px; }
.edit { position: absolute; top: 0; right: 0; z-index: 199; padding: 0 5px; background: red; line-height: 26px; color: #FFF; cursor: pointer; }
.block .edit { background: #369; }
.edit-menu { position: absolute; z-index: 300; border-style: solid; border-width: 0 1px 1px; border-color: #DDD #999 #999 #CCC; background: #FFF; }
	.mitem { padding: 4px 4px 4px 14px; width: 36px; border-top: 1px solid #DDD; cursor: pointer; }
		.mitem:hover { background: #F2F2F2; color: #06C; }