*{padding:0;margin:0;box-sizing:border-box}body{background-color:#f0efef}.toDoContainer{width:22rem;border-radius:.5rem;padding:1.5rem;margin:5rem auto;background-color:#fff;box-shadow:2px 4px 4px #0000001a;text-align:center}.toDoContainer h2{margin:2rem auto;color:#1d8fe1;font-size:clamp(1.5rem,4vw,2rem);font-family:Arial,Helvetica,sans-serif}.toDoContainer input{padding:.4rem 1rem;font-size:1rem;border-radius:.5rem}.toDoContainer .inputs button{padding:.6rem 1.5rem;margin-top:1.25rem;margin-bottom:1.25rem;background:#07b;font-weight:650;color:wheat;border-radius:.5rem;cursor:pointer;border:none}@media(max-width:48rem){.inputs button{font-size:1.1rem;padding:.7rem 2rem}}@media(max-width:480px){.inputs button{font-size:1.2rem;padding:.8rem;width:80%}}.toDoContainer .inputs button:hover{transition:.3s ease-in;opacity:.7}.toDoContainer ul li{display:flex;justify-content:space-between;align-items:center;padding:.4rem 1.25rem;background:#fff;margin:1.5rem 0;box-shadow:0 4px 6px -1px rgba(0,0,0,0.05),0 2px 4px -1px rgba(0,0,0,0.05);border:1px solid #f0f0f0}.toDoContainer ul li{display:flex;justify-content:space-between;align-items:center;padding:.4rem 1.25rem;font-size:1rem;background:#f4f7f9;border-left:4px solid #0087cc}@media(max-width:480px){li{padding:.6rem 1.3rem;font-size:1.2rem}}.toDoContainer ul li span{margin-top:.5rem}.toDoContainer ul li button{cursor:pointer;height:20px;margin-top:.5rem}.toDoContainer ul li input{margin-top:.5rem}.done{text-decoration:line-through;opacity:.6}.deltebtn{font-size:1.5rem;color:#0087cc;cursor:pointer;margin-top:.2rem;padding-top:.2rem}.deltebtn:hover{color:#ff4500;transition:.3s ease-in;opacity:.5}.task-tracker-footer-text{margin-top:2.5rem;font-family:Arial,Helvetica,sans-serif}
