Firekeepers

This is a sub-title div!

This theme was created by Super-Robot14, based off The M.E.O.D. theme.

To import this theme to your page, put the following text anywhere inside it:

[[include :backrooms-wiki:theme:firekeepers]]

Examples

The logo (but bigger because you obviously couldn't see it before)

A horizontal rule can be created with 5 hyphens"-----" and extends across the whole page if it's not placed inside anything. 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.

Titles

+WOAH TITLE

You took

Everything from me

I don't even know who you are

You will

ifyoucanseethisyouarecrazy

Tabulator

This is a tabview.

Tabulation

Hey look, more text here!

How quaint.

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.

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

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

This empty tab has a really long name for some odd reasons. I wonder why?

Empty Tab

Empty Tab

Empty Tab

lmfao

Empty Tab

Empty Tab

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

---

Foot²
Away from sight; we burn the brightest.
Away from sight; we burn the brightest.
Away from sight; we burn the brightest.
Away from sight; we burn the brightest.
Away from sight; we burn the brightest.
Away from sight; we burn the brightest.
^{Away from sight; we burn the brightest.}

_{Away from sight; we burn the brightest.}
Links that do not exist!
Links that do exist!

---

[[div class="styled-quote"]]

[[/div]]

[[div class="dark-styled-quote"]]

[[/div]]

[[div class="lightblock"]]

[[/div]]

[[div class="darkblock"]]

[[/div]]

[[div class="stripe-block"]]

[[/div]]

[[div class="master-quote"]]

[[/div]]

[[div class="noticeblock"]]

[[/div]]

[[div class="document"]]

[[/div]]

[[div class="darkdocument"]]

[[/div]]

code

@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Serif&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
:root {
    --logo-image: url("http://roboboxium.wikidot.com/local--files/theme:firekeepers/firekeepersLogo1.png");
    --header-title: "The Firekeepers";
    --header-subtitle: "On the tails side.";
    --pale-gray-monochrome: 35, 30, 25;
    --very-light-gray-monochrome: 200, 5, 25;
    --white-monochrome: 237,228,200;
    --light-pale-gray-monochrome: 217,208,180;
    --light-gray-monochrome: 21,33,38;
    --gray-monochrome: 240,30,1;
    --dark-gray-monochrome: 255, 150, 10;
    --black-monochrome: 240, 235, 190;
    --bright-accent: 155,40,15;
    --medium-accent: NONE;
    --dark-accent: 25,20,5;
    --pale-accent: 25,20,5;
    --swatch-topmenu-border-color: var(--gray-monochrome);
    --link-color: 255,40,15;
    --hover-link-color: 255,75,50;
    --alt-accent: 255,5,5;
    --background-gradient-distance: 20rem;
    --gradient-header: linear-gradient(to bottom, rgba(235, 180, 5, 1) 0%, rgba(250,95,10) 50%, rgba(var(--gray-monochrome), 1) 100%);
    --diagonal-stripes: linear-gradient(transparent 0);
    --header-height-on-desktop:10rem;
    --header-height-on-mobile: 10rem;
    --swatch-menubg-medium-color: var(--pale-gray-monochrome);
    --swatch-tertiary-color: var(--dark-gray-monochrome);
--swatch-primary-darker: var(--bright-accent);
--visited-link-color: 255, 215, 50;
--rating-module-text-color: var(--black-monochrome);
--quote-shadow: 0 0 5px rgba(var(--dark-gray-monochrome),0.5);
 
    --title-font: 'Times New Roman', serif;
    --header-font: 'Times New Roman', serif;
 
--document-background-color: var(--white-monochrome);
--darkdocument-background-color: var(--dark-accent);
 
--swatch-secondary-color: var(--dark-accent);
 
--header-text-shadow: 0px 0px 7.5px rgba(var(--dark-accent),1);
--header-text-shadow-hover: 0px 3px 10px rgba(var(--dark-accent),1);
}
 
#header:before {
   background-size:auto calc(var(--header-height-on-desktop) - 2rem);
   background-position: center;
    animation:header 4s alternate infinite;
    webkit-animation:header 4s alternate infinite;
opacity: 1;
}
 
@keyframes header {
   0%{
      background-position: center 40%;
   }
   100%{
      background-position: center 60%;
   }
}
 
#header h1, #header h1 a {
    top: 2rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
    top: 2.5rem;
}
 
#toc {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: none;
   padding: 0.5rem
}
 
#toc a {
   color: rgb(var(--swatch-menubg-medium-color));
}
 
.bblock:hover{
   color: rgb(var(--swatch-menubg-medium-color));
}
 
.noticeblock {
    background-color: rgb(var(--white-monochrome));
    background-image: url(http://roboboxium.wikidot.com/local--files/theme:firekeepers/firekeepersLogo1.png);
    background-size:auto 7rem;
    background-position: center bottom;
    background-repeat:no-repeat;
    color: rgb(var(--dark-accent));
    box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
    margin: 3rem;
    padding: 0.2rem 1rem 8rem 1rem;
    position: relative;
border: solid rgb(var(--swatch-tertiary-color)) 0.15rem !important;
}
 
.noticeblock>p:nth-child(1)::before {
    content: "The Firekeepers";
    font-family: 'Times New Roman', serif;
    font-weight: 600;
    font-size: 200%;
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 0.6rem;
    border-bottom: double 0.2rem rgb(var(--dark-accent));
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.noticeblock>p:nth-child(1)::after {
    content: "You'll never look back from the tails side.";
    font-family: 'Times New Roman', serif;
    font-weight: 600;
    font-size: 75%;
    text-align: center;
    margin-top: -4.25rem;
    padding-bottom: 0.3rem;
    max-width: 49rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    align-items: center;
}
 
.noticeblock>p:nth-child(2) {
    margin-top: 4rem;
}
 
:is(.yui-navset,.yui-navset-top,.yui-navset-bottom) .yui-nav a {
color: rgb(var(--dark-accent));
}
 
#header {
--login-line-divider-color: var(--dark-accent);
--login-username-color: var(--dark-accent);
--login-myaccount-color: var(--dark-accent);
--search-icon-color: var(--dark-accent);
--search-textbox-text-color: var(--dark-accent);
--login-dropdown-text-color: var(--dark-accent);
--login-myaccount-hover-color: var(--white-monochrome);
}
 
.scp-image-block, .image-block {
background-color: rgb(var(--swatch-secondary-color));
border: solid rgb(var(--swatch-tertiary-color)) 0.15rem !important;
}
 
#side-bar {
--sidebar-links-text: var(--dark-accent);
}
 
#main-content {
--footnotes-footer-title-bg-color: var(--swatch-tertiary-color);
--footnotes-footer-colorbar-color: var(--swatch-tertiary-color);
--pagetags-text-color: var(--dark-gray-monochrome);
--footnotes-footer-title-text-color: var(--dark-accent);
--pagetags-title-bg: var(--swatch-tertiary-color) !important;
--pagetags-title-text: var(--dark-accent) !important;
}
 
.hovertip {
border: solid rgb(var(--swatch-tertiary-color)) 0.15rem !important;
}
 
#license-area {
--license-text-color: var(--dark-accent);
--license-link-color: var(--dark-accent);
}
 
.f-footer {
color: rgb(var(--dark-accent)) !important;
}
 
.content modal-body {
color: rgb(var(--dark-accent));
}
 
.darkblock {
background: rgb(var(--dark-accent));
}
 
.lightblock {
background: rgb(var(--bright-accent));
}
 
.styled-quote {
background: rgb(var(--bright-accent));
border-left: solid 6px rgb(var(--black-monochrome));
}
 
.dark-styled-quote {
background: rgb(var(--dark-accent));
border-left: solid 6px rgb(var(--black-monochrome));
}
 
 .stripe-block {
    background: repeating-linear-gradient(45deg, rgba(var(--dark-accent), 0.5), rgba(var(--dark-gray-monochrome), 0.5) 15%);
    background-color:rgb(var(--bright-accent));
    color:rgb(var(--text-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: var(--quote-shadow);
    border: solid 0.3rem rgb(var(--dark-gray-monochrome));
 }
 
.master-quote {
font-family: 'Times New Roman', serif;
font-size: 25px;
font-style:    italic;
  margin: auto;
  width: 70%;
  max-width: 75%;
  text-align: center;
  padding: 1rem;
  border-width: 10px;
  border-style: solid;
  border-image: 
    linear-gradient(
      to bottom, 
      rgb(var(--dark-gray-monochrome)), 
      rgba(0, 0, 0, 0)
    ) 1 100%;
 
}
 
.sub-title {
opacity: 0.5;font-size: large;font-family: var(--header-font);position: relative;top: -3rem;font-style: italic;margin: 0 0 -2rem 0;
}
 
#u-infobox {
backdrop-filter: blur(5px);
}
 
#action-area .p {
color: rgb(var(--dark-accent));
}
 
::selection {
background: rgba(var(--dark-gray-monochrome),.5);
}
 
#page-content div:is(.document, .darkdocument) {
    max-width: 45rem;
}
 
div:is(.document, .darkdocument) {
    display: block;
    margin-inline: auto;
    margin-block: 1.5em;
    padding: 1.5rem;
    position: relative;
    --posX: -20vw;
}
 
div.document {
    background-color: rgb(var(--document-background-color));
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 0, 0.1), 0px 6px 15px -4px rgba(0, 0, 0, 0.2);
    color: rgb(var(--dark-accent));
}
 
div.darkdocument {
    background-color: rgb(var(--darkdocument-background-color));
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 10, 0.8), 0px 6px 15px -4px rgba(0, 0, 7, 0.9);
    color: rgb(var(--black-monochrome));
}
 
div:is(.document, .darkdocument)::before,
div:is(.document, .darkdocument)::after {
    content: "";
    height: 98%;
    position: absolute;
    width: 98%;
    z-index: -1;
}
 
div:is(.document, .darkdocument)::before {
    left: -5px;
    top: 4px;
    transform: rotate(-2.5deg);
}
 
div:is(.document, .darkdocument)::after {
    right: -3px;
    top: 1px;
    transform: rotate(1.4deg);
}
 
div:is(.document)::before,
div:is(.document)::after {
    background-color: rgb(var(--document-background-color));
}
 
div:is(.darkdocument)::before,
div:is(.darkdocument)::after {
    background-color: rgb(var(--darkdocument-background-color));
    opacity: 90%;
}
 
div.document::before {
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 0, 0.1), 0px 6px 15px -4px rgba(0, 0, 0, 0.1);
}
 
div.document::after {
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 0, 0.1), 0px 6px 15px -4px rgba(0, 0, 0, 0.05);
}
 
div.darkdocument::before {
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 10, 0.8), 0px 6px 15px -4px rgba(0, 0, 7, 0.9);
}
 
div.darkdocument::after {
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 10, 0.8), 0px 6px 15px -4px rgba(0, 0, 7, 0.05);
}
 
@media only screen and (max-width: 1020px) {
 
    div:is(.document, .darkdocument)::before,
    div:is(.document, .darkdocument)::after {
     display: none;
    }
}
 
:is(.yui-navset,.yui-navset-top,.yui-navset-bottom) .yui-nav a {
color: rgb(var(--tabs-txt)) !important;
}
 
div.page-rate-widget-box, #page-content div.rate-box-with-credit-button {
background: transparent;
}

Footnotes

1. And here's a footnote!

2. note