Difference between revisions of "MediaWiki:Common.css"

From Team Fortress Wiki
Jump to: navigation, search
m (+ 'Stache)
m (Add .view-selector-[red/blu]-[right/left/full])
 
(150 intermediate revisions by 9 users not shown)
Line 1: Line 1:
−
/* This
+
/* This CSS file no longer needs to be minified. */
 +
 
 +
/* UTILITY CLASSES */
 +
/* Flexbox */
 +
.flex {
 +
display: flex;
 +
}
 +
 
 +
.flex-center {
 +
justify-content: center;
 +
}
 +
 
 +
.flex-column {
 +
    flex-direction: column;
 +
}
 +
 
 +
.flex-column-reverse {
 +
    flex-direction: column-reverse;
 +
}
 +
 
 +
/* IMAGES */
 +
/* Remove white border from thumbnails */
 +
div.thumb  { border: none; }
 +
div.tright { border: none; margin: 0.5em 0 0.8em 1.4em; }
 +
div.tleft  { border: none; margin: 0.5em 1.4em 0.8em 0; }
 +
 
 +
/* Put a chequered background behind images, only visible if they have transparency */
 +
.gallerybox .thumb img,
 +
#file img { background: white url("/w/images/5/5d/Checker-16x16.png") repeat; }
 +
.gallerybox .thumb img:hover,
 +
#file img:hover { background: white url("/w/images/b/b3/Checker-16x16_Dark.png") repeat; }
 +
 
 +
/* But not on articles, user pages, portals or with opt-out. */
 +
.ns-0 .gallerybox .thumb img,
 +
.ns-2 .gallerybox .thumb img,
 +
.ns-100 .gallerybox .thumb img,
 +
.nochecker .gallerybox .thumb img {
 +
    background: #f9f9f9;
 +
}
 +
/* Add alternative "dark" style for galleries  */
 +
.dark .gallerybox .thumb {
 +
background-image: url("/w/images/b/b3/Checker-16x16_Dark.png");
 +
}
 +
 
 +
.dark .gallerybox .thumb img {
 +
background-color: transparent;
 +
}
 +
 
 +
/* END IMAGES */
 +
 
 +
/* Special icons for wikipedia and archive.org */
 +
a.external[href*="archive.org"] {
 +
    background: url("/w/images/9/93/Internet_Archive_logotype.png") center right/15px no-repeat;
 +
    padding-right: 17px;
 +
}
 +
 
 +
a.extiw[href*="wikipedia.org"] {
 +
    background: url("/w/images/d/d5/Wikipedia_logotype.png") center right/15px no-repeat;
 +
    padding-right: 17px;
 +
}
 +
 
 +
/* Remove icons */
 +
.plainlinks a.external[href*="archive.org"],
 +
.plainlinks a.extiw[href*="wikipedia.org"] {
 +
    background: unset;
 +
    padding-right: unset;
 +
}
 +
 
 +
/* Give [[Media:]] file links a special icon */
 +
a[href$=".wav"].internal,
 +
a[href$=".mp3"].internal {
 +
    background: url("/w/images/4/46/Icon_external_link_wav.png") center right no-repeat;
 +
    padding-right: 16px;
 +
}
 +
 
 +
/* <ref> fixes from [[wikipedia:MediaWiki:Common.css]] */
 +
sup, sub                  { line-height: 1em; }
 +
ol.references            { font-size: 90%; }
 +
.references-small        { font-size: 80%;}
 +
ol.references > li:target { background-color: #ddeeff; }
 +
sup.reference:target      { background-color: #ddeeff; }
 +
 
 +
/* Overflow by default */
 +
pre { overflow: auto; }
 +
 
 +
/* Class hat table nesting on [[Hats]] */
 +
table.navbox-hatsnest tr#navbox-colheader-tr,
 +
table.navbox-hatsnest tr#navbox-rowspacing,
 +
table.navbox-hatsnest .navbox-miscitem {
 +
  display: none;
 +
}
 +
table.navbox-hatsnest {
 +
  margin: 0em !important;
 +
}
 +
 
 +
/* Marking redirects  */
 +
.allpagesredirect, .watchlistredir, .redirect-in-category {
 +
    font-style: italic;
 +
}
 +
 
 +
/* Consistent widths of category & prefixindex tables */
 +
.ns-14 div#mw-subcategories td,
 +
.ns-14 div#mw-pages td,
 +
#mw-prefixindex-list-table td {
 +
    width: 33%;
 +
}
 +
 
 +
/* Force link color to #FFF */
 +
.white-link a {
 +
    color: #FFF !important;
 +
}
 +
 
 +
/*** START styles for wiki-tooltip ***/
 +
.wiki-tooltip {
 +
    position: relative;
 +
}
 +
 
 +
.wiki-tooltip .wiki-tooltip-content {
 +
    position: absolute;
 +
    top: 20px;
 +
    display: flex;
 +
    align-items: center;
 +
    color: #222222;
 +
    background-color: #FFFCF7;
 +
    padding: 5px;
 +
    font-weight: 400;
 +
    -webkit-pointer-events: none;
 +
    pointer-events: none;
 +
    -webkit-transition: opacity .2s ease-in-out;
 +
    transition: opacity .2s ease-in-out;
 +
    white-space: nowrap;
 +
    box-shadow: 0 30px 90px -20px rgb(0 0 0 / 30%), 0 0 1px 1px rgb(0 0 0 / 5%);
 +
    opacity: 0;
 +
    z-index: 9;
 +
}
 +
 
 +
.wiki-tooltip .wiki-tooltip-content a {
 +
    width: 20px;
 +
    height: 20px;
 +
    margin-top: 1px;
 +
    margin-left: 5px;
 +
    background: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 fill=%22%233F56AD%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Elink%3C/title%3E%3Cpath d=%22M4.83 15h2.91a4.88 4.88 0 0 1-1.55-2H5a3 3 0 1 1 0-6h3a3 3 0 0 1 2.82 4h2.1a4.82 4.82 0 0 0 .08-.83v-.34A4.83 4.83 0 0 0 8.17 5H4.83A4.83 4.83 0 0 0 0 9.83v.34A4.83 4.83 0 0 0 4.83 15z%22/%3E%3Cpath d=%22M15.17 5h-2.91a4.88 4.88 0 0 1 1.55 2H15a3 3 0 1 1 0 6h-3a3 3 0 0 1-2.82-4h-2.1a4.82 4.82 0 0 0-.08.83v.34A4.83 4.83 0 0 0 11.83 15h3.34A4.83 4.83 0 0 0 20 10.17v-.34A4.83 4.83 0 0 0 15.17 5z%22/%3E%3C/svg%3E") no-repeat;
 +
}
 +
 
 +
.infobox-label a:hover .wiki-tooltip-content,
 +
.wiki-tooltip:hover .wiki-tooltip-content {
 +
    opacity: 1;
 +
    -webkit-pointer-events: auto;
 +
    pointer-events: auto;
 +
}
 +
 
 +
.infobox-label .wiki-tooltip {
 +
    position: relative;
 +
    margin-left: 20px;
 +
}
 +
 
 +
.infobox-label .wiki-tooltip:before {
 +
    content: '';
 +
    position: absolute;
 +
    left: -20px;
 +
    width: 22px;
 +
    height: 22px;
 +
    background: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 fill=%22%233F56AD%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Einfo%3C/title%3E%3Cpath d=%22M9.5 16A6.61 6.61 0 0 1 3 9.5 6.61 6.61 0 0 1 9.5 3 6.61 6.61 0 0 1 16 9.5 6.63 6.63 0 0 1 9.5 16zm0-14A7.5 7.5 0 1 0 17 9.5 7.5 7.5 0 0 0 9.5 2zm.5 6v4.08h1V13H8.07v-.92H9V9H8V8zM9 6h1v1H9z%22/%3E%3C/svg%3E") no-repeat;
 +
}
 +
/*** END wiki-tooltip ***/
 +
 
 +
/* Hide 'Help with logging in' link on sign in page */
 +
#userloginForm #mw-userlogin-help {
 +
    display: none;
 +
}
 +
 
 +
/* Main Page styling */
 +
 
 +
.mp-content-table {
 +
    width: 100%;
 +
    background: #FEFBF6;                      /* Body background color */
 +
    border: 1px solid #79542B;                /* Main border color */
 +
}
 +
.mp-content-header {
 +
    font-size: 140%;
 +
    background: #F3A957;                      /* Header background color */
 +
    border: none;
 +
    border-bottom: 1px solid #79542B;        /* Main border color */
 +
    padding-top:10px;
 +
    padding-bottom:10px;
 +
    margin:-3px;
 +
    padding:10px;
 +
}
 +
div.mp-content-header-alt {
 +
    background: #F3A957;                      /* Header background color */
 +
    font-size: 140%;
 +
    font-weight: bold;
 +
    border: none;
 +
    border-bottom: 1px solid #79542B;        /* Main border color */
 +
    text-align: left;
 +
    color: #000;
 +
    padding-top:10px;
 +
    padding-bottom:10px;
 +
    margin:-3px;
 +
    padding:10px;
 +
}
 +
/* Don't wordwrap top links on main page */
 +
.mp-content-table ul > li a.external.text, .mp-content-table ul > li > b > a
 +
{
 +
    white-space: nowrap;
 +
}
 +
 
 +
/** Main Page event styles **/
 +
@font-face {
 +
    font-family: 'SamdanEvil';
 +
    font-style: normal;
 +
    font-weight: 400;
 +
    src: local('SamdanEvil'), url('https://fonts.cdnfonts.com/s/3415/SamdanEvil.woff') format('woff');
 +
}
 +
 
 +
.mp-event-container,
 +
.mp-event-image,
 +
.mp-event-video {
 +
width: 100%;
 +
height: 100%;
 +
}
 +
 
 +
.mp-event-image,
 +
.mp-event-video {
 +
    object-fit: cover;
 +
}
 +
 
 +
.mp-event-overlay::before {
 +
    content: '';
 +
    position: absolute;
 +
    top: 0;
 +
    left: 0;
 +
    width: 100%;
 +
    height: 100%;
 +
    background-color: rgba(0, 0, 0, 0.5);
 +
}
 +
 
 +
.mp-event-text {
 +
    top: 0;
 +
    display: flex;
 +
    justify-content: center;
 +
    align-items: center;
 +
    width: 100%;
 +
    height: 100%;
 +
    color: #fff;
 +
    font-family: 'TF2 Build', sans-serif;
 +
    font-size: 2.5vw;
 +
    font-weight: 600;
 +
}
 +
 
 +
.mp-event-text div {
 +
    position: relative;
 +
}
 +
 
 +
[data-mp-event="smissmas"] .mp-event-text {
 +
    color: #F0F8FF;
 +
    font-family: 'TF2 Build', sans-serif;
 +
    font-size: 2.5vw;
 +
    text-shadow: 2px -2px 0 #E91E63, -2px 2px 0 #E91E63, 2px 2px 0 #E91E63;
 +
}
 +
 
 +
[data-mp-event="summer"] .mp-event-text {
 +
    color: #FFF2B3;
 +
    font-family: 'TF2', sans-serif;
 +
    font-size: 3vw;
 +
    text-shadow: 2px -2px 0 #F3A957, -2px 2px 0 #F9D483, 2px 2px 0 #F3A957;
 +
}
 +
 
 +
[data-mp-event="scream-fortress"] .mp-event-text {
 +
    color: #212121;
 +
    font-family: 'SamdanEvil', sans-serif;
 +
    font-size: 3.5vw;
 +
    text-shadow: 2px -2px 0 #3eb788, -2px 2px 0 #38F3AB, 2px 2px 0 #38F3AB;
 +
}
 +
 
 +
.mp-event-duration {
 +
    top: 10vw;
 +
    left: 0;
 +
    right: 0;
 +
    margin

Latest revision as of 23:09, 4 December 2024

/* This CSS file no longer needs to be minified. */

/* UTILITY CLASSES */
/* Flexbox */
.flex {
	display: flex;
}

.flex-center {
	justify-content: center;
}

.flex-column {
    flex-direction: column;
}

.flex-column-reverse {
    flex-direction: column-reverse;
}

/* IMAGES */
/* Remove white border from thumbnails */
div.thumb  { border: none; }
div.tright { border: none; margin: 0.5em 0 0.8em 1.4em; }
div.tleft  { border: none; margin: 0.5em 1.4em 0.8em 0; }

/* Put a chequered background behind images, only visible if they have transparency */
.gallerybox .thumb img,
#file img { background: white url("/w/images/5/5d/Checker-16x16.png") repeat; }
.gallerybox .thumb img:hover,
#file img:hover { background: white url("/w/images/b/b3/Checker-16x16_Dark.png") repeat; }

/* But not on articles, user pages, portals or with opt-out. */
.ns-0 .gallerybox .thumb img,
.ns-2 .gallerybox .thumb img,
.ns-100 .gallerybox .thumb img,
.nochecker .gallerybox .thumb img {
    background: #f9f9f9;
}
/* Add alternative "dark" style for galleries  */
.dark .gallerybox .thumb {
	background-image: url("/w/images/b/b3/Checker-16x16_Dark.png");
}

.dark .gallerybox .thumb img {
	background-color: transparent;
}

/* END IMAGES */

/* Special icons for wikipedia and archive.org */
a.external[href*="archive.org"] {
    background: url("/w/images/9/93/Internet_Archive_logotype.png") center right/15px no-repeat;
    padding-right: 17px;
}

a.extiw[href*="wikipedia.org"] {
    background: url("/w/images/d/d5/Wikipedia_logotype.png") center right/15px no-repeat;
    padding-right: 17px;
}

/* Remove icons */
.plainlinks a.external[href*="archive.org"],
.plainlinks a.extiw[href*="wikipedia.org"] {
    background: unset;
    padding-right: unset;
}

/* Give [[Media:]] file links a special icon */
a[href$=".wav"].internal,
a[href$=".mp3"].internal {
    background: url("/w/images/4/46/Icon_external_link_wav.png") center right no-repeat;
    padding-right: 16px;
}

/* <ref> fixes from [[wikipedia:MediaWiki:Common.css]] */
sup, sub                  { line-height: 1em; }
ol.references             { font-size: 90%; }
.references-small         { font-size: 80%;}
ol.references > li:target { background-color: #ddeeff; }
sup.reference:target      { background-color: #ddeeff; }

/* Overflow by default */
pre { overflow: auto; }

/* Class hat table nesting on [[Hats]] */
table.navbox-hatsnest tr#navbox-colheader-tr,
table.navbox-hatsnest tr#navbox-rowspacing,
table.navbox-hatsnest .navbox-miscitem {
   display: none;
}
table.navbox-hatsnest {
   margin: 0em !important;
}

/* Marking redirects  */
.allpagesredirect, .watchlistredir, .redirect-in-category {
    font-style: italic;
}

/* Consistent widths of category & prefixindex tables */
.ns-14 div#mw-subcategories td,
.ns-14 div#mw-pages td,
#mw-prefixindex-list-table td {
    width: 33%;
}

/* Force link color to #FFF */
.white-link a {
    color: #FFF !important;
}

/*** START styles for wiki-tooltip ***/
.wiki-tooltip {
    position: relative;
}

.wiki-tooltip .wiki-tooltip-content {
    position: absolute;
    top: 20px;
    display: flex;
    align-items: center;
    color: #222222;
    background-color: #FFFCF7;
    padding: 5px;
    font-weight: 400;
    -webkit-pointer-events: none;
    pointer-events: none;
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
    white-space: nowrap;
    box-shadow: 0 30px 90px -20px rgb(0 0 0 / 30%), 0 0 1px 1px rgb(0 0 0 / 5%);
    opacity: 0;
    z-index: 9;
}

.wiki-tooltip .wiki-tooltip-content a {
    width: 20px;
    height: 20px;
    margin-top: 1px;
    margin-left: 5px;
    background: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 fill=%22%233F56AD%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Elink%3C/title%3E%3Cpath d=%22M4.83 15h2.91a4.88 4.88 0 0 1-1.55-2H5a3 3 0 1 1 0-6h3a3 3 0 0 1 2.82 4h2.1a4.82 4.82 0 0 0 .08-.83v-.34A4.83 4.83 0 0 0 8.17 5H4.83A4.83 4.83 0 0 0 0 9.83v.34A4.83 4.83 0 0 0 4.83 15z%22/%3E%3Cpath d=%22M15.17 5h-2.91a4.88 4.88 0 0 1 1.55 2H15a3 3 0 1 1 0 6h-3a3 3 0 0 1-2.82-4h-2.1a4.82 4.82 0 0 0-.08.83v.34A4.83 4.83 0 0 0 11.83 15h3.34A4.83 4.83 0 0 0 20 10.17v-.34A4.83 4.83 0 0 0 15.17 5z%22/%3E%3C/svg%3E") no-repeat;
}

.infobox-label a:hover .wiki-tooltip-content,
.wiki-tooltip:hover .wiki-tooltip-content {
    opacity: 1;
    -webkit-pointer-events: auto;
    pointer-events: auto;
}

.infobox-label .wiki-tooltip {
    position: relative;
    margin-left: 20px;
}

.infobox-label .wiki-tooltip:before {
    content: '';
    position: absolute;
    left: -20px;
    width: 22px;
    height: 22px;
    background: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 fill=%22%233F56AD%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Einfo%3C/title%3E%3Cpath d=%22M9.5 16A6.61 6.61 0 0 1 3 9.5 6.61 6.61 0 0 1 9.5 3 6.61 6.61 0 0 1 16 9.5 6.63 6.63 0 0 1 9.5 16zm0-14A7.5 7.5 0 1 0 17 9.5 7.5 7.5 0 0 0 9.5 2zm.5 6v4.08h1V13H8.07v-.92H9V9H8V8zM9 6h1v1H9z%22/%3E%3C/svg%3E") no-repeat;
}
/*** END wiki-tooltip ***/

/* Hide 'Help with logging in' link on sign in page */
#userloginForm #mw-userlogin-help {
    display: none;
}

/* Main Page styling */

.mp-content-table {
    width: 100%;
    background: #FEFBF6;                      /* Body background color */
    border: 1px solid #79542B;                /* Main border color */
}
.mp-content-header {
    font-size: 140%;
    background: #F3A957;                      /* Header background color */
    border: none;
    border-bottom: 1px solid #79542B;         /* Main border color */
    padding-top:10px;
    padding-bottom:10px;
    margin:-3px;
    padding:10px;
}
div.mp-content-header-alt {
    background: #F3A957;                      /* Header background color */
    font-size: 140%;
    font-weight: bold;
    border: none;
    border-bottom: 1px solid #79542B;         /* Main border color */
    text-align: left;
    color: #000;
    padding-top:10px;
    padding-bottom:10px;
    margin:-3px;
    padding:10px;
}
/* Don't wordwrap top links on main page */
.mp-content-table ul > li a.external.text, .mp-content-table ul > li > b > a
{
    white-space: nowrap;
}

/** Main Page event styles **/
@font-face {
    font-family: 'SamdanEvil';
    font-style: normal;
    font-weight: 400;
    src: local('SamdanEvil'), url('https://fonts.cdnfonts.com/s/3415/SamdanEvil.woff') format('woff');
}

.mp-event-container,
.mp-event-image,
.mp-event-video {
	width: 100%;
	height: 100%;
}

.mp-event-image,
.mp-event-video {
    object-fit: cover;
}

.mp-event-overlay::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.mp-event-text {
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    color: #fff;
    font-family: 'TF2 Build', sans-serif;
    font-size: 2.5vw;
    font-weight: 600;
}

.mp-event-text div {
    position: relative;
}

[data-mp-event="smissmas"] .mp-event-text {
    color: #F0F8FF;
    font-family: 'TF2 Build', sans-serif;
    font-size: 2.5vw;
    text-shadow: 2px -2px 0 #E91E63, -2px 2px 0 #E91E63, 2px 2px 0 #E91E63;
}

[data-mp-event="summer"] .mp-event-text {
    color: #FFF2B3;
    font-family: 'TF2', sans-serif;
    font-size: 3vw;
    text-shadow: 2px -2px 0 #F3A957, -2px 2px 0 #F9D483, 2px 2px 0 #F3A957;
}

[data-mp-event="scream-fortress"] .mp-event-text {
    color: #212121;
    font-family: 'SamdanEvil', sans-serif;
    font-size: 3.5vw;
    text-shadow: 2px -2px 0 #3eb788, -2px 2px 0 #38F3AB, 2px 2px 0 #38F3AB;
}

.mp-event-duration {
    top: 10vw;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 0 4vw 0.3vw;
    text-shadow: none;
    font-family: 'TF2';
    width: fit-content;
    font-size: 1.5vw;
    color: #FFFCF7;
    background: linear-gradient(90deg, rgba(233, 30, 99, 0) 0%, #B0C4DE 50%, rgba(233, 30, 99, 0) 100%);
    line-height: 1;
}

[data-mp-event="summer"] .mp-event-duration {
    color: #FFF2B3;
    background: linear-gradient(90deg, rgba(233, 30, 99, 0) 0%, #F3A957 50%, rgba(233, 30, 99, 0) 100%);
}

[data-mp-event="smissmas"] .mp-event-duration {
    color: #ff8181;
    background: linear-gradient(90deg, rgba(233, 30, 99, 0) 0%, #e91e637f 50%, rgba(233, 30, 99, 0) 100%);
}

[data-mp-event="scream-fortress"] .mp-event-duration {
    color: #c09cff;
    background: linear-gradient(90deg, rgba(233, 30, 99, 0) 0%, #8650AC 50%, rgba(233, 30, 99, 0) 100%);
}

.mp-event-text,
.mp-event-duration {
	position: absolute;
}

.mp-event-text,
.mp-event-duration,
.mp-event-overlay::before {
    pointer-events: none;
}

/*** Main Page event festive lights ***/
.mp-event-smissmas.festive-wire {
	position: absolute;
	top: 5px;
	width: 100%;
	height: 5px;
	margin: 0;
	text-align: center;
	white-space: nowrap;
	pointer-events: none;
	box-shadow: inset 0px 0px 1px 1px rgb(0, 0, 0);
	z-index: 1;
}

.mp-event-smissmas .light-group {
	display: inline-block;

}

.mp-event-smissmas .light-group:first-child .lightbulb:first-child {
	margin-left: 50px;
}

.mp-event-smissmas .lightbulb {
	position: relative;
	display: inline-block;
	width: 10px;
	height: 30px;
	border-radius: 50%;
	margin: 5px 50px 0 0;
	background: #fff;
}

.mp-event-smissmas .lightbulb:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	margin: -1px;
	width: 12px;
	height: 10px;
	border-radius: 2px;
}

.mp-event-smissmas.festive-wire,
.mp-event-smissmas .lightbulb:before {
	background-color: #3E5D31;
}

.mp-event-smissmas .light-group.even .lightbulb {
	animation: 1.5s both light-group-even-flash-even infinite;
	-webkit-animation: 1.5s both light-group-even-flash-even infinite;
}

.mp-event-smissmas .light-group.even .lightbulb:nth-child(odd) {
	animation-name: light-group-even-flash-odd;
	-webkit-animation-name: light-group-even-flash-odd;
}

.mp-event-smissmas .light-group.odd .lightbulb {
	animation: 1.5s both light-group-odd-flash-even infinite;
	-webkit-animation: 1.5s both light-group-odd-flash-even infinite;
}

.mp-event-smissmas .light-group.odd .lightbulb:nth-child(odd) {
	animation-name: light-group-odd-flash-odd;
	-webkit-animation-name: light-group-odd-flash-odd;
}

/**** Main Page festive lights animation ****/
@keyframes light-group-even-flash-even {
  50% { background: rgb(0, 190, 255); box-shadow: 0px 2px 20px 4px rgba(0, 190, 255); }
  0%, 100% { background: rgb(20, 98, 152, .5); box-shadow: 0px 2px 20px 4px rgba(20, 98, 152, .5); }
}

@keyframes light-group-even-flash-odd {
  50% { background: rgba(0, 255, 0); box-shadow: 0px 2px 20px 4px rgba(0, 255, 0); }
  0%, 100% { background: rgba(20, 163, 49, .5); box-shadow: 0px 2px 20px 4px rgba(20, 163, 49, .5); }
}

@keyframes light-group-odd-flash-even {
  0%, 100% { background: rgb(255, 0, 61); box-shadow: 0px 2px 20px 4px rgba(255, 0, 61); }
  50% { background: rgb(110, 25, 45, .5); box-shadow: 0px 2px 20px 4px rgba(110, 25, 45, .5); }
}

@keyframes light-group-odd-flash-odd {
  0%, 100% { background: rgb(255, 198, 0); box-shadow: 0px 2px 20px 4px rgba(255, 198, 0); }
  50% { background: rgb(100, 84, 26, .5); box-shadow: 0px 2px 20px 4px rgba(100, 84, 26, .5); }
}

/* WebKit animation support */
@-webkit-keyframes light-group-even-flash-even {
  50% { background: rgb(0, 190, 255); box-shadow: 0px 2px 20px 4px rgba(0, 190, 255); }
  0%, 100% { background: rgb(20, 98, 152, .5); box-shadow: 0px 2px 20px 4px rgba(20, 98, 152, .5); }
}

@-webkit-keyframes light-group-even-flash-odd {
  50% { background: rgba(0, 255, 0); box-shadow: 0px 2px 20px 4px rgba(0, 255, 0); }
  0%, 100% { background: rgba(20, 163, 49, .5); box-shadow: 0px 2px 20px 4px rgba(20, 163, 49, .5); }
}

@-webkit-keyframes light-group-odd-flash-even {
  0%, 100% { background: rgb(255, 0, 61); box-shadow: 0px 2px 20px 4px rgba(255, 0, 61); }
  50% { background: rgb(110, 25, 45, .5); box-shadow: 0px 2px 20px 4px rgba(110, 25, 45, .5); }
}

@-webkit-keyframes light-group-odd-flash-odd {
  0%, 100% { background: rgb(255, 198, 0); box-shadow: 0px 2px 20px 4px rgba(255, 198, 0); }
  50% { background: rgb(100, 84, 26, .5); box-shadow: 0px 2px 20px 4px rgba(100, 84, 26, .5); }
}
/*** End Main Page styling ***/

/* Fix margins on [[MediaWiki:Sitenotice]] */
#siteNotice {
    margin-top: 0.5em;
    margin-bottom: -0.5em;
}

table.toc {
   margin-top: 1em;
   margin-bottom: 1em;
}

/*
   Allow limiting of which header levels are shown in a TOC;
   <div class="toclimit-3">, for instance, will limit to
   showing ==headings== and ===headings=== but no further
   (as long as there are no =headings= on the page, which
   there shouldn't be according to the MoS).

   From [[wikipedia:MediaWiki:Common.css]].

 */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
    display: none;
}

table.infobox {
   border:1px solid #79542B;
   background: #FFFCF7;
   margin: 0.5em 0 0.5em 1em;
   float: right;
   clear: right;
}

table.infobox th {
   font-size:1.2em;
   background-color:#F9D483;
}

table.infobox tr,td {
   margin:0em;
}

table.infobox .image {
   text-align: center;
}

table.infobox .caption {
   color: black;
}

table.infobox .borderless {
   border:0px;
}

/* {{Item infobox}} styling */
td.infobox-label {
    font-weight: bold;
    padding-left: 0.25em;
    vertical-align: top;
}

td.infobox-label a:visited {
    color: #3F56AD;
}

td.infobox-data {
    padding-right: 0.25em;
    vertical-align: top;
}

.infobox-team-skins img {
    padding: 5px 0;
}

.tf-kill-icon-tooltip a{cursor:help}
/* Format item box quality lists including their hex colors */
.quality-tag 			{text-align: center;background: none repeat scroll 0% 0% #24201B;padding: 3px 7px;margin: 2px;border-radius: 5px;display:inline-block;}
.tooltip-normal a:link, 	.tooltip-normal a:visited		{color:#B2B2B2;font-weight:bold;}
.tooltip-unique a:link,		.tooltip-unique a:visited		{color:#FFD700;font-weight:bold;}
.tooltip-vintage a:link,	.tooltip-vintage a:visited		{color:#476291;font-weight:bold;}
.tooltip-genuine a:link,	.tooltip-genuine a:visited		{color:#4D7455;font-weight:bold;}
.tooltip-strange a:link,	.tooltip-strange a:visited		{color:#CF6A32;font-weight:bold;}
.tooltip-unusual a:link,	.tooltip-unusual a:visited		{color:#8650AC;font-weight:bold;}
.tooltip-haunted a:link,	.tooltip-haunted a:visited		{color:#38F3AB;font-weight:bold;}
.tooltip-collectors a:link,	.tooltip-collectors a:visited	{color:#AA0000;font-weight:bold;}
.tooltip-decorated a:link,	.tooltip-decorated a:visited	{color:#FAFAFA;font-weight:bold;}
.tooltip-community a:link,	.tooltip-community a:visited,
.tooltip-self-made a:link,	.tooltip-self-made a:visited 	{color:#70B04A;font-weight:bold;}
.tooltip-valve a:link,		.tooltip-valve a:visited		{color:#A50F79;font-weight:bold;}

/* wikitable/prettytable class for skinning normal tables */

table,
table.diff,
td.diff-otitle,
td.diff-ntitle {
  background-color: transparent;
}

table.wikitable,
table.prettytable {
  background: #FFFCF7;
  margin: 0px;
  border: 1px #79542B solid;
}

table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td {
   background-color:#FFFCF7;
   white-space:inherit;
}

table.wikitable th,
table.prettytable th {
  text-align: center;
  white-space:inherit;
}

table.wikitable caption,
table.prettytable caption {
  margin-left: inherit;
  margin-right: inherit;
  font-weight: bold;
}

table.wikitable .subheader {
   font-size:1.2em;
   color: black;
   background-color:#ffd580;
   text-align: left;
}

table.wikitable .header {
   font-size:1.2em;
   color: black;
   background-color:#F3A957;
}

table.wikitable .border {
  border: 1px #79542B solid;
}

table.wikitable .borderless {
   border:0px;
}

table.wikitable .borderless td {
   border:0px;
}

table.wikitable .borderless th {
   border:0px;
}

.tf-color1 { background-color: #F3A957; }
.tf-color2 { background-color: #FFBE7E; }
.tf-color3 { background-color: #F9D483; }
.tf-color4 { background-color: #FFDDAD; }
.tf-color5 { background-color: #FEF5E0; }
.tf-color-bg { background-color: #FFFCF7; }

table.prettytable code,
table.wikitable code {
  background-color: transparent;
}

.grid {
  border: 1px #79542B solid;
  border-collapse: collapse;
  padding:0.4em;
}

.grid th,
.grid td {
  border: 1px #79542B solid;
  padding:0.1em 0.8em;
  white-space:inherit;
}

.nopad {
  border-collapse: collapse;
  padding-left: 0em;
  padding-right: 0em;
  border: 0;
}

.nopad th,
.nopad td {
  padding-left: 0em;
  padding-right: 0em;
  border: 0;
}

/* Pretty light-grey for visited links and other link stuffs. */
a.new:link {color: #BA0000}
a:link     {color: #3F56AD}
a:visited  {color: #75735F}

/* fmbox */
div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div.mw-newarticletext,
div#mw-protect-cascadeon,
.fmbox {
    clear: both;
    margin: 0.2em 0;
    background-color: #f9f9f9;
    border: 1px solid #aaa;
    padding: 0.125em 0.25em;
    margin: 3px auto;
    width: auto;
}

div.mw-warning-with-logexcerpt,   /* Lazy solution. */
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div.mw-newarticletext,
div#mw-protect-cascadeon {
	background-color: #fee;
    padding: 0.5em 1em;
	border: 1px solid #bb7070;
}

th.fmbox-text, td.fmbox-text {     /* The message body cell(s) */
    border: none;
    padding: 0em;       /* 0.9em left/right */
    width: 100%;    /* Make all mboxes the same width regardless of text length */
}
td.fmbox-image {                  /* The left image cell */
    border: none;
    padding: 2px 0 2px 0;    /* 0.9em left, 0px right */
    text-align: center;
}
td.fmbox-image2 {             /* The right image cell */
    border: none;
    padding: 2px 0 2px 0;    /* 0px left, 0.9em right */
    text-align: center;
}
td.fmbox-empty-cell {         /* An empty narrow cell */
    border: none;
    padding: 0px;
    width: 1px;
}

/* Prevents the 'Templates used on this page' list at the bottom of every edit page becoming too long. */
.templatesUsed {
    overflow: auto;
    height: 256px;
    border: 1px solid #aaa;
    padding: 0.5em;
}

/* Default skin for navigation boxes */
table.navbox {            /* Navbox container style */
  border: 1px solid #79542B;
  background-color:#FFFCF7;
  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 {				  /* Slight spacing between container and page content */
  margin-top: 1em !important;
}
.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: #FFFCF7;     /* Background color */
}
.navbox-list {
  border-color: #FFFCF7;   /* Must match background color */
}
.navbox-title,
table.navbox th {
  background: #F3A957;     /* Level 1 color */
}
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
  background: #F9D483;     /* Level 2 color */
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
  background: #FEF5E0;     /* Level 3 color */
}
.navbox tr {
   background-color:#FFFCF7;  /* Sandard cell background */
}
.navbox-even {
  background: #FEF5E0;     /* Even row striping */
}
.navbox-odd {
  background: transparent; /* Odd row striping */
}

/* START Map locations by Wookipan */
.map-locations .container {
    position: relative;
    width: 800px;
    margin: 1.5em;
}

.map-locations .wrapper {
	margin: 1.5em;
	font-size: 1rem;
	text-align: left;
}

.map-locations td > div:first-child {
	user-select: none;
}

.map-locations .list,
.map-locations .scroll-list {
	max-height: 220px;
	border: 1px solid #DDD;
	border-style: solid none;
	background-color: #FEFEFE;
}

.map-locations .scroll-list {
	overflow-x: auto;
	overflow-y: scroll;
}

.map-locations .list {
	display: flex;
}

.map-locations .list ul {
	list-style: upper-alpha;
}

.map-locations .scroll-list ul {
	list-style: decimal;
}

.map-locations .container .marker {
	display: flex;
	justify-content: center;
    position: absolute;
    color: #000;
    font-size: 20px;
    cursor: help;
}

.map-locations .container .marker.spawn-color {
	width: 33px;
	height: 46px;
}

.map-locations .container .marker.obj-color {
    width: 10px;
    height: 10px;
    border: 2px solid #000;
    border-radius: 100%;
}

.map-locations .container .marker.obj-color:hover {
	border-color: #646464;
}

.map-locations .container .marker.obj-color:hover::before {
    content: '';
    position: absolute;
    width: inherit;
    height: inherit;
    background-color: inherit;
    border-radius: inherit;
    filter: brightness(2.5);
    -webkit-filter: brightness(2.5);
}

.map-locations .container .marker:not(.spawn-color):not(.obj-color) {
	width: 33px;
	height: 31px;
	background: url(/w/images/1/19/Map_marker_circle.png) left / cover no-repeat;
}

.map-locations .container .marker.spawn-color.red {
	background: url(/w/images/8/88/Map_marker_red.png) left / cover no-repeat;
}

.map-locations .container .marker.spawn-color.blu {
	background: url(/w/images/b/b7/Map_marker_blue.png) left / cover no-repeat;
}

.map-locations .container .marker.spawn-color.mix {
	background: url(/w/images/1/13/Map_marker_mixed.png) left / cover no-repeat;
}

.map-locations .container .marker.obj-color.red {
    background-color: #CC4640;
    animation: pulsate-red 1s infinite;
	-webkit-animation: pulsate-red 1s infinite;
}

@keyframes pulsate-red {
   0% {box-shadow: 0 0 0 0 #d33;}
  90% {box-shadow: 0 0 0 10px #d330;}
  100% {box-shadow: 0 0 0 0 #d330;}
}

@-webkit-keyframes pulsate-red {
   0% {-webkit-box-shadow: 0 0 0 0 #d33;}
  90% {-webkit-box-shadow: 0 0 0 10px #d330;}
  100% {-webkit-box-shadow: 0 0 0 0 #d330;}
}

.map-locations .container .marker.obj-color.blu {
    background-color: #5B7A8C;
    animation: pulsate-blu 1s infinite;
	-webkit-animation: pulsate-blu 1s infinite;
}

@keyframes pulsate-blu {
   0% {box-shadow: 0 0 0 0 #36c;}
  90% {box-shadow: 0 0 0 10px #36c0;}
  100% {box-shadow: 0 0 0 0 #36c0;}
}

@-webkit-keyframes pulsate-blu {
   0% {-webkit-box-shadow: 0 0 0 0 #36c;}
  90% {-webkit-box-shadow: 0 0 0 10px #36c0;}
  100% {-webkit-box-shadow: 0 0 0 0 #36c0;}
}

.map-locations .container .marker.obj-color.neutral {
    background-color: #D1C8BF;
    animation: pulsate-neutral 1s infinite;
	-webkit-animation: pulsate-neutral 1s infinite;
}

@keyframes pulsate-neutral {
	0% {box-shadow: 0 0 0 0 #fee7e6;}
	90% {box-shadow: 0 0 0 10px #fee7e600;}
	100% {box-shadow: 0 0 0 0 #fee7e600;}
}

@-webkit-keyframes pulsate-neutral {
   0% {-webkit-box-shadow: 0 0 0 0 #fee7e6;}
  90% {-webkit-box-shadow: 0 0 0 10px #fee7e600;}
  100% {-webkit-box-shadow: 0 0 0 0 #fee7e600;}
}

.map-locations .container .marker:hover {
	background-position: right !important;
}

.map-locations .mw-indicator {
    position: absolute;
    top: 10px;
    left: 10px;
    cursor: help;
}

.map-locations .mw-indicator::before {
	content: '';
	display: block;
	height: 22px;
    padding-left: 22px;
	background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E %3Cpath d=%22M12.001 2.085c-5.478 0-9.916 4.438-9.916 9.916 0 5.476 4.438 9.914 9.916 9.914 5.476 0 9.914-4.438 9.914-9.914 0-5.478-4.438-9.916-9.914-9.916zm.001 18c-4.465 0-8.084-3.619-8.084-8.083 0-4.465 3.619-8.084 8.084-8.084 4.464 0 8.083 3.619 8.083 8.084 0 4.464-3.619 8.083-8.083 8.083z%22/%3E %3Cpath d=%22M11.766 6.688c-2.5 0-3.219 2.188-3.219 2.188l1.411.854s.298-.791.901-1.229c.516-.375 1.625-.625 2.219.125.701.885-.17 1.587-1.078 2.719-.953 1.186-1 3.655-1 3.655h1.969s.135-2.318 1.041-3.381c.603-.707 1.443-1.338 1.443-2.494s-1.187-2.437-3.687-2.437zM11 16h2v2h-2z%22/%3E %3C/svg%3E");
    background-repeat: no-repeat;
    filter: invert(1);
	-webkit-filter: invert(1);
}

.map-locations .container .marker .label,
.map-locations .container .mw-indicator .label {
    display: none;
    position: relative;
    top: -30px;
    left: 0;
    height: 20px;
    padding: 0 1em;
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 10px;
    font-size: small;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
}

.map-locations .container .mw-indicator .label {
	top: -20px;
	left: 25px;
}

.map-locations .container .marker div:not(.label) {
	position: absolute;
}

.map-locations .container .marker:hover .label,
.map-locations .container .mw-indicator:hover .label {
    display: block;
    z-index: 1;
    animation: fade 0.5s alternate;
	-webkit-animation: fade 0.5s alternate;
}

@keyframes fade {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

@-webkit-keyframes fade {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
/* END Map locations */

/* Used in {{all class nav}} */
.acnav-group {
    background: #FEF5E0;
    white-space: nowrap;
    text-align: right;
    font-weight: bold;
    padding-left: 1em;
    padding-right: 1em;
}

.acnav-list {
    border-left: 2px solid none;
    padding: 0em 0.25em;
}

.acnav-col {
    text-align: left;
    padding: 0em 1em;
    vertical-align: top;
    line-height: 0.75em;
    font-weight: bold;
}

.acnav-colh {
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid #ffddad;
}

.acnav-colhats {
    border-bottom: 1px solid #ffddad;
    border-top: 1px solid #ffddad;
    background: #FEF5E0;
}

.acnav-odd  { background: none; }
.acnav-even { background: #FEF5E0; }

/* Code for div-based collapsing
 * From [[wikipedia:MediaWiki:Common.css]] */
div.NavFrame {
    margin: 0;
    padding: 4px;
    border: 1px solid #79542B;
    text-align: center;
    border-collapse: collapse;
    font-size: 95%;
}
div.NavFrame + div.NavFrame {
    border-top-style: none;
    border-top-style: hidden;
}
div.NavPic {
    background-color: #fff;
    margin: 0;
    padding: 2px;
    float: left;
}
div.NavFrame div.NavHead {
    height: 1.6em;
    font-weight: bold;
    background-color: #F3A957; /* Level 1 color */
    position: relative;
}
div.NavFrame p,
div.NavFrame div.NavContent,
div.NavFrame div.NavContent p {
    font-size: 100%;
}
div.NavEnd {
    margin: 0;
    padding: 0;
    line-height: 1px;
    clear: both;
}
a.NavToggle {
    position: absolute;
    top: 0;
    right: 3px;
    font-weight: normal;
    font-size: 90%;
}
/* End */

.collapsibleDiv {
    overflow: hidden;
}
.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.         */


/* ambox class for skinning ambox's */


th.ambox-text, td.ambox-text {     /* The message body cell(s) */
    border: none;
    padding: 0.25em 0.9em;       /* 0.9em left/right */
    width: 100%;    /* Make all mboxes the same width regardless of text length */
}
td.ambox-image {                  /* The left image cell */
    border: none;
    padding: 2px 0 2px 0.9em;    /* 0.9em left, 0px right */
    text-align: center;
}
td.ambox-image2 {             /* The right image cell */
    border: none;
    padding: 2px 0.9em 2px 0;    /* 0px left, 0.9em right */
    text-align: center;
}
td.ambox-empty-cell {         /* An empty narrow cell */
    border: none;
    padding: 0px;
    width: 1px;
}

/* Article message box styles */
table.ambox {
    margin: 0px 10%;   /* 10% = Will not overlap with other elements */
    border: 1px solid #aaa;
    background: #fbfbfb;
}
table.ambox + table.ambox {   /* Single border between stacked boxes. */
    margin-top: -1px;
}
.ambox th.ambox-text,
.ambox td.ambox-text {            /* The message body cell(s) */
    padding: 0.25em 0.5em;       /* 0.5em left/right */
}
.ambox td.ambox-image {           /* The left image cell */
    padding: 2px 0 2px 0.5em;    /* 0.5em left, 0px right */
}
.ambox td.ambox-image2 {      /* The right image cell */
    padding: 2px 0.5em 2px 0;    /* 0px left, 0.5em right */
}
                                        /* Colours */
table.ambox-notice,
td.ambox-notice {
    border-left: 10px solid #1e90ff;    /* Blue */
}

table.ambox-notice-2,
td.ambox-notice-2 {
    border-left: 10px solid #3f6180;    /* Dark Blue */
}

table.ambox-delete,
table.ambox-serious {
    background: #fee;                   /* Pink */
    border: 1px solid #BB7070;
}
td.ambox-delete,
td.ambox-serious {
    border-left: 10px solid #b22222;    /* Red */
}
table.ambox-content,
td.ambox-content {
    border-left: 10px solid #f28500;    /* Orange */
}
table.ambox-style,
td.ambox-style {
    border-left: 10px solid #ffcc00;    /* Yellow */
}
table.ambox-images,
td.ambox-images {
    border-left: 10px solid #000000;    /* Black */
}
table.ambox-protection,
td.ambox-protection {
    border-left: 10px solid #bba;       /* Gray-gold */
}
table.ambox-good,
td.ambox-good {
    border-left: 10px solid #73D216;    /* Green */
}
                                        /* End ambox code */

/* Helplink indicator on Recent changes */
.mediawiki.mw-special-Recentchanges #mw-indicator-mw-helplink {
	display: none;
	position: absolute;
}


/* For positioning icons at top-right, used in some templates */
div.topicon {
    position:absolute;
    z-index:100;
    top:10px;
    display: block !important;
}

/* common font settings */

.bold     { font-weight: bold; }
.large    { font-size: 110%; }
.larger   { font-size: 1.2em; }
.xlarge   { font-size: 150%; }
.largest  { font-size: 180%; }
.xxlarge  { font-size: 200%; }
.mid      { font-size: 95%; }
.small    { font-size: 90%; }
.smaller  { font-size: 80%; }
.xsmall   { font-size: 75%; }
.smallest { font-size: 50%; }
.border   { border:1px solid #79542B; }
.nomargin { margin: 0px; }
.nowrap   { white-space: nowrap; }
.transparent { background-color: transparent; }

.whitespaceborder {
   background-color:white;
   margin-bottom: 0.5em;
   margin-left: 0.5em;
}

/* Language-specific settings */

/* en-Main page title removal fix */
body.page-Main_Page h1.firstHeading {
    display: none;
}

/* Other languages */

body.page-Special_RecentChanges h1.firstHeading, body.page-Special_RecentChanges span.subpages,
body.page-Main_Page_ar h1.firstHeading, body.page-Main_Page_ar span.subpages,
body.page-Main_Page_cs h1.firstHeading, body.page-Main_Page_cs span.subpages,
body.page-Main_Page_da h1.firstHeading, body.page-Main_Page_da span.subpages,
body.page-Main_Page_de h1.firstHeading, body.page-Main_Page_de span.subpages,
body.page-Main_Page_es h1.firstHeading, body.page-Main_Page_es span.subpages,
body.page-Main_Page_fi h1.firstHeading, body.page-Main_Page_fi span.subpages,
body.page-Main_Page_fr h1.firstHeading, body.page-Main_Page_fr span.subpages,
body.page-Main_Page_hu h1.firstHeading, body.page-Main_Page_hu span.subpages,
body.page-Main_Page_it h1.firstHeading, body.page-Main_Page_it span.subpages,
body.page-Main_Page_ja h1.firstHeading, body.page-Main_Page_ja span.subpages,
body.page-Main_Page_ko h1.firstHeading, body.page-Main_Page_ko span.subpages,
body.page-Main_Page_nl h1.firstHeading, body.page-Main_Page_nl span.subpages,
body.page-Main_Page_no h1.firstHeading, body.page-Main_Page_no span.subpages,
body.page-Main_Page_pl h1.firstHeading, body.page-Main_Page_pl span.subpages,
body.page-Main_Page_pt h1.firstHeading, body.page-Main_Page_pt span.subpages,
body.page-Main_Page_pt-br h1.firstHeading, body.page-Main_Page_pt-br span.subpages,
body.page-Main_Page_ro h1.firstHeading, body.page-Main_Page_ro span.subpages,
body.page-Main_Page_ru h1.firstHeading, body.page-Main_Page_ru span.subpages,
body.page-Main_Page_sv h1.firstHeading, body.page-Main_Page_sv span.subpages,
body.page-Main_Page_tr h1.firstHeading, body.page-Main_Page_tr span.subpages,
body.page-Main_Page_zh-hans h1.firstHeading, body.page-Main_Page_zh-hans span.subpages,
body.page-Main_Page_zh-hant h1.firstHeading, body.page-Main_Page_zh-hant span.subpages {
    display: none;
}

/* Classic */

body.page-Main_Page_Classic h1.firstHeading,
body.page-Main_Page_Classic_ar h1.firstHeading, body.page-Main_Page_Classic_ar span.subpages,
body.page-Main_Page_Classic_cs h1.firstHeading, body.page-Main_Page_Classic_cs span.subpages,
body.page-Main_Page_Classic_da h1.firstHeading, body.page-Main_Page_Classic_da span.subpages,
body.page-Main_Page_Classic_de h1.firstHeading, body.page-Main_Page_Classic_de span.subpages,
body.page-Main_Page_Classic_es h1.firstHeading, body.page-Main_Page_Classic_es span.subpages,
body.page-Main_Page_Classic_fi h1.firstHeading, body.page-Main_Page_Classic_fi span.subpages,
body.page-Main_Page_Classic_fr h1.firstHeading, body.page-Main_Page_Classic_fr span.subpages,
body.page-Main_Page_Classic_hu h1.firstHeading, body.page-Main_Page_Classic_hu span.subpages,
body.page-Main_Page_Classic_it h1.firstHeading, body.page-Main_Page_Classic_it span.subpages,
body.page-Main_Page_Classic_ja h1.firstHeading, body.page-Main_Page_Classic_ja span.subpages,
body.page-Main_Page_Classic_ko h1.firstHeading, body.page-Main_Page_Classic_ko span.subpages,
body.page-Main_Page_Classic_nl h1.firstHeading, body.page-Main_Page_Classic_nl span.subpages,
body.page-Main_Page_Classic_no h1.firstHeading, body.page-Main_Page_Classic_no span.subpages,
body.page-Main_Page_Classic_pl h1.firstHeading, body.page-Main_Page_Classic_pl span.subpages,
body.page-Main_Page_Classic_pt h1.firstHeading, body.page-Main_Page_Classic_pt span.subpages,
body.page-Main_Page_Classic_pt-br h1.firstHeading, body.page-Main_Page_Classic_pt-br span.subpages,
body.page-Main_Page_Classic_ro h1.firstHeading, body.page-Main_Page_Classic_ro span.subpages,
body.page-Main_Page_Classic_ru h1.firstHeading, body.page-Main_Page_Classic_ru span.subpages,
body.page-Main_Page_Classic_sv h1.firstHeading, body.page-Main_Page_Classic_sv span.subpages,
body.page-Main_Page_Classic_tr h1.firstHeading, body.page-Main_Page_Classic_tr span.subpages,
body.page-Main_Page_Classic_zh-hans h1.firstHeading, body.page-Main_Page_Classic_zh-hans span.subpages,
body.page-Main_Page_Classic_zh-hant h1.firstHeading, body.page-Main_Page_Classic_zh-hant span.subpages {
    display: none;
}

/*
 * Direction change on Arabic pages.
 * All mainspace pages (.ns-0), userspace (.ns-2) and the edit box of template pages (.ns-10) will have
 * the text direction set to RTL
 */
body.ns-0.lang-ar div#bodyContent,
body.ns-2.lang-ar div#bodyContent,
body.ns-10.lang-ar div#bodyContent,
body.ns-0.lang-ar div#mw-content-text,
body.ns-2.lang-ar div#mw-content-text,
body.ns-10.lang-ar div#mw-content-text {
    direction: rtl !important;
}

/* Remove italics from Chinese pages */
.lang-zh-hans i,
.lang-zh-hant i {
    font-style: normal !important;
}


.crit { background: url(/w/images/9/91/Killicon_crit.png) center no-repeat; }
.tf-kill-icon-tooltip a { cursor: help; }

/* Language template */

.LanguageLinks {
    margin-top: 0.5em;
}

.LanguageLinks table {
    clear: both;
    border: 1px solid #aaaaaa;
    border-collapse: collapse;
    padding: 0.2em;
    font-size: 85%;
    margin-top: 0.5em;
}

.LanguageLinks span {
    white-space: nowrap;
}

/* Temporarily disable both 'hide' and 'lock' in Flow tables - 'unhide' and 'unlock' will remain active */

[data-role~=hide],
[data-role~=lock] {
    display: none !important;
}

.mw-userlink.staff {
	color: #db9c1f;
}

.mw-userlink.bot {
	color: #FE48AA;
}

/* Moderators / Admins */
/*
.mw-userlink[title="User:Ashes"],
.flow-author [href$="User:Ashes"],
.mw-userlink[title="User:Darkid"],
.flow-author [href$="User:Darkid"],
.mw-userlink[title="User:Fuffeh"],
.flow-author [href$="User:Fuffeh"],
.mw-userlink[title="User:GrampaSwood"],
.flow-author [href$="User:GrampaSwood"],
.mw-userlink[title="User:Lagg"],
.flow-author [href$="User:Lagg"],
.mw-userlink[title="User:Mikado282"],
.flow-author [href$="User:Mikado282"],
.mw-userlink[title="User:RJackson"],
.flow-author [href$="User:RJackson"],
.mw-userlink[title="User:Tark"],
.flow-author [href$="User:Tark"],
.mw-userlink[title="User:WindPower"],
.flow-author [href$="User:WindPower"],
.mw-userlink[title="User:Wookipan"],
.flow-author [href$="User:Wookipan"],
a.trusted, .bur, .adm, .mod, .loc, .helpUser {
    color:#db9c1f !important;
}
*/

/* Generic staff account - Doesn't actually have any rights, so our js styling won't work */
.mw-userlink[title="User:Staff member"] {
    color:#db9c1f !important;
}

/* Bots */
a[class="mw-userlink"][title="User:WindBOT"],
a[class="mw-userlink"][title="User:WelcomeBOT"],
a[class="mw-userlink"][title="User:SmashBOT"],
a[class="mw-userlink"][title="User:SebBOT"],
a[class="mw-userlink"][title="User:RBotson"],
a[class="mw-userlink"][title="User:Pillownet"],
a[class="mw-userlink"][title="User:PilkBOT"],
a[class="mw-userlink"][title="User:PhoneWave"],
a[class="mw-userlink"][title="User:MousseBOT"],
a[class="mw-userlink"][title="User:FreemBOT"],
a[class="mw-userlink"][title="User:FireBOT"],
a[class="mw-userlink"][title="User:DarkBOT"],
a[class="mw-userlink"][title="User:CrushBOT"],
a[class="mw-userlink"][title="User:BOTzement"],
a[class="mw-userlink"][title="User:AkcelBOT"],
a[class="mw-userlink"][title="User:Anti-Entropy"],
a[class="mw-userlink"][title="User:Flow talk page manager"],
.robot, .bot {
    color:#FE48AA;
}

/* Valve */
.mw-userlink[title="User:Bryn"],
.mw-userlink[title="User:Greuben"],
.mw-userlink[title="User:JeffLane"],
.mw-userlink[title="User:Joe"],
.mw-userlink[title="User:RobinWalker"],
.mw-userlink[title="User:TomF"],
.valve {
    font-weight: bold !important;
    color: #FFFFFF !important;
    background-color: #F74843 !important;
    margin: 0 2px 0 2px;
    padding: 0 3px 0 2px;
}

.mw-userlink {
    font-weight: bold;
}

.burbg, .admbg, .modbg, .locbg {
background-color:#70B04A;color:white;font-size:0.7em;padding: 0 2px;
}

/* People with lowercase names */
/* MediaWiki is case-insensitive for the first letter so [[User:seb26]] is treated the same as [[User:Seb26]] */
/* As is [[engineer]] and [[Engineer]] */

#pt-userpage a[href="/wiki/User:I-ghost"],
       .mw-userlink[title="User:I-ghost"],
#pt-userpage a[href="/wiki/User:Minip"],
       .mw-userlink[title="User:Minip"],
#pt-userpage a[href="/wiki/User:Maggosh"],
       .mw-userlink[title="User:Maggosh"],
#pt-userpage a[href="/wiki/User:NVis"]:first-letter,
       .mw-userlink[title="User:NVis"]:first-letter,
#pt-userpage a[href="/wiki/User:Seb26"],
       .mw-userlink[title="User:Seb26"] {
    text-transform: lowercase;
    }

/* No forced lowercase on sidebar */
.portlet h5 {
    text-transform: none;
}

/* Styling for syntax highlighter */
div.mw-geshi,
pre.source-lua {
    font-size: 12px;
}

/* Hack for hiding textnode and default message box on custom filter messages from AbuseFilter */
.errorbox {
	visibility: collapse;
	padding: 0;
}

.errorbox p {
    background-color: #fee7e6;
    padding: 12px 24px;
    border: 1px solid #d33;
}

/* Ensure the default message box is still visible as fallback */
.errorbox p,
.errorbox table {
	visibility: visible;
}

.errorbox .ambox-text {
	color: #222222;
}

/* Edit notices */
.enmain  { background-color: #F7FFF5; border: 1px solid #D4F2CE; }
.enerror { background-color: #FFDBDB; border: 1px solid #BB7070; }
.eninfo  { background-color: #E6F2FF; border: 1px solid #B8C7D9; }

.entalk,
.enuser_talk,
.enteam_fortress_wiki_talk,
.enfile_talk,
.enhelp_talk,
.entemplate_talk,
.encategory_talk,
.enmediawiki_talk {
    background-color: #f2f2f2;
    border: 1px solid #aaa;
}

.enuser,
.enteam_fortress_wiki,
.enfile,
.enmediawiki,
.entemplate,
.enhelp,
.encategory {
    background-color: #f9f9f9;
    border: 1px solid #aaa;
}

/* +/- Special:RecentChanges colors */
.mw-plusminus-pos { color: #006400; }
.mw-plusminus-neg { color: #8B0000; }

/* START charInsert by WindPower */
#wpCharInsert1 {
   margin: 4px;
}
#wpCharInsert1 a {
   margin-left: 2px;
   margin-right: 2px;
}
/* END charInsert */

/* Item attribute colours. */
.att_level       { color:#756B5E; }
.att_positive    { color:#99CCFF; }
.att_negative    { color:#FF4040; }
.att_neutral     { color:#EBE2CA; }
.att_setname     { color:#E1FF0F; }
.att_setitem_y   { color:#95AF0C; }
.att_setitem_n   { color:#8B8989; }
.att_uses        { color:#00A000; }
.att_flags       { color:#756B5E; }
.att_strangerank { color:#756B5E; }
/* End item attribute colours. */

/* Item quality colours. */
.qua_normal     { color:rgb(178,178,178) !important; }
.qua_unusual    { color:rgb(134,80,172) !important; }
.qua_vintage    { color:rgb(71,98,145) !important; }
.qua_unique     { color:rgb(255,215,0) !important; }
.qua_community  { color:rgb(112,176,74) !important; }
.qua_valve      { color:rgb(165,15,121) !important; }
.qua_self-made  { color:rgb(112,176,74) !important; }
.qua_customized { color:rgb(71,98,145) !important; }
.qua_genuine    { color:rgb(77,116,85) !important; }
.qua_strange    { color:rgb(207,106,50) !important; } /* #CF6A32 */
.qua_completed  { color:rgb(134,80,172) !important; } /* Same as unusual */
.qua_haunted    { color:rgb(56,243,171) !important; }
.qua_collectors { color:rgb(192,0,0) !important; }
.qua_decorated  { color:rgb(250,250,250) !important; }
/* End item quality colours */

/* Item grade colours. */
.grade_civilian  { color:rgb(176, 195, 217) !important; }
.grade_freelance { color:rgb(94, 152, 217) !important; }
.grade_mercenary { color:rgb(75, 105, 255) !important; }
.grade_commando  { color:rgb(136, 71, 255) !important; }
.grade_assassin  { color:rgb(211, 44, 230) !important; }
.grade_elite     { color:rgb(235, 75, 75) !important; }
/* End item grade colours */


.item-grade, .killstreak-kit, .warpaint {
    font-weight: bold; 
}
.warpaint {
    display: inline-block;
    padding: 0px 3px;
    border-radius: 4px;
    color: #FAFAFA;
}
/* Background colors for item grades */
.item-grade.elite { background-color: #EB4B4B; }
.item-grade.assassin { background-color: #D32CE6; }
.item-grade.commando { background-color: #8847FF; }
.item-grade.mercenary { background-color: #4B69FF; }
.item-grade.freelance { background-color: #5E98D9; }
.item-grade.civilian { background-color: #B0C3D9; }

/* Background colors for killstreaks */
.killstreak-kit.agonizing-emerald { background-color: #67FF7A; }
.killstreak-kit.deadly-daffodil { background-color: #FFD63F; }
.killstreak-kit.hot-rod { background-color: #FF79FF; }
.killstreak-kit.manndarin { background-color: #FF6F01; }
.killstreak-kit.mean-green { background-color: #C2FF3B; }
.killstreak-kit.red { background-color: #FF1D15; }
.killstreak-kit.blu { background-color: #005CFF; }
.killstreak-kit.villainous-violet { background-color: #690CFF; }


/* Embed font - Hosted by User:WindPower */
@font-face {
    font-family: 'TF2';
    src: url('/fonts/tf2-webfont.eot');
    src: url('/fonts/tf2-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/tf2-webfont.woff') format('woff'),
         url('/fonts/tf2-webfont.ttf') format('truetype'),
         url('/fonts/tf2-webfont.svg#TF2') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TF2 Build';
    src: url('/fonts/tf2build-webfont.eot');
    src: url('/fonts/tf2build-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/tf2build-webfont.woff') format('woff'),
         url('/fonts/tf2build-webfont.ttf') format('truetype'),
         url('/fonts/tf2build-webfont.svg#TF2 Build') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TF2 Professor';
    src: url('/fonts/tf2professor-webfont.eot');
    src: url('/fonts/tf2professor-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/tf2professor-webfont.woff') format('woff'),
         url('/fonts/tf2professor-webfont.ttf') format('truetype'),
         url('/fonts/tf2professor-webfont.svg#TF2 Professor') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TF2 Secondary';
    src: url('/fonts/tf2secondary-webfont.eot');
    src: url('/fonts/tf2secondary-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/tf2secondary-webfont.woff') format('woff'),
         url('/fonts/tf2secondary-webfont.ttf') format('truetype'),
         url('/fonts/tf2secondary-webfont.svg#TF2 Secondary') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Blackoak Thin Std Wiki 2';
    src: url('/fonts/blackoakthinstdwiki2-webfont.eot');
    src: url('/fonts/blackoakthinstdwiki2-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/blackoakthinstdwiki2-webfont.woff') format('woff'),
         url('/fonts/blackoakthinstdwiki2-webfont.ttf') format('truetype'),
         url('/fonts/blackoakthinstdwiki2-webfont.svg#BlackoakStdRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Event stuff */
#eventBg {
    background: url('/w/images/4/46/Event_BG_line.png') repeat-x;
    height: 120px;
    width: 100%;
    margin: 0.5em 0em;
}
#eventLogo {
    background: url('/w/images/7/70/Event_BG.png') center right no-repeat;
    text-align: center;
    padding-top: 20px;
}
/* End Halloween event stuff */

/* Twitter feed */
.twitterfeed {
    float: right;
    margin-left: 16px;
    margin-bottom: 6px;
}

.paintCell
{
    background: #ffffff;
}
.paintCell:hover
{
    background: #000000;
}

/* "Poot" tab boxes */
.poot-tabs-container a:active,.poot-tabs :focus
{
  outline:none;
  -moz-outline-style:none;
}

.poot-tabs-hidelink
{
  float: right;
}

.poot-tabs-showhide, .poot-tabs-edittabs
{
  display: none;
}

.poot-tabs-navbar
{
  float: left;
}

.poot-tabs-container
{
  display:block;
  margin-left:auto;
  margin-right:auto;
  border:1px solid #79542B;
  padding:3px;
}

.poot-tabs-container + .poot-tabs-container, .poot-tabs-container + table.navbox, table.navbox + .poot-tabs-container {
  margin-top:-1px; /* Single pixel border between adjacent navboxes/tabboxes */
}

.poot-tabs-vertical .poot-tabs
{
  float:left;
}

.poot-tabs-horizontal .poot-tabs
{
  text-align:center;
}

.poot-tabs-title
{
  background:#f3a957;
  font-weight:bold;
  text-align:center;
  padding-left:1em;
  padding-right:1em;
  margin-bottom:2px;
}

.poot-tabs > ul
{
  list-style-type:none;
  list-style-image:none;
  margin:0px;
}

.poot-tabs-vertical .poot-tabs > ul > li
{
  display:block;
  padding:4px 6px 4px 4px;
  margin-top:1px;
  margin-bottom:0px;
  margin-left:0px;
  margin-right:0px;
  white-space:nowrap;
}

.poot-tabs-vertical .poot-tabs > ul > li:first-child
{
  margin-top:0px;
}


.poot-tabs-horizontal .poot-tabs > ul > li
{
  display:inline-block;
  padding:4px 4px 4px 4px;
  margin-top:0px;
  margin-bottom:0px;
  margin-left:4px;
  margin-right:4px;
  white-space:nowrap;
}

.poot-tabs > ul > li
{
  cursor:pointer;
}

/* Vertical uses white space between tabs, horizontal doesn't */
.poot-tabs-vertical .poot-tabs > ul > li, .poot-tabs-horizontal .poot-tabs > ul
{
  background:#ffddad;
}

.poot-tabs > ul > li.poot-tabs-selected
{
  background:#f3a957;
}

.poot-tabs-content > div
{
  position:absolute;
  top:0px;
  right:0px;
  left:2px; /* Simulate padding */
}

.poot-tabs-content > div:not(.poot-tabs-selected)
{
  display:none;
}

.poot-tabs-content
{
  position:relative;
  background:#fffcf7;
}

.nav-small {
  font-size: 80%;
}

.lang-zh-hans .nav-small,
.lang-zh-hant .nav-small {
  font-size: 95% !important;
}

/* Poot-tabs no-JS style overrides */
.poot-tabs-nojs .poot-tabs {
    display: none !important; /* Hide tab bar */
}
.poot-tabs-nojs .poot-tabs-content,.poot-tabs-nojs .poot-tabs-content > div {
    position: static !important; /* Regular positioning */
}

/* Adds background image to the page. */
body {
	background: #FFFFFF url("/w/images/8/84/Site_background.png") no-repeat fixed;
}

/* Adds background image to the content box and tabs. */
#content, #p-cactions li:not(.selected) {
	background: url("/w/images/5/56/Background_Content.png") transparent;
}
#p-cactions ul li a { background: none; }
#p-cactions ul li.selected a { background-color: #F7F7F7; }

/* Add secksy Soldier login icon by User:Nineaxis. */
li#pt-userpage, li#pt-anonuserpage, li#pt-login {
background:transparent url("/w/images/d/d8/Login_Soldier.png") no-repeat scroll top left;
image-rendering: pixelated;
image-rendering: crisp-edges;
padding-left:22px;
}


/* SIDEBAR FIXES */

/* Make English link bold. */
li#n-English {
    font-weight: bold;
}

/* Hide languages box per namespace & per page */

.ns--1 .generated-sidebar#p-Languages,                    /* Special */
.ns-0.page-Main_Page .generated-sidebar#p-Languages,      /* Main Page exception */
.ns-2 .generated-sidebar#p-Languages,                     /* User */
.ns-3 .generated-sidebar#p-Languages,                     /* User talk */
.ns-4 .generated-sidebar#p-Languages,                     /* Team Fortress Wiki */
.ns-5 .generated-sidebar#p-Languages,                     /* Team Fortress Wiki talk */
.ns-6 .generated-sidebar#p-Languages,                     /* File */
.ns-7 .generated-sidebar#p-Languages,                     /* File talk */
.ns-8 .generated-sidebar#p-Languages,                     /* MediaWiki */
.ns-9 .generated-sidebar#p-Languages                      /* MediaWiki talk */
{
    display: none;
}

/* Elements within the class 'editsection-nofloat' will have [edit] links appear on the left hand side */
.editsection-nofloat .editsection {
    float: left;
    margin-right: 0.5em;
}

/* Portal to Portal Wiki in sidebar - Big hax */
/* Start
#n-Portal-Wiki {
    display: block;
    background:url(/w/images/e/ee/Portal_to_the_Portal_Wiki.png);
    width: 101px;
    height: 172px;
    padding: 0px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
#n-Portal-Wiki a {
    display: block;
    width: 101px;
    height: 172px;
    opacity: 0.25;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity:0;
    opacity: 0;
}
#p-portal_wiki h5 {
    display: none !important;
}
#p-portal_wiki .pBody {
    background: none !important;
    margin-left: 0px !important;
    padding-top: 0px !important;
    border: none !important;
}
End */
/* End Portal to Portal Wiki in sidebar */

/* Diff styles */
.diff-file {
    font-family: ui-monospace, monospace;
}
.diff-contents {
    display: none; /* Hidden by default */
    margin: 4px;
    margin-left: 0;
    border-top: 1px solid #E0E0E0;
    border-bottom: 1px solid #E0E0E0;
    background: #F9F9F9;
}
.diff-name-text, .diff-name-binary .diff-file-renamed {
    display: block;
    font-size: 10.5px;
}
.diff-name-binary, .diff-file-renamed {
    color: #606060;
    font-size: 10.5px;
}
.diff-name-text {
    font-weight: bold;
    cursor: pointer;
}
.diff-file-deleted .diff-name-text {
    font-weight: normal;
    cursor: auto;
    color: #6F0000;
}
.diff-name-text:before {
    content: "[+] ";
}
.diff-name-binary:before {
    content: "[B] ";
}
.diff-file-renamed:before {
    content: "[R] ";
}
.diff-name-text:hover {
    text-decoration: underline;
    color: #303090;
}
.diff-file-deleted .diff-name-text:hover {
    text-decoration: none;
    color: #6F0000;
}
.diff-line-entry, .diff-line-ellipsis {
    display: block;
    white-space: pre-wrap;
    clear: both;
    border-left: 1px solid #E0E0E0;
    border-right: 1px solid #E0E0E0;
}
.diff-line-ellipsis {
    background: #FFFFFF;
}
.diff-line-old, .diff-line-new {
    width: 52px;
    text-align: right;
    border-right: 1px solid #E0E0E0;
    padding-right: 4px;
    color: #696969;
    float: left;
    font-size: 0.9em;
}
.diff-line-na {
    font-style: italic;
    color: #A0A0A0;
}
.diff-line-entry .diff-line-old, .diff-line-entry .diff-line-new {
    border-bottom: 1px solid #D0D0D0;
    margin-bottom: -1px;
}
.diff-line-ellipsis + .diff-line-entry .diff-line-old, .diff-line-ellipsis + .diff-line-entry .diff-line-new {
    border-top: 1px solid #D0D0D0;
    margin-top: -1px;
}
.diff-line-ellipsis {
    padding-top: 0;
    padding-bottom: 8px;
    font-size: 1.4em;
    color: #666666;
    text-indent: 114px;
}
.diff-line-add .diff-line {
    background: #D9FFD9;
    border-left: 1px solid #60CC60;
    border-right: 1px solid #60CC60;
}
.diff-line-add.diff-line-first .diff-line {
    border-top: 1px solid #60CC60;
}
.diff-line-add.diff-line-last .diff-line {
    border-bottom: 1px solid #60CC60;
}
.diff-line-remove .diff-line {
    background: #FFD9D9;
    border-left: 1px solid #CC6060;
    border-right: 1px solid #CC6060;
}
.diff-line-remove.diff-line-first .diff-line {
    border-top: 1px solid #CC6060;
}
.diff-line-remove.diff-line-last .diff-line {
    border-bottom: 1px solid #CC6060;
}
.diff-line {
    display: block;
    padding-left: 4px;
    margin-left: 114px;
}
.diff-data-requested {
    background: url(/w/images/4/43/Patch_diff_loading.gif) right no-repeat;
}

/* Start TF-style buttons */
.tf-button * {
  padding: 0px !important;
  margin: 0px !important;
  background: none !important;
  text-decoration: none !important;
  font-family: "TF2 Build";
  font-size: 20px;
  color: #444444;
}

.tf-button-left {
  display: inline-block;
  width: 40px;
  height: 40px;
  vertical-align: text-bottom;
  background: url(/w/images/9/92/TF_button_left_40px.png) top left no-repeat !important;
}

.tf-button-middle {
  display: inline-block;
  height: 40px;
  vertical-align: text-bottom;
  line-height: 40px;
  background: url(/w/images/f/f7/TF_button_middle_40px.png) top repeat-x !important;
}

.tf-button-right {
  display: inline-block;
  width: 40px;
  height: 40px;
  vertical-align: text-bottom;
  background: url(/w/images/9/9b/TF_button_right_40px.png) top right no-repeat !important;
}

.tf-button a:hover .tf-button-left, .tf-button a:hover .tf-button-middle, .tf-button a:hover .tf-button-right {
  background-position: 0px -40px !important;
}

.tf-button a .tf-button-on {
  display: none;
}

.tf-button a:hover .tf-button-on {
  display: inline-block;
}

.tf-button a:hover .tf-button-off {
  display: none;
}

.tf-button a:hover * {
  color: #ece3cb;
}
/* End TF-style buttons */

/* 3D/2D viewer */
.container-2d {
  display: none;
  position: relative;
}

.viewer-2d {
  position: relative;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

#switch-to-3d {
  position: absolute;
  top: 0;
  right: 0;
  background: url("/w/images/6/65/2D_icon.png");
  width: 63px;
  height: 42px;
  z-index: 999;
  opacity: 0.5;
  cursor :pointer;
  cursor: hand;
  transition: opacity 0.2s;
}

#switch-to-2d {
  position: absolute;
  top: 0;
  right: 0;
  background: url("/w/images/7/7e/3D_icon.png");
  width: 63px;
  height: 42px;
  z-index: 999;
  opacity: 0.5;
  cursor: pointer;
  cursor: hand;
  transition: opacity 0.2s;
}

#switch-to-3d:hover, #switch-to-2d:hover {
  opacity: 1.0;
}

/* 3D model viewer */
.viewer-3d span {
    display: none;
}
.viewer-3d {
    background: #ffffff;
    margin: 4px;
    display: block;
    cursor: move;
    position: relative;
}
.viewer-3d-frame {
    position: absolute;
}
.viewer-3d-overlay {
    background: url(/w/images/e/ed/3D_rotation_icon.png) bottom right no-repeat;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    position: relative;
}
/* End 3D model viewer */

/* New 3D viewer specific CSS */
.viewer-3d-container {
  display: block;
  padding: 2px;
  margin-left: auto;
  margin-right: auto;
  background: #ffffff;
  width: 288px;
}

.viewer-3d-container ul {
  padding: 0px;
  margin: 0px;
}
.viewer-3d-container ul li {
  display: block;
  margin: 0px;
  margin-top: 2px; /* For vertical spacing of the buttons */
  list-style: none;
  text-align: center;
}
.viewer-3d-container ul a {
  display: block;
  width: 134px;
  padding: 4px;
  color: #ffffff;
  text-decoration: none;
  font-family: "TF2 Build";
  font-size: 1.25em;
  opacity: .5;
}
.viewer-3d-container ul a:hover {
  opacity: 1;
}

.view-selector-red,
.view-selector-red-right,
.view-selector-red-left,
.view-selector-red-full,
.view-selector-red a,
.view-selector-red-right a,
.view-selector-red-left a {
  background: #B8383B;
} 
.view-selector-red,
.view-selector-red-left {
  float: left
}
.view-selector-red-right {
  float: right;
}
.view-selector-red-full {
  width: 100%;
  clear: both;
  float: left;
}
.view-selector-red-full a {
  width: 100% !important;
}
.view-selector-blu,
.view-selector-blu-right,
.view-selector-blu-left,
.view-selector-blu-full,
.view-selector-blu a,
.view-selector-blu-right a,
.view-selector-blu-left a {
  background: #5885A2;
}
.view-selector-blu,
.view-selector-blu-right {
  float: right;
}
.view-selector-blu-left {
  float: left;
}
.view-selector-blu-full {
  width: 100%;
  clear: both;
  float: left;
}
.view-selector-blu-full a {
  width: 100% !important;
}
.view-selector-default-left {
    float: left;
    background: #F3A957;
}
.view-selector-default-right {
    float: right;
    background: #F3A957;
}
.view-selector-default-full {
    width: 100%;
    float: left;
    clear: both;
    background: #F3A957;
}
.view-selector-default-full a {
    width: 100% !important;
}

.view-selector-australium-left {
    float: left;
    background: #EEBB00;
}
.view-selector-australium-right {
    float: right;
    background: #EEBB00;
}
.view-selector-australium-full {
    width: 100%;
    float: left;
    clear: both;
    background: #EEBB00;
}
.view-selector-australium-full a {
    width: 100% !important;
}

.view-selector-tfcred-left {
    float: left;
    background: #d9725f;
}
.view-selector-tfcred-right{
    float: right;
    background: #d9725f;
}
.view-selector-tfcblu-left {
    float: left;
    background: #2f50c6;
}
.view-selector-tfcblu-right{
    float: right;
    background: #2f50c6;
}
.view-selector-tfcyellow-left {
    float: left;
    background: #debf75;
}
.view-selector-tfcyellow-right{
    float: right;
    background: #debf75;
}
.view-selector-tfcgreen-left {
    float: left;
    background: #82a262;
}
.view-selector-tfcgreen-right{
    float: right;
    background: #82a262;
}
/* End new 3D viewer */

/* Team 3D model viewer */
.team-color-viewer {
  display: block;
  padding: 2px;
  margin-left: auto;
  margin-right: auto;
  background: #ffffff;
  width: 288px;
}
.team-color-viewer ul {
  padding: 0px;
  margin: 0px;
}
.team-color-viewer ul li {
  display: block;
  margin: 0px;
  margin-top: 2px; /* For vertical spacing of the buttons */
  list-style: none;
  text-align: center;
}
.team-color-viewer ul a {
  display: block;
  width: 134px;
  padding: 4px;
  color: #ffffff;
  text-decoration: none;
  font-family: "TF2 Build";
  font-size: 1.2em;
  opacity: .5;
}
.team-color-viewer ul a:hover {
  opacity: 1;
}
.team-selector-red {
  float: left;
  background: #B8383B;
}
.team-selector-red a {
  background: #B8383B;
}
.team-selector-blu {
  float: right;
  background: #5885A2;
}
.team-selector-blu a {
  background: #5885A2;
}
/* End team 3D model viewer */

/* Alt 3D model viewer */
.alt-viewer {
    display: block;
    padding: 2px;
    margin-left: auto;
    margin-right: auto;
    background: #ffffff;
    width: 288px;
}
.alt-viewer ul {
    padding: 0px;
    margin: 0px;
}
.alt-viewer ul li {
    display: block;
    margin: 0 0 4px 0;
    list-style: none;
    text-align: center;
}
.alt-viewer ul a {
    display: block;
    width: 134px;
    padding: 4px;
    color: #ffffff;
    text-decoration: none;
    font-family: "TF2 Build";
    font-size: 1.2em;
}
.view-selector-default {
    float: left;
    background: #F3A957;
}
.view-selector-default-wide {
    width: 100%;
    background: #F3A957;
}
.view-selector-default-wide a {
    width: 100% !important;
}
.view-selector-alt {
    float: right;
    background: #F3A957;
}
/* End alt 3D model viewer */

#wpSave {
	font-weight: normal;
}

#wpPreview {
	font-weight: bold;
}

pre, code, kbd, samp, tt {
  font-family:monospace,monospace; /* Not a typo */
  font-size:1em;
}

/******* START BUY NOW *******/

.btn_buynow, .btn_buynow span {
  background:url('/w/images/1/15/Btn_buynow.png') no-repeat;
  color:#FFF;
  line-height:100%;
  font-size:90%;
}

.btn_buynow {
  padding:6px 4px 4px 28px;
  background-position:right 0;
  position:relative;
  display: block;
  width: 265px;
  height: 14px;
}

.btn_buynow span {
  background-position:left top;
  width:24px;
  height:24px;
  position:absolute;
  top:0px;
  left:-1px;
  display:block;
  cursor:pointer;
}

.btn_buynow:hover {
  background-position:right -24px;
}

.btn_buynow:hover span {
  background-position:left -24px;
}

.btn_wrapper {
  display:inline-block;
  height:24px;
}

.btn_wrapper a:hover {
  text-decoration:none;
}

/******* END BUY NOW *******/

/******* BUY NOW MARKET *******/

.btn_buynow_market, .btn_buynow_market span {
  background:url('/w/images/1/13/Btn_scm.png') no-repeat;
  color:#FFF;
  line-height:100%;
  font-size:90%;
}

.btn_buynow_market {
  padding:6px 4px 4px 28px;
  background-position:right 0;
  position:relative;
  display: block;
  width: 265px;
  height: 14px;
}

.btn_buynow_market span {
  background-position:left top;
  width:24px;
  height:24px;
  position:absolute;
  top:0px;
  left:-1px;
  display:block;
  cursor:pointer;
}

.btn_buynow_market:hover {
  background-position:right -24px;
}

.btn_buynow_market:hover span {
  background-position:left -24px;
}

/******* END BUY NOW MARKET *******/

/******* STEAM WORKSHOP SUB *******/

.btn_buynow_workshop, .btn_buynow_workshop span {
  background:url('/w/images/7/74/Btn_workshop.png') no-repeat;
  color: #FFF;
  line-height: 100%;
  font-size: 90%;
  text-shadow: 2px 2px 4px #2b2b2b;
}

.btn_buynow_workshop {
  padding: 6px 4px 4px 28px;
  background-position:right 0;
  display: block;
  height: 14px;
  position: relative;
}

.btn_buynow_workshop span {
  background-position:left top;
  width:24px;
  height:24px;
  position:absolute;
  top:0px;
  left: 0px;
  display:block;
  cursor:pointer;
}

.btn_buynow_workshop:hover {
  background-position:right -24px;
}

.btn_buynow_workshop:hover span {
  background-position:left -24px;
}

/******* END STEAM WORKSHOP SUB *******/

/* Don't bold links self-links in achievement displays with {{Achievement}} */
.achievement strong {
    font-weight: normal;
}

/* Style code used extensively in item qualities template */
.gold {
  background:#ffddad !important;
}
td.qc {
  background:#ebe2ca !important;
  padding:0pt;
}
div.qc {
  display:inline-block;
  border:none;
  margin:none;
  text-align:center;
  border-radius:4px;
  width:100%;
  /* height:100%; */
  cursor:default;
  vertical-align:middle;
  padding-top:0.25em;
}
.qc.unique {
  background:#ffd700;
  color:#2a2725;
}
.qc.unique > a {
  color:#2a2725;
}
.qc.vintage {
  background:#476291;
  color:#ebe2ca;
}
.qc.vintage > a {
  color:#ebe2ca;
}
.qc.genuine {
  background:#4d7455;
  color:#ebe2ca;
}
.qc.genuine > a {
  color:#ebe2ca;
}
.qc.strange {
  background:#cf6a32;
  color:#ebe2ca;
}
.qc.strange > a {
  color:#ebe2ca;
}
.qc.unusual {
  background:#8650ac;
  color:#ebe2ca;
}
.qc.unusual > a {
  color:#ebe2ca;
}
.qc.haunted {
  background:#38F3AB;
  color:#2a2725;
}
.qc.haunted > a {
  color:#2a2725;
}
.qc.community {
  background:#70b04a;
  color:#ebe2ca;
}
.qc.community > a {
  color:#ebe2ca;
}
.qc.self-made {
  background:#70b04a;
  color:#ebe2ca;
}
.qc.self-made > a {
  color:#ebe2ca;
}
.qc.valve {
  background:#a50f79;
  color:#ebe2ca;
}
.qc.valve > a {
  color:#ebe2ca;
}
.qc.normal {
  background:#b2b2b2;
  color:#2a2725;
}
.qc.normal > a {
  color:#2a2725;
}
.qc.collectors {
  background:#aa0000;
  color:#ebe2ca;
}
.qc.collectors > a {
  color:#aa0000;
}
.qc.decorated {
  background:#fafafa;
  color:#2a2725;
}
.qc.decorated > a {
  color:#2a2725;
}

.hide { 
  display:none;
}
.tick {
  font-size:14pt;
}
.nameplate {
  background:#2a2725 !important;
  max-width:108px;
}
.nameplate > a,
.nameplate > i > a {
  color:#ebe2ca;
}
td.strange {
  background:#ffddad !important;
  width:24px;
  padding:0;
}
td.strange > a {
  color:#cf6a32;
  font-weight:bold;
  font-size:11pt;
}
td.qc {
  width:24px;
  height:24px;
}
/******* END ITEM QUALITIES TEMPLATE *******/

/******* Start weapon wear tabs *******/
.weapon-wear-table {
    padding: 1px;margin: 0px;
    width: 100%;
    min-width: 300px;
    float: left;
    box-sizing: border-box;
}
.weapon-wear-table .tabs {
    padding: 0px;margin: 0px;
    width: 40%;
    float: left;
    list-style: none;
}
.weapon-wear-table .tabs li:hover, .weapon-wear-table .tabs li.current {
    background-color:#F4A958;
}
.weapon-wear-table .tabs li {
    padding: 0.5em 0.2em;margin: 0px;
    width: 100%;
    float: left;
    background-color: #F9D483;
    border-bottom: solid #FFFFFF 1px;
    font-size: 1.2em;
    color: black;
    font-weight: bold;
    line-height: 1.6;
    text-align: center;
    box-sizing: border-box;
    cursor: pointer;
}
.weapon-wear-table .tabs li.tab-5 {
    width:100%;
}
.weapon-wear-table .weapons {
    margin: 0px;
    width: 60%;
    height: 200px;
    float: left;
    list-style: none;
    position: relative;
}
.weapon-wear-table .weapons li {
    width: 100%;
    height: 100%;
    background-color: #FFFCF7;
    top: 0px;
    left: 0px;
    position: absolute;
    z-index:1;
}
.weapon-wear-table .weapons li.current {
    z-index:2;
}
.weapon-wear-table .weapons li a {
    width: 100%;
    display: block;
    position: absolute;
    text-align: center;
}
/******* End weapon wear tabs *******/

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-caption p:last-child a {color: #3F56AD !important;}
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}

/* Start 'Audio player' */
.tfwiki-audio-player-action {
  cursor: pointer;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-select: none;
  background: url("/w/images/6/67/Play_icon.png") center left/15px no-repeat;
  padding-left: 19px;
}

.tfwiki-audio-player-action.playing {
  background: url("/w/images/d/d2/Pause_icon.png") center left/15px no-repeat;
}

.tfwiki-audio-player-action.inactive {
  display: none;
}

li span.tfwiki-audio-player a[href$=".wav"].internal,
li span.tfwiki-audio-player a[href$=".mp3"].internal {
  background: unset;
  padding-right: unset;
}
/* End 'Audio player' */

/* Start "Scroll to top" button */
@keyframes tfwikiScrollUpFadeIn {
  from {
    opacity: 0;
  }
  to {
    /* same as #tfwiki-scrollup */
    opacity: 0.7;
  }
}

#tfwiki-scrollup {
  position: fixed;
  bottom: 24px;
  left: 18px;
  opacity: 0.7;
  cursor: pointer;
  display: none;
  width: 50px;
  height: 50px;
  animation: tfwikiScrollUpFadeIn 1s;
  background-color: #fdfdfd;
  border-radius: 100%;
  box-shadow: 0 0 5px #000;
}

/* End "Scroll to top" button */

/**
 * Ruby annotations (Template:Ruby)
 * Source: https://en.wikipedia.org/wiki/Template:Ruby/styles.css
 */
.rubytl > rt {
  font-variant-east-asian: ruby;
  font-size: 85%;
}

.rubytl.large {
  font-size: 250%;
}

.rubytl.large> rt {
  font-size: 50%;
}
/* End Ruby annotations */
Retrieved from "https://wiki.teamfortress.com/w/index.php?title=MediaWiki:Common.css&oldid=3868625"