Common.css

/** GAMEPEDIA FIXES **/
/* It's also a pixel too far down on high-density displays */
#left-navigation, #right-navigation {margin-top: 2.49em}

/* JS shifts navigation below content when a tab in a small window is opened in the background. */
@media screen and (min-width: 721px) {
  #mw-panel { position: absolute !important; }
}

/* Logo clips content area when left navigation is squeezed */
@media screen and (max-width: 981px) {
  #global-wrapper #p-logo {left: -0.1em}
}

/* Gamepedia netbar is too close to wiki logo */
#global-wrapper #p-logo {top: -150px}

/* Netbar: pad right-most elements to avoid awkward scroll bar interaction */
#netbar .netbar-box.user {padding: 0 1.5em}
.netbar-box.user > .dropdown > li {padding-right: 1.5em; padding-left: 0.75em}

/* visual centering of alerts/notices buttons in netbar */
#netbar .netbar-box.echo {padding-right: 0.8em}

/* Special:SpecialPages text getting cut off */
.mw-specialpages-table {margin:0px !important }
.atflb, .btflb, .footer-ad-medRect {overflow: hidden}

/* Notification positioning is awkward in combination with the top bar */
#mw-notification-area {top: 1.5em; right: 1px}
.mw-notification {font-size: 0.90em}

/* Header flicker as collapsible navigation is slow to load */
#mw-panel #p-portals #p-Navigation_Portals > div.body {background-image: none; padding-top: 0}
#mw-panel.collapsible-nav div.portal:not(.first) {margin-left: 0}


/** ACTUAL SITE CSS **/

/* Twitter/Facebook navigation bar links */
#n-Twitter, #n-Facebook {display: inline; position: relative; top: -1px}
#n-Facebook::before {content: " / "; color: #666}

/* quick fix for darker red links problem */
a.new { color: #F05048; }

/* Default tables are white; white is bad. */
table { background-color: transparent; }

/* to remove the external link icon from sortable tables */
#bodyContent a.sortheader { background: none; padding-right: 0; }

/* Align inline images to text */
p img {vertical-align: text-bottom}

/* --- RC LIST --- */
.newpage { color: #A56C40; }

/* --- SMALLER TEMPLATES USED TEXT --- */

.templatesUsed ul { font-size:90%; }

/* --- [[SPECIAL:ALLPAGES]], CATEGORY REDIRECT TWEAKS --- */

.redirect-in-category, .allpagesredirect { font-style: italic; }
.allpagesredirect:after { color: #808080; 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;
}

/* Highlight clicked reference in blue to help navigation */
ol.references > li:target { background-color: #ccf; }
sup.reference:target { background-color: #ccf; }

.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: #FF9900;
     padding:0ex 1ex 0.5ex;
     border-image:linear-gradient(to top,#FF9900,rgba(0,0,0,0)) 1 20%;
   }

/* --- OTHER TWEAKS --- */

/* background for transparent images when viewed directly */
#file 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(/media/3/34/Wwchecker.svg) repeat scroll 0% 0%; }

/* Prevents line breaks in links, used for navboxes */
.nowraplinks a, .nobreak { white-space: nowrap; }


/**** TEMPLATES ****/

/* --- 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: #ccf;
   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 #b0b0b0 solid;
 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 {color: #f0f0f0;}
.wtooltip .outericon {position: absolute; left: -38px; top: 0}

/* itemtooltip and others MUST be used in conjunction with wtooltip */
.itemtooltip { width: 18em; 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, .htt .tooltip-content li.socket, .htt .tooltip-content li.socket a {color: #999;}
li.glyph, li.glyph a, .htt .tooltip-content li.glyph, .htt .tooltip-content li.glyph a {color:#71d5ff;}
li.relic, li.relic a, .htt .tooltip-content li.relic, .htt .tooltip-content li.relic a {color:#BFA760;}
li.req, li.req a, .htt .tooltip-content li.req, .htt .tooltip-content li.req a {color: #999;}
li.locked, li.locked a, .htt .tooltip-content li.locked, .htt .tooltip-content li.locked a {color: #d22;}
li.bonus, li.bonus a, .htt .tooltip-content li.bonus, .htt .tooltip-content li.bonus a {color: #0f0;}
li.flavor, li.flavor a, .htt .tooltip-content li.flavor, .htt .tooltip-content li.flavor a, .wtooltip li.description, .wtooltip li.description a {color: #ffd517;}
li.detail, li.detail a, .htt .tooltip-content li.detail, .htt .tooltip-content li.detail a {color: #66c;}
li.set, li.set a, .htt .tooltip-content li.set, .htt .tooltip-content li.set a {color: #ffd100;}
li.setbonus, li.setbonus a, .htt .tooltip-content li.setbonus, .htt .tooltip-content li.setbonus a {color: #999;}
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 {max-width: 22em; background-color: rgba(11, 16, 41, 0.9) }

.htt .ach-tt {max-width: 35em !important;}

#templatetfb .tooltip-content { max-width: 300px !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}
.tt-icon-azerite {     
	width: 32px;
    height: 32px;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(/media/a/ab/Icon-Azerite.png);
    background-size: cover;
}
.hometip > ul > .awayline, .awaytip > ul > .homeline {display: none}
.wtooltip.awaytip {font-size: 0.85em}
.hometip {float: right}
.awaytip {float: left}
.createline > .itemtooltip {background: transparent; border: none; font-size: 0.90em; margin: 0.75em 0; padding: 0}
.awaytip > ul > .createline > .itemtooltip {margin: 0.90em 0}

.ajaxttlink > img, .linkicon img {vertical-align: text-bottom}

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

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

/* --- TABLE DESIGNS --- */
/* Default style for navigation boxes */
.navbox {                     /* Navbox container style */
   border: 1px solid #aaa;
   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: #fdfdfd;      /* Background color */
}
.navbox-list {
   line-height: 1.8em;
   border-color: #fdfdfd;    /* Must match background color */
}
.navbox th,
.navbox-title {
   background: #ccccff;      /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
   background: #ddddff;      /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
   background: #e6e6ff;      /* Level 3 color */
}
.navbox-even {
   background: #f7f7f7;      /* 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 #aaa;
 padding: 5px;
 background: #F9F9F9;
 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: #ccf;
 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: #ddf; }
.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 */
.title {
 background-color: #ddf;
 text-align:center;
 font-weight:bold;
 padding: 1px 2px;
}

.alt, .rowtitle { background-color: #e9e9ff; }
table.zebra > tbody > tr:nth-child(2n+1) {background-color: #e9e9ff; }

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:#DDD; }

/* disambig, i-note design */
.greybar {
 color: #000;
 background-color: #DDD;
 border-top: 1px #606060 solid;
 border-bottom: 1px #606060 solid;
}

/* 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%;
 width: 80%;
 margin: 0 auto 2px auto;
 border: 1px #AAA solid;
 border-left: 10px solid #228b22;
 border-collapse: collapse;
 background-color: #EEE;
}
.ambox.ambox-tiny { font-size: 90%; width: auto; margin: 2px 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; }
.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:#0070af; }

/* text colors: say, yell, emote, whisper */
.text-say {color:#CC9900;}
.text-yell {color:#FF4040;}
.text-emote {color:#F87431;}
.text-whisper {color:#F8B0DE;}
.text-bossemote {color:#f0d000;}

/* Item Quality Colors */
.qc-poor, .qc-poor a { color: #9D9D9D; }
.qc-common, .qc-common a { color: #000000; } /* common is normally white, but white on white is bad */
.wtooltip .qc-common, .wtooltip .qc-common a, .tooltip-content .qc-common {color:#fff} /* but we want it white inside tooltips. */
.qc-uncommon, .qc-uncommon a { color: #27BF13 }
.wtooltip .qc-uncommon, .wtooltip .qc-uncommon a {color: #1EFF00}
.qc-rare, .qc-rare a { color: #0070FF; }
.qc-epic, .qc-epic a { color: #a335ee; }
.qc-legendary, .qc-legendary a { color: #ff8000; }
.qc-artifact, .qc-artifact a { color: #BFA760; }
.qc-heirloom, .qc-heirloom a, .qc-token, .qc-token a { color: #00CCFF; }
.qc-enchant, .qc-enchant a {color: #E6BB00}

.abilitylink {color: #2BA2D9}
.talentlink {color: #4e96f7}
.currencylink {color:#00AA00}

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

/* Class Colors */
.cc-druid, .cc-druid a { color: #FF7D0A; }
.cc-hunter, .cc-hunter a { color: #ABD473; }
.cc-mage, .cc-mage a { color: #69CCF0; }
.cc-paladin, .cc-paladin a { color: #F58CBA; }
.cc-priest, .cc-priest a { color: gray; } /* priest is white, but not on light skins... see darkvector.css */
.cc-rogue, .cc-rogue a { color: #CC9900; }
.cc-shaman, .cc-shaman a { color: #2459FF; }
.cc-warlock, .cc-warlock a { color: #9482CA; }
.cc-warrior, .cc-warrior a { color: #C79C6E; }
.cc-deathknight, .cc-deathknight a { color: #C41E3A; }
.cc-monk, .cc-monk a { color: #008467; } 
.cc-demonhunter, .cc-demonhunter a { color: #A330C9; } /* proper color in darkvector */

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

/* 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 */
table.wwusrbox {float: left; margin: 0.2em; padding: 0; border-width: 1px; border-style: solid;}
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.90em;}

table.wwusrbox {border-color: #aaa; background: #f8f8f8;}
table.wwusrbox td.left, table.wwusrbox td.right {background: #d8d8d8;}

/* - Book Styling */
div.book { margin: 0.5em; border: 1px solid #808080}
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: #ac1d1d}
.rep-hostile {color: #ac0000}
.rep-unfriendly {color: #AB4918}
.rep-neutral {color: #acac00}
.rep-friendly {color: #00ac00}
.rep-honored {color: #00AB5B}
.rep-revered {color: #00AB89}
.rep-exalted {color: #00acac}

/* Buffs & Debuffs */
div.bufftip {border-width: 1px; border-style: solid; border-color: #aaaaaa;}
div.debuff {border-color: #cc0000;}
div.debuffmagic {border-color: #3399ff;}
div.debuffcurse, div.buffweapon {border-color: #9900ff;}
div.debuffdisease {border-color: #996600;}
div.debuffpoison {border-color: #009900;}

.achievementlink {color: #CC9900;}

.factiontable {background-color: #f0f0f0; border: 2px solid #f0f0f0}
.factiontable tr {background-color: white}
.factiontable.alliance th, .factiontable.alliance td.factionbg {background-color: #CCE4FF}
.factiontable.horde th, .factiontable.horde td.factionbg {background-color: #FFD4CC}

.guildtable {border-spacing: 0 1px}
.guildtable td {padding: 1px 0.5em}
.guildtable th {padding: 2px 1em}


/* Main page-related styles */
body.page-Wowpedia hr {
color: #444;
}
body.page-Wowpedia #bodyContent > #siteSub + #contentSub + #jump-to-nav + #mp-outer-container  {margin-top: -2em}
body.page-Wowpedia .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}
.mpcontentbox-table { width:100%; }
.bg-darkblue {background:#F0F4FF; border: 1px solid #CFD4E6}
.bg-darkgreen {background:#F0FFF5; border: 1px solid #CFE6D6}
.bg-darkgray {background:#F0F0F0; border: 1px solid #D9D9D9}
.bg-darkred {background:#FFF7F0; border: 1px solid #E6DACF}

#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: #f5f5f5; white-space: nowrap; color: black; padding: 0 0.25em}
#versions-header-tabs a:hover { text-decoration:none; }
#versions-header-tabs .inactivetab:hover {background: #d8d8d8}
#versions-header-tabs.fswitch a {background: transparent; color: #606060}
#versions-header-tabs .activetab.alliancetab {color: #214DA6}
#versions-header-tabs .activetab.hordetab {color: #A63721}
#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 #c0c0c0; color: #505050}
#versions-header-tabs.item-versions a.activetab {border: 1px solid #73ACE6}

/* Recent changes, Special:Filelist arrows */
.mw-arr-r { background-image: url('/media/2/26/Icon-next-12x12.png'); }
.mw-arr-d, .mw-sort-desc { background-image: url('/media/6/68/Icon-down-12x12.png'); }
.mw-arr-u, .mw-sort-asc { background-image: url('/media/7/79/Icon-up-12x12.png'); }
.mw-arr-l { background-image: url('/media/2/20/Icon-back-12x12.png'); }

/* 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 #aaa; background-color: #f9f9f9; 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}

#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('/media/6/6e/Icon-wowhead-22x22.png'); }
ul.elinks li.wowheadc { background-image: url('/media/a/a0/Icon-wowheadc-22x22.png'); }
ul.elinks li.allakhazam { background-image: url('/media/7/7c/Icon-allakhazam-22x22.png'); }
ul.elinks li.thottbot { background-image: url('/media/f/ff/Icon-thottbot-22x22.png'); }
ul.elinks li.wowus { background-image: url('/media/9/9c/Icon-wowus-22x22.png'); }
ul.elinks li.sigrie { background-image: url('/media/b/ba/Icon-mmochampion-22x22.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('/media/2/21/Alliance_15.png'); }
span.horde-link { background-image: url('/media/c/c4/Horde_15.png'); }
span.neutral-link { background-image: url('/media/c/cb/Neutral_15.png'); }

/* display:none; */
body.page-Wowpedia.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}
.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}
.broken.coords-link sup {background-color: #FFB0B0}

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

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

/* Other Stuff (?!) */
.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 { 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);
  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;
  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); }

#ca-purge { display:none; }

div#mw-panel div.portal li a[href="https://discord.gg/gnGQcAk"] {
    background: url(https://discordapp.com/api/guilds/572810203238629387/embed.png) no-repeat;
    color: transparent !important;
    display: inline-block;
    height: 20px;
    width: 119px;
    margin-top: 10px;
}

@media screen and (max-width:720px) {
  div#mw-panel {
    top:0;
  }
}

.ClassLink, .ProfLink, div.RaceLink { /* Template:Class, Template:Profession, Template:Race */
	width: 100px;
	text-align: center;
	margin-top: 20px;
}

.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: -17px;
    overflow:hidden;
    width: 40px;
}