Link to article: HOTFISH.
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
:root {
--black: #333333;
--white: #eee;
--line: 2px solid var(--black);
--timer: 200ms;
--trans: transparent;
--header-title: "";
--header-subtitle: "";
--sp_header-logo: none;
--sp_header-logo-adaptive-size: 0;
--sp_header-height: 6rem;
--sp_top-bar-link-color: var(--black);
--sp_top-bar-link-hover-color: var(--white);
--sp_top-bar-link-hover-background: var(--black);
--sp_dropdown-link-color: var(--black);
--sp_dropdown-link-hover-color: var(--white);
--sp_dropdown-link-background: var(--white);
--sp_dropdown-link-hover-background: var(--black);
--sp_dropdown-link-border: none;
--sp_rate-module-text-color: var(--white);
--sp_rate-module-background: var(--black);
--sp_rate-module-sub-color: var(--white);
--sp_rate-module-active-color: var(--black);
--sp_rate-module-button-color: var(--white);
--sp_rate-module-button-background: var(--black);
--sp_rate-module-button-hover-color: var(--black);
--sp_rate-module-button-hover-background: var(--white);
}
body, html {
scrollbar-width: thin;
}
a, a.newpage, a:visited, #interwiki a, #side-bar a, a.action-area-close, .page-watch-options a, #footer a {
color: var(--black);
font-weight: bold;
transition: var(--timer);
}
a:hover, a:visited:hover, #interwiki a:hover, #side-bar a:hover, a.action-area-close:hover, .page-watch-options a:hover, #footer a:hover {
color: var(--white);
background-color: var(--black);
text-decoration: none;
}
#container {
overflow-x: hidden;
background-color: var(--white);
}
#header {
grid-template-areas:
". . . . login"
". . . . search"
". . . . ."
"top-bar top-bar top-bar top-bar top-bar";
background-image: none;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
}
#header-extra-div-1 {
grid-column: 5 / 6;
grid-row: 1 / 3;
border-left: var(--line);
border-bottom: var(--line);
}
#login-status {
margin-right: 0.5em;
margin-top: 0.5em;
padding: 0;
color: var(--black);
font-weight: bold;
white-space: nowrap;
padding-left: 3rem;
}
#login-status .printuser {
display: inline-block;
padding: 0 5px;
position: relative;
transition: var(--timer);
}
#login-status .printuser a {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}
#login-status .printuser:hover {
background-color: var(--black);
color: var(--white);
}
#login-status .printuser a img {
display: none;
}
a#my-account {
color: var(--black);
padding: 0 5px;
transition: var(--timer);
}
a#my-account:hover {
color: var(--white);
background-color: var(--black);
text-decoration: none;
}
a#account-topbutton {
color: var(--black);
font-size: 100%;
padding: 0 5px;
border-color: var(--trans);
margin-left: -3px;
transition: var(--timer);
}
a#account-topbutton:hover {
color: var(--white);
background-color: var(--black);
}
#account-options ul {
border: var(--line);
background-color: var(--white);
}
#account-options li a {
color: var(--white);
background-color: var(--black);
transition: var(--timer);
}
#account-options li a:hover {
padding-right: 1.5rem;
color: var(--white);
}
#search-top-box {
align-items: flex-start;
flex-direction: row-reverse;
flex-wrap: wrap;
padding: 0 12px 0 0;
}
#search-top-box-form input[type=submit] {
background-color: var(--white);
background-image: none;
color: var(--black);
border-color: var(--trans);
box-shadow: none;
border-radius: 0;
transition: var(--timer);
}
#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus {
background-color: var(--black);
border-color: var(--trans);
background-image: none;
color: var(--white);
box-shadow: none;
}
#top-bar {
background-image: none;
border-bottom: var(--line);
}
#top-bar .open-menu a {
color: var(--black);
background-color: var(--white);
border-radius: 0;
border: var(--line);
font-weight: 100;
transition: var(--timer);
}
#top-bar .open-menu a:hover {
background-color: var(--black);
color: var(--white);
}
#top-bar div[class*="top-bar"] > ul {
justify-content: center;
}
#top-bar ul li ul {
border: var(--line);
border-width: 2px;
box-shadow: none;
}
#interwiki .side-block, #side-bar .side-block, #side-bar .side-block.media, #side-bar .side-block.resources {
border: var(--line);
border-radius: 0;
box-shadow: none;
background-color: var(--white);
}
#interwiki .heading, #side-bar .heading {
color: var(--white);
border-bottom: var(--line);
background-color: var(--black);
padding-left: 0;
text-align: center;
font-family: "Poppins";
font-size: 0.9em;
font-weight: 400;
}
#content-wrap {
margin-top: 0;
}
#main-content {
border-left: var(--line);
border-right: var(--line);
padding: 0 10px;
}
#page-title {
display: none;
}
.moduleRateWrap {
position: fixed;
top: 2rem;
right: 50%;
transform: translate(50%, 0);
z-index: 10;
}
div.page-rate-widget-box .rate-points {
text-transform: capitalize;
font-family: "Lexend";
}
div.page-rate-widget-box, .page-rate-widget-box {
border-radius: 0;
box-shadow: none;
}
div.page-rate-widget-box .cancel a:hover, .page-rate-widget-box .cancel a:hover {
background-color: var(--white);
border-radius: 0;
}
#page-info, .page-watch-options, .page-options-bottom {
text-align: center;
margin: auto;
width: 60%;
}
#footer {
margin-top: 0;
border-top: var(--line);
background-color: var(--white);
color: var(--black);
}
.page-tags span {
border-top: var(--line);
}
.portrait {
position: relative;
margin: 6rem -10px;
font-family: "Lexend";
font-size: clamp(3.125rem, 2.303rem + 4.386vw, 6.25rem);
max-width: calc(100% + 20px);
background-color: var(--white);
transition: var(--timer);
}
.portrait:hover {
background-color: var(--black);
color: white;
}
.portrait::before {
position: absolute;
content: "";
border-top: var(--line);
border-bottom: var(--line);
height: 99%;
width: 200vw;
top: 0;
left: 0;
transform: translate(-50%, 0);
}
.portrait p {
margin-block-start: 0;
margin-block-end: 0;
line-height: 0.9;
letter-spacing: -5px;
}
.portraitLogin {
position: fixed;
bottom: 50%;
right: 0;
text-align: right;
z-index: 10;
transform: translate(0, 50%);
}
.portraitLogin p {
margin-block-start: 0;
margin-block-end: 0;
line-height: 1.5;
}
.portraitLoginSpan {
background-color: var(--black);
color: var(--white);
font-size: 1rem;
}
.portraitLoginSpan a {
color: var(--white);
padding-left: 3rem;
padding-right: 0.5rem;
}
.portraitLoginSpan a:hover {
padding-right: 1.5rem;
color: var(--white);
}
.arrayTitle {
margin: 0 -10px;
border-bottom: var(--line);
text-align: center;
font-size: 3.5rem;
max-width: calc(100% + 20px);
font-family: "Poppins";
}
.arrayTitle p {
margin-block-start: 0;
margin-block-end: 0;
line-height: 1;
}
.array {
display: grid;
grid-template-columns: repeat(3, minmax(10px, 1fr));
margin: 0 -10px;
max-width: calc(100% + 20px);
}
.fact1 {
grid-column: 1 / 2;
grid-row: 1 / 2;
border-bottom: var(--line);
border-right: var(--line);
}
.fact2 {
grid-column: 2 / 3;
grid-row: 1 / 2;
border-bottom: var(--line);
border-right: var(--line);
}
.fact3 {
grid-column: 3 / 4;
grid-row: 1 / 2;
border-bottom: var(--line);
}
.fact4 {
grid-column: 1 / 2;
grid-row: 2 / 3;
border-bottom: var(--line);
border-right: var(--line);
}
.fact5 {
grid-column: 2 / 3;
grid-row: 2 / 3;
border-bottom: var(--line);
border-right: var(--line);
}
.fact6 {
grid-column: 3 / 4;
grid-row: 2 / 3;
border-bottom: var(--line);
}
.fact7 {
grid-column: 1 / 2;
grid-row: 3 / 4;
border-bottom: var(--line);
border-right: var(--line);
}
.fact8 {
grid-column: 2 / 3;
grid-row: 3 / 4;
border-bottom: var(--line);
border-right: var(--line);
}
.fact9 {
grid-column: 3 / 4;
grid-row: 3 / 4;
border-bottom: var(--line);
}
.scp7480 {
grid-column: 1 / 3;
grid-row: 1 / 2;
border-bottom: var(--line);
}
.scp7012 {
grid-column: 2 / 3;
grid-row: 2 / 3;
border-bottom: var(--line);
border-left: var(--line);
}
.scp6136 {
grid-column: 1 / 2;
grid-row: 2 / 3;
border-bottom: var(--line);
}
.scp6970 {
grid-column: 3 / 4;
grid-row: 1 / 4;
border-bottom: var(--line);
border-left: var(--line);
}
.scp6031 {
grid-column: 1 / 3;
grid-row: 3 / 4;
border-bottom: var(--line);
}
.tale1 {
grid-column: 1 / 3;
grid-row: 1 / 3;
border-bottom: var(--line);
border-right: var(--line);
}
.tale2 {
grid column: 3 / 4;
grid-row: 1 / 2;
border-bottom: var(--line);
}
.tale3 {
grid column: 3 / 4;
grid-row: 2 / 3;
border-bottom: var(--line);
}
.tale4 {
grid-column: 2 / 4;
grid-row: 3 / 4;
border-bottom: var(--line);
}
.tale5 {
grid-column: 1 / 2;
grid-row: 3 / 4;
border-bottom: var(--line);
border-right: var(--line);
}
.tale6 {
grid-column: 2 / 3;
grid-row: 4 / 6;
border-bottom: var(--line);
border-right: var(--line);
}
.tale7 {
grid-column: 1 / 2;
grid-row: 4 / 5;
border-bottom: var(--line);
border-right: var(--line);
}
.tale8 {
grid-column: 3 / 4;
grid-row: 4 / 5;
border-bottom: var(--line);
}
.tale9 {
grid-column: 1 / 2;
grid-row: 5 / 6;
border-bottom: var(--line);
border-right: var(--line);
}
.tale10 {
grid-column: 2 / 3;
grid-row: 6 / 7;
border-bottom: var(--line);
border-right: var(--line);
}
.tale11 {
grid-column: 3 / 4;
grid-row: 5 / 6;
border-bottom: var(--line);
}
.tale12 {
grid-column: 1 / 2;
grid-row: 6 / 7;
border-right: var(--line);
}
.goi1 {
grid-column: 2 / 4;
grid-row: 1 / 3;
border-bottom: var(--line);
}
.goi2 {
grid-column: 1 / 2;
grid-row: 1 / 3;
border-bottom: var(--line);
border-right: var(--line);
}
.goi3 {
grid-column: 1 / 3;
grid-row: 3 / 4;
border-bottom: var(--line);
border-right: var(--line);
}
.essay1 {
grid-column: 1 / 3;
grid-row: 1 / 2;
border-bottom: var(--line);
}
.essay2 {
grid-column: 1 / 3;
grid-row: 2 / 3;
border-bottom: var(--line);
}
.essay3 {
grid-column: 1 / 3;
grid-row: 3 / 4;
border-bottom: var(--line);
}
.essay4 {
grid-column: 1 / 3;
grid-row: 4 / 5;
border-bottom: var(--line);
}
.essay5 {
grid-column: 3 / 4;
grid-row: 1 / 5;
border-bottom: var(--line);
border-left: var(--line);
}
.essay6 {
grid-column: 1 / 3;
grid-row: 5 / 6;
border-bottom: var(--line);
}
.essay7 {
grid-column: 3 / 4;
grid-row: 5 / 7;
border-left: var(--line);
border-bottom: var(--line);
}
.art1 {
grid-column: 1 / 3;
grid-row: 1 / 3;
border-bottom: var(--line);
border-right: var(--line);
}
.art2 {
grid-column: 3 / 4;
grid-row: 1 / 2;
border-bottom: var(--line);
}
.art3 {
grid-column: 3 / 4;
grid-row: 2 / 4;
border-bottom: var(--line);
}
.art4 {
grid-column: 1 / 3;
grid-row: 3 / 4;
border-bottom: var(--line);
border-right: var(--line);
}
.art5 {
grid-column: 1 / 2;
grid-row: 4 / 5;
border-bottom: var(--line);
border-right: var(--line);
}
.art6 {
grid-column: 3 / 4;
grid-row: 5 / 6;
border-bottom: var(--line);
}
.art7 {
grid-column: 2 / 4;
grid-row: 4 / 5;
border-bottom: var(--line);
}
.art8 {
grid-column: 1 / 3;
grid-row: 5 / 6;
border-bottom: var(--line);
border-right: var(--line);
}
.art9 {
grid-column: 1 / 2;
grid-row: 6 / 8;
border-bottom: var(--line);
border-right: var(--line);
}
.art10 {
grid-column: 2 / 3;
grid-row: 6 / 7;
border-bottom: var(--line);
border-right: var(--line);
}
.collab1 {
grid-column: 1 / 2;
grid-row: 1 / 2;
border-bottom: var(--line);
border-right: var(--line);
}
.collab2 {
grid-column: 2 / 3;
grid-row: 1 / 2;
border-bottom: var(--line);
border-right: var(--line);
}
.collab3 {
grid-column: 3 / 4;
grid-row: 1 / 3;
border-bottom: var(--line);
}
.collab4 {
grid-column: 1 / 2;
grid-row: 3 / 4;
border-bottom: var(--line);
border-right: var(--line);
}
.collab5 {
grid-column: 1 / 3;
grid-row: 2 / 3;
border-bottom: var(--line);
border-right: var(--line);
}
.collab6 {
grid-column: 2 / 4;
grid-row: 3 / 4;
border-bottom: var(--line);
}
.collab7 {
grid-column: 1 / 3;
grid-row: 4 / 5;
border-bottom: var(--line);
border-right: var(--line);
}
.collab8 {
grid-column: 3 / 4;
grid-row: 4 / 5;
border-bottom: var(--line);
}
.collab9 {
grid-column: 1 / 2;
grid-row: 5 / 6;
border-bottom: var(--line);
border-right: var(--line);
}
.collab10 {
grid-column: 1 / 3;
grid-row: 6 / 7;
border-bottom: var(--line);
border-right: var(--line);
}
.collab11 {
grid-column: 1 / 3;
grid-row: 7 / 8;
border-bottom: var(--line);
border-right: var(--line);
}
.collab12 {
grid-column: 2 / 4;
grid-row: 5 / 6;
border-bottom: var(--line);
}
.collab13 {
grid-column: 3 / 4;
grid-row: 6 / 9;
border-bottom: var(--line);
}
.arrayBox {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
position: relative;
padding: 0 5px;
}
.legend {
position: relative;
}
.legend::after {
position: absolute;
content: ">100";
background-color: var(--white);
border-bottom: var(--line);
border-left: var(--line);
padding: 0 5px;
top: 0;
right: 0;
font-weight: bold;
}
.leftbar {
position: relative;
}
.leftbar::before {
position: absolute;
content: "";
border-bottom: var(--line);
width: 100vw;
top: -1px;
right: 100%;
}
.rightbar {
position: relative;
}
.rightbar::before {
position: absolute;
content: "";
border-top: var(--line);
width: 100vw;
bottom: -2px;
left: 100%;
}
.arrayBoxTitle {
font-weight: 400;
font-size: 1.2rem;
font-family: "Poppins";
}
.arrayBoxDescription {
font-style: italic;
font-weight: 600;
font-family: 'Poppins';
font-size: 0.9rem;
}
.arrayLink {
font-size: 0;
}
.arrayLink a {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.arrayLink a:hover {
background-color: rgba(0,0,0,0.1);
}
@media only screen and (max-width: 400px) {
.array {
display: block;
}
.portraitLogin {
display: none;
}
.arrayBox {
border-right: none !important;
border-left: none !important;
}
}
margin-top: 6rem
margin-top: 6rem
margin-top: 6rem
margin-top: 6rem
margin-top: 6rem
margin-top: 6rem
margin-top: 6rem
margin-top: 6rem
margin:300px
moduleRateWrap
portraitLogin
portraitLoginSpan
portraitLoginSpan
portraitLoginSpan
portraitLoginSpan
portraitLoginSpan
portraitLoginSpan
portraitLoginSpan
portraitLoginSpan
portrait
arrayTitle
array
arrayBox
fact1
arrayBoxDescription
arrayBox
fact2
arrayBoxDescription
arrayBox
fact3
arrayBoxDescription
arrayBox
fact4
arrayBoxDescription
arrayBox
fact5
arrayBoxDescription
arrayBox
fact6
arrayBoxDescription
arrayBox
fact7
arrayBoxDescription
arrayBox
fact8
arrayBoxDescription
arrayBox
fact9
arrayBoxDescription
arrayTitle
array
arrayBox
scp7480
legend
leftbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
scp7012
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
scp6136
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
scp6970
legend
rightbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
scp6031
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayTitle
array
arrayBox
tale1
legend
leftbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale2
rightbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale3
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale4
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale5
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale6
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale7
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale8
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale9
leftbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale10
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale11
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
tale12
arrayTitle
array
arrayBox
goi1
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
goi2
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
goi3
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayTitle
array
arrayBox
essay1
arrayBoxTitle
arrayBoxDescription
arrayBox
essay2
arrayBoxTitle
arrayLink
arrayBox
essay3
arrayBoxTitle
arrayLink
arrayBox
essay4
arrayBoxTitle
arrayLink
arrayBox
essay6
arrayBoxTitle
arrayLink
arrayBox
essay5
rightbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
essay7
rightbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayTitle
array
arrayBox
art1
leftbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art2
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art3
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art4
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art5
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art6
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art7
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art8
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art9
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
art10
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayTitle
array
arrayBox
collab1
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab2
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab3
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab4
leftbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab5
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab6
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab7
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab8
rightbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab9
leftbar
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab10
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab11
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab12
legend
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayBox
collab13
arrayBoxTitle
arrayBoxDescription
arrayLink
arrayTitle