*{box-sizing:border-box;font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif;margin:0;padding:0}.todo-app{border-radius:10px;display:flex;flex-direction:column;justify-content:start;margin:128px auto;max-width:520px;min-height:600px;padding-bottom:32px;position:relative;text-align:center;width:100%;z-index:2}h1{color:#fff;font-size:24px;margin-bottom:32px}.complete{opacity:.4;text-decoration:line-through}.todo-wrapper{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:hsla(0,0%,100%,.25);border:4px solid hsla(0,0%,100%,.18);border-radius:20px;margin:0 10px;padding:20px 30px;z-index:1}.todo-form{margin-bottom:32px}.todo-input{background:transparent;border:2px solid #684a9e;border-radius:4px 0 0 4px;color:#fff;max-width:320px;outline:none;padding:14px 32px 14px 16px;width:100%}.todo-input::-webkit-input-placeholder{color:#fff}.todo-input::placeholder{color:#fff}.todo-button{background:linear-gradient(90deg,#674a9f,#bb4555);border:none;border-radius:0 4px 4px 0;color:#fff;cursor:pointer;outline:none;padding:16px;text-transform:capitalize}.todo-input.edit{border:2px solid #ba4555}.todo-button.edit{background:linear-gradient(90deg,#bb4555,#674a9f);padding:16px 22px}.todo-container{display:flex;flex-direction:row;position:relative}.todo-row{align-items:center;background:linear-gradient(90deg,#fab3fb,#72399a);border-radius:5px;color:#fff;display:flex;justify-content:space-between;margin:4px auto;max-width:406px;overflow:hidden;padding:16px;width:100%}.todo-row div{max-width:310px;overflow:hidden}.todo-row:nth-child(4n+1){background:linear-gradient(90deg,#f3008d,#08005b)}.todo-row:nth-child(4n+2){background:linear-gradient(90deg,#0063d3,#360052)}.todo-row:nth-child(4n+3){background:linear-gradient(90deg,#feea85,#f4058c)}.icons{align-items:center;cursor:pointer;display:flex;font-size:24px}.delete-icon{color:#fff;margin-right:5px}.edit-icon{color:#fff}.vanta-bg{height:100vh;left:0;opacity:.8;position:fixed;top:0;width:100vw;z-index:-1}@media screen and (max-width:496px){.todo-input{width:70%}}@media screen and (max-width:375px){.todo-input{width:50%}h1{font-size:20px}}
/*# sourceMappingURL=main.5cd180b9.css.map*/