MediaWiki:Common.css

From Warcraft Watch Secrets
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)
  • Edge: Hold Ctrl while clicking Refresh, or 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}}
   
   Skin-variant CSS:
   - [[MediaWiki:Vector.css]]
   
   Additional files are loaded based on the user's selected skin theme:
   - [[MediaWiki:Theme-dark.css]] (default)
   - [[MediaWiki: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
*/

.theme-dark, .wtooltip {
	/*** site background ***/
	--theme-site-background: #101010;
	--theme-background-color: #181818;
	--theme-background-color-alt: #202020;
	--theme-background-color--secondary: #282828;
	--theme-background-color--tertiary: #303030;
	/*** site accents ***/
	--theme-accent-color: #8d6934;
	--theme-accent-color-bright: #f0c873;
	--theme-header-background-color: #062540;
	/*** text color ***/
	--theme-text-color: #fff;
	--theme-text-color-alt: #e0e0e0;
	--theme-heading-color: var(--theme-text-color);
	/*** link text color ***/
	--theme-link-color: #5a93cc;
	--theme-link-color-hover: var(--theme-link-color);
	--theme-link-color-visited: #2673BF;
	--theme-link-color-redlink: #F05048;
	--theme-link-color-focus: var(--theme-link-color);
	--theme-link-color-nav: #518fce;
	--theme-link-color-nav-visited: #518fce;
	/* default color for icons */
	--theme-icon-color: var(--theme-link-color);
	--theme-icon-color-redlink: var(--theme-link-color-redlink);
	--theme-icon-color-hover: var(--theme-link-color-hover);
	/* default common color */
	--theme-border-color: #383838;
	--theme-highlight-background: rgba(240, 200, 115, 0.3);
	/* dropdown menu */
	--theme-dropdown-border-color: var(--theme-accent-color);
	--theme-dropdown-background: rgb(18,18,18);

	/* Background colors */	
	--wcw-bg-blue: #16181D;
	--wcw-bg-green: #161A16;
	--wcw-bg-gray: #181818;
	--wcw-bg-red: #1A1616;

	/* Class color codes, adjusted colors are different from in-game for better contrast on dark mode */
	--class-color--deathknight: #FF324A; /* adjusted */
	--class-color--demonhunter: #D43AFF; /* adjusted */
	--class-color--druid: #FF7C0A;
	--class-color--evoker: #33937F;
	--class-color--hunter: #AAD372;
	--class-color--mage: #3FC7EB;
	--class-color--monk: #00FF98;
	--class-color--paladin: #F48CBA;
	--class-color--priest: #FFFFFF;
	--class-color--rogue: #FFF468;
	--class-color--shaman: #0086FF; /* adjusted */
	--class-color--warlock: #8788EE;
	--class-color--warrior: #C69B6D;
	
	/* Resource colors */
	--resource-color--energy:#FFFF00;
	--resource-color--focus:#FF8040;
	--resource-color--mana:#007CFF; /* adjusted */
	--resource-color--rage:#FF0000;

	/* Text colors */
	--wow-text-color--say: #E6E68E;
	--wow-text-color--yell: #FF4040;
	--wow-text-color--emote: #F87431;
	--wow-text-color--whisper: #F8B0DE;
	--wow-text-color--bossemote: #f0d000;

	/* Quality colors */
	--quality-color--poor: #9D9D9D;
	--quality-color--common: white;
	--quality-color--uncommon: #1EFF00;
	--quality-color--rare: #0070FF;
	--quality-color--epic: #a335ee;
	--quality-color--legendary: #ff8000;
	--quality-color--artifact: #E6CC80;
	--quality-color--heirloom: #00CCFF; /* token same as heirloom */
	--quality-color--enchant: #FFD100;

	/* Reputation colors */
	--rep-color--hated: #cc2222;
	--rep-color--hostile: red;
	--rep-color--unfriendly: #ee6622;
	--rep-color--neutral: yellow;
	--rep-color--friendly: lime;
	--rep-color--honored: #00ff88;
	--rep-color--revered: #00ffcc;
	--rep-color--exalted: cyan; /* paragon same as exalted */

	/* Faction colors, see Template:Capital */
	--horde-text-color: #ffbbbb;
	--horde-background-color: #661111;
	--neutral-text-color: #ccc;
	--alliance-text-color: #99ccee;
	--alliance-background-color: #143A66;

	/* Skills */
	--skill-red: #DD2222;
	--skill-orange: #FF8040;
	--skill-yellow: #FDCD00;
	--skill-green: #40BF40;
	--skill-gray: #808080;

	/* tooltip */
	--tooltip-border-color: #b0b0b0;

	/* Debuffs */
	--debuff-default: #cc0000;
	--debuff-magic: #3399ff;
	--debuff-curse: #9900ff;
	--debuff-disease: #996600;
	--debuff-poison: #009900;

	/* Gem Attributes (Forbidden Reach) */
	--gemattrib-fire: #FF5100;
	--gemattrib-frost: #00D1FF;
	--gemattrib-earth: #FFAB00;
	--gemattrib-nature: #40C040;
	--gemattrib-arcane: #E97DFF;
	--gemattrib-shadow: #834FFF;
	--gemattrib-necromantic: #FF516C;

	/* Other */
	--blizztext-color: #00C0FF;
	--abilitylink-color: #7ad5ff;
	--talentlink-color: #4e96f7;
	--achievementlink-color: #CC9900;
	--flavor-color: #ffd517;
	
	/* API */
	--wowapi-text-color: #ecbc21;
	--wowapi-text-color-alt: #4ec9b0;
}
.theme-light {
	/*** site background ***/
	--theme-site-background: #f6f6f6;
	--theme-background-color: #f8f9fa;
	--theme-background-color-alt: #ddf;
	--theme-background-color--secondary: #f3f4f4;
	--theme-background-color--tertiary: #ddd;
	/*** site accents ***/
	--theme-accent-color: #887000;
	--theme-accent-color-bright: #cc9900;
	--theme-header-background-color: #ccccff;
	/*** text color ***/
	--theme-text-color: #000;
	--theme-text-color-alt: #202122;
	--theme-heading-color: var(--theme-text-color);
	/*** link text color ***/
	--theme-link-color: #0645ad;
	--theme-link-color-hover: var(--theme-link-color);
	--theme-link-color-visited: #0B0080;
	--theme-link-color-redlink: #ba0000;
	--theme-link-color-focus: var(--theme-link-color);
	--theme-link-color-nav: var(--theme-link-color);
	--theme-link-color-nav-visited: var(--theme-link-color);
	/* default color for icons */
	--theme-icon-color: var(--theme-link-color);
	--theme-icon-color-redlink: var(--theme-link-color-redlink);
	--theme-icon-color-hover: var(--theme-link-color-hover);
	/* default common color */
	--theme-border-color: #c2c3c3;
	--theme-highlight-background: rgba(204, 153, 0, 0.3);
	/* dropdown menu */
	--theme-dropdown-border-color: var(--theme-accent-color);
	--theme-dropdown-background: rgb(230,230,230);

	/* Navbox */
	--navbox-title-color: #ccccff;

	/* Background colors */
	--wcw-bg-blue: #F0F4FF;
	--wcw-bg-green: #F0FFF5;
	--wcw-bg-gray: #F0F0F0;
	--wcw-bg-red: #FFF7F0;

	/* Class color codes, adjusted colors are different from in-game for better contrast on light mode */
	--class-color--deathknight: #C41E3A;
	--class-color--demonhunter: #A330C9;
	--class-color--druid: #CB4F00; /* adjusted */
	--class-color--evoker: #00634C; /*adjusted */
	--class-color--hunter: #608029; /* adjusted */
	--class-color--mage: #08809C; /* adjusted */
	--class-color--monk: #00884F; /* adjusted */
	--class-color--paladin: #C44884; /* adjusted */
	--class-color--priest: #000; /* adjusted */
	--class-color--rogue: #8E7318; /* adjusted */
	--class-color--shaman: #0070DD;
	--class-color--warlock: #7366D6; /* adjusted */
	--class-color--warrior: #9B6C41; /* adjusted */
	
	/* Resource colors */
	--resource-color--energy:#887000; /* adjusted */
	--resource-color--focus:#B2562E; /* adjusted */
	--resource-color--mana:#0000FF;
	--resource-color--rage:#E20000; /* adjusted */

	/* Text colors */
	--wow-text-color--say: #CC9900;
	--wow-text-color--yell: #FF4040;
	--wow-text-color--emote: #F87431;
	--wow-text-color--whisper: #F8B0DE;
	--wow-text-color--bossemote: #897400; /* adjusted */

    /* Quality colors */
	--quality-color--poor: #9D9D9D;
	--quality-color--common: black; /* adjusted */
	--quality-color--uncommon: #27BF13;
	--quality-color--rare: #0070FF;
	--quality-color--epic: #a335ee;
	--quality-color--legendary: #ff8000;
	--quality-color--artifact: #BFA760;
	--quality-color--heirloom: #00CCFF; /* token same as heirloom */
	--quality-color--enchant: #8B6610; /* adjusted */

	/* Reputation colors */
	--rep-color--hated: #ac1d1d;
	--rep-color--hostile: #ac0000;
	--rep-color--unfriendly: #AB4918;
	--rep-color--neutral: #887000; /* adjusted */
	--rep-color--friendly: #00ac00;
    --rep-color--honored: #00AB5B;
	--rep-color--revered: #00AB89;
	--rep-color--exalted: #00acac; /* paragon same as exalted */

	/* Faction colors, see Template:Capital */
	--horde-text-color: #661111;
	--horde-background-color: #FFD4CC;
	--neutral-text-color: #444;
	--alliance-text-color: #214DA6;
	--alliance-background-color: #CCE4FF;

	/* Skills */
	--skill-red: #DD2222;
	--skill-orange: #FF8040;
	--skill-yellow: #FDCD00; /* This is a slightly darker yellow so it'll show up in the light skin */
	--skill-green: #40BF40;
	--skill-gray: #808080;

	/* tooltip */
	--tooltip-border-color: #b0b0b0;

	/* Debuffs */
	--debuff-default: #cc0000;
	--debuff-magic: #3399ff;
	--debuff-curse: #9900ff;
	--debuff-disease: #996600;
	--debuff-poison: #009900;

	/* Gem Attributes (Forbidden Reach) */
	--gemattrib-fire: #FF5100;
	--gemattrib-frost: #00D1FF;
	--gemattrib-earth: #FFAB00;
	--gemattrib-nature: #40C040;
	--gemattrib-arcane: #E97DFF;
	--gemattrib-shadow: #834FFF;
	--gemattrib-necromantic: #FF516C;

	/* Other */
	--blizztext-color: #0070af;
	--abilitylink-color: #2BA2D9;
	--talentlink-color: #4e96f7;
	--achievementlink-color: #CC9900;
	--flavor-color: #887000;

	/* API */
	--wowapi-text-color: #aa8800;
	--wowapi-text-color-alt: #40a590;
}

:root {
	/** color mixes */
    --theme-content-text-mix-color: color-mix(in srgb,var(--theme-background-color-alt),var(--theme-text-color) 62%);
    --theme-content-text-mix-color-95: color-mix(in srgb,var(--theme-background-color-alt) 95%,var(--theme-text-color));
	/*********************************************************
	* Backwards compatibility with deprecated variable names *
	**********************************************************/
	--wcw-accent-color: var(--theme-accent-color);
	--wcw-accent-color-bright: var(--theme-accent-color-bright);
	--navbox-title-color: var(--theme-header-background-color);
	/****************************************
	* End backwards compatibility variables *
	*****************************************/
}

/* 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%; }

/* Discord */
#p-navigation #n-Wiki-Discord a {
	color: white !important;
	font-size: 12px;
	font-weight: bold;
	border-radius: 5px;
	border: 1px solid #161cbb;
	background-color: #5865f2;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 4px;
	box-shadow: 0 2px 3px rgba(0,0,0,0.1);
	transition: 0.2s ease;
	line-height: 14px;
}
#p-navigation #n-Wiki-Discord a:hover {
	background-color: #4752c4;
	text-decoration: none;
}
#p-navigation #n-Wiki-Discord a::before {
	content: '';
	display: block;
	background: url(https://commons.wiki.gg/images/0/05/Discord.svg) no-repeat;
	background-size: 17px 13px;
	filter: brightness(100);
	top: 5px;
	left: 7px;
	width: 17px;
	height: 13px;
	padding-right: 6px;
}

/* --- 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-content-text-mix-color); 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; }

/* allow quest links to wrap in references */
.reference-text .questlink { white-space:initial; }

/* --- 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(--theme-accent-color);
	padding:0ex 1ex 0.5ex;
	border-image:linear-gradient(to top,var(--theme-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; }

/* Option to allow line breaks in links */
.break .itemlink { white-space:normal; }

/**** 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(--theme-header-background-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, .htt .wtooltip, .wtooltip a { color: #f0f0f0; }
.wtooltip .outericon { position: absolute; left: -38px; top: 0; }
.wtooltip a:visited, .tooltip-content a:visited, .wtooltip a:hover, .tooltip-content a:hover { 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; }

/* Tag colors */
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, .tag, .tag.blue, .htt .tag.blue a, .tag.blue a, .tag.blue a:hover, .tag.blue a:visited { color: #71d5ff; } /* the default color for tags; 66bbff */
.tag.heroic, .tag.heroic a, .tag.heroic a:hover, .tag.heroic a:visited, .tag.green, .tag.green a, .tag.green a:hover, .tag.green a:visited { color: #00ff00; } /* difficulty color and current season color */
.tag.gray, .tag.gray a, .tag.gray a:hover, .tag.gray a:visited { color: #7A7A7A; } /* past season color, e.g. Dragonflight Season 3 */
.tag.flavor, .tag.flavor a, .tag.flavor a:hover, .tag.flavor a:visited { color: #ffd517; } /* Remix: Pandaria */
.tag.red, .tag.red a, .tag.red a:hover, .tag.red a:visited { color: #e01f21; } /* desc3 param on itemtip */

/* specific tags */
li.socket, li.socket a, li.socket a:visited, li.socket a:hover { color: #999; }
.tag.supplies, .tag.supplies a, .tag.supplies a:hover, .tag.supplies a:visited { color: #88AAFF; } /* Ember Court, Queen's Conservatory, Korthian Relics, Dragon Isles Supplies */
.tag.ascended, .tag.ascended a, .tag.ascended a:hover, .tag.ascended a:visited { color: #37b2ff; } /* Ascended Crafting, Pickpocketing */
.tag.module, .tag.module a, .tag.module a:hover, .tag.module a:visited { color: #ff8040; } /* Tinker Module */
.tag.stone, .tag.stone a, .tag.stone a:hover, .tag.stone a:visited { color: #ffab00; } /* Primordial Stone */
.tag.frost, .tag.frost a, .tag.frost a:hover, .tag.frost a:visited { color: #1C90E1; } /* Frost gems */
.tag.air, .tag.air a, .tag.air a:hover, .tag.air a:visited { color: #d9fcff; } /* Air gems */
.tag.fire, .tag.fire a, .tag.fire a:hover, .tag.fire a:visited { color: #F95B19; } /* Fire gems */
.tag.earth, .tag.earth a, .tag.earth a:hover, .tag.earth a:visited { color: #805B4D; } /* Earth gems */
.tag.toxic, .tag.toxic a, .tag.toxic a:hover, .tag.toxic a:visited { color: #9EC51E; } /* toxic potions, e.g. Phial of Icy Preservation */
.tag.shadowflame, .tag.shadowflame a, .tag.shadowflame a:hover, .tag.shadowflame a:visited { color: #d642a6; } /* Shadowflame Suffused, e.g. Rashon, the Immortal Blaze */
.tag.ruby, .tag.ruby a, .tag.ruby a:hover, .tag.ruby a:visited { color: #EA4B4B; } /* Radiant Ruby */
.tag.emerald, .tag.emerald a, .tag.emerald a:hover, .tag.emerald a:visited { color: #43E023; } /* Extravagant Emerald */
.tag.onyx, .tag.onyx a, .tag.onyx a:hover, .tag.onyx a:visited { color: #B622C6; } /* Ostentatious Onyx */
.tag.sapphire, .tag.sapphire a, .tag.sapphire a:hover, .tag.sapphire a:visited { color: #23ABE0; } /* Stunning Sapphire */
.tag.amber, .tag.amber a, .tag.amber a:hover, .tag.amber a:visited { color: #F89A1F; } /* Ambivalent Amber */

/* Season of Discovery tags */
.tag.bloodied, .tag.bloodied a, .tag.bloodied a:hover, .tag.bloodied a:visited { color: #C41E3A; }
.tag.core-forged, .tag.core-forged a, .tag.core-forged a:hover, .tag.core-forged a:visited { color: #FFAC00; }
.tag.draconic, .tag.draconic a, .tag.draconic a:hover, .tag.draconic a:visited { color: #FF00B3; }
.tag.shadowflame-sod, .tag.shadowflame-sod a, .tag.shadowflame-sod a:hover, .tag.shadowflame-sod a:visited { color: #5280FF; }
.tag.timeworn, .tag.timeworn a, .tag.timeworn a:hover, .tag.timeworn a:visited { color: #CD7F32; }
.tag.void-touched, .tag.void-touched a, .tag.void-touched a:hover, .tag.void-touched a:visited { color: #EA50FF; }
.tag.sanctified, .tag.sanctified a, .tag.sanctified a:hover, .tag.sanctified a:visited { color: #34FDF0; }
.tag.scarlet, .tag.scarlet a, .tag.scarlet a:hover, .tag.scarlet a:visited { color: #EC6340; }

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: var(--flavor-color); }
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 li, li.setbonus a, li.setbonus a:visited, .htt .tooltip-content .setbonus, .htt .tooltip-content .setbonus li, .htt .tooltip-content .setbonus a, .htt .tooltip-content .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; margin: unset; margin-left:5px; clear: unset; }
.awaytip { float: left; margin: unset; clear: unset; }
@media(max-width:600px) {
	.hometip { float: none; margin: auto; clear: both; }
	.awaytip { float: none; margin: auto; clear: both; }
}
.createline > .itemtooltip, .createline > .abilitytooltip { background: transparent; border: none; font-size: 0.90em; margin: 0.75em 0; padding: 0; margin-right: 3em; }
.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}
.mw-parser-output table.infobox, .mw-parser-output table.darktable {
	display: table;
	overflow: auto;
	max-width: 100%;
}

@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 .tabber__header .tabber__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(--theme-border-color);
	background-color: var(--theme-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(--theme-background-color); /* Background color */
}
.navbox-list {
	line-height: 1.8em;
	border-color: var(--theme-background-color); /* Must match background color */
}
.navbox th,
.navbox-title {
	background: var(--theme-header-background-color); /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
	background: var(--theme-background-color--secondary); /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
	background: var(--theme-background-color--secondary); /* Level 3 color */
}
.navbox-even {
	background: var(--theme-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;
}

/* Fix color of brackets around the collapse toggle text */
.mw-collapsible-toggle-default::before, .mw-collapsible-toggle-default::after {
	color:#fff;
}

/* 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;
}

/* darktable style */
.darktable, .darkbox, div#content table.wikitable, div#content table.cargoTable {
	border: 1px solid var(--theme-border-color);
	padding: 5px;
	background: var(--theme-background-color);
	margin: 0.5em 0em 1em 0.5em;
}
table.wikitable, table.cargoTable { border-collapse: unset; }
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td,
.cargoTable > tr > th, .cargoTable > tr > td, .cargoTable > * > tr > th, .cargoTable > * > tr > td { border: none; }
.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,
div#content table.wikitable > tr > th, div#content table.wikitable > * > tr > th,
div#content table.cargoTable > tr > th, div#content table.cargoTable > * > tr > th {
	background-color: var(--theme-header-background-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,
div#content table.wikitable tr:not(:first-child) th,
div#content table.cargoTable tr:not(:first-child) th { background-color: var(--theme-header-background-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(--theme-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(--theme-background-color-alt); }

table.zebra > tbody > tr:nth-child(2n+1),
table.zebra.darktable > tbody > tr:nth-child(2n+1),
table.zebra.wikitable > tbody > tr:nth-child(2n+1),
table.zebra.darkbox > tbody > tr:nth-child(2n+1),
table.filehistory > tbody > tr:nth-child(2n+1) {
	background-color: var(--theme-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(--theme-background-color--tertiary); }

/* disambig, i-note design ({{t|Section}}) */
.greybar {
	background-color: var(--theme-background-color-alt);
	border-top: 1px solid var(--theme-border-color);
	border-bottom: 1px solid var(--theme-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(--theme-border-color);
	border-left: 10px solid #228b22;
	border-collapse: collapse;
	background-color: var(--theme-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; }
.ambox-emerald { border-left: 10px solid #50C878; }

/* {{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, .qc-poor a:visited, .qc-poor a:hover { color: var(--quality-color--poor); }
.qc-common, .qc-common a, .qc-common a:visited, .qc-common a:hover { color: var(--quality-color--common); }
.qc-uncommon, .qc-uncommon a, .qc-uncommon a:visited, .qc-uncommon a:hover { color: var(--quality-color--uncommon); }
.qc-rare, .qc-rare a, .qc-rare a:visited, .qc-rare a:hover { color: var(--quality-color--rare); }
.qc-epic, .qc-epic a, .qc-epic a:visited, .qc-epic a:hover { color: var(--quality-color--epic); }
.qc-legendary, .qc-legendary a, .qc-legendary a:visited, .qc-legendary a:hover { color: var(--quality-color--legendary); }
.qc-artifact, .qc-artifact a, .qc-artifact a:visited, .qc-artifact a:hover { color: var(--quality-color--artifact); }
.qc-heirloom, .qc-heirloom a, .qc-heirloom a:visited, .qc-heirloom a:hover,
.qc-token, .qc-token a, .qc-token a:visited, .qc-token a:hover { color: var(--quality-color--heirloom); }
.qc-enchant, .qc-enchant a, .qc-enchant a:hover, .qc-enchant a:visited { 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, .druid a:hover, .druidalt a:hover, .druid a:visited, .druidalt a:visited { color: #ff7f0a; }

.hunter, .hunteralt { color: white; }
.hunter { background-color: #445533; }
.hunteralt { background-color: #334422; }
.hunter a, .hunteralt a, .hunter a:hover, .hunteralt a:hover, .hunter a:visited, .hunteralt a:visited { color: #ABD473; }

.mage, .magealt { color: white; }
.mage { background-color: #4488aa; }
.magealt { background-color: #336677; }
.mage a, .magealt a, .mage a:hover, .magealt a:hover, .mage a:visited, .magealt a:visited { color: #66ccff; }

.paladin, .paladinalt { color: white; }
.paladin { background-color: #883355; }
.paladinalt { background-color: #662244; }
.paladin a, .paladinalt a, .paladin a:hover, .paladinalt a:hover, .paladin a:visited, .paladinalt a:visited { color: #ff99cc; }

.priest, .priestalt { color: white; }
.priest { background-color: #777777; }
.priestalt { background-color: #444444; }
.priest a, .priestalt a, .priest a:hover, .priestalt a:hover, .priest a:visited, .priestalt a:visited { color: #bbbbbb; }

.rogue, .roguealt { color: white; }
.rogue { background-color: #555500; }
.roguealt { background-color: #444400; }
.rogue a, .roguealt a, .rogue a:hover, .roguealt a:hover, .rogue a:visited, .roguealt a:visited { color: #fff569; }

.shaman, .shamanalt { color: white; }
.shaman { background-color: #112277; }
.shamanalt { background-color: #112255; }
.shaman a, .shamanalt a, .shaman a:hover, .shamanalt a:hover, .shaman a:visited, .shamanalt a:visited { color: #2459FF; }

.warlock, .warlockalt { color: white; }
.warlock { background-color: #331155; }
.warlockalt { background-color: #220044; }
.warlock a, .warlockalt a, .warlock a:hover, .warlockalt a:hover, .warlock a:visited, .warlockalt a:visited { color: #cc99ff; }

.warrior, .warrioralt { color: white; }
.warrior { background-color: #775533; }
.warrioralt { background-color: #443322; }
.warrior a, .warrioralt a, .warrior a:hover, .warrioralt a:hover, .warrior a:visited, .warrioralt a:visited { color: #C79C6E; }

.deathknight, .deathknightalt { color: white; }
/* .deathknight { background-color: #; } */
/* .deathknightalt { background-color: #; } */
.deathknight a, .deathknightalt a, .warrior a:hover, .warrioralt a:hover, .warrior a:visited, .warrioralt a:visited { color: #C41E3A; }

.monk, .monkalt { color: white; }
/* .monk { background-color: #; } */
/* .monkalt { background-color: #; } */
.monk a, .monkalt a, .monk a:hover, .monkalt a:hover, .monk a:visited, .monkalt a:visited { color: #008467; }

.demonhunter, .demonhunteralt { color: white; }
/* .demonhunter { background-color: #; } */
/* .demonhunteralt { background-color: #; } */
.demonhunter a, .demonhunteralt a, .demonhunter a:hover, .demonhunteralt a:hover, .demonhunter a:visited, .demonhunteralt a:visited { color: #A330C9; }

.evoker, .evokeralt { color: white; }
/* .evoker { background-color: #; } */
/* .evokeralt { background-color: #; } */
/* .evoker a, .evokeralt a { color: #; } */

/* Resource colors */
.rc-energy, .rc-energy a, .rc-energy a:visited, .rc-energy a:hover { color: var(--resource-color--energy); }
.rc-focus, .rc-focus a, .rc-focus a:visited, .rc-focus a:hover { color: var(--resource-color--focus); }
.rc-mana, .rc-mana a, .rc-mana a:visited, .rc-mana a:hover { color: var(--resource-color--mana); }
.rc-rage, .rc-rage a, .rc-rage a:visited, .rc-rage a:hover { color: var(--resource-color--rage); }

/* 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); }
.tag.singing-thunder, .tag.singing-thunder a, .gemattrib-singing-thunder { color: #FFF569; } /* Singing Thunder Citrine */
.tag.singing-sea, .tag.singing-sea a, .gemattrib-singing-sea { color: #3FC7EB; } /* Singing Sea Citrine */
.tag.singing-wind, .tag.singing-wind a, .gemattrib-singing-wind { color: #F58CBA; } /* Singing Wind Citrine */

/* 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(--theme-background-color--secondary); border-color: var(--theme-border-color); }
table.wwusrbox td.left, table.wwusrbox td.right { background: var(--theme-background-color--tertiary); }

/* Book Styling */
div.book {
	margin: 0.5em;
	border: 1px solid var(--theme-border-color);
	background:var(--theme-background-color);
}

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;
}

div.bookTitle {
    color: var(--theme-accent-color-bright);
    background-color: var(--theme-background-color--secondary);
    font-size: 1.25em;
    font-weight: bold;
    padding: 0.3em 0.4em;
    border-bottom:1px solid var(--theme-border-color);
}

div.bookBody {
    font-size: 0.90em; 
    padding: 0.15em 0.5em;
    word-wrap: break-word;
}

/* 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, .rep-stranger, .rep-pal { color: var(--rep-color--neutral); }
.rep-friendly, .rep-buddy { color: var(--rep-color--friendly); }
.rep-honored, .rep-friend { color: var(--rep-color--honored); }
.rep-revered, .rep-goodfriend { color: var(--rep-color--revered); }
.rep-exalted, .rep-paragon, .rep-bestfriend { color: var(--rep-color--exalted); }

/* Buffs & Debuffs, Template:Effecttip */
div.bufftip { border-width: 1px; border-style: solid; border-color: var(--tooltip-border-color); }
div.debuff, .htt div.debuff { border-color: var(--debuff-default); }
div.debuffmagic, .htt div.debuffmagic { border-color: var(--debuff-magic); }
div.debuffcurse, .htt div.buffweapon { border-color: var(--debuff-curse); }
div.debuffdisease, .htt div.debuffdisease { border-color: var(--debuff-disease); }
div.debuffpoison, .htt div.debuffpoison { border-color: var(--debuff-poison); }

/* Achievements */
.achievementlink { color: var(--achievementlink-color); }

/* Faction table */
.factiontable { background-color: var(--theme-background-color--secondary); border: 2px solid var(--theme-background-color--secondary); }
.factiontable tr { background-color: var(--theme-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); }

/* Guild table */
.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 {
	border: solid 1px var(--theme-border-color);
	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); }

/* in-header version tabs (faction disambiguation, versions, etc) */
#versions-header-tabs {
	margin: 0 0.5em 0 1em;
	font-size: 70%;
	font-weight:normal;
	vertical-align: 3px;
}
#versions-header-tabs a {
	background: var(--theme-background-color--secondary);
	color: var(--theme-content-text-mix-color);
	border: 1px solid var(--theme-border-color);
	white-space: nowrap;
	padding: 1px 0.75em;
}
#versions-header-tabs .activetab {
	background: var(--theme-background-color);
	color: var(--theme-text-color);
}
#versions-header-tabs a:hover, #versions-header-tabs a:focus, #versions-header-tabs a:active { text-decoration:none; }
#versions-header-tabs a.inactivetab:hover { background: var(--theme-background-color--tertiary); }
#versions-header-tabs.item-versions a.inactivetab { border: 1px solid #404040; }
#versions-header-tabs.item-versions a.activetab { border: 1px solid var(--theme-accent-color); }
#versions-header-tabs .activetab.alliancetab {
	background-color: var(--alliance-background-color);
	border-color: var(--alliance-text-color);
	color: var(--alliance-text-color);
}
#versions-header-tabs .activetab.hordetab {
	background-color: var(--horde-background-color);
	border-color: var(--horde-text-color);
	color: var(--horde-text-color);
}

/* 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(--theme-border-color); background-color: var(--theme-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).
 * @source https://www.mediawiki.org/wiki/Snippets/Horizontal_lists
 * @revision 9 (2016-08-10)
 * @author [[User:Edokter]]
 */
.hlist dl,
.hlist ol,
.hlist ul {
	margin: 0;
	padding: 0;
}

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

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

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

/* 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;
}

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

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

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

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

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

.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
	content: " (" counter(listitem) "\a0";
}

/* Unbulleted lists */
.plainlist ul {
	line-height: inherit;
	list-style: none none;
	margin: 0;
}
.plainlist ul li { margin-bottom: 0; }

/* side-by-side typically for multiple tables */
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; }

/* 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.wowhead-mop { background-image: url(/images/3/3a/ElinkIcon-wowhead-mists.png); background-size: 22px; } /* MoP 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.wago { background-image: url(/images/2/2c/ElinkIcon-wago.png); background-size: 22px; background-position: left; }
ul.elinks li.warcraftpets { background-image: url(/images/9/98/ElinkIcon-warcraftpets.png); }

/* Template: alink/hlink/nlink */
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;
}
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, .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; }

/* 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(--theme-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 .ClassLink a:visited,
.theme-dark .ProfLink a, .theme-dark .ProfLink a:visited,
.theme-dark .RaceLink a, .theme-dark .RaceLink a:visited {
	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;
	background-color: var(--theme-background-color--secondary);
	border-left-width: 10px;
	margin: 0;
	position: relative;
	overflow: hidden;
	height: 40px;
	top: -14px;
	width: 40px;
}
.skin-vector .mw-indicator .amdiv .amdiv-text { font-size: 85%; margin: 0 5px; }

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;
}

/* Table left-alignment */
.col1-left td:first-child,
.col2-left td:nth-child(2),
.col3-left td:nth-child(3),
.col4-left td:nth-child(4),
.lastCol-left td:last-child {
	text-align: left;
}

/* [[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;
}

.dialogue-child.noborder { border:none; }

/* [[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(--theme-background-color--tertiary);
}

/* EmbedVideo */
.embedvideo-loader a,
.embedvideo-loader a:hover,
.embedvideo-loader a:visited {
    color:#fff;
}
.embedvideo-loader__title {
    padding-top:18px;
    padding-left:18px;
}
.embedvideo-loader__link {
    font-size:18px;
    font-weight:normal;
}
/* Temp - https://github.com/StarCitizenWiki/mediawiki-extensions-EmbedVideo/issues/96 */
.embedvideo, .embedvideo-consent { background-size: cover; }
.evlplayer[data-service="videolink"] { display: none; } /* On page load, prevent the block appearing briefly before the extension's css is loaded */
.videoplayer .evlplayer[data-service="videolink"] { display: block; } /* prevent default behavior */

/* 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(--theme-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(--theme-border-color);
	border-bottom: 1px solid var(--theme-border-color);
}

@media(max-width:600px) {
	.pseudo-ambox { padding-bottom: 1em; }
	.pseudo-ambox-content {
		align-items: center;
		background: var(--theme-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; }
}

/* [[Template:Reptable Spanbar]] */
.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(--theme-background-color);
	border: 1px solid var(--theme-accent-color-bright);
	border-radius: 5px;
	margin: auto;
	text-align: center;
	width: 70%;
	padding: 3px;
}

/* force updated logo */
.mw-wiki-logo {
	background-image: url(https://secrets.warcraftwatch.com/w/images/0/0f/Site-Logo.png);
}

/* [[Template:Color]] */
.color__splotch {
	display:inline-block;
	height:1em;
	width:1em;
	box-sizing:border-box;
	vertical-align:text-top;
	border-radius:50%;
	border:1px solid var(--theme-border-color); 
}

/* [[Template:Listen]] */
.listen {
	background-color: var(--theme-background-color--secondary);
	border: 1px solid var(--theme-border-color);
	color: var(--theme-text-color);
}
.listen-embedded {
	background-color: transparent;
	border-color: transparent;
}
.listen-embedded .listen-file-header {
	text-align: center;
	border-top: solid 1px var(--theme-border-color);
}
.infobox .listen-embedded { margin: 0 auto; }

/* (temp) Main page revamp - [[User:Surafbrov/Todo/MainPage]] */
.mpcontentbox .mp-list {
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
}
.mpcontentbox .mp-heading {
	margin-bottom: 10px;
}
.responsive-columns {
	columns: 3;
	column-gap: 0.5em;
}
.responsive-columns ul li {
	text-align: left;
	margin-bottom: 10px;
}

@media screen and (max-width: 715px) {
	.nomobile { display: none; } /* Template:Wowapi */
}
Retrieved from "https://secrets.warcraftwatch.com/w/index.php?title=MediaWiki:Common.css&oldid=7345"