Difference between revisions of "MediaWiki:Mobile.css"

From Final Fantasy XIV Online Wiki
Jump to navigation Jump to search
Tag: Manual revert
 
(42 intermediate revisions by 2 users not shown)
Line 1: Line 1:
/* CSS placed here will affect users of the mobile site */
/* CSS placed here will affect users of the mobile site */
/* new mobile CSS (after updating the wiki version */
/* move overlay menus down on mobile (both left menu and search bar) */
#mw-mf-page-left {
  top: 80px;
}
.overlay-header-container.position-fixed {
  top: 80px;
 
}
.overlay-content {
  top: 80px
}
/* move search bar icon left */
nav.minerva-user-navigation {
  display: flex;
  justify-content: left;
}
/* eliminate horizontal scrollbar (not in use because we need the horizontal scrollbar in many instances */
/*
div#mw-mf-viewport{
  overflow-x: hidden;
}
*/
/* end of new mobile CSS (after updating the wiki version */


/* new main page */
/* new main page */


.desktop-frontpage {
.desktop-frontpage {
    display: none !important;
  display: none !important;
}
}


.mobile-frontpage {
.mobile-frontpage {
    display: block !important;
  display: block !important;
}
}


.desktop-element {
.desktop-element {
    display: none !important;
  display: none !important;
}
}
.mobile-element {
.mobile-element {
    display: block !important;
  display: block !important;
}
}


@font-face {
@font-face {
    font-family: 'EasonPro';
  font-family: "EasonPro";
    src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot);
  src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot);
    src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot?#iefix") format('embedded-opentype'), url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.woff) format('woff'), url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.ttf) format('truetype'), url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.svg#EasonProregular") format('svg');
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot?#iefix")
    font-weight: normal;
      format("embedded-opentype"),
    font-style: normal
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.woff)
      format("woff"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.ttf)
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.svg#EasonProregular")
      format("svg");
  font-weight: normal;
  font-style: normal;
}
}


@font-face {
@font-face {
    font-family: 'EasonPro';
  font-family: "EasonPro";
    src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.eot);
  src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.eot);
    src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.eot?#iefix") format('embedded-opentype'), url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.woff) format('woff'), url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.ttf) format('truetype'), url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.svg#EasonProitalic") format('svg');
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.eot?#iefix")
    font-weight: normal;
      format("embedded-opentype"),
    font-style: italic
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.woff)
      format("woff"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.ttf)
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.svg#EasonProitalic")
      format("svg");
  font-weight: normal;
  font-style: italic;
}
}


@font-face {
@font-face {
    font-family: 'EasonPro';
  font-family: "EasonPro";
    src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.eot);
  src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.eot);
    src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.eot?#iefix") format('embedded-opentype'), url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.woff) format('woff'), url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.ttf) format('truetype'), url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.svg#EasonProBold") format('svg');
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.eot?#iefix")
    font-weight: bold;
      format("embedded-opentype"),
    font-style: normal
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.woff)
      format("woff"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.ttf)
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.svg#EasonProBold")
      format("svg");
  font-weight: bold;
  font-style: normal;
}
}


@font-face {
@font-face {
    font-family: 'CronosPro';
  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);
    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');
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/cronos/v1/cronospro-regular-webfont.eot?#iefix")
    font-weight: normal;
      format("embedded-opentype"),
    font-style: normal
    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;
}
}


Line 55: Line 111:


#mobile-pagewrap {
#mobile-pagewrap {
    width: 960px;
  width: 960px;
    font-size: 95%;
  font-size: 95%;
    margin: 15px auto;
  margin: 15px auto;
    box-shadow: rgba(0, 0, 0, 0.5) 0 0 .75em;
  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(.02, #fff), color-stop(1, #eee));
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #bbb),
    color-stop(0.02, #fff),
    color-stop(1, #eee)
  );
}
}


.mobile-column {
.mobile-column {
    min-height: 330px;
  min-height: 330px;
    width: 320px;
  width: 320px;
    float: left;
  float: left;
}
}


.mobile-first-column {
.mobile-first-column {
    width: 641px;
  width: 641px;
}
}


.mobile-box-content {
.mobile-box-content {
    padding: 5px 15px;
  padding: 5px 15px;
}
}


#mobile-bottom {
#mobile-bottom {
    clear: both;
  clear: both;
}
}


Line 85: Line 148:
/* for 980px or less */
/* for 980px or less */
@media screen and (max-width: 980px) {
@media screen and (max-width: 980px) {
  #mobile-pagewrap {
    width: 94%;
  }


    #mobile-pagewrap {
  .mobile-column {
        width: 94%;
    width: 50%;
    }
  }


    .mobile-column {
  .mobile-first-column {
        width: 50%;
    width: 70%;
    }
  }


    .mobile-first-column {
  .mobile-second-column {
        width: 70%;
    width: 30%;
    }
  }


    .mobile-second-column {
  .mobile-box-content {
        width: 30%
    padding: 1% 4%;
    }
  }
 
    .mobile-box-content {
        padding: 1% 4%;
    }
 
    .two-column-break {
        clear: both;
    }


  .two-column-break {
    clear: both;
  }
}
}


/*for 820px or less*/
/*for 820px or less*/
@media screen and (max-width: 820px) {
@media screen and (max-width: 820px) {
    .mobile-first-column .floatleft {
  .mobile-first-column .floatleft {
        float: none;
    float: none;
        text-align: center;
    text-align: center;
        width: 100%;
    width: 100%;
    }
  }
}
}


/* for 600px or less */
/* for 600px or less */
@media screen and (max-width: 600px) {
@media screen and (max-width: 600px) {
    .mobile-column {
  .mobile-column {
        width: auto;
    width: auto;
        float: none;
    float: none;
    }
  }
 
    .mobile-column {
        min-height: inherit;
    }


  .mobile-column {
    min-height: inherit;
  }
}
}


Line 138: Line 198:
*************************************************************************************/
*************************************************************************************/
.mobile-box-header {
.mobile-box-header {
    font-family: EasonPro, "Times New Roman", serif;
  font-family: EasonPro, "Times New Roman", serif;
    font-size: 1.5em;
  font-size: 1.5em;
    color: #FFF;
  color: #fff;
    text-shadow: rgba(0, 0, 0, 0.75) 0 0 .25em;
  text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
    background-color: #444;
  background-color: #444;
    background-image: url(https://ffxiv.consolegameswiki.com/mediawiki/images/a/aa/Bg_gradient4.jpg) !important;
  background-image: url(/mediawiki/images/a/aa/Bg_gradient4.jpg) !important;
    font-weight: 400;
  font-weight: 400;
    text-align: center;
  text-align: center;
}
}


#mobile-pagewrap {
#mobile-pagewrap {
    border: 1px solid #ccc;
  border: 1px solid #ccc;
}
}


.mobile-column {
.mobile-column {
   
  border-right: 1px solid #ccc;
    border-right: 1px solid #ccc;
  margin-left: -1px;
    margin-left: -1px;
}
}


.mobile-second-column {
.mobile-second-column {
    border-right: none;
  border-right: none;
}
}


/* fixes quotation template on mobile */
/* fixes quotation template on mobile */
.quotation-box{
.quotation-box {
    margin-left: 0!important;
  margin-left: 0 !important;
}
}


Line 171: Line 230:


p img {
p img {
    margin: 0;
  margin: 0;
}
}


img {
img {
    border: none;
  border: none;
    vertical-align: middle;
  vertical-align: middle;
}
}


p, ul, ol, dl {
p,
    margin-top: 0.7692307692em;
ul,
    margin-bottom: 0.7692307692em;
ol,
    line-height: 1.5384615385em;
dl {
  margin-top: 0.7692307692em;
  margin-bottom: 0.7692307692em;
  line-height: 1.5384615385em;
}
}


.infobox-n .clear, .nav .clear, .recipe-box .clear {
.infobox-n .clear,
    height: 5px;
.nav .clear,
.recipe-box .clear {
  height: 5px;
}
}


Line 192: Line 256:


div.infobox-n {
div.infobox-n {
   float:center;
   float: center;
   position:relative;
   position: relative;
   width:300px;
   width: 300px;
   background:#FFF;
   background: #fff;
   font-size:.923em;
   font-size: 0.923em;
   border:1px solid #AAA;
   border: 1px solid #aaa;
   margin:0 0 1em 1em;
   margin: 0 0 1em 1em;
   padding:0;
   padding: 0;
}
}


div.infobox-n,
div.infobox-n,
div.nav .box {
div.nav .box {
   filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
   filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
   background-image:linear-gradient(top, #fff 0%, #eee 100%);
   background-image: linear-gradient(top, #fff 0%, #eee 100%);
   background-image:-o-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: -moz-linear-gradient(top, #fff 0%, #eee 100%);
   background-image:-webkit-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: -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));
   background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #fff),
    color-stop(1, #eee)
  );
}
}


div.infobox-n .icon {
div.infobox-n .icon {
   float:right;
   float: right;
   position:relative;
   position: relative;
   z-index:2;
   z-index: 2;
   width:auto;
   width: auto;
   margin:5px;
   margin: 5px;
}
}


div.infobox-n .icon p {
div.infobox-n .icon p {
   text-align:center;
   text-align: center;
   color:#444;
   color: #444;
   font-size:9px!important;
   font-size: 9px !important;
   background-color:rgba(255,255,255,0.5);
   background-color: rgba(255, 255, 255, 0.5);
   border-radius:.75em;
   border-radius: 0.75em;
   line-height:1em;
   line-height: 1em;
   margin:.25em -.5em;
   margin: 0.25em -0.5em;
   padding:2px;
   padding: 2px;
}
}


div.infobox-n .wrapper {
div.infobox-n .wrapper {
   clear:both;
   clear: both;
   padding:0;
   padding: 0;
}
}


div.infobox-n .statistics {
div.infobox-n .statistics {
   text-align:center;
   text-align: center;
   margin:0 8px;
   margin: 0 8px;
}
}


div.statistics span + span { margin-left:5px; }
div.statistics span + span {
  margin-left: 5px;
}


div.infobox-n .heading,
div.infobox-n .heading,
div.nav .heading {
div.nav .heading {
   font-weight:700;
   font-weight: 700;
   background-image:url(https://ffxiv.consolegameswiki.com/mediawiki/images/b/b3/Box_overlay.png) !important;
   background-image: url(/mediawiki/images/b/b3/Box_overlay.png) !important;
   text-align:center;
   text-align: center;
   border:1px solid rgba(0,0,0,0.25);
   border: 1px solid rgba(0, 0, 0, 0.25);
   border-bottom-width:0;
   border-bottom-width: 0;
   position:relative;
   position: relative;
   z-index:1;
   z-index: 1;
   font-size-adjust:.52;
   font-size-adjust: 0.52;
   margin:-1px -1px 5px!important;
   margin: -1px -1px 5px !important;
}
}


div.infobox-n .heading {
div.infobox-n .heading {
   font-family:EasonPro, "Times New Roman", serif!important;
   font-family: EasonPro, "Times New Roman", serif !important;
   font-size:1.417em!important;
   font-size: 1.417em !important;
   color:#fff!important;
   color: #fff !important;
   background-color:#444;
   background-color: #444;
   text-shadow:rgba(0,0,0,0.75) 0 0 .25em;
   text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
   line-height:1.176em;
   line-height: 1.176em;
   font-size-adjust:.43;
   font-size-adjust: 0.43;
   padding:.4em!important;
   padding: 0.4em !important;
}
}


div.infobox-n .subheading,
div.infobox-n .subheading,
div.nav .subheading {
div.nav .subheading {
   font-weight:700;
   font-weight: 700;
   background-color:#888;
   background-color: #888;
   background-image:url("/images/c/cc/Infobox_header_overlay.png")!important;
   background-image: url("/images/c/cc/Infobox_header_overlay.png") !important;
   border-left:1px solid rgba(0,0,0,0.25);
   border-left: 1px solid rgba(0, 0, 0, 0.25);
   border-right:1px solid rgba(0,0,0,0.25);
   border-right: 1px solid rgba(0, 0, 0, 0.25);
   line-height:100%;
   line-height: 100%;
   text-align:center;
   text-align: center;
   position:relative;
   position: relative;
   margin:0 -1px!important;
   margin: 0 -1px !important;
}
}


div.infobox-n .subheading {
div.infobox-n .subheading {
   font-family:EasonPro, "Times New Roman", serif;
   font-family: EasonPro, "Times New Roman", serif;
   font-size:1.25em!important;
   font-size: 1.25em !important;
   color:#fff!important;
   color: #fff !important;
   background-color:#444;
   background-color: #444;
   text-shadow:rgba(0,0,0,0.75) 0 0 .25em;
   text-shadow: rgba(0, 0, 0, 0.75) 0 0 0.25em;
   z-index:1;
   z-index: 1;
   line-height:1.333em;
   line-height: 1.333em;
   font-size-adjust:0.43;
   font-size-adjust: 0.43;
   padding:.567em!important;
   padding: 0.567em !important;
}
}


div.nav dl,
div.nav dl,
div.infobox-n dl { margin:10px 0; }
div.infobox-n dl {
  margin: 10px 0;
}


div.infobox-n dt {
div.infobox-n dt {
   float:left;
   float: left;
   text-align:right;
   text-align: right;
   width:95px;
   width: 95px;
   line-height:1em;
   line-height: 1em;
   font-weight:700;
   font-weight: 700;
   clear:left;
   clear: left;
   border-right:2px solid #999;
   border-right: 2px solid #999;
   margin:0 -2px 0 0;
   margin: 0 -2px 0 0;
   padding:2px 8px 2px 3px;
   padding: 2px 8px 2px 3px;
}
}


div.infobox-n dd {
div.infobox-n dd {
   float:left;
   float: left;
   width:175px;
   width: 175px;
   font-weight:400;
   font-weight: 400;
   border-left:2px solid #999;
   border-left: 2px solid #999;
   margin:0;
   margin: 0;
   padding:2px 7px;
   padding: 2px 7px;
}
}


div.infobox-n .image_wrapper {
div.infobox-n .image_wrapper {
   text-align:center;
   text-align: center;
   padding:0;
   padding: 0;
   margin:10px 0;
   margin: 10px 0;
}
}


Line 330: Line 404:
div.nav .subheading::after,
div.nav .subheading::after,
.table::after {
.table::after {
   content:"";
   content: "";
   position:absolute;
   position: absolute;
   width:100%;
   width: 100%;
   left:0;
   left: 0;
   height:3px;
   height: 3px;
   background-image:url(https://ffxiv.consolegameswiki.com/mediawiki/images/4/45/Shadow_after.png);
   background-image: url(/mediawiki/images/4/45/Shadow_after.png);
   background-size:100% 3px;
   background-size: 100% 3px;
}
}


div.infobox-n::after,
div.infobox-n::after,
div.nav .box::after { bottom:-4px; }
div.nav .box::after {
  bottom: -4px;
}


div.infobox-n .heading::after,
div.infobox-n .heading::after,
Line 346: Line 422:
div.infobox-n .subheading::after,
div.infobox-n .subheading::after,
div.nav .subheading::after,
div.nav .subheading::after,
.table::after { bottom:-3px; }
.table::after {
  bottom: -3px;
}


/* Remove after shadow for tables that have been centered, otherwise the shadow spans the entire page */
/* Remove after shadow for tables that have been centered, otherwise the shadow spans the entire page */
.table[class*=center]::after,
.table[class*="center"]::after,
.table.noshadowafter::after { background-image:none; }
.table.noshadowafter::after {
  background-image: none;
}


div.infobox-n table,
div.infobox-n table,
div.nav table { background-color:transparent; }
div.nav table {
  background-color: transparent;
}


div.infobox-n.healer-role dd,
div.infobox-n.healer-role dd,
div.infobox-n.healer-role dt { border-color:#3c6829!important; }
div.infobox-n.healer-role dt {
  border-color: #3c6829 !important;
}


div.infobox-n.healer-role .heading,
div.infobox-n.healer-role .heading,
div.infobox-n.healer-role .subheading { background-color:#3c6829!important; }
div.infobox-n.healer-role .subheading {
  background-color: #3c6829 !important;
}


div.infobox-n.tanker-role dd,
div.infobox-n.tanker-role dd,
div.infobox-n.tanker-role dt { border-color:#364496!important; }
div.infobox-n.tanker-role dt {
  border-color: #364496 !important;
}


div.infobox-n.tanker-role .heading,
div.infobox-n.tanker-role .heading,
div.infobox-n.tanker-role .subheading { background-color:#364496!important; }
div.infobox-n.tanker-role .subheading {
  background-color: #364496 !important;
}


div.infobox-n.dps-role dd,
div.infobox-n.dps-role dd,
div.infobox-n.dps-role dt { border-color:#683535!important; }
div.infobox-n.dps-role dt {
  border-color: #683535 !important;
}


div.infobox-n.dps-role .heading,
div.infobox-n.dps-role .heading,
div.infobox-n.dps-role .subheading { background-color:#913737!important; }
div.infobox-n.dps-role .subheading {
  background-color: #913737 !important;
}


div.infobox-n.buff dd,
div.infobox-n.buff dd,
div.infobox-n.buff dt { border-color:#399!important; }
div.infobox-n.buff dt {
  border-color: #399 !important;
}


div.infobox-n.buff .heading,
div.infobox-n.buff .heading,
div.infobox-n.buff .subheading { background-color:#399!important; }
div.infobox-n.buff .subheading {
  background-color: #399 !important;
}


div.infobox-n.debuff dd,
div.infobox-n.debuff dd,
div.infobox-n.debuff dt { border-color:#363!important; }
div.infobox-n.debuff dt {
  border-color: #363 !important;
}


div.infobox-n.debuff .heading,
div.infobox-n.debuff .heading,
div.infobox-n.debuff .subheading { background-color:#363!important; }
div.infobox-n.debuff .subheading {
  background-color: #363 !important;
}


div.infobox-n.armor dd,
div.infobox-n.armor dd,
Line 390: Line 492:
div.infobox-n.armor dt,
div.infobox-n.armor dt,
div.infobox-n.weapon dt,
div.infobox-n.weapon dt,
div.infobox-n.item dt { border-color:#C30; }
div.infobox-n.item dt {
  border-color: #c30;
}


div.infobox-n.armor .heading,
div.infobox-n.armor .heading,
Line 397: Line 501:
div.infobox-n.armor .subheading,
div.infobox-n.armor .subheading,
div.infobox-n.weapon .subheading,
div.infobox-n.weapon .subheading,
div.infobox-n.item .subheading { background:#C30; }
div.infobox-n.item .subheading {
  background: #c30;
}


div.infobox-n.skin dd,
div.infobox-n.skin dd,
div.infobox-n.skin dt { border-color:#C4003E; }
div.infobox-n.skin dt {
  border-color: #c4003e;
}


div.infobox-n.skin .heading,
div.infobox-n.skin .heading,
div.infobox-n.skin .subheading { background:#C4003E; }
div.infobox-n.skin .subheading {
  background: #c4003e;
}


div.infobox-n.recipe {
div.infobox-n.recipe {
   width:250px;
   width: 250px;
   display:inline-block;
   display: inline-block;
   float:none;
   float: none;
   clear:none;
   clear: none;
   vertical-align:top;
   vertical-align: top;
   font-size:1em;
   font-size: 1em;
   margin:0 1em 1em 0;
   margin: 0 1em 1em 0;
}
}


div.infobox-n.recipe .heading,
div.infobox-n.recipe .heading,
div.infobox-n.recipe .subheading {
div.infobox-n.recipe .subheading {
   font-size:1.133em;
   font-size: 1.133em;
   background:#533610;
   background: #533610;
}
}


div.infobox-n.recipe .wrapper { padding:0 10px; }
div.infobox-n.recipe .wrapper {
  padding: 0 10px;
}


div.infobox-n.crafting .heading,
div.infobox-n.crafting .heading,
div.infobox-n.crafting .subheading { background:#533610; }
div.infobox-n.crafting .subheading {
  background: #533610;
}


div.infobox-n.crafting dd,
div.infobox-n.crafting dd,
div.infobox-n.recipe dd,
div.infobox-n.recipe dd,
div.infobox-n.crafting dt,
div.infobox-n.crafting dt,
div.infobox-n.recipe dt { border-color:#533610; }
div.infobox-n.recipe dt {
  border-color: #533610;
}


div.infobox-n.npc dd,
div.infobox-n.npc dd,
div.infobox-n.npc dt { border-color:#390; }
div.infobox-n.npc dt {
  border-color: #390;
}


div.infobox-n.npc .heading,
div.infobox-n.npc .heading,
div.infobox-n.npc .subheading { background:#390; }
div.infobox-n.npc .subheading {
  background: #390;
}


div.infobox-n.skill dd,
div.infobox-n.skill dd,
div.infobox-n.skill dt { border-color:#999; }
div.infobox-n.skill dt {
  border-color: #999;
}


div.infobox-n.skill .heading,
div.infobox-n.skill .heading,
div.infobox-n.skill .subheading { background:#444; }
div.infobox-n.skill .subheading {
  background: #444;
}


div.infobox-n.trait dd,
div.infobox-n.trait dd,
div.infobox-n.trait dt { border-color:#bb7639; }
div.infobox-n.trait dt {
  border-color: #bb7639;
}


div.infobox-n.trait .heading,
div.infobox-n.trait .heading,
div.infobox-n.trait .subheading { background:#ce8d54; }
div.infobox-n.trait .subheading {
  background: #ce8d54;
}


div.infobox-n.skill .icon > div { border:2px solid #111; }
div.infobox-n.skill .icon > div {
  border: 2px solid #111;
}


div.infobox-n.effect .condition { background:#363; }
div.infobox-n.effect .condition {
  background: #363;
}


div.infobox-n.effect .boon { background:#399; }
div.infobox-n.effect .boon {
  background: #399;
}


div.infobox-n.pet dd,
div.infobox-n.pet dd,
div.infobox-n.pet dt { border-color:#360; }
div.infobox-n.pet dt {
  border-color: #360;
}


div.infobox-n.pet .heading,
div.infobox-n.pet .heading,
div.infobox-n.pet .subheading { background:#360; }
div.infobox-n.pet .subheading {
  background: #360;
}


div.infobox-n.quest dd,
div.infobox-n.quest dd,
div.infobox-n.quest dt { border-color:#F90; }
div.infobox-n.quest dt {
  border-color: #f90;
}


div.infobox-n.quest .heading,
div.infobox-n.quest .heading,
div.infobox-n.quest .subheading { background:#F90; }
div.infobox-n.quest .subheading {
  background: #f90;
}


div.infobox-n.area dd,
div.infobox-n.area dd,
div.infobox-n.area dt { border-color:#306; }
div.infobox-n.area dt {
  border-color: #306;
}


div.infobox-n.area .heading,
div.infobox-n.area .heading,
div.infobox-n.area .subheading { background:#306; }
div.infobox-n.area .subheading {
  background: #306;
}


div.nav dt,
div.nav dt,
Line 477: Line 623:
div.infobox-n dt,
div.infobox-n dt,
div.infobox-n dd,
div.infobox-n dd,
div.nav table { line-height:1.667em; }
div.nav table {
  line-height: 1.667em;
}


div.infobox .heading,
div.infobox .heading,
Line 483: Line 631:
div.nav .heading,
div.nav .heading,
div.nav .subheading {
div.nav .subheading {
   color:#000!important;
   color: #000 !important;
   text-shadow:none!important;
   text-shadow: none !important;
   border-width:0!important;
   border-width: 0 !important;
}
}


/** NAV BARS **/
/** NAV BARS **/
div.nav {
div.nav {
   position:relative;
   position: relative;
   width:500px;
   width: 500px;
   margin:auto;
   margin: auto;
}
}


div.nav .box {
div.nav .box {
   position:relative;
   position: relative;
   font-size:.9230769231em;
   font-size: 0.9230769231em;
   border-spacing:0;
   border-spacing: 0;
   overflow:visible;
   overflow: visible;
   min-height:60px;
   min-height: 60px;
   border:1px solid #AAA;
   border: 1px solid #aaa;
   margin:5px;
   margin: 5px;
   padding:0;
   padding: 0;
}
}


div.nav .heading {
div.nav .heading {
   font-family:Arial, sans-serif!important;
   font-family: Arial, sans-serif !important;
   background-color:#888;
   background-color: #888;
   font-size:1.083em;
   font-size: 1.083em;
   line-height:100%;
   line-height: 100%;
   margin:-1px -1px 0;
   margin: -1px -1px 0;
   padding:.769em 0;
   padding: 0.769em 0;
}
}


div.nav .subheading {
div.nav .subheading {
   font-family:Arial, sans-serif;
   font-family: Arial, sans-serif;
   font-size:1em;
   font-size: 1em;
   font-size-adjust:.52;
   font-size-adjust: 0.52;
   padding:.833em 0;
   padding: 0.833em 0;
}
}


.nav .selflink { font-weight:bold; }
.nav .selflink {
  font-weight: bold;
}


div.nav dt,
div.nav dt,
Line 528: Line 678:
div.infobox dt,
div.infobox dt,
div.infobox dd,
div.infobox dd,
div.nav table { line-height:1.667em; }
div.nav table {
  line-height: 1.667em;
}


div.nav .center {
div.nav .center {
   text-align:center;
   text-align: center;
   margin:10px 0;
   margin: 10px 0;
}
}


div.nav .box table {
div.nav .box table {
   background-color:transparent;
   background-color: transparent;
   border-collapse:collapse;
   border-collapse: collapse;
   width:100%;
   width: 100%;
   margin:.667em 0;
   margin: 0.667em 0;
}
}


div.nav dt {
div.nav dt {
   float:left;
   float: left;
   text-align:right;
   text-align: right;
   width:125px;
   width: 125px;
   clear:left;
   clear: left;
   border-right:2px solid #999;
   border-right: 2px solid #999;
   margin:0 -2px 0 0;
   margin: 0 -2px 0 0;
   padding:2px 8px;
   padding: 2px 8px;
}
}


div.nav dd {
div.nav dd {
   float:left;
   float: left;
   text-align:left;
   text-align: left;
   border-left:2px solid #888;
   border-left: 2px solid #888;
   width:325px;
   width: 325px;
   margin:0;
   margin: 0;
   padding:2px 8px;
   padding: 2px 8px;
}
}


div.nav table th {
div.nav table th {
   text-align:right;
   text-align: right;
   border-right:2px solid #888;
   border-right: 2px solid #888;
   vertical-align:top;
   vertical-align: top;
   padding:2px 8px;
   padding: 2px 8px;
}
}


div.nav table td { padding:2px 8px; }
div.nav table td {
  padding: 2px 8px;
}


div.nav table td a,
div.nav table td a,
div.nav table td strong.selflink { white-space:nowrap; }
div.nav table td strong.selflink {
  white-space: nowrap;
}


div.nav.thin .box {
div.nav.thin .box {
   width:400px;
   width: 400px;
   margin-left:50px;
   margin-left: 50px;
}
}


div.nav.thin dt { width:75px; }
div.nav.thin dt {
  width: 75px;
}


div.nav.thin dd { width:290px; }
div.nav.thin dd {
  width: 290px;
}


div.nav.wide .box {
div.nav.wide .box {
   width:600px;
   width: 600px;
   margin-left:-50px;
   margin-left: -50px;
}
}


div.nav.wide dt { width:150px; }
div.nav.wide dt {
  width: 150px;
}


div.nav.wide dd { width:400px; }
div.nav.wide dd {
  width: 400px;
}


div.nav .heading .selflink { font-weight:bold !important; }
div.nav .heading .selflink {
  font-weight: bold !important;
}


div.nav.npc .heading { background-color:#6C3; }
div.nav.npc .heading {
  background-color: #6c3;
}


div.nav.npc dd,
div.nav.npc dd,
div.nav.npc dt,
div.nav.npc dt,
div.nav.npc table th { border-color:#6C3; }
div.nav.npc table th {
  border-color: #6c3;
}


div.nav.pve .heading { background-color:#FC6; }
div.nav.pve .heading {
  background-color: #fc6;
}


div.nav.pve dd,
div.nav.pve dd,
div.nav.pve dt,
div.nav.pve dt,
div.nav.pve table th { border-color:#FC6; }
div.nav.pve table th {
  border-color: #fc6;
}


div.nav.equip .heading { background-color:#F96; }
div.nav.equip .heading {
  background-color: #f96;
}


div.nav.equip dd,
div.nav.equip dd,
div.nav.equip dt,
div.nav.equip dt,
div.nav.equip table th { border-color:#F96; }
div.nav.equip table th {
  border-color: #f96;
}


div.nav.mech1 .heading { background-color:#9a66cc; }
div.nav.mech1 .heading {
  background-color: #9a66cc;
}


div.nav.mech1 dd,
div.nav.mech1 dd,
div.nav.mech1 dt,
div.nav.mech1 dt,
div.nav.mech1 table th { border-color:#9a66cc; }
div.nav.mech1 table th {
  border-color: #9a66cc;
}


div.nav.mech2 .heading { background-color:#3CC; }
div.nav.mech2 .heading {
  background-color: #3cc;
}


div.nav.mech2 dd,
div.nav.mech2 dd,
div.nav.mech2 dt,
div.nav.mech2 dt,
div.nav.mech2 table th { border-color:#3CC; }
div.nav.mech2 table th {
  border-color: #3cc;
}


div.nav.location .heading { background-color:#96C; }
div.nav.location .heading {
  background-color: #96c;
}


div.nav.location dd,
div.nav.location dd,
div.nav.location dt,
div.nav.location dt,
div.nav.location table th { border-color:#96C; }
div.nav.location table th {
  border-color: #96c;
}


div.nav.lore .heading { background-color:#C6C; }
div.nav.lore .heading {
  background-color: #c6c;
}


div.nav.lore dd,
div.nav.lore dd,
div.nav.lore dt,
div.nav.lore dt,
div.nav.lore table th { border-color:#C6C; }
div.nav.lore table th {
  border-color: #c6c;
}


div.nav.quest .heading { background-color:#F8B57D; }
div.nav.quest .heading {
  background-color: #f8b57d;
}


div.nav.quest dd,
div.nav.quest dd,
div.nav.quest dt,
div.nav.quest dt,
div.nav.quest table th { border-color:#F8B57D; }
div.nav.quest table th {
  border-color: #f8b57d;
}


div.nav.debuff .heading { background-color:#51A651; }
div.nav.debuff .heading {
  background-color: #51a651;
}


div.nav.debuff dd,
div.nav.debuff dd,
div.nav.debuff dt,
div.nav.debuff dt,
div.nav.debuff table th { border-color:#51A651; }
div.nav.debuff table th {
  border-color: #51a651;
}


div.nav.hom .heading { background-color:#C96; }
div.nav.hom .heading {
  background-color: #c96;
}


div.nav.hom dd,
div.nav.hom dd,
div.nav.hom dt,
div.nav.hom dt,
div.nav.hom table th { border-color:#C96; }
div.nav.hom table th {
  border-color: #c96;
}


div.nav.crafting .heading,
div.nav.crafting .heading,
div.nav.recipe .heading { background-color:#963; }
div.nav.recipe .heading {
  background-color: #963;
}


div.nav.crafting dd,
div.nav.crafting dd,
Line 661: Line 869:
div.nav.recipe dd,
div.nav.recipe dd,
div.nav.hom dt,
div.nav.hom dt,
div.nav.recipe table th { border-color:#963; }
div.nav.recipe table th {
  border-color: #963;
}


div.nav.guardian .heading,
div.nav.guardian .heading,
div.nav.guardian .subheading { background-color:#39C; }
div.nav.guardian .subheading {
  background-color: #39c;
}


div.nav.guardian dd,
div.nav.guardian dd,
div.nav.guardian dt,
div.nav.guardian dt,
div.nav.guardian table th { border-color:#39C; }
div.nav.guardian table th {
  border-color: #39c;
}


/* FFXIV Wiki - Custom */
/* FFXIV Wiki - Custom */
Line 674: Line 888:
div.nav.class-nav table th.class-cell,
div.nav.class-nav table th.class-cell,
div.nav.class-nav table td.class-cell {
div.nav.class-nav table td.class-cell {
    text-align: left;
  text-align: left;
    font-weight: normal;
  font-weight: normal;
}
}


div.nav.class-nav table th {
div.nav.class-nav table th {
    text-align: center;
  text-align: center;
}
}


div.nav.class-nav table th:last-child {
div.nav.class-nav table th:last-child {
    border: none;
  border: none;
}
}


div.nav.class-nav {
div.nav.class-nav {
    width: 840px;
  width: 840px;
}
}


Line 693: Line 907:


.table {
.table {
   border:0 solid;
   border: 0 solid;
   border-collapse:collapse;
   border-collapse: collapse;
   border-spacing:0;
   border-spacing: 0;
   font-size:.9230769231em;
   font-size: 0.9230769231em;
   text-align:left;
   text-align: left;
   clear:none;
   clear: none;
   position:relative;
   position: relative;
   display:inline-block;
   display: inline-block;
   vertical-align:top;
   vertical-align: top;
   margin:10px 0;
   margin: 10px 0;
   padding:0;
   padding: 0;
}
}


/* make table captions bold */
/* make table captions bold */
.table > caption { font-weight: bold }
.table > caption {
  font-weight: bold;
}


/* this is a hack to add borders to IE8- */
/* this is a hack to add borders to IE8- */
.table > thead, .table > tbody { border:0 solid #aaa\0/ }
.table > thead,
.table > tbody {
  border: 0 solid #aaa\0/;
}


.table tr {
.table tr {
   border:1px solid #aaa\0/;
   border: 1px solid #aaa\0/;
   text-align:left;
   text-align: left;
   border-color:#AAA;
   border-color: #aaa;
}
}


/* and this removes them for IE9+ */
/* and this removes them for IE9+ */
:root .table tr { border-top-width:0; border-bottom-width:0; }
:root .table tr {
  border-top-width: 0;
  border-bottom-width: 0;
}


.table > * > tr > :first-child { border-left:1px solid #AAA; }
.table > * > tr > :first-child {
.table > * > tr > :last-child { border-right:1px solid #AAA; }
  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 > tbody > tr:last-child > *,
.table > tbody > tr:last-child > *,
.table > tfoot > tr:last-child > *,
.table > tfoot > tr:last-child > *,
.table > caption { border-bottom:1px solid #AAA; }
.table > caption {
  border-bottom: 1px solid #aaa;
}


.table > tbody:first-child > tr:first-child > *,
.table > tbody:first-child > tr:first-child > *,
.table > tbody > tr.heading > *,
.table > tbody > tr.heading > *,
.table > thead > tr:first-child > * {
.table > thead > tr:first-child > * {
   background-image:url("/images/c/cc/Infobox_header_overlay.png");
   background-image: url("/images/c/cc/Infobox_header_overlay.png");
   background-color:#EEE;
   background-color: #eee;
   border-color:#AAA;
   border-color: #aaa;
   padding:.5em;
   padding: 0.5em;
}
}


Line 741: Line 969:
.table > tbody > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > th {
.table > tfoot > tr > th {
   line-height:1.667em;
   line-height: 1.667em;
   padding:.25em .5em;
   padding: 0.25em 0.5em;
}
}


.table tr > th, .table[class*=center] tr { text-align:center; }
.table tr > th,
.table[class*=left] tr { text-align:left; }
.table[class*="center"] tr {
.table[class*=right] tr { text-align:right; }
  text-align: center;
.table[class*=middle] tr { vertical-align:middle; }
}
.table[class*=top] tr { vertical-align:top; }
.table[class*="left"] tr {
.table[class*=bottom] tr { vertical-align:bottom; }
  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 > :first-child > tr:first-child,
.table > tbody > tr.heading {
.table > tbody > tr.heading {
   background-color:#EEE;
   background-color: #eee;
   border:1px solid #aaa!important;
   border: 1px solid #aaa !important;
}
}


.table > tbody > tr > th, .table > tfoot > tr > th {
.table > tbody > tr > th,
   background-color:#E7E7E7;
.table > tfoot > tr > th {
   border-color:#AAA;
   background-color: #e7e7e7;
   border-color: #aaa;
}
}


.table > tbody > tr:nth-child(odd) {
.table > tbody > tr:nth-child(odd) {
   background-color:#F3F3F3;
   background-color: #f3f3f3;
   border-color:#AAA;
   border-color: #aaa;
}
}


Line 771: Line 1,013:
.table > tbody > tr.heading,
.table > tbody > tr.heading,
.table > tbody > tr > [rowspan],
.table > tbody > tr > [rowspan],
.table > tbody > tr > [colspan] { border:1px solid #AAA; }
.table > tbody > tr > [colspan] {
  border: 1px solid #aaa;
}


.table > :first-child > tr:first-child + tr [rowspan],
.table > :first-child > tr:first-child + tr [rowspan],
.table > :first-child > tr:first-child + tr [colspan] { border-top-width:0; }
.table > :first-child > tr:first-child + tr [colspan] {
  border-top-width: 0;
}


.table .line,
.table .line,
.table .line-bottom {
.table .line-bottom {
   border-bottom-width:1px!important;
   border-bottom-width: 1px !important;
   border-bottom-style:solid;
   border-bottom-style: solid;
}
}


.table .line-top {
.table .line-top {
   border-top-width:1px!important;
   border-top-width: 1px !important;
   border-top-style:solid;
   border-top-style: solid;
   border-top-color:#AAA;
   border-top-color: #aaa;
}
}


.table .line-left {
.table .line-left {
   border-left-width:1px!important;
   border-left-width: 1px !important;
   border-left-style:solid;
   border-left-style: solid;
   border-left-color:#AAA;
   border-left-color: #aaa;
}
}


.table .line-right {
.table .line-right {
   border-right-width:1px!important;
   border-right-width: 1px !important;
   border-right-style:solid;
   border-right-style: solid;
   border-right-color:#AAA;
   border-right-color: #aaa;
}
}


.table table {
.table table {
   background-color:transparent;
   background-color: transparent;
   padding:0;
   padding: 0;
   margin:0;
   margin: 0;
}
}


/* any */
/* any */
  .table.any > :first-child > tr:first-child,
.table.any > :first-child > tr:first-child,
  .table.any > tbody > tr.heading,
.table.any > tbody > tr.heading,
  .table.any > :first-child > tr:first-child > *,
.table.any > :first-child > tr:first-child > *,
  .table.any > tbody > tr.heading > * {
.table.any > tbody > tr.heading > * {
    background-color:#888 !important;
  background-color: #888 !important;
    border-color:#6D6D6D !important;
  border-color: #6d6d6d !important;
  }
}
  .table.any > tbody > tr > th,
.table.any > tbody > tr > th,
  .table.any > tfoot > tr > th,
.table.any > tfoot > tr > th,
  .table.any > thead > tr > th,
.table.any > thead > tr > th,
  table.table > tbody > tr.any > th {
table.table > tbody > tr.any > th {
    background-color:#CCC;
  background-color: #ccc;
    border-color:#AAA;
  border-color: #aaa;
  }
}
  .table.any > tbody > tr:nth-child(odd),
.table.any > tbody > tr:nth-child(odd),
  .table > tbody > tr.any:nth-child(odd) {
.table > tbody > tr.any:nth-child(odd) {
    background-color:#EEE;
  background-color: #eee;
  }
}


/*Important: Show only mobile ad code on mobile*/
/*Important: Show only mobile ad code on mobile*/
.nomobile{
.nomobile {
display:none!important;
  display: none !important;
}
}


/* Recipe boxes that don't look like infoboxes */
/* Recipe boxes that don't look like infoboxes */
div.recipe-box {
div.recipe-box {
   /* from div.infobox-n.recipe */
   /* from div.infobox-n.recipe */
   min-width:300px;
   min-width: 300px;
   display:inline-block;
   display: inline-block;
   float:none;
   float: none;
   clear:none;
   clear: none;
   vertical-align:top;
   vertical-align: top;
   font-size:1em;
   font-size: 1em;
   margin:0 1em 0 0;
   margin: 0 1em 0 0;
   /* from div.infobox-n*/
   /* from div.infobox-n*/
   position:relative;
   position: relative;
   background:#FFF;
   background: #fff;
   border:1px solid #AAA;
   border: 1px solid #aaa;
   padding:0;
   padding: 0;
   /* from div.infobox, div.nav .box */
   /* from div.infobox, div.nav .box */
   filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFFFFF,EndColorStr=#FFEEEEEE);
   filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#FFFFFFFF,EndColorStr=#FFEEEEEE);
   background-image:linear-gradient(top,#FFF 0%,#EEE 100%);
   background-image: linear-gradient(top, #fff 0%, #eee 100%);
   background-image:-o-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: -moz-linear-gradient(top, #fff 0%, #eee 100%);
   background-image:-webkit-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: -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));
   background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #fff),
    color-stop(1, #eee)
  );
}
}


div.recipe-box::after {
div.recipe-box::after {
   /* from div.infobox:after */
   /* from div.infobox:after */
   bottom:-4px;
   bottom: -4px;
   content:"";
   content: "";
   position:absolute;
   position: absolute;
   width:100%;
   width: 100%;
   left:0;
   left: 0;
   height:3px;
   height: 3px;
   background-image:url("/mediawiki/images/4/45/Shadow_after.png");
   background-image: url("/mediawiki/images/4/45/Shadow_after.png");
   background-size:100% 3px;
   background-size: 100% 3px;
}
}


div.recipe-box .subheading,
div.recipe-box .subheading,
div.recipe-box .heading {
div.recipe-box .heading {
   text-align:center;
   text-align: center;
   background-color:#D3C0A8;
   background-color: #d3c0a8;
   padding:2px;
   padding: 2px;
   font-weight:bold;
   font-weight: bold;
   background-image:url("/mediawiki/images/b/b3/Box_overlay.png")!important;
   background-image: url("/mediawiki/images/b/b3/Box_overlay.png") !important;
   border:1px solid rgba(0,0,0,0.25);
   border: 1px solid rgba(0, 0, 0, 0.25);
   margin:-1px -1px 5px!important;
   margin: -1px -1px 5px !important;
}
}


div.recipe-box .subheading { border-width:0 1px; }
div.recipe-box .subheading {
  border-width: 0 1px;
}


div.recipe-box dl { margin:10px 0; }
div.recipe-box dl {
  margin: 10px 0;
}


div.recipe-box dt {
div.recipe-box dt {
   float:left;
   float: left;
   text-align:right;
   text-align: right;
   width:130px; /* CUSTOM (OLD: 112px) */
   width: 130px; /* CUSTOM (OLD: 112px) */
   line-height:1em;
   line-height: 1em;
   font-weight:700;
   font-weight: 700;
   clear:left;
   clear: left;
   border-right:2px solid #A99A86;
   border-right: 2px solid #a99a86;
   margin:0 -2px 0 0;
   margin: 0 -2px 0 0;
   padding:2px 8px 2px 3px;
   padding: 2px 8px 2px 3px;
   line-height:1.4em; /* CUSTOM (OLD: 1.667em) */
   line-height: 1.4em; /* CUSTOM (OLD: 1.667em) */
}
}


div.recipe-box dd {
div.recipe-box dd {
   float:left;
   float: left;
   border-left:2px solid #999;
   border-left: 2px solid #999;
   margin:0;
   margin: 0;
   padding:2px 7px;
   padding: 2px 7px;
   line-height: 1.4;
   line-height: 1.4;
}
}
Line 908: Line 1,162:
/* For generic ingredient lists anywhere on the wiki */
/* For generic ingredient lists anywhere on the wiki */
div.ingredients dt {
div.ingredients dt {
   float:left;
   float: left;
   clear:left;
   clear: left;
   text-align:right;
   text-align: right;
   font-weight:normal;
   font-weight: normal;
   width:25px;
   width: 25px;
   margin:0 -2px 0 0;
   margin: 0 -2px 0 0;
   padding:2px 2px 2px 3px;
   padding: 2px 2px 2px 3px;
   line-height:1.4em; /* CUSTOM (OLD: 1.667em) */
   line-height: 1.4em; /* CUSTOM (OLD: 1.667em) */
   border:none;
   border: none;
}
}


div.ingredients.wide dt { width:50px; }
div.ingredients.wide dt {
  width: 50px;
}


div.ingredients dd {
div.ingredients dd {
   float:left;
   float: left;
   margin:0;
   margin: 0;
   padding:1px 4px; /* CUSTOM (OLD: 2px 7px) */
   padding: 1px 4px; /* CUSTOM (OLD: 2px 7px) */
   border:none;
   border: none;
}
}


div.ingredients dl { margin:2px 0; }
div.ingredients dl {
  margin: 2px 0;
}


.ingredients .standard-frame-icon a.external.text {
.ingredients .standard-frame-icon a.external.text {
    background: none!important;
  background: none !important;
}
}


.ingredients .standard-frame-icon.small {
.ingredients .standard-frame-icon.small {
    display: inline-block!important;
  display: inline-block !important;
}
}


/** STDT table classes **/
/** STDT table classes **/
/* dps-role*/
/* dps-role*/
  .table.dps-role > :first-child > tr:first-child,
.table.dps-role > :first-child > tr:first-child,
  .table.dps-role > tbody > tr.heading,
.table.dps-role > tbody > tr.heading,
  .table.dps-role > :first-child > tr:first-child > *,
.table.dps-role > :first-child > tr:first-child > *,
  .table.dps-role > tbody > tr.heading > * {
.table.dps-role > tbody > tr.heading > * {
    background-color:#bb6363 !important;
  background-color: #bb6363 !important;
    border-color:#9a4848!important;
  border-color: #9a4848 !important;
  }
}
  .table.dps-role > tbody > tr > th,
.table.dps-role > tbody > tr > th,
  .table.dps-role > tfoot > tr > th,
.table.dps-role > tfoot > tr > th,
  .table.dps-role > thead > tr > th,
.table.dps-role > thead > tr > th,
  table.table > tbody > tr.dps-role > th {
table.table > tbody > tr.dps-role > th {
    background-color:#A9D3B7;
  background-color: #a9d3b7;
    border-color:#87A992;
  border-color: #87a992;
  }
}
  .table.dps-role > tbody > tr:nth-child(odd),
.table.dps-role > tbody > tr:nth-child(odd),
  .table > tbody > tr.dps-role:nth-child(odd) {
.table > tbody > tr.dps-role:nth-child(odd) {
    background-color:#f2e8e5;
  background-color: #f2e8e5;
  }
}


/* healer-role*/
/* healer-role*/
  .table.healer-role > :first-child > tr:first-child,
.table.healer-role > :first-child > tr:first-child,
  .table.healer-role > tbody > tr.heading,
.table.healer-role > tbody > tr.heading,
  .table.healer-role > :first-child > tr:first-child > *,
.table.healer-role > :first-child > tr:first-child > *,
  .table.healer-role > tbody > tr.heading > * {
.table.healer-role > tbody > tr.heading > * {
    background-color:#3c6829 !important;
  background-color: #3c6829 !important;
    border-color:#2a491d!important;
  border-color: #2a491d !important;
  }
}
  .table.healer-role > tbody > tr > th,
.table.healer-role > tbody > tr > th,
  .table.healer-role > tfoot > tr > th,
.table.healer-role > tfoot > tr > th,
  .table.healer-role > thead > tr > th,
.table.healer-role > thead > tr > th,
  table.table > tbody > tr.healer-role > th {
table.table > tbody > tr.healer-role > th {
    background-color:#A9D3B7;
  background-color: #a9d3b7;
    border-color:#87A992;
  border-color: #87a992;
  }
}
  .table.healer-role > tbody > tr:nth-child(odd),
.table.healer-role > tbody > tr:nth-child(odd),
  .table > tbody > tr.healer-role:nth-child(odd) {
.table > tbody > tr.healer-role:nth-child(odd) {
    background-color:#e7f3e2;
  background-color: #e7f3e2;
  }
}


/* tanker-role*/
/* tanker-role*/
  .table.tanker-role > :first-child > tr:first-child,
.table.tanker-role > :first-child > tr:first-child,
  .table.tanker-role > tbody > tr.heading,
.table.tanker-role > tbody > tr.heading,
  .table.tanker-role > :first-child > tr:first-child > *,
.table.tanker-role > :first-child > tr:first-child > *,
  .table.tanker-role > tbody > tr.heading > * {
.table.tanker-role > tbody > tr.heading > * {
    background-color:#5587c1!important;
  background-color: #5587c1 !important;
    border-color:#4871a0!important;
  border-color: #4871a0 !important;
  }
}
  .table.tanker-role > tbody > tr > th,
.table.tanker-role > tbody > tr > th,
  .table.tanker-role > tfoot > tr > th,
.table.tanker-role > tfoot > tr > th,
  .table.tanker-role > thead > tr > th,
.table.tanker-role > thead > tr > th,
  table.table > tbody > tr.tanker-role > th {
table.table > tbody > tr.tanker-role > th {
    background-color:#A9D3B7;
  background-color: #a9d3b7;
    border-color:#87A992;
  border-color: #87a992;
  }
}
  .table.tanker-role > tbody > tr:nth-child(odd),
.table.tanker-role > tbody > tr:nth-child(odd),
  .table > tbody > tr.tanker-role:nth-child(odd) {
.table > tbody > tr.tanker-role:nth-child(odd) {
    background-color:#d2e3f7;
  background-color: #d2e3f7;
  }
}


/* crafting-role*/
/* crafting-role*/
  .table.crafting-role > :first-child > tr:first-child,
.table.crafting-role > :first-child > tr:first-child,
  .table.crafting-role > tbody > tr.heading,
.table.crafting-role > tbody > tr.heading,
  .table.crafting-role > :first-child > tr:first-child > *,
.table.crafting-role > :first-child > tr:first-child > *,
  .table.crafting-role > tbody > tr.heading > * {
.table.crafting-role > tbody > tr.heading > * {
    background-color:#878eb5!important;
  background-color: #878eb5 !important;
    border-color:#777d9e!important;
  border-color: #777d9e !important;
  }
}
  .table.crafting-role > tbody > tr > th,
.table.crafting-role > tbody > tr > th,
  .table.crafting-role > tfoot > tr > th,
.table.crafting-role > tfoot > tr > th,
  .table.crafting-role > thead > tr > th,
.table.crafting-role > thead > tr > th,
  table.table > tbody > tr.crafting-role > th {
table.table > tbody > tr.crafting-role > th {
    background-color:#A9D3B7;
  background-color: #a9d3b7;
    border-color:#87A992;
  border-color: #87a992;
  }
}
  .table.crafting-role > tbody > tr:nth-child(odd),
.table.crafting-role > tbody > tr:nth-child(odd),
  .table > tbody > tr.crafting-role:nth-child(odd) {
.table > tbody > tr.crafting-role:nth-child(odd) {
    background-color:#dfe1ec;
  background-color: #dfe1ec;
  }
}


/* gathering-role*/
/* gathering-role*/
  .table.gathering-role > :first-child > tr:first-child,
.table.gathering-role > :first-child > tr:first-child,
  .table.gathering-role > tbody > tr.heading,
.table.gathering-role > tbody > tr.heading,
  .table.gathering-role > :first-child > tr:first-child > *,
.table.gathering-role > :first-child > tr:first-child > *,
  .table.gathering-role > tbody > tr.heading > * {
.table.gathering-role > tbody > tr.heading > * {
    background-color:#78a923!important;
  background-color: #78a923 !important;
    border-color:#5a8019!important;
  border-color: #5a8019 !important;
  }
}
  .table.gathering-role > tbody > tr > th,
.table.gathering-role > tbody > tr > th,
  .table.gathering-role > tfoot > tr > th,
.table.gathering-role > tfoot > tr > th,
  .table.gathering-role > thead > tr > th,
.table.gathering-role > thead > tr > th,
  table.table > tbody > tr.gathering-role > th {
table.table > tbody > tr.gathering-role > th {
    background-color:#cbeb93;
  background-color: #cbeb93;
    border-color:#87A992;
  border-color: #87a992;
  }
}
  .table.gathering-role > tbody > tr:nth-child(odd),
.table.gathering-role > tbody > tr:nth-child(odd),
  .table > tbody > tr.gathering-role:nth-child(odd) {
.table > tbody > tr.gathering-role:nth-child(odd) {
    background-color:#eaf7d4;
  background-color: #eaf7d4;
  }
}


/* pet-role*/
/* pet-role*/
  .table.pet-role > :first-child > tr:first-child,
.table.pet-role > :first-child > tr:first-child,
  .table.pet-role > tbody > tr.heading,
.table.pet-role > tbody > tr.heading,
  .table.pet-role > :first-child > tr:first-child > *,
.table.pet-role > :first-child > tr:first-child > *,
  .table.pet-role > tbody > tr.heading > * {
.table.pet-role > tbody > tr.heading > * {
    background-color:#5fb7aa !important;
  background-color: #5fb7aa !important;
    border-color:#479e91!important;
  border-color: #479e91 !important;
  }
}
  .table.pet-role > tbody > tr > th,
.table.pet-role > tbody > tr > th,
  .table.pet-role > tfoot > tr > th,
.table.pet-role > tfoot > tr > th,
  .table.pet-role > thead > tr > th,
.table.pet-role > thead > tr > th,
  table.table > tbody > tr.pet-role > th {
table.table > tbody > tr.pet-role > th {
    background-color:#A9D3B7;
  background-color: #a9d3b7;
    border-color:#87A992;
  border-color: #87a992;
  }
}
  .table.pet-role > tbody > tr:nth-child(odd),
.table.pet-role > tbody > tr:nth-child(odd),
  .table > tbody > tr.pet-role:nth-child(odd) {
.table > tbody > tr.pet-role:nth-child(odd) {
    background-color:#edf7f6;
  background-color: #edf7f6;
  }
}


/* npc */
/* npc */
  .table.npc > :first-child > tr:first-child,
.table.npc > :first-child > tr:first-child,
  .table.npc > tbody > tr.heading,
.table.npc > tbody > tr.heading,
  .table.npc > :first-child > tr:first-child > *,
.table.npc > :first-child > tr:first-child > *,
  .table.npc > tbody > tr.heading > * {
.table.npc > tbody > tr.heading > * {
    background-color:#6C3 !important;
  background-color: #6c3 !important;
    border-color:#52A329 !important;
  border-color: #52a329 !important;
  }
}
  .table.npc > tbody > tr > th,
.table.npc > tbody > tr > th,
  .table.npc > tfoot > tr > th,
.table.npc > tfoot > tr > th,
  .table.npc > thead > tr > th,
.table.npc > thead > tr > th,
  table.table > tbody > tr.npc > th {
table.table > tbody > tr.npc > th {
    background-color:#B3E699;
  background-color: #b3e699;
    border-color:#8FB87A;
  border-color: #8fb87a;
  }
}
  .table.npc > tbody > tr:nth-child(odd),
.table.npc > tbody > tr:nth-child(odd),
  .table > tbody > tr.npc:nth-child(odd) {
.table > tbody > tr.npc:nth-child(odd) {
    background-color:#E8F8E1;
  background-color: #e8f8e1;
  }
}


/* pve */
/* pve */
  .table.pve > :first-child > tr:first-child,
.table.pve > :first-child > tr:first-child,
  .table.pve > tbody > tr.heading,
.table.pve > tbody > tr.heading,
  .table.pve > :first-child > tr:first-child > *,
.table.pve > :first-child > tr:first-child > *,
  .table.pve > tbody > tr.heading > * {
.table.pve > tbody > tr.heading > * {
    background-color:#FC6 !important;
  background-color: #fc6 !important;
    border-color:#CCA352 !important;
  border-color: #cca352 !important;
  }
}
  .table.pve > tbody > tr > th,
.table.pve > tbody > tr > th,
  .table.pve > tfoot > tr > th,
.table.pve > tfoot > tr > th,
  .table.pve > thead > tr > th,
.table.pve > thead > tr > th,
  table.table > tbody > tr.pve > th {
table.table > tbody > tr.pve > th {
    background-color:#FFE6B3;
  background-color: #ffe6b3;
    border-color:#CCB88F;
  border-color: #ccb88f;
  }
}
  .table.pve > tbody > tr:nth-child(odd),
.table.pve > tbody > tr:nth-child(odd),
  .table > tbody > tr.pve:nth-child(odd) {
.table > tbody > tr.pve:nth-child(odd) {
    background-color:#FFF8E8;
  background-color: #fff8e8;
  }
}


/* equip or item*/
/* equip or item*/
  .table.equip > :first-child > tr:first-child,
.table.equip > :first-child > tr:first-child,
  .table.equip > tbody > tr.heading,
.table.equip > tbody > tr.heading,
  .table.equip > :first-child > tr:first-child > *,
.table.equip > :first-child > tr:first-child > *,
  .table.equip > tbody > tr.heading > *,
.table.equip > tbody > tr.heading > *,
  .table.item > :first-child > tr:first-child,
.table.item > :first-child > tr:first-child,
  .table.item > tbody > tr.heading,
.table.item > tbody > tr.heading,
  .table.item > :first-child > tr:first-child > *,
.table.item > :first-child > tr:first-child > *,
  .table.item > tbody > tr.heading > * {
.table.item > tbody > tr.heading > * {
    background-color:#F96 !important;
  background-color: #f96 !important;
    border-color:#CC7A52 !important;
  border-color: #cc7a52 !important;
  }
}
  .table.equip > tbody > tr > th,
.table.equip > tbody > tr > th,
  .table.equip > tfoot > tr > th,
.table.equip > tfoot > tr > th,
  .table.equip > thead > tr > th,
.table.equip > thead > tr > th,
  table.table > tbody > tr.equip > th,
table.table > tbody > tr.equip > th,
  .table.item > tbody > tr > th,
.table.item > tbody > tr > th,
  .table.item > tfoot > tr > th,
.table.item > tfoot > tr > th,
  .table.item > thead > tr > th,
.table.item > thead > tr > th,
  table.table > tbody > tr.item > th {
table.table > tbody > tr.item > th {
    background-color:#FFCCB3;
  background-color: #ffccb3;
    border-color:#CCA38F;
  border-color: #cca38f;
  }
}
  .table.equip > tbody > tr:nth-child(odd),
.table.equip > tbody > tr:nth-child(odd),
  .table > tbody > tr.equip:nth-child(odd),
.table > tbody > tr.equip:nth-child(odd),
  .table.item > tbody > tr:nth-child(odd),
.table.item > tbody > tr:nth-child(odd),
  .table > tbody > tr.item:nth-child(odd) {
.table > tbody > tr.item:nth-child(odd) {
    background-color:#FFF0E8;
  background-color: #fff0e8;
  }
}


/* skin */
/* skin */
  .table.skin > :first-child > tr:first-child,
.table.skin > :first-child > tr:first-child,
  .table.skin > tbody > tr.heading,
.table.skin > tbody > tr.heading,
  .table.skin > :first-child > tr:first-child > *,
.table.skin > :first-child > tr:first-child > *,
  .table.skin > tbody > tr.heading > * {
.table.skin > tbody > tr.heading > * {
    background-color:#E07A98 !important;
  background-color: #e07a98 !important;
    border-color:#996574 !important;
  border-color: #996574 !important;
  }
}
  .table.skin > tbody > tr > th,
.table.skin > tbody > tr > th,
  .table.skin > tfoot > tr > th,
.table.skin > tfoot > tr > th,
  .table.skin > thead > tr > th,
.table.skin > thead > tr > th,
  table.table > tbody > tr.skin > th {
table.table > tbody > tr.skin > th {
    background-color:#FFD4DF;
  background-color: #ffd4df;
    border-color:#B3A1A5;
  border-color: #b3a1a5;
  }
}
  .table.skin > tbody > tr:nth-child(odd),
.table.skin > tbody > tr:nth-child(odd),
  .table > tbody > tr.skin:nth-child(odd) {
.table > tbody > tr.skin:nth-child(odd) {
    background-color:#FFEDF4;
  background-color: #ffedf4;
  }
}


/* mech1 */
/* mech1 */
  .table.mech1 > :first-child > tr:first-child,
.table.mech1 > :first-child > tr:first-child,
  .table.mech1 > tbody > tr.heading,
.table.mech1 > tbody > tr.heading,
  .table.mech1 > :first-child > tr:first-child > *,
.table.mech1 > :first-child > tr:first-child > *,
  .table.mech1 > tbody > tr.heading > * {
.table.mech1 > tbody > tr.heading > * {
    background-color:#69C !important;
  background-color: #69c !important;
    border-color:#527AA3 !important;
  border-color: #527aa3 !important;
  }
}
  .table.mech1 > tbody > tr > th,
.table.mech1 > tbody > tr > th,
  .table.mech1 > tfoot > tr > th,
.table.mech1 > tfoot > tr > th,
  .table.mech1 > thead > tr > th,
.table.mech1 > thead > tr > th,
  table.table > tbody > tr.mech1 > th {
table.table > tbody > tr.mech1 > th {
    background-color:#B3CCE6;
  background-color: #b3cce6;
    border-color:#8FA3B8;
  border-color: #8fa3b8;
  }
}
  .table.mech1 > tbody > tr:nth-child(odd),
.table.mech1 > tbody > tr:nth-child(odd),
  .table > tbody > tr.mech1:nth-child(odd) {
.table > tbody > tr.mech1:nth-child(odd) {
    background-color:#E8F0F8;
  background-color: #e8f0f8;
  }
}


/* mech2 */
/* mech2 */
  .table.mech2 > :first-child > tr:first-child,
.table.mech2 > :first-child > tr:first-child,
  .table.mech2 > tbody > tr.heading,
.table.mech2 > tbody > tr.heading,
  .table.mech2 > :first-child > tr:first-child > *,
.table.mech2 > :first-child > tr:first-child > *,
  .table.mech2 > tbody > tr.heading > * {
.table.mech2 > tbody > tr.heading > * {
    background-color:#3CC !important;
  background-color: #3cc !important;
    border-color:#29A3A3 !important;
  border-color: #29a3a3 !important;
  }
}
  .table.mech2 > tbody > tr > th,
.table.mech2 > tbody > tr > th,
  .table.mech2 > tfoot > tr > th,
.table.mech2 > tfoot > tr > th,
  .table.mech2 > thead > tr > th,
.table.mech2 > thead > tr > th,
  table.table > tbody > tr.mech2 > th {
table.table > tbody > tr.mech2 > th {
    background-color:#99E6E6;
  background-color: #99e6e6;
    border-color:#7AB8B8;
  border-color: #7ab8b8;
  }
}
  .table.mech2 > tbody > tr:nth-child(odd),
.table.mech2 > tbody > tr:nth-child(odd),
  .table > tbody > tr.mech2:nth-child(odd) {
.table > tbody > tr.mech2:nth-child(odd) {
    background-color:#E1F8F8;
  background-color: #e1f8f8;
  }
}


/* lore */
/* lore */
  .table.lore > :first-child > tr:first-child,
.table.lore > :first-child > tr:first-child,
  .table.lore > tbody > tr.heading,
.table.lore > tbody > tr.heading,
  .table.lore > :first-child > tr:first-child > *,
.table.lore > :first-child > tr:first-child > *,
  .table.lore > tbody > tr.heading > * {
.table.lore > tbody > tr.heading > * {
    background-color:#C6C !important;
  background-color: #c6c !important;
    border-color:#A352A3 !important;
  border-color: #a352a3 !important;
  }
}
  .table.lore > tbody > tr > th,
.table.lore > tbody > tr > th,
  .table.lore > tfoot > tr > th,
.table.lore > tfoot > tr > th,
  .table.lore > thead > tr > th,
.table.lore > thead > tr > th,
  table.table > tbody > tr.lore > th {
table.table > tbody > tr.lore > th {
    background-color:#E6B3E6;
  background-color: #e6b3e6;
    border-color:#B88FB8;
  border-color: #b88fb8;
  }
}
  .table.lore > tbody > tr:nth-child(odd),
.table.lore > tbody > tr:nth-child(odd),
  .table > tbody > tr.lore:nth-child(odd) {
.table > tbody > tr.lore:nth-child(odd) {
    background-color:#F8E8F8;
  background-color: #f8e8f8;
  }
}


/* location */
/* location */
  .table.location > :first-child > tr:first-child,
.table.location > :first-child > tr:first-child,
  .table.location > tbody > tr.heading,
.table.location > tbody > tr.heading,
  .table.location > :first-child > tr:first-child > *,
.table.location > :first-child > tr:first-child > *,
  .table.location > tbody > tr.heading > * {
.table.location > tbody > tr.heading > * {
    background-color:#96C !important;
  background-color: #96c !important;
    border-color:#7A52A3 !important;
  border-color: #7a52a3 !important;
  }
}
  .table.location > tbody > tr > th,
.table.location > tbody > tr > th,
  .table.location > tfoot > tr > th,
.table.location > tfoot > tr > th,
  .table.location > thead > tr > th,
.table.location > thead > tr > th,
  table.table > tbody > tr.location > th {
table.table > tbody > tr.location > th {
    background-color:#CCB3E6;
  background-color: #ccb3e6;
    border-color:#A38FB8;
  border-color: #a38fb8;
  }
}
  .table.location > tbody > tr:nth-child(odd),
.table.location > tbody > tr:nth-child(odd),
  .table > tbody > tr.location:nth-child(odd) {
.table > tbody > tr.location:nth-child(odd) {
    background-color:#F0E8F8;
  background-color: #f0e8f8;
  }
}


/* promo */
/* promo */
  .table.promo > :first-child > tr:first-child,
.table.promo > :first-child > tr:first-child,
  .table.promo > tbody > tr.heading,
.table.promo > tbody > tr.heading,
  .table.promo > :first-child > tr:first-child > *,
.table.promo > :first-child > tr:first-child > *,
  .table.promo > tbody > tr.heading > * {
.table.promo > tbody > tr.heading > * {
    background-color:#9C3 !important;
  background-color: #9c3 !important;
    border-color:#7AA329 !important;
  border-color: #7aa329 !important;
  }
}
  .table.promo > tbody > tr > th,
.table.promo > tbody > tr > th,
  .table.promo > tfoot > tr > th,
.table.promo > tfoot > tr > th,
  .table.promo > thead > tr > th,
.table.promo > thead > tr > th,
  table.table > tbody > tr.promo > th {
table.table > tbody > tr.promo > th {
    background-color:#CCE699;
  background-color: #cce699;
    border-color:#A3B87A;
  border-color: #a3b87a;
  }
}
  .table.promo > tbody > tr:nth-child(odd),
.table.promo > tbody > tr:nth-child(odd),
  .table > tbody > tr.promo:nth-child(odd) {
.table > tbody > tr.promo:nth-child(odd) {
    background-color:#F0F8E1;
  background-color: #f0f8e1;
  }
}


/* buff */
/* buff */
  .table.buff > :first-child > tr:first-child,
.table.buff > :first-child > tr:first-child,
  .table.buff > tbody > tr.heading,
.table.buff > tbody > tr.heading,
  .table.buff > :first-child > tr:first-child > *,
.table.buff > :first-child > tr:first-child > *,
  .table.buff > tbody > tr.heading > * {
.table.buff > tbody > tr.heading > * {
    background-color:#73D9D9 !important;
  background-color: #73d9d9 !important;
    border-color:#5CAEAE !important;
  border-color: #5caeae !important;
  }
}
  .table.buff > tbody > tr > th,
.table.buff > tbody > tr > th,
  .table.buff > tfoot > tr > th,
.table.buff > tfoot > tr > th,
  .table.buff > thead > tr > th,
.table.buff > thead > tr > th,
  table.table > tbody > tr.buff > th {
table.table > tbody > tr.buff > th {
    background-color:#B9ECEC;
  background-color: #b9ecec;
    border-color:#94BDBD;
  border-color: #94bdbd;
  }
}
  .table.buff > tbody > tr:nth-child(odd),
.table.buff > tbody > tr:nth-child(odd),
  .table > tbody > tr.buff:nth-child(odd) {
.table > tbody > tr.buff:nth-child(odd) {
    background-color:#EAF9F9;
  background-color: #eaf9f9;
  }
}


/* debuff */
/* debuff */
  .table.debuff > :first-child > tr:first-child,
.table.debuff > :first-child > tr:first-child,
  .table.debuff > tbody > tr.heading,
.table.debuff > tbody > tr.heading,
  .table.debuff > :first-child > tr:first-child > *,
.table.debuff > :first-child > tr:first-child > *,
  .table.debuff > tbody > tr.heading > * {
.table.debuff > tbody > tr.heading > * {
    background-color:#51A651 !important;
  background-color: #51a651 !important;
    border-color:#418541 !important;
  border-color: #418541 !important;
  }
}


  .table.debuff > tbody > tr> th,
.table.debuff > tbody > tr > th,
  .table.debuff > tfoot > tr > th,
.table.debuff > tfoot > tr > th,
  .table.debuff > thead > tr > th,
.table.debuff > thead > tr > th,
  table.table > tbody > tr.debuff > th {
table.table > tbody > tr.debuff > th {
    background-color:#A8D3A8;
  background-color: #a8d3a8;
    border-color:#86A986;
  border-color: #86a986;
  }
}


  .table.debuff > tbody > tr:nth-child(odd),
.table.debuff > tbody > tr:nth-child(odd),
  .table > tbody > tr.debuff:nth-child(odd) { background-color:#E5F2E5; }
.table > tbody > tr.debuff:nth-child(odd) {
  background-color: #e5f2e5;
}


/* crafting */
/* crafting */
/* recipe */
/* recipe */
  .table.crafting > :first-child > tr:first-child,
.table.crafting > :first-child > tr:first-child,
  .table.crafting > tbody > tr.heading,
.table.crafting > tbody > tr.heading,
  .table.crafting > :first-child > tr:first-child > *,
.table.crafting > :first-child > tr:first-child > *,
  .table.crafting > tbody > tr.heading > *,
.table.crafting > tbody > tr.heading > *,
  .table.recipe > :first-child > tr:first-child,
.table.recipe > :first-child > tr:first-child,
  .table.recipe > tbody > tr.heading,
.table.recipe > tbody > tr.heading,
  .table.recipe > :first-child > tr:first-child > *,
.table.recipe > :first-child > tr:first-child > *,
  .table.recipe > tbody > tr.heading > * {
.table.recipe > tbody > tr.heading > * {
    background-color:#A68151 !important;
  background-color: #a68151 !important;
    border-color:#856741 !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 > 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;
}


/* Action tables */
/* Action tables */
.table.actions, .table.traits { width:100%; max-width:1000px; display:table; }
.table.actions,
.table.actions > :first-child > tr:first-child ~ tr th[colspan], .table.traits > :first-child > tr:first-child ~ tr th[colspan] { text-align:left; }
.table.traits {
.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; }
  width: 100%;
.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; }
  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 */
/* Using : lists within tables */
Line 1,327: Line 1,610:
.table.fm dl,
.table.fm dl,
.table.craftvariants dl {
.table.craftvariants dl {
   margin-top:0;
   margin-top: 0;
   margin-bottom:0;
   margin-bottom: 0;
}
}
/* no left margin when used purely for structure within these tables */
/* no left margin when used purely for structure within these tables */
.table.locations dd,
.table.locations dd,
.table.fm dd,
.table.fm dd,
table.craftvariants dd { margin-left:0; }
table.craftvariants dd {
  margin-left: 0;
}
/* restore margin if it's actually being used as a definition list */
/* restore margin if it's actually being used as a definition list */
.table.locations dl > dt ~ dd { margin-left:2em; }
.table.locations dl > dt ~ dd {
  margin-left: 2em;
}


/* Using * lists within combo tables */
/* Using * lists within combo tables */
.table.combo ul { margin:0.15em 0; }
.table.combo ul {
.table.combo li { display:block; }
  margin: 0.15em 0;
}
.table.combo li {
  display: block;
}


.table .standard-frame-icon.small {
.table .standard-frame-icon.small {
    display: inline-block!important;
  display: inline-block !important;
}
}
 
.table .standard-frame-icon.small a.external.text {
.table .standard-frame-icon.small a.external.text {
    background: none!important;
  background: none !important;
}
}


.recipe div.ingredients dt {
.recipe div.ingredients dt {
  padding: 3px 15px 5px 0px!important;
  padding: 3px 15px 5px 0px !important;
}
}


.recipe div.ingredients dd {
.recipe div.ingredients dd {
  float:none!important;
  float: none !important;
}
}


/* TABLES */
/* TABLES */
/* quest */
/* quest */
  .table.quest > :first-child > tr:first-child,
.table.quest > :first-child > tr:first-child,
  .table.quest > tbody > tr.heading,
.table.quest > tbody > tr.heading,
  .table.quest > :first-child > tr:first-child > *,
.table.quest > :first-child > tr:first-child > *,
  .table.quest > tbody > tr.heading > * {
.table.quest > tbody > tr.heading > * {
    background-color:#efae4d !important;
  background-color: #efae4d !important;
    border-color:#e18f14 !important;
  border-color: #e18f14 !important;
  }
}


  .table.quest > tbody > tr > th,
.table.quest > tbody > tr > th,
  .table.quest > tfoot > tr > th,
.table.quest > tfoot > tr > th,
  .table.quest > thead > tr > th,
.table.quest > thead > tr > th,
  table.table > tbody > tr.quest > th {
table.table > tbody > tr.quest > th {
    background-color:#efae4d;
  background-color: #efae4d;
    border-color:#e18f14;
  border-color: #e18f14;
  }
}


  .table.quest > tbody > tr:nth-child(odd),
.table.quest > tbody > tr:nth-child(odd),
  .table > tbody > tr.quest:nth-child(odd) { background-color:#fff3d8; }
.table > tbody > tr.quest:nth-child(odd) {
  background-color: #fff3d8;
}


/* Relic weapons nav */
/* Relic weapons nav */
div.nav.relic .pre-relic-label {
div.nav.relic .pre-relic-label {
    width: 120px;
  width: 120px;
}
}


div.nav.relic .relic-list {
div.nav.relic .relic-list {
    padding-bottom: 6px;
  padding-bottom: 6px;
}
}


div.nav.relic .role-subheading {
div.nav.relic .role-subheading {
    padding: 0 8px;
  padding: 0 8px;
    position: absolute;
  position: absolute;
}
}


div.nav.relic td.mw-collapsible div.mw-collapsible-content {
div.nav.relic td.mw-collapsible div.mw-collapsible-content {
    padding-top: 0.6em;
  padding-top: 0.6em;
}
}


div.nav.relic .first-role-job {
div.nav.relic .first-role-job {
    width: 112px;
  width: 112px;
}
}


div.nav.relic .heading { background-color:#8d5bc2; }
div.nav.relic .heading {
  background-color: #8d5bc2;
}


div.nav.relic dd,
div.nav.relic dd,
div.nav.relic dt,
div.nav.relic dt,
div.nav.relic table th { border-color:#8d5bc2; }
div.nav.relic table th {
  border-color: #8d5bc2;
}


.table.crafting > tbody > tr:nth-child(even),
.table.crafting > tbody > tr:nth-child(even),
.table > tbody > tr.crafting:nth-child(even),
.table > tbody > tr.crafting:nth-child(even),
.table.recipe > tbody > tr:nth-child(even),
.table.recipe > tbody > tr:nth-child(even),
.table > tbody > tr.recipe:nth-child(even) {  
.table > tbody > tr.recipe:nth-child(even) {
   background-color:#F2ECE5!important;  
   background-color: #f2ece5 !important;
}
}


Line 1,417: Line 1,713:
.table > tbody > tr.crafting:nth-child(odd),
.table > tbody > tr.crafting:nth-child(odd),
.table.recipe > tbody > tr:nth-child(odd),
.table.recipe > tbody > tr:nth-child(odd),
.table > tbody > tr.recipe:nth-child(odd) {  
.table > tbody > tr.recipe:nth-child(odd) {
   background-color:#fffffe!important;  
   background-color: #fffffe !important;
}
}

Latest revision as of 03:19, 22 December 2021

/* CSS placed here will affect users of the mobile site */

/* new mobile CSS (after updating the wiki version */
/* move overlay menus down on mobile (both left menu and search bar) */
#mw-mf-page-left {
  top: 80px;
}
.overlay-header-container.position-fixed {
  top: 80px;
  
}
.overlay-content {
  top: 80px
}

/* move search bar icon left */
nav.minerva-user-navigation {
  display: flex;
  justify-content: left;
}

/* eliminate horizontal scrollbar (not in use because we need the horizontal scrollbar in many instances */
/*
div#mw-mf-viewport{
   overflow-x: hidden;
}
*/

/* end of new mobile CSS (after updating the wiki version */

/* new main page */

.desktop-frontpage {
  display: none !important;
}

.mobile-frontpage {
  display: block !important;
}

.desktop-element {
  display: none !important;
}
.mobile-element {
  display: block !important;
}

@font-face {
  font-family: "EasonPro";
  src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot);
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.eot?#iefix")
      format("embedded-opentype"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.woff)
      format("woff"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.ttf)
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-regular-webfont.svg#EasonProregular")
      format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "EasonPro";
  src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.eot);
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.eot?#iefix")
      format("embedded-opentype"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.woff)
      format("woff"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.ttf)
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-italic-webfont.svg#EasonProitalic")
      format("svg");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: "EasonPro";
  src: url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.eot);
  src: url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.eot?#iefix")
      format("embedded-opentype"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.woff)
      format("woff"),
    url(https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.ttf)
      format("truetype"),
    url("https://d1h9a8s8eodvjz.cloudfront.net/fonts/eason/v1/easonpro-bold-webfont.svg#EasonProBold")
      format("svg");
  font-weight: bold;
  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;
}

/************************************************************************************
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: EasonPro, "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;
}

p,
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: EasonPro, "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: EasonPro, "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;
}

/** NAV BARS **/
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 dt,
div.infobox dd,
div.nav table {
  line-height: 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: 125px;
  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;
}

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

div.nav.mech1 dd,
div.nav.mech1 dt,
div.nav.mech1 table th {
  border-color: #9a66cc;
}

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.quest .heading {
  background-color: #f8b57d;
}

div.nav.quest dd,
div.nav.quest dt,
div.nav.quest table th {
  border-color: #f8b57d;
}

div.nav.debuff .heading {
  background-color: #51a651;
}

div.nav.debuff dd,
div.nav.debuff dt,
div.nav.debuff 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.guardian .heading,
div.nav.guardian .subheading {
  background-color: #39c;
}

div.nav.guardian dd,
div.nav.guardian dt,
div.nav.guardian table th {
  border-color: #39c;
}

/* FFXIV Wiki - Custom */

div.nav.class-nav table th.class-cell,
div.nav.class-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 {
  border: none;
}

div.nav.class-nav {
  width: 840px;
}

/* Table */

.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("/images/c/cc/Infobox_header_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.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;
}

/* any */
.table.any > :first-child > tr:first-child,
.table.any > tbody > tr.heading,
.table.any > :first-child > tr:first-child > *,
.table.any > tbody > tr.heading > * {
  background-color: #888 !important;
  border-color: #6d6d6d !important;
}
.table.any > tbody > tr > th,
.table.any > tfoot > tr > th,
.table.any > thead > tr > th,
table.table > tbody > tr.any > th {
  background-color: #ccc;
  border-color: #aaa;
}
.table.any > tbody > tr:nth-child(odd),
.table > tbody > tr.any:nth-child(odd) {
  background-color: #eee;
}

/*Important: Show only mobile ad code on mobile*/
.nomobile {
  display: none !important;
}

/* 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") !important;
  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;
}

.ingredients .standard-frame-icon a.external.text {
  background: none !important;
}

.ingredients .standard-frame-icon.small {
  display: inline-block !important;
}

/** 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 !important;
  border-color: #52a329 !important;
}
.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 !important;
  border-color: #cca352 !important;
}
.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 !important;
  border-color: #cc7a52 !important;
}
.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 !important;
  border-color: #527aa3 !important;
}
.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;
}

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

.table .standard-frame-icon.small {
  display: inline-block !important;
}

.table .standard-frame-icon.small a.external.text {
  background: none !important;
}

.recipe div.ingredients dt {
  padding: 3px 15px 5px 0px !important;
}

.recipe div.ingredients dd {
  float: none !important;
}

/* 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 !important;
  border-color: #e18f14 !important;
}

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

.table.crafting > tbody > tr:nth-child(even),
.table > tbody > tr.crafting:nth-child(even),
.table.recipe > tbody > tr:nth-child(even),
.table > tbody > tr.recipe:nth-child(even) {
  background-color: #f2ece5 !important;
}

.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: #fffffe !important;
}