/*
Twin Files Theme
[2022 Wikidot Theme]
by JackalRelated, translated by Pao Mian
*/
@import url('https://scp-wiki.wdfiles.com/local--files/theme:twin-files/stylesheet-alt.css');
@import url('https://fonts.googleapis.com/css2?family=Jost&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Archivo&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sedgwick+Ave&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Arimo&display=swap');
@import url(http://scpdsandbox.wikidot.com/local--files/pao-mian-s-font/DOSGothic.css);
:root {
--theme-base: "black-highlighter";
--theme-id: "twin-files";
--theme-name: "Twin Files";
--logo-image: url("http://scpdsandbox.wikidot.com/local--files/pao-mian-s-file/fiic-logo-wash-zh.png");
--header-title: "FIIC";
--header-subtitle: " ";
--body-font: 'Jost', sans-serif;
--header-font: 'Rubik', sans-serif;
--title-font: 'Archivo', sans-serif;
--mono-font: 'IBM Plex Mono', monospace;
--UI-font: var(--printer-paper-font);
--manila-tabs-font: 'Telegraphem', monospace;
--manila-body-font: 'Remington Noiseless', serif;
--blockquote-alt-font: var(--printer-paper-font);
--ticker-font: 'Nouveau IBM', monospace;
--printer-paper-font: 'Alte Haas Grotesk', sans-serif;
--handwriting-font: 'Sedgwick Ave', cursive;
--windows-font: 'Modern DOS 8x16', DOSGothic, sans-serif;
--logs-header-font: 'Commodore 64 Angled', sans-serif;
--logs-text-font: 'BabelSans', sans-serif;
--logs-dialogue-font: 'Arimo', sans-serif;
--logs-action-font: 'MoonGloss Display', sans-serif;
--header-height-on-desktop: 11.5rem;
--header-height-on-mobile: 11.5rem;
/* WHITE - GREY */
--win-white: 255, 255, 255;
--win-grey: 195, 195, 195;
--win-lborder: 237, 237, 237;
--win-border: 207, 207, 207;
--printer-paper: 245, 242, 235;
--believe-white: 215, 216, 217;
--grey-child: 205, 206, 208;
--papers-edge: 176, 176, 176;
--another-grey: 196, 196, 196;
--filing-cabinet: 193, 197, 201;
--white-lodge: 159, 160, 161;
--one-more-grey: 99, 99, 99;
--dark-track: 40, 42, 46;
--faded-type: 28, 28, 28;
--ink-blot: 10, 10, 10;
/* BLUE */
--dept-blue: 2, 4, 20;
--saucer-steel: 19, 21, 26;
--believe-grey: 25, 29, 43;
--einhander-gun: 78, 82, 92;
--fiic-blue: 16, 20, 105;
--fiic-grey: 119, 125, 140;
--cooper: 98, 112, 140;
--mulder: 69, 84, 115;
--skinner: 41, 51, 91;
--scully: 34, 40, 54;
/* BROWN */
--manila-folder: 217, 201, 160;
--manila-body: 224, 213, 186;
--manila-edge: 189, 169, 124;
--coffee-ring: 71, 39, 5;
--dead-wood: 43, 35, 25;
--light-desk: 26, 24, 21;
--dark-desk: 13, 12, 11;
--reyes: 224, 219, 195;
--doggett: 140, 119, 98;
/* GREEN */
--peaks-green: 0, 145, 9;
/* YELLOW */
--highlighter: 214, 184, 36;
--post-it: 230, 223, 131;
/* RED */
--red-room: 163, 0, 0;
/* THEME ASSIGNMENTS */
--white-monochrome: var(--filing-cabinet);
--pale-gray-monochrome: var(--reyes);
--light-gray-monochrome: var(--manila-edge);
--gray-monochrome: var(--ink-blot);
--dark-gray-monochrome: var(--filing-cabinet);
--black-monochrome: var(--printer-paper);
--pale-accent: var(--cooper);
--bright-accent: var(--doggett);
--medium-accent: var(--scully);
--dark-accent: var(--mulder);
--swatch-topmenu-bg-color: var(--einhander-gun);
--swatch-topmenu-border-color: var(--einhander-gun);
--swatch-text-light: var(--believe-white);
--swatch-text-dark: var(--ink-blot);
--swatch-text-general: var(--swatch-text-light);
--swatch-menubg-color: var(--filing-cabinet);
--swatch-menubg-medium-color: var(--papers-edge);
--swatch-menubg-medium-dark-color: var(--ink-blot);
--swatch-menutxt-light-color: var(--believe-white);
--swatch-menutxt-dark-color: var(--ink-blot);
--swatch-menutxt-general-color: var(--swatch-menutxt-dark-color);
--swatch-text-secondary-color: var(--ink-blot);
--swatch-text-tertiary-color: var(--believe-white);
--swatch-important-text: var(--bright-accent);
--swatch-background: var(--dark-desk);
--header-gradient-color-top: var(--saucer-steel);
--header-gradient-color-middle: var(--believe-grey);
--header-gradient-color-bottom: var(--saucer-steel);
--background-gradient-distance: 0rem;
--diagonal-stripes: linear-gradient(transparent 0);
--sidebar-transition-timing: 0.8s ease-in-out 0.1s;
--hover-link-color: var(--highlighter);
--newpage-color: var(--manila-folder);
--link-color: var(--manila-folder);
--visited-link-color: var(--grey-child);
--rating-module-bg-color: var(--einhander-gun);
--rating-module-button-plus-color: var(--peaks-green);
--rating-module-button-cancel-color: var(--scully);
--rating-module-bottom-border-color: var(--scully);
--rating-module-text-hover-color: var(--swatch-text-tertiary-color);
--toggle-button-bg: rgba(var(--ink-blot), 0);
--toggle-border-color: rgb(var(--printer-paper));
--toggle-icon-color: rgb(var(--believe-white));
--toggle-roundness: 0%;
--ui-button-bg: var(--another-grey);
--ui-button-txt: var(--ink-blot);
--ui-button-hover-bg: var(--skinner);
--ui-button-hover-outline: var(--scully);
--ui-button-hover-txt: var(--printer-paper);
}
#main-content {
--ui-icon-color: var(--dead-wood);
--ui-icon-bg: var(--papers-edge);
--ui-icon-hover-color: var(--printer-paper);
--ui-icon-hover-bg: var(--skinner);
}
#header {
--swatch-headerh1-color: var(--win-white);
--swatch-headerh2-color: var(--printer-paper);
--search-icon-color: var(--filing-cabinet);
--search-icon-hover-color: var(--believe-white);
--search-icon-hover-bg-color: var(--skinner);
--search-textbox-text-color: 0,0,0,0;
--login-mobile-icon-color: var(--filing-cabinet);
--login-mobile-icon-hover-color: var(--believe-white);
--login-mobile-icon-hover-bg-color: var(--skinner);
--search-icon-focus-color: var(--win-white);
--search-icon-focus-bg-color: var(--fiic-blue);
--search-focus-outline-color: var(--win-grey);
--search-focus-textbox-bg-color: var(--win-white);
--search-focus-textbox-text-color: var(--printer-paper);
--login-line-divider-color: var(--mulder);
--login-username-color: var(--filing-cabinet);
--login-myaccount-color: var(--filing-cabinet);
--login-myaccount-underline-color: var(--mulder);
--login-myaccount-hover-color: var(--believe-white);
--login-myaccount-hover-bg-color: var(--skinner);
--login-arrow-color: var(--filing-cabinet);
--login-dropdown-bg-color: var(--papers-edge);
--login-dropdown-bg-image: var(--papers-edge);
--login-dropdown-border-color: var(--win-border), 0.5;
--login-dropdown-text-color: var(--faded-type);
--login-dropdown-text-hover-color: var(--printer-paper);
--login-dropdown-bg-hover-color: var(--skinner);
}
/* HEADER AND TOPBAR */
#header h1 a {
text-shadow: none;
height: 100%;
width: 150%;
color: transparent;
background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/fiic-logo.png");
margin: 0;
margin-left: 3.3em;
padding: 0;
background-size: auto calc(var(--header-height-on-desktop) - 1rem);
background-repeat: no-repeat;
background-position: left center;
}
@media only screen and (max-width: 56.25rem) {
#header {
background-size: calc(var(--size) - 2rem), 100% var(--header-height-on-mobile);
background-position: calc(var(--header-height-on-mobile) - 0 - var(--size)) calc(((var(--size)*-1) + var(--header-height-on-mobile) + var(--y-offset))/2);
}
#header h1 a {
background-size: contain;
position: relative;
width: min(10em,65vw);
margin-left: 7.25em;
}
}
#header h1 a::before {
text-shadow: none;
color: transparent;
}
#header h2 {
display: none;
}
#extra-div-1 {
height: var(--header-height-on-desktop);
width: 100%;
position: absolute;
top: 0;
left: 0;
pointer-events: none;
background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/grid-bog.png");
background-size: calc(var(--header-height-on-desktop) * 0.5);
mix-blend-mode: overlay;
opacity: 0.2;
}
#top-bar {
--topmenu-category-color: var(--filing-cabinet);
--topmenu-category-hover-color: var(--printer-paper);
--topmenu-hover-border-color: var(--cooper);
--mobile-topmenu-sidebar-button-color: var(--printer-paper);
--dropdown-bg-color: var(--papers-edge);
--dropdown-border-color: var(--win-border);
--dropdown-links-color: var(--faded-type);
--dropdown-links-hover-color: var(---printer-paper);
--dropdown-links-hover-bg-color: var(--skinner);
}
/* BREADCRUMBS */
#breadcrumbs a:hover,
.pseudocrumbs a:hover,
#breadcrumbs a:active,
.pseudocrumbs a:active,
#breadcrumbs a:focus-within,
.pseudocrumbs a:focus-within {
color: rgb(var(--win-white));
text-decoration: none;
}
/* SCROLLBAR AND SIDEBAR */
html,body {
scrollbar-color:
rgb(var(--dark-track))
rgb(var(--fiic-grey));
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
width: 18px;
background: #transparent;
}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
background: rgb(var(--dark-track));
}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
background: rgb(var(--fiic-grey));
border: rgb(var(--fiic-grey)) 1px solid;
border-radius: 0px;
}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
background: rgb(var(--papers-edge));
}
#side-bar {
--sidebar-bg-color: var(--white-lodge);
--sidebar-resources-bg-color: var(--win-border), 0.25;
--sidebar-media-bg-color: var(--win-border), 0.25;
--sideblock-heading-border-color: var(--fiic-blue);
--sideblock-heading-bg-color: var(--fiic-blue);
--sideblock-heading-text-color: var(--printer-paper);
--sidebar-border-color: var(--dark-track), 0.08;
--sidebar-subtest-color: var(--swatch-primary);
--sidebar-links-text: var(--faded-type);
--sidebar-links-hover-bg-color: var(--skinner);
--sidebar-links-hover-text-color: var(--believe-white);
}
#side-bar .heading p,
#side-bar .side-block>.collapsible-block .collapsible-block-link {
font-size: 0.9em;
letter-spacing: .1em;
font-family: var(--logs-text-font);
margin-bottom: 0.25rem;
}
@media only screen and (max-width: 56.25rem) {
#side-bar .heading p,
#side-bar .side-block>.collapsible-block .collapsible-block-link {
margin-bottom: 0.3rem;
}
}
hr {
background-color: rgb(var(--filing-cabinet));
border-top: .0625rem solid rgb(var(--filing-cabinet));
}
.code {
background-color: rgb(var(--another-grey));
}
blockquote, div.blockquote {
border: .0625rem dashed rgba(var(--scully),1);
color: rgb(var(--faded-type));
--hover-link-color: var(--cooper);
--newpage-color: var(--scully);
--link-color: var(--scully);
--visited-link-color: var(--ink-blot);
}
.blockquote p a,
.blockquote p sup a,
.logs,
.windows {
--hover-link-color: var(--cooper);
--newpage-color: var(--scully);
--link-color: var(--scully);
--visited-link-color: var(--ink-blot);
}
blockquote hr, div.blockquote hr {
background-color: rgb(var(--faded-type));
border-top: .0625rem solid rgb(var(--faded-type));
}
.scp-image-block {
box-shadow: none;
border: none;
}
.scp-image-block .scp-image-caption {
border-top: .0625rem outset rgba(var(--win-border),1);
background-color: rgb(var(--skinner));
color: rgb(var(--printer-paper));
font-family: var(--printer-paper-font);
}
/* MAIN CONTENT */
.yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus {
filter: hue-rotate(0deg);
}
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
color: rgb(var(--ink-blot));
}
#main-content {
--tabs-bg: var(--manila-folder);
--tabs-txt: var(--ink-blot);
--tabs-hover-bg: var(--manila-edge);
--tabs-hover-txt: var(--dead-wood);
--tabs-selected-bg: var(--manila-edge);
--tabs-selected-txt: var(--ink-blot);
--tabs-selected-outline: var(--manila-edge);
--tabs-bottom-border-color: var(--manila-edge);
--tabs-content-bg-color: var(--manila-body);
--tabs-content-border-color: var(--manila-edge);
--tables-header-bg: var(--fiic-blue);
--tables-header-txt: var(--printer-paper);
--tables-border: var(--win-border);
--tables-body-txt: var(--ink-blot);
--tables-body-bg: var(--white-lodge);
--toc-directory-lines-color: var(--neon-blue);
--toc-header-bg-color: var(--passive-blue);
--toc-header-text-color: var(--lapd-badge);
--toc-header-text-hover-color: var(--neon-blue);
--toc-body-bg-color: var(--pkd-blaster);
--toc-body-link-color: var(--tears-n-rain);
--toc-body-link-hover-color: var(--neon-blue);
--toc-body-hover-arrow-color: var(--neon-blue);
--blockquote-bg-color: var(--win-border), 0.8;
--blockquote-colorbar-color: var(--fiic-blue), 1;
--footnotes-footer-colorbar-color: var(--doggett);
--footnotes-footer-title-bg-color: var(--doggett);
--footnotes-footer-title-text-color: var(--ink-blot);
--footnotes-footer-bg-color: var(--manila-body);
--footnotes-footer-num-color: var(--doggett);
--footnotes-footer-num-hover-color: var(--dark-desk);
--footnotes-footer-text-color: var(--faded-type);
--pagetags-title-bg: var(--skinner);
--pagetags-title-text: var(--believe-white);
--pagetags-text-color: var(--filing-cabinet);
--pagetags-text-hover-color: var(--dark-desk);
--pagetags-text-hover-bg-color: var(--highlighter);
}
#page-content div.b-tables table.wiki-content-table th,
#page-content table.wiki-content-table th {
font-family: var(--UI-font);
}
:root {
--hoverblock-header-bg: var(--doggett);
--hoverblock-header-txt: var(--ink-blot);
--hoverblock-footer-txt: var(--dark-desk);
--hoverblock-bg: var(--manila-body);
--hoverblock-txt: var(--faded-type);
--modal-bg: var(--white-lodge);
--modal-body-text: var(--ink-blot);
--modal-body-header-txt: var(--red-room);
--modal-header-bg: var(--skinner);
--modal-header-stripe: var(--fiic-blue);
--modal-header-txt: var(--printer-paper);
}
/* FOOTERS AND BELOW */
.page-source {
background: rgb(var(--win-grey));
color: rgb(var(--ink-blot));
}
#footer {
--footer-bg-color: var(--einhander-gun);
--footer-text-color: var(--filing-cabinet);
--footer-link-color: var(--filing-cabinet);
--footer-link-hover-color: var(--believe-white);
--footer-link-hover-bg-color: var(--cooper);
}
.bibitems .title, .footnotes-footer .title {
font-family: var(--manila-body-font);
}
.footnotes-footer .footnote-footer {
font-family: var(--UI-font);
}
#license-area {
--license-bg-color: var(--dark-desk);
--license-text-color: var(--believe-white);
--license-link-color: var(--printer-paper);
--license-link-hover-color: var(--ink-blot);
--license-link-hover-bg-color: var(--highlighter);
}
form#edit-page-form .wd-editor-toolbar-panel {
background-color: rgb(var(--win-grey));
}
/* TOGGLE SIDEBAR (BHL) CHANGES */
@supports((display: -ms-grid) or (display: grid)) {
@media only screen and (min-width: 769px) {
#main-content::before {
background: rgba(var(--saucer-steel), .55) 1px 1px repeat;
}
}
}
/* CUSTOM DIVS */
.headblock-tabs {
background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/manila-top.png");
background-repeat: no-repeat;
background-position: left center;
background-size: 100%;
height: 3em;
color: rgb(var(--faded-type));
font-family: var(--manila-tabs-font);
font-weight: bold;
font-size: 0.8em;
padding: 1em 0 0 1em;
margin: 0em;
}
@supports((display: -ms-grid) or (display: grid)) {
@media only screen and (max-width: 769px) {
.headblock-tabs {
background-size: 250%;
height: 1.9rem;
font-size: 1em;
padding: 1.5rem 0 0 1rem;
}
.headblock-tabs p{
margin: 0em;
}
}
}
.headblock {
background-color: rgb(var(--manila-folder));
background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/manila-texture.png");
background-repeat: repeat;
background-size: 100%;
background-blend-mode: multiply;
border: 2px solid white;
border-color: rgb(var(--manila-edge));
color: rgb(var(--faded-type));
font-family: var(--manila-body-font);
font-weight: 400;
font-size: 1.1em;
text-shadow: 0px 0 1px rgba(var(--faded-type), 0.5);
padding: 1em 0.5em 1em 1em;
}
.headblock p {
margin: 0em;
}
.genblock {
background-color: rgb(var(--printer-paper));
background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/paper-texture.png");
background-repeat: repeat;
background-size: 100%;
color: rgb(var(--ink-blot));
font-family: var(--printer-paper-font);
border: 1px solid white;
border-color: rgb(var(--papers-edge));
padding: 1.5em 1em 1.5em 1em;
}
.ticker {
padding: 10px 5px 1.1em 3.7em;
font-family: var(--ticker-font);
font-size: 110%;
font-weight: 400;
color: #000;
background: repeat-y url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/tickerback.png");
background-position: center top;
background-size: 100%;
border: 2px solid #D8D6CA;
border-style: dashed solid dashed;
border-width: medium 2px 0px;
}
.windows p,
.windows-box p,
.windows-slimbox p,
.windows-button p,
.windows-bar p {
margin: 0em;
}
.windows-bar {
background-color: rgb(var(--fiic-blue));
color: rgb(var(--printer-paper));
font-family: var(--windows-font);
font-size: 16px;
border: 3px outset rgb(207, 207, 207);
border-bottom: 0px;
margin: 0em;
padding: 0.25em 0px 0px 0.5em;
}
.windows {
background-color: rgb(var(--win-grey));
color: rgb(var(--faded-type));
font-family: var(--windows-font);
font-size: 16px;
border: 3px outset rgb(var(--win-border));
border-top: 0px;
padding: 0.3em 0.75em 0.2em 0.75em;
}
.windows hr {
height: 0.125rem;
margin: 0.3em 0px;
border-top: 0px;
background-color: rgb(var(--white-lodge));
}
.windows-box {
background-color: rgb(var(--win-white));
border: 3px inset rgb(var(--win-lborder));
padding: 0.5em;
margin: 0.3em 0px 0.3em 0px;
}
.windows-slimbox {
background-color: rgb(var(--win-white));
border: 2px inset rgb(var(--win-lborder));
color: rgb(var(--ink-blot));
padding: 0.15em;
}
.windows-button {
background-color: rgb(var(--win-grey));
border: 3px outset rgb(var(--win-border));
padding: 0.3em;
}
.logs p,
.logs-header p,
table.dialog p {
margin: 0em;
}
.logs {
padding: 0px 0px 0.5em 0px;
margin: auto;
width: 95%;
background-color: rgb(var(--win-grey));
border: 3px outset rgb(var(--win-border));
color: rgb(var(--one-more-grey));
font-family: var(--logs-text-font);
}
.logs-header {
padding: 0.5em 0px 0.5em 0px;
text-align: center;
font-size: 1.5em;
background-color: rgb(var(--skinner));
color: rgb(var(--believe-white));
font-family: var(--logs-header-font);
}
.logs hr {
background-color: rgb(var(--ink-blot));
}
table.dialog {
border-collapse: collapse;
font-family: var(--logs-text-font);
}
table.dialog th {
border-right: 1px solid rgb(var(--ink-blot));
color: rgb(var(--ink-blot));
padding: 1em 1em 0em 1em;
}
table.dialog td {
padding: 1em 0em 0em 1em;
font-family: var(--logs-action-font);
}
table.dialog td.active {
color: rgb(var(--ink-blot));
font-family: var(--logs-dialogue-font);
}
.blockquote-alt {
margin: .5em 1.25rem;
padding: .825em 1.25em;
border: .0625rem dashed rgba(var(--doggett), 1);
background-color: rgba(var(--manila-body), 0.9);
color: rgb(var(--dark-desk));
font-weight: 400;
font-family: var(--blockquote-alt-font);
--hover-link-color: var(--coffee-ring);
--newpage-color: var(--dead-wood);
--link-color: var(--dead-wood);
--visited-link-color: var(--light-desk);
}
.blockquote-alt hr {
background-color: rgb(var(--manila-edge));
border-top: .0625rem solid rgb(var(--manila-edge));
}
.post-it-note {
width: 50%;
min-height: 20em;
border: 2px solid rgba(var(--highlighter), 0.9);
margin: auto;
padding: 1em;
background-color: rgb(var(--post-it));
color: rgb(var(--ink-blot));
font-family: var(--handwriting-font);
font-weight: bold;
}