/* Icon font fontawesome.io */
@font-face {
  font-family: 'FontAwesome';
  src: url('fonts/fontawesome-webfont.eot?v=4.3.0');
  src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'),
	url('fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'),
	url('fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'),
	url('fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'),
	url('fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
.fi {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome, sans-serif;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
  vertical-align: inherit;
}

@font-face {
  font-family: 'steam-icons';
  src:url('fonts/steam-icons.eot');
  src:url('fonts/steam-icons.eot?#iefix') format('embedded-opentype'),
	url('fonts/steam-icons.svg#steam-icons') format('svg'),
	url('fonts/steam-icons.woff') format('woff'),
	url('fonts/steam-icons.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

.stm {
  display: inline-block;
  font: normal normal normal 14px/1 steam-icons, sans-serif;
  speak: none;
  font-size: inherit;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-rendering: auto;
  text-transform: none;
  line-height: 1;
  line-height: inherit;
  vertical-align: inherit;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.stm:before { content: ""; }
.fi.marketplace-tf:before { content: "\f23a"; }
.stm.marketplace-tf:before { content: 'M'; }
.stm.tf2:before { content: "\e007"; }
.stm.trade-tf:before { content: "\e000"; }
.stm.outpost:before { content: "\e006"; }
.stm.scm:before { content: "\e009"; }
.stm.scrap-tf:before { content: "\e00a"; }
.stm.tf2wh:before { content: "\e002"; }
.stm.bp-tf:before { content: "\e01e"; }
.stm.bazaar-tf:before { content: "\e01f"; }
.stm.dispenser-tf:before { content: "\e011"; }

.fi.gift:before { content: "\f06b"; }
.fi.tag:before { content: "\f02b"; }
.fi.tags:before { content: "\f02c"; }
.fi.decal:before { content: "\f03e"; }

/* Default styles */
html {
 -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
	 box-sizing: border-box;
}
*, *:before, *:after {
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
	 box-sizing: inherit;
}
*::selection,
*::-moz-selection {
 background: transparent;
 color: inherit;
 text-shadow: none;
}
/* No shadows when selecting text */
/*::-moz-selection { background: #5af; color: #fff; text-shadow: none }*/
body {
 overflow-y: scroll;
 -webkit-overflow-scrolling: touch;
 font: 15px/1.3 sans-serif;
 background-color: #eceff1;
 background-color: #4E4D57;
 color: #121212;
 color: rgba(0,0,0,.73);
 margin: 0;
 padding: 0;
}
input {
 margin: 0;
 vertical-align: top;
 padding: 0;
 font-size: 1em;
 line-height: 1;
}
input[type="reset"],
input[type="submit"]
button, label {
 cursor: pointer;
 -webkit-user-select: none;
    -moz-user-select: none;
     -ms-user-select: none;
      -o-user-select: none;
	 user-select: none;
}
img, span>img,a img { vertical-align: top; border: 0 none; }
a:focus {
 outline: thin dotted;
 outline-offset: -1px;
}

.italic { font-style: italic; }

dl, hr, pre { margin: 0; }

/* Simple collapsing with :checked */
.collapse-toggle,
.tier-collapse { display: none; }
.collapsable { display: none; }
.collapse-toggle:checked ~ .collapsable {
 display: block;
 display: inherit;
 -webkit-animation-duration: 0.5s;
 animation-duration: 0.5s;
 -webkit-animation-fill-mode: both;
 animation-fill-mode: both;
}

/* ad */
.gad {
 max-width: 900px;
 margin: 4px auto;
 padding: 0 4px;
 text-align: center;
 z-index: 0;
}

/* Unicode arrows */
.arrow.up:before { content: '\25B2'; }
.arrow.down:before { content: '\25BC'; }
.arrow.left:before { content: '\25C0'; }
.arrow.right:before { content: '\25B6'; }
.arrow.up.empty:before { content: '\25B3'; }
.arrow.down.empty:before { content: '\25BD'; }
.arrow.left.empty:before { content: '\25C1'; }
.arrow.right.empty:before { content: '\25B7'; }
.arrow.up.double:before { content: '\23EB'; }
.arrow.down.double:before { content: '\23EC'; }
.arrow.left.double:before { content: '\23EA'; }
.arrow.right.double:before { content: '\23E9'; }

.checked:before { content: '✔'; } /* \2714 */
.checked.empty:before { content: '\2705'; }
.multiply:before { content: '✖'; } /* \2716 */
.crossed:before { content: '✘'; } /* \2718 */
.angle.left:before { content: '\276E'; }
.angle.left.double:before { content: '\300A'; }
.angle.right:before { content: '\276F'; }
.angle.right.double:before { content: '\300B'; }
.angle.up:before { content: '\FE3F'; }
.angle.up.double:before { content: '\FE3D'; }
.angle.down:before { content: '\FE40'; }
.angle.down.double:before { content: '\FE3E'; }
.fat-plus:before { content: '\2795'; }
.fat-plus.alt:before { content: '\FF0B'; }
.fat-minus:before { content: '\2796'; }
.fat-minus.alt:before { content: '\FF0D'; }

/* Header Styles */
.header {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 margin-bottom: 5px;
 z-index: 90;
 background-color: #D3D4D9;
 background-color: #383838;
 color: rgba(0,0,0,0.6);
 color: rgba(255,255,255,0.87);
 border-bottom: 1px solid rgba(0,0,0,.15);
}
.brand {
 text-decoration: none;
 line-height: 30px;
 font-size: 20px;
 font-weight: bold;
 padding: 2px 8px 2px 4px;
 display: inline-block;
 color: inherit;
}
.brand .drop {
 font-size: 0.1px;
 color: transparent;
 vertical-align: bottom;
}
.brand .drop:before {
 font-size: 14px;
 color: rgba(255,255,255,0.87);
 background-color: none;
}
.brand:hover .drop:before,
.login:hover,
.brand:hover {
 background-color: rgba(0,0,0,.1);
 background-color: rgba(255,255,255,.75);
 background-color: #EEE;
 color: #909090;
 color: rgba(0,0,0,0.65);
 text-shadow: -1px 1px 0 rgba(255,255,255,0.1);
}
.brand:hover .logo {
 background-image: url(img/fabricator_9e_90.png);
 background-image: url(img/fabricator_333_90.png);
}
.logo {
 background: url(img/fabricator_fff_90.png) center no-repeat;
 display: inline-block;
 vertical-align: top;
 height: 30px;
 width: 30px;
 line-height: 1;
 margin-right: 4px;
}

.jumplist {
 padding: 0;
 margin: 0;
 list-style: none;
 display: none;
}
.jumplist a {
 display: block;
 text-decoration: none;
 color: inherit;
}

.login {
 float: right;
 display: inline-block;
 color: inherit;
 vertical-align: top;
 text-decoration: none;
 line-height: 24px;
 padding: 5px 8px;
 font-weight: bold;
}
.logged-in {
 float: right;
 display: inline-block;
 vertical-align: top;
 padding: 1px 2px;
}

/* Search Icon in header */
.header .search {
 float: right;
 position: relative;
}
.search label {
 display: inline-block;
 padding: 5px;
 text-align: center;
 line-height: 24px;
 font-size: 21px;
 vertical-align: top;
 width: 34px;
}
.search:hover > *,
.search .collapse-toggle:checked ~ * { color: rgba(0,0,0,.7); background-color: #eeeeee; }
.search:hover > .find:before,
.search .collapse-toggle:checked + label:before { content: '\f1b6'; }
.fi.find:before {
 content: '\f002';
}
.search:hover .find-user {
 display: block;
}
.find-user {
 position: absolute;
 top: 100%;
 right: 0;
 background-color: transparent;
 border-top: 1px solid rgba(0, 0, 0, 0.85);
 box-shadow: 0 2px 2px rgba(0,0,0,0.2);
 white-space: nowrap;
}
.find-user dl,
.find-user dt,
.find-user dd {
 padding: 0;
 margin: 0;
}
.find-user dt {
 text-align: center;
 font-weight:bold;
 padding: 2px;
 border-bottom: 1px solid rgba(0,0,0,.1);
 display: none;
}
.find-user input {
 margin-right: 34px;
 width: 220px;
}
.find-user input,
.find-user button {
 border: 1px solid transparent;
 background-color: transparent;
 background-color: none;
 vertical-align: top;
 display: inline-block;
 padding: 2px 4px;
 line-height: 28px;
 height: 30px;
 font-size: 16px;
}
.find-user input:hover,
.find-user input:active,
.find-user input:invalid,
.find-user input:focus {
 background-color: rgba(0,0,0,.05);
 border: 0 none;
}
.find-user button {
 cursor: pointer;
 width: 34px;
 float: right;
 line-height: 16px;
}
.find-user button:hover {
 background-color: rgba(80,80,90,0.3);
}

/* Content styles */
.msg {
 width: auto;
 background-color: rgba(255,255,255,.55);
 color: rgba(0,0,0,0.87);
 padding: 6px;
 text-align: center;
 margin: 0 auto 8px;
 box-shadow: 0 2px 4px 1px rgba(0,0,0,.3);
 max-width: 1000px;
}

.container {
 margin-top: 40px;
 position: relative;
}
.wrapper {
 padding: 4px;
 z-index: 1;
 background-color: #b5b4b7;
}
.filter-wrapper,
.item-type {
 box-shadow: 0 2px 4px 1px rgba(0,0,0,.2);
}

.profile:hover {
 background-color: rgba(0,0,0,.05);
}

.backpack-info .profile {
 padding: 2px;
 line-height: 28px;
 display: block;
 text-decoration: none;
 color: inherit;
}
.backpack-info .avatar {
 height: 28px;
 width: 28px;
 box-shadow: 0 0 1px 1px rgba(0,0,0,.05) inset;
 vertical-align: top;
 border: none;
 margin-right: 2px;
}
.backpack-info .backpack {
 float: right;
 display: inline-block;
 height: 100%;
 line-height: 24px;
 padding: 4px;
}

/* Killstreak related items overview + trade links */
.ksitems, .ksitems ul {
 padding: 0;
 margin: 0;
}
.ksitems {
 text-align: justify;
 font-size: 0;
 width: 100%;
}
.ksitems:after {
 display: inline-block;
 content: '';
 width: 100%;
}
.ksitems li {
 list-style: none outside none;
 display: block;
 font-size: 16px;
}
.ksitems > li {
 display: inline-block;
 vertical-align: top;
}
.part-info {
 position: relative;
 padding: 1px;
 font-size: 16px;
}
.part-info .part {
 vertical-align: bottom;
 margin: 0 1px;
 font-size: 14px;
 line-height: 60px;
}
.part-info dl {
 z-index: 1;
 position: absolute;
 top: 0;
 left: 100%;
 min-height: 100%;
 padding-left: 3px;
 display: none;
 min-width: 175px;
}
.part-info dl > * {
 vertical-align: top;
 line-height: 16px;
}
.part-info dt {
 margin: 0;
 padding: 2px 3px 2px 1px;
 white-space: nowrap;
 color: #333;
}
.part-info dd {
 margin: 0;
 display: inline-block;
 width: 50%;
 font-size: 14px;
 padding: 0;
 text-align: center;
 color: rgba(0,0,0,.5);
}
.part-info .trade-links {
 padding: 0 2px 2px 0;
 padding: 0;
 display: block;
 width: 100%;
 text-align: left;
 font-size: 15px;
 line-height: 21px;
 color: rgba(0,0,0,.4);
 white-space: nowrap;
 border-top: 1px solid rgba(0,0,0,.05);
}
.part-info .part:empty {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
 filter: alpha(opacity=50);
 opacity: 0.5;
}
.part-info:hover {
 z-index: 2;
 box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.15);
 background-color: #EEE;
}
.part-info:hover dl {
 box-shadow: 2px 1px 1px 1px rgba(0,0,0,0.15);
 display: block;
 background-color: #EEE;
}
.part-info:hover .part {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 filter: alpha(opacity=100);
 opacity: 1;
}

/* ksitems overview external links */
.trade-links:before {
 content: 'Find on: ';
 color: rgba(0,0,0,.8);
}
.trade-links a {
 text-decoration: none;
 display: inline-block;
 color: inherit;
 text-align: center;
}
.trade-links .fi,
.trade-links .stm {
 vertical-align: top;
 color: rgba(33,33,33,0.54);
 font-size: 14px;
 line-height: 20px;
}
.trade-links .fi:before,
.trade-links .stm:before { padding: 0 6px; }
.trade-links a:hover { background-color: rgba(0,0,0,.1); }
.trade-links a:hover .fi, .trade-links a:hover .stm { color: rgba(33,33,33,0.87); }

/* Killstreak related content/items */
.filterable {
 font-size: 0;
 text-align: center;
 padding: 4px;
}
.filterable .item-type {
 display: inline-block;
 width: 95%;
 vertical-align: top;
 margin: 4px;
 text-align: left;
 background-color: rgba(255,255,255,0.45);
 min-width: 400px;
}
.filterables-head .itemtype-toggle {
 height: 30px;
 line-height: 30px;
 font-size: 20px;
 font-family: Tahoma;
 display: block;
}
.itemtype-toggle:hover {
 background-color: rgba(115,115,150,0.07);
}
.toggle-status:before,
.classes-toggle:before,
.sheens-toggle:before,
.slots-toggle:before,
.streakers-toggle:before,
.itemtype-toggle:before {
 display: inline-block;
 width: 24px;
 margin-right: 4px;
 text-align: center;
 height: 100%;
 height: 30px;
 vertical-align: top;
 font-size: 15px;
 font-size: 32px;
 line-height: 30px;
 content: '\2795';
 content: '+';
 background-color: rgba(0,0,0,0.1);
 font-family: sans-serif;
 font-weight: normal;
 overflow: hidden;
}
.itemtype-toggle:before {
 width: 30px;
}
.slots-collapse:checked ~ .slots-toggle:before,
.sheens-collapse:checked ~ .sheens-toggle:before,
.streakers-collapse:checked ~ .streakers-toggle:before {
 content: '+';
}
.classes-collapse:checked ~ .classes-toggle:before,
.sheens-collapse ~ .sheens-toggle:before,
.slots-collapse ~ .slots-toggle:before,
.streakers-collapse ~ .streakers-toggle:before,
.type-toggle:checked ~ .filterables-head .itemtype-toggle:before {
 content: '\2796';
 content: '\2212';
}
.sheens-collapse:checked ~ .sheen-filter,
.slots-collapse:checked ~ .slot-filter,
.streakers-collapse:checked ~ .streaker-filter,
.type-toggle:not(:checked) ~ .filterables-head label:not(.itemtype-toggle),
.type-toggle:not(:checked ) ~ .class { display: none; }

.bonusfilters-toggle .toggle-status:before {
 color: inherit;
 content: '\23EC';
 content: '\25BD';
 font-size: 16px;
 line-height: 30px;
 background-color: transparent;
 margin: 0;
}
.bonusfilter-toggle:hover,
.bonusfilter-collapse:checked ~ .bonusfilters-toggle .toggle-status { color: rgba(0,0,0,.55); }
.bonusfilter-collapse:checked ~ .bonusfilters-toggle .toggle-status:before { content: '\25BC'; }
}
.bonusfilter-collapse:checked ~ .additional-filters {
 display: block;
}
.type-toggle:not(:checked ) ~ .filterables-head .bonusfilter-collapse:checked ~ .additional-filters {
 display: none;
}
.bonusfilters-toggle,
.tier-toggle { /* fab/kit/ks itemtype head */
 float: right;
 height: 30px;
 padding: 0 5px;
 line-height: 30px;
 text-align: center;
 vertical-align: middle;
}
.bonusfilters-toggle {
 width: auto;
 margin: 0;
 padding: 0 2px;
 color: rgba(0,0,0,.2);
}
.stock-toggle:checked ~ .filterables-head .bonusfilters-toggle .toggle-status,
.status-filter:checked ~ .filterables-head .bonusfilters-toggle .toggle-status,
.started-filter:checked ~ .filterables-head .bonusfilters-toggle .toggle-status,
.completion-toggle:checked ~ .filterables-head .bonusfilters-toggle .toggle-status,
.quality-filter:checked ~ .filterables-head .bonusfilters-toggle .toggle-status {
 color: rgba(20, 120, 20, 0.8);
}
.tier-toggle:hover,
.bonusfilters-toggle:hover {
 background-color: rgba(0,0,0,.1);
}
.tier-toggle .part {
 vertical-align: middle;
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
 filter: alpha(opacity=30);
 opacity: 0.3;
}
.basic:checked ~ .filterables-head .basic,
.specialized:checked ~ .filterables-head .specialized,
.professional:checked ~ .filterables-head .professional {
 background-color: rgba(15,15,50,.1);
}
.basic:checked ~ .filterables-head .basic .part,
.specialized:checked ~ .filterables-head .specialized .part,
.professional:checked ~ .filterables-head .professional .part /*,
.toggle-sheen:checked ~ .filterable .tier-collapse:checked ~ .tier-collapse:checked ~ .filterables-head .tier-toggle .part,
.toggle-sheen:checked ~ .filterable .specialized .part,
.toggle-streaker:checked ~ .filterable .specialized .part,
.toggle-sheen:checked ~ .filterable .professional .part,
.toggle-streaker:checked ~ .filterable .professional .part,
.toggle-sheen:checked ~ .filterable .tier-collapse:checked ~ .tier-collapse:checked ~ .filterables-head .tier-toggle .part*/ {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 filter: alpha(opacity=100);
 opacity: 1;
}
/*.toggle-sheen:checked ~ .filterable .professional:checked ~ .filterables-head .specialized .part,
.toggle-sheen:checked ~ .filterable .specialized:checked ~ .filterables-head .professional .part {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
 filter: alpha(opacity=30);
 opacity: 0.3;
}
.toggle-streaker:checked ~ .filterable .basic:checked ~ .filterables-head .basic .part,
.toggle-streaker:checked ~ .filterable .specialized:checked ~ .filterables-head .specialized .part {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
 filter: alpha(opacity=50);
 opacity: 0.5;
}*/

.additional-filters {
 font: 14px/18px Tahoma, sans-serif;
 background-color: rgba(0, 0, 0, 0.03);
 border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.additional-filters dt,
.additional-filters dd {
 margin: 0;
 vertical-align: top;
 display: inline-block;
 line-height: 26px;
 width: 30%;
}
.additional-filters dt {
 padding-right: 5px;
 text-align: right;
 cursor: default;
}
.additional-filters dd {
 width: 20%;
 text-align: center;
}
.additional-filters .qualities,
.additional-filters .required-items {
 width: 70%;
}
.additional-filters dd label {
 display: inline-block;
 vertical-align: top;
 width: 50%;
}
.additional-filters label:first-child:nth-last-child(10), .additional-filters label:first-child:nth-last-child(10) ~ label { width: 10% }
.additional-filters label:first-child:nth-last-child(9), .additional-filters label:first-child:nth-last-child(9) ~ label { width: 11.11% }
.additional-filters label:first-child:nth-last-child(8), .additional-filters label:first-child:nth-last-child(8) ~ label { width: 12.5% }
.additional-filters label:first-child:nth-last-child(7), .additional-filters label:first-child:nth-last-child(7) ~ label { width: 14.285% }
.additional-filters label:first-child:nth-last-child(6), .additional-filters label:first-child:nth-last-child(6) ~ label { width: 16.66% }
.additional-filters label:first-child:nth-last-child(5), .additional-filters label:first-child:nth-last-child(5) ~ label { width: 20% }
.additional-filters label:first-child:nth-last-child(4), .additional-filters label:first-child:nth-last-child(4) ~ label { width: 25% }
.additional-filters label:first-child:nth-last-child(3), .additional-filters label:first-child:nth-last-child(3) ~ label { width: 33.33% }

.toggle-quality:before {
 color: inherit !important;
 text-shadow: 1px 1px 1px rgba(100, 100, 100,0.8) !important;
}

.additional-filters dt:hover,
.additional-filters dt:hover + dd,
.additional-filters label:hover {
 background-color: rgba(0,0,0,.05);
}

.filterable .class {
 font: 15px/21px sans-serif;
}
.filterable .class,
.filters li + li {
 border-top: 1px solid rgba(0,0,0,.1);
}

.toggle-slot:checked ~ .wrapper .slot-filter,
.toggle-sheen:checked ~ .wrapper .sheen-filter,
.toggle-streaker:checked ~ .wrapper .streaker-filter,
.toggle-class:checked ~ .wrapper .class-filter {
 color: rgba(0,0,0,0.35);
}

.toggle-slot:checked ~ .wrapper .slot-filter:hover,
.toggle-class:checked ~ .wrapper .class-filter:hover,
.toggle-sheen:checked ~ .wrapper .sheen-filter:hover,
.toggle-streaker:checked ~ .wrapper .streaker-filter:hover {
 /*color: rgba(0,0,0,.6);*/
 text-shadow: 0 0 2px rgba(5,5,5,.2);
 background-color: rgba(0,0,0,.1);
}

.filters .class-filter:hover,
.filters .sheen-filter:hover,
.filters .slot-filter:hover,
.filters .streaker-filter:hover,
.all:checked ~ .wrapper .all-toggle,
.multi:checked ~ .wrapper .multi-toggle,
.scout:checked ~ .wrapper .scout-toggle,
.soldier:checked ~ .wrapper .soldier-toggle,
.pyro:checked ~ .wrapper .pyro-toggle,
.demoman:checked ~ .wrapper .demoman-toggle,
.heavy:checked ~ .wrapper .heavy-toggle,
.engineer:checked ~ .wrapper .engineer-toggle,
.medic:checked ~ .wrapper .medic-toggle,
.sniper:checked ~ .wrapper .sniper-toggle,
.spy:checked ~ .wrapper .spy-toggle,
.primary:checked ~ .wrapper .primary-toggle,
.secondary:checked ~ .wrapper .secondary-toggle,
.melee:checked ~ .wrapper .melee-toggle,
.sh-ae:checked ~ .wrapper .sheen-ae,
.sh-dd:checked ~ .wrapper .sheen-dd,
.sh-hr:checked ~ .wrapper .sheen-hr,
.sh-m:checked ~ .wrapper .sheen-m,
.sh-mg:checked ~ .wrapper .sheen-mg,
.sh-ts:checked ~ .wrapper .sheen-ts,
.sh-vv:checked ~ .wrapper .sheen-vv,
.ks-cd:checked ~ .wrapper .streaker-cd,
.ks-f:checked ~ .wrapper .streaker-f,
.ks-fh:checked ~ .wrapper .streaker-fh,
.ks-hb:checked ~ .wrapper .streaker-hb,
.ks-i:checked ~ .wrapper .streaker-i,
.ks-s:checked ~ .wrapper .streaker-s,
.ks-t:checked ~ .wrapper .streaker-t,
.toggle-class:checked ~ .wrapper .class-filter:hover,
.toggle-slot:checked ~ .wrapper .slot-filter:hover,
.toggle-sheen:checked ~ .wrapper .sheen-filter:hover,
.toggle-streaker:checked ~ .wrapper .streaker-filter:hover {
 color: rgba(0,0,0,0.87);
}

/* Class name item type */
.filterable .class-name {
 font-size: 16px;
 display: block;
 padding: 4px 4px 4px 24px;
 line-height: 1;
 line-height: 20px;
}
.class-toggle:hover {
 background-color: rgba(50,50,50,0.1);
}
.class-toggle {
 position: relative;
}
.class-toggle:before { /* Triangle */
 content: '';
 vertical-align: top;
 vertical-align: text-bottom;
 display: inline-block;
 border: 8px solid;
 border: 8px inset;
 border-top-color: transparent;
 border-top-color: rgba(0,0,0,0);
 border-bottom-color: transparent;
 border-bottom-color: rgba(0,0,0,0);
 border-left-color: rgba(128,128,128);
 border-left-color: rgba(0,0,0,.5);
 border-right-color: transparent;
 border-right-color: rgba(0,0,0,0);
 border-width: 8px 2px 8px 14px;
 margin: 3px 0 3px 5px;
 left: 0;
 position: absolute;
 /*-moz-transform: scale(.9999);*/
 transition: 0.001s linear border-color;
}
.class-collapse:checked ~ .class-toggle:before {
 border-top-color: rgb(51,51,51);
 border-top-color: rgba(0,0,0,.2);
 border-bottom-color: transparent;
 border-left-color: transparent;
 border-right-color: transparent;
 border-width: 14px 8px 2px;
}

.filters-label {
 direction: ltr;
 display: block;
 font: 18px/24px Tahoma, sans-serif;
 padding: 2px 4px;
}
.filters-label, .item-search {
 border-bottom: 1px solid rgba(0,0,0,.1);
}

.item-search input {
 border: 0 none;
 height: 30px;
 line-height: 22px;
 padding: 4px 5px;
 background-color: transparent;
 display: block;
}
#search {
 box-shadow: none;
 width: 90%;
}
#search:invalid {
 box-shadow: 0 0 1px 1px rgba(0,0,0,.05) inset;
}
#search:valid {
 box-shadow: 0 0 1px 1px rgba(0,0,0,.15) inset;
}
.item-search .reset {
 text-transform: uppercase;
 font-weight: bold;
 font: 17px/22px sans-serif;
 cursor: pointer;
 float: right;
 text-align: center;
 color: rgba(0,0,0,.35);
 width: 10%;
}

.filter-wrapper .filters  {
 list-style: none outside none;
 padding: 0;
 margin: 0;
}
.slots-toggle, .sheens-toggle, .classes-toggle, .streakers-toggle {
 font-weight: bold;
}
.slots-toggle:hover,
.sheens-toggle:hover,
.classes-toggle:hover,
.streakers-toggle:hover {
 background-color: rgba(0,0,15,0.05);
}
.slots-toggle, .sheens-toggle, .classes-toggle, .streakers-toggle,
.class-filter,
.sheen-filter,
.streaker-filter,
.slot-filter {
 display: block;
 line-height: 30px;
 height: 30px;
}
.class-filter,
.sheen-filter,
.streaker-filter,
.slot-filter {
 padding: 2px 4px;
 line-height: 26px;
 font-size: 14px;
 white-space: nowrap;
 vertical-align: top;
}
.slot-filter,
.sheen-filter,
.streaker-filter {
 padding: 2px 2px 2px 27px;
 position: relative;
}
.slots-collapse:not(:checked) ~ .slots-toggle,
.sheens-collapse:not(:checked) ~.sheens-toggle,
.streakers-collapse:not(:checked) ~.streakers-toggle,
.slot-filter,
.class-filter,
.sheen-filter,
.streaker-filter {
 width: 50%;
 display: inline-block;
}

.stock-filter:before,
.fillstatus-filter:before,
.tradestatus-filter:before,
.completion-filter:before,
.slot-filter:before,
.sheen-filter:before {
 color: rgba(0,0,0,.15);
 text-shadow: 1px 1px rgba(100,100,100,0.5);
 content: '\2714';
 display: inline-block;
 text-align: center;
 width: 24px;
}
.slot-filter:before,
.sheen-filter:before {
 position: absolute;
 margin-left: -27px;
}
.stock-filter.unlock:before,
.fillstatus-filter.unfilled:before,
.tradestatus-filter.nevertradable:before,
.completion-filter.incompletable:before,
.toggle-slot:checked ~ .wrapper .slot-filter:before,
.toggle-sheen:checked ~ .wrapper .sheen-filter:before {
 content: '\2718'; /* unicode cross */
}
.tradestatus-filter.untradable:before {
 font-family: "FontAwesome";
 content: '\f017'; /* Clock */
}

.sheen-filter .sheen {
 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 width: 24px;
 border: 1px solid rgba(55,55,55,0.05);
 box-shadow: 0 0 8px 6px rgba(0,0,0,.05) inset;
}
.sheen-filter:hover .sheen {
 box-shadow: none;
 border-color: rgba(55,55,55,0.1);
}
.toggle-sheen:checked ~ .wrapper .sheen {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
 filter: alpha(opacity=40);
 opacity: 0.4;
}
.toggle-sheen:checked ~ .wrapper .sheen-filter:hover .sheen,
.sh-ae:checked ~ .wrapper .sheen-ae .sheen,
.sh-dd:checked ~ .wrapper .sheen-dd .sheen,
.sh-hr:checked ~ .wrapper .sheen-hr .sheen,
.sh-m:checked ~ .wrapper .sheen-m .sheen,
.sh-mg:checked ~ .wrapper .sheen-mg .sheen,
.sh-ts:checked ~ .wrapper .sheen-ts .sheen,
.sh-vv:checked ~ .wrapper .sheen-vv .sheen {
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 filter: alpha(opacity=100);
 opacity: 1;
}

.sheen.sh-rs { background-color: rgba(243,0,0, 0.5); }
.sheen.sh-bs { background-color: rgba(0,98,255,0.5); }
/*.sheen.sh-ts { background-color: rgba(243,0,0, 0.5); color: #0062FF; } blue text
.sheen.sh-ts { background-color: rgba(0,98,255,0.5); color: #F30000; } red text */
.sheen.sh-ts { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)); background-color: rgba(0, 98, 255, 0.1); } /* gradient-background */
.sheen.sh-mg { background-color: rgba(0,255,0,0.45); }
.sheen.sh-vv { background-color: rgba(102,44,145,0.6); }
.sheen.sh-ae { background-color: rgba(5,190,0,0.55); }
.sheen.sh-ae { background-color: rgba(5,175,5,0.55); }
.sheen.sh-dd { background-color: rgba(255,255,0,0.7); }
.sheen.sh-m { background-color: rgba(255,133,0,0.5); }
.sheen.sh-hr { background-color: rgba(255,62,132,0.5); }

.slots-collapse ~ .slots-toggle:before,
.sheens-collapse ~ .sheens-toggle:before,
.streakers-collapse ~ .streakers-toggle:before,
.classes-collapse:checked ~ .classes-toggle:before {
 color: rgba(50,50,5,0.5);
 background-color: rgba(0,0,0,.05);
}
.slots-collapse:checked ~ .slots-toggle:before,
.sheens-collapse:checked ~.sheens-toggle:before,
.streakers-collapse:checked ~.streakers-toggle:before,
.classes-collapse ~ .classes-toggle:before {
 color: rgba(5,5,5,0.5);
 background-color: rgba(0,0,0,.15);
}
.slots-collapse:checked ~ .slots-toggle:active:before,
.sheens-collapse:checked ~.sheens-toggle:active:before,
.streakers-collapse:checked ~.streakers-toggle:active:before,
.classes-collapse ~ .classes-toggle:active:before {
 color: rgba(15,15,15,0.5);
 background-color: rgba(0,0,0,.1);
}
.toggle-slot:checked  ~ .wrapper .slots-toggle:before,
.toggle-class:checked ~ .wrapper .classes-toggle:before,
.toggle-sheen:checked ~ .wrapper .sheens-toggle:before,
.toggle-streaker:checked ~ .wrapper .streakers-toggle:before {
 content: '\2757';
 font-size: 16px;
 line-height: 2;
 content: '!';
 font-size: 18px;
 line-height: 30px;
 font-weight: bold;
 color: rgba(0,75,0,0.6);
}

.toggle-slot:checked ~ .wrapper .slot-filter:hover:before,
.toggle-sheen:checked ~ .wrapper .sheen-filter:hover:before,
.sh-ae:checked ~ .wrapper .sheen-ae:before,
.sh-dd:checked ~ .wrapper .sheen-dd:before,
.sh-hr:checked ~ .wrapper .sheen-hr:before,
.sh-m:checked ~ .wrapper .sheen-m:before,
.sh-mg:checked ~ .wrapper .sheen-mg:before,
.sh-ts:checked ~ .wrapper .sheen-ts:before,
.sh-vv:checked ~ .wrapper .sheen-vv:before,
.primary:checked ~ .wrapper .primary-toggle:before,
.secondary:checked ~ .wrapper .secondary-toggle:before,
.melee:checked ~ .wrapper .melee-toggle:before {
 content: '\2714';
 color: rgba(0,0,0,.76);
 color: inherit;
}

/* class filter labels emblems */
.toggle-class:checked ~ .wrapper .class-filters .class-emblem {
 background-image: url(img/classemblems35.png);
}
.class-filters .class-emblem {
 margin: 1px 3px 1px 0;
 line-height: 26px;
 font-size: 1;
 vertical-align: top;
}
.all:checked ~ .wrapper .all-toggle .class-emblem,
.multi:checked ~ .wrapper .multi-toggle .class-emblem,
.scout:checked ~ .wrapper .scout-toggle .class-emblem,
.soldier:checked ~ .wrapper .soldier-toggle .class-emblem,
.pyro:checked ~ .wrapper .pyro-toggle .class-emblem,
.demoman:checked ~ .wrapper .demoman-toggle .class-emblem,
.heavy:checked ~ .wrapper .heavy-toggle .class-emblem,
.engineer:checked ~ .wrapper .engineer-toggle .class-emblem,
.medic:checked ~ .wrapper .medic-toggle .class-emblem,
.sniper:checked ~ .wrapper .sniper-toggle .class-emblem,
.spy:checked ~ .wrapper .spy-toggle .class-emblem {
 background-image: url(img/classemblems60.png);
}

/* Streaker icon labels */
.streaker-filter .ks-icon {
 margin: 4px 3px 4px -24px;
 vertical-align: middle;
 position: absolute;
}
.streaker-filter:before {
 content: '';
 display: inline-block;
 position: absolute;
 left: 0;
 top: 0;
 height: 100%;
 width: 24px;
 background-color: rgba(0,0,0,.05);
 box-shadow: 0 0 8px 6px rgba(0,0,0,.05) inset;
}
.toggle-streaker:checked ~ .wrapper .ks-icon {
 background-image: url(img/streakersprite18_35.png);
 background-image: url(img/killstreak-icons-sprite-35.png);
}
/*.ks-item [class*="sh-"],
.ks-item [class*="sh-"][class*="ks-"] {
 width: 20px;
 height: 20px;
 //margin-top: -2px;
 display: inline-block;
 font-size: 0.1px;
 border: 1px solid rgba(0,0,0,.4);
 vertical-align: top;
 border-radius: 2px;
}
.ks-item [class*="sh-"][class*="ks-"]:not(.sh-ts) {
 background-image: url(img/streakersprite18_87.png);
 background-image: url(img/killstreak-icons-sprite.png);
}*/

.weapon::selection,
.weapon::-moz-selection  {
 user-select: all;
}

.ks-cd:checked ~ .wrapper .ks-cd,
.ks-f:checked ~ .wrapper .ks-f,
.ks-fh:checked ~ .wrapper .ks-fh,
.ks-hb:checked ~ .wrapper .ks-hb,
.ks-i:checked ~ .wrapper .ks-i,
.ks-s:checked ~ .wrapper .ks-s,
.ks-t:checked ~ .wrapper .ks-t {
 background-image: url(img/streakersprite18_87.png);
 background-image: url(img/killstreak-icons-sprite.png);
}
.toggle-streaker:checked ~ .wrapper .streaker-filter:hover .ks-icon {
 background-image: url(img/streakersprite18_60.png);
 background-image: url(img/killstreak-icons-sprite-60.png);
}
/* Team Shine gradient background-image fix */
.sh-ts.ks-cd { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }
.sh-ts.ks-f { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }
.sh-ts.ks-fh { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }
.sh-ts.ks-hb { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }
.sh-ts.ks-i { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }
.sh-ts.ks-s { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }
.sh-ts.ks-t { background-image: linear-gradient(135deg, rgba(0, 98, 255, 0.5), rgba(243, 0, 0, 0.5)), url(img/killstreak-icons-sprite.png); }


/* Simple Tooltip with data-tooltip attribute */
/* Will always show, has to be hidden per element */
[data-tooltip] {
 position: relative;
}
[data-tooltip]:after { /* Tooltip arrow */
 border-color: #333 transparent transparent;
 border-color: rgba(30,30,30,0.8) transparent transparent;
 border-style: solid;
 border-width: 4px;
 top: -4px;
 content: "";
 display: none;
 left: 50%;
 margin-left: -4px;
 position: absolute;
 z-index: 2;
}
[data-tooltip]:before, [data-tooltip].right:before, [data-tooltip].bottom:before { /* Tooltip contents */
 content: attr(data-tooltip);
 background-color: #333;
 background-color: rgba(30,30,30,0.95);
 position: absolute;
 font-size: 14px;
 font-weight: normal;
 text-align: center;
 line-height: 1.4;
 color: #AEAEAE;
 bottom: 100%;
 margin-bottom: 3px;
 padding: 4px;
 display: none;
 min-width: 30px;
 margin-left: 15px;
 right: 50%;
 transform: translate(50%, 0);
 z-index: 5;
 whitespace: pre-wrap;
 word-wrap: break-word;
 border-radius: 3px;
 text-shadow: none;
 text-transform: none;
}
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
 display: inline-block;
 white-space: pre;
}
.required-filter.req-pump:before { right: 152%; }
.required-filter.req-stabilizer:before { right: 163%; }
.required-filter.req-detector:before { right: 280%; }

/* Sheen/streaker exception for tooltip */
.shstr[data-tooltip]:before {
 right: 0;
 transform: translate(0%, 0);
}

/* Killstreak related items sprite */
.part {
 display: inline-block;
 width: 18px;
 height: 18px;
 vertical-align: text-bottom;
 text-align: center;
 font-size: 11px;
 font-weight: bold;
 background: url(img/completables_square_18px.png) left top no-repeat transparent;
 line-height: 18px;
 line-height: 1;
 color: rgba(22,22,22,0.8) !important;
 text-shadow: -1px -1px 0 #AEAEAE, 1px -1px 0 #AEAEAE, -1px 1px 0 #AEAEAE, 1px 1px 0 #AEAEAE;
 text-shadow: -1px -1px 0 rgba(233,233,233,0.5), 1px -1px 0 rgba(233,233,233,0.5), -1px 1px 0 rgba(233,233,233,0.5), 1px 1px 0 rgba(233,233,233,0.5);
  -webkit-touch-callout: none;
   -webkit-user-select: none;
    -khtml-user-select: none;
      -moz-user-select: -moz-none;
       -ms-user-select: none;
           user-select: none;
}
.part.part-button, .part-before.part-button:before {
 width: 24px; height: 24px;
 background-image: url(img/completables_square_24px.png);
}
.part.part-medium, .part-before.part-medium:before {
 width: 30px; height: 30px;
 background-image: url(img/completables_square_30px.png);
}
.part.part-big, .part-before.part-big:before {
 width: 40px; height: 40px;
 background-image: url(img/completables_square_40px.png);
}
.weapon-icon.w {
 background-image: url(img/completables_square_40px.png);
 background-size: 168px auto;
}

.tier-button {
 background: url(img/ksicontiersprite.png) left center no-repeat;
 width: 24px;
 height: 24px;
}
.tier-killstreak { background-position: 33.34% center; }
.tier-specialized { background-position: 66.667% center; }
.tier-professional { background-position: right center; }

.part.furnace, .tier.furnace, .part-before.furnace:before { background-position: 33.33% top; }
.part.processor, .tier.processor, .part-before.processor:before { background-position: 33.33% 33.33%; }
.part.kbob, .tier.kbob, .part-before.kbob:before { background-position: 33.33% 66.66%; }
.part.stabilizer, .tier.stabilizer, .part-before.stabilizer:before { background-position: 66% top; }
.part.pump, .tier.pump, .part-before.pump:before { background-position: 66.66% 33.33%; }
.part.detector, .tier.detector, .part-before.detector:before { background-position: 66.66% 66.66%; }
.part.bulb, .tier.bulb, .part-before.bulb:before { background-position: 66.66% bottom; }
.part.digester, .tier.digester, .part-before.digester:before { background-position: 33.33% bottom; }
.part.chemset, .tier.chemset, .part-before.chemset:before { background-position: left 33.33%; }
.part.fab-specialized, .tier.fab-specialized, .part-before.fab-specialized:before, .fabricators .weapon-icon.w { background-position: left 66.66%; }
.part.fab-professional, .tier.fab-professional, .part-before.fab-professional:before { background-position: left bottom; }
.part.strangifier, .tier.strangifier, .part-before.strangifier:before { background-position: right top; }
.part.kit-killstreak, .tier.kit-killstreak, .part-before.kit-killstreak:before { background-position: right 33%; }
.part.kit-specialized, .tier.kit-specialized, .part-before.kit-specialized:before, .kits .weapon-icon.w { background-position: right 66.66%; }
.part.kit-professional, .tier.kit-professional, .part-before.kit-professional:before { background-position: right bottom; }

.parts .part,
.ksitems .part-big { /* KS item overview partcount */
 color: #ddd !important;
 color: rgba(255,255,255,.87) !important;
 text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333;
 text-shadow: -1px -1px 0 rgba(0,0,0,.6), 1px -1px 0 rgba(0,0,0,.6), -1px 1px 0 rgba(0,0,0,.6), 1px 1px 0 rgba(0,0,0,.6);
 text-align: right;
}

/* Class + weapon tokens/emblems sprite */
.class-emblem {
 width: 24px;
 height: 24px;
 display: inline-block;
 vertical-align: top;
 line-height: 18px;
 font-size: 16px;
 background-image: url(img/classemblems60.png);
 background-repeat: no-repeat;
 background-position: center top;
 background-size: 96px auto;
}
.class-emblem.all,
.class-emblem.sandvich { background-position: 33.334% top; }
.class-emblem.multi { background-position: 66.667% top; }
.class-emblem.scout { background-position: right top; }
.class-emblem.soldier { background-position: left center; }
.class-emblem.pyro { background-position: 33.334% center; }
.class-emblem.demoman { background-position: 66.667% center; }
.class-emblem.heavy { background-position: right center; }
.class-emblem.engineer { background-position: left bottom; }
.class-emblem.medic { background-position: 33.334% bottom; }
.class-emblem.sniper { background-position: 66.667% bottom; }
.class-emblem.spy { background-position: right bottom; }

/* Killstreak icons */
.ks-icon {
 background-image: url(img/streakersprite18_87.png);
 background-image: url(img/killstreak-icons-sprite.png);
 background-position: top left;
 background-repeat: no-repeat;
 width: 18px;
 height: 18px;
 display: inline-block;
 vertical-align: middle;
 text-align: center;
 line-height: 1;
}
.ks-t1 { background-position: 10% center; }
.ks-t2 { background-position: 20% center; }
.ks-t3 { background-position: 30% center; }
.ks-cd { background-position: 40% center; } /* -81px */
.ks-f { background-position: 50% center; } /* -101px */
.ks-fh { background-position: 60% center; } /* -121px */
.ks-hb { background-position: 70% center; } /* -141px */
.ks-i { background-position: 79.5% center; } /* -161px */
.ks-s { background-position: 89.75% center; } /* -181px */
.ks-t { background-position: 99.5% center; } /*- 201px */

/* Paint splatter */
[class*="paint-"] {
	background: url(img/paintssprite.png) no-repeat top left;
	background-size: 600% auto;
	display: inline-block;
	width: 22px;
	height: 22px;
	margin: 0 -2px;
	vertical-align: inherit;
}
[class*="paint-"][data-tooltip]:before {
    transform: translate(85%, 0);
}
.weapon-icon:not(:empty) { position: relative; }
.weapon-icon [class*="paint-"] {
	position: absolute;
	top: -4px;
	right: -4px;
	margin: 0;
}
/* row x column | paint name */
.paint-E6E6E6 { background-position: 20% top; } /* 1x2 | An Extraordinary Abundance of Tinge */
.paint-D8BED8 { background-position: 40% top; } /* 1x3 | Color No. 216-190-216 */
.paint-C5AF91 { background-position: 60% top; } /* 1x4 | Peculiarly Drab Tincture */
.paint-F0E68C { background-position: 80% top; } /* 1x5 | The Color of a Gentlemann's Business Pants */
.paint-E7B53B { background-position: right top; } /* 1x6 | Australium Gold */
.paint-7E7E7E { background-position: left 25%; } /* 2x1 | Aged Moustache Grey */
.paint-7C6C57 { background-position: 20% 25%; } /* 2x2 | Ye Olde Rustic Colour */
.paint-A57545 { background-position: 40% 25%; } /* 2x3 | Muskelmannbraun */
.paint-694D3A { background-position: 60% 25%; } /* 2x4 | Radigan Conagher Brown */
.paint-2D2D24 { background-position: 80% 25%; } /* 2x5 | After Eight */
.paint-141414 { background-position: right 25% ; } /* 2x6 |  A Distinctive Lack of Hue */
.paint-BCDDB3 { background-position: left 50%; } /* 3x1 | A Mann's Mint */
.paint-729E42 { background-position: 20% 50%; } /* 3x2 | Indubitably Green */
.paint-32CD32 { background-position: 40% 50%; } /* 3x3 | The Bitter Taste of Defeat and Lime */
.paint-808000 { background-position: 60% 50%; } /* 3x4 | Drably Olive */
.paint-2F4F4F { background-position: 80% 50%; } /* 3x5 | A Color Similar to Slate */
.paint-424F3B { background-position: right 50%; } /* 3x6 | Zepheniah's Greed */
.paint-51384A { background-position: left 75%; } /* 4x1 | Noble Hatter's Violet */
.paint-7D4071 { background-position: 20% 75%; } /* 4x2 | A Deep Commitment to Purple */
.paint-FF69B4 { background-position: 40% 75%; } /* 4x3 | Pink as Hell */
.paint-E9967A { background-position: 60% 75%; } /* 4x4 | Dark Salmon Injustice */
.paint-CF7336 { background-position: 80% 75%; } /* 4x5 | Mann Co. Orange */
/* Team Colors */
.paint-C36C2D, .paint-B88035 { background-position: right 75%; } /* 4x6 | Cream Spirit */
.paint-A89A8C, .paint-839FA3 { background-position: left bottom; } /* 5x1 | Waterlogged Lab Coat */
.paint-803020, .paint-256D8D { background-position: 20% bottom; } /* 5x2 | The Value of Teamwork */
.paint-B8383B, .paint-5885A2 { background-position: 40% bottom; } /* 5x3 | Team Spirit */
.paint-654740, .paint-28394D { background-position: 60% bottom; } /* 5x4 | An Air of Debonair */
.paint-483838, .paint-384248 { background-position: 80% bottom; } /* 5x5 | Operator's Overalls */
.paint-3B1F23, .paint-18233D { background-position: right bottom; } /* 5x6 | Balaclavas Are Forever */

@media only screen and (max-width: 1050px) {
 .ksitems > li:nth-last-child(-n+3) dl {
  left: auto;
  right: 100%;
  box-shadow: -1.5px 1px 1px 1px rgba(0,0,0,0.10);
 }
}

/*@media only screen and (min-width: 740px) and (max-width: 1049px) {*/
@media only screen and (min-width: 740px) and (max-width: 1199px) {
 .wrapper {
  white-space: nowrap;
 }
 .filters-label, .item-search { display: none; }
 .backpack-info, .filter-wrapper {
  display: inline-block;
  width: 50%;
  vertical-align: top;
  white-space: normal;
 }
 .filter-wrapper:before {
  direction: ltr;
  content: 'Filters';
  display: none;
  display: block;
  font: 18px/24px Tahoma, sans-serif;
  padding: 2px 4px;
  border-bottom: 1px solid rgba(0,0,0,.1);
  top: -25px;
 }
 .item-type {
  max-width: 49%;
 }
}

@media only screen and (min-width: 1200px) {
 body { overflow-y: hidden; }
 .container {
  margin-top: 35px;
  margin-left: 310px;
  padding: 4px;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.1) inset;
 }
 .content {
  margin: auto;
 }
 .filterable .item-type {
  width: 48.5%;
  width: 33%;
  vertical-align: top;
  margin: 5px;
  min-width: 450px;
  max-width: 560px;
 }
 .wrapper {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 310px;
  padding: 0;
  height: 100%;
  padding-top: 35px;
  border-right: 1px solid rgba(0,0,0,0.15);
  box-shadow: 1px 1px 1px 1px rgba(0,0,0,.1);
 }
 .filters:before {
  box-shadow: 0 -5px 3px -5px rgba(0,0,0,0.3) inset;
 }
 .filter-wrapper {
  left: -16px;
  position: relative;
  position: absolute;
  //bottom: 0;
  vertical-align: top;
  direction: rtl;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  width: 326px;
  max-height: 340px;
  font-size: 0;
  box-shadow: 0 -5px 3px -5px rgba(0,0,0,0.3) inset;
 }
 .filters {
  direction: ltr;
  font-size: 16px;
 }
}
@media only screen and (min-width: 1800px) {
 .filterable .item-type {
  width: 24.5%;
 }
}

/* Valve Quality colors */
.normal { color: #B2B2B2; }
.unique { color: #FFD700; }
.vintage { color: #5b76a5; }
.vintage { color: #476291; }
.genuine { color: #4D7455; }
.strange { color: #CF6A32; }
.unusual { color: #8650AC; }
.haunted { color: #38F3AB; }
.collectors { color: #AA0000; }
.decorated, .decorated-weapon { color: #CACACA; }
.community, .self-made, .selfmade { color: #70B04A; }
.valve { color: #A50F79; }

/* Weapon Grades */
.civilian { color: #B0C3D9; }
.freelance { color: #5E98D9; }
.mercenary { color: #4B69FF; }
.commando {color: #8847FF; }
.assassin { color: #D32CE6; }
.elite { color: #EB4B4B; }

[data-kstier] { border-left: 5px solid; }
[data-kstier="1"] { border-color: #868686; }
[data-kstier="2"] { border-color: #0b9200; }
[data-kstier="2"] { border-color: #1bA210; }
[data-kstier="3"] { border-color: #cf5600; }
[data-kstier="3"] { border-color: #B32D00; }
[data-kstier="3"] { border-color: #C33D00; }
[data-kstier="3"] { border-color: #C35D20; }

/* Killstreak triangle */
.kits [data-kstier]:before,
.fabricators [data-kstier]:before {
 content: '';
 position: absolute;
 top: 50%;
 margin-top: -4px;
 left: -5px;
 border-style: inset;
 border-width: 4px 0px 4px 5px;
 border-color: transparent;
 border-left-color: rgba(0,0,0,.60);
}

[data-strange] { border-left: 2px solid #CF6A32; }
[data-normal] { border-left: 2px solid #B2B2B2; }
[data-vintage] { border-left: 2px solid #476291; }
[data-genuine] { border-left: 2px solid #4D7455; }
[data-haunted] { border-left: 2px solid #38F3AB; }
[data-unique] { border-left: 2px solid #FFD700; }
[data-collectors] { border-left: 2px solid #AA0000; }
[data-decorated] { border-left: 2px solid #FAFAFA; }
[data-unusual] { border-left: 2px solid #8650AC; }
[data-community], [data-self-made] { border-left: 2px solid #70B04A; }
[data-valve] { border-left: 2px solid #A50F79; }

[data-civilian] { border-left: 2px solid #B0C3D9; }
[data-freelance] { border-left: 2px solid #5E98D9; }
[data-mercenary] { border-left: 2px solid #4B69FF; }
[data-commando] { border-left: 2px solid #8847FF; }
[data-assassin] { border-left: 2px solid #D32CE6; }
[data-elite] { border-left: 2px solid #EB4B4B; }

.ks-item {
 position: relative;
 border-left-width: 5px;
 padding-left: 2px;
 padding-right: 2px;
 line-height: 1;
 display: block;
 vertical-align: top;
 font-size: 0;
 text-align: left;
 margin: 5px 0;
}
.ks-item:after { /* Clearfix per item */
 display: inline-block;
 content: '';
 width: 100%;
}
.ks-item:hover {
 background-color: rgba(0,0,0,0.03);
}
.ks-item > * {
 display: inline-block;
 vertical-align: top;
 font-size: 16px;
 line-height: 21px;
}

.market-prices {
 color: rgba(0,0,0,.5);
 text-decoration: none;
}

.ks-item:hover > *:not(.trade-status),
.ks-item:hover .weapon-tier {
 color: inherit;
}

/* weapon icon/info */
.weapon {
 white-space: nowrap;
 display: block;
}
.weapon-icon {
 display: inline-block;
 vertical-align: top;
 width: 44px;
 height: 42px;
 background-image: url(img/itemsprite_40px.png);
 background-repeat: no-repeat;
 margin-right: 2px;
 border-style: solid;
 border-width: 1px;
 border-color: transparent;
}
.weapon-icon img {
 max-width: 100%;
 max-height: 100%;
}
[data-craftable="0"] .weapon-icon {
 border: 1px dashed rgba(0,0,0,0.2);
 border-style: dashed;
 border-color: rgba(0,0,0,0.2);
}
.weapon-name {
 position: relative;
 display: inline-block;
 min-height: 42px;
 white-space: normal;
 word-wrap: break-word;
}
.weapon-tier {
 position: absolute;
 left: 0;
 bottom: 0;
 color: rgba(0,0,0,.5);
 font-size: 14px;
 white-space: nowrap;
}
.weapon-tier:before { /*dash*/
 content: '\2212';
 margin-right: 0.1em;
 display: none;
}

.weapon .ks-icon, .weapon .weapon-tier .part {
 line-height: 20px;
 margin: 1px;
 vertical-align: text-bottom;
 vertical-align: top;
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
 filter: alpha(opacity=70);
 opacity: 0.7;
}

.shstr {
 float: right;
 margin-bottom: 1px;
}
.sheen-icon {
 width: 20px;
 height: 20px;
 display: inline-block;
 border: 1px solid rgba(0,0,0,.4);
 vertical-align: top;
 border-radius: 2px;
 float: right;
}
.dash {
 font-size: 0.1px;
}
.fill-status, .trade-status, .market-prices {
 float: right;
 padding: 0 2px;
}

.market-prices {
 position: relative;
 cursor: default;
 z-index: 1;
}
.market-prices label {
 width: 20px;
 height: 21px;
 line-height: 18px;
 vertical-align: top;
 text-align: center;
}
.prices,
.market-prices:hover,
.market-prices:hover .prices {
 background-color: #EEE;
 z-index: 2;
}
.prices {
 display: none;
 position: absolute;
 right: 100%;
 top: 0;
 z-index: 1;
 box-shadow: -2px 1px 2px rgba(0,0,0,.05);
 text-align: right;
}
.market-prices:hover .prices {
 display: block;
}
.market-price {
 display: block;
 line-height: 19px;
 font-size: 14px;
 padding: 1px 2px;
 white-space: nowrap;
 text-decoration: none;
 color: inherit;
}
.market-price:hover {
 background-color: rgba(0,0,0,.05);
}
.market-price .part {
 margin: 0 3px;
 vertical-align: middle;
}
.market-price:before {
 content: 'n/a';
}
.market-price[data-amount]:before {
 content: attr(data-amount) "x";
}
.market-price[data-price-usd]:after {
 content: "$" attr(data-price-usd);
}

/* Fill status */
.fill-status {
 clear: right;
 text-align: center;
 cursor: default;
 color: inherit;
 position: relative;
 padding: 0;
 font: 14px/1 sans-serif;
 z-index: 1;
}
.filled {
 display: inline-block;
 vertical-align: top;
 line-height: 18px;
 border: 1px solid transparent;
}
.fill-status .filled:before {
 vertical-align: top;
 text-align: center;
 content: attr(data-filled);
 padding: 0 1px 0 2px;
 color: rgba(0,0,0,0.7);
 display: inline-block;
}
.fill-status .filled:after {
 float:left;
}
/*.ks-item:hover .fill-status,*/
.fill-status:hover,
.collapse-toggle:checked + .filled,
.fill-status .parts {
 background-color: #dEdEdE;
}

.fill-status:hover:after { /* seperator line to fake contineous background */
 width: 100%;
 position: absolute;
 left: 0;
 top: -1px;
 height: 1px;
 background-color: #888;
 font-size: 0.1;
 content: "";
 display: inline-block;
 display: none;
 z-index: 2;
}

.collapse-toggle:checked + .filled:after,
.fill-status:hover .filled:after {
 display: none;
}

.fill-status:hover .parts { display: block; }
.fill-status .parts {
 list-style: none outside none;
 display: none;
 text-align: center;
 position: absolute;
 color: inherit;
 margin: 0;
 padding: 0;
 top: 0;
 right: 100%;
 width: auto;
 white-space: nowrap;
 z-index: 1;
 margin-top: -15px;
 line-height: 1.2;
}
.fill-status .parts:before {
 display: block;
 content: 'Parts required';
 font: 12px/14px sans-serif;
 font-weight: bold;
 white-space: nowrap;
 color: inherit;
 vertical-align: top;
 background-color: rgba(0,0,0,0.05);
 padding: 0 15px 1px 2px;
 border-bottom: 1px solid rgba(33,33,33,0.07);
 margin-bottom: 1px;
 width: 100%;
}
.fill-status li {
 padding: 0 2px;
}
.fill-status .part {
 text-align: right;
 font-size: 12px;
 margin: 1px 2px;
 padding: 1px;
}
.parts .part + .part {
 margin-left: 3px;
}

[grade][data-unusual]:before,
[grade][data-strange]:before,
[data-strange][data-normal]:before,
[data-strange][data-genuine]:before,
[data-strange][data-haunted]:before,
[data-strange][data-unusual]:before,
[data-strange][data-vintage]:before,
[data-strange][data-community]:before,
[data-strange][data-selfmade]:before,
[data-strange][data-collectors]:before,
[data-strange][data-decorated]:before {
 content: '';
 display: inline-block;
 border: 0 none;
 border-left-width: 5px;
 border-style: solid;
 border-color: #CF6A32;
 top: 0;
 bottom: 50%;
 left: -5px;
 position: absolute;
}
[grade][data-strange][data-unusual]:before {
 border-color: #CF6A32 transparent #8650AC;
 border-width: 14px 0;
 width: 5px;
 top: 0;
 bottom: 66.6%;
}
[grade][data-unusual]:before {
 border-color: #8650AC;
}

.trade-icon {
 position: relative;
}
.trade-icon:before {
 content: '\21C6';
 font-size: 16px;
 line-height: inherit;
 vertical-align: top;
}
.trade-status:before {
 white-space:nowrap;
 font-size: 11px;
}
.trade-status[data-tooltip]:before {
 content: "Tradable in": attr(data-);
}
.untradable .trade-icon {
 color: #B3002D;
}
.temp-untradable .trade-icon {
 color: #B3002D;
}
.temp-untradable .trade-icon:after {
 font-family: "FontAwesome";
 content: '\f017'; /* Clock */
 font-size: 10px;
 line-height: 1;
 vertical-align: top;
 position: absolute;
 right: -3px;
 top: -3px;
 text-align: center;
 z-index: 0;
 color: rgba(0,0,120,.8); 
}

.nowrapper {
 margin-left: 0;
}

.custom .part:before { content: '\F031'; }
.custom .parts:before { content: '\F032'; }
.fi.bulb:before { content: '\f0eb'; } /* light bulb */
.fi.spart:before { content: '\f085'; } /* gears */
.fi.spart:before { content: '\f145'; } /* ticket */
.fi.spart:before { content: '\f12e'; } /* puzzle */
.fi.spell:before { content: '\f0c3'; } /* beaker */
.fi.particle:before { content: '\f1d1'; } /* empire? */
.fi.particle:before { content: '\f005'; } /* filled star */

.fi.drop:before { content: '\f043'; }
.fi.paint-brush:before { content: '\f1fc'; }

.target-item .fi:before { content: '\f127'; } /* chain-broken */
.target-item.available .fi:before { content: '\f0c1'; } /* chain/link */

.fill-status .part:after {
 left: auto;
 right: 0;
 top: auto;
 bottom: 0;
 margin: 0;
 border-color: transparent #444 transparent transparent;
 border-bottom-width: 0;
 border-right-width: 6px;
 border-style: outset;
}
.fill-status .part:before {
 left: auto;
 right: 0;
 top: 100%;
 bottom: auto;
 margin-bottom: 0;
 background-color: #EEE;
 background-color: #444444;
 border-radius: 0;
 color: rgba(0,0,0,0.65);
 color: rgba(255,255,255,0.65);
 transform: none;
}

.weapon > .sheen {
 font-size: 14px;
 margin-top: 20px;
 padding-right: 2px;
 position: absolute;
 right: 0;
 color: rgba(0, 0, 0, 0.5);
}

/* FAQ page */
.questions {
 max-width: 900px;
 padding: 0;
 margin: 0 auto;
 list-style: none outside none;
}
.question,
.answer-toggle:hover {
 background-color: rgba(0, 0, 0, 0.02);
}
.question + .question {
 margin-top: 4px;
}
.answer-toggle {
 font-size: 17px;
 line-height: 30px;
 display: block;
 position: relative;
 margin-left: 34px;
}
.answer-toggle:before {
 display: inline-block;
 background-color: rgba(0, 0, 0, 0.05);
 content: "?";
 font-family: sans-serif;
 font-size: 20px;
 font-weight: bold;
 height: 30px;
 height: 100%;
 line-height: 30px;
 overflow: hidden;
 text-align: center;
 vertical-align: top;
 width: 30px;
 position: absolute;
 left: -34px;
}
.answer {
 padding: 5px;
 background-color: rgba(0, 0, 0, 0.03);
}

.collapse-toggle:checked + .answer-toggle:before {
 content: '!';
}

.text-left { text-align: left; }

/*.weapon { position: relative; z-index: 0;}*/
.item-info {
 padding: 0;
 margin: 0;
 font-size: 16px;
 top: 21px;
 right: 0;
 position: absolute;
 vertical-align: bottom;
 list-style: none outside none;
}
.item-info > li {
 border: 1px solid transparent;
 vertical-align: top;
 margin: 0;
 min-width: 21px;
 padding: 0 3px;
 line-height: 21px;
 display: inline-block;
 text-align: center;
 cursor: default;
 color: rgba(0,0,0,.5);
}
.item-info .fi {
 line-height: 21px;
 vertical-align: top;
}
.item-info li:hover,
.item-info li:hover .info {
 background-color: #DEDEDE;
 box-shadow: 0 2px 1px rgba(0,0,0,.15);
 color: rgba(0,0,0,.8);
}
.item-info .info {
 display: none;
 position: absolute;
 text-align: left;
 z-index: 4;
 right: 0;
 bottom: 100%;
 width: auto;
 min-width: 120px;
 max-width: 400px;
 padding: 0 3px;
 font-size: 15px;
 line-height: 20px;
 word-wrap: break-word;
 white-space: normal;
 background-color: #DEDEDE;
}
.item-info .info div {
 white-space: nowrap;
}
.item-info li:focus .info,
.item-info li:active .info,
.item-info li:hover .info {
 display: block;
 box-shadow: 0 -2px 2px rgba(0,0,0,.15);
}
.item-info .info dd {
 margin-left: 0;
}
.spart sup {
 position: absolute;
 right: -30%;
 top: -30%;
}

.show-prices:checked ~ .filterable .market-prices {
 float: left;
 display: inline-block;
 padding: 0;
}
.show-prices:checked ~ .filterable .market-prices label {
 display: none;
}
.show-prices:checked ~ .filterable .prices {
 background-color: transparent;
 position: static;
 display: block;
 box-shadow: none;
 min-width: 100px;
}