User:Cryebunnie/vector.css: Difference between revisions

From Final Fantasy XIV Online Wiki
Jump to navigation Jump to search
← Older editNewer edit →
Cryebunnie (talk | contribs)
8,973 edits
No edit summary
Replaced content with "→New font for headers & navigation to replace EasonPro: @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP:wght@100;200;300;400;500;600;700&display=swap'); :root { --text-color: #36414f; --font-family-body: "IBM Plex Sans JP", sans-serif; --font-family-heading: "IBM Plex Sans JP", sans-serif; } →Adjust padding on sidebar to account for white background: #mw-panel .portal { font-family: "IBM Plex Sans JP", sans-serif; margin-bo..."
Tag: Replaced
Line 1: Line 1:
/* Font for in-game special characters - https://github.com/ewwwin/ffxiv-symbol-fonts */
@import url("https://ewwwin.github.io/ffxiv-symbol-fonts/FFXIV_Lodestone_SSF.css");
/* New font for headers & navigation to replace EasonPro */
/* New font for headers & navigation to replace EasonPro */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP:wght@100;200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP:wght@100;200;300;400;500;600;700&display=swap');
/* Render in-game special characters in wikitext output */
.mw-parser-output { font-family: "FFXIV_Lodestone_SSF", sans-serif }


:root {
:root {
  --link-color: #05f;
   --text-color: #36414f;
   --text-color: #36414f;
  --link-visited-color: #795cb2;
  --navbox-data-row-even-bg: #F7F7F7;
  --navbox-header-bg: #CCCCFF;
  --navbox-label-bg: #DDDDFF;
  --navbox-label-border: 2px solid #FDFDFD;
  --navbox-inner-border: 2px solid #FDFDFD;
  --navbox-sublabel-bg: #DDDDFF;
  --tooltip-border: #A3A9B1;
  --navbox-bg: #FDFDFD;
  --dialogue-block-bg: #F2F2F2;
  --dialogue-line-bg: #e8e8e8;
  --dialogue-standalone-bg: var(--navbox-header-bg);
  --dialogue-option-bg: var(--navbox-sublabel-bg);
  --dialogue-optional-border: #008eff;
  --dialogue-cutscene-bg: #b2ddff;
}
/* Newly Added After Server Upgrade Start */
/* display the correct main page on desktop and mobile */
/* default desktop */
.desktop-frontpage { display: block; }
.mobile-frontpage  { display: none; }
/* phones, narrow screens */
@media (max-width: 720px) {
.desktop-frontpage { display: none !important; }
.mobile-frontpage  { display: block !important; }
}


/* make the Mobile infobox above content */
  --font-family-body: "IBM Plex Sans JP", sans-serif;
.skin-minerva .infobox-n{
  --font-family-heading: "IBM Plex Sans JP", sans-serif;
float:none!important;
}
/* Social Profile */
.ns-2 .profile-actions {
clear: both;
}
.ns-2 div#profile-top{
height:80px;
}
.ns-2 .user-section-heading {
height: 25px;
}
.ns-2 #firstHeading {
display:none;
}
/* Moving the mobile.css for infobox here */
@media (max-width: 768px) {
/***********************************************************************************
FURTHER CUSTOMIZATION
***********************************************************************************/
}
}


/* Adjust padding on sidebar to account for white background */
/* Adjust padding on sidebar to account for white background */
#mw-panel .portal {
#mw-panel .portal {
font-family: "IBM Plex Sans JP", sans-serif;
  font-family: "IBM Plex Sans JP", sans-serif;
margin-bottom: 10px;
  margin-bottom: 10px;
padding: 0.5em 0;
  padding: 0.5rem 0;
direction: ltr;
  direction: ltr;
background: white;
  background: white;
border-radius: 6px;
  border-radius: 6px;
padding: 10px;
  padding: 10px;
font-weight:normal;
  font-weight: normal;
}
 
/* Adjust padding on sidebar to account for white background */
@media screen and (min-width: 982px) {
  #mw-panel {
    padding-left: 0;
  }
}
}


/* Remove bold from sidebar links */
/* Remove bold from sidebar links */
div#mw-panel ul.vector-menu-content-list > li > a {
div#mw-panel ul.vector-menu-content-list > li > a {
  color:#000000;
   font-weight: normal;
   font-weight:normal;
}
}


/* Change personal navigation menu text to white */
/* Change personal navigation menu text and icons to white */
#p-personal {
  color: #FFFFFF;
}
#p-personal a {
#p-personal a {
   color:#FFFFFF;
   color: inherit;
  font-weight:bold
}
}


/* Change color and borders of head */
/* Change color and borders of head */
:root {
  --mw-head-height: 40px;
}
#mw-head-base {
#mw-head-base {
   background: #535353;
   background: #535353;
Line 103: Line 45:
   border-bottom: 0px;
   border-bottom: 0px;
   bottom: 0;
   bottom: 0;
   height: 40px;
   height: var(--mw-head-height);
   margin-top: -41px;
   margin-top: calc(-1 * var(--mw-head-height));
}
}


/* Change font color and weight in head */
/* Change font color and weight in head */
div#mw-head .vector-menu-tabs li a {
div#mw-head .vector-menu-tabs li a,
   color:#ffffff;
.vector-menu-dropdown .vector-menu-heading {
   font-weight:400;
   color: #ffffff;
   font-weight: 400;
 
  /* Center tab text vertically */
  height: var(--mw-head-height);
  padding-block: 0;
  display: flex;
  align-items: center;
}
}


Line 122: Line 71:
/* Change selected tab color and font color in head */
/* Change selected tab color and font color in head */
div#mw-head ul.vector-menu-content-list > li.selected {
div#mw-head ul.vector-menu-content-list > li.selected {
   background-color:#FFFFFF;
   background-color: #FFFFFF;
   color:#000000;
   color: #000000;
   font-weight:600;
   font-weight: 600;
}
 
/* fix watchlink icon overlapping with hidden label text */
div#mw-head .vector-menu-tabs .mw-watchlink.icon a {
  text-indent: 9999px;
}
}


/* Remove left padding of tab menu */
/* Remove left padding of tab menu */
.vector-menu-tabs-legacy {
.vector-menu-tabs-legacy {
    padding-left:0px;
  padding-left: 0px;
}
}


Line 145: Line 99:
/* Change font color of 'More' tab to white */
/* Change font color of 'More' tab to white */
.vector-menu-dropdown .vector-menu-heading {
.vector-menu-dropdown .vector-menu-heading {
    color:white;
  color:white;
  }
 
.mobile-box-header {
font-family: "IBM Plex Sans JP", "Times New Roman", serif;
font-size: 1.5em;
color: #fff;
text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
background-color: #444;
background-image: url(/mediawiki/images/a/aa/Bg_gradient4.jpg) !important;
font-weight: 400;
text-align: center;
}
#mobile-pagewrap {
border: 1px solid #ccc;
}
.mobile-column {
border-right: 1px solid #ccc;
margin-left: -1px;
}
.mobile-second-column {
border-right: none;
}
/* fixes quotation template on mobile */
.quotation-box {
margin-left: 0 !important;
}
/* From Valento */
/* General */
p img {
margin: 0;
}
img {
border: none;
vertical-align: middle;
}
 
/* Removed paragraph from formatting to avoid crunching of body text */
ul,
ol,
dl {
margin-top: 0.7692307692em;
margin-bottom: 0.7692307692em;
line-height: 1.5384615385em;
}
.infobox-n .clear,
.nav .clear,
.recipe-box .clear {
height: 5px;
}
/* Infobox specific */
div.infobox-n {
float: center;
position: relative;
width: 300px;
background: #fff;
font-size: 0.923em;
border: 1px solid #aaa;
margin: 0 0 1em 1em;
padding: 0;
}
div.infobox-n,
div.nav .box {
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
background-image: linear-gradient(top, #fff 0%, #eee 100%);
background-image: -o-linear-gradient(top, #fff 0%, #eee 100%);
background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%);
background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%);
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0, #fff),
color-stop(1, #eee)
);
}
div.infobox-n .icon {
float: right;
position: relative;
z-index: 2;
width: auto;
margin: 5px;
}
div.infobox-n .icon p {
text-align: center;
color: #444;
font-size: 9px !important;
background-color: rgba(255, 255, 255, 0.5);
border-radius: 0.75em;
line-height: 1em;
margin: 0.25em -0.5em;
padding: 2px;
}
div.infobox-n .wrapper {
clear: both;
padding: 0;
}
div.infobox-n .statistics {
text-align: center;
margin: 0 8px;
}
div.statistics span + span {
margin-left: 5px;
}
div.infobox-n .heading,
div.nav .heading {
font-weight: 700;
background-image: url(/mediawiki/images/b/b3/Box_overlay.png) !important;
text-align: center;
border: 1px solid rgba(0, 0, 0, 0.25);
border-bottom-width: 0;
position: relative;
z-index: 1;
font-size-adjust: 0.52;
margin: -1px -1px 5px !important;
}
div.infobox-n .heading {
font-family: "IBM Plex Sans JP", "Times New Roman", serif !important;
font-size: 1.417em !important;
color: #fff !important;
background-color: #444;
text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
line-height: 1.176em;
font-size-adjust: 0.43;
padding: 0.4em !important;
}
div.infobox-n .subheading,
div.nav .subheading {
font-weight: 700;
background-color: #888;
background-image: url("/images/c/cc/Infobox_header_overlay.png") !important;
border-left: 1px solid rgba(0, 0, 0, 0.25);
border-right: 1px solid rgba(0, 0, 0, 0.25);
line-height: 100%;
text-align: center;
position: relative;
margin: 0 -1px !important;
}
div.infobox-n .subheading {
font-family: "IBM Plex Sans JP", "Times New Roman", serif;
font-size: 1.25em !important;
color: #fff !important;
background-color: #444;
text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
z-index: 1;
line-height: 1.333em;
font-size-adjust: 0.43;
padding: 0.567em !important;
}
div.nav dl,
div.infobox-n dl {
margin: 10px 0;
}
div.infobox-n dt {
float: left;
text-align: right;
width: 95px;
line-height: 1em;
font-weight: 700;
clear: left;
border-right: 2px solid #999;
margin: 0 -2px 0 0;
padding: 2px 8px 2px 3px;
}
div.infobox-n dd {
float: left;
width: 175px;
font-weight: 400;
border-left: 2px solid #999;
margin: 0;
padding: 2px 7px;
}
div.infobox-n .image_wrapper {
text-align: center;
padding: 0;
margin: 10px 0;
}
div.infobox-n::after,
div.nav .box::after,
div.infobox-n .heading::after,
div.nav .heading::after,
div.infobox-n .subheading::after,
div.nav .subheading::after,
.table::after {
content: "";
position: absolute;
width: 100%;
left: 0;
height: 3px;
background-image: url(/mediawiki/images/4/45/Shadow_after.png);
background-size: 100% 3px;
}
div.infobox-n::after,
div.nav .box::after {
bottom: -4px;
}
div.infobox-n .heading::after,
div.nav .heading::after,
div.infobox-n .subheading::after,
div.nav .subheading::after,
.table::after {
bottom: -3px;
}
/* Remove after shadow for tables that have been centered, otherwise the shadow spans the entire page */
.table[class="center"]::after,
.table.noshadowafter::after {
background-image: none;
}
div.infobox-n table,
div.nav table {
background-color: transparent;
}
div.infobox-n.healer-role dd,
div.infobox-n.healer-role dt {
border-color: #3c6829 !important;
}
div.infobox-n.healer-role .heading,
div.infobox-n.healer-role .subheading {
background-color: #3c6829 !important;
}
div.infobox-n.tanker-role dd,
div.infobox-n.tanker-role dt {
border-color: #364496 !important;
}
div.infobox-n.tanker-role .heading,
div.infobox-n.tanker-role .subheading {
background-color: #364496 !important;
}
div.infobox-n.dps-role dd,
div.infobox-n.dps-role dt {
border-color: #683535 !important;
}
div.infobox-n.dps-role .heading,
div.infobox-n.dps-role .subheading {
background-color: #913737 !important;
}
div.infobox-n.buff dd,
div.infobox-n.buff dt {
border-color: #399 !important;
}
div.infobox-n.buff .heading,
div.infobox-n.buff .subheading {
background-color: #399 !important;
}
div.infobox-n.debuff dd,
div.infobox-n.debuff dt {
border-color: #363 !important;
}
div.infobox-n.debuff .heading,
div.infobox-n.debuff .subheading {
background-color: #363 !important;
}
div.infobox-n.armor dd,
div.infobox-n.weapon dd,
div.infobox-n.item dd,
div.infobox-n.armor dt,
div.infobox-n.weapon dt,
div.infobox-n.item dt {
border-color: #c30;
}
div.infobox-n.armor .heading,
div.infobox-n.weapon .heading,
div.infobox-n.item .heading,
div.infobox-n.armor .subheading,
div.infobox-n.weapon .subheading,
div.infobox-n.item .subheading {
background: #c30;
}
div.infobox-n.skin dd,
div.infobox-n.skin dt {
border-color: #c4003e;
}
div.infobox-n.skin .heading,
div.infobox-n.skin .subheading {
background: #c4003e;
}
div.infobox-n.recipe {
width: 250px;
display: inline-block;
float: none;
clear: none;
vertical-align: top;
font-size: 1em;
margin: 0 1em 1em 0;
}
div.infobox-n.recipe .heading,
div.infobox-n.recipe .subheading {
font-size: 1.133em;
background: #533610;
}
div.infobox-n.recipe .wrapper {
padding: 0 10px;
}
div.infobox-n.crafting .heading,
div.infobox-n.crafting .subheading {
background: #533610;
}
div.infobox-n.crafting dd,
div.infobox-n.recipe dd,
div.infobox-n.crafting dt,
div.infobox-n.recipe dt {
border-color: #533610;
}
div.infobox-n.npc dd,
div.infobox-n.npc dt {
border-color: #390;
}
div.infobox-n.npc .heading,
div.infobox-n.npc .subheading {
background: #390;
}
div.infobox-n.skill dd,
div.infobox-n.skill dt {
border-color: #999;
}
div.infobox-n.skill .heading,
div.infobox-n.skill .subheading {
background: #444;
}
div.infobox-n.trait dd,
div.infobox-n.trait dt {
border-color: #bb7639;
}
div.infobox-n.trait .heading,
div.infobox-n.trait .subheading {
background: #ce8d54;
}
div.infobox-n.skill .icon > div {
border: 2px solid #111;
}
div.infobox-n.effect .condition {
background: #363;
}
div.infobox-n.effect .boon {
background: #399;
}
div.infobox-n.pet dd,
div.infobox-n.pet dt {
border-color: #360;
}
div.infobox-n.pet .heading,
div.infobox-n.pet .subheading {
background: #360;
}
div.infobox-n.quest dd,
div.infobox-n.quest dt {
border-color: #f90;
}
div.infobox-n.quest .heading,
div.infobox-n.quest .subheading {
background: #f90;
}
div.infobox-n.area dd,
div.infobox-n.area dt {
border-color: #306;
}
div.infobox-n.area .heading,
div.infobox-n.area .subheading {
background: #306;
}
div.nav dt,
div.nav dd,
div.infobox-n dt,
div.infobox-n dd,
div.nav table {
line-height: 1.667em;
}
div.infobox .heading,
div.infobox .subheading,
div.nav .heading,
div.nav .subheading {
color: #000 !important;
text-shadow: none !important;
border-width: 0 !important;
}
}
/* Moving the mobile.css for front page here */
/*
RESPONSIVE STRUCTURE
*/
#mobile-pagewrap {
width: 960px;
font-size: 95%;
margin: 15px auto;
box-shadow: rgba(0, 0, 0, 0.5) 0 0 0.75em;
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0, #bbb),
color-stop(0.02, #fff),
color-stop(1, #eee)
);
}
.mobile-column {
min-height: 330px;
width: 320px;
float: left;
}
.mobile-first-column {
width: 641px;
}
.mobile-box-content {
padding: 5px 15px;
}
#mobile-bottom {
clear: both;
}
/*
MEDIA QUERIES
*/
/* for 980px or less */
@media screen and (max-width: 980px) {
#mobile-pagewrap {
width: 94%;
}
.mobile-column {
width: 50%;
}
.mobile-first-column {
width: 70%;
}
.mobile-second-column {
width: 30%;
}
.mobile-box-content {
padding: 1% 4%;
}
.two-column-break {
clear: both;
}
}
/*for 820px or less*/
@media screen and (max-width: 820px) {
.mobile-first-column .floatleft {
float: none;
text-align: center;
width: 100%;
}
}
/* for 600px or less */
@media screen and (max-width: 600px) {
.mobile-column {
width: auto;
float: none;
}
.mobile-column {
min-height: inherit;
}
}
/*
FURTHER CUSTOMIZATION
************************************************************************************/
.mobile-box-header {
font-family: "IBM Plex Sans JP", "Times New Roman", serif;
font-size: 1.5em;
color: #fff;
text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
background-color: #444;
background-image: url(/mediawiki/images/a/aa/Bg_gradient4.jpg) !important;
font-weight: 400;
text-align: center;
}
#mobile-pagewrap {
border: 1px solid #ccc;
}
.mobile-column {
border-right: 1px solid #ccc;
margin-left: -1px;
}
.mobile-second-column {
border-right: none;
}
 
/* Newly Added After Server Upgrade End */
 
.glowbox {
  display:inline-block!important;
  box-shadow:0px 0px 5px 5px #ed2a54;
}
 
nav#p-namespaces {
  margin-left: 1em !important;
}
 
.displaynone {
  display: none !important;
}
 
.is-wikipatron {
  color: red !important;
}
 
.is-ultimapatron {
  color: blue !important;
}
 
.is-warrioroflight {
  color: gold !important;
}
 
/*<nowiki>*/
/** FONTS **/
.ibm-plex-sans-jp-thin {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 100;
  font-style: normal;
}
 
.ibm-plex-sans-jp-extralight {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 200;
  font-style: normal;
}
 
.ibm-plex-sans-jp-light {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 300;
  font-style: normal;
}
 
.ibm-plex-sans-jp-regular {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
}
 
.ibm-plex-sans-jp-medium {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 500;
  font-style: normal;
}
 
.ibm-plex-sans-jp-semibold {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 600;
  font-style: normal;
}
 
.ibm-plex-sans-jp-bold {
  font-family: "IBM Plex Sans JP", sans-serif;
  font-weight: 700;
  font-style: normal;
}
 
@font-face {
  font-family: "CronosPro";
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/cronos/v1/cronospro-regular-webfont.eot");
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/cronos/v1/cronospro-regular-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-regular-webfont.woff")
      format("woff"),
    url("https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-regular-webfont.ttf")
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net//fonts/cronos/v1/cronospro-regular-webfont.svg#CronosProregular")
      format("svg");
  font-weight: normal;
  font-style: normal;
}
 
/* Hide RC quick links below minimum screen width */
@media screen and (max-width: 750px) {
  #rcQuickLinks {
    display: none;
  }
}
 
/* TOC display level limiter, will only display the TOC up to level N */
.toc1 li.toclevel-2,
.toc1 li.toclevel-3,
.toc1 li.toclevel-4,
.toc1 li.toclevel-5,
.toc1 li.toclevel-6,
.toc2 li.toclevel-3,
.toc2 li.toclevel-4,
.toc2 li.toclevel-5,
.toc2 li.toclevel-6,
.toc3 li.toclevel-4,
.toc3 li.toclevel-5,
.toc3 li.toclevel-6,
.toc4 li.toclevel-5,
.toc4 li.toclevel-6,
.toc5 li.toclevel-6,
.hide,
body.page-Main_Page.ns-subject h1.firstHeading {
  display: none;
}
 
/* TOC heading font */
#toc h2,
.toc h2 {
  font-family: Arial, sans-serif !important;
}
 
/* Miscellaneous changes */
div.mw-dismissable-notice .mw-dismissable-notice-body {
  margin: 0;
  margin-bottom: 0.5em;
}
div.mw-dismissable-notice .mw-dismissable-notice-close {
  margin-right: 5px;
}
ul.special abbr,
ul.special acronym {
  border: none;
}
ol.references > li:target,
sup.reference:target,
cite:target {
  background: #eef;
}
ol.references {
  font-size: 90%;
}
sup,
sub {
  line-height: 1em;
}
.mw-editsection {
  float: right;
}
div.searchresults .mw-search-results {
  float: none;
}
.mw-collapsible-toggle {
  font-weight: normal;
  font-size: 85%;
}
span.comment {
  font-style: italic;
}
.autocomment {
  color: gray;
}
.gray,
.gray a {
  color: gray;
  opacity: 50%;
}
 
/* Universal styles */
.hidelist ul {
  list-style: none none;
  margin: 0;
  padding: 0;
}
.hidelist p {
  font-style: italic;
  margin: 0 0 0.2em;
}
.hidelist p + ul {
  margin-bottom: 0.5em;
}
.infobox-n .clear,
.nav .clear,
.recipe-box .clear {
  height: 5px;
}
#content .hiddenlinks a,
#content .hiddenlinks a:link,
#content .hiddenlinks a:visited {
  color: inherit;
}
 
/** MAIN PAGE STYLESHEET **/
#mainpagenavigation {
  display: block;
  border-collapse: collapse;
  text-align: left;
}
 
#mainpagenavigation th {
  font-family: "IBM Plex Sans JP", "Times New Roman", serif;
  font-size: 1.7692307692em;
  color: #fff;
  text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
  background-color: #444;
  background-image: linear-gradient(to bottom, #537189, #1C2A34) !important;
  font-weight: 400;
  height: 48px;
  text-align: center;
  font-size-adjust: 0.43;
}
 
#mainpagenavigation td {
  background-color: #fff;
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
  background-image: linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%);
  background-image: -o-linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%);
  background-image: -moz-linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%);
  background-image: -webkit-linear-gradient(top, #bbb 0%, #fff 2%, #eee 100%);
  background-image: -ms-linear-gradient(top, #bbb 0%, #fff 2%, #fff 100%);
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #bbb),
    color-stop(0.02, #fff),
    color-stop(1, #eee)
  );
}
 
#mainpagenavigation td.content {
  vertical-align: top;
  padding: 0.5em 1.5em;
}
 
#mainpagenavigation td.separator {
  border-right: #aaa solid 1px;
}
 
body.page-Main_Page.ns-subject #content,
body.page-Main_Page_editcopy.ns-subject #content {
  padding-left: 16px;
  padding-right: 16px;
}
 
/* older IE hacks */
#mainpagenavigation td.content > * {
  width: 88%\0/;
}
#mainpagenavigation td.content > [class*="float"] {
  width: auto\0/;
}
:root #mainpagenavigation td.content > * {
  width: auto;
}
 
/** TABLE CLASSES **/
.table {
  border: 0 solid;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 0.9230769231em;
  text-align: left;
  clear: none;
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin: 10px 0;
  padding: 0;
}
 
/* make table captions bold */
.table > caption {
  font-weight: bold;
}
 
/* this is a hack to add borders to IE8- */
.table > thead,
.table > tbody {
  border: 0 solid #aaa\0/;
}
 
.table tr {
  border: 1px solid #aaa\0/;
  text-align: left;
  border-color: #aaa;
}
 
/* and this removes them for IE9+ */
:root .table tr {
  border-top-width: 0;
  border-bottom-width: 0;
}
 
.table > * > tr > :first-child {
  border-left: 1px solid #aaa;
}
.table > * > tr > :last-child {
  border-right: 1px solid #aaa;
}
 
.table > tbody > tr:last-child,
.table > tbody > tr:last-child > *,
.table > tfoot > tr:last-child > *,
.table > caption {
  border-bottom: 1px solid #aaa;
}
 
.table > tbody:first-child > tr:first-child > *,
.table > tbody > tr.heading > *,
.table > thead > tr:first-child > * {
  background-image: url("/mediawiki/images/b/b3/Box_overlay.png");
  background-color: #eee;
  border-color: #aaa;
  padding: 0.5em;
}
 
.table > tbody > tr > th,
.table > tbody > tr > td,
.table > tfoot > tr > th {
  line-height: 1.4em; /* CUSTOM (OLD: 1.667em) */
  padding: 0.25em 0.5em;
}
 
.table tr > th,
.table[class*="center"] tr {
  text-align: center;
}
.table[class*="left"] tr {
  text-align: left;
}
.table[class*="right"] tr {
  text-align: right;
}
.table[class*="middle"] tr {
  vertical-align: middle;
}
.table[class*="top"] tr {
  vertical-align: top;
}
.table[class*="bottom"] tr {
  vertical-align: bottom;
}
 
.table > :first-child > tr:first-child,
.table > tbody > tr.heading {
  background-color: #eee;
  border: 1px solid #aaa !important;
}
 
.table > tbody > tr > th,
.table > tfoot > tr > th {
  background-color: #e7e7e7;
  border-color: #aaa;
}
 
.table > tbody > tr:nth-child(odd) {
  background-color: #f3f3f3;
  border-color: #aaa;
}
 
.table > tbody,
.table > tbody > tr.heading,
.table > tbody > tr > [rowspan],
.table > tbody > tr > [colspan] {
  border: 1px solid #aaa;
}
 
.table > :first-child > tr:first-child + tr [rowspan],
.table > :first-child > tr:first-child + tr [colspan] {
  border-top-width: 0;
}
 
.table .line,
.table .line-bottom {
  border-bottom-width: 1px !important;
  border-bottom-style: solid;
}
 
.table .line-top {
  border-top-width: 1px !important;
  border-top-style: solid;
  border-top-color: #aaa;
}
 
.table .line-left {
  border-left-width: 1px !important;
  border-left-style: solid;
  border-left-color: #aaa;
}
 
.table .line-right {
  border-right-width: 1px !important;
  border-right-style: solid;
  border-right-color: #aaa;
}
 
.table table {
  background-color: transparent;
  padding: 0;
  margin: 0;
}
 
/** STDT table classes **/
/* dps-role*/
.table.dps-role > :first-child > tr:first-child,
.table.dps-role > tbody > tr.heading,
.table.dps-role > :first-child > tr:first-child > *,
.table.dps-role > tbody > tr.heading > * {
  background-color: #bb6363 !important;
  border-color: #9a4848 !important;
}
.table.dps-role > tbody > tr > th,
.table.dps-role > tfoot > tr > th,
.table.dps-role > thead > tr > th,
table.table > tbody > tr.dps-role > th {
  background-color: #a9d3b7;
  border-color: #87a992;
}
.table.dps-role > tbody > tr:nth-child(odd),
.table > tbody > tr.dps-role:nth-child(odd) {
  background-color: #f2e8e5;
}
 
/* healer-role*/
.table.healer-role > :first-child > tr:first-child,
.table.healer-role > tbody > tr.heading,
.table.healer-role > :first-child > tr:first-child > *,
.table.healer-role > tbody > tr.heading > * {
  background-color: #3c6829 !important;
  border-color: #2a491d !important;
}
.table.healer-role > tbody > tr > th,
.table.healer-role > tfoot > tr > th,
.table.healer-role > thead > tr > th,
table.table > tbody > tr.healer-role > th {
  background-color: #a9d3b7;
  border-color: #87a992;
}
.table.healer-role > tbody > tr:nth-child(odd),
.table > tbody > tr.healer-role:nth-child(odd) {
  background-color: #e7f3e2;
}
 
/* tanker-role*/
.table.tanker-role > :first-child > tr:first-child,
.table.tanker-role > tbody > tr.heading,
.table.tanker-role > :first-child > tr:first-child > *,
.table.tanker-role > tbody > tr.heading > * {
  background-color: #5587c1 !important;
  border-color: #4871a0 !important;
}
.table.tanker-role > tbody > tr > th,
.table.tanker-role > tfoot > tr > th,
.table.tanker-role > thead > tr > th,
table.table > tbody > tr.tanker-role > th {
  background-color: #a9d3b7;
  border-color: #87a992;
}
.table.tanker-role > tbody > tr:nth-child(odd),
.table > tbody > tr.tanker-role:nth-child(odd) {
  background-color: #d2e3f7;
}
 
/* crafting-role*/
.table.crafting-role > :first-child > tr:first-child,
.table.crafting-role > tbody > tr.heading,
.table.crafting-role > :first-child > tr:first-child > *,
.table.crafting-role > tbody > tr.heading > * {
  background-color: #878eb5 !important;
  border-color: #777d9e !important;
}
.table.crafting-role > tbody > tr > th,
.table.crafting-role > tfoot > tr > th,
.table.crafting-role > thead > tr > th,
table.table > tbody > tr.crafting-role > th {
  background-color: #a9d3b7;
  border-color: #87a992;
}
.table.crafting-role > tbody > tr:nth-child(odd),
.table > tbody > tr.crafting-role:nth-child(odd) {
  background-color: #dfe1ec;
}
 
/* gathering-role*/
.table.gathering-role > :first-child > tr:first-child,
.table.gathering-role > tbody > tr.heading,
.table.gathering-role > :first-child > tr:first-child > *,
.table.gathering-role > tbody > tr.heading > * {
  background-color: #78a923 !important;
  border-color: #5a8019 !important;
}
.table.gathering-role > tbody > tr > th,
.table.gathering-role > tfoot > tr > th,
.table.gathering-role > thead > tr > th,
table.table > tbody > tr.gathering-role > th {
  background-color: #cbeb93;
  border-color: #87a992;
}
.table.gathering-role > tbody > tr:nth-child(odd),
.table > tbody > tr.gathering-role:nth-child(odd) {
  background-color: #eaf7d4;
}
 
/* pet-role*/
.table.pet-role > :first-child > tr:first-child,
.table.pet-role > tbody > tr.heading,
.table.pet-role > :first-child > tr:first-child > *,
.table.pet-role > tbody > tr.heading > * {
  background-color: #5fb7aa !important;
  border-color: #479e91 !important;
}
.table.pet-role > tbody > tr > th,
.table.pet-role > tfoot > tr > th,
.table.pet-role > thead > tr > th,
table.table > tbody > tr.pet-role > th {
  background-color: #a9d3b7;
  border-color: #87a992;
}
.table.pet-role > tbody > tr:nth-child(odd),
.table > tbody > tr.pet-role:nth-child(odd) {
  background-color: #edf7f6;
}
 
/* npc */
.table.npc > :first-child > tr:first-child,
.table.npc > tbody > tr.heading,
.table.npc > :first-child > tr:first-child > *,
.table.npc > tbody > tr.heading > * {
  background-color: #6c3;
  border-color: #52a329t;
}
.table.npc > tbody > tr > th,
.table.npc > tfoot > tr > th,
.table.npc > thead > tr > th,
table.table > tbody > tr.npc > th {
  background-color: #b3e699;
  border-color: #8fb87a;
}
.table.npc > tbody > tr:nth-child(odd),
.table > tbody > tr.npc:nth-child(odd) {
  background-color: #e8f8e1;
}
 
/* pve */
.table.pve > :first-child > tr:first-child,
.table.pve > tbody > tr.heading,
.table.pve > :first-child > tr:first-child > *,
.table.pve > tbody > tr.heading > * {
  background-color: #fc6;
  border-color: #cca352;
}
.table.pve > tbody > tr > th,
.table.pve > tfoot > tr > th,
.table.pve > thead > tr > th,
table.table > tbody > tr.pve > th {
  background-color: #ffe6b3;
  border-color: #ccb88f;
}
.table.pve > tbody > tr:nth-child(odd),
.table > tbody > tr.pve:nth-child(odd) {
  background-color: #fff8e8;
}
 
/* equip or item*/
.table.equip > :first-child > tr:first-child,
.table.equip > tbody > tr.heading,
.table.equip > :first-child > tr:first-child > *,
.table.equip > tbody > tr.heading > *,
.table.item > :first-child > tr:first-child,
.table.item > tbody > tr.heading,
.table.item > :first-child > tr:first-child > *,
.table.item > tbody > tr.heading > * {
  background-color: #f96;
  border-color: #cc7a52;
}
.table.equip > tbody > tr > th,
.table.equip > tfoot > tr > th,
.table.equip > thead > tr > th,
table.table > tbody > tr.equip > th,
.table.item > tbody > tr > th,
.table.item > tfoot > tr > th,
.table.item > thead > tr > th,
table.table > tbody > tr.item > th {
  background-color: #ffccb3;
  border-color: #cca38f;
}
.table.equip > tbody > tr:nth-child(odd),
.table > tbody > tr.equip:nth-child(odd),
.table.item > tbody > tr:nth-child(odd),
.table > tbody > tr.item:nth-child(odd) {
  background-color: #fff0e8;
}
 
/* skin */
.table.skin > :first-child > tr:first-child,
.table.skin > tbody > tr.heading,
.table.skin > :first-child > tr:first-child > *,
.table.skin > tbody > tr.heading > * {
  background-color: #e07a98 !important;
  border-color: #996574 !important;
}
.table.skin > tbody > tr > th,
.table.skin > tfoot > tr > th,
.table.skin > thead > tr > th,
table.table > tbody > tr.skin > th {
  background-color: #ffd4df;
  border-color: #b3a1a5;
}
.table.skin > tbody > tr:nth-child(odd),
.table > tbody > tr.skin:nth-child(odd) {
  background-color: #ffedf4;
}
 
/* mech1 */
.table.mech1 > :first-child > tr:first-child,
.table.mech1 > tbody > tr.heading,
.table.mech1 > :first-child > tr:first-child > *,
.table.mech1 > tbody > tr.heading > * {
  background-color: #69c;
  border-color: #527aa3;
}
.table.mech1 > tbody > tr > th,
.table.mech1 > tfoot > tr > th,
.table.mech1 > thead > tr > th,
table.table > tbody > tr.mech1 > th {
  background-color: #b3cce6;
  border-color: #8fa3b8;
}
.table.mech1 > tbody > tr:nth-child(odd),
.table > tbody > tr.mech1:nth-child(odd) {
  background-color: #e8f0f8;
}
 
/* mech2 */
.table.mech2 > :first-child > tr:first-child,
.table.mech2 > tbody > tr.heading,
.table.mech2 > :first-child > tr:first-child > *,
.table.mech2 > tbody > tr.heading > * {
  background-color: #3cc !important;
  border-color: #29a3a3 !important;
}
.table.mech2 > tbody > tr > th,
.table.mech2 > tfoot > tr > th,
.table.mech2 > thead > tr > th,
table.table > tbody > tr.mech2 > th {
  background-color: #99e6e6;
  border-color: #7ab8b8;
}
.table.mech2 > tbody > tr:nth-child(odd),
.table > tbody > tr.mech2:nth-child(odd) {
  background-color: #e1f8f8;
}
 
/* lore */
.table.lore > :first-child > tr:first-child,
.table.lore > tbody > tr.heading,
.table.lore > :first-child > tr:first-child > *,
.table.lore > tbody > tr.heading > * {
  background-color: #c6c !important;
  border-color: #a352a3 !important;
}
.table.lore > tbody > tr > th,
.table.lore > tfoot > tr > th,
.table.lore > thead > tr > th,
table.table > tbody > tr.lore > th {
  background-color: #e6b3e6;
  border-color: #b88fb8;
}
.table.lore > tbody > tr:nth-child(odd),
.table > tbody > tr.lore:nth-child(odd) {
  background-color: #f8e8f8;
}
 
/* location */
.table.location > :first-child > tr:first-child,
.table.location > tbody > tr.heading,
.table.location > :first-child > tr:first-child > *,
.table.location > tbody > tr.heading > * {
  background-color: #96c !important;
  border-color: #7a52a3 !important;
}
.table.location > tbody > tr > th,
.table.location > tfoot > tr > th,
.table.location > thead > tr > th,
table.table > tbody > tr.location > th {
  background-color: #ccb3e6;
  border-color: #a38fb8;
}
.table.location > tbody > tr:nth-child(odd),
.table > tbody > tr.location:nth-child(odd) {
  background-color: #f0e8f8;
}
 
/* promo */
.table.promo > :first-child > tr:first-child,
.table.promo > tbody > tr.heading,
.table.promo > :first-child > tr:first-child > *,
.table.promo > tbody > tr.heading > * {
  background-color: #9c3 !important;
  border-color: #7aa329 !important;
}
.table.promo > tbody > tr > th,
.table.promo > tfoot > tr > th,
.table.promo > thead > tr > th,
table.table > tbody > tr.promo > th {
  background-color: #cce699;
  border-color: #a3b87a;
}
.table.promo > tbody > tr:nth-child(odd),
.table > tbody > tr.promo:nth-child(odd) {
  background-color: #f0f8e1;
}
 
/* buff */
.table.buff > :first-child > tr:first-child,
.table.buff > tbody > tr.heading,
.table.buff > :first-child > tr:first-child > *,
.table.buff > tbody > tr.heading > * {
  background-color: #73d9d9 !important;
  border-color: #5caeae !important;
}
.table.buff > tbody > tr > th,
.table.buff > tfoot > tr > th,
.table.buff > thead > tr > th,
table.table > tbody > tr.buff > th {
  background-color: #b9ecec;
  border-color: #94bdbd;
}
.table.buff > tbody > tr:nth-child(odd),
.table > tbody > tr.buff:nth-child(odd) {
  background-color: #eaf9f9;
}
 
/* debuff */
.table.debuff > :first-child > tr:first-child,
.table.debuff > tbody > tr.heading,
.table.debuff > :first-child > tr:first-child > *,
.table.debuff > tbody > tr.heading > * {
  background-color: #51a651 !important;
  border-color: #418541 !important;
}
 
.table.debuff > tbody > tr > th,
.table.debuff > tfoot > tr > th,
.table.debuff > thead > tr > th,
table.table > tbody > tr.debuff > th {
  background-color: #a8d3a8;
  border-color: #86a986;
}
 
.table.debuff > tbody > tr:nth-child(odd),
.table > tbody > tr.debuff:nth-child(odd) {
  background-color: #e5f2e5;
}
 
/* crafting */
/* recipe */
.table.crafting > :first-child > tr:first-child,
.table.crafting > tbody > tr.heading,
.table.crafting > :first-child > tr:first-child > *,
.table.crafting > tbody > tr.heading > *,
.table.recipe > :first-child > tr:first-child,
.table.recipe > tbody > tr.heading,
.table.recipe > :first-child > tr:first-child > *,
.table.recipe > tbody > tr.heading > * {
  background-color: #a68151 !important;
  border-color: #856741 !important;
}
 
.table.crafting > tbody > tr > th,
.table.crafting > tfoot > tr > th,
.table.crafting > thead > tr > th,
table.table > tbody > tr.crafting > th,
.table.recipe > tbody > tr > th,
.table.recipe > tfoot > tr > th,
.table.recipe > thead > tr > th,
table.table > tbody > tr.recipe > th {
  background-color: #d3c0a8;
  border-color: #a99a86;
}
 
.table.crafting > tbody > tr:nth-child(odd),
.table > tbody > tr.crafting:nth-child(odd),
.table.recipe > tbody > tr:nth-child(odd),
.table > tbody > tr.recipe:nth-child(odd) {
  background-color: #f2ece5;
}
 
/* Action tables */
.table.actions,
.table.traits {
  width: 100%;
  max-width: 1000px;
  display: table;
}
.table.actions > :first-child > tr:first-child ~ tr th[colspan],
.table.traits > :first-child > tr:first-child ~ tr th[colspan] {
  text-align: left;
}
.table.actions
  > :first-child
  > tr:first-child
  ~ tr
  th[colspan]
  span.editsection,
.table.traits
  > :first-child
  > tr:first-child
  ~ tr
  th[colspan]
  span.editsection {
  display: none;
}
.table.actions > :first-child > tr:first-child ~ tr th[colspan] h4,
.table.traits > :first-child > tr:first-child ~ tr th[colspan] h4 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}
 
/* Using : lists within tables */
/* no top/bottom margin in these tables */
.table.fm dl,
.table.craftvariants dl {
  margin-top: 0;
  margin-bottom: 0;
}
/* no left margin when used purely for structure within these tables */
.table.locations dd,
.table.fm dd,
table.craftvariants dd {
  margin-left: 0;
}
/* restore margin if it's actually being used as a definition list */
.table.locations dl > dt ~ dd {
  margin-left: 2em;
}
 
/* Using * lists within combo tables */
.table.combo ul {
  margin: 0.15em 0;
}
.table.combo li {
  display: block;
}
 
/** INFOBOXES **/
div.infobox-n {
  float: right;
  position: relative;
  width: 300px;
  background: #fff;
  font-size: 0.923em;
  border: 1px solid #aaa;
  margin: 0 0 1em 1em;
  padding: 0;
}
 
div.infobox,
div.nav .box {
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
  background-image: linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -o-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #fff),
    color-stop(1, #eee)
  );
}
 
div.infobox-n .icon {
  float: right;
  position: relative;
  z-index: 2;
  width: auto;
  margin: 5px;
}
 
div.infobox-n .icon p {
  text-align: center;
  color: #444;
  font-size: 9px !important;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 0.75em;
  line-height: 1em;
  margin: 0.25em -0.5em;
  padding: 2px;
}
 
div.infobox-n .wrapper {
  clear: both;
  padding: 0;
}
 
div.infobox-n .statistics,
div.infobox-n .details {
  text-align: center;
  margin: 0 8px;
}
 
div.statistics span + span,
div.details span + span {
  margin-left: 5px;
}
 
div.infobox-n .heading,
div.nav .heading {
  font-weight: 700;
  background-image: url("/mediawiki/images/b/b3/Box_overlay.png");
  text-align: center;
  border: 1px solid rgba(0, 0, 0, 0.25);
  border-bottom-width: 0;
  position: relative;
  z-index: 1;
  font-size-adjust: 0.52;
  margin: -1px -1px 5px !important;
}
 
div.infobox-n .heading {
  font-family: "IBM Plex Sans JP", "Times New Roman", serif !important;
  font-size: 1.417em !important;
  color: #fff !important;
  background-color: #444;
  text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
  line-height: 1.176em;
  font-size-adjust: 0.43;
  padding: 0.5em !important;
}
 
div.infobox-n .subheading,
div.nav .subheading {
  font-weight: 700;
  background-color: #888;
  background-image: url("/mediawiki/images/b/b3/Box_overlay.png");
  border-left: 1px solid rgba(0, 0, 0, 0.25);
  border-right: 1px solid rgba(0, 0, 0, 0.25);
  line-height: 100%;
  text-align: center;
  position: relative;
  margin: 0 -1px !important;
}
 
div.infobox-n .subheading {
  font-family: "IBM Plex Sans JP", "Times New Roman", serif;
  font-size: 1.25em !important;
  color: #fff !important;
  background-color: #444;
  text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
  z-index: 1;
  line-height: 1.333em;
  font-size-adjust: 0.43;
  padding: 0.567em !important;
}
 
div.nav dl,
div.infobox-n dl {
  margin: 10px 0;
}
 
div.infobox-n dt {
  float: left;
  text-align: right;
  width: 90px;
  line-height: 1em;
  font-weight: 700;
  clear: left;
  border-right: 2px solid #999;
  margin: 0 -2px 0 0;
  padding: 2px 8px 2px 3px;
}
 
div.infobox-n dd {
  float: left;
  width: 170px;
  font-weight: 400;
  border-left: 2px solid #999;
  margin: 0;
  padding: 2px 7px;
}
 
/* CUSTOM: Weapon widths */
div.infobox-n.weapon dt {
  width: 120px;
}
div.infobox-n.weapon dd {
  width: 140px;
}
 
div.infobox-n .image_wrapper {
  text-align: center;
  padding: 0;
  margin: 10px 0;
}
 
div.infobox-n::after,
div.nav .box::after,
div.infobox-n .heading::after,
div.nav .heading::after,
div.infobox-n .subheading::after,
div.nav .subheading::after,
.table::after {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  height: 3px;
  background-image: url("/mediawiki/images/4/45/Shadow_after.png");
  background-size: 100% 3px;
}
 
div.infobox-n::after,
div.nav .box::after {
  bottom: -4px;
}
 
div.infobox-n .heading::after,
div.nav .heading::after,
div.infobox-n .subheading::after,
div.nav .subheading::after,
.table::after {
  bottom: -3px;
}
 
/* Remove after shadow for tables that have been centered, otherwise the shadow spans the entire page */
.table[class*="center"]::after,
.table.noshadowafter::after {
  background-image: none;
}
 
div.infobox-n table,
div.nav table {
  background-color: transparent;
}
 
div.infobox-n.healer-role dd,
div.infobox-n.healer-role dt {
  border-color: #2a491d !important;
}
 
div.infobox-n.healer-role .heading,
div.infobox-n.healer-role .subheading {
  background-color: #3c6829 !important;
}
 
div.infobox-n.tanker-role dd,
div.infobox-n.tanker-role dt {
  border-color: #4871a0 !important;
}
 
div.infobox-n.tanker-role .heading,
div.infobox-n.tanker-role .subheading {
  background-color: #5587c1 !important;
}
 
div.infobox-n.dps-role dd,
div.infobox-n.dps-role dt {
  border-color: #9a4848 !important;
}
 
div.infobox-n.dps-role .heading,
div.infobox-n.dps-role .subheading {
  background-color: #bb6363 !important;
}
 
div.infobox-n.pet-role dd,
div.infobox-n.pet-role dt {
  border-color: #479e91 !important;
}
 
div.infobox-n.pet-role .heading,
div.infobox-n.pet-role .subheading {
  background-color: #5fb7aa !important;
}
 
div.infobox-n.crafting-role dd,
div.infobox-n.crafting-role dt {
  border-color: #777d9e !important;
}
 
div.infobox-n.crafting-role .heading,
div.infobox-n.crafting-role .subheading {
  background-color: #878eb5 !important;
}
 
div.infobox-n.gathering-role dd,
div.infobox-n.gathering-role dt {
  border-color: #5a8019 !important;
}
 
div.infobox-n.gathering-role .heading,
div.infobox-n.gathering-role .subheading {
  background-color: #78a923 !important;
}
 
div.infobox-n.mixed-role dd,
div.infobox-n.mixed-role dt {
  border-color: #ac8920 !important;
}
 
div.infobox-n.mixed-role .heading,
div.infobox-n.mixed-role .subheading {
  background-color: #deb94e !important;
}
 
div.infobox-n.buff dd,
div.infobox-n.buff dt {
  border-color: #399 !important;
}
 
div.infobox-n.buff .heading,
div.infobox-n.buff .subheading {
  background-color: #399 !important;
}
 
div.infobox-n.debuff dd,
div.infobox-n.debuff dt {
  border-color: #363 !important;
}
 
div.infobox-n.debuff .heading,
div.infobox-n.debuff .subheading {
  background-color: #363 !important;
}
 
div.infobox-n.mount dd,
div.infobox-n.mount dt {
  border-color: #b042bd !important;
}
 
div.infobox-n.mount .heading,
div.infobox-n.mount .subheading {
  background-color: #cf72da !important;
}
 
div.infobox-n.armor dd,
div.infobox-n.weapon dd,
div.infobox-n.trinket dd,
div.infobox-n.item dd,
div.infobox-n.armor dt,
div.infobox-n.weapon dt,
div.infobox-n.trinket dt,
div.infobox-n.item dt {
  border-color: #c30;
}
 
div.infobox-n.armor .heading,
div.infobox-n.weapon .heading,
div.infobox-n.trinket .heading,
div.infobox-n.item .heading,
div.infobox-n.armor .subheading,
div.infobox-n.weapon .subheading,
div.infobox-n.trinket .subheading,
div.infobox-n.item .subheading {
  background: #c30;
}
 
div.infobox-n.skin dd,
div.infobox-n.skin dt {
  border-color: #c4003e;
}
 
div.infobox-n.skin .heading,
div.infobox-n.skin .subheading {
  background: #c4003e;
}
 
div.infobox-n.recipe {
  width: 300px;
  display: inline-block;
  float: none;
  clear: none;
  vertical-align: top;
  font-size: 1em;
  margin: 0 1em 1em 0;
}
 
div.infobox-n.recipe .heading,
div.infobox-n.recipe .subheading {
  font-size: 1.133em;
  background: #533610;
}
 
div.infobox-n.recipe .wrapper {
  padding: 0 10px;
}
 
div.infobox-n.crafting .heading,
div.infobox-n.crafting .subheading {
  background: #533610;
}
 
div.infobox-n.crafting dd,
div.infobox-n.recipe dd,
div.infobox-n.crafting dt,
div.infobox-n.recipe dt {
  border-color: #533610;
}
}


div.infobox-n.npc dd,
div.infobox-n.npc dt {
  border-color: #390;
}
div.infobox-n.npc .heading,
div.infobox-n.npc .subheading {
  background: #390;
}
div.infobox-n.action dd,
div.infobox-n.action dt {
  border-color: #999;
}
div.infobox-n.trait dd,
div.infobox-n.trait dt {
  border-color: #bb7639;
}
div.infobox-n.trait .heading,
div.infobox-n.trait .subheading {
  background: #444;
}
div.infobox-n.trait .heading,
div.infobox-n.trait .subheading {
  background: #ce8d54;
}
/* CUSTOM: Overwritten with STFI - div.infobox-n.action .icon > div { border:2px solid #111; } */
div.infobox-n.effect .debuff {
  background: #363;
}
div.infobox-n.effect .buff {
  background: #399;
}
div.infobox-n.pet dd,
div.infobox-n.pet dt {
  border-color: #360;
}
div.infobox-n.pet .heading,
div.infobox-n.pet .subheading {
  background: #360;
}
div.infobox-n.quest dd,
div.infobox-n.quest dt {
  border-color: #eea63a;
}
div.infobox-n.quest .heading,
div.infobox-n.quest .subheading {
  background: #efaa43;
}
div.infobox-n.duty dd,
div.infobox-n.duty dt {
  border-color: #fb6537;
}
div.infobox-n.duty .heading,
div.infobox-n.duty .subheading {
  background: #fb6537;
}
div.infobox-n.fate dd,
div.infobox-n.fate dt {
  border-color: #bd50d7;
}
div.infobox-n.fate .heading,
div.infobox-n.fate .subheading {
  background: #9334be;
}
div.infobox-n.area dd,
div.infobox-n.area dt {
  border-color: #306;
}
div.infobox-n.area .heading,
div.infobox-n.area .subheading {
  background: #306;
}
/** NAV BARS (headings are done with infobox headings) **/
div.nav {
  position: relative;
  width: 500px;
  margin: auto;
}
div.nav .box {
  position: relative;
  font-size: 0.9230769231em;
  border-spacing: 0;
  overflow: visible;
  min-height: 60px;
  border: 1px solid #aaa;
  margin: 5px;
  padding: 0;
}
div.nav .heading {
  font-family: Arial, sans-serif !important;
  background-color: #888;
  font-size: 1.083em;
  line-height: 100%;
  margin: -1px -1px 0;
  padding: 0.769em 0;
}
div.nav .subheading {
  font-family: Arial, sans-serif;
  font-size: 1em;
  font-size-adjust: 0.52;
  padding: 0.833em 0;
}
.nav .selflink {
  font-weight: bold;
}
div.nav dt,
div.nav dd,
div.infobox-n dt,
div.infobox-n dd,
div.nav table {
  line-height: 1.4em; /* CUSTOM (OLD: 1.667em) */
}
div.nav .center {
  text-align: center;
  margin: 10px 0;
}
div.nav .box table {
  background-color: transparent;
  border-collapse: collapse;
  width: 100%;
  margin: 0.667em 0;
}
div.nav dt {
  float: left;
  text-align: right;
  width: 150px;
  clear: left;
  border-right: 2px solid #999;
  margin: 0 -2px 0 0;
  padding: 2px 8px;
}
div.nav dd {
  float: left;
  text-align: left;
  border-left: 2px solid #888;
  width: 325px;
  margin: 0;
  padding: 2px 8px;
}
div.nav table th {
  text-align: right;
  border-right: 2px solid #888;
  vertical-align: top;
  padding: 2px 8px;
  width: 150px;
}
div.nav table td {
  padding: 2px 8px;
}
div.nav table td a,
div.nav table td strong.selflink {
  white-space: nowrap;
}
div.nav.thin .box {
  width: 400px;
  margin-left: 50px;
}
div.nav.thin dt {
  width: 75px;
}
div.nav.thin dd {
  width: 290px;
}
div.nav.wide .box {
  width: 600px;
  margin-left: -50px;
}
div.nav.wide dt {
  width: 150px;
}
div.nav.wide dd {
  width: 400px;
}
div.nav .heading .selflink {
  font-weight: bold !important;
}
div.nav.npc .heading {
  background-color: #6c3;
}
div.nav.npc dd,
div.nav.npc dt,
div.nav.npc table th {
  border-color: #6c3;
}
div.nav.pve .heading {
  background-color: #fc6;
}
div.nav.pve dd,
div.nav.pve dt,
div.nav.pve table th {
  border-color: #fc6;
}
div.nav.equip .heading {
  background-color: #f96;
}
div.nav.equip dd,
div.nav.equip dt,
div.nav.equip table th {
  border-color: #f96;
}
div.nav.mech1 .heading {
  background-color: #69c;
}
div.nav.mech1 dd,
div.nav.mech1 dt,
div.nav.mech1 table th {
  border-color: #69c;
}
div.nav.mech2 .heading {
  background-color: #3cc;
}
div.nav.mech2 dd,
div.nav.mech2 dt,
div.nav.mech2 table th {
  border-color: #3cc;
}
div.nav.location .heading {
  background-color: #96c;
}
div.nav.location dd,
div.nav.location dt,
div.nav.location table th {
  border-color: #96c;
}
div.nav.lore .heading {
  background-color: #c6c;
}
div.nav.lore dd,
div.nav.lore dt,
div.nav.lore table th {
  border-color: #c6c;
}
div.nav.promo .heading {
  background-color: #9c3;
}
div.nav.promo dd,
div.nav.promo dt,
div.nav.promo table th {
  border-color: #9c3;
}
div.nav.quest .heading {
  background-color: #efaa43;
}
div.nav.quest dd,
div.nav.quest dt,
div.nav.quest table th {
  border-color: #eea63a;
}
div.nav.condition .heading {
  background-color: #51a651;
}
div.nav.condition dd,
div.nav.condition dt,
div.nav.condition table th {
  border-color: #51a651;
}
div.nav.hom .heading {
  background-color: #c96;
}
div.nav.hom dd,
div.nav.hom dt,
div.nav.hom table th {
  border-color: #c96;
}
div.nav.crafting .heading,
div.nav.recipe .heading {
  background-color: #963;
}
div.nav.crafting dd,
div.nav.hom dt,
div.nav.crafting table th,
div.nav.recipe dd,
div.nav.hom dt,
div.nav.recipe table th {
  border-color: #963;
}
div.nav.monsters .heading,
div.nav.monsters .subheading {
  background-color: #6c3;
}
div.nav.monsters dd,
div.nav.monsters dt,
div.nav.monsters table th {
  border-color: #6c3;
}
div.nav.duty .heading,
div.nav.duty .subheading {
  background-color: #fb6537;
}
div.nav.duty dd,
div.nav.duty dt,
div.nav.duty table th {
  border-color: #fb6537;
}
div.nav.whatever20 dd,
div.nav.whatever20 dt,
div.nav.whatever20 table th {
  border-color: #d25d6b;
}
div.nav.whatever1 .heading,
div.nav.whatever1 .subheading {
  background-color: #39c;
}
div.nav.whatever1 dd,
div.nav.whatever1 dt,
div.nav.whatever1 table th {
  border-color: #39c;
}
div.nav.whatever2 .heading,
div.nav.whatever2 .subheading {
  background-color: #c23f3a;
}
div.nav.whatever2 dd,
div.nav.whatever2 dt,
div.nav.whatever2 table th {
  border-color: #c23f3a;
}
div.nav.whatever3 .heading,
div.nav.whatever3 .subheading {
  background-color: #f93;
}
div.nav.whatever3 dd,
div.nav.whatever3 dt,
div.nav.whatever3 table th {
  border-color: #f93;
}
div.nav.whatever4 .heading,
div.nav.whatever4 .subheading {
  background-color: #963;
}
div.nav.whatever4 dd,
div.nav.whatever4 dt,
div.nav.whatever4 table th {
  border-color: #963;
}
div.nav.whatever5 .heading,
div.nav.whatever5 .subheading {
  background-color: #c66;
}
div.nav.whatever5 dd,
div.nav.whatever5 dt,
div.nav.whatever5 table th {
  border-color: #c66;
}
div.nav.whatever6 .heading,
div.nav.whatever6 .subheading {
  background-color: #ec5752;
}
div.nav.whatever6 dd,
div.nav.whatever6 dt,
div.nav.whatever6 table th {
  border-color: #ec5752;
}
div.nav.whatever7 .heading,
div.nav.whatever7 .subheading {
  background-color: #939;
}
div.nav.whatever7 dd,
div.nav.whatever7 dt,
div.nav.whatever7 table th {
  border-color: #939;
}
div.nav.whatever8 .heading,
div.nav.whatever8 .subheading {
  background-color: #396;
}
div.nav.whatever8 dd,
div.nav.whatever8 dt,
div.nav.whatever8 table th {
  border-color: #396;
}
div.nav.whatever9 .heading,
div.nav.whatever9 .subheading {
  background-color: #96f;
}
div.nav.whatever9 dd,
div.nav.whatever9 dt,
div.nav.whatever9 table th {
  border-color: #96f;
}
div.nav.whatever10 .heading,
div.nav.whatever10 .subheading {
  background-color: #d25d6b;
}
div.nav.whatever11 .heading,
div.nav.whatever11 .subheading {
  background-color: #fc3;
}
div.nav.whatever12 dd,
div.nav.whatever12 dt,
div.nav.whatever12 table th {
  border-color: #fc3;
}
div.nav.whatever13 .heading,
div.nav.whatever13 .subheading {
  background-color: #6cf;
}
div.nav.whatever13 dd,
div.nav.whatever13 dt,
div.nav.whatever13 table th {
  border-color: #6cf;
}
div.nav.whatever14 .heading,
div.nav.whatever14 .subheading {
  background-color: #3c3;
}
div.nav.whatever14 dd,
div.nav.whatever14 dt,
div.nav.whatever14 table th {
  border-color: #3c3;
}
/** PRINTER CHANGES **/
@media print {
  #content {
    border: 0 solid #fff;
    box-shadow: none;
    border-radius: 0;
  }
  #mainpagenavigation th,
  div.infobox-n .heading,
  div.infobox-n .subheading,
  div.nav .heading,
  div.nav .subheading {
    color: #000 !important;
    text-shadow: none !important;
    border-width: 0 !important;
  }
  table.table > :first-child > tr:first-child,
  table.table > :first-child > tr:first-child > *,
  .table > tbody > tr > * {
    border: 1px solid #000 !important;
  }
  .table {
    border-collapse: collapse !important;
  }
}
/* Hiding icon redlinks */
span.thumb-icon a.new {
  color: transparent;
  display: inline-block;
  font: 0/0 a;
  overflow: hidden;
  vertical-align: middle;
}
/* Item icons */
span.thumb-icon.item-icon.small a.new {
  background-image: url("/images/thumb/7/74/action.png/20px-action.png");
  height: 20px;
  width: 20px;
}
span.thumb-icon.item-icon.medium a.new {
  background-image: url("/images/thumb/7/74/action.png/35px-action.png");
  height: 35px;
  width: 35px;
}
/* Infobox icons */
div.infobox-icon a.new {
  color: transparent;
  display: inline-block;
  font: 0/0 a;
  overflow: hidden;
  vertical-align: middle;
  background-image: url("/images/thumb/7/74/action.png/40px-action.png");
  height: 40px;
  width: 40px;
}
div.action-infobox-icon a.new {
  color: transparent;
  display: inline-block;
  font: 0/0 a;
  overflow: hidden;
  vertical-align: middle;
  background-image: url("/images/thumb/7/74/action.png/48px-action.png");
  height: 48px;
  width: 48px;
}
/* Attribute prefix spacing (usually in infoboxes) */
.prefixwrapper dl {
  margin: 0;
}
/* action icons */
/* These will require more work since the template takes a continuous size parameter, rather than discrete size values */
* + html span.thumb-icon a.new {
  display: inline;
} /* IE7 fix */
* html span.thumb-icon a.new {
  display: inline;
} /* IE6 fix */
/* Inline icons */
/* div is used by [[Template:Icon]] */
div.inline-icon {
  display: inline-block;
  bottom: 2px;
  overflow: visible;
  height: 1.5384615385em;
  margin: 0 0.167em;
}
/* span is used by [[Template:Effect icon]] */
span.inline-icon {
  display: inline-block;
  bottom: 2px;
  overflow: visible;
  height: 1.5384615385em;
}
/* Masthead links */
#upperBar {
  position: absolute;
  top: 0;
  left: 156px;
  height: 30px;
  z-index: 4;
  font-size-adjust: 0.52;
}
#upperBar ul {
  padding: 0px;
  margin: 0px;
  list-style: none;
}
#upperBar ul li {
  margin: 0;
  padding: 0px;
  display: inline-block;
  font-family: "IBM Plex Sans JP", "Times New Roman", "serif";
}
#upperBar ul li a {
  color: #f1f9e2;
  text-transform: uppercase;
  font-size: 12px;
  padding: 8px 10px;
  line-height: 2.6;
}
#upperBar ul li a:hover {
  text-decoration: none;
  color: white;
}
#upperBar ul li:first-child a:hover {
  background: url(/images/c/c7/Masthead_hover_background.png) no-repeat 0 -30px;
  background-position: -121px -30px;
}
#upperBar ul li:first-child + li a:hover {
  background: url(/images/c/c7/Masthead_hover_background.png) no-repeat 0 -30px;
  background-position: -206px -30px;
}
#upperBar ul li:first-child + li + li a:hover {
  background: url(/images/c/c7/Masthead_hover_background.png) no-repeat 0 -30px;
  background-position: -274px -30px;
}
/** Restore sort icons for sortable table headers **/
/* These are inserted as CSS background-image, which clashes with our fancy gradient overlays */
table.jquery-tablesorter th.headerSort {
  background-image: url(data:image/gif;base64,R0lGODlhFQAJAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNTAyODcwMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNTAyODZGMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDE4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDE4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAJAAACF4yPgMsJ2mJ4VDKKrd4GVz5lYPeMiVUAADs=);
  background-image: url(/resources/jquery/images/sort_both.gif?2012-12-04T21:08:20z)
    !ie;
  padding: 0.5em;
  padding-right: 21px;
}
table.jquery-tablesorter th.headerSortDown {
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAyODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhFNzNGQjI3MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhFNzNGQjI2MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDI4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAEAAACDYyPAcmtsJyDVDKKWQEAOw==);
  background-image: url(/resources/jquery/images/sort_down.gif?2012-12-04T21:08:20z)
    !ie;
}
table.jquery-tablesorter th.headerSortUp {
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAzODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNTAyODc0MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNTAyODczMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDM4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDM4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAEAAACDYwfoAvoz9qbZ9FrJC0AOw==);
  background-image: url(/resources/jquery/images/sort_up.gif?2012-12-04T21:08:20z)
    !ie;
}
/* And finally jquery overlays for tables that also use .table classes (two background images) */
table.table.jquery-tablesorter th.headerSort {
  background-image: url(data:image/gif;base64,R0lGODlhFQAJAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNTAyODcwMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNTAyODZGMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDE4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDE4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAJAAACF4yPgMsJ2mJ4VDKKrd4GVz5lYPeMiVUAADs=),
    url("/mediawiki/images/b/b3/Box_overlay.png");
  background-image: url(/resources/jquery/images/sort_both.gif?2012-12-04T21:08:20z)
    !ie;
  background-repeat: no-repeat, repeat;
  background-position: 100% 50%, 0% 0%;
}
table.table.jquery-tablesorter th.headerSortDown {
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAyODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhFNzNGQjI3MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhFNzNGQjI2MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDI4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAEAAACDYyPAcmtsJyDVDKKWQEAOw==),
    url("/mediawiki/images/b/b3/Box_overlay.png");
  background-image: url(/resources/jquery/images/sort_down.gif?2012-12-04T21:08:20z)
    !ie;
  background-repeat: no-repeat, repeat;
  background-position: 100% 50%, 0% 0%;
}
table.table.jquery-tablesorter th.headerSortUp {
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAzODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNTAyODc0MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNTAyODczMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDM4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDM4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAEAAACDYwfoAvoz9qbZ9FrJC0AOw==),
    url("/mediawiki/images/b/b3/Box_overlay.png");
  background-image: url(/resources/jquery/images/sort_up.gif?2012-12-04T21:08:20z)
    !ie;
  background-repeat: no-repeat, repeat;
  background-position: 100% 50%, 0% 0%;
}
/* Recipe boxes that don't look like infoboxes */
div.recipe-box {
  /* from div.infobox-n.recipe */
  min-width: 300px;
  display: inline-block;
  float: none;
  clear: none;
  vertical-align: top;
  font-size: 1em;
  margin: 0 1em 0 0;
  /* from div.infobox-n*/
  position: relative;
  background: #fff;
  border: 1px solid #aaa;
  padding: 0;
  /* from div.infobox, div.nav .box */
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFFFFF,EndColorStr=#FFEEEEEE);
  background-image: linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -o-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #fff),
    color-stop(1, #eee)
  );
}
div.recipe-box::after {
  /* from div.infobox:after */
  bottom: -4px;
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  height: 3px;
  background-image: url("/mediawiki/images/4/45/Shadow_after.png");
  background-size: 100% 3px;
}
div.recipe-box .subheading,
div.recipe-box .heading {
  text-align: center;
  background-color: #d3c0a8;
  padding: 2px;
  font-weight: bold;
  background-image: url("/mediawiki/images/b/b3/Box_overlay.png");
  border: 1px solid rgba(0, 0, 0, 0.25);
  margin: -1px -1px 5px !important;
}
div.recipe-box .subheading {
  border-width: 0 1px;
}
div.recipe-box dl {
  margin: 10px 0;
}
div.recipe-box dt {
  float: left;
  text-align: right;
  width: 130px; /* CUSTOM (OLD: 112px) */
  line-height: 1em;
  font-weight: 700;
  clear: left;
  border-right: 2px solid #a99a86;
  margin: 0 -2px 0 0;
  padding: 2px 8px 2px 3px;
  line-height: 1.4em; /* CUSTOM (OLD: 1.667em) */
}
div.recipe-box dd {
  float: left;
  border-left: 2px solid #999;
  margin: 0;
  padding: 2px 7px;
  line-height: 1.4;
}
/* For generic ingredient lists anywhere on the wiki */
div.ingredients dt {
  float: left;
  clear: left;
  text-align: right;
  font-weight: normal;
  width: 25px;
  margin: 0 -2px 0 0;
  padding: 2px 2px 2px 3px;
  line-height: 1.4em; /* CUSTOM (OLD: 1.667em) */
  border: none;
}
div.ingredients.wide dt {
  width: 50px;
}
div.ingredients dd {
  float: left;
  margin: 0;
  padding: 1px 4px; /* CUSTOM (OLD: 2px 7px) */
  border: none;
}
div.ingredients dl {
  margin: 2px 0;
}
/* jqplot data labels (a SMW result format); improve readability */
.jqplot-data-label {
  color: white;
  text-shadow: 1px 1px black;
}
.srf-jqplot-plot.bar.jqplot-target {
  color: black;
  font-size: 120%;
}
/* Dialogue indent guides, added by demarcateDialogue in MediaWiki:Common.js */
.dialogue dl dd {
  padding-left: 16px;
  margin-left: 0;
}
.dialogue dl {
  margin-top: 3px;
  margin-bottom: 3px;
  margin-left: 11px;
  border-left: 2px solid rgba(110, 98, 74, 0.4);
}
.dialogue > dl,
.dialogue td > dl {
  margin-bottom: 10px;
  border-left: none;
}
/* For Semantic Forms with multiple template instances, such as for a row template. */
body.page-Glob_of_Ectoplasm_salvage_research .multipleTemplateList p,
body.page-Special_FormEdit_Glob_of_Ectoplasm_salvage_research_Glob_of_Ectoplasm_salvage_research
  .multipleTemplateList
  p {
  display: none;
}
body.page-Glob_of_Ectoplasm_salvage_research
  div.multipleTemplateInstance.multipleTemplate,
body.page-Special_FormEdit_Glob_of_Ectoplasm_salvage_research_Glob_of_Ectoplasm_salvage_research
  div.multipleTemplateInstance {
  padding: 0px 5px !important;
  margin: 0px !important;
  background: none !important;
  border: none !important;
}
.table.form-row::after {
  background: none;
}
.form-row tr th span input {
  text-align: center;
  line-height: 1;
}
.form-row tr th span input.left {
  text-align: left;
}
input.form-lineheight {
  height: 20px;
}
input.form-lineheight[type="checkbox"] {
  margin: 0px;
}
select.form-lineheight {
  height: 30px;
}
/* Remove top margin for ul within bug/anomaly templates */
.buglist ul {
  margin-top: 0;
}
/* Hide and reduce margins of horizontal rules between multiple navs */
.nav ~ hr {
  background-color: transparent;
  margin: 0.5em 0 !important;
}
/* Hide smw annotation notice */
#smw-form-editpage-help {
  display: none;
}
/* Fix last row spacing in SMW generated galleries */
.srf-gallery ul.gallery {
  text-align: left;
}
/* Reduce width of SMW columns in ul format */
.smw-ul-columns div {
  width: unset !important;
  min-width: 300px;
}
/**
* Style for horizontal lists (separator following item).
* @source mediawiki.org/wiki/Snippets/Horizontal_lists
* @revision 6 (2014-05-09)
* @author mediawiki.org/wiki/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.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;
}
/* Generate interpuncts */
.hlist dt:after {
  content: ": ";
}
.hlist dd:after,
.hlist li:after {
  content: " • ";
  font-weight: bold;
  margin: 0 2px;
}
.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) " ";
  white-space: nowrap;
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
  content: " (" counter(listitem) " ";
}
/* Deletion page field indents */
@media screen and (min-width: 820px) {
  #mw-deleteconfirm-table div label {
    display: inline-block;
    width: 170px;
    text-align: right;
    margin-bottom: 5px;
  }
  #mw-deleteconfirm-table input#wpWatch {
    margin-left: 156px;
  }
}
/* Class for [[Template:Trait compact table]] */
.faded img {
  opacity: 0.2;
}
/* Class for action history project */
.action-history {
  padding: 0.2em 0.5em 0.5em 0.5em;
  margin-bottom: 0.5em;
  border: 1px #aaa dashed;
  background-color: #f6f3e4;
}
.action-history li {
  padding: 0.1em 0em;
}
/* SMW further results */
.table + .smw-template-furtherresults {
  display: block;
}
.table + .smw-template-furtherresults a {
  background: none;
  color: #0645ad;
}
/* CUSTOM FOR FFXIV WIKI */
/* Action facts within description */
blockquote p {
  margin-bottom: 0.2em !important;
}
blockquote dd {
  line-height: 1.4em;
  margin-left: 1em !important;
}
blockquote dl {
  margin-top: 0 !important;
}
.hide {
  display: none;
}
/* Description flavor colors */
span.colorized-description {
  font-weight: bold;
}
span.colorized-description.triple-tick,
span.colorized-description.triple-tick > a {
  color: #ba5a0b;
}
span.colorized-description.double-tick,
span.colorized-description.double-tick > a {
  color: #827B00;
}
span.colorized-description.single-tick,
span.colorized-description.single-tick > a {
  color: #0a9421;
}
/* Item effects */
div.item-effects {
  font-size: 0.95em;
  color: #707070;
  border-bottom: 1px solid #a0a0a0;
  display: inline-block;
  width: 500px;
  margin: 5px 0;
}
div.item-effects-list > p {
  margin: 0 !important;
  line-height: 1.4em;
}
/* Dialog box flavor texts */
.dialog-box {
  position: relative;
  display: inline-block;
  padding: 0 8px;
  line-height: 1.45em;
}
.dialog-box.golden-warning,
.dialog-box.golden-warning a,
.dialog-box.golden-warning a.new,
.dialog-box.golden-warning a:visited,
.dialog-box.golden-warning a.new:visited {
  text-shadow: 0 0.02em 0.2em #dc8809;
  color: #ffecb3;
}
.dialog-box.quest-milestone,
.dialog-box.quest-milestone a.new,
.dialog-box.quest-milestone a.new:visited {
  text-shadow: 0 0.02em 0.2em #33adff;
  color: #dbe5ff;
}
.dialog-box.quest-milestone a,
.dialog-box.quest-milestone a:visited {
  text-shadow: 0 0.02em 0.2em #222;
  color: #eee;
}
.dialog-box:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-color: #222;
  opacity: 0.9;
  border-radius: 10px;
  filter: blur(0.11em);
}
.dialog-box.quest-milestone:before {
  background-color: #0047a3;
}
/* Recipe characteristics */
.recipe-box .characteristics {
  margin-top: -10px;
}
/* Item rarity */
.rarity {
  font-weight: bold;
}
.rarity.white,
.rarity.basic {
  color: black;
}
.rarity.green,
.rarity.dungeon {
  color: #20bc70;
}
.rarity.blue,
.rarity.tomestone {
  color: #2673c5;
}
.rarity.pink,
.rarity.aetherial {
  color: #ff65ad;
}
.rarity.purple,
.rarity.relic {
  color: #7641af;
}
/* Weapon infobox styles */
.weapon-damage-stats,
.armor-defense-stats {
  border-collapse: collapse;
  margin-bottom: 10px;
}
.weapon-damage-stats sup,
.armor-defense-stats sup {
  font-size: 0.7em;
  font-weight: bold;
}
.weapon-damage-stats td,
.weapon-damage-stats th,
.armor-defense-stats td,
.armor-defense-stats th {
  text-align: left;
  padding: 1px 4px;
}
.weapon-damage-stats th:nth-child(1) {
  background-image: linear-gradient(to right, #ff4000, #ff8c66);
  border-left: 1px solid #f63;
}
.weapon-damage-stats th:nth-child(2) {
  background-image: linear-gradient(to right, #ff8c66, #ffece5);
}
.weapon-damage-stats th:nth-child(3) {
  background-image: linear-gradient(to right, #ffece5, transparent);
}
.armor-defense-stats th:nth-child(1) {
  background-image: linear-gradient(to right, #ff4000, #ffece5);
  border-left: 1px solid #f63;
}
.armor-defense-stats th:nth-child(2) {
  background-image: linear-gradient(to right, #ffece5, transparent);
}
.weapon-damage-stats td,
.armor-defense-stats td {
  background: #fff8f5;
}
.weapon-damage-stats td:nth-child(1),
.armor-defense-stats td:nth-child(1) {
  border-left: 1px solid #f63;
}
.weapon-damage-stats td:nth-child(3),
.armor-defense-stats td:nth-child(2) {
  background-image: linear-gradient(to right, #fff8f5, #fff);
}
.equipment-footer {
  font-size: 0.98em;
  margin-top: 6px;
}
.equipment-footer .adv-melding {
  color: #ea3e69;
}
.equipment-footer .equip-props {
  font-weight: bold;
  color: #666;
}
.equipment-footer .equip-props .equip-prop.no {
  color: #bababa;
  text-decoration: line-through;
  font-weight: normal;
}
.equipment-footer .equip-props .equip-prop.yes {
  color: #090;
  font-weight: normal;
}
/* Item statistics */
.infobox-n .statistics.item,
.infobox-n .statistics.weapon {
  background-color: #ffece5;
  border-bottom: 1px solid #ffdacc;
  border-top: 1px solid #ffc7b3;
  padding-left: 2em;
  margin: 0;
}
.infobox-n .statistics.item.empty,
.infobox-n .statistics.weapon.empty {
  border: none;
}
.infobox-n .statistics.item .characteristic,
.infobox-n .statistics.weapon .characteristic {
  font-size: 82%;
  font-weight: bold;
}
.infobox-n .statistics .unique {
  color: #b39e42;
}
.infobox-n .statistics .untradable {
  color: #31b434;
}
/* Mount details */
.infobox-n .details.mount {
  background-color: #fce5ff;
  border-bottom: 1px solid #f9ccff;
  border-top: 1px solid #f6b3ff;
  padding-left: 2em;
  margin: 0;
}
.infobox-n .details.mount.empty {
  border: none;
}
.infobox-n .details.mount .characteristic {
  font-size: 82%;
  font-weight: bold;
}
/* NPC statistics */
.infobox-n .statistics.hunt {
  font-weight: bold;
  font-style: italic;
  font-size: 0.9em;
  text-shadow: 0px 0px 1px #333;
}
.infobox-n .statistics.hunt.rank-a {
  background: linear-gradient(to right, #fd2424, #fffdbc);
  border-bottom: 1px solid #ffcc80;
  border-top: 1px solid #ffad33;
  margin: 0;
}
.infobox-n .statistics.hunt.rank-b {
  background: linear-gradient(to right, #009e81, #d8fdf6);
  border-bottom: 1px solid #75f0d9;
  border-top: 1px solid #17cfad;
  margin: 0;
}
.infobox-n .statistics.hunt.rank-s {
  background: linear-gradient(to right, #c619ff, #feffff);
  border-bottom: 1px solid #c180ff;
  border-top: 1px solid #a733ff;
  margin: 0;
}
/* Nav */
div.nav.class-nav table th.class-cell,
div.nav.class-nav table td.class-cell,
div.nav.job-nav table th.class-cell,
div.nav.job-nav table td.class-cell {
  text-align: left;
  font-weight: normal;
}
div.nav.class-nav table th {
  text-align: center;
}
div.nav.class-nav table th:last-child,
div.nav.job-nav table th:last-child {
  border: none;
}
div.nav.job-nav {
  width: 950px;
}
div.nav.class-nav {
  width: 850px;
}
/* Fix quest infobox dt to accommodate previous quest */
div.infobox-n.quest dt {
  width: 100px;
}
/* TABLES */
/* quest */
.table.quest > :first-child > tr:first-child,
.table.quest > tbody > tr.heading,
.table.quest > :first-child > tr:first-child > *,
.table.quest > tbody > tr.heading > * {
  background-color: #efae4d;
  border-color: #e18f14;
}
.table.quest > tbody > tr > th,
.table.quest > tfoot > tr > th,
.table.quest > thead > tr > th,
table.table > tbody > tr.quest > th {
  background-color: #efae4d;
  border-color: #e18f14;
}
.table.quest > tbody > tr:nth-child(odd),
.table > tbody > tr.quest:nth-child(odd) {
  background-color: #fff3d8;
}
/* Relic weapons nav */
div.nav.relic .pre-relic-label {
  width: 120px;
}
div.nav.relic .relic-list {
  padding-bottom: 6px;
}
div.nav.relic .role-subheading {
  padding: 0 8px;
  position: absolute;
}
div.nav.relic td.mw-collapsible div.mw-collapsible-content {
  padding-top: 0.6em;
}
div.nav.relic .first-role-job {
  width: 112px;
}
div.nav.relic .heading {
  background-color: #8d5bc2;
}
div.nav.relic dd,
div.nav.relic dt,
div.nav.relic table th {
  border-color: #8d5bc2;
}
/* Map icons */
.map-icons {
  display: inline-block;
  width: 28px;
  height: 24px;
  vertical-align: middle;
  text-align: center;
}
/* SEARCH MAP */
.search-map {
  display: flex;
  flex-wrap: wrap;
}
/* Map Frame */
/* Title element */
.search-map .map-frame .map-title {
  position: relative;
  padding: 0.1em 0;
  font-family: "IBM Plex Sans JP", "Times New Roman", serif !important;
  font-size: 1.5em;
  font-style: italic;
  text-align: center;
  background: #9d9e47;
  font-weight: bold;
  background-image: url(/mediawiki/images/b/b3/Box_overlay.png);
  border: 1px solid #464620;
  border-bottom-width: 0;
}
/* Image element */
.search-map .map-frame .map {
  position: relative;
  width: 502px;
  border: 1px solid #464620;
}
.search-map.big .map-frame .map {
  width: 1002px;
}
.search-map.medium .map-frame .map {
  width: 752px;
}
.search-map .map-frame .map .inner-border {
  border: 1px solid #696930;
}
/* Map markers */
.search-map .map-frame .map .marker {
  position: absolute;
  -webkit-filter: drop-shadow(0 0 1px #00ff00);
  filter: drop-shadow(0 0 1px #00ff00);
}
/* Caption element */
.search-map .caption {
  margin-left: 1em;
}
.search-map.big .caption {
  margin: 0.6em 0;
}
/* HQ color */
.hq-sepia {
  filter: sepia() drop-shadow(1px 1px 1px rgb(202, 161, 12));
  -webkit-filter: sepia() drop-shadow(1px 1px 1px rgb(202, 161, 12));
}
/* H3 Fix */
h3 {
  margin-bottom: 0.25em !important;
}
/* OLD: Infobox template style */
.infobox {
  border: 1px solid #020202;
  background-color: #f9f9f9;
  color: black;
  margin-bottom: 0.5em;
  margin-left: 1em;
  padding: 0.2em;
  float: right;
  clear: right;
}
.infobox td,
.infobox th {
  vertical-align: top;
}
.infobox caption {
  font-size: larger;
  margin-left: inherit;
}
.infobox.bordered {
  border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
  border: 1px solid #020202;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
  border: 0;
}
/*Removes header from front page*/
body.page-FF14_Wiki h1.firstHeading {
  display: none;
}
/* Allow limiting of which header levels are shown in a TOC;
  <div class="toclimit-3">, for instance, will limit to
  showing ==headings== and ===headings=== but no further
  (as long as there are no =headings= on the page, which
  there shouldn't be according to the MoS). */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
  display: none;
}
/* new main page */
.mobile-element {
  display: none !important;
}
.desktop-element {
  display: block !important;
}
html {
  height: auto;
}
/* top and bottom banners (add header and footer) */
body {
body {
  min-height: 105vh;
   background-color: rgb(218,232,247);
   background-color: rgb(218,232,247);
   background-position-x: 0%, 0%;
   background-position-x: 0%, 0%;
Line 3,389: Line 117:
   background-origin: padding-box, padding-box;
   background-origin: padding-box, padding-box;
   background-clip: border-box, border-box;
   background-clip: border-box, border-box;
font-family: "IBM Plex Sans JP",sans-serif;
  font-family: var(--font-family-body);
}
}
 
.mw-body h1,
#content h1 {
.mw-body h2 {
font-family: "IBM Plex Sans JP",sans-serif;
   font-family: var(--font-family-heading);
font-weight: 500;
   font-weight: 500;
}
 
#content h2 {
font-family: "IBM Plex Sans JP",sans-serif;
font-weight: 500;
}
 
 
/* Important: show only desktop ad code on Desktop*/
.nodesktop {
  display: none !important;
}
 
/* makes primis a certain size on desktop */
.primis {
  width:700px !important;
}
 
/*relic weapons*/
.relic-header {
  border: 1px solid #ffc9c9;
  background-color: #FFFFF3;
}
 
.relic-quest {
  border: 1px solid #A2A8B1;
  background-color: #F7F7F7;
}
 
.relic-quest p {
    padding-left: 0.5em;
    padding-right: 0.5em;
}
 
.relic-quest h3{
    margin-left: 0.4em;
}
 
.relic-quest h4 {
    font-size: 1.2em;
    margin-left: 0.4em;
}
 
.relic-quest li {
    margin-right: 0.4em;
}
 
.relic-quest .table {
    margin-right: 0.5em;
}
 
.relic-quest div.thumbinner {
    margin-right: 0.5em;
}
 
.relic-quest-heading {
  background: #CCCCFF;
  padding: 0.3em;
}
 
.relic-quest-cell {
  background: #DDDDFF;
  padding: 0.3em;
}
 
span.ce-reward-bronze {
  background: #e3a25d;
  color: #000000;
  display: inline-block;
  padding: 0px 3px 3px 3px;
  width: 30px;
  text-align: center;
  border-radius: 10px;
}
 
span.ce-reward-silver {
  background: #c3c3c3;
  color: #000000;
  display: inline-block;
  padding: 0px 3px 3px 3px;
  width: 30px;
  text-align: center;
  border-radius: 10px;
}
 
span.ce-reward-gold {
  background: #ffd800;
  color: #000000;
  display: inline-block;
  padding: 0px 3px 3px 3px;
  width: 30px;
  text-align: center;
  border-radius: 10px;
}
 
 
#fuse-privacy-tool {
    font-size: 0.5rem;
}
 
div.mw-dismissable-notice .mw-dismissable-notice-close {
  display: none !important;
}
 
/* Class for fixing line height around small inline icons */
.text-icon img {
  max-height: 24px;
  width: auto;
  vertical-align: middle;
  /* value difference is alignment fudge. vertical-align: middle is relative to the
  * entire line, including descender height. our icons are almost always shown next
  * to text with no descenders, so we want to center the icons for that instead */
  margin-top: -2em;
  margin-bottom: -1.85em;
}
/* don't apply the fix in headings, since their height and margins negate it */
:is(h2, h3, h4, h5, h6) .text-icon img {
  margin-top: 0;
  margin-bottom: 0;
  max-height: none;
}
 
.infobox-n .image_wrapper .image img {
  width: auto;
  height: auto;
  /* NOTE: these dimensions are also hardcoded in {{infobox image}}; don't update one without updating the other */
  max-width: 280px;
  max-height: 420px;
}
 
/* Style theme toggle button to work better outside wiki.gg */
#pt-themes {
  --color-base: currentcolor; /* ensure icon is visible in all themes */
  margin: -0.4rem 0;
  padding: 0;
  top: 1.25rem;
  transform: translateY(-50%);
}
 
.action-history {
  background-color: #EBEBEB;
}
 
.mw-indicators {
   position: relative;
  z-index: 0 !important;
}
 
.infobox-n .tabber__tabs {
  justify-content: safe center;
}
 
.hover-image-container:hover .image-overlay {
  opacity: 1;
}
 
.image-overlay {
  position: absolute;
  top: 3em;
  bottom: 0;
  left: 0;
  right: 0;
  height: 80%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
}
 
/**
  Navbox classes
**/
.navbox {
  background: var(--navbox-bg);
}
 
.navbox,
.mw-parser-output .navbox-list-with-group,
.bg3wiki-navbox {
  text-align: center;
  border:1px solid var(--tooltip-border);
  color: var(--fg);
   width: 100%;
}
 
.mw-parser-output .navbox-list-with-group, {
  color: var(--navbox-header-text);
  background-color: var(--navbox-bg);
}
 
/* These important tags will be removed, emergency fix */
.navbox-title {
font-weight: bold;
background-color: var(--navbox-header-bg);
border-top: var(--navbox-inner-border);
}
 
div > table > tbody >tr > th.navbox-title {
    border-top: none !important;
}
}
.navbox-group {
font-weight: bold;
background-color: var(--navbox-label-bg);
border-top: var(--navbox-label-border);
}
.navbox-subgroup .navbox-group {
font-weight: bold;
background-color: var(--navbox-sublabel-bg);
border-top: var(--navbox-label-border);
border-left: var(--navbox-label-border);
}
.navbox-list {
  border:1px solid var(--tooltip-border);
  background-color: var(--navbox-data-bg);
}
.navbox-odd {
background-color: var(--navbox-data-row-odd-bg);
border: none !important;
color: var(--fg);
}
.navbox-even {
background-color: var(--navbox-data-row-even-bg);
border: none !important;
border-top: var(--navbox-inner-border) !important;
color: var(--fg);
}
.navbox-list-with-group .navbox-list .navbox-odd {
    border-top: var(--navbox-inner-border) !important;
}
/* Standard Frame Icon */
.standard-frame-icon {
  --frame-image: url("/mediawiki/images/d/d9/Action_overlay_glassy.png");
  --icon-size: 40px;
  --frame-size: calc(var(--icon-size) * 1.2); /* 48px for 40px icon */
  --icon-offset-x: calc(var(--icon-size) * 0.1); /* 4px for 40px icon */
  --icon-offset-y: calc(var(--icon-size) * 0.075); /* 3px for 40px icon */
  position: relative;
  width: var(--frame-size);
  height: var(--frame-size);
  display: inline-block !important;
  vertical-align: middle;
  /* default background for missing/transparent icon images */
  background-image: url(/mediawiki/images/2/2b/Action_background.png);
  background-position: var(--icon-offset-x) var(--icon-offset-y);
  background-size: var(--icon-size);
  background-repeat: no-repeat;
}
/* Icon image */
.standard-frame-icon img,
.standard-frame-icon .mw-broken-media {
  display: block;
  position: absolute;
  top: var(--icon-offset-y);
  left: var(--icon-offset-x);
  width: var(--icon-size);
  height: var(--icon-size);
}
/* Display unknown item icon for broken icon links */
.standard-frame-icon .mw-broken-media {
  background-image: url("/mediawiki/images/4/48/Unknown_item_icon.png");
  background-size: var(--icon-size);
  font-size: 0;
}
/* Frame */
.standard-frame-icon::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-image: var(--frame-image);
  background-size: var(--frame-size);
  z-index: 2;
  pointer-events: none;
}
/* Dye slot container */
.standard-frame-icon-dye-slots {
  position: absolute;
  top: 0;
  right: calc(var(--icon-size) * 0.075); /* 3px at 40px */
  z-index: 3;
}
/* Dye slot circles */
.standard-frame-icon-dye-slots span {
  display: block;
  width: calc(var(--icon-size) * 0.175); /* 7px at 40px */
  height: calc(var(--icon-size) * 0.175);
  border: calc(var(--icon-size) * 0.025) solid #000; /* 1px at 40px */
  border-radius: 50%;
  margin-bottom: calc(var(--icon-size) * 0.1); /* 4px gap at 40px */
}
/* Sizes */
.standard-frame-icon.mid {--icon-size: 30px}
.standard-frame-icon.small {--icon-size: 20px}
/* Alternate frames */
.standard-frame-icon-hq {--frame-image: url("/mediawiki/images/a/af/HQ_overlay.png")}
.standard-frame-icon-trait {--frame-image: url("/mediawiki/images/d/da/Trait_frame.png")}
.standard-frame-icon-achievement {--frame-image: url("/mediawiki/images/2/22/Achievement_frame.png")}
/* Link colors extend to any nested <code> elements within the link text */
.mw-parser-output a code {
    color: inherit !important; /* important overrides dark theme styles */
}
/*</nowiki>*/

Revision as of 21:34, 16 March 2026

/* New font for headers & navigation to replace EasonPro */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP:wght@100;200;300;400;500;600;700&display=swap');

:root {
  --text-color: #36414f;

  --font-family-body: "IBM Plex Sans JP", sans-serif;
  --font-family-heading: "IBM Plex Sans JP", sans-serif;
}

/* Adjust padding on sidebar to account for white background */
#mw-panel .portal {
  font-family: "IBM Plex Sans JP", sans-serif;
  margin-bottom: 10px;
  padding: 0.5rem 0;
  direction: ltr;
  background: white;
  border-radius: 6px;
  padding: 10px;
  font-weight: normal;
}

/* Remove bold from sidebar links */
div#mw-panel ul.vector-menu-content-list > li > a {
  font-weight: normal;
}

/* Change personal navigation menu text and icons to white */
#p-personal {
  color: #FFFFFF;
}
#p-personal a {
  color: inherit;
}

/* Change color and borders of head */
:root {
  --mw-head-height: 40px;
}
#mw-head-base {
  background: #535353;
  border-top: 0px;
  border-left: 0px;
  border-right: 0px;
  border-bottom: 0px;
  bottom: 0;
  height: var(--mw-head-height);
  margin-top: calc(-1 * var(--mw-head-height));
}

/* Change font color and weight in head */
div#mw-head .vector-menu-tabs li a,
.vector-menu-dropdown .vector-menu-heading {
  color: #ffffff;
  font-weight: 400;

  /* Center tab text vertically */
  height: var(--mw-head-height);
  padding-block: 0;
  display: flex;
  align-items: center;
}

/* Change font color and weight of selected tab */
div#mw-head .vector-menu-tabs-legacy .selected a,
div#mw-head .vector-menu-tabs-legacy .selected a:visited {
  color:#000;
  font-weight:600;
}

/* Change selected tab color and font color in head */
div#mw-head ul.vector-menu-content-list > li.selected {
  background-color: #FFFFFF;
  color: #000000;
  font-weight: 600;
}

/* fix watchlink icon overlapping with hidden label text */
div#mw-head .vector-menu-tabs .mw-watchlink.icon a {
  text-indent: 9999px;
}

/* Remove left padding of tab menu */
.vector-menu-tabs-legacy {
  padding-left: 0px;
}

/* Remove border from body and add dropshadow*/
@media screen {
  .mw-body {
    color:var(--text-color);
    margin-top: 0px;
    border: 0px;
    border-right-width: 0px;
    box-shadow: 0 4px 16px #0003;
  }
}

/* Change font color of 'More' tab to white */
.vector-menu-dropdown .vector-menu-heading {
  color:white;
}

body {
  background-color: rgb(218,232,247);
  background-position-x: 0%, 0%;
  background-position-y: 0%, 0%;
  background-attachment: scroll, scroll;
  background-image: linear-gradient(
    to bottom,
    rgb(55, 91, 153) 0px,
    rgb(54, 103, 175) 100px,
    rgb(59, 124, 190) 400px,
    rgb(218,232,247) 900px
  );
  background-size: auto, auto;
  background-origin: padding-box, padding-box;
  background-clip: border-box, border-box;
  font-family: var(--font-family-body);
}
.mw-body h1,
.mw-body h2 {
  font-family: var(--font-family-heading);
  font-weight: 500;
}

Retrieved from "https://ffxiv.consolegameswiki.com/mediawiki/index.php?title=User:Cryebunnie/vector.css&oldid=1251734"