@import url("https://cdn.scpwiki.com/theme/en/sigma/css/sigma.min.css");
@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Black+Ops+One&display=swap');
/* --------- */
/* ADR Custom Theme - DARK MODE */
/* Built on Sigma-10 */
/* Secondary Color: Teal */
/* --------- */
#header h1 a {
margin-left: 10px;
}
#header h2 {
margin-top: 5px;
}
/*
Powered on 2023/07/27 03:02:19
[2023 Wikidot Theme]
Created by Zenion
CC BY-SA 3.0
Modified for Dark Theme with Teal
*/
:root {
—teal-primary: #008080;
—teal-secondary: #006666;
—teal-accent: #00a3a3;
—teal-light: #00cccc;
—dark-bg: #121212;
—darker-bg: #0a0a0a;
—card-bg: #1e1e1e;
—text-primary: #e0e0e0;
—text-secondary: #b0b0b0;
}
#login-status {
color: var(—teal-light);
font-size: 0.9em;
z-index: 30;
}
#login-status a {
background: transparent;
color: var(—teal-light);
}
#login-status ul a {
color: #4cd964;
background: transparent;
background-color: var(—card-bg);
}
#login-status ul a:hover {
color: #7ae682;
font-weight: bold;
}
#search-top-box-form input[type='submit'] {
border: solid 1px var(teal-primary);
border-radius: 5px;
padding: 2px 5px;
font-size: 0.9em;
font-weight: bold;
color: var(teal-light);
background-color: var(teal-secondary);
background-image: linear-gradient(to bottom, #004d4d, var(teal-secondary), #008a8a);
box-shadow: 0 0px 5px rgba(0, 0, 0, 0.8);
text-shadow: 0px 0px 10px #000;
cursor: pointer;
}
#search-top-box-form input[type='submit']:hover,
#search-top-box-form input[type='submit']:focus {
border: solid 1px var(teal-light);
color: #ffffff;
text-shadow: 0 0 10px #ffffff;
background-color: var(teal-accent);
background-image: linear-gradient(to bottom, var(teal-light), var(teal-accent), var(teal-primary));
box-shadow: 0 0px 8px var(teal-light);
}
div#page-title {
color: var(—teal-light);
}
body {
background: var(dark-bg);
color: var(text-primary);
}
a {
color: var(—teal-primary);
}
a:visited,
a:focus {
color: var(—teal-accent);
}
a:hover {
color: var(—teal-light);
text-decoration: underline;
}
h1, h2, h3, h4, h5, h6 {
color: var(—teal-primary);
}
div#container-wrap {
background: var(darker-bg) url(/localfiles/css:adr-1/header) top left repeat-x;
}
div#header {
background: url(/local—files/css:adr-1/logo3) 10px 40px no-repeat;
overflow: visible !important;
text-align: center; /* Center header content */
}
@keyframes move-logo {
0% { background-position: 436px 10px; }
25% { background-position: 441px 12px; }
50% { background-position: 436px 15px; }
75% { background-position: 431px 12px; }
100% { background-position: 436px 10px; }
}
div#header {
background-repeat: no-repeat;
animation: move-logo 10s ease-in-out infinite;
}
div#header h1 a span {
font-size: 0px;
}
div#header h1 a:before {
content: "Internship";
text-shadow: 0px 5px 5px #000;
font-family: 'Righteous', cursive;
color: var(—teal-light);
text-align: center;
display: block;
}
@keyframes pulse-h1 {
0%, 100% {
transform: scale(1);
text-shadow: 0 5px 5px #000, 0 0 5px var(teal-light);
}
50% {
transform: scale(1.1);
text-shadow: 0 8px 10px #000, 0 0 20px var(teal-light);
}
}
div#header h1 a:before {
animation: pulse-h1 3s ease-in-out infinite;
}
div#header h2 span {
font-size: 0px;
padding: 4px;
}
div#header h2:after {
content: "Is Humanity Truly Safe When Ignorant?";
font-family: 'Black Ops One', cursive;
font-weight: bold;
color: #949494;
padding: 19px 0;
text-shadow: 0px 0px 5px #000000;
white-space: pre;
display: block;
}
/* Center H1 and H2 elements */
div#header h1, div#header h2 {
text-align: center;
float: none;
width: 100%;
margin-left: 0;
}
div#side-bar div.side-block {
border: 1px solid var(teal-primary);
box-shadow: 0 2px 6px var(teal-primary);
border-radius: 10px;
background: var(—card-bg);
}
div#side-bar div.side-block {
background: #151515; /* Darker sidebar background */
border: 1px solid var(—teal-primary);
box-shadow: 0 0 8px rgba(0, 128, 128, 0.4);
}
/* Darken sidebar elements */
div#side-bar {
background-color: #0f0f0f; /* Darker sidebar background */
}
div.yui-navset ul.yui-nav a:hover,
div.yui-navset ul.yui-nav a:focus {
background: #004d4d;
}
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(—teal-primary);
color: white;
}
div#side-bar .menu-item a {
color: var(—teal-primary);
}
div#side-bar .heading {
color: var(—teal-light);
font-size: 0.90em;
font-family: 'Franklin Gothic Medium', franklin-gothic-medium;
}
div#top-bar ul li.sfhover a,
div#top-bar ul li:hover a {
background: var(—teal-secondary);
color: #4cd964;
transition: color 0.4s, width 0.4s;
}
div#top-bar ul li:hover a:hover {
background: var(—teal-primary);
transition: background 0.4s, color 0.4s, width 0.4s;
}
div#top-bar {
text-align: center;
float: none;
background: #0a0a0a; /* Darker top bar */
}
div#top-bar li {
text-align: left;
}
div#top-bar ul {
display: inline-block;
float: none;
-webkit-overflow-scrolling: touch;
}
@media (min-width: 768px) {
.close-menu {
display: none !important;
}
div#side-bar {
clear: none;
float: left;
position: sticky;
}
div#main-content {
margin: 0 auto 0 auto;
position: relative;
width: 808px;
}
div#header {
background-position: center 10px; /* Centered logo */
}
div#header h1 {
margin: -42px auto 0 auto;
padding: 0;
float: none;
max-height: 95px;
text-align: center;
}
div#header h2 {
margin: 20px auto 0 auto;
padding: 0;
clear: both;
float: none;
font-size: 1.05em;
max-height: 38px;
text-align: center;
}
}
div#main-content {
margin: 0 auto 0 auto;
position: relative;
background: var(dark-bg);
color: var(text-primary);
}
a.newpage {
color: #ffd700;
text-decoration: none;
background: transparent;
}
#footer {
text-align: center;
font-family: 'Righteous', cursive;
font-size: 0.85em;
color: var(teal-primary);
background: linear-gradient(to right, #151515, #1a1a1a); /* Darker footer */
border-top: 2px solid var(teal-primary);
padding: 10px 0;
box-shadow: inset 0 2px 5px rgba(0,0,0,0.3);
}
div#content-wrap {
max-width: 100%;
background: var(—dark-bg);
}
/* Page content styling */
.wiki-content-page {
background: var(card-bg);
color: var(text-primary);
}
.wiki-content-page a {
color: var(—teal-primary);
}
.wiki-content-page a:hover {
color: var(—teal-light);
}
@media (max-width: 767px) {
body, html,
div#container-wrap,
div#header,
div#content-wrap,
div#main-content,
div#page-title {
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
box-sizing: border-box !important;
float: none !important;
}
div#container-wrap {
margin-top: -20px !important;
padding-top: 20px !important;
background-size: auto 220px !important;
background-repeat: repeat-x !important;
background-position: center top !important;
}
div#header {
background-position: center top !important;
height: auto !important;
padding-bottom: 20px;
}
div#header h1, div#header h2 {
margin: 10px 0 !important;
float: none !important;
text-align: center !important;
width: 100% !important;
}
div#main-content {
padding: 10px !important;
width: 95% !important;
margin: 0 auto !important;
}
#search-top-box {
display: none !important;
}
html, body {
margin: 0 !important;
padding: 0 !important;
width: 100vw !important;
overflow-x: hidden !important;
background-color: var(—dark-bg) !important;
}
}
/* BURGER MENU */
.open-menu {
display: none;
}
@media (max-width: 767px) {
.open-menu {
display: block !important;
}
#top-bar .open-menu a {
position: fixed !important;
display: block !important;
top: 15px !important;
left: 15px !important;
z-index: 9999 !important;
background: var(teal-secondary) !important;
border: 2px solid var(teal-primary) !important;
color: white !important;
width: 45px !important;
height: 45px !important;
line-height: 40px !important;
text-align: center !important;
font-size: 28px !important;
border-radius: 50% !important;
margin: 0 !important;
padding: 0 !important;
transition: all 0.1s ease !important;
box-shadow: 0 3px 6px rgba(0,0,0,0.4) !important;
}
#top-bar .open-menu a:active {
background: var(teal-primary) !important;
border-color: var(teal-light) !important;
color: white !important;
transform: scale(0.90) !important;
}
div#side-bar {
background-color: #0f0f0f !important; /* Darker mobile sidebar */
box-shadow: 2px 0 10px rgba(0,0,0,0.8) !important;
z-index: 1000 !important;
border-right: 2px solid var(—teal-primary);
}
#side-bar:target {
left: 0 !important;
}
div#side-bar::before {
content: " " !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100vw !important;
height: 100vh !important;
background-color: rgba(0,0,0,0.8) !important;
backdrop-filter: blur(3px) !important;
z-index: -1 !important;
opacity: 0 !important;
transition: opacity 0.5s ease-in-out !important;
pointer-events: none !important;
}
div#side-bar:target::before {
opacity: 1 !important;
pointer-events: auto !important;
}
#side-bar:target .close-menu {
display: block !important;
position: relative !important;
width: 100% !important;
height: auto !important;
background: transparent !important;
z-index: 100 !important;
margin-bottom: 15px;
pointer-events: auto !important;
}
.close-menu {
display: block !important;
position: relative !important;
width: 100% !important;
margin-bottom: 15px;
z-index: 10;
opacity: 1 !important;
pointer-events: auto !important;
}
.close-menu a {
display: block;
background: var(teal-primary);
color: white !important;
font-weight: bold;
text-align: center;
padding: 10px;
border-radius: 8px;
text-decoration: none;
border: 2px solid var(teal-secondary);
}
.close-menu a:hover {
background: var(—teal-accent);
text-decoration: none;
}
/* SCUFFED TOP BAR */
#top-bar {
display: block !important;
position: static !important;
height: auto !important;
width: 100% !important;
background: #0a0a0a !important; /* Darker mobile top bar */
border-top: 2px solid var(teal-primary);
border-bottom: 2px solid var(teal-primary);
padding-top: 2px !important;
padding-bottom: 5px !important;
padding-left: 0 !important;
padding-right: 0 !important;
margin-top: 10px !important;
min-height: 0 !important;
overflow: visible !important;
line-height: 0 !important;
}
#top-bar ul {
display: flex !important;
flex-wrap: wrap !important;
justify-content: center !important;
float: none !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
#top-bar li {
float: none !important;
display: inline-block !important;
width: auto !important;
margin: 2px !important;
position: relative !important;
}
#top-bar li a {
display: block !important;
padding: 8px 12px !important;
background: rgba(0, 128, 128, 0.2) !important;
border-radius: 5px !important;
font-size: 12px !important;
white-space: nowrap !important;
line-height: 1.2 !important;
color: var(—teal-light) !important;
}
#top-bar ul li ul {
position: absolute !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 160px !important;
z-index: 200 !important;
background: #151515 !important; /* Darker dropdown */
box-shadow: 0 4px 8px rgba(0,0,0,0.7);
line-height: normal !important;
border: 1px solid var(—teal-primary);
}
#top-bar ul li ul li {
width: 100% !important;
text-align: center !important;
margin: 0 !important;
}
}
