@import url('//umcdn.oss-cn-shanghai.aliyuncs.com/font-awesome/4.7.0/css/font-awesome.min.css');
@import url('../js/artdialog/ui-dialog.css');
@import url('../js/webuploader/webuploader.css');
@import url('form.css');
::-webkit-scrollbar {
width:8px;
height:8px;
}
::-webkit-scrollbar-thumb{border-radius:0;background:rgba(0,0,0,.2)}
::-webkit-scrollbar-thumb:window-inactive{background:rgba(0,0,0,.1)}
::-webkit-scrollbar-thumb:vertical:hover{background-color:rgba(0,0,0,.3)}
::-webkit-scrollbar-thumb:vertical:active{background-color:rgba(0,0,0,.7)}
/*comm*/
html, body { font: normal 12px Tahoma, Verdana, Arial, 'Microsoft YaHei', sans-serif; }
ul,li,ol,dt,dt,dd{ padding:0; margin:0; list-style:none;}
/*
select {
    border: solid 1px #ccc;
    border-radius: 2px;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    padding: 0 25px 0 0;
	size:1;
	height:32px; line-height:32px;
    background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;
}
select::-ms-expand { display: none;}
*/
a {color: #2a72c5;}
/*left-side*/
.left-side { width: 200px; position: absolute; top: 0; left: 0; background: #2b3541; }
.left-side::-webkit-scrollbar {display:none;width:2px;height:8px}
.sticky-left-side { position: fixed; height: 100%; overflow-y: auto; z-index: 100; }
.sticky-left-side .custom-nav { }
.left-side-collapsed .sticky-left-side { overflow-y: visible; }
.logo a { display: inline-block; height:50px; width:100%; background:#0baae4 url(../images/logo.png) no-repeat; }
.logo-icon { display: none; }
.left-side-collapsed .logo-icon { height: 45px; margin-top: -48px; display: block !important; }
.sticky-header .main-content { padding-top: 50px; }
.main-content { position:absolute; top:0; bottom:0; left:0; right:0; margin-left: 200px; background: #eff0f4; }
.header-section { background: #fff; }
.header-section::after { clear: both; display: block; content: ''; position:absolute;left:0;top:50px;width:100%;height:1px;background: #eff0f4;
}
.header-section { position: fixed; top: 0; left: 200px; width: 100%; height:50px; z-index: 100; }
.toggle-btn { width: 52px; height: 50px; font-size: 20px; padding: 15px; cursor: pointer; float: left; color: #212121; border-right: 1px solid #e7e7e7; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; }
.toggle-btn:hover { background: #65CEA7; color: #fff; border-right-color: #65CEA7; }
.wrapper { position: absolute; left:0; right:0; top:50px; bottom:0; }
.wrapper iframe { margin-top:-2px; border: none;}
/*nav*/
.custom-nav { margin-bottom: 10px; }
.custom-nav > li > a { color: #fff; padding: 12px 20px; border-radius: 0; -webkit-border-radius: 0; font-size:14px; }
.custom-nav > li > a:hover, .custom-nav > li > a:active ,.custom-nav > li > a:focus { background-color: transparent; color: #009FD9; border-radius: 0; -webkit-border-radius: 0; }
.custom-nav > li.menu-list > a { border-bottom:#2f3a47 solid 1px;}
.custom-nav > li.menu-list > a:hover { }
.custom-nav > li.nav-active > a {color: #009FD9; }
.custom-nav > li.nav-active > ul { display: block; }
.custom-nav > li.nav-active > a:hover { }
.custom-nav > li.active > a, .custom-nav > li.active > a:hover, .custom-nav > li.active > a:focus { background-color: #353f4f; color: #65cea7; }
.custom-nav > li.menu-list.active > a {}
.custom-nav > li.nav-active.active > a { }
.custom-nav > li.nav-active.active > a:hover { background-image: url(../images/minus.png); }
.custom-nav li .fa { font-size: 16px; vertical-align: middle; margin-right: 10px; width: 16px; text-align: center; }
.custom-nav .sub-menu-list { list-style: none; display: none; margin: 0; padding: 0; background: #35404d; }
.custom-nav .sub-menu-list > li { position: relative; }
.custom-nav .sub-menu-list > li > a { color: #fff; font-size: 12px; display: block; padding: 10px 5px 10px 50px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; }
.custom-nav .sub-menu-list > li > a:hover, .custom-nav .sub-menu-list > li > a:active, .custom-nav .sub-menu-list > li > a:focus { text-decoration: none; color: #fff; background: #009fd9; }
.custom-nav .sub-menu-list > li .fa { font-size: 12px; opacity: 0.5; margin-right: 5px; text-align: left; width: auto; vertical-align: baseline; }
.custom-nav .sub-menu-list > li.active > a { color: #fff; background-color: ##009fd9; }
.custom-nav .sub-menu-list ul { margin-left: 12px; border: 0; }
.custom-nav .sub-menu-list .quit-link { position:absolute; right:10px; top:30%; color:#fff;}
.custom-nav .menu-list.active ul { display: block; }
/*notification*/
.menu-right { float: right; margin-right: 255px; }
.notification-menu { list-style: none; }
.notification-menu > li { display: inline-block; float: left; position: relative; }
.notification-menu > li > a > i { margin-top: 6px; }
.notification-menu .dropdown-toggle { padding: 12px 10px; border-color: #fff; background: #fff; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; border: none; }
.notification-menu .dropdown-toggle:hover, .notification-menu .dropdown-toggle:focus, .notification-menu .dropdown-toggle:active, .notification-menu .dropdown-toggle.active, .notification-menu .open .dropdown-toggle.dropdown-toggle { background: #0baae4; color: #fff; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
.notification-menu .dropdown-toggle img { vertical-align: middle; margin-right: 5px; width: 26px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.notification-menu .dropdown-toggle .caret { margin-left: 5px; }
.notification-menu .dropdown-menu { border: 0; margin-top: 0px; -moz-border-radius: 2px 0 2px 2px; -webkit-border-radius: 2px 0 2px 2px; border-radius: 2px 0 2px 2px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; padding: 5px; }
.notification-menu .dropdown-menu:after { border-bottom: 6px solid #65cea7; border-left: 6px solid transparent; border-right: 6px solid transparent; content: ""; display: inline-block; right: 10px; position: absolute; top: -6px; }
.notification-menu .dropdown-menu li { display: block; margin: 0; float: none; background: none; padding: 15px; }
.notification-menu .dropdown-menu-usermenu li { padding: 0; }
.notification-menu .dropdown-menu li a { color: #fff; font-size: 13px; padding: 7px 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; }
.notification-menu .dropdown-menu li a:hover { background: #2a323f; color: #fff; }
.notification-menu .dropdown-menu li i { font-size: 11px; margin-right: 5px; }
.notification-menu .dropdown-menu-head { padding: 0; min-width: 300px; }
.notification-menu .info-number { padding: 12px 15px; height: 50px; font-size: 14px; background: #fff; color: #333; border-color: #fff; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; }
.notification-menu .dropdown-menu-usermenu { background: #2b3541; min-width: 200px; }
.notification-menu .dropdown-menu-head ul { border: 1px solid #ddd; border-top: 0; padding: 0; }
.notification-menu .dropdown-menu-head li a { color: #333; padding: 0; opacity: 1; }
.notification-menu .dropdown-menu-head li a:hover { background: none; color: #65cea7 !important; text-decoration: none; }
.notification-menu .btn-group { margin-bottom: 0; }

.mainnav_title{  margin-top:-12px; padding:10px 15px; border-bottom:#efefef solid 1px; background:#f8f8f8;}
.btn-tool-top{ display:inline-block;}
.btn-tool-top .btn{ float:left; margin-right:3px;}
.btn-tool-top .link-now-pos{ line-height:35px; border-left:#2a72c5 solid 2px; padding:0 10px 0 8px; color:#333;vertical-align: bottom;}
.search-bar,.search_table{ position:absolute; right:15px; top:10px;}
/* -----------------------
        DROPDOWN
--------------------------*/

.dropdown-menu-head { background: #fff }
.dropdown-menu-head .title { background: #65cea7; color: #fff; padding: 15px; text-transform: uppercase; font-size: 12px; margin: 0; }

/* -----------------------
        MAIN
--------------------------*/
.home-row-1{ height:248px;}
.home-row-1 .row-1-block{ float:left; width:32.5%; height:100%; margin-left:1.25%; background:#fff;}
.row-1-block:first-child{ margin-left:0;}

.home-panel-cent { font-size:14px;}
.home-panel-cent li{ height:53px;  line-height: 53px; padding:0 15px;}
.home-panel-cent li:first-child{ border-bottom: 1px solid #eee;}
.home-panel-cent li label{ color:#999; font-weight:normal;}

.home-panel-head{ height:140px; background:#91C363; color:#fff;}
.home-panel-head .user-avatar {height: 100%;line-height: 140px;width: 130px;vertical-align: middle;}
.home-panel-head .user-detail{  padding-top: 40px;}
.home-panel-head .user-title{font-size: 18px;}
.home-panel-head .user-login-info{ margin-top:20px;}

.home-healthy{ position:relative; background:#0baae4}
.home-healthy-title{ height:25px; position:absolute; left:20px; top:20px;}
.home-healthy-degree{ padding-top:25px;}
.home-healthy-degree i{ display:inline-block; width:100px; height:100px; line-height:100px; text-align:center; border:#fff solid 5px;border-radius:50%; font-size:16px; font-style:normal;box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);}
.healthy-level-1 i{ background:#0C0;}
.healthy-level-2 i{ background:#0C9;}
.healthy-level-3 i{ background:#09C;}
.healthy-level-4 i{ background:#F60;}
.healthy-level-5 i{ background:#f00;}
.home-healthy-cent b{ margin:0 3px; color:#f80; font-size:16px; line-height:1;}

.home-quick{ background:#f89672;}
.home-quick-btn{ padding-top:55px; text-align:center;}
.home-quick-cent li{ float:left; width:50%; padding:0; border:#f8f8f8 solid 1px !important; }
.home-quick-cent li a{ display:block; height:100%; padding-left:30px; background:#fff;}
.home-quick-cent li a:hover{ background:#0baae4; color:#fff;}
.btn-up-cache,.btn-up-cache:hover{ background:#fff; color:#05c63c;outline:none;}
.btn-exit-login,.btn-exit-login:hover{ background:#2b3541; color:#fff;outline:none;}

.home-row-2{ margin-top:20px; background:#fff;}
.home-row-3{ margin-top:20px;}
.home-row-3-left{ width:66.25%; }
.home-row-3-right {width: 32.25%;margin-left: 1.25%;}
.home-row-3-head{height:49px;border-bottom:1px solid #eee;padding-left:30px;padding-right:20px;background-color:#fafafa;line-height:48px;color:#606f80;font-size:16px}
.home-row-3-body{ padding:15px;background:#fff;}

.home-content-view{}
.home-content-view li{ height:58px; line-height:57px; border-bottom:#eee dashed 1px;}
.home-content-view li .last-up-date{ margin-left:50px; color:#999;}
.home-content-view li .content-count{ margin:0 3px; font-size:16px; line-height:1; color:#f80;}
.home-content-view li .content-item-name{ float:left;  padding-left:42px; background:url(../images/home_icon_page.png) no-repeat left center;}
.home-content-view li:nth-child(2) .content-item-name{ background-image:url(../images/home_icon_article.png)}
.home-content-view li:nth-child(3) .content-item-name{ background-image:url(../images/home_icon_product.png)}
.home-content-view li:nth-child(4) .content-item-name{ background-image:url(../images/home_icon_picture.png)}
.home-content-view li:last-child .content-item-name{ background-image:url(../images/home_icon_guestbook.png)}

.home-server-view li{ height:58px; line-height:57px; border-bottom:#eee dashed 1px;}


.mainbox{ position:relative;padding-bottom:55px; padding-top:12px;}
.toolbar-bottom-fix{ position:fixed; left:0; bottom:0; width:100%; height:45px; padding:5px 15px; background:#fafafa; border-top:#eee solid 1px; text-align:left;}
.toolbar-bottom-fix .btn{ float:left; margin-right:3px;}
.toolbar-offset-1{ padding-left:10% !important;}
.toolbar-offset-2{ padding-left:20% !important;}
.toolbar-bottom-fix .toolbar-text{ float:left; margin-right:5px; padding-top:6px;}

#pages{ position:fixed; right:10px; bottom:5px; margin-bottom:0 !important;}

/* -----------------------
        thumb
--------------------------*/
.box_thumb,#box_title{ position:relative;}
.thumb-content{ position:relative;}
.thumb-box{ position:absolute; top:5px; right:20px; text-align:center; background:#fff; border:#eee solid 1px;cursor: pointer;}
.thumb-box .thumb-box-title{ border-bottom:#eee solid 1px; line-height:26px;}
.thumb-box .thumb-box-pic{ background:#f8f8f8 url(../images/icon_thumb.png) no-repeat center center;}
.thumb-box img{ max-width:180px; min-width:150px; height:120px;}
.thumb-box .thumb-del{ position:absolute; left:0; bottom:0; width:100%; height:32px; line-height:32px; background:rgba(0,0,0,.6); color:#fff; font-size:14px; display:none;}
.thumb-box:hover .thumb-del{ display:block;}
.colorimg{ display:inline-block;border:#eee solid 1px; margin-right:10px; vertical-align:middle;width:16px;height:16px;line-height:normal;}
.colorimg img{ vertical-align:bottom;}
/*tit-tabs*/
.tit-tabs{ position: relative; height:32px; margin:10px 0 0 0; z-index:999;}
.tit-tabs ul{ position:absolute; padding:0;}
.tit-tabs li{ float:left; display:inline-block;  position:relative; margin-right:-1px;}
.tit-tabs li a{ display:block;height:33px; line-height:32px;padding: 0 25px; border:#eee solid 1px; color:#333;}
.tit-tabs li.on a{ border-bottom:#fff solid 1px; color:#2a72c5;}
/*upload-dialog*/
.upload-dialog{}
.ud-header{ padding:10px 0; border-bottom:#eee solid 1px;}
.ud-header .tips{ line-height:34px;}
.ud-content{ padding:10px 0;}
.ud-content li{ float:left; margin:0 10px 10px 0;}
.ud-content li .list-img-pick{ position:relative; display:block; border:#eee solid 1px; width:117px; overflow:hidden;}
.ud-content li .list-img-box{ width:117px; height:117px; position:relative; overflow:hidden;}
.ud-content li .list-img-box img{  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%,-50%);  -ms-transform: translate(-50%,-50%);  -webkit-transform: translate(-50%,-50%);  -o-transform: translate(-50%,-50%);  -moz-transform: translate(-50%,-50%);}
.ud-content li .list-img-title{ display:block; height:32px; line-height:32px; padding:0 9px;overflow: hidden; white-space: nowrap;text-overflow: ellipsis; text-decoration:none; color:#333;}

.ud-content li .selected_mask{ display:none; position:absolute; top:0; left:0; width:117px; height:117px; background:rgba(0,0,0,.6) url(../images/icon_card_selecte.png) no-repeat center center;}
.ud-content li.selected .selected_mask{ display:block;}

/*
.ud-content li .selected_mask{ display:none; position:absolute; right:0; bottom:0; width:0; height:0;border-bottom: 20px solid red; border-left:20px solid transparent;}
.ud-content li .selected_mask i{ margin-left:-12px; margin-top:7px;color:#fff;}
.ud-content li.selected a{ border-color:red;}
.ud-content li.selected .selected_mask{ display:block;}
*/

.ud-footer {position: absolute;  left: 0;  bottom: 0;  width: 100%;  padding: 15px 0;  background: #f8f8f8;  text-align: center;}
.upload-progress{ position:absolute; right:0; top:35px; width:200px; z-index:9981;}
/*上传进度显示*/
.progress-li{ position:relative;padding:10px 15px; margin-bottom:5px; border:#eee solid 1px; background:rgba(255,255,255,.8); text-align:left;}
.upload-progress .txt{ text-align:left; color:#333; font-size:12px;}
.upload-progress .bar{ position:relative; display:block;height:6px; margin-top:5px; background:#fafafa;}
.upload-progress .bar b{ position:absolute; left:0; top:0; display:block; width:0; height:6px; background:#093;}
.upload-progress .close{ position:absolute; right:0; top:0; display:inline-block; width:16px; height:16px; line-height:16px; font-size:13px; text-align:center; font-family:'宋体', sans-serif}

/*图组上传预览*/
.up-images-preview{ padding:10px 0;}
.images-item{ float:left; width:100px;margin:0 10px 10px 0; border:#eee solid 1px; position:relative;}
.images-item .images-item-box{width:100px; height:100px; position:relative; overflow:hidden;}
.images-item .images-item-box img{  position: absolute;  top: 50%;  left: 50%; height:100%;  transform: translate(-50%,-50%);  -ms-transform: translate(-50%,-50%);  -webkit-transform: translate(-50%,-50%);  -o-transform: translate(-50%,-50%);  -moz-transform: translate(-50%,-50%);}
.images-item .images-item-title{ display:block; height:26px; line-height:26px; padding:0 9px;overflow: hidden; white-space: nowrap;text-overflow: ellipsis; text-decoration:none; color:#333;}
.images-item .images-item-box .images-del{ position:absolute; left:0; bottom:0; width:100%; height:32px; line-height:32px; background:rgba(0,0,0,.6); color:#fff; font-size:14px; text-align:center; display:none;}
.images-item .images-item-box:hover .images-del{ display:block;}

.images-item-edit{ position:absolute; top:126px; left:-1px; width:210px; padding:5px; border:#eee solid 1px; background:#fff; display:none; z-index:990;}
.images-item-edit input{ width:100% !important; margin:0 0 5px 0;}
.images-item:hover .images-item-edit{ display:block;}

.btn-add-images{}
.btn-add-images .btn-add-images-icon{ width:100%; border-bottom:#eee solid 1px; background:#fff url(../images/icon_image-add.png) no-repeat center center;}
.btn-add-images a{ color:#333;}

.phone-template-box{position: relative; padding-left:520px  }
.iphone-box{ position: absolute; left: 0; top: 0}
.qrcode-box{ position: absolute; right: -75px; top: 120px; width: 90px;  padding: 10px; background: #fff; border: #eee solid 1px; text-align: center; }
.phone-template-info{ padding-top: 70px;}
.current-temp-info{ margin-bottom:10px; border: 1px solid #eee; font-size:14px;}
.current-temp-info__head{padding:8px 10px; background:#fafafa; border-bottom: 1px solid #eee;}
.current-temp-info__body{ padding: 10px 15px}
.current-temp-info li{ line-height:26px;}
.current-temp-info li label{ display:inline-block; width:70px; color:#666; font-weight:normal;}



.um-temp-list{ margin-top:10px;border: 1px solid #eee; display:none;}
.um-temp-head{ height:49px; line-height:49px; padding:0 10px; background:#fafafa; border-bottom: 1px solid #eee;}
.um-temp-cont{ padding:10px 0;}
.um-temp-cont li{ float:left; width:45px; margin: 0 0 8px 8px;cursor: pointer;}
.um-temp-cont li .img{ height:5px;overflow:hidden;}
.um-temp-cont li .img img{-webkit-filter: blur(2px);filter: blur(2px);}
.um-temp-cont li .tool{ line-height:45px; border: #ddd solid 1px; text-align: center; }

.btn-choose{   border:#0baae4 solid 1px;text-decoration: none;}
.btn-choose:hover{ background:#0baae4; border-color:#06C; color:#fff;}

.um-temp-cont li:hover .img img{-webkit-filter: none;filter: none;}
.um-temp-cont li:hover .tool{ background: #5cb85c; border: #4cae4c solid 1px; color: #fff;}

/* iPhone */
.iphone{box-shadow:inset 0 0 3px 0 rgba(0,0,0,0.2), 0 0 0 1px #999, 0 0 10px 0 rgba(0,0,0,0.7);border:5px solid #d9dbdc;background:#f8f8f8;border-radius:50px;height:877px;width:423px;position:relative;-webkit-transform:scale(0.8);transform:scale(0.8);-webkit-transform-origin: 50% 0 0;transform-origin: 50% 0 0; margin:30px auto;padding:15px;}
.iphone-top{position:relative;padding:5px 110px 40px;}
.iphone-top .speaker{display:block;width:70px;height:6px;border-radius:6px;background:#292728;margin:0 auto;}
.iphone-top .camera{display:block;height:10px;width:10px;border-radius:50%;background:#333;margin:0 auto 13px;}
.iphone-top .sensor{display:block;width:15px;height:15px;float:left;background:#333;margin-top:-5px;border-radius:50%;}
.top-bar,.bottom-bar{display:block;width:423px;height:15px;border-left:5px solid #BBB;border-right:5px solid #BBB;position:absolute;left:-5px;}
.top-bar{top:65px;}
.bottom-bar{bottom:65px;}
.iphone-screen{background:#eee;height:677px;width:375px;border:2px solid rgba(0,0,0,0.9);border-radius:3px;overflow:hidden;margin:0 auto;}
.iphone-screen img{width:100%;}
.buttons .on-off,.buttons .up,.buttons .down,.buttons .sleep{display:block;background:#CCC;position:absolute;border-radius:2px 0 0 2px;}
.buttons .on-off{height:40px;width:3px;top:100px;left:-8px;}
.buttons .up,.buttons .down,.buttons .sleep{height:60px;width:5px;left:-10px;}
.buttons .up{top:170px;}
.buttons .down{top:250px;}
.buttons .sleep{left:auto;right:-10px;top:170px;border-radius:0 2px 2px 0;}
.iphone-bottom{padding:10px 0 0;}
.iphone-bottom span{display:block;width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,#3032330%,#b5b7b950%,#f0f2f269%,#303233100%);position:relative;margin:0 auto;}
.iphone-bottom span:after{content:"";display:block;width:60px;height:60px;background:#fff;border-radius:50%;position:absolute;left:4px;top:4px;}

.um-cloud-tag{ width: 600px;}
.um-cloud-tag a{ display: inline-block; padding: 5px 8px; border: #eee solid 1px; margin: 2px;line-height: 1em;border-radius: 10px;text-decoration: none;}
.um-cloud-tag a:hover{background: #2a72c5;color: #fff;border-color: #2a72c5;}

.table-list-img{display: inline-block; width: 50px; height: 50px;}
.table-list-img>img{width: 100%; height: 100%;object-fit: cover;}