@charset "UTF-8";
:root{--body-font:"Microsoft Yahei","Open Sans",sans-serif;--theme-bg:#1f1d2b;--body-color:#fff;--button-bg:#353340;--border-color:rgba(128,129,145,0.24);--video-bg:#252936;--delay:0s;}
body {font-family:var(--body-font);color:var(--body-color);background-size:cover;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:1em 2em;width:100%;height:100vh;overflow:hidden;}
@-webkit-keyframes slidein {from {background-position:top;background-size:3000px;}
to {background-position:-100px 0px;background-size:2750px;}
}
@keyframes slidein {from {background-position:top;background-size:3000px;}
to {background-position:-100px 0px;background-size:2750px;}
}
body:before {position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(75,75,250,0.3);content:"";}
button {margin:20px;}
a:link,a:visited,a:hover,a:active {text-decoration:none;}
img {max-width:100%;}
.container{width:100%;height:auto;}
.custom-btn {width:auto;height:40px;color:#fff;border-radius:5px;padding:10px 25px;font-family:'Lato',sans-serif;font-weight:500;background:transparent;cursor:pointer;transition:all 0.3s ease;position:relative;display:inline-block;box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);outline:none;}
.btn-show {background-color:#89d8d3;background-image:linear-gradient(315deg,#89d8d3 0%,#03c8a8 74%);border:none;z-index:1;}
.btn-show:after {position:absolute;content:"";width:100%;height:0;bottom:0;left:0;z-index:-1;border-radius:5px;background-color:#4dccc6;background-image:linear-gradient(315deg,#4dccc6 0%,#96e4df 74%);transition:all 0.3s ease;}
.btn-show:hover {color:#fff;}
.btn-show:hover:after {top:0;height:100%;}
.btn-show:active {top:2px;}
.container-all {background-color:rgb(23 20 20 / 40%);max-width:1200px;height:580px;min-height:580px;display:flex;overflow:hidden;width:100%;border-radius:20px;font-size:15px;font-weight:500;box-shadow:0 20px 50px rgba(0,0,0,0.3);position:relative;}
.sidebar {width:220px;height:100%;padding:15px;display:flex;flex-direction:column;flex-shrink:0;transition-duration:0.2s;overflow-y:auto;overflow-x:hidden;}
.sidebar .logo {display:none;width:30px;height:30px;background-color:#22b07d;flex-shrink:0;color:#fff;align-items:center;border-radius:50%;justify-content:center;}
.sidebar .logo-expand {text-decoration:none;color:#fff;font-size:19px;font-weight:600;line-height:34px;position:sticky;top:0;}
.sidebar .logo-expand:before {content:"";position:absolute;top:-30px;left:0;width:200px;height:70px;z-index:-1;}
.sidebar-link:hover,.sidebar-link.is-active {color:#fff;font-weight:600;}
.sidebar-link:hover:nth-child(2n+1) i,.sidebar-link.is-active:nth-child(2n+1) i {background:#ff7551;}
.sidebar-link:hover:nth-child(2n) i,.sidebar-link.is-active:nth-child(2n) i {background:#32a7e2;}
.sidebar-link:hover:nth-child(2n+3) i,.sidebar-link.is-active:nth-child(2n+3) i {background:#6c5ecf;}
.sidebar.collapses {width:90px;border-right:1px solid var(--border-color);}
.sidebar.collapses .logo-expand,.sidebar.collapses .side-title {display:none;}
.sidebar.collapses .logo {display:flex;}
.sidebar.collapses .side-wrapper {width:30px;}
.sidebar.collapses .side-menu i {margin-right:30px;}
@-webkit-keyframes bottom {0% {transform:translateY(100px);opacity:0;}
100% {opacity:1;transform:none;}
}
@keyframes bottom {0% {transform:translateY(100px);opacity:0;}
100% {opacity:1;transform:none;}
}
.side-menu {display:flex;flex-direction:column;}
.side-menu a {display:flex;align-items:center;text-decoration:none;color:var(--body-color);}
.side-menu a + a {margin-top:26px;}
.side-menu i {width:30px;padding:8px;border-radius:10px;background-color:var(--button-bg);flex-shrink:0;margin-right:16px;}
.side-menu i:hover {color:#fff;}
.side-title {font-size:12px;letter-spacing:0.07em;margin-bottom:24px;}
.side-wrapper {border-bottom:1px solid var(--border-color);padding:36px 0;width:145px;}
.side-wrapper + .side-wrapper {border-bottom:none;}
.wrapper {display:flex;flex-direction:column;flex-grow:1;width: 90%;height:90%;}
.header {display:flex;align-items:center;flex-shrink:0;padding:30px;}
.search-bar {height:34px;display:flex;width:100%;max-width:250px;margin-left:80px;}
.search-bar input {width:100%;height:100%;border:none;background-color:var(--button-bg);border-radius:8px;font-family:var(--body-font);font-size:14px;font-weight:500;padding:0 40px 0 16px;box-shadow:0 0 0 2px rgba(134,140,160,0.02);background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56.966 56.966' fill='%23717790c7'%3e%3cpath d='M55.146 51.887L41.588 37.786A22.926 22.926 0 0046.984 23c0-12.682-10.318-23-23-23s-23 10.318-23 23 10.318 23 23 23c4.761 0 9.298-1.436 13.177-4.162l13.661 14.208c.571.593 1.339.92 2.162.92.779 0 1.518-.297 2.079-.837a3.004 3.004 0 00.083-4.242zM23.984 6c9.374 0 17 7.626 17 17s-7.626 17-17 17-17-7.626-17-17 7.626-17 17-17z'/%3e%3c/svg%3e");background-size:14px;background-repeat:no-repeat;background-position:96%;color:#fff;}
.user-settings {display:flex;align-items:center;padding-left:20px;flex-shrink:0;margin-left:auto;}
.user-settings svg {width:10px;flex-shrink:0;}
@media screen and (max-width:575px) {.user-settings svg {display:none;}
}
.user-settings .notify {position:relative;}
.user-settings .notify svg {width:20px;margin-left:24px;flex-shrink:0;}
.user-settings .notify .notification {width:8px;height:8px;border-radius:50%;background-color:#ec5252;position:absolute;right:1px;border:1px solid var(--theme-bg);top:-2px;}
@media screen and (max-width:575px) {.user-settings .notify .notification {display:none;}
}
.user-img {width:30px;height:30px;flex-shrink:0;-o-object-fit:cover;object-fit:cover;border-radius:50%;}
.user-name {color:#fff;font-size:14px;margin:0 6px 0 12px;}
@media screen and (max-width:575px) {.user-name {display:none;}
}
.main-container {display:flex;flex-direction:column;padding:0 30px 30px;flex-grow:1;overflow:auto;}
.anim {-webkit-animation:bottom 0.8s var(--delay) both;animation:bottom 0.8s var(--delay) both;}
.main-header {font-size:30px;color:#fff;font-weight:700;padding-bottom:20px;position:sticky;top:0;left:0;background:linear-gradient(to bottom,#1f1d2b 0%,#1f1d2b 78%,rgba(31,29,43,0) 100%);z-index:11;}
.small-header {font-size:24px;font-weight:500;color:#fff;margin:30px 0 20px;}
.stream-area {display:none;}
.show .stream-area {display:flex;}
.show .main-header,.show .main-blogs,.show .small-header,.show .videos {display:none;}
.button-wrapper {display:flex;align-items:center;margin-left:auto;}
@media screen and (max-width:475px) {.main-blog__title {font-size:20px;}
.author-name {font-size:14px;}
.main-blog__author {flex-direction:column-reverse;align-items:flex-start;}
.author-detail {margin-left:0;}
.main-blog .author-img {margin-top:14px;}
.main-container {padding:0 20px 20px;}
.header {padding:20px;}
.sidebar.collapses {width:40px;}
.sidebar {align-items:center;}
body {padding:0;}
.container-all {height:100vh;border-radius:0;max-height:100%;}
}
::-webkit-scrollbar {width:6px;border-radius:10px;}
::-webkit-scrollbar-thumb {background-color:rgba(21,20,26,0.63);border-radius:10px;}
.menu-circle {width:10px;height:10px;background-color:#f96057;border-radius:50%;box-shadow:24px 0 0 0 #f8ce52,48px 0 0 0 #5fcf65;flex-shrink:0;margin-right:50px;}
.header-menu a {padding:10px 10px;text-decoration:none;color:var(--inactive-color);border-bottom:2px solid transparent;transition:0.3s;}
.header-menu a.is-active,.header-menu a:hover {color:#f9fafb;border-bottom:2px solid #f9fafb;}
.notify {position:relative;}
.notify:before {content:"";position:absolute;background-color:#3a6df0;width:6px;height:6px;border-radius:50%;right:1px;top:5px;}
@media screen and (max-width:768px) {.menu-circle,.search-bar,.qqqun {display:none;}
}
@media screen and (mix-width:1158px) {.search-bar {margin-left:5px;}
}
.upload-img {text-align:center;padding:20px;color:#fff;}
.upload-box {border:dashed 1px;border-radius:5px;padding:10vh 0;}
#upimg,#upload-ing {display:none;}
#upload-ing img.uploading-img {width:150px;margin:0 auto;display:block;}
.uploading-showmsg {font-weight:500;letter-spacing:3px;}
#upload-ok {margin-top:20px;display:inline-flex;align-items:center;}
.upload-ok-img,.upload-ok-link {display:none;}
.upload-ok-img img {width:300px;border-radius:5px;}
.form-label,label h1,.text-rotating {color:#fff;}
mark {color:inherit;padding:0;background:0 0;background-position-x:0px;background-position-y:0px;background-repeat:repeat;background-size:auto;background-image:linear-gradient(120deg,rgba(245,108,109,1) 0,rgba(245,108,109,1) 100%);background-repeat:no-repeat;background-size:100% .28em;background-position:0 70%;position:relative;}
@media screen and (max-width:768px) {#upload-ok {display:block;}
.myavatar{display:none;}
}
.card-imgs {position:relative;border-radius:0.75em;padding:0;transition:all 0.2s ease-in-out;}
.card-imgs:nth-child(even) {margin:0 1em;}
.card-top {background:#B2DCE5;border-top-left-radius:0.75em;border-top-right-radius:0.75em;}
.card-top .card-imgshow {display:block;margin-left:auto;margin-right:auto;height:180px;width:auto;border-top-left-radius:0.75em;border-top-right-radius:0.75em;}
.card-top .overlay {display:block;position:absolute;top:0;left:0;height:12em;width:100%;border-top-left-radius:0.75em;border-top-right-radius:0.75em;z-index:10;background:rgba(0,0,0,0.55);overflow:hidden;transition:all 700ms ease;opacity:0;}
.card-top .overlay h1 {text-align:center;font-weight:500;color:#fff;position:relative;top:50%;transform:translateY(-50%);}
.card-top .overlay:hover,.card-top .overlay:focus {opacity:1;}
.triangle {position:relative;height:0;width:0;border-left:1.5em solid transparent;border-right:1.5em solid transparent;border-top:1.5em solid #adc3b9;margin:0 auto -1.47em auto;z-index:20;}
.card-middle {display:none;background:#efefef;padding:2em 1em 1em 1em;}
.card-middle .more {font-family:Open Sans;font-weight:400;}
.card-bottom {background:#f7f7f7;padding:1em 1em 1em 1em;border-bottom-left-radius:0.75em;border-bottom-right-radius:0.75em;}
.card-bottom .card-title {font-weight:100;}
.circle-button {position:absolute;bottom:0;right:3.5em;width:50px;height:50px;font-size:1.5em;color:#fff;background:#fff;border:none;border-radius:50%;box-shadow:0 3px 6px rgba(0,0,0,0.275);outline:none;cursor:pointer;transition:all 300ms ease;}
.circle-button:hover {box-shadow:0 6px 12px rgba(0,0,0,0.275);}
.blur {box-shadow:inset 0 0 2px #fefefed1;-webkit-backdrop-filter:saturate(200%) blur(30px);backdrop-filter:saturate(200%) blur(30px);background-color:hsla(0,0%,100%,.8)!important;}
.alert-dark {color:#fff;}
.avatar {width:230px;height:auto;}
#pagecount span {margin-right:5px;background-color:#0000004a;padding:5px;border-radius:3px;}
#pagecount span a {color:#fff;}
#pagecount span:hover {background-color:#02ff4b9c;color:#fff;}
.input-group>.form-control,.input-group>.form-select {top:20px;height:38px;}
.fancybox-active {height:100vh;}
.alert-index {color:#fff;border-color:#badbcc;}

#imageContainer{display:flex;flex-wrap:wrap;background-color:rgb(255,255,255,.3)}
.image-div{position:relative;margin:10px auto;padding:10px;width:200px;height:200px;float:left;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:inset 0 2px 8px 0 #ffd1d8;border-radius:20px;transition: backdrop-filter 0.3s ease;}
.image-div:hover{background-color:rgba(255,255,255,.2);transition:all .5s}
.image-div:hover::after{position:absolute;background:rgba(0,0,0,.5);padding:5px 10px;border-radius:10px;content:'点击复制'}
.image-div::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:inherit;border-radius:20px;backdrop-filter: saturate(180%) blur(5px);opacity:0;transition:opacity .3s ease}
.image-div:hover::before{opacity:.6}
.image-div img{max-width:100%;max-height:100%}

.alert{padding-top:5px;padding-bottom:5px;margin-top:10px;margin-bottom:10px;}
pre{background-color:rgba(255,255,255,.5);color: #333;padding: 10px;}
.bgw{background-color:rgb(255,255,255,.5);border: 1px solid rgb(16 22 26 / 40%);width:100%;word-break:break-word;word-wrap:break-word;}
#notification{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);padding:10px;background-color:rgba(0,0,0,.4);color:#fff;border-radius:5px;z-index:9999;}