The Parcelmen's Creed

Link to article: The Parcelmen's Creed.

Module Styles

• 
  
  
  @import url('https://fonts.googleapis.com/css2?family=Hepta+Slab:wght@1..900&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=IM+Fell+DW+Pica+SC&display=swap');
  
  
  .licensebox {
      color: white;
  }
  
  /* COLORS */
  
  #content-wrap {
  background: linear-gradient(34.77deg, #011018 29.51%, #132934 76.89%, #011018 107.83%);
  }
  
  :root {
  --bright-accent: 3, 104, 171;
  --dark-accent: 16, 61, 91; 
  --medium-accent: 40, 40, 40; 
  --newpage-color: 123, 46, 206;
  --pale-accent: 255, 255, 255;
  --gray-monochrome: 30,30,30;
  --visited-link-color: 150, 150, 150;
  }
  
  /* SETTING VARIABLES */
  :root {
  --base-font-size: 1rem;
  --header-title: "Tales of the Mosaic";
  --header-subtitle: "It's always been this way";
  --logo-image: none;
  --header-font: "Hepta Slab", serif;
  --diagonal-stripes: none;
  --body-font: "EB Garamond", serif;
  --UI-font: Hepta Slab, PTRootUI,-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantrell,"Helvetica Neue",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  }
  
  /*MAKING ACTION AREA READABLE */
  
  .licensebox .collapsible-block-link {
      color: white;
   }
  
  #action-area {
      background: white;
  border-radius: 8px;
  padding: 1rem;
  }
  
  #action-area a {
  color: black;
  }
  
  /* HEADER TEXT */
  
  #header h1 a::before {
  display: none;
  }
  
  #header h2 span::before {
  display: none;
  }
  
  #header h1 a::after {
      font-weight: 600;
      font-size: 2.2rem;
      font-family: 'IM Fell DW Pica SC', serif;
  }
  
  #header h2 span::after {
      text-transform: none;
      font-family: 'EB Garamond', 'IM Fell DW Pica SC', serif;
      font-size: 1.2rem;
      font-weight: bold;
      margin-top: 0.5rem;
  }
  
  /* BREADCRUMBS */
  
  #breadcrumbs a:before {
      content: none;
  display: none;
  }
  
  :is(#breadcrumbs,.pseudocrumbs) a {
      margin-right: 0px;
      color: white;
  padding-right: 0.3rem;
  }
  
  :is(#breadcrumbs,.pseudocrumbs) a:hover {
      color: #f0a475;
     text-decoration: underline;
  }
  
  #breadcrumbs {
  color: white;
  font-weight: regular;
  }
  
  
  /* TITLE  */
  
  div#page-title {
      display: none;
  }
  
  span.title {
      font-weight: bold;
      color: white;
      font-size: 2.5rem;
      max-width: 24.3rem;
      display: block;
      margin: 0.5rem auto 0.5rem;
  }
  
  .whiteline-header {
      margin: 3rem auto 0rem;
      display: flex;
      align-items: center;
  }
  
  .earthworm .whiteline-header {
      margin: 3rem auto 1rem;
  }
  
  .earthworm p, .earthworm a {
  font-weight: bold;
  margin-bottom: 1rem;
  }
  
  .whiteline-label {
      text-transform: uppercase;
      color: white;
      font-weight: 700;
  font-size: 1rem;
      width: max-content;
      display: block;
      margin-inline: 1rem;
  letter-spacing: 0.15rem;
  font-family: 'IM Fell DW Pica SC', serif;
  }
  
  .whiteline-header p, .centerbox p {
  margin: 0px;
  }
  
  .whiteline-header::before, .whiteline-header::after {
      content: "";
      height: 1px;
      background: white;
      width: 100%;
  }
  
  div#u-authorlink {
      text-align: center;
  font-weight: 700;
  font-size: 1.2rem;
  }
  
  div#u-authorlink a {
      color: rgb(var(--link-color));
  font-weight: 700;
  }
  
  div#u-authorlink p {
  margin: 0px;
  color: white;
  }
  
  .centerbox {
  width: fit-content;
  margin: 1rem auto 3rem;
  text-align: center;
  }
  
  /* PAPER DOCUMENT */
  
  .paper {
  padding: 24px 40px;
  background: linear-gradient(203.04deg, #FBFAF9 40.5%, #f1f1f1 100%);
  box-shadow: 0px 16px 32px -4px rgba(12, 12, 13, 0.1), 0px 4px 4px -4px rgba(12, 12, 13, 0.05), inset 0px 0px 30px 0px #AE8B75;
  border-radius: 0px;
  margin-block: 2.5rem;
  max-width: 35rem;
  margin: 0 auto 3rem;
  }
  
  .paper p {
      font-weight: 500;
  font-size: 1.2rem;
  color: #262521;
  }
  
  @media (max-width: 479px) {
      .paper {
          padding:1rem 1rem;
      }
  }
  
  
  /* FIXING NAV BAR FONT SIZE ON MOBILE */
  @media only screen and (max-width: 56.25rem) {
  #header div[class*=top-bar]>ul>li>a {
      background: 0 0;
      font-size: calc(var(--base-font-size)*(13/15));
  }
  }
  
  /* EARTHWORM */
  
  .earthworm {
      margin-block: 3rem;
      font-weight: bold;
      font-size: 1.5rem;
      color: white;
  text-align: center;
  }
  
  .earthworm a {
      font-weight: bold;
      padding: 0.5rem 1rem;
      margin: 1rem auto;
      display: block;
      text-align: center;
      font-size: 1.2rem;
      text-decoration: none;
      transition: 0.5s;
      border: 1px solid white;
      background: #011018;
      border-radius: 0px 8px 0px 8px;
      border-left-color: #f0a475;
      border-bottom-color: #f0a475;
  max-width: 25rem;
  }
  
  .earthworm a:visited {
  color: white;
  border-color: #8a8a8a;
  }
  
  .earthworm a:hover {
      text-decoration: none;
      border: 1px solid #f0a475;
      color: #f0a475;
  }
  

• /* Only show the A/B test subject when the A/B test is active */
  :not(.ab-test--active) + .ab-test-subject { display: none; }
  
  .bottom-rating-module {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-block: 1rem;
  }
  .bottom-rating-module .page-rate-widget-box {
    margin: 0;
  }

Inline Styles

• (none)

Includes

• :scp-wiki:theme:black-highlighter-theme [info]
• :scp-wiki:component:toggle-sidebar-bhl [info]
• :scp-wiki:component:centered-header-bhl [info]
• :scp-wiki:component:preview [info]
• :scp-wiki:component:license-box [info]
• :scp-wiki:component:license-box-end [info]

CSS Classes

• centerbox

• whiteline-header

• whiteline-label

• title

• paper

• earthworm

• whiteline-header

• whiteline-label

• whiteline-header

• whiteline-label

• ab-test-subject

• bottom-rating-module

Page Source

[[include :scp-wiki:theme:black-highlighter-theme]]
[[include :scp-wiki:component:toggle-sidebar-bhl]]
[[include :scp-wiki:component:centered-header-bhl]]

[[include :scp-wiki:component:preview |text= In which a Parcelwoman faces her greatest challenge yet: stairs. (Tales of the Mosaic - 350 Words)]]

[[module CSS]]



@import url('https://fonts.googleapis.com/css2?family=Hepta+Slab:wght@1..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IM+Fell+DW+Pica+SC&display=swap');


.licensebox {
    color: white;
}

/* COLORS */

#content-wrap {
background: linear-gradient(34.77deg, #011018 29.51%, #132934 76.89%, #011018 107.83%);
}

:root {
--bright-accent: 3, 104, 171;
--dark-accent: 16, 61, 91; 
--medium-accent: 40, 40, 40; 
--newpage-color: 123, 46, 206;
--pale-accent: 255, 255, 255;
--gray-monochrome: 30,30,30;
--visited-link-color: 150, 150, 150;
}

/* SETTING VARIABLES */
:root {
--base-font-size: 1rem;
--header-title: "Tales of the Mosaic";
--header-subtitle: "It's always been this way";
--logo-image: none;
--header-font: "Hepta Slab", serif;
--diagonal-stripes: none;
--body-font: "EB Garamond", serif;
--UI-font: Hepta Slab, PTRootUI,-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantrell,"Helvetica Neue",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

/*MAKING ACTION AREA READABLE */

.licensebox .collapsible-block-link {
    color: white;
 }

#action-area {
    background: white;
border-radius: 8px;
padding: 1rem;
}

#action-area a {
color: black;
}

/* HEADER TEXT */

#header h1 a::before {
display: none;
}

#header h2 span::before {
display: none;
}

#header h1 a::after {
    font-weight: 600;
    font-size: 2.2rem;
    font-family: 'IM Fell DW Pica SC', serif;
}

#header h2 span::after {
    text-transform: none;
    font-family: 'EB Garamond', 'IM Fell DW Pica SC', serif;
    font-size: 1.2rem;
    font-weight: bold;
    margin-top: 0.5rem;
}

/* BREADCRUMBS */

#breadcrumbs a:before {
    content: none;
display: none;
}

:is(#breadcrumbs,.pseudocrumbs) a {
    margin-right: 0px;
    color: white;
padding-right: 0.3rem;
}

:is(#breadcrumbs,.pseudocrumbs) a:hover {
    color: #f0a475;
   text-decoration: underline;
}

#breadcrumbs {
color: white;
font-weight: regular;
}


/* TITLE  */

div#page-title {
    display: none;
}

span.title {
    font-weight: bold;
    color: white;
    font-size: 2.5rem;
    max-width: 24.3rem;
    display: block;
    margin: 0.5rem auto 0.5rem;
}

.whiteline-header {
    margin: 3rem auto 0rem;
    display: flex;
    align-items: center;
}

.earthworm .whiteline-header {
    margin: 3rem auto 1rem;
}

.earthworm p, .earthworm a {
font-weight: bold;
margin-bottom: 1rem;
}

.whiteline-label {
    text-transform: uppercase;
    color: white;
    font-weight: 700;
font-size: 1rem;
    width: max-content;
    display: block;
    margin-inline: 1rem;
letter-spacing: 0.15rem;
font-family: 'IM Fell DW Pica SC', serif;
}

.whiteline-header p, .centerbox p {
margin: 0px;
}

.whiteline-header::before, .whiteline-header::after {
    content: "";
    height: 1px;
    background: white;
    width: 100%;
}

div#u-authorlink {
    text-align: center;
font-weight: 700;
font-size: 1.2rem;
}

div#u-authorlink a {
    color: rgb(var(--link-color));
font-weight: 700;
}

div#u-authorlink p {
margin: 0px;
color: white;
}

.centerbox {
width: fit-content;
margin: 1rem auto 3rem;
text-align: center;
}

/* PAPER DOCUMENT */

.paper {
padding: 24px 40px;
background: linear-gradient(203.04deg, #FBFAF9 40.5%, #f1f1f1 100%);
box-shadow: 0px 16px 32px -4px rgba(12, 12, 13, 0.1), 0px 4px 4px -4px rgba(12, 12, 13, 0.05), inset 0px 0px 30px 0px #AE8B75;
border-radius: 0px;
margin-block: 2.5rem;
max-width: 35rem;
margin: 0 auto 3rem;
}

.paper p {
    font-weight: 500;
font-size: 1.2rem;
color: #262521;
}

@media (max-width: 479px) {
    .paper {
        padding:1rem 1rem;
    }
}


/* FIXING NAV BAR FONT SIZE ON MOBILE */
@media only screen and (max-width: 56.25rem) {
#header div[class*=top-bar]>ul>li>a {
    background: 0 0;
    font-size: calc(var(--base-font-size)*(13/15));
}
}

/* EARTHWORM */

.earthworm {
    margin-block: 3rem;
    font-weight: bold;
    font-size: 1.5rem;
    color: white;
text-align: center;
}

.earthworm a {
    font-weight: bold;
    padding: 0.5rem 1rem;
    margin: 1rem auto;
    display: block;
    text-align: center;
    font-size: 1.2rem;
    text-decoration: none;
    transition: 0.5s;
    border: 1px solid white;
    background: #011018;
    border-radius: 0px 8px 0px 8px;
    border-left-color: #f0a475;
    border-bottom-color: #f0a475;
max-width: 25rem;
}

.earthworm a:visited {
color: white;
border-color: #8a8a8a;
}

.earthworm a:hover {
    text-decoration: none;
    border: 1px solid #f0a475;
    color: #f0a475;
}

[[/module]]


[[div class="centerbox"]]

[[module rate]]

[[div class="whiteline-header"]]
[[span class="whiteline-label"]]Tessera[[/span]]
[[/div]]

[[span class="title"]]The Parcelmen's Creed[[/span]]

[[div id="authorlink"]]
written by [[user LibraryOfBabel]]
[[/div]]

[[/div]]

[[div class="paper"]]
Amongst Parcelmen, there was a simple creed: "No matter the district, no matter the distance, all mail must flow." Coraline knew it by heart, evidenced by the aurum pin on her lapel that gleamed brightly throughout her deliveries. She had trekked through luminolos trees and even wrangled pickerbees; truly, there was little she hadn't seen.

Yet, she had never before been where the Earface Folk roamed.

The Earfolk had no eyes to see, only swirling pits where their faces should've been. In their homes beneath Cochlea Bridge, direction had no meaning and distance was only a suggestion— unbeknownst to Coraline, who strode through their roughly-made streets with an optimistic swagger. Her directions led her to Ash Tree Lane, where the Earfaced representative's home stood, two-stories tall and somewhat skewed. With a knock, she sung: "Mail for you from Liverwort Steel!"

Coraline hummed a tune as the door clicked open. With a smile on her face, and the envelope in her pocket, she walked upstairs onto the sunken basement's ceiling. This was how stairs worked, which startled Coraline. Panicking, she found herself tripping back down the stairs into the attic, crashing through a window and across the office. Coraline noticed the representative behind his desk and shouted "Mail!" before tumbling through the closet, down into the kitchen. 

Despite her abrasions and confusion, Coraline stood with a baffled smile. The Parcelwoman knew with certainty: so long as her pin still gleamed and her satchel still had deliveries, all mail must flow. With determination, she marched upwards and downwards and sidewards through numerous stories, across gardens and garrets and galleries, each grander than the last. With aching feet, Coraline fought through the twentieth flight of stairs, tossing open the fiftieth door to reveal the office once more. She scrambled before the representative with the last of her energy, holding the envelope out with a cheery "Mail... for you!" 

Out of respect for the clearly-exhausted woman, the representative helped Coraline leave quicker than she'd arrived via the elevator, which was always an option. After her departure, the Earfaced man was left wondering:

//What's 'mail'?//
[[/div]]

[[div class="earthworm"]]
[[div class="whiteline-header"]]
[[span class="whiteline-label"]]Previous[[/span]]
[[/div]] [https://scp-wiki.wikidot.com/canvas-fish-fly Where Once The Canvas Fish Fly]

[[div class="whiteline-header"]]
[[span class="whiteline-label"]]Next[[/span]]
[[/div]] [[[Bessie Bogan and the Crow Road Inn]]]

[[/div]]]

[!-- A/B testing whether rate module at the bottom of the page actually affects anything - see https://scp-wiki.wikidot.com/forum/t-17022412/should-your-article-have-a-2nd-rating-module --]
[[module css]]
/* Only show the A/B test subject when the A/B test is active */
:not(.ab-test--active) + .ab-test-subject { display: none; }

.bottom-rating-module {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-block: 1rem;
}
.bottom-rating-module .page-rate-widget-box {
  margin: 0;
}
[[/module]]
[[module ListUsers users="."]]
[[div class="ab-test ab-test--[[#ifexpr %%number%% % 2 == 0 | active | inactive ]]"]]
[[/div]]
[[/module]]
[[div class="ab-test-subject bottom-rating-module"]]
[[module Rate]]
[[/div]]


[[include :scp-wiki:component:license-box]]
[[include :scp-wiki:component:license-box-end]]