CSS and Javascript changes must comply with the wiki design rules.
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: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Clear the cache in Tools → Preferences
/**********************************************************************
*
* CSS placed here will be applied to all skins,
* but won't be applied to mobile view.
* Therefore, some rules need to be repeated in mobile.css.
*
**********************************************************************/
/* -- Hide page title on main page----------------------------------- */
body.page-Spirit_Mod_Wiki h1.firstHeading {
display:none;
}
/* ------------------------------------------------------------------ */
/* -- Add diff accent to make even smaller changes visible ---------- */
.diffchange-inline {
border: 1px #FF6666 dashed;
}
/* ------------------------------------------------------------------ */
/* -- Add faded horizontal line to level-3 and level-4 headers ------ */
h3:not(div#mw-head h3), h4 {
border-bottom: 1px #CDCDCD solid;
}
/* ------------------------------------------------------------------ */
/* -- SoundManager2Button icon (It looks useless) ------------------- */
a.sm2_button {
background-color: #3399CC;
}
a.sm2_button:hover, a.sm2_playing {
background-color: #006A9F;
}
/* ------------------------------------------------------------------ */
/* -- "terraria"-classed tables ------------------------------------- */
table.terraria {
margin: 1em 1em 1em 0;
background: #F9F9F9;
border: 1px #AFCFE2 solid;
padding: 0.2em;
-moz-border-radius: .7em;
-webkit-border-radius: .7em;
border-radius: .7em;
}
.terraria th, .terraria td {
padding: 0.2em;
}
.terraria th {
background: #E4F0F7;
color: black;
text-align: center;
}
.terraria caption {
font-weight: bold;
}
/* ------------------------------------------------------------------ */
/* -- Auto line separators for tables ------------------------------- */
table.lined td {
border-bottom:1px #AFCFE2 solid;
}
table.lined tr:last-of-type td {
border-bottom:0;
}
table tr.bottomline td {
border-bottom:1px #AFCFE2 solid;
}
table tr.topline td {
border-top:1px #AFCFE2 solid;
}
/* ------------------------------------------------------------------ */
/* -- Hack for using "border-collapse" and "border-radius" in the same table display */
/* -- by using one table nested within another ------------------------------------- */
table.outer {
white-space:nowrap;
}
table.inner {
border-collapse:collapse;
background:inherit;
width:100%;
}
table.inner th {
border:2px solid #FFF;
}
/* ------------------------------------------------------------------ */
/* -- fix 100% width table with border ------------------------------ */
table{
box-sizing: border-box;
}
/* ------------------------------------------------------------------ */
/* -- Other "plaincollapse" styling --------------------------------- */
/* Removes brackets from collapse/expand links for collapsible elements with "plaincollapse" class specified */
.plaincollapse .mw-collapsible-toggle {
color:rgba(0, 0, 0, 0.0);
}
/* Other "plaincollapse" styling */
.plaincollapse .mw-collapsible-toggle a,
.plaincollapse .mw-collapsible-toggle a:link,
.plaincollapse .mw-collapsible-toggle a:visited,
.plaincollapse .mw-collapsible-toggle a:hover {
font-weight:bold;
color:#11688F;
}
/* ------------------------------------------------------------------ */
/* -- Offset linked anchors ----------------------------------------- */
.anchor {
display: block;
height: 0;
position: relative;
top: -100px;
z-index:-9999;
visibility: hidden;
}
/* ------------------------------------------------------------------ */
/* -- helper for nowrap --------------------------------------------- */
.nowrap{
white-space:nowrap;
}
/* ------------------------------------------------------------------ */
/* -- note text ----------------------------------------------------- */
.note-text{
color: #666;
}
/* ------------------------------------------------------------------ */
/* -- "terraria" box style. ------------------------------------------*/
.terraria{
border: 1px #AFCFE2 solid;
padding: 8px 12px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
position: relative;
}
.terraria > .heading,
.terraria > .mw-collapsible-content > .heading {
background: #E4F0F7;
text-align: center;
font-weight: bold;
line-height: 2;
min-height: 1em;
margin: auto -4px;
padding: 0;
font-size: inherit;
margin-top: 8px;
}
.terraria > .heading:first-child,
.terraria > .mw-collapsible-content > .heading:first-child {
margin-top: auto;
}
.terraria > .heading + *,
.terraria > .mw-collapsible-content > .heading + * {
padding-top: 8px;
}
.terraria > .mw-collapsible-toggle {
position: absolute;
line-height: 1;
right: 12px;
top: 12px;
font-size: 12px;
}
.terraria > .mw-collapsible-toggle > .mw-collapsible-bracket {
display: none;
}
.terraria > .mw-collapsible-toggle:before {
content: "";
vertical-align: middle;
display: inline-block;
width: 4px;
height: 4px;
transform: rotate(45deg);
position: relative;
left: -3px;
border-left: 2px solid #0645ad;
border-top: 2px solid #0645ad;
border-right: 0;
border-bottom: 0;
top: 1px;
}
.terraria > .mw-collapsible-toggle.mw-collapsible-toggle-collapsed:before {
border-left: 0;
border-top: 0;
border-right: 2px solid #0645ad;
border-bottom: 2px solid #0645ad;
top: -2px;
}
/* ------------------------------------------------------------------ */
/* ".center" has width=100% rule, we don't want it, so use a different class name. */
.aligncenter,
.align-center {
text-align: center;
}
/* -- item link ----------------------------------------------------- */
.item-link{
white-space:nowrap;
display: inline-block;
}
.item-link > a,
.item-link > img{
display: inline-block;
line-height: 0.1;
vertical-align: middle;
margin-left: 2px;
}
.item-link > span{
display: inline-block;
margin-left: 3px;
text-align: left;
}
.item-link > a:first-child,
.item-link > img:first-child,
.item-link > span:first-child{
margin-left: auto;
}
.item-link.-w > span{
vertical-align: middle;
line-height: 1.25;
}
.item-link .note{
color: #666;
font-size: 85.7142%; /*12px/14px*/
}
.item-link div.note{ /*note2*/
font-size: 100%;
line-height: 1;
}
.item-link span.note{
margin-left: 3px;
}
.item-link.-w span.note:last-child{
display: block;
margin-left: auto;
line-height: 1;
}
.item-link.boldname >span span:first-child{
font-weight: bold;
}
.item-link.notecolor span.note{
color: inherit;
}
.item-link.note2color div.note{
color: inherit;
}
.item-link.block,
.item-link.block > span{
display: block;
}
.item-link.notesize span.note{
font-size: 100%;
}
.item-link.note2size div.note{
font-size: 100%;
font-size: 85.7142%; /*12px/14px*/
}
.item-link.alignleft{
text-align: left;
}
.item-link.aligncenter{
text-align: center;
}
.item-link.alignright{
text-align: right;
}
.item-link.textleft>span{
text-align: left;
}
.item-link.textcenter>span{
text-align: center;
}
.item-link.textright>span{
text-align: right;
}
/* ------------------------------------------------------------------ */
/* -- Infobox & infobox wrapper template style ---------------------- */
/* -------- some rules just kept for "old" template. -------------- */
.infobox td,
.infobox th {
vertical-align: top;
}
.infobox caption {
font-size: larger;
margin-left: inherit;
}
.infobox.bordered {
border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
border: 1px #AAA solid;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
border: 0;
}
/* styles for latest template */
.infobox {
border: 1px solid #aaa;
border-radius: 8px;
padding: 6px;
float: right;
font-size: 12px;
background-color: #f9f9f9;
margin: 0 0 0.5em 1em;
}
@media(max-width:450px) {
.infobox {
float: none;
}
}
.infobox.float-right {
float: right;
margin: 0 0 0.5em 1em;
}
.infobox.float-left {
float: left;
margin: 0 1em 0.5em 0;
}
.infobox.float-none {
float: none;
margin: 0 1em 0.5em 0;
}
.infobox table {
background-color: transparent;
width: 100%;
border-spacing: 0;
}
.infobox table th {
white-space: nowrap;
padding: 2px;
text-align: right;
border-right: 1px solid #f9f9f9;
width: 5em;
vertical-align: middle;
}
.infobox table td {
padding: 2px;
vertical-align: middle;
}
.infobox .title {
background-color: #E4F0F7;
color: #063B5E;
font-weight: bold;
text-align: center;
padding: 2px 0;
}
.infobox > .title {
font-size: 15px;
padding: 6px 3px;
line-height: 1.2;
}
.infobox > .title > span {
display: block;
font-size: 12px;
color: slategray;
font-style: italic;
}
.infobox > .title > span::before {
content: "(";
font-style: normal;
}
.infobox > .title > span::after {
content: ")";
font-style: normal;
}
.infobox .content-section {
padding: 6px 3px;
}
.infobox .variant {
background-color: #E4F0F7;
color: #063B5E;
font-weight: bold;
text-align: center;
font-size: 12px;
padding: 4px 0;
line-height: 1.2;
}
.infobox .images {
position: relative;
padding: 6px 0;
min-height: 40px;
text-align: center;
display: -webkit-box;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
/* direction=column, for IE11 */
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-moz-box-direction: normal;
-moz-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
}
.infobox .images > img {
margin-top: 0.5em;
}
.infobox ul {
list-style: none;
margin: auto;
text-align: center;
}
.infobox .statistics .title {
margin-bottom: 6px;
}
.infobox .statistics table th,
.infobox .statistics table td {
padding-top: 3px;
padding-bottom: 3px;
}
.infobox .stat td > small {
font-size: 10.5px;
font-weight: bold;
}
.infobox .stat td > small::before {
content: "(";
}
.infobox .stat td > small::after {
content: ")";
}
.infobox tr.buff th,
.infobox tr.buff td {
background-color: #E4F0F7;
border: 1px solid #f9f9f9;
}
.infobox tr.buff th {
border-left: 0;
}
.infobox tr.buff td {
border-right: 0;
padding-left: 3px;
}
.infobox tr.buff td b {
font-weight: bold;
white-space: nowrap;
}
.infobox .section.ids {
margin-top: 3px;
border-top: 1px solid #aaa;
text-align: center;
font-size: 10.5px;
background-color: #E4F0F7;
color: #063B5E;
}
.infobox .section.ids li {
padding: 2px 0;
border-bottom: 2px solid #f9f9f9;
margin: 0;
font-weight: bold;
}
.infobox .section.ids li:last-child {
border-bottom: 0;
}
.infobox .variant {
margin-bottom: 2px;
}
.infobox .drops td:first-child {
text-align: left;
}
.infobox .drops td:last-child {
text-align: right;
}
.infobox .drops th:first-child {
text-align: left;
border-right: 0;
}
.infobox .section.drops {
margin-top: 6px;
margin-bottom: 6px;
}
.infobox .drops.money {
margin: 2px auto;
}
.infobox .drops.money table th {
width: 1px;
}
.infobox .imageother {
text-align: center;
padding-top: 8px;
border-top: 1px solid #aaa;
}
.infobox .drops.items {
margin-bottom: 1px;
}
.infobox .drops.items li {
border-bottom: 1px #AFCFE2 solid;
padding: 3px 0;
margin-bottom: auto;
display: -webkit-box;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-direction: normal;
-webkit-box-orient: horizontal;
-moz-box-direction: normal;
-moz-box-orient: horizontal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
}
.infobox .drops.items li:first-child {
background-color: #E4F0F7;
color: #063B5E;
padding: 2px 3px 0;
}
.infobox .drops.items li:last-child {
border-bottom: none;
}
.infobox .drops.items li > div {
display: block;
}
.infobox .drops.items li > div:first-child {
text-align: left;
}
.infobox .drops.items li > div:last-child {
text-align: right;
}
.infobox .drops.items li.caption {
border-top: 2px #AFCFE2 solid;
margin-top: 2px;
line-height: 1;
text-align: center;
color: #063B5E;
font-size: 10.5px;
background: #f0f7fb;
padding-top: 5px;
display: block;
}
.infobox .drops.items li.caption.group_end {
padding-bottom: 5px;
}
.infobox .drops.items li.group_end {
border-bottom: 5px #AFCFE2 solid;
position: relative;
}
.infobox .drops.items li.group_end::after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: -4px;
width: 100%;
height: 2px;
background-color: #f9f9f9;
}
/* for item infobox */
.item.infobox {
width: 21em;
}
.item.infobox .images .auto,
.infobox.item .images .stack {
position: absolute;
right: 3px;
}
.item.infobox .images .auto {
top: 3px;
}
.item.infobox .images .stack {
bottom: 3px;
}
.item.infobox .images ul.inline li {
display: inline-block;
padding: 0 8px 0 9px;
margin: 2px auto;
position: relative;
vertical-align: middle;
}
.item.infobox .images ul.inline li::before {
content: "";
display: block;
width: 1px;
background: #ccc;
height: 80%;
position: absolute;
left: 0;
top: 10%;
}
.item.infobox .images ul.inline li:first-child::before {
display: none;
}
.item.infobox .images ul.block li {
display: block;
padding: 13px 0 0 0;
margin: auto;
position: relative;
}
.item.infobox .images ul.block li::before {
content: "";
display: block;
height: 1px;
background: #ccc;
width: 80%;
position: absolute;
left: 10%;
top: 6px;
}
.item.infobox .images ul.block li:first-child {
padding-top: 0;
}
.item.infobox .images ul.block li:first-child::before {
display: none;
}
.item.infobox ul.toolpower {
padding: 6px 0;
cursor: pointer;
}
.item.infobox ul.toolpower li {
display: inline-block;
padding: 0 0.5em;
}
/* for npc infobox */
.npc.infobox {
width: 23em;
}
.npc.infobox .statistics table th {
width: 6em;
}
/* for version infobox */
.infobox.versionbox {
font-size: 89%;
width: 21em;
-moz-border-radius: .7em;
-webkit-border-radius: .7em;
border-radius: .7em;
}
.versionbox-title {
font-size: 120%;
padding: 0.5em;
}
.versionbox-image {
text-align: center;
}
.versionbox-label { width: 40%; }
.versionbox-data { width: 60%; }
.versionbox-title,
.versionbox-caption,
.versionbox-heading,
.version-history,
th.versionbox-prev,
th.versionbox-curr,
th.versionbox-next {
background-color: #E4F0F7;
color: #063B5E;
padding: 0;
}
.theme-fandomdesktop-dark .versionbox-title,
.theme-fandomdesktop-dark .versionbox-caption,
.theme-fandomdesktop-dark .versionbox-heading,
.theme-fandomdesktop-dark .version-history,
.theme-fandomdesktop-dark th.versionbox-prev,
.theme-fandomdesktop-dark th.versionbox-curr,
.theme-fandomdesktop-dark th.versionbox-next {
background-color: var(--theme-page-background-color--secondary);
color: #e7f4fd;
}
td.versionbox-prev,
td.versionbox-curr,
td.versionbox-next {
text-align: center;
width: 33%;
}
/* infobox wrapper */
.infobox-wrapper.float-right {
float: right;
margin-left: 0.5em;
}
.infobox-wrapper.float-left {
float: left;
margin-right: 0.5em;
}
.infobox-wrapper.float-none {
float: none;
}
@media(max-width:450px) {
.infobox-wrapper.float-right {
float: none;
margin-left: auto;
}
.infobox-wrapper.float-left {
float: none;
margin-right: auto;
}
}
.infobox-wrapper.float-right.direction-row .infobox,
.infobox-wrapper.float-right.direction-row-reverse .infobox,
.infobox-wrapper.float-right.direction-row .infobox.float-left,
.infobox-wrapper.float-right.direction-row-reverse .infobox.float-left,
.infobox-wrapper.float-right.direction-row .infobox.float-right,
.infobox-wrapper.float-right.direction-row-reverse .infobox.float-right,
.infobox-wrapper.float-right.direction-row .infobox.float-none,
.infobox-wrapper.float-right.direction-row-reverse .infobox.float-none {
float: none;
margin: 0 0 0.5em 0.5em;
}
.infobox-wrapper.float-left.direction-row .infobox,
.infobox-wrapper.float-left.direction-row-reverse .infobox,
.infobox-wrapper.float-left.direction-row .infobox.float-left,
.infobox-wrapper.float-left.direction-row-reverse .infobox.float-left,
.infobox-wrapper.float-left.direction-row .infobox.float-none,
.infobox-wrapper.float-left.direction-row-reverse .infobox.float-none,
.infobox-wrapper.float-left.direction-row .infobox.float-right,
.infobox-wrapper.float-left.direction-row-reverse .infobox.float-right,
.infobox-wrapper.float-none.direction-row .infobox,
.infobox-wrapper.float-none.direction-row-reverse .infobox,
.infobox-wrapper.float-none.direction-row .infobox.float-left,
.infobox-wrapper.float-none.direction-row-reverse .infobox.float-left,
.infobox-wrapper.float-none.direction-row .infobox.float-none,
.infobox-wrapper.float-none.direction-row-reverse .infobox.float-none,
.infobox-wrapper.float-none.direction-row .infobox.float-right,
.infobox-wrapper.float-none.direction-row-reverse .infobox.float-right {
float: none;
margin: 0 0.5em 0.5em 0;
}
.infobox-wrapper.float-left.direction-column .infobox,
.infobox-wrapper.float-left.direction-column-reverse .infobox,
.infobox-wrapper.float-left.direction-column .infobox.float-left,
.infobox-wrapper.float-left.direction-column-reverse .infobox.float-left,
.infobox-wrapper.float-left.direction-column .infobox.float-none,
.infobox-wrapper.float-left.direction-column-reverse .infobox.float-none,
.infobox-wrapper.float-left.direction-column .infobox.float-right,
.infobox-wrapper.float-left.direction-column-reverse .infobox.float-right {
float: left;
margin: 0 0.5em 0.5em 0;
}
.infobox-wrapper.float-none.direction-column .infobox,
.infobox-wrapper.float-none.direction-column-reverse .infobox,
.infobox-wrapper.float-none.direction-column .infobox.float-right,
.infobox-wrapper.float-none.direction-column-reverse .infobox.float-right {
float: right;
margin: 0 0 0.5em 0.5em;
}
.infobox-wrapper.float-none.direction-column .infobox.float-left,
.infobox-wrapper.float-none.direction-column-reverse .infobox.float-left,
.infobox-wrapper.float-none.direction-column .infobox.float-none,
.infobox-wrapper.float-none.direction-column-reverse .infobox.float-none {
float: left;
margin: 0 0.5em 0.5em 0;
}
.infobox-wrapper.float-right.direction-column .infobox,
.infobox-wrapper.float-right.direction-column-reverse .infobox,
.infobox-wrapper.float-right.direction-column .infobox.float-left,
.infobox-wrapper.float-right.direction-column-reverse .infobox.float-left,
.infobox-wrapper.float-right.direction-column .infobox.float-none,
.infobox-wrapper.float-right.direction-column-reverse .infobox.float-none,
.infobox-wrapper.float-right.direction-column .infobox.float-right,
.infobox-wrapper.float-right.direction-column-reverse .infobox.float-right {
float: right;
margin: 0 0 0.5em 0.5em;
}
/* ------------------------------------------------------------------ */
/* -- drops-infobox tabs -------------------------------------------- */
/* Template:npc infobox */
.drop.infobox .headerSort * {
background-image: unset;
}
.drop.infobox table {
margin-top: 6px;
margin-bottom: 6px;
}
.drop.infobox td {
border-top: 1px solid #AFCFE2;
}
.drop.infobox th:first-child, .drop.infobox td:first-child {
text-align: left;
width: 0;
}
.drop.infobox td:first-child s {
display: none;
}
.drop.infobox th:nth-child(2), .drop.infobox td:nth-child(2) {
text-align: center;
width: 0;
min-width: 3em;
}
.drop.infobox th:last-child, .drop.infobox td:last-child {
text-align: right;
width: 0;
min-width: 4em;
}
.drop.infobox th {
background-color: #E4F0F7;
color: #063B5E;
border-bottom: 1px #AFCFE2 solid;
border-right: 0;
padding: 2px 5px;
}
.drop.infobox th:first-child.headerSort {
padding-left: 21px;
background-position-x: left;
}
.drop.infobox th:nth-child(2).headerSort {
padding-left: 21px;
text-align: left;
background-position-x: left;
}
.drop.infobox th:last-child.headerSort {
padding-right: 21px;
}
.drop.infobox .entity-img img {
width: auto;
height: auto;
max-width: 90px;
max-height: 90px;
}
.drop.infobox .nodrop-note {
text-align: center;
padding-top: 6px;
}
.drop.infobox > .mw-collapsible-toggle {
background-color: unset;
margin-right: 3px;
}
.drop.infobox > .mw-collapsible-toggle:before {
content: "";
vertical-align: middle;
display: inline-block;
width: 4px;
height: 4px;
transform: rotate(45deg);
position: relative;
left: -3px;
border-left: 2px solid #0645ad;
border-top: 2px solid #0645ad;
border-right: 0;
border-bottom: 0;
top: 1px;
}
.drop.infobox > .mw-collapsible-toggle.mw-collapsible-toggle-collapsed:before {
border-left: 0;
border-top: 0;
border-right: 2px solid #0645ad;
border-bottom: 2px solid #0645ad;
top: -2px;
}
.drop.infobox > .mw-collapsible-toggle:after {
content: "";
}
.infobox .modetabs{
border-bottom: 1px solid #aaa;
display: flex;
padding: 0 4px;
margin: 6px -6px;
}
.infobox .modetabs .tab{
margin: 0 2px -1px;
flex: 1 1 33.33333333%;
border: 1px solid #aaa;
border-radius: 3px 3px 0 0;
background: #eee;
padding: 4px 0 3px;
text-align: center;
font-weight: bold;
cursor: pointer;
transition: all 0.2s;
}
.infobox .modetabs .tab.current{
background: #f9f9f9;
border-bottom: 1px solid #f9f9f9;
transition: all 0.2s;
}
.infobox.c-normal .m-expert,
.infobox.c-normal .m-master,
.infobox.c-normal .m-expert-master{
display: none !important;
}
.infobox.c-expert .m-normal,
.infobox.c-expert .m-master,
.infobox.c-expert .m-normal-master{
display: none !important;
}
.infobox.c-master .m-normal,
.infobox.c-master .m-expert,
.infobox.c-master .m-normal-expert{
display: none !important;
}
.infobox.expertonly .m-normal,
.infobox .expertonly .m-normal{
display: none !important;
}
.infobox.masteronly .m-normal,
.infobox.masteronly .m-expert{
display: none !important;
}
/* ------------------------------------------------------------------ */
/* -- multi-column list --------------------------------------------- */
/* correct webkit/chrome uneven margin on the first column*/
.responsive-columns ul, .responsive-columns ol{
margin-top:0px;
}
.responsive-columns ul li:first-child, .responsive-columns ol li:first-child
{
margin-top:0px;
}
/* ------------------------------------------------------------------ */
/* ------------------------------------------------------------------ */
/* itemlist */
.itemlist > ul {
list-style: none;
margin: 0 0.25em -0.25em 0;
}
.itemlist > ul > li {
width: 10em;
/* default width */
margin: auto 1em 0.5em auto;
display: inline-block;
}
/* dot list */
.dotlist{
margin: auto;
}
.dotlist > .title{
font-weight: bold;
}
.dotlist.nobold > .title{
font-weight: normal;
}
.dotlist > .title::after{
content: " ";
}
.dotlist > ul{
display: inline;
list-style: none;
}
.dotlist > ul > li{
display: inline;
}
.dotlist > ul > li::after{
content: " • ";
}
.dotlist > ul > li:last-child::after{
display: none;
}
.dotlist.l > .title{
margin-right: 5px;
}
.dotlist.l > ul > li::after{
margin-left: 3px;
margin-right: 3px;
}
.dotlist.xl > .title{
margin-right: 10px;
}
.dotlist.xl > ul > li::after{
margin-left: 6px;
margin-right: 6px;
}
.dotlist.xxl > .title{
margin-right: 15px;
}
.dotlist.xxl > ul > li::after{
margin-left: 9px;
margin-right: 9px;
}
.dotlist.xxxl > .title{
margin-right: 20px;
}
.dotlist.xxxl > ul > li::after{
margin-left: 12px;
margin-right: 12px;
}
.dotlist.xxxxl > .title{
margin-right: 25px;
}
.dotlist.xxxxl > ul > li::after{
margin-left: 15px;
margin-right: 15px;
}
/* ------------------------------------------------------------------ */
/* ======================== Extensions ===============================*/
/* -- This is the style for the tabs of the tabber extension. ------- */
body ul.tabbernav li a,
body ul.tabbernav li a:link,
body ul.tabbernav li a:visited,
body ul.tabbernav li a:hover {
border-radius: .5em .5em 0 0;
}
/* ------------------------------------------------------------------ */
.box {
border: 1px solid #0288D1;
border-radius: 5px;
padding: 7px;
margin: 0 1px 2px; /* since there is margin collapsing so can't use margin: 1px; */
}
.fandom-community-header__background::before {
background: none;
}
.theme-fandomdesktop-dark #mf-wikiheader {
color: #b3dcdc;
}
#mf-wikiheader {
color: #033251;
text-align: center;
display:-webkit-box;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flexbox;
display:flex;
-ms-flex-wrap:wrap;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-box-align:center;
-ms-flex-align:center;
-webkit-align-items:center;
-moz-align-items:center;
align-items:center;
-webkit-align-content:space-between;
-ms-flex-line-pack:space-between;
align-content:space-between;
}
#mf-wikiheader > div:first-child{
-webkit-flex-basis:480px;
-moz-flex-basis:480px;
-ms-flex-preferred-size:480px;
flex-basis:480px;
-webkit-box-flex:1;
-webkit-flex-grow:1;
-moz-flex-grow:1;
-ms-flex-positive:1;
flex-grow:1;
-webkit-flex-shrink:1;
-moz-flex-shrink:1;
-ms-flex-negative:1;
flex-shrink:1;
}
#mf-wikiheader > div:first-child > span:first-child {font-size: 24px;}
#mf-wikiheader > .ext-info {
-webkit-flex-basis:1000px;
-moz-flex-basis:1000px;
-ms-flex-preferred-size:1000px;
flex-basis:1000px;
-webkit-box-flex:3;
-webkit-flex-grow:3;
-moz-flex-grow:3;
-ms-flex-positive:3;
flex-grow:3;
-webkit-flex-shrink:99;
-moz-flex-shrink:99;
-ms-flex-negative:99;
flex-shrink:99;
margin: 0.75em 0;
}
#mf-wikiheader .links {
display:-webkit-box;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flexbox;
display:flex;
-ms-flex-wrap:wrap;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-box-align:center;
-ms-flex-align:center;
-webkit-align-items:center;
-moz-align-items:center;
align-items:center;
-webkit-box-pack:center;
-ms-flex-pack:center;
-webkit-justify-content:center;
-moz-justify-content:center;
justify-content:center;
margin-bottom: 0.3em;
}
#mf-wikiheader .links > * {
margin: 0 1.5em;
-webkit-box-flex:0;
-webkit-flex-grow:0;
-moz-flex-grow:0;
-ms-flex-positive:0;
flex-grow:0;
-webkit-flex-shrink:1;
-moz-flex-shrink:1;
-ms-flex-negative:1;
flex-shrink:1;
-webkit-flex-basis:auto;
-moz-flex-basis:auto;
-ms-flex-preferred-size:auto;
flex-basis:auto;
}
#mf-enemies .content {max-height: 390px;}
@media(max-width: 413px){
#mf-enemies .content {max-height: 3900px;}
}
.footer {text-align: center; line-height: 1;}
.footer {text-align: center; margin: 0.75em 2px 0;}
.footer > div {
border: 1px solid #0288D1;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 0.5em;
max-width: 25em;
margin: auto;
}
.footer > div span {display: inline-block;}
/* ========================================================================== */
/* === Desktop view for mobile screen. mobile.css doesn't need this part. === */
/* ========================================================================== */
@media(max-width: 720px){
body #content div#atflb, body #content div#btflb{
width: 100% !important;
min-width: 300px !important;
}
html body{
margin-top: 0 !important;
}
div#netbar{
overflow: hidden;
height: auto;
position: static;
width: 100%;
}
#netbar .netbar-flex{
flex-wrap: wrap;
}
#mw-page-base, #mw-head-base{
display: none;
}
div#pageWrapper{
position: relative;
padding-top: 0.5em;
margin-right: auto;
margin: auto 5px;
}
div#content{
margin: 3em auto auto;
}
#mw-navigation{
position: absolute;
left: 0; top: 0.5em;
width: 100%;
height: 3em;
}
div#mw-head {
position: relative !important;
height: 100%;
margin-top: auto;
font-size: 12px;
line-height: 1;
}
div#mw-head div.vectorTabs{
float: none;
display: block;
position: relative;
background: none;
height: auto;
line-height: 1;
}
div#mw-head div.vectorTabs span{
height: auto;
}
div#mw-head div.vectorTabs a{
float: none;
padding: 0.25em;
height: auto;
font-size: 1em;
}
div#mw-head div.vectorTabs ul,div#mw-head div.vectorTabs li{
line-height: inherit;
float: none;
background: none;
height: auto;
}
div#mw-head div.vectorTabs ul{
display:-webkit-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;
-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;
-moz-align-items:center;align-items:center;
}
div#mw-head div.vectorTabs ul li{
display: block;
margin-right: 0.5em;
}
div#mw-head div.vectorTabs ul li:last-child{
margin-right: 0;
}
div#mw-head div.vectorMenu{
float: none;
display: block;
position: relative;
background: none;
line-height: 1;
}
div#mw-head div.vectorMenu h3{
height: auto;
float: none;
background: none;
padding: 0 !important;
margin: 0;
}
div#mw-head div.vectorMenu h3 span{
padding: 0.25em;
margin: 0;
font-size: 1em;
}
div#mw-head div.vectorMenu h3 a{
display: none;
}
div#p-namespaces,div#p-views,div#p-variants,div#p-cactions{
top:0;
float: none;
}
div#mw-head div.emptyPortlet{
display: none;
}
div#mw-head div.vectorMenu div.menu{
top: 100%;
margin-top: 0.25em;
border: 1px solid #a2a9b1;
}
div#mw-head div.vectorMenu div.menu a{
font-size: 1em;
}
div#left-navigation{
float: none;
margin: auto;
position: absolute;
left: 5px;
margin-left: -0.25em;
top: auto;
bottom: 0.25em;
display:-webkit-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;
-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;
-moz-align-items:center;align-items:center;
}
div#right-navigation{
float: none;
margin: auto;
position: absolute;
right: 5px;
margin-right: -0.25em;
top: auto;
bottom: 0.25em;
text-align: right;
display:-webkit-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;
-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;
-moz-align-items:center;align-items:center;
}
div#mw-head div#left-navigation div.vectorMenu,
div#mw-head div#left-navigation div.vectorTabs{
margin-right: 0.5em;
}
div#mw-head div#left-navigation div.vectorMenu:last-child,
div#mw-head div#left-navigation div.vectorTabs:last-child{
margin-right: 0;
}
div#mw-head div#right-navigation div.vectorMenu,
div#mw-head div#right-navigation div.vectorTabs{
margin-left: 0.5em;
}
div#mw-head div#right-navigation div.vectorMenu:first-child,
div#mw-head div#right-navigation div.vectorTabs:first-child{
margin-left: 0;
}
/* right offset */
#p-cactions div.menu{
left: auto;
right: 0;
}
div#mw-head div.vectorTabs li.mw-watchlink{
width: 18px;
height: 18px;
overflow: hidden;
}
div#mw-head div.vectorTabs li.mw-watchlink a{
width: 18px;
height: 18px;
padding: 30px 0 0 0;
background-position: center 1px;
}
/* search */
div#p-search{
float: none;
width: auto;
height: 23px;
position: absolute;
top: auto;
right: 0.25em;
margin: auto;
bottom: 22px;
}
div#p-search h3{
display: none;
}
div#p-search form{
margin: auto;
width: auto;
height: 100%;
display:-webkit-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;
-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;
-moz-align-items:center;align-items:center;
}
div#simpleSearch{
width: auto;
height: auto;
margin: auto;
border: none;
background: none;
}
div#p-search div#simpleSearch #searchInput{
width: 20em;
padding: 0.25em;
box-sizing: border-box;
background-color: #fff;
font-size: 12px;
border: 1px solid #aaa;
border-radius: 1px;
}
div#mw-navigation div#mw-panel{
position: absolute !important;
top: 2em;
left: 0;
padding: 0;
width: 100%;
display: block;
font-size: inherit;
background: rgba(0,0,0,0.9);
overflow: visible;
z-index: 999;
}
div#mw-navigation div#mw-panel .portal{
width: auto;
margin: 0.5em;
margin-bottom: 1em;
padding: 0;
display: none;
}
div#mw-navigation div#mw-panel.on .portal{
display: block;
}
div#mw-navigation div#mw-panel .portal h3{
display: block !important;
padding: 0 !important;
background: none !important;
}
div#mw-navigation div#mw-panel .portal div.body{
display: block !important;
padding: 0 !important;
margin: 0 !important;
overflow: hidden;
}
div#mw-navigation div#mw-panel .portal div.body ul{
margin-left: -0.5em;
}
div#mw-navigation div#mw-panel .portal div.body li{
display: inline-block !important;
padding: 0.5em 1.5em !important;
}
.socialSidebar{
overflow: hidden;
text-align: center;
width: auto;
margin-top: 2em;
}
div#mw-navigation div#mw-panel .resize-sensor{
position: absolute !important;
top: -2em !important;
left: 85px !important;
right: auto !important;
bottom: auto !important;
visibility: visible !important;
margin-top: 0 !important;
width: 24px !important;
height: 24px !important;
z-index: 999 !important;
display: block;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiB3aWR0aD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggY2xhc3M9Imhlcm9pY29uLXVpIiBzdHJva2U9IndoaXRlIiBmaWxsPSJ3aGl0ZSIgZD0iTTQgNWgxNmExIDEgMCAwIDEgMCAySDRhMSAxIDAgMSAxIDAtMnptMCA2aDE2YTEgMSAwIDAgMSAwIDJINGExIDEgMCAwIDEgMC0yem0wIDZoMTZhMSAxIDAgMCAxIDAgMkg0YTEgMSAwIDAgMSAwLTJ6Ii8+PC9zdmc+);
background-size: 100% 100%;
background-position: center center;
background-repeat: no-repeat;
cursor: pointer;
}
}/*end media max-width:720px*/
@media(max-width: 500px){
div#pageWrapper{
margin: auto;
}
#pageWrapper div#content{
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
padding: 5px;
}
div#p-search div#simpleSearch #searchInput{
width: 14em;
}
div#p-sharing{
display: none !important;
}
}/*end media max-width:500px*/
@media(max-width: 399px){
div#p-search div#simpleSearch{
max-width: 500px;
}
div#p-search,
div#p-search div#simpleSearch,
div#p-search div#simpleSearch #searchInput{
width: 100%;
}
}/*end media max-width:399px*/
/* ========================================================================== */
/* End of desktop view for mobile screen. mobile.css doesn't need this part. */
/* ========================================================================== */
/* ========================================================================== */
/* mobile.css doesn't need this part. */
/* ========================================================================== */
/* Forces the page to have a vertical scroll bar to avoid width jitter caused by page content changes. */
body{
overflow-y: scroll;
}