@import"https://fonts.googleapis.com/css?family=Poppins:100,100italic,200,200italic,300,300italic,regular,italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic";*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}html{scroll-behavior:smooth}body{background:#93BFCF;color:#123}.title{text-align:center;padding:.5em 0;font-size:2.5rem;font-weight:700;color:#123}.input-form{padding:2em;display:flex;flex-direction:column}.input-form .form-group{display:flex;flex-direction:column;background:indianred;padding:1rem;border-top-left-radius:5px;border-top-right-radius:5px}.input-form .form-group label{text-align:center;margin-bottom:1em}.input-form .form-group .form-control{border:none;padding:.8em;border-radius:5px}.input-form .form-group .form-control:focus{outline:none}.input-form .form-submit{text-align:center;background:indianred;padding:0 1em 1em;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.input-form .form-submit button{padding:.8em;border:2px solid transparent;background:#123;color:#cd5c5c;border-radius:5px;cursor:pointer}.input-form .form-submit button:hover{background:indianred;color:#123;border:2px solid #123;transition:all .5s cubic-bezier(.175,.885,.32,1.275)}.noteList{padding:2em}.noteList .item-wrapper{display:flex;flex-wrap:wrap;justify-content:center;gap:.5em}.noteList .item-wrapper .empty{padding:1rem 0 0;font-size:1.5rem}.noteList .item-wrapper .item{flex:1 1 400px;padding:1em;background:cornsilk;border-radius:5px}.noteList .item-wrapper .item p{margin:1em 0}.noteList .item-wrapper .item .actions{display:flex;gap:.5em}.noteList .item-wrapper .item .actions button{padding:.3em;border:2px solid transparent;background:#123;color:#fff8dc;border-radius:5px;cursor:pointer}.noteList .item-wrapper .item .actions button:hover{background:cornsilk;color:#123;border:2px solid #123;transition:all .5s cubic-bezier(.175,.885,.32,1.275)}.completeList{padding:2em}.completeList .complete-wrapper{display:flex;flex-wrap:wrap;justify-content:center;gap:.5em}.completeList .complete-wrapper .empty{padding:1rem 0 0;font-size:1.5rem}.completeList .complete-wrapper .item{flex:1 1 400px;padding:1em;background:cadetblue;border-radius:5px}.completeList .complete-wrapper .item p{margin:1em 0}.completeList .complete-wrapper .item .actions{display:flex;gap:.5em}.completeList .complete-wrapper .item .actions button{padding:.3em;border:2px solid transparent;background:#123;color:#5f9ea0;border-radius:5px;cursor:pointer}.completeList .complete-wrapper .item .actions button:hover{background:cadetblue;color:#123;border:2px solid #123;transition:all .5s cubic-bezier(.175,.885,.32,1.275)}
