MediaWiki:Wikia.css

/* ==================  Site Design Based of Sun and Moon ================== */

.WikiaSiteWrapper { background-color: rgba(0,0,0,.08); }

.WikiaPage { border: none; }

.WikiaMainContent { border-radius: 10px; }

.WikiaArticle { font-size: 16px; }

.wikia-page-header .header-container, .WikiaArticle h2 { border-bottom: 1px solid rgba(255, 255, 255, 0.75); }

.WikiaRail .module { border: 0; border-radius: 5px; background-color: rgba(18,82,158,.1); }

.WikiaFooter section { border: none; border-radius: 5px; background-color: transparent; }

background-image: none; }
 * 1) SPOTLIGHT_FOOTER {

.discussion-module .discussion-threads .discussion-thread { border: 0; border-radius: 5px; background-color: rgba(18,82,158,.1); }

.discussion-module .discussion-threads .discussion-thread:hover { background-color: rgba(18,82,158,.2); } /* ======================  Pre, Special:CSS Making them more readable ======================= */ .WikiaArticle pre { border:2px solid #154fa0; -moz-border-radius:15px; -webkit-border-radius:15px; -o-border-radius:15px; -ms-border-radius:15px; border-radius:15px; -moz-box-shadow:0 0 5px #154fa0 inset; -webkit-box-shadow:0 0 5px #154fa0 inset; -o-box-shadow:0 0 5px #154fa0 inset; -ms-box-shadow:0 0 5px #154fa0 inset; box-shadow:0 0 5px #154fa0 inset; line-height:140%; width:auto; margin:auto auto auto auto; word-break: break-all; word-wrap: break-word; white-space: pre; white-space: -moz-pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; } /* =======================  Right rail & footer ======================= */   .WikiaRail .module, .mainpage-highlight, .community-updates widget-box, .education-links li, .widget-box li { border-radius:5px; background:rgba(18,82,158,.1) !important; }

display:none; } /* ========================  Chat button fix ======================== */
 * 1) WikiaRail > section.community-page-entry-point-module.module > div.community-page-entry-point-logo, div.community-page-entry-point-new {

.ChatModule .chat-join { top:21px; }

/* ========  Wiki nav ======== */ .WikiHeader > nav li > a { border-left: none; } display:none; }
 * 1) WikiHeader > div.buttons > nav > ul {width:125px; border-top-right-radius:6px;}
 * 2) WikiHeader > nav > ul > li.nav-item.marked {border-radius:10px 10px 0px 0px; }
 * 3) WikiHeader > nav > div {border-bottom-left-radius:10px; border-top-right-radius:4px}
 * 4) WikiHeader > nav > ul > li.nav-item.marked > a {border-top:0px;}
 * 5) WikiHeader > div.buttons > nav > ul {width:125px; border-top-right-radius:6px; }
 * 1) WikiHeader > nav > div > div {

border-bottom:0; }
 * 1) WikiHeader > nav > ul > li {

display:none; }
 * 1) WikiHeader > nav > div > img {

.WikiHeader > nav .subnav-2 .marked2 .subnav-2a { color:#3a3a3a } /* ==================  Media queries These help the design respond better to changes of browser width. in other words, they implement at least rdudimentary responsive design.

=
===== */ @media only screen and (max-width:1023px) { .fpcontainer, .front-page-right-column { width:650px; margin:0 auto; padding-left:100px; } } @media only screen and (min-width:1024px) { .fpcontainer, .front-page-right-column { width:250px; margin: 0 auto; } }

/* ====================================  Below this line are the existing CSS mods as of 12 November ==================================== */

/* New article listing style bullet */ .WikiaArticle ul { list-style:square outside url("http://img1.wikia.nocookie.net/__cb20140826143924/pokemon/images/4/4d/Poke_Ball_bullet.png"); margin:0 0 0.3em 2.5em; }

.ajax-poll { border: 1px solid #AAA; }

/* -*/

/* User Pages */ background:none; }   display:none; }
 * 1) WikiaUserPagesHeader {
 * 1) UserProfileMasthead > div.masthead-info > div.masthead-info-lower::before {

/* User Page Tab Row */ background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(0%,#176acc),color-stop(100%,#12529e)); border-top-left-radius:7px; border-top-right-radius:7px; border-radius:7px; padding-bottom:5px; }
 * 1) WikiaUserPagesHeader > div {

border-bottom:none; }
 * 1) WikiaUserPagesHeader > div > ul {

background:transparent !important; border:none; color:black !important; }
 * 1) WikiaUserPagesHeader > div > ul > li.selected > a {

color: #FFFFFF !important; }
 * 1) WikiaUserPagesHeader > div > ul > li> a {

.firstChild li:last-child { display: none; }

.roundy { -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -icab-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; }

table table tr td { border-radius:20px; }

caption { font-weight:bold; border:inherit; border-bottom:0; }

table.article-table { border:1px solid darkorange; margin:auto; }

table.article-table thead, table.article-table tbody th, table.article-table caption { background-color:darkorange; text-align:center; }

table.article-table th { background-color:darkorange; border-color:darkorange; }

table.article-table tbody { background-color:#97cbff; text-align:center; }

table.article-table td { border-color:darkorange; }

table.article-table th { padding:4px 6px; }

table.article-table img { padding:4px; }

table.article-table li { text-align:left; }

/*-*/ .portable-infobox { float:right; background-color: #97cbff; -o-border-radius:25px; -moz-border-radius:25px; -webkit-border-radius:25px; border-radius:25px; width:275px; }

.portable-infobox .pi-title { font-weight:bold; border-left:3px solid darkorange !important; border-right:3px solid darkorange !important; border-top:3px solid darkorange !important; border-radius:20px 20px 0 0; }

.portable-infobox figure { background:#97cbff; }

.portable-infobox .pi-image-collection-tabs, .portable-infobox figure, .portable-infobox .pi-data, .pi-group:last-child .pi-image-collection, .portable-infobox .pi-header, .portable-infobox .pi-navigation { border-left:3px solid darkorange !important; border-right:3px solid darkorange !important; }

.portable-infobox .pi-title, .portable-infobox .pi-header { background: darkorange; font-weight:bold; }

.portable-infobox section:last-child > .pi-item-spacing:last-child { padding: 0.5em 10px 1em; }

.portable-infobox .pi-image-collection-tabs { padding:0 0 0.4em !important; margin:0 !important; text-align:center !important; }

.portable-infobox section:last-child .pi-image-collection-tabs { border-left: 0 !important; border-right: 0 !important; padding-bottom:8px; }

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

.portable-infobox .pi-navigation { text-align: center; background-color: #97cbff; font-weight:bold; border-top:1px solid darkorange; font-size:11px; }

.portable-infobox .pi-data + .pi-navigation { border-top:0; }

.portable-infobox section:last-child > h2 ~ div:last-child { border-left:3px solid darkorange !important; border-right:3px solid darkorange !important; border-bottom:3px solid darkorange !important; border-radius:0 0 20px 20px; }

.portable-infobox section:last-child > h2 + .pi-image-collection div, .portable-infobox section:last-child > h2 + .pi-image-collection figure { -o-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; -webkit-border-radius:0 0 20px 20px; border-radius:0 0 20px 20px; border:0 !important; }

.portable-infobox .pi-tab-link, .portable-infobox > h2 + div + div, .portable-infobox .pi-header, .portable-infobox figure + div { font-style:italic; }

.portable-infobox figure figcaption { display:none; }

.portable-infobox > section:last-child table { border:0 !important; }

.portable-infobox div:hover h3, .portable-infobox td:hover, .portable-infobox li:hover { color:darkorange; }

.portable-infobox div:hover h2, .portable-infobox h2:hover { color:#97cbff; }

.pi-collapse:last-child .pi-image img { max-width:245px; height:auto; }

/* Character Pokémon */ h2 ~ .char-poke, h3 ~ .char-poke, h4 ~ .char-poke, h5 ~ .char-poke, h6 ~ .char-poke { width:calc(100% / 3 - 2px); float:left; margin:1px; height:170px; text-align:center; }

h2 ~ .char-poke td, h3 ~ .char-poke td, h4 ~ .char-poke td, h5 ~ .char-poke td, h6 ~ .char-poke td { text-align:center; }

h2 ~ .char-poke img, h3 ~ .char-poke img, h4 ~ .char-poke img, h5 ~ .char-poke img, h6 ~ .char-poke img { max-height:120px; width:auto; margin-bottom:0.25em; }

div#mw-content-text .char-poke + h2, div#mw-content-text .char-poke + h3, div#mw-content-text .char-poke + h4, div#mw-content-text .char-poke + h5, div#mw-content-text .char-poke + h6 { clear:both; padding-top:1em; }

.char-poke a { font-weight:bold; font-size:0.75em; text-align:center; }

/* Gallery Box */ div.gallery { height:250px; width:100%; margin-top:1em; text-align:center; overflow:auto; border:1px solid #c0c0c0; }

/* Columns */ .column-2 { column-count:2; }

.column-3 { column-count:3; }

.column-4 { column-count:4; }

/* Card */ width:calc(100% - 6px); border:3px solid cornflowerblue; }
 * 1) card aside {

float:right; width:calc(100% - 352px); text-align:center; padding-bottom:0; border-top:0 !important; background:transparent; }
 * 1) card .pi-title {

color:darkorange; }
 * 1) card .pi-title:hover, #card .pi-navigation:hover {

float:left; width:calc(100% - 90px); }
 * 1) card section:last-child > div:last-child > h3 + div {

-ms-flex-preferred-size: initial; -webkit-flex-basis: initial; -moz-flex-basis: initial; -flex-basis: initial; }
 * 1) card h3 + div.pi-data-value.pi-font {

border-left:0; border-right:0; }
 * 1) card .pi-title, #card figure, #card .pi-image-collection-tabs, #card .pi-image, #card .pi-data, #card .pi-header, #card .pi-horizontal-group, #card .pi-navigation {

padding:0 !important; text-align:left !important; margin-left:70px !important; }
 * 1) card .pi-image-collection-tabs {

width:35%; }
 * 1) card .pi-horizontal-group td:first-child {

border-bottom:1px solid darkorange; }
 * 1) card .pi-navigation {

margin-bottom:5px; }
 * 1) card .pi-navigation center {

display:none; }
 * 1) card .pi-navigation br + br {

margin-top:5px; }
 * 1) card .pi-navigation img {

min-height:36px; }
 * 1) card .pi-data {

float:left; margin:1em; }
 * 1) card figure {

padding-left:0; }
 * 1) card .pi-data-value:not(:first-child) {

max-width:300px; height:auto; width:auto; }
 * 1) card figure img {

width:calc(100% - 328px); float:left; padding:0 !important; }
 * 1) card section, #card nav {

align-self:center; }
 * 1) card .pi-data .pi-data-value, #card .pi-data .pi-data-label {

align-self:initial; }
 * 1) card .pi-data:last-child .pi-data-value, #card .pi-data:last-child .pi-data-label {

width:250px; float:right; -moz-border-radius:20px; -o-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; }
 * 1) poke_infobox {

-moz-border-radius:20px; -o-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; }
 * 1) poke_infobox table {

-moz-border-radius:20px 20px 0 0; -o-border-radius:20px 20px 0 0; -webkit-border-radius:20px 20px 0 0; border-radius:20px 20px 0 0; }
 * 1) poke_infobox tr:first-child th {

max-width:245px; height:auto; }
 * 1) poke_infobox img {

@media screen and (max-width:1032px) { width:initial; float:none; }   text-align:center !important; margin:0 !important; }
 * 1) card .pi-title {
 * 1) card .pi-title, #card .pi-image-collection-tabs {

width:100%; }
 * 1) card figure, #card .pi-navigation, #card section {

margin:0; margin-top:0.25em; }
 * 1) card figure {

width:50% !important; }
 * 1) card section .pi-item-spacing {

width:100% !important; }
 * 1) card section .pi-item-spacing:last-child {

align-self:center; }
 * 1) card .pi-data:last-child .pi-data-value, #card .pi-data:last-child .pi-data-label {

height:40px; }
 * 1) card section > div {

height:initial !important; }
 * 1) card section > div:last-child {

flex-basis:100px; }
 * 1) card .pi-item-spacing > h3 {

ul.pi-image-collection-tabs { text-align:center; }

.pi-data { float:left; }

}

@media screen and (min-width:1600px) { width:calc(100% - 332px); } }
 * 1) card section, #card nav {