Difference between revisions of "MediaWiki:Common.css"

From Team Fortress Wiki
Jump to: navigation, search
m (Slight tweaks to sf22-banner that I didn't get to do in time 🤷‍♀️)
(Improvements to the SF22 banner text, remove spookyGlow animation due to causing performance issues when in view, remove media query, better text scaling based on container width, add overlay styling)
Line 138: Line 138:
 
}
 
}
  
.mp-event-text-sf22 {
+
.sf22-overlay {
position: absolute;
+
    position: absolute;
top: 0;
+
    top: 0;
width: 100%;
+
    left: 0;
height: 100%;
+
    width: 100%;
font-family: "TF2";
+
    height: 100%;
font-weight: 600;
+
    background-color: rgba(0, 0, 0, 0.3);
font-style: normal;
 
font-size: 3.5rem;
 
color: rgba(255, 255, 255, 0.54);
 
text-shadow: 2px 2px 4px #38f3ab;
 
pointer-events: none;
 
display: flex;
 
align-items: center;
 
justify-content: center;
 
animation: spookyGlow 1.5s ease-in-out infinite alternate;
 
-webkit-animation: spookyGlow 1.5s ease-in-out infinite alternate;
 
 
}
 
}
  
.sf22-banner td img {
+
.mp-event-text-sf22 {
filter: brightness(0.7);
+
    position: absolute;
}
+
    top: 0;
 
+
    width: 100%;
@media screen and (max-width: 800px) {
+
    height: 100%;
.mp-event-text-sum22,
+
    font-family: 'TF2';
.mp-event-text-sf22 {
+
    font-weight: 600;
display: none;
+
    font-size: 3vw;
}
+
    color: rgba(255,255,255,0.54);
 +
    text-shadow: 2px 0 0px #38f3ab, 3px 2px 0px rgb(0, 0, 0, 0.8), 3px 0 3px #38f3ab, 6px 2px 3px rgba(0, 0, 0, 0.8), 9px 2px 9px rgba(0, 0, 0, 0.8), 12px 2px 18px rgba(0, 0, 0, 0.8), 12px 0 30px #38f3ab, 14px 0 30px #38f3ab, 15px 2px 30px rgba(0, 0, 0, 0.8), 15px 0 45px #38f3ab, 17px 0 45px #38f3ab;
 +
    pointer-events: none;
 +
    display: flex;
 +
    align-items: center;
 +
    justify-content: center;
 
}
 
}
  
@keyframes spookyGlow {
 
0% {
 
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.54), 0 0 10px #38f3ab, 0 0 20px #38f3ab, 0 0 30px #38f3ab, 0 0 40px #38f3ab, 0 0 50px #38f3ab, 0 0 60px #38f3ab;
 
  }
 
  100% {
 
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.54), 0 0 20px #38f3ab, 0 0 30px #38f3ab, 0 0 40px #38f3ab, 0 0 50px #38f3ab, 0 0 60px #38f3ab, 0 0 70px #38f3ab;
 
  }
 
}
 
 
@-webkit-keyframes spookyGlow {
 
0% {
 
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.54), 0 0 10px #38f3ab, 0 0 20px #38f3ab, 0 0 30px #38f3ab, 0 0 40px #38f3ab, 0 0 50px #38f3ab, 0 0 60px #38f3ab;
 
  }
 
  100% {
 
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.54), 0 0 20px #38f3ab, 0 0 30px #38f3ab, 0 0 40px #38f3ab, 0 0 50px #38f3ab, 0 0 60px #38f3ab, 0 0 70px #38f3ab;
 
  }
 
}
 
 
/* End Main Page style */
 
/* End Main Page style */
  

Revision as of 19:38, 6 October 2022

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

/* 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 */

/* Give [[Media:]] file links a special icon */
a[href$=".wav"].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;
}

/* 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 */
.mp-event-image {
    margin: -1px;
    max-width: 100%;
    height: auto;
}

.mp-event-text-sum22 {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	font-family: "TF2 Build";
	font-weight: normal;
	font-style: normal;
	font-size: 3rem;
	color: #fff;
	text-shadow: 2px 2px #ff5400;
	pointer-events: none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.sf22-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}

.mp-event-text-sf22 {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    font-family: 'TF2';
    font-weight: 600;
    font-size: 3vw;
    color: rgba(255,255,255,0.54);
    text-shadow: 2px 0 0px #38f3ab, 3px 2px 0px rgb(0, 0, 0, 0.8), 3px 0 3px #38f3ab, 6px 2px 3px rgba(0, 0, 0, 0.8), 9px 2px 9px rgba(0, 0, 0, 0.8), 12px 2px 18px rgba(0, 0, 0, 0.8), 12px 0 30px #38f3ab, 14px 0 30px #38f3ab, 15px 2px 30px rgba(0, 0, 0, 0.8), 15px 0 45px #38f3ab, 17px 0 45px #38f3ab;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* End Main Page style */

/* 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-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 */

/* Better positioning for the helplink indicator on Recent changes */
.mediawiki.mw-special-Recentchanges #mw-indicator-mw-helplink {
	position: absolute;
	right: 20px;
	bottom: -95px;
}


/* 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;
}
*/

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

/* Item grade colours. */
.grade_civilian  { color:rgb(176, 195, 217); }
.grade_freelance { color:rgb(94, 152, 217); }
.grade_mercenary { color:rgb(75, 105, 255); }
.grade_commando  { color:rgb(136, 71, 255); }
.grade_assassin  { color:rgb(211, 44, 230); }
.grade_elite     { color:rgb(235, 75, 75); }
/* 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 {
  float: left;
  background: #B8383B;
}
.view-selector-red a {
  background: #B8383B;
}
.view-selector-blu {
  float: right;
  background: #5885A2;
}
.view-selector-blu a {
  background: #5885A2;
}
.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;
}
/* 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;
}

/******* BUY NOW (STEAM COMMUNITY 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 *******/

/* 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:#000000;
  color:#38f3ab;
}
.qc.haunted > a {
  color:#38f3ab;
}
.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 {
  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;	
}