Monoxide Css

/*

• ▌ ▄ ·. ▐ ▄
·██ ▐███▪ ▪ •█▌▐█ ▪
▐█ ▌▐▌▐█· ▄█▀▄ ▐█▐▐▌ ▄█▀▄
██ ██▌▐█▌ ▐█▌.▐▌ ██▐█▌ ▐█▌.▐▌
▀▀ █▪▀▀▀ ▀█▄▀▪ ▀▀ █▪ ▀█▄▀▪
▐▄• ▄ ▪ ·▄▄▄▄ ▄▄▄ .
█▌█▌▪ ██ ██▪ ██ ▀▄.▀·
·██· ▐█· ▐█· ▐█▌ ▐▀▀▪▄
▪▐█·█▌ ▐█▌ ██. ██ ▐█▄▄▌
•▀▀ ▀▀ ▀▀▀ ▀▀▀▀▀• ▀▀▀
Monoxide Theme
[2023 Wikidot Theme]
Created by OxygenNine

*/

@import url(http://paraarc-sandbox.wikidot.com/local--files/files/Montserrat-Medium.otf);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url('http://tea-room.wikidot.com/local--files/files/OxygenMono-Regular.otf');

@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css');

@font-face {
font-family: "Oxygen Mono";
src: url("http://tea-room.wikidot.com/local--files/files/OxygenMono-Regular.otf") format("otf");
}

/* ROOT */

:root {

—mox-theme-color: #0031F5;
—mox-theme-dark-color: #0025B8;
—mox-theme-light-color: #335CFF;
—mox-bg-color: #FAFAFA;
—mox-text-color: #141414;

—mox-layer-dark-1: #262626;
—mox-layer-dark-2: #404040;
—mox-layer-dark-3: #595959;

—mox-layer-light-1: #F2F2F2;
—mox-layer-light-2: #D9D9D9;
—mox-layer-light-3: #BFBFBF;
—mox-bgblur-front-color: rgba(255,255,255,0.85);

—mox-warn-color: #FF335C;
—mox-accept-color: #33FF70;
—mox-alter-color: #FFD633;

—mox-header-title: "SCP基金会";
—mox-header-subtitle: "控制,收容,保护";
—mox-header-logo: url('http://oxygennine.wikidot.com/local--files/system:files/scp-logo-small-black.svg');

—mox-page-width: 75vw;

}

body {
font-family: 'Noto Sans SC',sans-serif;
font-size: 0.85em;
background-color: var(mox-bg-color);
color: var(
mox-text-color);
}

::selection {
background: var(mox-layer-dark-3);
color: var(
mox-bg-color);
}

.page-source, tt {
font-family: "Oxygen Mono","Consolas","Noto Sans SC",MONOSPACE;
}

.font-montserrat {
font-family: "Montserrat", "Noto Sans SC", sans-serif;
}

/* Header */

#header {
position: fixed;
z-index: 1;
height: 4rem;
display: grid;
box-sizing: unset;
grid-template-rows: 1fr;
direction: rtl;
grid-template-columns: 1fr;
grid-template-areas: 'topbar subtitle title search user menu';
justify-items: start;
align-items: center;
justify-content: end;
background-color: var(mox-layer-light-1);
border-bottom: solid 2px var(
mox-layer-light-2);
box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
left: 0px;
top: 0px;
width: 100%;
grid-gap: 0px 0px;
}

#header h1 {
margin: 0;
grid-area: title;
display: block;
padding: 0rem 0rem 0.6rem 1rem;
border-left: solid 2px var(—mox-layer-light-3);
}

#header h1 a span {
font-size: 0;
}

#header h2 {
margin: 0;
padding: 0;
grid-area: title;
display: block;
transform: translateY(1rem);
width: calc(100% - 5.3rem);
text-align: left;
}

#header h2 span {
font-size: 0;
}

#header h2 span::before {
content: var(—mox-header-subtitle);
font-size: 0.8rem !important;
font-weight: normal;
}

#search-top-box {
position: relative;
right: 0em;
top: 0em;
z-index: 10;
grid-area: search;
}

#login-status {
position: relative;
right: 0px;
top: 0px;
overflow: visible;
z-index: 25;
grid-area: user;
font-size: 0px;
}

#login-status > * {
font-size: 0.65rem !important
}

#search-top-box input.empty {
color: #AAA;
display: none;
}

#header #login-status .printuser {
font-size: 0 !important;
}

#login-status a#my-account {
display: none;
}

#login-status img.small {
width: 3rem;
height: 3rem;
background-image: none !important;
border-radius: 50%;
position: relative;
}

#login-status>a[href="https://www.wikidot.com/account/messages"]{
position: absolute;
background-color: var(mox-warn-color);
color: transparent;
display: block;
width: 0.75rem;
height: 0.75rem;
border-radius: 50%;
transform: translateX(-0.5rem) translateY(-0.9rem);
box-shadow: 0px 0px 0px 0.1rem var(
mox-layer-light-1);
z-index: 100;
}

a#account-topbutton:hover {
box-shadow: 0px 0px 0px 0.5rem var(—mox-layer-light-2);
border-radius: 50%;
}

#account-topbutton {
font-weight: bold;
padding: 0 5px;
border: none;
left: 4.2rem;
text-decoration: none;
background-color: transparent;
width: 2.4rem;
display: block;
text-align: center;
color: transparent !important;
direction: ltr;
top: 0.5rem;
position: fixed;
height: 3rem;
transition: all 0.2s;
}

#account-options {
position: fixed;
box-sizing: border-box;
width: 15rem;
right: 0;
padding: 0;
z-index: 40;
background-color: var(mox-layer-dark-1);
border: none;
direction: ltr;
left: 0px;
color: var(
mox-bg-color);
}

#account-options li a {
display: block;
box-sizing: border-box;
-moz-box-sizing: border-box;
z-index: 0;
color: var(—mox-layer-light-1) !important;
text-decoration: none;
font-size: 0.9rem;
padding: 0.8rem 1rem;
position: relative;
text-align: center;
transition: all 0.2s;
}

#account-options li a:hover {
color: var(mox-layer-dark-1) !important;
font-weight: bold;
background-color: var(
mox-layer-light-1);
box-shadow: 0px 0px 0px 6px var(—mox-layer-light-1);
}

#account-options ul {
display: grid;
margin: 0;
padding: 0;
list-style: none;
grid: auto-flow / 1fr 1fr;
box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
}

#header #search-top-box input#search-top-box-input {
display: none;
}

#header #search-top-box input.button {
margin-left: 0.6rem;
padding: 0;
text-decoration: none;
background-color: transparent;
border: none;
color: #000;
font-size: 0;
display: block;
width: 3rem;
height: 3rem;
margin-right: 1rem;
transition: all 0.2s;
z-index: 1;
position: relative;
backdrop-filter: grayscale(1);
}

#header #search-top-box input.button:hover {
cursor: pointer;
backdrop-filter: grayscale(0);
box-shadow: 0px 0px 0px 0.5rem var(—mox-layer-light-2);
}

form#search-top-box-form::after {
content: "\f002";
font-family: 'FontAwesome';
position: absolute;
right: 1.5rem;
top: 0.5rem;
font-size: 2rem;
color: var(—mox-theme-color);
}

#header h1 a span::before {
content: var(mox-header-title);
font-size: 1.6rem !important;
color: var(
mox-layer-dark-1);
}

div#header h1 a:hover {
background: transparent;
}

/* fuck u safari */

#header h1 a span::after {
display: inline;
padding: 0.8rem 1.7rem;
content: '';
border: none;
position: relative;
background-image: var(—mox-header-logo);
background-repeat: no-repeat !important;
background-size: contain;
background-position: center;
margin-right: 0.8rem;
font-size: 1rem !important;
}

div#header .top-bar ul:first-child>li>a, {
color: var(—mox-text-color);
}

div#header a:hover {
text-decoration:none;
}

#header-extra-div-1 {
grid-area: menu;
display: block;
width: 4rem;
height: 4rem;
position: relative;
background: transparent;
}

div#header .top-bar ul:first-child>li>a:hover {
text-decoration: none;
box-shadow: 0rem 1.3rem 0rem var(mox-layer-dark-1), 0rem -1.3rem 0rem var(mox-layer-dark-1), inset 0rem 0rem 0rem 1.5rem var(mox-layer-dark-1);
color: var(
mox-layer-light-1);
}

/* Top Bar */

.mobile-top-bar {
display: none;
}

#top-bar li a {
transition: all 0.2s;
text-align: center;
display: block;
margin: 0;
padding: 1px 1em;
text-decoration: none;
color: var(—mox-layer-dark-3);
font-weight: bold;
}

#top-bar {
position: relative;
right: 1em;
bottom: 0px;
z-index: 0;
/* display: grid; */
}

.top-bar {
display: grid;
/* grid-area: topbar; */
}

#top-bar ul {
display: flex;
margin: 0;
padding: 0;
list-style: none;
grid-area: topbar;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
}

#top-bar li ul {
padding: 0;
margin: 0;
width: auto;
border: unset;
box-shadow: 0.5rem 0.5rem var(mox-layer-light-2), -0.4rem 0rem var(mox-theme-color);
display: block;
}

#top-bar li ul li a {
width: 10em;
text-align: left;
background-color: var(mox-bgblur-front-color);
border: none;
color: var(
mox-layer-dark-2);
padding-top: 0.3rem;
padding-bottom: 0.3rem;
backdrop-filter: blur(5px);
}

#top-bar li ul li a:hover {
background-color: var(mox-layer-light-1);
text-decoration: none;
color: var(
mox-layer-light-1);
font-weight: 400;
scale: 1;
box-shadow: inset 15em 0 0 var(—mox-theme-color);
/* padding: 1em; */
padding-top: 1rem;
padding-bottom: 1rem;
}

@media (max-width: 767px) {
.mobile-top-bar {
display: block;
}
.top-bar {
display: none;
}
#header h1 {display:none;}
}

/* Main Content */

#main-content {
max-width: var(—mox-page-width) !important;
padding: 0px 0em;
margin-top: 5.6em;
margin: 5rem auto;
}

@media (max-width: 767px) {
#main-content {
max-width: 97vw !important;
}
}

/* Side Bar */

#side-bar {
float: none;
width: 15rem;
padding: 0.7rem;
margin: 0 0 0em 0;
clear: left;
position: fixed;
max-height: calc(100% - 4rem);
overflow-y: scroll;
top: 4rem;
background: var(—mox-bg-color);
font-size: 90%;
left: -20rem;
transition: left 0.4s , box-shadow 0.4s;
z-index: 10;
direction: rtl;
}

#side-bar h2, #side-block h1, .heading {
background: var(mox-layer-light-2);
color: var(
mox-layer-dark-1);
width: calc(100% + 1rem);
display: inline-block;
transform: translateX(-1rem);
padding: 0.3rem 0rem 0.3rem 1rem;
font-weight: bold;
}

.menu-item {
font-size: 0;
}

#side-bar .side-block .menu-item {
display: flex;
justify-content: flex-start;
}

#side-bar .side-block .menu-item a {
display: inline-block;
flex-grow: 1;
}

div#side-bar::before {
display: table-cell;
width: 15rem;
height: 10rem;
background: var(mox-layer-light-1);
content: var(
mox-header-subtitle);
background-image: var(—mox-header-logo);
background-position: center 1rem;
background-repeat: no-repeat;
background-size: 7rem;
text-align: center;
font-size: 1rem;
vertical-align: bottom;
font-weight: 600;
padding-bottom: 0.5rem;
}

.side-block {
padding: 0.5rem 1rem;
margin: 0.4rem 0;
background-color: var(—mox-layer-light-1);
box-shadow: none;
direction: ltr;
}

div#side-bar p {
margin: 0;
}

#side-bar .side-block a:hover {
box-shadow: inset 14rem 0rem var(mox-theme-color);
color: var(
mox-layer-light-1);
padding: 0.5rem 1.5rem;
}

#side-bar .side-block a {
display: block;
border-left: solid 0.2rem var(—mox-layer-light-2);
font-size: 0.8rem;
padding: 0.5rem 0.5rem;
}

div#side-bar::after {
position: fixed;
content: "\f0c9";
display: block;
top: 0rem;
left: 0rem;
z-index: 100;
background: transparent;
color: var(—mox-text-color);
font-family: 'FontAwesome';
font-size: 2rem;
width: 4rem;
height: 4rem;
text-align: center;
line-height: 4rem;
transition: all 0.4s;
}

div#side-bar:hover {
left: 0rem;
box-shadow: 30rem 0px 0px 50rem rgba(0,0,0,0.5);
}

div#side-bar:hover::after {
color: var(mox-layer-light-1);
background: var(
mox-layer-dark-2);
transform: unset;
box-shadow: inset 0px 0px 0px 0.7rem var(mox-layer-light-1);
width: 16.4rem;
content: var(
mox-header-title);
font-size: 1.2rem;
font-family: 'Montserrat','Noto Sans SC';
}

/* Page Content */

h1,h2,h3,h4,h5,h6 {
font-family: 'Montserrat','Noto Sans SC',sans-serif;
font-weight: 600;
margin: 0.5rem 0;
}

hr {
margin: 1em 2em;
padding: 0;
height: 2px;
border: none;
color: transparent;
background-color: var(—mox-layer-light-2);
}

#main-content h1 {
font-size: 230%;
font-weight: 600;
margin: 0.5rem 0rem;
}

#main-content h2,#main-content h3,#main-content h4,#main-content h5,#main-content h6 {
font-weight: bold;
margin: 0.3rem 0rem;
}

#main-content h2 {
font-size: 180%;
}

#main-content a,#side-bar a {
color: var(—mox-theme-color);
text-decoration: none;
transition: all 0.2s;
}

#main-content a:hover,#side-bar a:hover {
background-color: transparent;
text-decoration: none;
box-shadow: 0px 1px 0px 0px var(—mox-theme-light-color);
}

#main-content a:visited,#side-bar a:visited {
color: var(—mox-theme-dark-color);
text-decoration: none;
}

#main-content a.newlink,#side-bar a.newlink {
color: var(—mox-warn-color);
}

div.blockquote, blockquote {
border: none;
padding: 0.5rem 1rem;
background-color: var(mox-bg-color);
box-shadow: -0.2rem 0px 0px var(
mox-layer-dark-2), 0.2rem 0 0 var(mox-layer-light-1);
border-bottom: solid 0.2rem var(
mox-layer-light-1);
border-top: solid 0.2rem var(—mox-layer-light-1);
}

.footnotes-footer .title {
margin: 0.5em 0;
font-size: 150%;
font-weight: bold;
background: var(mox-layer-dark-2);
color: var(
mox-layer-light-1);
padding: 0.3rem 1.5rem;
transform: translateX(-2rem);
box-shadow: 4rem 0 0 var(—mox-layer-dark-3);
}

.footnotes-footer {
margin: 0;
padding: 0.5rem 1rem;
border-top: none;
height: auto;
background: var(mox-layer-light-1);
box-shadow: -0.4rem 0 0 var(
mox-layer-light-2);
}

.page-tags span {
padding-top: 2px;
border-top: solid 2px var(—mox-layer-light-2);
font-size: 80%;
}

.page-tags a {
margin: 0.2rem 0.4rem;
display: inline-block;
padding: 0.3rem 0.6rem;
}

.page-tags a::before {
content: "#";
font-family: 'Montserrat';
color: var(—mox-layer-light-3);
font-weight: 900;
}

#main-content .page-tags a:hover {
box-shadow: inset 0rem 0rem 0rem 1.1rem var(mox-theme-color);
color: var(
mox-bg-color);
padding: 0.3rem 0.6rem;
border-radius: 0rem 1rem;
scale: 1.3;
}

/* Ratebox */

.page-rate-widget-box {
margin: unset;
border-radius: 0;
border: none;
box-shadow: 3px 0px 0px 0px var(mox-theme-color);
background-color: var(
mox-layer-dark-2);
margin-top: 14px;
margin-bottom: 4px;
margin-right: 3px;
display: inline-block;
}

.page-rate-widget-box .rate-points {
background-color: var(mox-layer-dark-1);
border: none;
color: var(
mox-layer-light-1) !important;
text-transform: capitalize;
}

#page-content .creditRate {
margin-right: 0;
}

span.rateup.btn.btn-default {
font-size: 0;
}

div.page-rate-widget-box span.rateup a::before {
content: "\f164";
font-family: 'FontAwesome';
color: var(—mox-layer-light-1);
font-size: 1rem;
transition: all 0.2s;
}

span.rateup.btn.btn-default a:hover::before {
color: var(—mox-theme-color);
}

span.ratedown.btn.btn-default {
font-size: 0;
}

span.ratedown.btn.btn-default a:hover::before {
color: var(mox-theme-color);
}
div.page-rate-widget-box span.ratedown a::before {
content: "\f165";
font-family: 'FontAwesome';
color: var(
mox-layer-light-1);
font-size: 1rem;
transition: all 0.2s;
}

span.cancel.btn.btn-default a {
color: var(mox-layer-light-1) !important;
background: var(
mox-layer-dark-2);
}

span.cancel.btn.btn-default a:hover {
box-shadow: inset 1rem 0 0 var(mox-layer-light-1) !important;
color: var(
mox-theme-color) !important;
}

.rateBox .rate-box-with-credit-button {
background-color: var(mox-layer-light-1);
border: none;
border-radius: 0;
box-shadow: 0.2rem 0 0 var(
mox-theme-color);
}

.rateBox .rate-box-with-credit-button .creditButton p a {
width: 27px;
text-decoration: none;
border: none;
}

a.fa.fa-info:hover {
box-shadow: none !important;
color: var(—mox-theme-light-color);
}

#page-content div.modalbox {
background: var(mox-bg-color);
border: solid 2px var(
mox-layer-light-2);
border-radius: 0;
box-shadow: none;
padding: 4px;
max-height: 50vh;
pointer-events: auto !important;
}

/* Custom Divs */

.mox-modal, .modal {
position: relative;
background: var(mox-bg-color);
border: solid 2px var(
mox-layer-light-2);
width: 90%;
margin: 1rem auto;
padding: 0.5rem 0.7rem;
}

.mox-note, .notation {
position: relative;
background: var(mox-layer-light-1);
width: 90%;
margin: 1rem auto;
padding: 0.5rem 0.7rem;
border-left: solid 5px var(
mox-layer-light-3);
border-right: solid 5px var(—mox-layer-light-3);
}

.mox-notice, .jotting, .papernote {
position: relative;
background: var(mox-layer-light-1);
width: 80%;
margin: 1rem auto;
padding: 0.5rem 0.7rem;
border: dashed 0.1rem var(
mox-layer-light-2);
}

.mox-card, .document {
position: relative;
background: var(mox-bg-color);
border: none;
width: 90%;
margin: 1rem auto;
padding: 1.5rem 0.7rem 0.7rem 0.7rem;
box-shadow: 0rem 0rem 0.7rem 0rem var(
mox-layer-light-2), inset 0rem 0.5rem 0 var(mox-layer-dark-3), inset 0rem 1.3rem 0 var(mox-layer-light-1), 0.6rem 0.6rem 0 var(—mox-layer-light-1);
}

.mox-dark {
box-shadow: inset 0rem 0.5rem 0 var(mox-layer-dark-3), inset 0rem 1.3rem 0 var(mox-layer-dark-2), 0.6rem 0.6rem 0 var(mox-layer-light-1), 0rem 0rem 0.7rem 0rem var(mox-layer-light-2);
background: var(mox-layer-dark-1);
color: var(
mox-layer-light-1);
}

.mox-float {
max-width: 45%;
background: var(mox-bg-color);
padding: 0.5rem 0.7rem;
margin: 0.5rem 0.5rem 1.5rem 0.5rem;
border: solid 2px var(
mox-layer-light-2);
box-shadow: 1rem 0.6rem 0rem var(—mox-layer-light-2);
}

.mox-f-left {
float: left;
margin-right: 0;
}

.mox-f-right {
float: right;
margin-left: 0;
}

/* Tables */

tr {
background-color: var(—mox-bg-color);
}

table.wiki-content-table td {
border: solid 2px var(—mox-layer-light-2);
padding: 0.3em 0.7em;
}

table.wiki-content-table th {
border: solid 1px var(mox-layer-dark-2);
padding: 0.4rem 0.7rem;
background-color: var(
mox-layer-dark-2);
color: var(—mox-layer-light-1);
}

/* Tabs */

.yui-navset .yui-nav { border-color: var(—mox-layer-light-3); }

.yui-navset.yui-navset-top .yui-nav li {
flex-grow: 1;
}
.yui-navset.yui-navset-top .yui-nav li a {
border-width: 0;
}

.yui-navset .yui-content {
padding: 0.5rem 0.7rem;
border: solid 2px var(mox-layer-light-1);
background-color: var(
mox-bg-color);
box-shadow: none;
}

.yui-navset {
position: relative;
zoom: 1;
box-shadow: none;
}

.yui-navset .yui-nav li a em, .yui-navset-top .yui-nav li a em, .yui-navset-bottom .yui-nav li a em {
display: block;
border-top: none;
box-shadow: 0rem -0.1rem var(—mox-layer-light-2);
}

.yui-navset .yui-nav {
border-color: var(—mox-layer-dark-1);
display: flex;
}

.yui-navset.yui-navset-top .yui-nav li {
flex-grow: 1;
border: none;
box-shadow: none;
}

.yui-navset .yui-nav .selected, .yui-navset .yui-navset-top .yui-nav .selected {
margin: 0 0 -3px 0;
}

.yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
margin: 0 0 0 0;
padding: 1px 0 0;
zoom: 1;
}

div.yui-navset ul.yui-nav .selected a, div.yui-navset ul.yui-nav .selected a:focus, div.yui-navset ul.yui-nav .selected a:hover {
background: var(mox-layer-dark-2) !important;
color: var(
mox-layer-light-2) !important;
text-align: center;
font-weight: 600;
border: none;
box-shadow: none;
}

div.yui-navset ul.yui-nav a, div.yui-navset div.yui-navset-top ul.yui-nav a {
background: var(mox-layer-light-1);
color: var(
mox-layer-dark-1) !important;
width: 100%;
text-align: center;
font-weight: 400;
transition: all 0.35s;
border: none;
}

div.yui-navset ul.yui-nav a:hover, div.yui-navset ul.yui-nav a:focus {
background: var(mox-layer-light-1) !important;
color: var(
mox-layer-light-1) !important;
box-shadow: inset 20rem 0rem var(—mox-layer-dark-2) !important;
}

#page-title {
margin: 0 0 0.5em 0;
padding-top: 0.5rem;
font-size: 210%;
border-bottom: solid 2px var(mox-layer-light-2);
padding-bottom: 0.5rem;
font-weight: 600;
font-family: 'Montserrat','Noto Sans SC',sans-serif;
color: var(
mox-layer-dark-2);
}

.code {
border: solid 2px var(mox-layer-light-1);
background-color: #000000;
font-family: "Oxygen Mono","Consolas","Noto Sans SC",MONOSPACE;
padding: 0 1em;
margin: 0.4em 0;
overflow: auto;
border-radius: 1em 1em 1em 1em;
color: var(
lightGray);
background-image: linear-gradient(var(mox-layer-dark-1) 1.7em,var(mox-bg-color) 1.7em);
box-shadow: none;
}

.code,pre,.code * { font-family: "Oxygen Mono","Consolas","Noto Sans SC",MONOSPACE;}

.code::before {
content: '● ● ●';
background-image: linear-gradient(90deg, #FF0000 0%,#FF0000 33%,#FFFF00 33%,#00FF00 33%,#00FF00 68%,#FFFF00 68%);
color: transparent;
-webkit-background-clip: text;
background-clip: text;
transform: translateY(0px);
display: inline-block;
z-index: 0;
position: relative;
font-family: 'Noto Sans SC';
}

#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
background: var(—mox-layer-dark-2);
transition: background 0.25s linear;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
padding-left: 1rem;
padding-right: 1rem;
width: min-content;
white-space: nowrap;
overflow: hidden;
margin: auto;
}

a.collapsible-block-link:hover {
box-shadow: none !important;
}

#page-content .collapsible-block-folded .collapsible-block-link::before {
content: "\f103";
font-family: 'FontAwesome';
display: inline-block;
width: 1rem;
transition: all 0.3s;
}

#page-content .collapsible-block-folded .collapsible-block-link:hover::before, #page-content .collapsible-block-unfolded .collapsible-block-link:hover::before {
transform: rotateX(-180deg);
}

#page-content .collapsible-block-unfolded .collapsible-block-link::before {
content: "\f102";
font-family: 'FontAwesome';
display: inline-block;
width: 1rem;
transition: all 0.3s;
}

#page-content .collapsible-block-link {
text-decoration: none;
color: var(—mox-layer-light-1);
font-weight: bold;
}

#page-content .collapsible-block-folded:hover, #page-content .collapsible-block-unfolded-link:hover {
background: var(—mox-theme-color);
box-shadow: none;
}

#page-content .collapsible-block-unfolded-link {
box-shadow: none;
}

#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
margin-top: 10px;
margin-bottom: 10px;
}

/* Others */

.font-montserrat {font-family:'Montserrat'}

.owindow.owait .content {
margin: 10px;
padding: 0 50px 40px 50px;
background-repeat: no-repeat;
background-position: bottom center;
background-image: url(https://ts1.cn.mm.bing.net/th/id/R-C.b3221b8…?rik=ZCqpg1hJpgD3sw&riu=http%3a%2f%2fwww.yilewan.com%2fresource%2fetpResource%2fimages%2floading.gif&ehk=8SSR9kfkOSDuMCmwSXdkARULQTCCBAfqtvnDIdciFyU%3d&risl=&pid=ImgRaw&r=0);
background-size: 2rem;
}

.page-options-bottom {
margin: 0.3rem 0;
text-align: center;
height: 1%;
line-height: 2rem;
display: grid;
grid-template-columns: repeat(4,1fr);
background: var(mox-bg-color);
padding: 0.5rem 0.1rem;
border: solid 2px var(
mox-layer-light-1);
}

a#more-options-button, a#site-tools-button {
grid-column: span 4 / auto;
}

a#print-button, a#rename-move-button, a#delete-button {
grid-column: span 2 / auto;
}

.page-options-bottom a {
margin: 0px 0px;
font-size: 100%;
padding: 0;
border-bottom: solid 2px var(mox-layer-light-2);
background: var(
mox-layer-light-1);
}

.page-options-bottom a:hover {
background-color: transparent;
text-decoration: none;
box-shadow: inset 0px 2rem 0px 0px var(mox-theme-color) !important;
color: var(
mox-bg-color) !important;
font-weight: bold;
}

#footer a {
color: var(—mox-theme-dark-color);
text-decoration: none;
transition: all 0.2s;
}

#footer a:hover {
color: var(—mox-theme-color);
text-decoration: none;
background: none;
}

#license-area {
color: var(mox-layer-dark-3);
text-align: center;
background: var(
mox-bg-color);
border-top: solid 5px var(—mox-layer-light-1);
}

#license-area a {
color: var(—mox-layer-dark-3);
}

#license-area a:hover {
background: transparent;
color: var(—mox-theme-color);
}

/* Mobile */

@media(max-width:767px) {

#header h1 a span::before,#header h1 a span::after,#header h2 span::before,#search-top-box,#login-status {display:none;}

#header {
grid-template-areas: 'topbar menu';
justify-items: center;
}

div.open-menu {display:none;}

#top-bar ul {
grid-area: topbar;
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap;
justify-content: space-around;
}

#top-bar li a {
padding: 1px 0.4em;
text-decoration: none;
}

}

/* Action Area */

#action-area {
width: 96%;
background: var(mox-layer-light-1);
border: solid 3px var(
mox-layer-light-2);
padding: 1em;
margin: 0 auto;
color: var(—mox-text-color);
}

#action-area h1 {
color: var(—mox-theme-color);
}

input.text {
border: solid 2px var(mox-theme-color);
margin: 0 1px;
padding: 0.2rem;
background-color: var(
mox-layer-light-1);
color: var(—mox-layer-dark-1);
text-align: center;
width: 95%;
}

table.form {
margin: 0 auto !important;
padding: 0;
}

table.form td, table.form th {
vertical-align: top;
padding: 0;
font-size: 1.2rem;
}

.wd-editor-toolbar-panel {
align-items: center;
}

.wd-editor-toolbar-panel div {
height: 40px;
display: flex;
}

.wd-editor-toolbar-panel ul li a {
height: 22px;
width: 22px;
padding: 0px;
margin: 0em 0.2em 0em 0.2em;
display: block;
transition: box-shadow 0.2s , filter 0.3s;
}

.wd-editor-toolbar-panel li.hseparator {
width: 2px;
height: 33px;
margin: 0 5px;
background-color: #efefef;
}

.wd-editor-toolbar-panel {
align-items: center;
background: var(mox-layer-light-2);
border: solid 3px var(
mox-layer-light-3);
margin: 0;
position: relative;
width: 96%;
margin-top: 1em;
}

#edit-page-comments {
width: 100%;
height: 4rem;
}

.wd-editor-toolbar-panel a {
background-image: url(http://paraarc-sandbox.wikidot.com/local--files/files/eidicons1.svg);
background-size: 969px;
zoom: 1.4;
}

.wd-editor-toolbar-panel a:hover {
background-image: url(http://paraarc-sandbox.wikidot.com/local--files/files/eidicons1.svg);
filter: brightness(1) contrast(1.5) invert(1);
box-shadow: 2px 2px 0px rgb(0 0 0 / 50%);
}

.wd-editor-toolbar-panel ul {
padding: 0;
margin: 0 auto;
float: left;
list-style: none;
}

@media (max-width: 768px) {
.wd-editor-toolbar-panel li.hseparator {
width: 2px;
height: 23px;
margin: 5px 3px;
background-color: #efefef;
}
.wd-editor-toolbar-panel ul li {
padding: 0;
margin: 0px;
float: left;
}
.wd-editor-toolbar-panel ul {
padding: 0;
margin: 0 auto;
float: left;
list-style: none;
}
.wd-editor-toolbar-panel div {
height: 30px;
}
.wd-editor-toolbar-panel a {
zoom:1;
}
.wd-editor-toolbar-panel div {
display: block !important;
}
.owindow {
background-color: white;
width: 90%;
border: 2px solid #BBB;
text-align: left;
position: relative;
margin: 0 auto;
}
}

textarea {
padding: 10px;
font-size: 105%;
border: solid 2px var(mox-theme-color);
background-color: var(
mox-layer-light-2);
color: var(—mox-layer-dark-2);
}

#new-post-div textarea#np-text {width:93%}

div#new-post-form-container {
background-color: var(mox-layer-light-1);
border: solid 5px var(
mox-layer-light-2);
padding: 1em;
}

change-textarea-size a {
color: var(mox-theme-color);
background-color: #000;
border: solid 2px var(
mox-theme-color);
padding: 4px 4px;
font-size: 1.3em;
text-decoration: none;
top: 0.4em;
position: relative;
}

#lock-info {
background-color: var(mox-layer-light-1);
border-color: #ededed;
border: solid 2px var(
mox-theme-color);
display: inline-block;
position: relative;
right: -5em;
margin: 0.8rem 0;
padding: 0.4rem 0.8rem;
margin-left: 2rem;
height: 5.4rem;
}

div#lock-info > strong {
font-size: 0.82rem;
color: var(—mox-theme-color);
font-family: "Oxygen Mono","Consolas","Noto Sans SC",MONOSPACE;
}

#edit-save-button {
color: var(mox-accept-color);
border: solid 2px var(
mox-accept-color);
transition: color 0.15s linear;
}

#edit-save-button:hover {
color: var(mox-layer-dark-1);
background-color: var(
mox-accept-color);
}

#edit-cancel-button {
color: var(mox-warn-color);
border: solid 2px var(
mox-warn-color);
transition: color 0.15s linear;
}

#edit-cancel-button:hover {
color: var(mox-layer-dark-1);
background-color: var(
mox-warn-color);
}

.buttons .btn {
width: 7em;
display: inline;
}

div.buttons.alignleft {
text-align: center;
}

div.buttons input, input.button, button, file, a.button {
margin: 0 2px;
padding: 0.5em 0.5em;
text-decoration: none;
background-color: var(mox-layer-light-1);
border: solid 2px #444;
color: var(
mox-layer-dark-1);
cursor: pointer;
font-weight: 900;
font-size: 110%;
transition: all 0.25s;
}

/* sec */

::-webkit-scrollbar {
width: 0.3rem;
background: transparent;
}

::-webkit-scrollbar-thumb {
background: var(—mox-theme-color)
}

/* SCP Sigma-9 Things */

.scp-image-block {
border: solid 2px var(mox-layer-light-2);
box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
width: 300px;
}
.scp-image-block.block-right {
float: right;
clear: right;
margin: 0 2em 1em 2em;
}
.scp-image-block.block-left {
float: left;
clear: left;
margin: 0 2em 1em 0;
}
.scp-image-block.block-center {
margin-right: auto;
margin-left: auto;
}
.scp-image-block img {
border: 0;
width: 300px;
}
.scp-image-block .scp-image-caption {
background-color: var(
mox-layer-dark-2);
border-top: solid 2px var(mox-layer-dark-3);
padding: 0.3rem 0;
font-size: 90%;
font-weight: bold;
text-align: center;
width: 300px;
color: var(
mox-layer-light-1);
}
.scp-image-block > p {
margin: 0;
}
.scp-image-block .scp-image-caption > p {
margin: 0;
padding: 0 10px;
}

.ruby, ruby {
display: inline-table;
text-align: center;
white-space: nowrap;
line-height: 1;
height: 1em;
vertical-align: text-bottom;
}
.rt, rt {
display: table-header-group;
font-size: 0.6em;
line-height: 1.1;
text-align: center;
white-space: nowrap;
}

.keycap {
border: 1px solid;
border-color: #ddd #bbb #bbb #ddd;
border-bottom-width: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background-color: #f9f9f9;
padding: 1px 3px;
font-family: inherit;
font-size: 0.85em;
white-space: nowrap;
}

.menu-item img {
display: none;
}

/* NO BIG AVATARS */

a.avatar-hover, a.avatar-hover:hover {
display: none !important;
}

/* Posts */

div.info .odate {
font-size: 0.5rem;
font-family: 'Oxygen Mono';
}
.thread-container .post .head {
padding: 0.5rem 0.8rem;
background-color: var(mox-layer-light-1);
border: solid 2px var(
mox-layer-light-2);
}

.thread-container .post .long .content {
padding: 0.2rem 0.9rem;
}

.thread-container .post .signature {
display: none;
}

.thread-container .post .long .head .title {
font-weight: bold;
font-size: 1.1rem;
}

.thread-container .post.folded .short {
display: block;
background: var(mox-layer-light-1);
border: solid 2px var(
mox-layer-light-2);
}

.thread-container .post .options a, .short .options a.btn, a.btn[onclick*="togglePostFold"], a#new-post-button, div#comments-options-shown a {
color: var(mox-layer-dark-2) !important;
background: var(
mox-layer-light-1);
padding: 0.2rem 0.8rem;
border: solid 2px var(—mox-layer-light-2);
margin: 0.2rem 0.3rem;
display: inline-block;
}

#main-content .thread-container .post .options a:hover, #main-content .short .options a.btn:hover, a.btn[onclick*="togglePostFold"]:hover, a#new-post-button:hover, div#comments-options-shown a:hover {
text-decoration: none;
box-shadow: inset 8rem 0rem var(mox-theme-light-color) !important;
color: var(
mox-layer-light-1) !important;
scale: 1.2;
}

a.btn[onclick*="postReply"]::before {
content: "\f086";
font-family: 'FontAwesome';
display: inline-block;
margin-right: 0.2rem;
}

a.btn[onclick*="togglePostOptions"]::before {
content: "\f013";
font-family: 'FontAwesome';
display: inline-block;
margin-right: 0.2rem;
}

a.btn[onclick*="togglePostFold"]::before {
content: "\f103";
font-family: 'FontAwesome';
display: inline-block;
margin-right: 0.2rem;
}

a#new-post-button::before {
content: "\f067";
font-family: 'FontAwesome';
display: inline-block;
margin-right: 0.2rem;
}

div.head div.options a {
margin: 0 !important;
display: inline-block;
}

.thread-container .post .short .options {
padding: 0.2rem;
}

div.short a.title {
color: var(—mox-text-color) !important;
}

除非特别注明,本页内容采用以下授权方式: Creative Commons Attribution-ShareAlike 3.0 License