Link to article: Cleanliness Guaranteed*.
/*cleanliness-guaranteed-hub*/
@import url("https://nu-scptheme.github.io/Black-Highlighter/stable/styles/normalize.min.css");
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Oswald:wght@200..700&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
.ad-container {
position: absolute;
top: 50px;
display: flex;
flex-direction: column;
gap: 15px;
z-index: -1;
}
.ad-container.left { left: 10px; }
.ad-container.right { right: 10px; }
.ad {
width: calc(50vw - 525px);
padding: 20px;
}
ul {
padding-inline-start: 20px;
}
.close-menu {
display: none;
}
.page-rate-widget-box {
color: white;
background-color: black;
display: inline-block;
}
div.buttons input {
border: 1px solid black;
background-color: #eeeeee;
margin: 3px;
padding: 3px;
}
table.wiki-content-table table,
table.wiki-content-table th,
table.wiki-content-table td {
border: 1px solid #555;
}
table.wiki-content-table th,
table.wiki-content-table td {
padding: 3px;
}
#side-bar .side-block {
width: 100%;
}
.side-block.media:nth-child(1) {
display: flex;
justify-content: center;
}
#header {
background-image: url("https://scp-sandbox-3.wdfiles.com/local--files/theme%3Acleaning-services/logo.png");
background-size: contain;
background-repeat: no-repeat;
background-position-x: 100%;
padding: 5px;
background-color: #eeeedd;
border-bottom: 3px solid black;
}
#top-bar :is(.top-bar, .mobile-top-bar) > ul {
position: relative;
flex-wrap: wrap;
> li > ul {
display: none;
position: absolute;
}
> li:hover > ul {
display: flex;
flex-direction: column;
background-color: white;
border: 1px solid black;
z-index: 2;
> li {
border: none;
position: static;
}
}
}
#main-content {
margin: 5px;
}
#footer {
margin: 5px;
}
#header h1::before {
content: "SAFE CLEANUP PROFESSIONALS";
color: #7c0a02;;
font-family: "Oswald", sans-serif;
font-weight: bold;
}
#header h2::before {
content: "Sanitize, Cleanse, Polish™";
color: #3d7b58;
font-family: "Oswald", sans-serif;
font-weight: bold;
}
#header h1 {
color: #00000000;
font-size: min(48px, 5vw);
height: 1lh;
}
#header h2 {
color: #00000000;
font-size: 24px;
height: 1lh;
}
html, body {
margin: 0;
min-height: 100%;
font-family: Arial, sans-serif;
}
body {
background: repeating-linear-gradient(
45deg,
black 0,
black 25px,
#333300 25px,
#333300 50px
);
}
#skrollr-body {
width: min(900px, 90%);
border: 1px solid black;
background-color: #cccccc;
margin: auto;
margin-top: 50px;
margin-bottom: 150px;
z-index: 100;
box-shadow: 0 0 0 9999px rgba(0,0,0,0.3);
}
#content-wrap {
display: flex;
}
#side-bar {
max-height: 100vh;
flex-direction: column;
display: flex;
border: 1px solid black;
position: fixed;
z-index: 10;
width: 30%;
background-color: #bbbbbb;
top: 0;
left: -26%;
transition: left 0.25s;
max-height: 100vh;
overflow: auto;
.heading {
border-bottom: none;
border-top: 1px solid black;
}
}
#side-bar:hover {
left: 0;
overflow: auto;
}
a,
#top-bar a {
color: #873e23;
}
:root #top-bar a {
border: none;
}
a:visited {
color: #875823;
}
hr {
display: block;
border: 0;
border-top: 1px solid black;
margin: 1.5em 50px;
height: 0;
}
#search-top-box {
margin-bottom: 5px;
}
#search-top-box-form {
display: flex;
font-size: 18px;
}
#search-top-box-form input {
background-color: white;
border: 1px solid black;
margin-right: 10px;
}
#top-bar {
font-size: 18px;
}
#top-bar .top-bar ul {
display: flex;
list-style: none;
}
#top-bar .top-bar ul li {
padding-right: 5px;
margin-left: 5px;
border-right: 1px solid black;
}
#top-bar .top-bar ul li:nth-child(1) {
margin-left: 0;
}
#top-bar .mobile-top-bar > ul {
display: none;
}
#login-status {
display: flex;
}
#account-options {
display: block !important;
}
#account-topbutton {
display: none;
}
#account-options ul {
display: flex;
flex-wrap: wrap;
}
#account-options ul li {
padding-right: 5px;
margin-left: 5px;
border-right: 1px solid black;
}
#my-account {
white-space: nowrap;
}
.columns {
display: flex;
justify-content: stretch;
}
.columns > div {
border: 1px solid black;
padding: 5px;
}
.hovertip {
width: 20%;
background-color: white;
}
.gay {
position: relative;
z-index: 1;
animation-name: rainbow;
animation-duration: 15s;
animation-iteration-count: infinite;
transform: rotate(4deg);
}
@keyframes rainbow {
0% {
color: red;
}
13% {
color: orange;
}
25% {
color: yellow;
}
38% {
color: lime;
}
50% {
color: cyan;
}
63% {
color: royalblue;
}
75% {
color: darkviolet;
}
83% {
color: magenta;
}
100% {
color: red;
}
}
#wd-editor-toolbar-panel ul {
display: flex;
flex-wrap: wrap;
list-style: none;
}
#wd-editor-toolbar-panel li {
margin: 3px 10px;
}
.owindow {
background-color: white;
}
.yui-nav {
border-bottom: 1px solid black;
}
:root .yui-nav li {
background-color: #dddddd;
padding: 5px;
border: 1px solid black;
}
.yui-nav li.selected {
background-color: black;
color: white;
}
.yui-navset li,
:root .yui-navset a,
:root .yui-navset em {
border: none;
}
:root .yui-navset li {
border-left: 1px solid black;
}
.yui-navset li:nth-child(1) {
border: none;
}
:root .yui-nav {
border: none;
}
:root .yui-content {
border: 1px solid black;
padding: 5px;
background-color: #eaeaea;
}
#page-title {
display: none;
}
#edit-page-textarea {
background-color: white;
}
.open-menu {
top: 0;
left: 0;
width: 80px;
height: 50px;
position: fixed;
display: block;
z-index: 3;
* {
margin: 0;
padding: 0;
display: block;
width: 100%;
height: 100%;
}
}
:root:root #side-bar .close-menu {
z-index: -1;
position: absolute;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: #00000022;
}
:root:root #side-bar {
transform-origin: top left;
transform: scale(0.25, 0.07);
transition: transform 0.5s, width 1s;
transition-timing-function: linear;
left: 0;
pointer-events: none;
width: min(50%, 400px);
}
:root:root #side-bar:target {
transform: scale(1);
pointer-events: all;
width: min(50.01%, 400px);
a {
pointer-events: all;
}
.close-menu { display: none; }
}
@keyframes ad-show-hide {
0% { transform: scaleY(0); height: 0; }
1%, 13.285% {
height: 100%;
transform: scaleY(1);
}
14.285%, 100% {
height: 0;
transform: scaleY(0);
}
}
:root {
--ad-anim-duration: 120s;
--ad-anim-count: 7;
}
/* move sidebar to top */
@media screen and (max-width: 1280px) {
:root .ad {
width: calc(100% - 50px);
margin: 0 auto;
animation: ad-show-hide var(--ad-anim-duration) infinite;
animation-delay: calc(var(--ad-index) * var(--ad-anim-duration) / var(--ad-anim-count));
animation-fill-mode: both;
position: absolute;
min-height: 250px !important;
display: flex;
flex-direction: column;
justify-content: center;
top: 0;
left: 0;
}
.ad-container.left > div:nth-child(1) {
--ad-index: 0;
font-size: 150%;
}
.ad-container.left > div:nth-child(2) {
--ad-index: 1;
font-size: 110%;
}
.ad-container.left > div:nth-child(3) {
--ad-index: 2;
font-size: 110%;
}
.ad-container.left > div:nth-child(4) {
--ad-index: 3;
font-size: 110%;
}
.ad-container.right > div:nth-child(1) {
--ad-index: 4;
}
.ad-container.right > div:nth-child(2) {
--ad-index: 5;
}
.ad-container.right > div:nth-child(3) {
--ad-index: 6;
}
}
/* Hide ads on small screens */
@media (max-width: 1280px) {
:root .ad-container {
position: relative;
z-index: 2;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.ad-container.right {
height: 250px;
margin-bottom: 50px;
}
}
/* Mobile devices */
@media screen and (max-width: 768px) {
.ad {
font-size: 75%;
}
#header {
padding-left: 20px;
> * {
padding-left: 0;
}
}
.menu-item {
display: inline-block;
margin-right: 20px;
}
:root:root #top-bar .mobile-top-bar {
display: block;
> ul {
display: none;
}
}
#content-wrap {
flex-direction: column;
}
.columns {
flex-direction: column;
align-items: stretch;
}
#header h1 {
font-size: min(24px, 5vw);
}
#header h2 {
font-size: min(18px, 7vw);
}
#search-top-box-form input {
margin-right: 0;
margin-bottom: 10px;
}
.columns > div {
width: 100%;
margin-bottom: 10px;
}
.hovertip {
width: 100%;
}
#skrollr-body {
width: 100%;
margin-top: 150px;
margin-bottom: 20px;
}
.gay {
font-size: 14px;
}
}
.page-source {
padding: 10px;
border: 1px solid black;
font-family: monospace;
}
#page-options-bottom-2 {
margin-bottom: 20px;
}
#edit-page-comments {
background-color: white;
}
#page-content {
margin-bottom: 30px;
}
.fanart-tab img {
max-width: 100%;
}
.profile {
border-radius: 5px;
width: 150px;
}
.page-rate-widget-box > * {
padding-right: 4px;
}
.close-sidebar {
display: none;
}
:root:has(#side-bar:target) .close-sidebar {
display: block;
background-color: #0005;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
}
font-size: 24px
font-size: 48px; width: 100%; text-align: center; filter: drop-shadow(3px 3px 0 black);
font-size: 10px
background-color: #f9f4ec; border: 3px solid #7a4434;
background-color: #111111; color: white; font-family: Times New Roman; box-shadow: 0 0 5px white;
color: #FF3333; font-size: 125%; font-family: Helvetica;
background-color: #fff5f9; font-family: Trebuchet MS;
color: #e00661; font-size: 200%; font-family: Brush Script MT, serif;
background: radial-gradient(circle, black, #494949); color: white; font-family: Georgia; border: 1px solid white;
font-size: 125%; font-weight: bold; font-family: 'Comic Sans MS';
background-color: #19213d; color: white; font-family:
background-color: black; color: limegreen; font-family: Verdana; border: 2px solid white;
color: lime;
background-color: #dee0f4;
font-size: 200%; font-family: Impact; color: #1861ba;
font-weight: bold; color: #2018ba;
font-size: 200%; font-family: Impact; color: #1861ba;
float: right; width: 25%; align: margin-right: 100px; transform: rotate(3deg); box-shadow: 2px 2px 5px black; aspect-ratio: 3 / 2; object-fit: cover; object-position: center;
border: 1px solid black; font-family: monospace;
margin: auto; text-align: center;
font-size: 150%; font-weight: bold;
close-sidebar
gay
ad-container
left
ad
ad
ad
ad
ad-container
right
ad
ad
ad
fanart-tab