*{box-sizing:border-box;margin:0;padding:0}body{background:#f5f5f5;color:#202124;font-family:Just Another Hand,cursive}.header{background:#202124;color:#fff;justify-content:space-between;padding:10px 30px;position:fixed;top:0;z-index:999}.header,.wrapper{display:flex;width:100%}.wrapper{margin-bottom:50px;margin-top:60px}.note-input{padding:10px 30px;width:40%}h2{font-family:Just Another Hand,cursive;font-size:36px;text-align:center}.note-input .max{font-family:Just Me Again Down Here,cursive;font-size:16px;text-align:end}.note-input .text,.note-input .title{background:whitesmok;border:2px solid #202124;border-radius:10px;color:#202124;display:block;font-family:Just Me Again Down Here,cursive;font-size:16px;margin-bottom:25px;padding:8px 5px;width:100%}.note-input .text{min-height:80px}.note-input button{background-color:#202124;border:2px solid transparent;border-radius:10px;color:#f5f5f5;font-family:Just Another Hand,cursive;font-size:20px;height:30px;width:100%}.note-input button:hover{background:#f5f5f5;border:2px solid #202124;color:#202124;cursor:pointer}.wrap{padding:10px 30px;width:60%}.note-search input{background:whitesmok;border:2px solid #202124;border-radius:10px;color:#202124;display:block;font-family:Just Me Again Down Here,cursive;font-size:16px;padding:8px 5px;width:300px}.aktif{margin-bottom:25px}.cl{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr;grid-template-rows:minmax(-webkit-min-content,-webkit-max-content);grid-template-rows:minmax(min-content,max-content);margin-top:20px}.item{border:2px dotted #202124;border-radius:10px;padding:10px 10px 45px;position:relative}.pin{position:absolute;right:10px;top:10px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.item h3{font-size:24px}.btn{bottom:10px;position:absolute}.delete{border:2px dotted #b00020;border-radius:50%;color:#b00020;height:30px;margin-right:10px;width:30px}.delete:hover{border:2px dotted #ff5f52;color:#ff5f52;cursor:pointer}.archive,.unarchive{border:2px dotted #c49000;border-radius:50%;color:#c49000;height:30px;width:30px}.archive:hover,.unarchive:hover{border:2px dotted #fff263;color:#fff263;cursor:pointer}.kosong{text-align:center}@media screen and (max-width:1000px){.cl{grid-template-columns:1fr 1fr}}@media screen and (max-width:800px){.wrapper{display:block}.note-input{width:60%}.note-input,.wrap{margin:auto;min-width:400px}.wrap{width:70%}}@media screen and (max-width:500px){.cl{grid-template-columns:1fr}.note-input{min-width:350px}.wrap{min-width:300px}.note-search input{width:200px}}
/*# sourceMappingURL=main.fbb0a30a.css.map*/