testing CCS Grid

---

+ 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));
}

ADDENDUM XXXX.1
Group of Interest Profile Database Entry "UNBORN"

OPEN ADDENDUM

Group of Interest Profile ◦ Site-35 Department of External Groups

"HANSARP"

Unknown

Benjamin Martin

Woed, I need help to get rid of this image, and text whilst not fucking up the thing ;-;

• Canada
• Yukon
• Quebec
• Alberta
• Manitoba
• New Brunswick

• North Dakota
• Oregon
• Alaska
• Montana
• Washington
• Idaho

• Utah
• Colorado

Group's activity are focused on the creation of anomalous birth control products, and media. Based on testing, and investigations by Foundation personnel, the anomalous objects ranges from the creation of cognitohazardous images capable of nullyfing sexual affection to casteration, and abduction of children.

It is hypothezied that "UNBORN", an anomalous Canadian group, is focused on the creation anomalous objects, and media capable of discouraging/preventing adults from producing offspring, and luring/kidnapping children from their families. Several interregated members of "UNBORN" all possess a significant belief in anti-natalism, with the primary goal being to "save" children from hazardous events.

Interegated members have confessed that "UNBORN" has connections to GoI-1115 "Anderson Robotics", explaining the group provided technology, and knowledge into developing the anomalous media orginating from "UNBORN". Following the newly discovered info, MTF Gamma-13 "Asimov’s Lawbringers" were tasked with monitoring, and hindering the external exhange between the two groups, as well as investigate the full extant of the collaboration.