*{margin:0%;padding:0%}h1,h2,h3,h4,h5{font-weight:unset;font-size:unset}strong{font-weight:unset}em{font-style:normal}a{color:unset;text-decoration:unset}@font-face{font-family:satoshi;src:url(/font/controler/Satoshi-Bold.woff2)}:root{--background-color: #282828;--text-color: white;--color: blue}input[type=range]{height:auto;-webkit-appearance:none;margin:0;width:100%;border:none!important;background-color:var(--background-color);padding:6px;box-sizing:border-box;cursor:pointer}input[type=range]:hover{background-color:var(--background-color)}input[type=range]:focus{outline:none}progress{border-radius:0}input[type=range]::-webkit-slider-runnable-track{width:100%!important;height:1px!important;cursor:pointer!important;animate:.2s!important;background:var(--text-color)!important;border-radius:0!important}input[type=range]::-webkit-slider-thumb{height:10px!important;width:10px!important;border-radius:0%!important;background:var(--text-color)!important;border:1px solid var(--text-color);cursor:pointer;-webkit-appearance:none;margin-top:0;transform:translateY(-45%);box-shadow:none!important}input[type=range]:focus::-webkit-slider-runnable-track{background:var(--text-color)}input[type=range]::-moz-range-track{width:100%!important;height:1px!important;cursor:pointer!important;animate:.2s!important;background:var(--text-color)!important;border-radius:0!important}input[type=range]::-moz-range-thumb{height:10px!important;width:10px!important;border-radius:0%!important;background:var(--text-color)!important;border:1px solid var(--text-color);box-shadow:none!important;cursor:pointer}input[type=range]::-moz-range-progress{width:100%!important;height:1px!important;cursor:pointer!important;animate:.2s!important;background:var(--text-color)!important;border-radius:0!important}input[type=range]::-ms-track{width:100%!important;height:1px!important;cursor:pointer!important;animate:.2s!important;background:var(--text-color)!important;border-radius:0!important;border-color:transparent;color:transparent}input[type=range]::-ms-fill-lower{background:var(--text-color);border:0px solid var(--text-color);border-radius:0%;box-shadow:0 0 0 var(--text-color)}input[type=range]::-ms-fill-upper{background:var(--text-color);border:0px solid var(--text-color);border-radius:0%;box-shadow:0 0 0 var(--text-color)}input[type=range]::-ms-thumb{margin-top:0;box-shadow:0 0 0 var(--text-color);border:1px solid var(--text-color);box-shadow:none!important;height:10px!important;width:10px!important;border-radius:0%;background:var(--text-color);cursor:pointer}input[type=range]:focus::-ms-fill-lower{background:var(--text-color)}input[type=range]:focus::-ms-fill-upper{background:var(--text-color)}body{width:100vw;height:100vh;overflow:hidden;background-color:#4e4e4e;font-family:satoshi;color:#fff;box-sizing:border-box}#main_container{width:100%;height:100%;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;box-sizing:border-box}#drag2{position:absolute;right:0;left:unset}.drag{position:sticky;z-index:1000;top:0;left:0;padding:8px 12px 6px 13px;border:1px solid white;background-color:var(--background-color);border-radius:0;cursor:grab;text-align:center;width:fit-content;font-size:clamp(1rem,1.2vw,3rem)}.drag img{width:20px;height:auto;filter:invert(1)}.drag:hover{background-color:var(--text-color)}.drag:hover img{filter:invert(.25)}#mobile{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;width:fit-content;height:fit-content;background-color:gray;box-shadow:0 0 20px #141414;display:none;flex-direction:column;align-items:center;justify-content:center;border-radius:10px;max-width:30vw;min-width:250px;padding:clamp(40px,10%,80px)}#mobile h1{display:flex;flex-direction:row;color:var(--background-color);font-size:clamp(1.5rem,2.7vw,3rem);margin-bottom:clamp(20px,3%,40px);transition:.3s order}#mobile h1 span{transition:.3s order}#mobile p{text-align:center}@media screen and (max-width: 900px){#mobile{display:flex!important}#mobile p{color:var(--background-color)!important}#controler_container,#display_container{display:none!important}}@media screen and (max-width: 1300px){.row_container{display:flex;flex-direction:column!important;justify-content:flex-start!important;align-items:flex-start!important;width:100%;height:fit-content}.row_container p{margin:5px 0}#color_container .controler:first-of-type{margin-bottom:clamp(20px,3%,40px)}}#controler_container{width:25vw;min-width:250px;height:94%;box-sizing:border-box;margin:clamp(20px,3%,40px);display:flex;flex-direction:column;justify-content:flex-start;align-items:center;position:relative}#controlers_container{position:absolute;width:100%;height:fit-content;max-height:100%;overflow-y:auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:clamp(20px,8%,90px);box-sizing:border-box;background-color:var(--background-color);border-radius:0;box-shadow:0 0 20px #141414}#controlers_container h1{font-weight:400;font-size:clamp(.9rem,1.5vw,3rem);margin-bottom:clamp(20px,3%,40px);display:flex;flex-direction:row;justify-content:flex-start;align-items:center;cursor:default}#controlers_container h1 span{transition:.3s order}#controlers_container h2,#controlers_container select{font-weight:400;font-family:satoshi;font-size:clamp(.8rem,.7vw,3rem)}#controlers_container .row_container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;height:fit-content}#controlers_container .row_container .controler{margin-top:0%;width:fit-content}#controlers_container #color_container{margin-top:clamp(20px,3%,40px)}#controlers_container .up_do_font{position:relative;padding:15px;border-radius:0;border:1px solid white;cursor:pointer;width:fit-content}#controlers_container .up_do_font:hover{background-color:var(--text-color);color:var(--background-color)}.controler{margin-top:clamp(20px,3%,40px);position:relative;width:100%;height:fit-content;box-sizing:border-box}.controler input[type=file]{border:0%;font-size:0px;opacity:0;position:absolute;left:0%;width:100%;height:100%;transform:translateY(-15px);cursor:pointer}.controler input[type=range],.controler input[type=text]{width:100%}.controler textarea{padding:10px;border-radius:0;background-color:transparent;border:1px solid white;outline:none;color:#fff;box-sizing:border-box;resize:vertical;width:100%}.controler input[type=color]{border:1px solid white;background-color:transparent;padding:0%;border-radius:0%;outline:none;width:130px;height:40px;cursor:pointer}.controler input[type=color]::-webkit-color-swatch-wrapper{padding:0}.controler select{width:100%;padding:15px;background-color:var(--background-color);color:#fff;border:1px solid white;border-radius:0!important;outline:none;cursor:pointer}.controler select:hover{background-color:var(--text-color);color:var(--background-color)}.controler select .options{cursor:pointer;background-color:var(--background-color)!important;color:var(--text-color);border-radius:none!important}.controler select #disabled{color:rgba(var(--background-color),.5)!important;background-color:var(--background-color)!important}#download_container{margin-top:clamp(20px,3%,40px)}#download_container h2{padding:15px;border:1px solid white;cursor:pointer}#download_container h2:hover{background-color:var(--text-color);color:var(--background-color)}#display_container{width:75vw;height:92%;box-sizing:border-box;margin:clamp(20px,3%,40px);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative}#display_container #resize{position:absolute;width:100%;height:100%;box-sizing:border-box;resize:both;overflow-y:hidden;overflow-x:hidden;border-radius:0;box-shadow:0 0 20px #141414;background-color:var(--background-color)!important;color:#a1a1a1}#display_container #resize canvas{position:absolute;top:0%}