body{background-color:#1a1a1a}.to-do-list{font-family:Arial,Helvetica,sans-serif;text-align:center;margin-top:100px}h1{font-size:4rem;color:#fff}button{--color: #560bad;font-family:inherit;display:inline-block;width:8em;height:2.6em;line-height:2.5em;margin:20px;position:relative;cursor:pointer;overflow:hidden;border:2px solid var(--color);transition:color .5s;z-index:1;font-size:17px;border-radius:6px;font-weight:500;color:var(--color)}button:before{content:"";position:absolute;z-index:-1;background:var(--color);height:150px;width:200px;border-radius:50%}button:hover{color:#fff}button:before{top:100%;left:100%;transition:all .7s}button:hover:before{top:-30px;left:-30px}button:active:before{background:#3a0ca3;transition:background 0s}.delete-button{--color: #c1121f}.delete-button:active:before{background:#780000;transition:background 0s}.move-button{--color: #ffb703}.move-button:active:before{background:#fb8500;transition:background 0s}input[type=text]{padding:11px 10px;font-size:.75rem;border:2px #560bad solid;border-radius:5px;background:#e8e8e8}ol{padding:0;display:flex;flex-direction:column;align-items:center;gap:15px}li{display:flex;align-items:center;justify-content:center;flex-direction:row;text-align:center;border:solid 1px black;width:50rem;border-radius:10px;color:#000;cursor:pointer;transition:.4s}.card{background-color:#fff}.cards .card p.tip{font-size:1em;font-weight:700}.card:hover{transform:scale(1.1)}