.todo{display:inline-block;position:relative;padding:0;margin:0;height:40px;width:50%;pointer-events:none}.todo button{position:absolute;margin-top:10px;margin-left:13px;border-radius:3px;width:22px;min-width:0;height:22px;opacity:.5;border:1px solid #0000;pointer-events:all}.todo button:hover{background:#ffffffe6}.todo.checked button:hover{background:#999}.todo__state{position:absolute;top:0;left:0;opacity:0}.todo__text{color:#000!important;transition:all .8s,2 linear .8s,2;margin-left:45px;margin-top:10px}.todo__icon{position:absolute;top:0;bottom:0;left:0;width:100%;height:auto;margin:auto auto auto 5px;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:.8s * .2}.todo__check{stroke:#27fdc7;stroke-dasharray:9.8995,9.8995;stroke-dashoffset:9.8995;transition-duration:.8s * .4}.todo__line{stroke-dasharray:168,1684;stroke-dashoffset:168}.todo__circle{animation-delay:.8s * .7;animation-duration:.8s * .7}.checked .todo__text{transition-delay:0s;color:initial!important;opacity:.6}.checked .todo__icon .todo__box{stroke-dashoffset:56.1053;transition-delay:0s}.checked .todo__icon .todo__line{stroke-dashoffset:-8}.checked .todo__icon .todo__check{stroke-dashoffset:0;transition-delay:.8s * .6}.checked .todo__icon .todo__circle{animation-name:explode}