/*重写样式*/
.statistic-item .item-title span{font-size: 22px;}

.statistic-item .item-type{margin-bottom: 5%;}

/*自定义样式*/
.zf_widget {
    background: #FDFDFD;
    border-top: 1px solid #EDEDED;
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

/*首页的数字显示*/
.zf_item_1 {
    width: calc(50% - 13px);
    width: -webkit-calc(50% - 13px);
    width: -moz-calc(50% - 13px);
    width: -ms-calc(50% - 13px);
    margin-left: 26px;
    float: left;
}

.zf_item_1:nth-child(2n-1) {
    margin-left: 0;
}

/*首页的相册列表*/
.zf_item_2 {
	display: inline-block;
	width: calc(20% - 12px);
	margin-left: 15px;
	border: 1px solid #EFEFEF;
	background-color: #ffffff;
	padding: 15px;
}

.zf_item_2 .img_box{height: 70%;position: relative;}
.zf_item_2 .img_box img{
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
}

.zf_item_2 .img_box .img_tip{background-color: rgba(0,0,0,0.7);color: #fff;padding: 0 10px;border-radius: 4px;position: absolute;right: 10px;bottom: 10px;font-size: 14px;}

.zf_item_2 .info_box{margin-top: 5%;}

.zf_item_2 .info_box .edit{
	display: block;
	height: 21px;
	width: 21px;
	text-align: center;
	line-height: 19px;
	cursor: pointer;
	border-radius: 4px;
	border: 1px solid transparent;
	transition: all 0.5s ease-out;
}
.zf_item_2 .info_box .edit:hover{background-color: #fefefe;border: 1px solid #d5d5d5;}

.zf_item_2:nth-child(5n-4){
	margin-left: 0;
}

/*相册详情中图集的图片列表*/
.zf_item_3{
	width: calc(10% - 5px);
	width: -webkit-calc(10% - 4.5px);
	width: -moz-calc(10% - 4.5px);
	width: -ms-calc(10% - 4.5px);
	width: -o-calc(10% - 4.5px);
	margin-left: 5px;
}
.zf_item_3:nth-child(10n-9){margin-left: 0;}

/*上传图片列表中的图片列表*/
.zf_item_4{
	width: calc(20% - 12px);
	width: -webkit-calc(20% - 12px);
	width: -moz-calc(20% - 12px);
	width: -ms-calc(20% - 12px);
	width: -o-calc(20% - 12px);
	margin-left: 15px;
	border: 1px solid #E3E3E3;
	transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	cursor: pointer;
}
.zf_item_4:nth-child(5n-4){margin-left: 0;}
.zf_item_4.active{border-color: #C0E0EF;background-color: #E6F3FC;}
.zf_item_4:hover{border-color: #C0E0EF;background-color: #E6F3FC;}

.zf_item_4 .size_content{overflow: hidden;}
.zf_item_4 .size_content .up{
	position: absolute;
	top: 0;
	width: 100%;
	left: 0;
	z-index: 1;
}
.zf_item_4 .size_content .up button{width: 30px;height: 30px;color: #fff;position: relative;}
.zf_item_4 .size_content .up button.delete{
	border-radius: 0 0 100% 0;
	visibility: hidden;
	transition: all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	visibility: hidden;
	opacity: 0;
}
.zf_item_4:hover .size_content .up button.delete{
	visibility: visible;
	opacity: 1;
}
.zf_item_4 .size_content .up button.delete i{
    left: 4px;
    display: block;
    position: absolute;
    top: 2px;
}
.zf_item_4 .size_content .up button.edit{border-radius: 0 0 0 100%;}
.zf_item_4 .size_content .up button.edit i{
	left: 11px;
    display: block;
    position: absolute;
    top: 2px;
}
.zf_item_4 .size_content .middle{
	position: relative;
	height: calc(100% - 22px);
	height: -webkit-calc(100% - 22px);
	height: -moz-calc(100% - 22px);
	height: -ms-calc(100% - 22px);
	height: -o-calc(100% - 22px);
	/*height: 100%;*/
}
.zf_item_4 .size_content .middle img{
	position: absolute;
	max-width: 100%;
	max-height: 100%;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
}
.zf_item_4 .size_content .down{height: 22px;text-align: center;position: absolute;bottom: 0;left: 0;width: 100%;z-index: 1;}

.zf_item_4 .size_content .selector{
	visibility: hidden;
	opacity: 0;
	width: 20px;
	height: 20px;
	position: absolute;
	right: 8px;
	bottom: 7px;
	z-index: 5;
	/*left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);*/
}
.zf_item_4.active .size_content .selector{visibility: visible;opacity: 1;}
.zf_item_4 .size_content .selector i{font-size: 25px;color: #186CF0;font-size: 19px;}

.zf_item_4 .size_content .selector1{
	min-width: 20px;
	height: 20px;
	position: absolute;
	right: 2px;
	bottom: 4px;
	z-index: 5;
	border-radius: 20px;
	background-color: #186AF1;
	color: #fff;
	line-height: 20px;
	text-align: center;
	/*left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);*/
}

.zf_item_4 .zf_item_4_shadow{background-color: rgba(0,0,0,0.7);z-index: 10;}
.zf_item_4 .zf_item_4_shadow .little_progress{height: 15px;border: 1px solid #fff;width: 80%;}
.zf_item_4 .zf_item_4_shadow .little_progress span{
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	background-color: #fff;
	transition: all linear 0.8s;
	-webkit-transition: all linear 0.8s;
	-moz-transition: all linear 0.8s;
	-ms-transition: all linear 0.8s;
	-o-transition: all linear 0.8s;
}

/*相册上的遮罩*/
.inner_box_shadow{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.7);}
.inner_box_shadow .shadow_close{position: absolute;right: 10px;top: 10px;font-size: 26px;color: #fff;} 
.inner_box_shadow .adit_area {margin-top: 30%;}

.middle_line_part{
    padding: 15px;
    border: 1px solid #F0F0F0;
    background-color: #FDFDFD;
}

.middle_line_part_title{float: left;margin-top: 4px;}

.btn_add{
    background-color: #FDFDFD;
    border: 1px solid #C7C7C7;
    color: #666666;
    padding: 3px 15px;
}

.btn_add span{color: #A4ABB5;font-size: 15px;}
.btn_ok{background-color: #186AF1;color: #ffffff;padding-left: 20px;padding-right: 20px;}
.btn_ok:hover{background-color: #3E87FF;color: #fff;}
.btn_ok:focus,.btn_ok:active{color: #fff;}
.btn_cancel{padding-left: 20px;padding-right: 20px;}
.btn_edit{padding: 3px 25px;}
.btn_gray{background-color: #696969;color: #fff;}
.btn_gray:hover{background-color: #696969;color: #fff;}
.btn_blue{background-color: #186AF1;color: #fff;}
.btn_blue:hover{background-color: #696969;color: #fff;}

.under_line_title span{
	padding-bottom: 7px;
    display: inline-block;
    border-bottom: 2px solid #186AF1;
    text-align: center;
    padding-left: 3px;
}

.common_border{border: 1px solid #E3E3E3;}
.border_blue{border: 1px solid #186AF1;}
.bg_color_blue{background-color: #186AF1;}
.upload_area{
	width: 100%;
	height: 95px;
	position: relative;
	z-index: 5;
	margin-top: 21%;
}
.upload_area button#start_upload{width: 100%;height: 100%;color: #fff;background-color: #186AF1;font-size: 20px;}
.upload_area button#start_upload.disabled{background-color: #A0A0A0;}
.upload_area button#start_upload i{font-size: 40px;color: #fff;vertical-align: middle;}

.upload_area .total_progress_area .left_total_progress_part{
	height: 100%;
	width: 80%;
	border-top: 6px solid #186AF1;
	position: relative;
	padding: 15px;
}
.upload_area .total_progress_area .left_total_progress_part .progress{
	margin-bottom: 0;
	height: 42px;
}

.upload_area .total_progress_area .left_total_progress_part .progress .progress-bar span{
	line-height: 40px;
}

.upload_area .total_progress_area .right_btn_part{
	height: 100%;
	width: 20%;
	position: relative;
}

.upload_area .total_progress_area .right_btn_part button{
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: #186AF1;
	font-size: 17px;
	color: #fff;
	cursor: pointer;
}

.webuploader-container .webuploader-pick{
	text-align: center;
	position: absolute;
	width: 100%;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
}

.head_lind{height: 6px;background-color: #186AF1;}
.head_lind1{height: 10px;background-color: #186AF1;}

/*图集详情*/
.delete_image_btn_area{position: relative;width: 100%;background-color: #186AF1;overflow: hidden;}
.delete_image_btn_area button{background-color: #3782FF;color: #fff;}
.delete_image_btn_area button:hover{color: #fff;}

/*图片详情弹出框*/
.img_detail_dialog{
	width: calc(100% - 70px);
	width: -webkit-calc(100% - 70px);
	width: -moz-calc(100% - 70px);
	width: -ms-calc(100% - 70px);
	width: -o-calc(100% - 70px);
	height: calc(100% - 70px);
	height: -webkit-calc(100% - 70px);
	height: -moz-calc(100% - 70px);
	height: -ms-calc(100% - 70px);
	height: -o-calc(100% - 70px);
}

.img_detail_dialog .img_detail_dialog_close{
	position: absolute;
	right: -17px;
	top: -17px;
	background-color: #fff;
	border-radius: 50%;
	z-index: 10;
}

/*右边区域*/
.img_detail_dialog .right_imgInfo_part{
	width: 350px;
	height: 100%;
    overflow: auto;
}

.right_imgInfo_part .line_1{padding-bottom: 20px;border-bottom: 1px solid #D7D7D7;}

.right_imgInfo_part .line_1 img{width: 60px;height: 60px;border-radius: 50%;}
.right_imgInfo_part .line_1>div{
	font-size: 16px;
	margin-left: 10px;
	width: 220px;
}
.right_imgInfo_part .little_title{
	width: 100%;
	padding: 5px 10px;
	border: 1px solid #EDEDED;
	background-color: #FAFAFA;
	font-size: 15px;
	text-align: left;
}

/*左边区域*/
.img_detail_dialog .left_imgPrew_part{
	width: calc(100% - 350px);
	height: 100%;
	background-color: #333333;
}

.img_detail_dialog .left_imgPrew_part .big_view_part{
	width: 100%;
	height: calc(100% - 145px);
	height: -webkit-calc(100% - 145px);
	height: -moz-calc(100% - 145px);
	height: -ms-calc(100% - 145px);
	height: -o-calc(100% - 145px);
}

.img_detail_dialog .left_imgPrew_part .middle_btns_part{
	width: 100%;
	height: 35px;
	background-color: #3F3F3F;
}

.middle_btns_part p{color: #fff;line-height: 35px;margin-left: 50px}

.middle_btns_part button{
	line-height: 32px;
	color: #fff;
	background-color: #3F3F3F;
	padding: 0 15px;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}
.middle_btns_part button:hover{background-color: #626262;}

.img_detail_dialog .left_imgPrew_part .preview_img_part{
	width: 100%;
	height: 110px;
	background-color: #0A0A0A;
	padding: 10px;
}

.preview_img_part .left_arrow_area{
	float: left;
	height: 100%;
	width: 30px;
	cursor: pointer;
	color: #fff;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}

.preview_img_part .left_arrow_area:hover{
	background-color: rgba(255,255,255,0.2);
}

.preview_img_part .left_arrow_area:after{
	content: '';
	width: 0;
	height: 100%;
	vertical-align: middle;
	text-align: center;
	display: inline-block;
}

.preview_img_part .right_arrow_area{
	float: left;
	height: 100%;
	width: 30px;
	cursor: pointer;
	color: #fff;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}

.preview_img_part .right_arrow_area:hover{
	background-color: rgba(255,255,255,0.2);
}

.preview_img_part .right_arrow_area:after{
	content: '';
	width: 0;
	height: 100%;
	vertical-align: middle;
	text-align: center;
	display: inline-block;
}

.preview_img_part .preview_img_list{
	float: left;
	height: 100%;
	width: calc(100% - 80px);
	margin: 0 10px;
}

.preview_img_list .swiper-slide{width: auto;font-size: 0;line-height: 1;text-align: left;}

.preview_img_list .preview_img_item{
	cursor: pointer;
	opacity: 0.6;
	width: 90px;
	height: 90px;
	display: inline-block;
	margin-right: 10px;
	position: relative;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}
.preview_img_list .preview_img_item:hover{opacity: 1;}
.preview_img_list .preview_img_item.active{border: 5px solid #fff;opacity: 1;}
.preview_img_list .preview_img_item:nth-last-child(1){margin-right: 0;}

.preview_img_list .preview_img_item img{position: absolute;display: block;width: 100%;height: 100%;left: 0;top: 0;}

.left_imgPrew_part .big_view_part{position: relative;}
.left_imgPrew_part .big_view_part .arrow_part{
	width: 120px;
	height: 200px;
	font-size: 0;
	background-color: transparent;
	cursor: pointer;
	z-index: 10;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}
.left_imgPrew_part .big_view_part .arrow_part:hover{
	background-color: rgba(0,0,0,0.4);breadcrumb
}
.left_imgPrew_part .big_view_part .arrow_part i{font-size: 40px;color: #fff;}
.left_imgPrew_part .big_view_part .arrow_part:after{
	content: '';
	width: 0;
	height: 100%;
	vertical-align: middle;
	text-align: center;
	display: inline-block;
}


.left_imgPrew_part .big_view_part .arrow_part.left_arrow{
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -100px;
}

.left_imgPrew_part .big_view_part .arrow_part.right_arrow{
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -100px;
}

.left_imgPrew_part .big_view_part .img_detail_swiper img{
	position: absolute;
	max-width: 100%;
	max-height: 100%;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
}

/*uploader*/
#btn_img_picker div:nth-child(2),#btn_img_picker div:nth-child(2) label{
	opacity: 0;
	position: absolute;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	z-index: 5px;
}

/* baidu 图片效果CSS开始 */
.imgList_container:before,  .imgList_container:after { content: ""; display: table; }
.imgList_container:after { clear: both; }
.imgList_item {
	float: left;
	margin-bottom: 5px;
	position: relative;
	cursor: pointer;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}
.imgList_item:hover{
	z-index: 100;
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	box-shadow: 0 0 15px 0 rgba(0,0,0,0.7);
}
.imgList_item img { max-width: 100%; max-height: 100%; height: 200px; vertical-align: bottom; }
.imgList_item.active .selector_box{visibility:visible;opacity: 1;}
.imgList_item .selector_box{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border: 8px solid #186AF1;
	opacity: 0;
	visibility: hidden;
	transition: all linear 0.3s;
	-webkit-transition: all linear 0.3s;
	-moz-transition: all linear 0.3s;
	-ms-transition: all linear 0.3s;
	-o-transition: all linear 0.3s;
}
.imgList_item .selector_box i{
	display: block;
	width: 30px;
	height: 30px;
	position: absolute;
	right: -8px;
	bottom: -8px;
	line-height: 30px;
	text-align: center;
	color: #fff;
	background-color: #186AF1; 
}
.first-item { clear: both; }
.last-row, .last-row ~ .imgList_item { margin-bottom: 0px; }

/* 效果CSS结束 


/*搜索结果页面*/
.search_area input{
	height: 45px;
	border: 2px solid #186AF1;
	width: 60%;
	padding: 0 15px;
}
.search_area button{
	height: 45px;
	background-color: #186AF1;
	padding: 0 60px;
	color: #fff;
	font-size: 18px;
}

.search_tip_area .tip_item{padding: 2px 10px;color: #5D5D5D;cursor: pointer;}
.search_tip_area .tip_item.active{
	background-color: #186AF1;
	color: #fff;
	border-radius: 4px;
}
.search_tip_area .tip_item:hover{
	background-color: #186AF1;
	color: #fff;
	border-radius: 4px;
}

/*重写popover样式*/
.webui-popover-title{background-color: #186AF1;color: #fff;}
.webui-popover{
	padding: 0;
	border: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.webui-popover.bottom > .arrow, .webui-popover.bottom-right > .arrow, .webui-popover.bottom-left > .arrow{border-bottom-color: #186AF1;}
.webui-popover.bottom > .arrow:after, .webui-popover.bottom-right > .arrow:after, .webui-popover.bottom-left > .arrow:after{border-bottom-color: #186AF1;}
/*.btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle:hover, .open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle.focus{
	color: #fff;
	background-color: transparent;
	border-color: #c29100;
}*/

.breadcrumb{
	display: inline-block;
	margin-top: 7px;
	padding-left: 33px;
}
.breadcrumb:before{content:"";background:url("../img/plugins/breadcrumb/breadcrumb_icon.png"); width:17px;height:14px;    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;}