@import url('https://fonts.googleapis.com/css2?family=Quantico:ital,wght@0,400;0,700;1,400;1,700&display=swap');
 
/* ROOT */
 
:root {
    --banner: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/shrpfondo.png');
    --logo: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/SHRPlogo.png');
    --subtitle: '智能。专注。高效。';
}
 
/* FONDO DE CABECERA */
 
div#container-wrap {
    background-image: var(--banner);
    background-size: 1500px;
    background-position: top center;
}
 
/* LOGO DE CABECERA */
 
#header {
    height: 200px;
    background-image: var(--logo);
    background-size: 200px;
    background-position: 16px 13px;
    height: 13.5rem;
}
 
/* TÍTULO DE CABECERA */
 
#header h1 {
    margin-left: 120px;
    margin-top: 15px;
    padding: 0;
    float: left;
    max-height: 95px;
}
 
#header h2 {
    margin-left: 120px;
    padding: 0;
    clear: left;
    float: left;
    font-size: 110%;
    max-height: 38px;
}
 
#header h1 a {
    display: block;
    content: "";
    margin: 0;
    padding: 80px 0 25px;
    line-height: 0px;
    max-height: 0px;
    color: transparent;
    background: transparent;
    font-size: 350%;
    text-decoration: none;
    text-shadow: none;
}
 
#header h1 a::before {
    content: "S.H.R.P.";
    letter-spacing: -8px;
    color: #eee;
    text-shadow: 3px 3px 5px #242424;
    margin-top: -20px;
    font-family: "Quantico", serif;
    font-weight: 800;
    font-style: italic;
}
 
@media (max-width: 767px) {
  #header h1 a::before {
    content: "S.H.R.P.";
    font-size: 75% !important;
    letter-spacing: none;
  }
}
 
/* SUBTÍTULO DE CABECERA */
 
#header h2 span {
    display: block;
    margin: 0;
    padding: 40px 7px;
    line-height: 0px;
    max-height: 0px;
    font-weight: bold;
    color: transparent;
    text-shadow: none;
}
 
#header h2 span::before {
    content: var(--subtitle);
     display: block;
     margin: 0;
     line-height: 0px;
     max-height: 0px;
     font-family: "Quantico", serif;
     font-weight: 400;
     font-style: italic;
     font-size: 170%;
     color: #eee;
     letter-spacing: 0px;
     text-shadow: 1px 1px 1px #000;
     text-shadow: 1px 1px 1px rgba(0,0,0,.8);
}
 
@media (max-width: 767px) {
     #header h2 span::before {
         content: var(--subtitle);
         font-size: 90%;
     }
}
 
/* USUARIO - MI CUENTA */
 
#login-status {
    top: 3px;
    right: 0;
    color: #FFF;
}
 
#login-status a {
    color: #FFF;
}
 
#account-topbutton {
    border-color: #FFF;
}
 
#login-status ul a {
    color: #eee;
    background-color: #030303;
    border-bottom: solid 1px #262524;
}
 
#login-status ul a:hover {
    color: #FFF;
    font-weight: bold;
    background-color: #303030;
}
 
#page-content .printuser img.small {
    margin-right: -13px;
}
 
/* BUSCADOR */
 
#search-top-box {
    top: 30px;
    right: -2px;
}
 
#search-top-box-form input[type=submit] {
    background: #000;
    color: #eee;
    font-size: 90%;
    border: solid 1px #eee;
    border-radius: 0px;
    box-shadow: none;
}
 
#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus {
    background: rgb(72,72,72);
    background: linear-gradient(180deg, rgba(72,72,72,1) 11%, rgba(0,0,0,1) 44%);
    color: #FFF;
    box-shadow: 0px 0px 5px 1px rgba(155,155,155,1);
}
 
/* BARRA SUPERIOR */
 
#top-bar {
    top: 13.7rem;
    display: flex;
    justify-content: center;
    height: 3rem;
    padding-top: 6px;
}
 
#top-bar a {
    color: #FFF;
    font-weight: normal;
}
 
#top-bar ul li.sfhover a,
#top-bar ul li:hover a {
    color: #eee;
    background-color: #030303;
}
 
#top-bar ul li.sfhover a:hover,
#top-bar ul li:hover a:hover {
    color: #FFF;
    font-weight: bold;
    background-color: #303030;
}
 
#top-bar ul li ul,
#top-bar ul li ul li ul {
    border-color: #262524;
}
 
#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
    border-color: #262524;
}
 
.topbar_arrow {
    color: #eee;
}
 
@media (max-width: 767px) {
    #top-bar {
        top: 12rem;
    }
}
 
/* TÍTULO DE PÁGINA */
 
#page-title {
    color: #080808;
    font-family: "Quantico", serif;
    font-weight: 400;
    font-size: 2.1em;
    border-bottom: solid 1px #000;
}
 
/* CUERPO */
 
body {
    background-color: #E8E8E5;
}
 
/* TÍTULOS */
 
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #080808;
    font-weight: bold;
}
 
/* PUNTUACIÓN */
 
.page-rate-widget-box {
    box-shadow: none;
    background: #000 !important;
}
 
.page-rate-widget-box span {
    background-color: #000 !important;
}
 
div.page-rate-widget-box .rate-points {
    background-color: #000000 !important;
    border: solid 1px #000000;
    border-radius: 0px;
    box-shadow: 0 5px #505050;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: #FFF;
    border-top: solid 1px #000000;
    border-bottom: solid 1px #000000;
    box-shadow: 0 5px #505050;
}
 
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    background: #FFF !important;
    color: #000 !important;
    padding: 0 4px !important;
}
 
.page-rate-widget-box .rateup a:hover {
    background: #0000D2 !important;
    color: #ffffff !important;
}
 
.page-rate-widget-box .ratedown a:hover {
    background: #D20000 !important;
    color: #ffffff !important;
}
 
.page-rate-widget-box .cancel {
    background-color: #000000;
    border: solid 1px #000000;
    border-radius: 0px;
    box-shadow: 0 5px #505050;
}
 
.page-rate-widget-box .cancel a {
    color: #FFF !important;
    background-color: #000000 !important;
    padding: 0 5px !important;
}
 
.page-rate-widget-box .cancel a:hover {
    background: #000000 !important;
    color: #D20000 !important;
}
 
/* PUNTUACIÓN CON INFO */
 
.creditRate {
    margin-right: -2em !important;
}
 
.creditButton {
    background-color: #000 !important;
    box-shadow: none;
    border: #000 !important;
}
 
#page-content .rate-box-with-credit-button {
    background-color: #000;
    border: 0px;
    box-shadow: 0 5px #505050;
    border-radius: 0px;
}
 
#page-content .rate-box-with-credit-button .creditButton p a {
    border-left-color: #ffffff;
    background: #000 !important;
}
 
#page-content .rate-box-with-credit-button .fa-info {
    border-color: #ffffff;
    border-radius: 0px;
    color: #ffffff;
    box-shadow: 0 6px #505050;
    padding: 3px 0 1px;
}
 
#page-content .rate-box-with-credit-button .fa-info:hover {
    color: #f4e000 !important;
}
 
.close-credits {
    filter: grayscale(100%) brightness(0%);
}
 
#page-content .modalbox {
    box-shadow: 0 2px 6px rgba(0,30,0,.5);
}
 
/* BLOCKQUOTE */
 
div.blockquote,
blockquote {
    background: transparent;
    border: solid 1px #999999;
}
 
/* ENLACES */
 
#page-content a {
    background: #000;
    color: #eee;
    padding-top: 1.6px;
    padding-left: 6.4px;
    padding-right: 6.4px;
    padding-bottom: 1.6px;
}
 
#page-content a:visited {
    color: #FCFCFC;
    background-color: #808080;
}
 
#page-content a.newpage {
    color: #000;
    background-color: #eee;
}
 
/* BREADCRUMBS */
 
#breadcrumbs a,
#breadcrumbs a:visited,
#breadcrumbs a.newpage {
    background: #000;
    color: #eee;
    padding-top: 1.6px;
    padding-left: 6.4px;
    padding-right: 6.4px;
    padding-bottom: 1.6px;
    font-weight: bold;
}
 
/* IMAGE CAPTION */
 
.scp-image-block {
    background: transparent;
    box-shadow: none;
}
 
.scp-image-block .scp-image-caption {
    background: #202020;
    color: #eee;
    border-top: none;
    font-size: 85%;
}
 
.scp-image-block img {
    box-shadow: none;
}
 
.scp-image-block a {
    padding: 0px !important;
    background-color: transparent !important;
}
 
/* TABLAS */
 
table.wiki-content-table th {
    background: #000;
    color: #eee;
}
 
/* FOOTNOTE */
 
.hovertip {
    color: #eee;
    background-color: #000 !important;
}
 
a.footnoteref {
    padding: 1.6px !important;
}
 
.footnotes-footer a {
    padding: 1.6px !important;
}
 
/* DESPLEGABLES */
 
.collapsible-block {
    line-height: 22px;
}
 
/* EARTHWORM COMPONENT */
 
.earthworm {
    --earthworm-segment-border-color: rgba(0,0,0,0.5) !important;
}
 
.earthworm a,
.earthworm a:visited {
    background: transparent !important;
    color: #121212 !important;
}
 
/* ACTION AREA */
 
#action-area a {
    color: #121212;
    font-weight: bold;
}
 
/* SELECTION */
 
::selection {
    background-color: rgba(255, 255, 0,0.6);
    color: #000;
}
 
/* SCROLLBAR */
 
::-webkit-scrollbar-thumb {
    background: #000;
}
 
::-webkit-scrollbar-thumb:hover {
    background: #404040;
}
 
::-webkit-scrollbar-track {
    background: #e8e8e5;
}
 
/* BARRA LATERAL */
 
#side-bar {
        background-image: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/negro-animado.gif');
        background-repeat: repeat;
}
 
#side-bar .side-block {
    background-color: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px #eee;
    background-size: contain;
    box-shadow: none;
    border-radius: 0px;
    margin-bottom: -1px;
}
 
#side-bar .side-block.media {
    background-color: transparent;
    background-position: top center;
    background-repeat: no-repeat;
    border-bottom: solid 1px #eee;
    box-shadow: none;
}
 
#side-bar .side-block.media img {
    filter: none;
    image-rendering: pixelated;
}
 
#side-bar .side-block.nuevos {
    background-color: transparent;
    background-position: top center;
    background-repeat: no-repeat;
    border-bottom: solid 1px #eee;
    box-shadow: none;
}
 
#side-bar .side-block.guias {
    background-color: transparent;
    background-position: top center;
    background-repeat: no-repeat;
    border-bottom: solid 1px #eee;
    box-shadow: none;
}
 
#side-bar .side-block.borradores {
    background-color: transparent;
    background-position: top center;
    background-repeat: no-repeat;
    border-bottom: solid 1px #eee;
    box-shadow: none;
}
 
#side-bar .side-block.cc {
    background-color: transparent;
    background-position: bottom center;
    background-repeat: no-repeat;
    border-bottom: solid 1px #eee;
    box-shadow: none;
}
 
#side-bar .side-block.cc img {
    filter: none;
    image-rendering: pixelated;
}
 
#side-bar .side-block.recurso {
    background-color: transparent;
    background-position: bottom center;
    background-repeat: no-repeat;
    border-bottom: solid 1px #eee;
    box-shadow: none;
}
 
#side-bar,
#side-bar:is(:hover,:active,:focus-within)  {
    scrollbar-color: #eee #000 !important;
}
 
#side-bar a,
#side-bar a:visited,
#side-bar a.newpage {
    color: #FFF;
    background: none;
    padding: none;
}
 
#side-bar a.collapsible-block-link {
    color: #FFF;
}
 
#side-bar .heading {
    color: #FFF;
    border-bottom: solid 1px #eee;
}
 
#side-bar .side-block img {
    image-rendering: pixelated;
}
 
#side-bar .side-block.blue, #side-bar .side-block.media {
    background: #000 !important;
}
 
#side-bar .side-block.red, #side-bar .side-block.resources {
    background: #000 !important;
}
 
#side-bar .menu-item.home p::before,
#side-bar .menu-item.default p::before,
#side-bar .menu-item.main p::before,
#side-bar .collapsible-block-folded .collapsible-block-link::before, #side-bar .colmod-link-top a:first-child::before,
#side-bar .collapsible-block-unfolded-link .collapsible-block-link::before, #side-bar .colmod-link-top a:last-child::before {
    filter: grayscale(100%) brightness(200%) saturate(0%) contrast(1000%) invert(100%);
    image-rendering: pixelated;
}
 
#side-bar .hover {
    color: #eee;
}
 
#side-bar .collapsible-block-link:hover, #side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover {
    color: #eee;
}
 
#side-bar .collapsible-block-link, #side-bar .collapsible-block-unfolded-link .collapsible-block-link {
    color: #eee;
}
 
/* INTERWIKI */
 
#interwiki .side-block {
    background-color: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px #eee;
    background-size: contain;
    box-shadow: none;
    border-radius: 0px;
    margin-bottom: 5px;
}
 
#interwiki .heading {
    color: #FFF;
    border-bottom: solid 1px #eee;
}
 
#interwiki a,
#interwiki a:visited,
#interwiki a.newpage {
    color: #FFF;
    background: none;
    padding: none;
}
 
#interwiki .menu-item img {
    filter: grayscale(100%) brightness(200%) saturate(0%) contrast(1000%) invert(100%);
    image-rendering: pixelated;
}
 
/* MENÚ BARRA LATERAL */
 
#top-bar .open-menu {
    display: inherit;
}
 
@media (max-width: 767px) {
    #side-bar {
        opacity: 1;
        background-image: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/negro-animado.gif');
        background-repeat: repeat;
    }
}
 
.open-menu a,
#top-bar .open-menu a {
    border: solid 2px var(--color) !important;
    border-radius: 0px !important;
    background-color: #000 !important;
    color: #FFF !important;
    outline: solid 3px #000;
}
 
.open-menu a:hover,
#top-bar .open-menu a:hover {
    background: rgb(72,72,72) !important;
    background: linear-gradient(180deg, rgba(72,72,72,1) 11%, rgba(0,0,0,1) 44%) !important;
    color: #FFF !important;
    box-shadow: 0px 0px 5px 1px rgba(155,155,155,1);
}
 
/* TABS [ BASED ON "FOSSIL THEME" BY ESTRELLAYOSHTE ] */
 
.yui-navset {
    clear: both;
    display: grid;
    grid-template-areas: "tab content";
    grid-template-columns: 10.5rem minmax(0,1fr);
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.45rem;
    background-color: #080808;
    border-radius: 0;
    box-shadow: 0 0 0.575rem rgb(30, 30, 30/.425);
}
.yui-navset .yui-nav {
    grid-area: tab;
    display: grid;
    border: none;
    gap: 0.5rem;
    font-size: clamp(.875em, calc(.5em + .675vw), .9125em);
    top: .25rem;
    position: sticky;
    flex-wrap: wrap;
}
 
.yui-navset.yui-navset-top .yui-nav li a {
    border-radius: 0;
    padding: .575em !important;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    border-width: 0.05rem;
    box-sizing: border-box;
    padding: 0.325rem 0.625rem;
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background: #303030 !important;
    color: #FFF !important;
    border: none;
    box-shadow: 0 5px #494949;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
    color: #FFF !important;
    border: none;
    font-weight: bold;
    background: #202020 !important;
    box-shadow: 0 3px #494949;
    transform: translateY(2px);
}
 
.yui-navset .yui-nav a:focus,
.yui-navset .yui-nav a:hover {
    background: #494949 !important;
    color: #FFF !important;
    border: none;
    box-shadow: 0 5px #7a7a7a;
}
 
.yui-navset .yui-content {
    grid-area: content;
    align-self: stretch;
    border: none;
    border-radius: 0;
    padding: 0.325rem 1.25rem;
    background-color: #e8e8e5;
    min-height: 1.5rem;
}
 
.yui-navset .yui-nav a em, .yui-navset .yui-navset-top .yui-nav a em {
    border: transparent;
}
 
.yui-navset.yui-navset-top .yui-nav :is(li, .selected) a em {
    position: static;
    inset: unset;
    border: none;
    padding: 0;
}
 
.yui-navset.yui-navset-top .yui-nav :is(li, .selected) {
    display: block;
    margin: 0;
    padding: 0;
}
 
@media screen and (max-width: 767px) {
 
.yui-navset {
    grid-template-areas:
        "tab"
        "content";
    grid-template-columns: minmax(0,1fr);
}
.yui-navset .yui-nav {
    display: flex;
    flex-wrap: wrap;
    position: static;
}
 
.yui-navset .yui-nav li {
flex-grow: 1;
}
 
}
 
/* MODALBOX */
 
.modalbox {
    background: #e8e8e5 !important;
    border-radius: 0px;
}
 
.modalbox h2 {
   color: #000;
}
 
.modalbox hr {
    background-color: #000;
}
 
/* OWINDOW */
 
.owindow {
    background-image: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/negro-animado.gif');
    background-repeat: repeat;
    color: #eee;
    border: solid 5px #202020;
}
 
.owindow a {
    color: #eee;
    padding-top: 1.6px;
    padding-left: 1.6px;
    padding-right: 3.2px;
    padding-bottom: 1.6px;
    background-color: rgba(128,128,128,0.4);
    font-weight: bold;
}
 
.owindow a::before {
    content: '> ';
}
 
.owindow a:hover {
    padding-left: 5px;
}
 
.owindow h1 {
    color: #eee;
}
 
.owindow .title {
    background-color: #202020;
    color: #eee;
}
 
.owindow img {
    background-color: #000 !important;
}
 
.owindow .button-bar a {
    background-color: #202020;
    color: #eee;
    border: solid 1px #eee;
}
 
.owindow .button-bar a::before {
    content: '';
}
 
.owindow .button-bar a:hover {
    background: rgb(72,72,72);
    background: linear-gradient(180deg, rgba(72,72,72,1) 11%, rgba(0,0,0,1) 44%);
    color: #FFF;
    border: solid 1px #FFF;
    box-shadow: 0px 0px 5px 1px rgba(155,155,155,1);
    padding: 0.1em 1em;
}
 
.owindow.owait .content {
    padding-bottom: 2rem;
    background-image: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/SHRP-loader.gif');
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 57px;
    height: 40px;
}
 
/* OPCIONES */
 
.page-watch-options a {
    color: #121212 !important;
    font-weight: bold;
}
 
.page-options-bottom a {
    color: #121212 !important;
    font-weight: bold;
}
 
/* ETIQUETAS */
 
.page-tags a {
    color: #000;
}
 
/* ÁREA DE LICENCIA */
 
#license-area a {
    color: #121212 !important;
    font-weight: bold;
}
 
/* TOC */
 
#toc {
    background-image: url('https://scp-yerko-7.wdfiles.com/local--files/tema%3Ashrp/negro-animado.gif');
    background-repeat: repeat;
    border: solid 5px #202020;
    color: #eee;
    line-height: 22px;
}