@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fugaz+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
@font-face {
font-family: 'ZihunBiantaoti';
src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/ZihunBiantaoti.woff') format('woff');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'GlowSansSC-Normal';
src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Normal-Light.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: swap;
}
:root {
--logo-image: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/Refractifa_Logo.png);
--header-title: "刻面折射";
--header-subtitle: "绚丽的色彩是一个奇迹";
--body-font: 'Sarabun', 'Noto Sans SC', sans-serif;
--header-font: 'Fugaz One', 'ZihunBiantaoti', sans-serif, cursive;
--title-font: 'Fugaz One', 'ZihunBiantaoti', sans-serif, cursive;
--mono-font: 'Montserrat', 'GlowSansSC-Normal', sans-serif;
--white-monochrome: 29, 26, 74;
--pale-gray-monochrome: 116, 191, 214;
--light-gray-monochrome: 116, 191, 214;
--dark-gray-monochrome: 77, 144, 196;
--gray-monochrome: 71, 83, 173;
--black-monochrome: 255, 255, 255;
--bright-accent: 48, 59, 255;
--medium-accent: 64, 227, 213;
--dark-accent: 201, 255, 223;
--pale-accent: 140, 136, 126;
--link-color: 0, 255, 204;
--hover-link-color: 190, 59, 255;
--swatch-topmenu-border-color: 201, 255, 223;
--rating-module-button-plus-color: 0, 255, 195;
--rating-module-button-negative-color: 3, 0, 161;
--rating-module-button-cancel-color: 132, 0, 255;
/*SPECIAL THEME VARIABLES*/
--chrys-l: 184, 255, 255;
--chrys-d: 0, 255, 221;
--amethyst-l: 119, 65, 176;
--amethyst-d: 83, 0, 171;
--ruby-l: 255, 25, 25;
--ruby-d: 176, 9, 9;
--onyx-l: 23, 16, 31;
--onyx-d: 15, 0, 31;
--topaz-l: 230, 127, 76;
--topaz-d: 189, 63, 0;
--citrine-l: 255, 225, 105;
--citrine-d: 222, 177, 0;
--jade-d: 30, 105, 9;
--jade-l: 123, 232, 93;
--sapphire-l: 82, 109, 247;
--sapphire-d: 17, 43, 173;
--tourm-l: 245, 81, 157;
--tourm-d: 191, 17, 98;
--dia-l: 255, 255, 255;
--dia-d: 135, 135, 135;
--rock-color: 200, 200, 200;
}
#header::before {
content: "";
position: absolute;
height: 80%;
width: 80%;
background-image: var(--logo-image);
background-size: auto 7rem;
background-position: left;
background-repeat: no-repeat;
opacity: 0.6;
left: 8rem;
top: 0rem;
}
#header h1 a::before {
position: absolute;
top: 1rem;
left: 14rem;
margin: 0;
width: 100%;
display: flex;
justify-content: left;
z-index: 0;
}
#header h2 span::before {
position: absolute;
top: 1.3rem;
left: 14rem;
margin: 0;
width: 100%;
display: flex;
justify-content: left;
z-index: 0;
}
#header h1 a::before, #header h2 span::before {
color: #FFFFFF
}
/*Mobile Header Image Alignment*/
@media (max-width: 878px) {
#header::before {
position: absolute;
left: 0;
top: 10px;
}
#header h1, #header h1 a::before {
position: absolute;
top: 1rem;
left: 3rem;
margin: 0;
width: 100%;
display: flex;
justify-content: left;
z-index: 0;
}
#header h2, #header h2 span, #header h2 span::before {
position: absolute;
top: 1.5rem;
left: 2rem;
margin: 0;
width: 100%;
display: flex;
justify-content: left;
z-index: 0;
}
.footnotes-footer {
overflow-x: hidden;
}
}
#skrollr-body {
width: 100%;
position: absolute;
top: 0;
left: 0;
background-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/meghan-hessler-Uc6_kr4_Baw-unsplash.jpg");
background-size: inherit;
}
#search-top-box-input {
background: #d1fffd;
color: #30c2bb;
border-color: #30c2bb;
}
#search-top-box-input:hover,
#search-top-box-input:focus {
background: #30c2bb;
color: #15304d;
}
#search-top-box-form input[type="submit"] {
background: #264c9e;
color: white;
}
#search-top-box-form input[type="submit"]:hover {
background: #723da8;
color: white;
}
#search-top-box input.empty {
color: #30c2bb;
}
#side-bar .heading p, #side-bar .side-block>.collapsible-block .collapsible-block-link {
color: white;
--text-shadow: grey;
}
.scp-image-block .scp-image-caption {
background-color: rgb(var(--rock-color));
color: black;
}
#account-options {
background-color: rgb(var(--sapphire-l));
}
#login-status ul a:hover {
color: rgb(var(--chrys-d));
}
#login-status a {
color: rgb(var(--rock-color));
}
/*STANDARD BLOCKS*/
blockquote {
color: black;
background-color: rgba(var(--rock-color), 0.5);
}
div.blockquote {
color: black;
background-color: rgba(var(--rock-color), 0.5);
}
.styled-quote {
background-color:rgb(237, 255, 251);
color: black;
border-left: 0.5rem solid rgb(179, 255, 236);
}
.lightblock {
background-color:rgba(200, 255, 245, 0.6);
color: black;
box-shadow: 0 0.2rem 0.6rem rgba(200, 255, 245, 1);
border: 2px solid rgb(200, 255, 245);
}
.dark-styled-quote {
color: white;
border-left: 0.5rem solid rgb(26, 42, 150);
}
.darkblock {
color: white;
background-color:rgba(0, 6, 92, 0.3);
}
.code {
border: 2px dashed rgb(var(--sapphire-d));
background-color: rgb(var(--rock-color));
}
/*SPECIAL DIVS FOR THIS THEME*/
.chrys-lightblock {
background-color:rgb(var(--chrys-l));
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
color: black;
position: relative;
}
.chrys-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.chrys-quote {
background-color:rgb(var(--chrys-l));
border-left: 0.5rem solid rgba(var(--chrys-d));
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);
color: black;
position: relative;
}
.chrys-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.amethyst-lightblock {
background-color:rgb(var(--amethyst-l));
color: white;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.amethyst-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.amethyst-quote {
background-color:rgb(var(--amethyst-l));
color: white;
border-left: 0.5rem solid rgba(var(--amethyst-d));
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);
position: relative;
}
.amethyst-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.ruby-lightblock {
background-color:rgb(var(--ruby-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.ruby-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.ruby-quote {
background-color:rgb(var(--ruby-l));
color: black;
border-left: 0.5rem solid rgba(var(--ruby-d));
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);
position: relative;
}
.ruby-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.onyx-lightblock {
background-color:rgb(var(--onyx-l));
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.onyx-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.onyx-quote {
background-color:rgb(var(--onyx-l));
border-left: 0.5rem solid rgba(var(--onyx-d));
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);
position: relative;
}
.onyx-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.topaz-lightblock {
background-color:rgb(var(--topaz-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.topaz-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.topaz-quote {
background-color:rgb(var(--topaz-l));
color: black;
border-left: 0.5rem solid rgba(var(--topaz-d));
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);
position: relative;
}
.topaz-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.citrine-lightblock {
background-color:rgb(var(--citrine-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.citrine-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.citrine-quote {
background-color:rgb(var(--citrine-l));
color: black;
border-left: 0.5rem solid rgba(var(--citrine-d));
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);
position: relative;
}
.citrine-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.jade-lightblock {
background-color:rgb(var(--jade-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.jade-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.jade-quote {
background-color:rgb(var(--jade-l));
color: black;
border-left: 0.5rem solid rgba(var(--jade-d));
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);
position: relative;
}
.jade-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.sapphire-lightblock {
background-color:rgb(var(--sapphire-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.sapphire-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.sapphire-quote {
background-color:rgb(var(--sapphire-l));
color: black;
border-left: 0.5rem solid rgba(var(--sapphire-d));
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);
position: relative;
}
.sapphire-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.tourm-lightblock {
background-color:rgb(var(--tourm-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.tourm-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.tourm-quote {
background-color:rgb(var(--tourm-l));
color: black;
border-left: 0.5rem solid rgba(var(--tourm-d));
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);
position: relative;
}
.tourm-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.dia-lightblock {
background-color:rgb(var(--dia-l));
color: black;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
position: relative;
}
.dia-lightblock::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.dia-quote {
background-color:rgb(var(--dia-l));
color: black;
border-left: 0.5rem solid rgba(var(--dia-d));
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);
position: relative;
}
.dia-quote::after{
content: "";
float: center;
background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
opacity: 0.3;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 0;
}
.lightblock h1,
.lightblock h2,
.lightblock h3,
.lightblock h4,
.lightblock h5,
.lightblock h6,
.chrys-lightblock h1,
.chrys-lightblock h2,
.chrys-lightblock h3,
.chrys-lightblock h4,
.chrys-lightblock h5,
.chrys-lightblock h6,
.chrys-quote h1,
.chrys-quote h2,
.chrys-quote h3,
.chrys-quote h4,
.chrys-quote h5,
.chrys-quote h6,
.dia-lightblock h1,
.dia-lightblock h2,
.dia-lightblock h3,
.dia-lightblock h4,
.dia-lightblock h5,
.dia-lightblock h6,
.dia-quote h1,
.dia-quote h2,
.dia-quote h3,
.dia-quote h4,
.dia-quote h5,
.dia-quote h6,
.styled-quote h1,
.styled-quote h2,
.styled-quote h3,
.styled-quote h4,
.styled-quote h5,
.styled-quote h6 {
color: black;
}