@import url(https://fonts.googleapis.com/css2?family=Carrois+Gothic&display=swap); /* 'Pataphysics Department Theme * [2018 Wikidot Theme] * Based on Aelanna's Sigma-9 Theme as Edited by Dr Devan * Inspired by Rimple's "Pataphysics Department" * Created by Lt Flops, Logo Designed by TSATPWTCOTTTADC, CSS Spinner by Woedenaz * With Code Help From Stormbreath **/ /* ---- COLOUR VARIABLES ---- */ body{ /* ---- GREY --- */ --very-dark-grey: hsl(0, 0%, 05%); --grey: hsl(0, 0%, 75%); --light-grey: hsl(0, 0%, 88%); --lighter-grey: hsl(0, 0%, 91%); --very-light-grey: hsl(0, 0%, 95%); /* ---- GOLD ---- */ --pure-yellow: hsl(51, 100%, 50%); --strong-orange: hsl(36, 67%, 49%); /* ---- GREEN ---- */ --vivid-lime-green: hsl(112, 77%, 48%); /* ---- BLUE ---- */ --dark-blue: hsl(253, 60%, 33%); /* ---- VIOLET ---- */ --very-dark-violet: hsl(268, 39%, 10%); --very-dark-moderate-violet: hsl(268, 40%, 25%); --dark-violet: hsl(266, 100%, 25%); --very-dark-muted-violet: hsl(268, 33%, 30%); --strong-violet: hsl(268, 100%, 37%); --dark-moderate-violet: hsl(268, 40%, 45%); --mostly-muted-dark-violet: hsl(268, 25%, 50%); /* ---- GRADIENT VIOLET ---- */ --grad-very-dark-muted-violet: hsl(268, 40%, 19%); --grad-dark-moderate-violet: hsl(268, 40%, 33%); /* ---- MAGENTA ---- */ --dark-magenta: hsl(298, 86%, 37%); } /* ---- CONTENT WRAP ---- */ div#container-wrap{ background: url(https://scp-wiki.wdfiles.com/local--files/theme%3Apataphysics/pataphysics-header-updated.png) top left repeat-x !important; } body{ color: hsl(0, 0%, 05%); color: var(--very-dark-grey); background-color: hsl(0, 0%, 95%); background-color: var(--very-light-grey); word-break: unset; } /* ---- LOGO IMAGE | [PRE] ---- */ #header{ background-image: none; } #header #header-extra-div-1, #header #header-extra-div-2, #header #header-extra-div-3{ width: 6.25rem; height: 6.25rem; display: flex; position: absolute; left: .25rem; top: 2rem; } /* 'Pataphysics Department Logo | [ANIMATION] * Logo Designed by TSATPWTCOTTTADC, CSS Spinner by Woedenaz * Released Under CC BY-SA 3.0 **/ #header #header-extra-div-1::before, #header #header-extra-div-2::before, #header #header-extra-div-3::before{ content: ""; width: 6.25rem; height: 6.25rem; position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain; flex: 1; } #header #header-extra-div-1::before{ z-index: 1; background-image: url("data:image/svg+xml,%3Csvg id='Layer_3' data-name='Layer 3' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bopacity:0.55;fill:url(%23linear-gradient);%7D.cls-2%7Bopacity:0.66;%7D.cls-3%7Bfill:%23fff;%7D%3C/style%3E%3ClinearGradient id='linear-gradient' x1='6.16' y1='32.16' x2='97.17' y2='66.71' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%238b8b8b'/%3E%3Cstop offset='1' stop-color='%23fff'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ctitle%3Epata_logo_bg%3C/title%3E%3Cpath class='cls-1' d='M50,93.82A43.11,43.11,0,0,1,34.88,91.1a44.63,44.63,0,0,1-7.72-3.77c-1.05-.65-2.49-1.65-3.46-2.39l-3.58,1.31-1.82.67a3.82,3.82,0,0,1-1.42.37c-1.17,0-1.17,0-3.4-3.82L9.54,76.66,2.79,65C1.31,62.4,1,61.81,1.7,60.78a12.07,12.07,0,0,1,1.72-1.67l3.06-2.83.59-.54C7,54.68,6.87,53.85,6.82,53c-.05-1.09-.05-3.59,0-4.62a26.26,26.26,0,0,1,.4-3.6h0c0-.1.07-.35.1-.61a43.11,43.11,0,0,1,26.07-33.3c.11-.64.27-1.56.45-2.62.35-2,.65-3.7.66-3.77l.39-1.74H61.58c2.42,0,3.42,0,3.87,1.48l0,.17c0,.07.22,1,.51,2.25l.35,1.55c.25,1.13.49,2.16.64,2.86a48.34,48.34,0,0,1,4.38,2.19,43.08,43.08,0,0,1,21.5,33.1,42.82,42.82,0,0,1-.11,9.94l.83.7c4.52,3.77,4.52,3.77,4.73,4.25l.35.81-.36.81c0,.11-.14.31-6.88,12-1.67,2.91-3.35,5.8-4.61,8-2.44,4.21-2.48,4.28-3.19,4.51A2.45,2.45,0,0,1,82,87.21L81.29,87l-.16,0-.64-.2-2.71-.84-2-.62a42.77,42.77,0,0,1-6.27,3.89,22.46,22.46,0,0,1-3.24,1.45l-.66.25A42.73,42.73,0,0,1,55.1,93.51,42.08,42.08,0,0,1,50,93.82ZM24.05,80.7a2.37,2.37,0,0,1,1.56.66,42.19,42.19,0,0,0,3.67,2.58,41.09,41.09,0,0,0,7,3.41,39.18,39.18,0,0,0,27.86-.19,9.74,9.74,0,0,1,1.07-.39c.28-.1,1.26-.55,2.48-1.16a38.42,38.42,0,0,0,5.71-3.54L75,80.87l1.29.39.27.09c.28.09,2.06.65,2.33.72s2.74.85,2.93.92l.2.06c2.36-4,9.49-16.39,11.88-20.57-.8-.68-1.9-1.59-2.9-2.42h0l-1.74-1.47a2.48,2.48,0,0,1-.56-2.38,38.28,38.28,0,0,0,.16-9.46,39.15,39.15,0,0,0-19.5-30,42.63,42.63,0,0,0-4.52-2.21,2.39,2.39,0,0,1-1.56-1.6h0c-.07-.3-.26-1.14-.86-3.84L62.1,7.52C62,7.24,62,7,61.92,6.75c-1.75,0-5.36,0-11.92,0H38.17c-.11.62-.24,1.38-.39,2.2-.68,4-.68,4-.88,4.31l-.12.18a2.87,2.87,0,0,1-1.52,1,39.15,39.15,0,0,0-24,30.34,7.85,7.85,0,0,1-.21,1.08c-.05.32-.18,1.52-.25,2.77-.05.89-.05,3.23,0,4.18s.12,1.64.25,2.72l.21,1.78-.91.85L9.19,59.22,6.13,62l-.27.25.4.69L13,74.66c2.08,3.6,3.8,6.57,4.76,8.2l1-.36C23.65,80.7,23.65,80.7,24.05,80.7Zm41.33,6h0ZM11.06,45.87,11,46Z'/%3E%3Cpath class='cls-2' d='M92.06,61.58l-1.59-1.33-.83-.69-.48-.4-.43-.36c-.2-.17-.46-.39-.56-.49L88,58.13l0-.28c.24-1.33.45-2.9.56-4.24a49.09,49.09,0,0,0,0-6A38.71,38.71,0,0,0,68.73,16.83a41.87,41.87,0,0,0-5-2.31c-.75-.29-.79-.32-.82-.43s-.17-.72-.33-1.45c-.34-1.48-1.29-5.55-1.32-5.66s-.6-.07-11.32-.07H38.67l0,.09-.4,2.27c-.52,3-.79,4.5-.83,4.67s-.06.14-.54.31A38.75,38.75,0,0,0,11.69,44.89a36.79,36.79,0,0,0-.42,6.55c0,.77,0,1.67,0,2a32.6,32.6,0,0,0,.46,3.88l.06.3-.28.27c-.15.15-.33.31-.39.36L10,59.39l-.39.35c-.12.11-.41.37-.62.58L8.28,61c-.15.14-.58.55-1,.9l-.83.79-.14.12L12,72.55c3.1,5.37,5.66,9.77,5.68,9.77s.36-.11.74-.25l2.05-.75,2.05-.76a17.06,17.06,0,0,1,1.8-.63l.2,0,.4.34a5,5,0,0,0,.45.37,2.14,2.14,0,0,1,.35.26,39,39,0,0,0,21.76,8.46c.93.07,4.05.07,5,0a38.84,38.84,0,0,0,11.78-2.66,39.67,39.67,0,0,0,6.62-3.39,2.93,2.93,0,0,1,.42-.24,32.77,32.77,0,0,0,3-2.17l.7-.56c.1-.08.11-.08.61.08l.81.24.37.11.28.09.27.08.46.15.63.19c.36.11,2.06.63,2.24.67l.82.25c.37.11.71.2.74.2s2.29-3.87,5.66-9.7c3.07-5.33,5.61-9.72,5.64-9.76S93.66,62.92,92.06,61.58Z'/%3E%3Cpath class='cls-3' d='M92.31,58.52,90.7,57.17c-.07-.07-.07-.09,0-.7a40.13,40.13,0,0,0,.17-9.93A41.17,41.17,0,0,0,70.38,15a48.54,48.54,0,0,0-4.76-2.33,1,1,0,0,1-.36-.2s-.4-1.76-.86-3.81-.86-3.78-.86-3.83S62.83,4.73,50,4.73H36.49l0,.12c0,.06-.31,1.74-.66,3.73s-.64,3.65-.65,3.68a4.59,4.59,0,0,1-.64.3A41.14,41.14,0,0,0,9.3,44.45c-.06.4-.13.78-.15.83a26.39,26.39,0,0,0-.33,3.2c-.05,1-.05,3.38,0,4.4s.13,1.77.26,2.86l.09.77L9,56.66,7.73,57.84,7,58.55l-2.19,2c-.76.7-1.39,1.3-1.41,1.32s.51,1,1.16,2.08l6.75,11.68c3.06,5.3,5.58,9.63,5.61,9.63l.73-.25,1.82-.67C23.11,83,24,82.7,24.05,82.7a1.32,1.32,0,0,1,.29.2,45.39,45.39,0,0,0,3.88,2.74,44.52,44.52,0,0,0,7.36,3.59A41.13,41.13,0,0,0,64.88,89l.84-.31a26.66,26.66,0,0,0,2.88-1.32,39,39,0,0,0,6-3.72l.81-.59.22.06.34.11,2.38.74,2.83.89.54.16.83.26a2.05,2.05,0,0,0,.43.11S96.5,62.06,96.49,62,95.67,61.32,92.31,58.52ZM93.5,62.9s-2.57,4.43-5.64,9.76c-3.37,5.83-5.63,9.7-5.66,9.7s-.37-.09-.74-.2l-.82-.25c-.18,0-1.88-.56-2.24-.67l-.63-.19-.46-.15L77,80.82l-.28-.09-.37-.11-.81-.24c-.5-.16-.51-.16-.61-.08l-.7.56a32.77,32.77,0,0,1-3,2.17,2.93,2.93,0,0,0-.42.24,39.67,39.67,0,0,1-6.62,3.39,38.84,38.84,0,0,1-11.78,2.66c-.93.07-4.05.07-5,0a39,39,0,0,1-21.76-8.46,2.14,2.14,0,0,0-.35-.26,5,5,0,0,1-.45-.37l-.4-.34-.2,0a17.06,17.06,0,0,0-1.8.63l-2.05.76-2.05.75c-.38.14-.71.25-.74.25s-2.58-4.4-5.68-9.77L6.34,62.77l.14-.12.83-.79c.39-.35.82-.76,1-.9L9,60.32c.21-.21.5-.47.62-.58l.39-.35,1.2-1.13c.06,0,.24-.21.39-.36l.28-.27-.06-.3a32.6,32.6,0,0,1-.46-3.88c0-.34,0-1.24,0-2a36.79,36.79,0,0,1,.42-6.55A38.75,38.75,0,0,1,36.88,14.25c.48-.17.5-.18.54-.31s.31-1.7.83-4.67L38.65,7l0-.09H50c10.72,0,11.29,0,11.32.07s1,4.18,1.32,5.66c.16.73.31,1.38.33,1.45s.07.14.82.43a41.87,41.87,0,0,1,5,2.31A38.71,38.71,0,0,1,88.54,47.57a49.09,49.09,0,0,1,0,6c-.11,1.34-.32,2.91-.56,4.24l0,.28.19.18c.1.1.36.32.56.49l.43.36.48.4.83.69,1.59,1.33C93.66,62.92,93.55,62.82,93.5,62.9Z'/%3E%3C/svg%3E"); animation: cont-spin 15s linear infinite; } #header #header-extra-div-2::before{ z-index: 3; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bopacity:0.46;%7D.cls-2%7Bfill:%23231f20;%7D.cls-3%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Epata_logo_mg%3C/title%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Cg class='cls-1'%3E%3Cpath class='cls-2' d='M50,23.78A26.31,26.31,0,0,1,75.86,45.07L79.79,45l-4.3,7.81-4.62-7.63,3.72-.08A25.07,25.07,0,0,0,50.65,25V35.92h6.43L50,48.16,42.94,35.92h6.42V24.42h0v-.64H50M50,45.6l4.85-8.4h-9.7L50,45.6m25.44,4.65,2.16-3.94-4.49.09,2.33,3.85M50,23.53h-.88V35.67H42.5l.22.38,7.06,12.23.22.38.22-.38,7.06-12.23.22-.38H50.89V25.3A24.7,24.7,0,0,1,74.28,44.85l-3.42.07h-.43l.23.37,4.62,7.63.22.37.21-.38L80,45.11l.21-.38h-.43l-3.73.07A26.64,26.64,0,0,0,50,23.53ZM45.58,37.45h8.84L50,45.1l-4.42-7.65Zm28,9.19,3.63-.07-1.75,3.18-1.88-3.11Z'/%3E%3Cpath class='cls-2' d='M39.26,27,35,34.79,33,31.61a25.06,25.06,0,0,0-5.4,30.76l9.43-5.44-3.22-5.56H48L40.92,63.61,37.71,58l-10,5.75h0l-.56.32-.31-.54a26.32,26.32,0,0,1,5.51-33l-2-3.36L39.26,27m-4.35,5.26,2.16-3.93-4.49.09,2.33,3.84m6,28.82,4.85-8.4h-9.7l4.85,8.4M39.69,26.71h-.43l-8.93.19H29.9l.23.37,1.92,3.18a26.66,26.66,0,0,0-5.4,33.22l.32.54.12.21.22-.12.35-.2.2-.12,9.75-5.62,3.09,5.35.22.38.22-.38L48.2,51.49l.22-.37h-15l.22.37,3.08,5.35-9,5.18A24.7,24.7,0,0,1,33,32l1.77,2.92.22.37.21-.38,4.3-7.82.21-.38ZM33,28.63l3.62-.07L34.9,31.73,33,28.63ZM36.5,52.9h8.83l-4.41,7.65L36.5,52.9Z'/%3E%3Cpath class='cls-2' d='M66.1,51.37l-3.21,5.56,10,5.76h0l.55.32-.31.54A26.33,26.33,0,0,1,41.72,75.31l-1.89,3.45-4.62-7.64,8.92-.18-1.79,3.25a25,25,0,0,0,29.33-10.7L62.25,58,59,63.61,52,51.37H66.1M59,61.05l4.85-8.4h-9.7L59,61.05M39.78,76.2l2.16-3.94-4.49.09,2.33,3.85M66.54,51.12h-15l.22.37,7.06,12.24.22.38.22-.38,3.08-5.35,9,5.2A24.81,24.81,0,0,1,42.7,74.05l1.65-3,.21-.38h-.44l-8.92.18h-.43l.22.37,4.62,7.63.23.38.21-.38,1.79-3.27A26.56,26.56,0,0,0,73.31,63.68l.31-.54.12-.22-.21-.12-.35-.2-.2-.12-9.75-5.64,3.09-5.35.22-.37ZM54.62,52.9h8.84L59,60.55,54.62,52.9ZM37.89,72.6l3.62-.08L39.76,75.7l-1.87-3.1Z'/%3E%3C/g%3E%3Cpath class='cls-3' d='M75.86,45.07A26.31,26.31,0,0,0,50,23.78h-.63v.64h0v11.5H42.94L50,48.16l7.07-12.24H50.64V25A25.07,25.07,0,0,1,74.59,45.09l-3.72.08,4.62,7.63L79.79,45Zm-21-7.87L50,45.6l-4.85-8.4Zm20.59,13L73.11,46.4l4.49-.09Z'/%3E%3Cpath class='cls-3' d='M33.85,51.37l3.22,5.56-9.43,5.44A25.06,25.06,0,0,1,33,31.61L35,34.79,39.26,27l-8.92.19,2,3.36a26.32,26.32,0,0,0-5.51,33l.31.54.56-.32h0l10-5.75,3.21,5.57L48,51.37ZM37.07,28.3l-2.16,3.93-2.33-3.84Zm-1,24.35h9.7l-4.85,8.4Z'/%3E%3Cpath class='cls-3' d='M72.85,62.7h0l-10-5.76,3.21-5.56H52L59,63.61,62.25,58l9.42,5.45a25,25,0,0,1-29.33,10.7l1.79-3.25-8.92.18,4.62,7.64,1.89-3.45A26.32,26.32,0,0,0,73.09,63.56L73.4,63ZM39.78,76.2l-2.33-3.85,4.49-.09ZM59,61.05l-4.85-8.4h9.7Z'/%3E%3C/g%3E%3C/svg%3E"); animation: clock-spin cubic-bezier(.62, 0, .52, 1.3) 10s infinite; } #header #header-extra-div-3::before{ z-index: 3; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E.cls-1,.cls-3%7Bfill:%23fff;%7D.cls-1,.cls-2%7Bopacity:0.3;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Epata_logo_fg%3C/title%3E%3Cg id='Layer_1' data-name='Layer 1'%3E%3Cpath class='cls-1' d='M80.79,63.91,77,61.72a29.13,29.13,0,0,0,2.33-11.44A29.42,29.42,0,0,0,53.44,21.11V16.92h-7v4.19A29.38,29.38,0,0,0,22.93,61.84L19.2,64l3.5,6.07,3.74-2.16a29.36,29.36,0,0,0,47.08-.11L77.29,70ZM49.94,72.66a22.36,22.36,0,0,1-17.38-8.3l6.57-3.82,1.78,3.06L48,51.37H33.85l1.8,3.13-6.6,3.81A22.39,22.39,0,0,1,46.44,28.17v7.75H42.93L50,48.16l7.07-12.24H53.44V28.17a22.37,22.37,0,0,1,17.44,30l-6.54-3.78,1.75-3H52L59,63.6l1.81-3.13,6.56,3.79A22.34,22.34,0,0,1,49.94,72.66Z'/%3E%3Cg class='cls-2'%3E%3Cpath class='cls-3' d='M53.19,17.17v4.16l.22,0A29.12,29.12,0,0,1,76.77,61.63l-.08.2.19.11L80.45,64,77.2,69.63l-3.56-2-.19-.11-.13.17A29.3,29.3,0,0,1,49.94,79.41a28.94,28.94,0,0,1-23.3-11.66l-.13-.18-.19.11-3.53,2-3.25-5.63,3.52-2,.19-.12-.09-.2A29.13,29.13,0,0,1,46.47,21.35l.22,0V17.17h6.5m3.43,19L50,47.66,43.36,36.17h3.33v-8.3l-.29.05A22.63,22.63,0,0,0,28.82,58.4l.11.27.25-.15,6.49-3.87.21-.13-.12-.21-1.49-2.69H47.54L40.91,63.1l-1.56-2.69-.13-.22-.22.13-6.56,3.83-.25.14.18.23a22.6,22.6,0,0,0,35.23-.1l.18-.23-.25-.14L61,60.26l-.21-.13-.13.22L59,63.1,52.4,51.62H65.66l-1.54,2.67L64,54.5l.21.13,6.54,3.77.26.15.1-.27A22.61,22.61,0,0,0,53.48,27.92l-.29-.05v8.3h3.43M53.44,16.92h-7v4.19A29.38,29.38,0,0,0,22.93,61.84L19.2,64l3.5,6.07,3.74-2.16a29.36,29.36,0,0,0,47.08-.11L77.29,70l3.5-6.06L77,61.72a29.13,29.13,0,0,0,2.33-11.44A29.42,29.42,0,0,0,53.44,21.11V16.92ZM50,48.16l7.07-12.24H53.44V28.17a22.37,22.37,0,0,1,17.44,30l-6.54-3.78,1.75-3H52L59,63.6l1.81-3.13,6.56,3.79a22.35,22.35,0,0,1-34.84.1l6.57-3.82,1.78,3.06L48,51.37H33.85l1.7,3.06-6.5,3.88A22.39,22.39,0,0,1,46.44,28.17v7.75H42.93L50,48.16Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); animation: clock-spin cubic-bezier(.62, 0, .52, 1.3) 10s infinite; } /* ---- ANIMATION ---- */ @keyframes clock-spin{ 0%, 15%{ transform: rotate(0deg); } 25%, 40%{ transform: rotate(90deg); } 50%, 65%{ transform: rotate(180deg); } 75%, 90%{ transform: rotate(270deg); } 100%{ transform: rotate(360deg); } } @keyframes cont-spin{ from{ transform: rotate(0deg); } to{ transform: rotate(360deg); } } /* ---- MOBILE ANIMATION ---- */ @media (max-width: 767px){ #header{ background: none !important; } #header #header-extra-div-1, #header #header-extra-div-2, #header #header-extra-div-3{ width: 5rem !important; height: 5rem !important; left: -1rem !important; top: 3rem !important; } #header #header-extra-div-1::before, #header #header-extra-div-2::before, #header #header-extra-div-3::before{ width: 5rem !important; height: 5rem !important; } } /* ---- GENERAL ---- */ span, a{ word-break: unset; } hr{ height: 0; margin: 1em 0; background-color: transparent; border-top: 1px solid hsl(0, 0%, 62%); } table.wiki-content-table{ background-color: white; } table.wiki-content-table th{ background-color: hsl(0, 0%, 88%); background-color: var(--light-grey); } /* ---- LINKS ---- */ a{ color: hsl(268, 100%, 37%); color: var(--strong-violet); } a:visited{ color: hsl(253, 60%, 33%); color: var(--dark-blue); } #side-bar a:visited{ color: hsl(268, 100%, 37%); color: var(--strong-violet); } a.newpage{ color: hsl(298, 86%, 47%); color: var(--dark-magenta); } a.footnoteref, a.footnoteref:before{ color: hsl(307, 100%, 37%); color: var(--dark-magenta); } a.collapsible-block-link{ font-weight: bold; } .pata-notice a{ /* ---- PATA-NOTICE LINK COLOUR ---- */ color: hsl(51, 100%, 50%); color: var(--pure-yellow); } .pata-notice a:visited{ color: hsl(36, 67%, 49%); color: var(--strong-orange); } .pata-notice a.footnoteref, /* ---- PATA-NOTICE FOOTNOTE COLOUR ---- */ .pata-notice a.footnoteref:before{ color: hsl(51, 100%, 50%); color: var(--pure-yellow); } /* ---- HEADER ---- */ h1, h2, h3, h4, h5, h6{ word-break: unset; } h1, #page-title{ color: hsl(266, 100%, 25%); color: var(--dark-violet); } #header h1 a, #header h1 a::before{ position: relative; left: -1.5px; letter-spacing: -.02em; } #header h1 a{ color: transparent; font-family: "Carrois Gothic", "Arial", sans-serif; text-shadow: none; } #header h1 a::before{ content: "‘Pataphysics Department"; color: hsl(0, 0%, 91%); color: var(--lighter-grey); text-shadow: 1px 1px 1px hsl(0, 0%, 05%); text-shadow: 1px 1px 1px var(--very-dark-grey); } #header span{ color: hsl(0, 0%, 91%); color: var(--lighter-grey); } #header h2 span{ color: transparent; text-shadow: none; } #header h1 a span{ content: ""; visibility: hidden; } #header h2 span::before{ content: "Killing Our Gods"; color: hsl(0, 0%, 91%); color: var(--lighter-grey); text-shadow: 1px 1px 1px hsl(0, 0%, 05%); text-shadow: 1px 1px 1px var(--very-dark-grey); text-shadow: 1px 1px 1px hsla(0, 0%, 5%, .8); } @media only screen and (max-width: 425px){ #header h1 a::before{ content: "‘Pataphysics Dept."; } } /* ---- TOP MENU ---- */ #top-bar ul li ul{ border: solid 1px hsl(268, 40%, 25%); border: solid 1px var(--very-dark-moderate-violet); } #top-bar a{ color: hsl(0, 0%, 91%); color: var(--lighter-grey); } #login-status ul a{ color: hsl(268, 100%, 37%); color: var(--strong-violet); } #top-bar ul .sfhover a, #top-bar ul li:hover a{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); background: hsl(0, 0%, 95%); background: var(--very-light-grey); } #my-account, #account-topbutton{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); } /* ---- SEARCH BAR ---- */ #search-top-box-input{ background-color: hsl(268, 40%, 25%); background-color: var(--very-dark-moderate-violet); border: solid 1px hsl(268, 33%, 30%); border: solid 1px var(--very-dark-muted-violet); border-radius: 0; } #search-top-box-input:hover, #search-top-box-input:focus{ background: hsl(268, 25%, 50%); background: var(--mostly-muted-dark-violet); border: solid 1px hsl(0, 0%, 95%); border: solid 1px var(--very-light-grey); border-radius: 0; } #search-top-box-form input[type="submit"]{ color: hsl(270, 75%, 76%); background: hsl(268, 33%, 30%); background: var(--very-dark-muted-violet); border: solid 1px hsl(268, 40%, 45%); border: solid 1px var(--dark-moderate-violet); border-radius: 0; box-shadow: none; font-size: unset; } #search-top-box-form input[type="submit"]:hover, #search-top-box-form input[type="submit"]:focus{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); background: hsl(268, 25%, 50%); background: var(--mostly-muted-dark-violet); border: solid 1px hsl(0, 0%, 95%); border: solid 1px var(--very-light-grey); border-radius: 0; box-shadow: none; } /* ---- SIDE MENU ---- */ #side-bar{ background: none; } #side-bar .side-block{ background: hsl(0, 0%, 91%); background: var(--lighter-grey); border: 3px solid hsl(268, 40%, 25%); border: 3px solid var(--very-dark-moderate-violet); border-radius: 0; box-shadow: none; } #side-bar .heading{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); border-bottom: 1px solid hsl(268, 40%, 45%); border-bottom: 1px solid var(--dark-moderate-violet); } .side-block .menu-item > .image{ filter: hue-rotate(268deg) saturate(90%) brightness(100%); -webkit-filter: hue-rotate(268deg) saturate(90%) brightness(100%); } #side-bar div.menu-item.inactive a{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); } #side-bar div.menu-item .sub-text{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); } #side-bar .collapsible-block-folded{ background: none; } #side-bar .collapsible-block-unfolded-link{ border-bottom: solid 1px hsl(268, 40%, 25%); border-bottom: solid 1px var(--very-dark-moderate-violet); } #side-bar .collapsible-block-unfolded-link .collapsible-block-link{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); font-weight: bold; } /* ---- INFO BAR ---- */ body{ --linkColour: hsl(0, 0%, 95%); --linkColour: var(--very-light-grey); --barColour: hsl(268, 39%, 10%); --barColour: var(--very-dark-violet); } /* ---- INFO PANE ---- */ .rate-box-with-credit-button{ background-color: hsl(268, 40%, 25%) !important; background-color: var(--very-dark-moderate-violet) !important; border-color: hsl(268, 40%, 25%) !important; border-color: var(--very-dark-moderate-violet) !important; border-radius: 0 !important; box-shadow: none !important; } .rate-box-with-credit-button .fa-info{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); border-color: hsl(268, 40%, 45%); border-color: var(--dark-moderate-violet); } .rate-box-with-credit-button .fa-info:hover{ color: hsl(112, 77%, 48%); color: var(--vivid-lime-green); } .rate-box-with-credit-button .cancel{ border: 0; } .close-credits, .credit-back{ filter: hue-rotate(268deg); } .modalbox{ box-shadow: 0 1px 10px hsla(282, 73%, 51%, .3); } /* ---- PAGE RATING ---- */ .page-rate-widget-box{ border: none; border-radius: 0; box-shadow: none; } .page-rate-widget-box .rate-points{ background-color: hsl(268, 40%, 25%) !important; background-color: var(--very-dark-moderate-violet) !important; border: solid 1px hsl(268, 33%, 30%); border: solid 1px var(--very-dark-muted-violet); border-radius: 0; } .page-rate-widget-box .rateup, .page-rate-widget-box .ratedown{ background-color: hsl(0, 0%, 95%); background-color: var(--very-light-grey); border-top: solid 1px hsl(268, 33%, 30%); border-top: solid 1px var(--very-dark-muted-violet); border-bottom: solid 1px hsl(268, 33%, 30%); border-bottom: solid 1px var(--very-dark-muted-violet); } .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a{ color: hsl(268, 40%, 25%); color: var--very-dark-moderate-violet); } .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .ratedown a:hover{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); background: hsl(268, 40%, 25%); background: var(--very-dark-moderate-violet); } .page-rate-widget-box .cancel{ background-color: hsl(268, 40%, 25%); background-color: var(--very-dark-moderate-violet); border: solid 1px hsl(268, 33%, 30%); border: solid 1px var(--very-dark-muted-violet); border-left: 0; border-radius: 0; } .page-rate-widget-box .cancel a{ color: hsl(268, 40%, 45%); color: var(--dark-moderate-violet); } .page-rate-widget-box .cancel a:hover{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); background: hsl(268, 40%, 25%); background: var(--very-dark-moderate-violet); border-radius: 0; } /* ---- DIV BLOCKS ---- */ blockquote, div.blockquote{ background-color: hsl(0, 0%, 91%); background-color: var(--lighter-grey); border: 1px solid hsl(0, 0%, 60%); } .pata-notice{ margin: 1em 0; padding: 0 1em; color: hsl(0, 0%, 95%); color: var(--very-light-grey); background-color: hsl(268, 40%, 25%); background-color: var(--very-dark-moderate-violet); border: 1px solid hsl(268, 33%, 30%); border: 1px solid var(--very-dark-muted-violet); text-align: center; } .code{ background-color: hsl(0, 0%, 92%); border-color: hsl(0, 0%, 82%); } /* ---- CUSTOM PAGE CONTENT CLASSES ---- */ .content-panel .panel-body{ background: hsl(0, 0%, 95%); background: var(--very-light-grey); } .content-panel .panel-footer{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); } .content-panel .panel-footer a{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); } /* ---- YUI TAB CUSTOMIZATION ---- */ .yui-navset .yui-content{ /* ---- Content Background ---- */ background-color: white; /* -------- */ } .yui-navset .yui-nav a, /* ---- Link Modifier ---- */ .yui-navset .yui-navset-top .yui-navset-left .yui-navset-right .yui-nav a{ color: hsl(0, 0%, 05%); color: var(--very-dark-grey); /* ---- Tab Background Colour | [UNSELECTED] ---- */ background-color: white; /* -------- */ background-image: none; border: solid 1px #808080; border-bottom: none; transition: .125s; } .yui-navset .yui-nav .selected a, /* ---- Selection Modifier ---- */ .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:hover{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); /* ---- Tab Background Colour | [SELECTED] ---- */ background: hsl(268, 40%, 25%); background: var(--very-dark-moderate-violet); /* -------- */ } .yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus{ /* ---- Tab Background Colour | [HOVER] ---- */ background: hsl(0, 0%, 75%); background: var(--grey); /* -------- */ } .yui-navset .yui-nav, /* ---- Between Tab And Content ---- */ .yui-navset .yui-navset-top .yui-nav{ border-color: hsl(268, 40%, 25%); border-color: var(--very-dark-moderate-violet); } /* ---- STANDARD IMAGE BLOCK ---- */ .scp-image-block{ box-shadow: none; } .scp-image-block .scp-image-caption{ background-color: hsl(0, 0%, 88%); background-color: var(--light-grey); border-top: solid 1px hsl(268, 40%, 25%); border-top: solid 1px var(--very-dark-moderate-violet); } /* ---- INTERWIKI ---- */ .scpnet-interwiki-frame{ filter: hue-rotate(268deg) saturate(90%) brightness(100%); } /* ---- ADJUST MOBILE IMAGE SIZE ---- */ @media (max-width: 767px){ #top-bar .open-menu a { color: hsl(268, 40%, 25%) ; color: var(--very-dark-moderate-violet); background-color: white; border: 2px solid hsl(268, 40%, 25%); border: 2px solid var(--very-dark-moderate-violet); } #side-bar{ background-color: hsl(0, 0%, 75%); background-color: var(--grey); } #side-bar:target + #main-content{ left: 0; } } @media (min-width: 768px){ #header h1 a{ font-size: 150%; } } /* ---- REDUCED MOTION ACCESSIBILITY ---- * By SMLT **/ @media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; } }
| korbkorv |
|---|
| Author: |
| Published on 17 Apr 2019 22:55 |
/* source: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1 */ #top-bar .open-menu a { position: fixed; top: 0.5em; left: 0.5em; z-index: 5; font-family: 'Nanum Gothic', san-serif; font-size: 30px; font-weight: 700; width: 30px; height: 30px; line-height: 0.9em; text-align: center; border: 0.2em solid #888; background-color: #fff; border-radius: 3em; color: #888; } @media (min-width: 768px) { .mobile-top-bar { display: block; } .mobile-top-bar li { display: none; } #main-content { max-width: 708px; margin: 0 auto; padding: 0; transition: max-width 0.2s ease-in-out; } #side-bar { display: block!important; position: fixed; top: 0; left: -19em; width: 17em; height: 100%; margin: 0; overflow-y: auto; z-index: 10; padding: 0.3em 0.675em; background-color: rgba(0,0,0,0.1); transition: left 0.5s ease-in-out; } #side-bar:target { display: block; left: 0; width: 17em; margin: 0; z-index: 10; } #side-bar:target .close-menu { display: block; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; } #top-bar .open-menu a:hover { text-decoration: none; } .close-menu { margin-left: 19em; opacity: 0; } }
What this is
A bunch of miscellaneous CSS 'improvements' that I, Croquembouche, use on a bunch of pages because I think it makes them easier to deal with.
The changes this component makes are bunch of really trivial modifications to ease the writing experience and to make documenting components/themes a bit easier (which I do a lot). It doesn't change anything about the page visually for the reader — the changes are for the writer.
I wouldn't expect translations of articles that use this component to also use this component, unless the translator likes it and would want to use it anyway.
This component probably won't conflict with other components or themes, and even if it does, it probably won't matter too much.
Usage
On any wiki:
[[include :scp-wiki:component:croqstyle]]
This component is designed to be used on other components. When using on another component, be sure to add this inside the component's [[iftags]] block, so that users of your component are not forced into also using Croqstyle.
Related components
Other personal styling components (which change just a couple things):
Personal styling themes (which are visual overhauls):
CSS changes
Reasonably-sized footnotes
Stops footnotes from being a million miles wide, so that you can actually read them.
.hovertip { max-width: 400px; }
Monospace edit/code
Makes the edit textbox monospace, and also changes all monospace text to Fira Code, the obviously superior monospace font.
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap'); :root { --mono-font: "Fira Code", Cousine, monospace; } #edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); } .code pre * { white-space: pre; } .code *, .pre * { font-feature-settings: unset; }
Teletype backgrounds
Adds a light grey background to <tt> elements ({{text}}), so code snippets stand out more.
tt { background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4); font-size: 85%; padding: 0.2em 0.4em; margin: 0; border-radius: 6px; }
No more bigfaces
Stops big pictures from appearing when you hover over someone's avatar image, because they're stupid and really annoying and you can just click on them if you want to see the big version.
.avatar-hover { display: none !important; }
Breaky breaky
Any text inside a div with class nobreak has line-wrapping happen between every letter.
.nobreak { word-break: break-all; }
Code colours
Add my terminal's code colours as variables. Maybe I'll change this to a more common terminal theme like Monokai or something at some point, but for now it's just my personal theme, which is derived from Tomorrow Night Eighties.
Also, adding the .terminal class to a fake code block as [[div class="code terminal"]] gives it a sort of pseudo-terminal look with a dark background. Doesn't work with [[code]], because Wikidot inserts a bunch of syntax highlighting that you can't change yourself without a bunch of CSS. Use it for non-[[code]] code snippets only.
Quick tool to colourise a 'standard' Wikidot component usage example with the above vars: link
:root { --c-bg: #393939; --c-syntax: #e0e0e0; --c-comment: #999999; --c-error: #f2777a; --c-value: #f99157; --c-symbol: #ffcc66; --c-string: #99cc99; --c-operator: #66cccc; --c-builtin: #70a7df; --c-keyword: #cc99cc; } .terminal, .terminal > .code { color: var(--c-syntax); background: var(--c-bg); border: 0.4rem solid var(--c-comment); border-radius: 1rem; }
Debug mode
Draw lines around anything inside .debug-mode. The colour of the lines is red but defers to CSS variable --debug-colour.
You can also add div.debug-info.over and div.debug-info.under inside an element to annotate the debug boxes — though you'll need to make sure to leave enough vertical space that the annotation doesn't overlap the thing above or below it.
…like this!
.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after { outline: 1px solid var(--debug-colour, red); position: relative; } .debug-info { position: absolute; left: 50%; transform: translateX(-50%); font-family: 'Fira Code', monospace; font-size: 1rem; white-space: nowrap; } .debug-info.over { top: -2.5rem; } .debug-info.under { bottom: -2.5rem; } .debug-info p { margin: 0; }
@import url(https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap); @import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&display=swap); @import url(https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap); /* Flopstyle CSS Theme * [2020 Wikidot Theme] * Created by Lt Flops * Select CSS Styles Are Credited Where Necessary * -- (CC BY-SA 3.0) -- **/ /* -------- SITE HEADER -------- */ a, body, span{ word-break: unset; } #header h1 a, #header h1 a::before{ color: hsl(0, 0%, 93%); text-shadow: none; } #header h1 a{ font-family: "Montserrat", "Arial", sans-serif; font-size: 170%; letter-spacing: 0; } #header h2 span, #header h2 span::before{ color: hsl(60, 62%, 85%); font-family: "Montserrat", "Arial", sans-serif; font-weight: 500; text-shadow: none; } /* -------- TOP-BAR -------- */ #search-top-box, #top-bar, #login-status{ right: 0; } #search-top-box-form input[type="submit"]{ font-size: unset; } #search-top-box-input, #search-top-box-form input[type=submit]{ background: hsl(0, 0%, 20%); border-color: hsl(0, 0%, 60%); border-radius: 0; } #search-top-box-input:hover, #search-top-box-input:focus, #search-top-box-form input[type="submit"]:hover, #search-top-box-form input[type="submit"]:focus{ background-color: hsl(0, 0%, 30%); border-color: hsl(0, 0%, 70%); } #top-bar .open-menu a{ border-radius: unset; border-width: .1em; } /* -------- SIDE-BAR -------- */ #side-bar{ background-color: hsl(0, 0%, 50%); } #side-bar:target{ box-shadow: 0 0 90px 90px hsla(0, 0%, 0%, .3); } #side-bar .side-block{ border-color: hsl(0, 0%, 20%); border-radius: 0; } #side-bar .heading{ color: hsl(0, 0%, 5%); border-bottom: solid 1px hsl(0, 0%, 20%); } /* -------- SIDEBOXES -------- * By EstrellaYoshte * Adapted From 'Penumbra Theme' **/ .flavourText{ margin: auto; margin-bottom: .5em; padding: .25em; border: 1px solid #888; } #page-content .authorbox tr td, #page-content .sidebox tr td, #page-content .authorbox tr th, #page-content .sidebox tr th{ padding: .25em; } #page-content .authorbox tr td, #page-content .authorbox tr th, #page-content .authorbox .flavourText{ width: 15.234em; } .limit{ margin-bottom: -1rem; line-height: 141%; z-index: 5; } .limit br{ display: block; } .anchor{ position: sticky; height: 0; top: 0; z-index: 5; } .authorbox, .sidebox{ position: absolute; width: calc((100vw - 870px) / 2); max-height: calc(100vh - 18rem); margin: 0 8px 0 0; padding: .14rem; box-sizing: border-box; overflow: auto; z-index: 5; } .authorbox{ max-width: calc((100vw - 921.2px) / 2) !important; top: .5em; right: 103.5%; } .sidebox{ top: -1em; left: 103.5%; padding-left: 1em; background: hsl(0, 0%, 100%); border: 1px solid hsl(0, 0%, 73%); border-left: 8px solid var(--accentColor); } /* -------- Sidebox Mobile Optimization Courtesy of Woedenaz -------- */ @media (max-width: 1079px){ .sidebox{ width: auto; max-width: 65vw !important; top: .75rem; right: calc(((100vw - 45.8rem) / 2) * -1); left: initial; padding: 0 .4rem; background-color: var(--accentColor); border: 1px solid hsl(0, 0%, 73%); border-left: 8px solid var(--accentColor); border-radius: 0; overflow: visible; -webkit-clip-path: inset(-.125rem -.25rem 0 calc(100% - 1.275rem)); clip-path: inset(-.125rem -.25rem 0 calc(100% - 1.275rem)); -webkit-transition: color .2s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s; transition: color .2s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s; -o-transition: color .2s ease-in-out .1s, box-shadow .5s ease-in-out .1s, clip-path .5s ease-in-out .1s; transition: color .2s ease-in-out .1s, box-shadow .5s ease-in-out .1s, clip-path .5s ease-in-out .1s; transition: color .2s ease-in-out .1s, box-shadow .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s; } .sidebox::before, .sidebox::after{ content: " "; position: absolute; right: 0; } .sidebox::before{ width: 0; height: 0; top: calc(50% - .75rem); border-top: .75rem solid transparent; border-bottom: .75rem solid transparent; border-right: .75rem solid var(--accentColor); z-index: 10; transition: border .1s ease-in-out .1s; } .sidebox::after{ width: 100%; max-width: .75rem; height: 100%; max-height: calc(100vh - 18rem); top: 0; background-color: hsl(0, 0%, 100%); z-index: -1; transition: box-shadow .5s ease-in-out .1s, max-width .5s ease-in-out .1s; } .sidebox > *{ opacity: 0; -webkit-transition: opacity .2s ease-in-out .2s; -o-transition: opacity .2s ease-in-out .2s; transition: opacity .2s ease-in-out .2s; } .sidebox:hover{ overflow: visible; -webkit-clip-path: inset(-.125rem -.25rem 0 0); clip-path: inset(-.125rem -.25rem 0 0); -webkit-transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s; transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s; -o-transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, box-shadow .5s ease-in-out .1s; transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, box-shadow .5s ease-in-out .1s; transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s; } .sidebox:hover::before{ border-top: 0 solid transparent; border-bottom: 0 solid transparent; } .sidebox:hover::after{ max-width: 100%; right: 0; } .sidebox:hover > *{ opacity: 1; } } @media (max-width:768px){ .sidebox, .sidebox:hover{ right: calc(((100vw - (100% - 3rem)) / 2) * -1 + 1rem); } } @media (max-width: 1079px){ .authorbox{ display: none; visibility: hidden; } } /* -------- GENERAL -------- */ :root{ --accentColor: hsl(0, 100%, 30%); --vivid-lime-green: hsl(112, 77%, 48%); } body{ color: hsl(0, 0%, 5%); word-break: unset; } #search-top-box-input, #search-top-box-input:hover, #search-top-box-input:focus, #search-top-box-form input[type=submit], #search-top-box-form input[type=submit]:hover, #search-top-box-form input[type=submit]:focus, #top-bar ul li ul, #side-bar .side-block, .page-rate-widget-box, .scp-image-block{ box-shadow: none; } /* -------- INFO BAR -------- */ body{ --barColour: hsl(0, 89%, 18%); } .u-faq{ display: none; } .info-container .collapsible-block-content{ padding: 0 .5em 30px; } .info-container .collapsible-block-content .wiki-content-table, .footer-wikiwalk-nav .collapsible-block .wiki-content-table{ width: 90%; } /* -------- INFO PANE -------- */ .creditRate{ margin-right: 0 !important; } .rate-box-with-credit-button{ border-radius: 0 !important; box-shadow: none !important; } .creditButton p a:hover, .creditButtonStandalone p a:hover{ color: var(--vivid-lime-green) !important; } div.credit.first .wiki-content-table { width: 100%; } /* -------- PAGE RATING -------- */ .page-rate-widget-box{ margin-right: 0; } .page-rate-widget-box, .page-rate-widget-box .rate-points{ border-radius: 0; } .page-rate-widget-box .cancel, .page-rate-widget-box .cancel a:hover{ border-radius: 0 !important; } /* -------- FORMATTING | [GENERAL] -------- */ #page-content h1, #page-content h2, #page-content h3, #page-content h4, #page-content h5, #page-content h6{ display: flex; flex-direction: column; justify-content: center; margin-bottom: .57em; text-align: center; word-break: unset; } hr{ height: 0; margin: 1em 0; background-color: transparent; border-top: 1px solid hsl(0, 0%, 67%); } .collapsible-block-link{ font-size: 120%; font-weight: bold; } .info-container .collapsible-block-link{ font-size: 100%; } ol li{ margin: 0 0 1em; } ul{ margin:1em 0; } .footnotes-footer, .bibitems{ padding: 0 0 .5em; } /* -------- IMAGE BLOCK -------- */ .scp-image-block .scp-image-caption{ font-size: 95%; } .scp-image-block.block-right{ margin: 0 0 1em 2em; } /* -------- CUSTOM DIV BLOCKS -------- */ .raisa-header, .pink-header, .oracle-header{ margin-bottom: 1em; padding: 0 .5em; text-align: center; } .raisa-header{ /* ---- RAISA Notice Header ---- */ background: hsl(60, 65%, 85%); border: 1px solid hsl(0, 0%, 60%); } .pink-header{ /* ---- Pretty Header ---- */ background: hsl(350, 100%, 85%); border: 1px solid hsl(0, 4%, 36%); } .pink-header hr{ border-color: hsl(0, 4%, 36%); } .oracle-header{ /* ---- SPC's 'From the Desk of ORACLE' Header ---- */ color: hsl(208, 100%, 97%); background: hsl(208, 67%, 44%); border: 2px solid hsl(0, 0%, 5%); } .oracle-header hr{ border-color: hsl(208, 100%, 97%); } .img-resize img{ /* ---- Header Icons (See Example Formatting) ---- */ float: left; width: auto; height: 8em; margin: .5em; } blockquote, /* ---- Regular Quote Block ---- */ div.blockquote{ background-color: hsl(0, 0%, 96%); border: 3px double hsl(0, 0%, 60%); } .alt-blockquote{ /* ---- Alternative Quote Block ---- */ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 96%); border: 1px solid hsl(0, 0%, 60%); border-radius: 1em; } .lightweight{ /* ---- Lightweight Quote Block ---- */ margin: 1em 3em; padding: 0 1em; background-color: hsl(0, 0%, 90%); text-align: left; } .card-block{ /* ---- Decorative Quote Block ---- */ margin: 1em 0; padding: .6em 1.2em; background: hsl(220, 15%, 93%); border-left: 8px solid var(--accentColor); border-radius: .48em; } blockquote hr, div.blockquote hr, .alt-blockquote hr, .lightweight hr, .card-block hr{ border-color: hsl(0, 0%, 67%); } .log-header{ /* ---- Interview/Exploration Log Header ---- */ margin-bottom: 1em; padding: 0 1em; background: hsl(0, 0%, 96%); border: 3px dashed hsl(0, 0%, 60%); border-radius: 2em; } .report-box{ /* ---- Report Block ---- */ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 100%); border: medium solid hsl(0, 0%, 5%); } .report-box hr{ border-color: hsl(0, 0%, 5%); } .realistic-shadow{ /* ---- Better Shadows ---- */ margin: 1em 0 2em 0; box-shadow: 0 1px 1px hsla(0, 0%, 0%, .23), 0 2px 2px hsla(0, 0%, 0%, .18), 0 4px 4px hsla(0, 0%, 0%, .15), 0 8px 8px hsla(0, 0%, 0%, .13); } .report-box.red-tint{ /* ---- Alternative Report Block Variants ---- */ background-color: hsl(360, 91%, 86%); border-color: hsl(360, 62%, 66%); } .report-box.red-tint hr{ border-color: hsl(360, 62%, 66%); } .report-box.orange-tint{ background-color: hsl(30, 91%, 86%); border-color: hsl(30, 62%, 66%); } .report-box.orange-tint hr{ border-color: hsl(30, 62%, 66%); } .report-box.yellow-tint{ background-color: hsl(60, 91%, 86%); border-color: hsl(60, 62%, 66%); } .report-box.yellow-tint hr{ border-color: hsl(60, 62%, 66%); } .report-box.green-tint{ background-color: hsl(120, 91%, 86%); border-color: hsl(120, 62%, 66%); } .report-box.green-tint hr{ border-color: hsl(120, 62%, 66%); } .report-box.cyan-tint{ background-color: hsl(180, 91%, 86%); border-color: hsl(180, 62%, 66%); } .report-box.cyan-tint hr{ border-color: hsl(180, 62%, 66%); } .report-box.blue-tint{ background-color: hsl(240, 91%, 86%); border-color: hsl(240, 62%, 66%); } .report-box.blue-tint hr{ border-color: hsl(240, 62%, 66%); } .report-box.magenta-tint{ background-color: hsl(300, 91%, 86%); border-color: hsl(300, 62%, 66%); } .report-box.magenta-tint hr{ border-color: hsl(300, 62%, 66%); } .report-box.grey-tint{ background-color: hsl(210, 9%, 86%); border-color: hsl(210, 15%, 42%); } .report-box.grey-tint hr{ border-color: hsl(210, 15%, 42%); } div.o5-box{ /* ---- Overseer Document Block ---- */ margin: 1em 6em; padding: 0 1em; background-color: hsl(0, 0%, 75%); border: medium solid hsl(0, 0%, 5%); } div.o5-box hr{ border-color: hsl(0, 0%, 5%); } .faux-source{ /* ---- Mimics "Page Source" Appearance ---- */ margin-bottom: 1em; padding: 0 2em; background-color: hsl(0, 0%, 100%); border: 1px dashed hsl(0, 0%, 67%); font-family: var(--mono-font); } .narration{ /* ---- Mimics the Pages of a Book ---- */ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 100%); border: 1px solid hsl(0, 0%, 63%); } .warning-notice{ /* ---- Simple Warning Block (Adapted From 'SCP-3143') ---- */ padding: 0 1em; background-color: hsl(0, 0%, 100%); background-image: url(https://scp-wiki.wdfiles.com/local--files/scp-style-resource/scp_trans.png); background-position: center; background-repeat: no-repeat; border: medium solid hsl(0, 0%, 5%); text-align: center; } .warning-notice hr{ border-color: hsl(0, 0%, 5%); } .journal{ /* ---- Journal Block (Adapted From 'SCP-4003') ---- */ margin: 1em 0; padding: .9em; background-image: linear-gradient(to top, hsl(201, 33%, 84%) 0%, hsl(60, 29%, 89%) 8%); background-position: 0 8px; background-size: 100% 1.3rem; border: 1px solid hsl(0, 0%, 80%); border-radius: .9em; font-family: "Architects Daughter", cursive; } .journal p{ margin: 0; font-size: 1.3rem; line-height: 1.3rem; } .sms-message{ /* ---- SMS Message Block ---- */ float: left; clear: left; width: 22.4em; margin: 0 0 1em; padding: 0 1.2em; background: hsl(0, 0%, 75%); border-radius: 2em; font-size: 112.5%; text-align: center; } blockquote .collapsible-block-folded, .alt-blockquote .collapsible-block-folded, .lightweight .collapsible-block-folded, .card-block .collapsible-block-folded, .report-box .collapsible-block-folded, .o5-box .collapsible-block-folded, .narration .collapsible-block-folded, .journal .collapsible-block-folded, div.blockquote .collapsible-block-folded{ /* ---- For Collapsibles Inside Divs | [CLOSED] ---- */ padding: .75em 0; /* -------- */ } blockquote .collapsible-block-unfolded, .alt-blockquote .collapsible-block-unfolded, .lightweight .collapsible-block-unfolded, .card-block .collapsible-block-unfolded, .report-box .collapsible-block-unfolded, .o5-box .collapsible-block-unfolded, .narration .collapsible-block-unfolded, .journal .collapsible-block-unfolded, div.blockquote .collapsible-block-unfolded{ /* ---- For Collapsibles Inside Divs | [OPEN] ---- */ padding-top: .75em; /* -------- */ } /* -------- FORMATTING | [SPECIAL] -------- */ .centered{ /* ---- Center-Aligns Text ---- */ text-align: center; } .justified{ /* ---- Justify-Aligns Text ---- */ text-align: justify; } .indented{ /* ---- Indents Block by ½-inch/2em (Use Within Other Divs) ---- */ text-indent: 2.4em; } .indented .bibcite, .indented .footnoteref, .indented ul, .indented ol, .indented .scp-image-block.block-right, .indented h1, .indented h2, .indented h3, .indented h4, .indented h5, .indented h6, .indented .scene-break, .indented .footnotes-footer, .indented .bibitems{ text-indent: 0; } .rev-red, .rev-green, .rev-blue, .rev-yellow, .terminal-span{ font-weight: bold; } .rev-red{ /* ---- Red Document Revision Text ---- */ color: hsl(360, 100%, 27%); } .rev-green{ /* ---- Green Document Revision Text ---- */ color: hsl(120, 100%, 27%); } .rev-blue{ /* ---- Blue Document Revision Text ---- */ color: hsl(240, 100%, 27%); } .rev-yellow{ /* ---- Yellow Document Revision Text ---- */ color: hsl(40, 100%, 40%); } .terminal-span{ /* ---- Computer Terminal Text ---- */ font-family: var(--mono-font); font-size: 110%; letter-spacing: .3px; } /* ---- Blinking Text Cursor (Adapted From 'Your Very First SCP!') ---- */ .blinkbar{color: black; animation: blink 1.5s infinite;} @keyframes blink{to{opacity: .0;}} @keyframes flicker{0% {opacity: .9890; }5% {opacity: .5842; }10% {opacity: .9865; }20% {opacity: .0412; }20% {opacity: .6255; }25% {opacity: .3157; }30% {opacity: .7328; }35% {opacity: .4654; }40% {opacity: .9128; }45% {opacity: .2449; }50% {opacity: .5485; }55% {opacity: .6438; }60% {opacity: .1180; }65% {opacity: .9085; }70% {opacity: .0266; }75% {opacity: .6795; }80% {opacity: .7812; }85% {opacity: .0117; }90% {opacity: .2239; }95% {opacity: .8897; }100% {opacity: .2260; }} @keyframes overlay-anim{0% {visibility: hidden; }10% {visibility: hidden; }11% {visibility: visible; }50% {visibility: hidden; }100% {visibility: hidden; }} .lite-heading{ /* ---- Special Heading Area (Adapted From 'SCP-4058') ---- */ clear: both; margin: 3.6em auto; } .lite-heading h3{ color: hsl(360, 100%, 27%); } .lite-heading hr{ width: 55%; margin: auto; border-width: medium; } div.image-showcase{ /* ---- Alternative Image Showcase ---- */ width: 25em; margin-bottom: 1em; background: hsl(0, 0%, 100%); border: 3px ridge hsl(0, 0%, 5%); } div.image-showcase.block-center{ margin-right: auto; margin-left: auto; } .scene-break{ /* ---- Fancy Scene/Section Break ---- */ width: 3.5em; margin: 2em 0; } .listPagesNav{ margin-bottom: 5em; } .listPagesNav-prev, /* ---- ListPages Navigation (Adapted from 'SCP-5552') ---- */ .listPagesNav-next{ width: 45%; margin: 0 0 1em; padding: 0 2%; background: hsl(0, 0%, 90%); border: 1px solid hsl(0, 0%, 60%); } .listPagesNav-prev{ float: left; text-align: left; } .listPagesNav-next{ float: right; text-align: right; } .fade-away{ background: linear-gradient(to bottom, hsl(0, 0%, 95%), hsl(0, 0%, 5%)); } .footing::before{ /* ---- Page Footing ---- */ content: " "; position: absolute; bottom: 1px; left: 0; right: 0; border-bottom: 2px solid hsl(0, 0%, 47%); } .footing{ position: relative; bottom: -2px; margin-bottom: 2px; border-bottom: 1px solid hsl(0, 0%, 47%); } .related-flex{ /* ---- Related Articles Box ---- */ display: flex; justify-content: center; } .related{ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 100%); border: thick solid hsla(0, 0%, 60%, 0.5); text-align: left; } .series-nav{ /* ---- Series Navigation ---- */ margin: .5em 0; background: linear-gradient(to bottom right, hsla(0, 0%, 100%, 1), hsla(0, 0%, 50%, .5)); border: outset 1.5px hsl(0, 0%, 5%); border-radius: 2em; font-size: 85%; font-weight: bold; text-align: center; } /* -------- ADVANCED WARNING HEADER -------- * Adapted From 'SCP-001-JP - indonootoko's Proposal' * See the Example at the Top of the Page **/ .orderwrapper{ position: relative; width: auto; text-align: center; } .council{ position: relative; top: 0; bottom: 0; left: 0; right: 0; width: 295px; height: 295px; margin: auto; background-image: url(https://scp-wiki.wdfiles.com/local--files/scp-style-resource/scp_trans.png); background-position: center; background-repeat: no-repeat; background-size: 295px 295px; } .ordertitle{ position: absolute; top: 27px; left: 0; right: 0; } .ordertitle h1{ color: hsl(0, 0%, 5%); font-size: 220%; line-height: 90%; } .orderdescription{ position: absolute; top: 93px; left: 0; right: 0; width: 100%; } .orderdescription h1{ color: hsl(0, 0%, 5%); font-size: 120%; } .orderdescription p{ color: hsl(0, 0%, 5%); font-size: 90%; } .itemno{ position: absolute; bottom: 18px; left: 0; right: 0; } .itemno h1{ color: hsl(0, 0%, 5%); font-size: 170%; } /* -------- YUI TAB BASE -------- */ .yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{background-color:inherit;background-image:inherit}.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{background:inherit;text-decoration:inherit}.yui-navset .yui-nav .selected a,.yui-navset .yui-nav .selected a:focus,.yui-navset .yui-nav .selected a:hover{color:inherit;background:inherit}.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{border-color:inherit}.yui-navset li{line-height:inherit} /* -------- YUI TAB CUSTOMIZATION -------- * Adapted From 'Black Highlighter Theme' **/ .yui-navset *{ transition: color 80ms cubic-bezier(.4, 0, .2, 1), background-color 80ms cubic-bezier(.4, 0, .2, 1); } .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav{ display: flex; flex-wrap: wrap; width: calc(100% - .125rem); margin: 0 auto; border-color: hsl(360, 94%, 20%); box-shadow: 0 calc(.0625rem * 5) 0 0 hsl(360, 94%, 20%); } .yui-navset .yui-nav a, /* ---- Link Modifier ---- */ .yui-navset .yui-navset-top .yui-nav a{ color: hsl(0, 0%, 5%); /* ---- Tab Background Colour | [UNSELECTED] ---- */ background-color: hsl(0, 0%, 99%); /* -------- */ background-image: none; border: unset; } .yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus{ color: hsl(0, 0%, 96%); /* ---- Tab Background Colour | [HOVER] ---- */ background-color: hsl(360, 100%, 27%); /* -------- */ } .yui-navset .yui-nav li, /* ---- Listitem Modifier ---- */ .yui-navset .yui-navset-top .yui-nav li{ position: relative; display: flex; flex-grow: 2; max-width: 100%; margin: 0; padding: 0; background-color: hsl(0, 0%, 96%); border-color: transparent; box-shadow: 0 0 0 .0625rem hsl(360, 94%, 20%); } .yui-navset .yui-nav li a, .yui-navset-top .yui-nav li a, .yui-navset-bottom .yui-nav li a{ display: flex; align-items: center; justify-content: center; width: 100%; } .yui-navset .yui-nav li em{ border: unset; } .yui-navset .yui-nav a em, .yui-navset .yui-navset-top .yui-nav a em{ padding: .35em .75em; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .yui-navset .yui-nav .selected, /* ---- Selection Modifier ---- */ .yui-navset .yui-navset-top .yui-nav .selected{ flex-grow: 2; margin: 0; padding: 0; /* ---- Tab Background Colour | [SELECTED] ---- */ background-color: hsl(360, 94%, 20%); /* -------- */ } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em{ border: hsl(360, 94%, 20%); } .yui-navset .yui-nav .selected a{ width: 100%; color: hsl(0, 0%, 96%) !important; background-image: none; } .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:active{ color: hsl(0, 0%, 96%); background-color: hsl(360, 94%, 20%); } .yui-navset .yui-nav .selected a:hover{ cursor: default; } .yui-navset-left .yui-content{ /* ---- Content Background ---- */ background-color: hsl(0, 0%, 99%); /* -------- */ } .yui-navset .yui-content, .yui-navset .yui-navset-top .yui-content{ padding: .5em; border-color: hsl(0, 0%, 60%); } /* -------- PAGE TAGS -------- */ #main-content .page-tags{ border-top: 1px solid hsl(0, 0%, 73%); } #main-content .page-tags a{ display: inline-block; height: .8125rem; margin: 0 0 .5rem .75rem; padding: .1875rem .3125rem .1875rem 0; color: hsl(0, 0%, 95%); background-color: hsl(0, 0%, 27%); border-bottom-right-radius: .25rem; border-top-right-radius: .25rem; line-height: 13px; line-height: .8125rem; font-size: 11px; font-size: .6875rem; font-weight: normal; } #main-content .page-tags a:before{ width: 0; height: 0; top: -.1875rem; left: -.625rem; padding: 0 .0625rem .1875rem; border-color: transparent hsl(0, 0%, 27%) transparent transparent; border-style: solid; border-width: .5rem .5rem .5rem 0; } #main-content .page-tags a:before, #main-content .page-tags a:after{ content: ""; position: relative; float: left; } #main-content .page-tags a:after{ width: .25rem; height: .25rem; top: .2813rem; left: -.5rem; background-color: hsl(0, 0%, 100%); border-radius: .125rem; } #main-content .page-tags span{ max-width: 100%; border-top: .5rem solid transparent; } /* -------- INTERWIKI -------- */ iframe.scpnet-interwiki-frame{ position: relative; width: 15.734em; height: unset; margin-bottom: .78em; margin-left: 4px; background-color: hsl(0, 0%, 100%); border: 2px solid hsl(0, 0%, 20%); } /* -------- SHOW-CHANGES HIGHLIGHTS -------- */ .inline-diff ins::before{ color: hsl(240, 100%, 93%); } .inline-diff del::before{ color: hsl(0, 100%, 90%); } .inline-diff ins + del::before, .inline-diff del + ins::before{ color: transparent; } .inline-diff br + ins::before, .inline-diff br + del::before, .inline-diff ins:first-of-type::before, .inline-diff del:first-of-type::before{ position: absolute; display: inline-block; left: -1em; content: "\f111"; font: normal normal normal 16px/1 "FontAwesome"; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* -------- PRESENTATION -------- */ .templateInfo{ margin: 1em 0; padding: 0 1em; background: hsl(0, 0%, 100%); border: 1px solid hsl(0, 0%, 87%); } /* -------- CROQSTYLE ALTERATIONS -------- */ #edit-page-textarea{ font-family: unset; } tt{ background-color: unset; font-size: unset; padding: unset; margin: unset; border-radius: unset; } /* -------- REDUCED MOTION ACCESSIBILITY -------- */ @media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; } } /* -------- MOBILE MEDIA QUERY -------- */ @media (max-width: 479px){ #header h1 a{ font-size: 85%; } div.image-showcase{ width: 90%; } div.o5-box{ margin: 1em 0; } } /* -------- NOTE MEDIA QUERY -------- */ @media (min-width: 480px) and (max-width: 580px){ #header h1 a{ font-size: 100%; } div.image-showcase{ width: 100%; } div.o5-box{ margin: .5em; } } /* -------- MINI TABLET MEDIA QUERY -------- */ @media (min-width: 581px) and (max-width: 767px){ #header h1 a{ font-size: 120%; } } @media (max-width: 767px){ .open-menu a:hover{ box-shadow: none; } } /* -------- TABLET MEDIA QUERY -------- */ @media (min-width: 768px) and (max-width: 979px){ #header h1 a{ font-size: 140%; } }
To: Dr. Dana Larsson
From: Researcher Bính Liên
Subject: need you down here to keep moods up
dana, i don't know what you've been cooped up in your office for. the people down here need a therapist. i know things are hard for you too, but some of the staff seem in dire need of a professional's help. i'm on my own here. i can only say so much falsehoods about hope and resilience.
NOTICE FROM THE FOUNDATION
DEPARTMENT OF 'PATAPHYSICS
The following file is marked LEVEL 3 CONFIDENTIAL, but this does not quite matter.
Read on. |
To: Dr. Dana Larsson
From: Agent Francisca Méndez
Subject: Everything OK?
Dana,
None of us have seen you for a couple of days. We’re all pretty worried. Especially me.
I hate to say this over mail, but you won’t show yourself to anyone, so I’ll just put it bluntly: I need you. I need you bad. I need you to hold me and tell me everything will be alright. I need you to whisper comforting things in my ear like you used to. I don’t need you as my therapist, but as my friend. As a person whom I hold most dear. Please come to me, Dana, we can work through this together. You don't have to be all by yourself.
Missing you, and forever yours,
Fran.
Special Containment Procedures: SCP-XXXX cannot be currently contained. To keep site morale at an acceptable level, team-building exercises and recreational events have been scheduled for every weekday night for as long as the anomaly persists. Extra accommodations have been set up for site personnel who did not previously reside in the in-site housing facilities.
Food and water supplies at Site-71 have been estimated to last for 900 days, if rationed properly. Emergency responses in case the anomaly persists beyond this time period are to be defined by Site Director Keita and resident Ethics Committee members.
Seeing as it is impossible to predict whether Site-71's current condition will change or if SCP-XXXX will be reverted at some point in the near future, all available resources are to be directed to|
To: Dr. Dana Larsson
From: Custodial Staff Leader Thomas Rosseau
Subject: Could use your help
Hey there Dr. Larsson. I was told youve been MIA for the last couple of days, but I figured, whatever, Ill write anyways. You told me to do that, right? Write down my feelings?
I could really use a session with you. Its been hard, dealing with this whole thing. It just dawned on me that I might never see my family, or hell, even sunlight again. You know how much lower in clearance I am compared to you, so you can expect I dont know shit about what’s going on. Its all just a confusing mess. Im thinking, if we dont go back to our dimension or whatever, whats the point of even staying alive here anymore? It seems like we're just waiting out our deaths here, and nobody is coming to save us. We're all alone, right?
Im confused, Dr., and scared as hell. Please talk to me.
Description: SCP-XXXX refers to an event that occurred on 17/04/2019, in which the whole of SCP Foundation Site-71 lost all forms of contact with the outside world, as well as any other narratives or narremes it previously coexisted with.
At 17:23 local time on the aforementioned date of SCP-XXXX's occurrence, all entry and exit points to and from Site-71 disappeared, both intra- and extra-narratively. Doors and windows leading outside of Site-71's main building were obstruced by segments of wall, and all telephone or internet signals ceased functioning with no apparent cause. Any attempts to destruct the outer walls or floor in any sections of the building proved futile. Initially, electricity and clean water supplies were also interrumpted, but emergency generators and water filters feeding from underground wells were|
To: Dr. Dana Larsson, Researcher Len Smith, Researcher Sakura Funado and 27 more.
From: Dr. Lucas Fielding
Subject: Notice to all West Wing personnel
This is a notice to all personnel stationed at the West Wing of Site-71, from the office of Dr. Lucas Fielding.
Beginning tomorrow, operations will be taking place on the wall that once led to the West Wing parking lot. This is the last external wall on-site that hasn’t yet been attempted to demolish.
You may hear construction noises for an indeterminate period of time. We apologize for the inconvenience in advance.
Kindly,
Dr. Fielding, PhD.
Along with entries and exits, all site personnel that had previously been assigned to a different site, as well as any anomalies with a Foundation-issued numerical classification, also disappeared. Personnel who had worked at sites that didn't hold anomalous items, or items of this nature without an SCP designation, remained on-site after the event.
All Foundation files regarding people, items or events not in Site-71 at the time of SCP-XXXX's occurrence ceased being accessible. This includes, but is not limited to, faculty dossiers, SCP-issued files, logs of extranormal events, unexplained locations, anomalous|
To: Dr. Dana Larsson
From: Agent Joseph Kant
Subject: (no subject)
Hey Dana. It’s been, what, two months, so I’m finally going around Greta’s stuff. You can have some of her clothing if you like. Obviously I’m keeping any items of emotional significance, but I thought you’d like to have some of her other stuff. I remember you guys talking about her clothes a lot.
Also, it wouldn’t hurt to see you, at least just for a bit. Not to help me deal with my feelings or anything, I’m already pretty much as comfortable as one can be with the fact that we’re stuck here forever. No, it’d just be nice to see a friend. We are friends, right? I’d be surprised if it ended up being that I lost you too.
I don't want to be alone.
All persons involved in SCP-XXXX have normal recollection of the information they previously had access to. This suggests that narratives external to Site-71's did not stop existing; rather, Site-71's internal narreme was most likely displaced or separated from an overarching narrative. The sudden disappearance of anything not involved in Site-71's internal narreme, or previously existing in a major "canon" plane, leads to the conclusion that Site-71 as a narrative entity was consciously eliminated from a major collection of inter-connecting narratives, but not fully deleted from existence.
The cause of SCP-XXXX is as of yet unknown.
To: list:all site 71 personnel – no clearance
From: Site Director Alyssa Keita
Subject: Weekly Summary of Findings Regarding SCP-XXXX
Dear Staff and Personnel of Site-71,
This is your weekly summary of findings regarding SCP-XXXX. With relation to last week, no new information has been reported. For a full list of understandings, you can check the bulletin board at the Main Hall.
Additionally, this is the time-table of site-organized events for this week.
| Day | Event | Time | Location |
|---|---|---|---|
| Monday |
Painting Workshop |
17:00 - 19:00 | East Wing laboratories |
| Tuesday |
Disco Night |
21:00 - 00:00 | Main Hall |
| Wednesday |
Group Therapy |
17:00 – 21:00 (with dinner break) | South Wing Common Room |
| Thursday |
Trivia |
21:00 – 00:00 | North Wing Dinner Hall |
| Friday |
Casino Night |
20:00 – 23:00 | Main Hall |
No formal attire is required for any event. You can come to Disco Night without a date.
My best wishes,
Site-71 Director Alyssa Keita
To: list:all site 71 personnel – no clearance
From: Dr. Dana Larsson
Subject: An overdue explanation.
Dear staff, personnel, friends and family of Site-71:
It is with a heavy heart that I write this e-mail. I debated long and hard over whether it was appropriate to share this information, but I ultimately decided that it was the right thing to do. I do not send you this note with a clear conscience, so please understand that I am not expecting you all to read this and immediately call it a day. No, I know how difficult it's going to be, and I do not expect you to forgive me. However, it is my professional opinion that the site’s collective mental health can only benefit from having read this file. It was selfish of me to send this to you, but I trust most of you will understand where I'm coming from. I only ask that you remain strong in the face of this revelation.
You now all have access to SCP-XXXX’s file. It is the only thing apart from your e-mail accounts available on most of your computers. I suggest you give it a thorough read.
Before my existence as a therapist, with all my knowledge and understandings of the human psyche, I was constructed as a pataphycisist. I existed in a simpler, cruder form, with very different characteristics, but I know that it was essentially "me". With no clear idea as to why, I retained my knowledge from this meta-narrative state of being. Perhaps it is due to the nature of ‘Pataphysics, or perhaps it was some sort of divine intervention. I just know one thing for sure: 'Pataphysics is not a simple science. It means discarding all that you thought was true and embracing a dogma that some would call belittling. I ask that you not feel minimized by this discovery. Instead, think of it as the most important thing that could happen to you; it means you are perfection, carefully constructed and most highly thought of. You are a magnificent sculpture made of the finest marble, and that does not make you any less alive. Every change, every shift that you experience is only for the purpose of admiring your beauty, and further adding onto it.
You may feel physically trapped, disconnected, but I assure you that, spiritually, you could not be better accompanied. You are not alone. You are among gods, and only good things can come from this. You are now free to break every rule, control everything in your path, do as you wish in every meaning of the word. Everything that happens is done by your own will. The world is your sandbox, and from now on, it can only be perfected.
It was painful to bear this knowledge alone, but now I have you, the best people to ever exist, to accompany me. Dear staff, personnel, heroes and legends of Site-71: welcome to the Department of ‘Pataphysics.
I can't say if the changes will be reverted. I can't assure you that you will be the same people if it happens. What we can do for now is lie in wait and bask in the beauty of our existence.
I look forward to seeing you all at Casino Night. I’ve been told I keep a mean poker face.
Yours truly,
Dr. Dana Larsson, ‘PhD.
@import url(https://fonts.googleapis.com/css2?family=Carrois+Gothic&display=swap); /* 'Pataphysics Department Theme * [2018 Wikidot Theme] * Based on Aelanna's Sigma-9 Theme as Edited by Dr Devan * Inspired by Rimple's "Pataphysics Department" * Created by Lt Flops, Logo Designed by TSATPWTCOTTTADC, CSS Spinner by Woedenaz * With Code Help From Stormbreath **/ /* ---- COLOUR VARIABLES ---- */ body{ /* ---- GREY --- */ --very-dark-grey: hsl(0, 0%, 05%); --grey: hsl(0, 0%, 75%); --light-grey: hsl(0, 0%, 88%); --lighter-grey: hsl(0, 0%, 91%); --very-light-grey: hsl(0, 0%, 95%); /* ---- GOLD ---- */ --pure-yellow: hsl(51, 100%, 50%); --strong-orange: hsl(36, 67%, 49%); /* ---- GREEN ---- */ --vivid-lime-green: hsl(112, 77%, 48%); /* ---- BLUE ---- */ --dark-blue: hsl(253, 60%, 33%); /* ---- VIOLET ---- */ --very-dark-violet: hsl(268, 39%, 10%); --very-dark-moderate-violet: hsl(268, 40%, 25%); --dark-violet: hsl(266, 100%, 25%); --very-dark-muted-violet: hsl(268, 33%, 30%); --strong-violet: hsl(268, 100%, 37%); --dark-moderate-violet: hsl(268, 40%, 45%); --mostly-muted-dark-violet: hsl(268, 25%, 50%); /* ---- GRADIENT VIOLET ---- */ --grad-very-dark-muted-violet: hsl(268, 40%, 19%); --grad-dark-moderate-violet: hsl(268, 40%, 33%); /* ---- MAGENTA ---- */ --dark-magenta: hsl(298, 86%, 37%); } /* ---- CONTENT WRAP ---- */ div#container-wrap{ background: url(https://scp-wiki.wdfiles.com/local--files/theme%3Apataphysics/pataphysics-header-updated.png) top left repeat-x !important; } body{ color: hsl(0, 0%, 05%); color: var(--very-dark-grey); background-color: hsl(0, 0%, 95%); background-color: var(--very-light-grey); word-break: unset; } /* ---- LOGO IMAGE | [PRE] ---- */ #header{ background-image: none; } #header #header-extra-div-1, #header #header-extra-div-2, #header #header-extra-div-3{ width: 6.25rem; height: 6.25rem; display: flex; position: absolute; left: .25rem; top: 2rem; } /* 'Pataphysics Department Logo | [ANIMATION] * Logo Designed by TSATPWTCOTTTADC, CSS Spinner by Woedenaz * Released Under CC BY-SA 3.0 **/ #header #header-extra-div-1::before, #header #header-extra-div-2::before, #header #header-extra-div-3::before{ content: ""; width: 6.25rem; height: 6.25rem; position: absolute; background-repeat: no-repeat; background-position: center center; background-size: contain; flex: 1; } #header #header-extra-div-1::before{ z-index: 1; background-image: url("data:image/svg+xml,%3Csvg id='Layer_3' data-name='Layer 3' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bopacity:0.55;fill:url(%23linear-gradient);%7D.cls-2%7Bopacity:0.66;%7D.cls-3%7Bfill:%23fff;%7D%3C/style%3E%3ClinearGradient id='linear-gradient' x1='6.16' y1='32.16' x2='97.17' y2='66.71' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%238b8b8b'/%3E%3Cstop offset='1' stop-color='%23fff'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ctitle%3Epata_logo_bg%3C/title%3E%3Cpath class='cls-1' d='M50,93.82A43.11,43.11,0,0,1,34.88,91.1a44.63,44.63,0,0,1-7.72-3.77c-1.05-.65-2.49-1.65-3.46-2.39l-3.58,1.31-1.82.67a3.82,3.82,0,0,1-1.42.37c-1.17,0-1.17,0-3.4-3.82L9.54,76.66,2.79,65C1.31,62.4,1,61.81,1.7,60.78a12.07,12.07,0,0,1,1.72-1.67l3.06-2.83.59-.54C7,54.68,6.87,53.85,6.82,53c-.05-1.09-.05-3.59,0-4.62a26.26,26.26,0,0,1,.4-3.6h0c0-.1.07-.35.1-.61a43.11,43.11,0,0,1,26.07-33.3c.11-.64.27-1.56.45-2.62.35-2,.65-3.7.66-3.77l.39-1.74H61.58c2.42,0,3.42,0,3.87,1.48l0,.17c0,.07.22,1,.51,2.25l.35,1.55c.25,1.13.49,2.16.64,2.86a48.34,48.34,0,0,1,4.38,2.19,43.08,43.08,0,0,1,21.5,33.1,42.82,42.82,0,0,1-.11,9.94l.83.7c4.52,3.77,4.52,3.77,4.73,4.25l.35.81-.36.81c0,.11-.14.31-6.88,12-1.67,2.91-3.35,5.8-4.61,8-2.44,4.21-2.48,4.28-3.19,4.51A2.45,2.45,0,0,1,82,87.21L81.29,87l-.16,0-.64-.2-2.71-.84-2-.62a42.77,42.77,0,0,1-6.27,3.89,22.46,22.46,0,0,1-3.24,1.45l-.66.25A42.73,42.73,0,0,1,55.1,93.51,42.08,42.08,0,0,1,50,93.82ZM24.05,80.7a2.37,2.37,0,0,1,1.56.66,42.19,42.19,0,0,0,3.67,2.58,41.09,41.09,0,0,0,7,3.41,39.18,39.18,0,0,0,27.86-.19,9.74,9.74,0,0,1,1.07-.39c.28-.1,1.26-.55,2.48-1.16a38.42,38.42,0,0,0,5.71-3.54L75,80.87l1.29.39.27.09c.28.09,2.06.65,2.33.72s2.74.85,2.93.92l.2.06c2.36-4,9.49-16.39,11.88-20.57-.8-.68-1.9-1.59-2.9-2.42h0l-1.74-1.47a2.48,2.48,0,0,1-.56-2.38,38.28,38.28,0,0,0,.16-9.46,39.15,39.15,0,0,0-19.5-30,42.63,42.63,0,0,0-4.52-2.21,2.39,2.39,0,0,1-1.56-1.6h0c-.07-.3-.26-1.14-.86-3.84L62.1,7.52C62,7.24,62,7,61.92,6.75c-1.75,0-5.36,0-11.92,0H38.17c-.11.62-.24,1.38-.39,2.2-.68,4-.68,4-.88,4.31l-.12.18a2.87,2.87,0,0,1-1.52,1,39.15,39.15,0,0,0-24,30.34,7.85,7.85,0,0,1-.21,1.08c-.05.32-.18,1.52-.25,2.77-.05.89-.05,3.23,0,4.18s.12,1.64.25,2.72l.21,1.78-.91.85L9.19,59.22,6.13,62l-.27.25.4.69L13,74.66c2.08,3.6,3.8,6.57,4.76,8.2l1-.36C23.65,80.7,23.65,80.7,24.05,80.7Zm41.33,6h0ZM11.06,45.87,11,46Z'/%3E%3Cpath class='cls-2' d='M92.06,61.58l-1.59-1.33-.83-.69-.48-.4-.43-.36c-.2-.17-.46-.39-.56-.49L88,58.13l0-.28c.24-1.33.45-2.9.56-4.24a49.09,49.09,0,0,0,0-6A38.71,38.71,0,0,0,68.73,16.83a41.87,41.87,0,0,0-5-2.31c-.75-.29-.79-.32-.82-.43s-.17-.72-.33-1.45c-.34-1.48-1.29-5.55-1.32-5.66s-.6-.07-11.32-.07H38.67l0,.09-.4,2.27c-.52,3-.79,4.5-.83,4.67s-.06.14-.54.31A38.75,38.75,0,0,0,11.69,44.89a36.79,36.79,0,0,0-.42,6.55c0,.77,0,1.67,0,2a32.6,32.6,0,0,0,.46,3.88l.06.3-.28.27c-.15.15-.33.31-.39.36L10,59.39l-.39.35c-.12.11-.41.37-.62.58L8.28,61c-.15.14-.58.55-1,.9l-.83.79-.14.12L12,72.55c3.1,5.37,5.66,9.77,5.68,9.77s.36-.11.74-.25l2.05-.75,2.05-.76a17.06,17.06,0,0,1,1.8-.63l.2,0,.4.34a5,5,0,0,0,.45.37,2.14,2.14,0,0,1,.35.26,39,39,0,0,0,21.76,8.46c.93.07,4.05.07,5,0a38.84,38.84,0,0,0,11.78-2.66,39.67,39.67,0,0,0,6.62-3.39,2.93,2.93,0,0,1,.42-.24,32.77,32.77,0,0,0,3-2.17l.7-.56c.1-.08.11-.08.61.08l.81.24.37.11.28.09.27.08.46.15.63.19c.36.11,2.06.63,2.24.67l.82.25c.37.11.71.2.74.2s2.29-3.87,5.66-9.7c3.07-5.33,5.61-9.72,5.64-9.76S93.66,62.92,92.06,61.58Z'/%3E%3Cpath class='cls-3' d='M92.31,58.52,90.7,57.17c-.07-.07-.07-.09,0-.7a40.13,40.13,0,0,0,.17-9.93A41.17,41.17,0,0,0,70.38,15a48.54,48.54,0,0,0-4.76-2.33,1,1,0,0,1-.36-.2s-.4-1.76-.86-3.81-.86-3.78-.86-3.83S62.83,4.73,50,4.73H36.49l0,.12c0,.06-.31,1.74-.66,3.73s-.64,3.65-.65,3.68a4.59,4.59,0,0,1-.64.3A41.14,41.14,0,0,0,9.3,44.45c-.06.4-.13.78-.15.83a26.39,26.39,0,0,0-.33,3.2c-.05,1-.05,3.38,0,4.4s.13,1.77.26,2.86l.09.77L9,56.66,7.73,57.84,7,58.55l-2.19,2c-.76.7-1.39,1.3-1.41,1.32s.51,1,1.16,2.08l6.75,11.68c3.06,5.3,5.58,9.63,5.61,9.63l.73-.25,1.82-.67C23.11,83,24,82.7,24.05,82.7a1.32,1.32,0,0,1,.29.2,45.39,45.39,0,0,0,3.88,2.74,44.52,44.52,0,0,0,7.36,3.59A41.13,41.13,0,0,0,64.88,89l.84-.31a26.66,26.66,0,0,0,2.88-1.32,39,39,0,0,0,6-3.72l.81-.59.22.06.34.11,2.38.74,2.83.89.54.16.83.26a2.05,2.05,0,0,0,.43.11S96.5,62.06,96.49,62,95.67,61.32,92.31,58.52ZM93.5,62.9s-2.57,4.43-5.64,9.76c-3.37,5.83-5.63,9.7-5.66,9.7s-.37-.09-.74-.2l-.82-.25c-.18,0-1.88-.56-2.24-.67l-.63-.19-.46-.15L77,80.82l-.28-.09-.37-.11-.81-.24c-.5-.16-.51-.16-.61-.08l-.7.56a32.77,32.77,0,0,1-3,2.17,2.93,2.93,0,0,0-.42.24,39.67,39.67,0,0,1-6.62,3.39,38.84,38.84,0,0,1-11.78,2.66c-.93.07-4.05.07-5,0a39,39,0,0,1-21.76-8.46,2.14,2.14,0,0,0-.35-.26,5,5,0,0,1-.45-.37l-.4-.34-.2,0a17.06,17.06,0,0,0-1.8.63l-2.05.76-2.05.75c-.38.14-.71.25-.74.25s-2.58-4.4-5.68-9.77L6.34,62.77l.14-.12.83-.79c.39-.35.82-.76,1-.9L9,60.32c.21-.21.5-.47.62-.58l.39-.35,1.2-1.13c.06,0,.24-.21.39-.36l.28-.27-.06-.3a32.6,32.6,0,0,1-.46-3.88c0-.34,0-1.24,0-2a36.79,36.79,0,0,1,.42-6.55A38.75,38.75,0,0,1,36.88,14.25c.48-.17.5-.18.54-.31s.31-1.7.83-4.67L38.65,7l0-.09H50c10.72,0,11.29,0,11.32.07s1,4.18,1.32,5.66c.16.73.31,1.38.33,1.45s.07.14.82.43a41.87,41.87,0,0,1,5,2.31A38.71,38.71,0,0,1,88.54,47.57a49.09,49.09,0,0,1,0,6c-.11,1.34-.32,2.91-.56,4.24l0,.28.19.18c.1.1.36.32.56.49l.43.36.48.4.83.69,1.59,1.33C93.66,62.92,93.55,62.82,93.5,62.9Z'/%3E%3C/svg%3E"); animation: cont-spin 15s linear infinite; } #header #header-extra-div-2::before{ z-index: 3; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bopacity:0.46;%7D.cls-2%7Bfill:%23231f20;%7D.cls-3%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Epata_logo_mg%3C/title%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Cg class='cls-1'%3E%3Cpath class='cls-2' d='M50,23.78A26.31,26.31,0,0,1,75.86,45.07L79.79,45l-4.3,7.81-4.62-7.63,3.72-.08A25.07,25.07,0,0,0,50.65,25V35.92h6.43L50,48.16,42.94,35.92h6.42V24.42h0v-.64H50M50,45.6l4.85-8.4h-9.7L50,45.6m25.44,4.65,2.16-3.94-4.49.09,2.33,3.85M50,23.53h-.88V35.67H42.5l.22.38,7.06,12.23.22.38.22-.38,7.06-12.23.22-.38H50.89V25.3A24.7,24.7,0,0,1,74.28,44.85l-3.42.07h-.43l.23.37,4.62,7.63.22.37.21-.38L80,45.11l.21-.38h-.43l-3.73.07A26.64,26.64,0,0,0,50,23.53ZM45.58,37.45h8.84L50,45.1l-4.42-7.65Zm28,9.19,3.63-.07-1.75,3.18-1.88-3.11Z'/%3E%3Cpath class='cls-2' d='M39.26,27,35,34.79,33,31.61a25.06,25.06,0,0,0-5.4,30.76l9.43-5.44-3.22-5.56H48L40.92,63.61,37.71,58l-10,5.75h0l-.56.32-.31-.54a26.32,26.32,0,0,1,5.51-33l-2-3.36L39.26,27m-4.35,5.26,2.16-3.93-4.49.09,2.33,3.84m6,28.82,4.85-8.4h-9.7l4.85,8.4M39.69,26.71h-.43l-8.93.19H29.9l.23.37,1.92,3.18a26.66,26.66,0,0,0-5.4,33.22l.32.54.12.21.22-.12.35-.2.2-.12,9.75-5.62,3.09,5.35.22.38.22-.38L48.2,51.49l.22-.37h-15l.22.37,3.08,5.35-9,5.18A24.7,24.7,0,0,1,33,32l1.77,2.92.22.37.21-.38,4.3-7.82.21-.38ZM33,28.63l3.62-.07L34.9,31.73,33,28.63ZM36.5,52.9h8.83l-4.41,7.65L36.5,52.9Z'/%3E%3Cpath class='cls-2' d='M66.1,51.37l-3.21,5.56,10,5.76h0l.55.32-.31.54A26.33,26.33,0,0,1,41.72,75.31l-1.89,3.45-4.62-7.64,8.92-.18-1.79,3.25a25,25,0,0,0,29.33-10.7L62.25,58,59,63.61,52,51.37H66.1M59,61.05l4.85-8.4h-9.7L59,61.05M39.78,76.2l2.16-3.94-4.49.09,2.33,3.85M66.54,51.12h-15l.22.37,7.06,12.24.22.38.22-.38,3.08-5.35,9,5.2A24.81,24.81,0,0,1,42.7,74.05l1.65-3,.21-.38h-.44l-8.92.18h-.43l.22.37,4.62,7.63.23.38.21-.38,1.79-3.27A26.56,26.56,0,0,0,73.31,63.68l.31-.54.12-.22-.21-.12-.35-.2-.2-.12-9.75-5.64,3.09-5.35.22-.37ZM54.62,52.9h8.84L59,60.55,54.62,52.9ZM37.89,72.6l3.62-.08L39.76,75.7l-1.87-3.1Z'/%3E%3C/g%3E%3Cpath class='cls-3' d='M75.86,45.07A26.31,26.31,0,0,0,50,23.78h-.63v.64h0v11.5H42.94L50,48.16l7.07-12.24H50.64V25A25.07,25.07,0,0,1,74.59,45.09l-3.72.08,4.62,7.63L79.79,45Zm-21-7.87L50,45.6l-4.85-8.4Zm20.59,13L73.11,46.4l4.49-.09Z'/%3E%3Cpath class='cls-3' d='M33.85,51.37l3.22,5.56-9.43,5.44A25.06,25.06,0,0,1,33,31.61L35,34.79,39.26,27l-8.92.19,2,3.36a26.32,26.32,0,0,0-5.51,33l.31.54.56-.32h0l10-5.75,3.21,5.57L48,51.37ZM37.07,28.3l-2.16,3.93-2.33-3.84Zm-1,24.35h9.7l-4.85,8.4Z'/%3E%3Cpath class='cls-3' d='M72.85,62.7h0l-10-5.76,3.21-5.56H52L59,63.61,62.25,58l9.42,5.45a25,25,0,0,1-29.33,10.7l1.79-3.25-8.92.18,4.62,7.64,1.89-3.45A26.32,26.32,0,0,0,73.09,63.56L73.4,63ZM39.78,76.2l-2.33-3.85,4.49-.09ZM59,61.05l-4.85-8.4h9.7Z'/%3E%3C/g%3E%3C/svg%3E"); animation: clock-spin cubic-bezier(.62, 0, .52, 1.3) 10s infinite; } #header #header-extra-div-3::before{ z-index: 3; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E.cls-1,.cls-3%7Bfill:%23fff;%7D.cls-1,.cls-2%7Bopacity:0.3;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Epata_logo_fg%3C/title%3E%3Cg id='Layer_1' data-name='Layer 1'%3E%3Cpath class='cls-1' d='M80.79,63.91,77,61.72a29.13,29.13,0,0,0,2.33-11.44A29.42,29.42,0,0,0,53.44,21.11V16.92h-7v4.19A29.38,29.38,0,0,0,22.93,61.84L19.2,64l3.5,6.07,3.74-2.16a29.36,29.36,0,0,0,47.08-.11L77.29,70ZM49.94,72.66a22.36,22.36,0,0,1-17.38-8.3l6.57-3.82,1.78,3.06L48,51.37H33.85l1.8,3.13-6.6,3.81A22.39,22.39,0,0,1,46.44,28.17v7.75H42.93L50,48.16l7.07-12.24H53.44V28.17a22.37,22.37,0,0,1,17.44,30l-6.54-3.78,1.75-3H52L59,63.6l1.81-3.13,6.56,3.79A22.34,22.34,0,0,1,49.94,72.66Z'/%3E%3Cg class='cls-2'%3E%3Cpath class='cls-3' d='M53.19,17.17v4.16l.22,0A29.12,29.12,0,0,1,76.77,61.63l-.08.2.19.11L80.45,64,77.2,69.63l-3.56-2-.19-.11-.13.17A29.3,29.3,0,0,1,49.94,79.41a28.94,28.94,0,0,1-23.3-11.66l-.13-.18-.19.11-3.53,2-3.25-5.63,3.52-2,.19-.12-.09-.2A29.13,29.13,0,0,1,46.47,21.35l.22,0V17.17h6.5m3.43,19L50,47.66,43.36,36.17h3.33v-8.3l-.29.05A22.63,22.63,0,0,0,28.82,58.4l.11.27.25-.15,6.49-3.87.21-.13-.12-.21-1.49-2.69H47.54L40.91,63.1l-1.56-2.69-.13-.22-.22.13-6.56,3.83-.25.14.18.23a22.6,22.6,0,0,0,35.23-.1l.18-.23-.25-.14L61,60.26l-.21-.13-.13.22L59,63.1,52.4,51.62H65.66l-1.54,2.67L64,54.5l.21.13,6.54,3.77.26.15.1-.27A22.61,22.61,0,0,0,53.48,27.92l-.29-.05v8.3h3.43M53.44,16.92h-7v4.19A29.38,29.38,0,0,0,22.93,61.84L19.2,64l3.5,6.07,3.74-2.16a29.36,29.36,0,0,0,47.08-.11L77.29,70l3.5-6.06L77,61.72a29.13,29.13,0,0,0,2.33-11.44A29.42,29.42,0,0,0,53.44,21.11V16.92ZM50,48.16l7.07-12.24H53.44V28.17a22.37,22.37,0,0,1,17.44,30l-6.54-3.78,1.75-3H52L59,63.6l1.81-3.13,6.56,3.79a22.35,22.35,0,0,1-34.84.1l6.57-3.82,1.78,3.06L48,51.37H33.85l1.7,3.06-6.5,3.88A22.39,22.39,0,0,1,46.44,28.17v7.75H42.93L50,48.16Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); animation: clock-spin cubic-bezier(.62, 0, .52, 1.3) 10s infinite; } /* ---- ANIMATION ---- */ @keyframes clock-spin{ 0%, 15%{ transform: rotate(0deg); } 25%, 40%{ transform: rotate(90deg); } 50%, 65%{ transform: rotate(180deg); } 75%, 90%{ transform: rotate(270deg); } 100%{ transform: rotate(360deg); } } @keyframes cont-spin{ from{ transform: rotate(0deg); } to{ transform: rotate(360deg); } } /* ---- MOBILE ANIMATION ---- */ @media (max-width: 767px){ #header{ background: none !important; } #header #header-extra-div-1, #header #header-extra-div-2, #header #header-extra-div-3{ width: 5rem !important; height: 5rem !important; left: -1rem !important; top: 3rem !important; } #header #header-extra-div-1::before, #header #header-extra-div-2::before, #header #header-extra-div-3::before{ width: 5rem !important; height: 5rem !important; } } /* ---- GENERAL ---- */ span, a{ word-break: unset; } hr{ height: 0; margin: 1em 0; background-color: transparent; border-top: 1px solid hsl(0, 0%, 62%); } table.wiki-content-table{ background-color: white; } table.wiki-content-table th{ background-color: hsl(0, 0%, 88%); background-color: var(--light-grey); } /* ---- LINKS ---- */ a{ color: hsl(268, 100%, 37%); color: var(--strong-violet); } a:visited{ color: hsl(253, 60%, 33%); color: var(--dark-blue); } #side-bar a:visited{ color: hsl(268, 100%, 37%); color: var(--strong-violet); } a.newpage{ color: hsl(298, 86%, 47%); color: var(--dark-magenta); } a.footnoteref, a.footnoteref:before{ color: hsl(307, 100%, 37%); color: var(--dark-magenta); } a.collapsible-block-link{ font-weight: bold; } .pata-notice a{ /* ---- PATA-NOTICE LINK COLOUR ---- */ color: hsl(51, 100%, 50%); color: var(--pure-yellow); } .pata-notice a:visited{ color: hsl(36, 67%, 49%); color: var(--strong-orange); } .pata-notice a.footnoteref, /* ---- PATA-NOTICE FOOTNOTE COLOUR ---- */ .pata-notice a.footnoteref:before{ color: hsl(51, 100%, 50%); color: var(--pure-yellow); } /* ---- HEADER ---- */ h1, h2, h3, h4, h5, h6{ word-break: unset; } h1, #page-title{ color: hsl(266, 100%, 25%); color: var(--dark-violet); } #header h1 a, #header h1 a::before{ position: relative; left: -1.5px; letter-spacing: -.02em; } #header h1 a{ color: transparent; font-family: "Carrois Gothic", "Arial", sans-serif; text-shadow: none; } #header h1 a::before{ content: "‘Pataphysics Department"; color: hsl(0, 0%, 91%); color: var(--lighter-grey); text-shadow: 1px 1px 1px hsl(0, 0%, 05%); text-shadow: 1px 1px 1px var(--very-dark-grey); } #header span{ color: hsl(0, 0%, 91%); color: var(--lighter-grey); } #header h2 span{ color: transparent; text-shadow: none; } #header h1 a span{ content: ""; visibility: hidden; } #header h2 span::before{ content: "Killing Our Gods"; color: hsl(0, 0%, 91%); color: var(--lighter-grey); text-shadow: 1px 1px 1px hsl(0, 0%, 05%); text-shadow: 1px 1px 1px var(--very-dark-grey); text-shadow: 1px 1px 1px hsla(0, 0%, 5%, .8); } @media only screen and (max-width: 425px){ #header h1 a::before{ content: "‘Pataphysics Dept."; } } /* ---- TOP MENU ---- */ #top-bar ul li ul{ border: solid 1px hsl(268, 40%, 25%); border: solid 1px var(--very-dark-moderate-violet); } #top-bar a{ color: hsl(0, 0%, 91%); color: var(--lighter-grey); } #login-status ul a{ color: hsl(268, 100%, 37%); color: var(--strong-violet); } #top-bar ul .sfhover a, #top-bar ul li:hover a{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); background: hsl(0, 0%, 95%); background: var(--very-light-grey); } #my-account, #account-topbutton{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); } /* ---- SEARCH BAR ---- */ #search-top-box-input{ background-color: hsl(268, 40%, 25%); background-color: var(--very-dark-moderate-violet); border: solid 1px hsl(268, 33%, 30%); border: solid 1px var(--very-dark-muted-violet); border-radius: 0; } #search-top-box-input:hover, #search-top-box-input:focus{ background: hsl(268, 25%, 50%); background: var(--mostly-muted-dark-violet); border: solid 1px hsl(0, 0%, 95%); border: solid 1px var(--very-light-grey); border-radius: 0; } #search-top-box-form input[type="submit"]{ color: hsl(270, 75%, 76%); background: hsl(268, 33%, 30%); background: var(--very-dark-muted-violet); border: solid 1px hsl(268, 40%, 45%); border: solid 1px var(--dark-moderate-violet); border-radius: 0; box-shadow: none; font-size: unset; } #search-top-box-form input[type="submit"]:hover, #search-top-box-form input[type="submit"]:focus{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); background: hsl(268, 25%, 50%); background: var(--mostly-muted-dark-violet); border: solid 1px hsl(0, 0%, 95%); border: solid 1px var(--very-light-grey); border-radius: 0; box-shadow: none; } /* ---- SIDE MENU ---- */ #side-bar{ background: none; } #side-bar .side-block{ background: hsl(0, 0%, 91%); background: var(--lighter-grey); border: 3px solid hsl(268, 40%, 25%); border: 3px solid var(--very-dark-moderate-violet); border-radius: 0; box-shadow: none; } #side-bar .heading{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); border-bottom: 1px solid hsl(268, 40%, 45%); border-bottom: 1px solid var(--dark-moderate-violet); } .side-block .menu-item > .image{ filter: hue-rotate(268deg) saturate(90%) brightness(100%); -webkit-filter: hue-rotate(268deg) saturate(90%) brightness(100%); } #side-bar div.menu-item.inactive a{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); } #side-bar div.menu-item .sub-text{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); } #side-bar .collapsible-block-folded{ background: none; } #side-bar .collapsible-block-unfolded-link{ border-bottom: solid 1px hsl(268, 40%, 25%); border-bottom: solid 1px var(--very-dark-moderate-violet); } #side-bar .collapsible-block-unfolded-link .collapsible-block-link{ color: hsl(268, 40%, 25%); color: var(--very-dark-moderate-violet); font-weight: bold; } /* ---- INFO BAR ---- */ body{ --linkColour: hsl(0, 0%, 95%); --linkColour: var(--very-light-grey); --barColour: hsl(268, 39%, 10%); --barColour: var(--very-dark-violet); } /* ---- INFO PANE ---- */ .rate-box-with-credit-button{ background-color: hsl(268, 40%, 25%) !important; background-color: var(--very-dark-moderate-violet) !important; border-color: hsl(268, 40%, 25%) !important; border-color: var(--very-dark-moderate-violet) !important; border-radius: 0 !important; box-shadow: none !important; } .rate-box-with-credit-button .fa-info{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); border-color: hsl(268, 40%, 45%); border-color: var(--dark-moderate-violet); } .rate-box-with-credit-button .fa-info:hover{ color: hsl(112, 77%, 48%); color: var(--vivid-lime-green); } .rate-box-with-credit-button .cancel{ border: 0; } .close-credits, .credit-back{ filter: hue-rotate(268deg); } .modalbox{ box-shadow: 0 1px 10px hsla(282, 73%, 51%, .3); } /* ---- PAGE RATING ---- */ .page-rate-widget-box{ border: none; border-radius: 0; box-shadow: none; } .page-rate-widget-box .rate-points{ background-color: hsl(268, 40%, 25%) !important; background-color: var(--very-dark-moderate-violet) !important; border: solid 1px hsl(268, 33%, 30%); border: solid 1px var(--very-dark-muted-violet); border-radius: 0; } .page-rate-widget-box .rateup, .page-rate-widget-box .ratedown{ background-color: hsl(0, 0%, 95%); background-color: var(--very-light-grey); border-top: solid 1px hsl(268, 33%, 30%); border-top: solid 1px var(--very-dark-muted-violet); border-bottom: solid 1px hsl(268, 33%, 30%); border-bottom: solid 1px var(--very-dark-muted-violet); } .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a{ color: hsl(268, 40%, 25%); color: var--very-dark-moderate-violet); } .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .ratedown a:hover{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); background: hsl(268, 40%, 25%); background: var(--very-dark-moderate-violet); } .page-rate-widget-box .cancel{ background-color: hsl(268, 40%, 25%); background-color: var(--very-dark-moderate-violet); border: solid 1px hsl(268, 33%, 30%); border: solid 1px var(--very-dark-muted-violet); border-left: 0; border-radius: 0; } .page-rate-widget-box .cancel a{ color: hsl(268, 40%, 45%); color: var(--dark-moderate-violet); } .page-rate-widget-box .cancel a:hover{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); background: hsl(268, 40%, 25%); background: var(--very-dark-moderate-violet); border-radius: 0; } /* ---- DIV BLOCKS ---- */ blockquote, div.blockquote{ background-color: hsl(0, 0%, 91%); background-color: var(--lighter-grey); border: 1px solid hsl(0, 0%, 60%); } .pata-notice{ margin: 1em 0; padding: 0 1em; color: hsl(0, 0%, 95%); color: var(--very-light-grey); background-color: hsl(268, 40%, 25%); background-color: var(--very-dark-moderate-violet); border: 1px solid hsl(268, 33%, 30%); border: 1px solid var(--very-dark-muted-violet); text-align: center; } .code{ background-color: hsl(0, 0%, 92%); border-color: hsl(0, 0%, 82%); } /* ---- CUSTOM PAGE CONTENT CLASSES ---- */ .content-panel .panel-body{ background: hsl(0, 0%, 95%); background: var(--very-light-grey); } .content-panel .panel-footer{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); } .content-panel .panel-footer a{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); } /* ---- YUI TAB CUSTOMIZATION ---- */ .yui-navset .yui-content{ /* ---- Content Background ---- */ background-color: white; /* -------- */ } .yui-navset .yui-nav a, /* ---- Link Modifier ---- */ .yui-navset .yui-navset-top .yui-navset-left .yui-navset-right .yui-nav a{ color: hsl(0, 0%, 05%); color: var(--very-dark-grey); /* ---- Tab Background Colour | [UNSELECTED] ---- */ background-color: white; /* -------- */ background-image: none; border: solid 1px #808080; border-bottom: none; transition: .125s; } .yui-navset .yui-nav .selected a, /* ---- Selection Modifier ---- */ .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:hover{ color: hsl(0, 0%, 95%); color: var(--very-light-grey); /* ---- Tab Background Colour | [SELECTED] ---- */ background: hsl(268, 40%, 25%); background: var(--very-dark-moderate-violet); /* -------- */ } .yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus{ /* ---- Tab Background Colour | [HOVER] ---- */ background: hsl(0, 0%, 75%); background: var(--grey); /* -------- */ } .yui-navset .yui-nav, /* ---- Between Tab And Content ---- */ .yui-navset .yui-navset-top .yui-nav{ border-color: hsl(268, 40%, 25%); border-color: var(--very-dark-moderate-violet); } /* ---- STANDARD IMAGE BLOCK ---- */ .scp-image-block{ box-shadow: none; } .scp-image-block .scp-image-caption{ background-color: hsl(0, 0%, 88%); background-color: var(--light-grey); border-top: solid 1px hsl(268, 40%, 25%); border-top: solid 1px var(--very-dark-moderate-violet); } /* ---- INTERWIKI ---- */ .scpnet-interwiki-frame{ filter: hue-rotate(268deg) saturate(90%) brightness(100%); } /* ---- ADJUST MOBILE IMAGE SIZE ---- */ @media (max-width: 767px){ #top-bar .open-menu a { color: hsl(268, 40%, 25%) ; color: var(--very-dark-moderate-violet); background-color: white; border: 2px solid hsl(268, 40%, 25%); border: 2px solid var(--very-dark-moderate-violet); } #side-bar{ background-color: hsl(0, 0%, 75%); background-color: var(--grey); } #side-bar:target + #main-content{ left: 0; } } @media (min-width: 768px){ #header h1 a{ font-size: 150%; } } /* ---- REDUCED MOTION ACCESSIBILITY ---- * By SMLT **/ @media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; } }
| korbkorv |
|---|
| Author: |
| Published on 17 Apr 2019 22:55 |
/* source: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1 */ #top-bar .open-menu a { position: fixed; top: 0.5em; left: 0.5em; z-index: 5; font-family: 'Nanum Gothic', san-serif; font-size: 30px; font-weight: 700; width: 30px; height: 30px; line-height: 0.9em; text-align: center; border: 0.2em solid #888; background-color: #fff; border-radius: 3em; color: #888; } @media (min-width: 768px) { .mobile-top-bar { display: block; } .mobile-top-bar li { display: none; } #main-content { max-width: 708px; margin: 0 auto; padding: 0; transition: max-width 0.2s ease-in-out; } #side-bar { display: block!important; position: fixed; top: 0; left: -19em; width: 17em; height: 100%; margin: 0; overflow-y: auto; z-index: 10; padding: 0.3em 0.675em; background-color: rgba(0,0,0,0.1); transition: left 0.5s ease-in-out; } #side-bar:target { display: block; left: 0; width: 17em; margin: 0; z-index: 10; } #side-bar:target .close-menu { display: block; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; } #top-bar .open-menu a:hover { text-decoration: none; } .close-menu { margin-left: 19em; opacity: 0; } }
What this is
A bunch of miscellaneous CSS 'improvements' that I, Croquembouche, use on a bunch of pages because I think it makes them easier to deal with.
The changes this component makes are bunch of really trivial modifications to ease the writing experience and to make documenting components/themes a bit easier (which I do a lot). It doesn't change anything about the page visually for the reader — the changes are for the writer.
I wouldn't expect translations of articles that use this component to also use this component, unless the translator likes it and would want to use it anyway.
This component probably won't conflict with other components or themes, and even if it does, it probably won't matter too much.
Usage
On any wiki:
[[include :scp-wiki:component:croqstyle]]
This component is designed to be used on other components. When using on another component, be sure to add this inside the component's [[iftags]] block, so that users of your component are not forced into also using Croqstyle.
Related components
Other personal styling components (which change just a couple things):
Personal styling themes (which are visual overhauls):
CSS changes
Reasonably-sized footnotes
Stops footnotes from being a million miles wide, so that you can actually read them.
.hovertip { max-width: 400px; }
Monospace edit/code
Makes the edit textbox monospace, and also changes all monospace text to Fira Code, the obviously superior monospace font.
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap'); :root { --mono-font: "Fira Code", Cousine, monospace; } #edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); } .code pre * { white-space: pre; } .code *, .pre * { font-feature-settings: unset; }
Teletype backgrounds
Adds a light grey background to <tt> elements ({{text}}), so code snippets stand out more.
tt { background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4); font-size: 85%; padding: 0.2em 0.4em; margin: 0; border-radius: 6px; }
No more bigfaces
Stops big pictures from appearing when you hover over someone's avatar image, because they're stupid and really annoying and you can just click on them if you want to see the big version.
.avatar-hover { display: none !important; }
Breaky breaky
Any text inside a div with class nobreak has line-wrapping happen between every letter.
.nobreak { word-break: break-all; }
Code colours
Add my terminal's code colours as variables. Maybe I'll change this to a more common terminal theme like Monokai or something at some point, but for now it's just my personal theme, which is derived from Tomorrow Night Eighties.
Also, adding the .terminal class to a fake code block as [[div class="code terminal"]] gives it a sort of pseudo-terminal look with a dark background. Doesn't work with [[code]], because Wikidot inserts a bunch of syntax highlighting that you can't change yourself without a bunch of CSS. Use it for non-[[code]] code snippets only.
Quick tool to colourise a 'standard' Wikidot component usage example with the above vars: link
:root { --c-bg: #393939; --c-syntax: #e0e0e0; --c-comment: #999999; --c-error: #f2777a; --c-value: #f99157; --c-symbol: #ffcc66; --c-string: #99cc99; --c-operator: #66cccc; --c-builtin: #70a7df; --c-keyword: #cc99cc; } .terminal, .terminal > .code { color: var(--c-syntax); background: var(--c-bg); border: 0.4rem solid var(--c-comment); border-radius: 1rem; }
Debug mode
Draw lines around anything inside .debug-mode. The colour of the lines is red but defers to CSS variable --debug-colour.
You can also add div.debug-info.over and div.debug-info.under inside an element to annotate the debug boxes — though you'll need to make sure to leave enough vertical space that the annotation doesn't overlap the thing above or below it.
…like this!
.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after { outline: 1px solid var(--debug-colour, red); position: relative; } .debug-info { position: absolute; left: 50%; transform: translateX(-50%); font-family: 'Fira Code', monospace; font-size: 1rem; white-space: nowrap; } .debug-info.over { top: -2.5rem; } .debug-info.under { bottom: -2.5rem; } .debug-info p { margin: 0; }
@import url(https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap); @import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&display=swap); @import url(https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap); /* Flopstyle CSS Theme * [2020 Wikidot Theme] * Created by Lt Flops * Select CSS Styles Are Credited Where Necessary * -- (CC BY-SA 3.0) -- **/ /* -------- SITE HEADER -------- */ a, body, span{ word-break: unset; } #header h1 a, #header h1 a::before{ color: hsl(0, 0%, 93%); text-shadow: none; } #header h1 a{ font-family: "Montserrat", "Arial", sans-serif; font-size: 170%; letter-spacing: 0; } #header h2 span, #header h2 span::before{ color: hsl(60, 62%, 85%); font-family: "Montserrat", "Arial", sans-serif; font-weight: 500; text-shadow: none; } /* -------- TOP-BAR -------- */ #search-top-box, #top-bar, #login-status{ right: 0; } #search-top-box-form input[type="submit"]{ font-size: unset; } #search-top-box-input, #search-top-box-form input[type=submit]{ background: hsl(0, 0%, 20%); border-color: hsl(0, 0%, 60%); border-radius: 0; } #search-top-box-input:hover, #search-top-box-input:focus, #search-top-box-form input[type="submit"]:hover, #search-top-box-form input[type="submit"]:focus{ background-color: hsl(0, 0%, 30%); border-color: hsl(0, 0%, 70%); } #top-bar .open-menu a{ border-radius: unset; border-width: .1em; } /* -------- SIDE-BAR -------- */ #side-bar{ background-color: hsl(0, 0%, 50%); } #side-bar:target{ box-shadow: 0 0 90px 90px hsla(0, 0%, 0%, .3); } #side-bar .side-block{ border-color: hsl(0, 0%, 20%); border-radius: 0; } #side-bar .heading{ color: hsl(0, 0%, 5%); border-bottom: solid 1px hsl(0, 0%, 20%); } /* -------- SIDEBOXES -------- * By EstrellaYoshte * Adapted From 'Penumbra Theme' **/ .flavourText{ margin: auto; margin-bottom: .5em; padding: .25em; border: 1px solid #888; } #page-content .authorbox tr td, #page-content .sidebox tr td, #page-content .authorbox tr th, #page-content .sidebox tr th{ padding: .25em; } #page-content .authorbox tr td, #page-content .authorbox tr th, #page-content .authorbox .flavourText{ width: 15.234em; } .limit{ margin-bottom: -1rem; line-height: 141%; z-index: 5; } .limit br{ display: block; } .anchor{ position: sticky; height: 0; top: 0; z-index: 5; } .authorbox, .sidebox{ position: absolute; width: calc((100vw - 870px) / 2); max-height: calc(100vh - 18rem); margin: 0 8px 0 0; padding: .14rem; box-sizing: border-box; overflow: auto; z-index: 5; } .authorbox{ max-width: calc((100vw - 921.2px) / 2) !important; top: .5em; right: 103.5%; } .sidebox{ top: -1em; left: 103.5%; padding-left: 1em; background: hsl(0, 0%, 100%); border: 1px solid hsl(0, 0%, 73%); border-left: 8px solid var(--accentColor); } /* -------- Sidebox Mobile Optimization Courtesy of Woedenaz -------- */ @media (max-width: 1079px){ .sidebox{ width: auto; max-width: 65vw !important; top: .75rem; right: calc(((100vw - 45.8rem) / 2) * -1); left: initial; padding: 0 .4rem; background-color: var(--accentColor); border: 1px solid hsl(0, 0%, 73%); border-left: 8px solid var(--accentColor); border-radius: 0; overflow: visible; -webkit-clip-path: inset(-.125rem -.25rem 0 calc(100% - 1.275rem)); clip-path: inset(-.125rem -.25rem 0 calc(100% - 1.275rem)); -webkit-transition: color .2s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s; transition: color .2s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s; -o-transition: color .2s ease-in-out .1s, box-shadow .5s ease-in-out .1s, clip-path .5s ease-in-out .1s; transition: color .2s ease-in-out .1s, box-shadow .5s ease-in-out .1s, clip-path .5s ease-in-out .1s; transition: color .2s ease-in-out .1s, box-shadow .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s; } .sidebox::before, .sidebox::after{ content: " "; position: absolute; right: 0; } .sidebox::before{ width: 0; height: 0; top: calc(50% - .75rem); border-top: .75rem solid transparent; border-bottom: .75rem solid transparent; border-right: .75rem solid var(--accentColor); z-index: 10; transition: border .1s ease-in-out .1s; } .sidebox::after{ width: 100%; max-width: .75rem; height: 100%; max-height: calc(100vh - 18rem); top: 0; background-color: hsl(0, 0%, 100%); z-index: -1; transition: box-shadow .5s ease-in-out .1s, max-width .5s ease-in-out .1s; } .sidebox > *{ opacity: 0; -webkit-transition: opacity .2s ease-in-out .2s; -o-transition: opacity .2s ease-in-out .2s; transition: opacity .2s ease-in-out .2s; } .sidebox:hover{ overflow: visible; -webkit-clip-path: inset(-.125rem -.25rem 0 0); clip-path: inset(-.125rem -.25rem 0 0); -webkit-transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s; transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s; -o-transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, box-shadow .5s ease-in-out .1s; transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, box-shadow .5s ease-in-out .1s; transition: color .5s ease-in-out .2s, right .5s ease-in-out .1s, clip-path .5s ease-in-out .1s, box-shadow .5s ease-in-out .1s, -webkit-clip-path .5s ease-in-out .1s, -webkit-box-shadow .5s ease-in-out .1s; } .sidebox:hover::before{ border-top: 0 solid transparent; border-bottom: 0 solid transparent; } .sidebox:hover::after{ max-width: 100%; right: 0; } .sidebox:hover > *{ opacity: 1; } } @media (max-width:768px){ .sidebox, .sidebox:hover{ right: calc(((100vw - (100% - 3rem)) / 2) * -1 + 1rem); } } @media (max-width: 1079px){ .authorbox{ display: none; visibility: hidden; } } /* -------- GENERAL -------- */ :root{ --accentColor: hsl(0, 100%, 30%); --vivid-lime-green: hsl(112, 77%, 48%); } body{ color: hsl(0, 0%, 5%); word-break: unset; } #search-top-box-input, #search-top-box-input:hover, #search-top-box-input:focus, #search-top-box-form input[type=submit], #search-top-box-form input[type=submit]:hover, #search-top-box-form input[type=submit]:focus, #top-bar ul li ul, #side-bar .side-block, .page-rate-widget-box, .scp-image-block{ box-shadow: none; } /* -------- INFO BAR -------- */ body{ --barColour: hsl(0, 89%, 18%); } .u-faq{ display: none; } .info-container .collapsible-block-content{ padding: 0 .5em 30px; } .info-container .collapsible-block-content .wiki-content-table, .footer-wikiwalk-nav .collapsible-block .wiki-content-table{ width: 90%; } /* -------- INFO PANE -------- */ .creditRate{ margin-right: 0 !important; } .rate-box-with-credit-button{ border-radius: 0 !important; box-shadow: none !important; } .creditButton p a:hover, .creditButtonStandalone p a:hover{ color: var(--vivid-lime-green) !important; } div.credit.first .wiki-content-table { width: 100%; } /* -------- PAGE RATING -------- */ .page-rate-widget-box{ margin-right: 0; } .page-rate-widget-box, .page-rate-widget-box .rate-points{ border-radius: 0; } .page-rate-widget-box .cancel, .page-rate-widget-box .cancel a:hover{ border-radius: 0 !important; } /* -------- FORMATTING | [GENERAL] -------- */ #page-content h1, #page-content h2, #page-content h3, #page-content h4, #page-content h5, #page-content h6{ display: flex; flex-direction: column; justify-content: center; margin-bottom: .57em; text-align: center; word-break: unset; } hr{ height: 0; margin: 1em 0; background-color: transparent; border-top: 1px solid hsl(0, 0%, 67%); } .collapsible-block-link{ font-size: 120%; font-weight: bold; } .info-container .collapsible-block-link{ font-size: 100%; } ol li{ margin: 0 0 1em; } ul{ margin:1em 0; } .footnotes-footer, .bibitems{ padding: 0 0 .5em; } /* -------- IMAGE BLOCK -------- */ .scp-image-block .scp-image-caption{ font-size: 95%; } .scp-image-block.block-right{ margin: 0 0 1em 2em; } /* -------- CUSTOM DIV BLOCKS -------- */ .raisa-header, .pink-header, .oracle-header{ margin-bottom: 1em; padding: 0 .5em; text-align: center; } .raisa-header{ /* ---- RAISA Notice Header ---- */ background: hsl(60, 65%, 85%); border: 1px solid hsl(0, 0%, 60%); } .pink-header{ /* ---- Pretty Header ---- */ background: hsl(350, 100%, 85%); border: 1px solid hsl(0, 4%, 36%); } .pink-header hr{ border-color: hsl(0, 4%, 36%); } .oracle-header{ /* ---- SPC's 'From the Desk of ORACLE' Header ---- */ color: hsl(208, 100%, 97%); background: hsl(208, 67%, 44%); border: 2px solid hsl(0, 0%, 5%); } .oracle-header hr{ border-color: hsl(208, 100%, 97%); } .img-resize img{ /* ---- Header Icons (See Example Formatting) ---- */ float: left; width: auto; height: 8em; margin: .5em; } blockquote, /* ---- Regular Quote Block ---- */ div.blockquote{ background-color: hsl(0, 0%, 96%); border: 3px double hsl(0, 0%, 60%); } .alt-blockquote{ /* ---- Alternative Quote Block ---- */ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 96%); border: 1px solid hsl(0, 0%, 60%); border-radius: 1em; } .lightweight{ /* ---- Lightweight Quote Block ---- */ margin: 1em 3em; padding: 0 1em; background-color: hsl(0, 0%, 90%); text-align: left; } .card-block{ /* ---- Decorative Quote Block ---- */ margin: 1em 0; padding: .6em 1.2em; background: hsl(220, 15%, 93%); border-left: 8px solid var(--accentColor); border-radius: .48em; } blockquote hr, div.blockquote hr, .alt-blockquote hr, .lightweight hr, .card-block hr{ border-color: hsl(0, 0%, 67%); } .log-header{ /* ---- Interview/Exploration Log Header ---- */ margin-bottom: 1em; padding: 0 1em; background: hsl(0, 0%, 96%); border: 3px dashed hsl(0, 0%, 60%); border-radius: 2em; } .report-box{ /* ---- Report Block ---- */ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 100%); border: medium solid hsl(0, 0%, 5%); } .report-box hr{ border-color: hsl(0, 0%, 5%); } .realistic-shadow{ /* ---- Better Shadows ---- */ margin: 1em 0 2em 0; box-shadow: 0 1px 1px hsla(0, 0%, 0%, .23), 0 2px 2px hsla(0, 0%, 0%, .18), 0 4px 4px hsla(0, 0%, 0%, .15), 0 8px 8px hsla(0, 0%, 0%, .13); } .report-box.red-tint{ /* ---- Alternative Report Block Variants ---- */ background-color: hsl(360, 91%, 86%); border-color: hsl(360, 62%, 66%); } .report-box.red-tint hr{ border-color: hsl(360, 62%, 66%); } .report-box.orange-tint{ background-color: hsl(30, 91%, 86%); border-color: hsl(30, 62%, 66%); } .report-box.orange-tint hr{ border-color: hsl(30, 62%, 66%); } .report-box.yellow-tint{ background-color: hsl(60, 91%, 86%); border-color: hsl(60, 62%, 66%); } .report-box.yellow-tint hr{ border-color: hsl(60, 62%, 66%); } .report-box.green-tint{ background-color: hsl(120, 91%, 86%); border-color: hsl(120, 62%, 66%); } .report-box.green-tint hr{ border-color: hsl(120, 62%, 66%); } .report-box.cyan-tint{ background-color: hsl(180, 91%, 86%); border-color: hsl(180, 62%, 66%); } .report-box.cyan-tint hr{ border-color: hsl(180, 62%, 66%); } .report-box.blue-tint{ background-color: hsl(240, 91%, 86%); border-color: hsl(240, 62%, 66%); } .report-box.blue-tint hr{ border-color: hsl(240, 62%, 66%); } .report-box.magenta-tint{ background-color: hsl(300, 91%, 86%); border-color: hsl(300, 62%, 66%); } .report-box.magenta-tint hr{ border-color: hsl(300, 62%, 66%); } .report-box.grey-tint{ background-color: hsl(210, 9%, 86%); border-color: hsl(210, 15%, 42%); } .report-box.grey-tint hr{ border-color: hsl(210, 15%, 42%); } div.o5-box{ /* ---- Overseer Document Block ---- */ margin: 1em 6em; padding: 0 1em; background-color: hsl(0, 0%, 75%); border: medium solid hsl(0, 0%, 5%); } div.o5-box hr{ border-color: hsl(0, 0%, 5%); } .faux-source{ /* ---- Mimics "Page Source" Appearance ---- */ margin-bottom: 1em; padding: 0 2em; background-color: hsl(0, 0%, 100%); border: 1px dashed hsl(0, 0%, 67%); font-family: var(--mono-font); } .narration{ /* ---- Mimics the Pages of a Book ---- */ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 100%); border: 1px solid hsl(0, 0%, 63%); } .warning-notice{ /* ---- Simple Warning Block (Adapted From 'SCP-3143') ---- */ padding: 0 1em; background-color: hsl(0, 0%, 100%); background-image: url(https://scp-wiki.wdfiles.com/local--files/scp-style-resource/scp_trans.png); background-position: center; background-repeat: no-repeat; border: medium solid hsl(0, 0%, 5%); text-align: center; } .warning-notice hr{ border-color: hsl(0, 0%, 5%); } .journal{ /* ---- Journal Block (Adapted From 'SCP-4003') ---- */ margin: 1em 0; padding: .9em; background-image: linear-gradient(to top, hsl(201, 33%, 84%) 0%, hsl(60, 29%, 89%) 8%); background-position: 0 8px; background-size: 100% 1.3rem; border: 1px solid hsl(0, 0%, 80%); border-radius: .9em; font-family: "Architects Daughter", cursive; } .journal p{ margin: 0; font-size: 1.3rem; line-height: 1.3rem; } .sms-message{ /* ---- SMS Message Block ---- */ float: left; clear: left; width: 22.4em; margin: 0 0 1em; padding: 0 1.2em; background: hsl(0, 0%, 75%); border-radius: 2em; font-size: 112.5%; text-align: center; } blockquote .collapsible-block-folded, .alt-blockquote .collapsible-block-folded, .lightweight .collapsible-block-folded, .card-block .collapsible-block-folded, .report-box .collapsible-block-folded, .o5-box .collapsible-block-folded, .narration .collapsible-block-folded, .journal .collapsible-block-folded, div.blockquote .collapsible-block-folded{ /* ---- For Collapsibles Inside Divs | [CLOSED] ---- */ padding: .75em 0; /* -------- */ } blockquote .collapsible-block-unfolded, .alt-blockquote .collapsible-block-unfolded, .lightweight .collapsible-block-unfolded, .card-block .collapsible-block-unfolded, .report-box .collapsible-block-unfolded, .o5-box .collapsible-block-unfolded, .narration .collapsible-block-unfolded, .journal .collapsible-block-unfolded, div.blockquote .collapsible-block-unfolded{ /* ---- For Collapsibles Inside Divs | [OPEN] ---- */ padding-top: .75em; /* -------- */ } /* -------- FORMATTING | [SPECIAL] -------- */ .centered{ /* ---- Center-Aligns Text ---- */ text-align: center; } .justified{ /* ---- Justify-Aligns Text ---- */ text-align: justify; } .indented{ /* ---- Indents Block by ½-inch/2em (Use Within Other Divs) ---- */ text-indent: 2.4em; } .indented .bibcite, .indented .footnoteref, .indented ul, .indented ol, .indented .scp-image-block.block-right, .indented h1, .indented h2, .indented h3, .indented h4, .indented h5, .indented h6, .indented .scene-break, .indented .footnotes-footer, .indented .bibitems{ text-indent: 0; } .rev-red, .rev-green, .rev-blue, .rev-yellow, .terminal-span{ font-weight: bold; } .rev-red{ /* ---- Red Document Revision Text ---- */ color: hsl(360, 100%, 27%); } .rev-green{ /* ---- Green Document Revision Text ---- */ color: hsl(120, 100%, 27%); } .rev-blue{ /* ---- Blue Document Revision Text ---- */ color: hsl(240, 100%, 27%); } .rev-yellow{ /* ---- Yellow Document Revision Text ---- */ color: hsl(40, 100%, 40%); } .terminal-span{ /* ---- Computer Terminal Text ---- */ font-family: var(--mono-font); font-size: 110%; letter-spacing: .3px; } /* ---- Blinking Text Cursor (Adapted From 'Your Very First SCP!') ---- */ .blinkbar{color: black; animation: blink 1.5s infinite;} @keyframes blink{to{opacity: .0;}} @keyframes flicker{0% {opacity: .9890; }5% {opacity: .5842; }10% {opacity: .9865; }20% {opacity: .0412; }20% {opacity: .6255; }25% {opacity: .3157; }30% {opacity: .7328; }35% {opacity: .4654; }40% {opacity: .9128; }45% {opacity: .2449; }50% {opacity: .5485; }55% {opacity: .6438; }60% {opacity: .1180; }65% {opacity: .9085; }70% {opacity: .0266; }75% {opacity: .6795; }80% {opacity: .7812; }85% {opacity: .0117; }90% {opacity: .2239; }95% {opacity: .8897; }100% {opacity: .2260; }} @keyframes overlay-anim{0% {visibility: hidden; }10% {visibility: hidden; }11% {visibility: visible; }50% {visibility: hidden; }100% {visibility: hidden; }} .lite-heading{ /* ---- Special Heading Area (Adapted From 'SCP-4058') ---- */ clear: both; margin: 3.6em auto; } .lite-heading h3{ color: hsl(360, 100%, 27%); } .lite-heading hr{ width: 55%; margin: auto; border-width: medium; } div.image-showcase{ /* ---- Alternative Image Showcase ---- */ width: 25em; margin-bottom: 1em; background: hsl(0, 0%, 100%); border: 3px ridge hsl(0, 0%, 5%); } div.image-showcase.block-center{ margin-right: auto; margin-left: auto; } .scene-break{ /* ---- Fancy Scene/Section Break ---- */ width: 3.5em; margin: 2em 0; } .listPagesNav{ margin-bottom: 5em; } .listPagesNav-prev, /* ---- ListPages Navigation (Adapted from 'SCP-5552') ---- */ .listPagesNav-next{ width: 45%; margin: 0 0 1em; padding: 0 2%; background: hsl(0, 0%, 90%); border: 1px solid hsl(0, 0%, 60%); } .listPagesNav-prev{ float: left; text-align: left; } .listPagesNav-next{ float: right; text-align: right; } .fade-away{ background: linear-gradient(to bottom, hsl(0, 0%, 95%), hsl(0, 0%, 5%)); } .footing::before{ /* ---- Page Footing ---- */ content: " "; position: absolute; bottom: 1px; left: 0; right: 0; border-bottom: 2px solid hsl(0, 0%, 47%); } .footing{ position: relative; bottom: -2px; margin-bottom: 2px; border-bottom: 1px solid hsl(0, 0%, 47%); } .related-flex{ /* ---- Related Articles Box ---- */ display: flex; justify-content: center; } .related{ margin: 1em 0; padding: 0 1em; background-color: hsl(0, 0%, 100%); border: thick solid hsla(0, 0%, 60%, 0.5); text-align: left; } .series-nav{ /* ---- Series Navigation ---- */ margin: .5em 0; background: linear-gradient(to bottom right, hsla(0, 0%, 100%, 1), hsla(0, 0%, 50%, .5)); border: outset 1.5px hsl(0, 0%, 5%); border-radius: 2em; font-size: 85%; font-weight: bold; text-align: center; } /* -------- ADVANCED WARNING HEADER -------- * Adapted From 'SCP-001-JP - indonootoko's Proposal' * See the Example at the Top of the Page **/ .orderwrapper{ position: relative; width: auto; text-align: center; } .council{ position: relative; top: 0; bottom: 0; left: 0; right: 0; width: 295px; height: 295px; margin: auto; background-image: url(https://scp-wiki.wdfiles.com/local--files/scp-style-resource/scp_trans.png); background-position: center; background-repeat: no-repeat; background-size: 295px 295px; } .ordertitle{ position: absolute; top: 27px; left: 0; right: 0; } .ordertitle h1{ color: hsl(0, 0%, 5%); font-size: 220%; line-height: 90%; } .orderdescription{ position: absolute; top: 93px; left: 0; right: 0; width: 100%; } .orderdescription h1{ color: hsl(0, 0%, 5%); font-size: 120%; } .orderdescription p{ color: hsl(0, 0%, 5%); font-size: 90%; } .itemno{ position: absolute; bottom: 18px; left: 0; right: 0; } .itemno h1{ color: hsl(0, 0%, 5%); font-size: 170%; } /* -------- YUI TAB BASE -------- */ .yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{background-color:inherit;background-image:inherit}.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{background:inherit;text-decoration:inherit}.yui-navset .yui-nav .selected a,.yui-navset .yui-nav .selected a:focus,.yui-navset .yui-nav .selected a:hover{color:inherit;background:inherit}.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{border-color:inherit}.yui-navset li{line-height:inherit} /* -------- YUI TAB CUSTOMIZATION -------- * Adapted From 'Black Highlighter Theme' **/ .yui-navset *{ transition: color 80ms cubic-bezier(.4, 0, .2, 1), background-color 80ms cubic-bezier(.4, 0, .2, 1); } .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav{ display: flex; flex-wrap: wrap; width: calc(100% - .125rem); margin: 0 auto; border-color: hsl(360, 94%, 20%); box-shadow: 0 calc(.0625rem * 5) 0 0 hsl(360, 94%, 20%); } .yui-navset .yui-nav a, /* ---- Link Modifier ---- */ .yui-navset .yui-navset-top .yui-nav a{ color: hsl(0, 0%, 5%); /* ---- Tab Background Colour | [UNSELECTED] ---- */ background-color: hsl(0, 0%, 99%); /* -------- */ background-image: none; border: unset; } .yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus{ color: hsl(0, 0%, 96%); /* ---- Tab Background Colour | [HOVER] ---- */ background-color: hsl(360, 100%, 27%); /* -------- */ } .yui-navset .yui-nav li, /* ---- Listitem Modifier ---- */ .yui-navset .yui-navset-top .yui-nav li{ position: relative; display: flex; flex-grow: 2; max-width: 100%; margin: 0; padding: 0; background-color: hsl(0, 0%, 96%); border-color: transparent; box-shadow: 0 0 0 .0625rem hsl(360, 94%, 20%); } .yui-navset .yui-nav li a, .yui-navset-top .yui-nav li a, .yui-navset-bottom .yui-nav li a{ display: flex; align-items: center; justify-content: center; width: 100%; } .yui-navset .yui-nav li em{ border: unset; } .yui-navset .yui-nav a em, .yui-navset .yui-navset-top .yui-nav a em{ padding: .35em .75em; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .yui-navset .yui-nav .selected, /* ---- Selection Modifier ---- */ .yui-navset .yui-navset-top .yui-nav .selected{ flex-grow: 2; margin: 0; padding: 0; /* ---- Tab Background Colour | [SELECTED] ---- */ background-color: hsl(360, 94%, 20%); /* -------- */ } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em{ border: hsl(360, 94%, 20%); } .yui-navset .yui-nav .selected a{ width: 100%; color: hsl(0, 0%, 96%) !important; background-image: none; } .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:active{ color: hsl(0, 0%, 96%); background-color: hsl(360, 94%, 20%); } .yui-navset .yui-nav .selected a:hover{ cursor: default; } .yui-navset-left .yui-content{ /* ---- Content Background ---- */ background-color: hsl(0, 0%, 99%); /* -------- */ } .yui-navset .yui-content, .yui-navset .yui-navset-top .yui-content{ padding: .5em; border-color: hsl(0, 0%, 60%); } /* -------- PAGE TAGS -------- */ #main-content .page-tags{ border-top: 1px solid hsl(0, 0%, 73%); } #main-content .page-tags a{ display: inline-block; height: .8125rem; margin: 0 0 .5rem .75rem; padding: .1875rem .3125rem .1875rem 0; color: hsl(0, 0%, 95%); background-color: hsl(0, 0%, 27%); border-bottom-right-radius: .25rem; border-top-right-radius: .25rem; line-height: 13px; line-height: .8125rem; font-size: 11px; font-size: .6875rem; font-weight: normal; } #main-content .page-tags a:before{ width: 0; height: 0; top: -.1875rem; left: -.625rem; padding: 0 .0625rem .1875rem; border-color: transparent hsl(0, 0%, 27%) transparent transparent; border-style: solid; border-width: .5rem .5rem .5rem 0; } #main-content .page-tags a:before, #main-content .page-tags a:after{ content: ""; position: relative; float: left; } #main-content .page-tags a:after{ width: .25rem; height: .25rem; top: .2813rem; left: -.5rem; background-color: hsl(0, 0%, 100%); border-radius: .125rem; } #main-content .page-tags span{ max-width: 100%; border-top: .5rem solid transparent; } /* -------- INTERWIKI -------- */ iframe.scpnet-interwiki-frame{ position: relative; width: 15.734em; height: unset; margin-bottom: .78em; margin-left: 4px; background-color: hsl(0, 0%, 100%); border: 2px solid hsl(0, 0%, 20%); } /* -------- SHOW-CHANGES HIGHLIGHTS -------- */ .inline-diff ins::before{ color: hsl(240, 100%, 93%); } .inline-diff del::before{ color: hsl(0, 100%, 90%); } .inline-diff ins + del::before, .inline-diff del + ins::before{ color: transparent; } .inline-diff br + ins::before, .inline-diff br + del::before, .inline-diff ins:first-of-type::before, .inline-diff del:first-of-type::before{ position: absolute; display: inline-block; left: -1em; content: "\f111"; font: normal normal normal 16px/1 "FontAwesome"; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* -------- PRESENTATION -------- */ .templateInfo{ margin: 1em 0; padding: 0 1em; background: hsl(0, 0%, 100%); border: 1px solid hsl(0, 0%, 87%); } /* -------- CROQSTYLE ALTERATIONS -------- */ #edit-page-textarea{ font-family: unset; } tt{ background-color: unset; font-size: unset; padding: unset; margin: unset; border-radius: unset; } /* -------- REDUCED MOTION ACCESSIBILITY -------- */ @media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; } } /* -------- MOBILE MEDIA QUERY -------- */ @media (max-width: 479px){ #header h1 a{ font-size: 85%; } div.image-showcase{ width: 90%; } div.o5-box{ margin: 1em 0; } } /* -------- NOTE MEDIA QUERY -------- */ @media (min-width: 480px) and (max-width: 580px){ #header h1 a{ font-size: 100%; } div.image-showcase{ width: 100%; } div.o5-box{ margin: .5em; } } /* -------- MINI TABLET MEDIA QUERY -------- */ @media (min-width: 581px) and (max-width: 767px){ #header h1 a{ font-size: 120%; } } @media (max-width: 767px){ .open-menu a:hover{ box-shadow: none; } } /* -------- TABLET MEDIA QUERY -------- */ @media (min-width: 768px) and (max-width: 979px){ #header h1 a{ font-size: 140%; } }
Special Containment Procedures: Due to the intricate nature of the ritual required to access SCP-XXXX, and the previous anomalous knowledge necessary to perform it, risk of civilians being exposed to the anomaly is considered extremely low and it is therefore categorized as a Safe-class item. However, all objects recovered from SCP-XXXX-1's personal residence pertaining to SCP-XXXX have been moved into Safe-class Containment Lockers in Site 26.
Description: SCP-XXXX is an extradimensional space solely occupied by the corpse of former literary criticist Hugo Gavel, henceforth referred to as SCP-XXXX-1, and one (1) non-anomalous specimen of slender-billed vulture (Gyps tenuirostris), designated SCP-XXXX-2. SCP-XXXX is accessed by the performance of the ritual presented in Addendum-XXXX-2, given all steps are performed correctly.
SCP-XXXX does not comply to the laws of Euclidean geometry. Moving as far as 2.5km in any direction from SCP-XXXX-1 always results in apparently circling back to the point of origin. This also applies to upwards elevation: subjects attempting to elevate themselves 2.5km above SCP-XXXX-1 will briefly de-manifest and subsequently re-appear on their original coordinates.
The sole component of SCP-XXXX's ground floor is a spongiform substance of unidentified chemical make-up. Any attempts to remove any portion of it for analysis or excavation have proved it to be anomalously indestructible. The substance has been noted to physically resemble damaged brain tissue under microscopic observation.
Hume levels and Caras-Jeung indicators1, as well as the journal recovered from SCP-XXXX-1's personal residence (featured in Addendum-XXXX-2), suggest that SCP-XXXX exists only as a metaphysical and conceptual plane. Following the intensity of Caras-Jeung indicators in a radial field, SCP-XXXX's original point of conceptualization is theorized to be SCP-XXXX-1's temporal lobe. Given the nature of SCP-XXXX-A events, SCP-XXXX is expected to self-neutralize at an unpredictable date in the near future.
SCP-XXXX-A events are events in which SCP-XXXX-2 materializes and feeds on one body part of SCP-XXXX-1. SCP-XXXX-A events occur periodically every 60 hours, lasting 5-10 minutes, and the size and nature of the body part that SCP-XXXX-2 consumes during each event varies with no predictable pattern.
As of 03/05/2021, examples of the areas of SCP-XXXX-1 that have been consumed include all fingers of its left hand, its amygdala, tongue, upper lip, right knee joint and four different sections of the small intestine.
SCP-XXXX-2 has not been visualized outside of SCP-XXXX-A events. It seemingly materializes from any unobserved spot at least 2.5km in distance from SCP-XXXX-1. Notably, the latter is physically dead until the occurrence of a SCP-XXXX-A event, at which point it resumes brain activity and expresses signs of pain and distress. However, it has not been observed to respond to any external stimuli not originating from SCP-XXXX-2's actions.
Addendum-XXXX-1: Discovery Following reports of SCP-XXXX-1 suddenly collapsing, and its corpse later vanishing from a hospital morgue in Manchester, New Hampshire, Foundation agents embedded near the city called for an investigation with regards to the anomalous occurrence.
Morgue workers who witnessed the event were amnesticized, and cover stories suggesting a hoax were disseminated. A raid was conducted on SCP-XXXX-1's personal home, where it lived with its spouse and children, resulting in the recovery of the following objects:
- An un-sent letter in an envelope, directed to PoI-XXXX (Michael Gavel, SCP-XXXX-1's father)
- A journal belonging to SCP-XXXX-1, ennumerating the steps needed to access SCP-XXXX
- An MRI scan of PoI-XXXX's brain
- A manuscript of "Greek Myths and How to Forget Them"2, a novel written by PoI-XXXX around 1980 and later published in 1982 by ████████ Editorials to poor critical reception
- A 1:1 replica of "The Torture of Prometheus" by Salvatore Rosa, oil painting.
Addendum-XXXX-2: Items recovered from SCP-XXXX-1's residence.
- The un-sent letter, directed to PoI-XXXX:
My dearest father,
I fondly remember the day you first showed me "Greek Myths". I was around fourteen. I remember being so impressed - that my own father was so magnificently gifted in the arts, and that, if I applied myself to it, I could be as well
It was that fateful day, with us sitting in that spot of the backyard that we liked because the light hit just right, that I knew literature would be incredibly important to me in the years to come, and that it would remain so for decades, well into my adult life. So I read, and I read, and I was as well acquainted with the classics as I was with more experimental writing, such as yours. However, none of them would impress me as much as your fascinating little novel did. It was a perfect mix of realism and surrealism; a flawless marriage between the absurd and the mundane. If Hemingway were to have written "Naked Lunch", it would surely have been akin to "Greek Myths".
You must realize, then, how devastated I was when you published the book as an incredibly edited version of what you first showed me. Sure, the main aspects of the story were still there - Jacob the filmmaker's parallels to the myth of Prometheus, him curing his chronic depression just by forgetting it's there, etc. However, the grandeur of that first draft you showed me back in that hot summer day in the backyard was nowhere to be found. To this day, I still don't understand why you chose to hide the true nature of the novel from the world.
You were never clear about the changes you made. You mentioned "honesty", "cheating", but it must have been obvious to you that I never understood. I only hope you would have shared what you showed me with everyone else. That would have made you happier.
Regardless, I want you to know that "Greek Myths" changed my life. Thanks to it, I was an artist, and although I suffered, I also reveled in the beauty of art and the grandiosity of human creation. You showed me the light.
That's why I cannot stand to see you go. Yours is a vile and cruel disease, but I believe I have found the way to save you and your artistic prowess. I believe I can keep the fire alive. After all, it is but an allegory, a metaphor, an allusion - a concept. I'll be seeing you soon, father, as soon as you wake up.
Love, and forever in your debt,
Hugo.
- Page from SCP-XXXX-1's journal, ennumerating ritualistic steps needed to access SCP-XXXX:
- Transpose3 dad's MRI and the painting
- Read page 44 of Greek Myths (from "Thus, he would…" to "…evergreen in his heart.")
- Drift to sleep
Addendum-XXXX-3: Additional Notes: Further investigation into PoI-XXXX have revealed he recovered from his previously diagnosed Creutzfeld-Jakob disease through anomalous means. All records of his diagnosis and hospitalization have thus been removed from the public record, and any attending doctors or nurses have been amnesticized. Additionally, a recent post-mortem MRI scan of SCP-XXXX-1 confirm it died from late-stage Creutzfeld-Jakob. The entity showed no symptoms of it previous to its death.
revisit this thing using the details from the PM.
Item #: SCP-XXXX
Object Class: Euclid
Special Containment Procedures: The building housing SCP-XXXX-3 (henceforth known as "SCP-XXXX-A") has been purchased and masked as a regular inhabited household. Any visitors or people unrelated to the Foundation must be turned away by the personnel residing within the building. In case of a sighting of an entity matching SCP-XXXX-4's descriptions anywhere other than SCP-XXXX-A, it must be taken into Foundation custody until its relation to SCP-XXXX is confirmed, at which point it will be taken to SCP-XXXX-A for containment.
If at some point in the future someone matching SCP-XXXX-1's descriptions is brought to the Foundation's attention and warrants designation as a PoI, the O5 Council shall make a decision on whether to persecute him or not, as persecution may result in the unwilling creation of a temporal anomaly.
Description: SCP-XXXX is the collective term for SCP-XXXX-A, a house in Manchester, England, the inhabitants who occupied and will occupy it fom 1876 to an unknown date in the future, and the temporal displacement that they will suffer at a similarly unkown future date. These inhabitants are the P████ family, composed of SCP-XXXX-1, -2, -3 and a theorized -4. SCP-XXXX-A's current inhabitant is SCP-XXXX-3. No records of a P████ family matching SCP-XXXX-3's given descriptions currently exist.
How the passage of time functions in SCP-XXXX-A, and its linearity, is as of yet not completely understood. It appears that various parallel timelines exist within it, periodically interacting with each other. Each timeline seems to host a different SCP-XXXX-A inhabitant, and any object within the house left undisturbed for a minimum of 24 hours will materialize in one or more of the other timelines. According to SCP-XXXX-3,
- Objects in SCP-XXXX-1's timeline can materialize in SCP-XXXX-2, SCP-XXXX-3 and SCP-XXXX-4's respective timelines.
- Objects in SCP-XXXX-2's timeline can materialize in SCP-XXXX-3 and SCP-XXXX-4's respective timelines.
- Objects in SCP-XXXX-3's timeline can materialize in SCP-XXXX-4's timeline.
- Objects in SCP-XXXX-4's timeline cannot materialize in any other timeline.
Graph showing how the four timelines interact.
SCP-XXXX-3 claims that its parents and sister live in SCP-XXXX-A in different periods of time. Thanks to old records, it can be confirmed that SCP-XXXX-1 lived in SCP-XXXX-A from 1876 to 1894 and SCP-XXXX-2 did so from late 1953 to early 1954. No record of either of them exists anywhere prior to these times.
Carvings on the walls, as well as objects such as written notes, have been observed to form within SCP-XXXX-A. Said objects are almost always in a severely damaged state, and testing reveals they originate from periods of time between 1876 and 1954.
Addendum A: Samples of recorded messages from SCP-XXXX-1 and SCP-XXXX-2| Message | Medium | Estimated Date | Notes |
|---|---|---|---|
| "Don't think 2way com is possible Miss u all Hope u receive" | Small carving on the wall, presumably with a knife. | 1876 | One of the few carvings still present in SCP-XXXX-A. Others have been destroyed or disfigured mostly due to fire damage. |
| "Have you kids been taking care of yourselves? It pains me immensely that I did not get to see you grow… I'll write more soon. I'm sure you know what big event's happening tomorrow; it'll be a great time to bond with the locals. You know what they say, new year new me. Lots of love, Mom." | Written on a notebook | 1953 | The notebook containing the message was found in the main bedroom's bathroom. On 01/01/1954, there was a fire that consumed part of SCP-XXXX-A, killing SCP-XXXX-2. |
| "Sorry Mary too long no see" and various repetitions and variations of "she was just like you" | Written with paint several times in the main bedroom's walls | 1879 | Other messages were unreadable due to the paint peeling off. |
Addendum B: Interviews with SCP-XXXX-3.
Interviewed: SCP-XXXX-3
Interviewer: Lead Researcher Kapranos
Foreword: First interview with SCP-XXXX-3, conducted in SCP-XXXX-A's living room.
<Begin Log>
Lead Researcher Kapranos: Good morning, Mr. P████. How are you feeling today?
SCP-XXXX-3: Well, you know, um… (chuckles) It's kinda weird, y'know? I'm pretty sure you guys are what my dad was always so scared of, but I guess I never really believed you were real.
Lead Researcher Kapranos: Can you elaborate?
SCP-XXXX-3: Surely you're some secret government organization or something that makes sure that… well, makes sure that everything is as it should be, right? Well, my dad had a thing for breaking the laws of nature. Has a thing. Will have a thing. Honestly, I'm not too sure anymore.
Lead Researcher Kapranos: Noted. So I take it your father is the source of the anomalous events occuring in this house?
SCP-XXXX-3: Yeah, kinda. But… it's not only him. It's all of us, in a way.
Lead Researcher Kapranos: All of you?
SCP-XXXX-3: My dad, my mom, my sister, we're all here in the same house, or at least that's what I think. We're just… lost in time. Separated. Not fully, though. We have ways to talk.
Lead Researcher Kapranos: How do you communicate?
SCP-XXXX-3: Time here… it's… it's not linear. How do I explain this? My dad could tell you exactly what's going on, but I never had his brains. Of course, he didn't mean it to be this way, but he probably already figured out what's happening. Rose probably knows too, but I'm… I'm not…
Lead Researcher Kapranos: Mr. P████, please explain everything in a calm manner.
SCP-XXXX-3: Of course. Yeah. (exhales deeply) Okay, here goes. See, things weren't going too well back then. In the future. I was young. I didn't really understand, and for the life of me I can't remember, but things weren't good for us, see? Dad kept saying that they, someone, was coming for him, and that we should go back to the good old days, when everything was simpler. Fuck me if I know when that was. So he used one of those weird tricks of his, and told us all that we had no more time here and we were going back. Then, I don't know what happened. Maybe he didn't have enough time to perfect his trick, 'cause he sounded pretty hurried. Thing is, I woke up and I was alone, and the house look so weird. It looked… old. I spent a day crying to myself, and then I started seeing messages on the wall. At first I thought I was going crazy, but soon I realized that my dad had figured out what was going on. And he wrote us stuff, with a knife. He told us that he couldn't see anything we told him, but he could talk to all of us. My mom started writing us stuff too, but on paper. She was never one to damage walls. And I followed, started writing things for my sister.
Lead Researcher Kapranos: So your mother and father leave you messages?
SCP-XXXX-3: My… my dad still does. But, um… gosh, not many things survive the fire. And… he doesn't know. He has no way of knowing… I… Sorry, he's…
Lead Researcher Kapranos: That's enough for today, Mr. P████. Thank you for your time. We'll make sure you're well looked after.
<End Log>
Interviewed: SCP-XXXX-3
Interviewer: Lead Researcher Kapranos
Foreword: Second interview with SCP-XXXX-3.
<Begin Log>
Lead Researcher Kapranos: Let's start. Mr. P████, I will be calling you SCP-XXXX-3 from now on. Is this understood?
SCP-XXXX-3: Yes.
Lead Researcher Kapranos: Great. Now, do you remember where we left off last time?
SCP-XXXX-3: Yes, the fire.
Lead Researcher Kapranos: That is correct. Can you explain what happened?
SCP-XXXX-3: It was… about a year into the whole… incident. I woke up, and the house looked different. The wood was charred. And there was this… intense, horrible smell coming from the kitchen. So I… (coughs) Sorry. I went there, and… It was an old, rotten, burnt corpse. At first, I, um, I thought it was my dad- he's the careless one. But… right there and then, the wall changed. Carvings. They, um… directed to my mom. "Love you, Mary", they said. And then I realized. He… he doesn't know, if he's still alive. He'll never know. Jesus, I… I just hope he got a proper burial. My mom… I had to bury her in the backyard.
Lead Researcher Kapranos: Is that all?
SCP-XXXX-3: God, you're cold. Yes, that's all. Fuck. I can't talk with my dad a lot anymore. Not much gets past the fire. I write a lot to my sister. Hopefully she's receiving my messages. I always cared about her a lot. She shared my dad's interests, so she'll be a lot more helpful to you guys than I can ever be.
Lead Researcher Kapranos: Then we look forward to meeting her. You mentioned your father could be running from us?
SCP-XXXX-3: I mean, unless there's other people like you out there. We wouldn't have tried to escape if it wasn't because there was somebody chasing us, that's all I know. If it was you guys, you're kinda responsible for this whole mess.
Lead Researcher Kapranos: Understood. Thank you for your cooperation, SCP-XXXX-3. I hope time is good to you now.
<End Log>
Addendum C: SCP-XXXX-3 has requested a computer with USB ports and a flash drive in which to store files. Request granted, with the condition that all activity realized in the computer must be monitored by a Foundation agent.
Addendum D: I don't know what SCP-XXXX-1 was up to, but if it was really us chasing him, and if he felt he had to run, then it was anomalous, which translates to potentially dangerous. Seems like this is a self-containing anomaly in that way: we monitor the house until SCP-XXXX-4 is gone, and in return we don't have to risk it with a PoI in the future. To whomever may care, the creation of SCP-XXXX is recommended. -Lead Researcher Kapranos






Per 


