Tema Backpedia

@import url('https://fonts.googleapis.com/css2?family=Roboto+Flex&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Code&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Mono&display=swap');
@import url("https://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "backpedia";
   --theme-name: "Tema Backpedia";
 
   --logo-image: url("http://space-time.wikidot.com/local--files/tema-backpedia/backpedia_logo.png");
   --header-title: "Backpedia";
   --header-subtitle: "La documentación libre.";
   --wallpaper-mask: none;
 
   --body-font: 'Roboto Flex', monospace;
   --UI-font: 'Roboto Flex', monospace;
   --header-font: 'Cormorant Garamond', monospace;
   --title-font: 'Source Serif 4', monospace;
   --mono-font: 'Google Sans Code', monospace;
 
   --pale-gray-monochrome: 255, 255, 255;
   --white-monochrome: 186, 195, 207;
   --light-gray-monochrome: 255, 255, 255;
   --gray-monochrome: 255, 255, 255;
   --black-monochrome: 0, 0, 0;
   --bright-accent: 33, 188, 255;
   --medium-accent: 255, 255, 255;
   --dark-accent: 12, 68, 105;
   --pale-accent: 21, 93, 252;
   --dark-gray-monochrome: 20, 22, 24;
 
   --link-color: 52, 152, 219;
   --hover-link-color: 98, 123, 157;
   --visited-link-color: 155, 89, 182;
   --newpage-color: 243, 156, 18;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.3rem;
   background-image: var(--logo-image);
   background-size: auto 9rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   left: 4.8rem;
   top: 0.8rem;
   margin: 0;
   width: max-content;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   left: 3.3rem;
   top: 1.8rem;
   margin: 0;
   width: max-content;
   display: flex;
   justify-content: left;
}
 
/*unselected tab color*/
 .yui-navset .yui-nav a,
 .yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
}
 
.styled-quote {
   background-color: rgb(239, 242, 245);
   border-left: 0.5rem solid rgb(183, 194, 210);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0rem 0rem 0rem rgba(0, 0, 0, 0);
}
 
.dark-styled-quote {
   background-color: rgb(10, 12, 16);
   border-left: 0.5rem solid rgb(69, 85, 108);
   color: rgb(255, 255, 255);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0rem 0rem 0rem rgba(0, 0, 0, 0);
}
 
.dark-styled-quote a{
color: rgb(255, 255, 255);
}
 
.lightblock {
   background-color: rgb(239, 242, 245);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
}
 
.darkblock {
   background-color: rgb(10, 12, 16);
   color: rgb(255, 255, 255);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
}
 
.darkblock a {
color: rgb(255, 255, 255);
}
 
.lightborder {
    background-color: rgb(239, 242, 245);
    color: rgb(0, 0, 0);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    border: solid 0.3rem rgb(10, 12, 16);
}
 
.darkborder {
    background-color: rgb(10, 12, 16);
    color: rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    border: solid 0.3rem rgb(239, 242, 245);
}
 
.sectionblock {
    background-color: rgb(230, 230, 255);
    color: rgb(0, 0, 0);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    border: solid 0.1rem rgb(185, 184, 255);
}
 
.extrablock {
    background-color: rgb(221, 219, 217);
    color: rgb(0, 0, 0);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    border: solid 0.1rem rgb(38, 35, 34);
}
 
.bntgblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    color: rgb(0, 0, 0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    font-family: "Staatliches";
    position: relative;
    background-color: rgb(232, 231, 213);
    border: solid 0.3rem rgb(86, 108, 90);
}
 
.bntgblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-sandbox-2.wikidot.com/local--files/collab:bntgcollab/toplogo) center/100% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.megblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    color: rgb(0, 0, 0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    font-family: "PT Mono", monospace;
    position: relative;
    background-color: #f7e481;
    border: solid 0.3rem rgb(54, 52, 21);
}
 
.megblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3129.PNG) center/100% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.uecblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0rem 0rem rgba(0, 0, 0, 0);
    color: rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    font-family: 'uni_sansheavy_caps', sans-serif;
    font-style: normal;
    position: relative;
    background-color: rgb(20, 22, 24);
    border: solid 0.3rem rgb(255, 20, 40);
}
 
.uecblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://backrooms-wiki.wikidot.com/local--files/theme:uec/EUC%20%282%29.png) center/90% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
/* Wikipedia-like Infobox */
.infobox-table {
   float: right;
   width: 300px;
   background: rgb(245, 245, 245);
   margin-left: 1rem;
   margin-bottom: 0.5rem;
   margin-top: 0.5rem;
}
 
.infobox-table tr {
    border: solid 0.1rem rgb(193, 193, 199);
}
 
.infobox-table td, .infobox-table th {
   padding: 0.2rem;
}
 
.infobox-table th {
   background: rgb(185, 184, 255);
   color: rgb(0, 0, 0);
   text-align: center;
}
 
.infobox-table .datastart {
   background: rgb(230, 230, 255);
   width: 35%;
}
 
.infobox-table .desccell {
   font-size: 90%;
   text-align: center;
}
 
@media only screen and (max-width: 30rem) {
.infobox-table {
     width: 100% !important; /* Important overrides users who use a style="" on the table to make it a different width on desktop */
}
}