body{background-color:#17181f;color:#ddd}*{box-sizing:border-box}main{margin:20px auto;max-width:300px}form{border:3px solid #30313d;border-radius:10px;display:flex;padding:5px}form input[type=text]{background:none;border:0;color:#fff;display:block;outline:none;padding:0 8px;width:100%}form input[type=text]:focus{background:#25273576}form button{background-color:#61dafb;border:0;border-radius:6px;cursor:pointer}div.task{align-items:center;background-color:#30313d;border-radius:10px;display:flex;margin-top:5px;padding:5px 9px;transition:opacity .3s linear}div.task svg{fill:#61dafb;height:20px;margin-right:6px}div.task.done{opacity:.3}div.task form,div.task-name{flex-grow:1}div.task span{position:relative}div.task span:before{background-color:#ddd;content:"";display:block;height:1px;position:absolute;top:10px;transition:width .1s linear;width:0}div.task.done span:before{width:100%}h1,h2{text-align:center}div.checkbox{align-items:center;display:flex}button.trash{background:none;border:none;cursor:pointer;display:flex}button.trash svg{fill:#888;height:14px}div.task input{border:2px solid #555;border-radius:5px;padding:2px 4px}
/*# sourceMappingURL=main.e85effe1.css.map*/