.todo-list{width:65%;margin:0 auto;padding:20px;background-color:#f9f9f9;border-radius:8px;box-shadow:0 2px 10px #0000001a}.todo-header{width:65%;margin:0 auto 25px;padding:20px;background-color:silver;border-radius:8px;box-shadow:0 2px 10px #0000001a}.todo-list__title{text-align:center;font-weight:700}.todo-user-input,.todo-api-input{display:flex;flex-direction:row;align-items:flex-start;gap:10px;padding:10px}.todo-input__text,.todo-api-input__number{width:100%;padding:8px;border:1px solid #ccc;box-sizing:border-box;font-size:16px}.todo-user-input__button,.todo-api-input__button{background-color:#3498db;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;font-size:16px;width:45%;text-align:center}.todo-user-input__button:hover,.todo-api-input__button:hover{opacity:.9}.todo-user-input__error-message,.todo-api-input__error-message{display:flex;justify-content:center;color:red}.todo-list__completed{text-align:center;font-weight:700}.todo-list__delete-buttons{display:flex;justify-content:center;padding-top:10px}.todo-list__button{padding:10px;border:none;border-radius:4px;cursor:pointer;font-size:14px;margin-left:5px}.todo-list__button--delete-all{background-color:#e74c3c;color:#fff}.todo-list__button--delete-api{background-color:#3498db;color:#fff}.todo-list__button--delete-user{background-color:#2ecc71;color:#fff}.todo-list__button--delete-single{background-color:#e74c3c;color:#fff;float:right}.todo-list__button:hover{opacity:.9}.todo-list__items{display:flex;flex-direction:column}.todo-list__item{display:flex;align-items:center;justify-content:space-between;padding:10px;border-bottom:1px solid #ccc;gap:10px}.todo-list__item:last-child{border-bottom:none}.todo-list__text--completed#API{color:#999;text-decoration:line-through;text-decoration-color:red}.todo-list__text--completed#user{color:#838282;text-decoration:line-through;text-decoration-color:#e7e}#API{font-family:Arial,Helvetica,sans-serif;font-weight:700}#user{font-family:Lucida Console,Courier New,monospace;font-style:oblique}.modal{position:fixed;left:0;top:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center}.modal-content{width:500px;background-color:#fff}.modal-header,.modal-fotter{padding:10px}.modal-title{margin:0}.modal-button{border:none;border-radius:4px;cursor:pointer;font-size:14px;background-color:red;color:#fff;margin:10px;float:right}.modal-body{padding:10px;border-top:1px solid #eee;border-bottom:1px solid #eee}@media (max-width:961px){.todo-user-input,.todo-api-input,.todo-list__delete-buttons{flex-direction:column}.todo-list__button--delete-all,.todo-list__button--delete-api,.todo-list__button--delete-user{margin-bottom:25px}.todo-user-input__button,.todo-api-input__button{width:100%}}