MediaWiki:Common.css

Wiki.gg header logo

Appearance
Seasonal Light
Create account
Log in
Navigation menu
MessageDiscussion
ReadView sourceView historySearch
Search Apex Legends Wiki
Navigation
Recent changes
Community portal
Rules for editors
Style guide
Random page
Wiki Discord
Useful pages
Overview
Legends
Weapons
Items
Maps
Game modes
Seasons
Events
Cosmetics
Lore
Official
Official site
Twitter
YouTube
Instagram
Twitch
Trello board
Community
Apex Legends Reddit
Apex Lore Reddit
Apex Legends Discord
Esports wiki
Tools
What links here
Related changes
New page
Special pages
Printable version
Permanent link
Page information
Welcome to the Apex Legends Wiki!
Please report any issues on our Discord server. If you are an editor of Fandom, reclaim your username here.
Note: Support the wiki by downloading the wiki.gg Redirect extension.

MediaWiki:Common.css
In other languages: Português do Brasil

CSS and Javascript changes must comply with the wiki design rules.

Note: After saving, 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: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Saira:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Saira+Semi+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Saira+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Oriya:wght@100..900&display=swap');
/* CSS for editor pages and the front page which I put on separate css pages cause theres a lot of code in em */
@import url("/index.php?action=raw&ctype=text/css&title=MediaWiki:EditorsStyling.css");
@import url("/index.php?action=raw&ctype=text/css&title=MediaWiki:FrontPageStyling.css");

:root {
  --theme-text-color: #000;
  --theme-borders-color: #999;
  --theme-link-color: #dc5548;
  --theme-red-link-color: #ba003e;
  --theme-body-color: rgba(229,225,216,0.95);
  --theme-box-color: #dad6d7;
  --theme-box-border-color: #abb1b8;
  --theme-box-accent-color: #161616;
  --theme-box-hover-color: #e5e3e3;
  --theme-button-color: #f57d14;
  --theme-button-hover-color: #ffa31a;
  --theme-highlight-color: #e1c0b7;
  --theme-typebox-color: #f3f3f3;
  
  --theme-common-color: #9CACAD;
  --theme-rare-color: #51a8d6;
  --theme-epic-color: #b237c8;
  --theme-legendary-color: #cead21;
  --theme-mythic-color: #ff4e1d;
  --theme-iconic-color: #24C6B6;
  
  --theme-infobox-bg-color:#dad6d7;
  --theme-infobox-text-color:#161616;
  --theme-infobox-label-color:#161616;
  --theme-infobox-labeltext-color:#dad6d7;
  --theme-header-color: #840b0b;
  --theme-headertext-color: #e9e9e9;
  --theme-fpbox-bg-color: rgba(255,255,255,.5);
  
  --theme-red-color:#ff3838;
  --theme-orange-color:#e47221;
  --theme-yellow-color:#f6a424;
  --theme-green-color:#628f06;
  --theme-cyan-color:#08b4b4;
  --theme-blue-color:#178af4;
  --theme-purple-color:#9928f4;
  --theme-pink-color:#dd0f63;
  
  --theme-item-invert-filter: invert(0%);
  --theme-link-color-filter: brightness(0) saturate(100%) invert(41%) sepia(80%) saturate(721%) hue-rotate(323deg) brightness(90%) contrast(90%);
}

body {
    background: url(/images/d/d1/BG_redgrit.jpg);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-color: #dfd7cc;
    font-family:"Noto Sans Oriya", "Arial";
}

.mw-body, .parsoid-body
{
	background-color: rgb(255,248,246, 95%);
}

div#content {
    background: var(--theme-body-color);
    box-shadow: 0 0.1em 0.75em rgba(0,0,0,0.3);
    border: none;
    box-sizing: border-box;
    color: var(--theme-text-color);
}

.mobileonly {
    display: none
}

/* Menus  */

body #pageWrapper {
    margin-right: 5px
}

#mw-head-base {
    background: transparent;
    background-image: none;
    border-bottom: 0px
}

div#mw-page-base {
    background: transparent;
    background-image: none
}

/***********************
* Header buttons *
************************/
#mw-head li.new a {
    color: #db9fc9
}
#right-navigation {
    margin-right: 0.5em
}
div.vectorTabs,div.vectorTabs span,div.vectorTabs li.selected,div.vectorTabs ul,div.vectorTabs ul li,div.vectorTabs li a {
    background: rgba(0,0,0,0)
}

div.vectorMenu h3 span {
    display: block;
    font-size: 0.8em;
    padding-top: 1.20em;
    font-weight: normal;
    color: #fff;
}
div.vectorMenu h3 a,div#mw-head div.vectorMenu h3 {
    background-color: transparent;
    background-image: none;
    border: 0px
}

div#mw-head,div.vectorTabs li a,div.vectorMenu li a,.vectorTabs li a span,div#mw-head div.vectorTabs a,div.vectorMenu h3 span {
    font-family: 'Bebas Neue';
}
.vector-menu-tabs-legacy li a,
div#mw-head li.new a,
.vector-menu-dropdown .vector-menu-heading,
.vector-menu-dropdown .vector-menu-heading:hover,
.vector-menu-dropdown .vector-menu-heading:focus {
    color:var(--theme-headertext-color);
    opacity:50%;
    font-size:17px 
}
div.vectorTabs li.selected a,
div.vectorTabs li.selected a:visited {
    color:var(--theme-headertext-color);
    opacity:100%
}
.vector-menu-tabs-legacy li a:hover,
div#mw-head li.new a:hover, 
.vector-menu-dropdown .vector-menu-heading:hover {
    opacity: 70%;
}
.vector-menu-tabs-legacy li a {
    height:40px;
    padding-top:1em;
    padding-left:8px;
    padding-right:8px 
}
.vector-menu-dropdown .vector-menu-heading {
    padding:1em 8px 1px;
}
.vector-menu-tabs .mw-watchlink.icon a {
    width:2em;
    height:40px;
    padding:0 0;
    opacity: 100%;
    color:transparent;
    user-select:none 
}
.vector-menu-tabs .mw-watchlink.icon a:before {
    top:0.8em;
    left:0.4em;
    width:1.2em;
    height:1.2em
}
.vector-menu-dropdown .vector-menu-heading:after {
    opacity:.7;
    filter: invert(100)
}
.vector-menu #p-cactions-checkbox {
  height:15px;
  width:15px;
  margin-left: 45px;
  margin-top: 20px;
}
.vector-menu-tabs,
.vector-menu-tabs a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
    background-image:linear-gradient(to bottom,rgba(167,215,249,0) 0,var(--theme-borders-color) 100%);
}
.vector-menu-dropdown .vector-menu-content {
    background-color:var(--theme-box-color);
    border:1px solid var(--theme-box-border-color);
    border-top-width:0;
}
.vector-menu-dropdown .mw-list-item a:not(.mw-ui-icon) {
    font-size:1em
}
.vector-menu-dropdown .mw-list-item a {
    color:var(--theme-link-color);
}
div.vectorMenu div.menu {
    background-color: #d6e2eb;
    border: 1px solid black
}
div.vectorMenu ul {
    background-color: rgba(0,0,0,0);
    border: none
}
/* Search box  */
.vector-search-box-input {
  background-color:var(--theme-typebox-color);
  color:var(--theme-text-color);
  border: 1px solid var(--theme-borders-color);
  font-family:Saira;
  font-size:.8125em;
  opacity: 75%
}
.vector-search-box-inner:hover .vector-search-box-input {
  border-color:var(--theme-button-color);
  opacity: 85%;
}
.vector-search-box-input:focus,
.vector-search-box-inner:hover .vector-search-box-input:focus {
  outline:0;
  border-color:var(--theme-button-color);
  box-shadow:inset 0 0 0 1px var(--theme-button-color);
  opacity: 100%
}

.suggestions-results {
  background-color:var(--theme-typebox-color);
  border:1px solid var(--theme-borders-color);
}
.suggestions-result {
  color:var(--theme-text-color);
}
.suggestions-result-current {
  background-color:var(--theme-highlight-color);
  color:var(--theme-text-color)
}
.suggestions-special {
  background-color:var(--theme-typebox-color);
  border:1px solid var(--theme-borders-color);
}
.suggestions-special .special-label {
  color:var(--theme-borders-color);
}
.suggestions-special .special-query {
  color:var(--theme-text-color);
}
.suggestions-result-current .special-label,
.suggestions-result-current .special-query {
  color:var(--theme-text-color)
}

.mw-search-profile-tabs {
  border:1px solid var(--theme-borders-color);
}
.mw-search-profile-tabs div.search-types ul li.current a {
  color:var(--theme-text-color);
}

/***********************
* Left sidebar *
************************/

div#mw-panel div.portal:not(#p-claimWiki):not(#p-socialProfiles):not(#p-sitePromos) {
    background: var(--theme-body-color);
    border-left: 5px solid var(--theme-box-accent-color);
    box-shadow: 0 0.1em 0.75em rgba(0,0,0,0.3);
    margin: 5px;
    padding-top: 0px;
}
div#mw-panel div.portal div.body,#mw-panel.collapsible-nav .portal {
    background-image: none
}
div#mw-panel div.portal div.body ul li a,div#mw-panel div.portal div.body ul li a:visited {
    color: var(--theme-text-color)
}
div#mw-panel div.portal h3,div#mw-panel div.portal h3:visited,#mw-panel.collapsible-nav .portal h3 a,#mw-panel.collapsible-nav .portal h3 a:visited,#mw-panel.collapsible-nav .portal.collapsed h3 a,#mw-panel.collapsible-nav .portal.collapsed h3 a:visited {
    color: var(--theme-text-color);
    font-family: 'Bebas Neue';
    font-size:110%;
    text-align: center;
    margin-left: auto;
}
.vector-menu-portal .vector-menu-heading {
  background-image:linear-gradient(to right,rgba(200,204,209,0) 0,var(--theme-borders-color) 33%,var(--theme-borders-color) 66%,rgba(200,204,209,0) 100%);
}
.vector-menu-portal .mw-list-item a {
  width: 100%;
  display: block;
  height: 100%;
}
.vector-menu-portal .mw-list-item a:hover {
  color: var(--theme-link-color) !important;
}
.vector-menu-portal .vector-menu-content {
  margin-right: .5em;
}
div#mw-panel div#p-socialProfiles.portal .body {
    margin: auto;
}

/* End of Menus */

.socialSidebar {
    width: auto;
    max-width: 100%
}

/* Logo  */

#p-logo a {
    background-size: contain
}

a,a:visited,a:active,div#content a.extiw,div#content a.extiw:visited,div#content a.external,div#content a.external:visited,.pseudo-link,label.toctogglelabel {
    color: var(--theme-link-color);
}

a.new, a.new:visited {
    color: var(--theme-red-link-color);
}

.mw-body h1, .mw-body-content h1 {
    font-family:"Saira",sans-serif;
    font-weight: 600;
}

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

.mw-body h1,.mw-body h2 {
    border-bottom: 1px solid var(--theme-borders-color)
}

h1,h2,h3,h4,h5,h6 {
    color: var(--theme-text-color);
    background: none;
    font-weight: normal;
    margin: 0;
    overflow: hidden;
    padding-top: 0.5em;
    padding-bottom: 0.17em
}

.fakeh2 {
    color: var(--theme-text-color);
    background: none;
    font-weight: normal;
    margin: 0;
    margin-top: 1em;
    margin-bottom: 0.25em;
    padding: 0;
    font-size: 1.5em;
    line-height: 1.3;
    border-bottom: 1px solid var(--theme-borders-color)
}

.mw-editsection, .mw-editsection-like {
    font-family:Saira
}

.client-js .mw-content-ltr .mw-editsection-bracket:first-of-type,
.client-js .mw-content-rtl .mw-editsection-bracket:not(:first-of-type),
.client-js .mw-content-rtl .mw-editsection-bracket:first-of-type,
.client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type),
.mw-editsection-divider {
  color:var(--theme-borders-color)
}

ol.references li:target,
sup.reference:target {
  background-color:var(--theme-highlight-color);
}

.catlinks,ul#filetoc {
    background: rgba(0,0,0,0);
    border: 1px solid var(--theme-borders-color);
    border-radius: 5px;
    clear: both;
    margin-top: 1em;
    padding: 5px
}

.catlinks li {
  border-left:1px solid var(--theme-borders-color);
}

.CategoryTreeToggle {
    color: #3b82b9
}

#toc,.toc,.mw-warning {
    background-color: var(--theme-box-color);
    border: 1px solid var(--theme-box-border-color);
    border-left: 5px solid var(--theme-box-accent-color);
    box-shadow: 0 0.1em 0.75em rgba(0,0,0,0.2);
}

.tocnumber, .vector-body .toc h2 {
	color: var(--theme-text-color);
}

.vector-body .toc h2 {
    font-family:"Saira";
}

.mw-content-ltr .toc ul ul, .mw-content-rtl .mw-content-ltr .toc ul ul {
    margin:0 0 0 1.5em
}

#contentSub,
#contentSub2 {
  color:var(--theme-borders-color);
}

div.mw-warning-with-logexcerpt {
    border: 2px solid #3c83ba
}

fieldset {
    border: 1px solid black;
    border-radius: 5px
}

ul {
    list-style-image: none
}

#footer
{
	background: var(--theme-body-color)
}

div#footer {
    background: rgba(255,255,255,0.95);
    box-shadow: 0 0.1em 0.75em black;
    border: none;
    border-radius: 5px;
    margin-top: 4em;
    margin-bottom: 2em
}

#footer ul li, div#footer ul li {
    color: var(--theme-text-color)
}

div#footer ul li a {
    color: #776757
}

#claimlist .controls_container > .dropdown {
    right: 24px;
    top: -24px
}

.alwaysinvert {
  -webkit-filter: invert(100%) hue-rotate(180deg);
  filter: invert(100%) hue-rotate(180deg);
}

/* Tables  */

table {
    display: table;
    white-space: unset;
}

table.wikitable {
    background: none repeat scroll 0 0 transparent
}

.wikitable {
	border: 1px solid var(--theme-borders-color);
}

table.wikitable>tr>th, table.wikitable>*>tr>th
{
	background: var(--theme-box-color);
	border: 1px solid var(--theme-borders-color);
}

table.wikitable>tr>td, table.wikitable>*>tr>td
{
	border: 1px solid var(--theme-borders-color);
}

table.wikitable > caption {
    color: var(--theme-text-color)
}

table.wikitable > tr > th,table.wikitable > * > tr > th {
    color: var(--theme-text-color);
    text-align: center
}

table.wikitable > tr > td,table.wikitable > * > tr > td {
    border: 1px solid var(--theme-borders-color);
    padding: 0.2em
}

.wikitable th {
    color: #FFFFFF;
    padding: 0.2em
}

.wikitable td {
    color: var(--theme-text-color);
    padding: 0.2em
}

table.mw_metadata th {
    background: black;
    border: 1px solid var(--theme-borders-color);
    color: #FFFFFF
}

table.mw_metadata td {
    background-color: transparent;
    border: 1px solid var(--theme-borders-color);
    color: var(--theme-text-color)
}

.mw-datatable th {
    border: 1px solid var(--theme-borders-color)
}

.mw-datatable,.mw-datatable td {
    border: 1px solid var(--theme-borders-color)
}

.TablePager {
    border: 1px solid var(--theme-borders-color);
    color: #000000;
    padding: 0 0.15em
}

.TablePager th {
    background-color: black;
    color: #ffffff;
    border: 1px solid var(--theme-borders-color);
    padding: 0 0.15em
}

.TablePager tr:hover td {
    background-color: rgba(0,0,0,0.2) !important;
    color: #FFFFFF
}

.TablePager th a {
    background-color: black;
    color: #FFFFFF !important
}

.TablePager td {
    background: transparent !important;
    border: 1px solid var(--theme-borders-color);
    color: #000000
}

/* End of Tables  */

.mw-collapsible-toggle-default .mw-collapsible-text {
  color:var(--theme-link-color);
}
.mw-collapsible-toggle-default::before,
.mw-collapsible-toggle-default::after {
  color: var(--theme-borders-color);
}

.mw-collapsible-toggle.mw-collapsible-toggle-expanded a,.mw-collapsible-toggle.mw-collapsible-toggle-collapsed a {
    color: var(--theme-link-color)
}

.mw-interwiki-legend .mw-collapsible-toggle a {
    color: #ffffff
}

fieldset#mw-searchoptions {
    background-color: rgba(0,0,0,0);
    border-color: black !important
}

.mw-search-profile-tabs {
    background-color: rgba(0,0,0,0);
    border: 1px solid black;
    margin-top: 1em
}

.mw-search-profile-tabs div.search-types ul li.current a {
    color: #000000
}

#pagehistory li.selected {
    background-image: none;
    background-color:var(--theme-box-color);
    border:1px dashed var(--theme-highlight-color);
    color: var(--theme-text-color);
    padding: 3px
}

div.thumb {
    border: 1px solid var(--theme-borders-color);
    margin: 2px;
    margin-left: 6px
}

img.thumbborder {
    border: 1px solid var(--theme-borders-color);
    border-radius: 5px;
    padding: 5px
}

.thumbimage {
  background-color:var(--theme-box-color);
}

div.thumbinner {
    background-color:var(--theme-box-color);
    border: medium none
}

li.gallerybox div.thumb {
    background-color: rgba(255,255,255,0.2);
    border: 1px solid var(--theme-borders-color);
    border-radius: 5px
}

html .thumbimage {
    border: 1px solid var(--theme-box-border-color);
    border-radius: 5px
}

.mw-mmv-post-image {
  color:var(--theme-text-color);
  background-color:var(--theme-box-color);
}
.mw-mmv-image-metadata {
  border-top:1px solid var(--theme-box-border-color);
  background-color:var(--theme-body-color);
}

.mw-ui-button.mw-ui-progressive:not(:disabled),
.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive, 
.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive {
  background-color:var(--theme-button-color);
  color:#fff;
  border-color:var(--theme-button-color);
}
.mw-ui-button.mw-ui-progressive:not(:disabled):hover,
.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover, 
.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover {
  background-color:var(--theme-button-hover-color);
  border-color:var(--theme-button-hover-color);
}
.mw-ui-button.mw-ui-progressive:not(:disabled):active,
.mw-ui-button.mw-ui-progressive:not(:disabled).is-on,
.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active, 
.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active, 
.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active, 
.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active {
  background-color:var(--theme-button-color);
  border-color:var(--theme-button-color);
  filter: brightness(0.7);
}
.mw-ui-button.mw-ui-progressive:not(:disabled):focus,
.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active), 
.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active) {
  box-shadow:inset 0 0 0 1px var(--theme-button-color),inset 0 0 0 2px #ffffff;
}

.embedvideo-loader:hover .embedvideo-loader__fakeButton {
  background-color:var(--theme-button-color);
}

div.tright div.tleft {
    border: 1px solid black !important
}

div.tright {
    clear: right;
    float: right
}

/* Ambox  */

.ambox {
    background-color: var(--theme-box-color);
    border: 1px solid var(--theme-box-border-color);
    border-collapse: collapse;
    font-size: 95%;
    margin: 0 auto 10px auto;
    width: 80%;
    box-shadow: 0 0.1em 0.75em rgba(0,0,0,0.2);
}

.ambox-gray {
    border-left-color: #383838
}

.ambox.ambox-tiny {
    font-size: 90%;
    margin: 2px 0;
    width: auto
}

.ambox + .ambox {
    margin-top: -2px
}

.ambox-text {
    padding: 0.25em 0.5em
}

.ambox-image {
    padding: 2px 0px 2px 0.5em;
    text-align: center;
    width: 60px
}

.ambox-tiny .ambox-image {
    padding: 2px 0.5em;
    text-align: left;
    width: auto
}

.ambox-blue {
    border-left: 10px solid var(--theme-blue-color)
}

.ambox-red {
    border-left: 10px solid var(--theme-red-color)
}

.ambox-orange {
    border-left: 10px solid var(--theme-orange-color)
}

.ambox-yellow {
    border-left: 10px solid var(--theme-yellow-color)
}

.ambox-purple {
    border-left: 10px solid var(--theme-purple-color)
}

.ambox-gray {
    border-left: 10px solid var(--theme-common-color)
}

.ambox-green {
    border-left: 10px solid var(--theme-green-color)
}

.amsmalltext {
    font-size: smaller;
    margin-left: 0.8em;
    margin-top: 0.5em
}

.feature {
    background: rgba(0,0,0,0.05);
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: 5px;
    padding: 10px
}

/* Navbox  */

.navbox {
    width: 100%;
    clear: both;
}
table.navbox {
    border: 1px solid var(--theme-box-border-color);
    clear: both;
    font-size: 88%;
    margin: auto;
    padding: 1px;
    text-align: center;
    width: 100%
}

table.navbox + table.navbox {
    margin-top: -1px
}

.navbox-title,.navbox-abovebelow,table.navbox th {
    padding-left: 1em;
    padding-right: 1em;
    text-align: center
}

.navbox-group {
    font-weight: bold;
    padding-left: 1em;
    padding-right: 1em;
    white-space: nowrap
}

.navbox,.navbox-subgroup {
    background: var(--theme-box-color)
}

.navbox-list {
    border-color: var(--theme-box-border-color)
}

.navbox-title,table.navbox th {
    background:rgba(255,255,255,.2);
    font-family:"Saira";
    font-weight: 600;
    letter-spacing: 0.02em;
}

.navbox-abovebelow,.navbox-group,.navbox-subgroup .navbox-title {
    background: rgba(255,255,255,0.2);
}

.navbox-subgroup .navbox-group,.navbox-subgroup .navbox-abovebelow {
    background: rgba(0,0,0,0.05);
}

.navbox-even {
    background: rgba(0,0,0,0.05);
}

.navbox-odd {
    background: transparent
}

.collapseButton {
    font-weight: normal;
    width: auto
}

.navbox .collapseButton {
    width: 6em
}

.navbar {
    font-size: 88%;
    font-weight: normal
}

.navbox .navbar {
    font-size: 100%
}

table.collapsed tr.collapsible {
    display: none
	
}

/* Tabber */
.tabber__header {
  box-shadow:inset 0 -1px 0 0 var(--theme-borders-color);
}
.tabber__tab,
.tabber__tab:visited {
  color:var(--theme-borders-color);
}
@media (hover:hover) {
  .tabber__tab:hover {
    color:var(--theme-text-color);
  }
}
.tabber__tab[aria-selected='true'],
.tabber__tab[aria-selected='true']:visited {
  color:var(--theme-button-color);
}
.tabber__indicator {
  background:var(--theme-button-color);
}

/* Template:Ability */
.ability-container {
    width: 100%;
    max-width: 65vw
}

.wikitable.ability {
    margin-bottom: 0
}

table.ability {
    width: 100%
}

.tabber-ability {
    text-align: left;
    border: 1px solid var(--theme-borders-color);
    border-top: 0
}

.tabber-ability .tabbernav {
    border: 0;
    padding: 0.5em;
    background-color: #000
}

.tabber-ability .tabbernav li {
    padding: 0;
    margin-top: 0
}

.tabber-ability .tabbernav li a:link,.tabber-ability .tabbernav li a:link:hover {
    background: rgba(127,127,127,0.2);
    color: #fff;
    border: 0;
    padding: 0.5em;
    font-size: 1.1em
}

.tabber-ability .tabbernav li.tabberactive a:link {
    background: rgba(255,255,255,0.5)
}

.tabber-ability .tabbertab {
    border: 0;
    text-align: left
}

.ability-image {
    width: 100px
}

.ability-header {
    width: 6em
}

ul.tabbernav li a:link {
    background-color: rgba(235,235,235);
    color: #7F5126;
    padding: 0.5em;
    border: 1px solid #999
}

ul.tabbernav li a:hover {
    background-color: rgba(200,200,200,0.75)
}

ul.tabbernav li.tabberactive a {
    background-color: #fff;
    color: #000;
    border-bottom: none
}

ul.tabbernav li {
    display: inline-block;
    margin-top: 0.5em
}

.tabber .tabbertab {
    border: 1px solid #999
}

/* Infobox  */

.infobox {
    float: right;
    width: 23em;
    margin-left: 1em;
    margin-right: 1em;
    margin-bottom: 0.5em;
    padding: 4px;
    border-bottom: 5px solid var(--theme-infobox-label-color);
    background-color: var(--theme-infobox-bg-color);
    color: var(--theme-infobox-text-color);
    box-shadow: 0 0.1em 0.75em rgba(0,0,0,0.2);
}

.infobox-table {
    width: 100%;
    padding: 0;
    background-color: transparent;
    border: 0
}

.infobox-header {
    text-align: center;
    font-family: 'Bebas Neue';
    vertical-align: middle;
    padding: 0px;
    font-size: 200%;
    background-color: var(--theme-infobox-label-color);
    color: var(--theme-infobox-labeltext-color);
    border: none
}

.infobox-section {
    text-align: center;
    letter-spacing: 0.05em;
    color: var(--theme-infobox-text-color);
    font-family: Saira;
    font-weight: 500
}

.infobox-section::before {
    content: "— "
}

.infobox-section::after {
    content: "—"
}

.infobox-section a {
    color: #fff
}

.infobox-centered {
    text-align: center;
    color: var(--theme-infobox-text-color)
}

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

.infobox-row {
    vertical-align: top
}

.infobox-row-name, .infobox-row-hname {
  background-color:var(--theme-infobox-label-color);
  color:var(--theme-infobox-labeltext-color);
  vertical-align:middle;
  font-size:80%;
  padding:0 .5em;
  font-family: Saira Semi Condensed;
  font-weight: 400;
  white-space:nowrap
}

.infobox-row-name {
    border-bottom-right-radius: 5px;
    text-align: right;
    width: 100px;
}

.infobox-row-hname {
  text-align:center;
  padding: 1px 0px;
}

.infobox-row-value {
  color: var(--theme-infobox-text-color)
}

.infobox-spacer {
    height: 0.5em
}

.infoboxtable {
    background-color: var(--theme-infobox-bg-color);
    border: 1px solid black;
    color: var(--theme-infobox-text-color);
    float: right;
    font-size: 89%;
    margin-bottom: 0.5em;
    margin-left: 1em;
    padding: 0.2em;
    width: 300px
}

.infoboxtable td {
    vertical-align: top
}

.infoboxtable td > div {
    background-color: var(--theme-infobox-label-color);
    border: 2px solid inherit;
    font-weight: bold;
    padding: 0.5px 7px;
    text-align: right;
    color: var(--theme-infobox-labeltext-color);
}

.infoboxname {
    font-size: 110%;
    padding: 0.5em
}

.infoboxdetails {
    padding: 0em
}

/* Infobox Coloring  */

.infobox.weapon {
  --weapon-background-color:var(--theme-infobox-bg-color);
  --weapon-highlight-color:var(--theme-infobox-label-color);
  --weapon-header-color:var(--theme-infobox-label-color);
  
  background:var(--weapon-background-color);
  border-color:var(--weapon-highlight-color)
}

.infobox.weapon .infobox-header {
  background:var(--weapon-highlight-color);
  color:var(--weapon-header-color);
}

.infobox.weapon[class$=weapon] .infobox-header {
  color:var(--theme-infobox-label-color);
}

.infobox.weapon .infobox-row-name, .infobox.weapon .infobox-row-hname {
  background:var(--weapon-highlight-color);
  color:var(--weapon-header-color)
}

.infobox.weapon.arrows {
  --weapon-background-color:#FBF2D5;
  --weapon-highlight-color:#917E43;
  --weapon-header-color:#F3D573;
}

.infobox.weapon.energy-ammo {
  --weapon-background-color:#E2EE9C;
  --weapon-highlight-color:#636F1D;
  --weapon-header-color:#CEE255;
}

.infobox.weapon.heavy-rounds {
  --weapon-background-color:#B5E5D3;
  --weapon-highlight-color:#366654;
  --weapon-header-color:#6BCEA8;
}

.infobox.weapon.heavylight {
  --weapon-background-color:#B5E5D3;
  --weapon-highlight-color:#366654;
  --weapon-header-color:#6BCEA8;
}

.infobox.weapon.light-rounds {
  --weapon-background-color:#F9CCA4;
  --weapon-highlight-color:#815126;
  --weapon-header-color:#F49A4A;
}

.infobox.weapon.shotgun-shells {
  --weapon-background-color:#FF957F;
  --weapon-highlight-color:#801600;
  --weapon-header-color:#FE2C00;
}

.infobox.weapon.sniper-ammo {
  --weapon-background-color:#C1C3FF;
  --weapon-highlight-color:#3E36A5;
  --weapon-header-color:#7E82FF;
}

.infobox.weapon[class*=mythic] {
  --weapon-background-color:#F9B2C8;
  --weapon-highlight-color:#8B001A;
  --weapon-header-color:#EE0047;
}

.infobox.weapon.sheila {
  --weapon-background-color:#f5aed1;
  --weapon-highlight-color:#ae0774;
  --weapon-header-color:#ff4eb8;
}

.infobox.weapon.a13 {
  --weapon-background-color:#c7e4f7;
  --weapon-highlight-color:#2479b1;
  --weapon-header-color:#8bd0f9;
}

.infobox.legend {
  --legend-class-color:var(--theme-infobox-label-color);

  border-color:var(--legend-class-color);
}
.infobox.legend .infobox-row-name {
  border-right:3px solid var(--legend-class-color);
}

.infobox.legend.assault {
  --legend-class-color: #d64537;
}
.infobox.legend.skirmisher {
  --legend-class-color: #bfa937;
}
.infobox.legend.recon {
  --legend-class-color: #8e3ae2;
}
.infobox.legend.support {
  --legend-class-color: #3f75dc;
}
.infobox.legend.controller {
  --legend-class-color: #70c84d;
}
.infobox.seasonal.s01 {
  --theme-infobox-bg-color: #fbdbd2;
  --theme-infobox-label-color: #a21111;
  --theme-infobox-labeltext-color: #f5e8e2;
}
.infobox.seasonal.s02 {
  --theme-infobox-bg-color: #c6c8fb;
  --theme-infobox-label-color: #25429d;
  --theme-infobox-labeltext-color: #CBCEF5;
}
.infobox.seasonal.s03 {
  --theme-infobox-bg-color: #e4e3e6;
  --theme-infobox-label-color: #8791a0;
  --theme-infobox-labeltext-color: #e4e3e6;
}
.infobox.seasonal.s04 {
  --theme-infobox-bg-color: #d5c2c0;
  --theme-infobox-label-color: #353434;
  --theme-infobox-labeltext-color: #aa342e;
}
.infobox.seasonal.s05 {
  --theme-infobox-bg-color: #fce3a4;
  --theme-infobox-label-color: #d1a240;
  --theme-infobox-labeltext-color: #212c2d;
}
.infobox.seasonal.s06 {
  --theme-infobox-bg-color: #ffbae4;
  --theme-infobox-label-color: #bf1d7f;
  --theme-infobox-labeltext-color: #43d5c5;
}
.infobox.seasonal.s07 {
  --theme-infobox-bg-color: #b2f8f2;
  --theme-infobox-label-color: #00cfcc;
  --theme-infobox-labeltext-color: #fffefd;
}
.infobox.seasonal.s08 {
  --theme-infobox-bg-color: #ffe6c0;
  --theme-infobox-label-color: #ec5118;
  --theme-infobox-labeltext-color: #ffb645;
}
.infobox.seasonal.s09 {
  --theme-infobox-bg-color: #e8cae5;
  --theme-infobox-label-color: #6801a8;
  --theme-infobox-labeltext-color: #ec8b08;
}
.infobox.seasonal.s10 {
  --theme-infobox-bg-color: #b4d0cf;
  --theme-infobox-label-color: #0b5867;
  --theme-infobox-labeltext-color: #f2e388;
}
.infobox.seasonal.s11 {
  --theme-infobox-bg-color: #ffd3d3;
  --theme-infobox-label-color: #db4e53;
  --theme-infobox-labeltext-color: #98e0e6;
}
.infobox.seasonal.s12 {
  --theme-infobox-bg-color: #ffffc3;
  --theme-infobox-label-color: #f9f832;
  --theme-infobox-labeltext-color: #1b1901;
  border-bottom: 5px solid #840d0f;
}
.infobox.seasonal.s13 {
  --theme-infobox-bg-color: #dce7f7;
  --theme-infobox-label-color: #3c38a3;
  --theme-infobox-labeltext-color: #d7b2e8;
}
.infobox.seasonal.s14 {
  --theme-infobox-bg-color: #bbe4d7;
  --theme-infobox-label-color: #1b5e3c;
  --theme-infobox-labeltext-color: #75d0b3;
}
.infobox.seasonal.s15 {
  --theme-infobox-bg-color:#ecd3de;
  --theme-infobox-label-color:#d06dcc;
  --theme-infobox-labeltext-color:#f7e2ad;
}
.infobox.seasonal.s16 {
  --theme-infobox-bg-color: #f7eeea;
  --theme-infobox-label-color: #bb0e0e;
  --theme-infobox-labeltext-color: #FFF;
}
.infobox.seasonal.s17 {
  --theme-infobox-bg-color:#d5e2e6;
  --theme-infobox-label-color:#052b5d;
  --theme-infobox-labeltext-color:#efe1a2;
}
.infobox.seasonal.s18 {
  --theme-infobox-bg-color:#ffdacc;
  --theme-infobox-label-color:#553725;
  --theme-infobox-labeltext-color:#df460f;
}
.infobox.seasonal.s19 {
  --theme-infobox-bg-color:#F9D7F9;
  --theme-infobox-label-color:#780062;
  --theme-infobox-labeltext-color:#F772C1;
}
.infobox.seasonal.s20 {
  --theme-infobox-bg-color: #DEE9F0;
  --theme-infobox-label-color: #12193e;
  --theme-infobox-labeltext-color: #07E0B9;
  border-bottom: 5px solid #cf0f00;
}
.infobox.seasonal.s21 {
  --theme-infobox-bg-color:#f0e1f7;
  --theme-infobox-label-color:#4dda98;
  --theme-infobox-labeltext-color:#d3ffd6;
}

/*******************************************
* Legend Upgrade template styling *
********************************************/

.leup-level.leup-blue {
  background-color:#62c8ff;
  margin-top:10px;
  padding:3px 10px;
  width: 250px;
  border: 1px solid #1c89f3;
}
.leup-level.leup-purple {
  background-color:#c84dff;
  margin-top:10px;
  padding:3px 10px;
  width: 250px;
  border: 1px solid #9829f5;
}
.leup-upgrades {
  background-color:var(--theme-box-color);
  margin-top:-1px;
  padding:5px;
  padding-right:10px;
  width:fit-content;
  border: 1px solid var(--theme-box-border-color);
}

/*******************************************
* Item box template styling *
********************************************/

.itemboxbg {
  background-size: cover;
  width: 100px;
  height: 100px;
  align-items: center;
  display: flex;
}
.itemboxbg.lvl1 {
  background-image: url(/images/7/76/ItemBG_lvl_1.svg);
}
.itemboxbg.lvl2 {
  background-image: url(/images/a/ab/ItemBG_lvl_2.svg);
}
.itemboxbg.lvl3 {
  background-image: url(/images/0/01/ItemBG_lvl_3.svg);
}
.itemboxbg.lvl4 {
  background-image: url(/images/c/c2/ItemBG_lvl_4.svg);
}
.itemboxbg.lvl5 {
  background-image: url(/images/f/f3/ItemBG_lvl_5.svg);
}
.itemboxbg.lvl123 {
  background-image: url(/images/d/d5/ItemBG_lvl_123.svg);
}
.itemboxbg.lvl1234 {
  background-image: url(/images/2/2e/ItemBG_lvl_1234.svg);
}
.itemboxbg.lvl1235 {
  background-image: url(/images/d/db/ItemBG_lvl_1235.svg);
}
.itemboxbg.lvl234 {
  background-image: url(/images/7/7a/ItemBG_lvl_234.svg);
}

/***************************
* Used by [[Template:Key]] *
****************************/
.keysDark {
  color:black; 
  border: 1px solid rgb(170, 170, 170); 
  box-shadow: 0.1em 0.2em 0.2em rgb(221, 221, 221); 
  border-radius: .2em; 
  background-image: linear-gradient(to bottom, rgb(238, 238, 238), rgb(249, 249, 249), rgb(238, 238, 238)); 
  background-color: rgb(249, 249, 249); 
  padding: 0.1em 0.6em 0.1em 0.6em; 
  margin-right:2px; 
  font-size:85%; 
  font-family:inherit; 
  font-style:normal;
}

.keysLight {
    color: white;
    border: 1px solid rgb(0,0,0);
    box-shadow: 0.1em 0.2em 0.2em rgb(0,0,0);
    border-radius: .2em;
    background-image: linear-gradient(to bottom,rgb(0,0,0),rgb(15,15,15),rgb(30,30,30));
    background-color: rgb(30,30,30);
    padding: 0.1em 0.6em 0.1em 0.6em;
    margin-right: 2px;
    font-size: 85%;
    font-family: inherit;
    font-style: normal
}

/******************************
* End Template:Key coloration *
*******************************/

/***********************
* Tabber overflow fix *
************************/
.gallery.mw-gallery-nolines {
	margin-top: 0;
}

/***********************
* Datamaps styling *
************************/
.ext-datamaps-container-content .ext-datamaps-container-leaflet {
  background: url(/images/3/3d/Mapscreen_bg.png);
  background-color:var(--theme-body-color);
  background-size: 150px;
}
.oo-ui-panelLayout-framed {
  border:1px solid var(--theme-borders-color);
}

.leaflet-bar {
  background-color:var(--theme-box-color);
  border:1px solid var(--theme-box-border-color);
}

.ext-datamaps-control-expandable,
.oo-ui-menuLayout-content,
.ext-datamaps-control-expandable > button:nth-child(1),
.ext-datamaps-control-expandable[aria-expanded="true"] {
  background-color: var(--theme-box-color);
}

.leaflet-bar button:hover,
.leaflet-bar button:focus {
  background-color:var(--theme-box-hover-color);
}

select.leaflet-control,
.leaflet-container button.leaflet-popup-close-button {
  color: var(--theme-text-color);
}

.ext-datamaps-control-search ul.ext-datamaps-control-search-results {
  background:var(--theme-box-color);
}

.ext-datamaps-control-search ul.ext-datamaps-control-search-results li:focus,
.ext-datamaps-control-search ul.ext-datamaps-control-search-results li[data-highlighted='true'] {
  background:var(--theme-highlight-color);
  color:var(--theme-text-color);
}

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background:var(--theme-box-color);
  color:var(--theme-text-color);
}

.ext-datamaps-popup-header .ext-datamaps-popup-subtitle {
  color:var(--theme-borders-color);
}

.leaflet-bar button {
  border-bottom:1px solid var(--theme-box-border-color);
  color:var(--theme-text-color)
}

/********************
* Other Stuff *
*********************/

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button
{
	color: var(--theme-link-color);
}

/********************
* [[Template:Mbox]] *
Adopted from https://acecombat.wiki.gg/wiki/Template:Mbox
*********************/
.mbox {
	display: flex;
	position: relative;
	background-color: var(--theme-body-color);
	border: 1px solid var(--theme-link-color);
	border-left-width: 8px;
	margin-bottom: 5px;
	min-height: 32px;
}
.mbox-type-success {
	border-color: var(--theme-green-color);
}
.mbox-type-info {
	border-color: var(--theme-accent-color--hover);
}
.mbox-type-moderate {
	border-color: var(--theme-orange-color);
}
.mbox-type-important {
	border-color: var(--theme-red-color);
}
.mbox__content {
	display: table;
	box-sizing: border-box;
	width: 100%;
	padding: 8px 15px;
}
.mbox__content__image {
	display: table-cell;
	width: 45px;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	padding-right: 15px;
	font-size: 2.5em;
	line-height: 1;
}
.mbox__content__image .icon-filter {
	filter: var(--wiki-icon-general-filter);
}
.mbox__content__wrapper {
	display: table-cell;
	vertical-align: middle;
}
.mbox__content__header {
	display: block;
	font-weight: bold;
}
.mbox__content__text {
	display: block;
}
.mbox__content__text__comment {
	font-size: small;
}
.mbox__content__aside {
	display: table-cell;
	width: 100px;
	vertical-align: middle;
	text-align: center;
	padding-left: 15px;
	border-left: 1px solid var(--theme-link-color);
}
.mbox__close {
	position: absolute;
	right: 0;
	top: 0;
	padding: 2px 7px;
	font-weight: bold;
	font-size: 16px;
	color: var(--theme-text-color);
	cursor: pointer;
	transition: all .15s ease-in;
}
.mbox__close:hover {
	color: var(--theme-link-color);
}
.mbox__close:after {
	content: '×';
}
.mw-collapsed + .mbox__close {
	transform: rotate(45deg);
	padding: 4px 7px 5px 2px;
}
.mbox__content__image.fandom-icons {
	font-size: 2em;
}
#siteNotice .mbox {
	line-height: 1.4;
}
#siteNotice .mbox__close {
	display: none;
}
.sitedir-ltr .mw-dismissable-notice-body,
.sitedir-rtl .mw-dismissable-notice-body {
	clear: both;
	margin: 0;
}

	
#siteNotice>#localNotice, .mw-dismissable-notice
{
	background: #0002;
    border: 1px solid var(--theme-link-color);
    padding: .5em 1em 0;
}

/***********
* End Mbox *
************/