#create,#update{width:100%;height:100%;padding:20px}#studio{position:relative;height:100%;width:100%;background:#ebebeb}.app-head{position:fixed;top:0;left:0;width:100%;height:50px;z-index:100;background:#313542;padding:0 20px}.app-logo{height:50px;line-height:50px;color:#fff;font-size:22px;font-weight:600}.app-search{float:right;display:flex;height:30px;margin:9px 0;margin-right:20px;border:1px solid #fff;border-radius:4px;background:#fff}.app-search>div{background:#8d8d8d;border-radius:4px}.app-search>div:hover{background:#686868}.app-search>div:active{background:#8d8d8d;-webkit-user-select:none;-moz-user-select:none;user-select:none}.app-search>div img{height:14px;width:14px;margin:6px}.app-search input{height:100%;width:130px;border:none;padding:0 10px;margin:none;outline:none}.app-menu{position:absolute;z-index:19970801;top:50px;left:0;width:240px;bottom:0;background-color:#304156;border-right:1px solid #ebebeb;overflow-x:hidden;overflow-y:auto}.app-menu-name{height:50px;line-height:50px;font-weight:700;color:#eee;border-bottom:1px solid #e8ecf0}.app-menu-app,.app-menu-name{position:relative;width:100%;font-size:14px;padding-left:30px}.app-menu-app{display:block;height:40px;line-height:40px;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none}.app-menu-app:hover{background:#1a2427}.app-menu-area{position:absolute;top:0;left:0;height:100%;width:3px;background:#108cee}.app-create{float:right;height:30px;line-height:28px;margin:9px 0;padding:0 14px;border-radius:4px;border:1px solid #d7d7d7;color:hsla(0,0%,100%,.7019607843137254);-webkit-user-select:none;-moz-user-select:none;user-select:none}.app-create:hover{color:#fff}.app-create:active{color:#1a2427}.app-compose{top:100px;height:calc(100% - 100px);overflow-y:scroll}.app-compose,.app-compose-head{position:absolute;left:250px;width:calc(100% - 250px);background:#fff}.app-compose-head{display:flex;top:50px;height:50px;border-bottom:1px solid #e8ecf0}.app-compose-head .mu-button{width:50px;height:32px;margin:8px 10px 8px 10px}#studio .app-compose-head .mu-button-small{height:32px;width:32px}.layui-input{height:32px;border:none;padding:0 10px;margin:8px 0 8px 10px;outline:none;border:1px solid #e8ecf0;font-size:12px}.app-compose-item{float:left;width:238px;height:298px;margin-left:10px;margin-top:10px;border-radius:1px;border:1px solid #d7d7d7}.app-compose-img{position:relative;width:100%;height:160px}.app-compose-img img{display:inline-block;width:100%;height:100%}.app-compose-img>label{position:absolute;top:0;right:0;height:30px;width:30px;padding:5px;cursor:pointer;background:rgba(0,0,0,.4);border-radius:0 0 0 4px}.app-compose-img svg{width:100%;height:100%}.app-compose-info{height:58px;width:100%;padding-right:8px;border-top:1px solid #eee;border-bottom:1px solid #eee}.app-compose-check{position:relative;float:left;width:40px;height:60px}.app-compose-checkbox{width:16px;height:16px;margin:22px 12px;border-radius:2px;border:1px solid #d2d2d2}.app-compose-checkbox:hover{border:1px solid #a0a0a0;cursor:pointer}.app-compose-name{border-bottom:1px solid #eee}.app-compose-id,.app-compose-name{position:relative;float:right;width:185px;height:30px;padding-left:5px;font-size:12px;line-height:30px;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.app-compose-foot{width:100%;height:76px;padding:10px 0}.app-compose-but{position:relative;float:left;width:25%;margin:5px 0;border-right:1px solid #d7d7d7;line-height:18px;text-align:center;font-size:12px;color:#1694f3;cursor:pointer}.app-compose-but:hover{color:#333}.border-none{border:none}.app-material-public{position:absolute;top:141px;height:calc(100% - 141px);overflow-x:hidden;overflow-y:scroll}.app-material-nav,.app-material-public{left:250px;width:calc(100% - 250px);background:#fff}.app-material-nav{position:relative;top:50px;min-height:50px;border-bottom:1px solid #d7d7d7;overflow:hidden;padding-top:10px}.app-material-nav .name{float:left;width:90px;height:50px;line-height:36px;font-size:14px;font-weight:700;color:#666;padding-left:10px;overflow:hidden}.app-material-nav .url{display:block;width:auto;height:30px;line-height:30px;text-align:center;float:left;border:1px solid #d7d7d7;margin:0 10px 10px 0;padding:0 20px;color:#333;font-size:12px;border-radius:5px;background-color:#fff;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer}.material-item{float:left;margin:10px;border-radius:8px}.material-item,.material-item .img{position:relative;width:140px;overflow:hidden}.material-item .img{height:160px;line-height:160px;text-align:center;border:1px solid #d7d7d7;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQwIDc5LjE2MDQ1MSwgMjAxNy8wNS8wNi0wMTowODoyMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDkzNzZFN0RDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDkzNzZFN0VDODhFMTFFOEExOUJFNkQ0MTNFM0Q2OTYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEOTM3NkU3QkM4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEOTM3NkU3Q0M4OEUxMUU4QTE5QkU2RDQxM0UzRDY5NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PktroGEAAAAoSURBVHjaYvz06RMDDPDy8sLZTAw4AOkSjP///4dzPn/+TAs7AAIMAG56COJosoI3AAAAAElFTkSuQmCC);background-repeat:repeat}.material-item .img img{display:inline-block;max-width:100%;max-height:100%;width:auto;height:auto;border:none;vertical-align:middle}.material-item .btn{position:absolute;top:0;left:0;right:0;bottom:0;z-index:99;padding:20px 0;background-color:#108cee;display:none;overflow:hidden}.material-item:hover .btn{display:flex;flex-flow:column}.material-item .btn>div,.material-item .btn a{flex:1;font-size:14px;line-height:60px;color:#c5c5c5;cursor:pointer;text-align:center}.material-item .btn>div:hover,.material-item .btn a:hover{color:#fff;background-color:#1686db}.app-material-private{position:absolute;top:100px;left:250px;height:calc(100% - 100px);width:calc(100% - 250px);padding:10px;background:#fff;overflow-x:hidden;overflow-y:scroll}.materialUpload{background:#2196f3;border-radius:36px;font-size:14px;min-width:88px;height:32px;line-height:32px;text-align:center;padding:0 16px;color:#fff;margin:9px 0 9px 20px;box-shadow:3px 3px 6px rgba(0,0,0,.2)}.materialUpload:hover{background:#3aa6ff}.materialUpload:active{background:#3aa6ff;box-shadow:3px 3px 13px rgba(0,0,0,.4)}