Difference between revisions of "MediaWiki:Common.css"

From NeoDex
Jump to navigation Jump to search
m (Puma's CSS)
m
 
(30 intermediate revisions by 2 users not shown)
Line 53: Line 53:
display: none;
display: none;
}
}
/*added in to fix collapsed button size anomaly */
table.wikitable tr th { font-size:10pt; }
   
   
.collapseButton { /* 'show'/'hide' buttons created dynamically by the */
.collapseButton { /* 'show'/'hide' buttons created dynamically by the */
Line 59: Line 62:
text-align: right;
text-align: right;
width: auto;
width: auto;
font-family:monospace;
font-size:inherit;
}
}


Line 71: Line 76:
}
}


/* tooltip css shamelessly lifted from a w3schools' example */


/* Below, a tonne of CSS for Puma to play with. /*
.tooltip {
 
    position: relative;
 
    display: inline-block;
/*?
    border-bottom: 2px double rgba(0,0,0,0.5);
*****************************************************************************
***                            colors for span                            ***
*****************************************************************************/
 
.bg-red1 { color: #000000;  background-color: #ffc0c0 !important; }
.bg-red2 { color: #000000;  background-color: #ff8080 !important; }
.bg-red3 { color: #000000;  background-color: #ff0000 !important; }
 
.bg-orange1 { color: #000000;  background-color: #ffe0a0 !important; }
.bg-orange2 { color: #000000; background-color: #ffc350 !important; }
.bg-orange3 { color: #000000;  background-color: #ffa500 !important; }
 
.bg-yellow1 { color: #000000;  background-color: #fff0a0 !important; }
.bg-yellow2 { color: #000000;  background-color: #ffff70 !important; }
.bg-yellow3 { color: #000000;  background-color: #ffff00 !important; }
 
.bg-green1 { color: #000000;  background-color: #c0ffc0 !important; }
.bg-green2 { color: #000000;  background-color: #80ff80 !important; }
.bg-green3 { color: #000000;  background-color: #00ff00 !important; }
 
.bg-cyan1 { color: #000000;  background-color: #c0ffff !important; }
.bg-cyan2 { color: #000000;  background-color: #70ffff !important; }
.bg-cyan3 { color: #000000;  background-color: #00ffff !important; }
 
.bg-blue1 { color: #000000;  background-color: #c0c0ff !important; }
.bg-blue2 { color: #000000;  background-color: #8080ff !important; }
.bg-blue3 { color: #ffffff;  background-color: #0000ff !important; }
 
.bg-magenta1 { color: #000000;  background-color: #ffc0ff !important; }
.bg-magenta2 { color: #000000;  background-color: #ff70ff !important; }
.bg-magenta3 { color: #000000;  background-color: #ff00ff !important; }
 
.bg-white { color: #000000;  background-color: #ffffff !important; }
.bg-gray1 { color: #000000;  background-color: #d0d0d0 !important; }
.bg-gray2 { color: #000000;  background-color: #909090 !important; }
.bg-gray3 { color: #ffffff;  background-color: #505050 !important; }
.bg-black { color: #ffffff;  background-color: #000000 !important; }
 
.frame-red1
{
color: #000000;
background-color: #ffc0c0;
border: 1px solid #a00000;
}
 
.frame-red2
{
color: #000000;
background-color: #ff8080;
border: 1px solid #a00000;
}
 
.frame-red3
{
color: #000000;
background-color: #ff0000;
border: 1px solid #a00000;
}
 
.frame-orange1
{
color: #000000;
background-color: #ffe0a0;
border: 1px solid #e0a080;
}
 
.frame-orange2
{
color: #000000;
background-color: #ffc350;
border: 1px solid #e0a080;
}
 
.frame-orange3
{
color: #000000;
background-color: #ffa500;
border: 1px solid #e0a080;
}
 
.frame-yellow1
{
color: #000000;
background-color: #fff0a0;
border: 1px solid #808000;
}
 
.frame-yellow2
{
color: #000000;
background-color: #ffff70;
border: 1px solid #808000;
}
 
.frame-yellow3
{
color: #000000;
background-color: #ffff00;
border: 1px solid #808000;
}
 
.frame-green1
{
color: #000000;
background-color: #c0ffc0;
border: 1px solid #00a000;
}
 
.frame-green2
{
color: #000000;
background-color: #80ff80;
border: 1px solid #00a000;
}
 
.frame-green3
{
color: #000000;
background-color: #00ff00;
border: 1px solid #00a000;
}
 
.frame-cyan1
{
color: #000000;
background-color: #c0ffff;
border: 1px solid #008080;
}
 
.frame-cyan2
{
color: #000000;
background-color: #70ffff;
border: 1px solid #008080;
}
 
.frame-cyan3
{
color: #000000;
background-color: #00ffff;
border: 1px solid #008080;
}
 
.frame-blue1
{
color: #000000;
background-color: #c0c0ff;
border: 1px solid #0000a0;
}
 
.frame-blue2
{
color: #000000;
background-color: #8080ff;
border: 1px solid #0000a0;
}
 
.frame-blue3
{
color: #ffffff;
background-color: #0000ff;
border: 1px solid #0000a0;
}
 
.frame-magenta1
{
color: #000000;
background-color: #ffc0ff;
border: 1px solid #700070;
}
 
.frame-magenta2
{
color: #000000;
background-color: #ff70ff;
border: 1px solid #700070;
}
 
.frame-magenta3
{
color: #000000;
background-color: #ff00ff;
border: 1px solid #700070;
}
 
.frame-white
{
color: #000000;
background-color: #ffffff;
border: 1px solid #c0c0c0;
}
 
.frame-gray1
{
color: #000000;
background-color: #d0d0d0;
border: 1px solid #606060;
}
 
.frame-gray2
{
color: #000000;
background-color: #909090;
border: 1px solid #606060;
}
 
.frame-gray3
{
color: #ffffff;
background-color: #505050;
border: 1px solid #606060;
}
 
.frame-black
{
color: #ffffff;
background-color: #000000;
border: 1px solid #505050;
}
 
 
/*?
*****************************************************************************
***                            table status                              ***
*****************************************************************************/
 
table.textbox td.td-no,
table.textbox tr.alt td.td-no,
table.textbox.red tr.alt td.td-no,
table.textbox.orange tr.alt td.td-no,
table.textbox.yellow tr.alt td.td-no,
table.textbox.green tr.alt td.td-no,
table.textbox.cyan tr.alt td.td-no,
table.textbox.blue tr.alt td.td-no,
table.textbox.magenta tr.alt td.td-no,
table.textbox.white tr.alt td.td-no,
table.textbox.gray tr.alt td.td-no,
table.textbox.black tr.alt td.td-no,
.td-no
{
color: #000000;
background-color: #ffc0c0 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-maybe,
table.textbox tr.alt td.td-maybe,
table.textbox.red tr.alt td.td-maybe,
table.textbox.orange tr.alt td.td-maybe,
table.textbox.yellow tr.alt td.td-maybe,
table.textbox.green tr.alt td.td-maybe,
table.textbox.cyan tr.alt td.td-maybe,
table.textbox.blue tr.alt td.td-maybe,
table.textbox.magenta tr.alt td.td-maybe,
table.textbox.white tr.alt td.td-maybe,
table.textbox.gray tr.alt td.td-maybe,
table.textbox.black tr.alt td.td-maybe,
.td-maybe
{
color: #000000;
background-color: #fff0a0 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-yes,
table.textbox tr.alt td.td-yes,
table.textbox.red tr.alt td.td-yes,
table.textbox.orange tr.alt td.td-yes,
table.textbox.yellow tr.alt td.td-yes,
table.textbox.green tr.alt td.td-yes,
table.textbox.cyan tr.alt td.td-yes,
table.textbox.blue tr.alt td.td-yes,
table.textbox.magenta tr.alt td.td-yes,
table.textbox.white tr.alt td.td-yes,
table.textbox.gray tr.alt td.td-yes,
table.textbox.black tr.alt td.td-yes,
.td-yes
{
color: #000000;
background-color: #c0ffc0 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-opt,
table.textbox tr.alt td.td-opt,
table.textbox.red tr.alt td.td-opt,
table.textbox.orange tr.alt td.td-opt,
table.textbox.yellow tr.alt td.td-opt,
table.textbox.green tr.alt td.td-opt,
table.textbox.cyan tr.alt td.td-opt,
table.textbox.blue tr.alt td.td-opt,
table.textbox.magenta tr.alt td.td-opt,
table.textbox.white tr.alt td.td-opt,
table.textbox.gray tr.alt td.td-opt,
table.textbox.black tr.alt td.td-opt,
.td-opt
{
color: #000000;
background-color: #c0c0ff !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-unknown,
table.textbox tr.alt td.td-unknown,
table.textbox.red tr.alt td.td-unknown,
table.textbox.orange tr.alt td.td-unknown,
table.textbox.yellow tr.alt td.td-unknown,
table.textbox.green tr.alt td.td-unknown,
table.textbox.cyan tr.alt td.td-unknown,
table.textbox.blue tr.alt td.td-unknown,
table.textbox.magenta tr.alt td.td-unknown,
table.textbox.white tr.alt td.td-unknown,
table.textbox.gray tr.alt td.td-unknown,
table.textbox.black tr.alt td.td-unknown,
.td-unknown
{
color: #000000;
background-color: #d0d0d0 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-na,
table.textbox tr.alt td.td-na,
table.textbox.red tr.alt td.td-na,
table.textbox.orange tr.alt td.td-na,
table.textbox.yellow tr.alt td.td-na,
table.textbox.green tr.alt td.td-na,
table.textbox.cyan tr.alt td.td-na,
table.textbox.blue tr.alt td.td-na,
table.textbox.magenta tr.alt td.td-na,
table.textbox.white tr.alt td.td-na,
table.textbox.gray tr.alt td.td-na,
table.textbox.black tr.alt td.td-na,
.td-na
{
color: #ffffff;
background-color: #808080 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-bronze,
table.textbox tr.alt td.td-bronze,
table.textbox.red tr.alt td.td-bronze,
table.textbox.orange tr.alt td.td-bronze,
table.textbox.yellow tr.alt td.td-bronze,
table.textbox.green tr.alt td.td-bronze,
table.textbox.cyan tr.alt td.td-bronze,
table.textbox.blue tr.alt td.td-bronze,
table.textbox.magenta tr.alt td.td-bronze,
table.textbox.white tr.alt td.td-bronze,
table.textbox.gray tr.alt td.td-bronze,
table.textbox.black tr.alt td.td-bronze,
.td-bronze
{
color: #000000;
background-color: #daaa50 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-silver,
table.textbox tr.alt td.td-silver,
table.textbox.red tr.alt td.td-silver,
table.textbox.orange tr.alt td.td-silver,
table.textbox.yellow tr.alt td.td-silver,
table.textbox.green tr.alt td.td-silver,
table.textbox.cyan tr.alt td.td-silver,
table.textbox.blue tr.alt td.td-silver,
table.textbox.magenta tr.alt td.td-silver,
table.textbox.white tr.alt td.td-silver,
table.textbox.gray tr.alt td.td-silver,
table.textbox.black tr.alt td.td-silver,
.td-silver
{
color: #000000;
background-color: #c0c0c0 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-gold,
table.textbox tr.alt td.td-gold,
table.textbox.red tr.alt td.td-gold,
table.textbox.orange tr.alt td.td-gold,
table.textbox.yellow tr.alt td.td-gold,
table.textbox.green tr.alt td.td-gold,
table.textbox.cyan tr.alt td.td-gold,
table.textbox.blue tr.alt td.td-gold,
table.textbox.magenta tr.alt td.td-gold,
table.textbox.white tr.alt td.td-gold,
table.textbox.gray tr.alt td.td-gold,
table.textbox.black tr.alt td.td-gold,
.td-gold
{
color: #000000;
background-color: #ffd700 !important;
text-align: center;
padding: 0 .4em;
}
 
table.textbox td.td-platinum,
table.textbox tr.alt td.td-platinum,
table.textbox.red tr.alt td.td-platinum,
table.textbox.orange tr.alt td.td-platinum,
table.textbox.yellow tr.alt td.td-platinum,
table.textbox.green tr.alt td.td-platinum,
table.textbox.cyan tr.alt td.td-platinum,
table.textbox.blue tr.alt td.td-platinum,
table.textbox.magenta tr.alt td.td-platinum,
table.textbox.white tr.alt td.td-platinum,
table.textbox.gray tr.alt td.td-platinum,
table.textbox.black tr.alt td.td-platinum,
.td-platinum
{
color: #000000;
background-color: #c0ccee !important;
text-align: center;
padding: 0 .4em;
}
 
 
/*?
*****************************************************************************
***                      framed textbox: basic setup                      ***
*****************************************************************************/
 
.textbox
{
width: auto;
color: #000000;
background-color: #f0f0ff;
border: 1px solid #0000a0;
padding: 0;
margin: 0.4em 0 0.8em 0;
 
box-shadow: 3px 3px 5px #888899;
-moz-box-shadow: 3px 3px 5px #888899;
-webkit-box-shadow: 3px 3px 5px #888899;
-khtml-box-shadow: 3px 3px 5px #888899;
 
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
}
 
.textbox.nobox
{
width: auto;
color: #000000;
background-color: transparent;
border: none;
padding: 0;
margin: 0.4em 0 0.8em 0;
 
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
-khtml-box-shadow: none;
 
border-sytle: none;
-moz-border-sytle: none;
-webkit-border-sytle: none;
-khtml-border-sytle: none;
}
 
/*-------------------------*/
 
.textbox.full
{
width: 100%;
}
 
.textbox.large
{
font-size: 120%;
}
 
.textbox.huge
{
font-size: 140%;
}
 
/*-------------------------*/
 
.textbox .textbox-head,
table.textbox caption
{
color: #ffffff;
background-color: #000080;
text-align: center;
font-weight: bold;
font-size: 120%;
padding: 0.3em 0.5em;
 
box-shadow: 3px 3px 5px #888899;
-moz-box-shadow: 3px 3px 5px #888899;
-webkit-box-shadow: 3px 3px 5px #888899;
-khtml-box-shadow: 3px 3px 5px #888899;
 
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
-khtml-border-radius: 5px 5px 0 0;
border-radius: 5px 5px 0 0;
}
 
.textbox .textbox-head a,
table.textbox caption a
{
color: #ffffff;
}
 
.textbox.nobox .textbox-head,
table.textbox.nobox caption
{
color: #000000;
background-color: transparent;
font-weight: bold;
font-size: 120%;
padding: 0.4em 0 0.2em;
text-align: left;
}
 
/*-------------------------*/
 
.textbox > .textbox-body
{
padding: 0.5em 1em 0.5em 1em;
}
 
div.textbox.nobox > div.textbox-body
{
padding: 0px;
}
 
.textbox.center > .textbox-body
{
text-align: center;
}
 
/*?
*****************************************************************************
***                        framed textbox: colors                        ***
*****************************************************************************/
 
.textbox.video.bug,
.textbox.red
{
color: #000000;
background-color: #fff0f0;
border: 1px solid #a00000;
 
box-shadow: 3px 3px 5px #998888;
-moz-box-shadow: 3px 3px 5px #998888;
-webkit-box-shadow: 3px 3px 5px #998888;
-khtml-box-shadow: 3px 3px 5px #998888;
}
 
.textbox.video.bug .textbox-head,
table.textbox.video.bug caption,
.textbox.red .textbox-head,
table.textbox.red caption
{
color: #ffffff;
background-color: #800000;
 
box-shadow: 3px 3px 5px #998888;
-moz-box-shadow: 3px 3px 5px #998888;
-webkit-box-shadow: 3px 3px 5px #998888;
-khtml-box-shadow: 3px 3px 5px #998888;
}
 
.textbox.orange
{
color: #000000;
background-color: #fff8e0;
border: 1px solid #e0a080;
 
box-shadow: 3px 3px 5px #998877;
-moz-box-shadow: 3px 3px 5px #998877;
-webkit-box-shadow: 3px 3px 5px #998877;
-khtml-box-shadow: 3px 3px 5px #998877;
}
 
.textbox.orange .textbox-head,
table.textbox.orange caption
{
color: #ffffff;
background-color: #d07000;
 
box-shadow: 3px 3px 5px #998877;
-moz-box-shadow: 3px 3px 5px #998877;
-webkit-box-shadow: 3px 3px 5px #998877;
-khtml-box-shadow: 3px 3px 5px #998877;
}
 
.textbox.yellow
{
color: #000000;
background-color: #ffffe0;
border: 1px solid #808000;
 
box-shadow: 3px 3px 5px #999988;
-moz-box-shadow: 3px 3px 5px #999988;
-webkit-box-shadow: 3px 3px 5px #999988;
-khtml-box-shadow: 3px 3px 5px #999988;
}
 
.textbox.yellow .textbox-head,
table.textbox.yellow caption
{
color: #ffffff;
background-color: #a0a000;
 
box-shadow: 3px 3px 5px #999988;
-moz-box-shadow: 3px 3px 5px #999988;
-webkit-box-shadow: 3px 3px 5px #999988;
-khtml-box-shadow: 3px 3px 5px #999988;
}
 
.textbox.video.tutorial,
.textbox.green
{
color: #000000;
background-color: #f0fff0;
border: 1px solid #00a000;
 
box-shadow: 3px 3px 5px #889988;
-moz-box-shadow: 3px 3px 5px #889988;
-webkit-box-shadow: 3px 3px 5px #889988;
-khtml-box-shadow: 3px 3px 5px #889988;
}
 
.textbox.video.tutorial .textbox-head,
table.textbox.video.tutorial caption,
.textbox.green .textbox-head,
table.textbox.green caption
{
color: #ffffff;
background-color: #008000;
 
box-shadow: 3px 3px 5px #889988;
-moz-box-shadow: 3px 3px 5px #889988;
-webkit-box-shadow: 3px 3px 5px #889988;
-khtml-box-shadow: 3px 3px 5px #889988;
}
 
.textbox.news,
.textbox.cyan
{
color: #000000;
background-color: #f0ffff;
border: 1px solid #008080;
 
box-shadow: 3px 3px 5px #889999;
-moz-box-shadow: 3px 3px 5px #889999;
-webkit-box-shadow: 3px 3px 5px #889999;
-khtml-box-shadow: 3px 3px 5px #889999;
}
 
.textbox.news .textbox-head,
table.textbox.news caption,
.textbox.cyan .textbox-head,
table.textbox.cyan caption
{
color: #ffffff;
background-color: #008080;
 
box-shadow: 3px 3px 5px #889999;
-moz-box-shadow: 3px 3px 5px #889999;
-webkit-box-shadow: 3px 3px 5px #889999;
-khtml-box-shadow: 3px 3px 5px #889999;
}
 
.textbox.video,
.textbox.blue
{
color: #000000;
background-color: #f0f0ff;
border: 1px solid #0000a0;
 
box-shadow: 3px 3px 5px #888899;
-moz-box-shadow: 3px 3px 5px #888899;
-webkit-box-shadow: 3px 3px 5px #888899;
-khtml-box-shadow: 3px 3px 5px #888899;
}
 
.textbox.video .textbox-head,
table.textbox.video caption,
.textbox.blue .textbox-head,
table.textbox.blue caption
{
color: #ffffff;
background-color: #000080;
 
box-shadow: 3px 3px 5px #888899;
-moz-box-shadow: 3px 3px 5px #888899;
-webkit-box-shadow: 3px 3px 5px #888899;
-khtml-box-shadow: 3px 3px 5px #888899;
}
 
.textbox.magenta
{
color: #000000;
background-color: #ffe8ff;
border: 1px solid #700070;
 
box-shadow: 3px 3px 5px #997799;
-moz-box-shadow: 3px 3px 5px #997799;
-webkit-box-shadow: 3px 3px 5px #997799;
-khtml-box-shadow: 3px 3px 5px #997799;
}
 
.textbox.magenta .textbox-head,
table.textbox.magenta caption
{
color: #ffffff;
background-color: #700070;
 
box-shadow: 3px 3px 5px #997799;
-moz-box-shadow: 3px 3px 5px #997799;
-webkit-box-shadow: 3px 3px 5px #997799;
-khtml-box-shadow: 3px 3px 5px #997799;
}
 
.textbox.white
{
color: #000000;
background-color: #ffffff;
border: 1px solid #c0c0c0;
 
box-shadow: 3px 3px 5px #999999;
-moz-box-shadow: 3px 3px 5px #999999;
-webkit-box-shadow: 3px 3px 5px #999999;
-khtml-box-shadow: 3px 3px 5px #999999;
}
 
.textbox.white .textbox-head,
table.textbox.white caption
{
color: #000000;
background-color: #d0d0d0;
 
box-shadow: 3px 3px 5px #999999;
-moz-box-shadow: 3px 3px 5px #999999;
-webkit-box-shadow: 3px 3px 5px #999999;
-khtml-box-shadow: 3px 3px 5px #999999;
}
 
.textbox.video.original,
.textbox.gray
{
color: #000000;
background-color: #e0e0e0;
border: 1px solid #606060;
 
box-shadow: 3px 3px 5px #777777;
-moz-box-shadow: 3px 3px 5px #777777;
-webkit-box-shadow: 3px 3px 5px #777777;
-khtml-box-shadow: 3px 3px 5px #777777;
}
 
.textbox.video.original .textbox-head,
table.textbox.video.original caption,
.textbox.gray .textbox-head,
table.textbox.gray caption
{
color: #ffffff;
background-color: #808080;
 
box-shadow: 3px 3px 5px #777777;
-moz-box-shadow: 3px 3px 5px #777777;
-webkit-box-shadow: 3px 3px 5px #777777;
-khtml-box-shadow: 3px 3px 5px #777777;
}
 
.textbox.black
{
color: #ffffff;
background-color: #000000;
border: 1px solid #505050;
 
box-shadow: 3px 3px 5px #808080;
-moz-box-shadow: 3px 3px 5px #808080;
-webkit-box-shadow: 3px 3px 5px #808080;
-khtml-box-shadow: 3px 3px 5px #808080;
}
 
.textbox.black .textbox-head,
table.textbox.black caption
{
color: #ffffff;
background-color: #404040;
 
box-shadow: 3px 3px 5px #808080;
-moz-box-shadow: 3px 3px 5px #808080;
-webkit-box-shadow: 3px 3px 5px #808080;
-khtml-box-shadow: 3px 3px 5px #808080;
}
 
 
/*?
*****************************************************************************
***                        textbox table colors                          ***
*****************************************************************************/
 
table.textbox.video.bug th,
table.textbox.red th
{
color: #000000;
background-color: #ffd0d0;
}
 
table.textbox.video.bug.alt tr:nth-child(odd) th,
table.textbox.red.alt tr:nth-child(odd) th
{
background-color: #f0b0b0;
}
 
table.textbox.video.bug.alt tr:nth-child(odd) td,
table.textbox.video.bug tr.alt td,
table.textbox.red.alt tr:nth-child(odd) td,
table.textbox.red tr.alt td
{
background-color: #f0d0d0;
}
 
table.textbox.video.bug.alt tr.headline th,
table.textbox.video.bug tr.headline th,
table.textbox.headline.video.bug.alt tr:nth-child(1) th,
table.textbox.headline.video.bug tr:nth-child(1) th,
table.textbox.red.alt tr.headline th,
table.textbox.red tr.headline th,
table.textbox.headline.red.alt tr:nth-child(1) th,
table.textbox.headline.red tr:nth-child(1) th
{
background-color: #ffa0a0;
}
 
table.textbox.video.bug tr:hover th,
table.textbox.video.bug tr:hover td,
table.textbox.video.bug.alt tr:hover:nth-child(odd) th,
table.textbox.video.bug.alt tr:hover:nth-child(odd) td,
table.textbox.red tr:hover th,
table.textbox.red tr:hover td,
table.textbox.red.alt tr:hover:nth-child(odd) th,
table.textbox.red.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
 
table.grid.video.bug th,
table.grid.video.bug td,
table.grid.red th,
table.grid.red td
{
border: 1px solid #a00000;
}
 
/*-------------------------*/
 
table.textbox.orange th
{
color: #000000;
background-color: #ffe0c0;
}
 
table.textbox.orange.alt tr:nth-child(odd) th
{
background-color: #f0c0a0;
}
 
table.textbox.orange.alt tr:nth-child(odd) td,
table.textbox.orange tr.alt td
{
background-color: #f0e0c0;
}
 
table.textbox.orange.alt tr.headline th,
table.textbox.orange tr.headline th,
table.textbox.headline.orange.alt tr:nth-child(1) th,
table.textbox.headline.orange tr:nth-child(1) th
{
background-color: #ffb870;
}
 
table.textbox.orange tr:hover th,
table.textbox.orange tr:hover td,
table.textbox.orange.alt tr:hover:nth-child(odd) th,
table.textbox.orange.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
 
table.grid.orange th,
table.grid.orange td
{
border: 1px solid #e0a080;
}
 
/*-------------------------*/
 
table.textbox.yellow th
{
color: #000000;
background-color: #ffffc0;
}
 
table.textbox.yellow.alt tr:nth-child(odd) th
{
background-color: #f0f0a0;
}
 
table.textbox.yellow.alt tr:nth-child(odd) td,
table.textbox.yellow tr.alt td
{
background-color: #f0f0c0;
}
 
table.textbox.yellow.alt tr.headline th,
table.textbox.yellow tr.headline th,
table.textbox.headline.yellow.alt tr:nth-child(1) th,
table.textbox.headline.yellow tr:nth-child(1) th
{
background-color: #ffff70;
}
 
table.textbox.yellow tr:hover th,
table.textbox.yellow tr:hover td,
table.textbox.yellow.alt tr:hover:nth-child(odd) th,
table.textbox.yellow.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #f0c0a0;
}
 
table.grid.yellow th,
table.grid.yellow td
{
border: 1px solid #808000;
}
 
/*-------------------------*/
 
table.textbox.video.tutorial th,
table.textbox.green th
{
color: #000000;
background-color: #d0ffd0;
}
 
table.textbox.video.tutorial.alt tr:nth-child(odd) th,
table.textbox.green.alt tr:nth-child(odd) th
{
background-color: #b0f0b0;
}
 
table.textbox.video.tutorial.alt tr:nth-child(odd) td,
table.textbox.video.tutorial tr.alt td,
table.textbox.green.alt tr:nth-child(odd) td,
table.textbox.green tr.alt td
{
background-color: #d0f0d0;
}
 
table.textbox.video.tutorial.alt tr.headline th,
table.textbox.video.tutorial tr.headline th,
table.textbox.headline.video.tutorial.alt tr:nth-child(1) th,
table.textbox.headline.video.tutorial tr:nth-child(1) th,
table.textbox.green.alt tr.headline th,
table.textbox.green tr.headline th,
table.textbox.headline.green.alt tr:nth-child(1) th,
table.textbox.headline.green tr:nth-child(1) th
{
background-color: #80ff80;
}
 
table.textbox.video.tutorial tr:hover th,
table.textbox.video.tutorial tr:hover td,
table.textbox.video.tutorial.alt tr:hover:nth-child(odd) th,
table.textbox.video.tutorial.alt tr:hover:nth-child(odd) td,
table.textbox.green tr:hover th,
table.textbox.green tr:hover td,
table.textbox.green.alt tr:hover:nth-child(odd) th,
table.textbox.green.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
 
table.grid.video.tutorial th,
table.grid.video.tutorial td,
table.grid.green th,
table.grid.green td
{
border: 1px solid #00a000;
}
 
/*-------------------------*/
 
table.textbox.news th,
table.textbox.cyan th
{
color: #000000;
background-color: #c0ffff;
}
 
table.textbox.news.alt tr:nth-child(odd) th,
table.textbox.cyan.alt tr:nth-child(odd) th
{
background-color: #a0f0f0;
}
 
table.textbox.news.alt tr:nth-child(odd) td,
table.textbox.news tr.alt td,
table.textbox.cyan.alt tr:nth-child(odd) td,
table.textbox.cyan tr.alt td
{
background-color: #d0f0f0;
}
 
table.textbox.news.alt tr.headline th,
table.textbox.news tr.headline th,
table.textbox.headline.news.alt tr:nth-child(1) th,
table.textbox.headline.news tr:nth-child(1) th,
table.textbox.cyan.alt tr.headline th,
table.textbox.cyan tr.headline th,
table.textbox.headline.cyan.alt tr:nth-child(1) th,
table.textbox.headline.cyan tr:nth-child(1) th
{
background-color: #60ffff;
}
 
table.textbox.news tr:hover th,
table.textbox.news tr:hover td,
table.textbox.news.alt tr:hover:nth-child(odd) th,
table.textbox.news.alt tr:hover:nth-child(odd) td,
table.textbox.cyan tr:hover th,
table.textbox.cyan tr:hover td,
table.textbox.cyan.alt tr:hover:nth-child(odd) th,
table.textbox.cyan.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
 
table.grid.news th,
table.grid.news td,
table.grid.cyan th,
table.grid.cyan td
{
border: 1px solid #008080;
}
 
/*-------------------------*/
 
table.textbox th,
table.textbox.video th,
table.textbox.blue th
{
color: #000000;
background-color: #d0d0ff;
}
 
table.textbox.alt tr:nth-child(odd) th,
table.textbox.video.alt tr:nth-child(odd) th,
table.textbox.blue.alt tr:nth-child(odd) th
{
background-color: #b0b0f0;
}
 
table.textbox.alt tr:nth-child(odd) td,
table.textbox tr.alt td,
table.textbox.video.alt tr:nth-child(odd) td,
table.textbox.video tr.alt td,
table.textbox.blue.alt tr:nth-child(odd) td,
table.textbox.blue tr.alt td
{
background-color: #d0d0f0;
}
 
table.textbox.alt tr.headline th,
table.textbox tr.headline th,
table.textbox.headline.alt tr:nth-child(1) th,
table.textbox.headline tr:nth-child(1) th,
table.textbox.video.alt tr.headline th,
table.textbox.video tr.headline th,
table.textbox.headline.video.alt tr:nth-child(1) th,
table.textbox.headline.video tr:nth-child(1) th,
table.textbox.blue.alt tr.headline th,
table.textbox.blue tr.headline th,
table.textbox.headline.blue.alt tr:nth-child(1) th,
table.textbox.headline.blue tr:nth-child(1) th
{
background-color: #8080ff;
}
 
table.textbox tr:hover th,
table.textbox tr:hover td,
table.textbox.alt tr:hover:nth-child(odd) th,
table.textbox.alt tr:hover:nth-child(odd) td,
table.textbox.video tr:hover th,
table.textbox.video tr:hover td,
table.textbox.video.alt tr:hover:nth-child(odd) th,
table.textbox.video.alt tr:hover:nth-child(odd) td,
table.textbox.blue tr:hover th,
table.textbox.blue tr:hover td,
table.textbox.blue.alt tr:hover:nth-child(odd) th,
table.textbox.blue.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
 
table.grid th,
table.grid td,
table.grid.video th,
table.grid.video td,
table.grid.blue th,
table.grid.blue td
{
border: 1px solid #0000a0;
}
 
/*-------------------------*/
 
table.textbox.magenta th
{
color: #000000;
background-color: #ffd0ff;
}
 
table.textbox.magenta.alt tr:nth-child(odd) th
{
background-color: #f0b0f0;
}
}


table.textbox.magenta.alt tr:nth-child(odd) td,
.tooltip .tooltiptext {
table.textbox.magenta tr.alt td
    visibility: hidden;
{
    max-width: 125px;
background-color: #f0c8f0;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 2px;
   
    position: absolute;
    top: 145%;
    left: 0%;
    margin-left: -50%;
}
}


table.textbox.magenta.alt tr.headline th,
.tooltip:hover .tooltiptext {
table.textbox.magenta tr.headline th,
    visibility: visible;
table.textbox.headline.magenta.alt tr:nth-child(1) th,
table.textbox.headline.magenta tr:nth-child(1) th
{
background-color: #ff70ff;
}
}
 
.tooltip .tooltiptext::after {
table.textbox.magenta tr:hover th,
    content: " ";
table.textbox.magenta tr:hover td,
    position: absolute;
table.textbox.magenta.alt tr:hover:nth-child(odd) th,
    bottom: 100%;
table.textbox.magenta.alt tr:hover:nth-child(odd) td
    left: 50%;
{
    margin-left: -5px;
color: #000000;
    border-width: 5px;
background-color: #ffff80;
    border-style: solid;
    border-color: transparent transparent black transparent;
}
}


table.grid.magenta th,
.itemwindow img
table.grid.magenta td
{
{
border: 1px solid #700070;
margin: 0px -5px 0px -5px;
}
}


/*-------------------------*/
/* this is for a niche purpose on the Assignment 53 article */
 
/* made necessary due to how mediawiki handles thumbnails */
table.textbox.white th
.a53
{
{
color: #000000;
background-color: #b0b0b0;
}
}
 
.a53 a img
table.textbox.white.alt tr:nth-child(odd) th
{
{
background-color: #a0a0a0;
width:100%;
height:auto;
}
}
 
/* these classes are here because the css sanitiser will strip the url() clause otherwise */
table.textbox.white.alt tr:nth-child(odd) td,
.a53wp
table.textbox.white tr.alt td
{
{
background-color: #e0e0e0;
color:inherit;background: #28332e url('images/8/8b/Assignment_53_1-bg.png') repeat-x center bottom;
}
}


table.textbox.white.alt tr.headline th,
.a53wp2
table.textbox.white tr.headline th,
table.textbox.headline.white.alt tr:nth-child(1) th,
table.textbox.headline.white tr:nth-child(1) th
{
{
background-color: #f0f0f0;
color:inherit;background: #28332e url('images/thumb/8/8b/Assignment_53_1-bg.png/640px-Assignment_53_1-bg.png') repeat-x center bottom;
}
}


table.textbox.white tr:hover th,
table.textbox.white tr:hover td,
table.textbox.white.alt tr:hover:nth-child(odd) th,
table.textbox.white.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}


table.grid.white th,
.a53oz
table.grid.white td
{
{
border: 1px solid #c0c0c0;
color:inherit;background: #693a5e url('images/6/6c/Assignment_53_2_bg.png') repeat-x center bottom;
}
}


/*-------------------------*/
.a53oz2
 
table.textbox.video.original th,
table.textbox.gray th
{
{
color: #000000;
color:inherit;background: #693a5e url('images/thumb/6/6c/Assignment_53_2_bg.png/640px-Assignment_53_2_bg.png') repeat-x center bottom;
background-color: #c0c0c0;
}
}


table.textbox.video.original.alt tr:nth-child(odd) th,
.a53ws
table.textbox.gray.alt tr:nth-child(odd) th
{
{
background-color: #b0b0b0;
color:inherit;background: #642f61 url('images/8/8e/Assignment_53_3_bg.png') repeat-x center bottom;
}
}


table.textbox.video.original.alt tr:nth-child(odd) td,
.a53ws2
table.textbox.video.original tr.alt td,
table.textbox.gray.alt tr:nth-child(odd) td,
table.textbox.gray tr.alt td
{
{
background-color: #d0d0d0;
color:inherit;background: #642f61 url('images/thumb/8/8e/Assignment_53_3_bg.png/640px-Assignment_53_3_bg.png') repeat-x center bottom;
}
}
table.textbox.video.original.alt tr.headline th,
table.textbox.video.original tr.headline th,
table.textbox.headline.video.original.alt tr:nth-child(1) th,
table.textbox.headline.video.original tr:nth-child(1) th,
table.textbox.gray.alt tr.headline th,
table.textbox.gray tr.headline th,
table.textbox.headline.gray.alt tr:nth-child(1) th,
table.textbox.headline.gray tr:nth-child(1) th
{
background-color: #a0a0a0;
}
table.textbox.video.original tr:hover th,
table.textbox.video.original tr:hover td,
table.textbox.video.original.alt tr:hover:nth-child(odd) th,
table.textbox.video.original.alt tr:hover:nth-child(odd) td,
table.textbox.gray tr:hover th,
table.textbox.gray tr:hover td,
table.textbox.gray.alt tr:hover:nth-child(odd) th,
table.textbox.gray.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
table.grid.video.original th,
table.grid.video.original td,
table.grid.gray th,
table.grid.gray td
{
border: 1px solid #606060;
}
/*-------------------------*/
table.textbox.black th
{
color: #ffffff;
background-color: #808080;
}
table.textbox.black.alt tr:nth-child(odd) th
{
background-color: #a0a0a0;
}
table.textbox.black.alt tr:nth-child(odd) td,
table.textbox.black tr.alt td
{
background-color: #303030;
}
table.textbox.black.alt tr.headline th,
table.textbox.black tr.headline th,
table.textbox.headline.black.alt tr:nth-child(1) th,
table.textbox.headline.black tr:nth-child(1) th
{
background-color: #606060;
}
table.textbox.black tr:hover th,
table.textbox.black tr:hover td,
table.textbox.black.alt tr:hover:nth-child(odd) th,
table.textbox.black.alt tr:hover:nth-child(odd) td
{
color: #000000;
background-color: #ffff80;
}
table.grid.black th,
table.grid.black td
{
border: 1px solid #505050;
}
/*-------------------------*/
/*?
*****************************************************************************
***                          wikitable support                          ***
*****************************************************************************/
table.wikitable.alt tr:nth-child(even) th,
table.wikitable.alt tr:nth-child(even) td
{
background-color: #e0e0e0;
}
/*?
*****************************************************************************
***                        textbox table alignment                        ***
*****************************************************************************/
table.textbox
{
border-collapse: collapse;
margin: 0 0 1em 0;
-moz-border-radius: 0 0 5px 5px;
-webkit-border-radius: 0 0 5px 5px;
-khtml-border-radius: 0 0 5px 5px;
border-radius: 0 0 5px 5px;
}
table.textbox th,
table.textbox td
{
/* text-align: left; */
padding: 0.1em 0.4em;
}
table.center th,
table.center td
{
text-align: center;
padding: 0.1em 0.2em;
}
/*
*****************************************************************************
***                                floats                                ***
*****************************************************************************/
table.textbox.float-right
{
float: right;
width: 280px;
margin: 0 0 1em 1.5em;
}
table.textbox.float-left
{
float: left;
width: 280px;
margin: 0 1.5em 1em 0;
}
div.float-right
{
float: right;
width: 280px;
margin: 0 0 0.2em 1.5em;
padding: 0;
}
div.float-right-min
{
float: right;
min-width: 280px;
margin: 0 0 0.2em 1.5em;
padding: 0;
}
div.float-right table.textbox.float-right
{
float: none;
width: 280px;
margin: 0 0 1em 0;
}
div.float-left table.textbox.float-left
{
float: none;
width: 280px;
margin: 0 0 1em 0;
}
/*
*****************************************************************************
***                            multi column                              ***
*****************************************************************************/
.multi-col
{
width: 100%;
padding: 0;
margin: 0.5em 0;
border-collapse: collapse;
border-spacing: 10px;
}
.multi-col .left-col
{
vertical-align: top;
padding-right: 0.4em;
margin: 0;
min-width: 25%;
}
.multi-col .mid-col
{
vertical-align: top;
padding-left: 0.4em;
padding-right: 0.4em;
margin: 0;
min-width: 25%;
}
.multi-col .right-col
{
vertical-align: top;
padding-left: 0.4em;
margin: 0;
min-width: 25%;
}
/*
*****************************************************************************
***                                spacing                                ***
*****************************************************************************/
h2
{
margin-top: 1.2em;
}
h3
{
margin-top: 0.6em;
}
dl
{
margin-top: 0.5em;
margin-bottom: 0em;
}
dl + ul
{
margin-top: 0em;
}
/**************************************************************************/
/*** rating support ***/
/**************************************************************************/
table.rating td
{
text-align: center;
padding: 0.3em;
}
table.rating td.rate
{
font-weight: bold;
padding-top: 1em;
}
table.rating td.rate .value
{
color: #000080;
font-size: 160%;
}
/*
*****************************************************************************
***                                youtube                                ***
*****************************************************************************/
div.youtube .thumbcaption
{
text-align: center;
}
/*
*****************************************************************************
***                                  END                                  ***
*****************************************************************************/

Latest revision as of 11:21, 4 June 2017

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

/*HD's hallowe'en decorations

.pBody ul, ul{list-style-image:url(http://pinkpt.com/neodex/images/3/3b/Trade_accept.png);
list-style-position:inside; margin-left:-3px;}
body{background:#f9f9f9 url(http://www.pinkpt.com/images/others/hallo_bg.png);}*/

/*Hide title on main page*/

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

/* [[:Template:BattleInfo]] classes */

.battledome
{
 border: solid 5px #ddaaaa;
}

.islanddome
{
 border: solid 5px #aaddaa;
}

.snowdome
{
 border: solid 5px #bbbbff;
}

.stonedome
{
 border: solid 5px #ffeebb;
}

.spacedome
{
 border: solid 5px #222222;
}

.waterdome
{
 border: solid 5px #0000ee;
}

.tyranniandome
{
 border: solid 5px #7c3709;
}

/* collapsible tables css (see also common.js) */

table.collapsed tr.collapsable {
	display: none;
}

/*added in to fix collapsed button size anomaly */
table.wikitable tr th { font-size:10pt; } 
 
.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;
	font-family:monospace;
	font-size:inherit;
}

.giveborder img
{
border: 1px solid #000;
}

.multimage
{
border:1px solid #ccc;
}

/* tooltip css shamelessly lifted from a w3schools' example */

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 2px double rgba(0,0,0,0.5);
}

.tooltip .tooltiptext {
    visibility: hidden;
    max-width: 125px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 2px;
    
    position: absolute;
    top: 145%;
    left: 0%;
    margin-left: -50%;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}
.tooltip .tooltiptext::after {
    content: " ";
    position: absolute;
    bottom: 100%; 
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent black transparent;
}

.itemwindow img
{
margin: 0px -5px 0px -5px;
}

/* this is for a niche purpose on the Assignment 53 article */
/* made necessary due to how mediawiki handles thumbnails */
.a53
{
}
.a53 a img
{
	width:100%;
	height:auto;
}
/* these classes are here because the css sanitiser will strip the url() clause otherwise */
.a53wp
{
color:inherit;background: #28332e url('images/8/8b/Assignment_53_1-bg.png') repeat-x center bottom;
}

.a53wp2
{
color:inherit;background: #28332e url('images/thumb/8/8b/Assignment_53_1-bg.png/640px-Assignment_53_1-bg.png') repeat-x center bottom;
}


.a53oz
{
color:inherit;background: #693a5e url('images/6/6c/Assignment_53_2_bg.png') repeat-x center bottom;
}

.a53oz2
{
color:inherit;background: #693a5e url('images/thumb/6/6c/Assignment_53_2_bg.png/640px-Assignment_53_2_bg.png') repeat-x center bottom;
}

.a53ws
{
color:inherit;background: #642f61 url('images/8/8e/Assignment_53_3_bg.png') repeat-x center bottom;
}

.a53ws2
{
color:inherit;background: #642f61 url('images/thumb/8/8e/Assignment_53_3_bg.png/640px-Assignment_53_3_bg.png') repeat-x center bottom;
}