*{margin:0;padding:0}body{font-family:Arial,Helvetica,sans-serif;overflow:hidden}.hearder--container{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-color:#d8e0e3;border-radius:0;border-style:none none solid;border-width:0px 0px 1px}.logo--img{width:50px}.herader--name{color:#000;font-size:20px;max-width:100px}.ProM{color:#c4bcdc}.header-list--container{display:flex;gap:20px}.todo--container{display:flex;flex-direction:row;align-items:center;gap:30px;overflow-x:auto;scrollbar-gutter:stable;height:calc(100vh - 68px);padding-left:30px;padding-right:30px}.todo--list{background-color:#a5cfce;width:300px;max-width:300px;min-width:300px;padding:2px;border-radius:5px;position:relative}.todo--list-header{background-color:#c4bcdc;padding:5px 15px;display:flex;align-items:center;justify-content:space-between}.todo--list-name{font-size:22px;max-inline-size:230px;overflow-x:hidden}.remove{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:20px;border:3px solid rgba(255,0,0,.664);cursor:pointer;font-size:22px;font-weight:900;transition-delay:50ms}.remove:hover{background-color:#ff0000a9}.todo--list-content{background-color:#e8f1f5;display:flex;flex-direction:column;gap:20px;padding:20px 10px;border-radius:0 0 5px 5px;height:60vh;overflow-y:auto;scrollbar-gutter:stable both-edges;overflow-x:hidden}.todo{background-color:#a5cfce;padding:15px;border-radius:7px;font-size:18px;cursor:pointer}.todo:hover{color:#375c5c;text-decoration:line-through}.add--btn{background-color:#c4bcdc;width:60px;height:60px;font-size:50px;display:flex;align-items:center;justify-content:center;position:fixed;z-index:100;right:30px;bottom:30px;border-radius:50px;cursor:pointer;border:none;transition-delay:20ms}.add--btn:hover{box-shadow:0 0 10px #a897dd}.todo--name-inp{background-color:#c4bcdc;position:fixed;z-index:100;right:100px;bottom:30px;height:60px;width:440px;border-radius:50px;border:none;outline:none;font-size:20px;padding-left:20px;padding-right:20px}.todo--name-inp:hover{box-shadow:0 0 5px #a897dd}.todo--name-inp:focus{box-shadow:0 0 5px #a897dd}.add-todo--container{position:absolute;right:15px;bottom:15px}.add-todo--btn{background-color:#e8f1f5;width:35px;height:35px;font-size:25px;border-radius:50px;cursor:pointer;border:2px solid #528646;font-weight:500;transition-delay:50ms}.add-todo--btn:hover{background-color:#528646}.todo--inp{background-color:#e8f1f5;width:210px;font-size:16px;border-radius:50px;border:2px solid #528646;font-weight:500;padding-left:10px;outline:none}.add-todo--form{display:flex;gap:10px}.removed{display:none}.b1{width:20vw;position:absolute;right:50px;top:100px;z-index:-10}.b2{width:27vw;position:absolute;left:60px;top:300px;z-index:-10}.b3{width:17vw;position:absolute;left:900px;top:550px;z-index:-10}.b4{width:32vw;position:absolute;left:500px;top:20px;z-index:-10}.b5{width:25vw;position:absolute;left:450px;top:450px;z-index:-10}.b6{width:25vw;position:absolute;left:50px;top:30px;z-index:-10}.b7{width:25vw;position:absolute;right:-20px;bottom:50px;z-index:-10}.bs1{width:5vw;position:absolute;right:410px;top:550px;z-index:-10}.bs2{width:3vw;position:absolute;right:1000px;top:120px;z-index:-10}.bs3{width:3vw;position:absolute;right:40px;top:600px;z-index:-10}.bs4{width:10vw;position:absolute;right:500px;top:300px;z-index:-10}.bimg{-moz-user-select:none;-webkit-user-select:none;user-select:none;pointer-events:none}.dnd--div{display:flex;flex-direction:row;justify-content:center;align-items:center}