*{-moz-transition:background-color 0.15s;-webkit-transition:background-color 0.15s;-o-transition:background-color 0.15s;transition:background-color 0.15s;}
body{text-align:center;margin: 0;padding: 0;background-color:#ffffff;background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAABCAIAAABG0om7AAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAmSURBVHjaYvz//z8DEeDp06dMYMDMzIxGAgEjIyOEBKqEkwABBgCabwX/kcH7wAAAAABJRU5ErkJggg==);background-position:358px 0;background-repeat: repeat-y;}
#contentbox{font-size:12px;margin:0 auto ;min-width:1000px;}
#contentbox #leftbox{float:left;width:370px;padding:10px 30px;}
#contentbox #rightbox{float:right;position:relative;text-align:left;padding:10px 20px;min-height:100vh;width:-moz-calc(100% - 370px);width:-webkit-calc(100% - 370px);width:calc(100% - 370px);}
#contentbox #leftbox #headerlogo{display:block;text-align:center;height:90px;line-height:90px;font-size:20px;color:#707070;letter-spacing:2px;font-weight:bold;border-bottom: 1px dotted #d3d3d3;}
#contentbox #leftbox #headerlogo img{margin-bottom:-18px;}
#contentbox #leftbox #headerlogo h1{display:inline-block;font-weight:bold;font-size:16px;margin:0;}
#contentbox #leftbox .toolitem{margin:25px 0;}
#contentbox #leftbox .toolitem #fileinputbox{position:relative;height:350px;overflow:hidden;text-align:center;font-size:13px;padding-top:170px;line-height:23px;letter-spacing:3px;background-color: #f1ffed;color: #51a233;border:3px dotted #8bb98b;background-image:url(data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20448%20512%22%3E%3Cpath%20d=%22M416%20208H272V64c0-17.67-14.33-32-32-32h-32c-17.67%200-32%2014.33-32%2032v144H32c-17.67%200-32%2014.33-32%2032v32c0%2017.67%2014.33%2032%2032%2032h144v144c0%2017.67%2014.33%2032%2032%2032h32c17.67%200%2032-14.33%2032-32V304h144c17.67%200%2032-14.33%2032-32v-32c0-17.67-14.33-32-32-32z%22%20fill=%22%2351a233%22/%3E%3C/svg%3E);overflow:hidden;background-repeat:no-repeat;background-position:center 120px;background-size:40px 40px;-webkit-border-radius:8px;-ms-border-radius:8px;-o-border-radius:8px;-moz-border-radius:8px;border-radius:8px;}
#contentbox #leftbox .toolitem #fileinputbox:hover{background-color: #d3ffcd;}
#contentbox #leftbox .toolitem #fileinputbox #plusicon{display:block;text-align:center;width:35px;height:35px;}
#contentbox #leftbox .toolitem #fileinputbox input{position:absolute;width:100%;height:350px;top:0;bottom:0;left:0;right:0;opacity:0;cursor:pointer}
#contentbox #leftbox .toolitem #decodeinfo{display:none;padding:12px;text-align:center;background-color:#ff667b;color:#ffffff;border:2px solid #f14e5c;margin-bottom:15px;font-size:13px;line-height:25px;letter-spacing:2px;-webkit-border-radius:8px;-ms-border-radius:8px;-o-border-radius:8px;-moz-border-radius:8px;border-radius:8px;}
#contentbox #leftbox .toolitem #decodeinfo b{color:#ffffff;font-size:16px;margin:0 8px;}
#contentbox #leftbox div button.button {display:block;width:100%;height:35px;line-height:33px;margin-bottom:15px;letter-spacing:2px;background-color:#e7e7e7;color:#515151;border:1px solid #e7e7e7;text-align:center;-webkit-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-moz-transition:border-color 0.2s;-webkit-transition:border-color 0.2s;-o-transition:border-color 0.2s;transition:border-color 0.2s;}
#contentbox #leftbox div button.button:hover{color:#ffffff;background-color:#ff4456;border:1px solid #e23c4c;}
#contentbox #leftbox div button.mainbutton {display:block;width:100%;height:35px;line-height:33px;margin-bottom:15px;letter-spacing:2px;background-color:#5c5d61;color:#ffffff;border:1px solid #5c5d61;text-align:center;-webkit-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-moz-transition:border-color 0.2s;-webkit-transition:border-color 0.2s;-o-transition:border-color 0.2s;transition:border-color 0.2s;}
#contentbox #leftbox div button.mainbutton:hover{color:#ffffff;background-color: #ff4456;border:1px solid #e23c4c;}
#contentbox #leftbox a.link{display:block;height:30px;line-height:30px;text-align:center;text-decoration:none;}
#contentbox #leftbox a.link:hover{text-decoration:underline;}
#contentbox #leftbox #downloadrecord{margin-top:0;margin-bottom:20px;padding-bottom:20px;border-bottom: #dddddd dashed 1px;font-size:12px;text-align:left;}
#contentbox #leftbox #downloadrecord:before {content: '下载记录';display:block;margin-bottom:10px;font-weight:bold;font-size:12px;letter-spacing:2px;color:#3c3c3c;text-align:center;}
#contentbox #leftbox #downloadrecord a{display:block;height:25px;line-height:25px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#contentbox #leftbox #downloadrecord a:last-child{margin-bottom:0;}
#contentbox #leftbox #downloadrecord a:hover{text-decoration:underline;color:#ff667b;}
#contentbox #leftbox #downloadrecord a b.downloadtime{display:inline-block;font-weight:normal;width:120px;color:#a8a8a8;}
#contentbox #rightbox #rightheader{text-align:right;height:25px;line-height:25px;}
#contentbox #rightbox #rightheader span{display:inline-block;font-size:12px;color:#9e9e9e;margin:0 3px;letter-spacing:2px;}
#contentbox #rightbox #rightheader a{display:inline-block;font-size:13px;color:#4b4b4b;text-decoration:none;letter-spacing:2px;margin:0 3px;}
#contentbox #rightbox #rightheader a:hover{color:#ff667b;text-decoration:underline;}
#contentbox #rightbox #rightheadermessage{display:none;color:#3a87ad;background-color:#f0faff;border:1px solid #e0f3f7;font-size:12px;letter-spacing:2px;margin-top:15px;padding:10px;text-align:center;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#contentbox #rightbox #rightheadermessage a{margin:0 3px;}
#contentbox #rightbox #rightheadermessage a:hover{text-decoration:underline;}
#contentbox #rightbox #rightcontent{margin-top:30px;margin-bottom:150px;padding:0 15px;}
#contentbox #rightbox #rightcontent #emptyinfo{padding-top:280px;text-align:center;color:#8f8f8f;font-size:16px;line-height:40px;letter-spacing:3px;}
#contentbox #rightbox #rightcontent .item{display:inline-block;position:relative;min-height:100px;vertical-align:top;padding:15px;border-top:#e8e8e8 1px dashed;background-color:#ffffff;line-height:20px;letter-spacing:2px;-moz-transition:background-color 0.15s,width 0.2s,min-height 0.2s;-webkit-transition:background-color 0.15s,width 0.2s,min-height 0.2s;-o-transition:background-color 0.15s,width 0.2s,min-height 0.2s;transition:background-color 0.15s,width 0.2s,min-height 0.2s;}
#contentbox #rightbox #rightcontent .item:hover{background-color:#f1f1f1;}
#contentbox #rightbox #rightcontent .item.hover{background-color: #ececec;}
#contentbox #rightbox #rightcontent .item b.filename{display:block;padding:5px 10px;margin-bottom:15px;font-weight:normal;font-size:12px;color:#626262;background-color:#e9e9e9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#contentbox #rightbox #rightcontent .item img{float:left;width:80px;cursor:pointer;margin-right:15px;}
#contentbox #rightbox #rightcontent .item span{float:left;color:#333333;font-weight:bold;width:-moz-calc(100% - 80px - 15px);width:-webkit-calc(100% - 80px - 15px);width:calc(100% - 80px - 15px);}
#contentbox #rightbox #rightcontent div.item[state='0'] span{color:red;font-weight:bold;}
#contentbox #rightbox #rightcontent div.item[state='0'] a.copytext{display:none;}
#contentbox #rightbox #rightcontent .item button.button{position:absolute;display:none;background-color:#2c2c2c;color:#ffffff;font-size:12px;padding:3px 8px;-webkit-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
#contentbox #rightbox #rightcontent .item button.button:hover{background-color:#ff667b;}
#contentbox #rightbox #rightcontent .item button.button:active{background-color:#ac3e4d;}
#contentbox #rightbox #rightcontent .item:hover button.button{display:block;}
#contentbox #rightbox #rightcontent .item textarea.copyinput{position:absolute;bottom:0;opacity:0;}
#contentbox #rightbox #rightcontent .item textarea.text{display:none;}
#contentbox #footer{position:absolute;left:0;right:0;bottom:0;font-size:12px;color:#7b7b7b;text-align:center;margin:20px auto;letter-spacing:1px;line-height:23px;}
#contentbox #footer b{margin:0 5px;color:#ff8392;}
#contentbox #footer a{display:inline-block;margin:0 10px 0 0;}
#contentbox #footer a:hover{text-decoration:underline;}
#qrcodeperview{position:absolute;display: block;width: 0;height: 0;background-color:#e2e2e2;border-width: 0;border-color: #e2e2e2;border-style: solid;-moz-transition:width 0.2s,height 0.2s,border-width 0.2s;-webkit-transition:width 0.2s,height 0.2s,border-width 0.2s;-o-transition:width 0.2s,height 0.2s,border-width 0.2s;transition:width 0.2s,height 0.2s,border-width 0.2s;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#downloadinglayer{display:block;position:fixed;z-index:101;left:0;right:0;top:0;bottom:0;text-align:center;background-color:rgba(255, 255, 255, 0.95);padding-top:40vh;}
#downloadinglayer div{display:block;background-color: #ededed;height:18px;width:80vw;max-width:280px;margin:auto;padding:0;text-align:left;overflow:hidden;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#downloadinglayer div div.p{display:inline-block;height:18px;width:100%;cursor: default;background-color:#ff667b;background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:20px 20px;animation:reverse progress-bar-stripes 0.40s linear infinite,animate-positive 2s;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-moz-transition:width ease-out 0.3s;-webkit-transition:width ease-out 0.3s;-o-transition:width ease-out 0.3s;transition:width ease-out 0.3s;}
#downloadinglayer span{display:block;color: #7a7a7a;font-size:12px;margin:18px 0;letter-spacing:3px;}
#downloadinglayer .errorbutton,
#downloadinglayer .reload{display:none;color:#ff667b;font-size:12px;margin:18px 10px;letter-spacing:2px;text-decoration:underline;}
@keyframes progress-bar-stripes{from{background-position:20px 0}to{background-position:0 0}}
@media print{
    body{padding:0;margin:0;background:none;}
    #leftbox{display:none;}
    #contentbox{min-width:unset;}
    #contentbox #rightbox{float:unset;margin:0;padding:0;min-height:unset;width:unset;}
    #contentbox #rightbox #rightheader{display:none;margin:0;padding:0;}
    #footer{display:none;}
    @page{size:auto;margin:0;padding:0;border:none;}
}