*{margin:0;padding:0;font-family:Roboto,sans-serif}canvas{border-radius:10px;background-color:#fff;box-shadow:5px 5px 10px;width:1300px;height:600px}.container{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#e7e4e4}.navBar{width:100%;height:85px;display:flex;align-items:center;justify-content:space-between;background-color:#545454;margin-bottom:25px}.navBar img{margin-left:40px;font-style:italic;width:200px;height:80px;font-family:Verdana,Geneva,Tahoma,sans-serif;color:#f5f5f5}.inpCont{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:10px;margin-right:50px}select{padding:7px;width:75px;font-size:14px;border:1px solid #ccc;border-radius:5px;background-color:#fff;color:#333;cursor:pointer;box-shadow:0 2px 5px #0000001a;transition:border-color .3s,box-shadow .3s}select:focus{border-color:#333;box-shadow:0 2px 8px #0003;outline:none}button{background-color:#333;color:#fff;border:none;padding:10px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:5px}button svg{fill:#fff;width:24px;height:24px}button:hover{background-color:#555}.btns{gap:50px;margin-bottom:20px;width:250px;height:70px;background:#545454;display:flex;align-items:center;justify-content:center;border-radius:50px}.color-picker{display:flex;flex-direction:column;align-items:center}.color-picker label{font-family:Arial,sans-serif;font-size:10px;margin-bottom:5px;color:#d5d4d4}.fontColr,.bgColr{border:none;border-radius:5px;width:30px;height:30px;padding:0;cursor:pointer;outline:none;transition:box-shadow .2s ease}.mainBox{width:100vw;height:90vh;display:flex;justify-content:center;align-items:center;padding-bottom:50px}.oprBtns{position:fixed;top:200px;left:-100px;width:90px;height:300px;background-color:#6c6a6a;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;transition:.6s;border-radius:0 10px 20px 0}.oprBtns.visible{left:0}.shapes{background-color:#fff;color:#000;display:flex;align-items:center;justify-content:center}.io{position:fixed;top:189px;left:0;width:30px;height:30px;border:none;border-radius:50%;transition:.5s}.io.visible{left:75px}.shape{background-color:#5a5a5a}footer{width:100%;height:150px;font-size:23px;font-style:italic;background-color:#1a1a1a;color:#f5f5f5;display:flex;flex-direction:column;align-items:center;justify-content:center}footer p{font-size:20px}.linkCont{position:fixed;right:30px;bottom:5px;display:flex;flex-direction:column-reverse}.link1,.link2,.link3{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:#6c6a6a;cursor:pointer;margin:5px}.link1 a,.link2 a,.link3 a{font-size:30px;color:#fff}.link1:hover{background:#5865f2}.link2:hover{background:#833ab4;background:linear-gradient(to right,#833ab4,#fd1d1d,#fcb045)}.link3:hover{background:#242424}@media only screen and (min-width:300px) and (max-width:1000px){canvas{width:350px;height:600px}.navBar img{margin-left:10px;width:130px;height:60px}.inpCont{margin-right:25px}.linkCont{position:absolute;display:flex;flex-direction:row-reverse;align-items:center;justify-content:center;width:100%;right:50%;left:50%;transform:translate(-50%,-50%);bottom:-130px}.mainBox{margin-top:-60px;display:flex;align-items:center;justify-content:center}.oprBtns{top:223px}.io{top:210px}}.loader{width:100%;height:100%;position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;z-index:1}