Petdoc1991 Workshop!

Intro

Petdoc's Workshop

Pleroma

---

+ Show theme code

@import url("https://use.typekit.net/cjg4ysl.css");
 
@supports(display:grid) {
    :root {
        --body-font: "franklin-gothic-urw", sans-serif;
        --header-font: "titling-gothic-fb-compressed", sans-serif;
        --title-font: "hypatia-sans-pro", sans-serif;
 
        --header-title: "The Foundation";
 
        --light-gray-monochrome: 200, 0, 5;
 
        --header-gradient-color-bottom: var(--dark-accent);
        --header-gradient-color-middle: var(--black-monochrome);
        --header-gradient-color-top: var(--black-monochrome);
 
        --background-gradient-color: var(--light-gray-monochrome);
        --swatch-topmenu-border-color: var(--black-monochrome);
        --swatch-topmenu-bg-color: var(--dark-accent);
 
        --gradient-topmenu: linear-gradient(to bottom,
        rgba(255, 255, 255, 0) 0,
        rgba(255, 255, 255, 0) var(--header-height-on-desktop),
        rgba(var(--swatch-topmenu-border-color)) var(--header-height-on-desktop),
        rgba(var(--swatch-topmenu-bg-color), 1) -webkit-calc(var(--header-height-on-desktop) + .125rem),
        rgba(var(--swatch-topmenu-bg-color), 1) -webkit-calc(100% - .125rem),
        rgba(var(--swatch-topmenu-bg-color), 0) -webkit-calc(100% - .125rem),
        rgba(var(--swatch-topmenu-border-color), 0) 100%);
 
        --gradient-topmenu: linear-gradient(to bottom,
            rgba(255, 255, 255, 0) 0,
            rgba(255, 255, 255, 0) var(--header-height-on-desktop),
            rgba(var(--swatch-topmenu-border-color)) var(--header-height-on-desktop),
            rgba(var(--swatch-topmenu-bg-color), 1) -moz-calc(var(--header-height-on-desktop) + .125rem),
            rgba(var(--swatch-topmenu-bg-color), 1) -moz-calc(100% - .125rem),
            rgba(var(--swatch-topmenu-bg-color), 0) -moz-calc(100% - .125rem),
            rgba(var(--swatch-topmenu-border-color), 0) 100%);
 
        --gradient-topmenu: linear-gradient(to bottom,
            rgba(255, 255, 255, 0) 0,
            rgba(255, 255, 255, 0) var(--header-height-on-desktop),
            rgba(var(--swatch-topmenu-border-color)) var(--header-height-on-desktop),
            rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--header-height-on-desktop) + .125rem),
            rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - .125rem),
            rgba(var(--swatch-topmenu-bg-color), 0) calc(100% - .125rem),
            rgba(var(--swatch-topmenu-border-color), 0) 100%);
 
        --gradient-topmenu-mobile: linear-gradient(to bottom,
            rgba(var(--swatch-topmenu-border-color), 1) 0,
            rgba(var(--swatch-topmenu-bg-color), 1) .125rem,
            rgba(var(--swatch-topmenu-bg-color), 1) -webkit-calc(var(--topbar-height-on-mobile) - .125rem),
            rgba(var(--swatch-topmenu-bg-color), 0) -webkit-calc(var(--topbar-height-on-mobile) - .125rem),
            rgba(var(--swatch-topmenu-border-color), 0) 3rem);
 
        --gradient-topmenu-mobile: linear-gradient(to bottom,
            rgba(var(--swatch-topmenu-border-color), 1) 0,
            rgba(var(--swatch-topmenu-bg-color), 1) .125rem,
            rgba(var(--swatch-topmenu-bg-color), 1) -moz-calc(var(--topbar-height-on-mobile) - .125rem),
            rgba(var(--swatch-topmenu-bg-color), 0) -moz-calc(var(--topbar-height-on-mobile) - .125rem),
            rgba(var(--swatch-topmenu-border-color), 0) 3rem);
 
        --gradient-topmenu-mobile: linear-gradient(to bottom,
            rgba(var(--swatch-topmenu-border-color), 1) 0,
            rgba(var(--swatch-topmenu-bg-color), 1) .125rem,
            rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--topbar-height-on-mobile) - .125rem),
            rgba(var(--swatch-topmenu-bg-color), 0) calc(var(--topbar-height-on-mobile) - .125rem),
            rgba(var(--swatch-topmenu-border-color), 0) 3rem);
 
        --gradient-header: linear-gradient(to bottom,
            rgb(var(--header-gradient-color-bottom)) 0%,
            rgb(var(--header-gradient-color-middle)) 90%,
            rgb(var(--header-gradient-color-top)) 100%);
 
        --header-background-image-size: 100% var(--header-height-on-desktop);
        --header-height-on-desktop: 12.25rem;
        --header-height-on-mobile: 12.25rem;
 
        --base-font-size: 0.938rem;
    }
 
    #side-bar::-webkit-scrollbar {
        background-color: rgba(var(--bright-accent),0);
    }
 
    #side-bar::-webkit-scrollbar-thumb {
        background-color: rgba(var(--dark-gray-monochrome),0);
    }
 
    ::-webkit-scrollbar,
    #side-bar:hover::-webkit-scrollbar {
        background-color: rgba(var(--bright-accent));
    }
 
    ::-webkit-scrollbar-thumb,
    #side-bar:hover::-webkit-scrollbar-thumb {
        background-color: rgba(var(--dark-gray-monochrome));
    }
 
    html,
    body {
        -webkit-font-feature-settings: "onum"0;
        -moz-font-feature-settings: "onum"0;
        font-feature-settings: "onum"0;
        font-variant-numeric: tabular-nums;
        scrollbar-color: rgb(var(--dark-gray-monochrome)) rgb(var(--bright-accent));
    }
 
    body {
        font-weight: 400;
        -webkit-background-size: var(--header-background-image-size), 100% 14.25rem, 100% var(--background-gradient-distance);
        -moz-background-size: var(--header-background-image-size), 100% 14.25rem, 100% var(--background-gradient-distance);
        -o-background-size: var(--header-background-image-size), 100% 14.25rem, 100% var(--background-gradient-distance);
        background-size: var(--header-background-image-size), 100% 14.25rem, 100% var(--background-gradient-distance);
    }
 
    .danger-diamond a,
    .danger-diamond a:hover {
        color: rgba(0,0,0,0) !important;
        box-shadow: initial !important;
    }
 
    #main-content {
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    }
 
    #page-title,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: rgba(var(--light-gray-monochrome));
        font-family: var(--title-font);
        font-weight: 900;
    }
 
    hr {
        height: 0.5em;
        border: initial;
        position: relative;
        background-color: rgba(0, 0, 0, 0);
        overflow: hidden;
    }
 
    hr::before {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('https://scp-wiki.wdfiles.com/local--files/theme:the-foundation-theme/cons_circle.png');
        -webkit-background-size: 100vh 100vh;
           -moz-background-size: 100vh;
             -o-background-size: 100vh;
                background-size: 100vh;
        background-attachment: fixed;
        background-position: top center;
        background-repeat: repeat;
        -webkit-clip-path: polygon(50% 10%, 100% 50%, 50% 90%, 0% 50%);
        clip-path: polygon(50% 10%, 100% 50%, 50% 90%, 0% 50%);
        pointer-events: none;
    }
 
    #page-content a:not([href*="user"]):not([href*="javascript:;"]):not([href="/classification-committee-memo"]) {
        padding: 0.15em;
        margin: -0.15em;
        color: rgb(var(--gray-monochrome));
        -webkit-box-decoration-break: clone;
        box-decoration-break: clone;
        -webkit-box-shadow: inset 0 -0.125rem 0 0rem rgba(var(--light-gray-monochrome), 1);
        -moz-box-shadow: inset 0 -0.125rem 0 0rem rgba(var(--light-gray-monochrome), 1);
        box-shadow: inset 0 -0.125rem 0 0rem rgba(var(--light-gray-monochrome), 1);
        -webkit-transition:
            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),
            -webkit-box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition:
            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),
            -webkit-box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-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);
        -moz-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),
            -moz-box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        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);
        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),
            -webkit-box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1),
            -moz-box-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    }
 
    #page-content a:not([href*="user"]):not([href*="javascript:;"]):not([href="/classification-committee-memo"]):hover {
        padding: 0.3em 0.25em 0.2em 0.25em;
        margin: -0.25em;
        -webkit-box-shadow: inset 0 -1.5em 0 0 rgba(var(--dark-accent), 1);
        -moz-box-shadow: inset 0 -1.5em 0 0 rgba(var(--dark-accent), 1);
        box-shadow: inset 0 -1.5em 0 0 rgba(var(--dark-accent), 1);
        text-decoration: none;
        color: rgb(var(--white-monochrome))
    }
 
    #extra-div-3 {
        position: absolute;
        width: 100%;
        height: var(--header-height-on-desktop);
        top: 0;
        left: 0;
        pointer-events: none;
        background: url('https://scp-wiki.wikidot.com/local--files/theme:the-foundation-theme/foundation-header-img.png');
        background-position: center center;
    }
 
    #header {
        background: initial;
    }
 
    #header h1,
    #header h1 a,
    #header h1 a::before {
        position: absolute;
        top: 0.5rem;
        left: 0;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        max-height: inherit;
        z-index: 0;
    }
 
    #header > h1 > a > span {
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        max-width: inherit;
    }
 
    #header h1 {
        height: -webkit-calc(100% - 2.25rem);
        height: -moz-calc(100% - 2.25rem);
        height: calc(100% - 2.25rem);
    }
 
    #header h1 a::before,
    #header h1 a {
        text-align: center;
        font-weight: 100;
        text-transform: uppercase;
        font-size: -webkit-calc(2.75rem + (4.5 - 2.75) * ((100vw - 18.750rem) / (60 - 18.750)));
        font-size: -moz-calc(2.75rem + (4.5 - 2.75) * ((100vw - 18.750rem) / (60 - 18.750)));
        font-size: calc(2.75rem + (4.5 - 2.75) * ((100vw - 18.750rem) / (60 - 18.750)));
        line-height: 0.8;
        letter-spacing: 0.1em;
    }
 
    #header h2 span::before,
    #header h2 span {
        display: none;
    }
 
    #login-status,
    #login-status * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
 
    #login-status {
        min-height: -webkit-calc(var(--base-font-size) * 1.5);
        min-height: -moz-calc(var(--base-font-size) * 1.5);
        min-height: calc(var(--base-font-size) * 1.5);
        border: .0625rem solid rgb(var(--bright-accent));
        -webkit-border-radius: .0625rem;
        -moz-border-radius: .0625rem;
        border-radius: .0625rem;
        -webkit-border-radius: var(--border-radius-width);
        -moz-border-radius: var(--border-radius-width);
        border-radius: var(--border-radius-width);
        color: rgba(0, 0, 0, 0);
        background-color: #424248;
        background-color: rgb(var(--gray-monochrome));
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }
 
    #login-status .printuser {
        position: relative;
        top: 0;
        left: 0;
        color: rgb(var(--swatch-text-light));
        border-right: .0625rem solid rgb(var(--bright-accent));
        background: rgb(var(--swatch-primary-darkest));
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        padding: 0.25rem;
        margin: 0;
        font-weight: 900 !important;
    }
 
    #login-status .printuser a {
        width: 0.75em;
    }
 
    #login-status #my-account {
        color: rgb(var(--black-monochrome));
    }
 
    #login-status #account-topbutton {
        border: initial;
        padding: 0.5em 0.5em 0.5em 0.25em;
        position: relative;
        height: 100%;
        top: 0;
        left: 0;
        margin: 0;
        font-size: 1em;
    }
 
    #account-options {
        width: auto;
        padding: 0.5em;
        border-color: rgb(var(--bright-accent));
        background: var(--gradient-header);
        color: rgb(var(--swatch-text-light));
    }
 
    #account-options ul li a {
        color: rgb(var(--swatch-text-light));
    }
 
    #search-top-box {
        left: 3%;
        top: 0.5rem;
    }
 
    #search-top-box,
    #search-top-box * {
        border-color: rgb(var(--bright-accent)) !important;
    }
 
    #search-top-box-form > #search-top-box-input {
        width: 7rem;
    }
 
    #top-bar {
        height: 1.875rem;
    }
 
    #top-bar div.top-bar > ul > li,
    #top-bar div.mobile-top-bar > ul > li {
        font-family: var(--title-font);
        font-weight: 800;
        text-transform: uppercase;
        isolation: isolate;
    }
 
    #top-bar div.top-bar > ul > li:hover,
    #top-bar div.mobile-top-bar > ul > li:hover {
        background: rgb(var(--swatch-primary-darkest));
    }
 
    #top-bar div.top-bar > ul > li::before,
    #top-bar div.mobile-top-bar > ul > li > a::before {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        background: 
        url('https://scp-wiki.wikidot.com/local--files/theme:the-foundation-theme/foundation-circles-bg.png');
        -webkit-background-size: 100vh 100vh;
           -moz-background-size: 100vh;
             -o-background-size: 100vh;
                background-size: 100vh;
        background-attachment: fixed;
        background-position: center center;
        -webkit-transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -o-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -moz-transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -moz-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -moz-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -o-background-size 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        pointer-events: none;
        -webkit-animation-direction: reverse;
        -moz-animation-direction: reverse;
        -o-animation-direction: reverse;
        animation-direction: reverse;
        pointer-events: none;
    }
 
    #top-bar div.top-bar > ul > li:hover::before,
    #top-bar div.mobile-top-bar > ul > li > a:hover::before {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 1;
    }
 
    #top-bar div.top-bar > ul > li > ul,
    #top-bar div.mobile-top-bar > ul > li > ul {
        margin-top: 1.9rem;
    }
 
    #top-bar div.top-bar > ul > li > a::before,
    #top-bar div.top-bar > ul > li > a::after {
        background-color: rgba(var(--dark-gray-monochrome));
        pointer-events: none;
        z-index: 1;
    }
 
    #side-bar {
        top: 0;
        --swatch-border-color: rgb(var(--light-gray-monochrome));
        background-color: rgba(var(--dark-accent),0);
        scrollbar-color: rgba(var(--dark-gray-monochrome),0) rgba(var(--bright-accent),0);
        z-index: 10;
        background: 
            linear-gradient(
                rgba(var(--dark-accent),0) 30%,
                rgba(var(--dark-accent),0)),
            linear-gradient(
                rgba(var(--dark-accent),0),
                rgba(var(--dark-accent),0) 70%) 0 100%,
            radial-gradient(farthest-side at 50% 0,
                rgba(var(--swatch-primary-darkest),0),
                rgba(var(--black-monochrome),0)),
            radial-gradient(farthest-side at 50% 100%,
                rgba(var(--swatch-primary-darkest),0),
                rgba(var(--black-monochrome),0)) 0 100%;
    }
 
    #side-bar:hover,
    #side-bar:active {
        scrollbar-color: rgb(var(--dark-gray-monochrome)) rgb(var(--bright-accent));
        background-color: rgba(var(--dark-accent),1);
        background-image: 
            linear-gradient(
                rgba(var(--dark-accent),1) 30%,
                rgba(var(--dark-accent),0)),
            linear-gradient(
                rgba(var(--dark-accent),1),
                rgba(var(--dark-accent),0) 70%) 0 100%,
            radial-gradient(farthest-side at 50% 0,
                rgba(var(--swatch-primary-darkest),.5),
                rgba(var(--black-monochrome),0)),
            radial-gradient(farthest-side at 50% 100%,
                rgba(var(--swatch-primary-darkest),.5),
                rgba(var(--black-monochrome),0)) 0 100%;
    }
 
    #side-bar:focus-within {
        scrollbar-color: rgb(var(--dark-gray-monochrome)) rgb(var(--bright-accent));
        background-color: rgba(var(--dark-accent),1);
        background-image: 
            linear-gradient(
                rgba(var(--dark-accent),1) 30%,
                rgba(var(--dark-accent),0)),
            linear-gradient(
                rgba(var(--dark-accent),1),
                rgba(var(--dark-accent),0) 70%) 0 100%,
            radial-gradient(farthest-side at 50% 0,
                rgba(var(--swatch-primary-darkest),.5),
                rgba(var(--black-monochrome),0)),
            radial-gradient(farthest-side at 50% 100%,
                rgba(var(--swatch-primary-darkest),.5),
                rgba(var(--black-monochrome),0)) 0 100%;
    }
 
    #side-bar div.menu-item {
        --swatch-border-color: rgb(var(--light-gray-monochrome));
        background-color: rgba(var(--black-monochrome), 0.25);
    }
 
    #side-bar .heading {
        font-family: var(--title-font);
        background-image: url('https://scp-wiki.wikidot.com/local--files/theme:the-foundation-theme/foundation-circles-bg.png');
        background-attachment: fixed;
        -webkit-background-size: 100vh 100vh;
           -moz-background-size: 100vh;
             -o-background-size: 100vh;
                background-size: 100vh;
        background-position: -18rem center;
        position: relative;
        padding-top: 0.15em;
        padding-bottom: 0.25em;
    }
 
    #side-bar div.menu-item a,
    #side-bar div.menu-item a:hover,
    #side-bar div.menu-item a:active,
    #side-bar div.menu-item a:visited,
    #side-bar div.menu-item .text {
        color: rgb(var(--white-monochrome));
        margin: 0.15em 0;
        font-family: var(--title-font);
    }
 
    #side-bar div.menu-item a::before {
        background:
            linear-gradient(to top, rgb(var(--black-monochrome)), rgb(var(--dark-accent)));
        background-attachment: fixed fixed;
        background-size: 300% 500%;
        background-position: left;
    }
 
    .yui-navset .yui-nav a {
        -webkit-transition: background-color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-transition: background-color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -moz-transition: background-color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: background-color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        color: rgba(var(--white-monochrome));
    }
 
    .yui-navset .yui-nav li {
        background-color: rgba(var(--swatch-menubg-light-color), 0);
        -webkit-animation: tab-active 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -moz-animation: tab-active 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-animation: tab-active 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        animation: tab-active 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -webkit-animation-iteration-count: 1;
        -moz-animation-iteration-count: 1;
        -o-animation-iteration-count: 1;
        animation-iteration-count: 1;
        -webkit-animation-fill-mode: forward;
        -moz-animation-fill-mode: forward;
        -o-animation-fill-mode: forward;
        animation-fill-mode: forward;
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }
 
    .yui-navset .yui-nav li em {
        transition: -webkit-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-transition: -o-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -moz-transition: transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1), -moz-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -webkit-transition: -webkit-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1), -moz-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1), -o-transform 400ms cubic-bezier(0.4, 0.0, 0.2, 1);
    }
 
    .yui-navset .yui-nav .selected {
        margin-top: -0.5em;
        padding-top: 0.5em;
        margin-right: 0.0625rem;
        background-color: rgb(var(--white-monochrome));
        -webkit-animation-iteration-count: 1;
        -moz-animation-iteration-count: 1;
        -o-animation-iteration-count: 1;
        animation-iteration-count: 1;
        -webkit-animation-fill-mode: backwards;
        -moz-animation-fill-mode: backwards;
        -o-animation-fill-mode: backwards;
        animation-fill-mode: backwards;
        -webkit-animation-play-state: running;
        -moz-animation-play-state: running;
        -o-animation-play-state: running;
        animation-play-state: running;
    }
 
    .yui-navset .yui-nav .selected a em {
        -webkit-transform: translateY(-0.25em);
        -moz-transform: translateY(-0.25em);
        -ms-transform: translateY(-0.25em);
        -o-transform: translateY(-0.25em);
        transform: translateY(-0.25em);
    }
 
    .yui-navset .yui-nav a,
    .yui-navset .yui-nav a:hover,
    .yui-navset .yui-nav a:active,
    .yui-navset .yui-nav a:focus-within {
        background: rgba(0, 0, 0, 0) !important;
        font-family: var(--title-font);
        font-weight: 600;
        isolation: isolate;
    }
 
    .yui-navset .yui-nav a:hover,
    .yui-navset .yui-nav a:active,
    .yui-navset .yui-nav a:focus-within,
    .yui-navset .yui-nav .selected a {
        color: rgba(var(--bright-accent)) !important;
    }
 
    .yui-navset .yui-nav a::before,
    .yui-navset .yui-nav a::after {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 1;
        pointer-events: none;
    }
 
    .yui-navset .yui-nav a::before {
        background-image: url('https://scp-wiki.wikidot.com/local--files/theme:the-foundation-theme/foundation-circles-bg.png');
        -webkit-background-size: 100vh 100vh;
           -moz-background-size: 100vh;
             -o-background-size: 100vh;
                background-size: 100vh;
        background-attachment: fixed;
        background-position: top center;
        -webkit-mask-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 1)), color-stop(33%, rgba(0, 0, 0, 1)), color-stop(66%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
        -webkit-mask-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 33%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
        mask-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 1)), color-stop(33%, rgba(0, 0, 0, 1)), color-stop(66%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
        mask-image: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 33%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
        -webkit-mask-size: 100% 90px;
        mask-size: 100% 90px;
        -webkit-mask-repeat: repeat;
        mask-repeat: repeat;
        -webkit-mask-position: center -58px;
        mask-position: center -58px;
        -webkit-transition: background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-transition: mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -moz-transition: mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        transition: mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), background-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1), color 300ms cubic-bezier(0.4, 0.0, 0.2, 1), -webkit-mask-position 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        pointer-events: none;
    }
 
    .yui-navset .yui-nav a:hover::before,
    .yui-navset .yui-nav a:focus::before,
    .yui-navset .yui-nav .selected a::before {
        -webkit-mask-position: center 0px !important;
        mask-position: center 0px !important;
        background-position: 100% 200vh;
    }
 
    .yui-navset .yui-nav a:hover::after,
    .yui-navset .yui-nav a:focus::after,
    .yui-navset .yui-nav .selected a::after {
        opacity: 0;
        -webkit-animation: fade 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -moz-animation: fade 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -o-animation: fade 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        animation: fade 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
        -webkit-animation-direction: backwards;
        -moz-animation-direction: backwards;
        -o-animation-direction: backwards;
        animation-direction: backwards;
        -webkit-animation-iteration-count: 1;
        -moz-animation-iteration-count: 1;
        -o-animation-iteration-count: 1;
        animation-iteration-count: 1;
    }
 
    table.wiki-content-table {
        border-collapse: collapse;
    }
 
    table.wiki-content-table th {
        border-color: rgb(var(--light-gray-monochrome)) !important;
        position: relative;
        font-family: var(--title-font);
        font-weight: 600;
        text-transform: uppercase;
        background-image: url('https://scp-wiki.wikidot.com/local--files/theme:the-foundation-theme/foundation-circles-bg.png');
        -webkit-background-size: 100vh 100vh;
           -moz-background-size: 100vh;
             -o-background-size: 100vh;
                background-size: 100vh;
        background-attachment: fixed;
        background-position: top center;
    }
 
    @media only screen and (max-width: 768px) {
        #top-bar {
            font-size: -webkit-calc(var(--base-font-size) * 0.8);
            font-size: -moz-calc(var(--base-font-size) * 0.8);
            font-size: calc(var(--base-font-size) * 0.8);
            height: 2.5rem;
        }
 
        #top-bar > div.mobile-top-bar > div.open-menu {
            font-size: -webkit-calc(var(--base-font-size) * 0.65);
            font-size: -moz-calc(var(--base-font-size) * 0.65);
            font-size: calc(var(--base-font-size) * 0.65);
            width: 2.5rem;
            height: 2.5rem;
        }
 
        #top-bar > div.mobile-top-bar > div.open-menu > p > a {
            color: rgb(var(--swatch-menutxt-dark-color)) !important;
        }
 
        #top-bar div.mobile-top-bar > ul > li > a {
            letter-spacing: 0;
        }
 
        #top-bar > div.top-bar > ul > li:last-of-type > ul,
        #top-bar > div.mobile-top-bar > ul > li:last-of-type > ul {
            left: 50%;
        }
 
        #top-bar div.mobile-top-bar > ul > li > ul {
            margin-top: 2.5rem;
        }
 
        #top-bar div.mobile-top-bar > ul > li > ul > li {
            max-height: -webkit-calc(100vh / 10);
            max-height: -moz-calc(100vh / 10);
            max-height: calc(100vh / 10);
            height: 50em;
        }
 
        #top-bar div.mobile-top-bar > ul > li > ul > li > a {
            white-space: pre-wrap;
        }
 
        #side-bar:target .close-menu {
            width: -webkit-calc(100% - 15em - var(--scrollbar-width));
            width: -moz-calc(100% - 15em - var(--scrollbar-width));
            width: calc(100% - 15em - var(--scrollbar-width));
        }
 
        #search-top-box {
            right: 0 !important;
            top: 0 !important;
            left: inherit;
        }
 
        #search-top-box-form > #search-top-box-input {
            width: inherit;
            right: 0 !important;
            top: 0 !important;
        }
 
        #search-top-box-input,
        #navi-bar,
        #navi-bar-shadow {
            display: inline-block;
        }
 
        #search-top-box {
            height: var(--header-height-on-mobile);
        }
 
        #search-top-box:focus-within form[id="search-top-box-form"] {
            padding-right: -webkit-calc(3% + 30px);
            padding-right: -moz-calc(3% + 30px);
            padding-right: calc(3% + 30px);
            padding-top: 2.3125rem;
        }
 
        #search-top-box:not(:focus-within):before {
            top: 5.625rem;
            width: 2rem !important;
        }
 
        #search-top-box form[id="search-top-box-form"] {
            height: 100%;
            visibility: hidden;
            right: 0 !important;
            position: absolute;
        }
 
        #search-top-box form[id="search-top-box-form"]:focus-within {
            visibility: visible;
            right: 1em;
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
            height: var(--header-height-on-mobile);
            width: 2rem !important;
        }
 
        #main-content {
            margin-top: 2.1em;
        }
    }
}
 
@-webkit-keyframes tab-active {
    0% {
        background-color: rgba(var(--swatch-menubg-light-color), 0);
        padding-top: 0;
        margin-top: 0;
        margin-right: 0;
    }
 
    100% {
        background-color: rgba(var(--white-monochrome), 1);
        padding-top: 0.5em;
        margin-top: -0.5em;
        margin-right: 0.0625rem;
    }
}
 
@-moz-keyframes tab-active {
    0% {
        background-color: rgba(var(--swatch-menubg-light-color), 0);
        padding-top: 0;
        margin-top: 0;
        margin-right: 0;
    }
 
    100% {
        background-color: rgba(var(--white-monochrome), 1);
        padding-top: 0.5em;
        margin-top: -0.5em;
        margin-right: 0.0625rem;
    }
}
 
@-o-keyframes tab-active {
    0% {
        background-color: rgba(var(--swatch-menubg-light-color), 0);
        padding-top: 0;
        margin-top: 0;
        margin-right: 0;
    }
 
    100% {
        background-color: rgba(var(--white-monochrome), 1);
        padding-top: 0.5em;
        margin-top: -0.5em;
        margin-right: 0.0625rem;
    }
}
 
@keyframes tab-active {
    0% {
        background-color: rgba(var(--swatch-menubg-light-color), 0);
        padding-top: 0;
        margin-top: 0;
        margin-right: 0;
    }
 
    100% {
        background-color: rgba(var(--white-monochrome), 1);
        padding-top: 0.5em;
        margin-top: -0.5em;
        margin-right: 0.0625rem;
    }
}
 
@-webkit-keyframes fade {
    0% {
        opacity: 1;
    }
 
    100% {
        opacity: 0;
    }
}
 
@-moz-keyframes fade {
    0% {
        opacity: 1;
    }
 
    100% {
        opacity: 0;
    }
}
 
@-o-keyframes fade {
    0% {
        opacity: 1;
    }
 
    100% {
        opacity: 0;
    }
}
 
@keyframes fade {
    0% {
        opacity: 1;
    }
 
    100% {
        opacity: 0;
    }
}

:root {
    --swatch-background: var(--black-monochrome);
    --header-subtitle: "Office of the Overseer";
    --rating-module-text-color: var(--swatch-menutxt-light-color);
    --rating-module-button-color:  var(--swatch-menutxt-light-color);
    --swatch-text-general: var(--swatch-text-light);
    --swatch-menutxt-general-color: var(--swatch-menutxt-light-color);
    --swatch-secondary-color: var(--swatch-menubg-dark-color);
    --swatch-tertiary-color: var(--swatch-menubg-medium-dark-color);
}
 
::selection {
    background: rgba(var(--swatch-primary, 180, 35, 35), 1);
}
 
html, body {
    color: rgb(var(--swatch-text-light));
}
 
.page-rate-widget-box {
    margin: 0;
    background:
     -webkit-gradient(linear,
     left bottom, left top,
     color-stop(0, rgba(var(--black-monochrome),.55)),
     to(rgba(var(--swatch-primary-darkest),.45)));
    background:
     -webkit-linear-gradient(bottom,
     rgba(var(--black-monochrome),.55) 0,
     rgba(var(--swatch-primary-darkest),.45));
    background:
     -moz-linear-gradient(bottom,
     rgba(var(--black-monochrome),.55) 0,
     rgba(var(--swatch-primary-darkest),.45));
    background:
     -o-linear-gradient(bottom,
     rgba(var(--black-monochrome),.55) 0,
     rgba(var(--swatch-primary-darkest),.45));
    background:
     linear-gradient(0deg,
     rgba(var(--black-monochrome),.55) 0,
     rgba(var(--swatch-primary-darkest),.45));
}
 
#page-title,h1,h2,h3,h4,h5,h6 {
    color: rgb(var(--swatch-text-light)) !important;
}
 
#page-title {
    border-color: rgb(var(--light-gray-monochrome)) !important;
    position: relative;
    margin-top: 1rem;
    font-family: var(--title-font);
    font-weight: 600;
    text-transform: uppercase;
    border: .0625rem solid rgba(66,66,72,.25) !important;
    border: .0625rem solid rgba(var(--swatch-menubg-medium-dark-color),.25) !important;
    isolation: isolate;
}
 
#page-title::before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://scp-wiki.wikidot.com/local--files/theme:the-foundation-theme/foundation-circles-bg.png');
    -webkit-background-size: 100vh 100vh;
      -moz-background-size: 100vh;
         -o-background-size: 100vh;
            background-size: 100vh;
    background-attachment: fixed;
    background-position: top center;
    z-index: -1;
}
 
#header h2,
#header h2 span,
#header h2 span::before {
    position: absolute;
    top: 0.5rem;
    left: 0;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 50%;
    top: 40%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    max-height: inherit;
    z-index: 0;
    font-weight: 500;
    font-family: var(--header-font);
    text-transform: uppercase;
    letter-spacing: 0.5em;
    pointer-events: none;
}
 
.danger-diamond a,
.danger-diamond a:hover {
    color: rgba(0,0,0,0) !important;
    -webkit-box-shadow: initial !important;
       -moz-box-shadow: initial !important;
            box-shadow: initial !important;
}
 
.danger-diamond > .arrows {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.2' baseProfile='tiny' id='Layer_1' xmlns='https://www.w3.org/2000/svg' xmlns:xlink='https://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 160 160' xml:space='preserve'%3E%3Cpath fill='%23fcfcfc' d='M136.1,133.3l23.9-23.9V51.2l-24-24l19.1-19.1l4.9,4.9l0-12.9l-12.9,0l4.9,4.9L133,24.2l-24-24H51l-24,24 L8,5.2l4.9-4.9L0,0.2l0,12.9l4.9-4.9L24,27.3l-24,24v58.2l23.9,23.9l-19,19L0,147.3l0,12.9l12.9,0L8,155.3l19-19l23.9,23.9h58.4 l23.9-23.9l19,19l-4.9,4.9l12.9,0l0-12.9l-4.9,4.9L136.1,133.3z M155.7,53v54.6l-22.6,22.6l-50-50L133,30.3L155.7,53z M52.8,4.5 h54.4l22.7,22.7L80,77.2L30.1,27.3L52.8,4.5z M4.3,107.6V53L27,30.3L77,80.2l-50,50L4.3,107.6z M107.4,155.9H52.6L30,133.3l50-50 l50,50L107.4,155.9z'/%3E%3C/svg%3E%0A");
}
 
table.wiki-content-table {
    width: 100%;
    text-align: center;
    margin: 0 auto;
}
 
table.wiki-content-table,
table.wiki-content-table * {
    border-color: rgb(var(--black-monochrome)) !important;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
 
table.wiki-content-table tbody tr th {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;   
    border-color: rgb(var(--black-monochrome)) !important;
}
 
table.wiki-content-table tr {
    border-width: 0px !important;
}
 
table.wiki-content-table tr,
table.wiki-content-table th {
    width: 100%;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
       -moz-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    margin: 0;
    font-weight: 700;
}
 
table.wiki-content-table td {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0;
    -webkit-box-flex: 2;
    -webkit-flex-grow: 2;
       -moz-box-flex: 2;
        -ms-flex-positive: 2;
            flex-grow: 2;
    -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    width: 100%;
    background-color: rgb(var(--swatch-primary-darkest));
    color: rgb(var(--white-monochrome));
    text-transform: uppercase;
    line-height: 1;
    text-align: center;
 
}
 
table.wiki-content-table td * {
    width: 100%;
}
 
table.wiki-content-table td span:nth-of-type(even) {
    font-family: var(--mono-font);
    font-size: 0.75em;
}
 
blockquote, .blockquote {
    background-color: rgb(var(--swatch-menubg-dark-color));
}
 
#page-content a:not([href*="user"]):not([href*="javascript:;"]):not([href="/classification-committee-memo"]) {
    color: rgb(var(--light-gray-monochrome)) !important;   
}
#page-content a:not([href*="user"]):not([href*="javascript:;"]):not([href="/classification-committee-memo"]):hover {
    color: rgb(var(--black-monochrome)) !important;
        -webkit-box-shadow: inset 0 -1.5em 0 0 rgba(var(--light-gray-monochrome), 1) !important;
           -moz-box-shadow: inset 0 -1.5em 0 0 rgba(var(--light-gray-monochrome), 1) !important;
                box-shadow: inset 0 -1.5em 0 0 rgba(var(--light-gray-monochrome), 1) !important;    
}
 
.code {
    background-color: rgb(var(--swatch-menubg-dark-color));
}
 
@media only screen and (max-width: 768px) {
    #page-title {
     font-size: 2em;
    }
 
    table.wiki-content-table tr {
     -webkit-flex-wrap: wrap;
         -ms-flex-wrap: wrap;
             flex-wrap: wrap;
    }
 
    table.wiki-content-table tr > td {
     min-width: 100%;
     font-size: 1rem;
     padding: 0.5rem;
    }
}
 
.scp-image-block {
    -webkit-box-shadow: initial;
       -moz-box-shadow: initial;
            box-shadow: initial;
}
 
.scp-image-block .scp-image-caption {
    background-color: rgb(var(--swatch-menubg-dark-color));
}

:root {
    --timeScale: 1;
    --timeDelay: 0s;
}
 
/* Converting middle divider from box-shadow to ::before pseudo-element */
.anom-bar > .bottom-box { box-shadow: none!important; }
.anom-bar > .bottom-box::before {
    position: absolute;
    content: " ";
    width: 100%;
    height: 0.5rem;
    background-color: rgb(var(--black-monochrome, 12, 12, 12));
    transform: translateY(-0.74rem);
}
 
/* DIVIDER */
.anom-bar > .bottom-box::before {
    animation-name: divider;
    animation-duration: calc(0.74s * var(--timeScale));
    animation-delay: calc(0.1s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.32,.38,.39,.94);
    animation-fill-mode: backwards;
}
 
/* CLASSIFIED LEVEL BARS */
div.top-center-box  > * {
    animation-name: bar;
    animation-duration: calc(0.45s * var(--timeScale));
    animation-iteration-count: 1;
    animation-timing-function: ease-out;
    animation-fill-mode: backwards;
}
div.top-center-box > :nth-child(1) { animation-delay: calc(0.2s * var(--timeScale) + var(--timeDelay)); }
div.top-center-box > :nth-child(2) { animation-delay: calc(0.32s * var(--timeScale) + var(--timeDelay)); }
div.top-center-box > :nth-child(3) { animation-delay: calc(0.45s * var(--timeScale) + var(--timeDelay)); }
div.top-center-box > :nth-child(4) { animation-delay: calc(0.61s * var(--timeScale) + var(--timeDelay)); }
div.top-center-box > :nth-child(5) { animation-delay: calc(0.75s * var(--timeScale) + var(--timeDelay)); }
div.top-center-box > :nth-child(6) { animation-delay: calc(0.95s * var(--timeScale) + var(--timeDelay)); }
 
/* TOP TEXT */
div.top-left-box, div.top-right-box {
    clip-path: polygon( 0% -50%, 150% -50%, 150% 100%, 0% 100%);
}
 
div.top-left-box > *, div.top-right-box > * {
    position: relative;
    animation-name: bottomup;
    animation-duration: calc(0.65s * var(--timeScale));
    animation-delay: calc(0.5s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: ease-out;
    animation-fill-mode: backwards;
}
 
/* CONTAINMENT, DISRUPTION, RISK CLASSES */
div.text-part > * {
    clip-path: polygon( 0% 0%, 100% 0%, 100% 100%, 0% 100%);
    animation-name: expand2;
    animation-duration: calc(0.5s * var(--timeScale));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.12,.41,.27,.99);
    animation-fill-mode: backwards;
}
div.text-part > :nth-child(1) {
    animation-name: expand1;
}
div.text-part > :nth-child(1) { animation-delay: calc(0.6s * var(--timeScale) + var(--timeDelay)); }
div.text-part > :nth-child(2) { animation-delay: calc(0.75s * var(--timeScale) + var(--timeDelay)); }
div.text-part > :nth-child(3) { animation-delay: calc(0.86s * var(--timeScale) + var(--timeDelay)); }
 
div.main-class::before, div.main-class::after {
    animation-name: iconslide;
    animation-duration: calc(0.45s * var(--timeScale));
    animation-delay: calc(0.8s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.12,.41,.27,.99);
    animation-fill-mode: backwards;
}
 /* BOTTOM TEXT */
div.main-class > *,  div.disrupt-class > *, div.risk-class > * {
    animation-name: flowIn;
    animation-duration: calc(0.42s * var(--timeScale));
    animation-delay: calc(0.75s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: ease-out;
    animation-fill-mode: backwards;
}
 
/* DIAMOND */
div.arrows {
    animation-name: arrowspin;
    animation-duration: calc(0.7s * var(--timeScale));
    animation-delay: calc(0.6s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.12,.41,.27,.99);
    animation-fill-mode: backwards;
}
 
div.quadrants > * {
    animation-name: fade;
    animation-duration: calc(0.3s * var(--timeScale));
    animation-delay: calc(1.4s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.12,.41,.27,.99);
    animation-fill-mode: backwards;
}
 
div.top-icon, div.right-icon, div.left-icon, div.bottom-icon {
    animation-name: nodegrow;
    animation-duration: calc(0.4s * var(--timeScale));
    animation-delay: calc(1.4s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.12,.41,.27,.99);
    animation-fill-mode: backwards;
}
div.diamond-part {
    clip-path: polygon( -10% 0.37%, 120% 0.37%, 120% 100%, -10% 100%);
    animation-name: diamondBorder;
    animation-duration: calc(0.8s * var(--timeScale));
    animation-delay: calc(0.5s * var(--timeScale) + var(--timeDelay));
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.32,.38,.39,.94);
    animation-fill-mode: backwards;
    will-change: box-shadow;
}
 
/* MOBILE QUERY */
@media (max-width: 480px ) {
    .anom-bar > .bottom-box::before {
        display:none;
    }
    .anom-bar > .bottom-box {
        box-shadow: 0 -0.5rem 0 0 rgb(var(--black-monochrome, 12, 12, 12))!important;
    }
    div.top-center-box  > * {
        animation-name: bar-mobile;
        animation-duration: calc(0.9s * var(--timeScale));
    }
    div.top-center-box > :nth-child(1) { animation-delay: calc(0.1s * var(--timeScale) + var(--timeDelay)); }
    div.top-center-box > :nth-child(2) { animation-delay: calc(0.2s * var(--timeScale) + var(--timeDelay)); }
    div.top-center-box > :nth-child(3) { animation-delay: calc(0.3s * var(--timeScale) + var(--timeDelay)); }
    div.top-center-box > :nth-child(4) { animation-delay: calc(0.4s * var(--timeScale) + var(--timeDelay)); }
    div.top-center-box > :nth-child(5) { animation-delay: calc(0.5s * var(--timeScale) + var(--timeDelay)); }
    div.top-center-box > :nth-child(6) { animation-delay: calc(0.6s * var(--timeScale) + var(--timeDelay)); }
 
}
/*--- Motion Accessibility ---*/
@media (prefers-reduced-motion) {
    div.anom-bar-container { --timeScale: 0; }
}
 
/*-------------------------*/
 
@keyframes divider {
    from { max-width: 0%;  }
    to { max-width: 100%; }
}
 
@keyframes bar {
    from { max-width: 0%; }
    to { max-width: 100%; }
}
@keyframes bar-mobile {
    from { max-height: 0%; }
    to { max-height: 100%; }
}
 
@keyframes bottomup {
    from { top: 100px; }
    to { top: 0; }
}
 
@keyframes expand1 {
    from { opacity: 0; clip-path: inset(0 calc(100% - 0.75rem) 0 0);}
    to { opacity: 1; clip-path: inset(0);}
}
@keyframes iconslide {
    from { opacity: 0; transform: translateX(-5rem);}
    to { opacity: 1; transform: translateX(0);}
}
 
@keyframes expand2 {
    from { opacity: 0; max-width: 1%;}
    to { opacity: 1; max-width: 100%;}
}
@keyframes fade {
    from { opacity: 0;}
    to { opacity: 1;}
}
 
@keyframes flowIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
 
@keyframes arrowspin {
    from { clip-path: circle(0%); transform: rotate(135deg); }
    to { clip-path: circle(75%); transform: rotate(0deg); }
}
@keyframes nodegrow {
    from { transform: scale(0);}
    to {  transform: scale(1);}
}
@keyframes diamondBorder {
    from { box-shadow: -0.5rem -20rem 0 0 rgb(var(--black-monochrome, 12, 12, 12)); }
    to { box-shadow: -0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12)); }
}

Item#: 6888

Level6

Containment Class:

esoteric

Secondary Class:

zurvan

Disruption Class:

amida

Risk Class:

critical

link to memo

Attention: Subsequent events provided in this document may or may not have already occurred. Head Researcher Dr. Abraham Wright has been charged with keeping detailed and up-to-date logs on SCP-6888 following each programmed reboot. If Dr. Wright does not exist, the O5 council shall determine an appropriate replacement.

Special Containment Procedures: Since the permanent containment of SCP-6888 is currently impossible, tracking of the entity's black body radiation will be used to determine materialization points. A perimeter of 17km around each site is to be maintained and monitored at all times, with a set of teams being ready to mobilize should the entity shift away from the area.

Updated: 12/12/1992

Due to the nature of SCP-6888 and the revelations of its purpose, the security level of this document has been elevated to clearance Level 6. All unauthorized personnel and civilians will be administered Class C amnestics, with individual access to SCP-6888 to now be at the discretion of the O5 council. Future endeavors will be on efforts to protect and erase any information released.

---

SCP-6888 in its activated state.

Description: SCP-6888 is a simulated manifestation of an artificial intelligence, appearing as a 23 to 28 meter tall black, non-reflective lighthouse. The physical composition of the entity is comparable to iterative arrays1, which allows continuous rearrangement of SCP-6888’s molecular substructure. The constant shifting of the entity’s framework allows for simultaneous manifestations at different locations on the planet, granting constant observation of key areas. This shifting is known to cause significant destabilization of the surrounding atmosphere, generating powerful hurricane supercells and black body radiation. Constant tracking of these conditions has allowed for anticipation of the next materialization sites within the range of 24 hours.

Upon manifesting, SCP-6888 will enter an active state; turning on high-intensity light that emits brief omnidirectional flashes at 2 to 3 per second; lasting for approximately 4 hours. These long exposures subject large areas to ionizing radiation of 25 - 30 mSv per rotation, causing substantial physical and psychological phenomena. Recovered recordings of these events have shown individuals conducting normal activities while themselves and surrounding structures are partially disintegrated then reconstructed from SCP-6888’s photo-radiation. Following the event, subjects could not recall the activities or anything odd occurring during or after SCP-6888’s manifestation. Further examination of these sites also exhibited extensive malformations and degradation of the local, with several objects and occupants composed of abnormal matter. These changes only occur within the 17km limit of the SCP-6888 manifestation, showing a severe but limited effect on the immediate area.

SCP-6888’s prime directive is to simulate the baseline universe to perform extensive analysis on XK class events. Currently, the beginning of these scenarios are unknown but are thought to change according to perceived milestones of the SCP Foundation through successful resolution of an event. Upon failure of the Foundation to ensure humanity's survival, the artificial intelligence, SCP-6888, will record and analyze failures to advise on potential solutions. Once analysis is completed, SCP 6888 will initiate a reboot, restarting the simulation to a previous saved state to begin again under another random set of parameters.

Due to the implementation of erratic calculations, simulations are inherently unstable resulting in inconsistencies or “glitching” within the computational matrix. A recovered index of SCP-6888 logs show extensive failures with 56% of scenarios failing to complete due to state fidelity or quantum decoherence. To counteract these systemic issues, SCP-6888 has implemented synchronized error correction; utilizing scans of the baseline reality to incorporate real time updates to the simulated duplicate. Since discovery of SCP-6888, there has been a steady decrease of 2.8Hz per synchronization attempt; causing the universe’s frequency to decrease from 963Hz to 837Hz. Attempts to halt the synchronization process and maintain the current simulated state are currently being developed by Lead Researcher Dr. Abraham Wright.

---

Discovery: The following logs detail lead researcher, Dr. Abraham Wright’s personal audio journal on SCP-6888 and his findings related to it.

+Addendum SCP-6888-1:

+Addendum SCP-6888-Y2K

Forward: The terminal, Y2K, is a Hewlett-Packard VT2640 computer heavily retrofitted to perform simplistic quantum computations and P2P networking¹. Over the course of 72 hours, testing was conducted to establish contact with SCP-6888 using information provided by Dr. Wright. For security purposes, the terminal is secluded on a closed interoperable network with several Cerberus firewalls to prevent access to Foundation systems. Provided is the following catalog showing a collection of completed, non-sequential scenarios provided in SCP-6888’s database. Repeating scenarios have been excluded from the record. Diagnostic analysis preformed by the artificial intelligence.

XK Class Scenarios

Scenario: 1
Location: N/A
Event: Failure to simulate reality.
Diagnostic Analysis: Failure to simulate scenario. Beta initiations of reality proved to be unstable and unreliable. Synchronization of network and program to improve stability.

Scenario: 32
Location: N/A
Event: Collapse of general parameters.
Diagnostic Analysis: Failure to simulate scenario. General degradation of physics in generated scenarios. Algorithms updated.

Scenario: 43
Location: N/A
Event: Simulated reality inconsistent with parameters.
Diagnostic Analysis: Failure to simulate scenario. Different degrees of impartial or a combination of biological and synthetic objects. Rework of examinations done by digital network.

Scenario: 55
Location: N/A
Event: Unsatisfactory simulation of human sentience resulting in mass suicide, starvation and violence.
Diagnostic Analysis: Failure to simulate accurate repilicas. Integration of neurological scans used as a foundational template for random generation of human consciousness.

Scenario: 69
Location: N/A
Event: Reboot prematurely initiated.
Diagnostic Analysis: Failure to continue scenario. Reboot process reworked to not trigger during onset of event. Provided parameters extends to complete extinction of humanity in its current form.

Scenario: 75
Location: N/A
Event: Initiated scans absorbing subjects biomass.
Diagnostic Analysis: Failure to simulate scenario. Date processing has been reduced to avoid disruption of scenario.

Scenario: 101
Location: Mygdum, Greece
Event: Molecular instability of the Earth’s crust was detected near the site of Mygdum, Greece with scans showing a large area being converted into the element Au. Within 30 mins, half of the planet had collapsed into the mantle with the sudden contraction causing objects to accelerate to the Earth at 30,000 km/h.
Diagnostic Analysis: Failure of SCP Foundation to secure anomaly. Advise: Resource allocation for exploration and expeditions into ancient tombs and structures. Probing of mythological references of artifacts and creatures.

Scenario: 582
Location: Brazil
Event: CK Class: Detection of a mutated form of the fungus Histoplasma capsulatum, was detected in various Brazilian freshwater sources leading to infection of nearby wildlife and human populations. The fungal infection spread quickly in heavily populated areas with scans showing cases of hepatosplenomegaly², lymphadenopathy³, and development of severe lesions. Within 13 days, growths of massive fungi populated major metropolitan areas polluting the atmosphere with continued release of spores.
Diagnostic Analysis: Failure of SCP Foundation to combat air and water contamination of a bio-hazard. Advise: Development of fungal treatment and decentralization of water resources.

Scenario: 889
Location: N. Broadway, Chicago
Event: DW-K Class: The consumption of the Doctor Wondertainment product "Candied Sweetbread", caused changes of human physiology near N. Broadway, Chicago. Composition of subjects matched various forms of confection such as jelly, cocoa and various disaccharide sugars. Multiple subjects were detected to become partially transformed within 48 hours, with most of the skin turning before the organs. During this time, a small group of individuals both human and animal were evaluated consuming affected subjects. Once an individual was consumed, the effects were passed on to the consumer with various shedding of skin and waste spreading rapidly throughout the area. Contamination of water sources and the consumption of infected individuals quickly caused a collapse of SCP Foundation resources.
Diagnostic Analysis: Failure of SCP Foundation to adequately combat GOI projects or activities. Advise: A monthly sweep of departments in the Chicago area. Restriction of GOI resources.

Scenario: 2846
Location: N/A
Event: Simulation interrupted due to incomplete information.
Diagnostic Analysis: Failure to simulate scenario. Initiated update of protocols and subroutines. Beginning process to generate physical structure in base program to assist with synchronization of secondary program.

Scenario: 3356
Location: Cairo, Egypt
Event: BK Class: Formation of cumulonimbus clouds composed of Tardigrades that excreted nitrogen oxide and sulfur dioxide. With rainfall, the microorganisms were able to infect the global population by living within the body’s natural water reserves. Expulsion of massive amounts of bodily fluid added to the atmospheric composition causing 52% of the cloud formations to be composed of tissue, fecal material, and blood.
Diagnostic Analysis: Failure of SCP Foundation to combat air and water contamination of a bio-hazard. Advise: Incorporation use of the WaterSense program to sanitize large water sources.

Scenario: 5223
Location: N/A
Event: Corruption of scenario due to incomplete reboot. Subsequent XK event carried over to new simulation resulting in assimilation of the current event.
Diagnostic Analysis: Failure to simulate scenario. Increasing progress to transfer over data between generated simulation 1 and 2. Synchronization up .04 %.

Scenario: 6027
Location: Global
Event: Altercation between SCP Foundation and global powers following a security breach and subsequent release of information on the internet. Recruitment by GOI-1, GOI-3 and GOI-6 rose 50 %, increasing support and resources to organize attacks against the foundation. These assaults resulted in the destruction of multiple containment facilities being, losing a substantial amount of SCPs. Continued outbreaks of wars and the use of SCPs by hostile forces, sets off a rapid deterioration of humanity.
Diagnostic Analysis: Failure of SCP Foundation to adequately control general populations activities. Advise: Secure control on global network and subjugate unwilling parties.

Scenario: 8499
Location: Atlanta, Georgia
Event: The discovery of genetic modification leads to significant progress in medical science. Changes in human DNA allow for eradication of genetic diseases and defects, allowing for a controlled evolutionary process.
Diagnostic Analysis: Failure of SCP Foundation to use necessary measures in order to maintain current humanity. Advise: Restrict medical research to prevent accelerated bio-evolution.

Scenario: 10233
Location: N/A
Event: Failure of dynamic photographic dampener; revealing under-laying photo cellular matrix. Simulation prematurely terminated.
Diagnostic Analysis: Failure of error correction due to increased quantum decoherence and state fidelity. Advise: Increase synchronization rotations to increase stability.

Footnotes

1. Peer-to-peer network, where computers provide equal access to resources and data.

2. An enlargement of the liver and spleen.

3. Swollen or enlarged lymph nodes

Pelroma II

Item#: 6888

Level5

Containment Class:

euclid

Secondary Class:

{$secondary-class}

Disruption Class:

amida

Risk Class:

critical

link to memo

SCP-6888 growing from site 9.

Special Containment Procedures: [Paragraphs explaining the procedures]

Description: [Paragraphs explaining the description]

Addendum: [Optional additional paragraphs]

[[footnoteblock]]

Automata

Item#: XXXX

Level4

Containment Class:

euclid

Secondary Class:

{$secondary-class}

Disruption Class:

vlam

Risk Class:

danger

link to memo

Special Containment Procedures: [Paragraphs explaining the procedures]

Description: [Paragraphs explaining the description]

Addendum: [Optional additional paragraphs]

[[footnoteblock]]