La Rue Macabre Theme

Link to article: La Rue Macabre Theme.

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

.scp-image-block.block-right {
    margin: 1em 0 1em 2em;
}

.scp-image-block img {
    min-width: 100%;
    border: 0.1rem solid rgba(var(--pale-gray-monochrome));
    box-sizing: border-box;
}

@import url("https://scp-wiki.wdfiles.com/local--code/theme%3Alaruetheme/1");

float:center; width:400px; background-color:#cf9f2d; border: 3px solid #000000; border-radius: 10px; margin: auto

width:300px; background-color:#f2f2f2; brightness(110%);display:flex;

```
width:300px;
```
```
color:black; width:width:300px;
```

width:300px; filter: invert(0) brightness(110%);display:flex;

```
width:300px;
```
```
width:width:300px;
```
```
font-family: var(--header-font);
```
```
font-family: var(--mono-font);
```

```
scp-image-block
```
```
block-left
```
```
scp-image-caption
```
```
scp-image-block
```
```
block-right
```
```
scp-image-caption
```
```
code
```

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

.scp-image-block.block-right {
    margin: 1em 0 1em 2em;
}

.scp-image-block img {
    min-width: 100%;
    border: 0.1rem solid rgba(var(--pale-gray-monochrome));
    box-sizing: border-box;
}
[[/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
]]
[[>]]
[[module Rate]]
[[/>]]

[[=]]
[[div style="float:center; width:400px; background-color:#cf9f2d; border: 3px solid #000000; border-radius: 10px; margin: auto"]]
[[=]]
[[size 150%]]**PLEASE STOP**[[/size]]

This is a template page used internally by the SCP Wiki.

**PLEASE DO NOT TOUCH THIS PAGE WITHOUT PERMISSION**
[[/=]]
[[/div]]
[[/=]]

[[=]]
+ Theme Colors
[[/=]]

[[include :scp-wiki:component:theme-squares -=-
| color1-name=Tombstone
| color1-variable=--gray-monochrome
| color1-info=(156, 148, 132)
| color2-name=Parchment 
| color2-variable=--bright-accent
| color2-info=(255,238,204)
| subcolor1-name=Wild Sand 
| subcolor1-variable=--pale-gray-monochrome
| subcolor1-info=(244,244,244)
| subcolor2-name=Alto 
| subcolor2-variable=--light-gray-monochrome
| subcolor2-info=(215, 215, 215)
| subcolor3-name=Shadow on Pine
| subcolor3-variable=--dark-gray-monochrome
| subcolor3-info=(115,94,55)
| subcolor4-name=Dull Gold 
| subcolor4-variable=--medium-accent
| subcolor4-info=(207,159,45)
| subcolor5-name=Lisbon Brown 
| subcolor5-variable=--dark-accent
| subcolor5-info=(70,56,33)
]]

[[div]]
[[div class="scp-image-block block-left" style="width:300px; background-color:#f2f2f2; brightness(110%);display:flex;"]]
[[image sigil.png width="300px" style="width:300px;" link="https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/sigil.png"]]
[[div class="scp-image-caption" style="color:black; width:width:300px;"]]
La Rue Sigil - Black
[[/div]]
[[/div]]

[[div class="scp-image-block block-right" style="width:300px; filter: invert(0) brightness(110%);display:flex;"]]
[[image sigil2.png width="300px" style="width:300px;" link="https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/sigil2.png"]]
[[div class="scp-image-caption" style="width:width:300px;"]]
La Rue Sigil - White
[[/div]]
[[/div]]
[[/div]]



+ Usage

> This theme was developed by [[*user MalyceGraves]] to be used in conjunction with tales and SCP articles written in and around the setting of  [[[larue-hub|La Rue Macabre]]]. 
> 
> This theme is licensed under CC BY-SA 3.0


++ 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. [http://www.scp-wiki.net/theme:black-highlighter-theme To learn more go here.]

+++ Additionally, this is a heavily modified variant of the incredible [[[component: Old Money theme] by [[*user djkaktus]] & [[*user woedenaz]]

On any wiki:

[[div class="code"]]
@@[[include :scp-wiki:theme:black-highlighter-theme]]@@
@@[[include :scp-wiki:theme:laruetheme]]@@
[[/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.

Footnotes! These are created using the @@[[footnote]]@@ tag.[[footnote]]Here is a footnote just for [/ for an example.][[/footnote]]

-----

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]]
This is an example of what Tabs will look like in this theme.

[[/tab]]
[[tab Tabulation]]

More tab examples.

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

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean egestas ipsum non erat pretium, nec auctor nunc ullamcorper. Donec rhoncus varius eleifend. Sed ut tortor magna. Suspendisse odio velit, mollis id tincidunt et, consectetur eu magna. Duis aliquet lacus metus, ut consectetur urna finibus ac. Morbi ultrices velit id turpis porta fermentum. Integer eget quam sit amet purus pellentesque finibus iaculis luctus sem. Duis sit amet neque mollis, vestibulum lectus sed, consectetur felis.

Nulla consectetur molestie imperdiet. Morbi congue, ex quis tempor placerat, est libero varius quam, ac vulputate risus lectus ac tellus. Maecenas finibus velit sit amet ultrices venenatis. Nulla dictum consequat sapien, at tristique dolor lacinia vel. Sed viverra dui ipsum, a semper tortor finibus at. Phasellus porttitor velit eu cursus suscipit. Pellentesque mattis malesuada est, eu sollicitudin sem aliquam quis. Fusce consectetur facilisis purus, quis posuere turpis pellentesque in. Donec feugiat vitae tortor sit amet aliquet. Etiam et neque id neque cursus aliquam. Donec vitae purus a libero facilisis aliquam. Mauris leo metus, maximus sed neque cursus, scelerisque dictum leo. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus lectus dui, pharetra sed facilisis sed, pulvinar sed ex.

Pellentesque eu facilisis erat, at egestas est. Mauris vulputate libero at velit euismod, in blandit lorem facilisis. Integer et nisi eget nisl feugiat luctus id vitae quam. Cras ut enim id nisi bibendum placerat. Cras ut risus lacus. Aenean sed metus varius, faucibus neque sed, suscipit massa. Fusce faucibus, est a semper dignissim, erat nisl faucibus sapien, at lobortis arcu quam porttitor quam. Aliquam erat volutpat. Morbi faucibus sodales nisl, nec congue nulla finibus et. Etiam porta enim ipsum, nec varius dolor aliquam eu. 
[[/tab]]
[[tab Empty Tab]]
1
[[/tab]]
[[tab Empty Tab]]
2
[[/tab]]
[[tab Empty Tab]]
3
[[/tab]]
[[tab Empty Tab]]
4
[[/tab]]
[[tab Empty Tab]]
5
[[/tab]]
[[tab Empty Tab]]
6
[[/tab]]
[[/tabview]]

> This is a blockquote, created by putting "> " at the start of each line.
>
> More text
> -----
> That's a horizontal rule
>
>> Nested blockquotes, created by putting ">>" at the start of each line.

||~ This is a ||~ table ||
|| Cell 1 || Cell 2 ||
|| Cell 3 || Cell 4 ||

[[=]]
The body font is Rubik.
[[span style="font-family: var(--header-font);"]]The Title font is Parisienne[[/span]]
[[span style="font-family: var(--mono-font);"]]The monospace font used is Courior Prime.[[/span]]
[[/=]]

-----

[[collapsible show="+ Show theme code" hide="- Hide theme code"]]
[[code type="css"]]
@import url('https://fonts.googleapis.com/css?family=Courier+Prime|Parisienne|Rubik&display=swap');

@supports(--css:variables) {

    :root {

    	--theme-base: "black-highlighter";
    	--theme-id: "laruetheme";
    	--theme-name: "La Rue Macabre Theme";
    	--header-title: "La Rue Macabre";
    	--header-subtitle: "Sit a spell & share your story";

    	--logo-image: url("https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/sigil2.png");

    	--body-font: 'Rubik', sans-serif;
    	--header-font: 'Parisienne', cursive;
    	--title-font: 'Rubik', sans-serif;
    	--mono-font: pennsylvania, monospace;

    	--white-monochrome: 255, 250, 240;
    	--pale-gray-monochrome: 244, 244, 244;
    	--light-pale-gray-monochrome: 244, 244, 244;
    	--very-light-gray-monochrome: 215, 215, 215;
    	--light-gray-monochrome: 215, 215, 215;
    	--gray-monochrome: 156, 148, 132;
    	--dark-gray-monochrome: 115, 94, 55;
    	--black-monochrome: 13, 12, 10;
    	--black-monochrome-alt: 54, 48, 43;
    	--bright-accent: 255, 230, 179;
    	--medium-accent: 207, 159, 45;
    	--dark-accent: 70, 56, 33;
    	--newpage-color: 224, 224, 209;
    	--swatch-text-light: 115, 94, 55;

    	--swatch-menubg-color: var(--black-monochrome);
    	--swatch-border-color: var(--swatch-menubg-dark-color);
    	--sidebar-links-text: var(--swatch-menutxt-light-color);

    	--swatch-background: var(--black-monochrome, 26, 25, 24);

    	--rating-module-button-color: var(--bright-accent);
    	--rating-module-button-plus-color: 45, 65, 25;
    	--rating-module-button-negative-color: 70, 35, 30;
    	--rating-module-button-cancel-color: 50, 45, 50;
    	--rating-module-button-credit-color: 50, 45, 50;
    	--rating-module-text-color: var(--bright-accent);
    	--rating-module-text-hover-color: var(--swatch-menutxt-light-color);

    	--background-gradient-color: var(--dark-accent, 70, 56, 33);
    	--header-gradient-color-bottom: var(--dark-accent);
    	--header-gradient-color-middle: var(--black-monochrome);
    	--header-gradient-color-top: var(--black-monochrome);

    	--gradient-header: linear-gradient(30deg,
    			rgb(var(--header-gradient-color-bottom)) 0%,
    			rgb(var(--header-gradient-color-middle)) 90%,
    			rgb(var(--header-gradient-color-top)) 100%);

    	--scrollbar-width: 0.5rem;

    	--header-height-on-desktop: 12rem;
    	--header-height-on-mobile: 12rem;
    	--topbar-height-on-desktop: 1.875rem;
    	--topbar-height-on-mobile: 3rem;

    	scrollbar-color: rgba(var(--dark-gray-monochrome), 1) rgba(var(--black-monochrome), 1);
    }

    html,
    body {
    	color: rgb(var(--white-monochrome));
    }

    a {
    	color: rgb(var(--swatch-primary-darker));
    }

    @supports (background-blend-mode: screen) {

    	#extrac-div-1 {
    		width: 100%;
    		height: var(--header-height-on-desktop);
    		position: absolute;
    		top: 0;
    		left: 0;
    		background-image: var(--gradient-header), url('https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/tilewood.jpg');
    		background-size: var(--header-background-image-size) 80%, 80%, 80%;
    		background-blend-mode: normal;
    		pointer-events: none;
    	}

    	div#extra-div-1 {
    		width: 100%;
    		height: calc(100% - var(--final-header-height-on-desktop));
    		position: absolute;
    		top: calc(var(--final-header-height-on-desktop));
    		left: 0;
    		z-index: -1;
    		background-color: rgba(252, 252, 252, 1);
    		background-color: rgba(var(--swatch-background), 1);
    		mask: var(--gradient-background);
    		-webkit-mask: var(--gradient-background);
    		background-image: url('https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/tilewood.jpg'), var(--gradient-background);
    		background-size: 10%, 100% var(--background-gradient-distance);
    		background-blend-mode: difference;
    		background-repeat: repeat, repeat-x;
    		pointer-events: none;
    	}

    }

    #header {
    	background-repeat: no-repeat;
    	background-position: left 0 top 0.25rem;
    	background-clip: border-box;
    	background-size: auto calc(var(--header-height-on-desktop) - 1rem);
    	-webkit-filter: initial;
    	filter: initial;
    }

    #header h1 a {
    	font-size: 200%;
    	overflow-wrap: normal;
    	padding: 0;
    	margin-top: calc((var(--header-height-on-desktop) - 0.5em)/2);
    	margin-left: calc(var(--header-height-on-desktop) - .75rem);
    }

    #header h1 a::before {
    	color: rgb(255, 219, 90);
    	color: rgb(var(--bright-accent));
    	text-shadow: inherit;
    	background: url("https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/wood.png");
    	background-size: cover;
    	background-clip: text;
    	-webkit-background-clip: text;
    	-webkit-text-fill-color: transparent;
    	overflow-wrap: normal;
    }

    #header h2 span {
    	margin-left: calc(var(--header-height-on-desktop) + 0.75rem);
    }

    #header h2 {
    	font-size: 150%;
    }

    #side-bar:hover {
    	background-color: rgb(var(--black-monochrome-alt), 1);
    	scrollbar-color: rgba(var(--dark-gray-monochrome), 1) rgba(var(--black-monochrome), 1);
    }

    #side-bar {
    	background-color: rgb(var(--black-monochrome-alt));
    	scrollbar-color: rgba(var(--dark-gray-monochrome), 0) rgba(var(--black-monochrome), 0);
    }

    #side-bar div.menu-item {
    	border-bottom: 0.0625rem solid rgb(var(--swatch-menubg-dark-color));
    	border-top: 0.0625rem solid rgb(var(--swatch-menubg-dark-color));
    	margin-top: -0.0625rem;
    }

    #side-bar div.menu-item> :not(:nth-child(2)):not(.collapsible-block) {
    	border-left: 0.0625rem solid rgb(var(--swatch-menubg-dark-color));
    }

    #side-bar .heading,
    #interwiki .heading,
    #side-bar .side-block>.collapsible-block:nth-child(1) .collapsible-block-folded {
    	background: initial;
    }

    #side-bar .heading p,
    #interwiki .heading p,
    #side-bar .side-block>.collapsible-block .collapsible-block-link {
    	color: rgb(var(--swatch-menutxt-dark-color));
    	text-shadow: inherit;
    	letter-spacing: 0.05rem;
    	font-weight: 900;
    	font-size: 1.25rem;
    	position: relative;
    	display: flex;
    	justify-content: center;
    	margin: 1rem 0 1rem 0.5rem;
    	color: rgb(255, 219, 90);
    	color: rgb(var(--bright-accent));
    	text-shadow: inherit;
    	background: url('https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/wood.png');
    	background-size: cover;
    	background-clip: text;
    	-webkit-background-clip: text;
    	-webkit-text-fill-color: transparent;
    	overflow-wrap: normal;
    	font-family: var(--header-font);
    	text-transform: none;
    }

    #side-bar .heading p::after,
    #interwiki .heading p::after,
    #side-bar .side-block>.collapsible-block .collapsible-block-link::after,
    #side-bar .heading p::before,
    #interwiki .heading p::before,
    #side-bar .side-block>.collapsible-block .collapsible-block-link::before {
    	content: " ";
    	position: absolute;
    	width: 100%;
    	height: 0.35rem;
    	background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:laruetheme/elegantdivider.png");
    	background-size: contain;
    	background-repeat: no-repeat;
    	background-position: center;
    }

    #side-bar .side-block[style*="background-color:"] * {
    	margin-left: 0 !important;
    }

    #side-bar>div[style="background-color: #e5e5ff;"]>div.menu-item>div {
    	background-color: rgb(var(--black-monochrome));
    }

    #side-bar .side-block[style*="background-color:"] .heading {
    	margin-top: .25rem;
    }

    #side-bar .heading p::after,
    #interwiki .heading p::after,
    #side-bar .side-block>.collapsible-block .collapsible-block-link::after {
    	bottom: -0.6rem;
    }

    #side-bar .heading p::before,
    #interwiki .heading p::before,
    #side-bar .side-block>.collapsible-block .collapsible-block-link::before {
    	top: -0.6rem;
    }

    #side-bar div.menu-item .sub-text {
    	color: rgba(var(--swatch-primary-darker), 1);
    }

    #page-title {
    	color: rgb(var(--swatch-menutxt-light-color));
    }

    blockquote,
    .blockquote {
    	color: rgb(var(--light-pale-gray-monochrome));
    	border-radius: 10px;
    	border: dashed 1px rgb(var(--black-monochrome-alt));
    	background: rgb(var(--dark-gray-monochrome));
    }

    .yui-navset .yui-content {
    	background-color: rgba(var(--swatch-menubg-dark-color), 0.25);
    }

    .yui-navset .yui-content,
    .yui-navset .yui-navset-top .yui-content {
    	border-color: rgb(var(--swatch-menubg-dark-color));
    }

    .yui-navset .yui-nav a,
    .yui-navset .yui-navset-top .yui-nav a {
    	background-color: rgb(var(--swatch-menubg-black-color));
    	color: rgb(var(--swatch-text-light));
    }

    table.wiki-content-table th {
    	background: rgb(var(--swatch-primary-darkest));
    }

    .code {
    	background-color: rgba(var(--swatch-menubg-dark-color), 0.25);
    }

    .hl-main {
    	-webkit-filter: invert(1) hue-rotate(180deg);
    	filter: invert(1) hue-rotate(180deg);
    }

    .scp-image-block .scp-image-caption {
    	background-color: rgba(var(--swatch-menubg-dark-color), 0.25);
    }

    .scp-image-block img {
    	border: 0.5rem solid rgba(var(--black-monochrome));
    }

    a:visited {
    	color: rgb(var(--swatch-primary-darker));
    }

    h1 {
    	color: rgb(var(--swatch-primary)) !important;
    }

    hr {
    	border-top: none;
    	position: relative;
    	height: 0.35rem;
    	background: rgba(0, 0, 0, 0);
    	display: flex;
    }

    hr::before {
    	content: " ";
    	position: absolute;
    	top: 0.1125rem;
    	left: 0;
    	border-top: none;
    	width: 100%;
    	height: 0.125rem;
    	background: linear-gradient(10deg, rgba(var(--bright-accent), 0.15) 0%, rgba(var(--bright-accent), 1) 50%, rgba(var(--bright-accent), 0.15) 100%);
    	background-position: center center;
    	-webkit-filter: blur(0.04rem);
    	filter: blur(0.04rem);
    }

    hr::after {
    	content: " ";
    	position: absolute;
    	top: 0;
    	left: 50%;
    	transform: translateX(-50%);
    	width: 10%;
    	height: 0.25rem;
    }

    .page-rate-widget-box {
    	background: linear-gradient(to top, rgba(var(--swatch-primary), 0.25) 0, rgba(var(--swatch-primary-darker), 0.15) 100%) !important;
    	font-family: var(--mono-font);
    }

    form#edit-page-form {
    	background-color: rgba(var(--dark-accent), 0.25);
    }

    textarea,
    input.text {
    	background-color: rgb(var(--black-monochrome));
    	color: rgb(var(--white-monochrome));
    	padding: 0.5em;
    }


    #lock-info {
    	background-color: rgb(var(--dark-accent));
    }

    div.buttons input,
    input.button,
    button,
    file,
    a.button {
    	background-color: rgb(var(--medium-accent));
    	color: rgb(var(-black-monochrome));
    	border-color: rgb(var(--black-monochrome))
    }

    div.buttons input:hover,
    input.button:hover,
    button:hover,
    a.button:hover {
    	background-color: rgb(var(--bright-accent));
    }

    div#page-info,
    div.page-watch-options {
    	padding: 0.1em;
    }

    div#page-options-bottom {
    	width: 90%;
    	margin-bottom: 2.125rem;
    	margin-left: auto;
    	margin-right: auto;
    }

    div#page-options-bottom-2 {
    	width: 90%;
    	margin-top: -2.125rem;
    	margin-left: auto;
    	margin-right: auto;
    }

    div#page-options-bottom,
    div#page-options-bottom-2 {
    	text-align: left;
    	flex-wrap: wrap;
    }

    div#page-options-bottom,
    div#page-options-bottom-2,
    div#page-options-bottom>a {
    	display: flex;
    }

    div#page-options-bottom>a,
    div#page-options-bottom-2>a {
    	flex-grow: 2;
    	padding: .25rem;
    	border-radius: .25rem;
    	background-color: rgba(var(--swatch-menubg-dark-color), 0.25);
    	border: 0.125rem solid rgba(var(--swatch-primary), 0.25) !important;
    	font-weight: 700;
    	justify-content: center;
    	transition: background-color 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    }

    div#page-options-bottom-2>a {
    	display: flex;
    }

    div#page-options-bottom>a:hover,
    div#page-options-bottom>a:active,
    div#page-options-bottom-2>a:hover,
    div#page-options-bottom-2>a:active {
    	text-decoration: none;
    	background-color: rgba(var(--swatch-menubg-dark-color), 1);
    	color: rgba(var(--swatch-primary), 1);
    }

    .owindow .title {
    	background-color: rgb(var(--swatch-menubg-dark-color));
    }

    #odialog-container,
    .title.modal-header,
    .owindow,
    .hovertip {
    	background-color: rgb(var(--swatch-primary-darkest));
    }

    .hovertip {
    	border: 1px solid #000 !important;
    	box-shadow: 2px 0px 4px rgba(0, 0, 0, 0.4);
    	border-radius: 4px;
    	max-width: 250px;
    }

    .hovertip .content {
    	background-color: #1f1c17;
    	color: #cec4ae;
    	border-radius: 4px;
    	padding: 4px;
    }

    .owindow .button-bar a {
    	background-color: rgb(var(--swatch-menubg-dark-color));
    	color: rgb(var(--white-monochrome));
    }

    @media only screen and (max-width: 768px) {

    	#header {
    		--size: calc(var(--final-header-height-on-mobile) - 0.875rem);
    		--y-offset: 1.5rem;
    		background-position:
    			calc((var(--header-height-on-mobile) - 3.75rem) - var(--size)) calc(((var(--size) * -1) + var(--header-height-on-mobile) + var(--y-offset)) / 2);
    		background-size: var(--size), 100% var(--header-height-on-mobile);
    		background-repeat: no-repeat, repeat;
    	}

    	#header>h1>a>span {
    		height: var(--header-height-on-mobile);
    	}

    	#header h1 a {
    		line-height: 1;
    	}

    	#header h2 span {
    		line-height: 1.1;
    	}

    }

    @media only screen and (min-width: 600px) and (max-width: 768px) {

    	#header {
    		--size: calc(var(--final-header-height-on-mobile) - 0.875rem);
    		--y-offset: 1.5rem;
    		background-position:
    			calc((var(--header-height-on-mobile) - 3.75rem) - var(--size)) calc(((var(--size) * -1) + var(--header-height-on-mobile) + var(--y-offset)) / 2);
    		background-size: var(--size), 100% var(--header-height-on-mobile);
    		background-repeat: no-repeat, repeat;
    	}

    	#header h1 a {
    		margin-left: calc(var(--header-height-on-mobile) - 3.5rem);
    		margin-top: calc(((var(--header-height-on-mobile) / 2)) - 0.75em);
    		line-height: 1;
    		font-size: 300%;
    	}

    	#header h2 span {
    		margin-left: calc(var(--header-height-on-mobile) - 3.5rem);
    		margin-top: calc(((var(--header-height-on-mobile) / 2) + 0.5em));
    		line-height: 1.1;
    		font-size: 120%;
    	}

    }


    @media only screen and (min-width: 400px) and (max-width: 600px) {

    	#header h1 a {
    		margin-left: calc(var(--header-height-on-mobile) - 3.5rem);
    		margin-top: calc(((var(--header-height-on-mobile) / 2)) - 1em);
    		font-size: 140%;
    	}

    	#header h2 span {
    		margin-left: calc(var(--header-height-on-mobile) - 3.5rem);
    		margin-top: calc(((var(--header-height-on-mobile) / 2) + 0.5em));
    		font-size: 60%;
    	}

    }

    @media only screen and (max-width: 400px) {

    	#header h1 a {
    		margin-left: calc(var(--header-height-on-mobile) - 3.5rem);
    		margin-top: calc(((var(--header-height-on-mobile) / 2)) - 1em);
    		font-size: 125%;
    	}

    	#header h2 span {
    		margin-left: calc(var(--header-height-on-mobile) - 3.5rem);
    		margin-top: calc(((var(--header-height-on-mobile) / 2) + 3.5em));
    		font-size: 35%;
    	}

    }

}

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

[[module css]]
@import url("https://scp-wiki.wdfiles.com/local--code/theme%3Alaruetheme/1");
[[/module]]

[[include :scp-wiki:component:interwiki-style
| priority=3
| theme=https://scp-wiki.wdfiles.com/local--code/theme%3Alaruetheme/1
]]

La Rue Macabre Theme

Module Styles

Inline Styles

Includes

CSS Classes

Page Source