.yk-canvas-wrapper{height:100%}.yk-canvas-wrapper .active1,.yk-canvas-wrapper .active2,.yk-canvas-wrapper .active3,.yk-canvas-wrapper .active4,.yk-canvas-wrapper .active5,.yk-canvas-wrapper .active6,.yk-canvas-wrapper .active7,.yk-canvas-wrapper .active8{background-color:#3fa2ff}.yk-canvas-wrapper .GreenBoard{z-index:-10;width:100%;height:100%;position:fixed;top:0;left:0;background-color:#304b4b}.yk-canvas-wrapper .yk-set-botton{position:fixed;bottom:0;right:0}.yk-canvas-wrapper .yk-set-botton ul{list-style:none;margin:0;padding:0;background:#1e3838}.yk-canvas-wrapper .yk-set-botton ul li{float:left;color:#fff;text-align:center;font-size:14px;padding:5px 0;border-right:1px solid #657a7a;width:70px}.yk-canvas-wrapper .yk-set-botton ul li span{display:inline-block;width:100%}.yk-canvas-wrapper .yk-set-botton ul li i{display:inline-block;width:100%;font-size:22px}.yk-canvas-wrapper .xpc{z-index:1000000;width:50px;height:50px;position:fixed;top:10px;left:10px;background-color:#fff}.yk-canvas-wrapper .yk-color-group-wrapper{z-index:10000;position:fixed;width:116px;right:421px;bottom:37px}.yk-canvas-wrapper .yk-color-group-wrapper .color-group-ul-wrapper{list-style:none}.yk-canvas-wrapper .yk-color-group-wrapper .color-group-ul-wrapper li{float:left;width:35px;height:35px}.yk-canvas-wrapper .colorClearfix:after{content:"";height:0;visibility:hidden;display:block;clear:both}.yk-canvas-wrapper .yk-pencil-wrapper{z-index:10000;position:fixed;width:63px;right:360px;bottom:51px}.yk-canvas-wrapper .yk-pencil-wrapper .color-group-ul-wrapper{list-style:none;padding:0}.yk-canvas-wrapper .yk-pencil-wrapper .color-group-ul-wrapper li{display:block;margin:0 auto;margin-top:10px;text-align:center;color:#fff;background-color:#3fa2ff;border-radius:50%}.yk-canvas-wrapper .yk-pencil-wrapper .color-group-ul-wrapper li:first-child{width:20px;height:20px}.yk-canvas-wrapper .yk-pencil-wrapper .color-group-ul-wrapper li:nth-child(2){width:30px;height:30px}.yk-canvas-wrapper .yk-pencil-wrapper .color-group-ul-wrapper li:last-child{width:40px;height:40px}@media screen and (max-width:700px){.yk-canvas-wrapper .yk-pencil-wrapper #canvas-brush,.yk-canvas-wrapper .yk-pencil-wrapper #canvas-drawImage h5,.yk-canvas-wrapper .yk-pencil-wrapper #img-box{display:none}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-drawImage button{width:auto;position:absolute;-webkit-box-flex:1;-ms-flex:1;flex:1}.yk-canvas-wrapper .yk-pencil-wrapper .wrap #control{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;text-align:center}}.yk-canvas-wrapper .yk-pencil-wrapper .fix-body{position:fixed!important;left:0;top:0;bottom:0;right:0;overflow:hidden}.yk-canvas-wrapper .yk-pencil-wrapper .inner.draw{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.yk-canvas-wrapper .yk-pencil-wrapper .draw h5{margin-bottom:10px}.yk-canvas-wrapper .yk-pencil-wrapper #img-box{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-left:10px}.yk-canvas-wrapper .yk-pencil-wrapper #img-box .img-item .fa{position:absolute;cursor:pointer;right:1px;top:-1px;font-size:12px;font-weight:1;display:none;color:#ccc}.yk-canvas-wrapper .yk-pencil-wrapper #img-box .img-item:hover .fa{display:block}.yk-canvas-wrapper .yk-pencil-wrapper #img-box .img-item .fa:hover{color:#f2849e}.yk-canvas-wrapper .yk-pencil-wrapper #img-box img{border:1px solid #ccc;width:90px;height:60px;margin:5px}.yk-canvas-wrapper .yk-pencil-wrapper .wrap{width:740px;border:1px solid #585858;overflow:hidden}.yk-canvas-wrapper .yk-pencil-wrapper .fl{display:block}.yk-canvas-wrapper .yk-pencil-wrapper #canvas{border-right:1px solid #585858;cursor:crosshair}.yk-canvas-wrapper .yk-pencil-wrapper #control{width:130px;height:400px;margin-left:4px}.yk-canvas-wrapper .yk-pencil-wrapper #control div{padding:5px}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-color ul{overflow:hidden;margin:0;padding:0}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-color ul li{float:left;display:inherit;width:13px;height:13px;border:3px solid #fff;margin:8px;cursor:pointer}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-color .active{border:1px solid #f2849e}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-brush span{display:inline-block;width:20px;height:15px;margin-left:10px;cursor:pointer}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-brush .small{font-size:12px}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-brush .middle{font-size:14px}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-brush .big{font-size:16px}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-control span{display:inline-block;font-size:14px;width:20px;height:15px;margin-left:10px;cursor:pointer}.yk-canvas-wrapper .yk-pencil-wrapper #canvas-brush .active,.yk-canvas-wrapper .yk-pencil-wrapper #canvas-control .active{color:#f2849e}.yk-canvas-wrapper .yk-pencil-wrapper .drawImage{width:100px;height:30px;font-size:12px;line-height:30px}