body{text-align:left;background-color:#f2f4f9;padding:0;}
.button{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}

#leftmainbox{position:fixed;z-index:101;top:0;left:0;bottom:0;background-color:#ffffff;border-right: #f2f4f9 1px solid;}
#leftmainbox #topbarlogo{position:relative;display:block;text-align:center;padding-bottom:20px;border-bottom:1px #e2e2e2 dashed;}
#leftmainbox #topbarlogo img{position:absolute;top:-7px;left:38px;border:none;margin:auto;}
#leftmainbox #topbarlogo span{display:block;}
#leftmainbox #topbarlogo span.t{margin:10px 0 0 18px;font-size:20px;color:#555555;letter-spacing:2px;font-weight:bold;}
#leftmainbox #topbarlogo h1{display:block;margin:28px auto 0 0;padding: 0;font-size: 20px;color:#000000;letter-spacing: 2px;font-weight: bold;}
#leftmainbox #topbarlogo h1 span{display:unset;margin:0;color:red;}
#leftmainbox #topbarlogo span.r{font-size:12px;letter-spacing:1px;margin:15px 0 0 0;color: #afafaf;}
#leftmainbox button.minbutton{position:relative;display:block;width:100%;text-align:center;margin:55px 0 0 0;letter-spacing:2px;background-color:#f2f4f9;color:#000000;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#leftmainbox button.minbutton span{color:#000000;letter-spacing:2px;}
#leftmainbox button.minbutton:before {content:attr(index);display:block;position:absolute;top:-moz-calc(50% - 30px);top:-webkit-calc(50% - 30px);top:calc(50% - 30px);left:-16px;width:30px;height:30px;line-height:30px;border:3px solid #ffffff;color:inherit;font-weight: bold;background-color: inherit;text-align: center;font-size: 16px;-webkit-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
#leftmainbox button.minbutton:first-of-type:after {content: attr(count);display: inline-block;position: absolute;top:-18px;right:0;font-size: 12px;text-align: right;height: 23px;line-height: 23px;letter-spacing: 1px;color: #2e2e2e;opacity: 0.5;transform: scale(0.8);}
#leftmainbox button.minbutton:first-of-type:hover:after {opacity:1;}
body #leftmainbox button.active:first-of-type:after{opacity:1;}

#leftmainbox button.minbutton:hover{background-color:#ff667b;color:#ffffff;}
#leftmainbox button.minbutton:hover span{color:#ffffff;}
#leftmainbox button.minbutton:active{background-color:#ffa0b1;color:#ffffff;}
#leftmainbox button.minbutton:active span{color:#ffffff;}
body #leftmainbox button.active{background-color:#ff667b;color:#ffffff;}
body #leftmainbox button.active span{color:#ffffff;}
#leftmainbox button.minbutton i,#leftmainbox button.active i{color:inherit;margin-right:8px;}

#leftmainbox #linkbox{position:absolute;bottom:20px;left:20px;text-align: center;}
#leftmainbox #linkbox *{-moz-transition:none;-webkit-transition:none;-o-transition:none;transition:none;}
#leftmainbox #linkbox a.button{display:block;height:30px;line-height:30px;letter-spacing:2px;margin-bottom:15px;background-color:#f2f4f9;color:#303030;font-size:12px;border-radius:4px;}
#leftmainbox #linkbox a.button:hover{background-color:#6d6e72;color:#ffffff;}
#leftmainbox #linkbox a.button:active{background-color:#f2f4f9;color:#303030;}
#leftmainbox #linkbox #moremenu{display:none;position:absolute;z-index:10;bottom:50px;left:-10px;right:-10px;text-align:center;border-radius:4px;padding:3px 0 15px 0;background-color:#ffffff;-moz-box-shadow:0 0 10px 0 #7e7e7e;-webkit-box-shadow:0 0 10px 0 #7e7e7e;box-shadow:0 0 10px 0 #7e7e7e;overflow: hidden;}
#leftmainbox #linkbox #moremenu img{display:block;max-width:100%;margin:auto;padding:0;border:none;}
#leftmainbox #linkbox #moremenu span.imgremark{display:block;color:#a3a3a3;font-size:12px;margin:0 0 10px 0;text-align:center;line-height:unset;}
#leftmainbox #linkbox #moremenu a.more{display:block;height:35px;line-height:35px;color: #2c2c2c;font-size:12px;letter-spacing:2px;text-align:center;border-top:1px #f1f1f1 solid;}
#leftmainbox #linkbox #moremenu a.more:hover{text-decoration:underline; }
#leftmainbox #linkbox a.m{display:inline-block;color:#858585;font-size:12px;line-height:25px;margin:0 5px;}
#leftmainbox #linkbox a.m:hover{color:#000000;text-decoration:underline;}

#leftmainbox #linkbox a.authmember{display:block;color:#0da90b;border:1px #87d370 solid;background-color:#ffffff;line-height:28px;letter-spacing:2px;margin-bottom:10px;font-size:12px;border-radius:4px;}
#leftmainbox #linkbox a.authmember:hover{color:#ffffff;background-color:#0da90b;border:1px #0da90b solid;text-decoration:none;}
#leftmainbox #linkbox a.authmember:active{background-color: #8de387;}

#leftmainbox #linkbox #createcountinfobutton{position:relative;display:block;width:100%;margin-bottom:10px;background-color:#f2f4f9;color:#303030;font-size:0;overflow:hidden;border-radius:4px;}
#leftmainbox #linkbox #createcountinfobutton:before{content:attr(t);position:relative;z-index:1;display:block;height:30px;line-height:30px;letter-spacing:2px;color:inherit;font-size:12px;text-align:center;}
#leftmainbox #linkbox #createcountinfobutton:after{content:'';position:absolute;z-index:0;display:block;left:0;top:0;bottom:0;width:calc(1% * var(--createcountprogress));background-color:#dddddd;border-radius:5px;transition:width 0.8s;}
#leftmainbox #linkbox #createcountinfobutton:hover{background-color:#6d6e72;color:#ffffff;}
#leftmainbox #linkbox #createcountinfobutton:hover:after{display:none;}
#leftmainbox #linkbox #createcountinfobutton:active{background-color:#f2f4f9;color:#303030;}

#importdatabox{position:absolute;z-index:101;top:0;bottom:0;right:0;background-color:#ffffff;font-size:0;}
#importdatabox iframe{border:none;background-color:#ffffff;margin:0;padding:0;width:100%;height:100vh;}

#qrcodeeditbox {-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
#qrcodeeditbox #previeweditqrcodebox{margin-top:20px;text-align:center;-moz-transition: margin-top 0.35s;-webkit-transition: margin-top 0.35s;-o-transition: margin-top 0.35s;transition: margin-top 0.35s;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode{position:relative;display:inline-block;max-width:90%;font-size:0;box-shadow:0 0 10px 0 #bcbcbc;-moz-box-shadow:0 0 10px 0 #bcbcbc;-webkit-box-shadow:0 0 10px 0 #bcbcbc;background-repeat:repeat;background-image:url(data:image/gif;base64,R0lGODlhDAAMAMQAAP///+bm5gAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAMAAwAAAUcYCCOQGmOpFmiorqyLsAG8RzXsGvrubr7vRMrBAA7);}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode button.activeevent {position: absolute;border-radius: 5px;border: 1px solid transparent;background-color: transparent;-moz-transition: none;-webkit-transition: none;-o-transition: none;transition: none;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode button.activeevent:hover{border-color:rgba(143,217,255,0.35);background-color:rgba(143,217,255,0.2);}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode button.activeevent:active{border-color:rgba(143,217,255,0.6);background-color:rgba(143,217,255,0.4);}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode img.preview{display:block;width:100%;height:auto;max-height:75vh;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode svg{position:absolute;left:0;top:0;z-index:-100;visibility:hidden;display:block;width:100%;height:auto;max-height:75vh;}
#qrcodeeditbox #previeweditqrcodebox span{display:block;line-height:25px;margin:50px auto 0 auto;font-size:12px;color:#a2a2a2;letter-spacing:1px;-moz-transition:color linear 0.15s;-webkit-transition:color linear 0.15s;-o-transition:color linear 0.15s;transition:color linear 0.15s;}
#qrcodeeditbox #previeweditqrcodebox:hover span{color:#303030;}
#qrcodeeditbox #previeweditqrcodebox span a{color: inherit;text-decoration: underline;}
#qrcodeeditbox #previeweditqrcodebox span a:hover{color:#ff667b;}
#qrcodeeditbox #previeweditqrcodebox span button.button{display:inline-block;font-size:12px;color: #000000;letter-spacing:1px;padding:0 7px;margin:0 7px;text-decoration:none;line-height:23px;border-radius:4px;background-color:#ffffff;border:1px solid #e9e9e9;}
#qrcodeeditbox #previeweditqrcodebox span button.button:hover{color:#ffffff;background-color:#4f4f4f;}
#qrcodeeditbox #previeweditqrcodebox span button.button:active{color:#ffffff;background-color:#868686;}
#qrcodeeditbox #previeweditqrcodebox button.previewremarkbutton{display:inline-block;font-size:12px;background-color:#dbdbdb;color:#000000;text-decoration: none;margin:0 5px;padding: 0 10px;height: 22px;line-height: 22px;text-align: center;border-radius: 3px;}
#qrcodeeditbox #previeweditqrcodebox button.previewremarkbutton:hover{background-color:#ff667b;color:#ffffff;}
#qrcodeeditbox #qrcodemenubox{position:fixed;z-index:101;top:0;bottom:0;right:0;overflow-y:auto;font-size:0;padding:0;background-color:#ffffff;}
#qrcodeeditbox #qrcodemenubox iframe{width:100%;height:100vh;}

#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_x{opacity:0.5;position:absolute;left:0;bottom:-30px;z-index:100;width:100%;height:12px;padding:0;margin:0;border-top:1px solid #969fa8;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_y{opacity:0.5;position:absolute;top:0;right:-30px;z-index:100;width:12px;height:100%;padding:0;margin:0;border-left:1px solid #969fa8;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_x:before{content:attr(min);position:absolute;z-index:100;left:-3px;bottom:-10px;width:55px;text-align:left;font-size:12px;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_x:after{content:attr(max);position:absolute;z-index:100;right:-70px;bottom:-3px;width:65px;text-align:left;font-size:12px;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_y:before{content:attr(min);position:absolute;z-index:100;top:-4px;right:-55px;width:55px;text-align:left;font-size:12px;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_y:after{content:attr(max);position:absolute;z-index:100;bottom:-15px;right:-55px;width:65px;text-align:left;font-size:12px;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_x #ruler_x_sign{position:absolute;left:0;bottom:0;z-index:101;border-left:1px dotted #000000;height:100%;}
#qrcodeeditbox #previeweditqrcodebox #previeweditqrcode #ruler_y #ruler_y_sign{position:absolute;top:0;right:0;z-index:101;border-top:1px dotted #000000;width:100%;}
#qrcodeeditbox #previeweditqrcodebox:hover #previeweditqrcode #ruler_x{opacity:1;}
#qrcodeeditbox #previeweditqrcodebox:hover #previeweditqrcode #ruler_y{opacity:1;}

#qrcodeeditbox #toolButton{position:fixed;z-index:101;display:block;text-align:center;top:50px;right:355px;padding:10px;border-radius:8px;background-color: rgba(242,244,249,0.75);}
#qrcodeeditbox #toolButton button.button{display:block;width:90px;font-size:12px;background-color:#ffffff;color:#242424;margin:0 auto 10px auto;letter-spacing:1px; height:40px;line-height:40px;text-align:center;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;user-select: none;-webkit-user-drag: none;}
#qrcodeeditbox #toolButton button.button:hover{background-color:#5c5d61;color:#ffffff;}
#qrcodeeditbox #toolButton button.button:active{background-color:#8f9197;}
#qrcodeeditbox #toolButton button.button:last-child{margin-bottom:0;}
body #qrcodeeditbox #toolButton button.active{background-color:#5c5d61;color:#ffffff;}
#qrcodeeditbox #toolButton a.remark{display:block;width:100px;color: #9b9b9b;background:none;border:none;letter-spacing:1px;margin-top:20px;font-size:12px;}
#qrcodeeditbox #toolButton a.remark:hover{color:#000000;text-decoration:underline;}

#qrcodeeditbox #qrcodemenubox a.button{display: block;text-align: center;font-size: 12px;margin:35px 0 0 0 ;background-color:#f2f4f9;color:#303030;letter-spacing:2px; height:35px;line-height:35px;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#qrcodeeditbox #qrcodemenubox a.button:hover{background-color:#ff667b;color:#ffffff;}
#qrcodeeditbox #qrcodemenubox a.button:active{background-color:#f2f4f9;color:#303030;}

#exportdatabox{position:relative;display:block;background-color:transparent;border-top:1px solid transparent;padding:0;right:0;min-height:100vh;}
#exportdatabox #exportitembox{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));grid-gap:40px;padding:20px 50px 35px 35px;}
#exportdatabox #exportitembox .exportitem{display:block;background-color:#ffffff;border:3px #ffffff solid;padding:20px;margin:0;font-size:12px;letter-spacing:1px;-webkit-border-radius:15px;-ms-border-radius:15px;-o-border-radius:15px;-moz-border-radius:15px;border-radius:15px;-moz-transition:border-color 0.35s;-webkit-transition:border-color 0.35s;-o-transition:border-color 0.35s;transition:border-color 0.35s;}
/*body #exportdatabox #exportitembox .exportitem:hover{border:3px #838383 solid; }*/
#exportdatabox #exportitembox .exportitem h5{color:#000000;border-bottom:1px #dedede dashed;font-size:16px;letter-spacing:2px;margin:0 0 10px 0;padding:0 0 15px 0;}
#exportdatabox #exportitembox .exportitem h5 span.new{float:right;display:inline-block;font-weight: normal;cursor:default;min-height:unset;height:20px;line-height:20px;letter-spacing:0;padding:0 5px;font-size:12px;text-align:center;color: #ffffff;background-color: #ff2035;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#exportdatabox #exportitembox .exportitem h5 span.gd{float:right;display:inline-block;font-weight: normal;cursor:default;min-height:unset;height:20px;line-height:20px;letter-spacing:0;padding:0 5px;font-size:12px;text-align:center;color: #ffffff;background-color: #74ab00;-webkit-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#exportdatabox #exportitembox .exportitem span{display:block;line-height:23px;color:#989898;font-size:12px;}
#exportdatabox #exportitembox .exportitem span a{color:inherit;text-decoration:underline;cursor:pointer;}
#exportdatabox #exportitembox .exportitem span a:hover{color:#ff667b;}
#exportdatabox #exportitembox .exportitem span strong,
#exportdatabox #exportitembox .exportitem span b{margin: 0 5px;}
#exportdatabox #exportitembox .exportitem div.button{margin-top:15px;text-align:center;font-size:0;}
#exportdatabox #exportitembox .exportitem div.button button{display:inline-block;background-color: #f2f4f9;font-size:12px;color: #323232;padding:0 5px;margin:5px;width:30%;height:30px;line-height:28px;letter-spacing:2px;border-radius:3px;}
#exportdatabox #exportitembox .exportitem div.button button i{color:inherit;font-size:inherit;}
#exportdatabox #exportitembox .exportitem:hover div.button button{cursor:pointer;background-color: #636363;color: #ffffff;}
#exportdatabox #exportitembox .exportitem:hover div.button button:hover{background-color:#ff667b;color:#ffffff;}
body #exportdatabox #exportitembox .exportitem:hover div.button button:active{background-color: #dadbdb;color: #4e4e4e;}
body #exportdatabox #exportitembox .exportitem:hover span.new{color:#ffffff;}
#exportdatabox #exportitembox .exportitem div.button button:active{background-color:#dbdbdb;color:#000000;}
#exportdatabox #exportitembox .exportitem[heat="5"],
#exportdatabox #exportitembox .exportitem[heat="6"],
#exportdatabox #exportitembox .exportitem[heat="7"],
#exportdatabox #exportitembox .exportitem[heat="8"],
#exportdatabox #exportitembox .exportitem[heat="9"],
#exportdatabox #exportitembox .exportitem[heat="10"]{position:relative;border:3px #74AB00 solid;}
#exportdatabox #exportitembox .exportitem[heat="5"]:before,
#exportdatabox #exportitembox .exportitem[heat="6"]:before,
#exportdatabox #exportitembox .exportitem[heat="7"]:before,
#exportdatabox #exportitembox .exportitem[heat="8"]:before,
#exportdatabox #exportitembox .exportitem[heat="9"]:before,
#exportdatabox #exportitembox .exportitem[heat="10"]:before{content:'常用';display:inline-block;position:absolute;right:10px;top:-22px;width:45px;height:20px;line-height:20px;background-color: #74AB00;text-align:center;font-size:12px;color:#ffffff;letter-spacing: 2px;border-top-left-radius:5px;border-top-right-radius:5px;-moz-transition:background-color 0.35s;-webkit-transition:background-color 0.35s;-o-transition:background-color 0.35s;transition:background-color 0.35s;}
/*body #exportdatabox #exportitembox .exportitem:hover:before{background-color:#838383; }*/

#exportdatabox #allqrcodebox{display: none;background-color: #f2f4f9;position: absolute;top: 0;right: 0;left: 0;z-index: 101;width: 100%;height: -moz-calc(100vh - 2px);height: -webkit-calc(100vh - 2px);height: calc(100vh - 2px);}
#exportdatabox #allqrcodebox iframe{width:100%;height:99.6%;}
#exportdatabox #exportmsg{display:none;text-align:center;font-size:13px;;padding:10px;margin:10px 50px 0 35px;background-color:#fdff91;color:#5d4a00;border:1px solid #ffe94a;border-radius:8px ;}
#exportdatabox #exportmsg a{color:#ff8280;text-decoration:underline;margin:0 5px;;}
#exportdatabox #exportmsg a:hover{color:#ff667b;}
#exportdatabox #exportmsg a:active{color:inherit;}
#exportdatabox #exportmsg b{color:inherit;margin:0 5px;}
#exportdatabox #exportremark{text-align:right;padding:10px;margin:0 60px 0 40px;}
#exportdatabox #exportremark button{display:inline-block;font-size:13px;color:#7d7d7d;letter-spacing:2px;text-decoration:none;}
#exportdatabox #exportremark button:hover{text-decoration:underline;color:#000000;}
#exportdatabox #exportremark button:active{text-decoration:none;color:#828282;}

#downloadinglayer{display:block;position:fixed;z-index:101;left:0;right:0;top:0;bottom:0;text-align:center;background-color: rgb(255, 255, 255);padding-top:40vh;}
#downloadinglayer div{display:block;background-color: #ededed;height:18px;width:80vw;max-width:380px;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 ,downloading-bar-stripes 3s ease;-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;cursor:pointer;color:#ff667b;border:none;background:none;font-size:12px;margin:0px 10px;letter-spacing:2px;text-decoration:underline;}
@keyframes downloading-bar-stripes{from{width:0;}to{width:100%;}}
#progressbarlayer{display:none;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;}
#progressbarlayer div{display:block;background-color: #ededed;height:18px;width:300px;margin:auto;padding:0;text-align:left;overflow:hidden;-webkit-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
#progressbarlayer div div.p{display:inline-block;height:18px;width:0;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;-webkit-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-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;}
#progressbarlayer span{display:block;color: #7a7a7a;font-size:12px;margin-top:18px;letter-spacing:3px;}
#progressbarlayer button.cancel{display:inline-block;font-size:12px;color:#636363;background-color:#e2e2e2;margin-top:15px;padding:0 12px;height:25px;line-height:25px;border-radius:4px;-moz-transition:none;-webkit-transition:none;-o-transition:none;transition:none;}
#progressbarlayer button.cancel:hover{color:#ffffff;background-color:#4d4d4d;}
#progressbarlayer button.cancel:active{color:#ffffff;background-color:#929292;}

@keyframes progress-bar-stripes{from{background-position:20px 0}to{background-position:0 0}}

#printbox{display:none;align-items:center;justify-content:center;text-align:justify;width:100vw;height:100vh;overflow:hidden;}
#printbox img{max-width:95%;max-height:95%;margin: auto;}
@media print{
    body{padding:0;margin:0;background:none;border:none;width:unset;height:unset;min-width:unset;max-width:unset;min-height:unset;max-height:unset;}
    body *{display:none;}
    body #exportdatabox{display:none;}
    body #importdatabox{display:none;}
    body #qrcodeeditbox{display:none;}
    body #printbox{display:flex;width:100vw;height:100vh;max-width:100vw;max-height:100vh;align-items:center;justify-content:center;text-align:justify;overflow:hidden;margin:0;padding:0;border:none;background:none;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;}
    body #printbox img{display:block;max-width:100%;max-height:100%;vertical-align:bottom;margin:0;padding:0;border:none;background:none;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;}
    @page{size:auto;margin:0;padding:0;border:none;}
}

@media screen and (min-width:2200px) {
    #leftmainbox{width:230px;padding:15px 25px 25px 25px;text-align:left;}
    #leftmainbox button.minbutton{display:block;height:40px;line-height:40px;font-size:13px;}
    #leftmainbox #linkbox{width:185px;}
    #qrcodeeditbox{margin:0 370px 0 250px;}
    #qrcodeeditbox #qrcodemenubox{width:350px;}
    #exportdatabox{margin-left:250px;}
    #importdatabox{width:-moz-calc(100% - 250px);width:-webkit-calc(100% - 250px);width:calc(100% - 250px);}
}
@media screen and (min-width:1751px) and (max-width:2200px) {
    #leftmainbox{width:230px;padding:15px 25px 25px 25px;text-align:left;}
    #leftmainbox button.minbutton{display:block;height:40px;line-height:40px;font-size:13px;}
    #leftmainbox #linkbox{width:185px;}
    #qrcodeeditbox{margin:0 370px 0 250px;}
    #qrcodeeditbox #qrcodemenubox{width:350px;}
    #exportdatabox{margin-left:250px;}
    #importdatabox{width:-moz-calc(100% - 250px);width:-webkit-calc(100% - 250px);width:calc(100% - 250px);}
}
@media screen and (min-width:1601px) and (max-width:1750px) {
    #leftmainbox{width:230px;padding:15px 25px 25px 25px;text-align:left;}
    #leftmainbox button.minbutton{display:block;height:40px;line-height:40px;font-size:13px;}
    #leftmainbox #linkbox{width:185px;}
    #qrcodeeditbox{margin:0 370px 0 250px;}
    #qrcodeeditbox #qrcodemenubox{width:350px;}
    #exportdatabox{margin-left:250px;}
    #importdatabox{width:-moz-calc(100% - 250px);width:-webkit-calc(100% - 250px);width:calc(100% - 250px);}
}
@media screen and (min-width:1280px) and (max-width:1600px) {
    #leftmainbox{width:215px;padding:15px 25px;text-align:left;}
    #leftmainbox #topbarlogo img{left:32px;}
    #leftmainbox #topbarlogo span.t{margin-left:20px; }
    #leftmainbox #topbarlogo h1{margin-top:15px;}
    #leftmainbox button.minbutton{display:block;height:40px;line-height:40px;font-size:13px;}
    #leftmainbox #linkbox{width:170px;}
    #qrcodeeditbox{margin:0 290px 0 250px;}
    #qrcodeeditbox #qrcodemenubox{width:280px;}
    #qrcodeeditbox #toolButton{right:290px;}
    #qrcodeeditbox #toolButton a.button{width:75px;height:35px;line-height:35px;}
    #exportdatabox{margin-left:225px;}
    #importdatabox{width:-moz-calc(100% - 225px);width:-webkit-calc(100% - 225);width:calc(100% - 225px);}
}
@media screen and (max-width:1279px){
    #leftmainbox{width:80px;padding:10px;text-align:center;}
    #leftmainbox #topbarlogo{position:static;text-align: center;}
    #leftmainbox #topbarlogo img{position:static;}
    #leftmainbox #topbarlogo h1{display:none;}
    #leftmainbox #topbarlogo span{display:none;}
    #leftmainbox button.minbutton{height:50px;line-height:50px;font-size:16px;text-align:center;margin:10px 0;letter-spacing:0;}
    #leftmainbox button.minbutton span{display:none;}
    #leftmainbox button.minbutton:before{display:none;}
    #leftmainbox button.minbutton:first-of-type:after{display: block;width: 90px;text-align: center;left: -15px;right: unset;transform: scale(0.70);opacity:1;overflow: hidden;}
    #leftmainbox button.minbutton i{margin-right:0;}
    #leftmainbox #linkbox{display:none;}
    #qrcodeeditbox #toolButton{right:290px;}
    #qrcodeeditbox #toolButton a.button{width:75px;height:35px;line-height:35px;}
    #qrcodeeditbox{margin:0 290px 0 35px;}
    #qrcodeeditbox #qrcodemenubox{width:280px;}
    #exportdatabox{margin-left:90px;}
    #importdatabox{width:-moz-calc(100% - 90px);width:-webkit-calc(100% - 90);width:calc(100% - 90px);}
}
@media screen and (max-height:680px){
    #leftmainbox button.minbutton{margin:30px 0 0 0;}
}
@media screen and (max-height:590px){
    #leftmainbox button.minbutton{margin:30px 0 0 0;}
    #leftmainbox #linkbox{display:none;}
}
::-webkit-scrollbar{width:13px;height:13px;}
::-webkit-scrollbar-track{background-color:#dfdfdf;}
::-webkit-scrollbar-thumb{background-color:#5f5f5f;}
::-webkit-scrollbar-thumb:hover{background-color:#363636;}