@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap";.task-container{margin-top:1.5rem}.task-item{background:#eee;padding:1rem 1.5rem;margin-bottom:.5rem;display:flex;align-items:flex-start;justify-content:space-between}.task-item .delete-btn{color:var(--red);font-weight:700;font-size:1.4rem;padding:0}.task-item h3{font-weight:400;margin-bottom:.4rem}.task-item p{font-size:1.05rem}.green-border{border-left:6px solid var(--green)}.no-task{font-size:1.1rem}.form-control{margin-bottom:1.5rem}.form-control-checkbox{display:flex}label{font-size:1.1rem;display:block;margin-bottom:.5rem}.input-box{width:100%;height:40px;padding:1rem;font-size:1.1rem;outline:none}input[type=checkbox]{width:20px;height:20px;margin:0 0 .4rem 2rem}form button{background-color:var(--dark-blue);width:100%;margin:1rem 0}.modal{width:260px;height:140px;background-color:var(--white);border-radius:5px;box-shadow:0 0 5px var(--shadow);display:flex;justify-content:center;align-items:center;flex-direction:column;position:absolute;top:1rem}.modal .message{text-align:center}.modal .message p{font-size:1.1rem;margin-bottom:1rem}.message img{width:35px;height:35px}.modal .line{margin-top:.8rem;width:220px;overflow-x:hidden}.modal .line p{height:13px;background-color:var(--green);border-radius:5px;animation:slideOut 3s ease-out}@keyframes slideOut{0%{margin-right:0}to{margin-right:220px}}.modal-container{position:relative;display:flex;justify-content:center}#task-manager{display:flex;align-items:center;min-height:100vh}.container{border:2px solid var(--black);margin:1rem auto;width:500px;padding:2rem;border-radius:5px;box-shadow:0 0 5px var(--shadow)}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.3rem}h1{font-weight:400}button{font-size:1.1rem;padding:.7rem 1.3rem;border:none;border-radius:3px;color:var(--white)}.header button.dark-bg{background-color:var(--dark-blue)}.header button.red-bg{background-color:var(--red)}footer{margin-top:1.5rem;font-size:1.1rem;text-align:center}footer a{color:var(--dark-blue);text-decoration:none}@media (max-width: 500px){.container{width:95%;padding:1.5rem}}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,Arial,serif}:root{--black: #000;--white: #fff;--dark-blue: rgb(21, 55, 83);--red: rgb(218, 34, 34);--green: rgb(91, 212, 91);--shadow: rgba(0, 0, 0, .5)}