MediaWiki:Common.css

/***************** * Rarity Colors * *****************/

.rarity-color-crude { color: #949293; }

.rarity-color-basic { color: #BA976D; }

.rarity-color-grand { color: #77b064; }

.rarity-color-rare { color: #558fd7; }

.rarity-color-arcane { color: #cb72d8; }

.rarity-color-heroic { color: #d78b06; }

.rarity-color-unique { color: #e17853; }

.rarity-color-celestial { color: #f95252; }

.rarity-color-divine { color: #cf7d5d; }

.rarity-color-epic { color: #8fa5ca; }

.rarity-color-legendary { color: #bf7900; }

.rarity-color-mythic { color: #c90b0b; }

/******************** * Main page styles * ********************/

body.page-ArcheAge_Wiki.ns-0.action-view div#content { background: none; }

body.page-ArcheAge_Wiki.ns-0.action-view div#footer { margin-left: calc(1.5em + 2px); margin-right: calc(1.5em + 2px); }

body.page-ArcheAge_Wiki.ns-0.action-view .ambox { background: rgba(87,111,118,.9); }

.main-page-layout { width: 100%; }

.main-page-layout > tr > td, .main-page-layout > * > tr > td { background: rgba(87,111,118,.9); padding: 0; vertical-align: top; }

.main-page-heading { background: rgba(253,179,54,.9); text-align: center; position: relative; }

.main-page-heading img { position: absolute; top: .5em; right: .5em; }

.main-page-content { padding: .5em; }

div#content .main-page-content h2:first-child { margin-top: 0; }

border: 3px solid #333; padding: 10px; background: white; text-align:left; margin: 0 50px; }
 * 1) news-box {

.inside-table { width: 100%; }

.inside-table td { border: none; padding: 0 5px; margin: 0; }

.absolute-top { position: absolute; top: 0; }

.important { color: red; font-weight: 700; }

.admin { text-decoration: underline; font-weight: 700; }

.template td { min-width: 400px; max-width: 500px; vertical-align: top; border: none !important; }

.template th { max-width: 500px; }

/****************** * Infobox Styles * ******************/ table.infobox { background: none; border-collapse: separate; border-spacing: 2px; margin: 0 0 1.5em 1em; float: right; clear: right; width: 22em; }

table.infobox .title, table.infobox .section { text-align: center; }

table.infobox .title { font-size: 120%; }

table.infobox > tr > td, table.infobox > * > tr > td { text-align: right; padding-left: .5em; padding-right: .5em; background: rgba(0,0,0,.15); }

table.infobox > tr > th, table.infobox > * > tr > th { text-align: left; padding-left: .5em; padding-right: .5em; background: rgba(0,0,0,.3); }

.infobox3 { float: right; margin: 0 0 1.5em 1em; width: 22em; }

.infobox3 > tr > th, .infobox3 > * > tr > th { background: rgba(0,0,0,.3); padding: 1px .25em; text-align: left; }

.infobox3 > tr > td, .infobox3 > * > tr > td { background: rgba(0,0,0,.15); padding: 1px .25em; text-align: right; }

/************************************* * Skillset panel and skill tooltips * *************************************/

.skillset-panel { background: #eeefdd; color: #775120; width: 195px; padding: 5px; }

.skillset-panel > .skillset-name { font-size: 120%; }

.skill-rank-overlay { position: absolute; color: white; bottom: 0; left: 0; text-align: center; line-height: normal; width: 16px; height: 16px; padding: 4px 4px 0 0; background: url(https://archeage.gamepedia.com/media/archeage.gamepedia.com/5/59/Skill-rank-overlay.png); }

.passive-label { float: right; }

.skill-tooltip, .infobox2 { background: rgba(92,68,46,.95); border: solid 1px black; box-shadow: 0 0 .25em rgba(0,0,0,.75) inset,0 0 .25em rgba(0,0,0,.75); box-sizing: border-box; color: #d0c3b3; width: 295px; padding: 13px; z-index: 100; }

.skill-tooltip-section { overflow-y:hidden; }

.tooltip-orange, .skilltt-buff_duration, .skill-tooltip .skillset-name { color: #FF9C27; }

.skill-tooltip .skill-name { color: white; }

.tooltip-green, .skilltt-heal, .skilltt-damage { color: #00ff45; }

.itemtt-use, .skilltt-combo, .skill-tooltip-section-combos { color: #9cac63; }

.skillset-panel .skills { position: relative; height: 230px; }

.active-skill, .passive-skill { border: solid 1px black; position: absolute; }

.active-skill-1, .active-skill-4, .active-skill-7, .active-skill-10 { top: 0; left: 0; }

.active-skill-2, .active-skill-5, .active-skill-8, .active-skill-11 { top: 0; left: 47px; }

.active-skill-3, .active-skill-6, .active-skill-9 { top: 0; left: 94px; }

.active-skill-4, .active-skill-5, .active-skill-6, .passive-skill-2 { top: 47px; }

.active-skill-7, .active-skill-8, .active-skill-9, .passive-skill-3 { top: 94px; }

.active-skill-10, .active-skill-11, .passive-skill-4 { top: 141px; }

.passive-skill-5 { top: 188px; }

.passive-skill { right: 0; }

/***************************** /* Infobox Version 2        * /*****************************/ .infobox2 table { width: 100%; }

.infobox2 table td { text-align: right; padding: 0px 1px !important; }

.infobox2 table th { text-align: left; padding: 0px 1px !important; }

.infobox2 p { margin: 0px !important; }

.infobox2 .item_icon { float: left; margin-right: 5px; }

.infobox2 .item_icon_right { float: right; margin-left: 5px; }

.infobox2 .spacer { border-bottom: #6e5137 1px solid; }

.infobox2 .item_use_title { font-weight: bold; color: #8b8a8a; }

.infobox2 .no_sell { color: red; text-align: left; }

/***************************** /* Formatting Fixes & Tweaks * /*****************************/

/* Fixes an issue when single indent preformatted text contacts a right floating image. */   overflow-x: auto; }
 * 1) content pre {

/********************* /* Notice box styles * /*********************/

.notice { color: #333; margin: 0 10% 1em; background: #f9f9f9; border-style: solid; border-color: #333; border-width: 2px 2px 2px 5px; }

/**************** * Ambox styles * ****************/

.ambox { background: rgba(0,0,0,.3); border: none; margin: 0 10% 1em; }

.ambox-blue { border-left: 10px solid #1e90ff; }

.ambox-red { border-left: 10px solid #CC3300; }

.ambox-yellow { border-left: 10px solid #FFCC00; }

/********************************* /* Template Documentation styles * /*********************************/

.template-documentation { background: rgba(0,0,0,.14); border: none; clear: both; padding: .5em; }

.template-documentation-heading { border-bottom: solid 1px #41db88; }

/*************************** /* Mainpage design testing * /***************************/

background-color: #333; text-align: center; text-transform:uppercase; font-size: 1.75em; font-weight: 500; color: #fff; text-shadow: 1px 1px 1px rgba(22, 22, 22, 1); height: 50px; }
 * 1) mainpage-table-1 th {

.subheader-1 th { height: 35px!important; }

border-right: #333 dotted 1px; }
 * 1) mainpage-table-1 td.border-1 {

padding: 5px; }
 * 1) mainpage-table-1 td.linkblock-1 {

/********************** /* Rarity icon styles * /**********************/

.rarity-icon { position: relative; display: inline-block; }

/* This should be the icon */ .rarity-icon > a:nth-child(1), .rarity-icon > img:nth-child(1) { }

/* This should be the rarity overlay */ .rarity-icon > a:nth-child(2), .rarity-icon > img:nth-child(2) { position:absolute; top: 0; left: 0; }

/************* * Old stuff * *************/

.aaimportant a { color: #00F3FF !important; }

.archeage { background: linear-gradient(to bottom, #75BABD 0px, #519EB8 50%, #477D9F 100%) transparent; border-radius: 10px; padding: 5px; margin: auto; }

.archeage a { color: #00F3FF; text-decoration: underline; }

.archeage a:visited { color: #6BCCBF; }

.archeage a.external { color: #00F3FF; }

.archeage .like-header { font-size: 20px; color: #000; }

table.vertable { border-spacing: .5em; }

table.vertable th { background: #202020; border-radius: 0.5em; padding: 5px; }

table.vertable a:hover img { opacity: 0.8; }

border-radius: 7px; }
 * 1) zaokraglenie img {

.newsall dl dt { display: inline-block; font-size: 20px; }

.newsall dl { padding-top: 5px; padding-bottom: 5px; text-align:left; }

.newsall dd { display: inline-block; font-size: 20px; font-weight: 700; margin-left: 10px; }

.newsall small { color: grey !important; font-size: 10px; font-style: italic; vertical-align: middle; }

.kr { background: url("https://archeage.gamepedia.com/media/archeage.gamepedia.com/6/6f/Kr.jpg") 100% 50%/20px no-repeat transparent; display: inline-block; padding-right: 22px; }

.jp { background: url("https://archeage.gamepedia.com/media/archeage.gamepedia.com/a/a7/Jp.jpg") 100% 50%/20px no-repeat transparent; display: inline-block; padding-right: 22px; }

.zh { background: url("https://archeage.gamepedia.com/media/archeage.gamepedia.com/9/93/Zh.jpg") 100% 50%/20px no-repeat transparent; display: inline-block; padding-right: 22px; }

.ru { background: url("https://archeage.gamepedia.com/media/archeage.gamepedia.com/8/89/Ru.jpg") 100% 50%/20px no-repeat transparent; display: inline-block; padding-right: 22px; }

.eu { background: url("https://archeage.gamepedia.com/media/archeage.gamepedia.com/3/35/Eu.jpg") 100% 50%/20px no-repeat transparent; display: inline-block; padding-right: 22px; }

.wikitable2 td { padding: 10px !important; }

.wikitable2 { border: 5px solid #333333 !important; text-align: center; }

.wikitable2 .linia { border-top: 5px solid #333333 !important; }

.prettytable { border: solid 5px #333; border-collapse: collapse; }

.prettytable > * > tr > th { background: #333; color: white; padding: 5px; }

.prettytable > * > tr > td { background: white; border: solid 1px silver; padding: 5px; }

.whitearrows .headerSort { background-image: url("https://archeage.gamepedia.com/media/archeage.gamepedia.com/0/03/Whitearrows.gif") !important; color: white !important; }

.wikitable2 .mark { background: #C1DAD7 !important; color: #606060 !important; }

.wikitable2 .mark2 { background: #959595; color: black; }

.radius8img img { border-radius: 8px; }

/************************ /* simple-navbox styles * /************************/ .simple-navbox, .simple-navbox .sub-navbox, .simple-navbox .navbox-subgroup { background: none; border-spacing: 2px; margin: -3px; width: calc( 100% + 6px ); } .simple-navbox { border: none; margin: -2px; margin: 1em 0; width: calc( 100% + 4px ); } .simple-navbox .sub-navbox, .simple-navbox .navbox-subgroup { border: none; } .simple-navbox .navbox-title { background: rgba(0,0,0,.3); text-align: center; } .simple-navbox .sub-navbox .navbox-title { background: rgba(0,0,0,.275); text-align: center; } .simple-navbox > tr > th, .simple-navbox > * > tr > th, .simple-navbox .sub-navbox > tr > th, .simple-navbox .sub-navbox > * > tr > th, .simple-navbox .navbox-subgroup > tr > th, .simple-navbox .navbox-subgroup > * > tr > th { background: rgba(0,0,0,.15); border: none; padding-left: .75em; padding-right: .75em; text-align: right; white-space: nowrap; width: 1px; } .simple-navbox > tr > td, .simple-navbox > * > tr > td { font-size: 88%; } .simple-navbox > tr > td:not(.navbox-container), .simple-navbox > * > tr > td:not(.navbox-container), .simple-navbox .sub-navbox > tr > td:not(.navbox-container), .simple-navbox .sub-navbox > * > tr > td:not(.navbox-container), .simple-navbox .navbox-subgroup > tr > td:not(.navbox-container), .simple-navbox .navbox-subgroup > * > tr > td:not(.navbox-container) { background: rgba(0,0,0,.075); border: none; padding-left: .75em; padding-right: .75em; }

/** * Style for horizontal lists (separator following item). * @source mediawiki.org/wiki/Snippets/Horizontal_lists * @revision 6 (2014-05-09) * @author mw:User:Edokter */ .hlist dl, .hlist ol, .hlist ul { margin: 0; padding: 0; } /* Display list items inline */ .hlist dd, .hlist dt, .hlist li { margin: 0; display: inline; } /* Display nested lists inline */ .hlist.inline, .hlist.inline dl, .hlist.inline ol, .hlist.inline ul, .hlist dl dl, .hlist dl ol, .hlist dl ul, .hlist ol dl, .hlist ol ol, .hlist ol ul, .hlist ul dl, .hlist ul ol, .hlist ul ul { display: inline; } /* Generate interpuncts */ .hlist dt:after { content: ": "; } .hlist dd:after, .hlist li:after { content: " · "; font-weight: bold; } .hlist dd:last-child:after, .hlist dt:last-child:after, .hlist li:last-child:after { content: none; } /* For IE8 */ .hlist dd.hlist-last-child:after, .hlist dt.hlist-last-child:after, .hlist li.hlist-last-child:after { content: none; } /* Add parentheses around nested lists */ .hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before, .hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before, .hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before { content: " (";   font-weight: normal; } .hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after, .hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after, .hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {    content: ") "; font-weight: normal; } /* For IE8 */ .hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after, .hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after, .hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-last-child:after { content: ") ";   font-weight: normal; } /* Put ordinals in front of ordered list items */ .hlist ol {    counter-reset: listitem; } .hlist ol > li {    counter-increment: listitem; } .hlist ol > li:before {    content: " " counter(listitem) " ";    white-space: nowrap; } .hlist dd ol > li:first-child:before, .hlist dt ol > li:first-child:before, .hlist li ol > li:first-child:before {    content: " (" counter(listitem) " "; }

/* CSS placed here will be applied to all skins */ /* This governs the sections on the Community portal */ .cpbox { display: flex; flex-direction: row-reverse; flex-wrap: wrap; }

.cpbox #admins { box-sizing: border-box; width: calc(33% - 10px); margin: 5px; flex-grow: 1; min-width: 300px; }

.cpbox #help { box-sizing: border-box; width: calc(67% - 10px); margin: 5px; flex-grow: 1; }

/* Template documentation styles */ /* If modifying these styles, be sure to update the mobile skin! */ .doc { margin: 0em auto 1em; background-color: rgba(0, 0, 0, 0.1); border: 2px solid #BDCAC3; border-radius: 1em; padding: 1em; }

.doc-header { padding-bottom: 3px; border-bottom: 1px solid #BDCAC3; margin-bottom: 1ex; }

.doc-footer { margin: 0; background-color: rgba(0, 0, 0, 0.1); border: 2px solid #BDCAC3; border-radius: 1em; padding: 1em; }

/* Classes permitting setting of alignment on desktop only or differently on desktop and mobile */ /* (See .mobileleft, .mobilecenter, .mobileright in MediaWiki:Mobile.css for the mobile equivalents */ .desktopleft {   text-align: left; }

.desktopcenter { text-align: center; }

.desktopright { text-align: right; }

/* Front page structure */ .fpbox { margin: 5px; padding: 5px; overflow: auto; width: calc(100% - 2px); }

.fpbox.plain { background: transparent; border: none; box-shadow: none; }

.fpbox .heading, .fpbox .mainheading, .fpbox .welcome { margin: 0 0 10px; padding: 0 0 5px; overflow: auto; }

.fpbox .mainheading, .fpbox .welcome { font-size: 150%; font-weight: bold; }

.fpbox .heading { text-align: center; font-size: 132%; }

.linkslabel { margin: 15px 5px 5px; padding: 0 0 5px; }

/* Template:FP links styles */ .fplinks { display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: stretch; text-align: center; }

.fplink-outer { padding: 5px; flex-basis: calc(25% - 10px); width: calc(25% - 15px); min-width: 115px; display: inline-block; vertical-align: middle; }

.fplink-wide { flex-basis: calc(33% - 10px); width: calc(33% - 15px); }

.fplink-fullwidth { flex-basis: 100%; width: calc(100% - 15px); font-weight: bold; }

.fplink { padding: 0.5em; box-sizing: border-box; width: 100%; height: 100%; display: table; }

.fplink-plain { background: transparent; border-radius: 0; border: 0; box-shadow: none; }

.fplink-inner { display: table-row; }

.fplink a { display: table-cell; vertical-align: middle; }

.fplink img { max-width: 150px; width: 100%; height: auto; } /* Auto-resize front page video to fit smaller columns */ .fpbox .embedvideowrap { width: 100%!important; max-width: 480px; margin: 0 auto; }

.fpbox .embedvideowrap iframe { width: 100%!important; }

/* Multi-column box support */ .fp-container main .columns .leftcol, .fp-container .columns .rightcol { width: 100%; margin: 0; padding: 0; }

@media (min-width: 990px) { .fp-container .columns .leftcol { float: left; width: 50%; }

.fp-container .columns .rightcol { float: right; width: 50%; } }

.fp-section { display: flex; flex-wrap: wrap; }

/* This CSS governs the responsive 3 column main page layout */ min-height:calc(325px + 2.3em); }
 * 1) fptweets {

display: grid; grid-template-areas: "a" "b" "c" "d"; grid-template-columns: 100%; } @media screen and (min-width:990px) { #fp-3column.fp-container { grid-template-areas: "a b" "c b" "c d"; grid-template-columns: 50% 50%; } } @media screen and (min-width:1350px) { #fp-3column.fp-container { grid-template-areas: "a b c" "d b c"; grid-template-columns: 33.3% 33.3% 33.3%; } }
 * 1) fp-3column.fp-container {

grid-area: a; }
 * 1) fp-1 {

grid-area: b; }
 * 1) fp-2 {

grid-area: c; }
 * 1) fp-3 {

grid-area: d; }
 * 1) fp-4 {

/* end responsive 3 column main page layout */

/* ******************** */ /* End main page layout */ /* ******************** */

.mainheader { color: #ffffff; border-bottom: 1px solid #41db88; font-size: 1.5em; }