MediaWiki:Common.css
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.
/* This is the CSS for Warcraft Wiki. Any (hopefully) skin-invariant CSS should be defined in this file, for example:
- item colors
- class colors
- anything else referenced in {{text}}
Additional files are loaded based on the user's selected skin theme:
- Theme-dark.css (default)
- Theme-light.css
Overrides for white-on-white and similar contrast issues should be in the above theme files, not in this file.
Further CSS files are loaded based on loaded gadgets and can be found in MediaWiki:Gadgets-definition
*/
/* skin error overrides */
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child( even ) td {
background-color: inherit !important; /* avoids white-on-white in dark skin */
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
background-color: inherit !important; /* avoids white-on-white in dark skin */
}
/***********************************************************************************************************
* css reset for browser default rules and MediaWiki internal rules
***********************************************************************************************************/
* {
outline: 0;
}
table {
white-space: unset; /* be set to `no-wrap` in MW internal css */
}
html {
font-size: 16px; /* reset rem size */
}
body {
overflow-y: unset;
}
pre {
margin: 0;
}
h1, h2, h3, h4, h5, h6 {
padding: 0;
border: 0 solid transparent;
}
table {
background-color: transparent;
display: table;
white-space: unset;
}
body, code {
background: none;
}
/***********************************************************************************************************
* css for wiki.gg top bar and footer bar
***********************************************************************************************************/
/********* wiki.gg header *********/
header#wikigg-header #p-personal ul {
white-space: nowrap; /* for "log out" */
}
header#wikigg-header #p-personal .vector-menu-content #pt-anonuserpage, header#wikigg-header #p-personal .vector-menu-content #pt-userpage a {
/* user avatar icon position fix */
padding-top: 0;
background-position: left center;
}
@media screen and (max-width: 720px) {
header#wikigg-header #p-personal li#p-themes > span {
display: inline-block;
}
}
/********* wiki.gg footer *********/
footer#wikigg-footer .footer-right, footer#wikigg-footer .footer-left {
margin: 0;
text-align: center;
}
@media screen and (max-width: 479px) {
footer#wikigg-footer .footer-right, footer#wikigg-footer .footer-left {
width: auto;
}
}
@media screen and (max-width: 359px) {
footer#wikigg-footer .footer-middle {
/* hide wiki.gg logo to make room to avoid text wrapping */
display: none;
}
}
/***********************************************************************************************************
* theming vars.
***********************************************************************************************************/
:root {
/*** top site logo ***/
--theme-site-logo-image: url(/images/e/e6/Site-logo.png);
--theme-site-logo-filter: none;
--theme-site-logo-width: calc(400px * 0.4);
--theme-site-logo-height: calc(400px * 0.4);
/* common "box" style */
--theme-box-back-backdrop-filter: none;
--theme-box-border-radius: 4px;
--theme-box-border-width: 0px;
--theme-box-border-style: solid;
}
/* content box */
/* main article content box (without top heading) */
/* sidebar */
#mw-panel {
--theme-link-color: var(--theme-link-color);
--theme-link-color-visited: var(--theme-link-color);
--theme-link-color-hover: var(--theme-link-color);
--theme-border-width: 0;
--theme-gap: 0;
}
#catlinks {
--theme-background: none;
--theme-box-border-radius: 0;
}
#footer {
--theme-background: none;
}
/* navbar */
#mw-head {
--theme-link-color-visited: var(--theme-link-color);
--theme-link-color-hover: var(--theme-link-color);
--theme-background: var(--theme-site-background);
--theme-tab-background: var(--theme-box-background);
--theme-tab-background-selected: var(--theme-box-background);
--theme-tab-color-selected: var(--theme-text-color);
--theme-tab-color-selected-hover: var(--theme-tab-color-selected);
--theme-tab-border-color: var(--theme-box-border-color);
--theme-tab-border-color-selected: var(--theme-box-border-color);
}
#mw-head #p-search {
--theme-border-color: var(--theme-box-border-color);
--theme-link-color: var(--theme-text-color);
--theme-background: var(--theme-box-background);
--theme-border-color-hover: var(--theme-icon-color-hover);
--theme-border-color-focus: var(--theme-border-color-hover);
--theme-shadow: none;
--theme-shadow-focus: var(--theme-box-shadow);
}
/* search result suggestion */
body > .suggestions {
--theme-border-color: var(--theme-box-border-color);
--theme-rule-color: var(--theme-border-color);
--theme-link-color: var(--theme-text-color);
--theme-link-color-visited: var(--theme-text-color);
--theme-link-color-hover: var(--theme-text-color-hover);
}
/* gallery and thumbs */
.gallery {
--theme-gap-x: 6px;
--theme-gap-y: 6px;
}
ul.gallery, li.gallerybox {
margin-left: 0;
}
ul.mw-gallery-traditional li.gallerybox .thumb {
background: var(--theme-background-color);
border-color: var(--custom-border-color);
}
.thumb {
--theme-box-border-radius: 0;
}
.thumb {
background-color: var(--theme-background-color);
border: solid 1px var(--custom-border-color);
padding: 3px;
padding-bottom: 0;
}
.thumb .thumbimage { width: 100%; height: 100%; }
/***********************************************************************************************************
* base css styles for both interface and content box: font, color, etc.
***********************************************************************************************************/
/** Font **/
html, body {
font-family: sans-serif;
color: var(--theme-text-color);
}
html {
background: var(--theme-site-background);
}
body {
font-size: 14px;
line-height: 1.5;
}
ul, ol {
margin: 2px 0 2px 1.5em;
}
li {
margin: 0 0 2px 0;
}
pre, code, .mw-code {
color: var(--theme-text-color);
border: 1px solid var(--theme-border-color);
background: var(--theme-background);
background-color: var(--theme-background);
}
code {
border-radius: 2px;
padding: 1px 4px;
}
/** link color **/
body a, body a.external, body a.extiw, .mw-parser-output a, .mw-parser-output a.external, .mw-parser-output a.extiw {
text-decoration: none;
color: var(--theme-link-color);
}
body a:visited, body a.external:visited, body a.extiw:visited, .mw-parser-output a:visited, .mw-parser-output a.external:visited, .mw-parser-output a.extiw:visited {
color: var(--theme-link-color-visited);
}
body a:hover, body a:active, body a.external:hover, body a.external:active, body a.extiw:hover, body a.extiw:active, .mw-parser-output a:hover, .mw-parser-output a:active, .mw-parser-output a.external:hover, .mw-parser-output a.external:active, .mw-parser-output a.extiw:hover, .mw-parser-output a.extiw:active {
text-decoration: underline;
color: var(--theme-link-color-hover);
}
body a.selflink, body a.selflink:hover, body a.selflink:active, .mw-parser-output a.selflink:hover, .mw-parser-output a.selflink:active {
/* Self-links aren't real links, they're not clickable.
* Hence, they shouldn't change color when hovered over like real links, as that is counter-intuitive.
* We should not use :not(.selflink) since it increases the priority and make it is difficult to override
* link styles for certain elements (e.g. in wiki.gg header).
*/
text-decoration: none;
color: inherit;
}
body a.new, body a.new:hover, body a.new:visited, .mw-parser-output a.new, .mw-parser-output a.new:hover, .mw-parser-output a.new:visited {
/** red link **/
/* we don't really need to mark you have "visited" an inexistent page */
color: var(--theme-link-color-redlink);
}
/*********************************************************************************************************/
/* Removes VisualEdit button */
#ca-ve-edit {
display: none;
}
/* Text color */
.i .note,
.note-text {
color: var(--theme-text-color-note);
}
em {
color: var(--theme-text-color-em);
}
.pixel img, .pixel,
#mw-imagepage-section-filehistory img {
image-rendering: pixelated; /*for chrome*/
image-rendering: crisp-edges; /*for firefox*/
}
.small {
font-size: 85%;
}
.fullwidth, .full-width {
width: 100%;
}
.nowrap {
white-space: nowrap;
}
/* ".center" has width=100% rule, we don't want it, so use a different class name. */
.aligncenter,
.align-center {
text-align: center;
}
.alignleft,
.align-left {
text-align: left;
}
.alignright,
.align-right {
text-align: right;
}
/* clear fix for float block */
.clearfix {
*zoom: 1;
}
.clearfix::before,
.clearfix::after {
content: " ";
display: table;
}
.clearfix::after {
clear: both;
}
/* References smaller text than main */
.references {
font-size: 90%;
}
/* Larger font for Module: code display (default is smaller than other code pages) */
pre.lua.source-lua {
font-size: 14px !important;
}
/* Facilitate inline scary transclusion */
.scary-transclusion p, .scary-transclusion .mw-parser-output {
display: inline;
}
/* hide last empty paragraph at the end */
div.mw-parser-output > p:last-child > br:only-child {
display: none;
}
/* Fix empty parameter descriptions on api.php having no height, causing misalignments that seriously impede readability */
.apihelp-parameters dd:empty::before {
content: " ";
}
.block {
display: block;
}
.inline {
display: inline;
}
.inline-block {
display: inline-block;
}
hr.space {
height: 4px;
background: none;
border: 0;
}
.page-content .vertical-align-top * {
vertical-align: top;
}
.page-content .vertical-align-bottom * {
vertical-align: bottom;
}
/* Drowning Table No Border */
.drowning-table-no-border {
border: none;
}
/* Gadget description length */
.oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-top > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
.oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body {
max-width: unset;
}
/* Box at the top of all pages when the user has a new message on their User_talk: page */
.usermessage {
box-sizing: border-box;
border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
border-radius: var(--theme-box-border-radius);
backdrop-filter: var(--theme-box-back-backdrop-filter);
box-shadow: var(--theme-box-shadow);
background: var(--theme-box-background), var(--theme-box-back-background);
}
/***********************************************************************************************************
* interface layout and styles for widgets outside of content box
***********************************************************************************************************/
:root {
--layout-topbar-height: 35px; /* height of wiki.gg topbar */
--layout-sidebar-width: 196px; /* width of side navbar, without gap */
--layout-sidespace: 12px; /* whitespace width on most left and most right */
--layout-box-gap: 8px;
--layout-logo-scale: 1;
--layout-logo-width: calc(var(--theme-site-logo-width) * var(--layout-logo-scale));
--layout-logo-height: calc(var(--theme-site-logo-height) * var(--layout-logo-scale));
--layout-logo-box-height: calc(var(--layout-logo-height) + var(--layout-box-gap) * 2);
--dropdown-item-padding-x: 12px;
--dropdown-item-padding-y: 4px;
}
/**** Main Layout START ***********************************************************/
/**
* Note: wiki.gg topbar is position:fixed. So we don't need to consider it in grid layout
*/
html, body {
min-height: 100%;
}
html {
height: 100%;
scroll-padding-top: calc(var(--layout-topbar-height) + 10px);
}
body {
height: auto;
}
/*** main grid container ***/
body {
/* self */
box-sizing: border-box;
/* grid */
display: grid;
grid-template-columns: [body-left] var(--layout-sidespace) [aside-left] var(--layout-sidebar-width) [aside-right nav-left content-left footer-left] minmax(0, 1fr) [nav-right content-right footer-right] var(--layout-sidespace) [body-right];
grid-template-rows: [body-start] var(--layout-topbar-height) [page-start logo-start] var(--layout-logo-box-height) [logo-end nav-start aside-start] 0fr [nav-end content-start] auto [content-end footer-start] 0fr [footer-end] 1fr [aside-end page-end] 0fr [body-end];
gap: 0 var(--layout-box-gap);
}
/*** grid items ***/
/* Flatten DOM structure. Therefore we have following grid items under body grid container:
* div#mw-page-base, div#mw-head-base, #mw-navigation>h2, div#mw-head, div#mw-panel, div#content.mw-body, div#footer, footer.
*/
body > .content-wrapper,
#mw-navigation {
display: contents;
}
/** unused, hide them **/
#mw-head-base,
#mw-navigation > h2 {
display: none;
}
/** side nav bar **/
#mw-panel {
grid-column: aside-left/aside-right;
grid-row: aside-start/aside-end;
float: none;
width: unset;
padding: 0;
}
/** nav **/
#mw-head {
grid-column: nav-left/nav-right;
grid-row: nav-start/nav-end;
}
/** content **/
.mw-body {
grid-column: content-left/content-right;
grid-row: content-start/content-end;
}
/* For some page such as api.php, .mw-body is the only child, so take up all space. */
.mw-body:first-child {
grid-column: body-left/body-right;
grid-row: page-start/page-end;
}
/** #footer: content footer **/
#footer {
grid-column: footer-left/footer-right;
grid-row: footer-start/footer-end;
margin: 0;
z-index: 0;
}
/** used to gen box shadow for main box (nav + content + #footer) **/
#mw-page-base {
grid-column: content-left/content-right;
grid-row: nav-start/footer-end;
height: 100%;
}
/** wiki.gg footer bar **/
body > footer {
grid-column: body-left/body-right;
grid-row: page-end/body-end;
}
/*** logo block. It is absolute position ***/
#p-logo {
position: absolute;
width: 100%;
height: auto;
left: 0;
top: var(--layout-topbar-height);
background: var(--theme-site-logo-image) center center/var(--layout-logo-width) auto no-repeat;
margin-top: var(--layout-box-gap);
margin-bottom: 0.1em;
display: flex;
align-items: center;
justify-content: center;
filter: var(--theme-site-logo-filter);
}
/* use logo image as <a>'s background will sometime flicker when hovered on Firefox,
* I still don't know why, but move background to #p-logo can avoid this issue.
*/
#p-logo .mw-wiki-logo {
width: var(--layout-logo-width);
height: var(--layout-logo-height);
margin: auto;
background: none; /* logo flicker fix */
}
/**** Main Layout END ***********************************************************/
/********* side panel START *********/
#mw-panel {
--list-body-font-size: 14px;
--list-body-padding-x: 6px;
--list-body-padding-y: 3px;
}
#mw-panel a {
text-decoration: none;
}
/* section box */
#mw-panel .portal {
margin: 0 0 var(--layout-box-gap) 0;
padding: 0;
box-sizing: border-box;
border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
border-radius: var(--theme-box-border-radius);
backdrop-filter: var(--theme-box-back-backdrop-filter);
box-shadow: var(--theme-box-shadow);
background: var(--theme-box-background), var(--theme-box-back-background);
}
#mw-panel .portal .vector-menu-heading {
/* section heading */
background: none;
margin: 0;
padding: 6px 10px;
font-size: 16px;
line-height: 18px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
color: var(--theme-heading-color);
}
/* show the heading of first section */
#mw-panel #p-logo + .portal .vector-menu-heading {
display: flex;
}
/* arrow icon */
#mw-panel .portal .vector-menu-heading::after {
content: "";
display: block;
background: none;
width: 0;
height: 0;
border-style: solid;
border-color: #666 transparent;
border-width: 0 5px 6px;
margin-top: 2px;
flex: 0 0 auto;
}
#mw-panel .portal .vector-menu-heading:hover::after {
border-color: #666 transparent;
}
#mw-panel .portal.collapsed .vector-menu-heading::after {
transform: scaleY(-1);
}
/* list body */
#mw-panel .portal .body {
background: none;
border: 0;
padding: 0;
margin: 0;
border-top: var(--theme-border-width) solid var(--theme-border-color);
}
#mw-panel .portal .body ul {
padding: var(--theme-gap) 4px 4px;
}
#mw-panel .portal .body li {
margin: 0;
padding: 0;
font-size: var(--list-body-font-size);
line-height: inherit;
}
#mw-panel .portal .body li:hover {
background: var(--theme-highlight-background);
}
#mw-panel .portal .body li a {
display: block;
padding: var(--list-body-padding-y) var(--list-body-padding-x);
color: var(--theme-link-color);
}
#mw-panel .portal .body li a:visited {
color: var(--theme-link-color-visited);
}
#mw-panel .portal .body li a:hover {
color: var(--theme-link-color-hover);
}
/* "Atom" RSS Feed */
#mw-panel .portal .body li a.feedlink {
text-indent: calc(var(--list-body-font-size) + 2px);
background-position: var(--list-body-padding-x) center; /* align icon with other text */
}
/********* side panel END *********/
/********* main content box *********/
/****** navbar (#mw-head) ******/
/* reset */
#mw-head * {
float: unset;
font-size: unset;
line-height: unset;
}
/* tabs layout */
#mw-head {
--layout-padding: 12px;
--layout-gap: 6px;
--tab-padding-x: 12px;
--tab-padding-y: 5px;
--icon-size: 1em;
padding: var(--layout-padding) 0 0 0;
background: var(--theme-background);
position: relative;
display: flex;
justify-content: space-between;
align-items: stretch;
}
#mw-head #left-navigation, #mw-head #right-navigation {
float: none;
flex: 1 1 auto;
margin: 0;
display: flex;
align-items: flex-end;
}
#mw-head #left-navigation::before, #mw-head #left-navigation::after, #mw-head #right-navigation::before, #mw-head #right-navigation::after {
content: "";
display: block;
height: 100%;
border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
background: none;
}
#mw-head #left-navigation {
justify-content: flex-start;
}
#mw-head #right-navigation {
justify-content: flex-end;
}
#mw-head #left-navigation::before, #mw-head #right-navigation::after {
flex: 0 0 var(--layout-padding);
}
#mw-head #left-navigation::after, #mw-head #right-navigation::before {
flex: 1 1 auto;
}
/*** tabs of navbar ***/
/* reset */
#mw-head .vector-menu,
#mw-head .vector-menu * {
background: none;
}
/* tabs list */
#mw-head .vector-menu-tabs {
height: unset;
padding: unset;
}
#mw-head .vector-menu-tabs .vector-menu-content-list {
display: flex;
align-items: flex-end;
}
/* tab */
#mw-head {
--theme-tab-border-style: solid;
--theme-tab-border-width: 1px;
--theme-border-bottom-style: solid;
--theme-border-bottom-width: 1px;
--theme-border-bottom-color: var(--theme-tab-border-color-selected);
--theme-border-bottom-color-selected: transparent;
}
#mw-head .vector-menu-tabs .mw-list-item,
#mw-head .vector-menu-dropdown {
/* outer box */
background: var(--theme-tab-background);
border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
border-radius: var(--theme-box-border-radius);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
position: relative;
margin-right: var(--layout-gap); /* make space for gap */
}
#mw-head .vector-menu-tabs .mw-list-item::after,
#mw-head .vector-menu-dropdown::after {
/* gap */
content: "";
display: block;
width: var(--layout-gap);
height: 100%;
border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
position: absolute;
left: 100%;
bottom: calc(0px - var(--theme-border-bottom-width));
background: var(--theme-background-shadow);
}
#mw-head .vector-menu-tabs .mw-list-item a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
/* inner box */
height: auto;
margin: 0;
padding: var(--tab-padding-y) var(--tab-padding-x);
border: var(--theme-tab-border-width) var(--theme-tab-border-style) var(--theme-tab-border-color);
border-bottom: 0;
border-radius: var(--theme-box-border-radius);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
color: var(--theme-link-color);
background: var(--theme-background-shadow);
}
#mw-head .vector-menu-tabs .mw-list-item a:hover,
#mw-head .vector-menu-dropdown .vector-menu-heading:hover {
color: var(--theme-link-color-hover);
}
#mw-head .vector-menu-tabs .mw-list-item a.new,
#mw-head .vector-menu-dropdown .vector-menu-heading.new {
color: var(--theme-link-color-redlink);
}
#mw-head .vector-menu-tabs .mw-list-item.selected {
/* outer box: selected */
background: var(--theme-tab-background-selected);
border: var(--theme-tab-border-width) var(--theme-tab-border-style) var(--theme-tab-border-color-selected);
border-bottom: 0;
--theme-link-color: var(--theme-tab-color-selected);
--theme-link-color-hover: var(--theme-tab-color-selected-hover);
--theme-icon-color: var(--theme-tab-color-selected);
--theme-icon-color-hover: var(--theme-tab-color-selected-hover);
}
#mw-head .vector-menu-tabs .mw-list-item.selected:after {
/* gap */
bottom: 0;
padding-left: var(--theme-tab-border-width); /* x-position offset */
}
#mw-head .vector-menu-tabs .mw-list-item.selected a {
/* inner box: selected */
border: 0;
border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color-selected);
background: none;
color: var(--theme-tab-color-selected);
}
/* dropdown menu*/
#mw-head .vector-menu-dropdown .vector-menu-heading {
/* tab label */
position: relative;
display: flex;
align-items: center;
gap: 3px;
}
#mw-head .vector-menu-dropdown .vector-menu-heading::after {
/* arrow icon */
background: none;
opacity: unset;
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-color: var(--theme-icon-color) transparent;
border-width: 6px 5px 0;
margin-top: 2px;
}
#mw-head .vector-menu-dropdown:hover .vector-menu-heading::after {
/* .vector-menu-heading is covered by .vector-menu-checkbox, therefore we can't use .vector-menu-heading:hover::after */
border-color: var(--theme-icon-color-hover) transparent;
}
#mw-head .vector-menu-dropdown .vector-menu-content {
/* dropdown list body */
border: var(--theme-dropdown-border);
border-radius: var(--theme-box-border-radius);
background: var(--theme-dropdown-background);
backdrop-filter: var(--theme-dropdown-backdrop-filter);
border-top-left-radius: 0;
border-top-right-radius: 0;
left: 0; /* reset */
z-index: 10;
}
#mw-head .vector-menu-dropdown .vector-menu-content ul {
--theme-link-color: var(--theme-text-color);
--theme-link-color-visited: var(--theme-link-color);
--theme-link-color-hover: var(--theme-link-color);
padding: 4px;
}
#mw-head .vector-menu-dropdown .vector-menu-content li:hover {
background: var(--theme-highlight-background);
}
#mw-head .vector-menu-dropdown .vector-menu-content li a {
display: block;
padding: var(--dropdown-item-padding-y) var(--dropdown-item-padding-x);
text-decoration: none;
color: var(--theme-link-color);
}
#mw-head .vector-menu-dropdown .vector-menu-content li a:visited {
color: var(--theme-link-color-visited);
}
#mw-head .vector-menu-dropdown .vector-menu-content li a:hover {
color: var(--theme-link-color-hover);
}
/* watch/unwatch star */
#mw-head .vector-menu-tabs .mw-watchlink.icon a {
--theme-link-color-hover: var(--theme-icon-color-hover);
width: 1.5em; /* same as line height */
height: 1.5em;
box-sizing: content-box;
padding: var(--tab-padding-y);
color: transparent; /**<< for watch/unwatch, the text of <a> will be plain 'watch'/'unwatch' without <span> after clicking. **/
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a::before {
content: "";
display: block;
position: unset;
background-image: none;
width: var(--icon-size);
height: var(--icon-size);
margin: calc((1.5em - var(--icon-size)) / 2);
--mask: var(--icon) no-repeat;
-webkit-mask: var(--mask);
mask: var(--mask);
-webkit-mask-size: 100% 100%;
mask-size: 100% 100%;
-webkit-mask-position: center center;
mask-position: center center;
background-color: var(--wcw-accent-color-bright);
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a:hover::before {
background-color: var(--theme-icon-color-hover);
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a span {
display: none;
}
#mw-head .vector-menu-tabs .mw-watchlink.icon a::before {
transform-origin: 50% calc(var(--icon-size) / 2 * 1.125);
}
#mw-head .vector-menu-tabs #ca-watch.icon {
/* line star */
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M28.61,11.67H20l-2.66-8.2a1.39,1.39,0,0,0-2.64,0L12,11.67H3.39a1.39,1.39,0,0,0-.82,2.51l7,5.07L6.89,27.46a1.39,1.39,0,0,0,1.32,1.82A1.43,1.43,0,0,0,9,29l7-5.07L23,29a1.43,1.43,0,0,0,.81.27,1.39,1.39,0,0,0,1.32-1.82l-2.66-8.21,7-5.07A1.39,1.39,0,0,0,28.61,11.67Zm-7.34,6-1.17.86.44,1.38,2.09,6.41-5.45-4L16,21.46l-1.18.86-5.45,4,2.09-6.41.44-1.38-1.17-.86-5.45-4h8.19l.45-1.38L16,5.89l2.08,6.4.45,1.38h8.19Z'/%3E%3C/g%3E%3C/svg%3E");
}
#mw-head .vector-menu-tabs #ca-unwatch.icon {
/* solid star */
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M28.61,11.67H20l-2.66-8.2a1.39,1.39,0,0,0-2.64,0L12,11.67H3.39a1.39,1.39,0,0,0-.82,2.51l7,5.07L6.89,27.46a1.39,1.39,0,0,0,1.32,1.82A1.43,1.43,0,0,0,9,29l7-5.07L23,29a1.43,1.43,0,0,0,.81.27,1.39,1.39,0,0,0,1.32-1.82l-2.66-8.21,7-5.07A1.39,1.39,0,0,0,28.61,11.67Z'/%3E%3C/g%3E%3C/svg%3E");
}
/*** search form ***/
#mw-head #p-search {
/* navbar common border bottom */
border-bottom: var(--theme-border-bottom-width) var(--theme-border-bottom-style) var(--theme-border-bottom-color);
background: var(--theme-background-shadow);
margin: 0;
align-self: stretch;
}
#mw-head #p-search form {
margin: 0;
}
#mw-head #p-search .vector-search-box-inner {
border-width: 1px;
border-style: solid;
border-color: var(--theme-border-color);
border-radius: 2px;
}
#mw-head #p-search .vector-search-box-inner:hover {
border-color: var(--theme-border-color-hover);
}
#mw-head #p-search .vector-search-box-inner:focus-within {
border-color: var(--theme-border-color-focus);
box-shadow: var(--theme-shadow-focus);
}
#mw-head #p-search .vector-search-box-input {
border: 0;
color: var(--theme-text-color);
background: var(--theme-background);
box-shadow: var(--theme-shadow);
height: 26px;
padding: 0 26px 0 4px;
}
#mw-head #p-search .vector-search-box-input:focus {
outline: 0;
z-index: 1100; /* .suggestions: 1099 */
}
#mw-head #p-search .vector-search-box-input:focus ~ .searchButton {
z-index: 1101;
}
#mw-head #p-search .vector-search-box-input::placeholder {
color: var(--theme-text-color-note);
}
#mw-head #p-search .mw-searchButton {
opacity: 0;
}
#mw-head #p-search .searchButton {
width: 26px;
min-width: unset;
opacity: 1;
background-image: none;
--mask: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E search %3C/title%3E%3Cpath fill-rule='evenodd' d='M12.2 13.6a7 7 0 1 1 1.4-1.4l5.4 5.4-1.4 1.4-5.4-5.4zM13 8A5 5 0 1 1 3 8a5 5 0 0 1 10 0z'/%3E%3C/svg%3E%0A") no-repeat;
-webkit-mask: var(--mask);
mask: var(--mask);
-webkit-mask-size: 18px 18px;
mask-size: 18px 18px;
-webkit-mask-position: center center;
mask-position: center center;
background-color: var(--theme-link-color);
}
.theme-dark #simpleSearch .searchButton {
filter: invert(0);
}
#mw-head #p-search #searchform:hover .searchButton {
background-color: var(--theme-link-color-hover);
}
#mw-head #p-search .vector-search-box-input:focus ~ .searchButton {
background-color: var(--theme-link-color-focus);
}
/*** search result suggestions ***/
.suggestions {
background: var(--theme-background);
box-sizing: border-box;
margin-top: 0;
box-shadow: var(--theme-box-shadow);
backdrop-filter: var(--theme-box-back-backdrop-filter);
}
.suggestions .suggestions-results,
.suggestions .suggestions-special {
background: none;
}
.suggestions .suggestions-results {
border: 1px solid var(--theme-border-color);
border-top: 0;
border-bottom-color: var(--theme-rule-color);
}
.suggestions .suggestions-results:empty {
border-bottom: 0;
}
.suggestions .suggestions-result,
.suggestions .suggestions-special .special-label,
.suggestions .suggestions-special .special-query {
color: var(--theme-text-color);
}
.suggestions .suggestions-result {
padding: 1px 4px;
}
.suggestions .suggestions-special {
margin: 0;
padding: 2px 4px 4px;
border: 1px solid var(--theme-border-color);
border-top: 0;
border-radius: var(--theme-box-border-radius);
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.suggestions a.mw-searchSuggest-link,
.suggestions a.mw-searchSuggest-link:hover,
.suggestions a.mw-searchSuggest-link:active,
.suggestions a.mw-searchSuggest-link:focus {
color: var(--theme-link-color);
}
.suggestions .suggestions-result-current {
background: var(--theme-highlight-background);
color: var(--theme-link-color-hover);
}
.suggestions .suggestions-result-current .special-label, .suggestions .suggestions-result-current .special-query {
color: var(--theme-link-color-hover);
}
/**** main content box ****/
/* font */
.vector-body {
font-size: unset; /* reset */
line-height: 1.7142857143;
}
/** layout **/
#content {
color: var(--theme-text-color);
padding: 0;
display: flex;
flex-direction: column;
--theme-heading-rule-color-h1: var(--theme-border-color);
--theme-heading-rule-color-h2: var(--theme-border-color);
--layout-padding-x: 24px;
--layout-padding-y: 16px;
}
div#content {
border-color: var(--theme-accent-color);
}
.content-body {
flex: 1 1 auto;
}
.content-body > main {
align-self: stretch;
padding: var(--layout-padding-y) var(--layout-padding-x);
}
#bodyContent {
display: flex;
flex-direction: column;
position: unset;
}
/** main heading section **/
#firstHeading {
overflow: hidden; /* override mw internal css, fix scroll-x issue for narrow width */
border-bottom: 1px solid var(--theme-heading-rule-color-h2);
}
/** the " < rootpage < page " crumb **/
#contentSub, #contentSub2 {
margin: 0;
color: var(--theme-text-color-note);
font-size: 12px;
line-height: 20px;
}
#contentSub .subpages {
color: transparent;
line-height: 20px;
font-size: 0;
}
#contentSub .subpages a {
font-size: 12px;
vertical-align: middle;
display: inline-flex;
align-items: center;
padding-left: 4px;
}
#contentSub .subpages a::before {
content: "";
display: inline-block;
height: 4px;
width: 4px;
border-color: var(--theme-icon-color);
border-style: solid;
border-width: 0 0 2px 2px;
margin: 0 2px 0 0;
transform: rotate(45deg);
}
/** content body box **/
#mw-content-text {
flex: 1 1 auto;
}
/*** "category:" box ***/
#catlinks {
background: var(--theme-background);
border: 1px solid var(--theme-border-color);
border-radius: var(--theme-box-border-radius);
margin: var(--layout-padding-y) 0 0 0;
padding: 0.5em 1em;
}
/*** ads ***/
div.games-showcase-header {
margin: 0;
padding: var(--layout-padding-y) var(--layout-padding-x) 0;
}
div.games-showcase-footer {
margin: 0;
padding: 0 var(--layout-padding-x) var(--layout-padding-y);
}
.content-body > .games-showcase-sidebar {
margin: 0;
padding: var(--layout-padding-y) var(--layout-padding-x) 0 0;
}
.games-showcase-header img, .games-showcase-footer img {
height: 100%;
width: auto;
object-fit: contain;
}
@media screen and (max-width: 1100px) {
.games-showcase-header img, .games-showcase-footer img {
height: auto !important;
width: 100% !important;
object-fit: contain;
}
}
@media screen and (max-width: 926px) {
.games-showcase-header img, .games-showcase-footer img {
object-position: 50%;
height: 105px !important;
width: 100% !important;
}
}
aside.games-showcase-sidebar div.sidebar-showcase {
padding: 0 0 var(--layout-padding-y) 0;
}
/**** #footer (copyright info) ****/
#footer {
background: var(--theme-site-background);
padding: 16px 24px;
border-radius: 0 0 var(--theme-box-border-radius) var(--theme-box-border-radius);
position: relative;
/* grid */
display: grid;
grid-template-columns: [l] 1fr 0fr [r];
grid-template-rows: [t] auto auto [b];
z-index: 0; /* covered by content */
font-size: 12px;
}
.mw-footer li {
color: var(--theme-text-color);
}
#footer a {
color: var(--theme-link-color);
}
#footer a:hover {
color: var(--theme-link-color-hover);
}
#footer-info {
display: contents;
}
#footer ul li {
font-size: inherit;
line-height: 1.5;
padding: 0;
}
#footer-icons {
grid-column: span 1/r;
grid-row: t/b;
place-self: end;
}
#footer #footer-info-lastmod {
grid-column: l/span 1;
grid-row: t/span 1;
place-self: start;
margin-bottom: 1em;
}
#footer #footer-info-copyright {
grid-column: l/span 1;
grid-row: span 1/b;
place-self: end stretch;
position: relative;
padding-right: 100px;
}
#footer-info-copyright img {
position: absolute;
right: 0;
bottom: 0;
height: 31px;
width: auto;
}
#footer-places > * {
margin-top: 1em;
}
/**** background box for nav+content+#footer ****/
#mw-page-base {
box-sizing: border-box;
border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
border-radius: var(--theme-box-border-radius);
backdrop-filter: var(--theme-box-back-backdrop-filter);
box-shadow: var(--theme-box-shadow);
background: var(--theme-box-back-background);
z-index: -1;
}
#mw-head, #content, #footer {
box-sizing: border-box;
background-clip: padding-box;
border: var(--theme-box-border-width) solid transparent;
margin: 0;
}
#mw-head {
border-bottom-width: 0;
}
#content {
border: solid 1px var(--theme-border-color);
border-top-width: 0;
}
#footer {
border-top-width: 0;
}
/****** indicators ******/
.mw-indicators {
position: absolute;
right: 2rem;
margin-top: 5px;
}
/****** responsive Layout ******/
@media screen and (max-width: 1800px) {
:root {
--layout-sidespace: 0px; /* whitespace width on most left and most right,must with "px" */
}
} /* screen and (max-width: 1800px) */
@media screen and (min-width: 1366px) {
body {
grid-template-rows: [body-start] var(--layout-topbar-height) [page-start logo-start] 0px [logo-end nav-start aside-start] 0fr [nav-end content-start] auto [content-end footer-start] 0fr [footer-end] 1fr [aside-end page-end] 0fr [body-end];
}
#p-logo {
position: initial;
width: 100%;
height: auto;
}
#mw-panel .portal .vector-menu-heading::after, #mw-panel .portal #p-navigation-label.vector-menu-heading {
display: none;
}
#mw-panel.collapsible-nav .portal .vector-menu-content ul li {
padding: 0;
}
body.skin-vector #mw-panel {
position:fixed;
top:2.5em;
max-height:calc(100vh - 2.5em);
overflow-y:auto;
-ms-overflow-style:none;
scrollbar-width:none;
width: 14em;
}
#mw-panel .portal.vector-menu {
margin-left: 20px;
}
body.skin-vector #mw-panel::-webkit-scrollbar {
display:none
}
#mw-panel .portal .body li:hover {
background: none;
}
#mw-panel .portal .body li a:hover {
text-decoration: underline;
}
#mw-panel .portal .vector-menu-heading {
font-size: 14px;
}
#mw-panel .portal .body li {
font-size: 13px;
}
} /* screen and (min-width: 1366px) */
@media screen and (max-width: 1365px) {
:root {
--layout-logo-scale: 0.75;
--theme-site-logo-image: url(/images/f/f5/Site-logo-horizontal.png); /*** top site logo ***/
--theme-site-logo-width: calc(496px * 1.2);
--theme-site-logo-height: calc(108px * 1.5);
}
/* change layout */
body {
grid-template-columns: [body-left] 0 [aside-left nav-left content-left footer-left] minmax(0, 1fr) [content-right aside-right nav-right footer-right] 0 [body-right];
grid-template-rows: [body-start] var(--layout-topbar-height) [page-start logo-start] var(--layout-logo-box-height) [logo-end aside-start] auto [aside-end nav-start] 0fr [nav-end content-start] auto [content-end footer-start] 0fr [footer-end] 1fr [page-end] 0fr [body-end];
}
/* re-style navbar */
#mw-panel {
display: flex;
align-items: flex-end;
box-sizing: border-box;
border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
border-radius: var(--theme-box-border-radius);
backdrop-filter: var(--theme-box-back-backdrop-filter);
box-shadow: var(--theme-box-shadow);
background: var(--theme-box-background), var(--theme-box-back-background);
padding: 0 var(--layout-box-gap);
/* Make #p-logo be positioned relative to #mw-panel. By this way, we can safely apply filter/backdrop-filter on #mw-panel */
position: relative;
z-index: 8;
}
#mw-panel > div.portal:nth-last-child(1) {
margin-bottom: 0;
}
#mw-panel .portal {
background: none;
box-shadow: none;
border: 0;
margin: 0;
padding: 0;
position: relative;
}
div#mw-panel .vector-menu {
background-color: var(--theme-site-background);
}
#mw-panel .portal .vector-menu-heading {
margin: 0;
transform: unset;
padding: 9px 12px;
border: 0;
border-radius: 0;
background: none;
}
#mw-panel .portal .vector-menu-heading::after {
border-width: 6px 5px 0; /* change arrow direction */
margin-left: 4px;
}
#mw-panel.collapsible-nav .portal.collapsed .vector-menu-heading,
#mw-panel.collapsible-nav .portal .vector-menu-heading {
background-image: none;
}
#mw-panel .portal.collapsed .vector-menu-heading::after {
transform: none;
}
#mw-panel .portal .body {
display: none !important; /* !important is required, since there is inline-css from sidebar collapse/expand */
position: absolute;
left: 0;
top: 100%;
width: max-content;
min-width: 8em;
border: var(--theme-dropdown-border);
border-radius: var(--theme-box-border-radius);
background: var(--theme-dropdown-background);
border-top-left-radius: 0;
border-top-right-radius: 0;
}
#mw-panel .portal .body ul {
padding: 4px;
}
#mw-panel .portal .body li a {
padding: 6px 12px;
}
#mw-panel .portal.expanded .vector-menu-heading::after, #mw-panel .portal:hover .vector-menu-heading::after {
transform: scaleY(-1);
}
#mw-panel .portal.expanded .body, #mw-panel .portal:hover .body {
display: block !important;
}
#mw-panel.collapsible-nav .portal.first .vector-menu-heading { display: flex }
/* search: move to sidebar nav box ("main nav bar") */
#mw-head #p-search {
padding: var(--layout-padding);
border-bottom: 0;
position: absolute;
right: 0;
top: calc(-56px - var(--theme-box-border-width) * 2); /* offset */
z-index: 9;
}
.vector-search-box-inner {
width: 20em;
max-width: unset;
min-width: unset;
}
#mw-head #right-navigation #p-cactions {
margin-right: 0;
}
/* logo: smaller, and position relative to #mw-panel */
#p-logo {
background-size: calc(var(--theme-site-logo-width) * var(--layout-logo-scale)) auto;
top: calc(0px - var(--layout-logo-box-height));
}
#p-logo .mw-wiki-logo {
width: calc(var(--theme-site-logo-width) * var(--layout-logo-scale));
height: calc(var(--theme-site-logo-height) * var(--layout-logo-scale));
}
/* "more" menu in #right-navigation */
#mw-head #right-navigation .vector-menu-dropdown {
margin-right: 0;
}
#mw-head #right-navigation .vector-menu-dropdown::after {
display: none;
}
#mw-head #right-navigation .vector-menu-dropdown .vector-menu-content {
left: auto;
right: 0;
}
}
@media screen and (max-width: 961px) {
#p-logo {
top: calc(0px - var(--layout-logo-box-height));
}
#simpleSearch {
width: 100%;
max-width: none;
}
}
@media screen and (max-width: 900px) {
/* change layout */
body {
grid-template-columns: [body-left aside-left nav-left content-left footer-left] minmax(0, 1fr) [content-right aside-right nav-right footer-right body-right];
}
#mw-page-base,
#mw-panel,
#mw-head, #content, #footer {
border-radius: 0;
border-left: 0;
border-right: 0;
}
.mw-indicators {
z-index: auto;
}
/* re-style navbar */
#mw-panel {
flex-wrap: wrap;
}
#mw-panel .portal {
backdrop-filter: none;
position: unset;
flex: 0 0 auto;
}
#mw-panel .portal .vector-menu-heading {
justify-content: center;
white-space: nowrap;
}
#mw-panel .portal .body {
left: 0;
width: 100%;
padding: 12px;
box-sizing: border-box;
}
#mw-panel .portal .body ul {
display: grid;
grid-template-columns: repeat(auto-fit, var(--layout-sidebar-width));
justify-content: center;
}
#mw-panel .portal .body li a {
display: block;
}
} /* screen and (max-width:900px) */
@media screen and (max-width: 760px) {
:root {
--layout-logo-scale: 0.5;
}
#p-logo {
width: 100%;
left: 0;
}
#mw-panel {
box-shadow: var(--theme-box-shadow2);
display: block;
height: calc(36px + var(--theme-box-border-width) * 2);
}
#mw-panel .portal {
box-sizing: border-box;
display: none;
box-shadow: none;
background: var(--theme-background);
backdrop-filter: var(--theme-dropdown-backdrop-filter);
border-left: var(--theme-dropdown-border);
border-right: var(--theme-dropdown-border);
margin: 0;
border-radius: 0;
}
#mw-panel .portal .vector-menu-heading {
padding: 0 12px 4px;
border: 0;
display: block;
background: none;
}
#mw-panel .portal .vector-menu-heading::after {
display: none;
}
#mw-panel .portal:hover .vector-menu-heading {
background: none;
color: var(--theme-heading-color);
}
#mw-panel .portal .body {
display: block !important; /* !important is required, since there is inline-css from sidebar collapse/expand */
position: unset;
border: 0;
background: none;
backdrop-filter: none;
padding: 4px 12px;
}
#mw-panel .portal .body ul {
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: unset;
}
#mw-panel .portal .body li a {
padding: 4px 8px;
white-space: nowrap;
}
#mw-panel .portal:last-child {
padding-bottom: 12px;
border-bottom: var(--theme-dropdown-border);
border-radius: 0 0 var(--theme-box-border-radius) var(--theme-box-border-radius);
}
#mw-panel.collapsible-nav .portal.first .vector-menu-heading { display: none }
#mw-panel .menu-toggle {
--mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-category-2' width='24' height='24' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E%3Cpath d='M14 4h6v6h-6z'%3E%3C/path%3E%3Cpath d='M4 14h6v6h-6z'%3E%3C/path%3E%3Cpath d='M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0'%3E%3C/path%3E%3Cpath d='M7 7m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0'%3E%3C/path%3E%3C/svg%3E") no-repeat;
-webkit-mask: var(--mask);
mask: var(--mask);
-webkit-mask-size: 100% 100%;
mask-size: 100% 100%;
-webkit-mask-position: center center;
mask-position: center center;
background-color: var(--theme-icon-color);
cursor: pointer;
display: block;
flex: 0 0 auto;
width: 24px;
height: 24px;
margin: 5px 12px;
}
#mw-panel .menu-toggle.expanded ~ .portal {
display: block;
}
#mw-panel .menu-toggle + .portal {
padding-top: 12px;
border-top: var(--theme-dropdown-border);
}
#mw-head #p-search {
box-shadow: none;
padding: 0;
top: calc(-44px - var(--theme-box-border-width) * 2); /* offset */
left: auto;
right: 12px;
width: auto;
z-index: 9;
width: calc(100% - 6em);
}
.vector-search-box-inner {
width: 100vw;
max-width: 20em;
}
#content {
--layout-padding-x: 12px;
--layout-padding-y: 12px;
}
/* icon navbar tabs */
#mw-head {
top: unset; /* reset */
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg fill='none' height='24' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h24v24H0z' fill='none' stroke='none'/%3E%3Cpath d='M4 4l4 16l4 -14l4 14l4 -16'/%3E%3C/svg%3E");
--icon-size: 1.5em;
}
#mw-head .vector-menu-tabs .mw-list-item a,
#mw-head .vector-menu-dropdown .vector-menu-heading {
--theme-link-color-hover: var(--theme-icon-color-hover);
width: 1.5em; /* same as line height */
height: 1.5em;
box-sizing: content-box;
padding: var(--tab-padding-y);
color: transparent; /**<< for watch/unwatch, the text of <a> will be plain 'watch'/'unwatch' without <span> after clicking. **/
}
#mw-head .vector-menu-tabs .mw-list-item a::before,
#mw-head .vector-menu-dropdown .vector-menu-heading::before {
content: "";
display: block;
position: unset;
background-image: none;
width: var(--icon-size);
height: var(--icon-size);
margin: calc((1.5em - var(--icon-size)) / 2);
--mask: var(--icon) no-repeat;
-webkit-mask: var(--mask);
mask: var(--mask);
-webkit-mask-size: 100% 100%;
mask-size: 100% 100%;
-webkit-mask-position: center center;
mask-position: center center;
background-color: var(--theme-icon-color);
}
#mw-head .vector-menu-tabs .mw-list-item a:hover::before,
#mw-head .vector-menu-dropdown .vector-menu-heading:hover::before {
background-color: var(--theme-icon-color-hover);
}
#mw-head .vector-menu-tabs .mw-list-item a span,
#mw-head .vector-menu-dropdown .vector-menu-heading span {
display: none;
}
#mw-head .vector-menu-dropdown .vector-menu-heading::after {
display: none;
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#ca-edit {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M29.12,6.05,26,2.88a3,3,0,0,0-4.24,0L6.29,18.29a3.06,3.06,0,0,0-.72,1.18L2.08,29.92l10.46-3.49a3.15,3.15,0,0,0,1.17-.72L29.12,10.29a3,3,0,0,0,0-4.24Zm-21,13.28,8.75-8.74,1.58,1.58L9.67,20.92ZM18.24,9.17l1.59-1.58,4.58,4.58-1.58,1.59ZM7.1,21.19l3.72,3.71L5.25,26.75Zm5.57,2.73-1.59-1.59,8.75-8.74,1.58,1.58Zm15-15-1.88,1.88L21.24,6.17l1.88-1.88A1,1,0,0,1,23.83,4a1,1,0,0,1,.71.29l3.17,3.18a1,1,0,0,1,.29.7A1,1,0,0,1,27.71,8.88Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#ca-view,
#ca-view-foreign {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M30.89,15.54A17,17,0,0,0,16,6,17,17,0,0,0,1.11,15.54L.87,16l.24.46A17,17,0,0,0,16,26a17,17,0,0,0,14.89-9.54l.24-.46ZM24,16a8,8,0,1,1-8-8A8,8,0,0,1,24,16ZM3.14,16a16.47,16.47,0,0,1,4.14-4.89,10,10,0,0,0,0,9.78A16.47,16.47,0,0,1,3.14,16Zm21.58,4.89a10,10,0,0,0,0-9.78A16.47,16.47,0,0,1,28.86,16,16.47,16.47,0,0,1,24.72,20.89Z'/%3E%3Cpath d='M16,20a4,4,0,1,0-4-4A4,4,0,0,0,16,20Zm0-6a2,2,0,1,1-2,2A2,2,0,0,1,16,14Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#left-navigation li[id^=ca-nstab-] {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpolygon points='12 15 11 15 11 17 12 17 20 17 21 17 21 15 20 15 12 15'/%3E%3Cpolygon points='12 19 11 19 11 21 12 21 15 21 16 21 16 19 15 19 12 19'/%3E%3Cpath d='M20.41,3H5V26a3,3,0,0,0,3,3H24a3,3,0,0,0,3-3V9.59ZM20,5.41,24.59,10H21a1,1,0,0,1-1-1ZM24,27H8a1,1,0,0,1-1-1V5H18V9a3,3,0,0,0,3,3h4V26A1,1,0,0,1,24,27Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#ca-history {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M16,2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Zm0,26A12,12,0,1,1,28,16,12,12,0,0,1,16,28Z'/%3E%3Cpath d='M17,7H15v8.52a2,2,0,0,0,.75,1.56l4.63,3.7,1.24-1.56L17,15.52Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#ca-talk {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M26,12H24V6a3,3,0,0,0-3-3H6A3,3,0,0,0,3,6V24.41l5.12-5.12A1.05,1.05,0,0,1,8.83,19H12v3a3,3,0,0,0,3,3h8.17a1.05,1.05,0,0,1,.71.29L29,30.41V15A3,3,0,0,0,26,12ZM12,15v2H8.83a3,3,0,0,0-2.12.88L5,19.59V6A1,1,0,0,1,6,5H21a1,1,0,0,1,1,1v6H15A3,3,0,0,0,12,15ZM27,25.59l-1.71-1.71A3,3,0,0,0,23.17,23H15a1,1,0,0,1-1-1V15a1,1,0,0,1,1-1H26a1,1,0,0,1,1,1Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://www.svgviewer.dev/s/434200/outlined-paper-doc */
#t-contributions {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg enable-background='new 0 0 32 32' id='Stock_cut' version='1.1' viewBox='0 0 32 32' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdesc/%3E%3Cpath d='M27,12V5h-7v0 c0-2.209-1.791-4-4-4h0c-2.209,0-4,1.791-4,4v0H1v7h0c2.209,0,4,1.791,4,4v0c0,2.209-1.791,4-4,4h0v11h11v0c0-2.209,1.791-4,4-4h0 c2.209,0,4,1.791,4,4v0h7V20h0c2.209,0,4-1.791,4-4v0C31,13.791,29.209,12,27,12L27,12z' fill='none' stroke='%23000000' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='2'/%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#ca-addsection {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpolygon points='29 15 17 15 17 3 15 3 15 15 3 15 3 17 15 17 15 28 17 28 17 17 29 17 29 15'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://github.com/sschoger/heroicons-ui/ */
#ca-viewsource {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath class='heroicon-ui' d='M20.59 12l-3.3-3.3a1 1 0 1 1 1.42-1.4l4 4a1 1 0 0 1 0 1.4l-4 4a1 1 0 0 1-1.42-1.4l3.3-3.3zM3.4 12l3.3 3.3a1 1 0 0 1-1.42 1.4l-4-4a1 1 0 0 1 0-1.4l4-4a1 1 0 0 1 1.42 1.4L3.4 12zm7.56 8.24a1 1 0 0 1-1.94-.48l4-16a1 1 0 1 1 1.94.48l-4 16z'/%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#p-variants {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M16,2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Zm8,13a24.28,24.28,0,0,0-.41-3.62c2.19.91,3.75,2.19,4.25,3.62Zm-2,0H17V10a20.9,20.9,0,0,1,4.34.63A20.26,20.26,0,0,1,22,15ZM17,8V4.19c1.43.5,2.71,2.06,3.62,4.25A24.28,24.28,0,0,0,17,8ZM15,4.19V8a24.28,24.28,0,0,0-3.62.41C12.29,6.25,13.57,4.69,15,4.19ZM15,10v5H10a20.26,20.26,0,0,1,.63-4.34A20.9,20.9,0,0,1,15,10ZM8,15H4.19c.5-1.43,2.06-2.71,4.25-3.62A24.28,24.28,0,0,0,8,15Zm0,2a24.28,24.28,0,0,0,.41,3.62C6.25,19.71,4.69,18.43,4.19,17Zm2,0h5v5a20.9,20.9,0,0,1-4.34-.63A20.26,20.26,0,0,1,10,17Zm5,7v3.84c-1.43-.5-2.71-2.06-3.62-4.25A24.28,24.28,0,0,0,15,24Zm2,3.84V24a24.28,24.28,0,0,0,3.62-.41C19.71,25.75,18.43,27.31,17,27.81ZM17,22V17h5a20.26,20.26,0,0,1-.63,4.34A20.9,20.9,0,0,1,17,22Zm7-5h3.84c-.5,1.43-2.06,2.71-4.25,3.62A24.28,24.28,0,0,0,24,17Zm2.87-6.12A15.11,15.11,0,0,0,23,9a15.11,15.11,0,0,0-1.85-3.87A12.12,12.12,0,0,1,26.84,10.88Zm-16-5.72A15.11,15.11,0,0,0,9,9a15.11,15.11,0,0,0-3.87,1.85A12.12,12.12,0,0,1,10.88,5.16Zm-5.72,16A15.11,15.11,0,0,0,9,23a15.11,15.11,0,0,0,1.85,3.87A12.12,12.12,0,0,1,5.16,21.12Zm16,5.72A15.11,15.11,0,0,0,23,23a15.11,15.11,0,0,0,3.87-1.85A12.12,12.12,0,0,1,21.12,26.84Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* https://www.iconfinder.com/iconsets/core-ui-outlined */
#p-cactions {
--icon: url("data:image/svg+xml,%3C%3Fxml version='1.0' %3F%3E%3Csvg id='Outlined' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle/%3E%3Cg id='Fill'%3E%3Cpath d='M16,13a3,3,0,1,0,3,3A3,3,0,0,0,16,13Zm0,4a1,1,0,1,1,1-1A1,1,0,0,1,16,17Z'/%3E%3Cpath d='M24,13a3,3,0,1,0,3,3A3,3,0,0,0,24,13Zm0,4a1,1,0,1,1,1-1A1,1,0,0,1,24,17Z'/%3E%3Cpath d='M8,13a3,3,0,1,0,3,3A3,3,0,0,0,8,13Zm0,4a1,1,0,1,1,1-1A1,1,0,0,1,8,17Z'/%3E%3C/g%3E%3C/svg%3E");
}
/* Fix elements overlaying the mobile nav */
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend, #wikiEditor-ui-toolbar { z-index: unset; }
} /* screen and (max-width:720px) */
@media screen and (max-width: 600px) {
:root {
--layout-logo-scale: 0.5;
}
.vector-search-box-inner {
width: 50vw;
max-width: 15em;
}
/* footer */
#footer #footer-icons {
float: none;
}
#footer #footer-info-copyright {
grid-column: l/span 2;
padding-right: 0;
padding-bottom: 40px;
}
#footer #footer-info-copyright img {
right: auto;
left: 0;
}
} /* screen and (max-width:600px) */
@media screen and (max-width: 450px) {
} /* screen and (max-width:450px) */
/***** Notification area *****/
.mw-notification-area-overlay {
position: fixed;
z-index: 9999;
}
.mw-notification-area {
font-size: 14px;
line-height: 1.7142857143;
}
.mw-notification {
color: var(--theme-text-color);
box-sizing: border-box;
border: var(--theme-box-border-width) var(--theme-box-border-style) var(--theme-box-border-color);
border-radius: var(--theme-box-border-radius);
backdrop-filter: var(--theme-box-back-backdrop-filter);
box-shadow: var(--theme-box-shadow);
background: var(--theme-box-background), var(--theme-box-back-background);
transform: none;
}
/* Notification boxes on the right, e.g. after patrolling an edit */
.mw-notification.mw-notification-type-error {
color: var(--theme-notice-red-text-color);
border-color: var(--theme-notice-red-text-color);
}
.mw-notification.mw-notification-type-warn {
color: var(--theme-notice-orange-text-color);
border-color: var(--theme-notice-orange-text-color);
}
/****** postedit notification ******/
.postedit-container {
top: 4em;
}
.mw-dismissable-notice {
position: fixed;
left: 2em;
right: 2em;
bottom: 4em;
background: var(--theme-background);
max-width: 500px;
min-height: 80px;
padding: 12px 8px;
box-sizing: border-box;
text-align: left;
border: 1px solid var(--theme-border-color-accent);
border-left-width: 8px;
backdrop-filter: var(--theme-box-back-backdrop-filter);
box-shadow: 0 0 10px rgba(127, 127, 127, 0.3);
}
.mw-dismissable-notice .mw-dismissable-notice-close {
font-size: 11px;
}
.mw-dismissable-notice .mw-dismissable-notice-body {
margin: 0px 40px 0px 24px;
font-size: 14px;
}
.mw-dismissable-notice #localNotice {
margin: 0;
}
/***********************************************************************************************************
* Over-width table floating-scroll
***********************************************************************************************************/
/*
css for floating-scroll v3.2.0
https://amphiluke.github.io/floating-scroll/
(c) 2022 Amphiluke
*/
.fl-scrolls {
overflow: auto;
position: fixed;
}
.fl-scrolls div {
overflow: hidden;
pointer-events: none;
}
.fl-scrolls div:before {
content: " ";
}
.fl-scrolls, .fl-scrolls div {
font-size: 1px;
line-height: 0;
margin: 0;
padding: 0;
}
.fl-scrolls-hidden div:before {
content: " ";
}
.fl-scrolls-viewport {
position: relative;
}
.fl-scrolls-body {
overflow: auto;
}
.fl-scrolls-viewport .fl-scrolls {
position: absolute;
}
.fl-scrolls-hoverable .fl-scrolls {
opacity: 0;
transition: opacity 0.5s 0.3s;
}
.fl-scrolls-hoverable:hover .fl-scrolls {
opacity: 1;
}
.fl-scrolls:not([data-orientation]), .fl-scrolls[data-orientation=horizontal] {
bottom: 0;
min-height: 17px;
}
.fl-scrolls:not([data-orientation]) div, .fl-scrolls[data-orientation=horizontal] div {
height: 1px;
}
.fl-scrolls-hidden.fl-scrolls:not([data-orientation]), .fl-scrolls-hidden.fl-scrolls[data-orientation=horizontal] {
bottom: 9999px;
}
.fl-scrolls-viewport .fl-scrolls:not([data-orientation]), .fl-scrolls-viewport .fl-scrolls[data-orientation=horizontal] {
left: 0;
}
.fl-scrolls[data-orientation=vertical] {
right: 0;
min-width: 17px;
}
.fl-scrolls[data-orientation=vertical] div {
width: 1px;
}
.fl-scrolls-hidden.fl-scrolls[data-orientation=vertical] {
right: 9999px;
}
.fl-scrolls-viewport .fl-scrolls[data-orientation=vertical] {
top: 0;
}
/*css for wide table */
.table-wide {
clear: both;
position: relative;
}
.mw-parser-output > .table-width {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.table-wide-inner {
overflow-x: auto;
}
.table-wide-inner > table {
margin: 0 !important;
}
.table-wide:before {
box-shadow: inset -15px 0 20px -15px var(--theme-wide-table-shadow-color);
content: "";
display: block;
width: 20px;
height: 100%;
pointer-events: none;
position: absolute;
right: 0;
}
/***********************************************************************************************************
* Styles for "real" wiki page content. (in div.mw-parser-output)
***********************************************************************************************************/
/* external link icon. */
.link-https {
padding-right: 0;
background: none;
}
/* custom icon color*/
.mw-parser-output a.external {
background-position:center right;
background-repeat:no-repeat;
background-image:url(https://commons.wiki.gg/images/2/25/External.svg);
background-size:10px;
padding-right:13px
}
.mw-parser-output > :first-child {
margin-top: 0;
}
/** headings **/
.mw-body h1, .mw-body-content h1, .mw-body-content h2,
.vector-body h3, .vector-body h4,
.vector-body h5, .vector-body h6 {/*
margin: 0;
color: var(--theme-heading-color);*/
font-family: var(--theme-heading-font-face, sans-serif);/*
line-height: var(--theme-heading-line-height, 1.25);
font-weight: var(--theme-heading-font-weight, normal);*/
}/*
.mw-body h1, .mw-body-content h1 {
font-size: var(--theme-heading-font-size-h1, 32px);
line-height: var(--theme-heading-line-height-h1, 40px);
font-weight: var(--theme-heading-font-weight-h1, var(--theme-heading-font-weight, normal));
}*/
.mw-body-content h2 {/*
font-size: var(--theme-heading-font-size-h2, 24px);
line-height: var(--theme-heading-line-height-h2, 30px);
font-weight: var(--theme-heading-font-weight-h2, var(--theme-heading-font-weight, normal));
margin-top: 18px;
margin-bottom: 9px;*/
border-bottom: 1px solid var(--theme-heading-rule-color-h2);/*
padding-bottom: 3px;*/
}
/*.vector-body h3 {
font-size: var(--theme-heading-font-size-h3, 20px);
line-height: var(--theme-heading-line-height-h3, 26px);
font-weight: var(--theme-heading-font-weight-h3, var(--theme-heading-font-weight, normal));
margin-top: 14px;
margin-bottom: 7px;
}
.vector-body h4 {
font-size: var(--theme-heading-font-size-h4, 16px);
line-height: var(--theme-heading-line-height-h4, 22px);
font-weight: var(--theme-heading-font-weight-h4, var(--theme-heading-font-weight, normal));
margin-top: 14px;
margin-bottom: 7px;
}
.vector-body h5 {
font-size: var(--theme-heading-font-size-h5, 14px);
line-height: var(--theme-heading-line-height-h5, 22px);
font-weight: var(--theme-heading-font-weight-h5, bold);
margin-top: 10px;
margin-bottom: 7px;
}
.vector-body h6 {
font-size: var(--theme-heading-font-size-h6, 12px);
line-height: var(--theme-heading-line-height-h6, 20px);
font-weight: var(--theme-heading-font-weight-h1, bold);
margin-top: 7px;
margin-bottom: 7px;
}*/
/* reduce heading font size: */
@media (max-width: 900px) {
.mw-body h1, .mw-body-content h1 {
font-size: 24px;
line-height: 32px;
}
.mw-body-content h2 {
font-size: 20px;
line-height: 28px;
}
.vector-body h3 {
font-size: 18px;
line-height: 24px;
}
}
/* section edit link */
.mw-editsection {
white-space: nowrap;
color: var(--theme-text-color-note);
}
/***********************************************************************************************************
* common style for content box
***********************************************************************************************************/
.fullwidth, .full-width {
width: 100%;
}
.nowrap {
white-space: nowrap;
}
/* ".center" has width=100% rule, we don't want it, so use a different class name. */
.aligncenter,
.align-center {
text-align: center;
}
.alignleft,
.align-left {
text-align: left;
}
.alignright,
.align-right {
text-align: right;
}
/* clear fix for float block */
.clearfix {
*zoom: 1;
}
.clearfix::before,
.clearfix::after {
content: " ";
display: table;
}
.clearfix::after {
clear: both;
}
/***********************************************************************************************************
* css for pages under MediaWiki or Special NS, or system widgets on template/module pages and so on
***********************************************************************************************************/
/********* ooui *********/
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined,
.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
background: none;
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
color: var(--theme-text-color);
}
.oo-ui-tabOptionWidget {
color: var(--theme-text-color);
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
color: var(--theme-text-color);
background: none;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
color: var(--theme-text-color-note);
}
.oo-ui-tabSelectWidget-framed {
background: none;
}
/********* for File: NS pages *********/
#filetoc {
background: none;
}
/******* Search result page. (Special:Search) ******/
.mw-search-form-wrapper {
font-size: 1em;
}
.mw-search-form-wrapper #mw-search-top-table {
display: flex;
align-items: center;
}
.mw-search-form-wrapper #mw-search-top-table > div {
float: none;
}
.mw-search-form-wrapper .results-info {
color: var(--theme-text-color-note);
font-size: 1em;
padding: 0 0 0 3em;
white-space: nowrap;
text-align: right;
flex: 1 1 auto;
}
.mw-search-form-wrapper .mw-search-visualclear {
display: none;
}
.mw-search-form-wrapper .mw-search-profile-tabs {
border: 0;
margin: 1em 0;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types + div {
display: none;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types {
width: 100%;
float: none;
padding: 0;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li {
float: none;
display: inline-block;
vertical-align: middle;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li.current {
background:var(--theme-border-color);
border-radius: 2px;
overflow: hidden;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li.current:nth-child(1) {
border-radius: 0 2px 2px 0;
}
.mw-search-form-wrapper #mw-searchoptions {
padding: 1em;
background: var(--theme-box-background);
border: 1px solid var(--theme-border-color-accent);
border-radius: 4px;
}
/* responsive tweak */
@media screen and (max-width: 600px) {
.mw-search-form-wrapper #mw-search-top-table {
display: block;
}
.mw-search-form-wrapper .results-info {
margin-top: 1em;
}
.mw-search-form-wrapper .mw-search-profile-tabs .search-types ul li {
font-size: 12px;
}
}
/***********************************************************************************************************
* ACTUAL SITE CSS
* WARCRAFT WIKI - Templates, in-content fixes, etc.
***********************************************************************************************************/
/* Tabber fix */
.tabber__section .tabber__panel[aria-hidden="true"] {
display: none;
}
/* Align inline images to text */
p img { vertical-align: text-bottom; }
/* Mainly targets the pre near the top on most WoW API articles */
.mw-parser-output > p:first-of-type + pre {
white-space: pre-wrap;
}
/* Redirects */
.redirectText { font-size: 140%; }
/* Notifications */
.mw-notification {
background-color: var(--theme-background-color--secondary);
border-color: var(--theme-border-color);
color: var(--theme-text-color);
}
/* Notification positioning is awkward in combination with the top bar */
#mw-notification-area { top: 5em; right: 10px; }
.mw-notification { font-size: 0.90em; }
/* Discord */
#mw-panel #n-Discord a {
background: url(https://discordapp.com/api/guilds/572810203238629387/embed.png) no-repeat;
color: transparent !important;
display: inline-block;
height: 20px;
width: 119px;
margin-top: 5px;
}
/* Make left nav go under wikigg footer, add empty space at end to compensate */
#wikigg-footer { z-index:1; }
#mw-panel > div:nth-last-child(1) { margin-bottom:2.5em; }
/* --- SMALLER TEMPLATES USED TEXT --- */
.templatesUsed ul { font-size:90%; }
/* --- [[SPECIAL:ALLPAGES]], CATEGORY REDIRECT TWEAKS --- */
.redirect-in-category, .allpagesredirect { font-style: italic; }
.allpagesredirect:after { color: var(--theme-text-color-note); content: " (redirect)"}
/* --- REFERENCE STYLES --- */
/* make the list of references look smaller */
ol.references { font-size: 100%; }
.references-small { font-size: 90%;}
.references-2column {
font-size: 90%;
-moz-column-count:2;
column-count:2;
}
.same-bg { background: none; }
/* --- YOU HAVE NEW MESSAGES BAR --- */
/* prettified */
.usermessage, .usermessage plainlinks {
border: 2px solid #ee8500;
margin: 0.5em 0em 0.5em 0em;
padding: 0.5em;
vertical-align: middle;
}
/* --- TAB STYLES --- */
/* for "edit this page" tab and "discussion" tab etc */
.tab {
border-style: none solid solid;
border-width: thin;
border-color: var(--wcw-accent-color);
padding:0ex 1ex 0.5ex;
border-image:linear-gradient(to top,var(--wcw-accent-color),rgba(0,0,0,0)) 1 20%;
}
/* --- OTHER TWEAKS --- */
/* background for transparent images when viewed directly */
#file img, .filehistory a img, .mw-mmv-image img.gif, .mw-mmv-image img.png, .mw-mmv-image img.svg, .mw-mmv-image img.tiff, .mw-mmv-image img.tif { background: transparent url(/images/3/34/Wwchecker.svg) repeat scroll 0% 0%; }
/* Prevents line breaks in links, used for navboxes */
.nowraplinks a, .nobreak { white-space: nowrap; }
/**** TEMPLATES ****/
.mobileonly { display: none; }
/* --- NAVFRAME STUFF --- */
/* Standard Navigationsleisten, aka box hiding thingy from .de. */
/* Documentation at [[wikipedia:Wikipedia:NavFrame]]. */
div.Boxmerge,
div.NavFrame {
margin: 0px;
padding: 4px;
border: 1px solid #aaa;
text-align: center;
border-collapse: collapse;
font-size: 95%;
}
div.Boxmerge div.NavFrame {
border-style: none;
border-style: hidden;
}
div.NavFrame + div.NavFrame {
border-top-style: none;
border-top-style: hidden;
}
div.NavPic {
background-color: #fff;
margin: 0px;
padding: 2px;
float: left;
}
div.NavFrame div.NavHead {
height: 1.6em;
font-weight: bold;
background-color: var(--navbox-title-color);
position:relative;
}
div.NavFrame p {
font-size: 100%;
}
div.NavFrame div.NavContent {
font-size: 100%;
}
div.NavFrame div.NavContent p {
font-size: 100%;
}
div.NavEnd {
margin: 0px;
padding: 0px;
line-height: 1px;
clear: both;
}
a.NavToggle {
position:absolute;
top:0px;
right:3px;
font-weight:normal;
font-size:smaller;
}
/* --- TOOLTIP --- */
/* WoW Style Tooltip */
.wtooltip {
width: 18em;
min-width: 15em;
padding: 0.3em;
margin: 5px;
background-color: #101010;
border: 1px solid #b0b0b0;
border-radius: 0.75ex;
text-align: left;
}
.wtooltip ul { margin: 0; padding: 0; list-style: none; list-style-type: none; list-style-image: none; }
.wtooltip, .wtooltip li, .wtooltip li > a, .wtooltip li > a:visited, .wtooltip li > a:hover { color: #f0f0f0; }
.wtooltip .outericon { position: absolute; left: -38px; top: 0; }
/*.page__main .wtooltip a, .page__main .wtooltip a { font-weight: inherit; }*/
.wtooltip a:visited, .tooltip-content a:visited { color: inherit; }
/* itemtooltip and others MUST be used in conjunction with wtooltip */
.itemtooltip { width: fit-content; max-width: 22em; margin-top: 0; }
.proftip { width: 22em; }
.htt .tooltip-content ul { margin: 0; padding: 0; list-style: none; list-style-type: none; list-style-image: none; }
.htt .tooltip-content, .tooltip-content a, .htt .tooltip-content li, .htt .tooltip-content li > a { color: #f0f0f0; }
.htt > .tooltip-content { clear: both; }
li.socket, li.socket a, li.socket a:visited, .htt .tooltip-content li.socket, .htt .tooltip-content li.socket a, .htt .tooltip-content li.socket a:visited { color: #999; }
li.glyph, li.glyph a, li.glyph a:visited, .htt .tooltip-content li.glyph, .htt .tooltip-content li.glyph a, .htt .tooltip-content li.glyph a:visited, .wtooltip .tag, .itemtooltip .tag, .itemtooltip .tag.blue, .itemtooltip .tag.blue a { color: #71d5ff; } /* 66bbff */
.wtooltip .tag.heroic, .itemtooltip .tag.heroic, .itemtooltip .tag.heroic a, .itemtooltip .tag.green, .itemtooltip .tag.green a { color: #00ff00; } /* Heroic, Mythic, Timewarped, etc. */
.wtooltip .tag.supplies, .itemtooltip .tag.supplies, .itemtooltip .tag.supplies a { color: #88AAFF; } /* Ember Court, Queen's Conservatory, Korthian Relics, Dragon Isles Supplies */
.wtooltip .tag.ascended, .itemtooltip .tag.ascended, .itemtooltip .tag.ascended a { color: #37b2ff; } /* Ascended Crafting */
.wtooltip .tag.module, .itemtooltip .tag.module, .itemtooltip .tag.module a { color: #ff8040; } /* Tinker Module */
.wtooltip .tag.stone, .itemtooltip .tag.stone, .itemtooltip .tag.stone a { color: #ffab00; } /* Primordial Stone */
.wtooltip .tag.frost, .itemtooltip .tag.frost, .itemtooltip .tag.frost a { color: #1C90E1; } /* Frost gems */
.wtooltip .tag.air, .itemtooltip .tag.air, .itemtooltip .tag.air a { color: #d9fcff; } /* Air gems */
.wtooltip .tag.fire, .itemtooltip .tag.fire, .itemtooltip .tag.fire a { color: #F95B19; } /* Fire gems */
.wtooltip .tag.earth, .itemtooltip .tag.earth, .itemtooltip .tag.earth a { color: #805B4D; } /* Earth gems */
.wtooltip .tag.toxic, .itemtooltip .tag.toxic, .itemtooltip .tag.toxic a { color: #9EC51E; } /* toxic potions, e.g. Phial of Icy Preservation */
.wtooltip .tag.shadowflame, .itemtooltip .tag.shadowflame, .itemtooltip .tag.shadowflame a { color: #d642a6; } /* Shadowflame Suffused, e.g. Rashon, the Immortal Blaze */
li.relic, li.relic a, li.relic a:visited, .htt .tooltip-content li.relic, .htt .tooltip-content li.relic a, .htt .tooltip-content li.relic a:visited { color:#BFA760; }
li.req, li.req a, li.req a:visited, .htt .tooltip-content li.req, .htt .tooltip-content li.req a, .htt .tooltip-content li.req a:visited { color: #999;}
li.locked, li.locked a, li.locked a:visited, .htt .tooltip-content li.locked, .htt .tooltip-content li.locked a, .htt .tooltip-content li.locked a:visited { color: #d22; }
li.bonus, li.bonus a, li.bonus a:visited, .htt .tooltip-content li.bonus, .htt .tooltip-content li.bonus a, .htt .tooltip-content li.bonus a:visited { color: #0f0; }
li.flavor, li.flavor a, li.flavor a:visited, li.flavor a:hover, .htt .tooltip-content li.flavor, .htt .tooltip-content li.flavor a, .htt .tooltip-content li.flavor a:visited, .wtooltip li.description, .wtooltip li.description a, .wtooltip li.description a:visited, .text-flavor { color: #ffd517; }
li.detail, li.detail a, li.detail a:visited, .htt .tooltip-content li.detail, .htt .tooltip-content li.detail a, .htt .tooltip-content li.detail a:visited { color: #66c; }
li.set, li.set a, li.set a:visited, li.set a:hover, .htt .tooltip-content li.set, .htt .tooltip-content li.set a, .htt .tooltip-content li.set a:visited { color: #ffd100; }
li.setbonus, li.setbonus a, li.setbonus a:visited, .htt .tooltip-content li.setbonus, .htt .tooltip-content li.setbonus a, .htt .tooltip-content li.setbonus a:visited { color: #999; }
li.corruption, li.corruption a, li.corruption a:visited, .htt .tooltip-content li.corruption, .htt .tooltip-content li.corruption a, .htt .tooltip-content li.corruption a:visited { color: #956DD1; }
li.corruptionresist, li.corruptionresist a, li.corruptionresist a:visited, .htt .tooltip-content li.corruptionresist, .htt .tooltip-content li.corruptionresist a, .htt .tooltip-content li.corruptionresist a:visited { color: #ffd517; }
div.htt .setdesc { display: none; }
.setdesc .linkicon { display: none; }
.setdesc strong.selflink { font-weight: normal; }
.tooltip, .htt .tooltip-content {
font-size: 1em;
float: left;
width: auto;
min-width: 15em;
padding: 0.3em;
margin: 5px;
color: #fff;
background-color: #111;
border: 1px #bbb solid;
border-radius: 0.75ex;
}
.htt .tooltip-content table { color: white; }
.tooltip ul, .htt .tooltip-content ul {
margin: 0;
padding: 0;
list-style: none;
list-style-type: none;
list-style-image: none;
}
.htt .tooltip-content { background-color: #070A1A; }
.htt .tooltip-content { width: fit-content; max-width: 22em; background-color: rgba(11, 16, 41, 0.9); }
.htt .ach-tt { max-width: 35em !important; }
#templatetfb .tooltip-content { max-width: 320px !important; }
.htt .tooltip-content .tooltip-hide { display: none; }
.tooltip-ready { visibility: hidden; display: block; z-index: 2999; }
/* Template:itemtip and co. */
.tt-icon { float: right; position: relative; margin-left: 4px; }
.tt-icon-stack { text-shadow: #202020 1px 1px, #202020 0px 0px 3px; position: absolute; bottom: 1px; right: 2px; }
.abilitytooltip { margin: 0.2em 4px 0.2em 40px; } /* support outericon for Template:Abilitytip */
.hometip > ul > .awayline, .awaytip > ul > .homeline { display: none; }
.wtooltip.awaytip { font-size: 0.85em; }
.hometip { float: right; }
.awaytip { float: left; }
.createline > .itemtooltip, .createline > .abilitytooltip { background: transparent; border: none; font-size: 0.90em; margin: 0.75em 0; padding: 0; margin-right: 1em; }
.awaytip > ul > .createline > .itemtooltip { margin: 0.90em 0; }
.subability > .abilitytooltip { background: transparent; border: none; font-size: 0.90em; margin: 0; padding: 0; }
.awaytip > ul > .subability > .abilitytooltip { margin: 0.90em 0; }
.subability .abilitytooltip .outericon { display: none; }
.ajaxttlink > img, .linkicon img { vertical-align: text-bottom; }
/* Custom borders for Template:Itemtip */
.tt-customborder,
.tooltip-content.tt-customborder {
position: relative;
border-style: solid;
border-width: 0;
padding: 10px;
margin-bottom: 7px;
margin-top: 7px;
}
.tt-border-corruption,
.tooltip-content.tt-border-corruption { /* Corruption */
border-image-source:url(/images/6/66/GameTooltip-corruption.png);
border-image-repeat:stretch;
border-image-slice:36 fill;
border-image-width:26px;
border-image-outset:0;
}
.tt-border-corruption:before {
content:"";
display:block;
width:68px;
height:25px;
background:url(/images/2/20/GameTooltip-corruptioneye.png);
position:absolute;
top:0;
left:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%)
}
.tt-border-azerite,
.tooltip-content.tt-border-azerite { /* Azerite */
border-image-source: url(/images/7/7a/GameTooltip-azerite.png);
border-image-repeat: stretch;
border-image-slice: 36 fill;
border-image-width: 26px;
border-image-outset: 4px;
margin-top: 13px;
}
.tt-border-azerite:before {
content:"";
display:block;
width:97px;
height:28px;
background:url(/images/0/08/GameTooltip-azeritetop.png);
position:absolute;
top:-2px;
left:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%)
}
.tt-border-azerite:after {
content:"";
display:block;
width:47px;
height:12px;
background:url(/images/d/dd/GameTooltip-azeritebottom.png);
position:absolute;
top:100%;
left:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%)
}
.tt-border-maw,
.tooltip-content.tt-border-maw { /* Maw */
border-image-source: url(/images/5/51/GameTooltip-maw.png);
border-image-repeat: stretch;
border-image-slice: 36 fill;
border-image-width: 26px;
border-image-outset: 4px;
}
/* Template:infobox */
.infobox.darktable {padding: 0; border-spacing: 5px}
.infobox > caption {margin-bottom: 0.25em}
.infobox .mid-header th {font-size: 105%; padding: 0.25em 0.5em}
@media(max-width:600px) {
.infobox, .infobox.darktable, div.tright, div.tleft, div.floatright, table.floatright {
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
}
div.tright, div.tleft, div.floatright, table.floatright {
width:fit-content;
max-width:100%;
}
.thumbinner { max-width:100%; }
}
/* enwiki? */
.infobox {
border: 1px solid #aaa;
/* @noflip */
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
/* @noflip */
float: right;
/* @noflip */
clear: right;
/* @noflip */
text-align: left;
font-size: 88%;
line-height: 1.5em;
}
.infobox caption {
font-size: 125%;
font-weight: bold;
}
.infobox td,
.infobox th {
vertical-align: top;
}
.infobox .wds-tabs__wrapper .wds-tabs { max-width: 22em; } /* restrict Template:SlidesToTabber size to width of infobox) */
/* --- TABLE DESIGNS --- */
/* Default style for navigation boxes */
.navbox { /* Navbox container style */
border: 1px solid var(--custom-border-color);
background-color: var(--custom-background-color);
width: 100%;
margin: auto;
clear: both;
font-size: 88%;
text-align: center;
padding: 1px;
}
.navbox-inner,
.navbox-subgroup {
width: 100%;
}
.navbox-group,
.navbox-title,
.navbox-abovebelow {
padding: 0.25em 1em; /* Title, group and above/below styles */
line-height: 1.5em;
text-align: center;
}
th.navbox-group { /* Group style */
white-space: nowrap;
/* @noflip */
text-align: right;
}
.navbox,
.navbox-subgroup {
background: var(--navbox-subgroup-color); /* Background color */
}
.navbox-list {
line-height: 1.8em;
border-color: var(--navbox-subgroup-color); /* Must match background color */
}
.navbox th,
.navbox-title {
background: var(--navbox-title-color); /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
background: var(--navbox-group-color); /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
background: var(--navbox-subgroup-group-color); /* Level 3 color */
}
.navbox-even {
background: var(--custom-background-color-alt); /* Even row striping */
}
.navbox-odd {
background: transparent; /* Odd row striping */
}
table.navbox + table.navbox { /* Single pixel border between adjacent navboxes */
margin-top: -1px; /* (doesn't work for IE6, but that's okay) */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
padding: 0.125em 0; /* Adjust hlist padding in navboxes */
}
ol + table.navbox,
ul + table.navbox {
margin-top: 0.5em; /* Prevent lists from clinging to navboxes */
}
/* Default styling for Navbar template */
.navbar {
display: inline;
font-size: 88%;
font-weight: normal;
}
.navbar ul {
display: inline;
white-space: nowrap;
}
.navbar li {
word-spacing: -0.125em;
}
.navbar.mini li span {
font-variant: small-caps;
}
/* Navbar styling when nested in infobox and navbox */
.infobox .navbar {
font-size: 100%;
}
.navbox .navbar {
display: block;
font-size: 100%;
}
.navbox-title .navbar {
/* @noflip */
float: left;
/* @noflip */
text-align: left;
/* @noflip */
margin-right: 0.5em;
width: 6em;
}
/* Styling for JQuery makeCollapsible, matching that of collapseButton */
.mw-collapsible-toggle {
font-weight: normal;
/* @noflip */
text-align: right;
}
/* In navboxes, the show/hide button balances the v·d·e links
from [[Template:Navbar]], so they need to be the same width. */
.navbox .mw-collapsible-toggle {
width: 6em;
}
/* dark table style */
.darktable, .darkbox {
border: 1px solid var(--custom-border-color);
padding: 5px;
background: var(--custom-background-color);
margin: 0.5em 0em 1em 0.5em;
}
.darktable, .stylish { font-size: 89%; }
.stylish { padding: 5px; margin: 0.5em 0em 1em 0.5em; }
table.darktable th, table.darktable tr:not(:first-child) th.outer, table.darkbox th, table.darkbox tr:not(:first-child) th.outer, table.stylish td:first-child {
background-color: var(--navbox-title-color);
padding: 0 0.5em;
}
table.darktable caption { font-size: 120%; font-weight: bold; }
table.darktable tr:not(:first-child) th, table.darkbox tr:not(:first-child) th { background-color: var(--navbox-title-color); }
.rowtitle { font-size: 1.15em; padding: 0.2em 2em 0.2em 0.5em; }
table.extrapadding td {
padding-left: 4px;
padding-right: 4px;
}
table.td-right td { text-align: right; }
/* Title stuff - [[Template:Talkheader]] */
div#content .title {
background-color: var(--custom-background-color--secondary);
text-align:center;
font-weight:bold;
padding: 1px 2px;
}
.theme-dark table.darktable td.title, .theme-dark .darkbox td.title { background-color: #303030; }
.alt, .rowtitle { background-color: var(--custom-background-color-alt); }
table.zebra > tbody > tr:nth-child(2n+1),
table.zebra.darktable > tbody > tr:nth-child(2n+1),
table.zebra.darkbox > tbody > tr:nth-child(2n+1) {
background-color: var(--custom-background-color-alt);
}
table .hover:hover { background-color: orange; } /* for occasions where a table element is class="hover": for legibility in larger tables */
/* --- GENERAL TEMPLATE DESIGNS --- */
/* bg for wowbox */
.wowboxbg { background-color: var(--custom-background-color--tertiary); }
/* disambig, i-note design ({{t|Section}}) */
.greybar {
background-color: var(--custom-background-color-alt);
border-top: 1px solid var(--custom-border-color);
border-bottom: 1px solid var(--custom-border-color);
}
/* band, in use by [[Template:Infoline]] */
.band {
display:table;
margin: 0.2ex 3em;
text-align: center;
padding: 1ex 3em 0.5ex;
line-height:130%;
}
/* --- {{t|Ambox}} TEMPLATE DESIGNS --- */
/* {{t|Ambox}} design */
.ambox {
font-size: 95%;
min-width: 50%;
max-width: 80%;
margin: 0 auto 2px auto;
border: 1px solid var(--custom-border-color);
border-left: 10px solid #228b22;
border-collapse: collapse;
background-color: var(--custom-background-color--secondary);
}/*
@media screen and (min-width: 1366px) {
.ambox { width: 80%; }
}*/
.ambox.ambox-tiny { font-size: 90%; width: auto; margin: 2px 0; min-width: 0; }
.ambox + .ambox { margin-top: -2px; }
.ambox-text { padding: 0.25em 0.5em; }
.ambox-image { width: 60px;padding: 2px 0px 2px 0.5em; text-align: center; }
.ambox-tiny .ambox-image { width: auto; padding: 2px 0.5em; text-align: left; }
/* {{t|Ambox}} colors */
.ambox-blue { border-left: 10px solid #1e90ff; }
.ambox-red { border-left: 10px solid #b22222; }
.ambox-orange { border-left: 10px solid #f28500; }
.ambox-yellow { border-left: 10px solid #f4c430; }
.ambox-purple { border-left: 10px solid #9932cc; }
.ambox-gray { border-left: 10px solid #bba; }
.theme-dark .ambox-gray { border-left-color: #383838; }
.ambox-green { border-left: 10px solid #228b22; }
/* {{t|Ambox}} small text */
.amsmalltext {
font-size: smaller;
margin-top:0.5em;
margin-left:0.8em;
}
/* --- COLORS --- */
/* Blizz text color */
.blizztext, .text-blizz { color: var(--blizztext-color); }
.theme-dark .blizztext a, .theme-dark .text-blizz a,
.theme-dark .blizztext a:visited, .theme-dark .text-blizz a:visited { color: var(--theme-text-color); }
.theme-dark .blizztext a.new, .theme-dark .text-blizz a.new { color: var(--theme-link-color-redlink); }
/* text colors: say, yell, emote, whisper */
.text-say { color: var(--wow-text-color--say); }
.text-yell { color: var(--wow-text-color--yell); }
.text-emote { color: var(--wow-text-color--emote); }
.text-whisper { color: var(--wow-text-color--whisper); }
.text-bossemote { color: var(--wow-text-color--bossemote); }
/* Item Quality Colors */
.qc-poor, .qc-poor a { color: var(--quality-color--poor); }
.qc-common, .qc-common a { color: var(--quality-color--common); }
.wtooltip .qc-common, .wtooltip .qc-common a, .tooltip-content .qc-common, .tooltip-content .qc-common a { color: #fff; } /* we want it white inside tooltips. */
.qc-uncommon, .qc-uncommon a { color: var(--quality-color--uncommon); }
.wtooltip .qc-uncommon, .wtooltip .qc-uncommon a { color: #1EFF00; }
.qc-rare, .qc-rare a { color: var(--quality-color--rare); }
.qc-epic, .qc-epic a { color: var(--quality-color--epic); }
.qc-legendary, .qc-legendary a { color: var(--quality-color--legendary); }
.qc-artifact, .qc-artifact a { color: var(--quality-color--artifact); }
.qc-heirloom, .qc-heirloom a, .qc-token, .qc-token a { color: var(--quality-color--heirloom); }
.qc-enchant, .qc-enchant a { color: var(--quality-color--enchant); }
.abilitylink { color: var(--abilitylink-color); }
.talentlink { color: var(--talentlink-color); }
/*.currencylink { color: #00AA00; }*/
/* Skillup Colors */
.skill-red { color: var(--skill-red); }
.skill-orange { color: var(--skill-orange); }
.skill-yellow { color: var(--skill-yellow); }
.skill-green { color: var(--skill-green); }
.skill-gray { color: var(--skill-gray); }
/* Class Colors */
.cc-deathknight, .cc-deathknight a, .cc-deathknight a:visited, .cc-deathknight a:hover { color: var(--class-color--deathknight); }
.cc-demonhunter, .cc-demonhunter a, .cc-demonhunter a:visited, .cc-demonhunter a:hover { color: var(--class-color--demonhunter); }
.cc-druid, .cc-druid a, .cc-druid a:visited, .cc-druid a:hover { color: var(--class-color--druid); }
.cc-evoker, .cc-evoker a, .cc-evoker a:visited, .cc-evoker a:hover { color: var(--class-color--evoker); }
.cc-hunter, .cc-hunter a, .cc-hunter a:visited, .cc-hunter a:hover { color: var(--class-color--hunter); }
.cc-mage, .cc-mage a, .cc-mage a:visited, .cc-mage a:hover { color: var(--class-color--mage); }
.cc-monk, .cc-monk a, .cc-monk a:visited, .cc-monk a:hover { color: var(--class-color--monk); }
.cc-paladin, .cc-paladin a, .cc-paladin a:visited, .cc-paladin a:hover { color: var(--class-color--paladin); }
.cc-priest, .cc-priest a, .cc-priest a:visited, .cc-priest a:hover { color: var(--class-color--priest); }
.cc-rogue, .cc-rogue a, .cc-rogue a:visited, .cc-rogue a:hover { color: var(--class-color--rogue); }
.cc-shaman, .cc-shaman a, .cc-shaman a:visited, .cc-shaman a:hover { color: var(--class-color--shaman); }
.cc-warlock, .cc-warlock a, .cc-warlock a:visited, .cc-warlock a:hover { color: var(--class-color--warlock); }
.cc-warrior, .cc-warrior a, .cc-warrior a:visited, .cc-warrior a:hover { color: var(--class-color--warrior); }
.druid, .druidalt { color: white; }
.druid { background-color: #7f3e05; }
.druidalt { background-color: #663300; }
.druid a, .druidalt a { color: #ff7f0a; }
.hunter, .hunteralt { color: white; }
.hunter { background-color: #445533; }
.hunteralt { background-color: #334422; }
.hunter a, .hunteralt a { color: #ABD473; }
.mage, .magealt { color: white; }
.mage { background-color: #4488aa; }
.magealt { background-color: #336677; }
.mage a, .magealt a { color: #66ccff; }
.paladin, .paladinalt { color: white; }
.paladin { background-color: #883355; }
.paladinalt { background-color: #662244; }
.paladin a, .paladinalt a { color: #ff99cc; }
.priest, .priestalt { color: white; }
.priest { background-color: #777777; }
.priestalt { background-color: #444444; }
.priest a, .priestalt a { color: #bbbbbb; }
.rogue, .roguealt { color: white; }
.rogue { background-color: #555500; }
.roguealt { background-color: #444400; }
.rogue a, .roguealt a { color: #fff569; }
.shaman, .shamanalt { color: white; }
.shaman { background-color: #112277; }
.shamanalt { background-color: #112255; }
.shaman a, .shamanalt a { color: #2459FF; }
.warlock, .warlockalt { color: white; }
.warlock { background-color: #331155; }
.warlockalt { background-color: #220044; }
.warlock a, .warlockalt a { color: #cc99ff; }
.warrior, .warrioralt { color: white; }
.warrior { background-color: #775533; }
.warrioralt { background-color: #443322; }
.warrior a, .warrioralt a { color: #C79C6E; }
.deathknight, .deathknightalt { color: white; }
/* .deathknight { background-color: #; } */
/* .deathknightalt { background-color: #; } */
.deathknight a, .deathknightalt a { color: #C41E3A; }
.monk, .monkalt { color: white; }
/* .monk { background-color: #; } */
/* .monkalt { background-color: #; } */
.monk a, .monkalt a { color: #008467; }
.demonhunter, .demonhunteralt { color: white; }
/* .demonhunter { background-color: #; } */
/* .demonhunteralt { background-color: #; } */
.demonhunter a, .demonhunteralt a { color: #A330C9; }
.evoker, .evokeralt { color: white; }
/* .evoker { background-color: #; } */
/* .evokeralt { background-color: #; } */
/* .evoker a, .evokeralt a { color: #; } */
/* Gem Attributes (itemtip, gemattribcolor) */
.gemattrib-fire { color: var(--gemattrib-fire); }
.gemattrib-frost { color: var(--gemattrib-frost); }
.gemattrib-earth { color: var(--gemattrib-earth); }
.gemattrib-nature { color: var(--gemattrib-nature); }
.gemattrib-arcane { color: var(--gemattrib-arcane); }
.gemattrib-shadow { color: var(--gemattrib-shadow); }
.gemattrib-necromantic { color: var(--gemattrib-necromantic); }
/* PLAINLINKS (see wikipedia:Common.css) */
.plainlinksneverexpand {
background: none ! important;
padding: 0 ! important;
}
.plainlinksneverexpand .urlexpansion { display: none ! important; }
.plainlinksneverexpand a {
background: none !important;
padding: 0 !important;
}
.plainlinksneverexpand a.external.text:after { display: none !important; }
.plainlinksneverexpand a.external.autonumber:after { display: none !important; }
#bodyContent .plainlinks a { background: none !important; padding: 0 !important; }
.colorless > a {color: inherit}
/* USERBOXES {{t|Userbox}} */
table.wwusrbox { float: left; margin: 0.2em; padding: 0; border-width: 1px; border-style: solid; font-size: 0.9em; }
table.wwusrbox td.left, table.wwusrbox td.right { text-align: center; vertical-align: middle; font-size: 1.6em; padding: 0; }
table.wwusrbox td.main { padding: 0 4px; vertical-align: middle; line-height: 125%; font-size: 0.9em; }
table.wwusrbox { background-color: var(--custom-background-color--secondary); border-color: var(--custom-border-color); }
table.wwusrbox td.left, table.wwusrbox td.right { background: var(--custom-background-color--tertiary); }
/* Book Styling */
div.book { margin: 0.5em; border: 1px solid var(--custom-border-color); background-color: var(--custom-background-color--secondary); }
div.book h4{
margin: 0;
padding: 0.2em;
border-bottom-width: 1px;
border-bottom-style: solid;
font-family: Georgia, serif;
font-size: 1.1em;
font-weight: bold;
}
div.book h4 span.editsection {
font-family: sans-serif;
font-size: 0.91em;
}
/* Template: Reputation */
.rep-hated { color: var(--rep-color--hated); }
.rep-hostile { color: var(--rep-color--hostile); }
.rep-unfriendly { color: var(--rep-color--unfriendly); }
.rep-neutral { color: var(--rep-color--neutral); }
.rep-friendly { color: var(--rep-color--friendly); }
.rep-honored { color: var(--rep-color--honored); }
.rep-revered { color: var(--rep-color--revered); }
.rep-exalted, .rep-paragon { color: var(--rep-color--exalted); }
/* Buffs & Debuffs */
div.bufftip { border-width: 1px; border-style: solid; border-color: var(--tooltip-border-color); }
div.debuff { border-color: var(--debuff-default); }
div.debuffmagic { border-color: var(--debuff-magic); }
div.debuffcurse, div.buffweapon { border-color: var(--debuff-curse); }
div.debuffdisease { border-color: var(--debuff-disease); }
div.debuffpoison { border-color: var(--debuff-poison); }
.achievementlink { color: var(--achievementlink-color); }
.factiontable { background-color: var(--custom-background-color--secondary); border: 2px solid var(--custom-background-color--secondary); }
.factiontable tr { background-color: var(--custom-background-color); }
.factiontable.alliance th, .factiontable.alliance td.factionbg { background-color: var(--alliance-background-color); }
.factiontable.horde th, .factiontable.horde td.factionbg { background-color: var(--horde-background-color); }
.guildtable {border-spacing: 0 1px}
.guildtable td {padding: 1px 0.5em}
.guildtable th {padding: 2px 1em}
/* Main page-related styles and Project:Community portal */
body.page-Warcraft_Wiki hr {
color: #444;
}
body.page-Warcraft_Wiki #bodyContent > #siteSub + #contentSub + #jump-to-nav + #mp-outer-container{margin-top: -2em}
body.page-Warcraft_Wiki .mw-anonnotice {margin-bottom: 15px !important}
#mp-outer-container {
display: flex;
flex-direction: row;
width: 100%;
align-items: stretch;
flex-wrap: wrap;
}
.mpcontentbox {
margin: 5px;
padding:7px 15px 12px 15px;
border-radius: 0.5em;
}
.mpcontentbox > h3 { border-bottom: 1px solid #444; margin: 0.5ex 0; padding: 0.4ex 0; }
.theme-dark .mpcontentbox > h3 { border-color: #303030; }
.mpcontentbox-table { width: 100%; }
.bg-darkblue { background-color: var(--wcw-bg-blue); }
.bg-darkgreen { background-color: var(--wcw-bg-green); }
.bg-darkgray { background-color: var(--wcw-bg-gray); }
.bg-darkred { background-color: var(--wcw-bg-red); }
#ptabs { font-size:93%; font-weight:bold; clear: left; margin: 0 0 3px 0;}
#ptabs .activetab, #ptabs .inactivetab { padding:5px 10px 5px 10px; text-decoration:none; color:black; }
#ptabs .activetab {background:#E5E5E5; }
#ptabs .inactivetab { background:#F5F5F5; }
#ptabs .inactivetab:hover { background:#CCC; color:black; }
#ptabs a:hover { text-decoration:none !important; }
/* in-header version tabs (faction disambiguation, versions, etc) */
#versions-header-tabs { margin: 0 0.5em 0 1em; font-size: 90%; font-weight:normal; vertical-align: 3px}
#versions-header-tabs a { background: var(--custom-background-color--secondary); white-space: nowrap; color: var(--theme-page-text-color); padding: 0 0.25em; }
#versions-header-tabs a:hover { text-decoration:none; }
#versions-header-tabs .inactivetab:hover { background: var(--custom-background-color--tertiary); }
#versions-header-tabs.fswitch a { background: transparent; color: var(--custom-text-color--grey); }
#versions-header-tabs .activetab { background: var(--custom-background-color); }
#versions-header-tabs .activetab.alliancetab { color: var(--alliance-text-color); }
#versions-header-tabs .activetab.hordetab { color: var(--horde-text-color); }
#versions-header-tabs.item-versions {font-size: 70%}
#versions-header-tabs.item-versions a {padding: 1px 0.75em}
#versions-header-tabs.item-versions a.inactivetab { border: 1px solid #404040; color: var(--custom-text-color--grey); }
#versions-header-tabs.item-versions a.activetab { border: 1px solid #997708; }
/* Table sort for Special:Filelist */
.TablePager_sort { background-position: 2px 50%; }
.TablePager th a { display: block; }
.TablePager_sort a { padding: 0 4px 0 16px; }
/* Template:Lootbox itemtip spacing adjustments */
.lootbox .itemtooltip { margin: 0 0 1em 0; }
.lootbox.side-by-side > li { padding: 0 2px; }
/* Forum formatting */
.forumheader { border: 1px solid var(--custom-border-color); background-color: var(--custom-background-color); margin-top: 1em; padding: 12px; }
.forumlist td.forum_title a { padding-left: 20px; }
.forumlist td.forum_title span a { padding-left: 0px; }
.forumlist td.forum_title a.forum_new {padding-left: 0px;}
.forumlist td.forum_title a.forum_new:before {content: '\2794'; display: inline-block; width: 20px; text-align: center; font-weight: bold}
.forumlist td.forum_title a.forum_new:visited:before {color: #a0a0a0;}
.forumlist th.forum_title { padding-left: 20px; }
/* Style for horizontal lists (separator following item).
IE8-specific classes are assigned in [[MediaWiki:Common.js/IEFixes.js]].
@source mediawiki.org/wiki/Snippets/Horizontal_lists
@revision 4.3 (2014-01-06)
@author [[User:Edokter]]
*/
.hlist dl,
.hlist ol,
.hlist ul {
margin: 0;
padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
margin: 0;
display: inline;
}
/* 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;
}
/* Generate interpuncts */
.hlist dt:after {
content: ": ";
}
.hlist dd:after,
.hlist li:after {
content: " · ";
font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
content: none;
}
/* For IE8 */
.hlist dd.hlist-last-child:after,
.hlist dt.hlist-last-child:after,
.hlist li.hlist-last-child:after {
content: none;
}
/* 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;
}
/* For IE8 */
.hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after,
.hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after,
.hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-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) " ";
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
content: " (" counter(listitem) " ";
}
/* Unbulleted lists */
.plainlist ul {
line-height: inherit;
list-style: none none;
margin: 0;
}
.plainlist ul li { margin-bottom: 0; }
ul.side-by-side, .side-by-side-recursive ul { margin: 0; padding: 0; list-style: none; list-style-type: none; list-style-image: none; }
ul.side-by-side > li, .side-by-side-recursive ul > li { padding: 0.2em; display: inline-block; vertical-align: top; text-align: inherit; }
#content td ul:first-child, #content td p:first-child { margin-top: 0; }
#content td ul:last-child, #content td p:last-child { margin-bottom: 0; }
/* elinks */
ul.elinks { list-style-type: none; padding: 0px; margin: 0px; overflow: hidden; }
ul.elinks li {
list-style: none;
background-repeat: no-repeat;
background-position: 0px 0px;
padding-left: 25px;
min-height: 25px;
vertical-align: middle;
}
ul.elinks li.wowhead { background-image: url(/images/b/b9/ElinkIcon-wowhead.png); background-size: 22px; } /* Retail */
ul.elinks li.wowheadc { background-image: url(/images/e/ee/ElinkIcon-wowheadc.png); background-size: 22px; } /* Classic Era */
ul.elinks li.wowhead-bc { background-image: url(/images/6/65/ElinkIcon-wowhead-bc.png); background-size: 22px; } /* BC Classic */
ul.elinks li.wowhead-wrath { background-image: url(/images/3/34/ElinkIcon-wowhead-wrath.png); background-size: 22px; } /* Wrath Classic */
ul.elinks li.wowhead-cata { background-image: url(/images/6/6f/ElinkIcon-wowhead-cata.png); background-size: 22px; } /* Cata Classic */
ul.elinks li.wowus { background-image: url(/images/3/3a/ElinkIcon-wowus.png); }
ul.elinks li.wow { background-image: url(/images/5/55/ElinkIcon-wow.png); }
ul.elinks li.sigrie { background-image: url(/images/2/25/ElinkIcon-mmochampion.png); }
ul.elinks li.petopia { background-image: url(/images/6/68/ElinkIcon-petopia.png); }
ul.elinks li.warcraftpets { background-image: url(/images/9/98/ElinkIcon-warcraftpets.png); }
span.alliance-link, span.horde-link, span.neutral-link {
background-repeat: no-repeat;
background-position: 0px 0px;
padding-left: 17px;
min-height: 15px;
vertical-align: middle;
}
/* Template: alink/hlink/nlink */
span.alliance-link { background-image: url(/images/2/21/Alliance_15.png); }
span.horde-link { background-image: url(/images/c/c4/Horde_15.png); }
span.neutral-link { background-image: url(/images/c/cb/Neutral_15.png); }
/* display:none; */
body.page-Warcraft_Wiki.action-view #firstHeading, body.ns-116.action-view #contentSub, .TablePager_sort img, .ajaxHide-active, body.ns-110 #ca-talk, body.ns-110 #this_talk, body.ns-110 #page_tabs li+li, .aChar, .hidden { display:none; }
.itemlink { white-space: nowrap; }
.gallerytext .itemlink, .thumbcaption .itemlink, .gallerytext .abilitylink, .thumbcaption .abilitylink, .tooltip-content .itemlink { white-space: normal; }
.itemtooltip .itemlink { white-space: normal !important; }
.questshort .questlong-prefix {display: none}
.questbox .questshort > .nobreak {white-space: normal}
/* Other-faction links on quest-disambiguated pages */
.fswitched .qfordisambig, body.versions-active-inline .qfordisambig {display: none}
/* Version-conditional content */
/*body.versions-active .versions-cv {display: none}*/
body.versions-active table.elinks-many {border: none; padding: 0; background: transparent; margin: 0; font-size: 100%}
/* Template:Coords */
.coords-link { line-height: 1em; }
/* Template:Coords error highlighting */
.broken.coords-link sup { background-color: #FFB0B0; padding: 1px; }
.theme-dark .broken.coords-link sup { background-color: var(--theme-link-color-redlink); }
/* Template:shortcut */
div.shortcut {position: absolute; top: -2.5em; right: 1em}
/* Achievementtip */
.wtooltip.ach-tt {position:relative; margin-left: 60px; width: auto; min-width: -webkit-min-content; min-width: -moz-min-content; min-width: min-content}
.ach-tt .achievementcriteria li > .nobreak { white-space: normal; }
.ach-tt .achievementcriteria li .att-factionicon { display: none; }
.ach-tt .tt-icon {position: absolute; left: -58px; top: -1px; float: none}
.achievementpoints { clear:both; float:right; white-space:nowrap; margin-left:1em }
.achievementtitle strong, .achievementcriteria strong, .achievementrewards strong { color:gold }
.achievementtitle.account-ach strong {color: #00aeff}
.wtooltip.ach-tt > ul {min-width: 16em}
.achievementdescription .itemlink .bracket, .achievementdescription .linkicon { display: none; }
.achievementdescription .itemlink { color: unset; }
/* Hide cite errors for non-editors (approximated by "if showing ads") */
body.show-ads .error.mw-ext-cite-error {display: none}
/* Template: Adventure Guide Button transparent link highlight on hover */
.highlight-on-hover:hover {background: rgba(255, 255, 255, 0.15); transition: background 0.5s}
/* Project:Community portal */
.cpbox {
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap;
}
.cpbox #admins {
box-sizing: border-box;
width: calc(33% - 10px);
margin: 5px;
flex-grow: 1;
min-width: 300px;
}
.cpbox #help {
box-sizing: border-box;
width: calc(67% - 10px);
margin: 5px;
flex-grow: 1;
}
/* NSFW blurs */
.nsfw { filter:blur(10px); }
.nsfw:hover { filter:none; }
.nsfw-1 li:first-child img { filter: blur(10px); }
.nsfw-2 li:nth-child(2) img { filter: blur(10px); }
.nsfw-3 li:nth-child(3) img { filter: blur(10px); }
.nsfw-4 li:nth-child(4) img { filter: blur(10px); }
.nsfw-5 li:nth-child(5) img { filter: blur(10px); }
.nsfw-6 li:nth-child(6) img { filter: blur(10px); }
.nsfw-7 li:nth-child(7) img { filter: blur(10px); }
.nsfw-8 li:nth-child(8) img { filter: blur(10px); }
.nsfw-9 li:nth-child(9) img { filter: blur(10px); }
.nsfw-10 li:nth-child(10) img { filter: blur(10px); }
.nsfw-11 li:nth-child(11) img { filter: blur(10px); }
.nsfw-12 li:nth-child(12) img { filter: blur(10px); }
.nsfw-13 li:nth-child(13) img { filter: blur(10px); }
.nsfw-14 li:nth-child(14) img { filter: blur(10px); }
.nsfw-15 li:nth-child(15) img { filter: blur(10px); }
.nsfw-16 li:nth-child(16) img { filter: blur(10px); }
.nsfw-17 li:nth-child(17) img { filter: blur(10px); }
.nsfw-18 li:nth-child(18) img { filter: blur(10px); }
.nsfw-19 li:nth-child(19) img { filter: blur(10px); }
.nsfw-20 li:nth-child(20) img { filter: blur(10px); }
/*...*/
.nsfw-67 li:nth-child(67) img { filter: blur(10px); }
.nsfw-79 li:nth-child(79) img { filter: blur(10px); }
.nsfw-cbox img.cboxPhoto { filter: blur(10px); }
.nsfw-cbox img.cboxPhoto:hover { filter:none; }
.mwe-popups.flipped_y, .mwe-popups.flipped_x_y { margin-top: -30px; }
table.vertical-align-row tr { vertical-align: top; }
th.rotate {
height: 140px;
white-space: nowrap;
}
th.rotate > div {
transform: translate(20px, 55px) rotate(315deg);
color: blue;
width: 30px;
}
th.rotate > div > span {
border-bottom: 1px solid #ccc;
padding: 1px 10px;
}
table.stylish td:first-child { white-space:nowrap; }
table.stylish td:not(:first-child) {
border:1px solid var(--custom-border-color);
text-align: center;
}
th.rotatecorner { width:135px; }
th.rotatecorner > span{
position:relative;
top:70px;
}
th.rotatecorner > div {
transform: translate(120px, 35px) rotate(315deg);
width:60px;
border-bottom:1px solid;
}
table.stylishzebra > tbody > tr:nth-child(2n) { background-color: rgba(128,128,128,0.2); }
/* Template:Class, Template:Profession, Template:Race */
.ClassLink, .ProfLink, div.RaceLink {
width: 100px;
text-align: center;
margin-top: 20px;
}
.theme-dark .ClassLink a, .theme-dark .ProfLink a, .theme-dark div.RaceLink a { color: #fff; }
/* Indicator amdiv styling */
.mw-indicator .amdiv.amdiv-orange { border-color: #f28500; }
.mw-indicator .amdiv.amdiv-yellow { border-color: #f4c430; }
.mw-indicator .amdiv.amdiv-purple { border-color: #9932cc; }
.mw-indicator .amdiv {
border: 1px solid #f28500;
border-left-width: 10px;
margin: 0;
height: 50px;
position: relative;
top: -7px;
overflow: hidden;
width: 50px;
}
li.nv-view, li.nv-edit { display: none; }
/* [[Template:Conflictbox]] */
.infobox tr.ConflictArmy td {
border-bottom: solid 1px #333;
}
.infobox tr.ConflictArmy:last-child td {
border-bottom: none;
}
/* Default infobox width size */
.infobox {
max-width: 21.5em;
}
.infobox th[scope=row] {
display: block;
width: 100%;
}
.infobox th[scope=row]+td {
display: block;
min-width: 90%;
margin-left: 10%;
margin-right: 0;
}
/* However, do not apply this narrower infobox if the screen is large and the user has maximized their screen. (1024px is the same break point as the FandomDesktop side bar.) */
@media screen and (min-width:1024px)
{
.infobox {
max-width: none;
}
.infobox th[scope=row], .infobox th[scope=row]+td {
display: table-cell;
width: inherit;
}
.infobox th[scope=row]+td {
min-width: unset;
}
}
/* Table centering */
.col1-center td:first-child,
.col2-center td:nth-child(2),
.col3-center td:nth-child(3),
.col4-center td:nth-child(4),
.lastCol-center td:last-child {
text-align: center;
}
/* Table right-alignment */
.col1-right td:first-child,
.col2-right td:nth-child(2),
.col3-right td:nth-child(3),
.col4-right td:nth-child(4),
.lastCol-right td:last-child {
text-align: right;
}
/* Template:Columns */
.t-columns { margin-top: 0.3em; }
.t-columns > :is(ul,ol) { margin-top: 0; }
/* Template:Dialogue */
.dialogue {
font-size:95%;
margin-left:calc(0.6em - 3px);
margin-top:0.5em;
padding-left:1em;
border-left:3px solid;
border-image:linear-gradient(to bottom, transparent, rgba(128, 128, 128, 0.75) 0.45em, rgba(128, 128, 128, 0.75) calc(100% - 0.45em), transparent);
border-image-slice:1;
}
.dialogue p { margin:0.4em 0; }
.dialogue.plainlist li { margin-bottom:2px; }
.dialogue-title {
font-weight:bold;
border-bottom:1px dotted;
border-image:linear-gradient(to right, gray, transparent 30%);
border-image-slice:1;
}
.dialogue-title p { margin-bottom:0.25em; }
.dialogue-child {
margin-left:calc(0.6em - 3px);
padding-left:1em;
border-left:3px solid;
border-image:linear-gradient(to bottom, transparent, rgb(128, 128, 128, 0.5) 0.45em, rgb(128, 128, 128, 0.5) calc(100% - 0.45em), transparent);
border-image-slice:1;
}
/* Template:Videoplayer */
.videoplayer {
display: flex;
flex-wrap: wrap;
}
.vplayer-list {
width: max-content;
margin-left: 10px;
}
.vplayer-lists {
margin-top: 4px;
border-radius:2ex;
padding:0.5ex 1ex;
background-color: var(--custom-background-color--tertiary);
}
.embedvideo { background-size: cover; }
.videoplayer .evlplayer[data-service="videolink"] { display: block; } /* prevent default behavior */
.legacies .embedvideo { background-image: url(https://warcraft.wiki.gg/images/e/e2/Legacies_title.jpg); }
.afterlives .embedvideo { background-image: url(https://warcraft.wiki.gg/images/f/f1/Afterlives_title.jpg); }
.warbringers .embedvideo { background-image: url(https://warcraft.wiki.gg/images/b/b2/Warbringers_title.jpg); }
.harbingers .embedvideo { background-image: url(https://warcraft.wiki.gg/images/1/17/Harbingers_title.jpg); }
.lordsofwar .embedvideo { background-image: url(https://warcraft.wiki.gg/images/6/64/Lords_of_War_title.jpg); }
.shaohao .embedvideo { background-image: url(https://warcraft.wiki.gg/images/c/ce/The_Burdens_of_Shaohao_title.jpg); }
.a-toast .embedvideo { background-image: url(https://warcraft.wiki.gg/images/9/93/A_Toast_to_15_Years.jpg); }
/* Api articles */
.apitype { color: var(--wowapi-text-color); }
.apialt { color: var(--wowapi-text-color-alt); }
.apiarg { color: var(--wowapi-text-color); font-size: smaller; }
.apiret { color: var(--wowapi-text-color-alt); font-size: smaller; }
/* Template:PseudoAmbox */
.pseudo-ambox { width: fit-content; }
.pseudo-ambox-content {
display: flex;
/*background: var(--custom-background-color);*/
}
.pseudo-ambox-image {
margin: auto;
padding: 0.3em 0.5em 0 0;
}
.pseudo-ambox-image img {
max-height: 40px;
width: auto;
vertical-align: baseline;
}
.pseudo-ambox-description {
margin: auto;
padding: 0.3ex 0.5em;
border-top: 1px solid var(--custom-border-color);
border-bottom: 1px solid var(--custom-border-color);
}
@media(max-width:600px) {
.pseudo-ambox { padding-bottom: 1em; }
.pseudo-ambox-content {
align-items: center;
background: var(--theme-page-background-color--secondary);
border-top: 1px solid var(--theme-border-color);
border-bottom: 1px solid var(--theme-border-color);
}
.pseudo-ambox-description { flex: min-content; }
.pseudo-ambox-image { padding-left: 0.5em; }
}
/* Unknowns; Where are they used? */
.theme-dark .repspanbar { background: #002040; border-width: 1px; border-style: solid; border-color:#204080 #001030 #001030 #204080; }
/* Notices for MediaWiki:Sitenotice and MediaWiki:Anonnotice */
#notice {
background-color: var(--custom-background-color);
border: 1px solid var(--wcw-accent-color-bright);
border-radius: 5px;
margin: auto;
text-align: center;
width: 70%;
padding: 3px;
}
/* force updated logo */
.mw-wiki-logo {
background-image: url(/images/e/e6/Site-logo.png?d0d02);
}
/* EmbedVideo: On page load, prevent the block appearing briefly before the extension's css is loaded */
.evlplayer[data-service="videolink"] { display: none; }