@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap);
/* Centered Header Sigma-9
* [2021 Wikidot Component]
* By Lt Flops (CC BY-SA 3.0)
* Forked from:
* Penumbra Theme by EstrellaYoshte
* Also based on:
* Centered Header BHL by Woedenaz
**/
/* ---- VARS ---- */
:root{
--titleColor: hsl(0, 0%, 95%);
--subtitleColor: hsl(60, 62%, 85%);
--lgurl: url(https://scp-wiki.wdfiles.com/local--files/component%3Acentered-header-sigma-9/logo.svg);
}
/* ---- SITE HEADER ---- */
div#header{
background-image: none;
}
#header::before{
position: absolute;
width: 100%;
height: 100%;
top: .45rem;
left: 0;
content: " ";
background-image: var(--lgurl);
background-position: center top;
background-repeat: no-repeat;
background-size: auto 8rem;
opacity: .35;
pointer-events: none;
z-index: -1;
}
#header h1,
#header h2{
float: none;
margin-left: 0;
text-align: center;
}
/* Move the Subtitle Down a Smidge */
#header h2{
margin-top: .45rem;
}
/* Hide the Existing Text */
#header h1 span,
#header h2 span{
display: none;
font-size: 0;
}
/* Style the New Text */
#header h1 a::before,
#header h2::before{
font-family: "Montserrat", "Arial", sans-serif;
text-shadow: none;
}
#header h1 a::before{
position: relative;
bottom: .15em;
color: var(--titleColor);
}
#header h2::before{
position: relative;
bottom: .3em;
color: var(--subtitleColor);
}
/* Set the New Text's Content From Variable */
#header h1 a::before{
content: var(--header-title, "SCP基金会");
font-size: 115%;
font-weight: bold;
}
#header h2::before{
content: var(--header-subtitle, "控制 - 收容 - 保护");
font-size: 130%;
font-weight: 600;
}
/* ---- LOGIN ---- */
#login-status{
top: .5rem;
left: 0;
right: initial;
z-index: 1;
}
/* ---- SEARCH ---- */
#search-top-box{
top: .5rem;
right: 0;
}
#search-top-box-input{
border-radius: 0;
}
#search-top-box-input,
#search-top-box-input:hover,
#search-top-box-input:focus,
#search-top-box-form input[type=submit],
#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus{
border-radius: 0;
box-shadow: none;
font-size: unset;
}
/* ---- TOP BAR ---- */
#top-bar{
display: flex;
justify-content: center;
right: 0;
}
#top-bar ul li ul{
box-shadow: none;
overflow: hidden;
}
/* ---- PAGE TITLE ---- */
.meta-title,
#page-title{
text-align: center;
}
/* ---- BREADCRUMBS ---- */
.pseudocrumbs,
#breadcrumbs{
text-align: center;
}
/* ---- MOBILE DISPLAY ---- */
@media (max-width: 767px){
#login-status{
left: 5.15rem;
z-index: 20;
}
#search-top-box{
width: unset;
}
.mobile-top-bar{
position: relative;
display: flex;
justify-content: center;
left: 0;
}
}
