body{font-family:Teko;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;height:100%;padding:0;margin:0;scroll-behavior:smooth;font-size:2em;box-sizing:border-box;background:#833ab4;background:-webkit-linear-gradient(to top,#a18cd1 0%,#fbc2eb 100%);background:linear-gradient(to top,#a18cd1 0%,#fbc2eb 100%);color:#fff}html{scroll-behavior:smooth;box-sizing:border-box;height:100%}small{opacity:.4;margin-top:20px;display:block}h1{color:#fff;text-shadow:2px 2px 2px rgb(0,0,0,.6);text-align:center;margin-bottom:0;font-size:2em;line-height:1.3em;font-weight:700;margin-top:.67em}.todo-list{padding-top:10px;width:400px}.todo{background:#fff;box-shadow:1px 1px 1px #00000026;padding:3px 10px;font-size:.7em;margin-bottom:6px;border-radius:3px;display:flex;align-items:center;justify-content:space-between;color:#000}.todo-text{cursor:pointer}.todo-completed{text-decoration:line-through}button{border:0;outline:0;cursor:pointer;font-size:18px}.todo button{color:#f37070;background:transparent}input{background:#fff;box-shadow:1px 1px 1px #00000026;padding:7px 10px;font-size:.5em;border-top-left-radius:4px;border-bottom-left-radius:4px;color:#000;outline:0;border:0;flex:1}form{border-top:1px solid;display:flex;padding-top:10px;margin-top:10px}form button{color:#2980b9;background:#fff;border-top-right-radius:4px;border-bottom-right-radius:4px;border-left:1px solid #ccc;box-shadow:1px 1px 1px #00000026;padding:0 15px}
