@import"https://fonts.googleapis.com/css2?family=Parkinsans:wght@300..800&display=swap";*{font-family:Parkinsans,serif;margin:0;padding:0}body{background-color:#023;padding:0 10px}.main-app{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1}.main-footer{margin:25px auto auto;width:100%;background-color:#06f;text-align:center;padding:10px 0;border:none;border-radius:5px;font-weight:500}@media (max-width: 500px){.main-footer{font-size:14px}}.main-navbar{display:flex;justify-content:center;align-items:center;gap:200px;background-color:#06f;padding:10px;border:none;border-radius:5px;margin:10px auto auto}.logo{display:flex;justify-content:center;align-items:center;gap:5px;width:110px}.logo img{width:40px}.logo div{font-size:20px;font-weight:500}.logo a{transition:all .5s ease}.logo a:hover{transform:scale(1.05)}.links{display:flex;justify-content:center;align-items:center;gap:50px}a{color:#000;text-decoration:none}.active{background-color:#96dcff;border:none;border-radius:10px;padding:5px 10px}@media (max-width: 500px){.main-navbar{justify-content:space-between;gap:0px}.logo{width:auto}.logo img{width:32px}.logo div{font-size:18px}.links{gap:12px}.links a{font-size:14px}}.main-home{margin-top:25px}.top{width:60vw;margin:auto;display:flex;justify-content:space-between;align-items:center}#title{width:640px;height:30px;font-size:18px;padding:5px 5px 5px 10px;border:none;border-radius:6px;outline:none;background-color:#4a93ff}input::placeholder{color:#023}.create-btn{width:150px;height:40px;font-size:18px;padding:5px;border:none;border-radius:6px;background-color:#4a93ff;cursor:pointer;transition:all .3s ease}.create-btn:hover{background-color:#96dcff}.create-btn-2{display:none}.bottom{width:60vw;margin:10px auto auto;display:flex;align-items:stretch;justify-content:center;padding:0;border-radius:6px;background-color:#4a93ff}#content{width:100%;min-height:60vh;background-color:#4a93ff;font-size:18px;padding:10px;resize:none;outline:none;border:none;border-radius:6px}textarea{box-sizing:border-box}textarea::placeholder{color:#023}@media (max-width: 500px){.top{width:80%}#title{width:100%;height:auto;font-size:15px;padding:8px}.create-btn{display:none}.create-btn-2{display:block;margin:8px auto auto;width:80%;font-size:15px;padding:8px;border:none;border-radius:6px;background-color:#4a93ff;cursor:pointer;transition:all .3s ease}.create-btn-2:hover{background-color:#96dcff}.bottom{width:80%;margin-top:8px}#content{width:100%;font-size:15px;padding:10px}}*{margin:0;padding:0}.main-allNotes{margin-top:25px;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:18px}#search-bar{width:70vw;height:40px;font-size:18px;padding:5px 5px 5px 10px;border:none;border-radius:6px;outline:none;background-color:#4a93ff}.all-notes{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:10px}.note{width:70vw;border:none;border-radius:6px;overflow:hidden;background-color:#4a93ff}.note-layer{display:flex;justify-content:end;align-items:center;gap:40px;padding:5px 10px;background-color:#06f}.date{display:flex;justify-content:end;align-items:center;gap:8px;font-size:14px}.date img{width:22px}.buttons{display:flex;justify-content:center;align-items:center;gap:8px}.buttons img{width:20px}.buttons div{display:flex;justify-content:center;align-items:center;border:none;border-radius:5px;padding:3px;cursor:pointer;background-color:#96dcff}.buttons div:hover{background-color:#fff}.buttons a{text-decoration:none;display:flex;justify-content:center;align-items:center;border:none;border-radius:5px;cursor:pointer;background-color:#96dcff}.buttons a:hover{background-color:#fff}.note-content{padding:10px}#title-area{font-size:20px;font-weight:600;margin-bottom:8px}#content-area{width:100%;height:auto;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-wrap:break-word}@media (max-width: 500px){.search-bar-div{display:flex;justify-content:center;align-items:center;width:100%}#search-bar{width:80%;height:auto;font-size:15px;padding:8px}.note{width:80%}.note-layer{justify-content:center;align-items:end;flex-direction:column-reverse;gap:6px;padding:10px}.date{font-size:13px}.date img{width:20px}.buttons{gap:5px}.buttons img{width:16px}#title-area{font-size:18px}#content-area{font-size:15px}}.main-viewNote{margin:35px auto auto;width:60vw;display:flex;flex-direction:column;gap:10px}.top-viewNote{width:100%;font-size:18px;padding:10px;border:none;border-radius:6px;background-color:#06f;box-sizing:border-box}.bottom-viewNote{width:100%;min-height:50vh;font-size:18px;padding:10px;border:none;border-radius:6px;background-color:#06f;box-sizing:border-box}.div{color:#96dcff}.copy{width:100%;display:flex;justify-content:space-between;align-items:center;box-sizing:border-box}.copy-box{display:flex;justify-content:center;align-items:center;gap:10px;padding:5px 10px;border:none;border-radius:20px;background-color:#96dcff;margin:0;cursor:pointer}.copy-box img{width:17px}.copy-box:hover{background-color:#fff}@media (max-width: 500px){.main-viewNote{width:80%}.top-viewNote{width:100%;height:auto;font-size:15px;padding:8px}.bottom-viewNote{font-size:15px;padding:8px}.div{font-size:15px}.copy-box{gap:6px;margin-right:none}.copy-box>div{font-size:14px}.copy-box img{width:16px}}