Note: After saving, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Akaya+Telivigala&family=Averia+Libre:wght@300&family=IM+Fell+English+SC&family=Kavivanar&family=Libre+Barcode+128+Text&family=Lobster&family=Major+Mono+Display&family=Mate+SC&family=Pacifico&family=Qahiri&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caveat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gugi&display=swap');
@import "/load.php?mode=articles&articles=u:dev:MediaWiki:InterlanguageFlags.css&only=styles";
.headerbox{
color:#fbe7b5;
text-shadow: 0 0 1pt rgb(251, 231, 181);
padding:1rem 0;
background: linear-gradient(180deg, rgba(133, 120, 88,0.5) 0%, rgba(251, 231, 181,1) 75%);
float:none;
width:auto;
margin:auto;
border-radius:1rem 1rem 0 0;
}
.scrollheader{
background: url(https://static.wikia.nocookie.net/backrooms/images/f/fe/Fandom-contest-3-tiled.png/revision/latest/scale-to-width-down/641?cb=20220302045650);
animation: slide2 120s linear infinite;
background-size: 620px;
background-repeat: repeat;
width:calc(100% - 72px);
min-height: 150px;
border-radius:1rem 1rem 0 0;
position:absolute;
}
.scrollheader2{
background: url(https://static.wikia.nocookie.net/backrooms/images/1/19/37ScrollHeader.png/revision/latest?cb=20220329005840);
animation: slide2 120s linear infinite;
background-size: 800px;
background-repeat: repeat;
width:calc(100% - 72px);
min-height: 150px;
border-radius:1rem 1rem 0 0;
position:absolute;
}
.scrollheader3{
background: url(https://static.wikia.nocookie.net/backrooms/images/3/30/Headerforbrmike.png/revision/latest?cb=20220413002114);
animation: slide2 120s linear infinite;
background-size: 1000px;
background-repeat: repeat;
width:calc(100% - 68px);
min-height: 150px;
border-radius:1rem 1rem 0 0;
position:absolute;
}
@keyframes slide2{
0% {
background-position: 120px bottom;
}
100% {
background-position: -500px bottom;
}
}
.faction{
color:#fbe7b5;
text-shadow: 1pt 1pt 1pt rgba(251, 231, 181,0.3);
background: #857858;
border-radius: 1rem;
border:2pt solid #fbe7b5;
box-shadow: 0 0 5pt #857858;
margin: 10px 8pt 15px 8pt;
padding: 1.5rem 2rem 1rem 2rem;
height:auto;
min-height:120px;
}
.faction a{
color:#eedbac;
text-decoration:underline;
}
.faction a:hover{
color:#ffc191;
}
.faction h1{
font-size:52px;
line-height:0.7;
margin:-0.25rem 0 0.75rem 0;
}
.faction img{
height:120px;
width:auto;
float:left;
margin-right:1rem;
border-radius:1rem;
box-shadow:0 0 1pt rgba(251, 231, 181,0.3);
}
.strongtitle{
letter-spacing: 1rem;
font-family: 'Comfortaa', sans-serif;
font-variant: small-caps;
}
.profilepic img{
height:45px;
border-radius:100%;
padding-right:0;
margin-right:1rem;
}
.profilepicfix{
margin-top:0.75rem;
}
.body-content{
padding-top:25rem;
}
.right-image{
max-width:40%;
float:right;
padding:0;
margin:0 8px 1rem 1rem;
border-radius:0 1rem 0 0;
text-align:center;
color:#fbe7b5;
text-shadow: 1pt 1pt 1pt rgba(251, 231, 181,0.3);
background: #857858;
border:2pt solid #fbe7b5;
box-shadow: 0 0 5pt #857858;
}
.right-image img{
width:calc(100% + 2rem);
height:auto;
margin-bottom:1rem;
margin-left:-1rem;
transition:0.08s;
border-radius:0 1rem 0 0;
}
.right-image img:hover{
transition-delay:0.35s;
transform: scale(1.5) translateX(-3rem);
border-radius:0;
}
.right-image p{
padding:0 1rem;
}
.body-accent {
color:#fbe7b5;
text-shadow: 1pt 1pt 1pt rgba(251, 231, 181,0.3);
background: #857858;
border-radius: 1rem;
border:2pt solid #fbe7b5;
box-shadow: 0 0 5pt #857858;
margin: 10px 8pt 15px 8pt;
padding: 1rem 2rem 1pt 2rem;
}
.faction{
padding: 1rem 2rem 1pt 2rem;
padding-left:0.85rem;
height:auto;
min-height:120px;
}
.faction img{
width:120px;
height:auto;
float:left;
margin-right:1rem;
border-radius:1rem;
box-shadow:0 0 1pt rgba(251, 231, 181,0.3);
}
.faction h1{
letter-spacing: 1rem;
font-family: 'Comfortaa', sans-serif;
}
.profilepic img{
width:45px;
border-radius:100%;
padding-right:0;
margin-right:1rem;
}
.profilepicfix{
margin-top:0.75rem;
}
.faction img{
float:none;
width:120px;
padding-right:0;
margin:auto;
display:block;
}
.featurebox{
padding:0 0.5rem;
margin:1rem 0;
background:#EFDBA6;
border-radius:0.6rem;
box-shadow: 0px 0px 3px;
border: 1.75px solid #d6ce92;
box-sizing:border-box;
}
.featureflavor{
padding:0 0.5rem;
margin:0.5rem 0;
background:#DECB96;
border-radius:0.6rem;
box-shadow: 0px 0px 3px;
border: 1.75px solid #c7c089;
box-sizing:border-box;
transition:0.2s;
}
.newsbox{
padding:1px 1rem;
margin:1rem 0;
background: linear-gradient(90deg, rgba(206,187,135,1) 0%, rgba(214,206,146,0) 100%);
border-radius:0.8rem;
}
.wavy-text {
display: inline-flex;
font-size: 14px;
font-family: monospace;
text-transform: uppercase;
}
.wavy-text span {
animation: jiggle;
animation-duration: 500ms;
animation-iteration-count: infinite;
transform: translateY(-2px);
}
.wavy-text span:nth-child(1) { animation-delay: 100ms }
.wavy-text span:nth-child(2) { animation-delay: 200ms }
.wavy-text span:nth-child(3) { animation-delay: 300ms }
.wavy-text span:nth-child(4) { animation-delay: 400ms }
.wavy-text span:nth-child(5) { animation-delay: 500ms }
.wavy-text span:nth-child(6) { animation-delay: 600ms }
.wavy-text span:nth-child(7) { animation-delay: 700ms }
.wavy-text span:nth-child(8) { animation-delay: 800ms }
.wavy-text span:nth-child(9) { animation-delay: 900ms }
.wavy-text span:nth-child(10) { animation-delay: 1000ms }
@keyframes jiggle {
from {
transform: translateY(-2px);
}
50% {
transform: translateY(2px);
}
to {
transform: translateY(-2px);
}
}
.palebox{
background: linear-gradient(90deg, rgba(222, 203, 150,1) 0%, #DAC692 25rem);
border-radius:1rem;
padding:0.25rem 1rem;
box-shadow:0 0 4pt #C8B684;
position:relative;
}
.float{
width:40%;
float:right;
margin: 0 1.5rem 0.5rem 1.5rem;
}
.titleblock {
background-color: rgb(239, 219, 166);
color:rgb(12, 12, 12);
padding: 0.5rem 1rem 0.10rem;
margin: 1.5rem 0rem 0.5rem 0rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
border: solid rgb(206, 187, 135) 2px;
}
.titlebox{
color: rgb(12, 12, 12);
position: relative;
top: -1.6rem;
background-color: rgb(222, 203, 150);
padding: 0.25rem 1rem;
line-height: 0.1rem;
}
.right-sound{
max-width:40%;
float:right;
padding:0;
margin:0 8px 1rem 1rem;
border-radius:0 1rem 0 0;
text-align:center;
color:#ffffff;
text-shadow: 1pt 1pt 1pt rgba(255, 255, 255,0.0);
background: #ffffff;
border:2pt solid #ffffff;
box-shadow: 0 0 5pt #ffffff;
}