.draggy.ui-hidden{display:none}.draggy .controls{float:right}.draggy .controls button{width:auto;height:auto;padding:0;margin:0;background:0 0;border:none}.draggy .controls .ui-dragger{cursor:move}.draggy .controls .ui-closer,.draggy .controls .ui-hider{cursor:pointer}@font-face{font-family:VT323;src:url(../assets/fonts/VT323-Regular-subset.woff2) format('woff2'),url(../assets/fonts/VT323-Regular-subset.zopfli.woff) format('woff'),url(../assets/fonts/VT323-Regular-subset.ttf) format('truetype');font-display:swap}@font-face{font-family:'8bit Art Sans';src:url(../assets/fonts/8bit-Art-Sans-subset.woff2) format('woff2'),url(../assets/fonts/8bit-Art-Sans-subset.zopfli.woff) format('woff'),url(../assets/fonts/8bit-Art-Sans-subset.ttf) format('truetype');font-display:swap}body{background:#fff;padding:0;margin:0;font-family:VT323,monospace;font-size:16px;color:#000}a{color:#00f}h2{font-size:1.5em;margin:.1em 0}canvas{cursor:crosshair;touch-action:none;display:block;image-rendering:optimizeSpeed;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:-o-crisp-edges;image-rendering:pixelated;-ms-interpolation-mode:nearest-neighbor}.draggy{padding:10px;box-shadow:6px 6px 0 #000;border:4px solid #000;background:#eff;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden}.ui-dragger img{width:25px}.ui-hider img{width:20px;margin:3px 6px 0 0}.tabs{list-style:none;margin:0;padding:0}.tabs button{font-family:VT323,monospace;font-size:1em;display:inline-block;padding:.5em 1em;margin:0 0 .5em;border:1px solid #000;background-color:#ccc;box-shadow:2px 2px 0 #000}.tabs button.active{background-color:#0ff;box-shadow:inset 3px 3px 0 #000}.tabs:hover{cursor:pointer}header{font-size:1em;width:200px}header h1{font-family:'8bit Art Sans';font-size:2.5em;line-height:1em;margin:0}#minimized-tools-list{list-style:none;font-size:1.2em;margin-top:10px;padding:0}#minimized-tools-list button{display:inline-block;padding:3px 10px;background:#0f0;margin:3px;border:none;font-family:VT323,monospace;font-size:1em}#minimized-tools-list li button:hover{color:green;cursor:pointer}#minimized-tools-list li button:after{content:' +'}#what{width:200px}#toolbox{width:145px}#toolbox .inner{margin:1em 0}#toolbox ul{list-style:none;margin:0;padding:0}#toolbox ul li{display:inline-block;margin:.2em}.icon-button{border:3px dashed transparent;padding:0;margin:0;background:0}.icon-button img{padding:.3em;vertical-align:middle;max-height:35px}.icon-button.current-tool{border-color:#000}.text-button{background:#efefef;border:2px solid #ccc;padding:.3em .5em;margin:.2em;font-family:monospace;font-size:.8em;font-weight:700}input[type=submit]{margin:.2em 0 .2em 0;font-size:.8em}input[type=file]{max-width:100%}#pixel-size{width:75%;font-size:1.2em;font-family:monospace;padding:5px 3px 3px}#pixel-size-slider{margin:0;width:100%}#pixel-size-demo{background:#000}#filebox{width:175px}#filebox input{display:block}#filebox label{display:block;margin:1em .5em}.instructions{display:none}#colorbox{width:225px}.colors,.colors li{list-style:none;margin:0;padding:0}.colors{margin:.5em 0}.button{display:block;float:left;border:2px solid rgba(255,255,255,.5)}.button.save{float:none;width:75px}.button:hover{background:#ddd}.button.color{background:#fff;border:5px solid transparent;width:25px;height:25px;padding:0;margin:3px}.button.color.cyan{background:#0ff}.button.color.magenta{background:#ff00ff}.button.color.yellow{background:#ff0}.button.color.black{background:#000}.button.color.gray{background:gray}.button.color.white{background:#fff;border:2px solid rgba(0,0,0,.25)}.button.color.transparent{border-color:#ccc;background:url(../assets/bg.png)}.button.color.current,.button.current,.button.custom.current{border:5px solid #333}.button.brush.current{margin:1px 8px 1px 0}#eight-bit-colors{margin:0 auto;background:0 0}#eight-bit-picker{position:relative}#eight-bit-picker .color-demo{background:#000;width:100%;height:20px;margin-top:10px}#eight-bit-picker p{font-size:1.5em;margin:0 0 10px}#hex-color{width:48%;vertical-align:middle;margin-left:5px;font-size:1.5em;font-family:monospace;padding:5px 3px 3px}.pound{vertical-align:middle;font-size:2em}#color-dropper{padding:5px;vertical-align:middle}.modal{text-align:center;width:100%;height:100%;background:rgba(0,0,0,.8);position:absolute;top:0;left:0;z-index:999999}.inside-modal{text-align:center;width:auto;max-width:50%;display:inline-block;padding:20px;margin:20px;box-shadow:5px 5px 0 #000;border:1px solid #000;background:#eff;position:relative}.inside-modal h2{font-size:2em;margin:.25em 1em}.inside-modal .ui-hider{position:absolute;top:10px;right:10px;background:0 0;border:0;padding:0;margin:0}.inside-modal .ui-hider img{padding:0;margin:0}.inside-modal .ui-hider:hover{cursor:pointer}.gallery{margin:0;padding:0}.gallery li{list-style-type:none;display:inline-block;margin:10px;border:5px solid #000;position:relative}.gallery button{background:0 0;border:0;padding:0}.gallery li img{height:50px}.gallery button.delete{position:absolute;top:-10px;right:-10px}.gallery li .delete img{height:10px;padding:5px;background-color:#fff;border:2px solid #000}#finished-art{max-width:95%;display:block;border:5px solid #000;margin:10px auto;background:url(../assets/bg.png)}#pxon-modal-container textarea{width:100%;min-width:500px;min-height:200px}@media only screen and (min-device-width:320px) and (max-device-width:568px){body{font-size:2em}input{font-size:.6em}header{width:600px}#toolbox{width:300px}#toolbox input{font-size:.8em}#colorbox{width:200px}#colorbox p{margin:0}img.ui-dragger,img.ui-hider{width:70px}#save-selection{display:none}h2{margin:.5em 0}}.hidden{display:none!important}.clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}* html .clearfix{height:1%}