/* -----------------------------------
	Basic layout for Editor
   ---------------------------------*/
html{

overflow-y:hidden;
overflow-x:hidden;

}
#assetPane {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 130px;
	background: #cdd1d7 url("../../img/com/bg_assets.png") 0 0 repeat-x;
	}
/*Chen: 
clear:left is important for IE6
*/
#editingZone {
	position: absolute;
	left: 0px;
	bottom: 100px;
	width: 100%;
	
	clear:left;
	top: 75px;
	}
/*Chen:
add width:100% for IE6 
*/
#editorPane {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: #f9fafb;
	
	*width:100%;
	overflow: auto; 
	overflow-x:hidden;	
	}

#editorPane .canvas,
#playpen {
	background: url("../../img/com/grid_10px.png");
	font-size: 1em;
	line-height: 10px;
	border-top: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6;
	position: relative;
	margin: 0 auto;
	}
	
#canvasSurround {
	background: #fff;
	margin: 0 auto;
	padding: 10px;
	border: 1px solid #d5d7d9;
}

.dim#editorMask {
	background: #000;
	opacity: 0.35;
}


#playpen {
	position: absolute;
	left: -2000px;
	top: 0;
	height: 200px;
	overflow: auto;
}


#assetList {
	background: transparent;
	margin: 4px 0 0 10px;
	}
	
#assetList li a {
	cursor: pointer;
	}

	
.assetGroupContent {
	display: none;
	position: absolute;
	top: 32px;
	left: 5px;
	min-width: 900px;
	}
	
.active .assetGroupContent {
	display: block !important;
	text-align: center;
	/***** visual *****/
	color: #fff;
	text-shadow: #114477 2px 2px 1px ;
	-moz-opacity: 0.9999;
	}

.assetGroupContent li {
	list-style-type: none;
	background: none !important;
	min-width: 60px;
	min-height: 55px;
	padding: 8px 3px 3px 3px !important;
	margin: 0 4px !important;
	background: url("../../img/icon/icon_bg.png") center top no-repeat !important;
	}

.assetGroupContent .label {
		display: block;
	}

.assetGroupContent li:hover {
	padding: 7px 2px 2px 2px!important;
	border: 1px solid #606b85;
	background: url("../../img/icon/icon_bg_on.png") center top no-repeat !important;
	}

.assetGroupContent img,
.asset img {
	margin: 0px 0 6px;
	opacity: 0.6;
	}

.assetGroupContent li:hover img {
	opacity: 1;
	}





.tog_vert {
	position: relative;
	width: 45px;
	margin: 0 auto;
	cursor: pointer;
	z-index:100;
	*margin-left:48%;
	}

.tog_vert img {
	position: absolute;
	top: 0;
	left: -5px;
	z-index: 400;
	filter: alpha(opacity=60);
	-moz-opacity: .6;
	opacity: .6;
	}


.tog_vert img:hover {
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
	}

/* when used in header, need a position change */
.tog_header {
	height:7px;
	/*background:#666666;*/
	position:absolute;
	bottom:0px;
	left:81px;
	*left:-23px;
}
.tog_header img{
	bottom:0px;
	top:auto;
	left:0px;
}

#showArrow{
height:7px;
top:auto;
bottom:0px;
}
#hideArrow{

height:7px;
top:auto;
bottom:0px;
}
/* Message Bar */
.messageBar {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	padding: 0.4em 0;
	color: #685327;
	background: #ffffb9;
	border-bottom: 1px solid #eed8a8;
	overflow: auto;
}
	.messageBar span {
		margin: 0 1em;
	}
	
	.messageBar.success {
		color: #363e32;
		background: #c7feab;
		border-bottom: 1px solid #65c038;
	}
	.messageBar.error {
		color: #442927;
		background: #ff9e97;
		border-bottom: 1px solid #a4433c;
	}
	.messageBar.save {
		text-align: right;
	}
#canSurround{
	margin:0 auto;
	padding:10px;
	padding-top:0px;
}

/*
for comment
*/

.commentBlock {
	line-height: 1.2;
	/*position: relative;*/
	
	min-height: 69px;
	margin: 0px 10px 0px 0px;
}

.commentAddBox input[type=button] {
	position: absolute;
	right: 0px;
}


.commentPhoto {
	width: 58px;
	top: 0px;
	/*position: absolute;*/
	float:left;
	left: 0px;
	height: 100%;
}
.authorLink{
float:left;
}
.commentDeleteButton {
	float:right;
	
}
.commentContent {
	/*padding: 0px 0px 0px 58px;*/
	margin:0;
	
	_float:left;
	clear:right;
	
	overflow: hidden;
}

.commentCount {
	margin: 0px 0px 0px 5px;
}

.commentBody {
	margin: 5px 0px 0px 0px;
	line-height: 1.2;
}

.commentUsername {
	margin: 0px;
	_height:15px;
}
.commentDate{
	font-size:10px;
}
.commentsDivider {
	*border-width:medium medium 1px;
	margin: 5px 0px 5px 0px;
	background-color:#919191;
	border-left-color:#BFBFBF;
	border-left-style:none;
	border-right-color:#BFBFBF;
	border-right-style:none;
	border-top-color:#BFBFBF;
	border-top-style:none;
	color:#919191;
	*color:inherit;
	height:1px;
	line-height:1px;
}