#mytree-template-setting {
	width: 100%;
	color: #666;
	background-color: #EEE;
	border-bottom: 1px solid #CCC;
	clear: both;
}

#mytree-template-setting h4,
#mytree-template-setting h5 {
	color: #666;
	font-weight: normal;
}

#mytree-template-setting .setting-nav {
	height: 40px;
	background-color: #333;
	clear: both;
}

#mytree-template-setting .setting-nav a {
	color: #CCC;
}

#mytree-template-setting .setting-tabs {
	width: 720px;
	height: 40px;
	position: absolute;
	left: 50%;
	margin: 0 0 0 -480px;
	border-bottom: 0;
}

#mytree-template-setting .setting-tabs span {
    display: block;
}

#mytree-template-setting .setting-tabs dt {
	width: 72px;
	height: 18px;
	background: transparent url(/img/mybabytree_v2/template/setting-asset.png) no-repeat 0 0;
	margin: 11px 23px 11px 5px;
	text-indent: -9999px;
	float: left;
	display: inline;
}

#mytree-template-setting .setting-tabs dd {
	float: left;
	margin: 8px 2px 0 0;
	width: 100px;
	height: 32px;
	background: transparent url(/img/mybabytree_v2/template/setting-asset.png) no-repeat 0 -30px;
	line-height: 32px;
	text-align: center;
	font-size: 14px;
	color: #CCC;
	cursor: pointer;
}

#mytree-template-setting .setting-tabs .active {
	background-position: -100px -30px;
	color: #333;
	font-weight: bold;
	cursor: default;
}

#mytree-template-setting .setting-submit {
	width: 320px;
	height: 24px;
	line-height: 24px;
	position: absolute;
	right: 50%;
	margin: 0 -480px 0 0;
	padding: 8px 0;
	text-align: right;
}

#mytree-template-setting .setting-submit .btn-save {
	color: #FFF;
}

#mytree-template-setting .setting-submit .btn-cancel {
	width: 50px;
	height: 24px;
	display: inline-block;
	text-align: center;
	background: transparent url(/img/mybabytree_v2/template/setting-asset.png) no-repeat 0 -70px;
	margin: 0 5px;
}

#mytree-template-setting .setting-submit .btn-cancel:hover {
	text-decoration: none;
}

#mytree-template-setting .setting-content {
	background: transparent url(/img/mybabytree_v2/template/setting-content-bg.png) repeat-y center 0;
}

.setting-content a {
	color: #666;
}

.setting-content h4 {
	margin: 0 0 5px;
}

#mytree-template-setting .setting-content .content-section {
	width: 930px;
	margin: 0 auto;
	padding: 12px 15px;
	zoom: 1;
	height: 230px;
	overflow: hidden;
}

#mytree-template-setting .setting-content .content-section:after {
	content: "";
	display: table;
	clear: both;
}

#mytree-template-setting .setting-content .sep {
	height: 2px;
	overflow: hidden;
	clear: both;
	background: transparent url(/img/mybabytree_v2/common/double-line-h.png) repeat-x 0 0;
}

.onekey-note {
	width: 140px;
	margin: 4px 0 0;
	float: left;
}

.onekey-note li {
	height: 90px;
	padding: 0 0 0 1.5em;
}

.onekey-note .order {
	width: 1.5em;
	display: inline-block;
	margin: 0 0 0 -1.5em;
}

.onekey-themes {
	float: right;
	display: inline;
	margin: -12px -13px 0 0;
	width: 780px;
	height: 220px;
	padding: 5px 0;
	overflow: auto;
	overflow-x: hidden;
	position: relative;
	z-index: 0;
}

.onekey-themes .theme-item {
	width: 154px;
	height: 94px;
	float: left;
	display: inline;
	padding: 8px 18px;
	background: transparent url(/img/mybabytree_v2/template/onekey-themes-bg.png) repeat 0 -6px;
}

.onekey-themes .theme-item a {
	width: 150px;
	border: 2px solid transparent;
	_border-color: #EEE;
	border-bottom-width: 0;
	display: block;
	cursor: pointer;
}

.onekey-themes .theme-item .active,
.onekey-themes .theme-item a:hover {
	border-color: #5E95BF;
	text-decoration: none;
}

.onekey-themes .theme-thumb {
	width: 130px;
	height: 80px;
	display: block;
	background-color: #FFF;
	border: 1px solid #CCC;
	border-bottom-width: 0;
	padding: 9px 9px 0;
}

.onekey-themes a:hover .theme-thumb {
	border-color: #5E95BF;
}

.onekey-themes .theme-thumb img {
	width: 130px;
	height: 80px;
	display: block;
	clear: both;
	background-color: #DFE6EE;
}

.onekey-themes .theme-title {
	color: #FFF;
	font-size: 14px;
	line-height: 20px;
	text-align: center;
	position: absolute;
	z-index: 1;
	width: 142px;
	height: 20px;
	overflow: hidden;
	padding: 0 4px;
	margin: -20px 0 0;
}

.onekey-themes .theme-mask {
	position: absolute;
	width: 150px;
	height: 20px;
	background-color: #666;
	z-index: 0;
	filter: alpha(opacity=40);
	opacity: 0.4;
	margin: -20px 0 0;
}

#template-setting-theme h4 {
	position: absolute;
	margin: 2px 0 0 -60px;
}

#template-setting-theme .photo-browse {
	margin: 0 0 10px;
}

#template-setting-theme .photo-browse input {
	vertical-align: middle;
}

#template-setting-theme .theme-banner {
	margin: 5px 25px 15px 15px;
	float: left;
	display: inline;
	width: 375px;
	height: 50px;
	background: transparent url(/img/mybabytree_v2/common/double-line-v.png) repeat-y 100% 0;
	padding: 0 0 0 60px;
}

#template-setting-theme .theme-banner .photo-browse {
	width: 350px;
	height: 62px;
	margin: -10px 20px -22px 0;
	padding: 10px 0 0;
	position: absolute;
	background: transparent url(/img/mybabytree_v2/template/module-banner-example.png) no-repeat 100% 0;
}

#template-setting-theme .theme-background-image {
	width: 390px;
	float: left;
	height: 50px;
	margin: 5px 0 0;
	padding: 0 0 0 60px;
}

#template-setting-theme .theme-background-image dl {
	display: inline;
	white-space: nowrap;
	float: left;
}

#template-setting-theme .theme-background-image dd label input {
	width: 13px;
	height: 13px;
	margin: 0 4px 0 0;
	margin: 0\9;
}

dl.background-image-repeat {
	margin: 0 0 0 -60px;
}

dl.background-image-align {
	margin: 0 0 0 30px;
}

#template-setting-theme .theme-background-image dt {
	display: inline;
	margin: 0 10px 0 0;
}

#template-setting-theme .theme-background-image dd {
	display: inline;
}

#template-setting-theme .theme-background-image label {
	margin: 0 5px 0 0;
}

#template-setting-theme .theme-background-image input {
	vertical-align: -2px;
	_vertical-align: middle;
}

#template-setting-theme .theme-color-scheme {
	float: left;
	display: inline;
	clear: both;
	width: 900px;
	margin: 0 15px;
	padding: 15px 0 0;
	background: transparent url(/img/mybabytree_v2/common/double-line-h.png) repeat-x 0 0;
}

#template-setting-theme .theme-color-scheme h4 {
	position: static;
	float: left;
	margin: 0;
	width: 60px;
}

#template-setting-theme .scheme-list {
	width: 500px;
	float: left;
	margin: 0 20px 0 0;
}

#template-setting-theme .scheme-list li {
	width: 109px;
	float: left;
	display: inline;
	margin: 0 16px 13px 0;
}

#template-setting-theme .scheme-list li a {
	width: 105px;
	height: 15px;
	display: block;
	background-repeat: no-repeat;
	border: 2px solid transparent;
	_border-color: #EEE;
}

#template-setting-theme .scheme-list li a.active,
#template-setting-theme .scheme-list li a:hover {
	border-color: #5E95BF;
}

#color-scheme-1 { background-image: url(/img/mybabytree_v2/template/color-scheme-1.png?20120927); }
#color-scheme-2 { background-image: url(/img/mybabytree_v2/template/color-scheme-2.png?20120927); }
#color-scheme-3 { background-image: url(/img/mybabytree_v2/template/color-scheme-3.png?20120927); }
#color-scheme-4 { background-image: url(/img/mybabytree_v2/template/color-scheme-4.png?20120927); }
#color-scheme-5 { background-image: url(/img/mybabytree_v2/template/color-scheme-5.png?20120927); }
#color-scheme-6 { background-image: url(/img/mybabytree_v2/template/color-scheme-6.png?20120927); }
#color-scheme-7 { background-image: url(/img/mybabytree_v2/template/color-scheme-7.png?20120927); }
#color-scheme-8 { background-image: url(/img/mybabytree_v2/template/color-scheme-8.png?20120927); }
#color-scheme-9 { background-image: url(/img/mybabytree_v2/template/color-scheme-9.png?20120927); }
#color-scheme-10 { background-image: url(/img/mybabytree_v2/template/color-scheme-10.png?20120927); }
#color-scheme-11 { background-image: url(/img/mybabytree_v2/template/color-scheme-11.png?20120927); }
#color-scheme-12 { background-image: url(/img/mybabytree_v2/template/color-scheme-12.png?20120927); }
#color-scheme-13 { background-image: url(/img/mybabytree_v2/template/color-scheme-13.png?20120927); }
#color-scheme-14 { background-image: url(/img/mybabytree_v2/template/color-scheme-14.png?20120927); }
#color-scheme-15 { background-image: url(/img/mybabytree_v2/template/color-scheme-15.png?20120927); }
#color-scheme-16 { background-image: url(/img/mybabytree_v2/template/color-scheme-16.png?20120927); }

#template-setting-theme .scheme-customized {
	width: 320px;
	float: left;
}

#template-setting-theme .scheme-customized h5 {
	margin: 0 0 14px;
}

#template-setting-theme .customized-list li {
	width: 55px;
	height: 40px;
	float: left;
	margin: 0 25px 5px 0;
	text-align: center;
	background-color: transparent;
}

#template-setting-theme .customized-list .color-palette {
	width: 53px;
	height: 17px;
	display: block;
	border: 1px solid #CCC;
	background-color: #FFF;
	cursor: pointer;
	margin: 0 0 2px;
}

.template-types {
	margin: -12px -13px 0 0;
	height: 220px;
	padding: 5px 0;
	overflow: auto;
	overflow-x: hidden;
	position: relative;
	z-index: 0;
}

.template-types .type-item {
	width: 154px;
	height: 175px;
	float: left;
	display: inline;
	margin: 12px 0;
	padding: 8px 16px;
	background: transparent url(/img/mybabytree_v2/template/onekey-themes-bg.png) repeat-x 0 75px;
}

.template-types .type-item a {
	width: 150px;
	border: 2px solid transparent;
	_border-color: #EEE;
	border-bottom-width: 0;
	display: block;
	cursor: pointer;
}

.template-types .type-item a:hover {
	border-color: #5E95BF;
	text-decoration: none;
}

.template-types .type-thumb {
	width: 130px;
	height: 161px;
	display: block;
	background-color: #FFF;
	border: 1px solid #CCC;
	border-bottom-width: 0;
	padding: 9px 9px 0;
}

.template-types a:hover .type-thumb {
	border-color: #5E95BF;
}

.template-types .type-thumb img {
	width: 130px;
	height: 130px;
	display: block;
	clear: both;
	background-color: #DFE6EE;
}

.template-types .type-title {
	display: block;
	line-height: 30px;
	text-align: center;
	height: 30px;
	padding: 0 4px;
	margin: -30px 0 0;
}

.template-types .type-item .new {
	width: 23px;
	height: 14px;
	display: block;
	background: transparent url(/img/mybabytree_v2/template/setting-asset.png) no-repeat 0 -100px;
	position: absolute;
	margin: -168px 0 0 126px;
}

#mytree-template-setting .setting-content #template-setting-module {
	height: auto;
}

#template-setting-module .module-flow {
	margin: 5px 15px 5px 25px;
	float: left;
	display: inline;
	width: 500px;
	background: transparent url(/img/mybabytree_v2/common/double-line-v.png) repeat-y 100% 0;
}

#template-setting-module .module-diy {
	width: 340px;
	margin: 5px 25px;
	float: left;
	display: inline;
}

#template-setting-module .module-aside {
	margin: 5px 15px 5px 25px;
	float: left;
	display: inline;
	width: 500px;
	background: transparent url(/img/mybabytree_v2/common/double-line-v.png) repeat-y 100% 0;
}

#template-setting-module .module-digit {
	width: 340px;
	margin: 5px 25px;
	float: left;
	display: inline;
}

#template-setting-module .module-list {
	height: 140px;
	margin: 20px 0 0;
	padding: 0 0 0 130px;
}

#template-setting-module .module-flow .module-list {
	background: transparent url(/img/mybabytree_v2/template/module-flow-example.png) no-repeat 0 0;
}

#template-setting-module .module-diy .module-list {
	background: transparent url(/img/mybabytree_v2/template/module-diy-example.png?20131021) no-repeat 0 0;
}

#template-setting-module .module-aside .module-list {
	background: transparent url(/img/mybabytree_v2/template/module-aside-example.png) no-repeat 0 0;
}

#template-setting-module .module-digit .module-list {
	background: transparent url(/img/mybabytree_v2/template/module-digit-example.png) no-repeat 0 0;
}

#template-setting-module .sep {
	margin: 10px 0;
}

#template-setting-module .module-list ul {
	float: left;
	display: inline;
	margin: -2px 0 0 20px;
}

#template-setting-module .module-list li {
	white-space: nowrap;
	line-height: 20px;
	float: left;
	clear: both;
}

#template-setting-module .module-list .checked {
	color: #333;
}

#template-setting-module .module-list li input {
	vertical-align: -2px;
}

#template-setting-photo-feature .feature-intro {
	width: 210px;
	height: 190px;
	margin: 5px 25px;
	display: inline;
	float: left;
	background: transparent url(/img/mybabytree_v2/template/feature-intro-example.png) no-repeat 0 100%;
}

#template-setting-photo-feature .feature-operate {
	float: left;
	margin: 5px 10px 5px 0;
}

.feature-photo-selector {
	float: left;
	clear: both;
	width: 648px;
	height: 102px;
	background-color: #DFE6EE;
	padding: 10px 5px;
	margin: 20px 0 0;
}

.feature-photo-selector li {
	width: 150px;
	height: 100px;
	border: 1px solid #999;
	background-color: #FFF;
	float: left;
	display: inline;
	margin: 0 5px;
}

.feature-photo-selector .photo-thumb {
	width: 150px;
	height: 100px;
	display: block;
}

.feature-photo-selector .photo-thumb img {
	width: 150px;
	height: 100px;
	display: block;
}

.feature-photo-selector .photo-operate {
	color: #FFF;
	font-size: 14px;
	line-height: 20px;
	text-align: center;
	position: absolute;
	z-index: 1;
	width: 150px;
	height: 50px;
	overflow: hidden;
	margin: -60px 0 0;
}

.feature-photo-selector .photo-operate a {
	color: #FFF;
	display: inline-block;
	margin: 0 5px;
}

.feature-photo-selector .photo-mask {
	position: absolute;
	width: 150px;
	height: 100px;
	background-color: #666;
	z-index: 0;
	filter: alpha(opacity=40);
	opacity: 0.4;
	margin: -100px 0 0;
}

#template-setting-defined .diy-intro {
	width: 210px;
	height: 190px;
	margin: 5px 25px;
	display: inline;
	float: left;
	background: transparent url(/img/mybabytree_v2/template/module-diy-example.png) no-repeat 0 100%;
}

#template-setting-defined .diy-operate {
	float: left;
	margin: 5px 10px 5px 0;
	width: 600px;
}

#template-setting-defined .diy-content-type dt {
	margin: 0 0 5px;
}

#template-setting-defined .diy-content-type dd {
	display: inline;
	margin: 0 20px 0 0;
}

#template-setting-defined .diy-content-add {
	background-color: #FFF;
	padding: 5px;
	border-radius: 5px;
	margin: 10px 0 0;
}

#template-setting-defined .diy-content-add li a {
	line-height: 30px;
	width: 100px;
	display: inline-block;
	text-align: center;
	color: #06C;
	text-decoration: none;
	border-radius: 5px;
}

#template-setting-defined .diy-content-add li a:hover {
	text-decoration: underline;
}

#template-setting-defined .diy-content-add .current a {
	background-color: #E0E0E0;
	font-weight: bold;
	color: #666;
}

#template-setting-defined .diy-content-add .current a:hover {
	text-decoration: none;
}

#template-setting-defined .diy-content-add .file-name {
	margin: 0 0 0 10px;
	line-height: 30px;
}

#template-setting-indexpage .indexpage-intro {
	width: 210px;
	height: 190px;
	margin: 5px 25px;
	display: inline;
	float: left;
	background: transparent url(/img/mybabytree_v2/template/module-indexpage-example.png) no-repeat 0 100%;
}

#template-setting-indexpage .indexpage-operate {
	float: left;
	margin: 32px 10px 5px 0;
	width: 600px;
}

#template-setting-indexpage .indexpage-content-type dd {
	display: inline;
	margin: 0 20px 0 0;
}

/* 选色器 */

#color_pick_up {
	position: absolute;
	z-index: 100;
	background-color: #666;
	height: 289px;
	box-shadow: 0 0 5px rgba(0,0,0,.2);
	border-radius: 5px;
}

#color_pick_up a {
	color: #FFF;
}

#color_pick_up .restore {
	padding: 4px 10px 3px;
}
