User:Knightsfox/custom.css

From FFXI Wiki

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.
/** CSS placed here will be applied to all skins */

body.page-Main_Page h1.firstHeading { display:none; }

.EquipmentSet {
background-color: #00152F;
background-image: url(images/9/9b/Equipment_Set.png);
}

.AutoEquip {
background-color: #00152F;
background-image: url(images/8/88/Automaton_Equipment_Set.png);
}

.BG-SandOria {
background-color: #00152F;
background-image: url(images/f/fe/BG-SandOria.gif);
}

.BG-Bastok {
background-color: #00152F;
background-image: url(images/2/2e/BG-Bastok.gif);
}

.BG-Windurst {
background-color: #00152F;
background-image: url(images/b/b2/BG-Windurst.gif);
}

#p-googleadsense .pBody {
	padding-top: 5px;
	text-align:	center;
}

.MumorTable {
background-color: #fcedf0;
background-image: url(images/b/b3/MurmorBG.gif);
background-repeat: repeat-y;
}

/** Collapsible tables *********************************************************
 *
 *	Description: Allows tables to be collapsed, showing only the header. See
 *												 http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
 *	Maintainers: [[en:User:R. Koot]]
 */
 
table.collapsed tr.collapsible {
	display: none;
}

.collapseButton {							 /* 'show'/'hide' buttons created dynamically by the				*/
	float: right;								 /* CollapsibleTables JavaScript in [[MediaWiki:Common.js]] */
	font-weight: normal;				 /* are styled here so they can be customised.							*/
	text-align: right;
	width: auto;
}

/* Hack for the command table alignment in Standard Magic */

#leftalign {
float: left;
}

#rightalign {
text-align: right;
float: right;
}

#copywrite {
display: none;
}


/*** Universal fix for text size issues on mobile ***/
table {
     text-size-adjust: none;
}

/*********** class=default1: Makes the default BG table ***********/

/* Link Style Variations */

/* Determines the color of a link */
.default1 th A:link {color: #e2f5ff; text-decoration: none}

/* Determines what happens to a link you've clicked before */
.default1 th A:visited {color: #7efefd; text-decoration: none}

/* Determines what happens when you click the link */
.default1 th A:active {color:white; text-decoration: underline}

/* Determines what happens to a link when you hover over the link */
.default1 th A:hover {color:red; text-decoration: underline}

table.default1{
	margin: 1em 1em 1em 0;
	background: #e7edf3 ;
	border: 1px white solid;
	border-collapse: collapse;
	width: 100%;
	padding: 2px;
}
/* Sets border color */
table.default1 th, table.default1 td {
	border: 1px white solid;
        padding: 2px;
	
}
/* Sets the background and color for headers */
table.default1 th {
	background: #2A4865;
	text-align: center;
	color: white;
}

table.default1 caption {
	margin-left: inherit;
	margin-right: inherit;
}
/* Sets the font for headers */
table.default1 thead td {
	font-weight: bold;
	color: white;
}

/*********** class=column1bold: Makes the first column bold ***********/
table.column1bold td:first-child{
	font-weight: bold;
}

/*********** class=column1indent: Makes the first column indent left ***********/
table.column1indent td:first-child{
	padding-left : 10px;
}

/*********** class=altrowblue: Makes the rows alternate blue ***********/

table.altrowblue tr:nth-child(even) { 
	background: #e4f4fb;
}

/*********** class=altrowgreen: Makes the rows alternate light green/green (odd/even) ***********/

table.altrowgreen tr:nth-child(odd) { 
	background: #D4E5C3;
}

table.altrowgreen tr:nth-child(even) { 
	background: #93B993;
}

/************ class=thwhite: Sets the font white for headers (Use with dark tables) ************/

/* Determines the color of a link */
.thwhite th A:link {color: #7efefd; text-decoration: none}

/* Determines what happens to a link you've clicked before */
.thwhite th A:visited {color: #7efefd; text-decoration: none}

/* Determines what happens when you click the link */
.thwhite th A:active {color:white; text-decoration: underline}

/* Determines what happens to a link when you hover over the link */
.thwhite th A:hover {color:red; text-decoration: underline}

table.thwhite th {
	color: white;
}
table.thwhite thead td {
	font-weight: bold;
	color: white;
}

/*********** class=bdrwhite: Makes the borders 1px white ***********/

table.bdrwhite{
	border: 1px white solid;
	border-collapse: collapse;
}
/* Sets border color */
table.bdrwhite th, table.bdrwhite td {
	border: 1px white solid;
	padding: 1px
}


/*********** class=bdrblack: Makes the borders 1px black ***********/

table.bdrblack{
	border: 1px black solid;
	border-collapse: collapse;
	
}
/* Sets border color */
table.bdrblack th, table.bdrblack td {
	border: 1px black solid;
	padding: 1px
}

/*********** class=bdrdarkblue: Makes the borders 1px darkblue ***********/

table.bdrdarkblue{
	border: 1px #3c6a95 solid;
	border-collapse: collapse;
	vertical-align:top;
}
/* Sets border color */
table.bdrdarkblue th, table.bdrdarkblue td {
	border: 1px #3c6a95 solid;
	padding-left: 3px;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-right: 1px
}

/ * Standard Table * /
/* Link Style Variations */

/* Determines the color of a link */
.Standard th[scope="col"] A:link {color: #7efefd; text-decoration: none}
.Standard th[scope="row"] A:link {color: #0645AD; text-decoration: none}

/* Determines what happens to a link you've clicked before */
.Standard th[scope="col"] A:visited {color: #7efefd; text-decoration: none}
.Standard th[scope="row"] A:visited {color: #0645AD; text-decoration: none}

/* Determines what happens when you click the link */
.Standard th[scope="col"] A:active {color:white; text-decoration: underline}
.Standard th[scope="row"] A:active {color:#0645AD; text-decoration: underline}

/* Determines what happens to a link when you hover over the link */
.Standard th[scope="col"] A:hover {color:red; text-decoration: underline}
.Standard th[scope="row"] A:hover {color:#0645AD; text-decoration: underline}

/* go ahead and copy it, we know you will. Stop being lazy, and put effort into making your own original tables */
table.Standard {
	margin: 1em 1em 1em 0;
	border: 1px white solid;
	border-collapse: collapse;
	width: -moz-available;
	max-width:960px;
	padding: 1px;
	position: relative;
	overflow: hidden;
}

table.BorderlessStandard {
	margin: 1em 1em 1em 0;
	border: 0px;
	border-collapse: collapse;
	width: -moz-available;
	max-width:960px;
	padding: 1px;
	position: relative;
	overflow: hidden;
}
/* go ahead and copy it, we know you will. Stop being lazy, and put effort into making your own original tables */
/* Sets border color */
table.Standard th, table.Standard td {
	border: 1px white solid;
	vertical-align: middle;
}
/* Sets the background and color for headers */
table.Standard th {
	text-align: center;
}

table.Standard caption {
	margin-left: inherit;
	margin-right: inherit;
}
/* Sets the font for headers */
table.Standard thead td {
	font-weight: bold;
}

/* Bold the first column */
table.C1-Bold td:first-child{
	font-weight: bold;
}

/* Bold the first column */
table.C1-Bold td:first-child{
	font-weight: bold;
}

/* class=R1-White: Row 1 White Font */

/* Determines the color of a link */
.R1-White th A:link {color: #7efefd; text-decoration: none}

/* Determines what happens to a link you've clicked before */
.R1-White th A:visited {color: #7efefd; text-decoration: none}

/* Determines what happens when you click the link */
.R1-White th A:active {color:white; text-decoration: underline}

/* Determines what happens to a link when you hover over the link */
.R1-White th A:hover {color:red; text-decoration: underline}

table.R1-White th[scope="row"] {
	color: black;
}
table.R1-White th {
	color: white;
}
table.R1-White thead[scope="col"] td {
	font-weight: bold;
	color: white;
}
table.R1-White thead[scope="row"] td {
	font-weight: bold;
	color: black;
}

/* Highlight Cells */
table.C-Highlight td:hover	{Background: #e1e0e0;}
table.C-Highlight-DrkGrey td:hover {Background: #CDCDCD;}
table.C-Highlight-Orange td:hover {Background: #F98743;}
table.C-Highlight-Yellow td:hover {Background: #E0DBC5;}
table.C-Highlight-Green td:hover {Background: #B1DDB5;}
table.C-Highlight-Blue td:hover {Background: #B8C7E0;}
table.C-Highlight-Purple td:hover{Background: #BDA4DB;}
table.C-Highlight-Red td:hover {Background: #DDA8A8;}
table.C-Highlight-WikiBlue td:hover {Background: #CDE5F7;}
 
/* Highlights the row when you over over the row */
table.R-Highlight tr:hover td {Background: #e1e0e0;}
table.R-Highlight-DrkGrey tr:hover td {Background: #CDCDCD;}
table.R-Highlight-Orange tr:hover td {Background: #F98743;}
table.R-Highlight-Yellow tr:hover td {Background: #E0DBC5;}
table.R-Highlight-Green tr:hover td {Background: #B1DDB5;}
table.R-Highlight-Blue tr:hover td {Background: #B8C7E0;}
table.R-Highlight-Purple tr:hover td {Background: #BDA4DB;}
table.R-Highlight-Red tr:hover td {Background: #DDA8A8;}
table.R-Highlight-WikiBlue tr:hover td {Background: #CDE5F7;}

/* Arrange Items Into Two Columns Automatically */

.multicol {
column-count:2;
-moz-column-count:2; /* Firefox */
-webkit-column-count:2; /* Safari and Chrome */

}

table.Standardwide {
	margin: 1em 1em 1em 0;
	border: 1px white solid;
	border-collapse: collapse;
	padding: 1px;
	position: relative;
	overflow: hidden;
}

/****************************************************************/
/******* Table formatting and colors for various purposes *******/
/****************************************************************/
 
/***** Tables & Defaults *****/
 
/*** Item Table ***/
 
table.item {
	width: 788px;
	border-collapse: collapse;
}
 
table.item, table.item th, table.item td {
	border: 1px solid #3c6a95;
}

table.item th, table.item td {
	padding: 3px;
}
 
table.item th {
	background-color: #d4d4d4;
	color: #252525;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
}
 
table.item th.title {
	background-color: #4696cf;
	color: #ffffff;
}

table.item th.title a:link, table.item th.title a:visited {
	color: #ffffff;
	text-decoration: none;
}

table.item td {
	background-color: #f5f5f5;
	color: #252525;
}

/* Adapting item-name-and-references-link table */

table.item th.title table {
	width: 100%;
	border-collapse: collapse;
}

table.item th.title table td {
	text-align: center;
	background-color: transparent;
	color: #ffffff;
	border: 0px;
	padding: 0px;
}
 
/**** Two-Column Adaptation ****/

.twocolumn {
	border: 0px;
	border-collapse: separate;
	border-spacing: 0px 4px;
	width: 788px;
}

.twocolumn td {
	vertical-align: top;
}

.twocolumn td:first-child {
	padding-right: 2px;
}

.twocolumn td:last-child {
	padding-left: 2px;
}

.twocolumn table {
	width: 100%;
}
 
/***** Colors *****/
 
/*** Campaign palette ***/
 
table.campaign, table.campaign th, table.campaign td {
	border-color: #2c3d57;
}
 
table.campaign th.title {
	background-color: #6e96d5;
	color: #252525;
}
 
table.campaign td {
	background-color: #DFE6F2;
}

/*** Item Upgrade palette ***/

table.itemupgrade th.title {
	background-color: #4A233D;
}

table.itemupgrade th {
	background-color: #e8e8e8;
}

table.itemupgrade td {
	background-color: #efeeee;
}

table.item.itemupgrade, table.item.itemupgrade th, table.item.itemupgrade td {
	border-color: #170b0e;
}

/*** NM palette ***/

table.nm, table.nm th, table.nm td {
	border-color: #471717;
}

table.nm th {
	background-color: #DB9292;
}

table.nm th.title {
	background-color: #cf4646;
	color: #252525;
}

table.nm th.title a:link, table.nm th.title a:visited {
	color: #252525;
}

table.nm td, tr.nm td {
	background-color: #FEDDDD;
}

/*** Mission palette ***/

table.mission, table.mission th, table.mission td {
	border-color: #3e444a;
}

table.mission th.title {
	background-color: #E8AE5C;
}

table.mission td {
	background-color: #e7edf3;
}

/*** Battlefield palette ***/

table.battlefield, table.battlefield th, table.battlefield td {
	border-color: #aaaaaa;
}

table.battlefield th {
	background: #cee0f2;
}

table.battlefield th.title {
	background: #bfbfbf;
	color: #252525;
}

table.battlefield th.title a:link, table.battlefield th.title a:visited {
	color: #252525;
}

/*** Abjuration palette ***/

table.abjuration, table.abjuration th, table.abjuration td {
	border-color: #826c3b;
}

table.abjuration th.title {
	background: #d1bb8c;
	color: #98441b;
}

table.abjuration th {
	background: #E9D3A4;
	color: #98441b;
}

table.abjuration th.title a:link, table.abjuration th.title a:visited {
	color: #98441b;
}

table.abjuration td {
	background: #f6f2ea;
}

/*** Coalition Assignment palette ***/

table.coalition th {
	background-color: #4b4d4f;
	color: #ffffff;
}

table.coalition td {
	background-color: #efeeee;
}

table.item.coalition, table.item.coalition th, table.item.coalition td {
	border-color: #222324;
}

table.overflow-visible {
       overflow: visible;
}

/******* End Table Formatting & Coloration *******/

/******* Start Image Popup *******/

span.has-image-popup {
	position: relative;
}

span.has-image-popup span.image-popup {
	display: none;
}

span.has-image-popup:hover span.image-popup {
	display: block;
	left: 15px;
	position: absolute;
	top: 10px;
	width: 200%;
}
/******* End Image Popup *******/

/******* Start Import Calculator Styling *******/
mw.loader.load( 'index.php?title=MediaWiki:Calculator.css&action=raw&ctype=text/css', 'text/css' );
/******* End Import Calculator Styling *******/

/******* Start Import Tooltip Styling *******/
mw.loader.load( 'index.php?title=MediaWiki:Tooltip.css&action=raw&ctype=text/css', 'text/css' );

/******* End Import Tooltip Styling *******/

/******* Start Import Tooltip Styling *******/
mw.loader.load( 'index.php?title=MediaWiki:Button.css&action=raw&ctype=text/css', 'text/css' );

/******* End Import Tooltip Styling *******/

/* Start Image Scaling */
.img-scaler > img {
max-width: 100%; 
height: auto;
}

.img-scaler > a > img {
max-width: 100%; 
height: auto;
}
/* End Image Scaling */

/*********** class=bdrdarkbluepad2: Makes the borders 1px darkblue with 10px padding ***********/
 
table.bdrdarkbluepad2{
	border: 1px;
	border-collapse: collapse;
	vertical-align:top;
}
/* Sets border color */
table.bdrdarkbluepad2 th, table.bdrdarkbluepad2 td {
	border: 1px #3c6a95 solid;
	padding-left: 5px;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-right: 1px
}
 
/* Highlight Cells */
table.C-Highlight-DrkGrey td:hover {Background: #CDCDCD;}
table.C-Highlight-Orange td:hover {Background: #F98743;}
table.C-Highlight-Yellow td:hover {Background: #E0DBC5;}
table.C-Highlight-Green td:hover {Background: #CEE0D0;}
table.C-Highlight-Blue td:hover {Background: #C9CDE0;}
table.C-Highlight-Purple td:hover{Background: #D7C5E0;}
table.C-Highlight-Red td:hover {Background: #E0CECE;}
table.C-Highlight-WikiBlue td:hover {Background: #CDE5F7;}
 
/* Highlights the row when you over over the row */
table.R-Highlight-DrkGrey tr:hover td {Background: #CDCDCD;}
table.R-Highlight-Orange tr:hover td {Background: #F98743;}
table.R-Highlight-Yellow tr:hover td {Background: #E0DBC5;}
table.R-Highlight-Green tr:hover td {Background: #CEE0D0;}
table.R-Highlight-Blue tr:hover td {Background: #C9CDE0;}
table.R-Highlight-Purple tr:hover td {Background: #D7C5E0;}
table.R-Highlight-Red tr:hover td {Background: #E0CECE;}
table.R-Highlight-WikiBlue tr:hover td {Background: #CDE5F7;}
 
 
table.greencol td:nth-child(1) { 
	background: #93B993;
}
 
table.bluecol td:nth-child(1) { 
	background: #83C8F8;
}

/*********** class=altrowblue-odd: Makes the rows alternate light blue/blue (odd/even) Use when there is an odd amount of table headers(th) ***********/
 
table.altrowblue-odd th {background: #1943AB;}
 
 
table.altrowblue-odd tr:nth-child(even) { 
	background: #c3d8e5;
}
 
table.altrowblue-odd tr:nth-child(odd) { 
	background: #83C8F8;
}

/*********** class=altrowblue-even: Makes the rows alternate light blue/blue (odd/even) Use when there is an even amount of table headers(th) ***********/
 
table.altrowblue-even th {background: #1943AB;}
 
 
table.altrowblue-even tr:nth-child(even) { 
	background: #83C8F8;
}
 
table.altrowblue-even tr:nth-child(odd) { 
	background: #c3d8e5;
}

/*********** class=altrowgreen-odd: Makes the rows alternate light green/green (odd/even) Use when there is an odd amount of table headers(th) ***********/
 
table.altrowgreen-odd th {background: #114526;}
 
 
table.altrowgreen-odd tr:nth-child(even) { 
	background: #D4E5C3;
}
 
table.altrowgreen-odd tr:nth-child(odd) { 
	background: #93B993;
}
 
/*********** class=altrowgreen-even: Makes the rows alternate light green/green (odd/even) Use when there is an even amount of table headers(th) ***********/
table.altrowgreen-even th {background: #114526;}
 
 
table.altrowgreen-even tr:nth-child(odd) { 
	background: #D4E5C3;
}
 
table.altrowgreen-even tr:nth-child(even) { 
	background: #93B993;
}
 
/*** Tabs ***/
ul.tabs {
  display: -webkit-flex;
  display: flexbox;
  display: flex;
  align-items: stretch;
  /* Default */
  justify-content: space-around;
  width: 100%;
  background: #93B993;
  margin: 0;
  padding: 0;
  text-align: center;
}
ul.tabs li {
  display: block;
  flex: 0 1 auto;
  /* Default */
  list-style-type: none;
  background: #93B993;
  color: #0645ad;
  font-weight: bold;
  cursor: pointer;
}
ul.tabs li:hover {
  text-decoration: underline;
}
ul.tabs li.current {
  background: #85A261;
}
.tab-content {
  display: none;
  background: #FFFFFF;
}
.tab-content.current {
  display: inherit;
}

/***** Blue *****/
ul.tabsb {
  display: -webkit-flex;
  display: flexbox;
  display: flex;
  align-items: stretch;
  /* Default */
  justify-content: space-around;
  width: 100%;
  background: #4badf2;
  margin: 0;
  padding: 0;
  text-align: center;
}
ul.tabsb li {
  display: block;
  flex: 0 1 auto;
  /* Default */
  list-style-type: none;
  background: #4badf2;
  color: #FFFFFF;
  font-weight: bold;
  cursor: pointer;
}
ul.tabsb li:hover {
  text-decoration: underline;
}
ul.tabsb li.current {
  background: #0966A7;
}
.bluetab-content {
  display: none;
  background: #FFFFFF;
}
.bluetab-content.current {
  display: inherit;
}

/* 2 Column Flexbox */
.two-column-flex-wrapper {
     display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
}
.two-column-flex-wrapper .two-column-flex-item {
	flex: 1 0 200px;
     box-sizing: border-box;
	margin: auto;
}
@media (min-width: 1px) {
  .two-column-flex-wrapper .two-column-flex-item {
    min-width: calc(100% - 10px);
    min-width: calc(100% - 10px);
  }
@media (min-width: 1400px) {
  .two-column-flex-wrapper .two-column-flex-item {
    min-width: calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
}
}
 
/* TOC limit*/
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
    display: none;
}

/* Start: Job Page Special Armor */
.jpsa {
    width: 100%;
}

.jpsa-header {
    background-color: #e8d39a;
    border-collapse: collapse;
    border-width: 1px;
    border-style: solid;
    border-color: #bda86e;
    height: 25px;
}

.jpsa-af {
    background-color: ##FBF1D4;
    border-collapse: collapse;
    width: 100%;
    padding: 2px 2px 0px 2px;
    margin-bottom: 0px;
    text-align: center;
}

.jpsa-af th {
    background-color: #E8D39A;
    border-width: 1px;
    border-style: solid;
    border-color: #bda86e;
}

.jpsa-af td {
    background-color: #FBF1D4;
    border-width: 1px;
    border-style: solid;
    border-color: #bda86e;
}
.jpsa-other {
    background-color: #BDA86E;
    border-collapse: collapse;
    width: 100%;
    padding: 2px 2px 0px 2px;
    text-align: center;
}

.jpsa-other th {
    background-color: #E8D39A;
    border-width: 1px;
    border-style: solid;
    border-color: #bda86e;
}

.jpsa-other td {
    background-color: #FBF1D4;
    border-width: 1px;
    border-style: solid;
    border-color: #bda86e;
}

.jpsa-other tr td:nth-child(odd) { 
    width: 4%;
}

.jpsa-other tr td:nth-child(even) { 
    width: 21%;
}

/* End: Job Page Special Armor */

.stroked {
  color: white;
  -webkit-text-stroke: 1px black;
}

.outlined {
  color: white;
  text-shadow:
    -1px -1px 0 #000,
     0   -1px 0 #000,
     1px -1px 0 #000,
     1px  0   0 #000,
     1px  1px 0 #000,
     0    1px 0 #000,
    -1px  1px 0 #000,
    -1px  0   0 #000;
}