MediaWiki:Common.css

/* Imports */

@import url('https://fonts.googleapis.com/css?family=Press+Start+2P|Prompt|Noto+Sans|EB+Garamond'); @import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:Highlight.css|u:dev:MediaWiki:CustomSlider.css");

/***** CSS placed here will be applied to all skins on the entire site. *****/

/* -- TOC -- */

background: #d8e1f3; border: 1px solid #1510a0; padding: 5px 15px; }
 * 1) toc {

.toc .toctitle { border-bottom: 1px solid #1510a0; }

/* -- TOC Fix -- */

.toc .toctitle h2#mw-toc-heading { overflow: hidden; }

.toc .toctitle .wds-icon.wds-icon-tiny:first-child { display: none; }

/* -- User Highlights -- */

a[href="/wiki/User:Iamconsent"] { color: #f77; text-shadow: 1px 1px 3px; }

a[href="/wiki/User:Nicotangle"] { color: #f77; text-shadow: 1px 1px 3px; }

/* -- Special:Community Text Shadow -- */

.community-page-header { text-shadow: 0 0 6.5px #0d0a60; }

/* -- Main Page CSS -- */

/* -- Main Page Header Themes – Credits to No Game, No Life Wiki -- */

.header-theme1 { background: linear-gradient(to right, rgba(000, 000, 000, 0.5), rgba(000, 000, 000, 0.5)), url("https://static.wikia.nocookie.net/otherside-picnic/images/b/b7/Otherside_1.png/revision/latest?cb=20210109150121&format=original") center /  cover no-repeat fixed !important; }

.header-theme2 { background: linear-gradient(to right, rgba(000, 000, 000, 0.5), rgba(000, 000, 000, 0.5)), url("https://static.wikia.nocookie.net/otherside-picnic/images/8/8a/Otherside_2.png/revision/latest?cb=20210109150121&format=original") center /  cover no-repeat fixed !important; }

.header-theme3 { background: linear-gradient(to right, rgba(000, 000, 000, 0.5), rgba(000, 000, 000, 0.5)), url("https://static.wikia.nocookie.net/otherside-picnic/images/2/26/Otherside_3.png/revision/latest?cb=20210109150122&format=original") center /  cover no-repeat fixed !important; }

/* -- Main Page Hover Styles -- */

.grow-hover img { transition: 0.3s ease; }

.grow-hover img:hover { transform: scale(1.1); transition: transform 0.3s ease; }

.opacity-hover img { transition: 0.2s; }

.opacity-hover img:hover { opacity: 0.7; }

/* -- Infobox CSS -- */

.portable-infobox { background-color: transparent; border: 1px solid #1510a0; padding: 2px; }

.portable-infobox.pi-background { background-color: transparent; }

.portable-infobox .pi-title { background: #1510a0; color: #fff; font-size: 18px; font-weight: bold; padding: 10px!important; text-align: center; }

.portable-infobox .pi-header { font-size: 14px; font-weight: bold; line-height: 24px; }

.portable-infobox .pi-header a { text-decoration: none; }

.portable-infobox .pi-item-spacing { padding: 5px 10px; }

.portable-infobox .pi-border-color { border: none; }

.portable-infobox .pi-border-color { border-bottom: 1px solid #171b9d; }

.portable-infobox .pi-group, .portable-infobox .pi-group .pi-data:last-child { border: none; }

.portable-infobox .wds-tabs__tab:first-child { margin-left: auto; }

.portable-infobox .wds-tabs__tab:last-child { margin-right: auto; }

.portable-infobox .pi-image-collection-tabs { background: none; border: none; color: #1d17cf; font-size: 12px; font-weight: 700; padding: 8px 20px!important; text-align: center; text-transform: uppercase; vertical-align: middle; }

.portable-infobox .pi-image-collection-tabs .current { background: transparent; border-bottom: solid 2px #1d17cf; color: #1510a0; }

.portable-infobox .pi-caption { margin-bottom: -8px; padding: 5px; text-align: center; }

.portable-infobox .pi-group, .portable-infobox .pi-group .pi-data:last-child { border: none; }

.portable-infobox .pi-horizontal-group .pi-data-label, .portable-infobox .pi-horizontal-group .pi-data-value { background-color: transparent!important; border-bottom: none; margin-top: 3px; padding: 5px; text-align: center; }

.portable-infobox .pi-item[data-source=spotify] { display: flex; justify-content: center; margin-top: 4px; margin-bottom: -1px; }

.portable-infobox .pi-horizontal-group .pi-header { margin-bottom: 3px; text-align: center; }

.portable-infobox .pi-horizontal-group { margin-bottom: 3px; }

.portable-infobox .pi-horizontal-group-item:nth-child(even) { border-left: 1px solid #171b9d; }

.portable-infobox .pi-navigation { background: #171b9d; color: #fff; font-size: 14px; font-weight: bold; line-height: 24px; text-align: center; }

.portable-infobox .pi-navigation a { color: #fff; }

/* -- Tabber Styling -- */

.tabber.wds-tabber > .wds-tabs__wrapper { border: none !important; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs { justify-content: center; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab > .wds-tabs__tab-label { background: #ffffff !important; font-family: Helvetica !important; color: #444444 !important; font-weight: 400 !important; margin: 0 !important; padding: 4px 12px !important; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75); font-size: 13px !important; height: unset; cursor: default; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab:first-child > .wds-tabs__tab-label { border-top-left-radius: 3px; border-bottom-left-radius: 3px; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab:last-child > .wds-tabs__tab-label { border-top-right-radius: 3px; border-bottom-right-radius: 3px; }

.tabber.wds-tabs__tab.wds-is-current { box-shadow: none !important; }

.tabber.wds-tabber > .wds-tab__content.wds-is-current { border: none !important; padding: 10px 0px 0px 0px !important; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs { background: transparent; border-bottom: 0 !important; padding: 10px 0 !important; text-align: center; margin: 0 0 -10px 0 !important; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab:active > .wds-tabs__tab-label { background: #f0f0f0 !important; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab.wds-is-current > .wds-tabs__tab-label { background: linear-gradient(180deg, rgba(6,131,214,1) 0%, rgba(5,108,176,1) 100%) !important; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab.wds-is-current:active > .wds-tabs__tab-label { background: linear-gradient(180deg, rgba(3,76,125,1) 0%, rgba(2,61,99,1) 100%) !important; }

.tabber.wds-tabber > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab.wds-is-current a { color: white !important; }

/* -- Wikitable -- */

.urasekai-wikitable { border-collapse: collapse; }

.urasekai-wikitable th { background: #1510a0; border: 1px solid #056cb0; border-bottom: 5px solid #079afc; color: #fff; padding: 10px; text-align: center; }

.urasekai-wikitable td { padding: 4px; }

.urasekai-wikitable > caption { font-weight: bold; }

.urasekai-wikitable > * > tr:hover td:not([rowspan]) { background-color: rgba(107, 145, 213, 0.12); }

/* -- Discord Sidebar Styling -- */

.discord-widget .widget-header { background: #1510a0; }

.discord-widget .widget-role-name { background: url("https://static.wikia.nocookie.net/otherside-picnic/images/e/ed/Chibi_Hasshaku-sama.png/revision/latest?cb=20210105094642") no-repeat 100px / 18%, url("https://static.wikia.nocookie.net/otherside-picnic/images/b/ba/Chibi_Kunekune.png/revision/latest?cb=20210105094643") no-repeat 150px /  20%, #1510a0 url("https://static.wikia.nocookie.net/otherside-picnic/images/9/96/Chibi_Ninja_Cat.png/revision/latest?cb=20210105094644") no-repeat 190px  /  18%; border-radius: 5px; color: #fff !important; padding: 5px; }

.theme-fandomdesktop-light .discord-widget .widget-body { background: linear-gradient(to right, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("https://static.wikia.nocookie.net/otherside-picnic/images/b/b7/Otherside_1.png/revision/latest?cb=20210109150121") center / cover no-repeat !important; }

.theme-fandomdesktop-dark .discord-widget .widget-body { background: linear-gradient(to right, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("https://static.wikia.nocookie.net/otherside-picnic/images/2/26/Otherside_3.png/revision/latest?cb=20210109150122") center / cover no-repeat !important; }

.discord-widget .widget-body::-webkit-scrollbar-thumb { background-color: rgba(5, 108, 176, 0.4) !important; }

.discord-widget .widget-member-avatar img { background: #1510a0; border: 2px solid #1510a0; }

.discord-widget .widget-member .widget-member-name { background: #1510a0; color: #fff; }

.discord-widget .widget-footer { background: #1510a0 !important; }

.discord-widget .widget-footer-info { color: #fff !important; }

.discord-widget .widget-btn-connect { background: #fff !important; border: 0 !important; color: #1510a0 !important; }

/* -- OGG Player -- */

.audio-button { width: 32px; height: 32px; background-color: #4b45ed; background-size: 20px; border: 1px solid #1e17e8; border-radius: 40%; vertical-align: -10px; }

.audio-button.click-parent { display: none; }

.audio-button.now-playing, .audio-button:hover, .audio-button-parent:hover > .click-parent { background-color: #1e17e8; border-color: #1812ba; }

.audio-button.now-playing { background-color: #1711c3; border-color: #1812ba; }

.audio-button.no-audio { background-color: #f75572; border-color: #f40b36; }