Mabinogi World Wiki is brought to you by Coty C., 808idiotz, our other patrons, and contributors like you!!
Want to make the wiki better? Contribute towards getting larger projects done on our Patreon!

MediaWiki:Common.css

From Mabinogi World Wiki

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: Press Ctrl-F5.
/* make the Cite extension list of references look smaller and highlight clicked reference in blue */
ol.references { font-size: 90%; }
ol.references > li:target { background-color: #ddeeff; }
sup.reference:target { background-color: #ddeeff; }

#jump-to-nav {
    display: none;
}

.center, .center * {
    width: auto;
    margin-left: auto;
    margin-right: auto;
}

.off {
    display: none;
}

.tabdiv > ul {
   line-height: 1.5em;
   list-style-type: none;
   margin: 0;
   padding-bottom: 4px;
}

.tabdiv > ul a {
   background-color: #e7f3e8;
   border: 1px solid #A0C6E3;
   margin-right: 0.5em;
   padding: 2px 0.75em;
   text-decoration: none;
}

.tabdiv > ul li {
   display: inline;
}

.tabdiv > ul li.active a {
   background-color: #A0C6E3;
   border: 1px solid #A0C6E3;
}

.tabdiv > div {
   border: 1px solid #A0C6E3;
   padding: 1em;
   margin-top: -0.3em;
}

/* Standard Navigationsleisten, aka box hiding thingy from .de.  Documentation at [[Wikipedia:NavFrame]]. */
 
div.Boxmerge,
div.NavFrame {
        margin: 0px;
        padding: 4px;
        border: 1px solid #aaa;
        text-align: center;
        border-collapse: collapse;
        font-size: 95%;
}
div.Boxmerge div.NavFrame {
        border-style: none;
        border-style: hidden;
}
div.NavFrame + div.NavFrame {
        border-top-style: none;
        border-top-style: hidden;
}
div.NavPic {
        background-color: #fff;
        margin: 0px;
        padding: 2px;
        float: left;
}
div.NavFrame div.NavHead {
        height: 1.6em;
        font-weight: bold;
        background-color: #ccf;
        position:relative;
}
div.NavFrame div.NavHead2 {
        height: 1.6em;
        font-weight: bold;
        background-color: #CCFFD3;
        position:relative;
}
div.NavFrame div.NavHead3 {
        height: 1.6em;
        font-weight: bold;
        background-color: #FFFFCC;
        position:relative;
}
div.NavFrame div.NavHead4 {
        height: 1.6em;
        font-weight: bold;
        background-color: #FFCCCC;
        position:relative;
}
div.NavFrame div.NavHead5 {
        height: 1.6em;
        font-weight: bold;
        background-color: #FF6600;
        position:relative;
}
div.NavFrame div.NavHead5 {
        height: 1.6em;
        font-weight: bold;
        background-color: #CCCCCC;
        position:relative;
}
div.NavFrame p {
        font-size: 100%;
}
div.NavFrame div.NavContent {
        font-size: 100%;
}
div.NavFrame div.NavContent p {
        font-size: 100%;
}
div.NavEnd {
        margin: 0px;
        padding: 0px;
        line-height: 1px;
        clear: both;
}
a.NavToggle {
        position:absolute;
        top:0px;
        right:3px;
        font-weight:normal;
        font-size:smaller;
}


/*
mabitable/prettytable/roundtable class for skinning normal tables
mabitable =   green/white
prettytable = blue/green
roundtable =  prettytable but round
imagetable =  black/black
plaintable =  table defaults
*/

table.mabitable,
table.prettytable,
table.roundtable,
table.imagetable,
table.mabitable table,
table.prettytable table,
table.roundtable table,
table.imagetable table {
    text-align: center;
    border-collapse: collapse;
    background-color: #fff;
}

table.prettytable,
table.roundtable {
    font-size: 12px;
    font-family: Tahoma, Arial, Helvetica, sans-serif;
}

table.mabitable td, table.mabitable th,
table.prettytable td, table.prettytable th,
table.roundtable td, table.roundtable th,
table.imagetable td, table.imagetable th {
    vertical-align: middle;
}

table.mabitable td, table.mabitable th,
table.imagetable td, table.imagetable th {
    border: 1px #aaa solid;
    padding: 4px;
}
table.prettytable td, table.prettytable th,
table.roundtable td, table.roundtable th {
    background-color: #e7f3e8;
    border: 2px #fff solid;
}

table.mabitable.odd tr:nth-child(odd) td,
table.mabitable.even tr:nth-child(even) td {
    background-color: #eee;
}

table.mabitable th {
    background-color: #e7f3e8;
}
table.prettytable th,
table.roundtable th {
    background-color: #a0c6e3;
    /*color: #fff; *//* Remove this line if you want the color of the header text to be black */
}

table.mabitable tr.image td, table.mabitable td.image,
table.prettytable tr.image td, table.prettytable td.image,
table.roundtable tr.image td, table.roundtable td.image,
table.imagetable td, table.imagetable th {
    color: #fff;
    padding: 5px;
    background-color: #333;
}

table.imagetable td, table.imagetable th {
    background-color: #000;
}

table.roundtable th, table.roundtable td {
    border-radius: 8px;
    -moz-border-radius: 8px;
}

table.mabitable caption,
table.prettytable caption,
table.roundtable caption,
table.imagetable caption {
    margin-left: inherit;
    margin-right: inherit;
    font-size: 116%;
    font-weight: bold;
}

.unimplemented {
    background: #cd5c5c;
}

table.plaintable, table.plaintable td, table.plaintable tr {
    border-collapse: separate;
    border: 0 groove #000;
    background-color: #fff;
    color: #000;
    padding: 0;
    margin: 0;
    border-spacing: 2px;
    text-align: left;
}

/* Article message box template styles */
table.ambox {
    margin: 0 10%;                       /* Will not overlap with other elements */
    border-collapse: collapse; 
    background: #fbfbfb; 
    border: 1px solid #aaa; 
    border-left: 10px solid #1e90ff;     /* Default "notice" blue */
}
table.ambox th.ambox-text, table.ambox td.ambox-text {      /* The message body cell(s) */
    padding: 0.25em 0.5em;            /* 0.5em left/right */
    width: 100%;                      /* Make all templates the same width regardless of text size */
}
table.ambox td.ambox-image {          /* The left image cell */
    padding: 2px 0px 2px 0.5em;       /* 0.5em left, 0px right */
    text-align: center; 
}
table.ambox td.ambox-imageright {     /* The right image cell */
    padding: 2px 4px 2px 0px;         /* 0px left, 4px right */
    text-align: center; 
}
table.ambox-notice {
    border-left: 10px solid #1e90ff;     /* Blue */
/* border-right: 10px solid #1e90ff; */  /* If you want two blue bars */
}
table.ambox-delete,
table.ambox-serious {
    border-left: 10px solid #b22222;     /* Red */
}
table.ambox-content {
    border-left: 10px solid #f28500;     /* Orange */
}
table.ambox-style {
    border-left: 10px solid #f4c430;     /* Yellow */
}
table.ambox-merge {
    border-left: 10px solid #9932cc;     /* Purple */
}
table.ambox-protection {
    border-left: 10px solid #bba;        /* Gray */
}
table.ambox.ambox-mini {                 /* small floating box variant */
    float: right;
    clear: right;
    margin: 0 0 0 1em;
    width: 25%;
}

/* Infobox template style */
div.infobox {
    border: 1px solid #aaa;
    float: right;
    font-size: 11px;
    background-color: white;
}

/* Chocobo's Edits */

table.tbskill {
   font-size: 11px;
   font-family: Tahoma, Arial, Helvetica, sans-serif;
   text-align: center;
   width: 520px;
}
table.tbskill td.skilltitle {
	background-color: #a0c6e3;
}
table.tbskill td.skillcontent {
	background-color: #e7f3e8;
}

/* velocity7's Edits */

div.pad {
    padding-left: 7px;
    padding-right: 7px;
    padding-top: 2px;
    padding-bottom: 2px;
}

/* Following Lines are now implemented in main.css
.roundtl, .roundtr, .roundbl, .roundbr {
   height: 5px;
}

.roundtl { 
   background: url(http://4urworld.net/mabinogi/wiki/skins/monobook/velo/tl.gif) no-repeat top left; 
}

.roundtr { 
   background: url(http://4urworld.net/mabinogi/wiki/skins/monobook/velo/tr.gif) no-repeat top right; 
}

.roundbl { 
   background: url(http://4urworld.net/mabinogi/wiki/skins/monobook/velo/bl.gif) no-repeat bottom left; 
}

.roundbr { 
   background: url(http://4urworld.net/mabinogi/wiki/skins/monobook/velo/br.gif) no-repeat bottom right; 
}
*/

/** velocity7: overwrite the above css classes, then remove roundt*2 and roundt*3.
roundconts should remain the same. once the above changes have been made, everything
be sure to make the URLs relative so that when domain changes occur and such, the 
links don't break.

also, if possible, please look at:

http://rafael.adm.br/css_browser_selector/

if this can be implemented, then we can make the site choose .gif for transparencies when it
comes to IE, and .png for firefox, as IE doesn't accept transparencies in .png */

/** UC: Thanks for the link. I will create the copies of png files and see if that feature can be done here. */

/** Hotarugirl's edits -- */

table.monstertable { border-spacing: 4px; }
table.monstertable TD.title { background-color:#333333; color:#ffffff; text-align: left;}

table.containertable { border-spacing: 4px; background-color:#a0c6e3; }
table.containertable TD { background-color:#e7f3e8; text-align: center; padding-left: 10px; padding-right:10px; padding-top:3px; padding-bottom:3px; }
table.containertable TD.title { background-color:#a0c6e3; text-align: center; font-weight: bold; }
table.containertable TD.key { background-color:#a0c6e3; text-align: right; font-weight: bold; padding-left: 0px; padding-right:0px; padding-top:0px; padding-bottom:0px }


/** End Taru's stuff */

TABLE.glovetable { border-spacing: 0px; border-collapse:collapse; font-family: Tahoma; text-align:center; font-size: 11px;}
TABLE.glovetable TR.title { background-color:black;}
TABLE.glovetable TD.names { background-color:#dddddd;}
TABLE.glovetable TD.tbimages { text-align:center; background-color: black;}
TABLE.glovetable TH { color: #ffffff; font-weight: bold;}

table.interactableitem {
   font-size: 11px;
   font-family: Tahoma, Arial, Helvetica, sans-serif;
   background: #FFFFFF;
   text-align: center;
   width: 700px;
}

table.interactableitem td.itembox {
   width: 11%;
   color: white;
   padding-right: 10px;
}

table.interactableitem td.itembox p {
   padding-left: 5px;
   padding-right: 5px;
}

table.interactableitem td {
   width: 10%;
}

/** BLUE BOX */

.roundcont {
   background: #A0C6E3;
   color: white;
}

.roundtl, .roundtr, .roundbl, .roundbr {
   height: 5px;
}

.roundtl { 
   background: url(/skins/monobook/velo/tl.gif) no-repeat top left; 
}

.roundtr { 
   background: url(/skins/monobook/velo/tr.gif) no-repeat top right; 
}

.roundbl { 
   background: url(/skins/monobook/velo/bl.gif) no-repeat bottom left; 
}

.roundbr { 
   background: url(/skins/monobook/velo/br.gif) no-repeat bottom right; 
}

/** GREEN BOX */

.roundcont2 {
   background: #E7F3E8;
}

/** ITEM BOX */

.roundcont3 {
   background: #333333;
}

/** Ikkisuki! */

#hovercardC {
    display: none;
}

.linklike {
    background: none repeat scroll 0 0 transparent;
    color: #0645AD;
    text-decoration: none;
}

.mabibook .bg {
position: relative;
width: 512px;
height: 328px;
}

.mabibook .pagenumber {
position: absolute;
right: 30px;
bottom: 28px;
font-family: Trebuchet MS;
font-size: 11px;
line-height: 125%;
}

.mabibook .page {
position: absolute;
left: 30px;
top: 10px;
width: 194px;
height: 280px;
overflow: hidden;
font-family: Trebuchet MS;
font-size: 11px;
line-height: 125%;
}

.mabibook .page2 {
position: absolute;
left: 285px;
top: 10px;
width: 194px;
height: 280px;
overflow: hidden;
font-family: Trebuchet MS;
font-size: 11px;
line-height: 125%;
}

.mabibook .tocn {
float: right;
}

.mabibook .chapter {
color: #3838C0;
}

.mabibook .highlight {
color: #C0379B;
}

#n-M-World-Forums a {
font-weight:bold;
}

#n-Donate a {
background-color: lightgreen;
}

.spaceholder {
font-size: 7px;
visibility:hidden;
}

.petbox {
  background: transparent;
  font-size: 10px;
  line-height: 12px;
  width: 227px;
  border-collapse: collapse;
  border: #575757 solid 1px;
  margin: 3px 0 0 3px;
  height: 30px;
}

.petbox td {
  padding-left: 5px;
}

.petbox th {
  width: 30px;
  border: solid 1px #575757;
}

.mabitab > ul {
  padding-bottom: 5px;
  margin-top: -2px;
}

.mabitab > ul a {
  font-size: 10px;
  background-color: #676767;
  border: 1px solid #575757;
}

.mabitab > ul li.active a {
  background-color: #575757;
  border: 1px solid #575757;
}

.mabitab > ul li a {
  color: #D2D1CC;
  text-decoration: none;
}

.mabitab > div {
  border: 0;
  padding: 0;
  border-collapse: collapse;
  margin-top: 0px;
}

.charbox {
  background: transparent;
  width: 100%;
  font-size: 10px;
  line-height: 12px;
}

.charbox th {
  color: #d2d1cc;
  text-align: left;
  font-weight: normal;
}

.charbox td {
  color: #fff;
}

.charwindow {
border-width: 4px;
border-style: solid;
border-image: url(/images/0/03/Char_Window_Main.png) 4 4 4 4 fill stretch stretch;
}

.passivebutton {
border-width: 3px;
border-style: solid;
border-image: url(/images/6/6d/Char_Window_Button.png) 3 3 3 3 fill stretch stretch;
color: #d2d1cc;
text-align: center;
}

.charbutton {
border-width: 3px;
border-style: solid;
border-image: url(/images/6/6d/Char_Window_Button.png) 3 3 3 3 fill stretch stretch;
cursor: pointer;
color: #d2d1cc;
text-align: center;
}

.charbutton:hover {
border-width: 3px;
border-style: solid;
border-image: url(/images/0/0f/Char_Window_Button_Hover.png) 5 5 5 5 fill stretch stretch;
cursor: pointer;
}

.charflatbutton {
border-width: 3px;
border-style: solid;
border-image: url(/images/d/dd/Char_Window_Flat_Button.png) 3 2 3 2 fill stretch stretch;
cursor: pointer;
}

.charflatbutton:hover {
border-width: 3px;
border-style: solid;
border-image: url(/images/d/de/Char_Window_Flat_Button_Hover.png) 8 8 8 8 fill stretch stretch;
cursor: pointer;
}

.chartooltip {
border-style: solid;
border-image-source: url(/images/e/e6/Char_Window_Tooltip.png);
border-image-slice: 3 4 4 3 fill;
border-image-repeat: stretch stretch;
display: block;
padding: 3px;
}

.hoverx { width: 8px; height: 8px; background: url(/images/0/02/Char_Window_Hoverx.png) 0 0; }

.hoverx:hover { width: 8px; height: 8px; background: url(/images/0/02/Char_Window_Hoverx.png) 0px 8px; }

.hoverminimize { width: 8px; height: 8px; background: url(/images/0/02/Char_Window_Hoverx.png) 8px 0; }

.hoverminimize:hover { width: 8px; height: 8px; background: url(/images/0/02/Char_Window_Hoverx.png) 8px 8px; }

table.roundbox {
   font-size: 11px;
   font-family: Tahoma, Arial, Helvetica, sans-serif;
   background: #FFFFFF;
   text-align: center;
}

th.roundblue, td.roundblue, div.roundblue, table.roundblue {
   background: #A0C6E3;
   -moz-border-radius: 5px;
   border-radius: 5px;
   color: #FFFFFF;
}

td.roundgreen, th.roundgreen, div.roundgreen, table.roundgreen {
   background: #E7F3E8;
   -moz-border-radius: 5px;
   border-radius: 5px;
}

td.roundblack, th.roundblack, div.roundblack, table.roundblack {
   background: #333333;
   -moz-border-radius: 5px;
   border-radius: 5px;
   color: #FFFFFF;
   padding-top: 3px;
}

#parentPage {
    color: #7D7D7D;
    font-size: 84%;
    line-height: 1.2em;
    width: auto;
    margin: 0;
}

.h1, .h2, .h3, .h4, .h5, .h6 {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-bottom: 1px solid #AAAAAA;
    color: #000000;
    font-weight: normal;
    margin: 0;
    overflow: hidden;
    padding-bottom: 0.17em;
    padding-top: 0.5em;
}
.h1, .h2 {
    margin-bottom: 0.6em;
}
.h3, .h4, .h5 {
    margin-bottom: 0.3em;
}
.h3, .h4, .h5, .h6 {
    border-bottom: medium none;
    font-weight: bold;
}
.h1 {
    font-size: 188%;
}
.h2 {
    font-size: 150%;
}
.h3 {
    font-size: 132%;
}
.h4 {
    font-size: 116%;
}
.h5 {
    font-size: 108%;
}
.h6 {
    font-size: 100%;
}

/* End Ikkisuki! */

pre, code {
    background-color: #eee;
    white-space: pre;
}

div.pre { /* A hack to stop mediawiki automatically "wysiwyg'ing" the code */
    font-family: monospace;
    font-size: 10pt;
    background-color: #eee;
    white-space: pre;
    padding: 1em;
    border: 1px dashed #2f6fab;
    color: black;
    line-height: 1.1em;
}

/* Some useful quick styles */
#blue, .blue { color: #00f; }
#red, .ref  { color: #f00; }
#text-left, .text-left { text-align: left; }
#text-right, .text-right { text-align: right; }
#text-center, .text-center { text-align: center; }
#bg-red, .bg-red, tr#bg-red td, tr.bg-red td { background-color: #cd5c5c; }
#bg-pink, .bg-pink, tr#bg-pink td, tr.bg-pink td { background-color: #fdd; }

.image-pad img { padding: 5px; }
.image-limit-150px img { max-width: 150px; height: auto; }
.image-limit-200px img { max-width: 200px; height: auto; }
table.td-left td { text-align: left; }
table.td-right td { text-align: right; }
table.marginless { margin: 0; }
p { margin: 0.4em 0; }

.prefixed::before { content: var(--prefix); }
.suffixed::before { content: var(--suffix); }

kbd { /* stolen from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/kbd */
  background-color: #eee;
  border-radius: 3px;
  border: 1px solid #b4b4b4;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 2px 0 0 rgba(255, 255, 255, .7) inset;
  color: #333;
  display: inline-block;
  font-size: .85em;
  font-weight: 700;
  line-height: 1;
  padding: 2px 4px;
  white-space: nowrap;
}

/* For Recent Changes and History */
.mw-plusminus-pos { color: #060; }
.mw-plusminus-neg { color: #800; }

/* Mouse-over boxes */

.mouseover-custom {
    display: none;
}

.mouseover-content {
    background-color: #e7f3e8;
    padding: 5px;
    border: 1px solid #aaa;
    border-radius: 5px;
    -moz-border-radius: 5px;
    text-align: center;
    vertical-align: middle;
    z-index: 9999;
}

/*======================  Khenta's Wiki Edits ===========================================*/

/* CSS placed here will be applied to all skins */

/* Transform Changes */
table.changes            { border:none; width:100% }
table.changes th         { background: #dfdfdf; color: #4E507F; text-align: center; white-space: nowrap; }
table.changes tr         { margin:0; padding:0 }
table.changes td         { margin:0; padding: 1px 4px; vertical-align: top }
table.changes td.heading { font-size: 110%; font-weight:bold; padding-top:10px }
table.changes td.comment { width:100% }
table.changes td.talk,
table.changes td.diff    { font-size: 90% }
table.changes td.user,
table.changes td.talk,
table.changes td.diff,
table.changes td.info    { white-space: nowrap; }
tr.mw-line-odd           { background: #fff; }
tr.mw-line-even          { background: #eee; }


/* Default skin for navigation boxes */
table.navbox {            /* Navbox container style */
    border: 1px solid #aaa;
    width: 100%; 
    margin: auto;
    clear: both;
    font-size: 88%;
    text-align: center;
    padding: 1px;
}
table.navbox + table.navbox {  /* Single pixel border between adjacent navboxes */
    margin-top: -1px;          /* (doesn't work for IE6, but that's okay)       */
}
.navbox-title,
.navbox-abovebelow,
table.navbox th {
    text-align: center;      /* Title and above/below styles */
    padding-left: 1em;
    padding-right: 1em;
}
.navbox-group {              /* Group style */
    white-space: nowrap;
    text-align: right;
    font-weight: bold;
    padding-left: 1em;
    padding-right: 1em;
}
.navbox, .navbox-subgroup {
    background: #fdfdfd;     /* Background color */
}
.navbox-list {
    border-color: #fdfdfd;   /* Must match background color */
}
.navbox-title,
table.navbox th {
    background: #ccccff;     /* Level 1 color */
}
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #ddddff;     /* Level 2 color */
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
    background: #e6e6ff;     /* Level 3 color */
}
.navbox-even {
    background: #f7f7f7;     /* Even row striping */
}
.navbox-odd {
    background: transparent; /* Odd row striping */
}

.collapseButton {          /* 'show'/'hide' buttons created dynamically */
    float: right;          /* by the CollapsibleTables javascript in    */
    font-weight: normal;   /* [[MediaWiki:Common.js]]are styled here    */
    text-align: right;     /* so they can be customised.                */
    width: auto;
}
.navbox .collapseButton {  /* In navboxes, the show/hide button balances */
    width: 6em;            /* the vde links from [[Template:Tnavbar]],   */
}                          /* so they need to be the same width.         */

/*====================== End  Khenta's Wiki Edits ===========================================*/

/*====================== Diff ===============================================================*//*
** Diff rendering
*/
table.diff, td.diff-otitle, td.diff-ntitle {
    background-color: white;
}
td.diff-otitle,
td.diff-ntitle {
    text-align: center;
}
td.diff-marker {
    text-align: right;
}
.rtl td.diff-marker {
    text-align: left;
}
td.diff-lineno {
    font-weight: bold;
}
td.diff-addedline {
    background: #cfc;
    font-size: smaller;
}
td.diff-deletedline {
    background: #ffa;
    font-size: smaller;
}
td.diff-context {
    background: #eee;
    font-size: smaller;
}
.diffchange {
    color: red;
    font-weight: bold;
    text-decoration: none;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
}

table.diff {
    border: none;
    width: 98%;
    border-spacing: 4px;
    
    /* Fixed layout is required to ensure that cells containing long URLs
       don't widen in Safari, Internet Explorer, or iCab */
    table-layout: fixed;
}
table.diff td {
    padding: 0;
}
table.diff col.diff-marker {
    width: 2%;
}
table.diff col.diff-content {
    width: 48%;
}
table.diff td div {
    /* Force-wrap very long lines such as URLs or page-widening char strings.
       CSS 3 draft..., but Gecko doesn't support it yet:
       https://bugzilla.mozilla.org/show_bug.cgi?id=99457 */
    word-wrap: break-word;
    
    /* As fallback, scrollbars will be added for very wide cells
       instead of text overflowing or widening */
    overflow: auto;
    
    /* The above rule breaks on very old versions of Mozilla due
       to a bug which collapses the table cells to a single line.
       
       In Mozilla 1.1 and below with JavaScript enabled, the rule
       will be overridden with this by diff.js; wide cell contents
       then spill horizontally without widening the rest of the
       table: */
    /* overflow: visible; */
}

/*
 * Styles for the HTML Diff
 */
div.diff-switchtype{
    text-align: center;
    font-weight: bold;
    font-size: smaller;
}

span.diff-html-added {
  font-size: 100%;
  background-color: #20ff20;
}

span.diff-html-removed {
  font-size: 100%;
  text-decoration: line-through;
  background-color: #ff2020;
}

span.diff-html-changed {
  background: url(images/diffunderline.gif) bottom repeat-x;
  /* Hack for IE5.5, see http://lists.wikimedia.org/pipermail/wikitech-l/2008-November/040273.html */
  *background-color: #c6c6fd; /* light blue */
}

span.diff-html-added img{
 border: 5px solid #ccffcc;
}

span.diff-html-removed img{
 border: 5px solid #fdc6c6;
}

span.diff-html-changed img{
 border: 5px dotted #000099;
 
}

span.diff-html-changed  {
  position: relative;   /* this is key */
  cursor: help;
}
 
span.diff-html-changed span.tip {
  display: none;        /* so is this */
}

/* tooltip will display on :hover event */
 
span.diff-html-changed:hover span.tip {
  display: block;
  z-index: 95;
  position: absolute;
  top: 2.5em;
  left: 0;
  width: auto;
  line-height: 1.2em;
  padding: 3px 7px 4px 6px;
  border: 1px solid #336;
  background-color: #f7f7ee;
  font-size: 10px;
  text-align: left;
}
/*====================== End Diff ===========================================================*/

/*============ CalcSystem stuff ================*/
.calc-var input[type="text"] {
	width: 3em;
	text-align: center;
}

.calc-formula, .calc-pre {
	display: none;
	visibility: hidden;
}

.shiftbox-horz1 {
	display: inline-block;
	width: 0px;
	height: 0px;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-right: 10px solid black;
	cursor: pointer;
	margin-right: 1px;

	position: relative;
	top: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.shiftbox-horzbox {
	display: inline-block;
	height: 20px;
	width: 3em;
	padding: 0px;
}

.shiftbox-horz2 {
	display: inline-block;
	width: 0px;
	height: 0px;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 10px solid black;
	cursor: pointer;
	margin-left: 1px;

	position: relative;
	top: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.calc-type-shiftbox-vert {
	display: inline-block;
}

.shiftbox-vert1 {
	display: block;
	width: 0px;
	height: 0px;
	border-left: 1.4em solid transparent;
	border-right: 1.4em solid transparent;
	border-bottom: 7px solid black;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.shiftbox-vertbox {
	display: block;
}

.shiftbox-vert2 {
	display: block;
	width: 0px;
	height: 0px;
	border-left: 1.4em solid transparent;
	border-right: 1.4em solid transparent;
	border-top: 7px solid black;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

/* Default styles for Slider Lib */
.calc-type-slider {
	background-image: url(/skins/common/images/mw/track.png);
	background-repeat: no-repeat;
	width: 200px;
	height: 25px;
	display: inline-block;
	background-size: 100%;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.slider {
	display: inline-block;
	position: relative;
	top: 0px;
	left: 0px;
	min-width: 10px;
	min-height: 10px;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.sliderimg {
	display: inline-block;
	position: absolute;
	top: 0px;
	left: 0px;
	background-repeat: no-repeat;
	background-image: url(/skins/common/images/mw/point.png);
	width: 13px;
	height: 25px;
	cursor: pointer;
	background-size: 100%;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.slidertext {
	display: inline-block;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	padding-left: 11px;
	font-size: 10px;
	font-weight: bold;
	color: #050000;
	vertical-align: super;
}
/*=================== End CalcSystem stuff ====================*/

/* User group coloring */
a.mw-sysop-userlink, a.mw-sysop-userlink:visited {
    color: #1a8e18;
}

a.mw-minion-userlink, a.mw-minion-userlink:visited {
    color: #008080;
}

/* Hide page title on the main page */
body.page-Wiki_Home h1.firstHeading { display: none; }

.template, .make-timer, .make-rain-area, .settings { display: none !important; }

.mp-welcome-logged-in {
    text-align: center;
    margin-left: 0px !important;
}

.mp-welcome-header {
    font-size: medium;
    color: blue;
}

.mp-welcome-image {
    width: 100%;
}

.emoticon {
    margin: 2px 0px 0px 2px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    display: inline-block;
    border-width: 1px;
    border-style: solid;

    /* Change these inline */
    background-color: #f1da36;
    background: radial-gradient(ellipse at 4px 4px, #F3F2F2 0%,#f1da36 100%);
    border-color: #CCBB00;
}

.emoticon img {
    margin: -2px 0px 0px -2px;
}

/* Toggler buttons */
.toggler {
	display: inline-block;
	cursor: pointer;
}
.toggler-on {
	border: 1px red solid;
}
.toggler-off {
	border: 1px transparent solid;
}