@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap";.note{display:flex;flex-direction:column;height:300px;width:240px;padding:25px;background-color:#01e8c8;border-radius:20px;box-shadow:0 5px 10px #0000001a}.note:hover .note__footer-img{opacity:1}.note__text{flex:1;padding-right:4px;font-size:16px;line-height:28px;background-color:transparent;resize:none;outline:none;border:none}.note__text::-webkit-scrollbar{width:6px}.note__text::-webkit-scrollbar-track{background:inherit;border-radius:50px}.note__text::-webkit-scrollbar-thumb{background:#dcdcdc;border-radius:6px}.note__footer{display:flex;justify-content:space-between;align-items:center;padding-top:20px}.note__footer-img{height:24px;width:24px;opacity:0;transition:.3s;cursor:pointer}.note-container{height:100%;max-width:1050px;padding:150px 15px 30px;margin:0 auto}.note-container__notes{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.control{position:fixed;z-index:10;display:flex;flex-direction:row;align-items:center;gap:20px;width:100%;padding:20px 15px;background-color:#fff;box-shadow:0 5px 10px #0000001a}.control__title{font-size:24px;font-weight:700}.control__wrapper{display:flex;align-items:center}.control__wrapper-toggle{position:relative;z-index:10;display:flex;justify-content:center;align-items:center;width:40px;height:40px;background-color:#222;border-radius:50px;cursor:pointer}.control__wrapper-toggle:before{content:"";position:absolute;width:20px;height:3px;background-color:#fff;border-radius:5px;transform:translateY(0) rotate(0)}.control__wrapper-toggle:after{content:"";position:absolute;width:20px;height:3px;background-color:#fff;border-radius:5px;transform:translateY(0) rotate(90deg);transition:.5s}.control__wrapper-toggle.active.toggle:after{transform:translateY(0) rotate(0)}.control__wrapper-toggle--list{position:absolute;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px;height:0;width:0;padding-left:40px;background-color:#222;box-shadow:5px 5px 10px #0003;border-radius:50px;transition:.3s}.control__wrapper-toggle--list.active{height:40px;width:230px}.control__wrapper-toggle--list-item{height:20px;width:20px;border-radius:50%;list-style:none;cursor:pointer}@media (max-width: 400px){.control{flex-direction:column;align-items:flex-start;gap:10px}}*{padding:0;margin:0;box-sizing:border-box;font-family:Montserrat,sans-serif}body{background:#fff}body::-webkit-scrollbar{width:10px}body::-webkit-scrollbar-track{background:inherit}body::-webkit-scrollbar-thumb{background:#dcdcdc;border-radius:20px}.app{display:flex;flex-direction:column}