@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";@import"https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap";.listHeader{text-align:center;margin:20px}.listHeader h1{font-size:60px;color:gray;font-weight:700}.listHeader p{font-size:20px;color:gray}.material-symbols-rounded{color:#929191;cursor:pointer;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 48}*{padding:0;margin:0}body{font-family:Roboto Mono,monospace}header{margin:10px;position:relative}nav{width:100px;position:absolute;border:2px solid black;border-radius:5px;left:25px;background-color:#f5f5f5}.menu{display:flex;flex-direction:column;gap:10px;list-style:none;padding:10px;font-size:18px;font-weight:700}.menu a{text-decoration:none;color:orange}.menu a:hover{color:#00f}.active{color:pink}.show{display:flex}.hide{display:none}.todoListContainer{width:40%;display:flex;flex-direction:column;margin:auto}.inputContainer{padding:0 20px;display:flex;align-items:center;border-radius:10px;box-shadow:5px 5px 8px 5px gray;margin:5px}.inputText{flex:1;border:none;padding:10px;background:transparent;outline:none}.listItems{display:flex;flex-direction:column;gap:3px}.todoItem{display:flex;align-items:center;background-color:#eae7e7fa;padding:0 20px}.completed{text-decoration:line-through;color:gray}button{border:none;background:transparent}.error-msg{color:red;margin:10px}.about{text-align:center;font-size:40px}
