Basalt Theme

BASALT THEME

VERSION 1.5

● WAS IST DAS HIER?

BASALT ist ästhetisches Theme, das weder mit einem Kanon, einer Serie, noch GoI in Verbindung steht und von Liryn sowie Placeholder McD als eine Erweiterung des Paperstack Theme von EstrellaYoshte entwickelt wurde.

Ähnlich wie Black Highlighter überarbeitet BASALT einen großen Anteil vom Aussehen einer Seite und ändert viele UI-Elemente, welche in den meisten Themes beschönigt werden, um Produktivität und Benutzerfreundlichkeit zu verbessern. Nebenbei sieht es auch toll aus.

Um BASALT zu benutzen, füge den folgenden Code in deinen Artikel ein:

[[include :scp-wiki-de:theme:basalt]]

● THEME-EINSTELLUNGEN

Theme-Einstellungen, manchmal auch als Variablen betitelt, sind zusätzliche Textstücke, die ein User dem include-Modul von BASALT hinzufügen kann, um bestimmte Features entweder hinzuzufügen oder zu entfernen.

Um solch eine Einstellung vorzunehmen, füge eines unten dargestellten Beispiele nach dem primären include ein, aber vor den zwei Klammern am Ende, so in etwa:

[[include :scp-wiki-de:theme:basalt themesetting=a]]

Theme-Einstellungen können einfach miteinander kombiniert werden. Um mehrere auf einmal zu benutzen, folge dem folgenden Formatierungen:

[[include :scp-wiki-de:theme:basalt firstthemesetting=a|secondthemesetting=a|thirdthemesetting=a]]

LISTE DER THEME-EINSTELLUNGEN (STAND VERSION 1.0)

hidetitle=a

Entfernt den Titel einer Seite.

acsanimation=a

Deaktiviert die Animation des AKS-Komponenten, welcher im Normalfall akiv ist.

darkmode=a

Aktiviert den Dark-Mode. (Siehe: ONYX (Dark-Mode)

redmode=a

Aktiviert Red-Mdoe. Für eine vernünftige Funktionsweise ist der Dark-Mode NÖTIG. Siehe. GARNET (Red-Mode)

darksidebar=a

Setzt das Aussehen der Sidebar vom Dark-Mode für Light-Mode Artikel ein.

● ANPASSUNGEN

TITEL/UNTERTITEL/LOGO ÄNDERN

Wenn du den Titel, Untertitel, und/oder das Logo auf der Kopfzeile ändern möchtest, verwende den folgenden Code:

:root {
--logo: url(<Bild-link hierhin>);
--title: "<title Text hier>";
--subtitle: "<Untertiteltext hier>";
}

Es wird empfohlen, den Inhalt von --title ungefähr genauso lang wie den Standardtext zu machen (oder kürzer), um Probleme auf Mobilgeräten vorzubeugen.

Standardmäßig ist das Logo und der Text der Seitenleiste genauso wie der der Kopfzeile. Falls du das ändern möchtest, benutze den folgenden Code:

:root {
--sidelogo: url(<Bild-link hierhin>);
--sidesubtitle: "<Text hier>";
}

ONYX (DARK MODE)

[[iftags -]]

[[/iftags]]

[[iftags ]]

[[/iftags]]

ONYX

Wie zuvor erwähnt ,um Dark-Mode zu aktivieren, benutze die folgende Theme-Einstellung:

[[include :scp-wiki:theme:basalt darkmode=a]]

GARNET (RED MODE)

[[iftags -]]

[[/iftags]]

[[iftags ]]

[[/iftags]]

GARNET

Wie zuvor erwähnt ,um Red-Mode zu aktivieren, benutze die folgende Theme-Einstellung:

[[include :scp-wiki:theme:basalt darkmode=a|redmode=a]]

● ENTHALTEN BEI BASALT

COMPONENTS

BASALT kommt mit vielen fertig verpackten Komponenten aus der Community:

… und macht einige visuelle Änderungen an diesen vor, solltest du sie einfügen:

Info Ayers von Ayers
Anomaly Class Bar by Woedenaz

THEMES

BASALT klaut borgt Elemente von:

Minimal Theme von stormbreath
BLANKSTYLE CSS von Placeholder McD & HarryBlank
PLACESTYLE CSS von Placeholder McD
Simple Yonder Theme von EstrellaYoshte

BEISPIELE

[[iftags -]]

[[/iftags]]

[[iftags ]]

[[/iftags]]

Bild Block

Eine horizontale Linie kann durch 4 Bindestriche "----" erzeugt werden und erstreckt sich über die ganze Seite, falls es nicht in irgendwas platziert wurde (z.B. ein blockquote). Die Linien, welche Teile dieses Dokuments seprieren, sind horizontale Linien.

Diesen Link hast du sicher schonmal besucht

Titel können geschaffen werden, indem du zwischen einem und sechs "+" Symbole am Anfang jeder Linie steckst.

+ Titles

Dies ist ein großer Text span. Benutze [[span class="bigtext"]] ,um die zu erschaffen.

Dies ist ein spezielles Text span. Benutze [[span class="st"]] ,um die zu erschaffen.
Spezielle Text span's ändern ihre Farbe, wenn sie in gefärbte Tabellen divs platziert werden, wie unten einsehbar ist. ^{Das ist für dich, Placeholder.}

Warum war der Zug so besonders?

Weil er eine bahnbrechende Erfindung war.

Dies ist ein Blockquote, der gemacht werden kann, indem man ">" vor jede Zeile steckt.
Mehr Text

Das ist eine horizontale Linie

Verschachtelte Blockquotes

Dies ist eine reguläre Tabelle
Text hierhin

Tabellen werden gefärbt, indem man sie in spezielle divs hüllt. Bildblöcke und spans speziellen Textes , welche in diese divs verpackt sind, werden ihre Farbe auch entsprechend ändern.

[[div class="table1"]]

Dies ist eine grüne Tabelle
Text hierhin

[[div class="table2"]]

Dies ist eine blaue Tabelle
Text hierhin

[[div class="table3"]]

Dies ist eine gelbe Tabelle
Text hierhin

[[div class="table4"]]

Dies ist eine orange Tabelle
Text hierhin

[[div class="table5"]]

Dies ist eine rote Tabelle
Text hierhin

[[div class="table6"]]

Dies ist eine violette Tabelle
Text hierhin

Du kannst auch das folgende div verwenden, um gebrochene Tabellen zu erzeugen.

[[div class="tableb"]]

Dies ist eine gebrochene Tabelle
Text hierhin

Dies ist ein Dokument div. Benutze [[div class="document"]], um diese zu erzeugen. Es wird empfolen, diese nicht in anderen divs zu verwenden.

Dies ist ein dunkles Dokument div. Benutze [[div class="darkdocument"]], um es zu erzeugen. Es wird empfolen, diese nicht in anderen divs zu verwenden.

Dies ist ein Mitteilung von RAISA div. Benutze [[div class="raisa_memo"]], um es zu erzeugen.

+ Zeige weitere Notiz/Anmerkungs divs

Dies ist ein dekoratives div. Benutze [[div class="notation"]], um es zu erzeugen.

Dies ist ein dünneres, modale div! Benutze [[div class="smallmodal"]], um es zu erzeugen.

Dies ist ein drittes dekoratives div! Benutze [[div class="jotting"]], um es zu erzeugen.

Dies ist ein viertes dekoratives div! Benutze [[div class="transcript"]], um es zu erzeugen.

Dies ist ein fünftes dekoratives div! Benutze [[div class="papernote"]], um es zu erzeugen.

Die Font vom Körper ist Inter.
Die Font der Kopfzeile und des Titels ist Work Sans.
Die Font vom Monospace ist Fira Code.

+ Quelltext anzeigen

- Schließen

Normal text begins here.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent dapibus neque dapibus ullamcorper facilisis. Sed et porta arcu, a vestibulum ligula. Nam auctor, arcu vel fringilla lobortis, ipsum ante malesuada turpis, vitae dapibus mi risus non diam. Fusce aliquam feugiat mauris, a consectetur justo dignissim vitae.

Duis eleifend justo eu orci placerat, at bibendum felis aliquam. Integer eu dapibus dui. Praesent viverra dolor vitae commodo hendrerit. Suspendisse aliquam mattis neque et vulputate. Sed nisl risus, vehicula eu nunc vel, lobortis iaculis ex. Nullam sollicitudin, nunc scelerisque euismod dignissim, leo erat iaculis lorem, sit amet interdum nulla justo luctus nibh. Aliquam tincidunt, risus eget sagittis posuere, augue est malesuada magna, non rutrum justo magna nec nunc.

Mauris nisi turpis, feugiat sed semper vitae, scelerisque et libero. Vivamus ex massa, placerat ut lorem nec, mollis tempor risus. Morbi eget leo dui. Duis sit amet massa vel magna euismod commodo. Vestibulum sit amet pretium eros. Duis pretium suscipit nunc, id dignissim orci laoreet sodales. Duis non vehicula dolor. Nulla at mi ut ante gravida vehicula.

This is an aesthetic, component:sigma-plus theme made by EstrellaYoshte and inspired by the interface seen in Containment Breach.

To use this theme, put the following text at the start:

[[include :scp-wiki:theme:paperstack]]
[[div class="logo"]]
[[image https://scp-wiki.wdfiles.com/local--files/theme%3Apaperstack/lgtrans.png]]
[[/div]]

[[>]]
[[module Rate]]
[[/>]]

[[div class="header-container-ex"]]
[[include component:image-block name=(IMAGE-HERE)|caption=(CAPTION HERE)|width=300px|align=right]]
[[div class="header-info"]]
[[div class="header-info-flex"]]
[[div class="text-item"]]
[[size 90%]]##grey|**ITEM #:**##[[/size]]

[[size 220%]]**9999**[[/size]]
[[/div]]

[[div class="text-item"]]
[[size 90%]]##grey|**CONTAINMENT CLASS:**##[[/size]]

[[size 220%]]**THEME-IEL**[[/size]]
[[/div]]
[[/div]]
[[/div]]
[[/div]]
Normal text begins here.

Alternatively, fewer or more text-item div can be used and the image block omitted.

[[include :scp-wiki:theme:paperstack]]
[[div class="logo"]]
[[image https://scp-wiki.wdfiles.com/local--files/theme%3Apaperstack/lgtrans.png]]
[[/div]]

[[>]]
[[module Rate]]
[[/>]]

[[div class="header-container-ex"]]
[[div class="header-info"]]
[[div class="header-info-flex"]]
[[div class="text-item"]]
YOUR TEXT HERE
[[/div]]
[[/div]]
[[/div]]
[[/div]]

This is a tab view.

This is a blockquote, created by putting "> " at the start of each line.
More text

That's a horizontal rule

Nested blockquotes

This is a	table
You should know	how to make these
already

The header font is Josefin Sans.

The body font is IBM Plex Sans.

The monospace font is Fira Code.

Source Code

/*
    Paperstack Theme
    [2020 -2023 Wikidot Theme]
    By EstrellaYoshte
    Based on:
      Inkblot Theme by Croquembouche
      Word Processor Theme by stormbreath
      Modern Theme by Azamo
      Simple Yonder Theme by EstrellaYoshte
*/
 
@import url('https://api.fonts.coollabs.io/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,600;1,400;1,600&display=swap');
@import url(https://api.fonts.coollabs.io/css2?family=Fira+Code&display=swap);
 
@font-face {
    font-family: 'Josefin Sans';
    src: url(https://cdn.jsdelivr.net/gh/SYwaves/Webfont-Archive@master/Josefin-Sans.woff2) format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Josefin Sans';
    src: url(https://cdn.jsdelivr.net/gh/SYwaves/Webfont-Archive@master/Josefin-Sans-Italic.woff2) format("woff2");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Josefin Sans';
    src: url(https://cdn.jsdelivr.net/gh/SYwaves/Webfont-Archive@master/Josefin-Sans-Bold.woff2) format("woff2");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Josefin Sans';
    src: url(https://cdn.jsdelivr.net/gh/SYwaves/Webfont-Archive@master/Josefin-Sans-Bold-Italic.woff2) format("woff2");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}
 
:root {
    --header-title: "SCP FOUNDATION";
    --header-subtitle: "SECURE - CONTAIN - PROTECT";
 
    --sp_header-title-scale: 1.35;
    --sp_header-subtitle-scale: 1.15;
 
    --top-layer-color: #EFEFEF;
    --paper-ink-color: #333;
    --paper-faded-color: #808080;
    --paper-background-color: #FFF;
    --paper-block-color: #F7F7F7;
    --paper-shadow-color: #0005;
    --top-layer-height-offset: 0em;
    --top-layer-height: calc(var(--sp_final-header-height) + 8.325rem + var(--top-layer-height-offset));
    --top-layer-shadow: 0.375rem;
 
    --sp_header-height: 8.5rem;
    --sp_top-bar-height: 1.5rem;
    --sp_header-logo-size: 0rem;
    --sp_top-bar-link-color: var(--paper-faded-color);
 
    --sp_rate-module-text-color: var(--paper-ink-color);
    --sp_rate-module-background: var(--paper-background-color);
    --sp_rate-module-sub-color: var(--sp_rate-module-text-color);
    --sp_rate-module-active-color: var(--paper-faded-color);
    --sp_rate-module-button-color: var(--sp_rate-module-text-color);
    --sp_rate-module-button-background: var(--sp_rate-module-background);
    --sp_rate-module-button-hover-color: var(--sp_rate-module-background);
    --sp_rate-module-button-hover-background: var(--sp_rate-module-text-color);
 
    --sp_tab-text-color: var(--paper-ink-color);
    --sp_tab-background: var(--paper-block-color);
    --sp_tab-hover-text-color: var(--paper-block-color);
    --sp_tab-hover-background: var(--paper-ink-color);
    --sp_tab-selected-text-color: var(--sp_tab-hover-text-color);
    --sp_tab-selected-background: var(--sp_tab-hover-background);
 
    --sp_hovertip-background: var(--paper-background-color);
    --sp_hovertip-border: none;
}
 
body {
    color: #000;
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 0.925rem;
    background-color: var(--paper-background-color);
    background-image:
        linear-gradient( to bottom,
            var(--top-layer-color), var(--top-layer-color) var(--top-layer-height),
            #00000028 calc(var(--top-layer-height) + 1px),
            transparent calc(var(--top-layer-height) + var(--top-layer-shadow) + 1px)
         );
    background-repeat: no-repeat;
}
 
.page-source, .code pre, .code p, .code, tt {
    font-family: "Fira Code", monospace;
}
.page-source, .code, tt { font-size: 0.9625em; }
 
#content-wrap { margin-top: 0.25rem; }
 
#header {
    grid-template-rows: auto 1fr auto auto .625rem auto;
    background: none;
}
#header::before { all: unset; }
 
#header h1, #header h2 {
    text-align: center;
    grid-column: 2/4;
}
#header h1 a, #header h2 span {
    max-width: 100%;
    text-shadow: none;
    color: var(--paper-ink-color);
    font-weight: 700;
    font-family: "Josefin Sans", sans-serif;
    line-height: 0.825;
}
 
#search-top-box {
    grid-row: 2/3;
    padding-block: 0.375rem;
}
 
#top-bar { background: none; }
 
#top-bar div[class*="top-bar"] > ul {
    justify-content: center;
}
 
#page-title {
    display: none;
}
 
#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: none;
    background: var(--paper-ink-color);
    box-shadow: none;
    border-radius: 0px;
    color: var(--paper-block-color);
}
 
#login-status, #login-status a {
    color: var(--paper-ink-color);
}
 
/* ---- SIDE BAR ---- */
 
:is(#side-bar, #interwiki) .side-block {
    border: transparent;
    border-radius: 0;
    box-shadow: 0px 0px 0.325rem var(--paper-shadow-color);
    background-color: #ffffff;
}
#interwiki body { background-image: none; }
 
#side-bar .side-block.media > * {
    display: flex;
    justify-content: space-evenly;
}
 
#top-bar div.open-menu a {
    color: var(--paper-faded-color);
    background: var(--paper-background-color);
    box-shadow: 0 0 .325rem var(--paper-shadow-color);
    border-radius: 0;
    border: solid .125rem var(--paper-background-color);
}
 
#breadcrumbs {
    margin: -1em 0 -0.75em;
    font-size: 0.875em;
}
 
/* ---- INFO BAR ---- */
 body{
     --barColour: var(--paper-ink-color);
}
 
 .info-container .collapsible-block-content{
     padding: 0 .5em 30px;
}
 .info-container .collapsible-block-content .wiki-content-table {
     width: 100%;
}
 
/* ---- RATE MODULE ---- */
 
div.page-rate-widget-box, div.rate-box-with-credit-button {
    border-radius: 0;
    padding: .125em;
    box-shadow: 0 0 0.325rem var(--paper-shadow-color);
}
 
.creditRate, div.page-rate-widget-box { margin-bottom: 0.125rem; }
 
div.creditButton p a { border: none; }
div.creditButton p a:is(:hover,:focus) { background-color: var(--paper-ink-color); }
 
/* ---- PAGE ELEMENTS ---- */
 
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--paper-ink-color);
    font-family: 'Josefin Sans', sans-serif;
    font-weight: bold;
}
 
blockquote,
div.blockquote,
#toc,
.code {
    background-color: var(--paper-block-color);
    border: solid .05rem var(--paper-block-color);
    box-shadow: 0 0 .25rem var(--paper-shadow-color);
}
 
.scp-image-block {
    border: solid .5rem var(--paper-background-color);
    box-shadow: 0 0 .5rem var(--paper-shadow-color);
    box-sizing: border-box;
}
.scp-image-block .scp-image-caption {
    background-color: var(--paper-background-color);
    border-top: none;
    padding: 0;
    padding-top: .375rem;
}
 
#page-content .wiki-content-table tr th {
    border: solid .05rem var(--paper-faded-color);
    background-color: var(--paper-block-color);
    /* set border for table title */
}
#page-content .wiki-content-table tr td {
      border: solid .05rem var(--paper-faded-color);
    /* set border for table content */
}
 
div.modalbox {
    border-radius: 0;
    border: none;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
}
 
/*-- tags --*/
#main-content .page-tags > span { padding-block-start: 0.325rem; }
 
#main-content .page-tags a {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.95em;
    background-color: #FDFDFD;
    border-radius: 0.5rem 0;
    padding: 0.175rem 0.375rem;
    box-shadow: 0.075em 0.075em 0.325em 0 var(--paper-shadow-color);
}
#main-content .page-tags a::before {
    content: "";
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
    background-color: var(--paper-background-color);
    box-shadow: inset 0.075em 0.075em 0.1em 0 var(--paper-shadow-color);
}
 
/* ---- FOOTNOTES ---- */
.hovertip {
    box-shadow: 0px 0px 0.25rem var(--paper-shadow-color);
}
 
/* ---- TABS ---- */
.yui-navset .yui-nav { border-color: var(--paper-ink-color); }
 
.yui-navset.yui-navset-top .yui-nav li {
    flex-grow: 1;
}
.yui-navset.yui-navset-top .yui-nav li a {
    border-width: 0;
}
 
.yui-navset .yui-content {
    padding: .5rem;
    border: none;
    background-color: var(--paper-background-color);
    box-shadow: 0 0 0.25rem var(--paper-shadow-color);
}
 
/* ---- BOTTOM AREA ---- */
 
#footer {
    color: var(--paper-faded-color);
    background: transparent;
}
#footer a { color: var(--paper-ink-color); }
 
#license-area {
    background-color:  var(--paper-block-color);
    background-image:
        linear-gradient( to bottom,
            #00000028 0%,
            transparent var(--top-layer-shadow)
         );
    padding-block: .675rem;
}
 
#footer-bar {
    background-color:  var(--paper-block-color);
}
 
/* ---- CUSTOM SYNTAX ---- */
 
.logo {
    position: absolute;
    width: 10.5rem;
    inset-block-start: calc(var(--sp_final-header-height)*-1 - 0.5rem);
    inset-inline-start: -14.325rem;
    z-index: -1;
    pointer-events: none;
}
@media (max-width: 767px) {
  .logo {
    width: max(36%, 10.5rem);
    inset-block-start: calc(var(--top-layer-height)*-0.5 - 0.5rem);
    inset-inline-start: 50%;
    transform: translateX(-50%);
  }
}
 
.header-container-ex {
    padding-top: 0.5em;
    clear: both;
}
.header-container-ex .scp-image-block {
    margin: 0 0 0.5rem 1.875rem;
    width: min(42.5%, 300px)!important;
}
.header-container-ex .header-info {
    display: flow-root;
    margin-bottom: 1.75em;
}
.header-container-ex .header-info .header-info-flex {
    display: flex;
}
.text-item {
  flex-grow: 1;
  text-align: center;
}
.text-item p {
    margin-block: 0.425em;
}
 
@media (max-width: 960px) and (min-width: 767px), (max-width: 580px) {
    .header-container-ex {
        display: flex;
        flex-direction: column;
    }
    .header-container-ex .header-info {
        order: -1;
    }
    .header-container-ex .scp-image-block {
        width: calc(275px + 5vw)!important;
        margin: -1.25em auto 0.5em;
    }
}
 
/* ---- MOBILE QUERY ---- */
 
@media (max-width: 767px) {
    #side-bar { background-color: var(--top-layer-color); }
 
    #page-content > hr, #page-content > .list-pages-box > .list-pages-item > hr {
        margin: 2.5em -1.25rem;
    }
}
 
/*--- deprecated, kept for legacy purpose ---*/
.header-container {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  justify-content: space-around;
  align-content: space-between;
  width: 100%;
  left: 0;
  align-items: flex-start;
  row-gap: 2px;
}
.grid-item {
  flex-grow: 1;
  min-width: 25%;
  text-align: center;
  margin: 8px 6px;
}
@media (max-width: 1200px) {
  .grid-item {
    min-width: 50%;
  }
}
.textbox {
  position: absolute;
  width: 42%;
  top: 7.5rem;
}
@media (max-width: 960px) and (min-width: 767px), (max-width: 666px) {
  .textbox {
    position: relative;
    width: 100%;
    top: 0;
  }
}

/*
 
    BASALT Theme
    [2021 Wikidot Theme]
    By Liryn & Placeholder McD
 
    Based on:
 
    Paperstack Theme by EstrellaYoshte
    Minimal Theme by Stormbreath
    BLANKSTYLE CSS by Placeholder McD & HarryBlank
    PLACESTYLE CSS by Placeholder McD
    Simple Yonder Theme by EstrellaYoshte
 
    Tab animation by Croquembouche
 
*/
 
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
 
/* MAIN */
 
/* ======================= */
 
:root {
    --title: " SCP FOUNDATION";
    --subtitle: " SICHERN • EINDÄMMEN • SCHÜTZEN";
    --barColour: rgb(20, 20, 20);
    --fnColor: rgb(15, 15, 15);
    --fnLinger: 1s;
    --logo: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/basalt_logotype_black.png);
    --sidelogo: var(--logo);
    --sidesubtitle: var(--subtitle);
    --utilcolor: #FFF;
    --antiutilcolor: rgb(20, 20, 20);
}
 
body {
    background: rgb(255, 255, 255);
    font-family: 'Inter', sans-serif;
}
 
#main-content {
    top: -2.8rem;
}
 
#container-wrap-wrap {
    overflow-x: hidden;
}
 
/* ======================= */
 
/* HEADER & TOPBAR */
 
/* ======================= */
 
#extra-div-1 {
    z-index: 9;
    position: fixed;
    top: 0;
    left: 0;
    width: 1000vw;
    height: 5rem;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    background: white;
}
 
#extra-div-2 {
    z-index: 9;
    position: fixed;
    top: 0;
    left: 0;
    width: 1000vw;
    height: 5rem;
}
 
#extra-div-1::before {
    content: var(--title);
    position: fixed;
    left: 8.5rem;
    top: 0.7rem;
    color: black;
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 27.45px;
    animation: slideLeft 1s;
    transition-duration: 0.3s;
    transition-property: transform;
    transform: translateZ(0);
}
 
#extra-div-2::before {
    content: var(--subtitle);
    position: fixed;
    font-size: 1.22em;
    left: 8.5rem;
    top: 2.5rem;
    color: #272842;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    animation: slideLeft 1s;
}
 
#u-header-link {
    display: block;
    position: fixed;
    top: 0.6rem;
    left: 8.3rem;
    height: 3.5rem;
    width: 15.7rem;
    z-index: 21;
}
 
.logo {
    z-index: 10;
    position: fixed;
    width: 4.5rem;
    height: 4.5rem;
    top: 0.2rem;
    left: 3.6rem;
    transition-duration: 0.3s;
    transition-property: transform;
    transform: translateZ(0);
    animation: slideLeft 1s;
    background-image: var(--logo);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
 
.logo:hover {
    transform: rotate(348deg);
}
 
#header {
    height: 5rem;
}
 
#header h1,
#header h2 {
    display: none;
}
 
#top-bar {
    position: fixed;
    align-items: stretch;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    text-transform: uppercase;
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    animation: slideLeft 1s;
    top: 1.7rem;
    max-width: 50rem;
    min-width: 8rem;
    font-size: 90%;
    font-weight: 800;
    left: 25.4rem;
}
 
#top-bar div.open-menu a {
    display: none;
}
 
#top-bar ul {
    float: left;
}
 
#top-bar ul li ul {
    border: none;
}
 
#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
    background-color: #F4F4F4;
}
 
#top-bar ul li>a {
    border: none;
}
 
#top-bar a {
    filter: grayscale(100%) saturate(0%);
    -webkit-filter: grayscale(100%) saturate(0%);
}
 
#top-bar ul li.sfhover a:hover,
#top-bar ul li:hover a:hover {
    background: #F4F4F4;
}
 
#top-bar ul li.sfhover a,
#top-bar ul li:hover a {
    border: none;
}
 
#top-bar ul li>a {
    transition-duration: 0.3s;
    transition-property: transform;
    transform: translateZ(0);
}
 
#top-bar ul li>a:hover {
    transform: translate(0px, -3px);
    border: none;
}
 
#top-bar ul li ul li>a:hover {
    animation: none;
}
 
@keyframes translateTop {
    0% {
     opacity: 1;
    }
    100% {
     transform: translate(0px, -3px);
    }
}
 
@keyframes slideLeft {
    0% {
     transform: translate(-200px, 0px);
     opacity: 0;
    }
    100% {
     opacity: 1;
    }
}
 
@keyframes tilt {
    0% {
     opacity: 1;
    }
    100% {
     transform: rotate(360deg);
    }
}
 
#login-status {
    position: fixed;
    top: 0.65rem;
    right: 2rem;
    width: fit-content;
    font-size: 0.78em;
    text-align: center;
    color: transparent;
}
 
#login-status > a > strong {
    margin-right: 0.7rem;
    font-size: 0.7rem;
}
 
#login-status > span {
    color: #333;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
}
 
#login-status span.printuser img {
    font-size: 0;
    transform: translate(6px, 5px);
}
 
#login-status a#my-account {
    display: none;
}
 
#account-topbutton {
    border: none;
    margin-left: -0.25rem;
}
 
div#search-top-box {
    width: 2rem;
    position: fixed;
    top: 0.76rem;
    right: 0.2rem;
    z-index: 21;
}
 
#search-top-box-input {
    display: none;
}
 
#search-top-box-form>input[type=submit],
#search-top-box-form>input[type=submit]:hover,
#search-top-box-form>input[type=submit]:focus,
#search-top-box-form>input[type=submit]:target {
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E") 50%/0.8rem no-repeat, #000 !important;
    border: none;
    border-radius: 30%;
    font-size: 0;
    height: 1.2rem;
    width: 1.2rem;
    margin-top: 0.2rem;
}
 
.mobile-top-bar {
    left: unset;
}
 
/* ======================= */
 
/* SIDEBAR */
 
/* ======================= */
 
#u-sb-button {
    display: block;
    position: fixed;
    top: 0.5rem;
    left: 0.9rem;
    height: 4rem;
    width: 45px;
    color: black;
    font-family: 'Work Sans', sans-serif;
    font-weight: 300;
    font-size: 2.5rem;
    text-decoration: none !important;
    z-index: 21;
    transition-duration: 0.3s;
    transition-property: transform;
    transform: translateZ(0);
    animation: slideLeft 1s;
}
 
#u-sb-button:hover {
    font-weight: 900;
}
 
#side-bar {
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    background: linear-gradient( 0deg, rgba(255, 255, 255, 1) 87%, rgba(250, 250, 250, 1) 100%);
    text-transform: uppercase;
    font-family: 'Work Sans', sans-serif;
    font-weight: 400 !important;
    overflow-x: hidden;
}
 
#side-bar::before {
    content: var(--sidesubtitle);
    background: var(--sidelogo);
    background-size: 4.5rem;
    background-repeat: no-repeat;
    background-position: top center;
    padding-bottom: 0.3rem;
    padding-top: 4.7rem;
    display: inline-block;
    border-bottom: double 5px black;
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
    text-transform: none;
}
 
#side-bar,
#side-bar:target {
    z-index: 22;
}
 
#side-bar a {
    color: black;
}
 
#side-bar a:visited {
    color: black;
}
 
#side-bar img,
iframe.scpnet-interwiki-frame {
    filter: grayscale(100%) saturate(0%);
    -webkit-filter: grayscale(100%) saturate(0%);
}
 
#side-bar .side-block {
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 100%);
    border-color: transparent;
    border-radius: 0px;
}
 
#side-bar .side-block.media {
    background-color: white;
    border-bottom: solid 2px rgb(190, 190, 190);
    border-top: solid 2px rgb(190, 190, 190);
    margin-top: 1rem;
}
 
#side-bar .heading {
    color: black;
    border-bottom: solid 1px black;
    text-transform: uppercase;
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
}
 
#side-bar .collapsible-block-folded {
    background-image: url(https://scp-wiki.wdfiles.com/local--files/theme%3Aminimal/expand.png);
}
 
#side-bar .collapsible-block-unfolded-link {
    border-bottom: solid 1px black;
}
 
#side-bar .collapsible-block-unfolded-link .collapsible-block-link,
#side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover {
    color: black;
}
 
/* ======================= */
 
/* TABS */
 
/* ======================= */
 
ul.yui-nav a {
    font-family: 'Work Sans', sans-serif;
    padding: 3.5px;
    color: white;
    font-weight: 600;
}
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected,
.yui-navset .yui-nav a:hover,
yui-navset .yui-nav a:active {
    color: white;
    background-color: black;
}
 
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    border: none;
    border-bottom: dotted 1px grey;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}
 
.yui-navset .yui-content>div {
    display: block;
    top: 0;
    overflow: hidden;
    transform-origin: 0 0;
}
 
.yui-navset-top a {
    transition-property: background, background-color;
    transition-duration: 0.2s;
}
 
/* Tab animation by Croquembouche */
/*---------------------------------------------*/
 
#page-content .yui-navset .yui-content>div[style*="none"] {
    display: block !important;
    flex: 0;
    max-height: 0;
    padding: 0 0.5em;
    border-width: 0;
    /* The following transition affects the one that DISAPPEARS */
    transition: padding 0s linear 0.5s, border-width 0s linear 0.5s, flex 0.5s cubic-bezier(.18, .51, .54, .9) 0s;
    animation: tab-disappear 0.5s ease-in-out 0s 1 both;
}
 
#page-content .yui-navset .yui-content>div[style*="block"] {
    display: block !important;
    flex: 1;
    max-height: 9999rem;
    /* The following transition affects the one that APPEARS */
    transition: padding 0s linear 0.5s, border-width 0s linear 0.5s, flex 0.5s cubic-bezier(.18, .51, .54, .9) 0.5s;
    animation: tab-appear 0.5s ease-in-out 0.5s 1 both;
}
 
@keyframes tab-disappear {
    0% {
     max-height: 9999rem;
    }
    1% {
     max-height: 100vh;
    }
    100% {
     max-height: 0;
    }
}
 
@keyframes tab-appear {
    0% {
     max-height: 0;
    }
    99% {
     max-height: 100vh;
    }
    100% {
     max-height: 9999rem;
    }
}
 
/*---------------------------------------------*/
 
.yui-navset .yui-content {
    background: transparent;
    box-shadow: none;
    border-bottom: dotted 4px grey;
}
 
/* ======================= */
 
/* TAGS */
 
/* ======================= */
 
#main-content .page-tags a {
    line-height: inherit;
    background-color: rgb(20, 20, 20);
    border-radius: 2px 6px;
    color: white;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
}
 
.page-tags span {
    border-top: none;
}
 
/* ======================= */
 
/* CONTENT */
 
/* ======================= */
 
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    color: black;
    letter-spacing: unset;
}
 
.top-left-box>.item {
    display: none;
}
 
hr {
    background-color: #333;
}
 
.info-container {
    padding-bottom: 8px
}
 
/* CONTENT > CUSTOM DIVS */
 
/* ======================= */
 
.document {
    background: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    margin: 26px auto 0;
    max-width: 550px;
    min-height: 300px;
    padding: 24px;
    padding-top: 50px;
    position: relative;
    width: 80%;
}
 
.document:before,
.document:after {
    content: "";
    height: 98%;
    position: absolute;
    width: 100%;
    z-index: -1;
}
 
.document:before {
    background: #fafafa;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
    left: -5px;
    top: 4px;
    transform: rotate(-2.5deg);
}
 
.document:after {
    background: #f6f6f6;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    right: -3px;
    top: 1px;
    transform: rotate(1.4deg);
}
 
.darkdocument {
    background: rgb(30, 30, 30);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    margin: 26px auto 0;
    max-width: 550px;
    min-height: 300px;
    padding: 24px;
    padding-top: 50px;
    position: relative;
    width: 80%;
    color: #EDEDED;
}
 
.darkdocument:before,
.darkdocument:after {
    content: "";
    height: 98%;
    position: absolute;
    width: 100%;
    z-index: -1;
}
 
.darkdocument:before {
    background: rgb(25, 25, 25);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
    left: -5px;
    top: 4px;
    transform: rotate(-2.5deg);
}
 
.darkdocument:after {
    background: rgb(25, 25, 25);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    right: -3px;
    top: 1px;
    transform: rotate(1.4deg);
}
 
.notation {
    border-left: solid 3px rgb(30, 30, 30);
    border-right: solid 3px rgb(30, 30, 30);
    padding: 25px 25px 25px 25px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    width: 75%;
    margin: auto;
    background: #f7f7f7;
}
 
.modal {
    padding: 15px 15px 15px 15px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    width: auto;
    margin: auto;
    background: rgb(253, 253, 253);
    border: solid 2px #5D5D5D;
}
 
.smallmodal {
    padding: 15px 15px 15px 15px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    width: 75%;
    margin: auto;
    background: rgb(253, 253, 253);
    border: solid 2px #5D5D5D;
}
 
.jotting {
    padding: 5px 10px 5px 10px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    width: 75%;
    margin: auto;
    background: #FDFDFD;
    border: dashed 0.1rem #5D5D5D;
}
 
.transcript {
    padding: 10px 10px 10px 10px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    width: 80%;
    margin: auto;
    background: rgb(253, 253, 253);
    border: dotted 1px #5D5D5D;
    border-radius: 10px;
}
 
.papernote {
    background-color: #eaeeef;
    color: #21252E !important;
    padding: 0.1rem 0.5rem 0.5rem 0.5rem;
    box-shadow: 1px 1px 3px 2px rgb(0 0 0 / 30%);
    margin: auto;
    width: 65%;
}
 
.raisa_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/RAISA_LIGHTLOGO.png) #fff3ad;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 20px 20px 20px;
    word-break: break-word;
}
 
.raisa_memo>p:nth-child(1)::before {
    content: "ANMERKUNG DER ADMINISTRATIONS- UND INFORMATIONSSICHERHEITSABTIELUNG\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.3rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.classification_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/CLASSIFICATION_LIGHTLOGO.png) #edf5f3;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 20px 20px 20px;
    word-break: break-word;
}
 
.classification_memo>p:nth-child(1)::before {
    content: "MITTEILUNG DES KLASSIFIZIERUNGS-KOMITEES\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.3rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.ettra_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/ETTRA_LIGHTLOGO.png) #f5d7d7;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 20px 20px 20px;
    word-break: break-word;
}
 
.ettra_memo>p:nth-child(1)::before {
    content: "ANMERKUNG DER AUTORITÄT FÜR DRINGENDE GEFAHRENBEKÄMPFUNG\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.3rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.ethics_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/ETHICS_LIGHTLOGO.png) #ffdbc4;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 20px 20px 20px;
    word-break: break-word;
}
 
.ethics_memo>p:nth-child(1)::before {
    content: "MITTEILUNG DES ETHIK-KOMITEES\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.3rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.temporal_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/DELTA_T_LIGHTLOGO.png) #ffffff;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.16);
    border: double 3px lightgrey;
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 20px 20px 20px;
    word-break: break-word;
}
 
.temporal_memo>p:nth-child(1)::before {
    content: "DIE ABTEILUNG FÜR TEMPORALE ANOMALIEN\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.3rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.overwatch_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/O5_LIGHTLOGO.png) #e3e3e3;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 30px 20px 20px;
    word-break: break-word;
}
 
.overwatch_memo>p:nth-child(1)::before {
    content: "AUFSEHERRAT\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.55rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.miscomm_memo {
    background: url(https://scp-wiki.wikidot.com/local--files/theme:basalt/MISCOMM_LIGHTLOGO.png) #eeedfa;
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
    font-family: 'Work Sans', sans-serif;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    width: 90%;
    min-height: 4rem;
    max-height: 100rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 30px 20px 20px;
    word-break: break-word;
}
 
.miscomm_memo>p:nth-child(1)::before {
    content: "NOTIZ DER ABTEILUNG FÜR MISKOMMUNIKATIONEN\00000a";
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    font-size: 130%;
    text-align: center;
    margin-bottom: 1rem;
    padding-bottom: 0.3rem;
    border-bottom: dotted 0.13rem darkslategrey;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.raisa_memo a,
.temporal_memo a,
.classification_memo a,
.overwatch_memo a,
.ettra_memo a,
.ethics_memo a,
.miscomm_memo a {
    font-weight: 700;
}
 
.bigtext {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
}
 
.st {
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    text-decoration: underline;
}
 
/* ======================= */
 
/* CONTENT > TABLES */
 
/* ======================= */
 
#page-content .wiki-content-table tr th {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    border: solid 1px #000;
    background-color: #aaa;
}
 
#page-content .wiki-content-table tr td {
    border: 1px #000 solid;
}
 
#page-content .table1 tr th {
    background-color: #D7EFE7;
}
 
#page-content .table1 .st {
    color: #D7EFE7;
}
 
#page-content .table2 tr th {
    background-color: #D8ECF4;
}
 
#page-content .table2 .st {
    color: #D8ECF4;
}
 
#page-content .table3 tr th {
    background-color: #FDF6D7;
}
 
#page-content .table3 .st {
    color: #FDF6D7;
}
 
#page-content .table4 tr th {
    background-color: #FFDABF;
}
 
#page-content .table4 .st {
    color: #FFDABF;
}
 
#page-content .table5 tr th {
    background-color: #F5D8E0;
}
 
#page-content .table5 .st {
    color: #F5D8E0;
}
 
#page-content .table6 tr th {
    background-color: rgba(146, 0, 255, 0.2);
}
 
#page-content .table6 .st {
    color: rgb(146, 0, 255);
}
 
.tableb .wiki-content-table {
    border-collapse: separate;
    border-spacing: 5px;
    padding-left: -100px;
}
 
.table1 .scp-image-block .scp-image-caption {
    background-color: #D7EFE7;
    color: black;
}
 
.table2 .scp-image-block .scp-image-caption {
    background-color: #D8ECF4;
    color: black;
}
 
.table3 .scp-image-block .scp-image-caption {
    background-color: #FDF6D7;
    color: black;
}
 
.table4 .scp-image-block .scp-image-caption {
    background-color: #FFDABF;
    color: black;
}
 
.table5 .scp-image-block .scp-image-caption {
    background-color: #F5D8E0;
    color: black;
}
 
.table6 .scp-image-block .scp-image-caption {
    background-color: rgba(146, 0, 255, 0.2);
    color: black;
}
 
/* ======================= */
 
/* CONTENT > RATING MODULE */
 
/* ======================= */
 
.rate-points {
    color: black !important;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    border: none;
    font-size: 90%;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown,
.page-rate-widget-box .cancel,
.page-rate-widget-box .rate-points {
    border: none;
}
 
/* ======================= */
 
/* CONTENT > IMAGE BLOCK */
 
/* ======================= */
 
.scp-image-block img {
    background: white;
}
 
.scp-image-block.block-right {
    margin: 0em 0em 1em 2em;
}
 
.scp-image-block.block-center {
    max-width: 99% !important;
}
 
.scp-image-block {
    border: none;
    box-shadow: none;
}
 
.scp-image-block .scp-image-caption {
    border-top: none !important;
    margin-top: 8px;
    background-color: #292929;
    color: #ffffff;
}
 
.scp-image-block img,
.scp-image-block .scp-image-caption {
    outline: solid 1px #444;
    box-shadow: 0px 0px 5px #999999;
}
 
.scp-image-block .scp-image-caption p {
    font-size: 110%;
    font-family: 'Work Sans', sans-serif;
}
 
/* ======================= */
 
/* CONTENT > LINKS */
 
/* ======================= */
 
a {
    color: #0645AD;
}
 
a.newpage {
    color: #CC2200;
}
 
a:visited {
    color: #0B0080;
}
 
.danger-diamond a, .danger-diamond a::selection {
    color: transparent;
    background: none;
}
 
.scp-image-block .scp-image-caption a {
    color: #c5c5c5;
}
 
/* ======================= */
 
/* CONTENT > SCROLLBAR */
 
/* ======================= */
 
::-webkit-scrollbar {
    cursor: pointer;
    border: none;
}
 
::-webkit-scrollbar-thumb {
    background: black;
    cursor: pointer;
}
 
::-webkit-scrollbar-thumb:hover {
    background: rgb(45, 45, 45);
}
 
::-webkit-scrollbar-track {
    background: white;
}
 
/* ======================= */
 
/* CONTENT > COLLAPSIBLES */
 
/* ======================= */
 
a.collapsible-block-link {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    color: white;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 7px;
    padding-right: 9px;
    background: rgb(20, 20, 20);
    border-radius: 3px;
    margin-top: 10px;
    margin-bottom: 10px;
}
 
/* ======================= */
 
/* CONTENT > PAGE TITLE / BREADCRUMBS */
 
/* ======================= */
 
#page-title,
.meta-title {
    display: block !important;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    color: #252525;
    border: none;
    margin-top: 3rem;
}
 
#breadcrumbs {
    text-transform: uppercase;
    color: grey;
    font-weight: 600;
    font-family: 'Work Sans', sans-serif;
    margin-top: -1.5rem;
    font-size: 90%;
}
 
/* ======================= */
 
/* CONTENT > BETTERFOOTNOTES INTEGRATION */
 
/* ======================= */
 
.fnnum:hover {
    background: transparent;
    transform: scale(1.3);
}
 
.fnnum {
    transition-duration: 0.2s;
    transition-property: transform;
    transform: translateZ(0);
}
 
.fnnum::after {
    color: #3f21ff !important;
}
 
.fnnum:hover::after {
    color: white !important;
}
 
.fncon {
    background: rgb(25, 25, 25) !important;
    color: #EDEDED;
    border: 0.15rem solid rgb(20, 20, 20);
    border-radius: 2px;
    font-size: 90%;
}
 
/* ======================= */
 
/* @MEDIA QUERIES / MOBILE FORMATTING */
 
/* ======================= */
 
@media only screen and (max-width: 600px) {
    .scp-image-block.block-right {
     float: none;
     margin: 10px auto;
    }
}
 
@media (min-width: 768px) {
    #header,
    #top-bar {
     width: calc(100% - 4.4rem);
     max-width: calc(100% - 4.4rem);
    }
    #main-content {
     max-width: 95%;
    }
}
 
@media (max-width: 1120px) {
    #top-bar {
     font-weight: 600;
     font-size: 80%;
    }
}
 
@media (max-width: 1020px) {
    #top-bar {
     top: 3.2rem;
     left: 7.8rem;
    }
    #extra-div-1::before {
     top: 0.3rem;
    }
    #extra-div-2::before {
     top: 1.9rem;
    }
    #u-header-link {
     height: 2.5rem;
    }
    .document,
    .darkdocument {
     width: 95%;
    }
}
 
@media (max-width: 767px) {
    .mobile-top-bar {
    display: flex;
    justify-content: flex-start;
    max-width: 100%;
    width: 100%;
    flex-direction: row;
    }
}
 
@media (max-width: 500px) {
    .logo {
     display: none;
    }
    #top-bar {
     left: 3.6rem;
    }
    #extra-div-1::before,
    #extra-div-2::before {
     left: 4.2rem;
    }
    #u-header-link {
     left: 4rem;
    }
    .document, .darkdocument {
     width: auto;
    }
}
 
@media (max-width: 560px) {
    #login-status span.printuser {
     font-size: 0;
    }
}
 
@media (max-width: 430px) {
    #extra-div-1::before {
     font-size: 23.45px;
     top: 0.5rem;
    }
    #extra-div-2::before {
     font-size: 1em;
     top: 2.1rem;
    }
    #u-header-link {
     width: 13.5rem;
    }
    #login-status {
     right: 1.8rem;
    }
}
 
/* ======================= */
 
/* MISC */
 
/* ======================= */
 
.avatar-hover {
display: none !important;
}
 
::selection {
    background-color: rgba(0, 0, 255, 0.7);
    color: white;
}
 
select {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    border: solid 2px grey;
    cursor: pointer;
    border-radius: 5px;
}
 
body.wait {
    cursor: wait;
}
 
body.wait * {
    cursor: auto;
}
 
input {
    font-size: 90%;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
}
 
#action-area > p {
    font-size: 90%;
    font-weight: 500;
}
 
#action-area > h1 {
    font-size: 150%;
}
 
div.buttons input, input.button, button, file, a.button {
    margin: 0 2px;
    border: 2px solid grey;
    cursor: pointer;
}
 
#who-rated-page-area > h2 {
    display: none;
}
 
#who-rated-page-area>div {
    column-count: 4;
}
 
@media (max-width: 900px) {
    #who-rated-page-area>div {
     column-count: 3;
    }
}
 
@media (max-width: 700px) {
    #who-rated-page-area>div {
     column-count: 2;
    }
}
 
@media (max-width: 540px) {
    #who-rated-page-area>div {
     column-count: 1;
    }
}
 
.pager .current {
    border-style: solid;
    outline: solid 1px rgb(250, 250, 250);
}
 
.pager a,
.pager .current {
    border-style: double;
    border-width: 3px;
    text-transform: uppercase;
    background: none;
    color: inherit;
}
 
.pager a:hover,
.pager .current:hover {
    text-decoration: none;
    cursor: pointer;
}
 
.pager .target {
    font-weight: 800;
}
 
.w-container {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    border-style: double !important;
    border-width: 4px !important;
    margin: auto;
    width: 90%;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
 
.s-cell {
    font-size: 1.25rem !important;
}
 
.anom-bar-container,
.anom-bar-container * {
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 700;
}
 
#page-content div.warning-box div.text-number, #page-content div.warning div.text-number {
    font-size: 140%;
    font-weight: 400;
}
 
#page-content div.warning-box strong, #page-content div.warning strong {
    font-weight: 700;
}
 
#page-content div.warning-box div.text-top, #page-content div.warning div.text-top {
    font-weight: 800;
}
 
#page-content div.warning-box, #page-content div.warning {
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 500;
}
 
.collection {
    font-family: 'Work Sans', sans-serif;
    color: #905c5c;
}
 
.footer-wikiwalk-nav {
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.5));
    width: fit-content;
    margin: auto;
    margin-top: 1rem;
}
 
.footer-wikiwalk-nav p {
    color: #EDEDED;
}
 
.footer-wikiwalk-nav a, .footer-wikiwalk-nav p {
    border-radius: 10px;
    background: rgb(20, 20, 20);
    width: fit-content;
    margin: auto;
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
 
.footer-wikiwalk-nav a {
    color: #bdbdff;
}
 
.footer-wikiwalk-nav a:hover {
    text-decoration: underline;
}
 
/* MISC > WIKIDOT OWINDOW */
 
/* ======================= */
 
#owindow-1 {
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 100%);
}
 
#owindow-1>div.title.modal-header {
    font-family: 'Work Sans', sans-serif;
    text-transform: uppercase;
    font-size: 90%;
    cursor: default;
}
 
#owindow-1>div.content.modal-body td.active>b {
    font-family: 'Work Sans', sans-serif;
    color: rgb(100, 100, 100);
}
 
#owindow-1>div.content.modal-body>table {
    max-height: 10rem;
    overflow: auto;
    display: block;
}
 
#owindow-1>div.content.modal-body>div {
    margin-top: 1.5rem !important;
    border-top: solid 0.2rem rgb(210, 210, 210);
    padding-top: 1rem;
}
 
#owindow-1>div.content.modal-body>div>div>a {
    background: #870000;
}
 
#owindow-1>div.content.modal-body>div>div>a:hover {
    background: #470000;
}
 
#owindow-1>div.content.modal-body>img {
    filter: drop-shadow(0.35rem 0.35rem 0.4rem rgba(0, 0, 0, 0.3));
    padding: 0px 0px 0px 0px !important;
    background: none;
    background-color: transparent !important;
    margin-right: 1.7rem;
}
 
#owindow-1 {
    font-family: 'Work Sans', sans-serif;
}
 
/* ======================= */
 
/* MISC > EDIT BOX & PAGE SOURCE */
 
/* ======================= */
 
#lock-info {
    box-shadow: 0px 0px 4px #999999;
    background: white;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    margin-left: 1rem;
    font-size: 95%;
    border: solid 1px grey;
    color: #191919;
}
 
#edit-page-form>table.edit-page-bottomtable>tbody>tr>td:nth-child(1)>div.sub,
#edit-page-form>table.form>tbody>tr>td:nth-child(1) {
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
}
 
#edit-page-form>table.edit-page-bottomtable>tbody>tr>td:nth-child(1)>div:nth-child(1) {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
}
 
.wd-editor-toolbar-panel ul li a {
    height: 22px;
    width: 22px;
    padding: 0;
    margin: 0;
    display: block;
    border-radius: 2px;
    filter: invert(1), hue-rotate(180deg);
    filter: invert(1) hue-rotate( 180deg);
}
 
.wd-editor-toolbar-panel {
    margin-bottom: 0.5rem;
}
 
input#edit-page-title.text {
    border-radius: 4px;
    font-family: 'Work Sans', sans-serif;
    border: 2px solid #afafaf;
}
 
textarea {
    font-family: 'Roboto', sans-serif;
    padding: 5px 5px 5px 5px;
    font-size: 105%;
    border: 0.13rem solid #949494;
    background-color: #FFF;
    color: #000;
    border-radius: 2px;
}
 
.page-source {
    background: white;
    font-family: 'Inter', sans-serif;
    font-size: 105%;
    border: none;
    width: 80%;
    box-shadow: 0px 0px 4px #999999;
    padding: 18px 18px 18px 18px;
    word-break: break-word;
}
 
/* ======================= */
 
/* MISC > FONT SIZE/WEIGHT CHANGES */
 
/* ======================= */
 
#page-content strong {
    font-weight: 900;
}
 
#page-content {
    font-size: 100%;
}
 
/* ======================= */
 
#show-upload-button {
    float: unset;
    border-radius: 6px;
    border: solid 1px grey;
    font-size: 0.85rem;
}
 
.edit-help-34 {
    margin-top: 2px;
    font-family: 'Work Sans', sans-serif;
    font-size: 0.7rem;
    font-weight: 500;
}
 
.printuser a {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
}
 
form,
#action-area>p,
table.page-files td span {
    font-family: 'Work Sans', sans-serif;
}
 
#action-area>table>thead>tr,
#revision-list>table>tbody>tr:nth-child(1) {
    font-family: 'Work Sans', sans-serif;
    text-transform: uppercase;
    font-weight: 700;
}
 
#page-info {
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    padding-bottom: 0.2rem;
    margin-bottom: 0.2rem;
}
 
#page-info::first-letter,
a.btn.btn-default.button.button-close::first-letter,
a.btn.btn-default.button.button-close-message::first-letter,
a.btn.btn-default.button.button-cancel::first-letter,
a.btn.btn-default.button.button-rename::first-letter,
a.btn.btn-default.button.button-no\,-cancel::first-letter,
#owindow-1 > div.button-bar.modal-footer > a.btn.btn-default.button.button-yes\,-delete::first-letter,
#owindow-1 td::first-letter {
    text-transform: uppercase;
}
 
#owindow-1 td a::first-letter {
    text-transform: lowercase !important;
}
 
.button-bar.modal-footer a.btn.btn-danger,
#owindow-1>div.content.modal-body>div>div>a {
    float: right !important;
    margin-top: -0.73rem;
}
 
td:nth-child(1)>a {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
}
 
/* MISC > BUTTONS */
 
/* ======================= */
 
a.btn.btn-danger,
a.btn.btn-primary,
.btn-small,
#owindow-1>div.button-bar.modal-footer>a,
#edit-cancel-button,
#edit-diff-button,
#edit-preview-button,
#edit-save-draft-button,
#edit-save-continue-button,
#edit-save-button,
#owindow-1>div.content.modal-body>div>a.btn.btn-default {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600 !important;
    font-size: 0.75rem;
    color: white;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 7px;
    padding-right: 9px;
    background: rgb(20, 20, 20);
    border-radius: 2px !important;
    cursor: pointer;
    width: fit-content !important;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
    margin-left: 0.3rem;
    margin-right: 0.35rem;
    float: left;
}
 
a.collapsible-block-link:hover,
a.btn.btn-danger:hover,
a.btn.btn-primary:hover,
.btn-small:hover,
#owindow-1>div.button-bar.modal-footer>a:hover,
#edit-cancel-button:hover,
#edit-diff-button:hover,
#edit-preview-button:hover,
#edit-save-draft-button:hover,
#edit-save-continue-button:hover,
#edit-save-button:hover,
#owindow-1>div.content.modal-body>div>a.btn.btn-default:hover {
    text-decoration: none;
    background: rgb(45, 45, 45);
}
 
#action-area > p:nth-child(5) > a:hover {
    text-decoration: none;
    background: rgb(45, 45, 45);
}
 
#action-area > p:nth-child(5) > a {
    font-family: 'Work Sans', sans-serif;
    font-weight: 600 !important;
    font-size: 0.75rem;
    color: white;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 7px;
    padding-right: 9px;
    background: rgb(20, 20, 20);
    border-radius: 2px !important;
    cursor: pointer;
    width: fit-content !important;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
    margin-left: 0.3rem;
    margin-right: 0.35rem;
}
 
/* ======================= */
 
#footer,
#license-area {
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
}
 
#page-content div.collapsible-block {
    margin-top: 13px;
    margin-bottom: 13px;
}
 
div.collapsible-block-content {
    animation: fade 0.4s;
    animation-fill-mode: forwards;
}
 
/* MISC > FOOTNOTES */
 
/* ======================= */
 
.hovertip {
    background: rgb(25, 25, 25) !important;
    border-radius: 2px;
    padding: 5px 5px 5px 5px;
    color: white;
    font-family: 'Work Sans', sans-serif;
    max-width: 400px;
}
 
.f-heading {
    text-transform: uppercase;
    font-weight: 900;
    font-size: 80%;
}
 
.footnotes-footer .title {
    font-size: 0px;
    color: transparent;
    margin-bottom: 15px;
}
 
.footnotes-footer .title:before {
    content: "Fußnoten \0026  Referenzen";
    color: rgb(25, 25, 25);
    text-transform: uppercase;
    font-weight: 900;
    font-size: 0.9rem;
    font-family: 'Work Sans', sans-serif;
    cursor: text;
}
 
.footnotes-footer a {
    color: black;
    font-weight: 700;
    font-family: 'Work Sans', sans-serif;
}
 
.footnotes-footer {
    border-left: solid 3px rgb(20, 20, 20);
    padding-left: 15px;
    margin-top: 6rem;
}
 
.footnote .f-footer,
.equation .e-footer,
.reference .r-footer {
    display: none;
}
 
/* ======================= */
 
#page-options-container a {
    color: rgb(45, 45, 45);
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    font-size: 90%;
    text-transform: uppercase;
}
 
#page-options-container a:hover {
    text-decoration: none;
    color: rgb(2, 2, 2);
}
 
#page-info-break {
    height: 3rem;
}
 
.code pre,
.code p,
.code,
tt {
    font-family: 'Fira Code', monospace;
}
 
#account-options {
    border: none;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    width: fit-content;
    box-shadow: 0px 0px 5px rgb(0 0 0 / 30%);
    padding: 5px 5px 5px 5px;
    text-transform: uppercase;
}
 
#account-options a {
    filter: grayscale(100%) saturate(0%);
    -webkit-filter: grayscale(100%) saturate(0%);
    color: grey;
}
 
/* Anendlessusername's invaluable correction of the ACS octagon! */
#page-content .quadrants>div {
    top: 2.25%;
    left: 18.5%;
}
/* WHEN YOU SEE IT... */
 
.licensebox .collapsible-block-link,
.licensebox .collapsible-block-link:hover {
    background: none;
    text-transform: uppercase;
    font-weight: 700;
}
 
/* ---- WORDS NO LONGER BROKEN, THE CROQUEMBOUCHE HAS SPOKEN ---- */
 
#page-content span, #page-content a {
    word-break: normal !important;
}

‡ Lizenzierung / Zitation

Seiten Revision: 8, zuletzt bearbeitet: 09 Oct 2022 07:46

Bearbeiten Bewerten (+1) Tags Diskutieren (1) Historie Dateien Drucken Site-Werkzeuge + Optionen

SCP Foundation

auf Deutsch

● WAS IST DAS HIER?

● THEME-EINSTELLUNGEN

● ANPASSUNGEN

TITEL/UNTERTITEL/LOGO ÄNDERN

ONYX (DARK MODE)

GARNET (RED MODE)

● ENTHALTEN BEI BASALT

COMPONENTS

THEMES

BEISPIELE

Erster Titel

Zweiter Titel

Dritter Titel

Vierter Titel

Fünfter Titel

Sechster Titel

The header font is Josefin Sans.

Source Code