MediaWiki:Common.css

From Little-Known Galaxy Wiki
Jump to navigation Jump to search

Note: After publishing, 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 / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */

/*****************************
*           FONTS            *
******************************/
/* Font used in-game for headers: https://fonts.google.com/specimen/Quantico */
@import url('https://fonts.googleapis.com/css2?family=Quantico&display=swap');

/* Font used in-game for dialogue and most things: https://fonts.google.com/specimen/Tomorrow */
@import url('https://fonts.googleapis.com/css2?family=Tomorrow&display=swap');

:root,
.view-light {
    --wiki-body-background-image: url(https://lkg.wiki.gg/images/f/f9/Light-background.png);
    --wiki-body-background-color: #f6f6f6;
    --wiki-body-background-color--rgb: 246,246,246;
    --wiki-body-dynamic-color: #000000;
    --wiki-body-dynamic-color--rgb: 0,0,0;
    --wiki-body-dynamic-color--inverted: #ffffff;
    --wiki-body-dynamic-color--inverted--rgb: 255,255,255;
    --wiki-body-dynamic-color--secondary: #333333;
    --wiki-body-dynamic-color--secondary--rgb: 51,51,51;
    --wiki-body-dynamic-color--secondary--inverted: #dddddd;
    --wiki-body-dynamic-color--secondary--inverted--rgb: 221,221,221;
    --wiki-body-font-family: 'Tomorrow', sans-serif;
    
    --wiki-content-background-color: #ffffff;
    --wiki-content-background-color--rgb: 255, 255, 255;
    --wiki-content-background-opacity: 1;
    --wiki-content-background-color--secondary: #fbfbfb;
    --wiki-content-background-color--secondary--rgb: 251, 251, 251;
    --wiki-key-background-color:#8174aa;
    --wiki-content-table-border-color:#6cb7db;
    --wiki-content-active-border-color:#acdff7;
    --wiki-content-border-color:#6cb7db;
    --wiki-content-border-color--rgb:167,215,249;
    --wiki-content-text-color: #111111;
    --wiki-content-text-color--rgb: 17, 17, 17;
    --wiki-content-link-color: #0645ad;
    --wiki-content-link-color--rgb: 6, 69, 173;
    --wiki-content-link-label-color: #ffffff;
    --wiki-content-link-label-color--rgb: 255,255,255;
    --wiki-content-link-color--visited: var(--wiki-content-link-color);
    --wiki-content-link-color--visited--rgb: var(--wiki-content-link-color--rgb);
    --wiki-content-link-color--hover: var(--wiki-content-link-color);
    --wiki-content-link-color--hover--rgb: var(--wiki-content-link-color--rgb);
    --wiki-content-redlink-color: #ba0000;
    --wiki-content-redlink-color--rgb: 186,0,0;
    --wiki-content-text-mix-color: #8a8b8b;
    --wiki-content-text-mix-color--rgb: 138,139,139;
    --wiki-content-text-mix-color-95: #eef0f0;
    --wiki-content-text-mix-color-95--rgb: 238,240,240;
    --wiki-content-dynamic-color: #000000;
    --wiki-content-dynamic-color--rgb: 0,0,0;
    --wiki-content-dynamic-color--inverted: #ffffff;
    --wiki-content-dynamic-color--inverted--rgb: 255,255,255;
    --wiki-content-dynamic-color--secondary: #333333;
    --wiki-content-dynamic-color--secondary--rgb: 51,51,51;
    --wiki-content-dynamic-color--secondary--inverted: #dddddd;
    --wiki-content-dynamic-color--secondary--inverted--rgb: 221,221,221;

    --wiki-heading-color: var(--wiki-content-text-color);
    --wiki-heading-color--rgb: var(--wiki-content-text-color--rgb);
    --wiki-heading-font-family: 'Quantico','Linux Libertine','Georgia','Times',serif;

    --wiki-accent-color: #8174aa;
    --wiki-accent-color--rgb: 51, 102, 204;
    --wiki-accent-color--hover: #447ff5;
    --wiki-accent-color--hover--rgb: 68, 127, 245; 
    --wiki-accent-label-color: #ffffff;
    --wiki-accent-label-color--rgb: 255, 255, 255;
    --wiki-accent-link-color: #22214d;
    --wiki-accent-link-color--rgb: 34, 33, 77;

    --wiki-sidebar-background-color: var(--wiki-content-background-color);
    --wiki-sidebar-background-color--rgb: var(--wiki-content-background-color--rgb);
    --wiki-sidebar-background-opacity: 0.8;
    --wiki-sidebar-border-color: var(--wiki-body-background-color);
    --wiki-sidebar-border-color--rgb: var(--wiki-body-background-color--rgb);
    --wiki-sidebar-link-color: var(--wiki-content-link-color);
    --wiki-sidebar-link-color--rgb: var(--wiki-content-link-color--rgb);
    --wiki-sidebar-heading-color: var(--wiki-heading-color);
    --wiki-sidebar-heading-color--rgb: var(--wiki-heading-color--rgb);

    --wiki-navigation-background-color:#ffffff;
    --wiki-navigation-background-color--rgb: 255, 255, 255;
    --wiki-navigation-background-color--secondary: #e8f2f8;
    --wiki-navigation-background-color--secondary--rgb: 232, 242, 248;
    --wiki-navigation-border-color: var(--wiki-content-border-color);
    --wiki-navigation-border-color--rgb: var(--wiki-content-border-color--rgb);
    --wiki-navigation-text-color: var(--wiki-content-link-color);
    --wiki-navigation-text-color--rgb: var(--wiki-content-link-color--rgb);
    --wiki-navigation-selected-background-color: var(--wiki-content-background-color);
    --wiki-navigation-selected-background-color--rgb: var(--wiki-content-background-color--rgb);
    --wiki-navigation-selected-border-color: var(--wiki-navigation-border-color);
    --wiki-navigation-selected-border-color-rgb: var(--wiki-navigation-border-color--rgb);
    --wiki-navigation-selected-text-color: var(--wiki-content-text-color);
    --wiki-navigation-selected-text-color-rgb: var(--wiki-content-text-color--rgb);

    --wiki-alert-color: #bf0017;
    --wiki-alert-color--rgb: 191,0,23;
    --wiki-alert-label-color: #ffffff;
    --wiki-alert-label-color--rgb: 255, 255, 255;
    --wiki-warning-color: #cf721c;
    --wiki-warning-color--rgb: 207,114,28;
    --wiki-warning-label-color: #000000;
    --wiki-warning-label-color--rgb: 0, 0, 0;
    --wiki-success-color: #0c742f;
    --wiki-success-color--rgb: 12,116,47;
    --wiki-success-label-color: #ffffff;
    --wiki-success-label-color--rgb: 255, 255, 255;
    
    --wiki-icon-general-filter: none;
    --wiki-icon-to-link-filter: invert(20%) sepia(93%) saturate(2141%) hue-rotate(210deg) brightness(83%) contrast(103%);
    --custom-admin-highlight:#0053a8;
}

.view-dark {
  --wiki-body-background-image:url(https://lkg.wiki.gg/images/0/0c/Background-dark.png);
  --wiki-body-background-color:#171717;
  --wiki-body-background-color--rgb:23,23,23;
  --wiki-body-dynamic-color:#ffffff;
  --wiki-body-dynamic-color--rgb:255,255,255;
  --wiki-body-dynamic-color--inverted:#000000;
  --wiki-body-dynamic-color--inverted--rgb:0,0,0;
  --wiki-body-dynamic-color--secondary:#dddddd;
  --wiki-body-dynamic-color--secondary--rgb:221,221,221;
  --wiki-body-dynamic-color--secondary--inverted:#333333;
  --wiki-body-dynamic-color--secondary--inverted--rgb:51,51,51;
  --wiki-body-font-family:'Tomorrow',sans-serif;
  --wiki-content-background-color:#101221;
  --wiki-content-background-color--rgb:18,18,33;
  --wiki-content-background-opacity:1.0;
  --wiki-content-background-color--secondary:#0d112a;
  --wiki-content-background-color--secondary--rgb:13,17,42;
  --wiki-key-background-color:#101221;
  --wiki-content-table-border-color:#9a329e;
  --wiki-content-active-border-color:002954;
  --wiki-content-border-color:#9a329e;
  --wiki-content-border-color--rgb:153,26,81;
  --wiki-content-text-color:#e1fafe;
  --wiki-content-text-color--rgb:225,250,254;
  --wiki-content-link-color:#00dcff;
  --wiki-content-link-color--rgb:109,138,251;
  --wiki-content-link-label-color:#000;
  --wiki-content-link-label-color--rgb:0,0,0;
  --wiki-content-link-color--visited:var(--wiki-content-link-color);
  --wiki-content-link-color--visited--rgb:var(--wiki-content-link-color--rgb);
  --wiki-content-link-color--hover:var(--wiki-content-link-color);
  --wiki-content-link-color--hover--rgb:var(--wiki-content-link-color--rgb);
  --wiki-content-redlink-color:#FC3B2C;
  --wiki-content-redlink-color--rgb:252,59,44;
  --wiki-content-text-mix-color:#868686;
  --wiki-content-text-mix-color--rgb:134,134,134;
  --wiki-content-text-mix-color-95:#2a2a2a;
  --wiki-content-text-mix-color-95--rgb:42,42,42;
  --wiki-content-dynamic-color:#ffffff;
  --wiki-content-dynamic-color--rgb:255,255,255;
  --wiki-content-dynamic-color--inverted:#000000;
  --wiki-content-dynamic-color--inverted--rgb:0,0,0;
  --wiki-content-dynamic-color--secondary:#dddddd;
  --wiki-content-dynamic-color--secondary--rgb:221,221,221;
  --wiki-content-dynamic-color--secondary--inverted:#333333;
  --wiki-content-dynamic-color--secondary--inverted--rgb:51,51,51;
  --wiki-heading-color:var(--wiki-content-text-color);
  --wiki-heading-color--rgb:var(--wiki-content-text-color--rgb);
  --wiki-heading-font-family:'Quantico','Linux Libertine','Georgia','Times',serif;
  --wiki-accent-color:#0053a8;
  --wiki-accent-color--rgb:255,25,128;
  --wiki-accent-color--hover:#00dcff;
  --wiki-accent-color--hover--rgb:216,32,115;
  --wiki-accent-label-color:#000;
  --wiki-accent-label-color--rgb:0,0,0;
  --wiki-accent-link-color:#22214d;
  --wiki-accent-link-color--rgb:34,33,77;
  --wiki-sidebar-background-color:var(--wiki-content-background-color);
  --wiki-sidebar-background-color--rgb:var(--wiki-content-background-color--rgb);
  --wiki-sidebar-background-opacity:var(--wiki-content-background-opacity);
  --wiki-sidebar-border-color:var(--wiki-content-border-color);
  --wiki-sidebar-border-color--rgb:var(--wiki-content-border-color--rgb);
  --wiki-sidebar-link-color:var(--wiki-content-link-color);
  --wiki-sidebar-link-color--rgb:var(--wiki-content-link-color--rgb);
  --wiki-sidebar-heading-color:var(--wiki-heading-color);
  --wiki-sidebar-heading-color--rgb:var(--wiki-heading-color--rgb);
  --wiki-navigation-background-color:var(--wiki-content-border-color);
  --wiki-navigation-background-color--rgb:var(--wiki-content-border-color--rgb);
  --wiki-navigation-background-color--secondary:var(--wiki-content-background-color--secondary);
  --wiki-navigation-background-color--secondary--rgb:var(--wiki-content-background-color--secondary--rgb);
  --wiki-navigation-border-color:var(--wiki-content-border-color);
  --wiki-navigation-border-color--rgb:var(--wiki-content-border-color--rgb);
  --wiki-navigation-text-color:var(--wiki-content-link-color);
  --wiki-navigation-text-color--rgb:var(--wiki-content-link-color--rgb);
  --wiki-navigation-selected-background-color:var(--wiki-content-background-color);
  --wiki-navigation-selected-background-color--rgb:var(--wiki-content-background-color--rgb);
  --wiki-navigation-selected-border-color:var(--wiki-navigation-border-color);
  --wiki-navigation-selected-border-color-rgb:var(--wiki-navigation-border-color--rgb);
  --wiki-navigation-selected-text-color:var(--wiki-content-text-color);
  --wiki-navigation-selected-text-color-rgb:var(--wiki-content-text-color--rgb);
  --wiki-alert-color:#ce0018;
  --wiki-alert-color--rgb:206,0,24;
  --wiki-alert-label-color:#000000;
  --wiki-alert-label-color--rgb:0,0,0;
  --wiki-warning-color:#cf721c;
  --wiki-warning-color--rgb:207,114,28;
  --wiki-warning-label-color:#000000;
  --wiki-warning-label-color--rgb:0,0,0;
  --wiki-success-color:#0c742f;
  --wiki-success-color--rgb:12,116,47;
  --wiki-success-label-color:#000000;
  --wiki-success-label-color--rgb:0,0,0;
  --wiki-icon-general-filter:invert(100%);
  --wiki-icon-to-link-filter:invert(60%) sepia(70%) saturate(3715%) hue-rotate(206deg) brightness(101%) contrast(97%);
  --custom-admin-highlight:#8174aa;
}

/*****************************
*     PortableInfoboxes      *
******************************/
:root {
	--pi-background: var(--wiki-content-background-color);
	--pi-secondary-background: var(--wiki-accent-color);
	--pi-secondary-background--rgb: var(--wiki-accent-color--rgb);
	--pi-secondary-background-label: var(--wiki-accent-label-color);
	--pi-border-color: rgba(var(--pi-secondary-background--rgb),0.5);
}

.portable-infobox .pi-title,
.portable-infobox .pi-header {
	text-align:center;
	font-size:1.5em;
	background:rgba(var(--pi-secondary-background--rgb), 0.75);
	color:var(--pi-secondary-background-label);
}

.portable-infobox .pi-data {
	background:rgba(var(--pi-secondary-background--rgb), 0.18);
}

.portable-infobox .pi-image {
	padding: 8px;
}

.pi-image-thumbnail {
	max-width:100%;
}

.pi-section-navigation .pi-section-tab.pi-section-active,
.pi-section-navigation .pi-section-tab.current,
.pi-media-collection .pi-tab-link.current {
	background: var(--pi-secondary-background);
	color: var(--pi-secondary-background-label);
}

/* overqualify these to overwrite normal content heading styles */
.mw-body .portable-infobox h2,
.mw-body .portable-infobox h3 {
	border-bottom: 0;
	font-family: inherit;
	font-weight: 700;
	margin: 0;
}
/*****************************
*   End PortableInfoboxes    *
******************************/

/*********************************************************************************************************************
* Semantically-correct horizontal lists (for Module:Navbox, and they're more machine-readable than {{*}}-formatting) *
**********************************************************************************************************************/
.hlist dl,
.hlist ol,
.hlist ul {
	margin: 0;
	padding: 0;
}

/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
	/*
	 * don't trust the note that says margin doesn't work with inline
	 * removing margin: 0 makes dds have margins again
	 * We also want to reset margin-right in Minerva
	 */
	margin: 0; 
	display: inline;
}

/* Display requested top-level lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
/* Display nested lists inline */
.hlist dl dl,
.hlist dl ol,
.hlist dl ul,
.hlist ol dl,
.hlist ol ol,
.hlist ol ul,
.hlist ul dl,
.hlist ul ol,
.hlist ul ul {
	display: inline;
}

/* Hide empty list items */
.hlist .mw-empty-li {
	display: none;
}

/* TODO: :not() can maybe be used here to remove the later rule. naive test
 * seems to work. more testing needed. like so: */
.hlist dt:not(:last-child)::after {
	content: ": ";
}
.hlist dd:not(:last-child)::after,
.hlist li:not(:last-child)::after {
	content: " · ";
	font-weight: bold;
}

/* Add parentheses around nested lists */
.hlist dd dd:first-child::before,
.hlist dd dt:first-child::before,
.hlist dd li:first-child::before,
.hlist dt dd:first-child::before,
.hlist dt dt:first-child::before,
.hlist dt li:first-child::before,
.hlist li dd:first-child::before,
.hlist li dt:first-child::before,
.hlist li li:first-child::before {
	content: " (";
	font-weight: normal;
}

.hlist dd dd:last-child::after,
.hlist dd dt:last-child::after,
.hlist dd li:last-child::after,
.hlist dt dd:last-child::after,
.hlist dt dt:last-child::after,
.hlist dt li:last-child::after,
.hlist li dd:last-child::after,
.hlist li dt:last-child::after,
.hlist li li:last-child::after {
	content: ")";
	font-weight: normal;
}

/* Put ordinals in front of ordered list items */
.hlist ol {
	counter-reset: listitem;
}

.hlist ol > li {
	counter-increment: listitem;
}

.hlist ol > li::before {
	content: " " counter(listitem) "\a0";
}

.hlist dd ol > li:first-child::before,
.hlist dt ol > li:first-child::before,
.hlist li ol > li:first-child::before {
	content: " (" counter(listitem) "\a0";
}
/********************************************
* End semantically-correct horizontal lists *
*********************************************/

/**********************************************************
* Template:Navbox (needs semantic horizontal lists above) *
***********************************************************/
.mw-collapsible button.mw-collapsible-toggle > span {
  color: var(--wiki-content-link-color);
}

.navbox {
  clear:both;
  margin:0;
  padding:0px;
  font-size:90%;
  width:85%;
  border:1px solid var(--wiki-accent-color);
  border-collapse:collapse;
  text-align: center;
}

.navbox-title {
  font-weight:700;
  font-size:125%;
  padding:.25em .6em;
  line-height:1.5em;
  color:var(--wiki-accent-label-color);
  background:var(--wiki-accent-color)
}

.navbox-subheader{
  background:var(--wiki-accent-color);
  color:var(--wiki-accent-label-color);
  font-size:105%;
  text-align: center;
  vertical-align: center;
}

.navbox-category {
  text-align: left;
  width:100%;
}

.navbox-subheader .mw-collapsible-toggle {
  font-size:120%;
	text-align: right;
  padding-right: 20px;
  font-weight:999;
}

.navbox-subheader .mw-collapsible-toggle::before,
.navbox-subheader .mw-collapsible-toggle::after {
    display: none;
}

.navbox-category-subheader {
  background:var(--wiki-accent-color);
  color:var(--wiki-accent-label-color);
  text-align:center;
  width: 8em;
}

/* Mobile adjustments */
@media screen and (max-width: 1280px) {
	.mw-body .navbox-inner table {
        display: table;
	}
}
@media screen and (max-width: 1024px) {
	.mw-body .navbox {
		width:100%;
	}
}
/**********************
* End Template:Navbox *
***********************/


/*******************
* Main page layout *
********************/
#mp-box-welcome {grid-area: welcome;}
#mp-box-about {grid-area: about;}
#mp-box-items {grid-area: items;}
#mp-box-contribute {grid-area: contribute;}
#mp-box-featured {grid-area: featured;}
#mp-box-discord {grid-area: discord;}
#mp-box-locations {grid-area: locations;}
#mp-box-iconlists {grid-area: iconlists;}

/* Example Main Page 1 Grid Layout */
#mp-layout1-container {
	display:grid;
	grid-template-areas:
		"welcome"
		"about"
		"discord"
		"locations"
		"items"
		"contribute";
	grid-template-columns:100%;
	gap:10px;
}

@media screen and (min-width:990px) {
	#mp-layout1-container {
		grid-template-areas:
			"welcome welcome"
			"about about"
			"locations discord"
			"items items"
			"contribute contribute";
		grid-template-columns:1fr 1fr;
	}
}

@media screen and (min-width:1350px) {
	#mp-layout1-container {
		grid-template-areas:
			"welcome welcome welcome"
			"about about discord"
			"locations items items"
			"contribute contribute contribute";
		grid-template-columns: 2fr 1fr 2fr;
  }
}

/* Example Main Page 2 Grid Layout */
#mp-layout2-container {
	display:grid;
	grid-template-areas:
		"welcome"
		"links"
		"about"
		"gallery"
		"iconlists"
		"contribute";
	grid-template-columns:100%;
	gap:10px;
}

@media screen and (min-width:990px) {
	#mp-layout2-container {
		grid-template-areas:
			"welcome links"
			"gallery about"
			"iconlists about"
			"iconlists contribute";
		grid-template-columns:1fr 1fr;
	}
}

@media screen and (min-width:1350px) {
	#mp-layout2-container {
		grid-template-areas:
			"welcome welcome links"
			"welcome welcome about"
			"gallery gallery about"
			"iconlists iconlists contribute";
		grid-template-columns: 3fr 2fr 2fr;
  }
}

/* Example Main Page 3 Grid Layout */
#mp-layout3-container {
	display:grid;
	grid-template-areas:
    "welcome"
    "about"
    "featured"
    "four"
    "priority"
		"projects"
    "wiki";
	grid-template-columns:100%;
	gap:10px;
}

@media screen and (min-width:990px) {
	#mp-layout3-container {
		grid-template-areas:
      "welcome welcome"
      "about about"
      "featured four"
			"priority projects"
      "wiki wiki";
		grid-template-columns:1fr 1fr;
	}
}

@media screen and (min-width:1350px) {
	#mp-layout3-container {
		grid-template-areas:
      "welcome welcome welcome"
      "about about four"
			"featured featured four"
			"priority projects projects"
			"wiki wiki wiki";
		grid-template-columns:2fr 1fr 2fr;
  }
}

.mp-box {
	display:flex;
	flex-flow:column nowrap;
	width: calc(100% - 2px);
	box-sizing: border-box;
	background:rgba(var(--wiki-content-background-color--secondary--rgb), 0.25);
	border:1px solid var(--wiki-content-border-color);
	padding:0px;
}

.mp-body {
	height: 100%;
	display: flex;
	padding:0.5em;
	flex-flow: column nowrap;
}

.mp-box.centered-content .mp-body {
	height: 100%;
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-evenly;
}

.mp-box.has-floating-image {
	display:block;
}

.mp-box.has-floating-image .mp-body {
	height:unset;
	display:block;
}

.mp-box h2 {
	text-align:center;
	font-weight:bold;
	font-family:var(--wiki-heading-font-family);
    overflow: initial;
	border-bottom: 1px solid var(--wiki-content-border-color);
	font-size: 150%;
	margin: 0;
	padding: 5px 0;
	color:var(--wiki-heading-color);
}

.mp-box .welcome-message {
    font-size: 200%;
    margin: 0;
    padding: 5px 0;
	color: #fff;
	filter: drop-shadow(0px 2px 3px #000);
}

.main-page-list ul {
  grid-template-columns: repeat(auto-fill, minmax(min(5rem, 100%), 100px));
  display: grid;
  gap: 5px;
  list-style-type: none;
}

#mp-banner-container {
	position: relative;
}

#mp-box-welcome {
	text-align:center;
	position:relative;
	overflow:hidden;
}

#mp-welcome {
	position: relative;
	height: 100%;
	font-family: var(--wiki-heading-font-family);
	z-index: 2;
	box-sizing: border-box;
}

#mp-welcome .welcome-subtitle {
	height: 100%;
	background:rgba(var(--wiki-content-dynamic-color--inverted--rgb), 0.85);
	padding:0.5em;
}

#mp-banner {
    position: absolute;
    top: 48px;
    width: 100%;
    height: 100%;
    filter: blur(5px);
    z-index: -1;
    background: url(/images/e/e0/MP_banner.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.view-dark #mp-banner {
	filter: blur(5px) brightness(50%);
}

.view-light #mp-banner {
	filter: blur(5px) contrast(50%);
}

/* [[Template:MP_link]] */
.mp-links {
  --gap:10px;
}

.mp-links > ul {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	margin: 2px;
	gap:var(--gap);
}

.mp-links > ul > li {
	display:flex;
	flex-flow:column nowrap;
	align-items:stretch;
	text-align: center;
	box-sizing:border-box;
	flex: max(calc(50% - var(--gap)), 5em) 1 1;
	outline:1px solid var(--wiki-content-link-color);
	transition:0.1s ease-in;
}

.mp-links > ul > li:hover {
	background-color:rgba(var(--wiki-content-link-color--rgb), 0.2);
}

.mp-links.columns-1 > ul > li {flex: max(calc(100% - var(--gap)), 5em) 1 1;}
.mp-links.columns-2 > ul > li {flex: max(calc(50% - var(--gap)), 5em) 1 1;}
.mp-links.columns-3 > ul > li {flex: max(calc((100% / 3) - var(--gap)), 5em) 1 1;}
.mp-links.columns-4 > ul > li {flex: max(calc(25% - var(--gap)), 5em) 1 1;}
.mp-links.columns-5 > ul > li {flex: max(calc(20% - var(--gap)), 5em) 1 1;}
.mp-links.columns-6 > ul > li {flex: max(calc((100% / 6) - var(--gap)), 5em) 1 1;}
.mp-links.columns-7 > ul > li {flex: max(calc((100% / 7) - var(--gap)), 5em) 1 1;}

.mp-links > ul > li:hover a {
	text-decoration: underline;
}

.mp-links > ul > li > a {
	display: flex;
	align-items: center;
	justify-content: center;
	height:100%;
	flex:1 1 auto;
	box-sizing:border-box;
	padding:5px;
}

.mp-links > ul > li > a:first-child {
  height:100%;
}

.mp-links > ul > li > a:last-child:not(:first-child) {
  height:unset;
}

.mp-links.stretch,
.mp-links.stretch > ul {
	height:100%;
}

.mp-links.side-image li {
	flex-flow:row nowrap;
}

/* MP icon lists */
.mp-iconlists {
	display: flex;
    flex-flow: wrap;
    gap: 5px 20px;
}

.mp-iconlists > .mp-iconlist {
	flex: 1;
    min-width: fit-content;
}

.mp-iconlist > h3 {
	padding: 0;
	margin: 0;
}

.mp-iconlist > ul {
	list-style: none;
	margin: 0;
}

/* MP gallery */
.mp-box ul.gallery {
    display: flex;
    flex-flow: wrap;
    gap: 5px 10px;
    align-items: flex-end;
    justify-content: space-evenly;
    margin: 0;
}

.mp-box ul.gallery .gallerytext {
	margin-top: 1em;
    background-color: var(--wiki-content-background-color--secondary);
    border: 1px solid var(--wiki-content-border-color);
    box-shadow: inset 0 0 20px 2px #000;
    text-shadow: 1px 1px #000, 1px -1px #000, -1px 1px #000, -1px -1px #000;
}

/***********************
* End main page layout *
************************/

/***********************
* Start DRUID infoboxes *
************************/

.druid-container {
    /* These variables are designed to inherit from your wiki's color variables.
       If your wiki uses a different naming scheme, change the inner names to match yours.
       If your wiki doesn't use color variables you should consider doing so,
       otherwise you can replace the inner variables or the fallback values with colors that match your wiki.
    */
    --druid-background-color: var(--wiki-content-background-color, #ffffff);
    --druid-background-color--rgb: var(--wiki-content-background-color--rgb, 255, 255, 255);
    
    --druid-secondary-background-color: var(--wiki-accent-color, #36c);
    --druid-secondary-background-color--rgb: var(--wiki-accent-color--rgb, 51, 102, 204);
    --druid-secondary-background-label-color: var(--wiki-accent-label-color, #fff);
    --druid-secondary-background-label-color--rgb: var(--wiki-accent-label-color--rgb, 255, 255, 255);
    
    --druid-tertiary-background-color: var(--wiki-content-background-color--secondary, #eaecf0);
    --druid-tertiary-background-color--rgb: var(--wiki-content-background-color--secondary--rgb, 234, 236, 240);
    
    --druid-border-color: var(--wiki-accent-color, #a7d7f9);
    --druid-border-color--rgb: var(--wiki-accent-color--rgb, 167, 215, 249);
    
    --druid-link-color: var(--wiki-content-link-color, #0645ad);
    --druid-link-color--rgb: var(--wiki-content-link-color--rgb, 6, 69, 173);
    --druid-link-label-color: var(--wiki-content-link-label-color, #fff);
    --druid-link-label-color--rgb: var(--wiki-content-link-label-color--rgb, 255, 255, 255);
}

.druid-container {
    border: 4px solid var(--druid-border-color);
    border-radius: 3px;
    background: var(--druid-background-color);
    float: right;
    clear: right;
    margin: 0 0 1em 1em;
    width: 19.875em;
    box-sizing: border-box;
    border-collapse: collapse;
}

div.druid-container {
	width: 22em;
}

@media screen and (max-width: 450px) {
  .druid-container {
    width:100%;
  }
}

@media screen and (max-width: 720px) {
  .druid-container {
    float: none;
    margin: 0.5rem auto;
  }
}

.druid-main-images-file,
.druid-main-image {
    text-align:center;
}

.druid-infobox .druid-title,
.druid-infobox .druid-section {
    background:var(--druid-secondary-background-color);
    color:var(--druid-secondary-background-label-color);
    text-align:center;
    font-size:1.5em;
    padding:1px;
}

.druid-section {
    font-size: 1.25em;
    font-weight: 500;
}

.druid-label {
    font-weight:bold;
    text-align: right;
	box-sizing: border-box;
}

.druid-row > .druid-label {
    width: 48%;
}

.druid-row > .druid-label,
.druid-row > .druid-data {
	padding-inline: 0.3em;
}

.druid-main-image,
.druid-main-images {
    padding:5px;
}

.druid-main-image img, 
.druid-main-images img {
    max-width:100%;
    height:auto;
}

.druid-main-images-labels {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    justify-content: space-evenly;
    margin:0.25em;
    gap:0.25em;
}

.druid-main-images-label {
    cursor:pointer;
    flex:1 1 auto;
    text-align:center;
    transition:.1s ease-in;
    outline:1px solid var(--druid-link-color);
}

.druid-main-images-label.focused {
    background:var(--druid-link-color);
    color:var(--druid-link-label-color);
}

.druid-main-images-label:not(.focused):hover {
    background:rgba(var(--druid-link-color--rgb), 0.25);
}

.druid-toggleable-data:not(.focused),
.druid-main-images-file:not(.focused),
.druid-toggleable-heading:not(.focused) {
    display:none;
}

.druid-row:not(:has(.druid-grid)):has(.druid-toggleable-data-empty.focused) {
    display:none;
}

.druid-section:has(.druid-toggleable-heading-empty.focused) {
    display:none;
}

.druid-grid {
    display:grid;
    gap: 0.3em;
	padding: 0.35em;
}

.druid-grid-item {
    background:var(--druid-tertiary-background-color);
    padding:0.25em;
    border:1px solid rgba(var(--druid-border-color--rgb), 0.5);
    border-radius: 2px;
}

.druid-grid-item > .druid-label,
.druid-grid-item > .druid-data {
	text-align: center;
}

.druid-collapsed {
    display:none;
}

.druid-collapsible {
    cursor:pointer;
    position:relative;
}

.druid-collapsible::after {
    content:'–';
    display:block;
    position:absolute;
    right:10px;
    font-size:20px;
    font-weight:bold;
    color:var(--druid-secondary-background-label-color);
}

.druid-collapsible-collapsed::after {
    content:'+';
}

.druid-section-container:has(.druid-toggleable-data-empty.focused):not(:has(.druid-toggleable-data-nonempty.focused)):not(:has(.druid-data-nonempty)) {
  display: none;
}

.druid-data-descript {
  font-style: italic;
  text-align: center;
  font-size: 10pt;
  color: var(--wiki-accent-color); 
}

/*****************************************
Div support
*****************************************/

div.druid-row {
    display:flex;
    margin-block: 1px;
}

div.druid-row + div.druid-row {
	margin-top: 0;
}

div.druid-row > .druid-label {
	background: var(--druid-tertiary-background-color);
}

.druid-infobox .druid-title {
  font-weight: 700;
}

.druid-infobox #toc {
    display:none;
}

/***********************
* End DRUID infoboxes  *
************************/

/*** Miscellaneous ***/
.responsive-image {
	max-width:100%;
	height:auto;
}

.view-dark .invert-on-dark,
.view-light .invert-on-light {
    filter:invert(100%);
}

@media screen and (min-width:720px) {
	.mobileonly {
		display:none;
	}
}
@media screen and (max-width:720px) {
	.nomobile {
		display:none;
	}
}

/**************************
* Start Modular Templates *
**************************/

/********* [[Template:Ambox]] *********/
.ambox {
	border: 1px solid var(--wiki-content-border-color);
	border-left: 10px solid var(--ambox-color);
	border-radius: 2px;
	display: flex;
	align-items: center;
	gap: .6em;
	margin: 1em 0;
	padding: 3px .6em;
	background-color: var(--wiki-content-background-color--secondary);
	box-shadow: 2px 2px 5px 0px #0002;
}

@media (min-width: 720px) {
	.ambox {
		margin-inline: 10%;
	}
}

.ambox.tiny {
	padding: .04rem .5em;
	margin-inline: 0;
    width: fit-content;
}

.ambox + .ambox {
	margin-top: -.6em;
}

.ambox-content p {
	margin: .15em 0;
}

.ambox-title {
	font-weight: bold;
}

/********* [[Template:Hatnote]] *********/
.hatnote {
    padding: 1px 0 1px 1.6em;
    margin-bottom: 0.5em;
    font-style: italic;
    border-top: 1px solid var(--wiki-body-dynamic-color--secondary--inverted);
    border-bottom: 1px solid var(--wiki-body-dynamic-color--secondary--inverted);
}

.hatnote.icon {
	padding-left: 0;	
}

/********* [[Template:Spoiler]] *********/
.spoiler-content {
  background-color: rgb(127, 127, 127);
  transition: all 0.3s;
  cursor: pointer;
}

.spoiler-content > span {
  opacity: 0;
  transition: all 0.3s;
}

.spoiler-content > * {
  pointer-events:none;
}

.spoiler-content.show > * {
  pointer-events:unset;
}

.spoiler-content.show {
  background-color: rgba(127, 127, 127, 0);
}

.spoiler-content.show > span {
  opacity: 1;
}

/********* [[Template:Link icon]] *********/
.link-icon {
	display: inline-flex; 
	align-items: center;
    height: var(--link-icon-line-height);
    vertical-align: bottom;
}

.link-icon .regular {
    align-self: center;
}

.link-icon .regular a {
	display: flex;
}

.link-icon .regular img {
	height: var(--link-icon-size);
	max-width: var(--link-icon-size);
}

.link-icon .fallback {
	outline: 1px solid var(--wiki-content-text-color);
	border-radius: 50%;
	text-align: center;
	width: var(--link-icon-size);
	line-height: var(--link-icon-size);
}

.link-icon.notext .fallback {
	display: inline-block;
}

.link-icon.notext {
    display: inline;
}

/********* [[Template:Quote]] *********/
.quote {
    background: var(--wiki-content-background-color--secondary);
    border-radius: 5px;
    border: 2px solid var(--wiki-content-border-color);
    margin: .5em 0;
    padding: .5em;
}

.quote .block {
	display: block;
}

.quote .title {
	font-size: large;
    font-weight: bold;
}

.quote .content {
	font-style: italic;
}

.quote .author {
	font-weight: bold;
	text-align: end;
}

.quote .marks-wrapper {
	display: flex;
	gap: 5px;
}

.quote .marks-wrapper::before,
.quote .marks-wrapper::after {
	font-size: 100px;
    line-height: 0px;
}

.quote .marks-wrapper::before {
	content: "\201C";
	margin-top: 40px;
}

.quote .marks-wrapper::after {
	content: "\201D";
	align-self: end;
	margin-bottom: -10px;
}

/************************
* End Modular Templates *
*************************/

/***************
* Custom CSS for CustomTabs (Template:Tab nav) *
****************/
.custom-tabs {
	display: flex;
	flex-direction: row;
	gap: 5px;
	width: 100%;
	margin: 5px 0;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.custom-tabs > span {
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	flex: 1;
	border: 1px solid var(--wiki-accent-color);
	transition: 0.3s;
}

.custom-tabs a,
.custom-tabs .selflink,
.custom-tabs span.new {
	padding: 8px 10px;
	width: 100%;
}

/* Mobile 2 column format */
.skin-fandommobile div.custom-tabs {
	display: grid;
	grid-template-columns: repeat(2, 50%);
	grid-auto-flow: row;
	flex-wrap: wrap;
}

.skin-mobile .custom-tabs a,
.skin-mobile .custom-tabs .selflink,
.skin-mobile .custom-tabs span.new {
	font-size: 90%;
}

.custom-tabs.custom-tabs-default span.active-tab {
	background-color: var(--wiki-content-active-border-color);
}

.custom-tabs.custom-tabs-default span.active-tab strong {
	color: var(--wiki-content-link-color);
	font-weight: 500;
}

.custom-tabs.custom-tabs-default span.active-tab a:not(.new) {
	color: var(--wiki-content-link-color);
}

.custom-tabs.custom-tabs-default span.inactive-tab {
  background-color:var(--wiki-body-background-color);
  border-color:var(--wiki-accent-color)
}
.custom-tabs.custom-tabs-default span.inactive-tab a:not(.new) {
  color:var(--theme-text-color)
}
.custom-tabs.custom-tabs-default span.inactive-tab:hover {
  background:var(--wiki-body-background-color);
  color:var(--wiki-accent-color--hover)
}
.custom-tabs.custom-tabs-default span.inactive-tab:hover a:not(.new) {
  color:var(--wiki-accent-color--hover)
}
/***************
* End Custom CSS for CustomTabs (Template:Tab nav) *
****************/

/***************
* Custom CSS checkboxes *
****************/
.custom-icon {
    border-radius: 6px;
    padding: 2px;
}

.custom-icon:hover {
    background-color: var(--theme-dropdown-hover);
}

input[type="checkbox"] {
    margin-right: 4px;
}

.checked-item {
    opacity: 0.5;
    text-decoration-line: line-through;
    transition: opacity 0.3s;
}
/***************
* End Custom CSS checkboxes *
****************/

/*************
* lkg-grid-container and item for Image Display DPL Queries *
**************/
.lkg-grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px; /* Adjust the gap between grid items as needed */
}

.lkg-grid-item {
  display: flex;
  flex-direction: column;
  justify-content: flex-end; /* Align content to the bottom */
  align-items: center;
  height: 100%; /* Ensure the item takes the full height */
  text-align: center;
}

/********************
* icon list styles *
*********************/
.icon-list {
	display: grid;
	/** Remove this column configuration if problems arise **/
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

.icon-list-inline > span.custom-icon + span.custom-icon:before {
    content: "\ ";
	white-space: pre;
}
.icon-list-inline-sentence > span.custom-icon + span.custom-icon:not(:first-child, :last-child):before {
    content: ",\ ";
	white-space: pre;
}
.icon-list-inline-sentence > span.custom-icon + span.custom-icon:is(:last-child):not(:first-child):before {
	content: " and "
}

span.custom-icon {
    display: inline;
}
span.custom-icon-image {
    position: relative;
    display: inline-block;
}

/* To add quality icon on items */
.custom-icon-image.quality-super::before {
  content:url(https://lkg.wiki.gg/images/3/35/Icon_Super_ScaledDown.png);
  position:absolute;
  z-index:1;
  bottom:0;
  right:0;
  display:flex;
}

/* Downscale images that have been upscaled due to info-icon min-size */
.custom-icon-image.upscaled-16 img {
	width: 16px;
}
.custom-icon-image.upscaled-24 img {
	width: 24px;
}
.custom-icon-image.upscaled-32 img {
	width: 32px;
}
.custom-icon-image.upscaled-40 img {
	width: 40px;
}
.custom-icon-image.upscaled-48 img {
	width: 48px;
}

/* Remove excessive padding */
.article-media-thumbnail {
	margin-bottom: 0
}

/* Hidden text for sortable tables */
.sort-value {
	font-size: 0
}

/********************
* Template:Dialogue *
*********************/
/* Fix for mobile div width */
@media screen and (max-width: 1024px) {
  .npc-dialogue-box {
    max-width: 100% !important;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1279px) {
  .npc-dialogue-box {
    max-width: 75% !important;
  }
}
@media screen and (min-width: 1280px) {
  .npc-dialogue-box {
    max-width: 60%; /* Default width for larger screens */
  }
}
@media screen and (max-width: 1025px) {
  .toc-container {
    float: none !important;
    clear: both !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    max-width: none !important;
    text-align: center; /* Center align TOC for better appearance on mobile */
  }
}

/*************
* lkg-tables *
**************/
.lkg-table {
  border-collapse: separate;
  border-spacing: 0;
  background: var(--theme-table-td-background);
  border: 1px solid var(--wiki-content-table-border-color);
}

.lkg-table th {
  background: var(--wiki-content-table-border-color);
  color: var(--wiki-accent-label-color);
  padding: 8px;
}

.lkg-table tr td, .lkg-table tr {
  border-bottom: 1px solid var(--wiki-content-border-color);
  padding: 6px;
}

.lkg-table tr:last-child td {
  border-bottom: none;
}

/***************
* General classes for table attributes  *
****************/
.tablexsmall {width: 30%;}
.tablesmall {width: 45%;}
.tablemedium {width: calc(100% - 325px);}
.tablelarge {width: 99%;}

.tablemax30 {max-width: 30%;}
.tablemax45 {max-width: 45%;}
.tablemax50 {max-width: 50%;}
.tablemaxmedium {max-width: calc(100% - 300px);}

/* CELL WIDTH */
#content .mw-parser-output .tdwid td,
#content .mw-parser-output .tdwid1 td:nth-child(1),
#content .mw-parser-output .tdwid2 td:nth-child(2),
#content .mw-parser-output .tdwid3 td:nth-child(3),
#content .mw-parser-output .tdwid4 td:nth-child(4),
#content .mw-parser-output .tdwid5 td:nth-child(5),
#content .mw-parser-output .tdwid6 td:nth-child(6),
#content .mw-parser-output .tdwid7 td:nth-child(7),
#content .mw-parser-output .tdwid8 td:nth-child(8),
#content .mw-parser-output .tdwid9 td:nth-child(9),
#content .mw-parser-output .tdwid10 td:nth-child(10),
#content .mw-parser-output .tdwid11 td:nth-child(11),
#content .mw-parser-output .tdwid12 td:nth-child(12),
#content .mw-parser-output .tdwid13 td:nth-child(13),
#content .mw-parser-output .tdwid14 td:nth-child(14),
#content .mw-parser-output .tdwid15 td:nth-child(15),
#content .mw-parser-output .tdwid16 td:nth-child(16),
#content .mw-parser-output .tdwid17 td:nth-child(17),
#content .mw-parser-output .tdwid18 td:nth-child(18),
#content .mw-parser-output .tdwid19 td:nth-child(19),
#content .mw-parser-output .tdwid20 td:nth-child(20) {
	width: 10%;
}

#content .mw-parser-output .td20wid td,
#content .mw-parser-output .td20wid1 td:nth-child(1),
#content .mw-parser-output .td20wid2 td:nth-child(2),
#content .mw-parser-output .td20wid3 td:nth-child(3),
#content .mw-parser-output .td20wid4 td:nth-child(4),
#content .mw-parser-output .td20wid5 td:nth-child(5),
#content .mw-parser-output .td20wid6 td:nth-child(6),
#content .mw-parser-output .td20wid7 td:nth-child(7),
#content .mw-parser-output .td20wid8 td:nth-child(8),
#content .mw-parser-output .td20wid9 td:nth-child(9),
#content .mw-parser-output .td20wid10 td:nth-child(10),
#content .mw-parser-output .td20wid11 td:nth-child(11),
#content .mw-parser-output .td20wid12 td:nth-child(12),
#content .mw-parser-output .td20wid13 td:nth-child(13),
#content .mw-parser-output .td20wid14 td:nth-child(14),
#content .mw-parser-output .td20wid15 td:nth-child(15),
#content .mw-parser-output .td20wid16 td:nth-child(16),
#content .mw-parser-output .td20wid17 td:nth-child(17),
#content .mw-parser-output .td20wid18 td:nth-child(18),
#content .mw-parser-output .td20wid19 td:nth-child(19),
#content .mw-parser-output .td20wid20 td:nth-child(20) {
	width: 20%;
}

#content .mw-parser-output .td30wid td,
#content .mw-parser-output .td30wid1 td:nth-child(1),
#content .mw-parser-output .td30wid2 td:nth-child(2),
#content .mw-parser-output .td30wid3 td:nth-child(3),
#content .mw-parser-output .td30wid4 td:nth-child(4),
#content .mw-parser-output .td30wid5 td:nth-child(5),
#content .mw-parser-output .td30wid6 td:nth-child(6),
#content .mw-parser-output .td30wid7 td:nth-child(7),
#content .mw-parser-output .td30wid8 td:nth-child(8),
#content .mw-parser-output .td30wid9 td:nth-child(9),
#content .mw-parser-output .td30wid10 td:nth-child(10),
#content .mw-parser-output .td30wid11 td:nth-child(11),
#content .mw-parser-output .td30wid12 td:nth-child(12),
#content .mw-parser-output .td30wid13 td:nth-child(13),
#content .mw-parser-output .td30wid14 td:nth-child(14),
#content .mw-parser-output .td30wid15 td:nth-child(15),
#content .mw-parser-output .td30wid16 td:nth-child(16),
#content .mw-parser-output .td30wid17 td:nth-child(17),
#content .mw-parser-output .td30wid18 td:nth-child(18),
#content .mw-parser-output .td30wid19 td:nth-child(19),
#content .mw-parser-output .td30wid30 td:nth-child(20) {
	width: 30%;
}

#content .mw-parser-output .td100pxwid td,
#content .mw-parser-output .td100pxwid1 td:nth-child(1),
#content .mw-parser-output .td100pxwid2 td:nth-child(2),
#content .mw-parser-output .td100pxwid3 td:nth-child(3),
#content .mw-parser-output .td100pxwid4 td:nth-child(4),
#content .mw-parser-output .td100pxwid5 td:nth-child(5),
#content .mw-parser-output .td100pxwid6 td:nth-child(6),
#content .mw-parser-output .td100pxwid7 td:nth-child(7),
#content .mw-parser-output .td100pxwid8 td:nth-child(8),
#content .mw-parser-output .td100pxwid9 td:nth-child(9),
#content .mw-parser-output .td100pxwid10 td:nth-child(10),
#content .mw-parser-output .td100pxwid11 td:nth-child(11),
#content .mw-parser-output .td100pxwid12 td:nth-child(12),
#content .mw-parser-output .td100pxwid13 td:nth-child(13),
#content .mw-parser-output .td100pxwid14 td:nth-child(14),
#content .mw-parser-output .td100pxwid15 td:nth-child(15),
#content .mw-parser-output .td100pxwid16 td:nth-child(16),
#content .mw-parser-output .td100pxwid17 td:nth-child(17),
#content .mw-parser-output .td100pxwid18 td:nth-child(18),
#content .mw-parser-output .td100pxwid19 td:nth-child(19),
#content .mw-parser-output .td100pxwid20 td:nth-child(20) {
	width: 100px;
}

/* ALIGNMENT
   Styles that can be added to an entire table itself   
   to apply to each cell in the respective column.      
   Removes the need to apply styles to individual cells.
*/

#content .mw-parser-output .tdl td,
#content .mw-parser-output .tdl1 td:nth-child(1),
#content .mw-parser-output .tdl2 td:nth-child(2),
#content .mw-parser-output .tdl3 td:nth-child(3),
#content .mw-parser-output .tdl4 td:nth-child(4),
#content .mw-parser-output .tdl5 td:nth-child(5),
#content .mw-parser-output .tdl6 td:nth-child(6),
#content .mw-parser-output .tdl7 td:nth-child(7),
#content .mw-parser-output .tdl8 td:nth-child(8),
#content .mw-parser-output .tdl9 td:nth-child(9),
#content .mw-parser-output .tdl10 td:nth-child(10),
#content .mw-parser-output .tdl11 td:nth-child(11),
#content .mw-parser-output .tdl12 td:nth-child(12),
#content .mw-parser-output .tdl13 td:nth-child(13),
#content .mw-parser-output .tdl14 td:nth-child(14),
#content .mw-parser-output .tdl15 td:nth-child(15),
#content .mw-parser-output .tdl16 td:nth-child(16),
#content .mw-parser-output .tdl17 td:nth-child(17),
#content .mw-parser-output .tdl18 td:nth-child(18),
#content .mw-parser-output .tdl19 td:nth-child(19),
#content .mw-parser-output .tdl20 td:nth-child(20) {
	text-align: left;
}

#content .mw-parser-output .thl th,
#content .mw-parser-output .thl1 th:nth-child(1),
#content .mw-parser-output .thl2 th:nth-child(2),
#content .mw-parser-output .thl3 th:nth-child(3),
#content .mw-parser-output .thl4 th:nth-child(4),
#content .mw-parser-output .thl5 th:nth-child(5),
#content .mw-parser-output .thl6 th:nth-child(6),
#content .mw-parser-output .thl7 th:nth-child(7),
#content .mw-parser-output .thl8 th:nth-child(8),
#content .mw-parser-output .thl9 th:nth-child(9),
#content .mw-parser-output .thl10 th:nth-child(10),
#content .mw-parser-output .thl11 th:nth-child(11),
#content .mw-parser-output .thl12 th:nth-child(12),
#content .mw-parser-output .thl13 th:nth-child(13),
#content .mw-parser-output .thl14 th:nth-child(14),
#content .mw-parser-output .thl15 th:nth-child(15),
#content .mw-parser-output .thl16 th:nth-child(16),
#content .mw-parser-output .thl17 th:nth-child(17),
#content .mw-parser-output .thl18 th:nth-child(18),
#content .mw-parser-output .thl19 th:nth-child(19),
#content .mw-parser-output .thl20 th:nth-child(20) {
	text-align: left;
}

#content .mw-parser-output .tdc td,
#content .mw-parser-output .tdc1 td:nth-child(1),
#content .mw-parser-output .tdc2 td:nth-child(2),
#content .mw-parser-output .tdc3 td:nth-child(3),
#content .mw-parser-output .tdc4 td:nth-child(4),
#content .mw-parser-output .tdc5 td:nth-child(5),
#content .mw-parser-output .tdc6 td:nth-child(6),
#content .mw-parser-output .tdc7 td:nth-child(7),
#content .mw-parser-output .tdc8 td:nth-child(8),
#content .mw-parser-output .tdc9 td:nth-child(9),
#content .mw-parser-output .tdc10 td:nth-child(10),
#content .mw-parser-output .tdc11 td:nth-child(11),
#content .mw-parser-output .tdc12 td:nth-child(12),
#content .mw-parser-output .tdc13 td:nth-child(13),
#content .mw-parser-output .tdc14 td:nth-child(14),
#content .mw-parser-output .tdc15 td:nth-child(15),
#content .mw-parser-output .tdc16 td:nth-child(16),
#content .mw-parser-output .tdc17 td:nth-child(17),
#content .mw-parser-output .tdc18 td:nth-child(18),
#content .mw-parser-output .tdc19 td:nth-child(19),
#content .mw-parser-output .tdc20 td:nth-child(20) {
	text-align: center;
}

#content .mw-parser-output .thc th,
#content .mw-parser-output .thc1 th:nth-child(1),
#content .mw-parser-output .thc2 th:nth-child(2),
#content .mw-parser-output .thc3 th:nth-child(3),
#content .mw-parser-output .thc4 th:nth-child(4),
#content .mw-parser-output .thc5 th:nth-child(5),
#content .mw-parser-output .thc6 th:nth-child(6),
#content .mw-parser-output .thc7 th:nth-child(7),
#content .mw-parser-output .thc8 th:nth-child(8),
#content .mw-parser-output .thc9 th:nth-child(9),
#content .mw-parser-output .thc10 th:nth-child(10),
#content .mw-parser-output .thc11 th:nth-child(11),
#content .mw-parser-output .thc12 th:nth-child(12),
#content .mw-parser-output .thc13 th:nth-child(13),
#content .mw-parser-output .thc14 th:nth-child(14),
#content .mw-parser-output .thc15 th:nth-child(15),
#content .mw-parser-output .thc16 th:nth-child(16),
#content .mw-parser-output .thc17 th:nth-child(17),
#content .mw-parser-output .thc18 th:nth-child(18),
#content .mw-parser-output .thc19 th:nth-child(19),
#content .mw-parser-output .thc20 th:nth-child(20) {
	text-align: center;
}

#content .mw-parser-output .tdr td,
#content .mw-parser-output .tdr1 td:nth-child(1),
#content .mw-parser-output .tdr2 td:nth-child(2),
#content .mw-parser-output .tdr3 td:nth-child(3),
#content .mw-parser-output .tdr4 td:nth-child(4),
#content .mw-parser-output .tdr5 td:nth-child(5),
#content .mw-parser-output .tdr6 td:nth-child(6),
#content .mw-parser-output .tdr7 td:nth-child(7),
#content .mw-parser-output .tdr8 td:nth-child(8),
#content .mw-parser-output .tdr9 td:nth-child(9),
#content .mw-parser-output .tdr10 td:nth-child(10),
#content .mw-parser-output .tdr11 td:nth-child(11),
#content .mw-parser-output .tdr12 td:nth-child(12),
#content .mw-parser-output .tdr13 td:nth-child(13),
#content .mw-parser-output .tdr14 td:nth-child(14),
#content .mw-parser-output .tdr15 td:nth-child(15),
#content .mw-parser-output .tdr16 td:nth-child(16),
#content .mw-parser-output .tdr17 td:nth-child(17),
#content .mw-parser-output .tdr18 td:nth-child(18),
#content .mw-parser-output .tdr19 td:nth-child(19),
#content .mw-parser-output .tdr20 td:nth-child(20) {
	text-align: right;
}

#content .mw-parser-output .thr th,
#content .mw-parser-output .thr1 th:nth-child(1),
#content .mw-parser-output .thr2 th:nth-child(2),
#content .mw-parser-output .thr3 th:nth-child(3),
#content .mw-parser-output .thr4 th:nth-child(4),
#content .mw-parser-output .thr5 th:nth-child(5),
#content .mw-parser-output .thr6 th:nth-child(6),
#content .mw-parser-output .thr7 th:nth-child(7),
#content .mw-parser-output .thr8 th:nth-child(8),
#content .mw-parser-output .thr9 th:nth-child(9),
#content .mw-parser-output .thr10 th:nth-child(10),
#content .mw-parser-output .thr11 th:nth-child(11),
#content .mw-parser-output .thr12 th:nth-child(12),
#content .mw-parser-output .thr13 th:nth-child(13),
#content .mw-parser-output .thr14 th:nth-child(14),
#content .mw-parser-output .thr15 th:nth-child(15),
#content .mw-parser-output .thr16 th:nth-child(16),
#content .mw-parser-output .thr17 th:nth-child(17),
#content .mw-parser-output .thr18 th:nth-child(18),
#content .mw-parser-output .thr19 th:nth-child(19),
#content .mw-parser-output .thr20 th:nth-child(20) {
	text-align: right;
}

#content .mw-parser-output .tdt td,
#content .mw-parser-output .tdt1 td:nth-child(1),
#content .mw-parser-output .tdt2 td:nth-child(2),
#content .mw-parser-output .tdt3 td:nth-child(3),
#content .mw-parser-output .tdt4 td:nth-child(4),
#content .mw-parser-output .tdt5 td:nth-child(5),
#content .mw-parser-output .tdt6 td:nth-child(6),
#content .mw-parser-output .tdt7 td:nth-child(7),
#content .mw-parser-output .tdt8 td:nth-child(8),
#content .mw-parser-output .tdt9 td:nth-child(9),
#content .mw-parser-output .tdt10 td:nth-child(10),
#content .mw-parser-output .tdt11 td:nth-child(11),
#content .mw-parser-output .tdt12 td:nth-child(12),
#content .mw-parser-output .tdt13 td:nth-child(13),
#content .mw-parser-output .tdt14 td:nth-child(14),
#content .mw-parser-output .tdt15 td:nth-child(15),
#content .mw-parser-output .tdt16 td:nth-child(16),
#content .mw-parser-output .tdt17 td:nth-child(17),
#content .mw-parser-output .tdt18 td:nth-child(18),
#content .mw-parser-output .tdt19 td:nth-child(19),
#content .mw-parser-output .tdt20 td:nth-child(20) {
	vertical-align: top;
}

#content .mw-parser-output .tht th,
#content .mw-parser-output .tht1 th:nth-child(1),
#content .mw-parser-output .tht2 th:nth-child(2),
#content .mw-parser-output .tht3 th:nth-child(3),
#content .mw-parser-output .tht4 th:nth-child(4),
#content .mw-parser-output .tht5 th:nth-child(5),
#content .mw-parser-output .tht6 th:nth-child(6),
#content .mw-parser-output .tht7 th:nth-child(7),
#content .mw-parser-output .tht8 th:nth-child(8),
#content .mw-parser-output .tht9 th:nth-child(9),
#content .mw-parser-output .tht10 th:nth-child(10),
#content .mw-parser-output .tht11 th:nth-child(11),
#content .mw-parser-output .tht12 th:nth-child(12),
#content .mw-parser-output .tht13 th:nth-child(13),
#content .mw-parser-output .tht14 th:nth-child(14),
#content .mw-parser-output .tht15 th:nth-child(15),
#content .mw-parser-output .tht16 th:nth-child(16),
#content .mw-parser-output .tht17 th:nth-child(17),
#content .mw-parser-output .tht18 th:nth-child(18),
#content .mw-parser-output .tht19 th:nth-child(19),
#content .mw-parser-output .tht20 th:nth-child(20) {
	vertical-align: top;
}

#content .mw-parser-output .tdm td,
#content .mw-parser-output .tdm1 td:nth-child(1),
#content .mw-parser-output .tdm2 td:nth-child(2),
#content .mw-parser-output .tdm3 td:nth-child(3),
#content .mw-parser-output .tdm4 td:nth-child(4),
#content .mw-parser-output .tdm5 td:nth-child(5),
#content .mw-parser-output .tdm6 td:nth-child(6),
#content .mw-parser-output .tdm7 td:nth-child(7),
#content .mw-parser-output .tdm8 td:nth-child(8),
#content .mw-parser-output .tdm9 td:nth-child(9),
#content .mw-parser-output .tdm10 td:nth-child(10),
#content .mw-parser-output .tdm11 td:nth-child(11),
#content .mw-parser-output .tdm12 td:nth-child(12),
#content .mw-parser-output .tdm13 td:nth-child(13),
#content .mw-parser-output .tdm14 td:nth-child(14),
#content .mw-parser-output .tdm15 td:nth-child(15),
#content .mw-parser-output .tdm16 td:nth-child(16),
#content .mw-parser-output .tdm17 td:nth-child(17),
#content .mw-parser-output .tdm18 td:nth-child(18),
#content .mw-parser-output .tdm19 td:nth-child(19),
#content .mw-parser-output .tdm20 td:nth-child(20) {
	vertical-align: middle;
}

#content .mw-parser-output .thm th,
#content .mw-parser-output .thm1 th:nth-child(1),
#content .mw-parser-output .thm2 th:nth-child(2),
#content .mw-parser-output .thm3 th:nth-child(3),
#content .mw-parser-output .thm4 th:nth-child(4),
#content .mw-parser-output .thm5 th:nth-child(5),
#content .mw-parser-output .thm6 th:nth-child(6),
#content .mw-parser-output .thm7 th:nth-child(7),
#content .mw-parser-output .thm8 th:nth-child(8),
#content .mw-parser-output .thm9 th:nth-child(9),
#content .mw-parser-output .thm10 th:nth-child(10),
#content .mw-parser-output .thm11 th:nth-child(11),
#content .mw-parser-output .thm12 th:nth-child(12),
#content .mw-parser-output .thm13 th:nth-child(13),
#content .mw-parser-output .thm14 th:nth-child(14),
#content .mw-parser-output .thm15 th:nth-child(15),
#content .mw-parser-output .thm16 th:nth-child(16),
#content .mw-parser-output .thm17 th:nth-child(17),
#content .mw-parser-output .thm18 th:nth-child(18),
#content .mw-parser-output .thm19 th:nth-child(19),
#content .mw-parser-output .thm20 th:nth-child(20) {
	vertical-align: middle;
}

#content .mw-parser-output .tdb td,
#content .mw-parser-output .tdb1 td:nth-child(1),
#content .mw-parser-output .tdb2 td:nth-child(2),
#content .mw-parser-output .tdb3 td:nth-child(3),
#content .mw-parser-output .tdb4 td:nth-child(4),
#content .mw-parser-output .tdb5 td:nth-child(5),
#content .mw-parser-output .tdb6 td:nth-child(6),
#content .mw-parser-output .tdb7 td:nth-child(7),
#content .mw-parser-output .tdb8 td:nth-child(8),
#content .mw-parser-output .tdb9 td:nth-child(9),
#content .mw-parser-output .tdb10 td:nth-child(10),
#content .mw-parser-output .tdb11 td:nth-child(11),
#content .mw-parser-output .tdb12 td:nth-child(12),
#content .mw-parser-output .tdb13 td:nth-child(13),
#content .mw-parser-output .tdb14 td:nth-child(14),
#content .mw-parser-output .tdb15 td:nth-child(15),
#content .mw-parser-output .tdb16 td:nth-child(16),
#content .mw-parser-output .tdb17 td:nth-child(17),
#content .mw-parser-output .tdb18 td:nth-child(18),
#content .mw-parser-output .tdb19 td:nth-child(19),
#content .mw-parser-output .tdb20 td:nth-child(20) {
	vertical-align: bottom;
}

#content .mw-parser-output .thb th,
#content .mw-parser-output .thb1 th:nth-child(1),
#content .mw-parser-output .thb2 th:nth-child(2),
#content .mw-parser-output .thb3 th:nth-child(3),
#content .mw-parser-output .thb4 th:nth-child(4),
#content .mw-parser-output .thb5 th:nth-child(5),
#content .mw-parser-output .thb6 th:nth-child(6),
#content .mw-parser-output .thb7 th:nth-child(7),
#content .mw-parser-output .thb8 th:nth-child(8),
#content .mw-parser-output .thb9 th:nth-child(9),
#content .mw-parser-output .thb10 th:nth-child(10),
#content .mw-parser-output .thb11 th:nth-child(11),
#content .mw-parser-output .thb12 th:nth-child(12),
#content .mw-parser-output .thb13 th:nth-child(13),
#content .mw-parser-output .thb14 th:nth-child(14),
#content .mw-parser-output .thb15 th:nth-child(15),
#content .mw-parser-output .thb16 th:nth-child(16),
#content .mw-parser-output .thb17 th:nth-child(17),
#content .mw-parser-output .thb18 th:nth-child(18),
#content .mw-parser-output .thb19 th:nth-child(19),
#content .mw-parser-output .thb20 th:nth-child(20) {
	vertical-align: bottom;
}

/* MOBILE
   Mobile specific overrides.
*/
@media screen and (max-width: 768px) {
	 .tablesmall, .tablemedium, .tablexsmall {
	     width: 100%;
	 }
}

/* Template:Key
*/
.key {
  background-color: var(--wiki-key-background-color);
  padding-top: 5px;
  padding-bottom: 7px;
}

/* Tabber 
*/

.tabber__tab {
    border: 1px solid var(--wiki-content-table-border-color);
    border-bottom: 0px solid var(--wiki-content-table-border-color);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin-right: 5px;
}

.tabber__tab:hover,
.tabber__tab:hover:visited {
    color: var(--wiki-content-text-color);
}

.tabber__tab[aria-selected="true"],
.tabber__tab[aria-selected="true"]:visited{
  color: var(--wiki-accent-label-color);
    background-color:var(--wiki-content-table-border-color);
}

.tabber__indicator {
    background-color:var(--wiki-content-table-border-color);
}

.tabber__tab,
.tabber__tab:visited {
  color:var(--wiki-content-table-border-color);
}

.tabber__header {
  box-shadow: none;
}

/***************
* USERNAME HIGHLIGHTS *
****************/
a[href="/wiki/User:Geekette828"],
a[href="/wiki/User:Kay_CK"],
a[href="/wiki/User:Carbon"],
{
	color: var(--custom-admin-highlight);
}