*{margin:0;padding:0;box-sizing:border-box}.bdy{min-height:100vh;display:grid;grid-template-columns:200px calc(100% - 400px) 200px;grid-template-rows:80px calc(100vh - 100px) 20px;grid-template-areas:"topbar     topbar    topbar" "leftbar    board     rightbar" "bottombar  bottombar bottombar";background-color:#000}.topbar{grid-area:topbar;background:#000;border-bottom:2px solid grey}.leftbar{grid-area:leftbar;background:#000;box-shadow:0 0 10px #00000040;border-right:2px solid grey;position:relative;z-index:2}.rightbar{grid-area:rightbar;background:#000;box-shadow:0 0 10px #00000040;border-left:2px solid grey;position:relative;z-index:2}.board{grid-area:board;overflow-x:auto;overflow-y:auto;margin:5px;position:relative;z-index:1;scrollbar-width:none;-ms-overflow-style:none}.board::-webkit-scrollbar{display:none}.scroll-wrap{width:200vw;height:200vh;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABjCAYAAABt56XsAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAB+klEQVR4nO3cQYrCQBBA0eq2CfESnsETeP9zeAQ3atBkFpJhdtMtRL7Nf+uEovhIMDRJx+NxOZ/PUSOlFOM4xu12i2VZqu4ZhiEiIqZp2mxGRMThcIge9sjVV+ojDAJjEBiDwBgExiAwBoExCIxBYErOOfb7fdNN4zg2D9p6Ri97lHme436/V12cUophGGKapurXAaWUiIh4PB6bzYiI6GWPEvFapnbIen3LEGf4LutrGQTGIDAGgTEIjEFgDAJjEBiDwJSU0u9rgf+s/z5LKdX/Pv/es9WM9b4e9igppci57oeyDsk5Ny+y5Yz1vh72KPM8N581anlh9u55pndeLvawh88QGIPAGATGIDAGgTEIjEFgDAJjEBiDwHhQrpEH5Sr1socH5WAzfIbAGATGIDAGgTEIjEFgDAJjEBiDwBgEJp1Op+V6vVbfsNvt4vl8Vl+/HiyrfeXwzoyI10u/HvYol8uliw9/+QEzbcIgMAaBMQiMQWAMAmMQGIPAGATGIDAelGvkQblKvezhQTnYDJ8hMAaBMQiMQWAMAmMQGIPAGATGIDB+UQ62h1+Ug+3hF+Vge/gMgTEIjEFgDAJjEBiDwBgExiAwBoExCIwH5Rp5UK5SL3t4UA42w2cIjEFgDAJjEBiDwBgExiAwBoExCIxBYPyiXKVP7fED2Gs+3dZeV7gAAAAASUVORK5CYII=);background-repeat:repeat;background-position:top left}.bottombar{grid-area:bottombar;background:#8a2be2;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem}.mainleft{width:100%;height:100%;display:grid;grid-template-rows:1fr 1fr;grid-template-columns:100%;grid-template-areas:"shapes" "lines";place-items:center;overflow:none;overflow-y:scroll;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.mainleft ::-webkit-scrollbar{display:none}.shapes{grid-area:shapes;width:90%;height:300px;background-color:#000;color:#fff;margin-top:20px}.shapes .title{width:100%;height:30px;color:#000;border-bottom:2px solid grey;display:flex;justify-content:center;align-items:center;margin-bottom:10px}.shapes .title p{font-family:Arial,Helvetica,sans-serif;color:#fff;font-weight:bolder}.shapes .contents{width:100%;height:calc(100% - 30px);overflow:none;overflow-y:auto;scrollbar-width:10px;scroll-behavior:smooth}.lines{grid-area:lines;width:90%;height:300px;background-color:#000;margin-top:20px}.lines .title{width:100%;height:30px;color:#fff;border-bottom:2px solid grey;display:flex;justify-content:center;align-items:center}.lines .title p{font-family:Arial,Helvetica,sans-serif;font-weight:bolder}.lines .contents{width:100%;height:calc(100% - 30px);color:#fff;overflow:none;overflow-y:auto;scrollbar-width:10px;scroll-behavior:smooth}.lines button,.shapes button{width:50%;height:80px;background-color:#000;border:none}.lines button:hover,.shapes button:hover{border:5px solid grey}.shapes #rectangle,.shapes #roundedrect,.shapes #circle,.shapes #diamond,.shapes #heading,.shapes #paragraph,.lines #line,.lines #dashedline,.lines #dottedline,.lines #doubleline{background-color:transparent;background-size:contain;background-position:center;background-repeat:no-repeat;overflow:auto}.shapes #rectangle{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEkAAABJCAYAAABxcwvcAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAA8UlEQVR4nO3ZsXHDMBAAQcCjQsHKyE7pDjzLQBIl38Y/GPACBM85xjhH/vTz7gt8giKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigYcOrrWeeI3XO46DZ+fA39zneV46+M7WWmPOyfOXIl05+M6ufktvEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEuD17Rjft8JVvJnc9/3JV3mtbdt4liP9Z71JoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBIoEigSKBI4BfjFhit/IwptQAAAABJRU5ErkJggg==)}.shapes #roundedrect{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEkAAABJCAYAAABxcwvcAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACSklEQVR4nO3ZParqUBiF4c+LRUSxywTiBDQmhWBply6VY7CzCChYChYW9o7AKYiWgpU/pEhnly6FKIopAvvO4LJ2zjmaw10P7C5fsvOiqLEkIkron/58egO/ASMBGAnASABGAjASgJEAjARgJAAjARgJwEgARgIwEoCRAIwEYCQAIwEYCcBIAEYCMBKAkQCMBGAkQDnvYKPRkFarJbVa7Tv38+0ej4ecTie5XC65z1ESzb+5bduW6XQqzWZT9vu93O/33Bd/h3q9Lp1OR87ns0wmEzkej7nOo9DleZ7KskwNBgN4pihrMBioLMuU53l55rEDTdNUSZLkvUghlud5KkkSZZqm1hz8dpvNZmIYhgyHQ+TwwlosFpKmqYzHY605qGYURcq27Y+/Gr66bNtWURT9zCspyzIxDEOyLEMOL6xyuSxpmkq5jH+ww5GUUlIqlfLurVB074VfJgGMBGAkACMBGAnASABGAsCR4jgWy7J+ci9vYVmWxHGsNQNH2mw24vu+9qaKxvd92Ww22nPQ7xfHcdT1elWWZX3891feZVmWul6vynEc3Vn84CAIVBiGynXdj9+w7nJdV4VhqIIg0J7Venw7n8/ldrvJer2W7XYru93uVzyZ7Ha70uv1ZDQayXK51D6H9uNbEZFKpSL9fl/a7bZUq1Xti77T8/mUw+Egq9VKXq9XrnPkivS/4fckACMBGAnASABGAjASgJEAjARgJAAjARgJwEgARgIwEoCRAIwEYCQAIwEYCcBIAEYCMBKAkQCMBGAkwF8GmvcGM/u36AAAAABJRU5ErkJggg==)}.shapes #circle{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEkAAABJCAYAAABxcwvcAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADf0lEQVR4nO2ZzUsqURiHf0baBwUNBRKIbpyFIoy1kIwW4dIg8m8Q/4aWbtzMyo0g0q5ZuLMI2qdkRkIhDm7aSRBCMUHRh0bvXd3L5cK9vGP5ce99H/jtfM+c88zhML7HAYAg/JGJUU/gb0AkMRBJDEQSA5HEQCQxEEkMRBIDkcRAJDEQSQxEEgORxEAkMRBJDEQSA5HEQCQxEEkMRBIDkcRAJDGYHPYDp6am4PV64Xa74Xa7oSgK5ufnMTMzA6fTCQDo9Xp4eXnB4+MjLMtCp9NBp9NBu93G29vbsKcMBwZ876ZpGlZXV6FpGoLBIILBIFwuF9rtNm5vb3F3d4eHhwc8Pz+j1+sBAJxOJ2ZnZ7GwsIClpSUsLy/D6/Wi2+2i1Wqh1Wqh0Wjg8vISjUZjkNMHMABJc3Nz2NzcxMbGBtbX1+HxeHB+fo6LiwtcXV3BNE3c39/3Nfbi4iJCoRBWVlYQiUSwtraGm5sbnJ2d4fT0FCcnJ3h6evrK5QD4QkmqqmJnZwfb29uYnp7GwcEBjo+PB/6mNU3D1tYWEokEXl9fcXR0hMPDQ1xfX3/pc+gzCQQClE6nyTRNKhQKFIlEPjXeZxKJRKhQKJBpmpROpykQCHzV2P0XJ5NJqtfrlMvlyOPxjEzOr/F4PJTL5aher1MymRyNJL/fT9lslsrlMkWj0ZFL+V2i0ShVKhXKZrPk9/uHJ0lVVSoWi5TP50cugZt8Pk/FYpFUVR28JJ/PR/v7+6Tr+sgXbje6rpNhGOTz+WzX2vriTqVScDgc2N3dtVM2FnyfcyqV6queZTMWi1Gz2SRFUUa+K/qNoijUbDYpFosNZifF43GUSiVYlsUtGTssy0KpVEI8Hrddy7JZrVYpHA6PfDd8NuFwmKrVqq0a9hf3x8cHXC4X3t/fOT8fWyYnJ9HtdjExwT+OpVXCgC2pVqshFAoNci5DIRQKoVar2aqxJSmRSNie1LiRSCRsSwKYh9f//AnAlgSAMpkMGYYx8sX2G8MwKJPJ2K6zdXDv7e0BAHRdt1M2Fui6DiL6sQa72LIqf3CZ+d4qqVQqY98qKZfLw2+V/BxpujHzP7Rv5SKAgVwpMZDLSQYDl/Qrcs39jyKtEgYiiYFIYiCSGIgkBiKJgUhiIJIYiCQGIomBSGIgkhiIJAYiiYFIYiCSGIgkBiKJgUhiIJIYiCQG3wD7tEKKzuDjwwAAAABJRU5ErkJggg==)}.shapes #diamond{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEkAAABJCAYAAABxcwvcAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADAUlEQVR4nO3cMa6qQBSA4SMQg2wCQmPhElyCJsbOyo6OkmVo7wLsqDQxVlbEXpdgYgLBBZioyXnFCz7iu7l3hJk5g3f+5DQExsMXalsAgKD7NoN6gSakkRjSSAxpJIY0EkMaiSGNxJBGYkgjMaQUkud54Hke9RpfhiqM67p4Pp/xfD6j67rk+5THqufLJ9d1Yb/fw2KxAACA/X4P/X4fTqcT8Wb/UuILiqLoeS2KItW+KLWAFIVSD0hBKDqgMAx/vDcMQxWg5P6g7/vMQApByQXKsuwtoFco3/c/F6kOUBkqyzIKKHlAQRDUPisIAgqo5gARQokFStOUKxARlJiDu90upmmK0+lU2PJBEGCapjKgxADleS4UqJjpdCoDqrlAr1Ddbld9JAqgMlSe56Kg+AJNJhPpQBKgPgOomMlkIgLqc4AEQlV/uNfrYZZlSgEJgqoOdLlccDwek4N8B5VlGQ+ozwQqZjwe84B6HyjP80YAvUL1ej3xSAXQYDAgf/EqUJfLpSrU5wOVofI8rwL1O4CKGQwGVaB+vmk+n+PhcEDHcchfsu44joPH4xFnsxlfJMMwcLlcYpIkjYZyHAeTJMHlcomtVosv0idAlYEMw3j3efabmwpVE+g9pCZCcQB6H6lJUJyAqiEVUHEcY5IkaNs2OYhAoOpIAICmaWIcx7jb7ZSC4gxUD0lFKNu2MUkSjOOYF1B9JJWgbNvG3W6HcRyjaZo8z+ZzEDWUQCB+SJRQgoH4IhVQq9VKGpQEIP5IAICWZUmBkgQkBkkGlEQgcUgioQqg1WolA0gskgioMpBlWTKAxCPxhCICkoNUQG2328pQhEDykAAA2+12JShiILlIVaAUAJKP9A6UIkA0SCxQBdB2u6UGokN6hWq3218Cla//SqQCqgyiIBC2CinKbNuG9XoN9/sdTNOEx+MBw+GQeq1nSiAB/IXabDZwu91gNBrB7XajXumZMkgAAJ1OB67XK/Ua/6UUkqop9b8AqqaRGNJIDGkkhjQSQxqJIY3E0B8GlAi5gR+AzgAAAABJRU5ErkJggg==)}.shapes #heading{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEkAAABJCAYAAABxcwvcAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAE70lEQVR4nO3YQWibdRjH8d804l+I+g8UfAOt7oWKe8sGvrMDEya4yA7L2GEbO9gxL9WDxgnSzsO6RShhh5leZtaDy3bY6EQhu4xUUBoPG9mhI+9hoxE7msEOb2GTvGLgfcXA46GZ7WbaPU1bnPB84L3k7Zv3eb99+b8v2QSAIFb0zH89wP+BRGKQSAwSiUEiMUgkBonEIJEYJBKDRGKQSAwSiUEiMUgkBonEIJEYJBKDRGKQSAwSiUEiMUgkBonEIJEYJBKDRGKQSAwSiUEiMUgkBonE0D6StjH0fRmVUg4DvWqDR1Aw389hyqmgcCwGHdJIjBZRmZ5CZo+xwefmCbX/NAJzWwx2t4/oRjcCoA0L8TdtuDciG3+yDrSP9Dhtwu5VqN2uwguW7lDQvRa29yjUbjmoPQgePS5swNpqQj2oonrHw9K9qsuCvU3Dm60+ekzTQym9F9vTq5wlbMDa2gftzcD5ZR7BMod3iv61dSUoVyUiv0K5M0Wa84mIiPzqBA1uUQSA1OYkZUouLXKpeCxGOgSCMmlgvEL1pXsnM5QwQIAi60ieZvzF4yrX5sgnornxJOmQQQMXXSKqU+GISTCSlJslovtFyp4utJ1F96eoUFs811ypuPD9ToZius31rX5bIRIR1Z0Jyo7mqNgaYuZ0grQyaeCyS0Q+Vc4MUmLXIOUdn+iPMo28rUnvytLMX0RUzdNAv00DF+aIyKfyyRgpI9n67joVTybJ3j1ExVbrtpGWzjL9hFnGBynWn6RMqfXvcTJkh9ce6QlPtyomjg9hOD2M4VOT8ABEug1EXrOx9x0DaNZQmfWhu3w40zUgbCOxI4rg52H0PfcCIvvPw+sxEWl4CKBgmlG8+kYc8c0A7hRw9twknJ/OY+xSdeUxHs6SbjPLKxbiOwwgcFC4MIEbNyeR+7qAGuMbuVZekxoeaq4HIEC90VpTQsDzKgIdBhAysfezE4i3FoDqbQfzTYWXd46g8G0GyW4geFCD24zi4fqvIhpaAfDm4TYAIIB7z0UAa+VJl5slrBENA2j68BoLfxrcn4fX7KDGMp5wJ/lAm5P92ajD9QA0HGQPbUfftr7WFsfhcy7e+mAQye4Azlfvwezpw8Ezzj8LaVD3Fi5Aty4OCtGexYirn8VbiK0iiHYpAAqR1y2YvEcSS2cvk785KE3PA2EbBw/EYWxOYGTShX9vCiPvvgQVAgCF6JYEDn6cRfYTGwqA6org2btllO8C6D2M1EdJ2HsGMXRoyV202ov7vYLStRoQsjH4xTBSn2eQTyehO7qw9jqLFNRw5XgKY9cDxE5Owa1NIbMHKF8aw/nrv6L0zVlcuQsY+0aQS8dRPfUpxm4G0PvyKH75Ir7LXkatqZEcLaIynkD1agkeAITAuKMen2Uek+kPceJqDXrfCHKnDiD44QqqTbS98zq1hpVfkd5iU2KnRcbjT5GwQVZ/m89bmzIsivVbpNU6PKLDBln9NlldC68Exv48zRFR/ccUWevwdFtjpKdgC2mKjZbJb72LpY5mqHDLJyKXJo6YpNbnPE/Bha51UwYljuZpanqGZqbLVLyYpdTudQtEmx6WEsuTn0oYJBKDRGKQSAwSiUEiMUgkBonEIJEYJBKDRGKQSAwSiUEiMUgkBonEIJEYJBKDRGKQSAwSiUEiMUgkBonEIJEYJBKDRGL4Gw75X1f3rf6aAAAAAElFTkSuQmCC)}.shapes #paragraph{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABFCAYAAAAcjSspAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEr0lEQVR4nO2aUWhbVRjH/9MLO4UIpxDZLUxcxoa5pYylKizBPTSSh0b2sI492KIP5mnGCXNFkEYQCT6MVF8SH7YWH6QKk3bgiH2Q3j0U2ofJzWB4M6w0hQ4S7CAXLPYOgp8PaWe7fTdddaCM7wcXknu+c87//sL9LheyDwBB2MEz/3WA/yMihUGkMIgUBpHCIFIYRAqDSGEQKQwihUGkMIgUBpHCIFIYRAqDSGEQKQwihUGkMIgUBpHCIFIYRAqDSGEQKQwihUGkMIgUhqdeik4V4NTKyETVY8956qX8E4ygARUdQvZ0DzzfQnqwH9p3YV8Zx/j1KnwomCeGkBk+g2SfhnfHxvTlEr655W3O60a9FcdI3EPp/Rycg3wtoGAOZJG/kEbPPRuTl22okwl410qwjfRD64zCNpIYeWcI6RMW1L0q7G9LKM1WgSPBWbcwUzlMfZ6E2XJhfz2O0rUqvFawGOIOc7BI7u8btGxP0NiFi5S/6lJzbYHGTmhSfVkqL7k0dS5JVl+axmaWqbmYp7gG6VSR3GaTlucnaOzNOL34cnCt6svQ9NIylT9KUyyVpeL3DjWbDuUH9CPrmAfiNGYvk/PlMMWjMRr6bI7qq3OUPa46ZtWpQntscZoK5zOUvTRH9dUyZaKKve7Ngx/Qg0Vy1xzKv6bb58w0TVTrVD5nkTIUmVGLTLVN4NI0ZY6odog1l4qDZnteYK0m63yZlm8WKBneNra2JeWhdQDShyyKhNsXow4N09SSSxOnzY5ZD6QK5K45VBhoj6lolso1hwopHSgl8PYBAHh11O757c9+HQ0P6A1rIBzDyId5ZAZ6oVpN+EYPrNDCg5vRX6+hWvPaXwJr90P39ABNG/XNLbzVKurriQfb71hHmUi8lUNuOI6IApqtLkQOAjPGLll/Bfz1Oqpbm8DHbnRutEpBPdCmAAPYWP8T0bM5jJ70MH7awuGjvUh+MI3q+s6p/uYcK7D2PrDhA4bC1nNBhTS6FLcOoI+/h9y7Mbifvo5I5DD6By/ih8bGLll3F8DRWYruRfLVCBQAfSSBeLiJ6p0mup7vBhoOnBUPCFl442wSkdD2UH+H04G1Pmp3XPgv9KP/oAIME4nhM4hpPorq1tB+DYuVOnxDI3ZqBAmzCzC6OmSt4/4Tl+LVoU4VYFdcOLM59NzIozT/CypXJ2GHR2FXXLjzRcSrk5jxEshfKSAV3rFAx9r+n8cxPquR/c6BuziDDBxUGnyUxs0pTN62ULjhwq3YyB1dwOSPwNClCVw8tj8ga8Bij0Fwo91snupQjOJ9JiljW03IJOsVi8xQYAffvdbQFNnWhHWqQE5tjrJ9AU8GQ1PkeIyssNpb1j0enRvtJv5KBYsPn1xvoPrTY/4SAbUqOoLibA7d1wuYrHYj/fYQ1HwO9kpAL2h5qN2q7D3rHnkWwCfsiKFg+HexsHATjT/+5S4BtH67DXtxFaGXjuHoc03Mf/UxRr+4gbt77Y9POOs+yJ+LH0HefRhECoNIYRApDCKFQaQwiBQGkcIgUhhECoNIYRApDCKFQaQwiBQGkcIgUhhECoNIYRApDCKFQaQwiBQGkcIgUhhECoNIYfgLv43KLVJ4LDEAAAAASUVORK5CYII=)}.lines #line{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEIAAABBCAYAAABlwHJGAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABEElEQVR4nO3awRHEMAhDUWeLcjv0l9ZSBLkoFRiD8OrPcGXMO/saY/hQ41f9AJYEgQSBBIEEgQSBBIEEgQSBBIEEgQSBBIEEgQSBWkPMOYeZhe3zjjPn9Od53N3dzCJ21h+1gnDfd9Te+sMIEHpBbEToA7EZoQdEAgI/RBICN0QiAi9EMgInRAECH0QRAhdEIQIPRDECBwQBQj0ECUItBBFCHQQZQg0EIUI+BClCLgQxQh4EOUIORAOE/RBNEPZCNELYB9EMYQ9EQ4R4iKYIsRCNEeIgmiPEQByAsA5xCMI6hJmdgLAO8WEQHLI016fx77X+OhSZIJAgkCCQIJAgkCCQIJAgkCCQIJAgkCCQINALAnKHt36zxB4AAAAASUVORK5CYII=)}.lines #dashedline{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEIAAABBCAYAAABlwHJGAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABqUlEQVR4nO3asY3CMBjF8XdXpMwGWeNrKTJExBq0GYEd0tGwAhVLMAEdHSXNd807KVecTgj7s829v+TWTn4KNgp8AHAofJa+gFoSBBMEEwQTBBMEEwQTBBMEEwQTBBMEEwQTBBMEaxrCzDBNU7L5vMVhZn673dzdfbPZpJiz/E29gnA8HlPNW/7GKkBoC6Lve79erzkQ2oIA4OM4+uFwSD7vx7fGf6/649PMMM9zyFrFH/ffxnpj3G63udcrf8N/IWTYGNuAKIBQH0TXdX4+n6MR6oMA4MMw+H6/D11Txyer4vg0MyzLUvoyyn4M1hvjbrcreS11IARvjPVAVIZQDmJZlpoQykEAKL0n/Bihx2fXdXg8HlHLPVXY8WlmOJ1OGIYhasmny/7YrTfG6G+MT4w4hIo2xliIhhDyQszz3ApCXggAEW+Wkozkx2ff97jf7ymnDCnp8WlmuFwuGMcx5bRhJXm01htjjt8dAkZahEY2xvQQb4LwOsQ0Te+A8DoEgFT/Tyg69PKWVfHytoYEwQTBBMEEwQTBBMEEwQTBBMEEwQTBBMEEwb4A0GAp89zgyLsAAAAASUVORK5CYII=)}.lines #dottedline{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEIAAABBCAYAAABlwHJGAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACj0lEQVR4nO2ZMUsjURDHJ3cXCCFYbSASLLKQwJLGheURK4sUFuksLa0sRUiqFBcLP4CdFoJ1WsEPkCp1ioBCKiGQLQKJKyagf4ubE4870SO7O5HMDwZeNfPmN+/B5iVBRCCFvklvYFlQEYyKYFQEoyIYFcGoCEZFMCqCURGMimBUBKMiGBXBqAhGRTBfWgQAAsJ5V/oRSpaYcV2Xnp+fQ8+LrxTFYhGj0QjD4RC2bYeW98udiNvbW+p0OvT09ESDwSDU3OJT/kwYY3BwcBBlDfkmP4pcLofRaAQAqNVqkdT4TkQ/acm5v7+n+XxO0+mUTk5OIqsjPvH3whiDy8vLuOrJN/yvSKfT6PV6AIB6vb6aIjKZDIgIruvi7OxsNU+EMQY3NzeoVCpx15Zv/m2cn58DAC4uLlZTxPr6+uv68PBQYg/yEowx8H0fjUZDbA9L8euzXC6TZVnkeZ7oPsSmUCqVXtc7OzvSJ1Om8ObmJnzfx9XVlbQA2avx+PhIQRDQw8OD1Bb+Ilbznudha2sLRISNjQ3xk/Am4itm2zZ838dkMoHjONKN/xGxPswMBgO6vr6mVCpF/X4/ztKfInLbxhgcHR2JT/2DiLZANpuF7/sAgN3dXelm341IH2YSiQQFQUDj8ZhmsxkdHx9HVSoUIrsO7XYbyWRSfNqfjPCTplIpdLtdAECz2ZRuUEbE2toaiH59Pp+enko3JyPCGIO7uztUq1Xppv47Qv3E3tvbo3w+T/v7+2GmjY2Fbebz+dd1xH/CLO/V+P2o0mq1pBuRvRqFQoEsyyLHcRZNJc7CNre3t8UnumgkeLHyLMWb5TKgIhgVwagIRkUwKoJREYyKYFQEoyIYFcGoCEZFMCqCeQHXGoPGNpqTsgAAAABJRU5ErkJggg==)}.lines #doubleline{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALgAAAC4CAYAAABQMybHAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEHklEQVR4nO3Yy23jSgBEUc5kYKagvBWFYlAKWk0sfBt74PHzRx9SRRbPBS7QyyJwF83+NQzDNACl/E4PAJZE4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4KhG4PiHw+EwjOOYnjEbAsdfDofDcDqdhtPpVBX5RB4Oh+lyuUxvnM/naRzH+K4ZjA9g2I9xv3E8HuPbZjA+gEHL456GFQxgyB3EPQ0rGMCAt8Z9PB63eiePD+CTvSfuDf94xgfwid4b94ZfV+ID+CQfjXuapulyuUyHwyH+LTcYH8AnuNO4p2EFA7iwO457GlYwgAu687inYQUDuJDiHqZhBQO4gOL+a3wAZ1bc/xgfwBkV9/+MD+BMivtT4wM4g+L+0vgAPqi4vzU+gA8o7h+ND+Cdivsq4wN4h+K+2vgA3qi4bzI+gDco7puND+CVivsu4wN4heK+2/gA/qC4HzI+gN8o7oeND+AXinsW4wP4ieKezfgAflDcsxofwHeKe3bjA/iquBcxPoCDuBc0PmD3intR4wN2rbgXNz5gt4r7KcYH7FJxP834gN0p7qcaH7Arxf104wN2o7gjxgfsQnHHjA+oV9xR4wOqFXfc+IBaxb0K4wMqFfdqjA+oU9yrMj6gSnGvzviAGsW9SuMDKhT3ao0P2LziXrXxAZtW3Ks3PmCzinsTxgdsUnFvxviAzSnuTRkfsCnFvTnjAzajuDdpfMAmFPdmjQ9YveLetPEBq1bcmzc+YLWKu8L4gFUq7hrjA1anuKuMD1iV4q4zPmA1irvS+IBVKO5a4wPiirva+ICo4q43PiCmuHdhfEBEce/G+ICnK+5dGR/wVMW9O+MDnqa4d2l8wFMU926ND1hcce/a+IBFFffujQ9YTHFzWMGARRQ3X40PmF1x853xAbMqbn4wPmA2xc1PjA+YRXHzC+MDHlbc/Mb4gIcUN38wPuBuxc0rjA+4S3HzSuMDblbcvMH4gJsUN280PuAmx3GczuezuHmt8QE3+z5ycfMH4wPuchxHcfMa4wNmVdz8YHzAbIqbnxgfMIvi5hfGB8zix9cVcfPV+IDZfItc3Hzz1+uhhnEch5eXl+HPnz/pKVgBdYED7/mdHgAsicBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRjcBRzX9K+5yyO7GeTwAAAABJRU5ErkJggg==)}.bgcolordiv{display:grid;grid-template-columns:100%;grid-template-rows:auto 1fr;margin:20px;justify-items:center}.bgcolordiv .title{display:inline-block;padding-bottom:4px;color:#fff;border-bottom:5px solid grey;font-weight:700;font-family:Arial,Helvetica,sans-serif}.bgcolordiv .colors{display:grid;grid-template-columns:repeat(3,50px);grid-template-rows:repeat(3,50px);grid-template-areas:"whitec wheatc yellowc" "aquac greenyc greyc" "redc orangec violetc";margin-top:10px;justify-content:center;align-content:center;place-items:center}.bgcolordiv .colors button{width:40px;height:40px;border-radius:50%;border:none;cursor:pointer}.whitec{grid-area:whitec;background-color:#fff}.wheatc{grid-area:wheatc;background-color:wheat}.yellowc{grid-area:yellowc;background-color:#ff0}.aquac{grid-area:aquac;background-color:#0ff}.greenyc{grid-area:greenyc;background-color:#adff2f}.greyc{grid-area:greyc;background-color:gray}.redc{grid-area:redc;background-color:red}.orangec{grid-area:orangec;background-color:orange}.violetc{grid-area:violetc;background-color:violet}.textsize{margin-top:20px;display:grid;width:90%;max-width:600px;grid-template-columns:1fr 10px;grid-template-areas:"title title" "inp out";gap:1px;align-items:center}.textsize p{grid-area:title;margin-bottom:10px;color:#fff;font-family:Arial,sans-serif;font-weight:700;text-align:center}.textsize input[type=range]{grid-area:inp;width:calc(100% - 10px);margin:0 12px;height:8px;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none}.textsize input[type=range]::-webkit-slider-runnable-track{height:8px;background:violet;border-radius:4px}.textsize input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:24px;width:24px;background:#000;border:4px solid violet;border-radius:50%;margin-top:-8px;cursor:pointer;box-sizing:border-box}.textsize input[type=range]::-moz-range-track{height:8px;background:violet;border-radius:4px}.textsize input[type=range]::-moz-range-thumb{height:24px;width:24px;background:#000;border:4px solid violet;border-radius:50%;cursor:pointer;box-sizing:border-box}.textsize input[type=range]::-moz-focus-outer{border:0}.textsize input[type=range]::-ms-track{width:100%;height:8px;background:transparent;border-color:transparent;color:transparent}.textsize input[type=range]::-ms-fill-lower,.textsize input[type=range]::-ms-fill-upper{background:violet;border-radius:4px}.textsize input[type=range]::-ms-thumb{height:24px;width:24px;background:#000;border:4px solid violet;border-radius:50%;cursor:pointer;margin-top:0;box-sizing:border-box}.textsize output{grid-area:out;margin:0;color:#fff;font-family:Arial,sans-serif;padding-left:8px}.topbar{position:relative}.topbar h3{color:#fff;margin-left:5px;margin-top:5px;font-family:Arial,Helvetica,sans-serif}.topbar .operations{position:absolute;width:100%;height:40px;border-top:2px solid grey;bottom:0;display:flex;align-items:center}.topbar .operations button{width:70px;height:30px;background-color:#000;color:#fff;border:none}.topbar .operations button:hover{border:1px solid grey;border-radius:5px}.langselectarea{margin-top:20px;width:90%;display:grid;grid-template-columns:1fr;grid-template-rows:20px auto;grid-template-areas:"title" "buttons";place-items:center}.langselectarea .title{grid-area:title;font-weight:bolder;font-family:Arial,Helvetica,sans-serif;color:#fff}.langselectarea .buttons{grid-area:buttons;display:grid;place-items:center;width:90%;height:auto}.scrollbar{scrollbar-width:none;-ms-overflow-style:none}.scrollbar::-webkit-scrollbar{display:none}.langselect{margin-top:20px;width:170px;height:100px;margin-left:12px}.langselect .currlang{margin-bottom:10px;font-family:Arial,Helvetica,sans-serif}.langselect .selectlang{overflow-y:auto;height:100%;width:100%}.langselect button{width:100%;height:30px;color:#fff;background-color:transparent;border:none;border-bottom:1px solid white}.langselect .currlang p{color:#fff;font-size:x-small}
