*{padding:0;margin:0;box-sizing:inherit}html{font-size:62.5%}body{font-family:"Franklin Gothic Medium","Arial Narrow",Arial,sans-serif;box-sizing:border-box;background-color:#777}.main-container{position:relative;height:100vh;width:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.viewer{display:flex;width:100%;height:100%;overflow:hidden}.container{display:flex;justify-content:center;align-items:center;width:100%;transition:transform .2s}canvas{display:flex;transform:scale(0.2);transition:transform .2s;-ms-interpolation-mode:bicubic;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;image-rendering:pixelated}.coordinates_display{position:fixed;top:5%;left:50%;transform:translate(-50%, -50%);padding:.5rem;background-color:#fff;border-radius:2rem;width:10%;text-align:center;box-shadow:5px 10px 5px 1px #777}.coordinates_display p{font-size:2rem;font-weight:bold}.open_color_selector{position:fixed;top:80%;padding:1rem;font-size:1.5rem;background-color:#fff;border:none;border-radius:2rem;box-shadow:5px 10px 5px 1px #777;cursor:pointer}.close_color_selector_btn{background-color:#fff;box-shadow:5px 10px 5px 1px #777;border:none;border-radius:2rem;padding:1rem;width:7%;font-size:2.5rem;font-weight:bold;cursor:pointer}.color_selector_container{position:fixed;top:110%;height:30%;background-color:#fff;width:100%;transition:top .4s ease;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.color_selector_box{display:flex;justify-content:center;column-gap:1rem}.color_selector_box div{box-shadow:5px 10px 5px 5px #777}#image_download_button{position:fixed;top:80%;left:20%;padding:1rem;font-size:1.5rem;background-color:#fff;border-radius:2rem;border:none;box-shadow:5px 10px 5px 1px #777;cursor:pointer}