*{margin:0;padding:0;box-sizing:border-box;font-family:Urbanist,sans-serif}html{font-size:62.5%}h1,h2,h3,h4,h5,h6{color:#fff;font-weight:900}h1{font-size:3.2rem;font-weight:700}:root{--primary-color: #1c2833;--secondary-color: #fff;--bg-color: #f2f3f4}.todo-container{display:flex;align-items:center;flex-direction:column;min-height:100vh;padding-top:3%;background-image:linear-gradient(100deg,#001214,#001f29);color:#fff;transition:.3s linear;overflow:hidden}.header,.form,.datetime{margin:0 1rem;min-height:10vh;width:100%}.header{display:flex;align-items:center;flex-direction:column;justify-content:space-around;font-size:3rem;min-height:25vh;width:100%}ul{list-style:none}section h1{color:#fff;font-size:4.8rem;text-align:center}.date-time{font-size:2.4rem;text-align:center}form{display:flex;font-size:1.7rem;justify-content:center;margin:15px 0;padding:.8rem;width:100%}form input{padding:10px;font-size:1.8rem;letter-spacing:.1rem;border:none;outline:none;border-top-left-radius:17px;border-bottom-left-radius:17px;max-width:500px;transition:background-color .2s ease-in-out;width:100%;background-color:#f2f3f4;color:var(--primary-color)}form input:hover{cursor:text}form input::placeholder{color:#fff;opacity:.7}button{border:none;outline:none;transition:box-shadow .2s ease,background-color .2s ease-in-out;background-color:#2c3e50;color:#000}form button:hover{cursor:pointer;background-color:#f1c40f}form button{padding:10.8px;font-size:17px;border-top-right-radius:15px;border-bottom-right-radius:15px;min-width:100px;background-color:#5dade2;color:var(--secondary-color)}span{margin-right:3.2rem}.myUnOrdList{display:flex;justify-content:center;align-items:center;max-width:1200px}.todo-list{min-width:25%;list-style:none}.todo-item{margin:2.4rem;font-size:25px;color:#1c2833;border-radius:30px;transition:background-color .2s ease-in-out;background-color:#f2f3f4;min-width:35rem;max-width:40rem;padding:1.5rem 3rem;display:grid;grid-template-columns:1fr .3fr .3fr;justify-content:start;gap:1.6rem;overflow-wrap:anywhere}li span{max-width:20rem;color:#1c2833}.check-btn,.delete-btn{font-size:3rem;cursor:pointer;width:3rem;height:3rem;border-radius:80%;margin:0 5px;background-color:#fff;color:#000;box-shadow:#959da533 0 8px 24px}.check-btn{color:#fff;background-color:#2ecc71}.delete-btn{color:#fff;background-color:#e74c3c}.checkList{text-decoration:line-through}.notCheckList{text-decoration:none}.clear-btn{background-color:#e74c3c;font-size:1.6rem;padding:1rem 2.2rem;border-radius:.3rem;-webkit-border-radius:.3rem;-moz-border-radius:.3rem;-ms-border-radius:.3rem;-o-border-radius:.3rem}.clear-btn:hover{background-color:#8d1407;cursor:pointer}