
body,html{height:100%}body{margin:0;font-size:16px;overflow:hidden;display:flex;flex-direction:column}.login.transparent{background-color:var(--theme-bg-transparent)}.login.transparent .x-panel{background-color:transparent}.main{flex:1;overflow:auto;padding:0 30px 60px;background-color:var(--theme-light-surface)}.header{min-height:30px;padding:10px;border-bottom:1px solid var(--hBCol);z-index:99999;background-color:var(--theme-bg)}.header .left{float:left;padding:10px}.header .right{float:right;margin:5px}.header .filename{color:var(--theme-textLight);font-size:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header .details{color:var(--theme-textLighter);display:inline-block;font-size:14px;padding:10px 20px}.actionBtn,a.actionBtn{padding:10px 15px;display:inline-block;border-radius:var(--xsBr);background-color:var(--theme-primary);color:var(--theme-on-primary);transition:color 200ms cubic-bezier(.4,0,.2,1),background 200ms cubic-bezier(.4,0,.2,1),box-shadow 400ms cubic-bezier(.4,0,.2,1)}.actionBtn:hover{background:var(--theme-secondary-container);color:var(--theme-primary);text-decoration:none}.actionBtn:active{background-color:rgba(0,0,0,.26)}a.powerBy{margin-left:10px}a.powerBy img{vertical-align:middle}.breadCrumb{font-size:24px;padding:2px 6px}.breadCrumb:hover{text-decoration:none;background-color:rgba(0,0,0,.06);border-radius:var(--xsBr)}.bcSep{color:var(--theme-textLighter);font-size:24px;margin-left:5px;margin-right:5px;display:inline-block}.overlay{display:none;position:fixed;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.6);z-index:999999;cursor:default}.panel,.panel-contents{border-radius:var(--xsBr)}.panel{position:absolute;background-color:var(--theme-bg);width:400px;font-size:14px;box-shadow:0 4px 8px rgba(0,0,0,.32),0 8px 40px rgba(0,0,0,.4);top:50%;left:50%;transform:translate(-50%,-50%);padding:20px}.panel-contents{margin-bottom:20px;border:1px solid var(--hBCol);height:100%;max-height:500px;width:100%;overflow-y:auto;box-shadow:inset 0 1px 2px rgba(0,0,0,.1)}.panel-contents>div{margin:10px}.overlay#upload .panel{width:80%}.overlay#upload .panel-contents{height:300px}.acceptBtn{margin-right:10px}.extLabel{display:inline-block;text-align:center;text-transform:uppercase;border-radius:var(--xsBr);font-weight:700;background-color:var(--theme-bg-transparent);border:1.5px solid var(--theme-folder-icon-color);padding:2px 4px;max-width:50px;white-space:nowrap;overflow:hidden}@media (max-width:480px){.panel{width:80%}}

.header{min-height:20px;padding:5px}.item,.itemsList,.thumb{display:flex;justify-content:center}.itemsList{margin:30px auto;flex-wrap:wrap}.itemsList a{text-decoration:none}.item,.thumb{align-items:center}.item{border-radius:var(--mBr);margin:5px;background-color:var(--hBCol);transition:box-shadow 200ms cubic-bezier(.4,0,.2,1);background-size:cover;flex-wrap:wrap;cursor:pointer;position:relative}.item.icon{background-position:center;background-size:40%;background-repeat:no-repeat}.item .filename{flex:0;line-height:30px;vertical-align:middle;text-align:center;overflow:hidden;text-overflow:ellipsis;font-size:14px;white-space:nowrap;background-color:var(--theme-bg-transparent);width:100%;position:absolute;bottom:0;left:0;opacity:0;transition:opacity .3s ease;border-radius:0 0 var(--mBr) var(--sBr);color:var(--theme-on-bg)}.item.folder .filename,.item:hover .filename{opacity:1}.thumb{width:100%;height:100%}
