body{margin:0;font-family:monospace;background-image:url(https://www.transparenttextures.com/patterns/cubes.png)}.wrapper{min-height:100vh}.header{background-color:orange;padding:15px;display:flex;justify-content:space-between;box-shadow:0 0 10px #0000004d}.logo-text{margin:0;color:#fff;font-size:2.3em;display:flex;align-items:center}.nav-link{display:flex;gap:20px;color:#fff;font-size:1.3em}nav{display:flex;align-items:center}nav ul{margin:0}ul li{list-style-type:none}a{text-decoration:none;color:#fff}.nav-item{position:relative}.nav-item a:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:#fff;transition:width .3s ease;-webkit-transition:width .3s ease;-moz-transition:width .3s ease;-ms-transition:width .3s ease;-o-transition:width .3s ease}.nav-item a:hover{font-weight:700;color:#e0d4c3}.nav-item a:hover:after{width:100%}.container{padding:30px;display:flex;justify-content:center}.form{padding:20px;background-color:#fff;border-radius:10px;box-shadow:0 2px 5px #0003;width:50vw;height:130px;display:flex;flex-direction:column;position:relative}.button{position:absolute;bottom:-28%;right:-90%;background-color:orange!important;color:#fff!important}.button:hover{transition:transform .4s ease-out;background-color:#f0ba57;transform:scale(1.02)}input,textarea{outline:none;border:none;resize:none}input:disabled,textarea:disabled{background:none;color:#000}.note-title{font-weight:700;font-size:1.4em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:100%}.text-body{width:100%;height:100%;font-weight:300;font-size:1.3em;word-wrap:break-word;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}.collapse-form{padding:15px;background-color:#fff;border-radius:10px;box-shadow:0 2px 5px #0003;width:50vw}.note-body{width:100%;height:80%;overflow-y:scroll}textarea::-webkit-scrollbar{display:none}textarea{scrollbar-width:none}.contents{display:flex;flex-wrap:wrap}.body{padding:20px}.note{height:200px;width:240px;padding:10px;background-color:#fff;box-shadow:0 2px 5px #0003;border-radius:5px;position:relative}.note h1{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.edit-btn{position:absolute;bottom:10px;right:40px}.delete-btn{position:absolute;bottom:10px;right:10px}.img-btn{height:20px;width:20px;color:orange}.edit-btn{color:orange}.edit-btn,.delete-btn{background:none;border:none}.date{position:absolute;bottom:-5px;left:10px;font-size:1em;color:#bcac94}.footer{text-align:center;color:#bcac94;width:100%}.footer p{text-align:center}