MediaWiki:Common.css

/* SKIN SPECIFIC STUFF IS IN HERE: MediaWiki:Timeless.css */

/* Imports go here */
@import url('https://fonts.googleapis.com/css?family=Tinos&display=swap');
@import url('https://fonts.googleapis.com/css?family=Inknut+Antiqua:700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Tienne&display=swap');
@import url('https://fonts.googleapis.com/css?family=Bitter&display=swap');
@import url('https://fonts.googleapis.com/css?family=Volkhov&display=swap');

/* Imports:
> MediaWiki:Tabber.css - Tabber styles
> MediaWiki:NavTown.css - Town tabber with scroll styles
> MediaWiki:ThemeInfobox.css - Default infobox styles
> MediaWiki:ThemeSpecies.css - Species infobox styles
> MediaWiki:ThemeNPC.css - NPC infobox styles
> MediaWiki:Mbox.css - Mbox styles
> MediaWiki:DiscordBanner.css - Discord banner styles
> MediaWiki:ShowMore.css - Show morer styles
*/
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:Tabber.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:NavTown.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ThemeInfobox.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ThemeSpecies.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ThemeNPC.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:Mbox.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:DiscordBanner.css");
@import url("/w/index.php?action=raw&ctype=text/css&title=MediaWiki:ShowMore.css");
/* Default image CSS */
img {
	max-width: 100%;
    height: auto;
}

/* Make images responsive */
.responsive img,img.responsive {
    max-width: 100%;
    height: auto;
}

.banner img,img.banner {
	max-width: 100%;
    height: auto;
    max-height: 10rem;
    width: auto;
}

/* Hide main page title */
body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }

/* Clearfix */
.clearfix::before,
.clearfix::after {
  content: "";
  display: table;
} 
.clearfix::after {
  clear: both;
}
.clearfix {
  zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}

.cf-fix::before {
	content: none; /* Make top margins collapse nicely */
}

/*****************************
* Stuff from Gamepedia start *
******************************/

/* Navbox template style */
/* Navbox container style */
.navbox {
    border: 1px solid #9F6A00;
    font-size: 88%;
    text-align: center;
    width: 100%;
    margin: auto;
    padding: 1px;
    clear: both;
}

.navbox-inner,
.navbox-subgroup {
    width: 100%;
}

/* Title, group and above/below styles */
.navbox-group,
.navbox-title,
.navbox-abovebelow {
    text-align: center;	
    padding: 0.25em 1em;
    line-height: 1.5em;
}

/* Group style */
th.navbox-group {				
    white-space: nowrap;
    /* @noflip */
    text-align: right;
}

.navbox,
.navbox-subgroup {
    background-color: transparent;
}

.navbox-list {
    line-height: 1.8em;
    border-color: transparent;	/* Must match background color */
}

/* Level 1 color */
.navbox th,
.navbox-title {
    background-color: #282828;
    border: 0 solid #9F6A00;
    color: #FFFFFF;
}

/* Level 2 color */
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
    background: #282828;
}

/* Level 3 color */
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #444444;		
}

/* Odd row striping */
.navbox-odd {
    background: transparent;	
}

/* Even row striping */
.navbox-even {
    background-color: rgba(128,128,128,0.3);	
}

/* Single pixel border between adjacent navboxes */
table.navbox + table.navbox {	
    margin-top: -1px;
}

/* Default styling for Navbar template */
.navbar {
    font-size: 88%;
    font-weight: normal;
}

/* Navbar styling when nested in infobox and navbox */
.navbox .navbar {
    display: block;
    font-size: 100%;
}

.navbox-title .navbar {
    float: left;
    text-align: left;
    margin-right: 0.5em;
    width: 6em;
}

/* Styling for JQuery makeCollapsible, matching that of collapseButton */
.mw-collapsible-toggle {
    font-weight: normal;
    /* @noflip */
    text-align: right;
}

.navbox .mw-collapsible-toggle {
    width: 6em;
}

/* .navbox .mw-collapsible-toggle a, */
.wikitable .mw-collapsible-toggle a {
    color: #F58120 !important;
}

.mw-collapsible-toggle.mw-collapsible-toggle-expanded a, 
.mw-collapsible-toggle.mw-collapsible-toggle-collapsed a {
    color: #F37F20;
}

/* Infobox template style */
.infobox {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #505050;
    float: right;
    font-size: 89%; 
    margin-bottom: 0.5em;
    padding: 0.2em;
    width: 300px;
}

.infobox td.infoboxlabel {
    border: 2px solid inherit; 
    font-weight: bold;
    padding: 0.5px 7px;
    text-align: right;
}

.infoboxname {
    background-color: #f58120;
    color: #000;
    font-size: 110%;
    font-weight: bold;
    padding: 0.5em;
}

.infoboxdescription {
    background-color: #f58120;
    color: #000;
}

fieldset { border-color: #F37F20; }
#global-wrapper #preferences legend { color: #F37F20; }
.client-js #preferences fieldset { background: none; }

/* [[Template:Message]] */
table.gpmbox {
    background:var(--message-background);
    color:var(--text-color);
}

/***************************
* Stuff from Gamepedia end *
****************************/

/**********************
* Main page CSS start *
***********************/

/* Main page */

/* MP-Box stuff*/

.mp-box,
.mp-banner {
	margin: 0.5em 0;
	box-shadow: 0 0.25rem 0.35rem -0.25rem var(--mp-border,black);
}

.mp-box {
	border: 1px solid var(--mp-border,black);
	background: var(--secondary-lighter,#FAFAFA);
	padding: 0.75em 1.5em;
	width: 100%;
	box-sizing: border-box;
}

.mp-box > * {
	width: 100%;
}

.mp-heading {
	color: var(--text);
	font-size: 132%;
	font-weight: bold;
	margin: 0 0 0.5em;
	padding: 0 0 0.25em;
	text-align: center;
	border-bottom: 1px solid var(--mp-border,black);
}

.mp-box hr {
  border-style: solid none none none;
}

/* Announcement box stuff */
#announcement-mpbox hr:nth-last-of-type(1) {
	display: none;
}

#announcement-mpbox > * > h4 {
	margin: 0 0;
}

#announcement-mpbox > * > p {
	margin: 0.25em 0;
}

#announcement-mpbox > * > p:nth-last-of-type(1) > small:nth-last-of-type(1),
#announcement-mpbox > * > p:nth-last-of-type(1) > small:nth-last-of-type(2) {
	float: left;
}

/* Recent Changes stuff */
.mp-box .mw-changeslist {
	font-size: 80%;
	white-space: nowrap;
	overflow: hidden;
	padding-bottom: 0.5em;
}

.mp-box .mw-enhancedchanges-arrow-space,
.mp-box .mw-rcfilters-ui-highlights-enhanced-nested,
.mp-box .mw-changeslist-legend,
.mp-box .mw-rollback-link,
.mp-box .mw-changeslist-line-inner-userTalkLink,
.mp-box .mw-changeslist-line-inner-rollback,
.mp-box .mw-changeslist-line-inner-tags,
.mp-box .mw-changeslist-line-inner-watchingUsers {
	display: none;
}

.mp-box .mw-changeslist-line-inner > * {
	vertical-align: baseline;
}

.mp-box .mw-changeslist-line-inner-comment {
	display: inline-block;
	vertical-align: bottom;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 10em;
	vertical-align: bottom;
	margin-left: 3px;
}

.mp-box .mw-changeslist > h4 {
	margin: 0.8em 0 0.4em;
}

/*.mp-box .mw-changeslist-line > tbody > tr > .mw-enhanced-rc {
	max-width: 6em;
	direction: rtl;
}

.mp-box .mw-changeslist-line-inner {
	position: relative;
	right: 2em;
}*/

.mp-box .mw-changeslist-line-inner .mw-title::after {
	content:"";
	display:block;
}

.mp-box .mw-changeslist-separator:empty::before {
	content: "";
}

.mp-box .mw-changeslist-history {
	display:none;
}

.mp-box .mw-changeslist-links > span:nth-child(2)::before,
.mp-box .mw-changeslist-links::before,
.mp-box .mw-changeslist-links::after {
	content:"";
}

.mp-box .mw-changeslist-line-inner-userLink::before {
	content:"["
}

.mp-box .mw-changeslist-line-inner-userLink::after {
	content:"]"
}

.mp-box .mw-changeslist-diff {
	text-transform: capitalize;
}

table.mw-enhanced-rc th,
table.mw-enhanced-rc td {
 padding:0;
 vertical-align:baseline;
}

.mp-box .mw-enhanced-rc > abbr {
  position: relative;
  left: 2em;
}

.mp-box .mw-changeslist > div {
  position: relative;
  right: 1.5em;
}

.mp-box .comment--without-parentheses:before,
.mp-box .comment--without-parentheses:after {
	content:"";
}


/********************
* Main page CSS end *
*********************/

#mw-site-navigation .sidebar-inner h3,
#mw-related-navigation .sidebar-inner h3,
#mw-site-navigation .dropdown h3,
#mw-related-navigation .dropdown h3 {
	border-color: var(--gray-lightish);
}

/* Default table style */
table {
	background: #d6d0c5;
	border-collapse: collapse;
	border: 0px none #aeaaa2;
	margin:1em 1em 1em 0;
}

th {
	background: #cfc9bc;
	text-align: left;
}

th, td  {
	border: 1px #aeaaa2 solid;
	padding: 6px 12px;
}

tr:nth-child(odd) {
	background: var(--secondary);
}

tr:nth-child(even) {
	background: hsl(var(--z-secondary-h), calc(var(--z-secondary-s) * 1%), calc(var(--z-secondary-l) * (100 - var(--x-darkish)) / 90 * 1%));
}