body{margin:0;background-color:#e7f0f8}.App{width:100%;height:100vh;overflow:hidden;font-size:16px;display:flex}.app-main{width:70%;height:100vh}.app-main-note-edit,.app-main-note-preview{height:50vh}.app-main-note-edit{padding:25px}.app-main-note-edit input,textarea{display:block;border:1px solid #ddd;margin-bottom:20px;width:100%;padding:5px;height:calc(50vh - 130px);resize:none;font-size:16px}.app-main-note-edit input{height:50px;font-size:2rem}.app-main-note-preview{border-top:1px solid #ddd;overflow-y:scroll;background:#0000000a}.preview-title{padding:25px 25px 0;margin:0}.markdown-preview{padding:0 25px 25px}.no-active-note{width:70%;height:100vh;line-height:100vh;text-align:center;font-size:2rem;color:#999}button{background-color:none;border:none;color:#08c;margin:0;padding:0;font-size:16px;cursor:pointer}.app-sidebar{width:30%;height:100vh;border-right:1px solid #ccc}.app-sidebar-header{display:flex;justify-content:space-between;padding:25px}.app-sidebar-header h1{margin:0}.app-sidebar-notes{height:calc(100vh - 78px);overflow-y:scroll}.app-sidebar-note{padding:25px;cursor:pointer;transition:all .3s}.sidebar-note-title{display:flex;justify-content:space-between}.app-sidebar-note p{margin:10px 0}.app-sidebar-note small{color:#999}.app-sidebar-note:hover,.app-sidebar-note.active{background-color:#f1f0f0}