Pastel Skies (remaster)

• 

  close

  Info

  ---

  X

  Rating with info module.

  ---

• 

  close

  Info

  ---

  X

  Info module without rating.

  
  

This is an aesthetic theme created by Miss Lapis and co-created by radian628.

To use the theme, insert the following:

[[include :scp-wiki:theme:pastel-skies]]

---

[[include :topia:theme:pastel-skies-remaster]]

Pastel Skies Theme is a component:sigma-plus theme. It comes with a pre-styled ACS (see lower down in a collapsible) and Toggle Sidebar.

---

Image.

A horizontal rule can be created with 4 hyphens "- - - -" as above. The lines separating sections of this document are horizontal rules.

---

Titles can be created by putting between one and six plus "+" at the start of the line.

+ Collapsible - Click me

First Title

Second Title

Third Title

Fourth Title

Fifth Title

Sixth Title

Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text.

Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text. Some text.

bold | italic | underline | strikethrough | teletype | ^superscript_subscript | Link

1. numbered list
2. list item
3. list item

• bulleted list
• list item
• list item

Tabulator

This is a tab view.

Tabulation

Hey look, more text here.

How quaint.

Long Ass Tab

This is a long tab. It contains a lot of text.¹

This is a long tab. It contains a lot of text.²

This is a long tab. It contains a lot of text.³

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

Long ass tab with a long ass name, very long tab and very long name. It's so long it makes your head spin

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This is also a long tab. It contains a lot of text.

This empty tab has a long ass name. It's empty and yet its name is long. It's taking too long

Stuff In Tabs Tab

Header in the Tabber

Header in the Tabber But Smaller

Header in the Tabber But Even Smaller

Text — Link

---

Quote One

(Quote Two)

Lorem ipsum

Empty Tab

Empty Tab

Empty Tab

Empty Tab

Got your nose.

Empty Tab

Footnotes

1. And a footnote.

2. Vertical tabs are the wave.

3. They're the wave except for when you're on mobile, where I made the tabs horizontal again for accessibility.

This is a blockquote, created by putting "> " at the start of each line.
More text

---

That's a horizontal rule

Nested blockquotes

You can also use [[div class="blockquote"]] to make a blockquote

The theme also has a lightweight blockquote, if you're not into the default blockquote with the chunky border.

---

You can summon it as such:

[[div class="blockquote lite"]]

+ ACS demo

Several different ACS colors, if you wanna use ACS on this theme for one reason or another

This is a	table
You should know	how to make these
already
Otherwise,	go here
wiki-syntax

The header font is IBM VGA8x16.

The body font is Departure Mono.

The UI font is Terminus.

Source Code

+ show block

/*---------------------------------------------------*/
/*  PASTEL SKIES THEME
    BY MISS LAPIS
    [2025 Wikidot Theme]
 
    INSPIRED BY / BASED ON / BORROWS ELEMENTS FROM: 
    Fossil Theme by EstrellaYoshte: https://scp-wiki.wikidot.com/theme:fossil
    Generic Space Theme by EstrellaYoshte: https://scp-wiki.wikidot.com/theme:space
    Cosmonaut Theme by EstrellaYoshte: https://scp-wiki.wikidot.com/theme:cosmonaut
    Shivering Night Theme by Flea_ZER0: https://scp-wiki-cn.wikidot.com/theme:shivering-night
 
    WITH SPECIAL THANKS TO: 
    STRANGE MATTER ET AL FOR EMOTIONAL SUPPORT AND FOR HYPING ME UP
    SUGARUSH FOR WANTING A PINK THEME (I HOPE THE PINK COLOR SCHEME IS PINK ENOUGH)
    ADASBA, CROQUEMBOUCHE, HAYDENSAINTPASCAL, FISH^12, MANG GWAN, YOSSIPOSSI, PLAGUEPJP, AMAI IXCHEL, IGNOTA FOR TECHNICAL/AESTHETIC SUPPORT
    ESTRELLAYOSHTE FOR MAKING THEMES
    [tech team member who approved it] FOR APPROVAL AND ADDITIONAL TECHNICAL SUPPORT */
/*---------------------------------------------------*/
 
/* fonts taken from Isolated Terminal Theme by EstrellaYoshte and from SCP-8980 by Yossipossi */
@import url('https://scp-wiki.wdfiles.com/local--files/theme:isolated-terminal/vga8.css');
@import url('https://scp-wiki.wdfiles.com/local--files/theme:isolated-terminal/terminus.css');
@import url('https://scp-wiki.wikidot.com/local--files/scp-8980/departuremono.css');
 
    /*---------------------------------------------------*/
    /*----------------------- ROOT ----------------------*/
    /*---------------------------------------------------*/
 
:root {
    --header-font: 'mxplus_ibm_vga_8x16regular', monospace;
    --title-font: 'mxplus_ibm_vga_8x16regular', monospace; 
    --body-font: 'Departure Mono', monospace; 
    --UI-font: 'terminus_ttfmedium', monospace; 
 
    --header-title: "⠀⠀⠀";
    --header-subtitle: " ";
 
    --sp_header-title-scale: 1.5;
    --sp_header-title-size: min(calc(2.675rem * var(--sp_header-title-scale)), calc(1.25rem * var(--sp_header-title-scale) + 2.5vw));
    --sp_header-logo: unset;
    --sp_header-logo-size: 28rem;
    --sp_header-logo-adaptive-size: min(var(--sp_header-logo-size), calc(var(--sp_header-logo-size)*0.9 + 5vw));
    --sp_header-height: 20rem;
 
    --sp_top-bar-height: 2rem;
    --sp_top-bar-gradient-top-color: rgba(var(--top-bar-color), 0.8);
    --sp_top-bar-gradient-bottom-color: rgba(var(--top-bar-color), 0.8);
    --sp_top-bar-link-hover-background: rgba(var(--lighter-pink), 0.8);
    --sp_top-bar-link-hover-color: rgb(var(--dark-purple));
    --sp_dropdown-background: rgb(var(--light-pink));
    --sp_dropdown-link-hover-color: rgb(var(--dark-pink));
    --sp_dropdown-link-hover-background: rgb(var(--light-red));
 
    --sp_tab-text-color: rgb(var(--dark-purple));
    --sp_tab-background: rgb(var(--light-red));
    --sp_tab-border-color: transparent;
    --sp_tab-hover-text-color: rgb(var(--dark-purple));
    --sp_tab-hover-background: rgba(var(--light-purple), 0.4);
    --sp_tab-hover-border-color: transparent;
    --sp_tab-selected-text-color: rgb(var(--dark-purple));
    --sp_tab-selected-background: rgb(var(--light-pink));
    --sp_tab-selected-border-color: transparent;
 
    --sp_rate-module-text-color: rgb(var(--text-color));
    --sp_rate-module-background: rgb(var(--lighter-pink));
    --sp_rate-module-sub-color: rgb(var(--light-red));
    --sp_rate-module-active-color: var(--sp_rate-module-background);
    --sp_rate-module-button-color: var(--sp_rate-module-background);
    --sp_rate-module-button-background: var(--sp_rate-module-background);
    --sp_rate-module-button-hover-color: var(--sp_rate-module-active-color);
    --sp_rate-module-button-hover-background: rgb(var(--light-pink));
 
    --sp_hovertip-background: rgb(var(--lighter-pink));
    --sp_hovertip-border: var(--border-big) rgb(var(--border-color-general));
 
/* ---------- custom colors and vars ---------- */
    --light-purple: 192, 163, 217; 
    --light-pink: 238, 178, 203; 
    --lighter-pink: 250, 207, 225;
    --light-red: 250, 207, 207; 
    --dark-purple: 86, 46, 96; 
    --dark-pink: 129, 54, 101; 
    --white: 255, 255, 255; 
    --text-color: 32, 21, 51;
 
    --bg-color: 184, 189, 231;
    --lowest-sky: 243, 199, 216;
 
    --border-color-general: 199, 123, 169;
    --top-bar-color: var(--bg-color);
    --selection-color: 146, 63, 112;
    --og-selection-color: 0, 120, 215;
 
    --border-image: url(https://scptestwiki.wdfiles.com/local--files/sigma%3Alapistest/bordir.svg) 10;
    --cloud-background-image: url(https://scptestwiki.wdfiles.com/local--files/sigma%3Alapistest/cloudy_dusk_new.png);
 
    --radius: 1.4rem;
    --border-big: 0.3em solid;
    --border-small: 0.08em solid;
    --button-border: 0.3rem outset;
    --pink-border-filter: invert(91%) sepia(13%) saturate(7071%) hue-rotate(282deg) brightness(85%) contrast(80%);
    --dark-purple-filter: invert(19%) sepia(28%) saturate(1641%) hue-rotate(245deg) brightness(93%) contrast(87%);
 
    /*---------------------------------------------------*/
    /*------------------- PIXEL BORDER ------------------*/
    /*---------------------------------------------------*/
    /*---------------- CODE FROM CODEPEN ----------------*/
    /*-----------------LICENSED UNDER MIT ---------------*/
    /*---------------------------------------------------*/
    /*---- https://codepen.io/makewistful/pen/ezOGJK ----*/
    /*---------------------------------------------------*/
 
    --pixel-bg: var(--light-red);
    --pixel-border: var(--dark-purple);
    --pixel-border-2: var(--pixel-bg);
    --pixel-border-3: var(--pixel-border);
    --pixel: .3rem; /* Pixel size */
 
    --the-border-itself: /* Inner Background Color */
     0 calc(var(--pixel) * -3) 0 calc(var(--pixel) * -1) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * 3) 0 calc(var(--pixel) * -1) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * -6) 0 calc(var(--pixel) * -2) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * 6) 0 calc(var(--pixel) * -2) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * -9) 0 calc(var(--pixel) * -4) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * 9) 0 calc(var(--pixel) * -4) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * -12) 0 calc(var(--pixel) * -6) rgb(var(--pixel-bg)),
     0 calc(var(--pixel) * 12) 0 calc(var(--pixel) * -6) rgb(var(--pixel-bg)),
 
    /* Pixel Border Layer 1 */
     calc(var(--pixel) * -1) 0 0 0 rgb(var(--pixel-border)),
     var(--pixel) 0 0 0 rgb(var(--pixel-border)),
     0 calc(var(--pixel) * -2) 0 0 rgb(var(--pixel-border)),
     0 calc(var(--pixel) * 2) 0 0 rgb(var(--pixel-border)),
     0 calc(var(--pixel) * -5) 0 calc(var(--pixel) * -1) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * 5) 0 calc(var(--pixel) * -1) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * -7) 0 calc(var(--pixel) * -2) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * 7) 0 calc(var(--pixel) * -2) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * -10) 0 calc(var(--pixel) * -4) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * 10) 0 calc(var(--pixel) * -4) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * -13) 0 calc(var(--pixel) * -6) rgb(var(--pixel-border)),
     0 calc(var(--pixel) * 13) 0 calc(var(--pixel) * -6) rgb(var(--pixel-border)),
 
    /* Pixel Border Layer 2 */
     calc(var(--pixel) * -2) 0 0 0 rgb(var(--pixel-border-2)),
     calc(var(--pixel) * 2) 0 0 0 rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * -1) 0 var(--pixel) rgb(var(--pixel-border-2)),
     0 var(--pixel) 0 var(--pixel) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * -4) 0 0 rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * 4) 0 0 rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * -6) 0 calc(var(--pixel) * -1) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * 6) 0 calc(var(--pixel) * -1) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * -8) 0 calc(var(--pixel) * -2) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * 8) 0 calc(var(--pixel) * -2) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * -11) 0 calc(var(--pixel) * -4) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * 11) 0 calc(var(--pixel) * -4) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * -14) 0 calc(var(--pixel) * -6) rgb(var(--pixel-border-2)),
     0 calc(var(--pixel) * 14) 0 calc(var(--pixel) * -6) rgb(var(--pixel-border-2)),
 
    /* Border Layer 3: --pixel-border-3 */
     calc(var(--pixel) * -3) 0 0 0 rgb(var(--pixel-border-3)),
     calc(var(--pixel) * 3) 0 0 0 rgb(var(--pixel-border-3)),
     0 0 0 calc(var(--pixel) * 2) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * -3) 0 var(--pixel) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * 3) 0 var(--pixel) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * -5) 0 0 rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * 5) 0 0 rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * -7) 0 calc(var(--pixel) * -1) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * 7) 0 calc(var(--pixel) * -1) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * -9) 0 calc(var(--pixel) * -2) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * 9) 0 calc(var(--pixel) * -2) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * -12) 0 calc(var(--pixel) * -4) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * 12) 0 calc(var(--pixel) * -4) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * -15) 0 calc(var(--pixel) * -6) rgb(var(--pixel-border-3)),
     0 calc(var(--pixel) * 15) 0 calc(var(--pixel) * -6) rgb(var(--pixel-border-3));
 
    /*---------------------------------------------------*/
    /*-------------------- END OF ROOT ------------------*/
    /*---------------------------------------------------*/
}
 
    /*---------------------------------------------------*/
    /*------------------ MAIN ELEMENTS ------------------*/
    /*---------------------------------------------------*/
 
/* ---------- griddy ---------- */
#header {
    background: transparent;
    grid-template-areas:
        "login login login search"
        "top-bar top-bar top-bar top-bar"
        ". . . ."
        "h1 h1 . ."
        ". . . .";
    grid-template-rows: auto auto 1fr auto 1fr;
    grid-template-columns: var(--sp_area-comp-margin) 1fr auto auto;
}
/* -------------------- */
 
/* ---------- title ---------- */
#header h1 a {
  position: relative;
}
 
#header h2 { display: none; }
#header h1 a {
    font-family: var(--header-font); 
    text-shadow: none;
    font-weight: 700;
    line-height: 0.875;
    letter-spacing: -0.1rem;
    margin-bottom: 5rem;
    color: transparent;
 
    background-image: url("https://scptestwiki.wdfiles.com/local--files/sigma%3Alapistest/moon_icon.svg");
    background-size: var(--sp_header-logo-adaptive-size) auto;
    background-repeat: no-repeat;
    background-position: center;
    transition: filter 0.2s ease-out;
}
 
#header h1 a:is(:hover,:focus-within) {
    filter: drop-shadow(0 0 10px rgb(var(--light-red)));
}
 
#header::before {
    content: "";
    display: block;
    background: var(--sp_header-logo) no-repeat center;
    background-size: contain;
    grid-row: 3/6;
    grid-column: 1/3;
    justify-self: center;
    width: var(--sp_header-logo-adaptive-size);
}
 
#header h1 {
    margin-top: 5em;
}
 
#header h1, #header h2 {
  margin-left: initial;
  padding: 0;
  padding-inline-start: 0;
  float: none;
  max-height: initial;
  font-size: 1rem;
  text-align: center;
}
 
#header h1 a::before {
    content: var(--header-title);
    font-size: 18rem;
}
/* -------------------- */
 
/* ---------- user info and owindows ---------- */
#header-extra-div-1 {
    grid-area: login;
    background-color: rgba(var(--bg-color), 0.8);
}
 
#login-status {
    padding-inline-start: calc(var(--sp_area-min-margin) + 1.25rem);
    padding-inline-end: 2rem;
    padding-left: 5em;
    height: 30px;
    text-align: center;
    width: max-content;
    font-size: 0.9em;
    color: rgb(var(--dark-pink));
}
 
#login-status a {
    color: rgb(var(--dark-purple));
}
 
a#account-topbutton {
    display: grid;
    place-content: center;
    height: 69%;
    width: 1.75rem;
    padding: 0.2em;
    margin: 0;
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    font-size: 1.02em;
    color: rgb(var(--dark-purple));
    border: none;
}
 
a#account-topbutton:is(:hover, :active, :focus, :focus-within) {
    color: rgb(var(--dark-pink));
}
 
#account-options {
    background-color: rgb(var(--light-pink));
    border: none;
}
 
#account-options ul li a {
    text-align: center;
    color: rgb(var(--dark-purple));
    border-bottom: 0.08em solid rgb(var(--white));
}
 
#account-options ul li a:is(:hover, :active, :focus, :focus-within) {
    color: var(--dark-purple);
    background-color: rgb(var(--light-red));
}
 
.owindow {
    background-color: rgb(var(--lighter-pink));
    color: rgb(var(--text-color));
    border: var(--border-big) rgb(var(--border-color-general));
}
 
.owindow .title {
    cursor: initial;
    padding: 0.375rem 0.675rem;
    font-family: var(--header-font); 
    font-size: 190%;
    text-align:center;
    background-color: rgba(var(--bg-color), 0.7);
    color: rgb(var(--dark-purple));
    border-top: 0.08em solid rgb(var(--dark-purple));
    border-bottom: 0.08em solid rgb(var(--dark-purple));
 
    height: auto;
}
 
.owindow img {
    background-color: transparent!important;
}
 
.owindow a {
    color: rgb(var(--dark-purple));
}
 
.owindow:has(#user-abuse-report-button-hovertip) {
    background-color: rgb(var(--light-red));
    color: rgb(var(--text-color));
    box-shadow: var(--the-border-itself);
    border: unset;
}
 
.modal-body td img[src*="userkarma.php"] {
    filter: hue-rotate(150deg);
}
/* -------------------- */
 
/* ---------- search box ---------- */
#search-top-box-form {
    gap: 0;
    height: 100%;
}
 
#search-top-box-input, #search-top-box-form input[type=submit] {
    padding: 0.25rem;
    height: 100%;
    box-sizing: border-box;
    border-radius: 0;
}
 
#search-top-box-form input.btn[type=submit] {
    box-shadow: none;
    background: rgb(var(--lighter-pink));
    border: none;
    font-size: 0;
    width: 2rem;
}
#search-top-box {
    --search-mask: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E);
}
#search-top-box::before {
    content: "";
    display: block;
    width: 2rem;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgb(var(--dark-pink));
    pointer-events: none;
    z-index: 2;
    -webkit-mask-image: var(--search-mask);
    mask-image: var(--search-mask);
    -webkit-mask-size: 1.05rem;
    mask-size: 1.05rem;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}
/* -------------------- */
 
/* ---------- top bar ---------- */
#top-bar {
    border-bottom: 0.25em solid rgb(var(--dark-purple));
}
 
#top-bar div[class*="top-bar"] > ul > li { 
    flex-grow: 1; 
}
 
#top-bar div[class*="top-bar"]>ul>li>a {
    color: rgb(var(--dark-pink));
    font-weight: bold;
}
 
#top-bar :is(.top-bar, .mobile-top-bar) ul li ul {
    display: grid;
    padding: .425rem;
    border: none;
    border-bottom: 0.25em solid rgb(var(--dark-purple));
    font-size: 0.9em;
}
 
#top-bar :is(.top-bar, .mobile-top-bar) ul li ul li a {
    text-align: center;
    padding: .375rem .625rem;
    font-weight: bold;
    color: rgb(var(--dark-purple));
}
 
#top-bar .open-menu a {
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    border: 0.15em solid rgb(var(--dark-purple));
    background-color: rgba(var(--top-bar-color), 0.6);
    border-radius: 0;
    color: rgb(var(--dark-purple));
}
/* -------------------- */
 
/* ---------- sidebar ---------- */
div#side-bar {
    font-family: var(--UI-font);
    background-color: rgba(var(--dark-purple), 0.7);
    border-right: 0.08em solid rgb(var(--dark-purple));
    scrollbar-width: none;
}
 
:is(#side-bar, #interwiki) .heading {
    padding-left: 0;
    color: rgb(var(--dark-purple));
    font-family: var(--header-font);
    font-size: 1.2em;
    text-align: center;
    border-bottom-color: rgb(var(--dark-purple));
}
 
#side-bar a, #interwiki a { 
    color: rgb(var(--white)); 
}
 
#side-bar a:is(:hover, :active, :focus, :focus-within), #interwiki a:is(:hover, :active, :focus, :focus-within) { 
    text-decoration: underline;
}
 
:is(#side-bar, #interwiki) .side-block {
    background-color: rgba(var(--light-purple), 0.9);
    border-color: rgb(var(--dark-purple));
}
 
#side-bar .side-block.resources {
    background-color: rgba(var(--border-color-general), 0.9);
    border-color: rgb(var(--dark-purple));
}
 
#side-bar .side-block.media {
    background-color: rgba(var(--light-red), 0.9);
    border-color: rgb(var(--dark-purple));
}
 
.side-block.media a:nth-child(1) img {
    filter: hue-rotate(60deg);
}
.side-block.media a:nth-child(2) img {
    filter: hue-rotate(78deg);
}
.side-block.media a:nth-child(3) img {
    filter: hue-rotate(265deg);
}
.side-block.media a:nth-child(5) img {
    filter: hue-rotate(20deg);
}
.side-block.media a:nth-child(7) img {
    filter: hue-rotate(46deg);
}
/* -------------------- */
 
/* ---------- rating module ---------- */
:not(.rate-box-with-credit-button) > div.page-rate-widget-box,
div.rate-box-with-credit-button {
    border-radius: 0;
    border: var(--border-small) rgb(var(--border-color-general));
    font-size: 1.14em;
    font-family: var(--UI-font);
}
 
.page-rate-widget-box :is(.rateup, .ratedown, .cancel) a {
    display: block;
    height: 100%;
    width: 0.95em;
    text-align: center;
}
 
div.page-rate-widget-box .cancel a:hover { 
    background-color: var(--sp_rate-module-button-hover-background);
}
 
.creditButton p a:hover, .creditButtonStandalone p a:hover {
    background-color: var(--sp_rate-module-button-hover-background);
}
 
div.modalbox {
    background: rgb(var(--light-red));
    padding: 0.25rem 0.75rem;
    border: none;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
}
.modalbox > .credit {
    margin: 0.5rem;
}
 
.creditButtonStandalone p a {
    border-radius: 0;
    border: var(--border-small) rgb(var(--border-color-general));
    background-color: rgb(var(--lighter-pink));
}
/* -------------------- */
 
/* ---------- scrollbar ---------- */
::-webkit-scrollbar {
  width: 0.625rem;
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgb(var(--dark-pink));
  border: none;
}
::-webkit-scrollbar-track {
  background: rgb(var(--bg-color));
}
 
:root {
    scrollbar-color: rgb(var(--dark-pink)) rgb(var(--bg-color));
    scrollbar-width: thin;
}
/* -------------------- */
    /*---------------------------------------------------*/
 
    /*---------------------------------------------------*/
    /*------------------ SKY BACKGROUND -----------------*/
    /*---------------------------------------------------*/
#container {
    background-color: rgb(var(--bg-color));
    background-image: url('https://scptestwiki.wdfiles.com/local--files/sigma%3Alapistest/cloudy_dawn_sky_new.png'), linear-gradient(0deg, rgba(var(--lowest-sky),1) calc(50vh - 15vw), rgba(var(--bg-color),1) calc(50vh - 15vw));
    background-size: 100dvw auto, auto;
    background-position: center, center;
    background-attachment: fixed, fixed;
    background-repeat: no-repeat, no-repeat;
    image-rendering: pixelated; 
}
 
:root {
  --cloud-background-gradient-transition: calc(100vh - 30vw);
}
 
#container::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    background-image: var(--cloud-background-image), linear-gradient(0deg, rgba(var(--light-purple),1) var(--cloud-background-gradient-transition), rgba(var(--bg-color),0) var(--cloud-background-gradient-transition));
    background-size: 100dvw auto, auto;
    background-position: right center, top 150%;
    background-repeat: no-repeat, no-repeat;
    image-rendering: pixelated; 
}
    /*---------------------------------------------------*/
 
    /*---------------------------------------------------*/
    /*----------------- BODY CONTAINER ------------------*/
    /*---------------------------------------------------*/
#main-content {
    background: rgba(var(--light-red), 0.6);
    background: linear-gradient(180deg,rgba(var(--light-red), 1) 0%, rgba(var(--light-red), 0.6) 15%, rgba(var(--light-red), 0.6) 85%, rgba(var(--light-red), 1) 100%);
    padding: 2.5rem 2.5rem 0 2.5rem;
    margin: 3rem auto;
    max-width: 53.5rem;
    color: rgb(var(--text-color));
    box-shadow: var(--the-border-itself);
    image-rendering: auto;
}
 
#content-wrap {
    margin: 0 auto;
}
    /*---------------------------------------------------*/
 
    /*---------------------------------------------------*/
    /*---------------------- FONTS ----------------------*/
    /*---------------------------------------------------*/
body {
    font-family: var(--body-font); 
    color: rgb(var(--text-color));
}
 
::selection {
    background-color: rgba(var(--selection-color), 0.72);
    color: rgb(var(--white));
}
 
a::selection {
    color: #e3edfa;
}
 
h1 { font-size: 2.1em; }
h2 { font-size: 2em; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.6em; }
h5 { font-size: 1.4em; }
h6 { font-size: 1.2em; }
 
h1, h2, h3 {
    font-family: var(--header-font); 
    color: rgb(var(--dark-purple));
}
 
h4, h5, h6 {
    font-family: var(--header-font); 
    color: rgb(var(--dark-pink));
}
 
#page-title, .meta-title {
    font-family: var(--header-font); 
    color: rgb(var(--dark-purple));
    border-bottom: var(--border-small) rgb(var(--dark-pink));
    text-align: center;
    font-size: calc(var(--sp_header-title-size) * 0.8);
}
 
#main-content {
    font-size: 0.9em;
}
 
#main-content a:not(.yui-navset .yui-nav a, .collapsible-block a) {
    font-weight: bold;
    color: rgb(var(--dark-pink));
    text-decoration: underline;
}
 
tt {
    font-family: var(--UI-font);
    font-size: 1.2em;
}
    /*---------------------------------------------------*/
 
    /*---------------------------------------------------*/
    /*--------------- KEY PAGE COMPONENTS ---------------*/
    /*---------------------------------------------------*/
 
hr {
    background-color: rgb(var(--border-color-general));
}
 
/* ---------- blockquote ---------- */
blockquote, div.blockquote {
    display: flow-root;
    position: relative;
    border-color: transparent;
    border-radius: var(--radius); 
    padding: 0.25rem 1.325rem;
 
    background-color: rgb(var(--light-red));
    color: rgb(var(--text-color));
}
 
blockquote::after, div.blockquote::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 30px solid;
    border-image: var(--border-image) / 1rem;
    filter: var(--pink-border-filter);
    border-image-outset: 0.1em 0.1em 0.06em;
    pointer-events: none;
}
/* -------------------- */
 
/* ---------- lite blockquote ---------- */
div.blockquote.lite {
    border: var(--border-small) rgb(var(--border-color-general));
    border-radius: 0; 
}
div.blockquote.lite::after {
    border: transparent;
    border-image: unset;
}
/* -------------------- */
 
/* ---------- collapsible ---------- */
div[class*="collapsible-block"] {
    display: flow-root;
}
 
.collapsible-block-folded a.collapsible-block-link,
.collapsible-block-unfolded-link a.collapsible-block-link {
    display: block;
    padding: .53rem 1rem;
    color: rgb(var(--dark-purple)); 
}
 
.collapsible-block-folded a.collapsible-block-link:is(:hover, :active, :focus, :focus-within) {
    color: rgb(var(--dark-purple));
    background-color: rgb(var(--light-red));
    border-radius: var(--radius); 
    filter: unset;
    text-decoration: none;
}
 
.collapsible-block-folded, .collapsible-block-unfolded-link {
    position: relative;
    margin: 1rem auto;
    padding: 0;
    border-color: transparent;
    border-radius: var(--radius); 
    background-color: rgb(var(--light-pink)); 
    font-family: var(--header-font); 
    font-size: 140%;
 
    text-align:center;
}
 
:is(.collapsible-block-folded, .collapsible-block-unfolded-link)::after {
    content: "";
    position: absolute;
    inset: 0;
    border: unset;
    border-image: var(--border-image) / 1rem;
    filter: var(--dark-purple-filter);
    border-image-outset: 0.1em;
    pointer-events: none;
}
 
.collapsible-block-folded:is(:hover, :active, :focus, :focus-within),
.collapsible-block-unfolded-link:is(:hover, :active, :focus, :focus-within){
    background-color: rgb(var(--light-red)); 
    color: rgb(var(--dark-purple));
    filter: unset;
}
 
:is(.collapsible-block-folded, .collapsible-block-unfolded-link):is(:hover, :active, :focus, :focus-within)::after {
    content: "";
    position: absolute;
    inset: 0;
    border: unset;
    border-image: var(--border-image) / 1rem;
    filter: var(--dark-purple-filter);
    border-image-outset: 0.1em;
    pointer-events: none;
}
 
.collapsible-block-link:is(:hover, :active, :focus, :focus-within){
    color: rgb(var(--text-color));
}
 
.collapsible-block-unfolded {
    position: relative;
    margin: 1rem auto;
    border-color: transparent;
    border-radius: var(--radius); 
    background-color: rgb(var(--light-red)); 
    color: rgb(var(--text-color));
}
 
.collapsible-block-unfolded::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 30px solid;
    border-image: var(--border-image) / 1rem;
    filter: var(--dark-purple-filter);
    border-image-outset: 0.14em;
    pointer-events: none;
}
 
.collapsible-block-unfolded > *:nth-child(1){
    padding: 0;
    margin-top: 0;
}
 
.collapsible-block-unfolded > * {
    padding: .53rem 1rem;
}
/* -------------------- */
 
/*-------- tabs --------*/
 
:is(.yui-navset.yui-navset-top .yui-nav li a:where(:hover, :active, :focus, :focus-within)) {
    color: var(--sp_tab-hover-text-color);
    background: var(--sp_tab-hover-background);
    border-color: var(--sp_tab-hover-border-color);
}
 
div.yui-navset {
    display: grid;
    grid-template-areas: "tab content";
    grid-template-columns: 12.5rem minmax(0,1fr);
    align-items: flex-start;
    --_gap: .45rem;
    gap: var(--_gap);
    padding: var(--_gap);
    background-color: rgb(var(--light-pink));
    border-radius: var(--radius);
}
 
:is(div.yui-navset)::after {
    content: "";
    position: absolute;
    inset: 0;
    border: unset;
    border-image: var(--border-image) / 1rem;
    filter: var(--pink-border-filter);
    border-image-outset: 0.1em;
    pointer-events: none;
}
 
.yui-navset .yui-nav {
    grid-area: tab;
    display: grid;
    border: none;
    gap: var(--_gap);
    font-size: clamp(.875em, calc(.5em + .675vw), .9125em);
    top: var(--_gap);
    position: static;
}
 
.yui-navset.yui-navset-top>.yui-nav>li {
    flex-grow: 0;
    position: relative;
    margin: 1.2rem;
    padding: .53rem 1rem;
 
    border-color: transparent;
    border-radius: var(--radius);
 
    font-family: var(--header-font); 
    font-size: 140%;
    text-align: center;
}
 
:is(.yui-navset.yui-navset-top>.yui-nav>li)::after {
    content: "";
    position: absolute;
    inset: 0;
    border: unset;
    border-image: var(--border-image) / 1rem;
    filter: var(--pink-border-filter);
    border-image-outset: 0.1em;
    pointer-events: none;
}
 
:is(.yui-navset.yui-navset-top .yui-nav .selected a)::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    border: unset;
    border-image: var(--border-image) / 1rem;
    filter: var(--dark-purple-filter);
    border-image-outset: 0.22em;
    pointer-events: none;
}
 
:is(.yui-navset.yui-navset-top>.yui-nav>li a):is(:hover, :active, :focus, :focus-within)::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    border: unset;
    border-image: var(--border-image) / 1rem;
    filter: var(--dark-purple-filter);
    border-image-outset: 0.22em;
    pointer-events: none;
}
 
.yui-navset.yui-navset-top .yui-nav li a {
    border-radius: calc(var(--radius) - var(--_gap) + 0.02rem);
    border-width: .125rem;
    padding: .575em;
}
.yui-navset .yui-content {
    grid-area: content;
    align-self: stretch;
    border: none;
    border-radius: calc(var(--radius) - var(--_gap) + 0.01rem);
    padding: 0.325rem 1.25rem;
    background-color: rgba(var(--light-red), 0.8);
    min-height: var(--radius);
}
/* -------------------- */
 
/* ---------- tables ---------- */
table.wiki-content-table :is(th,td) {
    border-color: rgb(var(--border-color-general));
}
 
table.wiki-content-table th {
    background-color: rgb(var(--light-pink));
    color: rgb(var(--text-color));
}
 
table.wiki-content-table td {
    background: rgb(var(--light-red));
}
/* -------------------- */
 
/* ---------- image block ---------- */
.scp-image-block {
    border: none;
    box-shadow: none;
    padding: 0;
    box-sizing: border-box;
    background: rgba(var(--bg-color), 0.25);
}
 
.scp-image-block.block-left { margin-left: 0; }
 
.scp-image-block.block-right { margin-right: 0; }
 
.scp-image-block .scp-image-caption {
    background-color: rgb(var(--light-purple));
    border: unset;
    padding: 0;
    padding-top: 0.25rem;
    color: rgb(var(--text-color));
    font-weight: normal;
    font-size: .95em;
}
/* -------------------- */
 
/* ---------- TOC ---------- */
#toc {
    background-color: rgb(var(--lighter-pink));
    border: var(--border-big) rgb(var(--border-color-general));
}
/* -------------------- */
 
/* ---------- ACS ---------- */
div.anom-bar-container {
  --five-color: 150, 52, 103;
  --four-color: 113, 58, 142;
  --three-color: 81, 74, 143;
  --two-color: 68, 103, 140;
  --one-color: 70, 142, 126;
}
 
div.danger-diamond a {
    color: transparent!important;
}
 
div.anom-bar-container.clear-6 .top-center-box > div {
    background-image: url("http://scptestwiki.wdfiles.com/local--files/sigma%3Alapistest/blue_spaces.jpg");
    background-blend-mode: normal;
}
/* -------------------- */
 
/* ---------- code ---------- */
.code {
    font-weight: bold;
    background: rgb(var(--light-red));
    border: none;
}
 
pre {
    font-family: var(--UI-font);
    font-size: 1.15em;
}
 
.hl-code,
.hl-default,
.hl-brackets,
.hl-quotes,
.hl-string,
.hl-identifier {
    color: rgb(18, 18, 18);
}
.hl-special {
    color: rgb(60, 158, 155);
}
.hl-number {
    color: rgb(199, 158, 71);
}
.hl-reserved {
    color: rgb(50, 131, 214);
}
.hl-var, .hl-comment {
  color: rgb(255, 97, 136);
}
/* -------------------- */
 
    /*---------------------------------------------------*/
    /*------------------- BOTTOM HALF -------------------*/
    /*---------------------------------------------------*/
 
/* ---------- license area ---------- */
#footer,
#license-area {
    position: relative;
    z-index: 2;
    background-color: rgb(var(--light-purple));
    color: rgb(var(--text-color));
}
 
#footer a, #license-area a {
    color: rgb(var(--dark-purple));
}
 
#footer {
    padding-top: 1rem;
}
 
#license-area {
    padding-top: 0;
}
 
.hovertip {
    color: rgb(var(--text-color));
    font-family: var(--UI-font);
}
/* -------------------- */
 
/* ---------- buttons ---------- */
div.buttons input, input.button, button, a.button, .owindow .button-bar .btn {
    margin: 0.125rem;
    padding: 0.25rem 0.675rem;
    text-decoration: none;
    background-color: rgb(var(--dark-purple));
    border: var(--button-border) rgb(var(--light-purple));
    font-weight: bold;
    color: rgb(var(--white));
}
 
:is(div.buttons input, input.button, button, a.button, .owindow .button-bar a):is(:hover, :active, :focus, :focus-within) {
    color: rgb(var(--white));
    background-color: rgb(var(--border-color-general));
    border: var(--button-border) rgb(var(--light-purple));
    font-weight: bold;
}
 
a.action-area-close:is(:hover, :active, :focus, :focus-within) {
    background-color: transparent;
}
/* -------------------- */
 
/* ---------- really misc misc stuff ---------- */
 
textarea, input.text {
    font-family: var(--UI-font);
    font-size: 1.198em;
    background-color: rgb(247, 225, 225);
}
 
:is(textarea, input.text)::selection {
  background-color: rgb(var(--og-selection-color));
  color: rgb(var(--white));
}
 
#lock-info {
    border-color: rgb(var(--border-color-general));
    background-color: rgb(var(--light-pink));
    color: rgb(var(--text-color));
}
 
.page-source {
    font-family: var(--UI-font);
    font-size: 1.18em;
    background-color: rgb(var(--light-red));
    border: var(--border-big) rgb(var(--border-color-general));
}
 
.page-tags > span {
  border-top: none;
}
 
#edit-page-title {
    width: 100%;
}
 
.keycap {
    color: rgb(var(--dark-purple));
}
 
table.form td div.sub, form div.sub {
    color: rgb(var(--text-color));
}
/* -------------------- */
 
    /*---------------------------------------------------*/
 
    /*---------------------------------------------------*/
    /*---------------------- PHONE ----------------------*/
    /*---------------------------------------------------*/
@media only screen and (max-width: 1175px) {
#container::before {
    background-position: right center, center;
}
 
:root:root {
  --cloud-background-gradient-transition: calc(50vh - 17vw);
}
}
 
@media only screen and (max-width: 767.98px) {
 
:root {
    --sp_header-logo-size: 15rem;
}
 
:root:root {
  --cloud-background-gradient-transition: calc(50vh - 120px);
}
 
#login-status {
    padding-left: 3em;
}
 
#header h1 {
    padding-left: 0.8rem;
}    
 
#header h1 a::before {
    font-size: 9rem;
}
 
#header h1 a {
    margin-bottom: 4rem;
}
 
#header::before {
    grid-column: 2/3;
}
 
#top-bar div[class*="top-bar"] > ul > li {
    position: static;
}
 
#container {
    background-image: url('https://scptestwiki.wdfiles.com/local--files/sigma%3Alapistest/cloudy_dawn_sky_new.png'), linear-gradient(0deg, rgba(var(--lowest-sky),1) calc(75vh - 5vw), rgba(var(--bg-color),1) calc(55vh - 15vw));
    background-size: auto calc(var(--sp_header-height) + var(--sp_top-bar-height)), auto;
    background-position: right 15%, center;
}
 
#container::before {
    background-size: auto calc(var(--sp_header-height) + var(--sp_top-bar-height)), auto;
}
 
#content-wrap {
  position: relative;
  margin: 0 auto 0;
 
:root:root {
  --cloud-background-gradient-transition: calc(50vh - 120px);
}
 
#main-content {
    padding: 2.5rem 0.5rem 0 0.5rem;
}
 
.owindow:has(#user-abuse-report-button-hovertip) {
    margin: 3rem auto;
}
 
/* -------- tabs on phone -------- */
div.yui-navset {
    grid-template-areas:
        "tab"
        "content";
    grid-template-columns: minmax(0,1fr);
}
.yui-navset .yui-nav {
    display: flex;
    flex-wrap: wrap;
    position: static;
}
 
.yui-navset.yui-navset-top .yui-nav :is(li, .selected) {
  flex-grow: 1;
}
}

‡ Licensing / Citation

Cite this page as:

"Pastel Skies (remaster)" by Miss Lapis and radian628, from the SCP Wiki. Source: https://scpwiki.com/theme:pastel-skies-remaster. Licensed under CC BY-SA.

For information on how to use this component, see the License Box component. To read about licensing policy, see the Licensing Guide.

Filename: blue_spaces.jpg
License: CC BY 3.0
Source Link: SCP Foundation Wiki
Image is a composite that incorporates the following image:
Filename: Dragonfish600.jpg
Author: NASA/JPL-Caltech/Univ. of Toronto
License: Public Domain
Source Link: Wikimedia Commons

Filename: acs_demo_pastel_skies.png
License: CC BY-SA 3.0
Source Link: SCP Foundation Wiki
Image is a composite that incorporates the following:
Name: Anomaly Classification Bar
Author: Woedenaz
License: CC BY-SA 3.0
Source Link: SCP Foundation Wiki

Filename: All other images (icon_night.svg, bordir.svg, cloudy_dusk_new.png, cloudy_dawn_sky_new.png)
Author: Miss Lapis
License: CC BY-SA 3.0
Source Link: SCP Foundation Wiki

Filename: —the-border-itself and all corresponding variables
Author: makewistful
License: MIT
Source Link: Codepen