MediaWiki:Common.css

/* CSS placed here will be applied to all skins */ /* CSS placed here will be applied to all skins */ @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Quicksand');

/* IBM Plex Sans */

@font-face { font-family: 'IBM Plex Sans'; font-style: normal; src: url(https://fonts.gstatic.com/s/ibmplexsans/v14/zYXgKVElMYYaJe8bpLHnCwDKhd_eFb5N.woff2) format('woff2'); font-weight: 300,400,500,600,700; }

/* Global skin CSS */

.mediawiki { /* this sets the font EVERYWHERE, write another rule that sets editor fonts to system defaults */ font-family: 'IBM Plex Sans', sans-serif; font-weight: 400; }

/* larger inline math */

span.mwe-math-mathml-inline { font-size: 150%; }

/* Make be left aligned with one space indent for * compatibility with style conventions */ .mwe-math-fallback-image-display, .mwe-math-mathml-display { margin-left: 1.6em !important; margin-top: 0.6em; margin-bottom: 0.6em; }

.mwe-math-mathml-display math { display: inline; }

/* Quicksand */

@font-face { font-family: 'Quicksand'; src: url(https://fonts.gstatic.com/s/quicksand/v30/6xK-dSZaM9iE8KbpRA_LJ3z8mH9BOJvgkM0o58a-wg.woff2) format('woff2'); font-weight: 100,300,500,700,800; font-style: normal; }

/* Header CSS */

.mw-body h1 { font-family: 'Quicksand', sans-serif; font-weight: 500; }

.mw-body-content h2 { font-family: 'Quicksand', sans-serif; font-weight: 500; }

.mw-body-content h3 { font-family: 'IBM Plex Sans', sans-serif; font-weight: 500; }

.navbox-title span { font-family: "Quicksand", sans-serif; }

/* CSS placed here will be applied to all skins */ .mobileonly { display: none; }

img { max-width:100%; height:auto; }

/************************************************************* /* this CSS governs the responsive 2 column main page layout */ /*************************************************************/ .fpcontent { width: 100%; overflow: hidden; z-index: 1; }

.fplinks { margin: -5px; }

.fplink { display: inline-block; vertical-align: middle; width: 100%; }

/* Yeah, using display: table makes for a lot of extra markup, but it makes proportionate sizing and vertical centering a lot easier, so going with it */ .fplink .box { border-collapse: separate; border-spacing: 10px; display: table; width: 100%; }

.fplink .box .row { display: table-row; }

.fplink .box .row .cell { border-radius: 4px; display: table-cell; padding: 0 6px; position: relative; text-align: center; vertical-align: middle; }

.fplink.wide .box .row .cell { padding: 0 5px; }

height: 114px; width: 114px; }
 * 1) fptopsection .fplink.image,
 * 2) fpflexsection .fplink.image,
 * 3) fpbottomsection .fplink.image {

.fplink.image .box .row .cell { height: 100px; width: 100px; vertical-align: bottom; }

.fplink.image .box .row .cell .image img { height: 100px; width: 100px; }

@media (min-width: 470px) { .fplink { width: 50%; }

.fplink.wide { width: 100%; } }

@media (min-width: 580px) { .fplink { width: 33.333%; }

.fplink.wide { width: 66.666%; } }

@media (min-width: 690px) { .fplink { width: 25%; }

.fplink.wide { width: 50%; } }

@media (min-width: 800px) { .fplink { width: 20%; }

.fplink.wide { width: 40%; } }

@media (min-width: 910px) { .fplink { width: 16.666%; }

.fplink.wide { width: 33.333%; } }

@media (min-width: 990px) { .fpcontent { padding-right: 0px; width: auto; }

#fptopsection { float: left; width: 100%; }

#fpflexsection { float: right; width: 520px; margin-right: -520px }

#fpbottomsection { float: left; width: 100%; margin-top: -5px; }

#fptopsection .fplink, #fpbottomsection .fplink { width: 50%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 100%; }

#fpflexsection .fplink { width: 25%; }

#fpflexsection .fplink.wide { width: 50%; } }

@media (min-width: 1100px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 33.333%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 66.666%; } }

@media (min-width: 1210px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 25%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 50%; } }

@media (min-width: 1320px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 20%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 40%; } }

@media (min-width: 1430px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 16.666%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 33.333%; }

.fplink a { padding: 3px 5px; } }

@media (min-width: 1540px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 14.285%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 28.571%; } }

@media (min-width: 1650px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 12.5%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 25%; } }

@media (min-width: 1760px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 11.111%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 22.222%; } }

@media (min-width: 1870px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 10%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 20%; }

#fptopsection .fplink.image, #fpbottomsection .fplink.image { width: 134px; height: 134px; }

#fptopsection .fplink.image .box .row .cell, #fpbottomsection .fplink.image .box .row .cell { width: 120px; height: 120px; }

#fptopsection .fplink.image .box .row .cell .image img, #fpbottomsection .fplink.image .box .row .cell .image img { width: 120px; height: 120px; } }

@media (min-width: 1980px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 9.09%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 18.181%; } }

@media (min-width: 2090px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 8.33%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 16.666%; } }

@media (min-width: 2200px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 7.692%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 15.384%; } }

@media (min-width: 2310px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 7.142%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 14.285%; } }

@media (min-width: 2420px) { #fptopsection .fplink, #fpbottomsection .fplink { width: 6.666%; }

#fptopsection .fplink.wide, #fpbottomsection .fplink.wide { width: 13.333%; }

.fplink a { padding: 5px 5px; }

#fptopsection .fplink.image, #fpbottomsection .fplink.image { width: 164px; height: 164px; }

#fptopsection .fplink.image .box .row .cell, #fpbottomsection .fplink.image .box .row .cell { width: 150px; height: 150px; }

#fptopsection .fplink.image .box .row .cell .image img, #fpbottomsection .fplink.image .box .row .cell .image img { width: 150px; height: 150px; } }

.fplink.image .image { position: absolute; top: 0; right: 0; bottom: 0; left: 0; font-size: 75%; z-index: 1; }

.fplink.image a { z-index: 2; }

.fplink a { display: block; position: relative; top: 0; right: 0; bottom: 0; left: 0; padding: 1px 5px; }

.fplink.image .image a { padding: 0; }

.fplink.image .link a { background: rgba(0, 0, 0, 0.1); border-top: 2px solid #505050; }

.fplink.wide a { margin: 0 -5px; }

/* This governs the sections on the Community portal */ .cpbox { display: flex; flex-direction: row-reverse; flex-wrap: wrap; }

.cpbox #admins { box-sizing: border-box; width: calc(33% - 10px); margin: 5px; flex-grow: 1; min-width: 300px; }

.cpbox #help { box-sizing: border-box; width: calc(67% - 10px); margin: 5px; flex-grow: 1; }

/* hydradark fpboxes start */

.fpbox { background: rgba(0, 0, 0, 0.1); border: 1px solid #505050; color: #e0e0e0; /* change for hydra (light) wikis */ }

.fpbox .welcome { border-bottom: 1px solid #505050; color: #AFAEAB; /* change for hydra (light) wikis */ }

.fpbox .heading { border-bottom: 1px solid #505050; color: #FFFFFF; /* change for hydra (light) wikis */ }

.fpbox .heading .smalllink { color: #e0e0e0; /* change for hydra (light) wikis */ }

.fplink .box .row .cell { background: #130d13; border: 1px solid #c0c0c0; color: #130d13; }

.fplink a { color:white !important; }

/* "create page" form */ .nomobile { padding: 20px; } .nomobile form.createbox { margin: 10px; }

/* hydradark fpboxes end */

/* custom theme start */


 * root {

--bg-color: #151015ea; --bg-color-solid: #151015; --txt-color: #eee; --txt-color-dark: #bbb; --url-color: #fab; --url-color-visited: #c8a; --light-border-color: #fff6; --dark-pink: #867; --dark-green: #676; --table-bg-header: #0009; --table-bg: #0005; --edit-url-color: #c9b; --toc-bg-color: #0002; --toc-num-color: #aaa; --leftnavbar-url-color: #fef; --leftnavbar-header-color: #ddd; --header-bg-color: #12101250; --header-tab-bg: linear-gradient(#302530da,#151015da); --header-tab-color: #eee; --embed-bg: #503e2fb0; --diff-delete: #955; --diff-add: #595; }

/* main */ body { background-color: var(--bg-color-solid); background-image: url(https://media.istockphoto.com/id/1189971347/vector/pine-forest-and-lake-with-stag.jpg?s=612x612&w=0&k=20&c=QtbLggfz36j9YlaWt1F91SrQMGgU9nWhaMcBxeTyvf0=); background-position: center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; } .mw-body { background-color: var(--bg-color); color: var(--txt-color); border: 1px solid var(--light-border-color); } .mw-body h1, h2, h3, h4, h5, h6 { color: var(--txt-color); } .mw-body a, .mw-parser-output a.external { color: var(--url-color); } .mw-body a:visited, .mw-parser-output a.external:visited { color: var(--url-color-visited) } .mw-parser-output a.extiw:visited { color: #8ac8ff; } .mw-body .mw-editsection a { color: var(--edit-url-color); } ul { list-style: disc; }

/* table of contents */ .toc { background-color: var(--toc-bg-color); border-radius: 4px; } .tocnumber { color: var(--toc-num-color); } .toctext { color: var(--leftnavbar-url-color) }

/* left nav bar */ background-color: var(--header-bg-color); } color: var(--leftnavbar-url-color); font-weight: 500; } color: var(--leftnavbar-header-color); }
 * 1) mw-panel {
 * 1) mw-panel a {
 * 1) mw-panel span {

/* header */ background: none; } background-color: var(--header-bg-color); } background-image: var(--header-tab-bg); } color: var(--header-tab-color); } background-image: none; } .oo-ui-icon-tray, .oo-ui-icon-bell { background-color: var(--txt-color); } color: var(--leftnavbar-url-color); }
 * 1) mw-page-base {
 * 1) mw-head {
 * 1) mw-head .vector-menu-content-list li {
 * 1) mw-head a {
 * 1) mw-head #p-personal li {
 * 1) mw-head #p-personal #pt-userpage a {

/* thumbnails and embeds */ .thumbinner, .catlinks { background-color: var(--embed-bg) !important; } .catlinks { border-radius: 4px; } .catlinks a { color: var(--leftnavbar-url-color) } .thumbimage { background-color: var(--embed-bg); }

/* infoboxes */ .infoboxtable { float: right; padding: 10px; border: 1px solid var(--txt-color); border-radius: 4px; font-size: 90%; margin-left: 1em; margin-bottom: 0.5em; width: 325px } .infoboxtable td { vertical-align: top } .infoboxtable td > div { background-color: var(--embed-bg); font-weight: 500; padding: 0.5px 7px } .infoboxname { background-color: var(--embed-bg); font-size: 110%; font-weight: bold; padding: 0.4em } .infoboxdetails { background-color: var(--embed-bg); padding: 0.15em; } .infoboxname, .infoboxdetails, .infoboxtable .mw-collapsible th{ border-radius: 2px !important; border: 1px solid #767; } .mw-collapsible th { background-color: var(--embed-bg) !important; }

/* file history */ background-color: var(--toc-bg-color); border: 1px solid var(--txt-color); border-radius: 2px; }
 * 1) filetoc {

/* footer */ color: var(--leftnavbar-header-color); } color: var(--leftnavbar-url-color); font-weight: 800; }
 * 1) footer-info li {
 * 1) footer-info a, #footer-places a {

/* image gallery */ li.gallerybox div.thumb { background-color: var(--toc-bg-color); border-radius: 3px; }

/* general tables */ .wikitable { background-color: var(--table-bg-color) !important; color: var(--txt-color) !important; } .wikitable th { background-color: var(--table-bg-header) !important; }

/* page history comparer */ background-color: transparent; outline: none; color: var(--txt-color); border: 1px dashed var(--txt-color); }
 * 1) pagehistory li.selected {

/* page diff */ .diff-context { background-color: var(--embed-bg); color: var(--txt-color); } .diff-deletedline { border-color: var(--diff-delete); } .diff-deletedline .diffchange { background-color: var(--diff-delete); } .diff-addedline { border-color: var(--diff-add); } .diff-addedline .diffchange { background-color: var(--diff-add); }

/* recent changes page */ .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled, .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined, .oo-ui-textInputWidget .oo-ui-inputWidget-input, .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend { background-color: var(--embed-bg); border-radius: 3px; } .mw-rcfilters-ui-filterTagItemWidget .oo-ui-labelElement-label, .oo-ui-buttonElement-button .oo-ui-labelElement-label { color: var(--txt-color-dark); } .mw-rcfilters-ui-filterWrapperWidget-showNewChanges .oo-ui-labelElement-label, .mw-rcfilters-ui-filterTagMultiselectWidget .oo-ui-labelElement-label { color: var(--txt-color); }

/* file metadata and licensing */ .toccolours { background-color: var(--embed-bg); } .fileinfo-paramfield { background-color: var(--bg-color-solid) } .licensetpl_wrapper, .licensetpl, .layouttemplate table { background-color: var(--embed-bg) !important; } background-color: var(--embed-bg); }
 * 1) mw_metadata th, #mw_metadata td {

/* uploaded files list */ .mw-datatable th, .mw-datatable td { background-color: var(--embed-bg); } .mw-datatable tr:hover td { background-color: var(--bg-color-solid); }

/* search bar */ background-color: var(--embed-bg); border-color: var(--light-border-color); color: var(--txt-color); }
 * 1) searchInput {

/* deleted pages page text box & email text box */ .oo-ui-textInputWidget .oo-ui-inputWidget-input { color: var(--txt-color); }

/* help text (extensions manager, etc.) */ .oo-ui-inline-help { color: var(--txt-color-dark) !important; }

/* main page page creator */ .createboxInput { background-color: var(--embed-bg); border-color: var(--txt-color-dark); color: var(--txt-color) } .mw-ui-button.mw-ui-progressive, .mw-ui-button.mw-ui-progressive:disabled { background-color: var(--embed-bg); border: 1px solid var(--txt-color-dark); transition: ease-in-out 0.3s; } .mw-ui-button.mw-ui-progressive:hover, .mw-ui-button.mw-ui-progressive:disabled:hover { background-color: var(--embed-bg); border: 1px solid var(--url-color); } .mw-body-content blockquote { border-left: 2px solid #eaecf040; }

/* userprofile extension support */ background-color: transparent; border-radius: 4px; } .no-info-container, .profile-info-container, .profile-on { background-color: var(--embed-bg); border: 1px solid var(--txt-color); border-radius: 4px; color: var(--txt-color); } .profile-info-container { margin-bottom: 20px; } .profile-info-container div { padding: 10px 20px; color: var(--txt-color); } .profile-info-container div b { color: var(--txt-color-dark); font-size: 0.9em; } background-color: var(--embed-bg); border: 1px solid var(--txt-color-dark); border-radius: 3px; } .profile-tab-on { background-color: var(--dark-pink); } .profile-on { background-color: var(--dark-green); color: white; padding: 5px; } .profile-update-title, .profile-update-unit-left { color: var(--txt-color); } .eye-container { opacity: 0.8; } .eye-container .title { color: black; } .eye-container .menu .item, .eye-container .menu .item:hover { color: black; } .tux-editor-header { color: #fff; font-size: 14px; } .group-warning { background: #371425; padding: 5px; margin: 5px 0; } .tux-breadcrumb { color: #fff; font-size: 14pt; line-height: 1.25em; } .tux-breadcrumb__item--aggregate { cursor: pointer; color: #FEF; } .ext-translate-language-selector-label { color: #fff; } .ext-translate-language-selector .uls { color: #FEF; cursor: pointer; min-height: 1px; position: relative; } .toctogglelabel { cursor: pointer; color: #fff; } .jquery-tablesorter th.headerSort { background-image: url(https://static.miraheze.org/rainworldwiki/c/c3/RW_sort_both.svg); background-repeat: no-repeat; background-position: right; padding-right: 21px; background-size: 21px; } .jquery-tablesorter th.headerSortUp { background-image: url(https://static.miraheze.org/rainworldwiki/1/11/RW_sort_up.svg); background-repeat: no-repeat; background-position: right; padding-right: 21px; background-size: 21px; } .jquery-tablesorter th.headerSortDown { background-image: url(https://static.miraheze.org/rainworldwiki/9/94/RW_sort_down.svg); background-repeat: no-repeat; background-position: right; padding-right: 21px; background-size: 21px; } .updatedmarker { background-color: #474747; } .warningbox { background-color: #513c4900; border-color: #ffeafc; } .messagebox, .errorbox, .warningbox, .successbox { color: #ffeafd; } .cnotice { background-color: var(--bg-color-solid); } .cnotice-message p { color: var(--txt-color); } filter: invert(100%); } form#editcount table { background-color: #0000 !important; }
 * 1) profile-image img {
 * 1) profile-toggle-button, .profile-tab-on, .profile-tab {
 * 1) cnotice-toggle-box a img {

/* languages footer */ .mw-pt-languages, .mw-pt-languages-label { background-color: var(--bg-color-solid); border-radius: 4px; }

/* advanced search box */ .mw-search-profile-tabs { background-color: #f8f9fa00; }

background-color: #f8f9fa00; }
 * 1) mw-searchoptions {

/* visual edit mode imageboxes */ figure[typeof~="mw:Image/Thumb"], figure[typeof~="mw:Video/Thumb"], figure[typeof~="mw:Audio/Thumb"], figure[typeof~="mw:Image/Frame"], figure[typeof~="mw:Video/Frame"], figure[typeof~="mw:Audio/Frame"] { background-color: var(--embed-bg); }

figure[typeof~="mw:Image/Thumb"] > figcaption, figure[typeof~="mw:Video/Thumb"] > figcaption, figure[typeof~="mw:Audio/Thumb"] > figcaption, figure[typeof~="mw:Image/Frame"] > figcaption, figure[typeof~="mw:Video/Frame"] > figcaption, figure[typeof~="mw:Audio/Frame"] > figcaption { background-color: var(--embed-bg); }

/* visual edit mode popup box */

.oo-ui-popupWidget-popup { background-color: #241a24; } .mw-rcfilters-ui-filterTagItemWidget .oo-ui-labelElement-label, .oo-ui-buttonElement-button .oo-ui-labelElement-label { color: #000; }

/* wiki extension manager */

background: #130e13; } .oo-ui-tabSelectWidget-framed { background-color: #150E15; } .successbox { background-color: #391f39; border-color: #C8CCD1; }
 * 1) managewiki .managewiki-submit-formfields {

/* multimedia viewer */

.mw-mmv-post-image { color: #eee; background-color: #221520; } .mw-ui-button.mw-ui-progressive:not(:disabled) { background-color: #0000; color: #000 !important; border-color: #eee; } .mw-mmv-stripe-button.mw-mmv-description-page-button, .mw-mmv-stripe-button.mw-mmv-description-page-button:active, .mw-mmv-stripe-button.mw-mmv-description-page-button:visited { color: #fff; } .mw-mmv-image.error { background-color: #241a22; } .mw-mmv-image-metadata { border-top: 1px solid #eee; background-color: #170d17; } .mw-mmv-image-links a:visited, .mw-mmv-about-links a:visited, .mw-mmv-image-metadata a:visited { color: #c8a; } .mw-mmv-image-links a, .mw-mmv-about-links a, .mw-mmv-image-metadata a { color: #fab; }

/* inline icon placer */

pre, code, .mw-code { background-color: #171017c4; color: #eee; border: 1px solid #eee; }

/* mediawiki common css */

.mw-content-ltr.mw-highlight-lines pre, .mw-content-ltr.content .mw-highlight-lines pre { padding-left: 3.5em; box-shadow: inset 2.75em 0 0 #4a2c3f59; } .mw-highlight .linenos { color: #eee; }

/* text colour */

.mw-highlight .nc { color: #5A9AFF; } .mw-highlight .c { color: #3dcaca; } .mw-highlight .nv { color: #6C69FF; } .mw-highlight .nf { color: #3C49FF; } .mw-highlight .mh { color: #fff; } .mw-highlight .kc { color: #10b710; font-weight: bold; } .mw-highlight .nd { color: #E10BFF; } .mw-highlight .kt { color: #FF347E; } .mw-highlight .nn { color: #5A9AFF; }

/* wiki userpage */ border: none; } .user-section-heading { border: none; line-height: 0px; margin: 0 0 20px 0; } float: none; } width: 100%; float: right; padding-top: 20px; } float: right; width: 100%; padding-top: 20px; } background: linear-gradient(to left, #15101560, #15101500); padding-right: 5px; } background: linear-gradient(to right, #15101550, #15101500); height: 100%; } /* links */ a.new { color: #dd3333 !important; }
 * 1) profile-top {
 * 1) profile-right {
 * 1) user-page-left {
 * 1) user-page-right {
 * 1) p-personal {
 * 1) mw-panel {

a[href^="/wiki/User:"], a[href^="/wiki/User:"]:visited { color: #9b59b6; font-style: italic; } a[href$=":Cashewww"]:after, a[href$=":Axolittle"]:after, a[href$=":Kaye"]:after, a[href$=":SmallSunset"]:after, a[href$=":SpineEater69"]:after, a[href$=":Candlesign"]:after, a[href$=":Axolittle"]:visited:after, a[href$=":Cashewww"]:visited:after, a[href$=":Kaye"]:visited:after, a[href$=":SmallSunset"]:visited:after, a[href$=":SpineEater69"]:visited:after, a[href$=":Candlesign"]:visited:after { background-size: 17px; color: #00000000; content: "___"; margin-left: 5px; background-image: url(https://static.miraheze.org/rainworldwiki/3/3d/UserImg_Klen_iggi.png); background-repeat: no-repeat; } a[href$=":Cashewww"], a[href$=":Axolittle"], a[href$=":Kaye"], a[href$=":SmallSunset"], a[href$=":SpineEater69"], a[href$=":Candlesign"], a[href$=":Axolittle"]:visited, a[href$=":Cashewww"]:visited, a[href$=":Kaye"]:visited, a[href$=":SmallSunset"]:visited, a[href$=":SpineEater69"]:visited, a[href$=":Candlesign"]:visited { color: #f4e57f !important; font-weight: bold; }

a[href$=":Klen%27s_Flame"]:after, a[href$=":Klen%27s_Flame"]:visited:after { background-size: 19px; color: #00000000; content: "___"; margin-left: 5px; background-image: url(https://static.miraheze.org/rainworldwiki/6/67/User_Klen_wiki.png); background-repeat: no-repeat; } a[href$=":Klen%27s_Flame"], a[href$=":Klen%27s_Flame"]:visited { color: #7297ed !important; font-weight: bold; } a[href$=":MemeMan02"]:after, a[href$=":Wanda"]:after, a[href$=":Jevmen"]:after, a[href$=":Loeris"]:after, a[href$=":Eight_Frogs"]:after, a[href$=":MemeMan02"]:visited:after, a[href$=":Wanda"]:visited:after, a[href$=":Jevmen"]:visited:after, a[href$=":Loeris"]:visited:after, a[href$=":Eight_Frogs"]:visited:after { background-size: 19px; color: #00000000; content: "___"; margin-left: 5px; background-image: url(https://static.miraheze.org/rainworldwiki/6/67/User_Klen_wiki.png); background-repeat: no-repeat; }

/* js breadcrumbs */

.jsbc-breadcrumbs { background-color: #0000; border-color: #eee; }

/* upload file error */

.messagebox, .errorbox, .warningbox, .successbox { color: #fff; } .errorbox { background-color: #fd2e2e70; border-color: #f75252; }

/* discord banners */

.discord-banner { width: 320px; height: 76px; background-image: url("https://discordapp.com/api/guilds/291184728944410624/embed.png?style=banner2"); } .discord-shield { width: 119px; height: 20px; background-image: url("https://discordapp.com/api/guilds/291184728944410624/embed.png?style=shield"); } /* cookies banner */

.mw-cookiewarning-container { background-color: rgb(34, 20, 29); }

/* video embeds (youtube, etc.) */

.embedvideo-consent { background-color: #000; } .embedvideo-consent__overlay { color: #eee; } .embedvideowrap { border: var(--txt-color-dark) 1px solid; }

/* toolbar notifs popup */

.oo-ui-popupWidget-popup { background-color: #EAECF0; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { background-color: #EAECF0; }

/* page editor */ background-color: var(--bg-color); color: var(--txt-color); } .editOptions { background-color: var(--bg-color-solid); color: var(--txt-color-dark); } .editOptions .oo-ui-labelElement-label { color: var(--txt-color); }
 * 1) wpTextbox1 {

/* fundraising notice */ .cnotice { background: #FCFCFC00; border: 1px solid #eee; } .cnotice-message p { color: #eee; }

/* sitewide notice */ background-color: var(--embed-bg) !important; border: var(--txt-color-dark) 1px solid !important;
 * 1) siteNotice td {

}

/* frb fundraising notice */ .frb { display: none; background-color: #fff0 !important; } .frb-greeting { color: #eee !important; } .frb-translateme { float: right; font-size: 60%; color: #eee !important; margin-top: -20px !important; } .mw-ui-button { background-color: #0000; border: 1px solid #eee; border-radius: 7px; } .frb-message-icon { height: 3em !important; width: 0em !important; } .frb-message-inner { background-color: #FFF0 !important; border-left: 2px solid #eee !important; border-radius: 7px !important; } .mh-notice--warning { border-left-color: #8c8c8c; background: #fff; }

/* maintenance notice */ .mw-dismissable-notice-body td div { font-size: 100%; color: #eee; }

/* slider switches */ .switch { position: relative; display: inline-block; width: 40px; height: 24px; top: -1px; }

.switch input { opacity: 0; width: 0; height: 0; }

.switch .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #aaa; -webkit-transition: .3s; transition: .3s; border-radius: 24px; }

.switch .slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: white; -webkit-transition: .3s; transition: .3s; border-radius: 50%; }

.switch input:checked + .slider { background-color: #e8a; }

.switch input:checked + .slider:before { -webkit-transform: translateX(16px); -ms-transform: translateX(16px); transform: translateX(16px); }

/* text input widget */

.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending) { background-color: #0000; }

/* spoiler tags */ .dp-spoiltag input { display: none; } .dp-spoiltag input:not(:checked) + label, .dp-spoiltag input:not(:checked) + label a, .dp-spoiltag input:not(:checked) + label img { user-select: none; background-color: black; color: transparent; transition: .15s; } .dp-spoiltag input:not(:checked) + label a, .dp-spoiltag input:checked + label .simple-tooltip { pointer-events: none; } .dp-spoiltag input:checked + label a { pointer-events: auto; } .dp-spoiltag input:not(:checked) + label img { filter: brightness(0) } .dp-spoiltag input:checked + label, .dp-spoiltag input:checked + label a, .dp-spoiltag input:checked + label img { background-color: rgba(0, 0, 0, .1); transition: .15s; }

/* front page responsive layout */

@media (min-width: 1550px) { .fp-cont { display: grid; }

.fp-cont#fpc1, .fp-cont#fpc2 { grid-template-columns: 1fr 1fr; } .fp-cont#fpc3 { grid-template-columns: 2fr 3fr; } .fp-cont#fpc4 { grid-template-columns: 1fr 1fr 1fr; } .fp-cont#fpc5 { grid-template-columns: 2fr 3fr 2fr; } .fp-cont#fpc6 { grid-template-columns: 2fr 2fr 2fr 1fr; }

.fp-cont .fp-col { padding: 20px; } }

/* collapsible spoiler toggle positioning & styling */

.spoiler-collapse > .mw-collapsible-toggle { position:absolute; top:-30px; left:49%; font-weight:bold; font-size:115%; }

/* user message board */

.user-board-message-from { background-color: #eef3f000; }

/* Footnote highlight */

ol.references li:target, sup.reference:target { background-color: #fab4; }

/* Dialogues colors */ .SRS {color: #ffbfbf;} .NSH {color: #bfffbf;} .WO {color: #bfbfff;} .EOC {color: #ffffe5;} .PI {color: #ffbfff;} .GS {color: #e59966;} .SI {color: #bfbfbf;} .HR {color: #8cb28c;} .BSM {color: #e5d999;} .CW {color: #bfbfe5;} .FivePebbles, .EP, .FP {color: #66d9bf;} .HF {color: #8c8ce5;} .NGI {color: #b28ccc;} .UU {color: #8ce58c;} .Andrew {color: #ffffff;} .Will {color: #ff4c59;} .Screams {color: #4cff87;} .Dakras {color: #b854ed;} .Cappin {color: #0061d6;} .Norgad {color: #ab8fd6;}

/* Collections & ru wiki styles */ .flex-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }

.flex-col { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.flex-col *, .flex-col *:after, .flex-row *, .flex-row *:after { padding: 0; margin: 0; border: 0; -webkit-box-sizing: border-box; box-sizing: border-box; line-height: normal; }

.text-center { text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.tabber-panel-buttons { height: 695px; width: 270px; columns: 5; column-gap: 0px; flex: 0 0 auto; }

.tabber-panel-text { padding: 10px; border: 2px solid #fff; border-radius: 10px; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }

.tabber-panel-text .tabber-cell { margin: 2px; }

.tabber-inside-text { justify-content: center; align-items: center; height: 618px; }

.tabber-inside-text > .display-block { display: block; overflow: auto; }

.tabber-chatlog-text { justify-content: center; align-items: center; height: 665px; display: flex; }

.tabber-panel-text > .no-tabs > .tabber-chatlog-text > .poem > p, .tabber-inside-text > * > .poem > p { text-align: center; font-size: small; font-weight: 100; }

.tabber-cell { height: 46px; width: 46px; border: 2px solid #999; border-radius: 10px; background-color: #00000000; margin-bottom: 8px; }

.tabber-cell.button-active { background: #ffffff10; border-color: #fff; }

.tabber-cell.button-active:before { height: 54px; width: 54px; content: ""; border: 2px solid #fff; border-radius: 10px; display: block; position: absolute; }

.tabber-cell:hover { background-color: #00000000; border-color: #fff; }

.tabber-cell:hover:before { height: 54px; width: 54px; content: ""; border: 2px solid #fff; border-radius: 10px; display: block; position: absolute; }

/* Colored text toggle box */ .textcolorswitch { background-color:rgba(100,20,90,0.5); border:3px solid #D29; border-radius:10px; padding:5px; }

/* Collapsible TOC sections */ .tocseccolinp { position:absolute; opacity:0; } .tocseccollab { float:right; } .tocseccollab:before { content:"["; margin-left:5px; } .tocseccolinp:checked ~ .tocseccollab:after { content: "show]"; } .tocseccolinp:not(:checked) ~ .tocseccollab:after { content: "hide]"; } .tocseccollab:hover { cursor:pointer; text-decoration:underline; } .tocseccolinp:checked ~ ul { display:none; }

/* interwiki table local yes bg */ table.mw-interwikitable.body td.mw-interwikitable-local-yes { background: #000; }

/* mw message box */ .mw-message-box { color: #eee; } .mw-message-box-warning { background-color: #39393900; border-color: #ee; } .mw-message-box-error { background-color: #5b0804c2; border-color: #eee; } .mw-message-box-success { background-color: #10265985; border-color: #eee; }

/* DiscussionTools buttons */ .mw-rcfilters-ui-filterTagItemWidget .oo-ui-labelElement-label, .oo-ui-buttonElement-button:not(.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button) .oo-ui-labelElement-label:not(.mw-echo-ui-notificationItemWidget .oo-ui-labelElement-label) { color: var(--url-color); } .ve-ui-targetWidget:not(.oo-ui-pendingElement-pending) { background: #fff0; } .ext-discussiontools-ui-replyWidget-preview { background: #fff0; } .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice { background-color: #eaecf000; border-color: #eee; } .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice { background-color: #eaecf000; } .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button { background-color: inherit; } .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button .oo-ui-labelElement-label { color: #404244 !important; }

/* Broadcasts */ .broadcast blockquote { color:white; text-align:center; max-width:1024px; padding:1px 2px; margin:5px; } .broadcast p { color:white; } .broadcast p span { background-color:black; } /* custom theme end */