Merge branch 'master' of http://192.168.0.115:3000/chenzhiguang/301hospital

backstage/src/assets/styles/public.less

@@ -313,12 +313,16 @@ input::-webkit-inner-spin-button{
     margin-right: 4px;
   }
 }
-.el-input__inner{
-  padding: 0 50px 0 15px!important;
+.paddingmore  .el-input__inner {
+  padding: 0 60px 0 15px!important;
 }
 
-.el-input-number .el-input__inner{
-  padding: 15px!important;
+
+
+
+.el-textarea__inner{
+  padding: 5px 55px 5px 15px!important;
+  
 }
 @media screen and (max-width: 1700px) {
   html,body{

backstage/src/components/editcomponent/editcon.vue

@@ -11,7 +11,7 @@
     <el-footer class="footer">
       <template>
         <el-button @click="$emit('cancel')">取消</el-button>
-        <el-button type="primary" @click="$emit('save')">保存</el-button>
+        <el-button type="primary" @click="emitsave">保存</el-button>
       </template>
     
     </el-footer>
@@ -23,7 +23,8 @@ export default {
   props:['form','rule',"type",'justshow','status'],
   data(){
     return {
-      isAudit:this.$route.query.isAudit
+      isAudit:this.$route.query.isAudit,
+      lock:false
     }
   },
   computed:{
@@ -45,7 +46,20 @@ export default {
       return flag ?flag: this.statusStr[sta]
     }
 
-  }
+  },
+  methods: {
+    emitsave(){
+      if (!this.lock) {
+        this.lock = true
+        setTimeout(() => {
+          this.lock = false
+        }, 3000);
+        console.log(111111);
+        this.$emit('save')
+        
+      }
+    }
+  },
 }
 </script>
 

backstage/src/components/editcomponent/passworddialog.vue

@@ -0,0 +1,89 @@
+<template>
+  <el-dialog
+    title="修改密码"
+    width="50%"
+    @close="$emit('close')"
+    :visible="show"
+  >
+    <el-form :model="form" ref="passedit" :rules="rule" :label-width="formLabelWidth">
+      <div class="formcon">
+          <el-form-item label="旧密码：" prop="oldPassword">
+            <el-input :maxlength="INPUTLENGTH" show-word-limit  v-model="form.oldPassword"></el-input>
+          </el-form-item>
+          <el-form-item label="新密码：" prop="newPassword">
+            <el-input :maxlength="INPUTLENGTH" show-word-limit  v-model="form.newPassword"></el-input>
+          </el-form-item>
+          <el-form-item label="确认密码：" prop="confirmPassword">
+            <el-input :maxlength="INPUTLENGTH" show-word-limit  v-model="form.confirmPassword"></el-input>
+          </el-form-item>
+      </div>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="$emit('close')">取 消</el-button>
+      <el-button type="primary" @click="audit">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import {updatePwd} from "@/configue/api";
+import { encodeStr } from '@/util'
+import { Base64 } from 'js-base64'
+let rule = {
+
+  oldPassword: [{ required: true, message: "请输入旧密码", trigger: "blur" }],
+  newPassword: [{ required: true, message: "请输入新密码", trigger: "blur" }],
+  confirmPassword: [{ required: true, message: "请输入新密码", trigger: "blur" }]
+
+};
+
+export default {
+  props: {
+    id: {
+      type: String || Number,
+    },
+    show: {
+      type: Boolean,
+    },
+    form: Object
+  },
+  data() {
+    return {
+      formLabelWidth: "120px",
+      rule
+    };
+  },
+  methods: {
+    audit() {
+      this.$refs.passedit.validate(async (valid)=>{
+        if (valid) {
+          if (this.form.confirmPassword != this.form.newPassword) {
+            return this.$alert('两次密码不一致', '提示')
+          }
+
+          let params = {
+            newPassword: encodeStr(Base64.encode(this.form.newPassword)),
+            oldPassword: encodeStr(Base64.encode(this.form.oldPassword)),
+          }
+          updatePwd(params,()=>{
+          this.$alert('编辑成功', '提示', {
+              confirmButtonText: '确定',
+              callback: () => {
+                this.$emit('logout')
+              }
+            })
+        })
+        }
+      })
+      
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.formcon {
+  width: 100%;
+  padding: 0 20px;
+}
+</style>

backstage/src/components/editcomponent/usereditdialog.vue

@@ -5,37 +5,73 @@
     @close="$emit('close')"
     :visible="show"
   >
-    <el-form :model="form" ref="useredit" :rules="rule" :label-width="formLabelWidth">
+    <el-form
+      :model="form"
+      ref="useredit"
+      :rules="rule"
+      :label-width="formLabelWidth"
+    >
       <div class="formcon">
         <div class="formtop">
           <div class="left">
             <el-form-item label="身份码：" prop="userName">
-              <el-input :disabled="true" :maxlength="INPUTLENGTH" v-model="form.userName"></el-input>
+              <el-input
+                :disabled="true"
+                show-word-limit
+                :maxlength="INPUTLENGTH"
+                v-model="form.userName"
+              ></el-input>
             </el-form-item>
 
             <el-form-item label="用户昵称：" prop="nickName">
-              <el-input :maxlength="INPUTLENGTH" v-model="form.nickName"></el-input>
+              <el-input
+                :maxlength="INPUTLENGTH"
+                show-word-limit
+                v-model="form.nickName"
+              ></el-input>
             </el-form-item>
 
             <el-form-item label="单位名称：" prop="unit">
-              <el-input :disabled="true" :maxlength="INPUTLENGTH*5" v-model="form.unit"></el-input>
+              <el-input
+                :disabled="true"
+                :maxlength="INPUTLENGTH * 5"
+                v-model="form.unit"
+              ></el-input>
             </el-form-item>
 
             <el-form-item label="联系电话：" prop="phone">
-              <el-input :maxlength="INPUTLENGTH" v-model="form.phone"></el-input>
+              <el-input
+                :maxlength="INPUTLENGTH"
+                show-word-limit
+                v-model="form.phone"
+              ></el-input>
             </el-form-item>
           </div>
           <div class="right">
             <el-form-item label="用户角色：" prop="roleName">
-              <el-input :disabled="true" :maxlength="INPUTLENGTH" v-model="form.roleName"></el-input>
+              <el-input
+                :disabled="true"
+                :maxlength="INPUTLENGTH"
+                show-word-limit
+                v-model="form.roleName"
+              ></el-input>
             </el-form-item>
 
             <el-form-item label="真实姓名：" prop="realName">
-              <el-input :disabled="true" :maxlength="INPUTLENGTH" v-model="form.realName"></el-input>
+              <el-input
+                :disabled="true"
+                :maxlength="INPUTLENGTH"
+                show-word-limit
+                v-model="form.realName"
+              ></el-input>
             </el-form-item>
 
             <el-form-item label="通讯地址：" prop="address">
-              <el-input v-model="form.address" :maxlength="INPUTLENGTH*5"></el-input>
+              <el-input
+                v-model="form.address"
+                show-word-limit
+                :maxlength="INPUTLENGTH * 5"
+              ></el-input>
             </el-form-item>
 
             <el-form-item label="性别：" prop="sex">
@@ -46,23 +82,6 @@
             </el-form-item>
           </div>
         </div>
-
-        <div class="formbom">
-          <div class="left">
-            <el-form-item label="旧密码：" prop="oldPassword">
-              <el-input :maxlength="INPUTLENGTH" v-model="form.oldPassword"></el-input>
-            </el-form-item>
-            <el-form-item label="新密码：" prop="newPassword">
-              <el-input :maxlength="INPUTLENGTH" v-model="form.newPassword"></el-input>
-            </el-form-item>
-          </div>
-
-          <div class="right">
-            <el-form-item label="确认密码：" prop="confirmPassword">
-              <el-input :maxlength="INPUTLENGTH" v-model="form.confirmPassword"></el-input>
-            </el-form-item>
-          </div>
-        </div>
       </div>
     </el-form>
     <div slot="footer" class="dialog-footer">
@@ -73,7 +92,7 @@
 </template>
 
 <script>
-import {saveSys} from "@/configue/api";
+import { saveSys } from "@/configue/api";
 
 let rule = {
   userName: [{ required: true, message: "请输入身份码", trigger: "blur" }],
@@ -81,10 +100,6 @@ let rule = {
   unit: [{ required: true, message: "请输入单位名称", trigger: "blur" }],
   roleId: [{ required: true, message: "请选择用户角色", trigger: "change" }],
   realName: [{ required: true, message: "请输入真实姓名", trigger: "blur" }],
-  oldPassword: [{ required: true, message: "请输入旧密码", trigger: "blur" }],
-  newPassword: [{ required: true, message: "请输入新密码", trigger: "blur" }],
-  confirmPassword: [{ required: true, message: "请输入新密码", trigger: "blur" }]
-
 };
 
 export default {
@@ -95,44 +110,39 @@ export default {
     show: {
       type: Boolean,
     },
-    form: Object
+    form: Object,
   },
   data() {
     return {
       formLabelWidth: "120px",
-      rule
+      rule,
     };
   },
   methods: {
     audit() {
-      this.$refs.useredit.validate(async (valid)=>{
+      this.$refs.useredit.validate(async (valid) => {
         if (valid) {
-          if (this.form.confirmPassword != this.form.newPassword) {
-            return this.$alert('两次密码不一致', '提示')
-          }
-
           let params = {
-            "address": "",
-            "nickName": "",
-            "phone": "",
-            "realName": "",
-            "roleName": "",
-            "sex": 0,
-            "unit": "",
-            "userName": "",
+            address: "",
+            nickName: "",
+            phone: "",
+            realName: "",
+            roleName: "",
+            sex: 0,
+            unit: "",
+            userName: "",
             ...this.form,
-          }
-          saveSys('user',params,()=>{
-          this.$alert('编辑成功', '提示', {
-              confirmButtonText: '确定',
+          };
+          saveSys("user", params, () => {
+            this.$alert("编辑成功", "提示", {
+              confirmButtonText: "确定",
               callback: () => {
-                this.$emit('logout')
-              }
-            })
-        })
+                this.$emit("logout");
+              },
+            });
+          });
         }
-      })
-      
+      });
     },
   },
 };
@@ -151,14 +161,14 @@ export default {
       &:first-of-type {
         margin-right: 2%;
       }
-      >div{
+      > div {
         display: flex;
-        >div{
+        > div {
           flex: 1;
         }
-        & /deep/ .el-form-item__content{
+        & /deep/ .el-form-item__content {
           flex: 2;
-          margin-left: 0!important;
+          margin-left: 0 !important;
         }
       }
     }

backstage/src/components/table/index.vue

@@ -28,9 +28,7 @@
         <template v-else-if="item.prop === 'display' ">
           <span v-if="!activeSub['是否显示']">-</span>
           <template v-else>
-             <span v-if="!isNull(scope.row.status)&&scope.row.status!=3">-</span>
             <el-switch
-              v-else
               @change="(e)=>{handleSwitch(e,scope.row)}"
               v-model="scope.row[item.prop]">
             </el-switch>
@@ -39,12 +37,16 @@
         </template>
 
         <template v-else-if="item.prop === 'isEnabled'">
-          <span v-if="scope.row.roleKey&&($route.name=='role'||$route.name=='user')">-</span>
+          <span v-if="!activeSub['是否启用']">-</span>
+            
+         <template v-else>
+           <span v-if="scope.row.roleKey&&scope.row.roleKey!='sys_visitor'&&($route.name=='role'||$route.name=='user')">-</span>
             <el-switch
             @change="(e)=>{handleDisableSwitch(e,scope.row)}"
             v-else
             v-model="scope.row[item.prop]">
           </el-switch>
+         </template>
         </template>
         
 
@@ -52,11 +54,18 @@
             v-else-if="item.prop === 'record'">
             <slot :data="scope.row" name="record"></slot>
           </template>
-          <span v-else-if="item.prop === 'status'">{{ statusStr[scope.row[item.prop]] || "-" }}</span>
 
           <template v-else-if="item.canEdit">
               <slot :name="item.prop" :data="scope.row"></slot>
           </template>
+
+
+          <template v-else-if="item.prop=='roleName'">
+            <template v-if="scope.row[item.prop] == '游客'">
+              <span>-</span>
+            </template>
+            <span v-else>{{ scope.row[item.prop] || item.default || '-' }}</span>
+          </template>
           
           <span v-else>{{ scope.row[item.prop] || item.default || '-' }}</span>
         </template>

backstage/src/components/uploadThumb/index.vue

@@ -12,7 +12,7 @@
     >
     <template v-if="thumb" >
       <img :src="thumb" class="avatar" />
-      <div class="del" @click.stop="thumb=''">
+      <div class="del" @click.stop="thumb='',$emit('update','')">
         <i class="el-icon-delete"></i>
       </div>
     </template>

backstage/src/configue/api.js

@@ -274,6 +274,19 @@ export function delSysSingle(type, data, cb) {
   });
 }
 
+
+//修改密码
+export function updatePwd(data, cb) {
+  axios({
+    method: "post",
+    data,
+    url: `sys/user/updatePwd`,
+  }).then((res) => {
+    cb(res);
+  });
+}
+
+
 //重置密码
 export function resetPass(data, cb) {
   axios({

backstage/src/mixins/index.js

@@ -77,7 +77,7 @@ Vue.prototype.sysRole = [
     id: "sys_normal",
   },
   {
-    name: "游客",
+    name: "-",
     id: "sys_visitor",
   },
 ];
@@ -303,7 +303,7 @@ Vue.mixin({
 
       let auth = {};
 
-      if (key == "场景" || key == '专家' || key=='沙盘') {
+      if (key == "场景" || key == '专家' || key=='沙盘' || key=='用户' || key=='角色' || key=='日志') {
 
         menu.children && menu.children.forEach((item) => {
           auth[item.name] = item.authority;

backstage/src/pages/content/collection/componets/img.vue

@@ -1,7 +1,11 @@
 <template>
   <div>
     <el-form-item label="标题：" prop="name">
-      <el-input v-model="form.name" :maxlength="INPUTLENGTH*5" show-word-limit></el-input>
+      <el-input
+        v-model="form.name"
+        :maxlength="INPUTLENGTH * 5"
+        show-word-limit
+      ></el-input>
     </el-form-item>
 
     <el-form-item label="精品类型：">
@@ -18,11 +22,12 @@
       <ul class="tuku">
         <li v-for="(item, i) in filelist" :key="i">
           <div class="imgcon">
-            <el-image 
-              class="img" 
+            <el-image
+              class="img"
               :src="item.filePath"
               :fit="'cover'"
-              :preview-src-list="[item.filePath]">
+              :preview-src-list="[item.filePath]"
+            >
             </el-image>
             <div class="cover" v-if="item.isIndex">封面图片</div>
             <el-button
@@ -41,16 +46,31 @@
               type="primary"
               >设为封面</el-button
             >
-            <el-button size="mini"  style="position:relative;">
+            <el-button size="mini" style="position:relative;">
               <span>
-                重新上传{{item.code}}
-                <uploadImg class="fadeVisable" :url="`${$serverName}cms/goods/afresh/uploadImg/${item.id}/${form.code}`" @update="(e)=>{reupload(e,item)}" />
+                重新上传
+                <uploadImg
+                  class="fadeVisable"
+                  :url="
+                    `${$serverName}cms/goods/afresh/uploadImg/${item.id}/${form.code}`
+                  "
+                  @update="
+                    (e) => {
+                      reupload(e, item);
+                    }
+                  "
+                />
               </span>
             </el-button>
           </div>
         </li>
         <li>
-          <uploadImg id="uli" :url="thumbUrl" @update="updateImg" :thumb="form.thumb" />
+          <uploadImg
+            id="uli"
+            :url="thumbUrl"
+            @update="updateImg"
+            :thumb="form.thumb"
+          />
         </li>
       </ul>
     </el-form-item>
@@ -72,26 +92,26 @@ export default {
       thumbUrl: this.$serverName + "cms/goods/uploadImg",
     };
   },
-  watch:{
-    'filelist':function (newVal) {
-      if (newVal.length<=0) {
-        this.form.indexId = ''
-        this.form.thumb = ''
+  watch: {
+    filelist: function(newVal) {
+      if (newVal.length <= 0) {
+        this.form.indexId = "";
+        this.form.thumb = "";
       }
-    }
+    },
   },
   methods: {
     setCover(item) {
-      this.form.indexId = item.id
-      this.form.thumb = item.filePath
+      this.form.indexId = item.id;
+      this.form.thumb = item.filePath;
       this.filelist.forEach((sub) => {
-            //匹配置为0
-            if (item.id == sub.id) {
-              sub.isIndex = 1;
-            } else {
-              sub.isIndex = 0;
-            }
-          });
+        //匹配置为0
+        if (item.id == sub.id) {
+          sub.isIndex = 1;
+        } else {
+          sub.isIndex = 0;
+        }
+      });
     },
 
     del(item, i) {
@@ -111,52 +131,40 @@ export default {
       });
     },
 
-    reupload(data,item) {
+    reupload(data, item) {
       try {
+
+        if (item.isIndex == 1) {
+          this.form.thumb = data.filePath;
+        }
+
         this.filelist = this.filelist.map((sub) => {
-        //匹配置为0
-        if (item.id == sub.id) {
-          sub = {
-            ...sub,
-            ...data
+          //匹配置为0
+          if (item.id == sub.id) {
+            sub = {
+              ...sub,
+              ...data,
+            };
           }
-          console.log(sub);
-        } 
-        return sub
-      });
-
+          return sub;
+        });
       } catch (e) {
-        !e
+        !e;
       }
       console.log(this.filelist);
-
-      // refreshImg(
-      //     {
-      //       fileId: data.id,
-      //       code:data.code
-      //     },
-      //     () => {
-            
-      //     }
-      //   );
-      
-      // console.log(this.filelist);
-
-      // this.$refs.uli.$el.$refs.chidleimg.click()
     },
 
     updateImg(data) {
-
       console.log(data);
-      
+
       this.filelist.push({
         ...data,
-        isIndex:0
-      })
+        isIndex: 0,
+      });
 
-      if (this.filelist.length===1) {
-        this.form.indexId = data.id
-        this.form.thumb = data.filePath
+      if (this.filelist.length === 1) {
+        this.form.indexId = data.id;
+        this.form.thumb = data.filePath;
       }
     },
   },
@@ -180,13 +188,13 @@ export default {
       margin-bottom: @gap / 2;
       position: relative;
       background: #f0f0f0;
-      overflow:hidden;
+      overflow: hidden;
       .img {
         width: 100%;
         position: absolute;
         top: 50%;
         left: 50%;
-        transform: translate(-50%,-50%);
+        transform: translate(-50%, -50%);
       }
       .cover {
         position: absolute;

backstage/src/pages/content/collection/data.js

@@ -131,12 +131,12 @@ let rules = {
   img:{ 
     name: [{ required: true, message: "请输入标题", trigger: "blur" }],
     thumb: [{ required: true, message: "请上传图片", trigger: "change" }],
-    filePath: [{ required: true, message: "请上传封面图片", trigger: "change" }]
+    filePath: [{ required: true, message: "请上传图片", trigger: "change" }]
   },
   video:{ 
     name: [{ required: true, message: "请输入标题", trigger: "blur" }],
     thumb: [{ required: true, message: "请上传封面图片", trigger: "change" }],
-    filePath: [{ required: true, message: "请上传封面图片", trigger: "change" }]
+    filePath: [{ required: true, message: "请上传视频文件", trigger: "change" }]
   }
 }
 

backstage/src/pages/content/collection/index.vue

@@ -30,7 +30,7 @@
             <span>标题：</span>
             <el-input
               class="elInput paddingmore"
-              :maxlength="25"
+              :maxlength="INPUTLENGTH"
               show-word-limit
               v-model="search.inputKey"
               @keydown.enter.native="getList"

backstage/src/pages/content/expert/componets/expert.vue

@@ -78,6 +78,7 @@
             v-model="form.url"
             :maxlength="INPUTLENGTH * 5"
             show-word-limit
+            class="paddingmore"
           >
             <template slot="prepend">https://</template>
           </el-input>

backstage/src/pages/content/expert/data.js

@@ -64,7 +64,7 @@ let rules = {
     description: [
       { required: true, message: "请输入专家介绍", trigger: "blur" },
     ],
-    thumb: [{ required: true, message: "请上传专家姓名", trigger: "blur" }],
+    thumb: [{ required: true, message: "请上传专家照片", trigger: "blur" }],
   },
 };
 

backstage/src/pages/content/expert/index.vue

@@ -11,7 +11,7 @@
         <search>
           <div slot="content" class="searchslot">
             <span>姓名：</span>
-            <el-input class="elInput paddingmore" :maxlength="25"
+            <el-input class="elInput paddingmore" :maxlength="INPUTLENGTH"
               @keydown.enter.native="getList"
                 show-word-limit v-model="search.inputKey" placeholder="请输入关键字"></el-input>
             <el-button @click="getList" type="primary">查询</el-button>

backstage/src/pages/content/interaction/index.vue

@@ -26,7 +26,7 @@
               <span>{{keyObj[$route.params.type]}}：</span>
               <el-input
                 class="elInput paddingmore"
-                :maxlength="25"
+                :maxlength="INPUTLENGTH"
                 show-word-limit
                 v-model="search.inputKey"
                 @keydown.enter.native="getList"

backstage/src/pages/content/sand/componets/sand.vue

@@ -46,6 +46,7 @@
               v-model="item.url"
               :maxlength="INPUTLENGTH*5"
               show-word-limit
+              class="paddingmore"
             >
               <template slot="prepend">https://</template>
             </el-input>

backstage/src/pages/content/sand/index.vue

@@ -5,7 +5,7 @@
         <search>
           <div slot="content" class="searchslot">
             <span>中心名称：</span>
-            <el-input class="elInput paddingmore" :maxlength="25"
+            <el-input class="elInput paddingmore" :maxlength="INPUTLENGTH"
               @keydown.enter.native="getList"
                 show-word-limit v-model="search.inputKey" placeholder="请输入关键字"></el-input>
             <el-button @click="getList" type="primary">查询</el-button>

backstage/src/pages/layout/aside.vue

@@ -66,23 +66,29 @@ export default {
       this.tmpRoute = routes.filter(item => {
         let tmp = ''
         result.data.forEach(sub=>{
+
           if (item.name == sub.name) {
+            
+            if (sub.name =='操作日志') {
+              sub.authority = sub.children[0].authority
+            }
+
             if (sub.authority) {
               tmp = sub
             }
           }
         })
 
-        if (item.type == "system") {
-          // if (window.localStorage.getItem("role") == 'sys_admin') {
-          //     tmp = item
-          // }
-          // else{
-          //   tmp = ''
-          // }
-          tmp = item
+        // if (item.type == "system") {
+        //   // if (window.localStorage.getItem("role") == 'sys_admin') {
+        //   //     tmp = item
+        //   // }
+        //   // else{
+        //   //   tmp = ''
+        //   // }
+        //   tmp = item
 
-        }
+        // }
         return tmp ? Object.assign(item,tmp) : tmp
       });
 
@@ -105,6 +111,8 @@ export default {
         item.routes = route
         return route.length>0 && item
       })
+
+      console.log(this.menu);
     }
   },
   created () {

backstage/src/pages/layout/head.vue

@@ -1,4 +1,4 @@
-<!--  -->
+passworddialog.vue<!--  -->
 <template>
   <div class="header card">
     <div class="header-title">
@@ -10,6 +10,7 @@
         <span>{{ userInfo.nickName }}</span>
         <ul>
           <li @click="handleAvatar">用户信息</li>
+          <li @click="handlePassword">修改密码</li>
           <li @click="logoutcomfirm">退出登录</li>
         </ul>
       </div>
@@ -17,25 +18,35 @@
     </div>
 
     <usereditdialog
-      :key="ran"
       @logout="logout(true)"
       :form="userInfo"
       :show="isShowEdit"
       @close="isShowEdit = false"
     />
+
+    <passworddialog
+      :key="ran"
+      @logout="logout(true)"
+      :form="userInfo"
+      :show="isShowPassword"
+      @close="isShowPassword = false"
+    />
   </div>
 </template>
 
 <script>
 import usereditdialog from "@/components/editcomponent/usereditdialog";
+import passworddialog from "@/components/editcomponent/passworddialog";
+
 import { getSysDetail } from "@/configue/api";
 
 export default {
-  components: { usereditdialog },
+  components: { usereditdialog, passworddialog },
   data() {
     return {
       isShowEdit: false,
-      ran: "",
+      isShowPassword: false,
+      ran: 1,
       userId: "",
       userInfo: {},
     };
@@ -47,15 +58,13 @@ export default {
   },
   methods: {
     handleAvatar() {
-      let role = window.localStorage.getItem("role");
-
-      console.log(this.juese[role]);
-
-      if (!this.juese[role]) {
-        return;
-      }
       this.isShowEdit = true;
-      this.ran = Math.random();
+      this.ran += 1;
+    },
+
+    handlePassword() {
+      this.isShowPassword = true;
+      this.ran += 1;
     },
     logoutcomfirm() {
       this.confirm("确定退出登录？", () => {
@@ -142,17 +151,17 @@ export default {
     display: flex;
     align-items: center;
     justify-content: center;
-    &:hover{
-      >ul{
+    &:hover {
+      > ul {
         display: block;
       }
     }
-    >span{
+    > span {
       display: inline-block;
     }
-    >ul{
+    > ul {
       position: absolute;
-      bottom: -70px;
+      bottom: -110px;
       z-index: 9999;
       left: 50%;
       transform: translateX(-50%);
@@ -162,12 +171,12 @@ export default {
       color: #010101;
       border: 1px solid #010101;
       display: none;
-      li{
+      li {
         display: inline-block;
         height: 40px;
         width: 100%;
         line-height: 40px;
-        &:hover{
+        &:hover {
           background: #f0f0f0;
         }
       }

backstage/src/pages/system/role/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <main-top>
-      <div slot="con">
+      <div slot="con" v-if="activeSub['新增']">
         <el-button @click="openDilog()" type="primary"
           >新增</el-button
         >
@@ -14,7 +14,7 @@
             <span>角色名称：</span>
             <el-input
               class="elInput paddingmore"
-              :maxlength="25"
+              :maxlength="INPUTLENGTH"
               show-word-limit
               @keydown.enter.native="getList"
               v-model="search.inputKey"
@@ -51,11 +51,14 @@
             <el-table-column slot="operate" label="操作" width="190">
               <template slot-scope="scope">
                 <template v-if="!scope.row.roleKey">
-                  <span class="o-span" @click="gotoEdit(scope.row)"
+                  <span v-if="activeSub['权限设置']" class="o-span" @click="gotoEdit(scope.row)"
                   >权限设置</span
                 >
-                <span class="o-span" @click="openDilog(scope.row)">编辑</span>
-                <span class="o-span" @click="delSys(scope.row)">删除</span>
+                <span class="o-span" v-if="activeSub['编辑']" @click="openDilog(scope.row)">编辑</span>
+                <span class="o-span" v-if="activeSub['删除']" @click="delSys(scope.row)">删除</span>
+
+                  <template v-if="!activeSub['编辑']&&!activeSub['删除']&&!activeSub['权限设置']">-</template>
+
                 </template>
                 <template v-else>-</template>
               </template>
@@ -167,6 +170,21 @@ export default {
     },
   },
   watch: {
+    subMenu: {
+      deep: true,
+      immediate: true,
+      handler: function() {
+        this.getAuth(this.activeMenu, "角色");
+        this.getList();
+      },
+    },
+    activeMenu: {
+      deep: true,
+      immediate: true,
+      handler: function(newVal) {
+        this.getAuth(newVal, "角色");
+      },
+    },
     "$route.params.type": function() {
       this.getList();
     },

backstage/src/pages/system/user/componets/manage.vue

@@ -11,11 +11,11 @@
         </el-form-item>
 
         <el-form-item label="单位名称：" prop="unit">
-          <el-input v-model="form.unit" :maxlength="INPUTLENGTH" show-word-limit></el-input>
+          <el-input v-model="form.unit" :maxlength="INPUTLENGTH*5" show-word-limit></el-input>
         </el-form-item>
 
         <el-form-item label="联系电话：" prop="phone">
-          <el-input maxlength="11" show-word-limit v-model.number="form.phone"></el-input>
+          <el-input :maxlength="INPUTLENGTH" show-word-limit v-model.number="form.phone"></el-input>
         </el-form-item>
 
         <el-form-item label="是否启用：" v-if="form.roleKey!='sys_admin'">
@@ -40,7 +40,7 @@
         </el-form-item>
 
         <el-form-item label="通讯地址：" prop="address">
-          <el-input v-model="form.address" :maxlength="INPUTLENGTH" show-word-limit></el-input>
+          <el-input v-model="form.address" :maxlength="INPUTLENGTH*5" show-word-limit></el-input>
         </el-form-item>
 
         <el-form-item label="性别：" prop="sex">

backstage/src/pages/system/user/edit.vue

@@ -111,7 +111,11 @@ export default {
     getRoleList() {
       getRoleList(
         (data) => {
-          this.roleList = data.data;
+          this.roleList = data.data.filter(item=>{
+              return item.roleKey != 'sys_admin'
+          });
+
+          console.log(this.roleList);
         }
       );
     },
@@ -122,6 +126,10 @@ export default {
       } else{
         await getSysDetail(this.val,{id:this.id},res=>{
           this.form = {...this.form,...res.data,isEnabled:Boolean(res.data.isEnabled)}
+
+          if (this.form.roleKey == 'sys_visitor') {
+            this.form.roleId = ''
+          }
         })
       }
 

backstage/src/pages/system/user/index.vue

@@ -1,8 +1,8 @@
 <template>
   <div>
     <main-top>
-      <div slot="con">
-        <el-button  @click="goto({ id: 'none',status: 0 })" type="primary"
+      <div slot="con" v-if="activeSub['新增']">
+        <el-button @click="goto({ id: 'none', status: 0 })" type="primary"
           >新增</el-button
         >
       </div>
@@ -24,7 +24,7 @@
             <span>真实姓名：</span>
             <el-input
               class="elInput paddingmore"
-              :maxlength="25"
+              :maxlength="INPUTLENGTH"
               show-word-limit
               @keydown.enter.native="getList"
               v-model="search.inputKey"
@@ -33,16 +33,25 @@
 
             <span>用户角色：</span>
             <el-select v-model="search.roleId" placeholder="请选择">
-              <el-option label="全部"  value="" key=""></el-option>
+              <el-option label="全部" value="" key=""></el-option>
               <el-option
-                v-for="(item,i) in rolelist"
+                v-for="(item, i) in rolelist"
                 :key="i"
                 :label="item.roleName"
-                :value="item.id">
+                :value="item.id"
+              >
               </el-option>
             </el-select>
             <el-button @click="getList" type="primary">查询</el-button>
-            <el-button @click="search.date='',search.roleId='',search.inputKey='',getList()" >重置</el-button>
+            <el-button
+              @click="
+                (search.date = ''),
+                  (search.roleId = ''),
+                  (search.inputKey = ''),
+                  getList()
+              "
+              >重置</el-button
+            >
           </div>
         </search>
         <div class="table">
@@ -63,10 +72,14 @@
             "
             :tableData="list"
           >
-          <el-table-column slot="operate" label="操作" width="190">
+            <el-table-column slot="operate" label="操作" width="190">
               <template slot-scope="scope">
-                <span class="o-span" @click="gotoEdit(scope.row)">编辑</span>
-                <span class="o-span" @click="delSys(scope.row)">删除</span>
+                <template v-if="  !scope.row.roleKey || scope.row.roleKey == 'sys_visitor' " >
+                  <span class="o-span" v-if="activeSub['编辑']" @click="gotoEdit(scope.row)">编辑</span>
+                  <span class="o-span" v-if="activeSub['删除']" @click="delSys(scope.row)">删除</span>
+                  <template v-if="!activeSub['编辑']&&!activeSub['删除']">-</template>
+                </template>
+                <template v-else>-</template>
               </template>
             </el-table-column>
           </vtable>
@@ -78,7 +91,7 @@
 
 <script>
 import { raw } from "./data";
-import { getSysList,delSys } from "@/configue/api";
+import { getSysList, delSys } from "@/configue/api";
 import { mapGetters } from "vuex";
 
 export default {
@@ -88,21 +101,21 @@ export default {
         inputKey: "",
         date: "",
         state: "",
-        roleId:''
+        roleId: "",
       },
-      type:'user',
+      type: "user",
       list: {},
       page: {
         size: 25,
         pageNum: 1,
       },
-      rolelist:[]
+      rolelist: [],
     };
   },
   methods: {
-    delSys(item){
+    delSys(item) {
       this.confirm("删除后，信息将无法恢复，是否继续？", () => {
-         delSys(
+        delSys(
           this.type,
           {
             id: item.id,
@@ -111,22 +124,22 @@ export default {
             this.$alert("删除成功", "提示", {
               confirmButtonText: "确定",
               callback: () => {
-                this.getList()
+                this.getList();
               },
             });
           }
         );
       });
     },
-    gotoEdit(item){
-      let {type} = this.$route.params
-      this.$router.push(
-        {name:'edit-'+this.$route.name,
-        params:{
-          id:item.id,
-          type:type
-        }}
-      )
+    gotoEdit(item) {
+      let { type } = this.$route.params;
+      this.$router.push({
+        name: "edit-" + this.$route.name,
+        params: {
+          id: item.id,
+          type: type,
+        },
+      });
     },
     getRoleList() {
       getSysList(
@@ -141,7 +154,7 @@ export default {
       );
     },
     getList() {
-      let { inputKey,roleId, date } = this.search;
+      let { inputKey, roleId, date } = this.search;
       getSysList(
         this.type,
         {
@@ -149,7 +162,7 @@ export default {
           pageNum: this.page.pageNum,
           pageSize: this.page.size,
           searchKey: inputKey,
-          roleId
+          roleId,
         },
         (data) => {
           this.list = data.data;
@@ -160,32 +173,46 @@ export default {
   computed: {
     ...mapGetters({
       activeMenu: "activeMenu",
-      activeSub:"activeSub"
+      activeSub: "activeSub",
     }),
     data() {
       return raw[this.$route.params.type];
     },
-    subMenu(){
-      return this.$route.params.type
-    }
+    subMenu() {
+      return this.$route.params.type;
+    },
   },
   watch: {
+    subMenu: {
+      deep: true,
+      immediate: true,
+      handler: function() {
+        this.getAuth(this.activeMenu, "用户");
+        this.getList();
+      },
+    },
+    activeMenu: {
+      deep: true,
+      immediate: true,
+      handler: function(newVal) {
+        this.getAuth(newVal, "用户");
+      },
+    },
     page: {
       deep: true,
       handler: function() {
         this.getList();
       },
     },
-    '$route.query.roleId':{
-      immediate:true,
-      handler: function (newVal) {
-        newVal && (this.search.roleId = Number(newVal))
-      }
-    }
+    "$route.query.roleId": {
+      immediate: true,
+      handler: function(newVal) {
+        newVal && (this.search.roleId = Number(newVal));
+      },
+    },
   },
   mounted() {
-    this.getRoleList()
-    this.getList();
+    this.getRoleList();
   },
 };
 </script>

backstage/src/pages/system/worklog/index.vue

@@ -117,6 +117,21 @@ export default {
     }
   },
   watch: {
+    subMenu: {
+      deep: true,
+      immediate: true,
+      handler: function() {
+        this.getAuth(this.activeMenu, "日志");
+        this.getList();
+      },
+    },
+    activeMenu: {
+      deep: true,
+      immediate: true,
+      handler: function(newVal) {
+        this.getAuth(newVal, "日志");
+      },
+    },
     page: {
       deep: true,
       handler: function() {

edit-backstage/css/cropper.min.css

@@ -0,0 +1,252 @@
+/*!
+ * Cropper v3.1.3
+ * https://github.com/fengyuanchen/cropper
+ *
+ * Copyright (c) 2014-2017 Chen Fengyuan
+ * Released under the MIT license
+ *
+ * Date: 2017-10-21T10:03:37.133Z
+ */.cropper-container {
+ direction:ltr;
+ font-size:0;
+ line-height:0;
+ position:relative;
+ -ms-touch-action:none;
+ touch-action:none;
+ -webkit-user-select:none;
+ -moz-user-select:none;
+ -ms-user-select:none;
+ user-select:none
+}
+.cropper-container img {
+ display:block;
+ height:100%;
+ image-orientation:0deg;
+ max-height:none!important;
+ max-width:none!important;
+ min-height:0!important;
+ min-width:0!important;
+ width:100%
+}
+.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box {
+ bottom:0;
+ left:0;
+ position:absolute;
+ right:0;
+ top:0
+}
+.cropper-canvas,.cropper-wrap-box {
+ overflow:hidden
+}
+.cropper-drag-box {
+ background-color:#fff;
+ opacity:0
+}
+.cropper-modal {
+ background-color:#000;
+ opacity:.5
+}
+.cropper-view-box {
+ display:block;
+ height:100%;
+ outline-color:rgba(51,153,255,.75);
+ outline:1px solid #39f;
+ overflow:hidden;
+ width:100%
+}
+.cropper-dashed {
+ border:0 dashed #eee;
+ display:block;
+ opacity:.5;
+ position:absolute
+}
+.cropper-dashed.dashed-h {
+ border-bottom-width:1px;
+ border-top-width:1px;
+ height:33.33333%;
+ left:0;
+ top:33.33333%;
+ width:100%
+}
+.cropper-dashed.dashed-v {
+ border-left-width:1px;
+ border-right-width:1px;
+ height:100%;
+ left:33.33333%;
+ top:0;
+ width:33.33333%
+}
+.cropper-center {
+ display:block;
+ height:0;
+ left:50%;
+ opacity:.75;
+ position:absolute;
+ top:50%;
+ width:0
+}
+.cropper-center:after,.cropper-center:before {
+ background-color:#eee;
+ content:" ";
+ display:block;
+ position:absolute
+}
+.cropper-center:before {
+ height:1px;
+ left:-3px;
+ top:0;
+ width:7px
+}
+.cropper-center:after {
+ height:7px;
+ left:0;
+ top:-3px;
+ width:1px
+}
+.cropper-face,.cropper-line,.cropper-point {
+ display:block;
+ height:100%;
+ opacity:.1;
+ position:absolute;
+ width:100%
+}
+.cropper-face {
+ background-color:#fff;
+ left:0;
+ top:0
+}
+.cropper-line {
+ background-color:#39f
+}
+.cropper-line.line-e {
+ cursor:e-resize;
+ right:-3px;
+ top:0;
+ width:5px
+}
+.cropper-line.line-n {
+ cursor:n-resize;
+ height:5px;
+ left:0;
+ top:-3px
+}
+.cropper-line.line-w {
+ cursor:w-resize;
+ left:-3px;
+ top:0;
+ width:5px
+}
+.cropper-line.line-s {
+ bottom:-3px;
+ cursor:s-resize;
+ height:5px;
+ left:0
+}
+.cropper-point {
+ background-color:#39f;
+ height:5px;
+ opacity:.75;
+ width:5px
+}
+.cropper-point.point-e {
+ cursor:e-resize;
+ margin-top:-3px;
+ right:-3px;
+ top:50%
+}
+.cropper-point.point-n {
+ cursor:n-resize;
+ left:50%;
+ margin-left:-3px;
+ top:-3px
+}
+.cropper-point.point-w {
+ cursor:w-resize;
+ left:-3px;
+ margin-top:-3px;
+ top:50%
+}
+.cropper-point.point-s {
+ bottom:-3px;
+ cursor:s-resize;
+ left:50%;
+ margin-left:-3px
+}
+.cropper-point.point-ne {
+ cursor:ne-resize;
+ right:-3px;
+ top:-3px
+}
+.cropper-point.point-nw {
+ cursor:nw-resize;
+ left:-3px;
+ top:-3px
+}
+.cropper-point.point-sw {
+ bottom:-3px;
+ cursor:sw-resize;
+ left:-3px
+}
+.cropper-point.point-se {
+ bottom:-3px;
+ cursor:se-resize;
+ height:20px;
+ opacity:1;
+ right:-3px;
+ width:20px
+}
+@media (min-width:768px) {
+ .cropper-point.point-se {
+  height:15px;
+  width:15px
+ }
+}
+@media (min-width:992px) {
+ .cropper-point.point-se {
+  height:10px;
+  width:10px
+ }
+}
+@media (min-width:1200px) {
+ .cropper-point.point-se {
+  height:5px;
+  opacity:.75;
+  width:5px
+ }
+}
+.cropper-point.point-se:before {
+ background-color:#39f;
+ bottom:-50%;
+ content:" ";
+ display:block;
+ height:200%;
+ opacity:0;
+ position:absolute;
+ right:-50%;
+ width:200%
+}
+.cropper-invisible {
+ opacity:0
+}
+.cropper-bg {
+ background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC")
+}
+.cropper-hide {
+ display:block;
+ height:0;
+ position:absolute;
+ width:0
+}
+.cropper-hidden {
+ display:none!important
+}
+.cropper-move {
+ cursor:move
+}
+.cropper-crop {
+ cursor:crosshair
+}
+.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point {
+ cursor:not-allowed
+}
+/*# sourceMappingURL=cropper.min.css.map */

edit-backstage/css/diyUpload.css

@@ -0,0 +1,129 @@
+@charset "utf-8";
+/* CSS Document*/
+.parentFileBox {
+	width:auto;
+	height:auto;
+	overflow:hidden;
+	position:relative;
+}
+.parentFileBox>.fileBoxUl {
+	position:relative;
+	width:100%;
+	height:auto;
+	overflow:hidden;
+	padding-bottom:5px;
+}
+.parentFileBox>.fileBoxUl>li {
+	float:left;
+	border:1px solid #09F;
+	border-radius:5px;
+	width:95px;
+	height:95px;
+	margin-top:5px;
+	margin-left:5px;
+	overflow:hidden;
+	position:relative;
+	background-color:#099;
+}
+.parentFileBox>.fileBoxUl>li>.viewThumb {
+	position:absolute;
+	top:0;
+	left:0;
+	width:95px;
+	height:95px;
+	overflow:hidden;
+}
+.parentFileBox>.fileBoxUl>li>.viewThumb>img {
+	width:100%;
+	height:100%;
+}
+.parentFileBox>.fileBoxUl>li>.diyCancel,.parentFileBox>.fileBoxUl>li>.diySuccess {
+	position:absolute;
+	width:20px;
+	height:20px;
+	top:2px;
+	right:2px;
+	cursor:pointer;
+	display:none;
+	background-size: 100% !important; 
+}
+.parentFileBox>.fileBoxUl>li>.diyCancel {
+	background:url(../images/edit/x_alt.png) left top no-repeat;
+}
+.parentFileBox>.fileBoxUl>li>.diySuccess {
+	background:url(../images/edit/check_alt.png)  left top  no-repeat;
+	cursor:default;
+}
+.parentFileBox>.fileBoxUl>li>.diyFileName {
+	position:absolute;
+	bottom:0px;
+	left:0px;
+	width:100%;
+	height:15px;
+	line-height:15px;
+	text-align:center;
+	color:#fff;
+	font-size:12px;
+	display:none;
+	background:url(../images/edit/bgblack.png);
+}
+.parentFileBox>.fileBoxUl>li>.diyBar {
+	top:0;
+	left:0;
+	position: absolute;
+	width: 95px;
+	height: 95px;
+	line-height:150px;
+	background:url(../images/edit/bgblack.png);
+	display:none;
+}
+.parentFileBox>.fileBoxUl>li>.diyBar>.diyProgressText {
+	font-size:14px;
+	text-align:center;
+	color:#FFF;
+	position:relative;
+	z-index:99;
+}
+.parentFileBox>.fileBoxUl>li>.diyBar>.diyProgress {
+	position:absolute;
+	left:0;
+	top:42%;
+	height:24px;
+	width:100%;
+	background-color:#09F;
+	filter:alpha(opacity=70);
+	-moz-opacity:0.7;
+	opacity:0.7;
+	z-index:97;
+}
+.parentFileBox>.diyButton {
+	width:100%;
+	margin-top:5px;
+	margin-bottom:5px;
+	height:20px;
+	line-height:20px;
+	text-align:center;
+}
+.parentFileBox>.diyButton>a {
+	padding:5px 10px 5px 10px;
+	background-color:#09C;
+	color:#FFF;
+	font-size:12px;
+	text-decoration:none;
+	border-radius:3px;
+}
+.parentFileBox>.diyButton>a:hover {
+	background-color:#0CC;
+	color:#F30;
+}
+.parentFileBox>.fileBoxUl>li:hover {
+	-moz-box-shadow: 3px 3px 4px #ccc;
+	-webkit-box-shadow: 3px 3px 4px #ccc;
+	box-shadow: 3px 3px 4px #ccc;
+}
+.parentFileBox>.fileBoxUl>.diyUploadHover:hover .diyCancel {
+	display:block;
+}
+.parentFileBox>.fileBoxUl>li:hover .diyFileName {
+	display:block;
+}

edit-backstage/css/oldVer/main0.css

@@ -0,0 +1,222 @@
+.sidecontent{position:fixed;left:-750px;width:auto;display:none;background:rgba(0,0,0,0.8);top:70px;height: 100%;color: rgba(255,255,255,1);}
+.sidecontent h1{font-size:14px;width:90%;margin:0px auto;text-align:center;height:50px;line-height:50px;position:relative;}
+.sidecontent h1 span{font-size:12px;font-weight:normal;position:absolute;right:-10px;cursor:pointer;border:#ebebeb solid 1px;width:40px;height:40px;line-height:40px;border-radius:20px;text-align:center;}
+#text
+{
+    float:left;
+	width:auto;
+	font-size:18px;
+	letter-spacing:2px;
+	margin:30px;
+	max-width:600px;
+	height:500px;
+	max-height:630px;
+	line-height:22px;
+	font-family:"宋体";
+}
+#sideimg{margin:5px 20px 30px 10px;float:left;}
+
+#gui-modes-map div img
+{
+	width:48px;
+	height:48px;
+}
+
+ 
+
+iframe{
+	border: none;
+}
+
+
+#popup {
+	z-index: 20;
+	text-align: center;
+	padding: 0;
+	position: relative;
+	width: 100%;
+	height: 100%;
+	/* margin: 80px auto; */
+	display: none;
+	z-index: 101;
+	background:  rgba(0,0,0,0.6);
+}
+.popup-content{
+	position: relative;
+	width: 100%;
+	height: 100%;
+	overflow-x: hidden;
+}
+#id1{ width: 100%; height: 99.4%;}
+#popup.wait{
+	opacity:0.1; 
+}
+#closepop {
+	background: url(https://super.4dage.com/images/close1.png) no-repeat;
+	width: 60px;
+	height: 60px;
+	cursor: pointer;
+	position: absolute;
+	right: 30px;
+	top: 30px;
+	text-indent: -999em;
+	background-size: 100% 100%;
+}
+.specialTitle{bottom:65%;
+    width: 100%;
+    padding: 0 25px;
+    display: block;
+    font-family: OpenSans,'Helvetica Neue',sans-serif;
+    text-align: center;
+    font-size: 40px;
+    font-weight: 100;
+    letter-spacing: .75px;
+    text-shadow: 0 0 10px rgba(15,16,17,1);
+    color: rgba(255,255,255,1);
+    margin: 0;
+    position: absolute;
+    hyphens: auto;
+    word-wrap: break-word;
+    line-height: 45px;}
+	.dropdown {position: relative;display: inline-block;float: right;height: 40px;line-height: 40px;right: 10px;}
+    .floor{ width: 100px;text-align: center;display: block;height: 30px;background: rgba(0,0,0,0.4);line-height: 30px;margin-top: 10px;cursor: pointer;}
+    .dropdown-content {display: none;position: absolute;background: rgba(0,0,0,0.6);min-width: 100px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);text-align:center;}
+    .dropdown:hover .dropdown-content {display: block;}
+    a{text-decoration:none;}
+	#YY,#SZZ{display:none;}
+ @media only screen and (max-width:487px){
+           .dropdown {height: 30px;line-height: 30px;right:5px;}
+           .floor {width: 80px;height: 20px;line-height: 20px;margin-top: 5px;}
+          .dropdown-content{min-width: 80px;}	
+           }
+@media screen and (max-width: 1600px) {
+ 
+	/*#popup {
+		width: 816px;
+		height: 510px;
+		margin: -255px auto auto -408px;
+	}*/
+	.specialTitle{
+	bottom:65%;
+    font-size: 34px;
+	}
+}
+
+@media screen and (max-width: 1400px) {
+ 
+	/*#popup {
+		width: 714px;
+		height: 446px;
+		margin: -223px auto auto -357px;
+	}*/
+	.specialTitle {
+    bottom: 65%;
+    font-size: 30px;
+    }
+}
+
+@media screen and (max-width: 1200px) {
+ 
+	#closepop{
+		width: 40px;
+		height: 40px;
+		top: 20px;
+		right: 20px;
+	}
+	.specialTitle {
+    bottom: 66%;
+    font-size: 26px;
+    }
+}
+ 
+@media screen and (max-width: 768px) {
+ 
+	.specialTitle {
+     bottom: 62%;
+     font-size: 26px;
+	 line-height:40px;
+    }
+	#special-gui-name{display:none;}
+}
+@media screen and  (max-width: 736px){
+
+	
+	#title-toggle{
+		padding-top: 18px;
+		height: 42px;
+	}
+
+
+	.pinTop{top:8px;}
+}
+@media screen and  (max-width:667px){
+	#closepop{
+		width: 36px;
+		height: 36px;
+		top: 0px;
+		right: 0px;
+	}
+
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+
+}
+@media screen and  (max-width:568px){
+
+	
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+	
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+
+}
+@media screen and (max-width:414px) {
+
+	
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+	
+
+}
+@media screen and (max-width:375px) {
+
+	
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+
+	
+	.pinTop{top:5px;}	
+	
+}
+@media screen and (max-width:320px) {
+	/*#popup {
+		width: 200px;
+        height: 380px;
+        margin: -200px auto auto -100px;
+	}*/
+	
+	#title-toggle{
+		padding-top: 16px;
+		height: 36px;
+	}
+
+	
+	.pinTop{top:0px;}
+	
+}

edit-backstage/css/oldVer/main0.css.bak

@@ -0,0 +1,339 @@
+.sidecontent{position:fixed;left:-750px;width:auto;display:none;background:rgba(0,0,0,0.8);top:70px;height: 100%;color: rgba(255,255,255,1);}
+.sidecontent h1{font-size:14px;width:90%;margin:0px auto;text-align:center;height:50px;line-height:50px;position:relative;}
+.sidecontent h1 span{font-size:12px;font-weight:normal;position:absolute;right:-10px;cursor:pointer;border:#ebebeb solid 1px;width:40px;height:40px;line-height:40px;border-radius:20px;text-align:center;}
+#text
+{
+    float:left;
+	width:auto;
+	font-size:18px;
+	letter-spacing:2px;
+	margin:30px;
+	max-width:600px;
+	height:500px;
+	max-height:630px;
+	line-height:22px;
+	font-family:"宋体";
+}
+#sideimg{margin:5px 20px 30px 10px;float:left;}
+
+#gui-modes-map div img
+{
+	width:48px;
+	height:48px;
+}
+
+ 
+
+iframe{
+	border: none;
+}
+
+
+#popup {
+	z-index: 20;
+	text-align: center;
+	padding: 0;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	width: 960px;
+	height: 580px;
+	margin: -290px auto auto -480px;
+	display: none;
+	overflow-y: hidden;
+	transition: opacity 0.2s;
+	opacity: 1;
+}
+#popup.wait{
+	pointer-events:none;
+	opacity:0.1; 
+}
+#closepop {
+	background: url(../../images/close1.png) no-repeat;
+    width: 40px;
+    height: 40px;
+    cursor: pointer;
+    position: absolute;
+    right: 0px;
+    top: -3px;
+    text-indent: -999em;
+}
+.specialTitle{bottom:65%;
+    width: 100%;
+    padding: 0 25px;
+    display: block;
+    font-family: OpenSans,'Helvetica Neue',sans-serif;
+    text-align: center;
+    font-size: 40px;
+    font-weight: 100;
+    letter-spacing: .75px;
+    text-shadow: 0 0 10px rgba(15,16,17,1);
+    color: rgba(255,255,255,1);
+    margin: 0;
+    position: absolute;
+    hyphens: auto;
+    word-wrap: break-word;
+    line-height: 45px;}
+	.dropdown {position: relative;display: inline-block;float: right;height: 40px;line-height: 40px;right: 10px;}
+    .floor{ width: 100px;text-align: center;display: block;height: 30px;background: rgba(0,0,0,0.4);line-height: 30px;margin-top: 10px;cursor: pointer;}
+    .dropdown-content {display: none;position: absolute;background: rgba(0,0,0,0.6);min-width: 100px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);text-align:center;}
+    .dropdown:hover .dropdown-content {display: block;}
+    a{text-decoration:none;}
+	#YY,#SZZ{display:none;}
+ @media only screen and (max-width:487px){
+           .dropdown {height: 30px;line-height: 30px;right:5px;}
+           .floor {width: 80px;height: 20px;line-height: 20px;margin-top: 5px;}
+          .dropdown-content{min-width: 80px;}	
+           }
+@media screen and (max-width: 1600px) {
+ 
+	#popup {
+		width: 816px;
+		height: 510px;
+		margin: -255px auto auto -408px;
+	}
+	.specialTitle{
+	bottom:65%;
+    font-size: 34px;
+	}
+}
+
+@media screen and (max-width: 1400px) {
+ 
+	#popup {
+		width: 714px;
+		height: 446px;
+		margin: -223px auto auto -357px;
+	}
+	.specialTitle {
+    bottom: 65%;
+    font-size: 30px;
+    }
+}
+
+@media screen and (max-width: 1200px) {
+ 
+	#popup {
+		width: 700px;
+		height: 422px;
+		margin: -211px auto auto -350px;
+	}
+	.specialTitle {
+    bottom: 66%;
+    font-size: 26px;
+    }
+}
+
+/* @media screen and (max-width: 1024px) { */
+ 
+	/* #popup { */
+		/* width: 700px; */
+		/* height: 438px; */
+		/* margin: -219px auto auto -350px; */
+	/* } */
+/* } */
+@media screen and (max-width: 768px) {
+ 
+	#popup {
+		width:600px;
+		height:720px;
+		margin: -360px auto auto -300px;
+	}
+	.specialTitle {
+     bottom: 62%;
+     font-size: 26px;
+	 line-height:40px;
+    }
+	#special-gui-name{display:none;}
+}
+@media screen and (min-width:669px) and (max-width: 736px){
+	#popup {
+		width:500px;
+		height:260px;
+		margin: -130px auto auto -250px;
+	}
+	#closepop{
+		width: 32px;
+        height: 32px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 42px;
+	}
+	#title-toggle{
+		padding-top: 18px;
+		height: 42px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:42px;
+		width: 259px;
+	}
+	#gui-name{
+		font-size: 16px;
+		line-height:16px;
+	}
+	.pinTop{top:8px;}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (min-width:569px) and (max-width:667px){
+	#popup {
+		width:420px;
+		height:230px;
+		margin: -115px auto auto -210px;
+	}
+	#closepop{
+		width: 30px;
+        height: 30px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 40px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:40px;
+		width: 240px;
+	}
+	#gui-name{
+		font-size: 15px;
+		line-height:15px;
+	}
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (min-width:447px) and (max-width:568px){
+	#popup {
+		width:340px;
+		height:170px;
+		margin: -85px auto auto -170px;
+	}
+	#closepop{
+		width: 30px;
+        height: 30px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 38px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:38px;
+		width: 220px;
+	}
+	#gui-name{
+		font-size: 14px;
+		line-height:14px;
+	}
+	#musicImg .fa-2x {
+        font-size: 1.5em;
+    }
+	.pinTop{top:8px;}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (max-width:414px) {
+	#popup {
+		width: 280px;
+        height: 520px;
+        margin: -260px auto auto -140px;
+	}
+	#closepop{
+		width: 30px;
+        height: 30px;
+		background-size: contain;
+		right: 0px;
+	}
+	#model-title{
+		height: 40px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 40px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:40px;
+		width: 220px;
+	}
+	#gui-name{
+		font-size: 16px;
+		line-height:16px;
+	}
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (max-width:375px) {
+	#popup {
+		width: 252px;
+        height: 490px;
+        margin: -245px auto auto -126px;
+	}
+	#model-title{
+		height: 38px;
+	}
+	#title-toggle{
+		padding-top: 17px;
+		height: 38px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:38px;
+		width: 220px;
+	}
+	#gui-name{
+		font-size: 15px;
+		line-height:15px;
+	}
+	.pinTop{top:5px;}	
+	#model-title {
+    width: 70%;
+}
+}
+@media screen and (max-width:320px) {
+	#popup {
+		width: 200px;
+        height: 380px;
+        margin: -200px auto auto -100px;
+	}
+	#model-title{
+		height: 36px;
+	}
+	#title-toggle{
+		padding-top: 16px;
+		height: 36px;
+	}
+	.title-container{
+		padding: 16px 10px 6px;
+		height:36px;
+		width: 200px;
+	}
+	#gui-name{
+		font-size: 14px;
+		line-height:14px;
+	}
+	.pinTop{top:0px;}
+	#model-title {
+    width: 70%;
+}
+}

edit-backstage/css/oldVer/video-js.css

@@ -0,0 +1,770 @@
+/*!
+Video.js Default Styles (http://videojs.com)
+Version 4.5.1
+Create your own skin at http://designer.videojs.com
+*/
+/* SKIN
+================================================================================
+The main class name for all skin-specific styles. To make your own skin,
+replace all occurances of 'vjs-default-skin' with a new name. Then add your new
+skin name to your video tag instead of the default skin.
+e.g. <video class="video-js my-skin-name">
+*/
+.vjs-default-skin {
+  color: #cccccc;
+}
+/* Custom Icon Font
+--------------------------------------------------------------------------------
+The control icons are from a custom font. Each icon corresponds to a character
+(e.g. "\e001"). Font icons allow for easy scaling and coloring of icons.
+*/
+@font-face {
+  font-family: 'VideoJS';
+  src: url('font/vjs.eot');
+  src: url('font/vjs.eot?#iefix') format('embedded-opentype'), url('font/vjs.woff') format('woff'), url('font/vjs.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+/* Base UI Component Classes
+--------------------------------------------------------------------------------
+*/
+/* Slider - used for Volume bar and Seek bar */
+.vjs-default-skin .vjs-slider {
+  /* Replace browser focus hightlight with handle highlight */
+  outline: 0;
+  position: relative;
+  cursor: pointer;
+  padding: 0;
+  /* background-color-with-alpha */
+  background-color: #333333;
+  background-color: rgba(51, 51, 51, 0.9);
+}
+.vjs-default-skin .vjs-slider:focus {
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 2em #ffffff;
+  -moz-box-shadow: 0 0 2em #ffffff;
+  box-shadow: 0 0 2em #ffffff;
+}
+.vjs-default-skin .vjs-slider-handle {
+  position: absolute;
+  /* Needed for IE6 */
+  left: 0;
+  top: 0;
+}
+.vjs-default-skin .vjs-slider-handle:before {
+  content: "\e009";
+  font-family: VideoJS;
+  font-size: 1em;
+  line-height: 1;
+  text-align: center;
+  text-shadow: 0em 0em 1em #fff;
+  position: absolute;
+  top: 0;
+  left: 0;
+  /* Rotate the square icon to make a diamond */
+  /* transform */
+  -webkit-transform: rotate(-45deg);
+  -moz-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  -o-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+/* Control Bar
+--------------------------------------------------------------------------------
+The default control bar that is a container for most of the controls.
+*/
+.vjs-default-skin .vjs-control-bar {
+  /* Start hidden */
+  display: none;
+  position: absolute;
+  /* Place control bar at the bottom of the player box/video.
+     If you want more margin below the control bar, add more height. */
+  bottom: 0;
+  /* Use left/right to stretch to 100% width of player div */
+  left: 0;
+  right: 0;
+  /* Height includes any margin you want above or below control items */
+  height: 3.0em;
+  /* background-color-with-alpha */
+  background-color: #07141e;
+  background-color: rgba(7, 20, 30, 0.7);
+}
+/* Show the control bar only once the video has started playing */
+.vjs-default-skin.vjs-has-started .vjs-control-bar {
+  display: block;
+  /* Visibility needed to make sure things hide in older browsers too. */
+
+  visibility: visible;
+  opacity: 1;
+  /* transition */
+  -webkit-transition: visibility 0.1s, opacity 0.1s;
+  -moz-transition: visibility 0.1s, opacity 0.1s;
+  -o-transition: visibility 0.1s, opacity 0.1s;
+  transition: visibility 0.1s, opacity 0.1s;
+}
+/* Hide the control bar when the video is playing and the user is inactive  */
+.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
+  display: block;
+  visibility: hidden;
+  opacity: 0;
+  /* transition */
+  -webkit-transition: visibility 1s, opacity 1s;
+  -moz-transition: visibility 1s, opacity 1s;
+  -o-transition: visibility 1s, opacity 1s;
+  transition: visibility 1s, opacity 1s;
+}
+.vjs-default-skin.vjs-controls-disabled .vjs-control-bar {
+  display: none;
+}
+.vjs-default-skin.vjs-using-native-controls .vjs-control-bar {
+  display: none;
+}
+/* IE8 is flakey with fonts, and you have to change the actual content to force
+fonts to show/hide properly.
+  - "\9" IE8 hack didn't work for this
+  - Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
+*/
+@media \0screen {
+  .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
+    content: "";
+  }
+}
+/* General styles for individual controls. */
+.vjs-default-skin .vjs-control {
+  outline: none;
+  position: relative;
+  float: left;
+  text-align: center;
+  margin: 0;
+  padding: 0;
+  height: 3.0em;
+  width: 4em;
+}
+/* FontAwsome button icons */
+.vjs-default-skin .vjs-control:before {
+  font-family: VideoJS;
+  font-size: 1.5em;
+  line-height: 2;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
+}
+/* Replacement for focus outline */
+.vjs-default-skin .vjs-control:focus:before,
+.vjs-default-skin .vjs-control:hover:before {
+  text-shadow: 0em 0em 1em #ffffff;
+}
+.vjs-default-skin .vjs-control:focus {
+  /*  outline: 0; */
+  /* keyboard-only users cannot see the focus on several of the UI elements when
+  this is set to 0 */
+
+}
+/* Hide control text visually, but have it available for screenreaders */
+.vjs-default-skin .vjs-control-text {
+  /* hide-visually */
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+}
+/* Play/Pause
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-play-control {
+  width: 5em;
+  cursor: pointer;
+}
+.vjs-default-skin .vjs-play-control:before {
+  content: "\e001";
+}
+.vjs-default-skin.vjs-playing .vjs-play-control:before {
+  content: "\e002";
+}
+/* Volume/Mute
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-mute-control,
+.vjs-default-skin .vjs-volume-menu-button {
+  cursor: pointer;
+  float: right;
+}
+.vjs-default-skin .vjs-mute-control:before,
+.vjs-default-skin .vjs-volume-menu-button:before {
+  content: "\e006";
+}
+.vjs-default-skin .vjs-mute-control.vjs-vol-0:before,
+.vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before {
+  content: "\e003";
+}
+.vjs-default-skin .vjs-mute-control.vjs-vol-1:before,
+.vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before {
+  content: "\e004";
+}
+.vjs-default-skin .vjs-mute-control.vjs-vol-2:before,
+.vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before {
+  content: "\e005";
+}
+.vjs-default-skin .vjs-volume-control {
+  width: 5em;
+  float: right;
+}
+.vjs-default-skin .vjs-volume-bar {
+  width: 5em;
+  height: 0.6em;
+  margin: 1.1em auto 0;
+}
+.vjs-default-skin .vjs-volume-menu-button .vjs-menu-content {
+  height: 2.9em;
+}
+.vjs-default-skin .vjs-volume-level {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 0.5em;
+  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
+}
+.vjs-default-skin .vjs-volume-bar .vjs-volume-handle {
+  width: 0.5em;
+  height: 0.5em;
+}
+.vjs-default-skin .vjs-volume-handle:before {
+  font-size: 0.9em;
+  top: -0.2em;
+  left: -0.2em;
+  width: 1em;
+  height: 1em;
+}
+.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
+  width: 6em;
+  left: -4em;
+}
+/* Progress
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-progress-control {
+  position: absolute;
+  left: 0;
+  right: 0;
+  width: auto;
+  font-size: 0.3em;
+  height: 1em;
+  /* Set above the rest of the controls. */
+  top: -1em;
+  /* Shrink the bar slower than it grows. */
+  /* transition */
+  -webkit-transition: all 0.4s;
+  -moz-transition: all 0.4s;
+  -o-transition: all 0.4s;
+  transition: all 0.4s;
+}
+/* On hover, make the progress bar grow to something that's more clickable.
+    This simply changes the overall font for the progress bar, and this
+    updates both the em-based widths and heights, as wells as the icon font */
+.vjs-default-skin:hover .vjs-progress-control {
+  font-size: .9em;
+  /* Even though we're not changing the top/height, we need to include them in
+      the transition so they're handled correctly. */
+
+  /* transition */
+  -webkit-transition: all 0.2s;
+  -moz-transition: all 0.2s;
+  -o-transition: all 0.2s;
+  transition: all 0.2s;
+}
+/* Box containing play and load progresses. Also acts as seek scrubber. */
+.vjs-default-skin .vjs-progress-holder {
+  height: 100%;
+}
+/* Progress Bars */
+.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
+.vjs-default-skin .vjs-progress-holder .vjs-load-progress {
+  position: absolute;
+  display: block;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  /* Needed for IE6 */
+  left: 0;
+  top: 0;
+}
+.vjs-default-skin .vjs-play-progress {
+  /*
+    Using a data URI to create the white diagonal lines with a transparent
+      background. Surprisingly works in IE8.
+      Created using http://www.patternify.com
+    Changing the first color value will change the bar color.
+    Also using a paralax effect to make the lines move backwards.
+      The -50% left position makes that happen.
+  */
+
+  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
+}
+.vjs-default-skin .vjs-load-progress {
+  background: #646464 /* IE8- Fallback */;
+  background: rgba(255, 255, 255, 0.4);
+}
+.vjs-default-skin .vjs-seek-handle {
+  width: 1.5em;
+  height: 100%;
+}
+.vjs-default-skin .vjs-seek-handle:before {
+  padding-top: 0.1em /* Minor adjustment */;
+}
+/* Time Display
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-time-controls {
+  font-size: 1em;
+  /* Align vertically by making the line height the same as the control bar */
+  line-height: 3em;
+}
+.vjs-default-skin .vjs-current-time {
+  float: left;
+}
+.vjs-default-skin .vjs-duration {
+  float: left;
+}
+/* Remaining time is in the HTML, but not included in default design */
+.vjs-default-skin .vjs-remaining-time {
+  display: none;
+  float: left;
+}
+.vjs-time-divider {
+  float: left;
+  line-height: 3em;
+}
+/* Fullscreen
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-fullscreen-control {
+  width: 3.8em;
+  cursor: pointer;
+  float: right;
+}
+.vjs-default-skin .vjs-fullscreen-control:before {
+  content: "\e000";
+}
+/* Switch to the exit icon when the player is in fullscreen */
+.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before {
+  content: "\e00b";
+}
+/* Big Play Button (play button at start)
+--------------------------------------------------------------------------------
+Positioning of the play button in the center or other corners can be done more
+easily in the skin designer. http://designer.videojs.com/
+*/
+.vjs-default-skin .vjs-big-play-button {
+  left: 0.5em;
+  top: 0.5em;
+  font-size: 3em;
+  display: block;
+  z-index: 2;
+  position: absolute;
+  width: 4em;
+  height: 2.6em;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  opacity: 1;
+  /* Need a slightly gray bg so it can be seen on black backgrounds */
+  /* background-color-with-alpha */
+  background-color: #07141e;
+  background-color: rgba(7, 20, 30, 0.7);
+  border: 0.1em solid #3b4249;
+  /* border-radius */
+  -webkit-border-radius: 0.8em;
+  -moz-border-radius: 0.8em;
+  border-radius: 0.8em;
+  /* box-shadow */
+  -webkit-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
+  -moz-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
+  box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
+  /* transition */
+  -webkit-transition: all 0.4s;
+  -moz-transition: all 0.4s;
+  -o-transition: all 0.4s;
+  transition: all 0.4s;
+}
+/* Optionally center */
+.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
+  /* Center it horizontally */
+  left: 50%;
+  margin-left: -2.1em;
+  /* Center it vertically */
+  top: 50%;
+  margin-top: -1.4000000000000001em;
+}
+/* Hide if controls are disabled */
+.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button {
+  display: none;
+}
+/* Hide when video starts playing */
+.vjs-default-skin.vjs-has-started .vjs-big-play-button {
+  display: none;
+}
+/* Hide on mobile devices. Remove when we stop using native controls
+    by default on mobile  */
+.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button {
+  display: none;
+}
+.vjs-default-skin:hover .vjs-big-play-button,
+.vjs-default-skin .vjs-big-play-button:focus {
+  outline: 0;
+  border-color: #fff;
+  /* IE8 needs a non-glow hover state */
+  background-color: #505050;
+  background-color: rgba(50, 50, 50, 0.75);
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 3em #ffffff;
+  -moz-box-shadow: 0 0 3em #ffffff;
+  box-shadow: 0 0 3em #ffffff;
+  /* transition */
+  -webkit-transition: all 0s;
+  -moz-transition: all 0s;
+  -o-transition: all 0s;
+  transition: all 0s;
+}
+.vjs-default-skin .vjs-big-play-button:before {
+  content: "\e001";
+  font-family: VideoJS;
+  /* In order to center the play icon vertically we need to set the line height
+     to the same as the button height */
+
+  line-height: 2.6em;
+  text-shadow: 0.05em 0.05em 0.1em #000;
+  text-align: center /* Needed for IE8 */;
+  position: absolute;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+/* Loading Spinner
+--------------------------------------------------------------------------------
+*/
+.vjs-loading-spinner {
+  display: none;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  font-size: 4em;
+  line-height: 1;
+  width: 1em;
+  height: 1em;
+  margin-left: -0.5em;
+  margin-top: -0.5em;
+  opacity: 0.75;
+  /* animation */
+  -webkit-animation: spin 1.5s infinite linear;
+  -moz-animation: spin 1.5s infinite linear;
+  -o-animation: spin 1.5s infinite linear;
+  animation: spin 1.5s infinite linear;
+}
+.vjs-default-skin .vjs-loading-spinner:before {
+  content: "\e01e";
+  font-family: VideoJS;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 1em;
+  height: 1em;
+  text-align: center;
+  text-shadow: 0em 0em 0.1em #000;
+}
+@-moz-keyframes spin {
+  0% {
+    -moz-transform: rotate(0deg);
+  }
+  100% {
+    -moz-transform: rotate(359deg);
+  }
+}
+@-webkit-keyframes spin {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(359deg);
+  }
+}
+@-o-keyframes spin {
+  0% {
+    -o-transform: rotate(0deg);
+  }
+  100% {
+    -o-transform: rotate(359deg);
+  }
+}
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(359deg);
+  }
+}
+/* Menu Buttons (Captions/Subtitles/etc.)
+--------------------------------------------------------------------------------
+*/
+.vjs-default-skin .vjs-menu-button {
+  float: right;
+  cursor: pointer;
+}
+.vjs-default-skin .vjs-menu {
+  display: none;
+  position: absolute;
+  bottom: 0;
+  left: 0em;
+  /* (Width of vjs-menu - width of button) / 2 */
+
+  width: 0em;
+  height: 0em;
+  margin-bottom: 3em;
+  border-left: 2em solid transparent;
+  border-right: 2em solid transparent;
+  border-top: 1.55em solid #000000;
+  /* Same width top as ul bottom */
+
+  border-top-color: rgba(7, 40, 50, 0.5);
+  /* Same as ul background */
+
+}
+/* Button Pop-up Menu */
+.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content {
+  display: block;
+  padding: 0;
+  margin: 0;
+  position: absolute;
+  width: 10em;
+  bottom: 1.5em;
+  /* Same bottom as vjs-menu border-top */
+
+  max-height: 15em;
+  overflow: auto;
+  left: -5em;
+  /* Width of menu - width of button / 2 */
+
+  /* background-color-with-alpha */
+  background-color: #07141e;
+  background-color: rgba(7, 20, 30, 0.7);
+  /* box-shadow */
+  -webkit-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
+  -moz-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
+  box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
+}
+.vjs-default-skin .vjs-menu-button:hover .vjs-menu {
+  display: block;
+}
+.vjs-default-skin .vjs-menu-button ul li {
+  list-style: none;
+  margin: 0;
+  padding: 0.3em 0 0.3em 0;
+  line-height: 1.4em;
+  font-size: 1.2em;
+  text-align: center;
+  text-transform: lowercase;
+}
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected {
+  background-color: #000;
+}
+.vjs-default-skin .vjs-menu-button ul li:focus,
+.vjs-default-skin .vjs-menu-button ul li:hover,
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover {
+  outline: 0;
+  color: #111;
+  /* background-color-with-alpha */
+  background-color: #ffffff;
+  background-color: rgba(255, 255, 255, 0.75);
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 1em #ffffff;
+  -moz-box-shadow: 0 0 1em #ffffff;
+  box-shadow: 0 0 1em #ffffff;
+}
+.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
+  text-align: center;
+  text-transform: uppercase;
+  font-size: 1em;
+  line-height: 2em;
+  padding: 0;
+  margin: 0 0 0.3em 0;
+  font-weight: bold;
+  cursor: default;
+}
+/* Subtitles Button */
+.vjs-default-skin .vjs-subtitles-button:before {
+  content: "\e00c";
+}
+/* Captions Button */
+.vjs-default-skin .vjs-captions-button:before {
+  content: "\e008";
+}
+/* Replacement for focus outline */
+.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before,
+.vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before {
+  /* box-shadow */
+  -webkit-box-shadow: 0 0 1em #ffffff;
+  -moz-box-shadow: 0 0 1em #ffffff;
+  box-shadow: 0 0 1em #ffffff;
+}
+/*
+REQUIRED STYLES (be careful overriding)
+================================================================================
+When loading the player, the video tag is replaced with a DIV,
+that will hold the video tag or object tag for other playback methods.
+The div contains the video playback element (Flash or HTML5) and controls,
+and sets the width and height of the video.
+
+** If you want to add some kind of border/padding (e.g. a frame), or special
+positioning, use another containing element. Otherwise you risk messing up
+control positioning and full window mode. **
+*/
+.video-js {
+  background-color: #000;
+  position: relative;
+  padding: 0;
+  /* Start with 10px for base font size so other dimensions can be em based and
+     easily calculable. */
+
+  font-size: 10px;
+  /* Allow poster to be vertially aligned. */
+
+  vertical-align: middle;
+  /*  display: table-cell; */
+  /*This works in Safari but not Firefox.*/
+
+  /* Provide some basic defaults for fonts */
+
+  font-weight: normal;
+  font-style: normal;
+  /* Avoiding helvetica: issue #376 */
+
+  font-family: Arial, sans-serif;
+  /* Turn off user selection (text highlighting) by default.
+     The majority of player components will not be text blocks.
+     Text areas will need to turn user selection back on. */
+
+  /* user-select */
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+/* Playback technology elements expand to the width/height of the containing div
+    <video> or <object> */
+.video-js .vjs-tech {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
+   checking fullScreenEnabled. */
+.video-js:-moz-full-screen {
+  position: absolute;
+}
+/* Fullscreen Styles */
+body.vjs-full-window {
+  padding: 0;
+  margin: 0;
+  height: 100%;
+  /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
+  overflow-y: auto;
+}
+.video-js.vjs-fullscreen {
+  position: fixed;
+  overflow: hidden;
+  z-index: 1000;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  width: 100% !important;
+  height: 100% !important;
+  /* IE6 full-window (underscore hack) */
+  _position: absolute;
+}
+.video-js:-webkit-full-screen {
+  width: 100% !important;
+  height: 100% !important;
+}
+.video-js.vjs-fullscreen.vjs-user-inactive {
+  cursor: none;
+}
+/* Poster Styles */
+.vjs-poster {
+  background-repeat: no-repeat;
+  background-position: 50% 50%;
+  background-size: contain;
+  cursor: pointer;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  position: relative;
+  width: 100%;
+}
+.vjs-poster img {
+  display: block;
+  margin: 0 auto;
+  max-height: 100%;
+  padding: 0;
+  width: 100%;
+}
+/* Hide the poster when native controls are used otherwise it covers them */
+.video-js.vjs-using-native-controls .vjs-poster {
+  display: none;
+}
+/* Text Track Styles */
+/* Overall track holder for both captions and subtitles */
+.video-js .vjs-text-track-display {
+  text-align: center;
+  position: absolute;
+  bottom: 4em;
+  /* Leave padding on left and right */
+  left: 1em;
+  right: 1em;
+}
+/* Move captions down when controls aren't being shown */
+.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
+  bottom: 1em;
+}
+/* Individual tracks */
+.video-js .vjs-text-track {
+  display: none;
+  font-size: 1.4em;
+  text-align: center;
+  margin-bottom: 0.1em;
+  /* Transparent black background, or fallback to all black (oldIE) */
+  /* background-color-with-alpha */
+  background-color: #000000;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+.video-js .vjs-subtitles {
+  color: #ffffff /* Subtitles are white */;
+}
+.video-js .vjs-captions {
+  color: #ffcc66 /* Captions are yellow */;
+}
+.vjs-tt-cue {
+  display: block;
+}
+/* Hide disabled or unsupported controls */
+.vjs-default-skin .vjs-hidden {
+  display: none;
+}
+.vjs-lock-showing {
+  display: block !important;
+  opacity: 1;
+  visibility: visible;
+}
+/* -----------------------------------------------------------------------------
+The original source of this file lives at
+https://github.com/videojs/video.js/blob/master/src/css/video-js.less */

edit-backstage/css/popupwindow.css

@@ -0,0 +1,284 @@
+button::-moz-focus-inner,input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner {border-color: transparent;}
+input:required:invalid {box-shadow: none;}
+.footer-btn-double{ display: none; }
+.dialog,
+.dialog__overlay {
+	width: 100%;
+	height: 100vh;
+	top: 0;
+	left: 0;
+	z-index: 11;
+}
+.dialog-2,.dialog__overlay{ z-index: 999; }
+.dialog {
+	font-family: "Microsoft YaHei";
+    letter-spacing: 0.02em;
+	position: fixed;
+	display: -webkit-flex;
+	display: flex;
+	-webkit-align-items: center;
+	align-items: center;
+	-webkit-justify-content: center;
+	justify-content: center;
+	pointer-events: none;
+}
+
+.dialog__overlay {
+	position: absolute;
+	z-index: 1;
+	background: rgba(55, 58, 71, 0.9);
+	opacity: 0;
+	-webkit-transition: opacity 0.3s;
+	transition: opacity 0.3s;
+	-webkit-backface-visibility: hidden;
+}
+
+.dialog--open .dialog__overlay {
+	opacity: 0.5;
+	pointer-events: auto;
+}
+
+.dialog__content {
+	text-align: center;
+	position: relative;
+	z-index: 5;
+	opacity: 0;
+	font-size: 75px;
+}
+
+.dialog--open .dialog__content {
+	pointer-events: auto;
+}
+
+.dialog.dialog--open .dialog__content,
+.dialog.dialog--close .dialog__content {
+	-webkit-animation-duration: 1s;
+	animation-duration: 1s;
+	-webkit-animation-timing-function: linear;
+	animation-timing-function: linear;
+	-webkit-animation-fill-mode: forwards;
+	animation-fill-mode: forwards;
+}
+
+.dialog.dialog--open .dialog__content {
+	-webkit-animation-name: anim-open;
+	animation-name: anim-open;
+}
+
+.dialog.dialog--close .dialog__content {
+	-webkit-animation-name: anim-close;
+	animation-name: anim-close;
+	-webkit-animation-duration: 0.3s;
+	animation-duration: 0.3s;
+	-webkit-animation-timing-function: ease-out;
+	animation-timing-function: ease-out;
+}
+
+.dialog--open .password,.dialog--open .password2{ display: block; }
+.password,.password2{ display: none; }
+
+
+/*弹出提示框的样式*/
+.prompt-popup a{
+	text-decoration: none;
+	color:white;
+}
+
+.prompt-popup{
+	z-index: 999;
+	width: 6.666667em;
+	height: 3.853333em;
+	color: #333333;
+	border-radius:5px;
+	-moz-border-radius:5px;
+	-webkit-border-radius:5px;	
+	background: white;
+	position: relative;
+	padding: 0 0.666667em;
+ 
+}
+.prompt-title{
+	display: flex;
+	display: -webkit-flex;
+	padding-top: 0.666667em;
+}
+.footer-btn-single span, .prompt-second-pg { font-size: 0.186667em; }
+.prompt-title a{
+	font-size:0.186667em;
+}
+.prompt-title h2{
+	font-size: 0.32em;
+	font-weight:600;
+	margin: 0px;
+}
+.prompt-second{padding-left: 0.066667em; font-size: 0.186667rem;}
+.prompt-main{
+	margin-top: 0.266667em;
+	height: 1.0em;
+	display: flex;
+	display: -webkit-flex;
+	align-items: center;
+	border-bottom: 2px solid #eeeeee;
+	border-top: 2px solid #eeeeee;
+	font-weight: bold;
+}
+.prompt-main span{ font-size: 0.186667em; }
+.prompt-title-close{position: absolute; top: 0.2em; display: flex;right: 0.2em;}
+.prompt-footer{
+	height: 1.12em;
+	display: flex;
+	display: -webkit-flex;
+	justify-content: center;
+	align-items: flex-end;
+}
+.prompt-footer a{
+	width: 1.6em;
+	height: 0.64em;
+	background:  #09e1c0;
+	line-height: 0.64em;
+	display: inline-flex;
+	justify-content:center;
+}
+.prompt-footer a:hover{
+	background: #45edd3;
+}
+.footer-btn-back{ background: #ccc !important; }
+.footer-btn-back span{font-size:0.186667em;}
+.footer-btn-confirm span{font-size:0.186667em;}
+.footer-btn-confirm{ margin-left: 0.266667em; }
+
+
+/* Content */
+@-webkit-keyframes anim-open {
+	0% { opacity: 0; -webkit-transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	2.083333% { -webkit-transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	4.166667% { -webkit-transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	6.25% { -webkit-transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	8.333333% { -webkit-transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	10.416667% { -webkit-transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	12.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	14.583333% { -webkit-transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	16.666667% { -webkit-transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	18.75% { -webkit-transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	20.833333% { -webkit-transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	22.916667% { -webkit-transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	25% { -webkit-transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	27.083333% { -webkit-transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	29.166667% { -webkit-transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	31.25% { -webkit-transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	33.333333% { -webkit-transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	35.416667% { -webkit-transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	37.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	39.583333% { -webkit-transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	41.666667% { -webkit-transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	43.75% { -webkit-transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	45.833333% { -webkit-transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	47.916667% { -webkit-transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	50% { opacity: 1; -webkit-transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	52.083333% { -webkit-transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	54.166667% { -webkit-transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	56.25% { -webkit-transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	58.333333% { -webkit-transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	60.416667% { -webkit-transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	62.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	64.583333% { -webkit-transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	66.666667% { -webkit-transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	68.75% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	70.833333% { -webkit-transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	72.916667% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	75% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	77.083333% { -webkit-transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	79.166667% { -webkit-transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	81.25% { -webkit-transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	83.333333% { -webkit-transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	85.416667% { -webkit-transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	87.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	89.583333% { -webkit-transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	91.666667% { -webkit-transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	93.75% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	95.833333% { -webkit-transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	97.916667% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	100% { opacity: 1; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+}
+
+@keyframes anim-open {
+	0% { opacity: 0; -webkit-transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	2.083333% { -webkit-transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	4.166667% { -webkit-transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	6.25% { -webkit-transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	8.333333% { -webkit-transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	10.416667% { -webkit-transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	12.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	14.583333% { -webkit-transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	16.666667% { -webkit-transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	18.75% { -webkit-transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	20.833333% { -webkit-transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	22.916667% { -webkit-transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	25% { -webkit-transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	27.083333% { -webkit-transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	29.166667% { -webkit-transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	31.25% { -webkit-transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	33.333333% { -webkit-transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	35.416667% { -webkit-transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+
+	37.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	39.583333% { -webkit-transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	41.666667% { -webkit-transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	43.75% { -webkit-transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	45.833333% { -webkit-transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	47.916667% { -webkit-transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	50% { opacity: 1; -webkit-transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	52.083333% { -webkit-transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	54.166667% { -webkit-transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	56.25% { -webkit-transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	58.333333% { -webkit-transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	60.416667% { -webkit-transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	62.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	64.583333% { -webkit-transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	66.666667% { -webkit-transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	68.75% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	70.833333% { -webkit-transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	72.916667% { -webkit-transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	75% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	77.083333% { -webkit-transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	79.166667% { -webkit-transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	81.25% { -webkit-transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	83.333333% { -webkit-transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	85.416667% { -webkit-transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	87.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	89.583333% { -webkit-transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	91.666667% { -webkit-transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	93.75% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	95.833333% { -webkit-transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	97.916667% { -webkit-transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+	100% { opacity: 1; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+}
+
+@-webkit-keyframes anim-close {
+	0% { opacity: 1; }
+	100% { opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); }
+}
+
+@keyframes anim-close {
+	0% { opacity: 1; }
+	100% { opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); }
+}
+
+@media screen and (min-width: 1705px)  and  (max-width: 1805px) {
+  .dialog__content{font-size: 72px;}
+}
+@media screen and (min-width: 1605px)  and  (max-width: 1705px) {
+  .dialog__content{font-size: 68px;}
+}
+@media screen and (min-width: 1505px)  and  (max-width: 1605px) {
+  .dialog__content{font-size: 65px;}
+}
+@media screen and (min-width: 1405px)  and  (max-width: 1505px) {
+  .dialog__content{font-size: 61px;}
+}
+@media screen and (min-width: 1305px)  and  (max-width: 1405px) {
+  .dialog__content{font-size: 58px;}
+}
+@media screen and  (max-width: 1305px) {
+  .dialog__content{font-size: 55px;}
+}

edit-backstage/css/toolBox.css

@@ -0,0 +1,803 @@
+@font-face {font-family: "SourceHanSansCN";src: url("../fonts/SourceHanSansCN.woff2") format("woff2"),url("../fonts/SourceHanSansCN.woff") format("woff"),url("../fonts/SourceHanSansCN.ttf") format("truetype");font-weight: normal;font-style: normal;}
+/* html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden;font-size: 75px;}
+@media screen and (min-width: 1705px)  and  (max-width: 1805px) {
+  html{font-size: 72px;}
+}
+@media screen and (min-width: 1605px)  and  (max-width: 1705px) {
+  html{font-size: 68px;}
+}
+@media screen and (min-width: 1505px)  and  (max-width: 1605px) {
+  html{font-size: 65px;}
+}
+@media screen and (min-width: 1405px)  and  (max-width: 1505px) {
+  html{font-size: 61px;}
+}
+@media screen and (min-width: 1305px)  and  (max-width: 1405px) {
+  html{font-size: 58px;}
+}
+@media screen and  (max-width: 1305px) {
+  html{font-size: 55px;}
+  }
+} */
+
+ html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden; }
+
+
+
+*{box-sizing: border-box; font-family:OpenSans, "Microsoft YaHei";   background-size: contain;  background-repeat: no-repeat; background-position: center center; }
+.editor a{text-decoration: none;color:#333333;}
+.editor ul li{display: inline-block;list-style: none; width:100%}
+.editor ul{margin: 0px;padding: 0px;}
+.editor input,textarea{font: 14px "Microsoft YaHei";}
+.editor input[type="text"]:focus{border: 1px solid #09e1c0;}
+
+.scrollBox{width: 282px;height: 100%;}
+.scrollBox:nth-child(n+3){display: none;}
+.introduce-top{color: white;font-family:"Microsoft YaHei"; font-size:14px;margin:10px 0 0 10px;z-index:60;position: absolute;left: 0;top: 0;width: auto;height: 48px;}
+.introduce-top .introduce-button{padding-right: 25px;filter: drop-shadow(0px 1px 1px rgba(153,153,153,1));border-radius: 5px;background: url("../images/introduce_close.png") no-repeat;background-size: 16px; transition:background-color 0.3s; background-position:100% 50%;padding-left:0px;width:100%;height:48px;display:flex;display:-webkit-flex;font-size:16px;align-items:center; cursor:pointer;}
+.introduce-button a{display: inline-block;}
+.introduce-button .introduce-button-fImg{width: 30px;height: auto;margin-right:6px;}
+.introduce-button .introduce-button-lImg{width:1px;height:auto;margin-right:5px;}
+.introduce-top.open .introduce-button{background-image:url("../images/introduce_open.png")}
+.introduce-top .addIntroduce-bg{background: url("../images/introduce_close.png") no-repeat rgba(0,0,0,0.45);background-size: 16px;background-position:94% 50%;}
+.introduce-top .introduce-button span{margin-left:6px;letter-spacing:1px; font-weight:600;font-size:16px;margin-top: 2px;}
+.introduce-top .introduce-detailBox h3{font-size:12px; margin-bottom: 13px; font-weight:600;}
+.introduce-top .introduce-detailBox span{    line-height: 22px;text-align: justify;word-break: break-all;color: white;}
+.introduce-top .introduce-detailBox{position: absolute;border-radius: 3px;max-height:0px;width:320px;margin-top:5px;margin-left:41px;overflow:hidden;transition:max-height 0.25s ease-out;transform: translate3d(0, 0, 0);}
+.introduce-top.open .introduce-detailBox{max-height: 600px;}
+.introduce-top .introduce-detail{text-align:justify;width:100%;letter-spacing:1px;word-wrap: break-word;padding:14px 12px 14px 14px;background:rgba(0,0,0,0.2);}
+.introduce-top .introduce-detail p{text-align: justify;font-weight:400;line-height: 22px;word-break: break-all;color: white;}
+.bgNone{background: none !important;}
+.divNone{display: none !important;}
+ 
+.introduce-top .introduce-detail a,  #hotspot a{ text-decoration: underline !important; color:#fff !important;  margin: 0 2px !important; padding: 0 !important;       }
+.introduce-top .introduce-detail a *{color:#fff !important; }
+/* #hotspot .picBottom a,#hotspot .picRight a,#hotspot .formInfo a{color:#2d2d2d !important;}   */
+.introduce-top .introduce-detail a:hover,  #hotspot a:hover{color:#09e1c0 !important;}
+.introduce-top .introduce-detail a:hover *,  #hotspot a:hover *{color:#09e1c0 !important;}
+
+.toolTop{width: 282px;height: 48px;background: #5a45df;position: absolute;top: 0px;right: 0px;z-index: 150;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.toolTop>div:nth-child(2){display:flex;display:-webkit-flex;align-items:center;font-size:16px;font-weight:bold;  overflow: hidden;}
+.toolTop>div:nth-child(2)>*{ 
+   white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.toolTop-button{display:flex;display:-webkit-flex;width:282px;}
+.toolTop-button>div{opacity:0.7;cursor: pointer;display:flex;display:-webkit-flex;width:94px;height:48px;align-items:center;justify-content:center;}
+.toolTop-button>div:hover{opacity:1;}
+.toolTop-button span{margin-left:5px;font-size:16px;color:#fafafa;}
+.editor{letter-spacing:0.1em;z-index:140;font: 14px "Microsoft YaHei";font-weight:400;color: #333333;width: 282px;height: 100%;background: #f5f5f5;position: absolute;right: 0px;top: 0px;padding-top:48px;box-shadow: 0px 0px 6px #666;-webkit-box-shadow: 0px 0px 6px #666;-moz-box-shadow: 0px 0px 6px #666;}
+.toolBox,.informationBox, .hotPointBox,.styleZBox{margin-top:48px;height:calc(100% - 106px);width:calc(100% + 12px);overflow-y:auto;overflow-x:hidden;    }
+.toolContent,.hotPoint_content,.information_content,.styleZ_content{position: relative; width: 282px;}
+.toolBox_Top{position: absolute;right: 0px;width: 100%;display: flex;display: -webkit-flex;border-bottom:1px solid #ddd;}
+.styleZ_content h3{font-size: 14px;font-weight:normal;margin:20px;}
+.styleZ_content>ul{display:flex;display:-webkit-flex;flex-direction:column;padding:0px 20px;}
+.styleZ_content>ul li{cursor: pointer;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;margin-bottom:10px;border:1px solid #ddd;border-radius:6px;padding:5px;}
+.styleZ-select{position:relative;width:46%;display:flex;display:-webkit-flex;justify-content:center;}
+.styleZ-select:before{content:"";position:absolute;top:50%;margin-top:-6px;left:15px;width:14px;height:14px;border-radius:7px;border:1px solid #ddd;}
+.styleZ_content>ul li:hover{background: #fafafa;}
+.styleZ_content>ul li.active{background:white;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:before{background:#09e1c0;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:after{content:"";position:absolute;top:50%;margin-top:-2.5px;left:18.5px;width:6px;height:6px;border-radius:7px;background:white;}
+.toolBox_Top input{background: #fff !important;transition:background 0.1s;letter-spacing:0.1em;display: inline-block;width: 25%;height: 48px;color: #999999;font: 16px initial;background: white;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border:none;cursor: pointer;}
+.toolBox_Top input:hover,.toolBox-Top-input{background: #fafafa !important;color:#333333 !important;}
+.toolBox_Top .toolBox_nav{position: relative;width: 100%;height: 100%;display: flex;display: -webkit-flex;}
+.toolBox_Top .toolBox_nav:before{content: "";background: #09e1c0;height: 2px;width:25%;position: absolute;bottom:0px;left:0px;transition:left 0.26s ease-out;}
+.toolBox_Top .toolBox_nav-left0:before{left: 0px;}
+.toolBox_Top .toolBox_nav-left1:before{left: 25%;}
+.toolBox_Top .toolBox_nav-left2:before{left: 50%;}
+.toolBox_Top .toolBox_nav-left3:before{left: 75%;}
+.function{width: 282px;height: 48px;border-top: 1px solid #cccccc;border-bottom: 1px solid #ddd;margin-top: 20px;}
+.function ul{display: flex;display: -webkit-flex;}
+.function li{width: 94px;height: 48px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.function li img{vertical-align:baseline;}
+.function li>a{color: #333;display:  flex;display: -webkit-flex;justify-content:  center;align-items:  center;}
+.function li:hover{opacity:0.7;}
+.function li:nth-child(1) span,.function li:nth-child(2) span{padding-left: 5px;}
+#export{display: inline-block;width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;line-height: 28px;}
+#export:hover{background: #22f0d0;}
+#draw_Tools a{position:relative;}
+#draw_Tools a:before{position:absolute;top:0px;left:0px;content:"";width:60px;height:60px;transition:border 0.2s ease-in-out;}
+.draw_Tools-a:before{border:1px solid #09e1c0;}
+.Basic_drawing ul{padding-top: 20px;display: flex;display: -webkit-flex;}
+.Basic_drawing ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;}
+.doors_windows{border-bottom: 1px solid #ddd;padding-bottom: 18px;}
+.doors_windows ul{display: flex;display: -webkit-flex;flex-wrap: wrap;}
+.doors_windows ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;padding-top: 16px;}
+.Basic_drawing span,.doors_windows span{letter-spacing: 2px;margin-top: 8px;color: #333;}
+.controlBox{padding-top:28px;width: 282px;height:80px;border-bottom: 1px solid #cccccc;transition: all 1s linear;display: none;opacity: 0;}
+#controlName{padding-left: 20px;font-size: 16px;}
+.controlBox a{position: absolute;right: 20px;color:#cccccc;}
+.controlBox a:hover{color:#999999;}
+#pjtName{width: 100%;}
+#edit2Box,#edit1Box{width: 100%;height: 84px;position:relative;background: white;}
+#edit2,#edit1{width:100%;height:100%;overflow: hidden;border: 1px solid white;}
+#edit2Box .w-e-toolbar,#edit1Box .w-e-toolbar{position:absolute;bottom: 4px;right: 4px;padding: 0px;width: 20px;height: 20px;}
+#edit2Box .w-e-menu,#edit1Box .w-e-menu{padding: 0px;}
+#edit2Box .w-e-text,#edit1Box .w-e-text{width: calc(100% + 20px) !important;word-break: break-all;overflow-y: scroll;padding: 0px 30px 0px 10px; -webkit-user-select:auto;}
+#edit2Box .w-e-text *,#edit1Box .w-e-text *{-webkit-user-select:text;} 
+
+#edit2Box .w-e-icon-link,#edit1Box .w-e-icon-link{position:relative;display: block;width: 20px;height: 20px;}
+#edit2Box .w-e-text a,#edit1Box .w-e-text a{color:#079eec;text-decoration:underline;}
+#edit2Box .w-e-text-container,#edit1Box .w-e-text-container{position: static;}
+#edit2Box .w-e-icon-link:before,#edit1Box .w-e-icon-link:before{background: url("../images/linkBtn.png") no-repeat center;width: 20px;height: 20px;position: absolute;top: 0px;left: 0px;background-size: cover;}
+#edit2Box .w-e-text-container .w-e-panel-container,#edit1Box .w-e-text-container .w-e-panel-container{box-shadow: 1px 1px 2px #ccc;z-index: 99;top: 92px;}
+#edit2Box .addLink-content-row,#edit1Box .addLink-content-row{display:flex;display:-webkit-flex;justify-content:space-between;font-size:14px;height: 25px;}
+#edit2Box .addLink-content-row span,#edit1Box .addLink-content-row span{color:#999;}
+#edit2Box .addLink-content input,#edit1Box .addLink-content input{height:28px;border:1px solid #09e1c0;margin:0px 0px 6px}
+#edit2Box h5,#edit1Box h5{font-size:12px;font-weight:normal;color:#999;margin-bottom:20px;}
+#edit2Box .addLink-cancel,#edit1Box .addLink-cancel{width:75px;height:28px;background:#ccc;border-radius:0px;color:white;margin-left:10px}
+#edit2Box .addLink-cancel:hover,#edit1Box .addLink-cancel:hover{background: #d1d1d1;}
+#edit2Box .w-e-button-container,#edit1Box .w-e-button-container{display:flex;display:-webkit-flex;justify-content:flex-end;}
+#edit1Box .w-e-panel-tab-content:after,#edit2Box .w-e-panel-tab-content:after{position:absolute;width:0px;height:0px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #777;top:-46px;right:15px;content:"";}
+
+
+/* 画墙一栏*/
+
+.information-subDiv{padding: 20px 0px;margin: 0px 20px;border-bottom: 1px solid #ddd;}
+.editor .information-subDiv ul li{display:flex;display:-webkit-flex;justify-content: space-between;}
+.information-subDiv:first-child li{flex-direction:column;margin-bottom: 20px;}
+.information-subDiv:first-child span{margin-bottom: 6px;}
+.information-subDiv:last-child{ border-bottom:  none;}
+.information-subDiv:last-child li:first-child{margin-bottom:4px;}
+.information_input{width: 282px;}
+.information_input input[type="file"]{position: relative;display: none;}
+.information_input input{width: 160px;height: 28px;font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;}
+.information_input input::placeholder{font-size: 14px;color:#cccccc;}
+.information_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input[type="button"]{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;margin-top:10px;}
+.information_input input[type="button"]:hover{background: #22f0d0;}
+.information_show ul{display: flex;display: -webkit-flex;flex-direction: column;padding: 20px 0px;margin: 0 20px;}
+.information_show ul li{height: 28px;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.information_input .right{    position: relative; width: 160px;  font-size: 14px;line-height: 28px;} 
+.information_input input, .information_input label{outline: none;background-color:#fff;padding: 0 10px;color: #999999;}
+.close_linkDiv{position: absolute;bottom: 10px;right: 10px;width: 75px;height: 28px;cursor: pointer;z-index: 99999;}
+#setEntry .ImgPreview{height:80px;}
+.information_input label{cursor:pointer;}
+.show_title{padding-left: 0 !important;}
+.show_data{color: #999999;display: flex;display: -webkit-flex;flex-direction: row-reverse;}
+.show_count{color: #999}
+.show_data span{padding-right: 5px;}
+/* 信息一栏*/.hotPointBox{overflow-y:hidden} 
+#ok{width:100%;height: 48px;display:none;text-align:center;line-height:48px;cursor:pointer;background: #09e1c0;color:#fff;}
+#ok:hover{background: #14ebca}
+.hotPoint_content{height: 100%;}
+.hotPoint_content .point>*{height: 40px;display: flex;display: -webkit-flex;width: 282px;align-items:center;justify-content: space-between;border-bottom: 1px #ddd solid;padding-left: 20px;color: #999;/* opacity: 0.6;*/cursor: pointer;display:none;background:#fafafa;}
+.hotPoint_content #listPoint{display:flex;-webkit-box-flex: 1;}
+.hotPoint_content #listPoint>*{display:flex;}
+.hotPoint_content #listPoint>div:first-child{border-right:1px solid #eeeeee;}
+.hotPoint_content #listPoint>div:hover{background: #fff;}
+.hotPoint_content .point>* div{display: flex;display: -webkit-flex;align-items: center;}
+.hotPoint_content .point>* span{padding-left: 5px;}
+.hotPoint_content .point>* a{padding-right: 20px;}
+/* .hotPoint_content .point>*:hover{opacity: 1;}*/
+#snap{padding:20px 0px;display: flex;display: -webkit-flex;align-items: center;flex-direction: column;}
+#hotPoint_button{background: #09e1c0;height: 48px;display: flex;display: -webkit-flex;width:242px;align-items: center;justify-content: center;color: white;cursor: pointer;transition: background 0.2s;}
+#hotPoint_button.unable{pointer-events: none;/* opacity:0.5;*/cursor:default;background: #ddd;}
+#hotPoint_button span{padding-left: 5px;}
+#hotPoint_button:hover{background: #14ebca;}
+#hotPoint_input{display:none;width: 282px;border-bottom: 1px #ddd solid; max-height: 800px;transition: max-height .3s; overflow: hidden;}
+#hotPoint_input #change{display:flex;-webkit-box-flex: 1;text-align:center;border-bottom:1px solid #ddd;height:40px;width:100%;}
+#hotPoint_input #change>div{cursor:pointer;width: 100%;height: 100%;line-height: 40px;}
+#hotPoint_input #change>div:first-child{border-right:1px solid #eeeeee;}
+#hotPoint_input #change>div:hover{background: #fff;}
+#hotPoint_input>ul{padding:8px 20px 15px;display: flex;display: -webkit-flex;flex-wrap: wrap;background: #eee;}
+.hotPoint-title{position: relative;}
+.hotPoint-title:after{position: absolute;top: 0px;right: -10px;content: "*";color:#f56c6c;}
+#hotPoint_input>ul>li{position: relative;padding: 5px 0;line-height:30px;display: flex;display: -webkit-flex;flex-basis: 100%;align-items:center;justify-content: space-between;align-items: flex-start;}
+#hotPoint_input>ul>li.warn input{border: 1px solid #f56c6c;}
+#hotPoint_input>ul>li.warn input::placeholder{color: #f56c6c !important;}
+.redPoint{position:relative;}
+.hotPoint_content .redPoint:after{position: absolute;top: 0px;left: 32px;content: "*";color:#f56c6c;}
+.information_input .redPoint:after{position: absolute;top: 0px;left: 62.5px;content: "*";color:#f56c6c;}
+#type .redPoint:after{left:32px}
+#hotPoint_input .unComplete{display:none; color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 12px;right: 10px;}
+.information_input .unComplete{display: none;color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 16px;right: 28px;}
+#project-name2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-intro2{position:relative;}
+#project-intro2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-name1,#project-intro1{position:relative;width:100%;}
+#project-name1:before,#project-intro1:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+
+#hotPoint_input>ul>li span{margin-top:5px;}
+#hotPoint_input input[type="file"]{position: relative;display: none;}
+*{outline:none}
+#hotPoint_input input.white,textarea.white{font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;resize: vertical;}
+#hotPoint_input .ImgPreview,.information_input .ImgPreview{width:160px;height:114px;background-repeat: no-repeat;background-position: center center; margin-top: 10px;background-size: contain;/* border: 1px solid white;*/}
+#showInformation{height:80px;position:  relative;}
+.showInformation-error:after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background:url("../images/pic_error.png") no-repeat center;}
+#hotPoint_input>ul>li:nth-child(n+6){padding:0px}
+#select{display: inline-block;position:relative;background:#eee;}
+#select .showStyle{background:#eee;position:absolute;top:0px;left:0px;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;width:160px;height:30px;}
+#select .showStyle>div:first-child{display:flex;display:-webkit-flex;align-items:center;}
+#select .showStyle>div:first-child img{margin-top:-1px}
+#hotPoint_input>ul>li:nth-child(5){margin-top:-11px;}
+#hotPoint_input>ul>li:nth-child(6){margin-top:-8px;}
+#select .showStyle p{margin-left:5px;      cursor: default;}
+#styleBtn{opacity: 0.7;width:16px;height:16px;background:url("../images/styleBtn.png") no-repeat;cursor: pointer;}
+#styleBtn:hover{opacity: 1;}
+#select ul{display: none;padding:10px 30px 15px 10px;font-size:12px;width: 160px;z-index: 15;position:absolute;background: white;box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-webkit-box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-moz-box-shadow:0px 1px 6px 1px rgba(51,51,51,0.3);left:0px;top:30px;flex-wrap:wrap;}
+#select ul li:nth-child(3),#select ul li:nth-child(4){margin-top:20px}
+#select ul li:nth-child(3):after{position:absolute;content:"";top:-10px;left:0px;width:140px;height:1px;background:#ddd;}
+#select ul li span{margin-top:2px;}
+#select.open #styleBtn{opacity: 0.7;}
+#select.open ul{display:flex;display:-webkit-flex;}
+#select ul li{ margin-right: 2px;cursor: pointer;display:flex;display:-webkit-flex;flex-direction:column; padding-top: 4px;align-items:center; width:46px; height:61px;position:relative;/* float: left; */}#select ul li:before{position:absolute;content:"";left:0px;top:0px; width:46px;height:64px;}#select ul li:hover:before{border:1px solid #ddd;}
+#select span{line-height:15px;}
+.information_input>ul>li:nth-child(4):before{position:absolute;content:"标志大小";bottom:17px;left:20px;}
+#hotPoint_input>ul>li:nth-child(1){line-height:20px}
+#hotPoint_input>ul>li:nth-child(4){line-height:16px}
+.hotPoint_content .point>div.chosen{color:#333;background:#fff;}
+.hotPoint_content .point .coordinate{background-image:url(../images/coordinate2.png);height: 16px;width: 16px;}
+.hotPoint_content .point>div.chosen .coordinate{background-image:url(../images/coordinate.png);}
+.hotPoint_content .point .delete{/* height:46px;width:46px;background-repeat: no-repeat;background-position: center center;background-image:url(../images/coordinateClose.png);background-size: initial;*/border-radius: 7px;height: 14px;width: 14px;margin-right: 14px;padding: 2px;font-size: 12px;background:transparent;transition: background 0.3s;}
+.hotPoint_content .point>div .delete::before{font-family: "FontAwesome";content: "\f00d";color: #bababa;transition: color 0.3s;}
+.hotPoint_content .point>div .delete:hover{background: #ccc;}
+.hotPoint_content .point>div.chosen .delete::before{color: #808080;}
+.hotPoint_content .point>div .delete:hover::before{color: #fff;}
+#snapPoint>div:first-child{border-top: 1px #ddd solid;margin-top:20px;} 
+#snapPoint>div:hover{background: #fff;}
+.selectButton{background: url("../images/styleButton2.png") white no-repeat;background-position:92% 50%;}
+#hotPoint_input textarea,#hotPoint_input li input,#hotPoint_input #select, #hotPoint_input label,#hotPoint_input li .right,.information_input label{width: 160px;height: 28px;line-height:28px;padding:0 8px;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+
+#hotPoint_input textarea{width: 160px;height: 56px;line-height:22px;padding:0 8px;background-color:#fafafa;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+#hotPoint_input textarea.focus,#hotPoint_input li input.white:focus{background:#fff;color:#333;border: 1px solid #09e1c0;}
+label.btn{cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+label.btn:hover{background:#14ebca;color:#fff;}
+#hotPoint_input label:hover,.information_input label:hover{background: #09cbae;}
+#hotPoint_input input::placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input #hotPoint_sumbit{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;}
+#hotPoint_input input[type="button"]:hover{background: #22f0d0;}
+.hotPoint_list{position:relative;    overflow-y: auto; overflow-x: hidden; height: calc(100% - 88px);}
+.hotPoint_list #list{/* position:absolute;*/width: 100%;flex-direction: column-reverse; border-top:1px solid #ddd;}
+.hotPoint_list #list>li{/* position:absolute;*/padding-left: 20px;display:flex;display:-webkit-flex;justify-content: flex-start;align-items: center; width: 282px;height: 48px;border-bottom: 1px solid #ddd;cursor: pointer;background: #fafafa;transition: background 0.1s;position:  relative;}
+.hotPoint_list #list>li:before{position:absolute;content:"";width:0px;height:48px;background:#09e1c0;left:0px;top:-1px;transition: width 0.2s;}
+.hotPoint_list #list>li.open:before{ width:8px !important;}
+.hotPoint_list #list>li{ background:#fff;}
+.hotPoint_list #list>li.open{  }
+.hotPoint_list #list>li:hover{background:#eee;} 
+.hotPoint_list #list div{/* display: flex;display: -webkit-flex;*/align-items: center;}
+.hotPoint_list #list>li span{padding-left: 5px;font-weight:bold;  white-space: nowrap;  overflow: hidden; text-overflow: ellipsis;}
+.hotPoint_list #list>li .delete{position: absolute;top: 0px;right: 0px;height: 48px;width: 48px;background-repeat: no-repeat;background-position: center center;background-image: url(../images/del.png);background-size: initial;}
+.hotPoint_list #list>li .delete:hover{background-color:rgba(175, 175, 175, 0.1);}
+.hotPoint_list #list>li .DelConfirm{font-size: 12px;position: absolute;width:60px;z-index: 100;background: #fff;height: 56px;border-radius: 2px;box-shadow: 0 1px 6px 0px rgba(153, 153, 153, 1);text-align: center;line-height: 28px;right: 40px;opacity:0;transform: translateX(15px) scale(0,0);transform-origin:right;transition: transform 0.1s,opacity 0.1s;}
+.hotPoint_list #list>li .DelConfirm.open{opacity:1;transform: translateX(0px) scale(1, 1);}
+/*#list>li .DelConfirm:after{content: '';width: 0;height: 0;border-top: 5px solid transparent;border-left: 8px solid #ffffff;border-bottom: 5px solid transparent;position: absolute;right: -8px;top: 25px;color: #999;}*/
+.hotPoint_list #list>li .DelConfirm>div{height:50%;}
+.hotPoint_list #list>li .DelConfirm>div:hover{background:#eee;}
+.hotPoint_list #list>li .DelConfirm .DelYes{color: rgba(224, 82, 71, 1);}
+.hotPoint_list #list>li div.left{     flex: auto;    max-width: 80%;display: flex;display: -webkit-flex;}
+#information_file{display:none;position:relative;}
+.information_show_div{display:flex;display:-webkit-flex;justify-content:space-between;padding:10px 0px 20px;}
+.information_show_div span{padding-left:20px;line-height: 24px;}
+
+.information_show_div label{width:160px;height:28px;line-height:30px;cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+
+input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color: #999 !important;font-weight:normal !important;}
+input:-moz-placeholder, textarea:-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input::-moz-placeholder, textarea::-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input:-ms-input-placeholder, textarea:-ms-input-placeholder{color:#999 !important;font-weight:normal !important;} 
+
+.Zprompt-popupBox{ font-family: "Microsoft YaHei"; position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.Zprompt-popupBox .center{position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);}
+.Zprompt-popup{padding: 0px;width:600px;height:289px;font-size:14px;box-shadow:0 0 5px #ccc;-moz-box-shadow:0 0 5px #ccc;-webkit-box-shadow:0 0 5px #ccc;color:#333;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;}
+.Zprompt-title{width:600px;display:flex;display:-webkit-flex;justify-content:space-between}
+.Zprompt-title a{text-decoration:none;height:20px;width:16px;opacity: 0.7;margin:10px}
+.Zprompt-title a:hover{opacity: 1}
+.Zprompt-title h2{padding-top:45px;padding-left:50px;font-size:24px;font-weight:600;margin:0}
+.Zprompt-main-false{margin-top:15px;width:598px;height:75px;display:flex;display:-webkit-flex;align-items:center;padding-left:49px;margin-left:1px;border-bottom:2px solid #eee;border-top:2px solid #eee;font-weight:700}
+.Zprompt-main-false span{padding-left:10px;font-weight:normal;letter-spacing:1px;}
+.Zprompt-footer{width:600px;height:95px;display:flex;display:-webkit-flex;justify-content:center;align-items:flex-end}
+.Zprompt-footer a{width:120px;height:48px;background:#09e1c0;text-align:center;line-height:48px;color: white;    margin: 0 10px;}
+.Zprompt-footer a:hover{background:#01dab9}
+.Zprompt-footer a.btn1{background:#c5c5c5}
+.Zprompt-footer a.btn1:hover{background:#b1b1b1}
+
+@keyframes flash {
+  0% {  
+	opacity:0;
+  } 
+  20% { 
+	opacity:1;
+  }
+   60% { 
+
+	opacity:1;
+  }
+   100% { 
+	opacity:0;
+  } 
+} 
+.Zprompt-popupBox #Zinfo{    width: 100px; height: 140px; opacity:0;}
+.Zprompt-popupBox #Zinfo.animate{  animation: flash 1s; -webkit-animation: flash 1s; animation-iteration-count:1; } 
+.Zprompt-popupBox #Zinfo .Zimg{    width: 100%; height: 100px;  background-image:url(../images/stips.png);  
+background-repeat: no-repeat;
+background-position: center center;}
+.Zprompt-popupBox #Zinfo .Ztitle{   text-align: center;  font-size: 16px;  letter-spacing:1px;   text-shadow: 2px 2px 6px rgba(27, 27, 27, 0.81);}
+.myAccount-cutAvatar{display: none;position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner {width:600px;height:543px;position:absolute;background:white;left:50%;top:50%;margin-left:-300px;margin-top:-272px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top {width:100%;height:95px;border-bottom:2px solid #eeeeee;font-size:24px;display:flex;display:-webkit-flex;justify-content:space-between;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top span {margin-top:40px;margin-left:50px;color: #333;font-weight: bold;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a {margin:10px;height: 16px;width: 16px;line-height: 1px;opacity: 0.7;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a:hover{opacity: 1} 
+.myAccount-cutAvatar .myAccount-cutAvatar-main {width:100%;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main {display:flex;display:-webkit-flex;padding:40px 0px 0px 50px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child {width:500px;height:300px;background:#eeeeee;display:flex;display:-webkit-flex;justify-content:center;align-items:center;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child img {max-width:500px;height:auto;max-height:300px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner>div:last-child {text-align:center;}
+.myAccount-cutAvatar input {background:#09e1c0;color:white;width:122px;height:50px;font-size:14px;cursor:pointer;border:1px solid white;outline:none;}
+#discrib .preholder{text-align:center;}
+
+
+
+
+
+#hotPoint_input .project-name,#hotPoint_input .project-intro{
+  flex-direction:column;
+
+  line-height: normal;
+
+}
+#hotPoint_input .project-name input,#hotPoint_input .project-intro>div,   .project-intro{
+  width:100%;
+}
+#hotPoint_input .project-name>span,#hotPoint_input .project-intro>span{
+  margin-bottom: 8px;
+}
+
+#hotPoint_input .project-intro{
+  margin:8px 0px 10px
+}
+.information_input .project-name,.information_input .project-intro{
+   flex-direction:column;
+
+   padding: 6px 0px 10px;
+   line-height: normal;
+}
+ 
+.information_input .project-name input,.information_input .project-intro>div{
+  width:calc( 100% - 40px );
+  margin-left:20px;
+  margin-top: 5px;
+}
+.information_input .project-intro{
+ margin:0px;
+}
+#type{
+     flex-direction:column;
+   width:100%;
+   position: relative;
+   margin: 0px;
+}
+#type a{
+    width:100%;
+}
+
+.noteBox{z-index: 999;display: none;width: 282px;height: 126px;background: white;padding: 20px 0px 0px 20px;opacity: 0;transition: opacity 0.5s ease;position: absolute;}
+.noteBox-row{display: flex;display: -webkit-flex;font-size: 14px;margin-bottom: 10px;}
+.noteBox-row h3{font-size: 14px;color: #333;}
+#noteInput_text{width: 242px;height: 28px;border: 1px solid #ccc;color: #333;padding-left: 10px;}
+.noteBox-row:last-child{justify-content: flex-end;margin-right: 20px;}
+.noteBox-ok{border-radius: 2px;cursor: pointer;width: 32px;height: 20px;color: white;background: #09e1c0;font-size: 12px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.noteBox-cancel{border-radius: 2px;cursor: pointer;width: 20px;height: 20px;background: #f56c6c;display: flex;display: -webkit-flex;justify-content: center;align-items: center;margin-left: 6px;}
+.noteBox.show{display: block;}
+.noteBox.active{opacity: 1;}
+
+.sizeWaring:before{color:#f56c6c !important;}
+.empty_warn{border:1px solid #f56c6c !important;color: #f56c6c !important;}
+.empty_warn::placeholder{color: #f56c6c !important;}
+
+.hide{ display:none;}
+.unable{pointer-events:none;  opacity:0.5;  }
+
+
+.editor .Main{ 
+	height:20px;
+	align-items: center;
+    display: flex;
+    justify-content: space-between;
+} 
+.editor .Main .scrollBar {
+    position: relative;
+    width: calc(96% - 45px);
+    height: 4px;
+    background-color: #c7c7c7;
+    cursor: pointer;
+}
+.editor .scrollBar .scroll_Track {
+	width: 0px;
+    height: 4px;
+    background-color: #09e1c0;
+}
+.editor .scrollBar .scroll_Thumb {
+	height: 12px;
+    width: 14px;
+    background-color: #919191;
+    /*-webkit-border-radius: 8px;
+    -moz-border-radius: 8px;
+    border-radius: 4px;
+     -webkit-box-shadow: 0px 0px 5px #74b5f5;
+    -moz-box-shadow: 0px 0px 5px #74b5f5;
+    box-shadow: 0px 0px 4px #74b5f5; */
+    position: absolute;
+    margin-top: -8px;
+    cursor: pointer;
+    -webkit-user-select: none;
+}
+.editor .BarTxt {
+	position:relative;
+	width:40px;
+}
+.editor .BarTxt .scrollBarTxt{
+    width: 100%;
+    text-align: center;
+    height: 20px;
+    border: 0;
+    /* border-radius: 4px; */
+    padding: 4px 0;
+    text-align: center;
+    color: #fff;
+    background: #919191;
+    font-size: 12px;
+}
+.editor #floorLogoSize {
+    font-size: 12px;
+    width: 160px;
+}
+.editor #floorLogoSize .slider{
+	float: left;
+    width: 100%;
+}
+
+.editor #scenePSD span{
+	line-height: 24px;
+}
+.editor #scenePSD ul.MenuOptions{
+	width: 100%;
+    overflow: hidden; 
+    background: #fff; 
+    padding: 0px;
+    cursor: pointer;
+    flex-direction: row;
+    align-items: center;
+    
+}
+.editor #scenePSD .MenuOptions li{
+	float: left; 
+	text-align:center;
+	line-height: 28px;
+	font-size:14px;
+	display:inline-block; 
+	color:#999;
+	transition:color 0.1s;
+}
+ 
+
+
+.editor .MenuOptions li.chosen{
+	background-color:#09e1c0;
+	color:#fff !important
+} 
+.editor .MenuOptions li:hover{
+	color: #333;
+}
+.editor .MenuOptions li.chosen:hover{
+	background-color:#09e1c0;
+	color:#fff;
+
+}
+
+.editor .quarterCell{
+	width: 25%;
+} 
+.editor .thirdCell{
+	width: 33.33%;
+}
+.editor .halfCell{
+	width: 50%;
+}
+
+.editor  a.button{
+	width: 100%;
+    height: 30px;
+    background: #0ed8b9;
+    display: inline-block;
+    margin-top: 10px;
+    text-align: center;
+    color: #fff; 
+}
+.editor  a.button:hover{
+	background:#04c7a9;
+}
+.editor  a.button:active{
+	background:#05a089;
+}
+
+
+.editor  #scenePSD .word{
+	margin-top:10px; 
+}
+.editor  #scenePSD .word>*{
+	float:left;
+}
+.editor  #scenePSD .word input{
+	/* width: 75%;  */
+	width:100%;
+}
+ 
+			
+img{
+	pointer-events:none;
+}
+
+ 
+
+ 
+
+
+
+.editor .selection{
+    display: block;
+    position: relative;
+    height: 30px;
+    overflow: hidden;
+    color: #000;
+    padding-right: 40px;
+    padding-left: 10px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    background: #fff;
+    cursor: pointer;
+    outline: none;
+    line-height: 30px;
+	transition-duration:0.1s;
+	border: 1px solid white;
+}
+.editor  .selection:after{
+	content: "\f0d7";
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 30px;
+    height: 30px;
+    font-family: FontAwesome;
+    text-align: center;
+    line-height: 30px;
+}
+.editor  .selection.focus{ 
+	color:#555;
+}
+.editor  ul.listOptions{
+	position: absolute;
+    left: 0px;
+    top: 56px;
+    z-index: 100;
+    width: 100%;
+    overflow: hidden; 
+    color: #9b9b9b;
+    background: #fff;
+    box-shadow: 0 5px 5px rgba(0,0,0,.3);
+	padding:0;
+	margin:0;
+	cursor:pointer;
+} 
+.editor  ul.listOptions>li{
+	height: 30px;
+    list-style-type: none;
+    color: #9b9b9b;
+    padding: 0 10px;
+    line-height: 30px;
+ /*    overflow: hidden; */
+    width:100%;
+    white-space: nowrap; 
+    margin: 0px;
+} 
+.editor  ul.listOptions>li.hover{
+    background: #fafafa;
+}
+
+#hotspot{
+	position: absolute;
+	height: 100%;
+	 
+	touch-action: none;
+	-webkit-user-select: none;
+	-webkit-user-drag: none;
+	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+	bottom:0;
+	left: 0;
+	pointer-events: none;
+	z-index:99;
+	transition:opacity 0.1s;
+}
+#hotspot *{
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+	-webkit-font-smoothing: antialiased;
+}		
+ 
+
+#hotspot>*{
+	pointer-events: all;
+	position:absolute;
+	display: block; 
+	
+}
+
+  
+
+#hotspot >.markspot{
+	background-image: url(../images/markspotAll.png);
+	background-size: cover;
+	background-repeat: no-repeat;
+	background-position: center -76px;
+	width: 60px;
+	height: 76px;
+	margin-left: -32px;
+	margin-top: -62px;
+	cursor: -webkit-grab;
+} 
+#hotspot >.markspot.zero{
+	background-position: center 0;
+}
+#hotspot >.markspot.two{
+	background-position: center -152px;
+}
+
+
+ 
+
+
+.editor .hotPoint_list{
+	width: calc(100% + 12px);/* 滑动条隐藏 */
+}
+ 
+.editor .hotPoint_list #list>li div.left>img{
+	width:24px;
+}
+
+.editor #select .showStyle>div:first-child > img{
+	width:20px;
+}
+.editor #select ul li > img{
+	width:40px;
+	height: auto;
+	display: block;
+}
+ 
+.warning-border{
+	border: 1px solid #f56c6c !important;
+}
+ 
+ 
+ 
+ 
+ @keyframes flash{
+  0% {
+    opacity: 0; }
+  1% {
+    opacity: 1; }
+  30% {
+    opacity: 1; }
+  100% {
+    opacity: 0; } 
+ }
+ #webgl .snapshotFlash{
+	opacity: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: -1;
+    background: #ffffff;
+    pointer-events: none;
+ }
+ #webgl .snapshotFlash.active{
+	z-index: 100;
+	-webkit-animation-name:flash;
+	animation-name:flash;
+	-webkit-animation-duration:1s;
+	animation-duration:1s;
+	-webkit-animation-fill-mode:both;
+	animation-fill-mode:both;
+}
+
+#webgl .snapshotGui{
+	position:absolute; 
+    z-index: 100;
+	width: calc(94% - 80px);
+    height: calc(85% - 80px);
+    border: 1px solid rgba(255,255,255,0.5); 
+    left: calc(3% + 40px);
+    top: calc(3% + 80px);
+	pointer-events: none;
+	opacity:0;
+	transition: opacity 0.3s,
+				border 0.3s;
+	
+}
+#webgl .snapshotGui .corner{
+	width:100px;
+	height:100px;
+	position:absolute;
+	transition:opacity 0.3s;
+	opacity: 0.5;
+}
+#webgl .snapshotGui.highLight .corner{
+	opacity: 0.8;
+}
+#webgl .snapshotGui.highLight{
+	border: 1px solid rgba(255,255,255,0.8); 
+}
+#webgl .snapshotGui .corner.leftTop{
+	border-top:4px solid #fff;
+	border-left:4px solid #fff;
+	left:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.rightTop{
+	border-top:4px solid #fff;
+	border-right:4px solid #fff;
+	right:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.leftBott{
+	border-left:4px solid #fff;
+	border-bottom:4px solid #fff;
+	left:-40px;
+	bottom:-40px;
+}
+#webgl .snapshotGui .corner.rightBott{
+	border-right: 4px solid #fff;
+    border-bottom: 4px solid #fff;
+    right: -40px;
+    bottom: -40px;
+}
+ 
+#webgl .snapshotGui .confirmSnap{
+	background: rgba(9, 225, 192, 0.9);
+    color: #fff;
+    border-radius: 5px;
+    /* margin: 0 auto; */
+    bottom: 20px;
+    position: absolute;
+    width: 220px;
+    letter-spacing: 0.1em;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    font-size: 16px;
+    font-weight: 100;
+    left: calc(50% - 110px);
+    font-family: SourceHanSansCN;
+	pointer-events: all;
+	cursor:pointer;
+	transition:background 0.2s;
+}
+#webgl .snapshotGui .confirmSnap:hover{
+	background:rgba(9, 225, 192, 0.78)  /* #14ebca */
+}
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 

edit-backstage/css/toolBox.css.bak

@@ -0,0 +1,803 @@
+@font-face {font-family: "SourceHanSansCN";src: url("../fonts/SourceHanSansCN.woff2") format("woff2"),url("../fonts/SourceHanSansCN.woff") format("woff"),url("../fonts/SourceHanSansCN.ttf") format("truetype");font-weight: normal;font-style: normal;}*/
+/* html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden;font-size: 75px;}
+@media screen and (min-width: 1705px)  and  (max-width: 1805px) {
+  html{font-size: 72px;}
+}
+@media screen and (min-width: 1605px)  and  (max-width: 1705px) {
+  html{font-size: 68px;}
+}
+@media screen and (min-width: 1505px)  and  (max-width: 1605px) {
+  html{font-size: 65px;}
+}
+@media screen and (min-width: 1405px)  and  (max-width: 1505px) {
+  html{font-size: 61px;}
+}
+@media screen and (min-width: 1305px)  and  (max-width: 1405px) {
+  html{font-size: 58px;}
+}
+@media screen and  (max-width: 1305px) {
+  html{font-size: 55px;}
+  }
+} */
+
+ html,body{height: 100%;width: 100%;margin: 0px;padding: 0px;overflow: hidden; }
+
+
+
+*{box-sizing: border-box; font-family:OpenSans, "Microsoft YaHei";   background-size: contain;  background-repeat: no-repeat; background-position: center center; }
+.editor a{text-decoration: none;color:#333333;}
+.editor ul li{display: inline-block;list-style: none; width:100%}
+.editor ul{margin: 0px;padding: 0px;}
+.editor input,textarea{font: 14px "Microsoft YaHei";}
+.editor input[type="text"]:focus{border: 1px solid #09e1c0;}
+
+.scrollBox{width: 282px;height: 100%;}
+.scrollBox:nth-child(n+3){display: none;}
+.introduce-top{color: white;font-family:"Microsoft YaHei"; font-size:14px;margin:10px 0 0 10px;z-index:60;position: absolute;left: 0;top: 0;width: auto;height: 48px;}
+.introduce-top .introduce-button{padding-right: 25px;filter: drop-shadow(0px 1px 1px rgba(153,153,153,1));border-radius: 5px;background: url("../images/introduce_close.png") no-repeat;background-size: 16px; transition:background-color 0.3s; background-position:100% 50%;padding-left:0px;width:100%;height:48px;display:flex;display:-webkit-flex;font-size:16px;align-items:center; cursor:pointer;}
+.introduce-button a{display: inline-block;}
+.introduce-button .introduce-button-fImg{width: 30px;height: auto;margin-right:6px;}
+.introduce-button .introduce-button-lImg{width:1px;height:auto;margin-right:5px;}
+.introduce-top.open .introduce-button{background-image:url("../images/introduce_open.png")}
+.introduce-top .addIntroduce-bg{background: url("../images/introduce_close.png") no-repeat rgba(0,0,0,0.45);background-size: 16px;background-position:94% 50%;}
+.introduce-top .introduce-button span{margin-left:6px;letter-spacing:1px; font-weight:600;font-size:16px;margin-top: 2px;}
+.introduce-top .introduce-detailBox h3{font-size:12px; margin-bottom: 13px; font-weight:600;}
+.introduce-top .introduce-detailBox span{    line-height: 22px;text-align: justify;word-break: break-all;color: white;}
+.introduce-top .introduce-detailBox{position: absolute;border-radius: 3px;max-height:0px;width:320px;margin-top:5px;margin-left:41px;overflow:hidden;transition:max-height 0.25s ease-out;transform: translate3d(0, 0, 0);}
+.introduce-top.open .introduce-detailBox{max-height: 600px;}
+.introduce-top .introduce-detail{text-align:justify;width:100%;letter-spacing:1px;word-wrap: break-word;padding:14px 12px 14px 14px;background:rgba(0,0,0,0.2);}
+.introduce-top .introduce-detail p{text-align: justify;font-weight:400;line-height: 22px;word-break: break-all;color: white;}
+.bgNone{background: none !important;}
+.divNone{display: none !important;}
+ 
+.introduce-top .introduce-detail a,  #hotspot a{ text-decoration: underline !important; color:#fff !important;  margin: 0 2px !important; padding: 0 !important;       }
+.introduce-top .introduce-detail a *{color:#fff !important; }
+/* #hotspot .picBottom a,#hotspot .picRight a,#hotspot .formInfo a{color:#2d2d2d !important;}   */
+.introduce-top .introduce-detail a:hover,  #hotspot a:hover{color:#09e1c0 !important;}
+.introduce-top .introduce-detail a:hover *,  #hotspot a:hover *{color:#09e1c0 !important;}
+
+.toolTop{width: 282px;height: 48px;background: #5a45df;position: absolute;top: 0px;right: 0px;z-index: 150;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.toolTop>div:nth-child(2){display:flex;display:-webkit-flex;align-items:center;font-size:16px;font-weight:bold;  overflow: hidden;}
+.toolTop>div:nth-child(2)>*{ 
+   white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.toolTop-button{display:flex;display:-webkit-flex;width:282px;}
+.toolTop-button>div{opacity:0.7;cursor: pointer;display:flex;display:-webkit-flex;width:94px;height:48px;align-items:center;justify-content:center;}
+.toolTop-button>div:hover{opacity:1;}
+.toolTop-button span{margin-left:5px;font-size:16px;color:#fafafa;}
+.editor{letter-spacing:0.1em;z-index:140;font: 14px "Microsoft YaHei";font-weight:400;color: #333333;width: 282px;height: 100%;background: #f5f5f5;position: absolute;right: 0px;top: 0px;padding-top:48px;box-shadow: 0px 0px 6px #666;-webkit-box-shadow: 0px 0px 6px #666;-moz-box-shadow: 0px 0px 6px #666;}
+.toolBox,.informationBox, .hotPointBox,.styleZBox{margin-top:48px;height:calc(100% - 106px);width:calc(100% + 12px);overflow-y:auto;overflow-x:hidden;    }
+.toolContent,.hotPoint_content,.information_content,.styleZ_content{position: relative; width: 282px;}
+.toolBox_Top{position: absolute;right: 0px;width: 100%;display: flex;display: -webkit-flex;border-bottom:1px solid #ddd;}
+.styleZ_content h3{font-size: 14px;font-weight:normal;margin:20px;}
+.styleZ_content>ul{display:flex;display:-webkit-flex;flex-direction:column;padding:0px 20px;}
+.styleZ_content>ul li{cursor: pointer;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;margin-bottom:10px;border:1px solid #ddd;border-radius:6px;padding:5px;}
+.styleZ-select{position:relative;width:46%;display:flex;display:-webkit-flex;justify-content:center;}
+.styleZ-select:before{content:"";position:absolute;top:50%;margin-top:-6px;left:15px;width:14px;height:14px;border-radius:7px;border:1px solid #ddd;}
+.styleZ_content>ul li:hover{background: #fafafa;}
+.styleZ_content>ul li.active{background:white;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:before{background:#09e1c0;border-color:#09e1c0;}
+.styleZ_content>ul li.active .styleZ-select:after{content:"";position:absolute;top:50%;margin-top:-2.5px;left:18.5px;width:6px;height:6px;border-radius:7px;background:white;}
+.toolBox_Top input{background: #fff !important;transition:background 0.1s;letter-spacing:0.1em;display: inline-block;width: 25%;height: 48px;color: #999999;font: 16px initial;background: white;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border:none;cursor: pointer;}
+.toolBox_Top input:hover,.toolBox-Top-input{background: #fafafa !important;color:#333333 !important;}
+.toolBox_Top .toolBox_nav{position: relative;width: 100%;height: 100%;display: flex;display: -webkit-flex;}
+.toolBox_Top .toolBox_nav:before{content: "";background: #09e1c0;height: 2px;width:25%;position: absolute;bottom:0px;left:0px;transition:left 0.26s ease-out;}
+.toolBox_Top .toolBox_nav-left0:before{left: 0px;}
+.toolBox_Top .toolBox_nav-left1:before{left: 25%;}
+.toolBox_Top .toolBox_nav-left2:before{left: 50%;}
+.toolBox_Top .toolBox_nav-left3:before{left: 75%;}
+.function{width: 282px;height: 48px;border-top: 1px solid #cccccc;border-bottom: 1px solid #ddd;margin-top: 20px;}
+.function ul{display: flex;display: -webkit-flex;}
+.function li{width: 94px;height: 48px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.function li img{vertical-align:baseline;}
+.function li>a{color: #333;display:  flex;display: -webkit-flex;justify-content:  center;align-items:  center;}
+.function li:hover{opacity:0.7;}
+.function li:nth-child(1) span,.function li:nth-child(2) span{padding-left: 5px;}
+#export{display: inline-block;width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;line-height: 28px;}
+#export:hover{background: #22f0d0;}
+#draw_Tools a{position:relative;}
+#draw_Tools a:before{position:absolute;top:0px;left:0px;content:"";width:60px;height:60px;transition:border 0.2s ease-in-out;}
+.draw_Tools-a:before{border:1px solid #09e1c0;}
+.Basic_drawing ul{padding-top: 20px;display: flex;display: -webkit-flex;}
+.Basic_drawing ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;}
+.doors_windows{border-bottom: 1px solid #ddd;padding-bottom: 18px;}
+.doors_windows ul{display: flex;display: -webkit-flex;flex-wrap: wrap;}
+.doors_windows ul li{width: 33%;display: flex;display: -webkit-flex;flex-direction: column;align-items: center;padding-top: 16px;}
+.Basic_drawing span,.doors_windows span{letter-spacing: 2px;margin-top: 8px;color: #333;}
+.controlBox{padding-top:28px;width: 282px;height:80px;border-bottom: 1px solid #cccccc;transition: all 1s linear;display: none;opacity: 0;}
+#controlName{padding-left: 20px;font-size: 16px;}
+.controlBox a{position: absolute;right: 20px;color:#cccccc;}
+.controlBox a:hover{color:#999999;}
+#pjtName{width: 100%;}
+#edit2Box,#edit1Box{width: 100%;height: 84px;position:relative;background: white;}
+#edit2,#edit1{width:100%;height:100%;overflow: hidden;border: 1px solid white;}
+#edit2Box .w-e-toolbar,#edit1Box .w-e-toolbar{position:absolute;bottom: 4px;right: 4px;padding: 0px;width: 20px;height: 20px;}
+#edit2Box .w-e-menu,#edit1Box .w-e-menu{padding: 0px;}
+#edit2Box .w-e-text,#edit1Box .w-e-text{width: calc(100% + 20px) !important;word-break: break-all;overflow-y: scroll;padding: 0px 30px 0px 10px; -webkit-user-select:auto;}
+#edit2Box .w-e-text *,#edit1Box .w-e-text *{-webkit-user-select:text;} 
+
+#edit2Box .w-e-icon-link,#edit1Box .w-e-icon-link{position:relative;display: block;width: 20px;height: 20px;}
+#edit2Box .w-e-text a,#edit1Box .w-e-text a{color:#079eec;text-decoration:underline;}
+#edit2Box .w-e-text-container,#edit1Box .w-e-text-container{position: static;}
+#edit2Box .w-e-icon-link:before,#edit1Box .w-e-icon-link:before{background: url("../images/linkBtn.png") no-repeat center;width: 20px;height: 20px;position: absolute;top: 0px;left: 0px;background-size: cover;}
+#edit2Box .w-e-text-container .w-e-panel-container,#edit1Box .w-e-text-container .w-e-panel-container{box-shadow: 1px 1px 2px #ccc;z-index: 99;top: 92px;}
+#edit2Box .addLink-content-row,#edit1Box .addLink-content-row{display:flex;display:-webkit-flex;justify-content:space-between;font-size:14px;height: 25px;}
+#edit2Box .addLink-content-row span,#edit1Box .addLink-content-row span{color:#999;}
+#edit2Box .addLink-content input,#edit1Box .addLink-content input{height:28px;border:1px solid #09e1c0;margin:0px 0px 6px}
+#edit2Box h5,#edit1Box h5{font-size:12px;font-weight:normal;color:#999;margin-bottom:20px;}
+#edit2Box .addLink-cancel,#edit1Box .addLink-cancel{width:75px;height:28px;background:#ccc;border-radius:0px;color:white;margin-left:10px}
+#edit2Box .addLink-cancel:hover,#edit1Box .addLink-cancel:hover{background: #d1d1d1;}
+#edit2Box .w-e-button-container,#edit1Box .w-e-button-container{display:flex;display:-webkit-flex;justify-content:flex-end;}
+#edit1Box .w-e-panel-tab-content:after,#edit2Box .w-e-panel-tab-content:after{position:absolute;width:0px;height:0px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #777;top:-46px;right:15px;content:"";}
+
+
+/* 画墙一栏*/
+
+.information-subDiv{padding: 20px 0px;margin: 0px 20px;border-bottom: 1px solid #ddd;}
+.editor .information-subDiv ul li{display:flex;display:-webkit-flex;justify-content: space-between;}
+.information-subDiv:first-child li{flex-direction:column;margin-bottom: 20px;}
+.information-subDiv:first-child span{margin-bottom: 6px;}
+.information-subDiv:last-child{ border-bottom:  none;}
+.information-subDiv:last-child li:first-child{margin-bottom:4px;}
+.information_input{width: 282px;}
+.information_input input[type="file"]{position: relative;display: none;}
+.information_input input{width: 160px;height: 28px;font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;}
+.information_input input::placeholder{font-size: 14px;color:#cccccc;}
+.information_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+.information_input input[type="button"]{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;margin-top:10px;}
+.information_input input[type="button"]:hover{background: #22f0d0;}
+.information_show ul{display: flex;display: -webkit-flex;flex-direction: column;padding: 20px 0px;margin: 0 20px;}
+.information_show ul li{height: 28px;display: flex;display: -webkit-flex;justify-content: space-between;align-items: center;}
+.information_input .right{    position: relative; width: 160px;  font-size: 14px;line-height: 28px;} 
+.information_input input, .information_input label{outline: none;background-color:#fff;padding: 0 10px;color: #999999;}
+.close_linkDiv{position: absolute;bottom: 10px;right: 10px;width: 75px;height: 28px;cursor: pointer;z-index: 99999;}
+#setEntry .ImgPreview{height:80px;}
+.information_input label{cursor:pointer;}
+.show_title{padding-left: 0 !important;}
+.show_data{color: #999999;display: flex;display: -webkit-flex;flex-direction: row-reverse;}
+.show_count{color: #999}
+.show_data span{padding-right: 5px;}
+/* 信息一栏*/.hotPointBox{overflow-y:hidden} 
+#ok{width:100%;height: 48px;display:none;text-align:center;line-height:48px;cursor:pointer;background: #09e1c0;color:#fff;}
+#ok:hover{background: #14ebca}
+.hotPoint_content{height: 100%;}
+.hotPoint_content .point>*{height: 40px;display: flex;display: -webkit-flex;width: 282px;align-items:center;justify-content: space-between;border-bottom: 1px #ddd solid;padding-left: 20px;color: #999;/* opacity: 0.6;*/cursor: pointer;display:none;background:#fafafa;}
+.hotPoint_content #listPoint{display:flex;-webkit-box-flex: 1;}
+.hotPoint_content #listPoint>*{display:flex;}
+.hotPoint_content #listPoint>div:first-child{border-right:1px solid #eeeeee;}
+.hotPoint_content #listPoint>div:hover{background: #fff;}
+.hotPoint_content .point>* div{display: flex;display: -webkit-flex;align-items: center;}
+.hotPoint_content .point>* span{padding-left: 5px;}
+.hotPoint_content .point>* a{padding-right: 20px;}
+/* .hotPoint_content .point>*:hover{opacity: 1;}*/
+#snap{padding:20px 0px;display: flex;display: -webkit-flex;align-items: center;flex-direction: column;}
+#hotPoint_button{background: #09e1c0;height: 48px;display: flex;display: -webkit-flex;width:242px;align-items: center;justify-content: center;color: white;cursor: pointer;transition: background 0.2s;}
+#hotPoint_button.unable{pointer-events: none;/* opacity:0.5;*/cursor:default;background: #ddd;}
+#hotPoint_button span{padding-left: 5px;}
+#hotPoint_button:hover{background: #14ebca;}
+#hotPoint_input{display:none;width: 282px;border-bottom: 1px #ddd solid; max-height: 800px;transition: max-height .3s; overflow: hidden;}
+#hotPoint_input #change{display:flex;-webkit-box-flex: 1;text-align:center;border-bottom:1px solid #ddd;height:40px;width:100%;}
+#hotPoint_input #change>div{cursor:pointer;width: 100%;height: 100%;line-height: 40px;}
+#hotPoint_input #change>div:first-child{border-right:1px solid #eeeeee;}
+#hotPoint_input #change>div:hover{background: #fff;}
+#hotPoint_input>ul{padding:8px 20px 15px;display: flex;display: -webkit-flex;flex-wrap: wrap;background: #eee;}
+.hotPoint-title{position: relative;}
+.hotPoint-title:after{position: absolute;top: 0px;right: -10px;content: "*";color:#f56c6c;}
+#hotPoint_input>ul>li{position: relative;padding: 5px 0;line-height:30px;display: flex;display: -webkit-flex;flex-basis: 100%;align-items:center;justify-content: space-between;align-items: flex-start;}
+#hotPoint_input>ul>li.warn input{border: 1px solid #f56c6c;}
+#hotPoint_input>ul>li.warn input::placeholder{color: #f56c6c !important;}
+.redPoint{position:relative;}
+.hotPoint_content .redPoint:after{position: absolute;top: 0px;left: 32px;content: "*";color:#f56c6c;}
+.information_input .redPoint:after{position: absolute;top: 0px;left: 62.5px;content: "*";color:#f56c6c;}
+#type .redPoint:after{left:32px}
+#hotPoint_input .unComplete{display:none; color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 12px;right: 10px;}
+.information_input .unComplete{display: none;color:#f56c6c;font-size: 0.9em;position: absolute;bottom: 16px;right: 28px;}
+#project-name2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-intro2{position:relative;}
+#project-intro2:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+#project-name1,#project-intro1{position:relative;width:100%;}
+#project-name1:before,#project-intro1:before{position:absolute;right:0px;top:2px;content:""attr(data-size)"";color:#999;}
+
+#hotPoint_input>ul>li span{margin-top:5px;}
+#hotPoint_input input[type="file"]{position: relative;display: none;}
+*{outline:none}
+#hotPoint_input input.white,textarea.white{font-size: 14px;outline: none;-webkit-appearance: none;-moz-appearance: none;-o-appearance: none;appearance: none;border: 1px solid white;color: #999999;resize: vertical;}
+#hotPoint_input .ImgPreview,.information_input .ImgPreview{width:160px;height:114px;background-repeat: no-repeat;background-position: center center; margin-top: 10px;background-size: contain;/* border: 1px solid white;*/}
+#showInformation{height:80px;position:  relative;}
+.showInformation-error:after{content:"";width:100%;height:100%;position:absolute;left:0;top:0;background:url("../images/pic_error.png") no-repeat center;}
+#hotPoint_input>ul>li:nth-child(n+6){padding:0px}
+#select{display: inline-block;position:relative;background:#eee;}
+#select .showStyle{background:#eee;position:absolute;top:0px;left:0px;display:flex;display:-webkit-flex;justify-content:space-between;align-items:center;width:160px;height:30px;}
+#select .showStyle>div:first-child{display:flex;display:-webkit-flex;align-items:center;}
+#select .showStyle>div:first-child img{margin-top:-1px}
+#hotPoint_input>ul>li:nth-child(5){margin-top:-11px;}
+#hotPoint_input>ul>li:nth-child(6){margin-top:-8px;}
+#select .showStyle p{margin-left:5px;      cursor: default;}
+#styleBtn{opacity: 0.7;width:16px;height:16px;background:url("../images/styleBtn.png") no-repeat;cursor: pointer;}
+#styleBtn:hover{opacity: 1;}
+#select ul{display: none;padding:10px 30px 15px 10px;font-size:12px;width: 160px;z-index: 15;position:absolute;background: white;box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-webkit-box-shadow: 0px 1px 6px 1px rgba(51,51,51,0.3);-moz-box-shadow:0px 1px 6px 1px rgba(51,51,51,0.3);left:0px;top:30px;flex-wrap:wrap;}
+#select ul li:nth-child(3),#select ul li:nth-child(4){margin-top:20px}
+#select ul li:nth-child(3):after{position:absolute;content:"";top:-10px;left:0px;width:140px;height:1px;background:#ddd;}
+#select ul li span{margin-top:2px;}
+#select.open #styleBtn{opacity: 0.7;}
+#select.open ul{display:flex;display:-webkit-flex;}
+#select ul li{ margin-right: 2px;cursor: pointer;display:flex;display:-webkit-flex;flex-direction:column; padding-top: 4px;align-items:center; width:46px; height:61px;position:relative;/* float: left; */}#select ul li:before{position:absolute;content:"";left:0px;top:0px; width:46px;height:64px;}#select ul li:hover:before{border:1px solid #ddd;}
+#select span{line-height:15px;}
+.information_input>ul>li:nth-child(4):before{position:absolute;content:"标志大小";bottom:17px;left:20px;}
+#hotPoint_input>ul>li:nth-child(1){line-height:20px}
+#hotPoint_input>ul>li:nth-child(4){line-height:16px}
+.hotPoint_content .point>div.chosen{color:#333;background:#fff;}
+.hotPoint_content .point .coordinate{background-image:url(../images/coordinate2.png);height: 16px;width: 16px;}
+.hotPoint_content .point>div.chosen .coordinate{background-image:url(../images/coordinate.png);}
+.hotPoint_content .point .delete{/* height:46px;width:46px;background-repeat: no-repeat;background-position: center center;background-image:url(../images/coordinateClose.png);background-size: initial;*/border-radius: 7px;height: 14px;width: 14px;margin-right: 14px;padding: 2px;font-size: 12px;background:transparent;transition: background 0.3s;}
+.hotPoint_content .point>div .delete::before{font-family: "FontAwesome";content: "\f00d";color: #bababa;transition: color 0.3s;}
+.hotPoint_content .point>div .delete:hover{background: #ccc;}
+.hotPoint_content .point>div.chosen .delete::before{color: #808080;}
+.hotPoint_content .point>div .delete:hover::before{color: #fff;}
+#snapPoint>div:first-child{border-top: 1px #ddd solid;margin-top:20px;} 
+#snapPoint>div:hover{background: #fff;}
+.selectButton{background: url("../images/styleButton2.png") white no-repeat;background-position:92% 50%;}
+#hotPoint_input textarea,#hotPoint_input li input,#hotPoint_input #select, #hotPoint_input label,#hotPoint_input li .right,.information_input label{width: 160px;height: 28px;line-height:28px;padding:0 8px;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+
+#hotPoint_input textarea{width: 160px;height: 56px;line-height:22px;padding:0 8px;background-color:#fafafa;max-height:500px;/* overflow:auto;*//* overflow:hidden;*/border:none;}
+#hotPoint_input textarea.focus,#hotPoint_input li input.white:focus{background:#fff;color:#333;border: 1px solid #09e1c0;}
+label.btn{cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+label.btn:hover{background:#14ebca;color:#fff;}
+#hotPoint_input label:hover,.information_input label:hover{background: #09cbae;}
+#hotPoint_input input::placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input:-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input input::-ms-input-placeholder{font-size: 14px;color:#cccccc;}
+#hotPoint_input #hotPoint_sumbit{width: 60px;height: 28px;border:none;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;color: white;background: #09e1c0;text-align: center;font-size: 14px;cursor: pointer;}
+#hotPoint_input input[type="button"]:hover{background: #22f0d0;}
+.hotPoint_list{position:relative;    overflow-y: auto; overflow-x: hidden; height: calc(100% - 88px);}
+.hotPoint_list #list{/* position:absolute;*/width: 100%;flex-direction: column-reverse; border-top:1px solid #ddd;}
+.hotPoint_list #list>li{/* position:absolute;*/padding-left: 20px;display:flex;display:-webkit-flex;justify-content: flex-start;align-items: center; width: 282px;height: 48px;border-bottom: 1px solid #ddd;cursor: pointer;background: #fafafa;transition: background 0.1s;position:  relative;}
+.hotPoint_list #list>li:before{position:absolute;content:"";width:0px;height:48px;background:#09e1c0;left:0px;top:-1px;transition: width 0.2s;}
+.hotPoint_list #list>li.open:before{ width:8px !important;}
+.hotPoint_list #list>li{ background:#fff;}
+.hotPoint_list #list>li.open{  }
+.hotPoint_list #list>li:hover{background:#eee;} 
+.hotPoint_list #list div{/* display: flex;display: -webkit-flex;*/align-items: center;}
+.hotPoint_list #list>li span{padding-left: 5px;font-weight:bold;  white-space: nowrap;  overflow: hidden; text-overflow: ellipsis;}
+.hotPoint_list #list>li .delete{position: absolute;top: 0px;right: 0px;height: 48px;width: 48px;background-repeat: no-repeat;background-position: center center;background-image: url(../images/del.png);background-size: initial;}
+.hotPoint_list #list>li .delete:hover{background-color:rgba(175, 175, 175, 0.1);}
+.hotPoint_list #list>li .DelConfirm{font-size: 12px;position: absolute;width:60px;z-index: 100;background: #fff;height: 56px;border-radius: 2px;box-shadow: 0 1px 6px 0px rgba(153, 153, 153, 1);text-align: center;line-height: 28px;right: 40px;opacity:0;transform: translateX(15px) scale(0,0);transform-origin:right;transition: transform 0.1s,opacity 0.1s;}
+.hotPoint_list #list>li .DelConfirm.open{opacity:1;transform: translateX(0px) scale(1, 1);}
+/*#list>li .DelConfirm:after{content: '';width: 0;height: 0;border-top: 5px solid transparent;border-left: 8px solid #ffffff;border-bottom: 5px solid transparent;position: absolute;right: -8px;top: 25px;color: #999;}*/
+.hotPoint_list #list>li .DelConfirm>div{height:50%;}
+.hotPoint_list #list>li .DelConfirm>div:hover{background:#eee;}
+.hotPoint_list #list>li .DelConfirm .DelYes{color: rgba(224, 82, 71, 1);}
+.hotPoint_list #list>li div.left{     flex: auto;    max-width: 80%;display: flex;display: -webkit-flex;}
+#information_file{display:none;position:relative;}
+.information_show_div{display:flex;display:-webkit-flex;justify-content:space-between;padding:10px 0px 20px;}
+.information_show_div span{padding-left:20px;line-height: 24px;}
+
+.information_show_div label{width:160px;height:28px;line-height:30px;cursor:pointer;display: inline-block;background:#09e1c0;color: #fff;text-align: center;transition: background 0.2s;letter-spacing:0.05em;}
+
+input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color: #999 !important;font-weight:normal !important;}
+input:-moz-placeholder, textarea:-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input::-moz-placeholder, textarea::-moz-placeholder{color:#999 !important;font-weight:normal !important;}
+input:-ms-input-placeholder, textarea:-ms-input-placeholder{color:#999 !important;font-weight:normal !important;} 
+
+.Zprompt-popupBox{ font-family: "Microsoft YaHei"; position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.Zprompt-popupBox .center{position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);}
+.Zprompt-popup{padding: 0px;width:600px;height:289px;font-size:14px;box-shadow:0 0 5px #ccc;-moz-box-shadow:0 0 5px #ccc;-webkit-box-shadow:0 0 5px #ccc;color:#333;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;}
+.Zprompt-title{width:600px;display:flex;display:-webkit-flex;justify-content:space-between}
+.Zprompt-title a{text-decoration:none;height:20px;width:16px;opacity: 0.7;margin:10px}
+.Zprompt-title a:hover{opacity: 1}
+.Zprompt-title h2{padding-top:45px;padding-left:50px;font-size:24px;font-weight:600;margin:0}
+.Zprompt-main-false{margin-top:15px;width:598px;height:75px;display:flex;display:-webkit-flex;align-items:center;padding-left:49px;margin-left:1px;border-bottom:2px solid #eee;border-top:2px solid #eee;font-weight:700}
+.Zprompt-main-false span{padding-left:10px;font-weight:normal;letter-spacing:1px;}
+.Zprompt-footer{width:600px;height:95px;display:flex;display:-webkit-flex;justify-content:center;align-items:flex-end}
+.Zprompt-footer a{width:120px;height:48px;background:#09e1c0;text-align:center;line-height:48px;color: white;    margin: 0 10px;}
+.Zprompt-footer a:hover{background:#01dab9}
+.Zprompt-footer a.btn1{background:#c5c5c5}
+.Zprompt-footer a.btn1:hover{background:#b1b1b1}
+
+@keyframes flash {
+  0% {  
+	opacity:0;
+  } 
+  20% { 
+	opacity:1;
+  }
+   60% { 
+
+	opacity:1;
+  }
+   100% { 
+	opacity:0;
+  } 
+} 
+.Zprompt-popupBox #Zinfo{    width: 100px; height: 140px; opacity:0;}
+.Zprompt-popupBox #Zinfo.animate{  animation: flash 1s; -webkit-animation: flash 1s; animation-iteration-count:1; } 
+.Zprompt-popupBox #Zinfo .Zimg{    width: 100%; height: 100px;  background-image:url(../images/stips.png);  
+background-repeat: no-repeat;
+background-position: center center;}
+.Zprompt-popupBox #Zinfo .Ztitle{   text-align: center;  font-size: 16px;  letter-spacing:1px;   text-shadow: 2px 2px 6px rgba(27, 27, 27, 0.81);}
+.myAccount-cutAvatar{display: none;position:absolute;top:0px;left:0px;background:rgba(0,0,0,0.3);width:100%;height:100%;z-index:200;overflow:auto;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner {width:600px;height:543px;position:absolute;background:white;left:50%;top:50%;margin-left:-300px;margin-top:-272px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top {width:100%;height:95px;border-bottom:2px solid #eeeeee;font-size:24px;display:flex;display:-webkit-flex;justify-content:space-between;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top span {margin-top:40px;margin-left:50px;color: #333;font-weight: bold;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a {margin:10px;height: 16px;width: 16px;line-height: 1px;opacity: 0.7;}
+.myAccount-cutAvatar .myAccount-cutAvatar-top a:hover{opacity: 1} 
+.myAccount-cutAvatar .myAccount-cutAvatar-main {width:100%;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main {display:flex;display:-webkit-flex;padding:40px 0px 0px 50px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child {width:500px;height:300px;background:#eeeeee;display:flex;display:-webkit-flex;justify-content:center;align-items:center;}
+.myAccount-cutAvatar .myAccount-cutAvatar-main>div:first-child img {max-width:500px;height:auto;max-height:300px;}
+.myAccount-cutAvatar .myAccount-cutAvatar-inner>div:last-child {text-align:center;}
+.myAccount-cutAvatar input {background:#09e1c0;color:white;width:122px;height:50px;font-size:14px;cursor:pointer;border:1px solid white;outline:none;}
+#discrib .preholder{text-align:center;}
+
+
+
+
+
+#hotPoint_input .project-name,#hotPoint_input .project-intro{
+  flex-direction:column;
+
+  line-height: normal;
+
+}
+#hotPoint_input .project-name input,#hotPoint_input .project-intro>div,   .project-intro{
+  width:100%;
+}
+#hotPoint_input .project-name>span,#hotPoint_input .project-intro>span{
+  margin-bottom: 8px;
+}
+
+#hotPoint_input .project-intro{
+  margin:8px 0px 10px
+}
+.information_input .project-name,.information_input .project-intro{
+   flex-direction:column;
+
+   padding: 6px 0px 10px;
+   line-height: normal;
+}
+ 
+.information_input .project-name input,.information_input .project-intro>div{
+  width:calc( 100% - 40px );
+  margin-left:20px;
+  margin-top: 5px;
+}
+.information_input .project-intro{
+ margin:0px;
+}
+#type{
+     flex-direction:column;
+   width:100%;
+   position: relative;
+   margin: 0px;
+}
+#type a{
+    width:100%;
+}
+
+.noteBox{z-index: 999;display: none;width: 282px;height: 126px;background: white;padding: 20px 0px 0px 20px;opacity: 0;transition: opacity 0.5s ease;position: absolute;}
+.noteBox-row{display: flex;display: -webkit-flex;font-size: 14px;margin-bottom: 10px;}
+.noteBox-row h3{font-size: 14px;color: #333;}
+#noteInput_text{width: 242px;height: 28px;border: 1px solid #ccc;color: #333;padding-left: 10px;}
+.noteBox-row:last-child{justify-content: flex-end;margin-right: 20px;}
+.noteBox-ok{border-radius: 2px;cursor: pointer;width: 32px;height: 20px;color: white;background: #09e1c0;font-size: 12px;display: flex;display: -webkit-flex;justify-content: center;align-items: center;}
+.noteBox-cancel{border-radius: 2px;cursor: pointer;width: 20px;height: 20px;background: #f56c6c;display: flex;display: -webkit-flex;justify-content: center;align-items: center;margin-left: 6px;}
+.noteBox.show{display: block;}
+.noteBox.active{opacity: 1;}
+
+.sizeWaring:before{color:#f56c6c !important;}
+.empty_warn{border:1px solid #f56c6c !important;color: #f56c6c !important;}
+.empty_warn::placeholder{color: #f56c6c !important;}
+
+.hide{ display:none;}
+.unable{pointer-events:none;  opacity:0.5;  }
+
+
+.editor .Main{ 
+	height:20px;
+	align-items: center;
+    display: flex;
+    justify-content: space-between;
+} 
+.editor .Main .scrollBar {
+    position: relative;
+    width: calc(96% - 45px);
+    height: 4px;
+    background-color: #c7c7c7;
+    cursor: pointer;
+}
+.editor .scrollBar .scroll_Track {
+	width: 0px;
+    height: 4px;
+    background-color: #09e1c0;
+}
+.editor .scrollBar .scroll_Thumb {
+	height: 12px;
+    width: 14px;
+    background-color: #919191;
+    /*-webkit-border-radius: 8px;
+    -moz-border-radius: 8px;
+    border-radius: 4px;
+     -webkit-box-shadow: 0px 0px 5px #74b5f5;
+    -moz-box-shadow: 0px 0px 5px #74b5f5;
+    box-shadow: 0px 0px 4px #74b5f5; */
+    position: absolute;
+    margin-top: -8px;
+    cursor: pointer;
+    -webkit-user-select: none;
+}
+.editor .BarTxt {
+	position:relative;
+	width:40px;
+}
+.editor .BarTxt .scrollBarTxt{
+    width: 100%;
+    text-align: center;
+    height: 20px;
+    border: 0;
+    /* border-radius: 4px; */
+    padding: 4px 0;
+    text-align: center;
+    color: #fff;
+    background: #919191;
+    font-size: 12px;
+}
+.editor #floorLogoSize {
+    font-size: 12px;
+    width: 160px;
+}
+.editor #floorLogoSize .slider{
+	float: left;
+    width: 100%;
+}
+
+.editor #scenePSD span{
+	line-height: 24px;
+}
+.editor #scenePSD ul.MenuOptions{
+	width: 100%;
+    overflow: hidden; 
+    background: #fff; 
+    padding: 0px;
+    cursor: pointer;
+    flex-direction: row;
+    align-items: center;
+    
+}
+.editor #scenePSD .MenuOptions li{
+	float: left; 
+	text-align:center;
+	line-height: 28px;
+	font-size:14px;
+	display:inline-block; 
+	color:#999;
+	transition:color 0.1s;
+}
+ 
+
+
+.editor .MenuOptions li.chosen{
+	background-color:#09e1c0;
+	color:#fff !important
+} 
+.editor .MenuOptions li:hover{
+	color: #333;
+}
+.editor .MenuOptions li.chosen:hover{
+	background-color:#09e1c0;
+	color:#fff;
+
+}
+
+.editor .quarterCell{
+	width: 25%;
+} 
+.editor .thirdCell{
+	width: 33.33%;
+}
+.editor .halfCell{
+	width: 50%;
+}
+
+.editor  a.button{
+	width: 100%;
+    height: 30px;
+    background: #0ed8b9;
+    display: inline-block;
+    margin-top: 10px;
+    text-align: center;
+    color: #fff; 
+}
+.editor  a.button:hover{
+	background:#04c7a9;
+}
+.editor  a.button:active{
+	background:#05a089;
+}
+
+
+.editor  #scenePSD .word{
+	margin-top:10px; 
+}
+.editor  #scenePSD .word>*{
+	float:left;
+}
+.editor  #scenePSD .word input{
+	/* width: 75%;  */
+	width:100%;
+}
+ 
+			
+img{
+	pointer-events:none;
+}
+
+ 
+
+ 
+
+
+
+.editor .selection{
+    display: block;
+    position: relative;
+    height: 30px;
+    overflow: hidden;
+    color: #000;
+    padding-right: 40px;
+    padding-left: 10px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    background: #fff;
+    cursor: pointer;
+    outline: none;
+    line-height: 30px;
+	transition-duration:0.1s;
+	border: 1px solid white;
+}
+.editor  .selection:after{
+	content: "\f0d7";
+    display: block;
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 30px;
+    height: 30px;
+    font-family: FontAwesome;
+    text-align: center;
+    line-height: 30px;
+}
+.editor  .selection.focus{ 
+	color:#555;
+}
+.editor  ul.listOptions{
+	position: absolute;
+    left: 0px;
+    top: 56px;
+    z-index: 100;
+    width: 100%;
+    overflow: hidden; 
+    color: #9b9b9b;
+    background: #fff;
+    box-shadow: 0 5px 5px rgba(0,0,0,.3);
+	padding:0;
+	margin:0;
+	cursor:pointer;
+} 
+.editor  ul.listOptions>li{
+	height: 30px;
+    list-style-type: none;
+    color: #9b9b9b;
+    padding: 0 10px;
+    line-height: 30px;
+ /*    overflow: hidden; */
+    width:100%;
+    white-space: nowrap; 
+    margin: 0px;
+} 
+.editor  ul.listOptions>li.hover{
+    background: #fafafa;
+}
+
+#hotspot{
+	position: absolute;
+	height: 100%;
+	 
+	touch-action: none;
+	-webkit-user-select: none;
+	-webkit-user-drag: none;
+	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+	bottom:0;
+	left: 0;
+	pointer-events: none;
+	z-index:99;
+	transition:opacity 0.1s;
+}
+#hotspot *{
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+	-webkit-font-smoothing: antialiased;
+}		
+ 
+
+#hotspot>*{
+	pointer-events: all;
+	position:absolute;
+	display: block; 
+	
+}
+
+  
+
+#hotspot >.markspot{
+	background-image: url(../images/markspotAll.png);
+	background-size: cover;
+	background-repeat: no-repeat;
+	background-position: center -76px;
+	width: 60px;
+	height: 76px;
+	margin-left: -32px;
+	margin-top: -62px;
+	cursor: -webkit-grab;
+} 
+#hotspot >.markspot.zero{
+	background-position: center 0;
+}
+#hotspot >.markspot.two{
+	background-position: center -152px;
+}
+
+
+ 
+
+
+.editor .hotPoint_list{
+	width: calc(100% + 12px);/* 滑动条隐藏 */
+}
+ 
+.editor .hotPoint_list #list>li div.left>img{
+	width:24px;
+}
+
+.editor #select .showStyle>div:first-child > img{
+	width:20px;
+}
+.editor #select ul li > img{
+	width:40px;
+	height: auto;
+	display: block;
+}
+ 
+.warning-border{
+	border: 1px solid #f56c6c !important;
+}
+ 
+ 
+ 
+ 
+ @keyframes flash{
+  0% {
+    opacity: 0; }
+  1% {
+    opacity: 1; }
+  30% {
+    opacity: 1; }
+  100% {
+    opacity: 0; } 
+ }
+ #webgl .snapshotFlash{
+	opacity: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: -1;
+    background: #ffffff;
+    pointer-events: none;
+ }
+ #webgl .snapshotFlash.active{
+	z-index: 100;
+	-webkit-animation-name:flash;
+	animation-name:flash;
+	-webkit-animation-duration:1s;
+	animation-duration:1s;
+	-webkit-animation-fill-mode:both;
+	animation-fill-mode:both;
+}
+
+#webgl .snapshotGui{
+	position:absolute; 
+    z-index: 100;
+	width: calc(94% - 80px);
+    height: calc(85% - 80px);
+    border: 1px solid rgba(255,255,255,0.5); 
+    left: calc(3% + 40px);
+    top: calc(3% + 80px);
+	pointer-events: none;
+	opacity:0;
+	transition: opacity 0.3s,
+				border 0.3s;
+	
+}
+#webgl .snapshotGui .corner{
+	width:100px;
+	height:100px;
+	position:absolute;
+	transition:opacity 0.3s;
+	opacity: 0.5;
+}
+#webgl .snapshotGui.highLight .corner{
+	opacity: 0.8;
+}
+#webgl .snapshotGui.highLight{
+	border: 1px solid rgba(255,255,255,0.8); 
+}
+#webgl .snapshotGui .corner.leftTop{
+	border-top:4px solid #fff;
+	border-left:4px solid #fff;
+	left:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.rightTop{
+	border-top:4px solid #fff;
+	border-right:4px solid #fff;
+	right:-40px;
+	top:-40px;
+}
+#webgl .snapshotGui .corner.leftBott{
+	border-left:4px solid #fff;
+	border-bottom:4px solid #fff;
+	left:-40px;
+	bottom:-40px;
+}
+#webgl .snapshotGui .corner.rightBott{
+	border-right: 4px solid #fff;
+    border-bottom: 4px solid #fff;
+    right: -40px;
+    bottom: -40px;
+}
+ 
+#webgl .snapshotGui .confirmSnap{
+	background: rgba(9, 225, 192, 0.9);
+    color: #fff;
+    border-radius: 5px;
+    /* margin: 0 auto; */
+    bottom: 20px;
+    position: absolute;
+    width: 220px;
+    letter-spacing: 0.1em;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    font-size: 16px;
+    font-weight: 100;
+    left: calc(50% - 110px);
+    font-family: SourceHanSansCN;
+	pointer-events: all;
+	cursor:pointer;
+	transition:background 0.2s;
+}
+#webgl .snapshotGui .confirmSnap:hover{
+	background:rgba(9, 225, 192, 0.78)  /* #14ebca */
+}
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+