:root{--black: #131211;--primary: #e8f354;--lato: "Lato", sans-serif;--martian: "Martian Mono", monospace;--shadow: 0 2px 2px rgb(0 0 0 /.5)}*{padding:0;margin:0;box-sizing:border-box}body{font-family:var(--lato);background-color:#202124;color:#fff}.notes-judul{font-family:var(--martian);margin-top:40px;font-weight:lighter;text-align:center}.notes-judul span{font-size:2rem;text-transform:uppercase;animation:blink 2s linear infinite;color:#fff}@keyframes blink{0%{opacity:0}50%{opacity:.5}to{opacity:1}}.search_section{background-color:var(--primary);display:flex;flex-direction:column;align-items:center;padding:16px;border:2px solid rgb(255,251,251);border-radius:10px}.search_section h2{color:var(--black)}.search_section form input{margin-top:10px;padding:10px;border-radius:5px}.search_section form button{background-color:var(--black);color:#fff;padding:10px;margin-left:10px;border:0;border-radius:5px;cursor:pointer;font-family:var(--martian)}.search_section form button:hover{background-color:#fff;color:var(--black)}.input_section{width:50rem;margin:20px 20%;padding:16px;background-color:var(--black);display:flex;flex-direction:column;border:2px solid rgb(255,251,251);border-radius:10px}.input_section h2{text-align:center;color:#fff}.input_section form .input-item{background-color:#dcf35b;border:1px solid #eee;padding:2rem;margin:20px 0}.input_section form .input-item label{color:#000;font-weight:700;padding:20px}.input_section form .input-item input{display:block;width:100%;padding:8px;border-radius:5px}.input-item input,.input-item textarea{display:block;width:100%}.input_section form button{background-color:var(--primary);font-family:var(--lato);font-size:20px;color:#fff;border:0;border-radius:5px;width:50%;padding:8px;cursor:pointer;margin-left:25%}.input_section form button:before{content:"";position:absolute;top:0;right:0;width:0%;height:100%;background:#eee896;transition:.3s linear;z-index:-1}.input_section form button:hover:before{width:100%;left:0}.input_section form button:hover{background:white;color:var(--black)}.result{background-color:var(--primary);padding:20px;margin-top:10px}.judul-note{color:var(--black);padding:20px;text-shadow:var(--shadow)}.pesan-notfind{color:var(--black);padding:20px;margin-bottom:20px;text-align:center;font-size:1.3rem;animation:float 3s linear infinite}@keyframes float{0%,to{transform:translateY(0)}25%{transform:translate(1.3rem)}50%{transform:translateY(1.3rem)}75%{transform:translate(1.3rem)}}.notes-main{background-color:var(--black);margin:16px 0 0;border:2px solid rgb(255,251,251);padding:16px;border-radius:10px}.notes-main .notes_list{padding:16px}.note_item{background-color:#dcf35b;color:var(--black);display:flex;flex-direction:column;align-items:center;margin:24px 0;border:1px dashed black;padding:16px;border-radius:8px}.note_item .note-judul{padding:4px 0}.note_item .note-pesan{padding-top:20px;font-weight:lighter}.note_item .note-icon{display:flex;flex-direction:row}.btn-delete{width:40px;height:40px;background:url(/assets/trash-6bace489.svg);background-size:contain;margin-left:16px;margin-top:20px;border:0;cursor:pointer}.btn-delete:hover{background:url(/assets/trash2-05eb2b94.svg);background-size:contain}.btn-arsip{width:40px;height:40px;background:url(/assets/undo-bcae3c77.svg);background-size:contain;margin-left:16px;margin-top:20px;border:0;cursor:pointer}.btn-arsip:hover{background:url(/assets/undo2-b6b93fcb.svg);background-size:contain}@media only screen and (max-width: 1024px){.input_section{width:35rem;margin:20px 25%}}@media only screen and (max-width: 820px){.input_section{width:35rem;margin:20px 10%}}@media only screen and (max-width: 600px){.input_section{width:30rem;margin:10% 0}}@media only screen and (max-width: 400px){.input_section{width:20rem;margin-left:0}.search_section{background-color:var(--primary);border-radius:0;width:25rem}.result{width:25rem}}
