Link to article: Pursuing Ghosts, Part I.
@import url(https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Orbitron:wght@600&display=swap);
/* ---- COMMON ---- */
:root {
--part: "Permanent Marker", cursive;
--alarm: "Orbitron", sans-serif;
}
/* ---- ALL CHAPTERS ---- */
.lite-heading.extra-wide {
position: relative;
left: calc(-33vw + 50%);
width: 66vw;
max-width: 66vw;
background:
linear-gradient(
to right,
transparent,
var(--fgColor) 10% 90%,
transparent);
}
@media (max-width: 767px) {
.lite-heading.extra-wide {
left: unset;
width: unset;
max-width: unset;
}
}
.lite-heading.extra-wide hr {
height: .3rem;
background:
linear-gradient(
to right,
transparent,
var(--accentColor) 10% 90%,
transparent);
border: 0;
}
.lite-heading.extra-wide h1 {
font-size: 2.95rem;
letter-spacing: .4rem
}
.lite-heading.extra-wide h3 {
margin-bottom: .7em;
font-size: 1.95rem;
letter-spacing: .2rem
}
h2, h4 {
color: var(--textColorAlt);
filter: none;
}
.scene-break {
width: 4rem;
margin: 1rem;
}
.scene-break.break-hydra {
filter: invert(77%) sepia(24%) saturate(1063%) hue-rotate(78deg) brightness(87%) contrast(88%);
}
/* ---- CHAPTER-SPECIFIC ---- */
.i {
color: hsl(196, 94%, 67%);
font: 2.05rem var(--part);
letter-spacing: 2px;
}
.alarm-clock {
animation: 1s flash cubic-bezier(1,0,0,1) infinite alternate;
color: var(--bright-red);
font: 4.95rem var(--alarm);
}
@keyframes flash {
0%, 100% {
color: var(--bright-red);
}
50% {
color: transparent;
}
}
.baetyl {
--fgColor: hsla(108, 29%, 10%, .67);
padding: .53rem 1rem;
color: var(--textColorLow);
background-color: var(--fgColor);
border-radius: 2rem;
}
.journal.spec_1 {
-webkit-mask-image:
linear-gradient(
hsla(0, 0%, 0%, .95),
hsla(0, 0%, 0%, 0) 95%);
height: 42.13rem;
margin-bottom: -44rem;
}
.journal.spec_2 {
position: relative;
background: 0;
border: 0;
}
.journal p {
color: var(--textColorMid);
}
a.bi-pride {
background:
linear-gradient(
90deg,
hsl(328, 86%, 65%),
hsl(304, 55%, 65%) 45%,
hsl(304, 55%, 65%) 55%,
hsl(221, 81%, 65%));
background-clip: border-box;
-webkit-background-clip: text;
border-image:
linear-gradient(
90deg,
hsl(328, 86%, 65%),
hsl(304, 55%, 65%) 45%,
hsl(304, 55%, 65%) 55%,
hsl(221, 81%, 65%)) 1;
border-top: 0;
border-right: 0;
border-left: 0;
font-weight: bold;
-webkit-text-fill-color: transparent;
}
a.bi-pride:hover {
background:
linear-gradient(
90deg,
hsl(328, 86%, 65%),
hsl(304, 55%, 65%) 45%,
hsl(304, 55%, 65%) 55%,
hsl(221, 81%, 65%));
-webkit-text-fill-color: black;
}
/* -- Earthworm Series Navigator --
* by Croquembouche
**/
#page-content .earthworm .hub {
background: var(--accentColorLite);
border-color: transparent;
}
#page-content .earthworm .hub a {
color: var(--keyColor);
}
/* ---- COMBINED FLOPSTYLE: DARK MODS ---- */
#u-fade-away {
/* Mouse Hover Reveals Rating Module */
opacity: calc(1 / 3);
transition: all .25s ease-in-out;
}
#u-fade-away:hover {
opacity: 1;
}
/* ---------------- */
.end-mark > p:last-of-type::after {
/* Displays End-Mark */
color: var(--accentColor);
filter: saturate(.85) brightness(1.15);
font-size: 1.35rem;
}
/* ---------------- */
.footing {
/* -- Page Footing -- */
padding-top: 1.6rem;
}
.footing::before {
bottom: .27rem;
border-bottom: 4px solid var(--accentColor);
}
.footing::after {
top: .13rem;
border-bottom: 2px solid var(--accentColorLite);
}
display: none
display:none
:scp-wiki:more-by:lt-flops
[info]
:scp-wiki:component:license-box
[info]
:scp-wiki:component:license-box-end
[info]
bt
bb
byline
lite-heading
extra-wide
meta-title
i
pseudocrumbs
tb
journal
spec_1
journal
spec_2
highlighter
scene-break
justified
indented
centered
text-container-wrap
centered
text-container
alarm-clock
scene-break
break-hydra
baetyl
scene-break
centered
scene-break
break-hydra
baetyl
scene-break
bi-pride
end-mark
scene-break
footing
blockquote
blockquote