@import"https://fonts.googleapis.com/css2?family=Indie+Flower&family=Lato&family=Roboto:wght@300&family=Shadows+Into+Light&display=swap";*{margin:0;padding:0}body{background-color:#e5e5ff;overflow-x:hidden}html{font-size:16px}@media screen and (min-width: 375px){html{font-size:17px}}@media screen and (min-width: 425px){html{font-size:18px}}@media screen and (min-width: 768px){html{font-size:22px}}@media screen and (min-width: 1024px){html{font-size:24px}}@media screen and (min-width: 1440px){html{font-size:28px}}@media screen and (min-width: 2560px){html{font-size:42px}}.navbar{position:fixed;width:100%;z-index:10;display:flex;justify-content:space-between;align-items:center;background-color:#7f7fff;padding:1.3rem;color:#fff}.navbar__title{font-family:Roboto,sans-serif;font-size:1.5rem}.navbar__reset{background-color:#fff;color:gray;font-family:Roboto,sans-serif;border:none;padding:.5rem 1rem;cursor:pointer;border-radius:.8rem;font-size:.9rem;margin-right:2.5rem}.navbar__reset:hover{box-shadow:0 4px 8px #0003;color:#7f7fff}.main{padding-top:5rem}.add{position:relative;display:flex;align-items:center;padding:1rem}.add__input{font-size:.9rem;flex-grow:1;border:2px solid #B2B2FF;border-radius:.8rem;padding:.5rem 2.5rem .5rem .5rem;background-color:#fff;outline:transparent;font-family:Roboto,sans-serif}@media screen and (min-width: 375px){.add__input{font-size:.8rem}}.add__button{position:absolute;right:1.6rem;background:none;border:none;cursor:pointer;display:flex;align-items:center;top:50%;transform:translateY(-50%)}.add__button--icon{width:1.2rem;height:1.2rem;color:#b2b2ff}.add__button:hover{opacity:.8}.item{display:flex;align-items:center;justify-content:space-between;border:2px solid #B2B2FF;padding:.5rem;margin-bottom:.5rem;border-radius:.8rem;width:100%;flex-grow:1;margin-left:1rem;margin-right:1rem;background-color:#fff;font-family:Roboto,sans-serif}.item__checkbox{margin-right:.5rem}.item__text{flex-grow:1;font-size:.9rem;color:gray}.item__text--completed{text-decoration:line-through}@media screen and (min-width: 375px){.item__text{font-size:.8rem}}.item__delete{background:none;border:none;cursor:pointer;margin-left:.5rem}.item__delete--icon{width:1.2rem;height:1.2rem;color:#b2b2ff}.item__delete:hover{opacity:.8}.list{display:flex;justify-content:center;flex-wrap:wrap}.list__empty-message{text-align:center;color:#000;font-size:.8rem;font-family:Roboto,sans-serif;width:85%}