MediaWiki:Minerva.css

From Guild Wars 2 Wiki
Jump to navigationJump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/** -------- NON-CONTENT UI -------- **/
/** HEADER **/
/* Main CSS stolen (with permission) from FR GW2W's legendary User:IruleManik */

/* Hide text, use an image instead */
.minerva-header .branding-box h1 span,
.minerva-header .branding-box a span {
  color: transparent;
  padding-right: 7em;
  line-height: inherit;
}

.minerva-header .branding-box {
  background: url('/images/c/cb/Mobile_skin_header_logo.png') left/97% no-repeat;
  width: 15.4em;
  opacity: 0.9;
}

.mw-ui-icon-wikimedia-menu-base20::before,
.mw-ui-background-icon-menu {
  filter: invert(180);
}

.minerva-header .search-box .search {
  margin-left: 1em;
}

.minerva-search-form {
  width: unset;
}

/* Default darker (sky) background */
.header-container.header-chrome {
  background: url('/images/3/3b/Mobile_skin_background_dark.jpg') top left -460px/auto repeat-x;
}

/* Below 720px the searchbox collapses, and we have more space - use lighter (fields) background */
@media (max-width: 719px) {
  .header-container.header-chrome {
      background: url('/images/6/6f/Mobile_skin_background_light.jpg') left/cover no-repeat;
  }

}

/** FOOTER **/
/* Background images switch over at <640px, can't have the pyramid from the light image interfering with the logos */
/* Default - lighter (fields) background */
.minerva-footer {
  overflow: auto;
  padding-bottom: 6px;
  background: url('/images/6/6f/Mobile_skin_background_light.jpg') left/cover no-repeat;
}

footer > .post-content > .minerva-footer-logo {
  color: transparent;
  background: url('/images/4/40/Mobile_skin_footer_logo.png') left/37% no-repeat, url('/images/0/08/Mobile_skin_ArenaNet_logo.png') right/20% no-repeat;
  height: 10em;
}

footer > .post-content {
  color: white;
}

footer > .post-content a {
  color: white;
  font-weight: bold;
}

@media screen and (min-width: 720px)
  /* Improve clarity of "View edit history" line in the footer */
  .last-modified-bar {
      background-color: rgba(51, 51, 51, 0.7);
      color: white;
  }
}

/* For narrow screens up to 640px wide */
@media (max-width: 640px) {
  /* Dark to contrast with the white footer icons */
  .minerva-footer {
      background: url('/images/3/3b/Mobile_skin_background_dark.jpg') right/cover no-repeat;
  }

  /* Enlarge the icons a bit on narrow screens (Note: EN wiki logo slightly different size - was 60% on FR, now 45%) */
  footer > .post-content > .minerva-footer-logo {
      background: url('/images/4/40/Mobile_skin_footer_logo.png') left/45% no-repeat, url('/images/0/08/Mobile_skin_ArenaNet_logo.png') right/30% no-repeat;
      height: 7em;
  }

}

/** UI BUTTONS **/
/* Top menu - Sidebar */
.mw-ui-icon-minerva-mainmenu:before {
  background-image: url('/images/f/fe/Mobile_skin_menu_outline.svg');
}

/* Top menu - Notifications */
.mw-ui-icon-wikimedia-bellOutline-base20:before {
  background-image: url('/images/7/7e/Mobile_skin_notification_bell_outline.svg');
}

/* Top menu - Search magnifying glass (narrow screen only) */
.mw-ui-icon-wikimedia-search-base20:before,
.mw-ui-background-icon-search {
  background-image: url('/images/6/6d/Mobile_skin_menu_search.svg');
}

/* Top menu - Close the search window (narrow screen only) */
.mw-ui-icon-mf-close-base20:before {
  background-image: url('/images/e/e4/Mobile_skin_close_outline.svg');
}

/* Top Menu - User profile */
.mw-ui-icon-minerva-userAvatarOutline::before {
  filter: invert(100%) brightness(200%);
}

/* Top Menu - Burger menu */
.mw-ui-icon-wikimedia-menu-base20::before,
.mw-ui-background-icon-menu {
  filter: invert(100%) brightness(200%);
}

/* Sidebar - Community portal */
.mw-ui-icon-minerva-cp:before {
  background-image: url('/images/8/86/Mobile_skin_sidebar_community_portal.svg');
}

/* Sidebar - Recent changes */
.mw-ui-icon-minerva-rc:before {
  background-image: url('/images/6/66/Mobile_skin_sidebar_recent_changes.svg');
}

/* Sidebar - Help center */
.mw-ui-icon-minerva-hc:before {
  background-image: url('/images/c/c2/Mobile_skin_sidebar_help_center.svg');
}

/* Sidebar - Editing guide */
.mw-ui-icon-minerva-eg:before {
  background-image: url('/images/8/84/Mobile_skin_sidebar_editing_guide.svg');
}

/* Sidebar - Admin noticeboard */
.mw-ui-icon-minerva-an:before {
  background-image: url('/images/c/ca/Mobile_skin_sidebar_admin_noticeboard.svg');
}

/* Sidebar - Wiki bug */
.mw-ui-icon-minerva-wb:before {
  background-image: url('/images/1/17/Mobile_skin_sidebar_wiki_bug.svg');
}

/* Footer - History arrow */
.mf-mw-ui-icon-rotate-anti-clockwise::before {
  filter: brightness(200%);
}

/* Language interwiki cancel */
.overlay .header-cancel li button::before {
  background-color: red;
}

/** OTHER UI **/
/* Avoid descending letters in the last edited text being clipped */
footer .last-modified-bar__text {
  line-height: 1.5em;
}

/* Clarify meaning of languages button by displaying text */
.mw-ui-icon-minerva-language-switcher::before {
  font-size: 1.25em;
  width: 1.25em;
  height: 1.25em;
  display: inline-block;
  margin-bottom:-3px;
}

#language-selector a {
  color: #888;
  line-height: 1em;
  font-size: 0.8em;
  display: inline-block;
  overflow: visible;
  width: unset;
  height: unset;
  flex-basis: unset;
}

.content ul {
  list-style-image: url(data:image/gif;base64,R0lGODlhBQANAIAAAGOMnP///yH5BAEAAAEALAAAAAAFAA0AAAIJjI+pu+APo4SpADs=);
}

.mw-ui-input, textarea, pre, xmp, plaintext, listing {
  font-family: monospace;
}

/* Table of contents */
.toctitle.toctitle h2 {
  margin: 0em 1em;
}

/* Editing window */
.editor-container.content {
  height: 90vh;
}

#wikitext-editor {
  height: 100%;
}

/* override mw default which is to try and display these as a full width block element */
.diff tr {
  display: table-row;
}

.diff td {
  display: table-cell;
}

/** -------- CONTENT GENERAL -------- **/
/* References */
ol.references > li:target,
sup.reference:target,
cite:target {
  background: #EEF;
}

/* Prevent floated images trying to break into text (such as quotations and release banners) */
@media screen and (max-width: 1100px) {
  .content .floatright {
      float: none;
      padding: 1em;
    text-align: right;
  }
}

/* Remove idiotic mediawiki display defaults */
.content table,
.content .infobox {
  float: unset !important;
  margin-left: unset !important;
  margin-right: unset !important;
  display: block;
}
.content .infobox table {
  display: table;
}
.content .infobox th,
.content .infobox td {
  vertical-align: unset;
  border: unset;
  border-bottom: unset;
  padding: unset;
}
.content .infobox tbody > tr > td,
.content .infobox tbody > tr > th {
  flex: unset;
}
.content .infobox > tbody {
  display: unset;
  flex-flow: unset;
}
.content .infobox > tbody > tr {
  min-width: unset;
  display: unset;
  flex-flow: unset;
}
.content .mw-content-ltr .infobox {
  text-align: unset;
}
.content .mw-content-rtl .infobox {
  text-align: unset;
}
@media (min-width: 720px) {
  .content .infobox {
       margin: unset !important;
       max-width: unset !important;
       width: unset !important;
       float: unset !important;
       clear: unset !important;
  }
}

/** -------- SCRIPTS -------- **/
/* Collapsible functionality provided by [[MediaWiki:CollapsibleTables.js]]. */
.collapsible-toggle {
  float: right;
}

/** -------- WIDGETS -------- **/
/* Generic widgets - Button spacing */
fieldset.widget input[type="button"].mw-ui-button,
fieldset.widget button.mw-ui-button {
  margin-right: 0.5em;
}

/* Widget:Game link */
input.chatlink {
  position: absolute;
  margin-top: -2px;
  margin-left: -2px;
  display: none;
  width: 6.6em;
  font-size: inherit;
  line-height: inherit;
}

/** -------- SPECIAL PAGES -------- **/
/* Special:Search */
#mw-search-top-table div.oo-ui-actionFieldLayout {
  float: none !important;
}

/** -------- INDIVIDUAL PAGES -------- **/
/** MAIN PAGE **/
body.page-Main_Page main {
  overflow-x:hidden;
  background: url("/images/8/84/Main_page_background_left_%28Secrets_of_the_Obscure%29.png") top +50px left -30px/auto 600px no-repeat,
      url("/images/3/38/Main_page_background_right_%28Secrets_of_the_Obscure%29.png") bottom +0px right -375px/auto 600px no-repeat,
      #FFF;
}

body.action-view.page-Main_Page #content, body.action-view.page-Main_Page_editcopy #content {
  padding: 0em 0em 1.2em 0em;
}

.mainpage-banner > p {
  text-align: center;
  font-style: italic;
  font-size: 125%;
}

.mainpage-banner > p > span {
  position: relative;
  bottom: 2px;
}

.mainpage-banner, .mainpage-cell, #editcopylink {
  background: rgba(255, 255, 255, 0.85);
}

.mainpage-cell-wrapper {
  display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;     /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;  /* TWEENER - IE 10 */
  display: -webkit-flex; /* NEW - Chrome */
  display: flex;         /* NEW, Spec - Opera 12.1, Firefox 20+ */
  flex-wrap: wrap;
  justify-content: center;
  max-width: 96em;
  margin: 0 auto;
  padding-right: 0.5em
}

.mainpage-cell {
  margin: 0.5em 0em 0em 0.5em;
  padding: 0.5em;
  width: 28em;
  border: 1px solid #B7B8CC;
  box-sizing: border-box;
}

.mainpage-cell.mainpage-cell-double {
  width: 56.5em;
}

.mainpage-cell h2 {
  line-height: 1.5em;
  font-size: 1.75em;
  margin: 0em 0em 0.5em;
}

.mainpage-cell dl {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
}

.mainpage-featured-images {
  overflow-x: hidden;
}

#editcopylink {
  font-size: 0.8em;
  font-style: italic;
  text-align: right;
  margin-top: 1em;
}

#editcopylink span {
  margin-right: 2em;
}

/* Hide featured images and set cells to full width if page width is less than two columns wide */
@media only screen and (max-width:65.5em) {
  .mainpage-cell, .mainpage-cell:first-of-type {
      width: 100%;
  }
}

/** -------- TEMPLATES: NOTICES -------- **/
/** NOTICES **/
.notice {
  margin: 10px auto;
  padding-left: 10px;
  width: unset;
}

.notice .background {
  background-color: #F7F7F7;
  border-color: silver;
}

/* For narrow screens up to 719px wide */
@media (max-width: 719px) {
  .notice .notice-icon {
      display: none;
  }

}

.spoiler-notice {
  background-color: #F99;
  border-color: #F00;
}

/** -------- TEMPLATES: INFOBOXES -------- **/
/** INFOBOXES **/
.content .infobox,
.recipe-box {
  border: 1px solid black;
}

.infobox .heading,
.recipe-box .heading {
  background-color: #DDD;
  margin: 0em;
  padding: 0.5em 1em;
  border-bottom:1px solid black;
  color: #FFF !important;
  background-color: #444;
  font-weight: bold;
  text-shadow: rgba(0,0,0,0.75) 0 0 .25em;
  font-size: 120%;
}

.infobox-icon {
  margin: 1.2em;
  float: right;
}

.infobox .statistics {
  margin: 0 2em;
}

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

.infobox .wrapper, .recipe-box .wrapper {
  background-color: white;
  padding: 0.5em;
  clear: both;
}

.infobox dd, .recipe-box dd, .ingredients dd {
  margin-left: 1em;
}

.infobox table {
  margin: 0em;
}

/* Over-ride native mediawiki rule which sets tables to display as block below 720px */
@media all and (max-width:720px) {
  .content .infobox table {
      display: table;
  }
}

/* Color themes - apply skill/trait first since they'll be overwritten */
div.infobox.skill .heading,
div.infobox.trait .heading {
  background-color: #444;
}

div.infobox.guardian .heading {
  background-color: #066;
}

div.infobox.revenant .heading {
  background-color: #861313;
}

div.infobox.warrior .heading {
  background-color: #C60;
}

div.infobox.engineer .heading {
  background-color: #630;
}

div.infobox.ranger .heading {
  background-color: #360;
}

div.infobox.thief .heading {
  background-color: #933;
}

div.infobox.elementalist .heading {
  background-color: #C00;
}

div.infobox.mesmer .heading {
  background-color: #606;
}

div.infobox.necromancer .heading {
  background-color: #063;
}

div.infobox.asura .heading {
  background-color: #63C;
}

div.infobox.charr .heading {
  background-color: #900;
}

div.infobox.human .heading {
  background-color: #C90;
}

div.infobox.norn .heading {
  background-color: #069;
}

div.infobox.sylvari .heading {
  background-color: #060;
}

div.infobox.boon .heading {
  background-color: #399;
}

div.infobox.condition .heading {
  background-color: #363;
}

div.infobox.promo .heading {
  background-color: #6EA500;
}

div.infobox.item .heading {
  background-color: #C30;
}

div.infobox.skin .heading {
  background-color: #C4003E;
}

div.infobox.crafting .heading {
  background-color: #533610;
}

div.infobox.npc .heading {
  background-color: #390;
}

div.infobox.pet .heading {
  background-color: #360;
}

div.infobox.quest .heading {
  background-color: #F90;
}

div.infobox.area .heading {
  background-color: #306;
}

div.infobox.rewardtrack .heading {
  background-color: #001434;
}

div.recipe-box .heading {
  padding: 1em;
}

div.recipe-box .subheading {
  padding: 0.5em 1em;
  font-weight: bold;
  border-bottom: 1px solid black;
}

/** -------- TEMPLATES: NAVS -------- **/
/** NAVS **/
.nav {
  border: 1px solid black;
}

.nav .heading {
  background-color: #DDD;
  text-align: center;
  font-weight: bold;
}

.nav .wrapper {
  padding: 0.5em;
  border-top: 1px solid black;
}

div.nav dl,
div.nav .wrapper.hlist > ul {
  margin: 0.667em 0em;
}

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

div.nav.revenant .heading {
  background-color: #C23F3A;
}

div.nav.warrior .heading {
  background-color: #F93;
}

div.nav.engineer .heading {
  background-color: #963;
}

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

div.nav.thief .heading {
  background-color: #C66;
}

div.nav.elementalist .heading {
  background-color: #EC5752;
}

div.nav.mesmer .heading {
  background-color: #939;
}

div.nav.necromancer .heading {
  background-color: #396;
}

div.nav.asura .heading {
  background-color: #96F;
}

div.nav.charr .heading {
  background-color: #D25D6B;
}

div.nav.human .heading {
  background-color: #FC3;
}

div.nav.norn .heading {
  background-color: #6CF;
}

div.nav.sylvari .heading {
  background-color: #3C3;
}

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

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

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

div.nav.mech1 .heading {
  background-color: #69C;
}

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

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

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

div.nav.promo .heading {
  background-color: #9C3;
}

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

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

/* Subheadings */
div.nav .subheading {
  background-color: #CCC;
}

/* Subheadings - professions */
div.nav .subheading.guardian {
  background-color: #B9E0EC;
}

div.nav .subheading.revenant {
  background-color: #E3B4AA;
}

div.nav .subheading.warrior {
  background-color: #FFE8B3;
}

div.nav .subheading.engineer {
  background-color: #E8BC84;
}

div.nav .subheading.ranger {
  background-color: #C7EFA2;
}

div.nav .subheading.thief {
  background-color: #DEC6C9;
}

div.nav .subheading.elementalist {
  background-color: #FBC5C3;
}

div.nav .subheading.mesmer {
  background-color: #DBBCEA;
}

div.nav .subheading.necromancer {
  background-color: #A9D3B7;
}

/* Subheadings - races */
div.nav .subheading.asura {
  background-color: #D1BDF8;
}

div.nav .subheading.charr {
  background-color: #FFBCC3;
}

div.nav .subheading.human {
  background-color: #FFF2B3;
}

div.nav .subheading.norn {
  background-color: #BADDFF;
}

div.nav .subheading.sylvari {
  background-color: #B0F3B2;
}

/* Subheadings - types */
div.nav .subheading.npc {
  background-color: #B3E699;
}

div.nav .subheading.pve {
  background-color: #FFE6B3;
}

div.nav .subheading.equip {
  background-color: #FFCCB3;
}

div.nav .subheading.skin {
  background-color: #FFD4DF;
}

div.nav .subheading.mech1 {
  background-color: #B3CCE6;
}

div.nav .subheading.mech2 {
  background-color: #99E6E6;
}

div.nav .subheading.lore {
  background-color: #E6B3E6;
}

div.nav .subheading.location {
  background-color: #CCB3E6;
}

div.nav .subheading.promo {
  background-color: #CCE699;
}

div.nav .subheading.crafting,
div.nav .subheading.recipe {
  background-color: #E6CCB3;
}

/** -------- TEMPLATES: TABLES -------- **/
/** TABLES **/
.table {
  width: 100%;
  border-collapse: collapse;
}

.table th {
  background-color: #DDD;
}

.table th, .table td {
  border: 1px solid black;
  padding: 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;
}

/* STDT table classes */
/* any */
.table.any > :first-child > tr:first-child > *,
.table.any > tbody > tr.heading > * {
  background-color:#888 !important;
}

.table.any > * > tr > th,
.table > * > tr.any > th {
  background-color:#CCC;
}

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

/* guardian */
.table.guardian > :first-child > tr:first-child > *,
.table.guardian > tbody > tr.heading > * {
  background-color:#72C1D9 !important;
}

.table.guardian > * > tr > th,
.table > * > tr.guardian > th {
  background-color:#B9E0EC;
}

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

/* revenant */
.table.revenant > :first-child > tr:first-child > *,
.table.revenant > tbody > tr.heading > * {
  background-color:#B1574C !important;
}

.table.revenant > * > tr > th,
.table > * > tr.revenant > th {
  background-color:#E3B4AA;
}

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

/* warrior */
.table.warrior > :first-child > tr:first-child > *,
.table.warrior > tbody > tr.heading > * {
  background-color:#FFD166 !important;
}

.table.warrior > * > tr > th,
.table > * > tr.warrior > th {
  background-color:#FFE8B3;
}

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

/* engineer */
.table.engineer > :first-child > tr:first-child > *,
.table.engineer > tbody > tr.heading > * {
  background-color:#D09C59 !important;
}

.table.engineer > * > tr > th,
.table > * > tr.engineer > th {
  background-color:#E8BC84;
}

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

/* ranger */
.table.ranger > :first-child > tr:first-child > *,
.table.ranger > tbody > tr.heading > * {
  background-color:#8EDF44 !important;
}

.table.ranger > * > tr > th,
.table > * > tr.ranger > th {
  background-color:#C7EFA2;
}

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

/* thief */
.table.thief > :first-child > tr:first-child > *,
.table.thief > tbody > tr.heading > * {
  background-color:#C08F95 !important;
}

.table.thief > * > tr > th,
.table > * > tr.thief > th {
  background-color:#DEC6C9;
}

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

/* elementalist */
.table.elementalist > :first-child > tr:first-child > *,
.table.elementalist > tbody > tr.heading > * {
  background-color:#F68A87 !important;
}

.table.elementalist > * > tr > th,
.table > * > tr.elementalist > th {
  background-color:#FBC5C3;
}

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

/* mesmer */
.table.mesmer > :first-child > tr:first-child > *,
.table.mesmer > tbody > tr.heading > * {
  background-color:#B679D5 !important;
}

.table.mesmer > * > tr > th,
.table > * > tr.mesmer > th {
  background-color:#DBBCEA;
}

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

/* necromancer */
.table.necromancer > :first-child > tr:first-child > *,
.table.necromancer > tbody > tr.heading > * {
  background-color:#52A76F !important;
}

.table.necromancer > * > tr > th,
.table > * > tr.necromancer > th {
  background-color:#A9D3B7;
}

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

/* asura */
.table.asura > :first-child > tr:first-child > *,
.table.asura > tbody > tr.heading > * {
  background-color:#A27BF1 !important;
}

.table.asura > * > tr > th,
.table > * > tr.asura > th {
  background-color:#D1BDF8;
}

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

/* charr */
.table.charr > :first-child > tr:first-child > *,
.table.charr > tbody > tr.heading > * {
  background-color:#FE7887 !important;
}

.table.charr > * > tr > th,
.table > * > tr.charr > th {
  background-color:#FFBCC3;
}

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

/* human */
.table.human > :first-child > tr:first-child > *,
.table.human > tbody > tr.heading > * {
  background-color:#FFE566 !important;
}

.table.human > * > tr > th,
.table > * > tr.human > th {
  background-color:#FFF2B3;
}

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

/* norn */
.table.norn > :first-child > tr:first-child > *,
.table.norn > tbody > tr.heading > * {
  background-color:#75BAFF !important;
}

.table.norn > * > tr > th,
.table > * > tr.norn > th {
  background-color:#BADDFF;
}

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

/* sylvari */
.table.sylvari > :first-child > tr:first-child > *,
.table.sylvari > tbody > tr.heading > * {
  background-color:#61E665 !important;
}

.table.sylvari > * > tr > th,
.table > * > tr.sylvari > th {
  background-color:#B0F3B2;
}

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

/* npc */
.table.npc > :first-child > tr:first-child > *,
.table.npc > tbody > tr.heading > * {
  background-color:#6C3 !important;
}

.table.npc > * > tr > th,
.table > * > tr.npc > th {
  background-color:#B3E699;
}

.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 > * {
  background-color:#FC6 !important;
}

.table.pve > * > tr > th,
.table > * > tr.pve > th {
  background-color:#FFE6B3;
}

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

/* equip (same as item), split for clarity */
.table.equip > :first-child > tr:first-child > *,
.table.equip > tbody > tr.heading > * {
  background-color:#F96 !important;
}

.table.equip > * > tr > th,
.table > * > tr.equip > th {
  background-color:#FFCCB3;
}

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

/* item (same as equip), split for clarity */
.table.item > :first-child > tr:first-child > *,
.table.item > tbody > tr.heading > * {
  background-color:#F96 !important;
}

.table.item > * > tr > th,
.table > * > tr.item > th {
  background-color:#FFCCB3;
}

.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 > * {
  background-color:#E07A98 !important;
}

.table.skin > * > tr > th,
.table > * > tr.skin > th {
  background-color:#FFD4DF;
}

.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 > * {
  background-color:#69C !important;
}

.table.mech1 > * > tr > th,
.table > * > tr.mech1 > th {
  background-color:#B3CCE6;
}

.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 > * {
  background-color:#3CC !important;
}

.table.mech2 > * > tr > th,
.table > * > tr.mech2 > th {
  background-color:#99E6E6;
}

.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 > * {
  background-color:#C6C !important;
}

.table.lore > * > tr > th,
.table > * > tr.lore > th {
  background-color:#E6B3E6;
}

.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 > * {
  background-color:#96C !important;
}

.table.location > * > tr > th,
.table > * > tr.location > th {
  background-color:#CCB3E6;
}

.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 > * {
  background-color:#9C3 !important;
}

.table.promo > * > tr > th,
.table > * > tr.promo > th {
  background-color:#CCE699;
}

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

/* hom */
.table.hom > :first-child > tr:first-child > *,
.table.hom > tbody > tr.heading > * {
  background-color:#C96 !important;
}

.table.hom > * > tr > th,
.table > * > tr.hom > th {
  background-color:#E6CCB3;
}

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

/* boon */
.table.boon > :first-child > tr:first-child > *,
.table.boon > tbody > tr.heading > * {
  background-color:#73D9D9 !important;
}

.table.boon > * > tr > th,
.table > * > tr.boon > th {
  background-color:#B9ECEC;
}

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

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

.table.condition > * > tr > th,
.table > * > tr.condition > th {
  background-color:#A8D3A8;
}

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

/* crafting (same as recipe), split for clarity */
.table.crafting > :first-child > tr:first-child > *,
.table.crafting > tbody > tr.heading > * {
  background-color:#A68151 !important;
}

.table.crafting > * > tr > th,
.table > * > tr.crafting > th {
  background-color:#D3C0A8;
}

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

/* recipe (same as crafting), split for clarity */
.table.recipe > :first-child > tr:first-child > *,
.table.recipe > tbody > tr.heading > * {
  background-color:#A68151 !important;
}

.table.recipe > * > tr > th,
.table > * > tr.recipe > th {
  background-color:#D3C0A8;
}

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

/* Skill tables */
.table.skills span.mw-editsection {
  display: none;
}

/** -------- TEMPLATES: ICONS -------- **/
/** ICONS **/
.inline-icon {
  display: inline-block;
  overflow: visible;
  height: 1.538em;
  margin: 0 0.167em;
}

.inline-icon img {
  position: relative;
  bottom: 2px;
}

.inline-icon.effect {
  margin: 0 0 0 0.167em;
}

.item-icon.small {
  display: inline-block;
  overflow: hidden;
  width: 2em;
  height: 2em;
  vertical-align:middle;
  margin-left:-1pt
}

.item-icon.small img {
  width: 2em;
  height: 2em;
}

.item-icon.medium {
  display: inline-block;
  overflow: hidden;
  width: 3em;
  height: 3em;
  vertical-align:middle;
  margin-left:-1pt
}

.item-icon.medium img {
  width: 3em;
  height: 3em;
}

/** -------- TEMPLATES: LISTS -------- **/
/* Horizontal lists. See [[mw:Snippets/Horizontal lists]] */
.hlist dl,
.hlist ol,
.hlist ul {
  margin: 0;
  padding: 0;
}

/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
  margin: 0;
  display: inline;
}

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

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

/* Generate interpuncts */
.hlist dt:after {
  content: ": ";
}

.hlist dd:after,
.hlist li:after {
  content: " • ";
  font-weight: bold;
  margin: 0 2px;
}

.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
  content: none;
}

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

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

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

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

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

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

.hlist li {
  white-space: nowrap;
}

/** -------- TEMPLATES: OTHER -------- **/
/** GENERAL **/
.hide,
.nomobile {
  display: none;
}

@media screen and (max-width:720px) {
  .content .floatright,
  .content .floatleft {
      float: none;
  }

  .floatright > a,
  .floatleft > a {
      display: flex;
      justify-content: center;
  }

  .clear-if-narrow {
      float: none !important;
      width: unset !important;
      clear: both !important;
  }

}

.gray,
.gray a {
  color: gray;
}

/* [[Template:Rarity]] */
.rarity-junk {
  color: #AAAAAA;
}

.rarity-basic {
  color: #000000;
}

.rarity-fine {
  color: #62A4DA;
}

.rarity-masterwork {
  color: #1a9306;
}

.rarity-rare {
  color: #fcd00b;
}

.rarity-exotic {
  color: #ffa405;
}

.rarity-ascended {
  color: #fb3e8d;
}

.rarity-legendary {
  color: #4C139D;
}

/* Patch notes for skill history project */
.skill-history {
  border-color: #AAA;
  background-color: #F6F3E4;
}

/* [[Template:Archive-box]] and [[Template:Mail]] */
.archive-box {
  border-color: #EA3;
  background-color: #FFC;
}

.mail {
  border: 1px solid silver;
  background: #FFF8E8;
}

/* White rows for achievement tables where alternating light-dark rows don't work so well */
.white {
  background-color: white;
}

.offwhite {
  background-color: #E8F0F8;
}

/* [[Template:Complexity dots]] */
.complexity-dot { color: transparent; }

.color-filled-guardian       { text-shadow: 0 0 0 #72C1D9; }
.color-filled-revenant       { text-shadow: 0 0 0 #D16E5A; }
.color-filled-warrior        { text-shadow: 0 0 0 #FFD166; }
.color-filled-engineer       { text-shadow: 0 0 0 #D09C59; }
.color-filled-ranger         { text-shadow: 0 0 0 #8CDC82; }
.color-filled-thief          { text-shadow: 0 0 0 #C08F95; }
.color-filled-elementalist   { text-shadow: 0 0 0 #F68A87; }
.color-filled-mesmer         { text-shadow: 0 0 0 #B679D5; }
.color-filled-necromancer    { text-shadow: 0 0 0 #52A76F; }

.color-unfilled-guardian     { text-shadow: 0 0 0 #CFEEFD; }
.color-unfilled-revenant     { text-shadow: 0 0 0 #EBC9C2; }
.color-unfilled-warrior      { text-shadow: 0 0 0 #FFF5BB; }
.color-unfilled-engineer     { text-shadow: 0 0 0 #E8C89F; }
.color-unfilled-ranger       { text-shadow: 0 0 0 #E2F6D1; }
.color-unfilled-thief        { text-shadow: 0 0 0 #E6D5D7; }
.color-unfilled-elementalist { text-shadow: 0 0 0 #F6D2D1; }
.color-unfilled-mesmer       { text-shadow: 0 0 0 #D7B2EA; }
.color-unfilled-necromancer  { text-shadow: 0 0 0 #D5EDE1; }

/* Weekly/daily rotation data templates */
.highlight-yellow {
  background-color: yellow !important;
}

.highlight-blue {
  background-color: lightblue !important;
}

/* "Guild Wars 2 Wiki" and "Help" namespace layouts */
.wiki-help,
.wiki-help .darkfill {
  border-color: #598CA0; /* darker blue */
}

.wiki-help .darkfill {
  background-color: #A1C2CF; /* heading blue */
}

.wiki-help .lightfill {
  background-color: #EFFBF5; /* content blue */
}

.wiki-gw2w,
.wiki-gw2w .darkfill {
  border-color: #8EAB72; /* darker green */
}

.wiki-gw2w .darkfill {
  background-color: #C3E0A6; /* heading green */
}

.wiki-gw2w .lightfill {
  background-color: #F4FDEA; /* content green */
}

.wiki-projects,
.wiki-projects .darkfill {
  border-color: #B78048; /* darker orange */
}

.wiki-projects .darkfill {
  background-color: #F2E6CE; /* heading orange */
}

.wiki-projects .lightfill {
  background-color: #FFFCF5; /* content orange */
}

.wiki-nav {
  border-color: #66D; /* darker purple */
  background-color: #DDF; /* heading purple */
}