/*
   GQ Theme
   [ 2023 Wikidot Theme ]
   by dby2022
   CC-BY-SA
*/

@import url("https://arandintday.github.io/thebackhubscn/normalize-archived.css");
@import url("https://arandintday.github.io/thebackhubscn/bhl-archived.css");
@import url("https://arandintday.github.io/thebackhubscn/sidebar-archived.css");
@import url("https://arandintday.github.io/thebackhubscn/banlist.css");
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700;900&display=swap');
@import url('https://fastly.jsdelivr.net/gh/scp-cn-tech/sigma9@cn/modules/colstyle.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');
:root {
    --theme-base: "black-highlighter";
    --theme-id: "liminal";
    --theme-name: "Liminal Theme";
    --logo-image: url("https://arandintday.github.io/thebackhubscn/logo.svg");
    --header-title: "The Backrooms";
    --header-subtitle: "让青绿色的梦在心中荡漾";
    --body-font: Inter, Noto Sans SC, Arimo, Verdana, Geneva, sans-serif;
    --header-font: Inter, Noto Sans SC, Franklin Gothic Medium, Franklin Gothic, ITC Franklin Gothic, Arial, sans-serif;
    --title-font: var(--header-font);
    --mono-font: Recursive, Noto Serif SC, Consolas, monaco, monospace;
    --white-monochrome: 237, 239, 255;
    --pale-gray-monochrome: 230, 234, 255;
    --light-gray-monochrome: 120, 178, 184;
    --gray-monochrome: 71,102,132;
    --black-monochrome: 71,102,132;
    --bright-accent: 127,178,184;
    --medium-accent: 127,170,180;
    --dark-accent: 127,180,184;
    --pale-accent: 127,178,184;
    --swatch-topmenu-border-color: var(--medium-accent);
   /*链接颜色，调了好久 （*/
    --link-color: 127,190,124;
    --hover-link-color: 119,199,89;
    --visited-link-color: 150,200,100;
    --rating-module-text-color: var(--gray-monochrome);
    --background-gradient-distance: 0rem;
    --gradient-header: linear-gradient(to top, rgba(var(--medium-accent)) 0%, rgba(var(--medium-accent), 0.90) 100%);
    --diagonal-stripes: linear-gradient(transparent 0);
}

/*
#login-status {
   position: absolute !important;
}
#account-options {
   display: none !important;
}
*/

#skrollr-body {
    background-image: radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
    background-repeat: repeat;
    background-size: 0.25em 0.25em;
    width: 100%;
    height: 7.5rem;
}

#side-bar .side-block div a img {
    filter: grayscale(100%);
}

#container {
    background-image: radial-gradient(circle, transparent 50%, transparent 0);
    background-size: 0.25em 0.25em;
    background-repeat: repeat;
    background-attachment: fixed;
}

div#page-options-bottom-2>a,
div#page-options-bottom>a {
    border-radius: 0em;
    -moz-border-radius: 0em;
    border: none;
}

div#page-options-bottom-2>a:active,
div#page-options-bottom-2>a:hover,
div#page-options-bottom>a:active,
div#page-options-bottom>a:hover {
    border: none;
}

#header,
#top-bar {
    background-attachment: scroll;
}

#header {
    background-image: none;
}

#header::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background-image: var(--logo-image);
    background-size: auto 16rem;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.4;
}

#header h1,
#header h1 a {
    position: absolute;
    top: 1rem;
    margin: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    z-index: 0;
}

#header h2,
#header h2 span,
#header h2 span::before {
    position: absolute;
    top: 2rem;
    margin: 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

#header h1 a::before,
#header h2 span::before {
    text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}

a.newpage {
    background: transparent;
    text-decoration: none
}

a.newpage {
    color: rgb(var(--newpage-color))
}

blockquote {
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0, 0, 0, .25);
}
/*基本div*/
.styled-quote {
    background-color: rgb(var(--pale-gray-monochrome));
    border-left: 0.5rem solid rgba(var(--gray-monochrome));
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0, 0, 0, .25);
}

.dark-styled-quote {
    background-color: rgb(var(--gray-monochrome));
    border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
    color: rgb(var(--white-monochrome));
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0, 0, 0, .25);
}

.dark-styled-quote a {
    color: rgb(var(--swatch-menubg-medium-color));
}

.lightblock {
    background-color: rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, .25);
}

.darkblock {
    background-color: rgb(var(--gray-monochrome));
    color: rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0, 0, 0, .25);
}

.darkblock a {
    color: rgb(var(--swatch-menubg-medium-color));
}
/*高级一点的div*/
.lightblock-c {
   background-color: rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}
.darkblock-c {
    background-color: rgb(var(--gray-monochrome));
    color: rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

.glassblock {
   background-image: linear-gradient(-30deg,
      rgba(var(--medium-accent),.8) -80%,
      rgba(var(--white-monochrome),.4) 100%);
   border: solid rgb(var(--pale-accent)) 2px;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}

.hoverblock{
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   transition: box-shadow 0.3s ease-out;
   -webkit-transition: box-shadow 0.3s ease-out;
}

.hoverblock:hover,.hoverblock:focus{
 box-shadow: 0px 4px 10px 0 rgba(0,0,0, .25);

}

.light-hoverblock{
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   transition: all 0.3s ease-out;
   -webkit-transition: all 0.3s ease-out; /* Safari */
}

.light-hoverblock:hover,.light-hoverblock:focus{
   background-color: rgb(var(--pale-gray-monochrome));
   box-shadow: 0px 4px 10px 0 rgba(0,0,0, .25);
}

.dark-hoverblock{
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   transition: all 0.3s ease-out;
   -webkit-transition: all 0.3s ease-out; /* Safari */
}

.dark-hoverblock:hover,.dark-hoverblock:focus{
   background-color: rgb(var(--gray-monochrome));
   color: rgb(var(--white-monochrome));
   box-shadow: 0px 4px 10px 0 rgba(0,0,0, .25);
}

.hover-rl-block {
            background-image: linear-gradient(to right, #1A2980 0%, #26D0CE  51%, #1A2980  100%);
            margin: 10px;
            padding: 10px 40px;
            transition: 0.5s;
            background-size: 150% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
            border-radius: 10px;
            display: block;
          }

          .hover-rl-block:hover {
            background-position: right center;
            color: #fff;
          }

.dark-hover-rl-block {
            background-image: linear-gradient(to right, #16222A 0%, #3A6073  51%, #16222A  100%);
            margin: 10px;
            padding: 10px 40px;
            transition: 0.5s;
            background-size: 150% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
            border-radius: 10px;
            display: block;
          }

.dark-hover-rl-block:hover {
            background-position: right center;
            color: #fff;
          }

 .white-hover-rl-block {
            background-image: linear-gradient(to right, #50C9C3 0%, #96DEDA  51%, #50C9C3  100%);
            margin: 10px;
            padding: 10px 40px;
            transition: 0.5s;
            background-size: 150% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
            border-radius: 10px;
            display: block;
          }

 .white-hover-rl-block:hover {
            background-position: right center;
            color: #fff;
          }
/*加重阴影*/
.y {
  box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;
     }
#side-bar div.menu-item a[href*="/scp-"] {
    text-align: left !important;
    width: auto !important;
}

#side-bar div.menu-item.small a {
    justify-content: center;
    width: auto;
    padding: 0 0.25em;
    text-indent: 0;
    white-space: nowrap;
}

#side-bar div.menu-item a {
    justify-content: flex-start;
    padding: 0 0 0 calc(var(--base-font-size)*.93333);
}

#side-bar div.menu-item,
#side-bar div.menu-item>p {
    display: flex;
    flex-shrink: 0;
    flex-basis: 100%;
    flex-flow: row wrap;
    align-items: center;
    justify-content: flex-start;
    height: 1.5rem;
    min-height: 1.5rem;
    margin: 0;
    padding: 0;
    box-shadow: inset 0 calc(var(--sidebar-internal-border-thickness)*-1) 0 0 rgba(var(--sidebar-border-color));
    font-size: 0;
}

#side-bar div.menu-item>:last-child {
    flex-grow: 2;
}

#side-bar .side-block {
    margin-top: -0.5rem;
}

#side-bar div.menu-item a:not(a:first-child) {
    border-left: var(--sidebar-internal-border-thickness) solid rgba(var(--swatch-border-color), .08)
}

#side-bar div.scpnet-interwiki-wrapper {
    min-height: 300px;
}

.thread-container .post .long .content .image:not(.collapsible-block .image) {
    object-fit: cover;
    max-height: 2em;
    width: 100%;
    transition: max-height 0.5s;
}

.thread-container .post .long .content .image:hover:not(.collapsible-block .image) {
    max-height: 100em;
}

div.scpnet-interwiki-wrapper {
    margin: 0;
    width: auto;
}
iframe.scpnet-interwiki-frame {
    border: inherit;
    width: 100%;
    height: 230px;
}
@media (min-width:768px) {
    div.scpnet-interwiki-wrapper,
    iframe.scpnet-interwiki-frame {
        width: 100%;
    }
}

#page-content div#u-adult-warning {
    width: fit-content;
    margin: 0 auto 1.25rem;
    padding: 0.5rem 1rem;
    border: 3px solid #333;
    background: #e4e4e4;
    color: #333;
    text-align: center;
    font-weight: bold;
}
#page-content div#u-adult-warning > div#u-adult-header {
    font-size: 300%;
    text-shadow: 1px 2px 3px rgba(0, 0, 0, .5);
    color: #901;
}
#page-content div#u-adult-warning > div#u-adult-header p {
    margin: 0;
}
#page-content div#u-adult-warning > .error-block {
    color: unset;
    padding: unset;
    margin: unset;
    border: unset;
    margin-bottom: 1em;
}

#odialog-container .owindow>div.modal-body>img[style*="padding: 2px 8px;"]:first-child {
    background-color: initial!important;
}

        /*解决Saving Page的BUG*/
            body[class="wait"] #odialog-shader-iframe,body[class="wait"] #odialog-shader{display:none!important}#odialog-container{position:fixed!important}body[class="wait"] #odialog-container{z-index:-1}body[class="wait"] #odialog-container #owindow-1{display:none!important}body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info{background-color:rgb(var(--white-monochrome,150,150,150));border:1px solid rgb(var(--gray-monochrome,0,0,0))}div#lock-info{font-size:0!important;margin:.8rem 0!important;padding:.4rem .8rem!important}div#lock-info::before{content:'您握有一个独占的15 分钟锁定，这将会阻止其他人编辑您正在作业的页面。\A这个锁定将在闲置 ';display:inline;font-size:.82rem;white-space:pre-wrap}div#lock-info>strong{font-size:.82rem}div#lock-info>br{display:none}div#lock-info::after{content:' 秒后失效。';display:inline;font-size:.82rem}body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info::before{content:'保存页面中……\A如果此提示已经显示了很长时间，建议将编辑框中的内容复制到剪切板然后刷新本页重新编辑。';display:inline;font-size:.82rem;color:rgb(var(--gray-monochrome,33,33,33));white-space:pre-wrap}body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info::after{font-size:0}body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info>strong{font-size:0}body[class="wait"] a[name="page-top"][target]+div #main-content #action-area div#lock-info::after{font-size:0}