.row{display:flex;justify-content:end;margin-top:auto}.mags{color:#fff}.row button{height:40px;background-color:var( --task-coloe-2 );text-align:center;width:120px;color:#fff;letter-spacing:1px;font-weight:700;border-radius:15px;cursor:pointer;padding:0 10px;border:none}@media screen and (max-width: 600px){.row{display:flex;justify-content:center;margin-top:auto}.row button{width:100%;height:60px;font-size:25px}}.Header{text-align:center;text-transform:uppercase;letter-spacing:normal;font-weight:600;color:var(--top-header-color)}#new-task{display:flex;justify-content:space-between;margin:20px 0}#new-task-input{width:100%;height:40px;border:1px solid var(--button-color-2);outline:none;border-radius:15px;margin-right:10px;padding-left:10px;font-size:1.2rem}.submit{background-color:var(--button-color-2);text-align:center;width:120px;color:#fff;letter-spacing:1px;font-weight:700;border-radius:15px;cursor:pointer;padding:0 10px;border:none}@media screen and (max-width: 600px){#new-task-input{width:100%;height:40px;border:1px solid var(--button-color-2);outline:none;border-radius:15px;margin-right:10px;padding-left:5px;font-size:1.2rem}}li{list-style:none;margin:1px 0;display:flex;color:#fff;padding:10px;align-items:center;text-transform:capitalize;background-color:var(--task-color-3)}.li{list-style:none;margin:1px 0;display:flex;justify-content:space-between;color:#fff;padding:10px;align-items:center;text-transform:capitalize;background-color:var(--task-color-3)}#editInput{height:26px;width:100%;outline:none;border:none;background:transparent;font-weight:500;font-size:16px;text-transform:capitalize;margin-right:10px;color:var(--button-color-1)}li .active{opacity:.5;text-decoration:line-through}li .delete{background-color:#fff;border-color:var(--button-color-4);color:var(--button-color-4);letter-spacing:0;margin-left:auto}li button{border:1px solid;border-radius:25px;background-color:#fff;letter-spacing:2px;cursor:pointer;padding:5px 10px;width:60px}.onEdit{border-color:var(--button-color-2);color:var(--button-color-2);margin-left:auto}.onSave{color:var(--button-color-3);border-color:var(--button-color-3);margin-left:auto}.checkbox{margin-right:10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:15px;width:15px;outline:1px solid var(--button-color-2);outline-offset:3px;border-radius:50%;background-color:var(--button-color-2)}.checkbox:checked{opacity:.5;text-decoration:line-through}.checkboxOnEdit{margin-right:10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:15px;width:15px;outline:1px solid var(--button-color-1);outline-offset:3px;border-radius:50%;background-color:var(--button-color-1)}.checkboxOnEdit:checked{margin-right:10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:15px;width:15px;outline:1px solid var(--button-color-1);outline-offset:3px;border-radius:50%;background-color:var(--button-color-1)}.tasks-list{max-height:350px;overflow:auto;border-radius:20px}.tasks-list::-webkit-scrollbar{display:none}@media screen and (max-width: 600px){.tasks-list{max-height:480px;overflow:auto;margin-bottom:20px;border-radius:20px}}@keyframes react-loading-skeleton{to{transform:translate(100%)}}.react-loading-skeleton{--base-color: #ebebeb;--highlight-color: #f5f5f5;--animation-duration: 1.5s;--animation-direction: normal;--pseudo-element-display: block;background-color:var(--base-color);width:100%;border-radius:.25rem;display:inline-flex;line-height:1;position:relative;-webkit-user-select:none;user-select:none;overflow:hidden;z-index:1}.react-loading-skeleton:after{content:" ";display:var(--pseudo-element-display);position:absolute;top:0;left:0;right:0;height:100%;background-repeat:no-repeat;background-image:linear-gradient(90deg,var(--base-color),var(--highlight-color),var(--base-color));transform:translate(-100%);animation-name:react-loading-skeleton;animation-direction:var(--animation-direction);animation-duration:var(--animation-duration);animation-timing-function:ease-in-out;animation-iteration-count:infinite}@media (prefers-reduced-motion){.react-loading-skeleton{--pseudo-element-display: none}}.login-Container{display:flex;justify-content:space-between;flex-direction:column;padding:10px 20px;margin-bottom:25px}.Login{display:flex;flex-direction:column;justify-content:space-between}.Login-header{color:#fff;text-align:center;padding:50px;margin-top:30px;font-size:50px;cursor:default}.Login-header:hover{color:var(--button-color-2)}.inputGroup{position:relative}.input{width:100%;height:70px;margin:20px 1;color:#fff;border:none;outline:none;background-color:transparent;border-bottom:2px solid #555;margin-right:1rem;margin-bottom:10px;font-size:30px}.input:placeholder-shown~.label{top:20px;cursor:text;font-size:30px;color:transparent;visibility:hidden}.label{color:#fff;position:absolute;display:block;top:0;transition:.3s}.sign{border:none;border-radius:15px;font-size:25px;font-weight:500;background-color:var( --button-color-2);color:#fff;letter-spacing:2px;cursor:pointer;height:60px;margin:30px 0 20px}.sign:disabled{background-color:#444}.linkp{margin-top:10px;color:#fff}.linkp a{color:var(--task-coloe-2);text-decoration:none}@media screen and (max-width: 600px){.Login{display:flex;flex-direction:column;justify-content:space-between;margin-top:50px}}.erroeMsg{color:red;text-align:center}.signup:disabled{background-color:#444}.signup-header{color:#fff;text-align:center;padding:20px;font-size:50px;cursor:default}.signup-header:hover{color:var(--button-color-2)}.signup{border:none;border-radius:15px;font-size:25px;font-weight:500;background-color:var( --button-color-2);color:#fff;letter-spacing:2px;cursor:pointer;height:60px;margin-top:30px}.signup-Container{display:flex;justify-content:space-between;flex-direction:column;padding:0 20px}.already{margin:5px 0;color:#fff}@media screen and (max-width: 600px){.Signup{margin-top:50px}}:root{--bg-color-1: #121212;--bg-color-2: #333333;--container-bg-1: #2B2B32;--container-bg-2: #444444;--task-color-1: #5C38BF;--task-coloe-2: #6845d8;--task-color-3: #444444;--button-color-1: #FF339D;--button-color-2: #ff9901;--button-color-3: #8cad65;--button-color-4: red;--search-button: #343b3d;--top-header-color: #ffffff}*{margin:0;padding:0;box-sizing:border-box;font-weight:500;font-family:fira sana,sans-serif}body{background-color:var(--container-bg-1)}.App{background-color:var(--bg-color-1);width:100%;max-width:500px;min-height:550px;margin:50px auto;border:1px solid black;border-radius:5%;box-shadow:0 2px 40px #555;padding:10px;overflow:hidden}.container{min-height:530px;display:flex;flex-direction:column}.container:last-child{margin-top:auto}@media screen and (max-width: 600px){.App{height:100vh;margin:0;padding:20px;border-radius:0}.container{display:flex;min-height:800px;flex-direction:column;margin-top:30px}}