*,*:after,*:before{box-sizing:border-box;padding:0;margin:0}html{font-family:"Poppins",sans-serif;background:#f8fafb}button{background:none;border:none;font-size:inherit}button:focus{outline:none}input,textarea,select{font-family:inherit;display:block;width:100%;padding:10px 0;border:none}input:focus,textarea:focus,select:focus{outline:none}.avatar{border-radius:50px;width:40px;height:40px;background:#f5f8ff;color:#7871ff;font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;flex:none}.avatar:hover .tooltip{top:52px;opacity:1}.avatar .tooltip{position:absolute;padding:8px 10px;border-radius:5px;top:45px;left:50%;transform:translate(-50%);background:#7871ff;color:#fff;display:block;z-index:8;box-shadow:0 3px 10px #00000026;font-size:12px;font-weight:600;pointer-events:none;transition:opacity .25s ease,top .25s ease;opacity:0;white-space:nowrap}.avatar .tooltip:before{content:" ";position:absolute;bottom:100%;left:50%;margin-left:-6px;border-width:6px;border-style:solid;border-color:transparent transparent #7871ff transparent}.no-result{background:#cfe2ff;display:flex;align-items:center;padding:10px;border-radius:10px;color:#7871ff}.no-result i{color:inherit;margin-right:10px;font-size:30px}.input-holder{position:relative}.input-holder .io{border-bottom:1px solid transparent;transition:border-color .25s ease}.input-holder .io.ng-dirty.ng-invalid{color:red;border-bottom-color:#ff000080}.input-holder .io.ng-dirty.ng-invalid::placeholder{color:red}.input-holder i{position:absolute;top:8px;right:0;color:red}.sidebar-wrapper{width:250px;background:#fff;height:calc(100vh - 70px);transition:box-shadow .3s ease,width .3s ease;position:fixed;top:70px;left:0;z-index:9;box-shadow:0 10px 10px #00000021}.sidebar-wrapper ul{list-style:none;margin:0;padding:0}.sidebar-wrapper p{margin:0 0 10px 20px;color:#9b9b9b}.sidebar-wrapper.min{width:60px;box-shadow:unset}.sidebar-wrapper.min p,.sidebar-wrapper.min .sidebar-inner .sidebar-item span{display:none}@media (min-width: 1280px){.sidebar-wrapper{position:sticky;box-shadow:unset}}.sidebar-inner>*+*{margin-top:20px}.sidebar-inner .sidebar-item{padding:10px 10px 10px 20px;display:flex;align-items:center;width:100%;position:relative;border-left:2px solid #fff;line-height:1.3;font-size:14px;overflow:hidden;text-decoration:none;color:inherit}.sidebar-inner .sidebar-item:not(.add-tag){cursor:pointer}.sidebar-inner .sidebar-item i{font-size:18px;vertical-align:middle}.sidebar-inner .sidebar-item span{white-space:nowrap;margin-left:10px}.sidebar-inner .sidebar-item input{padding:0;margin:0 10px;background:transparent;font-size:inherit}.sidebar-inner .sidebar-item .add-tag-actions{display:flex;align-items:center}.sidebar-inner .sidebar-item .add-tag-actions button{cursor:pointer}.sidebar-inner .sidebar-item .add-tag-actions>*+*{margin-left:5px}.sidebar-inner .sidebar-item:hover,.sidebar-inner .sidebar-item.active-route{background:#f5f8ff;border-left-color:#7871ff}.sidebar-inner button.sidebar-item{color:#7871ff}.sidebar-inner .sidebar-item:not(.tags) i{color:#7871ff}header{height:70px;padding:10px 20px;display:flex;align-items:center;justify-content:space-between;position:fixed;top:0;left:0;width:100%;background:#fff;z-index:9;box-shadow:0 3px 10px #0000000e}header .logo{display:flex;align-items:center}header .logo h2{white-space:nowrap;font-size:20px}header .logo span{color:#7871ff}header .logo button{margin-right:10px;cursor:pointer}header .logo button i{vertical-align:middle}header .header-actions{display:flex;align-items:center}header .header-actions>*+*{margin-left:10px}header .search-input{border:1px solid rgba(120,113,255,.15);border-radius:5px;padding:10px}@media (max-width: 650px){header .search-input-wrapper{position:absolute;left:60px;top:70px;width:calc(100% - 60px);padding:10px;background:#fff;box-shadow:8px 14px 10px #0000000e}}.normal-card{background:#fff;border-radius:15px;box-shadow:2px 0 21px #00000017;width:100%;height:100%;display:flex;flex-direction:column}.normal-card .card-header,.normal-card .card-description{padding:20px 20px 0}.normal-card .card-description{flex-grow:1}.normal-card audio{margin-top:15px}.normal-card .card-header{display:flex;justify-content:space-between;align-items:flex-start}.normal-card .card-header h4{font-size:22px}.normal-card .card-header span{font-size:12px;display:block;color:#9e9e9e}.normal-card .card-header i{font-size:inherit;vertical-align:middle}.normal-card .card-header button{display:block;cursor:pointer;color:#7871ff80;font-size:24px;margin:10px 0 0 10px}.normal-card .card-header button.note-pinned{color:#7871ff;transform:rotate(45deg)}.normal-card .card-tags{display:flex;align-items:center;flex-wrap:wrap}.normal-card .card-footer{padding:20px 20px 15px;display:flex;align-items:flex-start;justify-content:space-between}.normal-card .delete-note{width:30px;height:30px;transition:.25s ease;position:relative;overflow:hidden;transition:box-shadow .25s ease}.normal-card .delete-note span{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);background:#7871ff;width:100%;display:block;transition:height .1s linear}.normal-card .delete-note i{z-index:1;font-size:16px;transition:color .5s ease}.normal-card .delete-note.clicked{box-shadow:0 10px 10px #00000021}.normal-card .delete-note.clicked i{transform:scale(.8);color:#fff}.tag{display:inline-flex;align-items:center;justify-content:center;background:#f5f8ff;color:#7871ff;font-size:14px;border-radius:50px;padding:5px 10px;margin:0 5px 5px 0}.add-note{box-shadow:0 3px 10px #0000000e;border-radius:10px;padding:20px;background:#fff;margin-bottom:10px}.add-note audio{display:block;margin-top:10px;width:100%}.add-note textarea{resize:none;height:60px}.add-note .note-actions{margin-top:10px;justify-content:flex-end}.add-note .note-actions,.add-note .note-actions>div{display:flex}.add-note .note-actions>div>*+*{margin-left:10px}.add-note .add-note-btn{background:#f5f8ff;color:#7871ff;height:40px;display:flex;align-items:center;padding:0 20px;border-radius:50px;font-weight:600;cursor:pointer}.add-note .added-tags-holder{display:flex;align-items:center;flex-wrap:wrap}.mic-recording i{transition:.25s ease}.mic-recording.recording i{transform:scale(.7)}.mic-recording.recording:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50px;border:2px solid #7871ff;border-top-color:transparent;animation:spinnAnimation 1.5s linear infinite}@keyframes spinnAnimation{to{transform:rotate(360deg)}}.dropdown{position:relative}.dropdown .dropdown-items{z-index:1;position:absolute;top:100%;left:0;width:100%;border-radius:10px;overflow:hidden;box-shadow:0 0 5px #0003;background:#fff}.dropdown .dropdown-items button{display:block;padding:10px 15px;font-size:14px;cursor:pointer;width:100%;text-align:left}.dropdown .dropdown-items button:hover,.dropdown .dropdown-items button:focus{background:#f5f8ff}.dropdown .tag{padding-right:5px}.dropdown .tag button{cursor:pointer;font-size:14px;margin-left:10px;background:#7871ff;color:#fff;border-radius:50%;padding:3px}.audio-wave-holder{background:#f5f8ff;border-radius:15px;padding-left:20px;width:200px;height:40px;overflow:hidden}