Minimalist BHL Theme

Link to article: Minimalist BHL Theme.

Module Styles

• @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");

• >> :root { 
  >> @<    >@ @@--header-title: "title here";@@
  >> @<    >@ @@--header-subtitle: "subtitle here";@@
  >> @<    >@ @@--lgurl: url('your url here');@@
  >> }
  >> [[/module]]
  + EXAMPLES
  
  [[include component:image-block name=http://pokm.wdfiles.com/local--files/6000contestrespectators-pedagon/Ar6AfDt.png|caption=Department of Sciences Logo|width=200px]]
  
  A horizontal rule can be created with 5 hyphens[[footnote]]This statement was made solely to anger [[*user Placeholder McD]], as well as showcase what footnotes look like.[[/footnote]] "@@-----@@" 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.
  
  [http://www.google.com A link you probably visited once, idk]
  
  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]]
  Why was the shovel so special?
  
  Because it was a groundbreaking invention
  [[/tab]]
  [[tab Tabulation]]
  More text.
  
  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 This empty tab right here has a really long name.]]
  [[/tab]]
  [[tab Empty Tab]]
  [[/tab]]
  [[tab Empty Tab]]
  [[/tab]]
  [[tab Empty Tab]]
  [[/tab]]
  [[tab Empty Tab]]
  [[/tab]]
  [[tab Empty Tab]]
  [[/tab]]
  [[/tabview]]
  @@ @@
  > This is a blockquote, created by putting "> " at the start of each line.
  > 
  > Look! Even more text!
  > -----
  > That's a horizontal rule. Pretty nifty, right?
  > 
  >> Want to hear a joke about paper?
  >> 
  >> Actually... meh, nevermind. It's pretty tearable.
  >> 
  >>> Are you starting to get the point of these yet?
  
  ||~ This is a ||~ table ||
  ||You should know || how to make these ||
  ||||already ||
  
  [[=]]
  [[span style="font-family:var(--body-font); font-size: calc(var(--base-font-size) * 1.25);"]]The body font is [https://fonts.google.com/specimen/Raleway Raleway].[[/span]]
  [[span style="font-family:var(--header-font); font-size: calc(var(--base-font-size) * 1.25);"]]The header and title font is [https://fonts.google.com/specimen/Poppins Poppins].[[/span]]
  [[span style="font-family:var(--mono-font); font-size: calc(var(--base-font-size) * 1.25);"]]The monospace font is [https://fonts.google.com/specimen/Recursive Recursive].[[/span]]
  [[/=]]
  
  [[footnoteblock]]
  
  @@ @@
  
  [[collapsible show="+ Show theme code" hide="- Hide theme code"]]
  [[code type="css"]]
  :root {
      /* S-CSS-P Integration */
      /* If you're making a new CSS theme, please include the following three variables at minimum. */
      --theme-base: "black-highlighter";
      /* must be either "black-highlighter" or "sigma9" */
      --theme-id: "minimalist-bhl";
      /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
      --theme-name: "Minimalist BHL";
      /* set this to your theme's full name */
  
      --header-title: "SCP FOUNDATION";
      --header-subtitle: "SECURE - CONTAIN - PROTECT";
      --logo-image: url('https://scp-wiki.wdfiles.com/local--files/component:pride-highlighter/gp_logo.svg');
      --lgurl: var(--logo-image);
  
      --bright-accent: 245, 245, 245;
      --dark-accent: 36, 36, 36;
      --swatch-primary: var(--dark-accent);
      --light-gray-monochrome: 196, 196, 196;
      --dark-gray-monochrome: 200, 200, 200;
      --medium-accent: var(--dark-accent);
      --tab-border-color: var(--bright-accent);
      --hover-link-color: var(--dark-accent);
      --rating-module-button-color: var(--dark-accent);
      --rating-module-button-credit-color: var(--dark-accent);
      --swatch-background: var(--bright-accent);
      /* Background and Header Colors */
      --background-color: var(--bright-accent);
      /* Primary Text Colors */
      --swatch-text-light: var(--dark-accent);
      --swatch-text-general: var(--dark-accent);
      /* Primary Menu Colors */
      --swatch-menubg-color: var(--bright-accent);
      /* Colors for Secondary &amp;amp; Tertiary items like Blockquote and YUI Tabs */
      --swatch-secondary-color: var(--swatch-menubg-dark-color);
      --swatch-tertiary-color: var(--dark-accent);
      /* Primary Header Colors */
      --gradient-header: linear-gradient(90deg, rgba(245, 245, 245, 1) 0%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
      --swatch-topmenu-border-color: var(--dark-accent);
      --swatch-topmenu-bg-color: var(--dark-accent);
      --background-gradient-distance: 0rem;
      --modal-bg: var(--bright-accent);
  
      --rating-module-text-color: var(--dark-accent);
      --rating-module-button-cancel-color: var(--gray-monochrome);
  
      --diagonal-stripes: none;
  
      --toggle-button-bg: rgb(var(--bright-accent));
      --toggle-border-color: rgb(var(--dark-accent));
      --toggle-icon-color: rgb(var(--dark-accent));
  }
  
  /* Header Stuff, changes the background logo, makes the top bar dark and spooky too! */
  
  #header::before {
      background-image: var(--lgurl);
      opacity: 0.20;
  }
  
  #header div[class*=top-bar]>ul li:hover {
      background-color: rgba(var(--bright-accent));
  }
  
  #header div[class*=top-bar]>ul>li ul>li {
      box-shadow: inset 0 0 0 .0625rem rgb(var(--dark-accent));
      background-color: rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  #header div[class*=top-bar]>ul>li>a {
      color: rgb(var(--bright-accent));
  }
  
  #header div#top-bar {
      background-color: inherit;
  }
  
  #header div[class*=top-bar]>ul>li>a:after,
  #header div[class*=top-bar]>ul>li>a:before {
      background-color: rgba(var(--dark-accent));
  }
  
  #header div[class*=top-bar]>ul>li:hover>a {
      background-color: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #header h1 a::before {
      -webkit-text-stroke: 0.325rem rgb(var(--bright-accent));
  }
  
  #header h2 span::before {
      -webkit-text-stroke: 0.25rem rgb(var(--bright-accent));
  }
  
  #header h2 span::after {
      color: rgb(var(--dark-accent));
  }
  
  #header {
      --login-myaccount-hover-color: var(--bright-accent) --login-line-divider-color: var(--dark-accent);
      --login-username-color: var(--dark-accent);
      --login-myaccount-color: var(--dark-accent);
      --login-myaccount-underline-color: var(--bright-accent);
      --login-myaccount-hover-bg-color: var(--dark-accent);
      --login-arrow-color: var(--dark-accent);
      --login-dropdown-text-color: var(--dark-accent);
  }
  
  /* This is purely just for the Top Bar, especially the hover elements and whatnot */
  
  #top-bar div.mobile-top-bar>ul>li>ul>li:hover>a,
  #top-bar div.top-bar>ul>li>ul>li:hover>a {
      text-decoration: none;
      color: rgb(var(--dark-accent));
  }
  
  #top-bar div.mobile-top-bar {
      background: rgb(var(--dark-accent));
  }
  
  #top-bar div.top-bar>ul>li:hover {
      background: rgb(var(--dark-accent));
  }
  
  #top-bar div.mobile-top-bar>ul>li.sfhover>ul,
  #top-bar div.mobile-top-bar>ul>li:hover>ul,
  #top-bar div.top-bar>ul>li.sfhover>ul,
  #top-bar div.top-bar>ul>li:hover>ul {
      color: rgb(var(--bright-accent));
  }
  
  /* Everything below here is for the Sidebar, including the hover elements and the headings too */
  
  #side-bar {
      --sideblock-heading-text-color: var(--bright-accent);
      --social-icon-hover-color: var(--bright-accent);
  }
  
  #side-bar .side-block {
      background-color: rgb(var(--bright-accent));
  }
  
  #side-bar .side-block.resources {
      background: rgb(var(--bright-accent)) !important;
  }
  
  #side-bar .side-block.media {
      background-color: rgba(var(--dark-accent)) !important;
  }
  
  #side-bar div.menu-item>a {
      color: rgb(var(--dark-accent));
      transition:
      	color 300ms cubic-bezier(.4, 0, .2, 1),
      	background-color 300ms cubic-bezier(.4, 0, .2, 1)
  }
  
  #side-bar div.menu-item>a:visited {
      color: rgb(var(--dark-accent));
  }
  
  #side-bar div.menu-item>a:hover,
  #side-bar div.menu-item>a:active {
      color: rgb(var(--bright-accent));
  }
  
  #side-bar div.menu-item>a:focus-within {
      color: rgb(var(--bright-accent));
  }
  
  #side-bar div.menu-item a::before {
      background-color: rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  .side-block.media a {
      background: transparent
  }
  
  #side-bar .collapsible-block .collapsible-block-folded,
  #side-bar .heading,
  #interwiki .heading {
      background: rgb(var(--dark-accent));
  }
  
  /* Throwing this quick fix for the search bar up here as well, just so everything fits */
  
  #search-top-box-input {
      background-color: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #search-top-box-form input[type="submit"] {
      background: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #search-top-box-form input[type="submit"]:hover {
      background: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #search-top-box-input {
      background-color: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #search-top-box input.empty {
      color: rgb(var(--dark-accent));
  }
  
  #search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text] {
      background-color: rgba(var(--dark-accent));
  }
  
  @media only screen and (max-width: 56.25rem) {
      #login-status:before {
      	background-color: rgba(var(--dark-accent));
      }
  
  }
  
  @media only screen and (min-width: 769px) {
      #search-top-box-form>input {
      	box-shadow: none;
      }
  }
  
  @media only screen and (min-width: 769px) {
  
      #search-top-box-form input[type="submit"],
      #search-top-box-form input[type="submit"]:focus,
      #search-top-box-form input[type="submit"]:hover {
      	border-left: none;
      	border-top: 0.0125rem solid rgb(var(--dark-accent));
      	border-right: 0.0125rem solid rgb(var(--dark-accent));
      	border-bottom: 0.0125rem solid rgb(var(--dark-accent));
      	box-shadow: none;
      }
  }
  
  :not(.page-rate-widget-box):not(#search-top-box-form)>.btn,
  :not(.page-rate-widget-box):not(#search-top-box-form)>.button,
  :not(.page-rate-widget-box):not(#search-top-box-form)>.owindow .button-bar a,
  :not(.page-rate-widget-box):not(#search-top-box-form)>button,
  :not(.page-rate-widget-box):not(#search-top-box-form)>div.buttons input,
  :not(.page-rate-widget-box):not(#search-top-box-form)>input.button {
      background-color: rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  /* Since we're also up here, here's the code to mess with the account options too (and one fix for the printusers) */
  
  #login-status .printuser {
      background: transparent;
      color: rgb(var(--dark-accent));
  }
  
  #account-options {
      width: auto;
      padding: 0.5em;
      border-color: rgba(var(--dark-accent));
      background: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  .printuser a {
      margin-right: -1px;
      font-size: 14px;
      background-color: transparent;
      color: inherit;
  }
  
  login-status span.printuser {
      color: rgb(var(--dark-accent));
  }
  
  
  /* Okay, now for the links and the body */
  
  body {
      color: rgb(var(--dark-accent));
  }
  
  #page-content a:not([href*="user"]):not([href*="javascript:;"]):not(.fa-info):not([href*="http://www.scp-wiki.net/classification-committee-memo"]):not([href*="/classification-committee-memo"]):not([href="http://scp-wiki.wikidot.com/anomaly-classification-system-guide"]):not(.danger-diamond a) {
      padding: 0.15em;
      margin: -0.15em;
      color: inherit;
      box-shadow: inset 0 -0.125rem 0 0rem rgba(var(--dark-accent));
      transition: box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1), padding 300ms cubic-bezier(0.4, 0.0, 0.2, 1), margin 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
  }
  
  #page-content a:not([href*="user"]):not([href*="javascript:;"]):not([href*="http://www.scp-wiki.net/classification-committee-memo"]):not([href*="/classification-committee-memo"]):not([href="http://scp-wiki.wikidot.com/anomaly-classification-system-guide"]):not(.fa-info):not(.danger-diamond a):hover {
      padding: 0.3em 0.25em 0.2em 0.25em;
      margin: -0.25em;
      box-shadow: inset 0 -1.5em 0 0 rgba(var(--dark-accent));
      text-decoration: none;
      color: rgb(var(--bright-accent))
  }
  
  ::-moz-selection {
      background: rgb(148, 148, 148);
  }
  
  ::selection {
      background: rgb(148, 148, 148);
  }
  
  a {
      color: inherit;
  }
  
  a:hover {
      color: inherit;
  }
  
  a.close-menu {
      background-color: transparent;
  }
  
  a:visited {
      color: inherit;
  }
  
  .scp-image-block a {
      box-shadow: none;
  }
  
  hr {
      border-top: none;
      background-color: rgb(var(--dark-accent));
  }
  
  :is(blockquote,.blockquote,div.blockquote,[class*=blockquote]) {
      background-color: rgb(var(--bright-accent));
      box-shadow: inset 0 0 0 0.0625rem rgba(var(--dark-accent)),inset .0625rem 0 0 0 rgba(var(--dark-accent)),inset 0-.0625rem 0 0 rgba(var(--dark-accent));
  }
  
  /* Fancy Collapsibles */
  
  #page-content .collapsible-block-link {
      text-decoration: none;
      font-weight: 700;
  }
  
  .collapsible-block-folded a,
  .collapsible-block-unfolded-link a:not(.info-container):not(.info-container div.collapsible-block-unfolded-link):not(.info-container div.collapsible-block-folded-link):not(.info-container div.collapsible-block-unfolded):not(.info-container div.collapsible-block-folded):not(.info-container .collapsible-block-folded .collapsible-block-link):not(.info-container .collapsible-block-link) {
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      margin-right: auto;
      margin-left: auto;
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
      padding-left: 1rem;
      padding-right: 1rem;
      width: -webkit-min-content;
      width: -moz-min-content;
      width: min-content;
      white-space: nowrap;
      overflow: hidden;
  }
  
  .collapsible-block-folded a,
  .collapsible-block-unfolded-link a:not(.info-container):not(.info-container div.collapsible-block-unfolded-link):not(.info-container div.collapsible-block-folded-link):not(.info-container div.collapsible-block-unfolded):not(.info-container div.collapsible-block-folded):not(.info-container .collapsible-block-folded .collapsible-block-link):not(.info-container .collapsible-block-link) {
      position: relative;
      top: 0;
      left: 0;
      width: -webkit-min-content;
      width: -moz-min-content;
      width: min-content;
      height: 100%;
      padding: 0.5rem 1rem;
      display: flex;
      align-items: center;
      justify-content: center;
      transition:
      	color 0.25s linear,
      	background-color 0.25s linear;
  }
  
  .collapsible-block-folded a {
      background-color: rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  #page-content .collapsible-block-unfolded-link a {
      background-color: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #page-content .collapsible-block-folded a:hover,
  #page-content .collapsible-block-unfolded-link a:hover {
      background-color: rgb(var(--bright-accent));
      color: rgb(var(--dark-accent));
  }
  
  #page-content .collapsible-block-unfolded-link {
      box-shadow: none;
  }
  
  .info-container .collapsible-block-folded .collapsible-block-link,
  .info-container .collapsible-block-link {
      padding: 0px;
  }
  
  /* Code for changing button colors */
  
  div#page-options-bottom-2>a,
  div#page-options-bottom>a {
      color: rgb(var(--dark-accent));
      border-color: rgb(var(--dark-accent));
      background-color: rgb(var(--bright-accent));
  }
  
  .owindow .button-bar a,
  a.button,
  button,
  div.buttons input,
  file,
  input.button {
      border: 0.125rem solid rgba(var(--dark-accent));
      color: rgb(var(--dark-accent));
      background-color: rgb(var(--bright-accent));
  }
  
  .owindow .button-bar a:hover,
  a.button:hover,
  button:hover,
  div.buttons input:hover,
  file:hover,
  input.button:hover {
      border: .125rem solid rgba(var(--bright-accent));
      background-color: rgba(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  div#page-options-bottom-2>a:hover,
  div#page-options-bottom>a:hover {
      color: rgb(var(--bright-accent));
      border-color: rgb(var(--dark-accent));
      background-color: rgb(var(--dark-accent));
  }
  
  /* All Rating Module Code is below this line! */
  
  .modalbox {
      box-shadow: none !important;
      border-color: transparent !important;
      border-radius: 0px !important;
      padding: 4px;
      pointer-events: auto !important;
  }
  
  .creditButton p a {
      background-color: rgb(var(--black-accent));
  }
  
  #page-content .rate-box-with-credit-button {
      display: inline-flex;
      margin-bottom: .75rem;
      border: .0625rem solid rgba(12, 12, 12, .25);
      border: .0625rem solid rgba(var(--gray-monochrome));
      border-radius: 0;
      background: rgb(var(--bright-accent));
      background-color: #fcfcfc;
      background-color: rgb(var(--bright-accent));
      padding: 0 .125rem;
      height: var(--rating-module-height);
      overflow: hidden;
  }
  
  .page-rate-widget-box {
      background: rgb(var(--bright-accent));
      border: 0.0625rem solid rgba(var(--dark-accent));
  }
  
  div.page-rate-widget-box .rate-points {
      border: none;
  }
  
  #page-content div.rate-box-with-credit-button, div.page-rate-widget-box {
      border: .0625rem solid rgba(var(--dark-accent));
  }
  
  /* Tabs */
  
  .yui-navset .yui-nav li,
  .yui-navset .yui-navset-top .yui-nav li {
      box-shadow: none;
  }
  
  .yui-navset .yui-nav,
  .yui-navset .yui-navset-top .yui-nav {
      box-shadow: none;
      border-color: rgb(var(--bright-accent));
  }
  
  .yui-navset .yui-nav a:focus,
  .yui-navset .yui-nav a:hover {
      background-color: rgb(var(--bright-accent));
      color: rgb(var(--bright-accent));
  }
  
  
  .yui-navset .yui-nav .selected a,
  .yui-navset .yui-nav .selected a em {
      color: rgb(var(--bright-accent));
  }
  
  .yui-navset .yui-content,
  .yui-navset .yui-navset-top .yui-content {
      color: rgb(var(--dark-accent));
      background: rgb(var(--bright-accent));
      border: 1px solid rgb(var(--dark-accent));
  }
  
  .yui-navset .yui-nav li,
  .yui-navset .yui-navset-top .yui-nav li {
      background: rgb(var(--bright-accent));
  }
  
  .yui-navset .yui-nav a,
  .yui-navset .yui-navset-top .yui-nav a {
      border-color: rgb(var(--dark-accent));
      background-color: rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  .yui-navset-bottom .yui-nav li a,
  .yui-navset-top .yui-nav li a,
  .yui-navset .yui-nav li a {
      color: rgb(var(--dark-accent));
      background: rgb(var(--bright-accent));
  }
  
  /* Simple Tables */
  
  table.wiki-content-table td {
      border: 1px solid #888;
      padding: 0.3em 0.7em;
      color: rgb(var(--dark-accent));
  }
  
  table.wiki-content-table th {
      background: rgb(var(--dark-accent));
      border: 1px solid rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  table.wiki-content-table tr {
      border: 1px solid #e3e3e3;
      color: #e3e3e3;
  }
  
  /* Image Blocks */
  
  .scp-image-block {
      box-shadow: none;
  }
  
  .scp-image-block a {
      background-color: transparent;
  }
  
  :is(div.image-block,div.scp-image-block) :is(.image-caption,.scp-image-caption) {
      background-color: rgb(var(--dark-accent));
  }
  
  :is(div.image-block,div.scp-image-block) :is(.image-caption,.scp-image-caption)>p {
      color: rgb(var(--bright-accent));
  }
  
  /* Footer and Hovertips */
  
  .footnote {
      color: rgb(var(--dark-accent));
      background-color: rgb(var(--bright-accent));
      border: 1px solid #242424;
      padding: .625em;
  }
  
  .footnotes-footer {
      background-color: rgba(var(--bright-accent));
      color: rgb(var(--dark-accent));
      border-top: 1px solid #242424;
      border-bottom: 1px solid #242424;
      border-right: 1px solid #242424;
  }
  
  .footnotes-footer a[href*=javascript]:before {
      color: rgb(var(--dark-accent));
      background-color: transparent;
  }
  
  .hovertip {
      background-color: rgb(var(--bright-accent));
      border: .0625rem solid rgb(var(--dark-gray-monochrome));
      color: rgb(var(--dark-accent));
  }
  
  .hovertip .content {
      background-color: rgb(var(--bright-accent));
  }
  
  #footer {
      background: rgb(var(--dark-accent));
      color: rgb(var(--bright-accent));
  }
  
  /* Michellaneous */
  
  
  textarea,
  #lock-info {
      color: rgb(var(--dark-accent));
  }
  
  .owindow .modal-body img {
      background-color: transparent !important;
  }
  
  
  .scpnet-interwiki-wrapper {
      margin-top: 1em;
  }
  
  .licensebox .collapsible-block-link {
      background: none;
  }
  
  .printuser img.small {
      vertical-align: -0.2em;
      height: 14px;
  }
  
  #who-rated-page-area .printuser a {
      font-size: 100%;
  }
  
  #license-area {
      color: rgb(var(--dark-accent));
      background-color: rgb(var(--bright-accent));
  }
  
  
  .printuser a {
      margin-right: -1px;
      font-size: 14px;
      background-color: transparent;
      color: inherit;
  }
  
  .printuser:hover {
      background-color: transparent;
  }
  
  .page-tags a {
      background-color: transparent;
      color: rgb(var(--dark-accent));
  }
  
  .page-tags a:hover {
      color: rgb(var(--bright-accent));
  }
  
  form#edit-page-form {
      background-color: rgba(var(--dark-accent));
      color: rgb(var(--bright-accent));
  
  }
  
  input#edit-page-title {
      color: rgb(var(--dark-accent));
  }
  
  form#edit-page-form .edit-help-34>a {
      color: rgb(var(--dark-accent));
  }
  
  .danger-diamond a,
  .danger-diamond a:hover {
      color: rgba(0, 0, 0, 0);
      box-shadow: initial;
  }
  
  .acs-hybrid-text-bar>a {
      background-color: transparent;
      color: transparent;
  }
  
  @media only screen and (min-width: 769px) {
  
      #search-top-box-form>input,
      #search-top-box-form>input:hover,
      #search-top-box-form>input:focus {
      	background: rgb(var(--light-accent));
      }
  }
  
  @media (min-width: 0px) {
      #page-content .rate-box-with-credit-button>.creditButton>p>a:before {
      	left: 4px;
      }
  }
  
  
  @media only screen and (max-width: 768px) {
  
      #header h2,
      #header h2 a,
      #header h2 a::before {
      	top: 0.45rem;
      }
  }
  
  #u-author_block>p>a {
      color: var(--linkColour) !important;
  }
  
  [[/code]]
  [[/collapsible]]
  [[/iftags]]
  [[include :scp-wiki:component:centered-header-bhl]]
  [[include :scp-wiki:component:toggle-sidebar-bhl]]
  [[module css]]
  @import url("https://scp-wiki.wdfiles.com/local--code/theme%3Aminimalist-bhl/1")

Inline Styles

• font-family:var(--body-font); font-size: calc(var(--base-font-size) * 1.25);

• font-family:var(--header-font); font-size: calc(var(--base-font-size) * 1.25);

• font-family:var(--mono-font); font-size: calc(var(--base-font-size) * 1.25);

Includes

• :scp-wiki:info:start [info]
• :scp-wiki:info:end [info]
• :scp-wiki:theme:black-highlighter-theme [info]
• :scp-wiki:theme:minimalist-bhl [info]
• component:image-block
• :scp-wiki:component:centered-header-bhl [info]
• :scp-wiki:component:toggle-sidebar-bhl [info]

CSS Classes

• (none)

Page Source

[[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");
[[/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
]]

[[>]]
[[include :scp-wiki:info:start]]
[[=]]
Minimalist BHL Theme, co-rewritten by [[*user JakdragonX]] and [[*user Pedagon]]

Thank you to [[*user stormbreath]] for inspiration, and [[*user Woedenaz]] and [[*user EstrellaYoshte]] for their immense help.
[[/=]]
[[include :scp-wiki:info:end]]
[[/>]]

> Hello. This is the **Minimalist BHL Theme.** Originally meant for [[*user Pedagon]] for his use in his Department of Sciences articles, it has been changed to be more user-friendly. To include it, please use the following code:
>> [[include :scp-wiki:theme:black-highlighter-theme]]
>> [[include :scp-wiki:theme:minimalist-bhl]]
>
> //"But, I think this theme looks cool and I want to use it for Departments and other things!"// Well, good news for you -- you can! Just include the following code after the above snippet to edit the Header:
>> [[module CSS]]
>> :root { 
>> @<    >@ @@--header-title: "title here";@@
>> @<    >@ @@--header-subtitle: "subtitle here";@@
>> @<    >@ @@--lgurl: url('your url here');@@
>> }
>> [[/module]]
+ EXAMPLES

[[include component:image-block name=http://pokm.wdfiles.com/local--files/6000contestrespectators-pedagon/Ar6AfDt.png|caption=Department of Sciences Logo|width=200px]]

A horizontal rule can be created with 5 hyphens[[footnote]]This statement was made solely to anger [[*user Placeholder McD]], as well as showcase what footnotes look like.[[/footnote]] "@@-----@@" 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.

[http://www.google.com A link you probably visited once, idk]

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]]
Why was the shovel so special?

Because it was a groundbreaking invention
[[/tab]]
[[tab Tabulation]]
More text.

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 This empty tab right here has a really long name.]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[tab Empty Tab]]
[[/tab]]
[[/tabview]]
@@ @@
> This is a blockquote, created by putting "> " at the start of each line.
> 
> Look! Even more text!
> -----
> That's a horizontal rule. Pretty nifty, right?
> 
>> Want to hear a joke about paper?
>> 
>> Actually... meh, nevermind. It's pretty tearable.
>> 
>>> Are you starting to get the point of these yet?

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

[[=]]
[[span style="font-family:var(--body-font); font-size: calc(var(--base-font-size) * 1.25);"]]The body font is [https://fonts.google.com/specimen/Raleway Raleway].[[/span]]
[[span style="font-family:var(--header-font); font-size: calc(var(--base-font-size) * 1.25);"]]The header and title font is [https://fonts.google.com/specimen/Poppins Poppins].[[/span]]
[[span style="font-family:var(--mono-font); font-size: calc(var(--base-font-size) * 1.25);"]]The monospace font is [https://fonts.google.com/specimen/Recursive Recursive].[[/span]]
[[/=]]

[[footnoteblock]]

@@ @@

[[collapsible show="+ Show theme code" hide="- Hide theme code"]]
[[code type="css"]]
:root {
    /* S-CSS-P Integration */
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "black-highlighter";
    /* must be either "black-highlighter" or "sigma9" */
    --theme-id: "minimalist-bhl";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "Minimalist BHL";
    /* set this to your theme's full name */

    --header-title: "SCP FOUNDATION";
    --header-subtitle: "SECURE - CONTAIN - PROTECT";
    --logo-image: url('https://scp-wiki.wdfiles.com/local--files/component:pride-highlighter/gp_logo.svg');
    --lgurl: var(--logo-image);

    --bright-accent: 245, 245, 245;
    --dark-accent: 36, 36, 36;
    --swatch-primary: var(--dark-accent);
    --light-gray-monochrome: 196, 196, 196;
    --dark-gray-monochrome: 200, 200, 200;
    --medium-accent: var(--dark-accent);
    --tab-border-color: var(--bright-accent);
    --hover-link-color: var(--dark-accent);
    --rating-module-button-color: var(--dark-accent);
    --rating-module-button-credit-color: var(--dark-accent);
    --swatch-background: var(--bright-accent);
    /* Background and Header Colors */
    --background-color: var(--bright-accent);
    /* Primary Text Colors */
    --swatch-text-light: var(--dark-accent);
    --swatch-text-general: var(--dark-accent);
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--bright-accent);
    /* Colors for Secondary &amp;amp; Tertiary items like Blockquote and YUI Tabs */
    --swatch-secondary-color: var(--swatch-menubg-dark-color);
    --swatch-tertiary-color: var(--dark-accent);
    /* Primary Header Colors */
    --gradient-header: linear-gradient(90deg, rgba(245, 245, 245, 1) 0%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
    --swatch-topmenu-border-color: var(--dark-accent);
    --swatch-topmenu-bg-color: var(--dark-accent);
    --background-gradient-distance: 0rem;
    --modal-bg: var(--bright-accent);

    --rating-module-text-color: var(--dark-accent);
    --rating-module-button-cancel-color: var(--gray-monochrome);

    --diagonal-stripes: none;

    --toggle-button-bg: rgb(var(--bright-accent));
    --toggle-border-color: rgb(var(--dark-accent));
    --toggle-icon-color: rgb(var(--dark-accent));
}

/* Header Stuff, changes the background logo, makes the top bar dark and spooky too! */

#header::before {
    background-image: var(--lgurl);
    opacity: 0.20;
}

#header div[class*=top-bar]>ul li:hover {
    background-color: rgba(var(--bright-accent));
}

#header div[class*=top-bar]>ul>li ul>li {
    box-shadow: inset 0 0 0 .0625rem rgb(var(--dark-accent));
    background-color: rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

#header div[class*=top-bar]>ul>li>a {
    color: rgb(var(--bright-accent));
}

#header div#top-bar {
    background-color: inherit;
}

#header div[class*=top-bar]>ul>li>a:after,
#header div[class*=top-bar]>ul>li>a:before {
    background-color: rgba(var(--dark-accent));
}

#header div[class*=top-bar]>ul>li:hover>a {
    background-color: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#header h1 a::before {
    -webkit-text-stroke: 0.325rem rgb(var(--bright-accent));
}

#header h2 span::before {
    -webkit-text-stroke: 0.25rem rgb(var(--bright-accent));
}

#header h2 span::after {
    color: rgb(var(--dark-accent));
}

#header {
    --login-myaccount-hover-color: var(--bright-accent) --login-line-divider-color: var(--dark-accent);
    --login-username-color: var(--dark-accent);
    --login-myaccount-color: var(--dark-accent);
    --login-myaccount-underline-color: var(--bright-accent);
    --login-myaccount-hover-bg-color: var(--dark-accent);
    --login-arrow-color: var(--dark-accent);
    --login-dropdown-text-color: var(--dark-accent);
}

/* This is purely just for the Top Bar, especially the hover elements and whatnot */

#top-bar div.mobile-top-bar>ul>li>ul>li:hover>a,
#top-bar div.top-bar>ul>li>ul>li:hover>a {
    text-decoration: none;
    color: rgb(var(--dark-accent));
}

#top-bar div.mobile-top-bar {
    background: rgb(var(--dark-accent));
}

#top-bar div.top-bar>ul>li:hover {
    background: rgb(var(--dark-accent));
}

#top-bar div.mobile-top-bar>ul>li.sfhover>ul,
#top-bar div.mobile-top-bar>ul>li:hover>ul,
#top-bar div.top-bar>ul>li.sfhover>ul,
#top-bar div.top-bar>ul>li:hover>ul {
    color: rgb(var(--bright-accent));
}

/* Everything below here is for the Sidebar, including the hover elements and the headings too */

#side-bar {
    --sideblock-heading-text-color: var(--bright-accent);
    --social-icon-hover-color: var(--bright-accent);
}

#side-bar .side-block {
    background-color: rgb(var(--bright-accent));
}

#side-bar .side-block.resources {
    background: rgb(var(--bright-accent)) !important;
}

#side-bar .side-block.media {
    background-color: rgba(var(--dark-accent)) !important;
}

#side-bar div.menu-item>a {
    color: rgb(var(--dark-accent));
    transition:
    	color 300ms cubic-bezier(.4, 0, .2, 1),
    	background-color 300ms cubic-bezier(.4, 0, .2, 1)
}

#side-bar div.menu-item>a:visited {
    color: rgb(var(--dark-accent));
}

#side-bar div.menu-item>a:hover,
#side-bar div.menu-item>a:active {
    color: rgb(var(--bright-accent));
}

#side-bar div.menu-item>a:focus-within {
    color: rgb(var(--bright-accent));
}

#side-bar div.menu-item a::before {
    background-color: rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

.side-block.media a {
    background: transparent
}

#side-bar .collapsible-block .collapsible-block-folded,
#side-bar .heading,
#interwiki .heading {
    background: rgb(var(--dark-accent));
}

/* Throwing this quick fix for the search bar up here as well, just so everything fits */

#search-top-box-input {
    background-color: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#search-top-box-form input[type="submit"] {
    background: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#search-top-box-form input[type="submit"]:hover {
    background: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#search-top-box-input {
    background-color: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#search-top-box input.empty {
    color: rgb(var(--dark-accent));
}

#search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text] {
    background-color: rgba(var(--dark-accent));
}

@media only screen and (max-width: 56.25rem) {
    #login-status:before {
    	background-color: rgba(var(--dark-accent));
    }

}

@media only screen and (min-width: 769px) {
    #search-top-box-form>input {
    	box-shadow: none;
    }
}

@media only screen and (min-width: 769px) {

    #search-top-box-form input[type="submit"],
    #search-top-box-form input[type="submit"]:focus,
    #search-top-box-form input[type="submit"]:hover {
    	border-left: none;
    	border-top: 0.0125rem solid rgb(var(--dark-accent));
    	border-right: 0.0125rem solid rgb(var(--dark-accent));
    	border-bottom: 0.0125rem solid rgb(var(--dark-accent));
    	box-shadow: none;
    }
}

:not(.page-rate-widget-box):not(#search-top-box-form)>.btn,
:not(.page-rate-widget-box):not(#search-top-box-form)>.button,
:not(.page-rate-widget-box):not(#search-top-box-form)>.owindow .button-bar a,
:not(.page-rate-widget-box):not(#search-top-box-form)>button,
:not(.page-rate-widget-box):not(#search-top-box-form)>div.buttons input,
:not(.page-rate-widget-box):not(#search-top-box-form)>input.button {
    background-color: rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

/* Since we're also up here, here's the code to mess with the account options too (and one fix for the printusers) */

#login-status .printuser {
    background: transparent;
    color: rgb(var(--dark-accent));
}

#account-options {
    width: auto;
    padding: 0.5em;
    border-color: rgba(var(--dark-accent));
    background: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

.printuser a {
    margin-right: -1px;
    font-size: 14px;
    background-color: transparent;
    color: inherit;
}

login-status span.printuser {
    color: rgb(var(--dark-accent));
}


/* Okay, now for the links and the body */

body {
    color: rgb(var(--dark-accent));
}

#page-content a:not([href*="user"]):not([href*="javascript:;"]):not(.fa-info):not([href*="http://www.scp-wiki.net/classification-committee-memo"]):not([href*="/classification-committee-memo"]):not([href="http://scp-wiki.wikidot.com/anomaly-classification-system-guide"]):not(.danger-diamond a) {
    padding: 0.15em;
    margin: -0.15em;
    color: inherit;
    box-shadow: inset 0 -0.125rem 0 0rem rgba(var(--dark-accent));
    transition: box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1), padding 300ms cubic-bezier(0.4, 0.0, 0.2, 1), margin 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
}

#page-content a:not([href*="user"]):not([href*="javascript:;"]):not([href*="http://www.scp-wiki.net/classification-committee-memo"]):not([href*="/classification-committee-memo"]):not([href="http://scp-wiki.wikidot.com/anomaly-classification-system-guide"]):not(.fa-info):not(.danger-diamond a):hover {
    padding: 0.3em 0.25em 0.2em 0.25em;
    margin: -0.25em;
    box-shadow: inset 0 -1.5em 0 0 rgba(var(--dark-accent));
    text-decoration: none;
    color: rgb(var(--bright-accent))
}

::-moz-selection {
    background: rgb(148, 148, 148);
}

::selection {
    background: rgb(148, 148, 148);
}

a {
    color: inherit;
}

a:hover {
    color: inherit;
}

a.close-menu {
    background-color: transparent;
}

a:visited {
    color: inherit;
}

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

hr {
    border-top: none;
    background-color: rgb(var(--dark-accent));
}

:is(blockquote,.blockquote,div.blockquote,[class*=blockquote]) {
    background-color: rgb(var(--bright-accent));
    box-shadow: inset 0 0 0 0.0625rem rgba(var(--dark-accent)),inset .0625rem 0 0 0 rgba(var(--dark-accent)),inset 0-.0625rem 0 0 rgba(var(--dark-accent));
}

/* Fancy Collapsibles */

#page-content .collapsible-block-link {
    text-decoration: none;
    font-weight: 700;
}

.collapsible-block-folded a,
.collapsible-block-unfolded-link a:not(.info-container):not(.info-container div.collapsible-block-unfolded-link):not(.info-container div.collapsible-block-folded-link):not(.info-container div.collapsible-block-unfolded):not(.info-container div.collapsible-block-folded):not(.info-container .collapsible-block-folded .collapsible-block-link):not(.info-container .collapsible-block-link) {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-right: auto;
    margin-left: auto;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 1rem;
    padding-right: 1rem;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}

.collapsible-block-folded a,
.collapsible-block-unfolded-link a:not(.info-container):not(.info-container div.collapsible-block-unfolded-link):not(.info-container div.collapsible-block-folded-link):not(.info-container div.collapsible-block-unfolded):not(.info-container div.collapsible-block-folded):not(.info-container .collapsible-block-folded .collapsible-block-link):not(.info-container .collapsible-block-link) {
    position: relative;
    top: 0;
    left: 0;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    height: 100%;
    padding: 0.5rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition:
    	color 0.25s linear,
    	background-color 0.25s linear;
}

.collapsible-block-folded a {
    background-color: rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

#page-content .collapsible-block-unfolded-link a {
    background-color: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#page-content .collapsible-block-folded a:hover,
#page-content .collapsible-block-unfolded-link a:hover {
    background-color: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent));
}

#page-content .collapsible-block-unfolded-link {
    box-shadow: none;
}

.info-container .collapsible-block-folded .collapsible-block-link,
.info-container .collapsible-block-link {
    padding: 0px;
}

/* Code for changing button colors */

div#page-options-bottom-2>a,
div#page-options-bottom>a {
    color: rgb(var(--dark-accent));
    border-color: rgb(var(--dark-accent));
    background-color: rgb(var(--bright-accent));
}

.owindow .button-bar a,
a.button,
button,
div.buttons input,
file,
input.button {
    border: 0.125rem solid rgba(var(--dark-accent));
    color: rgb(var(--dark-accent));
    background-color: rgb(var(--bright-accent));
}

.owindow .button-bar a:hover,
a.button:hover,
button:hover,
div.buttons input:hover,
file:hover,
input.button:hover {
    border: .125rem solid rgba(var(--bright-accent));
    background-color: rgba(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

div#page-options-bottom-2>a:hover,
div#page-options-bottom>a:hover {
    color: rgb(var(--bright-accent));
    border-color: rgb(var(--dark-accent));
    background-color: rgb(var(--dark-accent));
}

/* All Rating Module Code is below this line! */

.modalbox {
    box-shadow: none !important;
    border-color: transparent !important;
    border-radius: 0px !important;
    padding: 4px;
    pointer-events: auto !important;
}

.creditButton p a {
    background-color: rgb(var(--black-accent));
}

#page-content .rate-box-with-credit-button {
    display: inline-flex;
    margin-bottom: .75rem;
    border: .0625rem solid rgba(12, 12, 12, .25);
    border: .0625rem solid rgba(var(--gray-monochrome));
    border-radius: 0;
    background: rgb(var(--bright-accent));
    background-color: #fcfcfc;
    background-color: rgb(var(--bright-accent));
    padding: 0 .125rem;
    height: var(--rating-module-height);
    overflow: hidden;
}

.page-rate-widget-box {
    background: rgb(var(--bright-accent));
    border: 0.0625rem solid rgba(var(--dark-accent));
}

div.page-rate-widget-box .rate-points {
    border: none;
}

#page-content div.rate-box-with-credit-button, div.page-rate-widget-box {
    border: .0625rem solid rgba(var(--dark-accent));
}

/* Tabs */

.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    box-shadow: none;
}

.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    box-shadow: none;
    border-color: rgb(var(--bright-accent));
}

.yui-navset .yui-nav a:focus,
.yui-navset .yui-nav a:hover {
    background-color: rgb(var(--bright-accent));
    color: rgb(var(--bright-accent));
}


.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a em {
    color: rgb(var(--bright-accent));
}

.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    color: rgb(var(--dark-accent));
    background: rgb(var(--bright-accent));
    border: 1px solid rgb(var(--dark-accent));
}

.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--bright-accent));
}

.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    border-color: rgb(var(--dark-accent));
    background-color: rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

.yui-navset-bottom .yui-nav li a,
.yui-navset-top .yui-nav li a,
.yui-navset .yui-nav li a {
    color: rgb(var(--dark-accent));
    background: rgb(var(--bright-accent));
}

/* Simple Tables */

table.wiki-content-table td {
    border: 1px solid #888;
    padding: 0.3em 0.7em;
    color: rgb(var(--dark-accent));
}

table.wiki-content-table th {
    background: rgb(var(--dark-accent));
    border: 1px solid rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

table.wiki-content-table tr {
    border: 1px solid #e3e3e3;
    color: #e3e3e3;
}

/* Image Blocks */

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

.scp-image-block a {
    background-color: transparent;
}

:is(div.image-block,div.scp-image-block) :is(.image-caption,.scp-image-caption) {
    background-color: rgb(var(--dark-accent));
}

:is(div.image-block,div.scp-image-block) :is(.image-caption,.scp-image-caption)>p {
    color: rgb(var(--bright-accent));
}

/* Footer and Hovertips */

.footnote {
    color: rgb(var(--dark-accent));
    background-color: rgb(var(--bright-accent));
    border: 1px solid #242424;
    padding: .625em;
}

.footnotes-footer {
    background-color: rgba(var(--bright-accent));
    color: rgb(var(--dark-accent));
    border-top: 1px solid #242424;
    border-bottom: 1px solid #242424;
    border-right: 1px solid #242424;
}

.footnotes-footer a[href*=javascript]:before {
    color: rgb(var(--dark-accent));
    background-color: transparent;
}

.hovertip {
    background-color: rgb(var(--bright-accent));
    border: .0625rem solid rgb(var(--dark-gray-monochrome));
    color: rgb(var(--dark-accent));
}

.hovertip .content {
    background-color: rgb(var(--bright-accent));
}

#footer {
    background: rgb(var(--dark-accent));
    color: rgb(var(--bright-accent));
}

/* Michellaneous */


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

.owindow .modal-body img {
    background-color: transparent !important;
}


.scpnet-interwiki-wrapper {
    margin-top: 1em;
}

.licensebox .collapsible-block-link {
    background: none;
}

.printuser img.small {
    vertical-align: -0.2em;
    height: 14px;
}

#who-rated-page-area .printuser a {
    font-size: 100%;
}

#license-area {
    color: rgb(var(--dark-accent));
    background-color: rgb(var(--bright-accent));
}


.printuser a {
    margin-right: -1px;
    font-size: 14px;
    background-color: transparent;
    color: inherit;
}

.printuser:hover {
    background-color: transparent;
}

.page-tags a {
    background-color: transparent;
    color: rgb(var(--dark-accent));
}

.page-tags a:hover {
    color: rgb(var(--bright-accent));
}

form#edit-page-form {
    background-color: rgba(var(--dark-accent));
    color: rgb(var(--bright-accent));

}

input#edit-page-title {
    color: rgb(var(--dark-accent));
}

form#edit-page-form .edit-help-34>a {
    color: rgb(var(--dark-accent));
}

.danger-diamond a,
.danger-diamond a:hover {
    color: rgba(0, 0, 0, 0);
    box-shadow: initial;
}

.acs-hybrid-text-bar>a {
    background-color: transparent;
    color: transparent;
}

@media only screen and (min-width: 769px) {

    #search-top-box-form>input,
    #search-top-box-form>input:hover,
    #search-top-box-form>input:focus {
    	background: rgb(var(--light-accent));
    }
}

@media (min-width: 0px) {
    #page-content .rate-box-with-credit-button>.creditButton>p>a:before {
    	left: 4px;
    }
}


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

    #header h2,
    #header h2 a,
    #header h2 a::before {
    	top: 0.45rem;
    }
}

#u-author_block>p>a {
    color: var(--linkColour) !important;
}

[[/code]]
[[/collapsible]]
[[/iftags]]
[[include :scp-wiki:component:centered-header-bhl]]
[[include :scp-wiki:component:toggle-sidebar-bhl]]
[[module css]]
@import url("https://scp-wiki.wdfiles.com/local--code/theme%3Aminimalist-bhl/1")
[[/module]]
[[include :scp-wiki:component:interwiki-style
| priority=3
| theme=https://scp-wiki.wdfiles.com/local--code/theme%3Aminimalist-bhl/1
]]