
/*-------------------------------------------------------*
/* 组件库 
/*-------------------------------------------------------*/
.left_title{
	padding: 10px;
	color: #333;
    line-height: 24px;
    border-bottom: 1px solid #ccc;
    height: 24px;
	background: #ccc;
	cursor: pointer;
	font-size: 13px;
}
.left_search {
	margin-left: 20px;
	height: 24px;
    line-height: 24px;
    padding-left: 15px;
    color: #666;
    outline: none;
    border-style: none;
    border-bottom: 1px solid #ddd;
	display: inline-block;
    width: 190px;
    background: #fafafa;
}
.left_box_li{
    width:60px;
    display:inline-block;
    font-size:12px;
    text-align:center;
    padding:5px;
    border-top:0px;
    border-left:0px;
    border-right:0px;
    box-sizing:border-box;
    cursor: pointer;
}
.listbox{
    background:#fff;
    min-width:200px;
	flex: 1;
    overflow-y: auto;
}
.listbox_li{
	border-bottom: 1px solid #ccc;
    padding: 3px;
    display: flex;
}
/*-------------------------------------------------------*
/* 模板编辑界面
/*-------------------------------------------------------*/
.template_box_del_box{position:fixed;display:inline-block;padding:5px;font-size:12px;display:block;color:#fff;background:#333;cursor:pointer;z-index:99999;}
.template_box_del_box_li{}
.noneline {
    min-height: 10px;
    width: calc(100% - 32px);
    margin: 5px;
    border:1px dashed #f60!important;
    cursor: pointer;
	padding:10px;
	color:#aaa;
	font-size:14px;
}
div[class="noneline"]:hover{
    border: 1px dashed #f60;
}
[uid] {
    border: 1px solid rgba(0,0,0,0);
}
[uid]:hover {
    border: 1px solid #f60;
}
/*-------------------------------------------------------*
/* 属性界面
/*-------------------------------------------------------*/
.template_ui_cont_opt_top {
	color: #fafafa;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid rgba(0,0,0,0.7);
    padding-left: 10px;
    font-size: 14px;
    background: rgba(0,0,0,0.7);
    cursor: pointer;
}
.template_ui_cont_opt_list {
    border-bottom: 1px solid rgba(0,0,0,0.7);
    font-size: 12px;
	height: 24px;
}
.template_ui_cont_opt_list_name {
	outline: none;
    display: inline-block;
    width: calc(30% - 10px);
    height: 24px;
    line-height: 24px;
    padding-left: 10px;
    float: left;
    background: rgba(0,0,0,0.2);
}
.template_ui_cont_opt_list_value {
	outline: none;
    display: inline-block;
    width: calc(70% - 11px);
    border-left: 1px solid rgba(0,0,0,0.7);
    height: 24px;
    line-height: 24px;
    padding-left: 10px;
    float: left;
    overflow: hidden;
}
.editbox_show_add {
    text-align: center;
    border-bottom: 1px solid rgba(0,0,0,0.7);
    padding: 5px;
    height: 15px;
    line-height: 15px;
    font-size: 12px;
    cursor: pointer;
}
.noedit{
	cursor:pointer;
	
}
.yesedit{
	background:rgba(222,222,222,1);
	color:rgba(34,102,204,1);
}
.text_span_span {
	line-height: 24px;
	margin-left: 10px;
}
.selectlist{
	outline: none;
	position: absolute;
    left: 121px;
    border: 0px;
    height: 24px;
    width: 46%;
}

.option_border_box{
    display: inline-block;
    height: 24px;
    line-height: 24px;
    width: calc(100% - 125px);
    padding-left: 4px;
    border-left: 1px solid #444;
}
.option_border_box_inline{
    display: inline-block;
    position: relative;
}
.option_border_box_inline_checkbox{
    display: none;
}
.option_border_box_inline_label{
    cursor: pointer;
    background: #dadada;
}
.option_border_box_inline_span{
    display:inline-block;
    line-height:18px;
    width:50px;
    text-align:center;
    margin: 3px 0px;
    color: #fafafa;
}
.option_border_box_inline_label:before{
    position:absolute;
    display:inline-block;
    content:"";
    width:50px;
    height:18px;
    line-height:18px;
    top: 3px;
    left:0px;
    vertical-align:bottom;
    z-index:-1;
    
}
.option_border_box_inline_label:after{
    position:absolute;
    display:inline-block;
    content:"";
    width:50px;
    height:18px;
    line-height:18px;
    text-align:center;
    opacity:0;
    
}
.option_border_box_inline_checkbox:checked + .option_border_box_inline_label:before{
    background:#444;
    
}
.option_border_box_inline_checkbox:checked + .option_border_box_inline_label:after{}
.option_border_box_inline_checkbox:checked  + .option_border_box_inline_label + .option_border_box_inline_span{
    color:#fff;
    
}


/*-------------------------------------------------------*
/* 颜色选择器 - 新版 template_ex
/*-------------------------------------------------------*/

.style_data_list .minicolors-theme-bootstrap .minicolors-swatch{left:8px!important;cursor: pointer;}
.style_data_list .minicolors-theme-bootstrap .minicolors-input{width:0px!important;}
.style_data_list .minicolors-position-bottom .minicolors-panel{top:31px!important;left:-158px!important;}

/*-------------------------------------------------------*
/* 滑动条
/*-------------------------------------------------------*/	
.slider{
	width: calc(70% - 150px);
	margin: 10px 4px;
	height: 4px;
	-webkit-appearance: none;
	appearance: none;
	background-color: #000;
	outline: none;
	opacity: 0.7;
	-webkit-transition: opacity .2s;
	transition: opacity .2s
}
.slider:hover{
	opacity: 1
}
.slider::-webkit-slider-thumb{
	-webkit-appearance: none;
	appearance: none;
	width: 4px;
	height: 12px;
	background-color: #7fb3d5;
	cursor: pointer
}
.slider::-moz-range-thumb{
	width: 25px;
	height: 25px;
	background-color: #7fb3d5;
	cursor: pointer;
}

/*template_edit.php*/
/*-------------------------------------------------------*
/* 可视化样式按钮等的样式表
/*-------------------------------------------------------*/
.template_edit_option_box_box{background:#fff;}
.template_edit_option_box_li{padding:4px 10px;}
.template_edit_option_box_name{padding:10px;color:#000;font-size:18px;border-bottom:1px solid rgba(0,0,0,.4);border-top:1px solid rgba(0,0,0,.4);}
.text_span{display:inline-block;height:32px;line-height:32px;float:left;margin-right:10px;color:#000;font-size:14px;width:84px;}
.text_title{display:inline-block;height:32px;line-height:32px;float:left;margin-right:10px;color:#000;font-size:14px;}
.text_input{border:1px solid #ccc;}
.text_span_span_t{height:32px;line-height:32px;font-size:12px;margin:0px 10px;color:#bbb;}

/*左侧*/
.leftnva_list_a.current {
    background: #34cece;
    color: #fafafa;
}
.leftnva_list_a:hover {
    background: #34cece;
    color: #fff;
}
/*-------------------------------------------------------*
/* 编辑主题 - 通用
/*-------------------------------------------------------*/
.template_nav_a {
	font-size: 12px;
}
.template_nav_a.current {
	font-size: 16px;
}
/*-------------------------------------------------------*
/* 编辑主题 - 配置信息
/*-------------------------------------------------------*/
.waring{color:rgba(255,102,0,.8);background:rgba(255,102,0,.4);padding:10px;}
.box_input_inline{display:inline-block;position:relative;margin-right:20px;}
.input_button{background:#34cece;padding:5px 10px;margin:10px;color:#fff;}

.input_radio{display:none;}
.input_span{display:inline-block;line-height:30px;width:120px;text-align:center;}
.input_radio_label:before{position:absolute;display:inline-block;content:"";width:120px;height:30px;line-height:30px;vertical-align:bottom;z-index:-1;background:#ddd;}
.input_radio_label:after{position:absolute;display:inline-block;content:"";width:120px;height:30px;line-height:30px;text-align:center;opacity:0;}
.input_radio:checked + .input_radio_label:before{background:#67cece;}
.input_radio:checked + .input_radio_label:after{}
.input_radio:checked  + .input_radio_label + .input_span{color:#fff;}

.input_span_small{display:inline-block;line-height:24px;width:70px;text-align:center;font-size:12px;}
.input_radio_label_small:before{position:absolute;display:inline-block;content:"";width:70px;height:24px;line-height:24px;vertical-align:bottom;z-index:-1;background:#ddd;}
.input_radio_label_small:after{position:absolute;display:inline-block;content:"";width:70px;height:24px;line-height:24px;text-align:center;opacity:0;}
.input_radio:checked + .input_radio_label_small:before{background:#67cece;}
.input_radio:checked  + .input_radio_label_small + .input_span_small{color:#fff;}

.favicon_ico{position:relative;width:32px;height:32px;float:left;}
.template_ico_box{position:relative;margin-top:16px;float:left;overflow:hidden;margin-left:6px;}
.template_ico_updata{position:absolute;line-height:32px;text-align:center;width:100%;font-size:24px;color:rgba(0,0,0,.3);cursor: pointer;}
.template_ico_updata:hover{color:#fff;}

.template_img{position:relative;width:200px;height:120px;float:left;}
.template_img_box{position:relative;margin-top:16px;float:left;overflow:hidden;margin-left:6px;}
.template_img_updata{position:absolute;line-height:120px;text-align:center;width:100%;font-weight:bold;font-size:34px;color:rgba(0,0,0,.3);cursor: pointer;}
.template_img_updata:hover{color:#fff;}

/*-------------------------------------------------------*
/* user
/*-------------------------------------------------------*/

.content_title{padding:10px;border-bottom:1px solid #ccc;}
.box_input{margin:5px;padding:5px;}
.input_name{display:inline-block;padding:10px;min-width:80px;}
.input_text{border:1px solid #ccc;height:32px;padding-left:10px;outline:none;}
.input_desc{display:inline-block;padding:0px 10px;color:#aaa;font-size:14px;}
.textarea_text{}
.input_button{background:#34cece;padding:5px 10px;margin:10px;color:#fff;border:none;
}
.templatelistbox{width:calc(20% - 22px);height:120px;border:1px solid #34cece;margin:10px;display:inline-block;float:left;}
.template_create{text-align:center;line-height:120px;display:block;color:#34cece!important;font-size:26px;transition-duration:2s;text-decoration: none;}
.template_create:hover{background:rgba(52,206,206,.3);color:#fff;}
.template_data{text-align:center;line-height:120px;display:block;color:#f60!important;font-size:16px;overflow:hidden;transition-duration:2s;text-decoration: none;}
.inblock{display:inline-block;}