body.loading #main-loader{position:absolute;z-index:999;width:100%;height:100%;background-color:#2db63b;text-align:center;left:0;top:0}body.loading #main-loader img{width:300px;margin:auto auto}body:not(.loading) #main-loader{display:none}#sidebar{position:fixed;width:400px;background-color:#222;color:#fff;height:100vh;overflow-y:auto;transition:max-width .5s;box-sizing:border-box;z-index:1;top:0;left:0}#sidebar header{width:100%;height:80px;padding:10px;box-sizing:border-box;line-height:65px}#sidebar header button{padding:8px}#sidebar ul{list-style-type:none;padding:0;position:absolute;top:60px;width:400px;height:calc(100vh - 76px);bottom:0;overflow-y:auto}#sidebar ul a,#sidebar ul li{color:#fff;text-decoration:none}#sidebar ul li{margin-bottom:4px}#sidebar ul li a{display:block;padding:10px;font-size:11pt}#sidebar ul li a .title{font-weight:700}#sidebar ul li a .date,#sidebar ul li a .page{font-size:10pt}#sidebar ul li a .page{float:left}#sidebar ul li a .date{float:right}#sidebar ul li a.visited{color:#ffe0b3}#sidebar ul li a.active{color:#fa9600}#sidebar-toggle{display:block;width:40px;height:40px;position:fixed;right:20px;top:10px;z-index:3;border-radius:5px;background:#fff;opacity:.75}#sidebar-toggle i{top:50%;left:50%;transform:translateY(-50%) translateX(-50%);width:70%}#sidebar-toggle i,#sidebar-toggle i:after,#sidebar-toggle i:before{display:block;height:5px;background:#000;position:absolute}#sidebar-toggle i:after,#sidebar-toggle i:before{content:"";transition:all .5s;width:100%}#sidebar-toggle i:before{top:-10px;transform:translateY(0)}#sidebar-toggle i:after{top:10px;transform:translateY(0)}body.sidebar-open #sidebar-toggle i{height:0}body.sidebar-open #sidebar-toggle i:before{top:-2px;transform:rotate(45deg)}body.sidebar-open #sidebar-toggle i:after{top:-2px;transform:rotate(-45deg)}#image-list{width:100%;text-align:center;box-sizing:border-box;height:100vh;overflow-y:auto;transition:left .5s,width .5s;position:fixed;z-index:2;background:#fff;left:0}#image-list hr{border-color:red;border-width:2px 0 0 0;border-style:solid;width:100%}#image-list img{max-width:90%;height:auto}#image-list img[lazy=loading]{background:#e6e6e6}body.sidebar-open #image-list{left:400px}@-webkit-keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}img.loading{width:150px;-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite}#app,body,html{margin:0;padding:0;min-height:100vh}#app,body,html,main{width:100vw;overflow-x:hidden}main{height:100vh}