body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}h1{text-align:center;font-size:24px}.container{width:90%;max-width:1200px}.todo-box{background:#fff;font-size:20px;max-width:15em;margin:auto;padding:.5em 1em;box-shadow:0 5px 30px rgba(0,0,0,.2)}.todo-box label{position:relative;display:flex;padding:0 0 0 40px;margin:10px 0}.todo-box label button{margin-left:10px;border:none;background:none;font-size:20px;transform:rotate(45deg)}.todo-box label button:hover{font-weight:700}.todo-box label button:focus{outline:none}.delimeter{display:block;width:95%;height:1px;background-color:#ccc;margin:5px auto}.delimeter:last-child{margin:20px auto;width:100%}.flex{display:flex}.create-task{width:100%;align-items:center;font-size:24px}.create-task-btn{padding:10px}.create-task input{flex-grow:1}.notice{font-size:.7em;text-align:center}.notice.error{color:red}.notice.success{color:green}input{border:3px solid transparent;border-top-left-radius:5px;border-bottom-left-radius:5px;border-image:linear-gradient(90deg,#3ec2da,#27fdc7);-webkit-border-image:-webkit-linear-gradient(90deg,#3ec2da,#27fdc7);border-image-slice:1}input[type=select],input[type=text]{padding:10px}input:focus{outline:none;box-shadow:0 0 6px 0 rgba(0,0,0,.0392156862745098),0 4px 10px 0 rgba(13,35,67,.25098039215686274)}.todo{display:block;position:relative;padding:1em 1em 1em 16%;margin:0 auto;cursor:pointer;border-bottom:1px solid #ddd}.todo:last-child{border-bottom:none}.todo__state{position:absolute;top:0;left:0;opacity:0}.todo__text{color:#135156;transition:all .4s linear .4s;flex:auto}.todo__icon{position:absolute;top:.3em;bottom:0;left:0;width:92%;height:auto;margin:auto;fill:none;stroke:#27fdc7;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.todo__box,.todo__check,.todo__line{transition:stroke-dashoffset .8s cubic-bezier(.9,0,.5,1)}.todo__circle{stroke:#27fdc7;stroke-dasharray:1 6;stroke-width:0;transform-origin:13.5px 12.5px;transform:scale(.4) rotate(0deg);animation:.8s linear none}@keyframes explode{30%{stroke-width:3;stroke-opacity:1;transform:scale(.8) rotate(40deg)}to{stroke-width:0;stroke-opacity:0;transform:scale(1.1) rotate(60deg)}}.todo__box{stroke-dasharray:56.1053,56.1053;stroke-dashoffset:0;transition-delay:.16s}.todo__check{stroke:#27fdc7;stroke-dasharray:9.8995,9.8995;stroke-dashoffset:9.8995;transition-duration:.32s}.todo__line{stroke-dasharray:168,1684;stroke-dashoffset:168}.todo__circle{animation-delay:.56s;animation-duration:.56s}.todo__state:checked~.todo__text{transition-delay:0s;color:#5ebec1;opacity:.6}.todo__state:checked~.todo__icon .todo__box{stroke-dashoffset:56.1053;transition-delay:0s}.todo__state:checked~.todo__icon .todo__line{stroke-dashoffset:-8}.todo__state:checked~.todo__icon .todo__check{stroke-dashoffset:0;transition-delay:.48s}.todo__state:checked~.todo__icon .todo__circle{animation-name:explode}html{background:#ddd;height:100%;display:flex}body{width:100%;margin:auto}
/*# sourceMappingURL=main.580f4f35.chunk.css.map */