Dynamikron Theme

Link to article: Dynamikron Theme.

@import url("https://nu-scptheme.github.io/Black-Highlighter/css/min/normalize.min.css");
@import url("https://nu-scptheme.github.io/Black-Highlighter/css/min/black-highlighter.min.css");

.font0 { font-family:  var(--body-font); font-size: 16px; }
.font1 { font-family: var(--header-font); font-size: 16px; }
.font2 { font-family:  var(--title-font); font-size: 16px; }
.font3 { font-family:  var(--mono-font); font-size: 16px; }
.font4 { font-family:  var(--UI-font); font-size: 16px; }
.font5 { font-family:  var(--logs-dialogue-font); font-size: 16px; }
.font6 { font-family:  var(--logs-speaker-font); font-size: 16px; }

@import url("https://scp-wiki.wikidot.com/local--code/theme:dynamikron/1");

```
display: none;
```
```
width:100%; box-shadow:none;
```
```
width:100%;
```
```
width:100%;
```
```
color: rgb(var(--magnetic-tape));
```
```
display: none;
```

```
blokquote-alt
```
```
scp-image-block
```
```
block-center
```
```
scp-image-caption
```
```
code
```
```
blokquote-alt
```
```
logs
```
```
logs-header
```
```
dialog
```
```
active
```
```
font0
```
```
font1
```
```
font2
```
```
font3
```
```
font4
```
```
font5
```
```
font6
```

[[iftags +theme]]

[[module CSS]]
@import url("https://nu-scptheme.github.io/Black-Highlighter/css/min/normalize.min.css");
@import url("https://nu-scptheme.github.io/Black-Highlighter/css/min/black-highlighter.min.css");
[[/module]]

[[include :scp-wiki:component:interwiki-style
| priority=1
| theme=https://nu-scptheme.github.io/Black-Highlighter/css/min/normalize.min.css
]]

[[include :scp-wiki:component:interwiki-style
| priority=2
| theme=https://nu-scptheme.github.io/Black-Highlighter/css/min/black-highlighter.min.css
]]

[[div style="display: none;"]]
[[include component:image-block
name=https://scp-wiki.wdfiles.com/local--files/theme%3Adynamikron/dynamikron-vhs.png
|caption=Thumbnail (Dynamikron Logo)]]
[[/div]]

[[module CSS]]
.font0 { font-family:  var(--body-font); font-size: 16px; }
.font1 { font-family: var(--header-font); font-size: 16px; }
.font2 { font-family:  var(--title-font); font-size: 16px; }
.font3 { font-family:  var(--mono-font); font-size: 16px; }
.font4 { font-family:  var(--UI-font); font-size: 16px; }
.font5 { font-family:  var(--logs-dialogue-font); font-size: 16px; }
.font6 { font-family:  var(--logs-speaker-font); font-size: 16px; }
[[/module]]

[[>]]
[[module Rate]]
[[/>]]
-----
++ What is this?
[[div class="blokquote-alt"]]
Dynamikron Theme is a light theme for BHL visually based off of the patterning on 1980's Sony Dynamicron VHS cassette tape boxes. You can use it for any article... but preferably one with the nostalgic-leaning, chill synthwave feel of the eighties everyman. Or if you like Dynamicron VHS tapes a lot.
[[/div]]
----
[[=]]
+ Theme Colors
[[/=]]

[[include :scp-wiki:component:theme-squares -=-
| color1-name=VCR Body
| color1-variable=--vcr-body
| color1-info=(73, 80, 84)
| color1-has-light-text=1
| color2-name=VHS Cassette
| color2-variable=--vhs-cassette
| color2-info=(42, 39, 49)
| color2-has-light-text=1
| subcolor1-name=T20 YELLOW
| subcolor1-variable=--t20-ylo
| subcolor1-info=(247, 187, 0)
| subcolor2-name=T30 ORANGE
| subcolor2-variable=--t30-org
| subcolor2-info=(250, 77, 50)
| subcolor2-has-light-text=1
| subcolor3-name=T45 RED
| subcolor3-variable=--t45-red
| subcolor3-info=(239, 39, 76)
| subcolor3-has-light-text=1
| subcolor4-name=T60 PINK
| subcolor4-variable=--t60-pnk
| subcolor4-info=(203, 36, 103)
| subcolor4-has-light-text=1
| subcolor5-name=T120 PURPLE
| subcolor5-variable=--t120-prp
| subcolor5-info=(129, 52, 112)
| subcolor5-has-light-text=1
]]

----
@@ @@
[[div class="scp-image-block block-center" style="width:100%; box-shadow:none;"]]
[[image https://scp-wiki.wdfiles.com/local--files/theme%3Adynamikron/dynamikron-spread.png style="width:100%;" link=#]]
[[div class="scp-image-caption" style="width:100%;"]]
SCP Dynamikron logo spread
[[/div]]
[[/div]]
@@ @@
Note: This is a Black Highlighter based theme. You will need to import the Black Highlighter theme as well in order to use this theme. [[[theme:black-highlighter-theme|To learn more go here]]].

**On any wiki:**
[[div class="code" style="color: rgb(var(--magnetic-tape));"]]
@@[[include :scp-wiki:theme:black-highlighter-theme]]@@
@@[[include :scp-wiki:theme:dynamikron]]@@
[[/div]]
@@ @@

+ Examples

A horizontal rule can be created with 5 hyphens "@@-----@@" and extends across the whole page if it's not placed inside anything (eg a blockquote). The lines separating sections of this document are horizontal rules.
-----

Titles can be created by putting between one and six plus "+" at the start of the line

[[collapsible show="+ Titles" hide="- Titles"]]
+ First Title

++ Second Title

+++ Third Title

++++ Fourth Title

+++++ Fifth Title

++++++ Sixth Title
[[/collapsible]]

@@ @@

[[tabview]]
[[tab Tabulator]]
Just use your imagination and pretend there's `Lorem Ipsum` here.
[[/tab]]
[[tab Tabulation]]
Hey look, more text here.

How quaint.
[[/tab]]
[[tab Long Tab]]
This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
"My girl wants to party all the time, party all the time, party all the tiiiime~" - Eddie Murphy, '85
[[/tab]]
[[/tabview]]
@@ @@
> This is a blockquote, created by putting "> " at the start of each line.
>
> More text
> -----
> That's a horizontal rule
>
>> Nested blockquotes
>>> And another[[footnote]] And here's a footnote! [[/footnote]]
@@ @@
||~ This is a ||~ table ||
||You should know || how to make these ||
||||already ||
@@ @@
-----
[[=]]
+ Extra Divs
[[/=]]
@@ @@
++++ ALT. BLOCKQUOTE
[[>]]
uses __{{blokquote-alt}}__ div
[[/>]]
[[div class="blokquote-alt"]]
TEXT GOES HERE
-----
OR HERE
[[/div]]
@@ @@
@@ @@
@@ @@
++++ RECORDED VIDEO LOGS
[[>]]
uses __{{logs}}__ & __{{logs-header}}__ divs + __{{dialog}}__ & __{{active}}__ classes
[[/>]]
[[div class="logs"]]
[[div class="logs-header"]]

VHS Tape.01

[[/div]]
[[=]]
**> RECORDING STARTED <**
[[/=]]
[[table class="dialog"]]
 
[[row]]
[[hcell]]
 
[[/hcell]]
[[cell]]
//Describe some visual action here.//
 
//You like visual action, right?//
[[/cell]]
[[/row]]
 
[[row]]
[[hcell]]
SPEAKER
[[/hcell]]
[[cell class="active"]]
This is my speech. Very wordy.
[[/cell]]
[[/row]]
 
[[/table]]
[[/div]]
@@ @@
-----
[[=]]
++ ADDED FONTS
@@ @@
[[collapsible show="▷  Body Font  ◁" hide="▶  Body Font   ◀"]]
[[div class="font0"]]
[[size 150%]]**WIX MADEFOR**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
@@ @@
[[/div]]
[[/collapsible]]
[[collapsible show="▷  Header/Heading Font  ◁" hide="▶  Header/Heading Font   ◀"]]
[[div class="font1"]]
[[size 150%]]**CLARENDON**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
@@ @@
[[/div]]
[[/collapsible]]
[[collapsible show="▷  Page Title Font  ◁" hide="▶  Page Title Font   ◀"]]
[[div class="font2"]]
[[size 150%]]**ALTE HAAS GROTESK**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
@@ @@
[[/div]]
[[/collapsible]]
[[collapsible show="▷  Monospace Font  ◁" hide="▶  Monospace Font   ◀"]]
[[div class="font3"]]
[[size 150%]]**ANONYMOUS MONO**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
@@ @@
[[/div]]
[[/collapsible]]
[[collapsible show="▷  UI Font  ◁" hide="▶  UI Font   ◀"]]
[[div class="font4"]]
[[size 150%]]**JURA**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
@@ @@
[[/div]]
[[/collapsible]]
[[collapsible show="▷  Video Logs Dialogue Font  ◁" hide="▶  Video Logs Dialogue Font   ◀"]]
[[div class="font5"]]
[[size 150%]]**IBM PLEX MONO**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
@@ @@
[[/div]]
[[/collapsible]]
[[collapsible show="▷  Video Logs Speaker Font  ◁" hide="▶  Video Logs Speaker Font  ◀"]]
[[div class="font6"]]
[[size 150%]]**DOT GOTHIC 16**[[/size]]

sphinx of black quartz, judge my vow
SPHINX OF BLACK QUARTZ, JUDGE MY VOW

**bolded** and //italicized//
**BOLDED**  AND //ITALICIZED//
[[/div]]
[[/collapsible]]
[[/=]]
@@ @@
-----
[[=]]
+ Source Code
[[/=]]
[[collapsible show="» show source" hide="« hide source"]]
[[code type="css"]]
/*
    Dynamikron Theme
    [2023 Wikidot Theme]
       by JackalRelated
*/

@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Text:ital,wght@0,400;0,500;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Michroma&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anonymous+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jura:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DotGothic16&display=swap');
@import url('https://scp-wiki.wdfiles.com/local--files/theme%3Adynamikron/stylesheet-new.css');

:root {
   --theme-base: "black-highlighter";
   --theme-id: "dynamikron";
   --theme-name: "Dynamikron";
 
   --logo-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Adynamikron/dynamikron-vhs.png");
   --header-title: " ";
   --header-subtitle: " ";

   --header-height-on-desktop: 11.5rem;
   --header-height-on-mobile: 11.5rem;

/* FONTS */
   --body-font:  'Wix Madefor Text', sans-serif;
   --header-font: 'Clarendon', serif;
   --title-font: 'Alte Haas Grotesk', sans-serif;
   --mono-font: 'Anonymous Mono', monospace;
   --UI-font: 'Jura', sans-serif;
   --logs-dialogue-font: 'IBM Plex Mono', sans-serif;
   --logs-speaker-font: 'DotGothic16', sans-serif;

/* WHITE -- GREY */
   --t130-wht: 245, 241, 240;
   --cover-matte: 239, 232, 228;
   --cover-dirty: 209, 202, 199;
   --cover-sticker: 173, 166, 163;
   --t140-gry: 131, 135, 138;
   --vcr-body: 73, 80, 84;
   --vhs-cassette: 42, 39, 49;
   --magnetic-tape: 17, 17, 17;

/* YELLOW -- ORANGE */
   --t20-ylo: 247, 185, 0;
   --t30-org: 250, 77, 50;

/* RED -- PINK */
   --t45-red: 239, 39, 76;
   --t60-pnk: 203, 36, 103;

/* PURPLE */
   --t120-prp: 129, 52, 112;

/* THEME ASSIGNMENTS */
   --white-monochrome: var(--cover-matte);
   --black-monochrome: var(--magnetic-tape);

   --bright-accent: var(--t45-red);
   --medium-accent: var(--t60-pnk);
   --dark-accent: var(--t120-prp);

   --swatch-primary-darkest: var(--medium-accent);

   --swatch-background: var(--white-monochrome);
   --background-gradient-color: var(--cover-dirty);
   --background-gradient-distance: 0.575rem;

   --header-gradient-color-bottom: var(--cover-matte);
   --header-gradient-color-middle: var(--cover-dirty);
   --header-gradient-color-top: var(--cover-sticker);
   --diagonal-stripes: linear-gradient(transparent 0);

   --swatch-text-general: var(--swatch-text-dark);
   --swatch-text-light: var(--t130-wht);
   --swatch-text-secondary-color: var(--t130-wht);
   --swatch-text-tertiary-color: var(--swatch-text-dark);
   --swatch-important-text: var(--t45-red);

   --swatch-menubg-color: var(--vcr-body);
   --swatch-menubg-medium-color: var(--cover-dirty);
   --swatch-menubg-medium-dark-color: var(--vhs-cassette);
 
   --swatch-menutxt-light-color: var(--t130-wht);
   --swatch-menutxt-dark-color: var(--magnetic-tape);
   --swatch-menutxt-general-color: var(--swatch-menutxt-light-color);

   --swatch-topmenu-bg-color: var(--vhs-cassette);
   --swatch-topmenu-border-color: var(--vcr-body);

   --sidebar-transition-timing: 0.8s ease-in-out 0.1s;

   --toggle-button-bg: rgba(var(--magnetic-tape), 0);
   --toggle-border-color: rgb(var(--vhs-cassette));
   --toggle-icon-color: rgb(var(--vhs-cassette));
   --toggle-roundness: 0%;

   --pager-link: var(--t60-pnk);
   --pager-link-hover: var(--t130-wht);
   --pager-hover-bg: var(--t60-pnk);
   --pager-selected-bg: var(--t45-red);
   --pager-selected-link: var(--t130-wht);

   --modal-bg: var(--cover-matte);
   --modal-body-text: var(--magnetic-tape);
   --modal-body-header-txt: var(--t60-pnk);
   --modal-header-bg: var(--vhs-cassette);
   --modal-header-txt: var(--t130-wht);
   --modal-header-stripe: var(--vhs-cassette);

   --hoverblock-bg: var(--vhs-cassette);
   --hoverblock-txt: var(--cover-matte);
   --hoverblock-header-bg: var(--t45-red);
   --hoverblock-header-txt: var(--t130-white);
   --hoverblock-footer-bg: var(--magnetic-tape);
   --hoverblock-footer-txt: var(--cover-matte);

   --ui-button-bg: var(--vhs-cassette);
   --ui-button-txt: var(--t130-wht);
   --ui-button-hover-bg: var(--t60-pnk);
   --ui-button-hover-txt: var(--t130-wht);
   --ui-button-hover-outline: var(--t60-pnk);

   --rating-module-button-cancel-color: var(--t30-org);
   --rating-module-button-credit-color: var(--swatch-secondary-color);
   --rating-module-bg-color: var(--vhs-cassette);
   --rating-module-bottom-border-color: var(--swatch-primary);
   --rating-module-text-color: var(--t130-wht);
   --rating-module-text-hover-color: var(--magnetic-tape);

    --link-color: var(--t45-red);
    --visited-link-color: var(--t60-pnk);
    --hover-link-color: var(--t45-red);
    --newpage-color: var(--t30-org);
}

/* HEADER */
#header {
   --swatch-headerh1-color: var(--swatch-text-dark);
   --swatch-headerh2-color: var(--swatch-text-dark);

   --search-icon-color: var(--vhs-cassette);
   --search-icon-hover-color: var(--cover-matte);
   --search-icon-hover-bg-color: var(--t60-pnk);

   --search-icon-focus-color: var(--t130-wht);
   --search-icon-focus-bg-color: var(--t60-pnk);
   --search-focus-outline-color: var(--t60-pnk);
   --search-focus-textbox-bg-color: var(--t130-wht);
   --search-focus-textbox-text-color: var(--magnetic-tape);

   --login-line-divider-color: var(--vhs-cassette);
   --login-username-color: var(--t60-pnk);
   --login-myaccount-color: var(--t60-pnk);
   --login-myaccount-hover-color: var(--cover-matte);
   --login-myaccount-underline-color: var(--t60-pnk);
   --login-myaccount-hover-bg-color: var(--t60-pnk);
   --login-arrow-color: var(--vhs-cassette);

   --login-dropdown-bg-color: var(--vhs-cassette);
   --login-dropdown-bg-image: var(--vhs-cassette);
   --login-dropdown-border-color: var(--magnetic-tape), 0.5;
   --login-dropdown-text-color: var(--t130-wht);
   --login-dropdown-text-hover-color: var(--cover-matte);
   --login-dropdown-bg-hover-color: var(--t60-pnk);

   background-position: left 0rem top 0rem;
   background-size: auto calc(var(--header-height-on-desktop) - 0rem);
}

#header h1 a {
    text-shadow: none;
    height: 100%;
    width: 250%;
    color: transparent;
 
    background-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Adynamikron/dynamikron-scp-s.png");
    margin: 0;
    margin-left: 3.3em;
    padding: 0;
 
    background-size: auto calc(var(--header-height-on-desktop) - 5.5rem);
    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: 6.45em;
    }
}
 
#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: 5px;
    left: 0;
    pointer-events: none;
    background-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Adynamikron/dynamikron-bg.png");
    background-size: calc(var(--header-height-on-desktop) * 0.75);
}

#extra-div-2 {
    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%3Adynamikron/dynamikron-tex.png");
    background-size: calc(var(--header-height-on-desktop) * 1.5);
    mix-blend-mode: soft-light;
    opacity: 0.525;
}

#header div#top-bar,
#header div#mobile-top-bar,
#login-status {
   font-family: var(--UI-font);
}

h1, h2 {
   font-family: var(--header-font);
   letter-spacing: 0.0575rem;
}

/* TOP BAR */
#top-bar {
   --topmenu-category-color: var(--t130-wht);
   --topmenu-category-hover-color: var(--t130-wht);
   --topmenu-hover-border-color: var(--t60-pnk);

   --mobile-topmenu-sidebar-button-color: var(--t130-wht);

   --dropdown-bg-color: var(--magnetic-tape), 0.9;
   --dropdown-border-color: var(--t140-gry), 0.5;
   --dropdown-links-color: var(--t130-wht);
   --dropdown-links-hover-color: var(--cover-matte);
   --dropdown-links-hover-bg-color: var(--t60-pnk);   
}

/* PAGE TITLE */
#page-title {
   color: rgb(var(--magnetic-tape));
   font-style: italic;
}

#page-title::after,
.meta-title::after {
   height: 0.0825rem;
   background: rgb(var(--vhs-cassette));
}

/* SCROLLBAR AND SIDEBAR */
html,
body {
    scrollbar-color:
        rgb(var(--cover-dirty))
        rgb(var(--cover-sticker));
}
 
html::-webkit-scrollbar,
body::-webkit-scrollbar {
    width: 18px;
    background: #transparent;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
    background: rgb(var(--cover-dirty));
}
 
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
    background: rgb(var(--cover-sticker));
    border: rgb(var(--cover-sticker)) 1px solid;
    border-radius: 0px;
}
 
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
    background: rgb(var(--t45-red));
}

#side-bar, #interwiki {
   --UI-font: 'Michroma', sans-serif;
   --sidebar-bg-color: var(--cover-matte);
   --sidebar-resources-bg-color: var(--t60-pnk), 0.25;
   --sidebar-media-bg-color: var(--t60-pnk), 0.125;

   --sideblock-heading-bg-color: var(--t45-red);
   --sideblock-heading-border-color: var(--swatch-primary);
   --sideblock-heading-text-color: var(--t130-wht);

   --sidebar-border-color: var(--swatch-border-color), 0.08;
   --sidebar-subtext-color: var(--swatch-primary);

   --sidebar-links-text: var(--magnetic-tape);
   --sidebar-links-hover-bg-color: var(--t20-ylo);
   --sidebar-links-hover-text-color: var(--magnetic-tape);
}

#interwiki .heading,
#side-bar .heading {
   padding-bottom: 0.175em;
   min-height: 1.75rem;
}

#interwiki .heading p,
#side-bar .heading p {
   font-size: calc(var(--base-font-size)*(16/15));
}

hr {
    background-color: rgb(var(--cover-dirty));
    border-top: .0625rem solid rgb(var(--cover-dirty));
}

.code {
    background-color: rgb(var(--t130-wht));
}

blockquote,
div.blockquote {
   border: .0625rem dashed rgba(var(--cover-sticker), 1);

   --hover-link-color: var(--t30-org);
   --newpage-color: var(--t45-red);
   --link-color: var(--t45-red);
   --visited-link-color: var(--vhs-cassette);
}

blockquote hr,
div.blockquote hr {
   background-color: rgb(var(--cover-sticker));
   border-top: .0625rem solid rgb(var(--cover-sticker));
}

.scp-image-block {
   box-shadow: none;
   border: none;
}

.scp-image-block .scp-image-caption {
   border-top: .125rem outset rgba(var(--t45-red), 1);
   background-color: rgba(var(--cover-dirty), 0.5) !important;
   color: rgb(var(--magnetic-tape));
}

:is(div.image-block,div.scp-image-block) :is(.image-caption,.scp-image-caption)>p {
   padding: 2px 0px 0px 0px;
}

#odialog-container .modal-header, 
#odialog-container .title {
   padding: 1.725rem 1.25rem;
}

#odialog-container .content :is(h1,h2,h3,h4,h5), 
#odialog-container .modal-body :is(h1,h2,h3,h4,h5) {
    box-shadow: none;
}

/* MAIN CONTENT */
#main-content {
   --ui-icon-color: var(--cover-matte);
   --ui-icon-bg: var(--vhs-cassette);
   --ui-icon-hover-color: var(--t130-wht);
   --ui-icon-hover-bg: var(--t60-pnk);

   --pagetags-title-bg: var(--swatch-primary);
   --pagetags-title-text: var(--t130-wht);
   --pagetags-text-color: var(--swatch-primary);
   --pagetags-text-hover-color: var(--magnetic-tape);
   --pagetags-text-hover-bg-color: var(--t20-ylo);

   --editor-icon-color: var(--vhs-cassette);
   --editor-icon-submenu-bg: var(--t140-gry);
   --editor-icon-hover-color: var(--t130-wht);
   --editor-icon-hover-bg: var(--t30-org);

   --tabs-bg: var(--vhs-cassette);
   --tabs-txt: var(--t130-wht);
   --tabs-hover-bg: var(--t60-pnk);
   --tabs-hover-txt: var(--t130-wht);
   --tabs-selected-bg: var(--t45-red);
   --tabs-selected-txt: var(--t130-wht);
   --tabs-selected-outline: var(--t45-red);
   --tabs-bottom-border-color: var(--t60-pnk);
   --tabs-content-bg-color: var(--t140-gry), 0.25;
   --tabs-content-border-color: var(--vhs-cassette);

   --tables-header-bg: var(--t60-pnk);
   --tables-header-txt: var(--t130-wht);
   --tables-border: var(--vhs-cassette);
   --tables-body-bg: var(--t140-gry), 0.125;
   --tables-body-txt: var(--swatch-text-general);

   --toc-header-bg-color: var(--t60-pnk);
   --toc-header-text-color: var(--cover-matte);
   --toc-header-text-hover-color: var(--t130-wht);
   --toc-body-bg-color: var(--vhs-cassette);
   --toc-directory-lines-color: var(--vcr-body);
   --toc-body-link-color: var(--t130-wht);
   --toc-body-link-hover-color: var(--t20-ylo);
   --toc-body-hover-arrow-color: var(--t20-ylo);

   --blockquote-bg-color: var(--cover-dirty), 0.175;
   --blockquote-border-color: var(--cover-sticker);
   --blockquote-colorbar-color: var(--swatch-primary), 1;

   --footnotes-footer-bg-color: var(--cover-dirty);
   --footnotes-footer-colorbar-color: var(--t45-red);
   --footnotes-footer-title-bg-color: var(--t45-red);
   --footnotes-footer-title-text-color: var(--t130-wht);
   --footnotes-footer-num-color: var(--t45-red);
   --footnotes-footer-num-hover-color: var(--t30-org);
   --footnotes-footer-text-color: var(--swatch-text-general);
}

/* FOOTERS AND BELOW */
#footer {
   --footer-bg-color: var(--vhs-cassette);
   --footer-text-color: var(--cover-dirty);
   --footer-link-color: var(--t130-wht);
   --footer-link-hover-color: var(--t130-wht);
   --footer-link-hover-bg-color: var(--t60-pnk);
}

#license-area {
   --license-bg-color: var(--cover-matte);
   --license-text-color: var(--magnetic-tape);
   --license-link-color: var(--t45-red);
   --license-link-hover-color: var(--t130-wht);
   --license-link-hover-bg-color: var(--t45-red);
}

form#edit-page-form textarea,
form#new-post-form textarea {
   background-color: rgb(var(--t130-wht));
}

#action-area:has(form[onsubmit*=setParent],#who-rated-page-area,form[onsubmit*=PageTagsModule],table.page-files,#edit-meta-addbutton,ul[style="list-style: none"],#page-block-checkbox,#rename-option-rename,#rename-option-delete) p:not(:has(a[id*=backlinks],a[onclick*=showWho],a.btn)) {
   background-color: rgb(var(--cover-dirty));
   box-shadow: inset 0.25rem 0 0 0 rgb(var(--swatch-primary)), -0.125rem 0 0.25rem 0 rgba(var(--cover-sticker), .25), inset 0-0.0625rem 0 0 rgba(var(--cover-sticker), .75);
}

/* TOGGLE SIDEBAR (BHL) CHANGES */
@supports((display: -ms-grid) or (display: grid)) {
   @media only screen and (min-width: 769px) {
      #main-content::before {
         background: rgba(var(--vhs-cassette), .55) 1px 1px repeat;
      }
   }
}

/* CUSTOM DIVS */
 
.blokquote-alt {
   margin: .5em 1.25rem;
   padding: .525em 1.55em;
   border: .0625rem dashed rgba(var(--cover-dirty), 1);
   background-color: rgba(var(--t130-wht), 0.9);

   color: rgb(var(--vhs-cassette));
   font-weight: 400;
   font-size: 1.05em;
   font-family: var(--UI-font);

   --hover-link-color: var(--t30-org);
   --newpage-color: var(--t45-red);
   --link-color: var(--t45-red);
   --visited-link-color: var(--t60-pnk);
}

.blokquote-alt hr {
    background-color: rgb(var(--t45-red));
    border-top: .0625rem solid rgb(var(--t45-red));
}

.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(--vhs-cassette));
   border: 3px outset rgb(var(--vcr-body));
   color: rgb(var(--t130-wht));

   font-family: 'Michroma', sans-serif;
   font-size: 1.175em;
   letter-spacing: 0.15em;
}

.logs-header {
   background-color: rgb(var(--t120-prp));
   color: rgb(var(--t130-wht));

   padding: 0.5em 0px 0.5em 0px;
   border-bottom: 0.675rem double rgb(var(--vhs-cassette));

   text-align: center;
   font-size: 2.15em;
   letter-spacing: 0em;
   letter-spacing: 0.075em;
}

.logs hr {
    background-color: rgb(var(--ink-blot));
}

table.dialog {
   border-collapse: collapse;
   margin-top: 1.5em;
   font-family: var(--logs-speaker-font);
   letter-spacing: normal;
}

table.dialog th {
   border-right: 1px solid rgb(var(--t130-wht));
   color: rgb(var(--t130-wht));
   padding: 1em 1em 0em 1em;
   letter-spacing: 0.1rem;
   font-weight: bold;
}

table.dialog td {
   padding: 1em 0em 0em 1em;
   font-family: var(--title-font);
   line-height: 1.35em;
}

table.dialog td.active {
   color: rgb(var(--t130-wht));
   font-family: var(--logs-dialogue-font);
   line-height: 1.5em;
}

[[/code]]
[[/collapsible]]
[[/iftags]]

[[div style="display: none;"]]
[[include :scp-wiki:component:toggle-sidebar-bhl]]
[[/div]]

[[module CSS]]
@import url("https://scp-wiki.wikidot.com/local--code/theme:dynamikron/1");
[[/module]]

Dynamikron Theme

Module Styles

Inline Styles

Includes

CSS Classes

Page Source