Our Open Veins Theme

Link to article: Our Open Veins Theme.

@import url(https://scp-wiki.wikidot.com/theme:our-open-veins/code/1);


:root {
    --hover-color: rgb(100,7,14);
    --hover-color-gradient: linear-gradient(151deg, rgba(100,7,14,1) 50%, rgba(198,17,37,1) 100%);
}

/* HEADER */

div#container-wrap {
    background: url(https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/header-coso-darks.png) top center repeat-x;
}

/* BODY */

body {
    background-color: #0F0F0F;
    color: #DBDBDB;
    box-shadow: none;
}

/* SIDE-BAR */

#side-bar .side-block {
    border: solid 2px #bb722e;
} 

#side-bar .side-block.media {
    border: solid 2px #bb722e;
}

/* RATING */
 
div.page-rate-widget-box .rate-points {
    border: solid 1px #bb722e;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    border-top: solid 1px #bb722e;
    border-bottom: solid 1px #bb722e;
}

.page-rate-widget-box .cancel {
    border: solid 1px #bb722e;
}
 
/* RATING WITH INFO MODULE */
 
#page-content .rate-box-with-credit-button {
    border: 1px solid #bb722e;
}
 
.close-credits,
.credit-back {
    filter: hue-rotate(113deg);
}

/* TABS */

.yui-navset .yui-content {
    background: rgb(36,29,29,0.7);
    color: #DBDBDB;
}

/* SPECIAL HORIZONTAL LINE */

.serpiente {
    filter: brightness(0) saturate(100%) invert(100%) sepia(3%) saturate(11%) hue-rotate(100deg) brightness(104%) contrast(100%);
}

/* BLOCKQUOTE */

blockquote,
div.blockquote {
    background-color: rgb(36,29,29,0.7);
}

/* TOC */
 
#toc {
    background-color: rgb(36,29,29,0.7);
}

/* IMAGE CAPTION */

.scp-image-block {
    border: solid 1px rgba(36,29,29,0.7);
}

.scp-image-block .scp-image-caption {
    background: #1d1818;
}

/* TABLES */

table.wiki-content-table td {
    border: solid 1px #1d1818;
}

table.wiki-content-table td {
    border: solid 1px #1d1818;
    background: rgba(36,29,29,0.7);
}

/* SELECTION */
 
::selection {
    color: #000;
}

/* FOOTNOTE */

.hovertip {
    color: #DBDBDB;
    background-color: #1d1818 !important;
}

/* OWINDOW */
 
.owindow {
    background-color: #1d1818;
}

/* MODALBOX */

.modalbox {
    background: linear-gradient(#1d1818 51px, #1d1818 51px, #2f1313) !important;
}

/* H1 */

h1 {
    color: #FF1F31;
}

/* LINKS */

a {
    color: FF1F31;
}

a:visited {
    color: FF1F31;
}

/* CODE */

.code {
    background-color: #1d1818;
}

.hl-identifier,
.hl-brackets,
.hl-code {
    color: #DBDBDB;
}

/* TEXT EDITOR */
 
 input.text,
 input.text:focus,
 input.text:hover{
     color: #A3A3A3;
     border: none;
     background-color: #212121;
}
 
.wd-editor-toolbar-panel div {
     filter: hue-rotate(62deg) invert(83%);
}
 
 textarea {
     color: #A3A3A3;
     border-color: #A3A3A3;
     background-color: #212121;
}
 
.change-textarea-size a{
     color: #A3A3A3;
     border-color: #A3A3A3;
     background-color: #212121;
}
 
 div#lock-info {
     background-color: #000;
     color: #B5B5B5;
}
 div#lock-info span#lock-timer {
     color: #901;
}
 
 div.buttons input, input.button, button, file, a.button {
     color: #FFF;
     background-color: #000;
}

 div.buttons input:hover, input.button:hover, button:hover, file:hover, a.button:hover {
     color: #FFF;
}

background-color: rgba(224, 255, 239, 0.7); border: dotted 1px black; padding: 0 1em; display: block; margin: 1em; width: 55%;

```
header
```
```
serpiente
```
```
serpiente
```

[[module CSS]]
@import url(https://scp-wiki.wikidot.com/theme:our-open-veins/code/1);
[[/module]]

[[include :scp-wiki:component:toggle-sidebar]]
[[div class="header"]]
[[/div]]

[[include component:interwiki-style
| priority=1
| theme=https://scp-wiki.wdfiles.com/local--code/theme:our-open-veins/1
]]

[[include component:interwiki-style
| priority=1
| theme=https://scp-wiki.wdfiles.com/local--code/theme:our-open-veins/1
]]

[[iftags +theme]]

[[include :scp-wiki:info:start]]
This is the Our Open Veins Theme, , a theme created by [[*user Dc_Yerko]] with indications of [[*user Kilerpoyo]] to be used in articles which setting is the [https://scp-wiki.wikidot.com/our-open-veins-hub Our Open Veins canon].
[[include :scp-wiki:info:end]]

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

[[f>toc]]

+ Use

This is the Our Open Veins Theme, , a theme created by [[*user Dc_Yerko]] with indications of [[*user Kilerpoyo]] to be used in articles which setting is the [https://scp-wiki.wikidot.com/our-open-veins-hub Our Open Veins canon].

To import this theme, just put this line in the upper part of your article:

> @@[[include theme:our-open-veins]]@@

Easy[[footnote]]The Blood Of Our Open Veins Will Write Our History[[/footnote]][[footnote]]Ah, yeah, and this is how footnotes looks like.[[/footnote]]

+ Usage of Color Variations

This theme has color variations, that is, alternative versions of the same theme but with some, or all, of its colors changed. This theme has 1 different color variation

[[include component:image-block name=https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/Dark%20Mode.png|caption=Our Dark Veins|width=225px]]

++ Our Dark Veins

This variation brings the dark colors of the night with some bloody details.

Good for darker tales.

To import the Our Dark Veins variation, put the following at the upper part of your article:

> @@[[include theme:our-open-veins |our-dark-veins= --]]]@@

----

[[include component:image-block name=https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/Florcita.png|caption=Bloom|width=225px]]

+* Examples

A horizontal line like the one above can be created with four dashes, like this: @@“----”@@. A small but thick separator hyphen can be created by placing the following: “@@+ -----@@”.

----

To make an special horizontal line like the one below, you can use the following code:

[[div style="background-color: rgba(224, 255, 239, 0.7); border: dotted 1px black; padding: 0 1em; display: block; margin: 1em; width: 55%;"]]
@@[[div class="serpiente"]]@@
@@[[/div]]@@
[[/div]]

@@ @@

[[div class="serpiente"]]
[[/div]]

[[collapsible show="Titles" hide="Titles"]]
+* Title 1

++* Title 2

+++* Title 3

++++* Title 4

+++++* Title 5

++++++* Title 6
[[/collapsible]]

[[tabview]]
[[tab Tabulator]]
This is a tab.
[[/tab]]
[[tab Tabulation]]
Hey, there's more text over here!

Open fire!
[[/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.

This is a long tab. It contains a lot of text.
[[/tab]]
[[tab Longer Tab That's Actually Very Long As You Can See Here, Yeah]]
But just for the tab, here down there's nothing aside from me...

I feel lonely.
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
@@ @@
----
[[=]]
**This one was not empty. Ravens have located you and are on their way.**
[[/=]]
----
@@ @@
[[/tab]]
[[/tabview]]

> This is a quote box, created by putting “> ” at the beginning of each line. Note that the space after the symbol is always necessary, even when only an empty line is used to separate paragraphs.
>
> More text.
> -----
> This is a horizontal line. So much style.
>
>> And this is what we call //Inception//[[footnote]]Or Incepveins if you please.[[/footnote]].

||~ This is ||~ a table ||
|| I always forgot || how to use this things ||
|||| although it is not as difficult as it seems ||

[[footnoteblock]]

----

+ Source Code

[[collapsible show="Show Code" hide="Hide Code"]]

[[code type="css"]]

@import url('https://fonts.googleapis.com/css2?family=Rubik+Distressed&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Road+Rage&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');

/* ROOT */

:root {
    --hover-color: rgb(158,173,66);
    --hover-color-gradient: linear-gradient(151deg, rgba(158,173,66,1) 50%, rgba(195,172,15,1) 100%);
}

/* HEADER */

div#container-wrap {
    background: url(https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/header-coso.png) top center repeat-x;
}

#header {
    height: 18rem;
    position: relative;
    z-index: 10;
    padding-bottom: 22px;
    background-repeat: no-repeat;
    background-size: 175px;
    background-position: 1rem  3rem;
}

/* BODY */

body {
    background-color: #EEFFF6;
    box-shadow: 0 0 0 #eefff6, 0 0 6em #d1f0e0 inset, 0px 0px 13px 0px rgba(177,224,119,0.52);
    font-family: "Jost", serif;
}

#container-wrap-wrap {
    overflow: hidden;
}

/* LINKS */

.a,
a:visited,
a.newpage,
a:newpage {
color: #FF1F31:
}

/* TOP-BAR */

#top-bar {
    top: 18rem;
    right: 0;
    height: 3rem;
    line-height: 3rem;
    display: flex;
    justify-content: center;
}

#top-bar a {
    color: #FFF;
}

#top-bar ul li a {
    border-left: solid 1px rgba(255, 0, 0, 0);
    border-right: solid 1px rgba(255, 0, 0, 0);
    text-decoration: none;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 0px;
    max-height: 1px;
    overflow: hidden;
    background-color: #BB722E;
}
 
#top-bar ul li.sfhover a,
#top-bar ul li:hover a {
    background: rgb(187,114,46);
    background: linear-gradient(151deg, rgba(187,114,46,1) 50%, rgba(159,90,25,1) 100%);
    color: #FFF;
    border-left: solid 1px #a98644;
    border-right: solid 1px #a98644;
}
 
#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
    border-width: 0;
    width: 150px;
    line-height: 160%;
    height: auto;
    max-height: none;
    padding-top: 0;
    padding-bottom: 0;
}
 
#top-bar ul li.sfhover a:hover,
#top-bar ul li:hover a:hover {
    background: var(--hover-color);
    background: var(--hover-color-gradient);
    color: #FFF;
    text-decoration: none;
}

.topbar_arrow {
    color: #FFF;
}

/* TOP BAR MOBILE */

@media (max-width: 767px) {
    .mobile-top-bar {
        right: 0;
        display: flex;
        justify-content: center;
        height: 3rem;
        line-height: 3rem;
        padding-top: 6px;
    }
}

/* HEADER LOGO */
 
#header {
    background: none;
}

/* HEADER TITLE */
 
#header h1 {
    margin-left: 0;
    float: none;
    text-align: center;
    position: absolute;
    width: 100%;
    filter: none;
    content: "";
}

#header h2 {
    margin-left: 0;
    float: none;
    text-align: center;
    position: absolute;
    width: 100%;
    filter: none;
    content: "";
}
 
#header h1 a {
    content: "";
    max-height: initial;
    display: block;
    height: 17rem;
    width: auto;
    margin: auto;
    margin-top: 1.3rem;
    padding: 0;
    color: transparent;
    text-shadow: none;
    filter: none;
}
 
#header h1 a::before {
    display: inline-block;
    width: 100%;
    text-align: center;
    content: "Our Open Veins";
    color: #FFF;
    position: absolute;
    left: 0%;
    top: 150%;
    font-size: 50px;
    font-family: "Rubik Distressed", serif;
    font-weight: 400;
    font-style: normal;
    text-shadow: rgb(0, 0, 0) 6px 0px 0px, rgb(0, 0, 0) 5.91686px 0.995377px 0px, rgb(0, 0, 0) 5.66974px 1.96317px 0px, rgb(0, 0, 0) 5.2655px 2.87655px 0px, rgb(0, 0, 0) 4.71532px 3.71022px 0px, rgb(0, 0, 0) 4.03447px 4.44106px 0px, rgb(0, 0, 0) 3.24181px 5.04883px 0px, rgb(0, 0, 0) 2.35931px 5.51667px 0px, rgb(0, 0, 0) 1.41143px 5.83163px 0px, rgb(0, 0, 0) 0.424423px 5.98497px 0px, rgb(0, 0, 0) -0.574341px 5.97245px 0px, rgb(0, 0, 0) -1.55719px 5.79441px 0px, rgb(0, 0, 0) -2.49688px 5.45578px 0px, rgb(0, 0, 0) -3.36738px 4.96596px 0px, rgb(0, 0, 0) -4.14455px 4.33852px 0px, rgb(0, 0, 0) -4.80686px 3.59083px 0px, rgb(0, 0, 0) -5.33596px 2.74364px 0px, rgb(0, 0, 0) -5.71718px 1.8204px 0px, rgb(0, 0, 0) -5.93996px 0.84672px 0px, rgb(0, 0, 0) -5.99811px -0.150428px 0px, rgb(0, 0, 0) -5.89004px -1.14341px 0px, rgb(0, 0, 0) -5.61874px -2.1047px 0px, rgb(0, 0, 0) -5.19172px -3.00766px 0px, rgb(0, 0, 0) -4.62082px -3.82727px 0px, rgb(0, 0, 0) -3.92186px -4.54081px 0px, rgb(0, 0, 0) -3.11421px -5.12852px 0px, rgb(0, 0, 0) -2.22026px -5.57409px 0px, rgb(0, 0, 0) -1.26477px -5.86518px 0px, rgb(0, 0, 0) -0.274238px -5.99373px 0px, rgb(0, 0, 0) 0.723898px -5.95617px 0px, rgb(0, 0, 0) 1.70197px -5.75355px 0px, rgb(0, 0, 0) 2.63288px -5.39147px 0px, rgb(0, 0, 0) 3.49082px -4.87998px 0px, rgb(0, 0, 0) 4.25202px -4.23324px 0px, rgb(0, 0, 0) 4.89538px -3.46919px 0px, rgb(0, 0, 0) 5.40307px -2.60899px 0px, rgb(0, 0, 0) 5.76102px -1.67649px 0px, rgb(0, 0, 0) 5.95932px -0.697531px 0px;
}
 
@media (max-width: 767px) {
  #header h1 a::before {
    font-size: 25px;
  }
}

@media (max-width: 350px) {
  #header h1 a::before {
    font-size: 20px;
  }
}
 
/* HEADER SUBTITLE */
 
#header h2 span {
    position: relative;
    display: block;
    line-height: 0px;
    font-weight: bold;
    color: transparent;
    text-shadow: none;
    filter: none;
    padding: 0;
    max-height: initial;
    display: block;
    height: 17rem;
    width: auto;
    margin: auto;
    margin-top: 1.3rem;
    z-index: -5;
}
 
#header h2 span::before {
    margin: 0;
    filter: none;
    display: inline-block;
    width: 100%;
    text-align: center;
    content: "Will Write Our History";
    color: #FFF;
    background: #000;
    text-shadow: rgb(0, 0, 0) 4px 0px 0px, rgb(0, 0, 0) 3.87565px 0.989616px 0px, rgb(0, 0, 0) 3.51033px 1.9177px 0px, rgb(0, 0, 0) 2.92676px 2.72656px 0px, rgb(0, 0, 0) 2.16121px 3.36588px 0px, rgb(0, 0, 0) 1.26129px 3.79594px 0px, rgb(0, 0, 0) 0.282949px 3.98998px 0px, rgb(0, 0, 0) -0.712984px 3.93594px 0px, rgb(0, 0, 0) -1.66459px 3.63719px 0px, rgb(0, 0, 0) -2.51269px 3.11229px 0px, rgb(0, 0, 0) -3.20457px 2.39389px 0px, rgb(0, 0, 0) -3.69721px 1.52664px 0px, rgb(0, 0, 0) -3.95997px 0.56448px 0px, rgb(0, 0, 0) -3.97652px -0.432781px 0px, rgb(0, 0, 0) -3.74583px -1.40313px 0px, rgb(0, 0, 0) -3.28224px -2.28625px 0px, rgb(0, 0, 0) -2.61457px -3.02721px 0px, rgb(0, 0, 0) -1.78435px -3.57996px 0px, rgb(0, 0, 0) -0.843183px -3.91012px 0px, rgb(0, 0, 0) 0.150409px -3.99717px 0px, rgb(0, 0, 0) 1.13465px -3.8357px 0px, rgb(0, 0, 0) 2.04834px -3.43574px 0px, rgb(0, 0, 0) 2.83468px -2.82216px 0px, rgb(0, 0, 0) 3.44477px -2.03312px 0px, rgb(0, 0, 0) 3.84068px -1.11766px 0px, rgb(0, 0, 0) 3.9978px -0.132717px 0px;
    font-size: 35px;
    position: absolute;
    left: 0%;
    top: 60%;
    font-weight: bold;
    font-family: "Road Rage", serif;
    font-weight: 400;
    font-style: normal;
}
 
@media (max-width: 767px) {

#header h2 span::before {
    content: 'Will Write Our History';
    font-size: 25px;
}
}

/* SIDE-BAR */

#side-bar .side-block {
    background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/sidebar.png");
    background-position: center center;
    background-repeat: repeat-y;
    background-color: #000;
    border: solid 2px #000;
    background-size: contain;
    box-shadow: none;
} 

#side-bar .side-block.media {
    background-color: #000;
    border: solid 2px #000;
    box-shadow: none;
}

#side-bar .side-block.media img {
    filter: none;
}

#side-bar,
#side-bar:is(:hover,:active,:focus-within)  {
    scrollbar-color: #BB722E #000 !important;
}

#side-bar a,
#side-bar a:visited,
#side-bar a.newpage {
    color: #FFF;
}

#side-bar a.collapsible-block-link {
    color: #FFF;
}

#side-bar .heading {
    color: #FFF;
    border-bottom: solid 1px #FFF;
}

#side-bar .side-block img {
    filter: grayscale(100%) brightness(200%) saturate(0%) contrast(1000%) invert(100%);
}

#side-bar .side-block.resources {
    background-color: #000;
    border: solid 2px #000;
    box-shadow: none;
}

/* INTERWIKI */

#interwiki .side-block {
    background-color: #000;
    border: solid 2px #000;
    box-shadow: none;
}
 
#interwiki .heading {
    color: #FFF;
    border-bottom: solid 1px #FFF;
}
 
#interwiki a,
#interwiki a:visited,
#interwiki a.newpage {
    color: #FFF;
}
 
#interwiki .menu-item img {
    filter: grayscale(100%) brightness(200%) saturate(0%) contrast(1000%) invert(100%);
}

/* SIDE-BAR BUTTON */
 
@media (max-width: 767px) {
    #side-bar {
        opacity: 1;
        background-color: #000;
        border-top: none !important;
        border-left: none !important;
        border-bottom: none !important;
        border-right:  solid 1px #000 !important;
    }
}
 
.open-menu a,
#top-bar .open-menu a {
    border: 4px solid #B56F2D !important;
    background-color: #000 !important;
    color: #FFF !important;
    z-index: 35;
}
 
.open-menu a:hover,
#top-bar .open-menu a:hover {
    border: solid 2px #B56F2D;
    background-color: #B56F2D;
    color: #FFF;
    box-shadow: none;
}

/* RATING */
 
div.page-rate-widget-box .rate-points {
    background-color: #1d1818;
    border: solid 1px #1d1818;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background: #FFF;
    border-top: solid 1px #1d1818;
    border-bottom: solid 1px #1d1818;
}
 
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    color: #000;
    font-weight: bold;
}
 
.page-rate-widget-box .rateup a:hover {
    background: rgb(158,173,66);
    background: linear-gradient(151deg, rgba(158,173,66,1) 50%, rgba(195,172,15,1) 100%);
    color: #FFF;
}

.page-rate-widget-box .ratedown a:hover {
    background: rgb(68,7,14);
    background: linear-gradient(151deg, rgba(68,7,14,1) 50%, rgba(198,17,37,1) 100%);
    color: #FFF;
}

.page-rate-widget-box .cancel {
    background-color: #1d1818;
    border: solid 1px #1d1818;
}
 
.page-rate-widget-box .cancel a {
    color: #ffffff;
}
 
.page-rate-widget-box .cancel a:hover {
    background: #1d1818;
    color: red;
}
 
/* RATING WITH INFO MODULE */
 
#page-content .rate-box-with-credit-button {
    background-color: #1d1818; 
    border: 1px solid #1d1818;
    box-shadow: 1px 1px 3px rgba(0,0,0,.5);
}
 
#page-content .rate-box-with-credit-button .creditButton p a {
    border-left-color: #ffffff;
}
 
#page-content .rate-box-with-credit-button .fa-info {
     border-color: #ffffff;
     color: #ffffff;
}
#page-content .rate-box-with-credit-button .fa-info:hover {
     color: #f7bb25;
}
 
.close-credits,
.credit-back {
    filter: hue-rotate(140deg);
}
 
#page-content .modalbox {
    box-shadow: 0 2px 6px rgba(0,30,0,.5);
}

/* LOGIN STATUS */

#login-status {
    background-color: #BB722E;
    color: #FFF;
    font-weight: bold;
    top: 1.2rem;
    left: 10px;
    right: initial;
    border-left: solid 5px #BB722E;
    border-right: solid 5px #BB722E;
    z-index: 13;
}

#login-status a {
    color: #FFF;
}

#account-topbutton {
    color: #FFF;
    border: solid 1px #FFF;
}

#login-status ul a {
    color: #FFF;
}

#login-status ul a:hover {
    color: #FFF;
    background: var(--hover-color);
    background: var(--hover-color-gradient);
}

#account-options {
    border-top: solid 1px #bb722e;
    border-left: solid 1px #000;
    border-right: solid 1px #000;
    border-bottom: solid 1px #000;
    background: rgb(187,114,46);
    background: linear-gradient(151deg, rgba(187,114,46,1) 50%, rgba(159,90,25,1) 100%);
}

/* SEARCH */

#search-top-box {
    top: 1.2rem;
    right: 10px;
}

#search-top-box-form input[type=submit] {
    background: #BB722E;
    color: #FFF;
    border: none;
    border-radius: 0px;
    font-weight: bold;
    box-shadow: none;
}

#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus {
    background: var(--hover-color);
    background: var(--hover-color-gradient);
    color: #FFF;
    border: none;
    font-weight: bold;
    box-shadow: none;
}

/* PAGE TITLE */

#page-title {
    text-align: center;
    border-bottom: solid 1px black;
    font-family: "Rubik Distressed", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 250%;
    text-transform: uppercase;
    padding-bottom: 0px;
    border-bottom: solid 1px #901;
    text-shadow: 0px 0px 0px #901;
}

/* H1 TITLE */

h1 {
    font-family: "Rubik Distressed", serif;
    font-weight: 400;
    font-style: normal;
    text-shadow: 0px 0px 0px #901;
}

/* HORIZONTAL LINE */

hr {
    background: #901;
}

/* TAGS */

.page-tags span {
    border-top: solid 1px black;
}

/* TABLES */

table.wiki-content-table th {
    color: #FFF;
    border: solid 1px black;
    background: rgb(187,114,46);
    background: linear-gradient(151deg, rgba(187,114,46,1) 50%, rgba(159,90,25,1) 100%);
}

table.wiki-content-table td {
    border: solid 1px black;
}

/* FOOTNOTE */

.hovertip {
    color: #FFF;
    background-color: #000 !important;
}

/* SELECTION */
 
::selection {
    background-color: #BB722E;
    color: #FFF;
}

/* SCROLLBAR */
 
::-webkit-scrollbar {
    width: 13px;
}
 
::-webkit-scrollbar-thumb {
    background: rgb(187,114,46);
    background: linear-gradient(151deg, rgba(187,114,46,1) 50%, rgba(159,90,25,1) 100%);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--hover-color);
    background: var(--hover-color-gradient);
}
 
::-webkit-scrollbar-track {
    background: #000;
}

/* IMAGE CAPTION */

.scp-image-block {
    border: solid 1px black;
    box-shadow: none;
}

.scp-image-block .scp-image-caption {
    background-color: #000;
    color: #FFF;
    border-top: solid 1px black;
}

/* TABS */
 
.yui-navset .yui-content {
    background: rgb(224,255,227);
    background: linear-gradient(171deg, rgba(238,255,246,1) 50%, rgba(224,255,227,1) 100%);
    border: solid 1px black;
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background: rgb(187,114,46);
    background: linear-gradient(151deg, rgba(159,90,25,1) 50%, rgba(132,75,21,1) 100%);
    color: #FFF;
    border-top: solid 1px #000;
    border-left: solid 1px #000;
    border-right: solid 1px #000;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
    background: var(--hover-color);
    background: var(--hover-color-gradient);
    color: #FFF;
    border: solid 1px #000;
    font-weight: bold;
}
 
.yui-navset .yui-nav a:focus,
.yui-navset .yui-nav a:hover {
    background: #000;
    color: #FFF;
    border: solid 1px #000;
}
 
.yui-navset .yui-nav a em,
.yui-navset .yui-navset-top .yui-nav a em {
    border: none;
}
 
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
     display: flex;
     flex-wrap: wrap;
     width: 100%;
     margin: 0 auto;
     box-shadow: none;
     border-color: #000;
}
 
.yui-navset .yui-nav a em,
.yui-navset .yui-navset-top .yui-nav a em {
     border: 0px;
     padding: .35em .75em;
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a em {
     display: flex;
     flex-grow: 2;
     max-width: 100%;
     align-items: center;
     justify-content: center;
}
 
.yui-navset .yui-nav .selected, .yui-navset .yui-navset-top .yui-nav .selected {
    margin: 0;
}
 
 .yui-navset .yui-nav li,
 .yui-navset .yui-navset-top .yui-nav li {
     position: relative;
     display: flex;
     flex-grow: 2;
     max-width: 100%;
     margin: 0;
     padding: 0;
}
 .yui-navset .yui-nav li a,
 .yui-navset-top .yui-nav li a,
 .yui-navset-bottom .yui-nav li a {
     display: flex;
     align-items: center;
     justify-content: center;
     width: 100%;
}
 .yui-navset .yui-nav li em{
     border: unset;
}

/* BLOCKQUOTE */
 
blockquote,
div.blockquote {
    background-color: rgba(224, 255, 239, 0.7);
    border: dotted 1px black;
}

/* TOC */
 
#toc {
    background-color: rgba(224, 255, 239, 0.7);
    border: dotted 1px black;
}

/* OWINDOW */
 
.owindow {
    background-color: #EEFFF6;
    border: solid 0px #000;
}
 
.owindow h1 {
    color: #951919;
}
 
.owindow .title {
    background-color: #bb722e;
    color: #FFF;
}
 
.owindow img {
    background-color: #EEFFF6 !important;
}
 
.owindow .button-bar a {
    background-color: #bb722e;
    color: #FFF;
    border-top: solid 1px #000;
    border-left: solid 1px #000;
    border-right: solid 1px #000;
    border-bottom: solid 1px #000;
}
 
.owindow .button-bar a:hover {
    color: #FFF;
    background: var(--hover-color);
    background: var(--hover-color-gradient);
}
 
.owindow.owait {
    border: solid 2px black;
}
 
.owindow.owait .content{
    background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/flor-loader.gif");
    background-position: center center;
    background-size: contain;
}

/* MODALBOX */

.close-credits, .credit-back {
    filter: hue-rotate(13deg) !important;
}

/* CODE */

.code {
    background-color: rgba(224, 255, 239, 0.7);
    border: solid 1px black;
}

/* SPECIAL HORIZONTAL LINE */

.serpiente {
    background-image: url('https://scp-yerko-7.wdfiles.com/local--files/hr/linea%20horizontal.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
    background-color: transparent;
    color: transparent;
    margin: 1em 2em;
    padding: 0;
    height: 30px;
    border: none;
    display: block;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: auto;
    margin-inline-end: auto;
    unicode-bidi: isolate;
    overflow: hidden;
}

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

[[/iftags]]

[!-- {$our-dark-veins}
[[module css]]

:root {
    --hover-color: rgb(100,7,14);
    --hover-color-gradient: linear-gradient(151deg, rgba(100,7,14,1) 50%, rgba(198,17,37,1) 100%);
}

/* HEADER */

div#container-wrap {
    background: url(https://scp-wiki.wdfiles.com/local--files/theme:our-open-veins/header-coso-darks.png) top center repeat-x;
}

/* BODY */

body {
    background-color: #0F0F0F;
    color: #DBDBDB;
    box-shadow: none;
}

/* SIDE-BAR */

#side-bar .side-block {
    border: solid 2px #bb722e;
} 

#side-bar .side-block.media {
    border: solid 2px #bb722e;
}

/* RATING */
 
div.page-rate-widget-box .rate-points {
    border: solid 1px #bb722e;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    border-top: solid 1px #bb722e;
    border-bottom: solid 1px #bb722e;
}

.page-rate-widget-box .cancel {
    border: solid 1px #bb722e;
}
 
/* RATING WITH INFO MODULE */
 
#page-content .rate-box-with-credit-button {
    border: 1px solid #bb722e;
}
 
.close-credits,
.credit-back {
    filter: hue-rotate(113deg);
}

/* TABS */

.yui-navset .yui-content {
    background: rgb(36,29,29,0.7);
    color: #DBDBDB;
}

/* SPECIAL HORIZONTAL LINE */

.serpiente {
    filter: brightness(0) saturate(100%) invert(100%) sepia(3%) saturate(11%) hue-rotate(100deg) brightness(104%) contrast(100%);
}

/* BLOCKQUOTE */

blockquote,
div.blockquote {
    background-color: rgb(36,29,29,0.7);
}

/* TOC */
 
#toc {
    background-color: rgb(36,29,29,0.7);
}

/* IMAGE CAPTION */

.scp-image-block {
    border: solid 1px rgba(36,29,29,0.7);
}

.scp-image-block .scp-image-caption {
    background: #1d1818;
}

/* TABLES */

table.wiki-content-table td {
    border: solid 1px #1d1818;
}

table.wiki-content-table td {
    border: solid 1px #1d1818;
    background: rgba(36,29,29,0.7);
}

/* SELECTION */
 
::selection {
    color: #000;
}

/* FOOTNOTE */

.hovertip {
    color: #DBDBDB;
    background-color: #1d1818 !important;
}

/* OWINDOW */
 
.owindow {
    background-color: #1d1818;
}

/* MODALBOX */

.modalbox {
    background: linear-gradient(#1d1818 51px, #1d1818 51px, #2f1313) !important;
}

/* H1 */

h1 {
    color: #FF1F31;
}

/* LINKS */

a {
    color: FF1F31;
}

a:visited {
    color: FF1F31;
}

/* CODE */

.code {
    background-color: #1d1818;
}

.hl-identifier,
.hl-brackets,
.hl-code {
    color: #DBDBDB;
}

/* TEXT EDITOR */
 
 input.text,
 input.text:focus,
 input.text:hover{
     color: #A3A3A3;
     border: none;
     background-color: #212121;
}
 
.wd-editor-toolbar-panel div {
     filter: hue-rotate(62deg) invert(83%);
}
 
 textarea {
     color: #A3A3A3;
     border-color: #A3A3A3;
     background-color: #212121;
}
 
.change-textarea-size a{
     color: #A3A3A3;
     border-color: #A3A3A3;
     background-color: #212121;
}
 
 div#lock-info {
     background-color: #000;
     color: #B5B5B5;
}
 div#lock-info span#lock-timer {
     color: #901;
}
 
 div.buttons input, input.button, button, file, a.button {
     color: #FFF;
     background-color: #000;
}

 div.buttons input:hover, input.button:hover, button:hover, file:hover, a.button:hover {
     color: #FFF;
}

[[/module]]
[!----]

Our Open Veins Theme

Module Styles

Inline Styles

Includes

CSS Classes

Page Source