Difference between revisions of "User:Lexar/Main Page/Template:Benjas/Page.css"

From Team Fortress Wiki
Jump to: navigation, search
m (hiding tf wiki logo on ipad sizing and lower)
m (maybe this rj)
 
(21 intermediate revisions by the same user not shown)
Line 12: Line 12:
 
body {
 
body {
 
background-color:#fff !important;
 
background-color:#fff !important;
}
 
#menu-768 {
 
display:none;
 
}
 
#mobile-menu {
 
display:none;
 
 
}
 
}
 
.wiki-box {
 
.wiki-box {
Line 480: Line 474:
 
html body {
 
html body {
 
background:#fff !important;
 
background:#fff !important;
}
 
#mobile-menu {
 
display: block;
 
width: 100%;
 
height: 50px;
 
position: fixed;
 
top: 0px;
 
right: 0px;
 
z-index: 15;
 
background: #c5922e;
 
background: -moz-linear-gradient(top, #c5922e 0%, #b34b0a 100%);
 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c5922e), color-stop(100%,#b34b0a));
 
background: -webkit-linear-gradient(top, #c5922e 0%,#b34b0a 100%);
 
background: -o-linear-gradient(top, #c5922e 0%,#b34b0a 100%);
 
background: -ms-linear-gradient(top, #c5922e 0%,#b34b0a 100%);
 
background: linear-gradient(to bottom, #c5922e 0%,#b34b0a 100%);
 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c5922e', endColorstr='#b34b0a',GradientType=0 );
 
}
 
#mobile-menu .mobile-menu-button {
 
float:left;
 
width: 49px;
 
height: 41px;
 
margin: 4px 8px 0px 8px;
 
cursor:pointer;
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') #df7c37 no-repeat 6px 7px;
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -moz-linear-gradient(top, #df7c37 0%, #edb554 100%);
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#df7c37), color-stop(100%,#edb554));
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -webkit-linear-gradient(top, #df7c37 0%,#edb554 100%);
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -o-linear-gradient(top, #df7c37 0%,#edb554 100%);
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -ms-linear-gradient(top, #df7c37 0%,#edb554 100%);
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, linear-gradient(to bottom, #df7c37 0%,#edb554 100%);
 
filter: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, progid:DXImageTransform.Microsoft.gradient( startColorstr='#df7c37', endColorstr='#edb554',GradientType=0 );
 
-webkit-border-radius: 3px;
 
-moz-border-radius: 3px;
 
border-radius: 3px;
 
}
 
#mobile-menu.menu-down .mobile-menu-button {
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') #df7c37 no-repeat 6px 7px; /* Old browsers */
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -moz-linear-gradient(top #edb554, 0%, #df7c37 100%); /* FF3.6+ */
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#edb554), color-stop(100%,#df7c37)); /* Chrome,Safari4+ */
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -webkit-linear-gradient(top, #edb554 0%,#df7c37 100%); /* Chrome10+,Safari5.1+ */
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -o-linear-gradient(top, #edb554 0%,#df7c37 100%); /* Opera 11.10+ */
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, -ms-linear-gradient(top, #edb554 0%,#df7c37 100%); /* IE10+ */
 
background: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, linear-gradient(to bottom, #edb554 0%,#df7c37 100%); /* W3C */
 
filter: url('/w/images/d/d3/User_Lexar_menu_button_back.png') no-repeat 6px 7px, progid:DXImageTransform.Microsoft.gradient( startColorstr='#edb554', endColorstr='#df7c37',GradientType=0 ); /* IE6-9 */
 
}
 
#mobile-menu #p-search {
 
background: none !important;
 
margin: 10px 0px 0px !important;
 
min-width: 87% !important;
 
float: right;
 
}
 
#mobile-menu #searchform {
 
float: left;
 
display: block;
 
height: 32px;
 
width: 100%;
 
}
 
#mobile-menu #simpleSearch {
 
float: left;
 
margin: 0px;
 
height:32px;
 
bottom: auto !important;
 
width: 100% !important;
 
}
 
#mobile-menu div#simpleSearch #searchInput {
 
margin: 0px !important;
 
height: 29px !important;
 
border: solid 1px #998D82 !important;
 
border-radius: 0px !important;
 
color: #555 !important;
 
background: #BCB3A9 !important;
 
text-indent: 5px;
 
font-size: 20px !important;
 
width: 77% !important;
 
float: left !important;
 
position: relative;
 
}
 
#mobile-menu div#simpleSearch #searchInput::-webkit-input-placeholder,
 
#mobile-menu div#simpleSearch #searchInput:-moz-placeholder,
 
#mobile-menu div#simpleSearch #searchInpu::-moz-placeholdert,
 
#mobile-menu div#simpleSearch #searchInput:-ms-input-placeholder {
 
color:#707070 !important;
 
}
 
#mobile-menu div#simpleSearch #searchButton {
 
width: 18% !important;
 
height: 31px !important;
 
float: left !important;
 
margin-left: 3%;
 
position: relative !important;
 
background: url('/w/images/7/76/User_Lexar_search-mobile.png') center top !important;
 
-webkit-border-radius: 3px;
 
-moz-border-radius: 3px;
 
border-radius: 3px;
 
min-width:100px;
 
 
}
 
}
 
#mw-panel .portal {
 
#mw-panel .portal {
 
display:none !important;
 
display:none !important;
 
}
 
}
#mobile-menu div#simpleSearch #searchButton:hover {
+
background-position:center -31px;
 
}
 
#mobile-menu ul {
 
position: absolute;
 
margin: 0px;
 
top: 50px;
 
left: 0px;
 
background: #FAEACF;
 
width: 100%;
 
display:none;
 
}
 
#mobile-menu.menu-down #mobile-ul-main {
 
display:block;
 
}
 
#mobile-menu ul li {
 
margin:0px;
 
}
 
#mobile-menu ul li h3 {
 
padding: 3px 4px;
 
padding-left: 17px;
 
font-size: 110%;
 
border-bottom: solid 1px #EDB554;
 
border-top: solid 1px #fff;
 
margin: 0px 18px;
 
background: no-repeat left 7px;
 
background-image: url('/w/images/0/01/User_Lexar_menu-arrow-up.png');
 
}
 
#mobile-menu ul li h3 a, #mobile-menu ul li h3 a:visited {
 
}
 
#mobile-menu ul li span {
 
font-size: 100%;
 
font-weight: bold;
 
color: #333;
 
display: block;
 
}
 
#mobile-menu ul li.down h3 {
 
background-image: url('/w/images/6/6b/User_Lexar_menu-arrow-down.png');
 
}
 
#mobile-menu ul li a {
 
 
}
 
#mobile-menu ul ul {
 
position: relative;
 
top: auto;
 
left: auto;
 
display: none;
 
margin: 0px 18px;
 
list-style: none;
 
float: left;
 
width: 94%;
 
}
 
#mobile-menu ul li.down ul {
 
display:block;
 
}
 
#mobile-menu ul ul li {
 
float: left;
 
margin: 0px;
 
padding: 1px 0px;
 
width: 45%;
 
}
 
#mobile-menu ul ul li span {
 
 
}
 
#mobile-menu ul ul li#pt-login {
 
background-position: left 6px;
 
}
 
#mobile-menu ul ul li#pt-userpage{   
 
margin: 0px;
 
    width: 45%;
 
    background-position: left 15px;
 
    padding: 10px 0px 0px;
 
}
 
#mobile-menu ul ul li#pt-notifications {
 
padding: 0px;
 
    width: 45%;
 
    float: left;
 
    margin: 6px 0px 0px;
 
}
 
#mobile-menu ul ul li#pt-userpage a {
 
margin:0px;
 
}
 
#mobile-menu ul ul li#pt-login a {
 
margin:0px;
 
}
 
#mobile-menu ul ul li a {
 
font-size: 90%;
 
display: block;
 
margin-left: 20px;
 
}
 
#mobile-menu ul li#personal-side h3 {
 
border-top:none;
 
}
 
#mobile-menu ul li#vwn-side h3 {
 
border-bottom:none;
 
}
 
#menu-768 {
 
display: block;
 
position: absolute;
 
padding: 4px 10px 3px;
 
right: 0px;
 
z-index:10;
 
line-height: 1.5;
 
top: 50px;
 
cursor: pointer;
 
background: #e5dcc9;
 
background: -moz-linear-gradient(top, #e5dcc9 0%, #9e947e 100%);
 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5dcc9), color-stop(100%,#9e947e));
 
background: -webkit-linear-gradient(top, #e5dcc9 0%,#9e947e 100%);
 
background: -ms-linear-gradient(top, #e5dcc9 0%,#9e947e 100%);
 
background: linear-gradient(to bottom, #e5dcc9 0%,#9e947e 100%);
 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5dcc9', endColorstr='#9e947e',GradientType=0 );
 
-webkit-border-bottom-right-radius: 5px;
 
-webkit-border-bottom-left-radius: 5px;
 
-moz-border-radius-bottomright: 5px;
 
-moz-border-radius-bottomleft: 5px;
 
border-bottom-right-radius: 5px;
 
border-bottom-left-radius: 5px;
 
}
 
#menu-768 span {
 
font-family: 'tf2 build', arial;
 
padding-right: 22px;
 
background: url('/w/images/f/fe/User_Lexar_menu_arrow.png') no-repeat right center;
 
}
 
#menu-768 ul {
 
display: none;
 
position: absolute;
 
right: 0px;
 
background: #333;
 
top: 33px;
 
margin: 0px;
 
list-style: none;
 
min-width: 100%;
 
padding: 5px 0px;
 
-webkit-border-radius: 5px;
 
-moz-border-radius: 5px;
 
border-radius: 5px;
 
}
 
#menu-768:hover ul {
 
display:block;
 
}
 
#menu-768 ul li {
 
}
 
#menu-768 ul li a, #menu-768 ul li a:visited, #menu-768 ul li a.selected, #menu-768 ul li a.selected:visited {
 
display: block;
 
font-size: 100%;
 
font-family: sans-serif;
 
color: #fff;
 
white-space: nowrap;
 
padding: 4px 15px;
 
}
 
#menu-768 ul li span {
 
background: none;
 
display: block;
 
}
 
 
#mw-head-base, #left-navigation, #right-navigation, #p-cactions, #p-personal {
 
#mw-head-base, #left-navigation, #right-navigation, #p-cactions, #p-personal {
 
display:none;
 
display:none;
Line 740: Line 485:
 
height:0px;
 
height:0px;
 
background:url(/w/images/d/d1/User_Lexar_responsive_header_back.png) repeat-x !important;
 
background:url(/w/images/d/d1/User_Lexar_responsive_header_back.png) repeat-x !important;
margin-top: 50px;
+
margin-top: 38px;
 
}
 
}
 
body.vector-animateLayout #p-logo {
 
body.vector-animateLayout #p-logo {
Line 772: Line 517:
 
margin: 30px 0px;
 
margin: 30px 0px;
 
margin-left: -2px;
 
margin-left: -2px;
 +
}
 +
/*update box*/
 +
.update-half {
 +
width:100%;
 +
margin:0px;
 
}
 
}
 
/*help table*/
 
/*help table*/
Line 794: Line 544:
 
clear:both;
 
clear:both;
 
height:50px;
 
height:50px;
}
 
}
 
@media screen and (max-width : 600px) {
 
#mobile-menu #p-search {
 
min-width: 82% !important;
 
}
 
#mobile-menu div#simpleSearch #searchInput {
 
width: 71% !important;
 
}
 
}
 
@media screen and (max-width : 550px) {
 
#mobile-menu ul ul li {
 
width:45%;
 
}
 
#mobile-menu ul ul li#pt-login {
 
width:40%;
 
}
 
}
 
@media screen and (max-width : 500px) {
 
#mobile-menu #p-search {
 
min-width: 78% !important;
 
}
 
#mobile-menu div#simpleSearch #searchInput {
 
width: 60% !important;
 
 
}
 
}
 
}
 
}
 
@media screen and (max-width : 480px) {
 
@media screen and (max-width : 480px) {
#mobile-menu #p-search {
 
max-width: 50% !important;
 
}
 
#mobile-menu div#simpleSearch #searchInput {
 
width: 47% !important;
 
}
 
 
.class-link-icon {
 
.class-link-icon {
 
width:50%;
 
width:50%;
Line 867: Line 587:
 
}
 
}
 
/*/help-table*/
 
/*/help-table*/
 +
}
 +
 +
/*mobile-menu css */
 +
 +
#mobile-menu {
 +
width: 100%;
 +
height: 38px;
 +
background: url("https://wiki.teamfortress.com/w/images/6/60/User_Lexar_bar-back.png") white repeat-x center top;
 +
position: fixed;
 +
z-index: 99;
 +
top: 0;
 +
left: 0;
 +
}
 +
#mobile-menu * {
 +
line-height:1;
 +
}
 +
 +
/*preload states*/
 +
.preloaders {
 +
width:0px;
 +
height:0px;
 +
overflow:hidden;
 +
position:absolute;
 +
top:0;
 +
left:0;
 +
}
 +
.general-hover, .menu-button, .search-over, .search-back {
 +
position:absolute;
 +
top:0;
 +
left:0;
 +
width:1px;
 +
height:2px;
 +
}
 +
.general-hover {
 +
background:url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png");
 +
}
 +
.menu-button {
 +
background:url("https://wiki.teamfortress.com/w/images/f/fa/User_Lexar_menu-button-hover2.png");
 +
}
 +
.search-over {
 +
background:url("https://wiki.teamfortress.com/w/images/c/c1/User_Lexar_search-out-hover.png");
 +
}
 +
.search-back {
 +
background:url("https://wiki.teamfortress.com/w/images/d/d2/User_Lexar_search-out-active.png");
 +
}
 +
 +
#mobile-menu .mobile-menu-button {
 +
  height: 100%;
 +
  float: left;
 +
  position: relative;
 +
  cursor: pointer;
 +
  background: url("https://wiki.teamfortress.com/w/images/1/1b/User_Lexar_menu-button2.png") repeat-x center top;
 +
  width: 50px;
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
}
 +
#mobile-menu .mobile-menu-button .button-bar {
 +
  float: left;
 +
  position: relative;
 +
  width: 36px;
 +
  height: 4px;
 +
  background: #c1c1c1;
 +
  margin-top: 6px;
 +
  margin-left: 10px;
 +
  clear: both;
 +
  display: none;
 +
}
 +
#mobile-menu .mobile-menu-button:hover, #mobile-menu .mobile-menu-button.active {
 +
  background: url("https://wiki.teamfortress.com/w/images/f/fa/User_Lexar_menu-button-hover2.png") repeat-x center top;
 +
}
 +
#mobile-menu #page-menu, #mobile-menu #account-menu {
 +
  background: url("https://wiki.teamfortress.com/w/images/6/60/User_Lexar_bar-back.png") repeat-x;
 +
  float: left;
 +
  margin-left: 12px;
 +
  height: 16px;
 +
  font-size: 16px;
 +
  padding: 9px 11px 13px;
 +
  color: #fff;
 +
  cursor: pointer;
 +
  font-family: /*TF2 Build, "TF2 Build",*/ Arial;
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
}
 +
#mobile-menu #account-menu > img {
 +
vertical-align:sub;
 +
}
 +
#mobile-menu #page-menu .arrow-anim, #mobile-menu #account-menu .arrow-anim {
 +
  display:inline;
 +
}
 +
#mobile-menu #page-menu .arrow-anim img, #mobile-menu #account-menu .arrow-anim img {
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
}
 +
#mobile-menu #account-menu:hover, #mobile-menu #account-menu.down, #mobile-menu #page-menu:hover, #mobile-menu #page-menu.down {
 +
  background: url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png") repeat-x;
 +
  -webkit-transition: all 500ms linear;
 +
  -moz-transition: all 500ms linear;
 +
  -o-transition: all 500ms linear;
 +
  -ms-transition: all 500ms linear;
 +
  transition: all 500ms linear;
 +
}
 +
#mobile-menu .down .arrow-anim img {
 +
  -moz-transform: rotate(90deg);
 +
  -webkit-transform: rotate(90deg);
 +
  -o-transform: rotate(90deg);
 +
  -ms-transform: rotate(90deg);
 +
  transform: rotate(90deg);
 +
}
 +
#mobile-menu #account-list, #mobile-menu #tab-menu {
 +
  list-style: none;
 +
  padding: 0px;
 +
  float: left;
 +
  margin-left: 12px;
 +
  max-height: 0px;
 +
  display: block;
 +
  position: absolute;
 +
  overflow: hidden;
 +
  background: #b5b5b5;
 +
  top: 38px;
 +
  height: 38px;
 +
  left: 0px;
 +
  width: 100%;
 +
  margin: 0px;
 +
  -webkit-transition: all 100ms linear;
 +
  -moz-transition: all 100ms linear;
 +
  -o-transition: all 100ms linear;
 +
  -ms-transition: all 100ms linear;
 +
  transition: all 100ms linear;
 +
}
 +
#mobile-menu #account-list li, #mobile-menu #tab-menu li {
 +
  float: left;
 +
  position: relative;
 +
  background: #b5b5b5;
 +
  -webkit-transition: background-image 250ms linear;
 +
  -moz-transition: background-image 250ms linear;
 +
  -o-transition: background-image 250ms linear;
 +
  -ms-transition: background-image 250ms linear;
 +
  transition: background-image 250ms linear;
 +
}
 +
#mobile-menu #account-list li span, #mobile-menu #tab-menu li span {
 +
  float: left;
 +
  display: block;
 +
}
 +
#mobile-menu #account-list li a, #mobile-menu #tab-menu li a {
 +
  height: 38px;
 +
  box-sizing: border-box;
 +
  color: #fff;
 +
  text-decoration: none;
 +
  font-family: /*TF2 Build, "TF2 Build",*/ Arial;
 +
  font-size: 14px;
 +
  padding: 11px 11px 12px;
 +
  display: block;
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
}
 +
#mobile-menu #account-list li span a:hover, #mobile-menu #tab-menu li span a:hover {
 +
  -webkit-transition: all 500ms linear;
 +
  -moz-transition: all 500ms linear;
 +
  -o-transition: all 500ms linear;
 +
  -ms-transition: all 500ms linear;
 +
  transition: all 500ms linear;
 +
}
 +
#mobile-menu #account-list li.f-right, #mobile-menu #tab-menu li.f-right {
 +
  float: right;
 +
}
 +
#mobile-menu #account-list li:hover, #mobile-menu #tab-menu li:hover {
 +
  background: url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png") repeat-x;
 +
  -webkit-transition: background-image 250ms linear;
 +
  -moz-transition: background-image 250ms linear;
 +
  -o-transition: background-image 250ms linear;
 +
  -ms-transition: background-image 250ms linear;
 +
  transition: background-image 250ms linear;
 +
}
 +
#mobile-menu #account-list li.selected, #mobile-menu #tab-menu li.selected {
 +
  background: url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png") repeat-x;
 +
}
 +
#mobile-menu #account-list.down, #mobile-menu #tab-menu.down {
 +
  display: block;
 +
  height: 38px;
 +
  z-index: 5;
 +
  -webkit-transition: all 100ms linear;
 +
  -moz-transition: all 100ms linear;
 +
  -o-transition: all 100ms linear;
 +
  -ms-transition: all 100ms linear;
 +
  transition: all 100ms linear;
 +
  max-height: 40px;
 +
}
 +
#mobile-menu #search-expand {
 +
  float: right;
 +
  position: relative;
 +
  width: 64px;
 +
  height: 38px;
 +
  background: url("https://wiki.teamfortress.com/w/images/e/ed/User_Lexar_search-out.png") no-repeat;
 +
  background-color: transparent;
 +
  cursor: pointer;
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
  display: block;
 +
}
 +
#mobile-menu #search-expand:hover {
 +
  background: url("https://wiki.teamfortress.com/w/images/c/c1/User_Lexar_search-out-hover.png") no-repeat;
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
}
 +
#mobile-menu #search-expand.out {
 +
  background: url("https://wiki.teamfortress.com/w/images/d/d2/User_Lexar_search-out-active.png") no-repeat;
 +
}
 +
#mobile-menu #p-search {
 +
display: block;
 +
overflow: hidden;
 +
height: 38px !important;
 +
float: right;
 +
margin: 0px !important;
 +
width: 0px !important;
 +
max-width: none !important;
 +
background: none !important;
 +
-webkit-transition: all 250ms linear;
 +
-moz-transition: all 250ms linear;
 +
-o-transition: all 250ms linear;
 +
-ms-transition: all 250ms linear;
 +
transition: all 250ms linear;
 +
}
 +
#mobile-menu #p-search #searchform {
 +
margin: 0px;
 +
position: relative;
 +
height: 38px;
 +
margin-top: 18px !important;
 +
}
 +
#mobile-menu #p-search.out {
 +
  width: 65% !important;
 +
  -webkit-transition: all 250ms linear;
 +
  -moz-transition: all 250ms linear;
 +
  -o-transition: all 250ms linear;
 +
  -ms-transition: all 250ms linear;
 +
  transition: all 250ms linear;
 +
}
 +
#mobile-menu div#simpleSearch {
 +
position: absolute;
 +
float: left;
 +
left: 0px;
 +
top: 0px;
 +
width: 100% !important;
 +
margin: 0px !important;
 +
height: 38px;
 +
background: none !important;
 +
}
 +
#mobile-menu div#simpleSearch #searchInput {
 +
margin: 0px !important;
 +
border: 0px !important;
 +
height: 38px !important;
 +
width: 70% !important;
 +
box-sizing: border-box;
 +
padding: 0px 10px !important;
 +
float: left;
 +
background: #eaeaea !important;
 +
color: #565656 !important;
 +
border-radius: 0px !important;
 +
}
 +
#mobile-menu div#simpleSearch #searchButton {
 +
float: right !important;
 +
width: 30% !important;
 +
height: 38px !important;
 +
border: 0 !important;
 +
text-align: center;
 +
cursor: pointer !important;
 +
background: #cdcdcd !important;
 +
font-weight: bold;
 +
font-size: 18px;
 +
text-transform: uppercase;
 +
color: #565656;
 +
font-family: TF2 Build, "TF2 Build", Arial;
 +
margin: 0px !important;
 +
text-indent: 0px !important;
 +
top: auto !important;
 +
right: auto !important;
 +
}
 +
#mobile-menu #mobile-ul-main {
 +
  max-height: 0px;
 +
  overflow: hidden;
 +
  position: absolute;
 +
  top: 38px;
 +
  left: 0px;
 +
  margin: 0;
 +
  padding: 0;
 +
  list-style: none;
 +
  width: 100%;
 +
  background: url(/w/images/c/ce/Leyen_tab_center.png) #F1EFEE repeat-x;
 +
  -webkit-transition: all 500ms linear;
 +
  -moz-transition: all 500ms linear;
 +
  -o-transition: all 500ms linear;
 +
  -ms-transition: all 500ms linear;
 +
  transition: all 500ms linear;
 +
}
 +
#mobile-menu #mobile-ul-main li {
 +
margin:0px !important;
 +
}
 +
#mobile-menu #mobile-ul-main li h3 {
 +
  margin: 0px !important;
 +
  padding: 5px 22px 7px;
 +
  line-height: 1;
 +
  padding-left: 22px;
 +
  height: 15px;
 +
  cursor: pointer;
 +
  border-top:solid 1px #F1EFEE;
 +
}
 +
#mobile-menu #mobile-ul-main li h3 #main-menu-hover, #mobile-menu #mobile-ul-main li h3:hover #main-menu-no-hover, #mobile-menu #mobile-ul-main li h3.down #main-menu-no-hover {
 +
display:none;
 +
}
 +
#mobile-menu #mobile-ul-main li h3:hover #main-menu-hover, #mobile-menu #mobile-ul-main li h3 #main-menu-no-hover, #mobile-menu #mobile-ul-main li h3.down #main-menu-hover {
 +
display:inline;
 +
}
 +
#mobile-menu #mobile-ul-main li h3 a, #mobile-menu #mobile-ul-main li h3 span {
 +
  font-size: 15px;
 +
  color: #838383;
 +
  font-weight: normal;
 +
  height: 15px;
 +
  text-decoration: none;
 +
  cursor: pointer;
 +
}
 +
#mobile-menu #mobile-ul-main li h3 img {
 +
  -webkit-transition: all 150ms linear;
 +
  -moz-transition: all 150ms linear;
 +
  -o-transition: all 150ms linear;
 +
  -ms-transition: all 150ms linear;
 +
  transition: all 150ms linear;
 +
  vertical-align:baseline;
 +
}
 +
#mobile-menu #mobile-ul-main li h3:hover, #mobile-menu #mobile-ul-main li h3.down {
 +
background: #a09c96; /* Old browsers */
 +
background: -moz-linear-gradient(top, #a09c96 0%, #787571 100%); /* FF3.6+ */
 +
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a09c96), color-stop(100%,#787571)); /* Chrome,Safari4+ */
 +
background: -webkit-linear-gradient(top, #a09c96 0%,#787571 100%); /* Chrome10+,Safari5.1+ */
 +
background: -o-linear-gradient(top, #a09c96 0%,#787571 100%); /* Opera 11.10+ */
 +
background: -ms-linear-gradient(top, #a09c96 0%,#787571 100%); /* IE10+ */
 +
background: linear-gradient(to bottom, #a09c96 0%,#787571 100%); /* W3C */
 +
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a09c96', endColorstr='#787571',GradientType=0 ); /* IE6-9 */
 +
border-top:solid 1px #878079;
 +
}
 +
#mobile-menu #mobile-ul-main li h3:hover span, #mobile-menu #mobile-ul-main li h3.down span {
 +
color:#fff;
 +
}
 +
#mobile-menu #mobile-ul-main li h3.down {
 +
  margin-bottom: 1px;
 +
}
 +
#mobile-menu #mobile-ul-main li h3.down img {
 +
  -moz-transform: rotate(90deg);
 +
  -webkit-transform: rotate(90deg);
 +
  -o-transform: rotate(90deg);
 +
  -ms-transform: rotate(90deg);
 +
  transform: rotate(90deg);
 +
}
 +
#mobile-menu #mobile-ul-main ul {
 +
  display: block;
 +
  max-height: 0px;
 +
  overflow: hidden;
 +
  padding: 0px;
 +
  padding-left: 29px;
 +
  padding-top:0px;
 +
  margin:0px;
 +
  border-bottom: none;
 +
  -webkit-transition: all 500ms linear;
 +
  -moz-transition: all 500ms linear;
 +
  -o-transition: all 500ms linear;
 +
  -ms-transition: all 500ms linear;
 +
  transition: all 500ms linear;
 +
  background:url("/w/images/c/ce/Leyen_tab_center.png") #F1EFEE repeat-x;
 +
}
 +
#mobile-menu #mobile-ul-main ul li {
 +
  list-style: none;
 +
  float: left;
 +
  display: block;
 +
}
 +
#mobile-menu #mobile-ul-main ul li a {
 +
  display: block;
 +
  color: #838383;
 +
  text-decoration: none;
 +
  padding: 4px 15px;
 +
  font-size: 14px;
 +
}
 +
#mobile-menu #mobile-ul-main ul li a:hover {
 +
  background: #c5c5c5;
 +
}
 +
#mobile-menu #mobile-ul-main ul .clearing {
 +
  height: 0;
 +
  clear: both;
 +
}
 +
#mobile-menu #mobile-ul-main .clearing {
 +
  height: 0;
 +
  clear: both;
 +
}
 +
#mobile-menu #mobile-ul-main ul.open {
 +
  max-height: 100px;
 +
  -webkit-transition: all 500ms linear;
 +
  -moz-transition: all 500ms linear;
 +
  -o-transition: all 500ms linear;
 +
  -ms-transition: all 500ms linear;
 +
  transition: all 500ms linear;
 +
  display: block;
 +
  padding: 0px;
 +
  padding-left: 29px;
 +
  padding-top:1px;
 +
}
 +
#mobile-menu #mobile-ul-main.down {
 +
z-index: 5;
 +
max-height: 300px;
 +
-webkit-transition: all 500ms linear;
 +
-moz-transition: all 500ms linear;
 +
-o-transition: all 500ms linear;
 +
-ms-transition: all 500ms linear;
 +
transition: all 500ms linear;
 +
padding-bottom: 10px;
 +
border-bottom: solid 4px #878079;
 +
}
 +
 +
 +
@media screen and (min-width : 769px) {
 +
#mobile-menu {
 +
display:none;
 +
}
 
}
 
}

Latest revision as of 12:26, 3 November 2014

.main-area  a, .main-area  a:visited, .main-area  a.external, .main-area  a.external:visited {
	color:#b96518;
	text-decoration:none;
}
.main-area a:hover {
	text-decoration:underline;
}
.clearing {
	clear:both;
	height:0px;
}
body {
	background-color:#fff !important;
}
.wiki-box {
	border:solid #4f4945 2px;
	padding:14px 2%;
	margin: 10px -2px;
	width: 96%;
	position:relative;
	font-size:100%;
	background: url('/w/images/3/3c/User_Lexar_block_back.png') repeat-x center top #F1F1F1;
}
.wiki-box .wiki-title {
	font-family: blackoak std, arial, sans-serif;
	font-size: 18px;
	position: absolute;
	background: #fff;
	display: block;
	padding: 7px 10px;
	height: 19px;
	top: -24px;
	left: 0px;
}
.wiki-cols {
	width:100%;
	margin:0 auto;
}
.half-box {
	width:45%;
	float:left;
	margin:20px -2px 20px;
}
.half-box-footer {
	width: 100%;
	height: auto;
	border-top: #b96518 solid 1px;
	padding: 4px 0px 0px;
	text-align:center;
}
.half-box-footer a, .half-box-footer a:visited {
	font-size:12px;
	font-weight:bold;
	text-shadow:1px 2px 1px #bababa;
}
.right-box {
	float:right;
	margin-left:1%;
}
#content, #p-cactions li.selected {
	background:#999;
}
#content, #p-cactions li.selected span {
	background:none !important;
}
#content, #p-cactions li.selected span a {
	background:none !important;
}

/*header*/
#wiki-logo-area {
	float:left;
}
#wiki-logo-area img {
	max-width:100%;
	height:auto;
}
#article-count {
	font-size:85%;
	text-align:center;
	margin-top:7px;
}
#article-count a {
	font-size:inherit;
}
#header-bullets {
	float:right;
	width:40%;
	margin:10px 0px;
	min-width:480px;
}
#header-bullets ul {
	float:right;
	width:100%;
	list-style:none;
	margin:0px;
	padding:0px;
}
#header-bullets ul li {
	float: left;
	width: 27%;
	white-space: nowrap;
	padding: 0px 3%;
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAANAQMAAABb8jbLAAAABlBMVEX///8AUow5QSOjAAAAAXRSTlMAQObYZgAAABNJREFUCB1jYEABBQw/wLCAgQEAGpIDyT0IVcsAAAAASUVORK5CYII=') no-repeat scroll 0% 1px transparent;
	line-height: 1.5;
}
#header-bullets ul .breaker {
	clear:both;
	background:none;
	padding:0px;
	width:100%;
}
#header-bullets ul li a, #header-bullets ul li a.external {
	display:block;
	float:left;
	font-size:110%;
	font-weight:bold;
	background:none;
}
/*/header*/

/*language*/
.lang-box {
	text-align:center;
}
/*/language*/

/*network*/
.network-box {
	text-align:center;
}
.network-box .wiki-title {
	position: relative;
	display: inline;
	margin: 0px 0px;
	top: -30px;
}
.network-box span {
	float: left;
	width: 25%;
	text-align: center;
}
#content .network-box span a.external, #content .network-box span a.external {
	display: block;
	width: auto;
	background: none;
	text-align: center;
	float: none;
}
.network-box span {
	display: block;
	font-weight: bold;
	margin-top:-20px;
}
.network-box span span {
	display: block;
	width: 100%;
	margin-top:0px;
}
.network-clear {
	display:none;
}
/*/network*/


/*classes 2*/
.class-box2 {
	background: url(/w/images/4/4c/User_Lexar_nav_back_classess.png) #7E7D78 no-repeat center top;
}
.class-link-icon {
	float: left;
	display: block;
	width: 11%;
}
.class-box2 .class-link-icon a, .class-box2 .class-link-icon a:visited {
	float: left;
	width: 100%;
	text-align: center;
	color: #D4D1C9;
	font-weight: bold;
	min-width: 80px;
	display: block;
	text-decoration: none;
}
.class-box2 .class-link-icon a:hover {
	color: #E4A356;
	background-position: center -85px;
}
.class-name-icon {
	display: block;
	padding-top: 60px;
	height: 15px;
}
.scout-icon a {
	background: url('/w/images/f/fe/User_Lexar_scout.png') no-repeat center 4px;
}
.soldier-icon a {
	background: url('/w/images/e/e0/User_Lexar_solly.png') no-repeat center 4px;
}
.pyro-icon a {
	background: url('/w/images/1/1f/User_Lexar_pyro.png') no-repeat center 4px;
}
.demoman-icon a {
	background: url('/w/images/6/69/User_Lexar_demo.png') no-repeat center 4px;
}
.heavy-icon a {
	background: url('/w/images/e/e2/User_Lexar_heavy.png') no-repeat center 4px;
}
.engineer-icon a {
	background: url('/w/images/6/6c/User_Lexar_engy.png') no-repeat center 4px;
}
.medic-icon a {
	background: url('/w/images/2/2c/User_Lexar_medic.png') no-repeat center 4px;
}
.sniper-icon a {
	background: url('/w/images/e/ea/User_Lexar_sniper.png') no-repeat center 4px;
}
.spy-icon a {
	background: url('/w/images/a/a2/User_Lexar_spy.png') no-repeat center 4px;	
}
/*/classes 2*/

/*index*/
.index-box .index-link {
	display: block;
	width: 33%;
	text-align: center;
	float: left;
}
.index-link img {
	max-width:98%;
	height:auto;
}
.index-link span {
	display: block;
	font-weight: bold;
	font-size:110%;
}
.index-break {
	clear:both;
}
/*/index*/

/*updates*/
.update-half {
	width: 49%;
	float: left;
}
.update-sub-box {
	background: #D3D2D0;
	padding: 7px 10px;
	margin: 5px 0px;
	text-align: center;
	line-height: 1.5;
}
.update-sub-box div {
	text-align: center;
    font-weight: bold;
}
.update-sub-box div span {
	font-size: 110%;
}
.update-sub-box div.update-date {
	font-size: 95%;
    font-weight: lighter;
}
.wiki-cap {
	margin-left: 1%;
	text-align: center;
	margin: 5px 0px 5px 1%;
}
.wiki-cap span {
	display: block;
	margin: 20px 0px;
}
/*/updates*/

/*help table*/
.table-of-help {
	border:solid #4f4945 2px;
	margin:10px auto 30px;
	width:100%;
	background:url(img/wiki-box-back.png) #f1f1f1 repeat-x;
}
.table-left {
	float:left;
	width:70%;
	margin-right: -1px;
	border-right: 1px solid #ccc;
}
.table-right {
	float:left;
	width:30%;
}
.help-header-main {
	width: 100%;
	text-align: center;
	padding: 10px 0px;
	border-bottom:solid 1px #ccc;
	font-weight:bold;
}
.help-header-extra {
	width: 100%;
	text-align: center;
	padding: 10px 0px;
	border-bottom:solid 1px #ccc;
	font-weight:bold;
}
.table-main {
	display: table;
	width: 100%;
}
.table-main .section-main {
	display: table-row;
}
.table-main .section-main .section-title {
	display: table-cell;
	vertical-align: middle;
	width: 20%;
	text-align: center;
	margin-right: -1px;
	border-right: 1px solid #ccc;
	font-size:11px;
	font-weight:bold;
	border-bottom: solid 1px #ccc;
}
.table-main .section-main a, .table-main .section-main a:visited {
	font-size:11px;
}
.table-main .section-main .row-group {
	display: table-cell;
}
.table-main .section-row{
	padding: 0px;
	display: table;
	width: 100%;
	text-align: left;
	border-bottom: solid 1px #ccc;
	min-height: 27px;
	vertical-align: middle;
	line-height:1.5;
}
.table-main .section-row .section-subtitle {
	display: table-cell;
	padding: 4px 13px;
	text-align: right;
	width:25%;
	vertical-align:middle;
	font-size:11px;
	font-weight:bold;
}
.table-main .section-row .section-cell {
	display:table-cell;
	vertical-align:middle;
	padding:5px 10px;
	font-size:11px;
}
.quicklinks {
	text-align: center;
	margin-bottom: 20px;
	line-height: 1.35;
}
div#content .quicklinks p {
	margin:0px;
}
.table-of-help .table-right a, .table-of-help .table-right a:visited {
	font-size:13px;
}
/*/help-table*/

@media screen and (max-width : 1070px) {
	#wiki-logo-area,
	#header-bullets  {
		width:100%;
		text-align:center;
		margin:0 auto;
		float:none;
	}
	#header-bullets {
		margin-top:10px;
		min-width:inherit;
	}
	#header-bullets ul li {
		display: inline-block;
		width: auto;
		float: none;
		line-height: 1;
		padding: 0px 0px 0px 10px;
		margin: 3px 0px 2px 10px;
		background-position: 0px -3px;
	}
	#header-bullets ul li a, #header-bullets ul li a.external {
		display: block;
	}
	#header-bullets ul .breaker {
		width: 100%;
		height: 0px;
		display: block;
	}
	#header-bullets ul .breaker {
		display:none;
	}
}

@media screen and (max-width : 1000px) {
	.class-link-icon {
		min-width: 95px;
		width:33%;
		margin:10px 0px;
	}
}
@media screen and (max-width : 950px) and (min-width : 769px) {
	.half-box {
		width: 96%;
		float: none;
		margin: 30px 0px;
		margin-left: -2px;
	}
	/*help table*/
	.table-left {
		width:100%;
		border-right:none;
	}
	.table-right {
		width:100%;
	}
	.quicklinks {
		width: 50%;
		float: left;
		margin-bottom: 20px;
	}
	/*/help-table*/
}
@media screen and (max-width : 800px) and (min-width : 769px) {
	/*help table*/
	.table-left {
		border-right:none;
	}
	.table-main .section-main {
		display: block;
	}
	.table-main .section-main .section-title {
		display: block;
		border-right: 0px;
		width: 100%;
		padding: 10px 0px;
		font-size:13px;
	}
	.table-main .section-main .row-group {
		display:block;
	}
	.table-main .section-row{
		display:block;
	}
	.table-main .section-row .section-subtitle {
		display: block;
		padding: 10px 0px;
		width: 100%;
		text-align: center;
		border-bottom: solid 1px #ccc;
	}
	.table-main .section-row .section-cell {
		display: block;
		text-align: center;
		padding: 5px;
	}
	.quicklinks {
	}
	.table-of-help .table-right a, .table-of-help .table-right a:visited {
	}
	/*/help-table*/
}
@media screen and (max-width : 768px) {
	html body {
		background:#fff !important;
	}
	#mw-panel .portal {
		display:none !important;
	}
	
	#mw-head-base, #left-navigation, #right-navigation, #p-cactions, #p-personal {
		display:none;
	}
	#mw-page-base {
		height:0px;
		background:url(/w/images/d/d1/User_Lexar_responsive_header_back.png) repeat-x !important;
		margin-top: 38px;
	}
	body.vector-animateLayout #p-logo {
		background: none !important;
		margin-top: 50px;
		display:none;
	}
	#mw-panel.collapsible-nav .portal {
		display:none !important;
	}
	body div#content {
		margin-left: 0em !important;
	    position: relative;
	    z-index: 1;
		border-left: none !important;
	}
	div.vectorTabs ul li.selected {
		z-index:3;
		position:relative;
	}
	body.vector-animateLayout div#footer {
		margin-left: 0px !important;
	    z-index: 1;
	    position: relative;
	}
}
@media screen and (max-width : 650px) {
	.half-box {
		width: 96%;
		float: none;
		margin: 30px 0px;
		margin-left: -2px;
	}
	/*update box*/
	.update-half {
		width:100%;
		margin:0px;
	}
	/*help table*/
	.table-left {
		width:100%;
		border-right:none;
	}
	.table-right {
		width:100%;
	}
	.quicklinks {
		width: 50%;
		float: left;
		margin-bottom: 20px;
	}
	/*/help-table*/
	.network-box span {
		width:50%;
	}
	.network-clear {
		display:block;
		clear:both;
		height:50px;
	}
}
@media screen and (max-width : 480px) {
	.class-link-icon {
		width:50%;
	}
	/*help table*/
	.table-left {
		border-right:none;
	}
	.table-main .section-main {
		display: block;
	}
	.table-main .section-main .section-title {
		display: block;
		border-right: 0px;
		width: 100%;
		padding: 10px 0px;
		font-size:13px;
	}
	.table-main .section-main .row-group {
		display:block;
	}
	.table-main .section-row{
		display:block;
	}
	.table-main .section-row .section-subtitle {
		display: block;
		padding: 10px 0px;
		width: 100%;
		text-align: center;
		border-bottom: solid 1px #ccc;
	}
	.table-main .section-row .section-cell {
		display: block;
		text-align: center;
		padding: 5px;
	}
	.quicklinks {
	}
	.table-of-help .table-right a, .table-of-help .table-right a:visited {
	}
	/*/help-table*/
}

/*mobile-menu css */

#mobile-menu {
	width: 100%;
	height: 38px;
	background: url("https://wiki.teamfortress.com/w/images/6/60/User_Lexar_bar-back.png") white repeat-x center top;
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
}
#mobile-menu * {
	line-height:1;
}

/*preload states*/
.preloaders {
	width:0px;
	height:0px;
	overflow:hidden;
	position:absolute;
	top:0;
	left:0;
}
.general-hover, .menu-button, .search-over, .search-back {
	position:absolute;
	top:0;
	left:0;
	width:1px;
	height:2px;
}
.general-hover {
	background:url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png");
}
.menu-button {
	background:url("https://wiki.teamfortress.com/w/images/f/fa/User_Lexar_menu-button-hover2.png");
}
.search-over {
	background:url("https://wiki.teamfortress.com/w/images/c/c1/User_Lexar_search-out-hover.png");
}
.search-back {
	background:url("https://wiki.teamfortress.com/w/images/d/d2/User_Lexar_search-out-active.png");
}

#mobile-menu .mobile-menu-button {
  height: 100%;
  float: left;
  position: relative;
  cursor: pointer;
  background: url("https://wiki.teamfortress.com/w/images/1/1b/User_Lexar_menu-button2.png") repeat-x center top;
  width: 50px;
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
}
#mobile-menu .mobile-menu-button .button-bar {
  float: left;
  position: relative;
  width: 36px;
  height: 4px;
  background: #c1c1c1;
  margin-top: 6px;
  margin-left: 10px;
  clear: both;
  display: none;
}
#mobile-menu .mobile-menu-button:hover, #mobile-menu .mobile-menu-button.active {
  background: url("https://wiki.teamfortress.com/w/images/f/fa/User_Lexar_menu-button-hover2.png") repeat-x center top; 
}
#mobile-menu #page-menu, #mobile-menu #account-menu {
  background: url("https://wiki.teamfortress.com/w/images/6/60/User_Lexar_bar-back.png") repeat-x;
  float: left;
  margin-left: 12px;
  height: 16px;
  font-size: 16px;
  padding: 9px 11px 13px;
  color: #fff;
  cursor: pointer;
  font-family: /*TF2 Build, "TF2 Build",*/ Arial;
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
}
#mobile-menu #account-menu > img {
	vertical-align:sub;
}
#mobile-menu #page-menu .arrow-anim, #mobile-menu #account-menu .arrow-anim {
  display:inline;
}
#mobile-menu #page-menu .arrow-anim img, #mobile-menu #account-menu .arrow-anim img {
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
}
#mobile-menu #account-menu:hover, #mobile-menu #account-menu.down, #mobile-menu #page-menu:hover, #mobile-menu #page-menu.down {
  background: url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png") repeat-x;
  -webkit-transition: all 500ms linear;
  -moz-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  -ms-transition: all 500ms linear;
  transition: all 500ms linear;
}
#mobile-menu .down .arrow-anim img {
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#mobile-menu #account-list, #mobile-menu #tab-menu {
  list-style: none;
  padding: 0px;
  float: left;
  margin-left: 12px;
  max-height: 0px;
  display: block;
  position: absolute;
  overflow: hidden;
  background: #b5b5b5;
  top: 38px;
  height: 38px;
  left: 0px;
  width: 100%;
  margin: 0px;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  -ms-transition: all 100ms linear;
  transition: all 100ms linear;
}
#mobile-menu #account-list li, #mobile-menu #tab-menu li {
  float: left;
  position: relative;
  background: #b5b5b5;
  -webkit-transition: background-image 250ms linear;
  -moz-transition: background-image 250ms linear;
  -o-transition: background-image 250ms linear;
  -ms-transition: background-image 250ms linear;
  transition: background-image 250ms linear;
}
#mobile-menu #account-list li span, #mobile-menu #tab-menu li span {
  float: left;
  display: block;
}
#mobile-menu #account-list li a, #mobile-menu #tab-menu li a {
  height: 38px;
  box-sizing: border-box;
  color: #fff;
  text-decoration: none;
  font-family: /*TF2 Build, "TF2 Build",*/ Arial;
  font-size: 14px;
  padding: 11px 11px 12px;
  display: block;
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
}
#mobile-menu #account-list li span a:hover, #mobile-menu #tab-menu li span a:hover {
  -webkit-transition: all 500ms linear;
  -moz-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  -ms-transition: all 500ms linear;
  transition: all 500ms linear;
}
#mobile-menu #account-list li.f-right, #mobile-menu #tab-menu li.f-right {
  float: right;
}
#mobile-menu #account-list li:hover, #mobile-menu #tab-menu li:hover {
  background: url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png") repeat-x;
  -webkit-transition: background-image 250ms linear;
  -moz-transition: background-image 250ms linear;
  -o-transition: background-image 250ms linear;
  -ms-transition: background-image 250ms linear;
  transition: background-image 250ms linear;
}
#mobile-menu #account-list li.selected, #mobile-menu #tab-menu li.selected {
  background: url("https://wiki.teamfortress.com/w/images/3/38/User_Lexar_bar-back-hover.png") repeat-x;
}
#mobile-menu #account-list.down, #mobile-menu #tab-menu.down {
  display: block;
  height: 38px;
  z-index: 5;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  -ms-transition: all 100ms linear;
  transition: all 100ms linear;
  max-height: 40px;
}
#mobile-menu #search-expand {
  float: right;
  position: relative;
  width: 64px;
  height: 38px;
  background: url("https://wiki.teamfortress.com/w/images/e/ed/User_Lexar_search-out.png") no-repeat;
  background-color: transparent;
  cursor: pointer;
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
  display: block;
}
#mobile-menu #search-expand:hover {
  background: url("https://wiki.teamfortress.com/w/images/c/c1/User_Lexar_search-out-hover.png") no-repeat;
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
}
#mobile-menu #search-expand.out {
  background: url("https://wiki.teamfortress.com/w/images/d/d2/User_Lexar_search-out-active.png") no-repeat;
}
#mobile-menu #p-search {
	display: block;
	overflow: hidden;
	height: 38px !important;
	float: right;
	margin: 0px !important;
	width: 0px !important;
	max-width: none !important;
	background: none !important;
	-webkit-transition: all 250ms linear;
	-moz-transition: all 250ms linear;
	-o-transition: all 250ms linear;
	-ms-transition: all 250ms linear;
	transition: all 250ms linear;
}
#mobile-menu #p-search #searchform {
	margin: 0px;
	position: relative;
	height: 38px;
	margin-top: 18px !important;
}
#mobile-menu #p-search.out {
  width: 65% !important;
  -webkit-transition: all 250ms linear;
  -moz-transition: all 250ms linear;
  -o-transition: all 250ms linear;
  -ms-transition: all 250ms linear;
  transition: all 250ms linear;
}
#mobile-menu div#simpleSearch {
	position: absolute;
	float: left;
	left: 0px;
	top: 0px;
	width: 100% !important;
	margin: 0px !important;
	height: 38px;
	background: none !important;
}
#mobile-menu div#simpleSearch #searchInput {
	margin: 0px !important;
	border: 0px !important;
	height: 38px !important;
	width: 70% !important;
	box-sizing: border-box;
	padding: 0px 10px !important;
	float: left;
	background: #eaeaea !important;
	color: #565656 !important;
	border-radius: 0px !important;
}
#mobile-menu div#simpleSearch #searchButton {
	float: right !important;
	width: 30% !important;
	height: 38px !important;
	border: 0 !important;
	text-align: center;
	cursor: pointer !important;
	background: #cdcdcd !important;
	font-weight: bold;
	font-size: 18px;
	text-transform: uppercase;
	color: #565656;
	font-family: TF2 Build, "TF2 Build", Arial;
	margin: 0px !important;
	text-indent: 0px !important;
	top: auto !important;
	right: auto !important;
}
#mobile-menu #mobile-ul-main {
  max-height: 0px;
  overflow: hidden;
  position: absolute;
  top: 38px;
  left: 0px;
  margin: 0;
  padding: 0;
  list-style: none;
  width: 100%;
  background: url(/w/images/c/ce/Leyen_tab_center.png) #F1EFEE repeat-x;
  -webkit-transition: all 500ms linear;
  -moz-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  -ms-transition: all 500ms linear;
  transition: all 500ms linear;
}
#mobile-menu #mobile-ul-main li {
	margin:0px !important;
}
#mobile-menu #mobile-ul-main li h3 {
  margin: 0px !important;
  padding: 5px 22px 7px;
  line-height: 1;
  padding-left: 22px;
  height: 15px;
  cursor: pointer;
  border-top:solid 1px #F1EFEE;
}
#mobile-menu #mobile-ul-main li h3 #main-menu-hover, #mobile-menu #mobile-ul-main li h3:hover #main-menu-no-hover, #mobile-menu #mobile-ul-main li h3.down #main-menu-no-hover {
	display:none;
}
#mobile-menu #mobile-ul-main li h3:hover #main-menu-hover, #mobile-menu #mobile-ul-main li h3 #main-menu-no-hover, #mobile-menu #mobile-ul-main li h3.down #main-menu-hover {
	display:inline;
}
#mobile-menu #mobile-ul-main li h3 a, #mobile-menu #mobile-ul-main li h3 span {
  font-size: 15px;
  color: #838383;
  font-weight: normal;
  height: 15px;
  text-decoration: none;
  cursor: pointer;
}
#mobile-menu #mobile-ul-main li h3 img {
  -webkit-transition: all 150ms linear;
  -moz-transition: all 150ms linear;
  -o-transition: all 150ms linear;
  -ms-transition: all 150ms linear;
  transition: all 150ms linear;
  vertical-align:baseline;
}
#mobile-menu #mobile-ul-main li h3:hover, #mobile-menu #mobile-ul-main li h3.down {
	background: #a09c96; /* Old browsers */
	background: -moz-linear-gradient(top, #a09c96 0%, #787571 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a09c96), color-stop(100%,#787571)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #a09c96 0%,#787571 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #a09c96 0%,#787571 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #a09c96 0%,#787571 100%); /* IE10+ */
	background: linear-gradient(to bottom, #a09c96 0%,#787571 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a09c96', endColorstr='#787571',GradientType=0 ); /* IE6-9 */
	border-top:solid 1px #878079;
}
#mobile-menu #mobile-ul-main li h3:hover span, #mobile-menu #mobile-ul-main li h3.down span {
	color:#fff;
}
#mobile-menu #mobile-ul-main li h3.down {
  margin-bottom: 1px;
}
#mobile-menu #mobile-ul-main li h3.down img {
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#mobile-menu #mobile-ul-main ul {
  display: block;
  max-height: 0px;
  overflow: hidden;
  padding: 0px;
  padding-left: 29px;
  padding-top:0px;
  margin:0px;
  border-bottom: none;
  -webkit-transition: all 500ms linear;
  -moz-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  -ms-transition: all 500ms linear;
  transition: all 500ms linear;
  background:url("/w/images/c/ce/Leyen_tab_center.png") #F1EFEE repeat-x;
}
#mobile-menu #mobile-ul-main ul li {
  list-style: none;
  float: left;
  display: block;
}
#mobile-menu #mobile-ul-main ul li a {
  display: block;
  color: #838383;
  text-decoration: none;
  padding: 4px 15px;
  font-size: 14px;
}
#mobile-menu #mobile-ul-main ul li a:hover {
  background: #c5c5c5;
}
#mobile-menu #mobile-ul-main ul .clearing {
  height: 0;
  clear: both;
}
#mobile-menu #mobile-ul-main .clearing {
  height: 0;
  clear: both;
}
#mobile-menu #mobile-ul-main ul.open {
  max-height: 100px;
  -webkit-transition: all 500ms linear;
  -moz-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  -ms-transition: all 500ms linear;
  transition: all 500ms linear;
  display: block;
  padding: 0px;
  padding-left: 29px;
  padding-top:1px;
}
#mobile-menu #mobile-ul-main.down {
	z-index: 5;
	max-height: 300px;
	-webkit-transition: all 500ms linear;
	-moz-transition: all 500ms linear;
	-o-transition: all 500ms linear;
	-ms-transition: all 500ms linear;
	transition: all 500ms linear;
	padding-bottom: 10px;
	border-bottom: solid 4px #878079;
}


@media screen and (min-width : 769px) {
	#mobile-menu {
		display:none;
	}
}