MediaWiki:Common.css

From Cassette Beasts

Note: After saving, 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: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
a.external {
  color: #7629db !important;
}

#footer-bottom a {
  color: #d087f8 !important;
}

.mw-portlet h3 {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif !important;
  font-size: 1.5em !important;
}

#mw-content-container {
  background-image: url("https://www.cassettebeasts.com/wp-content/uploads/2023/04/background-number-infinity-blurred.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.infobox {
  float: right;
  margin: 0 0 1em 1em;
  width: 340px;
  box-shadow: 10px 10px;
}

@media only screen and (max-width: 520px) {
	.infobox {
		float: none;
		width: calc(100% - 2em);
		margin: 1em;
	}
}
.infobox-head {
  background: url("/images/2/2b/Cornercut.png") no-repeat top left #ab75e8;
  color: #fff;
  font-weight: bold;
  padding: 0.5em 1em 0 1em;
}
.infobox-head a:link, .infobox-head a:hover, .infobox-head a:visited, .infobox-head a:active {
	color: #fff;
}
.infobox-head a:hover {
	text-decoration: underline;
}
.infobox-title {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.5em;
  text-align: center;
}
.infobox-subtitle {
  text-align: center;
}

.infobox-image {
  margin: 0;
  background: #fff;
  padding: 15px;
  border: solid #ab75e8;
  border-width: 0 10px 10px 10px;
}
.infobox-image img {
  image-rendering: pixelated;
}

.infobox-data {
  margin: 0;
  border: solid #ab75e8;
  border-width: 0 10px 10px 10px;
}
.infobox-data table {
  width: 100%;
  margin: 0;
}
.infobox-data table {
  background: #ab75e8;
  color: #fff;
  margin-bottom: 0;
}
.infobox-data table tr {
  padding: 0;
  margin: 0;
  border: 0;
}
.infobox-data table th {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.25em;
  width: 30%;
  color: #fff;
  padding-left: 1em;
  padding-right: 1em;
}
.infobox-data table td {
  text-align: center;
  background: #fff;
  color: #000;
  padding-left: 1em !important;
  padding-right: 1em;
}

.wikitable {
  margin-bottom: 1em;
}
.wikitable .rowheada, .wikitable .rowheadb {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.25em;
  text-align: center;
  min-width: 120px;
  color: #fff;
  font-weight: bold;
}
.wikitable th {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.25em;
  font-weight: bold;
}
.wikitable .rowheada {
  background: #ab75e8;
}
.wikitable .rowheadb {
  background: #3fbb9f;
}
.wikitable td, .wikitable th {
  padding-left: 1em !important;
  padding-right: 1em !important;
}

.species_nav {
  width: 100%;
}
.species_nav td {
  padding-left: 1em;
  padding-right: 1em;
  text-align: center;
}
.species_nav td:first-child {
  text-align: left;
}
.species_nav td:last-child {
  text-align: right;
}

.elemental_type {
	display: inline-block;
	padding-left: 1.45em;
	text-align: center;
	width: 3.55em;
	/*border-radius: 0 5px 5px 0;*/
	color: #fff;
	font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
	font-size: 1em;
	font-weight: bold;
	line-height: 1.25em;
	background-repeat: no-repeat;
	background-position: calc(0% - 0.2em) center;
	background-size: 1.65em;
	white-space: nowrap;
}
table.type_chart td.elemental_type {
	padding: 0 46px 0 4px !important;
	text-align: left !important;
	width: default !important;
	font-size: 1.25em;
	background-position: right center;
	background-size: 42px;
	height: 42px;
	line-height: 42px;
}
.elemental_type a:link, .elemental_type a:hover, .elemental_type a:visited, .elemental_type a:active {
	color: #fff;
}
.elemental_type a:hover {
	text-decoration: underline;
}
.Typeless_type {
	background-image: url("/images/4/42/Typeless.png");
	background-color: #f8f9fa;
	color: #000 !important;
}
.elemental_type.Typeless_type a {
	color: #000 !important;
}
.Air_type {
	background-image: url("/images/5/5f/Air.png");
	background-color: #206454;
}
.Astral_type {
	background-image: url("images/2/26/Astral.png");
	background-color: #373f67;
}
.Beast_type {
	background-image: url("/images/1/17/Beast.png");
	background-color: #b0aa82;
}
.Earth_type {
	background-image: url("/images/1/1e/Earth.png");
	background-color: #6f3945;
}
.Fire_type {
	background-image: url("/images/3/30/Fire.png");
	background-color: #d04d2f;
}
.Glass_type {
	background-image: url("/images/1/15/Glass.png");
	background-color: #9dacc3;
}
.Glitter_type {
	background-image: url("/images/6/63/Glitter.png");
	background-color: #c355c1;
}
.Ice_type {
	background-image: url("/images/7/77/Ice.png");
	background-color: #3471b2;
}
.Lightning_type {
	background-image: url("/images/8/86/Lightning.png");
	background-color: #d98a30;
}
.Metal_type {
	background-image: url("/images/e/e1/Metal.png");
	background-color: #78668a;
}
.Plant_type {
	background-image: url("/images/d/d1/Plant.png");
	background-color: #308245;
}
.Plastic_type {
	background-image: url("/images/0/0b/Plastic.png");
	background-color: #b12031;
}
.Poison_type {
	background-image: url("/images/0/05/Poison.png");
	background-color: #7629db;
}
.Water_type {
	background-image: url("/images/9/9d/Water.png");
	background-color: #4648ce;
}

.type_chart_attackers, .type_chart_defenders, .type_chart_deadzone {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.25em;
  text-align: center;
  color: #fff;
  font-weight: bold;
}
.type_chart_defenders {
  background: #ab75e8;
}
.type_chart_attackers {
  background: #3fbb9f;
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 1em !important;
  overflow: hidden;
}
.type_chart_attackers div {
	transform: rotate(-90deg);
	transform-origin: center;
	white-space: nowrap;
}
.type_chart_deadzone {
  background: #ab75e8;
}
.type_chart .reaction_UNKNOWN, .type_chart .reaction_TRANSMUTATION {
	background: #f1c255;
}
.type_chart .reaction_POSITIVE {
	background: #3fbb9f;
}
.type_chart .reaction_NEGATIVE {
	background: #b70042;
}
.type_chart .reaction_ {
	background: #2b1c39;
}
table.type_chart td.reaction_cell {
	padding: 0;
}
.type_chart .tooltip {
	color: #fff;
}
.type_chart .tooltip a:link, .type_chart .tooltip a:hover, .type_chart .tooltip a:visited, .type_chart .tooltip a:active {
	color: #fff;
	font-weight: bold;
}
.type_chart .tooltip a:hover {
	text-decoration: underline;
}
.reaction_status_result {
	white-space: nowrap;
	list-style: none;
}
.reaction_status_hint {
  font-family: 'Neu5Land', 'Segoe UI', 'Lato', 'Liberation Sans', 'Noto Sans', 'Helvetica Neue', 'Helvetica', sans-serif;
  font-size: 1.25em;
  font-weight: bold;
}
.reaction_font_color_UNKNOWN, .reaction_font_color_TRANSMUTATION {
	color: #f1c255;
}
.reaction_font_color_NEGATIVE {
	color: #b70042;
}
.reaction_font_color_POSITIVE {
	color: #3fbb9f;
}

.tooltip {
	visibility: hidden;
	position: absolute;
	z-index: 1;
	opacity: 0;
	transition: opacity 0.2s;
	background-color: white;
	box-shadow: 10px 10px #000;
	padding: 0.5em 2em;
}
.tooltip ul {
	margin-bottom: 1em;
}
.tooltip_container:hover .tooltip {
	visibility: visible;
	opacity: 1;
}

.main_page_about_box .ev_right {
	margin-top: 1em;
	margin-left: 1em;
}

img.pixelart, .pixelart img {
    image-rendering: pixelated;
}

.main_page_link_icons {
	font-family: 'Neu5Land','Segoe UI','Lato','Liberation Sans','Noto Sans','Helvetica Neue','Helvetica',sans-serif;
	font-size: 2em;
	text-align: center;
}